@alfadocs/ui-kit 1.60.0 → 1.62.0

package/dist/_chunks/tool-rail-Blgibz0a.js

@@ -1,816 +0,0 @@
-import { jsxs as R, jsx as m } from "react/jsx-runtime";
-import { forwardRef as lt, useRef as h, useState as S, useMemo as j, useId as dt, useCallback as N, useEffect as re, useImperativeHandle as ct, Fragment as ut } from "react";
-import { c as A } from "./index-D2ZczOXr.js";
-import { useTranslation as ft } from "react-i18next";
-import { I as De } from "./icon-button-dNE6ENLn.js";
-import { S as pt } from "./scroll-area-CY5SLYNw.js";
-import { a as vt } from "./tooltip-Cp-PLePW.js";
-import { u as gt } from "./use-controllable-state-BiY4xTzM.js";
-import { u as mt } from "./use-edge-resize-DHbyQwu8.js";
-import { u as M } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
-import { a as bt, u as Ce, R as ht } from "./use-list-reflow-C7O4Uqnl.js";
-import { u as yt } from "./use-prefers-reduced-motion-BMwIQRjB.js";
-import { u as xt } from "./use-presence-transition-cDwWUXV-.js";
-import { u as It } from "./use-theme-CAuo6EYT.js";
-import { u as wt } from "./registry-DvAUVLHh.js";
-const Tt = {
-  id: "tool-rail",
-  capabilities: ["open", "close", "select_single"],
-  state: {
-    activeToolId: {
-      type: "string | null",
-      descriptionKey: "ui.toolRail.agent.state.activeToolId",
-      description: "Id of the tool whose panel is currently open, or null when the rail is collapsed to its strip. No panel content is ever exposed.",
-      read: (l) => l.getActiveToolId()
-    }
-  },
-  actions: {
-    open: {
-      // Pure ephemeral panel state (open) — no data loss, no external effect.
-      safety: "read",
-      argsType: "{ id: string }",
-      argsSchema: {
-        type: "object",
-        properties: { id: { type: "string" } },
-        required: ["id"]
-      },
-      idempotent: !0,
-      // descriptionKey shape is intentionally pre-existing — already resolves to
-      // real multi-locale translations; do not canonicalise.
-      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);
-      }
-    },
-    close: {
-      safety: "read",
-      idempotent: !0,
-      descriptionKey: "ui.toolRail.agent.actions.close",
-      description: "Collapse the rail to its strip (no active tool).",
-      invoke: (l) => {
-        l.close();
-      }
-    },
-    select_tool: {
-      safety: "read",
-      argsType: "{ id: string | null }",
-      argsSchema: {
-        type: "object",
-        properties: { id: { type: ["string", "null"] } },
-        required: ["id"]
-      },
-      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);
-      }
-    }
-  },
-  domHooks: {
-    root: {
-      attr: "data-component",
-      value: "tool-rail",
-      description: "Marks the ToolRail wrapper."
-    },
-    instanceId: {
-      attr: "data-component-id",
-      sourceProp: "id",
-      description: "Sourced from the id prop. Required to address a specific rail from the agent."
-    },
-    item: {
-      attr: "data-tool-id",
-      description: "Stable tool id emitted on each strip IconButton. The active icon also carries data-active set to its id."
-    }
-  }
-}, Rt = "ds:[inline-size:3rem]", St = "ds:[inline-size:var(--tool-rail-panel-inline-size,var(--ai-tools-rail-panel-inline-size,22rem))]", _e = "--tool-rail-panel-inline-size", At = 288, Et = 880, kt = 352, Lt = A(
-  ["ds:flex ds:shrink-0 ds:h-full", "ds:bg-[var(--background)]"].join(" "),
-  {
-    variants: {
-      side: {
-        // Strip docks inline-end; the panel mounts inline-start of it
-        // (flex-row, panel rendered first). Shadow faces the main area —
-        // no border against main (the rail stays line-free; the only seam
-        // is the strip↔panel divider on the open panel, see render).
-        // Accessible (AAA) theme swaps the soft chrome shadow for a solid 1px
-        // border on the content-facing edge (border-s for end-docked):
-        // the shadow is `--accessible-off` there and the edge is
-        // `--accessible-edge-width`, 0 in the other themes. Both sit in
-        // `[:where(&)]`, so a class passed in className wins.
-        end: "ds:flex-row ds:[:where(&)]:[box-shadow:var(--accessible-off,var(--shadow-chrome-start))] ds:[:where(&)]:border-s-[length:var(--accessible-edge-width,0px)] ds:border-s-[color:var(--border)]",
-        // Strip docks inline-start; the panel mounts inline-end of it.
-        start: "ds:flex-row-reverse ds:[:where(&)]:[box-shadow:var(--accessible-off,var(--shadow-chrome-end))] ds:[:where(&)]:border-e-[length:var(--accessible-edge-width,0px)] ds:border-e-[color:var(--border)]"
-      }
-    },
-    defaultVariants: { side: "end" }
-  }
-), zt = 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)]",
-    Rt
-  ].join(" ")
-), Nt = A(
-  [
-    "ds:relative ds:flex ds:min-h-0 ds:flex-col ds:h-full",
-    "ds:bg-[var(--background)]",
-    St,
-    // 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
-    // have a value to move from.
-    "ds:transition-[opacity,translate] ds:duration-[var(--animation-duration)]",
-    "ds:ease-[var(--ease-out)] ds:motion-reduce:transition-none",
-    "ds:data-[presence=entering]:opacity-0 ds:data-[presence=leaving]:opacity-0",
-    "ds:data-[presence=leaving]:pointer-events-none",
-    "ds:data-[resizing]:transition-none"
-  ].join(" "),
-  {
-    variants: {
-      // Slide toward the strip the panel belongs to, mirrored in RTL.
-      side: {
-        end: "ds:data-[presence=entering]:translate-x-[var(--spacing-md)] ds:data-[presence=leaving]:translate-x-[var(--spacing-md)] ds:rtl:data-[presence=entering]:-translate-x-[var(--spacing-md)] ds:rtl:data-[presence=leaving]:-translate-x-[var(--spacing-md)]",
-        start: "ds:data-[presence=entering]:-translate-x-[var(--spacing-md)] ds:data-[presence=leaving]:-translate-x-[var(--spacing-md)] ds:rtl:data-[presence=entering]:translate-x-[var(--spacing-md)] ds:rtl:data-[presence=leaving]:translate-x-[var(--spacing-md)]"
-      }
-    },
-    defaultVariants: { side: "end" }
-  }
-), Dt = "ds:relative ds:flex ds:min-h-0 ds:flex-1 ds:flex-col ds:overflow-clip", Ve = A(
-  [
-    "ds:flex ds:min-h-0 ds:flex-col",
-    "ds:transition-[opacity,translate] ds:duration-[var(--animation-duration)]",
-    "ds:ease-[var(--ease-out)] ds:motion-reduce:transition-none",
-    "ds:data-[presence=entering]:opacity-0 ds:data-[presence=leaving]:opacity-0"
-  ].join(" "),
-  {
-    variants: {
-      // Same small distance as the panel's own entrance, mirrored in RTL.
-      layer: {
-        live: [
-          "ds:relative ds:z-[1] ds:flex-1",
-          "ds:data-[presence=entering]:translate-x-[var(--spacing-md)]",
-          "ds:rtl:data-[presence=entering]:-translate-x-[var(--spacing-md)]"
-        ].join(" "),
-        leaving: [
-          "ds:pointer-events-none ds:absolute ds:inset-0 ds:z-0 ds:[&_*]:!animate-none",
-          "ds:data-[presence=leaving]:-translate-x-[var(--spacing-md)]",
-          "ds:rtl:data-[presence=leaving]:translate-x-[var(--spacing-md)]"
-        ].join(" ")
-      }
-    },
-    defaultVariants: { layer: "live" }
-  }
-), Ct = 500, _t = [
-  "id",
-  "name",
-  "for",
-  "data-component",
-  "data-component-id",
-  "data-testid"
-];
-function Vt(l) {
-  return window.getComputedStyle(l).transitionDuration.split(",").some((n) => Number.parseFloat(n) > 0);
-}
-function Bt(l) {
-  const n = l.cloneNode(!0), U = l.querySelectorAll("*"), q = n.querySelectorAll("*"), P = [];
-  return U.forEach((d, D) => {
-    var F;
-    const f = q[D];
-    if (f && ((d.scrollTop !== 0 || d.scrollLeft !== 0) && P.push([f, d.scrollTop, d.scrollLeft]), d instanceof HTMLCanvasElement && f instanceof HTMLCanvasElement))
-      try {
-        (F = f.getContext("2d")) == null || F.drawImage(d, 0, 0);
-      } catch {
-      }
-  }), q.forEach((d) => {
-    const D = d instanceof SVGElement;
-    for (const f of _t)
-      D && 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: P };
-}
-const jt = 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",
-    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
-    "ds:hover:bg-[var(--accent)] ds:focus-visible:bg-[var(--accent)] ds:data-[resizing]:bg-[var(--accent)]",
-    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
-    "ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
-    "ds:forced-colors:focus-visible:outline-[CanvasText]",
-    "ds:before:absolute ds:before:content-['']",
-    "ds:before:[block-size:100%]",
-    "ds:before:[inline-size:var(--min-target-size)]",
-    "ds:before:[inset-block:0]",
-    "ds:before:[inset-inline:calc(0px_-_(var(--min-target-size)_-_var(--resizable-handle-size))_/_2)]"
-  ],
-  {
-    variants: {
-      edge: {
-        "inline-start": "ds:start-0",
-        "inline-end": "ds:end-0"
-      }
-    },
-    defaultVariants: { edge: "inline-start" }
-  }
-), Mt = A(
-  [
-    "ds:absolute ds:-top-[var(--spacing-xs)] ds:-end-[var(--spacing-xs)]",
-    "ds:inline-flex ds:items-center ds:justify-center",
-    "ds:min-w-[calc(var(--spacing-md)+var(--spacing-xs))]",
-    "ds:h-[calc(var(--spacing-md)+var(--spacing-xs))]",
-    "ds:ps-[calc(var(--spacing-xs)/1.5)] ds:pe-[calc(var(--spacing-xs)/1.5)]",
-    "ds:rounded-[var(--radius-full)]",
-    "ds:bg-[color:var(--destructive)] ds:text-[color:var(--destructive-foreground)]",
-    "ds:text-[length:var(--font-size-xs)] ds:font-semibold ds:leading-none",
-    "ds:pointer-events-none ds:select-none",
-    "ds:forced-colors:outline ds:forced-colors:outline-1 ds:forced-colors:outline-[CanvasText]"
-  ].join(" ")
-), Be = 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)]"],
-  {
-    variants: {
-      dragging: { true: "ds:opacity-60", false: "" },
-      dropTarget: {
-        true: "ds:outline-[length:var(--focus-ring-width)] ds:outline-dashed ds:outline-[var(--accent)] ds:outline-offset-[length:var(--focus-ring-offset)]",
-        false: ""
-      },
-      reorderable: {
-        true: "ds:cursor-grab ds:active:cursor-grabbing",
-        false: ""
-      }
-    },
-    defaultVariants: {
-      dragging: !1,
-      dropTarget: !1,
-      reorderable: !1
-    }
-  }
-), qt = "ds:opacity-0", je = [
-  "ds:transition-opacity ds:duration-[var(--animation-duration)]",
-  "ds:ease-[var(--ease-out)] ds:motion-reduce:transition-none"
-].join(" ");
-function Pt(l, n) {
-  return l > 99 ? n : String(l);
-}
-const Ft = lt(
-  ({
-    id: l,
-    tools: n,
-    activeToolId: U,
-    defaultActiveToolId: q = null,
-    onActiveToolChange: P,
-    side: d = "end",
-    railLabel: D,
-    resizablePanel: f = !1,
-    panelWidth: F,
-    onPanelWidthChange: Me,
-    onReorder: K,
-    formatReorderAnnouncement: W,
-    renderToolAffordance: Z,
-    renderPanelHeader: ie,
-    dataComponent: qe = "tool-rail",
-    agentAdapter: Pe = Tt,
-    className: Fe
-  }, Ke) => {
-    var ke, Le;
-    const { t: y } = ft("ui"), [Oe, x] = gt({
-      value: U,
-      defaultValue: q,
-      onChange: P
-    }), I = Oe ?? null, G = h([]), C = h(null), [oe, Y] = S(0), E = h(!1), X = h(!1), w = j(
-      () => n.findIndex((e) => e.id === I),
-      [n, I]
-    ), u = w >= 0 ? n[w] : null, J = h(u);
-    u && (J.current = u);
-    const $e = j(
-      () => n.findIndex((e) => !e.disabled),
-      [n]
-    ), 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]), He = le > 0, p = j(() => {
-      var a;
-      const e = n.findIndex((s) => s.reorderable);
-      if (e < 0) return null;
-      let t = e;
-      for (; t + 1 < n.length && ((a = n[t + 1]) != null && a.reorderable); ) t += 1;
-      return { first: e, last: t };
-    }, [n]), de = !!K && p !== null, Ue = dt(), [_, Q] = S(null), [ce, O] = S(null), { resolvedTheme: We } = It(), k = We.endsWith("-accessible") || void 0, { containerRef: Ze } = bt({
-      key: n.map((e) => e.id).join(),
-      reduceMotion: k
-    }), ee = Ce({ reduceMotion: k }), te = xt(
-      u !== null,
-      { reduceMotion: k }
-    ), T = u === null && te.mounted, b = u ?? (T ? J.current : null), { ref: ue } = te, Ge = N(
-      (e) => {
-        C.current = e, ue(e);
-      },
-      [ue]
-    );
-    M(() => {
-      var a;
-      const e = C.current;
-      if (!e) return;
-      const t = document.activeElement;
-      if (T && t instanceof HTMLElement && e.contains(t)) {
-        const s = (a = J.current) == null ? void 0 : a.id, r = L.current, o = (s ? r == null ? void 0 : r.querySelector(
-          `[data-tool-id="${CSS.escape(s)}"]`
-        ) : null) ?? /* The tool left the strip with its panel (a host removed it as it
-        closed): the strip's tab stop, else its first enabled icon, so
-        focus never drops to <body>. */
-        (r == null ? void 0 : r.querySelector(
-          '[data-tool-id][tabindex="0"]'
-        )) ?? (r == null ? void 0 : r.querySelector(
-          "[data-tool-id]:not(:disabled)"
-        ));
-        t.blur(), e.setAttribute("inert", ""), o == null || o.focus();
-        return;
-      }
-      e.toggleAttribute("inert", T);
-    }, [T]);
-    const fe = yt(), [$, pe] = S(
-      (u == null ? void 0 : u.id) ?? null
-    ), 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 = () => pe(v), a = requestAnimationFrame(() => {
-        e = requestAnimationFrame(t);
-      }), s = window.setTimeout(t, 64);
-      return () => {
-        cancelAnimationFrame(a), cancelAnimationFrame(e), window.clearTimeout(s);
-      };
-    }, [v, $, H]);
-    const Ye = !!k || fe, ve = h(null), [c, ge] = S({ liveId: v, serial: 0, focusLost: !1, leaving: [] });
-    if (c.liveId !== v) {
-      const e = c.liveId !== null && v !== null ? ((ke = ve.current) == null ? void 0 : ke.querySelector(
-        ':scope > [data-tool-rail-layer="live"]'
-      )) ?? null : null, t = c.leaving.filter(
-        (a) => a.toolId !== v
-      );
-      ge({
-        liveId: v,
-        serial: c.serial + 1,
-        focusLost: (e == null ? void 0 : e.contains(document.activeElement)) ?? !1,
-        leaving: e && !Ye ? [
-          ...t.filter((a) => a.toolId !== c.liveId),
-          {
-            exitId: `${c.liveId}:${c.serial}`,
-            toolId: c.liveId,
-            ...Bt(e)
-          }
-        ] : t
-      });
-    }
-    const V = N((e) => {
-      ge(
-        (t) => t.leaving.some((a) => a.exitId === e) ? {
-          ...t,
-          leaving: t.leaving.filter((a) => a.exitId !== e)
-        } : t
-      );
-    }, []), { leave: me } = Ce({
-      reduceMotion: k,
-      durationMs: Ct
-    });
-    re(() => {
-      for (const { exitId: e } of c.leaving)
-        me(e, () => V(e));
-    }, [c.leaving, me, V]);
-    const Xe = b ? c.leaving : [], Je = ((Le = c.leaving[c.leaving.length - 1]) == null ? void 0 : Le.exitId) ?? null, be = h(c.leaving);
-    be.current = c.leaving;
-    const Qe = N(
-      (e) => {
-        if (!e || e.childNodes.length > 0) return;
-        const t = be.current.find(
-          (a) => a.exitId === e.dataset.exitId
-        );
-        if (t) {
-          if (!Vt(e)) {
-            V(t.exitId);
-            return;
-          }
-          e.setAttribute("inert", ""), e.append(...t.nodes);
-          for (const [a, s, r] of t.scrolls)
-            a.scrollTop = s, a.scrollLeft = r;
-        }
-      },
-      [V]
-    );
-    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(
-        `[data-tool-id="${CSS.escape(v)}"]`
-      )) == null || a.focus();
-    }, [c.serial]);
-    const [et, he] = S([]), ye = h(n);
-    re(() => {
-      const e = ye.current, t = new Set(n.map((s) => s.id)), a = e.filter((s) => !t.has(s.id));
-      if (a.length > 0) {
-        he((s) => {
-          const r = new Set(s.map((o) => o.id));
-          return [
-            ...s,
-            ...a.filter((o) => !r.has(o.id))
-          ];
-        });
-        for (const s of a)
-          ee.leave(s.id, () => {
-            he(
-              (r) => r.filter((o) => o.id !== s.id)
-            );
-          });
-      }
-      ye.current = n;
-    }, [n, ee]);
-    const [tt, at] = S(""), ae = h(!1), xe = N(
-      (e, t) => {
-        if (!K || !p) return;
-        const a = Math.max(
-          p.first,
-          Math.min(p.last, t)
-        );
-        if (a === e) return;
-        K(e, a);
-        const s = n[e];
-        if (s) {
-          const r = W ? W({ tool: s, from: e, to: a }) : y("toolRail.reorderAnnounce", {
-            tool: s.label,
-            to: a - p.first + 1,
-            total: p.last - p.first + 1,
-            defaultValue: "{{tool}} moved to position {{to}} of {{total}}"
-          });
-          r && (ae.current = !ae.current, at(ae.current ? r : `${r}​`));
-        }
-      },
-      [K, p, n, y, W]
-    ), Ie = n[oe], B = w >= 0 ? w : Ie && !Ie.disabled ? oe : $e, nt = N(
-      (e, t) => {
-        const a = n.find((s) => s.id === e);
-        !a || a.disabled || (E.current = t, x(I === e ? null : e));
-      },
-      [n, I, x]
-    ), st = N(
-      (e) => {
-        var z, i, g;
-        const t = n.length;
-        if (t === 0 || e.altKey) return;
-        let a = null;
-        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 s = e.key === "ArrowUp" || e.key === "End";
-        let r = a, o = 0;
-        for (; o < t && ((z = n[r]) != null && z.disabled); )
-          r = s ? (r - 1 + t) % t : (r + 1) % t, o += 1;
-        (i = n[r]) != null && i.disabled || (e.preventDefault(), Y(r), (g = G.current[r]) == null || g.focus());
-      },
-      [n, B]
-    ), L = h(null);
-    re(() => {
-      const e = L.current;
-      if (!e) return;
-      const t = (a) => {
-        if (a.key !== "Escape" || w < 0) return;
-        a.preventDefault();
-        const s = w;
-        x(null), Y(s), requestAnimationFrame(() => {
-          var r;
-          (r = G.current[s]) == null || r.focus();
-        });
-      };
-      return e.addEventListener("keydown", t), () => e.removeEventListener("keydown", t);
-    }, [w, x]), M(() => {
-      var e;
-      u && E.current && ((e = C.current) == null || e.focus()), E.current = !1;
-    }, [u]);
-    const we = d === "end" ? "inline-start" : "inline-end", { separatorProps: Te, isResizing: Re, isResized: Se } = mt({
-      edge: we,
-      targetRef: C,
-      cssProperty: _e,
-      minSize: At,
-      maxSize: Et,
-      defaultSize: kt,
-      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: Me
-    }), Ae = Te["aria-valuenow"];
-    M(() => {
-      var e;
-      !f || !Se || !u || (e = C.current) == null || e.style.setProperty(
-        _e,
-        `${Ae}px`
-      );
-    }, [u, f, Se, Ae]);
-    const ne = h(I);
-    ne.current = I;
-    const se = j(
-      () => ({
-        getActiveToolId: () => ne.current,
-        setActiveTool: (e) => {
-          E.current = !1, x(e);
-        },
-        open: (e) => {
-          const t = n.find((a) => a.id === e);
-          !t || t.disabled || (E.current = !1, x(e));
-        },
-        close: () => {
-          const e = ne.current;
-          E.current = !1, x(null), e != null && requestAnimationFrame(() => {
-            var t, a;
-            (a = (t = L.current) == null ? void 0 : t.querySelector(
-              `[data-tool-id="${CSS.escape(e)}"]`
-            )) == null || a.focus();
-          });
-        }
-      }),
-      [n, x]
-    );
-    ct(Ke, () => se, [se]), wt(Pe, se, l);
-    const rt = y("toolRail.badgeCountOverflow", {
-      defaultValue: "99+"
-    }), Ee = D ?? y("toolRail.railLabel", { defaultValue: "Tools" });
-    return /* @__PURE__ */ R(
-      "aside",
-      {
-        ref: L,
-        "aria-label": Ee,
-        "data-component": qe,
-        "data-component-id": l,
-        "data-side": d,
-        className: [Lt({ side: d }), Fe].filter(Boolean).join(" "),
-        children: [
-          de ? /* @__PURE__ */ m("span", { role: "status", "aria-live": "polite", className: "ds:sr-only", children: tt }) : null,
-          b ? /* @__PURE__ */ R(
-            "section",
-            {
-              ref: Ge,
-              tabIndex: -1,
-              "aria-label": y("toolRail.panelLabel", {
-                tool: b.label,
-                defaultValue: "{{tool}} panel"
-              }),
-              "aria-hidden": T || void 0,
-              "data-tool-rail-state": T ? "collapsing" : "expanded",
-              "data-presence": te.phase,
-              "data-active-tool": b.id,
-              "data-resizing": Re ? "" : void 0,
-              className: [
-                Nt({ 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]`
-                // lifts it above the adjacent strip (the panel is already
-                // `relative`) so the shadow paints at the seam instead of being
-                // covered by the strip's opaque background. Only renders while
-                // the panel is open (it is unmounted when collapsed), so
-                // it never doubles as a rail↔main seam. In the accessible (AAA)
-                // theme the soft shadow becomes a solid 1px border on that same
-                // strip-facing edge.
-                "ds:z-[1]",
-                d === "end" ? "ds:[:where(&)]:[box-shadow:var(--accessible-off,var(--shadow-chrome-end))] ds:[:where(&)]:border-e-[length:var(--accessible-edge-width,0px)] ds:border-e-[color:var(--border)]" : "ds:[:where(&)]:[box-shadow:var(--accessible-off,var(--shadow-chrome-start))] ds:[:where(&)]:border-s-[length:var(--accessible-edge-width,0px)] ds:border-s-[color:var(--border)]",
-                "ds:focus-visible:outline-none"
-              ].join(" "),
-              children: [
-                ie ? ie(b, { isActive: !T }) : null,
-                /* @__PURE__ */ R("div", { ref: ve, className: Dt, children: [
-                  Xe.map((e) => /* @__PURE__ */ m(
-                    "div",
-                    {
-                      ref: Qe,
-                      "aria-hidden": "true",
-                      "data-exit-id": e.exitId,
-                      "data-tool-rail-body": e.toolId,
-                      "data-tool-rail-layer": "leaving",
-                      "data-presence": H && e.exitId === Je ? "present" : "leaving",
-                      className: Ve({ layer: "leaving" }),
-                      onTransitionEnd: (t) => {
-                        t.target === t.currentTarget && V(e.exitId);
-                      }
-                    },
-                    e.exitId
-                  )),
-                  /* @__PURE__ */ R(
-                    "div",
-                    {
-                      "data-tool-rail-body": b.id,
-                      "data-tool-rail-layer": "live",
-                      "data-presence": H ? "entering" : "present",
-                      className: Ve({ layer: "live" }),
-                      children: [
-                        b.header ? /* @__PURE__ */ m("div", { className: "ds:shrink-0", children: b.header }) : null,
-                        b.fill ? (
-                          // data-tool-fill: a self-scrolling panel owns its own native
-                          // scroll, so a token rule paints its scrollbar to match the
-                          // 8px overlay. See tokens/index.css.
-                          /* @__PURE__ */ m("div", { "data-tool-fill": "", className: "ds:flex-1 ds:min-h-0", children: b.panel })
-                        ) : /* @__PURE__ */ m(
-                          pt,
-                          {
-                            orientation: "vertical",
-                            className: "ds:flex-1 ds:min-h-0",
-                            children: b.panel
-                          }
-                        )
-                      ]
-                    },
-                    b.id
-                  )
-                ] }),
-                f ? /* @__PURE__ */ m(
-                  "div",
-                  {
-                    ...Te,
-                    "aria-label": y("toolRail.resizePanel", {
-                      defaultValue: "Resize tool panel"
-                    }),
-                    "data-resizing": Re ? "" : void 0,
-                    className: jt({ edge: we })
-                  }
-                ) : null
-              ]
-            }
-          ) : null,
-          /* @__PURE__ */ m(vt, { children: /* @__PURE__ */ R(
-            "div",
-            {
-              ref: Ze,
-              role: "toolbar",
-              "aria-orientation": "vertical",
-              "aria-label": Ee,
-              className: zt(),
-              onKeyDown: st,
-              children: [
-                n.map((e, t) => {
-                  const a = e.id === I, s = typeof e.badgeCount == "number" && e.badgeCount > 0, r = s ? y("toolRail.toolWithCount", {
-                    tool: e.label,
-                    count: e.badgeCount,
-                    defaultValue: "{{tool}}, {{count}} updates"
-                  }) : e.label, o = de && !!e.reorderable && !e.disabled, z = o ? `${Ue}-${e.id}` : void 0;
-                  return /* @__PURE__ */ R(ut, { children: [
-                    He && t === le ? /* @__PURE__ */ m(
-                      "div",
-                      {
-                        role: "separator",
-                        "aria-orientation": "horizontal",
-                        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__ */ R(
-                      "div",
-                      {
-                        className: [
-                          Be({
-                            dragging: _ === t,
-                            dropTarget: ce === t && _ !== t,
-                            reorderable: o
-                          }),
-                          je,
-                          ht
-                        ].filter(Boolean).join(" "),
-                        "data-reflow-id": e.id,
-                        "data-dragging": _ === t ? "" : void 0,
-                        draggable: o || void 0,
-                        onDragStart: o ? (i) => {
-                          Q(t), i.dataTransfer.effectAllowed = "move", i.dataTransfer.setData(
-                            "text/plain",
-                            String(t)
-                          );
-                        } : void 0,
-                        onDragOver: o ? (i) => {
-                          _ !== null && (i.preventDefault(), i.dataTransfer.dropEffect = "move", ce !== t && O(t));
-                        } : void 0,
-                        onDragLeave: o ? () => O((i) => i === t ? null : i) : void 0,
-                        onDrop: o ? (i) => {
-                          i.preventDefault();
-                          const g = _;
-                          O(null), Q(null), !(g === null || g === t) && xe(g, t);
-                        } : void 0,
-                        onDragEnd: o ? () => {
-                          Q(null), O(null);
-                        } : void 0,
-                        children: [
-                          /* @__PURE__ */ m(
-                            De,
-                            {
-                              ref: (i) => {
-                                G.current[t] = i;
-                              },
-                              icon: e.icon,
-                              tooltip: e.label,
-                              "aria-label": r,
-                              intent: "ghost",
-                              size: "sm",
-                              disabled: e.disabled,
-                              "aria-pressed": a,
-                              "aria-expanded": a,
-                              "data-active": a ? e.id : void 0,
-                              "data-tool-id": e.id,
-                              "aria-describedby": z,
-                              "aria-keyshortcuts": o ? "Alt+ArrowUp Alt+ArrowDown" : void 0,
-                              tabIndex: t === B ? 0 : -1,
-                              onFocus: () => {
-                                e.disabled || Y(t);
-                              },
-                              onClick: () => nt(e.id, X.current),
-                              onKeyDown: (i) => {
-                                if (i.key === "Enter" || i.key === " ") {
-                                  X.current = !0;
-                                  return;
-                                }
-                                if (o && i.altKey && p) {
-                                  let g = null;
-                                  if (i.key === "ArrowUp" ? g = t - 1 : i.key === "ArrowDown" ? g = t + 1 : i.key === "Home" ? g = p.first : i.key === "End" && (g = p.last), g !== null) {
-                                    i.preventDefault();
-                                    const it = Math.max(
-                                      p.first,
-                                      Math.min(p.last, g)
-                                    ), ot = e.id;
-                                    xe(t, it), requestAnimationFrame(() => {
-                                      var ze, Ne;
-                                      (Ne = (ze = L.current) == null ? void 0 : ze.querySelector(
-                                        `[data-tool-id="${CSS.escape(ot)}"]`
-                                      )) == null || Ne.focus();
-                                    });
-                                  }
-                                }
-                              },
-                              onKeyUp: (i) => {
-                                (i.key === "Enter" || i.key === " ") && (X.current = !1);
-                              }
-                            }
-                          ),
-                          s ? /* @__PURE__ */ m("span", { "aria-hidden": "true", className: Mt(), children: Pt(
-                            e.badgeCount,
-                            rt
-                          ) }) : null,
-                          Z == null ? void 0 : Z(e, {
-                            index: t,
-                            isActive: a,
-                            isRovingTarget: t === B
-                          }),
-                          z ? /* @__PURE__ */ m("span", { id: z, className: "ds:sr-only", children: y("toolRail.reorderInstructions", {
-                            tool: e.label,
-                            defaultValue: "Reorder {{tool}}. Press Alt + Up or Alt + Down to move."
-                          }) }) : null
-                        ]
-                      }
-                    )
-                  ] }, e.id);
-                }),
-                et.map(
-                  (e) => ee.isLeaving(e.id) ? /* @__PURE__ */ m(
-                    "div",
-                    {
-                      className: [
-                        Be({
-                          dragging: !1,
-                          dropTarget: !1,
-                          reorderable: !1
-                        }),
-                        je,
-                        qt
-                      ].filter(Boolean).join(" "),
-                      "aria-hidden": "true",
-                      children: /* @__PURE__ */ m(
-                        De,
-                        {
-                          icon: e.icon,
-                          intent: "ghost",
-                          size: "sm",
-                          disabled: !0,
-                          tabIndex: -1
-                        }
-                      )
-                    },
-                    e.id
-                  ) : null
-                )
-              ]
-            }
-          ) })
-        ]
-      }
-    );
-  }
-);
-Ft.displayName = "ToolRail";
-export {
-  Ft as T,
-  Tt as t
-};
-//# sourceMappingURL=tool-rail-Blgibz0a.js.map