@melodicdev/components 1.6.6 → 1.6.7

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",
@@ -13789,7 +13789,7 @@ var ii = [
   "October",
   "November",
   "December"
-], Pe = [
+], Me = [
   "Jan",
   "Feb",
   "Mar",
@@ -13858,7 +13858,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 +13919,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 +13934,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 +13953,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 +13963,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 +17017,7 @@ sr = v([f({
     "size"
   ]
 })], sr);
-function Mi(e) {
+function Pi(e) {
   const t = e.tabs.length > 0;
   return i`
 		<div
@@ -17034,7 +17034,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 +17043,7 @@ function Mi(e) {
 		</div>
 	`;
 }
-function Pi(e, t) {
+function Mi(e, t) {
   const r = e.value === t.value;
   return i`
 		<button
@@ -17477,7 +17477,7 @@ var nr = class {
 };
 nr = v([f({
   selector: "ml-tabs",
-  template: Mi,
+  template: Pi,
   styles: Oi,
   attributes: [
     "value",
@@ -20896,7 +20896,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 +20910,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 +22124,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 +22179,7 @@ function Ms(e) {
 		</div>
 	`;
 }
-const Ps = () => _`
+const Ms = () => _`
 	:host {
 		display: block;
 		height: 100%;
@@ -22409,8 +22418,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 +23661,7 @@ const Ys = () => _`
 		}
 	}
 `;
-var Mr = class {
+var Pr = class {
   constructor() {
     this.title = "", this.description = "", this.layout = "default";
   }
@@ -23669,7 +23678,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 +23687,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 +23712,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 +23763,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 +23798,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 +23823,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 +23861,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 +23957,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/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.7",
 	"description": "Themeable UI component library built on the Melodic Framework",
 	"license": "MIT",
 	"author": "Melodic Development",