@usetheo/ui 0.13.0 → 0.13.2

package/dist/chunk-75IDWFYX.js

@@ -0,0 +1,134 @@
+"use client";
+import { cn } from './chunk-EWDN56AS.js';
+import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+import { forwardRef, useRef, useState, useCallback, useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ScrollAreaRoot = forwardRef(
+  ({ className, children, orientation = "vertical", size = "thin", type = "hover", ...props }, ref) => /* @__PURE__ */ jsxs(
+    ScrollAreaPrimitive.Root,
+    {
+      "data-slot": "scroll-area",
+      ref,
+      type,
+      className: cn("relative overflow-hidden", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          ScrollAreaPrimitive.Viewport,
+          {
+            className: cn(
+              "h-full w-full rounded-[inherit]",
+              // Smooth scroll-behavior + masked overflow inheriting any inner radius
+              "[&>div]:!block"
+            ),
+            children
+          }
+        ),
+        orientation === "vertical" || orientation === "both" ? /* @__PURE__ */ jsx(ScrollBar, { orientation: "vertical", size }) : null,
+        orientation === "horizontal" || orientation === "both" ? /* @__PURE__ */ jsx(ScrollBar, { orientation: "horizontal", size }) : null,
+        /* @__PURE__ */ jsx(ScrollAreaPrimitive.Corner, { className: "bg-transparent" })
+      ]
+    }
+  )
+);
+ScrollAreaRoot.displayName = "ScrollArea";
+var ScrollBar = forwardRef(({ className, orientation = "vertical", size = "thin", ...props }, ref) => /* @__PURE__ */ jsx(
+  ScrollAreaPrimitive.ScrollAreaScrollbar,
+  {
+    "data-slot": "scroll-area-bar",
+    ref,
+    orientation,
+    className: cn(
+      "z-10 flex touch-none select-none p-0.5 transition-[width,height,background-color] duration-base ease-out-soft",
+      // hover state slightly lifts the track with a near-invisible violet wash
+      "hover:bg-primary/5",
+      orientation === "vertical" && (size === "thin" ? "h-full w-2.5 border-l border-l-transparent" : "h-full w-3 border-l border-l-transparent"),
+      orientation === "horizontal" && (size === "thin" ? "h-2.5 w-full flex-col border-t border-t-transparent" : "h-3 w-full flex-col border-t border-t-transparent"),
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx(
+      ScrollAreaPrimitive.ScrollAreaThumb,
+      {
+        className: cn(
+          "relative flex-1 rounded-full bg-primary/30",
+          "transition-[background-color,box-shadow] duration-fast ease-out-soft",
+          // Theme-aware: glow uses --primary (recolors when theme switches)
+          "hover:bg-primary/55 hover:shadow-[0_0_8px_hsl(var(--primary)/0.35)]",
+          // Drag state uses Radix data-state="visible" + :active
+          "active:bg-primary/75 data-[state=visible]:bg-primary/45"
+        )
+      }
+    )
+  }
+));
+ScrollBar.displayName = "ScrollArea.Bar";
+var ScrollArea = /* @__PURE__ */ Object.assign(ScrollAreaRoot, { Bar: ScrollBar });
+function isNearBottom(metrics, threshold) {
+  return metrics.scrollHeight - metrics.clientHeight - metrics.scrollTop <= threshold;
+}
+function resolveViewport(node) {
+  return node.querySelector("[data-radix-scroll-area-viewport]") ?? node;
+}
+function readMetrics(el) {
+  return { scrollTop: el.scrollTop, scrollHeight: el.scrollHeight, clientHeight: el.clientHeight };
+}
+var DEFAULT_THRESHOLD = 32;
+function useStickToBottom(options = {}) {
+  const threshold = options.threshold ?? DEFAULT_THRESHOLD;
+  const viewportRef = useRef(null);
+  const pinnedRef = useRef(true);
+  const cleanupRef = useRef(null);
+  const [isPinned, setIsPinned] = useState(true);
+  const scrollToBottom = useCallback(() => {
+    const el = viewportRef.current;
+    if (!el) return;
+    el.scrollTop = el.scrollHeight;
+    pinnedRef.current = true;
+    setIsPinned(true);
+  }, []);
+  const scrollRef = useCallback(
+    (node) => {
+      cleanupRef.current?.();
+      cleanupRef.current = null;
+      if (node === null) {
+        viewportRef.current = null;
+        return;
+      }
+      const vp = resolveViewport(node);
+      viewportRef.current = vp;
+      const updatePinned = () => {
+        const pinned = isNearBottom(readMetrics(vp), threshold);
+        pinnedRef.current = pinned;
+        setIsPinned(pinned);
+      };
+      const onScroll = () => updatePinned();
+      const onGrow = () => {
+        if (pinnedRef.current) vp.scrollTop = vp.scrollHeight;
+      };
+      vp.addEventListener("scroll", onScroll, { passive: true });
+      updatePinned();
+      onGrow();
+      const mutationObserver = new MutationObserver(onGrow);
+      mutationObserver.observe(vp, { childList: true, subtree: true, characterData: true });
+      let resizeObserver;
+      if (typeof ResizeObserver !== "undefined") {
+        resizeObserver = new ResizeObserver(onGrow);
+        resizeObserver.observe(vp);
+      }
+      cleanupRef.current = () => {
+        vp.removeEventListener("scroll", onScroll);
+        mutationObserver.disconnect();
+        resizeObserver?.disconnect();
+      };
+    },
+    [threshold]
+  );
+  useEffect(() => () => cleanupRef.current?.(), []);
+  return { scrollRef, isPinned, scrollToBottom };
+}
+
+export { ScrollArea, isNearBottom, useStickToBottom };
+//# sourceMappingURL=chunk-75IDWFYX.js.map
+//# sourceMappingURL=chunk-75IDWFYX.js.map

package/dist/chunk-75IDWFYX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/scroll-area/scroll-area.tsx","../src/components/primitives/scroll-area/use-stick-to-bottom.ts"],"names":[],"mappings":"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","file":"chunk-75IDWFYX.js","sourcesContent":["import * as ScrollAreaPrimitive from \"@radix-ui/react-scroll-area\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementRef } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * ScrollArea — custom scroller with Violet Forge styling.\n *\n * Built on Radix ScrollArea so the native scrollbar is always hidden and the\n * custom thumb stays consistent across Chrome/Firefox/Safari/macOS-trackpad.\n *\n * Visual:\n *   - track is transparent, only the thumb is visible.\n *   - thumb is `--primary` at 25% opacity by default; on hover, 45% with violet glow.\n *   - active drag bumps to 60%.\n *   - the rounded full pill thumb plays well with the brutalist border language\n *     but stays subtle (1.5px wide on rest, 3px on hover).\n *\n * Modes (via `type`):\n *   - \"hover\" (default)  — scrollbar fades in on hover/focus, otherwise hidden.\n *   - \"always\"           — scrollbar always visible.\n *   - \"auto\"             — scrollbar visible only when content overflows.\n *   - \"scroll\"           — Radix-managed: visible only while scrolling.\n */\n\ninterface ScrollAreaProps extends ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root> {\n  /**\n   * Optional override for which scrollbar(s) to render.\n   * Defaults: vertical only. Set to \"both\" for grids/tables with overflow-x.\n   */\n  orientation?: \"vertical\" | \"horizontal\" | \"both\";\n  /**\n   * Thickness of the scrollbar. Default \"thin\" (2.5px → 3.5px on hover).\n   * Use \"regular\" (8px) for content where the scrollbar should be a more prominent target.\n   */\n  size?: \"thin\" | \"regular\";\n}\n\nconst ScrollAreaRoot = forwardRef<ElementRef<typeof ScrollAreaPrimitive.Root>, ScrollAreaProps>(\n  (\n    { className, children, orientation = \"vertical\", size = \"thin\", type = \"hover\", ...props },\n    ref,\n  ) => (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      ref={ref}\n      type={type}\n      className={cn(\"relative overflow-hidden\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        className={cn(\n          \"h-full w-full rounded-[inherit]\",\n          // Smooth scroll-behavior + masked overflow inheriting any inner radius\n          \"[&>div]:!block\",\n        )}\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      {orientation === \"vertical\" || orientation === \"both\" ? (\n        <ScrollBar orientation=\"vertical\" size={size} />\n      ) : null}\n      {orientation === \"horizontal\" || orientation === \"both\" ? (\n        <ScrollBar orientation=\"horizontal\" size={size} />\n      ) : null}\n      <ScrollAreaPrimitive.Corner className=\"bg-transparent\" />\n    </ScrollAreaPrimitive.Root>\n  ),\n);\nScrollAreaRoot.displayName = \"ScrollArea\";\n\ninterface ScrollBarProps\n  extends ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar> {\n  size?: \"thin\" | \"regular\";\n}\n\nconst ScrollBar = forwardRef<\n  ElementRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>,\n  ScrollBarProps\n>(({ className, orientation = \"vertical\", size = \"thin\", ...props }, ref) => (\n  <ScrollAreaPrimitive.ScrollAreaScrollbar\n    data-slot=\"scroll-area-bar\"\n    ref={ref}\n    orientation={orientation}\n    className={cn(\n      \"z-10 flex touch-none select-none p-0.5 transition-[width,height,background-color] duration-base ease-out-soft\",\n      // hover state slightly lifts the track with a near-invisible violet wash\n      \"hover:bg-primary/5\",\n      orientation === \"vertical\" &&\n        (size === \"thin\"\n          ? \"h-full w-2.5 border-l border-l-transparent\"\n          : \"h-full w-3 border-l border-l-transparent\"),\n      orientation === \"horizontal\" &&\n        (size === \"thin\"\n          ? \"h-2.5 w-full flex-col border-t border-t-transparent\"\n          : \"h-3 w-full flex-col border-t border-t-transparent\"),\n      className,\n    )}\n    {...props}\n  >\n    <ScrollAreaPrimitive.ScrollAreaThumb\n      className={cn(\n        \"relative flex-1 rounded-full bg-primary/30\",\n        \"transition-[background-color,box-shadow] duration-fast ease-out-soft\",\n        // Theme-aware: glow uses --primary (recolors when theme switches)\n        \"hover:bg-primary/55 hover:shadow-[0_0_8px_hsl(var(--primary)/0.35)]\",\n        // Drag state uses Radix data-state=\"visible\" + :active\n        \"active:bg-primary/75 data-[state=visible]:bg-primary/45\",\n      )}\n    />\n  </ScrollAreaPrimitive.ScrollAreaScrollbar>\n));\nScrollBar.displayName = \"ScrollArea.Bar\";\n\n// Compound assembly. `ScrollArea.Bar` is the only public surface for the\n// scroll bar. The previous standalone `ScrollBar` re-export was deprecated\n// theater in v0.0.0 (no public consumers exist on a pre-published package),\n// so it was removed cleanly in T7.4 (agent-team-audit-fixes plan).\nconst ScrollArea = /*#__PURE__*/ Object.assign(ScrollAreaRoot, { Bar: ScrollBar });\n\nexport { ScrollArea };\n","\"use client\";\n\n/**\n * `useStickToBottom` (M5-5) — auto-scroll a scroll container to the bottom when\n * its content grows, but ONLY while the user is pinned near the bottom (so it\n * never yanks the view away while they read history). Encapsulates the leaked\n * `[data-radix-scroll-area-viewport]` selector: attach `scrollRef` to a\n * `<ScrollArea>` (or any element) and the hook resolves the real scrollable\n * node internally.\n *\n * Content growth (streamed messages/tokens) is detected with a `MutationObserver`\n * — a scroll container's own box does not resize when content grows inside it, so\n * a ResizeObserver alone would miss it. A `ResizeObserver` is added on top (when\n * available) to also catch box-size changes such as an image finishing load.\n */\nimport { useCallback, useEffect, useRef, useState } from \"react\";\n\nexport interface StickToBottomMetrics {\n  scrollTop: number;\n  scrollHeight: number;\n  clientHeight: number;\n}\n\n/** Pure: is the scroll position within `threshold` px of the bottom? */\nexport function isNearBottom(metrics: StickToBottomMetrics, threshold: number): boolean {\n  return metrics.scrollHeight - metrics.clientHeight - metrics.scrollTop <= threshold;\n}\n\nexport interface UseStickToBottomOptions {\n  /** Px distance from the bottom under which the view is considered pinned. */\n  threshold?: number;\n}\n\nexport interface UseStickToBottomReturn<T extends HTMLElement = HTMLElement> {\n  /** Attach to the `<ScrollArea>` root (or any element). */\n  scrollRef: (node: T | null) => void;\n  /** Whether the view is currently pinned near the bottom. */\n  isPinned: boolean;\n  /** Force-scroll to the bottom and re-pin. */\n  scrollToBottom: () => void;\n}\n\nfunction resolveViewport(node: HTMLElement): HTMLElement {\n  return node.querySelector<HTMLElement>(\"[data-radix-scroll-area-viewport]\") ?? node;\n}\n\nfunction readMetrics(el: HTMLElement): StickToBottomMetrics {\n  return { scrollTop: el.scrollTop, scrollHeight: el.scrollHeight, clientHeight: el.clientHeight };\n}\n\nconst DEFAULT_THRESHOLD = 32;\n\nexport function useStickToBottom<T extends HTMLElement = HTMLElement>(\n  options: UseStickToBottomOptions = {},\n): UseStickToBottomReturn<T> {\n  const threshold = options.threshold ?? DEFAULT_THRESHOLD;\n  const viewportRef = useRef<HTMLElement | null>(null);\n  const pinnedRef = useRef(true);\n  const cleanupRef = useRef<(() => void) | null>(null);\n  const [isPinned, setIsPinned] = useState(true);\n\n  const scrollToBottom = useCallback(() => {\n    const el = viewportRef.current;\n    if (!el) return;\n    el.scrollTop = el.scrollHeight;\n    pinnedRef.current = true;\n    setIsPinned(true);\n  }, []);\n\n  const scrollRef = useCallback(\n    (node: T | null) => {\n      cleanupRef.current?.();\n      cleanupRef.current = null;\n      if (node === null) {\n        viewportRef.current = null;\n        return;\n      }\n      const vp = resolveViewport(node);\n      viewportRef.current = vp;\n\n      const updatePinned = (): void => {\n        const pinned = isNearBottom(readMetrics(vp), threshold);\n        pinnedRef.current = pinned;\n        setIsPinned(pinned);\n      };\n      const onScroll = (): void => updatePinned();\n      // Auto-scroll on growth ONLY while pinned — the guard that prevents yanking\n      // the view away while the user reads history.\n      const onGrow = (): void => {\n        if (pinnedRef.current) vp.scrollTop = vp.scrollHeight;\n      };\n\n      vp.addEventListener(\"scroll\", onScroll, { passive: true });\n      updatePinned();\n      onGrow(); // pin to bottom on attach when already pinned\n\n      // A scroll container's OWN box does not resize when content grows inside\n      // it, so streamed messages/tokens are detected as DOM mutations (the\n      // primary signal). A ResizeObserver additionally catches box-size changes\n      // (e.g. an image finishing load) when the environment provides one.\n      const mutationObserver = new MutationObserver(onGrow);\n      mutationObserver.observe(vp, { childList: true, subtree: true, characterData: true });\n      let resizeObserver: ResizeObserver | undefined;\n      if (typeof ResizeObserver !== \"undefined\") {\n        resizeObserver = new ResizeObserver(onGrow);\n        resizeObserver.observe(vp);\n      }\n      cleanupRef.current = (): void => {\n        vp.removeEventListener(\"scroll\", onScroll);\n        mutationObserver.disconnect();\n        resizeObserver?.disconnect();\n      };\n    },\n    [threshold],\n  );\n\n  useEffect(() => () => cleanupRef.current?.(), []);\n\n  return { scrollRef, isPinned, scrollToBottom };\n}\n"]}

package/dist/chunk-7BQXMG2A.js

@@ -0,0 +1,93 @@
+import { Progress } from './chunk-4EH6F54D.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function defaultFormat(value, max, unit) {
+  return `${value} / ${max}${unit ? ` ${unit}` : ""}`;
+}
+function metricAriaLabel(metric, formatted) {
+  const label = typeof metric.label === "string" ? metric.label : "metric";
+  return `${label}: ${formatted}`;
+}
+var UsageMeter = forwardRef(
+  ({ className, title, action, metrics, compact = false, ...props }, ref) => {
+    const hasHeader = Boolean(title) || Boolean(action);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-slot": "usage-meter",
+        ref,
+        className: cn(
+          "grid gap-3 rounded-xl border border-border bg-card p-4",
+          compact && "gap-2",
+          className
+        ),
+        "data-theo-usage-meter": "",
+        ...props,
+        children: [
+          hasHeader ? /* @__PURE__ */ jsxs("header", { className: "flex items-baseline justify-between gap-3", children: [
+            title ? /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: cn(
+                  "font-mono text-label-caps text-muted-foreground uppercase tracking-wider"
+                ),
+                children: title
+              }
+            ) : /* @__PURE__ */ jsx("span", {}),
+            action ? /* @__PURE__ */ jsx("div", { className: "shrink-0", children: action }) : null
+          ] }) : null,
+          metrics.map((metric, idx) => {
+            const overQuota = metric.value > metric.max;
+            const fmt = metric.formatter ?? defaultFormat;
+            const formatted = fmt(metric.value, metric.max, metric.unit);
+            const intent = overQuota ? "warning" : "default";
+            const key = `${typeof metric.label === "string" ? metric.label : "metric"}-${idx}`;
+            if (compact) {
+              return /* @__PURE__ */ jsx(
+                Progress,
+                {
+                  value: metric.value,
+                  max: metric.max,
+                  intent,
+                  "aria-label": metricAriaLabel(metric, formatted)
+                },
+                key
+              );
+            }
+            return /* @__PURE__ */ jsxs("div", { className: "grid gap-1.5", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-baseline justify-between gap-3 text-body-sm", children: [
+                /* @__PURE__ */ jsx("span", { className: "truncate text-muted-foreground", children: metric.label }),
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: cn(
+                      "shrink-0 font-mono tabular-nums",
+                      overQuota ? "text-warning" : "text-foreground"
+                    ),
+                    children: formatted
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx(
+                Progress,
+                {
+                  value: metric.value,
+                  max: metric.max,
+                  intent,
+                  "aria-label": metricAriaLabel(metric, formatted)
+                }
+              )
+            ] }, key);
+          })
+        ]
+      }
+    );
+  }
+);
+UsageMeter.displayName = "UsageMeter";
+
+export { UsageMeter };
+//# sourceMappingURL=chunk-7BQXMG2A.js.map
+//# sourceMappingURL=chunk-7BQXMG2A.js.map

package/dist/chunk-7BQXMG2A.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/usage-meter/usage-meter.tsx"],"names":[],"mappings":"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","file":"chunk-7BQXMG2A.js","sourcesContent":["import { forwardRef } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport { Progress } from \"../../primitives/progress/index.js\";\n\n/**\n * UsageMeter — multi-metric stacked usage card.\n *\n * PaaS-shape sibling of `<CostMeter>` (which is mono-USD). Displays N\n * metrics with arbitrary units (GB, requests, build-minutes, seats) per\n * the reference TheoCloud dashboard mockup. Each row = label + value/max\n * + `<Progress>` fill bar.\n *\n * Composition:\n *\n *   <UsageMeter\n *     title=\"Last 30 days\"\n *     action={<Badge variant=\"outline\">Upgrade</Badge>}\n *     metrics={[\n *       { label: \"Fast Data Transfer\", value: 0, max: 100, unit: \"GB\" },\n *       { label: \"Edge Requests\", value: 0, max: 1_000_000, unit: \"req\",\n *         formatter: (v, m) => `${v} / ${m >= 1e6 ? `${m / 1e6}M` : m}` },\n *     ]}\n *   />\n *\n * Over-quota detection: when `value > max`, the value text gets the\n * `text-warning` class and the underlying `<Progress>` uses\n * `intent=\"warning\"` (bar fills 100% via Progress's own clamping).\n *\n * `compact` mode renders only the bars (no label/value text) — useful in\n * narrow nav-bar slots.\n *\n * Imports the sibling `<Progress>` primitive via relative path (per RFC\n * dashboard-paas-primitives D3) — primitives must not depend on the\n * `@theokit/ui` barrel.\n */\n\nexport interface UsageMetric {\n  /** Display label (e.g. \"Fast Data Transfer\"). */\n  label: ReactNode;\n  /** Current consumption. */\n  value: number;\n  /** Maximum allowed in the current period. */\n  max: number;\n  /** Unit string (e.g. \"GB\", \"req\", \"min\"). Rendered after value/max. */\n  unit?: string;\n  /** Optional custom formatter — overrides default `${value} / ${max} ${unit}`. */\n  formatter?: (value: number, max: number, unit?: string) => string;\n}\n\nexport interface UsageMeterProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  /** Card title (e.g. \"Last 30 days\", \"This billing period\"). */\n  title?: ReactNode;\n  /** Optional right-aligned action slot (e.g. an Upgrade Badge or Button). */\n  action?: ReactNode;\n  /** Array of metrics to display. Order preserved. */\n  metrics: UsageMetric[];\n  /** When true, show only the bars without label/value text (sparkline mode). */\n  compact?: boolean;\n}\n\nfunction defaultFormat(value: number, max: number, unit?: string): string {\n  return `${value} / ${max}${unit ? ` ${unit}` : \"\"}`;\n}\n\nfunction metricAriaLabel(metric: UsageMetric, formatted: string): string {\n  // Label may be a ReactNode; coerce to string for aria-label.\n  const label = typeof metric.label === \"string\" ? metric.label : \"metric\";\n  return `${label}: ${formatted}`;\n}\n\nconst UsageMeter = forwardRef<HTMLDivElement, UsageMeterProps>(\n  ({ className, title, action, metrics, compact = false, ...props }, ref) => {\n    const hasHeader = Boolean(title) || Boolean(action);\n    return (\n      <div\n        data-slot=\"usage-meter\"\n        ref={ref}\n        className={cn(\n          \"grid gap-3 rounded-xl border border-border bg-card p-4\",\n          compact && \"gap-2\",\n          className,\n        )}\n        data-theo-usage-meter=\"\"\n        {...props}\n      >\n        {hasHeader ? (\n          <header className=\"flex items-baseline justify-between gap-3\">\n            {title ? (\n              <span\n                className={cn(\n                  \"font-mono text-label-caps text-muted-foreground uppercase tracking-wider\",\n                )}\n              >\n                {title}\n              </span>\n            ) : (\n              <span />\n            )}\n            {action ? <div className=\"shrink-0\">{action}</div> : null}\n          </header>\n        ) : null}\n\n        {metrics.map((metric, idx) => {\n          const overQuota = metric.value > metric.max;\n          const fmt = metric.formatter ?? defaultFormat;\n          const formatted = fmt(metric.value, metric.max, metric.unit);\n          const intent = overQuota ? \"warning\" : \"default\";\n          // Each metric needs a stable key. Without a unique id field we\n          // synthesize one from label + idx — duplicates resolve via the\n          // index suffix.\n          const key = `${typeof metric.label === \"string\" ? metric.label : \"metric\"}-${idx}`;\n\n          if (compact) {\n            return (\n              <Progress\n                key={key}\n                value={metric.value}\n                max={metric.max}\n                intent={intent}\n                aria-label={metricAriaLabel(metric, formatted)}\n              />\n            );\n          }\n\n          return (\n            <div key={key} className=\"grid gap-1.5\">\n              <div className=\"flex items-baseline justify-between gap-3 text-body-sm\">\n                <span className=\"truncate text-muted-foreground\">{metric.label}</span>\n                <span\n                  className={cn(\n                    \"shrink-0 font-mono tabular-nums\",\n                    overQuota ? \"text-warning\" : \"text-foreground\",\n                  )}\n                >\n                  {formatted}\n                </span>\n              </div>\n              <Progress\n                value={metric.value}\n                max={metric.max}\n                intent={intent}\n                aria-label={metricAriaLabel(metric, formatted)}\n              />\n            </div>\n          );\n        })}\n      </div>\n    );\n  },\n);\nUsageMeter.displayName = \"UsageMeter\";\n\nexport { UsageMeter };\n"]}

package/dist/chunk-7RFWVNQA.js

@@ -0,0 +1,47 @@
+import { cn } from './chunk-EWDN56AS.js';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import { forwardRef } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var Provider2 = TooltipPrimitive.Provider;
+var Root2 = TooltipPrimitive.Root;
+var Trigger2 = TooltipPrimitive.Trigger;
+var Content2 = forwardRef(({ className, sideOffset = 6, ...props }, ref) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+  TooltipPrimitive.Content,
+  {
+    "data-slot": "tooltip-content",
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 overflow-hidden rounded-md border border-border/40 bg-foreground px-2.5 py-1.5",
+      "text-background text-body-sm shadow-md",
+      "data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-[state=delayed-open]:animate-in",
+      "data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out",
+      "data-[side=top]:slide-in-from-bottom-1 data-[side=bottom]:slide-in-from-top-1",
+      "data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1",
+      className
+    ),
+    ...props
+  }
+) }));
+Content2.displayName = "Tooltip.Content";
+var Tooltip = ({
+  label,
+  side = "top",
+  align = "center",
+  delayDuration = 200,
+  children,
+  ...rootProps
+}) => /* @__PURE__ */ jsx(Provider2, { delayDuration, children: /* @__PURE__ */ jsxs(Root2, { ...rootProps, children: [
+  /* @__PURE__ */ jsx(Trigger2, { asChild: true, children }),
+  /* @__PURE__ */ jsx(Content2, { side, align, children: label })
+] }) });
+var TooltipWithStatics = Tooltip;
+TooltipWithStatics.Provider = Provider2;
+TooltipWithStatics.Root = Root2;
+TooltipWithStatics.Trigger = Trigger2;
+TooltipWithStatics.Content = Content2;
+
+export { TooltipWithStatics };
+//# sourceMappingURL=chunk-7RFWVNQA.js.map
+//# sourceMappingURL=chunk-7RFWVNQA.js.map

package/dist/chunk-7RFWVNQA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/tooltip/tooltip.tsx"],"names":["Provider","Root","Trigger","Content"],"mappings":";;;;;AAcA,IAAMA,SAAAA,GAA4B,gBAAA,CAAA,QAAA;AAClC,IAAMC,KAAAA,GAAwB,gBAAA,CAAA,IAAA;AAC9B,IAAMC,QAAAA,GAA2B,gBAAA,CAAA,OAAA;AAEjC,IAAMC,QAAAA,GAAU,UAAA,CAGd,CAAC,EAAE,SAAA,EAAW,UAAA,GAAa,CAAA,EAAG,GAAG,KAAA,EAAM,EAAG,GAAA,qBAC1C,GAAA,CAAkB,yBAAjB,EACC,QAAA,kBAAA,GAAA;AAAA,EAAkB,gBAAA,CAAA,OAAA;AAAA,EAAjB;AAAA,IACC,WAAA,EAAU,iBAAA;AAAA,IACV,GAAA;AAAA,IACA,UAAA;AAAA,IACA,SAAA,EAAW,EAAA;AAAA,MACT,qFAAA;AAAA,MACA,wCAAA;AAAA,MACA,+GAAA;AAAA,MACA,gGAAA;AAAA,MACA,+EAAA;AAAA,MACA,+EAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG;AAAA;AACN,CAAA,EACF,CACD,CAAA;AACDA,QAAAA,CAAQ,WAAA,GAAc,iBAAA;AActB,IAAM,UAAU,CAAC;AAAA,EACf,KAAA;AAAA,EACA,IAAA,GAAO,KAAA;AAAA,EACP,KAAA,GAAQ,QAAA;AAAA,EACR,aAAA,GAAgB,GAAA;AAAA,EAChB,QAAA;AAAA,EACA,GAAG;AACL,CAAA,qBAEI,GAAA,CAACH,WAAA,EAAS,aAAA,EACR,+BAACC,KAAAA,EAAA,EAAM,GAAG,SAAA,EACR,QAAA,EAAA;AAAA,kBAAA,GAAA,CAACC,QAAAA,EAAA,EAAQ,OAAA,EAAO,IAAA,EAAE,QAAA,EAAS,CAAA;AAAA,kBAC3B,GAAA,CAACC,QAAAA,EAAA,EAAQ,IAAA,EAAY,OAClB,QAAA,EAAA,KAAA,EACH;AAAA,CAAA,EACF,CAAA,EACF,CAAA;AAGJ,IAAM,kBAAA,GAAqB;AAM3B,kBAAA,CAAmB,QAAA,GAAWH,SAAAA;AAC9B,kBAAA,CAAmB,IAAA,GAAOC,KAAAA;AAC1B,kBAAA,CAAmB,OAAA,GAAUC,QAAAA;AAC7B,kBAAA,CAAmB,OAAA,GAAUC,QAAAA","file":"chunk-7RFWVNQA.js","sourcesContent":["import * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementRef, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * Tooltip — built on Radix Tooltip.\n *\n * Visual: dark surface in light mode (and inverse in dark) with rounded-md,\n * shadow-md, text-body-sm. 8px delay-show default.\n *\n * Wrap your app in <Tooltip.Provider> once (or use the default delayDuration here).\n */\n\nconst Provider = TooltipPrimitive.Provider;\nconst Root = TooltipPrimitive.Root;\nconst Trigger = TooltipPrimitive.Trigger;\n\nconst Content = forwardRef<\n  ElementRef<typeof TooltipPrimitive.Content>,\n  ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>\n>(({ className, sideOffset = 6, ...props }, ref) => (\n  <TooltipPrimitive.Portal>\n    <TooltipPrimitive.Content\n      data-slot=\"tooltip-content\"\n      ref={ref}\n      sideOffset={sideOffset}\n      className={cn(\n        \"z-50 overflow-hidden rounded-md border border-border/40 bg-foreground px-2.5 py-1.5\",\n        \"text-background text-body-sm shadow-md\",\n        \"data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-[state=delayed-open]:animate-in\",\n        \"data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out\",\n        \"data-[side=top]:slide-in-from-bottom-1 data-[side=bottom]:slide-in-from-top-1\",\n        \"data-[side=left]:slide-in-from-right-1 data-[side=right]:slide-in-from-left-1\",\n        className,\n      )}\n      {...props}\n    />\n  </TooltipPrimitive.Portal>\n));\nContent.displayName = \"Tooltip.Content\";\n\ninterface TooltipProps extends ComponentPropsWithoutRef<typeof TooltipPrimitive.Root> {\n  label: ReactNode;\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n  align?: \"start\" | \"center\" | \"end\";\n  children: ReactNode;\n}\n\n/**\n * Shorthand: <Tooltip label=\"…\"><Button>…</Button></Tooltip>\n * Wraps Provider + Root + Trigger asChild + Content for the common case.\n * For advanced usage (controlled state, custom content), use Tooltip.Root etc. directly.\n */\nconst Tooltip = ({\n  label,\n  side = \"top\",\n  align = \"center\",\n  delayDuration = 200,\n  children,\n  ...rootProps\n}: TooltipProps) =>\n  (\n    <Provider delayDuration={delayDuration}>\n      <Root {...rootProps}>\n        <Trigger asChild>{children}</Trigger>\n        <Content side={side} align={align}>\n          {label}\n        </Content>\n      </Root>\n    </Provider>\n  ) as ReturnType<typeof Provider>;\n\nconst TooltipWithStatics = Tooltip as typeof Tooltip & {\n  Provider: typeof Provider;\n  Root: typeof Root;\n  Trigger: typeof Trigger;\n  Content: typeof Content;\n};\nTooltipWithStatics.Provider = Provider;\nTooltipWithStatics.Root = Root;\nTooltipWithStatics.Trigger = Trigger;\nTooltipWithStatics.Content = Content;\n\nexport { TooltipWithStatics as Tooltip };\n"]}

package/dist/chunk-ABBXLAJW.js

@@ -0,0 +1,74 @@
+import { cn } from './chunk-EWDN56AS.js';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import { cva } from 'class-variance-authority';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var avatarVariants = cva(
+  [
+    "relative inline-flex shrink-0 overflow-hidden rounded-full",
+    "border border-border/40 bg-muted text-foreground"
+  ],
+  {
+    variants: {
+      size: {
+        xs: "size-6 text-label",
+        sm: "size-7 text-label",
+        md: "size-9 text-body-sm",
+        lg: "size-12 text-body-md",
+        xl: "size-16 text-title-md"
+      },
+      tone: {
+        muted: "bg-muted text-foreground",
+        primary: "bg-primary text-primary-foreground",
+        accent: "bg-accent text-accent-foreground"
+      }
+    },
+    defaultVariants: { size: "md", tone: "muted" }
+  }
+);
+var AvatarRoot = forwardRef(
+  ({ className, size, tone, ...props }, ref) => /* @__PURE__ */ jsx(
+    AvatarPrimitive.Root,
+    {
+      "data-slot": "avatar",
+      "data-size": size,
+      ref,
+      className: cn(avatarVariants({ size, tone }), className),
+      ...props
+    }
+  )
+);
+AvatarRoot.displayName = "Avatar";
+var AvatarImage = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AvatarPrimitive.Image,
+  {
+    "data-slot": "avatar-image",
+    ref,
+    className: cn("aspect-square size-full object-cover", className),
+    ...props
+  }
+));
+AvatarImage.displayName = "Avatar.Image";
+var AvatarFallback = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AvatarPrimitive.Fallback,
+  {
+    "data-slot": "avatar-fallback",
+    ref,
+    className: cn(
+      "flex h-full w-full items-center justify-center font-medium leading-none",
+      className
+    ),
+    delayMs: 300,
+    ...props
+  }
+));
+AvatarFallback.displayName = "Avatar.Fallback";
+var Avatar = /* @__PURE__ */ Object.assign(AvatarRoot, {
+  Image: AvatarImage,
+  Fallback: AvatarFallback
+});
+
+export { Avatar, avatarVariants };
+//# sourceMappingURL=chunk-ABBXLAJW.js.map
+//# sourceMappingURL=chunk-ABBXLAJW.js.map

package/dist/chunk-ABBXLAJW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/avatar/avatar.tsx"],"names":[],"mappings":";;;;;;AAmBA,IAAM,cAAA,GAAiB,GAAA;AAAA,EACrB;AAAA,IACE,4DAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,mBAAA;AAAA,QACJ,EAAA,EAAI,mBAAA;AAAA,QACJ,EAAA,EAAI,qBAAA;AAAA,QACJ,EAAA,EAAI,sBAAA;AAAA,QACJ,EAAA,EAAI;AAAA,OACN;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,KAAA,EAAO,0BAAA;AAAA,QACP,OAAA,EAAS,oCAAA;AAAA,QACT,MAAA,EAAQ;AAAA;AACV,KACF;AAAA,IACA,eAAA,EAAiB,EAAE,IAAA,EAAM,IAAA,EAAM,MAAM,OAAA;AAAQ;AAEjD;AAMA,IAAM,UAAA,GAAa,UAAA;AAAA,EACjB,CAAC,EAAE,SAAA,EAAW,IAAA,EAAM,MAAM,GAAG,KAAA,IAAS,GAAA,qBACpC,GAAA;AAAA,IAAiB,eAAA,CAAA,IAAA;AAAA,IAAhB;AAAA,MACC,WAAA,EAAU,QAAA;AAAA,MACV,WAAA,EAAW,IAAA;AAAA,MACX,GAAA;AAAA,MACA,SAAA,EAAW,GAAG,cAAA,CAAe,EAAE,MAAM,IAAA,EAAM,GAAG,SAAS,CAAA;AAAA,MACtD,GAAG;AAAA;AAAA;AAGV,CAAA;AACA,UAAA,CAAW,WAAA,GAAc,QAAA;AAEzB,IAAM,WAAA,GAAc,WAGlB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAAiB,eAAA,CAAA,KAAA;AAAA,EAAhB;AAAA,IACC,WAAA,EAAU,cAAA;AAAA,IACV,GAAA;AAAA,IACA,SAAA,EAAW,EAAA,CAAG,sCAAA,EAAwC,SAAS,CAAA;AAAA,IAC9D,GAAG;AAAA;AACN,CACD,CAAA;AACD,WAAA,CAAY,WAAA,GAAc,cAAA;AAE1B,IAAM,cAAA,GAAiB,WAGrB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAAiB,eAAA,CAAA,QAAA;AAAA,EAAhB;AAAA,IACC,WAAA,EAAU,iBAAA;AAAA,IACV,GAAA;AAAA,IACA,SAAA,EAAW,EAAA;AAAA,MACT,yEAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,OAAA,EAAS,GAAA;AAAA,IACR,GAAG;AAAA;AACN,CACD,CAAA;AACD,cAAA,CAAe,WAAA,GAAc,iBAAA;AAE7B,IAAM,MAAA,mBAAuB,MAAA,CAAO,MAAA,CAAO,UAAA,EAAY;AAAA,EACrD,KAAA,EAAO,WAAA;AAAA,EACP,QAAA,EAAU;AACZ,CAAC","file":"chunk-ABBXLAJW.js","sourcesContent":["import * as AvatarPrimitive from \"@radix-ui/react-avatar\";\nimport { type VariantProps, cva } from \"class-variance-authority\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementRef } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * Avatar — user/team avatar with safe fallback to initials.\n *\n * Composition:\n *   <Avatar size=\"md\">\n *     <Avatar.Image src=\"…\" alt=\"…\" />\n *     <Avatar.Fallback>AA</Avatar.Fallback>\n *   </Avatar>\n *\n * Built on Radix Avatar (handles image load failures → fallback automatically).\n * Sizes scale on the root; fallback inherits the size's text scale.\n */\n\nconst avatarVariants = cva(\n  [\n    \"relative inline-flex shrink-0 overflow-hidden rounded-full\",\n    \"border border-border/40 bg-muted text-foreground\",\n  ],\n  {\n    variants: {\n      size: {\n        xs: \"size-6 text-label\",\n        sm: \"size-7 text-label\",\n        md: \"size-9 text-body-sm\",\n        lg: \"size-12 text-body-md\",\n        xl: \"size-16 text-title-md\",\n      },\n      tone: {\n        muted: \"bg-muted text-foreground\",\n        primary: \"bg-primary text-primary-foreground\",\n        accent: \"bg-accent text-accent-foreground\",\n      },\n    },\n    defaultVariants: { size: \"md\", tone: \"muted\" },\n  },\n);\n\ninterface AvatarProps\n  extends ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>,\n    VariantProps<typeof avatarVariants> {}\n\nconst AvatarRoot = forwardRef<ElementRef<typeof AvatarPrimitive.Root>, AvatarProps>(\n  ({ className, size, tone, ...props }, ref) => (\n    <AvatarPrimitive.Root\n      data-slot=\"avatar\"\n      data-size={size}\n      ref={ref}\n      className={cn(avatarVariants({ size, tone }), className)}\n      {...props}\n    />\n  ),\n);\nAvatarRoot.displayName = \"Avatar\";\n\nconst AvatarImage = forwardRef<\n  ElementRef<typeof AvatarPrimitive.Image>,\n  ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Image\n    data-slot=\"avatar-image\"\n    ref={ref}\n    className={cn(\"aspect-square size-full object-cover\", className)}\n    {...props}\n  />\n));\nAvatarImage.displayName = \"Avatar.Image\";\n\nconst AvatarFallback = forwardRef<\n  ElementRef<typeof AvatarPrimitive.Fallback>,\n  ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Fallback\n    data-slot=\"avatar-fallback\"\n    ref={ref}\n    className={cn(\n      \"flex h-full w-full items-center justify-center font-medium leading-none\",\n      className,\n    )}\n    delayMs={300}\n    {...props}\n  />\n));\nAvatarFallback.displayName = \"Avatar.Fallback\";\n\nconst Avatar = /*#__PURE__*/ Object.assign(AvatarRoot, {\n  Image: AvatarImage,\n  Fallback: AvatarFallback,\n});\n\nexport { Avatar, avatarVariants };\n"]}

package/dist/chunk-ACZNFEOZ.js

@@ -0,0 +1,180 @@
+"use client";
+import { OTHER_OPTION_VALUE, isOtherValue, digitKeyToIndex } from './chunk-T2OKGV6M.js';
+import { RadioGroup } from './chunk-GC52HWIL.js';
+import { Input } from './chunk-BYUWQ6OP.js';
+import { Label } from './chunk-TY6NTWN5.js';
+import { BadgeWithDot } from './chunk-624AATQZ.js';
+import { Button } from './chunk-25KBUQEQ.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { forwardRef, useId, useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ChoicePrompt = forwardRef(
+  ({
+    className,
+    question,
+    description,
+    badge,
+    options,
+    value,
+    defaultValue,
+    onValueChange,
+    allowOther = false,
+    otherLabel = "Other",
+    otherPlaceholder = "Type your answer\u2026",
+    otherText,
+    onOtherTextChange,
+    enableKeyboardShortcuts = true,
+    showNumbers,
+    confirmLabel = "Confirm",
+    cancelLabel = "Cancel",
+    onConfirm,
+    onCancel,
+    ...props
+  }, ref) => {
+    const baseId = useId();
+    const questionId = `${baseId}-question`;
+    const optionId = (value_) => `${baseId}-opt-${value_}`;
+    const [internalValue, setInternalValue] = useState(defaultValue);
+    const selected = value !== void 0 ? value : internalValue;
+    const [internalOther, setInternalOther] = useState("");
+    const otherValue = otherText !== void 0 ? otherText : internalOther;
+    const numbersVisible = showNumbers ?? enableKeyboardShortcuts;
+    const hasPreview = options.some((option) => option.preview != null);
+    const selectedPreview = options.find((option) => option.value === selected)?.preview;
+    const select = (next) => {
+      if (value === void 0) setInternalValue(next);
+      onValueChange?.(next);
+    };
+    const setOther = (next) => {
+      if (otherText === void 0) setInternalOther(next);
+      onOtherTextChange?.(next);
+    };
+    const handleKeyDown = (event) => {
+      if (!enableKeyboardShortcuts) return;
+      const target = event.target;
+      if (target.tagName === "INPUT" || target.tagName === "TEXTAREA") return;
+      const index = digitKeyToIndex(event.key);
+      if (index === null || index >= options.length) return;
+      const option = options[index];
+      if (!option || option.disabled) return;
+      event.preventDefault();
+      select(option.value);
+    };
+    const confirm = () => {
+      if (!selected) return;
+      onConfirm?.(
+        isOtherValue(selected) ? { value: selected, otherText: otherValue } : { value: selected }
+      );
+    };
+    return /* @__PURE__ */ jsxs(
+      "section",
+      {
+        "data-slot": "choice-prompt",
+        ref,
+        "aria-labelledby": questionId,
+        onKeyDown: handleKeyDown,
+        className: cn(
+          "grid w-full gap-4 rounded-xl border border-border bg-card p-5 text-card-foreground shadow-md",
+          "transition-shadow duration-base ease-out-soft",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("header", { className: "flex items-start justify-between gap-3", children: [
+            /* @__PURE__ */ jsx("h3", { id: questionId, className: "font-display text-foreground text-title-md tracking-tight", children: question }),
+            badge != null ? /* @__PURE__ */ jsx(BadgeWithDot, { variant: "primary", size: "sm", className: "shrink-0", children: badge }) : null
+          ] }),
+          description != null ? /* @__PURE__ */ jsx("p", { className: "text-body-sm text-muted-foreground", children: description }) : null,
+          /* @__PURE__ */ jsxs("div", { className: cn("grid gap-5", hasPreview && "md:grid-cols-2"), children: [
+            /* @__PURE__ */ jsxs(
+              RadioGroup,
+              {
+                "aria-labelledby": questionId,
+                value: selected ?? "",
+                onValueChange: select,
+                className: "gap-2",
+                children: [
+                  options.map((option, index) => /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+                    /* @__PURE__ */ jsx(
+                      RadioGroup.Item,
+                      {
+                        value: option.value,
+                        id: optionId(option.value),
+                        disabled: option.disabled,
+                        className: "mt-0.5"
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      Label,
+                      {
+                        htmlFor: optionId(option.value),
+                        className: "flex flex-1 cursor-pointer flex-col items-start gap-0.5",
+                        children: [
+                          /* @__PURE__ */ jsx("span", { className: "text-body-md text-foreground", children: option.label }),
+                          option.description != null ? /* @__PURE__ */ jsx("span", { className: "text-body-sm text-muted-foreground", children: option.description }) : null
+                        ]
+                      }
+                    ),
+                    numbersVisible && index < 9 ? /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        "aria-hidden": "true",
+                        className: "mt-0.5 shrink-0 rounded border border-border bg-muted px-1.5 font-mono text-label text-muted-foreground",
+                        children: index + 1
+                      }
+                    ) : null
+                  ] }, option.value)),
+                  allowOther ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 border-border/40 border-t pt-2", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+                      /* @__PURE__ */ jsx(
+                        RadioGroup.Item,
+                        {
+                          value: OTHER_OPTION_VALUE,
+                          id: optionId(OTHER_OPTION_VALUE),
+                          className: "mt-0.5"
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        Label,
+                        {
+                          htmlFor: optionId(OTHER_OPTION_VALUE),
+                          className: "flex-1 cursor-pointer text-body-md",
+                          children: otherLabel
+                        }
+                      )
+                    ] }),
+                    isOtherValue(selected) ? /* @__PURE__ */ jsx(
+                      Input,
+                      {
+                        size: "sm",
+                        "aria-label": typeof otherLabel === "string" ? otherLabel : "Other",
+                        placeholder: otherPlaceholder,
+                        value: otherValue,
+                        onChange: (event) => setOther(event.target.value),
+                        className: "ml-7"
+                      }
+                    ) : null
+                  ] }) : null
+                ]
+              }
+            ),
+            hasPreview ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-border/60 bg-muted/40 p-3", children: [
+              /* @__PURE__ */ jsx("p", { className: "mb-2 font-sans text-label-caps text-muted-foreground uppercase tracking-wider", children: "Preview" }),
+              selectedPreview != null ? /* @__PURE__ */ jsx("div", { className: "whitespace-pre-wrap break-words font-mono text-code-sm text-foreground", children: selectedPreview }) : /* @__PURE__ */ jsx("p", { className: "text-body-sm text-muted-foreground", children: "Select an option to preview." })
+            ] }) : null
+          ] }),
+          onConfirm || onCancel ? /* @__PURE__ */ jsxs("footer", { className: "flex items-center justify-end gap-2", children: [
+            onCancel ? /* @__PURE__ */ jsx(Button, { size: "sm", variant: "secondary", onClick: onCancel, children: cancelLabel }) : null,
+            onConfirm ? /* @__PURE__ */ jsx(Button, { size: "sm", variant: "primary", disabled: !selected, onClick: confirm, children: confirmLabel }) : null
+          ] }) : null
+        ]
+      }
+    );
+  }
+);
+ChoicePrompt.displayName = "ChoicePrompt";
+
+export { ChoicePrompt };
+//# sourceMappingURL=chunk-ACZNFEOZ.js.map
+//# sourceMappingURL=chunk-ACZNFEOZ.js.map

package/dist/chunk-ACZNFEOZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/choice-prompt/choice-prompt.tsx"],"names":[],"mappings":"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","file":"chunk-ACZNFEOZ.js","sourcesContent":["\"use client\";\n\nimport { forwardRef, useId, useState } from \"react\";\nimport type { HTMLAttributes, KeyboardEvent, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport {\n  OTHER_OPTION_VALUE,\n  type PromptOption,\n  digitKeyToIndex,\n  isOtherValue,\n} from \"../../../lib/prompt.js\";\nimport { Badge } from \"../../primitives/badge/index.js\";\nimport { Button } from \"../../primitives/button/index.js\";\nimport { Input } from \"../../primitives/input/index.js\";\nimport { Label } from \"../../primitives/label/index.js\";\nimport { RadioGroup } from \"../../primitives/radio-group/index.js\";\n\n/**\n * ChoicePrompt — single-select \"ask the user\" card for agent surfaces.\n *\n * Mirrors the UX of Claude Code's question card: a question with an optional\n * header chip, a list of options each carrying a label + description, optional\n * number-key shortcuts (terminal-style `1`..`9` selection), an injectable\n * free-text \"Other\" option, and a side-by-side preview pane when options carry\n * preview content.\n *\n * Renders one question at a time — sequencing across multiple questions is the\n * consumer's responsibility (there is no built-in flow orchestrator).\n *\n * Controlled or uncontrolled: pass `value` + `onValueChange` to control the\n * selection, or `defaultValue` to let the component own it. Same for the Other\n * text via `otherText` / `onOtherTextChange`.\n */\n\n/** Payload handed to `onConfirm`. */\nexport interface ChoicePromptResult {\n  /** The selected option value (or the reserved Other value). */\n  value: string;\n  /** Present only when the selected value is the synthesized Other option. */\n  otherText?: string;\n}\n\nexport interface ChoicePromptProps extends Omit<HTMLAttributes<HTMLElement>, \"onSelect\"> {\n  /** The question being asked. */\n  question: ReactNode;\n  /** Optional secondary line under the question. */\n  description?: ReactNode;\n  /** Optional short header chip (rendered as a Badge), e.g. \"Deploy\". */\n  badge?: ReactNode;\n  /** The selectable options. */\n  options: PromptOption[];\n  /** Controlled selected value. */\n  value?: string;\n  /** Initial selected value when uncontrolled. */\n  defaultValue?: string;\n  /** Fired with the option value whenever the selection changes. */\n  onValueChange?: (value: string) => void;\n  /** Inject a free-text \"Other\" option as the last row. */\n  allowOther?: boolean;\n  /** Label for the Other row. Defaults to \"Other\". */\n  otherLabel?: ReactNode;\n  /** Placeholder for the Other text field. */\n  otherPlaceholder?: string;\n  /** Controlled Other text. */\n  otherText?: string;\n  /** Fired with the Other text on every keystroke. */\n  onOtherTextChange?: (text: string) => void;\n  /** Enable `1`..`9` number-key selection. Default true. */\n  enableKeyboardShortcuts?: boolean;\n  /** Show the `1`..`9` hint chips next to options. Defaults to the shortcut flag. */\n  showNumbers?: boolean;\n  /** Confirm button label. Defaults to \"Confirm\". Omit `onConfirm` to hide it. */\n  confirmLabel?: ReactNode;\n  /** Cancel button label. Defaults to \"Cancel\". Omit `onCancel` to hide it. */\n  cancelLabel?: ReactNode;\n  /** Pressing Confirm. Receives the selection (and Other text when relevant). */\n  onConfirm?: (result: ChoicePromptResult) => void;\n  /** Pressing Cancel. */\n  onCancel?: () => void;\n}\n\nconst ChoicePrompt = forwardRef<HTMLElement, ChoicePromptProps>(\n  (\n    {\n      className,\n      question,\n      description,\n      badge,\n      options,\n      value,\n      defaultValue,\n      onValueChange,\n      allowOther = false,\n      otherLabel = \"Other\",\n      otherPlaceholder = \"Type your answer…\",\n      otherText,\n      onOtherTextChange,\n      enableKeyboardShortcuts = true,\n      showNumbers,\n      confirmLabel = \"Confirm\",\n      cancelLabel = \"Cancel\",\n      onConfirm,\n      onCancel,\n      ...props\n    },\n    ref,\n  ) => {\n    const baseId = useId();\n    const questionId = `${baseId}-question`;\n    const optionId = (value_: string): string => `${baseId}-opt-${value_}`;\n\n    const [internalValue, setInternalValue] = useState<string | undefined>(defaultValue);\n    const selected = value !== undefined ? value : internalValue;\n\n    const [internalOther, setInternalOther] = useState(\"\");\n    const otherValue = otherText !== undefined ? otherText : internalOther;\n\n    const numbersVisible = showNumbers ?? enableKeyboardShortcuts;\n    const hasPreview = options.some((option) => option.preview != null);\n    const selectedPreview = options.find((option) => option.value === selected)?.preview;\n\n    const select = (next: string): void => {\n      if (value === undefined) setInternalValue(next);\n      onValueChange?.(next);\n    };\n\n    const setOther = (next: string): void => {\n      if (otherText === undefined) setInternalOther(next);\n      onOtherTextChange?.(next);\n    };\n\n    const handleKeyDown = (event: KeyboardEvent<HTMLElement>): void => {\n      if (!enableKeyboardShortcuts) return;\n      const target = event.target as HTMLElement;\n      // Never hijack digits typed into a form field (e.g. the Other input).\n      if (target.tagName === \"INPUT\" || target.tagName === \"TEXTAREA\") return;\n      const index = digitKeyToIndex(event.key);\n      if (index === null || index >= options.length) return;\n      const option = options[index];\n      if (!option || option.disabled) return;\n      event.preventDefault();\n      select(option.value);\n    };\n\n    const confirm = (): void => {\n      if (!selected) return;\n      onConfirm?.(\n        isOtherValue(selected) ? { value: selected, otherText: otherValue } : { value: selected },\n      );\n    };\n\n    return (\n      <section\n        data-slot=\"choice-prompt\"\n        ref={ref}\n        aria-labelledby={questionId}\n        onKeyDown={handleKeyDown}\n        className={cn(\n          \"grid w-full gap-4 rounded-xl border border-border bg-card p-5 text-card-foreground shadow-md\",\n          \"transition-shadow duration-base ease-out-soft\",\n          className,\n        )}\n        {...props}\n      >\n        <header className=\"flex items-start justify-between gap-3\">\n          <h3 id={questionId} className=\"font-display text-foreground text-title-md tracking-tight\">\n            {question}\n          </h3>\n          {badge != null ? (\n            <Badge variant=\"primary\" size=\"sm\" className=\"shrink-0\">\n              {badge}\n            </Badge>\n          ) : null}\n        </header>\n        {description != null ? (\n          <p className=\"text-body-sm text-muted-foreground\">{description}</p>\n        ) : null}\n\n        <div className={cn(\"grid gap-5\", hasPreview && \"md:grid-cols-2\")}>\n          <RadioGroup\n            aria-labelledby={questionId}\n            value={selected ?? \"\"}\n            onValueChange={select}\n            className=\"gap-2\"\n          >\n            {options.map((option, index) => (\n              <div key={option.value} className=\"flex items-start gap-3\">\n                <RadioGroup.Item\n                  value={option.value}\n                  id={optionId(option.value)}\n                  disabled={option.disabled}\n                  className=\"mt-0.5\"\n                />\n                <Label\n                  htmlFor={optionId(option.value)}\n                  className=\"flex flex-1 cursor-pointer flex-col items-start gap-0.5\"\n                >\n                  <span className=\"text-body-md text-foreground\">{option.label}</span>\n                  {option.description != null ? (\n                    <span className=\"text-body-sm text-muted-foreground\">{option.description}</span>\n                  ) : null}\n                </Label>\n                {numbersVisible && index < 9 ? (\n                  <span\n                    aria-hidden=\"true\"\n                    className=\"mt-0.5 shrink-0 rounded border border-border bg-muted px-1.5 font-mono text-label text-muted-foreground\"\n                  >\n                    {index + 1}\n                  </span>\n                ) : null}\n              </div>\n            ))}\n\n            {allowOther ? (\n              <div className=\"flex flex-col gap-2 border-border/40 border-t pt-2\">\n                <div className=\"flex items-start gap-3\">\n                  <RadioGroup.Item\n                    value={OTHER_OPTION_VALUE}\n                    id={optionId(OTHER_OPTION_VALUE)}\n                    className=\"mt-0.5\"\n                  />\n                  <Label\n                    htmlFor={optionId(OTHER_OPTION_VALUE)}\n                    className=\"flex-1 cursor-pointer text-body-md\"\n                  >\n                    {otherLabel}\n                  </Label>\n                </div>\n                {isOtherValue(selected) ? (\n                  <Input\n                    size=\"sm\"\n                    aria-label={typeof otherLabel === \"string\" ? otherLabel : \"Other\"}\n                    placeholder={otherPlaceholder}\n                    value={otherValue}\n                    onChange={(event) => setOther(event.target.value)}\n                    className=\"ml-7\"\n                  />\n                ) : null}\n              </div>\n            ) : null}\n          </RadioGroup>\n\n          {hasPreview ? (\n            <div className=\"rounded-lg border border-border/60 bg-muted/40 p-3\">\n              <p className=\"mb-2 font-sans text-label-caps text-muted-foreground uppercase tracking-wider\">\n                Preview\n              </p>\n              {selectedPreview != null ? (\n                <div className=\"whitespace-pre-wrap break-words font-mono text-code-sm text-foreground\">\n                  {selectedPreview}\n                </div>\n              ) : (\n                <p className=\"text-body-sm text-muted-foreground\">Select an option to preview.</p>\n              )}\n            </div>\n          ) : null}\n        </div>\n\n        {onConfirm || onCancel ? (\n          <footer className=\"flex items-center justify-end gap-2\">\n            {onCancel ? (\n              <Button size=\"sm\" variant=\"secondary\" onClick={onCancel}>\n                {cancelLabel}\n              </Button>\n            ) : null}\n            {onConfirm ? (\n              <Button size=\"sm\" variant=\"primary\" disabled={!selected} onClick={confirm}>\n                {confirmLabel}\n              </Button>\n            ) : null}\n          </footer>\n        ) : null}\n      </section>\n    );\n  },\n);\nChoicePrompt.displayName = \"ChoicePrompt\";\n\nexport { ChoicePrompt };\n"]}