@mj-biz-apps/orders-ng 0.0.1 → 5.2.0

package/dist/lib/panels/worklist-table.component.js

@@ -0,0 +1,444 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import * as i0 from "@angular/core";
+const _forTrack0 = ($index, $item) => $item.Key;
+function MJOWorklistTableComponent_Conditional_0_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵdomElementStart(0, "div", 6);
+    i0.ɵɵdomElement(1, "i", 8);
+    i0.ɵɵdomElementStart(2, "input", 9);
+    i0.ɵɵdomListener("input", function MJOWorklistTableComponent_Conditional_0_Conditional_1_Template_input_input_2_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.SearchChanged.emit($event.target.value)); });
+    i0.ɵɵdomElementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(2);
+    i0.ɵɵdomProperty("value", ctx_r1.Search)("placeholder", ctx_r1.SearchPlaceholder);
+    i0.ɵɵattribute("aria-label", ctx_r1.SearchPlaceholder);
+} }
+function MJOWorklistTableComponent_Conditional_0_Conditional_2_For_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElement(0, "i", 14);
+} if (rf & 2) {
+    const preset_r4 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵclassMap(preset_r4.Icon);
+} }
+function MJOWorklistTableComponent_Conditional_0_Conditional_2_For_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "span", 13);
+    i0.ɵɵtext(1);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const preset_r4 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(preset_r4.Count);
+} }
+function MJOWorklistTableComponent_Conditional_0_Conditional_2_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵdomElementStart(0, "button", 11);
+    i0.ɵɵdomListener("click", function MJOWorklistTableComponent_Conditional_0_Conditional_2_For_2_Template_button_click_0_listener() { const preset_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.PresetChanged.emit(preset_r4.Key)); });
+    i0.ɵɵconditionalCreate(1, MJOWorklistTableComponent_Conditional_0_Conditional_2_For_2_Conditional_1_Template, 1, 2, "i", 12);
+    i0.ɵɵtext(2);
+    i0.ɵɵconditionalCreate(3, MJOWorklistTableComponent_Conditional_0_Conditional_2_For_2_Conditional_3_Template, 2, 1, "span", 13);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const preset_r4 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassProp("is-active", preset_r4.Key === ctx_r1.ActivePreset);
+    i0.ɵɵattribute("aria-pressed", preset_r4.Key === ctx_r1.ActivePreset);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(preset_r4.Icon ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", preset_r4.Label, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(preset_r4.Count ? 3 : -1);
+} }
+function MJOWorklistTableComponent_Conditional_0_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 7);
+    i0.ɵɵrepeaterCreate(1, MJOWorklistTableComponent_Conditional_0_Conditional_2_For_2_Template, 4, 6, "button", 10, _forTrack0);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.Presets);
+} }
+function MJOWorklistTableComponent_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 0);
+    i0.ɵɵconditionalCreate(1, MJOWorklistTableComponent_Conditional_0_Conditional_1_Template, 3, 3, "div", 6);
+    i0.ɵɵconditionalCreate(2, MJOWorklistTableComponent_Conditional_0_Conditional_2_Template, 3, 0, "div", 7);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.Searchable ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.Presets.length ? 2 : -1);
+} }
+function MJOWorklistTableComponent_For_6_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵdomElementStart(0, "span", 16);
+    i0.ɵɵdomListener("click", function MJOWorklistTableComponent_For_6_Conditional_1_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r5); const column_r6 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.SortChanged.emit(column_r6.Key)); });
+    i0.ɵɵtext(1);
+    i0.ɵɵdomElement(2, "i", 17);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const column_r6 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", column_r6.Label, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("fa-sort", ctx_r1.SortKey !== column_r6.Key)("fa-sort-down", ctx_r1.SortKey === column_r6.Key && ctx_r1.SortDescending)("fa-sort-up", ctx_r1.SortKey === column_r6.Key && !ctx_r1.SortDescending);
+} }
+function MJOWorklistTableComponent_For_6_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
+} if (rf & 2) {
+    const column_r6 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵtextInterpolate1(" ", column_r6.Label, " ");
+} }
+function MJOWorklistTableComponent_For_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "th");
+    i0.ɵɵconditionalCreate(1, MJOWorklistTableComponent_For_6_Conditional_1_Template, 3, 7, "span", 15)(2, MJOWorklistTableComponent_For_6_Conditional_2_Template, 1, 1);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const column_r6 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵclassMap(ctx_r1.hideClass(column_r6));
+    i0.ɵɵstyleProp("width", column_r6.Width);
+    i0.ɵɵclassProp("num", column_r6.Kind === "money" || column_r6.Kind === "number");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(column_r6.Sortable ? 1 : 2);
+} }
+function MJOWorklistTableComponent_For_9_For_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "span", 22);
+    i0.ɵɵtext(1);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const column_r9 = i0.ɵɵnextContext().$implicit;
+    const row_r8 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵclassMap((column_r9.ChipClass == null ? null : column_r9.ChipClass(row_r8)) ?? "");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.display(row_r8, column_r9), " ");
+} }
+function MJOWorklistTableComponent_For_9_For_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
+} if (rf & 2) {
+    const column_r9 = i0.ɵɵnextContext().$implicit;
+    const row_r8 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.display(row_r8, column_r9), " ");
+} }
+function MJOWorklistTableComponent_For_9_For_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 21);
+    i0.ɵɵtext(1);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx);
+} }
+function MJOWorklistTableComponent_For_9_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "td");
+    i0.ɵɵconditionalCreate(1, MJOWorklistTableComponent_For_9_For_2_Conditional_1_Template, 2, 3, "span", 20)(2, MJOWorklistTableComponent_For_9_For_2_Conditional_2_Template, 1, 1);
+    i0.ɵɵconditionalCreate(3, MJOWorklistTableComponent_For_9_For_2_Conditional_3_Template, 2, 1, "div", 21);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    let tmp_24_0;
+    const column_r9 = ctx.$implicit;
+    const row_r8 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵclassMap(ctx_r1.hideClass(column_r9));
+    i0.ɵɵclassProp("num", column_r9.Kind === "money" || column_r9.Kind === "number")("mono", column_r9.Kind === "mono");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(column_r9.Kind === "chip" ? 1 : 2);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional((tmp_24_0 = column_r9.Secondary == null ? null : column_r9.Secondary(row_r8)) ? 3 : -1, tmp_24_0);
+} }
+function MJOWorklistTableComponent_For_9_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵdomElementStart(0, "tr", 18);
+    i0.ɵɵdomListener("click", function MJOWorklistTableComponent_For_9_Template_tr_click_0_listener() { const row_r8 = i0.ɵɵrestoreView(_r7).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onRowClick(row_r8)); });
+    i0.ɵɵrepeaterCreate(1, MJOWorklistTableComponent_For_9_For_2_Template, 4, 8, "td", 19, _forTrack0);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const row_r8 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("is-clickable", ctx_r1.RowClicked.observed)("is-selected", ctx_r1.isSelected(row_r8));
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.Columns);
+} }
+function MJOWorklistTableComponent_ForEmpty_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "tr")(1, "td")(2, "div", 23);
+    i0.ɵɵdomElement(3, "i", 14);
+    i0.ɵɵdomElementStart(4, "div", 24);
+    i0.ɵɵtext(5);
+    i0.ɵɵdomElementEnd();
+    i0.ɵɵdomElementStart(6, "div", 25);
+    i0.ɵɵtext(7);
+    i0.ɵɵdomElementEnd()()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵattribute("colspan", ctx_r1.Columns.length);
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassMap(ctx_r1.EmptyIcon);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.EmptyTitle);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.EmptyHint);
+} }
+function MJOWorklistTableComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 5);
+    i0.ɵɵtext(1);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r1.FootNote);
+} }
+/**
+ * `mjo-worklist-table` — the dense, filterable list idiom.
+ *
+ * Used by every "find and work a set" screen: all orders, all payments, the
+ * overdue worklist, the fulfillment queue. Configuration-driven rather than
+ * copied, so the filter behaviour, the empty state and the responsive column
+ * dropping are decided once.
+ *
+ * ONE FILTER SYSTEM, NEVER TWO. Preset chips are the fast path and a search box
+ * narrows within them. There is deliberately no second parallel set of controls
+ * inside the table — two filter systems on one screen means neither is trusted,
+ * and users end up unable to tell why a row is missing.
+ *
+ * COLUMNS DROP IN A STATED ORDER on narrow viewports rather than the table
+ * scrolling sideways. A horizontally-scrolling table on a phone hides data
+ * without admitting it; dropping the lowest-value columns at least tells the
+ * truth about what is on screen.
+ *
+ * ## Example
+ *
+ * ```html
+ * <mjo-worklist-table
+ *   [Columns]="columns"
+ *   [Rows]="rows"
+ *   [Presets]="presets"
+ *   [ActivePreset]="preset"
+ *   (PresetChanged)="preset = $event"
+ *   (RowClicked)="openPreview($event)" />
+ * ```
+ */
+export class MJOWorklistTableComponent {
+    /** Column definitions, left to right. */
+    Columns = [];
+    /** The rows to render. Filtering and sorting happen in the query, not here. */
+    Rows = [];
+    /** Quick-filter chips. */
+    Presets = [];
+    /** Which preset is active. */
+    ActivePreset = null;
+    /** Show the search box. */
+    Searchable = true;
+    /** Current search text — controlled by the host. */
+    Search = '';
+    SearchPlaceholder = 'Search…';
+    /** Column key currently sorted by. */
+    SortKey = null;
+    SortDescending = true;
+    /** Property naming a row's identity, for selection and tracking. */
+    RowKey = 'ID';
+    /** The selected row's key, if the host tracks one. */
+    SelectedKey = null;
+    EmptyTitle = 'Nothing matches';
+    EmptyHint = 'Try a different filter, or clear the search.';
+    EmptyIcon = 'fa-solid fa-magnifying-glass';
+    /** Muted line under the table — where a stated caveat belongs. */
+    FootNote = null;
+    PresetChanged = new EventEmitter();
+    SearchChanged = new EventEmitter();
+    SortChanged = new EventEmitter();
+    RowClicked = new EventEmitter();
+    trackRow(index, row) {
+        return row[this.RowKey] ?? index;
+    }
+    isSelected(row) {
+        return this.SelectedKey != null && String(row[this.RowKey]) === this.SelectedKey;
+    }
+    onRowClick(row) {
+        if (this.RowClicked.observed)
+            this.RowClicked.emit(row);
+    }
+    hideClass(column) {
+        return column.HideBelow ? `mjo-hide-${column.HideBelow}` : '';
+    }
+    /** A column's rendered value — its formatter if it has one, else the raw property. */
+    display(row, column) {
+        if (column.Format)
+            return column.Format(row);
+        const value = row[column.Key];
+        return value === null || value === undefined ? '—' : String(value);
+    }
+    static ɵfac = function MJOWorklistTableComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MJOWorklistTableComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJOWorklistTableComponent, selectors: [["mjo-worklist-table"]], inputs: { Columns: "Columns", Rows: "Rows", Presets: "Presets", ActivePreset: "ActivePreset", Searchable: "Searchable", Search: "Search", SearchPlaceholder: "SearchPlaceholder", SortKey: "SortKey", SortDescending: "SortDescending", RowKey: "RowKey", SelectedKey: "SelectedKey", EmptyTitle: "EmptyTitle", EmptyHint: "EmptyHint", EmptyIcon: "EmptyIcon", FootNote: "FootNote" }, outputs: { PresetChanged: "PresetChanged", SearchChanged: "SearchChanged", SortChanged: "SortChanged", RowClicked: "RowClicked" }, decls: 12, vars: 3, consts: [[1, "mjo-wl__toolbar"], [1, "mj-table-wrap"], [1, "mj-table"], [3, "num", "class", "width"], [3, "is-clickable", "is-selected"], [1, "small", "muted", "mjo-wl__note"], [1, "mjo-search"], ["role", "group", "aria-label", "Quick filters", 1, "row", "wrap", "mjo-wl__presets"], ["aria-hidden", "true", 1, "fa-solid", "fa-magnifying-glass"], [3, "input", "value", "placeholder"], ["type", "button", 1, "mj-filter-chip", 3, "is-active"], ["type", "button", 1, "mj-filter-chip", 3, "click"], ["aria-hidden", "true", 3, "class"], [1, "count"], ["aria-hidden", "true"], [1, "sortable"], [1, "sortable", 3, "click"], ["aria-hidden", "true", 1, "fa-solid"], [3, "click"], [3, "num", "mono", "class"], [1, "mj-chip", 3, "class"], [1, "secondary"], [1, "mj-chip"], [1, "mj-empty", "mjo-wl__empty"], [1, "t"], [1, "small"]], template: function MJOWorklistTableComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵconditionalCreate(0, MJOWorklistTableComponent_Conditional_0_Template, 3, 2, "div", 0);
+            i0.ɵɵdomElementStart(1, "div", 1)(2, "table", 2)(3, "thead")(4, "tr");
+            i0.ɵɵrepeaterCreate(5, MJOWorklistTableComponent_For_6_Template, 3, 7, "th", 3, _forTrack0);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(7, "tbody");
+            i0.ɵɵrepeaterCreate(8, MJOWorklistTableComponent_For_9_Template, 3, 4, "tr", 4, ctx.trackRow, true, MJOWorklistTableComponent_ForEmpty_10_Template, 8, 5, "tr");
+            i0.ɵɵdomElementEnd()()();
+            i0.ɵɵconditionalCreate(11, MJOWorklistTableComponent_Conditional_11_Template, 2, 1, "div", 5);
+        } if (rf & 2) {
+            i0.ɵɵconditional(ctx.Presets.length || ctx.Searchable ? 0 : -1);
+            i0.ɵɵadvance(5);
+            i0.ɵɵrepeater(ctx.Columns);
+            i0.ɵɵadvance(3);
+            i0.ɵɵrepeater(ctx.Rows);
+            i0.ɵɵadvance(3);
+            i0.ɵɵconditional(ctx.FootNote ? 11 : -1);
+        } }, dependencies: [CommonModule], styles: [".mjo-wl__toolbar[_ngcontent-%COMP%] {\n                display: flex;\n                align-items: center;\n                gap: var(--mj-space-3);\n                flex-wrap: wrap;\n                margin-bottom: var(--mj-space-4);\n            }\n            .mjo-wl__presets[_ngcontent-%COMP%] {\n                gap: 6px;\n            }\n            .mjo-wl__empty[_ngcontent-%COMP%] {\n                padding: var(--mj-space-8);\n            }\n            .mjo-wl__note[_ngcontent-%COMP%] {\n                margin-top: var(--mj-space-3);\n            }\n\n            \n\n\n            @media (max-width: 1000px) {\n                .mjo-hide-1000[_ngcontent-%COMP%] { display: none; }\n            }\n            @media (max-width: 760px) {\n                .mjo-hide-760[_ngcontent-%COMP%] { display: none; }\n            }\n            @media (max-width: 560px) {\n                .mjo-hide-560[_ngcontent-%COMP%] { display: none; }\n            }"] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJOWorklistTableComponent, [{
+        type: Component,
+        args: [{ selector: 'mjo-worklist-table', standalone: true, imports: [CommonModule], template: `
+        @if (Presets.length || Searchable) {
+            <div class="mjo-wl__toolbar">
+                @if (Searchable) {
+                    <div class="mjo-search">
+                        <i class="fa-solid fa-magnifying-glass" aria-hidden="true"></i>
+                        <input
+                            [value]="Search"
+                            (input)="SearchChanged.emit($any($event.target).value)"
+                            [placeholder]="SearchPlaceholder"
+                            [attr.aria-label]="SearchPlaceholder">
+                    </div>
+                }
+
+                @if (Presets.length) {
+                    <div class="row wrap mjo-wl__presets" role="group" aria-label="Quick filters">
+                        @for (preset of Presets; track preset.Key) {
+                            <button
+                                type="button"
+                                class="mj-filter-chip"
+                                [class.is-active]="preset.Key === ActivePreset"
+                                [attr.aria-pressed]="preset.Key === ActivePreset"
+                                (click)="PresetChanged.emit(preset.Key)">
+                                @if (preset.Icon) {
+                                    <i [class]="preset.Icon" aria-hidden="true"></i>
+                                }
+                                {{ preset.Label }}
+                                @if (preset.Count) {
+                                    <span class="count">{{ preset.Count }}</span>
+                                }
+                            </button>
+                        }
+                    </div>
+                }
+            </div>
+        }
+
+        <div class="mj-table-wrap">
+            <table class="mj-table">
+                <thead>
+                    <tr>
+                        @for (column of Columns; track column.Key) {
+                            <th
+                                [class.num]="column.Kind === 'money' || column.Kind === 'number'"
+                                [class]="hideClass(column)"
+                                [style.width]="column.Width">
+                                @if (column.Sortable) {
+                                    <span class="sortable" (click)="SortChanged.emit(column.Key)">
+                                        {{ column.Label }}
+                                        <i
+                                            class="fa-solid"
+                                            [class.fa-sort]="SortKey !== column.Key"
+                                            [class.fa-sort-down]="SortKey === column.Key && SortDescending"
+                                            [class.fa-sort-up]="SortKey === column.Key && !SortDescending"
+                                            aria-hidden="true"></i>
+                                    </span>
+                                } @else {
+                                    {{ column.Label }}
+                                }
+                            </th>
+                        }
+                    </tr>
+                </thead>
+
+                <tbody>
+                    @for (row of Rows; track trackRow($index, row)) {
+                        <tr
+                            [class.is-clickable]="RowClicked.observed"
+                            [class.is-selected]="isSelected(row)"
+                            (click)="onRowClick(row)">
+                            @for (column of Columns; track column.Key) {
+                                <td
+                                    [class.num]="column.Kind === 'money' || column.Kind === 'number'"
+                                    [class.mono]="column.Kind === 'mono'"
+                                    [class]="hideClass(column)">
+                                    @if (column.Kind === 'chip') {
+                                        <span class="mj-chip" [class]="column.ChipClass?.(row) ?? ''">
+                                            {{ display(row, column) }}
+                                        </span>
+                                    } @else {
+                                        {{ display(row, column) }}
+                                    }
+                                    @if (column.Secondary?.(row); as secondary) {
+                                        <div class="secondary">{{ secondary }}</div>
+                                    }
+                                </td>
+                            }
+                        </tr>
+                    } @empty {
+                        <tr>
+                            <td [attr.colspan]="Columns.length">
+                                <div class="mj-empty mjo-wl__empty">
+                                    <i [class]="EmptyIcon" aria-hidden="true"></i>
+                                    <div class="t">{{ EmptyTitle }}</div>
+                                    <div class="small">{{ EmptyHint }}</div>
+                                </div>
+                            </td>
+                        </tr>
+                    }
+                </tbody>
+            </table>
+        </div>
+
+        @if (FootNote) {
+            <div class="small muted mjo-wl__note">{{ FootNote }}</div>
+        }
+    `, styles: ["\n            .mjo-wl__toolbar {\n                display: flex;\n                align-items: center;\n                gap: var(--mj-space-3);\n                flex-wrap: wrap;\n                margin-bottom: var(--mj-space-4);\n            }\n            .mjo-wl__presets {\n                gap: 6px;\n            }\n            .mjo-wl__empty {\n                padding: var(--mj-space-8);\n            }\n            .mjo-wl__note {\n                margin-top: var(--mj-space-3);\n            }\n\n            /* Columns drop in a stated order rather than the table scrolling\n               sideways and hiding data without admitting it. */\n            @media (max-width: 1000px) {\n                .mjo-hide-1000 { display: none; }\n            }\n            @media (max-width: 760px) {\n                .mjo-hide-760 { display: none; }\n            }\n            @media (max-width: 560px) {\n                .mjo-hide-560 { display: none; }\n            }\n        "] }]
+    }], null, { Columns: [{
+            type: Input
+        }], Rows: [{
+            type: Input
+        }], Presets: [{
+            type: Input
+        }], ActivePreset: [{
+            type: Input
+        }], Searchable: [{
+            type: Input
+        }], Search: [{
+            type: Input
+        }], SearchPlaceholder: [{
+            type: Input
+        }], SortKey: [{
+            type: Input
+        }], SortDescending: [{
+            type: Input
+        }], RowKey: [{
+            type: Input
+        }], SelectedKey: [{
+            type: Input
+        }], EmptyTitle: [{
+            type: Input
+        }], EmptyHint: [{
+            type: Input
+        }], EmptyIcon: [{
+            type: Input
+        }], FootNote: [{
+            type: Input
+        }], PresetChanged: [{
+            type: Output
+        }], SearchChanged: [{
+            type: Output
+        }], SortChanged: [{
+            type: Output
+        }], RowClicked: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJOWorklistTableComponent, { className: "MJOWorklistTableComponent", filePath: "lib/panels/worklist-table.component.ts", lineNumber: 239 }); })();
+//# sourceMappingURL=worklist-table.component.js.map

package/dist/lib/panels/worklist-table.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"worklist-table.component.js","sourceRoot":"","sources":["../../../src/lib/panels/worklist-table.component.ts"],"names":[],"mappings":"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"}