@umbraco-cms/backoffice 17.7.1 → 17.8.0-rc

package/dist-cms/packages/core/collection/components/collection-view-bundle.element.js

@@ -9,17 +9,11 @@ import { css, customElement, html, nothing, query, repeat, state } from '../../.
 import { observeMultiple } from '../../../../libs/observable-api/index.js';
 import { UmbLitElement } from '../../lit-element/index.js';
 import { UmbTextStyles } from '../../style/index.js';
-import { UMB_ROUTE_CONTEXT } from '../../router/index.js';
 let UmbCollectionViewBundleElement = class UmbCollectionViewBundleElement extends UmbLitElement {
     #collectionContext;
     constructor() {
         super();
         this._views = [];
-        this.consumeContext(UMB_ROUTE_CONTEXT, (context) => {
-            this.observe(context?.activePath, (activePath) => {
-                this._collectionRootPathName = activePath;
-            });
-        });
         this.consumeContext(UMB_COLLECTION_CONTEXT, (context) => {
             this.#collectionContext = context;
             this.#observeCollection();
@@ -28,15 +22,17 @@ let UmbCollectionViewBundleElement = class UmbCollectionViewBundleElement extend
     #observeCollection() {
         if (!this.#collectionContext)
             return;
-        this.observe(this.#collectionContext.view.currentView, (currentView) => {
-            if (!currentView)
-                return;
-            this._currentView = this._views.find((view) => view.alias === currentView.alias);
-        }, 'umbCurrentCollectionViewObserver');
-        this.observe(observeMultiple([this.#collectionContext.view.views, this.#collectionContext.viewLayouts]), ([manifests, viewLayouts]) => {
+        // The available views and the current one are resolved together, as the current view is presented through the
+        // layout of one of the available views.
+        this.observe(observeMultiple([
+            this.#collectionContext.view.views,
+            this.#collectionContext.viewLayouts,
+            this.#collectionContext.view.currentView,
+        ]), ([manifests, viewLayouts, currentView]) => {
             if (!manifests?.length && !viewLayouts?.length)
                 return;
             this._views = this.#mapManifestToViewLayout(manifests, viewLayouts);
+            this._currentView = this._views.find((view) => view.manifest.alias === currentView?.alias);
         }, 'umbCollectionViewsAndLayoutsObserver');
     }
     #mapManifestToViewLayout(manifests, viewLayouts) {
@@ -47,23 +43,22 @@ let UmbCollectionViewBundleElement = class UmbCollectionViewBundleElement extend
                 if (!viewManifest)
                     return;
                 layouts.push({
-                    alias: viewManifest.alias,
+                    manifest: viewManifest,
                     label: viewLayout.name ?? viewManifest.meta.label,
                     icon: viewLayout.icon ?? viewManifest.meta.icon,
-                    pathName: viewManifest.meta.pathName,
                 });
             });
             return layouts;
         }
         // fallback on the 'collectionView' manifests
         return manifests.map((manifest) => ({
-            alias: manifest.alias,
+            manifest,
             label: manifest.meta.label,
             icon: manifest.meta.icon,
-            pathName: manifest.meta.pathName,
         }));
     }
-    #onClick() {
+    #onClick(view) {
+        this.#collectionContext?.view.setCurrentView(view.manifest);
         setTimeout(() => {
             // TODO: This ignorer is just neede for JSON SCHEMA TO WORK, As its not updated with latest TS jet.
             // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -77,13 +72,17 @@ let UmbCollectionViewBundleElement = class UmbCollectionViewBundleElement extend
         if (this._views.length <= 1)
             return nothing;
         return html `
-			<uui-button compact popovertarget="collection-view-bundle-popover" label="status">
+			<uui-button
+				compact
+				popovertarget="collection-view-bundle-popover"
+				label=${this.localize.term('general_switchView')}
+				data-mark="collection:switch-view">
 				<umb-icon name=${this._currentView.icon}></umb-icon>
 			</uui-button>
 			<uui-popover-container id="collection-view-bundle-popover" placement="bottom-end">
 				<umb-popover-layout>
 					<div class="filter-dropdown">
-						${repeat(this._views, (view) => view.alias, (view) => this.#renderItem(view))}
+						${repeat(this._views, (view) => view.manifest.alias, (view) => this.#renderItem(view))}
 					</div>
 				</umb-popover-layout>
 			</uui-popover-container>
@@ -92,10 +91,10 @@ let UmbCollectionViewBundleElement = class UmbCollectionViewBundleElement extend
     #renderItem(view) {
         return html `
 			<uui-menu-item
-				label=${view.label}
-				href="${this._collectionRootPathName}/${view.pathName}"
-				@click-label=${() => this.#onClick()}
-				?active=${view.alias === this._currentView?.alias}>
+				label=${this.localize.string(view.label)}
+				@click-label=${() => this.#onClick(view)}
+				?active=${view.manifest.alias === this._currentView?.manifest.alias}
+				data-mark="collection:switch-view:${view.manifest.alias}">
 				<umb-icon slot="icon" name=${view.icon}></umb-icon>
 			</uui-menu-item>
 		`;
@@ -121,9 +120,6 @@ __decorate([
 __decorate([
     state()
 ], UmbCollectionViewBundleElement.prototype, "_currentView", void 0);
-__decorate([
-    state()
-], UmbCollectionViewBundleElement.prototype, "_collectionRootPathName", void 0);
 __decorate([
     query('#collection-view-bundle-popover')
 ], UmbCollectionViewBundleElement.prototype, "_popover", void 0);

package/dist-cms/packages/core/collection/default/collection-default.context.d.ts

@@ -30,6 +30,8 @@ export declare class UmbDefaultCollectionContext<CollectionItemType extends {
     readonly filter: import("rxjs").Observable<object | FilterModelType>;
     protected _selectOnly: UmbBooleanState<undefined>;
     readonly selectOnly: import("rxjs").Observable<boolean | undefined>;
+    readonly hideItemActions: import("rxjs").Observable<boolean>;
+    readonly hideCollectionActions: import("rxjs").Observable<boolean>;
     readonly workspacePathBuilder: import("rxjs").Observable<UmbModalRouteBuilder | undefined>;
     readonly userDefinedProperties: import("rxjs").Observable<UmbCollectionColumnConfiguration[]>;
     readonly viewLayouts: import("rxjs").Observable<UmbCollectionLayoutConfiguration[]>;

package/dist-cms/packages/core/collection/default/collection-default.context.js

@@ -21,6 +21,8 @@ const ORDER_MEMORY_UNIQUE = 'UmbCollectionOrder';
 const PAGINATION_MEMORY_UNIQUE = 'UmbCollectionPagination';
 export class UmbDefaultCollectionContext extends UmbContextBase {
     #config;
+    #hideItemActions;
+    #hideCollectionActions;
     #workspacePathBuilder;
     #userDefinedProperties;
     #viewLayouts;
@@ -45,6 +47,10 @@ export class UmbDefaultCollectionContext extends UmbContextBase {
         this.filter = this._filter.asObservable();
         this._selectOnly = new UmbBooleanState(undefined);
         this.selectOnly = this._selectOnly.asObservable();
+        this.#hideItemActions = new UmbBooleanState(false);
+        this.hideItemActions = this.#hideItemActions.asObservable();
+        this.#hideCollectionActions = new UmbBooleanState(false);
+        this.hideCollectionActions = this.#hideCollectionActions.asObservable();
         this.#workspacePathBuilder = new UmbBasicState(undefined);
         this.workspacePathBuilder = this.#workspacePathBuilder.asObservable();
         this.#userDefinedProperties = new UmbArrayState([], (x) => x.alias);
@@ -150,6 +156,8 @@ export class UmbDefaultCollectionContext extends UmbContextBase {
         if (!this.#config)
             return;
         this.#configureSelection();
+        this.#hideItemActions.setValue(this.#config.hideItemActions ?? false);
+        this.#hideCollectionActions.setValue(this.#config.hideCollectionActions ?? false);
         this.bulkAction.setConfig(this.#config.bulkActionConfiguration);
         // Observe bulk actions to enable selection when bulk actions are available
         // Bulk Actions are an integrated part of a Collection so we handle it here instead of a configuration

package/dist-cms/packages/core/collection/default/collection-default.element.d.ts

@@ -1,7 +1,7 @@
 import { UmbLitElement } from '../../lit-element/index.js';
 export declare class UmbCollectionDefaultElement extends UmbLitElement {
     #private;
-    private _routes;
+    private _viewElement?;
     private _hasItems;
     private _emptyLabel?;
     private _initialLoadDone;

package/dist-cms/packages/core/collection/default/collection-default.element.js

@@ -7,6 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { UmbDefaultCollectionContext } from './collection-default.context.js';
 import { UMB_COLLECTION_CONTEXT } from './collection-default.context-token.js';
 import { css, html, customElement, state } from '../../../../external/lit/index.js';
+import { createExtensionElement } from '../../../../libs/extension-api/index.js';
 import { umbExtensionsRegistry } from '../../extension-registry/index.js';
 import { UmbLitElement } from '../../lit-element/index.js';
 import { UmbTextStyles } from '../../style/index.js';
@@ -27,13 +28,12 @@ let UmbCollectionDefaultElement = class UmbCollectionDefaultElement extends UmbL
     #collectionContext;
     constructor() {
         super();
-        this._routes = [];
         this._hasItems = false;
         this._initialLoadDone = false;
         this.consumeContext(UMB_COLLECTION_CONTEXT, async (context) => {
             this.#collectionContext = context;
             this.#observeIsLoading();
-            this.#observeCollectionRoutes();
+            this.#observeCurrentView();
             this.#observeTotalItems();
             this.#getEmptyStateLabel();
             this.#collectionContext?.loadCollection();
@@ -55,12 +55,25 @@ let UmbCollectionDefaultElement = class UmbCollectionDefaultElement extends UmbL
             }
         }, 'umbCollectionIsLoadingObserver');
     }
-    #observeCollectionRoutes() {
+    #observeCurrentView() {
         if (!this.#collectionContext)
             return;
-        this.observe(this.#collectionContext.view.routes, (routes) => {
-            this._routes = routes;
-        }, 'umbCollectionRoutesObserver');
+        this.observe(this.#collectionContext.view.currentView, async (manifest) => {
+            if (!manifest) {
+                this._viewElement = undefined;
+                return;
+            }
+            const element = await createExtensionElement(manifest);
+            // Views are imported on demand, so a slow import must not replace the view that became the current one
+            // while it was in flight.
+            if (manifest.alias !== this.#collectionContext?.view.getCurrentView()?.alias)
+                return;
+            if (element) {
+                element.setAttribute('data-mark', `collection-view:${manifest.alias}`);
+                element.manifest = manifest;
+            }
+            this._viewElement = element;
+        }, 'umbCollectionCurrentViewObserver');
     }
     #observeTotalItems() {
         if (!this.#collectionContext)
@@ -80,10 +93,10 @@ let UmbCollectionDefaultElement = class UmbCollectionDefaultElement extends UmbL
 		`;
     }
     #renderBody() {
-        if (!this._initialLoadDone || !this._routes.length)
+        if (!this._initialLoadDone || !this._viewElement)
             return html `<umb-view-loader></umb-view-loader>`;
         return html `
-			<umb-router-slot id="router" .routes=${this._routes}></umb-router-slot>
+			<div id="view">${this._viewElement}</div>
 			${this.renderToolbar()} ${this._hasItems ? this.#renderContent() : this._renderEmptyState()}
 		`;
     }
@@ -117,11 +130,13 @@ let UmbCollectionDefaultElement = class UmbCollectionDefaultElement extends UmbL
 				height: 100%;
 			}
 
-			#router {
+			/* Sizes to the view it holds, so the empty state below it is not pushed out of sight when the view is empty. */
+			#view {
+				position: relative;
 				visibility: hidden;
 			}
 
-			.has-items #router {
+			.has-items #view {
 				visibility: visible;
 			}
 
@@ -133,11 +148,6 @@ let UmbCollectionDefaultElement = class UmbCollectionDefaultElement extends UmbL
 				animation: fadeIn 200ms 200ms forwards;
 			}
 
-			router-slot {
-				width: 100%;
-				height: 100%;
-			}
-
 			@keyframes fadeIn {
 				100% {
 					opacity: 100%;
@@ -148,7 +158,7 @@ let UmbCollectionDefaultElement = class UmbCollectionDefaultElement extends UmbL
 };
 __decorate([
     state()
-], UmbCollectionDefaultElement.prototype, "_routes", void 0);
+], UmbCollectionDefaultElement.prototype, "_viewElement", void 0);
 __decorate([
     state()
 ], UmbCollectionDefaultElement.prototype, "_hasItems", void 0);

package/dist-cms/packages/core/collection/types.d.ts

@@ -21,6 +21,15 @@ export interface UmbCollectionConfiguration {
     orderDirection?: string;
     pageSize?: number;
     noItemsLabel?: string;
+    /**
+     * Suppresses the per-item action menu. Set it where an action on an item would not make sense in the surroundings,
+     * such as a picker, so that actions registered by anyone are suppressed rather than only the ones we know about.
+     */
+    hideItemActions?: boolean;
+    /**
+     * Suppresses the collection action bundle in the toolbar, on the same terms as `hideItemActions`.
+     */
+    hideCollectionActions?: boolean;
     userDefinedProperties?: Array<UmbCollectionColumnConfiguration>;
     selectionConfiguration?: UmbCollectionSelectionConfiguration;
     bulkActionConfiguration?: UmbCollectionBulkActionConfiguration;

package/dist-cms/packages/core/collection/view/card/card-collection-view.element.js

@@ -29,7 +29,7 @@ let UmbCardCollectionViewElement = class UmbCardCollectionViewElement extends Um
 			?selected=${this._isSelectedItem(item.unique)}
 			@selected=${() => this._selectItem(item.unique)}
 			@deselected=${() => this._deselectItem(item.unique)}>
-			<umb-entity-actions-bundle slot="actions"></umb-entity-actions-bundle>
+			${this._hideItemActions ? nothing : html `<umb-entity-actions-bundle slot="actions"></umb-entity-actions-bundle>`}
 		</umb-entity-collection-item-card>`;
     }
     static { this.styles = [

package/dist-cms/packages/core/collection/view/card/manifests.js

@@ -11,7 +11,7 @@ export const manifests = [
             element: UmbCardCollectionViewElement,
             weight: 800,
             meta: {
-                label: 'Cards',
+                label: '#collection_cardViewLabel',
                 icon: 'icon-grid',
                 pathName: 'cards',
             },

package/dist-cms/packages/core/collection/view/collection-view.extension.d.ts

@@ -5,7 +5,9 @@ export interface ManifestCollectionView extends ManifestElement, ManifestWithDyn
 }
 export interface MetaCollectionView {
     /**
-     * The friendly name of the collection view
+     * The friendly name of the collection view.
+     * Core collection views use localization keys prefixed with `#` (e.g. `"#collection_tableViewLabel"`).
+     * @example ["#collection_tableViewLabel", "Table"]
      */
     label: string;
     /**
@@ -15,6 +17,8 @@ export interface MetaCollectionView {
     icon: string;
     /**
      * The URL pathname for this collection view that can be deep linked to by sharing the url
+     * @deprecated Deprecated since v18. Collection views are no longer routed, so this pathname is unused. Scheduled
+     * for removal in Umbraco 20.
      */
     pathName: string;
 }

package/dist-cms/packages/core/collection/view/collection-view.manager.d.ts

@@ -22,8 +22,20 @@ export declare class UmbCollectionViewManager extends UmbControllerBase {
     #private;
     readonly views: import("rxjs").Observable<ManifestCollectionView[]>;
     readonly currentView: import("rxjs").Observable<ManifestCollectionView | undefined>;
-    readonly routes: import("rxjs").Observable<UmbRoute[]>;
-    readonly rootPathName: import("rxjs").Observable<string>;
+    /**
+     * A route per view.
+     * @returns {Observable<Array<UmbRoute>>} An always empty observable.
+     * @deprecated Deprecated since v18. The views of a collection are no longer routed, so this observable is always
+     * empty. Observe `currentView` and switch view with `setCurrentView` instead. Scheduled for removal in Umbraco 20.
+     */
+    get routes(): import("rxjs").Observable<UmbRoute[]>;
+    /**
+     * The path the view routes were resolved against.
+     * @returns {Observable<string>} An always empty observable.
+     * @deprecated Deprecated since v18. The views of a collection are no longer routed, so this observable is always
+     * empty. Scheduled for removal in Umbraco 20.
+     */
+    get rootPathName(): import("rxjs").Observable<string>;
     /**
      * @param {UmbControllerHost} host - The controller host this manager is bound to.
      * @param {UmbCollectionViewManagerArgs} [args] - Optional construction arguments.

package/dist-cms/packages/core/collection/view/collection-view.manager.js

@@ -1,7 +1,8 @@
 import { UmbControllerBase } from '../../../../libs/class-api/index.js';
-import { UmbExtensionsManifestInitializer, createExtensionElement } from '../../../../libs/extension-api/index.js';
+import { UmbExtensionsManifestInitializer } from '../../../../libs/extension-api/index.js';
 import { umbExtensionsRegistry } from '../../extension-registry/index.js';
 import { UmbArrayState, UmbObjectState, UmbStringState } from '../../../../libs/observable-api/index.js';
+import { UmbDeprecation } from '../../utils/index.js';
 const CURRENT_VIEW_MEMORY_UNIQUE = 'UmbCollectionCurrentView';
 export class UmbCollectionViewManager extends UmbControllerBase {
     #views;
@@ -11,8 +12,34 @@ export class UmbCollectionViewManager extends UmbControllerBase {
     #defaultViewAlias;
     #viewsOverride;
     #interactionMemoryManager;
-    #muteMemoryObservation;
-    #fallbackViewAlias;
+    /**
+     * A route per view.
+     * @returns {Observable<Array<UmbRoute>>} An always empty observable.
+     * @deprecated Deprecated since v18. The views of a collection are no longer routed, so this observable is always
+     * empty. Observe `currentView` and switch view with `setCurrentView` instead. Scheduled for removal in Umbraco 20.
+     */
+    get routes() {
+        new UmbDeprecation({
+            removeInVersion: '20.0.0',
+            deprecated: 'UmbCollectionViewManager.routes',
+            solution: 'The views of a collection are no longer routed. Observe `currentView` instead.',
+        }).warn();
+        return this.#routes.asObservable();
+    }
+    /**
+     * The path the view routes were resolved against.
+     * @returns {Observable<string>} An always empty observable.
+     * @deprecated Deprecated since v18. The views of a collection are no longer routed, so this observable is always
+     * empty. Scheduled for removal in Umbraco 20.
+     */
+    get rootPathName() {
+        new UmbDeprecation({
+            removeInVersion: '20.0.0',
+            deprecated: 'UmbCollectionViewManager.rootPathName',
+            solution: 'The views of a collection are no longer routed, so there is no root path to resolve them against.',
+        }).warn();
+        return this.#rootPathName.asObservable();
+    }
     /**
      * @param {UmbControllerHost} host - The controller host this manager is bound to.
      * @param {UmbCollectionViewManagerArgs} [args] - Optional construction arguments.
@@ -24,19 +51,11 @@ export class UmbCollectionViewManager extends UmbControllerBase {
         this.#currentView = new UmbObjectState(undefined);
         this.currentView = this.#currentView.asObservable();
         this.#routes = new UmbArrayState([], (x) => x.path);
-        this.routes = this.#routes.asObservable();
         this.#rootPathName = new UmbStringState('');
-        this.rootPathName = this.#rootPathName.asObservable();
-        this.#muteMemoryObservation = false;
         this.#interactionMemoryManager = args?.interactionMemoryManager;
         if (this.#interactionMemoryManager) {
             this.#observeInteractionMemory();
         }
-        // TODO: hack - we need to figure out how to get the "parent path" from the router
-        setTimeout(() => {
-            const currentUrl = new URL(window.location.href);
-            this.#rootPathName.setValue(currentUrl.pathname.substring(0, currentUrl.pathname.lastIndexOf('/')));
-        }, 100);
     }
     setConfig(config) {
         this.#defaultViewAlias = config.defaultViewAlias;
@@ -71,47 +90,29 @@ export class UmbCollectionViewManager extends UmbControllerBase {
                     .filter((m) => m !== undefined);
             }
             this.#views.setValue(manifests);
-            this.#createRoutes(manifests);
+            this.#setLandingView(manifests);
         });
     }
-    #setupViewComponent(component, view) {
-        component.setAttribute('data-mark', `collection-view:${view.alias}`);
-        component.manifest = view;
-        this.setCurrentView(view);
-    }
-    #createRoutes(views) {
-        let routes = [];
-        if (views && views.length > 0) {
-            // find the default view from the config. If it doesn't exist, use the first view
-            const firstOverrideView = this.#viewsOverride?.length
-                ? views.find((view) => view.alias === this.#viewsOverride[0].collectionView)
-                : null;
-            const defaultView = firstOverrideView ?? views.find((view) => view.alias === this.#defaultViewAlias);
-            // The remembered view wins over the configured default, as it is the view the user left the collection in.
-            const rememberedView = views.find((view) => view.alias === this.#getMemorizedViewAlias());
-            const fallbackView = rememberedView ?? defaultView ?? views[0];
-            this.#fallbackViewAlias = fallbackView.alias;
-            routes = views.map((view) => {
-                return {
-                    path: `${view.meta.pathName}`,
-                    component: () => createExtensionElement(view),
-                    setup: (component) => this.#setupViewComponent(component, view),
-                };
-            });
-            if (routes.length > 0) {
-                routes.push({
-                    unique: fallbackView.alias,
-                    path: '',
-                    component: () => createExtensionElement(fallbackView),
-                    setup: (component) => this.#setupViewComponent(component, fallbackView),
-                });
-                routes.push({
-                    path: `**`,
-                    component: async () => (await import('../../router/index.js')).UmbRouteNotFoundElement,
-                });
-            }
-        }
-        this.#routes.setValue(routes);
+    /**
+     * Lands on the view the user left the collection in, falling back to the configured default and then the first
+     * available view. The view currently shown is kept when it is still available, so views appearing or disappearing
+     * does not move the user.
+     * @param {Array<ManifestCollectionView>} views - The available views.
+     */
+    #setLandingView(views) {
+        if (!views.length)
+            return;
+        const currentViewAlias = this.getCurrentView()?.alias;
+        if (currentViewAlias && views.some((view) => view.alias === currentViewAlias))
+            return;
+        // find the default view from the config. If it doesn't exist, use the first view
+        const firstOverrideView = this.#viewsOverride?.length
+            ? views.find((view) => view.alias === this.#viewsOverride[0].collectionView)
+            : undefined;
+        const defaultView = firstOverrideView ?? views.find((view) => view.alias === this.#defaultViewAlias);
+        // The remembered view wins over the configured default, as it is the view the user left the collection in.
+        const rememberedView = views.find((view) => view.alias === this.#getMemorizedViewAlias());
+        this.setCurrentView(rememberedView ?? defaultView ?? views[0]);
     }
     #getMemorizedViewAlias() {
         return this.#interactionMemoryManager?.getMemory(CURRENT_VIEW_MEMORY_UNIQUE)?.value?.alias;
@@ -123,23 +124,17 @@ export class UmbCollectionViewManager extends UmbControllerBase {
             unique: CURRENT_VIEW_MEMORY_UNIQUE,
             value: { alias: view.alias },
         };
-        this.#muteMemoryObservation = true;
         this.#interactionMemoryManager.setMemory(memory);
-        this.#muteMemoryObservation = false;
     }
     #observeInteractionMemory() {
         this.observe(this.#interactionMemoryManager.memory(CURRENT_VIEW_MEMORY_UNIQUE), (memory) => {
-            if (this.#muteMemoryObservation)
-                return;
             if (!memory)
                 return;
-            const views = this.#views.getValue();
-            if (!views.length)
-                return; // extensions not loaded yet; the initializer callback will handle it
-            if (memory.value?.alias === this.#fallbackViewAlias)
+            const view = this.#views.getValue().find((x) => x.alias === memory.value?.alias);
+            // The views have not loaded yet; the extensions initializer lands on the remembered view itself.
+            if (!view)
                 return;
-            // Rebuild the routes so the collection lands on the remembered view when no view is requested by the URL.
-            this.#createRoutes(views);
+            this.#currentView.setValue(view);
         }, 'umbCollectionViewMemoryObserver');
     }
 }

package/dist-cms/packages/core/collection/view/ref/manifests.js

@@ -11,7 +11,7 @@ export const manifests = [
             element: UmbRefCollectionViewElement,
             weight: 800,
             meta: {
-                label: 'List',
+                label: '#collection_listViewLabel',
                 icon: 'icon-list',
                 pathName: 'refs',
             },

package/dist-cms/packages/core/collection/view/ref/ref-collection-view.element.js

@@ -27,7 +27,7 @@ let UmbRefCollectionViewElement = class UmbRefCollectionViewElement extends UmbC
 			?selected=${this._isSelectedItem(item.unique)}
 			@selected=${() => this._selectItem(item.unique)}
 			@deselected=${() => this._deselectItem(item.unique)}>
-			<umb-entity-actions-bundle slot="actions"></umb-entity-actions-bundle>
+			${this._hideItemActions ? nothing : html `<umb-entity-actions-bundle slot="actions"></umb-entity-actions-bundle>`}
 		</umb-entity-collection-item-ref>`;
     }
     static { this.styles = [

package/dist-cms/packages/core/collection/view/table/manifests.js

@@ -11,7 +11,7 @@ export const manifests = [
             element: UmbTableCollectionViewElement,
             weight: 1000,
             meta: {
-                label: 'Table',
+                label: '#collection_tableViewLabel',
                 icon: 'icon-table',
                 pathName: 'table',
             },

package/dist-cms/packages/core/collection/view/table/table-collection-view.element.js

@@ -77,7 +77,7 @@ let UmbTableCollectionViewElement = class UmbTableCollectionViewElement extends
             nameColumn,
             ...(this.#hasDescriptions ? [descriptionColumn] : []),
             ...manifestColumns,
-            entityActionsColumn,
+            ...(this._hideItemActions ? [] : [entityActionsColumn]),
         ];
     }
     willUpdate(changedProperties) {
@@ -91,7 +91,10 @@ let UmbTableCollectionViewElement = class UmbTableCollectionViewElement extends
                 selectOnly: this._selectOnly,
             };
         }
-        if (changedProperties.has('_items') || changedProperties.has('_itemHrefs') || changedProperties.has('manifest')) {
+        if (changedProperties.has('_items') ||
+            changedProperties.has('_itemHrefs') ||
+            changedProperties.has('manifest') ||
+            changedProperties.has('_hideItemActions')) {
             this.#createTableRows();
         }
     }

package/dist-cms/packages/core/collection/view/umb-collection-view-element-base.d.ts

@@ -13,6 +13,7 @@ export declare abstract class UmbCollectionViewElementBase<CollectionItemType ex
     protected _selectOnly: boolean;
     protected _selection: Array<string | null>;
     protected _loading: boolean;
+    protected _hideItemActions: boolean;
     protected _itemHrefs: Map<string, string>;
     constructor();
     /**

package/dist-cms/packages/core/collection/view/umb-collection-view-element-base.js

@@ -21,6 +21,7 @@ export class UmbCollectionViewElementBase extends UmbLitElement {
         this._selectOnly = false;
         this._selection = [];
         this._loading = false;
+        this._hideItemActions = false;
         this._itemHrefs = new Map();
         this.consumeContext(UMB_COLLECTION_CONTEXT, (instance) => {
             this.#collectionContext = instance;
@@ -30,6 +31,7 @@ export class UmbCollectionViewElementBase extends UmbLitElement {
             }, 'umbCollectionSelectOnlyObserver');
             this.observe(this.#collectionContext?.selection.selection, (selection) => (this._selection = selection ?? []), 'umbCollectionSelectionObserver');
             this.observe(this.#collectionContext?.selection.multiple, (multiple) => (this._multiple = multiple ?? false), 'umbCollectionSelectionMultipleObserver');
+            this.observe(this.#collectionContext?.hideItemActions, (hideItemActions) => (this._hideItemActions = hideItemActions ?? false), 'umbCollectionHideItemActionsObserver');
             this.observe(this.#collectionContext?.items, async (items) => {
                 this._items = items ?? [];
                 await this.#updateItemHrefs();
@@ -108,6 +110,9 @@ __decorate([
 __decorate([
     state()
 ], UmbCollectionViewElementBase.prototype, "_loading", void 0);
+__decorate([
+    state()
+], UmbCollectionViewElementBase.prototype, "_hideItemActions", void 0);
 __decorate([
     state()
 ], UmbCollectionViewElementBase.prototype, "_itemHrefs", void 0);

package/dist-cms/packages/core/components/badge/badge.element.js

@@ -38,6 +38,7 @@ let UmbBadgeElement = class UmbBadgeElement extends LitElement {
 				:host(:not([inline-mode])) uui-badge {
 					position: fixed;
 					position-anchor: --umb-badge-anchor;
+					position-visibility: always;
 					z-index: 1;
 					top: anchor(top);
 					right: anchor(right);

package/dist-cms/packages/core/components/body-layout/body-layout.element.js

@@ -157,6 +157,7 @@ let UmbBodyLayoutElement = class UmbBodyLayoutElement extends LitElement {
 			#header-slot {
 				padding: 0 var(--uui-size-layout-1);
 				flex-grow: 1;
+				flex-basis: 0;
 			}
 			:host([header-no-padding]) #header-slot {
 				padding: 0;

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

@@ -29,6 +29,7 @@ export * from './multiple-text-string-input/index.js';
 export * from './popover-layout/index.js';
 export * from './ref-item/index.js';
 export * from './scrollable-container/index.js';
+export * from './separator/index.js';
 export * from './split-panel/index.js';
 export * from './stack/index.js';
 export * from './table/index.js';

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

@@ -31,6 +31,7 @@ export * from './multiple-text-string-input/index.js';
 export * from './popover-layout/index.js';
 export * from './ref-item/index.js';
 export * from './scrollable-container/index.js';
+export * from './separator/index.js';
 export * from './split-panel/index.js';
 export * from './stack/index.js';
 export * from './table/index.js';

package/dist-cms/packages/core/components/separator/index.d.ts

@@ -0,0 +1,2 @@
+import './separator.element.js';
+export * from './separator.element.js';

package/dist-cms/packages/core/components/separator/index.js

@@ -0,0 +1,2 @@
+import './separator.element.js';
+export * from './separator.element.js';