@theokit/ui 0.13.0

package/dist/chunk-UAZOFC4W.js

@@ -0,0 +1,72 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { Minus, TrendingDown, TrendingUp, ArrowUpRight } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+var TREND = {
+  up: { icon: TrendingUp, color: "text-success" },
+  down: { icon: TrendingDown, color: "text-destructive" },
+  flat: { icon: Minus, color: "text-muted-foreground" }
+};
+var StatTile = forwardRef(
+  ({ className, value, label, icon: Icon, delta, onClick, children: _children, ...props }, ref) => {
+    const isInteractive = onClick !== void 0;
+    const TrendIcon = delta !== void 0 ? TREND[delta.trend].icon : null;
+    const trendColor = delta !== void 0 ? TREND[delta.trend].color : "";
+    const inner = /* @__PURE__ */ jsxs(Fragment, { children: [
+      (Icon !== void 0 || isInteractive) && /* @__PURE__ */ jsxs("div", { className: "mb-3 flex items-center justify-between", children: [
+        Icon !== void 0 ? /* @__PURE__ */ jsx("div", { className: "flex size-8 items-center justify-center rounded-lg border border-border/40 bg-muted/40", children: /* @__PURE__ */ jsx(Icon, { "aria-hidden": "true", className: "size-4 text-muted-foreground" }) }) : /* @__PURE__ */ jsx("div", {}),
+        isInteractive ? /* @__PURE__ */ jsx(
+          ArrowUpRight,
+          {
+            "aria-hidden": "true",
+            className: "size-3.5 text-muted-foreground transition-colors group-hover:text-foreground"
+          }
+        ) : null
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "whitespace-nowrap font-bold font-display text-display-md text-foreground tabular-nums leading-none tracking-tight", children: value }),
+      /* @__PURE__ */ jsx("div", { className: "mt-1 font-sans text-body-sm text-muted-foreground", children: label }),
+      delta !== void 0 && TrendIcon !== null ? /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn("mt-2 inline-flex items-center gap-1 font-mono text-label", trendColor),
+          children: [
+            /* @__PURE__ */ jsx(TrendIcon, { "aria-hidden": "true", className: "size-3" }),
+            /* @__PURE__ */ jsx("span", { children: delta.value })
+          ]
+        }
+      ) : null
+    ] });
+    if (isInteractive) {
+      return /* @__PURE__ */ jsx(
+        "button",
+        {
+          ref,
+          type: "button",
+          onClick,
+          className: cn(
+            "group block w-full rounded-xl border border-border/40 bg-card p-5 text-left",
+            "cursor-pointer transition-colors hover:border-primary/30",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+            className
+          ),
+          ...props,
+          children: inner
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn("rounded-xl border border-border/40 bg-card p-5", className),
+        children: inner
+      }
+    );
+  }
+);
+StatTile.displayName = "StatTile";
+
+export { StatTile };
+//# sourceMappingURL=chunk-UAZOFC4W.js.map
+//# sourceMappingURL=chunk-UAZOFC4W.js.map

package/dist/chunk-UAZOFC4W.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/stat-tile/stat-tile.tsx"],"names":[],"mappings":"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","file":"chunk-UAZOFC4W.js","sourcesContent":["import { ArrowUpRight, Minus, TrendingDown, TrendingUp } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { ButtonHTMLAttributes, ElementType, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * StatTile — big number + label + optional delta + optional icon.\n *\n * Dual mode based on `onClick`:\n *   - With onClick → renders as `<button>` with hover state + trailing\n *     ArrowUpRight chevron (navigation affordance).\n *   - Without onClick → renders as static `<div>`.\n *\n * Delta trend drives icon + color: up=success/TrendingUp, down=destructive/\n * TrendingDown, flat=muted/Minus. Big value uses font-display + tabular-nums.\n *\n * @example\n *   <StatTile value=\"42\" label=\"Projects\" />\n *   <StatTile value=\"$1,234\" label=\"MRR\" icon={DollarSign}\n *             delta={{ value: \"+12%\", trend: \"up\" }} onClick={openBilling} />\n */\nexport interface StatTileProps\n  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"type\" | \"value\"> {\n  value: ReactNode;\n  label: ReactNode;\n  icon?: ElementType;\n  delta?: { value: ReactNode; trend: \"up\" | \"down\" | \"flat\" };\n}\n\nconst TREND: Record<\"up\" | \"down\" | \"flat\", { icon: ElementType; color: string }> = {\n  up: { icon: TrendingUp, color: \"text-success\" },\n  down: { icon: TrendingDown, color: \"text-destructive\" },\n  flat: { icon: Minus, color: \"text-muted-foreground\" },\n};\n\nconst StatTile = forwardRef<HTMLElement, StatTileProps>(\n  ({ className, value, label, icon: Icon, delta, onClick, children: _children, ...props }, ref) => {\n    const isInteractive = onClick !== undefined;\n    const TrendIcon = delta !== undefined ? TREND[delta.trend].icon : null;\n    const trendColor = delta !== undefined ? TREND[delta.trend].color : \"\";\n\n    const inner = (\n      <>\n        {(Icon !== undefined || isInteractive) && (\n          <div className=\"mb-3 flex items-center justify-between\">\n            {Icon !== undefined ? (\n              <div className=\"flex size-8 items-center justify-center rounded-lg border border-border/40 bg-muted/40\">\n                <Icon aria-hidden=\"true\" className=\"size-4 text-muted-foreground\" />\n              </div>\n            ) : (\n              <div />\n            )}\n            {isInteractive ? (\n              <ArrowUpRight\n                aria-hidden=\"true\"\n                className=\"size-3.5 text-muted-foreground transition-colors group-hover:text-foreground\"\n              />\n            ) : null}\n          </div>\n        )}\n        <div className=\"whitespace-nowrap font-bold font-display text-display-md text-foreground tabular-nums leading-none tracking-tight\">\n          {value}\n        </div>\n        <div className=\"mt-1 font-sans text-body-sm text-muted-foreground\">{label}</div>\n        {delta !== undefined && TrendIcon !== null ? (\n          <div\n            className={cn(\"mt-2 inline-flex items-center gap-1 font-mono text-label\", trendColor)}\n          >\n            <TrendIcon aria-hidden=\"true\" className=\"size-3\" />\n            <span>{delta.value}</span>\n          </div>\n        ) : null}\n      </>\n    );\n\n    if (isInteractive) {\n      return (\n        <button\n          ref={ref as React.Ref<HTMLButtonElement>}\n          type=\"button\"\n          onClick={onClick}\n          className={cn(\n            \"group block w-full rounded-xl border border-border/40 bg-card p-5 text-left\",\n            \"cursor-pointer transition-colors hover:border-primary/30\",\n            \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n            className,\n          )}\n          {...props}\n        >\n          {inner}\n        </button>\n      );\n    }\n\n    return (\n      <div\n        ref={ref as React.Ref<HTMLDivElement>}\n        className={cn(\"rounded-xl border border-border/40 bg-card p-5\", className)}\n      >\n        {inner}\n      </div>\n    );\n  },\n);\nStatTile.displayName = \"StatTile\";\n\nexport { StatTile };\n"]}

package/dist/chunk-UGKI466V.js

@@ -0,0 +1,12 @@
+import { createContext, useContext } from 'react';
+
+// src/lib/live-region-context.tsx
+var LiveRegionContext = createContext(false);
+var LiveRegionProvider = LiveRegionContext.Provider;
+function useInLiveRegion() {
+  return useContext(LiveRegionContext);
+}
+
+export { LiveRegionProvider, useInLiveRegion };
+//# sourceMappingURL=chunk-UGKI466V.js.map
+//# sourceMappingURL=chunk-UGKI466V.js.map

package/dist/chunk-UGKI466V.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/live-region-context.tsx"],"names":[],"mappings":";;;AA8CA,IAAM,iBAAA,GAAoB,cAAuB,KAAK,CAAA;AAE/C,IAAM,qBAAqB,iBAAA,CAAkB;AAE7C,SAAS,eAAA,GAA2B;AACzC,EAAA,OAAO,WAAW,iBAAiB,CAAA;AACrC","file":"chunk-UGKI466V.js","sourcesContent":["import { createContext, useContext } from \"react\";\n\n/**\n * LiveRegionContext — coordinates `aria-live` declarations across nested\n * components so screen readers don't announce content twice.\n *\n * T4.1 (MF-4, edge-case review). Problem: a container component that\n * declares `role=\"log\" aria-live=\"polite\"` (e.g. `ChatThread`,\n * `AgentStream`) may render a child component that ALSO declares its own\n * `role=\"status\" aria-live=\"polite\"` (e.g. `AgentStreaming`,\n * `AgentErrorCard`). NVDA/JAWS/VoiceOver treat each live region as an\n * independent announcement source, so updates to the child trigger TWO\n * announcements — once from the inner status, once because the outer\n * log observes the DOM mutation. Result: stutter on every streaming\n * token, every new toast, every skeleton mount inside a log.\n *\n * Solution: container components wrap their content with\n * `<LiveRegionProvider value={true}>`. Child components call\n * `useInLiveRegion()` and omit their own `aria-live` / `role` when the\n * context is true. The outer region remains the single announcement\n * source.\n *\n * Default is `false` so standalone components (e.g., a single\n * `AgentStreaming` placed directly in a page) keep their original\n * announcement semantics with zero migration cost.\n *\n * @example\n *   // Container declares the live region\n *   <LiveRegionProvider value={true}>\n *     <div role=\"log\" aria-live=\"polite\">\n *       {children}\n *     </div>\n *   </LiveRegionProvider>\n *\n *   // Child reads context to decide its own ARIA attrs\n *   const inLiveRegion = useInLiveRegion();\n *   return (\n *     <div\n *       role={inLiveRegion ? undefined : \"status\"}\n *       aria-live={inLiveRegion ? undefined : \"polite\"}\n *     >\n *       ...\n *     </div>\n *   );\n */\n\nconst LiveRegionContext = createContext<boolean>(false);\n\nexport const LiveRegionProvider = LiveRegionContext.Provider;\n\nexport function useInLiveRegion(): boolean {\n  return useContext(LiveRegionContext);\n}\n"]}

package/dist/chunk-VM4RMQQN.js

@@ -0,0 +1,11 @@
+// src/types/mode.ts
+var ALL_MODES = ["chat", "code", "infra"];
+var MODE_LABEL = {
+  chat: "Chat",
+  code: "Code",
+  infra: "Infra"
+};
+
+export { ALL_MODES, MODE_LABEL };
+//# sourceMappingURL=chunk-VM4RMQQN.js.map
+//# sourceMappingURL=chunk-VM4RMQQN.js.map

package/dist/chunk-VM4RMQQN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/types/mode.ts"],"names":[],"mappings":";AAcO,IAAM,SAAA,GAAiC,CAAC,MAAA,EAAQ,MAAA,EAAQ,OAAO;AAG/D,IAAM,UAAA,GAAmC;AAAA,EAC9C,IAAA,EAAM,MAAA;AAAA,EACN,IAAA,EAAM,MAAA;AAAA,EACN,KAAA,EAAO;AACT","file":"chunk-VM4RMQQN.js","sourcesContent":["/**\n * Mode — top-level density / domain the agent session is operating in.\n *\n * `chat`  — conversational Q&A, lean UI.\n * `code`  — code agent: read/plan/edit/verify inside the repo.\n * `infra` — operate the deployed system: metrics, deploys, logs, rollback.\n *\n * Used everywhere resources can be scoped per-mode (Skills, Agents, Rules,\n * SystemPrompt overrides, Sessions, …). `modes?: Mode[]` on a resource means\n * \"only available in these modes\"; omitting `modes` means \"available\n * globally\".\n */\nexport type Mode = \"chat\" | \"code\" | \"infra\";\n\nexport const ALL_MODES: ReadonlyArray<Mode> = [\"chat\", \"code\", \"infra\"];\n\n/** Friendly label per mode — render in chips, headers, badges. */\nexport const MODE_LABEL: Record<Mode, string> = {\n  chat: \"Chat\",\n  code: \"Code\",\n  infra: \"Infra\",\n};\n"]}

package/dist/chunk-VQ37VLAS.js

@@ -0,0 +1,54 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { FileText, FileCode, FileSpreadsheet, FileImage, File, X } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var typeIcon = {
+  image: FileImage,
+  spreadsheet: FileSpreadsheet,
+  code: FileCode,
+  text: FileText
+};
+var AttachmentChip = forwardRef(
+  ({ className, attachment, onRemove, ...props }, ref) => {
+    const Icon = (attachment.type ? typeIcon[attachment.type] : void 0) ?? File;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "inline-flex max-w-[18rem] items-center gap-2 rounded-md border border-border/40 bg-muted/60 px-2 py-1",
+          "font-mono text-code-sm text-muted-foreground",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(Icon, { className: "size-3.5 shrink-0 text-primary", "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx("span", { className: "truncate text-foreground", title: attachment.name, children: attachment.name }),
+          attachment.size ? /* @__PURE__ */ jsxs("span", { children: [
+            "\xB7 ",
+            attachment.size
+          ] }) : null,
+          onRemove ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => onRemove(attachment.id),
+              "aria-label": `Remove ${attachment.name}`,
+              className: cn(
+                "ml-1 rounded-sm p-0.5 text-muted-foreground transition-colors hover:bg-muted hover:text-destructive",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+              ),
+              children: /* @__PURE__ */ jsx(X, { className: "size-3" })
+            }
+          ) : null
+        ]
+      }
+    );
+  }
+);
+AttachmentChip.displayName = "AttachmentChip";
+
+export { AttachmentChip };
+//# sourceMappingURL=chunk-VQ37VLAS.js.map
+//# sourceMappingURL=chunk-VQ37VLAS.js.map

package/dist/chunk-VQ37VLAS.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/attachment-chip/attachment-chip.tsx"],"names":[],"mappings":";;;;;AAOA,IAAM,QAAA,GAA0C;AAAA,EAC9C,KAAA,EAAO,SAAA;AAAA,EACP,WAAA,EAAa,eAAA;AAAA,EACb,IAAA,EAAM,QAAA;AAAA,EACN,IAAA,EAAM;AACR,CAAA;AAaA,IAAM,cAAA,GAAiB,UAAA;AAAA,EACrB,CAAC,EAAE,SAAA,EAAW,UAAA,EAAY,UAAU,GAAG,KAAA,IAAS,GAAA,KAAQ;AACtD,IAAA,MAAM,QAAuB,UAAA,CAAW,IAAA,GAAO,SAAS,UAAA,CAAW,IAAI,IAAI,MAAA,KAAc,IAAA;AACzF,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,uGAAA;AAAA,UACA,8CAAA;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAU,gCAAA,EAAiC,aAAA,EAAY,MAAA,EAAO,CAAA;AAAA,0BACpE,GAAA,CAAC,UAAK,SAAA,EAAU,0BAAA,EAA2B,OAAO,UAAA,CAAW,IAAA,EAC1D,qBAAW,IAAA,EACd,CAAA;AAAA,UACC,UAAA,CAAW,IAAA,mBAAO,IAAA,CAAC,MAAA,EAAA,EAAK,QAAA,EAAA;AAAA,YAAA,OAAA;AAAA,YAAG,UAAA,CAAW;AAAA,WAAA,EAAK,CAAA,GAAU,IAAA;AAAA,UACrD,QAAA,mBACC,GAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,IAAA,EAAK,QAAA;AAAA,cACL,OAAA,EAAS,MAAM,QAAA,CAAS,UAAA,CAAW,EAAE,CAAA;AAAA,cACrC,YAAA,EAAY,CAAA,OAAA,EAAU,UAAA,CAAW,IAAI,CAAA,CAAA;AAAA,cACrC,SAAA,EAAW,EAAA;AAAA,gBACT,qGAAA;AAAA,gBACA;AAAA,eACF;AAAA,cAEA,QAAA,kBAAA,GAAA,CAAC,CAAA,EAAA,EAAE,SAAA,EAAU,QAAA,EAAS;AAAA;AAAA,WACxB,GACE;AAAA;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AACA,cAAA,CAAe,WAAA,GAAc,gBAAA","file":"chunk-VQ37VLAS.js","sourcesContent":["import { File, FileCode, FileImage, FileSpreadsheet, FileText, X } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { HTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport type { IconComponent } from \"../../../lib/types.js\";\nimport type { Attachment } from \"../../../types/chat.js\";\n\nconst typeIcon: Record<string, IconComponent> = {\n  image: FileImage,\n  spreadsheet: FileSpreadsheet,\n  code: FileCode,\n  text: FileText,\n};\n\ninterface AttachmentChipProps extends HTMLAttributes<HTMLDivElement> {\n  attachment: Attachment;\n  onRemove?: (id: string) => void;\n}\n\n/**\n * AttachmentChip — file pill shown in chat composer or message attachments row.\n *\n * Visual: rounded chip with type-icon + name + size + optional remove button.\n * Truncates the name with `text-ellipsis`; full name available via title.\n */\nconst AttachmentChip = forwardRef<HTMLDivElement, AttachmentChipProps>(\n  ({ className, attachment, onRemove, ...props }, ref) => {\n    const Icon: IconComponent = (attachment.type ? typeIcon[attachment.type] : undefined) ?? File;\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          \"inline-flex max-w-[18rem] items-center gap-2 rounded-md border border-border/40 bg-muted/60 px-2 py-1\",\n          \"font-mono text-code-sm text-muted-foreground\",\n          className,\n        )}\n        {...props}\n      >\n        <Icon className=\"size-3.5 shrink-0 text-primary\" aria-hidden=\"true\" />\n        <span className=\"truncate text-foreground\" title={attachment.name}>\n          {attachment.name}\n        </span>\n        {attachment.size ? <span>· {attachment.size}</span> : null}\n        {onRemove ? (\n          <button\n            type=\"button\"\n            onClick={() => onRemove(attachment.id)}\n            aria-label={`Remove ${attachment.name}`}\n            className={cn(\n              \"ml-1 rounded-sm p-0.5 text-muted-foreground transition-colors hover:bg-muted hover:text-destructive\",\n              \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n            )}\n          >\n            <X className=\"size-3\" />\n          </button>\n        ) : null}\n      </div>\n    );\n  },\n);\nAttachmentChip.displayName = \"AttachmentChip\";\n\nexport { AttachmentChip };\n"]}

package/dist/chunk-VT7VSYH5.js

@@ -0,0 +1,73 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { PauseCircle, XCircle, AlertCircle, CheckCircle2, Loader2, Clock } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var STATUS_META = {
+  queued: {
+    icon: Clock,
+    label: "Queued",
+    className: "border-border bg-muted text-muted-foreground"
+  },
+  in_progress: {
+    icon: Loader2,
+    label: "In progress",
+    className: "border-primary/40 bg-primary/10 text-primary",
+    spin: true
+  },
+  finished: {
+    icon: CheckCircle2,
+    label: "Done",
+    className: "border-emerald-500/40 bg-emerald-500/10 text-emerald-600 dark:text-emerald-400"
+  },
+  error: {
+    icon: AlertCircle,
+    label: "Error",
+    className: "border-destructive/40 bg-destructive/10 text-destructive"
+  },
+  cancelled: {
+    icon: XCircle,
+    label: "Cancelled",
+    className: "border-border bg-muted text-muted-foreground"
+  },
+  interrupted: {
+    icon: PauseCircle,
+    label: "Interrupted",
+    className: "border-amber-500/40 bg-amber-500/10 text-amber-600 dark:text-amber-400"
+  }
+};
+var RunStatusPill = forwardRef(
+  ({ status, detail, className, "data-testid": dataTestId, ...rest }, ref) => {
+    const meta = STATUS_META[status];
+    const Icon = meta.icon;
+    return /* @__PURE__ */ jsxs(
+      "span",
+      {
+        ref,
+        role: "status",
+        "aria-live": "polite",
+        className: cn(
+          "inline-flex items-center gap-1.5 rounded-full border px-2 py-0.5 font-medium text-xs",
+          meta.className,
+          className
+        ),
+        "data-testid": dataTestId ?? "run-status-pill",
+        "data-status": status,
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsx(Icon, { className: cn("size-3", meta.spin && "animate-spin"), "aria-hidden": true }),
+          /* @__PURE__ */ jsx("span", { children: meta.label }),
+          detail !== void 0 && detail.length > 0 && /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground", "data-testid": "run-status-detail", children: [
+            " \xB7 ",
+            detail
+          ] })
+        ]
+      }
+    );
+  }
+);
+RunStatusPill.displayName = "RunStatusPill";
+
+export { RunStatusPill };
+//# sourceMappingURL=chunk-VT7VSYH5.js.map
+//# sourceMappingURL=chunk-VT7VSYH5.js.map

package/dist/chunk-VT7VSYH5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/run-status-pill/run-status-pill.tsx"],"names":[],"mappings":";;;;;AAwCA,IAAM,WAAA,GAA6C;AAAA,EACjD,MAAA,EAAQ;AAAA,IACN,IAAA,EAAM,KAAA;AAAA,IACN,KAAA,EAAO,QAAA;AAAA,IACP,SAAA,EAAW;AAAA,GACb;AAAA,EACA,WAAA,EAAa;AAAA,IACX,IAAA,EAAM,OAAA;AAAA,IACN,KAAA,EAAO,aAAA;AAAA,IACP,SAAA,EAAW,8CAAA;AAAA,IACX,IAAA,EAAM;AAAA,GACR;AAAA,EACA,QAAA,EAAU;AAAA,IACR,IAAA,EAAM,YAAA;AAAA,IACN,KAAA,EAAO,MAAA;AAAA,IACP,SAAA,EAAW;AAAA,GACb;AAAA,EACA,KAAA,EAAO;AAAA,IACL,IAAA,EAAM,WAAA;AAAA,IACN,KAAA,EAAO,OAAA;AAAA,IACP,SAAA,EAAW;AAAA,GACb;AAAA,EACA,SAAA,EAAW;AAAA,IACT,IAAA,EAAM,OAAA;AAAA,IACN,KAAA,EAAO,WAAA;AAAA,IACP,SAAA,EAAW;AAAA,GACb;AAAA,EACA,WAAA,EAAa;AAAA,IACX,IAAA,EAAM,WAAA;AAAA,IACN,KAAA,EAAO,aAAA;AAAA,IACP,SAAA,EAAW;AAAA;AAEf,CAAA;AAEO,IAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,CAAC,EAAE,MAAA,EAAQ,MAAA,EAAQ,SAAA,EAAW,eAAe,UAAA,EAAY,GAAG,IAAA,EAAK,EAAG,GAAA,KAAQ;AAC1E,IAAA,MAAM,IAAA,GAAO,YAAY,MAAM,CAAA;AAC/B,IAAA,MAAM,OAAO,IAAA,CAAK,IAAA;AAClB,IAAA,uBACE,IAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QAEA,IAAA,EAAK,QAAA;AAAA,QACL,WAAA,EAAU,QAAA;AAAA,QACV,SAAA,EAAW,EAAA;AAAA,UACT,sFAAA;AAAA,UACA,IAAA,CAAK,SAAA;AAAA,UACL;AAAA,SACF;AAAA,QACA,eAAa,UAAA,IAAc,iBAAA;AAAA,QAC3B,aAAA,EAAa,MAAA;AAAA,QACZ,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,WAAW,EAAA,CAAG,QAAA,EAAU,KAAK,IAAA,IAAQ,cAAc,CAAA,EAAG,aAAA,EAAW,IAAA,EAAC,CAAA;AAAA,0BACxE,GAAA,CAAC,MAAA,EAAA,EAAM,QAAA,EAAA,IAAA,CAAK,KAAA,EAAM,CAAA;AAAA,UACjB,MAAA,KAAW,MAAA,IAAa,MAAA,CAAO,MAAA,GAAS,CAAA,yBACtC,MAAA,EAAA,EAAK,SAAA,EAAU,uBAAA,EAAwB,aAAA,EAAY,mBAAA,EACjD,QAAA,EAAA;AAAA,YAAA,QAAA;AAAA,YACA;AAAA,WAAA,EACH;AAAA;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AACA,aAAA,CAAc,WAAA,GAAc,eAAA","file":"chunk-VT7VSYH5.js","sourcesContent":["import {\n  AlertCircle,\n  CheckCircle2,\n  Clock,\n  Loader2,\n  type LucideIcon,\n  PauseCircle,\n  XCircle,\n} from \"lucide-react\";\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * RunStatusPill — compact status indicator for Run/Task lifecycle states.\n * Mirrors OpenClaw's `Run status: In progress | Done | Interrupted` pill.\n * Closed enum mirrors SDK `Task` state (D362).\n */\n\nexport type RunStatus =\n  | \"queued\"\n  | \"in_progress\"\n  | \"finished\"\n  | \"error\"\n  | \"cancelled\"\n  | \"interrupted\";\n\nexport interface RunStatusPillProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"title\"> {\n  status: RunStatus;\n  detail?: string;\n  \"data-testid\"?: string;\n}\n\ninterface StatusMeta {\n  icon: LucideIcon;\n  label: string;\n  className: string;\n  spin?: boolean;\n}\n\nconst STATUS_META: Record<RunStatus, StatusMeta> = {\n  queued: {\n    icon: Clock,\n    label: \"Queued\",\n    className: \"border-border bg-muted text-muted-foreground\",\n  },\n  in_progress: {\n    icon: Loader2,\n    label: \"In progress\",\n    className: \"border-primary/40 bg-primary/10 text-primary\",\n    spin: true,\n  },\n  finished: {\n    icon: CheckCircle2,\n    label: \"Done\",\n    className: \"border-emerald-500/40 bg-emerald-500/10 text-emerald-600 dark:text-emerald-400\",\n  },\n  error: {\n    icon: AlertCircle,\n    label: \"Error\",\n    className: \"border-destructive/40 bg-destructive/10 text-destructive\",\n  },\n  cancelled: {\n    icon: XCircle,\n    label: \"Cancelled\",\n    className: \"border-border bg-muted text-muted-foreground\",\n  },\n  interrupted: {\n    icon: PauseCircle,\n    label: \"Interrupted\",\n    className: \"border-amber-500/40 bg-amber-500/10 text-amber-600 dark:text-amber-400\",\n  },\n};\n\nexport const RunStatusPill = forwardRef<HTMLSpanElement, RunStatusPillProps>(\n  ({ status, detail, className, \"data-testid\": dataTestId, ...rest }, ref) => {\n    const meta = STATUS_META[status];\n    const Icon = meta.icon;\n    return (\n      <span\n        ref={ref}\n        // biome-ignore lint/a11y/useSemanticElements: inline status badge — <span role=\"status\"> keeps it phrasing-content compatible inside chat headers and table cells, where the implicit <output> placement would break layout\n        role=\"status\"\n        aria-live=\"polite\"\n        className={cn(\n          \"inline-flex items-center gap-1.5 rounded-full border px-2 py-0.5 font-medium text-xs\",\n          meta.className,\n          className,\n        )}\n        data-testid={dataTestId ?? \"run-status-pill\"}\n        data-status={status}\n        {...rest}\n      >\n        <Icon className={cn(\"size-3\", meta.spin && \"animate-spin\")} aria-hidden />\n        <span>{meta.label}</span>\n        {detail !== undefined && detail.length > 0 && (\n          <span className=\"text-muted-foreground\" data-testid=\"run-status-detail\">\n            {\" · \"}\n            {detail}\n          </span>\n        )}\n      </span>\n    );\n  },\n);\nRunStatusPill.displayName = \"RunStatusPill\";\n"]}

package/dist/chunk-VTIRUCLZ.js

@@ -0,0 +1,57 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { Wrench, ChevronRight } from 'lucide-react';
+import { forwardRef, useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ToolCall = forwardRef(
+  ({ className, name, summary, detail, defaultOpen, hideIcon, ...props }, ref) => {
+    const [open, setOpen] = useState(defaultOpen ?? false);
+    const expandable = detail !== void 0;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn("rounded-md border border-border/40 bg-muted/30", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => expandable && setOpen((v) => !v),
+              "aria-expanded": expandable ? open : void 0,
+              disabled: !expandable,
+              className: cn(
+                "flex w-full items-center gap-2 px-3 py-2 text-left",
+                "font-sans text-body-sm text-foreground",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+                expandable && "cursor-pointer hover:bg-muted/60"
+              ),
+              children: [
+                !hideIcon ? /* @__PURE__ */ jsx(Wrench, { className: "size-3.5 shrink-0 text-primary", "aria-hidden": "true" }) : null,
+                name ? /* @__PURE__ */ jsx("span", { className: "font-mono text-code-sm text-muted-foreground", children: name }) : null,
+                /* @__PURE__ */ jsx("span", { className: "flex-1 truncate", children: summary }),
+                expandable ? /* @__PURE__ */ jsx(
+                  ChevronRight,
+                  {
+                    className: cn(
+                      "size-3.5 text-muted-foreground transition-transform",
+                      open && "rotate-90"
+                    ),
+                    "aria-hidden": "true"
+                  }
+                ) : null
+              ]
+            }
+          ),
+          expandable && open ? /* @__PURE__ */ jsx("div", { className: "border-border/40 border-t bg-card px-3 py-2", children: detail }) : null
+        ]
+      }
+    );
+  }
+);
+ToolCall.displayName = "ToolCall";
+
+export { ToolCall };
+//# sourceMappingURL=chunk-VTIRUCLZ.js.map
+//# sourceMappingURL=chunk-VTIRUCLZ.js.map

package/dist/chunk-VTIRUCLZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/tool-call/tool-call.tsx"],"names":[],"mappings":";;;;;AAiCA,IAAM,QAAA,GAAW,UAAA;AAAA,EACf,CAAC,EAAE,SAAA,EAAW,IAAA,EAAM,OAAA,EAAS,MAAA,EAAQ,WAAA,EAAa,QAAA,EAAU,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAC9E,IAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,QAAA,CAAS,eAAe,KAAK,CAAA;AACrD,IAAA,MAAM,aAAa,MAAA,KAAW,MAAA;AAC9B,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA,CAAG,gDAAA,EAAkD,SAAS,CAAA;AAAA,QACxE,GAAG,KAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,IAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,IAAA,EAAK,QAAA;AAAA,cACL,SAAS,MAAM,UAAA,IAAc,QAAQ,CAAC,CAAA,KAAM,CAAC,CAAC,CAAA;AAAA,cAC9C,eAAA,EAAe,aAAa,IAAA,GAAO,MAAA;AAAA,cACnC,UAAU,CAAC,UAAA;AAAA,cACX,SAAA,EAAW,EAAA;AAAA,gBACT,oDAAA;AAAA,gBACA,wCAAA;AAAA,gBACA,0IAAA;AAAA,gBACA,UAAA,IAAc;AAAA,eAChB;AAAA,cAEC,QAAA,EAAA;AAAA,gBAAA,CAAC,2BACA,GAAA,CAAC,MAAA,EAAA,EAAO,WAAU,gCAAA,EAAiC,aAAA,EAAY,QAAO,CAAA,GACpE,IAAA;AAAA,gBACH,uBACC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,8CAAA,EAAgD,gBAAK,CAAA,GACnE,IAAA;AAAA,gCACJ,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,iBAAA,EAAmB,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,gBAC1C,UAAA,mBACC,GAAA;AAAA,kBAAC,YAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAW,EAAA;AAAA,sBACT,qDAAA;AAAA,sBACA,IAAA,IAAQ;AAAA,qBACV;AAAA,oBACA,aAAA,EAAY;AAAA;AAAA,iBACd,GACE;AAAA;AAAA;AAAA,WACN;AAAA,UACC,cAAc,IAAA,mBACb,GAAA,CAAC,SAAI,SAAA,EAAU,6CAAA,EAA+C,kBAAO,CAAA,GACnE;AAAA;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AACA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-VTIRUCLZ.js","sourcesContent":["import { ChevronRight, Wrench } from \"lucide-react\";\nimport { forwardRef, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\ninterface ToolCallProps extends HTMLAttributes<HTMLDivElement> {\n  /** Tool name e.g. \"bash\", \"read_file\", \"edit_file\". */\n  name?: string;\n  /**\n   * Summary label e.g. \"Ran 2 commands\", \"Read 18 files\".\n   */\n  summary: ReactNode;\n  /**\n   * Collapsible payload (e.g. command, stdout, file list).\n   */\n  detail?: ReactNode;\n  defaultOpen?: boolean;\n  /**\n   * If true, hides the wrench icon (useful when grouping by name elsewhere).\n   */\n  hideIcon?: boolean;\n}\n\n/**\n * ToolCall — collapsible row representing an agent tool invocation.\n *\n * Visual: subtle muted container, wrench icon, summary in body text,\n * chevron rotates on expand. Pairs with `<ToolResult>` for the rendered output.\n *\n * Typical usage inside a ChatMessage assistant body:\n *\n *   <ToolCall summary=\"Read 18 files\" detail={<ToolResult>{output}</ToolResult>} />\n */\nconst ToolCall = forwardRef<HTMLDivElement, ToolCallProps>(\n  ({ className, name, summary, detail, defaultOpen, hideIcon, ...props }, ref) => {\n    const [open, setOpen] = useState(defaultOpen ?? false);\n    const expandable = detail !== undefined;\n    return (\n      <div\n        ref={ref}\n        className={cn(\"rounded-md border border-border/40 bg-muted/30\", className)}\n        {...props}\n      >\n        <button\n          type=\"button\"\n          onClick={() => expandable && setOpen((v) => !v)}\n          aria-expanded={expandable ? open : undefined}\n          disabled={!expandable}\n          className={cn(\n            \"flex w-full items-center gap-2 px-3 py-2 text-left\",\n            \"font-sans text-body-sm text-foreground\",\n            \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n            expandable && \"cursor-pointer hover:bg-muted/60\",\n          )}\n        >\n          {!hideIcon ? (\n            <Wrench className=\"size-3.5 shrink-0 text-primary\" aria-hidden=\"true\" />\n          ) : null}\n          {name ? (\n            <span className=\"font-mono text-code-sm text-muted-foreground\">{name}</span>\n          ) : null}\n          <span className=\"flex-1 truncate\">{summary}</span>\n          {expandable ? (\n            <ChevronRight\n              className={cn(\n                \"size-3.5 text-muted-foreground transition-transform\",\n                open && \"rotate-90\",\n              )}\n              aria-hidden=\"true\"\n            />\n          ) : null}\n        </button>\n        {expandable && open ? (\n          <div className=\"border-border/40 border-t bg-card px-3 py-2\">{detail}</div>\n        ) : null}\n      </div>\n    );\n  },\n);\nToolCall.displayName = \"ToolCall\";\n\nexport { ToolCall };\n"]}

package/dist/chunk-VVBAEYKI.js

@@ -0,0 +1,202 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { ChevronsLeft, ChevronLeft, ChevronRight, ChevronsRight } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function computePageRange(currentPage, totalPages, siblingCount = 1) {
+  if (totalPages <= 1) return [];
+  const totalNumbers = siblingCount * 2 + 3;
+  const totalWithEdges = totalNumbers + 2;
+  if (totalPages <= totalWithEdges) {
+    return Array.from({ length: totalPages }, (_, i) => i + 1);
+  }
+  const leftSibling = Math.max(currentPage - siblingCount, 1);
+  const rightSibling = Math.min(currentPage + siblingCount, totalPages);
+  const showLeftEllipsis = leftSibling > 2;
+  const showRightEllipsis = rightSibling < totalPages - 1;
+  if (!showLeftEllipsis && showRightEllipsis) {
+    const leftRangeEnd = 1 + (siblingCount * 2 + 2);
+    const leftRange = Array.from({ length: leftRangeEnd }, (_, i) => i + 1);
+    return [...leftRange, "ellipsis-end", totalPages];
+  }
+  if (showLeftEllipsis && !showRightEllipsis) {
+    const rightStart = totalPages - (siblingCount * 2 + 2);
+    const rightRange = Array.from(
+      { length: totalPages - rightStart + 1 },
+      (_, i) => rightStart + i
+    );
+    return [1, "ellipsis-start", ...rightRange];
+  }
+  const middleRange = Array.from(
+    { length: rightSibling - leftSibling + 1 },
+    (_, i) => leftSibling + i
+  );
+  return [1, "ellipsis-start", ...middleRange, "ellipsis-end", totalPages];
+}
+var SIZE = {
+  sm: "size-7 text-label",
+  md: "size-8 text-body-sm"
+};
+var ICON_SIZE = {
+  sm: "size-3",
+  md: "size-3.5"
+};
+var Pagination = forwardRef(
+  ({
+    className,
+    currentPage,
+    totalPages,
+    onPageChange,
+    siblingCount = 1,
+    showJumpButtons = true,
+    size = "md",
+    ...props
+  }, ref) => {
+    if (totalPages <= 1) {
+      return null;
+    }
+    const range = computePageRange(currentPage, totalPages, siblingCount);
+    const prevDisabled = currentPage <= 1;
+    const nextDisabled = currentPage >= totalPages;
+    const sizeClass = SIZE[size];
+    const iconClass = ICON_SIZE[size];
+    const buttonBase = cn(
+      "inline-flex items-center justify-center rounded-md font-mono tabular-nums",
+      "transition-colors",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+      sizeClass
+    );
+    function go(page) {
+      const clamped = Math.max(1, Math.min(totalPages, page));
+      if (clamped !== currentPage) onPageChange(clamped);
+    }
+    function handleKeyDown(e) {
+      if (e.key === "ArrowLeft") {
+        e.preventDefault();
+        go(currentPage - 1);
+      } else if (e.key === "ArrowRight") {
+        e.preventDefault();
+        go(currentPage + 1);
+      } else if (e.key === "Home") {
+        e.preventDefault();
+        go(1);
+      } else if (e.key === "End") {
+        e.preventDefault();
+        go(totalPages);
+      }
+    }
+    return /* @__PURE__ */ jsxs(
+      "nav",
+      {
+        ref,
+        "aria-label": "Pagination",
+        onKeyDown: handleKeyDown,
+        className: cn("flex items-center gap-1", className),
+        ...props,
+        children: [
+          showJumpButtons ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => go(1),
+              disabled: prevDisabled,
+              "aria-label": "Go to first page",
+              "aria-disabled": prevDisabled || void 0,
+              className: cn(
+                buttonBase,
+                "text-foreground hover:bg-muted",
+                prevDisabled && "cursor-not-allowed opacity-40 hover:bg-transparent"
+              ),
+              children: /* @__PURE__ */ jsx(ChevronsLeft, { "aria-hidden": "true", className: iconClass })
+            }
+          ) : null,
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => go(currentPage - 1),
+              disabled: prevDisabled,
+              "aria-label": "Go to previous page",
+              "aria-disabled": prevDisabled || void 0,
+              className: cn(
+                buttonBase,
+                "text-foreground hover:bg-muted",
+                prevDisabled && "cursor-not-allowed opacity-40 hover:bg-transparent"
+              ),
+              children: /* @__PURE__ */ jsx(ChevronLeft, { "aria-hidden": "true", className: iconClass })
+            }
+          ),
+          range.map((item) => {
+            if (item === "ellipsis-start" || item === "ellipsis-end") {
+              return /* @__PURE__ */ jsx(
+                "span",
+                {
+                  "aria-hidden": "true",
+                  className: cn(
+                    "inline-flex items-center justify-center text-muted-foreground",
+                    sizeClass
+                  ),
+                  children: "\u2026"
+                },
+                item
+              );
+            }
+            const isActive = item === currentPage;
+            return /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => go(item),
+                "aria-label": `Go to page ${item}`,
+                "aria-current": isActive ? "page" : void 0,
+                className: cn(
+                  buttonBase,
+                  isActive ? "bg-primary text-primary-foreground hover:bg-primary" : "text-foreground hover:bg-muted"
+                ),
+                children: item
+              },
+              item
+            );
+          }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => go(currentPage + 1),
+              disabled: nextDisabled,
+              "aria-label": "Go to next page",
+              "aria-disabled": nextDisabled || void 0,
+              className: cn(
+                buttonBase,
+                "text-foreground hover:bg-muted",
+                nextDisabled && "cursor-not-allowed opacity-40 hover:bg-transparent"
+              ),
+              children: /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": "true", className: iconClass })
+            }
+          ),
+          showJumpButtons ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => go(totalPages),
+              disabled: nextDisabled,
+              "aria-label": "Go to last page",
+              "aria-disabled": nextDisabled || void 0,
+              className: cn(
+                buttonBase,
+                "text-foreground hover:bg-muted",
+                nextDisabled && "cursor-not-allowed opacity-40 hover:bg-transparent"
+              ),
+              children: /* @__PURE__ */ jsx(ChevronsRight, { "aria-hidden": "true", className: iconClass })
+            }
+          ) : null
+        ]
+      }
+    );
+  }
+);
+Pagination.displayName = "Pagination";
+
+export { Pagination, computePageRange };
+//# sourceMappingURL=chunk-VVBAEYKI.js.map
+//# sourceMappingURL=chunk-VVBAEYKI.js.map

package/dist/chunk-VVBAEYKI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/pagination/pagination.tsx"],"names":[],"mappings":"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","file":"chunk-VVBAEYKI.js","sourcesContent":["import { ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { HTMLAttributes, KeyboardEvent } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * Pagination — accessible page-number navigation primitive.\n *\n * Renders a `<nav aria-label=\"Pagination\">` containing a button group:\n * `[<<] [<] 1 ... 5 6 [7] 8 9 ... 42 [>] [>>]`. The active page carries\n * `aria-current=\"page\"`. Keyboard navigation (ArrowLeft / ArrowRight /\n * Home / End) is wired on the nav. Ellipses are rendered as\n * non-interactive `<span>` elements with `aria-hidden`.\n *\n * Renders nothing when `totalPages <= 1` (the page is the whole list).\n *\n * `siblingCount` controls how many neighbors of the current page are\n * always visible (default 1 → \"5 6 [7] 8 9\"). `showJumpButtons`\n * toggles the first/last `<<` / `>>` buttons.\n *\n * Consumers control state (`currentPage`) and are responsible for any\n * URL routing — the buttons are `<button>`, not `<a>`.\n *\n * @example\n *   <Pagination\n *     currentPage={page}\n *     totalPages={42}\n *     onPageChange={setPage}\n *   />\n */\nexport interface PaginationProps extends Omit<HTMLAttributes<HTMLElement>, \"onChange\"> {\n  currentPage: number;\n  totalPages: number;\n  onPageChange: (page: number) => void;\n  /** Neighbors of current page that stay visible. Default 1. */\n  siblingCount?: number;\n  /** Render `<<` / `>>` first/last buttons. Default true. */\n  showJumpButtons?: boolean;\n  /** Size variant. Default md. */\n  size?: \"sm\" | \"md\";\n}\n\n/**\n * Pure helper: compute the visible page-range with ellipses.\n * Exported for unit testing — most pagination bugs live here.\n */\nexport function computePageRange(\n  currentPage: number,\n  totalPages: number,\n  siblingCount = 1,\n): Array<number | \"ellipsis-start\" | \"ellipsis-end\"> {\n  if (totalPages <= 1) return [];\n\n  // Always keep first + last + siblings around current.\n  // Total \"core\" buttons: 1 + (siblingCount * 2 + 1) + 1 = siblingCount * 2 + 3.\n  // Plus possibly 2 ellipsis placeholders → max visible = siblingCount * 2 + 5.\n  const totalNumbers = siblingCount * 2 + 3;\n  const totalWithEdges = totalNumbers + 2;\n\n  if (totalPages <= totalWithEdges) {\n    return Array.from({ length: totalPages }, (_, i) => i + 1);\n  }\n\n  const leftSibling = Math.max(currentPage - siblingCount, 1);\n  const rightSibling = Math.min(currentPage + siblingCount, totalPages);\n\n  const showLeftEllipsis = leftSibling > 2;\n  const showRightEllipsis = rightSibling < totalPages - 1;\n\n  if (!showLeftEllipsis && showRightEllipsis) {\n    const leftRangeEnd = 1 + (siblingCount * 2 + 2);\n    const leftRange = Array.from({ length: leftRangeEnd }, (_, i) => i + 1);\n    return [...leftRange, \"ellipsis-end\", totalPages];\n  }\n\n  if (showLeftEllipsis && !showRightEllipsis) {\n    const rightStart = totalPages - (siblingCount * 2 + 2);\n    const rightRange = Array.from(\n      { length: totalPages - rightStart + 1 },\n      (_, i) => rightStart + i,\n    );\n    return [1, \"ellipsis-start\", ...rightRange];\n  }\n\n  // Both sides need ellipsis.\n  const middleRange = Array.from(\n    { length: rightSibling - leftSibling + 1 },\n    (_, i) => leftSibling + i,\n  );\n  return [1, \"ellipsis-start\", ...middleRange, \"ellipsis-end\", totalPages];\n}\n\nconst SIZE: Record<NonNullable<PaginationProps[\"size\"]>, string> = {\n  sm: \"size-7 text-label\",\n  md: \"size-8 text-body-sm\",\n};\n\nconst ICON_SIZE: Record<NonNullable<PaginationProps[\"size\"]>, string> = {\n  sm: \"size-3\",\n  md: \"size-3.5\",\n};\n\nconst Pagination = forwardRef<HTMLElement, PaginationProps>(\n  (\n    {\n      className,\n      currentPage,\n      totalPages,\n      onPageChange,\n      siblingCount = 1,\n      showJumpButtons = true,\n      size = \"md\",\n      ...props\n    },\n    ref,\n  ) => {\n    if (totalPages <= 1) {\n      return null;\n    }\n\n    const range = computePageRange(currentPage, totalPages, siblingCount);\n    const prevDisabled = currentPage <= 1;\n    const nextDisabled = currentPage >= totalPages;\n    const sizeClass = SIZE[size];\n    const iconClass = ICON_SIZE[size];\n\n    const buttonBase = cn(\n      \"inline-flex items-center justify-center rounded-md font-mono tabular-nums\",\n      \"transition-colors\",\n      \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n      sizeClass,\n    );\n\n    function go(page: number) {\n      const clamped = Math.max(1, Math.min(totalPages, page));\n      if (clamped !== currentPage) onPageChange(clamped);\n    }\n\n    function handleKeyDown(e: KeyboardEvent<HTMLElement>) {\n      if (e.key === \"ArrowLeft\") {\n        e.preventDefault();\n        go(currentPage - 1);\n      } else if (e.key === \"ArrowRight\") {\n        e.preventDefault();\n        go(currentPage + 1);\n      } else if (e.key === \"Home\") {\n        e.preventDefault();\n        go(1);\n      } else if (e.key === \"End\") {\n        e.preventDefault();\n        go(totalPages);\n      }\n    }\n\n    return (\n      <nav\n        ref={ref}\n        aria-label=\"Pagination\"\n        onKeyDown={handleKeyDown}\n        className={cn(\"flex items-center gap-1\", className)}\n        {...props}\n      >\n        {showJumpButtons ? (\n          <button\n            type=\"button\"\n            onClick={() => go(1)}\n            disabled={prevDisabled}\n            aria-label=\"Go to first page\"\n            aria-disabled={prevDisabled || undefined}\n            className={cn(\n              buttonBase,\n              \"text-foreground hover:bg-muted\",\n              prevDisabled && \"cursor-not-allowed opacity-40 hover:bg-transparent\",\n            )}\n          >\n            <ChevronsLeft aria-hidden=\"true\" className={iconClass} />\n          </button>\n        ) : null}\n        <button\n          type=\"button\"\n          onClick={() => go(currentPage - 1)}\n          disabled={prevDisabled}\n          aria-label=\"Go to previous page\"\n          aria-disabled={prevDisabled || undefined}\n          className={cn(\n            buttonBase,\n            \"text-foreground hover:bg-muted\",\n            prevDisabled && \"cursor-not-allowed opacity-40 hover:bg-transparent\",\n          )}\n        >\n          <ChevronLeft aria-hidden=\"true\" className={iconClass} />\n        </button>\n        {range.map((item) => {\n          if (item === \"ellipsis-start\" || item === \"ellipsis-end\") {\n            return (\n              <span\n                key={item}\n                aria-hidden=\"true\"\n                className={cn(\n                  \"inline-flex items-center justify-center text-muted-foreground\",\n                  sizeClass,\n                )}\n              >\n                …\n              </span>\n            );\n          }\n          const isActive = item === currentPage;\n          return (\n            <button\n              key={item}\n              type=\"button\"\n              onClick={() => go(item)}\n              aria-label={`Go to page ${item}`}\n              aria-current={isActive ? \"page\" : undefined}\n              className={cn(\n                buttonBase,\n                isActive\n                  ? \"bg-primary text-primary-foreground hover:bg-primary\"\n                  : \"text-foreground hover:bg-muted\",\n              )}\n            >\n              {item}\n            </button>\n          );\n        })}\n        <button\n          type=\"button\"\n          onClick={() => go(currentPage + 1)}\n          disabled={nextDisabled}\n          aria-label=\"Go to next page\"\n          aria-disabled={nextDisabled || undefined}\n          className={cn(\n            buttonBase,\n            \"text-foreground hover:bg-muted\",\n            nextDisabled && \"cursor-not-allowed opacity-40 hover:bg-transparent\",\n          )}\n        >\n          <ChevronRight aria-hidden=\"true\" className={iconClass} />\n        </button>\n        {showJumpButtons ? (\n          <button\n            type=\"button\"\n            onClick={() => go(totalPages)}\n            disabled={nextDisabled}\n            aria-label=\"Go to last page\"\n            aria-disabled={nextDisabled || undefined}\n            className={cn(\n              buttonBase,\n              \"text-foreground hover:bg-muted\",\n              nextDisabled && \"cursor-not-allowed opacity-40 hover:bg-transparent\",\n            )}\n          >\n            <ChevronsRight aria-hidden=\"true\" className={iconClass} />\n          </button>\n        ) : null}\n      </nav>\n    );\n  },\n);\nPagination.displayName = \"Pagination\";\n\nexport { Pagination };\n"]}