@floegence/floe-webapp-core 0.39.7 → 0.39.9

package/dist/components/ui/Dialog.js

@@ -1,15 +1,15 @@
-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 u } from "solid-js/web";
+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 { 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 x, projectSurfacePortalRect as ie, resolveSurfacePortalBoundaryRect as le, resolveSurfacePortalMount as ae } from "./dialogSurfaceScope.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 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">'), ve = /* @__PURE__ */ u("<div>");
-const we = {
+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 = {
   display: "none"
 };
 function be(e) {
@@ -32,26 +32,26 @@ function pe(e) {
   }
   window.clearTimeout(e);
 }
-function $e(e) {
+function xe(e) {
   const o = J(), T = () => `dialog-${o}-title`, D = () => `dialog-${o}-description`;
   let _;
-  const [v, q] = P(null), [M, G] = P(0), [L, z] = P(0), E = () => e.open && !!v() && M() > 0, s = ce({
+  const [w, q] = P(null), [M, G] = P(0), [L, z] = P(0), E = () => e.open && !!w() && M() > 0, u = ce({
     open: E,
     exitDurationMs: 120
-  }), C = () => s.mounted() && !!v() && M() > 0, U = (t) => {
+  }), C = () => u.mounted() && !!w() && M() > 0, U = (t) => {
     q(t), be(() => {
-      ee(v) === t && G((l) => l + 1);
+      ee(w) === t && G((l) => l + 1);
     });
-  }, w = N(() => C() ? oe({
-    owner: v()
+  }, v = N(() => C() ? oe({
+    owner: w()
   }) : {
     host: null,
     boundaryHost: null,
     mountHost: null,
     mode: "global"
-  }), b = () => `dialog-boundary-${o}`, r = () => F(w()), V = () => ae(w()), A = (t) => ie(le(t), t), K = () => A(w()), y = N(() => (L(), K())), W = (t) => typeof Element < "u" && t instanceof Element ? !!t.closest(`[${x}="${b()}"]`) : typeof Node < "u" && t instanceof Node ? !!t.parentElement?.closest(`[${x}="${b()}"]`) : !1;
+  }), 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 = w();
+    const t = v();
     if (!C() || !F(t) || typeof window > "u")
       return;
     let l = !1, g = null, i = j(A(t));
@@ -59,7 +59,7 @@ function $e(e) {
       if (l || !F(t))
         return;
       const a = j(A(t));
-      a !== i && (i = a, z(($) => $ + 1));
+      a !== i && (i = a, z((x) => x + 1));
     }, m = () => {
       l || (g = ye(() => {
         p(), m();
@@ -82,8 +82,8 @@ function $e(e) {
     blockTouchMove: () => r() ? "none" : "outside",
     restoreFocus: !0
   }), [(() => {
-    var t = ue();
-    return I(U, t), f(t, "data-floe-dialog-owner-anchor", o), Y(t, we), t;
+    var t = se();
+    return I(U, t), f(t, "data-floe-dialog-owner-anchor", o), Y(t, ve), t;
   })(), n(h, {
     get when() {
       return C();
@@ -100,16 +100,16 @@ function $e(e) {
               return r() ? "surface" : "global";
             },
             get "data-floating-presence"() {
-              return s.state();
+              return u.state();
             },
             get "aria-hidden"() {
-              return s.exiting() ? "true" : void 0;
+              return u.exiting() ? "true" : void 0;
             }
           }, () => ({
             [de]: r() ? "true" : void 0
           }), {
             get class() {
-              return S(r() ? "absolute z-20 box-border p-3" : "fixed inset-0 box-border z-50 p-4", s.exiting() && "pointer-events-none");
+              return S(r() ? "absolute z-20 box-border p-3" : "fixed inset-0 box-border z-50 p-4", u.exiting() && "pointer-events-none");
             },
             get style() {
               return k(() => !!r())() ? {
@@ -120,10 +120,10 @@ function $e(e) {
               } : void 0;
             }
           }), !1, !0), f(l, "data-floe-dialog-backdrop", o), O(l, R(() => ({
-            [x]: b()
+            [$]: b()
           }), {
             get "data-floating-presence"() {
-              return s.state();
+              return u.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");
@@ -132,13 +132,13 @@ function $e(e) {
           }), !1, !1);
           var m = _;
           return typeof m == "function" ? I(m, i) : _ = i, f(i, "data-floe-dialog-panel", o), O(i, R(() => ({
-            [x]: b()
+            [$]: b()
           }), {
             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);
             },
             get "data-floating-presence"() {
-              return s.state();
+              return u.state();
             },
             role: "dialog",
             get "aria-modal"() {
@@ -156,16 +156,16 @@ function $e(e) {
               return e.title || e.description;
             },
             get children() {
-              var a = ge(), $ = a.firstChild;
-              return d($, n(h, {
+              var a = ge(), x = a.firstChild;
+              return d(x, n(h, {
                 get when() {
                   return e.title;
                 },
                 get children() {
-                  var c = se();
+                  var c = ue();
                   return d(c, () => e.title), H(() => f(c, "id", T())), c;
                 }
-              }), null), d($, n(h, {
+              }), null), d(x, n(h, {
                 get when() {
                   return e.description;
                 },
@@ -176,7 +176,7 @@ function $e(e) {
               }), null), d(a, n(B, {
                 variant: "ghost-destructive",
                 size: "icon",
-                class: "h-6 w-6 -mr-1",
+                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() {
@@ -202,7 +202,7 @@ function $e(e) {
 }
 function Be(e) {
   const o = re();
-  return n($e, {
+  return n(xe, {
     get open() {
       return e.open;
     },
@@ -241,11 +241,11 @@ function Be(e) {
       })];
     },
     get children() {
-      return e.children ?? ve();
+      return e.children ?? we();
     }
   });
 }
 export {
   Be as ConfirmDialog,
-  $e as Dialog
+  xe as Dialog
 };