@usetheo/ui 0.9.0-next.0 → 0.10.0-next.0

package/dist/chunk-CVOKZITR.js

@@ -0,0 +1,82 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import { Folder, FolderOpen, User, Brain } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var SCOPE_META = {
+  global: { label: "Global", icon: User, hint: "Applies to every project for this user." },
+  project: {
+    label: "Project",
+    icon: FolderOpen,
+    hint: "Versioned with the project. Shared by team."
+  },
+  session: { label: "Session", icon: Folder, hint: "This session only. Wiped on exit." }
+};
+var MemoryEditor = forwardRef(
+  ({ className, layers, activeScope, onScopeChange, onContentChange, title = "Memory", ...props }, ref) => {
+    const active = layers.find((l) => l.scope === activeScope);
+    const ActiveIcon = active ? SCOPE_META[active.scope].icon : Brain;
+    return /* @__PURE__ */ jsxs("section", { ref, className: cn("rounded-xl border bg-card", className), ...props, children: [
+      /* @__PURE__ */ jsxs("header", { className: "flex items-center justify-between gap-3 border-border/40 border-b px-4 py-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(Brain, { className: "size-4 text-primary", "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx("h3", { className: "font-display text-title-md tracking-tight", children: title })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "inline-flex items-center rounded-lg border border-border/60 bg-muted p-0.5", children: ["global", "project", "session"].map((scope) => {
+          const meta = SCOPE_META[scope];
+          const Icon = meta.icon;
+          const isActive = scope === activeScope;
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => onScopeChange(scope),
+              "aria-pressed": isActive,
+              className: cn(
+                "inline-flex items-center gap-1.5 rounded-md px-2.5 py-1",
+                "font-sans text-label transition-colors",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                isActive ? "bg-card text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(Icon, { className: "size-3" }),
+                meta.label
+              ]
+            },
+            scope
+          );
+        }) })
+      ] }),
+      active ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 border-border/40 border-b bg-muted/30 px-4 py-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
+            /* @__PURE__ */ jsx(ActiveIcon, { className: "size-3 shrink-0 text-muted-foreground", "aria-hidden": "true" }),
+            /* @__PURE__ */ jsx("span", { className: "truncate font-mono text-code-sm text-foreground", children: active.path }),
+            active.modifiedAt ? /* @__PURE__ */ jsxs("span", { className: "shrink-0 font-mono text-label text-muted-foreground", children: [
+              "\xB7 ",
+              active.modifiedAt
+            ] }) : null
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "font-sans text-label text-muted-foreground italic", children: SCOPE_META[active.scope].hint })
+        ] }),
+        /* @__PURE__ */ jsx(
+          "textarea",
+          {
+            value: active.content,
+            onChange: (e) => onContentChange(active.scope, e.target.value),
+            rows: 12,
+            className: "w-full resize-y bg-transparent px-4 py-3 font-mono text-code-md text-foreground placeholder:text-muted-foreground focus:outline-none",
+            placeholder: `# ${SCOPE_META[active.scope].label} notes
+
+Write Markdown the agent should keep in context.`
+          }
+        )
+      ] }) : null
+    ] });
+  }
+);
+MemoryEditor.displayName = "MemoryEditor";
+
+export { MemoryEditor };
+//# sourceMappingURL=chunk-CVOKZITR.js.map
+//# sourceMappingURL=chunk-CVOKZITR.js.map

package/dist/chunk-CVOKZITR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/memory-editor/memory-editor.tsx"],"names":[],"mappings":"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","file":"chunk-CVOKZITR.js","sourcesContent":["import { Brain, Folder, FolderOpen, User } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport type { IconComponent } from \"../../../lib/types.js\";\n\nexport type MemoryScope = \"global\" | \"project\" | \"session\";\n\nexport interface MemoryLayer {\n  scope: MemoryScope;\n  /** File path on disk for transparency. */\n  path: string;\n  /** Markdown content. */\n  content: string;\n  /** Last modified label, e.g. \"2m ago\". */\n  modifiedAt?: string;\n}\n\ninterface MemoryEditorProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  layers: MemoryLayer[];\n  /** Currently active layer for editing. */\n  activeScope: MemoryScope;\n  onScopeChange: (scope: MemoryScope) => void;\n  onContentChange: (scope: MemoryScope, next: string) => void;\n  title?: ReactNode;\n}\n\nconst SCOPE_META: Record<MemoryScope, { label: string; icon: IconComponent; hint: string }> = {\n  global: { label: \"Global\", icon: User, hint: \"Applies to every project for this user.\" },\n  project: {\n    label: \"Project\",\n    icon: FolderOpen,\n    hint: \"Versioned with the project. Shared by team.\",\n  },\n  session: { label: \"Session\", icon: Folder, hint: \"This session only. Wiped on exit.\" },\n};\n\n/**\n * MemoryEditor — three-layer Markdown memory editor (global / project /\n * session) mirroring Claude Code's CLAUDE.md hierarchy.\n *\n * Each scope keeps its own file. Switching scopes via tab updates which\n * layer is being edited. Path is shown explicitly so users know where the\n * content lives on disk.\n */\nconst MemoryEditor = forwardRef<HTMLDivElement, MemoryEditorProps>(\n  (\n    { className, layers, activeScope, onScopeChange, onContentChange, title = \"Memory\", ...props },\n    ref,\n  ) => {\n    const active = layers.find((l) => l.scope === activeScope);\n    const ActiveIcon = active ? SCOPE_META[active.scope].icon : Brain;\n    return (\n      <section ref={ref} className={cn(\"rounded-xl border bg-card\", className)} {...props}>\n        <header className=\"flex items-center justify-between gap-3 border-border/40 border-b px-4 py-3\">\n          <div className=\"flex items-center gap-2\">\n            <Brain className=\"size-4 text-primary\" aria-hidden=\"true\" />\n            <h3 className=\"font-display text-title-md tracking-tight\">{title}</h3>\n          </div>\n          <div className=\"inline-flex items-center rounded-lg border border-border/60 bg-muted p-0.5\">\n            {([\"global\", \"project\", \"session\"] as const).map((scope) => {\n              const meta = SCOPE_META[scope];\n              const Icon = meta.icon;\n              const isActive = scope === activeScope;\n              return (\n                <button\n                  key={scope}\n                  type=\"button\"\n                  onClick={() => onScopeChange(scope)}\n                  aria-pressed={isActive}\n                  className={cn(\n                    \"inline-flex items-center gap-1.5 rounded-md px-2.5 py-1\",\n                    \"font-sans text-label transition-colors\",\n                    \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n                    isActive\n                      ? \"bg-card text-foreground shadow-sm\"\n                      : \"text-muted-foreground hover:text-foreground\",\n                  )}\n                >\n                  <Icon className=\"size-3\" />\n                  {meta.label}\n                </button>\n              );\n            })}\n          </div>\n        </header>\n\n        {active ? (\n          <>\n            <div className=\"flex items-center justify-between gap-3 border-border/40 border-b bg-muted/30 px-4 py-2\">\n              <div className=\"flex min-w-0 items-center gap-2\">\n                <ActiveIcon className=\"size-3 shrink-0 text-muted-foreground\" aria-hidden=\"true\" />\n                <span className=\"truncate font-mono text-code-sm text-foreground\">\n                  {active.path}\n                </span>\n                {active.modifiedAt ? (\n                  <span className=\"shrink-0 font-mono text-label text-muted-foreground\">\n                    · {active.modifiedAt}\n                  </span>\n                ) : null}\n              </div>\n              <span className=\"font-sans text-label text-muted-foreground italic\">\n                {SCOPE_META[active.scope].hint}\n              </span>\n            </div>\n            <textarea\n              value={active.content}\n              onChange={(e) => onContentChange(active.scope, e.target.value)}\n              rows={12}\n              className=\"w-full resize-y bg-transparent px-4 py-3 font-mono text-code-md text-foreground placeholder:text-muted-foreground focus:outline-none\"\n              placeholder={`# ${SCOPE_META[active.scope].label} notes\\n\\nWrite Markdown the agent should keep in context.`}\n            />\n          </>\n        ) : null}\n      </section>\n    );\n  },\n);\nMemoryEditor.displayName = \"MemoryEditor\";\n\nexport { MemoryEditor };\n"]}

package/dist/chunk-CWFMFKDI.js

@@ -0,0 +1,82 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import { ChevronRight, X, Check, Loader2 } from 'lucide-react';
+import { useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var STATUS_ICON = {
+  running: /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 animate-spin text-primary", "aria-hidden": "true" }),
+  success: /* @__PURE__ */ jsx(Check, { className: "size-3.5 text-success", "aria-hidden": "true" }),
+  failed: /* @__PURE__ */ jsx(X, { className: "size-3.5 text-destructive", "aria-hidden": "true" }),
+  queued: /* @__PURE__ */ jsx("span", { className: "size-2 rounded-full bg-warning", "aria-hidden": "true" }),
+  skipped: /* @__PURE__ */ jsx("span", { className: "size-2 rounded-full bg-muted-foreground", "aria-hidden": "true" })
+};
+var STATUS_LABEL = {
+  running: "Running",
+  success: "Completed",
+  failed: "Failed",
+  queued: "Queued",
+  skipped: "Skipped"
+};
+function ToolCallCard({
+  className,
+  tool,
+  icon: Icon,
+  target,
+  status,
+  output,
+  defaultExpanded = false,
+  timestamp,
+  ...props
+}) {
+  const [open, setOpen] = useState(defaultExpanded);
+  const expandable = !!output;
+  return /* @__PURE__ */ jsxs(
+    "article",
+    {
+      className: cn(
+        "overflow-hidden rounded-lg border border-border/40 bg-card/40 text-card-foreground",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-2 px-3 py-2"), children: [
+          expandable ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => setOpen((v) => !v),
+              "aria-expanded": open,
+              "aria-label": open ? `Collapse ${tool} details` : `Expand ${tool} details`,
+              className: "-m-1 inline-flex size-6 shrink-0 items-center justify-center rounded-md p-1 text-muted-foreground hover:bg-muted/30 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              children: /* @__PURE__ */ jsx(
+                ChevronRight,
+                {
+                  className: cn("size-3.5 transition-transform duration-base", open && "rotate-90"),
+                  "aria-hidden": "true"
+                }
+              )
+            }
+          ) : null,
+          Icon ? /* @__PURE__ */ jsx(Icon, { className: "size-4 shrink-0 text-muted-foreground", "aria-hidden": "true" }) : null,
+          /* @__PURE__ */ jsx("span", { className: "shrink-0 font-medium font-mono text-code-sm text-foreground", children: tool }),
+          target ? /* @__PURE__ */ jsx("span", { className: "truncate font-mono text-code-sm text-muted-foreground", children: target }) : null,
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              role: "img",
+              "aria-label": STATUS_LABEL[status],
+              className: "ml-auto inline-flex shrink-0 items-center gap-1.5",
+              children: STATUS_ICON[status]
+            }
+          ),
+          timestamp ? /* @__PURE__ */ jsx("span", { className: "shrink-0 font-mono text-label text-muted-foreground tabular-nums", children: timestamp }) : null
+        ] }),
+        expandable && open ? /* @__PURE__ */ jsx("div", { className: "border-border/40 border-t bg-muted/20 px-3 py-2 font-mono text-code-sm", children: output }) : null
+      ]
+    }
+  );
+}
+
+export { ToolCallCard };
+//# sourceMappingURL=chunk-CWFMFKDI.js.map
+//# sourceMappingURL=chunk-CWFMFKDI.js.map

package/dist/chunk-CWFMFKDI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/tool-call-card/tool-call-card.tsx"],"names":[],"mappings":"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","file":"chunk-CWFMFKDI.js","sourcesContent":["import { Check, ChevronRight, Loader2, X } from \"lucide-react\";\nimport { useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport type { IconComponent } from \"../../../lib/types.js\";\n\n/**\n * ToolCallCard — single agent tool invocation rendered inside the stream.\n *\n * Visual: row with tool icon + tool name + target/command (mono) + status +\n * optional chevron. Expandable: when `output` is provided the row becomes a\n * `<details>` whose body renders the stdout/stderr/result block.\n *\n * Distinct from `AgentEvent` in the existing AgentTimeline by being a\n * stand-alone card that lives inside an AgentStream alongside chat messages.\n */\n\nexport type ToolCallStatus = \"running\" | \"success\" | \"failed\" | \"queued\" | \"skipped\";\n\nconst STATUS_ICON: Record<ToolCallStatus, ReactNode> = {\n  running: <Loader2 className=\"size-3.5 animate-spin text-primary\" aria-hidden=\"true\" />,\n  success: <Check className=\"size-3.5 text-success\" aria-hidden=\"true\" />,\n  failed: <X className=\"size-3.5 text-destructive\" aria-hidden=\"true\" />,\n  queued: <span className=\"size-2 rounded-full bg-warning\" aria-hidden=\"true\" />,\n  skipped: <span className=\"size-2 rounded-full bg-muted-foreground\" aria-hidden=\"true\" />,\n};\n\nconst STATUS_LABEL: Record<ToolCallStatus, string> = {\n  running: \"Running\",\n  success: \"Completed\",\n  failed: \"Failed\",\n  queued: \"Queued\",\n  skipped: \"Skipped\",\n};\n\ninterface ToolCallCardProps extends HTMLAttributes<HTMLElement> {\n  /** Tool name (matches Theo Code / Claude Code tool registry: Bash, Edit, Read, …). */\n  tool: ReactNode;\n  /** Optional icon for the tool. */\n  icon?: IconComponent;\n  /** Target / command shown in monospace next to the tool name. */\n  target?: ReactNode;\n  status: ToolCallStatus;\n  /** Optional stdout/stderr/result body. When present, the card becomes expandable. */\n  output?: ReactNode;\n  /** Default expanded state. Default: false (collapsed). */\n  defaultExpanded?: boolean;\n  /** Timestamp shown on the right. */\n  timestamp?: ReactNode;\n}\n\nexport function ToolCallCard({\n  className,\n  tool,\n  icon: Icon,\n  target,\n  status,\n  output,\n  defaultExpanded = false,\n  timestamp,\n  ...props\n}: ToolCallCardProps) {\n  const [open, setOpen] = useState(defaultExpanded);\n  const expandable = !!output;\n\n  return (\n    <article\n      className={cn(\n        \"overflow-hidden rounded-lg border border-border/40 bg-card/40 text-card-foreground\",\n        className,\n      )}\n      {...props}\n    >\n      {/* T5.4: <header role=\"button\"> previously failed axe's\n       * aria-prohibited-attr + semantic-landmark guidance. Replaced by\n       * <div> for the layout container and a separate <button> for the\n       * expand affordance (when expandable). Status icon span now carries\n       * role=\"img\" to make aria-label valid. */}\n      <div className={cn(\"flex items-center gap-2 px-3 py-2\")}>\n        {expandable ? (\n          <button\n            type=\"button\"\n            onClick={() => setOpen((v) => !v)}\n            aria-expanded={open}\n            aria-label={open ? `Collapse ${tool} details` : `Expand ${tool} details`}\n            className=\"-m-1 inline-flex size-6 shrink-0 items-center justify-center rounded-md p-1 text-muted-foreground hover:bg-muted/30 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n          >\n            <ChevronRight\n              className={cn(\"size-3.5 transition-transform duration-base\", open && \"rotate-90\")}\n              aria-hidden=\"true\"\n            />\n          </button>\n        ) : null}\n        {Icon ? (\n          <Icon className=\"size-4 shrink-0 text-muted-foreground\" aria-hidden=\"true\" />\n        ) : null}\n        <span className=\"shrink-0 font-medium font-mono text-code-sm text-foreground\">{tool}</span>\n        {target ? (\n          <span className=\"truncate font-mono text-code-sm text-muted-foreground\">{target}</span>\n        ) : null}\n        <span\n          role=\"img\"\n          aria-label={STATUS_LABEL[status]}\n          className=\"ml-auto inline-flex shrink-0 items-center gap-1.5\"\n        >\n          {STATUS_ICON[status]}\n        </span>\n        {timestamp ? (\n          <span className=\"shrink-0 font-mono text-label text-muted-foreground tabular-nums\">\n            {timestamp}\n          </span>\n        ) : null}\n      </div>\n      {expandable && open ? (\n        <div className=\"border-border/40 border-t bg-muted/20 px-3 py-2 font-mono text-code-sm\">\n          {output}\n        </div>\n      ) : null}\n    </article>\n  );\n}\n"]}

package/dist/chunk-CWVKSV7S.js

@@ -0,0 +1,124 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { cva } from 'class-variance-authority';
+import { X } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var Overlay2 = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-50 bg-background/80",
+      "data-[state=open]:fade-in-0 data-[state=open]:animate-in",
+      "data-[state=closed]:fade-out-0 data-[state=closed]:animate-out",
+      className
+    ),
+    ...props
+  }
+));
+Overlay2.displayName = "Sheet.Overlay";
+var sheetVariants = cva(
+  [
+    "fixed z-50 flex flex-col gap-3 border-border/40 bg-card text-card-foreground shadow-lg",
+    "transition duration-base ease-out-soft",
+    "data-[state=closed]:animate-out data-[state=open]:animate-in"
+  ],
+  {
+    variants: {
+      side: {
+        right: "data-[state=open]:slide-in-from-right data-[state=closed]:slide-out-to-right inset-y-0 right-0 h-full w-3/4 max-w-md border-l",
+        left: "data-[state=open]:slide-in-from-left data-[state=closed]:slide-out-to-left inset-y-0 left-0 h-full w-3/4 max-w-md border-r",
+        top: "data-[state=open]:slide-in-from-top data-[state=closed]:slide-out-to-top inset-x-0 top-0 h-auto max-h-[80vh] border-b",
+        bottom: "data-[state=open]:slide-in-from-bottom data-[state=closed]:slide-out-to-bottom inset-x-0 bottom-0 h-auto max-h-[80vh] border-t"
+      }
+    },
+    defaultVariants: { side: "right" }
+  }
+);
+var Content2 = forwardRef(
+  ({ className, children, hideCloseButton, side = "right", ...props }, ref) => /* @__PURE__ */ jsxs(DialogPrimitive.Portal, { children: [
+    /* @__PURE__ */ jsx(Overlay2, {}),
+    /* @__PURE__ */ jsxs(
+      DialogPrimitive.Content,
+      {
+        ref,
+        className: cn(sheetVariants({ side }), className),
+        ...props,
+        children: [
+          children,
+          !hideCloseButton ? /* @__PURE__ */ jsxs(
+            DialogPrimitive.Close,
+            {
+              className: cn(
+                "absolute top-4 right-4 rounded-md p-1 opacity-70",
+                "transition-opacity hover:opacity-100",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-card",
+                "disabled:pointer-events-none"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(X, { className: "size-4" }),
+                /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+              ]
+            }
+          ) : null
+        ]
+      }
+    )
+  ] })
+);
+Content2.displayName = "Sheet.Content";
+var Header = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn("flex flex-col gap-1.5 border-border/40 border-b px-6 py-5 text-left", className),
+    ...props
+  }
+);
+Header.displayName = "Sheet.Header";
+var Body = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("flex-1 overflow-y-auto px-6 py-4 text-body-md", className), ...props });
+Body.displayName = "Sheet.Body";
+var Footer = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col-reverse gap-2 border-border/40 border-t px-6 py-4 sm:flex-row sm:justify-end",
+      className
+    ),
+    ...props
+  }
+);
+Footer.displayName = "Sheet.Footer";
+var Title2 = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Title,
+  {
+    ref,
+    className: cn("font-display text-foreground text-title-lg tracking-tight", className),
+    ...props
+  }
+));
+Title2.displayName = "Sheet.Title";
+var Description2 = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn("text-body-sm text-muted-foreground", className),
+    ...props
+  }
+));
+Description2.displayName = "Sheet.Description";
+var Sheet = DialogPrimitive.Root;
+Sheet.Trigger = DialogPrimitive.Trigger;
+Sheet.Close = DialogPrimitive.Close;
+Sheet.Content = Content2;
+Sheet.Overlay = Overlay2;
+Sheet.Header = Header;
+Sheet.Body = Body;
+Sheet.Footer = Footer;
+Sheet.Title = Title2;
+Sheet.Description = Description2;
+
+export { Sheet, sheetVariants };
+//# sourceMappingURL=chunk-CWVKSV7S.js.map
+//# sourceMappingURL=chunk-CWVKSV7S.js.map

package/dist/chunk-CWVKSV7S.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/sheet/sheet.tsx"],"names":["Overlay","Content","Title","Description"],"mappings":"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","file":"chunk-CWVKSV7S.js","sourcesContent":["import * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport { type VariantProps, cva } from \"class-variance-authority\";\nimport { X } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementRef, HTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * Sheet — slide-in side panel built on Radix Dialog.\n *\n * Same Radix primitive as Dialog, but Content slides from an edge instead of\n * fading from center. Used for: workspace overlays (Memory, Observability,\n * Sub-agents), Settings, contextual filters.\n *\n * Composition:\n *   <Sheet>\n *     <Sheet.Trigger>Open</Sheet.Trigger>\n *     <Sheet.Content side=\"right\">\n *       <Sheet.Header>\n *         <Sheet.Title>Memory</Sheet.Title>\n *         <Sheet.Description>Episodes and wiki pages</Sheet.Description>\n *       </Sheet.Header>\n *       <Sheet.Body>…</Sheet.Body>\n *       <Sheet.Footer>…</Sheet.Footer>\n *     </Sheet.Content>\n *   </Sheet>\n */\n\nconst Overlay = forwardRef<\n  ElementRef<typeof DialogPrimitive.Overlay>,\n  ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Overlay\n    ref={ref}\n    className={cn(\n      \"fixed inset-0 z-50 bg-background/80\",\n      \"data-[state=open]:fade-in-0 data-[state=open]:animate-in\",\n      \"data-[state=closed]:fade-out-0 data-[state=closed]:animate-out\",\n      className,\n    )}\n    {...props}\n  />\n));\nOverlay.displayName = \"Sheet.Overlay\";\n\nconst sheetVariants = cva(\n  [\n    \"fixed z-50 flex flex-col gap-3 border-border/40 bg-card text-card-foreground shadow-lg\",\n    \"transition duration-base ease-out-soft\",\n    \"data-[state=closed]:animate-out data-[state=open]:animate-in\",\n  ],\n  {\n    variants: {\n      side: {\n        right:\n          \"data-[state=open]:slide-in-from-right data-[state=closed]:slide-out-to-right inset-y-0 right-0 h-full w-3/4 max-w-md border-l\",\n        left: \"data-[state=open]:slide-in-from-left data-[state=closed]:slide-out-to-left inset-y-0 left-0 h-full w-3/4 max-w-md border-r\",\n        top: \"data-[state=open]:slide-in-from-top data-[state=closed]:slide-out-to-top inset-x-0 top-0 h-auto max-h-[80vh] border-b\",\n        bottom:\n          \"data-[state=open]:slide-in-from-bottom data-[state=closed]:slide-out-to-bottom inset-x-0 bottom-0 h-auto max-h-[80vh] border-t\",\n      },\n    },\n    defaultVariants: { side: \"right\" },\n  },\n);\n\ninterface ContentProps\n  extends ComponentPropsWithoutRef<typeof DialogPrimitive.Content>,\n    VariantProps<typeof sheetVariants> {\n  hideCloseButton?: boolean;\n}\n\nconst Content = forwardRef<ElementRef<typeof DialogPrimitive.Content>, ContentProps>(\n  ({ className, children, hideCloseButton, side = \"right\", ...props }, ref) => (\n    <DialogPrimitive.Portal>\n      <Overlay />\n      <DialogPrimitive.Content\n        ref={ref}\n        className={cn(sheetVariants({ side }), className)}\n        {...props}\n      >\n        {children}\n        {!hideCloseButton ? (\n          <DialogPrimitive.Close\n            className={cn(\n              \"absolute top-4 right-4 rounded-md p-1 opacity-70\",\n              \"transition-opacity hover:opacity-100\",\n              \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-card\",\n              \"disabled:pointer-events-none\",\n            )}\n          >\n            <X className=\"size-4\" />\n            <span className=\"sr-only\">Close</span>\n          </DialogPrimitive.Close>\n        ) : null}\n      </DialogPrimitive.Content>\n    </DialogPrimitive.Portal>\n  ),\n);\nContent.displayName = \"Sheet.Content\";\n\nconst Header = ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\"flex flex-col gap-1.5 border-border/40 border-b px-6 py-5 text-left\", className)}\n    {...props}\n  />\n);\nHeader.displayName = \"Sheet.Header\";\n\nconst Body = ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => (\n  <div className={cn(\"flex-1 overflow-y-auto px-6 py-4 text-body-md\", className)} {...props} />\n);\nBody.displayName = \"Sheet.Body\";\n\nconst Footer = ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"flex flex-col-reverse gap-2 border-border/40 border-t px-6 py-4 sm:flex-row sm:justify-end\",\n      className,\n    )}\n    {...props}\n  />\n);\nFooter.displayName = \"Sheet.Footer\";\n\nconst Title = forwardRef<\n  ElementRef<typeof DialogPrimitive.Title>,\n  ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Title\n    ref={ref}\n    className={cn(\"font-display text-foreground text-title-lg tracking-tight\", className)}\n    {...props}\n  />\n));\nTitle.displayName = \"Sheet.Title\";\n\nconst Description = forwardRef<\n  ElementRef<typeof DialogPrimitive.Description>,\n  ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Description\n    ref={ref}\n    className={cn(\"text-body-sm text-muted-foreground\", className)}\n    {...props}\n  />\n));\nDescription.displayName = \"Sheet.Description\";\n\nconst Sheet = DialogPrimitive.Root as typeof DialogPrimitive.Root & {\n  Trigger: typeof DialogPrimitive.Trigger;\n  Close: typeof DialogPrimitive.Close;\n  Content: typeof Content;\n  Overlay: typeof Overlay;\n  Header: typeof Header;\n  Body: typeof Body;\n  Footer: typeof Footer;\n  Title: typeof Title;\n  Description: typeof Description;\n};\nSheet.Trigger = DialogPrimitive.Trigger;\nSheet.Close = DialogPrimitive.Close;\nSheet.Content = Content;\nSheet.Overlay = Overlay;\nSheet.Header = Header;\nSheet.Body = Body;\nSheet.Footer = Footer;\nSheet.Title = Title;\nSheet.Description = Description;\n\nexport { Sheet, sheetVariants };\n"]}

package/dist/chunk-CYOLRWOX.js

@@ -0,0 +1,63 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import { AlertCircle, Sparkles, Rocket, Network, Terminal, Trash2, Pencil, Eye } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var stateClasses = {
+  enabled: "border-success/40 bg-success/10 text-success",
+  active: "border-primary/50 bg-primary/15 text-primary",
+  disabled: "border-border/40 bg-muted text-muted-foreground line-through",
+  blocked: "border-destructive/40 bg-destructive/10 text-destructive"
+};
+var CapabilityIndicator = forwardRef(
+  ({ className, capabilities, ...props }, ref) => /* @__PURE__ */ jsx(
+    "ul",
+    {
+      ref,
+      "aria-label": "Agent capabilities",
+      className: cn("flex flex-wrap items-center gap-1.5", className),
+      ...props,
+      children: capabilities.map((c) => {
+        const Icon = c.icon ?? AlertCircle;
+        const state = c.state ?? "enabled";
+        return /* @__PURE__ */ jsxs(
+          "li",
+          {
+            title: typeof c.hint === "string" ? c.hint : void 0,
+            className: cn(
+              "inline-flex items-center gap-1.5 rounded-full border px-2.5 py-0.5",
+              "font-sans text-label",
+              "transition-colors",
+              stateClasses[state]
+            ),
+            children: [
+              /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  "aria-hidden": "true",
+                  className: cn("size-3 shrink-0", state === "active" && "animate-pulse")
+                }
+              ),
+              c.label
+            ]
+          },
+          c.id
+        );
+      })
+    }
+  )
+);
+CapabilityIndicator.displayName = "CapabilityIndicator";
+var capabilityPresets = {
+  read: { id: "read", label: "Read files", icon: Eye },
+  write: { id: "write", label: "Write files", icon: Pencil },
+  delete: { id: "delete", label: "Delete files", icon: Trash2 },
+  bash: { id: "bash", label: "Run shell", icon: Terminal },
+  network: { id: "network", label: "Network", icon: Network },
+  deploy: { id: "deploy", label: "Deploy", icon: Rocket },
+  llm: { id: "llm", label: "Sub-agents", icon: Sparkles }
+};
+
+export { CapabilityIndicator, capabilityPresets };
+//# sourceMappingURL=chunk-CYOLRWOX.js.map
+//# sourceMappingURL=chunk-CYOLRWOX.js.map

package/dist/chunk-CYOLRWOX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/capability-indicator/capability-indicator.tsx"],"names":[],"mappings":";;;;;AAwCA,IAAM,YAAA,GAAgD;AAAA,EACpD,OAAA,EAAS,8CAAA;AAAA,EACT,MAAA,EAAQ,8CAAA;AAAA,EACR,QAAA,EAAU,8DAAA;AAAA,EACV,OAAA,EAAS;AACX,CAAA;AAEA,IAAM,mBAAA,GAAsB,UAAA;AAAA,EAC1B,CAAC,EAAE,SAAA,EAAW,cAAc,GAAG,KAAA,IAAS,GAAA,qBACtC,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,YAAA,EAAW,oBAAA;AAAA,MACX,SAAA,EAAW,EAAA,CAAG,qCAAA,EAAuC,SAAS,CAAA;AAAA,MAC7D,GAAI,KAAA;AAAA,MAEJ,QAAA,EAAA,YAAA,CAAa,GAAA,CAAI,CAAC,CAAA,KAAM;AACvB,QAAA,MAAM,IAAA,GAAO,EAAE,IAAA,IAAQ,WAAA;AACvB,QAAA,MAAM,KAAA,GAAQ,EAAE,KAAA,IAAS,SAAA;AACzB,QAAA,uBACE,IAAA;AAAA,UAAC,IAAA;AAAA,UAAA;AAAA,YAEC,OAAO,OAAO,CAAA,CAAE,IAAA,KAAS,QAAA,GAAW,EAAE,IAAA,GAAO,MAAA;AAAA,YAC7C,SAAA,EAAW,EAAA;AAAA,cACT,oEAAA;AAAA,cACA,sBAAA;AAAA,cACA,mBAAA;AAAA,cACA,aAAa,KAAK;AAAA,aACpB;AAAA,YAEA,QAAA,EAAA;AAAA,8BAAA,GAAA;AAAA,gBAAC,IAAA;AAAA,gBAAA;AAAA,kBACC,aAAA,EAAY,MAAA;AAAA,kBACZ,SAAA,EAAW,EAAA,CAAG,iBAAA,EAAmB,KAAA,KAAU,YAAY,eAAe;AAAA;AAAA,eACxE;AAAA,cACC,CAAA,CAAE;AAAA;AAAA,WAAA;AAAA,UAbE,CAAA,CAAE;AAAA,SAcT;AAAA,MAEJ,CAAC;AAAA;AAAA;AAGP;AACA,mBAAA,CAAoB,WAAA,GAAc,qBAAA;AAG3B,IAAM,iBAAA,GAAoB;AAAA,EAC/B,MAAM,EAAE,EAAA,EAAI,QAAQ,KAAA,EAAO,YAAA,EAAc,MAAM,GAAA,EAAI;AAAA,EACnD,OAAO,EAAE,EAAA,EAAI,SAAS,KAAA,EAAO,aAAA,EAAe,MAAM,MAAA,EAAO;AAAA,EACzD,QAAQ,EAAE,EAAA,EAAI,UAAU,KAAA,EAAO,cAAA,EAAgB,MAAM,MAAA,EAAO;AAAA,EAC5D,MAAM,EAAE,EAAA,EAAI,QAAQ,KAAA,EAAO,WAAA,EAAa,MAAM,QAAA,EAAS;AAAA,EACvD,SAAS,EAAE,EAAA,EAAI,WAAW,KAAA,EAAO,SAAA,EAAW,MAAM,OAAA,EAAQ;AAAA,EAC1D,QAAQ,EAAE,EAAA,EAAI,UAAU,KAAA,EAAO,QAAA,EAAU,MAAM,MAAA,EAAO;AAAA,EACtD,KAAK,EAAE,EAAA,EAAI,OAAO,KAAA,EAAO,YAAA,EAAc,MAAM,QAAA;AAC/C","file":"chunk-CYOLRWOX.js","sourcesContent":["import {\n  AlertCircle,\n  Eye,\n  Network,\n  Pencil,\n  Rocket,\n  Sparkles,\n  Terminal,\n  Trash2,\n} from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport type { IconComponent } from \"../../../lib/types.js\";\n\nexport type CapabilityState = \"enabled\" | \"disabled\" | \"blocked\" | \"active\";\n\nexport interface Capability {\n  id: string;\n  /** Visible label. */\n  label: ReactNode;\n  /** Optional icon override. */\n  icon?: IconComponent;\n  /** Default state. */\n  state?: CapabilityState;\n  /** Tooltip / longer description. */\n  hint?: ReactNode;\n}\n\ninterface CapabilityIndicatorProps extends HTMLAttributes<HTMLDivElement> {\n  capabilities: Capability[];\n}\n\n/**\n * CapabilityIndicator — row of chips showing what the agent can currently do.\n *\n * Critical for transparency: the user should always see (e.g. in a top bar)\n * whether the agent has read/write/exec/network access enabled. The \"active\"\n * state pulses when a capability is in use.\n */\nconst stateClasses: Record<CapabilityState, string> = {\n  enabled: \"border-success/40 bg-success/10 text-success\",\n  active: \"border-primary/50 bg-primary/15 text-primary\",\n  disabled: \"border-border/40 bg-muted text-muted-foreground line-through\",\n  blocked: \"border-destructive/40 bg-destructive/10 text-destructive\",\n};\n\nconst CapabilityIndicator = forwardRef<HTMLUListElement, CapabilityIndicatorProps>(\n  ({ className, capabilities, ...props }, ref) => (\n    <ul\n      ref={ref}\n      aria-label=\"Agent capabilities\"\n      className={cn(\"flex flex-wrap items-center gap-1.5\", className)}\n      {...(props as HTMLAttributes<HTMLUListElement>)}\n    >\n      {capabilities.map((c) => {\n        const Icon = c.icon ?? AlertCircle;\n        const state = c.state ?? \"enabled\";\n        return (\n          <li\n            key={c.id}\n            title={typeof c.hint === \"string\" ? c.hint : undefined}\n            className={cn(\n              \"inline-flex items-center gap-1.5 rounded-full border px-2.5 py-0.5\",\n              \"font-sans text-label\",\n              \"transition-colors\",\n              stateClasses[state],\n            )}\n          >\n            <Icon\n              aria-hidden=\"true\"\n              className={cn(\"size-3 shrink-0\", state === \"active\" && \"animate-pulse\")}\n            />\n            {c.label}\n          </li>\n        );\n      })}\n    </ul>\n  ),\n);\nCapabilityIndicator.displayName = \"CapabilityIndicator\";\n\n/** Common capability presets — re-use these so apps don't reinvent labels. */\nexport const capabilityPresets = {\n  read: { id: \"read\", label: \"Read files\", icon: Eye } as const,\n  write: { id: \"write\", label: \"Write files\", icon: Pencil } as const,\n  delete: { id: \"delete\", label: \"Delete files\", icon: Trash2 } as const,\n  bash: { id: \"bash\", label: \"Run shell\", icon: Terminal } as const,\n  network: { id: \"network\", label: \"Network\", icon: Network } as const,\n  deploy: { id: \"deploy\", label: \"Deploy\", icon: Rocket } as const,\n  llm: { id: \"llm\", label: \"Sub-agents\", icon: Sparkles } as const,\n};\n\nexport { CapabilityIndicator };\n"]}

package/dist/chunk-D23LRJT6.js

@@ -0,0 +1,116 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import { Wrench, Hammer, ShieldCheck, Edit3, FilePlus, FileSearch, Terminal, AlertTriangle, CheckCircle2, Loader2, CircleDot, ChevronRight } from 'lucide-react';
+import { forwardRef, useState } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+var typeIcon = {
+  command: Terminal,
+  file_read: FileSearch,
+  file_write: FilePlus,
+  edit: Edit3,
+  lint: ShieldCheck,
+  typecheck: ShieldCheck,
+  build: Hammer,
+  tool: Wrench
+};
+var statusIcon = {
+  pending: CircleDot,
+  running: Loader2,
+  success: CheckCircle2,
+  failed: AlertTriangle
+};
+var statusColor = {
+  pending: "text-muted-foreground",
+  running: "text-primary",
+  success: "text-success",
+  failed: "text-destructive"
+};
+var AgentEvent = forwardRef(
+  ({ className, event, collapsible, defaultOpen, ...props }, ref) => {
+    const [open, setOpen] = useState(defaultOpen ?? false);
+    const TypeIcon = typeIcon[event.type];
+    const StatusIcon = statusIcon[event.status];
+    const isExpandable = !!(collapsible && event.detail !== void 0);
+    const handleToggle = () => {
+      if (isExpandable) setOpen((v) => !v);
+    };
+    const headerContent = /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("span", { className: "grid size-7 place-items-center rounded-md bg-muted text-muted-foreground", children: /* @__PURE__ */ jsx(TypeIcon, { className: "size-3.5" }) }),
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsxs("p", { className: "flex flex-wrap items-baseline gap-x-2 gap-y-0.5", children: [
+          /* @__PURE__ */ jsx("span", { className: "truncate font-medium text-body-sm text-foreground", children: event.label }),
+          event.path ? /* @__PURE__ */ jsx("span", { className: "truncate font-mono text-code-sm text-muted-foreground", children: event.path }) : null,
+          event.diff ? /* @__PURE__ */ jsxs("span", { className: "font-mono text-code-sm", children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-success", children: [
+              "+",
+              event.diff.added
+            ] }),
+            " ",
+            /* @__PURE__ */ jsxs("span", { className: "text-destructive", children: [
+              "-",
+              event.diff.removed
+            ] })
+          ] }) : null
+        ] }),
+        event.timestamp ? /* @__PURE__ */ jsx("p", { className: "font-mono text-label text-muted-foreground", children: event.timestamp }) : null
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+        /* @__PURE__ */ jsx(
+          StatusIcon,
+          {
+            className: cn(
+              "size-4",
+              statusColor[event.status],
+              event.status === "running" && "motion-safe:animate-spin"
+            ),
+            "aria-label": event.status
+          }
+        ),
+        isExpandable ? /* @__PURE__ */ jsx(
+          ChevronRight,
+          {
+            className: cn(
+              "size-4 text-muted-foreground transition-transform",
+              open && "rotate-90"
+            ),
+            "aria-hidden": "true"
+          }
+        ) : null
+      ] })
+    ] });
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "rounded-md border border-transparent",
+          isExpandable && "hover:border-border/40 hover:bg-muted/40",
+          className
+        ),
+        ...props,
+        children: [
+          isExpandable ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: handleToggle,
+              "aria-expanded": open,
+              className: cn(
+                "grid w-full grid-cols-[auto_1fr_auto] items-center gap-3 px-3 py-2 text-left",
+                "cursor-pointer rounded-md",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+              ),
+              children: headerContent
+            }
+          ) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-[auto_1fr_auto] items-center gap-3 px-3 py-2", children: headerContent }),
+          isExpandable && open ? /* @__PURE__ */ jsx("div", { className: "border-border/40 border-t bg-muted/20 px-3 py-2 font-mono text-code-sm text-muted-foreground", children: event.detail }) : null
+        ]
+      }
+    );
+  }
+);
+AgentEvent.displayName = "AgentEvent";
+
+export { AgentEvent };
+//# sourceMappingURL=chunk-D23LRJT6.js.map
+//# sourceMappingURL=chunk-D23LRJT6.js.map

package/dist/chunk-D23LRJT6.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/agent-event/agent-event.tsx"],"names":[],"mappings":"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","file":"chunk-D23LRJT6.js","sourcesContent":["import {\n  AlertTriangle,\n  CheckCircle2,\n  ChevronRight,\n  CircleDot,\n  Edit3,\n  FilePlus,\n  FileSearch,\n  Hammer,\n  Loader2,\n  ShieldCheck,\n  Terminal,\n  Wrench,\n} from \"lucide-react\";\nimport { forwardRef, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport type { IconComponent } from \"../../../lib/types.js\";\nimport type {\n  AgentEvent as AgentEventModel,\n  AgentEventStatus,\n  AgentEventType,\n} from \"../../../types/agent.js\";\n\nconst typeIcon: Record<AgentEventType, IconComponent> = {\n  command: Terminal,\n  file_read: FileSearch,\n  file_write: FilePlus,\n  edit: Edit3,\n  lint: ShieldCheck,\n  typecheck: ShieldCheck,\n  build: Hammer,\n  tool: Wrench,\n};\n\nconst statusIcon: Record<AgentEventStatus, IconComponent> = {\n  pending: CircleDot,\n  running: Loader2,\n  success: CheckCircle2,\n  failed: AlertTriangle,\n};\n\nconst statusColor: Record<AgentEventStatus, string> = {\n  pending: \"text-muted-foreground\",\n  running: \"text-primary\",\n  success: \"text-success\",\n  failed: \"text-destructive\",\n};\n\ninterface AgentEventProps extends HTMLAttributes<HTMLDivElement> {\n  event: AgentEventModel;\n  /**\n   * If true, clicking the row toggles `event.detail` visibility.\n   */\n  collapsible?: boolean;\n  /**\n   * Force the collapsible state (for controlled scenarios).\n   */\n  defaultOpen?: boolean;\n}\n\n/**\n * AgentEvent — single event row in the agent timeline.\n *\n * Composition: type icon + label + path + diff stats + status icon + (optional) chevron.\n * Running events show a spinner via motion-safe:animate-spin (respects\n * `prefers-reduced-motion`); failed events flash red.\n *\n * When `collapsible` is true and `event.detail` is provided, the row renders as\n * a native `<button>` for correct keyboard and screen-reader semantics.\n */\nconst AgentEvent = forwardRef<HTMLDivElement, AgentEventProps>(\n  ({ className, event, collapsible, defaultOpen, ...props }, ref) => {\n    const [open, setOpen] = useState(defaultOpen ?? false);\n    const TypeIcon = typeIcon[event.type];\n    const StatusIcon = statusIcon[event.status];\n    const isExpandable = !!(collapsible && event.detail !== undefined);\n\n    const handleToggle = () => {\n      if (isExpandable) setOpen((v) => !v);\n    };\n\n    const headerContent: ReactNode = (\n      <>\n        <span className=\"grid size-7 place-items-center rounded-md bg-muted text-muted-foreground\">\n          <TypeIcon className=\"size-3.5\" />\n        </span>\n        <div className=\"min-w-0\">\n          <p className=\"flex flex-wrap items-baseline gap-x-2 gap-y-0.5\">\n            <span className=\"truncate font-medium text-body-sm text-foreground\">{event.label}</span>\n            {event.path ? (\n              <span className=\"truncate font-mono text-code-sm text-muted-foreground\">\n                {event.path}\n              </span>\n            ) : null}\n            {event.diff ? (\n              <span className=\"font-mono text-code-sm\">\n                <span className=\"text-success\">+{event.diff.added}</span>{\" \"}\n                <span className=\"text-destructive\">-{event.diff.removed}</span>\n              </span>\n            ) : null}\n          </p>\n          {event.timestamp ? (\n            <p className=\"font-mono text-label text-muted-foreground\">{event.timestamp}</p>\n          ) : null}\n        </div>\n        <div className=\"flex items-center gap-1.5\">\n          <StatusIcon\n            className={cn(\n              \"size-4\",\n              statusColor[event.status],\n              event.status === \"running\" && \"motion-safe:animate-spin\",\n            )}\n            aria-label={event.status}\n          />\n          {isExpandable ? (\n            <ChevronRight\n              className={cn(\n                \"size-4 text-muted-foreground transition-transform\",\n                open && \"rotate-90\",\n              )}\n              aria-hidden=\"true\"\n            />\n          ) : null}\n        </div>\n      </>\n    );\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          \"rounded-md border border-transparent\",\n          isExpandable && \"hover:border-border/40 hover:bg-muted/40\",\n          className,\n        )}\n        {...props}\n      >\n        {isExpandable ? (\n          <button\n            type=\"button\"\n            onClick={handleToggle}\n            aria-expanded={open}\n            className={cn(\n              \"grid w-full grid-cols-[auto_1fr_auto] items-center gap-3 px-3 py-2 text-left\",\n              \"cursor-pointer rounded-md\",\n              \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n            )}\n          >\n            {headerContent}\n          </button>\n        ) : (\n          <div className=\"grid grid-cols-[auto_1fr_auto] items-center gap-3 px-3 py-2\">\n            {headerContent}\n          </div>\n        )}\n        {isExpandable && open ? (\n          <div className=\"border-border/40 border-t bg-muted/20 px-3 py-2 font-mono text-code-sm text-muted-foreground\">\n            {event.detail}\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\nAgentEvent.displayName = \"AgentEvent\";\n\nexport { AgentEvent };\n"]}