@umbraco-cms/backoffice 18.3.0-rc2 → 19.0.0-beta1

package/dist-cms/packages/relations/relations/global-components/entity-references-summary.element.js

@@ -0,0 +1,195 @@
+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 { UMB_ENTITY_REFERENCES_MODAL } from '../reference/modal/constants.js';
+import { css, customElement, html, nothing, property, state, when } from '../../../../external/lit/index.js';
+import { createExtensionApiByAlias } from '../../../core/extension-registry/index.js';
+import { umbOpenModal } from '../../../core/modal/index.js';
+import { UmbChangeEvent } from '../../../core/event/index.js';
+import { UmbLitElement } from '../../../core/lit-element/index.js';
+/**
+ * Renders one action button per kind of reference to the entity in `config`: one for the items referencing it,
+ * another for its descendants that are referenced elsewhere, and, when `entitiesNeedingAttention` is set,
+ * a third for the entities it directly references that need attention. Each button opens a paged overview of only
+ * that kind of reference. Renders nothing when there is nothing to report. Dispatches a `UmbChangeEvent` once both
+ * totals have loaded (reporting no references if the lookup fails), reloads when `config` changes, and exposes
+ * `getTotalReferencedBy()` / `getTotalDescendantsWithReferences()`, so a host can gate an action on the result — for
+ * example, a publish or unpublish confirmation dialog.
+ * @element umb-entity-references-summary
+ */
+let UmbEntityReferencesSummaryElement = class UmbEntityReferencesSummaryElement extends UmbLitElement {
+    constructor() {
+        super(...arguments);
+        this._totalReferencedByItems = 0;
+        this._totalDescendantsWithReferences = 0;
+        this.#loadToken = 0;
+    }
+    #referenceRepository;
+    #referenceRepositoryAlias;
+    #loadToken;
+    /**
+     * The number of items referencing the entity in `config`. `0` until the count has loaded.
+     * @returns {number} The referenced-by count.
+     */
+    getTotalReferencedBy() {
+        return this._totalReferencedByItems;
+    }
+    /**
+     * The number of descendants of the entity in `config` that are referenced elsewhere. `0` until the count
+     * has loaded, or if the reference repository does not support this lookup.
+     * @returns {number} The referenced-descendants count.
+     */
+    getTotalDescendantsWithReferences() {
+        return this._totalDescendantsWithReferences;
+    }
+    /**
+     * The number of entities this entity directly references that need attention before publishing, or `0` when
+     * {@link entitiesNeedingAttention} is not set.
+     * @returns {number} The entities-needing-attention count.
+     */
+    getTotalEntitiesNeedingAttention() {
+        return this.entitiesNeedingAttention?.length ?? 0;
+    }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        if (changedProperties.has('config')) {
+            this.#initData();
+        }
+    }
+    async #initData() {
+        const token = ++this.#loadToken;
+        const config = this.config;
+        let totals = { referencedBy: 0, descendants: 0 };
+        if (config) {
+            try {
+                totals = await this.#loadTotals(config);
+            }
+            catch (error) {
+                // Fail open: a host gating an action on these totals should proceed, not wait forever for a change event.
+                console.error('Failed to load entity references:', error);
+            }
+        }
+        // A newer config has since been set — its result should win, not ours.
+        if (token !== this.#loadToken)
+            return;
+        this._totalReferencedByItems = totals.referencedBy;
+        this._totalDescendantsWithReferences = totals.descendants;
+        if (config) {
+            this.dispatchEvent(new UmbChangeEvent());
+        }
+    }
+    async #loadTotals(config) {
+        const repository = await this.#getReferenceRepository(config.referenceRepositoryAlias);
+        // take: 1 — only the totals are needed here, the overview modal fetches the actual items.
+        const [referencedBy, descendants] = await Promise.all([
+            repository.requestReferencedBy(config.unique, 0, 1),
+            // If the repository does not have the method, there are no referenced descendants to load.
+            repository.requestDescendantsWithReferences?.(config.unique, 0, 1),
+        ]);
+        return { referencedBy: referencedBy.data?.total ?? 0, descendants: descendants?.data?.total ?? 0 };
+    }
+    async #getReferenceRepository(alias) {
+        if (this.#referenceRepository && this.#referenceRepositoryAlias === alias)
+            return this.#referenceRepository;
+        this.#referenceRepository?.destroy();
+        this.#referenceRepository = await createExtensionApiByAlias(this, alias);
+        this.#referenceRepositoryAlias = alias;
+        return this.#referenceRepository;
+    }
+    #onClickView(source, event) {
+        event.preventDefault();
+        if (!this.config)
+            return;
+        umbOpenModal(this, UMB_ENTITY_REFERENCES_MODAL, {
+            data: {
+                unique: this.config.unique,
+                referenceRepositoryAlias: this.config.referenceRepositoryAlias,
+                itemRepositoryAlias: this.config.itemRepositoryAlias,
+                source,
+            },
+        }).catch(() => undefined);
+    }
+    #onClickViewEntitiesNeedingAttention(event) {
+        event.preventDefault();
+        if (!this.config)
+            return;
+        umbOpenModal(this, UMB_ENTITY_REFERENCES_MODAL, {
+            data: {
+                unique: this.config.unique,
+                referenceRepositoryAlias: this.config.referenceRepositoryAlias,
+                itemRepositoryAlias: this.config.itemRepositoryAlias,
+                source: 'needingAttention',
+                entitiesNeedingAttention: this.entitiesNeedingAttention,
+            },
+        }).catch(() => undefined);
+    }
+    render() {
+        const total = this._totalReferencedByItems + this._totalDescendantsWithReferences;
+        const totalNeedingAttention = this.getTotalEntitiesNeedingAttention();
+        if (total === 0 && totalNeedingAttention === 0)
+            return nothing;
+        return html `
+			<p class="reference-summary">
+				${when(this._totalReferencedByItems, () => html `
+						<uui-button
+							label=${this.localize.term('references_viewDependentItemsAction')}
+							look="outline"
+							@click=${(event) => this.#onClickView('referencedBy', event)}>
+							<umb-localize key="references_viewDependentItemsAction">View items that depend on this…</umb-localize>
+						</uui-button>
+					`)}
+				${when(this._totalDescendantsWithReferences, () => html `
+						<uui-button
+							label=${this.localize.term('references_viewDescendantsWithReferencesAction')}
+							look="outline"
+							@click=${(event) => this.#onClickView('descendantsWithReferences', event)}>
+							<umb-localize key="references_viewDescendantsWithReferencesAction"
+								>View referenced descendants…</umb-localize
+							>
+						</uui-button>
+					`)}
+				${when(totalNeedingAttention > 0, () => html `
+						<uui-button
+							label=${this.localize.term('references_viewEntitiesNeedingAttentionAction')}
+							look="outline"
+							@click=${this.#onClickViewEntitiesNeedingAttention}>
+							<umb-localize key="references_viewEntitiesNeedingAttentionAction"
+								>View referenced elements with pending changes…</umb-localize
+							>
+						</uui-button>
+					`)}
+			</p>
+		`;
+    }
+    static { this.styles = [
+        css `
+			.reference-summary {
+				display: flex;
+				align-items: center;
+				flex-wrap: wrap;
+				gap: var(--uui-size-space-2);
+				color: var(--uui-color-text-alt);
+			}
+		`,
+    ]; }
+};
+__decorate([
+    property({ type: Object, attribute: false })
+], UmbEntityReferencesSummaryElement.prototype, "config", void 0);
+__decorate([
+    state()
+], UmbEntityReferencesSummaryElement.prototype, "_totalReferencedByItems", void 0);
+__decorate([
+    state()
+], UmbEntityReferencesSummaryElement.prototype, "_totalDescendantsWithReferences", void 0);
+__decorate([
+    property({ type: Array, attribute: false })
+], UmbEntityReferencesSummaryElement.prototype, "entitiesNeedingAttention", void 0);
+UmbEntityReferencesSummaryElement = __decorate([
+    customElement('umb-entity-references-summary')
+], UmbEntityReferencesSummaryElement);
+export { UmbEntityReferencesSummaryElement };
+export default UmbEntityReferencesSummaryElement;

package/dist-cms/packages/relations/relations/global-components/index.d.ts

@@ -1,4 +1,9 @@
 import './confirm-action-modal-entity-references.element.js';
 import './confirm-bulk-action-modal-entity-references.element.js';
+import './entity-reference-list.element.js';
+import './entity-references-summary.element.js';
 export * from './confirm-action-modal-entity-references.element.js';
 export * from './confirm-bulk-action-modal-entity-references.element.js';
+export * from './entity-reference-list.element.js';
+export * from './entity-references-summary.element.js';
+export type { UmbEntityReferencesConfig, UmbEntityReferencesBulkConfig } from './types.js';

package/dist-cms/packages/relations/relations/global-components/index.js

@@ -1,4 +1,8 @@
 import './confirm-action-modal-entity-references.element.js';
 import './confirm-bulk-action-modal-entity-references.element.js';
+import './entity-reference-list.element.js';
+import './entity-references-summary.element.js';
 export * from './confirm-action-modal-entity-references.element.js';
 export * from './confirm-bulk-action-modal-entity-references.element.js';
+export * from './entity-reference-list.element.js';
+export * from './entity-references-summary.element.js';

package/dist-cms/packages/relations/relations/global-components/types.d.ts

@@ -1,2 +1,39 @@
 export type * from './confirm-action-modal-entity-references.element.js';
 export type * from './confirm-bulk-action-modal-entity-references.element.js';
+export type * from './entity-reference-list.element.js';
+export type * from './entity-references-summary.element.js';
+/**
+ * Configuration for looking up the entities that reference a single entity, and the descendants of that entity
+ * that are referenced elsewhere.
+ */
+export interface UmbEntityReferencesConfig {
+    /**
+     * Alias of the item repository used to resolve descendant uniques into presentable items.
+     */
+    itemRepositoryAlias: string;
+    /**
+     * Alias of the reference repository used to look up references.
+     */
+    referenceRepositoryAlias: string;
+    /**
+     * The unique identifier of the entity to look up references for.
+     */
+    unique: string;
+}
+/**
+ * Configuration for looking up which of a set of entities are referenced elsewhere.
+ */
+export interface UmbEntityReferencesBulkConfig {
+    /**
+     * The unique identifiers of the entities to check.
+     */
+    uniques: Array<string>;
+    /**
+     * Alias of the item repository used to resolve uniques into presentable items.
+     */
+    itemRepositoryAlias: string;
+    /**
+     * Alias of the reference repository used to look up references.
+     */
+    referenceRepositoryAlias: string;
+}

package/dist-cms/packages/relations/relations/index.d.ts

@@ -5,6 +5,7 @@ export * from './entity.js';
 export { UmbBulkTrashWithRelationEntityAction } from './entity-actions/bulk-trash/bulk-trash-with-relation.action.js';
 export { UmbTrashWithRelationEntityAction } from './entity-actions/trash/trash-with-relation.action.js';
 export * from './global-components/index.js';
+export * from './reference/index.js';
 export * from './utils.js';
 export type { MetaEntityBulkActionTrashWithRelationKind, ManifestEntityBulkActionTrashWithRelationKind, } from './entity-actions/bulk-trash/types.js';
 export type { MetaEntityActionTrashWithRelationKind, ManifestEntityActionTrashWithRelationKind, } from './entity-actions/trash/types.js';

package/dist-cms/packages/relations/relations/index.js

@@ -5,4 +5,5 @@ export * from './entity.js';
 export { UmbBulkTrashWithRelationEntityAction } from './entity-actions/bulk-trash/bulk-trash-with-relation.action.js';
 export { UmbTrashWithRelationEntityAction } from './entity-actions/trash/trash-with-relation.action.js';
 export * from './global-components/index.js';
+export * from './reference/index.js';
 export * from './utils.js';

package/dist-cms/packages/relations/relations/manifests.js

@@ -3,6 +3,7 @@ import { manifests as bulkTrashManifests } from './entity-actions/bulk-trash/man
 import { manifests as collectionManifests } from './collection/manifests.js';
 import { manifests as deleteManifests } from './entity-actions/delete/manifests.js';
 import { manifests as trashManifests } from './entity-actions/trash/manifests.js';
+import { manifests as referencesModalManifests } from './reference/modal/manifests.js';
 import { manifests as workspaceInfoAppManifests } from './reference/workspace-info-app/manifests.js';
 export const manifests = [
     ...bulkDeleteManifests,
@@ -10,5 +11,6 @@ export const manifests = [
     ...collectionManifests,
     ...deleteManifests,
     ...trashManifests,
+    ...referencesModalManifests,
     ...workspaceInfoAppManifests,
 ];

package/dist-cms/packages/relations/relations/reference/entity-reference-count.manager.d.ts

@@ -0,0 +1,61 @@
+import { UmbControllerBase } from '../../../../libs/class-api/index.js';
+import type { UmbControllerHost } from '../../../../libs/controller-api/index.js';
+export interface UmbEntityReferenceCountManagerArgs {
+    /**
+     * Alias of the reference repository used to look up the count.
+     */
+    referenceRepositoryAlias: string;
+    /**
+     * When `false`, `setUnique` only resets the cached total rather than loading it — the first
+     * `getTotalAsync()` call after that loads it on demand. Defaults to `true`.
+     */
+    prefetch?: boolean;
+}
+/**
+ * Tracks the total number of items referencing a given entity, so a consumer (e.g. a publishing workspace context)
+ * can make a decision that depends on the count (like whether to show a confirmation dialog) without awaiting a
+ * network round-trip at the point of decision.
+ * @exports
+ * @class UmbEntityReferenceCountManager
+ * @augments {UmbControllerBase}
+ */
+export declare class UmbEntityReferenceCountManager extends UmbControllerBase {
+    #private;
+    /** Observable emitting the current reference count. `undefined` until the first successful load. */
+    readonly total: import("rxjs").Observable<number | undefined>;
+    constructor(host: UmbControllerHost, args: UmbEntityReferenceCountManagerArgs);
+    /**
+     * Get the current reference count, if known. `undefined` means it hasn't loaded yet — prefer
+     * {@link getTotalAsync} when the caller needs a definite answer.
+     * @returns {number | undefined}
+     */
+    getTotal(): number | undefined;
+    /**
+     * Get the current reference count, loading it first if it hasn't loaded yet. Use this at decision points
+     * (e.g. "should a confirmation dialog open?") so an unlucky race with the initial load can't silently read as 0.
+     * Piggybacks on a reload already in flight (e.g. from {@link setUnique}) rather than starting a second,
+     * redundant one — starting a second one here would race the first and could win with a stale/empty result.
+     * @returns {Promise<number>} The reference count.
+     */
+    getTotalAsync(): Promise<number>;
+    /**
+     * Set the entity to count references for. A no-op if the unique is unchanged. When `prefetch` is enabled
+     * (the default), also (re)loads the count immediately; otherwise the count is loaded lazily, on the first
+     * {@link getTotalAsync} call.
+     * @param {string | undefined} unique - The unique identifier of the entity, or `undefined` to clear.
+     * @returns {Promise<void>}
+     */
+    setUnique(unique: string | undefined): Promise<void>;
+    /**
+     * Drops the cached count (if any) without changing the current unique, so the next {@link getTotalAsync} call
+     * re-reads it from the server. Cheaper than {@link reload} for lazy (`prefetch: false`) consumers that don't
+     * need the fresh value immediately — e.g. right after a publish/unpublish/schedule action.
+     * @returns {void}
+     */
+    clear(): void;
+    /**
+     * Reload the reference count for the current unique.
+     * @returns {Promise<void>}
+     */
+    reload(): Promise<void>;
+}

package/dist-cms/packages/relations/relations/reference/entity-reference-count.manager.js

@@ -0,0 +1,132 @@
+import { UmbBasicState } from '../../../../libs/observable-api/index.js';
+import { UmbControllerBase } from '../../../../libs/class-api/index.js';
+import { createExtensionApiByAlias } from '../../../core/extension-registry/index.js';
+/**
+ * Tracks the total number of items referencing a given entity, so a consumer (e.g. a publishing workspace context)
+ * can make a decision that depends on the count (like whether to show a confirmation dialog) without awaiting a
+ * network round-trip at the point of decision.
+ * @exports
+ * @class UmbEntityReferenceCountManager
+ * @augments {UmbControllerBase}
+ */
+export class UmbEntityReferenceCountManager extends UmbControllerBase {
+    #total;
+    #referenceRepositoryAlias;
+    #prefetch;
+    #unique;
+    #reloadToken;
+    #repository;
+    #repositoryPromise;
+    #pendingReload;
+    constructor(host, args) {
+        super(host);
+        this.#total = new UmbBasicState(undefined);
+        /** Observable emitting the current reference count. `undefined` until the first successful load. */
+        this.total = this.#total.asObservable();
+        this.#reloadToken = 0;
+        this.#referenceRepositoryAlias = args.referenceRepositoryAlias;
+        this.#prefetch = args.prefetch ?? true;
+    }
+    /**
+     * Get the current reference count, if known. `undefined` means it hasn't loaded yet — prefer
+     * {@link getTotalAsync} when the caller needs a definite answer.
+     * @returns {number | undefined}
+     */
+    getTotal() {
+        return this.#total.getValue();
+    }
+    /**
+     * Get the current reference count, loading it first if it hasn't loaded yet. Use this at decision points
+     * (e.g. "should a confirmation dialog open?") so an unlucky race with the initial load can't silently read as 0.
+     * Piggybacks on a reload already in flight (e.g. from {@link setUnique}) rather than starting a second,
+     * redundant one — starting a second one here would race the first and could win with a stale/empty result.
+     * @returns {Promise<number>} The reference count.
+     */
+    async getTotalAsync() {
+        const current = this.getTotal();
+        if (current !== undefined)
+            return current;
+        await (this.#pendingReload ?? this.reload());
+        return this.getTotal() ?? 0;
+    }
+    /**
+     * Set the entity to count references for. A no-op if the unique is unchanged. When `prefetch` is enabled
+     * (the default), also (re)loads the count immediately; otherwise the count is loaded lazily, on the first
+     * {@link getTotalAsync} call.
+     * @param {string | undefined} unique - The unique identifier of the entity, or `undefined` to clear.
+     * @returns {Promise<void>}
+     */
+    async setUnique(unique) {
+        if (this.#unique === unique)
+            return;
+        this.#unique = unique;
+        if (!this.#prefetch) {
+            this.#invalidate();
+            return;
+        }
+        await this.reload();
+    }
+    /**
+     * Drops the cached count (if any) without changing the current unique, so the next {@link getTotalAsync} call
+     * re-reads it from the server. Cheaper than {@link reload} for lazy (`prefetch: false`) consumers that don't
+     * need the fresh value immediately — e.g. right after a publish/unpublish/schedule action.
+     * @returns {void}
+     */
+    clear() {
+        this.#invalidate();
+    }
+    /**
+     * Invalidate any reload already in flight and drop the cached total, without touching {@link #unique}.
+     * Shared by {@link clear} and the lazy branch of {@link setUnique} so the two can't drift apart — leaving
+     * `#pendingReload` set here would let a subsequent {@link getTotalAsync} call ride along on a reload for a
+     * unique this manager no longer cares about, and read its (irrelevant) result as the answer.
+     * @returns {void}
+     */
+    #invalidate() {
+        ++this.#reloadToken;
+        this.#pendingReload = undefined;
+        this.#total.setValue(undefined);
+    }
+    /**
+     * Reload the reference count for the current unique.
+     * @returns {Promise<void>}
+     */
+    async reload() {
+        const promise = this.#doReload();
+        this.#pendingReload = promise;
+        try {
+            await promise;
+        }
+        finally {
+            if (this.#pendingReload === promise)
+                this.#pendingReload = undefined;
+        }
+    }
+    async #doReload() {
+        const unique = this.#unique;
+        const token = ++this.#reloadToken;
+        if (!unique) {
+            this.#total.setValue(undefined);
+            return;
+        }
+        const total = await this.#requestTotal(unique);
+        // A newer reload (e.g. the unique changed again) has since started — its result should win, not ours.
+        if (token !== this.#reloadToken)
+            return;
+        this.#total.setValue(total);
+    }
+    async #requestTotal(unique) {
+        const repository = await this.#getRepository();
+        const { data, error } = await repository.requestReferencedBy(unique, 0, 1);
+        if (error)
+            throw error;
+        return data?.total ?? 0;
+    }
+    async #getRepository() {
+        if (this.#repository)
+            return this.#repository;
+        this.#repositoryPromise ??= createExtensionApiByAlias(this, this.#referenceRepositoryAlias);
+        this.#repository = await this.#repositoryPromise;
+        return this.#repository;
+    }
+}

package/dist-cms/packages/relations/relations/reference/index.d.ts

@@ -0,0 +1,2 @@
+export * from './entity-reference-count.manager.js';
+export * from './modal/index.js';

package/dist-cms/packages/relations/relations/reference/index.js

@@ -0,0 +1,2 @@
+export * from './entity-reference-count.manager.js';
+export * from './modal/index.js';

package/dist-cms/packages/relations/relations/reference/modal/constants.d.ts

@@ -0,0 +1,8 @@
+import type { UmbEntityReferencesModalData } from './types.js';
+import { UmbModalToken } from '../../../../core/modal/index.js';
+export declare const UMB_ENTITY_REFERENCES_MODAL_ALIAS = "Umb.Modal.EntityReferences";
+/**
+ * Modal token for the entity references modal: a paged overview of the entities referencing (or referenced by)
+ * a single entity.
+ */
+export declare const UMB_ENTITY_REFERENCES_MODAL: UmbModalToken<UmbEntityReferencesModalData, undefined>;

package/dist-cms/packages/relations/relations/reference/modal/constants.js

@@ -0,0 +1,11 @@
+import { UmbModalToken } from '../../../../core/modal/index.js';
+export const UMB_ENTITY_REFERENCES_MODAL_ALIAS = 'Umb.Modal.EntityReferences';
+/**
+ * Modal token for the entity references modal: a paged overview of the entities referencing (or referenced by)
+ * a single entity.
+ */
+export const UMB_ENTITY_REFERENCES_MODAL = new UmbModalToken(UMB_ENTITY_REFERENCES_MODAL_ALIAS, {
+    modal: {
+        type: 'dialog',
+    },
+});

package/dist-cms/packages/relations/relations/reference/modal/entity-references-modal.element.d.ts

@@ -0,0 +1,17 @@
+import type { UmbEntityReferencesModalData, UmbEntityReferencesModalValue } from './types.js';
+import { nothing } from '../../../../../external/lit/index.js';
+import { UmbModalBaseElement } from '../../../../core/modal/index.js';
+import '../../global-components/entity-reference-list.element.js';
+export declare class UmbEntityReferencesModalElement extends UmbModalBaseElement<UmbEntityReferencesModalData, UmbEntityReferencesModalValue> {
+    #private;
+    private _referencedByTotal;
+    private _descendantsTotal;
+    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    static readonly styles: import("lit").CSSResult[];
+}
+export default UmbEntityReferencesModalElement;
+declare global {
+    interface HTMLElementTagNameMap {
+        'umb-entity-references-modal': UmbEntityReferencesModalElement;
+    }
+}

package/dist-cms/packages/relations/relations/reference/modal/entity-references-modal.element.js

@@ -0,0 +1,106 @@
+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 { css, customElement, html, nothing, state, when } from '../../../../../external/lit/index.js';
+import { UmbModalBaseElement } from '../../../../core/modal/index.js';
+import '../../global-components/entity-reference-list.element.js';
+const HEADLINE_KEYS = {
+    referencedBy: 'references_labelUsedByItems',
+    descendantsWithReferences: 'references_labelDescendantsWithReferences',
+    needingAttention: 'references_labelElementsWithPendingChanges',
+};
+let UmbEntityReferencesModalElement = class UmbEntityReferencesModalElement extends UmbModalBaseElement {
+    constructor() {
+        super(...arguments);
+        this._referencedByTotal = 0;
+        this._descendantsTotal = 0;
+    }
+    #onReferencedByChange(event) {
+        this._referencedByTotal = event.target.getTotal();
+    }
+    #onDescendantsChange(event) {
+        this._descendantsTotal = event.target.getTotal();
+    }
+    #close() {
+        this.modalContext?.submit();
+    }
+    render() {
+        if (!this.data)
+            return nothing;
+        const data = this.data;
+        const source = data.source;
+        const showReferencedBy = !source || source === 'referencedBy';
+        const showDescendants = !source || source === 'descendantsWithReferences';
+        const showNeedingAttention = !source || source === 'needingAttention';
+        const headline = data.headline ?? this.localize.term(HEADLINE_KEYS[source ?? 'referencedBy']);
+        return html `
+			<uui-dialog-layout headline=${headline}>
+				${when(showReferencedBy, () => html `
+						<div ?hidden=${!this._referencedByTotal}>
+							<p>
+								<umb-localize key="references_labelDependsOnThis">The following items depend on this:</umb-localize>
+							</p>
+							<umb-entity-reference-list
+								.unique=${data.unique}
+								.referenceRepositoryAlias=${data.referenceRepositoryAlias}
+								source="referencedBy"
+								@change=${this.#onReferencedByChange}>
+							</umb-entity-reference-list>
+						</div>
+					`)}
+				${when(showDescendants, () => html `
+						<div ?hidden=${!this._descendantsTotal}>
+							<p>
+								<umb-localize key="references_labelDependentDescendants"
+									>The following descending items have dependencies:</umb-localize
+								>
+							</p>
+							<umb-entity-reference-list
+								.unique=${data.unique}
+								.referenceRepositoryAlias=${data.referenceRepositoryAlias}
+								.itemRepositoryAlias=${data.itemRepositoryAlias}
+								source="descendantsWithReferences"
+								@change=${this.#onDescendantsChange}>
+							</umb-entity-reference-list>
+						</div>
+					`)}
+				${when(showNeedingAttention && data.entitiesNeedingAttention?.length, () => html `
+						<div>
+							<p>
+								<umb-localize key="references_labelElementsWithPendingChanges"
+									>The following referenced elements are not fully published:</umb-localize
+								>
+							</p>
+							<umb-entity-reference-list .items=${data.entitiesNeedingAttention}></umb-entity-reference-list>
+						</div>
+					`)}
+				<div slot="actions">
+					<uui-button label=${this.localize.term('general_close')} look="primary" @click=${this.#close}></uui-button>
+				</div>
+			</uui-dialog-layout>
+		`;
+    }
+    static { this.styles = [
+        css `
+			:host {
+				display: block;
+				min-width: 460px;
+				max-width: 90vw;
+			}
+		`,
+    ]; }
+};
+__decorate([
+    state()
+], UmbEntityReferencesModalElement.prototype, "_referencedByTotal", void 0);
+__decorate([
+    state()
+], UmbEntityReferencesModalElement.prototype, "_descendantsTotal", void 0);
+UmbEntityReferencesModalElement = __decorate([
+    customElement('umb-entity-references-modal')
+], UmbEntityReferencesModalElement);
+export { UmbEntityReferencesModalElement };
+export default UmbEntityReferencesModalElement;

package/dist-cms/packages/relations/relations/reference/modal/index.d.ts

@@ -0,0 +1,2 @@
+export * from './constants.js';
+export type * from './types.js';

package/dist-cms/packages/relations/relations/reference/modal/index.js

@@ -0,0 +1 @@
+export * from './constants.js';

package/dist-cms/packages/relations/relations/reference/modal/manifests.d.ts

@@ -0,0 +1 @@
+export declare const manifests: Array<UmbExtensionManifest>;

package/dist-cms/packages/relations/relations/reference/modal/manifests.js

@@ -0,0 +1,9 @@
+import { UMB_ENTITY_REFERENCES_MODAL_ALIAS } from './constants.js';
+export const manifests = [
+    {
+        type: 'modal',
+        alias: UMB_ENTITY_REFERENCES_MODAL_ALIAS,
+        name: 'Entity References Modal',
+        element: () => import('./entity-references-modal.element.js'),
+    },
+];