@ai-matrx/design-system 0.4.2 → 0.5.0

package/dist/index.cjs

@@ -31,13 +31,28 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
+  Avatar: () => Avatar,
+  AvatarFallback: () => AvatarFallback,
+  AvatarImage: () => AvatarImage,
   Badge: () => Badge,
   BasicInput: () => BasicInput,
+  BasicTextarea: () => BasicTextarea,
   BottomSheet: () => BottomSheet,
   BottomSheetBody: () => BottomSheetBody,
   BottomSheetFooter: () => BottomSheetFooter,
   BottomSheetHeader: () => BottomSheetHeader,
   Button: () => Button,
+  Card: () => Card,
+  CardAction: () => CardAction,
+  CardContent: () => CardContent,
+  CardDescription: () => CardDescription,
+  CardFooter: () => CardFooter,
+  CardHeader: () => CardHeader,
+  CardTitle: () => CardTitle,
+  Checkbox: () => Checkbox,
+  Collapsible: () => Collapsible,
+  CollapsibleContent: () => CollapsibleContent2,
+  CollapsibleTrigger: () => CollapsibleTrigger2,
   Command: () => Command,
   CommandDialog: () => CommandDialog,
   CommandEmpty: () => CommandEmpty,
@@ -47,21 +62,66 @@ __export(src_exports, {
   CommandList: () => CommandList,
   CommandSeparator: () => CommandSeparator,
   CommandShortcut: () => CommandShortcut,
+  ContextMenu: () => ContextMenu,
+  ContextMenuCheckboxItem: () => ContextMenuCheckboxItem,
+  ContextMenuContent: () => ContextMenuContent,
+  ContextMenuGroup: () => ContextMenuGroup,
+  ContextMenuItem: () => ContextMenuItem,
+  ContextMenuLabel: () => ContextMenuLabel,
+  ContextMenuPortal: () => ContextMenuPortal,
+  ContextMenuRadioGroup: () => ContextMenuRadioGroup,
+  ContextMenuRadioItem: () => ContextMenuRadioItem,
+  ContextMenuSeparator: () => ContextMenuSeparator,
+  ContextMenuShortcut: () => ContextMenuShortcut,
+  ContextMenuSub: () => ContextMenuSub,
+  ContextMenuSubContent: () => ContextMenuSubContent,
+  ContextMenuSubTrigger: () => ContextMenuSubTrigger,
+  ContextMenuTrigger: () => ContextMenuTrigger,
   CreatablePicker: () => CreatablePicker,
   DEFAULT_SCORE_THRESHOLDS: () => DEFAULT_SCORE_THRESHOLDS,
+  Dialog: () => Dialog,
+  DialogClose: () => DialogClose,
+  DialogContent: () => DialogContent,
+  DialogContentPrimitive: () => DialogContentPrimitive,
+  DialogDescription: () => DialogDescription,
+  DialogFooter: () => DialogFooter,
+  DialogHeader: () => DialogHeader,
+  DialogOverlay: () => DialogOverlay,
+  DialogPortal: () => DialogPortal,
+  DialogTitle: () => DialogTitle,
+  DialogTrigger: () => DialogTrigger,
+  DropdownMenu: () => DropdownMenu,
+  DropdownMenuCheckboxItem: () => DropdownMenuCheckboxItem,
+  DropdownMenuContent: () => DropdownMenuContent,
+  DropdownMenuGroup: () => DropdownMenuGroup,
+  DropdownMenuItem: () => DropdownMenuItem,
+  DropdownMenuLabel: () => DropdownMenuLabel,
+  DropdownMenuPortal: () => DropdownMenuPortal,
+  DropdownMenuRadioGroup: () => DropdownMenuRadioGroup,
+  DropdownMenuRadioItem: () => DropdownMenuRadioItem,
+  DropdownMenuSeparator: () => DropdownMenuSeparator,
+  DropdownMenuShortcut: () => DropdownMenuShortcut,
+  DropdownMenuSub: () => DropdownMenuSub,
+  DropdownMenuSubContent: () => DropdownMenuSubContent,
+  DropdownMenuSubTrigger: () => DropdownMenuSubTrigger,
+  DropdownMenuTrigger: () => DropdownMenuTrigger,
   EditableLabel: () => EditableLabel,
   EnterInput: () => EnterInput,
   Input: () => Input,
   InputWithPrefix: () => InputWithPrefix,
-  Label: () => Label,
+  Label: () => Label3,
+  MOBILE_BREAKPOINT: () => MOBILE_BREAKPOINT,
   OverflowToolbar: () => OverflowToolbar,
   Popover: () => Popover,
   PopoverAnchor: () => PopoverAnchor,
   PopoverContent: () => PopoverContent,
   PopoverTrigger: () => PopoverTrigger,
   PortalContainerProvider: () => PortalContainerProvider,
+  Progress: () => Progress,
   RadixDialogModalProvider: () => RadixDialogModalProvider,
   ScoreRing: () => ScoreRing,
+  ScrollArea: () => ScrollArea,
+  ScrollBar: () => ScrollBar,
   SegmentedControl: () => SegmentedControl,
   Select: () => Select,
   SelectContent: () => SelectContent,
@@ -73,7 +133,7 @@ __export(src_exports, {
   SelectSeparator: () => SelectSeparator,
   SelectTrigger: () => SelectTrigger,
   SelectValue: () => SelectValue,
-  Separator: () => Separator2,
+  Separator: () => Separator4,
   Sheet: () => Sheet,
   SheetClose: () => SheetClose,
   SheetContent: () => SheetContent,
@@ -85,7 +145,23 @@ __export(src_exports, {
   SheetTitle: () => SheetTitle,
   SheetTrigger: () => SheetTrigger,
   Skeleton: () => Skeleton,
+  Switch: () => Switch,
   TabbedBottomSheet: () => TabbedBottomSheet,
+  Table: () => Table,
+  TableBody: () => TableBody,
+  TableCaption: () => TableCaption,
+  TableCell: () => TableCell,
+  TableFooter: () => TableFooter,
+  TableHead: () => TableHead,
+  TableHeader: () => TableHeader,
+  TableRow: () => TableRow,
+  Tabs: () => Tabs,
+  TabsContent: () => TabsContent,
+  TabsList: () => TabsList,
+  TabsTrigger: () => TabsTrigger,
+  TabsTriggerCore: () => TabsTriggerCore,
+  Textarea: () => Textarea,
+  TextareaWithPrefix: () => TextareaWithPrefix,
   badgeVariants: () => badgeVariants,
   buttonVariants: () => buttonVariants,
   cn: () => cn,
@@ -93,9 +169,13 @@ __export(src_exports, {
   scoreRingColorClasses: () => scoreRingColorClasses,
   selectTriggerVariants: () => selectTriggerVariants,
   sheetVariants: () => sheetVariants,
+  useCardSize: () => useCardSize,
+  useDialogContainer: () => useDialogContainer,
+  useIsMobile: () => useIsMobile,
   usePortalContainer: () => usePortalContainer,
   useRadixDialogModal: () => useRadixDialogModal,
-  useScrollFade: () => useScrollFade
+  useScrollFade: () => useScrollFade,
+  useTableSize: () => useTableSize
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -239,6 +319,37 @@ function CheckIcon(props) {
     }
   ) });
 }
+function DividerHorizontalIcon(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { ...radixProps(props), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "path",
+    {
+      d: "M2 7.5C2 7.22386 2.22386 7 2.5 7H12.5C12.7761 7 13 7.22386 13 7.5C13 7.77614 12.7761 8 12.5 8H2.5C2.22386 8 2 7.77614 2 7.5Z",
+      fill: "currentColor",
+      fillRule: "evenodd",
+      clipRule: "evenodd"
+    }
+  ) });
+}
+function DotFilledIcon(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { ...radixProps(props), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "path",
+    {
+      d: "M9.875 7.5C9.875 8.81168 8.81168 9.875 7.5 9.875C6.18832 9.875 5.125 8.81168 5.125 7.5C5.125 6.18832 6.18832 5.125 7.5 5.125C8.81168 5.125 9.875 6.18832 9.875 7.5Z",
+      fill: "currentColor"
+    }
+  ) });
+}
+function RadixChevronRightIcon(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { ...radixProps(props), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "path",
+    {
+      d: "M6.1584 3.13508C6.35985 2.94621 6.67627 2.95642 6.86514 3.15788L10.6151 7.15788C10.7954 7.3502 10.7954 7.64949 10.6151 7.84182L6.86514 11.8418C6.67627 12.0433 6.35985 12.0535 6.1584 11.8646C5.95694 11.6757 5.94673 11.3593 6.1356 11.1579L9.565 7.49985L6.1356 3.84182C5.94673 3.64036 5.95694 3.32394 6.1584 3.13508Z",
+      fill: "currentColor",
+      fillRule: "evenodd",
+      clipRule: "evenodd"
+    }
+  ) });
+}
 function RadixChevronDownIcon(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { ...radixProps(props), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     "path",
@@ -461,50 +572,237 @@ var Button = React3.forwardRef(
 );
 Button.displayName = "Button";
 
+// src/avatar.tsx
+var AvatarPrimitive = __toESM(require("@radix-ui/react-avatar"), 1);
+var React4 = __toESM(require("react"), 1);
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var AVATAR_SIZES = {
+  sm: "h-8 w-8 text-[11px]",
+  md: "h-9 w-9 text-xs",
+  lg: "h-10 w-10 text-sm"
+};
+var Avatar = React4.forwardRef(({ className, size = "lg", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  AvatarPrimitive.Root,
+  {
+    ref,
+    "data-slot": "avatar",
+    className: cn(
+      "relative flex shrink-0 overflow-hidden rounded-full",
+      AVATAR_SIZES[size],
+      className
+    ),
+    ...props
+  }
+));
+Avatar.displayName = AvatarPrimitive.Root.displayName;
+var AvatarImage = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  AvatarPrimitive.Image,
+  {
+    ref,
+    "data-slot": "avatar-image",
+    className: cn("aspect-square h-full w-full", className),
+    ...props
+  }
+));
+AvatarImage.displayName = AvatarPrimitive.Image.displayName;
+var AvatarFallback = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  AvatarPrimitive.Fallback,
+  {
+    ref,
+    "data-slot": "avatar-fallback",
+    className: cn(
+      "flex h-full w-full items-center justify-center rounded-full bg-muted font-medium text-muted-foreground",
+      className
+    ),
+    ...props
+  }
+));
+AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
+
+// src/card.tsx
+var React5 = __toESM(require("react"), 1);
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var CARD_SIZES = {
+  sm: {
+    root: "rounded-xl border bg-card text-card-foreground shadow",
+    pad: "p-2",
+    padTopless: "p-2 pt-0"
+  },
+  md: {
+    root: "rounded-lg border bg-card text-card-foreground shadow-sm",
+    pad: "p-4",
+    padTopless: "p-4 pt-0"
+  },
+  lg: {
+    root: "rounded-lg border bg-card text-card-foreground shadow-sm",
+    pad: "p-6",
+    padTopless: "p-6 pt-0"
+  }
+};
+var CardSizeContext = React5.createContext("md");
+function useCardSize() {
+  return React5.useContext(CardSizeContext);
+}
+var Card = React5.forwardRef(
+  ({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardSizeContext.Provider, { value: size, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "div",
+    {
+      ref,
+      "data-slot": "card",
+      "data-size": size,
+      className: cn(CARD_SIZES[size].root, className),
+      ...props
+    }
+  ) })
+);
+Card.displayName = "Card";
+var CardHeader = React5.forwardRef(({ className, ...props }, ref) => {
+  const size = useCardSize();
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "div",
+    {
+      ref,
+      "data-slot": "card-header",
+      className: cn(
+        "flex flex-col space-y-1.5 rounded-t-[inherit]",
+        CARD_SIZES[size].pad,
+        className
+      ),
+      ...props
+    }
+  );
+});
+CardHeader.displayName = "CardHeader";
+var CardTitle = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  "h3",
+  {
+    ref,
+    "data-slot": "card-title",
+    className: cn("font-semibold leading-none tracking-tight", className),
+    ...props
+  }
+));
+CardTitle.displayName = "CardTitle";
+var CardDescription = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  "p",
+  {
+    ref,
+    "data-slot": "card-description",
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+CardDescription.displayName = "CardDescription";
+var CardAction = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  "div",
+  {
+    ref,
+    "data-slot": "card-action",
+    className: cn("ml-auto self-start", className),
+    ...props
+  }
+));
+CardAction.displayName = "CardAction";
+var CardContent = React5.forwardRef(({ className, ...props }, ref) => {
+  const size = useCardSize();
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "div",
+    {
+      ref,
+      "data-slot": "card-content",
+      className: cn(CARD_SIZES[size].padTopless, className),
+      ...props
+    }
+  );
+});
+CardContent.displayName = "CardContent";
+var CardFooter = React5.forwardRef(({ className, ...props }, ref) => {
+  const size = useCardSize();
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "div",
+    {
+      ref,
+      "data-slot": "card-footer",
+      className: cn(
+        "flex items-center rounded-b-[inherit]",
+        CARD_SIZES[size].padTopless,
+        className
+      ),
+      ...props
+    }
+  );
+});
+CardFooter.displayName = "CardFooter";
+
+// src/checkbox.tsx
+var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"), 1);
+var React6 = __toESM(require("react"), 1);
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var CHECKBOX_SIZES = {
+  sm: { root: "h-3.5 w-3.5 rounded-xs", glyph: "h-3 w-3" },
+  md: { root: "h-4 w-4 rounded-sm", glyph: "h-3.5 w-3.5" }
+};
+var Checkbox = React6.forwardRef(({ className, size = "sm", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  CheckboxPrimitive.Root,
+  {
+    ref,
+    "data-slot": "checkbox",
+    className: cn(
+      "peer shrink-0 cursor-pointer border border-primary shadow focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground data-[state=indeterminate]:bg-primary data-[state=indeterminate]:text-primary-foreground",
+      CHECKBOX_SIZES[size].root,
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      CheckboxPrimitive.Indicator,
+      {
+        "data-slot": "checkbox-indicator",
+        className: "flex items-center justify-center text-current",
+        children: props.checked === "indeterminate" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(DividerHorizontalIcon, { className: CHECKBOX_SIZES[size].glyph }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CheckIcon, { className: CHECKBOX_SIZES[size].glyph })
+      }
+    )
+  }
+));
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+
+// src/collapsible.tsx
+var CollapsiblePrimitive = __toESM(require("@radix-ui/react-collapsible"), 1);
+var Collapsible = CollapsiblePrimitive.Root;
+var CollapsibleTrigger2 = CollapsiblePrimitive.CollapsibleTrigger;
+var CollapsibleContent2 = CollapsiblePrimitive.CollapsibleContent;
+
 // src/command.tsx
 var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
 var import_cmdk = require("cmdk");
-var React5 = __toESM(require("react"), 1);
+var React9 = __toESM(require("react"), 1);
 
 // src/portal-container.tsx
-var React4 = __toESM(require("react"), 1);
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var PortalContainerContext = React4.createContext(
+var React7 = __toESM(require("react"), 1);
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var PortalContainerContext = React7.createContext(
   void 0
 );
 function PortalContainerProvider({
   container,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(PortalContainerContext.Provider, { value: container ?? void 0, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(PortalContainerContext.Provider, { value: container ?? void 0, children });
 }
 function usePortalContainer(explicit) {
-  const injected = React4.useContext(PortalContainerContext);
+  const injected = React7.useContext(PortalContainerContext);
   if (explicit !== void 0) {
     return explicit ?? void 0;
   }
   return injected ?? void 0;
 }
 
-// src/command.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var Command = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-  import_cmdk.Command,
-  {
-    ref,
-    className: cn(
-      "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
-      className
-    ),
-    ...props
-  }
-));
-Command.displayName = import_cmdk.Command.displayName;
+// src/use-is-mobile.ts
+var React8 = __toESM(require("react"), 1);
 var MOBILE_BREAKPOINT = 768;
 function useIsMobile() {
-  const [isMobile, setIsMobile] = React5.useState(false);
-  const [hasMounted, setHasMounted] = React5.useState(false);
-  React5.useEffect(() => {
+  const [isMobile, setIsMobile] = React8.useState(false);
+  const [hasMounted, setHasMounted] = React8.useState(false);
+  React8.useEffect(() => {
     setHasMounted(true);
     const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
     const onChange = () => {
@@ -519,21 +817,36 @@ function useIsMobile() {
   }
   return isMobile;
 }
+
+// src/command.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var Command = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  import_cmdk.Command,
+  {
+    ref,
+    className: cn(
+      "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
+      className
+    ),
+    ...props
+  }
+));
+Command.displayName = import_cmdk.Command.displayName;
 var DIALOG_DESKTOP_CLASSES = "fixed left-[50%] top-[50%] z-[10000] grid min-w-0 w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 overflow-x-clip border bg-background p-6 shadow-lg [overflow-wrap:anywhere] [&>*]:min-w-0 [&>*]:max-w-full duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg";
 var DIALOG_MOBILE_SHEET_CLASSES = "fixed inset-x-0 bottom-0 left-0 right-0 top-auto z-[10000] flex min-w-0 flex-col w-full max-w-full max-h-[90dvh] translate-x-0 translate-y-0 gap-4 overflow-x-clip border-t bg-background p-4 pb-safe shadow-lg [overflow-wrap:anywhere] [&>*]:min-w-0 [&>*]:max-w-full duration-200 rounded-t-2xl rounded-b-none overflow-y-auto overscroll-contain data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom";
 var DIALOG_MOBILE_SHEET_OVERRIDE = "inset-x-0 bottom-0 left-0 right-0 top-auto translate-x-0 translate-y-0 w-full max-w-full max-h-[90dvh] rounded-b-none rounded-t-2xl overflow-y-auto";
-var CommandDialogContent = React5.forwardRef(({ className, children, container, ...props }, ref) => {
+var CommandDialogContent = React9.forwardRef(({ className, children, container, ...props }, ref) => {
   const isMobile = useIsMobile();
   const isModal = useRadixDialogModal();
   const portalContainer = usePortalContainer(container);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(DialogPrimitive.Portal, { container: portalContainer, children: [
-    isModal ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(DialogPrimitive.Portal, { container: portalContainer, children: [
+    isModal ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
       DialogPrimitive.Overlay,
       {
         className: "fixed inset-0 z-[10000] bg-[var(--matrx-overlay-scrim-soft)] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
       }
     ) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
       DialogPrimitive.Content,
       {
         ref,
@@ -548,9 +861,9 @@ var CommandDialogContent = React5.forwardRef(({ className, children, container,
         ...props,
         children: [
           children,
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(DialogPrimitive.Close, { className: "absolute right-2 top-4 flex h-10 w-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground sm:right-4", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(XIcon, { className: "h-4 w-4" }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "sr-only", children: "Close" })
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(DialogPrimitive.Close, { className: "absolute right-2 top-4 flex h-10 w-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground sm:right-4", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(XIcon, { className: "h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "sr-only", children: "Close" })
           ] })
         ]
       }
@@ -564,21 +877,21 @@ var CommandDialog = ({
   ...props
 }) => {
   const modal = props.modal ?? true;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(DialogPrimitive.Root, { ...props, modal, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogPrimitive.Root, { ...props, modal, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
     CommandDialogContent,
     {
       className: "overflow-hidden p-0",
       ...container !== void 0 ? { container } : {},
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(DialogPrimitive.Title, { className: "sr-only" }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Command, { className: "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children })
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogPrimitive.Title, { className: "sr-only" }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Command, { className: "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children })
       ]
     }
   ) }) });
 };
-var CommandInput = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
-  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+var CommandInput = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
+  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
     import_cmdk.Command.Input,
     {
       ref,
@@ -591,7 +904,7 @@ var CommandInput = React5.forwardRef(({ className, ...props }, ref) => /* @__PUR
   )
 ] }));
 CommandInput.displayName = import_cmdk.Command.Input.displayName;
-var CommandList = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+var CommandList = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
   import_cmdk.Command.List,
   {
     ref,
@@ -600,7 +913,7 @@ var CommandList = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 CommandList.displayName = import_cmdk.Command.List.displayName;
-var CommandEmpty = React5.forwardRef((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+var CommandEmpty = React9.forwardRef((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
   import_cmdk.Command.Empty,
   {
     ref,
@@ -609,7 +922,7 @@ var CommandEmpty = React5.forwardRef((props, ref) => /* @__PURE__ */ (0, import_
   }
 ));
 CommandEmpty.displayName = import_cmdk.Command.Empty.displayName;
-var CommandGroup = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+var CommandGroup = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
   import_cmdk.Command.Group,
   {
     ref,
@@ -621,7 +934,7 @@ var CommandGroup = React5.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 CommandGroup.displayName = import_cmdk.Command.Group.displayName;
-var CommandSeparator = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+var CommandSeparator = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
   import_cmdk.Command.Separator,
   {
     ref,
@@ -630,7 +943,7 @@ var CommandSeparator = React5.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 CommandSeparator.displayName = import_cmdk.Command.Separator.displayName;
-var CommandItem = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+var CommandItem = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
   import_cmdk.Command.Item,
   {
     ref,
@@ -646,7 +959,7 @@ var CommandShortcut = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
     "span",
     {
       className: cn(
@@ -659,20 +972,155 @@ var CommandShortcut = ({
 };
 CommandShortcut.displayName = "CommandShortcut";
 
+// src/context-menu.tsx
+var ContextMenuPrimitive = __toESM(require("@radix-ui/react-context-menu"), 1);
+var React10 = __toESM(require("react"), 1);
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var ContextMenu = ContextMenuPrimitive.Root;
+var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
+var ContextMenuGroup = ContextMenuPrimitive.Group;
+var ContextMenuPortal = ContextMenuPrimitive.Portal;
+var ContextMenuSub = ContextMenuPrimitive.Sub;
+var ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
+var SURFACE_CLASS = "z-50 min-w-[8rem] max-h-[var(--radix-context-menu-content-available-height)] overflow-y-auto overflow-x-hidden overscroll-contain rounded-md border bg-popover p-1 text-popover-foreground";
+var MOTION_CLASS = "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2";
+var ITEM_CLASS = "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
+var INDICATOR_ITEM_CLASS = "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
+var ContextMenuSubTrigger = React10.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+  ContextMenuPrimitive.SubTrigger,
+  {
+    ref,
+    "data-slot": "context-menu-sub-trigger",
+    className: cn(
+      "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",
+      inset && "pl-8",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(RadixChevronRightIcon, { className: "ml-auto h-4 w-4" })
+    ]
+  }
+));
+ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
+var ContextMenuSubContent = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  ContextMenuPrimitive.SubContent,
+  {
+    ref,
+    "data-slot": "context-menu-sub-content",
+    className: cn(SURFACE_CLASS, "shadow-lg", MOTION_CLASS, className),
+    ...props
+  }
+));
+ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
+var ContextMenuContent = React10.forwardRef(({ className, container, ...props }, ref) => {
+  const portalContainer = usePortalContainer(container);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ContextMenuPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    ContextMenuPrimitive.Content,
+    {
+      ref,
+      "data-slot": "context-menu-content",
+      className: cn(SURFACE_CLASS, "shadow-md", MOTION_CLASS, className),
+      ...props
+    }
+  ) });
+});
+ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
+var ContextMenuItem = React10.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  ContextMenuPrimitive.Item,
+  {
+    ref,
+    "data-slot": "context-menu-item",
+    className: cn(
+      ITEM_CLASS,
+      "gap-2 [&>svg]:size-4 [&>svg]:shrink-0",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
+var ContextMenuCheckboxItem = React10.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+  ContextMenuPrimitive.CheckboxItem,
+  {
+    ref,
+    "data-slot": "context-menu-checkbox-item",
+    className: cn(INDICATOR_ITEM_CLASS, className),
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CheckIcon, { className: "h-4 w-4" }) }) }),
+      children
+    ]
+  }
+));
+ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
+var ContextMenuRadioItem = React10.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+  ContextMenuPrimitive.RadioItem,
+  {
+    ref,
+    "data-slot": "context-menu-radio-item",
+    className: cn(INDICATOR_ITEM_CLASS, className),
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DotFilledIcon, { className: "h-4 w-4 fill-current" }) }) }),
+      children
+    ]
+  }
+));
+ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
+var ContextMenuLabel = React10.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  ContextMenuPrimitive.Label,
+  {
+    ref,
+    "data-slot": "context-menu-label",
+    className: cn(
+      "px-2 py-1.5 text-sm font-semibold text-foreground",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
+var ContextMenuSeparator = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  ContextMenuPrimitive.Separator,
+  {
+    ref,
+    "data-slot": "context-menu-separator",
+    className: cn("-mx-1 my-1 h-px bg-border", className),
+    ...props
+  }
+));
+ContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName;
+var ContextMenuShortcut = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  "span",
+  {
+    "data-slot": "context-menu-shortcut",
+    className: cn("ml-auto text-xs tracking-widest text-muted-foreground", className),
+    ...props
+  }
+);
+ContextMenuShortcut.displayName = "ContextMenuShortcut";
+
 // src/creatable-picker.tsx
 var import_react = require("react");
 
 // src/popover.tsx
 var PopoverPrimitive = __toESM(require("@radix-ui/react-popover"), 1);
-var React6 = __toESM(require("react"), 1);
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var React11 = __toESM(require("react"), 1);
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var Popover = PopoverPrimitive.Root;
 var PopoverTrigger = PopoverPrimitive.Trigger;
 var PopoverAnchor = PopoverPrimitive.Anchor;
-var PopoverContent = React6.forwardRef(
+var PopoverContent = React11.forwardRef(
   ({ className, align = "center", sideOffset = 4, container, ...props }, ref) => {
     const portalContainer = usePortalContainer(container);
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(PopoverPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(PopoverPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       PopoverPrimitive.Content,
       {
         ref,
@@ -696,7 +1144,7 @@ var PopoverContent = React6.forwardRef(
 PopoverContent.displayName = PopoverPrimitive.Content.displayName;
 
 // src/creatable-picker.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 function article(noun) {
   return /^[aeiou]/i.test(noun.trim()) ? `an ${noun}` : `a ${noun}`;
 }
@@ -771,8 +1219,8 @@ function CreatablePicker({
       setBusy(false);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Popover, { open, onOpenChange: (next) => next ? setOpen(true) : close(), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(PopoverTrigger, { asChild: true, disabled, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(Popover, { open, onOpenChange: (next) => next ? setOpen(true) : close(), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PopoverTrigger, { asChild: true, disabled, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
       "button",
       {
         type: "button",
@@ -786,12 +1234,12 @@ function CreatablePicker({
           triggerClassName
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "min-w-0 flex-1 truncate", children: selected ? renderSelected ?? selected.render ?? selected.label : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-muted-foreground", children: loading ? "Loading\u2026" : placeholder }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ChevronsUpDownIcon, { className: "size-3.5 shrink-0 opacity-50" })
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "min-w-0 flex-1 truncate", children: selected ? renderSelected ?? selected.render ?? selected.label : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-muted-foreground", children: loading ? "Loading\u2026" : placeholder }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ChevronsUpDownIcon, { className: "size-3.5 shrink-0 opacity-50" })
         ]
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(PopoverContent, { align: "start", className: "w-[--radix-popover-trigger-width] min-w-56 p-0", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PopoverContent, { align: "start", className: "w-[--radix-popover-trigger-width] min-w-56 p-0", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
       Command,
       {
         filter: (itemValue, search, keywords) => {
@@ -799,7 +1247,7 @@ function CreatablePicker({
           return haystack.includes(search.toLowerCase()) ? 1 : 0;
         },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
             CommandInput,
             {
               ref: inputRef,
@@ -811,13 +1259,13 @@ function CreatablePicker({
               placeholder: searchPlaceholder ?? `Search or add ${article(noun)}\u2026`
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(CommandList, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CommandEmpty, { children: emptyLabel }),
-            groups.map((group) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(CommandList, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CommandEmpty, { children: emptyLabel }),
+            groups.map((group) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
               CommandGroup,
               {
                 ...group.heading === void 0 ? {} : { heading: group.heading },
-                children: group.options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+                children: group.options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
                   CommandItem,
                   {
                     value: option.label,
@@ -828,7 +1276,7 @@ function CreatablePicker({
                     },
                     className: "gap-2 text-xs",
                     children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+                      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
                         LucideCheckIcon,
                         {
                           className: cn(
@@ -837,8 +1285,8 @@ function CreatablePicker({
                           )
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "min-w-0 flex-1 truncate", children: option.render ?? option.label }),
-                      option.hint ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "shrink-0 text-[10px] text-muted-foreground", children: option.hint }) : null
+                      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "min-w-0 flex-1 truncate", children: option.render ?? option.label }),
+                      option.hint ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "shrink-0 text-[10px] text-muted-foreground", children: option.hint }) : null
                     ]
                   },
                   option.value
@@ -847,9 +1295,9 @@ function CreatablePicker({
               group.heading ?? "__ungrouped__"
             ))
           ] }),
-          canCreate ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "space-y-1 border-t border-border p-1", children: [
-            createExtra && typed && !exactMatch ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "px-1 pt-0.5", children: typeof createExtra === "function" ? createExtra(typed) : createExtra }) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+          canCreate ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "space-y-1 border-t border-border p-1", children: [
+            createExtra && typed && !exactMatch ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "px-1 pt-0.5", children: typeof createExtra === "function" ? createExtra(typed) : createExtra }) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
               "button",
               {
                 type: "button",
@@ -857,22 +1305,22 @@ function CreatablePicker({
                 onClick: () => void create(typed),
                 className: "flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-xs text-muted-foreground transition-colors hover:bg-accent hover:text-foreground disabled:opacity-50",
                 children: [
-                  busy ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Loader2Icon, { className: "size-3.5 shrink-0 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(PlusIcon, { className: "size-3.5 shrink-0" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "min-w-0 truncate", children: typed && !exactMatch ? `Create \u201C${typed}\u201D` : `Add ${article(noun)}\u2026` })
+                  busy ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Loader2Icon, { className: "size-3.5 shrink-0 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PlusIcon, { className: "size-3.5 shrink-0" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "min-w-0 truncate", children: typed && !exactMatch ? `Create \u201C${typed}\u201D` : `Add ${article(noun)}\u2026` })
                 ]
               }
             ),
-            needsName ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("p", { className: "px-2 pb-0.5 text-[11px] leading-snug text-muted-foreground", children: [
+            needsName ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("p", { className: "px-2 pb-0.5 text-[11px] leading-snug text-muted-foreground", children: [
               "Type the name of the ",
               noun,
               " you want to add \u2014 then this creates it."
             ] }) : null
           ] }) : null,
-          footerActions?.length || manageAction ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "space-y-0.5 border-t border-border p-1", children: [
+          footerActions?.length || manageAction ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "space-y-0.5 border-t border-border p-1", children: [
             footerActions?.map((action) => {
               const Icon2 = action.icon;
-              return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+              return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
                   "button",
                   {
                     type: "button",
@@ -882,15 +1330,15 @@ function CreatablePicker({
                     },
                     className: "flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-xs text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
                     children: [
-                      Icon2 ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Icon2, { className: "size-3.5 shrink-0" }) : null,
-                      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "min-w-0 truncate", children: action.label })
+                      Icon2 ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Icon2, { className: "size-3.5 shrink-0" }) : null,
+                      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "min-w-0 truncate", children: action.label })
                     ]
                   }
                 ),
-                action.note ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "px-2 pb-1 text-[10px] leading-snug text-muted-foreground", children: action.note }) : null
+                action.note ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "px-2 pb-1 text-[10px] leading-snug text-muted-foreground", children: action.note }) : null
               ] }, action.label);
             }),
-            manageAction ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+            manageAction ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
               "a",
               {
                 href: manageAction.href,
@@ -899,18 +1347,18 @@ function CreatablePicker({
                 onClick: close,
                 className: "flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-xs text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ExternalLinkIcon, { className: "size-3.5 shrink-0" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "min-w-0 truncate", children: manageAction.label })
+                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ExternalLinkIcon, { className: "size-3.5 shrink-0" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "min-w-0 truncate", children: manageAction.label })
                 ]
               }
             ) : null
           ] }) : null,
-          lockedNote ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "space-y-1 border-t border-border p-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("p", { className: "flex gap-1.5 text-[11px] leading-snug text-muted-foreground", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(LockIcon, { className: "mt-px size-3 shrink-0" }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: lockedNote })
+          lockedNote ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "space-y-1 border-t border-border p-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("p", { className: "flex gap-1.5 text-[11px] leading-snug text-muted-foreground", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(LockIcon, { className: "mt-px size-3 shrink-0" }),
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: lockedNote })
             ] }),
-            lockedAction ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+            lockedAction ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
               "button",
               {
                 type: "button",
@@ -920,8 +1368,8 @@ function CreatablePicker({
                 },
                 className: "flex w-full items-center gap-2 rounded-sm px-1 py-1 text-left text-xs font-medium text-primary transition-colors hover:bg-accent",
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(PlusIcon, { className: "size-3.5 shrink-0" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "min-w-0 truncate", children: lockedAction.label })
+                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PlusIcon, { className: "size-3.5 shrink-0" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "min-w-0 truncate", children: lockedAction.label })
                 ]
               }
             ) : null
@@ -932,9 +1380,326 @@ function CreatablePicker({
   ] });
 }
 
+// src/dialog.tsx
+var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"), 1);
+var VisuallyHidden2 = __toESM(require("@radix-ui/react-visually-hidden"), 1);
+var import_react_tree = require("@ai-matrx/kit/react-tree");
+var React12 = __toESM(require("react"), 1);
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var Dialog = ({
+  children,
+  ...props
+}) => {
+  const modal = props.modal ?? true;
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DialogPrimitive2.Root, { ...props, modal, children }) });
+};
+Dialog.displayName = "Dialog";
+var DialogTrigger = DialogPrimitive2.Trigger;
+var DialogClose = DialogPrimitive2.Close;
+var DialogPortal = ({
+  container,
+  ...props
+}) => {
+  const resolved = usePortalContainer(container);
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DialogPrimitive2.Portal, { container: resolved ?? null, ...props });
+};
+DialogPortal.displayName = "DialogPortal";
+var DialogContainerContext = React12.createContext(null);
+var useDialogContainer = () => React12.useContext(DialogContainerContext);
+var DialogOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  DialogPrimitive2.Overlay,
+  {
+    ref,
+    "data-slot": "dialog-overlay",
+    className: cn(
+      // Page context behind the modal stays readable; separation comes from a
+      // light token scrim, not a blur.
+      "fixed inset-0 z-[10000] bg-[var(--matrx-overlay-scrim-soft)] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      className
+    ),
+    ...props
+  }
+));
+DialogOverlay.displayName = DialogPrimitive2.Overlay.displayName;
+var DialogContentPrimitive = React12.forwardRef((props, ref) => {
+  const isModal = useRadixDialogModal();
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    DialogPrimitive2.Content,
+    {
+      ...props,
+      ref,
+      "aria-modal": isModal || void 0
+    }
+  );
+});
+DialogContentPrimitive.displayName = "DialogContentPrimitive";
+var DIALOG_DESKTOP_CLASSES2 = "fixed left-[50%] top-[50%] z-[10000] grid min-w-0 w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 max-h-[85dvh] overflow-y-auto overscroll-contain [--dialog-pad:1.5rem] overflow-x-clip border bg-background p-6 shadow-lg [overflow-wrap:anywhere] [&>*]:min-w-0 [&>*]:max-w-full duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg";
+var DIALOG_MOBILE_SHEET_CLASSES2 = "matrx-mobile-sheet fixed inset-x-0 bottom-0 left-0 right-0 top-auto z-[10000] flex min-w-0 flex-col w-full max-w-full max-h-[90dvh] translate-x-0 translate-y-0 gap-4 [--dialog-pad:1rem] overflow-x-clip border-t bg-background p-4 pb-safe shadow-lg [overflow-wrap:anywhere] [&>*]:min-w-0 [&>*]:max-w-full duration-200 rounded-t-2xl rounded-b-none overflow-y-auto overscroll-contain data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom";
+var DIALOG_MOBILE_SHEET_OVERRIDE2 = "inset-x-0 bottom-0 left-0 right-0 top-auto translate-x-0 translate-y-0 w-full max-w-full max-h-[90dvh] rounded-b-none rounded-t-2xl overflow-y-auto";
+var DialogContent = React12.forwardRef(
+  ({
+    className,
+    children,
+    mobileSheet = true,
+    showCloseButton = true,
+    container,
+    ...props
+  }, ref) => {
+    const isMobile = useIsMobile();
+    const isModal = useRadixDialogModal();
+    const injectedContainer = usePortalContainer(container);
+    const asSheet = mobileSheet && isMobile;
+    const [containerEl, setContainerEl] = React12.useState(
+      null
+    );
+    const mergedRef = React12.useCallback(
+      (node) => {
+        setContainerEl(node);
+        if (typeof ref === "function") ref(node);
+        else if (ref)
+          ref.current = node;
+      },
+      [ref]
+    );
+    const hasTitle = (0, import_react_tree.treeContainsComponent)(children, DialogTitle) || (0, import_react_tree.treeContainsComponent)(children, DialogPrimitive2.Title);
+    const hasDescription = (0, import_react_tree.treeContainsComponent)(children, DialogDescription) || (0, import_react_tree.treeContainsComponent)(children, DialogPrimitive2.Description);
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(DialogPortal, { container, children: [
+      isModal ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DialogOverlay, {}) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+        DialogContentPrimitive,
+        {
+          ref: mergedRef,
+          "data-slot": "dialog-content",
+          className: cn(
+            asSheet ? DIALOG_MOBILE_SHEET_CLASSES2 : DIALOG_DESKTOP_CLASSES2,
+            className,
+            asSheet && DIALOG_MOBILE_SHEET_OVERRIDE2,
+            // A non-modal dialog is the coexistence contract for content that
+            // can sit beside a host's floating window manager (which starts at
+            // z=1000); staying below that boundary makes a newly focused window
+            // usable without coupling the two systems.
+            !isModal && "z-[900]"
+          ),
+          ...hasDescription ? {} : { "aria-describedby": void 0 },
+          ...props,
+          children: [
+            hasTitle ? null : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(VisuallyHidden2.Root, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DialogPrimitive2.Title, { children: "Dialog" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DialogContainerContext.Provider, { value: containerEl, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+              PortalContainerProvider,
+              {
+                container: containerEl ?? injectedContainer ?? null,
+                children
+              }
+            ) }),
+            showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+              DialogPrimitive2.Close,
+              {
+                "data-slot": "dialog-close",
+                "aria-label": "Close",
+                className: "absolute right-2 top-4 flex h-11 w-11 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground sm:right-4 lg:h-10 lg:w-10",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(XIcon, { className: "h-4 w-4" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "sr-only", children: "Close" })
+                ]
+              }
+            ) : null
+          ]
+        }
+      )
+    ] });
+  }
+);
+DialogContent.displayName = DialogPrimitive2.Content.displayName;
+var DialogHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  "div",
+  {
+    "data-slot": "dialog-header",
+    className: cn(
+      // DialogContent owns an absolute close control. Reserve its hit area in
+      // every header so trailing actions never render underneath it.
+      "flex flex-col space-y-1.5 pr-12 text-center sm:text-left",
+      className
+    ),
+    ...props
+  }
+);
+DialogHeader.displayName = "DialogHeader";
+var DialogFooter = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  "div",
+  {
+    "data-slot": "dialog-footer",
+    className: cn(
+      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      "sticky bottom-0 z-10 bg-background pt-3",
+      "mx-[calc(var(--dialog-pad,0px)*-1)] mb-[calc(var(--dialog-pad,0px)*-1)] px-[var(--dialog-pad,0px)] pb-[var(--dialog-pad,0px)]",
+      className
+    ),
+    ...props
+  }
+);
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  DialogPrimitive2.Title,
+  {
+    ref,
+    "data-slot": "dialog-title",
+    className: cn("text-lg font-semibold leading-none tracking-tight", className),
+    ...props
+  }
+));
+DialogTitle.displayName = DialogPrimitive2.Title.displayName;
+var DialogDescription = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  DialogPrimitive2.Description,
+  {
+    ref,
+    "data-slot": "dialog-description",
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+DialogDescription.displayName = DialogPrimitive2.Description.displayName;
+
+// src/dropdown-menu.tsx
+var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
+var React13 = __toESM(require("react"), 1);
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var DropdownMenu = DropdownMenuPrimitive.Root;
+var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+var DropdownMenuGroup = DropdownMenuPrimitive.Group;
+var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
+var DropdownMenuSub = DropdownMenuPrimitive.Sub;
+var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
+var MENU_SURFACE_CLASS = "z-[10001] min-w-[8rem] max-h-[var(--radix-dropdown-menu-content-available-height)] overflow-y-auto overflow-x-hidden overscroll-contain rounded-md border bg-popover p-1 text-popover-foreground";
+var MENU_MOTION_CLASS = "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2";
+var MENU_ITEM_CLASS = "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
+var MENU_INDICATOR_ITEM_CLASS = "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
+var DropdownMenuSubTrigger = React13.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  DropdownMenuPrimitive.SubTrigger,
+  {
+    ref,
+    "data-slot": "dropdown-menu-sub-trigger",
+    className: cn(
+      "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
+      inset && "pl-8",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(RadixChevronRightIcon, { className: "ml-auto h-4 w-4" })
+    ]
+  }
+));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
+var DropdownMenuSubContent = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  DropdownMenuPrimitive.SubContent,
+  {
+    ref,
+    "data-slot": "dropdown-menu-sub-content",
+    className: cn(MENU_SURFACE_CLASS, "shadow-lg", MENU_MOTION_CLASS, className),
+    ...props
+  }
+));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
+var DropdownMenuContent = React13.forwardRef(({ className, sideOffset = 4, container, ...props }, ref) => {
+  const portalContainer = usePortalContainer(container);
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DropdownMenuPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    DropdownMenuPrimitive.Content,
+    {
+      ref,
+      "data-slot": "dropdown-menu-content",
+      sideOffset,
+      className: cn(
+        MENU_SURFACE_CLASS,
+        "shadow-md",
+        MENU_MOTION_CLASS,
+        className
+      ),
+      ...props
+    }
+  ) });
+});
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+var DropdownMenuItem = React13.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  DropdownMenuPrimitive.Item,
+  {
+    ref,
+    "data-slot": "dropdown-menu-item",
+    className: cn(MENU_ITEM_CLASS, inset && "pl-8", className),
+    ...props
+  }
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+var DropdownMenuCheckboxItem = React13.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  DropdownMenuPrimitive.CheckboxItem,
+  {
+    ref,
+    "data-slot": "dropdown-menu-checkbox-item",
+    className: cn(MENU_INDICATOR_ITEM_CLASS, className),
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(CheckIcon, { className: "h-4 w-4" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
+var DropdownMenuRadioItem = React13.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  DropdownMenuPrimitive.RadioItem,
+  {
+    ref,
+    "data-slot": "dropdown-menu-radio-item",
+    className: cn(MENU_INDICATOR_ITEM_CLASS, className),
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DotFilledIcon, { className: "h-4 w-4 fill-current" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
+var DropdownMenuLabel = React13.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  DropdownMenuPrimitive.Label,
+  {
+    ref,
+    "data-slot": "dropdown-menu-label",
+    className: cn("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className),
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+var DropdownMenuSeparator = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  DropdownMenuPrimitive.Separator,
+  {
+    ref,
+    "data-slot": "dropdown-menu-separator",
+    className: cn("-mx-1 my-1 h-px bg-muted", className),
+    ...props
+  }
+));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+var DropdownMenuShortcut = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  "span",
+  {
+    "data-slot": "dropdown-menu-shortcut",
+    className: cn("ml-auto text-xs tracking-widest opacity-60", className),
+    ...props
+  }
+);
+DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
+
 // src/editable-label.tsx
 var import_react2 = require("react");
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function EditableLabel({
   value,
   onCommit,
@@ -1041,8 +1806,8 @@ function EditableLabel({
     setEditing
   ]);
   if (editing) {
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("span", { className: cn("relative flex min-w-0 flex-1 items-center", className), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("span", { className: cn("relative flex min-w-0 flex-1 items-center", className), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
         "input",
         {
           ref: inputRef,
@@ -1082,12 +1847,12 @@ function EditableLabel({
           )
         }
       ),
-      busy && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Loader2Icon, { className: "absolute right-1 h-3.5 w-3.5 animate-spin text-muted-foreground" }),
-      error && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "absolute left-0 top-full mt-0.5 whitespace-nowrap text-xs text-destructive", children: error })
+      busy && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Loader2Icon, { className: "absolute right-1 h-3.5 w-3.5 animate-spin text-muted-foreground" }),
+      error && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "absolute left-0 top-full mt-0.5 whitespace-nowrap text-xs text-destructive", children: error })
     ] });
   }
   if (controlled) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     "button",
     {
       type: "button",
@@ -1121,11 +1886,11 @@ function EditableLabel({
 }
 
 // src/input.tsx
-var React7 = __toESM(require("react"), 1);
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var React14 = __toESM(require("react"), 1);
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var getVariantStyles = (variant = "default") => {
   const baseStyles = `flex h-10 w-full border border-border bg-background text-foreground shadow-input rounded-md px-3 py-2 text-sm file:border-0 file:bg-transparent
-    file:text-sm file:font-medium placeholder:text-muted-foreground
+    file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground
     focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-ring
     disabled:cursor-not-allowed disabled:opacity-50
     dark:shadow-none
@@ -1150,9 +1915,9 @@ var getVariantStyles = (variant = "default") => {
       return baseStyles;
   }
 };
-var Input = React7.forwardRef(
+var Input = React14.forwardRef(
   ({ className, type, variant = "default", ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       "input",
       {
         type,
@@ -1164,7 +1929,7 @@ var Input = React7.forwardRef(
   }
 );
 Input.displayName = "Input";
-var EnterInput = React7.forwardRef(
+var EnterInput = React14.forwardRef(
   ({ onEnter, ...props }, ref) => {
     const handleKeyDown = (e) => {
       if (e.key === "Enter" && onEnter) {
@@ -1172,7 +1937,7 @@ var EnterInput = React7.forwardRef(
         onEnter();
       }
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       Input,
       {
         ...props,
@@ -1188,16 +1953,16 @@ var EnterInput = React7.forwardRef(
   }
 );
 EnterInput.displayName = "EnterInput";
-var BasicInput = React7.forwardRef(
+var BasicInput = React14.forwardRef(
   // `variant` is accepted (prop-compatible with Input) but intentionally
   // unused — and destructured so it never leaks onto the DOM element.
   ({ className, type, variant: _variant = "default", ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       "input",
       {
         type,
         className: cn(
-          "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+          "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
           className
         ),
         ref,
@@ -1207,10 +1972,10 @@ var BasicInput = React7.forwardRef(
   }
 );
 BasicInput.displayName = "BasicInput";
-var InputWithPrefix = React7.forwardRef(({ prefix, className, wrapperClassName, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: cn("relative", wrapperClassName), children: [
-    prefix && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground", children: prefix }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+var InputWithPrefix = React14.forwardRef(({ prefix, className, wrapperClassName, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: cn("relative", wrapperClassName), children: [
+    prefix && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground", children: prefix }),
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       Input,
       {
         ref,
@@ -1224,9 +1989,9 @@ InputWithPrefix.displayName = "InputWithPrefix";
 
 // src/label.tsx
 var LabelPrimitive = __toESM(require("@radix-ui/react-label"), 1);
-var React8 = __toESM(require("react"), 1);
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var Label = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+var React15 = __toESM(require("react"), 1);
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var Label3 = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
   LabelPrimitive.Root,
   {
     ref,
@@ -1237,11 +2002,11 @@ var Label = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
     ...props
   }
 ));
-Label.displayName = LabelPrimitive.Root.displayName;
+Label3.displayName = LabelPrimitive.Root.displayName;
 
 // src/overflow-toolbar.tsx
 var import_react3 = require("react");
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var GAP_PX = 6;
 var TONE = {
   default: "border border-border bg-background hover:bg-accent text-foreground",
@@ -1263,16 +2028,16 @@ function ToolbarButton({
     action.hideLabel && !action.running ? "w-7 justify-center px-0" : "px-2",
     TONE[tone]
   );
-  const inner = /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  const inner = /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       Icon2,
       {
         className: cn("w-3.5 h-3.5 shrink-0", action.running && "animate-spin")
       }
     ),
-    showLabel && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: text })
+    showLabel && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { children: text })
   ] });
-  const control = action.href && !action.disabled ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  const control = action.href && !action.disabled ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     "a",
     {
       href: action.href,
@@ -1282,7 +2047,7 @@ function ToolbarButton({
       "aria-label": action.label,
       children: inner
     }
-  ) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  ) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     "button",
     {
       type: "button",
@@ -1294,12 +2059,12 @@ function ToolbarButton({
     }
   );
   if (enableTooltip && action.hideLabel && renderTooltip) {
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_jsx_runtime13.Fragment, { children: renderTooltip(control, action.label) });
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_jsx_runtime19.Fragment, { children: renderTooltip(control, action.label) });
   }
   return control;
 }
 function OverflowTrigger({ ariaLabel }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     "button",
     {
       type: "button",
@@ -1310,7 +2075,7 @@ function OverflowTrigger({ ariaLabel }) {
         "inline-flex items-center justify-center h-7 w-7 rounded-md transition-colors",
         "border border-border bg-background hover:bg-accent text-foreground"
       ),
-      children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MoreHorizontalIcon, { className: "w-3.5 h-3.5" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(MoreHorizontalIcon, { className: "w-3.5 h-3.5" })
     }
   );
 }
@@ -1370,22 +2135,22 @@ function OverflowToolbar({
   }, [signature, leading != null]);
   const shown = visibleActions.slice(0, visibleCount);
   const hidden = visibleActions.slice(visibleCount);
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { ref: containerRef, className: cn("relative min-w-0", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { ref: containerRef, className: cn("relative min-w-0", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
       "div",
       {
         ref: ghostRef,
         "aria-hidden": true,
         className: "pointer-events-none absolute left-0 top-0 flex items-center gap-1.5 opacity-0",
         children: [
-          visibleActions.map((a) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ToolbarButton, { action: a }, a.id)),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(OverflowTrigger, { ariaLabel: overflowAriaLabel })
+          visibleActions.map((a) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ToolbarButton, { action: a }, a.id)),
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(OverflowTrigger, { ariaLabel: overflowAriaLabel })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-center justify-end gap-1.5", children: [
-      leading != null && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { ref: leadingRef, className: "shrink-0", children: leading }),
-      shown.map((a) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center justify-end gap-1.5", children: [
+      leading != null && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { ref: leadingRef, className: "shrink-0", children: leading }),
+      shown.map((a) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         ToolbarButton,
         {
           action: a,
@@ -1396,14 +2161,118 @@ function OverflowToolbar({
       )),
       hidden.length > 0 && renderOverflowMenu({
         actions: hidden,
-        trigger: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(OverflowTrigger, { ariaLabel: overflowAriaLabel })
+        trigger: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(OverflowTrigger, { ariaLabel: overflowAriaLabel })
       })
     ] })
   ] });
 }
 
+// src/progress.tsx
+var ProgressPrimitive = __toESM(require("@radix-ui/react-progress"), 1);
+var React17 = __toESM(require("react"), 1);
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var PROGRESS_TONES = {
+  default: "bg-primary",
+  success: "bg-success",
+  warning: "bg-warning",
+  destructive: "bg-destructive"
+};
+var Progress = React17.forwardRef(({ className, tone = "default", indicatorClassName, ...props }, ref) => {
+  const { value, max } = props;
+  const ceiling = max ?? 100;
+  const isIndeterminate = value === null || value === void 0;
+  const pct = isIndeterminate ? 0 : Math.min(100, Math.max(0, value / ceiling * 100));
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    ProgressPrimitive.Root,
+    {
+      ref,
+      "data-slot": "progress",
+      className: cn(
+        "relative h-2 w-full overflow-hidden rounded-full bg-primary/20",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        ProgressPrimitive.Indicator,
+        {
+          "data-slot": "progress-indicator",
+          className: cn(
+            "h-full w-full flex-1 transition-all",
+            PROGRESS_TONES[tone],
+            isIndeterminate && "matrx-progress-indeterminate",
+            indicatorClassName
+          ),
+          style: isIndeterminate ? void 0 : { transform: `translateX(-${100 - pct}%)` }
+        }
+      )
+    }
+  );
+});
+Progress.displayName = ProgressPrimitive.Root.displayName;
+
+// src/scroll-area.tsx
+var ScrollAreaPrimitive = __toESM(require("@radix-ui/react-scroll-area"), 1);
+var React18 = __toESM(require("react"), 1);
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var ScrollArea = React18.forwardRef(
+  ({
+    className,
+    children,
+    viewportClassName,
+    viewportRef,
+    scrollBarClassName,
+    orientation = "vertical",
+    ...props
+  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+    ScrollAreaPrimitive.Root,
+    {
+      ref,
+      "data-slot": "scroll-area",
+      className: cn("relative overflow-hidden", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+          ScrollAreaPrimitive.Viewport,
+          {
+            ref: viewportRef,
+            "data-slot": "scroll-area-viewport",
+            className: cn("h-full w-full rounded-[inherit]", viewportClassName),
+            children
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ScrollBar, { orientation, className: scrollBarClassName }),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ScrollAreaPrimitive.Corner, {})
+      ]
+    }
+  )
+);
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+var ScrollBar = React18.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  ScrollAreaPrimitive.ScrollAreaScrollbar,
+  {
+    ref,
+    "data-slot": "scroll-area-scrollbar",
+    orientation,
+    className: cn(
+      "flex touch-none select-none transition-colors",
+      orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]",
+      orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      ScrollAreaPrimitive.ScrollAreaThumb,
+      {
+        "data-slot": "scroll-area-thumb",
+        className: "relative flex-1 rounded-full bg-border"
+      }
+    )
+  }
+));
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
+
 // src/score-ring.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var DEFAULT_SCORE_THRESHOLDS = {
   good: 75,
   warning: 50
@@ -1434,7 +2303,7 @@ function ScoreRing({
   const circumference = 2 * Math.PI * radius;
   const boundedPct = pct === null ? 0 : Math.max(0, Math.min(100, pct));
   const dashOffset = circumference * (1 - boundedPct / 100);
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     "div",
     {
       className: cn(
@@ -1445,8 +2314,8 @@ function ScoreRing({
       role: "img",
       "aria-label": `${label ?? "Score"}: ${pct === null ? "not available" : `${pct} out of 100`}`,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("svg", { viewBox: "0 0 100 100", className: "h-full w-full -rotate-90", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("svg", { viewBox: "0 0 100 100", className: "h-full w-full -rotate-90", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             "circle",
             {
               cx: "50",
@@ -1457,7 +2326,7 @@ function ScoreRing({
               fill: "none"
             }
           ),
-          pct !== null ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          pct !== null ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             "circle",
             {
               cx: "50",
@@ -1476,8 +2345,8 @@ function ScoreRing({
             }
           ) : null
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "absolute flex flex-col items-center justify-center", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "absolute flex flex-col items-center justify-center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             "span",
             {
               className: cn(
@@ -1487,7 +2356,7 @@ function ScoreRing({
               children: pct === null ? "\u2014" : `${pct}${suffix}`
             }
           ),
-          label ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "max-w-[74px] truncate text-[9px] font-semibold uppercase tracking-wide text-muted-foreground", children: label }) : null
+          label ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "max-w-[74px] truncate text-[9px] font-semibold uppercase tracking-wide text-muted-foreground", children: label }) : null
         ] })
       ]
     }
@@ -1495,7 +2364,7 @@ function ScoreRing({
 }
 
 // src/segmented-control.tsx
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function SegmentedControl({
   value,
   onValueChange,
@@ -1510,7 +2379,7 @@ function SegmentedControl({
     md: "h-9 text-sm",
     lg: "h-10 text-base"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     {
       className: cn(
@@ -1521,7 +2390,7 @@ function SegmentedControl({
       role: "tablist",
       children: data.map((option) => {
         const isActive = value === option.value;
-        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           "button",
           {
             type: "button",
@@ -1548,8 +2417,8 @@ function SegmentedControl({
 // src/select.tsx
 var SelectPrimitive = __toESM(require("@radix-ui/react-select"), 1);
 var import_class_variance_authority3 = require("class-variance-authority");
-var React10 = __toESM(require("react"), 1);
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var React19 = __toESM(require("react"), 1);
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var Select = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
 var SelectValue = SelectPrimitive.Value;
@@ -1568,7 +2437,7 @@ var selectTriggerVariants = (0, import_class_variance_authority3.cva)(
     }
   }
 );
-var SelectTrigger = React10.forwardRef(({ className, children, hideArrow = false, size, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+var SelectTrigger = React19.forwardRef(({ className, children, hideArrow = false, size, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -1576,12 +2445,12 @@ var SelectTrigger = React10.forwardRef(({ className, children, hideArrow = false
     ...props,
     children: [
       children,
-      !hideArrow && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(RadixChevronDownIcon, { className: "h-4 w-4 opacity-50" }) })
+      !hideArrow && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(RadixChevronDownIcon, { className: "h-4 w-4 opacity-50" }) })
     ]
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+var SelectScrollUpButton = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
@@ -1590,11 +2459,11 @@ var SelectScrollUpButton = React10.forwardRef(({ className, ...props }, ref) =>
       className
     ),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(RadixChevronUpIcon, {})
+    children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(RadixChevronUpIcon, {})
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+var SelectScrollDownButton = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
@@ -1603,13 +2472,13 @@ var SelectScrollDownButton = React10.forwardRef(({ className, ...props }, ref) =
       className
     ),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(RadixChevronDownIcon, {})
+    children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(RadixChevronDownIcon, {})
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React10.forwardRef(({ className, children, position = "popper", container, ...props }, ref) => {
+var SelectContent = React19.forwardRef(({ className, children, position = "popper", container, ...props }, ref) => {
   const portalContainer = usePortalContainer(container);
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
     SelectPrimitive.Content,
     {
       ref,
@@ -1621,8 +2490,8 @@ var SelectContent = React10.forwardRef(({ className, children, position = "poppe
       position,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectScrollUpButton, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectScrollUpButton, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           SelectPrimitive.Viewport,
           {
             className: cn(
@@ -1632,13 +2501,13 @@ var SelectContent = React10.forwardRef(({ className, children, position = "poppe
             children
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectScrollDownButton, {})
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectScrollDownButton, {})
       ]
     }
   ) });
 });
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+var SelectLabel = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
   SelectPrimitive.Label,
   {
     ref,
@@ -1647,7 +2516,7 @@ var SelectLabel = React10.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React10.forwardRef(({ className, children, description, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+var SelectItem = React19.forwardRef(({ className, children, description, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
   SelectPrimitive.Item,
   {
     ref,
@@ -1658,14 +2527,14 @@ var SelectItem = React10.forwardRef(({ className, children, description, ...prop
     ),
     ...props,
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CheckIcon, { className: "h-4 w-4" }) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SelectPrimitive.ItemText, { children }),
-      description ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "block text-xs leading-snug text-muted-foreground", children: description }) : null
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckIcon, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SelectPrimitive.ItemText, { children }),
+      description ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "block text-xs leading-snug text-muted-foreground", children: description }) : null
     ]
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+var SelectSeparator = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
   SelectPrimitive.Separator,
   {
     ref,
@@ -1677,9 +2546,9 @@ SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 // src/separator.tsx
 var SeparatorPrimitive = __toESM(require("@radix-ui/react-separator"), 1);
-var React11 = __toESM(require("react"), 1);
-var import_jsx_runtime17 = require("react/jsx-runtime");
-var Separator2 = React11.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+var React20 = __toESM(require("react"), 1);
+var import_jsx_runtime25 = require("react/jsx-runtime");
+var Separator4 = React20.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
   SeparatorPrimitive.Root,
   {
     ref,
@@ -1693,17 +2562,17 @@ var Separator2 = React11.forwardRef(({ className, orientation = "horizontal", de
     ...props
   }
 ));
-Separator2.displayName = SeparatorPrimitive.Root.displayName;
+Separator4.displayName = SeparatorPrimitive.Root.displayName;
 
 // src/sheet.tsx
 var SheetPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
-var import_react_tree = require("@ai-matrx/kit/react-tree");
+var import_react_tree2 = require("@ai-matrx/kit/react-tree");
 var import_class_variance_authority4 = require("class-variance-authority");
-var React12 = __toESM(require("react"), 1);
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var SheetContentBase = React12.forwardRef(({ ...props }, ref) => {
+var React21 = __toESM(require("react"), 1);
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var SheetContentBase = React21.forwardRef(({ ...props }, ref) => {
   const isModal = useRadixDialogModal();
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     SheetPrimitive.Content,
     {
       ...props,
@@ -1713,15 +2582,15 @@ var SheetContentBase = React12.forwardRef(({ ...props }, ref) => {
   );
 });
 SheetContentBase.displayName = "SheetContentBase";
-var Sheet = React12.forwardRef(({ children, ...props }, _ref) => {
+var Sheet = React21.forwardRef(({ children, ...props }, _ref) => {
   const modal = props.modal ?? true;
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SheetPrimitive.Root, { ...props, modal, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SheetPrimitive.Root, { ...props, modal, children }) });
 });
 Sheet.displayName = "Sheet";
 var SheetTrigger = SheetPrimitive.Trigger;
 var SheetClose = SheetPrimitive.Close;
 var SheetPortal = SheetPrimitive.Portal;
-var SheetOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+var SheetOverlay = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
   SheetPrimitive.Overlay,
   {
     className: cn(
@@ -1750,7 +2619,7 @@ var sheetVariants = (0, import_class_variance_authority4.cva)(
     }
   }
 );
-var SheetDescription = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+var SheetDescription = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
   SheetPrimitive.Description,
   {
     ref,
@@ -1759,7 +2628,7 @@ var SheetDescription = React12.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 SheetDescription.displayName = SheetPrimitive.Description.displayName;
-var SheetContent = React12.forwardRef(
+var SheetContent = React21.forwardRef(
   ({
     side = "right",
     className,
@@ -1769,10 +2638,10 @@ var SheetContent = React12.forwardRef(
     overlayClassName,
     ...props
   }, ref) => {
-    const hasDescription = (0, import_react_tree.treeContainsComponent)(children, SheetDescription) || (0, import_react_tree.treeContainsComponent)(children, SheetPrimitive.Description);
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(SheetPortal, { children: [
-      !hideOverlay && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SheetOverlay, { className: overlayClassName }),
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+    const hasDescription = (0, import_react_tree2.treeContainsComponent)(children, SheetDescription) || (0, import_react_tree2.treeContainsComponent)(children, SheetPrimitive.Description);
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(SheetPortal, { children: [
+      !hideOverlay && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SheetOverlay, { className: overlayClassName }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
         SheetContentBase,
         {
           ref,
@@ -1780,9 +2649,9 @@ var SheetContent = React12.forwardRef(
           ...hasDescription ? {} : { "aria-describedby": void 0 },
           ...props,
           children: [
-            !hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Cross2Icon, { className: "h-4 w-4" }),
-              /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "sr-only", children: "Close" })
+            !hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Cross2Icon, { className: "h-4 w-4" }),
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "sr-only", children: "Close" })
             ] }),
             children
           ]
@@ -1795,7 +2664,7 @@ SheetContent.displayName = SheetPrimitive.Content.displayName;
 var SheetHeader = ({
   className,
   ...props
-}) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
   "div",
   {
     className: cn(
@@ -1809,7 +2678,7 @@ SheetHeader.displayName = "SheetHeader";
 var SheetFooter = ({
   className,
   ...props
-}) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
   "div",
   {
     className: cn(
@@ -1820,7 +2689,7 @@ var SheetFooter = ({
   }
 );
 SheetFooter.displayName = "SheetFooter";
-var SheetTitle = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+var SheetTitle = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
   SheetPrimitive.Title,
   {
     ref,
@@ -1831,12 +2700,12 @@ var SheetTitle = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE
 SheetTitle.displayName = SheetPrimitive.Title.displayName;
 
 // src/skeleton.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 function Skeleton({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     "div",
     {
       className: cn("animate-pulse rounded-md bg-primary/10", className),
@@ -1845,9 +2714,48 @@ function Skeleton({
   );
 }
 
+// src/switch.tsx
+var SwitchPrimitives = __toESM(require("@radix-ui/react-switch"), 1);
+var React22 = __toESM(require("react"), 1);
+var import_jsx_runtime28 = require("react/jsx-runtime");
+var SWITCH_SIZES = {
+  sm: {
+    root: "h-4 w-9 border-border data-[state=unchecked]:bg-input",
+    thumb: "h-4 w-4 border border-primary data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
+  },
+  md: {
+    root: "h-5 w-9 border-transparent data-[state=unchecked]:bg-input",
+    thumb: "h-4 w-4 data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
+  }
+};
+var Switch = React22.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  SwitchPrimitives.Root,
+  {
+    ref,
+    "data-slot": "switch",
+    className: cn(
+      "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 shadow-sm 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 data-[state=checked]:bg-primary",
+      SWITCH_SIZES[size].root,
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+      SwitchPrimitives.Thumb,
+      {
+        "data-slot": "switch-thumb",
+        className: cn(
+          "pointer-events-none block rounded-full bg-background shadow-lg ring-0 transition-transform",
+          SWITCH_SIZES[size].thumb
+        )
+      }
+    )
+  }
+));
+Switch.displayName = SwitchPrimitives.Root.displayName;
+
 // src/tabbed-bottom-sheet.tsx
 var import_react4 = require("react");
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 function TabbedBottomSheet({
   open,
   onOpenChange,
@@ -1861,15 +2769,15 @@ function TabbedBottomSheet({
     if (open) setSelectedTabId(null);
   }
   const selectedTab = selectedTabId ? tabs.find((tab) => tab.id === selectedTabId) : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
     BottomSheet,
     {
       open,
       onOpenChange,
       title,
       size: "full",
-      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "matrx-mobile-sheet flex min-h-0 flex-1 flex-col", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "matrx-mobile-sheet flex min-h-0 flex-1 flex-col", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
           BottomSheetHeader,
           {
             title: selectedTab ? selectedTab.label : title,
@@ -1877,19 +2785,19 @@ function TabbedBottomSheet({
             onBack: () => setSelectedTabId(null)
           }
         ),
-        selectedTab ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden pb-safe", children: selectedTab.content }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(BottomSheetBody, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("ul", { className: "divide-y divide-border", children: tabs.map((tab) => {
+        selectedTab ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden pb-safe", children: selectedTab.content }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(BottomSheetBody, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("ul", { className: "divide-y divide-border", children: tabs.map((tab) => {
           const Icon2 = tab.icon;
-          return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+          return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
             "button",
             {
               type: "button",
               onClick: () => setSelectedTabId(tab.id),
               className: "flex w-full items-center gap-3 px-4 py-3.5 text-left transition-colors hover:bg-muted/60 active:bg-muted",
               children: [
-                Icon2 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Icon2, { className: "h-5 w-5 shrink-0 text-muted-foreground" }) : null,
-                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "min-w-0 flex-1 text-base text-foreground", children: tab.label }),
+                Icon2 ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Icon2, { className: "h-5 w-5 shrink-0 text-muted-foreground" }) : null,
+                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "min-w-0 flex-1 text-base text-foreground", children: tab.label }),
                 tab.trailing,
-                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChevronRightIcon, { className: "h-5 w-5 shrink-0 text-muted-foreground" })
+                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(ChevronRightIcon, { className: "h-5 w-5 shrink-0 text-muted-foreground" })
               ]
             }
           ) }, tab.id);
@@ -1899,6 +2807,331 @@ function TabbedBottomSheet({
   );
 }
 
+// src/table.tsx
+var React23 = __toESM(require("react"), 1);
+var import_jsx_runtime30 = require("react/jsx-runtime");
+var TABLE_SIZES = {
+  sm: { head: "px-2", cell: "p-2" },
+  md: { head: "px-3", cell: "p-3" }
+};
+var TableSizeContext = React23.createContext("sm");
+function useTableSize() {
+  return React23.useContext(TableSizeContext);
+}
+var Table = React23.forwardRef(
+  ({ className, size = "sm", wrap = true, wrapperClassName, ...props }, ref) => {
+    const table = /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      "table",
+      {
+        ref,
+        "data-slot": "table",
+        "data-size": size,
+        className: cn("w-full caption-bottom text-sm", className),
+        ...props
+      }
+    );
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(TableSizeContext.Provider, { value: size, children: wrap ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      "div",
+      {
+        "data-slot": "table-wrapper",
+        className: cn("relative w-full overflow-auto", wrapperClassName),
+        children: table
+      }
+    ) : table });
+  }
+);
+Table.displayName = "Table";
+var TableHeader = React23.forwardRef(({ className, sticky = false, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  "thead",
+  {
+    ref,
+    "data-slot": "table-header",
+    className: cn(
+      "[&_tr]:border-b",
+      sticky && "sticky top-0 z-10 bg-background",
+      className
+    ),
+    ...props
+  }
+));
+TableHeader.displayName = "TableHeader";
+var TableBody = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  "tbody",
+  {
+    ref,
+    "data-slot": "table-body",
+    className: cn("[&_tr:last-child]:border-0", className),
+    ...props
+  }
+));
+TableBody.displayName = "TableBody";
+var TableFooter = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  "tfoot",
+  {
+    ref,
+    "data-slot": "table-footer",
+    className: cn(
+      "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
+      className
+    ),
+    ...props
+  }
+));
+TableFooter.displayName = "TableFooter";
+var TableRow = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  "tr",
+  {
+    ref,
+    "data-slot": "table-row",
+    className: cn(
+      "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
+      className
+    ),
+    ...props
+  }
+));
+TableRow.displayName = "TableRow";
+var TableHead = React23.forwardRef(({ className, ...props }, ref) => {
+  const size = useTableSize();
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    "th",
+    {
+      ref,
+      "data-slot": "table-head",
+      className: cn(
+        "h-10 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        TABLE_SIZES[size].head,
+        className
+      ),
+      ...props
+    }
+  );
+});
+TableHead.displayName = "TableHead";
+var TableCell = React23.forwardRef(({ className, ...props }, ref) => {
+  const size = useTableSize();
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    "td",
+    {
+      ref,
+      "data-slot": "table-cell",
+      className: cn(
+        "align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        TABLE_SIZES[size].cell,
+        className
+      ),
+      ...props
+    }
+  );
+});
+TableCell.displayName = "TableCell";
+var TableCaption = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  "caption",
+  {
+    ref,
+    "data-slot": "table-caption",
+    className: cn("mt-4 text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+TableCaption.displayName = "TableCaption";
+
+// src/tabs.tsx
+var TabsPrimitive = __toESM(require("@radix-ui/react-tabs"), 1);
+var React24 = __toESM(require("react"), 1);
+var import_jsx_runtime31 = require("react/jsx-runtime");
+var Tabs = TabsPrimitive.Root;
+var TABS_TRIGGER_BASE = "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm";
+var TabsList = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  TabsPrimitive.List,
+  {
+    ref,
+    "data-slot": "tabs-list",
+    className: cn(
+      "inline-flex h-9 items-center justify-center gap-1 rounded-lg bg-muted p-1 text-muted-foreground",
+      className
+    ),
+    ...props
+  }
+));
+TabsList.displayName = TabsPrimitive.List.displayName;
+var TabsTrigger = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  TabsPrimitive.Trigger,
+  {
+    ref,
+    "data-slot": "tabs-trigger",
+    className: cn(
+      TABS_TRIGGER_BASE,
+      "text-muted-foreground hover:text-foreground",
+      className
+    ),
+    ...props
+  }
+));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+var TabsTriggerCore = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  TabsPrimitive.Trigger,
+  {
+    ref,
+    "data-slot": "tabs-trigger",
+    className: cn(TABS_TRIGGER_BASE, className),
+    ...props
+  }
+));
+TabsTriggerCore.displayName = TabsPrimitive.Trigger.displayName;
+var TabsContent = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  TabsPrimitive.Content,
+  {
+    ref,
+    "data-slot": "tabs-content",
+    className: cn(
+      "data-[state=inactive]:hidden",
+      "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+
+// src/textarea.tsx
+var React25 = __toESM(require("react"), 1);
+var import_jsx_runtime32 = require("react/jsx-runtime");
+var FILL_HEIGHT_REGEX = /(?:^|\s)(h-full|h-dvh|flex-1|grow)(?:\s|$)/;
+var FILL_WIDTH_REGEX = /(?:^|\s)(w-full|w-screen)(?:\s|$)/;
+function getStretchClasses(className) {
+  if (!className) return void 0;
+  const fills = [];
+  if (FILL_HEIGHT_REGEX.test(className)) fills.push("h-full min-h-0");
+  if (FILL_WIDTH_REGEX.test(className)) fills.push("w-full");
+  return fills.length ? fills.join(" ") : void 0;
+}
+var TEXTAREA_ELEVATED_CLASS = "flex h-auto w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground shadow-textarea transition duration-400 placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50";
+var TEXTAREA_CONTROL_CLASS = "flex w-full rounded-md border border-input bg-transparent px-3 py-2 text-sm text-foreground shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50";
+function useAutoGrow(ref, value, autoGrow = false, minHeight, maxHeight) {
+  React25.useEffect(() => {
+    if (!autoGrow || !ref.current) return;
+    const textarea = ref.current;
+    textarea.style.height = "auto";
+    let newHeight = textarea.scrollHeight;
+    if (minHeight) newHeight = Math.max(newHeight, minHeight);
+    if (maxHeight && newHeight >= maxHeight) {
+      textarea.style.height = `${maxHeight}px`;
+      textarea.style.overflowY = "auto";
+    } else {
+      textarea.style.height = `${newHeight}px`;
+      textarea.style.overflowY = "hidden";
+    }
+  }, [value, autoGrow, minHeight, maxHeight, ref]);
+}
+function useMergedTextareaRef(forwarded) {
+  const internal = React25.useRef(null);
+  const callback = React25.useCallback(
+    (node) => {
+      internal.current = node;
+      if (typeof forwarded === "function") forwarded(node);
+      else if (forwarded) forwarded.current = node;
+    },
+    [forwarded]
+  );
+  return { ref: internal, callback };
+}
+function boxStyle(minHeight, maxHeight) {
+  if (minHeight === void 0 && maxHeight === void 0) return void 0;
+  return {
+    minHeight: minHeight ? `${minHeight}px` : void 0,
+    maxHeight: maxHeight ? `${maxHeight}px` : void 0
+  };
+}
+var Textarea = React25.forwardRef(
+  ({ className, autoGrow, minHeight, maxHeight, wrapperClassName, ...props }, forwarded) => {
+    const { ref, callback } = useMergedTextareaRef(forwarded);
+    const stretchClasses = getStretchClasses(className);
+    const needsWrapper = Boolean(wrapperClassName || stretchClasses);
+    useAutoGrow(ref, props.value, autoGrow, minHeight, maxHeight);
+    const textarea = /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      "textarea",
+      {
+        ref: callback,
+        "data-slot": "textarea",
+        className: cn(
+          TEXTAREA_ELEVATED_CLASS,
+          autoGrow && "resize-none",
+          stretchClasses,
+          className
+        ),
+        style: boxStyle(minHeight, maxHeight),
+        ...props
+      }
+    );
+    if (!needsWrapper) return textarea;
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: cn(stretchClasses, wrapperClassName), children: textarea });
+  }
+);
+Textarea.displayName = "Textarea";
+var BasicTextarea = React25.forwardRef(
+  ({ className, autoGrow, minHeight, maxHeight, ...props }, forwarded) => {
+    const { ref, callback } = useMergedTextareaRef(forwarded);
+    useAutoGrow(ref, props.value, autoGrow, minHeight, maxHeight);
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      "textarea",
+      {
+        ref: callback,
+        "data-slot": "textarea",
+        className: cn(
+          TEXTAREA_CONTROL_CLASS,
+          "h-auto min-h-[60px]",
+          autoGrow && "resize-none",
+          className
+        ),
+        style: boxStyle(minHeight, maxHeight),
+        ...props
+      }
+    );
+  }
+);
+BasicTextarea.displayName = "BasicTextarea";
+var TextareaWithPrefix = React25.forwardRef(
+  ({
+    prefix,
+    className,
+    wrapperClassName,
+    autoGrow,
+    minHeight,
+    maxHeight,
+    ...props
+  }, forwarded) => {
+    const { ref, callback } = useMergedTextareaRef(forwarded);
+    useAutoGrow(ref, props.value, autoGrow, minHeight, maxHeight);
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+      "div",
+      {
+        className: cn("relative", getStretchClasses(className), wrapperClassName),
+        children: [
+          prefix ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "pointer-events-none absolute left-3 top-3 z-10 text-muted-foreground", children: prefix }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+            "textarea",
+            {
+              ref: callback,
+              "data-slot": "textarea",
+              className: cn(
+                TEXTAREA_CONTROL_CLASS,
+                "resize-y",
+                prefix && "pl-10",
+                autoGrow && "resize-none",
+                className
+              ),
+              style: boxStyle(minHeight, maxHeight),
+              ...props
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+TextareaWithPrefix.displayName = "TextareaWithPrefix";
+
 // src/use-scroll-fade.ts
 var import_react5 = require("react");
 var EPSILON = 2;