@elabs-ai/components-ai 4.2.0 → 5.0.0

package/dist/chunk-RB7G65JC.js

@@ -0,0 +1,213 @@
+"use client";
+import {
+  MarkdownView
+} from "./chunk-V4DORGWJ.js";
+import {
+  useAssetPreviewRenderer
+} from "./chunk-NPUCMAG2.js";
+import {
+  CodeBlock
+} from "./chunk-TWPHAJNM.js";
+import {
+  Artifact,
+  ArtifactActions,
+  ArtifactContent,
+  ArtifactHeader,
+  ArtifactTitle
+} from "./chunk-DDG5JHQT.js";
+
+// src/asset-preview.tsx
+import {
+  Button,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+  useLocale
+} from "@elabs-ai/components-ui";
+import { cn } from "@elabs-ai/components-ui/lib/cn";
+import { useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DEFAULT_CODE_LANGUAGE = "typescript";
+function assetLanguage(asset) {
+  switch (asset.type) {
+    case "markdown":
+      return "markdown";
+    case "sql":
+      return "sql";
+    case "csv":
+      return "csv";
+    case "code":
+      return asset.language ?? DEFAULT_CODE_LANGUAGE;
+    default:
+      return DEFAULT_CODE_LANGUAGE;
+  }
+}
+function parseCsvRows(content) {
+  const rows = [];
+  let row = [];
+  let field = "";
+  let wasQuoted = false;
+  let inQuotes = false;
+  const endField = () => {
+    row.push(wasQuoted ? field : field.trim());
+    field = "";
+    wasQuoted = false;
+  };
+  const endRow = () => {
+    endField();
+    rows.push(row);
+    row = [];
+  };
+  for (let i = 0; i < content.length; i++) {
+    const ch = content[i];
+    if (inQuotes) {
+      if (ch === '"') {
+        if (content[i + 1] === '"') {
+          field += '"';
+          i += 1;
+        } else {
+          inQuotes = false;
+        }
+      } else {
+        field += ch;
+      }
+      continue;
+    }
+    if (ch === '"' && field === "") {
+      inQuotes = true;
+      wasQuoted = true;
+      continue;
+    }
+    if (ch === ",") {
+      endField();
+      continue;
+    }
+    if (ch === "\r") {
+      continue;
+    }
+    if (ch === "\n") {
+      endRow();
+      continue;
+    }
+    field += ch;
+  }
+  if (field !== "" || row.length > 0) {
+    endRow();
+  }
+  return rows;
+}
+function parseCsv(content) {
+  const rows = parseCsvRows(content.trim()).filter((r) => !(r.length === 1 && r[0] === ""));
+  const [header = [], ...rest] = rows;
+  return { header, rows: rest };
+}
+var CsvPreview = ({ content }) => {
+  const { t } = useLocale();
+  const { header, rows } = useMemo(() => parseCsv(content), [content]);
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+    /* @__PURE__ */ jsxs(Table, { className: "text-body tabular-nums", children: [
+      /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsx(TableRow, { children: header.map((cell) => /* @__PURE__ */ jsx(TableHead, { children: cell }, cell)) }) }),
+      /* @__PURE__ */ jsx(TableBody, { children: rows.map((row, rowIndex) => (
+        // Rows have no stable identity in raw CSV — index is the key.
+        // oxlint-disable-next-line eslint-plugin-react(no-array-index-key)
+        /* @__PURE__ */ jsx(TableRow, { children: row.map((cell, cellIndex) => (
+          // oxlint-disable-next-line eslint-plugin-react(no-array-index-key)
+          /* @__PURE__ */ jsx(TableCell, { children: cell }, `cell-${rowIndex}-${cellIndex}`)
+        )) }, `row-${rowIndex}`)
+      )) })
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "text-meta text-muted-foreground", children: t("ai.assetPreview.rowCount", { count: rows.length }) })
+  ] });
+};
+var AssetPreview = ({
+  asset,
+  defaultMode = "preview",
+  renderPreview,
+  className,
+  ...props
+}) => {
+  const { t } = useLocale();
+  const [mode, setMode] = useState(defaultMode);
+  const injectedRenderer = useAssetPreviewRenderer();
+  const content = asset.content ?? "";
+  const hasRaw = asset.type !== "image" && content.length > 0;
+  const showRaw = mode === "raw" && hasRaw;
+  const render = renderPreview ?? injectedRenderer;
+  const injected = !showRaw && render ? render(asset) : null;
+  let body;
+  if (injected !== null) {
+    body = injected;
+  } else if (asset.type !== "image" && content.length === 0) {
+    body = /* @__PURE__ */ jsx("p", { className: "text-body text-muted-foreground", children: t("ai.assetPreview.noPreview") });
+  } else if (showRaw) {
+    body = /* @__PURE__ */ jsx(CodeBlock, { code: content, language: assetLanguage(asset), wrap: true });
+  } else {
+    switch (asset.type) {
+      case "markdown": {
+        body = /* @__PURE__ */ jsx(MarkdownView, { baseHeadingLevel: 2, children: content });
+        break;
+      }
+      case "code":
+      case "sql": {
+        body = /* @__PURE__ */ jsx(CodeBlock, { code: content, language: assetLanguage(asset), showLineNumbers: true, wrap: true });
+        break;
+      }
+      case "csv": {
+        body = /* @__PURE__ */ jsx(CsvPreview, { content });
+        break;
+      }
+      case "image": {
+        body = /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: content || asset.path,
+            alt: asset.name,
+            loading: "lazy",
+            className: "max-w-full rounded-md"
+          }
+        );
+        break;
+      }
+    }
+  }
+  return /* @__PURE__ */ jsxs(Artifact, { "data-slot": "asset-preview", className, ...props, children: [
+    /* @__PURE__ */ jsxs(ArtifactHeader, { children: [
+      /* @__PURE__ */ jsx(ArtifactTitle, { className: "min-w-0 truncate", children: asset.name }),
+      hasRaw ? /* @__PURE__ */ jsxs(ArtifactActions, { children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "sm",
+            "aria-pressed": !showRaw,
+            className: cn(!showRaw && "bg-accent text-accent-foreground"),
+            onClick: () => setMode("preview"),
+            children: t("ai.assetPreview.preview")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "sm",
+            "aria-pressed": showRaw,
+            className: cn(showRaw && "bg-accent text-accent-foreground"),
+            onClick: () => setMode("raw"),
+            children: t("ai.assetPreview.raw")
+          }
+        )
+      ] }) : null
+    ] }),
+    /* @__PURE__ */ jsx(ArtifactContent, { children: body })
+  ] });
+};
+
+export {
+  AssetPreview
+};
+//# sourceMappingURL=chunk-RB7G65JC.js.map

package/dist/chunk-RB7G65JC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/asset-preview.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * AssetPreview — type-keyed preview of one produced asset (#193, research 04\n * §5 ASSET-4). Reuses the `Artifact` chrome for the header/actions; the body\n * switches on `ContextAsset.type`:\n *\n *   markdown → `MarkdownView` (the branded renderer — a document, never\n *              Shiki source; the ASSET-2 fix)\n *   code/sql → `CodeBlock` (Shiki)\n *   csv      → a small token-styled table + row-count summary\n *   image    → an image preview\n *\n * A Preview / Raw toggle serves users who want the source (Raw = `CodeBlock`,\n * soft-wrapped for narrow embeds). Selection state lives in the\n * `ContextPanelProvider` — the tree and this preview are the two levels of the\n * drill-in.\n *\n * Formats beyond that switch — a PDF, a spreadsheet, a video — arrive through\n * `renderPreview` (prop, or injected once on `ContextPanelProvider`), because\n * `@elabs-ai/components-viewer` is a layer PEER of this package and\n * neither may import the other (ADR 0024 §6). A renderer that returns `null`\n * declines, and everything below runs exactly as before.\n */\nimport {\n  Button,\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n  useLocale,\n} from \"@elabs-ai/components-ui\";\nimport { cn } from \"@elabs-ai/components-ui/lib/cn\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { useMemo, useState } from \"react\";\nimport type { BundledLanguage } from \"shiki\";\nimport {\n  Artifact,\n  ArtifactActions,\n  ArtifactContent,\n  ArtifactHeader,\n  ArtifactTitle,\n} from \"./artifact\";\nimport { CodeBlock } from \"./code-block\";\nimport type { AssetPreviewRenderer, ContextAsset } from \"./context-panel\";\nimport { useAssetPreviewRenderer } from \"./context-panel\";\nimport { MarkdownView } from \"./markdown-view\";\n\nexport type AssetPreviewMode = \"preview\" | \"raw\";\n\nconst DEFAULT_CODE_LANGUAGE: BundledLanguage = \"typescript\";\n\n/** Raw-mode (and code-preview) Shiki language for an asset. */\nfunction assetLanguage(asset: ContextAsset): BundledLanguage {\n  switch (asset.type) {\n    case \"markdown\":\n      return \"markdown\";\n    case \"sql\":\n      return \"sql\";\n    case \"csv\":\n      return \"csv\";\n    case \"code\":\n      return (asset.language as BundledLanguage) ?? DEFAULT_CODE_LANGUAGE;\n    default:\n      return DEFAULT_CODE_LANGUAGE;\n  }\n}\n\ninterface ParsedCsv {\n  header: string[];\n  rows: string[][];\n}\n\n/**\n * A small RFC 4180-ish CSV tokenizer: handles quoted fields (commas and\n * newlines inside quotes don't end the field/row) and the `\"\"` escaped-quote\n * convention. Single pass over the raw string — no line pre-split, so a\n * quoted field spanning multiple lines survives intact. Still preview-grade\n * (unquoted cells are trimmed for the glance table), not a full CSV grammar.\n */\nfunction parseCsvRows(content: string): string[][] {\n  const rows: string[][] = [];\n  let row: string[] = [];\n  let field = \"\";\n  let wasQuoted = false;\n  let inQuotes = false;\n\n  const endField = () => {\n    row.push(wasQuoted ? field : field.trim());\n    field = \"\";\n    wasQuoted = false;\n  };\n  const endRow = () => {\n    endField();\n    rows.push(row);\n    row = [];\n  };\n\n  for (let i = 0; i < content.length; i++) {\n    const ch = content[i];\n\n    if (inQuotes) {\n      if (ch === '\"') {\n        if (content[i + 1] === '\"') {\n          field += '\"';\n          i += 1;\n        } else {\n          inQuotes = false;\n        }\n      } else {\n        field += ch;\n      }\n      continue;\n    }\n\n    if (ch === '\"' && field === \"\") {\n      inQuotes = true;\n      wasQuoted = true;\n      continue;\n    }\n\n    if (ch === \",\") {\n      endField();\n      continue;\n    }\n\n    if (ch === \"\\r\") {\n      continue;\n    }\n\n    if (ch === \"\\n\") {\n      endRow();\n      continue;\n    }\n\n    field += ch;\n  }\n\n  // A trailing field/row with no terminating newline.\n  if (field !== \"\" || row.length > 0) {\n    endRow();\n  }\n\n  return rows;\n}\n\nfunction parseCsv(content: string): ParsedCsv {\n  const rows = parseCsvRows(content.trim()).filter((r) => !(r.length === 1 && r[0] === \"\"));\n  const [header = [], ...rest] = rows;\n  return { header, rows: rest };\n}\n\nconst CsvPreview = ({ content }: { content: string }) => {\n  const { t } = useLocale();\n  const { header, rows } = useMemo(() => parseCsv(content), [content]);\n  return (\n    <div className=\"flex flex-col gap-2\">\n      <Table className=\"text-body tabular-nums\">\n        <TableHeader>\n          <TableRow>\n            {header.map((cell) => (\n              <TableHead key={cell}>{cell}</TableHead>\n            ))}\n          </TableRow>\n        </TableHeader>\n        <TableBody>\n          {rows.map((row, rowIndex) => (\n            // Rows have no stable identity in raw CSV — index is the key.\n            // oxlint-disable-next-line eslint-plugin-react(no-array-index-key)\n            <TableRow key={`row-${rowIndex}`}>\n              {row.map((cell, cellIndex) => (\n                // oxlint-disable-next-line eslint-plugin-react(no-array-index-key)\n                <TableCell key={`cell-${rowIndex}-${cellIndex}`}>{cell}</TableCell>\n              ))}\n            </TableRow>\n          ))}\n        </TableBody>\n      </Table>\n      <p className=\"text-meta text-muted-foreground\">\n        {t(\"ai.assetPreview.rowCount\", { count: rows.length })}\n      </p>\n    </div>\n  );\n};\n\nexport interface AssetPreviewProps extends HTMLAttributes<HTMLDivElement> {\n  asset: ContextAsset;\n  /** Initial mode. Default `\"preview\"`. */\n  defaultMode?: AssetPreviewMode;\n  /**\n   * Draw this asset's preview body yourself; return `null` to decline and get\n   * the built-in rendering. Wins over a renderer injected on\n   * `ContextPanelProvider`, so one rail-wide default can still be overridden\n   * for a single preview.\n   */\n  renderPreview?: AssetPreviewRenderer;\n}\n\nexport const AssetPreview = ({\n  asset,\n  defaultMode = \"preview\",\n  renderPreview,\n  className,\n  ...props\n}: AssetPreviewProps) => {\n  const { t } = useLocale();\n  const [mode, setMode] = useState<AssetPreviewMode>(defaultMode);\n  const injectedRenderer = useAssetPreviewRenderer();\n  const content = asset.content ?? \"\";\n  // Raw source only exists for text assets with content.\n  const hasRaw = asset.type !== \"image\" && content.length > 0;\n  const showRaw = mode === \"raw\" && hasRaw;\n\n  // Raw is \"show me the source\", so an injection never intercepts it.\n  const render = renderPreview ?? injectedRenderer;\n  const injected = !showRaw && render ? render(asset) : null;\n\n  let body: ReactNode;\n  if (injected !== null) {\n    body = injected;\n  } else if (asset.type !== \"image\" && content.length === 0) {\n    body = <p className=\"text-body text-muted-foreground\">{t(\"ai.assetPreview.noPreview\")}</p>;\n  } else if (showRaw) {\n    body = <CodeBlock code={content} language={assetLanguage(asset)} wrap />;\n  } else {\n    switch (asset.type) {\n      case \"markdown\": {\n        // Constrained heading rung inside the narrow rail (research 09 §G.2).\n        body = <MarkdownView baseHeadingLevel={2}>{content}</MarkdownView>;\n        break;\n      }\n      case \"code\":\n      case \"sql\": {\n        body = <CodeBlock code={content} language={assetLanguage(asset)} showLineNumbers wrap />;\n        break;\n      }\n      case \"csv\": {\n        body = <CsvPreview content={content} />;\n        break;\n      }\n      case \"image\": {\n        body = (\n          <img\n            src={content || asset.path}\n            alt={asset.name}\n            loading=\"lazy\"\n            className=\"max-w-full rounded-md\"\n          />\n        );\n        break;\n      }\n    }\n  }\n\n  return (\n    <Artifact data-slot=\"asset-preview\" className={className} {...props}>\n      <ArtifactHeader>\n        <ArtifactTitle className=\"min-w-0 truncate\">{asset.name}</ArtifactTitle>\n        {hasRaw ? (\n          <ArtifactActions>\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"sm\"\n              aria-pressed={!showRaw}\n              className={cn(!showRaw && \"bg-accent text-accent-foreground\")}\n              onClick={() => setMode(\"preview\")}\n            >\n              {t(\"ai.assetPreview.preview\")}\n            </Button>\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"sm\"\n              aria-pressed={showRaw}\n              className={cn(showRaw && \"bg-accent text-accent-foreground\")}\n              onClick={() => setMode(\"raw\")}\n            >\n              {t(\"ai.assetPreview.raw\")}\n            </Button>\n          </ArtifactActions>\n        ) : null}\n      </ArtifactHeader>\n      <ArtifactContent>{body}</ArtifactContent>\n    </Artifact>\n  );\n};\n"],"mappings":"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","names":[]}

package/dist/chunk-RPHAOR7P.js

@@ -0,0 +1,45 @@
+"use client";
+
+// src/chat-greeting.tsx
+import { forwardRef } from "react";
+import { cn, Heading } from "@elabs-ai/components-ui";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var ChatGreeting = forwardRef(function ChatGreeting2({ title, subtitle, accent, orb = true, level = 1, className, ...props }, ref) {
+  const hasSecondLine = subtitle != null || accent != null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      "data-slot": "chat-greeting",
+      className: cn("relative isolate mb-10 text-center", className),
+      ...props,
+      children: [
+        orb ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            "aria-hidden": "true",
+            "data-slot": "chat-greeting-orb",
+            className: "pointer-events-none absolute start-1/2 top-0 -z-10 size-40 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary/15 blur-3xl"
+          }
+        ) : null,
+        /* @__PURE__ */ jsxs(Heading, { "data-slot": "chat-greeting-title", level, size: "display", children: [
+          title,
+          hasSecondLine ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("br", {}),
+            subtitle,
+            subtitle != null && accent != null ? " " : null,
+            accent != null ? (
+              // #399 — accent phrase inside a headline is TEXT: `-text` rung.
+              /* @__PURE__ */ jsx("span", { className: "font-bold text-primary-text underline decoration-2 underline-offset-4", children: accent })
+            ) : null
+          ] }) : null
+        ] })
+      ]
+    }
+  );
+});
+
+export {
+  ChatGreeting
+};
+//# sourceMappingURL=chunk-RPHAOR7P.js.map

package/dist/chunk-RPHAOR7P.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/chat-greeting.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\nimport { cn, Heading, type HeadingLevel } from \"@elabs-ai/components-ui\";\n\nexport interface ChatGreetingProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  /** Primary line, e.g. \"Good morning, Avery\". */\n  title: ReactNode;\n  /**\n   * Second line, rendered under `title` inside the same heading. Independent\n   * of `accent` — either may be passed alone.\n   */\n  subtitle?: ReactNode;\n  /**\n   * Phrase rendered in `text-primary-text` with a bold underline, appended\n   * after `subtitle` (or alone). The underline + weight is a NON-hue channel\n   * deliberately layered on top of the color — a monochrome theme's `--primary`\n   * can be a near-white \"pen\" by design, in which case the accent colour alone\n   * is indistinguishable from the surrounding `--foreground` headline text. The\n   * underline/weight keep the phrase legible as an accent in EVERY theme,\n   * not only the two where hue alone would carry it.\n   */\n  accent?: ReactNode;\n  /** Soft primary glow behind the headline. Default `true`; `false` for dense/embedded use. */\n  orb?: boolean;\n  /**\n   * Semantic heading level for `title`. Default `1` (a chat empty state is\n   * typically the only heading on the page). Override to `2`+ when ChatGreeting\n   * sits inside a page or route that already renders its own `<h1>` —\n   * `Heading` decouples `level` from `size`, so the visual display-scale rung\n   * stays put regardless of the level chosen.\n   */\n  level?: HeadingLevel;\n}\n\n/**\n * ChatGreeting — the centered first-run greeting for an empty chat/composer scene.\n *\n * A display-scale headline (`title`, then `subtitle` with an `accent` phrase\n * in `text-primary-text` + a bold underline, so the accent reads in every theme,\n * including a monochrome one whose `--primary` is otherwise the same\n * near-white as the headline) over an optional soft primary glow. Pair it\n * with `<Composer />` for the standard empty/first-run chat state.\n *\n * Distinct from `ConversationEmptyState` (a generic centered \"No messages yet\"\n * message panel) — this is the display-scale greeting anatomy, not a status\n * message.\n */\nexport const ChatGreeting = forwardRef<HTMLDivElement, ChatGreetingProps>(function ChatGreeting(\n  { title, subtitle, accent, orb = true, level = 1, className, ...props },\n  ref,\n) {\n  const hasSecondLine = subtitle != null || accent != null;\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"chat-greeting\"\n      // `isolate` gives the root its own stacking context so the negative-\n      // z-index orb paints ABOVE an ancestor's own background instead of\n      // beneath it (CSS painting order step 2 vs step 3) — without it, any\n      // opaque wrapper (e.g. a `bg-background` scene container) occludes the\n      // glow entirely. See issue #254 root-cause.\n      className={cn(\"relative isolate mb-10 text-center\", className)}\n      {...props}\n    >\n      {orb ? (\n        <div\n          aria-hidden=\"true\"\n          data-slot=\"chat-greeting-orb\"\n          className=\"pointer-events-none absolute start-1/2 top-0 -z-10 size-40 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary/15 blur-3xl\"\n        />\n      ) : null}\n      <Heading data-slot=\"chat-greeting-title\" level={level} size=\"display\">\n        {title}\n        {hasSecondLine ? (\n          <>\n            <br />\n            {subtitle}\n            {subtitle != null && accent != null ? \" \" : null}\n            {accent != null ? (\n              // #399 — accent phrase inside a headline is TEXT: `-text` rung.\n              <span className=\"font-bold text-primary-text underline decoration-2 underline-offset-4\">\n                {accent}\n              </span>\n            ) : null}\n          </>\n        ) : null}\n      </Heading>\n    </div>\n  );\n});\n"],"mappings":";;;AACA,SAAS,kBAAkB;AAC3B,SAAS,IAAI,eAAkC;AAgEvC,SASE,UATF,KASE,YATF;AAnBD,IAAM,eAAe,WAA8C,SAASA,cACjF,EAAE,OAAO,UAAU,QAAQ,MAAM,MAAM,QAAQ,GAAG,WAAW,GAAG,MAAM,GACtE,KACA;AACA,QAAM,gBAAgB,YAAY,QAAQ,UAAU;AAEpD,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,aAAU;AAAA,MAMV,WAAW,GAAG,sCAAsC,SAAS;AAAA,MAC5D,GAAG;AAAA,MAEH;AAAA,cACC;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACZ,aAAU;AAAA,YACV,WAAU;AAAA;AAAA,QACZ,IACE;AAAA,QACJ,qBAAC,WAAQ,aAAU,uBAAsB,OAAc,MAAK,WACzD;AAAA;AAAA,UACA,gBACC,iCACE;AAAA,gCAAC,QAAG;AAAA,YACH;AAAA,YACA,YAAY,QAAQ,UAAU,OAAO,MAAM;AAAA,YAC3C,UAAU;AAAA;AAAA,cAET,oBAAC,UAAK,WAAU,yEACb,kBACH;AAAA,gBACE;AAAA,aACN,IACE;AAAA,WACN;AAAA;AAAA;AAAA,EACF;AAEJ,CAAC;","names":["ChatGreeting"]}

package/dist/chunk-RTCSH2AN.js

@@ -0,0 +1,331 @@
+"use client";
+
+// src/voice-selector.tsx
+import { useControllableState } from "@radix-ui/react-use-controllable-state";
+import { Button } from "@elabs-ai/components-ui";
+import {
+  Command,
+  CommandDialog,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList,
+  CommandSeparator,
+  CommandShortcut
+} from "@elabs-ai/components-ui";
+import { Dialog, DialogContent, DialogTitle, DialogTrigger } from "@elabs-ai/components-ui";
+import { Spinner } from "@elabs-ai/components-ui";
+import { cn } from "@elabs-ai/components-ui/lib/cn";
+import { useLocale } from "@elabs-ai/components-ui";
+import {
+  CircleSmallIcon,
+  MarsIcon,
+  MarsStrokeIcon,
+  NonBinaryIcon,
+  PauseIcon,
+  PlayIcon,
+  TransgenderIcon,
+  VenusAndMarsIcon,
+  VenusIcon
+} from "lucide-react";
+import { createContext, useCallback, useContext, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var VoiceSelectorContext = createContext(null);
+var useVoiceSelector = () => {
+  const context = useContext(VoiceSelectorContext);
+  if (!context) {
+    throw new Error("VoiceSelector components must be used within VoiceSelector");
+  }
+  return context;
+};
+var VoiceSelector = ({
+  value: valueProp,
+  defaultValue,
+  onValueChange,
+  open: openProp,
+  defaultOpen = false,
+  onOpenChange,
+  children,
+  ...props
+}) => {
+  const [value, setValue] = useControllableState({
+    defaultProp: defaultValue,
+    onChange: onValueChange,
+    prop: valueProp
+  });
+  const [open, setOpen] = useControllableState({
+    defaultProp: defaultOpen,
+    onChange: onOpenChange,
+    prop: openProp
+  });
+  const voiceSelectorContext = useMemo(
+    () => ({ open, setOpen, setValue, value }),
+    [value, setValue, open, setOpen]
+  );
+  return /* @__PURE__ */ jsx(VoiceSelectorContext.Provider, { value: voiceSelectorContext, children: /* @__PURE__ */ jsx(Dialog, { onOpenChange: setOpen, open, ...props, children }) });
+};
+var VoiceSelectorTrigger = (props) => /* @__PURE__ */ jsx(DialogTrigger, { ...props });
+var VoiceSelectorContent = ({
+  className,
+  children,
+  title = "Voice Selector",
+  ...props
+}) => /* @__PURE__ */ jsxs(DialogContent, { "aria-describedby": void 0, className: cn("p-0", className), ...props, children: [
+  /* @__PURE__ */ jsx(DialogTitle, { className: "sr-only", children: title }),
+  /* @__PURE__ */ jsx(Command, { className: "**:data-[slot=command-input-wrapper]:h-auto", children })
+] });
+var VoiceSelectorDialog = (props) => /* @__PURE__ */ jsx(CommandDialog, { ...props });
+var VoiceSelectorInput = ({ className, ...props }) => /* @__PURE__ */ jsx(CommandInput, { className: cn("h-auto py-3.5", className), ...props });
+var VoiceSelectorList = (props) => /* @__PURE__ */ jsx(CommandList, { ...props });
+var VoiceSelectorEmpty = (props) => /* @__PURE__ */ jsx(CommandEmpty, { ...props });
+var VoiceSelectorGroup = (props) => /* @__PURE__ */ jsx(CommandGroup, { ...props });
+var VoiceSelectorItem = ({ className, ...props }) => /* @__PURE__ */ jsx(CommandItem, { className: cn("px-4 py-2", className), ...props });
+var VoiceSelectorShortcut = (props) => /* @__PURE__ */ jsx(CommandShortcut, { ...props });
+var VoiceSelectorSeparator = (props) => /* @__PURE__ */ jsx(CommandSeparator, { ...props });
+var VoiceSelectorGender = ({
+  className,
+  value,
+  children,
+  ...props
+}) => {
+  let icon = null;
+  switch (value) {
+    case "male": {
+      icon = /* @__PURE__ */ jsx(MarsIcon, { className: "size-4" });
+      break;
+    }
+    case "female": {
+      icon = /* @__PURE__ */ jsx(VenusIcon, { className: "size-4" });
+      break;
+    }
+    case "transgender": {
+      icon = /* @__PURE__ */ jsx(TransgenderIcon, { className: "size-4" });
+      break;
+    }
+    case "androgyne": {
+      icon = /* @__PURE__ */ jsx(MarsStrokeIcon, { className: "size-4" });
+      break;
+    }
+    case "non-binary": {
+      icon = /* @__PURE__ */ jsx(NonBinaryIcon, { className: "size-4" });
+      break;
+    }
+    case "intersex": {
+      icon = /* @__PURE__ */ jsx(VenusAndMarsIcon, { className: "size-4" });
+      break;
+    }
+    default: {
+      icon = /* @__PURE__ */ jsx(CircleSmallIcon, { className: "size-4" });
+    }
+  }
+  return /* @__PURE__ */ jsx("span", { className: cn("text-muted-foreground text-meta", className), ...props, children: children ?? icon });
+};
+var VoiceSelectorAccent = ({
+  className,
+  value,
+  children,
+  ...props
+}) => {
+  let emoji = null;
+  switch (value) {
+    case "american": {
+      emoji = "\u{1F1FA}\u{1F1F8}";
+      break;
+    }
+    case "british": {
+      emoji = "\u{1F1EC}\u{1F1E7}";
+      break;
+    }
+    case "australian": {
+      emoji = "\u{1F1E6}\u{1F1FA}";
+      break;
+    }
+    case "canadian": {
+      emoji = "\u{1F1E8}\u{1F1E6}";
+      break;
+    }
+    case "irish": {
+      emoji = "\u{1F1EE}\u{1F1EA}";
+      break;
+    }
+    case "scottish": {
+      emoji = "\u{1F3F4}\u{E0067}\u{E0062}\u{E0073}\u{E0063}\u{E0074}\u{E007F}";
+      break;
+    }
+    case "indian": {
+      emoji = "\u{1F1EE}\u{1F1F3}";
+      break;
+    }
+    case "south-african": {
+      emoji = "\u{1F1FF}\u{1F1E6}";
+      break;
+    }
+    case "new-zealand": {
+      emoji = "\u{1F1F3}\u{1F1FF}";
+      break;
+    }
+    case "spanish": {
+      emoji = "\u{1F1EA}\u{1F1F8}";
+      break;
+    }
+    case "french": {
+      emoji = "\u{1F1EB}\u{1F1F7}";
+      break;
+    }
+    case "german": {
+      emoji = "\u{1F1E9}\u{1F1EA}";
+      break;
+    }
+    case "italian": {
+      emoji = "\u{1F1EE}\u{1F1F9}";
+      break;
+    }
+    case "portuguese": {
+      emoji = "\u{1F1F5}\u{1F1F9}";
+      break;
+    }
+    case "brazilian": {
+      emoji = "\u{1F1E7}\u{1F1F7}";
+      break;
+    }
+    case "mexican": {
+      emoji = "\u{1F1F2}\u{1F1FD}";
+      break;
+    }
+    case "argentinian": {
+      emoji = "\u{1F1E6}\u{1F1F7}";
+      break;
+    }
+    case "japanese": {
+      emoji = "\u{1F1EF}\u{1F1F5}";
+      break;
+    }
+    case "chinese": {
+      emoji = "\u{1F1E8}\u{1F1F3}";
+      break;
+    }
+    case "korean": {
+      emoji = "\u{1F1F0}\u{1F1F7}";
+      break;
+    }
+    case "russian": {
+      emoji = "\u{1F1F7}\u{1F1FA}";
+      break;
+    }
+    case "arabic": {
+      emoji = "\u{1F1F8}\u{1F1E6}";
+      break;
+    }
+    case "dutch": {
+      emoji = "\u{1F1F3}\u{1F1F1}";
+      break;
+    }
+    case "swedish": {
+      emoji = "\u{1F1F8}\u{1F1EA}";
+      break;
+    }
+    case "norwegian": {
+      emoji = "\u{1F1F3}\u{1F1F4}";
+      break;
+    }
+    case "danish": {
+      emoji = "\u{1F1E9}\u{1F1F0}";
+      break;
+    }
+    case "finnish": {
+      emoji = "\u{1F1EB}\u{1F1EE}";
+      break;
+    }
+    case "polish": {
+      emoji = "\u{1F1F5}\u{1F1F1}";
+      break;
+    }
+    case "turkish": {
+      emoji = "\u{1F1F9}\u{1F1F7}";
+      break;
+    }
+    case "greek": {
+      emoji = "\u{1F1EC}\u{1F1F7}";
+      break;
+    }
+    default: {
+      emoji = null;
+    }
+  }
+  return /* @__PURE__ */ jsx("span", { className: cn("text-muted-foreground text-meta", className), ...props, children: children ?? emoji });
+};
+var VoiceSelectorAge = ({ className, ...props }) => /* @__PURE__ */ jsx("span", { className: cn("text-muted-foreground text-meta tabular-nums", className), ...props });
+var VoiceSelectorName = ({ className, ...props }) => /* @__PURE__ */ jsx("span", { className: cn("flex-1 truncate text-start font-medium", className), ...props });
+var VoiceSelectorDescription = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx("span", { className: cn("text-muted-foreground text-meta", className), ...props });
+var VoiceSelectorAttributes = ({
+  className,
+  children,
+  ...props
+}) => /* @__PURE__ */ jsx("div", { className: cn("flex items-center text-meta", className), ...props, children });
+var VoiceSelectorBullet = ({ className, ...props }) => /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: cn("select-none text-border", className), ...props, children: "\u2022" });
+var VoiceSelectorPreview = ({
+  className,
+  playing,
+  loading,
+  onPlay,
+  onClick,
+  ...props
+}) => {
+  const { t } = useLocale();
+  const handleClick = useCallback(
+    (event) => {
+      event.stopPropagation();
+      onClick?.(event);
+      onPlay?.();
+    },
+    [onClick, onPlay]
+  );
+  let icon = /* @__PURE__ */ jsx(PlayIcon, { className: "size-3" });
+  if (loading) {
+    icon = /* @__PURE__ */ jsx(Spinner, { className: "size-3" });
+  } else if (playing) {
+    icon = /* @__PURE__ */ jsx(PauseIcon, { className: "size-3" });
+  }
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      "aria-label": playing ? t("ai.voiceSelector.pausePreview") : t("ai.voiceSelector.playPreview"),
+      className: cn("size-6", className),
+      disabled: loading,
+      onClick: handleClick,
+      size: "icon-sm",
+      type: "button",
+      variant: "outline",
+      ...props,
+      children: icon
+    }
+  );
+};
+
+export {
+  useVoiceSelector,
+  VoiceSelector,
+  VoiceSelectorTrigger,
+  VoiceSelectorContent,
+  VoiceSelectorDialog,
+  VoiceSelectorInput,
+  VoiceSelectorList,
+  VoiceSelectorEmpty,
+  VoiceSelectorGroup,
+  VoiceSelectorItem,
+  VoiceSelectorShortcut,
+  VoiceSelectorSeparator,
+  VoiceSelectorGender,
+  VoiceSelectorAccent,
+  VoiceSelectorAge,
+  VoiceSelectorName,
+  VoiceSelectorDescription,
+  VoiceSelectorAttributes,
+  VoiceSelectorBullet,
+  VoiceSelectorPreview
+};
+//# sourceMappingURL=chunk-RTCSH2AN.js.map

package/dist/chunk-RTCSH2AN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/voice-selector.tsx"],"sourcesContent":["\"use client\";\n\nimport { useControllableState } from \"@radix-ui/react-use-controllable-state\";\nimport { Button } from \"@elabs-ai/components-ui\";\nimport {\n  Command,\n  CommandDialog,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n  CommandShortcut,\n} from \"@elabs-ai/components-ui\";\nimport { Dialog, DialogContent, DialogTitle, DialogTrigger } from \"@elabs-ai/components-ui\";\nimport { Spinner } from \"@elabs-ai/components-ui\";\nimport { cn } from \"@elabs-ai/components-ui/lib/cn\";\nimport { useLocale } from \"@elabs-ai/components-ui\";\nimport {\n  CircleSmallIcon,\n  MarsIcon,\n  MarsStrokeIcon,\n  NonBinaryIcon,\n  PauseIcon,\n  PlayIcon,\n  TransgenderIcon,\n  VenusAndMarsIcon,\n  VenusIcon,\n} from \"lucide-react\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { createContext, useCallback, useContext, useMemo } from \"react\";\n\ninterface VoiceSelectorContextValue {\n  value: string | undefined;\n  setValue: (value: string | undefined) => void;\n  open: boolean;\n  setOpen: (open: boolean) => void;\n}\n\nconst VoiceSelectorContext = createContext<VoiceSelectorContextValue | null>(null);\n\nexport const useVoiceSelector = () => {\n  const context = useContext(VoiceSelectorContext);\n  if (!context) {\n    throw new Error(\"VoiceSelector components must be used within VoiceSelector\");\n  }\n  return context;\n};\n\nexport type VoiceSelectorProps = ComponentProps<typeof Dialog> & {\n  value?: string;\n  defaultValue?: string;\n  onValueChange?: (value: string | undefined) => void;\n};\n\nexport const VoiceSelector = ({\n  value: valueProp,\n  defaultValue,\n  onValueChange,\n  open: openProp,\n  defaultOpen = false,\n  onOpenChange,\n  children,\n  ...props\n}: VoiceSelectorProps) => {\n  const [value, setValue] = useControllableState({\n    defaultProp: defaultValue,\n    onChange: onValueChange,\n    prop: valueProp,\n  });\n\n  const [open, setOpen] = useControllableState({\n    defaultProp: defaultOpen,\n    onChange: onOpenChange,\n    prop: openProp,\n  });\n\n  const voiceSelectorContext = useMemo(\n    () => ({ open, setOpen, setValue, value }),\n    [value, setValue, open, setOpen],\n  );\n\n  return (\n    <VoiceSelectorContext.Provider value={voiceSelectorContext}>\n      <Dialog onOpenChange={setOpen} open={open} {...props}>\n        {children}\n      </Dialog>\n    </VoiceSelectorContext.Provider>\n  );\n};\n\nexport type VoiceSelectorTriggerProps = ComponentProps<typeof DialogTrigger>;\n\nexport const VoiceSelectorTrigger = (props: VoiceSelectorTriggerProps) => (\n  <DialogTrigger {...props} />\n);\n\nexport type VoiceSelectorContentProps = ComponentProps<typeof DialogContent> & {\n  title?: ReactNode;\n};\n\nexport const VoiceSelectorContent = ({\n  className,\n  children,\n  title = \"Voice Selector\",\n  ...props\n}: VoiceSelectorContentProps) => (\n  <DialogContent aria-describedby={undefined} className={cn(\"p-0\", className)} {...props}>\n    <DialogTitle className=\"sr-only\">{title}</DialogTitle>\n    <Command className=\"**:data-[slot=command-input-wrapper]:h-auto\">{children}</Command>\n  </DialogContent>\n);\n\nexport type VoiceSelectorDialogProps = ComponentProps<typeof CommandDialog>;\n\nexport const VoiceSelectorDialog = (props: VoiceSelectorDialogProps) => (\n  <CommandDialog {...props} />\n);\n\nexport type VoiceSelectorInputProps = ComponentProps<typeof CommandInput>;\n\nexport const VoiceSelectorInput = ({ className, ...props }: VoiceSelectorInputProps) => (\n  <CommandInput className={cn(\"h-auto py-3.5\", className)} {...props} />\n);\n\nexport type VoiceSelectorListProps = ComponentProps<typeof CommandList>;\n\nexport const VoiceSelectorList = (props: VoiceSelectorListProps) => <CommandList {...props} />;\n\nexport type VoiceSelectorEmptyProps = ComponentProps<typeof CommandEmpty>;\n\nexport const VoiceSelectorEmpty = (props: VoiceSelectorEmptyProps) => <CommandEmpty {...props} />;\n\nexport type VoiceSelectorGroupProps = ComponentProps<typeof CommandGroup>;\n\nexport const VoiceSelectorGroup = (props: VoiceSelectorGroupProps) => <CommandGroup {...props} />;\n\nexport type VoiceSelectorItemProps = ComponentProps<typeof CommandItem>;\n\nexport const VoiceSelectorItem = ({ className, ...props }: VoiceSelectorItemProps) => (\n  <CommandItem className={cn(\"px-4 py-2\", className)} {...props} />\n);\n\nexport type VoiceSelectorShortcutProps = ComponentProps<typeof CommandShortcut>;\n\nexport const VoiceSelectorShortcut = (props: VoiceSelectorShortcutProps) => (\n  <CommandShortcut {...props} />\n);\n\nexport type VoiceSelectorSeparatorProps = ComponentProps<typeof CommandSeparator>;\n\nexport const VoiceSelectorSeparator = (props: VoiceSelectorSeparatorProps) => (\n  <CommandSeparator {...props} />\n);\n\nexport type VoiceSelectorGenderProps = ComponentProps<\"span\"> & {\n  value?: \"male\" | \"female\" | \"transgender\" | \"androgyne\" | \"non-binary\" | \"intersex\";\n};\n\nexport const VoiceSelectorGender = ({\n  className,\n  value,\n  children,\n  ...props\n}: VoiceSelectorGenderProps) => {\n  let icon: ReactNode | null = null;\n\n  switch (value) {\n    case \"male\": {\n      icon = <MarsIcon className=\"size-4\" />;\n      break;\n    }\n    case \"female\": {\n      icon = <VenusIcon className=\"size-4\" />;\n      break;\n    }\n    case \"transgender\": {\n      icon = <TransgenderIcon className=\"size-4\" />;\n      break;\n    }\n    case \"androgyne\": {\n      icon = <MarsStrokeIcon className=\"size-4\" />;\n      break;\n    }\n    case \"non-binary\": {\n      icon = <NonBinaryIcon className=\"size-4\" />;\n      break;\n    }\n    case \"intersex\": {\n      icon = <VenusAndMarsIcon className=\"size-4\" />;\n      break;\n    }\n    default: {\n      icon = <CircleSmallIcon className=\"size-4\" />;\n    }\n  }\n\n  return (\n    <span className={cn(\"text-muted-foreground text-meta\", className)} {...props}>\n      {children ?? icon}\n    </span>\n  );\n};\n\nexport type VoiceSelectorAccentProps = ComponentProps<\"span\"> & {\n  value?:\n    | \"american\"\n    | \"british\"\n    | \"australian\"\n    | \"canadian\"\n    | \"irish\"\n    | \"scottish\"\n    | \"indian\"\n    | \"south-african\"\n    | \"new-zealand\"\n    | \"spanish\"\n    | \"french\"\n    | \"german\"\n    | \"italian\"\n    | \"portuguese\"\n    | \"brazilian\"\n    | \"mexican\"\n    | \"argentinian\"\n    | \"japanese\"\n    | \"chinese\"\n    | \"korean\"\n    | \"russian\"\n    | \"arabic\"\n    | \"dutch\"\n    | \"swedish\"\n    | \"norwegian\"\n    | \"danish\"\n    | \"finnish\"\n    | \"polish\"\n    | \"turkish\"\n    | \"greek\"\n    | string;\n};\n\nexport const VoiceSelectorAccent = ({\n  className,\n  value,\n  children,\n  ...props\n}: VoiceSelectorAccentProps) => {\n  let emoji: string | null = null;\n\n  switch (value) {\n    case \"american\": {\n      emoji = \"🇺🇸\";\n      break;\n    }\n    case \"british\": {\n      emoji = \"🇬🇧\";\n      break;\n    }\n    case \"australian\": {\n      emoji = \"🇦🇺\";\n      break;\n    }\n    case \"canadian\": {\n      emoji = \"🇨🇦\";\n      break;\n    }\n    case \"irish\": {\n      emoji = \"🇮🇪\";\n      break;\n    }\n    case \"scottish\": {\n      emoji = \"🏴󠁧󠁢󠁳󠁣󠁴󠁿\";\n      break;\n    }\n    case \"indian\": {\n      emoji = \"🇮🇳\";\n      break;\n    }\n    case \"south-african\": {\n      emoji = \"🇿🇦\";\n      break;\n    }\n    case \"new-zealand\": {\n      emoji = \"🇳🇿\";\n      break;\n    }\n    case \"spanish\": {\n      emoji = \"🇪🇸\";\n      break;\n    }\n    case \"french\": {\n      emoji = \"🇫🇷\";\n      break;\n    }\n    case \"german\": {\n      emoji = \"🇩🇪\";\n      break;\n    }\n    case \"italian\": {\n      emoji = \"🇮🇹\";\n      break;\n    }\n    case \"portuguese\": {\n      emoji = \"🇵🇹\";\n      break;\n    }\n    case \"brazilian\": {\n      emoji = \"🇧🇷\";\n      break;\n    }\n    case \"mexican\": {\n      emoji = \"🇲🇽\";\n      break;\n    }\n    case \"argentinian\": {\n      emoji = \"🇦🇷\";\n      break;\n    }\n    case \"japanese\": {\n      emoji = \"🇯🇵\";\n      break;\n    }\n    case \"chinese\": {\n      emoji = \"🇨🇳\";\n      break;\n    }\n    case \"korean\": {\n      emoji = \"🇰🇷\";\n      break;\n    }\n    case \"russian\": {\n      emoji = \"🇷🇺\";\n      break;\n    }\n    case \"arabic\": {\n      emoji = \"🇸🇦\";\n      break;\n    }\n    case \"dutch\": {\n      emoji = \"🇳🇱\";\n      break;\n    }\n    case \"swedish\": {\n      emoji = \"🇸🇪\";\n      break;\n    }\n    case \"norwegian\": {\n      emoji = \"🇳🇴\";\n      break;\n    }\n    case \"danish\": {\n      emoji = \"🇩🇰\";\n      break;\n    }\n    case \"finnish\": {\n      emoji = \"🇫🇮\";\n      break;\n    }\n    case \"polish\": {\n      emoji = \"🇵🇱\";\n      break;\n    }\n    case \"turkish\": {\n      emoji = \"🇹🇷\";\n      break;\n    }\n    case \"greek\": {\n      emoji = \"🇬🇷\";\n      break;\n    }\n    default: {\n      emoji = null;\n    }\n  }\n\n  return (\n    <span className={cn(\"text-muted-foreground text-meta\", className)} {...props}>\n      {children ?? emoji}\n    </span>\n  );\n};\n\nexport type VoiceSelectorAgeProps = ComponentProps<\"span\">;\n\nexport const VoiceSelectorAge = ({ className, ...props }: VoiceSelectorAgeProps) => (\n  <span className={cn(\"text-muted-foreground text-meta tabular-nums\", className)} {...props} />\n);\n\nexport type VoiceSelectorNameProps = ComponentProps<\"span\">;\n\nexport const VoiceSelectorName = ({ className, ...props }: VoiceSelectorNameProps) => (\n  <span className={cn(\"flex-1 truncate text-start font-medium\", className)} {...props} />\n);\n\nexport type VoiceSelectorDescriptionProps = ComponentProps<\"span\">;\n\nexport const VoiceSelectorDescription = ({\n  className,\n  ...props\n}: VoiceSelectorDescriptionProps) => (\n  <span className={cn(\"text-muted-foreground text-meta\", className)} {...props} />\n);\n\nexport type VoiceSelectorAttributesProps = ComponentProps<\"div\">;\n\nexport const VoiceSelectorAttributes = ({\n  className,\n  children,\n  ...props\n}: VoiceSelectorAttributesProps) => (\n  <div className={cn(\"flex items-center text-meta\", className)} {...props}>\n    {children}\n  </div>\n);\n\nexport type VoiceSelectorBulletProps = ComponentProps<\"span\">;\n\nexport const VoiceSelectorBullet = ({ className, ...props }: VoiceSelectorBulletProps) => (\n  <span aria-hidden=\"true\" className={cn(\"select-none text-border\", className)} {...props}>\n    &bull;\n  </span>\n);\n\nexport type VoiceSelectorPreviewProps = Omit<ComponentProps<\"button\">, \"children\"> & {\n  playing?: boolean;\n  loading?: boolean;\n  onPlay?: () => void;\n};\n\nexport const VoiceSelectorPreview = ({\n  className,\n  playing,\n  loading,\n  onPlay,\n  onClick,\n  ...props\n}: VoiceSelectorPreviewProps) => {\n  const { t } = useLocale();\n  const handleClick = useCallback(\n    (event: React.MouseEvent<HTMLButtonElement>) => {\n      event.stopPropagation();\n      onClick?.(event);\n      onPlay?.();\n    },\n    [onClick, onPlay],\n  );\n\n  let icon = <PlayIcon className=\"size-3\" />;\n\n  if (loading) {\n    icon = <Spinner className=\"size-3\" />;\n  } else if (playing) {\n    icon = <PauseIcon className=\"size-3\" />;\n  }\n\n  return (\n    <Button\n      aria-label={playing ? t(\"ai.voiceSelector.pausePreview\") : t(\"ai.voiceSelector.playPreview\")}\n      className={cn(\"size-6\", className)}\n      disabled={loading}\n      onClick={handleClick}\n      size=\"icon-sm\"\n      type=\"button\"\n      variant=\"outline\"\n      {...props}\n    >\n      {icon}\n    </Button>\n  );\n};\n"],"mappings":"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","names":[]}