Skip to content

Commit 26e0fae

Browse files
madsrasmussenmadsrasmussen
committed
use name element
1 parent 00b4334 commit 26e0fae

File tree

8 files changed

+63
-234
lines changed

8 files changed

+63
-234
lines changed

‎src/packages/data-type/tree/folder/workspace/data-type-folder-editor.element.ts

Lines changed: 5 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,69 +1,17 @@
1-
import { UMB_DATA_TYPE_FOLDER_WORKSPACE_ALIAS } from './constants.js';
2-
import { UMB_DATA_TYPE_FOLDER_WORKSPACE_CONTEXT } from './data-type-folder.workspace.context-token.js';
3-
import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
4-
import type { UUIInputElement } from '@umbraco-cms/backoffice/external/uui';
5-
import { UUIInputEvent } from '@umbraco-cms/backoffice/external/uui';
6-
import { umbFocus, UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
1+
import { html, customElement } from '@umbraco-cms/backoffice/external/lit';
2+
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
73
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
8-
import { umbBindToValidation } from '@umbraco-cms/backoffice/validation';
94

105
const elementName = 'umb-data-type-folder-workspace-editor';
116
@customElement(elementName)
127
export class UmbDataTypeFolderWorkspaceEditorElement extends UmbLitElement {
13-
@state()
14-
private _name = '';
15-
16-
#workspaceContext?: typeof UMB_DATA_TYPE_FOLDER_WORKSPACE_CONTEXT.TYPE;
17-
18-
constructor() {
19-
super();
20-
21-
this.consumeContext(UMB_DATA_TYPE_FOLDER_WORKSPACE_CONTEXT, (workspaceContext) => {
22-
this.#workspaceContext = workspaceContext;
23-
this.#observeName();
24-
});
25-
}
26-
27-
#observeName() {
28-
if (!this.#workspaceContext) return;
29-
this.observe(this.#workspaceContext.name, (name) => {
30-
if (name !== this._name) {
31-
this._name = name ?? '';
32-
}
33-
});
34-
}
35-
36-
#handleInput(event: UUIInputEvent) {
37-
if (event instanceof UUIInputEvent) {
38-
const target = event.composedPath()[0] as UUIInputElement;
39-
40-
if (typeof target?.value === 'string') {
41-
this.#workspaceContext?.setName(target.value);
42-
}
43-
}
44-
}
45-
468
override render() {
47-
return html`<umb-workspace-editor alias=${UMB_DATA_TYPE_FOLDER_WORKSPACE_ALIAS}>
48-
<uui-input
49-
slot="header"
50-
id="nameInput"
51-
.value=${this._name ?? ''}
52-
@input="${this.#handleInput}"
53-
required
54-
${umbBindToValidation(this, `$.name`, this._name)}
55-
${umbFocus()}></uui-input>
9+
return html`<umb-workspace-editor>
10+
<umb-workspace-name slot="header"></umb-workspace-name>
5611
</umb-workspace-editor>`;
5712
}
5813

59-
static override styles = [
60-
UmbTextStyles,
61-
css`
62-
#nameInput {
63-
flex: 1 1 auto;
64-
}
65-
`,
66-
];
14+
static override styles = [UmbTextStyles];
6715
}
6816

6917
export { UmbDataTypeFolderWorkspaceEditorElement as element };

‎src/packages/data-type/tree/folder/workspace/data-type-folder-workspace.context.ts

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,13 +37,22 @@ export class UmbDataTypeFolderWorkspaceContext
3737
}
3838

3939
/**
40-
* @description Set the name of the script
40+
* @description Set the name of the data type folder
4141
* @param {string} value
42-
* @memberof UmbScriptWorkspaceContext
42+
* @memberof UmbDataTypeFolderWorkspaceContext
4343
*/
4444
public setName(value: string) {
4545
this._data.updateCurrent({ name: value });
4646
}
47+
48+
/**
49+
* @description Get the name of the data type folder
50+
* @returns {string}
51+
* @memberof UmbDataTypeFolderWorkspaceContext
52+
*/
53+
public getName() {
54+
return this._data.getCurrent()?.name;
55+
}
4756
}
4857

4958
export { UmbDataTypeFolderWorkspaceContext as api };

‎src/packages/documents/document-blueprints/tree/folder/workspace/document-blueprint-folder-editor.element.ts

Lines changed: 4 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -1,68 +1,17 @@
1-
import { UMB_DOCUMENT_BLUEPRINT_FOLDER_WORKSPACE_CONTEXT } from './document-blueprint-folder.workspace.context-token.js';
2-
import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
3-
import type { UUIInputElement } from '@umbraco-cms/backoffice/external/uui';
4-
import { UUIInputEvent } from '@umbraco-cms/backoffice/external/uui';
5-
import { umbFocus, UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
1+
import { html, customElement } from '@umbraco-cms/backoffice/external/lit';
2+
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
63
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
7-
import { umbBindToValidation } from '@umbraco-cms/backoffice/validation';
84

95
const elementName = 'umb-document-blueprint-folder-workspace-editor';
106
@customElement(elementName)
117
export class UmbDocumentBlueprintFolderWorkspaceEditorElement extends UmbLitElement {
12-
@state()
13-
private _name = '';
14-
15-
#workspaceContext?: typeof UMB_DOCUMENT_BLUEPRINT_FOLDER_WORKSPACE_CONTEXT.TYPE;
16-
17-
constructor() {
18-
super();
19-
20-
this.consumeContext(UMB_DOCUMENT_BLUEPRINT_FOLDER_WORKSPACE_CONTEXT, (workspaceContext) => {
21-
this.#workspaceContext = workspaceContext;
22-
this.#observeName();
23-
});
24-
}
25-
26-
#observeName() {
27-
if (!this.#workspaceContext) return;
28-
this.observe(this.#workspaceContext.name, (name) => {
29-
if (name !== this._name) {
30-
this._name = name ?? '';
31-
}
32-
});
33-
}
34-
35-
#handleInput(event: UUIInputEvent) {
36-
if (event instanceof UUIInputEvent) {
37-
const target = event.composedPath()[0] as UUIInputElement;
38-
39-
if (typeof target?.value === 'string') {
40-
this.#workspaceContext?.setName(target.value);
41-
}
42-
}
43-
}
44-
458
override render() {
469
return html`<umb-workspace-editor>
47-
<uui-input
48-
slot="header"
49-
id="nameInput"
50-
.value=${this._name ?? ''}
51-
@input="${this.#handleInput}"
52-
required
53-
${umbBindToValidation(this, `$.name`, this._name)}
54-
${umbFocus()}></uui-input>
10+
<umb-workspace-name slot="header"></umb-workspace-name>
5511
</umb-workspace-editor>`;
5612
}
5713

58-
static override styles = [
59-
UmbTextStyles,
60-
css`
61-
#nameInput {
62-
flex: 1 1 auto;
63-
}
64-
`,
65-
];
14+
static override styles = [UmbTextStyles];
6615
}
6716

6817
export { UmbDocumentBlueprintFolderWorkspaceEditorElement as element };

‎src/packages/documents/document-blueprints/tree/folder/workspace/document-blueprint-folder-workspace.context.ts

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,13 +40,22 @@ export class UmbDocumentBlueprintFolderWorkspaceContext
4040
}
4141

4242
/**
43-
* @description Set the name of the script
43+
* @description Set the name of the document blueprint folder
4444
* @param {string} value
45-
* @memberof UmbScriptWorkspaceContext
45+
* @memberof UmbDocumentBlueprintFolderWorkspaceContext
4646
*/
4747
public setName(value: string) {
4848
this._data.updateCurrent({ name: value });
4949
}
50+
51+
/**
52+
* @description Get the name of the document blueprint folder
53+
* @returns {string}
54+
* @memberof UmbDocumentBlueprintFolderWorkspaceContext
55+
*/
56+
public getName() {
57+
return this._data.getCurrent()?.name;
58+
}
5059
}
5160

5261
export { UmbDocumentBlueprintFolderWorkspaceContext as api };

‎src/packages/documents/document-types/tree/folder/workspace/document-type-folder-editor.element.ts

Lines changed: 5 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,69 +1,17 @@
1-
import { UMB_DOCUMENT_TYPE_FOLDER_WORKSPACE_ALIAS } from './constants.js';
2-
import { UMB_DOCUMENT_TYPE_FOLDER_WORKSPACE_CONTEXT } from './document-type-folder.workspace.context-token.js';
3-
import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
4-
import type { UUIInputElement } from '@umbraco-cms/backoffice/external/uui';
5-
import { UUIInputEvent } from '@umbraco-cms/backoffice/external/uui';
6-
import { umbFocus, UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
1+
import { html, customElement } from '@umbraco-cms/backoffice/external/lit';
2+
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
73
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
8-
import { umbBindToValidation } from '@umbraco-cms/backoffice/validation';
94

105
const elementName = 'umb-document-type-folder-workspace-editor';
116
@customElement(elementName)
127
export class UmbDocumentTypeFolderWorkspaceEditorElement extends UmbLitElement {
13-
@state()
14-
private _name = '';
15-
16-
#workspaceContext?: typeof UMB_DOCUMENT_TYPE_FOLDER_WORKSPACE_CONTEXT.TYPE;
17-
18-
constructor() {
19-
super();
20-
21-
this.consumeContext(UMB_DOCUMENT_TYPE_FOLDER_WORKSPACE_CONTEXT, (workspaceContext) => {
22-
this.#workspaceContext = workspaceContext;
23-
this.#observeName();
24-
});
25-
}
26-
27-
#observeName() {
28-
if (!this.#workspaceContext) return;
29-
this.observe(this.#workspaceContext.name, (name) => {
30-
if (name !== this._name) {
31-
this._name = name ?? '';
32-
}
33-
});
34-
}
35-
36-
#handleInput(event: UUIInputEvent) {
37-
if (event instanceof UUIInputEvent) {
38-
const target = event.composedPath()[0] as UUIInputElement;
39-
40-
if (typeof target?.value === 'string') {
41-
this.#workspaceContext?.setName(target.value);
42-
}
43-
}
44-
}
45-
468
override render() {
47-
return html`<umb-workspace-editor alias=${UMB_DOCUMENT_TYPE_FOLDER_WORKSPACE_ALIAS}>
48-
<uui-input
49-
slot="header"
50-
id="nameInput"
51-
.value=${this._name ?? ''}
52-
@input="${this.#handleInput}"
53-
required
54-
${umbBindToValidation(this, `$.name`, this._name)}
55-
${umbFocus()}></uui-input>
9+
return html`<umb-workspace-editor>
10+
<umb-workspace-name slot="header"></umb-workspace-name>
5611
</umb-workspace-editor>`;
5712
}
5813

59-
static override styles = [
60-
UmbTextStyles,
61-
css`
62-
#nameInput {
63-
flex: 1 1 auto;
64-
}
65-
`,
66-
];
14+
static override styles = [UmbTextStyles];
6715
}
6816

6917
export { UmbDocumentTypeFolderWorkspaceEditorElement as element };

‎src/packages/documents/document-types/tree/folder/workspace/document-type-folder-workspace.context.ts

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,13 +40,22 @@ export class UmbDocumentTypeFolderWorkspaceContext
4040
}
4141

4242
/**
43-
* @description Set the name of the script
43+
* @description Set the name of the document type folder
4444
* @param {string} value
45-
* @memberof UmbScriptWorkspaceContext
45+
* @memberof UmbDocumentTypeFolderWorkspaceContext
4646
*/
4747
public setName(value: string) {
4848
this._data.updateCurrent({ name: value });
4949
}
50+
51+
/**
52+
* @description Get the name of the document type folder
53+
* @returns {string}
54+
* @memberof UmbDocumentTypeFolderWorkspaceContext
55+
*/
56+
public getName() {
57+
return this._data.getCurrent()?.name;
58+
}
5059
}
5160

5261
export { UmbDocumentTypeFolderWorkspaceContext as api };

‎src/packages/media/media-types/tree/folder/workspace/media-type-folder-editor.element.ts

Lines changed: 5 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,69 +1,17 @@
1-
import { UMB_MEDIA_TYPE_FOLDER_WORKSPACE_ALIAS } from './constants.js';
2-
import { UMB_MEDIA_TYPE_FOLDER_WORKSPACE_CONTEXT } from './media-type-folder.workspace.context-token.js';
3-
import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
4-
import type { UUIInputElement } from '@umbraco-cms/backoffice/external/uui';
5-
import { UUIInputEvent } from '@umbraco-cms/backoffice/external/uui';
6-
import { umbFocus, UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
1+
import { html, customElement } from '@umbraco-cms/backoffice/external/lit';
2+
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
73
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
8-
import { umbBindToValidation } from '@umbraco-cms/backoffice/validation';
94

105
const elementName = 'umb-media-type-folder-workspace-editor';
116
@customElement(elementName)
127
export class UmbMediaTypeFolderWorkspaceEditorElement extends UmbLitElement {
13-
@state()
14-
private _name = '';
15-
16-
#workspaceContext?: typeof UMB_MEDIA_TYPE_FOLDER_WORKSPACE_CONTEXT.TYPE;
17-
18-
constructor() {
19-
super();
20-
21-
this.consumeContext(UMB_MEDIA_TYPE_FOLDER_WORKSPACE_CONTEXT, (workspaceContext) => {
22-
this.#workspaceContext = workspaceContext;
23-
this.#observeName();
24-
});
25-
}
26-
27-
#observeName() {
28-
if (!this.#workspaceContext) return;
29-
this.observe(this.#workspaceContext.name, (name) => {
30-
if (name !== this._name) {
31-
this._name = name ?? '';
32-
}
33-
});
34-
}
35-
36-
#handleInput(event: UUIInputEvent) {
37-
if (event instanceof UUIInputEvent) {
38-
const target = event.composedPath()[0] as UUIInputElement;
39-
40-
if (typeof target?.value === 'string') {
41-
this.#workspaceContext?.setName(target.value);
42-
}
43-
}
44-
}
45-
468
override render() {
47-
return html`<umb-workspace-editor alias=${UMB_MEDIA_TYPE_FOLDER_WORKSPACE_ALIAS}>
48-
<uui-input
49-
slot="header"
50-
id="nameInput"
51-
.value=${this._name ?? ''}
52-
@input="${this.#handleInput}"
53-
required
54-
${umbBindToValidation(this, `$.name`, this._name)}
55-
${umbFocus()}></uui-input>
9+
return html`<umb-workspace-editor>
10+
<umb-workspace-name slot="header"></umb-workspace-name>
5611
</umb-workspace-editor>`;
5712
}
5813

59-
static override styles = [
60-
UmbTextStyles,
61-
css`
62-
#nameInput {
63-
flex: 1 1 auto;
64-
}
65-
`,
66-
];
14+
static override styles = [UmbTextStyles];
6715
}
6816

6917
export { UmbMediaTypeFolderWorkspaceEditorElement as element };

‎src/packages/media/media-types/tree/folder/workspace/media-type-folder-workspace.context.ts

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,13 +37,22 @@ export class UmbMediaTypeFolderWorkspaceContext
3737
}
3838

3939
/**
40-
* @description Set the name of the script
40+
* @description Set the name of the media type folder
4141
* @param {string} value
42-
* @memberof UmbScriptWorkspaceContext
42+
* @memberof UmbMediaTypeFolderWorkspaceContext
4343
*/
4444
public setName(value: string) {
4545
this._data.updateCurrent({ name: value });
4646
}
47+
48+
/**
49+
* @description Get the name of the media type folder
50+
* @returns {string}
51+
* @memberof UmbMediaTypeFolderWorkspaceContext
52+
*/
53+
public getName() {
54+
return this._data.getCurrent()?.name;
55+
}
4756
}
4857

4958
export { UmbMediaTypeFolderWorkspaceContext as api };

0 commit comments

Comments
 (0)