@usetheo/ui 0.9.0-next.0 → 0.11.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-QSOIJ6J3.js

@@ -0,0 +1,91 @@
+import { Dialog } from './chunk-2UJROWAG.js';
+import { Button } from './chunk-57NXT3OX.js';
+import { ShieldAlert, FolderOpen, AlertTriangle } from 'lucide-react';
+import { useRef } from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var defaultOperationLabels = {
+  read: "read",
+  write: "edit",
+  delete: "permanently delete"
+};
+var defaultLabels = {
+  cancel: "Cancel",
+  always: "Always allow",
+  allow: "Allow once",
+  requestedOps: "Requested operations:"
+};
+function PermissionModal({
+  open,
+  onOpenChange,
+  request,
+  onDecide,
+  title,
+  description,
+  operationLabels,
+  labels
+}) {
+  const opLabels = { ...defaultOperationLabels, ...operationLabels };
+  const opsList = request.operations.map((op) => opLabels[op]).join(", ");
+  const text = { ...defaultLabels, ...labels };
+  const decidedRef = useRef(false);
+  function handleDecide(decision) {
+    decidedRef.current = true;
+    onDecide(decision);
+  }
+  function handleOpenChange(next) {
+    const wasDecided = decidedRef.current;
+    decidedRef.current = false;
+    if (!next && !wasDecided) {
+      onDecide("denied");
+    }
+    onOpenChange(next);
+  }
+  const defaultTitle = /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
+    /* @__PURE__ */ jsx(ShieldAlert, { className: "size-5 text-warning", "aria-hidden": "true" }),
+    "Allow Theo to ",
+    opsList,
+    " files in",
+    " ",
+    /* @__PURE__ */ jsx("code", { className: "rounded-md bg-muted px-1.5 py-0.5 font-mono text-code-md text-primary", children: request.path }),
+    "?"
+  ] });
+  const defaultDescription = /* @__PURE__ */ jsxs(Fragment, { children: [
+    "This includes all files and subfolders. Theo will be able to ",
+    opsList,
+    " and may share the contents with connected third-party tools. Be careful when exposing confidential information."
+  ] });
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs(Dialog.Content, { className: "max-w-xl", children: [
+    /* @__PURE__ */ jsxs(Dialog.Header, { children: [
+      /* @__PURE__ */ jsx(Dialog.Title, { children: title ?? defaultTitle }),
+      /* @__PURE__ */ jsx(Dialog.Description, { children: description ?? defaultDescription })
+    ] }),
+    /* @__PURE__ */ jsx(Dialog.Body, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 rounded-md border border-border/40 bg-muted/40 p-3", children: [
+      /* @__PURE__ */ jsx(
+        FolderOpen,
+        {
+          className: "mt-0.5 size-4 shrink-0 text-muted-foreground",
+          "aria-hidden": "true"
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "grid gap-1", children: [
+        /* @__PURE__ */ jsx("p", { className: "font-mono text-code-sm text-foreground", children: request.path }),
+        /* @__PURE__ */ jsxs("p", { className: "flex items-center gap-1.5 font-sans text-label text-warning", children: [
+          /* @__PURE__ */ jsx(AlertTriangle, { className: "size-3", "aria-hidden": "true" }),
+          text.requestedOps,
+          " ",
+          opsList
+        ] })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsxs(Dialog.Footer, { children: [
+      /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: () => handleDecide("denied"), children: text.cancel }),
+      /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: () => handleDecide("always_allowed"), children: text.always }),
+      /* @__PURE__ */ jsx(Button, { onClick: () => handleDecide("allowed_once"), children: text.allow })
+    ] })
+  ] }) });
+}
+
+export { PermissionModal };
+//# sourceMappingURL=chunk-QSOIJ6J3.js.map
+//# sourceMappingURL=chunk-QSOIJ6J3.js.map

package/dist/chunk-QSOIJ6J3.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/permission-modal/permission-modal.tsx"],"names":[],"mappings":"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","file":"chunk-QSOIJ6J3.js","sourcesContent":["import { AlertTriangle, FolderOpen, ShieldAlert } from \"lucide-react\";\nimport { useRef } from \"react\";\nimport type { ReactNode } from \"react\";\nimport type {\n  PermissionDecision,\n  PermissionOperation,\n  PermissionRequest,\n} from \"../../../types/permission.js\";\nimport { Button } from \"../../primitives/button/index.js\";\nimport { Dialog } from \"../../primitives/dialog/index.js\";\n\n/**\n * Friendly operation labels used by the default copy. Override with the\n * `operationLabels` prop to localize or rephrase per project.\n */\nexport const defaultOperationLabels: Record<PermissionOperation, string> = {\n  read: \"read\",\n  write: \"edit\",\n  delete: \"permanently delete\",\n};\n\ninterface PermissionModalLabels {\n  /** \"Cancel\" button. */\n  cancel: ReactNode;\n  /** \"Always allow\" tertiary button. */\n  always: ReactNode;\n  /** \"Allow once\" primary button. */\n  allow: ReactNode;\n  /** Inline label rendered before the operation list inside the body card. */\n  requestedOps: ReactNode;\n}\n\nconst defaultLabels: PermissionModalLabels = {\n  cancel: \"Cancel\",\n  always: \"Always allow\",\n  allow: \"Allow once\",\n  requestedOps: \"Requested operations:\",\n};\n\ninterface PermissionModalProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  request: PermissionRequest;\n  /**\n   * Fires when the user picks a decision. The modal does NOT auto-close;\n   * caller decides whether the decision should dismiss the modal.\n   */\n  onDecide: (decision: PermissionDecision) => void;\n  /** Override the modal title. Defaults to \"Allow Theo to {ops} files in {path}?\". */\n  title?: ReactNode;\n  /** Override the modal description (body lead text). */\n  description?: ReactNode;\n  /** Override the verb used for each operation in the default copy. */\n  operationLabels?: Partial<Record<PermissionOperation, string>>;\n  /** Override button text + inline labels. Useful for i18n. */\n  labels?: Partial<PermissionModalLabels>;\n}\n\n/**\n * PermissionModal — local-files access prompt built on Dialog.\n *\n * Three actions: Cancel (denied), Always allow, Allow once. Per WIREMOCKS §5,\n * the path is shown in the title (not hidden in body) and destructive\n * operations are listed inline.\n *\n * All visible text can be overridden via `title`, `description`,\n * `operationLabels`, and `labels`. Defaults are English; pass overrides for\n * other locales.\n */\nfunction PermissionModal({\n  open,\n  onOpenChange,\n  request,\n  onDecide,\n  title,\n  description,\n  operationLabels,\n  labels,\n}: PermissionModalProps) {\n  const opLabels = { ...defaultOperationLabels, ...operationLabels };\n  const opsList = request.operations.map((op) => opLabels[op]).join(\", \");\n  const text = { ...defaultLabels, ...labels };\n\n  // T4.4 (Code Issue 4): Esc / overlay-click previously fired onOpenChange(false)\n  // but never onDecide — users saw \"Cancel\" semantics, app saw silent dismissal.\n  // Track whether an explicit button decision happened; if the dialog closes\n  // without one, treat it as denied. decidedRef must reset on every fresh open\n  // so a rapid close-then-open doesn't carry state forward.\n  const decidedRef = useRef(false);\n  function handleDecide(decision: PermissionDecision) {\n    decidedRef.current = true;\n    onDecide(decision);\n  }\n  function handleOpenChange(next: boolean) {\n    const wasDecided = decidedRef.current;\n    // Reset BEFORE invoking onDecide so a re-open within the same tick starts\n    // clean. Edge case from SF-6: rapid toggle could leave decidedRef=true.\n    decidedRef.current = false;\n    if (!next && !wasDecided) {\n      onDecide(\"denied\");\n    }\n    onOpenChange(next);\n  }\n\n  const defaultTitle = (\n    <span className=\"flex items-center gap-2\">\n      <ShieldAlert className=\"size-5 text-warning\" aria-hidden=\"true\" />\n      Allow Theo to {opsList} files in{\" \"}\n      <code className=\"rounded-md bg-muted px-1.5 py-0.5 font-mono text-code-md text-primary\">\n        {request.path}\n      </code>\n      ?\n    </span>\n  );\n\n  const defaultDescription = (\n    <>\n      This includes all files and subfolders. Theo will be able to {opsList} and may share the\n      contents with connected third-party tools. Be careful when exposing confidential information.\n    </>\n  );\n\n  return (\n    <Dialog open={open} onOpenChange={handleOpenChange}>\n      <Dialog.Content className=\"max-w-xl\">\n        <Dialog.Header>\n          <Dialog.Title>{title ?? defaultTitle}</Dialog.Title>\n          <Dialog.Description>{description ?? defaultDescription}</Dialog.Description>\n        </Dialog.Header>\n        <Dialog.Body>\n          <div className=\"flex items-start gap-3 rounded-md border border-border/40 bg-muted/40 p-3\">\n            <FolderOpen\n              className=\"mt-0.5 size-4 shrink-0 text-muted-foreground\"\n              aria-hidden=\"true\"\n            />\n            <div className=\"grid gap-1\">\n              <p className=\"font-mono text-code-sm text-foreground\">{request.path}</p>\n              <p className=\"flex items-center gap-1.5 font-sans text-label text-warning\">\n                <AlertTriangle className=\"size-3\" aria-hidden=\"true\" />\n                {text.requestedOps} {opsList}\n              </p>\n            </div>\n          </div>\n        </Dialog.Body>\n        <Dialog.Footer>\n          <Button variant=\"secondary\" onClick={() => handleDecide(\"denied\")}>\n            {text.cancel}\n          </Button>\n          <Button variant=\"ghost\" onClick={() => handleDecide(\"always_allowed\")}>\n            {text.always}\n          </Button>\n          <Button onClick={() => handleDecide(\"allowed_once\")}>{text.allow}</Button>\n        </Dialog.Footer>\n      </Dialog.Content>\n    </Dialog>\n  );\n}\n\nexport { PermissionModal };\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-R63ZKLQM.js

@@ -0,0 +1,45 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var TIER_CLASS = {
+  free: "bg-muted/40 border-muted-foreground/20 text-muted-foreground",
+  hobby: "bg-warning/10 border-warning/30 text-warning",
+  pro: "bg-primary/10 border-primary/30 text-primary",
+  team: "bg-success/10 border-success/30 text-success",
+  enterprise: "bg-foreground/5 border-foreground/20 text-foreground"
+};
+var SIZE_CLASS = {
+  sm: "px-1.5 py-0 text-label-caps",
+  md: "px-2 py-0.5 text-label"
+};
+function defaultLabel(plan) {
+  return plan.charAt(0).toUpperCase() + plan.slice(1);
+}
+var PlanBadge = forwardRef(
+  ({ className, plan, label, size = "md", ...props }, ref) => {
+    const tierClass = TIER_CLASS[plan] ?? TIER_CLASS.free;
+    const displayLabel = label ?? defaultLabel(plan);
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        ref,
+        className: cn(
+          "inline-flex items-center rounded-md border",
+          "font-mono uppercase tabular-nums tracking-wider",
+          tierClass,
+          SIZE_CLASS[size],
+          className
+        ),
+        "data-plan": plan,
+        ...props,
+        children: displayLabel
+      }
+    );
+  }
+);
+PlanBadge.displayName = "PlanBadge";
+
+export { PlanBadge };
+//# sourceMappingURL=chunk-R63ZKLQM.js.map
+//# sourceMappingURL=chunk-R63ZKLQM.js.map

package/dist/chunk-R63ZKLQM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/plan-badge/plan-badge.tsx"],"names":[],"mappings":";;;;AAuCA,IAAM,UAAA,GAAuC;AAAA,EAC3C,IAAA,EAAM,8DAAA;AAAA,EACN,KAAA,EAAO,8CAAA;AAAA,EACP,GAAA,EAAK,8CAAA;AAAA,EACL,IAAA,EAAM,8CAAA;AAAA,EACN,UAAA,EAAY;AACd,CAAA;AAEA,IAAM,UAAA,GAAa;AAAA,EACjB,EAAA,EAAI,6BAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEA,SAAS,aAAa,IAAA,EAAwB;AAC5C,EAAA,OAAO,IAAA,CAAK,OAAO,CAAC,CAAA,CAAE,aAAY,GAAI,IAAA,CAAK,MAAM,CAAC,CAAA;AACpD;AAEA,IAAM,SAAA,GAAY,UAAA;AAAA,EAChB,CAAC,EAAE,SAAA,EAAW,IAAA,EAAM,KAAA,EAAO,OAAO,IAAA,EAAM,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAG1D,IAAA,MAAM,SAAA,GAAY,UAAA,CAAW,IAAI,CAAA,IAAK,UAAA,CAAW,IAAA;AACjD,IAAA,MAAM,YAAA,GAAe,KAAA,IAAS,YAAA,CAAa,IAAI,CAAA;AAC/C,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,4CAAA;AAAA,UACA,iDAAA;AAAA,UACA,SAAA;AAAA,UACA,WAAW,IAAI,CAAA;AAAA,UACf;AAAA,SACF;AAAA,QACA,WAAA,EAAW,IAAA;AAAA,QACV,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AACA,SAAA,CAAU,WAAA,GAAc,WAAA","file":"chunk-R63ZKLQM.js","sourcesContent":["import { forwardRef } from \"react\";\nimport type { HTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * PlanBadge — semantic pricing-tier badge.\n *\n * Five canonical tiers (`free` / `hobby` / `pro` / `team` / `enterprise`) with\n * distinct color tokens. Consumers self-document intent with `plan=\"hobby\"`\n * instead of mapping a generic `<Badge variant=\"outline\">` to colors per app.\n * Future rebrand / dark-mode tweaks propagate automatically — no consumer\n * code change.\n *\n * Visual spec (per `theo/docs/handoff/2026-05-23-theo-ui-cloud-dashboard-gaps-brief.md`):\n *\n *   | tier         | bg                  | border                   | text                  |\n *   |--------------|---------------------|--------------------------|-----------------------|\n *   | free         | bg-muted/40         | border-muted-foreground/20 | text-muted-foreground |\n *   | hobby        | bg-warning/10       | border-warning/30        | text-warning          |\n *   | pro          | bg-primary/10       | border-primary/30        | text-primary          |\n *   | team         | bg-success/10       | border-success/30        | text-success          |\n *   | enterprise   | bg-foreground/5     | border-foreground/20     | text-foreground       |\n *\n * Default label capitalizes the tier (`hobby → \"Hobby\"`, `enterprise → \"Enterprise\"`).\n *\n * Used by `<AccountMenu>` inline with the user name; usable standalone.\n */\n\nexport type PlanTier = \"free\" | \"hobby\" | \"pro\" | \"team\" | \"enterprise\";\n\nexport interface PlanBadgeProps extends HTMLAttributes<HTMLSpanElement> {\n  /** Plan tier identifier. */\n  plan: PlanTier;\n  /** Override the display label. Defaults to the capitalized tier name. */\n  label?: string;\n  /** Size variant. */\n  size?: \"sm\" | \"md\";\n}\n\nconst TIER_CLASS: Record<PlanTier, string> = {\n  free: \"bg-muted/40 border-muted-foreground/20 text-muted-foreground\",\n  hobby: \"bg-warning/10 border-warning/30 text-warning\",\n  pro: \"bg-primary/10 border-primary/30 text-primary\",\n  team: \"bg-success/10 border-success/30 text-success\",\n  enterprise: \"bg-foreground/5 border-foreground/20 text-foreground\",\n};\n\nconst SIZE_CLASS = {\n  sm: \"px-1.5 py-0 text-label-caps\",\n  md: \"px-2 py-0.5 text-label\",\n} as const;\n\nfunction defaultLabel(plan: PlanTier): string {\n  return plan.charAt(0).toUpperCase() + plan.slice(1);\n}\n\nconst PlanBadge = forwardRef<HTMLSpanElement, PlanBadgeProps>(\n  ({ className, plan, label, size = \"md\", ...props }, ref) => {\n    // Runtime fallback for unknown tier (TypeScript prevents this at compile\n    // time; the guard handles consumers casting an arbitrary string).\n    const tierClass = TIER_CLASS[plan] ?? TIER_CLASS.free;\n    const displayLabel = label ?? defaultLabel(plan);\n    return (\n      <span\n        ref={ref}\n        className={cn(\n          \"inline-flex items-center rounded-md border\",\n          \"font-mono uppercase tabular-nums tracking-wider\",\n          tierClass,\n          SIZE_CLASS[size],\n          className,\n        )}\n        data-plan={plan}\n        {...props}\n      >\n        {displayLabel}\n      </span>\n    );\n  },\n);\nPlanBadge.displayName = \"PlanBadge\";\n\nexport { PlanBadge };\n"]}

package/dist/chunk-RTYYJPPE.js

@@ -0,0 +1,77 @@
+import { cn } from './chunk-ZSRJCIWF.js';
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
+import { ChevronDown, Sparkles, Check } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ModelSelector = forwardRef(
+  ({ className, value, options, onChange, ...props }, ref) => {
+    const current = options.find((o) => o.id === value) ?? options[0];
+    return /* @__PURE__ */ jsxs(DropdownMenu.Root, { children: [
+      /* @__PURE__ */ jsx(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+        "button",
+        {
+          ref,
+          type: "button",
+          className: cn(
+            "inline-flex h-8 items-center gap-2 rounded-full border border-border/60 bg-card px-3",
+            "font-medium font-sans text-body-sm text-foreground",
+            "transition-colors duration-base ease-out-soft",
+            "hover:bg-muted",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+            className
+          ),
+          ...props,
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "size-1.5 rounded-full bg-primary", "aria-hidden": "true" }),
+            current?.label ?? "Select model",
+            /* @__PURE__ */ jsx(ChevronDown, { className: "size-3 text-muted-foreground", "aria-hidden": "true" })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsx(DropdownMenu.Portal, { children: /* @__PURE__ */ jsx(
+        DropdownMenu.Content,
+        {
+          sideOffset: 6,
+          align: "end",
+          className: cn(
+            "z-50 min-w-[14rem] overflow-hidden rounded-lg border bg-popover p-1 text-popover-foreground shadow-md",
+            "data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:animate-in",
+            "data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out"
+          ),
+          children: options.map((opt) => /* @__PURE__ */ jsxs(
+            DropdownMenu.Item,
+            {
+              onSelect: () => onChange?.(opt.id),
+              className: cn(
+                "flex cursor-pointer items-center justify-between gap-3 rounded-md px-2 py-2",
+                "text-body-sm",
+                "focus:bg-muted focus:outline-none",
+                "data-[highlighted]:bg-muted"
+              ),
+              children: [
+                /* @__PURE__ */ jsxs("span", { className: "flex flex-col", children: [
+                  /* @__PURE__ */ jsx("span", { className: "font-medium", children: opt.label }),
+                  opt.vendor ? /* @__PURE__ */ jsx("span", { className: "font-mono text-label text-muted-foreground", children: opt.vendor }) : null
+                ] }),
+                /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
+                  opt.tag ? /* @__PURE__ */ jsxs("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: [
+                    opt.tag === "smart" ? /* @__PURE__ */ jsx(Sparkles, { className: "size-3" }) : null,
+                    opt.tag
+                  ] }) : null,
+                  opt.id === value ? /* @__PURE__ */ jsx(Check, { className: "size-3.5 text-primary" }) : null
+                ] })
+              ]
+            },
+            opt.id
+          ))
+        }
+      ) })
+    ] });
+  }
+);
+ModelSelector.displayName = "ModelSelector";
+
+export { ModelSelector };
+//# sourceMappingURL=chunk-RTYYJPPE.js.map
+//# sourceMappingURL=chunk-RTYYJPPE.js.map

package/dist/chunk-RTYYJPPE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/model-selector/model-selector.tsx"],"names":[],"mappings":"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","file":"chunk-RTYYJPPE.js","sourcesContent":["import * as DropdownMenu from \"@radix-ui/react-dropdown-menu\";\nimport { Check, ChevronDown, Sparkles } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { ButtonHTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\nexport interface ModelOption {\n  id: string;\n  label: string;\n  /** Optional vendor hint shown small below the label. */\n  vendor?: string;\n  /** Optional tag e.g. \"default\", \"fast\", \"smart\". */\n  tag?: string;\n}\n\ninterface ModelSelectorProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"onChange\"> {\n  value: string;\n  options: ModelOption[];\n  onChange?: (id: string) => void;\n}\n\n/**\n * ModelSelector — chip dropdown for picking the active LLM.\n *\n * Visual: pill with violet dot + label + chevron. Dropdown uses Radix Menu.\n */\nconst ModelSelector = forwardRef<HTMLButtonElement, ModelSelectorProps>(\n  ({ className, value, options, onChange, ...props }, ref) => {\n    const current = options.find((o) => o.id === value) ?? options[0];\n    return (\n      <DropdownMenu.Root>\n        <DropdownMenu.Trigger asChild>\n          <button\n            ref={ref}\n            type=\"button\"\n            className={cn(\n              \"inline-flex h-8 items-center gap-2 rounded-full border border-border/60 bg-card px-3\",\n              \"font-medium font-sans text-body-sm text-foreground\",\n              \"transition-colors duration-base ease-out-soft\",\n              \"hover:bg-muted\",\n              \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n              className,\n            )}\n            {...props}\n          >\n            <span className=\"size-1.5 rounded-full bg-primary\" aria-hidden=\"true\" />\n            {current?.label ?? \"Select model\"}\n            <ChevronDown className=\"size-3 text-muted-foreground\" aria-hidden=\"true\" />\n          </button>\n        </DropdownMenu.Trigger>\n        <DropdownMenu.Portal>\n          <DropdownMenu.Content\n            sideOffset={6}\n            align=\"end\"\n            className={cn(\n              \"z-50 min-w-[14rem] overflow-hidden rounded-lg border bg-popover p-1 text-popover-foreground shadow-md\",\n              \"data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:animate-in\",\n              \"data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out\",\n            )}\n          >\n            {options.map((opt) => (\n              <DropdownMenu.Item\n                key={opt.id}\n                onSelect={() => onChange?.(opt.id)}\n                className={cn(\n                  \"flex cursor-pointer items-center justify-between gap-3 rounded-md px-2 py-2\",\n                  \"text-body-sm\",\n                  \"focus:bg-muted focus:outline-none\",\n                  \"data-[highlighted]:bg-muted\",\n                )}\n              >\n                <span className=\"flex flex-col\">\n                  <span className=\"font-medium\">{opt.label}</span>\n                  {opt.vendor ? (\n                    <span className=\"font-mono text-label text-muted-foreground\">{opt.vendor}</span>\n                  ) : null}\n                </span>\n                <span className=\"flex items-center gap-2\">\n                  {opt.tag ? (\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                      {opt.tag === \"smart\" ? <Sparkles className=\"size-3\" /> : null}\n                      {opt.tag}\n                    </span>\n                  ) : null}\n                  {opt.id === value ? <Check className=\"size-3.5 text-primary\" /> : null}\n                </span>\n              </DropdownMenu.Item>\n            ))}\n          </DropdownMenu.Content>\n        </DropdownMenu.Portal>\n      </DropdownMenu.Root>\n    );\n  },\n);\nModelSelector.displayName = \"ModelSelector\";\n\nexport { ModelSelector };\n"]}