@alfadocs/ui-kit 1.42.0 → 1.43.0

package/dist/_chunks/{tool-rail-D89USYE6.js → tool-rail-CCFqDfAn.js}

@@ -1,19 +1,19 @@
-import { jsxs as S, jsx as g } from "react/jsx-runtime";
-import { forwardRef as rt, useRef as h, useState as A, useMemo as M, useId as it, useCallback as N, useEffect as re, useImperativeHandle as ot, Fragment as lt } from "react";
-import { c as E } from "./index-D2ZczOXr.js";
-import { useTranslation as dt } from "react-i18next";
-import { I as Le } from "./icon-button-CehAeZoP.js";
-import { S as ct } from "./scroll-area-BZOvUhwQ.js";
-import { a as ut } from "./tooltip-Cp-PLePW.js";
-import { u as ft } from "./use-controllable-state-BiY4xTzM.js";
-import { u as pt } from "./use-edge-resize-ZnGG7gyO.js";
-import { u as P } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
-import { a as vt, u as ze, R as mt } from "./use-list-reflow-Cw43nxw5.js";
-import { u as gt } from "./use-prefers-reduced-motion-BMwIQRjB.js";
-import { u as bt } from "./use-presence-transition-cDwWUXV-.js";
-import { u as ht } from "./use-theme-CAuo6EYT.js";
-import { u as yt } from "./registry-DvAUVLHh.js";
-const It = {
+import { jsxs as R, jsx as g } from "react/jsx-runtime";
+import { forwardRef as ot, useRef as h, useState as S, useMemo as j, useId as lt, useCallback as z, useEffect as ie, useImperativeHandle as dt, Fragment as ct } from "react";
+import { c as A } from "./index-D2ZczOXr.js";
+import { useTranslation as ut } from "react-i18next";
+import { I as ze } from "./icon-button-CehAeZoP.js";
+import { S as ft } from "./scroll-area-BZOvUhwQ.js";
+import { a as pt } from "./tooltip-Cp-PLePW.js";
+import { u as vt } from "./use-controllable-state-BiY4xTzM.js";
+import { u as mt } from "./use-edge-resize-BHesP0kg.js";
+import { u as M } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
+import { a as gt, u as Ne, R as bt } from "./use-list-reflow-Cw43nxw5.js";
+import { u as ht } from "./use-prefers-reduced-motion-BMwIQRjB.js";
+import { u as yt } from "./use-presence-transition-cDwWUXV-.js";
+import { u as It } from "./use-theme-CAuo6EYT.js";
+import { u as xt } from "./registry-DvAUVLHh.js";
+const wt = {
   id: "tool-rail",
   capabilities: ["open", "close", "select_single"],
   state: {
@@ -40,8 +40,8 @@ const It = {
       descriptionKey: "ui.toolRail.agent.actions.open",
       description: "Open the given tool's panel.",
       examples: [{ args: { id: "inbox" }, note: "Open the inbox tool panel." }],
-      invoke: (l, n) => {
-        l.open(n.id);
+      invoke: (l, s) => {
+        l.open(s.id);
       }
     },
     close: {
@@ -64,8 +64,8 @@ const It = {
       idempotent: !0,
       descriptionKey: "ui.toolRail.agent.actions.selectTool",
       description: "Set the active tool by id (opens its panel), or pass null to collapse.",
-      invoke: (l, n) => {
-        l.setActiveTool(n.id);
+      invoke: (l, s) => {
+        l.setActiveTool(s.id);
       }
     }
   },
@@ -85,7 +85,7 @@ const It = {
       description: "Stable tool id emitted on each strip IconButton. The active icon also carries data-active set to its id."
     }
   }
-}, xt = "ds:[inline-size:3rem]", wt = "ds:[inline-size:var(--tool-rail-panel-inline-size,var(--ai-tools-rail-panel-inline-size,22rem))]", Ne = "--tool-rail-panel-inline-size", Tt = 288, Rt = 880, St = 352, At = E(
+}, Tt = "ds:[inline-size:3rem]", Rt = "ds:[inline-size:var(--tool-rail-panel-inline-size,var(--ai-tools-rail-panel-inline-size,22rem))]", De = "--tool-rail-panel-inline-size", St = 288, At = 880, Et = 352, kt = A(
   ["ds:flex ds:shrink-0 ds:h-full", "ds:bg-[var(--background)]"].join(" "),
   {
     variants: {
@@ -103,18 +103,18 @@ const It = {
     },
     defaultVariants: { side: "end" }
   }
-), Et = E(
+), _t = A(
   [
     "ds:flex ds:shrink-0 ds:flex-col ds:items-center",
     "ds:pt-[var(--spacing-md)] ds:pb-[var(--spacing-md)]",
     "ds:gap-[var(--spacing-xs)]",
-    xt
+    Tt
   ].join(" ")
-), kt = E(
+), Lt = A(
   [
     "ds:relative ds:flex ds:min-h-0 ds:flex-col ds:h-full",
     "ds:bg-[var(--background)]",
-    wt,
+    Rt,
     // Open / collapse: the panel fades and slides from the strip. The WIDTH
     // snaps on purpose — animating it would re-lay-out the main area (a
     // calendar grid) on every frame. Declared at rest so both directions
@@ -135,7 +135,7 @@ const It = {
     },
     defaultVariants: { side: "end" }
   }
-), _t = "ds:relative ds:flex ds:min-h-0 ds:flex-1 ds:flex-col ds:overflow-clip", De = E(
+), zt = "ds:relative ds:flex ds:min-h-0 ds:flex-1 ds:flex-col ds:overflow-clip", Ce = A(
   [
     "ds:flex ds:min-h-0 ds:flex-col",
     "ds:transition-[opacity,translate] ds:duration-[var(--animation-duration)]",
@@ -160,7 +160,7 @@ const It = {
     },
     defaultVariants: { layer: "live" }
   }
-), Lt = 500, zt = [
+), Nt = 500, Dt = [
   "id",
   "name",
   "for",
@@ -168,29 +168,29 @@ const It = {
   "data-component-id",
   "data-testid"
 ];
-function Nt(l) {
-  return window.getComputedStyle(l).transitionDuration.split(",").some((n) => Number.parseFloat(n) > 0);
+function Ct(l) {
+  return window.getComputedStyle(l).transitionDuration.split(",").some((s) => Number.parseFloat(s) > 0);
 }
-function Dt(l) {
-  const n = l.cloneNode(!0), H = l.querySelectorAll("*"), q = n.querySelectorAll("*"), F = [];
-  return H.forEach((d, D) => {
-    var x;
-    const f = q[D];
-    if (f && ((d.scrollTop !== 0 || d.scrollLeft !== 0) && F.push([f, d.scrollTop, d.scrollLeft]), d instanceof HTMLCanvasElement && f instanceof HTMLCanvasElement))
+function Vt(l) {
+  const s = l.cloneNode(!0), U = l.querySelectorAll("*"), P = s.querySelectorAll("*"), q = [];
+  return U.forEach((d, N) => {
+    var F;
+    const f = P[N];
+    if (f && ((d.scrollTop !== 0 || d.scrollLeft !== 0) && q.push([f, d.scrollTop, d.scrollLeft]), d instanceof HTMLCanvasElement && f instanceof HTMLCanvasElement))
       try {
-        (x = f.getContext("2d")) == null || x.drawImage(d, 0, 0);
+        (F = f.getContext("2d")) == null || F.drawImage(d, 0, 0);
       } catch {
       }
-  }), q.forEach((d) => {
-    const D = d instanceof SVGElement;
-    for (const f of zt)
-      D && f === "id" || d.removeAttribute(f);
+  }), P.forEach((d) => {
+    const N = d instanceof SVGElement;
+    for (const f of Dt)
+      N && f === "id" || d.removeAttribute(f);
     if (d.matches("iframe, video, audio, embed, object, source"))
       for (const f of ["src", "srcdoc", "data", "autoplay"])
         d.removeAttribute(f);
-  }), { nodes: Array.from(n.childNodes), scrolls: F };
+  }), { nodes: Array.from(s.childNodes), scrolls: q };
 }
-const Ct = E(
+const Bt = A(
   [
     "ds:absolute ds:[inset-block:0] ds:z-[1] ds:select-none ds:touch-none",
     "ds:[inline-size:var(--resizable-handle-size)] ds:cursor-col-resize",
@@ -214,7 +214,7 @@ const Ct = E(
     },
     defaultVariants: { edge: "inline-start" }
   }
-), Vt = E(
+), jt = A(
   [
     "ds:absolute ds:-top-[var(--spacing-xs)] ds:-end-[var(--spacing-xs)]",
     "ds:inline-flex ds:items-center ds:justify-center",
@@ -227,7 +227,7 @@ const Ct = E(
     "ds:pointer-events-none ds:select-none",
     "ds:forced-colors:outline ds:forced-colors:outline-1 ds:forced-colors:outline-[CanvasText]"
   ].join(" ")
-), Ce = E(
+), Ve = A(
   // `group/rail-tool` lets an affordance overlay (e.g. a pin star) reveal on
   // hover / focus-within of the whole slot.
   ["ds:group/rail-tool ds:relative", "ds:rounded-[var(--radius-sm)]"],
@@ -249,311 +249,317 @@ const Ct = E(
       reorderable: !1
     }
   }
-), Bt = "ds:opacity-0", Ve = [
+), Mt = "ds:opacity-0", Be = [
   "ds:transition-opacity ds:duration-[var(--animation-duration)]",
   "ds:ease-[var(--ease-out)] ds:motion-reduce:transition-none"
 ].join(" ");
-function jt(l, n) {
-  return l > 99 ? n : String(l);
+function Pt(l, s) {
+  return l > 99 ? s : String(l);
 }
-const Mt = rt(
+const qt = ot(
   ({
     id: l,
-    tools: n,
-    activeToolId: H,
-    defaultActiveToolId: q = null,
-    onActiveToolChange: F,
+    tools: s,
+    activeToolId: U,
+    defaultActiveToolId: P = null,
+    onActiveToolChange: q,
     side: d = "end",
-    railLabel: D,
+    railLabel: N,
     resizablePanel: f = !1,
-    onReorder: x,
-    formatReorderAnnouncement: U,
-    renderToolAffordance: W,
-    renderPanelHeader: ie,
-    dataComponent: Be = "tool-rail",
-    agentAdapter: je = It,
-    className: Me
-  }, Pe) => {
-    var Se, Ae, Ee;
-    const { t: y } = dt(), [qe, I] = ft({
-      value: H,
-      defaultValue: q,
-      onChange: F
-    }), w = qe ?? null, Z = h([]), C = h(null), [G, Y] = A(0), k = h(!1), X = h(!1), T = M(
-      () => n.findIndex((e) => e.id === w),
-      [n, w]
-    ), u = T >= 0 ? n[T] : null, J = h(u);
-    u && (J.current = u);
-    const Fe = M(
-      () => n.findIndex((e) => !e.disabled),
-      [n]
-    ), oe = M(() => {
+    panelWidth: F,
+    onPanelWidthChange: je,
+    onReorder: K,
+    formatReorderAnnouncement: W,
+    renderToolAffordance: Z,
+    renderPanelHeader: oe,
+    dataComponent: Me = "tool-rail",
+    agentAdapter: Pe = wt,
+    className: qe
+  }, Fe) => {
+    var Ae, Ee, ke;
+    const { t: y } = ut(), [Ke, I] = vt({
+      value: U,
+      defaultValue: P,
+      onChange: q
+    }), x = Ke ?? null, G = h([]), D = h(null), [Y, X] = S(0), E = h(!1), J = h(!1), w = j(
+      () => s.findIndex((e) => e.id === x),
+      [s, x]
+    ), u = w >= 0 ? s[w] : null, Q = h(u);
+    u && (Q.current = u);
+    const Oe = j(
+      () => s.findIndex((e) => !e.disabled),
+      [s]
+    ), le = j(() => {
       var t;
-      const e = (t = n[0]) == null ? void 0 : t.scope;
-      return e ? n.findIndex((a) => a.scope && a.scope !== e) : -1;
-    }, [n]), Ke = oe > 0, p = M(() => {
+      const e = (t = s[0]) == null ? void 0 : t.scope;
+      return e ? s.findIndex((a) => a.scope && a.scope !== e) : -1;
+    }, [s]), $e = le > 0, p = j(() => {
       var a;
-      const e = n.findIndex((s) => s.reorderable);
+      const e = s.findIndex((n) => n.reorderable);
       if (e < 0) return null;
       let t = e;
-      for (; t + 1 < n.length && ((a = n[t + 1]) != null && a.reorderable); ) t += 1;
+      for (; t + 1 < s.length && ((a = s[t + 1]) != null && a.reorderable); ) t += 1;
       return { first: e, last: t };
-    }, [n]), le = !!x && p !== null, Oe = it(), [V, Q] = A(null), [de, K] = A(null), { resolvedTheme: $e } = ht(), _ = $e.endsWith("-accessible") || void 0, { containerRef: He } = vt({
-      key: n.map((e) => e.id).join(),
-      reduceMotion: _
-    }), ee = ze({ reduceMotion: _ }), te = bt(
+    }, [s]), de = !!K && p !== null, He = lt(), [C, ee] = S(null), [ce, O] = S(null), { resolvedTheme: Ue } = It(), k = Ue.endsWith("-accessible") || void 0, { containerRef: We } = gt({
+      key: s.map((e) => e.id).join(),
+      reduceMotion: k
+    }), te = Ne({ reduceMotion: k }), ae = yt(
       u !== null,
-      { reduceMotion: _ }
-    ), R = u === null && te.mounted, b = u ?? (R ? J.current : null), { ref: ce } = te, Ue = N(
+      { reduceMotion: k }
+    ), T = u === null && ae.mounted, b = u ?? (T ? Q.current : null), { ref: ue } = ae, Ze = z(
       (e) => {
-        C.current = e, ce(e);
+        D.current = e, ue(e);
       },
-      [ce]
+      [ue]
     );
-    P(() => {
-      var a, s;
-      const e = C.current;
+    M(() => {
+      var a, n;
+      const e = D.current;
       if (!e) return;
       const t = document.activeElement;
-      if (R && t instanceof HTMLElement && e.contains(t)) {
-        const i = (a = J.current) == null ? void 0 : a.id, o = i ? (s = L.current) == null ? void 0 : s.querySelector(
+      if (T && t instanceof HTMLElement && e.contains(t)) {
+        const i = (a = Q.current) == null ? void 0 : a.id, o = i ? (n = _.current) == null ? void 0 : n.querySelector(
           `[data-tool-id="${CSS.escape(i)}"]`
         ) : null;
         t.blur(), e.setAttribute("inert", ""), o == null || o.focus();
         return;
       }
-      e.toggleAttribute("inert", R);
-    }, [R]);
-    const ue = gt(), [O, fe] = A(
+      e.toggleAttribute("inert", T);
+    }, [T]);
+    const fe = ht(), [$, pe] = S(
       (u == null ? void 0 : u.id) ?? null
-    ), v = (u == null ? void 0 : u.id) ?? null, $ = !_ && !ue && v !== null && O !== null && O !== v;
-    P(() => {
-      if (O === v) return;
-      if (!$) {
-        fe(v);
+    ), v = (u == null ? void 0 : u.id) ?? null, H = !k && !fe && v !== null && $ !== null && $ !== v;
+    M(() => {
+      if ($ === v) return;
+      if (!H) {
+        pe(v);
         return;
       }
       let e = 0;
-      const t = () => fe(v), a = requestAnimationFrame(() => {
+      const t = () => pe(v), a = requestAnimationFrame(() => {
         e = requestAnimationFrame(t);
-      }), s = window.setTimeout(t, 64);
+      }), n = window.setTimeout(t, 64);
       return () => {
-        cancelAnimationFrame(a), cancelAnimationFrame(e), window.clearTimeout(s);
+        cancelAnimationFrame(a), cancelAnimationFrame(e), window.clearTimeout(n);
       };
-    }, [v, O, $]);
-    const We = !!_ || ue, pe = h(null), [c, ve] = A({ liveId: v, serial: 0, focusLost: !1, leaving: [] });
+    }, [v, $, H]);
+    const Ge = !!k || fe, ve = h(null), [c, me] = S({ liveId: v, serial: 0, focusLost: !1, leaving: [] });
     if (c.liveId !== v) {
-      const e = c.liveId !== null && v !== null ? ((Se = pe.current) == null ? void 0 : Se.querySelector(
+      const e = c.liveId !== null && v !== null ? ((Ae = ve.current) == null ? void 0 : Ae.querySelector(
         ':scope > [data-tool-rail-layer="live"]'
       )) ?? null : null, t = c.leaving.filter(
         (a) => a.toolId !== v
       );
-      ve({
+      me({
         liveId: v,
         serial: c.serial + 1,
         focusLost: (e == null ? void 0 : e.contains(document.activeElement)) ?? !1,
-        leaving: e && !We ? [
+        leaving: e && !Ge ? [
           ...t.filter((a) => a.toolId !== c.liveId),
           {
             exitId: `${c.liveId}:${c.serial}`,
             toolId: c.liveId,
-            ...Dt(e)
+            ...Vt(e)
           }
         ] : t
       });
     }
-    const B = N((e) => {
-      ve(
+    const V = z((e) => {
+      me(
         (t) => t.leaving.some((a) => a.exitId === e) ? {
           ...t,
           leaving: t.leaving.filter((a) => a.exitId !== e)
         } : t
       );
-    }, []), { leave: me } = ze({
-      reduceMotion: _,
-      durationMs: Lt
+    }, []), { leave: ge } = Ne({
+      reduceMotion: k,
+      durationMs: Nt
     });
-    re(() => {
+    ie(() => {
       for (const { exitId: e } of c.leaving)
-        me(e, () => B(e));
-    }, [c.leaving, me, B]);
-    const Ze = b ? c.leaving : [], Ge = ((Ae = c.leaving[c.leaving.length - 1]) == null ? void 0 : Ae.exitId) ?? null, ge = h(c.leaving);
-    ge.current = c.leaving;
-    const Ye = N(
+        ge(e, () => V(e));
+    }, [c.leaving, ge, V]);
+    const Ye = b ? c.leaving : [], Xe = ((Ee = c.leaving[c.leaving.length - 1]) == null ? void 0 : Ee.exitId) ?? null, be = h(c.leaving);
+    be.current = c.leaving;
+    const Je = z(
       (e) => {
         if (!e || e.childNodes.length > 0) return;
-        const t = ge.current.find(
+        const t = be.current.find(
           (a) => a.exitId === e.dataset.exitId
         );
         if (t) {
-          if (!Nt(e)) {
-            B(t.exitId);
+          if (!Ct(e)) {
+            V(t.exitId);
             return;
           }
           e.setAttribute("inert", ""), e.append(...t.nodes);
-          for (const [a, s, i] of t.scrolls)
-            a.scrollTop = s, a.scrollLeft = i;
+          for (const [a, n, i] of t.scrolls)
+            a.scrollTop = n, a.scrollLeft = i;
         }
       },
-      [B]
+      [V]
     );
-    P(() => {
+    M(() => {
       var t, a;
       if (!c.focusLost || !v) return;
       const e = document.activeElement;
-      e && e !== document.body || (a = (t = L.current) == null ? void 0 : t.querySelector(
+      e && e !== document.body || (a = (t = _.current) == null ? void 0 : t.querySelector(
         `[data-tool-id="${CSS.escape(v)}"]`
       )) == null || a.focus();
     }, [c.serial]);
-    const [Xe, be] = A([]), he = h(n);
-    re(() => {
-      const e = he.current, t = new Set(n.map((s) => s.id)), a = e.filter((s) => !t.has(s.id));
+    const [Qe, he] = S([]), ye = h(s);
+    ie(() => {
+      const e = ye.current, t = new Set(s.map((n) => n.id)), a = e.filter((n) => !t.has(n.id));
       if (a.length > 0) {
-        be((s) => {
-          const i = new Set(s.map((o) => o.id));
+        he((n) => {
+          const i = new Set(n.map((o) => o.id));
           return [
-            ...s,
+            ...n,
             ...a.filter((o) => !i.has(o.id))
           ];
         });
-        for (const s of a)
-          ee.leave(s.id, () => {
-            be(
-              (i) => i.filter((o) => o.id !== s.id)
+        for (const n of a)
+          te.leave(n.id, () => {
+            he(
+              (i) => i.filter((o) => o.id !== n.id)
             );
           });
       }
-      he.current = n;
-    }, [n, ee]);
-    const [Je, Qe] = A(""), ae = h(!1), ye = N(
+      ye.current = s;
+    }, [s, te]);
+    const [et, tt] = S(""), se = h(!1), Ie = z(
       (e, t) => {
-        if (!x || !p) return;
+        if (!K || !p) return;
         const a = Math.max(
           p.first,
           Math.min(p.last, t)
         );
         if (a === e) return;
-        x(e, a);
-        const s = n[e];
-        if (s) {
-          const i = U ? U({ tool: s, from: e, to: a }) : y("toolRail.reorderAnnounce", {
-            tool: s.label,
+        K(e, a);
+        const n = s[e];
+        if (n) {
+          const i = W ? W({ tool: n, from: e, to: a }) : y("toolRail.reorderAnnounce", {
+            tool: n.label,
             to: a - p.first + 1,
             total: p.last - p.first + 1,
             defaultValue: "{{tool}} moved to position {{to}} of {{total}}"
           });
-          i && (ae.current = !ae.current, Qe(ae.current ? i : `${i}​`));
+          i && (se.current = !se.current, tt(se.current ? i : `${i}​`));
         }
       },
-      [x, p, n, y, U]
-    ), j = T >= 0 ? T : G >= 0 && !((Ee = n[G]) != null && Ee.disabled) ? G : Fe, et = N(
+      [K, p, s, y, W]
+    ), B = w >= 0 ? w : Y >= 0 && !((ke = s[Y]) != null && ke.disabled) ? Y : Oe, at = z(
       (e, t) => {
-        const a = n.find((s) => s.id === e);
-        !a || a.disabled || (k.current = t, I(w === e ? null : e));
+        const a = s.find((n) => n.id === e);
+        !a || a.disabled || (E.current = t, I(x === e ? null : e));
       },
-      [n, w, I]
-    ), tt = N(
+      [s, x, I]
+    ), st = z(
       (e) => {
-        var z, r, m;
-        const t = n.length;
+        var L, r, m;
+        const t = s.length;
         if (t === 0 || e.altKey) return;
         let a = null;
-        if (e.key === "ArrowDown" ? a = (j + 1) % t : e.key === "ArrowUp" ? a = (j - 1 + t) % t : e.key === "Home" ? a = 0 : e.key === "End" && (a = t - 1), a === null) return;
-        const s = e.key === "ArrowUp" || e.key === "End";
+        if (e.key === "ArrowDown" ? a = (B + 1) % t : e.key === "ArrowUp" ? a = (B - 1 + t) % t : e.key === "Home" ? a = 0 : e.key === "End" && (a = t - 1), a === null) return;
+        const n = e.key === "ArrowUp" || e.key === "End";
         let i = a, o = 0;
-        for (; o < t && ((z = n[i]) != null && z.disabled); )
-          i = s ? (i - 1 + t) % t : (i + 1) % t, o += 1;
-        (r = n[i]) != null && r.disabled || (e.preventDefault(), Y(i), (m = Z.current[i]) == null || m.focus());
+        for (; o < t && ((L = s[i]) != null && L.disabled); )
+          i = n ? (i - 1 + t) % t : (i + 1) % t, o += 1;
+        (r = s[i]) != null && r.disabled || (e.preventDefault(), X(i), (m = G.current[i]) == null || m.focus());
       },
-      [n, j]
-    ), L = h(null);
-    re(() => {
-      const e = L.current;
+      [s, B]
+    ), _ = h(null);
+    ie(() => {
+      const e = _.current;
       if (!e) return;
       const t = (a) => {
-        if (a.key !== "Escape" || T < 0) return;
+        if (a.key !== "Escape" || w < 0) return;
         a.preventDefault();
-        const s = T;
-        I(null), Y(s), requestAnimationFrame(() => {
+        const n = w;
+        I(null), X(n), requestAnimationFrame(() => {
           var i;
-          (i = Z.current[s]) == null || i.focus();
+          (i = G.current[n]) == null || i.focus();
         });
       };
       return e.addEventListener("keydown", t), () => e.removeEventListener("keydown", t);
-    }, [T, I]), P(() => {
+    }, [w, I]), M(() => {
       var e;
-      u && k.current && ((e = C.current) == null || e.focus()), k.current = !1;
+      u && E.current && ((e = D.current) == null || e.focus()), E.current = !1;
     }, [u]);
-    const Ie = d === "end" ? "inline-start" : "inline-end", { separatorProps: xe, isResizing: we, isResized: Te } = pt({
-      edge: Ie,
-      targetRef: C,
-      cssProperty: Ne,
-      minSize: Tt,
-      maxSize: Rt,
-      defaultSize: St,
-      disabled: !f
-    }), Re = xe["aria-valuenow"];
-    P(() => {
+    const xe = d === "end" ? "inline-start" : "inline-end", { separatorProps: we, isResizing: Te, isResized: Re } = mt({
+      edge: xe,
+      targetRef: D,
+      cssProperty: De,
+      minSize: St,
+      maxSize: At,
+      defaultSize: Et,
+      disabled: !f,
+      // A width the user cannot change or reset is a trap: the controlled
+      // value applies only while the handle is on.
+      size: f ? F : void 0,
+      onResize: je
+    }), Se = we["aria-valuenow"];
+    M(() => {
       var e;
-      !f || !Te || !u || (e = C.current) == null || e.style.setProperty(
-        Ne,
-        `${Re}px`
+      !f || !Re || !u || (e = D.current) == null || e.style.setProperty(
+        De,
+        `${Se}px`
       );
-    }, [u, f, Te, Re]);
-    const ne = h(w);
-    ne.current = w;
-    const se = M(
+    }, [u, f, Re, Se]);
+    const ne = h(x);
+    ne.current = x;
+    const re = j(
       () => ({
         getActiveToolId: () => ne.current,
         setActiveTool: (e) => {
-          k.current = !1, I(e);
+          E.current = !1, I(e);
         },
         open: (e) => {
-          const t = n.find((a) => a.id === e);
-          !t || t.disabled || (k.current = !1, I(e));
+          const t = s.find((a) => a.id === e);
+          !t || t.disabled || (E.current = !1, I(e));
         },
         close: () => {
           const e = ne.current;
-          k.current = !1, I(null), e != null && requestAnimationFrame(() => {
+          E.current = !1, I(null), e != null && requestAnimationFrame(() => {
             var t, a;
-            (a = (t = L.current) == null ? void 0 : t.querySelector(
+            (a = (t = _.current) == null ? void 0 : t.querySelector(
               `[data-tool-id="${CSS.escape(e)}"]`
             )) == null || a.focus();
           });
         }
       }),
-      [n, I]
+      [s, I]
     );
-    ot(Pe, () => se, [se]), yt(je, se, l);
-    const at = y("toolRail.badgeCountOverflow", {
+    dt(Fe, () => re, [re]), xt(Pe, re, l);
+    const nt = y("toolRail.badgeCountOverflow", {
       defaultValue: "99+"
     });
-    return /* @__PURE__ */ S(
+    return /* @__PURE__ */ R(
       "div",
       {
-        ref: L,
-        "data-component": Be,
+        ref: _,
+        "data-component": Me,
         "data-component-id": l,
         "data-side": d,
-        className: [At({ side: d }), Me].filter(Boolean).join(" "),
+        className: [kt({ side: d }), qe].filter(Boolean).join(" "),
         children: [
-          le ? /* @__PURE__ */ g("span", { role: "status", "aria-live": "polite", className: "ds:sr-only", children: Je }) : null,
-          b ? /* @__PURE__ */ S(
+          de ? /* @__PURE__ */ g("span", { role: "status", "aria-live": "polite", className: "ds:sr-only", children: et }) : null,
+          b ? /* @__PURE__ */ R(
             "aside",
             {
-              ref: Ue,
+              ref: Ze,
               tabIndex: -1,
               "aria-label": y("toolRail.panelLabel", {
                 tool: b.label,
                 defaultValue: "{{tool}} panel"
               }),
-              "aria-hidden": R || void 0,
-              "data-tool-rail-state": R ? "collapsing" : "expanded",
-              "data-presence": te.phase,
+              "aria-hidden": T || void 0,
+              "data-tool-rail-state": T ? "collapsing" : "expanded",
+              "data-presence": ae.phase,
               "data-active-tool": b.id,
-              "data-resizing": we ? "" : void 0,
+              "data-resizing": Te ? "" : void 0,
               className: [
-                kt({ side: d }),
+                Lt({ side: d }),
                 // Subtle shadow — not a line — separating the panel from the
                 // icon strip (the tab row). The panel casts a soft chrome
                 // shadow toward the strip on its strip-facing edge. `z-[1]`
@@ -569,31 +575,31 @@ const Mt = rt(
                 "ds:focus-visible:outline-none"
               ].join(" "),
               children: [
-                ie ? ie(b, { isActive: !R }) : null,
-                /* @__PURE__ */ S("div", { ref: pe, className: _t, children: [
-                  Ze.map((e) => /* @__PURE__ */ g(
+                oe ? oe(b, { isActive: !T }) : null,
+                /* @__PURE__ */ R("div", { ref: ve, className: zt, children: [
+                  Ye.map((e) => /* @__PURE__ */ g(
                     "div",
                     {
-                      ref: Ye,
+                      ref: Je,
                       "aria-hidden": "true",
                       "data-exit-id": e.exitId,
                       "data-tool-rail-body": e.toolId,
                       "data-tool-rail-layer": "leaving",
-                      "data-presence": $ && e.exitId === Ge ? "present" : "leaving",
-                      className: De({ layer: "leaving" }),
+                      "data-presence": H && e.exitId === Xe ? "present" : "leaving",
+                      className: Ce({ layer: "leaving" }),
                       onTransitionEnd: (t) => {
-                        t.target === t.currentTarget && B(e.exitId);
+                        t.target === t.currentTarget && V(e.exitId);
                       }
                     },
                     e.exitId
                   )),
-                  /* @__PURE__ */ S(
+                  /* @__PURE__ */ R(
                     "div",
                     {
                       "data-tool-rail-body": b.id,
                       "data-tool-rail-layer": "live",
-                      "data-presence": $ ? "entering" : "present",
-                      className: De({ layer: "live" }),
+                      "data-presence": H ? "entering" : "present",
+                      className: Ce({ layer: "live" }),
                       children: [
                         b.header ? /* @__PURE__ */ g("div", { className: "ds:shrink-0", children: b.header }) : null,
                         b.fill ? (
@@ -602,7 +608,7 @@ const Mt = rt(
                           // 8px overlay. See tokens/index.css.
                           /* @__PURE__ */ g("div", { "data-tool-fill": "", className: "ds:flex-1 ds:min-h-0", children: b.panel })
                         ) : /* @__PURE__ */ g(
-                          ct,
+                          ft,
                           {
                             orientation: "vertical",
                             className: "ds:flex-1 ds:min-h-0",
@@ -617,35 +623,35 @@ const Mt = rt(
                 f ? /* @__PURE__ */ g(
                   "div",
                   {
-                    ...xe,
+                    ...we,
                     "aria-label": y("toolRail.resizePanel", {
                       defaultValue: "Resize tool panel"
                     }),
-                    "data-resizing": we ? "" : void 0,
-                    className: Ct({ edge: Ie })
+                    "data-resizing": Te ? "" : void 0,
+                    className: Bt({ edge: xe })
                   }
                 ) : null
               ]
             }
           ) : null,
-          /* @__PURE__ */ g(ut, { children: /* @__PURE__ */ S(
+          /* @__PURE__ */ g(pt, { children: /* @__PURE__ */ R(
             "div",
             {
-              ref: He,
+              ref: We,
               role: "toolbar",
               "aria-orientation": "vertical",
-              "aria-label": D ?? y("toolRail.railLabel", { defaultValue: "Tools" }),
-              className: Et(),
-              onKeyDown: tt,
+              "aria-label": N ?? y("toolRail.railLabel", { defaultValue: "Tools" }),
+              className: _t(),
+              onKeyDown: st,
               children: [
-                n.map((e, t) => {
-                  const a = e.id === w, s = typeof e.badgeCount == "number" && e.badgeCount > 0, i = s ? y("toolRail.toolWithCount", {
+                s.map((e, t) => {
+                  const a = e.id === x, n = typeof e.badgeCount == "number" && e.badgeCount > 0, i = n ? y("toolRail.toolWithCount", {
                     tool: e.label,
                     count: e.badgeCount,
                     defaultValue: "{{tool}}, {{count}} updates"
-                  }) : e.label, o = le && !!e.reorderable && !e.disabled, z = o ? `${Oe}-${e.id}` : void 0;
-                  return /* @__PURE__ */ S(lt, { children: [
-                    Ke && t === oe ? /* @__PURE__ */ g(
+                  }) : e.label, o = de && !!e.reorderable && !e.disabled, L = o ? `${He}-${e.id}` : void 0;
+                  return /* @__PURE__ */ R(ct, { children: [
+                    $e && t === le ? /* @__PURE__ */ g(
                       "div",
                       {
                         role: "separator",
@@ -653,45 +659,45 @@ const Mt = rt(
                         className: "ds:my-[var(--spacing-2xs)] ds:h-px ds:w-[var(--spacing-lg)] ds:shrink-0 ds:bg-[var(--border)] ds:forced-colors:bg-[CanvasText]"
                       }
                     ) : null,
-                    /* @__PURE__ */ S(
+                    /* @__PURE__ */ R(
                       "div",
                       {
                         className: [
-                          Ce({
-                            dragging: V === t,
-                            dropTarget: de === t && V !== t,
+                          Ve({
+                            dragging: C === t,
+                            dropTarget: ce === t && C !== t,
                             reorderable: o
                           }),
-                          Ve,
-                          mt
+                          Be,
+                          bt
                         ].filter(Boolean).join(" "),
                         "data-reflow-id": e.id,
-                        "data-dragging": V === t ? "" : void 0,
+                        "data-dragging": C === t ? "" : void 0,
                         draggable: o || void 0,
                         onDragStart: o ? (r) => {
-                          Q(t), r.dataTransfer.effectAllowed = "move", r.dataTransfer.setData(
+                          ee(t), r.dataTransfer.effectAllowed = "move", r.dataTransfer.setData(
                             "text/plain",
                             String(t)
                           );
                         } : void 0,
                         onDragOver: o ? (r) => {
-                          V !== null && (r.preventDefault(), r.dataTransfer.dropEffect = "move", de !== t && K(t));
+                          C !== null && (r.preventDefault(), r.dataTransfer.dropEffect = "move", ce !== t && O(t));
                         } : void 0,
-                        onDragLeave: o ? () => K((r) => r === t ? null : r) : void 0,
+                        onDragLeave: o ? () => O((r) => r === t ? null : r) : void 0,
                         onDrop: o ? (r) => {
                           r.preventDefault();
-                          const m = V;
-                          K(null), Q(null), !(m === null || m === t) && ye(m, t);
+                          const m = C;
+                          O(null), ee(null), !(m === null || m === t) && Ie(m, t);
                         } : void 0,
                         onDragEnd: o ? () => {
-                          Q(null), K(null);
+                          ee(null), O(null);
                         } : void 0,
                         children: [
                           /* @__PURE__ */ g(
-                            Le,
+                            ze,
                             {
                               ref: (r) => {
-                                Z.current[t] = r;
+                                G.current[t] = r;
                               },
                               icon: e.icon,
                               tooltip: e.label,
@@ -703,50 +709,50 @@ const Mt = rt(
                               "aria-expanded": a,
                               "data-active": a ? e.id : void 0,
                               "data-tool-id": e.id,
-                              "aria-describedby": z,
+                              "aria-describedby": L,
                               "aria-keyshortcuts": o ? "Alt+ArrowUp Alt+ArrowDown" : void 0,
-                              tabIndex: t === j ? 0 : -1,
+                              tabIndex: t === B ? 0 : -1,
                               onFocus: () => {
-                                e.disabled || Y(t);
+                                e.disabled || X(t);
                               },
-                              onClick: () => et(e.id, X.current),
+                              onClick: () => at(e.id, J.current),
                               onKeyDown: (r) => {
                                 if (r.key === "Enter" || r.key === " ") {
-                                  X.current = !0;
+                                  J.current = !0;
                                   return;
                                 }
                                 if (o && r.altKey && p) {
                                   let m = null;
                                   if (r.key === "ArrowUp" ? m = t - 1 : r.key === "ArrowDown" ? m = t + 1 : r.key === "Home" ? m = p.first : r.key === "End" && (m = p.last), m !== null) {
                                     r.preventDefault();
-                                    const nt = Math.max(
+                                    const rt = Math.max(
                                       p.first,
                                       Math.min(p.last, m)
-                                    ), st = e.id;
-                                    ye(t, nt), requestAnimationFrame(() => {
-                                      var ke, _e;
-                                      (_e = (ke = L.current) == null ? void 0 : ke.querySelector(
-                                        `[data-tool-id="${CSS.escape(st)}"]`
-                                      )) == null || _e.focus();
+                                    ), it = e.id;
+                                    Ie(t, rt), requestAnimationFrame(() => {
+                                      var _e, Le;
+                                      (Le = (_e = _.current) == null ? void 0 : _e.querySelector(
+                                        `[data-tool-id="${CSS.escape(it)}"]`
+                                      )) == null || Le.focus();
                                     });
                                   }
                                 }
                               },
                               onKeyUp: (r) => {
-                                (r.key === "Enter" || r.key === " ") && (X.current = !1);
+                                (r.key === "Enter" || r.key === " ") && (J.current = !1);
                               }
                             }
                           ),
-                          s ? /* @__PURE__ */ g("span", { "aria-hidden": "true", className: Vt(), children: jt(
+                          n ? /* @__PURE__ */ g("span", { "aria-hidden": "true", className: jt(), children: Pt(
                             e.badgeCount,
-                            at
+                            nt
                           ) }) : null,
-                          W == null ? void 0 : W(e, {
+                          Z == null ? void 0 : Z(e, {
                             index: t,
                             isActive: a,
-                            isRovingTarget: t === j
+                            isRovingTarget: t === B
                           }),
-                          z ? /* @__PURE__ */ g("span", { id: z, className: "ds:sr-only", children: y("toolRail.reorderInstructions", {
+                          L ? /* @__PURE__ */ g("span", { id: L, className: "ds:sr-only", children: y("toolRail.reorderInstructions", {
                             tool: e.label,
                             defaultValue: "Reorder {{tool}}. Press Alt + Up or Alt + Down to move."
                           }) }) : null
@@ -755,22 +761,22 @@ const Mt = rt(
                     )
                   ] }, e.id);
                 }),
-                Xe.map(
-                  (e) => ee.isLeaving(e.id) ? /* @__PURE__ */ g(
+                Qe.map(
+                  (e) => te.isLeaving(e.id) ? /* @__PURE__ */ g(
                     "div",
                     {
                       className: [
-                        Ce({
+                        Ve({
                           dragging: !1,
                           dropTarget: !1,
                           reorderable: !1
                         }),
-                        Ve,
-                        Bt
+                        Be,
+                        Mt
                       ].filter(Boolean).join(" "),
                       "aria-hidden": "true",
                       children: /* @__PURE__ */ g(
-                        Le,
+                        ze,
                         {
                           icon: e.icon,
                           intent: "ghost",
@@ -791,9 +797,9 @@ const Mt = rt(
     );
   }
 );
-Mt.displayName = "ToolRail";
+qt.displayName = "ToolRail";
 export {
-  Mt as T,
-  It as t
+  qt as T,
+  wt as t
 };
-//# sourceMappingURL=tool-rail-D89USYE6.js.map
+//# sourceMappingURL=tool-rail-CCFqDfAn.js.map