From f24667a3090d6350b865f9272cd605a9ce715003 Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Thu, 4 Jan 2024 15:01:57 +0100 Subject: [PATCH 1/6] styling --- ...ditor-ui-block-grid-column-span.element.ts | 132 ++++++++++++++++-- ...id-type-workspace-view-settings.element.ts | 2 +- 2 files changed, 120 insertions(+), 14 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts index a22f67b1ab..17b83e770c 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts @@ -1,33 +1,139 @@ -import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit'; +import { html, customElement, property, css, repeat, state, queryAll } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; +type BlockGridColumn = { + columnSpan: number; +}; + @customElement('umb-property-editor-ui-block-grid-column-span') export class UmbPropertyEditorUIBlockGridColumnSpanElement extends UmbLitElement implements UmbPropertyEditorUiElement { - private _value: Array = []; - @property({ type: Array }) - public get value(): Array { - return this._value; - } - public set value(value: Array) { - this._value = value || []; - } + value: Array = []; + + @state() + private _maxColumns = 12; + + @queryAll('div') + private _divs!: Array; @property({ attribute: false }) - public set config(config: UmbPropertyEditorConfigCollection | undefined) {} + public set config(config: UmbPropertyEditorConfigCollection | undefined) { + const maxColumns = config?.getValueByAlias('gridColumns'); + if (typeof maxColumns === 'number') { + this._maxColumns = maxColumns; + } + } private _onChange(event: CustomEvent) { this.dispatchEvent(new CustomEvent('property-value-change')); } - render() { - return html`Column span TODO `; + #pickColumn(index: number) { + const value = this.value ?? []; + const exists = value.find((column) => column.columnSpan === index); + + if (exists) { + this.value = value.filter((column) => column.columnSpan !== index); + } else { + this.value = [...value, { columnSpan: index }]; + } } - static styles = [UmbTextStyles]; + render() { + const template = Array.from({ length: this._maxColumns }, (_, index) => { + const number = index + 1; + let classes = 'default'; + + if (this.value && this.value.length > 0) { + const applied = this.value.find((column) => column.columnSpan >= index); + const picked = this.value.find((column) => column.columnSpan === index); + classes = picked ? 'picked applied' : applied ? 'applied' : 'default'; + } + + return html`
+ ${number} + +
`; + }); + + return html`
${template}
`; + } + + static styles = [ + UmbTextStyles, + css` + #wrapper { + box-sizing: border-box; + display: flex; + flex-wrap: nowrap; + border: 1px solid var(--uui-color-divider-emphasis); + } + + #wrapper div { + color: var(--uui-color-divider-emphasis); + position: relative; + flex-grow: 1; + min-height: 35px; + box-sizing: border-box; + display: flex; + justify-content: flex-end; + padding-left: 5px; + border-right: 1px solid transparent; + } + + #wrapper div:not(.picked) { + border-right: 1px solid var(--uui-color-divider-standalone); + } + + #wrapper div.picked, + #wrapper div:has(button:hover) { + color: var(--uui-color-interactive); + } + + #wrapper div:last-child { + border-right: 1px solid transparent; + } + + #wrapper:has(button:hover) div:not(:has(button:hover) ~ div) { + background-color: var(--uui-color-interactive-emphasis); + } + + #wrapper div span { + user-select: none; + position: absolute; + padding: var(--uui-size-6); + transform: translate(50%, -75%); + } + + #wrapper div button { + border: none; + position: absolute; + z-index: 1; + transform: translateX(50%); + inset: -1px; + opacity: 0; + } + + #wrapper .picked::after { + content: ''; + position: absolute; + transform: translateX(50%); + width: 4px; + border-right: 1px solid var(--uui-color-interactive); + background-color: var(--uui-color-surface); + top: 0; + right: 0; + bottom: 0; + } + + #wrapper .applied { + background-color: var(--uui-color-interactive); + } + `, + ]; } export default UmbPropertyEditorUIBlockGridColumnSpanElement; diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts index 09b06fc88e..c0694df20e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts @@ -11,7 +11,7 @@ export class UmbBlockTypeGridWorkspaceViewSettingsElement extends UmbLitElement #labelOnTopSetting = { alias: 'labelOnTop', value: true }; @state() - private _showSizeOptions = false; + private _showSizeOptions = true; @state() private _backgroundColor?: string; From 230428ed255d9528b02a7be1a10bd3888b8c0966 Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Thu, 4 Jan 2024 15:06:15 +0100 Subject: [PATCH 2/6] remove unused --- .../property-editor-ui-block-grid-column-span.element.ts | 9 ++------- .../block-grid-type-workspace-view-settings.element.ts | 2 +- 2 files changed, 3 insertions(+), 8 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts index 17b83e770c..ac224d19bb 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts @@ -16,9 +16,6 @@ export class UmbPropertyEditorUIBlockGridColumnSpanElement extends UmbLitElement @state() private _maxColumns = 12; - @queryAll('div') - private _divs!: Array; - @property({ attribute: false }) public set config(config: UmbPropertyEditorConfigCollection | undefined) { const maxColumns = config?.getValueByAlias('gridColumns'); @@ -27,10 +24,6 @@ export class UmbPropertyEditorUIBlockGridColumnSpanElement extends UmbLitElement } } - private _onChange(event: CustomEvent) { - this.dispatchEvent(new CustomEvent('property-value-change')); - } - #pickColumn(index: number) { const value = this.value ?? []; const exists = value.find((column) => column.columnSpan === index); @@ -40,6 +33,8 @@ export class UmbPropertyEditorUIBlockGridColumnSpanElement extends UmbLitElement } else { this.value = [...value, { columnSpan: index }]; } + + this.dispatchEvent(new CustomEvent('property-value-change')); } render() { diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts index c0694df20e..09b06fc88e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts @@ -11,7 +11,7 @@ export class UmbBlockTypeGridWorkspaceViewSettingsElement extends UmbLitElement #labelOnTopSetting = { alias: 'labelOnTop', value: true }; @state() - private _showSizeOptions = true; + private _showSizeOptions = false; @state() private _backgroundColor?: string; From 961d56396926b6a13155130c472f7a44cd8acbc2 Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Thu, 4 Jan 2024 16:17:06 +0100 Subject: [PATCH 3/6] min 600 width --- ...ditor-ui-block-grid-column-span.element.ts | 2 +- ...id-type-workspace-view-advanced.element.ts | 7 +- ...-grid-type-workspace-view-areas.element.ts | 7 +- ...id-type-workspace-view-settings.element.ts | 67 +++++++++++++++++-- .../input-block-type.element.ts | 2 +- 5 files changed, 75 insertions(+), 10 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts index ac224d19bb..5703f64665 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/property-editors/block-grid-column-span/property-editor-ui-block-grid-column-span.element.ts @@ -1,4 +1,4 @@ -import { html, customElement, property, css, repeat, state, queryAll } from '@umbraco-cms/backoffice/external/lit'; +import { html, customElement, property, css, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts index c3ac612a4b..93e7fe4c13 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts @@ -50,12 +50,17 @@ export class UmbBlockTypeGridWorkspaceViewAdvancedElement extends UmbLitElement UmbTextStyles, css` :host { - display: block; + display: flex; + flex-wrap: wrap; + justify-content: space-between; + gap: var(--uui-size-layout-1); margin: var(--uui-size-layout-1); padding-bottom: var(--uui-size-layout-1); // To enforce some distance to the bottom of the scroll-container. } uui-box { margin-top: var(--uui-size-layout-1); + flex: 1; + min-width: 600px; } `, ]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts index a12b413e30..b5f17c4a71 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts @@ -24,12 +24,17 @@ export class UmbBlockTypeGridWorkspaceViewAreasElement extends UmbLitElement imp UmbTextStyles, css` :host { - display: block; + display: flex; + flex-wrap: wrap; + justify-content: space-between; + gap: var(--uui-size-layout-1); margin: var(--uui-size-layout-1); padding-bottom: var(--uui-size-layout-1); // To enforce some distance to the bottom of the scroll-container. } uui-box { margin-top: var(--uui-size-layout-1); + flex: 1; + min-width: 600px; } `, ]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts index 72460b223a..930b8bad06 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts @@ -2,6 +2,8 @@ import { css, html, customElement, state } from '@umbraco-cms/backoffice/externa import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; import { UmbWorkspaceViewElement } from '@umbraco-cms/backoffice/extension-registry'; +import { UMB_PROPERTY_DATASET_CONTEXT } from '@umbraco-cms/backoffice/property'; +import { UmbInputNumberRangeElement } from '@umbraco-cms/backoffice/components'; @customElement('umb-block-grid-type-workspace-view') export class UmbBlockTypeGridWorkspaceViewSettingsElement extends UmbLitElement implements UmbWorkspaceViewElement { @@ -10,6 +12,51 @@ export class UmbBlockTypeGridWorkspaceViewSettingsElement extends UmbLitElement @state() private _showSizeOptions = false; + @state() + private _rowMinSpan?: number; + + @state() + private _rowMaxSpan?: number; + + #datasetContext?: typeof UMB_PROPERTY_DATASET_CONTEXT.TYPE; + + #onRowSpanChange(e: CustomEvent) { + this.#datasetContext?.setPropertyValue('rowMinSpan', (e.target as UmbInputNumberRangeElement).minValue); + this.#datasetContext?.setPropertyValue('rowMaxSpan', (e.target as UmbInputNumberRangeElement).maxValue); + } + + constructor() { + super(); + this.consumeContext(UMB_PROPERTY_DATASET_CONTEXT, async (context) => { + this.#datasetContext = context; + // TODO set showSizeOption to true when rowMinSpan or rowMaxSpan is set + this.observe( + await context.propertyValueByAlias('columnSpanOptions'), + (value) => { + if (Array.isArray(value) && value.length > 0) { + this._showSizeOptions = true; + } + this.removeControllerByAlias('_observeColumnSpanOptions'); + }, + '_observeColumnSpanOptions', + ); + this.observe( + await context.propertyValueByAlias('rowMinSpan'), + (value) => { + this._rowMinSpan = value; + }, + '_observeRowMinSpan', + ); + this.observe( + await context.propertyValueByAlias('rowMaxSpan'), + (value) => { + this._rowMaxSpan = value; + }, + '_observeRowMaxSpan', + ); + }); + } + render() { return html` @@ -56,10 +103,14 @@ export class UmbBlockTypeGridWorkspaceViewSettingsElement extends UmbLitElement label=${this.localize.term('blockEditor_allowedBlockColumns')} alias="columnSpanOptions" property-editor-ui-alias="Umb.PropertyEditorUi.BlockGridColumnSpan"> - `; + + + + `; } else { return html`
{ - return { data: { entityType: entityType, preset: {} } }; + return { data: { entityType: entityType, preset: {} }, modal: { size: 'large' } }; }) .observeRouteBuilder((routeBuilder) => { const newpath = routeBuilder({}); From 450f5c19484acf95ffb7646e80ce766db75cc9a0 Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Thu, 4 Jan 2024 16:27:39 +0100 Subject: [PATCH 4/6] fix padding --- .../views/block-grid-type-workspace-view-advanced.element.ts | 1 - .../views/block-grid-type-workspace-view-areas.element.ts | 1 - .../views/block-grid-type-workspace-view-settings.element.ts | 1 - 3 files changed, 3 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts index 93e7fe4c13..37e7a12c40 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts @@ -58,7 +58,6 @@ export class UmbBlockTypeGridWorkspaceViewAdvancedElement extends UmbLitElement padding-bottom: var(--uui-size-layout-1); // To enforce some distance to the bottom of the scroll-container. } uui-box { - margin-top: var(--uui-size-layout-1); flex: 1; min-width: 600px; } diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts index b5f17c4a71..afe8afb020 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts @@ -32,7 +32,6 @@ export class UmbBlockTypeGridWorkspaceViewAreasElement extends UmbLitElement imp padding-bottom: var(--uui-size-layout-1); // To enforce some distance to the bottom of the scroll-container. } uui-box { - margin-top: var(--uui-size-layout-1); flex: 1; min-width: 600px; } diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts index 930b8bad06..2fb76ff904 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts @@ -133,7 +133,6 @@ export class UmbBlockTypeGridWorkspaceViewSettingsElement extends UmbLitElement padding-bottom: var(--uui-size-layout-1); // To enforce some distance to the bottom of the scroll-container. } uui-box { - margin-top: var(--uui-size-layout-1); flex: 1; min-width: 600px; } From 37243b390fc202aa47ed2a48985dee380687c85c Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Thu, 4 Jan 2024 16:34:00 +0100 Subject: [PATCH 5/6] grid --- .../block-grid-type-workspace-view-advanced.element.ts | 9 ++------- .../block-grid-type-workspace-view-areas.element.ts | 9 ++------- .../block-grid-type-workspace-view-settings.element.ts | 9 ++------- 3 files changed, 6 insertions(+), 21 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts index 37e7a12c40..ed8897e43e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-advanced.element.ts @@ -50,17 +50,12 @@ export class UmbBlockTypeGridWorkspaceViewAdvancedElement extends UmbLitElement UmbTextStyles, css` :host { - display: flex; - flex-wrap: wrap; - justify-content: space-between; + display: grid; + grid-template-columns: repeat(auto-fill, minmax(600px, 1fr)); gap: var(--uui-size-layout-1); margin: var(--uui-size-layout-1); padding-bottom: var(--uui-size-layout-1); // To enforce some distance to the bottom of the scroll-container. } - uui-box { - flex: 1; - min-width: 600px; - } `, ]; } diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts index afe8afb020..91c9f24c74 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.ts @@ -24,17 +24,12 @@ export class UmbBlockTypeGridWorkspaceViewAreasElement extends UmbLitElement imp UmbTextStyles, css` :host { - display: flex; - flex-wrap: wrap; - justify-content: space-between; + display: grid; + grid-template-columns: repeat(auto-fill, minmax(600px, 1fr)); gap: var(--uui-size-layout-1); margin: var(--uui-size-layout-1); padding-bottom: var(--uui-size-layout-1); // To enforce some distance to the bottom of the scroll-container. } - uui-box { - flex: 1; - min-width: 600px; - } `, ]; } diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts index 2fb76ff904..85a693964e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-settings.element.ts @@ -125,17 +125,12 @@ export class UmbBlockTypeGridWorkspaceViewSettingsElement extends UmbLitElement UmbTextStyles, css` :host { - display: flex; - flex-wrap: wrap; - justify-content: space-between; + display: grid; + grid-template-columns: repeat(auto-fill, minmax(600px, 1fr)); gap: var(--uui-size-layout-1); margin: var(--uui-size-layout-1); padding-bottom: var(--uui-size-layout-1); // To enforce some distance to the bottom of the scroll-container. } - uui-box { - flex: 1; - min-width: 600px; - } #showOptions { display: flex; From 33b09e70c9a18def125cfd25ca28e9ddd3bc3581 Mon Sep 17 00:00:00 2001 From: Lone Iversen <108085781+loivsen@users.noreply.github.com> Date: Fri, 5 Jan 2024 09:44:53 +0100 Subject: [PATCH 6/6] fix element type only issue --- .../input-document-type/input-document-type.element.ts | 2 +- .../property-editor-ui-document-type-picker.element.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/components/input-document-type/input-document-type.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/components/input-document-type/input-document-type.element.ts index 40c2adcf95..cb84340176 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/components/input-document-type/input-document-type.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/components/input-document-type/input-document-type.element.ts @@ -13,7 +13,7 @@ export class UmbInputDocumentTypeElement extends FormControlMixin(UmbLitElement) * @attr * @default false */ - @property({ type: Boolean, attribute: 'element-types-only' }) + @property({ type: Boolean }) elementTypesOnly: boolean = false; /** diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/property-editors/document-type-picker/property-editor-ui-document-type-picker.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/property-editors/document-type-picker/property-editor-ui-document-type-picker.element.ts index dbe96d6a8b..c12cacd3c9 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/property-editors/document-type-picker/property-editor-ui-document-type-picker.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/property-editors/document-type-picker/property-editor-ui-document-type-picker.element.ts @@ -56,7 +56,7 @@ export class UmbPropertyEditorUIDocumentTypePickerElement extends UmbLitElement : []} .min=${this._limitMin ?? 0} .max=${this._limitMax ?? Infinity} - .element-types-only=${this._onlyElementTypes} + .elementTypesOnly=${this._onlyElementTypes ?? false} >Add `