@alfadocs/ui-kit 0.1.8 → 0.1.10

package/dist/_chunks/transcript-panel-CNbVGG9L.js

@@ -1,266 +0,0 @@
-import { jsxs as m, jsx as n } from "react/jsx-runtime";
-import { forwardRef as $, useState as j, useRef as I, useId as A, useMemo as z, useCallback as L, useLayoutEffect as K, Fragment as P } from "react";
-import { c as D } from "./index-D2ZczOXr.js";
-import { useTranslation as O } from "react-i18next";
-import { u as V } from "./index-CJE9uQmb.js";
-import { S as F } from "./search-input-BVMCONyN.js";
-const _ = D(
-  [
-    "ds:flex ds:flex-col ds:w-full ds:min-h-0",
-    "ds:rounded-[var(--radius-md)] ds:border ds:border-border",
-    "ds:bg-background",
-    "ds:focus-within:border-[color:var(--primary)]"
-  ].join(" "),
-  {
-    variants: {
-      size: {
-        sm: "ds:text-[length:var(--font-size-sm)]",
-        md: "ds:text-[length:var(--font-size-base)]",
-        lg: "ds:text-[length:var(--font-size-lg)]"
-      }
-    },
-    defaultVariants: { size: "md" }
-  }
-), H = 100, B = 8;
-function M(s, r) {
-  const o = Math.max(0, Math.floor(s)), d = Math.floor(o / 60), c = o % 60, l = (h) => new Intl.NumberFormat(r, { minimumIntegerDigits: 2 }).format(h);
-  return `${l(d)}:${l(c)}`;
-}
-function U(s) {
-  const r = Math.max(0, Math.floor(s)), o = Math.floor(r / 60), d = r % 60;
-  return `PT${o}M${d}S`;
-}
-function G(s) {
-  let r = 0;
-  for (let o = 0; o < s.length; o += 1)
-    r = r * 31 + s.charCodeAt(o) | 0;
-  return Math.abs(r) % B;
-}
-const Q = [
-  "ds:bg-[color:var(--transcript-speaker-1)]",
-  "ds:bg-[color:var(--transcript-speaker-2)]",
-  "ds:bg-[color:var(--transcript-speaker-3)]",
-  "ds:bg-[color:var(--transcript-speaker-4)]",
-  "ds:bg-[color:var(--transcript-speaker-5)]",
-  "ds:bg-[color:var(--transcript-speaker-6)]",
-  "ds:bg-[color:var(--transcript-speaker-7)]",
-  "ds:bg-[color:var(--transcript-speaker-8)]"
-];
-function Y(s) {
-  return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-}
-function Z({ text: s, query: r }) {
-  if (!r) return s;
-  const o = Y(r);
-  return s.split(new RegExp(`(${o})`, "gi")).map(
-    (c, l) => c.toLocaleLowerCase() === r.toLocaleLowerCase() ? /* @__PURE__ */ n(
-      "mark",
-      {
-        className: "ds:bg-[color:var(--warning)]/30 ds:text-[color:var(--foreground)] ds:rounded-[var(--radius-sm)]",
-        children: c
-      },
-      l
-    ) : /* @__PURE__ */ n(P, { children: c }, l)
-  );
-}
-const q = $(
-  ({
-    lines: s,
-    currentTime: r = 0,
-    onSeek: o,
-    searchable: d = !0,
-    size: c = "md",
-    className: l,
-    ...h
-  }, R) => {
-    const { t: i, i18n: v } = O(), [u, T] = j(""), b = I(null), w = I(null), S = A(), p = z(() => {
-      if (!Number.isFinite(r)) return -1;
-      for (let e = 0; e < s.length; e += 1) {
-        const t = s[e];
-        if (t.start <= r && r < t.end) return e;
-      }
-      return -1;
-    }, [s, r]), y = z(() => {
-      if (!u) return 0;
-      let e = 0;
-      const t = u.toLocaleLowerCase();
-      for (const a of s) {
-        const f = a.text.toLocaleLowerCase();
-        let g = f.indexOf(t);
-        for (; g !== -1; )
-          e += 1, g = f.indexOf(t, g + t.length);
-      }
-      return e;
-    }, [s, u]), E = L(
-      (e) => {
-        var t;
-        (e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "f" && d && (e.preventDefault(), (t = w.current) == null || t.focus());
-      },
-      [d]
-    ), N = s.length > H, x = V({
-      count: N ? s.length : 0,
-      getScrollElement: () => b.current,
-      estimateSize: () => 48,
-      overscan: 8,
-      getItemKey: (e) => e
-    });
-    K(() => {
-      if (p < 0) return;
-      const e = b.current;
-      if (!e) return;
-      const t = e.querySelector(
-        `[data-line-index="${p}"]`
-      );
-      if (!t) return;
-      const a = typeof window < "u" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-      t.scrollIntoView({
-        block: "center",
-        behavior: a ? "auto" : "smooth"
-      });
-    }, [p]);
-    const k = L(
-      (e, t, a) => {
-        const f = t === p, g = G(e.speaker), C = typeof e.confidence == "number" && e.confidence < 0.6;
-        return /* @__PURE__ */ m(
-          "li",
-          {
-            ref: a == null ? void 0 : a.liRef,
-            "data-line-index": t,
-            "data-index": a == null ? void 0 : a.dataIndex,
-            "aria-current": f ? "true" : void 0,
-            style: a == null ? void 0 : a.style,
-            className: [
-              "ds:flex ds:items-start ds:gap-[var(--spacing-sm)]",
-              "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-sm)]",
-              f ? "ds:bg-[color:var(--accent)]/12 ds:border-s-[3px] ds:border-[color:var(--primary)]" : "ds:border-s-[3px] ds:border-transparent",
-              a != null && a.absolutePositioning ? "ds:absolute ds:start-0 ds:end-0 ds:top-0 ds:w-full" : ""
-            ].filter(Boolean).join(" "),
-            children: [
-              /* @__PURE__ */ n(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => o == null ? void 0 : o(e.start),
-                  "aria-label": i("ui.chat.transcript.seekTo", {
-                    time: M(e.start, v.language)
-                  }),
-                  className: [
-                    "ds:inline-flex ds:items-center ds:justify-center",
-                    "ds:font-[family-name:var(--font-mono)]",
-                    "type-meta",
-                    "ds:tabular-nums",
-                    "ds:text-[color:var(--muted-foreground)]",
-                    "ds:rounded-[var(--radius-sm)]",
-                    "ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]",
-                    // WCAG 2.5.5 target size: 44×44 default, 48×48 in accessible
-                    // themes — matches the DS `--min-target-size` token.
-                    "ds:min-h-[var(--min-target-size)] ds:min-w-[var(--min-target-size)]",
-                    "ds:hover:bg-muted/20",
-                    "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]"
-                  ].join(" "),
-                  children: /* @__PURE__ */ n("time", { dir: "ltr", dateTime: U(e.start), children: M(e.start, v.language) })
-                }
-              ),
-              /* @__PURE__ */ m("div", { className: "ds:flex-1 ds:min-w-0", children: [
-                /* @__PURE__ */ m("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
-                  /* @__PURE__ */ n(
-                    "span",
-                    {
-                      "aria-hidden": "true",
-                      className: `ds:inline-block ds:size-2 ds:rounded-[var(--radius-full)] ${Q[g]}`
-                    }
-                  ),
-                  /* @__PURE__ */ n("strong", { className: "type-title-item", children: i("ui.chat.transcript.speaker", { name: e.speaker }) }),
-                  C ? /* @__PURE__ */ m("span", { className: "type-meta ds:italic ds:text-[color:var(--muted-foreground)]", children: [
-                    "(",
-                    i("ui.chat.transcript.lowConfidence"),
-                    ")"
-                  ] }) : null
-                ] }),
-                /* @__PURE__ */ n(
-                  "span",
-                  {
-                    dir: "auto",
-                    className: [
-                      "ds:block",
-                      C ? "ds:underline ds:decoration-dotted ds:decoration-[color:var(--muted-foreground)]" : ""
-                    ].join(" "),
-                    children: /* @__PURE__ */ n(Z, { text: e.text, query: u })
-                  }
-                )
-              ] })
-            ]
-          },
-          t
-        );
-      },
-      [p, v.language, o, u, i]
-    );
-    return /* @__PURE__ */ m(
-      "div",
-      {
-        ref: R,
-        onKeyDown: E,
-        "data-component": "transcript-panel",
-        className: _({ size: c, className: l }),
-        ...h,
-        children: [
-          d ? /* @__PURE__ */ m("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__ */ n(
-              F,
-              {
-                ref: w,
-                id: S,
-                placeholder: i("ui.chat.transcript.search"),
-                "aria-label": i("ui.chat.transcript.search"),
-                "aria-keyshortcuts": "Meta+F Control+F",
-                debounceMs: 150,
-                onChange: (e) => T(e),
-                size: "sm"
-              }
-            ),
-            u ? /* @__PURE__ */ n(
-              "span",
-              {
-                role: "status",
-                "aria-live": "polite",
-                className: "type-meta ds:text-[color:var(--muted-foreground)] ds:tabular-nums",
-                children: y === 0 ? i("ui.chat.transcript.noMatches") : i("ui.chat.transcript.matchCount", { count: y })
-              }
-            ) : null
-          ] }) : null,
-          /* @__PURE__ */ n(
-            "div",
-            {
-              ref: b,
-              className: "ds:flex-1 ds:min-h-0 ds:overflow-y-auto ds:overflow-x-hidden",
-              children: N ? /* @__PURE__ */ n(
-                "ol",
-                {
-                  className: "ds:relative ds:list-none ds:ps-0 ds:m-0",
-                  style: { blockSize: `${x.getTotalSize()}px` },
-                  children: x.getVirtualItems().map((e) => {
-                    const t = s[e.index];
-                    return t ? k(t, e.index, {
-                      liRef: x.measureElement,
-                      dataIndex: e.index,
-                      style: { transform: `translateY(${e.start}px)` },
-                      absolutePositioning: !0
-                    }) : null;
-                  })
-                }
-              ) : /* @__PURE__ */ n("ol", { className: "ds:list-none ds:ps-0 ds:m-0", children: s.map((e, t) => k(e, t)) })
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-q.displayName = "TranscriptPanel";
-export {
-  q as T
-};
-//# sourceMappingURL=transcript-panel-CNbVGG9L.js.map