@alfadocs/ui-kit 0.68.0 → 0.70.0

package/dist/_chunks/ai-tools-rail-CInA_1-E.js

@@ -1,356 +0,0 @@
-import { jsxs as I, jsx as p } from "react/jsx-runtime";
-import { forwardRef as Q, useRef as v, useState as ee, useMemo as z, useCallback as B, useEffect as se, useImperativeHandle as ae } from "react";
-import { c as m } from "./index-D2ZczOXr.js";
-import { useTranslation as ie } from "react-i18next";
-import { I as ne } from "./icon-button-LqoiKcUN.js";
-import { S as te } from "./scroll-area-5wNK0Cyz.js";
-import { a as oe } from "./tooltip-DvmfrNvB.js";
-import { u as re } from "./use-controllable-state-BiY4xTzM.js";
-import { u as de } from "./use-edge-resize-ZnGG7gyO.js";
-import { u as H } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
-import { u as le } from "./registry-nPAVE19X.js";
-const ce = {
-  id: "ai-tools-rail",
-  capabilities: ["open", "close", "select_single"],
-  state: {
-    activeToolId: {
-      type: "string | null",
-      descriptionKey: "ui.aiToolsRail.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: (n) => n.getActiveToolId()
-    }
-  },
-  actions: {
-    open: {
-      safety: "read",
-      argsType: "{ id: string }",
-      descriptionKey: "ui.aiToolsRail.agent.actions.open",
-      description: "Open the given tool's panel.",
-      invoke: (n, s) => {
-        n.open(s.id);
-      }
-    },
-    close: {
-      safety: "read",
-      descriptionKey: "ui.aiToolsRail.agent.actions.close",
-      description: "Collapse the rail to its strip (no active tool).",
-      invoke: (n) => {
-        n.close();
-      }
-    },
-    select_tool: {
-      safety: "read",
-      argsType: "{ id: string | null }",
-      descriptionKey: "ui.aiToolsRail.agent.actions.selectTool",
-      description: "Set the active tool by id (opens its panel), or pass null to collapse.",
-      invoke: (n, s) => {
-        n.setActiveTool(s.id);
-      }
-    }
-  },
-  domHooks: {
-    root: {
-      attr: "data-component",
-      value: "ai-tools-rail",
-      description: "Marks the AiToolsRail 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."
-    }
-  }
-}, ue = "ds:[inline-size:3rem]", fe = "ds:[inline-size:var(--ai-tools-rail-panel-inline-size,22rem)]", F = "--ai-tools-rail-panel-inline-size", pe = 288, ve = 640, be = 352, me = m(
-  ["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).
-        end: "ds:flex-row ds:shadow-[var(--shadow-chrome-start)] ds:[.theme-accessible_&]:border-s ds:[.theme-accessible_&]:border-[var(--border)] ds:[.theme-accessible_&]:shadow-none",
-        // Strip docks inline-start; the panel mounts inline-end of it.
-        start: "ds:flex-row-reverse ds:shadow-[var(--shadow-chrome-end)] ds:[.theme-accessible_&]:border-e ds:[.theme-accessible_&]:border-[var(--border)] ds:[.theme-accessible_&]:shadow-none"
-      }
-    },
-    defaultVariants: { side: "end" }
-  }
-), ge = m(
-  [
-    "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)]",
-    ue
-  ].join(" ")
-), he = m(
-  [
-    "ds:relative ds:flex ds:min-h-0 ds:flex-col ds:h-full",
-    "ds:bg-[var(--background)]",
-    fe,
-    // Defensive: the panel doesn't animate its width today, but if a
-    // consumer adds a transition on the var, suppress it mid-drag.
-    "ds:data-[resizing]:transition-none"
-  ].join(" ")
-), ye = m(
-  [
-    "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" }
-  }
-), xe = m(
-  [
-    "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(" ")
-);
-function we(n, s) {
-  return n > 99 ? s : String(n);
-}
-const Re = Q(
-  ({
-    id: n,
-    tools: s,
-    activeToolId: M,
-    defaultActiveToolId: U = null,
-    onActiveToolChange: W,
-    side: g = "end",
-    railLabel: Z,
-    resizablePanel: h = !1,
-    className: O
-  }, q) => {
-    var P;
-    const { t: b } = ie(), [X, d] = re({
-      value: M,
-      defaultValue: U,
-      onChange: W
-    }), c = X ?? null, w = v([]), y = v(null), [R, T] = ee(0), f = v(!1), _ = v(!1), u = z(
-      () => s.findIndex((e) => e.id === c),
-      [s, c]
-    ), l = u >= 0 ? s[u] : null, Y = z(
-      () => s.findIndex((e) => !e.disabled),
-      [s]
-    ), x = u >= 0 ? u : R >= 0 && !((P = s[R]) != null && P.disabled) ? R : Y, $ = B(
-      (e, a) => {
-        const i = s.find((r) => r.id === e);
-        !i || i.disabled || (f.current = a, d(c === e ? null : e));
-      },
-      [s, c, d]
-    ), G = B(
-      (e) => {
-        var D, K, j;
-        const a = s.length;
-        if (a === 0) return;
-        let i = null;
-        if (e.key === "ArrowDown" ? i = (x + 1) % a : e.key === "ArrowUp" ? i = (x - 1 + a) % a : e.key === "Home" ? i = 0 : e.key === "End" && (i = a - 1), i === null) return;
-        const r = e.key === "ArrowUp" || e.key === "End";
-        let t = i, o = 0;
-        for (; o < a && ((D = s[t]) != null && D.disabled); )
-          t = r ? (t - 1 + a) % a : (t + 1) % a, o += 1;
-        (K = s[t]) != null && K.disabled || (e.preventDefault(), T(t), (j = w.current[t]) == null || j.focus());
-      },
-      [s, x]
-    ), A = v(null);
-    se(() => {
-      const e = A.current;
-      if (!e) return;
-      const a = (i) => {
-        if (i.key !== "Escape" || u < 0) return;
-        i.preventDefault();
-        const r = u;
-        d(null), T(r), requestAnimationFrame(() => {
-          var t;
-          (t = w.current[r]) == null || t.focus();
-        });
-      };
-      return e.addEventListener("keydown", a), () => e.removeEventListener("keydown", a);
-    }, [u, d]), H(() => {
-      var e;
-      l && f.current && ((e = y.current) == null || e.focus()), f.current = !1;
-    }, [l]);
-    const E = g === "end" ? "inline-start" : "inline-end", { separatorProps: N, isResizing: S, isResized: C } = de({
-      edge: E,
-      targetRef: y,
-      cssProperty: F,
-      minSize: pe,
-      maxSize: ve,
-      defaultSize: be,
-      disabled: !h
-    }), L = N["aria-valuenow"];
-    H(() => {
-      var e;
-      !h || !C || !l || (e = y.current) == null || e.style.setProperty(
-        F,
-        `${L}px`
-      );
-    }, [l, h, C, L]);
-    const V = v(c);
-    V.current = c;
-    const k = z(
-      () => ({
-        getActiveToolId: () => V.current,
-        setActiveTool: (e) => {
-          f.current = !1, d(e);
-        },
-        open: (e) => {
-          const a = s.find((i) => i.id === e);
-          !a || a.disabled || (f.current = !1, d(e));
-        },
-        close: () => {
-          f.current = !1, d(null);
-        }
-      }),
-      [s, d]
-    );
-    ae(q, () => k, [k]), le(ce, k, n);
-    const J = b("aiToolsRail.badgeCountOverflow", {
-      defaultValue: "99+"
-    });
-    return /* @__PURE__ */ I(
-      "div",
-      {
-        ref: A,
-        "data-component": "ai-tools-rail",
-        "data-component-id": n,
-        "data-side": g,
-        className: [me({ side: g }), O].filter(Boolean).join(" "),
-        children: [
-          l ? /* @__PURE__ */ I(
-            "aside",
-            {
-              ref: y,
-              tabIndex: -1,
-              "aria-label": b("aiToolsRail.panelLabel", {
-                tool: l.label,
-                defaultValue: "{{tool}} panel"
-              }),
-              "data-ai-tools-rail-state": "expanded",
-              "data-active-tool": l.id,
-              "data-resizing": S ? "" : void 0,
-              className: [
-                he(),
-                // 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 (the aside 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]",
-                g === "end" ? "ds:shadow-[var(--shadow-chrome-end)] ds:[.theme-accessible_&]:border-e ds:[.theme-accessible_&]:border-[var(--border)] ds:[.theme-accessible_&]:shadow-none" : "ds:shadow-[var(--shadow-chrome-start)] ds:[.theme-accessible_&]:border-s ds:[.theme-accessible_&]:border-[var(--border)] ds:[.theme-accessible_&]:shadow-none",
-                "ds:focus-visible:outline-none"
-              ].join(" "),
-              children: [
-                /* @__PURE__ */ p(te, { orientation: "vertical", className: "ds:flex-1 ds:min-h-0", children: l.panel }),
-                h ? /* @__PURE__ */ p(
-                  "div",
-                  {
-                    ...N,
-                    "aria-label": b("aiToolsRail.resizePanel", {
-                      defaultValue: "Resize tool panel"
-                    }),
-                    "data-resizing": S ? "" : void 0,
-                    className: ye({ edge: E })
-                  }
-                ) : null
-              ]
-            }
-          ) : null,
-          /* @__PURE__ */ p(oe, { children: /* @__PURE__ */ p(
-            "div",
-            {
-              role: "toolbar",
-              "aria-orientation": "vertical",
-              "aria-label": Z ?? b("aiToolsRail.railLabel", { defaultValue: "AI tools" }),
-              className: ge(),
-              onKeyDown: G,
-              children: s.map((e, a) => {
-                const i = e.id === c, r = typeof e.badgeCount == "number" && e.badgeCount > 0, t = r ? b("aiToolsRail.toolWithCount", {
-                  tool: e.label,
-                  count: e.badgeCount,
-                  defaultValue: "{{tool}}, {{count}} updates"
-                }) : e.label;
-                return /* @__PURE__ */ I("div", { className: "ds:relative", children: [
-                  /* @__PURE__ */ p(
-                    ne,
-                    {
-                      ref: (o) => {
-                        w.current[a] = o;
-                      },
-                      icon: e.icon,
-                      tooltip: e.label,
-                      "aria-label": t,
-                      intent: "ghost",
-                      size: "sm",
-                      disabled: e.disabled,
-                      "aria-pressed": i,
-                      "aria-expanded": i,
-                      "data-active": i ? e.id : void 0,
-                      "data-tool-id": e.id,
-                      tabIndex: a === x ? 0 : -1,
-                      onFocus: () => {
-                        e.disabled || T(a);
-                      },
-                      onClick: () => $(e.id, _.current),
-                      onKeyDown: (o) => {
-                        (o.key === "Enter" || o.key === " ") && (_.current = !0);
-                      },
-                      onKeyUp: (o) => {
-                        (o.key === "Enter" || o.key === " ") && (_.current = !1);
-                      }
-                    }
-                  ),
-                  r ? /* @__PURE__ */ p("span", { "aria-hidden": "true", className: xe(), children: we(
-                    e.badgeCount,
-                    J
-                  ) }) : null
-                ] }, e.id);
-              })
-            }
-          ) })
-        ]
-      }
-    );
-  }
-);
-Re.displayName = "AiToolsRail";
-export {
-  Re as A,
-  ce as a
-};
-//# sourceMappingURL=ai-tools-rail-CInA_1-E.js.map