@melodicdev/components 1.6.6 → 1.6.8

package/assets/melodic-components.min.js

@@ -197,7 +197,7 @@ async function Ks(e = {}) {
 function Ke(e, t) {
   e.renderInto(t);
 }
-const Pr = Symbol("melodic.signal"), na = (e) => typeof e == "function" && Pr in e;
+const Mr = Symbol("melodic.signal"), na = (e) => typeof e == "function" && Mr in e;
 var Ue = "melodic-styles", da = `style[${Ue}], link[rel="stylesheet"][${Ue}]`, Ne = [], xe = null;
 const ca = (e) => {
   if (pa()) {
@@ -281,7 +281,7 @@ function O(e) {
     a.delete(s);
   }, o.destroy = () => {
     r || (r = !0, a.clear());
-  }, Object.defineProperty(o, Pr, {
+  }, Object.defineProperty(o, Mr, {
     value: !0,
     enumerable: !1,
     configurable: !1
@@ -2619,7 +2619,7 @@ function dt(e, t, r, a) {
         isNew: !1
       });
     } else {
-      const w = Ma(b, u, x, r, a);
+      const w = Pa(b, u, x, r, a);
       s.push({
         item: w,
         oldIndex: -1,
@@ -2636,11 +2636,11 @@ function dt(e, t, r, a) {
   let p = a.endMarker;
   for (let u = s.length - 1; u >= 0; u--) {
     const b = s[u];
-    b.isNew ? Pa(b.item, h, p) : m.has(u) || Oa(b.item, p), p = b.item.start;
+    b.isNew ? Ma(b.item, h, p) : m.has(u) || Oa(b.item, p), p = b.item.start;
   }
   a.keyToIndex = o, a.items = s.map((u) => u.item);
 }
-function Ma(e, t, r, a, l) {
+function Pa(e, t, r, a, l) {
   const o = a(e, t);
   let s, n;
   if (l.useCompiledPath && l.compiledTemplate) {
@@ -2657,7 +2657,7 @@ function Ma(e, t, r, a, l) {
     end: document.createComment("repeat-item-end")
   };
 }
-function Pa(e, t, r) {
+function Ma(e, t, r) {
   const a = document.createDocumentFragment();
   a.appendChild(e.start);
   for (const l of e.nodes) a.appendChild(l);
@@ -3791,7 +3791,7 @@ const ml = {
 	/* Default to light color scheme */
 	color-scheme: light;
 }`;
-var ve = "system", Me = /* @__PURE__ */ new Set(), ge = null;
+var ve = "system", Pe = /* @__PURE__ */ new Set(), ge = null;
 function Tn() {
   return ve;
 }
@@ -3811,10 +3811,10 @@ function hl(e) {
     document.documentElement.setAttribute("data-theme", e), $e(e, e);
 }
 function An(e) {
-  return Me.add(e), () => Me.delete(e);
+  return Pe.add(e), () => Pe.delete(e);
 }
 function $e(e, t) {
-  Me.forEach((r) => r(e, t));
+  Pe.forEach((r) => r(e, t));
 }
 function Dn() {
   hl(pl() === "light" ? "dark" : "light");
@@ -3831,7 +3831,7 @@ function In(e, t) {
   const l = document.getElementById(a.id);
   return l && l.remove(), document.head.appendChild(a), a;
 }
-function Mn(e, t) {
+function Pn(e, t) {
   const r = {};
   return t.primary && (r["--ml-color-primary"] = t.primary), t.secondary && (r["--ml-color-secondary"] = t.secondary), t.success && (r["--ml-color-success"] = t.success), t.warning && (r["--ml-color-warning"] = t.warning), t.danger && (r["--ml-color-danger"] = t.danger), Xr(e, r);
 }
@@ -4156,7 +4156,7 @@ function _l(e) {
   const t = He(e);
   return t[t.length - 1] ?? null;
 }
-function Pn(e) {
+function Mn(e) {
   const t = Qr(e);
   return t ? (t.focus(), !0) : !1;
 }
@@ -4227,9 +4227,9 @@ function Vn(e, t = "focus-visible") {
     e.removeEventListener("focus", r), e.removeEventListener("blur", a), e.classList.remove(t);
   };
 }
-var M = null;
+var P = null;
 function yl() {
-  return M && document.body.contains(M) || (M = document.createElement("div"), M.id = "ml-live-region", M.setAttribute("aria-live", "polite"), M.setAttribute("aria-atomic", "true"), M.setAttribute("role", "status"), Object.assign(M.style, {
+  return P && document.body.contains(P) || (P = document.createElement("div"), P.id = "ml-live-region", P.setAttribute("aria-live", "polite"), P.setAttribute("aria-atomic", "true"), P.setAttribute("role", "status"), Object.assign(P.style, {
     position: "absolute",
     width: "1px",
     height: "1px",
@@ -4239,7 +4239,7 @@ function yl() {
     clip: "rect(0, 0, 0, 0)",
     whiteSpace: "nowrap",
     border: "0"
-  }), document.body.appendChild(M)), M;
+  }), document.body.appendChild(P)), P;
 }
 function qn(e, t = "polite") {
   const r = yl();
@@ -5173,7 +5173,7 @@ function Il(e) {
 		</div>
 	`;
 }
-const Ml = () => _`
+const Pl = () => _`
 	:host {
 		display: block;
 		width: 100%;
@@ -5400,7 +5400,7 @@ var wt = class {
 wt = v([f({
   selector: "ml-input",
   template: Il,
-  styles: Ml,
+  styles: Pl,
   attributes: [
     "type",
     "value",
@@ -5415,7 +5415,7 @@ wt = v([f({
     "autocomplete"
   ]
 })], wt);
-function Pl(e) {
+function Ml(e) {
   return i`
 		<div
 			class=${g({
@@ -5667,7 +5667,7 @@ var yt = class {
 };
 yt = v([f({
   selector: "ml-textarea",
-  template: Pl,
+  template: Ml,
   styles: Ol,
   attributes: [
     "value",
@@ -9409,7 +9409,7 @@ I((e) => e.tagName === "ML-DATE-PICKER", {
     e.disabled = t;
   }
 });
-var Mt = class {
+var Pt = class {
   constructor() {
     this.value = "", this.placeholder = "Select date", this.label = "", this.hint = "", this.error = "", this.size = "md", this.disabled = !1, this.required = !1, this.min = "", this.max = "", this.minYear = "", this.maxYear = "", this.isOpen = !1, this._cleanupAutoUpdate = null, this.toggleCalendar = () => {
       if (this.disabled) return;
@@ -9481,7 +9481,7 @@ var Mt = class {
     return this.elementRef.shadowRoot?.querySelector(".ml-date-picker__popover");
   }
 };
-Mt = v([f({
+Pt = v([f({
   selector: "ml-date-picker",
   template: go,
   styles: vo,
@@ -9499,7 +9499,7 @@ Mt = v([f({
     "min-year",
     "max-year"
   ]
-})], Mt);
+})], Pt);
 function bo(e) {
   return i`
 		<div
@@ -9667,7 +9667,7 @@ const fo = () => _`
 		opacity: var(--ml-alert-dismiss-hover-opacity);
 	}
 `;
-var Pt = class {
+var Mt = class {
   constructor() {
     this.variant = "info", this.title = "", this.dismissible = !1, this.handleDismiss = () => {
       this.elementRef.dispatchEvent(new CustomEvent("ml:dismiss", {
@@ -9682,7 +9682,7 @@ var Pt = class {
     }[this.variant]}"></ml-icon>`;
   }
 };
-Pt = v([f({
+Mt = v([f({
   selector: "ml-alert",
   template: bo,
   styles: fo,
@@ -9691,7 +9691,7 @@ Pt = v([f({
     "title",
     "dismissible"
   ]
-})], Pt);
+})], Mt);
 var Ot = class {
   constructor() {
     this._containerEl = null, this._position = "top-right";
@@ -10886,14 +10886,14 @@ Bt = v([f({
     "wrap"
   ]
 })], Bt);
-function Mo(e) {
+function Po(e) {
   return i`
 		<div class="ml-container" style=${J(e.getStyles())}>
 			<slot></slot>
 		</div>
 	`;
 }
-const Po = () => _`
+const Mo = () => _`
 	:host {
 		display: block;
 		width: 100%;
@@ -10925,8 +10925,8 @@ var jt = class {
 };
 jt = v([f({
   selector: "ml-container",
-  template: Mo,
-  styles: Po,
+  template: Po,
+  styles: Mo,
   attributes: [
     "size",
     "padding",
@@ -12678,7 +12678,7 @@ EventTarget.prototype.addEventListener = function(e, t, r) {
 };
 var Qt = class {
   constructor() {
-    this._rowClickable = !1, this.hasFooter = !1, this.hasHeaderActions = !1, this.selectable = !1, this.striped = !1, this.hoverable = !0, this.stickyHeader = !1, this.size = "md", this.tableTitle = "", this.description = "", this.virtual = !1, this.columns = [], this.rows = [], this.sortKey = "", this.sortDirection = "asc", this.selectedIndices = [], this.startIndex = 0, this.endIndex = 50, this._scroller = new ea(), this._viewport = null, this.isRowSelected = (t) => this.selectedIndices.includes(t), this.handleSort = (t) => {
+    this._rowClickable = !1, this.hasFooter = !1, this.hasHeaderActions = !1, this.selectable = !1, this.striped = !1, this.hoverable = !0, this.stickyHeader = !1, this.size = "md", this.tableTitle = "", this.description = "", this.virtual = !1, this.manualSort = !1, this.columns = [], this.rows = [], this.sortKey = "", this.sortDirection = "asc", this.selectedIndices = [], this.startIndex = 0, this.endIndex = 50, this._scroller = new ea(), this._viewport = null, this.isRowSelected = (t) => this.selectedIndices.includes(t), this.handleSort = (t) => {
       t.sortable && (this.sortKey === t.key ? this.sortDirection = this.sortDirection === "asc" ? "desc" : "asc" : (this.sortKey = t.key, this.sortDirection = "asc"), this.selectedIndices = [], this._scroller.invalidate(), this.elementRef.dispatchEvent(new CustomEvent("ml:sort", {
         bubbles: !0,
         composed: !0,
@@ -12747,7 +12747,7 @@ var Qt = class {
   }
   /** Rows sorted by current sort key/direction */
   get sortedRows() {
-    if (!this.sortKey) return this.rows;
+    if (this.manualSort || !this.sortKey) return this.rows;
     const t = this.sortKey, r = this.sortDirection === "asc" ? 1 : -1;
     return [...this.rows].sort((a, l) => {
       const o = a[t], s = l[t];
@@ -12795,7 +12795,8 @@ Qt = v([f({
     "table-title",
     "description",
     "sticky-header",
-    "virtual"
+    "virtual",
+    "manual-sort"
   ]
 })], Qt);
 function ai(e, t, r) {
@@ -13789,7 +13790,7 @@ var ii = [
   "October",
   "November",
   "December"
-], Pe = [
+], Me = [
   "Jan",
   "Feb",
   "Mar",
@@ -13858,7 +13859,7 @@ function rr(e) {
   return `${ii[e.getMonth()]} ${e.getFullYear()}`;
 }
 function di(e, t) {
-  const r = Pe[e.getMonth()], a = Pe[t.getMonth()];
+  const r = Me[e.getMonth()], a = Me[t.getMonth()];
   return e.getMonth() === t.getMonth() && e.getFullYear() === t.getFullYear() ? `${r} ${e.getDate()} – ${t.getDate()}, ${e.getFullYear()}` : e.getFullYear() === t.getFullYear() ? `${r} ${e.getDate()} – ${a} ${t.getDate()}, ${e.getFullYear()}` : `${r} ${e.getDate()}, ${e.getFullYear()} – ${a} ${t.getDate()}, ${t.getFullYear()}`;
 }
 function ar(e, t, r = 0) {
@@ -13919,12 +13920,12 @@ function fe(e, t) {
   return e.filter((r) => r.start.split("T")[0] === t);
 }
 function mi(e) {
-  return Pe[e.getMonth()];
+  return Me[e.getMonth()];
 }
 function pi(e) {
   return ra[e.getDay()];
 }
-function P(e) {
+function M(e) {
   const t = new Date(e);
   return t.getHours() * 60 + t.getMinutes();
 }
@@ -13934,13 +13935,13 @@ function or(e) {
 function oa(e) {
   if (e.length === 0) return [];
   const t = [...e].sort((n, c) => {
-    const m = P(n.start), h = P(c.start);
+    const m = M(n.start), h = M(c.start);
     if (m !== h) return m - h;
-    const p = P(n.end) - m;
-    return P(c.end) - h - p;
+    const p = M(n.end) - m;
+    return M(c.end) - h - p;
   }), r = [], a = /* @__PURE__ */ new Map();
   for (const n of t) {
-    const c = P(n.start), m = P(n.end);
+    const c = M(n.start), m = M(n.end);
     let h = !1;
     for (let p = 0; p < r.length; p++) if (r[p][r[p].length - 1].end <= c) {
       r[p].push({ end: m }), a.set(n.id, p), h = !0;
@@ -13953,9 +13954,9 @@ function oa(e) {
     if (o.has(n.id)) continue;
     const c = [n];
     o.add(n.id);
-    let m = P(n.end), h = a.get(n.id) + 1;
+    let m = M(n.end), h = a.get(n.id) + 1;
     for (const p of t)
-      o.has(p.id) || P(p.start) < m && (c.push(p), o.add(p.id), m = Math.max(m, P(p.end)), h = Math.max(h, a.get(p.id) + 1));
+      o.has(p.id) || M(p.start) < m && (c.push(p), o.add(p.id), m = Math.max(m, M(p.end)), h = Math.max(h, a.get(p.id) + 1));
     l.push({
       events: c,
       totalColumns: h
@@ -13963,7 +13964,7 @@ function oa(e) {
   }
   const s = [];
   for (const n of l) for (const c of n.events) {
-    const m = P(c.start), h = P(c.end), p = a.get(c.id), u = n.totalColumns;
+    const m = M(c.start), h = M(c.end), p = a.get(c.id), u = n.totalColumns;
     s.push({
       event: c,
       gridRowStart: or(m),
@@ -17017,7 +17018,7 @@ sr = v([f({
     "size"
   ]
 })], sr);
-function Mi(e) {
+function Pi(e) {
   const t = e.tabs.length > 0;
   return i`
 		<div
@@ -17034,7 +17035,7 @@ function Mi(e) {
 				aria-orientation=${e.orientation}
 				@keydown=${e.handleKeyDown}
 			>
-				${t ? k(e.tabs, (r) => `${r.value}-${e.value === r.value}`, (r) => Pi(e, r)) : i`<slot name="tab" @slotchange=${e.handleTabSlotChange}></slot>`}
+				${t ? k(e.tabs, (r) => `${r.value}-${e.value === r.value}`, (r) => Mi(e, r)) : i`<slot name="tab" @slotchange=${e.handleTabSlotChange}></slot>`}
 			</div>
 
 			<div class="ml-tabs__panels">
@@ -17043,7 +17044,7 @@ function Mi(e) {
 		</div>
 	`;
 }
-function Pi(e, t) {
+function Mi(e, t) {
   const r = e.value === t.value;
   return i`
 		<button
@@ -17477,7 +17478,7 @@ var nr = class {
 };
 nr = v([f({
   selector: "ml-tabs",
-  template: Mi,
+  template: Pi,
   styles: Oi,
   attributes: [
     "value",
@@ -20896,7 +20897,7 @@ var _s = class {
     this._dialogEl.showModal(), this._afterOpenedCallback?.();
   }
   close(e) {
-    this._dialogEl.close(), this._afterClosedCallback?.(e);
+    this._dismissDescendantPopovers(this._dialogEl), this._dialogEl.close(), this._afterClosedCallback?.(e);
   }
   afterOpened(e) {
     this._afterOpenedCallback = e;
@@ -20910,6 +20911,15 @@ var _s = class {
   onBackdropClick(e) {
     e.target === this._dialogEl && !this._disableClose && this.close();
   }
+  _dismissDescendantPopovers(e) {
+    e.querySelectorAll("*").forEach((t) => {
+      if (t.hasAttribute("popover")) try {
+        t.hidePopover();
+      } catch {
+      }
+      t.shadowRoot && this._dismissDescendantPopovers(t.shadowRoot);
+    });
+  }
 }, le = class {
   constructor() {
     this._dialogs = /* @__PURE__ */ new Map();
@@ -22115,7 +22125,7 @@ Er = v([f({
     "arrow"
   ]
 })], Er);
-function Ms(e) {
+function Ps(e) {
   const t = e["sidebar-position"] === "right", r = e["sidebar-collapsed"], a = e["header-fixed"], l = e.mobileOpen, o = e.mobile;
   return i`
 		<div
@@ -22170,7 +22180,7 @@ function Ms(e) {
 		</div>
 	`;
 }
-const Ps = () => _`
+const Ms = () => _`
 	:host {
 		display: block;
 		height: 100%;
@@ -22409,8 +22419,8 @@ var Rr = class {
 };
 Rr = v([f({
   selector: "ml-app-shell",
-  template: Ms,
-  styles: Ps,
+  template: Ps,
+  styles: Ms,
   attributes: [
     "sidebar-position",
     "sidebar-collapsed",
@@ -23652,7 +23662,7 @@ const Ys = () => _`
 		}
 	}
 `;
-var Mr = class {
+var Pr = class {
   constructor() {
     this.title = "", this.description = "", this.layout = "default";
   }
@@ -23669,7 +23679,7 @@ var Mr = class {
     return this.elementRef?.querySelector('[slot="header-actions"]') !== null;
   }
 };
-Mr = v([f({
+Pr = v([f({
   selector: "ml-dashboard-page",
   template: Hs,
   styles: Ys,
@@ -23678,14 +23688,14 @@ Mr = v([f({
     "description",
     "layout"
   ]
-})], Mr);
+})], Pr);
 export {
   fa as APP_CONFIG,
   wa as AbortError,
   se as AbstractControl,
   Xt as ActivityFeedComponent,
   Jt as ActivityFeedItemComponent,
-  Pt as AlertComponent,
+  Mt as AlertComponent,
   Rr as AppShellComponent,
   Ht as AvatarComponent,
   Yt as BadgeComponent,
@@ -23703,8 +23713,8 @@ export {
   ga as ComponentBase,
   un as ComponentStateBaseService,
   jt as ContainerComponent,
-  Mr as DashboardPageComponent,
-  Mt as DatePickerComponent,
+  Pr as DashboardPageComponent,
+  Pt as DatePickerComponent,
   Oe as DialogComponent,
   _s as DialogRef,
   le as DialogService,
@@ -23754,7 +23764,7 @@ export {
   Re as RouterLinkComponent,
   Ee as RouterOutletComponent,
   q as RouterService,
-  Pr as SIGNAL_MARKER,
+  Mr as SIGNAL_MARKER,
   Et as SelectComponent,
   G as Service,
   ur as SidebarComponent,
@@ -23789,8 +23799,8 @@ export {
   Uo as activityFeedTemplate,
   dl as allTokens,
   qn as announce,
-  Ps as appShellStyles,
-  Ms as appShellTemplate,
+  Ms as appShellStyles,
+  Ps as appShellTemplate,
   ca as applyGlobalStyles,
   hl as applyTheme,
   Jr as arrow,
@@ -23814,11 +23824,11 @@ export {
   Hn as componentBaseStyles,
   ne as computePosition,
   D as computed,
-  Po as containerStyles,
-  Mo as containerTemplate,
+  Mo as containerStyles,
+  Po as containerTemplate,
   cn as createAction,
   Cn as createAsyncValidator,
-  Mn as createBrandTheme,
+  Pn as createBrandTheme,
   Qs as createDeactivateGuard,
   wl as createFocusTrap,
   xn as createFormArray,
@@ -23852,7 +23862,7 @@ export {
   ba as environment,
   ka as findRouteByName,
   ce as flip,
-  Pn as focusFirst,
+  Mn as focusFirst,
   On as focusLast,
   Nn as focusTrap,
   Vn as focusVisible,
@@ -23948,7 +23958,7 @@ export {
   ti as tableStyles,
   ei as tableTemplate,
   Oi as tabsStyles,
-  Mi as tabsTemplate,
+  Pi as tabsTemplate,
   Xa as textAdapter,
   xo as toastContainerStyles,
   yo as toastContainerTemplate,

package/lib/components/data-display/table/table.component.d.ts

@@ -6,6 +6,16 @@ import type { TableColumn, SortDirection } from './table.types.js';
  * @example
  * ```html
  * <ml-table .columns=${columns} .rows=${rows} striped hoverable></ml-table>
+ *
+ * <!-- Server-paginated: parent handles ordering -->
+ * <ml-table
+ *     manual-sort
+ *     .columns=${columns}
+ *     .rows=${pageRows}
+ *     .sortKey=${sortKey}
+ *     .sortDirection=${sortDirection}
+ *     @ml:sort=${handleSort}
+ * ></ml-table>
  * ```
  *
  * @fires ml:sort - Emitted when a sortable column header is clicked. Detail: { key, direction }
@@ -39,6 +49,13 @@ export declare class TableComponent implements IElementRef, OnCreate, OnDestroy,
     description: string;
     /** Enable virtual scrolling (renders only visible rows) */
     virtual: boolean;
+    /**
+     * Opt out of client-side row sorting. When true, `rows` is rendered in the
+     * order provided and `sortedRows` returns it untouched, but `sortKey` /
+     * `sortDirection` still update on header clicks and `ml:sort` still fires
+     * so the consumer can re-query the server with the new ordering.
+     */
+    manualSort: boolean;
     /** Column definitions */
     columns: TableColumn[];
     /** Row data */

package/lib/components/data-display/table/table.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table.component.d.ts","sourceRoot":"","sources":["../../../../src/components/data-display/table/table.component.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACrG,OAAO,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAiBnE;;;;;;;;;;;;;;GAcG;AACH,qBAMa,cAAe,YAAW,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,gBAAgB;IAC3F,UAAU,EAAG,WAAW,CAAC;IAEhC,+DAA+D;IACxD,aAAa,UAAS;IAE7B,0CAA0C;IACnC,SAAS,UAAS;IAEzB,kDAAkD;IAC3C,gBAAgB,UAAS;IAEhC,0CAA0C;IACnC,UAAU,UAAS;IAE1B,kCAAkC;IAC3B,OAAO,UAAS;IAEvB,8BAA8B;IACvB,SAAS,UAAQ;IAExB,0BAA0B;IACnB,YAAY,UAAS;IAE5B,iBAAiB;IACV,IAAI,EAAE,IAAI,GAAG,IAAI,CAAQ;IAEhC,yBAAyB;IAClB,UAAU,SAAM;IAEvB,+BAA+B;IACxB,WAAW,SAAM;IAExB,2DAA2D;IACpD,OAAO,UAAS;IAEvB,yBAAyB;IAClB,OAAO,EAAE,WAAW,EAAE,CAAM;IAEnC,eAAe;IACR,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAM;IAE5C,kCAAkC;IAC3B,OAAO,SAAM;IAEpB,6BAA6B;IACtB,aAAa,EAAE,aAAa,CAAS;IAE5C,+BAA+B;IACxB,eAAe,EAAE,MAAM,EAAE,CAAM;IAI/B,UAAU,SAAK;IACf,QAAQ,SAAM;IAIrB,OAAO,CAAC,SAAS,CAAyB;IAC1C,OAAO,CAAC,SAAS,CAA4B;IAI7C,IAAW,SAAS,IAAI,MAAM,CAE7B;IAIM,gBAAgB,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;IAMxE,MAAM,IAAI,IAAI;IAId,QAAQ,IAAI,IAAI;IAgBhB,QAAQ,IAAI,IAAI;IAiBhB,SAAS,IAAI,IAAI;IAOxB,OAAO,CAAC,eAAe;IAgBvB,gDAAgD;IAChD,IAAW,UAAU,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAcjD;IAED,IAAW,WAAW,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAGlD;IAED,IAAW,eAAe,IAAI,MAAM,CAEnC;IAED,IAAW,kBAAkB,IAAI,MAAM,CAGtC;IAED,IAAW,QAAQ,IAAI,MAAM,CAE5B;IAED,IAAW,WAAW,IAAI,OAAO,CAEhC;IAED,IAAW,YAAY,IAAI,OAAO,CAEjC;IAEM,aAAa,GAAI,OAAO,MAAM,KAAG,OAAO,CAE7C;IAIK,UAAU,GAAI,QAAQ,WAAW,KAAG,IAAI,CAiB7C;IAEK,eAAe,QAAO,IAAI,CAO/B;IAEK,eAAe,GAAI,OAAO,MAAM,EAAE,OAAO,KAAK,KAAG,IAAI,CAQ1D;IAEK,cAAc,GAAI,KAAK,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,OAAO,MAAM,KAAG,IAAI,CAQzE;IAEF,OAAO,CAAC,UAAU;CASlB"}
+{"version":3,"file":"table.component.d.ts","sourceRoot":"","sources":["../../../../src/components/data-display/table/table.component.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACrG,OAAO,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAiBnE;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,qBAMa,cAAe,YAAW,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,gBAAgB;IAC3F,UAAU,EAAG,WAAW,CAAC;IAEhC,+DAA+D;IACxD,aAAa,UAAS;IAE7B,0CAA0C;IACnC,SAAS,UAAS;IAEzB,kDAAkD;IAC3C,gBAAgB,UAAS;IAEhC,0CAA0C;IACnC,UAAU,UAAS;IAE1B,kCAAkC;IAC3B,OAAO,UAAS;IAEvB,8BAA8B;IACvB,SAAS,UAAQ;IAExB,0BAA0B;IACnB,YAAY,UAAS;IAE5B,iBAAiB;IACV,IAAI,EAAE,IAAI,GAAG,IAAI,CAAQ;IAEhC,yBAAyB;IAClB,UAAU,SAAM;IAEvB,+BAA+B;IACxB,WAAW,SAAM;IAExB,2DAA2D;IACpD,OAAO,UAAS;IAEvB;;;;;OAKG;IACI,UAAU,UAAS;IAE1B,yBAAyB;IAClB,OAAO,EAAE,WAAW,EAAE,CAAM;IAEnC,eAAe;IACR,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAM;IAE5C,kCAAkC;IAC3B,OAAO,SAAM;IAEpB,6BAA6B;IACtB,aAAa,EAAE,aAAa,CAAS;IAE5C,+BAA+B;IACxB,eAAe,EAAE,MAAM,EAAE,CAAM;IAI/B,UAAU,SAAK;IACf,QAAQ,SAAM;IAIrB,OAAO,CAAC,SAAS,CAAyB;IAC1C,OAAO,CAAC,SAAS,CAA4B;IAI7C,IAAW,SAAS,IAAI,MAAM,CAE7B;IAIM,gBAAgB,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;IAMxE,MAAM,IAAI,IAAI;IAId,QAAQ,IAAI,IAAI;IAgBhB,QAAQ,IAAI,IAAI;IAiBhB,SAAS,IAAI,IAAI;IAOxB,OAAO,CAAC,eAAe;IAgBvB,gDAAgD;IAChD,IAAW,UAAU,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAcjD;IAED,IAAW,WAAW,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAGlD;IAED,IAAW,eAAe,IAAI,MAAM,CAEnC;IAED,IAAW,kBAAkB,IAAI,MAAM,CAGtC;IAED,IAAW,QAAQ,IAAI,MAAM,CAE5B;IAED,IAAW,WAAW,IAAI,OAAO,CAEhC;IAED,IAAW,YAAY,IAAI,OAAO,CAEjC;IAEM,aAAa,GAAI,OAAO,MAAM,KAAG,OAAO,CAE7C;IAIK,UAAU,GAAI,QAAQ,WAAW,KAAG,IAAI,CAiB7C;IAEK,eAAe,QAAO,IAAI,CAO/B;IAEK,eAAe,GAAI,OAAO,MAAM,EAAE,OAAO,KAAK,KAAG,IAAI,CAQ1D;IAEK,cAAc,GAAI,KAAK,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,OAAO,MAAM,KAAG,IAAI,CAQzE;IAEF,OAAO,CAAC,UAAU;CASlB"}

package/lib/components/data-display/table/table.component.js

@@ -25,6 +25,16 @@ EventTarget.prototype.addEventListener = function (type, listener, options) {
  * @example
  * ```html
  * <ml-table .columns=${columns} .rows=${rows} striped hoverable></ml-table>
+ *
+ * <!-- Server-paginated: parent handles ordering -->
+ * <ml-table
+ *     manual-sort
+ *     .columns=${columns}
+ *     .rows=${pageRows}
+ *     .sortKey=${sortKey}
+ *     .sortDirection=${sortDirection}
+ *     @ml:sort=${handleSort}
+ * ></ml-table>
  * ```
  *
  * @fires ml:sort - Emitted when a sortable column header is clicked. Detail: { key, direction }
@@ -58,6 +68,13 @@ let TableComponent = class TableComponent {
         this.description = '';
         /** Enable virtual scrolling (renders only visible rows) */
         this.virtual = false;
+        /**
+         * Opt out of client-side row sorting. When true, `rows` is rendered in the
+         * order provided and `sortedRows` returns it untouched, but `sortKey` /
+         * `sortDirection` still update on header clicks and `ml:sort` still fires
+         * so the consumer can re-query the server with the new ordering.
+         */
+        this.manualSort = false;
         /** Column definitions */
         this.columns = [];
         /** Row data */
@@ -192,7 +209,7 @@ let TableComponent = class TableComponent {
     // ── Data ──────────────────────────────────────────────────────────────────────
     /** Rows sorted by current sort key/direction */
     get sortedRows() {
-        if (!this.sortKey)
+        if (this.manualSort || !this.sortKey)
             return this.rows;
         const key = this.sortKey;
         const dir = this.sortDirection === 'asc' ? 1 : -1;
@@ -244,7 +261,7 @@ TableComponent = __decorate([
         selector: 'ml-table',
         template: tableTemplate,
         styles: tableStyles,
-        attributes: ['selectable', 'striped', 'hoverable', 'size', 'table-title', 'description', 'sticky-header', 'virtual']
+        attributes: ['selectable', 'striped', 'hoverable', 'size', 'table-title', 'description', 'sticky-header', 'virtual', 'manual-sort']
     })
 ], TableComponent);
 export { TableComponent };

package/lib/components/overlays/dialog/dialog-ref.class.d.ts

@@ -20,5 +20,6 @@ export declare class DialogRef<TResult = unknown, TData = unknown> {
     afterClosed(callback: (result: TResult | undefined) => void): void;
     private onCancel;
     private onBackdropClick;
+    private _dismissDescendantPopovers;
 }
 //# sourceMappingURL=dialog-ref.class.d.ts.map

package/lib/components/overlays/dialog/dialog-ref.class.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-ref.class.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/dialog/dialog-ref.class.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,qBAAa,SAAS,CAAC,OAAO,GAAG,OAAO,EAAE,KAAK,GAAG,OAAO;IASvD,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAT3B,OAAO,CAAC,oBAAoB,CAA6B;IACzD,OAAO,CAAC,oBAAoB,CAAwD;IACpF,OAAO,CAAC,KAAK,CAAoB;IACjC,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA4B;IAC1D,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAmC;gBAGtD,SAAS,EAAE,QAAQ,EACnB,SAAS,EAAE,iBAAiB;IAM9C,IAAW,QAAQ,IAAI,QAAQ,CAE9B;IAED,IAAW,IAAI,IAAI,KAAK,GAAG,SAAS,CAEnC;IAED,IAAW,YAAY,IAAI,OAAO,CAEjC;IAEM,WAAW,CAAC,MAAM,EAAE,aAAa,CAAC,KAAK,CAAC,GAAG,IAAI;IAyB/C,IAAI,IAAI,IAAI;IAKZ,KAAK,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,IAAI;IAK7B,WAAW,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,IAAI;IAIvC,WAAW,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,GAAG,IAAI;IAIzE,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,eAAe;CAKvB"}
+{"version":3,"file":"dialog-ref.class.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/dialog/dialog-ref.class.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,qBAAa,SAAS,CAAC,OAAO,GAAG,OAAO,EAAE,KAAK,GAAG,OAAO;IASvD,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAT3B,OAAO,CAAC,oBAAoB,CAA6B;IACzD,OAAO,CAAC,oBAAoB,CAAwD;IACpF,OAAO,CAAC,KAAK,CAAoB;IACjC,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA4B;IAC1D,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAmC;gBAGtD,SAAS,EAAE,QAAQ,EACnB,SAAS,EAAE,iBAAiB;IAM9C,IAAW,QAAQ,IAAI,QAAQ,CAE9B;IAED,IAAW,IAAI,IAAI,KAAK,GAAG,SAAS,CAEnC;IAED,IAAW,YAAY,IAAI,OAAO,CAEjC;IAEM,WAAW,CAAC,MAAM,EAAE,aAAa,CAAC,KAAK,CAAC,GAAG,IAAI;IAyB/C,IAAI,IAAI,IAAI;IAKZ,KAAK,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,IAAI;IAM7B,WAAW,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,IAAI;IAIvC,WAAW,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,GAAG,IAAI;IAIzE,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,0BAA0B;CAelC"}

package/lib/components/overlays/dialog/dialog-ref.class.js

@@ -43,6 +43,7 @@ export class DialogRef {
         this._afterOpenedCallback?.();
     }
     close(result) {
+        this._dismissDescendantPopovers(this._dialogEl);
         this._dialogEl.close();
         this._afterClosedCallback?.(result);
     }
@@ -62,4 +63,20 @@ export class DialogRef {
             this.close();
         }
     }
+    _dismissDescendantPopovers(root) {
+        const children = root.querySelectorAll('*');
+        children.forEach((el) => {
+            if (el.hasAttribute('popover')) {
+                try {
+                    el.hidePopover();
+                }
+                catch {
+                    // Not currently in the top layer — safe to ignore
+                }
+            }
+            if (el.shadowRoot) {
+                this._dismissDescendantPopovers(el.shadowRoot);
+            }
+        });
+    }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@melodicdev/components",
-	"version": "1.6.6",
+	"version": "1.6.8",
 	"description": "Themeable UI component library built on the Melodic Framework",
 	"license": "MIT",
 	"author": "Melodic Development",