@floegence/floe-webapp-core 0.40.2 → 0.40.4

package/dist/components/ui/CommandPalette.d.ts

@@ -1,4 +1,8 @@
 /**
  * Command palette / search modal
  */
-export declare function CommandPalette(): import("solid-js").JSX.Element;
+export interface CommandPaletteProps {
+    /** Optional global stacking layer shared by the backdrop and palette panel. */
+    zIndex?: number;
+}
+export declare function CommandPalette(props?: CommandPaletteProps): import("solid-js").JSX.Element;

package/dist/components/ui/CommandPalette.js

@@ -1,23 +1,23 @@
-import { createComponent as s, Portal as R, effect as w, setAttribute as g, insert as i, Dynamic as z, className as D, template as u, use as E, delegateEvents as I } from "solid-js/web";
-import { createSignal as T, createEffect as j, createMemo as B, Show as x, For as F } from "solid-js";
-import { cn as M } from "../../utils/cn.js";
-import { useCommand as H } from "../../context/CommandContext.js";
-import { Search as L } from "../icons/index.js";
-import { useResolvedFloeConfig as N } from "../../context/FloeConfigContext.js";
-import { useOverlayMask as U } from "../../hooks/useOverlayMask.js";
-import { matchKeybind as W } from "../../utils/keybind.js";
-import { createFloatingPresence as q } from "./floatingPresence.js";
-var G = /* @__PURE__ */ u('<div class="fixed inset-0 z-50 bg-background/60 backdrop-blur-sm floe-floating-presence floe-floating-backdrop">'), J = /* @__PURE__ */ u('<div><div class="flex items-center gap-3 px-4 pt-1 border-b border-border"><input type=text><kbd class="text-xs text-muted-foreground px-1.5 py-0.5 rounded bg-muted font-mono"></kbd></div><div class="max-h-80 overflow-y-auto overscroll-contain py-2">'), Q = /* @__PURE__ */ u('<div class="px-4 py-8 text-center text-sm text-muted-foreground">'), V = /* @__PURE__ */ u('<div><div class="px-4 py-1 text-xs font-semibold text-muted-foreground uppercase tracking-wider">'), X = /* @__PURE__ */ u('<span class="w-5 h-5 flex items-center justify-center text-muted-foreground">'), Y = /* @__PURE__ */ u('<span class="ml-2 text-muted-foreground text-xs">'), Z = /* @__PURE__ */ u('<kbd class="text-xs text-muted-foreground px-1.5 py-0.5 rounded bg-muted font-mono">'), ee = /* @__PURE__ */ u('<button type=button><div class="flex-1 text-left"><span>');
-function de() {
-  const n = H(), v = N();
-  let S, y;
-  const [_, h] = T(0), f = q({
+import { createComponent as c, Portal as R, effect as C, className as _, setStyleProperty as E, setAttribute as x, insert as i, Dynamic as T, template as m, use as F, delegateEvents as j } from "solid-js/web";
+import { createSignal as B, createEffect as H, createMemo as L, Show as h, For as I } from "solid-js";
+import { cn as D } from "../../utils/cn.js";
+import { useCommand as N } from "../../context/CommandContext.js";
+import { Search as U } from "../icons/index.js";
+import { useResolvedFloeConfig as W } from "../../context/FloeConfigContext.js";
+import { useOverlayMask as q } from "../../hooks/useOverlayMask.js";
+import { matchKeybind as G } from "../../utils/keybind.js";
+import { createFloatingPresence as J } from "./floatingPresence.js";
+var Q = /* @__PURE__ */ m("<div>"), V = /* @__PURE__ */ m('<div><div class="flex items-center gap-3 px-4 pt-1 border-b border-border"><input type=text><kbd class="text-xs text-muted-foreground px-1.5 py-0.5 rounded bg-muted font-mono"></kbd></div><div class="max-h-80 overflow-y-auto overscroll-contain py-2">'), X = /* @__PURE__ */ m('<div class="px-4 py-8 text-center text-sm text-muted-foreground">'), Y = /* @__PURE__ */ m('<div><div class="px-4 py-1 text-xs font-semibold text-muted-foreground uppercase tracking-wider">'), Z = /* @__PURE__ */ m('<span class="w-5 h-5 flex items-center justify-center text-muted-foreground">'), ee = /* @__PURE__ */ m('<span class="ml-2 text-muted-foreground text-xs">'), te = /* @__PURE__ */ m('<kbd class="text-xs text-muted-foreground px-1.5 py-0.5 rounded bg-muted font-mono">'), re = /* @__PURE__ */ m('<button type=button><div class="flex-1 text-left"><span>');
+function me(b = {}) {
+  const n = N(), k = W();
+  let z, M;
+  const [S, w] = B(0), v = J({
     open: n.isOpen,
     exitDurationMs: 120
   });
-  U({
+  q({
     open: n.isOpen,
-    root: () => y,
+    root: () => M,
     onClose: () => n.close(),
     lockBodyScroll: !0,
     trapFocus: !0,
@@ -30,144 +30,147 @@ function de() {
       selector: "input"
     },
     restoreFocus: !0
-  }), j(() => {
-    n.isOpen() && (n.search(), h(0));
+  }), H(() => {
+    n.isOpen() && (n.search(), w(0));
   });
   const O = (e) => {
-    if (W(e, v.config.commands.palette.keybind)) {
+    if (G(e, k.config.commands.palette.keybind)) {
       e.preventDefault(), n.close();
       return;
     }
-    const r = n.filteredCommands();
+    const t = n.filteredCommands();
     switch (e.key) {
       case "ArrowDown": {
         e.preventDefault();
-        const t = r.length;
-        if (t <= 0) return;
-        h((a) => Math.max(0, Math.min(a + 1, t - 1)));
+        const r = t.length;
+        if (r <= 0) return;
+        w((a) => Math.max(0, Math.min(a + 1, r - 1)));
         break;
       }
       case "ArrowUp": {
         e.preventDefault();
-        const t = r.length;
-        if (t <= 0) return;
-        h((a) => Math.max(0, Math.min(a - 1, t - 1)));
+        const r = t.length;
+        if (r <= 0) return;
+        w((a) => Math.max(0, Math.min(a - 1, r - 1)));
         break;
       }
       case "Enter":
-        e.preventDefault(), r[_()] && n.execute(r[_()].id);
+        e.preventDefault(), t[S()] && n.execute(t[S()].id);
         break;
     }
-  }, A = B(() => {
-    const e = n.filteredCommands(), r = /* @__PURE__ */ new Map();
-    return e.forEach((t, a) => {
-      const b = t.category ?? "Commands", p = r.get(b);
-      p ? p.push({
-        cmd: t,
+  }, A = L(() => {
+    const e = n.filteredCommands(), t = /* @__PURE__ */ new Map();
+    return e.forEach((r, a) => {
+      const f = r.category ?? "Commands", s = t.get(f);
+      s ? s.push({
+        cmd: r,
         index: a
-      }) : r.set(b, [{
-        cmd: t,
+      }) : t.set(f, [{
+        cmd: r,
         index: a
       }]);
-    }), Array.from(r.entries());
+    }), Array.from(t.entries());
   });
-  return s(x, {
+  return c(h, {
     get when() {
-      return f.mounted();
+      return v.mounted();
     },
     get children() {
-      return s(R, {
+      return c(R, {
         get children() {
           return [(() => {
-            var e = G();
-            return e.$$click = () => n.close(), w((r) => {
-              var t = f.state(), a = f.exiting() ? "true" : void 0;
-              return t !== r.e && g(e, "data-floating-presence", r.e = t), a !== r.t && g(e, "aria-hidden", r.t = a), r;
+            var e = Q();
+            return e.$$click = () => n.close(), C((t) => {
+              var r = D("fixed inset-0 bg-background/60 backdrop-blur-sm floe-floating-presence floe-floating-backdrop", b.zIndex === void 0 && "z-50"), a = b.zIndex, f = v.state(), s = v.exiting() ? "true" : void 0;
+              return r !== t.e && _(e, t.e = r), a !== t.t && E(e, "z-index", t.t = a), f !== t.a && x(e, "data-floating-presence", t.a = f), s !== t.o && x(e, "aria-hidden", t.o = s), t;
             }, {
               e: void 0,
-              t: void 0
+              t: void 0,
+              a: void 0,
+              o: void 0
             }), e;
           })(), (() => {
-            var e = J(), r = e.firstChild, t = r.firstChild, a = t.nextSibling, b = r.nextSibling;
+            var e = V(), t = e.firstChild, r = t.firstChild, a = r.nextSibling, f = t.nextSibling;
             e.$$keydown = O;
-            var p = y;
-            typeof p == "function" ? E(p, e) : y = e, i(r, s(L, {
+            var s = M;
+            typeof s == "function" ? F(s, e) : M = e, i(t, c(U, {
               class: "w-5 h-5 text-muted-foreground flex-shrink-0"
-            }), t), t.$$input = (o) => n.setSearch(o.currentTarget.value);
-            var P = S;
-            return typeof P == "function" ? E(P, t) : S = t, i(a, () => v.config.strings.commandPalette.esc), i(b, s(x, {
+            }), r), r.$$input = (o) => n.setSearch(o.currentTarget.value);
+            var P = z;
+            return typeof P == "function" ? F(P, r) : z = r, i(a, () => k.config.strings.commandPalette.esc), i(f, c(h, {
               get when() {
                 return n.filteredCommands().length > 0;
               },
               get fallback() {
                 return (() => {
-                  var o = Q();
-                  return i(o, () => v.config.strings.commandPalette.empty), o;
+                  var o = X();
+                  return i(o, () => k.config.strings.commandPalette.empty), o;
                 })();
               },
               get children() {
-                return s(F, {
+                return c(I, {
                   get each() {
                     return A();
                   },
-                  children: ([o, k]) => (() => {
-                    var m = V(), $ = m.firstChild;
-                    return i($, o), i(m, s(F, {
-                      each: k,
+                  children: ([o, y]) => (() => {
+                    var g = Y(), $ = g.firstChild;
+                    return i($, o), i(g, c(I, {
+                      each: y,
                       children: (l) => (() => {
-                        var c = ee(), C = c.firstChild, K = C.firstChild;
-                        return c.addEventListener("mouseenter", () => h(l.index)), c.$$click = () => n.execute(l.cmd.id), i(c, s(x, {
+                        var d = re(), p = d.firstChild, K = p.firstChild;
+                        return d.addEventListener("mouseenter", () => w(l.index)), d.$$click = () => n.execute(l.cmd.id), i(d, c(h, {
                           get when() {
                             return l.cmd.icon;
                           },
                           get children() {
-                            var d = X();
-                            return i(d, s(z, {
+                            var u = Z();
+                            return i(u, c(T, {
                               get component() {
                                 return l.cmd.icon;
                               },
                               class: "w-5 h-5"
-                            })), d;
+                            })), u;
                           }
-                        }), C), i(K, () => l.cmd.title), i(C, s(x, {
+                        }), p), i(K, () => l.cmd.title), i(p, c(h, {
                           get when() {
                             return l.cmd.description;
                           },
                           get children() {
-                            var d = Y();
-                            return i(d, () => l.cmd.description), d;
+                            var u = ee();
+                            return i(u, () => l.cmd.description), u;
                           }
-                        }), null), i(c, s(x, {
+                        }), null), i(d, c(h, {
                           get when() {
                             return l.cmd.keybind;
                           },
                           get children() {
-                            var d = Z();
-                            return i(d, () => n.getKeybindDisplay(l.cmd.keybind)), d;
+                            var u = te();
+                            return i(u, () => n.getKeybindDisplay(l.cmd.keybind)), u;
                           }
-                        }), null), w(() => D(c, M("w-full flex items-center gap-3 px-4 py-2 text-sm cursor-pointer", "transition-colors duration-75", "focus:outline-none", _() === l.index ? "bg-accent text-accent-foreground" : "hover:bg-accent/50"))), c;
+                        }), null), C(() => _(d, D("w-full flex items-center gap-3 px-4 py-2 text-sm cursor-pointer", "transition-colors duration-75", "focus:outline-none", S() === l.index ? "bg-accent text-accent-foreground" : "hover:bg-accent/50"))), d;
                       })()
-                    }), null), m;
+                    }), null), g;
                   })()
                 });
               }
-            })), w((o) => {
-              var k = M("fixed left-1/2 top-[20%] z-50 -translate-x-1/2", "w-full max-w-xl", "bg-popover text-popover-foreground rounded-lg shadow-2xl", "border border-border", "floe-floating-presence floe-floating-dialog-panel", "overflow-hidden"), m = f.state(), $ = f.exiting() ? "true" : void 0, l = v.config.strings.commandPalette.placeholder, c = M("flex-1 h-12 bg-transparent text-sm", "placeholder:text-muted-foreground", "focus:outline-none");
-              return k !== o.e && D(e, o.e = k), m !== o.t && g(e, "data-floating-presence", o.t = m), $ !== o.a && g(e, "aria-hidden", o.a = $), l !== o.o && g(t, "placeholder", o.o = l), c !== o.i && D(t, o.i = c), o;
+            })), C((o) => {
+              var y = D("fixed left-1/2 top-[20%] -translate-x-1/2", b.zIndex === void 0 && "z-50", "w-full max-w-xl", "bg-popover text-popover-foreground rounded-lg shadow-2xl", "border border-border", "floe-floating-presence floe-floating-dialog-panel", "overflow-hidden"), g = b.zIndex, $ = v.state(), l = v.exiting() ? "true" : void 0, d = k.config.strings.commandPalette.placeholder, p = D("flex-1 h-12 bg-transparent text-sm", "placeholder:text-muted-foreground", "focus:outline-none");
+              return y !== o.e && _(e, o.e = y), g !== o.t && E(e, "z-index", o.t = g), $ !== o.a && x(e, "data-floating-presence", o.a = $), l !== o.o && x(e, "aria-hidden", o.o = l), d !== o.i && x(r, "placeholder", o.i = d), p !== o.n && _(r, o.n = p), o;
             }, {
               e: void 0,
               t: void 0,
               a: void 0,
               o: void 0,
-              i: void 0
-            }), w(() => t.value = n.search()), e;
+              i: void 0,
+              n: void 0
+            }), C(() => r.value = n.search()), e;
           })()];
         }
       });
     }
   });
 }
-I(["click", "keydown", "input"]);
+j(["click", "keydown", "input"]);
 export {
-  de as CommandPalette
+  me as CommandPalette
 };

package/dist/components/ui/Dialog.d.ts

@@ -8,6 +8,8 @@ export interface DialogProps {
     children: JSX.Element;
     footer?: JSX.Element;
     class?: string;
+    /** Optional stacking layer for global dialogs. Surface-scoped dialogs remain locally layered. */
+    globalZIndex?: number;
 }
 /**
  * Modal dialog component
@@ -29,5 +31,7 @@ export interface ConfirmDialogProps {
     variant?: 'default' | 'destructive';
     onConfirm: () => void | Promise<void>;
     loading?: boolean;
+    /** Optional stacking layer for the underlying global dialog. */
+    globalZIndex?: number;
 }
 export declare function ConfirmDialog(props: ConfirmDialogProps): JSX.Element;

package/dist/components/ui/Dialog.js

@@ -1,18 +1,18 @@
-import { createComponent as n, use as I, setAttribute as f, style as Y, Portal as X, spread as O, mergeProps as R, memo as k, insert as d, effect as H, template as s } from "solid-js/web";
-import { createUniqueId as J, createSignal as P, createMemo as N, createEffect as Q, onCleanup as Z, Show as h, untrack as ee } from "solid-js";
-import { cn as S } from "../../utils/cn.js";
-import { Button as B } from "./Button.js";
+import { createComponent as r, use as E, setAttribute as f, style as W, Portal as Y, spread as R, mergeProps as k, memo as P, insert as d, effect as H, template as u } from "solid-js/web";
+import { createUniqueId as X, createSignal as S, createMemo as N, createEffect as J, onCleanup as Q, Show as h, untrack as ee } from "solid-js";
+import { cn as p } from "../../utils/cn.js";
+import { Button as I } from "./Button.js";
 import { X as te } from "../icons/index.js";
-import { useResolvedFloeConfig as re } from "../../context/FloeConfigContext.js";
-import { useOverlayMask as ne } from "../../hooks/useOverlayMask.js";
-import { resolveSurfacePortalHost as oe, isSurfacePortalMode as F, DIALOG_SURFACE_BOUNDARY_ATTR as $, projectSurfacePortalRect as ie, resolveSurfacePortalBoundaryRect as le, resolveSurfacePortalMount as ae } from "./dialogSurfaceScope.js";
+import { useResolvedFloeConfig as ne } from "../../context/FloeConfigContext.js";
+import { useOverlayMask as re } from "../../hooks/useOverlayMask.js";
+import { resolveSurfacePortalHost as oe, isSurfacePortalMode as F, DIALOG_SURFACE_BOUNDARY_ATTR as _, projectSurfacePortalRect as ie, resolveSurfacePortalBoundaryRect as le, resolveSurfacePortalMount as ae } from "./dialogSurfaceScope.js";
 import { LOCAL_INTERACTION_SURFACE_ATTR as de } from "./localInteractionSurface.js";
 import { createFloatingPresence as ce } from "./floatingPresence.js";
-var se = /* @__PURE__ */ s("<span aria-hidden=true>"), ue = /* @__PURE__ */ s('<h2 class="text-sm font-semibold">'), fe = /* @__PURE__ */ s('<p class="mt-0.5 text-xs text-muted-foreground">'), ge = /* @__PURE__ */ s('<div class="flex items-start justify-between p-3 border-b border-border"><div>'), me = /* @__PURE__ */ s('<div class="flex items-center justify-end gap-2 p-3 border-t border-border">'), he = /* @__PURE__ */ s('<div><div></div><div class="relative z-[1] flex h-full w-full items-center justify-center"><div><div class="flex-1 overflow-auto overscroll-contain p-3">'), we = /* @__PURE__ */ s("<div>");
-const ve = {
+var ue = /* @__PURE__ */ u("<span aria-hidden=true>"), se = /* @__PURE__ */ u('<h2 class="text-sm font-semibold">'), fe = /* @__PURE__ */ u('<p class="mt-0.5 text-xs text-muted-foreground">'), ge = /* @__PURE__ */ u('<div class="flex items-start justify-between p-3 border-b border-border"><div>'), me = /* @__PURE__ */ u('<div class="flex items-center justify-end gap-2 p-3 border-t border-border">'), he = /* @__PURE__ */ u('<div><div></div><div class="relative z-[1] flex h-full w-full items-center justify-center"><div><div class="flex-1 overflow-auto overscroll-contain p-3">'), be = /* @__PURE__ */ u("<div>");
+const we = {
   display: "none"
 };
-function be(e) {
+function ve(e) {
   if (typeof queueMicrotask == "function") {
     queueMicrotask(e);
     return;
@@ -25,168 +25,170 @@ function j(e) {
 function ye(e) {
   return typeof window < "u" && typeof window.requestAnimationFrame == "function" ? window.requestAnimationFrame(e) : window.setTimeout(() => e(Date.now()), 16);
 }
-function pe(e) {
+function xe(e) {
   if (typeof window < "u" && typeof window.cancelAnimationFrame == "function") {
     window.cancelAnimationFrame(e);
     return;
   }
   window.clearTimeout(e);
 }
-function xe(e) {
-  const o = J(), T = () => `dialog-${o}-title`, D = () => `dialog-${o}-description`;
-  let _;
-  const [w, q] = P(null), [M, G] = P(0), [L, z] = P(0), E = () => e.open && !!w() && M() > 0, u = ce({
-    open: E,
+function $e(e) {
+  const o = X(), B = () => `dialog-${o}-title`, T = () => `dialog-${o}-description`;
+  let C;
+  const [b, q] = S(null), [D, G] = S(0), [z, L] = S(0), M = () => e.open && !!b() && D() > 0, s = ce({
+    open: M,
     exitDurationMs: 120
-  }), C = () => u.mounted() && !!w() && M() > 0, U = (t) => {
-    q(t), be(() => {
-      ee(w) === t && G((l) => l + 1);
+  }), A = () => s.mounted() && !!b() && D() > 0, U = (t) => {
+    q(t), ve(() => {
+      ee(b) === t && G((l) => l + 1);
     });
-  }, v = N(() => C() ? oe({
-    owner: w()
+  }, w = N(() => A() ? oe({
+    owner: b()
   }) : {
     host: null,
     boundaryHost: null,
     mountHost: null,
     mode: "global"
-  }), b = () => `dialog-boundary-${o}`, r = () => F(v()), V = () => ae(v()), A = (t) => ie(le(t), t), K = () => A(v()), y = N(() => (L(), K())), W = (t) => typeof Element < "u" && t instanceof Element ? !!t.closest(`[${$}="${b()}"]`) : typeof Node < "u" && t instanceof Node ? !!t.parentElement?.closest(`[${$}="${b()}"]`) : !1;
-  return Q(() => {
-    const t = v();
-    if (!C() || !F(t) || typeof window > "u")
+  }), v = () => `dialog-boundary-${o}`, n = () => F(w()), V = () => ae(w()), O = (t) => ie(le(t), t), Z = () => O(w()), y = N(() => (z(), Z())), K = (t) => typeof Element < "u" && t instanceof Element ? !!t.closest(`[${_}="${v()}"]`) : typeof Node < "u" && t instanceof Node ? !!t.parentElement?.closest(`[${_}="${v()}"]`) : !1;
+  return J(() => {
+    const t = w();
+    if (!A() || !F(t) || typeof window > "u")
       return;
-    let l = !1, g = null, i = j(A(t));
-    const p = () => {
+    let l = !1, g = null, i = j(O(t));
+    const x = () => {
       if (l || !F(t))
         return;
-      const a = j(A(t));
-      a !== i && (i = a, z((x) => x + 1));
+      const a = j(O(t));
+      a !== i && (i = a, L(($) => $ + 1));
     }, m = () => {
       l || (g = ye(() => {
-        p(), m();
+        x(), m();
       }));
     };
-    m(), Z(() => {
-      l = !0, g !== null && pe(g);
+    m(), Q(() => {
+      l = !0, g !== null && xe(g);
     });
-  }), ne({
-    open: E,
-    root: () => _,
-    containsTarget: r() ? (t) => W(t) : void 0,
+  }), re({
+    open: M,
+    root: () => C,
+    containsTarget: n() ? (t) => K(t) : void 0,
     onClose: () => e.onOpenChange(!1),
-    lockBodyScroll: () => !r(),
+    lockBodyScroll: () => !n(),
     trapFocus: !0,
-    closeOnEscape: () => r() ? "inside" : !0,
+    closeOnEscape: () => n() ? "inside" : !0,
     blockHotkeys: !0,
     // Block scroll bleed outside the dialog while keeping the dialog content scrollable.
-    blockWheel: () => r() ? "none" : "outside",
-    blockTouchMove: () => r() ? "none" : "outside",
+    blockWheel: () => n() ? "none" : "outside",
+    blockTouchMove: () => n() ? "none" : "outside",
     restoreFocus: !0
   }), [(() => {
-    var t = se();
-    return I(U, t), f(t, "data-floe-dialog-owner-anchor", o), Y(t, ve), t;
-  })(), n(h, {
+    var t = ue();
+    return E(U, t), f(t, "data-floe-dialog-owner-anchor", o), W(t, we), t;
+  })(), r(h, {
     get when() {
-      return C();
+      return A();
     },
     get children() {
-      return n(X, {
+      return r(Y, {
         get mount() {
           return V();
         },
         get children() {
-          var t = he(), l = t.firstChild, g = l.nextSibling, i = g.firstChild, p = i.firstChild;
-          f(t, "data-floe-dialog-overlay-root", o), O(t, R({
+          var t = he(), l = t.firstChild, g = l.nextSibling, i = g.firstChild, x = i.firstChild;
+          f(t, "data-floe-dialog-overlay-root", o), R(t, k({
             get "data-floe-dialog-mode"() {
-              return r() ? "surface" : "global";
+              return n() ? "surface" : "global";
             },
             get "data-floating-presence"() {
-              return u.state();
+              return s.state();
             },
             get "aria-hidden"() {
-              return u.exiting() ? "true" : void 0;
+              return s.exiting() ? "true" : void 0;
             }
           }, () => ({
-            [de]: r() ? "true" : void 0
+            [de]: n() ? "true" : void 0
           }), {
             get class() {
-              return S(r() ? "absolute z-20 box-border p-3" : "fixed inset-0 box-border z-50 p-4", u.exiting() && "pointer-events-none");
+              return p(n() ? "absolute z-20 box-border p-3" : p("fixed inset-0 box-border p-4", e.globalZIndex === void 0 && "z-50"), s.exiting() && "pointer-events-none");
             },
             get style() {
-              return k(() => !!r())() ? {
+              return P(() => !!n())() ? {
                 left: `${y().left}px`,
                 top: `${y().top}px`,
                 width: `${y().width}px`,
                 height: `${y().height}px`
-              } : void 0;
+              } : {
+                "z-index": e.globalZIndex
+              };
             }
-          }), !1, !0), f(l, "data-floe-dialog-backdrop", o), O(l, R(() => ({
-            [$]: b()
+          }), !1, !0), f(l, "data-floe-dialog-backdrop", o), R(l, k(() => ({
+            [_]: v()
           }), {
             get "data-floating-presence"() {
-              return u.state();
+              return s.state();
             },
             get class() {
-              return S("absolute inset-0 cursor-pointer floe-floating-presence floe-floating-backdrop", r() ? "bg-background/72 backdrop-blur-[2px]" : "bg-background/80 backdrop-blur-sm");
+              return p("absolute inset-0 cursor-pointer floe-floating-presence floe-floating-backdrop", n() ? "bg-background/72 backdrop-blur-[2px]" : "bg-background/80 backdrop-blur-sm");
             },
             onClick: () => e.onOpenChange(!1)
           }), !1, !1);
-          var m = _;
-          return typeof m == "function" ? I(m, i) : _ = i, f(i, "data-floe-dialog-panel", o), O(i, R(() => ({
-            [$]: b()
+          var m = C;
+          return typeof m == "function" ? E(m, i) : C = i, f(i, "data-floe-dialog-panel", o), R(i, k(() => ({
+            [_]: v()
           }), {
             get class() {
-              return S(r() ? "flex max-h-[calc(100%-1rem)] w-[min(32rem,calc(100%-1rem))] max-w-[calc(100%-1rem)] flex-col" : "w-full max-w-md max-h-[85vh]", "bg-card text-card-foreground rounded-md shadow-lg", "border border-border", "floe-floating-presence floe-floating-dialog-panel", "flex flex-col", e.class);
+              return p(n() ? "flex max-h-[calc(100%-1rem)] w-[min(32rem,calc(100%-1rem))] max-w-[calc(100%-1rem)] flex-col" : "w-full max-w-md max-h-[85vh]", "bg-card text-card-foreground rounded-md shadow-lg", "border border-border", "floe-floating-presence floe-floating-dialog-panel", "flex flex-col", e.class);
             },
             get "data-floating-presence"() {
-              return u.state();
+              return s.state();
             },
             role: "dialog",
             get "aria-modal"() {
-              return r() ? void 0 : "true";
+              return n() ? void 0 : "true";
             },
             get "aria-labelledby"() {
-              return k(() => !!e.title)() ? T() : void 0;
+              return P(() => !!e.title)() ? B() : void 0;
             },
             get "aria-describedby"() {
-              return k(() => !!e.description)() ? D() : void 0;
+              return P(() => !!e.description)() ? T() : void 0;
             },
             tabIndex: -1
-          }), !1, !0), d(i, n(h, {
+          }), !1, !0), d(i, r(h, {
             get when() {
               return e.title || e.description;
             },
             get children() {
-              var a = ge(), x = a.firstChild;
-              return d(x, n(h, {
+              var a = ge(), $ = a.firstChild;
+              return d($, r(h, {
                 get when() {
                   return e.title;
                 },
                 get children() {
-                  var c = ue();
-                  return d(c, () => e.title), H(() => f(c, "id", T())), c;
+                  var c = se();
+                  return d(c, () => e.title), H(() => f(c, "id", B())), c;
                 }
-              }), null), d(x, n(h, {
+              }), null), d($, r(h, {
                 get when() {
                   return e.description;
                 },
                 get children() {
                   var c = fe();
-                  return d(c, () => e.description), H(() => f(c, "id", D())), c;
+                  return d(c, () => e.description), H(() => f(c, "id", T())), c;
                 }
-              }), null), d(a, n(B, {
+              }), null), d(a, r(I, {
                 variant: "ghost-destructive",
                 size: "icon",
                 class: "-my-2 -mr-2 h-[46px] w-[46px] shrink-0 sm:my-0 sm:-mr-1 sm:h-6 sm:w-6",
                 onClick: () => e.onOpenChange(!1),
                 "aria-label": "Close",
                 get children() {
-                  return n(te, {
+                  return r(te, {
                     class: "w-3.5 h-3.5"
                   });
                 }
               }), null), a;
             }
-          }), p), d(p, () => e.children), d(i, n(h, {
+          }), x), d(x, () => e.children), d(i, r(h, {
             get when() {
               return e.footer;
             },
@@ -200,9 +202,9 @@ function xe(e) {
     }
   })];
 }
-function Be(e) {
-  const o = re();
-  return n(xe, {
+function Ie(e) {
+  const o = ne();
+  return r($e, {
     get open() {
       return e.open;
     },
@@ -215,8 +217,11 @@ function Be(e) {
     get description() {
       return e.description;
     },
+    get globalZIndex() {
+      return e.globalZIndex;
+    },
     get footer() {
-      return [n(B, {
+      return [r(I, {
         variant: "ghost",
         onClick: () => e.onOpenChange(!1),
         get disabled() {
@@ -225,7 +230,7 @@ function Be(e) {
         get children() {
           return e.cancelText ?? o.config.strings.confirmDialog.cancel;
         }
-      }), n(B, {
+      }), r(I, {
         get variant() {
           return e.variant === "destructive" ? "destructive" : "primary";
         },
@@ -241,11 +246,11 @@ function Be(e) {
       })];
     },
     get children() {
-      return e.children ?? we();
+      return e.children ?? be();
     }
   });
 }
 export {
-  Be as ConfirmDialog,
-  xe as Dialog
+  Ie as ConfirmDialog,
+  $e as Dialog
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@floegence/floe-webapp-core",
-  "version": "0.40.2",
+  "version": "0.40.4",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",