@umbraco-cms/backoffice 17.0.2 → 17.1.0

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

@@ -0,0 +1,76 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { getItemFallbackName, getItemFallbackIcon } from '../../../entity-item/index.js';
+import { UmbDeselectedEvent, UmbSelectedEvent } from '../../../event/index.js';
+import { customElement, html, ifDefined, nothing, property } from '../../../../../external/lit/index.js';
+import { UmbLitElement } from '../../../lit-element/index.js';
+let UmbDefaultCollectionItemCardElement = class UmbDefaultCollectionItemCardElement extends UmbLitElement {
+    constructor() {
+        super(...arguments);
+        this.selectable = false;
+        this.selected = false;
+        this.selectOnly = false;
+        this.disabled = false;
+    }
+    #onSelected(event) {
+        if (!this.item)
+            return;
+        event.stopPropagation();
+        this.dispatchEvent(new UmbSelectedEvent(this.item.unique));
+    }
+    #onDeselected(event) {
+        if (!this.item)
+            return;
+        event.stopPropagation();
+        this.dispatchEvent(new UmbDeselectedEvent(this.item.unique));
+    }
+    render() {
+        if (!this.item)
+            return nothing;
+        return html `
+			<uui-card-content-node
+				name=${this.item.name ?? `${getItemFallbackName(this.item)}`}
+				href=${ifDefined(this.href)}
+				?selectable=${this.selectable}
+				?select-only=${this.selectOnly}
+				?selected=${this.selected}
+				?disabled=${this.disabled}
+				@selected=${this.#onSelected}
+				@deselected=${this.#onDeselected}
+				?readonly=${!this.href}>
+				<slot name="actions" slot="actions"></slot>
+				${this.#renderIcon(this.item)}
+			</uui-card-content-node>
+		`;
+    }
+    #renderIcon(item) {
+        const icon = item.icon || getItemFallbackIcon();
+        return html `<umb-icon slot="icon" name=${icon}></umb-icon>`;
+    }
+};
+__decorate([
+    property({ type: Object })
+], UmbDefaultCollectionItemCardElement.prototype, "item", void 0);
+__decorate([
+    property({ type: Boolean })
+], UmbDefaultCollectionItemCardElement.prototype, "selectable", void 0);
+__decorate([
+    property({ type: Boolean })
+], UmbDefaultCollectionItemCardElement.prototype, "selected", void 0);
+__decorate([
+    property({ type: Boolean })
+], UmbDefaultCollectionItemCardElement.prototype, "selectOnly", void 0);
+__decorate([
+    property({ type: Boolean })
+], UmbDefaultCollectionItemCardElement.prototype, "disabled", void 0);
+__decorate([
+    property({ type: String })
+], UmbDefaultCollectionItemCardElement.prototype, "href", void 0);
+UmbDefaultCollectionItemCardElement = __decorate([
+    customElement('umb-default-collection-item-card')
+], UmbDefaultCollectionItemCardElement);
+export { UmbDefaultCollectionItemCardElement };

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

@@ -0,0 +1,14 @@
+import { UmbEntityCollectionItemElementBase } from '../umb-entity-collection-item-element-base.element.js';
+export declare class UmbEntityCollectionItemCardElement extends UmbEntityCollectionItemElementBase {
+    protected getExtensionType(): string;
+    protected createFallbackElement(): HTMLElement;
+    protected getPathAddendum(entityType: string, unique: string): string;
+    protected getMarkAttributeName(): string;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'umb-entity-collection-item-card': UmbEntityCollectionItemCardElement;
+    }
+}

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

@@ -0,0 +1,38 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { UmbEntityCollectionItemElementBase } from '../umb-entity-collection-item-element-base.element.js';
+import { UmbDefaultCollectionItemCardElement } from './default-collection-item-card.element.js';
+import { css, customElement, html } from '../../../../../external/lit/index.js';
+let UmbEntityCollectionItemCardElement = class UmbEntityCollectionItemCardElement extends UmbEntityCollectionItemElementBase {
+    getExtensionType() {
+        return 'entityCollectionItemCard';
+    }
+    createFallbackElement() {
+        return new UmbDefaultCollectionItemCardElement();
+    }
+    getPathAddendum(entityType, unique) {
+        return 'collection-item-card/' + entityType + '/' + unique;
+    }
+    getMarkAttributeName() {
+        return 'entity-collection-item-card';
+    }
+    render() {
+        return html `${this._component}`;
+    }
+    static { this.styles = [
+        css `
+			:host {
+				display: block;
+				position: relative;
+			}
+		`,
+    ]; }
+};
+UmbEntityCollectionItemCardElement = __decorate([
+    customElement('umb-entity-collection-item-card')
+], UmbEntityCollectionItemCardElement);
+export { UmbEntityCollectionItemCardElement };

package/dist-cms/packages/core/collection/item/entity-collection-item-card/entity-collection-item-card.extension.d.ts

@@ -0,0 +1,11 @@
+import type { ManifestEntityCollectionItemBase } from '../entity-collection-item.extension.js';
+export interface ManifestEntityCollectionItemCard<MetaType extends MetaEntityCollectionItemCard = MetaEntityCollectionItemCard> extends ManifestEntityCollectionItemBase<MetaType> {
+    type: 'entityCollectionItemCard';
+}
+export interface MetaEntityCollectionItemCard {
+}
+declare global {
+    interface UmbExtensionManifestMap {
+        umbManifestEntityCollectionItemCard: ManifestEntityCollectionItemCard;
+    }
+}

package/dist-cms/packages/core/collection/item/entity-collection-item-card/entity-collection-item-card.extension.js

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

package/dist-cms/packages/core/collection/item/entity-collection-item-card/global-components.d.ts

@@ -0,0 +1 @@
+import './entity-collection-item-card.element.js';

package/dist-cms/packages/core/collection/item/entity-collection-item-card/global-components.js

@@ -0,0 +1 @@
+import './entity-collection-item-card.element.js';

package/dist-cms/packages/core/collection/item/entity-collection-item-card/index.d.ts

@@ -0,0 +1 @@
+export * from './entity-collection-item-card.element.js';

package/dist-cms/packages/core/collection/item/entity-collection-item-card/index.js

@@ -0,0 +1 @@
+export * from './entity-collection-item-card.element.js';

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

@@ -0,0 +1 @@
+export type * from './entity-collection-item-card.extension.js';

package/dist-cms/packages/core/collection/item/entity-collection-item-card/types.js

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

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

@@ -0,0 +1,18 @@
+import type { UmbCollectionItemModel } from './types.js';
+/**
+ * An interface for elements that render collection items representing entities.
+ */
+export interface UmbEntityCollectionItemElement extends HTMLElement {
+    /** The collection item model to render. */
+    item?: UmbCollectionItemModel | undefined;
+    /** Whether the item should render with selection affordances. */
+    selectable?: boolean;
+    /** When true, the item only supports selection (no navigation). */
+    selectOnly?: boolean;
+    /** Whether the item is currently selected. */
+    selected?: boolean;
+    /** Whether the item is disabled. */
+    disabled?: boolean;
+    /** Optional href used by card/ref renderers to provide a link. */
+    href?: string | undefined;
+}

package/dist-cms/packages/core/collection/item/entity-collection-item-element.interface.js

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

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

@@ -0,0 +1,19 @@
+import type { UmbCollectionItemModel } from '../types.js';
+import type { UmbEntityCollectionItemElement } from '../entity-collection-item-element.interface.js';
+import { nothing } from '../../../../../external/lit/index.js';
+import { UmbLitElement } from '../../../lit-element/index.js';
+export declare class UmbDefaultCollectionItemRefElement extends UmbLitElement implements UmbEntityCollectionItemElement {
+    #private;
+    item?: UmbCollectionItemModel;
+    selectable: boolean;
+    selected: boolean;
+    selectOnly: boolean;
+    disabled: boolean;
+    href?: string;
+    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'umb-default-collection-item-ref': UmbDefaultCollectionItemRefElement;
+    }
+}

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

@@ -0,0 +1,74 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { getItemFallbackName, getItemFallbackIcon } from '../../../entity-item/index.js';
+import { UmbDeselectedEvent, UmbSelectedEvent } from '../../../event/index.js';
+import { customElement, html, ifDefined, nothing, property } from '../../../../../external/lit/index.js';
+import { UmbLitElement } from '../../../lit-element/index.js';
+let UmbDefaultCollectionItemRefElement = class UmbDefaultCollectionItemRefElement extends UmbLitElement {
+    constructor() {
+        super(...arguments);
+        this.selectable = false;
+        this.selected = false;
+        this.selectOnly = false;
+        this.disabled = false;
+    }
+    #onSelected(event) {
+        if (!this.item)
+            return;
+        event.stopPropagation();
+        this.dispatchEvent(new UmbSelectedEvent(this.item.unique));
+    }
+    #onDeselected(event) {
+        if (!this.item)
+            return;
+        event.stopPropagation();
+        this.dispatchEvent(new UmbDeselectedEvent(this.item.unique));
+    }
+    render() {
+        if (!this.item)
+            return nothing;
+        return html `<uui-ref-node
+			name=${this.item.name ?? `${getItemFallbackName(this.item)}`}
+			@selected=${this.#onSelected}
+			@deselected=${this.#onDeselected}
+			?selectable=${this.selectable}
+			?select-only=${this.selectOnly}
+			?selected=${this.selected}
+			?disabled=${this.disabled}
+			href=${ifDefined(this.href)}
+			?readonly=${!this.href}>
+			<slot name="actions" slot="actions"></slot>
+			${this.#renderIcon(this.item)}
+		</uui-ref-node>`;
+    }
+    #renderIcon(item) {
+        const icon = item.icon || getItemFallbackIcon();
+        return html `<umb-icon slot="icon" name=${icon}></umb-icon>`;
+    }
+};
+__decorate([
+    property({ type: Object })
+], UmbDefaultCollectionItemRefElement.prototype, "item", void 0);
+__decorate([
+    property({ type: Boolean })
+], UmbDefaultCollectionItemRefElement.prototype, "selectable", void 0);
+__decorate([
+    property({ type: Boolean })
+], UmbDefaultCollectionItemRefElement.prototype, "selected", void 0);
+__decorate([
+    property({ type: Boolean })
+], UmbDefaultCollectionItemRefElement.prototype, "selectOnly", void 0);
+__decorate([
+    property({ type: Boolean })
+], UmbDefaultCollectionItemRefElement.prototype, "disabled", void 0);
+__decorate([
+    property({ type: String })
+], UmbDefaultCollectionItemRefElement.prototype, "href", void 0);
+UmbDefaultCollectionItemRefElement = __decorate([
+    customElement('umb-default-collection-item-ref')
+], UmbDefaultCollectionItemRefElement);
+export { UmbDefaultCollectionItemRefElement };

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

@@ -0,0 +1,14 @@
+import { UmbEntityCollectionItemElementBase } from '../umb-entity-collection-item-element-base.element.js';
+export declare class UmbEntityCollectionItemRefElement extends UmbEntityCollectionItemElementBase {
+    protected getExtensionType(): string;
+    protected createFallbackElement(): HTMLElement;
+    protected getPathAddendum(entityType: string, unique: string): string;
+    protected getMarkAttributeName(): string;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'umb-entity-collection-item-ref': UmbEntityCollectionItemRefElement;
+    }
+}

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

@@ -0,0 +1,38 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { UmbEntityCollectionItemElementBase } from '../umb-entity-collection-item-element-base.element.js';
+import { UmbDefaultCollectionItemRefElement } from './default-collection-item-ref.element.js';
+import { css, customElement, html } from '../../../../../external/lit/index.js';
+let UmbEntityCollectionItemRefElement = class UmbEntityCollectionItemRefElement extends UmbEntityCollectionItemElementBase {
+    getExtensionType() {
+        return 'entityCollectionItemRef';
+    }
+    createFallbackElement() {
+        return new UmbDefaultCollectionItemRefElement();
+    }
+    getPathAddendum(entityType, unique) {
+        return 'collection-item-ref/' + entityType + '/' + unique;
+    }
+    getMarkAttributeName() {
+        return 'entity-collection-item-ref';
+    }
+    render() {
+        return html `${this._component}`;
+    }
+    static { this.styles = [
+        css `
+			:host {
+				display: block;
+				position: relative;
+			}
+		`,
+    ]; }
+};
+UmbEntityCollectionItemRefElement = __decorate([
+    customElement('umb-entity-collection-item-ref')
+], UmbEntityCollectionItemRefElement);
+export { UmbEntityCollectionItemRefElement };

package/dist-cms/packages/core/collection/item/entity-collection-item-ref/entity-collection-item-ref.extension.d.ts

@@ -0,0 +1,11 @@
+import type { ManifestEntityCollectionItemBase } from '../entity-collection-item.extension.js';
+export interface ManifestEntityCollectionItemRef<MetaType extends MetaEntityCollectionItemRef = MetaEntityCollectionItemRef> extends ManifestEntityCollectionItemBase<MetaType> {
+    type: 'entityCollectionItemRef';
+}
+export interface MetaEntityCollectionItemRef {
+}
+declare global {
+    interface UmbExtensionManifestMap {
+        umbManifestEntityCollectionItemRef: ManifestEntityCollectionItemRef;
+    }
+}

package/dist-cms/packages/core/collection/item/entity-collection-item-ref/entity-collection-item-ref.extension.js

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

package/dist-cms/packages/core/collection/item/entity-collection-item-ref/global-components.d.ts

@@ -0,0 +1 @@
+import './entity-collection-item-ref.element.js';

package/dist-cms/packages/core/collection/item/entity-collection-item-ref/global-components.js

@@ -0,0 +1 @@
+import './entity-collection-item-ref.element.js';

package/dist-cms/packages/core/collection/item/entity-collection-item-ref/index.d.ts

@@ -0,0 +1 @@
+export * from './entity-collection-item-ref.element.js';

package/dist-cms/packages/core/collection/item/entity-collection-item-ref/index.js

@@ -0,0 +1 @@
+export * from './entity-collection-item-ref.element.js';

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

@@ -0,0 +1 @@
+export type * from './entity-collection-item-ref.extension.js';

package/dist-cms/packages/core/collection/item/entity-collection-item-ref/types.js

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

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

@@ -0,0 +1,16 @@
+import type { UmbEntityCollectionItemElement } from './entity-collection-item-element.interface.js';
+import type { ManifestElement, ManifestWithDynamicConditions } from '../../../../libs/extension-api/index.js';
+/**
+ * Base interface for entity collection item manifests.
+ * Shared by card and ref variants.
+ */
+export interface ManifestEntityCollectionItemBase<MetaType = object> extends ManifestElement<UmbEntityCollectionItemElement>, ManifestWithDynamicConditions<UmbExtensionConditionConfig> {
+    /**
+     * The entity types this collection item supports.
+     */
+    forEntityTypes: Array<string>;
+    /**
+     * Additional metadata for the collection item.
+     */
+    meta?: MetaType;
+}

package/dist-cms/packages/core/collection/item/entity-collection-item.extension.js

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

package/dist-cms/packages/core/collection/item/global-components.d.ts

@@ -0,0 +1,2 @@
+import './entity-collection-item-card/global-components.js';
+import './entity-collection-item-ref/global-components.js';

package/dist-cms/packages/core/collection/item/global-components.js

@@ -0,0 +1,2 @@
+import './entity-collection-item-card/global-components.js';
+import './entity-collection-item-ref/global-components.js';

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

@@ -1,6 +1,14 @@
 import type { UmbEntityModel } from '../../entity/index.js';
+export type * from './entity-collection-item-card/types.js';
+export type * from './entity-collection-item-ref/types.js';
+export type * from './entity-collection-item-element.interface.js';
 export interface UmbCollectionItemModel extends UmbEntityModel {
     unique: string;
     name?: string;
     icon?: string;
 }
+export interface UmbCollectionItemDetailPropertyConfig {
+    alias: string;
+    name: string;
+    isSystem: boolean;
+}

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

@@ -0,0 +1,30 @@
+import type { UmbCollectionItemDetailPropertyConfig, UmbCollectionItemModel } from './types.js';
+import { UmbLitElement } from '../../lit-element/index.js';
+import type { PropertyValueMap } from '../../../../external/lit/index.js';
+export declare abstract class UmbEntityCollectionItemElementBase extends UmbLitElement {
+    #private;
+    protected _component?: any;
+    set item(value: UmbCollectionItemModel | undefined);
+    get item(): UmbCollectionItemModel | undefined;
+    get selectable(): boolean;
+    set selectable(value: boolean);
+    get selectOnly(): boolean;
+    set selectOnly(value: boolean);
+    get selected(): boolean;
+    set selected(value: boolean);
+    get disabled(): boolean;
+    set disabled(value: boolean);
+    get href(): string | undefined;
+    set href(value: string | undefined);
+    get detailProperties(): UmbCollectionItemDetailPropertyConfig[] | undefined;
+    set detailProperties(value: UmbCollectionItemDetailPropertyConfig[] | undefined);
+    protected firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
+    destroy(): void;
+    /**
+     * Abstract methods that subclasses must implement
+     */
+    protected abstract getExtensionType(): string;
+    protected abstract createFallbackElement(): HTMLElement;
+    protected abstract getPathAddendum(entityType: string, unique: string): string;
+    protected abstract getMarkAttributeName(): string;
+}

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

@@ -0,0 +1,173 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { property, state } from '../../../../external/lit/index.js';
+import { UmbLitElement } from '../../lit-element/index.js';
+import { UmbExtensionsElementInitializer } from '../../../../libs/extension-api/index.js';
+import { umbExtensionsRegistry } from '../../extension-registry/index.js';
+import { UmbDeselectedEvent, UmbSelectedEvent } from '../../event/index.js';
+import { UmbRoutePathAddendumContext } from '../../router/index.js';
+import { UMB_MARK_ATTRIBUTE_NAME } from '../../const/index.js';
+export class UmbEntityCollectionItemElementBase extends UmbLitElement {
+    #extensionsController;
+    #item;
+    set item(value) {
+        const oldValue = this.#item;
+        this.#item = value;
+        if (value === oldValue)
+            return;
+        if (!value)
+            return;
+        // If the component is already created and the entity type is the same, we can just update the item.
+        if (this._component && value.entityType === oldValue?.entityType) {
+            this._component.item = value;
+            return;
+        }
+        this.#pathAddendum.setAddendum(this.getPathAddendum(value.entityType, value.unique));
+        // If the component is already created, but the entity type is different, we need to destroy the component.
+        this.#createController(value.entityType);
+    }
+    get item() {
+        return this.#item;
+    }
+    #selectable = false;
+    get selectable() {
+        return this.#selectable;
+    }
+    set selectable(value) {
+        this.#selectable = value;
+        if (this._component) {
+            this._component.selectable = this.#selectable;
+        }
+    }
+    #selectOnly = false;
+    get selectOnly() {
+        return this.#selectOnly;
+    }
+    set selectOnly(value) {
+        this.#selectOnly = value;
+        if (this._component) {
+            this._component.selectOnly = this.#selectOnly;
+        }
+    }
+    #selected = false;
+    get selected() {
+        return this.#selected;
+    }
+    set selected(value) {
+        this.#selected = value;
+        if (this._component) {
+            this._component.selected = this.#selected;
+        }
+    }
+    #disabled = false;
+    get disabled() {
+        return this.#disabled;
+    }
+    set disabled(value) {
+        this.#disabled = value;
+        if (this._component) {
+            this._component.disabled = this.#disabled;
+        }
+    }
+    #href;
+    get href() {
+        return this.#href;
+    }
+    set href(value) {
+        this.#href = value;
+        if (this._component) {
+            this._component.href = this.#href;
+        }
+    }
+    #detailProperties;
+    get detailProperties() {
+        return this.#detailProperties;
+    }
+    set detailProperties(value) {
+        this.#detailProperties = value;
+        if (this._component) {
+            this._component.detailProperties = this.#detailProperties;
+        }
+    }
+    #pathAddendum = new UmbRoutePathAddendumContext(this);
+    #onSelected(event) {
+        event.stopPropagation();
+        const unique = this.item?.unique;
+        if (!unique)
+            throw new Error('No unique id found for item');
+        this.dispatchEvent(new UmbSelectedEvent(unique));
+    }
+    #onDeselected(event) {
+        event.stopPropagation();
+        const unique = this.item?.unique;
+        if (!unique)
+            throw new Error('No unique id found for item');
+        this.dispatchEvent(new UmbDeselectedEvent(unique));
+    }
+    firstUpdated(_changedProperties) {
+        super.firstUpdated(_changedProperties);
+        this.setAttribute(UMB_MARK_ATTRIBUTE_NAME, this.getMarkAttributeName());
+    }
+    #boundOnSelected = this.#onSelected.bind(this);
+    #boundOnDeselected = this.#onDeselected.bind(this);
+    #createController(entityType) {
+        if (this.#extensionsController) {
+            this.#extensionsController.destroy();
+        }
+        this.#extensionsController = new UmbExtensionsElementInitializer(this, umbExtensionsRegistry, this.getExtensionType(), (manifest) => manifest.forEntityTypes.includes(entityType), (extensionControllers) => {
+            this._component?.remove();
+            const component = extensionControllers[0]?.component || this.createFallbackElement();
+            // TODO: I would say this code can use feature of the UmbExtensionsElementInitializer, to set properties and get a fallback element. [NL]
+            // assign the properties to the component
+            component.item = this.item;
+            component.selectable = this.selectable;
+            component.selectOnly = this.selectOnly;
+            component.selected = this.selected;
+            component.disabled = this.disabled;
+            component.href = this.href;
+            component.detailProperties = this.detailProperties;
+            component.addEventListener(UmbSelectedEvent.TYPE, this.#boundOnSelected);
+            component.addEventListener(UmbDeselectedEvent.TYPE, this.#boundOnDeselected);
+            // Proxy the actions slot to the component
+            const slotElement = document.createElement('slot');
+            slotElement.name = 'actions';
+            slotElement.setAttribute('slot', 'actions');
+            component.appendChild(slotElement);
+            this._component = component;
+        }, undefined, // We can leave the alias to undefined, as we destroy this ourselves.
+        undefined, { single: true });
+    }
+    destroy() {
+        this._component?.removeEventListener(UmbSelectedEvent.TYPE, this.#boundOnSelected);
+        this._component?.removeEventListener(UmbDeselectedEvent.TYPE, this.#boundOnDeselected);
+        super.destroy();
+    }
+}
+__decorate([
+    state()
+], UmbEntityCollectionItemElementBase.prototype, "_component", void 0);
+__decorate([
+    property({ type: Object, attribute: false })
+], UmbEntityCollectionItemElementBase.prototype, "item", null);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], UmbEntityCollectionItemElementBase.prototype, "selectable", null);
+__decorate([
+    property({ type: Boolean, attribute: 'select-only', reflect: true })
+], UmbEntityCollectionItemElementBase.prototype, "selectOnly", null);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], UmbEntityCollectionItemElementBase.prototype, "selected", null);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], UmbEntityCollectionItemElementBase.prototype, "disabled", null);
+__decorate([
+    property({ type: String, reflect: true })
+], UmbEntityCollectionItemElementBase.prototype, "href", null);
+__decorate([
+    property({ type: Array, attribute: false })
+], UmbEntityCollectionItemElementBase.prototype, "detailProperties", null);

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

@@ -2,11 +2,13 @@ import { manifests as actionManifests } from './action/manifests.js';
 import { manifests as conditionManifests } from './conditions/manifests.js';
 import { manifests as menuManifests } from './menu/manifests.js';
 import { manifests as pickerModalManifests } from './collection-item-picker-modal/manifests.js';
+import { manifests as viewManifests } from './view/manifests.js';
 import { manifests as workspaceViewManifests } from './workspace-view/manifests.js';
 export const manifests = [
     ...actionManifests,
     ...conditionManifests,
     ...menuManifests,
     ...pickerModalManifests,
+    ...viewManifests,
     ...workspaceViewManifests,
 ];