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

package/dist/chunk-BPUQWMBD.js

@@ -0,0 +1,79 @@
+import { BadgeWithDot } from './chunk-O23LKHUR.js';
+import { cn } from './chunk-ZSRJCIWF.js';
+import { ChevronDown } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var statusVariant = {
+  idle: "default",
+  permission_required: "warning",
+  starting: "primary",
+  running: "primary",
+  verifying: "primary",
+  completed: "success",
+  failed: "destructive"
+};
+var statusDot = {
+  idle: "muted",
+  permission_required: "warning",
+  starting: "primary",
+  running: "primary",
+  verifying: "primary",
+  completed: "success",
+  failed: "destructive"
+};
+var statusLabel = {
+  idle: "Idle",
+  permission_required: "Permission required",
+  starting: "Starting up",
+  running: "Running",
+  verifying: "Verifying",
+  completed: "Completed",
+  failed: "Failed"
+};
+var TaskHeader = forwardRef(
+  ({ className, title, status, onToggle, actions, ...props }, ref) => /* @__PURE__ */ jsxs(
+    "header",
+    {
+      ref,
+      className: cn(
+        "flex items-center justify-between gap-3 rounded-xl border border-border/40 bg-card px-4 py-3",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
+          /* @__PURE__ */ jsx("h2", { className: "truncate font-display text-title-lg tracking-tight", children: title }),
+          onToggle ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: onToggle,
+              "aria-label": "Toggle task details",
+              className: "rounded-md p-1 text-muted-foreground hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              children: /* @__PURE__ */ jsx(ChevronDown, { className: "size-4" })
+            }
+          ) : null
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          status ? /* @__PURE__ */ jsxs(BadgeWithDot, { variant: statusVariant[status], children: [
+            /* @__PURE__ */ jsx(
+              BadgeWithDot.Dot,
+              {
+                tone: statusDot[status],
+                pulse: status === "running" || status === "starting" || status === "verifying"
+              }
+            ),
+            statusLabel[status]
+          ] }) : null,
+          actions
+        ] })
+      ]
+    }
+  )
+);
+TaskHeader.displayName = "TaskHeader";
+
+export { TaskHeader };
+//# sourceMappingURL=chunk-BPUQWMBD.js.map
+//# sourceMappingURL=chunk-BPUQWMBD.js.map

package/dist/chunk-BPUQWMBD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/task-header/task-header.tsx"],"names":[],"mappings":";;;;;;AAOA,IAAM,aAAA,GAGF;AAAA,EACF,IAAA,EAAM,SAAA;AAAA,EACN,mBAAA,EAAqB,SAAA;AAAA,EACrB,QAAA,EAAU,SAAA;AAAA,EACV,OAAA,EAAS,SAAA;AAAA,EACT,SAAA,EAAW,SAAA;AAAA,EACX,SAAA,EAAW,SAAA;AAAA,EACX,MAAA,EAAQ;AACV,CAAA;AACA,IAAM,SAAA,GAA6F;AAAA,EACjG,IAAA,EAAM,OAAA;AAAA,EACN,mBAAA,EAAqB,SAAA;AAAA,EACrB,QAAA,EAAU,SAAA;AAAA,EACV,OAAA,EAAS,SAAA;AAAA,EACT,SAAA,EAAW,SAAA;AAAA,EACX,SAAA,EAAW,SAAA;AAAA,EACX,MAAA,EAAQ;AACV,CAAA;AACA,IAAM,WAAA,GAA0C;AAAA,EAC9C,IAAA,EAAM,MAAA;AAAA,EACN,mBAAA,EAAqB,qBAAA;AAAA,EACrB,QAAA,EAAU,aAAA;AAAA,EACV,OAAA,EAAS,SAAA;AAAA,EACT,SAAA,EAAW,WAAA;AAAA,EACX,SAAA,EAAW,WAAA;AAAA,EACX,MAAA,EAAQ;AACV,CAAA;AAmBA,IAAM,UAAA,GAAa,UAAA;AAAA,EACjB,CAAC,EAAE,SAAA,EAAW,KAAA,EAAO,MAAA,EAAQ,UAAU,OAAA,EAAS,GAAG,KAAA,EAAM,EAAG,GAAA,qBAC1D,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,EAAA;AAAA,QACT,8FAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,iCAAA,EACb,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,oDAAA,EAAsD,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,UACzE,QAAA,mBACC,GAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,IAAA,EAAK,QAAA;AAAA,cACL,OAAA,EAAS,QAAA;AAAA,cACT,YAAA,EAAW,qBAAA;AAAA,cACX,SAAA,EAAU,mJAAA;AAAA,cAEV,QAAA,kBAAA,GAAA,CAAC,WAAA,EAAA,EAAY,SAAA,EAAU,QAAA,EAAS;AAAA;AAAA,WAClC,GACE;AAAA,SAAA,EACN,CAAA;AAAA,wBACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,yBAAA,EACZ,QAAA,EAAA;AAAA,UAAA,MAAA,mBACC,IAAA,CAAC,YAAA,EAAA,EAAM,OAAA,EAAS,aAAA,CAAc,MAAM,CAAA,EAClC,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,YAAA,CAAM,GAAA;AAAA,cAAN;AAAA,gBACC,IAAA,EAAM,UAAU,MAAM,CAAA;AAAA,gBACtB,KAAA,EAAO,MAAA,KAAW,SAAA,IAAa,MAAA,KAAW,cAAc,MAAA,KAAW;AAAA;AAAA,aACrE;AAAA,YACC,YAAY,MAAM;AAAA,WAAA,EACrB,CAAA,GACE,IAAA;AAAA,UACH;AAAA,SAAA,EACH;AAAA;AAAA;AAAA;AAGN;AACA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-BPUQWMBD.js","sourcesContent":["import { ChevronDown } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport type { TaskStatus } from \"../../../types/task.js\";\nimport { Badge } from \"../../primitives/badge/index.js\";\n\nconst statusVariant: Record<\n  TaskStatus,\n  \"default\" | \"primary\" | \"warning\" | \"success\" | \"destructive\"\n> = {\n  idle: \"default\",\n  permission_required: \"warning\",\n  starting: \"primary\",\n  running: \"primary\",\n  verifying: \"primary\",\n  completed: \"success\",\n  failed: \"destructive\",\n};\nconst statusDot: Record<TaskStatus, \"primary\" | \"success\" | \"warning\" | \"destructive\" | \"muted\"> = {\n  idle: \"muted\",\n  permission_required: \"warning\",\n  starting: \"primary\",\n  running: \"primary\",\n  verifying: \"primary\",\n  completed: \"success\",\n  failed: \"destructive\",\n};\nconst statusLabel: Record<TaskStatus, string> = {\n  idle: \"Idle\",\n  permission_required: \"Permission required\",\n  starting: \"Starting up\",\n  running: \"Running\",\n  verifying: \"Verifying\",\n  completed: \"Completed\",\n  failed: \"Failed\",\n};\n\ninterface TaskHeaderProps extends Omit<HTMLAttributes<HTMLElement>, \"title\"> {\n  title: ReactNode;\n  status?: TaskStatus;\n  /**\n   * If provided, a chevron is shown next to the title and clicking it fires this callback.\n   * Used as the \"expand task metadata\" affordance in the Infra shell.\n   */\n  onToggle?: () => void;\n  /** Right-side actions (e.g. cancel task, close panel). */\n  actions?: ReactNode;\n}\n\n/**\n * TaskHeader — title bar for a task pane.\n *\n * Visual: display-md title with chevron + optional status badge with pulse + actions slot.\n */\nconst TaskHeader = forwardRef<HTMLElement, TaskHeaderProps>(\n  ({ className, title, status, onToggle, actions, ...props }, ref) => (\n    <header\n      ref={ref}\n      className={cn(\n        \"flex items-center justify-between gap-3 rounded-xl border border-border/40 bg-card px-4 py-3\",\n        className,\n      )}\n      {...props}\n    >\n      <div className=\"flex min-w-0 items-center gap-2\">\n        <h2 className=\"truncate font-display text-title-lg tracking-tight\">{title}</h2>\n        {onToggle ? (\n          <button\n            type=\"button\"\n            onClick={onToggle}\n            aria-label=\"Toggle task details\"\n            className=\"rounded-md p-1 text-muted-foreground hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n          >\n            <ChevronDown className=\"size-4\" />\n          </button>\n        ) : null}\n      </div>\n      <div className=\"flex items-center gap-2\">\n        {status ? (\n          <Badge variant={statusVariant[status]}>\n            <Badge.Dot\n              tone={statusDot[status]}\n              pulse={status === \"running\" || status === \"starting\" || status === \"verifying\"}\n            />\n            {statusLabel[status]}\n          </Badge>\n        ) : null}\n        {actions}\n      </div>\n    </header>\n  ),\n);\nTaskHeader.displayName = \"TaskHeader\";\n\nexport { TaskHeader };\n"]}

package/dist/chunk-BVDASR3Y.js

@@ -0,0 +1,74 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import { Folder, File, ChevronRight } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var FolderContextCard = forwardRef(
+  ({ className, title, entries, onEntryClick, ...props }, ref) => /* @__PURE__ */ jsxs("section", { ref, className: cn("rounded-xl border bg-card p-4", className), ...props, children: [
+    title ? /* @__PURE__ */ jsx("header", { className: "mb-3 flex items-center justify-between", children: /* @__PURE__ */ jsx("h3", { className: "font-display text-title-md tracking-tight", children: title }) }) : null,
+    /* @__PURE__ */ jsx(Tree, { entries, ...onEntryClick ? { onEntryClick } : {}, depth: 0 })
+  ] })
+);
+FolderContextCard.displayName = "FolderContextCard";
+function Tree({
+  entries,
+  onEntryClick,
+  depth
+}) {
+  return /* @__PURE__ */ jsx("ul", { className: cn("grid", depth === 0 ? "gap-0.5" : "gap-0"), children: entries.map((entry) => {
+    const IconComp = entry.icon ?? (entry.kind === "folder" ? Folder : File);
+    const hasChildren = entry.kind === "folder" && entry.children && entry.children.length > 0;
+    return /* @__PURE__ */ jsxs("li", { children: [
+      /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: () => onEntryClick?.(entry.id),
+          className: cn(
+            "flex w-full items-center gap-2 rounded-md px-2 py-1.5",
+            "font-sans text-body-sm text-foreground",
+            "transition-colors hover:bg-muted",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+          ),
+          style: { paddingLeft: `${0.5 + depth * 0.9}rem` },
+          children: [
+            hasChildren ? /* @__PURE__ */ jsx(
+              ChevronRight,
+              {
+                className: cn(
+                  "size-3 shrink-0 text-muted-foreground transition-transform",
+                  entry.open && "rotate-90"
+                ),
+                "aria-hidden": "true"
+              }
+            ) : /* @__PURE__ */ jsx("span", { className: "w-3", "aria-hidden": "true" }),
+            /* @__PURE__ */ jsx(
+              IconComp,
+              {
+                className: cn(
+                  "size-4 shrink-0",
+                  entry.kind === "folder" ? "text-primary" : "text-muted-foreground"
+                ),
+                "aria-hidden": "true"
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "flex-1 truncate text-left", children: entry.name }),
+            entry.trailing
+          ]
+        }
+      ),
+      hasChildren && entry.open ? /* @__PURE__ */ jsx(
+        Tree,
+        {
+          entries: entry.children,
+          ...onEntryClick ? { onEntryClick } : {},
+          depth: depth + 1
+        }
+      ) : null
+    ] }, entry.id);
+  }) });
+}
+
+export { FolderContextCard };
+//# sourceMappingURL=chunk-BVDASR3Y.js.map
+//# sourceMappingURL=chunk-BVDASR3Y.js.map

package/dist/chunk-BVDASR3Y.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/folder-context-card/folder-context-card.tsx"],"names":[],"mappings":"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","file":"chunk-BVDASR3Y.js","sourcesContent":["import { ChevronRight, File, Folder } 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 interface FolderEntry {\n  id: string;\n  name: string;\n  kind: \"folder\" | \"file\";\n  /**\n   * If true, the entry is expanded (icons + nested children).\n   * Pure visual flag; toggling is the caller's job.\n   */\n  open?: boolean;\n  /**\n   * Optional nested entries when this is a folder.\n   */\n  children?: FolderEntry[];\n  /** Optional adornment after the name (badge, modified indicator). */\n  trailing?: ReactNode;\n  /** Override the icon. */\n  icon?: IconComponent;\n}\n\ninterface FolderContextCardProps extends Omit<HTMLAttributes<HTMLElement>, \"title\"> {\n  title?: ReactNode;\n  /**\n   * Root entries shown directly in the card.\n   */\n  entries: FolderEntry[];\n  /**\n   * Fires when an entry row is clicked.\n   */\n  onEntryClick?: (id: string) => void;\n}\n\n/**\n * FolderContextCard — file/folder tree fragment for the right inspector.\n *\n * Visual: 1-level tree with chevron indicating expanded state. Renders nested\n * children recursively, but does not manage open state — caller controls\n * `entry.open` and reacts to `onEntryClick`.\n */\nconst FolderContextCard = forwardRef<HTMLElement, FolderContextCardProps>(\n  ({ className, title, entries, onEntryClick, ...props }, ref) => (\n    <section ref={ref} className={cn(\"rounded-xl border bg-card p-4\", className)} {...props}>\n      {title ? (\n        <header className=\"mb-3 flex items-center justify-between\">\n          <h3 className=\"font-display text-title-md tracking-tight\">{title}</h3>\n        </header>\n      ) : null}\n      <Tree entries={entries} {...(onEntryClick ? { onEntryClick } : {})} depth={0} />\n    </section>\n  ),\n);\nFolderContextCard.displayName = \"FolderContextCard\";\n\nfunction Tree({\n  entries,\n  onEntryClick,\n  depth,\n}: {\n  entries: FolderEntry[];\n  onEntryClick?: (id: string) => void;\n  depth: number;\n}) {\n  return (\n    <ul className={cn(\"grid\", depth === 0 ? \"gap-0.5\" : \"gap-0\")}>\n      {entries.map((entry) => {\n        const IconComp = entry.icon ?? (entry.kind === \"folder\" ? Folder : File);\n        const hasChildren = entry.kind === \"folder\" && entry.children && entry.children.length > 0;\n        return (\n          <li key={entry.id}>\n            <button\n              type=\"button\"\n              onClick={() => onEntryClick?.(entry.id)}\n              className={cn(\n                \"flex w-full items-center gap-2 rounded-md px-2 py-1.5\",\n                \"font-sans text-body-sm text-foreground\",\n                \"transition-colors hover:bg-muted\",\n                \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n              )}\n              style={{ paddingLeft: `${0.5 + depth * 0.9}rem` }}\n            >\n              {hasChildren ? (\n                <ChevronRight\n                  className={cn(\n                    \"size-3 shrink-0 text-muted-foreground transition-transform\",\n                    entry.open && \"rotate-90\",\n                  )}\n                  aria-hidden=\"true\"\n                />\n              ) : (\n                <span className=\"w-3\" aria-hidden=\"true\" />\n              )}\n              <IconComp\n                className={cn(\n                  \"size-4 shrink-0\",\n                  entry.kind === \"folder\" ? \"text-primary\" : \"text-muted-foreground\",\n                )}\n                aria-hidden=\"true\"\n              />\n              <span className=\"flex-1 truncate text-left\">{entry.name}</span>\n              {entry.trailing}\n            </button>\n            {hasChildren && entry.open ? (\n              <Tree\n                entries={entry.children as FolderEntry[]}\n                {...(onEntryClick ? { onEntryClick } : {})}\n                depth={depth + 1}\n              />\n            ) : null}\n          </li>\n        );\n      })}\n    </ul>\n  );\n}\n\nexport { FolderContextCard };\n"]}

package/dist/chunk-BX7A5GUV.js

@@ -0,0 +1,78 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import { Search, Filter, Loader2 } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ActionBar = forwardRef(
+  ({ className, search, primaryAction, onFilterClick, ...props }, ref) => {
+    if (!search && !primaryAction && !onFilterClick) {
+      return null;
+    }
+    const PrimaryIcon = primaryAction?.icon;
+    const isLoading = primaryAction?.loading === true;
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn("flex w-full items-center gap-2", className), ...props, children: [
+      search ? /* @__PURE__ */ jsxs("div", { className: "relative flex-1", children: [
+        /* @__PURE__ */ jsx(
+          Search,
+          {
+            "aria-hidden": "true",
+            className: "-translate-y-1/2 absolute top-1/2 left-3 size-4 text-muted-foreground"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "search",
+            placeholder: search.placeholder,
+            value: search.value,
+            onChange: (e) => search.onChange(e.target.value),
+            className: cn(
+              "w-full rounded-md border border-border/40 bg-card py-2 pr-3 pl-9",
+              "font-sans text-body-sm text-foreground placeholder:text-muted-foreground",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+            )
+          }
+        )
+      ] }) : null,
+      onFilterClick !== void 0 ? /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: onFilterClick,
+          "aria-label": "Filter",
+          className: cn(
+            "inline-flex size-9 items-center justify-center rounded-md border border-border/40",
+            "text-muted-foreground transition-colors",
+            "hover:bg-muted hover:text-foreground",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+          ),
+          children: /* @__PURE__ */ jsx(Filter, { "aria-hidden": "true", className: "size-4" })
+        }
+      ) : null,
+      primaryAction !== void 0 ? /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: primaryAction.onClick,
+          disabled: isLoading,
+          className: cn(
+            "ml-auto inline-flex items-center gap-2 rounded-md bg-primary px-3 py-2",
+            "font-medium font-sans text-body-sm text-primary-foreground",
+            "transition-colors hover:bg-primary-deep",
+            "disabled:cursor-not-allowed disabled:opacity-60",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
+          ),
+          children: [
+            isLoading ? /* @__PURE__ */ jsx(Loader2, { "aria-hidden": "true", className: "size-4 animate-spin" }) : PrimaryIcon ? /* @__PURE__ */ jsx(PrimaryIcon, { "aria-hidden": "true", className: "size-4" }) : null,
+            primaryAction.label
+          ]
+        }
+      ) : null
+    ] });
+  }
+);
+ActionBar.displayName = "ActionBar";
+
+export { ActionBar };
+//# sourceMappingURL=chunk-BX7A5GUV.js.map
+//# sourceMappingURL=chunk-BX7A5GUV.js.map

package/dist/chunk-BX7A5GUV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/action-bar/action-bar.tsx"],"names":[],"mappings":";;;;;AAsCA,IAAM,SAAA,GAAY,UAAA;AAAA,EAChB,CAAC,EAAE,SAAA,EAAW,MAAA,EAAQ,eAAe,aAAA,EAAe,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACtE,IAAA,IAAI,CAAC,MAAA,IAAU,CAAC,aAAA,IAAiB,CAAC,aAAA,EAAe;AAC/C,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,MAAM,cAAc,aAAA,EAAe,IAAA;AACnC,IAAA,MAAM,SAAA,GAAY,eAAe,OAAA,KAAY,IAAA;AAE7C,IAAA,uBACE,IAAA,CAAC,SAAI,GAAA,EAAU,SAAA,EAAW,GAAG,gCAAA,EAAkC,SAAS,CAAA,EAAI,GAAG,KAAA,EAC5E,QAAA,EAAA;AAAA,MAAA,MAAA,mBACC,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iBAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,aAAA,EAAY,MAAA;AAAA,YACZ,SAAA,EAAU;AAAA;AAAA,SACZ;AAAA,wBACA,GAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,IAAA,EAAK,QAAA;AAAA,YACL,aAAa,MAAA,CAAO,WAAA;AAAA,YACpB,OAAO,MAAA,CAAO,KAAA;AAAA,YACd,UAAU,CAAC,CAAA,KAAM,OAAO,QAAA,CAAS,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,YAC/C,SAAA,EAAW,EAAA;AAAA,cACT,kEAAA;AAAA,cACA,0EAAA;AAAA,cACA;AAAA;AACF;AAAA;AACF,OAAA,EACF,CAAA,GACE,IAAA;AAAA,MACH,kBAAkB,MAAA,mBACjB,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAK,QAAA;AAAA,UACL,OAAA,EAAS,aAAA;AAAA,UACT,YAAA,EAAW,QAAA;AAAA,UACX,SAAA,EAAW,EAAA;AAAA,YACT,mFAAA;AAAA,YACA,yCAAA;AAAA,YACA,sCAAA;AAAA,YACA;AAAA,WACF;AAAA,UAEA,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,aAAA,EAAY,MAAA,EAAO,WAAU,QAAA,EAAS;AAAA;AAAA,OAChD,GACE,IAAA;AAAA,MACH,kBAAkB,MAAA,mBACjB,IAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAK,QAAA;AAAA,UACL,SAAS,aAAA,CAAc,OAAA;AAAA,UACvB,QAAA,EAAU,SAAA;AAAA,UACV,SAAA,EAAW,EAAA;AAAA,YACT,wEAAA;AAAA,YACA,4DAAA;AAAA,YACA,yCAAA;AAAA,YACA,iDAAA;AAAA,YACA;AAAA,WACF;AAAA,UAEC,QAAA,EAAA;AAAA,YAAA,SAAA,mBACC,GAAA,CAAC,OAAA,EAAA,EAAQ,aAAA,EAAY,MAAA,EAAO,WAAU,qBAAA,EAAsB,CAAA,GAC1D,WAAA,mBACF,GAAA,CAAC,WAAA,EAAA,EAAY,aAAA,EAAY,MAAA,EAAO,SAAA,EAAU,UAAS,CAAA,GACjD,IAAA;AAAA,YACH,aAAA,CAAc;AAAA;AAAA;AAAA,OACjB,GACE;AAAA,KAAA,EACN,CAAA;AAAA,EAEJ;AACF;AACA,SAAA,CAAU,WAAA,GAAc,WAAA","file":"chunk-BX7A5GUV.js","sourcesContent":["import { Filter, Loader2, Search } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { ElementType, HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * ActionBar — page-top action strip primitive.\n *\n * A horizontal flexbox row with three optional slots:\n *   - Search input (flex-1, grows to fill)\n *   - Filter icon button (next to search)\n *   - Primary action button (right-aligned)\n *\n * Returns `null` when no props are provided — don't render an empty\n * bar. Used standalone or composed inside `<PageShell>` (Brief #5).\n *\n * @example\n *   <ActionBar\n *     search={{ placeholder: \"Search projects…\", value: q, onChange: setQ }}\n *     primaryAction={{ label: \"New project\", icon: Plus, onClick: openModal }}\n *   />\n */\n\nexport interface ActionBarProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n  search?: {\n    placeholder: string;\n    value: string;\n    onChange: (value: string) => void;\n  };\n  primaryAction?: {\n    label: ReactNode;\n    icon?: ElementType;\n    onClick: () => void;\n    loading?: boolean;\n  };\n  onFilterClick?: () => void;\n}\n\nconst ActionBar = forwardRef<HTMLDivElement, ActionBarProps>(\n  ({ className, search, primaryAction, onFilterClick, ...props }, ref) => {\n    if (!search && !primaryAction && !onFilterClick) {\n      return null;\n    }\n\n    const PrimaryIcon = primaryAction?.icon;\n    const isLoading = primaryAction?.loading === true;\n\n    return (\n      <div ref={ref} className={cn(\"flex w-full items-center gap-2\", className)} {...props}>\n        {search ? (\n          <div className=\"relative flex-1\">\n            <Search\n              aria-hidden=\"true\"\n              className=\"-translate-y-1/2 absolute top-1/2 left-3 size-4 text-muted-foreground\"\n            />\n            <input\n              type=\"search\"\n              placeholder={search.placeholder}\n              value={search.value}\n              onChange={(e) => search.onChange(e.target.value)}\n              className={cn(\n                \"w-full rounded-md border border-border/40 bg-card py-2 pr-3 pl-9\",\n                \"font-sans text-body-sm text-foreground placeholder:text-muted-foreground\",\n                \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n              )}\n            />\n          </div>\n        ) : null}\n        {onFilterClick !== undefined ? (\n          <button\n            type=\"button\"\n            onClick={onFilterClick}\n            aria-label=\"Filter\"\n            className={cn(\n              \"inline-flex size-9 items-center justify-center rounded-md border border-border/40\",\n              \"text-muted-foreground transition-colors\",\n              \"hover:bg-muted hover:text-foreground\",\n              \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n            )}\n          >\n            <Filter aria-hidden=\"true\" className=\"size-4\" />\n          </button>\n        ) : null}\n        {primaryAction !== undefined ? (\n          <button\n            type=\"button\"\n            onClick={primaryAction.onClick}\n            disabled={isLoading}\n            className={cn(\n              \"ml-auto inline-flex items-center gap-2 rounded-md bg-primary px-3 py-2\",\n              \"font-medium font-sans text-body-sm text-primary-foreground\",\n              \"transition-colors hover:bg-primary-deep\",\n              \"disabled:cursor-not-allowed disabled:opacity-60\",\n              \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n            )}\n          >\n            {isLoading ? (\n              <Loader2 aria-hidden=\"true\" className=\"size-4 animate-spin\" />\n            ) : PrimaryIcon ? (\n              <PrimaryIcon aria-hidden=\"true\" className=\"size-4\" />\n            ) : null}\n            {primaryAction.label}\n          </button>\n        ) : null}\n      </div>\n    );\n  },\n);\nActionBar.displayName = \"ActionBar\";\n\nexport { ActionBar };\n"]}

package/dist/chunk-CDA6RYOX.js

@@ -0,0 +1,115 @@
+import { ChatComposer } from './chunk-HQFTW7SF.js';
+import { MentionMenu } from './chunk-6VINZJBV.js';
+import { cn } from './chunk-ZSRJCIWF.js';
+import { useState, useMemo } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var TRIGGER_CHARS = ["/", "@", "#"];
+var TRIGGER_RE = /(^|\s)([/@#])([^\s]*)$/;
+function detectTrigger(value) {
+  const match = value.match(TRIGGER_RE);
+  if (!match) return null;
+  const leading = match[1] ?? "";
+  const triggerChar = match[2];
+  const query = match[3] ?? "";
+  if (!TRIGGER_CHARS.includes(triggerChar)) return null;
+  const start = (match.index ?? 0) + leading.length;
+  return { trigger: triggerChar, query, start };
+}
+function resolveItems(source, query) {
+  if (!source) return [];
+  if (typeof source === "function") return source(query);
+  if (!query) return source;
+  const q = query.toLowerCase();
+  return source.filter((item) => {
+    const haystack = `${typeof item.label === "string" ? item.label : ""} ${typeof item.description === "string" ? item.description : ""}`.toLowerCase();
+    return haystack.includes(q);
+  });
+}
+function defaultInsertText(item, trigger) {
+  const label = typeof item.label === "string" ? item.label : "";
+  if (label.startsWith(trigger)) return label;
+  return `${trigger}${label}`;
+}
+function AgentComposer({
+  value,
+  onValueChange,
+  commands,
+  files,
+  memories,
+  resolveInsertText = defaultInsertText,
+  emptyLabels,
+  containerClassName,
+  className,
+  textareaProps,
+  ...chatComposerProps
+}) {
+  const [dismissedAt, setDismissedAt] = useState(null);
+  const detected = useMemo(() => detectTrigger(value), [value]);
+  const isDismissed = detected !== null && dismissedAt === detected.start;
+  const activeTrigger = isDismissed ? null : detected?.trigger ?? null;
+  const query = isDismissed ? "" : detected?.query ?? "";
+  const items = useMemo(() => {
+    if (!activeTrigger || !detected) return [];
+    if (activeTrigger === "/") return resolveItems(commands, query);
+    if (activeTrigger === "@") return resolveItems(files, query);
+    if (activeTrigger === "#") return resolveItems(memories, query);
+    return [];
+  }, [activeTrigger, detected, commands, files, memories, query]);
+  const handleSelect = (item) => {
+    if (!detected) return;
+    const before = value.slice(0, detected.start);
+    const insert = resolveInsertText(item, detected.trigger);
+    onValueChange(`${before}${insert} `);
+    setDismissedAt(null);
+  };
+  const handleClose = () => {
+    if (detected) setDismissedAt(detected.start);
+  };
+  const interceptKeyDown = (e) => {
+    if (activeTrigger) {
+      if (["ArrowDown", "ArrowUp", "Enter", "Escape"].includes(e.key)) {
+        if (e.key === "Enter") e.preventDefault();
+        return;
+      }
+    }
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      e.currentTarget.form?.requestSubmit();
+    }
+    textareaProps?.onKeyDown?.(e);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cn("relative", containerClassName), children: [
+    /* @__PURE__ */ jsx(
+      MentionMenu,
+      {
+        open: !!activeTrigger && items !== null,
+        trigger: activeTrigger ?? "/",
+        items,
+        onSelect: handleSelect,
+        onClose: handleClose,
+        emptyLabel: activeTrigger ? emptyLabels?.[activeTrigger] : void 0
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ChatComposer,
+      {
+        value,
+        onValueChange: (next) => {
+          if (!detectTrigger(next)) setDismissedAt(null);
+          onValueChange(next);
+        },
+        className,
+        textareaProps: {
+          ...textareaProps,
+          onKeyDown: interceptKeyDown
+        },
+        ...chatComposerProps
+      }
+    )
+  ] });
+}
+
+export { AgentComposer };
+//# sourceMappingURL=chunk-CDA6RYOX.js.map
+//# sourceMappingURL=chunk-CDA6RYOX.js.map

package/dist/chunk-CDA6RYOX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/agent-composer/agent-composer.tsx"],"names":[],"mappings":"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","file":"chunk-CDA6RYOX.js","sourcesContent":["import { useMemo, useState } from \"react\";\nimport type { ComponentProps, KeyboardEvent, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport {\n  type MentionItem,\n  MentionMenu,\n  type MentionTrigger,\n} from \"../../primitives/mention-menu/index.js\";\nimport { ChatComposer } from \"../chat-composer/chat-composer.js\";\n\n/**\n * AgentComposer — ChatComposer + slash-command / @file / #memory triggers.\n *\n * Wraps ChatComposer and watches the value for three trigger characters:\n *   `/` → slash commands (`/clear`, `/help`, …)\n *   `@` → file references (`@src/components/Foo.tsx`)\n *   `#` → memory entries (`#alignment-grid`)\n *\n * Detection is string-based — no textarea ref required. A trigger is active\n * iff the value ends with a token of the form `[\\s|^]([/@#])[^\\s]*` (i.e. a\n * trigger char preceded by start-of-string or whitespace, with no space\n * after).\n *\n * The consumer provides the candidate items per trigger. On selection the\n * trailing token is replaced with the chosen value plus a trailing space.\n */\n\ntype ItemsProvider = (query: string) => MentionItem[];\n\ninterface AgentComposerProps extends ComponentProps<typeof ChatComposer> {\n  /** Items shown when `/` is the active trigger. */\n  commands?: MentionItem[] | ItemsProvider;\n  /** Items shown when `@` is the active trigger. */\n  files?: MentionItem[] | ItemsProvider;\n  /** Items shown when `#` is the active trigger. */\n  memories?: MentionItem[] | ItemsProvider;\n  /**\n   * What text gets inserted when an item is picked. Defaults to\n   * `${trigger}${item.label}` (assumes `label` is a string). Override to\n   * insert a token different from the visible label (e.g. include path,\n   * id, …).\n   */\n  resolveInsertText?: (item: MentionItem, trigger: MentionTrigger) => string;\n  /** Optional slot for the empty-state copy per trigger. */\n  emptyLabels?: Partial<Record<MentionTrigger, ReactNode>>;\n  /** Outer wrapper className (the relative positioning anchor for the menu). */\n  containerClassName?: string;\n}\n\nconst TRIGGER_CHARS: ReadonlyArray<MentionTrigger> = [\"/\", \"@\", \"#\"];\n\nconst TRIGGER_RE = /(^|\\s)([/@#])([^\\s]*)$/;\n\ninterface DetectedTrigger {\n  trigger: MentionTrigger;\n  query: string;\n  /** Index in the value where the trigger char starts. */\n  start: number;\n}\n\nfunction detectTrigger(value: string): DetectedTrigger | null {\n  const match = value.match(TRIGGER_RE);\n  if (!match) return null;\n  const leading = match[1] ?? \"\";\n  const triggerChar = match[2] as MentionTrigger;\n  const query = match[3] ?? \"\";\n  if (!TRIGGER_CHARS.includes(triggerChar)) return null;\n  // start = position of the trigger char itself\n  const start = (match.index ?? 0) + leading.length;\n  return { trigger: triggerChar, query, start };\n}\n\nfunction resolveItems(\n  source: MentionItem[] | ItemsProvider | undefined,\n  query: string,\n): MentionItem[] {\n  if (!source) return [];\n  if (typeof source === \"function\") return source(query);\n  if (!query) return source;\n  const q = query.toLowerCase();\n  return source.filter((item) => {\n    const haystack = `${typeof item.label === \"string\" ? item.label : \"\"} ${\n      typeof item.description === \"string\" ? item.description : \"\"\n    }`.toLowerCase();\n    return haystack.includes(q);\n  });\n}\n\nfunction defaultInsertText(item: MentionItem, trigger: MentionTrigger): string {\n  const label = typeof item.label === \"string\" ? item.label : \"\";\n  // If the visible label already starts with the trigger char (e.g. \"/clear\"),\n  // use it as-is so we don't end up with \"//clear\".\n  if (label.startsWith(trigger)) return label;\n  return `${trigger}${label}`;\n}\n\nexport function AgentComposer({\n  value,\n  onValueChange,\n  commands,\n  files,\n  memories,\n  resolveInsertText = defaultInsertText,\n  emptyLabels,\n  containerClassName,\n  className,\n  textareaProps,\n  ...chatComposerProps\n}: AgentComposerProps) {\n  // Trigger detection + manual dismiss state.\n  // We honour `dismissed` so the user can Esc the menu and keep typing after\n  // a trigger char without the menu re-appearing.\n  const [dismissedAt, setDismissedAt] = useState<number | null>(null);\n\n  const detected = useMemo(() => detectTrigger(value), [value]);\n  const isDismissed = detected !== null && dismissedAt === detected.start;\n  const activeTrigger = isDismissed ? null : (detected?.trigger ?? null);\n  const query = isDismissed ? \"\" : (detected?.query ?? \"\");\n\n  const items = useMemo(() => {\n    if (!activeTrigger || !detected) return [];\n    if (activeTrigger === \"/\") return resolveItems(commands, query);\n    if (activeTrigger === \"@\") return resolveItems(files, query);\n    if (activeTrigger === \"#\") return resolveItems(memories, query);\n    return [];\n  }, [activeTrigger, detected, commands, files, memories, query]);\n\n  const handleSelect = (item: MentionItem) => {\n    if (!detected) return;\n    const before = value.slice(0, detected.start);\n    const insert = resolveInsertText(item, detected.trigger);\n    onValueChange(`${before}${insert} `);\n    setDismissedAt(null);\n  };\n\n  const handleClose = () => {\n    if (detected) setDismissedAt(detected.start);\n  };\n\n  const interceptKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => {\n    if (activeTrigger) {\n      // Let MentionMenu's global key handler take Arrow/Enter/Esc.\n      if ([\"ArrowDown\", \"ArrowUp\", \"Enter\", \"Escape\"].includes(e.key)) {\n        if (e.key === \"Enter\") e.preventDefault(); // also prevent form submit\n        return;\n      }\n    }\n    // Mirror ChatComposer's default Enter-to-submit when menu is closed.\n    if (e.key === \"Enter\" && !e.shiftKey) {\n      e.preventDefault();\n      (e.currentTarget.form as HTMLFormElement | null)?.requestSubmit();\n    }\n    textareaProps?.onKeyDown?.(e);\n  };\n\n  return (\n    <div className={cn(\"relative\", containerClassName)}>\n      <MentionMenu\n        open={!!activeTrigger && items !== null}\n        trigger={(activeTrigger ?? \"/\") as MentionTrigger}\n        items={items}\n        onSelect={handleSelect}\n        onClose={handleClose}\n        emptyLabel={activeTrigger ? emptyLabels?.[activeTrigger] : undefined}\n      />\n      <ChatComposer\n        value={value}\n        onValueChange={(next) => {\n          // If user clears the trigger token, drop the dismissed marker too.\n          if (!detectTrigger(next)) setDismissedAt(null);\n          onValueChange(next);\n        }}\n        className={className}\n        textareaProps={{\n          ...textareaProps,\n          onKeyDown: interceptKeyDown,\n        }}\n        {...chatComposerProps}\n      />\n    </div>\n  );\n}\n"]}

package/dist/chunk-CG7O3A42.js

@@ -0,0 +1,80 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var formatTokens = (n) => {
+  if (n >= 1e6) return `${(n / 1e6).toFixed(1)}M`;
+  if (n >= 1e3) return `${(n / 1e3).toFixed(1)}k`;
+  return `${n}`;
+};
+var ContextWindowBar = forwardRef(
+  ({
+    className,
+    used,
+    total,
+    trailing,
+    label = "Context",
+    compact,
+    warnAt = 0.7,
+    dangerAt = 0.9,
+    ...props
+  }, ref) => {
+    const ratio = Math.max(0, Math.min(1, used / total));
+    const tone = ratio >= dangerAt ? "destructive" : ratio >= warnAt ? "warning" : "primary";
+    const percent = Math.round(ratio * 100);
+    const barColor = {
+      primary: "bg-primary",
+      warning: "bg-warning",
+      destructive: "bg-destructive"
+    }[tone];
+    const textColor = {
+      primary: "text-foreground",
+      warning: "text-warning",
+      destructive: "text-destructive"
+    }[tone];
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn("grid gap-1.5", className), ...props, children: [
+      !compact ? /* @__PURE__ */ jsxs("div", { className: "flex items-baseline justify-between gap-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "font-mono text-label-caps text-muted-foreground uppercase tracking-wider", children: label }),
+        /* @__PURE__ */ jsxs("span", { className: cn("font-mono text-body-sm tabular-nums", textColor), children: [
+          formatTokens(used),
+          " / ",
+          formatTokens(total),
+          " ",
+          /* @__PURE__ */ jsxs("span", { className: "opacity-60", children: [
+            "(",
+            percent,
+            "%)"
+          ] })
+        ] })
+      ] }) : null,
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "h-1.5 w-full overflow-hidden rounded-full bg-muted",
+          role: "progressbar",
+          tabIndex: -1,
+          "aria-valuenow": used,
+          "aria-valuemin": 0,
+          "aria-valuemax": total,
+          "aria-label": `${percent}% of context window used`,
+          children: /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "h-full rounded-full transition-[width,background-color] duration-base ease-out-soft",
+                barColor
+              ),
+              style: { width: `${percent}%` }
+            }
+          )
+        }
+      ),
+      trailing ? /* @__PURE__ */ jsx("div", { className: "font-mono text-label text-muted-foreground", children: trailing }) : null
+    ] });
+  }
+);
+ContextWindowBar.displayName = "ContextWindowBar";
+
+export { ContextWindowBar };
+//# sourceMappingURL=chunk-CG7O3A42.js.map
+//# sourceMappingURL=chunk-CG7O3A42.js.map

package/dist/chunk-CG7O3A42.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/context-window-bar/context-window-bar.tsx"],"names":[],"mappings":"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","file":"chunk-CG7O3A42.js","sourcesContent":["import { forwardRef } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\ninterface ContextWindowBarProps extends HTMLAttributes<HTMLDivElement> {\n  /** Tokens currently used in the context window. */\n  used: number;\n  /** Model's total context capacity (e.g. 200_000, 1_000_000). */\n  total: number;\n  /** Optional secondary label rendered on the right (e.g. model name). */\n  trailing?: ReactNode;\n  /** Optional title shown above the bar. */\n  label?: ReactNode;\n  /** Compact mode hides numbers and label; just the bar. */\n  compact?: boolean;\n  /**\n   * Override warning thresholds (0..1). Defaults: warn 0.7, danger 0.9.\n   */\n  warnAt?: number;\n  dangerAt?: number;\n}\n\nconst formatTokens = (n: number) => {\n  if (n >= 1_000_000) return `${(n / 1_000_000).toFixed(1)}M`;\n  if (n >= 1_000) return `${(n / 1_000).toFixed(1)}k`;\n  return `${n}`;\n};\n\n/**\n * ContextWindowBar — shows how much of the model's context window has been\n * consumed. Color transitions: success → warning → destructive past thresholds.\n *\n * Critical for transparency: a user should always be able to glance at this\n * and know if the conversation is about to hit the cap.\n */\nconst ContextWindowBar = forwardRef<HTMLDivElement, ContextWindowBarProps>(\n  (\n    {\n      className,\n      used,\n      total,\n      trailing,\n      label = \"Context\",\n      compact,\n      warnAt = 0.7,\n      dangerAt = 0.9,\n      ...props\n    },\n    ref,\n  ) => {\n    const ratio = Math.max(0, Math.min(1, used / total));\n    const tone = ratio >= dangerAt ? \"destructive\" : ratio >= warnAt ? \"warning\" : \"primary\";\n    const percent = Math.round(ratio * 100);\n\n    const barColor = {\n      primary: \"bg-primary\",\n      warning: \"bg-warning\",\n      destructive: \"bg-destructive\",\n    }[tone];\n\n    const textColor = {\n      primary: \"text-foreground\",\n      warning: \"text-warning\",\n      destructive: \"text-destructive\",\n    }[tone];\n\n    return (\n      <div ref={ref} className={cn(\"grid gap-1.5\", className)} {...props}>\n        {!compact ? (\n          <div className=\"flex items-baseline justify-between gap-2\">\n            <span className=\"font-mono text-label-caps text-muted-foreground uppercase tracking-wider\">\n              {label}\n            </span>\n            <span className={cn(\"font-mono text-body-sm tabular-nums\", textColor)}>\n              {formatTokens(used)} / {formatTokens(total)}{\" \"}\n              <span className=\"opacity-60\">({percent}%)</span>\n            </span>\n          </div>\n        ) : null}\n        <div\n          className=\"h-1.5 w-full overflow-hidden rounded-full bg-muted\"\n          role=\"progressbar\"\n          tabIndex={-1}\n          aria-valuenow={used}\n          aria-valuemin={0}\n          aria-valuemax={total}\n          aria-label={`${percent}% of context window used`}\n        >\n          <div\n            className={cn(\n              \"h-full rounded-full transition-[width,background-color] duration-base ease-out-soft\",\n              barColor,\n            )}\n            style={{ width: `${percent}%` }}\n          />\n        </div>\n        {trailing ? (\n          <div className=\"font-mono text-label text-muted-foreground\">{trailing}</div>\n        ) : null}\n      </div>\n    );\n  },\n);\nContextWindowBar.displayName = \"ContextWindowBar\";\n\nexport { ContextWindowBar };\n"]}

package/dist/chunk-CIYGNPKT.js

@@ -0,0 +1,76 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var STATUS_CLASS = {
+  running: "bg-success animate-pulse",
+  queued: "bg-warning",
+  completed: "bg-muted-foreground/50",
+  failed: "bg-destructive",
+  cancelled: "bg-muted-foreground/30"
+};
+var STATUS_LABEL = {
+  running: "Running",
+  queued: "Queued",
+  completed: "Completed",
+  failed: "Failed",
+  cancelled: "Cancelled"
+};
+var MODE_CLASS = {
+  chat: "bg-primary/15 text-primary",
+  code: "bg-success/15 text-success",
+  infra: "bg-accent/15 text-accent"
+};
+var SessionListItem = forwardRef(
+  ({ className, title, status, mode, timestamp, unread, active, onClick, disabled, ...props }, ref) => /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ref,
+      type: "button",
+      onClick,
+      disabled,
+      "aria-current": active ? "true" : void 0,
+      className: cn(
+        "group grid w-full grid-cols-[auto_1fr_auto] items-center gap-2 rounded-md px-2 py-2 text-left",
+        "transition-colors duration-base ease-out-soft",
+        active ? "bg-muted text-foreground" : "text-muted-foreground hover:bg-muted/50 hover:text-foreground",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        "disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: cn("size-2 shrink-0 rounded-full", STATUS_CLASS[status]),
+            "aria-label": STATUS_LABEL[status],
+            role: "img"
+          }
+        ),
+        /* @__PURE__ */ jsxs("span", { className: "grid min-w-0", children: [
+          /* @__PURE__ */ jsx("span", { className: "truncate font-medium text-body-sm", children: title }),
+          (mode || timestamp) && /* @__PURE__ */ jsxs("span", { className: "mt-0.5 flex items-center gap-1.5 font-mono text-label text-muted-foreground", children: [
+            mode ? /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: cn(
+                  "inline-flex h-3.5 items-center rounded px-1 font-medium text-label-caps uppercase tracking-wider",
+                  MODE_CLASS[mode]
+                ),
+                children: mode
+              }
+            ) : null,
+            timestamp ? /* @__PURE__ */ jsx("span", { className: "truncate", children: timestamp }) : null
+          ] })
+        ] }),
+        unread && unread > 0 ? /* @__PURE__ */ jsx("span", { className: "inline-flex min-w-[1.25rem] shrink-0 items-center justify-center rounded-full bg-primary px-1.5 font-mono text-label text-primary-foreground tabular-nums", children: unread > 99 ? "99+" : unread }) : null
+      ]
+    }
+  )
+);
+SessionListItem.displayName = "SessionListItem";
+
+export { SessionListItem };
+//# sourceMappingURL=chunk-CIYGNPKT.js.map
+//# sourceMappingURL=chunk-CIYGNPKT.js.map

package/dist/chunk-CIYGNPKT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/session-list-item/session-list-item.tsx"],"names":[],"mappings":";;;;AAwBA,IAAM,YAAA,GAAiD;AAAA,EACrD,OAAA,EAAS,0BAAA;AAAA,EACT,MAAA,EAAQ,YAAA;AAAA,EACR,SAAA,EAAW,wBAAA;AAAA,EACX,MAAA,EAAQ,gBAAA;AAAA,EACR,SAAA,EAAW;AACb,CAAA;AAEA,IAAM,YAAA,GAAiD;AAAA,EACrD,OAAA,EAAS,SAAA;AAAA,EACT,MAAA,EAAQ,QAAA;AAAA,EACR,SAAA,EAAW,WAAA;AAAA,EACX,MAAA,EAAQ,QAAA;AAAA,EACR,SAAA,EAAW;AACb,CAAA;AAEA,IAAM,UAAA,GAA0C;AAAA,EAC9C,IAAA,EAAM,4BAAA;AAAA,EACN,IAAA,EAAM,4BAAA;AAAA,EACN,KAAA,EAAO;AACT,CAAA;AAkBA,IAAM,eAAA,GAAkB,UAAA;AAAA,EACtB,CACE,EAAE,SAAA,EAAW,KAAA,EAAO,QAAQ,IAAA,EAAM,SAAA,EAAW,MAAA,EAAQ,MAAA,EAAQ,OAAA,EAAS,QAAA,EAAU,GAAG,KAAA,IACnF,GAAA,qBAEA,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,IAAA,EAAK,QAAA;AAAA,MACL,OAAA;AAAA,MACA,QAAA;AAAA,MACA,cAAA,EAAc,SAAS,MAAA,GAAS,MAAA;AAAA,MAChC,SAAA,EAAW,EAAA;AAAA,QACT,+FAAA;AAAA,QACA,+CAAA;AAAA,QACA,SACI,0BAAA,GACA,+DAAA;AAAA,QACJ,yEAAA;AAAA,QACA,iDAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,EAAA,CAAG,8BAAA,EAAgC,YAAA,CAAa,MAAM,CAAC,CAAA;AAAA,YAClE,YAAA,EAAY,aAAa,MAAM,CAAA;AAAA,YAC/B,IAAA,EAAK;AAAA;AAAA,SACP;AAAA,wBACA,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,cAAA,EACd,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,mCAAA,EAAqC,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,UAAA,CACzD,IAAA,IAAQ,SAAA,qBACR,IAAA,CAAC,MAAA,EAAA,EAAK,WAAU,6EAAA,EACb,QAAA,EAAA;AAAA,YAAA,IAAA,mBACC,GAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAW,EAAA;AAAA,kBACT,kGAAA;AAAA,kBACA,WAAW,IAAI;AAAA,iBACjB;AAAA,gBAEC,QAAA,EAAA;AAAA;AAAA,aACH,GACE,IAAA;AAAA,YACH,4BAAY,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,UAAA,EAAY,qBAAU,CAAA,GAAU;AAAA,WAAA,EAC/D;AAAA,SAAA,EAEJ,CAAA;AAAA,QACC,MAAA,IAAU,MAAA,GAAS,CAAA,mBAClB,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2JAAA,EACb,QAAA,EAAA,MAAA,GAAS,EAAA,GAAK,KAAA,GAAQ,MAAA,EACzB,CAAA,GACE;AAAA;AAAA;AAAA;AAGV;AACA,eAAA,CAAgB,WAAA,GAAc,iBAAA","file":"chunk-CIYGNPKT.js","sourcesContent":["import { forwardRef } from \"react\";\nimport type { ButtonHTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * SessionListItem — single row in the sidebar's Sessions list for a code agent\n * app. Richer than the generic `Sidebar.Item`: shows a status dot, the agent\n * mode last used (chat/code/infra), and a relative timestamp.\n *\n *   <SessionListItem\n *     title=\"Build the alignment grid demo\"\n *     status=\"running\"\n *     mode=\"code\"\n *     timestamp=\"2m ago\"\n *     active\n *     onClick={() => navigate(`/session/${id}`)}\n *   />\n *\n * The status dot maps to the agent run state and animates while running.\n */\n\nexport type SessionRunStatus = \"running\" | \"queued\" | \"completed\" | \"failed\" | \"cancelled\";\nexport type SessionMode = \"chat\" | \"code\" | \"infra\";\n\nconst STATUS_CLASS: Record<SessionRunStatus, string> = {\n  running: \"bg-success animate-pulse\",\n  queued: \"bg-warning\",\n  completed: \"bg-muted-foreground/50\",\n  failed: \"bg-destructive\",\n  cancelled: \"bg-muted-foreground/30\",\n};\n\nconst STATUS_LABEL: Record<SessionRunStatus, string> = {\n  running: \"Running\",\n  queued: \"Queued\",\n  completed: \"Completed\",\n  failed: \"Failed\",\n  cancelled: \"Cancelled\",\n};\n\nconst MODE_CLASS: Record<SessionMode, string> = {\n  chat: \"bg-primary/15 text-primary\",\n  code: \"bg-success/15 text-success\",\n  infra: \"bg-accent/15 text-accent\",\n};\n\ninterface SessionListItemProps\n  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"type\" | \"children\" | \"title\"> {\n  /** Session title (truncated). */\n  title: ReactNode;\n  /** Agent run state. Drives the status dot. */\n  status: SessionRunStatus;\n  /** Last mode the user was viewing this session in. Optional pill. */\n  mode?: SessionMode;\n  /** Relative timestamp string (\"2m ago\", \"yesterday\"). */\n  timestamp?: ReactNode;\n  /** Optional unread count (pending agent events, new outputs). */\n  unread?: number;\n  /** Whether this is the currently selected session. */\n  active?: boolean;\n}\n\nconst SessionListItem = forwardRef<HTMLButtonElement, SessionListItemProps>(\n  (\n    { className, title, status, mode, timestamp, unread, active, onClick, disabled, ...props },\n    ref,\n  ) => (\n    <button\n      ref={ref}\n      type=\"button\"\n      onClick={onClick}\n      disabled={disabled}\n      aria-current={active ? \"true\" : undefined}\n      className={cn(\n        \"group grid w-full grid-cols-[auto_1fr_auto] items-center gap-2 rounded-md px-2 py-2 text-left\",\n        \"transition-colors duration-base ease-out-soft\",\n        active\n          ? \"bg-muted text-foreground\"\n          : \"text-muted-foreground hover:bg-muted/50 hover:text-foreground\",\n        \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n        \"disabled:cursor-not-allowed disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      <span\n        className={cn(\"size-2 shrink-0 rounded-full\", STATUS_CLASS[status])}\n        aria-label={STATUS_LABEL[status]}\n        role=\"img\"\n      />\n      <span className=\"grid min-w-0\">\n        <span className=\"truncate font-medium text-body-sm\">{title}</span>\n        {(mode || timestamp) && (\n          <span className=\"mt-0.5 flex items-center gap-1.5 font-mono text-label text-muted-foreground\">\n            {mode ? (\n              <span\n                className={cn(\n                  \"inline-flex h-3.5 items-center rounded px-1 font-medium text-label-caps uppercase tracking-wider\",\n                  MODE_CLASS[mode],\n                )}\n              >\n                {mode}\n              </span>\n            ) : null}\n            {timestamp ? <span className=\"truncate\">{timestamp}</span> : null}\n          </span>\n        )}\n      </span>\n      {unread && unread > 0 ? (\n        <span className=\"inline-flex min-w-[1.25rem] shrink-0 items-center justify-center rounded-full bg-primary px-1.5 font-mono text-label text-primary-foreground tabular-nums\">\n          {unread > 99 ? \"99+\" : unread}\n        </span>\n      ) : null}\n    </button>\n  ),\n);\nSessionListItem.displayName = \"SessionListItem\";\n\nexport { SessionListItem };\n"]}