@umbraco-cms/backoffice 17.4.0-rc → 17.4.0-rc2

package/dist-cms/libs/extension-api/controller/extension-manifest-initializer.controller.js

@@ -13,7 +13,7 @@ export class UmbExtensionManifestInitializer extends UmbBaseExtensionInitializer
         super(host, extensionRegistry, 'extManifest_', alias, onPermissionChanged);
         this._init();
     }
-    async _conditionsAreGood() {
+    async _conditionsAreGood(_signal) {
         return true;
     }
     async _conditionsAreBad() {

package/dist-cms/libs/extension-api/initializers/extension-initializer-base.d.ts

@@ -9,8 +9,8 @@ import type { UmbElement } from '../../element-api/index.js';
 export declare abstract class UmbExtensionInitializerBase<Key extends string, T extends ManifestBase = SpecificManifestTypeOrManifestBase<UmbExtensionManifest, Key>> extends UmbControllerBase {
     #private;
     protected host: UmbElement;
-    protected extensionRegistry: UmbExtensionRegistry<T, import("../index.js").UmbConditionConfigBase<string>, ManifestBase | T>;
-    loaded: import("rxjs").Observable<void>;
+    protected extensionRegistry: UmbExtensionRegistry<T>;
+    loaded: import("rxjs").Observable<boolean | undefined>;
     constructor(host: UmbElement, extensionRegistry: UmbExtensionRegistry<T>, manifestType: Key);
     /**
      * Perform any logic required to instantiate the extension.

package/dist-cms/libs/extension-api/initializers/extension-initializer-base.js

@@ -1,15 +1,17 @@
 import { UmbControllerBase } from '../../class-api/index.js';
-import { ReplaySubject } from '../../../external/rxjs/index.js';
+import { UmbBooleanState } from '../../observable-api/index.js';
 /**
  * Base class for extension initializers, which are responsible for loading and unloading extensions.
  */
 export class UmbExtensionInitializerBase extends UmbControllerBase {
     #extensionMap;
+    // Use the value `undefined`, as that would not resolve a observation promise. [NL]
     #loaded;
     constructor(host, extensionRegistry, manifestType) {
         super(host);
         this.#extensionMap = new Map();
-        this.#loaded = new ReplaySubject(1);
+        // Use the value `undefined`, as that would not resolve a observation promise. [NL]
+        this.#loaded = new UmbBooleanState(undefined);
         this.loaded = this.#loaded.asObservable();
         this.host = host;
         this.extensionRegistry = extensionRegistry;
@@ -26,7 +28,9 @@ export class UmbExtensionInitializerBase extends UmbControllerBase {
                 this.#extensionMap.set(extension.alias, extension);
                 return this.instantiateExtension(extension);
             }));
-            this.#loaded.next();
+            if (extensions.length > 0) {
+                this.#loaded.setValue(true);
+            }
         });
     }
 }

package/dist-cms/libs/extension-api/registry/extension.registry.js

@@ -176,8 +176,28 @@ export class UmbExtensionRegistry {
      * @memberof UmbExtensionRegistry
      */
     registerMany(manifests) {
-        // we have to register extensions individually, so we ensure a manifest is valid before continuing to the next one
-        manifests.forEach((manifest) => this.register(manifest));
+        const toAdd = [];
+        for (const manifest of manifests) {
+            // TODO: refactor this so this code is not duplicated between this and single extension register
+            if (!this.#validateExtension(manifest))
+                continue;
+            if (manifest.type === 'kind') {
+                this.defineKind(manifest);
+                continue;
+            }
+            // TODO: Revisit this, it could use the isExtensionApproved, but this code also checks alias duplication against the toAdd array. [NL]
+            if (!this.#acceptExtension(manifest))
+                continue;
+            const alias = manifest.alias;
+            if (this._extensions.getValue().find((e) => e.alias === alias) || toAdd.find((e) => e.alias === alias)) {
+                console.error(`Extension with alias ${alias} is already registered`);
+                continue;
+            }
+            toAdd.push(this.#appendAdditionalConditions(manifest));
+        }
+        if (toAdd.length) {
+            this._extensions.setValue([...this._extensions.getValue(), ...toAdd]);
+        }
     }
     /**
      * Unregister many extensions with the given aliases.

package/dist-cms/packages/block/block/conditions/block-workspace-is-readonly.condition.js

@@ -4,9 +4,11 @@ export class UmbBlockWorkspaceIsReadOnlyCondition extends UmbConditionBase {
     constructor(host, args) {
         super(host, args);
         this.consumeContext(UMB_BLOCK_WORKSPACE_CONTEXT, (context) => {
-            this.observe(context?.readOnlyGuard.permitted, (isReadOnly) => {
+            this.observe(context?.readOnlyGuard.isPermittedForObservableVariant(context.variantId), (isReadOnly) => {
+                // Only react to positives or negatives:
                 if (isReadOnly !== undefined) {
-                    this.permitted = isReadOnly === (this.config.match !== undefined ? this.config.match : true);
+                    const match = args.config.match ?? true;
+                    this.permitted = isReadOnly === match;
                 }
             }, 'observeIsReadOnly');
         });

package/dist-cms/packages/block/block/context/block-entry.context.js

@@ -427,14 +427,11 @@ export class UmbBlockEntryContext extends UmbContextBase {
             return;
         // TODO: Here is a potential future issue. This is parsing on the read only state of the variant that this is opened from, that is problematic when we enable switching variant within a Block. [NL]
         // TODO: This could benefit from a more dynamic approach, where we inherit all non-variant and variant scoped states. [NL]
-        this.observe(
-        // TODO: Instead transfer all variant states.
-        this._manager.readOnlyState.isPermittedForObservableVariant(this._variantId), (isReadOnly) => {
+        this.observe(this._manager.readOnlyState.permitted, (isReadOnly) => {
             const unique = 'UMB_BLOCK_MANAGER_CONTEXT';
             if (isReadOnly) {
                 const rule = {
                     unique,
-                    variantId: this.#variantId.getValue(),
                 };
                 this.readOnlyGuard?.addRule(rule);
             }

package/dist-cms/packages/block/block/workspace/block-element-manager.js

@@ -59,12 +59,12 @@ export class UmbBlockElementManager extends UmbControllerBase {
             if (id) {
                 this.structure.loadType(id);
             }
-        });
+        }, null);
         this.observe(this.unique, (key) => {
             if (key) {
                 this.validation.setDataPath('$.' + dataPathPropertyName + `[?(@.key == '${key}')]`);
             }
-        });
+        }, null);
         this.observe(this.structure.contentTypeDataTypeUniques, (dataTypeUniques) => {
             this.#dataTypeItemManager.setUniques(dataTypeUniques);
         }, null);

package/dist-cms/packages/block/block/workspace/block-workspace-editor.element.d.ts

@@ -2,6 +2,7 @@ import { UmbLitElement } from '../../../core/lit-element/index.js';
 export declare class UmbBlockWorkspaceEditorElement extends UmbLitElement {
     constructor();
     private _headline;
+    private _readOnly?;
     render(): import("lit-html").TemplateResult<1>;
     static readonly styles: import("lit").CSSResult[];
 }

package/dist-cms/packages/block/block/workspace/block-workspace-editor.element.js

@@ -5,25 +5,32 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { UMB_BLOCK_WORKSPACE_CONTEXT } from './index.js';
-import { css, customElement, html, state } from '../../../../external/lit/index.js';
+import { css, customElement, html, nothing, state } from '../../../../external/lit/index.js';
 import { UmbLitElement } from '../../../core/lit-element/index.js';
 let UmbBlockWorkspaceEditorElement = class UmbBlockWorkspaceEditorElement extends UmbLitElement {
     constructor() {
         super();
         this._headline = '';
         this.consumeContext(UMB_BLOCK_WORKSPACE_CONTEXT, (context) => {
-            if (context) {
-                this.observe(context.name, (name) => {
+            this.observe(context?.name, (name) => {
+                if (name) {
                     this._headline = this.localize.string(name);
-                }, 'observeOwnerContentElementTypeName');
-            }
-            else {
-                this.removeUmbControllerByAlias('observeOwnerContentElementTypeName');
-            }
+                }
+            }, 'observeOwnerContentElementTypeName');
+            this.observe(context?.readOnlyGuard.isPermittedForObservableVariant(context.variantId), (isReadOnly) => {
+                this._readOnly = isReadOnly;
+            }, 'observeIsReadOnly');
         });
     }
     render() {
-        return html `<umb-workspace-editor headline=${this._headline}></umb-workspace-editor>`;
+        return html `<umb-workspace-editor
+			><div slot="header">
+				<h3 id="headline" title="${this._headline}" data-mark="layout-headline">${this._headline}</h3>
+				${this._readOnly
+            ? html `<uui-tag look="secondary">${this.localize.term('general_readOnly')}</uui-tag>`
+            : nothing}
+			</div></umb-workspace-editor
+		>`;
     }
     static { this.styles = [
         css `
@@ -32,12 +39,27 @@ let UmbBlockWorkspaceEditorElement = class UmbBlockWorkspaceEditorElement extend
 				width: 100%;
 				height: 100%;
 			}
+			div {
+				display: flex;
+				align-items: center;
+				gap: var(--uui-size-3);
+			}
+			#headline {
+				display: block;
+				white-space: nowrap;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				min-width: 0;
+			}
 		`,
     ]; }
 };
 __decorate([
     state()
 ], UmbBlockWorkspaceEditorElement.prototype, "_headline", void 0);
+__decorate([
+    state()
+], UmbBlockWorkspaceEditorElement.prototype, "_readOnly", void 0);
 UmbBlockWorkspaceEditorElement = __decorate([
     customElement('umb-block-workspace-editor')
 ], UmbBlockWorkspaceEditorElement);

package/dist-cms/packages/block/block/workspace/block-workspace-language-access.controller.d.ts

@@ -0,0 +1,16 @@
+import type { UmbControllerHost } from '../../../../libs/controller-api/index.js';
+import { UmbControllerBase } from '../../../../libs/class-api/index.js';
+/**
+ * Configures the read-only state of a Block Workspace based on the parent Block Manager
+ * and the current user's language access.
+ *
+ * - For invariant blocks, the workspace inherits the read-only state of the parent Block Manager(Host Property).
+ * - For variant blocks (with a culture), the workspace is editable only when the current user
+ *   has access to that culture (either via `hasAccessToAllLanguages` or an entry in their
+ *   allowed languages).
+ */
+export declare class UmbBlockLanguageAccessWorkspaceController extends UmbControllerBase {
+    #private;
+    constructor(host: UmbControllerHost);
+}
+export { UmbBlockLanguageAccessWorkspaceController as api };

package/dist-cms/packages/block/block/workspace/block-workspace-language-access.controller.js

@@ -0,0 +1,126 @@
+import { UMB_BLOCK_MANAGER_CONTEXT } from '../context/block-manager.context-token.js';
+import { UMB_BLOCK_WORKSPACE_CONTEXT } from './block-workspace.context-token.js';
+import { UmbControllerBase } from '../../../../libs/class-api/index.js';
+import { UMB_CURRENT_USER_CONTEXT } from '../../../user/current-user/index.js';
+const IDENTIFIER_PREFIX = 'UMB_LANGUAGE_PERMISSION_';
+/**
+ * Configures the read-only state of a Block Workspace based on the parent Block Manager
+ * and the current user's language access.
+ *
+ * - For invariant blocks, the workspace inherits the read-only state of the parent Block Manager(Host Property).
+ * - For variant blocks (with a culture), the workspace is editable only when the current user
+ *   has access to that culture (either via `hasAccessToAllLanguages` or an entry in their
+ *   allowed languages).
+ */
+export class UmbBlockLanguageAccessWorkspaceController extends UmbControllerBase {
+    #workspaceContext;
+    #variantId;
+    #currentUserAllowedLanguages;
+    #currentUserHasAccessToAllLanguages;
+    #consumeBlockManager;
+    #appliedLanguageUnique;
+    constructor(host) {
+        super(host);
+        this.consumeContext(UMB_BLOCK_WORKSPACE_CONTEXT, (instance) => {
+            this.#workspaceContext = instance;
+            this.#workspaceContext?.readOnlyGuard.fallbackToNotPermitted();
+            this.#workspaceContext?.content.readOnlyGuard.fallbackToNotPermitted();
+            this.#workspaceContext?.settings.readOnlyGuard.fallbackToNotPermitted();
+            this.observe(instance?.variantId, (variantId) => {
+                this.#variantId = variantId;
+                this.#observeBlockManager(variantId);
+                this.#checkForLanguageAccess();
+            }, 'observeBlockVariantId');
+        });
+        this.consumeContext(UMB_CURRENT_USER_CONTEXT, (context) => {
+            this.observe(context?.languages, (languages) => {
+                this.#currentUserAllowedLanguages = languages;
+                this.#checkForLanguageAccess();
+            }, 'observeCurrentUserLanguages');
+            this.observe(context?.hasAccessToAllLanguages, (hasAccessToAllLanguages) => {
+                this.#currentUserHasAccessToAllLanguages = hasAccessToAllLanguages;
+                this.#checkForLanguageAccess();
+            }, 'observeCurrentUserHasAccessToAllLanguages');
+        });
+    }
+    #observeBlockManager(variantId) {
+        const unique = 'UMB_BLOCK_MANAGER_CONTEXT';
+        if (variantId?.isCultureInvariant()) {
+            /**
+             * If the Block Workspace is invariant, the readOnly state from the Block Manager should apply to the invariant fields(all) of this Workspace: [NL]
+             */
+            // Destroy any prior consumer before reassigning, so a re-emit of an invariant
+            // variantId does not leak the previous context consumer. [NL]
+            this.#consumeBlockManager?.destroy();
+            this.#consumeBlockManager = this.consumeContext(UMB_BLOCK_MANAGER_CONTEXT, (manager) => {
+                this.observe(manager?.readOnlyState.permitted, (isReadOnly) => {
+                    if (isReadOnly === undefined)
+                        return;
+                    if (isReadOnly) {
+                        const rule = {
+                            unique,
+                            permitted: true,
+                        };
+                        this.#workspaceContext?.readOnlyGuard.addRule(rule);
+                        this.#workspaceContext?.content.readOnlyGuard.addRule(rule);
+                        this.#workspaceContext?.settings.readOnlyGuard.addRule(rule);
+                    }
+                    else {
+                        this.#workspaceContext?.readOnlyGuard.removeRule(unique);
+                        this.#workspaceContext?.content.readOnlyGuard.removeRule(unique);
+                        this.#workspaceContext?.settings.readOnlyGuard.removeRule(unique);
+                    }
+                }, 'observeManagerReadOnly');
+            });
+        }
+        else {
+            this.#workspaceContext?.readOnlyGuard.removeRule(unique);
+            this.#workspaceContext?.content.readOnlyGuard.removeRule(unique);
+            this.#workspaceContext?.settings.readOnlyGuard.removeRule(unique);
+            this.#consumeBlockManager?.destroy();
+            this.#consumeBlockManager = undefined;
+            this.removeUmbControllerByAlias('observeManagerReadOnly');
+        }
+    }
+    #checkForLanguageAccess() {
+        if (!this.#workspaceContext ||
+            this.#currentUserHasAccessToAllLanguages == undefined ||
+            this.#currentUserAllowedLanguages == undefined) {
+            return;
+        }
+        const culture = this.#variantId?.culture ?? undefined;
+        // If the block is invariant/segment-only, or the user has access to all languages,
+        // there is no language-based restriction to apply.
+        const allowed = !culture || this.#currentUserHasAccessToAllLanguages === true
+            ? true
+            : (this.#currentUserAllowedLanguages?.includes(culture) ?? false);
+        // Always remove the previously applied rule (tracked by the actual unique key,
+        // not just the current culture). Without this, switching the workspace's culture
+        // from A → B leaves a stale UMB_LANGUAGE_PERMISSION_<A> rule lingering in the
+        // guard manager — `findRule()` is variant-scoped so it stays harmless, but
+        // `getRules()` accumulates one entry per visited culture over the workspace's
+        // lifetime. [NL]
+        if (this.#appliedLanguageUnique) {
+            this.#workspaceContext.readOnlyGuard.removeRule(this.#appliedLanguageUnique);
+            this.#workspaceContext.content.readOnlyGuard.removeRule(this.#appliedLanguageUnique);
+            this.#workspaceContext.settings.readOnlyGuard.removeRule(this.#appliedLanguageUnique);
+            this.#appliedLanguageUnique = undefined;
+        }
+        if (allowed || !culture || !this.#variantId)
+            return;
+        const variantId = this.#variantId;
+        const unique = IDENTIFIER_PREFIX + culture;
+        const rule = {
+            unique,
+            variantId,
+            // `permitted: true` on a read-only guard means "to be read-only"
+            // — i.e. not editable. Combined with `fallbackToPermitted()` (default = read-only).
+            permitted: true,
+        };
+        this.#workspaceContext.readOnlyGuard.addRule(rule);
+        this.#workspaceContext.content.readOnlyGuard.addRule(rule);
+        this.#workspaceContext.settings.readOnlyGuard.addRule(rule);
+        this.#appliedLanguageUnique = unique;
+    }
+}
+export { UmbBlockLanguageAccessWorkspaceController as api };

package/dist-cms/packages/block/block/workspace/block-workspace.context.js

@@ -2,12 +2,14 @@ import { UMB_BLOCK_ENTRIES_CONTEXT, UMB_BLOCK_MANAGER_CONTEXT } from '../context
 import { UmbBlockWorkspaceEditorElement } from './block-workspace-editor.element.js';
 import { UmbBlockElementManager } from './block-element-manager.js';
 import { UMB_BLOCK_WORKSPACE_VIEW_CONTENT, UMB_BLOCK_WORKSPACE_VIEW_SETTINGS } from './constants.js';
+import { UmbBlockLanguageAccessWorkspaceController } from './block-workspace-language-access.controller.js';
 import { UmbSubmittableWorkspaceContextBase, UmbWorkspaceIsNewRedirectController, UmbWorkspaceIsNewRedirectControllerAlias, } from '../../../core/workspace/index.js';
 import { UmbBooleanState, UmbClassState, UmbObjectState, UmbStringState, observeMultiple, } from '../../../../libs/observable-api/index.js';
 import { UMB_DISCARD_CHANGES_MODAL, UMB_MODAL_CONTEXT, UMB_MODAL_MANAGER_CONTEXT } from '../../../core/modal/index.js';
 import { decodeFilePath, UmbReadOnlyVariantGuardManager } from '../../../core/utils/index.js';
 import { UmbVariantId } from '../../../core/variant/index.js';
 import { UmbUfmVirtualRenderController } from '../../../ufm/index.js';
+import { UMB_IS_TRASHED_ENTITY_CONTEXT } from '../../../core/recycle-bin/index.js';
 export class UmbBlockWorkspaceContext extends UmbSubmittableWorkspaceContextBase {
     //
     #blockManager;
@@ -109,6 +111,7 @@ export class UmbBlockWorkspaceContext extends UmbSubmittableWorkspaceContextBase
         const manifest = workspaceArgs.manifest;
         this.#entityType = manifest.meta?.entityType;
         window.addEventListener('willchangestate', this.#onWillNavigate);
+        new UmbBlockLanguageAccessWorkspaceController(this);
         this.content.view.inheritFrom(this.view);
         this.settings.view.inheritFrom(this.view);
         this.addValidationContext(this.content.validation);
@@ -125,6 +128,26 @@ export class UmbBlockWorkspaceContext extends UmbSubmittableWorkspaceContextBase
         this.#retrieveBlockEntries = this.consumeContext(UMB_BLOCK_ENTRIES_CONTEXT, (context) => {
             this.#blockEntries = context;
         }).asPromise({ preventTimeout: true });
+        this.consumeContext(UMB_IS_TRASHED_ENTITY_CONTEXT, (context) => {
+            this.observe(context?.isTrashed, (isTrashed) => {
+                const trashed = isTrashed === true;
+                const unique = 'UMB_PREVENT_EDIT_TRASHED_ITEM';
+                if (trashed) {
+                    const rule = {
+                        unique,
+                        permitted: true,
+                    };
+                    this.readOnlyGuard.addRule(rule);
+                    this.content.readOnlyGuard.addRule(rule);
+                    this.settings.readOnlyGuard.addRule(rule);
+                }
+                else {
+                    this.readOnlyGuard.removeRule(unique);
+                    this.content.readOnlyGuard.removeRule(unique);
+                    this.settings.readOnlyGuard.removeRule(unique);
+                }
+            }, 'observeIsTrashed');
+        }).skipHost();
         this.observe(this.variantId, (variantId) => {
             this.content.setVariantId(variantId);
             this.settings.setVariantId(variantId);
@@ -185,25 +208,6 @@ export class UmbBlockWorkspaceContext extends UmbSubmittableWorkspaceContextBase
                 this.#exposed.setValue(exposed ?? false);
             }, 'observeHasExpose');
         }, 'observeContentKeyAndVariantId');
-        this.observe(
-        // TODO: Again we need to parse on all variants....
-        manager.readOnlyState.isPermittedForObservableVariant(this.variantId), (isReadOnly) => {
-            const unique = 'UMB_BLOCK_MANAGER_CONTEXT';
-            if (isReadOnly) {
-                const rule = {
-                    unique,
-                    variantId: this.#variantId.getValue(),
-                };
-                this.readOnlyGuard?.addRule(rule);
-                this.content.propertyWriteGuard.addRule({ unique, permitted: false });
-                this.settings.propertyWriteGuard.addRule({ unique, permitted: false });
-            }
-            else {
-                this.readOnlyGuard?.removeRule(unique);
-                this.content.propertyWriteGuard.removeRule(unique);
-                this.settings.propertyWriteGuard.removeRule(unique);
-            }
-        }, 'observeIsReadOnly');
         this.observe(this.content.contentTypeId, (contentTypeId) => {
             this.observe(contentTypeId ? manager.blockTypeOf(contentTypeId) : undefined, async (blockType) => {
                 if (blockType?.editorSize) {

package/dist-cms/packages/block/block/workspace/manifests.js

@@ -1,3 +1,4 @@
+import { UMB_BLOCK_WORKSPACE_CONTEXT } from './block-workspace.context-token.js';
 import { UMB_BLOCK_WORKSPACE_ALIAS, UMB_BLOCK_WORKSPACE_VIEW_CONTENT, UMB_BLOCK_WORKSPACE_VIEW_SETTINGS, } from './constants.js';
 import { UMB_WORKSPACE_CONDITION_ALIAS, UmbSubmitWorkspaceAction } from '../../../core/workspace/index.js';
 export const manifests = [
@@ -11,6 +12,7 @@ export const manifests = [
             label: '#general_create',
             look: 'primary',
             color: 'positive',
+            workspaceContextToken: UMB_BLOCK_WORKSPACE_CONTEXT,
         },
         conditions: [
             {
@@ -37,6 +39,7 @@ export const manifests = [
             label: '#general_update',
             look: 'primary',
             color: 'positive',
+            workspaceContextToken: UMB_BLOCK_WORKSPACE_CONTEXT,
         },
         conditions: [
             {

package/dist-cms/packages/block/block-custom-view/types.d.ts

@@ -23,6 +23,7 @@ export interface UmbBlockEditorCustomViewProperties<LayoutType extends UmbBlockL
     settingsInvalid?: boolean;
     unsupported?: boolean;
     unpublished?: boolean;
+    readonly?: boolean;
 }
 export interface UmbBlockEditorCustomViewElement<LayoutType extends UmbBlockLayoutBaseModel = UmbBlockLayoutBaseModel, BlockType extends UmbBlockTypeBaseModel = UmbBlockTypeBaseModel> extends UmbBlockEditorCustomViewProperties<LayoutType, BlockType>, HTMLElement {
 }

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

@@ -198,7 +198,10 @@ let UmbBlockGridEntryElement = class UmbBlockGridEntryElement extends UmbLitElem
             this._workspaceEditSettingsPath = path;
             this.#updateBlockViewProps({ config: { ...this._blockViewProps.config, editSettingsPath: path } });
         }, null);
-        this.observe(this.#context.readOnlyGuard.permitted, (isReadOnly) => (this._isReadOnly = isReadOnly), 'umbReadOnlyObserver');
+        this.observe(this.#context.readOnlyGuard.permitted, (isReadOnly) => {
+            this._isReadOnly = isReadOnly;
+            this.#updateBlockViewProps({ readonly: isReadOnly });
+        }, 'umbReadOnlyObserver');
     }
     async #observeData() {
         this.observe(await this.#context.contentValues(), (content) => {
@@ -364,8 +367,6 @@ let UmbBlockGridEntryElement = class UmbBlockGridEntryElement extends UmbLitElem
 		`;
     }
     #renderEditAction() {
-        if (this._isReadOnly)
-            return nothing;
         return html `
 			${when(this._showContentEdit && this._workspaceEditContentPath, () => html `
 					<uui-button
@@ -389,8 +390,6 @@ let UmbBlockGridEntryElement = class UmbBlockGridEntryElement extends UmbLitElem
 		`;
     }
     #renderEditSettingsAction() {
-        if (this._isReadOnly)
-            return nothing;
         return html `
 			${this._hasSettings && this._workspaceEditSettingsPath
             ? html `

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

@@ -128,17 +128,14 @@ let UmbPropertyEditorUIBlockGridElement = class UmbPropertyEditorUIBlockGridElem
                 this.removeUmbControllerByAlias('observeBlockTypes');
             }
         }).passContextAliasMatches();
-        this.consumeContext(UMB_PROPERTY_CONTEXT, (context) => {
-            this.observe(context?.dataPath, (dataPath) => {
+        this.consumeContext(UMB_PROPERTY_CONTEXT, (propertyContext) => {
+            this.observe(propertyContext?.dataPath, (dataPath) => {
                 if (dataPath) {
                     // Set the data path for the local validation context:
                     this.#validationContext.setDataPath(dataPath);
                     this.#validationContext.autoReport();
                 }
             }, 'observeDataPath');
-        });
-        // TODO: Prevent initial notification from these observes
-        this.consumeContext(UMB_PROPERTY_CONTEXT, (propertyContext) => {
             this.observe(observeMultiple([
                 this.#managerContext.layouts,
                 this.#managerContext.contents,

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

@@ -158,7 +158,10 @@ let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElem
             this._workspaceEditSettingsPath = path;
             this.#updateBlockViewProps({ config: { ...this._blockViewProps.config, editSettingsPath: path } });
         }, null);
-        this.observe(this.#context.readOnlyGuard.permitted, (isReadOnly) => (this._isReadOnly = isReadOnly), 'umbReadOnlyObserver');
+        this.observe(this.#context.readOnlyGuard.permitted, (isReadOnly) => {
+            this._isReadOnly = isReadOnly;
+            this.#updateBlockViewProps({ readonly: isReadOnly });
+        }, 'umbReadOnlyObserver');
     }
     async #observeData() {
         this.observe(await this.#context.contentValues(), (content) => {
@@ -229,6 +232,7 @@ let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElem
 				.icon=${this._icon}
 				.index=${this._blockViewProps.index}
 				.unpublished=${!this._exposed}
+				.readOnly=${this._isReadOnly}
 				.config=${this._blockViewProps.config}
 				.content=${this._blockViewProps.content}
 				.settings=${this._blockViewProps.settings}
@@ -242,6 +246,7 @@ let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElem
 			.icon=${this._icon}
 			.index=${this._blockViewProps.index}
 			.unpublished=${!this._exposed}
+			.readOnly=${this._isReadOnly}
 			.config=${this._blockViewProps.config}
 			.content=${this._blockViewProps.content}
 			.settings=${this._blockViewProps.settings}
@@ -288,8 +293,6 @@ let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElem
 		`;
     }
     #renderEditContentAction() {
-        if (this._isReadOnly)
-            return nothing;
         return this._showContentEdit && this._workspaceEditContentPath
             ? html `<uui-button
 					label="edit"
@@ -312,8 +315,6 @@ let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElem
                 : nothing;
     }
     #renderEditSettingsAction() {
-        if (this._isReadOnly)
-            return nothing;
         return html `
 			${this._hasSettings && this._workspaceEditSettingsPath
             ? html `<uui-button
@@ -333,7 +334,11 @@ let UmbBlockListEntryElement = class UmbBlockListEntryElement extends UmbLitElem
     #renderDeleteAction() {
         if (this._isReadOnly)
             return nothing;
-        return html ` <uui-button label="delete" look="secondary" @click=${() => this.#context.requestDelete()} title=${this.localize.term('general_delete')}>
+        return html ` <uui-button
+			label="delete"
+			look="secondary"
+			@click=${() => this.#context.requestDelete()}
+			title=${this.localize.term('general_delete')}>
 			<uui-icon name="icon-remove"></uui-icon>
 		</uui-button>`;
     }

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

@@ -140,7 +140,10 @@ let UmbBlockRteEntryElement = class UmbBlockRteEntryElement extends UmbLitElemen
             this._workspaceEditSettingsPath = path;
             this.#updateBlockViewProps({ config: { ...this._blockViewProps.config, editSettingsPath: path } });
         }, null);
-        this.observe(this.#context.readOnlyGuard.permitted, (isReadOnly) => (this._isReadOnly = isReadOnly), 'umbReadOnlyObserver');
+        this.observe(this.#context.readOnlyGuard.permitted, (isReadOnly) => {
+            this._isReadOnly = isReadOnly;
+            this.#updateBlockViewProps({ readonly: isReadOnly });
+        }, 'umbReadOnlyObserver');
     }
     async #observeData() {
         this.observe(await this.#context.contentValues(), (content) => {
@@ -231,8 +234,6 @@ let UmbBlockRteEntryElement = class UmbBlockRteEntryElement extends UmbLitElemen
 			.config=${this._blockViewProps.config}></umb-ref-rte-block>`;
     }
     #renderEditAction() {
-        if (this._isReadOnly)
-            return nothing;
         return this._showContentEdit && this._workspaceEditContentPath
             ? html `<uui-button
 					label="edit"
@@ -254,8 +255,6 @@ let UmbBlockRteEntryElement = class UmbBlockRteEntryElement extends UmbLitElemen
                 : nothing;
     }
     #renderEditSettingsAction() {
-        if (this._isReadOnly)
-            return nothing;
         return html `
 			${this._hasSettings && this._workspaceEditSettingsPath
             ? html `<uui-button

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

@@ -160,7 +160,10 @@ let UmbBlockSingleEntryElement = class UmbBlockSingleEntryElement extends UmbLit
             this._workspaceEditSettingsPath = path;
             this.#updateBlockViewProps({ config: { ...this._blockViewProps.config, editSettingsPath: path } });
         }, null);
-        this.observe(this.#context.readOnlyGuard.permitted, (isReadOnly) => (this._isReadOnly = isReadOnly), 'umbReadOnlyObserver');
+        this.observe(this.#context.readOnlyGuard.permitted, (isReadOnly) => {
+            this._isReadOnly = isReadOnly;
+            this.#updateBlockViewProps({ readonly: isReadOnly });
+        }, 'umbReadOnlyObserver');
     }
     async #observeData() {
         this.observe(await this.#context.contentValues(), (content) => {
@@ -280,8 +283,6 @@ let UmbBlockSingleEntryElement = class UmbBlockSingleEntryElement extends UmbLit
             : nothing;
     }
     #renderEditContentAction() {
-        if (this._isReadOnly)
-            return nothing;
         return this._showContentEdit && this._workspaceEditContentPath
             ? html `<uui-button
 					label="edit"
@@ -303,8 +304,6 @@ let UmbBlockSingleEntryElement = class UmbBlockSingleEntryElement extends UmbLit
                 : nothing;
     }
     #renderEditSettingsAction() {
-        if (this._isReadOnly)
-            return nothing;
         return html `
 			${this._hasSettings && this._workspaceEditSettingsPath
             ? html `<uui-button

package/dist-cms/packages/code-editor/umbraco-package.d.ts

@@ -1,3 +1,4 @@
+export declare const name = "Umbraco.CodeEditor";
 export declare const extensions: {
     name: string;
     alias: string;

package/dist-cms/packages/code-editor/umbraco-package.js

@@ -1,3 +1,4 @@
+export const name = 'Umbraco.CodeEditor';
 export const extensions = [
     {
         name: 'Umbraco Code Editor Bundle',