@floegence/floe-webapp-core 0.86.58 → 0.86.62

package/dist/components/ui/FloatingWindow.js

@@ -1,85 +1,86 @@
-import { createComponent as l, Portal as ot, spread as ke, mergeProps as Te, memo as Q, insert as c, effect as h, setAttribute as rt, addEventListener as _, className as m, template as s, use as we, delegateEvents as at } from "solid-js/web";
-import { createSignal as x, createUniqueId as lt, onCleanup as B, onMount as st, createEffect as S, untrack as Z, Show as v, batch as J } from "solid-js";
-import { cn as K } from "../../utils/cn.js";
-import { useOptionalLayout as dt } from "../../context/LayoutContext.js";
-import { useResolvedFloeConfig as ct } from "../../context/FloeConfigContext.js";
-import { useMediaQuery as ut } from "../../hooks/useMediaQuery.js";
-import { Button as Le } from "./Button.js";
-import { Restore as ft, Maximize as ht, X as wt } from "../icons/index.js";
-import { startHotInteraction as gt } from "../../utils/hotInteraction.js";
-import { startPointerSession as mt } from "./pointerSession.js";
-import { resolveFloatingWindowViewport as ge, normalizeFloatingWindowRect as me, resolveFloatingWindowRect as xt } from "./floatingWindowGeometry.js";
-import { observeViewport as vt } from "../../viewport.js";
-import { createFloatingPresence as yt } from "./floatingPresence.js";
-import { LOCAL_INTERACTION_SURFACE_ATTR as Oe } from "./localInteractionSurface.js";
-import { resolveFloatingBoundary as bt } from "./surfaceFloatingBoundary.js";
-import { SURFACE_PORTAL_LAYER_ATTR as pt, resolveSurfacePortalHost as zt } from "./dialogSurfaceScope.js";
-var $t = /* @__PURE__ */ s("<span hidden>"), _t = /* @__PURE__ */ s('<span data-floe-floating-window-title-icon=true aria-hidden=true class="flex size-4 shrink-0 items-center justify-center">'), St = /* @__PURE__ */ s('<h2 class="flex min-w-0 items-center gap-2 text-xs leading-none font-medium select-none"><span class="min-w-0 truncate">'), Pt = /* @__PURE__ */ s('<div data-floe-floating-window-header-actions=true class="flex shrink-0 cursor-default items-center gap-1"><span aria-hidden=true class="mx-2 h-4 w-px shrink-0 bg-border">'), It = /* @__PURE__ */ s('<div data-floe-floating-window-footer=true class="flex items-center justify-end gap-2 p-3 border-t border-border">'), Rt = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=n style=touch-action:none>"), Ct = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=s style=touch-action:none>"), At = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=e style=touch-action:none>"), Et = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=w style=touch-action:none>"), Mt = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=ne style=touch-action:none>"), Ft = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=nw style=touch-action:none>"), kt = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=se style=touch-action:none>"), Tt = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=sw style=touch-action:none>"), Lt = /* @__PURE__ */ s('<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 px-2"></div><div class="flex h-full shrink-0 items-stretch"></div></div><div data-floe-floating-window-content=true class="min-h-0 flex-1 overflow-auto overscroll-contain p-3">');
-function Kt(n) {
-  const xe = () => n.resizable ?? !0, ee = () => n.maximizable ?? !0, ve = () => n.draggable ?? !0, D = () => n.minSize ?? {
+import { createComponent as l, Portal as rt, use as Q, spread as ke, mergeProps as Oe, memo as Z, insert as f, effect as w, setAttribute as at, addEventListener as P, className as v, template as d, delegateEvents as lt } from "solid-js/web";
+import { createSignal as x, createUniqueId as st, onCleanup as D, onMount as dt, createEffect as I, untrack as W, Show as y, batch as he } from "solid-js";
+import { cn as J } from "../../utils/cn.js";
+import { useOptionalLayout as ct } from "../../context/LayoutContext.js";
+import { useResolvedFloeConfig as ut } from "../../context/FloeConfigContext.js";
+import { useMediaQuery as ft } from "../../hooks/useMediaQuery.js";
+import { Button as Te } from "./Button.js";
+import { Restore as ht, Maximize as wt, X as gt } from "../icons/index.js";
+import { startHotInteraction as mt } from "../../utils/hotInteraction.js";
+import { startPointerSession as vt } from "./pointerSession.js";
+import { resolveFloatingWindowViewport as we, normalizeFloatingWindowRect as ge, resolveFloatingWindowRect as xt } from "./floatingWindowGeometry.js";
+import { observeViewport as yt } from "../../viewport.js";
+import { createFloatingPresence as bt } from "./floatingPresence.js";
+import { LOCAL_INTERACTION_SURFACE_ATTR as Le } from "./localInteractionSurface.js";
+import { resolveFloatingBoundary as pt } from "./surfaceFloatingBoundary.js";
+import { SURFACE_PORTAL_LAYER_ATTR as zt, resolveSurfacePortalHost as $t } from "./dialogSurfaceScope.js";
+var _t = /* @__PURE__ */ d("<span hidden>"), St = /* @__PURE__ */ d('<span data-floe-floating-window-title-icon=true aria-hidden=true class="flex size-4 shrink-0 items-center justify-center">'), Pt = /* @__PURE__ */ d('<h2 class="flex min-w-0 items-center gap-2 text-xs leading-none font-medium select-none"><span class="min-w-0 truncate">'), It = /* @__PURE__ */ d('<div data-floe-floating-window-header-actions=true class="flex shrink-0 cursor-default items-center gap-1"><span aria-hidden=true class="mx-2 h-4 w-px shrink-0 bg-border">'), Rt = /* @__PURE__ */ d('<div data-floe-floating-window-footer=true class="flex items-center justify-end gap-2 p-3 border-t border-[var(--floe-line)]">'), Ct = /* @__PURE__ */ d("<div data-floe-floating-window-resize-handle=n style=touch-action:none>"), At = /* @__PURE__ */ d("<div data-floe-floating-window-resize-handle=s style=touch-action:none>"), Et = /* @__PURE__ */ d("<div data-floe-floating-window-resize-handle=e style=touch-action:none>"), Mt = /* @__PURE__ */ d("<div data-floe-floating-window-resize-handle=w style=touch-action:none>"), Ft = /* @__PURE__ */ d("<div data-floe-floating-window-resize-handle=ne style=touch-action:none>"), kt = /* @__PURE__ */ d("<div data-floe-floating-window-resize-handle=nw style=touch-action:none>"), Ot = /* @__PURE__ */ d("<div data-floe-floating-window-resize-handle=se style=touch-action:none>"), Tt = /* @__PURE__ */ d("<div data-floe-floating-window-resize-handle=sw style=touch-action:none>"), Lt = /* @__PURE__ */ d('<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 px-2"></div><div class="flex h-full shrink-0 items-stretch"></div></div><div data-floe-floating-window-content=true class="min-h-0 flex-1 overflow-auto overscroll-contain p-3">');
+function en(n) {
+  const me = () => n.resizable ?? !0, K = () => n.maximizable ?? !0, ve = () => n.draggable ?? !0, q = () => n.minSize ?? {
     width: 200,
     height: 150
-  }, W = () => n.maxSize ?? {
+  }, H = () => n.maxSize ?? {
     width: 1 / 0,
     height: 1 / 0
   };
-  let te;
-  const [q, Be] = x(), [P, De] = x({
+  let ee;
+  const [O, Be] = x(), [R, De] = x({
     x: 0,
     y: 0,
     width: 0,
     height: 0
   }, {
     equals: (e, t) => e.x === t.x && e.y === t.y && e.width === t.width && e.height === t.height
-  }), [ne, We] = x(!0), w = () => !!(n.compactBelow && P().width < n.compactBelow), y = () => n.viewportInsets, E = () => q()?.fixedScale ?? 1, L = (e) => ({
-    x: (e.x + (q()?.fixedOffset.left ?? 0)) / E(),
-    y: (e.y + (q()?.fixedOffset.top ?? 0)) / E()
-  }), qe = () => n.zIndex ?? 100, He = lt(), Xe = dt(), Ye = ct(), M = Xe?.isMobile ?? ut(() => Ye.config.layout.mobileQuery), H = 16, ye = () => `floating-window-${He}-title`, [ie, Ne] = x(n.defaultPosition ?? {
+  }), [te, We] = x(!0), g = () => !!(n.compactBelow && R().width < n.compactBelow), b = () => n.viewportInsets, T = () => O()?.fixedScale ?? 1, ne = (e) => ({
+    x: (e.x + (O()?.fixedOffset.left ?? 0)) / T(),
+    y: (e.y + (O()?.fixedOffset.top ?? 0)) / T()
+  }), qe = () => n.zIndex ?? 100, He = st(), Xe = ct(), Ye = ut(), E = Xe?.isMobile ?? ft(() => Ye.config.layout.mobileQuery), X = 16, xe = () => `floating-window-${He}-title`, [Ne, Ve] = x(n.defaultPosition ?? {
     x: 0,
     y: 0
-  }), [oe, Ve] = x(n.defaultSize ?? {
+  }), [je, Ue] = x(n.defaultSize ?? {
     width: 400,
     height: 300
-  }), [d, re] = x(!1), [X, be] = x(!1), [Y, pe] = x(!1), [je, ae] = x(!1), F = yt({
-    open: () => n.open
+  }), [c, ie] = x(!1), [L, ye] = x(!1), [Y, be] = x(!1), [Ge, oe] = x(!1), M = bt({
+    open: () => n.open,
+    element: () => ae
   });
-  let b = {
+  let p = {
     x: 0,
     y: 0
-  }, I = {
+  }, F = {
     x: 0,
     y: 0,
     width: 0,
     height: 0
-  }, le = 32, ze = {
+  }, re = 32, pe = {
     x: 0,
     y: 0
-  }, $e = {
+  }, ze = {
     x: 0,
     y: 0,
     width: 0,
     height: 0
-  }, _e = "se", a, se, u = null, N, f = null, R = {
+  }, $e = "se", s, ae, le, h = null, N, u = null, C = {
     x: 0,
     y: 0
-  }, k = null, V = null, T, de = !1, C = {
+  }, k = null, V = null, z, se = !1, a = {
     x: n.defaultPosition?.x ?? 0,
     y: n.defaultPosition?.y ?? 0,
     width: n.defaultSize?.width ?? 400,
     height: n.defaultSize?.height ?? 300
-  }, g = {
-    ...C
+  }, m = {
+    ...a
   }, A;
-  const Se = (e) => {
-    g = {
+  const _e = (e) => {
+    m = {
       ...e
     };
-    const t = ge(P(), y());
+    const t = we(R(), b());
     A = {
       x: t.width > e.width ? (e.x - t.x) / (t.width - e.width) : A?.x ?? 0.5,
       y: t.height > e.height ? (e.y - t.y) / (t.height - e.height) : A?.y ?? 0.5
     };
-  }, Ue = {
+  }, Qe = {
     n: "ns-resize",
     s: "ns-resize",
     e: "ew-resize",
@@ -88,52 +89,57 @@ function Kt(n) {
     nw: "nwse-resize",
     se: "nwse-resize",
     sw: "nesw-resize"
-  }, ce = (e, t) => {
+  }, de = (e, t) => {
     if (!e) {
       V?.(), V = null;
       return;
     }
-    V?.(), V = gt({
-      kind: f === "resize" ? "resize" : "drag",
+    V?.(), V = mt({
+      kind: u === "resize" ? "resize" : "drag",
       cursor: t,
-      lockUserSelect: !0
+      lockUserSelect: !0,
+      // The titlebar declares its own cursor and travels with the pointer, so a
+      // document-wide lock shows nothing at the pointer while restyling the whole
+      // document. Resize handles are a few pixels wide and the pointer can leave
+      // them at the size limits, so they keep the lock.
+      lockDocumentStyles: u !== "drag"
     });
-  }, ue = (e) => {
-    if (T?.cancel(), T = void 0, C = e, !a) return;
-    const t = L(e);
-    a.style.transform = `translate3d(${t.x}px, ${t.y}px, 0)`, a.style.width = `${e.width / E()}px`, a.style.height = `${e.height / E()}px`;
-  }, Ge = () => {
-    const e = ie(), t = oe();
+  }, j = (e) => {
+    if ((e.x !== a.x || e.y !== a.y || e.width !== a.width || e.height !== a.height) && (z?.cancel(), z = void 0), a = e, !s) return;
+    const t = ne(e);
+    s.style.transform = `translate3d(${t.x}px, ${t.y}px, 0)`, s.style.width = `${e.width / T()}px`, s.style.height = `${e.height / T()}px`;
+  }, Se = () => {
+    const e = Ne(), t = je();
     return {
       x: e.x,
       y: e.y,
       width: t.width,
       height: t.height
     };
-  }, j = (e) => {
-    C = e, Ne((t) => t.x === e.x && t.y === e.y ? t : {
+  }, ce = (e) => {
+    (e.x !== a.x || e.y !== a.y || e.width !== a.width || e.height !== a.height) && (z?.cancel(), z = void 0), a = e, Ve((t) => t.x === e.x && t.y === e.y ? t : {
       x: e.x,
       y: e.y
-    }), Ve((t) => t.width === e.width && t.height === e.height ? t : {
+    }), Ue((t) => t.width === e.width && t.height === e.height ? t : {
       width: e.width,
       height: e.height
     });
-  }, Qe = () => {
+  }, Ze = () => {
     try {
-      a?.focus({
+      s?.focus({
         preventScroll: !0
       });
     } catch {
     }
-  }, Ze = (e) => {
+  }, Je = (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;
-  }, fe = (e) => !!a && e instanceof Node && a.contains(e), Je = (e) => {
+  }, ue = (e) => !!s && e instanceof Node && s.contains(e), Ke = (e) => {
     const o = (e instanceof Element ? e : null)?.closest('[role="menu"], [role="dialog"]')?.closest('[data-floe-surface-floating-layer="true"], [data-floe-dropdown]');
-    return !!(o && a?.contains(o));
-  }, Ke = () => {
-    if (!a) return null;
-    const e = a.getBoundingClientRect();
+    return !!(o && s?.contains(o));
+  }, et = () => {
+    if (!s) return null;
+    const e = s.getBoundingClientRect();
     return {
       x: e.left,
       y: e.top,
@@ -141,100 +147,98 @@ function Kt(n) {
       height: e.height
     };
   }, Pe = () => {
-    if (n.open && !(u === null || f === null) && !(typeof window > "u")) {
-      if (f === "drag" && d()) {
-        if (Math.hypot(R.x - b.x, R.y - b.y) < 4) return;
-        const e = me({
-          rect: g,
-          minSize: D(),
-          maxSize: W(),
-          viewport: P(),
-          viewportInsets: y(),
-          mobile: n.boundary === void 0 && M(),
-          mobilePadding: H
-        }), t = Math.max(0, Math.min(1, (b.x - I.x) / Math.max(1, I.width))), r = Math.max(0, Math.min(le, b.y - I.y));
-        I = {
+    if (n.open && !(h === null || u === null) && !(typeof window > "u")) {
+      if (u === "drag" && c()) {
+        if (Math.hypot(C.x - p.x, C.y - p.y) < 4) return;
+        const e = ge({
+          rect: m,
+          minSize: q(),
+          maxSize: H(),
+          viewport: R(),
+          viewportInsets: b(),
+          mobile: n.boundary === void 0 && E(),
+          mobilePadding: X
+        }), t = Math.max(0, Math.min(1, (p.x - F.x) / Math.max(1, F.width))), r = Math.max(0, Math.min(re, p.y - F.y));
+        F = {
           ...e,
-          x: b.x - e.width * t,
-          y: b.y - r
-        }, J(() => {
-          re(!1), j(I);
-        });
+          x: p.x - e.width * t,
+          y: p.y - r
+        }, ie(!1);
       }
-      ue(xt({
-        mode: f,
-        pointer: R,
-        dragStartPos: b,
-        dragStartRect: I,
-        dragTitlebarHeight: le,
-        resizeStartPos: ze,
-        resizeStartRect: $e,
-        resizeHandle: _e,
-        minSize: D(),
-        maxSize: W(),
-        viewport: P(),
-        viewportInsets: y(),
-        mobile: n.boundary === void 0 && M(),
-        mobilePadding: H
+      j(xt({
+        mode: u,
+        pointer: C,
+        dragStartPos: p,
+        dragStartRect: F,
+        dragTitlebarHeight: re,
+        resizeStartPos: pe,
+        resizeStartRect: ze,
+        resizeHandle: $e,
+        minSize: q(),
+        maxSize: H(),
+        viewport: R(),
+        viewportInsets: b(),
+        mobile: n.boundary === void 0 && E(),
+        mobilePadding: X
       }));
     }
-  }, O = (e) => {
+  }, B = (e) => {
     if (typeof window > "u") return;
-    const t = P();
-    if (d() || w()) {
-      j(ge(t, y()));
+    const t = R();
+    if (c() || g()) {
+      ce(we(t, b()));
       return;
     }
-    let r = me({
-      rect: g,
-      minSize: D(),
-      maxSize: W(),
+    let r = ge({
+      rect: m,
+      minSize: q(),
+      maxSize: H(),
       viewport: t,
-      viewportInsets: y(),
-      mobile: n.boundary === void 0 && M(),
-      mobilePadding: H,
+      viewportInsets: b(),
+      mobile: n.boundary === void 0 && E(),
+      mobilePadding: X,
       center: e?.center ?? !1
     });
     if (n.boundary !== void 0 && A && !e?.center) {
-      const o = ge(t, y());
+      const o = we(t, b());
       r = {
         ...r,
         x: o.x + A.x * Math.max(0, o.width - r.width),
         y: o.y + A.y * Math.max(0, o.height - r.height)
       };
     }
-    if (j(r), !A) {
+    if (ce(r), !A) {
       const o = {
-        width: g.width,
-        height: g.height
+        width: m.width,
+        height: m.height
       };
-      Se(r), Object.assign(g, o);
+      _e(r), Object.assign(m, o);
     }
   }, Ie = (e) => {
     k !== null && typeof cancelAnimationFrame < "u" && (cancelAnimationFrame(k), k = null), e && Pe();
-    const t = f === "drag", r = e && !(t && d()) ? Ke() ?? C : null, o = r ? me({
+    const t = u === "drag", r = e && !(t && c()) ? et() ?? a : null, o = r ? ge({
       rect: r,
-      minSize: D(),
-      maxSize: W(),
-      viewport: P(),
-      viewportInsets: y(),
-      mobile: n.boundary === void 0 && M(),
-      mobilePadding: H
+      minSize: q(),
+      maxSize: H(),
+      viewport: R(),
+      viewportInsets: b(),
+      mobile: n.boundary === void 0 && E(),
+      mobilePadding: X
     }) : null;
-    if (J(() => {
+    if (he(() => {
       if (o) {
-        j(o);
-        const $ = {
-          width: g.width,
-          height: g.height
+        ce(o);
+        const S = {
+          width: m.width,
+          height: m.height
         };
-        Se(o), f === "drag" && Object.assign(g, $);
+        _e(o), u === "drag" && Object.assign(m, S);
       }
-      u = null, f = null, be(!1), pe(!1);
-    }), ce(!1, ""), N = void 0, o && (ue(o), t && r && a?.animate && (r.x !== o.x || r.y !== o.y) && !window.matchMedia?.("(prefers-reduced-motion: reduce)").matches)) {
-      const $ = L(r), U = L(o);
-      T = a.animate([{
-        transform: `translate3d(${$.x}px, ${$.y}px, 0)`
+      h = null, u = null, ye(!1), be(!1);
+    }), de(!1, ""), N = void 0, o && (j(o), t && r && s?.animate && (r.x !== o.x || r.y !== o.y) && !window.matchMedia?.("(prefers-reduced-motion: reduce)").matches)) {
+      const S = ne(r), U = ne(o);
+      z = s.animate([{
+        transform: `translate3d(${S.x}px, ${S.y}px, 0)`
       }, {
         transform: `translate3d(${U.x}px, ${U.y}px, 0)`
       }], {
@@ -242,22 +246,22 @@ function Kt(n) {
         easing: "cubic-bezier(0.2, 0.8, 0.2, 1)"
       });
     }
-  }, he = (e = !1) => {
+  }, fe = (e = !1) => {
     N ? N.stop({
       commit: e
     }) : Ie(e);
   };
-  B(() => {
-    he(!1), T?.cancel();
-  }), st(() => {
+  D(() => {
+    fe(!1), z?.cancel();
+  }), dt(() => {
     const e = () => {
-      const t = q(), r = n.boundary === void 0 ? {
+      const t = O(), r = n.boundary === void 0 ? {
         boundaryHost: null,
         mode: "global"
-      } : zt({
-        owner: te
-      }), o = bt(r, n.boundary, t?.safeArea);
-      J(() => {
+      } : $t({
+        owner: ee
+      }), o = pt(r, n.boundary, t?.safeArea);
+      he(() => {
         We(!!(o && o.width > 16 && o.height > 16)), De(o ? {
           x: o.left,
           y: o.top,
@@ -271,98 +275,98 @@ function Kt(n) {
         });
       });
     };
-    B(vt(window, (t) => {
-      J(() => {
-        Be(t), Z(e);
+    D(yt(window, (t) => {
+      he(() => {
+        Be(t), W(e);
       });
-    })), S(() => {
+    })), I(() => {
       if (!n.open || n.boundary === void 0) return;
       let t = 0;
       const r = () => {
-        Z(e), t = requestAnimationFrame(r);
+        W(e), t = requestAnimationFrame(r);
       };
-      r(), B(() => cancelAnimationFrame(t));
-    }), n.open || O({
+      r(), D(() => cancelAnimationFrame(t));
+    }), n.open || B({
       center: !n.defaultPosition
     });
-  }), S(() => {
+  }), I(() => {
     if (!n.open) return;
-    M();
-    const e = !de && !n.defaultPosition, t = () => {
-      O({
+    E();
+    const e = !se && !n.defaultPosition, t = () => {
+      B({
         center: e
-      }), de = !0;
+      }), se = !0;
     };
     if (typeof requestAnimationFrame > "u") {
       t();
       return;
     }
     requestAnimationFrame(t);
-  }), S(() => {
-    y(), P(), w(), !(!n.open || !de || u !== null) && Z(() => O({
+  }), I(() => {
+    b(), R(), g(), !(!n.open || !se || h !== null) && W(() => B({
       center: !1
     }));
-  }), S(() => {
-    ee() || !d() || Z(() => {
-      re(!1), O({
+  }), I(() => {
+    K() || !c() || W(() => {
+      ie(!1), B({
         center: !1
       });
     });
-  }), S(() => {
+  }), I(() => {
     if (!n.open) return;
     const e = (t) => {
       if (t.key !== "Escape") return;
       const r = typeof document < "u" ? document.activeElement : null;
-      !fe(t.target) && !fe(r) || Je(t.target) || (t.preventDefault(), typeof t.stopImmediatePropagation == "function" ? t.stopImmediatePropagation() : t.stopPropagation(), n.onOpenChange(!1));
+      !ue(t.target) && !ue(r) || Ke(t.target) || (t.preventDefault(), typeof t.stopImmediatePropagation == "function" ? t.stopImmediatePropagation() : t.stopPropagation(), n.onOpenChange(!1));
     };
-    document.addEventListener("keydown", e, !0), B(() => document.removeEventListener("keydown", e, !0));
-  }), S(() => {
+    document.addEventListener("keydown", e, !0), D(() => document.removeEventListener("keydown", e, !0));
+  }), I(() => {
     if (!n.open) {
-      ae(!1), he(!1);
+      oe(!1), fe(!1);
       return;
     }
-    ae(!0);
-  }), S(() => {
+    oe(!0);
+  }), I(() => {
     if (!n.open) return;
     const e = (o) => {
-      ae(fe(o));
+      oe(ue(o));
     }, t = (o) => {
       e(o.target);
     }, r = (o) => {
       e(o.target);
     };
-    document.addEventListener("pointerdown", t), document.addEventListener("focusin", r), B(() => {
+    document.addEventListener("pointerdown", t), document.addEventListener("focusin", r), D(() => {
       document.removeEventListener("pointerdown", t), document.removeEventListener("focusin", r);
     });
-  }), S(() => {
+  }), I(() => {
     if (!n.open) return;
-    const e = Ge();
-    u === null ? ue(e) : C = e;
+    const e = Se();
+    T(), O()?.fixedOffset, j(h === null ? e : a);
   });
-  const et = (e) => {
-    !ve() || w() || u !== null || e.pointerType === "mouse" && e.button !== 0 || e.target?.closest('button, input, select, textarea, a, [role="button"], [data-floe-floating-window-header-actions]') || (e.preventDefault(), T?.cancel(), T = void 0, le = e.currentTarget instanceof HTMLElement && e.currentTarget.getBoundingClientRect().height || 32, u = e.pointerId, f = "drag", be(!0), b = {
+  const tt = (e) => {
+    !ve() || g() || h !== null || e.pointerType === "mouse" && e.button !== 0 || e.target?.closest('button, input, select, textarea, a, [role="button"], [data-floe-floating-window-header-actions]') || (e.preventDefault(), z?.cancel(), z = void 0, re = e.currentTarget instanceof HTMLElement && e.currentTarget.getBoundingClientRect().height || 32, h = e.pointerId, u = "drag", ye(!0), p = {
       x: e.clientX,
       y: e.clientY
-    }, I = {
-      ...C
-    }, R = {
+    }, F = {
+      ...a
+    }, C = {
       x: e.clientX,
       y: e.clientY
-    }, ce(!0, "grabbing"), Ce(e));
-  }, p = (e) => (t) => {
-    !xe() || d() || w() || u !== null || t.pointerType === "mouse" && t.button !== 0 || (t.preventDefault(), t.stopPropagation(), u = t.pointerId, f = "resize", pe(!0), _e = e, ze = {
+    }, de(!0, "grabbing"), Ce(e));
+  }, $ = (e) => (t) => {
+    !me() || c() || g() || h !== null || t.pointerType === "mouse" && t.button !== 0 || (t.preventDefault(), t.stopPropagation(), h = t.pointerId, u = "resize", be(!0), $e = e, pe = {
       x: t.clientX,
       y: t.clientY
-    }, $e = {
-      ...C
-    }, R = {
+    }, ze = {
+      ...a
+    }, C = {
       x: t.clientX,
       y: t.clientY
-    }, ce(!0, Ue[e]), Ce(t));
+    }, de(!0, Qe[e]), Ce(t));
   }, Re = () => {
     k = null, Pe();
-  }, tt = (e) => {
-    if (!(u === null || e.pointerId !== u) && f !== null && (R = {
+  }, nt = (e) => {
+    if (!(h === null || e.pointerId !== h) && u !== null && (C = {
       x: e.clientX,
       y: e.clientY
     }, k === null)) {
@@ -373,29 +377,29 @@ function Kt(n) {
       k = requestAnimationFrame(Re);
     }
   }, Ce = (e) => {
-    N = mt({
+    N = vt({
       pointerEvent: e,
       // Keep click/double-click targeting on the titlebar while retaining capture.
-      captureEl: f === "drag" ? se : a,
-      onMove: tt,
+      captureEl: u === "drag" ? le : s,
+      onMove: nt,
       onEnd: ({
         commit: t,
         reason: r,
         snapshot: o
       }) => {
-        R = {
+        C = {
           x: o.latestClientX,
           y: o.latestClientY
         }, Ie(t || r === "pointer_cancel");
       }
     });
   }, Ae = () => {
-    !ee() || w() || (u !== null && he(!0), re(!d()), O());
-  }, nt = (e) => {
-    e.target?.closest("button, [data-floe-floating-window-header-actions]") || Ae();
+    !K() || g() || (h !== null && fe(!0), ie(!c()), B());
   }, it = (e) => {
-    Ze(e.target) && Qe();
-  }, z = (e) => K("absolute z-10", {
+    e.target?.closest("button, [data-floe-floating-window-header-actions]") || Ae();
+  }, ot = (e) => {
+    Je(e.target) && Ze();
+  }, _ = (e) => J("absolute z-10", {
     n: "cursor-ns-resize top-0 left-2 right-2 h-1",
     s: "cursor-ns-resize bottom-0 left-2 right-2 h-1",
     e: "cursor-ew-resize right-0 top-2 bottom-2 w-1",
@@ -406,108 +410,109 @@ function Kt(n) {
     sw: "cursor-nesw-resize bottom-0 left-0 w-2 h-2"
   }[e]);
   return [(() => {
-    var e = $t(), t = te;
-    return typeof t == "function" ? we(t, e) : te = e, e;
-  })(), l(v, {
+    var e = _t(), t = ee;
+    return typeof t == "function" ? Q(t, e) : ee = e, e;
+  })(), l(y, {
     get when() {
-      return F.mounted();
+      return M.mounted();
     },
     get children() {
-      return l(ot, {
+      return l(rt, {
         get children() {
-          var e = Lt(), t = e.firstChild, r = t.firstChild, o = r.firstChild, $ = o.nextSibling, U = r.nextSibling, Ee = a;
-          typeof Ee == "function" ? we(Ee, e) : a = e, ke(e, Te({
+          var e = Lt(), t = e.firstChild, r = t.firstChild, o = r.firstChild, S = o.nextSibling, U = r.nextSibling;
+          Q((i) => {
+            s = i, W(() => j(Se()));
+          }, e), ke(e, Oe({
             get "data-floating-presence"() {
-              return F.state();
+              return M.state();
             },
             get "aria-hidden"() {
-              return F.exiting() || !ne() ? "true" : void 0;
+              return M.exiting() || !te() ? "true" : void 0;
             },
             get inert() {
-              return F.exiting() || !ne();
+              return M.exiting() || !te();
             },
             get "data-floe-floating-window-compact"() {
-              return w() ? "true" : void 0;
+              return g() ? "true" : void 0;
             }
           }, {
-            [Oe]: "true"
+            [Le]: "true"
           }, {
             get class() {
-              return K("fixed left-0 top-0 z-[100] flex flex-col", (X() || Y()) && "select-none", F.exiting() && "pointer-events-none");
+              return J("fixed left-0 top-0 z-[100] flex flex-col", (L() || Y()) && "select-none", M.exiting() && "pointer-events-none");
             },
             get style() {
               return {
-                visibility: ne() ? void 0 : "hidden",
-                width: `${oe().width / E()}px`,
-                height: `${oe().height / E()}px`,
-                transform: `translate3d(${L(ie()).x}px, ${L(ie()).y}px, 0)`,
+                visibility: te() ? void 0 : "hidden",
                 "z-index": qe(),
-                "will-change": X() ? "transform" : Y() ? "transform, width, height" : void 0
+                "will-change": L() ? "transform" : Y() ? "transform, width, height" : void 0
               };
             },
             role: "dialog",
             get "aria-labelledby"() {
-              return Q(() => !!n.title)() ? ye() : void 0;
+              return Z(() => !!n.title)() ? xe() : void 0;
             },
             tabIndex: -1,
-            onPointerDown: it
-          }), !1, !0), ke(t, Te({
-            [pt]: "true"
+            onPointerDown: ot
+          }), !1, !0);
+          var Ee = ae;
+          typeof Ee == "function" ? Q(Ee, t) : ae = t, ke(t, Oe({
+            [zt]: "true"
           }, {
             "data-floe-floating-window-surface": "true",
             "data-floe-surface": "floating",
             get "data-floe-surface-interacting"() {
-              return X() || Y() ? "true" : void 0;
+              return L() || Y() ? "true" : void 0;
             },
             get "data-floe-floating-window-state"() {
-              return je() ? "active" : "inactive";
+              return Ge() ? "active" : "inactive";
             }
           }, {
-            [Oe]: "true"
+            [Le]: "true"
           }, {
             get class() {
-              return K("relative flex h-full w-full flex-col overflow-hidden", "text-card-foreground rounded-md", "border", "floe-floating-presence floe-floating-window-motion", (X() || Y()) && "floe-floating-presence--suspended", d() && "rounded-none", n.class);
+              return J("relative flex h-full w-full flex-col overflow-hidden", "text-card-foreground rounded-panel", "border", "floe-floating-presence floe-floating-window-motion", (L() || Y()) && "floe-floating-presence--suspended", c() && "rounded-none", n.class);
             },
             get style() {
               return {
-                "border-radius": d() ? "0" : "var(--floe-radius-floating)"
+                "border-radius": c() ? "0" : "var(--floe-radius-floating)"
               };
             },
             get "data-floating-presence"() {
-              return F.state();
+              return M.state();
             }
-          }), !1, !0), r.$$dblclick = nt, r.$$pointerdown = et;
-          var Me = se;
-          return typeof Me == "function" ? we(Me, r) : se = r, c(o, l(v, {
+          }), !1, !0), r.$$dblclick = it, r.$$pointerdown = tt;
+          var Me = le;
+          return typeof Me == "function" ? Q(Me, r) : le = r, f(o, l(y, {
             get when() {
               return n.title;
             },
             get children() {
-              var i = St(), G = i.firstChild;
-              return c(i, l(v, {
+              var i = Pt(), G = i.firstChild;
+              return f(i, l(y, {
                 get when() {
                   return n.titleIcon;
                 },
                 get children() {
-                  var Fe = _t();
-                  return c(Fe, () => n.titleIcon), Fe;
+                  var Fe = St();
+                  return f(Fe, () => n.titleIcon), Fe;
                 }
-              }), G), c(G, () => n.title), h(() => rt(i, "id", ye())), i;
+              }), G), f(G, () => n.title), w(() => at(i, "id", xe())), i;
             }
-          })), c(r, l(v, {
+          })), f(r, l(y, {
             get when() {
               return n.headerActions;
             },
             get children() {
-              var i = Pt(), G = i.firstChild;
-              return c(i, () => n.headerActions, G), i;
+              var i = It(), G = i.firstChild;
+              return f(i, () => n.headerActions, G), i;
             }
-          }), $), c($, l(v, {
+          }), S), f(S, l(y, {
             get when() {
-              return Q(() => !!ee())() && !w();
+              return Z(() => !!K())() && !g();
             },
             get children() {
-              return l(Le, {
+              return l(Te, {
                 variant: "ghost",
                 size: "icon",
                 "data-floe-floating-window-control": "maximize",
@@ -516,20 +521,20 @@ function Kt(n) {
                   i.stopPropagation(), Ae();
                 },
                 get "aria-label"() {
-                  return Q(() => !!d())() ? n.labels?.restore ?? "Restore" : n.labels?.maximize ?? "Maximize";
+                  return Z(() => !!c())() ? n.labels?.restore ?? "Restore" : n.labels?.maximize ?? "Maximize";
                 },
                 get children() {
-                  return l(v, {
+                  return l(y, {
                     get when() {
-                      return d();
+                      return c();
                     },
                     get fallback() {
-                      return l(ht, {
+                      return l(wt, {
                         class: "w-3 h-3"
                       });
                     },
                     get children() {
-                      return l(ft, {
+                      return l(ht, {
                         class: "w-3 h-3"
                       });
                     }
@@ -537,7 +542,7 @@ function Kt(n) {
                 }
               });
             }
-          }), null), c($, l(Le, {
+          }), null), f(S, l(Te, {
             variant: "ghost-destructive",
             size: "icon",
             "data-floe-floating-window-control": "close",
@@ -549,63 +554,63 @@ function Kt(n) {
               return n.labels?.close ?? "Close";
             },
             get children() {
-              return l(wt, {
+              return l(gt, {
                 class: "w-3.5 h-3.5"
               });
             }
-          }), null), c(U, () => n.children), c(t, l(v, {
+          }), null), f(U, () => n.children), f(t, l(y, {
             get when() {
               return n.footer;
             },
             get children() {
-              var i = It();
-              return c(i, () => n.footer), i;
+              var i = Rt();
+              return f(i, () => n.footer), i;
             }
-          }), null), c(t, l(v, {
+          }), null), f(t, l(y, {
             get when() {
-              return Q(() => !!(xe() && !d()))() && !w();
+              return Z(() => !!(me() && !c()))() && !g();
             },
             get children() {
               return [(() => {
-                var i = Rt();
-                return _(i, "pointerdown", p("n"), !0), h(() => m(i, z("n"))), i;
-              })(), (() => {
                 var i = Ct();
-                return _(i, "pointerdown", p("s"), !0), h(() => m(i, z("s"))), i;
-              })(), l(v, {
+                return P(i, "pointerdown", $("n"), !0), w(() => v(i, _("n"))), i;
+              })(), (() => {
+                var i = At();
+                return P(i, "pointerdown", $("s"), !0), w(() => v(i, _("s"))), i;
+              })(), l(y, {
                 get when() {
-                  return !M();
+                  return !E();
                 },
                 get children() {
                   return [(() => {
-                    var i = At();
-                    return _(i, "pointerdown", p("e"), !0), h(() => m(i, z("e"))), i;
-                  })(), (() => {
                     var i = Et();
-                    return _(i, "pointerdown", p("w"), !0), h(() => m(i, z("w"))), i;
+                    return P(i, "pointerdown", $("e"), !0), w(() => v(i, _("e"))), i;
                   })(), (() => {
                     var i = Mt();
-                    return _(i, "pointerdown", p("ne"), !0), h(() => m(i, z("ne"))), i;
+                    return P(i, "pointerdown", $("w"), !0), w(() => v(i, _("w"))), i;
                   })(), (() => {
                     var i = Ft();
-                    return _(i, "pointerdown", p("nw"), !0), h(() => m(i, z("nw"))), i;
+                    return P(i, "pointerdown", $("ne"), !0), w(() => v(i, _("ne"))), i;
                   })(), (() => {
                     var i = kt();
-                    return _(i, "pointerdown", p("se"), !0), h(() => m(i, z("se"))), i;
+                    return P(i, "pointerdown", $("nw"), !0), w(() => v(i, _("nw"))), i;
+                  })(), (() => {
+                    var i = Ot();
+                    return P(i, "pointerdown", $("se"), !0), w(() => v(i, _("se"))), i;
                   })(), (() => {
                     var i = Tt();
-                    return _(i, "pointerdown", p("sw"), !0), h(() => m(i, z("sw"))), i;
+                    return P(i, "pointerdown", $("sw"), !0), w(() => v(i, _("sw"))), i;
                   })()];
                 }
               })];
             }
-          }), null), h(() => m(r, K("flex shrink-0 items-center justify-between h-8", "border-b", d() ? "rounded-none" : "rounded-t-md", ve() && !w() && "cursor-move"))), e;
+          }), null), w(() => v(r, J("flex shrink-0 items-center justify-between h-8", "border-b", c() ? "rounded-none" : "rounded-t-panel", ve() && !g() && (L() ? "cursor-grabbing" : "cursor-move")))), e;
         }
       });
     }
   })];
 }
-at(["pointerdown", "dblclick"]);
+lt(["pointerdown", "dblclick"]);
 export {
-  Kt as FloatingWindow
+  en as FloatingWindow
 };