@umbraco-cms/backoffice 17.4.0-rc3 → 18.0.0-beta2

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

@@ -0,0 +1,130 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { UmbElementWorkspaceSplitViewElement } from './element-workspace-split-view.element.js';
+import { UMB_ELEMENT_WORKSPACE_CONTEXT } from './element-workspace.context-token.js';
+import { css, customElement, html, state } from '../../../external/lit/index.js';
+import { UmbLitElement } from '../../core/lit-element/index.js';
+import { UmbTextStyles } from '../../core/style/index.js';
+let UmbElementWorkspaceEditorElement = class UmbElementWorkspaceEditorElement extends UmbLitElement {
+    #workspaceContext;
+    #variants;
+    #isForbidden;
+    constructor() {
+        super();
+        //
+        // TODO: Refactor: when having a split view/variants context token, we can rename the split view/variants component to a generic and make this component generic as well. [NL]
+        this._splitViewElement = new UmbElementWorkspaceSplitViewElement();
+        this.#isForbidden = false;
+        this._loading = true;
+        this._gotWorkspaceRoute = (e) => {
+            this.#workspaceContext?.splitView.setWorkspaceRoute(e.target.absoluteRouterPath);
+        };
+        this.consumeContext(UMB_ELEMENT_WORKSPACE_CONTEXT, (instance) => {
+            this.#workspaceContext = instance;
+            this.#observeVariants();
+            this.#observeForbidden();
+            this.#observeLoading();
+        });
+    }
+    #observeVariants() {
+        if (!this.#workspaceContext)
+            return;
+        this.observe(this.#workspaceContext.variantOptions, (variants) => {
+            this.#variants = variants;
+            this._generateRoutes();
+        }, '_observeVariants');
+    }
+    #observeForbidden() {
+        this.observe(this.#workspaceContext?.forbidden.isOn, (isForbidden) => {
+            this.#isForbidden = isForbidden ?? false;
+            this._generateRoutes();
+        }, '_observeForbidden');
+    }
+    #observeLoading() {
+        this.observe(this.#workspaceContext?.loading.isOn, (loading) => {
+            this._loading = loading ?? false;
+        }, '_observeLoading');
+    }
+    _generateRoutes() {
+        // Generate split view routes for all available routes
+        const routes = [];
+        // Split view routes:
+        this.#variants?.forEach((variantA) => {
+            this.#variants?.forEach((variantB) => {
+                routes.push({
+                    // TODO: When implementing Segments, be aware if using the unique is URL Safe... [NL]
+                    path: variantA.unique + '_&_' + variantB.unique,
+                    component: this._splitViewElement,
+                    setup: (_component, info) => {
+                        // Set split view/active info..
+                        this.#workspaceContext?.splitView.setVariantParts(info.match.fragments.consumed);
+                    },
+                });
+            });
+        });
+        // Single view:
+        this.#variants?.forEach((variant) => {
+            routes.push({
+                // TODO: When implementing Segments, be aware if using the unique is URL Safe... [NL]
+                path: variant.unique,
+                component: this._splitViewElement,
+                setup: (_component, info) => {
+                    // cause we might come from a split-view, we need to reset index 1.
+                    this.#workspaceContext?.splitView.removeActiveVariant(1);
+                    this.#workspaceContext?.splitView.handleVariantFolderPart(0, info.match.fragments.consumed);
+                },
+            });
+        });
+        if (routes.length !== 0 && this.#variants?.length) {
+            // Using first single view as the default route for now (hence the math below):
+            routes.push({
+                path: '',
+                pathMatch: 'full',
+                redirectTo: routes[this.#variants.length * this.#variants.length]?.path,
+            });
+        }
+        routes.push({
+            path: `**`,
+            component: async () => {
+                const router = await import('../../core/router/index.js');
+                return this.#isForbidden ? router.UmbRouteForbiddenElement : router.UmbRouteNotFoundElement;
+            },
+        });
+        this._routes = routes;
+    }
+    render() {
+        return !this._loading && this._routes
+            ? html `<umb-router-slot .routes=${this._routes} @init=${this._gotWorkspaceRoute}></umb-router-slot>`
+            : html `<umb-view-loader></umb-view-loader>`;
+    }
+    static { this.styles = [
+        UmbTextStyles,
+        css `
+			:host {
+				display: block;
+				width: 100%;
+				height: 100%;
+
+				--uui-color-invalid: var(--uui-color-warning);
+				--uui-color-invalid-emphasis: var(--uui-color-warning-emphasis);
+				--uui-color-invalid-standalone: var(--uui-color-warning-standalone);
+				--uui-color-invalid-contrast: var(--uui-color-warning-contrast);
+			}
+		`,
+    ]; }
+};
+__decorate([
+    state()
+], UmbElementWorkspaceEditorElement.prototype, "_routes", void 0);
+__decorate([
+    state()
+], UmbElementWorkspaceEditorElement.prototype, "_loading", void 0);
+UmbElementWorkspaceEditorElement = __decorate([
+    customElement('umb-element-workspace-editor')
+], UmbElementWorkspaceEditorElement);
+export { UmbElementWorkspaceEditorElement };
+export default UmbElementWorkspaceEditorElement;

package/dist-cms/packages/elements/workspace/element-workspace-split-view-variant-selector.element.d.ts

@@ -0,0 +1,15 @@
+import type { UmbElementVariantOptionModel } from '../types.js';
+import { sortVariants } from '../utils.js';
+import { UmbWorkspaceSplitViewVariantSelectorElement } from '../../core/workspace/index.js';
+export declare class UmbElementWorkspaceSplitViewVariantSelectorElement extends UmbWorkspaceSplitViewVariantSelectorElement<UmbElementVariantOptionModel> {
+    #private;
+    protected _variantSorter: typeof sortVariants;
+    private _variantsWithPendingChanges;
+    constructor();
+    protected _renderVariantDetails(variantOption: UmbElementVariantOptionModel): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'umb-element-workspace-split-view-variant-selector': UmbElementWorkspaceSplitViewVariantSelectorElement;
+    }
+}

package/dist-cms/packages/elements/workspace/element-workspace-split-view-variant-selector.element.js

@@ -0,0 +1,61 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { UmbElementVariantState } from '../variant-state.js';
+import { sortVariants } from '../utils.js';
+import { UMB_ELEMENT_PUBLISHING_WORKSPACE_CONTEXT } from '../publishing/index.js';
+import { customElement, html, state } from '../../../external/lit/index.js';
+import { UmbWorkspaceSplitViewVariantSelectorElement } from '../../core/workspace/index.js';
+let UmbElementWorkspaceSplitViewVariantSelectorElement = class UmbElementWorkspaceSplitViewVariantSelectorElement extends UmbWorkspaceSplitViewVariantSelectorElement {
+    #elementPublishingWorkspaceContext;
+    #publishStateLocalizationMap;
+    constructor() {
+        super();
+        this._variantSorter = sortVariants;
+        this._variantsWithPendingChanges = [];
+        this.#publishStateLocalizationMap = {
+            [UmbElementVariantState.DRAFT]: 'content_unpublished',
+            [UmbElementVariantState.PUBLISHED]: 'content_published',
+            // TODO: The pending changes state can be removed once the management Api removes this state
+            // We only keep it here to make typescript happy
+            // We should also make our own state model for this
+            [UmbElementVariantState.PUBLISHED_PENDING_CHANGES]: 'content_published',
+            [UmbElementVariantState.NOT_CREATED]: 'content_notCreated',
+            [UmbElementVariantState.TRASHED]: 'mediaPicker_trashed',
+        };
+        this.consumeContext(UMB_ELEMENT_PUBLISHING_WORKSPACE_CONTEXT, (instance) => {
+            this.#elementPublishingWorkspaceContext = instance;
+            this.#observePendingChanges();
+        });
+    }
+    #observePendingChanges() {
+        this.observe(this.#elementPublishingWorkspaceContext?.publishedPendingChanges.variantsWithChanges, (variants) => {
+            this._variantsWithPendingChanges = variants || [];
+        }, '_observePendingChanges');
+    }
+    #hasPendingChanges(variant) {
+        return this._variantsWithPendingChanges.some((x) => x.variantId.compare(variant));
+    }
+    #getVariantState(variantOption) {
+        let term = this.#publishStateLocalizationMap[variantOption.variant?.state || UmbElementVariantState.NOT_CREATED];
+        if ((variantOption.variant?.state === UmbElementVariantState.PUBLISHED ||
+            variantOption.variant?.state === UmbElementVariantState.PUBLISHED_PENDING_CHANGES) &&
+            this.#hasPendingChanges(variantOption)) {
+            term = 'content_publishedPendingChanges';
+        }
+        return this.localize.term(term);
+    }
+    _renderVariantDetails(variantOption) {
+        return html `${this.#getVariantState(variantOption)}`;
+    }
+};
+__decorate([
+    state()
+], UmbElementWorkspaceSplitViewVariantSelectorElement.prototype, "_variantsWithPendingChanges", void 0);
+UmbElementWorkspaceSplitViewVariantSelectorElement = __decorate([
+    customElement('umb-element-workspace-split-view-variant-selector')
+], UmbElementWorkspaceSplitViewVariantSelectorElement);
+export { UmbElementWorkspaceSplitViewVariantSelectorElement };

package/dist-cms/packages/elements/workspace/element-workspace-split-view.element.d.ts

@@ -0,0 +1,19 @@
+import { nothing } from '../../../external/lit/index.js';
+import { UmbLitElement } from '../../core/lit-element/index.js';
+import './element-workspace-split-view-variant-selector.element.js';
+export declare class UmbElementWorkspaceSplitViewElement extends UmbLitElement {
+    #private;
+    private _workspaceContext?;
+    private _variants?;
+    private _icon?;
+    private _loading;
+    constructor();
+    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult[];
+}
+export default UmbElementWorkspaceSplitViewElement;
+declare global {
+    interface HTMLElementTagNameMap {
+        'umb-element-workspace-split-view': UmbElementWorkspaceSplitViewElement;
+    }
+}

package/dist-cms/packages/elements/workspace/element-workspace-split-view.element.js

@@ -0,0 +1,92 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { UMB_ELEMENT_WORKSPACE_ALIAS, UMB_ELEMENT_WORKSPACE_CONTEXT } from './constants.js';
+import { UmbTextStyles } from '../../core/style/index.js';
+import { css, html, nothing, customElement, state, repeat, ifDefined } from '../../../external/lit/index.js';
+import { UmbLitElement } from '../../core/lit-element/index.js';
+import './element-workspace-split-view-variant-selector.element.js';
+let UmbElementWorkspaceSplitViewElement = class UmbElementWorkspaceSplitViewElement extends UmbLitElement {
+    constructor() {
+        super();
+        this._loading = true;
+        // TODO: Refactor: use a split view workspace context token:
+        this.consumeContext(UMB_ELEMENT_WORKSPACE_CONTEXT, (context) => {
+            this._workspaceContext = context;
+            this.#observeActiveVariantInfo();
+            this.#observeIcon();
+            this.#observeLoading();
+        });
+    }
+    #observeActiveVariantInfo() {
+        if (!this._workspaceContext)
+            return;
+        this.observe(this._workspaceContext.splitView.activeVariantsInfo, (variants) => {
+            this._variants = variants;
+        }, '_observeActiveVariantsInfo');
+    }
+    #observeIcon() {
+        this.observe(this._workspaceContext?.contentTypeIcon, (icon) => {
+            this._icon = icon ?? undefined;
+        }, 'observeIcon');
+    }
+    #observeLoading() {
+        this.observe(this._workspaceContext?.loading.isOn, (loading) => {
+            this._loading = loading ?? false;
+        }, 'observeLoading');
+    }
+    render() {
+        return this._variants
+            ? html `<div id="splitViews">
+						${repeat(this._variants, (view) => view.index + '_' + (view.culture ?? '') + '_' + (view.segment ?? '') + '_' + this._variants.length, (view) => html `
+								<umb-workspace-split-view
+									.loading=${this._loading}
+									.displayNavigation=${view.index === this._variants.length - 1}
+									.splitViewIndex=${view.index}>
+									<umb-icon slot="icon" name=${ifDefined(this._icon)}></umb-icon>
+									<umb-element-workspace-split-view-variant-selector
+										slot="variant-selector"></umb-element-workspace-split-view-variant-selector>
+								</umb-workspace-split-view>
+							`)}
+					</div>
+
+					<umb-workspace-footer alias=${UMB_ELEMENT_WORKSPACE_ALIAS}></umb-workspace-footer>`
+            : nothing;
+    }
+    static { this.styles = [
+        UmbTextStyles,
+        css `
+			:host {
+				width: 100%;
+				height: 100%;
+
+				display: flex;
+				flex: 1;
+				flex-direction: column;
+			}
+
+			#splitViews {
+				display: flex;
+				width: 100%;
+				height: calc(100% - var(--umb-footer-layout-height));
+			}
+		`,
+    ]; }
+};
+__decorate([
+    state()
+], UmbElementWorkspaceSplitViewElement.prototype, "_variants", void 0);
+__decorate([
+    state()
+], UmbElementWorkspaceSplitViewElement.prototype, "_icon", void 0);
+__decorate([
+    state()
+], UmbElementWorkspaceSplitViewElement.prototype, "_loading", void 0);
+UmbElementWorkspaceSplitViewElement = __decorate([
+    customElement('umb-element-workspace-split-view')
+], UmbElementWorkspaceSplitViewElement);
+export { UmbElementWorkspaceSplitViewElement };
+export default UmbElementWorkspaceSplitViewElement;

package/dist-cms/packages/elements/workspace/element-workspace.context-token.d.ts

@@ -0,0 +1,4 @@
+import type { UmbElementWorkspaceContext } from './element-workspace.context.js';
+import { UmbContextToken } from '../../../libs/context-api/index.js';
+import type { UmbSubmittableWorkspaceContext } from '../../core/workspace/index.js';
+export declare const UMB_ELEMENT_WORKSPACE_CONTEXT: UmbContextToken<UmbSubmittableWorkspaceContext, UmbElementWorkspaceContext>;

package/dist-cms/packages/elements/workspace/element-workspace.context-token.js

@@ -0,0 +1,3 @@
+import { UMB_ELEMENT_ENTITY_TYPE } from '../entity.js';
+import { UmbContextToken } from '../../../libs/context-api/index.js';
+export const UMB_ELEMENT_WORKSPACE_CONTEXT = new UmbContextToken('UmbWorkspaceContext', undefined, (context) => context.getEntityType?.() === UMB_ELEMENT_ENTITY_TYPE);

package/dist-cms/packages/elements/workspace/element-workspace.context.d.ts

@@ -0,0 +1,30 @@
+import type { UmbElementDetailRepository } from '../repository/index.js';
+import type { UmbElementDetailModel, UmbElementVariantModel } from '../types.js';
+import { UmbElementWorkspacePropertyDatasetContext } from './property-dataset-context/element-workspace-property-dataset-context.js';
+import { UmbContentDetailWorkspaceContextBase } from '../../content/content/index.js';
+import type { UmbContentWorkspaceContext } from '../../content/content/index.js';
+import type { UmbControllerHost } from '../../../libs/controller-api/index.js';
+import type { UmbDocumentTypeDetailModel } from '../../documents/document-types/index.js';
+import type { UmbEntityModel } from '../../core/entity/index.js';
+import type { UmbVariantId } from '../../core/variant/index.js';
+type ContentModel = UmbElementDetailModel;
+type ContentTypeModel = UmbDocumentTypeDetailModel;
+export declare class UmbElementWorkspaceContext extends UmbContentDetailWorkspaceContextBase<ContentModel, UmbElementDetailRepository, ContentTypeModel, UmbElementVariantModel> implements UmbContentWorkspaceContext<ContentModel, UmbDocumentTypeDetailModel, UmbElementVariantModel> {
+    #private;
+    readonly contentTypeUnique: import("rxjs").Observable<string | undefined>;
+    readonly contentTypeIcon: import("rxjs").Observable<string | null>;
+    readonly isTrashed: import("rxjs").Observable<boolean | undefined>;
+    constructor(host: UmbControllerHost);
+    create(parent: UmbEntityModel, documentTypeUnique: string): Promise<UmbElementDetailModel | undefined>;
+    /**
+     * Gets the unique identifier of the content type.
+     * @returns { string | undefined} The unique identifier of the content type.
+     * @memberof UmbElementWorkspaceContext
+     */
+    getContentTypeUnique(): string | undefined;
+    createPropertyDatasetContext(host: UmbControllerHost, variantId: UmbVariantId): UmbElementWorkspacePropertyDatasetContext;
+    protected _handleSave(): Promise<void>;
+    resetState(): void;
+    destroy(): void;
+}
+export { UmbElementWorkspaceContext as api };

package/dist-cms/packages/elements/workspace/element-workspace.context.js

@@ -0,0 +1,175 @@
+import { UMB_CREATE_ELEMENT_WORKSPACE_PATH_PATTERN, UMB_EDIT_ELEMENT_WORKSPACE_PATH_PATTERN } from '../paths.js';
+import { UMB_ELEMENT_ENTITY_TYPE } from '../entity.js';
+import { UmbElementValidationRepository } from '../repository/validation/index.js';
+import { UMB_ELEMENT_COLLECTION_ALIAS, UMB_ELEMENT_DETAIL_REPOSITORY_ALIAS, UMB_ELEMENT_SAVE_MODAL, UMB_ELEMENT_USER_PERMISSION_CONDITION_ALIAS, UMB_USER_PERMISSION_ELEMENT_CREATE, UMB_USER_PERMISSION_ELEMENT_UPDATE, } from '../constants.js';
+import { UMB_ELEMENT_WORKSPACE_ALIAS } from './constants.js';
+import { UmbElementWorkspacePropertyDatasetContext } from './property-dataset-context/element-workspace-property-dataset-context.js';
+import { createExtensionApiByAlias } from '../../core/extension-registry/index.js';
+import { UmbContentDetailWorkspaceContextBase } from '../../content/content/index.js';
+import { UmbDocumentTypeDetailRepository } from '../../documents/document-types/index.js';
+import { UmbEntityRestoredFromRecycleBinEvent, UmbEntityTrashedEvent, UmbIsTrashedEntityContext, } from '../../core/recycle-bin/index.js';
+import { UmbWorkspaceIsNewRedirectController, UmbWorkspaceIsNewRedirectControllerAlias, } from '../../core/workspace/index.js';
+import { UMB_ACTION_EVENT_CONTEXT } from '../../core/action/index.js';
+import { UMB_DOCUMENT_DETAIL_MODEL_VARIANT_SCAFFOLD } from '../../documents/documents/index.js';
+export class UmbElementWorkspaceContext extends UmbContentDetailWorkspaceContextBase {
+    #actionEventContext;
+    #isTrashedContext;
+    constructor(host) {
+        super(host, {
+            entityType: UMB_ELEMENT_ENTITY_TYPE,
+            workspaceAlias: UMB_ELEMENT_WORKSPACE_ALIAS,
+            collectionAlias: UMB_ELEMENT_COLLECTION_ALIAS,
+            detailRepositoryAlias: UMB_ELEMENT_DETAIL_REPOSITORY_ALIAS,
+            contentTypeDetailRepository: UmbDocumentTypeDetailRepository,
+            contentValidationRepository: UmbElementValidationRepository,
+            skipValidationOnSubmit: false,
+            ignoreValidationResultOnSubmit: true,
+            contentVariantScaffold: UMB_DOCUMENT_DETAIL_MODEL_VARIANT_SCAFFOLD,
+            contentTypePropertyName: 'documentType',
+            saveModalToken: UMB_ELEMENT_SAVE_MODAL,
+        });
+        this.contentTypeUnique = this._data.createObservablePartOfCurrent((data) => data?.documentType.unique);
+        this.contentTypeIcon = this._data.createObservablePartOfCurrent((data) => data?.documentType.icon || null);
+        this.isTrashed = this._data.createObservablePartOfCurrent((data) => data?.isTrashed);
+        this.#isTrashedContext = new UmbIsTrashedEntityContext(this);
+        this.#onRecycleBinEvent = (event) => {
+            const unique = this.getUnique();
+            const entityType = this.getEntityType();
+            if (event.getUnique() !== unique || event.getEntityType() !== entityType)
+                return;
+            this.reload();
+        };
+        this.consumeContext(UMB_ACTION_EVENT_CONTEXT, (actionEventContext) => {
+            this.#removeEventListeners();
+            this.#actionEventContext = actionEventContext;
+            this.#addEventListeners();
+        });
+        this.observe(this.contentTypeUnique, (unique) => {
+            if (unique) {
+                this.structure.loadType(unique);
+            }
+        }, null);
+        this.observe(this.isNew, (isNew) => {
+            if (isNew === undefined)
+                return;
+            if (isNew) {
+                this.#enforceUserPermission(UMB_USER_PERMISSION_ELEMENT_CREATE, 'You do not have permission to create elements.');
+            }
+            else {
+                this.#enforceUserPermission(UMB_USER_PERMISSION_ELEMENT_UPDATE, 'You do not have permission to update elements.');
+            }
+        }, null);
+        this.observe(this.isTrashed, (isTrashed) => this.#onTrashStateChange(isTrashed));
+        this.routes.setRoutes([
+            {
+                path: UMB_CREATE_ELEMENT_WORKSPACE_PATH_PATTERN.toString(),
+                component: () => import('./element-workspace-editor.element.js'),
+                setup: async (_component, info) => {
+                    const parentEntityType = info.match.params.parentEntityType;
+                    const parentUnique = info.match.params.parentUnique === 'null' ? null : info.match.params.parentUnique;
+                    const documentTypeUnique = info.match.params.documentTypeUnique;
+                    await this.create({ entityType: parentEntityType, unique: parentUnique }, documentTypeUnique);
+                    new UmbWorkspaceIsNewRedirectController(this, this, this.getHostElement().shadowRoot.querySelector('umb-router-slot'));
+                },
+            },
+            {
+                path: UMB_EDIT_ELEMENT_WORKSPACE_PATH_PATTERN.toString(),
+                component: () => import('./element-workspace-editor.element.js'),
+                setup: (_component, info) => {
+                    this.removeUmbControllerByAlias(UmbWorkspaceIsNewRedirectControllerAlias);
+                    const unique = info.match.params.unique;
+                    this.load(unique);
+                },
+            },
+        ]);
+    }
+    #enforceUserPermission(verb, message) {
+        // We set the initial permission state to false because the condition is false by default and only execute the callback if it changes.
+        this.#handleUserPermissionChange(verb, false, message);
+        createExtensionApiByAlias(this, UMB_ELEMENT_USER_PERMISSION_CONDITION_ALIAS, [
+            {
+                config: {
+                    allOf: [verb],
+                },
+                onChange: (permitted) => {
+                    this.#handleUserPermissionChange(verb, permitted, message);
+                },
+            },
+        ]);
+    }
+    async create(parent, documentTypeUnique) {
+        return this.createScaffold({
+            parent,
+            preset: {
+                documentType: {
+                    unique: documentTypeUnique,
+                    collection: null,
+                },
+            },
+        });
+    }
+    /**
+     * Gets the unique identifier of the content type.
+     * @returns { string | undefined} The unique identifier of the content type.
+     * @memberof UmbElementWorkspaceContext
+     */
+    getContentTypeUnique() {
+        return this.getData()?.documentType.unique;
+    }
+    createPropertyDatasetContext(host, variantId) {
+        return new UmbElementWorkspacePropertyDatasetContext(host, this, variantId);
+    }
+    async _handleSave() {
+        const elementStyle = this.getHostElement().style;
+        elementStyle.setProperty('--uui-color-invalid', 'var(--uui-color-warning)');
+        elementStyle.setProperty('--uui-color-invalid-emphasis', 'var(--uui-color-warning-emphasis)');
+        elementStyle.setProperty('--uui-color-invalid-standalone', 'var(--uui-color-warning-standalone)');
+        elementStyle.setProperty('--uui-color-invalid-contrast', 'var(--uui-color-warning-contrast)');
+        await super._handleSave();
+    }
+    resetState() {
+        super.resetState();
+        this.#isTrashedContext.setIsTrashed(false);
+    }
+    async #handleUserPermissionChange(identifier, permitted, message) {
+        if (permitted) {
+            this.readOnlyGuard?.removeRule(identifier);
+            return;
+        }
+        this.readOnlyGuard?.addRule({
+            unique: identifier,
+            message,
+            /* This guard is a bit backwards. The rule is permitted to be read-only.
+            If the user does not have permission, we set it to true = permitted to be read-only. */
+            permitted: true,
+        });
+    }
+    #addEventListeners() {
+        this.#actionEventContext?.addEventListener(UmbEntityTrashedEvent.TYPE, this.#onRecycleBinEvent);
+        this.#actionEventContext?.addEventListener(UmbEntityRestoredFromRecycleBinEvent.TYPE, this.#onRecycleBinEvent);
+    }
+    #removeEventListeners() {
+        this.#actionEventContext?.removeEventListener(UmbEntityTrashedEvent.TYPE, this.#onRecycleBinEvent);
+        this.#actionEventContext?.removeEventListener(UmbEntityRestoredFromRecycleBinEvent.TYPE, this.#onRecycleBinEvent);
+    }
+    #onRecycleBinEvent;
+    #onTrashStateChange(isTrashed) {
+        this.#isTrashedContext.setIsTrashed(isTrashed ?? false);
+        const guardUnique = `UMB_PREVENT_EDIT_TRASHED_ITEM`;
+        if (!isTrashed) {
+            this.readOnlyGuard.removeRule(guardUnique);
+            return;
+        }
+        const rule = {
+            unique: guardUnique,
+            permitted: true,
+        };
+        // TODO: Change to use property write guard when it supports making the name read-only.
+        this.readOnlyGuard.addRule(rule);
+    }
+    destroy() {
+        this.#removeEventListeners();
+        super.destroy();
+    }
+}
+export { UmbElementWorkspaceContext as api };

package/dist-cms/packages/elements/workspace/manifests.d.ts

@@ -0,0 +1 @@
+export declare const manifests: Array<UmbExtensionManifest>;

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

@@ -0,0 +1,121 @@
+import { UMB_ELEMENT_MENU_ITEM_ALIAS } from '../menu/constants.js';
+import { UMB_ELEMENT_ENTITY_TYPE } from '../entity.js';
+import { UMB_ELEMENT_USER_PERMISSION_CONDITION_ALIAS, UMB_USER_PERMISSION_ELEMENT_UPDATE, } from '../user-permissions/constants.js';
+import { UMB_ELEMENT_WORKSPACE_ALIAS } from './constants.js';
+import { manifests as elementRoot } from './element-root/manifests.js';
+import { UmbSubmitWorkspaceAction, UMB_WORKSPACE_CONDITION_ALIAS } from '../../core/workspace/index.js';
+import { UMB_ENTITY_IS_NOT_TRASHED_CONDITION_ALIAS } from '../../core/recycle-bin/index.js';
+const workspace = {
+    type: 'workspace',
+    kind: 'routable',
+    alias: UMB_ELEMENT_WORKSPACE_ALIAS,
+    name: 'Element Workspace',
+    api: () => import('./element-workspace.context.js'),
+    meta: {
+        entityType: UMB_ELEMENT_ENTITY_TYPE,
+    },
+};
+const menuStructure = {
+    type: 'workspaceContext',
+    kind: 'menuStructure',
+    name: 'Element Menu Structure Workspace Context',
+    alias: 'Umb.Context.Element.Menu.Structure',
+    api: () => import('./element-menu-structure.context.js'),
+    meta: {
+        menuItemAlias: UMB_ELEMENT_MENU_ITEM_ALIAS,
+    },
+    conditions: [
+        {
+            alias: UMB_WORKSPACE_CONDITION_ALIAS,
+            match: UMB_ELEMENT_WORKSPACE_ALIAS,
+        },
+        {
+            alias: UMB_ENTITY_IS_NOT_TRASHED_CONDITION_ALIAS,
+        },
+    ],
+};
+const workspaceActions = [
+    {
+        type: 'workspaceAction',
+        kind: 'default',
+        alias: 'Umb.WorkspaceAction.Element.Save',
+        name: 'Save Element Workspace Action',
+        api: UmbSubmitWorkspaceAction,
+        meta: {
+            label: '#buttons_save',
+            look: 'secondary',
+            color: 'positive',
+        },
+        conditions: [
+            {
+                alias: UMB_WORKSPACE_CONDITION_ALIAS,
+                match: UMB_ELEMENT_WORKSPACE_ALIAS,
+            },
+            {
+                alias: UMB_ELEMENT_USER_PERMISSION_CONDITION_ALIAS,
+                allOf: [UMB_USER_PERMISSION_ELEMENT_UPDATE],
+            },
+            {
+                alias: UMB_ENTITY_IS_NOT_TRASHED_CONDITION_ALIAS,
+            },
+        ],
+    },
+];
+const workspaceViews = [
+    {
+        type: 'workspaceView',
+        kind: 'contentEditor',
+        alias: 'Umb.WorkspaceView.Element.Edit',
+        name: 'Element Workspace Edit View',
+        weight: 200,
+        meta: {
+            label: '#general_content',
+            pathname: 'content',
+            icon: 'document',
+        },
+        conditions: [
+            {
+                alias: UMB_WORKSPACE_CONDITION_ALIAS,
+                match: UMB_ELEMENT_WORKSPACE_ALIAS,
+            },
+        ],
+    },
+    {
+        type: 'workspaceView',
+        alias: 'Umb.WorkspaceView.Element.Info',
+        name: 'Element Workspace Info View',
+        element: () => import('./views/info/element-workspace-view-info.element.js'),
+        weight: 100,
+        meta: {
+            label: '#general_info',
+            pathname: 'info',
+            icon: 'info',
+        },
+        conditions: [
+            {
+                alias: UMB_WORKSPACE_CONDITION_ALIAS,
+                match: UMB_ELEMENT_WORKSPACE_ALIAS,
+            },
+        ],
+    },
+];
+const workspaceFooterApp = {
+    type: 'workspaceFooterApp',
+    kind: 'variantMenuBreadcrumb',
+    alias: 'Umb.WorkspaceFooterApp.Element.Breadcrumb',
+    name: 'Element Breadcrumb Workspace Footer App',
+    conditions: [
+        {
+            alias: UMB_WORKSPACE_CONDITION_ALIAS,
+            match: UMB_ELEMENT_WORKSPACE_ALIAS,
+        },
+    ],
+};
+export const manifests = [
+    ...elementRoot,
+    menuStructure,
+    workspace,
+    ...workspaceActions,
+    ...workspaceViews,
+    workspaceFooterApp,
+];

package/dist-cms/packages/elements/workspace/property-dataset-context/constants.d.ts

@@ -0,0 +1 @@
+export { UMB_ELEMENT_WORKSPACE_PROPERTY_DATASET_CONTEXT } from './element-workspace-property-dataset-context.token.js';

package/dist-cms/packages/elements/workspace/property-dataset-context/constants.js

@@ -0,0 +1 @@
+export { UMB_ELEMENT_WORKSPACE_PROPERTY_DATASET_CONTEXT } from './element-workspace-property-dataset-context.token.js';