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

package/dist/chunk-QJGGTIUN.js

@@ -0,0 +1,110 @@
+import { EmptyState } from './chunk-SWJ4EUOI.js';
+import { Card } from './chunk-ZALLCR7X.js';
+import { ActionBar } from './chunk-BX7A5GUV.js';
+import { cn } from './chunk-ZSRJCIWF.js';
+import { AlertCircle, Loader2 } from 'lucide-react';
+import { forwardRef, useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var PageShell = forwardRef(
+  ({
+    title,
+    description,
+    onTitleChange,
+    primaryAction,
+    search,
+    onFilterClick,
+    loading = false,
+    loadingNode,
+    error,
+    empty,
+    children,
+    className
+  }, ref) => {
+    useEffect(() => {
+      onTitleChange?.(title);
+    }, [title, onTitleChange]);
+    const hasActionBar = search !== void 0 || primaryAction !== void 0 || onFilterClick !== void 0;
+    let content;
+    if (loading) {
+      content = loadingNode ?? /* @__PURE__ */ jsxs(Card, { className: "flex items-center justify-center gap-3 p-12 text-muted-foreground", children: [
+        /* @__PURE__ */ jsx(Loader2, { "aria-hidden": "true", className: "size-5 animate-spin" }),
+        /* @__PURE__ */ jsx("span", { className: "font-sans text-body-sm", children: "Loading\u2026" })
+      ] });
+    } else if (error) {
+      content = /* @__PURE__ */ jsxs(Card, { className: "flex flex-col items-center gap-3 p-8 text-center", children: [
+        /* @__PURE__ */ jsx(AlertCircle, { "aria-hidden": "true", className: "size-8 text-destructive" }),
+        /* @__PURE__ */ jsx("p", { className: "font-sans text-body-sm text-foreground", children: error.message }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+          error.onRetry ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: error.onRetry,
+              className: cn(
+                "inline-flex items-center rounded-md border border-border/40 px-3 py-1.5",
+                "font-sans text-body-sm text-foreground",
+                "transition-colors hover:bg-muted"
+              ),
+              children: "Retry"
+            }
+          ) : null,
+          error.docsHref ? /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: error.docsHref,
+              className: "font-sans text-body-sm text-primary hover:underline",
+              children: "View docs"
+            }
+          ) : null
+        ] })
+      ] });
+    } else if (empty) {
+      const emptyAction = empty.action;
+      content = /* @__PURE__ */ jsx(
+        EmptyState,
+        {
+          icon: empty.icon,
+          title: empty.title,
+          description: empty.description,
+          action: emptyAction ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: emptyAction.onClick,
+              className: cn(
+                "inline-flex items-center rounded-md bg-primary px-3 py-1.5",
+                "font-medium font-sans text-body-sm text-primary-foreground",
+                "transition-colors hover:bg-primary-deep"
+              ),
+              children: emptyAction.label
+            }
+          ) : void 0
+        }
+      );
+    } else {
+      content = children;
+    }
+    return /* @__PURE__ */ jsxs(
+      "main",
+      {
+        ref,
+        "aria-busy": loading || void 0,
+        className: cn("flex flex-col gap-6", className),
+        children: [
+          /* @__PURE__ */ jsxs("header", { className: "flex flex-col gap-1", children: [
+            /* @__PURE__ */ jsx("h1", { className: "font-display font-semibold text-display-sm text-foreground tracking-tight", children: title }),
+            description ? /* @__PURE__ */ jsx("p", { className: "font-sans text-body-md text-muted-foreground", children: description }) : null
+          ] }),
+          hasActionBar ? /* @__PURE__ */ jsx(ActionBar, { search, primaryAction, onFilterClick }) : null,
+          /* @__PURE__ */ jsx("div", { children: content })
+        ]
+      }
+    );
+  }
+);
+PageShell.displayName = "PageShell";
+
+export { PageShell };
+//# sourceMappingURL=chunk-QJGGTIUN.js.map
+//# sourceMappingURL=chunk-QJGGTIUN.js.map

package/dist/chunk-QJGGTIUN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/page-shell/page-shell.tsx"],"names":[],"mappings":"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","file":"chunk-QJGGTIUN.js","sourcesContent":["import { AlertCircle, Loader2 } from \"lucide-react\";\nimport { forwardRef, useEffect } from \"react\";\nimport type { ElementType, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport { ActionBar } from \"../../primitives/action-bar/index.js\";\nimport { Card } from \"../../primitives/card/index.js\";\nimport { EmptyState } from \"../../primitives/empty-state/index.js\";\n\n/**\n * PageShell — page-level scaffold composite.\n *\n * Renders title + optional description + optional ActionBar, then\n * one of four mutually-exclusive content states:\n *   1. loading (highest precedence)\n *   2. error\n *   3. empty\n *   4. children (default)\n *\n * Scope-narrowed per Brief #5 D3: PageShell does NOT manage\n * `document.title`. Use the optional `onTitleChange` callback to\n * wire your own hook (e.g. useSetPageTitle, react-helmet,\n * next/head).\n *\n * @example\n *   <PageShell\n *     title=\"Domains\"\n *     description=\"Custom domains and DNS verification.\"\n *     search={{ placeholder: \"Search…\", value: q, onChange: setQ }}\n *     primaryAction={{ label: \"Add domain\", icon: Plus, onClick: openModal }}\n *     loading={isLoading}\n *     error={error ? { message: error.message, onRetry: refetch } : undefined}\n *     empty={data?.length === 0 ? { title: \"No domains yet\" } : undefined}\n *   >\n *     <DataTable columns={…} data={data} />\n *   </PageShell>\n */\nexport interface PageShellProps {\n  title: string;\n  description?: ReactNode;\n  /** Optional callback invoked when `title` changes — wire to your own document.title hook. */\n  onTitleChange?: (title: string) => void;\n  primaryAction?: {\n    label: ReactNode;\n    icon?: ElementType;\n    onClick: () => void;\n    loading?: boolean;\n  };\n  search?: {\n    placeholder: string;\n    value: string;\n    onChange: (v: string) => void;\n  };\n  onFilterClick?: () => void;\n  loading?: boolean;\n  /** Custom loading UI. Defaults to a centered spinner card. */\n  loadingNode?: ReactNode;\n  error?: {\n    message: string;\n    onRetry?: () => void;\n    docsHref?: string;\n  };\n  empty?: {\n    icon?: ElementType;\n    title: string;\n    description?: ReactNode;\n    action?: { label: string; onClick: () => void };\n  };\n  children?: ReactNode;\n  className?: string;\n}\n\nconst PageShell = forwardRef<HTMLElement, PageShellProps>(\n  (\n    {\n      title,\n      description,\n      onTitleChange,\n      primaryAction,\n      search,\n      onFilterClick,\n      loading = false,\n      loadingNode,\n      error,\n      empty,\n      children,\n      className,\n    },\n    ref,\n  ) => {\n    useEffect(() => {\n      onTitleChange?.(title);\n    }, [title, onTitleChange]);\n\n    const hasActionBar =\n      search !== undefined || primaryAction !== undefined || onFilterClick !== undefined;\n\n    // State precedence: loading > error > empty > children\n    let content: ReactNode;\n    if (loading) {\n      content = loadingNode ?? (\n        <Card className=\"flex items-center justify-center gap-3 p-12 text-muted-foreground\">\n          <Loader2 aria-hidden=\"true\" className=\"size-5 animate-spin\" />\n          <span className=\"font-sans text-body-sm\">Loading…</span>\n        </Card>\n      );\n    } else if (error) {\n      content = (\n        <Card className=\"flex flex-col items-center gap-3 p-8 text-center\">\n          <AlertCircle aria-hidden=\"true\" className=\"size-8 text-destructive\" />\n          <p className=\"font-sans text-body-sm text-foreground\">{error.message}</p>\n          <div className=\"flex items-center gap-3\">\n            {error.onRetry ? (\n              <button\n                type=\"button\"\n                onClick={error.onRetry}\n                className={cn(\n                  \"inline-flex items-center rounded-md border border-border/40 px-3 py-1.5\",\n                  \"font-sans text-body-sm text-foreground\",\n                  \"transition-colors hover:bg-muted\",\n                )}\n              >\n                Retry\n              </button>\n            ) : null}\n            {error.docsHref ? (\n              <a\n                href={error.docsHref}\n                className=\"font-sans text-body-sm text-primary hover:underline\"\n              >\n                View docs\n              </a>\n            ) : null}\n          </div>\n        </Card>\n      );\n    } else if (empty) {\n      const emptyAction = empty.action;\n      content = (\n        <EmptyState\n          icon={empty.icon as Parameters<typeof EmptyState>[0][\"icon\"]}\n          title={empty.title}\n          description={empty.description}\n          action={\n            emptyAction ? (\n              <button\n                type=\"button\"\n                onClick={emptyAction.onClick}\n                className={cn(\n                  \"inline-flex items-center rounded-md bg-primary px-3 py-1.5\",\n                  \"font-medium font-sans text-body-sm text-primary-foreground\",\n                  \"transition-colors hover:bg-primary-deep\",\n                )}\n              >\n                {emptyAction.label}\n              </button>\n            ) : undefined\n          }\n        />\n      );\n    } else {\n      content = children;\n    }\n\n    return (\n      <main\n        ref={ref}\n        aria-busy={loading || undefined}\n        className={cn(\"flex flex-col gap-6\", className)}\n      >\n        <header className=\"flex flex-col gap-1\">\n          <h1 className=\"font-display font-semibold text-display-sm text-foreground tracking-tight\">\n            {title}\n          </h1>\n          {description ? (\n            <p className=\"font-sans text-body-md text-muted-foreground\">{description}</p>\n          ) : null}\n        </header>\n        {hasActionBar ? (\n          <ActionBar search={search} primaryAction={primaryAction} onFilterClick={onFilterClick} />\n        ) : null}\n        <div>{content}</div>\n      </main>\n    );\n  },\n);\nPageShell.displayName = \"PageShell\";\n\nexport { PageShell };\n"]}

package/dist/chunk-R2PAGRDP.js

@@ -0,0 +1,152 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import { forwardRef, useRef, useEffect } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var SIZE_CLASS = {
+  sm: "size-8 text-body-sm",
+  md: "size-10 text-body-md",
+  lg: "size-12 text-title-sm"
+};
+function sanitize(raw, inputMode) {
+  const noWhitespace = raw.replace(/\s/g, "");
+  if (inputMode === "numeric") {
+    return noWhitespace.replace(/\D/g, "");
+  }
+  return noWhitespace.toUpperCase().replace(/[^A-Z0-9]/g, "");
+}
+var PinInput = forwardRef(
+  ({
+    className,
+    length = 6,
+    value = "",
+    onChange,
+    onComplete,
+    inputMode = "numeric",
+    size = "md",
+    disabled = false,
+    error = false,
+    autoFocus = false,
+    mask = false,
+    "aria-label": ariaLabel,
+    ...props
+  }, ref) => {
+    const inputRefs = useRef([]);
+    const wasCompleteRef = useRef(value.length === length);
+    useEffect(() => {
+      if (!autoFocus) return;
+      if (typeof window === "undefined") return;
+      inputRefs.current[0]?.focus();
+    }, [autoFocus]);
+    useEffect(() => {
+      const isComplete = value.length === length && value.length > 0;
+      if (isComplete && !wasCompleteRef.current) {
+        onComplete?.(value);
+      }
+      wasCompleteRef.current = isComplete;
+    }, [value, length, onComplete]);
+    function commit(next) {
+      const sanitized = sanitize(next, inputMode).slice(0, length);
+      onChange?.(sanitized);
+    }
+    function handleChange(slot, raw) {
+      const sanitized = sanitize(raw, inputMode);
+      if (sanitized.length === 0) {
+        const next2 = `${value.slice(0, slot)}${value.slice(slot + 1)}`;
+        commit(next2);
+        return;
+      }
+      const ch = sanitized[sanitized.length - 1] ?? "";
+      const next = `${value.slice(0, slot)}${ch}${value.slice(slot + 1)}`;
+      commit(next);
+      if (slot < length - 1) {
+        inputRefs.current[slot + 1]?.focus();
+      }
+    }
+    function handleKeyDown(slot, e) {
+      if (disabled) return;
+      const slotChar = value[slot] ?? "";
+      if (e.key === "Backspace") {
+        if (slotChar === "") {
+          if (slot > 0) {
+            inputRefs.current[slot - 1]?.focus();
+          }
+        } else {
+          const next = `${value.slice(0, slot)}${value.slice(slot + 1)}`;
+          commit(next);
+        }
+        e.preventDefault();
+      } else if (e.key === "ArrowLeft") {
+        if (slot > 0) inputRefs.current[slot - 1]?.focus();
+        e.preventDefault();
+      } else if (e.key === "ArrowRight") {
+        if (slot < length - 1) inputRefs.current[slot + 1]?.focus();
+        e.preventDefault();
+      }
+    }
+    function handlePaste(slot, e) {
+      if (disabled) return;
+      e.preventDefault();
+      const pasted = e.clipboardData.getData("text/plain");
+      const sanitized = sanitize(pasted, inputMode);
+      if (sanitized.length === 0) return;
+      const slotArr = Array.from({ length }, (_, i) => value[i] ?? "");
+      const remaining = length - slot;
+      const filled = sanitized.slice(0, remaining);
+      for (let i = 0; i < filled.length; i++) {
+        slotArr[slot + i] = filled[i] ?? "";
+      }
+      const next = slotArr.join("");
+      commit(next);
+      const focusAt = Math.min(slot + filled.length, length - 1);
+      requestAnimationFrame(() => inputRefs.current[focusAt]?.focus());
+    }
+    const slots = Array.from({ length }, (_, i) => i);
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: "group",
+        "aria-label": ariaLabel,
+        className: cn("inline-flex items-center gap-2", className),
+        ...props,
+        children: slots.map((i) => {
+          const ch = value[i] ?? "";
+          const display = mask && ch !== "" ? "\u2022" : ch;
+          return /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: (el) => {
+                inputRefs.current[i] = el;
+              },
+              type: "text",
+              inputMode: inputMode === "numeric" ? "numeric" : "text",
+              pattern: inputMode === "numeric" ? "[0-9]*" : void 0,
+              maxLength: 1,
+              autoComplete: i === 0 ? "one-time-code" : "off",
+              disabled,
+              value: display,
+              onChange: (e) => handleChange(i, e.target.value),
+              onKeyDown: (e) => handleKeyDown(i, e),
+              onPaste: (e) => handlePaste(i, e),
+              "aria-label": `Digit ${i + 1} of ${length}`,
+              className: cn(
+                "rounded-md border bg-card text-center font-medium font-mono",
+                "transition-colors",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+                "disabled:cursor-not-allowed disabled:opacity-50",
+                SIZE_CLASS[size],
+                error ? "border-destructive" : "border-border/60 hover:border-border"
+              )
+            },
+            i
+          );
+        })
+      }
+    );
+  }
+);
+PinInput.displayName = "PinInput";
+
+export { PinInput };
+//# sourceMappingURL=chunk-R2PAGRDP.js.map
+//# sourceMappingURL=chunk-R2PAGRDP.js.map

package/dist/chunk-R2PAGRDP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/pin-input/pin-input.tsx"],"names":["next"],"mappings":"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","file":"chunk-R2PAGRDP.js","sourcesContent":["import { forwardRef, useEffect, useRef } from \"react\";\nimport type { ClipboardEvent, HTMLAttributes, KeyboardEvent } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * PinInput — multi-slot OTP / code input primitive.\n *\n * Renders N separate boxes (default 6) that auto-advance focus on\n * input. Paste handling fills all slots from clipboard (whitespace\n * stripped). Arrow keys navigate; backspace clears current slot\n * then moves focus back when empty.\n *\n * Industry-standard pattern for email verification codes (Apple,\n * Stripe, Clerk, Auth0, GitHub two-factor).\n *\n * @example\n *   <PinInput\n *     length={6}\n *     value={code}\n *     onChange={setCode}\n *     onComplete={(v) => verify(v)}\n *     inputMode=\"numeric\"\n *     aria-label=\"Verification code\"\n *   />\n *\n * Note: value is treated as controlled. If you pass a complete value\n * on mount, onComplete will NOT fire — onComplete fires only on\n * transitions from incomplete → complete.\n */\nexport interface PinInputProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"inputMode\"> {\n  length?: number;\n  value?: string;\n  onChange?: (value: string) => void;\n  onComplete?: (value: string) => void;\n  inputMode?: \"numeric\" | \"alphanumeric\";\n  size?: \"sm\" | \"md\" | \"lg\";\n  disabled?: boolean;\n  error?: boolean;\n  \"aria-label\": string;\n  autoFocus?: boolean;\n  mask?: boolean;\n}\n\nconst SIZE_CLASS: Record<NonNullable<PinInputProps[\"size\"]>, string> = {\n  sm: \"size-8 text-body-sm\",\n  md: \"size-10 text-body-md\",\n  lg: \"size-12 text-title-sm\",\n};\n\nfunction sanitize(raw: string, inputMode: \"numeric\" | \"alphanumeric\"): string {\n  const noWhitespace = raw.replace(/\\s/g, \"\");\n  if (inputMode === \"numeric\") {\n    return noWhitespace.replace(/\\D/g, \"\");\n  }\n  return noWhitespace.toUpperCase().replace(/[^A-Z0-9]/g, \"\");\n}\n\nconst PinInput = forwardRef<HTMLDivElement, PinInputProps>(\n  (\n    {\n      className,\n      length = 6,\n      value = \"\",\n      onChange,\n      onComplete,\n      inputMode = \"numeric\",\n      size = \"md\",\n      disabled = false,\n      error = false,\n      autoFocus = false,\n      mask = false,\n      \"aria-label\": ariaLabel,\n      ...props\n    },\n    ref,\n  ) => {\n    const inputRefs = useRef<Array<HTMLInputElement | null>>([]);\n    const wasCompleteRef = useRef<boolean>(value.length === length);\n\n    // Auto-focus first slot on mount (SSR-safe)\n    useEffect(() => {\n      if (!autoFocus) return;\n      if (typeof window === \"undefined\") return;\n      inputRefs.current[0]?.focus();\n    }, [autoFocus]);\n\n    // Fire onComplete on transitions from incomplete → complete\n    useEffect(() => {\n      const isComplete = value.length === length && value.length > 0;\n      if (isComplete && !wasCompleteRef.current) {\n        onComplete?.(value);\n      }\n      wasCompleteRef.current = isComplete;\n    }, [value, length, onComplete]);\n\n    function commit(next: string) {\n      const sanitized = sanitize(next, inputMode).slice(0, length);\n      onChange?.(sanitized);\n    }\n\n    function handleChange(slot: number, raw: string) {\n      const sanitized = sanitize(raw, inputMode);\n      if (sanitized.length === 0) {\n        // Clear current slot\n        const next = `${value.slice(0, slot)}${value.slice(slot + 1)}`;\n        commit(next);\n        return;\n      }\n      // Take the last character typed (handles browser autocomplete that fills multiple)\n      const ch = sanitized[sanitized.length - 1] ?? \"\";\n      const next = `${value.slice(0, slot)}${ch}${value.slice(slot + 1)}`;\n      commit(next);\n      // Advance focus\n      if (slot < length - 1) {\n        inputRefs.current[slot + 1]?.focus();\n      }\n    }\n\n    function handleKeyDown(slot: number, e: KeyboardEvent<HTMLInputElement>) {\n      if (disabled) return;\n      const slotChar = value[slot] ?? \"\";\n\n      if (e.key === \"Backspace\") {\n        if (slotChar === \"\") {\n          // Move focus back if current is empty\n          if (slot > 0) {\n            inputRefs.current[slot - 1]?.focus();\n          }\n        } else {\n          // Clear current slot, stay focused\n          const next = `${value.slice(0, slot)}${value.slice(slot + 1)}`;\n          commit(next);\n        }\n        e.preventDefault();\n      } else if (e.key === \"ArrowLeft\") {\n        if (slot > 0) inputRefs.current[slot - 1]?.focus();\n        e.preventDefault();\n      } else if (e.key === \"ArrowRight\") {\n        if (slot < length - 1) inputRefs.current[slot + 1]?.focus();\n        e.preventDefault();\n      }\n    }\n\n    function handlePaste(slot: number, e: ClipboardEvent<HTMLInputElement>) {\n      if (disabled) return;\n      e.preventDefault();\n      const pasted = e.clipboardData.getData(\"text/plain\");\n      const sanitized = sanitize(pasted, inputMode);\n      if (sanitized.length === 0) return;\n      // Build slot-indexed array, then overwrite from `slot` onwards.\n      // Previous string-concat approach didn't pad when value was shorter\n      // than `slot`, which made paste-from-middle-when-empty fill from 0.\n      const slotArr: string[] = Array.from({ length }, (_, i) => value[i] ?? \"\");\n      const remaining = length - slot;\n      const filled = sanitized.slice(0, remaining);\n      for (let i = 0; i < filled.length; i++) {\n        slotArr[slot + i] = filled[i] ?? \"\";\n      }\n      const next = slotArr.join(\"\");\n      commit(next);\n      // Focus the slot after the last filled, or the last slot if completed\n      const focusAt = Math.min(slot + filled.length, length - 1);\n      requestAnimationFrame(() => inputRefs.current[focusAt]?.focus());\n    }\n\n    const slots = Array.from({ length }, (_, i) => i);\n\n    return (\n      <div\n        ref={ref}\n        // biome-ignore lint/a11y/useSemanticElements: <fieldset> would force a different visual layout (rectangular border by default) and is form-bound; we use a div with role=\"group\" + aria-label for grouping semantics.\n        role=\"group\"\n        aria-label={ariaLabel}\n        className={cn(\"inline-flex items-center gap-2\", className)}\n        {...props}\n      >\n        {slots.map((i) => {\n          const ch = value[i] ?? \"\";\n          const display = mask && ch !== \"\" ? \"•\" : ch;\n          return (\n            <input\n              // biome-ignore lint/suspicious/noArrayIndexKey: PinInput slots are positional; reorder is impossible by design.\n              key={i}\n              ref={(el) => {\n                inputRefs.current[i] = el;\n              }}\n              type=\"text\"\n              inputMode={inputMode === \"numeric\" ? \"numeric\" : \"text\"}\n              pattern={inputMode === \"numeric\" ? \"[0-9]*\" : undefined}\n              maxLength={1}\n              autoComplete={i === 0 ? \"one-time-code\" : \"off\"}\n              disabled={disabled}\n              value={display}\n              onChange={(e) => handleChange(i, e.target.value)}\n              onKeyDown={(e) => handleKeyDown(i, e)}\n              onPaste={(e) => handlePaste(i, e)}\n              aria-label={`Digit ${i + 1} of ${length}`}\n              className={cn(\n                \"rounded-md border bg-card text-center font-medium font-mono\",\n                \"transition-colors\",\n                \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n                \"disabled:cursor-not-allowed disabled:opacity-50\",\n                SIZE_CLASS[size],\n                error ? \"border-destructive\" : \"border-border/60 hover:border-border\",\n              )}\n            />\n          );\n        })}\n      </div>\n    );\n  },\n);\nPinInput.displayName = \"PinInput\";\n\nexport { PinInput };\n"]}

package/dist/{chunk-QU6RLHYH.js → chunk-TNBJ36XJ.js}

@@ -1,6 +1,6 @@
 import { ALL_MODES, MODE_LABEL } from './chunk-VM4RMQQN.js';
-import { Switch } from './chunk-3HOXC25T.js';
 import { Textarea } from './chunk-WWNH5ENT.js';
+import { Switch } from './chunk-3HOXC25T.js';
 import { Select } from './chunk-EP25QJ4N.js';
 import { FormField } from './chunk-TK24HQJJ.js';
 import { Input } from './chunk-H3VJMFJQ.js';
@@ -152,5 +152,5 @@ function RuleEditor({
 }
 
 export { RuleEditor };
-//# sourceMappingURL=chunk-QU6RLHYH.js.map
-//# sourceMappingURL=chunk-QU6RLHYH.js.map
+//# sourceMappingURL=chunk-TNBJ36XJ.js.map
+//# sourceMappingURL=chunk-TNBJ36XJ.js.map

package/dist/{chunk-QU6RLHYH.js.map → chunk-TNBJ36XJ.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/composites/rule-editor/rule-editor.tsx"],"names":[],"mappings":"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","file":"chunk-QU6RLHYH.js","sourcesContent":["import { 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      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"]}
+{"version":3,"sources":["../src/components/composites/rule-editor/rule-editor.tsx"],"names":[],"mappings":";;;;;;;;;;;AA6BA,IAAM,MAAA,GAAkD;AAAA,EACtD,EAAE,EAAA,EAAI,QAAA,EAAU,KAAA,EAAO,wCAAA,EAAoC;AAAA,EAC3D,EAAE,EAAA,EAAI,SAAA,EAAW,KAAA,EAAO,oCAAA;AAC1B,CAAA;AAEO,SAAS,UAAA,CAAW;AAAA,EACzB,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAoB;AAClB,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,IAAI,QAAA,CAAS,OAAA,EAAS,SAAS,EAAE,CAAA;AACvD,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,IAAI,QAAA,CAAS,OAAA,EAAS,QAAQ,EAAE,CAAA;AACpD,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,IAAI,QAAA,CAAoB,OAAA,EAAS,SAAS,QAAQ,CAAA;AACxE,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,QAAA,CAAS,SAAS,IAAA,EAAM,IAAA,CAAK,IAAI,CAAA,IAAK,EAAE,CAAA;AACtE,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,IAAI,QAAA,CAAoB,OAAA,EAAS,SAAS,SAAS,CAAA;AAC7E,EAAA,MAAM,CAAC,OAAO,QAAQ,CAAA,GAAI,SAAiB,OAAA,EAAS,KAAA,IAAS,EAAE,CAAA;AAK/D,EAAA,MAAM,UAAA,GAAa,CAAC,CAAA,KAClB,QAAA,CAAS,CAAC,IAAA,KAAU,IAAA,CAAK,SAAS,CAAC,CAAA,GAAI,KAAK,MAAA,CAAO,CAAC,MAAM,CAAA,KAAM,CAAC,IAAI,CAAC,GAAG,IAAA,EAAM,CAAC,CAAE,CAAA;AAEpF,EAAA,MAAM,OAAA,GAAU,MAAM,IAAA,EAAK,CAAE,SAAS,CAAA,IAAK,IAAA,CAAK,IAAA,EAAK,CAAE,MAAA,GAAS,CAAA;AAChE,EAAA,MAAM,YAAA,GAAe,CAAC,CAAA,KAAiB;AACrC,IAAA,CAAA,CAAE,cAAA,EAAe;AACjB,IAAA,IAAI,CAAC,OAAA,EAAS;AACd,IAAA,MAAA,CAAO;AAAA,MACL,IAAI,OAAA,EAAS,EAAA;AAAA,MACb,KAAA,EAAO,MAAM,IAAA,EAAK;AAAA,MAClB,IAAA,EAAM,KAAK,IAAA,EAAK;AAAA,MAChB,KAAA;AAAA,MACA,KAAA,EAAO,OAAA;AAAA,MACP,IAAA,EAAM,OAAA,CACH,KAAA,CAAM,GAAG,CAAA,CACT,GAAA,CAAI,CAAC,CAAA,KAAM,CAAA,CAAE,IAAA,EAAM,CAAA,CACnB,OAAO,OAAO,CAAA;AAAA,MACjB,KAAA,EAAO,KAAA,CAAM,MAAA,GAAS,CAAA,GAAI,KAAA,GAAQ;AAAA,KACnC,CAAA;AAAA,EACH,CAAA;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,QAAA,EAAU,YAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,4BAAA,EAA8B,SAAS,CAAA;AAAA,MACpD,GAAG,SAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,SAAA,EAAA,EACC,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,SAAA,CAAU,KAAA,EAAV,EAAgB,QAAA,EAAA,OAAA,EAAK,CAAA;AAAA,0BACtB,GAAA,CAAC,SAAA,CAAU,OAAA,EAAV,EACC,QAAA,kBAAA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,KAAA,EAAO,KAAA;AAAA,cACP,UAAU,CAAC,CAAA,KAAM,QAAA,CAAS,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,cACxC,WAAA,EAAY,iCAAA;AAAA,cACZ,QAAA,EAAQ;AAAA;AAAA,WACV,EACF,CAAA;AAAA,0BACA,GAAA,CAAC,SAAA,CAAU,IAAA,EAAV,EAAe,QAAA,EAAA,0DAAA,EAAwD;AAAA,SAAA,EAC1E,CAAA;AAAA,wBAEA,IAAA,CAAC,SAAA,EAAA,EAAU,SAAA,EAAU,QAAA,EACnB,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,SAAA,CAAU,KAAA,EAAV,EAAgB,QAAA,EAAA,iBAAA,EAAe,CAAA;AAAA,0BAChC,GAAA,CAAC,SAAA,CAAU,OAAA,EAAV,EACC,QAAA,kBAAA,GAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,KAAA,EAAO,IAAA;AAAA,cACP,UAAU,CAAC,CAAA,KAAM,OAAA,CAAQ,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,cACvC,IAAA,EAAM,CAAA;AAAA,cACN,WAAA,EAAY,yEAAA;AAAA,cACZ,QAAA,EAAQ,IAAA;AAAA,cACR,SAAA,EAAU;AAAA;AAAA,WACZ,EACF,CAAA;AAAA,0BACA,GAAA,CAAC,SAAA,CAAU,IAAA,EAAV,EAAe,QAAA,EAAA,2CAAA,EAAyC;AAAA,SAAA,EAC3D,CAAA;AAAA,wBAEA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,wBAAA,EACb,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,SAAA,EAAA,EACC,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,SAAA,CAAU,KAAA,EAAV,EAAgB,QAAA,EAAA,OAAA,EAAK,CAAA;AAAA,4BACtB,GAAA,CAAC,SAAA,CAAU,OAAA,EAAV,EACC,QAAA,kBAAA,IAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,KAAA,EAAO,KAAA;AAAA,gBACP,aAAA,EAAe,CAAC,CAAA,KAAM;AAGpB,kBAAA,MAAM,OAAO,MAAA,CAAO,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,OAAO,CAAC,CAAA;AAC1C,kBAAA,IAAI,IAAA,EAAM,QAAA,CAAS,IAAA,CAAK,EAAE,CAAA;AAAA,gBAC5B,CAAA;AAAA,gBAEA,QAAA,EAAA;AAAA,kCAAA,GAAA,CAAC,MAAA,CAAO,SAAP,EAAe,YAAA,EAAW,qBACzB,QAAA,kBAAA,GAAA,CAAC,MAAA,CAAO,KAAA,EAAP,EAAa,CAAA,EAChB,CAAA;AAAA,kCACA,GAAA,CAAC,OAAO,OAAA,EAAP,EACE,iBAAO,GAAA,CAAI,CAAC,sBACX,GAAA,CAAC,MAAA,CAAO,MAAP,EAAuB,KAAA,EAAO,EAAE,EAAA,EAC9B,QAAA,EAAA,CAAA,CAAE,SADa,CAAA,CAAE,EAEpB,CACD,CAAA,EACH;AAAA;AAAA;AAAA,aACF,EACF;AAAA,WAAA,EACF,CAAA;AAAA,+BACC,SAAA,EAAA,EACC,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,SAAA,CAAU,KAAA,EAAV,EAAgB,QAAA,EAAA,wBAAA,EAAsB,CAAA;AAAA,4BACvC,GAAA,CAAC,SAAA,CAAU,OAAA,EAAV,EACC,QAAA,kBAAA,GAAA;AAAA,cAAC,KAAA;AAAA,cAAA;AAAA,gBACC,KAAA,EAAO,OAAA;AAAA,gBACP,UAAU,CAAC,CAAA,KAAM,UAAA,CAAW,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,gBAC1C,WAAA,EAAY;AAAA;AAAA,aACd,EACF;AAAA,WAAA,EACF;AAAA,SAAA,EACF,CAAA;AAAA,6BAEC,SAAA,EAAA,EACC,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,SAAA,CAAU,KAAA,EAAV,EAAgB,QAAA,EAAA,cAAA,EAAY,CAAA;AAAA,8BAC5B,KAAA,EAAA,EAAI,SAAA,EAAU,0BACZ,QAAA,EAAA,SAAA,CAAU,GAAA,CAAI,CAAC,CAAA,KAAM;AACpB,YAAA,MAAM,EAAA,GAAK,KAAA,CAAM,QAAA,CAAS,CAAC,CAAA;AAC3B,YAAA,uBACE,GAAA;AAAA,cAAC,QAAA;AAAA,cAAA;AAAA,gBAEC,IAAA,EAAK,QAAA;AAAA,gBACL,OAAA,EAAS,MAAM,UAAA,CAAW,CAAC,CAAA;AAAA,gBAC3B,cAAA,EAAc,EAAA;AAAA,gBACd,SAAA,EAAW,EAAA;AAAA,kBACT,gGAAA;AAAA,kBACA,KACI,2CAAA,GACA;AAAA,iBACN;AAAA,gBAEC,qBAAW,CAAC;AAAA,eAAA;AAAA,cAXR;AAAA,aAYP;AAAA,UAEJ,CAAC,CAAA,EACH,CAAA;AAAA,0BACA,GAAA,CAAC,UAAU,IAAA,EAAV,EACE,gBAAM,MAAA,KAAW,CAAA,GACd,4CACA,CAAA,iBAAA,EAAoB,KAAA,CAAM,IAAI,CAAC,CAAA,KAAM,WAAW,CAAC,CAAC,EAAE,IAAA,CAAK,IAAI,CAAC,CAAA,CAAA,CAAA,EACpE;AAAA,SAAA,EACF,CAAA;AAAA,wBAEA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,yBAAA,EACb,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,SAAS,OAAA,KAAY,SAAA;AAAA,cACrB,iBAAiB,CAAC,CAAA,KAAM,UAAA,CAAW,CAAA,GAAI,YAAY,UAAU,CAAA;AAAA,cAC7D,YAAA,EAAW;AAAA;AAAA,WACb;AAAA,8BACC,MAAA,EAAA,EAAK,SAAA,EAAU,sCACb,QAAA,EAAA,OAAA,KAAY,SAAA,GACT,gDACA,mCAAA,EACN;AAAA,SAAA,EACF,CAAA;AAAA,wBAEA,IAAA,CAAC,QAAA,EAAA,EAAO,SAAA,EAAU,wEAAA,EAChB,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,EAAA,EACE,QAAA,EAAA,QAAA,mBACC,GAAA,CAAC,MAAA,EAAA,EAAO,IAAA,EAAK,QAAA,EAAS,OAAA,EAAQ,OAAA,EAAQ,OAAA,EAAS,QAAA,EAAU,QAAA,EAAA,QAAA,EAEzD,CAAA,GACE,IAAA,EACN,CAAA;AAAA,0BACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,yBAAA,EACZ,QAAA,EAAA;AAAA,YAAA,QAAA,mBACC,GAAA,CAAC,UAAO,IAAA,EAAK,QAAA,EAAS,SAAQ,WAAA,EAAY,OAAA,EAAS,QAAA,EAAU,QAAA,EAAA,QAAA,EAE7D,CAAA,GACE,IAAA;AAAA,4BACJ,GAAA,CAAC,MAAA,EAAA,EAAO,IAAA,EAAK,QAAA,EAAS,QAAA,EAAU,CAAC,OAAA,EAC9B,QAAA,EAAA,OAAA,EAAS,EAAA,GAAK,cAAA,GAAiB,aAAA,EAClC;AAAA,WAAA,EACF;AAAA,SAAA,EACF;AAAA;AAAA;AAAA,GACF;AAEJ","file":"chunk-TNBJ36XJ.js","sourcesContent":["import { 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      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"]}

package/dist/chunk-ZNILW4G5.js

@@ -0,0 +1,199 @@
+import { Table } from './chunk-YRSKXEOD.js';
+import { Skeleton } from './chunk-K5ARID4S.js';
+import { Pagination } from './chunk-YOGHS4UU.js';
+import { DropdownMenu } from './chunk-MI5CXMZU.js';
+import { EmptyState } from './chunk-SWJ4EUOI.js';
+import { cn } from './chunk-ZSRJCIWF.js';
+import { ChevronDown, ChevronRight, MoreHorizontal } from 'lucide-react';
+import { useState, useMemo, Fragment } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function compareValues(a, b) {
+  if (a === b) return 0;
+  if (a === null || a === void 0) return -1;
+  if (b === null || b === void 0) return 1;
+  if (typeof a === "number" && typeof b === "number") return a - b;
+  return String(a).localeCompare(String(b));
+}
+function DataTable(props) {
+  const {
+    data,
+    columns,
+    rowKey,
+    stickyHeader = true,
+    expandable,
+    expandMode = "multiple",
+    rowActions,
+    pagination,
+    defaultSort,
+    sort: controlledSort,
+    onSortChange,
+    loading = false,
+    emptyState,
+    className
+  } = props;
+  const isControlledSort = onSortChange !== void 0;
+  const [uncontrolledSort, setUncontrolledSort] = useState(
+    defaultSort ?? null
+  );
+  const sort = isControlledSort ? controlledSort ?? null : uncontrolledSort;
+  const isControlledPage = pagination?.controlledPage !== void 0;
+  const [uncontrolledPage, setUncontrolledPage] = useState(0);
+  const currentPage = isControlledPage ? pagination?.controlledPage ?? 0 : uncontrolledPage;
+  const effectivePageSize = Math.max(1, pagination?.pageSize ?? 10);
+  const [expanded, setExpanded] = useState(/* @__PURE__ */ new Set());
+  function handleSort(columnKey) {
+    let nextSort;
+    if (sort?.key !== columnKey) {
+      nextSort = { key: columnKey, direction: "asc" };
+    } else if (sort.direction === "asc") {
+      nextSort = { key: columnKey, direction: "desc" };
+    } else {
+      nextSort = null;
+    }
+    if (isControlledSort) {
+      onSortChange?.(nextSort);
+    } else {
+      setUncontrolledSort(nextSort);
+      if (!isControlledPage) setUncontrolledPage(0);
+    }
+  }
+  function handlePageChange(page) {
+    const zeroIdx = page - 1;
+    if (isControlledPage) {
+      pagination?.onPageChange?.(zeroIdx);
+    } else {
+      setUncontrolledPage(zeroIdx);
+    }
+  }
+  function toggleExpand(key) {
+    if (expandMode === "single") {
+      setExpanded((prev) => prev.has(key) ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Set([key]));
+    } else {
+      setExpanded((prev) => {
+        const next = new Set(prev);
+        if (next.has(key)) {
+          next.delete(key);
+        } else {
+          next.add(key);
+        }
+        return next;
+      });
+    }
+  }
+  const sortedData = useMemo(() => {
+    if (isControlledSort || sort === null) return data;
+    const col = columns.find((c) => c.key === sort.key);
+    if (!col) return data;
+    const sorted = [...data].sort((a, b) => {
+      const aVal = col.render ? null : a[sort.key];
+      const bVal = col.render ? null : b[sort.key];
+      const cmp = compareValues(aVal, bVal);
+      return sort.direction === "asc" ? cmp : -cmp;
+    });
+    return sorted;
+  }, [data, sort, isControlledSort, columns]);
+  const visibleData = useMemo(() => {
+    if (!pagination) return sortedData;
+    if (isControlledPage) return sortedData;
+    const start = currentPage * effectivePageSize;
+    return sortedData.slice(start, start + effectivePageSize);
+  }, [sortedData, pagination, isControlledPage, currentPage, effectivePageSize]);
+  const extraCols = (expandable ? 1 : 0) + (rowActions ? 1 : 0);
+  const expandedColSpan = columns.length + extraCols;
+  const totalCols = columns.length + extraCols;
+  if (loading) {
+    return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), children: /* @__PURE__ */ jsxs(Table, { children: [
+      /* @__PURE__ */ jsx(Table.Header, { className: stickyHeader ? "sticky top-0 bg-card" : void 0, children: /* @__PURE__ */ jsxs(Table.Row, { children: [
+        expandable ? /* @__PURE__ */ jsx(Table.HeaderCell, { children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Expand" }) }) : null,
+        columns.map((col) => /* @__PURE__ */ jsx(Table.HeaderCell, { align: col.align, children: col.label }, col.key)),
+        rowActions ? /* @__PURE__ */ jsx(Table.HeaderCell, { children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Actions" }) }) : null
+      ] }) }),
+      /* @__PURE__ */ jsx(Table.Body, { children: Array.from({ length: 5 }, (_, i) => (
+        // biome-ignore lint/suspicious/noArrayIndexKey: skeleton rows are positional placeholders
+        /* @__PURE__ */ jsx(Table.Row, { children: Array.from({ length: totalCols }, (_2, j) => (
+          // biome-ignore lint/suspicious/noArrayIndexKey: skeleton cells are positional placeholders
+          /* @__PURE__ */ jsx(Table.Cell, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-full" }) }, `s-${i}-${j}`)
+        )) }, `skeleton-${i}`)
+      )) })
+    ] }) });
+  }
+  if (sortedData.length === 0) {
+    return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), children: emptyState ?? /* @__PURE__ */ jsx(EmptyState, { title: "No data", description: "There's nothing here yet." }) });
+  }
+  const totalPages = pagination ? Math.ceil(sortedData.length / effectivePageSize) : 1;
+  return /* @__PURE__ */ jsxs("div", { className: cn("w-full", className), children: [
+    /* @__PURE__ */ jsxs(Table, { children: [
+      /* @__PURE__ */ jsx(Table.Header, { className: stickyHeader ? "sticky top-0 z-10 bg-card" : void 0, children: /* @__PURE__ */ jsxs(Table.Row, { children: [
+        expandable ? /* @__PURE__ */ jsx(Table.HeaderCell, { children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Expand" }) }) : null,
+        columns.map((col) => {
+          const isSortable = col.sortable === true;
+          const isActive = sort?.key === col.key;
+          return /* @__PURE__ */ jsx(
+            Table.HeaderCell,
+            {
+              align: col.align,
+              onSort: isSortable ? () => handleSort(col.key) : void 0,
+              sortDirection: isSortable ? isActive ? sort?.direction : "none" : void 0,
+              style: col.width ? { width: col.width } : void 0,
+              children: col.label
+            },
+            col.key
+          );
+        }),
+        rowActions ? /* @__PURE__ */ jsx(Table.HeaderCell, { children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Actions" }) }) : null
+      ] }) }),
+      /* @__PURE__ */ jsx(Table.Body, { children: visibleData.map((row) => {
+        const key = rowKey(row);
+        const expandedContent = expandable ? expandable(row) : null;
+        const isExpandable = expandedContent !== null && expandedContent !== void 0;
+        const isExpanded = expanded.has(key);
+        return /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs(Table.Row, { children: [
+            expandable ? /* @__PURE__ */ jsx(Table.Cell, { children: isExpandable ? /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => toggleExpand(key),
+                "aria-expanded": isExpanded,
+                "aria-controls": `expanded-${key}`,
+                "aria-label": isExpanded ? "Collapse row" : "Expand row",
+                className: "inline-flex items-center justify-center rounded-md p-0.5 hover:bg-muted",
+                children: isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": "true", className: "size-4" }) : /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": "true", className: "size-4" })
+              }
+            ) : null }) : null,
+            columns.map((col) => /* @__PURE__ */ jsx(Table.Cell, { align: col.align, className: col.className, children: col.render ? col.render(row) : String(row[col.key] ?? "") }, col.key)),
+            rowActions ? /* @__PURE__ */ jsx(Table.Cell, { align: "right", children: /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+              /* @__PURE__ */ jsx(
+                DropdownMenu.Trigger,
+                {
+                  "aria-label": "Row actions",
+                  className: cn(
+                    "inline-flex size-7 items-center justify-center rounded-md",
+                    "text-muted-foreground hover:bg-muted hover:text-foreground",
+                    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                  ),
+                  children: /* @__PURE__ */ jsx(MoreHorizontal, { "aria-hidden": "true", className: "size-4" })
+                }
+              ),
+              /* @__PURE__ */ jsx(DropdownMenu.Content, { align: "end", children: rowActions(row) })
+            ] }) }) : null
+          ] }),
+          isExpanded && isExpandable ? /* @__PURE__ */ jsx("tr", { id: `expanded-${key}`, children: /* @__PURE__ */ jsx("td", { colSpan: expandedColSpan, className: "bg-muted/30 p-4", children: expandedContent }) }) : null
+        ] }, key);
+      }) })
+    ] }),
+    pagination && totalPages > 1 ? /* @__PURE__ */ jsx("div", { className: "mt-4 flex items-center justify-end", children: /* @__PURE__ */ jsx(
+      Pagination,
+      {
+        currentPage: currentPage + 1,
+        totalPages,
+        onPageChange: handlePageChange
+      }
+    ) }) : null
+  ] });
+}
+
+export { DataTable };
+//# sourceMappingURL=chunk-ZNILW4G5.js.map
+//# sourceMappingURL=chunk-ZNILW4G5.js.map