@umbraco-cms/backoffice 14.0.0--preview004-2a8fbe36 → 14.0.0--preview004-eaff2f45

package/dist-cms/packages/core/{workspace/variant-context/variant-context.interface.d.ts → property/property-dataset/property-dataset-context.interface.d.ts}

@@ -1,20 +1,21 @@
 import type { UmbVariantId } from '../../variant/variant-id.class.js';
 import type { Observable } from '../../../../external/rxjs/index.js';
 /**
- * A variant context, represents a set of properties.
+ * A property dataset context, represents the data of a set of properties.
  * This can take form as many, so to list a few:
- * - A specific variant of content
- * - Content that does not vary
+ * - A specific variant of content.
+ * - Content that does not vary.
  * - A block.
  * - A DataType configuration.
+ * - A property editor that hosts a set of properties.
  *
  * The base type of this holds a Name and some Properties.
  * Some might be enriches with Variant Info, like culture and segment.
  * Others might have saved publishing status.
  * Also setting the name is an additional feature.
  */
-export interface UmbVariantContext {
-    getType(): string;
+export interface UmbPropertyDatasetContext {
+    getEntityType(): string;
     getUnique(): string | undefined;
     getVariantId: () => UmbVariantId;
     getName(): string | undefined;
@@ -22,5 +23,5 @@ export interface UmbVariantContext {
     destroy(): void;
     propertyVariantId?: (propertyAlias: string) => Promise<Observable<UmbVariantId | undefined>>;
     propertyValueByAlias<ReturnType = unknown>(propertyAlias: string): Promise<Observable<ReturnType | undefined>>;
-    setPropertyValue(propertyAlias: string, value: unknown): Promise<void>;
+    setPropertyValue(propertyAlias: string, value: unknown): void;
 }

package/dist-cms/packages/core/property/property-dataset/property-dataset-context.token.d.ts

@@ -0,0 +1,3 @@
+import { type UmbPropertyDatasetContext } from './property-dataset-context.interface.js';
+import { UmbContextToken } from '../../../../libs/context-api/index.js';
+export declare const UMB_PROPERTY_DATASET_CONTEXT: UmbContextToken<UmbPropertyDatasetContext, UmbPropertyDatasetContext>;

package/dist-cms/packages/core/property/property-dataset/property-dataset-context.token.js

@@ -0,0 +1,2 @@
+import { UmbContextToken } from '../../../../libs/context-api/index.js';
+export const UMB_PROPERTY_DATASET_CONTEXT = new UmbContextToken('UmbPropertyDatasetContext');

package/dist-cms/packages/core/property/property-dataset/property-dataset.element.d.ts

@@ -0,0 +1,67 @@
+import type { UmbPropertyValueData } from '../types/property-value-data.type.js';
+import { UmbPropertyDatasetBaseContext } from './property-dataset-base-context.js';
+import { UmbLitElement } from '../../../../shared/lit-element/index.js';
+/**
+ *  @element umb-property-dataset
+ *  @description - Element for hosting a property dataset. This is needed for umb-property to work.
+ *  @slot default - Slot for rendering content within.
+ */
+export declare class UmbPropertyDatasetElement extends UmbLitElement {
+    #private;
+    readonly context: UmbPropertyDatasetBaseContext;
+    /**
+     * The value of the dataset.
+     * @returns {Array<UmbPropertyValueData>}
+     * @memberof UmbBasicVariantElement
+     * @example
+     * ```ts
+     * const dataSet = [
+     * 	{
+     * 		alias: 'testAlias',
+     * 		value: 'value as a string',
+     * 	},
+     *  {
+     * 		alias: 'anotherAlias',
+     * 		value: 123,
+     * 	}
+     * ]
+     *
+     * html`
+     * <umb-property-dataset .value="${dataSet}">
+     * 	<umb-property
+     * 		label="My label for this property"
+     * 		description="The description to show on the property"
+     * 		alias="testAlias"
+     * 		property-editor-ui-alias="Umb.PropertyEditorUi.TextBox"
+     * 		.config=${...}>
+     * 	</umb-property>
+     * </umb-property-dataset>
+     * `
+     * ```
+     */
+    get value(): Array<UmbPropertyValueData>;
+    set value(value: Array<UmbPropertyValueData>);
+    /**
+     * The name of the dataset, this name varies depending on the use-case. But this is either
+     * @type {string}
+     * @returns {string}
+     * @memberof UmbBasicVariantElement
+     * @example
+     * ```ts
+     * html`
+     * <umb-property-dataset name="My variant name">
+     * 	...
+     * </umb-property-dataset>
+     * `
+     */
+    get name(): string | undefined;
+    set name(value: string | undefined);
+    constructor();
+    render(): import("lit-html").TemplateResult<1>;
+}
+export default UmbPropertyDatasetElement;
+declare global {
+    interface HTMLElementTagNameMap {
+        'umb-property-dataset': UmbPropertyDatasetElement;
+    }
+}

package/dist-cms/packages/core/property/property-dataset/property-dataset.element.js

@@ -0,0 +1,119 @@
+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 { UmbPropertyDatasetBaseContext } from './property-dataset-base-context.js';
+import { UmbLitElement } from '../../../../shared/lit-element/index.js';
+import { customElement, html, property } from '../../../../external/lit/index.js';
+import { UmbChangeEvent } from '../../event/index.js';
+/**
+ *  @element umb-property-dataset
+ *  @description - Element for hosting a property dataset. This is needed for umb-property to work.
+ *  @slot default - Slot for rendering content within.
+ */
+let UmbPropertyDatasetElement = class UmbPropertyDatasetElement extends UmbLitElement {
+    // Determine wether state change should fire an event when the value is changed.
+    #allowChangeEvent = false;
+    /**
+     * The value of the dataset.
+     * @returns {Array<UmbPropertyValueData>}
+     * @memberof UmbBasicVariantElement
+     * @example
+     * ```ts
+     * const dataSet = [
+     * 	{
+     * 		alias: 'testAlias',
+     * 		value: 'value as a string',
+     * 	},
+     *  {
+     * 		alias: 'anotherAlias',
+     * 		value: 123,
+     * 	}
+     * ]
+     *
+     * html`
+     * <umb-property-dataset .value="${dataSet}">
+     * 	<umb-property
+     * 		label="My label for this property"
+     * 		description="The description to show on the property"
+     * 		alias="testAlias"
+     * 		property-editor-ui-alias="Umb.PropertyEditorUi.TextBox"
+     * 		.config=${...}>
+     * 	</umb-property>
+     * </umb-property-dataset>
+     * `
+     * ```
+     */
+    get value() {
+        return this.context.getValues();
+    }
+    set value(value) {
+        this.#allowChangeEvent = false;
+        this.context.setValues(value);
+        // Above might not trigger a observer callback (if no change), so set the allow change event to true:
+        this.#allowChangeEvent = true;
+    }
+    /**
+     * The name of the dataset, this name varies depending on the use-case. But this is either
+     * @type {string}
+     * @returns {string}
+     * @memberof UmbBasicVariantElement
+     * @example
+     * ```ts
+     * html`
+     * <umb-property-dataset name="My variant name">
+     * 	...
+     * </umb-property-dataset>
+     * `
+     */
+    get name() {
+        return this.context.getName();
+    }
+    set name(value) {
+        this.#allowChangeEvent = false;
+        this.context.setName(value);
+        // Above might not trigger a observer callback (if no change), so set the allow change event to true:
+        this.#allowChangeEvent = true;
+    }
+    constructor() {
+        super();
+        // Prevent any child events escaping this element.
+        this.addEventListener('change', (e) => {
+            if (e.target !== this) {
+                e.stopImmediatePropagation();
+            }
+        });
+        this.context = new UmbPropertyDatasetBaseContext(this);
+        // prevent the first change event from firing:
+        this.#allowChangeEvent = false;
+        this.observe(this.context.name, this.#observerCallback);
+        // prevent the first change event from firing:
+        this.#allowChangeEvent = false;
+        this.observe(this.context.values, this.#observerCallback);
+    }
+    #observerCallback = () => {
+        if (this.#allowChangeEvent) {
+            this.dispatchEvent(new UmbChangeEvent());
+        }
+        else {
+            // Set allow change event to true.
+            this.#allowChangeEvent = true;
+        }
+    };
+    render() {
+        return html `<slot></slot>`;
+    }
+};
+__decorate([
+    property({ attribute: false })
+], UmbPropertyDatasetElement.prototype, "value", null);
+__decorate([
+    property({ attribute: false })
+], UmbPropertyDatasetElement.prototype, "name", null);
+UmbPropertyDatasetElement = __decorate([
+    customElement('umb-property-dataset')
+], UmbPropertyDatasetElement);
+export { UmbPropertyDatasetElement };
+export default UmbPropertyDatasetElement;

package/dist-cms/packages/core/property/property-layout/index.d.ts

@@ -0,0 +1 @@
+export * from './property-layout.element.js';

package/dist-cms/packages/core/property/property-layout/index.js

@@ -0,0 +1 @@
+export * from './property-layout.element.js';

package/dist-cms/packages/core/{workspace/workspace-property-layout/workspace-property-layout.element.d.ts → property/property-layout/property-layout.element.d.ts}

@@ -1,12 +1,12 @@
 import { LitElement } from '../../../../external/lit/index.js';
 /**
- *  @element umb-workspace-property-layout
+ *  @element umb-property-layout
  *  @description - Element for displaying a property in an workspace.
  *  @slot editor - Slot for rendering the Property Editor
  *  @slot description - Slot for rendering things below the label.
- *  @slot property-action-menu - Slot for rendering the Property Action Menu
+ *  @slot action-menu - Slot for rendering the Property Action Menu
  */
-export declare class UmbWorkspacePropertyLayoutElement extends LitElement {
+export declare class UmbPropertyLayoutElement extends LitElement {
     /**
      * Alias. The technical name of the property.
      * @type {string}
@@ -41,6 +41,6 @@ export declare class UmbWorkspacePropertyLayoutElement extends LitElement {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        'umb-workspace-property-layout': UmbWorkspacePropertyLayoutElement;
+        'umb-property-layout': UmbPropertyLayoutElement;
     }
 }

package/dist-cms/packages/core/{workspace/workspace-property-layout/workspace-property-layout.element.js → property/property-layout/property-layout.element.js}

@@ -7,13 +7,13 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { css, html, LitElement, customElement, property } from '../../../../external/lit/index.js';
 import { UmbTextStyles } from '../../../../shared/style/index.js';
 /**
- *  @element umb-workspace-property-layout
+ *  @element umb-property-layout
  *  @description - Element for displaying a property in an workspace.
  *  @slot editor - Slot for rendering the Property Editor
  *  @slot description - Slot for rendering things below the label.
- *  @slot property-action-menu - Slot for rendering the Property Action Menu
+ *  @slot action-menu - Slot for rendering the Property Action Menu
  */
-let UmbWorkspacePropertyLayoutElement = class UmbWorkspacePropertyLayoutElement extends LitElement {
+let UmbPropertyLayoutElement = class UmbPropertyLayoutElement extends LitElement {
     constructor() {
         super(...arguments);
         /**
@@ -51,7 +51,7 @@ let UmbWorkspacePropertyLayoutElement = class UmbWorkspacePropertyLayoutElement
         return html `
 			<div id="headerColumn">
 				<uui-label title=${this.alias}>${this.label}</uui-label>
-				<slot name="property-action-menu"></slot>
+				<slot name="action-menu"></slot>
 				<div id="description">${this.description}</div>
 				<slot name="description"></slot>
 			</div>
@@ -114,17 +114,17 @@ let UmbWorkspacePropertyLayoutElement = class UmbWorkspacePropertyLayoutElement
 };
 __decorate([
     property({ type: String })
-], UmbWorkspacePropertyLayoutElement.prototype, "alias", void 0);
+], UmbPropertyLayoutElement.prototype, "alias", void 0);
 __decorate([
     property({ type: String })
-], UmbWorkspacePropertyLayoutElement.prototype, "label", void 0);
+], UmbPropertyLayoutElement.prototype, "label", void 0);
 __decorate([
     property({ type: String })
-], UmbWorkspacePropertyLayoutElement.prototype, "orientation", void 0);
+], UmbPropertyLayoutElement.prototype, "orientation", void 0);
 __decorate([
     property({ type: String })
-], UmbWorkspacePropertyLayoutElement.prototype, "description", void 0);
-UmbWorkspacePropertyLayoutElement = __decorate([
-    customElement('umb-workspace-property-layout')
-], UmbWorkspacePropertyLayoutElement);
-export { UmbWorkspacePropertyLayoutElement };
+], UmbPropertyLayoutElement.prototype, "description", void 0);
+UmbPropertyLayoutElement = __decorate([
+    customElement('umb-property-layout')
+], UmbPropertyLayoutElement);
+export { UmbPropertyLayoutElement };

package/dist-cms/packages/core/property/types/index.d.ts

@@ -0,0 +1 @@
+export * from './property-value-data.type.js';

package/dist-cms/packages/core/property/types/index.js

@@ -0,0 +1 @@
+export * from './property-value-data.type.js';

package/dist-cms/packages/core/property/types/property-value-data.type.d.ts

@@ -0,0 +1,4 @@
+export type UmbPropertyValueData<ValueType = unknown> = {
+    alias: string;
+    value?: ValueType;
+};

package/dist-cms/packages/core/property/types/property-value-data.type.js

@@ -0,0 +1 @@
+export {};

package/dist-cms/packages/core/property-action/common/clear/property-action-clear.element.js

@@ -4,8 +4,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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_PROPERTY_CONTEXT } from '../../../property/index.js';
 import { html, customElement, property } from '../../../../../external/lit/index.js';
-import { UMB_WORKSPACE_PROPERTY_CONTEXT_TOKEN } from '../../../workspace/index.js';
 import { UmbLitElement } from '../../../../../shared/lit-element/index.js';
 let UmbPropertyActionClearElement = class UmbPropertyActionClearElement extends UmbLitElement {
     constructor() {
@@ -16,7 +16,7 @@ let UmbPropertyActionClearElement = class UmbPropertyActionClearElement extends
             this._propertyActionMenuContext = propertyActionsContext;
         });
         */
-        this.consumeContext(UMB_WORKSPACE_PROPERTY_CONTEXT_TOKEN, (propertyContext) => {
+        this.consumeContext(UMB_PROPERTY_CONTEXT, (propertyContext) => {
             this._propertyContext = propertyContext;
         });
     }

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

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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_WORKSPACE_PROPERTY_CONTEXT_TOKEN } from '../../../workspace/workspace-property/workspace-property.context.js';
+import { UMB_PROPERTY_CONTEXT } from '../../../property/index.js';
 import { html, customElement, property, state } from '../../../../../external/lit/index.js';
 import { UmbTextStyles } from '../../../../../shared/style/index.js';
 import { UmbLitElement } from '../../../../../shared/lit-element/index.js';
@@ -16,7 +16,7 @@ let UmbPropertyEditorUIBlockGridElement = class UmbPropertyEditorUIBlockGridElem
         super();
         this.value = '';
         this._routes = [];
-        this.consumeContext(UMB_WORKSPACE_PROPERTY_CONTEXT_TOKEN, (context) => {
+        this.consumeContext(UMB_PROPERTY_CONTEXT, (context) => {
             this.observe(context?.variantId, (propertyVariantId) => {
                 this._variantId = propertyVariantId;
                 this.setupRoutes();

package/dist-cms/packages/core/property-editor/uis/block-list/config/block-configuration/property-editor-ui-block-list-block-configuration.element.js

@@ -16,7 +16,7 @@ let UmbPropertyEditorUIBlockListBlockConfigurationElement = class UmbPropertyEdi
         this.value = '';
     }
     render() {
-        return html `<div>umb-property-editor-ui-block-list-block-configuration</div>`;
+        return html ` <div>umb-property-editor-ui-block-list-block-configuration</div> `;
     }
     static { this.styles = [UmbTextStyles]; }
 };

package/dist-cms/packages/core/property-editor/uis/multi-url-picker/property-editor-ui-multi-url-picker.element.js

@@ -4,9 +4,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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_PROPERTY_CONTEXT } from '../../../property/index.js';
 import { html, customElement, property, state } from '../../../../../external/lit/index.js';
 import { UmbTextStyles } from '../../../../../shared/style/index.js';
-import { UMB_WORKSPACE_PROPERTY_CONTEXT_TOKEN } from '../../../workspace/index.js';
 import { UmbLitElement } from '../../../../../shared/lit-element/index.js';
 /**
  * @element umb-property-editor-ui-multi-url-picker
@@ -22,7 +22,7 @@ let UmbPropertyEditorUIMultiUrlPickerElement = class UmbPropertyEditorUIMultiUrl
     constructor() {
         super();
         this.value = [];
-        this.consumeContext(UMB_WORKSPACE_PROPERTY_CONTEXT_TOKEN, (context) => {
+        this.consumeContext(UMB_PROPERTY_CONTEXT, (context) => {
             this.observe(context.alias, (alias) => {
                 this._alias = alias;
             });

package/dist-cms/packages/core/property-editor/uis/text-box/property-editor-ui-text-box.element.js

@@ -21,7 +21,10 @@ let UmbPropertyEditorUITextBoxElement = class UmbPropertyEditorUITextBoxElement
         this._maxChars = config?.getValueByAlias('maxChars');
     }
     onChange(e) {
-        this.value = e.target.value;
+        const newValue = e.target.value;
+        if (newValue === this.value)
+            return;
+        this.value = newValue;
         this.dispatchEvent(new CustomEvent('property-value-change'));
     }
     render() {
@@ -30,7 +33,7 @@ let UmbPropertyEditorUITextBoxElement = class UmbPropertyEditorUITextBoxElement
 			.type=${this._type}
 			inputMode=${ifDefined(this._inputMode)}
 			maxlength=${ifDefined(this._maxChars)}
-			@change=${this.onChange}></uui-input>`;
+			@input=${this.onChange}></uui-input>`;
     }
     static { this.styles = [
         UmbTextStyles,

package/dist-cms/packages/core/workspace/index.d.ts

@@ -1,4 +1,4 @@
-export * from './variant-context/index.js';
+export * from './workspace-property-dataset/index.js';
 export * from './workspace-action-menu/index.js';
 export * from './workspace-action/index.js';
 export type { WorkspaceAliasConditionConfig } from './workspace-alias.condition.js';
@@ -8,7 +8,5 @@ export * from './workspace-editor/index.js';
 export * from './workspace-footer/index.js';
 export * from './workspace-is-new-redirect-controller/index.js';
 export * from './workspace-modal/index.js';
-export * from './workspace-property-layout/workspace-property-layout.element.js';
-export * from './workspace-property/index.js';
 export * from './workspace-split-view-manager.class.js';
 export * from './workspace-split-view/index.js';

package/dist-cms/packages/core/workspace/index.js

@@ -1,4 +1,4 @@
-export * from './variant-context/index.js';
+export * from './workspace-property-dataset/index.js';
 export * from './workspace-action-menu/index.js';
 export * from './workspace-action/index.js';
 export * from './workspace-context/index.js';
@@ -6,7 +6,5 @@ export * from './workspace-editor/index.js';
 export * from './workspace-footer/index.js';
 export * from './workspace-is-new-redirect-controller/index.js';
 export * from './workspace-modal/index.js';
-export * from './workspace-property-layout/workspace-property-layout.element.js';
-export * from './workspace-property/index.js';
 export * from './workspace-split-view-manager.class.js';
 export * from './workspace-split-view/index.js';

package/dist-cms/packages/core/workspace/workspace-context/workspace-invariantable-context.interface.d.ts

@@ -1,13 +1,14 @@
 import { UmbVariantId } from '../../variant/variant-id.class.js';
-import { UmbVariantContext } from '../variant-context/variant-context.interface.js';
+import { UmbPropertyDatasetContext } from '../../property/property-dataset/property-dataset-context.interface.js';
 import type { UmbSaveableWorkspaceContextInterface } from './saveable-workspace-context.interface.js';
 import { UmbControllerHost } from '../../../../libs/controller-api/index.js';
 import type { Observable } from '../../../../external/rxjs/index.js';
 export interface UmbInvariantableWorkspaceContextInterface<T = unknown> extends UmbSaveableWorkspaceContextInterface<T> {
+    name: Observable<string | undefined>;
     getName(): string | undefined;
     setName(name: string): void;
     propertyValueByAlias<ReturnType = unknown>(alias: string): Promise<Observable<ReturnType | undefined>>;
     getPropertyValue<ReturnType = unknown>(alias: string): ReturnType;
     setPropertyValue(alias: string, value: unknown): Promise<void>;
-    createVariantContext(host: UmbControllerHost, variantId?: UmbVariantId): UmbVariantContext;
+    createPropertyDatasetContext(host: UmbControllerHost, variantId?: UmbVariantId): UmbPropertyDatasetContext;
 }

package/dist-cms/packages/core/workspace/workspace-context/workspace-variantable-context.interface.d.ts

@@ -1,5 +1,5 @@
 import type { UmbWorkspaceSplitViewManager } from '../workspace-split-view-manager.class.js';
-import { UmbVariantContext } from '../variant-context/variant-context.interface.js';
+import { UmbPropertyDatasetContext } from '../../property/property-dataset/property-dataset-context.interface.js';
 import type { UmbSaveableWorkspaceContextInterface } from './saveable-workspace-context.interface.js';
 import type { Observable } from '../../../../external/rxjs/index.js';
 import type { UmbVariantId } from '../../variant/index.js';
@@ -16,5 +16,5 @@ export interface UmbVariantableWorkspaceContextInterface<EntityType = unknown> e
     propertyValueByAlias<ReturnValue = unknown>(alias: string, variantId?: UmbVariantId): Promise<Observable<ReturnValue | undefined>>;
     getPropertyValue<ReturnValue = unknown>(alias: string, variantId?: UmbVariantId): ReturnValue | undefined;
     setPropertyValue(alias: string, value: unknown, variantId?: UmbVariantId): Promise<void>;
-    createVariantContext(host: UmbControllerHost, variantId?: UmbVariantId): UmbVariantContext;
+    createPropertyDatasetContext(host: UmbControllerHost, variantId?: UmbVariantId): UmbPropertyDatasetContext;
 }

package/dist-cms/packages/core/workspace/workspace-modal/workspace-modal.element.d.ts

@@ -7,7 +7,7 @@ export declare class UmbWorkspaceModalElement extends UmbLitElement {
      * TODO: Consider if this binding and events integration is the right for communicating back the modal handler. Or if we should go with some Context API. like a Modal Context API.
      *
      */
-    render(): import("lit-html").TemplateResult<1>;
+    render(): "" | import("lit-html").TemplateResult<1>;
     static styles: CSSResultGroup;
 }
 export default UmbWorkspaceModalElement;

package/dist-cms/packages/core/workspace/workspace-modal/workspace-modal.element.js

@@ -13,7 +13,7 @@ let UmbWorkspaceModalElement = class UmbWorkspaceModalElement extends UmbLitElem
      *
      */
     render() {
-        return html `<umb-workspace .entityType=${this.data?.entityType}></umb-workspace>`;
+        return this.data ? html `<umb-workspace .entityType=${this.data.entityType}></umb-workspace>` : '';
     }
     static { this.styles = [
         UmbTextStyles,
@@ -26,7 +26,7 @@ let UmbWorkspaceModalElement = class UmbWorkspaceModalElement extends UmbLitElem
     ]; }
 };
 __decorate([
-    property()
+    property({ attribute: false })
 ], UmbWorkspaceModalElement.prototype, "data", void 0);
 UmbWorkspaceModalElement = __decorate([
     customElement('umb-workspace-modal')

package/dist-cms/packages/core/workspace/workspace-property-dataset/index.d.ts

@@ -0,0 +1 @@
+export * from './invariant-workspace-property-dataset-context.js';

package/dist-cms/packages/core/workspace/workspace-property-dataset/index.js

@@ -0,0 +1 @@
+export * from './invariant-workspace-property-dataset-context.js';

package/dist-cms/packages/core/workspace/workspace-property-dataset/invariant-workspace-property-dataset-context.d.ts

@@ -0,0 +1,26 @@
+import { UmbPropertyDatasetContext, UmbNameablePropertyDatasetContext } from '../../property/index.js';
+import { type UmbControllerHost } from '../../../../libs/controller-api/index.js';
+import { UmbBaseController } from '../../../../libs/class-api/index.js';
+import { UmbVariantId } from '../../variant/index.js';
+import { UmbInvariantableWorkspaceContextInterface } from '../index.js';
+/**
+ * A property dataset context that hooks directly into the workspace context.
+ */
+export declare class UmbInvariantWorkspacePropertyDatasetContext<WorkspaceType extends UmbInvariantableWorkspaceContextInterface = UmbInvariantableWorkspaceContextInterface> extends UmbBaseController implements UmbPropertyDatasetContext, UmbNameablePropertyDatasetContext {
+    #private;
+    name: import("rxjs").Observable<string | undefined>;
+    getVariantId(): UmbVariantId;
+    getEntityType(): string;
+    getUnique(): string | undefined;
+    getName(): string | undefined;
+    setName(name: string): void;
+    constructor(host: UmbControllerHost, workspace: WorkspaceType);
+    /**
+     * TODO: Write proper JSDocs here.
+     */
+    propertyValueByAlias<ReturnType = unknown>(propertyAlias: string): Promise<import("rxjs").Observable<ReturnType | undefined>>;
+    /**
+     * TODO: Write proper JSDocs here.
+     */
+    setPropertyValue(propertyAlias: string, value: unknown): Promise<void>;
+}

package/dist-cms/packages/core/workspace/workspace-property-dataset/invariant-workspace-property-dataset-context.js

@@ -0,0 +1,44 @@
+import { UMB_PROPERTY_DATASET_CONTEXT, } from '../../property/index.js';
+import { UmbBaseController } from '../../../../libs/class-api/index.js';
+import { UmbVariantId } from '../../variant/index.js';
+/**
+ * A property dataset context that hooks directly into the workspace context.
+ */
+export class UmbInvariantWorkspacePropertyDatasetContext extends UmbBaseController {
+    #workspace;
+    // default data:
+    getVariantId() {
+        return UmbVariantId.CreateInvariant();
+    }
+    getEntityType() {
+        return this.#workspace.getEntityType();
+    }
+    getUnique() {
+        return this.#workspace.getEntityId();
+    }
+    getName() {
+        return this.#workspace.getName();
+    }
+    setName(name) {
+        this.#workspace.setName(name);
+    }
+    constructor(host, workspace) {
+        // The controller alias, is a very generic name cause we want only one of these for this controller host.
+        super(host, 'variantContext');
+        this.#workspace = workspace;
+        this.name = this.#workspace.name;
+        this.provideContext(UMB_PROPERTY_DATASET_CONTEXT, this);
+    }
+    /**
+     * TODO: Write proper JSDocs here.
+     */
+    async propertyValueByAlias(propertyAlias) {
+        return await this.#workspace.propertyValueByAlias(propertyAlias);
+    }
+    /**
+     * TODO: Write proper JSDocs here.
+     */
+    async setPropertyValue(propertyAlias, value) {
+        return this.#workspace.setPropertyValue(propertyAlias, value);
+    }
+}

package/dist-cms/packages/core/workspace/workspace-split-view/workspace-split-view.context.js

@@ -38,7 +38,7 @@ export class UmbWorkspaceSplitViewContext extends UmbBaseController {
             // TODO: Ask workspace context to create the specific variant context.
             this.#variantContext?.destroy();
             const variantId = UmbVariantId.Create(activeVariantInfo);
-            this.#variantContext = this.#workspaceContext?.createVariantContext(this, variantId);
+            this.#variantContext = this.#workspaceContext?.createPropertyDatasetContext(this, variantId);
         }, '_observeActiveVariant');
     }
     switchVariant(variant) {

package/dist-cms/packages/dictionary/dictionary/workspace/views/editor/workspace-view-dictionary-editor.element.js

@@ -34,14 +34,14 @@ let UmbWorkspaceViewDictionaryEditorElement = class UmbWorkspaceViewDictionaryEd
         if (!language.isoCode)
             return;
         const translation = this._dictionary?.translations?.find((x) => x.isoCode === language.isoCode);
-        return html ` <umb-workspace-property-layout label=${language.name ?? language.isoCode}>
+        return html ` <umb-property-layout label=${language.name ?? language.isoCode}>
 			<uui-textarea
 				slot="editor"
 				name=${language.isoCode}
 				label="translation"
 				@change=${this.#onTextareaChange}
 				value=${ifDefined(translation?.translation)}></uui-textarea>
-		</umb-workspace-property-layout>`;
+		</umb-property-layout>`;
     }
     #onTextareaChange(e) {
         if (e instanceof UUITextareaEvent) {

package/dist-cms/packages/documents/document-types/workspace/views/design/document-type-workspace-view-edit-property.element.js

@@ -165,7 +165,7 @@ let UmbDocumentTypeWorkspacePropertyElement = class UmbDocumentTypeWorkspaceProp
 						.value=${this.property.name}
 						@input=${this.#onNameChange}></uui-input>
 					${this.renderPropertyAlias()}
-					<slot name="property-action-menu"></slot>
+					<slot name="action-menu"></slot>
 					<p>
 						<uui-textarea
 							label="description"