@floegence/floe-webapp-core 0.88.0 → 0.89.2

package/dist/components/ui/FloatingWindow.js

@@ -1,50 +1,50 @@
-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 { createComponent as l, Portal as lt, use as Q, spread as ke, mergeProps as Oe, memo as Z, insert as c, effect as w, setAttribute as Te, addEventListener as P, className as v, template as a, delegateEvents as at } from "solid-js/web";
+import { createSignal as y, createUniqueId as st, onCleanup as D, onMount as dt, createEffect as I, untrack as W, Show as g, batch as we } 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 { Button as Le } 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 { startPointerSession as xt } from "./pointerSession.js";
+import { resolveFloatingWindowViewport as ge, normalizeFloatingWindowRect as me, resolveFloatingWindowRect as vt } 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-3"></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 ?? {
+import { LOCAL_INTERACTION_SURFACE_ATTR as Be } from "./localInteractionSurface.js";
+import { resolveFloatingBoundary as zt } from "./surfaceFloatingBoundary.js";
+import { SURFACE_PORTAL_LAYER_ATTR as pt, resolveSurfacePortalHost as $t } from "./dialogSurfaceScope.js";
+var _t = /* @__PURE__ */ a("<span hidden>"), St = /* @__PURE__ */ a("<h2 class=sr-only>"), Pt = /* @__PURE__ */ a('<div data-floe-floating-window-title-content=true class="flex h-full min-w-0 flex-1 items-center cursor-default"style=touch-action:pan-x>'), It = /* @__PURE__ */ a('<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__ */ a('<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__ */ a("<div data-floe-floating-window-resize-handle=n style=touch-action:none>"), At = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=s style=touch-action:none>"), Et = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=e style=touch-action:none>"), Mt = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=w style=touch-action:none>"), Ft = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=ne style=touch-action:none>"), kt = /* @__PURE__ */ a("<div data-floe-floating-window-resize-handle=nw style=touch-action:none>"), Ot = /* @__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>"), Lt = /* @__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 h-full flex-1 min-w-0 items-center px-3"></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">'), Bt = /* @__PURE__ */ a('<span data-floe-floating-window-title-icon=true aria-hidden=true class="flex size-4 shrink-0 items-center justify-center">'), Dt = /* @__PURE__ */ a('<h2 class="flex min-w-0 items-center gap-2 text-xs leading-none font-medium select-none"><span class="min-w-0 truncate">');
+function nn(i) {
+  const xe = () => i.resizable ?? !0, K = () => i.maximizable ?? !0, ve = () => i.draggable ?? !0, q = () => i.minSize ?? {
     width: 200,
     height: 150
-  }, H = () => n.maxSize ?? {
+  }, H = () => i.maxSize ?? {
     width: 1 / 0,
     height: 1 / 0
   };
   let ee;
-  const [O, Be] = x(), [R, De] = x({
+  const [O, De] = y(), [R, We] = y({
     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
-  }), [te, We] = x(!0), g = () => !!(n.compactBelow && R().width < n.compactBelow), b = () => n.viewportInsets, T = () => O()?.fixedScale ?? 1, ne = (e) => ({
+  }), [te, qe] = y(!0), m = () => !!(i.compactBelow && R().width < i.compactBelow), b = () => i.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 ?? {
+  }), He = () => i.zIndex ?? 100, Xe = st(), Ye = ct(), Ne = ut(), E = Ye?.isMobile ?? ft(() => Ne.config.layout.mobileQuery), X = 16, ie = () => `floating-window-${Xe}-title`, [Ve, je] = y(i.defaultPosition ?? {
     x: 0,
     y: 0
-  }), [je, Ue] = x(n.defaultSize ?? {
+  }), [Ue, Ge] = y(i.defaultSize ?? {
     width: 400,
     height: 300
-  }), [c, ie] = x(!1), [L, ye] = x(!1), [Y, be] = x(!1), [Ge, oe] = x(!1), M = bt({
-    open: () => n.open,
+  }), [u, oe] = y(!1), [L, ye] = y(!1), [Y, be] = y(!1), [Qe, re] = y(!1), M = bt({
+    open: () => i.open,
     element: () => ae
   });
-  let p = {
+  let z = {
     x: 0,
     y: 0
   }, F = {
@@ -52,35 +52,35 @@ function en(n) {
     y: 0,
     width: 0,
     height: 0
-  }, re = 32, pe = {
+  }, le = 32, ze = {
     x: 0,
     y: 0
-  }, ze = {
+  }, pe = {
     x: 0,
     y: 0,
     width: 0,
     height: 0
-  }, $e = "se", s, ae, le, h = null, N, u = null, C = {
+  }, $e = "se", d, ae, se, h = null, N, f = null, C = {
     x: 0,
     y: 0
-  }, 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
-  }, m = {
-    ...a
+  }, k = null, V = null, p, de = !1, s = {
+    x: i.defaultPosition?.x ?? 0,
+    y: i.defaultPosition?.y ?? 0,
+    width: i.defaultSize?.width ?? 400,
+    height: i.defaultSize?.height ?? 300
+  }, x = {
+    ...s
   }, A;
   const _e = (e) => {
-    m = {
+    x = {
       ...e
     };
-    const t = we(R(), b());
+    const t = ge(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
     };
-  }, Qe = {
+  }, Ze = {
     n: "ns-resize",
     s: "ns-resize",
     e: "ew-resize",
@@ -89,57 +89,57 @@ function en(n) {
     nw: "nwse-resize",
     se: "nwse-resize",
     sw: "nesw-resize"
-  }, de = (e, t) => {
+  }, ce = (e, t) => {
     if (!e) {
       V?.(), V = null;
       return;
     }
     V?.(), V = mt({
-      kind: u === "resize" ? "resize" : "drag",
+      kind: f === "resize" ? "resize" : "drag",
       cursor: t,
       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"
+      lockDocumentStyles: f !== "drag"
     });
   }, 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;
+    if ((e.x !== s.x || e.y !== s.y || e.width !== s.width || e.height !== s.height) && (p?.cancel(), p = void 0), s = e, !d) 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`;
+    d.style.transform = `translate3d(${t.x}px, ${t.y}px, 0)`, d.style.width = `${e.width / T()}px`, d.style.height = `${e.height / T()}px`;
   }, Se = () => {
-    const e = Ne(), t = je();
+    const e = Ve(), t = Ue();
     return {
       x: e.x,
       y: e.y,
       width: t.width,
       height: t.height
     };
-  }, 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 : {
+  }, ue = (e) => {
+    (e.x !== s.x || e.y !== s.y || e.width !== s.width || e.height !== s.height) && (p?.cancel(), p = void 0), s = e, je((t) => t.x === e.x && t.y === e.y ? t : {
       x: e.x,
       y: e.y
-    }), Ue((t) => t.width === e.width && t.height === e.height ? t : {
+    }), Ge((t) => t.width === e.width && t.height === e.height ? t : {
       width: e.width,
       height: e.height
     });
-  }, Ze = () => {
+  }, Je = () => {
     try {
-      s?.focus({
+      d?.focus({
         preventScroll: !0
       });
     } catch {
     }
-  }, Je = (e) => {
+  }, Ke = (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;
-  }, ue = (e) => !!s && e instanceof Node && s.contains(e), Ke = (e) => {
+  }, fe = (e) => !!d && e instanceof Node && d.contains(e), et = (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 && s?.contains(o));
-  }, et = () => {
-    if (!s) return null;
-    const e = s.getBoundingClientRect();
+    return !!(o && d?.contains(o));
+  }, tt = () => {
+    if (!d) return null;
+    const e = d.getBoundingClientRect();
     return {
       x: e.left,
       y: e.top,
@@ -147,97 +147,97 @@ function en(n) {
       height: e.height
     };
   }, Pe = () => {
-    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,
+    if (i.open && !(h === null || f === null) && !(typeof window > "u")) {
+      if (f === "drag" && u()) {
+        if (Math.hypot(C.x - z.x, C.y - z.y) < 4) return;
+        const e = me({
+          rect: x,
           minSize: q(),
           maxSize: H(),
           viewport: R(),
           viewportInsets: b(),
-          mobile: n.boundary === void 0 && E(),
+          mobile: i.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));
+        }), t = Math.max(0, Math.min(1, (z.x - F.x) / Math.max(1, F.width))), r = Math.max(0, Math.min(le, z.y - F.y));
         F = {
           ...e,
-          x: p.x - e.width * t,
-          y: p.y - r
-        }, ie(!1);
+          x: z.x - e.width * t,
+          y: z.y - r
+        }, oe(!1);
       }
-      j(xt({
-        mode: u,
+      j(vt({
+        mode: f,
         pointer: C,
-        dragStartPos: p,
+        dragStartPos: z,
         dragStartRect: F,
-        dragTitlebarHeight: re,
-        resizeStartPos: pe,
-        resizeStartRect: ze,
+        dragTitlebarHeight: le,
+        resizeStartPos: ze,
+        resizeStartRect: pe,
         resizeHandle: $e,
         minSize: q(),
         maxSize: H(),
         viewport: R(),
         viewportInsets: b(),
-        mobile: n.boundary === void 0 && E(),
+        mobile: i.boundary === void 0 && E(),
         mobilePadding: X
       }));
     }
   }, B = (e) => {
     if (typeof window > "u") return;
     const t = R();
-    if (c() || g()) {
-      ce(we(t, b()));
+    if (u() || m()) {
+      ue(ge(t, b()));
       return;
     }
-    let r = ge({
-      rect: m,
+    let r = me({
+      rect: x,
       minSize: q(),
       maxSize: H(),
       viewport: t,
       viewportInsets: b(),
-      mobile: n.boundary === void 0 && E(),
+      mobile: i.boundary === void 0 && E(),
       mobilePadding: X,
       center: e?.center ?? !1
     });
-    if (n.boundary !== void 0 && A && !e?.center) {
-      const o = we(t, b());
+    if (i.boundary !== void 0 && A && !e?.center) {
+      const o = ge(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 (ce(r), !A) {
+    if (ue(r), !A) {
       const o = {
-        width: m.width,
-        height: m.height
+        width: x.width,
+        height: x.height
       };
-      _e(r), Object.assign(m, o);
+      _e(r), Object.assign(x, o);
     }
   }, Ie = (e) => {
     k !== null && typeof cancelAnimationFrame < "u" && (cancelAnimationFrame(k), k = null), e && Pe();
-    const t = u === "drag", r = e && !(t && c()) ? et() ?? a : null, o = r ? ge({
+    const t = f === "drag", r = e && !(t && u()) ? tt() ?? s : null, o = r ? me({
       rect: r,
       minSize: q(),
       maxSize: H(),
       viewport: R(),
       viewportInsets: b(),
-      mobile: n.boundary === void 0 && E(),
+      mobile: i.boundary === void 0 && E(),
       mobilePadding: X
     }) : null;
-    if (he(() => {
+    if (we(() => {
       if (o) {
-        ce(o);
+        ue(o);
         const S = {
-          width: m.width,
-          height: m.height
+          width: x.width,
+          height: x.height
         };
-        _e(o), u === "drag" && Object.assign(m, S);
+        _e(o), f === "drag" && Object.assign(x, S);
       }
-      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)) {
+      h = null, f = null, ye(!1), be(!1);
+    }), ce(!1, ""), N = void 0, o && (j(o), t && r && d?.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([{
+      p = d.animate([{
         transform: `translate3d(${S.x}px, ${S.y}px, 0)`
       }, {
         transform: `translate3d(${U.x}px, ${U.y}px, 0)`
@@ -246,23 +246,23 @@ function en(n) {
         easing: "cubic-bezier(0.2, 0.8, 0.2, 1)"
       });
     }
-  }, fe = (e = !1) => {
+  }, he = (e = !1) => {
     N ? N.stop({
       commit: e
     }) : Ie(e);
   };
   D(() => {
-    fe(!1), z?.cancel();
+    he(!1), p?.cancel();
   }), dt(() => {
     const e = () => {
-      const t = O(), r = n.boundary === void 0 ? {
+      const t = O(), r = i.boundary === void 0 ? {
         boundaryHost: null,
         mode: "global"
       } : $t({
         owner: ee
-      }), o = pt(r, n.boundary, t?.safeArea);
-      he(() => {
-        We(!!(o && o.width > 16 && o.height > 16)), De(o ? {
+      }), o = zt(r, i.boundary, t?.safeArea);
+      we(() => {
+        qe(!!(o && o.width > 16 && o.height > 16)), We(o ? {
           x: o.left,
           y: o.top,
           width: o.width,
@@ -276,26 +276,26 @@ function en(n) {
       });
     };
     D(yt(window, (t) => {
-      he(() => {
-        Be(t), W(e);
+      we(() => {
+        De(t), W(e);
       });
     })), I(() => {
-      if (!n.open || n.boundary === void 0) return;
+      if (!i.open || i.boundary === void 0) return;
       let t = 0;
       const r = () => {
         W(e), t = requestAnimationFrame(r);
       };
       r(), D(() => cancelAnimationFrame(t));
-    }), n.open || B({
-      center: !n.defaultPosition
+    }), i.open || B({
+      center: !i.defaultPosition
     });
   }), I(() => {
-    if (!n.open) return;
+    if (!i.open) return;
     E();
-    const e = !se && !n.defaultPosition, t = () => {
+    const e = !de && !i.defaultPosition, t = () => {
       B({
         center: e
-      }), se = !0;
+      }), de = !0;
     };
     if (typeof requestAnimationFrame > "u") {
       t();
@@ -303,33 +303,33 @@ function en(n) {
     }
     requestAnimationFrame(t);
   }), I(() => {
-    b(), R(), g(), !(!n.open || !se || h !== null) && W(() => B({
+    b(), R(), m(), !(!i.open || !de || h !== null) && W(() => B({
       center: !1
     }));
   }), I(() => {
-    K() || !c() || W(() => {
-      ie(!1), B({
+    K() || !u() || W(() => {
+      oe(!1), B({
         center: !1
       });
     });
   }), I(() => {
-    if (!n.open) return;
+    if (!i.open) return;
     const e = (t) => {
       if (t.key !== "Escape") return;
       const r = typeof document < "u" ? document.activeElement : null;
-      !ue(t.target) && !ue(r) || Ke(t.target) || (t.preventDefault(), typeof t.stopImmediatePropagation == "function" ? t.stopImmediatePropagation() : t.stopPropagation(), n.onOpenChange(!1));
+      !fe(t.target) && !fe(r) || et(t.target) || (t.preventDefault(), typeof t.stopImmediatePropagation == "function" ? t.stopImmediatePropagation() : t.stopPropagation(), i.onOpenChange(!1));
     };
     document.addEventListener("keydown", e, !0), D(() => document.removeEventListener("keydown", e, !0));
   }), I(() => {
-    if (!n.open) {
-      oe(!1), fe(!1);
+    if (!i.open) {
+      re(!1), he(!1);
       return;
     }
-    oe(!0);
+    re(!0);
   }), I(() => {
-    if (!n.open) return;
+    if (!i.open) return;
     const e = (o) => {
-      oe(ue(o));
+      re(fe(o));
     }, t = (o) => {
       e(o.target);
     }, r = (o) => {
@@ -339,34 +339,34 @@ function en(n) {
       document.removeEventListener("pointerdown", t), document.removeEventListener("focusin", r);
     });
   }), I(() => {
-    if (!n.open) return;
+    if (!i.open) return;
     const e = Se();
-    T(), O()?.fixedOffset, j(h === null ? e : a);
+    T(), O()?.fixedOffset, j(h === null ? e : s);
   });
-  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 = {
+  const nt = (e) => {
+    !ve() || m() || h !== null || e.pointerType === "mouse" && e.button !== 0 || e.target?.closest('button, input, select, textarea, a, [role="button"], [data-floe-floating-window-header-actions], [data-floe-floating-window-title-content]') || (e.preventDefault(), p?.cancel(), p = void 0, le = e.currentTarget instanceof HTMLElement && e.currentTarget.getBoundingClientRect().height || 32, h = e.pointerId, f = "drag", ye(!0), z = {
       x: e.clientX,
       y: e.clientY
     }, F = {
-      ...a
+      ...s
     }, C = {
       x: e.clientX,
       y: e.clientY
-    }, de(!0, "grabbing"), Ce(e));
+    }, ce(!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 = {
+    !xe() || u() || m() || h !== null || t.pointerType === "mouse" && t.button !== 0 || (t.preventDefault(), t.stopPropagation(), h = t.pointerId, f = "resize", be(!0), $e = e, ze = {
       x: t.clientX,
       y: t.clientY
-    }, ze = {
-      ...a
+    }, pe = {
+      ...s
     }, C = {
       x: t.clientX,
       y: t.clientY
-    }, de(!0, Qe[e]), Ce(t));
+    }, ce(!0, Ze[e]), Ce(t));
   }, Re = () => {
     k = null, Pe();
-  }, nt = (e) => {
-    if (!(h === null || e.pointerId !== h) && u !== null && (C = {
+  }, it = (e) => {
+    if (!(h === null || e.pointerId !== h) && f !== null && (C = {
       x: e.clientX,
       y: e.clientY
     }, k === null)) {
@@ -377,11 +377,11 @@ function en(n) {
       k = requestAnimationFrame(Re);
     }
   }, Ce = (e) => {
-    N = vt({
+    N = xt({
       pointerEvent: e,
       // Keep click/double-click targeting on the titlebar while retaining capture.
-      captureEl: u === "drag" ? le : s,
-      onMove: nt,
+      captureEl: f === "drag" ? se : d,
+      onMove: it,
       onEnd: ({
         commit: t,
         reason: r,
@@ -394,11 +394,11 @@ function en(n) {
       }
     });
   }, Ae = () => {
-    !K() || g() || (h !== null && fe(!0), ie(!c()), B());
-  }, it = (e) => {
-    e.target?.closest("button, [data-floe-floating-window-header-actions]") || Ae();
+    !K() || m() || (h !== null && he(!0), oe(!u()), B());
   }, ot = (e) => {
-    Je(e.target) && Ze();
+    e.target?.closest("button, [data-floe-floating-window-header-actions], [data-floe-floating-window-title-content]") || Ae();
+  }, rt = (e) => {
+    Ke(e.target) && Je();
   }, _ = (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",
@@ -412,16 +412,16 @@ function en(n) {
   return [(() => {
     var e = _t(), t = ee;
     return typeof t == "function" ? Q(t, e) : ee = e, e;
-  })(), l(y, {
+  })(), l(g, {
     get when() {
       return M.mounted();
     },
     get children() {
-      return l(rt, {
+      return l(lt, {
         get children() {
           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()));
+          Q((n) => {
+            d = n, W(() => j(Se()));
           }, e), ke(e, Oe({
             get "data-floating-presence"() {
               return M.state();
@@ -433,10 +433,10 @@ function en(n) {
               return M.exiting() || !te();
             },
             get "data-floe-floating-window-compact"() {
-              return g() ? "true" : void 0;
+              return m() ? "true" : void 0;
             }
           }, {
-            [Le]: "true"
+            [Be]: "true"
           }, {
             get class() {
               return J("fixed left-0 top-0 z-[100] flex flex-col", (L() || Y()) && "select-none", M.exiting() && "pointer-events-none");
@@ -444,20 +444,20 @@ function en(n) {
             get style() {
               return {
                 visibility: te() ? void 0 : "hidden",
-                "z-index": qe(),
+                "z-index": He(),
                 "will-change": L() ? "transform" : Y() ? "transform, width, height" : void 0
               };
             },
             role: "dialog",
             get "aria-labelledby"() {
-              return Z(() => !!n.title)() ? xe() : void 0;
+              return Z(() => !!i.title)() ? ie() : void 0;
             },
             tabIndex: -1,
-            onPointerDown: ot
+            onPointerDown: rt
           }), !1, !0);
           var Ee = ae;
           typeof Ee == "function" ? Q(Ee, t) : ae = t, ke(t, Oe({
-            [zt]: "true"
+            [pt]: "true"
           }, {
             "data-floe-floating-window-surface": "true",
             "data-floe-surface": "floating",
@@ -465,68 +465,89 @@ function en(n) {
               return L() || Y() ? "true" : void 0;
             },
             get "data-floe-floating-window-state"() {
-              return Ge() ? "active" : "inactive";
+              return Qe() ? "active" : "inactive";
             }
           }, {
-            [Le]: "true"
+            [Be]: "true"
           }, {
             get 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);
+              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", u() && "rounded-none", i.class);
             },
             get style() {
               return {
-                "border-radius": c() ? "0" : "var(--floe-radius-floating)"
+                "border-radius": u() ? "0" : "var(--floe-radius-floating)"
               };
             },
             get "data-floating-presence"() {
               return M.state();
             }
-          }), !1, !0), r.$$dblclick = it, r.$$pointerdown = tt;
-          var Me = le;
-          return typeof Me == "function" ? Q(Me, r) : le = r, f(o, l(y, {
+          }), !1, !0), r.$$dblclick = ot, r.$$pointerdown = nt;
+          var Me = se;
+          return typeof Me == "function" ? Q(Me, r) : se = r, c(o, l(g, {
             get when() {
-              return n.title;
+              return i.titleContent;
+            },
+            get fallback() {
+              return l(g, {
+                get when() {
+                  return i.title;
+                },
+                get children() {
+                  var n = Dt(), G = n.firstChild;
+                  return c(n, l(g, {
+                    get when() {
+                      return i.titleIcon;
+                    },
+                    get children() {
+                      var Fe = Bt();
+                      return c(Fe, () => i.titleIcon), Fe;
+                    }
+                  }), G), c(G, () => i.title), w(() => Te(n, "id", ie())), n;
+                }
+              });
             },
             get children() {
-              var i = Pt(), G = i.firstChild;
-              return f(i, l(y, {
+              return [l(g, {
                 get when() {
-                  return n.titleIcon;
+                  return i.title;
                 },
                 get children() {
-                  var Fe = St();
-                  return f(Fe, () => n.titleIcon), Fe;
+                  var n = St();
+                  return c(n, () => i.title), w(() => Te(n, "id", ie())), n;
                 }
-              }), G), f(G, () => n.title), w(() => at(i, "id", xe())), i;
+              }), (() => {
+                var n = Pt();
+                return c(n, () => i.titleContent), n;
+              })()];
             }
-          })), f(r, l(y, {
+          })), c(r, l(g, {
             get when() {
-              return n.headerActions;
+              return i.headerActions;
             },
             get children() {
-              var i = It(), G = i.firstChild;
-              return f(i, () => n.headerActions, G), i;
+              var n = It(), G = n.firstChild;
+              return c(n, () => i.headerActions, G), n;
             }
-          }), S), f(S, l(y, {
+          }), S), c(S, l(g, {
             get when() {
-              return Z(() => !!K())() && !g();
+              return Z(() => !!K())() && !m();
             },
             get children() {
-              return l(Te, {
+              return l(Le, {
                 variant: "ghost",
                 size: "icon",
                 "data-floe-floating-window-control": "maximize",
                 class: "h-full w-9 shrink-0 rounded-none border-0 px-0 active:scale-100",
-                onClick: (i) => {
-                  i.stopPropagation(), Ae();
+                onClick: (n) => {
+                  n.stopPropagation(), Ae();
                 },
                 get "aria-label"() {
-                  return Z(() => !!c())() ? n.labels?.restore ?? "Restore" : n.labels?.maximize ?? "Maximize";
+                  return Z(() => !!u())() ? i.labels?.restore ?? "Restore" : i.labels?.maximize ?? "Maximize";
                 },
                 get children() {
-                  return l(y, {
+                  return l(g, {
                     get when() {
-                      return c();
+                      return u();
                     },
                     get fallback() {
                       return l(wt, {
@@ -542,75 +563,75 @@ function en(n) {
                 }
               });
             }
-          }), null), f(S, l(Te, {
+          }), null), c(S, l(Le, {
             variant: "ghost-destructive",
             size: "icon",
             "data-floe-floating-window-control": "close",
             class: "h-full w-10 shrink-0 rounded-none border-0 px-0 active:scale-100",
-            onClick: (i) => {
-              i.stopPropagation(), n.onOpenChange(!1);
+            onClick: (n) => {
+              n.stopPropagation(), i.onOpenChange(!1);
             },
             get "aria-label"() {
-              return n.labels?.close ?? "Close";
+              return i.labels?.close ?? "Close";
             },
             get children() {
               return l(gt, {
                 class: "w-3.5 h-3.5"
               });
             }
-          }), null), f(U, () => n.children), f(t, l(y, {
+          }), null), c(U, () => i.children), c(t, l(g, {
             get when() {
-              return n.footer;
+              return i.footer;
             },
             get children() {
-              var i = Rt();
-              return f(i, () => n.footer), i;
+              var n = Rt();
+              return c(n, () => i.footer), n;
             }
-          }), null), f(e, l(y, {
+          }), null), c(e, l(g, {
             get when() {
-              return Z(() => !!(me() && !c()))() && !g();
+              return Z(() => !!(xe() && !u()))() && !m();
             },
             get children() {
               return [(() => {
-                var i = Ct();
-                return P(i, "pointerdown", $("n"), !0), w(() => v(i, _("n"))), i;
+                var n = Ct();
+                return P(n, "pointerdown", $("n"), !0), w(() => v(n, _("n"))), n;
               })(), (() => {
-                var i = At();
-                return P(i, "pointerdown", $("s"), !0), w(() => v(i, _("s"))), i;
-              })(), l(y, {
+                var n = At();
+                return P(n, "pointerdown", $("s"), !0), w(() => v(n, _("s"))), n;
+              })(), l(g, {
                 get when() {
                   return !E();
                 },
                 get children() {
                   return [(() => {
-                    var i = Et();
-                    return P(i, "pointerdown", $("e"), !0), w(() => v(i, _("e"))), i;
+                    var n = Et();
+                    return P(n, "pointerdown", $("e"), !0), w(() => v(n, _("e"))), n;
                   })(), (() => {
-                    var i = Mt();
-                    return P(i, "pointerdown", $("w"), !0), w(() => v(i, _("w"))), i;
+                    var n = Mt();
+                    return P(n, "pointerdown", $("w"), !0), w(() => v(n, _("w"))), n;
                   })(), (() => {
-                    var i = Ft();
-                    return P(i, "pointerdown", $("ne"), !0), w(() => v(i, _("ne"))), i;
+                    var n = Ft();
+                    return P(n, "pointerdown", $("ne"), !0), w(() => v(n, _("ne"))), n;
                   })(), (() => {
-                    var i = kt();
-                    return P(i, "pointerdown", $("nw"), !0), w(() => v(i, _("nw"))), i;
+                    var n = kt();
+                    return P(n, "pointerdown", $("nw"), !0), w(() => v(n, _("nw"))), n;
                   })(), (() => {
-                    var i = Ot();
-                    return P(i, "pointerdown", $("se"), !0), w(() => v(i, _("se"))), i;
+                    var n = Ot();
+                    return P(n, "pointerdown", $("se"), !0), w(() => v(n, _("se"))), n;
                   })(), (() => {
-                    var i = Tt();
-                    return P(i, "pointerdown", $("sw"), !0), w(() => v(i, _("sw"))), i;
+                    var n = Tt();
+                    return P(n, "pointerdown", $("sw"), !0), w(() => v(n, _("sw"))), n;
                   })()];
                 }
               })];
             }
-          }), 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;
+          }), null), w(() => v(r, J("flex shrink-0 items-center justify-between h-8", "border-b", u() ? "rounded-none" : "rounded-t-panel", ve() && !m() && (L() ? "cursor-grabbing" : "cursor-move")))), e;
         }
       });
     }
   })];
 }
-lt(["pointerdown", "dblclick"]);
+at(["pointerdown", "dblclick"]);
 export {
-  en as FloatingWindow
+  nn as FloatingWindow
 };