@floegence/floe-webapp-core 0.36.68 → 0.36.69

package/dist/components/ui/FloatingWindow.js

@@ -1,28 +1,28 @@
 import { createComponent as s, Portal as Fe, spread as ae, mergeProps as de, memo as ue, insert as g, effect as u, setAttribute as Le, addEventListener as m, className as c, template as a, use as Me, delegateEvents as De } from "solid-js/web";
-import { createUniqueId as Te, createSignal as p, onMount as We, onCleanup as U, createEffect as b, Show as P, batch as ke } from "solid-js";
+import { createUniqueId as ke, createSignal as p, onMount as Te, onCleanup as U, createEffect as b, Show as P, batch as We, untrack as Oe } from "solid-js";
 import { cn as C } from "../../utils/cn.js";
-import { useLayout as Oe } from "../../context/LayoutContext.js";
+import { useLayout as He } from "../../context/LayoutContext.js";
 import { Button as ce } from "./Button.js";
-import { Restore as He, Maximize as Ue, X as Xe } from "../icons/index.js";
-import { startHotInteraction as Ye } from "../../utils/hotInteraction.js";
-import { resolveFloatingWindowViewport as fe, normalizeFloatingWindowRect as he, resolveFloatingWindowRect as qe } from "./floatingWindowGeometry.js";
+import { Restore as Ue, Maximize as Xe, X as Ye } from "../icons/index.js";
+import { startHotInteraction as qe } from "../../utils/hotInteraction.js";
+import { resolveFloatingWindowViewport as fe, normalizeFloatingWindowRect as he, resolveFloatingWindowRect as Ne } from "./floatingWindowGeometry.js";
 import { LOCAL_INTERACTION_SURFACE_ATTR as we } from "./localInteractionSurface.js";
-import { SURFACE_PORTAL_LAYER_ATTR as Ne } from "./dialogSurfaceScope.js";
-var Be = /* @__PURE__ */ a('<h2 class="text-sm font-medium truncate select-none">'), je = /* @__PURE__ */ a('<div class="flex items-center justify-end gap-2 p-3 border-t border-border">'), Ge = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=n style=touch-action:none>"), Ve = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=s style=touch-action:none>"), Ze = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=e style=touch-action:none>"), Je = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=w style=touch-action:none>"), Ke = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=ne style=touch-action:none>"), Qe = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=nw style=touch-action:none>"), et = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=se style=touch-action:none>"), tt = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=sw style=touch-action:none>"), nt = /* @__PURE__ */ a('<div data-floe-geometry-surface=floating-window><div data-floe-dialog-surface-host=true><div data-floe-floating-window-titlebar=true style=touch-action:none><div class="flex-1 min-w-0"></div><div class="flex items-center gap-0.5 -mr-1"></div></div><div class="flex-1 overflow-auto p-3">');
-function ht(i) {
+import { SURFACE_PORTAL_LAYER_ATTR as Be } from "./dialogSurfaceScope.js";
+var je = /* @__PURE__ */ a('<h2 class="text-sm font-medium truncate select-none">'), Ge = /* @__PURE__ */ a('<div class="flex items-center justify-end gap-2 p-3 border-t border-border">'), Ve = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=n style=touch-action:none>"), Ze = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=s style=touch-action:none>"), Je = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=e style=touch-action:none>"), Ke = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=w style=touch-action:none>"), Qe = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=ne style=touch-action:none>"), et = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=nw style=touch-action:none>"), tt = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=se style=touch-action:none>"), nt = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=sw style=touch-action:none>"), it = /* @__PURE__ */ a('<div data-floe-geometry-surface=floating-window><div data-floe-dialog-surface-host=true><div data-floe-floating-window-titlebar=true style=touch-action:none><div class="flex-1 min-w-0"></div><div class="flex items-center gap-0.5 -mr-1"></div></div><div class="flex-1 overflow-auto p-3">');
+function wt(i) {
   const X = () => i.resizable ?? !0, Y = () => i.draggable ?? !0, E = () => i.minSize ?? {
     width: 200,
     height: 150
   }, A = () => i.maxSize ?? {
     width: 1 / 0,
     height: 1 / 0
-  }, z = () => i.viewportInsets ?? {}, ge = () => i.zIndex ?? 100, me = Te(), ve = Oe(), $ = () => ve.isMobile(), F = 16, q = () => `floating-window-${me}-title`, [L, pe] = p(i.defaultPosition ?? {
+  }, x = () => i.viewportInsets ?? {}, ge = () => i.zIndex ?? 100, me = ke(), ve = He(), $ = () => ve.isMobile(), F = 16, q = () => `floating-window-${me}-title`, [L, pe] = p(i.defaultPosition ?? {
     x: 0,
     y: 0
-  }), [M, ze] = p(i.defaultSize ?? {
+  }), [M, xe] = p(i.defaultSize ?? {
     width: 400,
     height: 300
-  }), [d, N] = p(!1), [B, j] = p(!1), [G, V] = p(!1), [xe, D] = p(!1), [ye, be] = p(null);
+  }), [d, N] = p(!1), [B, j] = p(!1), [G, V] = p(!1), [ze, D] = p(!1), [ye, be] = p(null);
   let Z = {
     x: 0,
     y: 0
@@ -39,10 +39,10 @@ function ht(i) {
     y: 0,
     width: 0,
     height: 0
-  }, ee = "se", r, o = null, v = null, I = {
+  }, ee = "se", o, r = null, v = null, I = {
     x: 0,
     y: 0
-  }, x = null, _ = null, T = !1, y = {
+  }, z = null, _ = null, k = !1, y = {
     x: i.defaultPosition?.x ?? 0,
     y: i.defaultPosition?.y ?? 0,
     width: i.defaultSize?.width ?? 400,
@@ -57,19 +57,19 @@ function ht(i) {
     nw: "nwse-resize",
     se: "nwse-resize",
     sw: "nesw-resize"
-  }, W = (e, t) => {
+  }, T = (e, t) => {
     if (!e) {
       _?.(), _ = null;
       return;
     }
-    _?.(), _ = Ye({
+    _?.(), _ = qe({
       kind: v === "resize" ? "resize" : "drag",
       cursor: t,
       lockUserSelect: !0
     });
   }, te = (e) => {
-    y = e, r && (r.style.transform = `translate3d(${e.x}px, ${e.y}px, 0)`, r.style.width = `${e.width}px`, r.style.height = `${e.height}px`);
-  }, k = () => {
+    y = e, o && (o.style.transform = `translate3d(${e.x}px, ${e.y}px, 0)`, o.style.width = `${e.width}px`, o.style.height = `${e.height}px`);
+  }, W = () => {
     const e = L(), t = M();
     return {
       x: e.x,
@@ -78,16 +78,16 @@ function ht(i) {
       height: t.height
     };
   }, S = (e) => {
-    y = e, pe({
+    y = e, pe((t) => t.x === e.x && t.y === e.y ? t : {
       x: e.x,
       y: e.y
-    }), ze({
+    }), xe((t) => t.width === e.width && t.height === e.height ? t : {
       width: e.width,
       height: e.height
     });
   }, $e = () => {
     try {
-      r?.focus({
+      o?.focus({
         preventScroll: !0
       });
     } catch {
@@ -95,9 +95,9 @@ function ht(i) {
   }, Ie = (e) => {
     const t = e instanceof Element ? e : null;
     return t ? t.closest('button, input, select, textarea, a, [role="button"], [tabindex]:not([tabindex="-1"])') === null : !0;
-  }, O = (e) => !!r && e instanceof Node && r.contains(e), Se = () => {
-    if (!r) return null;
-    const e = r.getBoundingClientRect();
+  }, O = (e) => !!o && e instanceof Node && o.contains(e), Se = () => {
+    if (!o) return null;
+    const e = o.getBoundingClientRect();
     return {
       x: e.left,
       y: e.top,
@@ -105,7 +105,7 @@ function ht(i) {
       height: e.height
     };
   }, ne = () => {
-    i.open && (o === null || v === null || typeof window > "u" || te(qe({
+    i.open && (r === null || v === null || typeof window > "u" || te(Ne({
       mode: v,
       pointer: I,
       dragStartPos: Z,
@@ -119,7 +119,7 @@ function ht(i) {
         width: window.innerWidth,
         height: window.innerHeight
       },
-      viewportInsets: z(),
+      viewportInsets: x(),
       mobile: $(),
       mobilePadding: F
     })));
@@ -130,37 +130,37 @@ function ht(i) {
       height: window.innerHeight
     };
     if (d()) {
-      S(fe(t, z()));
+      S(fe(t, x()));
       return;
     }
     S(he({
-      rect: k(),
+      rect: W(),
       minSize: E(),
       maxSize: A(),
       viewport: t,
-      viewportInsets: z(),
+      viewportInsets: x(),
       mobile: $(),
       mobilePadding: F,
       center: e?.center ?? !1
     }));
   }, H = (e, t = !0) => {
-    x !== null && typeof cancelAnimationFrame < "u" && (cancelAnimationFrame(x), x = null), t && ne();
+    z !== null && typeof cancelAnimationFrame < "u" && (cancelAnimationFrame(z), z = null), t && ne();
     const l = t ? Se() ?? y : null;
     if (e !== void 0)
       try {
-        typeof r?.releasePointerCapture == "function" && r.releasePointerCapture(e);
+        typeof o?.releasePointerCapture == "function" && o.releasePointerCapture(e);
       } catch {
       }
-    ke(() => {
-      l && S(l), o = null, v = null, j(!1), V(!1);
-    }), W(!1, "");
+    We(() => {
+      l && S(l), r = null, v = null, j(!1), V(!1);
+    }), T(!1, "");
   };
-  We(() => {
+  Te(() => {
     i.open || R({
       center: !i.defaultPosition
     });
     const e = () => {
-      o === null && R({
+      r === null && R({
         center: !1
       });
     };
@@ -168,10 +168,10 @@ function ht(i) {
   }), b(() => {
     if (!i.open) return;
     $();
-    const e = !T && !i.defaultPosition, t = () => {
+    const e = !k && !i.defaultPosition, t = () => {
       R({
         center: e
-      }), T = !0;
+      }), k = !0;
     };
     if (typeof requestAnimationFrame > "u") {
       t();
@@ -179,9 +179,9 @@ function ht(i) {
     }
     requestAnimationFrame(t);
   }), b(() => {
-    !i.open || !T || o !== null || (z(), R({
+    !i.open || !k || r !== null || (x(), Oe(() => R({
       center: !1
-    }));
+    })));
   }), b(() => {
     if (!i.open) return;
     const e = (t) => {
@@ -192,7 +192,7 @@ function ht(i) {
     document.addEventListener("keydown", e, !0), U(() => document.removeEventListener("keydown", e, !0));
   }), b(() => {
     if (!i.open) {
-      D(!1), H(o ?? void 0, !1);
+      D(!1), H(r ?? void 0, !1);
       return;
     }
     D(!0);
@@ -210,11 +210,11 @@ function ht(i) {
     });
   }), b(() => {
     if (!i.open) return;
-    const e = k();
-    o === null ? te(e) : y = e;
+    const e = W();
+    r === null ? te(e) : y = e;
   });
   const _e = (e) => {
-    !Y() || d() || e.pointerType === "mouse" && e.button !== 0 || e.target?.closest('button, input, select, textarea, a, [role="button"]') || (e.preventDefault(), o = e.pointerId, v = "drag", j(!0), Z = {
+    !Y() || d() || e.pointerType === "mouse" && e.button !== 0 || e.target?.closest('button, input, select, textarea, a, [role="button"]') || (e.preventDefault(), r = e.pointerId, v = "drag", j(!0), Z = {
       x: e.clientX,
       y: e.clientY
     }, J = {
@@ -222,9 +222,9 @@ function ht(i) {
     }, I = {
       x: e.clientX,
       y: e.clientY
-    }, W(!0, "grabbing"), typeof r?.setPointerCapture == "function" && r.setPointerCapture(e.pointerId));
+    }, T(!0, "grabbing"), typeof o?.setPointerCapture == "function" && o.setPointerCapture(e.pointerId));
   }, f = (e) => (t) => {
-    !X() || d() || t.pointerType === "mouse" && t.button !== 0 || (t.preventDefault(), t.stopPropagation(), o = t.pointerId, v = "resize", V(!0), ee = e, K = {
+    !X() || d() || t.pointerType === "mouse" && t.button !== 0 || (t.preventDefault(), t.stopPropagation(), r = t.pointerId, v = "resize", V(!0), ee = e, K = {
       x: t.clientX,
       y: t.clientY
     }, Q = {
@@ -232,27 +232,27 @@ function ht(i) {
     }, I = {
       x: t.clientX,
       y: t.clientY
-    }, W(!0, Pe[e]), typeof r?.setPointerCapture == "function" && r.setPointerCapture(t.pointerId));
+    }, T(!0, Pe[e]), typeof o?.setPointerCapture == "function" && o.setPointerCapture(t.pointerId));
   }, ie = () => {
-    x = null, ne();
+    z = null, ne();
   }, Re = (e) => {
-    if (!(o === null || e.pointerId !== o) && v !== null && (I = {
+    if (!(r === null || e.pointerId !== r) && v !== null && (I = {
       x: e.clientX,
       y: e.clientY
-    }, x === null)) {
+    }, z === null)) {
       if (typeof requestAnimationFrame > "u") {
         ie();
         return;
       }
-      x = requestAnimationFrame(ie);
+      z = requestAnimationFrame(ie);
     }
-  }, re = (e) => {
-    o === null || e.pointerId !== o || (I = {
+  }, oe = (e) => {
+    r === null || e.pointerId !== r || (I = {
       x: e.clientX,
       y: e.clientY
     }, H(e.pointerId));
-  }, oe = () => {
-    if (o !== null && H(o, !0), d()) {
+  }, re = () => {
+    if (r !== null && H(r, !0), d()) {
       const t = ye();
       t && S(he({
         rect: {
@@ -267,14 +267,14 @@ function ht(i) {
           width: window.innerWidth,
           height: window.innerHeight
         },
-        viewportInsets: z(),
+        viewportInsets: x(),
         mobile: $(),
         mobilePadding: F,
         center: !1
       })), N(!1);
       return;
     }
-    const e = k();
+    const e = W();
     be({
       position: {
         x: e.x,
@@ -287,9 +287,9 @@ function ht(i) {
     }), S(fe({
       width: window.innerWidth,
       height: window.innerHeight
-    }, z())), N(!0);
+    }, x())), N(!0);
   }, Ce = () => {
-    oe();
+    re();
   }, Ee = (e) => {
     Ie(e.target) && $e();
   }, h = (e) => C("absolute z-10", {
@@ -309,8 +309,8 @@ function ht(i) {
     get children() {
       return s(Fe, {
         get children() {
-          var e = nt(), t = e.firstChild, l = t.firstChild, w = l.firstChild, le = w.nextSibling, Ae = l.nextSibling, se = r;
-          return typeof se == "function" ? Me(se, e) : r = e, ae(e, de({
+          var e = it(), t = e.firstChild, l = t.firstChild, w = l.firstChild, le = w.nextSibling, Ae = l.nextSibling, se = o;
+          return typeof se == "function" ? Me(se, e) : o = e, ae(e, de({
             [we]: "true"
           }, {
             get class() {
@@ -326,8 +326,8 @@ function ht(i) {
               };
             },
             onPointerMove: Re,
-            onPointerUp: re,
-            onPointerCancel: re,
+            onPointerUp: oe,
+            onPointerCancel: oe,
             role: "dialog",
             get "aria-labelledby"() {
               return ue(() => !!i.title)() ? q() : void 0;
@@ -335,11 +335,11 @@ function ht(i) {
             tabIndex: -1,
             onPointerDown: Ee
           }), !1, !0), ae(t, de({
-            [Ne]: "true"
+            [Be]: "true"
           }, {
             "data-floe-floating-window-surface": "true",
             get "data-floe-floating-window-state"() {
-              return xe() ? "active" : "inactive";
+              return ze() ? "active" : "inactive";
             }
           }, {
             [we]: "true"
@@ -352,7 +352,7 @@ function ht(i) {
               return i.title;
             },
             get children() {
-              var n = Be();
+              var n = je();
               return g(n, () => i.title), u(() => Le(n, "id", q())), n;
             }
           })), g(le, s(ce, {
@@ -360,7 +360,7 @@ function ht(i) {
             size: "icon",
             class: "h-6 w-6",
             onClick: (n) => {
-              n.stopPropagation(), oe();
+              n.stopPropagation(), re();
             },
             get "aria-label"() {
               return d() ? "Restore" : "Maximize";
@@ -371,12 +371,12 @@ function ht(i) {
                   return d();
                 },
                 get fallback() {
-                  return s(Ue, {
+                  return s(Xe, {
                     class: "w-3 h-3"
                   });
                 },
                 get children() {
-                  return s(He, {
+                  return s(Ue, {
                     class: "w-3 h-3"
                   });
                 }
@@ -391,7 +391,7 @@ function ht(i) {
             },
             "aria-label": "Close",
             get children() {
-              return s(Xe, {
+              return s(Ye, {
                 class: "w-3.5 h-3.5"
               });
             }
@@ -400,7 +400,7 @@ function ht(i) {
               return i.footer;
             },
             get children() {
-              var n = je();
+              var n = Ge();
               return g(n, () => i.footer), n;
             }
           }), null), g(t, s(P, {
@@ -409,10 +409,10 @@ function ht(i) {
             },
             get children() {
               return [(() => {
-                var n = Ge();
+                var n = Ve();
                 return m(n, "pointerdown", f("n"), !0), u(() => c(n, h("n"))), n;
               })(), (() => {
-                var n = Ve();
+                var n = Ze();
                 return m(n, "pointerdown", f("s"), !0), u(() => c(n, h("s"))), n;
               })(), s(P, {
                 get when() {
@@ -420,22 +420,22 @@ function ht(i) {
                 },
                 get children() {
                   return [(() => {
-                    var n = Ze();
+                    var n = Je();
                     return m(n, "pointerdown", f("e"), !0), u(() => c(n, h("e"))), n;
                   })(), (() => {
-                    var n = Je();
+                    var n = Ke();
                     return m(n, "pointerdown", f("w"), !0), u(() => c(n, h("w"))), n;
                   })(), (() => {
-                    var n = Ke();
+                    var n = Qe();
                     return m(n, "pointerdown", f("ne"), !0), u(() => c(n, h("ne"))), n;
                   })(), (() => {
-                    var n = Qe();
+                    var n = et();
                     return m(n, "pointerdown", f("nw"), !0), u(() => c(n, h("nw"))), n;
                   })(), (() => {
-                    var n = et();
+                    var n = tt();
                     return m(n, "pointerdown", f("se"), !0), u(() => c(n, h("se"))), n;
                   })(), (() => {
-                    var n = tt();
+                    var n = nt();
                     return m(n, "pointerdown", f("sw"), !0), u(() => c(n, h("sw"))), n;
                   })()];
                 }
@@ -449,5 +449,5 @@ function ht(i) {
 }
 De(["pointerdown", "dblclick"]);
 export {
-  ht as FloatingWindow
+  wt as FloatingWindow
 };

package/package.json

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