@umbraco-cms/backoffice 18.0.1 → 18.1.0-rc

package/dist-cms/packages/core/utils/is-production-build.function.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Returns true if the current build is a production build, false otherwise.
+ *
+ * Vite substitutes `import.meta.env.PROD` with `true` in the shipped, Vite-bundled core package (and
+ * leaves it `false` in Vite dev). Outside a Vite build — the initial `tsc` pass and web-test-runner —
+ * `import.meta.env` is undefined, so the guard returns false there.
+ * @returns {boolean} `true` if the current build is a production build.
+ */
+export declare function umbIsProductionBuild(): boolean;

package/dist-cms/packages/core/utils/is-production-build.function.js

@@ -0,0 +1,11 @@
+/**
+ * Returns true if the current build is a production build, false otherwise.
+ *
+ * Vite substitutes `import.meta.env.PROD` with `true` in the shipped, Vite-bundled core package (and
+ * leaves it `false` in Vite dev). Outside a Vite build — the initial `tsc` pass and web-test-runner —
+ * `import.meta.env` is undefined, so the guard returns false there.
+ * @returns {boolean} `true` if the current build is a production build.
+ */
+export function umbIsProductionBuild() {
+    return typeof import.meta.env !== 'undefined' && import.meta.env.PROD === true;
+}

package/dist-cms/packages/core/utils/path/url-pattern-to-string.function.d.ts

@@ -2,8 +2,11 @@ export type UmbUrlParametersRecord = Record<string, string | number | {
     toString: () => string;
 } | null>;
 /**
- *
- * @param pattern
- * @param params
+ * Resolves the `:parameter` tokens in a URL pattern using the given parameter values.
+ * @param {string} pattern - A URL pattern where parameters are written as `:name` (e.g. `/section/:id/edit`).
+ * @param {UmbUrlParametersRecord | null} params - Key value object, where keys are parameter names and values are the values to replace them with.
+ * @returns {string} The pattern with its parameter tokens replaced.
+ * @example
+ * umbUrlPatternToString('/section/:id/edit', { id: 123 }); // '/section/123/edit'
  */
 export declare function umbUrlPatternToString(pattern: string, params: UmbUrlParametersRecord | null): string;

package/dist-cms/packages/core/utils/path/url-pattern-to-string.function.js

@@ -1,8 +1,11 @@
 const PARAM_IDENTIFIER = /:([^/]+)/g;
 /**
- *
- * @param pattern
- * @param params
+ * Resolves the `:parameter` tokens in a URL pattern using the given parameter values.
+ * @param {string} pattern - A URL pattern where parameters are written as `:name` (e.g. `/section/:id/edit`).
+ * @param {UmbUrlParametersRecord | null} params - Key value object, where keys are parameter names and values are the values to replace them with.
+ * @returns {string} The pattern with its parameter tokens replaced.
+ * @example
+ * umbUrlPatternToString('/section/:id/edit', { id: 123 }); // '/section/123/edit'
  */
 export function umbUrlPatternToString(pattern, params) {
     return params

package/dist-cms/packages/core/utils/string/from-camel-case/from-camel-case.function.d.ts

@@ -14,3 +14,12 @@
  * // label: 'Workspace Action Menu Item'
  */
 export declare const fromCamelCase: (str: string) => string;
+/**
+ * Applies {@link fromCamelCase} only when the string looks like camelCase
+ * (starts with a lowercase letter and contains no spaces).
+ * Strings that are already display-ready (PascalCase, contain spaces, etc.)
+ * are returned as-is.
+ * @param {string} str - The string to conditionally convert.
+ * @returns {string} - The converted or original string.
+ */
+export declare const fromCamelCaseIfCamelCase: (str: string) => string;

package/dist-cms/packages/core/utils/string/from-camel-case/from-camel-case.function.js

@@ -17,3 +17,17 @@ export const fromCamelCase = (str) => {
     const s = str.replace(/([A-Z])/g, ' $1');
     return s.charAt(0).toUpperCase() + s.slice(1);
 };
+/**
+ * Applies {@link fromCamelCase} only when the string looks like camelCase
+ * (starts with a lowercase letter and contains no spaces).
+ * Strings that are already display-ready (PascalCase, contain spaces, etc.)
+ * are returned as-is.
+ * @param {string} str - The string to conditionally convert.
+ * @returns {string} - The converted or original string.
+ */
+export const fromCamelCaseIfCamelCase = (str) => {
+    if (str.includes(' ') || str.charAt(0) === str.charAt(0).toUpperCase()) {
+        return str;
+    }
+    return fromCamelCase(str);
+};

package/dist-cms/packages/core/validation/context/validation-messages.manager.js

@@ -137,7 +137,7 @@ export class UmbValidationMessagesManager {
     }
     removeMessagesAndDescendantsByPath(path) {
         this.initiateChange();
-        this.#messages.filter((x) => MatchPathOrDescendantPath(x.path, path));
+        this.#messages.filter((x) => !MatchPathOrDescendantPath(x.path, path));
         this.finishChange();
     }
     removeMessagesByTypeAndPath(type, path) {

package/dist-cms/packages/core/validation/controllers/observe-validation-state.controller.js

@@ -6,7 +6,7 @@ export class UmbObserveValidationStateController extends UmbControllerBase {
         super(host, controllerAlias ?? 'observeValidationState_' + dataPath);
         if (dataPath) {
             this.consumeContext(UMB_VALIDATION_CONTEXT, (context) => {
-                this.observe(context?.messages.hasMessagesOfPathAndDescendant(dataPath), callback, ObserveSymbol);
+                this.observe(context?.messages.hasMessagesOfPathAndDescendant(dataPath), (hasMessages) => callback(hasMessages ?? false), ObserveSymbol);
             });
         }
     }

package/dist-cms/packages/core/validation/mixins/form-control.mixin.js

@@ -67,6 +67,8 @@ export function UmbFormControlMixin(superClass, defaultValue) {
         }
         #value;
         #valueOnFocus;
+        // A state to capture late edits to the value after focus has been lost, so we can trigger validation for late value changes. [NL]
+        #hadFocus;
         #form;
         #validators;
         #formCtrlElements;
@@ -78,6 +80,8 @@ export function UmbFormControlMixin(superClass, defaultValue) {
             this._pristine = true;
             this.#value = defaultValue;
             this.#valueOnFocus = undefined;
+            // A state to capture late edits to the value after focus has been lost, so we can trigger validation for late value changes. [NL]
+            this.#hadFocus = false;
             this.#form = null;
             this.#validators = [];
             this.#formCtrlElements = [];
@@ -88,10 +92,14 @@ export function UmbFormControlMixin(superClass, defaultValue) {
             this._internals = this.attachInternals();
             this.addEventListener('focus', () => {
                 this.#valueOnFocus = this.value;
+                this.#hadFocus = false;
             });
             this.addEventListener('blur', () => {
-                if (this.#valueOnFocus !== this.value) {
-                    this.checkValidity();
+                if (this.pristine) {
+                    this.#hadFocus = true;
+                    if (this.#valueOnFocus !== this.value) {
+                        this.checkValidity();
+                    }
                 }
                 this.#valueOnFocus = undefined;
             });
@@ -285,7 +293,14 @@ export function UmbFormControlMixin(superClass, defaultValue) {
         }
         updated(changedProperties) {
             super.updated(changedProperties);
-            this._runValidators();
+            // If still pristine and the input had focus and the value has changed, then we need to check validity, as the value might have been changed after focus was left. [NL]
+            if (this.pristine && this.#hadFocus && changedProperties.has('value')) {
+                // checkValidity will set pristine to false for it self and all connected form controls and then run validators, hence not running _runValidators() below. [NL]
+                this.checkValidity();
+            }
+            else {
+                this._runValidators();
+            }
         }
         #onFormSubmit;
         formAssociatedCallback() {
@@ -301,7 +316,9 @@ export function UmbFormControlMixin(superClass, defaultValue) {
         }
         formResetCallback() {
             this.pristine = true;
+            this.#hadFocus = false;
             this.value = this.getInitialValue() ?? this.getDefaultValue();
+            this.#valueOnFocus = undefined;
         }
         getDefaultValue() {
             return defaultValue;

package/dist-cms/packages/core/value-summary/global-components/value-summary.element.js

@@ -26,7 +26,7 @@ let UmbValueSummaryExtensionElement = class UmbValueSummaryExtensionElement exte
 			single
 			.filter=${this.#filter}
 			.apiProps=${{ valueType: this.valueType, rawValue: this.value }}
-			.fallbackRenderMethod=${() => html `${this.value}`}>
+			.fallbackRenderMethod=${() => html `<span>${this.value}</span>`}>
 		</umb-extension-with-api-slot>`;
     }
 };

package/dist-cms/packages/core/variant/constants.d.ts

@@ -1 +1,2 @@
+export { PublishableVariantStateModel as UmbPublishableVariantState } from '../backend-api/index.js';
 export * from './context/constants.js';

package/dist-cms/packages/core/variant/constants.js

@@ -1 +1,2 @@
+export { PublishableVariantStateModel as UmbPublishableVariantState } from '../backend-api/index.js';
 export * from './context/constants.js';

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

@@ -1,5 +1,6 @@
 export * from './constants.js';
 export * from './context/index.js';
+export * from './sort-variants.function.js';
 export * from './variant-id.class.js';
 export * from './variant-object-compare.function.js';
 export type * from './types.js';

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

@@ -1,4 +1,5 @@
 export * from './constants.js';
 export * from './context/index.js';
+export * from './sort-variants.function.js';
 export * from './variant-id.class.js';
 export * from './variant-object-compare.function.js';

package/dist-cms/packages/core/variant/sort-variants.function.d.ts

@@ -0,0 +1,12 @@
+import type { UmbEntityVariantOptionModel } from './types.js';
+/**
+ * Sorts entity variants in priority order:
+ * 1. Default language first
+ * 2. Mandatory (non-published) variants
+ * 3. By publish state (published → draft → not-created → trashed)
+ * 4. Alphabetically by language name
+ * @param {UmbEntityVariantOptionModel} a - First variant to compare
+ * @param {UmbEntityVariantOptionModel} b - Second variant to compare
+ * @returns {number} - Negative if a sorts first, positive if b sorts first, 0 if equal
+ */
+export declare function sortVariants(a: UmbEntityVariantOptionModel, b: UmbEntityVariantOptionModel): number;

package/dist-cms/packages/core/variant/sort-variants.function.js

@@ -0,0 +1,74 @@
+import { UmbPublishableVariantState } from './constants.js';
+const variantStatesOrder = {
+    [UmbPublishableVariantState.PUBLISHED_PENDING_CHANGES]: 1,
+    [UmbPublishableVariantState.PUBLISHED]: 1,
+    [UmbPublishableVariantState.DRAFT]: 2,
+    [UmbPublishableVariantState.NOT_CREATED]: 3,
+    [UmbPublishableVariantState.TRASHED]: 4,
+};
+const getVariantStateOrderValue = (variant) => {
+    const fallbackOrder = 99;
+    if (!variant || !variant.state) {
+        return fallbackOrder;
+    }
+    return variantStatesOrder[variant.state] || fallbackOrder;
+};
+/**
+ * @param {UmbEntityVariantOptionModel} a - First variant to compare
+ * @param {UmbEntityVariantOptionModel} b - Second variant to compare
+ * @returns {number} - Sorting value
+ */
+function compareDefault(a, b) {
+    return (a.language?.isDefault ? -1 : 1) - (b.language?.isDefault ? -1 : 1);
+}
+const _isPublishedState = (state) => state === UmbPublishableVariantState.PUBLISHED_PENDING_CHANGES || state === UmbPublishableVariantState.PUBLISHED;
+/**
+ * Mandatory variants sort to the top, unless they are published — published variants already sort first and should mix with other published variants.
+ * @param {UmbEntityVariantOptionModel} a - First variant to compare
+ * @param {UmbEntityVariantOptionModel} b - Second variant to compare
+ * @returns {number} - Sorting value
+ */
+function compareMandatory(a, b) {
+    if (_isPublishedState(a.variant?.state))
+        return 0;
+    return (a.language?.isMandatory ? -1 : 1) - (b.language?.isMandatory ? -1 : 1);
+}
+/**
+ * @param {UmbEntityVariantOptionModel} a - First variant to compare
+ * @param {UmbEntityVariantOptionModel} b - Second variant to compare
+ * @returns {number} - Sorting value
+ */
+function compareState(a, b) {
+    return getVariantStateOrderValue(a.variant) - getVariantStateOrderValue(b.variant);
+}
+/**
+ * @param {UmbEntityVariantOptionModel} a - First variant to compare
+ * @param {UmbEntityVariantOptionModel} b - Second variant to compare
+ * @returns {number} - Sorting value
+ */
+function compareName(a, b) {
+    const nameA = a.language?.name;
+    const nameB = b.language?.name;
+    // If both names are missing, consider them equal.
+    if (!nameA && !nameB)
+        return 0;
+    // If only one name is missing, sort the defined name first.
+    if (!nameA)
+        return 1;
+    if (!nameB)
+        return -1;
+    return nameA.localeCompare(nameB);
+}
+/**
+ * Sorts entity variants in priority order:
+ * 1. Default language first
+ * 2. Mandatory (non-published) variants
+ * 3. By publish state (published → draft → not-created → trashed)
+ * 4. Alphabetically by language name
+ * @param {UmbEntityVariantOptionModel} a - First variant to compare
+ * @param {UmbEntityVariantOptionModel} b - Second variant to compare
+ * @returns {number} - Negative if a sorts first, positive if b sorts first, 0 if equal
+ */
+export function sortVariants(a, b) {
+    return compareDefault(a, b) || compareMandatory(a, b) || compareState(a, b) || compareName(a, b);
+}

package/dist-cms/packages/core/workspace/components/workspace-action-menu/workspace-action-menu.element.d.ts

@@ -9,6 +9,8 @@ export declare class UmbWorkspaceActionMenuElement extends UmbLitElement {
     color: UUIInterfaceColor;
     items: Array<UmbExtensionElementAndApiInitializer<ManifestWorkspaceActionMenuItem>>;
     private _popoverOpen;
+    private _popover?;
+    private _onPopoverClickCapture;
     render(): typeof nothing | import("lit-html").TemplateResult<1>;
     static styles: import("lit").CSSResult[];
 }

package/dist-cms/packages/core/workspace/components/workspace-action-menu/workspace-action-menu.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 { css, html, customElement, property, state, nothing, repeat } from '../../../../../external/lit/index.js';
+import { css, html, customElement, property, state, nothing, repeat, query, eventOptions, } from '../../../../../external/lit/index.js';
 import { UmbTextStyles } from '../../../style/index.js';
 import { UmbLitElement } from '../../../lit-element/index.js';
 let UmbWorkspaceActionMenuElement = class UmbWorkspaceActionMenuElement extends UmbLitElement {
@@ -21,6 +21,14 @@ let UmbWorkspaceActionMenuElement = class UmbWorkspaceActionMenuElement extends
         // @ts-ignore
         this._popoverOpen = event.newState === 'open';
     }
+    // Capture phase so this runs before a menu item's action opens its modal: WebKit otherwise
+    // leaves the popovertarget toggle state "open" after the modal light-dismisses the popover,
+    // and the trigger then stops responding until the page is reloaded (#22777).
+    _onPopoverClickCapture() {
+        if (this._popoverOpen) {
+            this._popover?.hidePopover();
+        }
+    }
     render() {
         if (!this.items?.length)
             return nothing;
@@ -38,7 +46,8 @@ let UmbWorkspaceActionMenuElement = class UmbWorkspaceActionMenuElement extends
 				id="workspace-action-popover"
 				margin="6"
 				placement="top-end"
-				@toggle=${this.#onPopoverToggle}>
+				@toggle=${this.#onPopoverToggle}
+				@click=${this._onPopoverClickCapture}>
 				<umb-popover-layout id="workspace-action-popover-layout">
 					<uui-scroll-container>
 						${repeat(this.items, (ext) => ext.alias, (ext) => ext.component)}
@@ -90,6 +99,12 @@ __decorate([
 __decorate([
     state()
 ], UmbWorkspaceActionMenuElement.prototype, "_popoverOpen", void 0);
+__decorate([
+    query('#workspace-action-popover')
+], UmbWorkspaceActionMenuElement.prototype, "_popover", void 0);
+__decorate([
+    eventOptions({ capture: true })
+], UmbWorkspaceActionMenuElement.prototype, "_onPopoverClickCapture", null);
 UmbWorkspaceActionMenuElement = __decorate([
     customElement('umb-workspace-action-menu')
 ], UmbWorkspaceActionMenuElement);

package/dist-cms/packages/core/workspace/components/workspace-editor/workspace-editor.context.js

@@ -47,6 +47,7 @@ export class UmbWorkspaceEditorContext extends UmbContextBase {
                 });
             }
             // Apply overrides:
+            let hasOverrideChange = false;
             contexts.forEach((context) => {
                 const override = overrides.find((x) => x.alias === context.manifest.alias);
                 if (override) {
@@ -59,18 +60,20 @@ export class UmbWorkspaceEditorContext extends UmbContextBase {
                             ...override,
                             meta: { ...context.manifest.meta, ...override.meta },
                         };
+                        hasOverrideChange = true;
                     }
                 }
             });
             // sort contexts to match manifests weights:
             contexts.sort((a, b) => (b.manifest.weight || 0) - (a.manifest.weight || 0));
             this.#contexts = contexts;
-            return contexts;
+            // Return a new array reference when overrides changed, so distinctUntilChanged can detect it:
+            return hasOverrideChange || hasDiff ? [...contexts] : contexts;
         }, 
         // Custom memoize method, to check context instance and manifest instance:
         (previousValue, currentValue) => {
             return (previousValue === currentValue &&
-                currentValue.some((x) => x.manifest === previousValue.find((y) => y.manifest.alias === x.manifest.alias)?.manifest));
+                currentValue.every((x) => x.manifest === previousValue.find((y) => y.manifest.alias === x.manifest.alias)?.manifest));
         });
         // A storage and cache for the current contexts, to enable communicating to them and to avoid re-initializing them every time there is a change of manifests/overrides. [NL]
         this.#contexts = new Array();

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

@@ -1,4 +1,5 @@
 import type { ManifestWorkspaceView } from '../../types.js';
+import { type PropertyValues } from '../../../../../external/lit/index.js';
 import { UmbLitElement } from '../../../lit-element/index.js';
 import type { UmbDeepPartialObject } from '../../../utils/index.js';
 import type { UmbVariantId } from '../../../variant/index.js';
@@ -20,6 +21,7 @@ export declare class UmbWorkspaceEditorElement extends UmbLitElement {
     enforceNoFooter: boolean;
     backPath?: string;
     loading: boolean;
+    notFound?: boolean;
     get variantId(): UmbVariantId | undefined;
     set variantId(value: UmbVariantId | undefined);
     private _variantId?;
@@ -31,6 +33,7 @@ export declare class UmbWorkspaceEditorElement extends UmbLitElement {
     private _routerPath?;
     private _activePath?;
     constructor();
+    willUpdate(changedProperties: PropertyValues<this>): void;
     render(): import("lit-html").TemplateResult<1>;
     static styles: import("lit").CSSResult[];
 }

package/dist-cms/packages/core/workspace/components/workspace-editor/workspace-editor.element.js

@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { UMB_WORKSPACE_VIEW_PATH_PATTERN } from '../../paths.js';
 import { UmbWorkspaceEditorContext } from './workspace-editor.context.js';
-import { css, customElement, html, nothing, property, repeat, state, when } from '../../../../../external/lit/index.js';
+import { css, customElement, html, nothing, property, repeat, state, when, } from '../../../../../external/lit/index.js';
 import { createExtensionElement } from '../../../../../libs/extension-api/index.js';
 import { UmbLitElement } from '../../../lit-element/index.js';
 import { UmbTextStyles } from '../../../style/index.js';
@@ -23,7 +23,7 @@ import { UmbTextStyles } from '../../../style/index.js';
  */
 let UmbWorkspaceEditorElement = class UmbWorkspaceEditorElement extends UmbLitElement {
     //
-    #navigationContext;
+    #context;
     #workspaceViewHintObservers;
     get variantId() {
         return this._variantId;
@@ -33,11 +33,11 @@ let UmbWorkspaceEditorElement = class UmbWorkspaceEditorElement extends UmbLitEl
             return;
         }
         this._variantId = value;
-        this.#navigationContext.setVariantId(value);
+        this.#context.setVariantId(value);
         this.#observeWorkspaceViewHints();
     }
     set overrides(value) {
-        this.#navigationContext.setOverrides(value);
+        this.#context.setOverrides(value);
     }
     get overrides() {
         return undefined;
@@ -45,7 +45,7 @@ let UmbWorkspaceEditorElement = class UmbWorkspaceEditorElement extends UmbLitEl
     constructor() {
         super();
         //
-        this.#navigationContext = new UmbWorkspaceEditorContext(this);
+        this.#context = new UmbWorkspaceEditorContext(this);
         this.#workspaceViewHintObservers = [];
         this.headline = '';
         this.hideNavigation = false;
@@ -53,12 +53,19 @@ let UmbWorkspaceEditorElement = class UmbWorkspaceEditorElement extends UmbLitEl
         this.loading = false;
         this._workspaceViews = [];
         this._hintMap = new Map();
-        this.observe(this.#navigationContext.views, (views) => {
+        this.observe(this.#context.views, (views) => {
             this._workspaceViews = views;
             this.#observeWorkspaceViewHints();
             this.#createRoutes();
         }, null);
     }
+    willUpdate(changedProperties) {
+        super.willUpdate(changedProperties);
+        // only need to check changed properties for an expensive computation.
+        if (changedProperties.has('notFound')) {
+            this.#createRoutes();
+        }
+    }
     #observeWorkspaceViewHints() {
         this.#workspaceViewHintObservers.forEach((observer) => observer.destroy());
         this._hintMap = new Map();
@@ -75,7 +82,7 @@ let UmbWorkspaceEditorElement = class UmbWorkspaceEditorElement extends UmbLitEl
     #currentProvidedView;
     #createRoutes() {
         const newRoutes = [];
-        if (this._workspaceViews.length > 0) {
+        if (!this.notFound && this._workspaceViews.length > 0) {
             this._workspaceViews.forEach((context) => {
                 const manifest = context.manifest;
                 const path = UMB_WORKSPACE_VIEW_PATH_PATTERN.generateLocal({ viewPathname: manifest.meta.pathname });
@@ -111,10 +118,13 @@ let UmbWorkspaceEditorElement = class UmbWorkspaceEditorElement extends UmbLitEl
         // TODO: Deprecate the slot feature, to rely purely on routes, cause currently bringing an additional route would mean the slotted content would never be shown. [NL]
         return html `
 			<umb-body-layout main-no-padding .headline=${this.headline} ?loading=${this.loading}>
-				${this.#renderBackButton()}
-				<slot name="header" slot="header"></slot>
-				<slot name="action-menu" slot="action-menu"></slot>
-				${this.#renderViews()} ${this.#renderRoutes()}
+				${when(!this.notFound, () => html `
+						${this.#renderBackButton()}
+						<slot name="header" slot="header"></slot>
+						<slot name="action-menu" slot="action-menu"></slot>
+						${this.#renderViews()}
+					`)}
+				${this.#renderRoutes()}
 				<slot></slot>
 				${when(!this.enforceNoFooter, () => html `
 						<umb-workspace-footer slot="footer" data-mark="workspace:footer">
@@ -227,11 +237,6 @@ let UmbWorkspaceEditorElement = class UmbWorkspaceEditorElement extends UmbLitEl
 				font-size: var(--uui-type-small-size);
 				right: -1.5em;
 			}
-
-			umb-extension-slot[slot='actions'] {
-				display: flex;
-				gap: var(--uui-size-space-2);
-			}
 		`,
     ]; }
 };
@@ -250,6 +255,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], UmbWorkspaceEditorElement.prototype, "loading", void 0);
+__decorate([
+    property({ type: Boolean })
+], UmbWorkspaceEditorElement.prototype, "notFound", void 0);
 __decorate([
     property({ attribute: false })
 ], UmbWorkspaceEditorElement.prototype, "variantId", null);

package/dist-cms/packages/core/workspace/components/workspace-footer/workspace-footer.element.js

@@ -47,7 +47,7 @@ let UmbWorkspaceFooterLayoutElement = class UmbWorkspaceFooterLayoutElement exte
 				${this._modalContext
             ? html `<uui-button
 							slot="actions"
-							label=${this._isNew ? 'Cancel' : 'Close'}
+							label=${this.localize.term(this._isNew ? 'general_cancel' : 'general_close')}
 							@click=${this.#rejectModal}></uui-button>`
             : ''}
 

package/dist-cms/packages/core/workspace/components/workspace-split-view/workspace-split-view.context.d.ts

@@ -7,6 +7,7 @@ export declare class UmbWorkspaceSplitViewContext extends UmbContextBase {
     getWorkspaceContext(): import("../../index.js").UmbVariantDatasetWorkspaceContext<import("../../../variant/index.js").UmbEntityVariantModel> | undefined;
     index: import("rxjs").Observable<number | undefined>;
     isNew: import("rxjs").Observable<boolean | undefined>;
+    notFound: import("rxjs").Observable<boolean | undefined>;
     variantId: import("rxjs").Observable<UmbVariantId | undefined>;
     constructor(host: UmbControllerHost);
     switchVariant(variant: UmbVariantId): void;

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

@@ -1,7 +1,7 @@
 import { UMB_VARIANT_WORKSPACE_CONTEXT } from '../../contexts/index.js';
 import { UmbContextToken } from '../../../../../libs/context-api/index.js';
 import { UmbContextBase } from '../../../../../libs/class-api/index.js';
-import { UmbBooleanState, UmbClassState, UmbNumberState } from '../../../../../libs/observable-api/index.js';
+import { createObservablePart, UmbBooleanState, UmbClassState, UmbNumberState, } from '../../../../../libs/observable-api/index.js';
 import { UmbVariantId } from '../../../variant/index.js';
 import { UMB_MARK_ATTRIBUTE_NAME } from '../../../const/index.js';
 export class UmbWorkspaceSplitViewContext extends UmbContextBase {
@@ -14,6 +14,7 @@ export class UmbWorkspaceSplitViewContext extends UmbContextBase {
     #datasetContext;
     #index;
     #isNew;
+    #notFound;
     #variantId;
     constructor(host) {
         super(host, UMB_WORKSPACE_SPLIT_VIEW_CONTEXT);
@@ -21,12 +22,15 @@ export class UmbWorkspaceSplitViewContext extends UmbContextBase {
         this.index = this.#index.asObservable();
         this.#isNew = new UmbBooleanState(undefined);
         this.isNew = this.#isNew.asObservable();
+        this.#notFound = new UmbBooleanState(undefined);
+        this.notFound = this.#notFound.asObservable();
         this.#variantId = new UmbClassState(undefined);
         this.variantId = this.#variantId.asObservable();
         this.consumeContext(UMB_VARIANT_WORKSPACE_CONTEXT, (context) => {
             this.#workspaceContext = context;
             this.#observeVariant();
             this.#observeIsNew();
+            this.#observeVariantOption();
         });
         this.observe(this.index, () => {
             this.#observeVariant();
@@ -43,24 +47,36 @@ export class UmbWorkspaceSplitViewContext extends UmbContextBase {
         const index = this.#index.getValue();
         if (index === undefined)
             return;
-        this.observe(this.#workspaceContext.splitView.activeVariantByIndex(index), async (activeVariantInfo) => {
-            if (this.#variantVariantValidationContext) {
-                this.#variantVariantValidationContext.unprovide();
-            }
+        this.observe(this.#workspaceContext.splitView.activeVariantByIndex(index), (activeVariantInfo) => {
+            this.#variantVariantValidationContext?.unprovide();
+            this.#datasetContext?.destroy();
             if (!activeVariantInfo)
                 return;
-            this.#datasetContext?.destroy();
             const variantId = UmbVariantId.Create(activeVariantInfo);
             this.#variantId.setValue(variantId);
-            const validationContext = this.#workspaceContext?.getVariantValidationContext(variantId);
-            if (validationContext) {
-                validationContext.provideAt(this);
-                this.#variantVariantValidationContext = validationContext;
-            }
-            this.#datasetContext = this.#workspaceContext?.createPropertyDatasetContext(this, variantId);
             this.getHostElement().setAttribute(UMB_MARK_ATTRIBUTE_NAME, 'workspace-split-view:' + variantId.toString());
         }, '_observeActiveVariant');
     }
+    #observeVariantOption() {
+        this.observe(this.variantId, (variantId) => {
+            // TODO: move this logic to a method that creates an observable part in the workspace context, so that the split view context can just consume it. [NL]
+            // TODO: eventually consider a getSplitViewVariantOptionByIndex(index) method in the workspace context, that returns an observable part of the variant option for the given index, to enable merging the two observations. [NL]
+            this.observe(this.#workspaceContext && variantId
+                ? createObservablePart(this.#workspaceContext.variantOptions, (variants) => variants.find((v) => v.unique === variantId.toString()))
+                : undefined, (variantOption) => {
+                this.#notFound.setValue(variantOption === undefined);
+                if (!variantOption || !variantId || !this.#workspaceContext)
+                    return;
+                // Finish setting up the split view context by providing the validation context and creating the dataset context for the active variant.
+                const validationContext = this.#workspaceContext?.getVariantValidationContext(variantId);
+                if (validationContext) {
+                    validationContext.provideAt(this);
+                    this.#variantVariantValidationContext = validationContext;
+                }
+                this.#datasetContext = this.#workspaceContext?.createPropertyDatasetContext(this, variantId);
+            }, 'umbObserveActiveVariantById');
+        });
+    }
     switchVariant(variant) {
         const index = this.#index.value;
         if (index === undefined)

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

@@ -18,7 +18,8 @@ export declare class UmbWorkspaceSplitViewElement extends UmbLitElement {
     set splitViewIndex(index: number);
     get splitViewIndex(): number;
     private _variantSelectorSlotHasContent;
-    private _isNew;
+    private _notFound?;
+    private _isNew?;
     private _variantId?;
     readonly splitViewContext: UmbWorkspaceSplitViewContext;
     constructor();