@ai-matrx/design-system 0.60.8 → 0.60.9

package/dist/index.cjs

@@ -184,6 +184,7 @@ __export(src_exports, {
   OrganizationMark: () => OrganizationMark,
   OrganizationPicker: () => OrganizationPicker,
   OverflowToolbar: () => OverflowToolbar,
+  PILL_MAX_WIDTH_PX: () => PILL_MAX_WIDTH_PX,
   POPPER_OFFSET: () => POPPER_OFFSET,
   Popover: () => Popover,
   PopoverAnchor: () => PopoverAnchor,
@@ -290,7 +291,9 @@ __export(src_exports, {
   badgeVariants: () => badgeVariants,
   buttonVariants: () => buttonVariants,
   cn: () => cn,
+  enablePillGuard: () => enablePillGuard,
   enableTapTargetGuard: () => enableTapTargetGuard,
+  findPillViolation: () => findPillViolation,
   findTapPlacementWarning: () => findTapPlacementWarning,
   findTapViolation: () => findTapViolation,
   floatingLayerZIndex: () => floatingLayerZIndex,
@@ -608,9 +611,10 @@ AccordionContent.displayName = "AccordionContent";
 
 // src/badge.tsx
 var import_class_variance_authority = require("class-variance-authority");
+var React2 = __toESM(require("react"), 1);
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var badgeVariants = (0, import_class_variance_authority.cva)(
-  "inline-flex items-center rounded-md border px-2 py-0.5 text-[11px] font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-0",
+  "inline-flex min-w-0 max-w-[16rem] items-center gap-1 whitespace-nowrap rounded-md border px-2 py-0.5 text-[11px] font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-0 [&>svg]:shrink-0",
   {
     variants: {
       variant: {
@@ -630,8 +634,136 @@ var badgeVariants = (0, import_class_variance_authority.cva)(
     }
   }
 );
-function Badge({ className, variant, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { "data-slot": "badge", className: cn(badgeVariants({ variant }), className), ...props });
+function textOf(children) {
+  const parts = [];
+  let onlyText = true;
+  React2.Children.forEach(children, (c) => {
+    if (typeof c === "string" || typeof c === "number") parts.push(String(c));
+    else if (c != null && typeof c !== "boolean") onlyText = false;
+  });
+  const text = parts.join("").trim();
+  return onlyText && text ? text : null;
+}
+function Badge({ className, variant, children, title, ...props }) {
+  const clamped = React2.Children.map(
+    children,
+    (c) => typeof c === "string" || typeof c === "number" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { "data-slot": "badge-text", className: "min-w-0 truncate", children: c }) : c
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "span",
+    {
+      "data-slot": "badge",
+      title: title ?? textOf(children) ?? void 0,
+      className: cn(badgeVariants({ variant }), className),
+      ...props,
+      children: clamped
+    }
+  );
+}
+
+// src/pill-guard.ts
+var PILL_MAX_WIDTH_PX = 320;
+var SELECTOR = [
+  '[data-slot="badge"]',
+  "[data-matrx-pill]",
+  "a.rounded-full",
+  "button.rounded-full",
+  "span.rounded-full",
+  "div.rounded-full"
+].join(",");
+var SLOT = /* @__PURE__ */ Symbol.for("@ai-matrx/design-system:pill-guard");
+function px(v) {
+  const n = Number.parseFloat(v ?? "");
+  return Number.isFinite(n) ? n : 0;
+}
+function describe(el) {
+  const t = (el.textContent ?? "").replace(/\s+/g, " ").trim();
+  return t.length > 60 ? `${t.slice(0, 57)}\u2026` : t;
+}
+function findPillViolation(el, maxWidth = PILL_MAX_WIDTH_PX) {
+  if (el.getAttribute("data-matrx-pill") === "off") return null;
+  const text = (el.textContent ?? "").trim();
+  if (!text) return null;
+  const view = el.ownerDocument.defaultView;
+  if (!view) return null;
+  const rect = el.getBoundingClientRect();
+  if (rect.width === 0 || rect.height === 0) return null;
+  const cs = view.getComputedStyle(el);
+  if (cs.display === "none" || cs.visibility === "hidden") return null;
+  if (rect.width > maxWidth + 0.5) {
+    return `pill is ${Math.round(rect.width)}px wide (budget ${maxWidth}px) holding "${describe(el)}" \u2014 a pill holds a short label: clamp it (Badge, or truncate + max-w + title) or render a list row.`;
+  }
+  const fontSize = px(cs.fontSize) || 12;
+  const lineHeight = px(cs.lineHeight) || fontSize * 1.4;
+  const inner = rect.height - px(cs.paddingTop) - px(cs.paddingBottom) - px(cs.borderTopWidth) - px(cs.borderBottomWidth);
+  if (inner > lineHeight * 1.5) {
+    const lines = Math.round(inner / lineHeight);
+    return `pill wraps to ${lines} lines holding "${describe(el)}" \u2014 a pill is one line: clamp it (Badge, or truncate + max-w + title) or render a list row.`;
+  }
+  return null;
+}
+var OUTLINE = "2px dashed hsl(var(--destructive))";
+function enablePillGuard(options = {}) {
+  const g = globalThis;
+  if (g[SLOT]) return g[SLOT];
+  const doc = options.root ?? (typeof document === "undefined" ? null : document);
+  const view = doc?.defaultView;
+  if (!doc || !view) return () => {
+  };
+  const maxWidth = options.maxWidth ?? PILL_MAX_WIDTH_PX;
+  const marked = /* @__PURE__ */ new Map();
+  const reported2 = /* @__PURE__ */ new Set();
+  let timer = null;
+  let observer = null;
+  const scan = () => {
+    timer = null;
+    observer?.disconnect();
+    for (const [el, before] of marked) {
+      if (!el.isConnected || !findPillViolation(el, maxWidth)) {
+        el.style.outline = before;
+        el.removeAttribute("data-matrx-pill-violation");
+        marked.delete(el);
+      }
+    }
+    doc.querySelectorAll(SELECTOR).forEach((el) => {
+      const reason = findPillViolation(el, maxWidth);
+      if (!reason) return;
+      if (!marked.has(el)) marked.set(el, el.style.outline);
+      el.style.outline = OUTLINE;
+      el.style.outlineOffset = "1px";
+      el.setAttribute("data-matrx-pill-violation", reason);
+      if (!reported2.has(reason)) {
+        reported2.add(reason);
+        console.error(`[pill-guard] ${reason}`, el);
+      }
+    });
+    observe();
+  };
+  const schedule = () => {
+    if (timer) clearTimeout(timer);
+    timer = setTimeout(scan, 400);
+  };
+  const observe = () => {
+    if (!doc.body) return;
+    observer ??= new view.MutationObserver(schedule);
+    observer.observe(doc.body, { childList: true, subtree: true, characterData: true });
+  };
+  view.addEventListener("resize", schedule);
+  observe();
+  schedule();
+  const off = () => {
+    observer?.disconnect();
+    view.removeEventListener("resize", schedule);
+    if (timer) clearTimeout(timer);
+    for (const [el, before] of marked) {
+      el.style.outline = before;
+      el.removeAttribute("data-matrx-pill-violation");
+    }
+    marked.clear();
+    delete g[SLOT];
+  };
+  g[SLOT] = off;
+  return off;
 }
 
 // src/bottom-sheet.tsx
@@ -640,13 +772,13 @@ var import_vaul2 = require("vaul");
 
 // src/drawer.tsx
 var import_react_tree = require("@ai-matrx/kit/react-tree");
-var React4 = __toESM(require("react"), 1);
+var React5 = __toESM(require("react"), 1);
 var import_vaul = require("vaul");
 
 // src/floating-layer.tsx
 var import_react_focus_scope = require("@radix-ui/react-focus-scope");
 var import_react_slot = require("@radix-ui/react-slot");
-var React2 = __toESM(require("react"), 1);
+var React3 = __toESM(require("react"), 1);
 var import_jsx_runtime4 = require("react/jsx-runtime");
 var MODAL_LAYER_Z = 1e4;
 var FLOATING_LAYER_ATTR = "data-matrx-floating-layer";
@@ -691,10 +823,10 @@ function subscribe(listener) {
   return () => registry.listeners.delete(listener);
 }
 function useModalLayerOpen() {
-  return React2.useSyncExternalStore(subscribe, isModalLayerOpen, () => false);
+  return React3.useSyncExternalStore(subscribe, isModalLayerOpen, () => false);
 }
 function useModalLayer(active) {
-  React2.useLayoutEffect(() => active ? registerModalLayer() : void 0, [active]);
+  React3.useLayoutEffect(() => active ? registerModalLayer() : void 0, [active]);
 }
 var POPPER_WRAPPER = "[data-radix-popper-content-wrapper]";
 function isInsideFloatingLayer(target) {
@@ -715,8 +847,8 @@ function useFloatingLayerZIndex(ownZ) {
   return floatingLayerZIndex(ownZ, useModalLayerOpen());
 }
 var preventAutoFocus = (event) => event.preventDefault();
-var FloatingLayer = React2.forwardRef(({ children }, ref) => {
-  const [opener] = React2.useState(
+var FloatingLayer = React3.forwardRef(({ children }, ref) => {
+  const [opener] = React3.useState(
     () => typeof document === "undefined" ? null : document.activeElement
   );
   const returnFocus = (event) => {
@@ -750,11 +882,11 @@ var FloatingLayer = React2.forwardRef(({ children }, ref) => {
 FloatingLayer.displayName = "FloatingLayer";
 
 // src/radix-dialog-modal-context.tsx
-var React3 = __toESM(require("react"), 1);
+var React4 = __toESM(require("react"), 1);
 var import_jsx_runtime5 = require("react/jsx-runtime");
 var CONTEXT_SLOT = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.dialog-modal-context");
 var contextRegistry = globalThis;
-var RadixDialogModalContext = contextRegistry[CONTEXT_SLOT] ??= React3.createContext(true);
+var RadixDialogModalContext = contextRegistry[CONTEXT_SLOT] ??= React4.createContext(true);
 function RadixDialogModalProvider({
   children,
   modal
@@ -762,13 +894,13 @@ function RadixDialogModalProvider({
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RadixDialogModalContext.Provider, { value: modal, children });
 }
 function useRadixDialogModal() {
-  return React3.useContext(RadixDialogModalContext);
+  return React4.useContext(RadixDialogModalContext);
 }
 
 // src/drawer.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
-var DrawerDirectionContext = React4.createContext("bottom");
-var useDrawerDirection = () => React4.useContext(DrawerDirectionContext);
+var DrawerDirectionContext = React5.createContext("bottom");
+var useDrawerDirection = () => React5.useContext(DrawerDirectionContext);
 var Drawer = ({
   children,
   shouldScaleBackground = true,
@@ -798,7 +930,7 @@ Drawer.displayName = "Drawer";
 var DrawerTrigger = import_vaul.Drawer.Trigger;
 var DrawerPortal = import_vaul.Drawer.Portal;
 var DrawerClose = import_vaul.Drawer.Close;
-var DrawerOverlay = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+var DrawerOverlay = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
   import_vaul.Drawer.Overlay,
   {
     ref,
@@ -811,7 +943,7 @@ var DrawerOverlay = React4.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 DrawerOverlay.displayName = import_vaul.Drawer.Overlay.displayName;
-var DrawerDescription = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+var DrawerDescription = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
   import_vaul.Drawer.Description,
   {
     ref,
@@ -821,7 +953,7 @@ var DrawerDescription = React4.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 DrawerDescription.displayName = import_vaul.Drawer.Description.displayName;
-var DrawerContentPrimitive = React4.forwardRef(({ onInteractOutside, ...props }, ref) => {
+var DrawerContentPrimitive = React5.forwardRef(({ onInteractOutside, ...props }, ref) => {
   useModalLayer(true);
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     import_vaul.Drawer.Content,
@@ -847,7 +979,7 @@ var SIZE_CLASSES = {
   left: { adaptive: "w-auto max-w-[92vw]", full: "h-dvh w-[92vw] max-w-sm" },
   right: { adaptive: "w-auto max-w-[92vw]", full: "h-dvh w-[92vw] max-w-sm" }
 };
-var DrawerContent = React4.forwardRef(({ className, children, size = "adaptive", showHandle, ...props }, ref) => {
+var DrawerContent = React5.forwardRef(({ className, children, size = "adaptive", showHandle, ...props }, ref) => {
   const direction = useDrawerDirection();
   const hasDescription = (0, import_react_tree.treeContainsComponent)(children, DrawerDescription) || (0, import_react_tree.treeContainsComponent)(children, import_vaul.Drawer.Description);
   const withHandle = showHandle ?? (direction === "bottom" || direction === "top");
@@ -929,7 +1061,7 @@ var DrawerFooter = ({
   }
 );
 DrawerFooter.displayName = "DrawerFooter";
-var DrawerTitle = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+var DrawerTitle = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
   import_vaul.Drawer.Title,
   {
     ref,
@@ -1051,14 +1183,14 @@ function BottomSheetFooter({
 
 // src/alert.tsx
 var import_class_variance_authority2 = require("class-variance-authority");
-var React6 = __toESM(require("react"), 1);
+var React7 = __toESM(require("react"), 1);
 
 // src/error-box.tsx
-var React5 = __toESM(require("react"), 1);
+var React6 = __toESM(require("react"), 1);
 var import_jsx_runtime8 = require("react/jsx-runtime");
 var CONTEXT_KEY = /* @__PURE__ */ Symbol.for("@ai-matrx/design-system/error-actions");
 var registry2 = globalThis;
-var ErrorActionsContext = registry2[CONTEXT_KEY] ?? (registry2[CONTEXT_KEY] = React5.createContext(null));
+var ErrorActionsContext = registry2[CONTEXT_KEY] ?? (registry2[CONTEXT_KEY] = React6.createContext(null));
 function ErrorActionsProvider({
   render,
   children
@@ -1066,14 +1198,14 @@ function ErrorActionsProvider({
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ErrorActionsContext.Provider, { value: render, children });
 }
 function useErrorActions() {
-  return React5.useContext(ErrorActionsContext);
+  return React6.useContext(ErrorActionsContext);
 }
 function ErrorActions(props) {
   const render = useErrorActions();
   if (!render) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_jsx_runtime8.Fragment, { children: render(props) });
 }
-var ErrorBox = React5.forwardRef(function ErrorBox2({
+var ErrorBox = React6.forwardRef(function ErrorBox2({
   as = "p",
   message,
   title,
@@ -1120,7 +1252,7 @@ var alertVariants = (0, import_class_variance_authority2.cva)(
     }
   }
 );
-var Alert = React6.forwardRef(
+var Alert = React7.forwardRef(
   ({ className, variant, children, errorFacts, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
     "div",
     {
@@ -1138,7 +1270,7 @@ var Alert = React6.forwardRef(
   )
 );
 Alert.displayName = "Alert";
-var AlertTitle = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+var AlertTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
   "h5",
   {
     ref,
@@ -1148,7 +1280,7 @@ var AlertTitle = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 AlertTitle.displayName = "AlertTitle";
-var AlertDescription = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+var AlertDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
   "div",
   {
     ref,
@@ -1162,12 +1294,12 @@ AlertDescription.displayName = "AlertDescription";
 // src/alert-dialog.tsx
 var AlertDialogPrimitive = __toESM(require("@radix-ui/react-alert-dialog"), 1);
 var import_react_tree2 = require("@ai-matrx/kit/react-tree");
-var React9 = __toESM(require("react"), 1);
+var React10 = __toESM(require("react"), 1);
 
 // src/button.tsx
 var import_react_slot2 = require("@radix-ui/react-slot");
 var import_class_variance_authority3 = require("class-variance-authority");
-var React7 = __toESM(require("react"), 1);
+var React8 = __toESM(require("react"), 1);
 var import_jsx_runtime10 = require("react/jsx-runtime");
 var buttonVariants = (0, import_class_variance_authority3.cva)(
   "inline-flex 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:opacity-50 active:scale-[0.98] [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
@@ -1235,7 +1367,7 @@ function swallowClick(event) {
   event.preventDefault();
   event.stopPropagation();
 }
-var Button = React7.forwardRef(
+var Button = React8.forwardRef(
   ({ className, variant, size, asChild = false, onClick, ...props }, ref) => {
     const Component = asChild ? import_react_slot2.Slot : "button";
     const resolvedSize = size ?? "default";
@@ -1302,11 +1434,11 @@ var FORBIDDEN_HOST_MOTION_UTILITIES = [
 ];
 
 // src/portal-container.tsx
-var React8 = __toESM(require("react"), 1);
+var React9 = __toESM(require("react"), 1);
 var import_jsx_runtime11 = require("react/jsx-runtime");
 var CONTEXT_SLOT2 = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.portal-container-context");
 var contextRegistry2 = globalThis;
-var PortalContainerContext = contextRegistry2[CONTEXT_SLOT2] ??= React8.createContext(void 0);
+var PortalContainerContext = contextRegistry2[CONTEXT_SLOT2] ??= React9.createContext(void 0);
 function PortalContainerProvider({
   container,
   children
@@ -1314,7 +1446,7 @@ function PortalContainerProvider({
   return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(PortalContainerContext.Provider, { value: container ?? void 0, children });
 }
 function usePortalContainer(explicit) {
-  const injected = React8.useContext(PortalContainerContext);
+  const injected = React9.useContext(PortalContainerContext);
   if (explicit !== void 0) {
     return explicit ?? void 0;
   }
@@ -1333,7 +1465,7 @@ var AlertDialogPortal = ({
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AlertDialogPrimitive.Portal, { container: resolved ?? null, ...props });
 };
 AlertDialogPortal.displayName = "AlertDialogPortal";
-var AlertDialogOverlay = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+var AlertDialogOverlay = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
   AlertDialogPrimitive.Overlay,
   {
     ref,
@@ -1347,12 +1479,12 @@ var AlertDialogOverlay = React9.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
-var AlertDialogContentPrimitive = React9.forwardRef((props, ref) => {
+var AlertDialogContentPrimitive = React10.forwardRef((props, ref) => {
   useModalLayer(true);
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AlertDialogPrimitive.Content, { ...props, ref, "aria-modal": "true" });
 });
 AlertDialogContentPrimitive.displayName = "AlertDialogContentPrimitive";
-var AlertDialogDescription = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+var AlertDialogDescription = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
   AlertDialogPrimitive.Description,
   {
     ref,
@@ -1362,7 +1494,7 @@ var AlertDialogDescription = React9.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
-var AlertDialogContent = React9.forwardRef(({ className, children, container, animated = true, ...props }, ref) => {
+var AlertDialogContent = React10.forwardRef(({ className, children, container, animated = true, ...props }, ref) => {
   const hasDescription = (0, import_react_tree2.treeContainsComponent)(children, AlertDialogDescription) || (0, import_react_tree2.treeContainsComponent)(children, AlertDialogPrimitive.Description);
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(AlertDialogPortal, { container, children: [
     /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AlertDialogOverlay, {}),
@@ -1441,7 +1573,7 @@ var AlertDialogFooter = ({
   }
 );
 AlertDialogFooter.displayName = "AlertDialogFooter";
-var AlertDialogTitle = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+var AlertDialogTitle = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
   AlertDialogPrimitive.Title,
   {
     ref,
@@ -1451,7 +1583,7 @@ var AlertDialogTitle = React9.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
-var AlertDialogAction = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+var AlertDialogAction = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
   AlertDialogPrimitive.Action,
   {
     ref,
@@ -1461,7 +1593,7 @@ var AlertDialogAction = React9.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
-var AlertDialogCancel = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+var AlertDialogCancel = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
   AlertDialogPrimitive.Cancel,
   {
     ref,
@@ -1527,14 +1659,14 @@ function DragCursorMonitor({
 
 // src/avatar.tsx
 var AvatarPrimitive = __toESM(require("@radix-ui/react-avatar"), 1);
-var React10 = __toESM(require("react"), 1);
+var React11 = __toESM(require("react"), 1);
 var import_jsx_runtime13 = require("react/jsx-runtime");
 var AVATAR_SIZES = {
   sm: "h-8 w-8 text-[11px]",
   md: "h-9 w-9 text-xs",
   lg: "h-10 w-10 text-sm"
 };
-var Avatar = React10.forwardRef(({ className, size = "lg", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+var Avatar = React11.forwardRef(({ className, size = "lg", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
   AvatarPrimitive.Root,
   {
     ref,
@@ -1548,7 +1680,7 @@ var Avatar = React10.forwardRef(({ className, size = "lg", ...props }, ref) => /
   }
 ));
 Avatar.displayName = AvatarPrimitive.Root.displayName;
-var AvatarImage = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+var AvatarImage = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
   AvatarPrimitive.Image,
   {
     ref,
@@ -1558,7 +1690,7 @@ var AvatarImage = React10.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 AvatarImage.displayName = AvatarPrimitive.Image.displayName;
-var AvatarFallback = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+var AvatarFallback = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
   AvatarPrimitive.Fallback,
   {
     ref,
@@ -1573,7 +1705,7 @@ var AvatarFallback = React10.forwardRef(({ className, ...props }, ref) => /* @__
 AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
 
 // src/card.tsx
-var React11 = __toESM(require("react"), 1);
+var React12 = __toESM(require("react"), 1);
 var import_jsx_runtime14 = require("react/jsx-runtime");
 var CARD_SIZES = {
   sm: {
@@ -1592,11 +1724,11 @@ var CARD_SIZES = {
     padTopless: "p-6 pt-0"
   }
 };
-var CardSizeContext = React11.createContext("md");
+var CardSizeContext = React12.createContext("md");
 function useCardSize() {
-  return React11.useContext(CardSizeContext);
+  return React12.useContext(CardSizeContext);
 }
-var Card = React11.forwardRef(
+var Card = React12.forwardRef(
   ({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(CardSizeContext.Provider, { value: size, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
     "div",
     {
@@ -1609,7 +1741,7 @@ var Card = React11.forwardRef(
   ) })
 );
 Card.displayName = "Card";
-var CardHeader = React11.forwardRef(({ className, ...props }, ref) => {
+var CardHeader = React12.forwardRef(({ className, ...props }, ref) => {
   const size = useCardSize();
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
     "div",
@@ -1626,7 +1758,7 @@ var CardHeader = React11.forwardRef(({ className, ...props }, ref) => {
   );
 });
 CardHeader.displayName = "CardHeader";
-var CardTitle = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+var CardTitle = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
   "h3",
   {
     ref,
@@ -1636,7 +1768,7 @@ var CardTitle = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardDescription = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+var CardDescription = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
   "p",
   {
     ref,
@@ -1646,7 +1778,7 @@ var CardDescription = React11.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 CardDescription.displayName = "CardDescription";
-var CardAction = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+var CardAction = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
   "div",
   {
     ref,
@@ -1656,7 +1788,7 @@ var CardAction = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 CardAction.displayName = "CardAction";
-var CardContent = React11.forwardRef(({ className, ...props }, ref) => {
+var CardContent = React12.forwardRef(({ className, ...props }, ref) => {
   const size = useCardSize();
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
     "div",
@@ -1669,7 +1801,7 @@ var CardContent = React11.forwardRef(({ className, ...props }, ref) => {
   );
 });
 CardContent.displayName = "CardContent";
-var CardFooter = React11.forwardRef(({ className, ...props }, ref) => {
+var CardFooter = React12.forwardRef(({ className, ...props }, ref) => {
   const size = useCardSize();
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
     "div",
@@ -1689,13 +1821,13 @@ CardFooter.displayName = "CardFooter";
 
 // src/checkbox.tsx
 var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"), 1);
-var React12 = __toESM(require("react"), 1);
+var React13 = __toESM(require("react"), 1);
 var import_jsx_runtime15 = require("react/jsx-runtime");
 var CHECKBOX_SIZES = {
   sm: { root: "h-3.5 w-3.5 rounded-xs", glyph: "h-3 w-3" },
   md: { root: "h-4 w-4 rounded-sm", glyph: "h-3.5 w-3.5" }
 };
-var Checkbox = React12.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var Checkbox = React13.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
   CheckboxPrimitive.Root,
   {
     ref,
@@ -1720,11 +1852,11 @@ Checkbox.displayName = CheckboxPrimitive.Root.displayName;
 
 // src/collapsible.tsx
 var CollapsiblePrimitive = __toESM(require("@radix-ui/react-collapsible"), 1);
-var React13 = __toESM(require("react"), 1);
+var React14 = __toESM(require("react"), 1);
 var import_jsx_runtime16 = require("react/jsx-runtime");
 var Collapsible = CollapsiblePrimitive.Root;
 var CollapsibleTrigger2 = CollapsiblePrimitive.CollapsibleTrigger;
-var CollapsibleContent2 = React13.forwardRef(({ className, animated = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+var CollapsibleContent2 = React14.forwardRef(({ className, animated = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
   CollapsiblePrimitive.CollapsibleContent,
   {
     ref,
@@ -1741,14 +1873,14 @@ CollapsibleContent2.displayName = "CollapsibleContent";
 // src/command.tsx
 var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
 var import_cmdk = require("cmdk");
-var React14 = __toESM(require("react"), 1);
+var React15 = __toESM(require("react"), 1);
 
 // src/use-is-mobile.ts
 var import_media_query = require("@ai-matrx/kit/media-query");
 
 // src/command.tsx
 var import_jsx_runtime17 = require("react/jsx-runtime");
-var Command = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+var Command = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
   import_cmdk.Command,
   {
     ref,
@@ -1763,7 +1895,7 @@ Command.displayName = import_cmdk.Command.displayName;
 var DIALOG_DESKTOP_CLASSES = `fixed left-[50%] top-[50%] z-[10000] grid min-w-0 w-full max-w-lg ${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 = React14.forwardRef(({ className, children, container, onInteractOutside, ...props }, ref) => {
+var CommandDialogContent = React15.forwardRef(({ className, children, container, onInteractOutside, ...props }, ref) => {
   const isMobile = (0, import_media_query.useIsMobile)();
   const isModal = useRadixDialogModal();
   useModalLayer(isModal);
@@ -1823,7 +1955,7 @@ var CommandDialog = ({
     }
   ) }) });
 };
-var CommandInput = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
+var CommandInput = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
   /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
   /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     import_cmdk.Command.Input,
@@ -1838,7 +1970,7 @@ var CommandInput = React14.forwardRef(({ className, ...props }, ref) => /* @__PU
   )
 ] }));
 CommandInput.displayName = import_cmdk.Command.Input.displayName;
-var CommandList = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+var CommandList = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
   import_cmdk.Command.List,
   {
     ref,
@@ -1847,7 +1979,7 @@ var CommandList = React14.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 CommandList.displayName = import_cmdk.Command.List.displayName;
-var CommandEmpty = React14.forwardRef((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+var CommandEmpty = React15.forwardRef((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
   import_cmdk.Command.Empty,
   {
     ref,
@@ -1856,7 +1988,7 @@ var CommandEmpty = React14.forwardRef((props, ref) => /* @__PURE__ */ (0, import
   }
 ));
 CommandEmpty.displayName = import_cmdk.Command.Empty.displayName;
-var CommandGroup = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+var CommandGroup = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
   import_cmdk.Command.Group,
   {
     ref,
@@ -1868,7 +2000,7 @@ var CommandGroup = React14.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 CommandGroup.displayName = import_cmdk.Command.Group.displayName;
-var CommandSeparator = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+var CommandSeparator = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
   import_cmdk.Command.Separator,
   {
     ref,
@@ -1877,7 +2009,7 @@ var CommandSeparator = React14.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 CommandSeparator.displayName = import_cmdk.Command.Separator.displayName;
-var CommandItem = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+var CommandItem = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
   import_cmdk.Command.Item,
   {
     ref,
@@ -1967,13 +2099,13 @@ function ConfirmDialog({
 // src/confirm-host.tsx
 var import_confirm_opener = require("@ai-matrx/kit/confirm-opener");
 var import_opener_react = require("@ai-matrx/kit/opener-react");
-var React15 = __toESM(require("react"), 1);
+var React16 = __toESM(require("react"), 1);
 var import_jsx_runtime19 = require("react/jsx-runtime");
 function ConfirmDialogHost() {
   const { shown, open, settle } = (0, import_opener_react.useOpenerHost)(import_confirm_opener.confirmOpener);
-  const [readyFor, setReadyFor] = React15.useState(null);
+  const [readyFor, setReadyFor] = React16.useState(null);
   const ready = shown?.ready;
-  React15.useEffect(() => {
+  React16.useEffect(() => {
     if (!shown || !ready) return void 0;
     let live = true;
     const release = () => {
@@ -1985,8 +2117,8 @@ function ConfirmDialogHost() {
     };
   }, [shown, ready]);
   const held = !!ready && readyFor !== shown;
-  const handleConfirm = React15.useCallback(() => settle(true), [settle]);
-  const handleOpenChange = React15.useCallback(
+  const handleConfirm = React16.useCallback(() => settle(true), [settle]);
+  const handleOpenChange = React16.useCallback(
     (next) => {
       if (!next) settle(false);
     },
@@ -2010,10 +2142,10 @@ function ConfirmDialogHost() {
 
 // src/context-menu.tsx
 var ContextMenuPrimitive = __toESM(require("@radix-ui/react-context-menu"), 1);
-var React18 = __toESM(require("react"), 1);
+var React19 = __toESM(require("react"), 1);
 
 // src/menu-scroll-edges.tsx
-var React16 = __toESM(require("react"), 1);
+var React17 = __toESM(require("react"), 1);
 
 // src/use-scroll-fade.ts
 var import_react2 = require("react");
@@ -2082,13 +2214,13 @@ function composeRefs(...refs) {
   };
 }
 function MenuScrollEdge({ side, scroller }) {
-  const frame = React16.useRef(null);
+  const frame = React17.useRef(null);
   const dir = side === "top" ? -1 : 1;
-  const stop = React16.useCallback(() => {
+  const stop = React17.useCallback(() => {
     if (frame.current !== null) cancelAnimationFrame(frame.current);
     frame.current = null;
   }, []);
-  const glide = React16.useCallback(() => {
+  const glide = React17.useCallback(() => {
     stop();
     let last = performance.now();
     const step = (now) => {
@@ -2100,7 +2232,7 @@ function MenuScrollEdge({ side, scroller }) {
     };
     frame.current = requestAnimationFrame(step);
   }, [dir, scroller, stop]);
-  React16.useEffect(() => stop, [stop]);
+  React17.useEffect(() => stop, [stop]);
   return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { "aria-hidden": true, "data-menu-scroll-edge": side, className: "matrx-menu-scroll-edge", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "matrx-menu-scroll-fade", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     "div",
     {
@@ -2122,8 +2254,8 @@ function MenuScrollEdge({ side, scroller }) {
 }
 function useMenuScrollEdges(...forwarded) {
   const fade = useScrollFade();
-  const scroller = React16.useRef(null);
-  const ref = React16.useCallback(composeRefs(scroller, fade.ref, ...forwarded), [
+  const scroller = React17.useRef(null);
+  const ref = React17.useCallback(composeRefs(scroller, fade.ref, ...forwarded), [
     fade.ref,
     ...forwarded
   ]);
@@ -2136,10 +2268,10 @@ function useMenuScrollEdges(...forwarded) {
 }
 
 // src/submenu-focus.ts
-var React17 = __toESM(require("react"), 1);
+var React18 = __toESM(require("react"), 1);
 function useSubmenuSurvivesParentPanelFocus(forwardedRef, onFocusOutside) {
-  const content = React17.useRef(null);
-  const ref = React17.useCallback(
+  const content = React18.useRef(null);
+  const ref = React18.useCallback(
     (node) => {
       content.current = node;
       if (typeof forwardedRef === "function") forwardedRef(node);
@@ -2170,7 +2302,7 @@ var ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
 var SURFACE_CLASS = "z-[10001] 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 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]:opacity-50";
 var INDICATOR_ITEM_CLASS = "relative flex 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]:opacity-50";
-var ContextMenuSubTrigger = React18.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+var ContextMenuSubTrigger = React19.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
   ContextMenuPrimitive.SubTrigger,
   {
     ref,
@@ -2188,7 +2320,7 @@ var ContextMenuSubTrigger = React18.forwardRef(({ className, inset, children, ..
   }
 ));
 ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
-var ContextMenuSubContent = React18.forwardRef(({ className, container, onFocusOutside, children, ...props }, ref) => {
+var ContextMenuSubContent = React19.forwardRef(({ className, container, onFocusOutside, children, ...props }, ref) => {
   const portalContainer = usePortalContainer(container);
   const keep = useSubmenuSurvivesParentPanelFocus(ref, onFocusOutside);
   const edges = useMenuScrollEdges(keep.ref);
@@ -2205,7 +2337,7 @@ var ContextMenuSubContent = React18.forwardRef(({ className, container, onFocusO
   ) });
 });
 ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
-var ContextMenuContent = React18.forwardRef(({ className, container, children, ...props }, ref) => {
+var ContextMenuContent = React19.forwardRef(({ className, container, children, ...props }, ref) => {
   const portalContainer = usePortalContainer(container);
   const edges = useMenuScrollEdges(ref);
   return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ContextMenuPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
@@ -2220,7 +2352,7 @@ var ContextMenuContent = React18.forwardRef(({ className, container, children, .
   ) });
 });
 ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
-var ContextMenuItem = React18.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+var ContextMenuItem = React19.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
   ContextMenuPrimitive.Item,
   {
     ref,
@@ -2235,7 +2367,7 @@ var ContextMenuItem = React18.forwardRef(({ className, inset, ...props }, ref) =
   }
 ));
 ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
-var ContextMenuCheckboxItem = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+var ContextMenuCheckboxItem = React19.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
   ContextMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -2249,7 +2381,7 @@ var ContextMenuCheckboxItem = React18.forwardRef(({ className, children, ...prop
   }
 ));
 ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
-var ContextMenuRadioItem = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+var ContextMenuRadioItem = React19.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
   ContextMenuPrimitive.RadioItem,
   {
     ref,
@@ -2263,7 +2395,7 @@ var ContextMenuRadioItem = React18.forwardRef(({ className, children, ...props }
   }
 ));
 ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
-var ContextMenuLabel = React18.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+var ContextMenuLabel = React19.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
   ContextMenuPrimitive.Label,
   {
     ref,
@@ -2277,7 +2409,7 @@ var ContextMenuLabel = React18.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
-var ContextMenuSeparator = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+var ContextMenuSeparator = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
   ContextMenuPrimitive.Separator,
   {
     ref,
@@ -2303,7 +2435,7 @@ ContextMenuShortcut.displayName = "ContextMenuShortcut";
 // src/select.tsx
 var SelectPrimitive = __toESM(require("@radix-ui/react-select"), 1);
 var import_class_variance_authority4 = require("class-variance-authority");
-var React19 = __toESM(require("react"), 1);
+var React20 = __toESM(require("react"), 1);
 
 // src/field-surface.ts
 var FIELD_SURFACE_CLASS = "border border-border bg-card";
@@ -2338,7 +2470,7 @@ function SelectChevron({ className, size = "default" }) {
     }
   );
 }
-var SelectTrigger = React19.forwardRef(({ className, children, hideArrow = false, size, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+var SelectTrigger = React20.forwardRef(({ className, children, hideArrow = false, size, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -2351,7 +2483,7 @@ var SelectTrigger = React19.forwardRef(({ className, children, hideArrow = false
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+var SelectScrollUpButton = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
@@ -2364,7 +2496,7 @@ var SelectScrollUpButton = React19.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+var SelectScrollDownButton = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
@@ -2377,7 +2509,7 @@ var SelectScrollDownButton = React19.forwardRef(({ className, ...props }, ref) =
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React19.forwardRef(
+var SelectContent = React20.forwardRef(
   ({
     className,
     children,
@@ -2423,7 +2555,7 @@ var SelectContent = React19.forwardRef(
   }
 );
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+var SelectLabel = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
   SelectPrimitive.Label,
   {
     ref,
@@ -2432,7 +2564,7 @@ var SelectLabel = React19.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React19.forwardRef(({ className, children, description, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+var SelectItem = React20.forwardRef(({ className, children, description, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
   SelectPrimitive.Item,
   {
     ref,
@@ -2450,7 +2582,7 @@ var SelectItem = React19.forwardRef(({ className, children, description, ...prop
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+var SelectSeparator = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
   SelectPrimitive.Separator,
   {
     ref,
@@ -2465,12 +2597,12 @@ var import_react3 = require("react");
 
 // src/popover.tsx
 var PopoverPrimitive = __toESM(require("@radix-ui/react-popover"), 1);
-var React20 = __toESM(require("react"), 1);
+var React21 = __toESM(require("react"), 1);
 var import_jsx_runtime23 = require("react/jsx-runtime");
 var Popover = PopoverPrimitive.Root;
 var PopoverTrigger = PopoverPrimitive.Trigger;
 var PopoverAnchor = PopoverPrimitive.Anchor;
-var PopoverContent = React20.forwardRef(
+var PopoverContent = React21.forwardRef(
   ({
     className,
     align = "center",
@@ -2749,7 +2881,7 @@ function CreatablePicker({
 var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"), 1);
 var VisuallyHidden2 = __toESM(require("@radix-ui/react-visually-hidden"), 1);
 var import_react_tree3 = require("@ai-matrx/kit/react-tree");
-var React21 = __toESM(require("react"), 1);
+var React22 = __toESM(require("react"), 1);
 
 // src/layer-front.ts
 var LAYER_FRONT_EVENT = "matrx:layer-front";
@@ -2762,7 +2894,7 @@ function announceLayerFront(element) {
 
 // src/dialog.tsx
 var import_jsx_runtime25 = require("react/jsx-runtime");
-var DialogWindowedByDefaultContext = React21.createContext(false);
+var DialogWindowedByDefaultContext = React22.createContext(false);
 var Dialog = ({
   children,
   ...props
@@ -2784,9 +2916,9 @@ var DialogPortal = ({
 DialogPortal.displayName = "DialogPortal";
 var CONTEXT_SLOT3 = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.dialog-container-context");
 var contextRegistry3 = globalThis;
-var DialogContainerContext = contextRegistry3[CONTEXT_SLOT3] ??= React21.createContext(null);
-var useDialogContainer = () => React21.useContext(DialogContainerContext);
-var DialogOverlay = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+var DialogContainerContext = contextRegistry3[CONTEXT_SLOT3] ??= React22.createContext(null);
+var useDialogContainer = () => React22.useContext(DialogContainerContext);
+var DialogOverlay = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
   DialogPrimitive2.Overlay,
   {
     ref,
@@ -2802,7 +2934,7 @@ var DialogOverlay = React21.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 DialogOverlay.displayName = DialogPrimitive2.Overlay.displayName;
-var DialogContentPrimitive = React21.forwardRef(({ onInteractOutside, ...props }, ref) => {
+var DialogContentPrimitive = React22.forwardRef(({ onInteractOutside, ...props }, ref) => {
   const isModal = useRadixDialogModal();
   useModalLayer(isModal);
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
@@ -2819,12 +2951,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 = React21.createContext(null);
+var DialogWindowHandleContext = React22.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 = React21.forwardRef(
+var DialogContent = React22.forwardRef(
   ({
     className,
     children,
@@ -2845,13 +2977,13 @@ var DialogContent = React21.forwardRef(
     const injectedContainer = usePortalContainer(container);
     const asSheet = mobileSheet && isMobile;
     const windowed = !isModal && !asSheet;
-    const windowedByDefault = React21.useContext(DialogWindowedByDefaultContext);
-    const [containerEl, setContainerEl] = React21.useState(
+    const windowedByDefault = React22.useContext(DialogWindowedByDefaultContext);
+    const [containerEl, setContainerEl] = React22.useState(
       null
     );
     const stacks = windowed && windowedByDefault;
-    const [behind, setBehind] = React21.useState(false);
-    React21.useEffect(() => {
+    const [behind, setBehind] = React22.useState(false);
+    React22.useEffect(() => {
       if (!stacks || !containerEl) return;
       const onFront = (event) => {
         const element = event.detail?.element ?? null;
@@ -2867,9 +2999,9 @@ var DialogContent = React21.forwardRef(
       setBehind(false);
       announceLayerFront(containerEl);
     };
-    const [offset, setOffset] = React21.useState({ x: 0, y: 0 });
-    const dragRef = React21.useRef(null);
-    const handle = React21.useMemo(() => {
+    const [offset, setOffset] = React22.useState({ x: 0, y: 0 });
+    const dragRef = React22.useRef(null);
+    const handle = React22.useMemo(() => {
       if (!windowed) return null;
       const clamp = (value, limit) => Math.max(-limit, Math.min(limit, value));
       return {
@@ -2897,7 +3029,7 @@ var DialogContent = React21.forwardRef(
         onDoubleClick: () => setOffset({ x: 0, y: 0 })
       };
     }, [windowed, offset.x, offset.y]);
-    const mergedRef = React21.useCallback(
+    const mergedRef = React22.useCallback(
       (node) => {
         setContainerEl(node);
         if (typeof ref === "function") ref(node);
@@ -2984,7 +3116,7 @@ var DialogHeader = ({
   className,
   ...props
 }) => {
-  const handle = React21.useContext(DialogWindowHandleContext);
+  const handle = React22.useContext(DialogWindowHandleContext);
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "div",
     {
@@ -3041,7 +3173,7 @@ var DialogFooter = ({
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+var DialogTitle = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
   DialogPrimitive2.Title,
   {
     ref,
@@ -3051,7 +3183,7 @@ var DialogTitle = React21.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DialogTitle.displayName = DialogPrimitive2.Title.displayName;
-var DialogDescription = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+var DialogDescription = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
   DialogPrimitive2.Description,
   {
     ref,
@@ -3064,7 +3196,7 @@ DialogDescription.displayName = DialogPrimitive2.Description.displayName;
 
 // src/dropdown-menu.tsx
 var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
-var React22 = __toESM(require("react"), 1);
+var React23 = __toESM(require("react"), 1);
 var import_jsx_runtime26 = require("react/jsx-runtime");
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
@@ -3075,7 +3207,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 select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:opacity-50";
 var MENU_INDICATOR_ITEM_CLASS = "relative flex 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]:opacity-50";
-var DropdownMenuSubTrigger = React22.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+var DropdownMenuSubTrigger = React23.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
   DropdownMenuPrimitive.SubTrigger,
   {
     ref,
@@ -3093,7 +3225,7 @@ var DropdownMenuSubTrigger = React22.forwardRef(({ className, inset, children, .
   }
 ));
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
-var DropdownMenuSubContent = React22.forwardRef(({ className, container, sideOffset = 2, alignOffset = -4, collisionPadding = 8, onFocusOutside, children, ...props }, ref) => {
+var DropdownMenuSubContent = React23.forwardRef(({ className, container, sideOffset = 2, alignOffset = -4, collisionPadding = 8, onFocusOutside, children, ...props }, ref) => {
   const portalContainer = usePortalContainer(container);
   const keep = useSubmenuSurvivesParentPanelFocus(ref, onFocusOutside);
   const edges = useMenuScrollEdges(keep.ref);
@@ -3113,7 +3245,7 @@ var DropdownMenuSubContent = React22.forwardRef(({ className, container, sideOff
   ) });
 });
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
-var DropdownMenuContent = React22.forwardRef(({ className, sideOffset = 4, container, children, ...props }, ref) => {
+var DropdownMenuContent = React23.forwardRef(({ className, sideOffset = 4, container, children, ...props }, ref) => {
   const portalContainer = usePortalContainer(container);
   const edges = useMenuScrollEdges(ref);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DropdownMenuPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
@@ -3135,7 +3267,7 @@ var DropdownMenuContent = React22.forwardRef(({ className, sideOffset = 4, conta
   ) });
 });
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropdownMenuItem = React22.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+var DropdownMenuItem = React23.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -3145,7 +3277,7 @@ var DropdownMenuItem = React22.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuCheckboxItem = React22.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+var DropdownMenuCheckboxItem = React23.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
   DropdownMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -3159,7 +3291,7 @@ var DropdownMenuCheckboxItem = React22.forwardRef(({ className, children, ...pro
   }
 ));
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
-var DropdownMenuRadioItem = React22.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+var DropdownMenuRadioItem = React23.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
   DropdownMenuPrimitive.RadioItem,
   {
     ref,
@@ -3173,7 +3305,7 @@ var DropdownMenuRadioItem = React22.forwardRef(({ className, children, ...props
   }
 ));
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
-var DropdownMenuLabel = React22.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+var DropdownMenuLabel = React23.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
   DropdownMenuPrimitive.Label,
   {
     ref,
@@ -3183,7 +3315,7 @@ var DropdownMenuLabel = React22.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-var DropdownMenuSeparator = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+var DropdownMenuSeparator = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
   DropdownMenuPrimitive.Separator,
   {
     ref,
@@ -3395,7 +3527,7 @@ function EditableLabel({
 }
 
 // src/input.tsx
-var React23 = __toESM(require("react"), 1);
+var React24 = __toESM(require("react"), 1);
 var import_jsx_runtime28 = require("react/jsx-runtime");
 var getVariantStyles = (variant = "default") => {
   const baseStyles = `flex h-10 w-full ${FIELD_SURFACE_CLASS} text-foreground shadow-input rounded-md px-3 py-2 text-sm file:border-0 file:bg-transparent
@@ -3424,7 +3556,7 @@ var getVariantStyles = (variant = "default") => {
       return baseStyles;
   }
 };
-var Input = React23.forwardRef(
+var Input = React24.forwardRef(
   ({ className, type, variant = "default", ...props }, ref) => {
     return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       "input",
@@ -3438,7 +3570,7 @@ var Input = React23.forwardRef(
   }
 );
 Input.displayName = "Input";
-var EnterInput = React23.forwardRef(
+var EnterInput = React24.forwardRef(
   ({ onEnter, ...props }, ref) => {
     const handleKeyDown = (e) => {
       if (e.key === "Enter" && onEnter) {
@@ -3462,7 +3594,7 @@ var EnterInput = React23.forwardRef(
   }
 );
 EnterInput.displayName = "EnterInput";
-var BasicInput = React23.forwardRef(
+var BasicInput = React24.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) => {
@@ -3481,7 +3613,7 @@ var BasicInput = React23.forwardRef(
   }
 );
 BasicInput.displayName = "BasicInput";
-var InputWithPrefix = React23.forwardRef(({ prefix, className, wrapperClassName, ...props }, ref) => {
+var InputWithPrefix = React24.forwardRef(({ prefix, className, wrapperClassName, ...props }, ref) => {
   return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: cn("relative", wrapperClassName), children: [
     prefix && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground", children: prefix }),
     /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
@@ -3498,9 +3630,9 @@ InputWithPrefix.displayName = "InputWithPrefix";
 
 // src/label.tsx
 var LabelPrimitive = __toESM(require("@radix-ui/react-label"), 1);
-var React24 = __toESM(require("react"), 1);
+var React25 = __toESM(require("react"), 1);
 var import_jsx_runtime29 = require("react/jsx-runtime");
-var Label4 = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+var Label4 = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
   LabelPrimitive.Root,
   {
     ref,
@@ -3678,7 +3810,7 @@ function OverflowToolbar({
 
 // src/progress.tsx
 var ProgressPrimitive = __toESM(require("@radix-ui/react-progress"), 1);
-var React26 = __toESM(require("react"), 1);
+var React27 = __toESM(require("react"), 1);
 var import_jsx_runtime31 = require("react/jsx-runtime");
 var PROGRESS_TONES = {
   default: "bg-primary",
@@ -3686,7 +3818,7 @@ var PROGRESS_TONES = {
   warning: "bg-warning",
   destructive: "bg-destructive"
 };
-var Progress = React26.forwardRef(({ className, tone = "default", indicatorClassName, ...props }, ref) => {
+var Progress = React27.forwardRef(({ className, tone = "default", indicatorClassName, ...props }, ref) => {
   const { value, max } = props;
   const ceiling = max ?? 100;
   const isIndeterminate = value === null || value === void 0;
@@ -3723,9 +3855,9 @@ Progress.displayName = ProgressPrimitive.Root.displayName;
 
 // src/scroll-area.tsx
 var ScrollAreaPrimitive = __toESM(require("@radix-ui/react-scroll-area"), 1);
-var React27 = __toESM(require("react"), 1);
+var React28 = __toESM(require("react"), 1);
 var import_jsx_runtime32 = require("react/jsx-runtime");
-var ScrollArea = React27.forwardRef(
+var ScrollArea = React28.forwardRef(
   ({
     className,
     children,
@@ -3758,7 +3890,7 @@ var ScrollArea = React27.forwardRef(
   )
 );
 ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollBar = React27.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+var ScrollBar = React28.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
   ScrollAreaPrimitive.ScrollAreaScrollbar,
   {
     ref,
@@ -3927,7 +4059,7 @@ function SegmentedControl({
 }
 
 // src/archive-filter.tsx
-var React28 = __toESM(require("react"), 1);
+var React29 = __toESM(require("react"), 1);
 var import_jsx_runtime35 = require("react/jsx-runtime");
 var ARCHIVE_FILTER_VALUES = ["active", "archived", "all"];
 var DEFAULT_ARCHIVE_FILTER = "active";
@@ -3953,7 +4085,7 @@ function ArchiveFilter({
   "aria-label": ariaLabel = "Archive filter",
   disabled = false
 }) {
-  const data = React28.useMemo(
+  const data = React29.useMemo(
     () => ARCHIVE_FILTER_VALUES.map((state) => {
       const text = labels?.[state] ?? ARCHIVE_FILTER_LABELS[state];
       const count = counts?.[state];
@@ -4016,9 +4148,9 @@ function ArchivedDisclosure({
 
 // src/separator.tsx
 var SeparatorPrimitive = __toESM(require("@radix-ui/react-separator"), 1);
-var React29 = __toESM(require("react"), 1);
+var React30 = __toESM(require("react"), 1);
 var import_jsx_runtime37 = require("react/jsx-runtime");
-var Separator4 = React29.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+var Separator4 = React30.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
   SeparatorPrimitive.Root,
   {
     ref,
@@ -4038,9 +4170,9 @@ Separator4.displayName = SeparatorPrimitive.Root.displayName;
 var SheetPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
 var import_react_tree4 = require("@ai-matrx/kit/react-tree");
 var import_class_variance_authority5 = require("class-variance-authority");
-var React30 = __toESM(require("react"), 1);
+var React31 = __toESM(require("react"), 1);
 var import_jsx_runtime38 = require("react/jsx-runtime");
-var SheetContentBase = React30.forwardRef(({ onInteractOutside, ...props }, ref) => {
+var SheetContentBase = React31.forwardRef(({ onInteractOutside, ...props }, ref) => {
   const isModal = useRadixDialogModal();
   useModalLayer(isModal);
   return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
@@ -4054,7 +4186,7 @@ var SheetContentBase = React30.forwardRef(({ onInteractOutside, ...props }, ref)
   );
 });
 SheetContentBase.displayName = "SheetContentBase";
-var Sheet = React30.forwardRef(({ children, ...props }, _ref) => {
+var Sheet = React31.forwardRef(({ children, ...props }, _ref) => {
   const modal = props.modal ?? true;
   return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(SheetPrimitive.Root, { ...props, modal, children }) });
 });
@@ -4062,7 +4194,7 @@ Sheet.displayName = "Sheet";
 var SheetTrigger = SheetPrimitive.Trigger;
 var SheetClose = SheetPrimitive.Close;
 var SheetPortal = SheetPrimitive.Portal;
-var SheetOverlay = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+var SheetOverlay = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
   SheetPrimitive.Overlay,
   {
     className: cn(
@@ -4101,7 +4233,7 @@ var sheetVariants = (0, import_class_variance_authority5.cva)(
     }
   }
 );
-var SheetDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+var SheetDescription = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
   SheetPrimitive.Description,
   {
     ref,
@@ -4110,7 +4242,7 @@ var SheetDescription = React30.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 SheetDescription.displayName = SheetPrimitive.Description.displayName;
-var SheetContent = React30.forwardRef(
+var SheetContent = React31.forwardRef(
   ({
     side = "right",
     className,
@@ -4181,7 +4313,7 @@ var SheetFooter = ({
   }
 );
 SheetFooter.displayName = "SheetFooter";
-var SheetTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+var SheetTitle = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
   SheetPrimitive.Title,
   {
     ref,
@@ -4192,7 +4324,7 @@ var SheetTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE
 SheetTitle.displayName = SheetPrimitive.Title.displayName;
 
 // src/organization-picker.tsx
-var React31 = __toESM(require("react"), 1);
+var React32 = __toESM(require("react"), 1);
 
 // src/skeleton.tsx
 var import_jsx_runtime39 = require("react/jsx-runtime");
@@ -4280,9 +4412,9 @@ function OrganizationPicker({
   foldedLabel = "More",
   className
 }) {
-  const [query, setQuery] = React31.useState("");
-  const [showFixtures, setShowFixtures] = React31.useState(false);
-  const [showFolded, setShowFolded] = React31.useState(false);
+  const [query, setQuery] = React32.useState("");
+  const [showFixtures, setShowFixtures] = React32.useState(false);
+  const [showFolded, setShowFolded] = React32.useState(false);
   const favorites = new Set(favoriteOrganizationIds);
   const isFavorite = (id) => favorites.has(id);
   const rank = (org) => isFavorite(org.id) ? 0 : org.isOwn ? 1 : 2;
@@ -4482,11 +4614,11 @@ function OrganizationPicker({
 // src/sidebar.tsx
 var import_react_slot3 = require("@radix-ui/react-slot");
 var import_class_variance_authority6 = require("class-variance-authority");
-var React33 = __toESM(require("react"), 1);
+var React34 = __toESM(require("react"), 1);
 
 // src/tooltip.tsx
 var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"), 1);
-var React32 = __toESM(require("react"), 1);
+var React33 = __toESM(require("react"), 1);
 
 // src/title-tooltips.ts
 var TITLE_TOOLTIP_ATTR = "data-matrx-title";
@@ -4545,7 +4677,7 @@ function install(doc) {
     if (el.closest(`[${NATIVE_TITLE_OPT_OUT_ATTR}]`)) return null;
     return el;
   };
-  const textOf = (el) => (el.getAttribute(TITLE_TOOLTIP_ATTR) ?? el.getAttribute("title") ?? "").trim();
+  const textOf2 = (el) => (el.getAttribute(TITLE_TOOLTIP_ATTR) ?? el.getAttribute("title") ?? "").trim();
   const lift = (el) => {
     const title = el.getAttribute("title");
     if (title === null) return;
@@ -4627,7 +4759,7 @@ function install(doc) {
   const show = (el, instant) => {
     if (active !== el) return;
     if (el.closest(`[${TOOLTIP_TRIGGER_ATTR}]`)) return;
-    const text = textOf(el);
+    const text = textOf2(el);
     if (!text || !el.isConnected) return;
     if (repeatsVisibleText(el, text)) return;
     const node = ensureSurface();
@@ -4720,16 +4852,16 @@ function install(doc) {
 // src/tooltip.tsx
 var import_jsx_runtime41 = require("react/jsx-runtime");
 function TooltipProvider({ titleTooltips = true, ...props }) {
-  React32.useEffect(() => {
+  React33.useEffect(() => {
     if (!titleTooltips) return;
     return acquireTitleTooltips();
   }, [titleTooltips]);
   return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipPrimitive.Provider, { ...props });
 }
 var Tooltip = TooltipPrimitive.Root;
-var TooltipTrigger = React32.forwardRef((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipPrimitive.Trigger, { ref, ...{ [TOOLTIP_TRIGGER_ATTR]: "" }, ...props }));
+var TooltipTrigger = React33.forwardRef((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipPrimitive.Trigger, { ref, ...{ [TOOLTIP_TRIGGER_ATTR]: "" }, ...props }));
 TooltipTrigger.displayName = TooltipPrimitive.Trigger.displayName;
-var TooltipContent = React32.forwardRef(({ className, sideOffset = 4, container, animated = true, ...props }, ref) => {
+var TooltipContent = React33.forwardRef(({ className, sideOffset = 4, container, animated = true, ...props }, ref) => {
   const resolved = usePortalContainer(container);
   return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipPrimitive.Portal, { container: resolved ?? null, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
     TooltipPrimitive.Content,
@@ -4754,9 +4886,9 @@ var SIDEBAR_WIDTH = "16rem";
 var SIDEBAR_WIDTH_MOBILE = "18rem";
 var SIDEBAR_WIDTH_ICON = "3rem";
 var SIDEBAR_KEYBOARD_SHORTCUT = "b";
-var SidebarContext = React33.createContext(null);
+var SidebarContext = React34.createContext(null);
 function useSidebar() {
-  const context = React33.useContext(SidebarContext);
+  const context = React34.useContext(SidebarContext);
   if (!context) {
     throw new Error("useSidebar must be used within a SidebarProvider.");
   }
@@ -4773,10 +4905,10 @@ function SidebarProvider({
   ...props
 }) {
   const isMobile = (0, import_media_query.useIsMobile)();
-  const [openMobile, setOpenMobile] = React33.useState(false);
-  const [_open, _setOpen] = React33.useState(defaultOpen);
+  const [openMobile, setOpenMobile] = React34.useState(false);
+  const [_open, _setOpen] = React34.useState(defaultOpen);
   const open = openProp ?? _open;
-  const setOpen = React33.useCallback(
+  const setOpen = React34.useCallback(
     (value) => {
       const openState = typeof value === "function" ? value(open) : value;
       if (setOpenProp) {
@@ -4787,10 +4919,10 @@ function SidebarProvider({
     },
     [setOpenProp, open]
   );
-  const toggleSidebar = React33.useCallback(() => {
+  const toggleSidebar = React34.useCallback(() => {
     return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
   }, [isMobile, setOpen, setOpenMobile]);
-  React33.useEffect(() => {
+  React34.useEffect(() => {
     if (!keyboardShortcut) return;
     const handleKeyDown = (event) => {
       if (event.key === keyboardShortcut && (event.metaKey || event.ctrlKey)) {
@@ -4802,7 +4934,7 @@ function SidebarProvider({
     return () => window.removeEventListener("keydown", handleKeyDown);
   }, [keyboardShortcut, toggleSidebar]);
   const state = open ? "expanded" : "collapsed";
-  const contextValue = React33.useMemo(
+  const contextValue = React34.useMemo(
     () => ({
       state,
       open,
@@ -5250,7 +5382,7 @@ function SidebarMenuSkeleton({
   showIcon = false,
   ...props
 }) {
-  const width = React33.useMemo(() => {
+  const width = React34.useMemo(() => {
     return `${Math.floor(Math.random() * 40) + 50}%`;
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
@@ -5331,7 +5463,7 @@ function SidebarMenuSubButton({
 }
 
 // src/app-shell/app-rail.tsx
-var React34 = __toESM(require("react"), 1);
+var React35 = __toESM(require("react"), 1);
 
 // src/app-shell/status-dot.tsx
 var import_jsx_runtime43 = require("react/jsx-runtime");
@@ -5387,7 +5519,7 @@ function AppRailGroup({ className, ...props }) {
 function AppRailSpacer() {
   return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { "data-slot": "app-rail-spacer", className: "flex-1" });
 }
-var AppRailItem = React34.forwardRef(function AppRailItem2({ icon, label, shortcut, active = false, attention, attentionLabel, className, ...props }, ref) {
+var AppRailItem = React35.forwardRef(function AppRailItem2({ icon, label, shortcut, active = false, attention, attentionLabel, className, ...props }, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Tooltip, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
       "button",
@@ -5427,7 +5559,7 @@ var AppRailItem = React34.forwardRef(function AppRailItem2({ icon, label, shortc
     ] }) })
   ] });
 });
-var AppRailAvatar = React34.forwardRef(function AppRailAvatar2({ initials = "", label, className, children, ...props }, ref) {
+var AppRailAvatar = React35.forwardRef(function AppRailAvatar2({ initials = "", label, className, children, ...props }, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Tooltip, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
       "button",
@@ -5450,7 +5582,7 @@ var AppRailAvatar = React34.forwardRef(function AppRailAvatar2({ initials = "",
 });
 
 // src/app-shell/canvas.tsx
-var React35 = __toESM(require("react"), 1);
+var React36 = __toESM(require("react"), 1);
 
 // src/resizable.tsx
 var import_react_resizable_panels = require("react-resizable-panels");
@@ -5517,7 +5649,7 @@ function CanvasLayout({ columns, expandedId = null, className }) {
   if (expanded) {
     return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { "data-slot": "canvas-layout", "data-expanded": expanded.id, className: cn("flex h-full w-full", className), children: expanded.node });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ResizablePanelGroup, { "data-slot": "canvas-layout", orientation: "horizontal", className: cn("gap-0", className), children: visible2.map((column, ci) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(React35.Fragment, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ResizablePanelGroup, { "data-slot": "canvas-layout", orientation: "horizontal", className: cn("gap-0", className), children: visible2.map((column, ci) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(React36.Fragment, { children: [
     ci > 0 ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ResizableHandle, { "data-canvas-gap": "column", size: "md", className: GAP }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
       ResizablePanel,
@@ -5525,7 +5657,7 @@ function CanvasLayout({ columns, expandedId = null, className }) {
         id: column.id,
         minSize: column.minSize ?? 220,
         ...column.defaultSize !== void 0 ? { defaultSize: column.defaultSize } : {},
-        children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ResizablePanelGroup, { "data-canvas-column": column.id, orientation: "vertical", children: column.panels.map((panel, pi) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(React35.Fragment, { children: [
+        children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ResizablePanelGroup, { "data-canvas-column": column.id, orientation: "vertical", children: column.panels.map((panel, pi) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(React36.Fragment, { children: [
           pi > 0 ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ResizableHandle, { "data-canvas-gap": "row", size: "md", className: GAP }) : null,
           /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
             ResizablePanel,
@@ -5543,10 +5675,10 @@ function CanvasLayout({ columns, expandedId = null, className }) {
 }
 
 // src/app-shell/mode-switch.tsx
-var React36 = __toESM(require("react"), 1);
+var React37 = __toESM(require("react"), 1);
 var import_jsx_runtime47 = require("react/jsx-runtime");
 function ModeSwitch({ value, onValueChange, options, label = "Mode", className }) {
-  const refs = React36.useRef([]);
+  const refs = React37.useRef([]);
   const move = (from, delta) => {
     const next = (from + delta + options.length) % options.length;
     const option = options[next];
@@ -5609,7 +5741,7 @@ function ModeSwitch({ value, onValueChange, options, label = "Mode", className }
 
 // src/switch.tsx
 var SwitchPrimitives = __toESM(require("@radix-ui/react-switch"), 1);
-var React37 = __toESM(require("react"), 1);
+var React38 = __toESM(require("react"), 1);
 var import_jsx_runtime48 = require("react/jsx-runtime");
 var SWITCH_SIZES = {
   sm: {
@@ -5621,7 +5753,7 @@ var SWITCH_SIZES = {
     thumb: "h-4 w-4 data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
   }
 };
-var Switch = React37.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+var Switch = React38.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
   SwitchPrimitives.Root,
   {
     ref,
@@ -5702,17 +5834,17 @@ function TabbedBottomSheet({
 }
 
 // src/table.tsx
-var React38 = __toESM(require("react"), 1);
+var React39 = __toESM(require("react"), 1);
 var import_jsx_runtime50 = require("react/jsx-runtime");
 var TABLE_SIZES = {
   sm: { head: "px-2", cell: "p-2" },
   md: { head: "px-3", cell: "p-3" }
 };
-var TableSizeContext = React38.createContext("md");
+var TableSizeContext = React39.createContext("md");
 function useTableSize() {
-  return React38.useContext(TableSizeContext);
+  return React39.useContext(TableSizeContext);
 }
-var Table = React38.forwardRef(
+var Table = React39.forwardRef(
   ({ className, size = "md", wrap = true, wrapperClassName, ...props }, ref) => {
     const table = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
       "table",
@@ -5735,7 +5867,7 @@ var Table = React38.forwardRef(
   }
 );
 Table.displayName = "Table";
-var TableHeader = React38.forwardRef(({ className, sticky = false, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+var TableHeader = React39.forwardRef(({ className, sticky = false, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
   "thead",
   {
     ref,
@@ -5749,7 +5881,7 @@ var TableHeader = React38.forwardRef(({ className, sticky = false, ...props }, r
   }
 ));
 TableHeader.displayName = "TableHeader";
-var TableBody = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+var TableBody = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
   "tbody",
   {
     ref,
@@ -5759,7 +5891,7 @@ var TableBody = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 TableBody.displayName = "TableBody";
-var TableFooter = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+var TableFooter = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
   "tfoot",
   {
     ref,
@@ -5772,7 +5904,7 @@ var TableFooter = React38.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TableFooter.displayName = "TableFooter";
-var TableRow = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+var TableRow = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
   "tr",
   {
     ref,
@@ -5785,7 +5917,7 @@ var TableRow = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TableRow.displayName = "TableRow";
-var TableHead = React38.forwardRef(({ className, ...props }, ref) => {
+var TableHead = React39.forwardRef(({ className, ...props }, ref) => {
   const size = useTableSize();
   return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
     "th",
@@ -5802,7 +5934,7 @@ var TableHead = React38.forwardRef(({ className, ...props }, ref) => {
   );
 });
 TableHead.displayName = "TableHead";
-var TableCell = React38.forwardRef(({ className, ...props }, ref) => {
+var TableCell = React39.forwardRef(({ className, ...props }, ref) => {
   const size = useTableSize();
   return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
     "td",
@@ -5819,7 +5951,7 @@ var TableCell = React38.forwardRef(({ className, ...props }, ref) => {
   );
 });
 TableCell.displayName = "TableCell";
-var TableCaption = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+var TableCaption = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
   "caption",
   {
     ref,
@@ -5832,11 +5964,11 @@ TableCaption.displayName = "TableCaption";
 
 // src/tabs.tsx
 var TabsPrimitive = __toESM(require("@radix-ui/react-tabs"), 1);
-var React39 = __toESM(require("react"), 1);
+var React40 = __toESM(require("react"), 1);
 var import_jsx_runtime51 = require("react/jsx-runtime");
 var Tabs = TabsPrimitive.Root;
 var TABS_TRIGGER_BASE = "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm";
-var TabsList = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+var TabsList = React40.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
   TabsPrimitive.List,
   {
     ref,
@@ -5849,7 +5981,7 @@ var TabsList = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TabsList.displayName = TabsPrimitive.List.displayName;
-var TabsTrigger = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+var TabsTrigger = React40.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
   TabsPrimitive.Trigger,
   {
     ref,
@@ -5863,7 +5995,7 @@ var TabsTrigger = React39.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-var TabsTriggerCore = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+var TabsTriggerCore = React40.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
   TabsPrimitive.Trigger,
   {
     ref,
@@ -5873,7 +6005,7 @@ var TabsTriggerCore = React39.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 TabsTriggerCore.displayName = TabsPrimitive.Trigger.displayName;
-var TabsContent = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+var TabsContent = React40.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
   TabsPrimitive.Content,
   {
     ref,
@@ -5889,7 +6021,7 @@ var TabsContent = React39.forwardRef(({ className, ...props }, ref) => /* @__PUR
 TabsContent.displayName = TabsPrimitive.Content.displayName;
 
 // src/textarea.tsx
-var React40 = __toESM(require("react"), 1);
+var React41 = __toESM(require("react"), 1);
 var import_jsx_runtime52 = require("react/jsx-runtime");
 var FILL_HEIGHT_REGEX = /(?:^|\s)(h-full|h-dvh|flex-1|grow)(?:\s|$)/;
 var FILL_WIDTH_REGEX = /(?:^|\s)(w-full|w-screen)(?:\s|$)/;
@@ -5903,7 +6035,7 @@ function getStretchClasses(className) {
 var TEXTAREA_ELEVATED_CLASS = `flex h-auto w-full rounded-md ${FIELD_SURFACE_CLASS} 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 ${FIELD_SURFACE_CLASS} 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) {
-  React40.useEffect(() => {
+  React41.useEffect(() => {
     if (!autoGrow || !ref.current) return;
     const textarea = ref.current;
     textarea.style.height = "auto";
@@ -5919,8 +6051,8 @@ function useAutoGrow(ref, value, autoGrow = false, minHeight, maxHeight) {
   }, [value, autoGrow, minHeight, maxHeight, ref]);
 }
 function useMergedTextareaRef(forwarded) {
-  const internal = React40.useRef(null);
-  const callback = React40.useCallback(
+  const internal = React41.useRef(null);
+  const callback = React41.useCallback(
     (node) => {
       internal.current = node;
       if (typeof forwarded === "function") forwarded(node);
@@ -5937,7 +6069,7 @@ function boxStyle(minHeight, maxHeight) {
     maxHeight: maxHeight ? `${maxHeight}px` : void 0
   };
 }
-var Textarea = React40.forwardRef(
+var Textarea = React41.forwardRef(
   ({ className, autoGrow, minHeight, maxHeight, wrapperClassName, ...props }, forwarded) => {
     const { ref, callback } = useMergedTextareaRef(forwarded);
     const stretchClasses = getStretchClasses(className);
@@ -5963,7 +6095,7 @@ var Textarea = React40.forwardRef(
   }
 );
 Textarea.displayName = "Textarea";
-var BasicTextarea = React40.forwardRef(
+var BasicTextarea = React41.forwardRef(
   ({ className, autoGrow, minHeight, maxHeight, ...props }, forwarded) => {
     const { ref, callback } = useMergedTextareaRef(forwarded);
     useAutoGrow(ref, props.value, autoGrow, minHeight, maxHeight);
@@ -5985,7 +6117,7 @@ var BasicTextarea = React40.forwardRef(
   }
 );
 BasicTextarea.displayName = "BasicTextarea";
-var TextareaWithPrefix = React40.forwardRef(
+var TextareaWithPrefix = React41.forwardRef(
   ({
     prefix,
     className,
@@ -6028,11 +6160,11 @@ TextareaWithPrefix.displayName = "TextareaWithPrefix";
 
 // src/hover-card.tsx
 var HoverCardPrimitive = __toESM(require("@radix-ui/react-hover-card"), 1);
-var React41 = __toESM(require("react"), 1);
+var React42 = __toESM(require("react"), 1);
 var import_jsx_runtime53 = require("react/jsx-runtime");
 var HoverCard = HoverCardPrimitive.Root;
 var HoverCardTrigger = HoverCardPrimitive.Trigger;
-var HoverCardContent = React41.forwardRef(
+var HoverCardContent = React42.forwardRef(
   ({ className, align = "center", sideOffset = 4, container, animated = true, ...props }, ref) => {
     const resolved = usePortalContainer(container);
     return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(HoverCardPrimitive.Portal, { container: resolved ?? null, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
@@ -6056,9 +6188,9 @@ HoverCardContent.displayName = HoverCardPrimitive.Content.displayName;
 
 // src/radio-group.tsx
 var RadioGroupPrimitive = __toESM(require("@radix-ui/react-radio-group"), 1);
-var React42 = __toESM(require("react"), 1);
+var React43 = __toESM(require("react"), 1);
 var import_jsx_runtime54 = require("react/jsx-runtime");
-var RadioGroupSizeContext = React42.createContext("md");
+var RadioGroupSizeContext = React43.createContext("md");
 var CONTROL_CLASSES = {
   sm: "h-3.5 w-3.5",
   md: "h-4 w-4",
@@ -6069,7 +6201,7 @@ var DOT_CLASSES = {
   md: "h-1.5 w-1.5",
   lg: "h-2 w-2"
 };
-var RadioGroup3 = React42.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(RadioGroupSizeContext.Provider, { value: size, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+var RadioGroup3 = React43.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(RadioGroupSizeContext.Provider, { value: size, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
   RadioGroupPrimitive.Root,
   {
     ref,
@@ -6079,8 +6211,8 @@ var RadioGroup3 = React42.forwardRef(({ className, size = "md", ...props }, ref)
   }
 ) }));
 RadioGroup3.displayName = RadioGroupPrimitive.Root.displayName;
-var RadioGroupItem = React42.forwardRef(({ className, size, ...props }, ref) => {
-  const groupSize = React42.useContext(RadioGroupSizeContext);
+var RadioGroupItem = React43.forwardRef(({ className, size, ...props }, ref) => {
+  const groupSize = React43.useContext(RadioGroupSizeContext);
   const resolved = size ?? groupSize;
   return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     RadioGroupPrimitive.Item,
@@ -6112,7 +6244,7 @@ RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
 
 // src/slider.tsx
 var SliderPrimitive = __toESM(require("@radix-ui/react-slider"), 1);
-var React43 = __toESM(require("react"), 1);
+var React44 = __toESM(require("react"), 1);
 var import_jsx_runtime55 = require("react/jsx-runtime");
 var TRACK_CLASSES = {
   sm: "h-1",
@@ -6124,7 +6256,7 @@ var THUMB_CLASSES = {
   md: "h-4 w-4",
   lg: "h-5 w-5"
 };
-var Slider = React43.forwardRef(({ className, size = "md", ...props }, ref) => {
+var Slider = React44.forwardRef(({ className, size = "md", ...props }, ref) => {
   const thumbCount = Math.max(
     1,
     (props.value ?? props.defaultValue ?? [0]).length
@@ -6186,7 +6318,7 @@ Slider.displayName = SliderPrimitive.Root.displayName;
 var ToggleGroupPrimitive = __toESM(require("@radix-ui/react-toggle-group"), 1);
 var TogglePrimitive = __toESM(require("@radix-ui/react-toggle"), 1);
 var import_class_variance_authority7 = require("class-variance-authority");
-var React44 = __toESM(require("react"), 1);
+var React45 = __toESM(require("react"), 1);
 var import_jsx_runtime56 = require("react/jsx-runtime");
 var toggleVariants = (0, import_class_variance_authority7.cva)(
   "inline-flex 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:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
@@ -6208,7 +6340,7 @@ var toggleVariants = (0, import_class_variance_authority7.cva)(
     }
   }
 );
-var Toggle = React44.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+var Toggle = React45.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
   TogglePrimitive.Root,
   {
     ref,
@@ -6218,8 +6350,8 @@ var Toggle = React44.forwardRef(({ className, variant, size, ...props }, ref) =>
   }
 ));
 Toggle.displayName = TogglePrimitive.Root.displayName;
-var ToggleGroupContext = React44.createContext({ size: "default", variant: "default" });
-var ToggleGroup = React44.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+var ToggleGroupContext = React45.createContext({ size: "default", variant: "default" });
+var ToggleGroup = React45.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
   ToggleGroupPrimitive.Root,
   {
     ref,
@@ -6230,8 +6362,8 @@ var ToggleGroup = React44.forwardRef(({ className, variant, size, children, ...p
   }
 ));
 ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
-var ToggleGroupItem = React44.forwardRef(({ className, children, variant, size, ...props }, ref) => {
-  const context = React44.useContext(ToggleGroupContext);
+var ToggleGroupItem = React45.forwardRef(({ className, children, variant, size, ...props }, ref) => {
+  const context = React45.useContext(ToggleGroupContext);
   return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     ToggleGroupPrimitive.Item,
     {
@@ -6299,11 +6431,11 @@ function classNameMisuse(className) {
   const bad = className.split(/\s+/).filter((t) => t && NON_COLOUR_CLASS.test(t));
   return bad.length ? `className is the glyph colour only \u2014 remove "${bad.join(" ")}"` : null;
 }
-function px(value) {
+function px2(value) {
   const n = Number.parseFloat(value);
   return Number.isFinite(n) ? n : 0;
 }
-function describe(el) {
+function describe2(el) {
   const cls = typeof el.className === "string" ? el.className.trim().split(/\s+/).slice(0, 4).join(".") : "";
   return `<${el.tagName.toLowerCase()}${cls ? `.${cls}` : ""}>`;
 }
@@ -6348,7 +6480,7 @@ function canon(doc) {
     key,
     target: a.offsetHeight,
     pill: a.firstElementChild.offsetHeight,
-    icon: px(view.getComputedStyle(a.querySelector("svg")).height),
+    icon: px2(view.getComputedStyle(a.querySelector("svg")).height),
     sm: b.offsetHeight,
     smPill: b.firstElementChild.offsetHeight,
     wide: w.firstElementChild.offsetHeight
@@ -6378,7 +6510,7 @@ function findTapViolation(el) {
   const inline = /matrx-tap-target-(?:inline|mobile-icon-only)/.test(el.className);
   const pill = el.querySelector(":scope > .matrx-tap-pill");
   const icon = pill?.querySelector(".matrx-tap-icon") ?? null;
-  const floored = px(cs.minHeight) >= el.offsetHeight - 0.5 || px(cs.minWidth) >= el.offsetWidth - 0.5;
+  const floored = px2(cs.minHeight) >= el.offsetHeight - 0.5 || px2(cs.minWidth) >= el.offsetWidth - 0.5;
   if (!inTable && pill && !floored) {
     const c = canon(doc);
     const box = sm ? c.sm : c.target;
@@ -6389,7 +6521,7 @@ function findTapViolation(el) {
       return `pill is ${pill.offsetHeight}px, canon is ${pillSizes.join(" or ")}px`;
     }
     if (icon && !moved.has("--matrx-tap-icon-size")) {
-      const size = px(view.getComputedStyle(icon).height);
+      const size = px2(view.getComputedStyle(icon).height);
       if (Math.abs(size - c.icon) > 0.5) return `glyph is ${size}px, canon is ${c.icon}px`;
     }
   }
@@ -6406,9 +6538,9 @@ function findTapViolation(el) {
     if (others.length > 0) break;
     if (ownText(parent, slot, view) !== "") break;
     const pcs = view.getComputedStyle(parent);
-    const space = px(pcs.marginLeft) + px(pcs.marginRight) + px(pcs.paddingLeft) + px(pcs.paddingRight);
+    const space = px2(pcs.marginLeft) + px2(pcs.marginRight) + px2(pcs.paddingLeft) + px2(pcs.paddingRight);
     if (space > 0.5) {
-      return `${describe(parent)} adds ${space}px around a tap button \u2014 tap buttons space themselves`;
+      return `${describe2(parent)} adds ${space}px around a tap button \u2014 tap buttons space themselves`;
     }
     slot = parent;
   }
@@ -6419,9 +6551,9 @@ function findTapViolation(el) {
     const neighbours = Array.from(row.children).filter((c) => c !== slot && isTapSlot(c, view));
     if (flexOrGrid && neighbours.length > 0) {
       const horizontal = rcs.display.includes("grid") || !rcs.flexDirection.startsWith("column");
-      const gap = px(horizontal ? rcs.columnGap : rcs.rowGap);
+      const gap = px2(horizontal ? rcs.columnGap : rcs.rowGap);
       if (gap > 0.5) {
-        return `${describe(row)} adds a ${gap}px gap between tap buttons \u2014 remove it; tap buttons space themselves`;
+        return `${describe2(row)} adds a ${gap}px gap between tap buttons \u2014 remove it; tap buttons space themselves`;
       }
     }
   }
@@ -6464,11 +6596,11 @@ function findTapPlacementWarning(el) {
   if (!row) return null;
   if (glass) {
     const mixed = Array.from(row.children).find((c) => c !== slot && visible(c, view) && !isGlassItem(c));
-    if (mixed) return `glass beside non-glass ${describe(mixed)} \u2014 make the row all glass or none`;
+    if (mixed) return `glass beside non-glass ${describe2(mixed)} \u2014 make the row all glass or none`;
   }
   const pill = el.querySelector(":scope > .matrx-tap-pill") ?? slot.querySelector(".matrx-tap-group-capsule");
   if (!pill) return null;
-  const gap = px(view.getComputedStyle(el).getPropertyValue("--matrx-tap-gap")) || 6;
+  const gap = px2(view.getComputedStyle(el).getPropertyValue("--matrx-tap-gap")) || 6;
   const p = pill.getBoundingClientRect();
   if (p.width === 0) return null;
   for (const [side, sib] of [["after", slot.nextElementSibling], ["before", slot.previousElementSibling]]) {
@@ -6476,9 +6608,9 @@ function findTapPlacementWarning(el) {
     const r = sib.getBoundingClientRect();
     if (Math.abs(r.top + r.height / 2 - (p.top + p.height / 2)) > p.height) continue;
     const cs = view.getComputedStyle(sib);
-    const distance = side === "after" ? r.left + px(cs.paddingLeft) - p.right : p.left - (r.right - px(cs.paddingRight));
+    const distance = side === "after" ? r.left + px2(cs.paddingLeft) - p.right : p.left - (r.right - px2(cs.paddingRight));
     if (distance < gap - 0.5) {
-      return `${describe(sib)} sits ${Math.round(distance)}px from the pill \u2014 anything beside a tap button adds its own ${gap / 2}px (the box only carries ${gap / 2}px)`;
+      return `${describe2(sib)} sits ${Math.round(distance)}px from the pill \u2014 anything beside a tap button adds its own ${gap / 2}px (the box only carries ${gap / 2}px)`;
     }
   }
   return null;