yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

use workspace name element in data type workspace

Browse Source
This commit is contained in:
Mads Rasmussen
2024-09-27 13:36:00 +02:00
parent ec9a182e47
commit 8c394331f5
1 changed files with 3 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
src/Umbraco.Web.UI.Client/src/packages/data-type/workspace/data-type-workspace-editor.element.ts
View File

@@ -1,65 +1,15 @@
import { UMB_DATA_TYPE_WORKSPACE_CONTEXT } from './data-type-workspace.context-token.js';
import type { UUIInputElement } from '@umbraco-cms/backoffice/external/uui';
import { UUIInputEvent } from '@umbraco-cms/backoffice/external/uui';
import { css, html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit';
import { UmbLitElement, umbFocus } from '@umbraco-cms/backoffice/lit-element';
import type { ManifestWorkspace } from '@umbraco-cms/backoffice/workspace';
import { umbBindToValidation } from '@umbraco-cms/backoffice/validation';
import { css, html, customElement } from '@umbraco-cms/backoffice/external/lit';
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
/**
* @element umb-data-type-workspace-editor
* @description - Element for displaying the Data Type Workspace edit route.
*/
@customElement('umb-data-type-workspace-editor')
export class UmbDataTypeWorkspaceEditorElement extends UmbLitElement {
@property({ attribute: false })
manifest?: ManifestWorkspace;
@state()
private _dataTypeName = '';
#workspaceContext?: typeof UMB_DATA_TYPE_WORKSPACE_CONTEXT.TYPE;
constructor() {
super();
this.consumeContext(UMB_DATA_TYPE_WORKSPACE_CONTEXT, (workspaceContext) => {
this.#workspaceContext = workspaceContext;
this.#workspaceContext.createPropertyDatasetContext(this);
this.#observeName();
});
}
#observeName() {
if (!this.#workspaceContext) return;
this.observe(this.#workspaceContext.name, (dataTypeName) => {
if (dataTypeName !== this._dataTypeName) {
this._dataTypeName = dataTypeName ?? '';
}
});
}
// TODO. find a way where we don't have to do this for all Workspaces.
#handleInput(event: UUIInputEvent) {
if (event instanceof UUIInputEvent) {
const target = event.composedPath()[0] as UUIInputElement;
if (typeof target?.value === 'string') {
this.#workspaceContext?.setName(target.value);
}
}
}
override render() {
return html`
<umb-workspace-editor alias="Umb.Workspace.DataType">
<uui-input
slot="header"
id="nameInput"
.value=${this._dataTypeName ?? ''}
@input="${this.#handleInput}"
required
${umbBindToValidation(this, `$.name`, this._dataTypeName)}
${umbFocus()}></uui-input>
<umb-workspace-name slot="header"></umb-workspace-name>
</umb-workspace-editor>
`;
}
@@ -71,10 +21,6 @@ export class UmbDataTypeWorkspaceEditorElement extends UmbLitElement {
width: 100%;
height: 100%;
}
#nameInput {
flex: 1 1 auto;
}
`,
];
}