@umbraco-cms/backoffice 14.0.0-d335c2c2 → 14.0.0-d542ed7d

package/dist-cms/packages/core/{property-editors → property-editor}/uis/textarea/property-editor-ui-textarea.element.js

@@ -26,7 +26,6 @@ export let UmbPropertyEditorUITextareaElement = class UmbPropertyEditorUITextare
         this.value = e.target.value;
         this.dispatchEvent(new CustomEvent('property-value-change'));
     }
-    //TODO: uui-textarea needs a rows property
     render() {
         return html ` <uui-textarea
 			label="Textarea"

package/dist-cms/packages/core/section/section-views/section-views.element.js

@@ -11,6 +11,7 @@ import { map, of } from '../../../../external/rxjs/index.js';
 import { umbExtensionsRegistry, } from '../../extension-registry/index.js';
 import { createExtensionElement } from '../../../../libs/extension-api/index.js';
 import { UmbLitElement } from '../../../../shared/lit-element/index.js';
+import { pathFolderName } from '../../../../shared/utils/index.js';
 // TODO: this might need a new name, since it's both view and dashboard now
 export let UmbSectionViewsElement = class UmbSectionViewsElement extends UmbLitElement {
     constructor() {
@@ -23,10 +24,18 @@ export let UmbSectionViewsElement = class UmbSectionViewsElement extends UmbLitE
             this._observeSectionAlias();
         });
     }
+    #constructDashboardPath(manifest) {
+        const dashboardName = manifest.meta.label ?? manifest.name;
+        return 'dashboard/' + (manifest.meta.pathname ? manifest.meta.pathname : pathFolderName(dashboardName));
+    }
+    #constructViewPath(manifest) {
+        const viewName = manifest.meta.label ?? manifest.name;
+        return 'view/' + (manifest.meta.pathname ? manifest.meta.pathname : pathFolderName(viewName));
+    }
     async #createRoutes() {
         const dashboardRoutes = this._dashboards?.map((manifest) => {
             return {
-                path: 'dashboard/' + manifest.meta.pathname,
+                path: this.#constructDashboardPath(manifest),
                 component: () => createExtensionElement(manifest),
                 setup: (component) => {
                     component.manifest = manifest;
@@ -35,7 +44,7 @@ export let UmbSectionViewsElement = class UmbSectionViewsElement extends UmbLitE
         });
         const viewRoutes = this._views?.map((manifest) => {
             return {
-                path: 'view/' + manifest.meta.pathname,
+                path: this.#constructViewPath(manifest),
                 component: () => createExtensionElement(manifest),
                 setup: (component) => {
                     component.manifest = manifest;
@@ -97,14 +106,16 @@ export let UmbSectionViewsElement = class UmbSectionViewsElement extends UmbLitE
         return this._dashboards.length > 0
             ? html `
 					<uui-tab-group slot="header" id="dashboards">
-						${this._dashboards.map((dashboard) => html `
+						${this._dashboards.map((dashboard) => {
+                const dashboardName = dashboard.meta.label ?? dashboard.name;
+                const dashboardPath = this.#constructDashboardPath(dashboard);
+                return html `
 								<uui-tab
-									.label="${dashboard.meta.label || dashboard.name}"
-									href="${this._routerPath}/dashboard/${dashboard.meta.pathname}"
-									?active="${this._activePath === 'dashboard/' + dashboard.meta.pathname}">
-									${dashboard.meta.label || dashboard.name}
-								</uui-tab>
-							`)}
+									.label="${dashboardName}"
+									href="${this._routerPath}/${dashboardPath}"
+									?active="${this._activePath === dashboardPath}"></uui-tab>
+							`;
+            })}
 					</uui-tab-group>
 			  `
             : '';
@@ -113,15 +124,19 @@ export let UmbSectionViewsElement = class UmbSectionViewsElement extends UmbLitE
         return this._views.length > 0
             ? html `
 					<uui-tab-group slot="navigation" id="views">
-						${this._views.map((view) => html `
+						${this._views.map((view) => {
+                const viewName = view.meta.label ?? view.name;
+                const viewPath = this.#constructViewPath(view);
+                return html `
 								<uui-tab
-									.label="${view.meta.label || view.name}"
-									href="${this._routerPath}/view/${view.meta.pathname}"
-									?active="${this._activePath === 'view/' + view.meta.pathname}">
+									.label="${viewName}"
+									href="${this._routerPath}/${viewPath}"
+									?active="${this._activePath === viewPath}">
 									<uui-icon slot="icon" name=${view.meta.icon}></uui-icon>
-									${view.meta.label || view.name}
+									${viewName}
 								</uui-tab>
-							`)}
+							`;
+            })}
 					</uui-tab-group>
 			  `
             : '';

package/dist-cms/packages/core/store/entity-tree-store.js

@@ -13,7 +13,7 @@ export class UmbEntityTreeStore extends UmbStoreBase {
          * An observable to observe the root items
          * @memberof UmbEntityTreeStore
          */
-        this.rootItems = this._data.getObservablePart((items) => items.filter((item) => item.parentId === null));
+        this.rootItems = this._data.asObservablePart((items) => items.filter((item) => item.parentId === null));
     }
     /**
      * Returns an observable to observe the children of a given parent
@@ -22,7 +22,7 @@ export class UmbEntityTreeStore extends UmbStoreBase {
      * @memberof UmbEntityTreeStore
      */
     childrenOf(parentId) {
-        return this._data.getObservablePart((items) => items.filter((item) => item.parentId === parentId));
+        return this._data.asObservablePart((items) => items.filter((item) => item.parentId === parentId));
     }
     /**
      * Returns an observable to observe the items with the given ids
@@ -31,6 +31,6 @@ export class UmbEntityTreeStore extends UmbStoreBase {
      * @memberof UmbEntityTreeStore
      */
     items(ids) {
-        return this._data.getObservablePart((items) => items.filter((item) => ids.includes(item.id ?? '')));
+        return this._data.asObservablePart((items) => items.filter((item) => ids.includes(item.id ?? '')));
     }
 }

package/dist-cms/packages/core/store/file-system-tree.store.js

@@ -13,7 +13,7 @@ export class UmbFileSystemTreeStore extends UmbStoreBase {
          * An observable to observe the root items
          * @memberof UmbFileSystemTreeStore
          */
-        this.rootItems = this._data.getObservablePart((items) => items.filter((item) => item.path?.includes('/') === false));
+        this.rootItems = this._data.asObservablePart((items) => items.filter((item) => item.path?.includes('/') === false));
     }
     /**
      * Returns an observable to observe the children of a given parent
@@ -22,7 +22,7 @@ export class UmbFileSystemTreeStore extends UmbStoreBase {
      * @memberof UmbFileSystemTreeStore
      */
     childrenOf(parentPath) {
-        return this._data.getObservablePart((items) => items.filter((item) => item.path?.startsWith(parentPath + '/') || parentPath === null));
+        return this._data.asObservablePart((items) => items.filter((item) => item.path?.startsWith(parentPath + '/') || parentPath === null));
     }
     /**
      * Returns an observable to observe the items with the given ids
@@ -31,6 +31,6 @@ export class UmbFileSystemTreeStore extends UmbStoreBase {
      * @memberof UmbFileSystemTreeStore
      */
     items(paths) {
-        return this._data.getObservablePart((items) => items.filter((item) => paths.includes(item.path ?? '')));
+        return this._data.asObservablePart((items) => items.filter((item) => paths.includes(item.path ?? '')));
     }
 }

package/dist-cms/packages/core/tree/entity-tree-item/entity-tree-item.element.d.ts

@@ -7,7 +7,7 @@ export declare class UmbEntityTreeItemElement extends UmbLitElement implements U
     private _item?;
     get item(): EntityTreeItemResponseModel | undefined;
     set item(value: EntityTreeItemResponseModel | undefined);
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
     static styles: import("@lit/reactive-element/css-tag.js").CSSResult[];
 }
 declare global {

package/dist-cms/packages/core/tree/tree-item/tree-item.context.interface.d.ts

@@ -1,6 +1,6 @@
 import type { Observable } from '../../../../external/rxjs/index.js';
 import type { UmbControllerHostElement } from '../../../../libs/controller-api/index.js';
-import type { ProblemDetailsModel, TreeItemPresentationModel } from '../../../../external/backend-api/index.js';
+import type { ProblemDetails, TreeItemPresentationModel } from '../../../../external/backend-api/index.js';
 import { UmbPagedData } from '../../../../shared/repository/index.js';
 export interface UmbTreeItemContext<TreeItemType extends TreeItemPresentationModel> {
     host: UmbControllerHostElement;
@@ -18,7 +18,7 @@ export interface UmbTreeItemContext<TreeItemType extends TreeItemPresentationMod
     setTreeItem(treeItem: TreeItemType | undefined): void;
     requestChildren(): Promise<{
         data?: UmbPagedData<TreeItemType> | undefined;
-        error?: ProblemDetailsModel | undefined;
+        error?: ProblemDetails | undefined;
         asObservable?: () => Observable<TreeItemType[]>;
     }>;
     toggleContextMenu(): void;

package/dist-cms/packages/core/tree/tree-item/tree-item.element.d.ts

@@ -3,7 +3,7 @@ import { TreeItemPresentationModel } from '../../../../external/backend-api/inde
 import { UmbLitElement } from '../../../../shared/lit-element/index.js';
 export declare class UmbTreeItemElement extends UmbLitElement {
     item?: TreeItemPresentationModel;
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
     static styles: import("@lit/reactive-element/css-tag").CSSResult[];
 }
 declare global {

package/dist-cms/packages/core/tree/tree-item-base/tree-item-base.context.d.ts

@@ -23,7 +23,7 @@ export declare class UmbTreeItemContextBase<TreeItemType extends TreeItemPresent
     setTreeItem(treeItem: TreeItemType | undefined): void;
     requestChildren(): Promise<{
         data?: import("../../../../shared/repository/tree-repository.interface.js").UmbPagedData<TreeItemType> | undefined;
-        error?: import("../../../../external/backend-api/index.js").ProblemDetailsModel | undefined;
+        error?: import("../../../../external/backend-api/index.js").ProblemDetails | undefined;
         asObservable?: (() => import("rxjs/internal/Observable.js").Observable<TreeItemType[]>) | undefined;
     }>;
     toggleContextMenu(): void;

package/dist-cms/packages/core/tree/tree-item-base/tree-item-base.element.d.ts

@@ -1,6 +1,7 @@
 import { UmbLitElement } from '../../../../shared/lit-element/index.js';
 export declare class UmbTreeItemBaseElement extends UmbLitElement {
     #private;
+    private _iconAlias?;
     private _item?;
     private _childItems?;
     private _href?;

package/dist-cms/packages/core/tree/tree-item-base/tree-item-base.element.js

@@ -93,8 +93,8 @@ export let UmbTreeItemBaseElement = class UmbTreeItemBaseElement extends UmbLitE
 				@slotchange=${(e) => {
             this._iconSlotHasChildren = this.#hasNodes(e);
         }}></slot>
-			${this._item?.icon && !this._iconSlotHasChildren
-            ? html ` <uui-icon slot="icon" name="${this._item.icon}"></uui-icon> `
+			${this._iconAlias && !this._iconSlotHasChildren
+            ? html ` <uui-icon slot="icon" name="${this._iconAlias}"></uui-icon> `
             : nothing}
 		`;
     }
@@ -105,7 +105,7 @@ export let UmbTreeItemBaseElement = class UmbTreeItemBaseElement extends UmbLitE
         return this.#treeItemContext && this._item
             ? html `<umb-entity-actions-bundle
 					slot="actions"
-					entity-type=${this.#treeItemContext.type}
+					.entityType=${this.#treeItemContext.type}
 					.unique=${this.#treeItemContext.unique}
 					.label=${this._item.name}>
 			  </umb-entity-actions-bundle>`
@@ -122,6 +122,9 @@ export let UmbTreeItemBaseElement = class UmbTreeItemBaseElement extends UmbLitE
     }
     static { this.styles = [UUITextStyles, css ``]; }
 };
+__decorate([
+    state()
+], UmbTreeItemBaseElement.prototype, "_iconAlias", void 0);
 __decorate([
     state()
 ], UmbTreeItemBaseElement.prototype, "_item", void 0);

package/dist-cms/packages/core/tree/tree-menu-item/tree-menu-item.element.d.ts

@@ -3,7 +3,7 @@ import { UmbLitElement } from '../../../../shared/lit-element/index.js';
 import { ManifestMenuItemTreeKind, UmbMenuItemExtensionElement } from '../../extension-registry/index.js';
 export declare class UmbMenuItemTreeElement extends UmbLitElement implements UmbMenuItemExtensionElement {
     manifest?: ManifestMenuItemTreeKind;
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
 }
 export default UmbMenuItemTreeElement;
 declare global {

package/dist-cms/packages/core/tree/tree.context.d.ts

@@ -1,7 +1,7 @@
 import { Observable } from '../../../external/rxjs/index.js';
 import { UmbPagedData, UmbTreeRepository } from '../../../shared/repository/index.js';
 import { UmbBaseController, UmbControllerHostElement } from '../../../libs/controller-api/index.js';
-import { ProblemDetailsModel, TreeItemPresentationModel } from '../../../external/backend-api/index.js';
+import { ProblemDetails, TreeItemPresentationModel } from '../../../external/backend-api/index.js';
 export interface UmbTreeContext<TreeItemType extends TreeItemPresentationModel> extends UmbBaseController {
     readonly selectable: Observable<boolean>;
     readonly selection: Observable<Array<string | null>>;
@@ -15,7 +15,7 @@ export interface UmbTreeContext<TreeItemType extends TreeItemPresentationModel>
     deselect(unique: string | null): void;
     requestChildrenOf: (parentUnique: string | null) => Promise<{
         data?: UmbPagedData<TreeItemType>;
-        error?: ProblemDetailsModel;
+        error?: ProblemDetails;
         asObservable?: () => Observable<TreeItemType[]>;
     }>;
 }
@@ -39,16 +39,16 @@ export declare class UmbTreeContextBase<TreeItemType extends TreeItemPresentatio
     deselect(unique: string | null): void;
     requestTreeRoot(): Promise<{
         data?: import("./index.js").UmbTreeRootEntityModel | undefined;
-        error?: ProblemDetailsModel | undefined;
+        error?: ProblemDetails | undefined;
     }>;
     requestRootItems(): Promise<{
         data?: UmbPagedData<TreeItemType> | undefined;
-        error?: ProblemDetailsModel | undefined;
+        error?: ProblemDetails | undefined;
         asObservable?: (() => Observable<TreeItemType[]>) | undefined;
     }>;
     requestChildrenOf(parentUnique: string | null): Promise<{
         data?: UmbPagedData<TreeItemType> | undefined;
-        error?: ProblemDetailsModel | undefined;
+        error?: ProblemDetails | undefined;
         asObservable?: (() => Observable<TreeItemType[]>) | undefined;
     }>;
     rootItems(): Promise<Observable<TreeItemType[]>>;

package/dist-cms/packages/core/tree/tree.context.js

@@ -1,4 +1,3 @@
-import { map } from '../../../external/rxjs/index.js';
 import { umbExtensionsRegistry } from '../extension-registry/index.js';
 import { UmbBooleanState } from '../../../libs/observable-api/index.js';
 import { UmbBaseController } from '../../../libs/controller-api/index.js';
@@ -36,9 +35,7 @@ export class UmbTreeContextBase extends UmbBaseController {
         if (this.#treeAlias === treeAlias)
             return;
         this.#treeAlias = treeAlias;
-        if (treeAlias) {
-            this.#observeTreeManifest();
-        }
+        this.#observeTreeManifest();
     }
     getTreeAlias() {
         return this.#treeAlias;
@@ -94,13 +91,13 @@ export class UmbTreeContextBase extends UmbBaseController {
         return this.repository.treeItemsOf(parentUnique);
     }
     #observeTreeManifest() {
-        this.observe(umbExtensionsRegistry
-            .extensionsOfType('tree')
-            .pipe(map((treeManifests) => treeManifests.find((treeManifest) => treeManifest.alias === this.#treeAlias))), async (treeManifest) => {
-            if (!treeManifest)
-                return;
-            this.#observeRepository(treeManifest);
-        }, '_observeTreeManifest');
+        if (this.#treeAlias) {
+            this.observe(umbExtensionsRegistry.getByTypeAndAlias('tree', this.#treeAlias), async (treeManifest) => {
+                if (!treeManifest)
+                    return;
+                this.#observeRepository(treeManifest);
+            }, '_observeTreeManifest');
+        }
     }
     #observeRepository(treeManifest) {
         const repositoryAlias = treeManifest.meta.repositoryAlias;

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

@@ -1,10 +1,11 @@
-export * from './workspace-action/index.js';
 export * from './workspace-action-menu/index.js';
+export * from './workspace-action/index.js';
+export * from './workspace-context/index.js';
 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-context/index.js';
-export * from './workspace-variant/index.js';
-export * from './workspace-split-view-manager.class.js';
-export * from './workspace-property/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-variant/index.js';

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

@@ -1,10 +1,11 @@
-export * from './workspace-action/index.js';
 export * from './workspace-action-menu/index.js';
+export * from './workspace-action/index.js';
+export * from './workspace-context/index.js';
 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-context/index.js';
-export * from './workspace-variant/index.js';
-export * from './workspace-split-view-manager.class.js';
-export * from './workspace-property/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-variant/index.js';

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

@@ -1,4 +1,4 @@
-import { type UmbDataTypeConfig } from '../../property-editors/index.js';
+import { type UmbDataTypeConfig } from '../../property-editor/index.js';
 export type WorkspacePropertyData<ValueType> = {
     alias?: string;
     label?: string;

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

@@ -2,15 +2,15 @@ import { UmbEntityWorkspaceContextInterface } from './workspace-entity-context.i
 import { UmbControllerHostElement } from '../../../../libs/controller-api/index.js';
 import type { UmbEntityBase } from '../../../../shared/models/index.js';
 import { UmbModalContext } from '../../modal/index.js';
-export declare abstract class UmbWorkspaceContext<T, EntityType extends UmbEntityBase> implements UmbEntityWorkspaceContextInterface<EntityType> {
+export declare abstract class UmbWorkspaceContext<RepositoryType, EntityType extends UmbEntityBase> implements UmbEntityWorkspaceContextInterface<EntityType> {
     #private;
     readonly host: UmbControllerHostElement;
-    readonly repository: T;
+    readonly repository: RepositoryType;
     readonly modalContext?: UmbModalContext<{
         preset: object;
     }>;
     isNew: import("rxjs").Observable<boolean | undefined>;
-    constructor(host: UmbControllerHostElement, repository: T);
+    constructor(host: UmbControllerHostElement, repository: RepositoryType);
     getIsNew(): boolean | undefined;
     setIsNew(isNew: boolean): void;
     protected saveComplete(data: EntityType): void;

package/dist-cms/packages/core/workspace/workspace-is-new-redirect-controller/index.d.ts

@@ -0,0 +1 @@
+export * from './workspace-is-new-redirect-controller.js';

package/dist-cms/packages/core/workspace/workspace-is-new-redirect-controller/index.js

@@ -0,0 +1 @@
+export * from './workspace-is-new-redirect-controller.js';

package/dist-cms/packages/core/workspace/workspace-is-new-redirect-controller/workspace-is-new-redirect-controller.d.ts

@@ -0,0 +1,16 @@
+import { UmbWorkspaceContext } from '../workspace-context/index.js';
+import { UmbBaseController, type UmbControllerHost } from '../../../../libs/controller-api/index.js';
+import type { UmbEntityBase } from '../../../../shared/models/index.js';
+import { type UmbRouterSlotElement } from '../../../../shared/router/index.js';
+/**
+ * Observe the workspace context to see if the entity is new or not.
+ * If that changes redirect to the edit url.
+ *
+ * This requires that the edit URL, is edit/:id
+ * @param host
+ * @param workspaceContext
+ * @param router
+ */
+export declare class UmbWorkspaceIsNewRedirectController extends UmbBaseController {
+    constructor(host: UmbControllerHost, workspaceContext: UmbWorkspaceContext<unknown, UmbEntityBase>, router: UmbRouterSlotElement);
+}

package/dist-cms/packages/core/workspace/workspace-is-new-redirect-controller/workspace-is-new-redirect-controller.js

@@ -0,0 +1,31 @@
+import { UmbBaseController } from '../../../../libs/controller-api/index.js';
+import { createRoutePathBuilder } from '../../../../shared/router/index.js';
+import { ensurePathEndsWithSlash } from '../../../../shared/utils/index.js';
+/**
+ * Observe the workspace context to see if the entity is new or not.
+ * If that changes redirect to the edit url.
+ *
+ * This requires that the edit URL, is edit/:id
+ * @param host
+ * @param workspaceContext
+ * @param router
+ */
+export class UmbWorkspaceIsNewRedirectController extends UmbBaseController {
+    constructor(host, workspaceContext, router) {
+        super(host);
+        // Navigate to edit route when language is created:
+        this.observe(workspaceContext.isNew, (isNew) => {
+            if (isNew === false) {
+                const id = workspaceContext.getEntityId();
+                if (router && id) {
+                    const routerPath = router.absoluteRouterPath;
+                    if (routerPath) {
+                        const newPath = createRoutePathBuilder(ensurePathEndsWithSlash(routerPath) + 'edit/:id')({ id });
+                        window.history.pushState({}, '', newPath);
+                        this.destroy();
+                    }
+                }
+            }
+        }, '_observeIsNew');
+    }
+}

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

@@ -16,11 +16,11 @@ export class UmbWorkspacePropertyContext {
     #variantId;
     constructor(host) {
         this.#data = new UmbObjectState({});
-        this.alias = this.#data.getObservablePart((data) => data.alias);
-        this.label = this.#data.getObservablePart((data) => data.label);
-        this.description = this.#data.getObservablePart((data) => data.description);
-        this.value = this.#data.getObservablePart((data) => data.value);
-        this.configValues = this.#data.getObservablePart((data) => data.config);
+        this.alias = this.#data.asObservablePart((data) => data.alias);
+        this.label = this.#data.asObservablePart((data) => data.label);
+        this.description = this.#data.asObservablePart((data) => data.description);
+        this.value = this.#data.asObservablePart((data) => data.value);
+        this.configValues = this.#data.asObservablePart((data) => data.config);
         this.#configCollection = new UmbClassState(undefined);
         this.config = this.#configCollection.asObservable();
         this._editor = new UmbBasicState(undefined);

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

@@ -1,4 +1,4 @@
-import { type UmbDataTypeConfig } from '../../property-editors/index.js';
+import { type UmbDataTypeConfig } from '../../property-editor/index.js';
 import { UmbVariantId } from '../../variant/index.js';
 import { UmbLitElement } from '../../../../shared/lit-element/index.js';
 /**

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

@@ -49,13 +49,13 @@ export let UmbWorkspacePropertyLayoutElement = class UmbWorkspacePropertyLayoutE
     render() {
         // TODO: Only show alias on label if user has access to DocumentType within settings:
         return html `
-			<div id="header">
+			<div id="headerColumn">
 				<uui-label title=${this.alias}>${this.label}</uui-label>
 				<slot name="property-action-menu"></slot>
 				<div id="description">${this.description}</div>
 				<slot name="description"></slot>
 			</div>
-			<div>
+			<div id="editorColumn">
 				<uui-form-validation-message>
 					<slot name="editor"></slot>
 				</uui-form-validation-message>
@@ -74,33 +74,42 @@ export let UmbWorkspacePropertyLayoutElement = class UmbWorkspacePropertyLayoutE
 				container-type: inline-size;
 			}
 
+			:host(:last-of-type) {
+				border-bottom: none;
+			}
+
 			:host > div {
 				grid-column: span 2;
 			}
-
 			@container (width > 600px) {
 				:host(:not([orientation='vertical'])) > div {
 					grid-column: span 1;
 				}
 			}
 
-			:host(:last-of-type) {
-				border-bottom: none;
+			#headerColumn {
+				position: relative;
+				height: min-content;
+				z-index: 2;
 			}
-
-			:host-context(umb-variantable-property:first-of-type) {
-				padding-top: 0;
+			@container (width > 600px) {
+				#headerColumn {
+					position: sticky;
+					top: calc(var(--uui-size-space-2) * -1);
+				}
 			}
 
 			#description {
 				color: var(--uui-color-text-alt);
 			}
 
-			#header {
-				position: sticky;
-				top: var(--uui-size-space-4);
-				height: min-content;
-				z-index: 2;
+			#editorColumn {
+				margin-top: var(--uui-size-space-3);
+			}
+			@container (width > 600px) {
+				#editorColumn {
+					margin-top: 0;
+				}
 			}
 		`,
     ]; }

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

@@ -31,7 +31,7 @@ export class UmbWorkspaceSplitViewManager {
         }
     }
     activeVariantByIndex(index) {
-        return this.#activeVariantsInfo.getObservablePart((data) => data[index] || undefined);
+        return this.#activeVariantsInfo.asObservablePart((data) => data[index] || undefined);
     }
     switchVariant(index, variantId) {
         // TODO: remember current path and extend url with it.

package/dist-cms/packages/core/workspace/workspace-variant/workspace-variant.context.js

@@ -17,9 +17,9 @@ export class UmbWorkspaceVariantContext {
         this.index = this.#index.asObservable();
         this.#currentVariant = new UmbObjectState(undefined);
         this.currentVariant = this.#currentVariant.asObservable();
-        this.name = this.#currentVariant.getObservablePart((x) => x?.name);
-        this.culture = this.#currentVariant.getObservablePart((x) => x?.culture);
-        this.segment = this.#currentVariant.getObservablePart((x) => x?.segment);
+        this.name = this.#currentVariant.asObservablePart((x) => x?.name);
+        this.culture = this.#currentVariant.asObservablePart((x) => x?.culture);
+        this.segment = this.#currentVariant.asObservablePart((x) => x?.segment);
         this.#variantId = new UmbClassState(undefined);
         this.variantId = this.#variantId.asObservable();
         this.#host = host;

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

@@ -2,7 +2,7 @@ import { nothing } from '../../../external/lit/index.js';
 import { UmbLitElement } from '../../../shared/lit-element/index.js';
 export declare class UmbWorkspaceElement extends UmbLitElement {
     entityType: string;
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
     static styles: import("@lit/reactive-element/css-tag").CSSResult[];
 }
 export default UmbWorkspaceElement;

package/dist-cms/packages/documents/document-blueprints/document-blueprint.detail.store.js

@@ -26,7 +26,7 @@ export class UmbDocumentBlueprintStore extends UmbStoreBase {
             .then((data) => {
             this._data.append(data);
         });
-        return this._data.getObservablePart((documents) => documents.find((document) => document.id === id));
+        return this._data.asObservablePart((documents) => documents.find((document) => document.id === id));
     }
     getScaffold(entityType, parentId) {
         return {};

package/dist-cms/packages/documents/document-types/modals/allowed-document-types/allowed-document-types-modal.element.d.ts

@@ -9,7 +9,7 @@ export declare class UmbAllowedDocumentTypesModalElement extends UmbModalBaseEle
     private _retrieveAllowedChildrenOfRoot;
     private _handleCancel;
     render(): import("lit-html").TemplateResult<1>;
-    static styles: import("@lit/reactive-element/css-tag.js").CSSResult[];
+    static styles: import("@lit/reactive-element/css-tag").CSSResult[];
 }
 export default UmbAllowedDocumentTypesModalElement;
 declare global {