@alfadocs/ui-kit 0.1.9 → 0.2.0

package/dist/_chunks/{transcript-panel.agent-BXEYP6w-.js → transcript-panel-Bx5ANMsv.js}

@@ -1,10 +1,56 @@
 import { jsxs as f, jsx as o } from "react/jsx-runtime";
-import { forwardRef as $, useState as E, useRef as S, useId as K, useMemo as I, useCallback as C, useLayoutEffect as A, useImperativeHandle as _, Fragment as j } from "react";
-import { c as O } from "./index-D2ZczOXr.js";
-import { useTranslation as V } from "react-i18next";
-import { u as D } from "./index-CJE9uQmb.js";
-import { S as F } from "./search-input-Xw3cdWXW.js";
-const H = O(
+import { forwardRef as K, useState as A, useRef as x, useId as _, useMemo as w, useCallback as R, useLayoutEffect as j, useImperativeHandle as O, Fragment as V } from "react";
+import { c as D } from "./index-D2ZczOXr.js";
+import { useTranslation as F } from "react-i18next";
+import { u as H } from "./registry-C9nwlNyL.js";
+import { u as q } from "./index-CJE9uQmb.js";
+import { S as B } from "./search-input-CdJIEjFo.js";
+const U = {
+  id: "transcript-panel",
+  capabilities: ["select_single"],
+  state: {
+    selectedTurn: {
+      type: "string | null",
+      descriptionKey: "ui.agent.transcriptPanel.state.selectedTurn",
+      description: "Opaque id (line index) of the currently-active turn, or null when none is active.",
+      read: (t) => t.getSelectedTurn()
+    }
+  },
+  actions: {
+    focus_turn: {
+      safety: "read",
+      argsType: "{ id: string }",
+      descriptionKey: "ui.agent.transcriptPanel.actions.focusTurn",
+      description: "Scroll the given turn into view and focus its seek button.",
+      invoke: (t, n) => {
+        t.focusTurn(n.id);
+      }
+    },
+    copy_turn: {
+      safety: "read",
+      argsType: "{ id: string }",
+      descriptionKey: "ui.agent.transcriptPanel.actions.copyTurn",
+      description: "Copy the given turn's text to the clipboard.",
+      invoke: (t, n) => t.copyTurn(n.id)
+    }
+  },
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "transcript-panel",
+      description: "Marks the TranscriptPanel wrapper."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    },
+    item: {
+      attr: "data-turn-id",
+      description: "Stable opaque turn id (line index). Never carries the turn's dictated text."
+    }
+  }
+}, G = D(
   [
     "ds:flex ds:flex-col ds:w-full ds:min-h-0",
     "ds:rounded-[var(--radius-md)] ds:border ds:border-border",
@@ -21,22 +67,22 @@ const H = O(
     },
     defaultVariants: { size: "md" }
   }
-), q = 100, B = 8;
+), Q = 100, Y = 8;
 function z(t, n) {
-  const a = Math.max(0, Math.floor(t)), i = Math.floor(a / 60), u = a % 60, p = (v) => new Intl.NumberFormat(n, { minimumIntegerDigits: 2 }).format(v);
+  const a = Math.max(0, Math.floor(t)), i = Math.floor(a / 60), u = a % 60, p = (g) => new Intl.NumberFormat(n, { minimumIntegerDigits: 2 }).format(g);
   return `${p(i)}:${p(u)}`;
 }
-function U(t) {
+function Z(t) {
   const n = Math.max(0, Math.floor(t)), a = Math.floor(n / 60), i = n % 60;
   return `PT${a}M${i}S`;
 }
-function G(t) {
+function J(t) {
   let n = 0;
   for (let a = 0; a < t.length; a += 1)
     n = n * 31 + t.charCodeAt(a) | 0;
-  return Math.abs(n) % B;
+  return Math.abs(n) % Y;
 }
-const Q = [
+const W = [
   "ds:bg-[color:var(--transcript-speaker-1)]",
   "ds:bg-[color:var(--transcript-speaker-2)]",
   "ds:bg-[color:var(--transcript-speaker-3)]",
@@ -46,12 +92,12 @@ const Q = [
   "ds:bg-[color:var(--transcript-speaker-7)]",
   "ds:bg-[color:var(--transcript-speaker-8)]"
 ];
-function Y(t) {
+function X(t) {
   return t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
 }
-function Z({ text: t, query: n }) {
+function ee({ text: t, query: n }) {
   if (!n) return t;
-  const a = Y(n);
+  const a = X(n);
   return t.split(new RegExp(`(${a})`, "gi")).map(
     (u, p) => u.toLocaleLowerCase() === n.toLocaleLowerCase() ? /* @__PURE__ */ o(
       "mark",
@@ -60,10 +106,10 @@ function Z({ text: t, query: n }) {
         children: u
       },
       p
-    ) : /* @__PURE__ */ o(j, { children: u }, p)
+    ) : /* @__PURE__ */ o(V, { children: u }, p)
   );
 }
-const J = $(
+const te = K(
   ({
     lines: t,
     currentTime: n = 0,
@@ -71,40 +117,40 @@ const J = $(
     searchable: i = !0,
     size: u = "md",
     className: p,
-    ...v
+    ...g
   }, L) => {
-    const { t: d, i18n: b } = V(), [m, M] = E(""), h = S(null), x = S(null), R = K(), c = I(() => {
+    const { t: d, i18n: b } = F(), [m, M] = A(""), h = x(null), T = x(null), P = _(), c = w(() => {
       if (!Number.isFinite(n)) return -1;
       for (let e = 0; e < t.length; e += 1) {
         const r = t[e];
         if (r.start <= n && n < r.end) return e;
       }
       return -1;
-    }, [t, n]), w = I(() => {
+    }, [t, n]), k = w(() => {
       if (!m) return 0;
       let e = 0;
       const r = m.toLocaleLowerCase();
       for (const s of t) {
         const l = s.text.toLocaleLowerCase();
-        let g = l.indexOf(r);
-        for (; g !== -1; )
-          e += 1, g = l.indexOf(r, g + r.length);
+        let v = l.indexOf(r);
+        for (; v !== -1; )
+          e += 1, v = l.indexOf(r, v + r.length);
       }
       return e;
-    }, [t, m]), P = C(
+    }, [t, m]), $ = R(
       (e) => {
         var r;
-        (e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "f" && i && (e.preventDefault(), (r = x.current) == null || r.focus());
+        (e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "f" && i && (e.preventDefault(), (r = T.current) == null || r.focus());
       },
       [i]
-    ), T = t.length > q, y = D({
-      count: T ? t.length : 0,
+    ), N = t.length > Q, y = q({
+      count: N ? t.length : 0,
       getScrollElement: () => h.current,
       estimateSize: () => 48,
       overscan: 8,
       getItemKey: (e) => e
     });
-    A(() => {
+    j(() => {
       if (c < 0) return;
       const e = h.current;
       if (!e) return;
@@ -118,9 +164,9 @@ const J = $(
         behavior: s ? "auto" : "smooth"
       });
     }, [c]);
-    const k = C(
+    const S = R(
       (e, r, s) => {
-        const l = r === c, g = G(e.speaker), N = typeof e.confidence == "number" && e.confidence < 0.6;
+        const l = r === c, v = J(e.speaker), C = typeof e.confidence == "number" && e.confidence < 0.6;
         return /* @__PURE__ */ f(
           "li",
           {
@@ -161,7 +207,7 @@ const J = $(
                     "ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
                     "ds:forced-colors:focus-visible:outline-[CanvasText]"
                   ].join(" "),
-                  children: /* @__PURE__ */ o("time", { dir: "ltr", dateTime: U(e.start), children: z(e.start, b.language) })
+                  children: /* @__PURE__ */ o("time", { dir: "ltr", dateTime: Z(e.start), children: z(e.start, b.language) })
                 }
               ),
               /* @__PURE__ */ f("div", { className: "ds:flex-1 ds:min-w-0", children: [
@@ -170,11 +216,11 @@ const J = $(
                     "span",
                     {
                       "aria-hidden": "true",
-                      className: `ds:inline-block ds:size-2 ds:rounded-[var(--radius-full)] ${Q[g]}`
+                      className: `ds:inline-block ds:size-2 ds:rounded-[var(--radius-full)] ${W[v]}`
                     }
                   ),
                   /* @__PURE__ */ o("strong", { className: "type-title-item", children: d("ui.chat.transcript.speaker", { name: e.speaker }) }),
-                  N ? /* @__PURE__ */ f("span", { className: "type-meta ds:italic ds:text-[color:var(--muted-foreground)]", children: [
+                  C ? /* @__PURE__ */ f("span", { className: "type-meta ds:italic ds:text-[color:var(--muted-foreground)]", children: [
                     "(",
                     d("ui.chat.transcript.lowConfidence"),
                     ")"
@@ -186,9 +232,9 @@ const J = $(
                     dir: "auto",
                     className: [
                       "ds:block",
-                      N ? "ds:underline ds:decoration-dotted ds:decoration-[color:var(--muted-foreground)]" : ""
+                      C ? "ds:underline ds:decoration-dotted ds:decoration-[color:var(--muted-foreground)]" : ""
                     ].join(" "),
-                    children: /* @__PURE__ */ o(Z, { text: e.text, query: m })
+                    children: /* @__PURE__ */ o(ee, { text: e.text, query: m })
                   }
                 )
               ] })
@@ -198,9 +244,9 @@ const J = $(
         );
       },
       [c, b.language, a, m, d]
-    );
-    return _(
-      L,
+    ), I = x(null);
+    O(L, () => I.current, []);
+    const E = w(
       () => ({
         getSelectedTurn: () => c >= 0 ? String(c) : null,
         focusTurn: (e) => {
@@ -210,7 +256,9 @@ const J = $(
           );
           if (!r) return;
           r.scrollIntoView({ block: "center", behavior: "auto" });
-          const s = r.querySelector("button");
+          const s = r.querySelector(
+            "button"
+          );
           s == null || s.focus();
         },
         copyTurn: (e) => {
@@ -222,21 +270,28 @@ const J = $(
         }
       }),
       [c, t]
-    ), /* @__PURE__ */ f(
+    );
+    return H(
+      U,
+      E,
+      g.id
+    ), // eslint-disable-next-line jsx-a11y/no-static-element-interactions -- root keyboard shortcuts (j/k navigation, /) bubble up from focused descendants
+    /* @__PURE__ */ f(
       "div",
       {
-        onKeyDown: P,
+        ref: I,
+        onKeyDown: $,
         "data-component": "transcript-panel",
-        "data-component-id": v.id,
-        className: H({ size: u, className: p }),
-        ...v,
+        "data-component-id": g.id,
+        className: G({ size: u, className: p }),
+        ...g,
         children: [
           i ? /* @__PURE__ */ f("div", { className: "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-xs)] ds:flex ds:items-center ds:gap-[var(--spacing-sm)] ds:border-b ds:border-border", children: [
             /* @__PURE__ */ o(
-              F,
+              B,
               {
-                ref: x,
-                id: R,
+                ref: T,
+                id: P,
                 placeholder: d("ui.chat.transcript.search"),
                 "aria-label": d("ui.chat.transcript.search"),
                 "aria-keyshortcuts": "Meta+F Control+F",
@@ -251,7 +306,7 @@ const J = $(
                 role: "status",
                 "aria-live": "polite",
                 className: "type-meta ds:text-[color:var(--muted-foreground)] ds:tabular-nums",
-                children: w === 0 ? d("ui.chat.transcript.noMatches") : d("ui.chat.transcript.matchCount", { count: w })
+                children: k === 0 ? d("ui.chat.transcript.noMatches") : d("ui.chat.transcript.matchCount", { count: k })
               }
             ) : null
           ] }) : null,
@@ -260,14 +315,14 @@ const J = $(
             {
               ref: h,
               className: "ds:flex-1 ds:min-h-0 ds:overflow-y-auto ds:overflow-x-hidden",
-              children: T ? /* @__PURE__ */ o(
+              children: N ? /* @__PURE__ */ o(
                 "ol",
                 {
                   className: "ds:relative ds:list-none ds:ps-0 ds:m-0",
                   style: { blockSize: `${y.getTotalSize()}px` },
                   children: y.getVirtualItems().map((e) => {
                     const r = t[e.index];
-                    return r ? k(r, e.index, {
+                    return r ? S(r, e.index, {
                       liRef: y.measureElement,
                       dataIndex: e.index,
                       style: { transform: `translateY(${e.start}px)` },
@@ -275,7 +330,7 @@ const J = $(
                     }) : null;
                   })
                 }
-              ) : /* @__PURE__ */ o("ol", { className: "ds:list-none ds:ps-0 ds:m-0", children: t.map((e, r) => k(e, r)) })
+              ) : /* @__PURE__ */ o("ol", { className: "ds:list-none ds:ps-0 ds:m-0", children: t.map((e, r) => S(e, r)) })
             }
           )
         ]
@@ -283,55 +338,9 @@ const J = $(
     );
   }
 );
-J.displayName = "TranscriptPanel";
-const ne = {
-  id: "transcript-panel",
-  capabilities: ["select_single"],
-  state: {
-    selectedTurn: {
-      type: "string | null",
-      descriptionKey: "ui.agent.transcriptPanel.state.selectedTurn",
-      description: "Opaque id (line index) of the currently-active turn, or null when none is active.",
-      read: (t) => t.getSelectedTurn()
-    }
-  },
-  actions: {
-    focus_turn: {
-      safety: "read",
-      argsType: "{ id: string }",
-      descriptionKey: "ui.agent.transcriptPanel.actions.focusTurn",
-      description: "Scroll the given turn into view and focus its seek button.",
-      invoke: (t, n) => {
-        t.focusTurn(n.id);
-      }
-    },
-    copy_turn: {
-      safety: "read",
-      argsType: "{ id: string }",
-      descriptionKey: "ui.agent.transcriptPanel.actions.copyTurn",
-      description: "Copy the given turn's text to the clipboard.",
-      invoke: (t, n) => t.copyTurn(n.id)
-    }
-  },
-  domHooks: {
-    root: {
-      attr: "data-component",
-      value: "transcript-panel",
-      description: "Marks the TranscriptPanel wrapper."
-    },
-    instanceId: {
-      attr: "data-component-id",
-      sourceProp: "id",
-      description: "Sourced from the id prop."
-    },
-    item: {
-      attr: "data-turn-id",
-      description: "Stable opaque turn id (line index). Never carries the turn's dictated text."
-    }
-  }
-};
+te.displayName = "TranscriptPanel";
 export {
-  J as T,
-  ne as t
+  te as T,
+  U as t
 };
-//# sourceMappingURL=transcript-panel.agent-BXEYP6w-.js.map
+//# sourceMappingURL=transcript-panel-Bx5ANMsv.js.map

package/dist/_chunks/{typing-indicator-CbUBf-Dx.js → typing-indicator-BZ5jXZPn.js}

@@ -50,7 +50,14 @@ const g = i(
     defaultVariants: { size: "md" }
   }
 ), x = f(
-  ({ size: a = "md", density: e = "default", label: r, hideLabel: n = !1, className: l, ...c }, m) => {
+  ({
+    size: a = "md",
+    density: e = "default",
+    label: r,
+    hideLabel: n = !1,
+    className: l,
+    ...c
+  }, m) => {
     const { t: p } = u(), d = r ?? p("ui.chat.typing");
     return /* @__PURE__ */ o(
       "div",
@@ -65,9 +72,24 @@ const g = i(
         ...c,
         children: [
           /* @__PURE__ */ o("span", { "aria-hidden": "true", className: v({ density: e }), children: [
-            /* @__PURE__ */ s("span", { className: `${t({ size: a })} ds:[animation-delay:0ms]` }),
-            /* @__PURE__ */ s("span", { className: `${t({ size: a })} ds:[animation-delay:200ms]` }),
-            /* @__PURE__ */ s("span", { className: `${t({ size: a })} ds:[animation-delay:400ms]` })
+            /* @__PURE__ */ s(
+              "span",
+              {
+                className: `${t({ size: a })} ds:[animation-delay:0ms]`
+              }
+            ),
+            /* @__PURE__ */ s(
+              "span",
+              {
+                className: `${t({ size: a })} ds:[animation-delay:200ms]`
+              }
+            ),
+            /* @__PURE__ */ s(
+              "span",
+              {
+                className: `${t({ size: a })} ds:[animation-delay:400ms]`
+              }
+            )
           ] }),
           n ? null : /* @__PURE__ */ s("span", { className: "ds:font-medium", children: d })
         ]
@@ -79,4 +101,4 @@ x.displayName = "TypingIndicator";
 export {
   x as T
 };
-//# sourceMappingURL=typing-indicator-CbUBf-Dx.js.map
+//# sourceMappingURL=typing-indicator-BZ5jXZPn.js.map

package/dist/_chunks/{use-theme-BMUhembX.js → use-theme-B1cwAXJR.js}

@@ -119,10 +119,7 @@ function U() {
     K(k(e));
   }, [e]);
   const t = b((n) => {
-    g(
-      y,
-      n === "system" ? null : n
-    ), c({ ...s, theme: n });
+    g(y, n === "system" ? null : n), c({ ...s, theme: n });
   }, []), r = b((n) => {
     g(
       w,
@@ -145,4 +142,4 @@ export {
   v as t,
   U as u
 };
-//# sourceMappingURL=use-theme-BMUhembX.js.map
+//# sourceMappingURL=use-theme-B1cwAXJR.js.map

package/dist/_chunks/{visually-hidden-Bw7vBHLm.js → visually-hidden-BHxEUGyT.js}

@@ -11,11 +11,20 @@ const m = "ds:sr-only", N = r(
         ref: n
       });
     }
-    return /* @__PURE__ */ i("span", { ref: n, className: a, "data-component": "visually-hidden", ...o, children: s });
+    return /* @__PURE__ */ i(
+      "span",
+      {
+        ref: n,
+        className: a,
+        "data-component": "visually-hidden",
+        ...o,
+        children: s
+      }
+    );
   }
 );
 N.displayName = "VisuallyHidden";
 export {
   N as V
 };
-//# sourceMappingURL=visually-hidden-Bw7vBHLm.js.map
+//# sourceMappingURL=visually-hidden-BHxEUGyT.js.map

package/dist/_chunks/{warning-stack-8Pa3pekh.js → warning-stack-VygGHSqC.js}

@@ -2,8 +2,8 @@ import { jsxs as l, jsx as a } from "react/jsx-runtime";
 import { forwardRef as M, useId as N, useState as O, useRef as y, useEffect as V, useMemo as _, useCallback as j } from "react";
 import { c as W } from "./index-D2ZczOXr.js";
 import { useTranslation as q } from "react-i18next";
-import { A as u } from "./alert-BlOUMkXj.js";
-import { B as F } from "./button-7mLWcMp_.js";
+import { A as u } from "./alert-B1sj8Ss0.js";
+import { B as F } from "./button-DD_0Xdmr.js";
 import { C as H } from "./chevron-down-BX_NP2Yh.js";
 const L = W(
   [
@@ -50,18 +50,18 @@ const L = W(
     maxVisible: t,
     defaultCollapsed: z = !0,
     onDismiss: i,
-    size: g = "md",
+    size: f = "md",
     stretch: v = !1,
     ariaLabel: A,
     emptyState: m,
     className: w,
     ...x
   }, k) => {
-    const { t: e } = q(), d = N(), b = N(), c = t !== void 0 && r.length > t, [o, B] = O(z), f = y(null), S = y(r.length);
+    const { t: e } = q(), d = N(), b = N(), c = t !== void 0 && r.length > t, [o, B] = O(z), g = y(null), S = y(r.length);
     V(() => {
-      if (!f.current) return;
+      if (!g.current) return;
       const n = S.current, s = r.length;
-      n !== s && (f.current.textContent = e("ui.warningStack.countChanged", {
+      n !== s && (g.current.textContent = e("ui.warningStack.countChanged", {
         count: s,
         defaultValue: "{{count}} warnings to review"
       })), S.current = s;
@@ -86,10 +86,9 @@ const L = W(
       "section",
       {
         ref: k,
-        role: "region",
         "aria-labelledby": d,
         "data-component": "warning-stack",
-        className: [L({ size: g, stretch: v }), w].filter(Boolean).join(" "),
+        className: [L({ size: f, stretch: v }), w].filter(Boolean).join(" "),
         ...x,
         children: [
           C,
@@ -100,17 +99,16 @@ const L = W(
       "section",
       {
         ref: k,
-        role: "region",
         "aria-labelledby": d,
         "data-component": "warning-stack",
-        className: [L({ size: g, stretch: v }), w].filter(Boolean).join(" "),
+        className: [L({ size: f, stretch: v }), w].filter(Boolean).join(" "),
         ...x,
         children: [
           C,
           /* @__PURE__ */ a(
             "div",
             {
-              ref: f,
+              ref: g,
               "aria-live": "polite",
               "aria-atomic": "true",
               className: "ds:sr-only"
@@ -120,7 +118,7 @@ const L = W(
             "ul",
             {
               id: b,
-              className: J({ size: g }),
+              className: J({ size: f }),
               "aria-label": e("ui.warningStack.listLabel", "Warning list"),
               children: R.map((n) => {
                 const s = n.variant ?? "warning";
@@ -178,4 +176,4 @@ P.displayName = "WarningStack";
 export {
   P as W
 };
-//# sourceMappingURL=warning-stack-8Pa3pekh.js.map
+//# sourceMappingURL=warning-stack-VygGHSqC.js.map