@tetrascience-npm/tetrascience-react-ui 0.7.0-beta.107.1 → 0.7.0-beta.128.1

package/dist/components/ai/context.js

@@ -3,20 +3,20 @@ import { createContext as b, useMemo as S, useContext as I } from "react";
 import { Button as U } from "../ui/button.js";
 import { HoverCard as D, HoverCardContent as O, HoverCardTrigger as R } from "../ui/hover-card.js";
 import { Progress as _ } from "../ui/progress.js";
-import { cn as u } from "../../lib/utils.js";
-const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >= P ? "danger" : t >= F ? "warning" : "normal", g = {
+import { cn as l } from "../../lib/utils.js";
+const E = 100, g = 10, C = 24, m = 12, h = 2, F = 0.75, P = 0.9, N = (t) => t >= P ? "danger" : t >= F ? "warning" : "normal", p = {
   normal: "text-muted-foreground",
-  warning: "text-amber-500",
+  warning: "text-warning",
   danger: "text-destructive"
 }, H = {
   normal: "",
-  warning: "[&_[data-slot=progress-indicator]]:bg-amber-500",
+  warning: "[&_[data-slot=progress-indicator]]:bg-warning",
   danger: "[&_[data-slot=progress-indicator]]:bg-destructive"
-}, y = new Intl.NumberFormat("en-US", {
+}, w = new Intl.NumberFormat("en-US", {
   currency: "USD",
   style: "currency"
-}), d = (t) => t === void 0 ? void 0 : y.format(t), v = b(null), l = () => {
-  const t = I(v);
+}), d = (t) => t === void 0 ? void 0 : w.format(t), y = b(null), u = () => {
+  const t = I(y);
   if (!t)
     throw new Error("Context components must be used within Context");
   return t;
@@ -31,9 +31,9 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
     () => ({ cost: s, maxTokens: e, usage: o, usedTokens: t }),
     [s, e, o, t]
   );
-  return /* @__PURE__ */ n(v.Provider, { value: r, children: /* @__PURE__ */ n(D, { closeDelay: 0, openDelay: 0, ...c }) });
+  return /* @__PURE__ */ n(y.Provider, { value: r, children: /* @__PURE__ */ n(D, { closeDelay: 0, openDelay: 0, ...c }) });
 }, j = () => {
-  const { usedTokens: t, maxTokens: e } = l(), o = 2 * Math.PI * p, s = t / e, c = o * (1 - s);
+  const { usedTokens: t, maxTokens: e } = u(), o = 2 * Math.PI * g, s = t / e, c = o * (1 - s);
   return /* @__PURE__ */ i(
     "svg",
     {
@@ -41,7 +41,7 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
       height: "20",
       role: "img",
       style: { color: "currentcolor" },
-      viewBox: `0 0 ${h} ${h}`,
+      viewBox: `0 0 ${C} ${C}`,
       width: "20",
       children: [
         /* @__PURE__ */ n(
@@ -51,9 +51,9 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
             cy: m,
             fill: "none",
             opacity: "0.25",
-            r: p,
+            r: g,
             stroke: "currentColor",
-            strokeWidth: C
+            strokeWidth: h
           }
         ),
         /* @__PURE__ */ n(
@@ -63,12 +63,12 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
             cy: m,
             fill: "none",
             opacity: "0.7",
-            r: p,
+            r: g,
             stroke: "currentColor",
             strokeDasharray: `${o} ${o}`,
             strokeDashoffset: c,
             strokeLinecap: "round",
-            strokeWidth: C,
+            strokeWidth: h,
             style: { transform: "rotate(-90deg)", transformOrigin: "center" }
           }
         )
@@ -80,13 +80,13 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   showPercentage: e = !1,
   ...o
 }) => {
-  const { usedTokens: s, maxTokens: c } = l(), r = s / c, a = N(r), f = new Intl.NumberFormat("en-US", {
+  const { usedTokens: s, maxTokens: c } = u(), r = s / c, a = N(r), f = new Intl.NumberFormat("en-US", {
     maximumFractionDigits: 1,
     style: "percent"
   }).format(r);
   return /* @__PURE__ */ n(R, { asChild: !0, children: t ?? /* @__PURE__ */ i(U, { type: "button", variant: "ghost", ...o, children: [
-    e ? /* @__PURE__ */ n("span", { className: u("font-medium", g[a]), children: f }) : null,
-    /* @__PURE__ */ n("span", { className: g[a], children: /* @__PURE__ */ n(j, {}) })
+    e ? /* @__PURE__ */ n("span", { className: l("font-medium", p[a]), children: f }) : null,
+    /* @__PURE__ */ n("span", { className: p[a], children: /* @__PURE__ */ n(j, {}) })
   ] }) });
 }, G = ({
   className: t,
@@ -94,7 +94,7 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
 }) => /* @__PURE__ */ n(
   O,
   {
-    className: u("min-w-60 divide-y overflow-hidden p-0", t),
+    className: l("min-w-60 divide-y overflow-hidden p-0", t),
     ...e
   }
 ), K = ({
@@ -102,19 +102,19 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   className: e,
   ...o
 }) => {
-  const { usedTokens: s, maxTokens: c } = l(), r = s / c, a = N(r), f = new Intl.NumberFormat("en-US", {
+  const { usedTokens: s, maxTokens: c } = u(), r = s / c, a = N(r), f = new Intl.NumberFormat("en-US", {
     maximumFractionDigits: 1,
     style: "percent"
-  }).format(r), w = new Intl.NumberFormat("en-US", {
+  }).format(r), v = new Intl.NumberFormat("en-US", {
     notation: "compact"
   }).format(s), k = new Intl.NumberFormat("en-US", {
     notation: "compact"
   }).format(c);
-  return /* @__PURE__ */ n("div", { className: u("w-full space-y-2 p-3", e), ...o, children: t ?? /* @__PURE__ */ i(T, { children: [
+  return /* @__PURE__ */ n("div", { className: l("w-full space-y-2 p-3", e), ...o, children: t ?? /* @__PURE__ */ i(T, { children: [
     /* @__PURE__ */ i("div", { className: "flex items-center justify-between gap-3 text-xs", children: [
-      /* @__PURE__ */ n("p", { className: u(g[a]), children: f }),
+      /* @__PURE__ */ n("p", { className: l(p[a]), children: f }),
       /* @__PURE__ */ i("p", { className: "font-mono text-muted-foreground", children: [
-        w,
+        v,
         " / ",
         k
       ] })
@@ -122,7 +122,8 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
     /* @__PURE__ */ n("div", { className: "space-y-2", children: /* @__PURE__ */ n(
       _,
       {
-        className: u("bg-muted", H[a]),
+        "aria-label": "Context window usage",
+        className: l("bg-muted", H[a]),
         value: r * E
       }
     ) })
@@ -131,16 +132,16 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   children: t,
   className: e,
   ...o
-}) => /* @__PURE__ */ n("div", { className: u("w-full p-3", e), ...o, children: t }), z = ({
+}) => /* @__PURE__ */ n("div", { className: l("w-full p-3", e), ...o, children: t }), z = ({
   children: t,
   className: e,
   ...o
 }) => {
-  const { cost: s } = l(), c = s?.total === void 0 ? "—" : y.format(s.total);
+  const { cost: s } = u(), c = s?.total === void 0 ? "—" : w.format(s.total);
   return /* @__PURE__ */ n(
     "div",
     {
-      className: u(
+      className: l(
         "flex w-full items-center justify-between gap-3 bg-muted/50 p-3 text-xs",
         e
       ),
@@ -167,7 +168,7 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   children: e,
   ...o
 }) => {
-  const { usage: s, cost: c } = l(), r = s?.inputTokens ?? 0;
+  const { usage: s, cost: c } = u(), r = s?.inputTokens ?? 0;
   if (e)
     return e;
   if (!r)
@@ -176,7 +177,7 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   return /* @__PURE__ */ i(
     "div",
     {
-      className: u("flex items-center justify-between text-xs", t),
+      className: l("flex items-center justify-between text-xs", t),
       ...o,
       children: [
         /* @__PURE__ */ n("span", { className: "text-muted-foreground", children: "Input" }),
@@ -189,7 +190,7 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   children: e,
   ...o
 }) => {
-  const { usage: s, cost: c } = l(), r = s?.outputTokens ?? 0;
+  const { usage: s, cost: c } = u(), r = s?.outputTokens ?? 0;
   if (e)
     return e;
   if (!r)
@@ -198,7 +199,7 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   return /* @__PURE__ */ i(
     "div",
     {
-      className: u("flex items-center justify-between text-xs", t),
+      className: l("flex items-center justify-between text-xs", t),
       ...o,
       children: [
         /* @__PURE__ */ n("span", { className: "text-muted-foreground", children: "Output" }),
@@ -211,7 +212,7 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   children: e,
   ...o
 }) => {
-  const { usage: s, cost: c } = l(), r = s?.reasoningTokens ?? 0;
+  const { usage: s, cost: c } = u(), r = s?.reasoningTokens ?? 0;
   if (e)
     return e;
   if (!r)
@@ -220,7 +221,7 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   return /* @__PURE__ */ i(
     "div",
     {
-      className: u("flex items-center justify-between text-xs", t),
+      className: l("flex items-center justify-between text-xs", t),
       ...o,
       children: [
         /* @__PURE__ */ n("span", { className: "text-muted-foreground", children: "Reasoning" }),
@@ -233,7 +234,7 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   children: e,
   ...o
 }) => {
-  const { usage: s, cost: c } = l(), r = s?.cachedInputTokens ?? 0;
+  const { usage: s, cost: c } = u(), r = s?.cachedInputTokens ?? 0;
   if (e)
     return e;
   if (!r)
@@ -242,7 +243,7 @@ const E = 100, p = 10, h = 24, m = 12, C = 2, F = 0.75, P = 0.9, N = (t) => t >=
   return /* @__PURE__ */ i(
     "div",
     {
-      className: u("flex items-center justify-between text-xs", t),
+      className: l("flex items-center justify-between text-xs", t),
       ...o,
       children: [
         /* @__PURE__ */ n("span", { className: "text-muted-foreground", children: "Cache" }),

package/dist/components/ai/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","sources":["../../../src/components/ai/context.tsx"],"sourcesContent":["import { createContext, useContext, useMemo } from \"react\";\n\nimport type { LanguageModelUsage } from \"ai\";\nimport type { ComponentProps } from \"react\";\n\nimport { Button } from \"@/components/ui/button\";\nimport {\n  HoverCard,\n  HoverCardContent,\n  HoverCardTrigger,\n} from \"@/components/ui/hover-card\";\nimport { Progress } from \"@/components/ui/progress\";\nimport { cn } from \"@/lib/utils\";\n\n\nconst PERCENT_MAX = 100;\nconst ICON_RADIUS = 10;\nconst ICON_VIEWBOX = 24;\nconst ICON_CENTER = 12;\nconst ICON_STROKE_WIDTH = 2;\nconst WARN_THRESHOLD = 0.75;\nconst DANGER_THRESHOLD = 0.9;\n\ntype UsageStatus = \"normal\" | \"warning\" | \"danger\";\n\nconst getUsageStatus = (pct: number): UsageStatus => {\n  if (pct >= DANGER_THRESHOLD) return \"danger\";\n  if (pct >= WARN_THRESHOLD) return \"warning\";\n  return \"normal\";\n};\n\nconst STATUS_TEXT: Record<UsageStatus, string> = {\n  normal: \"text-muted-foreground\",\n  warning: \"text-amber-500\",\n  danger: \"text-destructive\",\n};\n\nconst STATUS_PROGRESS: Record<UsageStatus, string> = {\n  normal: \"\",\n  warning: \"[&_[data-slot=progress-indicator]]:bg-amber-500\",\n  danger: \"[&_[data-slot=progress-indicator]]:bg-destructive\",\n};\n\nconst USD_FORMAT = new Intl.NumberFormat(\"en-US\", {\n  currency: \"USD\",\n  style: \"currency\",\n});\n\nconst formatUSD = (value: number | undefined): string | undefined =>\n  value === undefined ? undefined : USD_FORMAT.format(value);\n\nexport interface CostBreakdown {\n  total?: number;\n  input?: number;\n  output?: number;\n  reasoning?: number;\n  cache?: number;\n}\n\ninterface ContextSchema {\n  usedTokens: number;\n  maxTokens: number;\n  usage?: LanguageModelUsage;\n  cost?: CostBreakdown;\n}\n\nconst ContextContext = createContext<ContextSchema | null>(null);\n\nconst useContextValue = () => {\n  const context = useContext(ContextContext);\n\n  if (!context) {\n    throw new Error(\"Context components must be used within Context\");\n  }\n\n  return context;\n};\n\nexport type ContextProps = ComponentProps<typeof HoverCard> & ContextSchema;\n\nexport const Context = ({\n  usedTokens,\n  maxTokens,\n  usage,\n  cost,\n  ...props\n}: ContextProps) => {\n  const contextValue = useMemo(\n    () => ({ cost, maxTokens, usage, usedTokens }),\n    [cost, maxTokens, usage, usedTokens]\n  );\n\n  return (\n    <ContextContext.Provider value={contextValue}>\n      <HoverCard closeDelay={0} openDelay={0} {...props} />\n    </ContextContext.Provider>\n  );\n};\n\nconst ContextIcon = () => {\n  const { usedTokens, maxTokens } = useContextValue();\n  const circumference = 2 * Math.PI * ICON_RADIUS;\n  const usedPercent = usedTokens / maxTokens;\n  const dashOffset = circumference * (1 - usedPercent);\n\n  return (\n    <svg\n      aria-label=\"Model context usage\"\n      height=\"20\"\n      role=\"img\"\n      style={{ color: \"currentcolor\" }}\n      viewBox={`0 0 ${ICON_VIEWBOX} ${ICON_VIEWBOX}`}\n      width=\"20\"\n    >\n      <circle\n        cx={ICON_CENTER}\n        cy={ICON_CENTER}\n        fill=\"none\"\n        opacity=\"0.25\"\n        r={ICON_RADIUS}\n        stroke=\"currentColor\"\n        strokeWidth={ICON_STROKE_WIDTH}\n      />\n      <circle\n        cx={ICON_CENTER}\n        cy={ICON_CENTER}\n        fill=\"none\"\n        opacity=\"0.7\"\n        r={ICON_RADIUS}\n        stroke=\"currentColor\"\n        strokeDasharray={`${circumference} ${circumference}`}\n        strokeDashoffset={dashOffset}\n        strokeLinecap=\"round\"\n        strokeWidth={ICON_STROKE_WIDTH}\n        style={{ transform: \"rotate(-90deg)\", transformOrigin: \"center\" }}\n      />\n    </svg>\n  );\n};\n\nexport type ContextTriggerProps = ComponentProps<typeof Button> & {\n  showPercentage?: boolean;\n};\n\nexport const ContextTrigger = ({\n  children,\n  showPercentage = false,\n  ...props\n}: ContextTriggerProps) => {\n  const { usedTokens, maxTokens } = useContextValue();\n  const usedPercent = usedTokens / maxTokens;\n  const status = getUsageStatus(usedPercent);\n  const renderedPercent = new Intl.NumberFormat(\"en-US\", {\n    maximumFractionDigits: 1,\n    style: \"percent\",\n  }).format(usedPercent);\n\n  return (\n    <HoverCardTrigger asChild>\n      {children ?? (\n        <Button type=\"button\" variant=\"ghost\" {...props}>\n          {showPercentage ? (\n            <span className={cn(\"font-medium\", STATUS_TEXT[status])}>\n              {renderedPercent}\n            </span>\n          ) : null}\n          <span className={STATUS_TEXT[status]}>\n            <ContextIcon />\n          </span>\n        </Button>\n      )}\n    </HoverCardTrigger>\n  );\n};\n\nexport type ContextContentProps = ComponentProps<typeof HoverCardContent>;\n\nexport const ContextContent = ({\n  className,\n  ...props\n}: ContextContentProps) => (\n  <HoverCardContent\n    className={cn(\"min-w-60 divide-y overflow-hidden p-0\", className)}\n    {...props}\n  />\n);\n\nexport type ContextContentHeaderProps = ComponentProps<\"div\">;\n\nexport const ContextContentHeader = ({\n  children,\n  className,\n  ...props\n}: ContextContentHeaderProps) => {\n  const { usedTokens, maxTokens } = useContextValue();\n  const usedPercent = usedTokens / maxTokens;\n  const status = getUsageStatus(usedPercent);\n  const displayPct = new Intl.NumberFormat(\"en-US\", {\n    maximumFractionDigits: 1,\n    style: \"percent\",\n  }).format(usedPercent);\n  const used = new Intl.NumberFormat(\"en-US\", {\n    notation: \"compact\",\n  }).format(usedTokens);\n  const total = new Intl.NumberFormat(\"en-US\", {\n    notation: \"compact\",\n  }).format(maxTokens);\n\n  return (\n    <div className={cn(\"w-full space-y-2 p-3\", className)} {...props}>\n      {children ?? (\n        <>\n          <div className=\"flex items-center justify-between gap-3 text-xs\">\n            <p className={cn(STATUS_TEXT[status])}>{displayPct}</p>\n            <p className=\"font-mono text-muted-foreground\">\n              {used} / {total}\n            </p>\n          </div>\n          <div className=\"space-y-2\">\n            <Progress\n              className={cn(\"bg-muted\", STATUS_PROGRESS[status])}\n              value={usedPercent * PERCENT_MAX}\n            />\n          </div>\n        </>\n      )}\n    </div>\n  );\n};\n\nexport type ContextContentBodyProps = ComponentProps<\"div\">;\n\nexport const ContextContentBody = ({\n  children,\n  className,\n  ...props\n}: ContextContentBodyProps) => (\n  <div className={cn(\"w-full p-3\", className)} {...props}>\n    {children}\n  </div>\n);\n\nexport type ContextContentFooterProps = ComponentProps<\"div\">;\n\nexport const ContextContentFooter = ({\n  children,\n  className,\n  ...props\n}: ContextContentFooterProps) => {\n  const { cost } = useContextValue();\n  const totalCost = cost?.total === undefined ? \"—\" : USD_FORMAT.format(cost.total);\n\n  return (\n    <div\n      className={cn(\n        \"flex w-full items-center justify-between gap-3 bg-muted/50 p-3 text-xs\",\n        className\n      )}\n      {...props}\n    >\n      {children ?? (\n        <>\n          <span className=\"text-muted-foreground\">Total cost</span>\n          <span>{totalCost}</span>\n        </>\n      )}\n    </div>\n  );\n};\n\nconst TokensWithCost = ({\n  tokens,\n  costText,\n}: {\n  tokens?: number;\n  costText?: string;\n}) => (\n  <span>\n    {tokens === undefined\n      ? \"—\"\n      : new Intl.NumberFormat(\"en-US\", {\n          notation: \"compact\",\n        }).format(tokens)}\n    {costText ? (\n      <span className=\"ml-2 text-muted-foreground\">• {costText}</span>\n    ) : null}\n  </span>\n);\n\nexport type ContextInputUsageProps = ComponentProps<\"div\">;\n\nexport const ContextInputUsage = ({\n  className,\n  children,\n  ...props\n}: ContextInputUsageProps) => {\n  const { usage, cost } = useContextValue();\n  const inputTokens = usage?.inputTokens ?? 0;\n\n  if (children) {\n    return children;\n  }\n\n  if (!inputTokens) {\n    return null;\n  }\n\n  const inputCostText = formatUSD(cost?.input);\n\n  return (\n    <div\n      className={cn(\"flex items-center justify-between text-xs\", className)}\n      {...props}\n    >\n      <span className=\"text-muted-foreground\">Input</span>\n      <TokensWithCost costText={inputCostText} tokens={inputTokens} />\n    </div>\n  );\n};\n\nexport type ContextOutputUsageProps = ComponentProps<\"div\">;\n\nexport const ContextOutputUsage = ({\n  className,\n  children,\n  ...props\n}: ContextOutputUsageProps) => {\n  const { usage, cost } = useContextValue();\n  const outputTokens = usage?.outputTokens ?? 0;\n\n  if (children) {\n    return children;\n  }\n\n  if (!outputTokens) {\n    return null;\n  }\n\n  const outputCostText = formatUSD(cost?.output);\n\n  return (\n    <div\n      className={cn(\"flex items-center justify-between text-xs\", className)}\n      {...props}\n    >\n      <span className=\"text-muted-foreground\">Output</span>\n      <TokensWithCost costText={outputCostText} tokens={outputTokens} />\n    </div>\n  );\n};\n\nexport type ContextReasoningUsageProps = ComponentProps<\"div\">;\n\nexport const ContextReasoningUsage = ({\n  className,\n  children,\n  ...props\n}: ContextReasoningUsageProps) => {\n  const { usage, cost } = useContextValue();\n  const reasoningTokens = usage?.reasoningTokens ?? 0;\n\n  if (children) {\n    return children;\n  }\n\n  if (!reasoningTokens) {\n    return null;\n  }\n\n  const reasoningCostText = formatUSD(cost?.reasoning);\n\n  return (\n    <div\n      className={cn(\"flex items-center justify-between text-xs\", className)}\n      {...props}\n    >\n      <span className=\"text-muted-foreground\">Reasoning</span>\n      <TokensWithCost costText={reasoningCostText} tokens={reasoningTokens} />\n    </div>\n  );\n};\n\nexport type ContextCacheUsageProps = ComponentProps<\"div\">;\n\nexport const ContextCacheUsage = ({\n  className,\n  children,\n  ...props\n}: ContextCacheUsageProps) => {\n  const { usage, cost } = useContextValue();\n  const cacheTokens = usage?.cachedInputTokens ?? 0;\n\n  if (children) {\n    return children;\n  }\n\n  if (!cacheTokens) {\n    return null;\n  }\n\n  const cacheCostText = formatUSD(cost?.cache);\n\n  return (\n    <div\n      className={cn(\"flex items-center justify-between text-xs\", className)}\n      {...props}\n    >\n      <span className=\"text-muted-foreground\">Cache</span>\n      <TokensWithCost costText={cacheCostText} tokens={cacheTokens} />\n    </div>\n  );\n};\n"],"names":["PERCENT_MAX","ICON_RADIUS","ICON_VIEWBOX","ICON_CENTER","ICON_STROKE_WIDTH","WARN_THRESHOLD","DANGER_THRESHOLD","getUsageStatus","pct","STATUS_TEXT","STATUS_PROGRESS","USD_FORMAT","formatUSD","value","ContextContext","createContext","useContextValue","context","useContext","Context","usedTokens","maxTokens","usage","cost","props","contextValue","useMemo","jsx","HoverCard","ContextIcon","circumference","usedPercent","dashOffset","jsxs","ContextTrigger","children","showPercentage","status","renderedPercent","HoverCardTrigger","Button","cn","ContextContent","className","HoverCardContent","ContextContentHeader","displayPct","used","total","Fragment","Progress","ContextContentBody","ContextContentFooter","totalCost","TokensWithCost","tokens","costText","ContextInputUsage","inputTokens","inputCostText","ContextOutputUsage","outputTokens","outputCostText","ContextReasoningUsage","reasoningTokens","reasoningCostText","ContextCacheUsage","cacheTokens","cacheCostText"],"mappings":"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"}
+{"version":3,"file":"context.js","sources":["../../../src/components/ai/context.tsx"],"sourcesContent":["import { createContext, useContext, useMemo } from \"react\";\n\nimport type { LanguageModelUsage } from \"ai\";\nimport type { ComponentProps } from \"react\";\n\nimport { Button } from \"@/components/ui/button\";\nimport {\n  HoverCard,\n  HoverCardContent,\n  HoverCardTrigger,\n} from \"@/components/ui/hover-card\";\nimport { Progress } from \"@/components/ui/progress\";\nimport { cn } from \"@/lib/utils\";\n\n\nconst PERCENT_MAX = 100;\nconst ICON_RADIUS = 10;\nconst ICON_VIEWBOX = 24;\nconst ICON_CENTER = 12;\nconst ICON_STROKE_WIDTH = 2;\nconst WARN_THRESHOLD = 0.75;\nconst DANGER_THRESHOLD = 0.9;\n\ntype UsageStatus = \"normal\" | \"warning\" | \"danger\";\n\nconst getUsageStatus = (pct: number): UsageStatus => {\n  if (pct >= DANGER_THRESHOLD) return \"danger\";\n  if (pct >= WARN_THRESHOLD) return \"warning\";\n  return \"normal\";\n};\n\nconst STATUS_TEXT: Record<UsageStatus, string> = {\n  normal: \"text-muted-foreground\",\n  warning: \"text-warning\",\n  danger: \"text-destructive\",\n};\n\nconst STATUS_PROGRESS: Record<UsageStatus, string> = {\n  normal: \"\",\n  warning: \"[&_[data-slot=progress-indicator]]:bg-warning\",\n  danger: \"[&_[data-slot=progress-indicator]]:bg-destructive\",\n};\n\nconst USD_FORMAT = new Intl.NumberFormat(\"en-US\", {\n  currency: \"USD\",\n  style: \"currency\",\n});\n\nconst formatUSD = (value: number | undefined): string | undefined =>\n  value === undefined ? undefined : USD_FORMAT.format(value);\n\nexport interface CostBreakdown {\n  total?: number;\n  input?: number;\n  output?: number;\n  reasoning?: number;\n  cache?: number;\n}\n\ninterface ContextSchema {\n  usedTokens: number;\n  maxTokens: number;\n  usage?: LanguageModelUsage;\n  cost?: CostBreakdown;\n}\n\nconst ContextContext = createContext<ContextSchema | null>(null);\n\nconst useContextValue = () => {\n  const context = useContext(ContextContext);\n\n  if (!context) {\n    throw new Error(\"Context components must be used within Context\");\n  }\n\n  return context;\n};\n\nexport type ContextProps = ComponentProps<typeof HoverCard> & ContextSchema;\n\nexport const Context = ({\n  usedTokens,\n  maxTokens,\n  usage,\n  cost,\n  ...props\n}: ContextProps) => {\n  const contextValue = useMemo(\n    () => ({ cost, maxTokens, usage, usedTokens }),\n    [cost, maxTokens, usage, usedTokens]\n  );\n\n  return (\n    <ContextContext.Provider value={contextValue}>\n      <HoverCard closeDelay={0} openDelay={0} {...props} />\n    </ContextContext.Provider>\n  );\n};\n\nconst ContextIcon = () => {\n  const { usedTokens, maxTokens } = useContextValue();\n  const circumference = 2 * Math.PI * ICON_RADIUS;\n  const usedPercent = usedTokens / maxTokens;\n  const dashOffset = circumference * (1 - usedPercent);\n\n  return (\n    <svg\n      aria-label=\"Model context usage\"\n      height=\"20\"\n      role=\"img\"\n      style={{ color: \"currentcolor\" }}\n      viewBox={`0 0 ${ICON_VIEWBOX} ${ICON_VIEWBOX}`}\n      width=\"20\"\n    >\n      <circle\n        cx={ICON_CENTER}\n        cy={ICON_CENTER}\n        fill=\"none\"\n        opacity=\"0.25\"\n        r={ICON_RADIUS}\n        stroke=\"currentColor\"\n        strokeWidth={ICON_STROKE_WIDTH}\n      />\n      <circle\n        cx={ICON_CENTER}\n        cy={ICON_CENTER}\n        fill=\"none\"\n        opacity=\"0.7\"\n        r={ICON_RADIUS}\n        stroke=\"currentColor\"\n        strokeDasharray={`${circumference} ${circumference}`}\n        strokeDashoffset={dashOffset}\n        strokeLinecap=\"round\"\n        strokeWidth={ICON_STROKE_WIDTH}\n        style={{ transform: \"rotate(-90deg)\", transformOrigin: \"center\" }}\n      />\n    </svg>\n  );\n};\n\nexport type ContextTriggerProps = ComponentProps<typeof Button> & {\n  showPercentage?: boolean;\n};\n\nexport const ContextTrigger = ({\n  children,\n  showPercentage = false,\n  ...props\n}: ContextTriggerProps) => {\n  const { usedTokens, maxTokens } = useContextValue();\n  const usedPercent = usedTokens / maxTokens;\n  const status = getUsageStatus(usedPercent);\n  const renderedPercent = new Intl.NumberFormat(\"en-US\", {\n    maximumFractionDigits: 1,\n    style: \"percent\",\n  }).format(usedPercent);\n\n  return (\n    <HoverCardTrigger asChild>\n      {children ?? (\n        <Button type=\"button\" variant=\"ghost\" {...props}>\n          {showPercentage ? (\n            <span className={cn(\"font-medium\", STATUS_TEXT[status])}>\n              {renderedPercent}\n            </span>\n          ) : null}\n          <span className={STATUS_TEXT[status]}>\n            <ContextIcon />\n          </span>\n        </Button>\n      )}\n    </HoverCardTrigger>\n  );\n};\n\nexport type ContextContentProps = ComponentProps<typeof HoverCardContent>;\n\nexport const ContextContent = ({\n  className,\n  ...props\n}: ContextContentProps) => (\n  <HoverCardContent\n    className={cn(\"min-w-60 divide-y overflow-hidden p-0\", className)}\n    {...props}\n  />\n);\n\nexport type ContextContentHeaderProps = ComponentProps<\"div\">;\n\nexport const ContextContentHeader = ({\n  children,\n  className,\n  ...props\n}: ContextContentHeaderProps) => {\n  const { usedTokens, maxTokens } = useContextValue();\n  const usedPercent = usedTokens / maxTokens;\n  const status = getUsageStatus(usedPercent);\n  const displayPct = new Intl.NumberFormat(\"en-US\", {\n    maximumFractionDigits: 1,\n    style: \"percent\",\n  }).format(usedPercent);\n  const used = new Intl.NumberFormat(\"en-US\", {\n    notation: \"compact\",\n  }).format(usedTokens);\n  const total = new Intl.NumberFormat(\"en-US\", {\n    notation: \"compact\",\n  }).format(maxTokens);\n\n  return (\n    <div className={cn(\"w-full space-y-2 p-3\", className)} {...props}>\n      {children ?? (\n        <>\n          <div className=\"flex items-center justify-between gap-3 text-xs\">\n            <p className={cn(STATUS_TEXT[status])}>{displayPct}</p>\n            <p className=\"font-mono text-muted-foreground\">\n              {used} / {total}\n            </p>\n          </div>\n          <div className=\"space-y-2\">\n            <Progress\n              aria-label=\"Context window usage\"\n              className={cn(\"bg-muted\", STATUS_PROGRESS[status])}\n              value={usedPercent * PERCENT_MAX}\n            />\n          </div>\n        </>\n      )}\n    </div>\n  );\n};\n\nexport type ContextContentBodyProps = ComponentProps<\"div\">;\n\nexport const ContextContentBody = ({\n  children,\n  className,\n  ...props\n}: ContextContentBodyProps) => (\n  <div className={cn(\"w-full p-3\", className)} {...props}>\n    {children}\n  </div>\n);\n\nexport type ContextContentFooterProps = ComponentProps<\"div\">;\n\nexport const ContextContentFooter = ({\n  children,\n  className,\n  ...props\n}: ContextContentFooterProps) => {\n  const { cost } = useContextValue();\n  const totalCost = cost?.total === undefined ? \"—\" : USD_FORMAT.format(cost.total);\n\n  return (\n    <div\n      className={cn(\n        \"flex w-full items-center justify-between gap-3 bg-muted/50 p-3 text-xs\",\n        className\n      )}\n      {...props}\n    >\n      {children ?? (\n        <>\n          <span className=\"text-muted-foreground\">Total cost</span>\n          <span>{totalCost}</span>\n        </>\n      )}\n    </div>\n  );\n};\n\nconst TokensWithCost = ({\n  tokens,\n  costText,\n}: {\n  tokens?: number;\n  costText?: string;\n}) => (\n  <span>\n    {tokens === undefined\n      ? \"—\"\n      : new Intl.NumberFormat(\"en-US\", {\n          notation: \"compact\",\n        }).format(tokens)}\n    {costText ? (\n      <span className=\"ml-2 text-muted-foreground\">• {costText}</span>\n    ) : null}\n  </span>\n);\n\nexport type ContextInputUsageProps = ComponentProps<\"div\">;\n\nexport const ContextInputUsage = ({\n  className,\n  children,\n  ...props\n}: ContextInputUsageProps) => {\n  const { usage, cost } = useContextValue();\n  const inputTokens = usage?.inputTokens ?? 0;\n\n  if (children) {\n    return children;\n  }\n\n  if (!inputTokens) {\n    return null;\n  }\n\n  const inputCostText = formatUSD(cost?.input);\n\n  return (\n    <div\n      className={cn(\"flex items-center justify-between text-xs\", className)}\n      {...props}\n    >\n      <span className=\"text-muted-foreground\">Input</span>\n      <TokensWithCost costText={inputCostText} tokens={inputTokens} />\n    </div>\n  );\n};\n\nexport type ContextOutputUsageProps = ComponentProps<\"div\">;\n\nexport const ContextOutputUsage = ({\n  className,\n  children,\n  ...props\n}: ContextOutputUsageProps) => {\n  const { usage, cost } = useContextValue();\n  const outputTokens = usage?.outputTokens ?? 0;\n\n  if (children) {\n    return children;\n  }\n\n  if (!outputTokens) {\n    return null;\n  }\n\n  const outputCostText = formatUSD(cost?.output);\n\n  return (\n    <div\n      className={cn(\"flex items-center justify-between text-xs\", className)}\n      {...props}\n    >\n      <span className=\"text-muted-foreground\">Output</span>\n      <TokensWithCost costText={outputCostText} tokens={outputTokens} />\n    </div>\n  );\n};\n\nexport type ContextReasoningUsageProps = ComponentProps<\"div\">;\n\nexport const ContextReasoningUsage = ({\n  className,\n  children,\n  ...props\n}: ContextReasoningUsageProps) => {\n  const { usage, cost } = useContextValue();\n  const reasoningTokens = usage?.reasoningTokens ?? 0;\n\n  if (children) {\n    return children;\n  }\n\n  if (!reasoningTokens) {\n    return null;\n  }\n\n  const reasoningCostText = formatUSD(cost?.reasoning);\n\n  return (\n    <div\n      className={cn(\"flex items-center justify-between text-xs\", className)}\n      {...props}\n    >\n      <span className=\"text-muted-foreground\">Reasoning</span>\n      <TokensWithCost costText={reasoningCostText} tokens={reasoningTokens} />\n    </div>\n  );\n};\n\nexport type ContextCacheUsageProps = ComponentProps<\"div\">;\n\nexport const ContextCacheUsage = ({\n  className,\n  children,\n  ...props\n}: ContextCacheUsageProps) => {\n  const { usage, cost } = useContextValue();\n  const cacheTokens = usage?.cachedInputTokens ?? 0;\n\n  if (children) {\n    return children;\n  }\n\n  if (!cacheTokens) {\n    return null;\n  }\n\n  const cacheCostText = formatUSD(cost?.cache);\n\n  return (\n    <div\n      className={cn(\"flex items-center justify-between text-xs\", className)}\n      {...props}\n    >\n      <span className=\"text-muted-foreground\">Cache</span>\n      <TokensWithCost costText={cacheCostText} tokens={cacheTokens} />\n    </div>\n  );\n};\n"],"names":["PERCENT_MAX","ICON_RADIUS","ICON_VIEWBOX","ICON_CENTER","ICON_STROKE_WIDTH","WARN_THRESHOLD","DANGER_THRESHOLD","getUsageStatus","pct","STATUS_TEXT","STATUS_PROGRESS","USD_FORMAT","formatUSD","value","ContextContext","createContext","useContextValue","context","useContext","Context","usedTokens","maxTokens","usage","cost","props","contextValue","useMemo","jsx","HoverCard","ContextIcon","circumference","usedPercent","dashOffset","jsxs","ContextTrigger","children","showPercentage","status","renderedPercent","HoverCardTrigger","Button","cn","ContextContent","className","HoverCardContent","ContextContentHeader","displayPct","used","total","Fragment","Progress","ContextContentBody","ContextContentFooter","totalCost","TokensWithCost","tokens","costText","ContextInputUsage","inputTokens","inputCostText","ContextOutputUsage","outputTokens","outputCostText","ContextReasoningUsage","reasoningTokens","reasoningCostText","ContextCacheUsage","cacheTokens","cacheCostText"],"mappings":";;;;;;AAeA,MAAMA,IAAc,KACdC,IAAc,IACdC,IAAe,IACfC,IAAc,IACdC,IAAoB,GACpBC,IAAiB,MACjBC,IAAmB,KAInBC,IAAiB,CAACC,MAClBA,KAAOF,IAAyB,WAChCE,KAAOH,IAAuB,YAC3B,UAGHI,IAA2C;AAAA,EAC/C,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AACV,GAEMC,IAA+C;AAAA,EACnD,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AACV,GAEMC,IAAa,IAAI,KAAK,aAAa,SAAS;AAAA,EAChD,UAAU;AAAA,EACV,OAAO;AACT,CAAC,GAEKC,IAAY,CAACC,MACjBA,MAAU,SAAY,SAAYF,EAAW,OAAOE,CAAK,GAiBrDC,IAAiBC,EAAoC,IAAI,GAEzDC,IAAkB,MAAM;AAC5B,QAAMC,IAAUC,EAAWJ,CAAc;AAEzC,MAAI,CAACG;AACH,UAAM,IAAI,MAAM,gDAAgD;AAGlE,SAAOA;AACT,GAIaE,IAAU,CAAC;AAAA,EACtB,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,GAAGC;AACL,MAAoB;AAClB,QAAMC,IAAeC;AAAA,IACnB,OAAO,EAAE,MAAAH,GAAM,WAAAF,GAAW,OAAAC,GAAO,YAAAF,EAAA;AAAA,IACjC,CAACG,GAAMF,GAAWC,GAAOF,CAAU;AAAA,EAAA;AAGrC,SACE,gBAAAO,EAACb,EAAe,UAAf,EAAwB,OAAOW,GAC9B,UAAA,gBAAAE,EAACC,GAAA,EAAU,YAAY,GAAG,WAAW,GAAI,GAAGJ,GAAO,GACrD;AAEJ,GAEMK,IAAc,MAAM;AACxB,QAAM,EAAE,YAAAT,GAAY,WAAAC,EAAA,IAAcL,EAAA,GAC5Bc,IAAgB,IAAI,KAAK,KAAK7B,GAC9B8B,IAAcX,IAAaC,GAC3BW,IAAaF,KAAiB,IAAIC;AAExC,SACE,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,cAAW;AAAA,MACX,QAAO;AAAA,MACP,MAAK;AAAA,MACL,OAAO,EAAE,OAAO,eAAA;AAAA,MAChB,SAAS,OAAO/B,CAAY,IAAIA,CAAY;AAAA,MAC5C,OAAM;AAAA,MAEN,UAAA;AAAA,QAAA,gBAAAyB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAIxB;AAAA,YACJ,IAAIA;AAAA,YACJ,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,GAAGF;AAAA,YACH,QAAO;AAAA,YACP,aAAaG;AAAA,UAAA;AAAA,QAAA;AAAA,QAEf,gBAAAuB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAIxB;AAAA,YACJ,IAAIA;AAAA,YACJ,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,GAAGF;AAAA,YACH,QAAO;AAAA,YACP,iBAAiB,GAAG6B,CAAa,IAAIA,CAAa;AAAA,YAClD,kBAAkBE;AAAA,YAClB,eAAc;AAAA,YACd,aAAa5B;AAAA,YACb,OAAO,EAAE,WAAW,kBAAkB,iBAAiB,SAAA;AAAA,UAAS;AAAA,QAAA;AAAA,MAClE;AAAA,IAAA;AAAA,EAAA;AAGN,GAMa8B,IAAiB,CAAC;AAAA,EAC7B,UAAAC;AAAA,EACA,gBAAAC,IAAiB;AAAA,EACjB,GAAGZ;AACL,MAA2B;AACzB,QAAM,EAAE,YAAAJ,GAAY,WAAAC,EAAA,IAAcL,EAAA,GAC5Be,IAAcX,IAAaC,GAC3BgB,IAAS9B,EAAewB,CAAW,GACnCO,IAAkB,IAAI,KAAK,aAAa,SAAS;AAAA,IACrD,uBAAuB;AAAA,IACvB,OAAO;AAAA,EAAA,CACR,EAAE,OAAOP,CAAW;AAErB,SACE,gBAAAJ,EAACY,GAAA,EAAiB,SAAO,IACtB,UAAAJ,KACC,gBAAAF,EAACO,GAAA,EAAO,MAAK,UAAS,SAAQ,SAAS,GAAGhB,GACvC,UAAA;AAAA,IAAAY,IACC,gBAAAT,EAAC,QAAA,EAAK,WAAWc,EAAG,eAAehC,EAAY4B,CAAM,CAAC,GACnD,UAAAC,EAAA,CACH,IACE;AAAA,IACJ,gBAAAX,EAAC,UAAK,WAAWlB,EAAY4B,CAAM,GACjC,UAAA,gBAAAV,EAACE,KAAY,EAAA,CACf;AAAA,EAAA,EAAA,CACF,EAAA,CAEJ;AAEJ,GAIaa,IAAiB,CAAC;AAAA,EAC7B,WAAAC;AAAA,EACA,GAAGnB;AACL,MACE,gBAAAG;AAAA,EAACiB;AAAA,EAAA;AAAA,IACC,WAAWH,EAAG,yCAAyCE,CAAS;AAAA,IAC/D,GAAGnB;AAAA,EAAA;AACN,GAKWqB,IAAuB,CAAC;AAAA,EACnC,UAAAV;AAAA,EACA,WAAAQ;AAAA,EACA,GAAGnB;AACL,MAAiC;AAC/B,QAAM,EAAE,YAAAJ,GAAY,WAAAC,EAAA,IAAcL,EAAA,GAC5Be,IAAcX,IAAaC,GAC3BgB,IAAS9B,EAAewB,CAAW,GACnCe,IAAa,IAAI,KAAK,aAAa,SAAS;AAAA,IAChD,uBAAuB;AAAA,IACvB,OAAO;AAAA,EAAA,CACR,EAAE,OAAOf,CAAW,GACfgB,IAAO,IAAI,KAAK,aAAa,SAAS;AAAA,IAC1C,UAAU;AAAA,EAAA,CACX,EAAE,OAAO3B,CAAU,GACd4B,IAAQ,IAAI,KAAK,aAAa,SAAS;AAAA,IAC3C,UAAU;AAAA,EAAA,CACX,EAAE,OAAO3B,CAAS;AAEnB,SACE,gBAAAM,EAAC,OAAA,EAAI,WAAWc,EAAG,wBAAwBE,CAAS,GAAI,GAAGnB,GACxD,UAAAW,KACC,gBAAAF,EAAAgB,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAhB,EAAC,OAAA,EAAI,WAAU,mDACb,UAAA;AAAA,MAAA,gBAAAN,EAAC,OAAE,WAAWc,EAAGhC,EAAY4B,CAAM,CAAC,GAAI,UAAAS,GAAW;AAAA,MACnD,gBAAAb,EAAC,KAAA,EAAE,WAAU,mCACV,UAAA;AAAA,QAAAc;AAAA,QAAK;AAAA,QAAIC;AAAA,MAAA,EAAA,CACZ;AAAA,IAAA,GACF;AAAA,IACA,gBAAArB,EAAC,OAAA,EAAI,WAAU,aACb,UAAA,gBAAAA;AAAA,MAACuB;AAAA,MAAA;AAAA,QACC,cAAW;AAAA,QACX,WAAWT,EAAG,YAAY/B,EAAgB2B,CAAM,CAAC;AAAA,QACjD,OAAON,IAAc/B;AAAA,MAAA;AAAA,IAAA,EACvB,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CAEJ;AAEJ,GAIamD,IAAqB,CAAC;AAAA,EACjC,UAAAhB;AAAA,EACA,WAAAQ;AAAA,EACA,GAAGnB;AACL,MACE,gBAAAG,EAAC,SAAI,WAAWc,EAAG,cAAcE,CAAS,GAAI,GAAGnB,GAC9C,UAAAW,EAAA,CACH,GAKWiB,IAAuB,CAAC;AAAA,EACnC,UAAAjB;AAAA,EACA,WAAAQ;AAAA,EACA,GAAGnB;AACL,MAAiC;AAC/B,QAAM,EAAE,MAAAD,EAAA,IAASP,EAAA,GACXqC,IAAY9B,GAAM,UAAU,SAAY,MAAMZ,EAAW,OAAOY,EAAK,KAAK;AAEhF,SACE,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWc;AAAA,QACT;AAAA,QACAE;AAAA,MAAA;AAAA,MAED,GAAGnB;AAAA,MAEH,eACC,gBAAAS,EAAAgB,GAAA,EACE,UAAA;AAAA,QAAA,gBAAAtB,EAAC,QAAA,EAAK,WAAU,yBAAwB,UAAA,cAAU;AAAA,QAClD,gBAAAA,EAAC,UAAM,UAAA0B,EAAA,CAAU;AAAA,MAAA,EAAA,CACnB;AAAA,IAAA;AAAA,EAAA;AAIR,GAEMC,IAAiB,CAAC;AAAA,EACtB,QAAAC;AAAA,EACA,UAAAC;AACF,wBAIG,QAAA,EACE,UAAA;AAAA,EAAAD,MAAW,SACR,MACA,IAAI,KAAK,aAAa,SAAS;AAAA,IAC7B,UAAU;AAAA,EAAA,CACX,EAAE,OAAOA,CAAM;AAAA,EACnBC,IACC,gBAAAvB,EAAC,QAAA,EAAK,WAAU,8BAA6B,UAAA;AAAA,IAAA;AAAA,IAAGuB;AAAA,EAAA,EAAA,CAAS,IACvD;AAAA,GACN,GAKWC,IAAoB,CAAC;AAAA,EAChC,WAAAd;AAAA,EACA,UAAAR;AAAA,EACA,GAAGX;AACL,MAA8B;AAC5B,QAAM,EAAE,OAAAF,GAAO,MAAAC,EAAA,IAASP,EAAA,GAClB0C,IAAcpC,GAAO,eAAe;AAE1C,MAAIa;AACF,WAAOA;AAGT,MAAI,CAACuB;AACH,WAAO;AAGT,QAAMC,IAAgB/C,EAAUW,GAAM,KAAK;AAE3C,SACE,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWQ,EAAG,6CAA6CE,CAAS;AAAA,MACnE,GAAGnB;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAG,EAAC,QAAA,EAAK,WAAU,yBAAwB,UAAA,SAAK;AAAA,QAC7C,gBAAAA,EAAC2B,GAAA,EAAe,UAAUK,GAAe,QAAQD,EAAA,CAAa;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpE,GAIaE,IAAqB,CAAC;AAAA,EACjC,WAAAjB;AAAA,EACA,UAAAR;AAAA,EACA,GAAGX;AACL,MAA+B;AAC7B,QAAM,EAAE,OAAAF,GAAO,MAAAC,EAAA,IAASP,EAAA,GAClB6C,IAAevC,GAAO,gBAAgB;AAE5C,MAAIa;AACF,WAAOA;AAGT,MAAI,CAAC0B;AACH,WAAO;AAGT,QAAMC,IAAiBlD,EAAUW,GAAM,MAAM;AAE7C,SACE,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWQ,EAAG,6CAA6CE,CAAS;AAAA,MACnE,GAAGnB;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAG,EAAC,QAAA,EAAK,WAAU,yBAAwB,UAAA,UAAM;AAAA,QAC9C,gBAAAA,EAAC2B,GAAA,EAAe,UAAUQ,GAAgB,QAAQD,EAAA,CAAc;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGtE,GAIaE,IAAwB,CAAC;AAAA,EACpC,WAAApB;AAAA,EACA,UAAAR;AAAA,EACA,GAAGX;AACL,MAAkC;AAChC,QAAM,EAAE,OAAAF,GAAO,MAAAC,EAAA,IAASP,EAAA,GAClBgD,IAAkB1C,GAAO,mBAAmB;AAElD,MAAIa;AACF,WAAOA;AAGT,MAAI,CAAC6B;AACH,WAAO;AAGT,QAAMC,IAAoBrD,EAAUW,GAAM,SAAS;AAEnD,SACE,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWQ,EAAG,6CAA6CE,CAAS;AAAA,MACnE,GAAGnB;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAG,EAAC,QAAA,EAAK,WAAU,yBAAwB,UAAA,aAAS;AAAA,QACjD,gBAAAA,EAAC2B,GAAA,EAAe,UAAUW,GAAmB,QAAQD,EAAA,CAAiB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG5E,GAIaE,IAAoB,CAAC;AAAA,EAChC,WAAAvB;AAAA,EACA,UAAAR;AAAA,EACA,GAAGX;AACL,MAA8B;AAC5B,QAAM,EAAE,OAAAF,GAAO,MAAAC,EAAA,IAASP,EAAA,GAClBmD,IAAc7C,GAAO,qBAAqB;AAEhD,MAAIa;AACF,WAAOA;AAGT,MAAI,CAACgC;AACH,WAAO;AAGT,QAAMC,IAAgBxD,EAAUW,GAAM,KAAK;AAE3C,SACE,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWQ,EAAG,6CAA6CE,CAAS;AAAA,MACnE,GAAGnB;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAG,EAAC,QAAA,EAAK,WAAU,yBAAwB,UAAA,SAAK;AAAA,QAC7C,gBAAAA,EAAC2B,GAAA,EAAe,UAAUc,GAAe,QAAQD,EAAA,CAAa;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpE;"}

package/dist/components/ai/message.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),w=require("@streamdown/cjk"),C=require("@streamdown/code"),N=require("@streamdown/math"),y=require("@streamdown/mermaid"),M=require("lucide-react"),c=require("react"),T=require("streamdown"),x=require("../ui/button.cjs"),f=require("../ui/button-group.cjs"),d=require("../ui/tooltip.cjs"),i=require("../../lib/utils.cjs"),q=({className:e,from:s,...t})=>n.jsx("div",{className:i.cn("group flex w-full max-w-[95%] flex-col gap-2",s==="user"?"is-user ml-auto justify-end":"is-assistant",e),...t}),k=({children:e,className:s,...t})=>n.jsx("div",{className:i.cn("is-user:dark flex w-fit min-w-0 max-w-full flex-col gap-2 overflow-hidden text-sm","group-[.is-user]:ml-auto group-[.is-user]:rounded-lg group-[.is-user]:bg-secondary group-[.is-user]:px-4 group-[.is-user]:py-3 group-[.is-user]:text-foreground","group-[.is-assistant]:text-foreground",s),...t,children:e}),A=({className:e,children:s,...t})=>n.jsx("div",{className:i.cn("flex items-center gap-1",e),...t,children:s}),P=({tooltip:e,children:s,label:t,variant:a="ghost",size:r="icon-sm",...l})=>{const o=n.jsxs(x.Button,{size:r,type:"button",variant:a,...l,children:[s,n.jsx("span",{className:"sr-only",children:t||e})]});return e?n.jsx(d.TooltipProvider,{children:n.jsxs(d.Tooltip,{children:[n.jsx(d.TooltipTrigger,{asChild:!0,children:o}),n.jsx(d.TooltipContent,{children:n.jsx("p",{children:e})})]})}):o},b=c.createContext(null),g=()=>{const e=c.useContext(b);if(!e)throw new Error("MessageBranch components must be used within MessageBranch");return e},R=({defaultBranch:e=0,onBranchChange:s,className:t,...a})=>{const[r,l]=c.useState(e),[o,m]=c.useState([]),h=c.useCallback(u=>{l(u),s?.(u)},[s]),p=c.useCallback(()=>{const u=r>0?r-1:o.length-1;h(u)},[r,o.length,h]),B=c.useCallback(()=>{const u=r<o.length-1?r+1:0;h(u)},[r,o.length,h]),v=c.useMemo(()=>({branches:o,currentBranch:r,goToNext:B,goToPrevious:p,setBranches:m,totalBranches:o.length}),[o,r,B,p]);return n.jsx(b.Provider,{value:v,children:n.jsx("div",{className:i.cn("grid w-full gap-2 [&>div]:pb-0",t),...a})})},S=({children:e,...s})=>{const{currentBranch:t,setBranches:a,branches:r}=g(),l=c.useMemo(()=>Array.isArray(e)?e:[e],[e]);return c.useEffect(()=>{r.length!==l.length&&a(l)},[l,r,a]),l.map((o,m)=>n.jsx("div",{className:i.cn("grid gap-2 overflow-hidden [&>div]:pb-0",m===t?"block":"hidden"),...s,children:o},o.key))},z=({className:e,...s})=>{const{totalBranches:t}=g();return t<=1?null:n.jsx(f.ButtonGroup,{className:i.cn("[&>*:not(:first-child)]:rounded-l-md [&>*:not(:last-child)]:rounded-r-md",e),orientation:"horizontal",...s})},G=({children:e,...s})=>{const{goToPrevious:t,totalBranches:a}=g();return n.jsx(x.Button,{"aria-label":"Previous branch",disabled:a<=1,onClick:t,size:"icon-sm",type:"button",variant:"ghost",...s,children:e??n.jsx(M.ChevronLeftIcon,{size:14})})},E=({children:e,...s})=>{const{goToNext:t,totalBranches:a}=g();return n.jsx(x.Button,{"aria-label":"Next branch",disabled:a<=1,onClick:t,size:"icon-sm",type:"button",variant:"ghost",...s,children:e??n.jsx(M.ChevronRightIcon,{size:14})})},I=({className:e,...s})=>{const{currentBranch:t,totalBranches:a}=g();return n.jsx(f.ButtonGroupText,{className:i.cn("border-none bg-transparent text-muted-foreground shadow-none",e),...s,children:`${t+1} of ${a}`})},L={cjk:w.cjk,code:C.code,math:N.math,mermaid:y.mermaid},j=c.memo(({className:e,...s})=>n.jsx(T.Streamdown,{className:i.cn("size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0",e),plugins:L,...s}),(e,s)=>e.children===s.children&&s.isAnimating===e.isAnimating);j.displayName="MessageResponse";const O=({className:e,children:s,...t})=>n.jsx("div",{className:i.cn("mt-4 flex w-full items-center justify-between gap-4",e),...t,children:s});exports.Message=q;exports.MessageAction=P;exports.MessageActions=A;exports.MessageBranch=R;exports.MessageBranchContent=S;exports.MessageBranchNext=E;exports.MessageBranchPage=I;exports.MessageBranchPrevious=G;exports.MessageBranchSelector=z;exports.MessageContent=k;exports.MessageResponse=j;exports.MessageToolbar=O;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),M=require("lucide-react"),c=require("react"),w=require("streamdown"),C=require("./use-streamdown-plugins.cjs"),m=require("../ui/button.cjs"),f=require("../ui/button-group.cjs"),d=require("../ui/tooltip.cjs"),i=require("../../lib/utils.cjs"),N=({className:e,from:s,...n})=>t.jsx("div",{className:i.cn("group flex w-full max-w-[95%] flex-col gap-2",s==="user"?"is-user ml-auto justify-end":"is-assistant",e),...n}),y=({children:e,className:s,...n})=>t.jsx("div",{className:i.cn("is-user:dark flex w-fit min-w-0 max-w-full flex-col gap-2 overflow-hidden text-sm","group-[.is-user]:ml-auto group-[.is-user]:rounded-lg group-[.is-user]:bg-secondary group-[.is-user]:px-4 group-[.is-user]:py-3 group-[.is-user]:text-foreground","group-[.is-assistant]:text-foreground",s),...n,children:e}),T=({className:e,children:s,...n})=>t.jsx("div",{className:i.cn("flex items-center gap-1",e),...n,children:s}),P=({tooltip:e,children:s,label:n,variant:a="ghost",size:r="icon-sm",...l})=>{const o=t.jsxs(m.Button,{size:r,type:"button",variant:a,...l,children:[s,t.jsx("span",{className:"sr-only",children:n||e})]});return e?t.jsx(d.TooltipProvider,{children:t.jsxs(d.Tooltip,{children:[t.jsx(d.TooltipTrigger,{asChild:!0,children:o}),t.jsx(d.TooltipContent,{children:t.jsx("p",{children:e})})]})}):o},b=c.createContext(null),g=()=>{const e=c.useContext(b);if(!e)throw new Error("MessageBranch components must be used within MessageBranch");return e},q=({defaultBranch:e=0,onBranchChange:s,className:n,...a})=>{const[r,l]=c.useState(e),[o,x]=c.useState([]),h=c.useCallback(u=>{l(u),s?.(u)},[s]),p=c.useCallback(()=>{const u=r>0?r-1:o.length-1;h(u)},[r,o.length,h]),B=c.useCallback(()=>{const u=r<o.length-1?r+1:0;h(u)},[r,o.length,h]),v=c.useMemo(()=>({branches:o,currentBranch:r,goToNext:B,goToPrevious:p,setBranches:x,totalBranches:o.length}),[o,r,B,p]);return t.jsx(b.Provider,{value:v,children:t.jsx("div",{className:i.cn("grid w-full gap-2 [&>div]:pb-0",n),...a})})},A=({children:e,...s})=>{const{currentBranch:n,setBranches:a,branches:r}=g(),l=c.useMemo(()=>Array.isArray(e)?e:[e],[e]);return c.useEffect(()=>{r.length!==l.length&&a(l)},[l,r,a]),l.map((o,x)=>t.jsx("div",{className:i.cn("grid gap-2 overflow-hidden [&>div]:pb-0",x===n?"block":"hidden"),...s,children:o},o.key))},S=({className:e,...s})=>{const{totalBranches:n}=g();return n<=1?null:t.jsx(f.ButtonGroup,{className:i.cn("[&>*:not(:first-child)]:rounded-l-md [&>*:not(:last-child)]:rounded-r-md",e),orientation:"horizontal",...s})},k=({children:e,...s})=>{const{goToPrevious:n,totalBranches:a}=g();return t.jsx(m.Button,{"aria-label":"Previous branch",disabled:a<=1,onClick:n,size:"icon-sm",type:"button",variant:"ghost",...s,children:e??t.jsx(M.ChevronLeftIcon,{size:14})})},R=({children:e,...s})=>{const{goToNext:n,totalBranches:a}=g();return t.jsx(m.Button,{"aria-label":"Next branch",disabled:a<=1,onClick:n,size:"icon-sm",type:"button",variant:"ghost",...s,children:e??t.jsx(M.ChevronRightIcon,{size:14})})},z=({className:e,...s})=>{const{currentBranch:n,totalBranches:a}=g();return t.jsx(f.ButtonGroupText,{className:i.cn("border-none bg-transparent text-muted-foreground shadow-none",e),...s,children:`${n+1} of ${a}`})},j=c.memo(({className:e,...s})=>{const n=C.useStreamdownPlugins();return t.jsx(w.Streamdown,{className:i.cn("size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0",e),plugins:n,...s})},(e,s)=>e.children===s.children&&s.isAnimating===e.isAnimating);j.displayName="MessageResponse";const G=({className:e,children:s,...n})=>t.jsx("div",{className:i.cn("mt-4 flex w-full items-center justify-between gap-4",e),...n,children:s});exports.Message=N;exports.MessageAction=P;exports.MessageActions=T;exports.MessageBranch=q;exports.MessageBranchContent=A;exports.MessageBranchNext=R;exports.MessageBranchPage=z;exports.MessageBranchPrevious=k;exports.MessageBranchSelector=S;exports.MessageContent=y;exports.MessageResponse=j;exports.MessageToolbar=G;
 //# sourceMappingURL=message.cjs.map

package/dist/components/ai/message.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"message.cjs","sources":["../../../src/components/ai/message.tsx"],"sourcesContent":["import { cjk } from \"@streamdown/cjk\";\nimport { code } from \"@streamdown/code\";\nimport { math } from \"@streamdown/math\";\nimport { mermaid } from \"@streamdown/mermaid\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"lucide-react\";\nimport {\n  createContext,\n  memo,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\nimport { Streamdown } from \"streamdown\";\n\nimport type { UIMessage } from \"ai\";\nimport type { ComponentProps, HTMLAttributes, ReactElement } from \"react\";\n\nimport { Button } from \"@/components/ui/button\";\nimport {\n  ButtonGroup,\n  ButtonGroupText,\n} from \"@/components/ui/button-group\";\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n  TooltipTrigger,\n} from \"@/components/ui/tooltip\";\nimport { cn } from \"@/lib/utils\";\n\nexport type MessageProps = HTMLAttributes<HTMLDivElement> & {\n  from: UIMessage[\"role\"];\n};\n\nexport const Message = ({ className, from, ...props }: MessageProps) => (\n  <div\n    className={cn(\n      \"group flex w-full max-w-[95%] flex-col gap-2\",\n      from === \"user\" ? \"is-user ml-auto justify-end\" : \"is-assistant\",\n      className\n    )}\n    {...props}\n  />\n);\n\nexport type MessageContentProps = HTMLAttributes<HTMLDivElement>;\n\nexport const MessageContent = ({\n  children,\n  className,\n  ...props\n}: MessageContentProps) => (\n  <div\n    className={cn(\n      \"is-user:dark flex w-fit min-w-0 max-w-full flex-col gap-2 overflow-hidden text-sm\",\n      \"group-[.is-user]:ml-auto group-[.is-user]:rounded-lg group-[.is-user]:bg-secondary group-[.is-user]:px-4 group-[.is-user]:py-3 group-[.is-user]:text-foreground\",\n      \"group-[.is-assistant]:text-foreground\",\n      className\n    )}\n    {...props}\n  >\n    {children}\n  </div>\n);\n\nexport type MessageActionsProps = ComponentProps<\"div\">;\n\nexport const MessageActions = ({\n  className,\n  children,\n  ...props\n}: MessageActionsProps) => (\n  <div className={cn(\"flex items-center gap-1\", className)} {...props}>\n    {children}\n  </div>\n);\n\nexport type MessageActionProps = ComponentProps<typeof Button> & {\n  tooltip?: string;\n  label?: string;\n};\n\nexport const MessageAction = ({\n  tooltip,\n  children,\n  label,\n  variant = \"ghost\",\n  size = \"icon-sm\",\n  ...props\n}: MessageActionProps) => {\n  const button = (\n    <Button size={size} type=\"button\" variant={variant} {...props}>\n      {children}\n      <span className=\"sr-only\">{label || tooltip}</span>\n    </Button>\n  );\n\n  if (tooltip) {\n    return (\n      <TooltipProvider>\n        <Tooltip>\n          <TooltipTrigger asChild>{button}</TooltipTrigger>\n          <TooltipContent>\n            <p>{tooltip}</p>\n          </TooltipContent>\n        </Tooltip>\n      </TooltipProvider>\n    );\n  }\n\n  return button;\n};\n\ninterface MessageBranchContextType {\n  currentBranch: number;\n  totalBranches: number;\n  goToPrevious: () => void;\n  goToNext: () => void;\n  branches: ReactElement[];\n  setBranches: (branches: ReactElement[]) => void;\n}\n\nconst MessageBranchContext = createContext<MessageBranchContextType | null>(\n  null\n);\n\nconst useMessageBranch = () => {\n  const context = useContext(MessageBranchContext);\n\n  if (!context) {\n    throw new Error(\n      \"MessageBranch components must be used within MessageBranch\"\n    );\n  }\n\n  return context;\n};\n\nexport type MessageBranchProps = HTMLAttributes<HTMLDivElement> & {\n  defaultBranch?: number;\n  onBranchChange?: (branchIndex: number) => void;\n};\n\nexport const MessageBranch = ({\n  defaultBranch = 0,\n  onBranchChange,\n  className,\n  ...props\n}: MessageBranchProps) => {\n  const [currentBranch, setCurrentBranch] = useState(defaultBranch);\n  const [branches, setBranches] = useState<ReactElement[]>([]);\n\n  const handleBranchChange = useCallback(\n    (newBranch: number) => {\n      setCurrentBranch(newBranch);\n      onBranchChange?.(newBranch);\n    },\n    [onBranchChange]\n  );\n\n  const goToPrevious = useCallback(() => {\n    const newBranch =\n      currentBranch > 0 ? currentBranch - 1 : branches.length - 1;\n    handleBranchChange(newBranch);\n  }, [currentBranch, branches.length, handleBranchChange]);\n\n  const goToNext = useCallback(() => {\n    const newBranch =\n      currentBranch < branches.length - 1 ? currentBranch + 1 : 0;\n    handleBranchChange(newBranch);\n  }, [currentBranch, branches.length, handleBranchChange]);\n\n  const contextValue = useMemo<MessageBranchContextType>(\n    () => ({\n      branches,\n      currentBranch,\n      goToNext,\n      goToPrevious,\n      setBranches,\n      totalBranches: branches.length,\n    }),\n    [branches, currentBranch, goToNext, goToPrevious]\n  );\n\n  return (\n    <MessageBranchContext.Provider value={contextValue}>\n      <div\n        className={cn(\"grid w-full gap-2 [&>div]:pb-0\", className)}\n        {...props}\n      />\n    </MessageBranchContext.Provider>\n  );\n};\n\nexport type MessageBranchContentProps = HTMLAttributes<HTMLDivElement>;\n\nexport const MessageBranchContent = ({\n  children,\n  ...props\n}: MessageBranchContentProps) => {\n  const { currentBranch, setBranches, branches } = useMessageBranch();\n  const childrenArray = useMemo(\n    () => (Array.isArray(children) ? children : [children]),\n    [children]\n  );\n\n  // Use useEffect to update branches when they change\n  useEffect(() => {\n    if (branches.length !== childrenArray.length) {\n      setBranches(childrenArray);\n    }\n  }, [childrenArray, branches, setBranches]);\n\n  return childrenArray.map((branch, index) => (\n    <div\n      className={cn(\n        \"grid gap-2 overflow-hidden [&>div]:pb-0\",\n        index === currentBranch ? \"block\" : \"hidden\"\n      )}\n      key={branch.key}\n      {...props}\n    >\n      {branch}\n    </div>\n  ));\n};\n\nexport type MessageBranchSelectorProps = ComponentProps<typeof ButtonGroup>;\n\nexport const MessageBranchSelector = ({\n  className,\n  ...props\n}: MessageBranchSelectorProps) => {\n  const { totalBranches } = useMessageBranch();\n\n  // Don't render if there's only one branch\n  if (totalBranches <= 1) {\n    return null;\n  }\n\n  return (\n    <ButtonGroup\n      className={cn(\n        \"[&>*:not(:first-child)]:rounded-l-md [&>*:not(:last-child)]:rounded-r-md\",\n        className\n      )}\n      orientation=\"horizontal\"\n      {...props}\n    />\n  );\n};\n\nexport type MessageBranchPreviousProps = ComponentProps<typeof Button>;\n\nexport const MessageBranchPrevious = ({\n  children,\n  ...props\n}: MessageBranchPreviousProps) => {\n  const { goToPrevious, totalBranches } = useMessageBranch();\n\n  return (\n    <Button\n      aria-label=\"Previous branch\"\n      disabled={totalBranches <= 1}\n      onClick={goToPrevious}\n      size=\"icon-sm\"\n      type=\"button\"\n      variant=\"ghost\"\n      {...props}\n    >\n      {children ?? <ChevronLeftIcon size={14} />}\n    </Button>\n  );\n};\n\nexport type MessageBranchNextProps = ComponentProps<typeof Button>;\n\nexport const MessageBranchNext = ({\n  children,\n  ...props\n}: MessageBranchNextProps) => {\n  const { goToNext, totalBranches } = useMessageBranch();\n\n  return (\n    <Button\n      aria-label=\"Next branch\"\n      disabled={totalBranches <= 1}\n      onClick={goToNext}\n      size=\"icon-sm\"\n      type=\"button\"\n      variant=\"ghost\"\n      {...props}\n    >\n      {children ?? <ChevronRightIcon size={14} />}\n    </Button>\n  );\n};\n\nexport type MessageBranchPageProps = HTMLAttributes<HTMLSpanElement>;\n\nexport const MessageBranchPage = ({\n  className,\n  ...props\n}: MessageBranchPageProps) => {\n  const { currentBranch, totalBranches } = useMessageBranch();\n\n  return (\n    <ButtonGroupText\n      className={cn(\n        \"border-none bg-transparent text-muted-foreground shadow-none\",\n        className\n      )}\n      {...props}\n    >\n      {`${currentBranch + 1} of ${totalBranches}`}\n    </ButtonGroupText>\n  );\n};\n\nexport type MessageResponseProps = ComponentProps<typeof Streamdown>;\n\nconst streamdownPlugins = { cjk, code, math, mermaid };\n\nexport const MessageResponse = memo(\n  ({ className, ...props }: MessageResponseProps) => (\n    <Streamdown\n      className={cn(\n        \"size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0\",\n        className\n      )}\n      plugins={streamdownPlugins}\n      {...props}\n    />\n  ),\n  (prevProps, nextProps) =>\n    prevProps.children === nextProps.children &&\n    nextProps.isAnimating === prevProps.isAnimating\n);\n\nMessageResponse.displayName = \"MessageResponse\";\n\nexport type MessageToolbarProps = ComponentProps<\"div\">;\n\nexport const MessageToolbar = ({\n  className,\n  children,\n  ...props\n}: MessageToolbarProps) => (\n  <div\n    className={cn(\n      \"mt-4 flex w-full items-center justify-between gap-4\",\n      className\n    )}\n    {...props}\n  >\n    {children}\n  </div>\n);\n"],"names":["Message","className","from","props","jsx","cn","MessageContent","children","MessageActions","MessageAction","tooltip","label","variant","size","button","Button","TooltipProvider","jsxs","Tooltip","TooltipTrigger","TooltipContent","MessageBranchContext","createContext","useMessageBranch","context","useContext","MessageBranch","defaultBranch","onBranchChange","currentBranch","setCurrentBranch","useState","branches","setBranches","handleBranchChange","useCallback","newBranch","goToPrevious","goToNext","contextValue","useMemo","MessageBranchContent","childrenArray","useEffect","branch","index","MessageBranchSelector","totalBranches","ButtonGroup","MessageBranchPrevious","ChevronLeftIcon","MessageBranchNext","ChevronRightIcon","MessageBranchPage","ButtonGroupText","streamdownPlugins","cjk","code","math","mermaid","MessageResponse","memo","Streamdown","prevProps","nextProps","MessageToolbar"],"mappings":"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"}
+{"version":3,"file":"message.cjs","sources":["../../../src/components/ai/message.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from \"lucide-react\";\nimport {\n  createContext,\n  memo,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\nimport { Streamdown } from \"streamdown\";\n\nimport { useStreamdownPlugins } from \"./use-streamdown-plugins\";\n\nimport type { UIMessage } from \"ai\";\nimport type { ComponentProps, HTMLAttributes, ReactElement } from \"react\";\n\nimport { Button } from \"@/components/ui/button\";\nimport {\n  ButtonGroup,\n  ButtonGroupText,\n} from \"@/components/ui/button-group\";\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n  TooltipTrigger,\n} from \"@/components/ui/tooltip\";\nimport { cn } from \"@/lib/utils\";\n\nexport type MessageProps = HTMLAttributes<HTMLDivElement> & {\n  from: UIMessage[\"role\"];\n};\n\nexport const Message = ({ className, from, ...props }: MessageProps) => (\n  <div\n    className={cn(\n      \"group flex w-full max-w-[95%] flex-col gap-2\",\n      from === \"user\" ? \"is-user ml-auto justify-end\" : \"is-assistant\",\n      className\n    )}\n    {...props}\n  />\n);\n\nexport type MessageContentProps = HTMLAttributes<HTMLDivElement>;\n\nexport const MessageContent = ({\n  children,\n  className,\n  ...props\n}: MessageContentProps) => (\n  <div\n    className={cn(\n      \"is-user:dark flex w-fit min-w-0 max-w-full flex-col gap-2 overflow-hidden text-sm\",\n      \"group-[.is-user]:ml-auto group-[.is-user]:rounded-lg group-[.is-user]:bg-secondary group-[.is-user]:px-4 group-[.is-user]:py-3 group-[.is-user]:text-foreground\",\n      \"group-[.is-assistant]:text-foreground\",\n      className\n    )}\n    {...props}\n  >\n    {children}\n  </div>\n);\n\nexport type MessageActionsProps = ComponentProps<\"div\">;\n\nexport const MessageActions = ({\n  className,\n  children,\n  ...props\n}: MessageActionsProps) => (\n  <div className={cn(\"flex items-center gap-1\", className)} {...props}>\n    {children}\n  </div>\n);\n\nexport type MessageActionProps = ComponentProps<typeof Button> & {\n  tooltip?: string;\n  label?: string;\n};\n\nexport const MessageAction = ({\n  tooltip,\n  children,\n  label,\n  variant = \"ghost\",\n  size = \"icon-sm\",\n  ...props\n}: MessageActionProps) => {\n  const button = (\n    <Button size={size} type=\"button\" variant={variant} {...props}>\n      {children}\n      <span className=\"sr-only\">{label || tooltip}</span>\n    </Button>\n  );\n\n  if (tooltip) {\n    return (\n      <TooltipProvider>\n        <Tooltip>\n          <TooltipTrigger asChild>{button}</TooltipTrigger>\n          <TooltipContent>\n            <p>{tooltip}</p>\n          </TooltipContent>\n        </Tooltip>\n      </TooltipProvider>\n    );\n  }\n\n  return button;\n};\n\ninterface MessageBranchContextType {\n  currentBranch: number;\n  totalBranches: number;\n  goToPrevious: () => void;\n  goToNext: () => void;\n  branches: ReactElement[];\n  setBranches: (branches: ReactElement[]) => void;\n}\n\nconst MessageBranchContext = createContext<MessageBranchContextType | null>(\n  null\n);\n\nconst useMessageBranch = () => {\n  const context = useContext(MessageBranchContext);\n\n  if (!context) {\n    throw new Error(\n      \"MessageBranch components must be used within MessageBranch\"\n    );\n  }\n\n  return context;\n};\n\nexport type MessageBranchProps = HTMLAttributes<HTMLDivElement> & {\n  defaultBranch?: number;\n  onBranchChange?: (branchIndex: number) => void;\n};\n\nexport const MessageBranch = ({\n  defaultBranch = 0,\n  onBranchChange,\n  className,\n  ...props\n}: MessageBranchProps) => {\n  const [currentBranch, setCurrentBranch] = useState(defaultBranch);\n  const [branches, setBranches] = useState<ReactElement[]>([]);\n\n  const handleBranchChange = useCallback(\n    (newBranch: number) => {\n      setCurrentBranch(newBranch);\n      onBranchChange?.(newBranch);\n    },\n    [onBranchChange]\n  );\n\n  const goToPrevious = useCallback(() => {\n    const newBranch =\n      currentBranch > 0 ? currentBranch - 1 : branches.length - 1;\n    handleBranchChange(newBranch);\n  }, [currentBranch, branches.length, handleBranchChange]);\n\n  const goToNext = useCallback(() => {\n    const newBranch =\n      currentBranch < branches.length - 1 ? currentBranch + 1 : 0;\n    handleBranchChange(newBranch);\n  }, [currentBranch, branches.length, handleBranchChange]);\n\n  const contextValue = useMemo<MessageBranchContextType>(\n    () => ({\n      branches,\n      currentBranch,\n      goToNext,\n      goToPrevious,\n      setBranches,\n      totalBranches: branches.length,\n    }),\n    [branches, currentBranch, goToNext, goToPrevious]\n  );\n\n  return (\n    <MessageBranchContext.Provider value={contextValue}>\n      <div\n        className={cn(\"grid w-full gap-2 [&>div]:pb-0\", className)}\n        {...props}\n      />\n    </MessageBranchContext.Provider>\n  );\n};\n\nexport type MessageBranchContentProps = HTMLAttributes<HTMLDivElement>;\n\nexport const MessageBranchContent = ({\n  children,\n  ...props\n}: MessageBranchContentProps) => {\n  const { currentBranch, setBranches, branches } = useMessageBranch();\n  const childrenArray = useMemo(\n    () => (Array.isArray(children) ? children : [children]),\n    [children]\n  );\n\n  // Use useEffect to update branches when they change\n  useEffect(() => {\n    if (branches.length !== childrenArray.length) {\n      setBranches(childrenArray);\n    }\n  }, [childrenArray, branches, setBranches]);\n\n  return childrenArray.map((branch, index) => (\n    <div\n      className={cn(\n        \"grid gap-2 overflow-hidden [&>div]:pb-0\",\n        index === currentBranch ? \"block\" : \"hidden\"\n      )}\n      key={branch.key}\n      {...props}\n    >\n      {branch}\n    </div>\n  ));\n};\n\nexport type MessageBranchSelectorProps = ComponentProps<typeof ButtonGroup>;\n\nexport const MessageBranchSelector = ({\n  className,\n  ...props\n}: MessageBranchSelectorProps) => {\n  const { totalBranches } = useMessageBranch();\n\n  // Don't render if there's only one branch\n  if (totalBranches <= 1) {\n    return null;\n  }\n\n  return (\n    <ButtonGroup\n      className={cn(\n        \"[&>*:not(:first-child)]:rounded-l-md [&>*:not(:last-child)]:rounded-r-md\",\n        className\n      )}\n      orientation=\"horizontal\"\n      {...props}\n    />\n  );\n};\n\nexport type MessageBranchPreviousProps = ComponentProps<typeof Button>;\n\nexport const MessageBranchPrevious = ({\n  children,\n  ...props\n}: MessageBranchPreviousProps) => {\n  const { goToPrevious, totalBranches } = useMessageBranch();\n\n  return (\n    <Button\n      aria-label=\"Previous branch\"\n      disabled={totalBranches <= 1}\n      onClick={goToPrevious}\n      size=\"icon-sm\"\n      type=\"button\"\n      variant=\"ghost\"\n      {...props}\n    >\n      {children ?? <ChevronLeftIcon size={14} />}\n    </Button>\n  );\n};\n\nexport type MessageBranchNextProps = ComponentProps<typeof Button>;\n\nexport const MessageBranchNext = ({\n  children,\n  ...props\n}: MessageBranchNextProps) => {\n  const { goToNext, totalBranches } = useMessageBranch();\n\n  return (\n    <Button\n      aria-label=\"Next branch\"\n      disabled={totalBranches <= 1}\n      onClick={goToNext}\n      size=\"icon-sm\"\n      type=\"button\"\n      variant=\"ghost\"\n      {...props}\n    >\n      {children ?? <ChevronRightIcon size={14} />}\n    </Button>\n  );\n};\n\nexport type MessageBranchPageProps = HTMLAttributes<HTMLSpanElement>;\n\nexport const MessageBranchPage = ({\n  className,\n  ...props\n}: MessageBranchPageProps) => {\n  const { currentBranch, totalBranches } = useMessageBranch();\n\n  return (\n    <ButtonGroupText\n      className={cn(\n        \"border-none bg-transparent text-muted-foreground shadow-none\",\n        className\n      )}\n      {...props}\n    >\n      {`${currentBranch + 1} of ${totalBranches}`}\n    </ButtonGroupText>\n  );\n};\n\nexport type MessageResponseProps = ComponentProps<typeof Streamdown>;\n\nexport const MessageResponse = memo(\n  ({ className, ...props }: MessageResponseProps) => {\n    // Plugins load lazily (SW-2007): markdown streams in immediately and\n    // code/math/mermaid rendering upgrades in place once the chunk arrives.\n    const plugins = useStreamdownPlugins();\n\n    return (\n      <Streamdown\n        className={cn(\n          \"size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0\",\n          className\n        )}\n        plugins={plugins}\n        {...props}\n      />\n    );\n  },\n  (prevProps, nextProps) =>\n    prevProps.children === nextProps.children &&\n    nextProps.isAnimating === prevProps.isAnimating\n);\n\nMessageResponse.displayName = \"MessageResponse\";\n\nexport type MessageToolbarProps = ComponentProps<\"div\">;\n\nexport const MessageToolbar = ({\n  className,\n  children,\n  ...props\n}: MessageToolbarProps) => (\n  <div\n    className={cn(\n      \"mt-4 flex w-full items-center justify-between gap-4\",\n      className\n    )}\n    {...props}\n  >\n    {children}\n  </div>\n);\n"],"names":["Message","className","from","props","jsx","cn","MessageContent","children","MessageActions","MessageAction","tooltip","label","variant","size","button","Button","TooltipProvider","jsxs","Tooltip","TooltipTrigger","TooltipContent","MessageBranchContext","createContext","useMessageBranch","context","useContext","MessageBranch","defaultBranch","onBranchChange","currentBranch","setCurrentBranch","useState","branches","setBranches","handleBranchChange","useCallback","newBranch","goToPrevious","goToNext","contextValue","useMemo","MessageBranchContent","childrenArray","useEffect","branch","index","MessageBranchSelector","totalBranches","ButtonGroup","MessageBranchPrevious","ChevronLeftIcon","MessageBranchNext","ChevronRightIcon","MessageBranchPage","ButtonGroupText","MessageResponse","memo","plugins","useStreamdownPlugins","Streamdown","prevProps","nextProps","MessageToolbar"],"mappings":"sWAkCaA,EAAU,CAAC,CAAE,UAAAC,EAAW,KAAAC,EAAM,GAAGC,KAC5CC,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,GACT,+CACAH,IAAS,OAAS,8BAAgC,eAClDD,CAAA,EAED,GAAGE,CAAA,CACN,EAKWG,EAAiB,CAAC,CAC7B,SAAAC,EACA,UAAAN,EACA,GAAGE,CACL,IACEC,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,GACT,oFACA,kKACA,wCACAJ,CAAA,EAED,GAAGE,EAEH,SAAAI,CAAA,CACH,EAKWC,EAAiB,CAAC,CAC7B,UAAAP,EACA,SAAAM,EACA,GAAGJ,CACL,IACEC,EAAAA,IAAC,OAAI,UAAWC,EAAAA,GAAG,0BAA2BJ,CAAS,EAAI,GAAGE,EAC3D,SAAAI,CAAA,CACH,EAQWE,EAAgB,CAAC,CAAA,QAC5BC,EACA,SAAAH,EACA,MAAAI,EACA,QAAAC,EAAU,QACV,KAAAC,EAAO,UACP,GAAGV,CACL,IAA0B,CACxB,MAAMW,SACHC,EAAAA,OAAA,CAAO,KAAAF,EAAY,KAAK,SAAS,QAAAD,EAAmB,GAAGT,EACrD,SAAA,CAAAI,EACDH,EAAAA,IAAC,OAAA,CAAK,UAAU,UAAW,YAASM,CAAA,CAAQ,CAAA,EAC9C,EAGF,OAAIA,EAEAN,EAAAA,IAACY,EAAAA,gBAAA,CACC,SAAAC,EAAAA,KAACC,EAAAA,QAAA,CACC,SAAA,CAAAd,EAAAA,IAACe,EAAAA,eAAA,CAAe,QAAO,GAAE,SAAAL,EAAO,EAChCV,MAACgB,EAAAA,eAAA,CACC,SAAAhB,EAAAA,IAAC,IAAA,CAAG,WAAQ,CAAA,CACd,CAAA,CAAA,CACF,CAAA,CACF,EAIGU,CACT,EAWMO,EAAuBC,EAAAA,cAC3B,IACF,EAEMC,EAAmB,IAAM,CAC7B,MAAMC,EAAUC,EAAAA,WAAWJ,CAAoB,EAE/C,GAAI,CAACG,EACH,MAAM,IAAI,MACR,4DAAA,EAIJ,OAAOA,CACT,EAOaE,EAAgB,CAAC,CAC5B,cAAAC,EAAgB,EAChB,eAAAC,EACA,UAAA3B,EACA,GAAGE,CACL,IAA0B,CACxB,KAAM,CAAC0B,EAAeC,CAAgB,EAAIC,EAAAA,SAASJ,CAAa,EAC1D,CAACK,EAAUC,CAAW,EAAIF,EAAAA,SAAyB,CAAA,CAAE,EAErDG,EAAqBC,EAAAA,YACxBC,GAAsB,CACrBN,EAAiBM,CAAS,EAC1BR,IAAiBQ,CAAS,CAC5B,EACA,CAACR,CAAc,CAAA,EAGXS,EAAeF,EAAAA,YAAY,IAAM,CACrC,MAAMC,EACJP,EAAgB,EAAIA,EAAgB,EAAIG,EAAS,OAAS,EAC5DE,EAAmBE,CAAS,CAC9B,EAAG,CAACP,EAAeG,EAAS,OAAQE,CAAkB,CAAC,EAEjDI,EAAWH,EAAAA,YAAY,IAAM,CACjC,MAAMC,EACJP,EAAgBG,EAAS,OAAS,EAAIH,EAAgB,EAAI,EAC5DK,EAAmBE,CAAS,CAC9B,EAAG,CAACP,EAAeG,EAAS,OAAQE,CAAkB,CAAC,EAEjDK,EAAeC,EAAAA,QACnB,KAAO,CACL,SAAAR,EACA,cAAAH,EACA,SAAAS,EACA,aAAAD,EACA,YAAAJ,EACA,cAAeD,EAAS,MAAA,GAE1B,CAACA,EAAUH,EAAeS,EAAUD,CAAY,CAAA,EAGlD,OACEjC,EAAAA,IAACiB,EAAqB,SAArB,CAA8B,MAAOkB,EACpC,SAAAnC,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,GAAG,iCAAkCJ,CAAS,EACxD,GAAGE,CAAA,CAAA,EAER,CAEJ,EAIasC,EAAuB,CAAC,CACnC,SAAAlC,EACA,GAAGJ,CACL,IAAiC,CAC/B,KAAM,CAAE,cAAA0B,EAAe,YAAAI,EAAa,SAAAD,CAAA,EAAaT,EAAA,EAC3CmB,EAAgBF,EAAAA,QACpB,IAAO,MAAM,QAAQjC,CAAQ,EAAIA,EAAW,CAACA,CAAQ,EACrD,CAACA,CAAQ,CAAA,EAIXoC,OAAAA,EAAAA,UAAU,IAAM,CACVX,EAAS,SAAWU,EAAc,QACpCT,EAAYS,CAAa,CAE7B,EAAG,CAACA,EAAeV,EAAUC,CAAW,CAAC,EAElCS,EAAc,IAAI,CAACE,EAAQC,IAChCzC,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,GACT,0CACAwC,IAAUhB,EAAgB,QAAU,QAAA,EAGrC,GAAG1B,EAEH,SAAAyC,CAAA,EAHIA,EAAO,GAAA,CAKf,CACH,EAIaE,EAAwB,CAAC,CACpC,UAAA7C,EACA,GAAGE,CACL,IAAkC,CAChC,KAAM,CAAE,cAAA4C,CAAA,EAAkBxB,EAAA,EAG1B,OAAIwB,GAAiB,EACZ,KAIP3C,EAAAA,IAAC4C,EAAAA,YAAA,CACC,UAAW3C,EAAAA,GACT,2EACAJ,CAAA,EAEF,YAAY,aACX,GAAGE,CAAA,CAAA,CAGV,EAIa8C,EAAwB,CAAC,CACpC,SAAA1C,EACA,GAAGJ,CACL,IAAkC,CAChC,KAAM,CAAE,aAAAkC,EAAc,cAAAU,CAAA,EAAkBxB,EAAA,EAExC,OACEnB,EAAAA,IAACW,EAAAA,OAAA,CACC,aAAW,kBACX,SAAUgC,GAAiB,EAC3B,QAASV,EACT,KAAK,UACL,KAAK,SACL,QAAQ,QACP,GAAGlC,EAEH,SAAAI,GAAYH,EAAAA,IAAC8C,EAAAA,gBAAA,CAAgB,KAAM,EAAA,CAAI,CAAA,CAAA,CAG9C,EAIaC,EAAoB,CAAC,CAChC,SAAA5C,EACA,GAAGJ,CACL,IAA8B,CAC5B,KAAM,CAAE,SAAAmC,EAAU,cAAAS,CAAA,EAAkBxB,EAAA,EAEpC,OACEnB,EAAAA,IAACW,EAAAA,OAAA,CACC,aAAW,cACX,SAAUgC,GAAiB,EAC3B,QAAST,EACT,KAAK,UACL,KAAK,SACL,QAAQ,QACP,GAAGnC,EAEH,SAAAI,GAAYH,EAAAA,IAACgD,EAAAA,iBAAA,CAAiB,KAAM,EAAA,CAAI,CAAA,CAAA,CAG/C,EAIaC,EAAoB,CAAC,CAChC,UAAApD,EACA,GAAGE,CACL,IAA8B,CAC5B,KAAM,CAAE,cAAA0B,EAAe,cAAAkB,CAAA,EAAkBxB,EAAA,EAEzC,OACEnB,EAAAA,IAACkD,EAAAA,gBAAA,CACC,UAAWjD,EAAAA,GACT,+DACAJ,CAAA,EAED,GAAGE,EAEH,SAAA,GAAG0B,EAAgB,CAAC,OAAOkB,CAAa,EAAA,CAAA,CAG/C,EAIaQ,EAAkBC,EAAAA,KAC7B,CAAC,CAAE,UAAAvD,EAAW,GAAGE,KAAkC,CAGjD,MAAMsD,EAAUC,EAAAA,qBAAA,EAEhB,OACEtD,EAAAA,IAACuD,EAAAA,WAAA,CACC,UAAWtD,EAAAA,GACT,yDACAJ,CAAA,EAEF,QAAAwD,EACC,GAAGtD,CAAA,CAAA,CAGV,EACA,CAACyD,EAAWC,IACVD,EAAU,WAAaC,EAAU,UACjCA,EAAU,cAAgBD,EAAU,WACxC,EAEAL,EAAgB,YAAc,kBAIvB,MAAMO,EAAiB,CAAC,CAC7B,UAAA7D,EACA,SAAAM,EACA,GAAGJ,CACL,IACEC,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,GACT,sDACAJ,CAAA,EAED,GAAGE,EAEH,SAAAI,CAAA,CACH"}