@floegence/floe-webapp-core 0.52.3 → 0.52.4

package/dist/components/file-browser/FileContextMenu.js

@@ -1,149 +1,151 @@
-import { createComponent as d, Portal as J, setAttribute as w, spread as Q, mergeProps as X, insert as M, template as y, Dynamic as ue, memo as U, effect as C, className as ce, use as j, delegateEvents as le } from "solid-js/web";
-import { createSignal as Y, createMemo as de, createEffect as W, onCleanup as H, Show as S, For as ee } from "solid-js";
-import { cn as q } from "../../utils/cn.js";
-import { deferAfterPaint as me } from "../../utils/defer.js";
-import { ChevronRight as fe } from "../icons/index.js";
-import { focusMenuItem as T, moveMenuFocus as G, calculateSubmenuPosition as he, clampMenuPosition as pe } from "../ui/menuUtils.js";
-import { LOCAL_INTERACTION_SURFACE_ATTR as te } from "../ui/localInteractionSurface.js";
-import { useFileBrowser as ve } from "./FileBrowserContext.js";
-import { resolveSurfacePortalHost as ge, projectSurfacePortalPosition as ye, resolveSurfacePortalBoundaryRect as we, isSurfacePortalMode as xe, resolveSurfacePortalMount as be } from "../ui/dialogSurfaceScope.js";
-var Me = /* @__PURE__ */ y('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><rect width=14 height=14 x=8 y=8 rx=2 ry=2></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2">'), ke = /* @__PURE__ */ y('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><rect width=14 height=16 x=5 y=4 rx=2></rect><path d="M9 4.5h6a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H9a1 1 0 0 0-1 1v.5a1 1 0 0 0 1 1Z">'), Ce = /* @__PURE__ */ y('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="m12 3-1.9 5.8a2 2 0 0 1-1.3 1.3L3 12l5.8 1.9a2 2 0 0 1 1.3 1.3L12 21l1.9-5.8a2 2 0 0 1 1.3-1.3L21 12l-5.8-1.9a2 2 0 0 1-1.3-1.3Z">'), Pe = /* @__PURE__ */ y('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="M4 20h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.93a2 2 0 0 1-1.66-.9l-.82-1.2A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13c0 1.1.9 2 2 2Z"></path><path d="M8 10v4"></path><path d="M12 10v2"></path><path d="M16 10v6">'), Ie = /* @__PURE__ */ y('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="M12 3v18"></path><path d="m8 7-4 4 4 4"></path><path d="m16 7 4 4-4 4">'), Se = /* @__PURE__ */ y('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="M3 6h18"></path><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"></path><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2">'), $e = /* @__PURE__ */ y('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"></path><path d="m15 5 4 4">'), De = /* @__PURE__ */ y('<span class="text-[10px] text-muted-foreground opacity-60">'), ne = /* @__PURE__ */ y("<div>"), Ee = /* @__PURE__ */ y('<div class=relative><button type=button role=menuitem><span class="flex-1 text-left">'), oe = /* @__PURE__ */ y('<div class="my-1 h-px bg-border"role=separator>');
-const _e = (e) => (() => {
-  var t = Me();
-  return C(() => w(t, "class", e.class)), t;
-})(), Ae = (e) => (() => {
-  var t = ke();
-  return C(() => w(t, "class", e.class)), t;
-})(), Le = (e) => (() => {
-  var t = Ce();
-  return C(() => w(t, "class", e.class)), t;
-})(), Re = (e) => (() => {
-  var t = Pe();
-  return C(() => w(t, "class", e.class)), t;
-})(), Fe = (e) => (() => {
-  var t = Ie();
-  return C(() => w(t, "class", e.class)), t;
-})(), je = (e) => (() => {
-  var t = Se();
-  return C(() => w(t, "class", e.class)), t;
-})(), Te = (e) => (() => {
-  var t = $e();
-  return C(() => w(t, "class", e.class)), t;
+import { createComponent as d, Portal as ce, spread as de, mergeProps as me, insert as M, effect as R, setStyleProperty as fe, template as C, Dynamic as Me, memo as ae, className as Ce, setAttribute as E, use as W, delegateEvents as ke } from "solid-js/web";
+import { createSignal as z, createMemo as ue, createEffect as H, onCleanup as Q, untrack as J, on as Se, Show as F, For as he } from "solid-js";
+import { cn as ee } from "../../utils/cn.js";
+import { deferAfterPaint as Ee } from "../../utils/defer.js";
+import { ChevronLeft as Le, ChevronRight as Pe } from "../icons/index.js";
+import { focusMenuItem as X, moveMenuFocus as le, calculateSubmenuPosition as Re, clampMenuPosition as $e } from "../ui/menuUtils.js";
+import { LOCAL_INTERACTION_SURFACE_ATTR as ve, CANVAS_WHEEL_INTERACTIVE_ATTR as ge } from "../ui/localInteractionSurface.js";
+import { readSurfaceSafeArea as Ie, resolveFloatingBoundary as Ae } from "../ui/surfaceFloatingBoundary.js";
+import { resolveSurfacePortalHost as _e, readFreshInteractionSnapshot as De, projectSurfacePortalPosition as Fe, resolveSurfacePortalScale as Te, isSurfacePortalMode as Be, resolveSurfacePortalMount as je } from "../ui/dialogSurfaceScope.js";
+import { useResolvedFloeConfig as Ve } from "../../context/FloeConfigContext.js";
+import { useFileBrowser as He } from "./FileBrowserContext.js";
+var ze = /* @__PURE__ */ C('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><rect width=14 height=14 x=8 y=8 rx=2 ry=2></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2">'), Oe = /* @__PURE__ */ C('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><rect width=14 height=16 x=5 y=4 rx=2></rect><path d="M9 4.5h6a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H9a1 1 0 0 0-1 1v.5a1 1 0 0 0 1 1Z">'), Ne = /* @__PURE__ */ C('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="m12 3-1.9 5.8a2 2 0 0 1-1.3 1.3L3 12l5.8 1.9a2 2 0 0 1 1.3 1.3L12 21l1.9-5.8a2 2 0 0 1 1.3-1.3L21 12l-5.8-1.9a2 2 0 0 1-1.3-1.3Z">'), qe = /* @__PURE__ */ C('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="M4 20h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.93a2 2 0 0 1-1.66-.9l-.82-1.2A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13c0 1.1.9 2 2 2Z"></path><path d="M8 10v4"></path><path d="M12 10v2"></path><path d="M16 10v6">'), Ze = /* @__PURE__ */ C('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="M12 3v18"></path><path d="m8 7-4 4 4 4"></path><path d="m16 7 4 4-4 4">'), Ke = /* @__PURE__ */ C('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="M3 6h18"></path><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"></path><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2">'), Ue = /* @__PURE__ */ C('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"></path><path d="m15 5 4 4">'), We = /* @__PURE__ */ C('<span class="shrink-0 text-[10px] text-muted-foreground opacity-60">'), we = /* @__PURE__ */ C("<div>"), Qe = /* @__PURE__ */ C('<div class=relative><button type=button role=menuitem><span class="min-w-0 flex-1 text-left [overflow-wrap:anywhere]">'), ye = /* @__PURE__ */ C('<div class="my-1 h-px bg-border"role=separator>'), Ge = /* @__PURE__ */ C('<button type=button role=menuitem class="flex w-full items-center gap-2 border-b px-3 py-1.5 text-xs cursor-pointer hover:bg-accent focus-visible:bg-accent focus:outline-none"><span></span><span class="min-w-0 flex-1 truncate text-right text-muted-foreground">');
+const Je = (e) => (() => {
+  var t = ze();
+  return R(() => E(t, "class", e.class)), t;
+})(), Xe = (e) => (() => {
+  var t = Oe();
+  return R(() => E(t, "class", e.class)), t;
+})(), Ye = (e) => (() => {
+  var t = Ne();
+  return R(() => E(t, "class", e.class)), t;
+})(), et = (e) => (() => {
+  var t = qe();
+  return R(() => E(t, "class", e.class)), t;
+})(), tt = (e) => (() => {
+  var t = Ze();
+  return R(() => E(t, "class", e.class)), t;
+})(), nt = (e) => (() => {
+  var t = Ke();
+  return R(() => E(t, "class", e.class)), t;
+})(), ot = (e) => (() => {
+  var t = Ue();
+  return R(() => E(t, "class", e.class)), t;
 })();
-let Be = 0;
-const re = {
+let rt = 0;
+const pe = {
   x: -9999,
   y: -9999
 };
-function k(e, t = 0, n = re, i = n) {
+function T(e, t = 0, s = pe, a = s) {
   return {
     phase: e,
     requestId: t,
-    anchor: n,
-    position: i
+    anchor: s,
+    position: a
   };
 }
-function ie(e) {
+function te(e) {
   return e.phase === "positioned";
 }
-function z(e) {
+function ne(e) {
   if (typeof requestAnimationFrame != "function") {
     e(0);
     return;
   }
   return requestAnimationFrame(e);
 }
-function O(e) {
+function oe(e) {
   e === void 0 || typeof cancelAnimationFrame != "function" || cancelAnimationFrame(e);
 }
-function Ne(e) {
-  const t = !!e?.onAskAgent, n = !!e?.onCopyName;
+function it(e) {
+  const t = !!e?.onAskAgent, s = !!e?.onCopyName;
   return [{
     id: "duplicate",
     label: "Duplicate",
     type: "duplicate",
-    icon: _e,
+    icon: Je,
     shortcut: "Cmd+D",
-    separator: !n && !t
-  }, ...n ? [{
+    separator: !s && !t
+  }, ...s ? [{
     id: "copy-name",
     label: "Copy Name",
     type: "copy-name",
-    icon: Ae,
+    icon: Xe,
     separator: !t
   }] : [], ...t ? [{
     id: "ask-agent",
     label: "Ask Agent",
     type: "ask-agent",
-    icon: Le,
+    icon: Ye,
     separator: !0
   }] : [], {
     id: "copy-to",
     label: "Copy to...",
     type: "copy-to",
-    icon: Re
+    icon: et
   }, {
     id: "move-to",
     label: "Move to...",
     type: "move-to",
-    icon: Fe,
+    icon: tt,
     separator: !0
   }, {
     id: "rename",
     label: "Rename",
     type: "rename",
-    icon: Te,
+    icon: ot,
     shortcut: "Enter"
   }, {
     id: "delete",
     label: "Delete",
     type: "delete",
-    icon: je,
+    icon: nt,
     shortcut: "Del"
   }];
 }
-function He(e, t, n, i) {
+function st(e, t, s, a) {
   switch (e.type) {
     case "duplicate":
-      n?.onDuplicate?.(t);
+      s?.onDuplicate?.(t);
       break;
     case "copy-name":
-      n?.onCopyName?.(t);
+      s?.onCopyName?.(t);
       break;
     case "ask-agent":
-      n?.onAskAgent?.(t);
+      s?.onAskAgent?.(t);
       break;
     case "copy-to":
-      n?.onCopyTo?.(t);
+      s?.onCopyTo?.(t);
       break;
     case "move-to":
-      n?.onMoveTo?.(t);
+      s?.onMoveTo?.(t);
       break;
     case "delete":
-      n?.onDelete?.(t);
+      s?.onDelete?.(t);
       break;
     case "rename":
-      t.length === 1 && n?.onRename?.(t[0]);
+      t.length === 1 && s?.onRename?.(t[0]);
       break;
     case "custom":
-      e.onAction?.(t, i);
+      e.onAction?.(t, a);
       break;
   }
 }
-function se(e, t) {
-  const n = e.target, i = n?.closest('[role="menu"]'), m = n?.closest('[role="menuitem"]');
+function be(e, t) {
+  const s = e.target, a = s?.closest('[role="menu"]'), g = s?.closest('[role="menuitem"]');
   switch (e.key) {
     case "ArrowDown":
-      e.preventDefault(), G(i, m, 1);
+      e.preventDefault(), le(a, g, 1);
       return;
     case "ArrowUp":
-      e.preventDefault(), G(i, m, -1);
+      e.preventDefault(), le(a, g, -1);
       return;
     case "Home":
-      e.preventDefault(), T(i, "first");
+      e.preventDefault(), X(a, "first");
       return;
     case "End":
-      e.preventDefault(), T(i, "last");
+      e.preventDefault(), X(a, "last");
       return;
     case "ArrowLeft":
       if (!t.onCloseSubmenu) return;
@@ -163,170 +165,195 @@ function se(e, t) {
       return;
   }
 }
-function qe(e, t) {
+function at(e, t) {
   return !e || typeof e != "object" ? !1 : ("dataset" in e ? e.dataset : void 0)?.floeContextMenu === t;
 }
-function ze(e, t) {
+function G(e, t) {
   if (typeof e.composedPath == "function") {
-    const i = e.composedPath();
-    for (const m of i)
-      if (qe(m, t)) return !0;
+    const a = e.composedPath();
+    for (const g of a)
+      if (at(g, t)) return !0;
   }
-  const n = e.target;
-  return typeof Element < "u" && n instanceof Element ? !!n.closest(`[data-floe-context-menu="${t}"]`) : !1;
+  const s = e.target;
+  return typeof Element < "u" && s instanceof Element ? !!s.closest(`[data-floe-context-menu="${t}"]`) : !1;
 }
-function Oe(e) {
+function ut(e) {
   const {
     ownerWindow: t,
-    contextMenuId: n,
-    onDismiss: i
-  } = e, m = (h) => {
-    ze(h, n) || i();
-  }, v = (h) => {
-    h.key === "Escape" && i();
-  }, f = () => {
-    i();
+    contextMenuId: s,
+    onDismiss: a
+  } = e, g = (w) => {
+    G(w, s) || a();
+  }, f = (w) => {
+    w.key !== "Escape" || G(w, s) || a("escape");
+  }, v = (w) => {
+    G(w, s) || a();
   };
-  return t.addEventListener("pointerdown", m, !0), t.addEventListener("keydown", v, !0), t.addEventListener("resize", f), t.addEventListener("scroll", f, !0), () => {
-    t.removeEventListener("pointerdown", m, !0), t.removeEventListener("keydown", v, !0), t.removeEventListener("resize", f), t.removeEventListener("scroll", f, !0);
+  return t.addEventListener("pointerdown", g, !0), t.addEventListener("keydown", f, !0), t.addEventListener("resize", v), t.addEventListener("scroll", v, !0), () => {
+    t.removeEventListener("pointerdown", g, !0), t.removeEventListener("keydown", f, !0), t.removeEventListener("resize", v), t.removeEventListener("scroll", v, !0);
   };
 }
-function ae(e) {
-  const [t, n] = Y(k("closed", 0));
-  let i, m, v, f, h, P = 0, x;
-  const u = () => (e.item.children?.length ?? 0) > 0, A = () => t().phase !== "closed", $ = () => ie(t()), B = () => {
-    if (!i) return re;
-    const a = i.getBoundingClientRect();
+function xe(e) {
+  const [t, s] = z(T("closed", 0));
+  let a, g, f, v, w, O = 0, $;
+  const [B, I] = z(0);
+  H(() => {
+    e.scrollRevision, J(() => y({
+      restoreFocus: !1
+    }));
+  });
+  const h = () => (e.item.children?.length ?? 0) > 0, A = () => t().phase !== "closed", _ = () => te(t()), N = () => {
+    if (!a) return pe;
+    const l = a.getBoundingClientRect();
     return {
-      x: a.right,
-      y: a.top
+      x: l.right,
+      y: l.top
     };
-  }, L = (a, l) => {
-    if (!i || !v) return a;
-    const b = i.getBoundingClientRect(), _ = v.getBoundingClientRect();
-    return he(b, _, l);
-  }, g = () => {
-    f && (clearTimeout(f), f = void 0);
-  }, D = () => {
-    O(h), h = void 0;
-  }, E = () => {
-    O(x), x = void 0;
-  }, s = (a = "first") => {
-    if (!u() || e.item.disabled) return;
-    g(), D(), E();
-    const l = ++P, b = B(), _ = e.portalLayout.boundaryRect;
-    n(k("measuring", l, b)), h = z(() => {
-      if (h = void 0, P !== l) return;
-      const F = L(b, _());
-      n(k("positioned", l, b, F)), T(v, a);
-    });
-  }, o = (a = {}) => {
-    g(), D(), n(k("closed", ++P)), (a.restoreFocus ?? !0) && (E(), x = z(() => {
-      x = void 0, m?.focus();
+  }, V = (l, u) => {
+    if (!a || !f) return l;
+    const p = a.getBoundingClientRect(), L = f.getBoundingClientRect();
+    return Re(p, L, u);
+  }, k = () => {
+    v && (clearTimeout(v), v = void 0);
+  }, S = () => {
+    oe(w), w = void 0;
+  }, q = () => {
+    oe($), $ = void 0;
+  }, j = (l = "first") => {
+    if (!h() || e.item.disabled) return;
+    if (k(), S(), q(), e.portalLayout.touch()) {
+      e.portalLayout.enterChild([...e.path, e.item], l);
+      return;
+    }
+    const u = ++O, p = N(), L = e.portalLayout.boundaryRect;
+    s(T("measuring", u, p)), w = ne(() => J(() => {
+      if (w = void 0, O !== u) return;
+      const P = L(), n = a?.getBoundingClientRect(), o = f?.getBoundingClientRect();
+      if (n && o && o.width > 0 && Math.max(P.right - n.right - 8, n.left - P.left - 8) < o.width) {
+        y({
+          restoreFocus: !1
+        }), e.portalLayout.enterChild([...e.path, e.item], l);
+        return;
+      }
+      const r = V(p, P);
+      s(T("positioned", u, p, r)), X(f, l);
     }));
-  }, p = () => {
-    !u() || e.item.disabled || (g(), f = setTimeout(() => {
-      s("first");
+  }, y = (l = {}) => {
+    k(), S(), s(T("closed", ++O)), (l.restoreFocus ?? !0) && (q(), $ = ne(() => {
+      $ = void 0, g?.focus();
+    }));
+  }, Y = () => {
+    !h() || e.item.disabled || e.portalLayout.touch() || (k(), v = setTimeout(() => {
+      j("first");
     }, 100));
-  }, c = () => {
-    u() && (g(), f = setTimeout(() => {
-      o({
+  }, b = () => {
+    h() && (k(), v = setTimeout(() => {
+      y({
         restoreFocus: !1
       });
     }, 150));
-  }, N = (a) => {
+  }, K = (l) => {
     if (!e.item.disabled) {
-      if (u()) {
-        a.preventDefault(), a.stopPropagation(), A() ? o() : s("first");
+      if (h()) {
+        l.preventDefault(), l.stopPropagation(), A() ? y() : j("first");
         return;
       }
       e.onSelect(e.item, e.menu);
     }
   };
-  H(() => {
-    g(), D(), E();
+  Q(() => {
+    k(), S(), q();
   });
-  const V = () => e.portalLayout.projectPosition(t().position);
+  const U = () => e.portalLayout.projectPosition(t().position);
   return (() => {
-    var a = Ee(), l = a.firstChild, b = l.firstChild;
-    a.addEventListener("mouseleave", c), a.addEventListener("mouseenter", p);
-    var _ = i;
-    typeof _ == "function" ? j(_, a) : i = a, l.$$keydown = (r) => {
-      e.item.disabled || !u() || (r.key === "ArrowRight" || r.key === "Enter" || r.key === " ") && (r.preventDefault(), s("first"));
-    }, l.$$click = N;
-    var F = m;
-    return typeof F == "function" ? j(F, l) : m = l, M(l, d(S, {
+    var l = Qe(), u = l.firstChild, p = u.firstChild;
+    l.addEventListener("mouseleave", b), l.addEventListener("mouseenter", Y);
+    var L = a;
+    typeof L == "function" ? W(L, l) : a = l, u.$$keydown = (n) => {
+      e.item.disabled || !h() || (n.key === "ArrowRight" || n.key === "Enter" || n.key === " ") && (n.preventDefault(), j("first"));
+    }, u.$$click = K;
+    var P = g;
+    return typeof P == "function" ? W(P, u) : g = u, M(u, d(F, {
       get when() {
         return e.item.icon;
       },
-      children: (r) => d(ue, {
+      children: (n) => d(Me, {
         get component() {
-          return r();
+          return n();
         },
-        class: "w-3.5 h-3.5 opacity-60"
+        class: "w-3.5 h-3.5 shrink-0 opacity-60"
       })
-    }), b), M(b, () => e.item.label), M(l, d(S, {
+    }), p), M(p, () => e.item.label), M(u, d(F, {
       get when() {
-        return U(() => !!e.item.shortcut)() && !u();
+        return ae(() => !!e.item.shortcut)() && !h();
       },
       get children() {
-        var r = De();
-        return M(r, () => e.item.shortcut), r;
+        var n = We();
+        return M(n, () => e.item.shortcut), n;
       }
-    }), null), M(l, d(S, {
+    }), null), M(u, d(F, {
       get when() {
-        return u();
+        return h();
       },
       get children() {
-        return d(fe, {
-          class: "w-3 h-3 text-muted-foreground"
+        return d(Pe, {
+          class: "w-3 h-3 shrink-0 text-muted-foreground"
         });
       }
-    }), null), M(a, d(S, {
+    }), null), M(l, d(F, {
       get when() {
-        return U(() => !!A())() && u();
+        return ae(() => !!A())() && h();
       },
       get children() {
-        return d(J, {
+        return d(ce, {
           get mount() {
             return e.portalLayout.mount();
           },
           get children() {
-            var r = ne(), R = v;
-            return typeof R == "function" ? j(R, r) : v = r, Q(r, X({
+            var n = we(), o = f;
+            return typeof o == "function" ? W(o, n) : f = n, de(n, me(() => e.portalLayout.scrollViewportProps(), {
+              onScroll: () => I((r) => r + 1),
               get class() {
-                return q(e.portalLayout.isSurfaceMode() ? "absolute z-20 min-w-[180px] py-1" : "fixed z-50 min-w-[180px] py-1", "bg-popover border border-border rounded-lg shadow-lg", $() && "animate-in fade-in slide-in-from-left-1");
+                return ee(e.portalLayout.isSurfaceMode() ? "absolute z-20 py-1" : "fixed z-50 py-1", "bg-popover border border-border rounded-lg shadow-lg overflow-y-auto overscroll-contain touch-pan-y motion-reduce:animate-none", _() && "animate-in fade-in slide-in-from-left-1");
               },
               get "data-floe-context-menu"() {
                 return e.contextMenuId;
               }
             }, () => ({
-              [te]: e.portalLayout.isSurfaceMode() ? "true" : void 0
+              [ge]: "true",
+              [ve]: e.portalLayout.isSurfaceMode() ? "true" : void 0
             }), {
               get style() {
                 return {
-                  left: `${V().x}px`,
-                  top: `${V().y}px`,
-                  visibility: $() ? "visible" : "hidden",
-                  "pointer-events": $() ? "auto" : "none"
+                  ...e.portalLayout.sizeStyle(),
+                  left: `${U().x}px`,
+                  top: `${U().y}px`,
+                  visibility: _() ? "visible" : "hidden",
+                  "pointer-events": _() ? "auto" : "none"
                 };
               },
               role: "menu",
               get "aria-hidden"() {
-                return $() ? void 0 : "true";
+                return _() ? void 0 : "true";
               },
-              onMouseEnter: g,
-              onMouseLeave: c,
-              onKeyDown: (I) => se(I, {
+              onMouseEnter: k,
+              onMouseLeave: b,
+              onKeyDown: (r) => be(r, {
                 onDismiss: e.onDismiss,
-                onCloseSubmenu: o
+                onCloseSubmenu: y
               })
-            }), !1, !0), M(r, d(ee, {
+            }), !1, !0), M(n, d(he, {
               get each() {
                 return e.item.children;
               },
-              children: (I) => [d(ae, {
-                item: I,
+              children: (r) => [d(xe, {
+                item: r,
+                get path() {
+                  return [...e.path, e.item];
+                },
+                get scrollRevision() {
+                  return B();
+                },
                 get menu() {
                   return e.menu;
                 },
@@ -342,173 +369,272 @@ function ae(e) {
                 get onDismiss() {
                   return e.onDismiss;
                 }
-              }), d(S, {
+              }), d(F, {
                 get when() {
-                  return I.separator;
+                  return r.separator;
                 },
                 get children() {
-                  return oe();
+                  return ye();
                 }
               })]
-            })), r;
+            })), n;
           }
         });
       }
-    }), null), C((r) => {
-      var R = e.item.disabled || !u() && e.item.type === "rename" && e.menu.items.length > 1, I = q("w-full flex items-center gap-2 px-3 py-1.5 text-xs cursor-pointer", "transition-colors duration-75", "hover:bg-accent hover:text-accent-foreground", "focus:outline-none focus-visible:bg-accent focus-visible:text-accent-foreground", "disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent", e.item.type === "delete" && "text-error hover:bg-error/10 hover:text-error"), Z = u() ? "menu" : void 0, K = u() ? A() : void 0;
-      return R !== r.e && (l.disabled = r.e = R), I !== r.t && ce(l, r.t = I), Z !== r.a && w(l, "aria-haspopup", r.a = Z), K !== r.o && w(l, "aria-expanded", r.o = K), r;
+    }), null), R((n) => {
+      var o = e.item.disabled || !h() && e.item.type === "rename" && e.menu.items.length > 1, r = ee("w-full flex items-center gap-2 px-3 py-1.5 text-xs cursor-pointer", "transition-colors duration-75", "hover:bg-accent hover:text-accent-foreground", "focus:outline-none focus-visible:bg-accent focus-visible:text-accent-foreground", "disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent", e.item.type === "delete" && "text-error hover:bg-error/10 hover:text-error"), i = e.item.id, m = e.portalLayout.touch() ? "44px" : void 0, x = h() ? "menu" : void 0, D = h() ? A() : void 0;
+      return o !== n.e && (u.disabled = n.e = o), r !== n.t && Ce(u, n.t = r), i !== n.a && E(u, "data-file-menu-item", n.a = i), m !== n.o && fe(u, "min-height", n.o = m), x !== n.i && E(u, "aria-haspopup", n.i = x), D !== n.n && E(u, "aria-expanded", n.n = D), n;
     }, {
       e: void 0,
       t: void 0,
       a: void 0,
-      o: void 0
-    }), a;
+      o: void 0,
+      i: void 0,
+      n: void 0
+    }), l;
   })();
 }
-function Ye(e) {
-  const t = ve();
-  let n;
-  const i = typeof window > "u" || typeof document > "u", m = `floe-context-menu-${Be += 1}`, [v, f] = Y(k("closed"));
-  let h, P = 0;
-  const x = de(() => t.contextMenu() ? ge() : {
+function bt(e) {
+  const t = He(), s = Ve(), [a, g] = z(!1), [f, v] = z([]), [w, O] = z(0);
+  let $ = null, B = "first", I;
+  const h = typeof window > "u" || typeof document > "u", A = `floe-context-menu-${rt += 1}`, [_, N] = z(T("closed"));
+  let V, k = 0;
+  const S = ue(() => t.contextMenu() ? _e({
+    owner: e.owner
+  }) : {
     host: null,
     boundaryHost: null,
     mountHost: null,
     mode: "global"
-  }), u = {
-    mount: () => be(x()),
-    isSurfaceMode: () => xe(x()),
-    boundaryRect: () => we(x()),
-    projectPosition: (s) => ye(s, x())
-  }, A = () => {
+  }), q = ue(() => (t.contextMenu(), Ie())), j = () => Ae(S(), e.boundary, q()), y = {
+    mount: () => je(S()),
+    isSurfaceMode: () => Be(S()),
+    boundaryRect: () => j() ?? {
+      left: 0,
+      top: 0,
+      right: 0,
+      bottom: 0,
+      width: 0,
+      height: 0
+    },
+    touch: a,
+    scrollViewportProps: () => e.scrollViewportProps,
+    enterChild: (n, o) => {
+      B = o, v(n);
+    },
+    sizeStyle: () => {
+      const n = j(), o = Te(S()), r = Math.max(0, (n?.width ?? 0) - 16) / o.x;
+      return {
+        width: "max-content",
+        "transition-property": "none",
+        "animation-duration": "100ms",
+        "min-width": `${Math.min(180, r)}px`,
+        "max-width": `${r}px`,
+        "max-height": `${Math.max(0, (n?.height ?? 0) - 16) / o.y}px`
+      };
+    },
+    projectPosition: (n) => Fe(n, S())
+  }, Y = () => {
+    const n = f().at(-1);
+    if (n) return n.children ?? [];
     if (e.overrideItems)
       return e.overrideItems;
-    const s = () => {
-      const c = e.hideItems;
-      if (!c) return [];
-      if (typeof c == "function") {
-        const N = t.contextMenu()?.items ?? [];
-        return c(N);
+    const o = () => {
+      const m = e.hideItems;
+      if (!m) return [];
+      if (typeof m == "function") {
+        const x = t.contextMenu()?.items ?? [];
+        return m(x);
       }
-      return c;
+      return m;
     };
-    let o = Ne(e.callbacks);
-    const p = s();
-    return p.length > 0 && (o = o.filter((c) => !p.includes(c.type))), e.customItems?.length && (o = [...o, ...e.customItems]), o;
-  }, $ = (s, o) => {
+    let r = it(e.callbacks);
+    const i = o();
+    return i.length > 0 && (r = r.filter((m) => !i.includes(m.type))), e.customItems?.length && (r = [...r, ...e.customItems]), r;
+  }, b = (n = !1) => {
+    const o = $;
+    t.hideContextMenu(), n && o?.isConnected && o.focus({
+      preventScroll: !0
+    });
+  }, K = () => {
+    B = f().at(-1)?.id ?? "first", v((n) => n.slice(0, -1));
+  }, U = (n, o) => {
     t.hideContextMenu();
-    const p = [...o.items], c = e.callbacks;
-    me(() => {
-      He(s, p, c, o);
+    const r = [...o.items], i = e.callbacks;
+    Ee(() => {
+      st(n, r, i, o);
     });
-  }, B = (s) => {
-    if (!n) return s;
-    const o = n.getBoundingClientRect();
-    return pe(s, o, u.boundaryRect());
-  }, L = () => {
-    O(h), h = void 0;
+  }, l = (n) => {
+    if (!I) return n;
+    const o = I.getBoundingClientRect();
+    return $e(n, o, y.boundaryRect());
+  }, u = () => {
+    oe(V), V = void 0;
   };
-  W(() => {
-    if (i || !t.contextMenu()) return;
-    const s = Oe({
+  H(() => {
+    if (h || !t.contextMenu()) return;
+    const n = ut({
       ownerWindow: window,
-      contextMenuId: m,
-      onDismiss: t.hideContextMenu
+      contextMenuId: A,
+      onDismiss: (o) => b(o === "escape")
     });
-    H(() => {
-      s();
+    Q(() => {
+      n();
     });
-  }), W(() => {
-    const s = t.contextMenu();
-    if (!s) {
-      L(), f(k("closed", ++P));
-      return;
-    }
-    L();
-    const o = ++P, p = {
-      x: s.x,
-      y: s.y
+  }), H(() => {
+    const n = t.contextMenu();
+    J(() => {
+      v([]), B = "first";
+      const o = De()?.target, r = o?.closest("button, [tabindex], a[href]") ?? o;
+      $ = e.owner ?? (r instanceof HTMLElement ? r : !h && document.activeElement instanceof HTMLElement ? document.activeElement : null), g(typeof window < "u" && !!window.matchMedia?.(`${s.config.layout.mobileQuery}, (pointer: coarse)`).matches);
+    }), n || (u(), N(T("closed", ++k)));
+  }), H(() => {
+    const n = t.contextMenu();
+    if (f(), e.boundary, !n) return;
+    u();
+    const o = ++k, r = {
+      x: n.x,
+      y: n.y
+    };
+    N(T("measuring", o, r)), V = ne(() => J(() => {
+      if (V = void 0, k !== o) return;
+      const i = j();
+      if (!i || e.boundary !== void 0 && (i.width <= 16 || i.height <= 16)) {
+        b();
+        return;
+      }
+      const m = l(r);
+      N(T("positioned", o, r, m));
+      const x = B, D = Array.from(I?.querySelectorAll("[data-file-menu-item]") ?? []).find((Z) => Z.dataset.fileMenuItem === x);
+      D ? D.focus({
+        preventScroll: !0
+      }) : X(I, x === "last" ? "last" : "first"), B = "first";
+    }));
+  }), H(Se(() => e.boundary, () => {
+    t.contextMenu() && b();
+  }, {
+    defer: !0
+  })), H(() => {
+    if (!t.contextMenu() || h) return;
+    const n = () => b();
+    window.visualViewport?.addEventListener("resize", n), window.visualViewport?.addEventListener("scroll", n), window.addEventListener("blur", n);
+    const o = (c) => {
+      te(_()) && !G(c, A) && b();
     };
-    f(k("measuring", o, p)), h = z(() => {
-      if (h = void 0, P !== o) return;
-      const c = B(p);
-      f(k("positioned", o, p, c)), T(n, "first");
+    document.addEventListener("focusin", o, !0);
+    const r = e.boundary, i = [S().boundaryHost, r instanceof HTMLElement ? r : null].filter((c) => !!c), m = i.map((c) => c.getBoundingClientRect()), x = typeof ResizeObserver > "u" ? null : new ResizeObserver(() => {
+      i.some((c, ie) => {
+        const se = c.getBoundingClientRect();
+        return se.width !== m[ie].width || se.height !== m[ie].height;
+      }) && b();
     });
-  }), H(() => {
-    L();
+    i.forEach((c) => x?.observe(c));
+    const D = e.owner ?? $ ?? i[0], Z = [];
+    for (let c = D; c; c = c.parentElement) Z.push(c);
+    const re = typeof MutationObserver > "u" ? null : new MutationObserver(() => {
+      Z.some((c) => !c.isConnected || c.inert || c.hidden || c.getAttribute("aria-hidden") === "true" || getComputedStyle(c).display === "none" || getComputedStyle(c).visibility === "hidden") && b();
+    });
+    Z.forEach((c) => re?.observe(c, {
+      attributes: !0,
+      attributeFilter: ["hidden", "inert", "aria-hidden", "style", "class"]
+    })), Q(() => {
+      x?.disconnect(), re?.disconnect(), document.removeEventListener("focusin", o, !0), window.visualViewport?.removeEventListener("resize", n), window.visualViewport?.removeEventListener("scroll", n), window.removeEventListener("blur", n);
+    });
+  }), Q(() => {
+    u();
   });
-  const g = () => ie(v()), D = () => u.projectPosition(v().position), E = (s) => (() => {
-    var o = ne(), p = n;
-    return typeof p == "function" ? j(p, o) : n = o, w(o, "data-floe-context-menu", m), Q(o, X({
+  const p = () => te(_()), L = () => y.projectPosition(_().position), P = (n) => (() => {
+    var o = we(), r = I;
+    return typeof r == "function" ? W(r, o) : I = o, de(o, me(() => e.scrollViewportProps, {
+      onScroll: () => O((i) => i + 1),
       get class() {
-        return q(u.isSurfaceMode() ? "absolute z-20 min-w-[180px] py-1" : "fixed z-50 min-w-[180px] py-1", "bg-popover border border-border rounded-lg shadow-lg", g() && "animate-in fade-in zoom-in-95 duration-100");
-      }
+        return ee(y.isSurfaceMode() ? "absolute z-20 py-1" : "fixed z-50 py-1", "bg-popover border border-border rounded-lg shadow-lg overflow-y-auto overscroll-contain touch-pan-y motion-reduce:animate-none", p() && (a() ? "animate-in fade-in" : "animate-in fade-in zoom-in-95"));
+      },
+      "data-floe-context-menu": A
     }, () => ({
-      [te]: u.isSurfaceMode() ? "true" : void 0
+      [ge]: "true",
+      [ve]: y.isSurfaceMode() ? "true" : void 0
     }), {
       get style() {
         return {
-          left: `${D().x}px`,
-          top: `${D().y}px`,
-          visibility: g() ? "visible" : "hidden",
-          "pointer-events": g() ? "auto" : "none"
+          ...y.sizeStyle(),
+          left: `${L().x}px`,
+          top: `${L().y}px`,
+          visibility: p() ? "visible" : "hidden",
+          "pointer-events": p() ? "auto" : "none"
         };
       },
       role: "menu",
       get "aria-hidden"() {
-        return g() ? void 0 : "true";
+        return p() ? void 0 : "true";
       },
       "aria-orientation": "vertical",
-      onKeyDown: (c) => se(c, {
-        onDismiss: t.hideContextMenu
-      })
-    }), !1, !0), M(o, d(ee, {
+      onKeyDown: (i) => be(i, {
+        onDismiss: () => b(i.key === "Escape" || i.key === "Tab"),
+        onCloseSubmenu: f().length ? K : void 0
+      }),
+      onContextMenu: (i) => i.preventDefault()
+    }), !1, !0), M(o, d(F, {
+      get when() {
+        return f().length > 0;
+      },
+      get children() {
+        var i = Ge(), m = i.firstChild, x = m.nextSibling;
+        return i.$$click = K, M(i, d(Le, {
+          class: "h-3.5 w-3.5 shrink-0"
+        }), m), M(m, () => e.backLabel ?? "Back"), M(x, () => f().at(-1)?.label), R((D) => fe(i, "min-height", a() ? "44px" : void 0)), i;
+      }
+    }), null), M(o, d(he, {
       get each() {
-        return A();
+        return Y();
       },
-      children: (c) => [d(ae, {
-        item: c,
+      children: (i) => [d(xe, {
+        item: i,
+        get path() {
+          return f();
+        },
+        get scrollRevision() {
+          return w();
+        },
         get menu() {
-          return s.menu();
+          return n.menu();
         },
-        contextMenuId: m,
-        portalLayout: u,
-        onSelect: $,
-        get onDismiss() {
-          return t.hideContextMenu;
-        }
-      }), d(S, {
+        contextMenuId: A,
+        portalLayout: y,
+        onSelect: U,
+        onDismiss: () => b(!0)
+      }), d(F, {
         get when() {
-          return c.separator;
+          return i.separator;
         },
         get children() {
-          return oe();
+          return ye();
         }
       })]
-    })), o;
+    }), null), o;
   })();
-  return d(S, {
+  return d(F, {
     get when() {
       return t.contextMenu();
     },
-    children: (s) => i ? d(E, {
-      menu: s
-    }) : d(J, {
+    children: (n) => h ? d(P, {
+      menu: n
+    }) : d(ce, {
       get mount() {
-        return u.mount();
+        return y.mount();
       },
       get children() {
-        return d(E, {
-          menu: s
+        return d(P, {
+          menu: n
         });
       }
     })
   });
 }
-le(["click", "keydown"]);
+ke(["click", "keydown"]);
 export {
-  Ye as FileContextMenu,
-  Ne as createDefaultContextMenuItems,
-  He as dispatchContextMenuAction,
-  Oe as installContextMenuDismissListeners
+  bt as FileContextMenu,
+  it as createDefaultContextMenuItems,
+  st as dispatchContextMenuAction,
+  ut as installContextMenuDismissListeners
 };