@ai-matrx/design-system 0.41.0 → 0.42.1

package/dist/index.js

@@ -602,8 +602,58 @@ function BottomSheetFooter({
 
 // src/alert.tsx
 import { cva as cva2 } from "class-variance-authority";
+import * as React5 from "react";
+
+// src/error-box.tsx
 import * as React4 from "react";
-import { jsx as jsx7 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+var CONTEXT_KEY = /* @__PURE__ */ Symbol.for("@ai-matrx/design-system/error-actions");
+var registry = globalThis;
+var ErrorActionsContext = registry[CONTEXT_KEY] ?? (registry[CONTEXT_KEY] = React4.createContext(null));
+function ErrorActionsProvider({
+  render,
+  children
+}) {
+  return /* @__PURE__ */ jsx7(ErrorActionsContext.Provider, { value: render, children });
+}
+function useErrorActions() {
+  return React4.useContext(ErrorActionsContext);
+}
+function ErrorActions(props) {
+  const render = useErrorActions();
+  if (!render) return null;
+  return /* @__PURE__ */ jsx7(Fragment, { children: render(props) });
+}
+var ErrorBox = React4.forwardRef(function ErrorBox2({
+  as = "p",
+  message,
+  title,
+  error,
+  operation,
+  records,
+  unsavedInput,
+  origin,
+  children,
+  ...rest
+}, ref) {
+  const Tag = as;
+  const facts = {
+    ...message !== void 0 ? { message } : {},
+    ...title !== void 0 ? { title } : {},
+    ...error !== void 0 ? { error } : {},
+    ...operation !== void 0 ? { operation } : {},
+    ...records !== void 0 ? { records } : {},
+    ...unsavedInput !== void 0 ? { unsavedInput } : {},
+    ...origin !== void 0 ? { origin } : {}
+  };
+  return /* @__PURE__ */ jsxs5(Tag, { ref, role: "alert", "data-error-box": "", ...rest, children: [
+    children ?? message,
+    /* @__PURE__ */ jsx7(ErrorActions, { ...facts })
+  ] });
+});
+
+// src/alert.tsx
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
 var alertVariants = cva2(
   "relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg~*]:pl-7",
   {
@@ -621,8 +671,8 @@ var alertVariants = cva2(
     }
   }
 );
-var Alert = React4.forwardRef(
-  ({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx7(
+var Alert = React5.forwardRef(
+  ({ className, variant, children, errorFacts, ...props }, ref) => /* @__PURE__ */ jsxs6(
     "div",
     {
       ref,
@@ -630,12 +680,16 @@ var Alert = React4.forwardRef(
       "data-slot": "alert",
       "data-variant": variant ?? "default",
       className: cn(alertVariants({ variant }), className),
-      ...props
+      ...props,
+      children: [
+        children,
+        variant === "destructive" ? /* @__PURE__ */ jsx8(ErrorActions, { origin: "design-system/Alert", ...errorFacts }) : null
+      ]
     }
   )
 );
 Alert.displayName = "Alert";
-var AlertTitle = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx7(
+var AlertTitle = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(
   "h5",
   {
     ref,
@@ -645,7 +699,7 @@ var AlertTitle = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 AlertTitle.displayName = "AlertTitle";
-var AlertDescription = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx7(
+var AlertDescription = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(
   "div",
   {
     ref,
@@ -659,13 +713,13 @@ AlertDescription.displayName = "AlertDescription";
 // src/alert-dialog.tsx
 import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
 import { treeContainsComponent as treeContainsComponent2 } from "@ai-matrx/kit/react-tree";
-import * as React7 from "react";
+import * as React8 from "react";
 
 // src/button.tsx
 import { Slot } from "@radix-ui/react-slot";
 import { cva as cva3 } from "class-variance-authority";
-import * as React5 from "react";
-import { jsx as jsx8 } from "react/jsx-runtime";
+import * as React6 from "react";
+import { jsx as jsx9 } from "react/jsx-runtime";
 var buttonVariants = cva3(
   "inline-flex cursor-pointer items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-0 disabled:pointer-events-none disabled:opacity-50 active:scale-[0.98] [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
   {
@@ -728,11 +782,11 @@ var TOUCH_FLOOR_SIZES = /* @__PURE__ */ new Set([
   "roundIcon"
 ]);
 var SQUARE_SIZES = /* @__PURE__ */ new Set(["icon", "icon-sm", "roundIcon"]);
-var Button = React5.forwardRef(
+var Button = React6.forwardRef(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
     const Component = asChild ? Slot : "button";
     const resolvedSize = size ?? "default";
-    return /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx9(
       Component,
       {
         className: cn(buttonVariants({ variant, size, className })),
@@ -789,19 +843,19 @@ var FORBIDDEN_HOST_MOTION_UTILITIES = [
 ];
 
 // src/portal-container.tsx
-import * as React6 from "react";
-import { jsx as jsx9 } from "react/jsx-runtime";
+import * as React7 from "react";
+import { jsx as jsx10 } from "react/jsx-runtime";
 var CONTEXT_SLOT2 = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.portal-container-context");
 var contextRegistry2 = globalThis;
-var PortalContainerContext = contextRegistry2[CONTEXT_SLOT2] ??= React6.createContext(void 0);
+var PortalContainerContext = contextRegistry2[CONTEXT_SLOT2] ??= React7.createContext(void 0);
 function PortalContainerProvider({
   container,
   children
 }) {
-  return /* @__PURE__ */ jsx9(PortalContainerContext.Provider, { value: container ?? void 0, children });
+  return /* @__PURE__ */ jsx10(PortalContainerContext.Provider, { value: container ?? void 0, children });
 }
 function usePortalContainer(explicit) {
-  const injected = React6.useContext(PortalContainerContext);
+  const injected = React7.useContext(PortalContainerContext);
   if (explicit !== void 0) {
     return explicit ?? void 0;
   }
@@ -809,7 +863,7 @@ function usePortalContainer(explicit) {
 }
 
 // src/alert-dialog.tsx
-import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
 var AlertDialog = AlertDialogPrimitive.Root;
 var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
 var AlertDialogPortal = ({
@@ -817,10 +871,10 @@ var AlertDialogPortal = ({
   ...props
 }) => {
   const resolved = usePortalContainer(container);
-  return /* @__PURE__ */ jsx10(AlertDialogPrimitive.Portal, { container: resolved ?? null, ...props });
+  return /* @__PURE__ */ jsx11(AlertDialogPrimitive.Portal, { container: resolved ?? null, ...props });
 };
 AlertDialogPortal.displayName = "AlertDialogPortal";
-var AlertDialogOverlay = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx10(
+var AlertDialogOverlay = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
   AlertDialogPrimitive.Overlay,
   {
     ref,
@@ -834,9 +888,9 @@ var AlertDialogOverlay = React7.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
-var AlertDialogContentPrimitive = React7.forwardRef((props, ref) => /* @__PURE__ */ jsx10(AlertDialogPrimitive.Content, { ...props, ref, "aria-modal": "true" }));
+var AlertDialogContentPrimitive = React8.forwardRef((props, ref) => /* @__PURE__ */ jsx11(AlertDialogPrimitive.Content, { ...props, ref, "aria-modal": "true" }));
 AlertDialogContentPrimitive.displayName = "AlertDialogContentPrimitive";
-var AlertDialogDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx10(
+var AlertDialogDescription = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
   AlertDialogPrimitive.Description,
   {
     ref,
@@ -846,11 +900,11 @@ var AlertDialogDescription = React7.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
-var AlertDialogContent = React7.forwardRef(({ className, children, container, animated = true, ...props }, ref) => {
+var AlertDialogContent = React8.forwardRef(({ className, children, container, animated = true, ...props }, ref) => {
   const hasDescription = treeContainsComponent2(children, AlertDialogDescription) || treeContainsComponent2(children, AlertDialogPrimitive.Description);
-  return /* @__PURE__ */ jsxs5(AlertDialogPortal, { container, children: [
-    /* @__PURE__ */ jsx10(AlertDialogOverlay, {}),
-    /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsxs7(AlertDialogPortal, { container, children: [
+    /* @__PURE__ */ jsx11(AlertDialogOverlay, {}),
+    /* @__PURE__ */ jsxs7(
       AlertDialogContentPrimitive,
       {
         ref,
@@ -870,7 +924,7 @@ var AlertDialogContent = React7.forwardRef(({ className, children, container, an
         ),
         ...props,
         children: [
-          hasDescription ? null : /* @__PURE__ */ jsx10(AlertDialogPrimitive.Description, { className: "sr-only", children: "Please confirm the action described in this dialog." }),
+          hasDescription ? null : /* @__PURE__ */ jsx11(AlertDialogPrimitive.Description, { className: "sr-only", children: "Please confirm the action described in this dialog." }),
           children
         ]
       }
@@ -881,7 +935,7 @@ AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;
 var AlertDialogHeader = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx10(
+}) => /* @__PURE__ */ jsx11(
   "div",
   {
     "data-slot": "alert-dialog-header",
@@ -893,7 +947,7 @@ AlertDialogHeader.displayName = "AlertDialogHeader";
 var AlertDialogFooter = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx10(
+}) => /* @__PURE__ */ jsx11(
   "div",
   {
     "data-slot": "alert-dialog-footer",
@@ -925,7 +979,7 @@ var AlertDialogFooter = ({
   }
 );
 AlertDialogFooter.displayName = "AlertDialogFooter";
-var AlertDialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx10(
+var AlertDialogTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
   AlertDialogPrimitive.Title,
   {
     ref,
@@ -935,7 +989,7 @@ var AlertDialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
-var AlertDialogAction = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx10(
+var AlertDialogAction = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
   AlertDialogPrimitive.Action,
   {
     ref,
@@ -945,7 +999,7 @@ var AlertDialogAction = React7.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
-var AlertDialogCancel = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx10(
+var AlertDialogCancel = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
   AlertDialogPrimitive.Cancel,
   {
     ref,
@@ -962,14 +1016,14 @@ AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
 
 // src/avatar.tsx
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
-import * as React8 from "react";
-import { jsx as jsx11 } from "react/jsx-runtime";
+import * as React9 from "react";
+import { jsx as jsx12 } from "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 = React8.forwardRef(({ className, size = "lg", ...props }, ref) => /* @__PURE__ */ jsx11(
+var Avatar = React9.forwardRef(({ className, size = "lg", ...props }, ref) => /* @__PURE__ */ jsx12(
   AvatarPrimitive.Root,
   {
     ref,
@@ -983,7 +1037,7 @@ var Avatar = React8.forwardRef(({ className, size = "lg", ...props }, ref) => /*
   }
 ));
 Avatar.displayName = AvatarPrimitive.Root.displayName;
-var AvatarImage = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+var AvatarImage = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
   AvatarPrimitive.Image,
   {
     ref,
@@ -993,7 +1047,7 @@ var AvatarImage = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 AvatarImage.displayName = AvatarPrimitive.Image.displayName;
-var AvatarFallback = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+var AvatarFallback = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
   AvatarPrimitive.Fallback,
   {
     ref,
@@ -1008,8 +1062,8 @@ var AvatarFallback = React8.forwardRef(({ className, ...props }, ref) => /* @__P
 AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
 
 // src/card.tsx
-import * as React9 from "react";
-import { jsx as jsx12 } from "react/jsx-runtime";
+import * as React10 from "react";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var CARD_SIZES = {
   sm: {
     root: "rounded-xl border bg-card text-card-foreground shadow",
@@ -1027,12 +1081,12 @@ var CARD_SIZES = {
     padTopless: "p-6 pt-0"
   }
 };
-var CardSizeContext = React9.createContext("md");
+var CardSizeContext = React10.createContext("md");
 function useCardSize() {
-  return React9.useContext(CardSizeContext);
+  return React10.useContext(CardSizeContext);
 }
-var Card = React9.forwardRef(
-  ({ className, size = "md", ...props }, ref) => /* @__PURE__ */ jsx12(CardSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsx12(
+var Card = React10.forwardRef(
+  ({ className, size = "md", ...props }, ref) => /* @__PURE__ */ jsx13(CardSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsx13(
     "div",
     {
       ref,
@@ -1044,9 +1098,9 @@ var Card = React9.forwardRef(
   ) })
 );
 Card.displayName = "Card";
-var CardHeader = React9.forwardRef(({ className, ...props }, ref) => {
+var CardHeader = React10.forwardRef(({ className, ...props }, ref) => {
   const size = useCardSize();
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx13(
     "div",
     {
       ref,
@@ -1061,7 +1115,7 @@ var CardHeader = React9.forwardRef(({ className, ...props }, ref) => {
   );
 });
 CardHeader.displayName = "CardHeader";
-var CardTitle = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
+var CardTitle = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
   "h3",
   {
     ref,
@@ -1071,7 +1125,7 @@ var CardTitle = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardDescription = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
+var CardDescription = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
   "p",
   {
     ref,
@@ -1081,7 +1135,7 @@ var CardDescription = React9.forwardRef(({ className, ...props }, ref) => /* @__
   }
 ));
 CardDescription.displayName = "CardDescription";
-var CardAction = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
+var CardAction = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
   "div",
   {
     ref,
@@ -1091,9 +1145,9 @@ var CardAction = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 CardAction.displayName = "CardAction";
-var CardContent = React9.forwardRef(({ className, ...props }, ref) => {
+var CardContent = React10.forwardRef(({ className, ...props }, ref) => {
   const size = useCardSize();
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx13(
     "div",
     {
       ref,
@@ -1104,9 +1158,9 @@ var CardContent = React9.forwardRef(({ className, ...props }, ref) => {
   );
 });
 CardContent.displayName = "CardContent";
-var CardFooter = React9.forwardRef(({ className, ...props }, ref) => {
+var CardFooter = React10.forwardRef(({ className, ...props }, ref) => {
   const size = useCardSize();
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx13(
     "div",
     {
       ref,
@@ -1124,13 +1178,13 @@ CardFooter.displayName = "CardFooter";
 
 // src/checkbox.tsx
 import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
-import * as React10 from "react";
-import { jsx as jsx13 } from "react/jsx-runtime";
+import * as React11 from "react";
+import { jsx as jsx14 } from "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 = React10.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ jsx13(
+var Checkbox = React11.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ jsx14(
   CheckboxPrimitive.Root,
   {
     ref,
@@ -1141,12 +1195,12 @@ var Checkbox = React10.forwardRef(({ className, size = "md", ...props }, ref) =>
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx13(
+    children: /* @__PURE__ */ jsx14(
       CheckboxPrimitive.Indicator,
       {
         "data-slot": "checkbox-indicator",
         className: "flex items-center justify-center text-current",
-        children: props.checked === "indeterminate" ? /* @__PURE__ */ jsx13(DividerHorizontalIcon, { className: CHECKBOX_SIZES[size].glyph }) : /* @__PURE__ */ jsx13(CheckIcon, { className: CHECKBOX_SIZES[size].glyph })
+        children: props.checked === "indeterminate" ? /* @__PURE__ */ jsx14(DividerHorizontalIcon, { className: CHECKBOX_SIZES[size].glyph }) : /* @__PURE__ */ jsx14(CheckIcon, { className: CHECKBOX_SIZES[size].glyph })
       }
     )
   }
@@ -1155,11 +1209,11 @@ Checkbox.displayName = CheckboxPrimitive.Root.displayName;
 
 // src/collapsible.tsx
 import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
-import * as React11 from "react";
-import { jsx as jsx14 } from "react/jsx-runtime";
+import * as React12 from "react";
+import { jsx as jsx15 } from "react/jsx-runtime";
 var Collapsible = CollapsiblePrimitive.Root;
 var CollapsibleTrigger2 = CollapsiblePrimitive.CollapsibleTrigger;
-var CollapsibleContent2 = React11.forwardRef(({ className, animated = true, ...props }, ref) => /* @__PURE__ */ jsx14(
+var CollapsibleContent2 = React12.forwardRef(({ className, animated = true, ...props }, ref) => /* @__PURE__ */ jsx15(
   CollapsiblePrimitive.CollapsibleContent,
   {
     ref,
@@ -1176,15 +1230,15 @@ CollapsibleContent2.displayName = "CollapsibleContent";
 // src/command.tsx
 import * as DialogPrimitive from "@radix-ui/react-dialog";
 import { Command as CommandPrimitive } from "cmdk";
-import * as React13 from "react";
+import * as React14 from "react";
 
 // src/use-is-mobile.ts
-import * as React12 from "react";
+import * as React13 from "react";
 var MOBILE_BREAKPOINT = 768;
 function useIsMobile() {
-  const [isMobile, setIsMobile] = React12.useState(false);
-  const [hasMounted, setHasMounted] = React12.useState(false);
-  React12.useEffect(() => {
+  const [isMobile, setIsMobile] = React13.useState(false);
+  const [hasMounted, setHasMounted] = React13.useState(false);
+  React13.useEffect(() => {
     setHasMounted(true);
     const onChange = () => {
       setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
@@ -1204,8 +1258,8 @@ function useIsMobile() {
 }
 
 // src/command.tsx
-import { jsx as jsx15, jsxs as jsxs6 } from "react/jsx-runtime";
-var Command = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
+import { jsx as jsx16, jsxs as jsxs8 } from "react/jsx-runtime";
+var Command = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx16(
   CommandPrimitive,
   {
     ref,
@@ -1220,12 +1274,12 @@ Command.displayName = CommandPrimitive.displayName;
 var DIALOG_DESKTOP_CLASSES = `fixed left-[50%] top-[50%] z-[10000] grid min-w-0 w-full max-w-lg ${CENTERED_DIALOG} gap-4 overflow-x-clip border bg-background p-6 shadow-lg [overflow-wrap:anywhere] [&>*]:min-w-0 [&>*]:max-w-full 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 rounded-t-2xl rounded-b-none overflow-y-auto overscroll-contain";
 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 = React13.forwardRef(({ className, children, container, ...props }, ref) => {
+var CommandDialogContent = React14.forwardRef(({ className, children, container, ...props }, ref) => {
   const isMobile = useIsMobile();
   const isModal = useRadixDialogModal();
   const portalContainer = usePortalContainer(container);
-  return /* @__PURE__ */ jsxs6(DialogPrimitive.Portal, { container: portalContainer, children: [
-    isModal ? /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsxs8(DialogPrimitive.Portal, { container: portalContainer, children: [
+    isModal ? /* @__PURE__ */ jsx16(
       DialogPrimitive.Overlay,
       {
         className: cn(
@@ -1234,7 +1288,7 @@ var CommandDialogContent = React13.forwardRef(({ className, children, container,
         )
       }
     ) : null,
-    /* @__PURE__ */ jsxs6(
+    /* @__PURE__ */ jsxs8(
       DialogPrimitive.Content,
       {
         ref,
@@ -1250,9 +1304,9 @@ var CommandDialogContent = React13.forwardRef(({ className, children, container,
         ...props,
         children: [
           children,
-          /* @__PURE__ */ jsxs6(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__ */ jsx15(XIcon, { className: "h-4 w-4" }),
-            /* @__PURE__ */ jsx15("span", { className: "sr-only", children: "Close" })
+          /* @__PURE__ */ jsxs8(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__ */ jsx16(XIcon, { className: "h-4 w-4" }),
+            /* @__PURE__ */ jsx16("span", { className: "sr-only", children: "Close" })
           ] })
         ]
       }
@@ -1266,21 +1320,21 @@ var CommandDialog = ({
   ...props
 }) => {
   const modal = props.modal ?? true;
-  return /* @__PURE__ */ jsx15(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ jsx15(DialogPrimitive.Root, { ...props, modal, children: /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsx16(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ jsx16(DialogPrimitive.Root, { ...props, modal, children: /* @__PURE__ */ jsxs8(
     CommandDialogContent,
     {
       className: "overflow-hidden p-0",
       ...container !== void 0 ? { container } : {},
       children: [
-        /* @__PURE__ */ jsx15(DialogPrimitive.Title, { className: "sr-only" }),
-        /* @__PURE__ */ jsx15(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__ */ jsx16(DialogPrimitive.Title, { className: "sr-only" }),
+        /* @__PURE__ */ jsx16(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 = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs6("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
-  /* @__PURE__ */ jsx15(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
-  /* @__PURE__ */ jsx15(
+var CommandInput = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs8("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
+  /* @__PURE__ */ jsx16(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
+  /* @__PURE__ */ jsx16(
     CommandPrimitive.Input,
     {
       ref,
@@ -1293,7 +1347,7 @@ var CommandInput = React13.forwardRef(({ className, ...props }, ref) => /* @__PU
   )
 ] }));
 CommandInput.displayName = CommandPrimitive.Input.displayName;
-var CommandList = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
+var CommandList = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx16(
   CommandPrimitive.List,
   {
     ref,
@@ -1302,7 +1356,7 @@ var CommandList = React13.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 CommandList.displayName = CommandPrimitive.List.displayName;
-var CommandEmpty = React13.forwardRef((props, ref) => /* @__PURE__ */ jsx15(
+var CommandEmpty = React14.forwardRef((props, ref) => /* @__PURE__ */ jsx16(
   CommandPrimitive.Empty,
   {
     ref,
@@ -1311,7 +1365,7 @@ var CommandEmpty = React13.forwardRef((props, ref) => /* @__PURE__ */ jsx15(
   }
 ));
 CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
-var CommandGroup = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
+var CommandGroup = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx16(
   CommandPrimitive.Group,
   {
     ref,
@@ -1323,7 +1377,7 @@ var CommandGroup = React13.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 CommandGroup.displayName = CommandPrimitive.Group.displayName;
-var CommandSeparator = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
+var CommandSeparator = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx16(
   CommandPrimitive.Separator,
   {
     ref,
@@ -1332,7 +1386,7 @@ var CommandSeparator = React13.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
-var CommandItem = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
+var CommandItem = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx16(
   CommandPrimitive.Item,
   {
     ref,
@@ -1348,7 +1402,7 @@ var CommandShortcut = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     "span",
     {
       className: cn(
@@ -1362,7 +1416,7 @@ var CommandShortcut = ({
 CommandShortcut.displayName = "CommandShortcut";
 
 // src/confirm-dialog.tsx
-import { jsx as jsx16, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
 function ConfirmDialog({
   open,
   onOpenChange,
@@ -1378,20 +1432,20 @@ function ConfirmDialog({
   portalContainer,
   onConfirm
 }) {
-  return /* @__PURE__ */ jsx16(AlertDialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsx17(AlertDialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs9(
     AlertDialogContent,
     {
       className: contentClassName,
       ...portalContainer === void 0 ? {} : { container: portalContainer },
       children: [
-        /* @__PURE__ */ jsxs7(AlertDialogHeader, { children: [
-          /* @__PURE__ */ jsx16(AlertDialogTitle, { children: title }),
-          description ? /* @__PURE__ */ jsx16(AlertDialogDescription, { asChild: true, children: /* @__PURE__ */ jsx16("div", { children: description }) }) : null
+        /* @__PURE__ */ jsxs9(AlertDialogHeader, { children: [
+          /* @__PURE__ */ jsx17(AlertDialogTitle, { children: title }),
+          description ? /* @__PURE__ */ jsx17(AlertDialogDescription, { asChild: true, children: /* @__PURE__ */ jsx17("div", { children: description }) }) : null
         ] }),
         content ?? null,
-        /* @__PURE__ */ jsxs7(AlertDialogFooter, { children: [
-          cancelLabel === null ? null : /* @__PURE__ */ jsx16(AlertDialogCancel, { className: "max-lg:min-h-11", disabled: busy, children: cancelLabel }),
-          /* @__PURE__ */ jsxs7(
+        /* @__PURE__ */ jsxs9(AlertDialogFooter, { children: [
+          cancelLabel === null ? null : /* @__PURE__ */ jsx17(AlertDialogCancel, { className: "max-lg:min-h-11", disabled: busy, children: cancelLabel }),
+          /* @__PURE__ */ jsxs9(
             AlertDialogAction,
             {
               disabled: busy || confirmDisabled,
@@ -1407,7 +1461,7 @@ function ConfirmDialog({
                 variant === "destructive" && buttonVariants({ variant: "destructive" })
               ),
               children: [
-                busy ? /* @__PURE__ */ jsx16(Loader2Icon, { className: cn("mr-2 h-4 w-4", MOTION_SPIN) }) : null,
+                busy ? /* @__PURE__ */ jsx17(Loader2Icon, { className: cn("mr-2 h-4 w-4", MOTION_SPIN) }) : null,
                 confirmLabel
               ]
             }
@@ -1421,18 +1475,18 @@ function ConfirmDialog({
 // src/confirm-host.tsx
 import { confirmOpener } from "@ai-matrx/kit/confirm-opener";
 import { useOpenerHost } from "@ai-matrx/kit/opener-react";
-import * as React14 from "react";
-import { jsx as jsx17 } from "react/jsx-runtime";
+import * as React15 from "react";
+import { jsx as jsx18 } from "react/jsx-runtime";
 function ConfirmDialogHost() {
   const { request, open, settle } = useOpenerHost(confirmOpener);
-  const handleConfirm = React14.useCallback(() => settle(true), [settle]);
-  const handleOpenChange = React14.useCallback(
+  const handleConfirm = React15.useCallback(() => settle(true), [settle]);
+  const handleOpenChange = React15.useCallback(
     (next) => {
       if (!next) settle(false);
     },
     [settle]
   );
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx18(
     ConfirmDialog,
     {
       open,
@@ -1449,8 +1503,8 @@ function ConfirmDialogHost() {
 
 // src/context-menu.tsx
 import * as ContextMenuPrimitive from "@radix-ui/react-context-menu";
-import * as React15 from "react";
-import { jsx as jsx18, jsxs as jsxs8 } from "react/jsx-runtime";
+import * as React16 from "react";
+import { jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
 var ContextMenu = ContextMenuPrimitive.Root;
 var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
 var ContextMenuGroup = ContextMenuPrimitive.Group;
@@ -1460,7 +1514,7 @@ 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 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 = React15.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs8(
+var ContextMenuSubTrigger = React16.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs10(
   ContextMenuPrimitive.SubTrigger,
   {
     ref,
@@ -1473,12 +1527,12 @@ var ContextMenuSubTrigger = React15.forwardRef(({ className, inset, children, ..
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx18(RadixChevronRightIcon, { className: "ml-auto h-4 w-4" })
+      /* @__PURE__ */ jsx19(RadixChevronRightIcon, { className: "ml-auto h-4 w-4" })
     ]
   }
 ));
 ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
-var ContextMenuSubContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
+var ContextMenuSubContent = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
   ContextMenuPrimitive.SubContent,
   {
     ref,
@@ -1488,9 +1542,9 @@ var ContextMenuSubContent = React15.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
-var ContextMenuContent = React15.forwardRef(({ className, container, ...props }, ref) => {
+var ContextMenuContent = React16.forwardRef(({ className, container, ...props }, ref) => {
   const portalContainer = usePortalContainer(container);
-  return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx19(ContextMenuPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsx19(
     ContextMenuPrimitive.Content,
     {
       ref,
@@ -1501,7 +1555,7 @@ var ContextMenuContent = React15.forwardRef(({ className, container, ...props },
   ) });
 });
 ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
-var ContextMenuItem = React15.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx18(
+var ContextMenuItem = React16.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx19(
   ContextMenuPrimitive.Item,
   {
     ref,
@@ -1516,7 +1570,7 @@ var ContextMenuItem = React15.forwardRef(({ className, inset, ...props }, ref) =
   }
 ));
 ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
-var ContextMenuCheckboxItem = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs8(
+var ContextMenuCheckboxItem = React16.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs10(
   ContextMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -1524,13 +1578,13 @@ var ContextMenuCheckboxItem = React15.forwardRef(({ className, children, ...prop
     className: cn(INDICATOR_ITEM_CLASS, className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx18("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx18(CheckIcon, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ jsx19("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx19(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx19(CheckIcon, { className: "h-4 w-4" }) }) }),
       children
     ]
   }
 ));
 ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
-var ContextMenuRadioItem = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs8(
+var ContextMenuRadioItem = React16.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs10(
   ContextMenuPrimitive.RadioItem,
   {
     ref,
@@ -1538,13 +1592,13 @@ var ContextMenuRadioItem = React15.forwardRef(({ className, children, ...props }
     className: cn(INDICATOR_ITEM_CLASS, className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx18("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx18(DotFilledIcon, { className: "h-4 w-4 fill-current" }) }) }),
+      /* @__PURE__ */ jsx19("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx19(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx19(DotFilledIcon, { className: "h-4 w-4 fill-current" }) }) }),
       children
     ]
   }
 ));
 ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
-var ContextMenuLabel = React15.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx18(
+var ContextMenuLabel = React16.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx19(
   ContextMenuPrimitive.Label,
   {
     ref,
@@ -1558,7 +1612,7 @@ var ContextMenuLabel = React15.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
-var ContextMenuSeparator = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
+var ContextMenuSeparator = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
   ContextMenuPrimitive.Separator,
   {
     ref,
@@ -1571,7 +1625,7 @@ ContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName;
 var ContextMenuShortcut = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx18(
+}) => /* @__PURE__ */ jsx19(
   "span",
   {
     "data-slot": "context-menu-shortcut",
@@ -1589,12 +1643,12 @@ import {
 
 // src/popover.tsx
 import * as PopoverPrimitive from "@radix-ui/react-popover";
-import * as React16 from "react";
-import { jsx as jsx19 } from "react/jsx-runtime";
+import * as React17 from "react";
+import { jsx as jsx20 } from "react/jsx-runtime";
 var Popover = PopoverPrimitive.Root;
 var PopoverTrigger = PopoverPrimitive.Trigger;
 var PopoverAnchor = PopoverPrimitive.Anchor;
-var PopoverContent = React16.forwardRef(
+var PopoverContent = React17.forwardRef(
   ({
     className,
     align = "center",
@@ -1605,7 +1659,7 @@ var PopoverContent = React16.forwardRef(
     ...props
   }, ref) => {
     const portalContainer = usePortalContainer(container);
-    return /* @__PURE__ */ jsx19(PopoverPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsx19(
+    return /* @__PURE__ */ jsx20(PopoverPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsx20(
       PopoverPrimitive.Content,
       {
         ref,
@@ -1631,7 +1685,7 @@ var PopoverContent = React16.forwardRef(
 PopoverContent.displayName = PopoverPrimitive.Content.displayName;
 
 // src/creatable-picker.tsx
-import { jsx as jsx20, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs11 } from "react/jsx-runtime";
 function article(noun) {
   return /^[aeiou]/i.test(noun.trim()) ? `an ${noun}` : `a ${noun}`;
 }
@@ -1706,8 +1760,8 @@ function CreatablePicker({
       setBusy(false);
     }
   };
-  return /* @__PURE__ */ jsxs9(Popover, { open, onOpenChange: (next) => next ? setOpen(true) : close(), children: [
-    /* @__PURE__ */ jsx20(PopoverTrigger, { asChild: true, disabled, children: /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs11(Popover, { open, onOpenChange: (next) => next ? setOpen(true) : close(), children: [
+    /* @__PURE__ */ jsx21(PopoverTrigger, { asChild: true, disabled, children: /* @__PURE__ */ jsxs11(
       "button",
       {
         type: "button",
@@ -1721,12 +1775,12 @@ function CreatablePicker({
           triggerClassName
         ),
         children: [
-          /* @__PURE__ */ jsx20("span", { className: "min-w-0 flex-1 truncate", children: selected ? renderSelected ?? selected.render ?? selected.label : /* @__PURE__ */ jsx20("span", { className: "text-muted-foreground", children: loading ? "Loading\u2026" : placeholder }) }),
-          /* @__PURE__ */ jsx20(ChevronsUpDownIcon, { className: "size-3.5 shrink-0 opacity-50" })
+          /* @__PURE__ */ jsx21("span", { className: "min-w-0 flex-1 truncate", children: selected ? renderSelected ?? selected.render ?? selected.label : /* @__PURE__ */ jsx21("span", { className: "text-muted-foreground", children: loading ? "Loading\u2026" : placeholder }) }),
+          /* @__PURE__ */ jsx21(ChevronsUpDownIcon, { className: "size-3.5 shrink-0 opacity-50" })
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx20(PopoverContent, { sizing: "content", align: "start", className: "p-0", children: /* @__PURE__ */ jsxs9(
+    /* @__PURE__ */ jsx21(PopoverContent, { sizing: "content", align: "start", className: "p-0", children: /* @__PURE__ */ jsxs11(
       Command,
       {
         filter: (itemValue, search, keywords) => {
@@ -1734,7 +1788,7 @@ function CreatablePicker({
           return haystack.includes(search.toLowerCase()) ? 1 : 0;
         },
         children: [
-          /* @__PURE__ */ jsx20(
+          /* @__PURE__ */ jsx21(
             CommandInput,
             {
               ref: inputRef,
@@ -1746,13 +1800,13 @@ function CreatablePicker({
               placeholder: searchPlaceholder ?? `Search or add ${article(noun)}\u2026`
             }
           ),
-          /* @__PURE__ */ jsxs9(CommandList, { children: [
-            /* @__PURE__ */ jsx20(CommandEmpty, { children: emptyLabel }),
-            groups.map((group) => /* @__PURE__ */ jsx20(
+          /* @__PURE__ */ jsxs11(CommandList, { children: [
+            /* @__PURE__ */ jsx21(CommandEmpty, { children: emptyLabel }),
+            groups.map((group) => /* @__PURE__ */ jsx21(
               CommandGroup,
               {
                 ...group.heading === void 0 ? {} : { heading: group.heading },
-                children: group.options.map((option) => /* @__PURE__ */ jsxs9(
+                children: group.options.map((option) => /* @__PURE__ */ jsxs11(
                   CommandItem,
                   {
                     value: option.label,
@@ -1763,7 +1817,7 @@ function CreatablePicker({
                     },
                     className: "gap-2 text-xs",
                     children: [
-                      /* @__PURE__ */ jsx20(
+                      /* @__PURE__ */ jsx21(
                         LucideCheckIcon,
                         {
                           className: cn(
@@ -1772,8 +1826,8 @@ function CreatablePicker({
                           )
                         }
                       ),
-                      /* @__PURE__ */ jsx20("span", { className: "min-w-0 flex-1 truncate", children: option.render ?? option.label }),
-                      option.hint ? /* @__PURE__ */ jsx20("span", { className: "shrink-0 text-[10px] text-muted-foreground", children: option.hint }) : null
+                      /* @__PURE__ */ jsx21("span", { className: "min-w-0 flex-1 truncate", children: option.render ?? option.label }),
+                      option.hint ? /* @__PURE__ */ jsx21("span", { className: "shrink-0 text-[10px] text-muted-foreground", children: option.hint }) : null
                     ]
                   },
                   option.value
@@ -1782,9 +1836,9 @@ function CreatablePicker({
               group.heading ?? "__ungrouped__"
             ))
           ] }),
-          canCreate ? /* @__PURE__ */ jsxs9("div", { className: "space-y-1 border-t border-border p-1", children: [
-            createExtra && typed && !exactMatch ? /* @__PURE__ */ jsx20("div", { className: "px-1 pt-0.5", children: typeof createExtra === "function" ? createExtra(typed) : createExtra }) : null,
-            /* @__PURE__ */ jsxs9(
+          canCreate ? /* @__PURE__ */ jsxs11("div", { className: "space-y-1 border-t border-border p-1", children: [
+            createExtra && typed && !exactMatch ? /* @__PURE__ */ jsx21("div", { className: "px-1 pt-0.5", children: typeof createExtra === "function" ? createExtra(typed) : createExtra }) : null,
+            /* @__PURE__ */ jsxs11(
               "button",
               {
                 type: "button",
@@ -1792,22 +1846,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__ */ jsx20(Loader2Icon, { className: "size-3.5 shrink-0 matrx-spin" }) : /* @__PURE__ */ jsx20(PlusIcon, { className: "size-3.5 shrink-0" }),
-                  /* @__PURE__ */ jsx20("span", { className: "min-w-0 truncate", children: typed && !exactMatch ? `Create \u201C${typed}\u201D` : `Add ${article(noun)}\u2026` })
+                  busy ? /* @__PURE__ */ jsx21(Loader2Icon, { className: "size-3.5 shrink-0 matrx-spin" }) : /* @__PURE__ */ jsx21(PlusIcon, { className: "size-3.5 shrink-0" }),
+                  /* @__PURE__ */ jsx21("span", { className: "min-w-0 truncate", children: typed && !exactMatch ? `Create \u201C${typed}\u201D` : `Add ${article(noun)}\u2026` })
                 ]
               }
             ),
-            needsName ? /* @__PURE__ */ jsxs9("p", { className: "px-2 pb-0.5 text-[11px] leading-snug text-muted-foreground", children: [
+            needsName ? /* @__PURE__ */ jsxs11("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__ */ jsxs9("div", { className: "space-y-0.5 border-t border-border p-1", children: [
+          footerActions?.length || manageAction ? /* @__PURE__ */ jsxs11("div", { className: "space-y-0.5 border-t border-border p-1", children: [
             footerActions?.map((action) => {
               const Icon2 = action.icon;
-              return /* @__PURE__ */ jsxs9("div", { children: [
-                /* @__PURE__ */ jsxs9(
+              return /* @__PURE__ */ jsxs11("div", { children: [
+                /* @__PURE__ */ jsxs11(
                   "button",
                   {
                     type: "button",
@@ -1817,15 +1871,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__ */ jsx20(Icon2, { className: "size-3.5 shrink-0" }) : null,
-                      /* @__PURE__ */ jsx20("span", { className: "min-w-0 truncate", children: action.label })
+                      Icon2 ? /* @__PURE__ */ jsx21(Icon2, { className: "size-3.5 shrink-0" }) : null,
+                      /* @__PURE__ */ jsx21("span", { className: "min-w-0 truncate", children: action.label })
                     ]
                   }
                 ),
-                action.note ? /* @__PURE__ */ jsx20("p", { className: "px-2 pb-1 text-[10px] leading-snug text-muted-foreground", children: action.note }) : null
+                action.note ? /* @__PURE__ */ jsx21("p", { className: "px-2 pb-1 text-[10px] leading-snug text-muted-foreground", children: action.note }) : null
               ] }, action.label);
             }),
-            manageAction ? /* @__PURE__ */ jsxs9(
+            manageAction ? /* @__PURE__ */ jsxs11(
               "a",
               {
                 href: manageAction.href,
@@ -1834,18 +1888,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__ */ jsx20(ExternalLinkIcon, { className: "size-3.5 shrink-0" }),
-                  /* @__PURE__ */ jsx20("span", { className: "min-w-0 truncate", children: manageAction.label })
+                  /* @__PURE__ */ jsx21(ExternalLinkIcon, { className: "size-3.5 shrink-0" }),
+                  /* @__PURE__ */ jsx21("span", { className: "min-w-0 truncate", children: manageAction.label })
                 ]
               }
             ) : null
           ] }) : null,
-          lockedNote ? /* @__PURE__ */ jsxs9("div", { className: "space-y-1 border-t border-border p-2", children: [
-            /* @__PURE__ */ jsxs9("p", { className: "flex gap-1.5 text-[11px] leading-snug text-muted-foreground", children: [
-              /* @__PURE__ */ jsx20(LockIcon, { className: "mt-px size-3 shrink-0" }),
-              /* @__PURE__ */ jsx20("span", { children: lockedNote })
+          lockedNote ? /* @__PURE__ */ jsxs11("div", { className: "space-y-1 border-t border-border p-2", children: [
+            /* @__PURE__ */ jsxs11("p", { className: "flex gap-1.5 text-[11px] leading-snug text-muted-foreground", children: [
+              /* @__PURE__ */ jsx21(LockIcon, { className: "mt-px size-3 shrink-0" }),
+              /* @__PURE__ */ jsx21("span", { children: lockedNote })
             ] }),
-            lockedAction ? /* @__PURE__ */ jsxs9(
+            lockedAction ? /* @__PURE__ */ jsxs11(
               "button",
               {
                 type: "button",
@@ -1855,8 +1909,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__ */ jsx20(PlusIcon, { className: "size-3.5 shrink-0" }),
-                  /* @__PURE__ */ jsx20("span", { className: "min-w-0 truncate", children: lockedAction.label })
+                  /* @__PURE__ */ jsx21(PlusIcon, { className: "size-3.5 shrink-0" }),
+                  /* @__PURE__ */ jsx21("span", { className: "min-w-0 truncate", children: lockedAction.label })
                 ]
               }
             ) : null
@@ -1871,16 +1925,16 @@ function CreatablePicker({
 import * as DialogPrimitive2 from "@radix-ui/react-dialog";
 import * as VisuallyHidden2 from "@radix-ui/react-visually-hidden";
 import { treeContainsComponent as treeContainsComponent3 } from "@ai-matrx/kit/react-tree";
-import * as React17 from "react";
-import { jsx as jsx21, jsxs as jsxs10 } from "react/jsx-runtime";
-var DialogWindowedByDefaultContext = React17.createContext(false);
+import * as React18 from "react";
+import { jsx as jsx22, jsxs as jsxs12 } from "react/jsx-runtime";
+var DialogWindowedByDefaultContext = React18.createContext(false);
 var Dialog = ({
   children,
   ...props
 }) => {
   const isMobile = useIsMobile();
   const modal = props.modal ?? isMobile;
-  return /* @__PURE__ */ jsx21(DialogWindowedByDefaultContext.Provider, { value: props.modal === void 0, children: /* @__PURE__ */ jsx21(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ jsx21(DialogPrimitive2.Root, { ...props, modal, children }) }) });
+  return /* @__PURE__ */ jsx22(DialogWindowedByDefaultContext.Provider, { value: props.modal === void 0, children: /* @__PURE__ */ jsx22(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ jsx22(DialogPrimitive2.Root, { ...props, modal, children }) }) });
 };
 Dialog.displayName = "Dialog";
 var DialogTrigger = DialogPrimitive2.Trigger;
@@ -1890,14 +1944,14 @@ var DialogPortal = ({
   ...props
 }) => {
   const resolved = usePortalContainer(container);
-  return /* @__PURE__ */ jsx21(DialogPrimitive2.Portal, { container: resolved ?? null, ...props });
+  return /* @__PURE__ */ jsx22(DialogPrimitive2.Portal, { container: resolved ?? null, ...props });
 };
 DialogPortal.displayName = "DialogPortal";
 var CONTEXT_SLOT3 = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.dialog-container-context");
 var contextRegistry3 = globalThis;
-var DialogContainerContext = contextRegistry3[CONTEXT_SLOT3] ??= React17.createContext(null);
-var useDialogContainer = () => React17.useContext(DialogContainerContext);
-var DialogOverlay = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx21(
+var DialogContainerContext = contextRegistry3[CONTEXT_SLOT3] ??= React18.createContext(null);
+var useDialogContainer = () => React18.useContext(DialogContainerContext);
+var DialogOverlay = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
   DialogPrimitive2.Overlay,
   {
     ref,
@@ -1913,9 +1967,9 @@ var DialogOverlay = React17.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 DialogOverlay.displayName = DialogPrimitive2.Overlay.displayName;
-var DialogContentPrimitive = React17.forwardRef((props, ref) => {
+var DialogContentPrimitive = React18.forwardRef((props, ref) => {
   const isModal = useRadixDialogModal();
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx22(
     DialogPrimitive2.Content,
     {
       ...props,
@@ -1928,12 +1982,12 @@ DialogContentPrimitive.displayName = "DialogContentPrimitive";
 var DIALOG_DESKTOP_CLASSES2 = "matrx-dialog-card fixed inset-0 z-[10000] m-auto grid h-fit min-w-0 w-full max-w-lg 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 sm:rounded-lg";
 var DIALOG_MOBILE_SHEET_CLASSES2 = "matrx-mobile-sheet matrx-dialog-card 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] 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 rounded-t-2xl rounded-b-none overflow-y-auto overscroll-contain";
 var DIALOG_MOBILE_SHEET_OVERRIDE2 = "inset-x-0 bottom-0 left-0 right-0 top-auto translate-none w-full max-w-full max-h-[90dvh] rounded-b-none rounded-t-2xl overflow-y-auto";
-var DialogWindowHandleContext = React17.createContext(null);
+var DialogWindowHandleContext = React18.createContext(null);
 var WINDOW_KEEP_VISIBLE = 80;
 function isInteractiveTarget(target) {
   return target instanceof Element && Boolean(target.closest("button, a, input, textarea, select, [role='button'], [contenteditable='true']"));
 }
-var DialogContent = React17.forwardRef(
+var DialogContent = React18.forwardRef(
   ({
     className,
     children,
@@ -1952,13 +2006,13 @@ var DialogContent = React17.forwardRef(
     const injectedContainer = usePortalContainer(container);
     const asSheet = mobileSheet && isMobile;
     const windowed = !isModal && !asSheet;
-    const windowedByDefault = React17.useContext(DialogWindowedByDefaultContext);
-    const [containerEl, setContainerEl] = React17.useState(
+    const windowedByDefault = React18.useContext(DialogWindowedByDefaultContext);
+    const [containerEl, setContainerEl] = React18.useState(
       null
     );
-    const [offset, setOffset] = React17.useState({ x: 0, y: 0 });
-    const dragRef = React17.useRef(null);
-    const handle = React17.useMemo(() => {
+    const [offset, setOffset] = React18.useState({ x: 0, y: 0 });
+    const dragRef = React18.useRef(null);
+    const handle = React18.useMemo(() => {
       if (!windowed) return null;
       const clamp = (value, limit) => Math.max(-limit, Math.min(limit, value));
       return {
@@ -1986,7 +2040,7 @@ var DialogContent = React17.forwardRef(
         onDoubleClick: () => setOffset({ x: 0, y: 0 })
       };
     }, [windowed, offset.x, offset.y]);
-    const mergedRef = React17.useCallback(
+    const mergedRef = React18.useCallback(
       (node) => {
         setContainerEl(node);
         if (typeof ref === "function") ref(node);
@@ -1997,9 +2051,9 @@ var DialogContent = React17.forwardRef(
     );
     const hasTitle = treeContainsComponent3(children, DialogTitle) || treeContainsComponent3(children, DialogPrimitive2.Title);
     const hasDescription = treeContainsComponent3(children, DialogDescription) || treeContainsComponent3(children, DialogPrimitive2.Description);
-    return /* @__PURE__ */ jsxs10(DialogPortal, { container, children: [
-      isModal ? /* @__PURE__ */ jsx21(DialogOverlay, {}) : null,
-      /* @__PURE__ */ jsxs10(
+    return /* @__PURE__ */ jsxs12(DialogPortal, { container, children: [
+      isModal ? /* @__PURE__ */ jsx22(DialogOverlay, {}) : null,
+      /* @__PURE__ */ jsxs12(
         DialogContentPrimitive,
         {
           ref: mergedRef,
@@ -2032,23 +2086,23 @@ var DialogContent = React17.forwardRef(
           ...hasDescription ? {} : { "aria-describedby": void 0 },
           ...props,
           children: [
-            hasTitle ? null : /* @__PURE__ */ jsx21(VisuallyHidden2.Root, { children: /* @__PURE__ */ jsx21(DialogPrimitive2.Title, { children: "Dialog" }) }),
-            /* @__PURE__ */ jsx21(DialogContainerContext.Provider, { value: containerEl, children: /* @__PURE__ */ jsx21(DialogWindowHandleContext.Provider, { value: handle, children: /* @__PURE__ */ jsx21(
+            hasTitle ? null : /* @__PURE__ */ jsx22(VisuallyHidden2.Root, { children: /* @__PURE__ */ jsx22(DialogPrimitive2.Title, { children: "Dialog" }) }),
+            /* @__PURE__ */ jsx22(DialogContainerContext.Provider, { value: containerEl, children: /* @__PURE__ */ jsx22(DialogWindowHandleContext.Provider, { value: handle, children: /* @__PURE__ */ jsx22(
               PortalContainerProvider,
               {
                 container: containerEl ?? injectedContainer ?? null,
                 children
               }
             ) }) }),
-            showCloseButton ? /* @__PURE__ */ jsxs10(
+            showCloseButton ? /* @__PURE__ */ jsxs12(
               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__ */ jsx21(XIcon, { className: "h-4 w-4" }),
-                  /* @__PURE__ */ jsx21("span", { className: "sr-only", children: "Close" })
+                  /* @__PURE__ */ jsx22(XIcon, { className: "h-4 w-4" }),
+                  /* @__PURE__ */ jsx22("span", { className: "sr-only", children: "Close" })
                 ]
               }
             ) : null
@@ -2063,8 +2117,8 @@ var DialogHeader = ({
   className,
   ...props
 }) => {
-  const handle = React17.useContext(DialogWindowHandleContext);
-  return /* @__PURE__ */ jsx21(
+  const handle = React18.useContext(DialogWindowHandleContext);
+  return /* @__PURE__ */ jsx22(
     "div",
     {
       "data-slot": "dialog-header",
@@ -2088,7 +2142,7 @@ DialogHeader.displayName = "DialogHeader";
 var DialogFooter = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx21(
+}) => /* @__PURE__ */ jsx22(
   "div",
   {
     "data-slot": "dialog-footer",
@@ -2120,7 +2174,7 @@ var DialogFooter = ({
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx21(
+var DialogTitle = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
   DialogPrimitive2.Title,
   {
     ref,
@@ -2130,7 +2184,7 @@ var DialogTitle = React17.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DialogTitle.displayName = DialogPrimitive2.Title.displayName;
-var DialogDescription = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx21(
+var DialogDescription = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
   DialogPrimitive2.Description,
   {
     ref,
@@ -2143,8 +2197,8 @@ DialogDescription.displayName = DialogPrimitive2.Description.displayName;
 
 // src/dropdown-menu.tsx
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
-import * as React18 from "react";
-import { jsx as jsx22, jsxs as jsxs11 } from "react/jsx-runtime";
+import * as React19 from "react";
+import { jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
 var DropdownMenuGroup = DropdownMenuPrimitive.Group;
@@ -2154,7 +2208,7 @@ 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_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 = React18.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs11(
+var DropdownMenuSubTrigger = React19.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs13(
   DropdownMenuPrimitive.SubTrigger,
   {
     ref,
@@ -2167,12 +2221,12 @@ var DropdownMenuSubTrigger = React18.forwardRef(({ className, inset, children, .
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx22(RadixChevronRightIcon, { className: "ml-auto h-4 w-4" })
+      /* @__PURE__ */ jsx23(RadixChevronRightIcon, { className: "ml-auto h-4 w-4" })
     ]
   }
 ));
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
-var DropdownMenuSubContent = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var DropdownMenuSubContent = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
   DropdownMenuPrimitive.SubContent,
   {
     ref,
@@ -2182,9 +2236,9 @@ var DropdownMenuSubContent = React18.forwardRef(({ className, ...props }, ref) =
   }
 ));
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
-var DropdownMenuContent = React18.forwardRef(({ className, sideOffset = 4, container, ...props }, ref) => {
+var DropdownMenuContent = React19.forwardRef(({ className, sideOffset = 4, container, ...props }, ref) => {
   const portalContainer = usePortalContainer(container);
-  return /* @__PURE__ */ jsx22(DropdownMenuPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx23(DropdownMenuPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsx23(
     DropdownMenuPrimitive.Content,
     {
       ref,
@@ -2201,7 +2255,7 @@ var DropdownMenuContent = React18.forwardRef(({ className, sideOffset = 4, conta
   ) });
 });
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropdownMenuItem = React18.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx22(
+var DropdownMenuItem = React19.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx23(
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -2211,7 +2265,7 @@ var DropdownMenuItem = React18.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuCheckboxItem = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs11(
+var DropdownMenuCheckboxItem = React19.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs13(
   DropdownMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -2219,13 +2273,13 @@ var DropdownMenuCheckboxItem = React18.forwardRef(({ className, children, ...pro
     className: cn(MENU_INDICATOR_ITEM_CLASS, className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx22("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx22(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx22(CheckIcon, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ jsx23("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx23(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx23(CheckIcon, { className: "h-4 w-4" }) }) }),
       children
     ]
   }
 ));
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
-var DropdownMenuRadioItem = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs11(
+var DropdownMenuRadioItem = React19.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs13(
   DropdownMenuPrimitive.RadioItem,
   {
     ref,
@@ -2233,13 +2287,13 @@ var DropdownMenuRadioItem = React18.forwardRef(({ className, children, ...props
     className: cn(MENU_INDICATOR_ITEM_CLASS, className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx22("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx22(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx22(DotFilledIcon, { className: "h-4 w-4 fill-current" }) }) }),
+      /* @__PURE__ */ jsx23("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx23(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx23(DotFilledIcon, { className: "h-4 w-4 fill-current" }) }) }),
       children
     ]
   }
 ));
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
-var DropdownMenuLabel = React18.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx22(
+var DropdownMenuLabel = React19.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx23(
   DropdownMenuPrimitive.Label,
   {
     ref,
@@ -2249,7 +2303,7 @@ var DropdownMenuLabel = React18.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-var DropdownMenuSeparator = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var DropdownMenuSeparator = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
   DropdownMenuPrimitive.Separator,
   {
     ref,
@@ -2262,7 +2316,7 @@ DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
 var DropdownMenuShortcut = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx22(
+}) => /* @__PURE__ */ jsx23(
   "span",
   {
     "data-slot": "dropdown-menu-shortcut",
@@ -2274,7 +2328,7 @@ DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 
 // src/editable-label.tsx
 import { useCallback as useCallback3, useEffect as useEffect2, useRef as useRef3, useState as useState4 } from "react";
-import { jsx as jsx23, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
 function EditableLabel({
   value,
   onCommit,
@@ -2381,8 +2435,8 @@ function EditableLabel({
     setEditing
   ]);
   if (editing) {
-    return /* @__PURE__ */ jsxs12("span", { className: cn("relative flex min-w-0 flex-1 items-center", className), children: [
-      /* @__PURE__ */ jsx23(
+    return /* @__PURE__ */ jsxs14("span", { className: cn("relative flex min-w-0 flex-1 items-center", className), children: [
+      /* @__PURE__ */ jsx24(
         "input",
         {
           ref: inputRef,
@@ -2422,12 +2476,12 @@ function EditableLabel({
           )
         }
       ),
-      busy && /* @__PURE__ */ jsx23(Loader2Icon, { className: "absolute right-1 h-3.5 w-3.5 matrx-spin text-muted-foreground" }),
-      error && /* @__PURE__ */ jsx23("span", { className: "absolute left-0 top-full mt-0.5 whitespace-nowrap text-xs text-destructive", children: error })
+      busy && /* @__PURE__ */ jsx24(Loader2Icon, { className: "absolute right-1 h-3.5 w-3.5 matrx-spin text-muted-foreground" }),
+      error && /* @__PURE__ */ jsx24("span", { className: "absolute left-0 top-full mt-0.5 whitespace-nowrap text-xs text-destructive", children: error })
     ] });
   }
   if (controlled) return null;
-  return /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx24(
     "button",
     {
       type: "button",
@@ -2461,8 +2515,8 @@ function EditableLabel({
 }
 
 // src/input.tsx
-import * as React19 from "react";
-import { jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
+import * as React20 from "react";
+import { jsx as jsx25, jsxs as jsxs15 } from "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 file:text-foreground placeholder:text-muted-foreground
@@ -2490,9 +2544,9 @@ var getVariantStyles = (variant = "default") => {
       return baseStyles;
   }
 };
-var Input = React19.forwardRef(
+var Input = React20.forwardRef(
   ({ className, type, variant = "default", ...props }, ref) => {
-    return /* @__PURE__ */ jsx24(
+    return /* @__PURE__ */ jsx25(
       "input",
       {
         type,
@@ -2504,7 +2558,7 @@ var Input = React19.forwardRef(
   }
 );
 Input.displayName = "Input";
-var EnterInput = React19.forwardRef(
+var EnterInput = React20.forwardRef(
   ({ onEnter, ...props }, ref) => {
     const handleKeyDown = (e) => {
       if (e.key === "Enter" && onEnter) {
@@ -2512,7 +2566,7 @@ var EnterInput = React19.forwardRef(
         onEnter();
       }
     };
-    return /* @__PURE__ */ jsx24(
+    return /* @__PURE__ */ jsx25(
       Input,
       {
         ...props,
@@ -2528,11 +2582,11 @@ var EnterInput = React19.forwardRef(
   }
 );
 EnterInput.displayName = "EnterInput";
-var BasicInput = React19.forwardRef(
+var BasicInput = React20.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__ */ jsx24(
+    return /* @__PURE__ */ jsx25(
       "input",
       {
         type,
@@ -2547,10 +2601,10 @@ var BasicInput = React19.forwardRef(
   }
 );
 BasicInput.displayName = "BasicInput";
-var InputWithPrefix = React19.forwardRef(({ prefix, className, wrapperClassName, ...props }, ref) => {
-  return /* @__PURE__ */ jsxs13("div", { className: cn("relative", wrapperClassName), children: [
-    prefix && /* @__PURE__ */ jsx24("div", { className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground", children: prefix }),
-    /* @__PURE__ */ jsx24(
+var InputWithPrefix = React20.forwardRef(({ prefix, className, wrapperClassName, ...props }, ref) => {
+  return /* @__PURE__ */ jsxs15("div", { className: cn("relative", wrapperClassName), children: [
+    prefix && /* @__PURE__ */ jsx25("div", { className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground", children: prefix }),
+    /* @__PURE__ */ jsx25(
       Input,
       {
         ref,
@@ -2564,9 +2618,9 @@ InputWithPrefix.displayName = "InputWithPrefix";
 
 // src/label.tsx
 import * as LabelPrimitive from "@radix-ui/react-label";
-import * as React20 from "react";
-import { jsx as jsx25 } from "react/jsx-runtime";
-var Label3 = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx25(
+import * as React21 from "react";
+import { jsx as jsx26 } from "react/jsx-runtime";
+var Label3 = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx26(
   LabelPrimitive.Root,
   {
     ref,
@@ -2581,7 +2635,7 @@ Label3.displayName = LabelPrimitive.Root.displayName;
 
 // src/overflow-toolbar.tsx
 import { useLayoutEffect, useMemo as useMemo2, useRef as useRef4, useState as useState5 } from "react";
-import { Fragment, jsx as jsx26, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
 var GAP_PX = 6;
 var TONE = {
   default: "border border-border bg-background hover:bg-accent text-foreground",
@@ -2603,16 +2657,16 @@ function ToolbarButton({
     action.hideLabel && !action.running ? "w-7 justify-center px-0" : "px-2",
     TONE[tone]
   );
-  const inner = /* @__PURE__ */ jsxs14(Fragment, { children: [
-    /* @__PURE__ */ jsx26(
+  const inner = /* @__PURE__ */ jsxs16(Fragment2, { children: [
+    /* @__PURE__ */ jsx27(
       Icon2,
       {
         className: cn("w-3.5 h-3.5 shrink-0", action.running && "matrx-spin")
       }
     ),
-    showLabel && /* @__PURE__ */ jsx26("span", { children: text })
+    showLabel && /* @__PURE__ */ jsx27("span", { children: text })
   ] });
-  const control = action.href && !action.disabled ? /* @__PURE__ */ jsx26(
+  const control = action.href && !action.disabled ? /* @__PURE__ */ jsx27(
     "a",
     {
       href: action.href,
@@ -2622,7 +2676,7 @@ function ToolbarButton({
       "aria-label": action.label,
       children: inner
     }
-  ) : /* @__PURE__ */ jsx26(
+  ) : /* @__PURE__ */ jsx27(
     "button",
     {
       type: "button",
@@ -2634,12 +2688,12 @@ function ToolbarButton({
     }
   );
   if (enableTooltip && action.hideLabel && renderTooltip) {
-    return /* @__PURE__ */ jsx26(Fragment, { children: renderTooltip(control, action.label) });
+    return /* @__PURE__ */ jsx27(Fragment2, { children: renderTooltip(control, action.label) });
   }
   return control;
 }
 function OverflowTrigger({ ariaLabel }) {
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx27(
     "button",
     {
       type: "button",
@@ -2650,7 +2704,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__ */ jsx26(MoreHorizontalIcon, { className: "w-3.5 h-3.5" })
+      children: /* @__PURE__ */ jsx27(MoreHorizontalIcon, { className: "w-3.5 h-3.5" })
     }
   );
 }
@@ -2710,22 +2764,22 @@ function OverflowToolbar({
   }, [signature, leading != null]);
   const shown = visibleActions.slice(0, visibleCount);
   const hidden = visibleActions.slice(visibleCount);
-  return /* @__PURE__ */ jsxs14("div", { ref: containerRef, className: cn("relative min-w-0", className), children: [
-    /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs16("div", { ref: containerRef, className: cn("relative min-w-0", className), children: [
+    /* @__PURE__ */ jsxs16(
       "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__ */ jsx26(ToolbarButton, { action: a }, a.id)),
-          /* @__PURE__ */ jsx26(OverflowTrigger, { ariaLabel: overflowAriaLabel })
+          visibleActions.map((a) => /* @__PURE__ */ jsx27(ToolbarButton, { action: a }, a.id)),
+          /* @__PURE__ */ jsx27(OverflowTrigger, { ariaLabel: overflowAriaLabel })
         ]
       }
     ),
-    /* @__PURE__ */ jsxs14("div", { className: "flex items-center justify-end gap-1.5", children: [
-      leading != null && /* @__PURE__ */ jsx26("span", { ref: leadingRef, className: "shrink-0", children: leading }),
-      shown.map((a) => /* @__PURE__ */ jsx26(
+    /* @__PURE__ */ jsxs16("div", { className: "flex items-center justify-end gap-1.5", children: [
+      leading != null && /* @__PURE__ */ jsx27("span", { ref: leadingRef, className: "shrink-0", children: leading }),
+      shown.map((a) => /* @__PURE__ */ jsx27(
         ToolbarButton,
         {
           action: a,
@@ -2736,7 +2790,7 @@ function OverflowToolbar({
       )),
       hidden.length > 0 && renderOverflowMenu({
         actions: hidden,
-        trigger: /* @__PURE__ */ jsx26(OverflowTrigger, { ariaLabel: overflowAriaLabel })
+        trigger: /* @__PURE__ */ jsx27(OverflowTrigger, { ariaLabel: overflowAriaLabel })
       })
     ] })
   ] });
@@ -2744,20 +2798,20 @@ function OverflowToolbar({
 
 // src/progress.tsx
 import * as ProgressPrimitive from "@radix-ui/react-progress";
-import * as React22 from "react";
-import { jsx as jsx27 } from "react/jsx-runtime";
+import * as React23 from "react";
+import { jsx as jsx28 } from "react/jsx-runtime";
 var PROGRESS_TONES = {
   default: "bg-primary",
   success: "bg-success",
   warning: "bg-warning",
   destructive: "bg-destructive"
 };
-var Progress = React22.forwardRef(({ className, tone = "default", indicatorClassName, ...props }, ref) => {
+var Progress = React23.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__ */ jsx27(
+  return /* @__PURE__ */ jsx28(
     ProgressPrimitive.Root,
     {
       ref,
@@ -2767,7 +2821,7 @@ var Progress = React22.forwardRef(({ className, tone = "default", indicatorClass
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx27(
+      children: /* @__PURE__ */ jsx28(
         ProgressPrimitive.Indicator,
         {
           "data-slot": "progress-indicator",
@@ -2787,9 +2841,9 @@ Progress.displayName = ProgressPrimitive.Root.displayName;
 
 // src/scroll-area.tsx
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import * as React23 from "react";
-import { jsx as jsx28, jsxs as jsxs15 } from "react/jsx-runtime";
-var ScrollArea = React23.forwardRef(
+import * as React24 from "react";
+import { jsx as jsx29, jsxs as jsxs17 } from "react/jsx-runtime";
+var ScrollArea = React24.forwardRef(
   ({
     className,
     children,
@@ -2798,7 +2852,7 @@ var ScrollArea = React23.forwardRef(
     scrollBarClassName,
     orientation = "vertical",
     ...props
-  }, ref) => /* @__PURE__ */ jsxs15(
+  }, ref) => /* @__PURE__ */ jsxs17(
     ScrollAreaPrimitive.Root,
     {
       ref,
@@ -2806,7 +2860,7 @@ var ScrollArea = React23.forwardRef(
       className: cn("relative overflow-hidden", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx28(
+        /* @__PURE__ */ jsx29(
           ScrollAreaPrimitive.Viewport,
           {
             ref: viewportRef,
@@ -2815,14 +2869,14 @@ var ScrollArea = React23.forwardRef(
             children
           }
         ),
-        /* @__PURE__ */ jsx28(ScrollBar, { orientation, className: scrollBarClassName }),
-        /* @__PURE__ */ jsx28(ScrollAreaPrimitive.Corner, {})
+        /* @__PURE__ */ jsx29(ScrollBar, { orientation, className: scrollBarClassName }),
+        /* @__PURE__ */ jsx29(ScrollAreaPrimitive.Corner, {})
       ]
     }
   )
 );
 ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollBar = React23.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx28(
+var ScrollBar = React24.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx29(
   ScrollAreaPrimitive.ScrollAreaScrollbar,
   {
     ref,
@@ -2835,7 +2889,7 @@ var ScrollBar = React23.forwardRef(({ className, orientation = "vertical", ...pr
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx28(
+    children: /* @__PURE__ */ jsx29(
       ScrollAreaPrimitive.ScrollAreaThumb,
       {
         "data-slot": "scroll-area-thumb",
@@ -2847,7 +2901,7 @@ var ScrollBar = React23.forwardRef(({ className, orientation = "vertical", ...pr
 ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 
 // src/score-ring.tsx
-import { jsx as jsx29, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs18 } from "react/jsx-runtime";
 var DEFAULT_SCORE_THRESHOLDS = {
   good: 75,
   warning: 50
@@ -2878,7 +2932,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__ */ jsxs16(
+  return /* @__PURE__ */ jsxs18(
     "div",
     {
       className: cn(
@@ -2889,8 +2943,8 @@ function ScoreRing({
       role: "img",
       "aria-label": `${label ?? "Score"}: ${pct === null ? "not available" : `${pct} out of 100`}`,
       children: [
-        /* @__PURE__ */ jsxs16("svg", { viewBox: "0 0 100 100", className: "h-full w-full -rotate-90", children: [
-          /* @__PURE__ */ jsx29(
+        /* @__PURE__ */ jsxs18("svg", { viewBox: "0 0 100 100", className: "h-full w-full -rotate-90", children: [
+          /* @__PURE__ */ jsx30(
             "circle",
             {
               cx: "50",
@@ -2901,7 +2955,7 @@ function ScoreRing({
               fill: "none"
             }
           ),
-          pct !== null ? /* @__PURE__ */ jsx29(
+          pct !== null ? /* @__PURE__ */ jsx30(
             "circle",
             {
               cx: "50",
@@ -2920,8 +2974,8 @@ function ScoreRing({
             }
           ) : null
         ] }),
-        /* @__PURE__ */ jsxs16("div", { className: "absolute flex flex-col items-center justify-center", children: [
-          /* @__PURE__ */ jsx29(
+        /* @__PURE__ */ jsxs18("div", { className: "absolute flex flex-col items-center justify-center", children: [
+          /* @__PURE__ */ jsx30(
             "span",
             {
               className: cn(
@@ -2931,7 +2985,7 @@ function ScoreRing({
               children: pct === null ? "\u2014" : `${pct}${suffix}`
             }
           ),
-          label ? /* @__PURE__ */ jsx29("span", { className: "max-w-[74px] truncate text-[9px] font-semibold uppercase tracking-wide text-muted-foreground", children: label }) : null
+          label ? /* @__PURE__ */ jsx30("span", { className: "max-w-[74px] truncate text-[9px] font-semibold uppercase tracking-wide text-muted-foreground", children: label }) : null
         ] })
       ]
     }
@@ -2939,7 +2993,7 @@ function ScoreRing({
 }
 
 // src/segmented-control.tsx
-import { jsx as jsx30 } from "react/jsx-runtime";
+import { jsx as jsx31 } from "react/jsx-runtime";
 function SegmentedControl({
   value,
   onValueChange,
@@ -2954,7 +3008,7 @@ function SegmentedControl({
     md: "h-9 text-sm",
     lg: "h-10 text-base"
   };
-  return /* @__PURE__ */ jsx30(
+  return /* @__PURE__ */ jsx31(
     "div",
     {
       className: cn(
@@ -2965,7 +3019,7 @@ function SegmentedControl({
       role: "tablist",
       children: data.map((option) => {
         const isActive = value === option.value;
-        return /* @__PURE__ */ jsx30(
+        return /* @__PURE__ */ jsx31(
           "button",
           {
             type: "button",
@@ -2991,8 +3045,8 @@ function SegmentedControl({
 }
 
 // src/archive-filter.tsx
-import * as React24 from "react";
-import { jsx as jsx31, jsxs as jsxs17 } from "react/jsx-runtime";
+import * as React25 from "react";
+import { jsx as jsx32, jsxs as jsxs19 } from "react/jsx-runtime";
 var ARCHIVE_FILTER_VALUES = ["active", "archived", "all"];
 var DEFAULT_ARCHIVE_FILTER = "active";
 var ARCHIVE_LABEL = "Archived";
@@ -3017,7 +3071,7 @@ function ArchiveFilter({
   "aria-label": ariaLabel = "Archive filter",
   disabled = false
 }) {
-  const data = React24.useMemo(
+  const data = React25.useMemo(
     () => ARCHIVE_FILTER_VALUES.map((state) => {
       const text = labels?.[state] ?? ARCHIVE_FILTER_LABELS[state];
       const count = counts?.[state];
@@ -3025,15 +3079,15 @@ function ArchiveFilter({
         value: state,
         disabled,
         ariaLabel: typeof count === "number" ? `${text} ${count}` : text,
-        label: typeof count === "number" ? /* @__PURE__ */ jsxs17("span", { className: "inline-flex items-center gap-1.5", children: [
-          /* @__PURE__ */ jsx31("span", { children: text }),
-          /* @__PURE__ */ jsx31("span", { className: "text-muted-foreground tabular-nums", children: count })
+        label: typeof count === "number" ? /* @__PURE__ */ jsxs19("span", { className: "inline-flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx32("span", { children: text }),
+          /* @__PURE__ */ jsx32("span", { className: "text-muted-foreground tabular-nums", children: count })
         ] }) : text
       };
     }),
     [counts, labels, disabled]
   );
-  return /* @__PURE__ */ jsx31("div", { role: "group", "aria-label": ariaLabel, className: cn("inline-flex", className), children: /* @__PURE__ */ jsx31(
+  return /* @__PURE__ */ jsx32("div", { role: "group", "aria-label": ariaLabel, className: cn("inline-flex", className), children: /* @__PURE__ */ jsx32(
     SegmentedControl,
     {
       value,
@@ -3045,7 +3099,7 @@ function ArchiveFilter({
 }
 
 // src/archived-disclosure.tsx
-import { jsx as jsx32, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx33, jsxs as jsxs20 } from "react/jsx-runtime";
 function ArchivedDisclosure({
   count,
   open,
@@ -3059,8 +3113,8 @@ function ArchivedDisclosure({
 }) {
   if (count <= 0 && !(open && keepWhileOpen)) return null;
   const parenthetical = countLabel === void 0 ? String(count) : countLabel;
-  return /* @__PURE__ */ jsxs18("div", { className: cn("min-w-0", className), children: [
-    /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs20("div", { className: cn("min-w-0", className), children: [
+    /* @__PURE__ */ jsxs20(
       "button",
       {
         type: "button",
@@ -3068,21 +3122,21 @@ function ArchivedDisclosure({
         "aria-expanded": open,
         className: "flex w-full items-center gap-2 rounded-lg px-2 py-2 text-sm text-muted-foreground hover:bg-accent active:bg-accent",
         children: [
-          open ? /* @__PURE__ */ jsx32(ChevronDownIcon, { className: "h-4 w-4 shrink-0" }) : /* @__PURE__ */ jsx32(ChevronRightIcon, { className: "h-4 w-4 shrink-0" }),
-          /* @__PURE__ */ jsx32(ArchiveIcon, { className: "h-4 w-4 shrink-0" }),
-          /* @__PURE__ */ jsx32("span", { className: "truncate", children: parenthetical === null ? label : `${label} (${parenthetical})` })
+          open ? /* @__PURE__ */ jsx33(ChevronDownIcon, { className: "h-4 w-4 shrink-0" }) : /* @__PURE__ */ jsx33(ChevronRightIcon, { className: "h-4 w-4 shrink-0" }),
+          /* @__PURE__ */ jsx33(ArchiveIcon, { className: "h-4 w-4 shrink-0" }),
+          /* @__PURE__ */ jsx33("span", { className: "truncate", children: parenthetical === null ? label : `${label} (${parenthetical})` })
         ]
       }
     ),
-    open && children ? /* @__PURE__ */ jsx32("div", { className: cn("mt-1", contentClassName), children }) : null
+    open && children ? /* @__PURE__ */ jsx33("div", { className: cn("mt-1", contentClassName), children }) : null
   ] });
 }
 
 // src/select.tsx
 import * as SelectPrimitive from "@radix-ui/react-select";
 import { cva as cva4 } from "class-variance-authority";
-import * as React25 from "react";
-import { jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
+import * as React26 from "react";
+import { jsx as jsx34, jsxs as jsxs21 } from "react/jsx-runtime";
 var Select = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
 var SelectValue = SelectPrimitive.Value;
@@ -3101,7 +3155,7 @@ var selectTriggerVariants = cva4(
     }
   }
 );
-var SelectTrigger = React25.forwardRef(({ className, children, hideArrow = false, size, ...props }, ref) => /* @__PURE__ */ jsxs19(
+var SelectTrigger = React26.forwardRef(({ className, children, hideArrow = false, size, ...props }, ref) => /* @__PURE__ */ jsxs21(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -3109,12 +3163,12 @@ var SelectTrigger = React25.forwardRef(({ className, children, hideArrow = false
     ...props,
     children: [
       children,
-      !hideArrow && /* @__PURE__ */ jsx33(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx33(RadixChevronDownIcon, { className: "h-4 w-4 shrink-0 opacity-50" }) })
+      !hideArrow && /* @__PURE__ */ jsx34(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx34(RadixChevronDownIcon, { className: "h-4 w-4 shrink-0 opacity-50" }) })
     ]
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+var SelectScrollUpButton = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
@@ -3123,11 +3177,11 @@ var SelectScrollUpButton = React25.forwardRef(({ className, ...props }, ref) =>
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx33(RadixChevronUpIcon, {})
+    children: /* @__PURE__ */ jsx34(RadixChevronUpIcon, {})
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+var SelectScrollDownButton = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
@@ -3136,11 +3190,11 @@ var SelectScrollDownButton = React25.forwardRef(({ className, ...props }, ref) =
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx33(RadixChevronDownIcon, {})
+    children: /* @__PURE__ */ jsx34(RadixChevronDownIcon, {})
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React25.forwardRef(
+var SelectContent = React26.forwardRef(
   ({
     className,
     children,
@@ -3150,7 +3204,7 @@ var SelectContent = React25.forwardRef(
     ...props
   }, ref) => {
     const portalContainer = usePortalContainer(container);
-    return /* @__PURE__ */ jsx33(SelectPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsxs19(
+    return /* @__PURE__ */ jsx34(SelectPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsxs21(
       SelectPrimitive.Content,
       {
         ref,
@@ -3168,8 +3222,8 @@ var SelectContent = React25.forwardRef(
         position,
         ...props,
         children: [
-          /* @__PURE__ */ jsx33(SelectScrollUpButton, {}),
-          /* @__PURE__ */ jsx33(
+          /* @__PURE__ */ jsx34(SelectScrollUpButton, {}),
+          /* @__PURE__ */ jsx34(
             SelectPrimitive.Viewport,
             {
               className: cn(
@@ -3179,14 +3233,14 @@ var SelectContent = React25.forwardRef(
               children
             }
           ),
-          /* @__PURE__ */ jsx33(SelectScrollDownButton, {})
+          /* @__PURE__ */ jsx34(SelectScrollDownButton, {})
         ]
       }
     ) });
   }
 );
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+var SelectLabel = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
   SelectPrimitive.Label,
   {
     ref,
@@ -3195,7 +3249,7 @@ var SelectLabel = React25.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React25.forwardRef(({ className, children, description, ...props }, ref) => /* @__PURE__ */ jsxs19(
+var SelectItem = React26.forwardRef(({ className, children, description, ...props }, ref) => /* @__PURE__ */ jsxs21(
   SelectPrimitive.Item,
   {
     ref,
@@ -3206,14 +3260,14 @@ var SelectItem = React25.forwardRef(({ className, children, description, ...prop
     ),
     ...props,
     children: [
-      /* @__PURE__ */ jsx33("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx33(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx33(CheckIcon, { className: "h-4 w-4" }) }) }),
-      /* @__PURE__ */ jsx33("span", { className: "min-w-0 whitespace-normal break-words [overflow-wrap:anywhere]", children: /* @__PURE__ */ jsx33(SelectPrimitive.ItemText, { children }) }),
-      description ? /* @__PURE__ */ jsx33("span", { className: "block min-w-0 break-words text-xs leading-snug text-muted-foreground [overflow-wrap:anywhere]", children: description }) : null
+      /* @__PURE__ */ jsx34("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx34(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx34(CheckIcon, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ jsx34("span", { className: "min-w-0 whitespace-normal break-words [overflow-wrap:anywhere]", children: /* @__PURE__ */ jsx34(SelectPrimitive.ItemText, { children }) }),
+      description ? /* @__PURE__ */ jsx34("span", { className: "block min-w-0 break-words text-xs leading-snug text-muted-foreground [overflow-wrap:anywhere]", children: description }) : null
     ]
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+var SelectSeparator = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
   SelectPrimitive.Separator,
   {
     ref,
@@ -3225,9 +3279,9 @@ SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 // src/separator.tsx
 import * as SeparatorPrimitive from "@radix-ui/react-separator";
-import * as React26 from "react";
-import { jsx as jsx34 } from "react/jsx-runtime";
-var Separator4 = React26.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx34(
+import * as React27 from "react";
+import { jsx as jsx35 } from "react/jsx-runtime";
+var Separator4 = React27.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx35(
   SeparatorPrimitive.Root,
   {
     ref,
@@ -3247,11 +3301,11 @@ Separator4.displayName = SeparatorPrimitive.Root.displayName;
 import * as SheetPrimitive from "@radix-ui/react-dialog";
 import { treeContainsComponent as treeContainsComponent4 } from "@ai-matrx/kit/react-tree";
 import { cva as cva5 } from "class-variance-authority";
-import * as React27 from "react";
-import { jsx as jsx35, jsxs as jsxs20 } from "react/jsx-runtime";
-var SheetContentBase = React27.forwardRef(({ ...props }, ref) => {
+import * as React28 from "react";
+import { jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
+var SheetContentBase = React28.forwardRef(({ ...props }, ref) => {
   const isModal = useRadixDialogModal();
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx36(
     SheetPrimitive.Content,
     {
       ...props,
@@ -3261,15 +3315,15 @@ var SheetContentBase = React27.forwardRef(({ ...props }, ref) => {
   );
 });
 SheetContentBase.displayName = "SheetContentBase";
-var Sheet = React27.forwardRef(({ children, ...props }, _ref) => {
+var Sheet = React28.forwardRef(({ children, ...props }, _ref) => {
   const modal = props.modal ?? true;
-  return /* @__PURE__ */ jsx35(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ jsx35(SheetPrimitive.Root, { ...props, modal, children }) });
+  return /* @__PURE__ */ jsx36(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ jsx36(SheetPrimitive.Root, { ...props, modal, children }) });
 });
 Sheet.displayName = "Sheet";
 var SheetTrigger = SheetPrimitive.Trigger;
 var SheetClose = SheetPrimitive.Close;
 var SheetPortal = SheetPrimitive.Portal;
-var SheetOverlay = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
+var SheetOverlay = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
   SheetPrimitive.Overlay,
   {
     className: cn(
@@ -3306,7 +3360,7 @@ var sheetVariants = cva5(
     }
   }
 );
-var SheetDescription = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
+var SheetDescription = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
   SheetPrimitive.Description,
   {
     ref,
@@ -3315,7 +3369,7 @@ var SheetDescription = React27.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 SheetDescription.displayName = SheetPrimitive.Description.displayName;
-var SheetContent = React27.forwardRef(
+var SheetContent = React28.forwardRef(
   ({
     side = "right",
     className,
@@ -3327,9 +3381,9 @@ var SheetContent = React27.forwardRef(
     ...props
   }, ref) => {
     const hasDescription = treeContainsComponent4(children, SheetDescription) || treeContainsComponent4(children, SheetPrimitive.Description);
-    return /* @__PURE__ */ jsxs20(SheetPortal, { children: [
-      !hideOverlay && /* @__PURE__ */ jsx35(SheetOverlay, { className: overlayClassName }),
-      /* @__PURE__ */ jsxs20(
+    return /* @__PURE__ */ jsxs22(SheetPortal, { children: [
+      !hideOverlay && /* @__PURE__ */ jsx36(SheetOverlay, { className: overlayClassName }),
+      /* @__PURE__ */ jsxs22(
         SheetContentBase,
         {
           ref,
@@ -3341,9 +3395,9 @@ var SheetContent = React27.forwardRef(
           ...hasDescription ? {} : { "aria-describedby": void 0 },
           ...props,
           children: [
-            !hideCloseButton && /* @__PURE__ */ jsxs20(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__ */ jsx35(Cross2Icon, { className: "h-4 w-4" }),
-              /* @__PURE__ */ jsx35("span", { className: "sr-only", children: "Close" })
+            !hideCloseButton && /* @__PURE__ */ jsxs22(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__ */ jsx36(Cross2Icon, { className: "h-4 w-4" }),
+              /* @__PURE__ */ jsx36("span", { className: "sr-only", children: "Close" })
             ] }),
             children
           ]
@@ -3356,7 +3410,7 @@ SheetContent.displayName = SheetPrimitive.Content.displayName;
 var SheetHeader = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx35(
+}) => /* @__PURE__ */ jsx36(
   "div",
   {
     className: cn(
@@ -3370,7 +3424,7 @@ SheetHeader.displayName = "SheetHeader";
 var SheetFooter = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx35(
+}) => /* @__PURE__ */ jsx36(
   "div",
   {
     "data-slot": "sheet-footer",
@@ -3382,7 +3436,7 @@ var SheetFooter = ({
   }
 );
 SheetFooter.displayName = "SheetFooter";
-var SheetTitle = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
+var SheetTitle = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
   SheetPrimitive.Title,
   {
     ref,
@@ -3393,12 +3447,12 @@ var SheetTitle = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE
 SheetTitle.displayName = SheetPrimitive.Title.displayName;
 
 // src/organization-picker.tsx
-import * as React29 from "react";
+import * as React30 from "react";
 
 // src/skeleton.tsx
-import { jsx as jsx36 } from "react/jsx-runtime";
+import { jsx as jsx37 } from "react/jsx-runtime";
 function Skeleton({ className, animated = true, ...props }) {
-  return /* @__PURE__ */ jsx36(
+  return /* @__PURE__ */ jsx37(
     "div",
     {
       "data-slot": "skeleton",
@@ -3414,8 +3468,8 @@ function Skeleton({ className, animated = true, ...props }) {
 
 // src/switch.tsx
 import * as SwitchPrimitives from "@radix-ui/react-switch";
-import * as React28 from "react";
-import { jsx as jsx37 } from "react/jsx-runtime";
+import * as React29 from "react";
+import { jsx as jsx38 } from "react/jsx-runtime";
 var SWITCH_SIZES = {
   sm: {
     root: "h-4 w-9 border-border data-[state=unchecked]:bg-input",
@@ -3426,7 +3480,7 @@ var SWITCH_SIZES = {
     thumb: "h-4 w-4 data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
   }
 };
-var Switch = React28.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ jsx37(
+var Switch = React29.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ jsx38(
   SwitchPrimitives.Root,
   {
     ref,
@@ -3437,7 +3491,7 @@ var Switch = React28.forwardRef(({ className, size = "md", ...props }, ref) => /
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx37(
+    children: /* @__PURE__ */ jsx38(
       SwitchPrimitives.Thumb,
       {
         "data-slot": "switch-thumb",
@@ -3452,7 +3506,7 @@ var Switch = React28.forwardRef(({ className, size = "md", ...props }, ref) => /
 Switch.displayName = SwitchPrimitives.Root.displayName;
 
 // src/organization-picker.tsx
-import { Fragment as Fragment2, jsx as jsx38, jsxs as jsxs21 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx39, jsxs as jsxs23 } from "react/jsx-runtime";
 var SEARCH_APPEARS_ABOVE = 8;
 function matchesQuery(org, query) {
   const q = query.trim().toLowerCase();
@@ -3467,7 +3521,7 @@ function OrganizationAbbreviation({
   className
 }) {
   const mark = abbreviation && abbreviation.trim() || name.trim().slice(0, 1) || "?";
-  return /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx39(
     "span",
     {
       className: cn(
@@ -3492,8 +3546,8 @@ function OrganizationPicker({
   itemClassName,
   className
 }) {
-  const [query, setQuery] = React29.useState("");
-  const [showFixtures, setShowFixtures] = React29.useState(false);
+  const [query, setQuery] = React30.useState("");
+  const [showFixtures, setShowFixtures] = React30.useState(false);
   const active = organizations.find((o) => o.id === activeOrganizationId) ?? null;
   const isDefault = (id) => !!defaultOrganizationId && id === defaultOrganizationId;
   const rank = (org) => org.id === defaultOrganizationId ? 0 : org.isOwn ? 1 : 2;
@@ -3505,7 +3559,7 @@ function OrganizationPicker({
   const sharesItsName = (org) => organizations.filter((other) => other.name.trim() === org.name.trim()).length > 1;
   const renderRow = (org) => {
     const isActive = org.id === activeOrganizationId;
-    return /* @__PURE__ */ jsx38("li", { role: "none", children: /* @__PURE__ */ jsxs21(
+    return /* @__PURE__ */ jsx39("li", { role: "none", children: /* @__PURE__ */ jsxs23(
       "button",
       {
         type: "button",
@@ -3522,7 +3576,7 @@ function OrganizationPicker({
           itemClassName
         ),
         children: [
-          /* @__PURE__ */ jsx38(
+          /* @__PURE__ */ jsx39(
             OrganizationAbbreviation,
             {
               abbreviation: org.abbreviation,
@@ -3533,12 +3587,12 @@ function OrganizationPicker({
               )
             }
           ),
-          /* @__PURE__ */ jsxs21("span", { className: "flex min-w-0 flex-1 flex-col", children: [
-            /* @__PURE__ */ jsx38("span", { className: "truncate", children: org.name }),
-            sharesItsName(org) && org.distinguisher ? /* @__PURE__ */ jsx38("span", { className: "truncate text-[10px] font-normal text-muted-foreground", children: org.distinguisher }) : null
+          /* @__PURE__ */ jsxs23("span", { className: "flex min-w-0 flex-1 flex-col", children: [
+            /* @__PURE__ */ jsx39("span", { className: "truncate", children: org.name }),
+            sharesItsName(org) && org.distinguisher ? /* @__PURE__ */ jsx39("span", { className: "truncate text-[10px] font-normal text-muted-foreground", children: org.distinguisher }) : null
           ] }),
-          org.isPersonal && /* @__PURE__ */ jsx38("span", { className: "shrink-0 rounded-full bg-muted px-1.5 py-0.5 text-[10px] font-medium text-muted-foreground", children: "Personal" }),
-          isDefault(org.id) && /* @__PURE__ */ jsx38(
+          org.isPersonal && /* @__PURE__ */ jsx39("span", { className: "shrink-0 rounded-full bg-muted px-1.5 py-0.5 text-[10px] font-medium text-muted-foreground", children: "Personal" }),
+          isDefault(org.id) && /* @__PURE__ */ jsx39(
             StarIcon,
             {
               className: "h-[13px] w-[13px] shrink-0 fill-warning text-warning",
@@ -3547,23 +3601,31 @@ function OrganizationPicker({
               role: "img"
             }
           ),
-          isActive && /* @__PURE__ */ jsx38(LucideCheckIcon, { className: "h-[15px] w-[15px] shrink-0 text-primary" })
+          isActive && /* @__PURE__ */ jsx39(LucideCheckIcon, { className: "h-[15px] w-[15px] shrink-0 text-primary" })
         ]
       }
     ) }, org.id);
   };
-  return /* @__PURE__ */ jsxs21("div", { className: cn("flex flex-col", className), "data-slot": "organization-picker", children: [
-    !hideHeading && /* @__PURE__ */ jsx38("p", { className: "px-2 py-1.5 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Organization" }),
-    loading ? /* @__PURE__ */ jsxs21("div", { className: "space-y-1 px-1 py-1", "aria-busy": "true", "aria-label": "Loading organizations", children: [
-      /* @__PURE__ */ jsx38(Skeleton, { className: "h-7 rounded-md" }),
-      /* @__PURE__ */ jsx38(Skeleton, { className: "h-7 rounded-md" })
-    ] }) : loadFailed ? /* @__PURE__ */ jsx38("p", { className: "px-2 py-2 text-xs text-destructive", role: "alert", children: "Could not load organizations." }) : organizations.length === 0 ? /* @__PURE__ */ jsx38("p", { className: "px-2 py-2 text-xs text-muted-foreground", children: "Your account is not a member of any organization. Ask an administrator to add you to one." }) : /* @__PURE__ */ jsxs21(Fragment2, { children: [
-      active ? /* @__PURE__ */ jsxs21("p", { className: "px-2 pb-1 text-[11px] text-muted-foreground", "data-slot": "organization-picker-status", children: [
+  return /* @__PURE__ */ jsxs23("div", { className: cn("flex flex-col", className), "data-slot": "organization-picker", children: [
+    !hideHeading && /* @__PURE__ */ jsx39("p", { className: "px-2 py-1.5 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Organization" }),
+    loading ? /* @__PURE__ */ jsxs23("div", { className: "space-y-1 px-1 py-1", "aria-busy": "true", "aria-label": "Loading organizations", children: [
+      /* @__PURE__ */ jsx39(Skeleton, { className: "h-7 rounded-md" }),
+      /* @__PURE__ */ jsx39(Skeleton, { className: "h-7 rounded-md" })
+    ] }) : loadFailed ? /* @__PURE__ */ jsx39(
+      ErrorBox,
+      {
+        className: "px-2 py-2 text-xs text-destructive",
+        operation: "Load your organizations",
+        origin: "design-system/OrganizationPicker",
+        children: "Could not load organizations."
+      }
+    ) : organizations.length === 0 ? /* @__PURE__ */ jsx39("p", { className: "px-2 py-2 text-xs text-muted-foreground", children: "Your account is not a member of any organization. Ask an administrator to add you to one." }) : /* @__PURE__ */ jsxs23(Fragment3, { children: [
+      active ? /* @__PURE__ */ jsxs23("p", { className: "px-2 pb-1 text-[11px] text-muted-foreground", "data-slot": "organization-picker-status", children: [
         "Working in",
         " ",
-        /* @__PURE__ */ jsx38("span", { className: "font-medium text-foreground", children: active.name })
-      ] }) : /* @__PURE__ */ jsx38("p", { className: "px-2 pb-1 text-[11px] text-destructive", "data-slot": "organization-picker-status", children: "No organization selected \u2014 pick one below." }),
-      searchable && /* @__PURE__ */ jsx38("div", { className: "px-2 pb-1.5", children: /* @__PURE__ */ jsx38(
+        /* @__PURE__ */ jsx39("span", { className: "font-medium text-foreground", children: active.name })
+      ] }) : /* @__PURE__ */ jsx39("p", { className: "px-2 pb-1 text-[11px] text-destructive", "data-slot": "organization-picker-status", children: "No organization selected \u2014 pick one below." }),
+      searchable && /* @__PURE__ */ jsx39("div", { className: "px-2 pb-1.5", children: /* @__PURE__ */ jsx39(
         Input,
         {
           type: "search",
@@ -3577,7 +3639,7 @@ function OrganizationPicker({
           "data-slot": "organization-picker-search"
         }
       ) }),
-      listed.length === 0 && fixtures.length === 0 ? /* @__PURE__ */ jsxs21(
+      listed.length === 0 && fixtures.length === 0 ? /* @__PURE__ */ jsxs23(
         "p",
         {
           className: "px-2 py-2 text-xs text-muted-foreground",
@@ -3599,16 +3661,16 @@ function OrganizationPicker({
            clicking. So: count the matches, say where they are, and carry
            the click that reveals them — the same shape as the honest
            empty-filter twin one line down. (TAILS-3) */
-        /* @__PURE__ */ jsx38(
+        /* @__PURE__ */ jsx39(
           "p",
           {
             className: "px-2 py-2 text-xs text-muted-foreground",
             "data-slot": "organization-picker-only-fixtures",
-            children: query.trim() ? /* @__PURE__ */ jsxs21(Fragment2, { children: [
+            children: query.trim() ? /* @__PURE__ */ jsxs23(Fragment3, { children: [
               fixtures.length === 1 ? `1 match for \u201C${query.trim()}\u201D is in your test organizations` : `All ${fixtures.length} matches for \u201C${query.trim()}\u201D are in your test organizations`,
-              showFixtures ? ", listed below." : /* @__PURE__ */ jsxs21(Fragment2, { children: [
+              showFixtures ? ", listed below." : /* @__PURE__ */ jsxs23(Fragment3, { children: [
                 " \u2014 ",
-                /* @__PURE__ */ jsx38(
+                /* @__PURE__ */ jsx39(
                   "button",
                   {
                     type: "button",
@@ -3626,8 +3688,8 @@ function OrganizationPicker({
             ] }) : `Every organization you belong to is a test organization \u2014 all ${fixtures.length} are below.`
           }
         )
-      ) : /* @__PURE__ */ jsx38("ul", { className: "max-h-72 overflow-y-auto", role: "listbox", "aria-label": "Organizations", children: listed.map(renderRow) }),
-      /* @__PURE__ */ jsx38(
+      ) : /* @__PURE__ */ jsx39("ul", { className: "max-h-72 overflow-y-auto", role: "listbox", "aria-label": "Organizations", children: listed.map(renderRow) }),
+      /* @__PURE__ */ jsx39(
         ArchivedDisclosure,
         {
           count: fixtures.length,
@@ -3635,7 +3697,7 @@ function OrganizationPicker({
           onOpenChange: setShowFixtures,
           label: "Test organizations",
           className: "mt-0.5",
-          children: /* @__PURE__ */ jsx38(
+          children: /* @__PURE__ */ jsx39(
             "ul",
             {
               className: "max-h-72 overflow-y-auto",
@@ -3646,9 +3708,9 @@ function OrganizationPicker({
           )
         }
       ),
-      onSetDefault && /* @__PURE__ */ jsxs21(Fragment2, { children: [
-        /* @__PURE__ */ jsx38("div", { className: "my-1 border-t border-border" }),
-        /* @__PURE__ */ jsx38(
+      onSetDefault && /* @__PURE__ */ jsxs23(Fragment3, { children: [
+        /* @__PURE__ */ jsx39("div", { className: "my-1 border-t border-border" }),
+        /* @__PURE__ */ jsx39(
           DefaultOrganizationSwitch,
           {
             active,
@@ -3666,17 +3728,17 @@ function DefaultOrganizationSwitch({
   onChange
 }) {
   const disabled = !active;
-  return /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsxs23(
     "div",
     {
       className: "flex items-center justify-between gap-3 rounded-md px-2 py-1.5",
       "data-slot": "organization-picker-default",
       children: [
-        /* @__PURE__ */ jsxs21("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ jsx38("p", { className: "text-xs font-medium text-foreground", children: "Keep it at the top" }),
-          /* @__PURE__ */ jsx38("p", { className: "truncate text-[11px] text-muted-foreground", children: disabled ? "Select an organization first" : checked ? `${active.name} is first in this list on every device` : "Star it so it is first in this list on every device" })
+        /* @__PURE__ */ jsxs23("div", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsx39("p", { className: "text-xs font-medium text-foreground", children: "Keep it at the top" }),
+          /* @__PURE__ */ jsx39("p", { className: "truncate text-[11px] text-muted-foreground", children: disabled ? "Select an organization first" : checked ? `${active.name} is first in this list on every device` : "Star it so it is first in this list on every device" })
         ] }),
-        /* @__PURE__ */ jsx38(
+        /* @__PURE__ */ jsx39(
           Switch,
           {
             checked,
@@ -3692,7 +3754,7 @@ function DefaultOrganizationSwitch({
 
 // src/tabbed-bottom-sheet.tsx
 import { useState as useState7 } from "react";
-import { jsx as jsx39, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs24 } from "react/jsx-runtime";
 function TabbedBottomSheet({
   open,
   onOpenChange,
@@ -3707,15 +3769,15 @@ function TabbedBottomSheet({
     if (open) setSelectedTabId(initialTabId);
   }
   const selectedTab = selectedTabId ? tabs.find((tab) => tab.id === selectedTabId) : null;
-  return /* @__PURE__ */ jsx39(
+  return /* @__PURE__ */ jsx40(
     BottomSheet,
     {
       open,
       onOpenChange,
       title,
       size: "full",
-      children: /* @__PURE__ */ jsxs22("div", { className: "matrx-mobile-sheet flex min-h-0 flex-1 flex-col", children: [
-        /* @__PURE__ */ jsx39(
+      children: /* @__PURE__ */ jsxs24("div", { className: "matrx-mobile-sheet flex min-h-0 flex-1 flex-col", children: [
+        /* @__PURE__ */ jsx40(
           BottomSheetHeader,
           {
             title: selectedTab ? selectedTab.label : title,
@@ -3723,19 +3785,19 @@ function TabbedBottomSheet({
             onBack: () => setSelectedTabId(null)
           }
         ),
-        selectedTab ? /* @__PURE__ */ jsx39("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden pb-safe", children: selectedTab.content }) : /* @__PURE__ */ jsx39(BottomSheetBody, { children: /* @__PURE__ */ jsx39("ul", { className: "divide-y divide-border", children: tabs.map((tab) => {
+        selectedTab ? /* @__PURE__ */ jsx40("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden pb-safe", children: selectedTab.content }) : /* @__PURE__ */ jsx40(BottomSheetBody, { children: /* @__PURE__ */ jsx40("ul", { className: "divide-y divide-border", children: tabs.map((tab) => {
           const Icon2 = tab.icon;
-          return /* @__PURE__ */ jsx39("li", { children: /* @__PURE__ */ jsxs22(
+          return /* @__PURE__ */ jsx40("li", { children: /* @__PURE__ */ jsxs24(
             "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__ */ jsx39(Icon2, { className: "h-5 w-5 shrink-0 text-muted-foreground" }) : null,
-                /* @__PURE__ */ jsx39("span", { className: "min-w-0 flex-1 text-base text-foreground", children: tab.label }),
+                Icon2 ? /* @__PURE__ */ jsx40(Icon2, { className: "h-5 w-5 shrink-0 text-muted-foreground" }) : null,
+                /* @__PURE__ */ jsx40("span", { className: "min-w-0 flex-1 text-base text-foreground", children: tab.label }),
                 tab.trailing,
-                /* @__PURE__ */ jsx39(ChevronRightIcon, { className: "h-5 w-5 shrink-0 text-muted-foreground" })
+                /* @__PURE__ */ jsx40(ChevronRightIcon, { className: "h-5 w-5 shrink-0 text-muted-foreground" })
               ]
             }
           ) }, tab.id);
@@ -3746,19 +3808,19 @@ function TabbedBottomSheet({
 }
 
 // src/table.tsx
-import * as React30 from "react";
-import { jsx as jsx40 } from "react/jsx-runtime";
+import * as React31 from "react";
+import { jsx as jsx41 } from "react/jsx-runtime";
 var TABLE_SIZES = {
   sm: { head: "px-2", cell: "p-2" },
   md: { head: "px-3", cell: "p-3" }
 };
-var TableSizeContext = React30.createContext("md");
+var TableSizeContext = React31.createContext("md");
 function useTableSize() {
-  return React30.useContext(TableSizeContext);
+  return React31.useContext(TableSizeContext);
 }
-var Table = React30.forwardRef(
+var Table = React31.forwardRef(
   ({ className, size = "md", wrap = true, wrapperClassName, ...props }, ref) => {
-    const table = /* @__PURE__ */ jsx40(
+    const table = /* @__PURE__ */ jsx41(
       "table",
       {
         ref,
@@ -3768,7 +3830,7 @@ var Table = React30.forwardRef(
         ...props
       }
     );
-    return /* @__PURE__ */ jsx40(TableSizeContext.Provider, { value: size, children: wrap ? /* @__PURE__ */ jsx40(
+    return /* @__PURE__ */ jsx41(TableSizeContext.Provider, { value: size, children: wrap ? /* @__PURE__ */ jsx41(
       "div",
       {
         "data-slot": "table-wrapper",
@@ -3779,7 +3841,7 @@ var Table = React30.forwardRef(
   }
 );
 Table.displayName = "Table";
-var TableHeader = React30.forwardRef(({ className, sticky = false, ...props }, ref) => /* @__PURE__ */ jsx40(
+var TableHeader = React31.forwardRef(({ className, sticky = false, ...props }, ref) => /* @__PURE__ */ jsx41(
   "thead",
   {
     ref,
@@ -3793,7 +3855,7 @@ var TableHeader = React30.forwardRef(({ className, sticky = false, ...props }, r
   }
 ));
 TableHeader.displayName = "TableHeader";
-var TableBody = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var TableBody = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
   "tbody",
   {
     ref,
@@ -3803,7 +3865,7 @@ var TableBody = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 TableBody.displayName = "TableBody";
-var TableFooter = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var TableFooter = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
   "tfoot",
   {
     ref,
@@ -3816,7 +3878,7 @@ var TableFooter = React30.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TableFooter.displayName = "TableFooter";
-var TableRow = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var TableRow = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
   "tr",
   {
     ref,
@@ -3829,9 +3891,9 @@ var TableRow = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TableRow.displayName = "TableRow";
-var TableHead = React30.forwardRef(({ className, ...props }, ref) => {
+var TableHead = React31.forwardRef(({ className, ...props }, ref) => {
   const size = useTableSize();
-  return /* @__PURE__ */ jsx40(
+  return /* @__PURE__ */ jsx41(
     "th",
     {
       ref,
@@ -3846,9 +3908,9 @@ var TableHead = React30.forwardRef(({ className, ...props }, ref) => {
   );
 });
 TableHead.displayName = "TableHead";
-var TableCell = React30.forwardRef(({ className, ...props }, ref) => {
+var TableCell = React31.forwardRef(({ className, ...props }, ref) => {
   const size = useTableSize();
-  return /* @__PURE__ */ jsx40(
+  return /* @__PURE__ */ jsx41(
     "td",
     {
       ref,
@@ -3863,7 +3925,7 @@ var TableCell = React30.forwardRef(({ className, ...props }, ref) => {
   );
 });
 TableCell.displayName = "TableCell";
-var TableCaption = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var TableCaption = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
   "caption",
   {
     ref,
@@ -3876,11 +3938,11 @@ TableCaption.displayName = "TableCaption";
 
 // src/tabs.tsx
 import * as TabsPrimitive from "@radix-ui/react-tabs";
-import * as React31 from "react";
-import { jsx as jsx41 } from "react/jsx-runtime";
+import * as React32 from "react";
+import { jsx as jsx42 } from "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 = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
+var TabsList = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx42(
   TabsPrimitive.List,
   {
     ref,
@@ -3893,7 +3955,7 @@ var TabsList = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TabsList.displayName = TabsPrimitive.List.displayName;
-var TabsTrigger = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
+var TabsTrigger = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx42(
   TabsPrimitive.Trigger,
   {
     ref,
@@ -3907,7 +3969,7 @@ var TabsTrigger = React31.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-var TabsTriggerCore = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
+var TabsTriggerCore = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx42(
   TabsPrimitive.Trigger,
   {
     ref,
@@ -3917,7 +3979,7 @@ var TabsTriggerCore = React31.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 TabsTriggerCore.displayName = TabsPrimitive.Trigger.displayName;
-var TabsContent = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
+var TabsContent = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx42(
   TabsPrimitive.Content,
   {
     ref,
@@ -3933,8 +3995,8 @@ var TabsContent = React31.forwardRef(({ className, ...props }, ref) => /* @__PUR
 TabsContent.displayName = TabsPrimitive.Content.displayName;
 
 // src/textarea.tsx
-import * as React32 from "react";
-import { jsx as jsx42, jsxs as jsxs23 } from "react/jsx-runtime";
+import * as React33 from "react";
+import { jsx as jsx43, jsxs as jsxs25 } from "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) {
@@ -3947,7 +4009,7 @@ function getStretchClasses(className) {
 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) {
-  React32.useEffect(() => {
+  React33.useEffect(() => {
     if (!autoGrow || !ref.current) return;
     const textarea = ref.current;
     textarea.style.height = "auto";
@@ -3963,8 +4025,8 @@ function useAutoGrow(ref, value, autoGrow = false, minHeight, maxHeight) {
   }, [value, autoGrow, minHeight, maxHeight, ref]);
 }
 function useMergedTextareaRef(forwarded) {
-  const internal = React32.useRef(null);
-  const callback = React32.useCallback(
+  const internal = React33.useRef(null);
+  const callback = React33.useCallback(
     (node) => {
       internal.current = node;
       if (typeof forwarded === "function") forwarded(node);
@@ -3981,13 +4043,13 @@ function boxStyle(minHeight, maxHeight) {
     maxHeight: maxHeight ? `${maxHeight}px` : void 0
   };
 }
-var Textarea = React32.forwardRef(
+var Textarea = React33.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__ */ jsx42(
+    const textarea = /* @__PURE__ */ jsx43(
       "textarea",
       {
         ref: callback,
@@ -4003,15 +4065,15 @@ var Textarea = React32.forwardRef(
       }
     );
     if (!needsWrapper) return textarea;
-    return /* @__PURE__ */ jsx42("div", { className: cn(stretchClasses, wrapperClassName), children: textarea });
+    return /* @__PURE__ */ jsx43("div", { className: cn(stretchClasses, wrapperClassName), children: textarea });
   }
 );
 Textarea.displayName = "Textarea";
-var BasicTextarea = React32.forwardRef(
+var BasicTextarea = React33.forwardRef(
   ({ className, autoGrow, minHeight, maxHeight, ...props }, forwarded) => {
     const { ref, callback } = useMergedTextareaRef(forwarded);
     useAutoGrow(ref, props.value, autoGrow, minHeight, maxHeight);
-    return /* @__PURE__ */ jsx42(
+    return /* @__PURE__ */ jsx43(
       "textarea",
       {
         ref: callback,
@@ -4029,7 +4091,7 @@ var BasicTextarea = React32.forwardRef(
   }
 );
 BasicTextarea.displayName = "BasicTextarea";
-var TextareaWithPrefix = React32.forwardRef(
+var TextareaWithPrefix = React33.forwardRef(
   ({
     prefix,
     className,
@@ -4041,13 +4103,13 @@ var TextareaWithPrefix = React32.forwardRef(
   }, forwarded) => {
     const { ref, callback } = useMergedTextareaRef(forwarded);
     useAutoGrow(ref, props.value, autoGrow, minHeight, maxHeight);
-    return /* @__PURE__ */ jsxs23(
+    return /* @__PURE__ */ jsxs25(
       "div",
       {
         className: cn("relative", getStretchClasses(className), wrapperClassName),
         children: [
-          prefix ? /* @__PURE__ */ jsx42("div", { className: "pointer-events-none absolute left-3 top-3 z-10 text-muted-foreground", children: prefix }) : null,
-          /* @__PURE__ */ jsx42(
+          prefix ? /* @__PURE__ */ jsx43("div", { className: "pointer-events-none absolute left-3 top-3 z-10 text-muted-foreground", children: prefix }) : null,
+          /* @__PURE__ */ jsx43(
             "textarea",
             {
               ref: callback,
@@ -4126,14 +4188,14 @@ function useScrollFade() {
 
 // src/hover-card.tsx
 import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
-import * as React33 from "react";
-import { jsx as jsx43 } from "react/jsx-runtime";
+import * as React34 from "react";
+import { jsx as jsx44 } from "react/jsx-runtime";
 var HoverCard = HoverCardPrimitive.Root;
 var HoverCardTrigger = HoverCardPrimitive.Trigger;
-var HoverCardContent = React33.forwardRef(
+var HoverCardContent = React34.forwardRef(
   ({ className, align = "center", sideOffset = 4, container, animated = true, ...props }, ref) => {
     const resolved = usePortalContainer(container);
-    return /* @__PURE__ */ jsx43(HoverCardPrimitive.Portal, { container: resolved ?? null, children: /* @__PURE__ */ jsx43(
+    return /* @__PURE__ */ jsx44(HoverCardPrimitive.Portal, { container: resolved ?? null, children: /* @__PURE__ */ jsx44(
       HoverCardPrimitive.Content,
       {
         ref,
@@ -4154,9 +4216,9 @@ HoverCardContent.displayName = HoverCardPrimitive.Content.displayName;
 
 // src/radio-group.tsx
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
-import * as React34 from "react";
-import { jsx as jsx44 } from "react/jsx-runtime";
-var RadioGroupSizeContext = React34.createContext("md");
+import * as React35 from "react";
+import { jsx as jsx45 } from "react/jsx-runtime";
+var RadioGroupSizeContext = React35.createContext("md");
 var CONTROL_CLASSES = {
   sm: "h-3.5 w-3.5",
   md: "h-4 w-4",
@@ -4167,7 +4229,7 @@ var DOT_CLASSES = {
   md: "h-1.5 w-1.5",
   lg: "h-2 w-2"
 };
-var RadioGroup3 = React34.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ jsx44(RadioGroupSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsx44(
+var RadioGroup3 = React35.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ jsx45(RadioGroupSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsx45(
   RadioGroupPrimitive.Root,
   {
     ref,
@@ -4177,10 +4239,10 @@ var RadioGroup3 = React34.forwardRef(({ className, size = "md", ...props }, ref)
   }
 ) }));
 RadioGroup3.displayName = RadioGroupPrimitive.Root.displayName;
-var RadioGroupItem = React34.forwardRef(({ className, size, ...props }, ref) => {
-  const groupSize = React34.useContext(RadioGroupSizeContext);
+var RadioGroupItem = React35.forwardRef(({ className, size, ...props }, ref) => {
+  const groupSize = React35.useContext(RadioGroupSizeContext);
   const resolved = size ?? groupSize;
-  return /* @__PURE__ */ jsx44(
+  return /* @__PURE__ */ jsx45(
     RadioGroupPrimitive.Item,
     {
       ref,
@@ -4197,7 +4259,7 @@ var RadioGroupItem = React34.forwardRef(({ className, size, ...props }, ref) =>
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx44(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx44(
+      children: /* @__PURE__ */ jsx45(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx45(
         "div",
         {
           className: cn("rounded-full bg-primary-foreground", DOT_CLASSES[resolved])
@@ -4210,7 +4272,7 @@ RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
 
 // src/resizable.tsx
 import { Group as Group4, Panel, Separator as Separator5 } from "react-resizable-panels";
-import { jsx as jsx45 } from "react/jsx-runtime";
+import { jsx as jsx46 } from "react/jsx-runtime";
 var HANDLE_SIZES = {
   xs: "w-0.5 [&[aria-orientation=horizontal]]:h-0.5 [&[aria-orientation=horizontal]]:w-full",
   sm: "w-1 [&[aria-orientation=horizontal]]:h-1 [&[aria-orientation=horizontal]]:w-full",
@@ -4224,7 +4286,7 @@ var HANDLE_SIZES = {
 var ResizablePanelGroup = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx45(
+}) => /* @__PURE__ */ jsx46(
   Group4,
   {
     "data-slot": "resizable-group",
@@ -4239,7 +4301,7 @@ var ResizableHandle = ({
   size = "xs",
   className,
   ...props
-}) => /* @__PURE__ */ jsx45(
+}) => /* @__PURE__ */ jsx46(
   Separator5,
   {
     "data-slot": "resizable-handle",
@@ -4259,15 +4321,15 @@ var ResizableHandle = ({
       className
     ),
     ...props,
-    children: withHandle ? /* @__PURE__ */ jsx45("div", { className: "z-10 flex h-8 w-4 items-center justify-center rounded-sm border bg-border group-aria-[orientation=horizontal]/handle:h-4 group-aria-[orientation=horizontal]/handle:w-8", children: /* @__PURE__ */ jsx45(DragHandleDots2Icon, { className: "h-2.5 w-2.5 group-aria-[orientation=horizontal]/handle:rotate-90" }) }) : null
+    children: withHandle ? /* @__PURE__ */ jsx46("div", { className: "z-10 flex h-8 w-4 items-center justify-center rounded-sm border bg-border group-aria-[orientation=horizontal]/handle:h-4 group-aria-[orientation=horizontal]/handle:w-8", children: /* @__PURE__ */ jsx46(DragHandleDots2Icon, { className: "h-2.5 w-2.5 group-aria-[orientation=horizontal]/handle:rotate-90" }) }) : null
   }
 );
 ResizableHandle.displayName = "ResizableHandle";
 
 // src/slider.tsx
 import * as SliderPrimitive from "@radix-ui/react-slider";
-import * as React35 from "react";
-import { jsx as jsx46, jsxs as jsxs24 } from "react/jsx-runtime";
+import * as React36 from "react";
+import { jsx as jsx47, jsxs as jsxs26 } from "react/jsx-runtime";
 var TRACK_CLASSES = {
   sm: "h-1",
   md: "h-1.5",
@@ -4278,12 +4340,12 @@ var THUMB_CLASSES = {
   md: "h-4 w-4",
   lg: "h-5 w-5"
 };
-var Slider = React35.forwardRef(({ className, size = "md", ...props }, ref) => {
+var Slider = React36.forwardRef(({ className, size = "md", ...props }, ref) => {
   const thumbCount = Math.max(
     1,
     (props.value ?? props.defaultValue ?? [0]).length
   );
-  return /* @__PURE__ */ jsxs24(
+  return /* @__PURE__ */ jsxs26(
     SliderPrimitive.Root,
     {
       ref,
@@ -4295,7 +4357,7 @@ var Slider = React35.forwardRef(({ className, size = "md", ...props }, ref) => {
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx46(
+        /* @__PURE__ */ jsx47(
           SliderPrimitive.Track,
           {
             "data-slot": "slider-track",
@@ -4304,7 +4366,7 @@ var Slider = React35.forwardRef(({ className, size = "md", ...props }, ref) => {
               TRACK_CLASSES[size],
               "data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"
             ),
-            children: /* @__PURE__ */ jsx46(
+            children: /* @__PURE__ */ jsx47(
               SliderPrimitive.Range,
               {
                 "data-slot": "slider-range",
@@ -4313,7 +4375,7 @@ var Slider = React35.forwardRef(({ className, size = "md", ...props }, ref) => {
             )
           }
         ),
-        Array.from({ length: thumbCount }, (_, index) => /* @__PURE__ */ jsx46(
+        Array.from({ length: thumbCount }, (_, index) => /* @__PURE__ */ jsx47(
           SliderPrimitive.Thumb,
           {
             "data-slot": "slider-thumb",
@@ -4340,8 +4402,8 @@ Slider.displayName = SliderPrimitive.Root.displayName;
 import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
 import * as TogglePrimitive from "@radix-ui/react-toggle";
 import { cva as cva6 } from "class-variance-authority";
-import * as React36 from "react";
-import { jsx as jsx47 } from "react/jsx-runtime";
+import * as React37 from "react";
+import { jsx as jsx48 } from "react/jsx-runtime";
 var toggleVariants = cva6(
   "inline-flex cursor-pointer items-center justify-center gap-2 rounded-md text-sm font-medium transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
   {
@@ -4362,7 +4424,7 @@ var toggleVariants = cva6(
     }
   }
 );
-var Toggle = React36.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ jsx47(
+var Toggle = React37.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ jsx48(
   TogglePrimitive.Root,
   {
     ref,
@@ -4372,21 +4434,21 @@ var Toggle = React36.forwardRef(({ className, variant, size, ...props }, ref) =>
   }
 ));
 Toggle.displayName = TogglePrimitive.Root.displayName;
-var ToggleGroupContext = React36.createContext({ size: "default", variant: "default" });
-var ToggleGroup = React36.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ jsx47(
+var ToggleGroupContext = React37.createContext({ size: "default", variant: "default" });
+var ToggleGroup = React37.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ jsx48(
   ToggleGroupPrimitive.Root,
   {
     ref,
     "data-slot": "toggle-group",
     className: cn("flex items-center justify-center gap-1", className),
     ...props,
-    children: /* @__PURE__ */ jsx47(ToggleGroupContext.Provider, { value: { variant, size }, children })
+    children: /* @__PURE__ */ jsx48(ToggleGroupContext.Provider, { value: { variant, size }, children })
   }
 ));
 ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
-var ToggleGroupItem = React36.forwardRef(({ className, children, variant, size, ...props }, ref) => {
-  const context = React36.useContext(ToggleGroupContext);
-  return /* @__PURE__ */ jsx47(
+var ToggleGroupItem = React37.forwardRef(({ className, children, variant, size, ...props }, ref) => {
+  const context = React37.useContext(ToggleGroupContext);
+  return /* @__PURE__ */ jsx48(
     ToggleGroupPrimitive.Item,
     {
       ref,
@@ -4407,14 +4469,14 @@ ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
 
 // src/tooltip.tsx
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import * as React37 from "react";
-import { jsx as jsx48 } from "react/jsx-runtime";
+import * as React38 from "react";
+import { jsx as jsx49 } from "react/jsx-runtime";
 var TooltipProvider = TooltipPrimitive.Provider;
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
-var TooltipContent = React37.forwardRef(({ className, sideOffset = 4, container, animated = true, ...props }, ref) => {
+var TooltipContent = React38.forwardRef(({ className, sideOffset = 4, container, animated = true, ...props }, ref) => {
   const resolved = usePortalContainer(container);
-  return /* @__PURE__ */ jsx48(TooltipPrimitive.Portal, { container: resolved ?? null, children: /* @__PURE__ */ jsx48(
+  return /* @__PURE__ */ jsx49(TooltipPrimitive.Portal, { container: resolved ?? null, children: /* @__PURE__ */ jsx49(
     TooltipPrimitive.Content,
     {
       ref,
@@ -4434,7 +4496,7 @@ TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 // src/tap-target/tap-target-button.tsx
 import {
   cloneElement,
-  forwardRef as forwardRef31,
+  forwardRef as forwardRef32,
   isValidElement
 } from "react";
 
@@ -4453,7 +4515,7 @@ function getTapTargetLinkComponent() {
 }
 
 // src/tap-target/tap-target-button.tsx
-import { jsx as jsx49, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs27 } from "react/jsx-runtime";
 var EXTERNAL_RE = /^(https?:|mailto:|tel:)/i;
 var TAP_OUTER_CLASS = "matrx-tap-target group";
 var TAP_GROUP_OUTER_CLASS = "matrx-tap-target matrx-tap-target-sm group";
@@ -4469,9 +4531,9 @@ function IconContent({
         className: cn2(className, icon.props.className)
       });
     }
-    return /* @__PURE__ */ jsx49("span", { className, children: icon });
+    return /* @__PURE__ */ jsx50("span", { className, children: icon });
   }
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     "svg",
     {
       className,
@@ -4508,7 +4570,7 @@ function buildTapInner({
   children,
   strokeWidth = 2
 }) {
-  const iconEl = /* @__PURE__ */ jsx49(
+  const iconEl = /* @__PURE__ */ jsx50(
     IconContent,
     {
       icon,
@@ -4519,11 +4581,11 @@ function buildTapInner({
   );
   const pillClasses = label ? `${pillClassName} ${inlineModifier}`.trim() : pillClassName;
   if (!label) {
-    return /* @__PURE__ */ jsx49("div", { className: pillClasses, children: iconEl });
+    return /* @__PURE__ */ jsx50("div", { className: pillClasses, children: iconEl });
   }
-  return /* @__PURE__ */ jsxs25("div", { className: pillClasses, children: [
+  return /* @__PURE__ */ jsxs27("div", { className: pillClasses, children: [
     iconEl,
-    /* @__PURE__ */ jsx49("span", { className: labelClassName ?? "matrx-tap-label", children: label })
+    /* @__PURE__ */ jsx50("span", { className: labelClassName ?? "matrx-tap-label", children: label })
   ] });
 }
 function renderTapTarget({
@@ -4611,7 +4673,7 @@ function renderTrigger({
   buttonRef
 }) {
   if (disabled && href) {
-    return /* @__PURE__ */ jsx49(
+    return /* @__PURE__ */ jsx50(
       "span",
       {
         "aria-disabled": "true",
@@ -4624,7 +4686,7 @@ function renderTrigger({
   if (href) {
     const isExternal = EXTERNAL_RE.test(href);
     if (isExternal) {
-      return /* @__PURE__ */ jsx49(
+      return /* @__PURE__ */ jsx50(
         "a",
         {
           href,
@@ -4638,7 +4700,7 @@ function renderTrigger({
     }
     const Link = linkComponent ?? getTapTargetLinkComponent();
     if (Link) {
-      return /* @__PURE__ */ jsx49(
+      return /* @__PURE__ */ jsx50(
         Link,
         {
           href,
@@ -4651,7 +4713,7 @@ function renderTrigger({
         }
       );
     }
-    return /* @__PURE__ */ jsx49(
+    return /* @__PURE__ */ jsx50(
       "a",
       {
         href,
@@ -4664,7 +4726,7 @@ function renderTrigger({
     );
   }
   if (as === "label") {
-    return /* @__PURE__ */ jsx49(
+    return /* @__PURE__ */ jsx50(
       "label",
       {
         htmlFor,
@@ -4674,7 +4736,7 @@ function renderTrigger({
       }
     );
   }
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     "button",
     {
       ref: buttonRef,
@@ -4698,17 +4760,17 @@ function withTooltip(trigger, {
   if (tooltip === false) return trigger;
   const label = typeof tooltip === "string" && tooltip.length > 0 ? tooltip : ariaLabel;
   if (!label) return trigger;
-  return /* @__PURE__ */ jsxs25(Tooltip, { children: [
-    /* @__PURE__ */ jsx49(TooltipTrigger, { asChild: true, children: disabled ? (
+  return /* @__PURE__ */ jsxs27(Tooltip, { children: [
+    /* @__PURE__ */ jsx50(TooltipTrigger, { asChild: true, children: disabled ? (
       // Radix Tooltip triggers need a hoverable element; a disabled button
       // does not dispatch pointer events, so we wrap in a span for the
       // trigger target while keeping the disabled visual state.
-      /* @__PURE__ */ jsx49("span", { className: "inline-flex", children: trigger })
+      /* @__PURE__ */ jsx50("span", { className: "inline-flex", children: trigger })
     ) : trigger }),
-    /* @__PURE__ */ jsx49(TooltipContent, { side: tooltipSide, align: tooltipAlign, children: label })
+    /* @__PURE__ */ jsx50(TooltipContent, { side: tooltipSide, align: tooltipAlign, children: label })
   ] });
 }
-var TapTargetButton = forwardRef31(function TapTargetButton2({
+var TapTargetButton = forwardRef32(function TapTargetButton2({
   icon,
   children,
   strokeWidth = 2,
@@ -4756,7 +4818,7 @@ var TapTargetButton = forwardRef31(function TapTargetButton2({
     buttonRef: ref
   });
 });
-var TapTargetButtonTransparent = forwardRef31(function TapTargetButtonTransparent2({
+var TapTargetButtonTransparent = forwardRef32(function TapTargetButtonTransparent2({
   icon,
   children,
   strokeWidth = 2,
@@ -4804,7 +4866,7 @@ var TapTargetButtonTransparent = forwardRef31(function TapTargetButtonTransparen
     buttonRef: ref
   });
 });
-var TapTargetButtonSolid = forwardRef31(function TapTargetButtonSolid2({
+var TapTargetButtonSolid = forwardRef32(function TapTargetButtonSolid2({
   icon,
   children,
   strokeWidth = 2,
@@ -4855,13 +4917,13 @@ var TapTargetButtonSolid = forwardRef31(function TapTargetButtonSolid2({
     buttonRef: ref
   });
 });
-var TapTargetButtonDestructive = forwardRef31(function TapTargetButtonDestructive2({
+var TapTargetButtonDestructive = forwardRef32(function TapTargetButtonDestructive2({
   bgColor = "bg-destructive",
   iconColor = "text-destructive-foreground",
   hoverBgColor = "hover:bg-destructive/90",
   ...rest
 }, ref) {
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     TapTargetButtonSolid,
     {
       ref,
@@ -4872,7 +4934,7 @@ var TapTargetButtonDestructive = forwardRef31(function TapTargetButtonDestructiv
     }
   );
 });
-var TapTargetButtonForGroup = forwardRef31(function TapTargetButtonForGroup2({
+var TapTargetButtonForGroup = forwardRef32(function TapTargetButtonForGroup2({
   icon,
   children,
   strokeWidth = 2,
@@ -4926,32 +4988,32 @@ function TapTargetButtonGroup({
   children,
   className
 }) {
-  return /* @__PURE__ */ jsxs25(
+  return /* @__PURE__ */ jsxs27(
     "div",
     {
       className: className ? `relative inline-flex h-9 items-center ${className}` : "relative inline-flex h-9 items-center",
       children: [
-        /* @__PURE__ */ jsx49("div", { className: "pointer-events-none absolute inset-x-0 top-1/2 -translate-y-1/2 h-7 rounded-full matrx-glass-thin-border" }),
-        /* @__PURE__ */ jsx49("div", { className: "relative flex min-w-0 items-center", children })
+        /* @__PURE__ */ jsx50("div", { className: "pointer-events-none absolute inset-x-0 top-1/2 -translate-y-1/2 h-7 rounded-full matrx-glass-thin-border" }),
+        /* @__PURE__ */ jsx50("div", { className: "relative flex min-w-0 items-center", children })
       ]
     }
   );
 }
 
 // src/tap-target/tap-target-labeled.tsx
-import { jsx as jsx50, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs28 } from "react/jsx-runtime";
 function TapTargetLabeled({
   label,
   children,
   hideLabel = false,
   toolTipSide = "bottom"
 }) {
-  return /* @__PURE__ */ jsx50(TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ jsxs26(Tooltip, { children: [
-    /* @__PURE__ */ jsx50(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs26("div", { className: "flex flex-col items-center p-0 gap-0 space-y-0 space-x-0 shrink-0", children: [
+  return /* @__PURE__ */ jsx51(TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ jsxs28(Tooltip, { children: [
+    /* @__PURE__ */ jsx51(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs28("div", { className: "flex flex-col items-center p-0 gap-0 space-y-0 space-x-0 shrink-0", children: [
       children,
-      !hideLabel && /* @__PURE__ */ jsx50("span", { className: "text-[10px] text-muted-foreground/70 leading-tight max-w-[52px] text-center truncate", children: label })
+      !hideLabel && /* @__PURE__ */ jsx51("span", { className: "text-[10px] text-muted-foreground/70 leading-tight max-w-[52px] text-center truncate", children: label })
     ] }) }),
-    /* @__PURE__ */ jsx50(TooltipContent, { side: toolTipSide, children: /* @__PURE__ */ jsx50("span", { className: "font-mono text-xs max-w-[280px] break-all", children: label }) })
+    /* @__PURE__ */ jsx51(TooltipContent, { side: toolTipSide, children: /* @__PURE__ */ jsx51("span", { className: "font-mono text-xs max-w-[280px] break-all", children: label }) })
   ] }) });
 }
 export {
@@ -5072,6 +5134,9 @@ export {
   DropdownMenuTrigger,
   EditableLabel,
   EnterInput,
+  ErrorActions,
+  ErrorActionsProvider,
+  ErrorBox,
   FORBIDDEN_HOST_MOTION_UTILITIES,
   HoverCard,
   HoverCardContent,
@@ -5178,6 +5243,7 @@ export {
   useCardSize,
   useDialogContainer,
   useDrawerDirection,
+  useErrorActions,
   useIsMobile,
   usePortalContainer,
   useRadixDialogModal,