@umbraco-cms/backoffice 16.3.4 → 17.0.0-rc1

package/dist-cms/packages/block/block-grid/components/block-grid-block-inline/block-grid-block-inline.element.js

@@ -108,7 +108,7 @@ let UmbBlockGridBlockInlineElement = class UmbBlockGridBlockInlineElement extend
 		`;
     }
     #renderBlockInfo() {
-        const blockValue = { ...this.content, $settings: this.settings };
+        const blockValue = { ...this.content, $settings: this.settings, $index: this.index };
         return html `
 			<span id="content">
 				<span id="icon">
@@ -292,6 +292,9 @@ __decorate([
 __decorate([
     property({ type: String, reflect: false })
 ], UmbBlockGridBlockInlineElement.prototype, "icon", void 0);
+__decorate([
+    property({ type: Number, attribute: false })
+], UmbBlockGridBlockInlineElement.prototype, "index", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], UmbBlockGridBlockInlineElement.prototype, "unpublished", void 0);

package/dist-cms/packages/block/block-grid/components/block-grid-entries/block-grid-entries.element.js

@@ -254,11 +254,11 @@ let UmbBlockGridEntriesElement = class UmbBlockGridEntriesElement extends UmbFor
         return html `
 			${this._styleElement}
 			<div class="umb-block-grid__layout-container" data-area-length=${this._layoutEntries.length}>
-				${repeat(this._layoutEntries, (x) => x.contentKey, (layoutEntry, index) => html `<umb-block-grid-entry
+				${repeat(this._layoutEntries, (layout, index) => `${index}_${layout.contentKey}`, (layout, index) => html `<umb-block-grid-entry
 							class="umb-block-grid__layout-item"
 							index=${index}
-							.contentKey=${layoutEntry.contentKey}
-							.layout=${layoutEntry}>
+							.contentKey=${layout.contentKey}
+							.layout=${layout}>
 						</umb-block-grid-entry>`)}
 			</div>
 			${this._canCreate ? this.#renderCreateButtonGroup() : nothing}

package/dist-cms/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.js

@@ -151,7 +151,7 @@ let UmbBlockGridEntryElement = class UmbBlockGridEntryElement extends UmbLitElem
         this.observe(this.#context.blockType, (blockType) => {
             this.#updateBlockViewProps({ blockType });
         }, null);
-        // TODO: Implement index.
+        this.observe(this.#context.index, (index) => this.#updateBlockViewProps({ index }), null);
         this.observe(this.#context.label, (label) => {
             this.#updateBlockViewProps({ label });
             this._label = label;
@@ -307,6 +307,7 @@ let UmbBlockGridEntryElement = class UmbBlockGridEntryElement extends UmbLitElem
 			class="umb-block-grid__block--view"
 			.label=${this._label}
 			.icon=${this._icon}
+			.index=${this._blockViewProps.index}
 			.unpublished=${!this._exposed}
 			.config=${this._blockViewProps.config}
 			.content=${this._blockViewProps.content}
@@ -318,6 +319,7 @@ let UmbBlockGridEntryElement = class UmbBlockGridEntryElement extends UmbLitElem
 			class="umb-block-grid__block--view"
 			.label=${this._label}
 			.icon=${this._icon}
+			.index=${this._blockViewProps.index}
 			.unpublished=${!this._exposed}
 			.config=${this._blockViewProps.config}
 			.content=${this._blockViewProps.content}

package/dist-cms/packages/block/block-grid/property-editors/block-grid-area-type-permission/block-grid-area-type-permission.element.js

@@ -30,7 +30,7 @@ let UmbPropertyEditorUIBlockGridAreaTypePermissionElement = class UmbPropertyEdi
                 .map((item) => {
                 const blockType = this._blockTypes?.find((block) => block.contentElementTypeKey === item.unique);
                 if (blockType) {
-                    return { type: blockType, name: item.name };
+                    return { type: blockType, name: item.name, icon: item.icon };
                 }
                 return undefined;
             })
@@ -141,6 +141,7 @@ let UmbPropertyEditorUIBlockGridAreaTypePermissionElement = class UmbPropertyEdi
     }
     #renderBlockGroups(area) {
         return repeat(this._blockGroups, (group) => group.key, (group) => html `<uui-combobox-list-option .value=${group.key} ?selected=${area.groupKey === group.key}>
+					<umb-icon name="icon-folder"></umb-icon>
 					${group.name}
 				</uui-combobox-list-option>`);
     }
@@ -148,6 +149,7 @@ let UmbPropertyEditorUIBlockGridAreaTypePermissionElement = class UmbPropertyEdi
         return repeat(this._blockTypesWithElementName, (block) => block.type.contentElementTypeKey, (block) => html `<uui-combobox-list-option
 					.value=${block.type.contentElementTypeKey}
 					?selected=${area.elementTypeKey === block.type.contentElementTypeKey}>
+					<umb-icon name=${block.icon}></umb-icon>
 					${block.name}
 				</uui-combobox-list-option>`);
     }
@@ -182,7 +184,14 @@ let UmbPropertyEditorUIBlockGridAreaTypePermissionElement = class UmbPropertyEdi
 			}
 
 			uui-combobox strong {
-				padding: 0 var(--uui-size-space-1);
+				padding: var(--uui-size-space-2);
+			}
+
+			uui-combobox-list-option {
+				display: flex;
+				align-items: center;
+				gap: var(--uui-size-space-2);
+				padding: var(--uui-size-2);
 			}
 		`,
     ]; }

package/dist-cms/packages/block/block-grid/property-editors/block-grid-areas-config/property-editor-ui-block-grid-areas-config.element.js

@@ -126,6 +126,12 @@ let UmbPropertyEditorUIBlockGridAreasConfigElement = class UmbPropertyEditorUIBl
     }
     static { this.styles = [
         css `
+			:host {
+				display: flex;
+				flex-direction: column;
+				gap: var(--uui-size-2);
+			}
+
 			.umb-block-grid__area {
 				cursor: move;
 			}

package/dist-cms/packages/block/block-grid/property-editors/block-grid-editor/manifests.js

@@ -71,9 +71,7 @@ export const manifests = [
         alias: 'Umb.PropertyValueResolver.BlockGrid',
         name: 'Block Value Resolver',
         api: UmbStandardBlockValueResolver,
-        meta: {
-            editorAlias: UMB_BLOCK_GRID_PROPERTY_EDITOR_SCHEMA_ALIAS,
-        },
+        forEditorAlias: UMB_BLOCK_GRID_PROPERTY_EDITOR_SCHEMA_ALIAS,
     },
     blockGridSchemaManifest,
     ...propertyActionManifests,

package/dist-cms/packages/block/block-grid/property-editors/block-grid-editor/property-editor-ui-block-grid.element.js

@@ -9,7 +9,7 @@ import { UMB_BLOCK_GRID_PROPERTY_EDITOR_SCHEMA_ALIAS } from './constants.js';
 import { UmbLitElement } from '../../../../core/lit-element/index.js';
 import { html, customElement, property, state, css, ref, nothing, } from '../../../../../external/lit/index.js';
 import { UmbTextStyles } from '../../../../core/style/index.js';
-import { observeMultiple } from '../../../../../libs/observable-api/index.js';
+import { jsonStringComparison, observeMultiple } from '../../../../../libs/observable-api/index.js';
 import { UMB_PROPERTY_CONTEXT, UMB_PROPERTY_DATASET_CONTEXT } from '../../../../core/property/index.js';
 import { UmbFormControlMixin, UmbValidationContext } from '../../../../core/validation/index.js';
 import { debounceTime } from '../../../../../external/rxjs/index.js';
@@ -129,16 +129,23 @@ let UmbPropertyEditorUIBlockGridElement = class UmbPropertyEditorUIBlockGridElem
                 this.#managerContext.exposes,
             ]).pipe(debounceTime(20)), ([layouts, contents, settings, exposes]) => {
                 if (layouts.length === 0) {
+                    if (this.value === undefined) {
+                        return;
+                    }
                     super.value = undefined;
                 }
                 else {
-                    super.value = {
+                    const newValue = {
                         ...super.value,
                         layout: { [UMB_BLOCK_GRID_PROPERTY_EDITOR_SCHEMA_ALIAS]: layouts },
                         contentData: contents,
                         settingsData: settings,
                         expose: exposes,
                     };
+                    if (jsonStringComparison(this.value, newValue)) {
+                        return;
+                    }
+                    super.value = newValue;
                 }
                 // If we don't have a value set from the outside or an internal value, we don't want to set the value.
                 // This is added to prevent the block grid from setting an empty value on startup.

package/dist-cms/packages/block/block-grid/property-editors/block-grid-type-configuration/property-editor-ui-block-grid-type-configuration.element.js

@@ -116,7 +116,7 @@ let UmbPropertyEditorUIBlockGridTypeConfigurationElement = class UmbPropertyEdit
         const groupName = this.#blockGroups?.find((group) => group.key === groupKey)?.name ?? '';
         await umbConfirmModal(this, {
             headline: '#blockEditor_confirmDeleteBlockGroupTitle',
-            content: this.localize.term('#blockEditor_confirmDeleteBlockGroupMessage', [groupName]),
+            content: this.localize.term('blockEditor_confirmDeleteBlockGroupMessage', [groupName]),
             color: 'danger',
             confirmLabel: '#general_delete',
         });
@@ -155,34 +155,38 @@ let UmbPropertyEditorUIBlockGridTypeConfigurationElement = class UmbPropertyEdit
     }
     #renderGroupInput(groupKey, groupName) {
         return html `<div class="group-handle">
+			<uui-icon name="icon-grip"></uui-icon>
 			<uui-input
-				auto-width
 				label="Group"
 				.value=${groupName ?? ''}
 				@change=${(e) => this.#onGroupNameChange(e, groupKey)}>
-				<uui-button compact slot="append" label="delete" @click=${() => this.#deleteGroup(groupKey)}>
-					<uui-icon name="icon-trash"></uui-icon>
-				</uui-button>
 			</uui-input>
+			<uui-button
+				compact
+				label=${this.localize.term('general_delete')}
+				look="outline"
+				@click=${() => this.#deleteGroup(groupKey)}>
+				<uui-icon name="icon-trash"></uui-icon>
+			</uui-button>
 		</div>`;
     }
     static { this.styles = [
         UmbTextStyles,
         css `
-			uui-input:not(:hover, :focus) {
-				border: 1px solid transparent;
-			}
-			uui-input:not(:hover, :focus) uui-button {
-				opacity: 0;
-			}
-
 			.group-handle {
-				padding: var(--uui-size-1);
+				display: flex;
+				align-items: center;
+				padding: var(--uui-size-3) var(--uui-size-1);
 				margin-top: var(--uui-size-6);
 				margin-bottom: var(--uui-size-4);
+				gap: var(--uui-size-1);
 				cursor: grab;
 			}
 
+			.group-handle:active {
+				cursor: grabbing;
+			}
+
 			.group-handle:hover {
 				background-color: var(--uui-color-divider);
 				border-radius: var(--uui-border-radius);
@@ -191,6 +195,10 @@ let UmbPropertyEditorUIBlockGridTypeConfigurationElement = class UmbPropertyEdit
 			.group:has([drag-placeholder]) {
 				opacity: 0.2;
 			}
+
+			uui-input {
+				flex: 1;
+			}
 		`,
     ]; }
 };

package/dist-cms/packages/block/block-grid/workspace/views/block-grid-type-workspace-view-areas.element.js

@@ -14,7 +14,7 @@ let UmbBlockGridTypeWorkspaceViewAreasElement = class UmbBlockGridTypeWorkspaceV
         this.consumeContext(UMB_DATA_TYPE_WORKSPACE_CONTEXT, async (context) => {
             this.observe(await context?.propertyValueByAlias('gridColumns'), (value) => {
                 const dataTypeGridColumns = value ? parseInt(value, 10) : 12;
-                this._areaColumnsConfigurationObject = [{ alias: 'placeholder', value: dataTypeGridColumns }];
+                this._areaColumnsConfigurationObject = [{ alias: 'placeholder', value: dataTypeGridColumns }, { alias: 'min', value: 1 }];
                 this._areaConfigConfigurationObject = [{ alias: 'defaultAreaGridColumns', value: dataTypeGridColumns }];
             }, 'observeGridColumns');
         }).passContextAliasMatches();

package/dist-cms/packages/block/block-list/components/block-list-entry/block-list-entry.element.d.ts

@@ -9,10 +9,10 @@ import '../unsupported-list-block/index.js';
  */
 export declare class UmbBlockListEntryElement extends UmbLitElement implements UmbPropertyEditorUiElement {
     #private;
-    get index(): number | undefined;
     set index(value: number | undefined);
-    get contentKey(): string | undefined;
+    get index(): number | undefined;
     set contentKey(value: string | undefined);
+    get contentKey(): string | undefined;
     private _contentKey?;
     private _contentTypeAlias?;
     private _contentTypeName?;

package/dist-cms/packages/block/block-list/components/block-list-entry/block-list-entry.element.js

@@ -21,15 +21,11 @@ import '../unsupported-list-block/index.js';
  * @element umb-block-list-entry
  */
 let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElement {
-    //
-    get index() {
-        return this.#context.getIndex();
-    }
     set index(value) {
         this.#context.setIndex(value);
     }
-    get contentKey() {
-        return this._contentKey;
+    get index() {
+        return this.#context.getIndex();
     }
     set contentKey(value) {
         if (!value)
@@ -41,6 +37,9 @@ let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElem
             this._blockViewProps.contentInvalid = hasMessages;
         }, 'observeMessagesForContent');
     }
+    get contentKey() {
+        return this._contentKey;
+    }
     #context;
     #updateBlockViewProps(incoming) {
         this._blockViewProps = { ...this._blockViewProps, ...incoming };
@@ -111,7 +110,7 @@ let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElem
         this.observe(this.#context.blockType, (blockType) => {
             this.#updateBlockViewProps({ blockType });
         }, null);
-        // TODO: Implement index.
+        this.observe(this.#context.index, (index) => this.#updateBlockViewProps({ index }), null);
         this.observe(this.#context.label, (label) => {
             this.#updateBlockViewProps({ label });
             this._label = label;
@@ -227,6 +226,7 @@ let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElem
         return html `<umb-ref-list-block
 			.label=${this._label}
 			.icon=${this._icon}
+			.index=${this._blockViewProps.index}
 			.unpublished=${!this._exposed}
 			.config=${this._blockViewProps.config}
 			.content=${this._blockViewProps.content}
@@ -237,6 +237,7 @@ let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElem
         return html `<umb-inline-list-block
 			.label=${this._label}
 			.icon=${this._icon}
+			.index=${this._blockViewProps.index}
 			.unpublished=${!this._exposed}
 			.config=${this._blockViewProps.config}
 			.content=${this._blockViewProps.content}

package/dist-cms/packages/block/block-list/components/inline-list-block/inline-list-block.element.d.ts

@@ -8,6 +8,7 @@ export declare class UmbInlineListBlockElement extends UmbLitElement {
     #private;
     label?: string;
     icon?: string;
+    index?: number;
     unpublished?: boolean;
     content?: UmbBlockDataType;
     settings?: UmbBlockDataType;

package/dist-cms/packages/block/block-list/components/inline-list-block/inline-list-block.element.js

@@ -97,7 +97,7 @@ let UmbInlineListBlockElement = class UmbInlineListBlockElement extends UmbLitEl
 		`;
     }
     #renderBlockInfo() {
-        const blockValue = { ...this.content, $settings: this.settings };
+        const blockValue = { ...this.content, $settings: this.settings, $index: this.index };
         return html `
 			<span id="content">
 				<span id="icon">
@@ -261,6 +261,9 @@ __decorate([
 __decorate([
     property({ type: String, reflect: false })
 ], UmbInlineListBlockElement.prototype, "icon", void 0);
+__decorate([
+    property({ type: Number, attribute: false })
+], UmbInlineListBlockElement.prototype, "index", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], UmbInlineListBlockElement.prototype, "unpublished", void 0);

package/dist-cms/packages/block/block-list/components/ref-list-block/ref-list-block.element.d.ts

@@ -5,6 +5,7 @@ import type { UmbBlockEditorCustomViewConfiguration } from '../../../block-custo
 export declare class UmbRefListBlockElement extends UmbLitElement {
     label?: string;
     icon?: string;
+    index?: number;
     unpublished?: boolean;
     content?: UmbBlockDataType;
     settings?: UmbBlockDataType;

package/dist-cms/packages/block/block-list/components/ref-list-block/ref-list-block.element.js

@@ -9,7 +9,7 @@ import { UmbLitElement } from '../../../../core/lit-element/index.js';
 import '../../../../ufm/index.js';
 let UmbRefListBlockElement = class UmbRefListBlockElement extends UmbLitElement {
     render() {
-        const blockValue = { ...this.content, $settings: this.settings };
+        const blockValue = { ...this.content, $settings: this.settings, $index: this.index };
         return html `
 			<uui-ref-node standalone href=${(this.config?.showContentEdit ? this.config?.editContentPath : undefined) ?? ''}>
 				<umb-icon slot="icon" .name=${this.icon}></umb-icon>
@@ -44,6 +44,9 @@ __decorate([
 __decorate([
     property({ type: String, reflect: false })
 ], UmbRefListBlockElement.prototype, "icon", void 0);
+__decorate([
+    property({ type: Number, attribute: false })
+], UmbRefListBlockElement.prototype, "index", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], UmbRefListBlockElement.prototype, "unpublished", void 0);

package/dist-cms/packages/block/block-list/context/block-list-manager.context-token.js

@@ -1,3 +1,3 @@
 import { UmbContextToken } from '../../../../libs/context-api/index.js';
-// TODO: Make discriminator method for this: (Aim to do this for v.16)
+// TODO: Make discriminator method for this: (Aim to do this for v.16) [NL]
 export const UMB_BLOCK_LIST_MANAGER_CONTEXT = new UmbContextToken('UmbBlockManagerContext');

package/dist-cms/packages/block/block-list/context/block-list-manager.context.d.ts

@@ -14,9 +14,7 @@ export declare class UmbBlockListManagerContext<BlockLayoutType extends UmbBlock
      * @param contentElementTypeKey
      * @param partialLayoutEntry
      * @param _originData
-     * @deprecated Use createWithPresets instead. Will be removed in v.17.
      */
-    create(contentElementTypeKey: string, partialLayoutEntry?: Omit<BlockLayoutType, 'contentKey'>, _originData?: UmbBlockListWorkspaceOriginData): never;
     createWithPresets(contentElementTypeKey: string, partialLayoutEntry?: Omit<BlockLayoutType, 'contentKey'>, _originData?: UmbBlockListWorkspaceOriginData): Promise<{
         layout: BlockLayoutType;
         content: {

package/dist-cms/packages/block/block-list/context/block-list-manager.context.js

@@ -22,18 +22,7 @@ export class UmbBlockListManagerContext extends UmbBlockManagerContext {
      * @param contentElementTypeKey
      * @param partialLayoutEntry
      * @param _originData
-     * @deprecated Use createWithPresets instead. Will be removed in v.17.
      */
-    create(
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    contentElementTypeKey, 
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    partialLayoutEntry, 
-    // This property is used by some implementations, but not used in this. Do not remove. [NL]
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    _originData) {
-        throw new Error('Method deparecated use createWithPresets');
-    }
     async createWithPresets(contentElementTypeKey, partialLayoutEntry, 
     // This property is used by some implementations, but not used in this. Do not remove. [NL]
     // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/dist-cms/packages/block/block-list/property-editors/block-list-editor/manifests.js

@@ -11,7 +11,7 @@ export const manifests = [
             label: 'Block List',
             propertyEditorSchemaAlias: UMB_BLOCK_LIST_PROPERTY_EDITOR_SCHEMA_ALIAS,
             icon: 'icon-thumbnail-list',
-            group: 'lists',
+            group: 'richContent',
             supportsReadOnly: true,
             settings: {
                 properties: [
@@ -48,9 +48,7 @@ export const manifests = [
         alias: 'Umb.PropertyValueResolver.BlockList',
         name: 'Block Value Resolver',
         api: UmbStandardBlockValueResolver,
-        meta: {
-            editorAlias: UMB_BLOCK_LIST_PROPERTY_EDITOR_SCHEMA_ALIAS,
-        },
+        forEditorAlias: UMB_BLOCK_LIST_PROPERTY_EDITOR_SCHEMA_ALIAS,
     },
     blockListSchemaManifest,
 ];

package/dist-cms/packages/block/block-list/property-editors/block-list-editor/property-editor-ui-block-list.element.js

@@ -14,7 +14,7 @@ import { UmbSorterController } from '../../../../core/sorter/index.js';
 import '../../components/block-list-entry/index.js';
 import { UMB_PROPERTY_CONTEXT, UMB_PROPERTY_DATASET_CONTEXT } from '../../../../core/property/index.js';
 import { extractJsonQueryProps, UMB_VALIDATION_EMPTY_LOCALIZATION_KEY, UmbFormControlMixin, UmbValidationContext, } from '../../../../core/validation/index.js';
-import { observeMultiple } from '../../../../../libs/observable-api/index.js';
+import { jsonStringComparison, observeMultiple } from '../../../../../libs/observable-api/index.js';
 import { debounceTime } from '../../../../../external/rxjs/index.js';
 import { UMB_CONTENT_WORKSPACE_CONTEXT } from '../../../../content/content/index.js';
 const SORTER_CONFIG = {
@@ -63,8 +63,6 @@ let UmbPropertyEditorUIBlockListElement = class UmbPropertyEditorUIBlockListElem
         const useInlineEditingAsDefault = config.getValueByAlias('useInlineEditingAsDefault');
         this.#managerContext.setInlineEditingMode(useInlineEditingAsDefault);
         this.style.maxWidth = config.getValueByAlias('maxPropertyWidth') ?? '';
-        // TODO:
-        //config.useSingleBlockMode, not done jet
         this.#managerContext.setEditorConfiguration(config);
         const customCreateButtonLabel = config.getValueByAlias('createLabel');
         if (customCreateButtonLabel) {
@@ -215,16 +213,23 @@ let UmbPropertyEditorUIBlockListElement = class UmbPropertyEditorUIBlockListElem
             this.#managerContext.exposes,
         ]).pipe(debounceTime(20)), ([layouts, contents, settings, exposes]) => {
             if (layouts.length === 0) {
+                if (this.value === undefined) {
+                    return;
+                }
                 super.value = undefined;
             }
             else {
-                super.value = {
+                const newValue = {
                     ...super.value,
                     layout: { [UMB_BLOCK_LIST_PROPERTY_EDITOR_SCHEMA_ALIAS]: layouts },
                     contentData: contents,
                     settingsData: settings,
                     expose: exposes,
                 };
+                if (jsonStringComparison(this.value, newValue)) {
+                    return;
+                }
+                super.value = newValue;
             }
             // If we don't have a value set from the outside or an internal value, we don't want to set the value.
             // This is added to prevent the block list from setting an empty value on startup.
@@ -242,11 +247,12 @@ let UmbPropertyEditorUIBlockListElement = class UmbPropertyEditorUIBlockListElem
             return nothing;
         }
         return html `
-			${repeat(this._layouts, (x) => x.contentKey, (layoutEntry, index) => html `
+			${repeat(this._layouts, (layout, index) => `${index}_${layout.contentKey}`, (layout, index) => html `
 					${this.#renderInlineCreateButton(index)}
 					<umb-block-list-entry
-						.contentKey=${layoutEntry.contentKey}
-						.layout=${layoutEntry}
+						index=${index}
+						.contentKey=${layout.contentKey}
+						.layout=${layout}
 						${umbDestroyOnDisconnect()}>
 					</umb-block-list-entry>
 				`)}
@@ -258,7 +264,7 @@ let UmbPropertyEditorUIBlockListElement = class UmbPropertyEditorUIBlockListElem
             return nothing;
         }
         else {
-            return html ` <uui-button-group> ${this.#renderCreateButton()} ${this.#renderPasteButton()} </uui-button-group> `;
+            return html `<uui-button-group>${this.#renderCreateButton()}${this.#renderPasteButton()}</uui-button-group>`;
         }
     }
     #renderInlineCreateButton(index) {

package/dist-cms/packages/block/block-list/workspace/views/block-list-type-workspace-view.element.js

@@ -21,7 +21,6 @@ let UmbBlockListTypeWorkspaceViewSettingsElement = class UmbBlockListTypeWorkspa
 					property-editor-ui-alias="Umb.PropertyEditorUi.OverlaySize"></umb-property>
 			</uui-box>
 			<uui-box headline=${this.localize.term('blockEditor_headlineDataModels')}>
-				<!-- TODO: implement readonly mode for umb-property -->
 				<umb-property
 					label=${this.localize.term('blockEditor_labelContentElementType')}
 					alias="contentElementTypeKey"

package/dist-cms/packages/block/block-rte/components/block-rte-entry/block-rte-entry.element.d.ts

@@ -7,8 +7,8 @@ import '../ref-rte-block/index.js';
  */
 export declare class UmbBlockRteEntryElement extends UmbLitElement implements UmbPropertyEditorUiElement {
     #private;
-    get contentKey(): string | undefined;
     set contentKey(value: string | undefined);
+    get contentKey(): string | undefined;
     private _contentKey?;
     private _showContentEdit;
     private _hasSettings;

package/dist-cms/packages/block/block-rte/components/block-rte-entry/block-rte-entry.element.js

@@ -17,9 +17,6 @@ import { UmbDataPathBlockElementDataQuery } from '../../../block/index.js';
  * @class UmbBlockRteEntryElement
  */
 let UmbBlockRteEntryElement = class UmbBlockRteEntryElement extends UmbLitElement {
-    get contentKey() {
-        return this._contentKey;
-    }
     set contentKey(value) {
         if (!value)
             return;
@@ -30,6 +27,9 @@ let UmbBlockRteEntryElement = class UmbBlockRteEntryElement extends UmbLitElemen
             this._blockViewProps.contentInvalid = hasMessages;
         }, 'observeMessagesForContent');
     }
+    get contentKey() {
+        return this._contentKey;
+    }
     #context;
     #updateBlockViewProps(incoming) {
         this._blockViewProps = { ...this._blockViewProps, ...incoming };
@@ -94,7 +94,7 @@ let UmbBlockRteEntryElement = class UmbBlockRteEntryElement extends UmbLitElemen
         this.observe(this.#context.blockType, (blockType) => {
             this.#updateBlockViewProps({ blockType });
         }, null);
-        // TODO: Implement index.
+        this.observe(this.#context.index, (index) => this.#updateBlockViewProps({ index }), null);
         this.observe(this.#context.label, (label) => {
             this.#updateBlockViewProps({ label });
             this._label = label;
@@ -171,7 +171,7 @@ let UmbBlockRteEntryElement = class UmbBlockRteEntryElement extends UmbLitElemen
     }
     #renderActionBar() {
         return this._showActions
-            ? html ` <uui-action-bar> ${this.#renderEditAction()} ${this.#renderEditSettingsAction()}</uui-action-bar> `
+            ? html `<uui-action-bar>${this.#renderEditAction()}${this.#renderEditSettingsAction()}</uui-action-bar>`
             : nothing;
     }
     #renderBuiltinBlockView;
@@ -179,6 +179,7 @@ let UmbBlockRteEntryElement = class UmbBlockRteEntryElement extends UmbLitElemen
         return html `<umb-ref-rte-block
 			.label=${this._label}
 			.icon=${this._icon}
+			.index=${this._blockViewProps.index}
 			.unpublished=${!this._exposed}
 			.content=${this._blockViewProps.content}
 			.settings=${this._blockViewProps.settings}

package/dist-cms/packages/block/block-rte/components/ref-rte-block/ref-rte-block.element.d.ts

@@ -7,6 +7,7 @@ import type { UmbBlockEditorCustomViewConfiguration } from '../../../block-custo
 export declare class UmbRefRteBlockElement extends UmbLitElement {
     label?: string;
     icon?: string;
+    index?: number;
     unpublished?: boolean;
     content?: UmbBlockDataType;
     settings?: UmbBlockDataType;

package/dist-cms/packages/block/block-rte/components/ref-rte-block/ref-rte-block.element.js

@@ -20,7 +20,7 @@ let UmbRefRteBlockElement = class UmbRefRteBlockElement extends UmbLitElement {
         });
     }
     render() {
-        const blockValue = { ...this.content, $settings: this.settings };
+        const blockValue = { ...this.content, $settings: this.settings, $index: this.index };
         return html `
 			<uui-ref-node standalone href=${(this.config?.showContentEdit ? this._workspaceEditPath : undefined) ?? ''}>
 				<div class="selection-background" aria-hidden="true">&emsp;</div>
@@ -67,6 +67,9 @@ __decorate([
 __decorate([
     property({ type: String })
 ], UmbRefRteBlockElement.prototype, "icon", void 0);
+__decorate([
+    property({ type: Number, attribute: false })
+], UmbRefRteBlockElement.prototype, "index", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], UmbRefRteBlockElement.prototype, "unpublished", void 0);

package/dist-cms/packages/block/block-rte/context/block-rte-manager.context.d.ts

@@ -13,9 +13,7 @@ export declare class UmbBlockRteManagerContext<BlockLayoutType extends UmbBlockR
      * @param contentElementTypeKey
      * @param partialLayoutEntry
      * @param _originData
-     * @deprecated Use createWithPresets instead. Will be removed in v.17.
      */
-    create(contentElementTypeKey: string, partialLayoutEntry?: Omit<BlockLayoutType, 'contentKey'>, _originData?: UmbBlockRteWorkspaceOriginData): never;
     createWithPresets(contentElementTypeKey: string, partialLayoutEntry?: Omit<BlockLayoutType, 'contentKey'>, _originData?: UmbBlockRteWorkspaceOriginData): Promise<{
         layout: BlockLayoutType;
         content: {

package/dist-cms/packages/block/block-rte/context/block-rte-manager.context.js

@@ -14,18 +14,7 @@ export class UmbBlockRteManagerContext extends UmbBlockManagerContext {
      * @param contentElementTypeKey
      * @param partialLayoutEntry
      * @param _originData
-     * @deprecated Use createWithPresets instead. Will be removed in v.17.
      */
-    create(
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    contentElementTypeKey, 
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    partialLayoutEntry, 
-    // This property is used by some implementations, but not used in this. Do not remove. [NL]
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    _originData) {
-        throw new Error('Method deparecated use createWithPresets');
-    }
     async createWithPresets(contentElementTypeKey, partialLayoutEntry, 
     // This property is used by some implementations, but not used in this, do not remove. [NL]
     // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/dist-cms/packages/block/block-single/clipboard/block/copy/block-single-to-block-copy-translator.d.ts

@@ -0,0 +1,8 @@
+import type { UmbBlockSingleValueModel } from '../../../types.js';
+import type { UmbBlockClipboardEntryValueModel } from '../../../../block/index.js';
+import { UmbControllerBase } from '../../../../../../libs/class-api/index.js';
+import type { UmbClipboardCopyPropertyValueTranslator } from '../../../../../clipboard/index.js';
+export declare class UmbBlockSingleToBlockClipboardCopyPropertyValueTranslator extends UmbControllerBase implements UmbClipboardCopyPropertyValueTranslator<UmbBlockSingleValueModel> {
+    translate(propertyValue: UmbBlockSingleValueModel): Promise<UmbBlockClipboardEntryValueModel>;
+}
+export { UmbBlockSingleToBlockClipboardCopyPropertyValueTranslator as api };