@umbraco-cms/backoffice 14.0.0-rc4 → 14.0.0-rc5

package/dist-cms/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.d.ts

@@ -2,29 +2,30 @@ import type { UmbMediaPickerPropertyValue } from './index.js';
 import { UmbLitElement } from '../../../../core/lit-element/index.js';
 import type { UmbPropertyEditorConfigCollection } from '../../../../core/property-editor/index.js';
 import type { UmbPropertyEditorUiElement } from '../../../../core/extension-registry/index.js';
-import './components/input-rich-media/input-rich-media.element.js';
+import '../../components/input-rich-media/input-rich-media.element.js';
+declare const elementName = "umb-property-editor-ui-media-picker";
 /**
  * @element umb-property-editor-ui-media-picker
  */
 export declare class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement implements UmbPropertyEditorUiElement {
     #private;
-    set value(value: Array<UmbMediaPickerPropertyValue>);
-    get value(): Array<UmbMediaPickerPropertyValue>;
+    value?: Array<UmbMediaPickerPropertyValue>;
+    set config(config: UmbPropertyEditorConfigCollection | undefined);
     private _startNode;
     private _focalPointEnabled;
-    private _crops;
+    private _preselectedCrops;
     private _allowedMediaTypes;
-    set config(config: UmbPropertyEditorConfigCollection | undefined);
-    get config(): UmbPropertyEditorConfigCollection | undefined;
     private _multiple;
-    _items: Array<string>;
-    private _limitMin;
-    private _limitMax;
+    private _min;
+    private _max;
+    private _alias?;
+    private _variantId?;
+    constructor();
     render(): import("lit-html").TemplateResult<1>;
 }
-export default UmbPropertyEditorUIMediaPickerElement;
+export { UmbPropertyEditorUIMediaPickerElement as element };
 declare global {
     interface HTMLElementTagNameMap {
-        'umb-property-editor-ui-media-picker': UmbPropertyEditorUIMediaPickerElement;
+        [elementName]: UmbPropertyEditorUIMediaPickerElement;
     }
 }

package/dist-cms/packages/media/media/property-editors/media-picker/property-editor-ui-media-picker.element.js

@@ -5,85 +5,66 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { customElement, html, property, state } from '../../../../../external/lit/index.js';
-import { UmbId } from '../../../../core/id/index.js';
 import { UmbLitElement } from '../../../../core/lit-element/index.js';
 import { UmbPropertyValueChangeEvent } from '../../../../core/property-editor/index.js';
-import './components/input-rich-media/input-rich-media.element.js';
+import { UMB_PROPERTY_CONTEXT } from '../../../../core/property/index.js';
+import '../../components/input-rich-media/input-rich-media.element.js';
+const elementName = 'umb-property-editor-ui-media-picker';
 /**
  * @element umb-property-editor-ui-media-picker
  */
 let UmbPropertyEditorUIMediaPickerElement = class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement {
-    constructor() {
-        super(...arguments);
-        this._startNode = '';
-        this._focalPointEnabled = false;
-        this._crops = [];
-        this._allowedMediaTypes = [];
-        this._multiple = false;
-        this._items = [];
-        this._limitMin = 0;
-        this._limitMax = Infinity;
-        this.#value = [];
-    }
-    set value(value) {
-        this.#value = value;
-        this._items = this.value ? this.value.map((x) => x.mediaKey) : [];
-    }
-    //TODO: Add support for document specific crops. The server side already supports this.
-    get value() {
-        return this.#value;
-    }
     set config(config) {
         if (!config)
             return;
+        this._allowedMediaTypes = config.getValueByAlias('filter')?.split(',') ?? [];
+        this._focalPointEnabled = Boolean(config.getValueByAlias('enableLocalFocalPoint'));
         this._multiple = Boolean(config.getValueByAlias('multiple'));
+        this._preselectedCrops = config?.getValueByAlias('crops') ?? [];
         this._startNode = config.getValueByAlias('startNodeId') ?? '';
-        this._focalPointEnabled = Boolean(config.getValueByAlias('enableFocalPoint'));
-        this._crops = config?.getValueByAlias('crops') ?? [];
-        const filter = config.getValueByAlias('filter');
-        this._allowedMediaTypes = filter?.split(',') ?? [];
         const minMax = config.getValueByAlias('validationLimit');
-        this._limitMin = minMax?.min ?? 0;
-        this._limitMax = minMax?.max ?? Infinity;
+        this._min = minMax?.min ?? 0;
+        this._max = minMax?.max ?? Infinity;
     }
-    get config() {
-        return undefined;
+    constructor() {
+        super();
+        this._startNode = '';
+        this._focalPointEnabled = false;
+        this._preselectedCrops = [];
+        this._allowedMediaTypes = [];
+        this._multiple = false;
+        this._min = 0;
+        this._max = Infinity;
+        this.consumeContext(UMB_PROPERTY_CONTEXT, (context) => {
+            this.observe(context.alias, (alias) => (this._alias = alias));
+            this.observe(context.variantId, (variantId) => (this._variantId = variantId?.toString() || 'invariant'));
+        });
     }
-    #value;
     #onChange(event) {
-        const selection = event.target.selection;
-        const result = selection.map((mediaKey) => {
-            return {
-                key: UmbId.new(),
-                mediaKey,
-                mediaTypeAlias: '',
-                focalPoint: null,
-                crops: [],
-            };
-        });
-        this.value = result;
-        this._items = this.value ? this.value.map((x) => x.mediaKey) : [];
+        this.value = event.target.items;
         this.dispatchEvent(new UmbPropertyValueChangeEvent());
     }
     render() {
         return html `
 			<umb-input-rich-media
-				@change=${this.#onChange}
-				?multiple=${this._multiple}
+				.alias=${this._alias}
 				.allowedContentTypeIds=${this._allowedMediaTypes}
-				.startNode=${this._startNode}
 				.focalPointEnabled=${this._focalPointEnabled}
-				.crops=${this._crops}
-				.selection=${this._items}
-				.min=${this._limitMin}
-				.max=${this._limitMax}>
+				.items=${this.value ?? []}
+				.max=${this._max}
+				.min=${this._min}
+				.preselectedCrops=${this._preselectedCrops}
+				.startNode=${this._startNode}
+				.variantId=${this._variantId}
+				?multiple=${this._multiple}
+				@change=${this.#onChange}>
 			</umb-input-rich-media>
 		`;
     }
 };
 __decorate([
     property({ attribute: false })
-], UmbPropertyEditorUIMediaPickerElement.prototype, "value", null);
+], UmbPropertyEditorUIMediaPickerElement.prototype, "value", void 0);
 __decorate([
     state()
 ], UmbPropertyEditorUIMediaPickerElement.prototype, "_startNode", void 0);
@@ -92,7 +73,7 @@ __decorate([
 ], UmbPropertyEditorUIMediaPickerElement.prototype, "_focalPointEnabled", void 0);
 __decorate([
     state()
-], UmbPropertyEditorUIMediaPickerElement.prototype, "_crops", void 0);
+], UmbPropertyEditorUIMediaPickerElement.prototype, "_preselectedCrops", void 0);
 __decorate([
     state()
 ], UmbPropertyEditorUIMediaPickerElement.prototype, "_allowedMediaTypes", void 0);
@@ -101,15 +82,18 @@ __decorate([
 ], UmbPropertyEditorUIMediaPickerElement.prototype, "_multiple", void 0);
 __decorate([
     state()
-], UmbPropertyEditorUIMediaPickerElement.prototype, "_items", void 0);
+], UmbPropertyEditorUIMediaPickerElement.prototype, "_min", void 0);
+__decorate([
+    state()
+], UmbPropertyEditorUIMediaPickerElement.prototype, "_max", void 0);
 __decorate([
     state()
-], UmbPropertyEditorUIMediaPickerElement.prototype, "_limitMin", void 0);
+], UmbPropertyEditorUIMediaPickerElement.prototype, "_alias", void 0);
 __decorate([
     state()
-], UmbPropertyEditorUIMediaPickerElement.prototype, "_limitMax", void 0);
+], UmbPropertyEditorUIMediaPickerElement.prototype, "_variantId", void 0);
 UmbPropertyEditorUIMediaPickerElement = __decorate([
-    customElement('umb-property-editor-ui-media-picker')
+    customElement(elementName)
 ], UmbPropertyEditorUIMediaPickerElement);
 export { UmbPropertyEditorUIMediaPickerElement };
-export default UmbPropertyEditorUIMediaPickerElement;
+export { UmbPropertyEditorUIMediaPickerElement as element };

package/dist-cms/packages/media/media/property-editors/upload-field/Umbraco.UploadField.d.ts

@@ -0,0 +1,2 @@
+import type { ManifestPropertyEditorSchema } from '../../../../core/extension-registry/index.js';
+export declare const manifest: ManifestPropertyEditorSchema;

package/dist-cms/packages/media/media/property-editors/upload-field/index.d.ts

@@ -0,0 +1 @@
+export * from './property-editor-ui-upload-field.element.js';

package/dist-cms/packages/media/media/property-editors/upload-field/index.js

@@ -0,0 +1 @@
+export * from './property-editor-ui-upload-field.element.js';

package/dist-cms/packages/media/media/property-editors/upload-field/manifests.d.ts

@@ -0,0 +1,2 @@
+import type { ManifestTypes } from '../../../../core/extension-registry/index.js';
+export declare const manifests: Array<ManifestTypes>;

package/dist-cms/packages/{property-editors → media/media/property-editors}/upload-field/property-editor-ui-upload-field.element.d.ts

@@ -1,10 +1,7 @@
-import type { UmbPropertyEditorUiElement } from '../../core/extension-registry/index.js';
-import { UmbLitElement } from '../../core/lit-element/index.js';
-import { type UmbPropertyEditorConfigCollection } from '../../core/property-editor/index.js';
-export interface MediaValueType {
-    temporaryFileId?: string | null;
-    src?: string;
-}
+import type { MediaValueType } from './types.js';
+import type { UmbPropertyEditorUiElement } from '../../../../core/extension-registry/index.js';
+import { UmbLitElement } from '../../../../core/lit-element/index.js';
+import { type UmbPropertyEditorConfigCollection } from '../../../../core/property-editor/index.js';
 /**
  * @element umb-property-editor-ui-upload-field
  */

package/dist-cms/packages/{property-editors → media/media/property-editors}/upload-field/property-editor-ui-upload-field.element.js

@@ -4,9 +4,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { html, customElement, property, state } from '../../../external/lit/index.js';
-import { UmbLitElement } from '../../core/lit-element/index.js';
-import { UmbPropertyValueChangeEvent, } from '../../core/property-editor/index.js';
+import { html, customElement, property, state } from '../../../../../external/lit/index.js';
+import { UmbLitElement } from '../../../../core/lit-element/index.js';
+import { UmbPropertyValueChangeEvent, } from '../../../../core/property-editor/index.js';
 /**
  * @element umb-property-editor-ui-upload-field
  */

package/dist-cms/packages/media/media/property-editors/upload-field/types.d.ts

@@ -0,0 +1,4 @@
+export interface MediaValueType {
+    temporaryFileId?: string | null;
+    src?: string;
+}

package/dist-cms/packages/media/media/property-editors/upload-field/types.js

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

package/dist-cms/packages/media/media/section-view/media-section-view.element.js

@@ -48,6 +48,7 @@ let UmbMediaSectionViewElement = class UmbMediaSectionViewElement extends UmbLit
             unique: '',
             dataTypeId: '',
             allowedEntityBulkActions: config?.getValueByAlias('bulkActionPermissions'),
+            layouts: config?.getValueByAlias('layouts'),
             orderBy: config?.getValueByAlias('orderBy') ?? 'updateDate',
             orderDirection: config?.getValueByAlias('orderDirection') ?? 'asc',
             pageSize: Number(config?.getValueByAlias('pageSize')) ?? 50,

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

@@ -1,4 +1,4 @@
-import { UmbMediaPropertyDataContext } from '../property-dataset-context/media-property-dataset-context.js';
+import { UmbMediaPropertyDatasetContext } from '../property-dataset-context/media-property-dataset-context.js';
 import { UmbMediaDetailRepository } from '../repository/index.js';
 import type { UmbMediaDetailModel, UmbMediaVariantModel, UmbMediaVariantOptionModel } from '../types.js';
 import { UmbVariantId } from '../../../core/variant/index.js';
@@ -63,7 +63,7 @@ export declare class UmbMediaWorkspaceContext extends UmbSubmittableWorkspaceCon
     finishPropertyValueChange: () => void;
     submit(): Promise<void>;
     delete(): Promise<void>;
-    createPropertyDatasetContext(host: UmbControllerHost, variantId: UmbVariantId): UmbMediaPropertyDataContext;
+    createPropertyDatasetContext(host: UmbControllerHost, variantId: UmbVariantId): UmbMediaPropertyDatasetContext;
     destroy(): void;
 }
 export { UmbMediaWorkspaceContext as api };

package/dist-cms/packages/media/media/workspace/media-workspace.context.js

@@ -1,5 +1,5 @@
 import { UmbMediaTypeDetailRepository } from '../../media-types/repository/detail/media-type-detail.repository.js';
-import { UmbMediaPropertyDataContext } from '../property-dataset-context/media-property-dataset-context.js';
+import { UmbMediaPropertyDatasetContext } from '../property-dataset-context/media-property-dataset-context.js';
 import { UMB_MEDIA_ENTITY_TYPE } from '../entity.js';
 import { UmbMediaDetailRepository } from '../repository/index.js';
 import { UMB_INVARIANT_CULTURE, UmbVariantId } from '../../../core/variant/index.js';
@@ -375,7 +375,7 @@ export class UmbMediaWorkspaceContext extends UmbSubmittableWorkspaceContextBase
     }
     */
     createPropertyDatasetContext(host, variantId) {
-        return new UmbMediaPropertyDataContext(host, this, variantId);
+        return new UmbMediaPropertyDatasetContext(host, this, variantId);
     }
     destroy() {
         this.#persistedData.destroy();

package/dist-cms/packages/media/media/workspace/views/info/media-workspace-view-info-history.element.js

@@ -90,11 +90,13 @@ let UmbMediaWorkspaceViewInfoHistoryElement = class UmbMediaWorkspaceViewInfoHis
                 const avatarUrl = user && Array.isArray(user.avatarUrls) ? user.avatarUrls[1] : undefined;
                 return html `<umb-history-item
 								.name=${user?.name ?? 'Unknown'}
-								detail=${this.localize.date(item.timestamp, TimeOptions)}>
+								.detail=${this.localize.date(item.timestamp, TimeOptions)}>
 								<uui-avatar slot="avatar" .name="${userName}" img-src=${ifDefined(avatarUrl)}></uui-avatar>
 
 								<span class="log-type">
-									<uui-tag look=${style.look} color=${style.color}> ${this.localize.term(text.label)} </uui-tag>
+									<uui-tag look=${style.look} color=${style.color}>
+										${this.localize.term(text.label, item.parameters)}
+									</uui-tag>
 									${this.localize.term(text.desc, item.parameters)}
 								</span>
 							</umb-history-item>`;

package/dist-cms/packages/media/media/workspace/views/info/media-workspace-view-info-reference.element.d.ts

@@ -1,15 +1,14 @@
-import { nothing } from '../../../../../../external/lit/index.js';
 import { UmbLitElement } from '../../../../../core/lit-element/index.js';
 export declare class UmbMediaWorkspaceViewInfoReferenceElement extends UmbLitElement {
     #private;
     mediaUnique: string;
-    private _editMediaPath;
     private _currentPage;
     private _total;
     private _items?;
+    private _loading;
     constructor();
     protected firstUpdated(): void;
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
     static styles: import("@lit/reactive-element/css-tag.js").CSSResult[];
 }
 export default UmbMediaWorkspaceViewInfoReferenceElement;

package/dist-cms/packages/media/media/workspace/views/info/media-workspace-view-info-reference.element.js

@@ -4,42 +4,46 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { css, html, customElement, state, nothing, repeat, property } from '../../../../../../external/lit/index.js';
+import { css, customElement, html, nothing, property, repeat, state, when } from '../../../../../../external/lit/index.js';
+import { isDefaultReference, isDocumentReference, isMediaReference } from '../../../../../relations/relations/index.js';
 import { UmbLitElement } from '../../../../../core/lit-element/index.js';
-import { UmbTextStyles } from '../../../../../core/style/index.js';
 import { UmbMediaReferenceRepository } from '../../../index.js';
-import { UMB_WORKSPACE_MODAL, UmbModalRouteRegistrationController } from '../../../../../core/modal/index.js';
-import { isDefaultReference, isDocumentReference, isMediaReference, } from '../../../../../relations/relations/index.js';
+import { UmbModalRouteRegistrationController } from '../../../../../core/router/index.js';
+import { UmbTextStyles } from '../../../../../core/style/index.js';
+import { UMB_WORKSPACE_MODAL } from '../../../../../core/modal/index.js';
 let UmbMediaWorkspaceViewInfoReferenceElement = class UmbMediaWorkspaceViewInfoReferenceElement extends UmbLitElement {
     #itemsPerPage;
     #referenceRepository;
+    #routeBuilder;
     constructor() {
         super();
         this.#itemsPerPage = 10;
         this.mediaUnique = '';
-        this._editMediaPath = '';
         this._currentPage = 1;
         this._total = 0;
         this._items = [];
+        this._loading = true;
         this.#referenceRepository = new UmbMediaReferenceRepository(this);
         new UmbModalRouteRegistrationController(this, UMB_WORKSPACE_MODAL)
-            .addAdditionalPath('media')
-            .onSetup(() => {
-            return { data: { entityType: 'media', preset: {} } };
+            .addAdditionalPath(':entityType')
+            .onSetup((params) => {
+            return { data: { entityType: params.entityType, preset: {} } };
         })
             .observeRouteBuilder((routeBuilder) => {
-            this._editMediaPath = routeBuilder({});
+            this.#routeBuilder = routeBuilder;
         });
     }
     firstUpdated() {
         this.#getReferences();
     }
     async #getReferences() {
-        const { data } = await this.#referenceRepository.requestReferencedBy(this.mediaUnique, this._currentPage - 1 * this.#itemsPerPage, this.#itemsPerPage);
+        this._loading = true;
+        const { data } = await this.#referenceRepository.requestReferencedBy(this.mediaUnique, (this._currentPage - 1) * this.#itemsPerPage, this.#itemsPerPage);
         if (!data)
             return;
         this._total = data.total;
         this._items = data.items;
+        this._loading = false;
     }
     #onPageChange(event) {
         if (this._currentPage === event.target.current)
@@ -47,6 +51,10 @@ let UmbMediaWorkspaceViewInfoReferenceElement = class UmbMediaWorkspaceViewInfoR
         this._currentPage = event.target.current;
         this.#getReferences();
     }
+    #getEditPath(item) {
+        const entityType = this.#getEntityType(item);
+        return this.#routeBuilder && entityType ? `${this.#routeBuilder({ entityType })}edit/${item.id}` : '#';
+    }
     #getIcon(item) {
         if (isDocumentReference(item)) {
             return item.documentType.icon ?? 'icon-document';
@@ -72,79 +80,75 @@ let UmbMediaWorkspaceViewInfoReferenceElement = class UmbMediaWorkspaceViewInfoR
         if (isDefaultReference(item)) {
             return item.type;
         }
-        return '';
+        return null;
     }
-    #getContentType(item) {
+    #getEntityType(item) {
         if (isDocumentReference(item)) {
-            return item.documentType.alias;
+            return 'document';
         }
         if (isMediaReference(item)) {
-            return item.mediaType.alias;
+            return 'media';
         }
         if (isDefaultReference(item)) {
             return item.type;
         }
-        return '';
+        return null;
     }
     render() {
-        if (this._items && this._items.length > 0) {
-            return html ` <uui-box
-					headline=${this.localize.term('references_labelUsedByItems')}
-					style="--uui-box-default-padding:0">
-					<uui-table>
-						<uui-table-head>
-							<uui-table-head-cell></uui-table-head-cell>
-							<uui-table-head-cell><umb-localize key="general_name">Name</umb-localize></uui-table-head-cell>
-							<uui-table-head-cell><umb-localize key="general_status">Status</umb-localize></uui-table-head-cell>
-							<uui-table-head-cell><umb-localize key="general_typeName">Type Name</umb-localize></uui-table-head-cell>
-							<uui-table-head-cell><umb-localize key="general_type">Type</umb-localize></uui-table-head-cell>
-						</uui-table-head>
-
-						${repeat(this._items, (item) => item.id, (item) => html `<uui-table-row>
-									<uui-table-cell style="text-align:center;">
-										<umb-icon name=${this.#getIcon(item)}></umb-icon>
-									</uui-table-cell>
-									<uui-table-cell class="link-cell">
-										${isDocumentReference(item)
-                ? html `
-													<uui-button
-														label="${this.localize.term('general_edit')} ${item.name}"
-														href=${`${this._editMediaPath}edit/${item.id}`}>
-														${item.name}
-													</uui-button>
-												`
-                : item.name}
-									</uui-table-cell>
-									<uui-table-cell>
-										${this.#getPublishedStatus(item)
-                ? this.localize.term('content_published')
-                : this.localize.term('content_unpublished')}
-									</uui-table-cell>
-									<uui-table-cell>${this.#getContentTypeName(item)}</uui-table-cell>
-									<uui-table-cell>${this.#getContentType(item)}</uui-table-cell>
-								</uui-table-row>`)}
-					</uui-table>
-				</uui-box>
-				${this.#renderReferencePagination()}`;
-        }
-        else {
-            return nothing;
-        }
+        return html `
+			<uui-box headline=${this.localize.term('references_labelUsedByItems')}>
+				${when(this._loading, () => html `<uui-loader></uui-loader>`, () => html `${this.#renderItems()} ${this.#renderPagination()}`)}
+			</uui-box>
+		`;
+    }
+    #renderItems() {
+        if (!this._items?.length)
+            return html `<p>${this.localize.term('references_DataTypeNoReferences')}</p>`;
+        return html `
+			<uui-table>
+				<uui-table-head>
+					<uui-table-head-cell><umb-localize key="general_name">Name</umb-localize></uui-table-head-cell>
+					<uui-table-head-cell><umb-localize key="general_status">Status</umb-localize></uui-table-head-cell>
+					<uui-table-head-cell><umb-localize key="general_typeName">Type Name</umb-localize></uui-table-head-cell>
+					<uui-table-head-cell><umb-localize key="general_type">Type</umb-localize></uui-table-head-cell>
+				</uui-table-head>
+				${repeat(this._items, (item) => item.id, (item) => html `
+						<uui-table-row>
+							<uui-table-cell>
+								<uui-ref-node name=${item.name} href=${this.#getEditPath(item)}>
+									<umb-icon slot="icon" name=${this.#getIcon(item)}></umb-icon>
+								</uui-ref-node>
+							</uui-table-cell>
+							<uui-table-cell>
+								${when(this.#getPublishedStatus(item), () => html `<uui-tag color="positive" look="secondary"
+											>${this.localize.term('content_published')}</uui-tag
+										>`, () => html `<uui-tag color="default" look="secondary"
+											>${this.localize.term('content_unpublished')}</uui-tag
+										>`)}
+							</uui-table-cell>
+							<uui-table-cell>${this.#getContentTypeName(item)}</uui-table-cell>
+							<uui-table-cell>${this.#getEntityType(item)}</uui-table-cell>
+						</uui-table-row>
+					`)}
+			</uui-table>
+		`;
     }
-    #renderReferencePagination() {
+    #renderPagination() {
         if (!this._total)
             return nothing;
         const totalPages = Math.ceil(this._total / this.#itemsPerPage);
         if (totalPages <= 1)
             return nothing;
-        return html `<div class="pagination">
-			<uui-pagination .total=${totalPages} @change="${this.#onPageChange}"></uui-pagination>
-		</div>`;
+        return html `
+			<div class="pagination">
+				<uui-pagination .total=${totalPages} @change=${this.#onPageChange}></uui-pagination>
+			</div>
+		`;
     }
     static { this.styles = [
         UmbTextStyles,
         css `
-			uui-table-cell:not(.link-cell) {
+			uui-table-cell {
 				color: var(--uui-color-text-alt);
 			}
 
@@ -164,9 +168,6 @@ let UmbMediaWorkspaceViewInfoReferenceElement = class UmbMediaWorkspaceViewInfoR
 __decorate([
     property()
 ], UmbMediaWorkspaceViewInfoReferenceElement.prototype, "mediaUnique", void 0);
-__decorate([
-    state()
-], UmbMediaWorkspaceViewInfoReferenceElement.prototype, "_editMediaPath", void 0);
 __decorate([
     state()
 ], UmbMediaWorkspaceViewInfoReferenceElement.prototype, "_currentPage", void 0);
@@ -176,6 +177,9 @@ __decorate([
 __decorate([
     state()
 ], UmbMediaWorkspaceViewInfoReferenceElement.prototype, "_items", void 0);
+__decorate([
+    state()
+], UmbMediaWorkspaceViewInfoReferenceElement.prototype, "_loading", void 0);
 UmbMediaWorkspaceViewInfoReferenceElement = __decorate([
     customElement('umb-media-workspace-view-info-reference')
 ], UmbMediaWorkspaceViewInfoReferenceElement);

package/dist-cms/packages/media/media/workspace/views/info/media-workspace-view-info.element.d.ts

@@ -3,15 +3,15 @@ import './media-workspace-view-info-history.element.js';
 import './media-workspace-view-info-reference.element.js';
 export declare class UmbMediaWorkspaceViewInfoElement extends UmbLitElement {
     #private;
-    private _nodeName;
-    private _mediaTypeId;
-    private _mediaUnique;
-    private _workspaceContext?;
+    private _mediaTypeUnique;
+    private _mediaTypeName?;
+    private _mediaTypeIcon?;
     private _editMediaTypePath;
+    private _mediaUnique;
     private _urls?;
     private _createDate;
+    private _updateDate;
     constructor();
-    private _observeContent;
     render(): import("lit-html").TemplateResult<1>;
     static styles: import("@lit/reactive-element/css-tag.js").CSSResult[];
 }