@mmlogic/components 0.3.9 → 0.3.10

package/dist/mosterdcomponents/validation-Br9k2Ztw.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"validation-Br9k2Ztw.js","sources":["src/utils/validation.ts"],"sourcesContent":["import { ClientLayoutItemFieldDataType } from '../types';\n\nexport function validateRequired(value: unknown): boolean {\n  if (value === null || value === undefined) return false;\n  if (typeof value === 'string') return value.trim().length > 0;\n  if (Array.isArray(value)) return value.length > 0;\n  if (typeof value === 'object') {\n    // HyperlinkValue check\n    const hv = value as { href?: unknown };\n    if ('href' in hv) return typeof hv.href === 'string' && hv.href.trim().length > 0;\n    // CurrencyValue check\n    const cv = value as { amount?: unknown };\n    if ('amount' in cv) return cv.amount !== null && cv.amount !== undefined && cv.amount !== '';\n  }\n  return true;\n}\n\nexport function validateEmail(value: string): boolean {\n  if (!value) return true;\n  return /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(value);\n}\n\nexport function validateUrl(value: string): boolean {\n  if (!value) return true;\n  try {\n    const url = new URL(value);\n    return url.protocol === 'http:' || url.protocol === 'https:';\n  } catch {\n    return false;\n  }\n}\n\nexport function validateNumber(value: unknown, dataType: ClientLayoutItemFieldDataType): boolean {\n  if (value === null || value === undefined || value === '') return true;\n  const num = Number(value);\n  if (isNaN(num)) return false;\n  if (dataType === ClientLayoutItemFieldDataType.INTEGER) {\n    return Number.isInteger(num);\n  }\n  if (dataType === ClientLayoutItemFieldDataType.PERCENTAGE) {\n    return num >= 0 && num <= 100;\n  }\n  return true;\n}\n"],"names":[],"mappings":";;;AAEM,SAAU,gBAAgB,CAAC,KAAc,EAAA;AAC7C,IAAA,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,SAAS;AAAE,QAAA,OAAO,KAAK;IACvD,IAAI,OAAO,KAAK,KAAK,QAAQ;QAAE,OAAO,KAAK,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC;AAC7D,IAAA,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;AAAE,QAAA,OAAO,KAAK,CAAC,MAAM,GAAG,CAAC;AACjD,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;;QAE7B,MAAM,EAAE,GAAG,KAA2B;QACtC,IAAI,MAAM,IAAI,EAAE;AAAE,YAAA,OAAO,OAAO,EAAE,CAAC,IAAI,KAAK,QAAQ,IAAI,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC;;QAEjF,MAAM,EAAE,GAAG,KAA6B;QACxC,IAAI,QAAQ,IAAI,EAAE;AAAE,YAAA,OAAO,EAAE,CAAC,MAAM,KAAK,IAAI,IAAI,EAAE,CAAC,MAAM,KAAK,SAAS,IAAI,EAAE,CAAC,MAAM,KAAK,EAAE;;AAE9F,IAAA,OAAO,IAAI;AACb;AAEM,SAAU,aAAa,CAAC,KAAa,EAAA;AACzC,IAAA,IAAI,CAAC,KAAK;AAAE,QAAA,OAAO,IAAI;AACvB,IAAA,OAAO,4BAA4B,CAAC,IAAI,CAAC,KAAK,CAAC;AACjD;AAEM,SAAU,WAAW,CAAC,KAAa,EAAA;AACvC,IAAA,IAAI,CAAC,KAAK;AAAE,QAAA,OAAO,IAAI;AACvB,IAAA,IAAI;AACF,QAAA,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,KAAK,CAAC;QAC1B,OAAO,GAAG,CAAC,QAAQ,KAAK,OAAO,IAAI,GAAG,CAAC,QAAQ,KAAK,QAAQ;;IAC5D,OAAA,EAAA,EAAM;AACN,QAAA,OAAO,KAAK;;AAEhB;AAEM,SAAU,cAAc,CAAC,KAAc,EAAE,QAAuC,EAAA;IACpF,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,EAAE;AAAE,QAAA,OAAO,IAAI;AACtE,IAAA,MAAM,GAAG,GAAG,MAAM,CAAC,KAAK,CAAC;IACzB,IAAI,KAAK,CAAC,GAAG,CAAC;AAAE,QAAA,OAAO,KAAK;AAC5B,IAAA,IAAI,QAAQ,KAAK,6BAA6B,CAAC,OAAO,EAAE;AACtD,QAAA,OAAO,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC;;AAE9B,IAAA,IAAI,QAAQ,KAAK,6BAA6B,CAAC,UAAU,EAAE;AACzD,QAAA,OAAO,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG;;AAE/B,IAAA,OAAO,IAAI;AACb;;;;"}

package/dist/types/components/mrd-document-container/mrd-document-container.d.ts

@@ -0,0 +1,94 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { ClientArchetype, ClientLayoutItem } from '../../types/client-layout';
+/**
+ * Owns a document collection view: a single toolbar (view switch + collection
+ * actions like "New folder", and — later — upload / drag-drop) plus the two
+ * interchangeable bodies, the folder tree (`mrd-document-list`) and the flat
+ * table (`mrd-table`).
+ *
+ * `mrd-layout-section` renders one of these per document VIEW / RELATED_VIEW and
+ * forwards the re-emitted load/navigate/action events to the host. The embedded
+ * table/list keep their `data-view` / `data-doclist` attributes so the host's
+ * existing `setViewPage` / `setViewDistinct` / `setViewAggregations` lookups
+ * (recursive querySelector) still resolve them unchanged.
+ */
+export declare class MrdDocumentContainer {
+    el: HTMLElement;
+    /** The VIEW or RELATED_VIEW layout item (dataClass, fromClass, view config). */
+    item: ClientLayoutItem | null;
+    /** Resolved `commons.document` archetype binding for the folder tree. */
+    archetype: ClientArchetype;
+    /** Parent record id — required for RELATED_VIEW path building. */
+    parentId: string;
+    /** Lookup key used for the embedded `data-doclist` / `data-view` attributes. */
+    viewKey: string;
+    locale: string;
+    /** Re-emitted from the embedded list/table. `nodeId` present for a folder load. */
+    mrdLoadPage: EventEmitter<{
+        page: number;
+        sort: string;
+        path: string;
+        qs: string;
+        nodeId?: string;
+    }>;
+    /** Re-emitted from the embedded folder tree. */
+    mrdLoadDistinct: EventEmitter<{
+        nodeId: string;
+        distinct: string;
+        path: string;
+        qs: string;
+    }>;
+    /** Re-emitted from the embedded table. */
+    mrdLoadAggregations: EventEmitter<{
+        path: string;
+        qs: string;
+        aggQs: string;
+    }>;
+    /** A row / document was activated. Host routes to the object page. */
+    mrdNavigate: EventEmitter<{
+        href?: string;
+        label: string;
+    }>;
+    /** A table toolbar action was triggered. */
+    mrdAction: EventEmitter<{
+        action: string;
+        path?: string;
+        qs?: string;
+        parentPath?: string | null;
+        basicType?: string;
+    }>;
+    /** Generic "update an existing object" request, re-emitted from the folder tree
+     *  (a document was dragged into another folder/container). */
+    mrdUpdateObject: EventEmitter<{
+        href: string;
+        values: Record<string, unknown>;
+    }>;
+    /** An external file was dropped on a folder; host uploads and calls back. */
+    mrdUpload: EventEmitter<{
+        file: File;
+    }>;
+    /** Create a new document from an uploaded file; host POSTs `values` to `path`. */
+    mrdCreateObject: EventEmitter<{
+        path: string;
+        values: Record<string, unknown>;
+    }>;
+    /** Active body: folder tree or flat table. */
+    private mode;
+    /** Whether the folder tree currently has a valid target for "New folder". */
+    private canCreate;
+    private listEl?;
+    private tableEl?;
+    /** Whether the currently mounted table has been init()'d. Reset on every mode switch. */
+    private tableInited;
+    /** The embedded table does not self-load: like every mrd-table it waits for the
+     *  host to call init() (which emits mrdLoadPage, and — once page 0 lands —
+     *  mrdLoadAggregations). The section only init()s tables mounted at load time, so
+     *  when the user switches to list view we init the freshly mounted table here. */
+    componentDidRender(): void;
+    private setMode;
+    private createFolder;
+    private renderToolbar;
+    private renderTree;
+    private renderList;
+    render(): any;
+}

package/dist/types/components/mrd-document-list/mrd-document-list.d.ts

@@ -58,17 +58,72 @@ export declare class MrdDocumentList {
         href?: string;
         label: string;
     }>;
+    /** Emitted whenever the "can create a folder here" state changes, so a host
+     *  toolbar (mrd-document-container) can enable/disable its New folder button. */
+    mrdCanCreate: EventEmitter<boolean>;
+    /** 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. */
+    mrdUpdateObject: EventEmitter<{
+        href: string;
+        values: Record<string, unknown>;
+    }>;
+    /** An external file was dropped onto a folder/container. Same flow as mrd-form:
+     *  host uploads the file and calls `setFileReference(uri)` with the result. */
+    mrdUpload: EventEmitter<{
+        file: File;
+    }>;
+    /** Fired once the dropped file is uploaded — requests creation of a new document.
+     *  Host POSTs `values` to `path` (on a 400 it can open the create form itself). */
+    mrdCreateObject: EventEmitter<{
+        path: string;
+        values: Record<string, unknown>;
+    }>;
     /** Root sentinel id for the container-level distinct request. */
     private static readonly ROOT;
     private containers;
     private rootLoading;
     /** True when the single-container level is collapsed away (dossier context). */
     private singleContainer;
+    /** Currently selected node id — the target for "New folder" and (later) drops. */
+    private selectedId;
+    /** Node id currently highlighted as a drag-drop target (null = none). */
+    private dropTargetId;
+    /** Node id showing an "uploading…" indicator while a dropped file is processed. */
+    private uploadingNodeId;
     private nodeIndex;
+    /** The pending node whose inline name input is open (null = not creating). */
+    private pendingNode;
+    /** The node the pending folder is being created under. */
+    private pendingParent;
+    /** The container the pending folder belongs to. */
+    private pendingContainer;
+    /** Current text in the inline name input. */
+    private pendingName;
+    /** Ref to the inline input, so we can focus it after it mounts. */
+    private pendingInputEl;
+    /** Set when a fresh input needs focus on the next render. */
+    private pendingNeedsFocus;
+    /** Monotonic counter for unique temporary pending-node ids. */
+    private newFolderSeq;
+    /** Last emitted canCreateFolder value, to only emit mrdCanCreate on change. */
+    private lastCanCreate;
+    /** The document row currently being dragged. */
+    private dragDoc;
+    /** Id of the node the dragged document currently lives in. */
+    private dragFromId;
+    /** External file dropped onto a node, awaiting its upload to complete. */
+    private pendingUpload;
+    /** The optimistic document row awaiting its self href from the create POST. */
+    private lastOptimisticDoc;
     componentDidLoad(): void;
+    componentDidRender(): void;
     private get containerField();
     private get folderField();
     private get titleField();
+    private get fileField();
     private get dateField();
     /** VIEW: `/{dataClass}`; RELATED_VIEW: `/{fromClass}/{parentId}/{dataClass}`. */
     private buildDataPath;
@@ -93,6 +148,51 @@ export declare class MrdDocumentList {
     private bump;
     private toggleContainer;
     private toggleFolder;
+    /** Resolve the node a new folder should be created under, and its container.
+     *  Uses the current selection; falls back to the single container (dossier). */
+    private resolveTarget;
+    private get canCreateFolder();
+    /** Start creating a folder under the current target. Called by the host toolbar
+     *  (mrd-document-container). No-op when there is no valid target. */
+    createFolder(): Promise<void>;
+    /** Folder path segments of a node relative to its container (derived from its id). */
+    private segmentsOf;
+    private startCreateFolder;
+    private onPendingInput;
+    private onPendingKeyDown;
+    private commitFolder;
+    private cancelFolder;
+    private clearPending;
+    private onDocDragStart;
+    private onDocDragEnd;
+    /** True when the drag carries external files (an OS file drop, not an internal move). */
+    private isFileDrag;
+    /** A folder/container node (or a document inside it) accepts an internal move
+     *  or an external file drop. Always claims the event so it never bubbles to the
+     *  root drop-zone; a different node is highlighted (its own folder = no-op). */
+    private onNodeDragOver;
+    private onNodeDragLeave;
+    private onNodeDrop;
+    /** Root-zone drop (dossier context): target the single container's root. */
+    private onRootDragOver;
+    private onRootDrop;
+    /** Begin an upload: emit mrdUpload; the host uploads and calls setFileReference. */
+    private startFileUpload;
+    /** Strip a single trailing extension for the document title. */
+    private stripExtension;
+    /** 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>;
+    /** Host callback with the created document's self href, so the optimistic row
+     *  becomes navigable without waiting for a reload. */
+    setCreatedHref(href: string): Promise<void>;
+    /** Folder string a node represents: the raw distinct value when it holds
+     *  documents, else derived from its path segments; null for a container root. */
+    private folderStringOf;
+    private moveDocument;
+    /** Recompute a container's subtree totals from docCounts when its folders are
+     *  loaded; otherwise just nudge the aggregate badge by the delta. */
+    private recomputeContainerTotals;
     private openDoc;
     private renderChevron;
     private renderDossierIcon;
@@ -102,6 +202,8 @@ export declare class MrdDocumentList {
     private renderDocRow;
     private renderLoadingRow;
     private renderChildren;
+    private renderUploadingRow;
+    private renderFolderEditRow;
     private renderFolderNode;
     private renderContainerNode;
     render(): any;

package/dist/types/components/mrd-layout-section/mrd-layout-section.d.ts

@@ -22,8 +22,6 @@ export declare class MrdLayoutSection {
     private imagePreviewUrl;
     private imagePreviews;
     private openHistoryField;
-    /** Per-view display mode for document collection views. Default 'tree'. */
-    private docViewMode;
     private historyClickOutside;
     mrdNavigate: EventEmitter<{
         href?: string;
@@ -79,6 +77,25 @@ export declare class MrdLayoutSection {
         path: string;
         qs: string;
     }>;
+    /** Generic "update an existing object" request from an embedded document view
+     *  (a document dragged into another folder). Host PATCHes `href` with `values`. */
+    mrdUpdateObject: EventEmitter<{
+        href: string;
+        values: Record<string, unknown>;
+    }>;
+    /** An external file was dropped on a document view; host uploads and calls
+     *  setViewFileReference(name, uri). */
+    mrdViewUpload: EventEmitter<{
+        name: string;
+        file: File;
+    }>;
+    /** Create a new document from an uploaded file; host POSTs `values` to `path`,
+     *  then calls setViewCreatedObject(name, href) with the new object's href. */
+    mrdCreateObject: EventEmitter<{
+        name: string;
+        path: string;
+        values: Record<string, unknown>;
+    }>;
     private searchTimers;
     componentDidLoad(): void;
     disconnectedCallback(): void;
@@ -100,6 +117,12 @@ export declare class MrdLayoutSection {
     setViewAggregations(name: string, data: any): Promise<void>;
     /** Inject distinct values into an embedded mrd-document-list for a document view. */
     setViewDistinct(name: string, nodeId: string, values: DistinctValue[]): Promise<void>;
+    /** Inject the uploaded file reference for a dropped file, so the document view
+     *  can request creation of the new document (see mrdViewUpload). */
+    setViewFileReference(name: string, uri: string): Promise<void>;
+    /** Inject the created document's href after a file-drop create, so the
+     *  optimistic row becomes navigable (see mrdCreateObject). */
+    setViewCreatedObject(name: string, href: string): Promise<void>;
     /** Provide a resolved URL for an IMAGE field. Shows as thumbnail; clicking opens the lightbox. */
     setImagePreview(fieldName: string, url: string): Promise<void>;
     /** Open the lightbox directly with a URL (e.g. after mrdDownload on a FILE field). */
@@ -114,9 +137,10 @@ export declare class MrdLayoutSection {
     private renderRelation;
     private renderSearch;
     private renderRelatedView;
-    /** Tree / list segmented toggle for document collection views (+ upload placeholder). */
-    private renderDocToolbar;
-    private renderDocumentList;
+    /** Document collection view: owns the view-switch + collection actions and
+     *  swaps between the folder tree and the flat table. Events are re-emitted to
+     *  the host with the view key, exactly as the raw list/table events were. */
+    private renderDocumentContainer;
     private renderTable;
     private renderItem;
     private renderImageModal;

package/dist/types/components.d.ts

@@ -118,6 +118,42 @@ export namespace Components {
          */
         "value": string;
     }
+    /**
+     * Owns a document collection view: a single toolbar (view switch + collection
+     * actions like "New folder", and — later — upload / drag-drop) plus the two
+     * interchangeable bodies, the folder tree (`mrd-document-list`) and the flat
+     * table (`mrd-table`).
+     * `mrd-layout-section` renders one of these per document VIEW / RELATED_VIEW and
+     * forwards the re-emitted load/navigate/action events to the host. The embedded
+     * table/list keep their `data-view` / `data-doclist` attributes so the host's
+     * existing `setViewPage` / `setViewDistinct` / `setViewAggregations` lookups
+     * (recursive querySelector) still resolve them unchanged.
+     */
+    interface MrdDocumentContainer {
+        /**
+          * Resolved `commons.document` archetype binding for the folder tree.
+         */
+        "archetype": ClientArchetype;
+        /**
+          * The VIEW or RELATED_VIEW layout item (dataClass, fromClass, view config).
+          * @default null
+         */
+        "item": ClientLayoutItem | null;
+        /**
+          * @default navigator.language
+         */
+        "locale": string;
+        /**
+          * Parent record id — required for RELATED_VIEW path building.
+          * @default ''
+         */
+        "parentId": string;
+        /**
+          * Lookup key used for the embedded `data-doclist` / `data-view` attributes.
+          * @default ''
+         */
+        "viewKey": string;
+    }
     /**
      * Archetype-driven document collection view. Renders documents as a lazy,
      * file-explorer-style folder tree, grouped by the `commons.document` archetype's
@@ -138,6 +174,10 @@ export namespace Components {
           * Resolved `commons.document` binding: slot name → concrete field/relation name.
          */
         "archetype": ClientArchetype;
+        /**
+          * Start creating a folder under the current target. Called by the host toolbar (mrd-document-container). No-op when there is no valid target.
+         */
+        "createFolder": () => Promise<void>;
         /**
           * The VIEW or RELATED_VIEW layout item (dataClass, fromClass, view config).
           * @default null
@@ -152,6 +192,10 @@ export namespace Components {
           * @default ''
          */
         "parentId": string;
+        /**
+          * Host callback with the created document's self href, so the optimistic row becomes navigable without waiting for a reload.
+         */
+        "setCreatedHref": (href: string) => Promise<void>;
         /**
           * Inject distinct values for a node. `nodeId` is the sentinel root (containers) or a container node id (folders).
          */
@@ -160,6 +204,10 @@ export namespace Components {
           * Inject the documents loaded for one folder node.
          */
         "setDocuments": (nodeId: string, docs: DocRow[]) => Promise<void>;
+        /**
+          * 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>;
     }
     /**
      * Archetype-driven single-document view. Given a `commons.document` binding and a
@@ -394,10 +442,18 @@ export namespace Components {
           * Inject aggregation totals into an embedded mrd-table for a VIEW or RELATED_VIEW item.
          */
         "setViewAggregations": (name: string, data: any) => Promise<void>;
+        /**
+          * Inject the created document's href after a file-drop create, so the optimistic row becomes navigable (see mrdCreateObject).
+         */
+        "setViewCreatedObject": (name: string, href: string) => Promise<void>;
         /**
           * Inject distinct values into an embedded mrd-document-list for a document view.
          */
         "setViewDistinct": (name: string, nodeId: string, values: DistinctValue1[]) => Promise<void>;
+        /**
+          * Inject the uploaded file reference for a dropped file, so the document view can request creation of the new document (see mrdViewUpload).
+         */
+        "setViewFileReference": (name: string, uri: string) => Promise<void>;
         /**
           * 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.
          */
@@ -750,6 +806,10 @@ export interface MrdDatetimeFieldCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLMrdDatetimeFieldElement;
 }
+export interface MrdDocumentContainerCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLMrdDocumentContainerElement;
+}
 export interface MrdDocumentListCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLMrdDocumentListElement;
@@ -895,10 +955,49 @@ declare global {
         prototype: HTMLMrdDatetimeFieldElement;
         new (): HTMLMrdDatetimeFieldElement;
     };
+    interface HTMLMrdDocumentContainerElementEventMap {
+        "mrdLoadPage": { page: number; sort: string; path: string; qs: string; nodeId?: string };
+        "mrdLoadDistinct": { nodeId: string; distinct: string; path: string; qs: string };
+        "mrdLoadAggregations": { path: string; qs: string; aggQs: string };
+        "mrdNavigate": { href?: string; label: string };
+        "mrdAction": { action: string; path?: string; qs?: string; parentPath?: string | null; basicType?: string };
+        "mrdUpdateObject": { href: string; values: Record<string, unknown> };
+        "mrdUpload": { file: File };
+        "mrdCreateObject": { path: string; values: Record<string, unknown> };
+    }
+    /**
+     * Owns a document collection view: a single toolbar (view switch + collection
+     * actions like "New folder", and — later — upload / drag-drop) plus the two
+     * interchangeable bodies, the folder tree (`mrd-document-list`) and the flat
+     * table (`mrd-table`).
+     * `mrd-layout-section` renders one of these per document VIEW / RELATED_VIEW and
+     * forwards the re-emitted load/navigate/action events to the host. The embedded
+     * table/list keep their `data-view` / `data-doclist` attributes so the host's
+     * existing `setViewPage` / `setViewDistinct` / `setViewAggregations` lookups
+     * (recursive querySelector) still resolve them unchanged.
+     */
+    interface HTMLMrdDocumentContainerElement extends Components.MrdDocumentContainer, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLMrdDocumentContainerElementEventMap>(type: K, listener: (this: HTMLMrdDocumentContainerElement, ev: MrdDocumentContainerCustomEvent<HTMLMrdDocumentContainerElementEventMap[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 HTMLMrdDocumentContainerElementEventMap>(type: K, listener: (this: HTMLMrdDocumentContainerElement, ev: MrdDocumentContainerCustomEvent<HTMLMrdDocumentContainerElementEventMap[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 HTMLMrdDocumentContainerElement: {
+        prototype: HTMLMrdDocumentContainerElement;
+        new (): HTMLMrdDocumentContainerElement;
+    };
     interface HTMLMrdDocumentListElementEventMap {
         "mrdLoadDistinct": { nodeId: string; distinct: string; path: string; qs: string };
         "mrdLoadPage": { nodeId: string; page: number; sort: string; path: string; qs: string };
         "mrdNavigate": { href?: string; label: string };
+        "mrdCanCreate": boolean;
+        "mrdUpdateObject": { href: string; values: Record<string, unknown> };
+        "mrdUpload": { file: File };
+        "mrdCreateObject": { path: string; values: Record<string, unknown> };
     }
     /**
      * Archetype-driven document collection view. Renders documents as a lazy,
@@ -1081,6 +1180,9 @@ declare global {
         "mrdViewAction": { name: string; action: string; dataClass: string; path?: string; qs?: string; parentPath?: string | null; basicType?: string };
         "mrdLoadViewAggregations": { name: string; dataClass: string; path: string; qs: string; aggQs: string };
         "mrdLoadViewDistinct": { name: string; nodeId: string; distinct: string; path: string; qs: string };
+        "mrdUpdateObject": { href: string; values: Record<string, unknown> };
+        "mrdViewUpload": { name: string; file: File };
+        "mrdCreateObject": { name: string; path: string; values: Record<string, unknown> };
     }
     interface HTMLMrdLayoutSectionElement extends Components.MrdLayoutSection, HTMLStencilElement {
         addEventListener<K extends keyof HTMLMrdLayoutSectionElementEventMap>(type: K, listener: (this: HTMLMrdLayoutSectionElement, ev: MrdLayoutSectionCustomEvent<HTMLMrdLayoutSectionElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -1268,6 +1370,7 @@ declare global {
         "mrd-currency-field": HTMLMrdCurrencyFieldElement;
         "mrd-date-field": HTMLMrdDateFieldElement;
         "mrd-datetime-field": HTMLMrdDatetimeFieldElement;
+        "mrd-document-container": HTMLMrdDocumentContainerElement;
         "mrd-document-list": HTMLMrdDocumentListElement;
         "mrd-document-view": HTMLMrdDocumentViewElement;
         "mrd-email-field": HTMLMrdEmailFieldElement;
@@ -1401,6 +1504,74 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    /**
+     * Owns a document collection view: a single toolbar (view switch + collection
+     * actions like "New folder", and — later — upload / drag-drop) plus the two
+     * interchangeable bodies, the folder tree (`mrd-document-list`) and the flat
+     * table (`mrd-table`).
+     * `mrd-layout-section` renders one of these per document VIEW / RELATED_VIEW and
+     * forwards the re-emitted load/navigate/action events to the host. The embedded
+     * table/list keep their `data-view` / `data-doclist` attributes so the host's
+     * existing `setViewPage` / `setViewDistinct` / `setViewAggregations` lookups
+     * (recursive querySelector) still resolve them unchanged.
+     */
+    interface MrdDocumentContainer {
+        /**
+          * Resolved `commons.document` archetype binding for the folder tree.
+         */
+        "archetype": ClientArchetype;
+        /**
+          * The VIEW or RELATED_VIEW layout item (dataClass, fromClass, view config).
+          * @default null
+         */
+        "item"?: ClientLayoutItem | null;
+        /**
+          * @default navigator.language
+         */
+        "locale"?: string;
+        /**
+          * A table toolbar action was triggered.
+         */
+        "onMrdAction"?: (event: MrdDocumentContainerCustomEvent<{ action: string; path?: string; qs?: string; parentPath?: string | null; basicType?: string }>) => void;
+        /**
+          * Create a new document from an uploaded file; host POSTs `values` to `path`.
+         */
+        "onMrdCreateObject"?: (event: MrdDocumentContainerCustomEvent<{ path: string; values: Record<string, unknown> }>) => void;
+        /**
+          * Re-emitted from the embedded table.
+         */
+        "onMrdLoadAggregations"?: (event: MrdDocumentContainerCustomEvent<{ path: string; qs: string; aggQs: string }>) => void;
+        /**
+          * Re-emitted from the embedded folder tree.
+         */
+        "onMrdLoadDistinct"?: (event: MrdDocumentContainerCustomEvent<{ nodeId: string; distinct: string; path: string; qs: string }>) => void;
+        /**
+          * Re-emitted from the embedded list/table. `nodeId` present for a folder load.
+         */
+        "onMrdLoadPage"?: (event: MrdDocumentContainerCustomEvent<{ page: number; sort: string; path: string; qs: string; nodeId?: string }>) => void;
+        /**
+          * A row / document was activated. Host routes to the object page.
+         */
+        "onMrdNavigate"?: (event: MrdDocumentContainerCustomEvent<{ href?: string; label: string }>) => void;
+        /**
+          * Generic "update an existing object" request, re-emitted from the folder tree (a document was dragged into another folder/container).
+         */
+        "onMrdUpdateObject"?: (event: MrdDocumentContainerCustomEvent<{ href: string; values: Record<string, unknown> }>) => void;
+        /**
+          * An external file was dropped on a folder; host uploads and calls back.
+         */
+        "onMrdUpload"?: (event: MrdDocumentContainerCustomEvent<{ file: File }>) => void;
+        /**
+          * Parent record id — required for RELATED_VIEW path building.
+          * @default ''
+         */
+        "parentId"?: string;
+        /**
+          * Lookup key used for the embedded `data-doclist` / `data-view` attributes.
+          * @default ''
+         */
+        "viewKey"?: string;
+    }
     /**
      * Archetype-driven document collection view. Renders documents as a lazy,
      * file-explorer-style folder tree, grouped by the `commons.document` archetype's
@@ -1430,6 +1601,14 @@ declare namespace LocalJSX {
           * @default navigator.language
          */
         "locale"?: string;
+        /**
+          * Emitted whenever the "can create a folder here" state changes, so a host toolbar (mrd-document-container) can enable/disable its New folder button.
+         */
+        "onMrdCanCreate"?: (event: MrdDocumentListCustomEvent<boolean>) => void;
+        /**
+          * Fired once the dropped file is uploaded — requests creation of a new document. Host POSTs `values` to `path` (on a 400 it can open the create form itself).
+         */
+        "onMrdCreateObject"?: (event: MrdDocumentListCustomEvent<{ path: string; values: Record<string, unknown> }>) => void;
         /**
           * Request distinct values for a field/relation. Host fetches `{path}?{qs}` and calls `setDistinct(nodeId, values)`.
          */
@@ -1442,6 +1621,14 @@ declare namespace LocalJSX {
           * A document row was clicked. Host routes to the document object page.
          */
         "onMrdNavigate"?: (event: MrdDocumentListCustomEvent<{ href?: string; label: 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.
+         */
+        "onMrdUpdateObject"?: (event: MrdDocumentListCustomEvent<{ href: string; values: Record<string, unknown> }>) => void;
+        /**
+          * An external file was dropped onto a folder/container. Same flow as mrd-form: host uploads the file and calls `setFileReference(uri)` with the result.
+         */
+        "onMrdUpload"?: (event: MrdDocumentListCustomEvent<{ file: File }>) => void;
         /**
           * Parent record id — required for RELATED_VIEW path building.
           * @default ''
@@ -1698,6 +1885,10 @@ declare namespace LocalJSX {
           * @default navigator.language
          */
         "locale"?: string;
+        /**
+          * Create a new document from an uploaded file; host POSTs `values` to `path`, then calls setViewCreatedObject(name, href) with the new object's href.
+         */
+        "onMrdCreateObject"?: (event: MrdLayoutSectionCustomEvent<{ name: string; path: string; values: Record<string, unknown> }>) => void;
         "onMrdDownload"?: (event: MrdLayoutSectionCustomEvent<{ href: string; fileName: string }>) => void;
         /**
           * Fired once on load for each IMAGE field that has an href; host resolves the URL and calls setImagePreview().
@@ -1717,10 +1908,18 @@ declare namespace LocalJSX {
         "onMrdLoadViewPage"?: (event: MrdLayoutSectionCustomEvent<{ name: string; page: number; sort: string; path: string; qs: string; nodeId?: string }>) => void;
         "onMrdNavigate"?: (event: MrdLayoutSectionCustomEvent<{ href?: string; label: string; navigate?: ClientLayoutItemNavigate }>) => void;
         "onMrdSearch"?: (event: MrdLayoutSectionCustomEvent<{ query: string; dataClass: string }>) => void;
+        /**
+          * Generic "update an existing object" request from an embedded document view (a document dragged into another folder). Host PATCHes `href` with `values`.
+         */
+        "onMrdUpdateObject"?: (event: MrdLayoutSectionCustomEvent<{ href: string; values: Record<string, unknown> }>) => void;
         /**
           * Re-emitted from an embedded mrd-table's mrdAction; host builds the target URL from dataClass.
          */
         "onMrdViewAction"?: (event: MrdLayoutSectionCustomEvent<{ name: string; action: string; dataClass: string; path?: string; qs?: string; parentPath?: string | null; basicType?: string }>) => void;
+        /**
+          * An external file was dropped on a document view; host uploads and calls setViewFileReference(name, uri).
+         */
+        "onMrdViewUpload"?: (event: MrdLayoutSectionCustomEvent<{ name: string; file: File }>) => void;
         /**
           * Legacy: view metadata map (ClientDashboardMetadata.views). Not needed in new flat format.
           * @default {}
@@ -2107,6 +2306,11 @@ declare namespace LocalJSX {
         "disabled": boolean;
         "locale": string;
     }
+    interface MrdDocumentContainerAttributes {
+        "parentId": string;
+        "viewKey": string;
+        "locale": string;
+    }
     interface MrdDocumentListAttributes {
         "parentId": string;
         "locale": string;
@@ -2254,6 +2458,7 @@ declare namespace LocalJSX {
         "mrd-currency-field": Omit<MrdCurrencyField, keyof MrdCurrencyFieldAttributes> & { [K in keyof MrdCurrencyField & keyof MrdCurrencyFieldAttributes]?: MrdCurrencyField[K] } & { [K in keyof MrdCurrencyField & keyof MrdCurrencyFieldAttributes as `attr:${K}`]?: MrdCurrencyFieldAttributes[K] } & { [K in keyof MrdCurrencyField & keyof MrdCurrencyFieldAttributes as `prop:${K}`]?: MrdCurrencyField[K] };
         "mrd-date-field": Omit<MrdDateField, keyof MrdDateFieldAttributes> & { [K in keyof MrdDateField & keyof MrdDateFieldAttributes]?: MrdDateField[K] } & { [K in keyof MrdDateField & keyof MrdDateFieldAttributes as `attr:${K}`]?: MrdDateFieldAttributes[K] } & { [K in keyof MrdDateField & keyof MrdDateFieldAttributes as `prop:${K}`]?: MrdDateField[K] };
         "mrd-datetime-field": Omit<MrdDatetimeField, keyof MrdDatetimeFieldAttributes> & { [K in keyof MrdDatetimeField & keyof MrdDatetimeFieldAttributes]?: MrdDatetimeField[K] } & { [K in keyof MrdDatetimeField & keyof MrdDatetimeFieldAttributes as `attr:${K}`]?: MrdDatetimeFieldAttributes[K] } & { [K in keyof MrdDatetimeField & keyof MrdDatetimeFieldAttributes as `prop:${K}`]?: MrdDatetimeField[K] };
+        "mrd-document-container": Omit<MrdDocumentContainer, keyof MrdDocumentContainerAttributes> & { [K in keyof MrdDocumentContainer & keyof MrdDocumentContainerAttributes]?: MrdDocumentContainer[K] } & { [K in keyof MrdDocumentContainer & keyof MrdDocumentContainerAttributes as `attr:${K}`]?: MrdDocumentContainerAttributes[K] } & { [K in keyof MrdDocumentContainer & keyof MrdDocumentContainerAttributes as `prop:${K}`]?: MrdDocumentContainer[K] };
         "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] };
@@ -2282,6 +2487,18 @@ declare module "@stencil/core" {
             "mrd-currency-field": LocalJSX.IntrinsicElements["mrd-currency-field"] & JSXBase.HTMLAttributes<HTMLMrdCurrencyFieldElement>;
             "mrd-date-field": LocalJSX.IntrinsicElements["mrd-date-field"] & JSXBase.HTMLAttributes<HTMLMrdDateFieldElement>;
             "mrd-datetime-field": LocalJSX.IntrinsicElements["mrd-datetime-field"] & JSXBase.HTMLAttributes<HTMLMrdDatetimeFieldElement>;
+            /**
+             * Owns a document collection view: a single toolbar (view switch + collection
+             * actions like "New folder", and — later — upload / drag-drop) plus the two
+             * interchangeable bodies, the folder tree (`mrd-document-list`) and the flat
+             * table (`mrd-table`).
+             * `mrd-layout-section` renders one of these per document VIEW / RELATED_VIEW and
+             * forwards the re-emitted load/navigate/action events to the host. The embedded
+             * table/list keep their `data-view` / `data-doclist` attributes so the host's
+             * existing `setViewPage` / `setViewDistinct` / `setViewAggregations` lookups
+             * (recursive querySelector) still resolve them unchanged.
+             */
+            "mrd-document-container": LocalJSX.IntrinsicElements["mrd-document-container"] & JSXBase.HTMLAttributes<HTMLMrdDocumentContainerElement>;
             /**
              * Archetype-driven document collection view. Renders documents as a lazy,
              * file-explorer-style folder tree, grouped by the `commons.document` archetype's

package/package.json

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