@usetheo/ui 0.12.0 → 0.13.1

package/dist/chunk-SQ66DCXY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/folder-selector/folder-selector.tsx"],"names":[],"mappings":";;;;;AAqBA,IAAM,cAAA,GAAiB,UAAA;AAAA,EACrB,CAAC,EAAE,SAAA,EAAW,IAAA,EAAM,SAAS,GAAG,KAAA,IAAS,GAAA,qBACvC,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,iBAAA;AAAA,MACV,GAAA;AAAA,MACA,IAAA,EAAK,QAAA;AAAA,MACL,SAAA,EAAW,EAAA;AAAA,QACT,2EAAA;AAAA,QACA,wCAAA;AAAA,QACA,+CAAA;AAAA,QACA,wCAAA;AAAA,QACA,0IAAA;AAAA,QACA,UAAU,YAAA,GAAe,WAAA;AAAA,QACzB;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,SAAA,EAAU,uCAAA,EAAwC,aAAA,EAAY,MAAA,EAAO,CAAA;AAAA,wBAC7E,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,mCAAA,EAAqC,QAAA,EAAA,IAAA,EAAK,CAAA;AAAA,wBAC1D,GAAA,CAAC,WAAA,EAAA,EAAY,SAAA,EAAU,uCAAA,EAAwC,eAAY,MAAA,EAAO;AAAA;AAAA;AAAA;AAGxF;AACA,cAAA,CAAe,WAAA,GAAc,gBAAA","file":"chunk-SQ66DCXY.js","sourcesContent":["import { ChevronDown, Folder } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { ButtonHTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\ninterface FolderSelectorProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Currently selected absolute path. */\n  path: string;\n  /**\n   * Render in compact mode (smaller height, no chevron padding).\n   * Default is the full-width composer variant used in the Files panel.\n   */\n  compact?: boolean;\n}\n\n/**\n * FolderSelector — chip showing the active working directory.\n *\n * Visual: folder icon + monospaced path (truncated middle) + chevron.\n * Stateless: caller handles the actual folder-picker dialog.\n */\nconst FolderSelector = forwardRef<HTMLButtonElement, FolderSelectorProps>(\n  ({ className, path, compact, ...props }, ref) => (\n    <button\n      data-slot=\"folder-selector\"\n      ref={ref}\n      type=\"button\"\n      className={cn(\n        \"inline-flex items-center gap-2 rounded-lg border border-border/60 bg-card\",\n        \"font-mono text-code-sm text-foreground\",\n        \"transition-colors duration-base ease-out-soft\",\n        \"hover:border-primary/40 hover:bg-muted\",\n        \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n        compact ? \"h-8 px-2.5\" : \"h-10 px-3\",\n        className,\n      )}\n      {...props}\n    >\n      <Folder className=\"size-4 shrink-0 text-muted-foreground\" aria-hidden=\"true\" />\n      <span className=\"min-w-0 flex-1 truncate text-left\">{path}</span>\n      <ChevronDown className=\"size-3 shrink-0 text-muted-foreground\" aria-hidden=\"true\" />\n    </button>\n  ),\n);\nFolderSelector.displayName = \"FolderSelector\";\n\nexport { FolderSelector };\n"]}

package/dist/chunk-SXKGWHAM.js

@@ -0,0 +1,179 @@
+import { cn } from './chunk-EWDN56AS.js';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import { Check, Circle, ChevronRight } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var Trigger2 = DropdownMenuPrimitive.Trigger;
+var Portal2 = DropdownMenuPrimitive.Portal;
+var Group2 = DropdownMenuPrimitive.Group;
+var Sub2 = DropdownMenuPrimitive.Sub;
+var RadioGroup2 = DropdownMenuPrimitive.RadioGroup;
+var Content2 = forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Content,
+  {
+    "data-slot": "dropdown-menu-content",
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 min-w-32 overflow-hidden rounded-lg border border-border/40 bg-card p-1",
+      "text-card-foreground shadow-md",
+      "data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:animate-in",
+      "data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out",
+      className
+    ),
+    ...props
+  }
+) }));
+Content2.displayName = "DropdownMenu.Content";
+var Item2 = forwardRef(
+  ({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive.Item,
+    {
+      "data-slot": "dropdown-menu-item",
+      ref,
+      className: cn(
+        "relative flex cursor-default select-none items-center gap-2 rounded-md px-2 py-1.5",
+        "font-sans text-body-sm text-foreground outline-none",
+        "transition-colors",
+        "focus:bg-muted focus:text-foreground",
+        "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        inset && "pl-8",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Item2.displayName = "DropdownMenu.Item";
+var CheckboxItem2 = forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.CheckboxItem,
+  {
+    "data-slot": "dropdown-menu-checkbox-item",
+    ref,
+    checked,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-md py-1.5 pr-2 pl-8",
+      "font-sans text-body-sm text-foreground outline-none",
+      "transition-colors focus:bg-muted focus:text-foreground",
+      "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { "aria-hidden": "true", className: "size-4" }) }) }),
+      children
+    ]
+  }
+));
+CheckboxItem2.displayName = "DropdownMenu.CheckboxItem";
+var RadioItem2 = forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.RadioItem,
+  {
+    "data-slot": "dropdown-menu-radio-item",
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-md py-1.5 pr-2 pl-8",
+      "font-sans text-body-sm text-foreground outline-none",
+      "transition-colors focus:bg-muted focus:text-foreground",
+      "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Circle, { "aria-hidden": "true", className: "size-2 fill-current" }) }) }),
+      children
+    ]
+  }
+));
+RadioItem2.displayName = "DropdownMenu.RadioItem";
+var Label2 = forwardRef(
+  ({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive.Label,
+    {
+      "data-slot": "dropdown-menu-label",
+      ref,
+      className: cn(
+        "px-2 py-1.5 font-medium font-sans text-label-caps text-muted-foreground uppercase tracking-wider",
+        inset && "pl-8",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Label2.displayName = "DropdownMenu.Label";
+var Separator2 = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Separator,
+  {
+    "data-slot": "dropdown-menu-separator",
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-border/40", className),
+    ...props
+  }
+));
+Separator2.displayName = "DropdownMenu.Separator";
+var Shortcut = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    className: cn("ml-auto font-mono text-label text-muted-foreground", className),
+    ...props
+  }
+);
+Shortcut.displayName = "DropdownMenu.Shortcut";
+var SubTrigger2 = forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.SubTrigger,
+  {
+    "data-slot": "dropdown-menu-sub-trigger",
+    ref,
+    className: cn(
+      "flex cursor-default select-none items-center gap-2 rounded-md px-2 py-1.5",
+      "font-sans text-body-sm text-foreground outline-none",
+      "focus:bg-muted data-[state=open]:bg-muted",
+      inset && "pl-8",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": "true", className: "ml-auto size-3.5" })
+    ]
+  }
+));
+SubTrigger2.displayName = "DropdownMenu.SubTrigger";
+var SubContent2 = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.SubContent,
+  {
+    "data-slot": "dropdown-menu-sub-content",
+    ref,
+    className: cn(
+      "z-50 min-w-32 overflow-hidden rounded-lg border border-border/40 bg-card p-1",
+      "text-card-foreground shadow-md",
+      "data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:animate-in",
+      "data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out",
+      className
+    ),
+    ...props
+  }
+));
+SubContent2.displayName = "DropdownMenu.SubContent";
+var DropdownMenu = Object.assign(DropdownMenuPrimitive.Root, {
+  Trigger: Trigger2,
+  Portal: Portal2,
+  Content: Content2,
+  Item: Item2,
+  CheckboxItem: CheckboxItem2,
+  RadioItem: RadioItem2,
+  Label: Label2,
+  Separator: Separator2,
+  Shortcut,
+  Group: Group2,
+  Sub: Sub2,
+  SubTrigger: SubTrigger2,
+  SubContent: SubContent2,
+  RadioGroup: RadioGroup2
+});
+
+export { DropdownMenu };
+//# sourceMappingURL=chunk-SXKGWHAM.js.map
+//# sourceMappingURL=chunk-SXKGWHAM.js.map

package/dist/chunk-SXKGWHAM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/dropdown-menu/dropdown-menu.tsx"],"names":["Trigger","Portal","Group","Sub","RadioGroup","Content","Item","CheckboxItem","RadioItem","Label","Separator","SubTrigger","SubContent"],"mappings":"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","file":"chunk-SXKGWHAM.js","sourcesContent":["import * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport { Check, ChevronRight, Circle } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementRef, HTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * DropdownMenu — accessible menu primitive built on Radix.\n *\n * Composition (single import surface):\n *   <DropdownMenu>\n *     <DropdownMenu.Trigger>…</DropdownMenu.Trigger>\n *     <DropdownMenu.Content>\n *       <DropdownMenu.Label>Section</DropdownMenu.Label>\n *       <DropdownMenu.Item onSelect={…}>Edit</DropdownMenu.Item>\n *       <DropdownMenu.Separator />\n *       <DropdownMenu.Item disabled>Delete</DropdownMenu.Item>\n *     </DropdownMenu.Content>\n *   </DropdownMenu>\n *\n * The primitive consolidates 5 prior direct-Radix usages\n * (`model-selector`, `intent-selector`, `agent-profile`,\n * `theme-switcher`, `theo-code-shell`) under a single styled\n * wrapper so consumers get consistent visuals + the design tokens.\n *\n * a11y note for tests: Radix's focus-guard spans intentionally\n * violate `aria-hidden-focus`. Tests should pass\n * `{ rules: { \"aria-hidden-focus\": { enabled: false } } }` to axe.\n */\n\nconst Trigger = DropdownMenuPrimitive.Trigger;\nconst Portal = DropdownMenuPrimitive.Portal;\nconst Group = DropdownMenuPrimitive.Group;\nconst Sub = DropdownMenuPrimitive.Sub;\nconst RadioGroup = DropdownMenuPrimitive.RadioGroup;\n\nconst Content = forwardRef<\n  ElementRef<typeof DropdownMenuPrimitive.Content>,\n  ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>\n>(({ className, sideOffset = 4, ...props }, ref) => (\n  <DropdownMenuPrimitive.Portal>\n    <DropdownMenuPrimitive.Content\n      data-slot=\"dropdown-menu-content\"\n      ref={ref}\n      sideOffset={sideOffset}\n      className={cn(\n        \"z-50 min-w-32 overflow-hidden rounded-lg border border-border/40 bg-card p-1\",\n        \"text-card-foreground shadow-md\",\n        \"data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:animate-in\",\n        \"data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out\",\n        className,\n      )}\n      {...props}\n    />\n  </DropdownMenuPrimitive.Portal>\n));\nContent.displayName = \"DropdownMenu.Content\";\n\ninterface ItemProps extends ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> {\n  inset?: boolean;\n}\n\nconst Item = forwardRef<ElementRef<typeof DropdownMenuPrimitive.Item>, ItemProps>(\n  ({ className, inset, ...props }, ref) => (\n    <DropdownMenuPrimitive.Item\n      data-slot=\"dropdown-menu-item\"\n      ref={ref}\n      className={cn(\n        \"relative flex cursor-default select-none items-center gap-2 rounded-md px-2 py-1.5\",\n        \"font-sans text-body-sm text-foreground outline-none\",\n        \"transition-colors\",\n        \"focus:bg-muted focus:text-foreground\",\n        \"data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n        inset && \"pl-8\",\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nItem.displayName = \"DropdownMenu.Item\";\n\nconst CheckboxItem = forwardRef<\n  ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n  ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n  <DropdownMenuPrimitive.CheckboxItem\n    data-slot=\"dropdown-menu-checkbox-item\"\n    ref={ref}\n    checked={checked}\n    className={cn(\n      \"relative flex cursor-default select-none items-center rounded-md py-1.5 pr-2 pl-8\",\n      \"font-sans text-body-sm text-foreground outline-none\",\n      \"transition-colors focus:bg-muted focus:text-foreground\",\n      \"data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      className,\n    )}\n    {...props}\n  >\n    <span className=\"absolute left-2 flex size-3.5 items-center justify-center\">\n      <DropdownMenuPrimitive.ItemIndicator>\n        <Check aria-hidden=\"true\" className=\"size-4\" />\n      </DropdownMenuPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </DropdownMenuPrimitive.CheckboxItem>\n));\nCheckboxItem.displayName = \"DropdownMenu.CheckboxItem\";\n\nconst RadioItem = forwardRef<\n  ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n  ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => (\n  <DropdownMenuPrimitive.RadioItem\n    data-slot=\"dropdown-menu-radio-item\"\n    ref={ref}\n    className={cn(\n      \"relative flex cursor-default select-none items-center rounded-md py-1.5 pr-2 pl-8\",\n      \"font-sans text-body-sm text-foreground outline-none\",\n      \"transition-colors focus:bg-muted focus:text-foreground\",\n      \"data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      className,\n    )}\n    {...props}\n  >\n    <span className=\"absolute left-2 flex size-3.5 items-center justify-center\">\n      <DropdownMenuPrimitive.ItemIndicator>\n        <Circle aria-hidden=\"true\" className=\"size-2 fill-current\" />\n      </DropdownMenuPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </DropdownMenuPrimitive.RadioItem>\n));\nRadioItem.displayName = \"DropdownMenu.RadioItem\";\n\ninterface LabelProps extends ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> {\n  inset?: boolean;\n}\n\nconst Label = forwardRef<ElementRef<typeof DropdownMenuPrimitive.Label>, LabelProps>(\n  ({ className, inset, ...props }, ref) => (\n    <DropdownMenuPrimitive.Label\n      data-slot=\"dropdown-menu-label\"\n      ref={ref}\n      className={cn(\n        \"px-2 py-1.5 font-medium font-sans text-label-caps text-muted-foreground uppercase tracking-wider\",\n        inset && \"pl-8\",\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nLabel.displayName = \"DropdownMenu.Label\";\n\nconst Separator = forwardRef<\n  ElementRef<typeof DropdownMenuPrimitive.Separator>,\n  ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <DropdownMenuPrimitive.Separator\n    data-slot=\"dropdown-menu-separator\"\n    ref={ref}\n    className={cn(\"-mx-1 my-1 h-px bg-border/40\", className)}\n    {...props}\n  />\n));\nSeparator.displayName = \"DropdownMenu.Separator\";\n\nconst Shortcut = ({ className, ...props }: HTMLAttributes<HTMLSpanElement>) => (\n  <span\n    className={cn(\"ml-auto font-mono text-label text-muted-foreground\", className)}\n    {...props}\n  />\n);\nShortcut.displayName = \"DropdownMenu.Shortcut\";\n\nconst SubTrigger = forwardRef<\n  ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,\n  ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & { inset?: boolean }\n>(({ className, inset, children, ...props }, ref) => (\n  <DropdownMenuPrimitive.SubTrigger\n    data-slot=\"dropdown-menu-sub-trigger\"\n    ref={ref}\n    className={cn(\n      \"flex cursor-default select-none items-center gap-2 rounded-md px-2 py-1.5\",\n      \"font-sans text-body-sm text-foreground outline-none\",\n      \"focus:bg-muted data-[state=open]:bg-muted\",\n      inset && \"pl-8\",\n      className,\n    )}\n    {...props}\n  >\n    {children}\n    <ChevronRight aria-hidden=\"true\" className=\"ml-auto size-3.5\" />\n  </DropdownMenuPrimitive.SubTrigger>\n));\nSubTrigger.displayName = \"DropdownMenu.SubTrigger\";\n\nconst SubContent = forwardRef<\n  ElementRef<typeof DropdownMenuPrimitive.SubContent>,\n  ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, ...props }, ref) => (\n  <DropdownMenuPrimitive.SubContent\n    data-slot=\"dropdown-menu-sub-content\"\n    ref={ref}\n    className={cn(\n      \"z-50 min-w-32 overflow-hidden rounded-lg border border-border/40 bg-card p-1\",\n      \"text-card-foreground shadow-md\",\n      \"data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:animate-in\",\n      \"data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out\",\n      className,\n    )}\n    {...props}\n  />\n));\nSubContent.displayName = \"DropdownMenu.SubContent\";\n\ntype DropdownMenuRoot = typeof DropdownMenuPrimitive.Root & {\n  Trigger: typeof Trigger;\n  Portal: typeof Portal;\n  Content: typeof Content;\n  Item: typeof Item;\n  CheckboxItem: typeof CheckboxItem;\n  RadioItem: typeof RadioItem;\n  Label: typeof Label;\n  Separator: typeof Separator;\n  Shortcut: typeof Shortcut;\n  Group: typeof Group;\n  Sub: typeof Sub;\n  SubTrigger: typeof SubTrigger;\n  SubContent: typeof SubContent;\n  RadioGroup: typeof RadioGroup;\n};\n\nconst DropdownMenu: DropdownMenuRoot = Object.assign(DropdownMenuPrimitive.Root, {\n  Trigger,\n  Portal,\n  Content,\n  Item,\n  CheckboxItem,\n  RadioItem,\n  Label,\n  Separator,\n  Shortcut,\n  Group,\n  Sub,\n  SubTrigger,\n  SubContent,\n  RadioGroup,\n});\n\nexport { DropdownMenu };\n"]}

package/dist/chunk-T2OKGV6M.js

@@ -0,0 +1,13 @@
+// src/lib/prompt.ts
+var OTHER_OPTION_VALUE = "__theo_other__";
+function isOtherValue(value) {
+  return value === OTHER_OPTION_VALUE;
+}
+function digitKeyToIndex(key) {
+  if (key.length !== 1 || key < "1" || key > "9") return null;
+  return Number(key) - 1;
+}
+
+export { OTHER_OPTION_VALUE, digitKeyToIndex, isOtherValue };
+//# sourceMappingURL=chunk-T2OKGV6M.js.map
+//# sourceMappingURL=chunk-T2OKGV6M.js.map

package/dist/chunk-T2OKGV6M.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/prompt.ts"],"names":[],"mappings":";AAiCO,IAAM,kBAAA,GAAqB;AAG3B,SAAS,aAAa,KAAA,EAAoC;AAC/D,EAAA,OAAO,KAAA,KAAU,kBAAA;AACnB;AAOO,SAAS,gBAAgB,GAAA,EAA4B;AAC1D,EAAA,IAAI,IAAI,MAAA,KAAW,CAAA,IAAK,MAAM,GAAA,IAAO,GAAA,GAAM,KAAK,OAAO,IAAA;AACvD,EAAA,OAAO,MAAA,CAAO,GAAG,CAAA,GAAI,CAAA;AACvB","file":"chunk-T2OKGV6M.js","sourcesContent":["import type { ReactNode } from \"react\";\n\n/**\n * A selectable option shared by the prompt composites (`ChoicePrompt`,\n * `MultiSelectPrompt`). Modeled on the question/option shape that drives an\n * AI-agent \"ask the user\" surface (the same UX Claude Code's question card\n * exposes): a stable value, a visible label, an optional secondary line, and\n * an optional rich preview shown side-by-side.\n */\nexport interface PromptOption {\n  /** Stable value returned on selection. Must be unique within the option set. */\n  value: string;\n  /** Visible primary label. */\n  label: ReactNode;\n  /** Optional secondary line rendered under the label. */\n  description?: ReactNode;\n  /** When true, the option cannot be selected. */\n  disabled?: boolean;\n  /**\n   * Optional rich preview (markdown-ish mockup, code snippet, diagram) shown in\n   * the side-by-side pane while the option is selected. The presence of any\n   * preview across the option set switches the layout to two columns — matching\n   * the Claude Code question card's focused-option preview.\n   */\n  preview?: ReactNode;\n}\n\n/**\n * Reserved value for the synthesized free-text \"Other\" option that the choice\n * composites inject when `allowOther` is set. Kept out of the public barrel so\n * consumers cannot collide with it accidentally; compare against it via the\n * exported `isOtherValue` helper instead.\n */\nexport const OTHER_OPTION_VALUE = \"__theo_other__\";\n\n/** True when `value` is the synthesized free-text \"Other\" option. */\nexport function isOtherValue(value: string | undefined): boolean {\n  return value === OTHER_OPTION_VALUE;\n}\n\n/**\n * Map a single keyboard digit to a zero-based option index. Returns `null` when\n * the key is not a `1`..`9` digit. `\"1\"` → `0`, `\"9\"` → `8`. Used by the choice\n * composites to wire number-key shortcuts (terminal-style selection).\n */\nexport function digitKeyToIndex(key: string): number | null {\n  if (key.length !== 1 || key < \"1\" || key > \"9\") return null;\n  return Number(key) - 1;\n}\n"]}

package/dist/chunk-TJLULCZW.js

@@ -0,0 +1,108 @@
+"use client";
+import { MCPServerCard } from './chunk-RLWULF5B.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { Plus } from 'lucide-react';
+import { forwardRef, useState, useMemo } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var STATUS_ORDER = ["connected", "starting", "degraded", "disconnected"];
+var MCPServerList = forwardRef(
+  ({ className, servers, title = "MCP servers", onAdd, onRestart, onDisconnect, ...props }, ref) => {
+    const [filter, setFilter] = useState(null);
+    const counts = useMemo(() => {
+      const result = {
+        connected: 0,
+        starting: 0,
+        degraded: 0,
+        disconnected: 0
+      };
+      for (const s of servers) result[s.status]++;
+      return result;
+    }, [servers]);
+    const filtered = useMemo(
+      () => filter ? servers.filter((s) => s.status === filter) : servers,
+      [servers, filter]
+    );
+    return /* @__PURE__ */ jsxs(
+      "section",
+      {
+        "data-slot": "mcp-server-list",
+        ref,
+        className: cn("grid gap-3", className),
+        "aria-label": "MCP servers",
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("header", { className: "flex flex-wrap items-center justify-between gap-3", children: [
+            title ? /* @__PURE__ */ jsx("h3", { className: "font-display text-title-md tracking-tight", children: title }) : /* @__PURE__ */ jsx("span", {}),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsxs("div", { className: "inline-flex rounded-lg border border-border/60 bg-muted p-0.5", children: [
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => setFilter(null),
+                    "aria-pressed": filter === null,
+                    className: cn(
+                      "rounded-md px-2.5 py-1 font-mono text-label",
+                      filter === null ? "bg-card text-foreground shadow-sm" : "text-muted-foreground"
+                    ),
+                    children: [
+                      "All \xB7 ",
+                      servers.length
+                    ]
+                  }
+                ),
+                STATUS_ORDER.map((status) => /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => setFilter(status),
+                    "aria-pressed": filter === status,
+                    disabled: counts[status] === 0,
+                    className: cn(
+                      "rounded-md px-2.5 py-1 font-mono text-label uppercase",
+                      filter === status ? "bg-card text-foreground shadow-sm" : "text-muted-foreground",
+                      "disabled:opacity-40"
+                    ),
+                    children: [
+                      status,
+                      " \xB7 ",
+                      counts[status]
+                    ]
+                  },
+                  status
+                ))
+              ] }),
+              onAdd ? /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: onAdd,
+                  className: "inline-flex items-center gap-1 rounded-md bg-primary px-2.5 py-1 font-sans text-label text-primary-foreground hover:shadow-glow focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                  children: [
+                    /* @__PURE__ */ jsx(Plus, { className: "size-3.5" }),
+                    " Add server"
+                  ]
+                }
+              ) : null
+            ] })
+          ] }),
+          filtered.length === 0 ? /* @__PURE__ */ jsx("p", { className: "rounded-xl border border-border/60 border-dashed bg-muted/30 px-4 py-8 text-center font-sans text-body-sm text-muted-foreground", children: "No servers in this state." }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-3 md:grid-cols-2", children: filtered.map((server) => /* @__PURE__ */ jsx(
+            MCPServerCard,
+            {
+              server,
+              ...onRestart ? { onRestart } : {},
+              ...onDisconnect ? { onDisconnect } : {}
+            },
+            server.id
+          )) })
+        ]
+      }
+    );
+  }
+);
+MCPServerList.displayName = "MCPServerList";
+
+export { MCPServerList };
+//# sourceMappingURL=chunk-TJLULCZW.js.map
+//# sourceMappingURL=chunk-TJLULCZW.js.map

package/dist/chunk-TJLULCZW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/mcp-server-list/mcp-server-list.tsx"],"names":[],"mappings":"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","file":"chunk-TJLULCZW.js","sourcesContent":["\"use client\";\n\nimport { Plus } from \"lucide-react\";\nimport { forwardRef, useMemo, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport {\n  type MCPServer,\n  MCPServerCard,\n  type MCPServerStatus,\n} from \"../../primitives/mcp-server-card/index.js\";\n\ninterface MCPServerListProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  servers: MCPServer[];\n  title?: ReactNode;\n  onAdd?: () => void;\n  onRestart?: (id: string) => void;\n  onDisconnect?: (id: string) => void;\n}\n\nconst STATUS_ORDER: MCPServerStatus[] = [\"connected\", \"starting\", \"degraded\", \"disconnected\"];\n\n/**\n * MCPServerList — grouped MCP server inventory with status filter chips.\n * Surfaces degraded/disconnected servers prominently so the user can act.\n */\nconst MCPServerList = forwardRef<HTMLDivElement, MCPServerListProps>(\n  (\n    { className, servers, title = \"MCP servers\", onAdd, onRestart, onDisconnect, ...props },\n    ref,\n  ) => {\n    const [filter, setFilter] = useState<MCPServerStatus | null>(null);\n\n    const counts = useMemo(() => {\n      const result: Record<MCPServerStatus, number> = {\n        connected: 0,\n        starting: 0,\n        degraded: 0,\n        disconnected: 0,\n      };\n      for (const s of servers) result[s.status]++;\n      return result;\n    }, [servers]);\n\n    const filtered = useMemo(\n      () => (filter ? servers.filter((s) => s.status === filter) : servers),\n      [servers, filter],\n    );\n\n    return (\n      <section\n        data-slot=\"mcp-server-list\"\n        ref={ref}\n        className={cn(\"grid gap-3\", className)}\n        aria-label=\"MCP servers\"\n        {...props}\n      >\n        <header className=\"flex flex-wrap items-center justify-between gap-3\">\n          {title ? (\n            <h3 className=\"font-display text-title-md tracking-tight\">{title}</h3>\n          ) : (\n            <span />\n          )}\n          <div className=\"flex items-center gap-2\">\n            <div className=\"inline-flex rounded-lg border border-border/60 bg-muted p-0.5\">\n              <button\n                type=\"button\"\n                onClick={() => setFilter(null)}\n                aria-pressed={filter === null}\n                className={cn(\n                  \"rounded-md px-2.5 py-1 font-mono text-label\",\n                  filter === null ? \"bg-card text-foreground shadow-sm\" : \"text-muted-foreground\",\n                )}\n              >\n                All · {servers.length}\n              </button>\n              {STATUS_ORDER.map((status) => (\n                <button\n                  key={status}\n                  type=\"button\"\n                  onClick={() => setFilter(status)}\n                  aria-pressed={filter === status}\n                  disabled={counts[status] === 0}\n                  className={cn(\n                    \"rounded-md px-2.5 py-1 font-mono text-label uppercase\",\n                    filter === status\n                      ? \"bg-card text-foreground shadow-sm\"\n                      : \"text-muted-foreground\",\n                    \"disabled:opacity-40\",\n                  )}\n                >\n                  {status} · {counts[status]}\n                </button>\n              ))}\n            </div>\n            {onAdd ? (\n              <button\n                type=\"button\"\n                onClick={onAdd}\n                className=\"inline-flex items-center gap-1 rounded-md bg-primary px-2.5 py-1 font-sans text-label text-primary-foreground hover:shadow-glow focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n              >\n                <Plus className=\"size-3.5\" /> Add server\n              </button>\n            ) : null}\n          </div>\n        </header>\n\n        {filtered.length === 0 ? (\n          <p className=\"rounded-xl border border-border/60 border-dashed bg-muted/30 px-4 py-8 text-center font-sans text-body-sm text-muted-foreground\">\n            No servers in this state.\n          </p>\n        ) : (\n          <div className=\"grid grid-cols-1 gap-3 md:grid-cols-2\">\n            {filtered.map((server) => (\n              <MCPServerCard\n                key={server.id}\n                server={server}\n                {...(onRestart ? { onRestart } : {})}\n                {...(onDisconnect ? { onDisconnect } : {})}\n              />\n            ))}\n          </div>\n        )}\n      </section>\n    );\n  },\n);\nMCPServerList.displayName = \"MCPServerList\";\n\nexport { MCPServerList };\n"]}

package/dist/chunk-TY6NTWN5.js

@@ -0,0 +1,29 @@
+import { cn } from './chunk-EWDN56AS.js';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Label = forwardRef(
+  ({ className, required, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+    LabelPrimitive.Root,
+    {
+      "data-slot": "label",
+      ref,
+      className: cn(
+        "inline-flex items-center gap-1 font-medium font-sans text-body-sm text-foreground",
+        "peer-disabled:cursor-not-allowed peer-disabled:opacity-60",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        required ? /* @__PURE__ */ jsx("span", { className: "text-destructive", "aria-hidden": "true", children: "*" }) : null
+      ]
+    }
+  )
+);
+Label.displayName = "Label";
+
+export { Label };
+//# sourceMappingURL=chunk-TY6NTWN5.js.map
+//# sourceMappingURL=chunk-TY6NTWN5.js.map

package/dist/chunk-TY6NTWN5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/label/label.tsx"],"names":[],"mappings":";;;;;AAiBA,IAAM,KAAA,GAAQ,UAAA;AAAA,EACZ,CAAC,EAAE,SAAA,EAAW,QAAA,EAAU,UAAU,GAAG,KAAA,IAAS,GAAA,qBAC5C,IAAA;AAAA,IAAgB,cAAA,CAAA,IAAA;AAAA,IAAf;AAAA,MACC,WAAA,EAAU,OAAA;AAAA,MACV,GAAA;AAAA,MACA,SAAA,EAAW,EAAA;AAAA,QACT,mFAAA;AAAA,QACA,2DAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA,QAAA,uBACE,MAAA,EAAA,EAAK,SAAA,EAAU,oBAAmB,aAAA,EAAY,MAAA,EAAO,eAEtD,CAAA,GACE;AAAA;AAAA;AAAA;AAGV;AACA,KAAA,CAAM,WAAA,GAAc,OAAA","file":"chunk-TY6NTWN5.js","sourcesContent":["import * as LabelPrimitive from \"@radix-ui/react-label\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementRef } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * Label — form field label built on Radix Label.\n *\n * Behaviors:\n *   - Clicking the label focuses the associated `htmlFor` input.\n *   - Adds a small red asterisk when `required` is set.\n *   - Inherits disabled visuals from the wrapper (`peer-disabled`).\n */\ninterface LabelProps extends ComponentPropsWithoutRef<typeof LabelPrimitive.Root> {\n  required?: boolean;\n}\n\nconst Label = forwardRef<ElementRef<typeof LabelPrimitive.Root>, LabelProps>(\n  ({ className, required, children, ...props }, ref) => (\n    <LabelPrimitive.Root\n      data-slot=\"label\"\n      ref={ref}\n      className={cn(\n        \"inline-flex items-center gap-1 font-medium font-sans text-body-sm text-foreground\",\n        \"peer-disabled:cursor-not-allowed peer-disabled:opacity-60\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {required ? (\n        <span className=\"text-destructive\" aria-hidden=\"true\">\n          *\n        </span>\n      ) : null}\n    </LabelPrimitive.Root>\n  ),\n);\nLabel.displayName = \"Label\";\n\nexport { Label };\n"]}

package/dist/chunk-U3AEEFVB.js

@@ -0,0 +1,152 @@
+"use client";
+import { cn } from './chunk-EWDN56AS.js';
+import { Zap, Plus, Trash2 } from 'lucide-react';
+import { forwardRef, useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var HOOK_EVENTS = [
+  "PreToolUse",
+  "PostToolUse",
+  "UserPromptSubmit",
+  "Stop",
+  "SessionStart",
+  "SessionEnd"
+];
+var HookConfig = forwardRef(
+  ({ className, hooks, onAdd, onRemove, onToggle, title = "Hooks", ...props }, ref) => {
+    const [event, setEvent] = useState("PreToolUse");
+    const [matcher, setMatcher] = useState("*");
+    const [command, setCommand] = useState("");
+    const submit = () => {
+      if (!command.trim()) return;
+      onAdd?.({ event, matcher: matcher.trim() || "*", command: command.trim() });
+      setCommand("");
+    };
+    return /* @__PURE__ */ jsxs(
+      "section",
+      {
+        "data-slot": "hook-config",
+        ref,
+        className: cn("rounded-xl border bg-card", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("header", { className: "flex items-baseline justify-between border-border/40 border-b px-4 py-3", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx(Zap, { className: "size-4 text-primary", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsx("h3", { className: "font-display text-title-md tracking-tight", children: title })
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: "font-mono text-label text-muted-foreground", children: [
+              hooks.length,
+              " ",
+              hooks.length === 1 ? "hook" : "hooks"
+            ] })
+          ] }),
+          onAdd ? /* @__PURE__ */ jsxs(
+            "form",
+            {
+              className: "grid grid-cols-[140px_140px_1fr_auto] items-center gap-2 border-border/40 border-b p-3",
+              onSubmit: (e) => {
+                e.preventDefault();
+                submit();
+              },
+              children: [
+                /* @__PURE__ */ jsx(
+                  "select",
+                  {
+                    value: event,
+                    onChange: (e) => setEvent(e.target.value),
+                    "aria-label": "Event",
+                    className: "h-9 rounded-md border border-input bg-card px-2 font-mono text-code-sm",
+                    children: HOOK_EVENTS.map((evt) => /* @__PURE__ */ jsx("option", { value: evt, children: evt }, evt))
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "text",
+                    value: matcher,
+                    onChange: (e) => setMatcher(e.target.value),
+                    placeholder: "matcher (Bash, Write, *)",
+                    "aria-label": "Matcher",
+                    className: "h-9 rounded-md border border-input bg-card px-2 font-mono text-code-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "text",
+                    value: command,
+                    onChange: (e) => setCommand(e.target.value),
+                    placeholder: 'command (e.g. "./scripts/audit.sh")',
+                    "aria-label": "Command",
+                    className: "h-9 rounded-md border border-input bg-card px-2 font-mono text-code-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                  }
+                ),
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "submit",
+                    className: "inline-flex h-9 items-center gap-1 rounded-md bg-primary px-3 font-sans text-label text-primary-foreground hover:shadow-glow focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                    children: [
+                      /* @__PURE__ */ jsx(Plus, { className: "size-3.5" }),
+                      " Add"
+                    ]
+                  }
+                )
+              ]
+            }
+          ) : null,
+          /* @__PURE__ */ jsxs("ul", { className: "divide-y divide-border/30", children: [
+            hooks.map((hook) => {
+              const enabled = hook.enabled ?? true;
+              return /* @__PURE__ */ jsxs(
+                "li",
+                {
+                  className: cn(
+                    "grid grid-cols-[140px_140px_1fr_auto_auto] items-center gap-3 px-4 py-2.5",
+                    !enabled && "opacity-50"
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx("span", { className: "font-mono text-code-sm text-primary", children: hook.event }),
+                    /* @__PURE__ */ jsx("span", { className: "font-mono text-code-sm text-muted-foreground", children: hook.matcher }),
+                    /* @__PURE__ */ jsx("span", { className: "truncate font-mono text-code-sm text-foreground", children: hook.command }),
+                    onToggle ? /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: () => onToggle(hook.id, !enabled),
+                        "aria-pressed": enabled,
+                        className: cn(
+                          "rounded-full border px-2.5 py-0.5 font-mono text-label uppercase",
+                          enabled ? "border-success/40 bg-success/15 text-success" : "border-border/40 bg-muted text-muted-foreground"
+                        ),
+                        children: enabled ? "On" : "Off"
+                      }
+                    ) : /* @__PURE__ */ jsx("span", {}),
+                    onRemove ? /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: () => onRemove(hook.id),
+                        "aria-label": `Remove hook ${hook.event} ${hook.matcher}`,
+                        className: "rounded-md p-1.5 text-muted-foreground hover:bg-muted hover:text-destructive focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                        children: /* @__PURE__ */ jsx(Trash2, { className: "size-3.5" })
+                      }
+                    ) : /* @__PURE__ */ jsx("span", {})
+                  ]
+                },
+                hook.id
+              );
+            }),
+            hooks.length === 0 ? /* @__PURE__ */ jsx("li", { className: "px-4 py-8 text-center font-sans text-body-sm text-muted-foreground", children: "No hooks configured." }) : null
+          ] })
+        ]
+      }
+    );
+  }
+);
+HookConfig.displayName = "HookConfig";
+
+export { HOOK_EVENTS, HookConfig };
+//# sourceMappingURL=chunk-U3AEEFVB.js.map
+//# sourceMappingURL=chunk-U3AEEFVB.js.map

package/dist/chunk-U3AEEFVB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/hook-config/hook-config.tsx"],"names":[],"mappings":"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","file":"chunk-U3AEEFVB.js","sourcesContent":["\"use client\";\n\nimport { Plus, Trash2, Zap } from \"lucide-react\";\nimport { forwardRef, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\nexport type HookEvent =\n  | \"PreToolUse\"\n  | \"PostToolUse\"\n  | \"UserPromptSubmit\"\n  | \"Stop\"\n  | \"SessionStart\"\n  | \"SessionEnd\";\n\nexport interface HookEntry {\n  id: string;\n  event: HookEvent;\n  /** Tool matcher (e.g. \"Bash\", \"Write\", \"*\"). */\n  matcher: string;\n  /** Shell command to run. */\n  command: string;\n  enabled?: boolean;\n}\n\nconst HOOK_EVENTS: HookEvent[] = [\n  \"PreToolUse\",\n  \"PostToolUse\",\n  \"UserPromptSubmit\",\n  \"Stop\",\n  \"SessionStart\",\n  \"SessionEnd\",\n];\n\ninterface HookConfigProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\" | \"onToggle\"> {\n  hooks: HookEntry[];\n  onAdd?: (hook: Omit<HookEntry, \"id\">) => void;\n  onRemove?: (id: string) => void;\n  onToggle?: (id: string, enabled: boolean) => void;\n  title?: ReactNode;\n}\n\n/**\n * HookConfig — editor for lifecycle hooks (PreToolUse, PostToolUse, Stop…).\n *\n * Mirrors Claude Code's settings.json hooks but visual. Each row is an\n * { event × matcher × command } triple with on/off toggle.\n */\nconst HookConfig = forwardRef<HTMLDivElement, HookConfigProps>(\n  ({ className, hooks, onAdd, onRemove, onToggle, title = \"Hooks\", ...props }, ref) => {\n    const [event, setEvent] = useState<HookEvent>(\"PreToolUse\");\n    const [matcher, setMatcher] = useState(\"*\");\n    const [command, setCommand] = useState(\"\");\n\n    const submit = () => {\n      if (!command.trim()) return;\n      onAdd?.({ event, matcher: matcher.trim() || \"*\", command: command.trim() });\n      setCommand(\"\");\n    };\n\n    return (\n      <section\n        data-slot=\"hook-config\"\n        ref={ref}\n        className={cn(\"rounded-xl border bg-card\", className)}\n        {...props}\n      >\n        <header className=\"flex items-baseline justify-between border-border/40 border-b px-4 py-3\">\n          <div className=\"flex items-center gap-2\">\n            <Zap className=\"size-4 text-primary\" aria-hidden=\"true\" />\n            <h3 className=\"font-display text-title-md tracking-tight\">{title}</h3>\n          </div>\n          <span className=\"font-mono text-label text-muted-foreground\">\n            {hooks.length} {hooks.length === 1 ? \"hook\" : \"hooks\"}\n          </span>\n        </header>\n\n        {onAdd ? (\n          <form\n            className=\"grid grid-cols-[140px_140px_1fr_auto] items-center gap-2 border-border/40 border-b p-3\"\n            onSubmit={(e) => {\n              e.preventDefault();\n              submit();\n            }}\n          >\n            <select\n              value={event}\n              onChange={(e) => setEvent(e.target.value as HookEvent)}\n              aria-label=\"Event\"\n              className=\"h-9 rounded-md border border-input bg-card px-2 font-mono text-code-sm\"\n            >\n              {HOOK_EVENTS.map((evt) => (\n                <option key={evt} value={evt}>\n                  {evt}\n                </option>\n              ))}\n            </select>\n            <input\n              type=\"text\"\n              value={matcher}\n              onChange={(e) => setMatcher(e.target.value)}\n              placeholder=\"matcher (Bash, Write, *)\"\n              aria-label=\"Matcher\"\n              className=\"h-9 rounded-md border border-input bg-card px-2 font-mono text-code-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n            />\n            <input\n              type=\"text\"\n              value={command}\n              onChange={(e) => setCommand(e.target.value)}\n              placeholder='command (e.g. \"./scripts/audit.sh\")'\n              aria-label=\"Command\"\n              className=\"h-9 rounded-md border border-input bg-card px-2 font-mono text-code-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n            />\n            <button\n              type=\"submit\"\n              className=\"inline-flex h-9 items-center gap-1 rounded-md bg-primary px-3 font-sans text-label text-primary-foreground hover:shadow-glow focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n            >\n              <Plus className=\"size-3.5\" /> Add\n            </button>\n          </form>\n        ) : null}\n\n        <ul className=\"divide-y divide-border/30\">\n          {hooks.map((hook) => {\n            const enabled = hook.enabled ?? true;\n            return (\n              <li\n                key={hook.id}\n                className={cn(\n                  \"grid grid-cols-[140px_140px_1fr_auto_auto] items-center gap-3 px-4 py-2.5\",\n                  !enabled && \"opacity-50\",\n                )}\n              >\n                <span className=\"font-mono text-code-sm text-primary\">{hook.event}</span>\n                <span className=\"font-mono text-code-sm text-muted-foreground\">{hook.matcher}</span>\n                <span className=\"truncate font-mono text-code-sm text-foreground\">\n                  {hook.command}\n                </span>\n                {onToggle ? (\n                  <button\n                    type=\"button\"\n                    onClick={() => onToggle(hook.id, !enabled)}\n                    aria-pressed={enabled}\n                    className={cn(\n                      \"rounded-full border px-2.5 py-0.5 font-mono text-label uppercase\",\n                      enabled\n                        ? \"border-success/40 bg-success/15 text-success\"\n                        : \"border-border/40 bg-muted text-muted-foreground\",\n                    )}\n                  >\n                    {enabled ? \"On\" : \"Off\"}\n                  </button>\n                ) : (\n                  <span />\n                )}\n                {onRemove ? (\n                  <button\n                    type=\"button\"\n                    onClick={() => onRemove(hook.id)}\n                    aria-label={`Remove hook ${hook.event} ${hook.matcher}`}\n                    className=\"rounded-md p-1.5 text-muted-foreground hover:bg-muted hover:text-destructive focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n                  >\n                    <Trash2 className=\"size-3.5\" />\n                  </button>\n                ) : (\n                  <span />\n                )}\n              </li>\n            );\n          })}\n          {hooks.length === 0 ? (\n            <li className=\"px-4 py-8 text-center font-sans text-body-sm text-muted-foreground\">\n              No hooks configured.\n            </li>\n          ) : null}\n        </ul>\n      </section>\n    );\n  },\n);\nHookConfig.displayName = \"HookConfig\";\n\nexport { HookConfig, HOOK_EVENTS };\n"]}