@mmlogic/components 0.3.8 → 0.3.9

package/dist/esm/{mrd-boolean-field_20.entry.js → mrd-boolean-field_22.entry.js}

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-_tsCCkAi.js';
-import { ClientLayoutItemFieldDataType, ClientLayoutItemType, ClientLayoutItemRelationDisplayType, ClientLayoutItemRelationEditBehavior } from './index.js';
+import { ClientLayoutItemFieldDataType, ClientLayoutItemType, ClientLayoutItemRelationDisplayType, ClientLayoutItemRelationEditBehavior, resolveArchetype, ARCHETYPE_DOCUMENT } from './index.js';
 
 const mrdBooleanFieldScss = () => `.sc-mrd-boolean-field-h{display:block}.mrd-boolean-field.sc-mrd-boolean-field{display:flex;align-items:center;width:100%}.mrd-boolean-field__toggle-label.sc-mrd-boolean-field{display:flex;align-items:center;gap:var(--mrd-space-3);cursor:pointer;user-select:none}.mrd-boolean-field__checkbox.sc-mrd-boolean-field{position:absolute;opacity:0;width:0;height:0;pointer-events:none}.mrd-boolean-field__checkbox.sc-mrd-boolean-field:checked+.mrd-boolean-field__toggle.sc-mrd-boolean-field{background-color:var(--mrd-color-primary)}.mrd-boolean-field__checkbox.sc-mrd-boolean-field:checked+.mrd-boolean-field__toggle.sc-mrd-boolean-field::after{transform:translateX(20px)}.mrd-boolean-field__checkbox.sc-mrd-boolean-field:focus+.mrd-boolean-field__toggle.sc-mrd-boolean-field{box-shadow:var(--mrd-shadow-focus)}.mrd-boolean-field__checkbox.sc-mrd-boolean-field:disabled+.mrd-boolean-field__toggle.sc-mrd-boolean-field{opacity:0.5;cursor:not-allowed}.mrd-boolean-field__toggle.sc-mrd-boolean-field{position:relative;display:inline-block;width:44px;height:24px;background-color:var(--mrd-color-neutral-300);border-radius:var(--mrd-border-radius-full);transition:background-color var(--mrd-transition);flex-shrink:0}.mrd-boolean-field__toggle.sc-mrd-boolean-field::after{content:'';position:absolute;top:2px;left:2px;width:20px;height:20px;background-color:var(--mrd-color-white);border-radius:50%;transition:transform var(--mrd-transition);box-shadow:var(--mrd-shadow-sm)}.mrd-boolean-field__text.sc-mrd-boolean-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-800)}.mrd-boolean-field__text--required.sc-mrd-boolean-field::after{content:' *';color:var(--mrd-color-danger)}`;
 
@@ -27,7 +27,7 @@ const MrdBooleanField = class {
         this.checked = !!this.value;
     }
     render() {
-        return (h(Host, { key: 'aed1d936d686870114a12aad9fc4cccb76ecd31e' }, h("div", { key: '5cc8aaa0f12d4195d02fce8a810d7d993e2e8c99', class: "mrd-boolean-field" }, h("label", { key: '41c3b3e0f01778fc2654ba86e3fe4e5a07c8537a', class: "mrd-boolean-field__toggle-label" }, h("input", { key: 'c261e6903e050d2f3d8df8abb90c74d99ed20161', class: "mrd-boolean-field__checkbox", type: "checkbox", name: this.name, checked: this.checked, disabled: this.disabled, onChange: this.handleChange, onBlur: this.handleBlur }), h("span", { key: '079ee220fe692536af15a7fb4286626102ae940e', class: "mrd-boolean-field__toggle", "aria-hidden": "true" }), this.label && (h("span", { key: '1f4f52a41f0bd6ba4c61cf9d4db74ab2f1aa8877', class: `mrd-boolean-field__text${this.required ? ' mrd-boolean-field__text--required' : ''}` }, this.label))))));
+        return (h(Host, { key: '38e65a1c7971912f8259d09281b272d7cbd446f2' }, h("div", { key: 'e10919998731d744cc2a13130c5f355c9b8fc9aa', class: "mrd-boolean-field" }, h("label", { key: 'db85a2c80cc62fdfd25237e3f5c7750bf1666819', class: "mrd-boolean-field__toggle-label" }, h("input", { key: 'cddd7004593fa4671abb89f4f805c4a009db99ef', class: "mrd-boolean-field__checkbox", type: "checkbox", name: this.name, checked: this.checked, disabled: this.disabled, onChange: this.handleChange, onBlur: this.handleBlur }), h("span", { key: 'f90f0ed6d74d6688e51b8d85a5397a0597d95ad8', class: "mrd-boolean-field__toggle", "aria-hidden": "true" }), this.label && (h("span", { key: '7e4582b1d9a5b08c00c220bec53baa6c14cbfe43', class: `mrd-boolean-field__text${this.required ? ' mrd-boolean-field__text--required' : ''}` }, this.label))))));
     }
 };
 MrdBooleanField.style = mrdBooleanFieldScss();
@@ -66,6 +66,9 @@ const translations = {
         table_filter_clear_all: 'Alle filters wissen',
         table_new_record: 'Nieuw record',
         table_export_excel: 'Exporteer naar Excel',
+        doc_view_switch: 'Weergave wisselen',
+        doc_view_tree: 'Boomweergave',
+        doc_view_list: 'Lijstweergave',
         // mrd-table filter popup
         filter_sorting: 'Sortering',
         filter_ascending: 'Oplopend',
@@ -129,6 +132,9 @@ const translations = {
         table_filter_clear_all: 'Clear all filters',
         table_new_record: 'New record',
         table_export_excel: 'Export to Excel',
+        doc_view_switch: 'Switch view',
+        doc_view_tree: 'Tree view',
+        doc_view_list: 'List view',
         // mrd-table filter popup
         filter_sorting: 'Sorting',
         filter_ascending: 'Ascending',
@@ -192,6 +198,9 @@ const translations = {
         table_filter_clear_all: 'مسح جميع الفلاتر',
         table_new_record: 'سجل جديد',
         table_export_excel: 'تصدير إلى Excel',
+        doc_view_switch: 'تبديل العرض',
+        doc_view_tree: 'عرض شجري',
+        doc_view_list: 'عرض القائمة',
         // mrd-table filter popup
         filter_sorting: 'الترتيب',
         filter_ascending: 'تصاعدي',
@@ -255,6 +264,9 @@ const translations = {
         table_filter_clear_all: 'Effacer tous les filtres',
         table_new_record: 'Nouvel enregistrement',
         table_export_excel: 'Exporter vers Excel',
+        doc_view_switch: 'Changer de vue',
+        doc_view_tree: 'Vue arborescente',
+        doc_view_list: 'Vue liste',
         // mrd-table filter popup
         filter_sorting: 'Tri',
         filter_ascending: 'Croissant',
@@ -318,6 +330,9 @@ const translations = {
         table_filter_clear_all: 'Alle Filter löschen',
         table_new_record: 'Neuer Eintrag',
         table_export_excel: 'Als Excel exportieren',
+        doc_view_switch: 'Ansicht wechseln',
+        doc_view_tree: 'Baumansicht',
+        doc_view_list: 'Listenansicht',
         // mrd-table filter popup
         filter_sorting: 'Sortierung',
         filter_ascending: 'Aufsteigend',
@@ -381,6 +396,9 @@ const translations = {
         table_filter_clear_all: 'Borrar todos los filtros',
         table_new_record: 'Nuevo registro',
         table_export_excel: 'Exportar a Excel',
+        doc_view_switch: 'Cambiar vista',
+        doc_view_tree: 'Vista de árbol',
+        doc_view_list: 'Vista de lista',
         // mrd-table filter popup
         filter_sorting: 'Ordenación',
         filter_ascending: 'Ascendente',
@@ -444,6 +462,9 @@ const translations = {
         table_filter_clear_all: 'Cancella tutti i filtri',
         table_new_record: 'Nuovo record',
         table_export_excel: 'Esporta in Excel',
+        doc_view_switch: 'Cambia vista',
+        doc_view_tree: 'Vista ad albero',
+        doc_view_list: 'Vista elenco',
         // mrd-table filter popup
         filter_sorting: 'Ordinamento',
         filter_ascending: 'Crescente',
@@ -507,6 +528,9 @@ const translations = {
         table_filter_clear_all: 'Очистити всі фільтри',
         table_new_record: 'Новий запис',
         table_export_excel: 'Експортувати до Excel',
+        doc_view_switch: 'Змінити вигляд',
+        doc_view_tree: 'Деревоподібний вигляд',
+        doc_view_list: 'Список',
         // mrd-table filter popup
         filter_sorting: 'Сортування',
         filter_ascending: 'За зростанням',
@@ -719,7 +743,7 @@ const MrdCurrencyField = class {
     }
     render() {
         const hasError = !!this.error;
-        return (h(Host, { key: 'd3450e9c26b1a755d3e6a5a3561d93b2ac566a28' }, h("div", { key: 'b66942cc1953daff728504deef8a9cc1330ef549', class: "mrd-currency-field" }, this.label && (h("label", { key: '3d3f2f06e9ffea944552f0f7cf3150d0246c54f0', class: `mrd-currency-field__label${this.required ? ' mrd-currency-field__label--required' : ''}` }, this.label)), h("div", { key: 'd30a2adfceefdbefef2d4fe6633a163a753b15d0', class: "mrd-currency-field__row" }, h("input", { key: '9af09b19b6cbe24498d6ca8edf7b28f675afdec5', class: `mrd-currency-field__amount${hasError ? ' mrd-currency-field__amount--error' : ''}`, type: "text", inputMode: "decimal", name: `${this.name}_amount`, value: this.amountDisplay, placeholder: "0.00", required: this.required, disabled: this.disabled, onInput: this.handleAmountInput, onBlur: this.handleAmountBlur }), h("select", { key: '21e55b04b7bf16586b5cfaa82d77db45c6dedf21', class: "mrd-currency-field__currency", disabled: this.disabled, onChange: this.handleCurrencyChange }, COMMON_CURRENCIES.map(c => (h("option", { key: c, value: c, selected: c === this.currency }, c))))), hasError && h("span", { key: '7a0006d4230557cf9c58f82f21de73b5d12f7e17', class: "mrd-currency-field__error" }, this.error))));
+        return (h(Host, { key: 'fe3520c44d831caf36b388cb5968a9518b16cb8b' }, h("div", { key: '50c1fd2d53038e46da575d3e46e1ec26c2da423b', class: "mrd-currency-field" }, this.label && (h("label", { key: 'a2649d41bf6e3765c8a62ba6559c64c41615027a', class: `mrd-currency-field__label${this.required ? ' mrd-currency-field__label--required' : ''}` }, this.label)), h("div", { key: '952b51f315b4a5c05a8373ce3a3f1041086ba8b8', class: "mrd-currency-field__row" }, h("input", { key: '137a72ffc5d79fc8e0a8cf44c012d84a50c26d5b', class: `mrd-currency-field__amount${hasError ? ' mrd-currency-field__amount--error' : ''}`, type: "text", inputMode: "decimal", name: `${this.name}_amount`, value: this.amountDisplay, placeholder: "0.00", required: this.required, disabled: this.disabled, onInput: this.handleAmountInput, onBlur: this.handleAmountBlur }), h("select", { key: '1755854ca9b76dc4b41ad84b6b788685931ace36', class: "mrd-currency-field__currency", disabled: this.disabled, onChange: this.handleCurrencyChange }, COMMON_CURRENCIES.map(c => (h("option", { key: c, value: c, selected: c === this.currency }, c))))), hasError && h("span", { key: '0f10eb98c2e6444651d79d1de92acd0dbcc7133b', class: "mrd-currency-field__error" }, this.error))));
     }
 };
 MrdCurrencyField.style = mrdCurrencyFieldScss();
@@ -755,7 +779,7 @@ const MrdDateField = class {
     }
     render() {
         const hasError = !!this.error;
-        return (h(Host, { key: '84c777fc68a95e0b1ceb08d61e3af7afa199ce94' }, h("div", { key: '6653d94ab79c74342ce792792547018e4464a814', class: "mrd-date-field" }, this.label && (h("label", { key: '2fa7b7ec50c784f9410ca48b93d50e39dc6e0bee', class: `mrd-date-field__label${this.required ? ' mrd-date-field__label--required' : ''}` }, this.label)), h("input", { key: 'f79ebbaf0e28ad7668a5400d1df514b66457b72d', class: `mrd-date-field__input${hasError ? ' mrd-date-field__input--error' : ''}`, type: "date", name: this.name, value: this.value, required: this.required, disabled: this.disabled, onChange: this.handleChange, onBlur: this.handleBlur }), hasError && h("span", { key: 'e52f0b720d76e8ba0586fb40395b6875860762db', class: "mrd-date-field__error" }, this.error))));
+        return (h(Host, { key: '2c0dc2311068a5c759fe8efe58a98a71a9cf4b7b' }, h("div", { key: 'ee1cc0e9a2943cc42439825b8f21cd3492eaca05', class: "mrd-date-field" }, this.label && (h("label", { key: '3f836a991e676b6070a8b3800edfce00cc0d3b3d', class: `mrd-date-field__label${this.required ? ' mrd-date-field__label--required' : ''}` }, this.label)), h("input", { key: '575185661987eea3dc91950f51995b2cc75debea', class: `mrd-date-field__input${hasError ? ' mrd-date-field__input--error' : ''}`, type: "date", name: this.name, value: this.value, required: this.required, disabled: this.disabled, onChange: this.handleChange, onBlur: this.handleBlur }), hasError && h("span", { key: '480ec99200989f3dc543d9afc648d83d31992b3c', class: "mrd-date-field__error" }, this.error))));
     }
 };
 MrdDateField.style = mrdDateFieldScss();
@@ -818,7 +842,7 @@ const MrdDatetimeField = class {
     }
     render() {
         const hasError = !!this.error;
-        return (h(Host, { key: '6052b08238484bee345ae4bb9b3025c7f2474c35' }, h("div", { key: 'f9073be4496e35a7d40405ae4e6a27a5c1607626', class: "mrd-datetime-field" }, this.label && (h("label", { key: '5933c3b2dfcae9bfad378441210ada6b625657a2', class: `mrd-datetime-field__label${this.required ? ' mrd-datetime-field__label--required' : ''}` }, this.label)), h("input", { key: '7a947b104c38960d2326a4877e4ca52db9fd9d84', class: `mrd-datetime-field__input${hasError ? ' mrd-datetime-field__input--error' : ''}`, type: "datetime-local", name: this.name, value: this.localValue, required: this.required, disabled: this.disabled, onChange: this.handleChange, onBlur: this.handleBlur }), hasError && h("span", { key: 'cea3dba7e14e18a3a08394ef3027b661f1808969', class: "mrd-datetime-field__error" }, this.error))));
+        return (h(Host, { key: 'ea8b3b68100ffdb316bc5048f82d85d238bb2e4b' }, h("div", { key: 'c192c6998ee474aaf4df7b3b97ae0bd61f6d624d', class: "mrd-datetime-field" }, this.label && (h("label", { key: '1fbd66c17d76508f0d698a2c258be6779e98d85e', class: `mrd-datetime-field__label${this.required ? ' mrd-datetime-field__label--required' : ''}` }, this.label)), h("input", { key: 'fc9612c062a1cab5076a06598cabf227adce996c', class: `mrd-datetime-field__input${hasError ? ' mrd-datetime-field__input--error' : ''}`, type: "datetime-local", name: this.name, value: this.localValue, required: this.required, disabled: this.disabled, onChange: this.handleChange, onBlur: this.handleBlur }), hasError && h("span", { key: '8788ac01739302f6ad61010b238ff38d45e1b68a', class: "mrd-datetime-field__error" }, this.error))));
     }
     static get watchers() { return {
         "value": [{
@@ -828,6 +852,402 @@ const MrdDatetimeField = class {
 };
 MrdDatetimeField.style = mrdDatetimeFieldScss();
 
+const mrdDocumentListScss = () => `.sc-mrd-document-list-h{display:block}.mrd-document-list.sc-mrd-document-list{padding:var(--mrd-space-2) 0}.mrd-document-list__row.sc-mrd-document-list{display:flex;align-items:center;gap:var(--mrd-space-2);height:2.125rem;padding:0 var(--mrd-space-4);cursor:pointer;user-select:none;font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-800)}.mrd-document-list__row.sc-mrd-document-list:hover{background:var(--mrd-color-neutral-50)}.mrd-document-list__row--dossier.sc-mrd-document-list .mrd-document-list__label.sc-mrd-document-list{font-weight:var(--mrd-font-weight-semibold)}.mrd-document-list__indent.sc-mrd-document-list{flex:none}.mrd-document-list__chev.sc-mrd-document-list{width:1rem;height:1rem;flex:none;display:grid;place-items:center;color:var(--mrd-color-neutral-400);transition:transform var(--mrd-transition-fast)}.mrd-document-list__chev.sc-mrd-document-list svg.sc-mrd-document-list{width:0.6875rem;height:0.6875rem}.mrd-document-list__chev--open.sc-mrd-document-list{transform:rotate(90deg)}.mrd-document-list__chev--leaf.sc-mrd-document-list{visibility:hidden}.mrd-document-list__icon.sc-mrd-document-list{width:1.0625rem;height:1.0625rem;flex:none}.mrd-document-list__icon--dossier.sc-mrd-document-list{color:var(--mrd-color-primary)}.mrd-document-list__icon--folder.sc-mrd-document-list{color:#d9a441}.mrd-document-list__icon--doc.sc-mrd-document-list{color:var(--mrd-color-neutral-400)}.mrd-document-list__label.sc-mrd-document-list{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mrd-document-list__count.sc-mrd-document-list{flex:none;font-family:var(--mrd-font-family-mono);font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-500);background:var(--mrd-color-neutral-100);border-radius:var(--mrd-border-radius-full);padding:0.0625rem 0.5rem}.mrd-document-list__date.sc-mrd-document-list{flex:none;font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-400);font-variant-numeric:tabular-nums}.mrd-document-list__loading.sc-mrd-document-list{display:flex;align-items:center;gap:var(--mrd-space-2);height:1.875rem;padding:0 var(--mrd-space-4);font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-400)}.mrd-document-list__spinner.sc-mrd-document-list{width:0.75rem;height:0.75rem;border:2px solid var(--mrd-color-neutral-300);border-top-color:var(--mrd-color-primary);border-radius:50%;animation:mrd-document-list-spin 0.7s linear infinite}@keyframes mrd-document-list-spin{to{transform:rotate(360deg)}}.mrd-document-list__empty.sc-mrd-document-list{padding:var(--mrd-space-8) var(--mrd-space-4);text-align:center;color:var(--mrd-color-neutral-400);font-size:var(--mrd-font-size-sm)}`;
+
+const MrdDocumentList = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.mrdLoadDistinct = createEvent(this, "mrdLoadDistinct");
+        this.mrdLoadPage = createEvent(this, "mrdLoadPage");
+        this.mrdNavigate = createEvent(this, "mrdNavigate");
+        /** The VIEW or RELATED_VIEW layout item (dataClass, fromClass, view config). */
+        this.item = null;
+        /** Parent record id — required for RELATED_VIEW path building. */
+        this.parentId = '';
+        this.locale = navigator.language;
+        this.containers = [];
+        this.rootLoading = true;
+        /** True when the single-container level is collapsed away (dossier context). */
+        this.singleContainer = false;
+        this.nodeIndex = new Map();
+    }
+    componentDidLoad() {
+        this.emitContainerDistinct();
+    }
+    // ── Slot field names ─────────────────────────────────────────────────────
+    get containerField() {
+        var _a, _b, _c;
+        return (_c = (_b = (_a = this.archetype) === null || _a === void 0 ? void 0 : _a.slots) === null || _b === void 0 ? void 0 : _b.container) !== null && _c !== void 0 ? _c : 'container';
+    }
+    get folderField() {
+        var _a, _b, _c;
+        return (_c = (_b = (_a = this.archetype) === null || _a === void 0 ? void 0 : _a.slots) === null || _b === void 0 ? void 0 : _b.folder) !== null && _c !== void 0 ? _c : 'folder';
+    }
+    get titleField() {
+        var _a, _b, _c;
+        return (_c = (_b = (_a = this.archetype) === null || _a === void 0 ? void 0 : _a.slots) === null || _b === void 0 ? void 0 : _b.title) !== null && _c !== void 0 ? _c : 'name';
+    }
+    get dateField() {
+        var _a, _b;
+        return (_b = (_a = this.archetype) === null || _a === void 0 ? void 0 : _a.slots) === null || _b === void 0 ? void 0 : _b.date;
+    }
+    // ── Path / query building (mirrors mrd-table conventions) ────────────────
+    /** VIEW: `/{dataClass}`; RELATED_VIEW: `/{fromClass}/{parentId}/{dataClass}`. */
+    buildDataPath() {
+        var _a, _b, _c;
+        const it = this.item;
+        const dataClass = (_b = (_a = it === null || it === void 0 ? void 0 : it.dataClass) !== null && _a !== void 0 ? _a : it === null || it === void 0 ? void 0 : it.relatedClass) !== null && _b !== void 0 ? _b : '';
+        if ((it === null || it === void 0 ? void 0 : it.type) === ClientLayoutItemType.RELATED_VIEW) {
+            return `/${(_c = it.fromClass) !== null && _c !== void 0 ? _c : ''}/${this.parentId}/${dataClass}`;
+        }
+        return `/${dataClass}`;
+    }
+    /** View-level static filters + filterClass, shared by every request. */
+    baseParams() {
+        var _a, _b, _c, _d, _e, _f, _g;
+        const p = new URLSearchParams();
+        const filterClass = (_a = this.item) === null || _a === void 0 ? void 0 : _a.filterClass;
+        if (filterClass)
+            p.set('type', filterClass);
+        for (const f of ((_d = (_c = (_b = this.item) === null || _b === void 0 ? void 0 : _b.view) === null || _c === void 0 ? void 0 : _c.filter) !== null && _d !== void 0 ? _d : [])) {
+            if (!f.name)
+                continue;
+            if (f.operator === 'EMPTY') {
+                p.set(f.name, '');
+                continue;
+            }
+            if (f.operator === 'NOT_EMPTY') {
+                p.set(f.name + '_notempty', 'true');
+                continue;
+            }
+            if (f.operator === 'STARTS_WITH') {
+                p.set(f.name + '_startswith', String((_e = f.value) !== null && _e !== void 0 ? _e : ''));
+                continue;
+            }
+            if (f.operator === 'FROM') {
+                p.set(f.name + '_from', String((_f = f.value) !== null && _f !== void 0 ? _f : ''));
+                continue;
+            }
+            if (f.operator === 'TO') {
+                p.set(f.name + '_to', String((_g = f.value) !== null && _g !== void 0 ? _g : ''));
+                continue;
+            }
+            if (f.value != null) {
+                p.set(f.name, String(f.value));
+            }
+        }
+        return p;
+    }
+    emitContainerDistinct() {
+        const p = this.baseParams();
+        p.set('distinct', this.containerField);
+        this.mrdLoadDistinct.emit({
+            nodeId: MrdDocumentList.ROOT,
+            distinct: this.containerField,
+            path: this.buildDataPath() + '/distinct',
+            qs: p.toString(),
+        });
+    }
+    emitFolderDistinct(container) {
+        var _a;
+        const p = this.baseParams();
+        p.set('distinct', this.folderField);
+        p.set(this.containerField + '_href', (_a = container.href) !== null && _a !== void 0 ? _a : '');
+        container.loading = true;
+        this.mrdLoadDistinct.emit({
+            nodeId: container.id,
+            distinct: this.folderField,
+            path: this.buildDataPath() + '/distinct',
+            qs: p.toString(),
+        });
+    }
+    emitDocuments(container, node) {
+        var _a, _b;
+        const p = this.baseParams();
+        p.set(this.containerField + '_href', (_a = container.href) !== null && _a !== void 0 ? _a : '');
+        p.set(this.folderField, (_b = node.fullPath) !== null && _b !== void 0 ? _b : '');
+        node.loading = true;
+        this.mrdLoadPage.emit({
+            nodeId: node.id,
+            page: 0,
+            sort: '',
+            path: this.buildDataPath(),
+            qs: p.toString(),
+        });
+    }
+    // ── Public injection API ─────────────────────────────────────────────────
+    /** Inject distinct values for a node. `nodeId` is the sentinel root (containers)
+     *  or a container node id (folders). */
+    async setDistinct(nodeId, values) {
+        if (nodeId === MrdDocumentList.ROOT) {
+            this.applyContainers(values);
+        }
+        else {
+            this.applyFolders(nodeId, values);
+        }
+    }
+    /** Inject the documents loaded for one folder node. */
+    async setDocuments(nodeId, docs) {
+        const node = this.nodeIndex.get(nodeId);
+        if (!node)
+            return;
+        node.docs = docs !== null && docs !== void 0 ? docs : [];
+        node.docsLoaded = true;
+        node.loading = false;
+        this.bump();
+    }
+    applyContainers(values) {
+        const nodes = [];
+        for (const v of values) {
+            if (!v.value || typeof v.value !== 'object')
+                continue;
+            const href = v.value.href;
+            const node = this.makeContainerNode(href, v.value.name, v.count);
+            nodes.push(node);
+            this.nodeIndex.set(node.id, node);
+        }
+        this.containers = nodes;
+        this.rootLoading = false;
+        this.singleContainer = nodes.length === 1;
+        // Single container (dossier context): collapse the level away, load its folders now.
+        if (this.singleContainer) {
+            const only = nodes[0];
+            only.open = true;
+            this.emitFolderDistinct(only);
+        }
+    }
+    applyFolders(containerId, values) {
+        const container = this.nodeIndex.get(containerId);
+        if (!container)
+            return;
+        container.children = [];
+        container.hasDocs = false;
+        container.docCount = 0;
+        for (const v of values) {
+            const raw = typeof v.value === 'string' ? v.value : v.value == null ? '' : String(v.value);
+            const segs = this.splitFolder(raw);
+            if (segs.length === 0) {
+                // Root documents — the container's own direct documents.
+                container.hasDocs = true;
+                container.docCount = v.count;
+                container.fullPath = raw;
+                continue;
+            }
+            let node = container;
+            const acc = [];
+            for (const seg of segs) {
+                acc.push(seg);
+                let child = node.children.find(c => c.label === seg);
+                if (!child) {
+                    child = this.makeFolderNode(container.id + '/' + acc.join('/'), seg);
+                    node.children.push(child);
+                    this.nodeIndex.set(child.id, child);
+                }
+                node = child;
+            }
+            node.hasDocs = true;
+            node.docCount = v.count;
+            node.fullPath = raw;
+        }
+        this.computeTotals(container);
+        container.foldersLoaded = true;
+        container.loading = false;
+        // If the container has root documents, load them now (they show inline on expand).
+        if (container.hasDocs && !container.docsLoaded) {
+            this.emitDocuments(container, container);
+        }
+        this.bump();
+    }
+    // ── Tree helpers ─────────────────────────────────────────────────────────
+    /** Normalise a folder path: null/""/"/" → root ([]); else split on "/" dropping empties. */
+    splitFolder(path) {
+        if (path == null)
+            return [];
+        const s = String(path).trim();
+        if (s === '' || s === '/')
+            return [];
+        return s.split('/').map(x => x.trim()).filter(Boolean);
+    }
+    makeContainerNode(href, label, count) {
+        return {
+            id: 'c:' + href, kind: 'container', label, href,
+            hasDocs: false, docCount: 0, totalCount: count, children: [],
+            open: false, loading: false, foldersLoaded: false, docsLoaded: false, docs: [],
+        };
+    }
+    makeFolderNode(id, label) {
+        return {
+            id, kind: 'folder', label,
+            hasDocs: false, docCount: 0, totalCount: 0, children: [],
+            open: false, loading: false, foldersLoaded: false, docsLoaded: false, docs: [],
+        };
+    }
+    computeTotals(node) {
+        let total = node.docCount;
+        for (const c of node.children)
+            total += this.computeTotals(c);
+        node.totalCount = total;
+        return total;
+    }
+    /** Force a re-render after mutating nodes in place. */
+    bump() {
+        this.containers = [...this.containers];
+    }
+    // ── Interaction ──────────────────────────────────────────────────────────
+    toggleContainer(node) {
+        node.open = !node.open;
+        if (node.open && !node.foldersLoaded && !node.loading) {
+            this.emitFolderDistinct(node);
+        }
+        this.bump();
+    }
+    toggleFolder(container, node) {
+        node.open = !node.open;
+        if (node.open && node.hasDocs && !node.docsLoaded && !node.loading) {
+            this.emitDocuments(container, node);
+        }
+        this.bump();
+    }
+    openDoc(doc) {
+        var _a, _b, _c, _d;
+        const href = (_b = (_a = doc === null || doc === void 0 ? void 0 : doc._links) === null || _a === void 0 ? void 0 : _a.self) === null || _b === void 0 ? void 0 : _b.href;
+        const label = (_d = (_c = doc === null || doc === void 0 ? void 0 : doc[this.titleField]) !== null && _c !== void 0 ? _c : doc === null || doc === void 0 ? void 0 : doc.name) !== null && _d !== void 0 ? _d : '';
+        this.mrdNavigate.emit({ href, label });
+    }
+    // ── Render ───────────────────────────────────────────────────────────────
+    renderChevron(open, leaf) {
+        return (h("span", { class: `mrd-document-list__chev${leaf ? ' mrd-document-list__chev--leaf' : ''}${open ? ' mrd-document-list__chev--open' : ''}` }, h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { d: "M9 6l6 6-6 6" }))));
+    }
+    renderDossierIcon() {
+        return (h("svg", { class: "mrd-document-list__icon mrd-document-list__icon--dossier", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { d: "M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" })));
+    }
+    renderFolderIcon() {
+        return (h("svg", { class: "mrd-document-list__icon mrd-document-list__icon--folder", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { d: "M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" })));
+    }
+    renderDocIcon() {
+        return (h("svg", { class: "mrd-document-list__icon mrd-document-list__icon--doc", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }), h("path", { d: "M14 2v6h6" })));
+    }
+    indent(depth) {
+        return h("span", { class: "mrd-document-list__indent", style: { width: `${depth * 18}px` } });
+    }
+    renderDocRow(doc, depth) {
+        var _a, _b, _c, _d, _e;
+        const label = (_b = (_a = doc === null || doc === void 0 ? void 0 : doc[this.titleField]) !== null && _a !== void 0 ? _a : doc === null || doc === void 0 ? void 0 : doc.name) !== null && _b !== void 0 ? _b : '';
+        const dateRaw = this.dateField ? doc === null || doc === void 0 ? void 0 : doc[this.dateField] : undefined;
+        const date = dateRaw ? formatDate(dateRaw, this.locale) : '';
+        return (h("div", { class: "mrd-document-list__row mrd-document-list__row--doc", key: (_e = (_d = (_c = doc === null || doc === void 0 ? void 0 : doc._links) === null || _c === void 0 ? void 0 : _c.self) === null || _d === void 0 ? void 0 : _d.href) !== null && _e !== void 0 ? _e : label, onClick: () => this.openDoc(doc) }, this.indent(depth), this.renderChevron(false, true), this.renderDocIcon(), h("span", { class: "mrd-document-list__label" }, label), date && h("span", { class: "mrd-document-list__date" }, date)));
+    }
+    renderLoadingRow(depth) {
+        return (h("div", { class: "mrd-document-list__loading", key: "loading" }, this.indent(depth), h("span", { class: "mrd-document-list__spinner" }), t('loading', this.locale)));
+    }
+    renderChildren(container, node, depth) {
+        const out = [];
+        // Direct documents of this node (root docs live on the container node).
+        if (node.hasDocs) {
+            if (node.docsLoaded) {
+                for (const doc of node.docs)
+                    out.push(this.renderDocRow(doc, depth));
+            }
+            else if (node.loading) {
+                out.push(this.renderLoadingRow(depth));
+            }
+        }
+        // Child folders.
+        for (const child of node.children) {
+            out.push(this.renderFolderNode(container, child, depth));
+        }
+        return out;
+    }
+    renderFolderNode(container, node, depth) {
+        const leaf = node.children.length === 0 && !node.hasDocs;
+        return (h("div", { class: "mrd-document-list__node", key: node.id }, h("div", { class: "mrd-document-list__row", onClick: () => this.toggleFolder(container, node) }, this.indent(depth), this.renderChevron(node.open, leaf), this.renderFolderIcon(), h("span", { class: "mrd-document-list__label" }, node.label), h("span", { class: "mrd-document-list__count" }, node.totalCount)), node.open && h("div", { class: "mrd-document-list__kids" }, this.renderChildren(container, node, depth + 1))));
+    }
+    renderContainerNode(node, depth) {
+        return (h("div", { class: "mrd-document-list__node", key: node.id }, h("div", { class: "mrd-document-list__row mrd-document-list__row--dossier", onClick: () => this.toggleContainer(node) }, this.indent(depth), this.renderChevron(node.open, false), this.renderDossierIcon(), h("span", { class: "mrd-document-list__label" }, node.label), h("span", { class: "mrd-document-list__count" }, node.totalCount)), node.open && (h("div", { class: "mrd-document-list__kids" }, node.loading && !node.foldersLoaded
+            ? this.renderLoadingRow(depth + 1)
+            : this.renderChildren(node, node, depth + 1)))));
+    }
+    render() {
+        let body;
+        if (this.rootLoading) {
+            body = this.renderLoadingRow(0);
+        }
+        else if (this.containers.length === 0) {
+            body = h("div", { key: '0c4190bb86543e2d37cc1584b3495eb6eab5664c', class: "mrd-document-list__empty" }, t('no_results', this.locale));
+        }
+        else if (this.singleContainer) {
+            // Dossier context: render the single container's folder tree at the root.
+            const only = this.containers[0];
+            body = only.loading && !only.foldersLoaded
+                ? this.renderLoadingRow(0)
+                : this.renderChildren(only, only, 0);
+        }
+        else {
+            body = this.containers.map(c => this.renderContainerNode(c, 0));
+        }
+        return (h(Host, { key: '4e38d9ef5a1df137a41516a47dc5debbea6b2f35' }, h("div", { key: '6d2f162624e5bbc8650a2978a3b045c21fe13ea3', class: "mrd-document-list" }, body)));
+    }
+    get el() { return getElement(this); }
+};
+/** Root sentinel id for the container-level distinct request. */
+MrdDocumentList.ROOT = '__root__';
+MrdDocumentList.style = mrdDocumentListScss();
+
+const mrdDocumentViewScss = () => `.sc-mrd-document-view-h{display:block}.mrd-document-view.sc-mrd-document-view{max-width:720px}.mrd-document-view__crumb.sc-mrd-document-view{display:inline-flex;align-items:center;gap:var(--mrd-space-2);margin-bottom:var(--mrd-space-4);padding:var(--mrd-space-1) var(--mrd-space-3);background:var(--mrd-color-primary-light);border:1px solid transparent;border-radius:var(--mrd-border-radius);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-primary-dark);cursor:pointer}.mrd-document-view__crumb.sc-mrd-document-view:hover{border-color:var(--mrd-color-primary)}.mrd-document-view__crumb-icon.sc-mrd-document-view{width:0.875rem;height:0.875rem;flex-shrink:0}.mrd-document-view__title.sc-mrd-document-view{font-size:var(--mrd-font-size-2xl);font-weight:var(--mrd-font-weight-bold);color:var(--mrd-color-neutral-900);letter-spacing:-0.02em;margin:0 0 var(--mrd-space-1) 0}.mrd-document-view__date.sc-mrd-document-view{font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-400);font-variant-numeric:tabular-nums;margin:0 0 var(--mrd-space-6) 0}.mrd-document-view__file.sc-mrd-document-view{display:flex;align-items:center;gap:var(--mrd-space-4);padding:var(--mrd-space-4);border:1px solid var(--mrd-border-color);border-radius:var(--mrd-border-radius-md);background:var(--mrd-color-neutral-50);margin-bottom:var(--mrd-space-6)}.mrd-document-view__file-preview.sc-mrd-document-view{width:2.875rem;height:3.625rem;flex-shrink:0;display:grid;place-items:center;border-radius:var(--mrd-border-radius-sm);background:var(--mrd-color-white);border:1px solid var(--mrd-border-color);color:var(--mrd-color-danger);box-shadow:var(--mrd-shadow-sm)}.mrd-document-view__file-preview.sc-mrd-document-view svg.sc-mrd-document-view{width:1.5rem;height:1.5rem}.mrd-document-view__file-meta.sc-mrd-document-view{flex:1;min-width:0}.mrd-document-view__file-name.sc-mrd-document-view{font-weight:var(--mrd-font-weight-semibold);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-800);word-break:break-word}.mrd-document-view__download.sc-mrd-document-view{display:inline-flex;align-items:center;gap:var(--mrd-space-2);flex-shrink:0;height:2rem;padding:0 var(--mrd-space-3);background:var(--mrd-color-white);border:1px solid var(--mrd-color-neutral-300);border-radius:var(--mrd-border-radius);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium);color:var(--mrd-color-neutral-700);cursor:pointer}.mrd-document-view__download.sc-mrd-document-view:hover{background:var(--mrd-color-neutral-100);color:var(--mrd-color-neutral-900)}.mrd-document-view__download.sc-mrd-document-view svg.sc-mrd-document-view{width:0.9375rem;height:0.9375rem}.mrd-document-view__summary-body.sc-mrd-document-view{font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-700);line-height:var(--mrd-line-height-relaxed)}`;
+
+const MrdDocumentView = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.mrdNavigate = createEvent(this, "mrdNavigate");
+        this.mrdDownload = createEvent(this, "mrdDownload");
+        /** The data record from the /data endpoint. Fields keyed by name; relations under `_links`. */
+        this.data = {};
+        this.locale = navigator.language;
+    }
+    /** Value of a value-slot: reads data[field] via the slot→field map. */
+    slotValue(slot) {
+        var _a, _b;
+        const field = (_b = (_a = this.archetype) === null || _a === void 0 ? void 0 : _a.slots) === null || _b === void 0 ? void 0 : _b[slot];
+        if (!field)
+            return undefined;
+        return this.data[field];
+    }
+    /** Relation link for a relation-slot: reads data._links[field]. */
+    slotLink(slot) {
+        var _a, _b, _c, _d;
+        const field = (_b = (_a = this.archetype) === null || _a === void 0 ? void 0 : _a.slots) === null || _b === void 0 ? void 0 : _b[slot];
+        if (!field)
+            return undefined;
+        const links = ((_d = (_c = this.data) === null || _c === void 0 ? void 0 : _c._links) !== null && _d !== void 0 ? _d : {});
+        return links[field];
+    }
+    renderContainer() {
+        const link = this.slotLink('container');
+        if (!(link === null || link === void 0 ? void 0 : link.href) || !link.name)
+            return null;
+        return (h("button", { class: "mrd-document-view__crumb", onClick: () => this.mrdNavigate.emit({ href: link.href, label: link.name }) }, h("svg", { class: "mrd-document-view__crumb-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { d: "M19 12H5M12 19l-7-7 7-7" })), link.name));
+    }
+    renderFile() {
+        var _a, _b;
+        const raw = this.slotValue('file');
+        if (!raw)
+            return null;
+        const href = (_a = raw === null || raw === void 0 ? void 0 : raw.href) !== null && _a !== void 0 ? _a : '';
+        const fileName = (_b = raw === null || raw === void 0 ? void 0 : raw.fileName) !== null && _b !== void 0 ? _b : String(raw);
+        return (h("div", { class: "mrd-document-view__file" }, h("div", { class: "mrd-document-view__file-preview", "aria-hidden": "true" }, h("svg", { viewBox: "0 0 24 24", fill: "currentColor" }, h("path", { d: "M6 2a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6H6zm7 1.5L18.5 9H13V3.5z" }))), h("div", { class: "mrd-document-view__file-meta" }, h("span", { class: "mrd-document-view__file-name" }, fileName)), href && (h("button", { class: "mrd-document-view__download", onClick: () => this.mrdDownload.emit({ href, fileName }) }, h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { d: "M12 3v12m0 0l-4-4m4 4l4-4M4 21h16" })), t('download', this.locale)))));
+    }
+    render() {
+        const titleRaw = this.slotValue('title');
+        const title = titleRaw != null && titleRaw !== '' ? String(titleRaw) : null;
+        const dateRaw = this.slotValue('date');
+        const date = dateRaw != null && dateRaw !== '' ? formatDate(dateRaw, this.locale) : null;
+        const summaryRaw = this.slotValue('summary');
+        const summary = summaryRaw != null && summaryRaw !== '' ? String(summaryRaw) : null;
+        return (h(Host, { key: 'b6c2dbc45d5cfe551ac16b43b1a152a0d793b794' }, h("div", { key: 'df70848b4aa54ea414ea5d577a600779ee002b13', class: "mrd-document-view" }, this.renderContainer(), title && h("h1", { key: '46ff550fccd6de02972c6ee77b3cd5e7e394481a', class: "mrd-document-view__title" }, title), date && h("p", { key: '501c75cfc78722bd486d4a1db366675a1c519264', class: "mrd-document-view__date" }, date), this.renderFile(), summary && (h("div", { key: 'ee4475d06e5ca81a760e0c9e1e4b5f32ed894d89', class: "mrd-document-view__summary" }, h("div", { key: '9d196abdcc56b84b2b07203d7e5167be196a342a', class: "mrd-document-view__summary-body", innerHTML: summary }))))));
+    }
+};
+MrdDocumentView.style = mrdDocumentViewScss();
+
 const mrdEmailFieldScss = () => `.sc-mrd-email-field-h{display:block}.mrd-email-field.sc-mrd-email-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-email-field__label.sc-mrd-email-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-email-field__label--required.sc-mrd-email-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-email-field__input.sc-mrd-email-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box}.mrd-email-field__input.sc-mrd-email-field::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-email-field__input.sc-mrd-email-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-email-field__input.sc-mrd-email-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-email-field__input--error.sc-mrd-email-field{border-color:var(--mrd-border-color-error)}.mrd-email-field__input--error.sc-mrd-email-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-email-field__error.sc-mrd-email-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}`;
 
 const MrdEmailField = class {
@@ -863,7 +1283,7 @@ const MrdEmailField = class {
     }
     render() {
         const hasError = !!this.error;
-        return (h(Host, { key: '851ec092957ab86e811b292eaabe29d04a600fe0' }, h("div", { key: '2d8969d60378f3161656369494549d682de8ec0e', class: "mrd-email-field" }, this.label && (h("label", { key: '7a35cc60d4804097e1a54f984c7da1829f6bbd11', class: `mrd-email-field__label${this.required ? ' mrd-email-field__label--required' : ''}` }, this.label)), h("input", { key: '1fc20e860aa021886f7ed522c3a0c8dd2cb1e093', class: `mrd-email-field__input${hasError ? ' mrd-email-field__input--error' : ''}`, type: "email", name: this.name, value: this.value, placeholder: this.placeholder || 'name@example.com', required: this.required, disabled: this.disabled, onInput: this.handleInput, onBlur: this.handleBlur }), hasError && h("span", { key: 'a44b3b41b7cd6b8c643cc64e6aadd884a2ba4961', class: "mrd-email-field__error" }, this.error))));
+        return (h(Host, { key: 'bf888feadb6585a845f6d610165e192e342be5d2' }, h("div", { key: 'ab43101242a92df1643d218c0d35bb7b80452fef', class: "mrd-email-field" }, this.label && (h("label", { key: '854c9bd733f5803616ab8b70f0316a7a8a82ffd4', class: `mrd-email-field__label${this.required ? ' mrd-email-field__label--required' : ''}` }, this.label)), h("input", { key: '39ed16119a2329fdc67db578dcc7bafc35f4acf0', class: `mrd-email-field__input${hasError ? ' mrd-email-field__input--error' : ''}`, type: "email", name: this.name, value: this.value, placeholder: this.placeholder || 'name@example.com', required: this.required, disabled: this.disabled, onInput: this.handleInput, onBlur: this.handleBlur }), hasError && h("span", { key: 'c5881e21a2314e5d339464b16982add69be9f68a', class: "mrd-email-field__error" }, this.error))));
     }
 };
 MrdEmailField.style = mrdEmailFieldScss();
@@ -1146,7 +1566,7 @@ const MrdFileField = class {
             hasError ? 'mrd-file-field__zone--error' : '',
             this.disabled || this.uploading ? 'mrd-file-field__zone--disabled' : '',
         ].filter(Boolean).join(' ');
-        return (h(Host, { key: '2090102df8169226c1e66f87cbc837296e4b55d4' }, h("div", { key: '7a37a09df1bfa2eaf28ed04c806ad5f7c0337bb0', class: "mrd-file-field" }, this.label && (h("label", { key: '8f1fcb8adbb66b792be902c7c548e50db99b6a53', class: `mrd-file-field__label${this.required ? ' mrd-file-field__label--required' : ''}` }, this.label)), h("div", { key: '66d992298f537b24d69ce3ead3dd229f6d124f3d', class: zoneClass, onClick: this.handleZoneClick, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("input", { key: '95ba6560e71ee08c6b2526802727b29a18cdc454', ref: el => (this.fileInputRef = el), class: "mrd-file-field__input", type: "file", name: this.name, accept: this.accept, disabled: this.disabled || this.uploading, required: this.required && !hasFile, onChange: this.handleInputChange }), hasFile ? (h("div", { class: "mrd-file-field__selected" }, this.uploading ? (h("span", { class: "mrd-file-field__spinner", "aria-label": t('loading', this.locale) })) : (h("svg", { class: "mrd-file-field__icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }), h("polyline", { points: "14 2 14 8 20 8" }))), h("span", { class: "mrd-file-field__filename" }, this.fileName), !this.uploading && (h("button", { class: "mrd-file-field__clear", type: "button", onClick: this.handleClear, "aria-label": t('clear', this.locale) }, "\u2715")))) : (h("div", { class: "mrd-file-field__prompt" }, h("svg", { class: "mrd-file-field__upload-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("polyline", { points: "16 16 12 12 8 16" }), h("line", { x1: "12", y1: "12", x2: "12", y2: "21" }), h("path", { d: "M20.39 18.39A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.3" })), h("span", null, t('drop_file_here', this.locale), ' ', h("span", { class: "mrd-file-field__browse" }, t('browse', this.locale)))))), hasError && h("span", { key: 'a6020e63bebb01e31a980a903f81badd486585aa', class: "mrd-file-field__error" }, this.error))));
+        return (h(Host, { key: '424a55ff5c141a51ed2e253a126e0046808cf1b1' }, h("div", { key: '49407e31c019a27bbaa3ccbc81cd4597d992d03a', class: "mrd-file-field" }, this.label && (h("label", { key: '0477b203f2b8df03cf9d11153bc547e9490800f7', class: `mrd-file-field__label${this.required ? ' mrd-file-field__label--required' : ''}` }, this.label)), h("div", { key: 'aff3e5f258cfa8320150048af0b0087081cbbc13', class: zoneClass, onClick: this.handleZoneClick, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("input", { key: 'ee4366f0c4b8871524288ca47c98b4749def0b81', ref: el => (this.fileInputRef = el), class: "mrd-file-field__input", type: "file", name: this.name, accept: this.accept, disabled: this.disabled || this.uploading, required: this.required && !hasFile, onChange: this.handleInputChange }), hasFile ? (h("div", { class: "mrd-file-field__selected" }, this.uploading ? (h("span", { class: "mrd-file-field__spinner", "aria-label": t('loading', this.locale) })) : (h("svg", { class: "mrd-file-field__icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }), h("polyline", { points: "14 2 14 8 20 8" }))), h("span", { class: "mrd-file-field__filename" }, this.fileName), !this.uploading && (h("button", { class: "mrd-file-field__clear", type: "button", onClick: this.handleClear, "aria-label": t('clear', this.locale) }, "\u2715")))) : (h("div", { class: "mrd-file-field__prompt" }, h("svg", { class: "mrd-file-field__upload-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("polyline", { points: "16 16 12 12 8 16" }), h("line", { x1: "12", y1: "12", x2: "12", y2: "21" }), h("path", { d: "M20.39 18.39A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.3" })), h("span", null, t('drop_file_here', this.locale), ' ', h("span", { class: "mrd-file-field__browse" }, t('browse', this.locale)))))), hasError && h("span", { key: 'b67b7770e194843a1b75caaff807ea14d62eba6a', class: "mrd-file-field__error" }, this.error))));
     }
     static get watchers() { return {
         "value": [{
@@ -1707,7 +2127,7 @@ const MrdImageField = class {
             hasError ? 'mrd-image-field__zone--error' : '',
             this.disabled || this.uploading ? 'mrd-image-field__zone--disabled' : '',
         ].filter(Boolean).join(' ');
-        return (h(Host, { key: '71be4c1df559cff87280cac30be58beab3149064' }, h("div", { key: '9d0811d87068ce258aca9b2c5223a5594af9f6a3', class: "mrd-image-field" }, this.label && (h("label", { key: '63e129db968a2edfcc04fcac466d908ba4715158', class: `mrd-image-field__label${this.required ? ' mrd-image-field__label--required' : ''}` }, this.label)), h("div", { key: 'c7e560ad4dda43499707a2d1771a8eb561653a1b', class: zoneClass, onClick: this.handleZoneClick, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("input", { key: 'd325ee1aa3baccd689cc579e4cfa21abe977a575', ref: el => (this.fileInputRef = el), class: "mrd-image-field__input", type: "file", name: this.name, accept: this.accept, disabled: this.disabled || this.uploading, required: this.required && !this.previewUrl, onChange: this.handleInputChange }), this.previewUrl ? (h("div", { class: "mrd-image-field__preview-container" }, h("div", { class: "mrd-image-field__preview-thumb" }, h("img", { class: "mrd-image-field__preview", src: this.previewUrl, alt: this.fileName }), this.uploading && h("div", { class: "mrd-image-field__preview-overlay" }, h("span", { class: "mrd-image-field__spinner" }))), h("div", { class: "mrd-image-field__preview-info" }, h("span", { class: "mrd-image-field__preview-name" }, this.fileName), this.uploading && (h("span", { class: "mrd-image-field__upload-status" }, t('loading', this.locale)))), !this.uploading && (h("button", { class: "mrd-image-field__clear", type: "button", onClick: this.handleClear, "aria-label": t('clear', this.locale) }, t('remove', this.locale))))) : (h("div", { class: "mrd-image-field__prompt" }, h("svg", { class: "mrd-image-field__upload-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }), h("circle", { cx: "8.5", cy: "8.5", r: "1.5" }), h("polyline", { points: "21 15 16 10 5 21" })), h("span", null, t('drop_file_here', this.locale), ' ', h("span", { class: "mrd-image-field__browse" }, t('browse', this.locale)))))), hasError && h("span", { key: 'b0442d6f5c07ef22443194b3f1a95d2dfc409c4e', class: "mrd-image-field__error" }, this.error))));
+        return (h(Host, { key: '105ebf20023291a1e5c8524eedba4f04573943cd' }, h("div", { key: '59e6fe3b81c2ec1c07db7aaba819d79d2525b21f', class: "mrd-image-field" }, this.label && (h("label", { key: '2f3815ad6fe3f35932a8cc4d625751935272b629', class: `mrd-image-field__label${this.required ? ' mrd-image-field__label--required' : ''}` }, this.label)), h("div", { key: '8b45fbf8d0a229110a53068620a316ab6d48dbb8', class: zoneClass, onClick: this.handleZoneClick, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("input", { key: 'b6039e85f3f456e7c8d8e7d4db29e111a7f6d8d9', ref: el => (this.fileInputRef = el), class: "mrd-image-field__input", type: "file", name: this.name, accept: this.accept, disabled: this.disabled || this.uploading, required: this.required && !this.previewUrl, onChange: this.handleInputChange }), this.previewUrl ? (h("div", { class: "mrd-image-field__preview-container" }, h("div", { class: "mrd-image-field__preview-thumb" }, h("img", { class: "mrd-image-field__preview", src: this.previewUrl, alt: this.fileName }), this.uploading && h("div", { class: "mrd-image-field__preview-overlay" }, h("span", { class: "mrd-image-field__spinner" }))), h("div", { class: "mrd-image-field__preview-info" }, h("span", { class: "mrd-image-field__preview-name" }, this.fileName), this.uploading && (h("span", { class: "mrd-image-field__upload-status" }, t('loading', this.locale)))), !this.uploading && (h("button", { class: "mrd-image-field__clear", type: "button", onClick: this.handleClear, "aria-label": t('clear', this.locale) }, t('remove', this.locale))))) : (h("div", { class: "mrd-image-field__prompt" }, h("svg", { class: "mrd-image-field__upload-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }), h("circle", { cx: "8.5", cy: "8.5", r: "1.5" }), h("polyline", { points: "21 15 16 10 5 21" })), h("span", null, t('drop_file_here', this.locale), ' ', h("span", { class: "mrd-image-field__browse" }, t('browse', this.locale)))))), hasError && h("span", { key: 'f53ade0f627f3c840bc133690d40034c12665b5c', class: "mrd-image-field__error" }, this.error))));
     }
     static get watchers() { return {
         "value": [{
@@ -1821,7 +2241,7 @@ class CellRenderer {
     }
 }
 
-const mrdLayoutSectionScss = () => `.mrd-layout-section.sc-mrd-layout-section{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-800)}.mrd-layout-section__field.sc-mrd-layout-section{display:grid;grid-template-columns:200px 1fr;align-items:baseline;gap:0 var(--mrd-space-2);padding:var(--mrd-space-1) 0}.mrd-layout-section__field-label.sc-mrd-layout-section{font-size:var(--mrd-font-size-xs);font-weight:var(--mrd-font-weight-normal);color:var(--mrd-color-neutral-500);padding-top:1px}.mrd-layout-section__field-value.sc-mrd-layout-section{font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium);color:var(--mrd-color-neutral-800);word-break:break-word;display:inline-flex;align-items:center;gap:var(--mrd-space-1)}.mrd-layout-section__history-wrap.sc-mrd-layout-section{position:relative;display:inline-flex;align-items:center}.mrd-layout-section__history-btn.sc-mrd-layout-section{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;padding:0;background:transparent;border:none;border-radius:var(--mrd-border-radius-sm);color:var(--mrd-color-neutral-400);cursor:pointer;flex-shrink:0;transition:color var(--mrd-transition-fast), background-color var(--mrd-transition-fast)}.mrd-layout-section__history-btn.sc-mrd-layout-section:hover{color:var(--mrd-color-neutral-700);background-color:var(--mrd-color-neutral-100)}.mrd-layout-section__history-btn.sc-mrd-layout-section:focus{outline:none;box-shadow:var(--mrd-shadow-focus)}.mrd-layout-section__history-icon.sc-mrd-layout-section{width:0.875rem;height:0.875rem}.mrd-layout-section__history-popover.sc-mrd-layout-section{position:absolute;top:calc(100% + 0.25rem);left:0;min-width:24rem;max-width:24rem;background-color:var(--mrd-color-white);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius-md);box-shadow:var(--mrd-shadow-md);padding:var(--mrd-space-1) 0;z-index:var(--mrd-z-dropdown)}.mrd-layout-section__history-entry.sc-mrd-layout-section{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-normal);color:var(--mrd-color-neutral-700);padding:var(--mrd-space-2) var(--mrd-space-3);line-height:var(--mrd-line-height-normal)}.mrd-layout-section__history-entry.sc-mrd-layout-section:not(:last-child){border-bottom:var(--mrd-border-width) solid var(--mrd-color-neutral-100)}.mrd-layout-section__field-header.sc-mrd-layout-section{font-size:var(--mrd-font-size-2xl);font-weight:var(--mrd-font-weight-bold);color:var(--mrd-color-neutral-900);margin:0 0 var(--mrd-space-4) 0;padding:0}.mrd-layout-section__header.sc-mrd-layout-section{font-size:var(--mrd-font-size-xl);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-800);margin:var(--mrd-space-4) 0 var(--mrd-space-2) 0;padding:0}.mrd-layout-section__text.sc-mrd-layout-section{font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-700);line-height:var(--mrd-line-height-relaxed);margin:var(--mrd-space-2) 0}.mrd-layout-section__navigate.sc-mrd-layout-section{display:inline-flex;align-items:center;gap:var(--mrd-space-2);padding:var(--mrd-space-2) var(--mrd-space-3);background:none;border:1px solid var(--mrd-color-neutral-300);border-radius:var(--mrd-border-radius);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-primary);cursor:pointer;margin:var(--mrd-space-2) 0}.mrd-layout-section__navigate.sc-mrd-layout-section:hover{background-color:var(--mrd-color-primary-light);border-color:var(--mrd-color-primary)}.mrd-layout-section__link.sc-mrd-layout-section{color:var(--mrd-color-primary);text-decoration:none}.mrd-layout-section__link.sc-mrd-layout-section:hover{text-decoration:underline}.mrd-layout-section__relation-link.sc-mrd-layout-section{background:none;border:none;padding:0;font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-primary);cursor:pointer;text-align:left}.mrd-layout-section__relation-link.sc-mrd-layout-section:hover{text-decoration:underline}.mrd-layout-section__download-link.sc-mrd-layout-section{display:inline-flex;align-items:center;gap:var(--mrd-space-1);background:none;border:none;padding:0;font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-primary);cursor:pointer;text-align:left}.mrd-layout-section__download-link.sc-mrd-layout-section:hover{text-decoration:underline;color:var(--mrd-color-primary-dark)}.mrd-layout-section__file-icon.sc-mrd-layout-section{flex-shrink:0;width:1rem;height:1rem}.mrd-layout-section__boolean--true.sc-mrd-layout-section{color:var(--mrd-color-success);font-weight:var(--mrd-font-weight-semibold)}.mrd-layout-section__boolean--false.sc-mrd-layout-section{color:var(--mrd-color-neutral-400)}.mrd-layout-section__field--block.sc-mrd-layout-section{grid-template-columns:1fr}.mrd-layout-section__badge.sc-mrd-layout-section{display:inline-block;font-size:var(--mrd-font-size-xs);font-weight:var(--mrd-font-weight-medium);padding:2px var(--mrd-space-3);border-radius:10px}.mrd-layout-section__badge-dot-row.sc-mrd-layout-section{display:inline-flex;align-items:center;gap:var(--mrd-space-2)}.mrd-layout-section__badge-dot.sc-mrd-layout-section{display:inline-block;width:10px;height:10px;border-radius:50%;flex-shrink:0}.mrd-layout-section__secret-masked.sc-mrd-layout-section{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-label-color);letter-spacing:0.15em;user-select:none;pointer-events:none}.mrd-layout-section__pre.sc-mrd-layout-section{font-family:var(--mrd-font-family-mono);font-size:var(--mrd-font-size-xs);background-color:var(--mrd-color-neutral-50);border:1px solid var(--mrd-color-neutral-200);border-radius:var(--mrd-border-radius);padding:var(--mrd-space-3);margin:0;max-height:calc(10 * 1.5 * var(--mrd-font-size-xs));overflow-x:auto;overflow-y:auto;white-space:pre-wrap;word-break:break-word}.mrd-layout-section__group.sc-mrd-layout-section{margin:var(--mrd-space-4) 0}.mrd-layout-section__group-title.sc-mrd-layout-section{font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-500);margin:0 0 var(--mrd-space-2) 0;padding-bottom:0;text-transform:uppercase;letter-spacing:0.05em}.mrd-layout-section__related-view.sc-mrd-layout-section{margin:var(--mrd-space-4) 0}.mrd-layout-section__related-view-title.sc-mrd-layout-section{font-size:var(--mrd-font-size-lg);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-800);margin:0 0 var(--mrd-space-3) 0}.mrd-layout-section__search.sc-mrd-layout-section{position:relative;margin:var(--mrd-space-2) 0}.mrd-layout-section__search-wrap.sc-mrd-layout-section{position:relative}.mrd-layout-section__search-icon.sc-mrd-layout-section{position:absolute;left:var(--mrd-input-padding-x);top:50%;transform:translateY(-50%);width:1rem;height:1rem;color:var(--mrd-color-neutral-400);pointer-events:none}.mrd-layout-section__search-input.sc-mrd-layout-section{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x) var(--mrd-input-padding-y) calc(var(--mrd-input-padding-x) + 1rem + var(--mrd-space-2));font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);outline:none;appearance:none;box-sizing:border-box}.mrd-layout-section__search-input.sc-mrd-layout-section:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-layout-section__search-input.sc-mrd-layout-section::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-layout-section__search-results.sc-mrd-layout-section{position:absolute;top:100%;left:0;right:0;background-color:var(--mrd-color-white);border:1px solid var(--mrd-color-neutral-300);border-top:none;border-radius:0 0 var(--mrd-border-radius) var(--mrd-border-radius);box-shadow:var(--mrd-shadow-sm);z-index:100;max-height:300px;overflow-y:auto;list-style:none;margin:0;padding:var(--mrd-space-1) 0}.mrd-layout-section__search-result.sc-mrd-layout-section{margin:0;padding:0}.mrd-layout-section__search-result-btn.sc-mrd-layout-section{display:flex;flex-direction:column;width:100%;padding:var(--mrd-space-2) var(--mrd-space-3);background:none;border:none;text-align:left;cursor:pointer;font-family:var(--mrd-font-family)}.mrd-layout-section__search-result-btn.sc-mrd-layout-section:hover{background-color:var(--mrd-color-primary-light)}.mrd-layout-section__search-result-label.sc-mrd-layout-section{font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium);color:var(--mrd-color-neutral-800)}.mrd-layout-section__search-result-desc.sc-mrd-layout-section{font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-500);margin-top:var(--mrd-space-1)}.mrd-layout-section__image-thumb-btn.sc-mrd-layout-section{background:none;border:none;padding:0;cursor:pointer;display:inline-block;border-radius:var(--mrd-border-radius);overflow:hidden;line-height:0}.mrd-layout-section__image-thumb-btn.sc-mrd-layout-section:hover .mrd-layout-section__image-thumb.sc-mrd-layout-section{opacity:0.85}.mrd-layout-section__image-thumb.sc-mrd-layout-section{display:block;max-width:160px;max-height:100px;border-radius:var(--mrd-border-radius);object-fit:cover;transition:opacity 0.15s}.mrd-layout-section__modal-backdrop.sc-mrd-layout-section{position:fixed;inset:0;background:rgba(0, 0, 0, 0.6);z-index:300;display:flex;align-items:center;justify-content:center}.mrd-layout-section__modal.sc-mrd-layout-section{position:relative;background:#fff;border-radius:var(--mrd-border-radius);padding:var(--mrd-space-3);max-width:min(90vw, 900px);max-height:90vh;display:flex;align-items:center;justify-content:center;box-shadow:var(--mrd-shadow-lg)}.mrd-layout-section__modal-close.sc-mrd-layout-section{position:absolute;top:var(--mrd-space-2);right:var(--mrd-space-2);background:rgba(0, 0, 0, 0.5);border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;font-size:var(--mrd-font-size-sm);line-height:1;z-index:1}.mrd-layout-section__modal-close.sc-mrd-layout-section:hover{background:rgba(0, 0, 0, 0.8)}.mrd-layout-section__modal-image.sc-mrd-layout-section{display:block;max-width:100%;max-height:calc(90vh - 2rem);border-radius:var(--mrd-border-radius);object-fit:contain}`;
+const mrdLayoutSectionScss = () => `.mrd-layout-section.sc-mrd-layout-section{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-800)}.mrd-layout-section__field.sc-mrd-layout-section{display:grid;grid-template-columns:200px 1fr;align-items:baseline;gap:0 var(--mrd-space-2);padding:var(--mrd-space-1) 0}.mrd-layout-section__field-label.sc-mrd-layout-section{font-size:var(--mrd-font-size-xs);font-weight:var(--mrd-font-weight-normal);color:var(--mrd-color-neutral-500);padding-top:1px}.mrd-layout-section__field-value.sc-mrd-layout-section{font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium);color:var(--mrd-color-neutral-800);word-break:break-word;display:inline-flex;align-items:center;gap:var(--mrd-space-1)}.mrd-layout-section__history-wrap.sc-mrd-layout-section{position:relative;display:inline-flex;align-items:center}.mrd-layout-section__history-btn.sc-mrd-layout-section{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;padding:0;background:transparent;border:none;border-radius:var(--mrd-border-radius-sm);color:var(--mrd-color-neutral-400);cursor:pointer;flex-shrink:0;transition:color var(--mrd-transition-fast), background-color var(--mrd-transition-fast)}.mrd-layout-section__history-btn.sc-mrd-layout-section:hover{color:var(--mrd-color-neutral-700);background-color:var(--mrd-color-neutral-100)}.mrd-layout-section__history-btn.sc-mrd-layout-section:focus{outline:none;box-shadow:var(--mrd-shadow-focus)}.mrd-layout-section__history-icon.sc-mrd-layout-section{width:0.875rem;height:0.875rem}.mrd-layout-section__history-popover.sc-mrd-layout-section{position:absolute;top:calc(100% + 0.25rem);left:0;min-width:24rem;max-width:24rem;background-color:var(--mrd-color-white);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius-md);box-shadow:var(--mrd-shadow-md);padding:var(--mrd-space-1) 0;z-index:var(--mrd-z-dropdown)}.mrd-layout-section__history-entry.sc-mrd-layout-section{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-normal);color:var(--mrd-color-neutral-700);padding:var(--mrd-space-2) var(--mrd-space-3);line-height:var(--mrd-line-height-normal)}.mrd-layout-section__history-entry.sc-mrd-layout-section:not(:last-child){border-bottom:var(--mrd-border-width) solid var(--mrd-color-neutral-100)}.mrd-layout-section__field-header.sc-mrd-layout-section{font-size:var(--mrd-font-size-2xl);font-weight:var(--mrd-font-weight-bold);color:var(--mrd-color-neutral-900);margin:0 0 var(--mrd-space-4) 0;padding:0}.mrd-layout-section__header.sc-mrd-layout-section{font-size:var(--mrd-font-size-xl);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-800);margin:var(--mrd-space-4) 0 var(--mrd-space-2) 0;padding:0}.mrd-layout-section__text.sc-mrd-layout-section{font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-700);line-height:var(--mrd-line-height-relaxed);margin:var(--mrd-space-2) 0}.mrd-layout-section__navigate.sc-mrd-layout-section{display:inline-flex;align-items:center;gap:var(--mrd-space-2);padding:var(--mrd-space-2) var(--mrd-space-3);background:none;border:1px solid var(--mrd-color-neutral-300);border-radius:var(--mrd-border-radius);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-primary);cursor:pointer;margin:var(--mrd-space-2) 0}.mrd-layout-section__navigate.sc-mrd-layout-section:hover{background-color:var(--mrd-color-primary-light);border-color:var(--mrd-color-primary)}.mrd-layout-section__link.sc-mrd-layout-section{color:var(--mrd-color-primary);text-decoration:none}.mrd-layout-section__link.sc-mrd-layout-section:hover{text-decoration:underline}.mrd-layout-section__relation-link.sc-mrd-layout-section{background:none;border:none;padding:0;font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-primary);cursor:pointer;text-align:left}.mrd-layout-section__relation-link.sc-mrd-layout-section:hover{text-decoration:underline}.mrd-layout-section__download-link.sc-mrd-layout-section{display:inline-flex;align-items:center;gap:var(--mrd-space-1);background:none;border:none;padding:0;font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-primary);cursor:pointer;text-align:left}.mrd-layout-section__download-link.sc-mrd-layout-section:hover{text-decoration:underline;color:var(--mrd-color-primary-dark)}.mrd-layout-section__file-icon.sc-mrd-layout-section{flex-shrink:0;width:1rem;height:1rem}.mrd-layout-section__boolean--true.sc-mrd-layout-section{color:var(--mrd-color-success);font-weight:var(--mrd-font-weight-semibold)}.mrd-layout-section__boolean--false.sc-mrd-layout-section{color:var(--mrd-color-neutral-400)}.mrd-layout-section__field--block.sc-mrd-layout-section{grid-template-columns:1fr}.mrd-layout-section__badge.sc-mrd-layout-section{display:inline-block;font-size:var(--mrd-font-size-xs);font-weight:var(--mrd-font-weight-medium);padding:2px var(--mrd-space-3);border-radius:10px}.mrd-layout-section__badge-dot-row.sc-mrd-layout-section{display:inline-flex;align-items:center;gap:var(--mrd-space-2)}.mrd-layout-section__badge-dot.sc-mrd-layout-section{display:inline-block;width:10px;height:10px;border-radius:50%;flex-shrink:0}.mrd-layout-section__secret-masked.sc-mrd-layout-section{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-label-color);letter-spacing:0.15em;user-select:none;pointer-events:none}.mrd-layout-section__pre.sc-mrd-layout-section{font-family:var(--mrd-font-family-mono);font-size:var(--mrd-font-size-xs);background-color:var(--mrd-color-neutral-50);border:1px solid var(--mrd-color-neutral-200);border-radius:var(--mrd-border-radius);padding:var(--mrd-space-3);margin:0;max-height:calc(10 * 1.5 * var(--mrd-font-size-xs));overflow-x:auto;overflow-y:auto;white-space:pre-wrap;word-break:break-word}.mrd-layout-section__group.sc-mrd-layout-section{margin:var(--mrd-space-4) 0}.mrd-layout-section__group-title.sc-mrd-layout-section{font-size:var(--mrd-font-size-xs);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-500);margin:0 0 var(--mrd-space-2) 0;padding-bottom:0;letter-spacing:0.01em}.mrd-layout-section__related-view.sc-mrd-layout-section{margin:var(--mrd-space-4) 0}.mrd-layout-section__related-view-title.sc-mrd-layout-section{font-size:var(--mrd-font-size-lg);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-800);margin:0 0 var(--mrd-space-3) 0}.mrd-layout-section__doc-toolbar.sc-mrd-layout-section{display:flex;align-items:center;justify-content:flex-end;gap:var(--mrd-space-2);padding:var(--mrd-space-2) 0}.mrd-layout-section__seg.sc-mrd-layout-section{display:inline-flex;gap:2px;padding:2px;background:var(--mrd-color-neutral-100);border-radius:var(--mrd-border-radius)}.mrd-layout-section__seg-btn.sc-mrd-layout-section{width:1.875rem;height:1.625rem;display:grid;place-items:center;border:none;background:none;border-radius:var(--mrd-border-radius-sm);color:var(--mrd-color-neutral-500);cursor:pointer;transition:color var(--mrd-transition-fast), background var(--mrd-transition-fast)}.mrd-layout-section__seg-btn.sc-mrd-layout-section:hover{color:var(--mrd-color-neutral-800)}.mrd-layout-section__seg-btn[aria-pressed='true'].sc-mrd-layout-section{background:var(--mrd-color-white);color:var(--mrd-color-primary-dark);box-shadow:var(--mrd-shadow-sm)}.mrd-layout-section__seg-btn.sc-mrd-layout-section svg.sc-mrd-layout-section{width:1rem;height:1rem}.mrd-layout-section__search.sc-mrd-layout-section{position:relative;margin:var(--mrd-space-2) 0}.mrd-layout-section__search-wrap.sc-mrd-layout-section{position:relative}.mrd-layout-section__search-icon.sc-mrd-layout-section{position:absolute;left:var(--mrd-input-padding-x);top:50%;transform:translateY(-50%);width:1rem;height:1rem;color:var(--mrd-color-neutral-400);pointer-events:none}.mrd-layout-section__search-input.sc-mrd-layout-section{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x) var(--mrd-input-padding-y) calc(var(--mrd-input-padding-x) + 1rem + var(--mrd-space-2));font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);outline:none;appearance:none;box-sizing:border-box}.mrd-layout-section__search-input.sc-mrd-layout-section:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-layout-section__search-input.sc-mrd-layout-section::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-layout-section__search-results.sc-mrd-layout-section{position:absolute;top:100%;left:0;right:0;background-color:var(--mrd-color-white);border:1px solid var(--mrd-color-neutral-300);border-top:none;border-radius:0 0 var(--mrd-border-radius) var(--mrd-border-radius);box-shadow:var(--mrd-shadow-sm);z-index:100;max-height:300px;overflow-y:auto;list-style:none;margin:0;padding:var(--mrd-space-1) 0}.mrd-layout-section__search-result.sc-mrd-layout-section{margin:0;padding:0}.mrd-layout-section__search-result-btn.sc-mrd-layout-section{display:flex;flex-direction:column;width:100%;padding:var(--mrd-space-2) var(--mrd-space-3);background:none;border:none;text-align:left;cursor:pointer;font-family:var(--mrd-font-family)}.mrd-layout-section__search-result-btn.sc-mrd-layout-section:hover{background-color:var(--mrd-color-primary-light)}.mrd-layout-section__search-result-label.sc-mrd-layout-section{font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium);color:var(--mrd-color-neutral-800)}.mrd-layout-section__search-result-desc.sc-mrd-layout-section{font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-500);margin-top:var(--mrd-space-1)}.mrd-layout-section__image-thumb-btn.sc-mrd-layout-section{background:none;border:none;padding:0;cursor:pointer;display:inline-block;border-radius:var(--mrd-border-radius);overflow:hidden;line-height:0}.mrd-layout-section__image-thumb-btn.sc-mrd-layout-section:hover .mrd-layout-section__image-thumb.sc-mrd-layout-section{opacity:0.85}.mrd-layout-section__image-thumb.sc-mrd-layout-section{display:block;max-width:160px;max-height:100px;border-radius:var(--mrd-border-radius);object-fit:cover;transition:opacity 0.15s}.mrd-layout-section__modal-backdrop.sc-mrd-layout-section{position:fixed;inset:0;background:rgba(0, 0, 0, 0.6);z-index:300;display:flex;align-items:center;justify-content:center}.mrd-layout-section__modal.sc-mrd-layout-section{position:relative;background:#fff;border-radius:var(--mrd-border-radius);padding:var(--mrd-space-3);max-width:min(90vw, 900px);max-height:90vh;display:flex;align-items:center;justify-content:center;box-shadow:var(--mrd-shadow-lg)}.mrd-layout-section__modal-close.sc-mrd-layout-section{position:absolute;top:var(--mrd-space-2);right:var(--mrd-space-2);background:rgba(0, 0, 0, 0.5);border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;font-size:var(--mrd-font-size-sm);line-height:1;z-index:1}.mrd-layout-section__modal-close.sc-mrd-layout-section:hover{background:rgba(0, 0, 0, 0.8)}.mrd-layout-section__modal-image.sc-mrd-layout-section{display:block;max-width:100%;max-height:calc(90vh - 2rem);border-radius:var(--mrd-border-radius);object-fit:contain}`;
 
 const MrdLayoutSection = class {
     constructor(hostRef) {
@@ -1833,6 +2253,7 @@ const MrdLayoutSection = class {
         this.mrdLoadImage = createEvent(this, "mrdLoadImage");
         this.mrdViewAction = createEvent(this, "mrdViewAction");
         this.mrdLoadViewAggregations = createEvent(this, "mrdLoadViewAggregations");
+        this.mrdLoadViewDistinct = createEvent(this, "mrdLoadViewDistinct");
         /** Items from one layout entry in ClientDashboardMetadata.layouts[]. */
         this.items = [];
         /** Record data object; keys are field names, _links holds relation and related-view links. */
@@ -1842,11 +2263,16 @@ const MrdLayoutSection = class {
         /** Legacy: top-level _links from ClientDashboardMetadata. Not needed in new flat format. */
         this.links = {};
         this.locale = navigator.language;
+        /** Top-level archetypes on the object dashboard. When it contains commons.document,
+         *  the record is rendered as a single-document view instead of generic fields. */
+        this.archetypes = [];
         this.searchQueryMap = {};
         this.searchResultsMap = {};
         this.imagePreviewUrl = null;
         this.imagePreviews = {};
         this.openHistoryField = null;
+        /** Per-view display mode for document collection views. Default 'tree'. */
+        this.docViewMode = {};
         this.historyClickOutside = null;
         this.searchTimers = {};
         this.handleViewLoadPage = (e, name) => {
@@ -1930,11 +2356,18 @@ const MrdLayoutSection = class {
         }
     }
     /**
-     * Inject data into an embedded mrd-table for a RELATED_VIEW or VIEW item.
-     * Pass totalElements to update the pagination total (safe to pass on every page).
-     * Pass hasNext (from _links.next presence) so the table can decide whether to emit aggregations.
+     * Inject rows for a VIEW / RELATED_VIEW item.
+     * - Table view: injects the page into the embedded mrd-table (pass totalElements/hasNext).
+     * - Document view: pass `nodeId` to route the rows to that folder node in the embedded
+     *   mrd-document-list. Folder loading is just a filtered list load, so it reuses this method.
      */
-    async setViewPage(name, page, rows, totalElements, hasNext) {
+    async setViewPage(name, page, rows, totalElements, hasNext, nodeId) {
+        if (nodeId) {
+            const list = this.el.querySelector(`mrd-document-list[data-doclist="${name}"]`);
+            if (list === null || list === void 0 ? void 0 : list.setDocuments)
+                await list.setDocuments(nodeId, rows);
+            return;
+        }
         const table = this.el.querySelector(`mrd-table[data-view="${name}"]`);
         if (!table)
             return;
@@ -1950,6 +2383,12 @@ const MrdLayoutSection = class {
             return;
         await table.setAggregations(data);
     }
+    /** Inject distinct values into an embedded mrd-document-list for a document view. */
+    async setViewDistinct(name, nodeId, values) {
+        const list = this.el.querySelector(`mrd-document-list[data-doclist="${name}"]`);
+        if (list === null || list === void 0 ? void 0 : list.setDistinct)
+            await list.setDistinct(nodeId, values);
+    }
     /** Provide a resolved URL for an IMAGE field. Shows as thumbnail; clicking opens the lightbox. */
     async setImagePreview(fieldName, url) {
         this.imagePreviews = Object.assign(Object.assign({}, this.imagePreviews), { [fieldName]: url });
@@ -2098,7 +2537,7 @@ const MrdLayoutSection = class {
         return (h("div", { class: "mrd-layout-section__search", key: `search-${dataClass}` }, h("div", { class: "mrd-layout-section__search-wrap" }, h("svg", { class: "mrd-layout-section__search-icon", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true" }, h("path", { "fill-rule": "evenodd", d: "M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z", "clip-rule": "evenodd" })), h("input", { class: "mrd-layout-section__search-input", type: "text", value: query, placeholder: (_c = item.label) !== null && _c !== void 0 ? _c : '', onInput: e => this.handleSearchInput(dataClass, e.target.value) })), results.length > 0 && (h("ul", { class: "mrd-layout-section__search-results" }, results.map(r => (h("li", { key: r.id, class: "mrd-layout-section__search-result" }, h("button", { class: "mrd-layout-section__search-result-btn", onClick: () => this.mrdNavigate.emit({ href: r.id, label: r.label }) }, h("span", { class: "mrd-layout-section__search-result-label" }, r.label), r.description && h("span", { class: "mrd-layout-section__search-result-desc" }, r.description)))))))));
     }
     renderRelatedView(item) {
-        var _a, _b, _c, _d, _e, _f;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
         const key = this.viewKeyFor(item);
         if (!key)
             return null;
@@ -2108,7 +2547,32 @@ const MrdLayoutSection = class {
         // Extract parentId from data._links.self.href for RELATED_VIEW path construction
         const selfHref = (_e = (_d = (_c = (_b = this.data) === null || _b === void 0 ? void 0 : _b._links) === null || _c === void 0 ? void 0 : _c.self) === null || _d === void 0 ? void 0 : _d.href) !== null && _e !== void 0 ? _e : '';
         const parentId = (_f = selfHref.split('/').filter(Boolean).pop()) !== null && _f !== void 0 ? _f : '';
-        return (h("div", { class: "mrd-layout-section__related-view", key: `view-${key}` }, showTitle && item.label && h("h3", { class: "mrd-layout-section__related-view-title" }, item.label), h("mrd-table", { "data-view": key, item: item, parentId: parentId, locale: this.locale, onMrdLoadPage: (e) => this.handleViewLoadPage(e, key), onMrdLoadAggregations: (e) => {
+        // The API publishes `archetypes` on the VIEW/RELATED_VIEW item itself
+        // (sibling of `view`), not inside `view`.
+        const docArchetype = resolveArchetype((_g = item.archetypes) !== null && _g !== void 0 ? _g : (_h = item.view) === null || _h === void 0 ? void 0 : _h.archetypes, ARCHETYPE_DOCUMENT);
+        const mode = (_j = this.docViewMode[key]) !== null && _j !== void 0 ? _j : 'tree';
+        return (h("div", { class: "mrd-layout-section__related-view", key: `view-${key}` }, showTitle && item.label && h("h3", { class: "mrd-layout-section__related-view-title" }, item.label), docArchetype && this.renderDocToolbar(key, mode), docArchetype && mode === 'tree'
+            ? this.renderDocumentList(item, key, parentId, docArchetype)
+            : this.renderTable(item, key, parentId)));
+    }
+    /** Tree / list segmented toggle for document collection views (+ upload placeholder). */
+    renderDocToolbar(key, mode) {
+        return (h("div", { class: "mrd-layout-section__doc-toolbar" }, h("div", { class: "mrd-layout-section__seg", role: "group", "aria-label": t('doc_view_switch', this.locale) }, h("button", { class: "mrd-layout-section__seg-btn", "aria-pressed": String(mode === 'tree'), title: t('doc_view_tree', this.locale), "aria-label": t('doc_view_tree', this.locale), onClick: () => { this.docViewMode = Object.assign(Object.assign({}, this.docViewMode), { [key]: 'tree' }); } }, h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { d: "M3 5h6M3 12h9M3 19h6" }), h("circle", { cx: "18", cy: "5", r: "1.6" }), h("circle", { cx: "18", cy: "19", r: "1.6" }), h("path", { d: "M16 12h4" }))), h("button", { class: "mrd-layout-section__seg-btn", "aria-pressed": String(mode === 'list'), title: t('doc_view_list', this.locale), "aria-label": t('doc_view_list', this.locale), onClick: () => { this.docViewMode = Object.assign(Object.assign({}, this.docViewMode), { [key]: 'list' }); } }, h("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { d: "M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01" }))))));
+    }
+    renderDocumentList(item, key, parentId, archetype) {
+        return (h("mrd-document-list", { "data-doclist": key, item: item, archetype: archetype, parentId: parentId, locale: this.locale, onMrdLoadDistinct: (e) => {
+                e.stopPropagation();
+                this.mrdLoadViewDistinct.emit(Object.assign({ name: key }, e.detail));
+            }, onMrdLoadPage: (e) => {
+                e.stopPropagation();
+                this.mrdLoadViewPage.emit(Object.assign({ name: key }, e.detail));
+            }, onMrdNavigate: (e) => {
+                e.stopPropagation();
+                this.mrdNavigate.emit(e.detail);
+            } }));
+    }
+    renderTable(item, key, parentId) {
+        return (h("mrd-table", { "data-view": key, item: item, parentId: parentId, locale: this.locale, onMrdLoadPage: (e) => this.handleViewLoadPage(e, key), onMrdLoadAggregations: (e) => {
                 var _a;
                 e.stopPropagation();
                 this.mrdLoadViewAggregations.emit(Object.assign({ name: key, dataClass: (_a = item.dataClass) !== null && _a !== void 0 ? _a : key }, e.detail));
@@ -2129,7 +2593,7 @@ const MrdLayoutSection = class {
                     parentPath: e.detail.parentPath,
                     basicType: e.detail.basicType,
                 });
-            } })));
+            } }));
     }
     renderItem(item) {
         var _a, _b;
@@ -2161,8 +2625,23 @@ const MrdLayoutSection = class {
             return null;
         return (h("div", { class: "mrd-layout-section__modal-backdrop", onClick: () => { this.imagePreviewUrl = null; } }, h("div", { class: "mrd-layout-section__modal", onClick: (e) => e.stopPropagation() }, h("button", { class: "mrd-layout-section__modal-close", onClick: () => { this.imagePreviewUrl = null; } }, "\u2715"), h("img", { class: "mrd-layout-section__modal-image", src: this.imagePreviewUrl, alt: "" }))));
     }
+    /** Single-document view: the record's own type carries commons.document. Renders
+     *  a recognisable document instead of generic fields, keeping any related views/
+     *  searches below it. */
+    renderDocumentObject(archetype) {
+        const related = this.items.filter(it => it.type === ClientLayoutItemType.VIEW ||
+            it.type === ClientLayoutItemType.RELATED_VIEW ||
+            it.type === ClientLayoutItemType.SEARCH);
+        return [
+            h("mrd-document-view", { archetype: archetype, data: this.data, locale: this.locale, onMrdNavigate: (e) => { e.stopPropagation(); this.mrdNavigate.emit(e.detail); }, onMrdDownload: (e) => { e.stopPropagation(); this.mrdDownload.emit(e.detail); } }),
+            ...related.map(it => this.renderItem(it)),
+        ];
+    }
     render() {
-        return (h(Host, { key: '39d21b05016b901ff73a90dc0c6ef04cc30b4d42' }, h("div", { key: '546d956676d66438930665e97c2ed618fb8d1d4c', class: "mrd-layout-section" }, this.items.map(item => this.renderItem(item))), this.renderImageModal()));
+        const docArchetype = resolveArchetype(this.archetypes, ARCHETYPE_DOCUMENT);
+        return (h(Host, { key: '4fbba410f9b8cab2bf21497467f99ff25f109bcc' }, h("div", { key: '679d2c34f1eaff694873ba18d679cbccecdae1a6', class: "mrd-layout-section" }, docArchetype
+            ? this.renderDocumentObject(docArchetype)
+            : this.items.map(item => this.renderItem(item))), this.renderImageModal()));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -2302,7 +2781,7 @@ const MrdLongtextField = class {
     }
     render() {
         const hasError = !!this.error;
-        return (h(Host, { key: '10d998b80f54cf7b10be26bf451d808c78579e69' }, h("div", { key: 'af45fe94a41f668bf6ddca670b42e065ee83ef23', class: "mrd-longtext-field" }, this.label && (h("label", { key: '31a08490d695ac9f4bbe5dff6a1ae3bb2a94337d', class: `mrd-longtext-field__label${this.required ? ' mrd-longtext-field__label--required' : ''}` }, this.label)), this.disabled ? (h("pre", { class: "mrd-longtext-field__content" }, this.value)) : (h("textarea", { class: `mrd-longtext-field__input${hasError ? ' mrd-longtext-field__input--error' : ''}`, name: this.name, placeholder: this.placeholder, required: this.required, rows: 10, onInput: this.handleInput, onBlur: this.handleBlur }, this.value)), hasError && h("span", { key: '7f133e72a882a8aaf33245445829754da1e6377b', class: "mrd-longtext-field__error" }, this.error))));
+        return (h(Host, { key: '624be9369a37f0901ada13bd0e8a3bb8b40f54c8' }, h("div", { key: '6544e7b10af59a5628a119d5ea907fb968f21d42', class: "mrd-longtext-field" }, this.label && (h("label", { key: 'd56386e3fc2984b522bcbf5ec6908e044ed6f3d3', class: `mrd-longtext-field__label${this.required ? ' mrd-longtext-field__label--required' : ''}` }, this.label)), this.disabled ? (h("pre", { class: "mrd-longtext-field__content" }, this.value)) : (h("textarea", { class: `mrd-longtext-field__input${hasError ? ' mrd-longtext-field__input--error' : ''}`, name: this.name, placeholder: this.placeholder, required: this.required, rows: 10, onInput: this.handleInput, onBlur: this.handleBlur }, this.value)), hasError && h("span", { key: '9423d70dec9c6439cc629746f1038a61a14da5e4', class: "mrd-longtext-field__error" }, this.error))));
     }
 };
 MrdLongtextField.style = mrdLongtextFieldScss();
@@ -2378,7 +2857,7 @@ const MrdNumberField = class {
         const hasError = !!this.error;
         const suffix = this.dataType === ClientLayoutItemFieldDataType.PERCENTAGE ? '%' :
             this.dataType === ClientLayoutItemFieldDataType.DECIMAL ? '' : '';
-        return (h(Host, { key: '195beed4d6453597320b79654feaabe8f742eff2' }, h("div", { key: 'c641d7a4d27ba28dd34acda98d38f245945d20bb', class: "mrd-number-field" }, this.label && (h("label", { key: '2a5f6eb48889a3ab0aa76d6b2ca5d59b20625bb2', class: `mrd-number-field__label${this.required ? ' mrd-number-field__label--required' : ''}` }, this.label)), h("div", { key: 'a844b89e6a278629a8aefa4ac72e5e18e5904cab', class: "mrd-number-field__input-wrapper" }, h("input", { key: '1ce9c3d67b458601a0de95b3b8478ef05df73069', class: `mrd-number-field__input${hasError ? ' mrd-number-field__input--error' : ''}`, type: "text", inputMode: "decimal", name: this.name, value: this.displayValue, placeholder: this.placeholder || (suffix ? `0${suffix}` : '0'), required: this.required, disabled: this.disabled, onInput: this.handleInput, onBlur: this.handleBlur, onFocus: this.handleFocus })), hasError && h("span", { key: '4226614a65a8d27543d1287e2c1f61f67c427e63', class: "mrd-number-field__error" }, this.error))));
+        return (h(Host, { key: '2c844e94a7cbb3fcf33f9552329443260e9490ab' }, h("div", { key: 'b87bdc2a17552e74b27d6da16e4db9bfd2f7e4ac', class: "mrd-number-field" }, this.label && (h("label", { key: '4aca381054b0ce27c94a9a7c779642d44dbbebcc', class: `mrd-number-field__label${this.required ? ' mrd-number-field__label--required' : ''}` }, this.label)), h("div", { key: 'b7e8d122bfbd92152ce44a7ba56222425eed73f9', class: "mrd-number-field__input-wrapper" }, h("input", { key: '906330075f0b8a50ff45344e865217fd1938f199', class: `mrd-number-field__input${hasError ? ' mrd-number-field__input--error' : ''}`, type: "text", inputMode: "decimal", name: this.name, value: this.displayValue, placeholder: this.placeholder || (suffix ? `0${suffix}` : '0'), required: this.required, disabled: this.disabled, onInput: this.handleInput, onBlur: this.handleBlur, onFocus: this.handleFocus })), hasError && h("span", { key: '5f56d6f2e0a878703f35d50b1932a39a82dace3b', class: "mrd-number-field__error" }, this.error))));
     }
 };
 MrdNumberField.style = mrdNumberFieldScss();
@@ -2672,9 +3151,9 @@ const MrdSecretField = class {
     }
     render() {
         const hasError = !!this.error;
-        return (h(Host, { key: '08f1aa9d8ab9f4e41abb6d3286e5e383427a5409' }, h("div", { key: 'fabe38aa130e211cea81f2c2f227bc15ad3ebf7d', class: "mrd-secret-field" }, this.label && (h("label", { key: '69af8844eff8ce84daa622635c79130fb491eb0b', class: `mrd-secret-field__label${this.required ? ' mrd-secret-field__label--required' : ''}` }, this.label)), this.disabled
+        return (h(Host, { key: 'e0d516f7e76c1fab5441567cc371569a8eab07f8' }, h("div", { key: 'fac6fb517a0f37560429c828251f7db3841d3301', class: "mrd-secret-field" }, this.label && (h("label", { key: 'b2dd3189f2fcf3fd3feea741a39dbd5c3f4d437f', class: `mrd-secret-field__label${this.required ? ' mrd-secret-field__label--required' : ''}` }, this.label)), this.disabled
             ? (h("span", { class: "mrd-secret-field__masked", "aria-label": this.label }, this.value ? '••••••••' : ''))
-            : (h("input", { class: `mrd-secret-field__input${hasError ? ' mrd-secret-field__input--error' : ''}`, type: "password", name: this.name, value: this.value, placeholder: this.placeholder, required: this.required, autocomplete: "new-password", onInput: this.handleInput, onBlur: this.handleBlur })), hasError && h("span", { key: 'e602004f0bb10916d1015e3c2b003523a292997c', class: "mrd-secret-field__error" }, this.error))));
+            : (h("input", { class: `mrd-secret-field__input${hasError ? ' mrd-secret-field__input--error' : ''}`, type: "password", name: this.name, value: this.value, placeholder: this.placeholder, required: this.required, autocomplete: "new-password", onInput: this.handleInput, onBlur: this.handleBlur })), hasError && h("span", { key: 'dbd6667d7f2c6ed26220ac83a46235cf3ad777d7', class: "mrd-secret-field__error" }, this.error))));
     }
 };
 MrdSecretField.style = mrdSecretFieldScss();
@@ -3821,7 +4300,7 @@ const MrdTextField = class {
     }
     render() {
         const hasError = !!this.error;
-        return (h(Host, { key: 'fd4e1f389cb452ab80a1e1c7295d884ca935999e' }, h("div", { key: '7b7bde7a18fcd9b8d5779daab88ddabb45dd8692', class: "mrd-text-field" }, this.label && (h("label", { key: '8e2ad4053473cfad4eae4c4634b863ac5ef32fea', class: `mrd-text-field__label${this.required ? ' mrd-text-field__label--required' : ''}` }, this.label)), h("input", { key: 'd32712a6dc2aee4691bc4a580d5ca2ad81e0ff9f', class: `mrd-text-field__input${hasError ? ' mrd-text-field__input--error' : ''}`, type: "text", name: this.name, value: this.value, placeholder: this.placeholder, required: this.required, disabled: this.disabled, onInput: this.handleInput, onBlur: this.handleBlur }), hasError && h("span", { key: '31585dbf82020c81834e1eeada5cd9907a5ead56', class: "mrd-text-field__error" }, this.error))));
+        return (h(Host, { key: '124c46a83d30993aed5045eda42134d5c28ec989' }, h("div", { key: '5497fab2938f875fe9b4cd539a9feaaf907007e1', class: "mrd-text-field" }, this.label && (h("label", { key: '4d43255f45de8e7c4596a211797403479d2240b6', class: `mrd-text-field__label${this.required ? ' mrd-text-field__label--required' : ''}` }, this.label)), h("input", { key: 'df3d61fc60e41731e9783dc4484f3c3ca3ea8b13', class: `mrd-text-field__input${hasError ? ' mrd-text-field__input--error' : ''}`, type: "text", name: this.name, value: this.value, placeholder: this.placeholder, required: this.required, disabled: this.disabled, onInput: this.handleInput, onBlur: this.handleBlur }), hasError && h("span", { key: '9bf08d3a77d7616674caf3325b6598490f2d50fc', class: "mrd-text-field__error" }, this.error))));
     }
 };
 MrdTextField.style = mrdTextFieldScss();
@@ -3895,7 +4374,7 @@ const MrdTextareaField = class {
         }
     }
     render() {
-        return (h(Host, { key: 'e1fd819c598f01e3986946357ec18d608f2c7adc' }, h("div", { key: '20c28e54e61429655b2d4f297bd84e183ad7e971', class: "mrd-textarea-field" }, this.label && (h("label", { key: 'fa46a20badc35c931563600f24a32e0a8c8c07ad', class: `mrd-textarea-field__label${this.required ? ' mrd-textarea-field__label--required' : ''}` }, this.label)), h("div", { key: 'ee928eca0a1b85401b346b7fae8adbe9214a7664', class: `mrd-textarea-field__container${this.error ? ' mrd-textarea-field__container--error' : ''}` }, h("div", { key: '89b00f3c526623c47f0aff7ad862f70dfdc2fe15', class: "mrd-textarea-field__editor" })), this.error && h("span", { key: '458cf8fddee36ddbc384ce4d25765e5aacd3c9d5', class: "mrd-textarea-field__error" }, this.error))));
+        return (h(Host, { key: '2413906076dee3f48118d44574dadd36bcedadfe' }, h("div", { key: '59e369a54e906b09a1062c7c5f701b8bbd631479', class: "mrd-textarea-field" }, this.label && (h("label", { key: 'd400c499eb6e35581fc2af9d372917287fcc60eb', class: `mrd-textarea-field__label${this.required ? ' mrd-textarea-field__label--required' : ''}` }, this.label)), h("div", { key: '62765821b5280e71918db0d070a136ef07e1eecd', class: `mrd-textarea-field__container${this.error ? ' mrd-textarea-field__container--error' : ''}` }, h("div", { key: 'f41b73291542d4582c492bce0a89240a171aba32', class: "mrd-textarea-field__editor" })), this.error && h("span", { key: 'eaba5b735be7aa8deebfbc46eac03be970bb1d13', class: "mrd-textarea-field__error" }, this.error))));
     }
     get el() { return getElement(this); }
 };
@@ -3932,9 +4411,9 @@ const MrdTimeField = class {
     }
     render() {
         const hasError = !!this.error;
-        return (h(Host, { key: 'c507996709437d8982f9175b286e25598997002d' }, h("div", { key: 'd5f1b7f14d26cae8298cd40491898b39044158f8', class: "mrd-time-field" }, this.label && (h("label", { key: '10976e18df09240e00b045314c4ddd3845d4bfdc', class: `mrd-time-field__label${this.required ? ' mrd-time-field__label--required' : ''}` }, this.label)), h("input", { key: 'bc557333f107a371a7005f9b56dd0395190e63d7', class: `mrd-time-field__input${hasError ? ' mrd-time-field__input--error' : ''}`, type: "time", name: this.name, value: this.value, required: this.required, disabled: this.disabled, onChange: this.handleChange, onBlur: this.handleBlur }), hasError && h("span", { key: 'b5a09c2aa063fa9e2fc3aba411e86b57d879c408', class: "mrd-time-field__error" }, this.error))));
+        return (h(Host, { key: 'e93a6492a7bdc17f04f5aac0b8ecd63435a6280f' }, h("div", { key: 'b9692c11f21ccd354ba5475e1a60e6afc8ead22e', class: "mrd-time-field" }, this.label && (h("label", { key: '668492f16b6b96065fe65204a4f053c2ef2796e5', class: `mrd-time-field__label${this.required ? ' mrd-time-field__label--required' : ''}` }, this.label)), h("input", { key: 'bd2df39240c42b4a337554b0747c7b89eb5d8760', class: `mrd-time-field__input${hasError ? ' mrd-time-field__input--error' : ''}`, type: "time", name: this.name, value: this.value, required: this.required, disabled: this.disabled, onChange: this.handleChange, onBlur: this.handleBlur }), hasError && h("span", { key: '19a81211f3b630436a379f785768d28ffa01c12c', class: "mrd-time-field__error" }, this.error))));
     }
 };
 MrdTimeField.style = mrdTimeFieldScss();
 
-export { MrdBooleanField as mrd_boolean_field, MrdCurrencyField as mrd_currency_field, MrdDateField as mrd_date_field, MrdDatetimeField as mrd_datetime_field, MrdEmailField as mrd_email_field, MrdField as mrd_field, MrdFileField as mrd_file_field, MrdForm as mrd_form, MrdHyperlinkField as mrd_hyperlink_field, MrdImageField as mrd_image_field, MrdLayoutSection as mrd_layout_section, MrdListField as mrd_list_field, MrdLongtextField as mrd_longtext_field, MrdNumberField as mrd_number_field, MrdRelationField as mrd_relation_field, MrdSecretField as mrd_secret_field, MrdTable as mrd_table, MrdTextField as mrd_text_field, MrdTextareaField as mrd_textarea_field, MrdTimeField as mrd_time_field };
+export { MrdBooleanField as mrd_boolean_field, MrdCurrencyField as mrd_currency_field, MrdDateField as mrd_date_field, MrdDatetimeField as mrd_datetime_field, MrdDocumentList as mrd_document_list, MrdDocumentView as mrd_document_view, MrdEmailField as mrd_email_field, MrdField as mrd_field, MrdFileField as mrd_file_field, MrdForm as mrd_form, MrdHyperlinkField as mrd_hyperlink_field, MrdImageField as mrd_image_field, MrdLayoutSection as mrd_layout_section, MrdListField as mrd_list_field, MrdLongtextField as mrd_longtext_field, MrdNumberField as mrd_number_field, MrdRelationField as mrd_relation_field, MrdSecretField as mrd_secret_field, MrdTable as mrd_table, MrdTextField as mrd_text_field, MrdTextareaField as mrd_textarea_field, MrdTimeField as mrd_time_field };