@mmlogic/components 0.5.2 → 0.5.4

package/dist/types/components.d.ts

@@ -5,14 +5,16 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { ClientLayout, ClientLayoutItem as ClientLayoutItem1, ClientLayoutItemFieldDataType, ClientLayoutItemRelationDisplayType, ClientLayoutItemRelationEditBehavior, ClientListValue, CurrencyValue, RelationSearchResult } from "./types";
-import { AggregationResult, ClientArchetype, ClientLayoutItem, ClientLayoutItemNavigate, ClientLayoutNavigateBehaviour, ClientViewMetadata, DocumentAttachment, HyperlinkValue, RelationSearchResult as RelationSearchResult1 } from "./types/client-layout";
+import { ClientLayout, ClientLayoutItem as ClientLayoutItem1, ClientLayoutItemFieldDataType, ClientLayoutItemRelationDisplayType, ClientLayoutItemRelationEditBehavior, ClientListValue as ClientListValue1, CurrencyValue, RelationSearchResult } from "./types";
+import { AggregationResult, ClientArchetype, ClientLayoutItem, ClientLayoutItemNavigate, ClientLayoutNavigateBehaviour, ClientListValue, ClientViewMetadata, DocumentAttachment, HyperlinkValue, RelationSearchResult as RelationSearchResult1 } from "./types/client-layout";
 import { ListNavigationContext } from "./utils/query-params";
 import { DistinctValue, DocRow } from "./components/documents/mrd-document-list/folder-tree";
-export { ClientLayout, ClientLayoutItem as ClientLayoutItem1, ClientLayoutItemFieldDataType, ClientLayoutItemRelationDisplayType, ClientLayoutItemRelationEditBehavior, ClientListValue, CurrencyValue, RelationSearchResult } from "./types";
-export { AggregationResult, ClientArchetype, ClientLayoutItem, ClientLayoutItemNavigate, ClientLayoutNavigateBehaviour, ClientViewMetadata, DocumentAttachment, HyperlinkValue, RelationSearchResult as RelationSearchResult1 } from "./types/client-layout";
+import { FileEntry } from "./components/fields/file-upload-common";
+export { ClientLayout, ClientLayoutItem as ClientLayoutItem1, ClientLayoutItemFieldDataType, ClientLayoutItemRelationDisplayType, ClientLayoutItemRelationEditBehavior, ClientListValue as ClientListValue1, CurrencyValue, RelationSearchResult } from "./types";
+export { AggregationResult, ClientArchetype, ClientLayoutItem, ClientLayoutItemNavigate, ClientLayoutNavigateBehaviour, ClientListValue, ClientViewMetadata, DocumentAttachment, HyperlinkValue, RelationSearchResult as RelationSearchResult1 } from "./types/client-layout";
 export { ListNavigationContext } from "./utils/query-params";
 export { DistinctValue, DocRow } from "./components/documents/mrd-document-list/folder-tree";
+export { FileEntry } from "./components/fields/file-upload-common";
 export namespace Components {
     interface MrdBooleanField {
         /**
@@ -223,6 +225,10 @@ export namespace Components {
           * Host callback with the uploaded file reference. Builds the create payload from the archetype slots and requests the new document.
          */
         "setFileReference": (uri: string) => Promise<void>;
+        /**
+          * Upload a file into the current target — the selected folder/container, or the only container when there is just one. Called by the host toolbar (mrd-document-container). No-op without a target, or while another upload is still awaiting its setFileReference.
+         */
+        "uploadFile": (file: File) => Promise<void>;
     }
     /**
      * Archetype-driven single-document view. Given a `commons.document` binding and a
@@ -284,6 +290,32 @@ export namespace Components {
          */
         "value": string;
     }
+    /**
+     * Archetype-driven single-email view. Given a `commons.email` binding and a data
+     * record, renders the message the way an Outlook printout would — subject, a
+     * compact From/To/CC/Date header block, the body and attachments — instead of a
+     * generic field form. Fully read-only: emails arrive through other channels (mail
+     * ingestion gateways), never edited here.
+     * Like `mrd-document-view`/`mrd-invoice-view`, this component never resolves file
+     * hrefs itself — it only exposes attachment references via `mrdAttachments` (an
+     * email can have several) and plain download buttons; the host decides how/whether
+     * to render them.
+     */
+    interface MrdEmailView {
+        /**
+          * Resolved `commons.email` binding: slot name → concrete field/relation name.
+         */
+        "archetype": ClientArchetype;
+        /**
+          * The data record from the /data endpoint. Fields keyed by name; relations under `_links`.
+          * @default {}
+         */
+        "data": Record<string, unknown>;
+        /**
+          * @default navigator.language
+         */
+        "locale": string;
+    }
     interface MrdField {
         "item": ClientLayoutItem1;
         /**
@@ -313,6 +345,10 @@ export namespace Components {
           * @default 0
          */
         "maxSize": number;
+        /**
+          * @default false
+         */
+        "multiple": boolean;
         /**
           * @default ''
          */
@@ -347,7 +383,10 @@ export namespace Components {
           * @default ''
          */
         "referenceHref": string;
-        "setFieldValue": (name: string, value: unknown) => Promise<void>;
+        /**
+          * Inject a value from outside (e.g. after a file upload completes). `file` is optional and only meaningful for `multiple` FILE/IMAGE fields: when the field's current value is an array, mrd-form replaces the array entry that `=== file` with `value`, leaving other pending/resolved entries untouched — this is how mrd-file-field/mrd-image-field resolve concurrent per-file uploads. Pass the `file` from the originating mrdUpload event back unchanged.
+         */
+        "setFieldValue": (name: string, value: unknown, file?: File) => Promise<void>;
         /**
           * When true, a cancel button is shown next to the submit button.
           * @default false
@@ -409,6 +448,10 @@ export namespace Components {
           * @default 0
          */
         "maxSize": number;
+        /**
+          * @default false
+         */
+        "multiple": boolean;
         /**
           * @default ''
          */
@@ -422,6 +465,40 @@ export namespace Components {
          */
         "value": unknown;
     }
+    /**
+     * Archetype-driven single-invoice view. Given a `commons.invoice` binding and a data
+     * record, renders a clear, recognisable invoice summary — number, status, dates,
+     * customer/supplier, totals and attachments — instead of a generic field form.
+     * The line items (`lines` slot, the `commons.invoiceLine` sub-archetype) are NOT
+     * rendered here: this component only reserves a `slot="lines"` at the right spot in
+     * the layout. The host (`mrd-layout-section`) still owns all the actual RELATED_VIEW
+     * table data-loading/event wiring — via its existing `renderRelatedView()` — and
+     * projects the resulting `<mrd-table>` into that slot, so line editing keeps using
+     * the same generic create/edit-navigation mechanism every other relation already has.
+     * Like `mrd-document-view`, this component never resolves file hrefs itself — it only
+     * exposes the attachment references via `mrdAttachments` (now possibly more than one)
+     * and a plain download button; the host decides how/whether to render them.
+     */
+    interface MrdInvoiceView {
+        /**
+          * Resolved `commons.invoice` binding: slot name → concrete field/relation name.
+         */
+        "archetype": ClientArchetype;
+        /**
+          * The data record from the /data endpoint. Fields keyed by name; relations under `_links`.
+          * @default {}
+         */
+        "data": Record<string, unknown>;
+        /**
+          * @default navigator.language
+         */
+        "locale": string;
+        /**
+          * listItems of the FIELD bound to the `status` slot, resolved by mrd-layout-section from its own items array (archetype metadata does not publish listItems), so the status badge can get a real label/color instead of the raw stored key.
+          * @default null
+         */
+        "statusListItems": ClientListValue[] | null;
+    }
     interface MrdLayoutSection {
         /**
           * 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.
@@ -498,7 +575,7 @@ export namespace Components {
           * List items from the API. Each item has a `key` (stored value) and `label`.
           * @default []
          */
-        "listItems": ClientListValue[];
+        "listItems": ClientListValue1[];
         /**
           * @default navigator.language
          */
@@ -652,7 +729,7 @@ export namespace Components {
         /**
           * @default []
          */
-        "dropdownValues": ClientListValue[];
+        "dropdownValues": ClientListValue1[];
         "editBehavior"?: ClientLayoutItemRelationEditBehavior | null;
         /**
           * @default ''
@@ -899,6 +976,10 @@ export interface MrdEmailFieldCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLMrdEmailFieldElement;
 }
+export interface MrdEmailViewCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLMrdEmailViewElement;
+}
 export interface MrdFieldCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLMrdFieldElement;
@@ -919,6 +1000,10 @@ export interface MrdImageFieldCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLMrdImageFieldElement;
 }
+export interface MrdInvoiceViewCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLMrdInvoiceViewElement;
+}
 export interface MrdLayoutSectionCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLMrdLayoutSectionElement;
@@ -1076,6 +1161,7 @@ declare global {
         "mrdLoadPage": { nodeId: string; page: number; sort: string; path: string; qs: string };
         "mrdNavigate": { href?: string; label: string; listContext?: ListNavigationContext; attachments?: DocumentAttachment[] };
         "mrdCanCreate": boolean;
+        "mrdTargetLabel": string;
         "mrdUpdateObject": { href: string; values: Record<string, unknown> };
         "mrdUpload": { file: File };
         "mrdCreateObject": { path: string; values: Record<string, unknown> };
@@ -1161,6 +1247,36 @@ declare global {
         prototype: HTMLMrdEmailFieldElement;
         new (): HTMLMrdEmailFieldElement;
     };
+    interface HTMLMrdEmailViewElementEventMap {
+        "mrdNavigate": { href?: string; label: string };
+        "mrdDownload": { href: string; fileName: string };
+        "mrdAttachments": { attachments: DocumentAttachment[] };
+    }
+    /**
+     * Archetype-driven single-email view. Given a `commons.email` binding and a data
+     * record, renders the message the way an Outlook printout would — subject, a
+     * compact From/To/CC/Date header block, the body and attachments — instead of a
+     * generic field form. Fully read-only: emails arrive through other channels (mail
+     * ingestion gateways), never edited here.
+     * Like `mrd-document-view`/`mrd-invoice-view`, this component never resolves file
+     * hrefs itself — it only exposes attachment references via `mrdAttachments` (an
+     * email can have several) and plain download buttons; the host decides how/whether
+     * to render them.
+     */
+    interface HTMLMrdEmailViewElement extends Components.MrdEmailView, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLMrdEmailViewElementEventMap>(type: K, listener: (this: HTMLMrdEmailViewElement, ev: MrdEmailViewCustomEvent<HTMLMrdEmailViewElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLMrdEmailViewElementEventMap>(type: K, listener: (this: HTMLMrdEmailViewElement, ev: MrdEmailViewCustomEvent<HTMLMrdEmailViewElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLMrdEmailViewElement: {
+        prototype: HTMLMrdEmailViewElement;
+        new (): HTMLMrdEmailViewElement;
+    };
     interface HTMLMrdFieldElementEventMap {
         "mrdChange": { name: string; value: unknown };
         "mrdBlur": { name: string; value: unknown };
@@ -1183,8 +1299,8 @@ declare global {
         new (): HTMLMrdFieldElement;
     };
     interface HTMLMrdFileFieldElementEventMap {
-        "mrdChange": { name: string; value: File | null };
-        "mrdBlur": { name: string; value: File | null };
+        "mrdChange": { name: string; value: FileEntry | FileEntry[] | null };
+        "mrdBlur": { name: string; value: FileEntry | FileEntry[] | null };
         "mrdUpload": { name: string; file: File };
     }
     interface HTMLMrdFileFieldElement extends Components.MrdFileField, HTMLStencilElement {
@@ -1241,8 +1357,8 @@ declare global {
         new (): HTMLMrdHyperlinkFieldElement;
     };
     interface HTMLMrdImageFieldElementEventMap {
-        "mrdChange": { name: string; value: File | null };
-        "mrdBlur": { name: string; value: File | null };
+        "mrdChange": { name: string; value: FileEntry | FileEntry[] | null };
+        "mrdBlur": { name: string; value: FileEntry | FileEntry[] | null };
         "mrdUpload": { name: string; file: File };
     }
     interface HTMLMrdImageFieldElement extends Components.MrdImageField, HTMLStencilElement {
@@ -1259,6 +1375,39 @@ declare global {
         prototype: HTMLMrdImageFieldElement;
         new (): HTMLMrdImageFieldElement;
     };
+    interface HTMLMrdInvoiceViewElementEventMap {
+        "mrdNavigate": { href?: string; label: string };
+        "mrdDownload": { href: string; fileName: string };
+        "mrdAttachments": { attachments: DocumentAttachment[] };
+    }
+    /**
+     * Archetype-driven single-invoice view. Given a `commons.invoice` binding and a data
+     * record, renders a clear, recognisable invoice summary — number, status, dates,
+     * customer/supplier, totals and attachments — instead of a generic field form.
+     * The line items (`lines` slot, the `commons.invoiceLine` sub-archetype) are NOT
+     * rendered here: this component only reserves a `slot="lines"` at the right spot in
+     * the layout. The host (`mrd-layout-section`) still owns all the actual RELATED_VIEW
+     * table data-loading/event wiring — via its existing `renderRelatedView()` — and
+     * projects the resulting `<mrd-table>` into that slot, so line editing keeps using
+     * the same generic create/edit-navigation mechanism every other relation already has.
+     * Like `mrd-document-view`, this component never resolves file hrefs itself — it only
+     * exposes the attachment references via `mrdAttachments` (now possibly more than one)
+     * and a plain download button; the host decides how/whether to render them.
+     */
+    interface HTMLMrdInvoiceViewElement extends Components.MrdInvoiceView, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLMrdInvoiceViewElementEventMap>(type: K, listener: (this: HTMLMrdInvoiceViewElement, ev: MrdInvoiceViewCustomEvent<HTMLMrdInvoiceViewElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLMrdInvoiceViewElementEventMap>(type: K, listener: (this: HTMLMrdInvoiceViewElement, ev: MrdInvoiceViewCustomEvent<HTMLMrdInvoiceViewElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLMrdInvoiceViewElement: {
+        prototype: HTMLMrdInvoiceViewElement;
+        new (): HTMLMrdInvoiceViewElement;
+    };
     interface HTMLMrdLayoutSectionElementEventMap {
         "mrdNavigate": { href?: string; label: string; navigate?: ClientLayoutItemNavigate; navigateBehaviour?: ClientLayoutNavigateBehaviour; listContext?: ListNavigationContext; attachments?: DocumentAttachment[] };
         "mrdSearch": { query: string; dataClass: string };
@@ -1492,11 +1641,13 @@ declare global {
         "mrd-document-list": HTMLMrdDocumentListElement;
         "mrd-document-view": HTMLMrdDocumentViewElement;
         "mrd-email-field": HTMLMrdEmailFieldElement;
+        "mrd-email-view": HTMLMrdEmailViewElement;
         "mrd-field": HTMLMrdFieldElement;
         "mrd-file-field": HTMLMrdFileFieldElement;
         "mrd-form": HTMLMrdFormElement;
         "mrd-hyperlink-field": HTMLMrdHyperlinkFieldElement;
         "mrd-image-field": HTMLMrdImageFieldElement;
+        "mrd-invoice-view": HTMLMrdInvoiceViewElement;
         "mrd-layout-section": HTMLMrdLayoutSectionElement;
         "mrd-list-field": HTMLMrdListFieldElement;
         "mrd-longtext-field": HTMLMrdLongtextFieldElement;
@@ -1755,6 +1906,10 @@ declare namespace LocalJSX {
           * A document row was clicked. Host routes to the document object page. `listContext` can be used to re-fetch this exact record (or its neighbours) via `{path}?{qs}&page={index}&size=1`. `attachments` is a prefetch of the clicked row's own file slot (derived from `archetype`) so the host can render a preview immediately, without waiting for the navigated-to page's own mrdAttachments — see TASK-0169 / FINDING-0111.
          */
         "onMrdNavigate"?: (event: MrdDocumentListCustomEvent<{ href?: string; label: string; listContext?: ListNavigationContext; attachments?: DocumentAttachment[] }>) => void;
+        /**
+          * Emitted whenever the current target changes: the folder path a new folder or upload lands in, or the container's label when no folder is selected. Empty when there is no target. Lets a host toolbar name the destination.
+         */
+        "onMrdTargetLabel"?: (event: MrdDocumentListCustomEvent<string>) => void;
         /**
           * Generic "update an existing object" request — fired when a document is dragged into another folder/container. Host PATCHes `href` with `values` (no move/folder knowledge needed). `values` carries the new folder string (or null for the container root) and, on a cross-container move, the new container relation href.
          */
@@ -1843,6 +1998,44 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    /**
+     * Archetype-driven single-email view. Given a `commons.email` binding and a data
+     * record, renders the message the way an Outlook printout would — subject, a
+     * compact From/To/CC/Date header block, the body and attachments — instead of a
+     * generic field form. Fully read-only: emails arrive through other channels (mail
+     * ingestion gateways), never edited here.
+     * Like `mrd-document-view`/`mrd-invoice-view`, this component never resolves file
+     * hrefs itself — it only exposes attachment references via `mrdAttachments` (an
+     * email can have several) and plain download buttons; the host decides how/whether
+     * to render them.
+     */
+    interface MrdEmailView {
+        /**
+          * Resolved `commons.email` binding: slot name → concrete field/relation name.
+         */
+        "archetype": ClientArchetype;
+        /**
+          * The data record from the /data endpoint. Fields keyed by name; relations under `_links`.
+          * @default {}
+         */
+        "data"?: Record<string, unknown>;
+        /**
+          * @default navigator.language
+         */
+        "locale"?: string;
+        /**
+          * The file(s) belonging to this email, fired once on load and again whenever the attachments slot's value changes. The host resolves the href(s) itself.
+         */
+        "onMrdAttachments"?: (event: MrdEmailViewCustomEvent<{ attachments: DocumentAttachment[] }>) => void;
+        /**
+          * Download an attachment. Host resolves the href to a signed URL.
+         */
+        "onMrdDownload"?: (event: MrdEmailViewCustomEvent<{ href: string; fileName: string }>) => void;
+        /**
+          * Navigate to a sender/recipient or the container. Host resolves the href and routes.
+         */
+        "onMrdNavigate"?: (event: MrdEmailViewCustomEvent<{ href?: string; label: string }>) => void;
+    }
     interface MrdField {
         "item": ClientLayoutItem1;
         /**
@@ -1877,14 +2070,18 @@ declare namespace LocalJSX {
           * @default 0
          */
         "maxSize"?: number;
+        /**
+          * @default false
+         */
+        "multiple"?: boolean;
         /**
           * @default ''
          */
         "name"?: string;
-        "onMrdBlur"?: (event: MrdFileFieldCustomEvent<{ name: string; value: File | null }>) => void;
-        "onMrdChange"?: (event: MrdFileFieldCustomEvent<{ name: string; value: File | null }>) => void;
+        "onMrdBlur"?: (event: MrdFileFieldCustomEvent<{ name: string; value: FileEntry | FileEntry[] | null }>) => void;
+        "onMrdChange"?: (event: MrdFileFieldCustomEvent<{ name: string; value: FileEntry | FileEntry[] | null }>) => void;
         /**
-          * Emitted when a file is selected and needs to be uploaded. Host should upload the file and call form.setFieldValue(name, uri) with the result.
+          * Emitted once per selected/dropped file that needs to be uploaded. Host should upload the file and call form.setFieldValue(name, { href, fileName: file.name }, file) with the result — passing `file` back lets mrd-form resolve the right entry in a `multiple` field.
          */
         "onMrdUpload"?: (event: MrdFileFieldCustomEvent<{ name: string; file: File }>) => void;
         /**
@@ -1985,14 +2182,18 @@ declare namespace LocalJSX {
           * @default 0
          */
         "maxSize"?: number;
+        /**
+          * @default false
+         */
+        "multiple"?: boolean;
         /**
           * @default ''
          */
         "name"?: string;
-        "onMrdBlur"?: (event: MrdImageFieldCustomEvent<{ name: string; value: File | null }>) => void;
-        "onMrdChange"?: (event: MrdImageFieldCustomEvent<{ name: string; value: File | null }>) => void;
+        "onMrdBlur"?: (event: MrdImageFieldCustomEvent<{ name: string; value: FileEntry | FileEntry[] | null }>) => void;
+        "onMrdChange"?: (event: MrdImageFieldCustomEvent<{ name: string; value: FileEntry | FileEntry[] | null }>) => void;
         /**
-          * Emitted when an image is selected and needs to be uploaded. Host should upload the file and call form.setFieldValue(name, uri) with the result.
+          * Emitted once per selected/dropped image that needs to be uploaded. Host should upload the file and call form.setFieldValue(name, { href, fileName: file.name }, file) with the result — passing `file` back lets mrd-form resolve the right entry in a `multiple` field.
          */
         "onMrdUpload"?: (event: MrdImageFieldCustomEvent<{ name: string; file: File }>) => void;
         /**
@@ -2004,6 +2205,52 @@ declare namespace LocalJSX {
          */
         "value"?: unknown;
     }
+    /**
+     * Archetype-driven single-invoice view. Given a `commons.invoice` binding and a data
+     * record, renders a clear, recognisable invoice summary — number, status, dates,
+     * customer/supplier, totals and attachments — instead of a generic field form.
+     * The line items (`lines` slot, the `commons.invoiceLine` sub-archetype) are NOT
+     * rendered here: this component only reserves a `slot="lines"` at the right spot in
+     * the layout. The host (`mrd-layout-section`) still owns all the actual RELATED_VIEW
+     * table data-loading/event wiring — via its existing `renderRelatedView()` — and
+     * projects the resulting `<mrd-table>` into that slot, so line editing keeps using
+     * the same generic create/edit-navigation mechanism every other relation already has.
+     * Like `mrd-document-view`, this component never resolves file hrefs itself — it only
+     * exposes the attachment references via `mrdAttachments` (now possibly more than one)
+     * and a plain download button; the host decides how/whether to render them.
+     */
+    interface MrdInvoiceView {
+        /**
+          * Resolved `commons.invoice` binding: slot name → concrete field/relation name.
+         */
+        "archetype": ClientArchetype;
+        /**
+          * The data record from the /data endpoint. Fields keyed by name; relations under `_links`.
+          * @default {}
+         */
+        "data"?: Record<string, unknown>;
+        /**
+          * @default navigator.language
+         */
+        "locale"?: string;
+        /**
+          * The file(s) belonging to this invoice, fired once on load and again whenever the attachments slot's value changes. The host resolves the href(s) itself.
+         */
+        "onMrdAttachments"?: (event: MrdInvoiceViewCustomEvent<{ attachments: DocumentAttachment[] }>) => void;
+        /**
+          * Download an attachment. Host resolves the href to a signed URL.
+         */
+        "onMrdDownload"?: (event: MrdInvoiceViewCustomEvent<{ href: string; fileName: string }>) => void;
+        /**
+          * Navigate to the customer/supplier/container. Host resolves the href and routes.
+         */
+        "onMrdNavigate"?: (event: MrdInvoiceViewCustomEvent<{ href?: string; label: string }>) => void;
+        /**
+          * listItems of the FIELD bound to the `status` slot, resolved by mrd-layout-section from its own items array (archetype metadata does not publish listItems), so the status badge can get a real label/color instead of the raw stored key.
+          * @default null
+         */
+        "statusListItems"?: ClientListValue[] | null;
+    }
     interface MrdLayoutSection {
         /**
           * 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.
@@ -2090,7 +2337,7 @@ declare namespace LocalJSX {
           * List items from the API. Each item has a `key` (stored value) and `label`.
           * @default []
          */
-        "listItems"?: ClientListValue[];
+        "listItems"?: ClientListValue1[];
         /**
           * @default navigator.language
          */
@@ -2247,7 +2494,7 @@ declare namespace LocalJSX {
         /**
           * @default []
          */
-        "dropdownValues"?: ClientListValue[];
+        "dropdownValues"?: ClientListValue1[];
         "editBehavior"?: ClientLayoutItemRelationEditBehavior | null;
         /**
           * @default ''
@@ -2538,6 +2785,9 @@ declare namespace LocalJSX {
         "disabled": boolean;
         "locale": string;
     }
+    interface MrdEmailViewAttributes {
+        "locale": string;
+    }
     interface MrdFieldAttributes {
         "locale": string;
     }
@@ -2549,6 +2799,7 @@ declare namespace LocalJSX {
         "locale": string;
         "accept": string;
         "maxSize": number;
+        "multiple": boolean;
     }
     interface MrdFormAttributes {
         "locale": string;
@@ -2573,6 +2824,10 @@ declare namespace LocalJSX {
         "locale": string;
         "accept": string;
         "maxSize": number;
+        "multiple": boolean;
+    }
+    interface MrdInvoiceViewAttributes {
+        "locale": string;
     }
     interface MrdLayoutSectionAttributes {
         "locale": string;
@@ -2681,11 +2936,13 @@ declare namespace LocalJSX {
         "mrd-document-list": Omit<MrdDocumentList, keyof MrdDocumentListAttributes> & { [K in keyof MrdDocumentList & keyof MrdDocumentListAttributes]?: MrdDocumentList[K] } & { [K in keyof MrdDocumentList & keyof MrdDocumentListAttributes as `attr:${K}`]?: MrdDocumentListAttributes[K] } & { [K in keyof MrdDocumentList & keyof MrdDocumentListAttributes as `prop:${K}`]?: MrdDocumentList[K] };
         "mrd-document-view": Omit<MrdDocumentView, keyof MrdDocumentViewAttributes> & { [K in keyof MrdDocumentView & keyof MrdDocumentViewAttributes]?: MrdDocumentView[K] } & { [K in keyof MrdDocumentView & keyof MrdDocumentViewAttributes as `attr:${K}`]?: MrdDocumentViewAttributes[K] } & { [K in keyof MrdDocumentView & keyof MrdDocumentViewAttributes as `prop:${K}`]?: MrdDocumentView[K] };
         "mrd-email-field": Omit<MrdEmailField, keyof MrdEmailFieldAttributes> & { [K in keyof MrdEmailField & keyof MrdEmailFieldAttributes]?: MrdEmailField[K] } & { [K in keyof MrdEmailField & keyof MrdEmailFieldAttributes as `attr:${K}`]?: MrdEmailFieldAttributes[K] } & { [K in keyof MrdEmailField & keyof MrdEmailFieldAttributes as `prop:${K}`]?: MrdEmailField[K] };
+        "mrd-email-view": Omit<MrdEmailView, keyof MrdEmailViewAttributes> & { [K in keyof MrdEmailView & keyof MrdEmailViewAttributes]?: MrdEmailView[K] } & { [K in keyof MrdEmailView & keyof MrdEmailViewAttributes as `attr:${K}`]?: MrdEmailViewAttributes[K] } & { [K in keyof MrdEmailView & keyof MrdEmailViewAttributes as `prop:${K}`]?: MrdEmailView[K] };
         "mrd-field": Omit<MrdField, keyof MrdFieldAttributes> & { [K in keyof MrdField & keyof MrdFieldAttributes]?: MrdField[K] } & { [K in keyof MrdField & keyof MrdFieldAttributes as `attr:${K}`]?: MrdFieldAttributes[K] } & { [K in keyof MrdField & keyof MrdFieldAttributes as `prop:${K}`]?: MrdField[K] };
         "mrd-file-field": Omit<MrdFileField, keyof MrdFileFieldAttributes> & { [K in keyof MrdFileField & keyof MrdFileFieldAttributes]?: MrdFileField[K] } & { [K in keyof MrdFileField & keyof MrdFileFieldAttributes as `attr:${K}`]?: MrdFileFieldAttributes[K] } & { [K in keyof MrdFileField & keyof MrdFileFieldAttributes as `prop:${K}`]?: MrdFileField[K] };
         "mrd-form": Omit<MrdForm, keyof MrdFormAttributes> & { [K in keyof MrdForm & keyof MrdFormAttributes]?: MrdForm[K] } & { [K in keyof MrdForm & keyof MrdFormAttributes as `attr:${K}`]?: MrdFormAttributes[K] } & { [K in keyof MrdForm & keyof MrdFormAttributes as `prop:${K}`]?: MrdForm[K] };
         "mrd-hyperlink-field": Omit<MrdHyperlinkField, keyof MrdHyperlinkFieldAttributes> & { [K in keyof MrdHyperlinkField & keyof MrdHyperlinkFieldAttributes]?: MrdHyperlinkField[K] } & { [K in keyof MrdHyperlinkField & keyof MrdHyperlinkFieldAttributes as `attr:${K}`]?: MrdHyperlinkFieldAttributes[K] } & { [K in keyof MrdHyperlinkField & keyof MrdHyperlinkFieldAttributes as `prop:${K}`]?: MrdHyperlinkField[K] };
         "mrd-image-field": Omit<MrdImageField, keyof MrdImageFieldAttributes> & { [K in keyof MrdImageField & keyof MrdImageFieldAttributes]?: MrdImageField[K] } & { [K in keyof MrdImageField & keyof MrdImageFieldAttributes as `attr:${K}`]?: MrdImageFieldAttributes[K] } & { [K in keyof MrdImageField & keyof MrdImageFieldAttributes as `prop:${K}`]?: MrdImageField[K] };
+        "mrd-invoice-view": Omit<MrdInvoiceView, keyof MrdInvoiceViewAttributes> & { [K in keyof MrdInvoiceView & keyof MrdInvoiceViewAttributes]?: MrdInvoiceView[K] } & { [K in keyof MrdInvoiceView & keyof MrdInvoiceViewAttributes as `attr:${K}`]?: MrdInvoiceViewAttributes[K] } & { [K in keyof MrdInvoiceView & keyof MrdInvoiceViewAttributes as `prop:${K}`]?: MrdInvoiceView[K] };
         "mrd-layout-section": Omit<MrdLayoutSection, keyof MrdLayoutSectionAttributes> & { [K in keyof MrdLayoutSection & keyof MrdLayoutSectionAttributes]?: MrdLayoutSection[K] } & { [K in keyof MrdLayoutSection & keyof MrdLayoutSectionAttributes as `attr:${K}`]?: MrdLayoutSectionAttributes[K] } & { [K in keyof MrdLayoutSection & keyof MrdLayoutSectionAttributes as `prop:${K}`]?: MrdLayoutSection[K] };
         "mrd-list-field": Omit<MrdListField, keyof MrdListFieldAttributes> & { [K in keyof MrdListField & keyof MrdListFieldAttributes]?: MrdListField[K] } & { [K in keyof MrdListField & keyof MrdListFieldAttributes as `attr:${K}`]?: MrdListFieldAttributes[K] } & { [K in keyof MrdListField & keyof MrdListFieldAttributes as `prop:${K}`]?: MrdListField[K] };
         "mrd-longtext-field": Omit<MrdLongtextField, keyof MrdLongtextFieldAttributes> & { [K in keyof MrdLongtextField & keyof MrdLongtextFieldAttributes]?: MrdLongtextField[K] } & { [K in keyof MrdLongtextField & keyof MrdLongtextFieldAttributes as `attr:${K}`]?: MrdLongtextFieldAttributes[K] } & { [K in keyof MrdLongtextField & keyof MrdLongtextFieldAttributes as `prop:${K}`]?: MrdLongtextField[K] };
@@ -2752,11 +3009,38 @@ declare module "@stencil/core" {
              */
             "mrd-document-view": LocalJSX.IntrinsicElements["mrd-document-view"] & JSXBase.HTMLAttributes<HTMLMrdDocumentViewElement>;
             "mrd-email-field": LocalJSX.IntrinsicElements["mrd-email-field"] & JSXBase.HTMLAttributes<HTMLMrdEmailFieldElement>;
+            /**
+             * Archetype-driven single-email view. Given a `commons.email` binding and a data
+             * record, renders the message the way an Outlook printout would — subject, a
+             * compact From/To/CC/Date header block, the body and attachments — instead of a
+             * generic field form. Fully read-only: emails arrive through other channels (mail
+             * ingestion gateways), never edited here.
+             * Like `mrd-document-view`/`mrd-invoice-view`, this component never resolves file
+             * hrefs itself — it only exposes attachment references via `mrdAttachments` (an
+             * email can have several) and plain download buttons; the host decides how/whether
+             * to render them.
+             */
+            "mrd-email-view": LocalJSX.IntrinsicElements["mrd-email-view"] & JSXBase.HTMLAttributes<HTMLMrdEmailViewElement>;
             "mrd-field": LocalJSX.IntrinsicElements["mrd-field"] & JSXBase.HTMLAttributes<HTMLMrdFieldElement>;
             "mrd-file-field": LocalJSX.IntrinsicElements["mrd-file-field"] & JSXBase.HTMLAttributes<HTMLMrdFileFieldElement>;
             "mrd-form": LocalJSX.IntrinsicElements["mrd-form"] & JSXBase.HTMLAttributes<HTMLMrdFormElement>;
             "mrd-hyperlink-field": LocalJSX.IntrinsicElements["mrd-hyperlink-field"] & JSXBase.HTMLAttributes<HTMLMrdHyperlinkFieldElement>;
             "mrd-image-field": LocalJSX.IntrinsicElements["mrd-image-field"] & JSXBase.HTMLAttributes<HTMLMrdImageFieldElement>;
+            /**
+             * Archetype-driven single-invoice view. Given a `commons.invoice` binding and a data
+             * record, renders a clear, recognisable invoice summary — number, status, dates,
+             * customer/supplier, totals and attachments — instead of a generic field form.
+             * The line items (`lines` slot, the `commons.invoiceLine` sub-archetype) are NOT
+             * rendered here: this component only reserves a `slot="lines"` at the right spot in
+             * the layout. The host (`mrd-layout-section`) still owns all the actual RELATED_VIEW
+             * table data-loading/event wiring — via its existing `renderRelatedView()` — and
+             * projects the resulting `<mrd-table>` into that slot, so line editing keeps using
+             * the same generic create/edit-navigation mechanism every other relation already has.
+             * Like `mrd-document-view`, this component never resolves file hrefs itself — it only
+             * exposes the attachment references via `mrdAttachments` (now possibly more than one)
+             * and a plain download button; the host decides how/whether to render them.
+             */
+            "mrd-invoice-view": LocalJSX.IntrinsicElements["mrd-invoice-view"] & JSXBase.HTMLAttributes<HTMLMrdInvoiceViewElement>;
             "mrd-layout-section": LocalJSX.IntrinsicElements["mrd-layout-section"] & JSXBase.HTMLAttributes<HTMLMrdLayoutSectionElement>;
             "mrd-list-field": LocalJSX.IntrinsicElements["mrd-list-field"] & JSXBase.HTMLAttributes<HTMLMrdListFieldElement>;
             "mrd-longtext-field": LocalJSX.IntrinsicElements["mrd-longtext-field"] & JSXBase.HTMLAttributes<HTMLMrdLongtextFieldElement>;

package/dist/types/types/client-layout.d.ts

@@ -109,6 +109,12 @@ export interface ClientArchetype {
 }
 /** Well-known archetype ids the client renders specially. */
 export declare const ARCHETYPE_DOCUMENT = "commons.document";
+export declare const ARCHETYPE_INVOICE = "commons.invoice";
+export declare const ARCHETYPE_EMAIL = "commons.email";
+/** Bound by a `commons.invoice`'s `lines` relation target class. Used to find the
+ *  RELATED_VIEW item for the line items generically, by archetype id rather than
+ *  by name/class string. */
+export declare const ARCHETYPE_INVOICE_LINE = "commons.invoiceLine";
 /**
  * Find a binding for `archetypeId` in a published `archetypes` list.
  * Returns `undefined` when the archetype is absent — callers fall back to the
@@ -133,6 +139,8 @@ export interface ClientLayoutItemField {
     /** Aggregate function to render in the table totals row. */
     aggregate?: 'sum' | 'avg' | 'count' | null;
     historyEnabled?: boolean;
+    /** Render the item on an OBJECT_DASHBOARD even when it has no value. */
+    showEmpty?: boolean;
 }
 /** Response shape from the /aggregations endpoint. */
 export interface AggregationResult {
@@ -154,6 +162,8 @@ export interface ClientLayoutItemRelation {
     multiple?: boolean;
     defaultValue?: string | null;
     dropdownValues?: ClientListValue[];
+    /** Render the item on an OBJECT_DASHBOARD even when it has no value. */
+    showEmpty?: boolean;
 }
 export interface ClientLayoutItemNavigate {
     dataClass: string;
@@ -232,6 +242,9 @@ export interface ClientLayoutItem {
     decimalPrecision?: number;
     currencyCode?: string;
     historyEnabled?: boolean;
+    /** FIELD / RELATION — render the item on an OBJECT_DASHBOARD even when it has
+     *  no value, instead of hiding it (the default). */
+    showEmpty?: boolean;
     relatedClass?: string;
     mostSignificantClass?: string;
     displayType?: ClientLayoutItemRelationDisplayType;

package/dist/types/utils/document-attachments.d.ts

@@ -1,8 +1,15 @@
 import { ClientArchetype, DocumentAttachment } from '../types/client-layout';
 /**
- * Extract the `commons.document` archetype's file slot from a data record as a
- * `DocumentAttachment[]` — empty when the slot is unmapped or has no value.
- * Shared by mrd-document-view (on load/data-change) and mrd-document-container
- * (row-click prefetch on mrdNavigate), so both report the exact same shape.
+ * Extract an archetype's file slot from a data record as a `DocumentAttachment[]` —
+ * empty when the slot is unmapped or has no value. `slot` defaults to `'file'` (the
+ * commons.document single-file slot); pass `'attachments'` for the multi-file slots
+ * on commons.email / commons.invoice. A single-object slot value yields a one-entry
+ * array, an array-valued slot yields one entry per item.
+ * Shared by mrd-document-view / mrd-invoice-view / mrd-email-view (on load/data-change)
+ * and mrd-document-container (row-click prefetch on mrdNavigate), so all report the
+ * exact same shape.
  */
-export declare function attachmentsFromRecord(archetype: ClientArchetype | null | undefined, record: Record<string, unknown> | null | undefined): DocumentAttachment[];
+export declare function attachmentsFromRecord(archetype: ClientArchetype | null | undefined, record: Record<string, unknown> | null | undefined, slot?: string): DocumentAttachment[];
+/** Dedup key for the componentDidLoad/@Watch('data') "emit mrdAttachments only on
+ *  change" guard shared by mrd-document-view / mrd-invoice-view / mrd-email-view. */
+export declare function attachmentsKey(attachments: DocumentAttachment[]): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mmlogic/components",
-  "version": "0.5.2",
+  "version": "0.5.4",
   "description": "Stencil.js web component library for dynamic forms and virtual-scroll data tables",
   "license": "MIT",
   "author": "Mosterd",