@usetheo/ui 0.13.0 → 0.13.2

package/dist/chunk-E26M7ATD.js

@@ -0,0 +1,61 @@
+import { cn } from './chunk-EWDN56AS.js';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var List2 = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.List,
+  {
+    "data-slot": "tabs-list",
+    ref,
+    className: cn(
+      "inline-flex h-10 items-center border-border/40 border-b text-muted-foreground",
+      className
+    ),
+    ...props
+  }
+));
+List2.displayName = "Tabs.List";
+var Trigger2 = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.Trigger,
+  {
+    "data-slot": "tabs-trigger",
+    ref,
+    className: cn(
+      "relative inline-flex h-10 items-center justify-center whitespace-nowrap px-4",
+      "font-medium font-sans text-body-sm text-muted-foreground",
+      "transition-colors duration-base ease-out-soft",
+      "hover:text-foreground",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+      "disabled:pointer-events-none disabled:opacity-50",
+      "data-[state=active]:text-foreground",
+      // Active underline using a pseudo-element via shadow
+      "data-[state=active]:shadow-[inset_0_-2px_0_0_hsl(var(--primary))]",
+      className
+    ),
+    ...props
+  }
+));
+Trigger2.displayName = "Tabs.Trigger";
+var Content2 = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.Content,
+  {
+    "data-slot": "tabs-content",
+    ref,
+    className: cn(
+      "mt-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+      className
+    ),
+    ...props
+  }
+));
+Content2.displayName = "Tabs.Content";
+var Tabs = /* @__PURE__ */ Object.assign(TabsPrimitive.Root, {
+  List: List2,
+  Trigger: Trigger2,
+  Content: Content2
+});
+
+export { Tabs };
+//# sourceMappingURL=chunk-E26M7ATD.js.map
+//# sourceMappingURL=chunk-E26M7ATD.js.map

package/dist/chunk-E26M7ATD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/tabs/tabs.tsx"],"names":["List","Trigger","Content"],"mappings":";;;;;AAYA,IAAMA,KAAAA,GAAO,WAGX,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAAe,aAAA,CAAA,IAAA;AAAA,EAAd;AAAA,IACC,WAAA,EAAU,WAAA;AAAA,IACV,GAAA;AAAA,IACA,SAAA,EAAW,EAAA;AAAA,MACT,+EAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG;AAAA;AACN,CACD,CAAA;AACDA,KAAAA,CAAK,WAAA,GAAc,WAAA;AAEnB,IAAMC,QAAAA,GAAU,WAGd,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAAe,aAAA,CAAA,OAAA;AAAA,EAAd;AAAA,IACC,WAAA,EAAU,cAAA;AAAA,IACV,GAAA;AAAA,IACA,SAAA,EAAW,EAAA;AAAA,MACT,8EAAA;AAAA,MACA,0DAAA;AAAA,MACA,+CAAA;AAAA,MACA,uBAAA;AAAA,MACA,0IAAA;AAAA,MACA,kDAAA;AAAA,MACA,qCAAA;AAAA;AAAA,MAEA,mEAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG;AAAA;AACN,CACD,CAAA;AACDA,QAAAA,CAAQ,WAAA,GAAc,cAAA;AAEtB,IAAMC,QAAAA,GAAU,WAGd,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAAe,aAAA,CAAA,OAAA;AAAA,EAAd;AAAA,IACC,WAAA,EAAU,cAAA;AAAA,IACV,GAAA;AAAA,IACA,SAAA,EAAW,EAAA;AAAA,MACT,8EAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG;AAAA;AACN,CACD,CAAA;AACDA,QAAAA,CAAQ,WAAA,GAAc,cAAA;AAEtB,IAAM,IAAA,mBAAqB,MAAA,CAAO,MAAA,CAAqB,aAAA,CAAA,IAAA,EAAM;AAAA,EAC3D,IAAA,EAAAF,KAAAA;AAAA,EACA,OAAA,EAAAC,QAAAA;AAAA,EACA,OAAA,EAAAC;AACF,CAAC","file":"chunk-E26M7ATD.js","sourcesContent":["import * as TabsPrimitive from \"@radix-ui/react-tabs\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementRef } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * Tabs — built on Radix Tabs.\n *\n * Visual: underlined active tab in primary (violet), inactive in muted-foreground.\n * Used in project views (Overview / Deployments / Logs / Settings).\n */\n\nconst List = forwardRef<\n  ElementRef<typeof TabsPrimitive.List>,\n  ComponentPropsWithoutRef<typeof TabsPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.List\n    data-slot=\"tabs-list\"\n    ref={ref}\n    className={cn(\n      \"inline-flex h-10 items-center border-border/40 border-b text-muted-foreground\",\n      className,\n    )}\n    {...props}\n  />\n));\nList.displayName = \"Tabs.List\";\n\nconst Trigger = forwardRef<\n  ElementRef<typeof TabsPrimitive.Trigger>,\n  ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.Trigger\n    data-slot=\"tabs-trigger\"\n    ref={ref}\n    className={cn(\n      \"relative inline-flex h-10 items-center justify-center whitespace-nowrap px-4\",\n      \"font-medium font-sans text-body-sm text-muted-foreground\",\n      \"transition-colors duration-base ease-out-soft\",\n      \"hover:text-foreground\",\n      \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n      \"disabled:pointer-events-none disabled:opacity-50\",\n      \"data-[state=active]:text-foreground\",\n      // Active underline using a pseudo-element via shadow\n      \"data-[state=active]:shadow-[inset_0_-2px_0_0_hsl(var(--primary))]\",\n      className,\n    )}\n    {...props}\n  />\n));\nTrigger.displayName = \"Tabs.Trigger\";\n\nconst Content = forwardRef<\n  ElementRef<typeof TabsPrimitive.Content>,\n  ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.Content\n    data-slot=\"tabs-content\"\n    ref={ref}\n    className={cn(\n      \"mt-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n      className,\n    )}\n    {...props}\n  />\n));\nContent.displayName = \"Tabs.Content\";\n\nconst Tabs = /*#__PURE__*/ Object.assign(TabsPrimitive.Root, {\n  List,\n  Trigger,\n  Content,\n});\n\nexport { Tabs };\n"]}

package/dist/chunk-E63IRXZZ.js

@@ -0,0 +1,78 @@
+import { PlanBadge } from './chunk-YNDHYMPI.js';
+import { Avatar } from './chunk-ABBXLAJW.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { ChevronsUpDown } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+var URL_RE = /^(?:https?:\/\/|\/)/;
+function deriveInitials(name, avatar) {
+  if (avatar && !URL_RE.test(avatar) && avatar.length <= 2) {
+    return avatar.toUpperCase();
+  }
+  if (typeof name === "string" && name.length > 0) {
+    return name.charAt(0).toUpperCase();
+  }
+  return "?";
+}
+var AccountMenu = forwardRef(
+  ({ className, name, avatar, plan, secondary, onClick, ...props }, ref) => {
+    const interactive = typeof onClick === "function";
+    const initials = deriveInitials(name, avatar);
+    const isUrlAvatar = avatar !== void 0 && URL_RE.test(avatar);
+    const altText = typeof name === "string" ? name : "account";
+    const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs(Avatar, { size: "sm", children: [
+        isUrlAvatar ? /* @__PURE__ */ jsx(Avatar.Image, { src: avatar, alt: altText }) : null,
+        /* @__PURE__ */ jsx(Avatar.Fallback, { delayMs: 0, children: initials })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
+          /* @__PURE__ */ jsx("span", { className: "truncate font-medium text-body-sm text-foreground", children: name }),
+          plan ? /* @__PURE__ */ jsx(PlanBadge, { plan, size: "sm" }) : null
+        ] }),
+        secondary ? /* @__PURE__ */ jsx("span", { className: "truncate text-label text-muted-foreground", children: secondary }) : null
+      ] }),
+      interactive ? /* @__PURE__ */ jsx(ChevronsUpDown, { className: "size-3 shrink-0 text-muted-foreground", "aria-hidden": "true" }) : null
+    ] });
+    const baseClass = cn(
+      "flex w-full items-center gap-3 px-3 py-2",
+      interactive && cn(
+        "rounded-md text-left transition-colors",
+        "hover:bg-muted/40",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-card"
+      ),
+      className
+    );
+    if (interactive) {
+      const { ...buttonProps } = props;
+      return /* @__PURE__ */ jsx(
+        "button",
+        {
+          "data-slot": "account-menu",
+          ref,
+          type: "button",
+          className: baseClass,
+          onClick,
+          ...buttonProps,
+          children: content
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        "data-slot": "account-menu",
+        ref,
+        className: baseClass,
+        ...props,
+        children: content
+      }
+    );
+  }
+);
+AccountMenu.displayName = "AccountMenu";
+
+export { AccountMenu };
+//# sourceMappingURL=chunk-E63IRXZZ.js.map
+//# sourceMappingURL=chunk-E63IRXZZ.js.map

package/dist/chunk-E63IRXZZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/account-menu/account-menu.tsx"],"names":[],"mappings":"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","file":"chunk-E63IRXZZ.js","sourcesContent":["import { ChevronsUpDown } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { ButtonHTMLAttributes, HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport { Avatar } from \"../../primitives/avatar/index.js\";\nimport { PlanBadge, type PlanTier } from \"../../primitives/plan-badge/index.js\";\n\n/**\n * AccountMenu — sidebar header for PaaS surfaces.\n *\n * Renders avatar + name + (optional) plan badge + (optional) secondary line.\n * Dual mode: with `onClick`, renders as a `<button>` with a `ChevronsUpDown`\n * trailing icon (account picker affordance); without, renders as a static\n * `<div>` (read-only display, not focusable).\n *\n * Composition:\n *\n *   <Sidebar.Header className=\"p-0\">\n *     <AccountMenu\n *       name=\"paulohenriquevn\"\n *       avatar=\"https://avatars.githubusercontent.com/u/12345\"\n *       plan=\"hobby\"\n *       onClick={openAccountSwitcher}\n *     />\n *   </Sidebar.Header>\n *\n * Avatar handling:\n *   - URL (`http(s)://` or `/`) → `<Avatar.Image>` with `<Avatar.Fallback>` initials\n *   - Short string (≤2 chars) → treated as initials directly\n *   - Undefined → initials derived from the first character of `name`\n *\n * PaaS-shape sibling of `<ProjectSwitcher>` (workspace + branch + agent-status).\n * Same dual-mode (interactive vs static) pattern; different semantics.\n */\n\nexport interface AccountMenuProps\n  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"type\" | \"children\" | \"name\"> {\n  /** Display name (username, email, org name). */\n  name: ReactNode;\n  /** Avatar URL or 1-2-char initials. If undefined, derives initials from `name`. */\n  avatar?: string;\n  /** Plan tier — renders inline `<PlanBadge size=\"sm\">`. Omit for none. */\n  plan?: PlanTier;\n  /** Optional secondary line below name (e.g. email). */\n  secondary?: ReactNode;\n  /** Make the row interactive (button) with a trailing chevron. */\n  onClick?: () => void;\n}\n\nconst URL_RE = /^(?:https?:\\/\\/|\\/)/;\n\nfunction deriveInitials(name: ReactNode, avatar: string | undefined): string {\n  if (avatar && !URL_RE.test(avatar) && avatar.length <= 2) {\n    return avatar.toUpperCase();\n  }\n  if (typeof name === \"string\" && name.length > 0) {\n    return name.charAt(0).toUpperCase();\n  }\n  return \"?\";\n}\n\nconst AccountMenu = forwardRef<HTMLElement, AccountMenuProps>(\n  ({ className, name, avatar, plan, secondary, onClick, ...props }, ref) => {\n    const interactive = typeof onClick === \"function\";\n    const initials = deriveInitials(name, avatar);\n    const isUrlAvatar = avatar !== undefined && URL_RE.test(avatar);\n    const altText = typeof name === \"string\" ? name : \"account\";\n\n    const content = (\n      <>\n        <Avatar size=\"sm\">\n          {isUrlAvatar ? <Avatar.Image src={avatar} alt={altText} /> : null}\n          <Avatar.Fallback delayMs={0}>{initials}</Avatar.Fallback>\n        </Avatar>\n\n        <div className=\"flex min-w-0 flex-1 flex-col\">\n          <div className=\"flex min-w-0 items-center gap-2\">\n            <span className=\"truncate font-medium text-body-sm text-foreground\">{name}</span>\n            {plan ? <PlanBadge plan={plan} size=\"sm\" /> : null}\n          </div>\n          {secondary ? (\n            <span className=\"truncate text-label text-muted-foreground\">{secondary}</span>\n          ) : null}\n        </div>\n\n        {interactive ? (\n          <ChevronsUpDown className=\"size-3 shrink-0 text-muted-foreground\" aria-hidden=\"true\" />\n        ) : null}\n      </>\n    );\n\n    const baseClass = cn(\n      \"flex w-full items-center gap-3 px-3 py-2\",\n      interactive &&\n        cn(\n          \"rounded-md text-left transition-colors\",\n          \"hover:bg-muted/40\",\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-card\",\n        ),\n      className,\n    );\n\n    if (interactive) {\n      const { ...buttonProps } = props as ButtonHTMLAttributes<HTMLButtonElement>;\n      return (\n        <button\n          data-slot=\"account-menu\"\n          ref={ref as React.Ref<HTMLButtonElement>}\n          type=\"button\"\n          className={baseClass}\n          onClick={onClick}\n          {...buttonProps}\n        >\n          {content}\n        </button>\n      );\n    }\n\n    return (\n      <div\n        data-slot=\"account-menu\"\n        ref={ref as React.Ref<HTMLDivElement>}\n        className={baseClass}\n        {...(props as HTMLAttributes<HTMLDivElement>)}\n      >\n        {content}\n      </div>\n    );\n  },\n);\nAccountMenu.displayName = \"AccountMenu\";\n\nexport { AccountMenu };\n"]}

package/dist/chunk-EOTSD2GL.js

@@ -0,0 +1,83 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { Settings2, Eye, Lock } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ENABLEMENT_LABEL = {
+  enabled: "Allowed",
+  ask: "Ask before use",
+  denied: "Denied"
+};
+var ENABLEMENT_CLASS = {
+  enabled: "bg-success/15 text-success border-success/40",
+  ask: "bg-warning/15 text-warning border-warning/40",
+  denied: "bg-destructive/15 text-destructive border-destructive/40"
+};
+var cycle = (cur) => cur === "enabled" ? "ask" : cur === "ask" ? "denied" : "enabled";
+var ToolsList = forwardRef(
+  ({ className, tools, title = "Tools", onEnablementChange, ...props }, ref) => /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "data-slot": "tools-list",
+      ref,
+      className: cn("rounded-xl border border-border bg-card", className),
+      ...props,
+      children: [
+        title ? /* @__PURE__ */ jsxs("header", { className: "flex items-center justify-between border-border/40 border-b px-4 py-3", children: [
+          /* @__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: [
+            tools.length,
+            " ",
+            tools.length === 1 ? "tool" : "tools"
+          ] })
+        ] }) : null,
+        /* @__PURE__ */ jsx("ul", { className: "divide-y divide-border/30", children: tools.map((tool) => {
+          const Icon = tool.icon ?? Settings2;
+          const state = tool.enablement ?? "enabled";
+          return /* @__PURE__ */ jsxs(
+            "li",
+            {
+              className: "grid grid-cols-[auto_1fr_auto] items-start gap-3 px-4 py-3",
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "mt-0.5 grid size-8 place-items-center rounded-md bg-muted text-muted-foreground", children: /* @__PURE__ */ jsx(Icon, { className: "size-4", "aria-hidden": "true" }) }),
+                /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+                    /* @__PURE__ */ jsx("span", { className: "font-medium font-mono text-body-sm text-foreground", children: tool.name }),
+                    tool.source ? /* @__PURE__ */ jsx("span", { className: "font-mono text-label text-muted-foreground uppercase tracking-wider", children: tool.source }) : null,
+                    tool.badge ? /* @__PURE__ */ jsx("span", { className: "inline-flex items-center gap-1 rounded-full bg-accent/15 px-2 py-0.5 font-mono text-accent text-label uppercase", children: tool.badge }) : null
+                  ] }),
+                  tool.description ? /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-body-sm text-muted-foreground", children: tool.description }) : null
+                ] }),
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => onEnablementChange?.(tool.id, cycle(state)),
+                    className: cn(
+                      "inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1",
+                      "font-mono text-label uppercase tracking-wider transition-colors",
+                      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                      ENABLEMENT_CLASS[state],
+                      !onEnablementChange && "pointer-events-none"
+                    ),
+                    "aria-label": `Cycle enablement for ${tool.name}`,
+                    children: [
+                      state === "enabled" ? /* @__PURE__ */ jsx(Eye, { className: "size-3", "aria-hidden": "true" }) : state === "ask" ? /* @__PURE__ */ jsx(Settings2, { className: "size-3", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Lock, { className: "size-3", "aria-hidden": "true" }),
+                      ENABLEMENT_LABEL[state]
+                    ]
+                  }
+                )
+              ]
+            },
+            tool.id
+          );
+        }) })
+      ]
+    }
+  )
+);
+ToolsList.displayName = "ToolsList";
+
+export { ToolsList };
+//# sourceMappingURL=chunk-EOTSD2GL.js.map
+//# sourceMappingURL=chunk-EOTSD2GL.js.map

package/dist/chunk-EOTSD2GL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/tools-list/tools-list.tsx"],"names":[],"mappings":"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","file":"chunk-EOTSD2GL.js","sourcesContent":["import { Eye, Lock, Settings2 } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport type { IconComponent } from \"../../../lib/types.js\";\n\nexport type ToolEnablement = \"enabled\" | \"ask\" | \"denied\";\n\nexport interface ToolEntry {\n  id: string;\n  name: string;\n  description?: ReactNode;\n  icon?: IconComponent;\n  enablement?: ToolEnablement;\n  /**\n   * Source of the tool: built-in, plugin/skill, or MCP server name.\n   */\n  source?: string;\n  /** Optional badge text (e.g. \"destructive\", \"experimental\"). */\n  badge?: ReactNode;\n}\n\ninterface ToolsListProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\" | \"onChange\"> {\n  tools: ToolEntry[];\n  /** Title above the list. */\n  title?: ReactNode;\n  /**\n   * Fires when the consumer toggles a tool's enablement state.\n   * Cycle: enabled → ask → denied → enabled.\n   */\n  onEnablementChange?: (id: string, next: ToolEnablement) => void;\n}\n\nconst ENABLEMENT_LABEL: Record<ToolEnablement, string> = {\n  enabled: \"Allowed\",\n  ask: \"Ask before use\",\n  denied: \"Denied\",\n};\n\nconst ENABLEMENT_CLASS: Record<ToolEnablement, string> = {\n  enabled: \"bg-success/15 text-success border-success/40\",\n  ask: \"bg-warning/15 text-warning border-warning/40\",\n  denied: \"bg-destructive/15 text-destructive border-destructive/40\",\n};\n\nconst cycle = (cur: ToolEnablement): ToolEnablement =>\n  cur === \"enabled\" ? \"ask\" : cur === \"ask\" ? \"denied\" : \"enabled\";\n\n/**\n * ToolsList — surface every tool the agent could call, with its enablement\n * state. Click the chip to cycle: Allowed → Ask → Denied.\n */\nconst ToolsList = forwardRef<HTMLDivElement, ToolsListProps>(\n  ({ className, tools, title = \"Tools\", onEnablementChange, ...props }, ref) => (\n    <section\n      data-slot=\"tools-list\"\n      ref={ref}\n      className={cn(\"rounded-xl border border-border bg-card\", className)}\n      {...props}\n    >\n      {title ? (\n        <header className=\"flex items-center justify-between border-border/40 border-b px-4 py-3\">\n          <h3 className=\"font-display text-title-md tracking-tight\">{title}</h3>\n          <span className=\"font-mono text-label text-muted-foreground\">\n            {tools.length} {tools.length === 1 ? \"tool\" : \"tools\"}\n          </span>\n        </header>\n      ) : null}\n      <ul className=\"divide-y divide-border/30\">\n        {tools.map((tool) => {\n          const Icon = tool.icon ?? Settings2;\n          const state = tool.enablement ?? \"enabled\";\n          return (\n            <li\n              key={tool.id}\n              className=\"grid grid-cols-[auto_1fr_auto] items-start gap-3 px-4 py-3\"\n            >\n              <span className=\"mt-0.5 grid size-8 place-items-center rounded-md bg-muted text-muted-foreground\">\n                <Icon className=\"size-4\" aria-hidden=\"true\" />\n              </span>\n              <div className=\"min-w-0\">\n                <div className=\"flex flex-wrap items-center gap-2\">\n                  <span className=\"font-medium font-mono text-body-sm text-foreground\">\n                    {tool.name}\n                  </span>\n                  {tool.source ? (\n                    <span className=\"font-mono text-label text-muted-foreground uppercase tracking-wider\">\n                      {tool.source}\n                    </span>\n                  ) : null}\n                  {tool.badge ? (\n                    <span className=\"inline-flex items-center gap-1 rounded-full bg-accent/15 px-2 py-0.5 font-mono text-accent text-label uppercase\">\n                      {tool.badge}\n                    </span>\n                  ) : null}\n                </div>\n                {tool.description ? (\n                  <p className=\"mt-0.5 text-body-sm text-muted-foreground\">{tool.description}</p>\n                ) : null}\n              </div>\n              <button\n                type=\"button\"\n                onClick={() => onEnablementChange?.(tool.id, cycle(state))}\n                className={cn(\n                  \"inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1\",\n                  \"font-mono text-label uppercase tracking-wider transition-colors\",\n                  \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n                  ENABLEMENT_CLASS[state],\n                  !onEnablementChange && \"pointer-events-none\",\n                )}\n                aria-label={`Cycle enablement for ${tool.name}`}\n              >\n                {state === \"enabled\" ? (\n                  <Eye className=\"size-3\" aria-hidden=\"true\" />\n                ) : state === \"ask\" ? (\n                  <Settings2 className=\"size-3\" aria-hidden=\"true\" />\n                ) : (\n                  <Lock className=\"size-3\" aria-hidden=\"true\" />\n                )}\n                {ENABLEMENT_LABEL[state]}\n              </button>\n            </li>\n          );\n        })}\n      </ul>\n    </section>\n  ),\n);\nToolsList.displayName = \"ToolsList\";\n\nexport { ToolsList };\n"]}

package/dist/chunk-ESJUISWY.js

@@ -0,0 +1,45 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { cva } from 'class-variance-authority';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var textareaVariants = cva(
+  [
+    "flex w-full resize-y rounded-md border border-input bg-card",
+    "text-foreground placeholder:text-muted-foreground",
+    "transition-[box-shadow,border-color] duration-base ease-out-soft",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+    "focus-visible:border-primary",
+    "disabled:cursor-not-allowed disabled:opacity-50"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "min-h-[64px] px-2.5 py-1.5 text-body-sm",
+        // md: text scale + padding tighten to body-sm per FAANG density.
+        // min-h stays 96px because multiline has its own height rationale.
+        md: "min-h-[6rem] px-[var(--theo-control-px,0.875rem)] py-1.5 text-body-sm",
+        lg: "min-h-[128px] px-4 py-2.5 text-body-md"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+);
+var Textarea = forwardRef(
+  ({ className, rows = 3, size, ...props }, ref) => /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      "data-slot": "textarea",
+      "data-size": size,
+      ref,
+      rows,
+      className: cn(textareaVariants({ size }), className),
+      ...props
+    }
+  )
+);
+Textarea.displayName = "Textarea";
+
+export { Textarea };
+//# sourceMappingURL=chunk-ESJUISWY.js.map
+//# sourceMappingURL=chunk-ESJUISWY.js.map

package/dist/chunk-ESJUISWY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/textarea/textarea.tsx"],"names":[],"mappings":";;;;;AAgBA,IAAM,gBAAA,GAAmB,GAAA;AAAA,EACvB;AAAA,IACE,6DAAA;AAAA,IACA,mDAAA;AAAA,IACA,kEAAA;AAAA,IACA,0IAAA;AAAA,IACA,8BAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,yCAAA;AAAA;AAAA;AAAA,QAGJ,EAAA,EAAI,uEAAA;AAAA,QACJ,EAAA,EAAI;AAAA;AACN,KACF;AAAA,IACA,eAAA,EAAiB,EAAE,IAAA,EAAM,IAAA;AAAK;AAElC,CAAA;AAMA,IAAM,QAAA,GAAW,UAAA;AAAA,EACf,CAAC,EAAE,SAAA,EAAW,IAAA,GAAO,GAAG,IAAA,EAAM,GAAG,KAAA,EAAM,EAAG,GAAA,qBACxC,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,UAAA;AAAA,MACV,WAAA,EAAW,IAAA;AAAA,MACX,GAAA;AAAA,MACA,IAAA;AAAA,MACA,WAAW,EAAA,CAAG,gBAAA,CAAiB,EAAE,IAAA,EAAM,GAAG,SAAS,CAAA;AAAA,MAClD,GAAG;AAAA;AAAA;AAGV;AACA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-ESJUISWY.js","sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport { forwardRef } from \"react\";\nimport type { TextareaHTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * Textarea — multi-line input mirror of Input.\n *\n * Matches Input visuals (violet focus ring, --input border, --card bg).\n * The `size` prop accepts `\"sm\" | \"md\" | \"lg\"`. Default `md` preserves the\n * 80px (5rem) min-height + body-md text from before this prop existed.\n *\n * Note: `TextareaHTMLAttributes<HTMLTextAreaElement>` does NOT declare a\n * native `size` attribute (textareas use `rows` / `cols`), so no Omit is\n * needed — contrast with `<Input>` which had EC-1 collision.\n */\nconst textareaVariants = cva(\n  [\n    \"flex w-full resize-y rounded-md border border-input bg-card\",\n    \"text-foreground placeholder:text-muted-foreground\",\n    \"transition-[box-shadow,border-color] duration-base ease-out-soft\",\n    \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n    \"focus-visible:border-primary\",\n    \"disabled:cursor-not-allowed disabled:opacity-50\",\n  ],\n  {\n    variants: {\n      size: {\n        sm: \"min-h-[64px] px-2.5 py-1.5 text-body-sm\",\n        // md: text scale + padding tighten to body-sm per FAANG density.\n        // min-h stays 96px because multiline has its own height rationale.\n        md: \"min-h-[6rem] px-[var(--theo-control-px,0.875rem)] py-1.5 text-body-sm\",\n        lg: \"min-h-[128px] px-4 py-2.5 text-body-md\",\n      },\n    },\n    defaultVariants: { size: \"md\" },\n  },\n);\n\nexport interface TextareaProps\n  extends TextareaHTMLAttributes<HTMLTextAreaElement>,\n    VariantProps<typeof textareaVariants> {}\n\nconst Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(\n  ({ className, rows = 3, size, ...props }, ref) => (\n    <textarea\n      data-slot=\"textarea\"\n      data-size={size}\n      ref={ref}\n      rows={rows}\n      className={cn(textareaVariants({ size }), className)}\n      {...props}\n    />\n  ),\n);\nTextarea.displayName = \"Textarea\";\n\nexport { Textarea, textareaVariants };\n"]}

package/dist/chunk-ET7A3TQZ.js

@@ -0,0 +1,158 @@
+"use client";
+import { ALL_MODES, MODE_LABEL } from './chunk-VM4RMQQN.js';
+import { Textarea } from './chunk-ESJUISWY.js';
+import { Switch } from './chunk-QBUTRD2M.js';
+import { Select } from './chunk-AXUAQM45.js';
+import { FormField } from './chunk-C5ULP2P5.js';
+import { Input } from './chunk-BYUWQ6OP.js';
+import { Button } from './chunk-25KBUQEQ.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var SCOPES = [
+  { id: "global", label: "Global \u2014 applies to every session" },
+  { id: "project", label: "Project \u2014 only this workspace" }
+];
+function RuleEditor({
+  className,
+  initial,
+  onSave,
+  onCancel,
+  onDelete,
+  ...formProps
+}) {
+  const [title, setTitle] = useState(initial?.title ?? "");
+  const [body, setBody] = useState(initial?.body ?? "");
+  const [scope, setScope] = useState(initial?.scope ?? "global");
+  const [tagsRaw, setTagsRaw] = useState(initial?.tags?.join(", ") ?? "");
+  const [enabled, setEnabled] = useState(initial?.state ?? "enabled");
+  const [modes, setModes] = useState(initial?.modes ?? []);
+  const toggleMode = (m) => setModes((prev) => prev.includes(m) ? prev.filter((x) => x !== m) : [...prev, m]);
+  const canSave = title.trim().length > 0 && body.trim().length > 0;
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    if (!canSave) return;
+    onSave({
+      id: initial?.id,
+      title: title.trim(),
+      body: body.trim(),
+      scope,
+      state: enabled,
+      tags: tagsRaw.split(",").map((t) => t.trim()).filter(Boolean),
+      modes: modes.length > 0 ? modes : void 0
+    });
+  };
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      "data-slot": "rule-editor",
+      onSubmit: handleSubmit,
+      className: cn("flex h-full flex-col gap-4", className),
+      ...formProps,
+      children: [
+        /* @__PURE__ */ jsxs(FormField, { children: [
+          /* @__PURE__ */ jsx(FormField.Label, { children: "Title" }),
+          /* @__PURE__ */ jsx(FormField.Control, { children: /* @__PURE__ */ jsx(
+            Input,
+            {
+              value: title,
+              onChange: (e) => setTitle(e.target.value),
+              placeholder: "Always write tests before fixes",
+              required: true
+            }
+          ) }),
+          /* @__PURE__ */ jsx(FormField.Hint, { children: "Short, imperative summary the agent will keep in memory." })
+        ] }),
+        /* @__PURE__ */ jsxs(FormField, { className: "flex-1", children: [
+          /* @__PURE__ */ jsx(FormField.Label, { children: "Body (markdown)" }),
+          /* @__PURE__ */ jsx(FormField.Control, { children: /* @__PURE__ */ jsx(
+            Textarea,
+            {
+              value: body,
+              onChange: (e) => setBody(e.target.value),
+              rows: 8,
+              placeholder: "When fixing a bug, first write a failing regression test, then the fix.",
+              required: true,
+              className: "min-h-[12rem] flex-1 font-mono text-code-sm"
+            }
+          ) }),
+          /* @__PURE__ */ jsx(FormField.Hint, { children: "Injected into the system prompt verbatim." })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-3", children: [
+          /* @__PURE__ */ jsxs(FormField, { children: [
+            /* @__PURE__ */ jsx(FormField.Label, { children: "Scope" }),
+            /* @__PURE__ */ jsx(FormField.Control, { children: /* @__PURE__ */ jsxs(
+              Select,
+              {
+                value: scope,
+                onValueChange: (v) => {
+                  const next = SCOPES.find((s) => s.id === v);
+                  if (next) setScope(next.id);
+                },
+                children: [
+                  /* @__PURE__ */ jsx(Select.Trigger, { "aria-label": "Select rule scope", children: /* @__PURE__ */ jsx(Select.Value, {}) }),
+                  /* @__PURE__ */ jsx(Select.Content, { children: SCOPES.map((s) => /* @__PURE__ */ jsx(Select.Item, { value: s.id, children: s.label }, s.id)) })
+                ]
+              }
+            ) })
+          ] }),
+          /* @__PURE__ */ jsxs(FormField, { children: [
+            /* @__PURE__ */ jsx(FormField.Label, { children: "Tags (comma-separated)" }),
+            /* @__PURE__ */ jsx(FormField.Control, { children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                value: tagsRaw,
+                onChange: (e) => setTagsRaw(e.target.value),
+                placeholder: "testing, process"
+              }
+            ) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(FormField, { children: [
+          /* @__PURE__ */ jsx(FormField.Label, { children: "Active modes" }),
+          /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1.5", children: ALL_MODES.map((m) => {
+            const on = modes.includes(m);
+            return /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => toggleMode(m),
+                "aria-pressed": on,
+                className: cn(
+                  "inline-flex h-7 items-center rounded-full border px-3 font-mono text-body-sm transition-colors",
+                  on ? "border-primary bg-primary/15 text-primary" : "border-border/60 bg-card text-muted-foreground hover:text-foreground"
+                ),
+                children: MODE_LABEL[m]
+              },
+              m
+            );
+          }) }),
+          /* @__PURE__ */ jsx(FormField.Hint, { children: modes.length === 0 ? "Empty = global (applies to every mode)." : `Only visible in: ${modes.map((m) => MODE_LABEL[m]).join(", ")}.` })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsx(
+            Switch,
+            {
+              checked: enabled === "enabled",
+              onCheckedChange: (v) => setEnabled(v ? "enabled" : "disabled"),
+              "aria-label": "Enabled"
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "text-body-sm text-muted-foreground", children: enabled === "enabled" ? "Enabled \u2014 agent will follow this rule." : "Disabled \u2014 kept but ignored." })
+        ] }),
+        /* @__PURE__ */ jsxs("footer", { className: "flex items-center justify-between gap-2 border-border/40 border-t pt-4", children: [
+          /* @__PURE__ */ jsx("div", { children: onDelete ? /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", onClick: onDelete, children: "Delete" }) : null }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            onCancel ? /* @__PURE__ */ jsx(Button, { type: "button", variant: "secondary", onClick: onCancel, children: "Cancel" }) : null,
+            /* @__PURE__ */ jsx(Button, { type: "submit", disabled: !canSave, children: initial?.id ? "Save changes" : "Create rule" })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+export { RuleEditor };
+//# sourceMappingURL=chunk-ET7A3TQZ.js.map
+//# sourceMappingURL=chunk-ET7A3TQZ.js.map

package/dist/chunk-ET7A3TQZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/rule-editor/rule-editor.tsx"],"names":[],"mappings":"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","file":"chunk-ET7A3TQZ.js","sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport type { FormEvent, HTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport { ALL_MODES, MODE_LABEL, type Mode } from \"../../../types/mode.js\";\nimport type { Rule, RuleScope, RuleState } from \"../../../types/rule.js\";\nimport { Button } from \"../../primitives/button/index.js\";\nimport { FormField } from \"../../primitives/form-field/index.js\";\nimport { Input } from \"../../primitives/input/index.js\";\nimport { Select } from \"../../primitives/select/index.js\";\nimport { Switch } from \"../../primitives/switch/index.js\";\nimport { Textarea } from \"../../primitives/textarea/index.js\";\n\n/**\n * RuleEditor — form for creating or editing a Rule (behavior instruction\n * injected into the system prompt).\n */\n\ntype RuleDraft = Omit<Rule, \"id\" | \"updatedAt\"> & {\n  id?: string;\n  tags?: string[];\n};\n\ninterface RuleEditorProps extends Omit<HTMLAttributes<HTMLFormElement>, \"onSubmit\" | \"onChange\"> {\n  initial?: Partial<Rule>;\n  onSave: (draft: RuleDraft) => void;\n  onCancel?: () => void;\n  onDelete?: () => void;\n}\n\nconst SCOPES: Array<{ id: RuleScope; label: string }> = [\n  { id: \"global\", label: \"Global — applies to every session\" },\n  { id: \"project\", label: \"Project — only this workspace\" },\n];\n\nexport function RuleEditor({\n  className,\n  initial,\n  onSave,\n  onCancel,\n  onDelete,\n  ...formProps\n}: RuleEditorProps) {\n  const [title, setTitle] = useState(initial?.title ?? \"\");\n  const [body, setBody] = useState(initial?.body ?? \"\");\n  const [scope, setScope] = useState<RuleScope>(initial?.scope ?? \"global\");\n  const [tagsRaw, setTagsRaw] = useState(initial?.tags?.join(\", \") ?? \"\");\n  const [enabled, setEnabled] = useState<RuleState>(initial?.state ?? \"enabled\");\n  const [modes, setModes] = useState<Mode[]>(initial?.modes ?? []);\n\n  // Note: state is only seeded once on mount. To reset the form when editing\n  // a different rule, use the React `key` pattern at the call site:\n  //   <RuleEditor key={rule.id} initial={rule} ... />\n  const toggleMode = (m: Mode) =>\n    setModes((prev) => (prev.includes(m) ? prev.filter((x) => x !== m) : [...prev, m]));\n\n  const canSave = title.trim().length > 0 && body.trim().length > 0;\n  const handleSubmit = (e: FormEvent) => {\n    e.preventDefault();\n    if (!canSave) return;\n    onSave({\n      id: initial?.id,\n      title: title.trim(),\n      body: body.trim(),\n      scope,\n      state: enabled,\n      tags: tagsRaw\n        .split(\",\")\n        .map((t) => t.trim())\n        .filter(Boolean),\n      modes: modes.length > 0 ? modes : undefined,\n    });\n  };\n\n  return (\n    <form\n      data-slot=\"rule-editor\"\n      onSubmit={handleSubmit}\n      className={cn(\"flex h-full flex-col gap-4\", className)}\n      {...formProps}\n    >\n      <FormField>\n        <FormField.Label>Title</FormField.Label>\n        <FormField.Control>\n          <Input\n            value={title}\n            onChange={(e) => setTitle(e.target.value)}\n            placeholder=\"Always write tests before fixes\"\n            required\n          />\n        </FormField.Control>\n        <FormField.Hint>Short, imperative summary the agent will keep in memory.</FormField.Hint>\n      </FormField>\n\n      <FormField className=\"flex-1\">\n        <FormField.Label>Body (markdown)</FormField.Label>\n        <FormField.Control>\n          <Textarea\n            value={body}\n            onChange={(e) => setBody(e.target.value)}\n            rows={8}\n            placeholder=\"When fixing a bug, first write a failing regression test, then the fix.\"\n            required\n            className=\"min-h-[12rem] flex-1 font-mono text-code-sm\"\n          />\n        </FormField.Control>\n        <FormField.Hint>Injected into the system prompt verbatim.</FormField.Hint>\n      </FormField>\n\n      <div className=\"grid grid-cols-2 gap-3\">\n        <FormField>\n          <FormField.Label>Scope</FormField.Label>\n          <FormField.Control>\n            <Select\n              value={scope}\n              onValueChange={(v) => {\n                // Re-audit Issue 7: narrow Select string value against\n                // SCOPES.id before casting. Silent no-op for unknown.\n                const next = SCOPES.find((s) => s.id === v);\n                if (next) setScope(next.id);\n              }}\n            >\n              <Select.Trigger aria-label=\"Select rule scope\">\n                <Select.Value />\n              </Select.Trigger>\n              <Select.Content>\n                {SCOPES.map((s) => (\n                  <Select.Item key={s.id} value={s.id}>\n                    {s.label}\n                  </Select.Item>\n                ))}\n              </Select.Content>\n            </Select>\n          </FormField.Control>\n        </FormField>\n        <FormField>\n          <FormField.Label>Tags (comma-separated)</FormField.Label>\n          <FormField.Control>\n            <Input\n              value={tagsRaw}\n              onChange={(e) => setTagsRaw(e.target.value)}\n              placeholder=\"testing, process\"\n            />\n          </FormField.Control>\n        </FormField>\n      </div>\n\n      <FormField>\n        <FormField.Label>Active modes</FormField.Label>\n        <div className=\"flex flex-wrap gap-1.5\">\n          {ALL_MODES.map((m) => {\n            const on = modes.includes(m);\n            return (\n              <button\n                key={m}\n                type=\"button\"\n                onClick={() => toggleMode(m)}\n                aria-pressed={on}\n                className={cn(\n                  \"inline-flex h-7 items-center rounded-full border px-3 font-mono text-body-sm transition-colors\",\n                  on\n                    ? \"border-primary bg-primary/15 text-primary\"\n                    : \"border-border/60 bg-card text-muted-foreground hover:text-foreground\",\n                )}\n              >\n                {MODE_LABEL[m]}\n              </button>\n            );\n          })}\n        </div>\n        <FormField.Hint>\n          {modes.length === 0\n            ? \"Empty = global (applies to every mode).\"\n            : `Only visible in: ${modes.map((m) => MODE_LABEL[m]).join(\", \")}.`}\n        </FormField.Hint>\n      </FormField>\n\n      <div className=\"flex items-center gap-3\">\n        <Switch\n          checked={enabled === \"enabled\"}\n          onCheckedChange={(v) => setEnabled(v ? \"enabled\" : \"disabled\")}\n          aria-label=\"Enabled\"\n        />\n        <span className=\"text-body-sm text-muted-foreground\">\n          {enabled === \"enabled\"\n            ? \"Enabled — agent will follow this rule.\"\n            : \"Disabled — kept but ignored.\"}\n        </span>\n      </div>\n\n      <footer className=\"flex items-center justify-between gap-2 border-border/40 border-t pt-4\">\n        <div>\n          {onDelete ? (\n            <Button type=\"button\" variant=\"ghost\" onClick={onDelete}>\n              Delete\n            </Button>\n          ) : null}\n        </div>\n        <div className=\"flex items-center gap-2\">\n          {onCancel ? (\n            <Button type=\"button\" variant=\"secondary\" onClick={onCancel}>\n              Cancel\n            </Button>\n          ) : null}\n          <Button type=\"submit\" disabled={!canSave}>\n            {initial?.id ? \"Save changes\" : \"Create rule\"}\n          </Button>\n        </div>\n      </footer>\n    </form>\n  );\n}\n"]}