@caqophony/ui 0.3.0 → 0.3.1

package/dist/index.js

@@ -862,10 +862,12 @@ import { ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight2 } from "luci
 
 // src/nav-drawer.tsx
 import * as React7 from "react";
+import { createPortal } from "react-dom";
 import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
 function NavDrawer({
   label,
   side,
+  closedFrom,
   defaultOpen,
   children
 }) {
@@ -880,6 +882,65 @@ function NavDrawer({
     return () => document.removeEventListener("keydown", onKey);
   }, [open]);
   const left = side === "left";
+  const drawer = open ? /* @__PURE__ */ jsxs7(
+    "div",
+    {
+      className: cn(
+        "z-overlay fixed inset-0",
+        closedFrom === "md" ? "md:hidden" : "lg:hidden"
+      ),
+      children: [
+        /* @__PURE__ */ jsx11(
+          "div",
+          {
+            "aria-hidden": "true",
+            className: "absolute inset-0 bg-foreground/40",
+            onClick: () => setOpen(false)
+          }
+        ),
+        /* @__PURE__ */ jsxs7(
+          "aside",
+          {
+            id,
+            "aria-label": label,
+            onClick: (e) => {
+              if (e.target instanceof Element && e.target.closest("a")) {
+                setOpen(false);
+              }
+            },
+            className: cn(
+              "absolute inset-y-0 flex w-72 max-w-[calc(100%-3rem)] flex-col overflow-y-auto bg-card shadow-lg",
+              left ? "left-0 border-r" : "right-0 border-l",
+              "border-border"
+            ),
+            children: [
+              /* @__PURE__ */ jsx11(
+                "div",
+                {
+                  className: cn(
+                    "flex px-2 py-2",
+                    left ? "justify-end" : "justify-start"
+                  ),
+                  children: /* @__PURE__ */ jsx11(
+                    Button,
+                    {
+                      variant: "ghost",
+                      size: "icon",
+                      "aria-label": "Close",
+                      onClick: () => setOpen(false),
+                      children: /* @__PURE__ */ jsx11(Icon, { name: "x", size: "sm" })
+                    }
+                  )
+                }
+              ),
+              children
+            ]
+          }
+        )
+      ]
+    }
+  ) : null;
+  const surface = drawer === null || typeof document === "undefined" ? drawer : createPortal(drawer, document.body);
   return /* @__PURE__ */ jsxs7(Fragment2, { children: [
     /* @__PURE__ */ jsx11(
       Button,
@@ -893,50 +954,7 @@ function NavDrawer({
         children: /* @__PURE__ */ jsx11(Icon, { name: "menu", size: "sm" })
       }
     ),
-    open && /* @__PURE__ */ jsxs7("div", { className: "z-overlay fixed inset-0", children: [
-      /* @__PURE__ */ jsx11(
-        "div",
-        {
-          "aria-hidden": "true",
-          className: "absolute inset-0 bg-foreground/40",
-          onClick: () => setOpen(false)
-        }
-      ),
-      /* @__PURE__ */ jsxs7(
-        "aside",
-        {
-          id,
-          "aria-label": label,
-          className: cn(
-            "absolute inset-y-0 flex w-72 max-w-[calc(100%-3rem)] flex-col overflow-y-auto bg-card shadow-lg",
-            left ? "left-0 border-r" : "right-0 border-l",
-            "border-border"
-          ),
-          children: [
-            /* @__PURE__ */ jsx11(
-              "div",
-              {
-                className: cn(
-                  "flex px-2 py-2",
-                  left ? "justify-end" : "justify-start"
-                ),
-                children: /* @__PURE__ */ jsx11(
-                  Button,
-                  {
-                    variant: "ghost",
-                    size: "icon",
-                    "aria-label": "Close",
-                    onClick: () => setOpen(false),
-                    children: /* @__PURE__ */ jsx11(Icon, { name: "x", size: "sm" })
-                  }
-                )
-              }
-            ),
-            children
-          ]
-        }
-      )
-    ] })
+    surface
   ] });
 }
 
@@ -1038,11 +1056,20 @@ function CollapsibleSidebar({
           "flex min-h-screen w-14 flex-shrink-0 flex-col items-center border-r border-border bg-card py-2 lg:hidden",
           className
         ),
-        children: /* @__PURE__ */ jsxs8(NavDrawer, { label: navLabel, side: "left", defaultOpen: defaultNavOpen, children: [
-          header && /* @__PURE__ */ jsx12("div", { className: "border-b border-border px-4 pb-4", children: header }),
-          /* @__PURE__ */ jsx12("div", { className: "flex-1 space-y-1 p-2", children: items.map((item) => renderItem(item, false)) }),
-          footer && /* @__PURE__ */ jsx12("div", { className: "mt-auto border-t border-border p-2", children: footer })
-        ] })
+        children: /* @__PURE__ */ jsxs8(
+          NavDrawer,
+          {
+            label: navLabel,
+            side: "left",
+            closedFrom: "lg",
+            defaultOpen: defaultNavOpen,
+            children: [
+              header && /* @__PURE__ */ jsx12("div", { className: "border-b border-border px-4 pb-4", children: header }),
+              /* @__PURE__ */ jsx12("div", { className: "flex-1 space-y-1 p-2", children: items.map((item) => renderItem(item, false)) }),
+              footer && /* @__PURE__ */ jsx12("div", { className: "mt-auto border-t border-border p-2", children: footer })
+            ]
+          }
+        )
       }
     ),
     /* @__PURE__ */ jsxs8(
@@ -1626,7 +1653,7 @@ function SectionHeading({
       "data-testid": "section-heading",
       className: cn(
         "flex max-w-[480px] flex-col gap-2",
-        align === "center" && "items-center text-center",
+        align === "center" && "mx-auto items-center text-center",
         align === "left" && "items-start text-left"
       ),
       children: [
@@ -2528,6 +2555,7 @@ var AppShell = React16.forwardRef(
                   {
                     label: navLabel,
                     side: left ? "left" : "right",
+                    closedFrom: "md",
                     defaultOpen: defaultNavOpen,
                     children: sidebar
                   }
@@ -3093,7 +3121,33 @@ DatePicker.displayName = "DatePicker";
 
 // src/navbar.tsx
 import * as React19 from "react";
+
+// src/navbar-menu.tsx
 import { jsx as jsx32, jsxs as jsxs23 } from "react/jsx-runtime";
+function NavbarMenu({
+  search,
+  links,
+  actions,
+  defaultOpen = false
+}) {
+  return /* @__PURE__ */ jsx32("div", { className: "ml-auto md:hidden", children: /* @__PURE__ */ jsxs23(
+    NavDrawer,
+    {
+      label: "Navigation",
+      side: "right",
+      closedFrom: "md",
+      defaultOpen,
+      children: [
+        search && /* @__PURE__ */ jsx32("div", { className: "px-4 pb-3", children: search }),
+        links && /* @__PURE__ */ jsx32("nav", { className: "flex flex-col px-4 pb-3 [&>a]:whitespace-normal [&>a]:py-2.5 [&>a]:text-base", children: links }),
+        /* @__PURE__ */ jsx32("div", { className: "flex flex-col gap-2 border-t border-border p-4 [&>*]:w-full", children: actions })
+      ]
+    }
+  ) });
+}
+
+// src/navbar.tsx
+import { jsx as jsx33, jsxs as jsxs24 } from "react/jsx-runtime";
 var Navbar = React19.forwardRef(
   ({
     className,
@@ -3105,46 +3159,100 @@ var Navbar = React19.forwardRef(
     secondaryNav,
     children,
     ...props
-  }, ref) => /* @__PURE__ */ jsxs23(
-    "header",
-    {
-      ref,
-      className: cn(
-        "border-b border-border",
-        transparent ? "bg-transparent" : "bg-card",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs23("div", { className: "mx-auto flex h-14 max-w-content-xl items-center gap-4 px-4 sm:px-6", children: [
-          logo && /* @__PURE__ */ jsx32("div", { className: "flex-shrink-0", children: logo }),
-          /* @__PURE__ */ jsxs23(
-            "nav",
+  }, ref) => {
+    const hasLinks = React19.Children.toArray(children).length > 0;
+    const hasSearch = variant === "withSearch" && Boolean(search);
+    const folds = Boolean(actions) && (hasLinks || hasSearch);
+    const filled = hasSearch || variant === "centered" && hasLinks;
+    return /* @__PURE__ */ jsxs24(
+      "header",
+      {
+        ref,
+        className: cn(
+          "border-b border-border",
+          transparent ? "bg-transparent" : "bg-card",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs24(
+            "div",
             {
               className: cn(
-                // W0 (#5823): the links scroll on a narrow screen, never push
-                // the bar off the page
-                "flex min-w-0 items-center gap-4 overflow-x-auto",
-                variant === "centered" && "flex-1 [&>:first-child]:ml-auto [&>:nth-last-child(2)]:mr-auto"
+                "mx-auto flex min-h-14 max-w-content-xl items-center gap-x-4 gap-y-2 px-4 py-2 sm:px-6 md:h-14 md:py-0",
+                // nothing here can scroll or fold: the actions take their own row
+                !hasLinks && !folds && "flex-wrap md:flex-nowrap"
               ),
               children: [
-                children,
-                /* @__PURE__ */ jsx32(ScrollHintXMark, {})
+                logo && /* @__PURE__ */ jsx33(
+                  "div",
+                  {
+                    className: cn(
+                      hasLinks && !folds ? "flex-shrink-0" : "min-w-0 md:flex-shrink-0"
+                    ),
+                    children: logo
+                  }
+                ),
+                hasLinks && /* @__PURE__ */ jsxs24(
+                  "nav",
+                  {
+                    className: cn(
+                      // W0 (#5823): the links scroll on a narrow screen, never push
+                      // the bar off the page
+                      folds ? "hidden md:flex" : "flex",
+                      "min-w-0 items-center gap-4 overflow-x-auto",
+                      variant === "centered" && "flex-1 [&>:first-child]:ml-auto [&>:nth-last-child(2)]:mr-auto"
+                    ),
+                    children: [
+                      children,
+                      /* @__PURE__ */ jsx33(ScrollHintXMark, {})
+                    ]
+                  }
+                ),
+                hasSearch && /* @__PURE__ */ jsx33(
+                  "div",
+                  {
+                    className: cn(
+                      "min-w-0 flex-1 px-4 md:min-w-48",
+                      folds && "hidden md:block"
+                    ),
+                    children: search
+                  }
+                ),
+                !filled && hasLinks && /* @__PURE__ */ jsx33("div", { className: "flex-1" }),
+                actions && /* @__PURE__ */ jsx33(
+                  "div",
+                  {
+                    className: cn(
+                      folds ? "hidden md:flex" : "flex",
+                      "ml-auto min-w-0 flex-wrap items-center justify-end gap-2 md:shrink-0 md:flex-nowrap"
+                    ),
+                    children: actions
+                  }
+                ),
+                folds && /* @__PURE__ */ jsx33(
+                  NavbarMenu,
+                  {
+                    search: hasSearch ? search : void 0,
+                    links: hasLinks ? children : void 0,
+                    actions
+                  }
+                )
               ]
             }
           ),
-          variant === "withSearch" && search && /* @__PURE__ */ jsx32("div", { className: "min-w-0 flex-1 px-4", children: search }),
-          variant !== "centered" && variant !== "withSearch" && /* @__PURE__ */ jsx32("div", { className: "flex-1" }),
-          actions && /* @__PURE__ */ jsx32("div", { className: "flex shrink-0 items-center gap-2", children: actions })
-        ] }),
-        variant === "twoLevel" && secondaryNav && /* @__PURE__ */ jsx32("div", { className: "border-t border-border", children: /* @__PURE__ */ jsx32("div", { className: "mx-auto flex max-w-content-xl items-center gap-4 px-4 py-2 sm:px-6", children: secondaryNav }) })
-      ]
-    }
-  )
+          variant === "twoLevel" && secondaryNav && /* @__PURE__ */ jsx33("div", { className: "border-t border-border", children: /* @__PURE__ */ jsx33("div", { className: "mx-auto max-w-content-xl px-4 py-2 sm:px-6", children: /* @__PURE__ */ jsxs24("div", { className: "flex min-w-0 items-center gap-4 overflow-x-auto", children: [
+            secondaryNav,
+            /* @__PURE__ */ jsx33(ScrollHintXMark, {})
+          ] }) }) })
+        ]
+      }
+    );
+  }
 );
 Navbar.displayName = "Navbar";
 var NavbarLink = React19.forwardRef(
-  ({ className, active, ...props }, ref) => /* @__PURE__ */ jsx32(
+  ({ className, active, ...props }, ref) => /* @__PURE__ */ jsx33(
     "a",
     {
       ref,
@@ -3163,22 +3271,22 @@ NavbarLink.displayName = "NavbarLink";
 import * as React20 from "react";
 
 // src/empty-value.tsx
-import { jsx as jsx33, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs25 } from "react/jsx-runtime";
 var EMPTY_VALUE_GLYPH = "\u2014";
 function isEmptyValue(value) {
   return value === null || value === void 0 || value === false || typeof value === "string" && value.trim() === "";
 }
 function EmptyValue({ className }) {
-  return /* @__PURE__ */ jsxs24("span", { "data-empty-value": true, className: cn("text-muted-foreground", className), children: [
-    /* @__PURE__ */ jsx33("span", { "aria-hidden": "true", children: EMPTY_VALUE_GLYPH }),
-    /* @__PURE__ */ jsx33("span", { className: "sr-only", children: "Not set" })
+  return /* @__PURE__ */ jsxs25("span", { "data-empty-value": true, className: cn("text-muted-foreground", className), children: [
+    /* @__PURE__ */ jsx34("span", { "aria-hidden": "true", children: EMPTY_VALUE_GLYPH }),
+    /* @__PURE__ */ jsx34("span", { className: "sr-only", children: "Not set" })
   ] });
 }
 
 // src/card-variants.tsx
-import { jsx as jsx34, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
 var HorizontalCard = React20.forwardRef(
-  ({ className, media, hoverable, children, ...props }, ref) => /* @__PURE__ */ jsxs25(
+  ({ className, media, hoverable, children, ...props }, ref) => /* @__PURE__ */ jsxs26(
     "div",
     {
       ref,
@@ -3189,15 +3297,15 @@ var HorizontalCard = React20.forwardRef(
       ),
       ...props,
       children: [
-        media && /* @__PURE__ */ jsx34("div", { className: "flex-shrink-0", children: media }),
-        /* @__PURE__ */ jsx34("div", { className: "flex-1 p-4", children })
+        media && /* @__PURE__ */ jsx35("div", { className: "flex-shrink-0", children: media }),
+        /* @__PURE__ */ jsx35("div", { className: "flex-1 p-4", children })
       ]
     }
   )
 );
 HorizontalCard.displayName = "HorizontalCard";
 var ImageCard = React20.forwardRef(
-  ({ className, imageSrc, imageAlt, hoverable, children, ...props }, ref) => /* @__PURE__ */ jsxs25(
+  ({ className, imageSrc, imageAlt, hoverable, children, ...props }, ref) => /* @__PURE__ */ jsxs26(
     "div",
     {
       ref,
@@ -3208,7 +3316,7 @@ var ImageCard = React20.forwardRef(
       ),
       ...props,
       children: [
-        imageSrc && /* @__PURE__ */ jsx34("div", { className: "aspect-video w-full bg-muted", children: /* @__PURE__ */ jsx34(
+        imageSrc && /* @__PURE__ */ jsx35("div", { className: "aspect-video w-full bg-muted", children: /* @__PURE__ */ jsx35(
           "img",
           {
             src: imageSrc,
@@ -3216,13 +3324,13 @@ var ImageCard = React20.forwardRef(
             className: "h-full w-full object-cover"
           }
         ) }),
-        /* @__PURE__ */ jsx34("div", { className: "p-4", children })
+        /* @__PURE__ */ jsx35("div", { className: "p-4", children })
       ]
     }
   )
 );
 ImageCard.displayName = "ImageCard";
-var StatCardExtended = React20.forwardRef(({ className, label, value, trend, icon, ...props }, ref) => /* @__PURE__ */ jsxs25(
+var StatCardExtended = React20.forwardRef(({ className, label, value, trend, icon, ...props }, ref) => /* @__PURE__ */ jsxs26(
   "div",
   {
     ref,
@@ -3232,12 +3340,12 @@ var StatCardExtended = React20.forwardRef(({ className, label, value, trend, ico
     ),
     ...props,
     children: [
-      /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ jsx34("span", { className: "text-sm text-muted-foreground", children: label }),
-        icon && /* @__PURE__ */ jsx34("div", { className: "text-muted-foreground", children: icon })
+      /* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsx35("span", { className: "text-sm text-muted-foreground", children: label }),
+        icon && /* @__PURE__ */ jsx35("div", { className: "text-muted-foreground", children: icon })
       ] }),
-      /* @__PURE__ */ jsx34("p", { className: "mt-2 text-3xl font-bold text-foreground", children: isEmptyValue(value) ? /* @__PURE__ */ jsx34(EmptyValue, {}) : value }),
-      trend && /* @__PURE__ */ jsxs25(
+      /* @__PURE__ */ jsx35("p", { className: "mt-2 text-3xl font-bold text-foreground", children: isEmptyValue(value) ? /* @__PURE__ */ jsx35(EmptyValue, {}) : value }),
+      trend && /* @__PURE__ */ jsxs26(
         "p",
         {
           className: cn(
@@ -3258,7 +3366,7 @@ var StatCardExtended = React20.forwardRef(({ className, label, value, trend, ico
 ));
 StatCardExtended.displayName = "StatCardExtended";
 var ActionCard = React20.forwardRef(
-  ({ className, title, description, actions, children, ...props }, ref) => /* @__PURE__ */ jsxs25(
+  ({ className, title, description, actions, children, ...props }, ref) => /* @__PURE__ */ jsxs26(
     "div",
     {
       ref,
@@ -3268,12 +3376,12 @@ var ActionCard = React20.forwardRef(
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsxs25("div", { className: "p-6", children: [
-          /* @__PURE__ */ jsx34("h3", { className: "font-semibold text-foreground", children: title }),
-          description && /* @__PURE__ */ jsx34("p", { className: "mt-1 text-sm text-muted-foreground", children: description }),
+        /* @__PURE__ */ jsxs26("div", { className: "p-6", children: [
+          /* @__PURE__ */ jsx35("h3", { className: "font-semibold text-foreground", children: title }),
+          description && /* @__PURE__ */ jsx35("p", { className: "mt-1 text-sm text-muted-foreground", children: description }),
           children
         ] }),
-        actions && /* @__PURE__ */ jsx34("div", { className: "flex items-center gap-2 border-t border-border px-6 py-4", children: actions })
+        actions && /* @__PURE__ */ jsx35("div", { className: "flex items-center gap-2 border-t border-border px-6 py-4", children: actions })
       ]
     }
   )
@@ -3282,8 +3390,8 @@ ActionCard.displayName = "ActionCard";
 
 // src/modal-dialog.tsx
 import * as React21 from "react";
-import { createPortal } from "react-dom";
-import { Fragment as Fragment7, jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
+import { createPortal as createPortal2 } from "react-dom";
+import { Fragment as Fragment7, jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
 var SIZE_CLASSES2 = {
   sm: "max-w-sm",
   md: "max-w-md",
@@ -3302,9 +3410,9 @@ var ModalDialog = React21.forwardRef(
       return () => document.removeEventListener("keydown", handler);
     }, [open, onClose]);
     if (!open) return null;
-    return createPortal(
-      /* @__PURE__ */ jsxs26(Fragment7, { children: [
-        /* @__PURE__ */ jsx35(
+    return createPortal2(
+      /* @__PURE__ */ jsxs27(Fragment7, { children: [
+        /* @__PURE__ */ jsx36(
           "div",
           {
             className: "z-overlay fixed inset-0 bg-foreground/60 transition-opacity",
@@ -3312,7 +3420,7 @@ var ModalDialog = React21.forwardRef(
             "aria-hidden": "true"
           }
         ),
-        /* @__PURE__ */ jsx35("div", { className: "z-modal fixed inset-0 flex items-center justify-center p-4", children: /* @__PURE__ */ jsx35(
+        /* @__PURE__ */ jsx36("div", { className: "z-modal fixed inset-0 flex items-center justify-center p-4", children: /* @__PURE__ */ jsx36(
           "div",
           {
             ref,
@@ -3334,7 +3442,7 @@ var ModalDialog = React21.forwardRef(
   }
 );
 ModalDialog.displayName = "ModalDialog";
-var ModalHeader = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
+var ModalHeader = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
   "div",
   {
     ref,
@@ -3343,9 +3451,9 @@ var ModalHeader = React21.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 ModalHeader.displayName = "ModalHeader";
-var ModalBody = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35("div", { ref, className: cn("px-6 py-4", className), ...props }));
+var ModalBody = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36("div", { ref, className: cn("px-6 py-4", className), ...props }));
 ModalBody.displayName = "ModalBody";
-var ModalFooter = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
+var ModalFooter = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
   "div",
   {
     ref,
@@ -3360,8 +3468,8 @@ ModalFooter.displayName = "ModalFooter";
 
 // src/drawer.tsx
 import * as React22 from "react";
-import { createPortal as createPortal2 } from "react-dom";
-import { Fragment as Fragment8, jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
+import { createPortal as createPortal3 } from "react-dom";
+import { Fragment as Fragment8, jsx as jsx37, jsxs as jsxs28 } from "react/jsx-runtime";
 var SIZE_CLASSES3 = {
   left: { sm: "w-64", md: "w-80", lg: "w-96" },
   right: { sm: "w-64", md: "w-80", lg: "w-96" },
@@ -3391,9 +3499,9 @@ var Drawer = React22.forwardRef(
       return () => document.removeEventListener("keydown", handler);
     }, [open, onClose]);
     if (!open) return null;
-    return createPortal2(
-      /* @__PURE__ */ jsxs27(Fragment8, { children: [
-        /* @__PURE__ */ jsx36(
+    return createPortal3(
+      /* @__PURE__ */ jsxs28(Fragment8, { children: [
+        /* @__PURE__ */ jsx37(
           "div",
           {
             className: "z-overlay fixed inset-0 bg-foreground/60 transition-opacity",
@@ -3401,7 +3509,7 @@ var Drawer = React22.forwardRef(
             "aria-hidden": "true"
           }
         ),
-        /* @__PURE__ */ jsx36(
+        /* @__PURE__ */ jsx37(
           "div",
           {
             ref,
@@ -3426,7 +3534,7 @@ var Drawer = React22.forwardRef(
   }
 );
 Drawer.displayName = "Drawer";
-var DrawerHeader = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
+var DrawerHeader = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
   "div",
   {
     ref,
@@ -3435,7 +3543,7 @@ var DrawerHeader = React22.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 DrawerHeader.displayName = "DrawerHeader";
-var DrawerBody = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
+var DrawerBody = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
   "div",
   {
     ref,
@@ -3444,7 +3552,7 @@ var DrawerBody = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 DrawerBody.displayName = "DrawerBody";
-var DrawerFooter = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
+var DrawerFooter = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
   "div",
   {
     ref,
@@ -3459,9 +3567,9 @@ DrawerFooter.displayName = "DrawerFooter";
 
 // src/form-layout.tsx
 import * as React23 from "react";
-import { jsx as jsx37, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs29 } from "react/jsx-runtime";
 var FormLayout = React23.forwardRef(
-  ({ className, layout = "stacked", ...props }, ref) => /* @__PURE__ */ jsx37(
+  ({ className, layout = "stacked", ...props }, ref) => /* @__PURE__ */ jsx38(
     "form",
     {
       ref,
@@ -3476,18 +3584,18 @@ var FormLayout = React23.forwardRef(
   )
 );
 FormLayout.displayName = "FormLayout";
-var FormLayoutSection = React23.forwardRef(({ className, title, description, children, ...props }, ref) => /* @__PURE__ */ jsxs28(
+var FormLayoutSection = React23.forwardRef(({ className, title, description, children, ...props }, ref) => /* @__PURE__ */ jsxs29(
   "div",
   {
     ref,
     className: cn("border-b border-border pb-6", className),
     ...props,
     children: [
-      (title || description) && /* @__PURE__ */ jsxs28("div", { className: "mb-4", children: [
-        title && /* @__PURE__ */ jsx37("h3", { className: "text-base font-semibold text-foreground", children: title }),
-        description && /* @__PURE__ */ jsx37("p", { className: "mt-1 text-sm text-muted-foreground", children: description })
+      (title || description) && /* @__PURE__ */ jsxs29("div", { className: "mb-4", children: [
+        title && /* @__PURE__ */ jsx38("h3", { className: "text-base font-semibold text-foreground", children: title }),
+        description && /* @__PURE__ */ jsx38("p", { className: "mt-1 text-sm text-muted-foreground", children: description })
       ] }),
-      /* @__PURE__ */ jsx37("div", { className: "space-y-4", children })
+      /* @__PURE__ */ jsx38("div", { className: "space-y-4", children })
     ]
   }
 ));
@@ -3495,7 +3603,7 @@ FormLayoutSection.displayName = "FormLayoutSection";
 
 // src/input-group.tsx
 import * as React24 from "react";
-import { jsx as jsx38, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs30 } from "react/jsx-runtime";
 var InputGroup = React24.forwardRef(
   ({
     className,
@@ -3504,15 +3612,15 @@ var InputGroup = React24.forwardRef(
     suffixContent,
     children,
     ...props
-  }, ref) => /* @__PURE__ */ jsxs29(
+  }, ref) => /* @__PURE__ */ jsxs30(
     "div",
     {
       ref,
       className: cn("flex rounded-md shadow-sm", className),
       ...props,
       children: [
-        (addon === "prefix" || addon === "both") && addonContent && /* @__PURE__ */ jsx38("span", { className: "inline-flex items-center rounded-l-md border border-r-0 border-input bg-muted px-3 text-sm text-muted-foreground", children: addonContent }),
-        /* @__PURE__ */ jsx38(
+        (addon === "prefix" || addon === "both") && addonContent && /* @__PURE__ */ jsx39("span", { className: "inline-flex items-center rounded-l-md border border-r-0 border-input bg-muted px-3 text-sm text-muted-foreground", children: addonContent }),
+        /* @__PURE__ */ jsx39(
           "div",
           {
             className: cn(
@@ -3522,7 +3630,7 @@ var InputGroup = React24.forwardRef(
             children
           }
         ),
-        (addon === "suffix" || addon === "both") && (suffixContent || addonContent) && /* @__PURE__ */ jsx38("span", { className: "inline-flex items-center rounded-r-md border border-l-0 border-input bg-muted px-3 text-sm text-muted-foreground", children: suffixContent || addonContent })
+        (addon === "suffix" || addon === "both") && (suffixContent || addonContent) && /* @__PURE__ */ jsx39("span", { className: "inline-flex items-center rounded-r-md border border-l-0 border-input bg-muted px-3 text-sm text-muted-foreground", children: suffixContent || addonContent })
       ]
     }
   )
@@ -3531,7 +3639,7 @@ InputGroup.displayName = "InputGroup";
 
 // src/radio-group.tsx
 import * as React25 from "react";
-import { jsx as jsx39, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs31 } from "react/jsx-runtime";
 var RadioGroup = React25.forwardRef(
   ({
     className,
@@ -3542,9 +3650,9 @@ var RadioGroup = React25.forwardRef(
     name,
     label,
     ...props
-  }, ref) => /* @__PURE__ */ jsxs30("fieldset", { ref, className: cn("space-y-2", className), ...props, children: [
-    label && /* @__PURE__ */ jsx39("legend", { className: "mb-2 text-sm font-medium text-foreground", children: label }),
-    /* @__PURE__ */ jsx39(
+  }, ref) => /* @__PURE__ */ jsxs31("fieldset", { ref, className: cn("space-y-2", className), ...props, children: [
+    label && /* @__PURE__ */ jsx40("legend", { className: "mb-2 text-sm font-medium text-foreground", children: label }),
+    /* @__PURE__ */ jsx40(
       "div",
       {
         className: cn(
@@ -3555,7 +3663,7 @@ var RadioGroup = React25.forwardRef(
         children: options.map((option) => {
           const isSelected = value === option.value;
           if (variant === "card") {
-            return /* @__PURE__ */ jsxs30(
+            return /* @__PURE__ */ jsxs31(
               "label",
               {
                 className: cn(
@@ -3563,7 +3671,7 @@ var RadioGroup = React25.forwardRef(
                   isSelected ? "border-primary bg-primary/5" : "border-border bg-card hover:bg-muted/50"
                 ),
                 children: [
-                  /* @__PURE__ */ jsx39(
+                  /* @__PURE__ */ jsx40(
                     "input",
                     {
                       type: "radio",
@@ -3574,16 +3682,16 @@ var RadioGroup = React25.forwardRef(
                       className: "mt-0.5 h-4 w-4 accent-primary"
                     }
                   ),
-                  /* @__PURE__ */ jsxs30("div", { children: [
-                    /* @__PURE__ */ jsx39("span", { className: "text-sm font-medium text-foreground", children: option.label }),
-                    option.description && /* @__PURE__ */ jsx39("p", { className: "mt-0.5 text-xs text-muted-foreground", children: option.description })
+                  /* @__PURE__ */ jsxs31("div", { children: [
+                    /* @__PURE__ */ jsx40("span", { className: "text-sm font-medium text-foreground", children: option.label }),
+                    option.description && /* @__PURE__ */ jsx40("p", { className: "mt-0.5 text-xs text-muted-foreground", children: option.description })
                   ] })
                 ]
               },
               option.value
             );
           }
-          return /* @__PURE__ */ jsxs30(
+          return /* @__PURE__ */ jsxs31(
             "label",
             {
               className: cn(
@@ -3592,7 +3700,7 @@ var RadioGroup = React25.forwardRef(
                 variant === "stacked" && isSelected && "border-primary bg-primary/5"
               ),
               children: [
-                /* @__PURE__ */ jsx39(
+                /* @__PURE__ */ jsx40(
                   "input",
                   {
                     type: "radio",
@@ -3603,8 +3711,8 @@ var RadioGroup = React25.forwardRef(
                     className: "h-4 w-4 accent-primary"
                   }
                 ),
-                /* @__PURE__ */ jsx39("span", { className: "text-sm text-foreground", children: option.label }),
-                option.description && variant === "stacked" && /* @__PURE__ */ jsx39("span", { className: "ml-auto text-xs text-muted-foreground", children: option.description })
+                /* @__PURE__ */ jsx40("span", { className: "text-sm text-foreground", children: option.label }),
+                option.description && variant === "stacked" && /* @__PURE__ */ jsx40("span", { className: "ml-auto text-xs text-muted-foreground", children: option.description })
               ]
             },
             option.value
@@ -3618,7 +3726,7 @@ RadioGroup.displayName = "RadioGroup";
 
 // src/combobox.tsx
 import * as React26 from "react";
-import { jsx as jsx40, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs32 } from "react/jsx-runtime";
 var Combobox = React26.forwardRef(
   ({
     className,
@@ -3650,20 +3758,20 @@ var Combobox = React26.forwardRef(
       }
     };
     const displayValue = multi ? null : options.find((o) => o.value === selected)?.label;
-    return /* @__PURE__ */ jsxs31("div", { ref, className: cn("relative", className), ...props, children: [
-      /* @__PURE__ */ jsxs31(
+    return /* @__PURE__ */ jsxs32("div", { ref, className: cn("relative", className), ...props, children: [
+      /* @__PURE__ */ jsxs32(
         "div",
         {
           className: "flex min-h-9 cursor-pointer items-center gap-1 rounded-md border border-input bg-background px-3 py-1.5",
           onClick: () => setOpen(!open),
           children: [
-            multi && Array.isArray(selected) && selected.length > 0 ? /* @__PURE__ */ jsx40("div", { className: "flex flex-wrap gap-1", children: selected.map((v) => /* @__PURE__ */ jsxs31(
+            multi && Array.isArray(selected) && selected.length > 0 ? /* @__PURE__ */ jsx41("div", { className: "flex flex-wrap gap-1", children: selected.map((v) => /* @__PURE__ */ jsxs32(
               "span",
               {
                 className: "text-primary-text inline-flex items-center gap-1 rounded bg-primary/10 px-2 py-0.5 text-xs font-medium",
                 children: [
                   options.find((o) => o.value === v)?.label,
-                  /* @__PURE__ */ jsx40(
+                  /* @__PURE__ */ jsx41(
                     "button",
                     {
                       type: "button",
@@ -3678,7 +3786,7 @@ var Combobox = React26.forwardRef(
                 ]
               },
               v
-            )) }) : /* @__PURE__ */ jsx40(
+            )) }) : /* @__PURE__ */ jsx41(
               "span",
               {
                 className: cn(
@@ -3688,12 +3796,12 @@ var Combobox = React26.forwardRef(
                 children: displayValue || placeholder
               }
             ),
-            /* @__PURE__ */ jsx40("span", { className: "ml-auto text-muted-foreground", children: "\u25BE" })
+            /* @__PURE__ */ jsx41("span", { className: "ml-auto text-muted-foreground", children: "\u25BE" })
           ]
         }
       ),
-      open && /* @__PURE__ */ jsxs31("div", { className: "z-dropdown absolute mt-1 w-full rounded-md border border-border bg-card shadow-lg", children: [
-        filterable && /* @__PURE__ */ jsx40("div", { className: "border-b border-border p-2", children: /* @__PURE__ */ jsx40(
+      open && /* @__PURE__ */ jsxs32("div", { className: "z-dropdown absolute mt-1 w-full rounded-md border border-border bg-card shadow-lg", children: [
+        filterable && /* @__PURE__ */ jsx41("div", { className: "border-b border-border p-2", children: /* @__PURE__ */ jsx41(
           "input",
           {
             type: "text",
@@ -3704,9 +3812,9 @@ var Combobox = React26.forwardRef(
             autoFocus: true
           }
         ) }),
-        /* @__PURE__ */ jsx40("div", { className: "max-h-60 overflow-y-auto p-1", children: filtered.length === 0 ? /* @__PURE__ */ jsx40("div", { className: "px-3 py-2 text-sm text-muted-foreground", children: "No results" }) : filtered.map((option) => {
+        /* @__PURE__ */ jsx41("div", { className: "max-h-60 overflow-y-auto p-1", children: filtered.length === 0 ? /* @__PURE__ */ jsx41("div", { className: "px-3 py-2 text-sm text-muted-foreground", children: "No results" }) : filtered.map((option) => {
           const isSelected = multi ? Array.isArray(selected) && selected.includes(option.value) : selected === option.value;
-          return /* @__PURE__ */ jsxs31(
+          return /* @__PURE__ */ jsxs32(
             "button",
             {
               type: "button",
@@ -3716,9 +3824,9 @@ var Combobox = React26.forwardRef(
               ),
               onClick: () => handleSelect(option.value),
               children: [
-                multi && /* @__PURE__ */ jsx40("span", { className: "mr-2", children: isSelected ? "\u2611" : "\u2610" }),
+                multi && /* @__PURE__ */ jsx41("span", { className: "mr-2", children: isSelected ? "\u2611" : "\u2610" }),
                 option.label,
-                !multi && isSelected && /* @__PURE__ */ jsx40("span", { className: "text-primary-text ml-auto", children: "\u2713" })
+                !multi && isSelected && /* @__PURE__ */ jsx41("span", { className: "text-primary-text ml-auto", children: "\u2713" })
               ]
             },
             option.value
@@ -3732,7 +3840,7 @@ Combobox.displayName = "Combobox";
 
 // src/notification-banner.tsx
 import * as React27 from "react";
-import { jsx as jsx41, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs33 } from "react/jsx-runtime";
 var INTENT_STYLES = {
   success: {
     subtle: "bg-intent-success/10 text-intent-success-foreground border-intent-success/20",
@@ -3779,7 +3887,7 @@ var NotificationBanner = React27.forwardRef(
       setDismissed(true);
       onDismiss?.();
     };
-    return /* @__PURE__ */ jsxs32(
+    return /* @__PURE__ */ jsxs33(
       "div",
       {
         ref,
@@ -3791,13 +3899,13 @@ var NotificationBanner = React27.forwardRef(
         ),
         ...props,
         children: [
-          /* @__PURE__ */ jsx41("span", { className: "flex-shrink-0 pt-0.5", "aria-hidden": "true", children: /* @__PURE__ */ jsx41(Icon, { name: ICON_MAP[intent], size: "md" }) }),
-          /* @__PURE__ */ jsxs32("div", { className: "min-w-0 flex-1", children: [
-            title && /* @__PURE__ */ jsx41("p", { className: "font-semibold", children: title }),
-            children && /* @__PURE__ */ jsx41("div", { className: cn(title && "mt-1", "text-sm"), children })
+          /* @__PURE__ */ jsx42("span", { className: "flex-shrink-0 pt-0.5", "aria-hidden": "true", children: /* @__PURE__ */ jsx42(Icon, { name: ICON_MAP[intent], size: "md" }) }),
+          /* @__PURE__ */ jsxs33("div", { className: "min-w-0 flex-1", children: [
+            title && /* @__PURE__ */ jsx42("p", { className: "font-semibold", children: title }),
+            children && /* @__PURE__ */ jsx42("div", { className: cn(title && "mt-1", "text-sm"), children })
           ] }),
-          action && /* @__PURE__ */ jsx41("div", { className: "flex-shrink-0", children: action }),
-          dismissible && /* @__PURE__ */ jsx41(
+          action && /* @__PURE__ */ jsx42("div", { className: "flex-shrink-0", children: action }),
+          dismissible && /* @__PURE__ */ jsx42(
             "button",
             {
               type: "button",
@@ -3816,8 +3924,8 @@ NotificationBanner.displayName = "NotificationBanner";
 
 // src/notification-panel.tsx
 import * as React28 from "react";
-import { jsx as jsx42, jsxs as jsxs33 } from "react/jsx-runtime";
-var NotificationPanel = React28.forwardRef(({ className, unreadCount = 0, onMarkAllRead, children, ...props }, ref) => /* @__PURE__ */ jsxs33(
+import { jsx as jsx43, jsxs as jsxs34 } from "react/jsx-runtime";
+var NotificationPanel = React28.forwardRef(({ className, unreadCount = 0, onMarkAllRead, children, ...props }, ref) => /* @__PURE__ */ jsxs34(
   "div",
   {
     ref,
@@ -3827,12 +3935,12 @@ var NotificationPanel = React28.forwardRef(({ className, unreadCount = 0, onMark
     ),
     ...props,
     children: [
-      /* @__PURE__ */ jsxs33("div", { className: "flex items-center justify-between border-b border-border px-4 py-3", children: [
-        /* @__PURE__ */ jsxs33("h3", { className: "text-sm font-semibold text-foreground", children: [
+      /* @__PURE__ */ jsxs34("div", { className: "flex items-center justify-between border-b border-border px-4 py-3", children: [
+        /* @__PURE__ */ jsxs34("h3", { className: "text-sm font-semibold text-foreground", children: [
           "Notifications",
-          unreadCount > 0 && /* @__PURE__ */ jsx42("span", { className: "bg-primary-solid ml-2 inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs text-primary-foreground", children: unreadCount })
+          unreadCount > 0 && /* @__PURE__ */ jsx43("span", { className: "bg-primary-solid ml-2 inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-xs text-primary-foreground", children: unreadCount })
         ] }),
-        onMarkAllRead && unreadCount > 0 && /* @__PURE__ */ jsx42(
+        onMarkAllRead && unreadCount > 0 && /* @__PURE__ */ jsx43(
           "button",
           {
             type: "button",
@@ -3842,12 +3950,12 @@ var NotificationPanel = React28.forwardRef(({ className, unreadCount = 0, onMark
           }
         )
       ] }),
-      /* @__PURE__ */ jsx42("div", { className: "max-h-80 divide-y divide-border overflow-y-auto", children })
+      /* @__PURE__ */ jsx43("div", { className: "max-h-80 divide-y divide-border overflow-y-auto", children })
     ]
   }
 ));
 NotificationPanel.displayName = "NotificationPanel";
-var NotificationPanelItem = React28.forwardRef(({ className, title, description, time, unread, icon, ...props }, ref) => /* @__PURE__ */ jsxs33(
+var NotificationPanelItem = React28.forwardRef(({ className, title, description, time, unread, icon, ...props }, ref) => /* @__PURE__ */ jsxs34(
   "div",
   {
     ref,
@@ -3858,9 +3966,9 @@ var NotificationPanelItem = React28.forwardRef(({ className, title, description,
     ),
     ...props,
     children: [
-      icon && /* @__PURE__ */ jsx42("div", { className: "flex-shrink-0 pt-0.5", children: icon }),
-      /* @__PURE__ */ jsxs33("div", { className: "min-w-0 flex-1", children: [
-        /* @__PURE__ */ jsx42(
+      icon && /* @__PURE__ */ jsx43("div", { className: "flex-shrink-0 pt-0.5", children: icon }),
+      /* @__PURE__ */ jsxs34("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx43(
           "p",
           {
             className: cn(
@@ -3870,22 +3978,22 @@ var NotificationPanelItem = React28.forwardRef(({ className, title, description,
             children: title
           }
         ),
-        description && /* @__PURE__ */ jsx42("p", { className: "mt-0.5 text-xs text-muted-foreground", children: description }),
-        time && /* @__PURE__ */ jsx42("p", { className: "mt-1 text-xs text-muted-foreground", children: time })
+        description && /* @__PURE__ */ jsx43("p", { className: "mt-0.5 text-xs text-muted-foreground", children: description }),
+        time && /* @__PURE__ */ jsx43("p", { className: "mt-1 text-xs text-muted-foreground", children: time })
       ] }),
-      unread && /* @__PURE__ */ jsx42("div", { className: "flex-shrink-0 pt-1.5", children: /* @__PURE__ */ jsx42("div", { className: "h-2 w-2 rounded-full bg-primary" }) })
+      unread && /* @__PURE__ */ jsx43("div", { className: "flex-shrink-0 pt-1.5", children: /* @__PURE__ */ jsx43("div", { className: "h-2 w-2 rounded-full bg-primary" }) })
     ]
   }
 ));
 NotificationPanelItem.displayName = "NotificationPanelItem";
 
 // src/skeleton-patterns.tsx
-import { jsx as jsx43, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs35 } from "react/jsx-runtime";
 function SkeletonBar2({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx44(
     "div",
     {
       className: cn("animate-pulse rounded-md bg-muted", className),
@@ -3899,7 +4007,7 @@ function SkeletonTable({
   columns = 4,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs34(
+  return /* @__PURE__ */ jsxs35(
     "div",
     {
       className: cn(
@@ -3908,15 +4016,15 @@ function SkeletonTable({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx43("div", { className: "flex gap-4 border-b border-border bg-muted/50 px-4 py-3", children: Array.from({ length: columns }).map((_, i) => /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-4 flex-1" }, `h-${i}`)) }),
-        Array.from({ length: rows }).map((_, row) => /* @__PURE__ */ jsx43(
+        /* @__PURE__ */ jsx44("div", { className: "flex gap-4 border-b border-border bg-muted/50 px-4 py-3", children: Array.from({ length: columns }).map((_, i) => /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-4 flex-1" }, `h-${i}`)) }),
+        Array.from({ length: rows }).map((_, row) => /* @__PURE__ */ jsx44(
           "div",
           {
             className: cn(
               "flex gap-4 px-4 py-3",
               row < rows - 1 && "border-b border-border"
             ),
-            children: Array.from({ length: columns }).map((_2, col) => /* @__PURE__ */ jsx43(
+            children: Array.from({ length: columns }).map((_2, col) => /* @__PURE__ */ jsx44(
               SkeletonBar2,
               {
                 className: cn("h-4 flex-1", col === 0 && "max-w-[140px]")
@@ -3938,17 +4046,17 @@ function SkeletonCardGrid({
   ...props
 }) {
   const colClass = columns === 2 ? "grid-cols-1 sm:grid-cols-2" : "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3";
-  return /* @__PURE__ */ jsx43("div", { className: cn("grid gap-4", colClass, className), ...props, children: Array.from({ length: cards }).map((_, i) => /* @__PURE__ */ jsxs34(
+  return /* @__PURE__ */ jsx44("div", { className: cn("grid gap-4", colClass, className), ...props, children: Array.from({ length: cards }).map((_, i) => /* @__PURE__ */ jsxs35(
     "div",
     {
       className: "space-y-3 rounded-lg border border-border p-4",
       children: [
-        /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-4 w-3/4" }),
-        /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-3 w-full" }),
-        /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-3 w-5/6" }),
-        /* @__PURE__ */ jsxs34("div", { className: "flex gap-2 pt-2", children: [
-          /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-6 w-6 rounded-full" }),
-          /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-4 w-20" })
+        /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-4 w-3/4" }),
+        /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-3 w-full" }),
+        /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-3 w-5/6" }),
+        /* @__PURE__ */ jsxs35("div", { className: "flex gap-2 pt-2", children: [
+          /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-6 w-6 rounded-full" }),
+          /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-4 w-20" })
         ] })
       ]
     },
@@ -3957,19 +4065,19 @@ function SkeletonCardGrid({
 }
 SkeletonCardGrid.displayName = "SkeletonCardGrid";
 function SkeletonDetail({ className, ...props }) {
-  return /* @__PURE__ */ jsxs34("div", { className: cn("space-y-6", className), ...props, children: [
-    /* @__PURE__ */ jsxs34("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-8 w-1/3" }),
-      /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-4 w-2/3" })
+  return /* @__PURE__ */ jsxs35("div", { className: cn("space-y-6", className), ...props, children: [
+    /* @__PURE__ */ jsxs35("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-8 w-1/3" }),
+      /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-4 w-2/3" })
     ] }),
-    /* @__PURE__ */ jsx43("div", { className: "space-y-4", children: Array.from({ length: 4 }).map((_, i) => /* @__PURE__ */ jsxs34("div", { className: "flex justify-between", children: [
-      /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-4 w-24" }),
-      /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-4 w-40" })
+    /* @__PURE__ */ jsx44("div", { className: "space-y-4", children: Array.from({ length: 4 }).map((_, i) => /* @__PURE__ */ jsxs35("div", { className: "flex justify-between", children: [
+      /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-4 w-24" }),
+      /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-4 w-40" })
     ] }, `dl-${i}`)) }),
-    /* @__PURE__ */ jsxs34("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-4 w-full" }),
-      /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-4 w-full" }),
-      /* @__PURE__ */ jsx43(SkeletonBar2, { className: "h-4 w-3/4" })
+    /* @__PURE__ */ jsxs35("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-4 w-full" }),
+      /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-4 w-full" }),
+      /* @__PURE__ */ jsx44(SkeletonBar2, { className: "h-4 w-3/4" })
     ] })
   ] });
 }
@@ -3977,14 +4085,14 @@ SkeletonDetail.displayName = "SkeletonDetail";
 
 // src/toggle.tsx
 import * as React29 from "react";
-import { jsx as jsx44 } from "react/jsx-runtime";
+import { jsx as jsx45 } from "react/jsx-runtime";
 var SIZE_CLASSES4 = {
   sm: "h-8 px-2 text-xs",
   md: "h-9 px-3 text-sm",
   lg: "h-10 px-4 text-base"
 };
 var Toggle = React29.forwardRef(
-  ({ className, pressed, variant = "default", size = "md", ...props }, ref) => /* @__PURE__ */ jsx44(
+  ({ className, pressed, variant = "default", size = "md", ...props }, ref) => /* @__PURE__ */ jsx45(
     "button",
     {
       ref,
@@ -4030,7 +4138,7 @@ var ToggleGroup = React29.forwardRef(
         );
       }
     };
-    return /* @__PURE__ */ jsx44(
+    return /* @__PURE__ */ jsx45(
       "div",
       {
         ref,
@@ -4059,7 +4167,7 @@ ToggleGroup.displayName = "ToggleGroup";
 
 // src/avatar-group.tsx
 import * as React30 from "react";
-import { jsx as jsx45, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs36 } from "react/jsx-runtime";
 var SIZE_MAP = {
   xs: { avatar: "h-6 w-6", ring: "ring-1", text: "text-[10px]" },
   sm: { avatar: "h-8 w-8", ring: "ring-2", text: "text-xs" },
@@ -4078,8 +4186,8 @@ var AvatarGroup = React30.forwardRef(
     const visible = items.slice(0, max);
     const overflow = items.length - max;
     const sizeConfig3 = SIZE_MAP[size];
-    return /* @__PURE__ */ jsxs35("div", { ref, className: cn("flex items-center", className), ...props, children: [
-      visible.map((child, i) => /* @__PURE__ */ jsx45(
+    return /* @__PURE__ */ jsxs36("div", { ref, className: cn("flex items-center", className), ...props, children: [
+      visible.map((child, i) => /* @__PURE__ */ jsx46(
         "div",
         {
           className: cn(
@@ -4091,7 +4199,7 @@ var AvatarGroup = React30.forwardRef(
         },
         i
       )),
-      overflow > 0 && /* @__PURE__ */ jsx45(
+      overflow > 0 && /* @__PURE__ */ jsx46(
         "div",
         {
           className: cn(
@@ -4100,7 +4208,7 @@ var AvatarGroup = React30.forwardRef(
             sizeConfig3.ring,
             OVERLAP_MAP[size]
           ),
-          children: /* @__PURE__ */ jsxs35(
+          children: /* @__PURE__ */ jsxs36(
             "span",
             {
               className: cn(
@@ -4122,7 +4230,7 @@ AvatarGroup.displayName = "AvatarGroup";
 var AvatarGroupItem = React30.forwardRef(({ className, fallback, size = "md", alt, src, ...props }, ref) => {
   const sizeConfig3 = SIZE_MAP[size];
   if (!src && fallback) {
-    return /* @__PURE__ */ jsx45(
+    return /* @__PURE__ */ jsx46(
       "div",
       {
         className: cn(
@@ -4136,7 +4244,7 @@ var AvatarGroupItem = React30.forwardRef(({ className, fallback, size = "md", al
       }
     );
   }
-  return /* @__PURE__ */ jsx45(
+  return /* @__PURE__ */ jsx46(
     "img",
     {
       ref,
@@ -4151,9 +4259,9 @@ AvatarGroupItem.displayName = "AvatarGroupItem";
 
 // src/tab-bar.tsx
 import * as React31 from "react";
-import { jsx as jsx46, jsxs as jsxs36 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs37 } from "react/jsx-runtime";
 var TabBar = React31.forwardRef(
-  ({ className, variant = "underline", children, ...props }, ref) => /* @__PURE__ */ jsxs36(
+  ({ className, variant = "underline", children, ...props }, ref) => /* @__PURE__ */ jsxs37(
     "div",
     {
       ref,
@@ -4180,14 +4288,14 @@ var TabBar = React31.forwardRef(
             { _variant: variant }
           );
         }),
-        /* @__PURE__ */ jsx46(ScrollHintXMark, {})
+        /* @__PURE__ */ jsx47(ScrollHintXMark, {})
       ]
     }
   )
 );
 TabBar.displayName = "TabBar";
 var TabBarItem = React31.forwardRef(
-  ({ className, active, disabled, _variant: variant = "underline", ...props }, ref) => /* @__PURE__ */ jsx46(
+  ({ className, active, disabled, _variant: variant = "underline", ...props }, ref) => /* @__PURE__ */ jsx47(
     "button",
     {
       ref,
@@ -4223,7 +4331,7 @@ var TabBarItem = React31.forwardRef(
 TabBarItem.displayName = "TabBarItem";
 
 // src/sticky-action-bar.tsx
-import { jsx as jsx47, jsxs as jsxs37 } from "react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs38 } from "react/jsx-runtime";
 function StickyActionBar({
   context,
   actions,
@@ -4231,7 +4339,7 @@ function StickyActionBar({
   className,
   testId = "sticky-action-bar"
 }) {
-  return /* @__PURE__ */ jsx47(
+  return /* @__PURE__ */ jsx48(
     "div",
     {
       "data-testid": testId,
@@ -4242,9 +4350,9 @@ function StickyActionBar({
         topClassName,
         className
       ),
-      children: /* @__PURE__ */ jsxs37("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [
-        context != null ? /* @__PURE__ */ jsx47("div", { className: "flex min-w-0 flex-wrap items-center gap-x-3 gap-y-1.5", children: context }) : /* @__PURE__ */ jsx47("span", {}),
-        /* @__PURE__ */ jsx47("div", { className: "flex shrink-0 items-center gap-2", children: actions })
+      children: /* @__PURE__ */ jsxs38("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [
+        context != null ? /* @__PURE__ */ jsx48("div", { className: "flex min-w-0 flex-wrap items-center gap-x-3 gap-y-1.5", children: context }) : /* @__PURE__ */ jsx48("span", {}),
+        /* @__PURE__ */ jsx48("div", { className: "flex shrink-0 items-center gap-2", children: actions })
       ] })
     }
   );
@@ -4252,14 +4360,14 @@ function StickyActionBar({
 
 // src/button-group.tsx
 import * as React32 from "react";
-import { jsx as jsx48 } from "react/jsx-runtime";
+import { jsx as jsx49 } from "react/jsx-runtime";
 var SIZE_CLASSES5 = {
   sm: "h-8 px-3 text-xs",
   md: "h-9 px-4 text-sm",
   lg: "h-10 px-5 text-base"
 };
 var ButtonGroup = React32.forwardRef(
-  ({ className, variant = "default", size = "md", children, ...props }, ref) => /* @__PURE__ */ jsx48(
+  ({ className, variant = "default", size = "md", children, ...props }, ref) => /* @__PURE__ */ jsx49(
     "div",
     {
       ref,
@@ -4290,7 +4398,7 @@ var ButtonGroupItem = React32.forwardRef(
     _variant: variant = "default",
     _size: size = "md",
     ...props
-  }, ref) => /* @__PURE__ */ jsx48(
+  }, ref) => /* @__PURE__ */ jsx49(
     "button",
     {
       ref,
@@ -4332,7 +4440,7 @@ ButtonGroupItem.displayName = "ButtonGroupItem";
 
 // src/data-table.tsx
 import * as React33 from "react";
-import { jsx as jsx49, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs39 } from "react/jsx-runtime";
 var DataTable = React33.forwardRef(
   ({
     className,
@@ -4343,8 +4451,8 @@ var DataTable = React33.forwardRef(
   }, ref) => (
     // W1.5 Batch 0 (#5823): a flex row, so the x mark (`ScrollHintXMark`,
     // last child) sits beside the table, not under it
-    /* @__PURE__ */ jsxs38("div", { className: "flex w-full overflow-x-auto", children: [
-      /* @__PURE__ */ jsx49(
+    /* @__PURE__ */ jsxs39("div", { className: "flex w-full overflow-x-auto", children: [
+      /* @__PURE__ */ jsx50(
         "table",
         {
           ref,
@@ -4358,12 +4466,12 @@ var DataTable = React33.forwardRef(
           ...props
         }
       ),
-      /* @__PURE__ */ jsx49(ScrollHintXMark, {})
+      /* @__PURE__ */ jsx50(ScrollHintXMark, {})
     ] })
   )
 );
 DataTable.displayName = "DataTable";
-var TableHeader = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx49(
+var TableHeader = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx50(
   "thead",
   {
     ref,
@@ -4372,7 +4480,7 @@ var TableHeader = React33.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TableHeader.displayName = "TableHeader";
-var TableBody = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx49(
+var TableBody = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx50(
   "tbody",
   {
     ref,
@@ -4382,7 +4490,7 @@ var TableBody = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE_
 ));
 TableBody.displayName = "TableBody";
 var TableRow = React33.forwardRef(
-  ({ className, selected, ...props }, ref) => /* @__PURE__ */ jsx49(
+  ({ className, selected, ...props }, ref) => /* @__PURE__ */ jsx50(
     "tr",
     {
       ref,
@@ -4409,7 +4517,7 @@ var TableCell = React33.forwardRef(
   ({ className, header, sortDirection, onSort, children, ...props }, ref) => {
     const Tag2 = header ? "th" : "td";
     const sortIndicator = sortDirection === "asc" ? " \u2191" : sortDirection === "desc" ? " \u2193" : "";
-    return /* @__PURE__ */ jsxs38(
+    return /* @__PURE__ */ jsxs39(
       Tag2,
       {
         ref,
@@ -4424,14 +4532,14 @@ var TableCell = React33.forwardRef(
         ...props,
         children: [
           children,
-          header && sortIndicator && /* @__PURE__ */ jsx49("span", { className: "text-primary-text ml-1", children: sortIndicator })
+          header && sortIndicator && /* @__PURE__ */ jsx50("span", { className: "text-primary-text ml-1", children: sortIndicator })
         ]
       }
     );
   }
 );
 TableCell.displayName = "TableCell";
-var TableCaption = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx49(
+var TableCaption = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx50(
   "caption",
   {
     ref,
@@ -4443,14 +4551,14 @@ TableCaption.displayName = "TableCaption";
 
 // src/stat-group.tsx
 import * as React34 from "react";
-import { jsx as jsx50 } from "react/jsx-runtime";
+import { jsx as jsx51 } from "react/jsx-runtime";
 var COL_CLASSES = {
   2: "grid-cols-1 sm:grid-cols-2",
   3: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
   4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4"
 };
 var StatGroup = React34.forwardRef(
-  ({ className, columns = 3, variant = "card", children, ...props }, ref) => /* @__PURE__ */ jsx50(
+  ({ className, columns = 3, variant = "card", children, ...props }, ref) => /* @__PURE__ */ jsx51(
     "div",
     {
       ref,
@@ -4469,9 +4577,9 @@ StatGroup.displayName = "StatGroup";
 
 // src/description-list.tsx
 import * as React35 from "react";
-import { jsx as jsx51, jsxs as jsxs39 } from "react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs40 } from "react/jsx-runtime";
 var DescriptionLayoutContext = React35.createContext("stacked");
-var DescriptionList = React35.forwardRef(({ className, layout = "stacked", ...props }, ref) => /* @__PURE__ */ jsx51(DescriptionLayoutContext.Provider, { value: layout, children: /* @__PURE__ */ jsx51(
+var DescriptionList = React35.forwardRef(({ className, layout = "stacked", ...props }, ref) => /* @__PURE__ */ jsx52(DescriptionLayoutContext.Provider, { value: layout, children: /* @__PURE__ */ jsx52(
   "dl",
   {
     ref,
@@ -4488,7 +4596,7 @@ DescriptionList.displayName = "DescriptionList";
 var DescriptionItem = React35.forwardRef(
   ({ className, label, value, ...props }, ref) => {
     const layout = React35.useContext(DescriptionLayoutContext);
-    return /* @__PURE__ */ jsxs39(
+    return /* @__PURE__ */ jsxs40(
       "div",
       {
         ref,
@@ -4500,7 +4608,7 @@ var DescriptionItem = React35.forwardRef(
         ),
         ...props,
         children: [
-          /* @__PURE__ */ jsx51(
+          /* @__PURE__ */ jsx52(
             "dt",
             {
               className: cn(
@@ -4510,7 +4618,7 @@ var DescriptionItem = React35.forwardRef(
               children: label
             }
           ),
-          /* @__PURE__ */ jsx51(
+          /* @__PURE__ */ jsx52(
             "dd",
             {
               className: cn(
@@ -4518,7 +4626,7 @@ var DescriptionItem = React35.forwardRef(
                 layout !== "side-by-side" && "mt-1",
                 layout === "side-by-side" && "text-right"
               ),
-              children: isEmptyValue(value) ? /* @__PURE__ */ jsx51(EmptyValue, {}) : value
+              children: isEmptyValue(value) ? /* @__PURE__ */ jsx52(EmptyValue, {}) : value
             }
           )
         ]
@@ -4530,9 +4638,9 @@ DescriptionItem.displayName = "DescriptionItem";
 
 // src/activity-feed.tsx
 import * as React36 from "react";
-import { jsx as jsx52, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx53, jsxs as jsxs41 } from "react/jsx-runtime";
 var ActivityFeed = React36.forwardRef(
-  ({ className, variant = "simple", ...props }, ref) => /* @__PURE__ */ jsx52(
+  ({ className, variant = "simple", ...props }, ref) => /* @__PURE__ */ jsx53(
     "div",
     {
       ref,
@@ -4544,18 +4652,18 @@ var ActivityFeed = React36.forwardRef(
 );
 ActivityFeed.displayName = "ActivityFeed";
 var ActivityFeedItem = React36.forwardRef(
-  ({ className, avatar, eventDescription, timestamp, isLast, ...props }, ref) => /* @__PURE__ */ jsxs40(
+  ({ className, avatar, eventDescription, timestamp, isLast, ...props }, ref) => /* @__PURE__ */ jsxs41(
     "div",
     {
       ref,
       className: cn("relative flex gap-3 pb-6", className),
       ...props,
       children: [
-        !isLast && /* @__PURE__ */ jsx52("div", { className: "absolute left-5 top-10 -ml-px h-full w-0.5 bg-muted" }),
-        /* @__PURE__ */ jsx52("div", { className: "relative flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-full bg-muted", children: avatar }),
-        /* @__PURE__ */ jsxs40("div", { className: "min-w-0 flex-1 pt-1", children: [
-          /* @__PURE__ */ jsx52("div", { className: "text-sm text-foreground", children: eventDescription }),
-          timestamp && /* @__PURE__ */ jsx52("p", { className: "mt-0.5 text-xs text-muted-foreground", children: timestamp })
+        !isLast && /* @__PURE__ */ jsx53("div", { className: "absolute left-5 top-10 -ml-px h-full w-0.5 bg-muted" }),
+        /* @__PURE__ */ jsx53("div", { className: "relative flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-full bg-muted", children: avatar }),
+        /* @__PURE__ */ jsxs41("div", { className: "min-w-0 flex-1 pt-1", children: [
+          /* @__PURE__ */ jsx53("div", { className: "text-sm text-foreground", children: eventDescription }),
+          timestamp && /* @__PURE__ */ jsx53("p", { className: "mt-0.5 text-xs text-muted-foreground", children: timestamp })
         ] })
       ]
     }
@@ -4565,7 +4673,7 @@ ActivityFeedItem.displayName = "ActivityFeedItem";
 
 // src/alert.tsx
 import * as React37 from "react";
-import { jsx as jsx53, jsxs as jsxs41 } from "react/jsx-runtime";
+import { jsx as jsx54, jsxs as jsxs42 } from "react/jsx-runtime";
 var INTENT_SUBTLE_STYLES = {
   success: "bg-intent-success/10 text-intent-success-foreground border-intent-success/20",
   warning: "bg-intent-warning/10 text-intent-warning-foreground border-intent-warning/20",
@@ -4602,7 +4710,7 @@ var Alert = React37.forwardRef(
     ...props
   }, ref) => {
     const styles = variant === "solid" ? SOLID_STYLES[intent] : variant === "outline" ? OUTLINE_STYLES[intent] : INTENT_SUBTLE_STYLES[intent];
-    return /* @__PURE__ */ jsxs41(
+    return /* @__PURE__ */ jsxs42(
       "div",
       {
         ref,
@@ -4610,12 +4718,12 @@ var Alert = React37.forwardRef(
         className: cn("flex gap-3 rounded-lg border p-4", styles, className),
         ...props,
         children: [
-          /* @__PURE__ */ jsx53("span", { className: "flex-shrink-0 pt-0.5", "aria-hidden": "true", children: /* @__PURE__ */ jsx53(Icon, { name: ICON_MAP2[intent], size: "md" }) }),
-          /* @__PURE__ */ jsxs41("div", { className: "min-w-0 flex-1", children: [
-            title && /* @__PURE__ */ jsx53("p", { className: "font-semibold", children: title }),
-            children && /* @__PURE__ */ jsx53("div", { className: cn(title && "mt-1", "text-sm"), children })
+          /* @__PURE__ */ jsx54("span", { className: "flex-shrink-0 pt-0.5", "aria-hidden": "true", children: /* @__PURE__ */ jsx54(Icon, { name: ICON_MAP2[intent], size: "md" }) }),
+          /* @__PURE__ */ jsxs42("div", { className: "min-w-0 flex-1", children: [
+            title && /* @__PURE__ */ jsx54("p", { className: "font-semibold", children: title }),
+            children && /* @__PURE__ */ jsx54("div", { className: cn(title && "mt-1", "text-sm"), children })
           ] }),
-          dismissible && /* @__PURE__ */ jsx53(
+          dismissible && /* @__PURE__ */ jsx54(
             "button",
             {
               type: "button",
@@ -4633,7 +4741,7 @@ var Alert = React37.forwardRef(
 Alert.displayName = "Alert";
 
 // src/empty-state.tsx
-import { jsx as jsx54, jsxs as jsxs42 } from "react/jsx-runtime";
+import { jsx as jsx55, jsxs as jsxs43 } from "react/jsx-runtime";
 function EmptyState({
   icon: Icon2,
   title,
@@ -4644,7 +4752,7 @@ function EmptyState({
   className
 }) {
   const compact = size === "compact";
-  return /* @__PURE__ */ jsxs42(
+  return /* @__PURE__ */ jsxs43(
     "div",
     {
       "data-testid": testId,
@@ -4654,7 +4762,7 @@ function EmptyState({
         className
       ),
       children: [
-        Icon2 && /* @__PURE__ */ jsx54(
+        Icon2 && /* @__PURE__ */ jsx55(
           "div",
           {
             "aria-hidden": "true",
@@ -4662,10 +4770,10 @@ function EmptyState({
               "flex items-center justify-center rounded-full bg-primary/10 text-primary",
               compact ? "mb-3 size-12" : "mb-5 size-16"
             ),
-            children: /* @__PURE__ */ jsx54(Icon2, { className: compact ? "size-6" : "size-8" })
+            children: /* @__PURE__ */ jsx55(Icon2, { className: compact ? "size-6" : "size-8" })
           }
         ),
-        /* @__PURE__ */ jsx54(
+        /* @__PURE__ */ jsx55(
           "h2",
           {
             className: cn(
@@ -4675,7 +4783,7 @@ function EmptyState({
             children: title
           }
         ),
-        description && /* @__PURE__ */ jsx54(
+        description && /* @__PURE__ */ jsx55(
           "p",
           {
             className: cn(
@@ -4685,7 +4793,7 @@ function EmptyState({
             children: description
           }
         ),
-        action && /* @__PURE__ */ jsx54("div", { className: compact ? "mt-4" : "mt-6", children: action })
+        action && /* @__PURE__ */ jsx55("div", { className: compact ? "mt-4" : "mt-6", children: action })
       ]
     }
   );
@@ -4693,7 +4801,7 @@ function EmptyState({
 
 // src/action-panel.tsx
 import * as React38 from "react";
-import { Fragment as Fragment9, jsx as jsx55, jsxs as jsxs43 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx56, jsxs as jsxs44 } from "react/jsx-runtime";
 var BORDER_INTENT = {
   default: "border-l-primary",
   warning: "border-l-intent-warning",
@@ -4708,7 +4816,7 @@ var ActionPanel = React38.forwardRef(
     variant = "simple",
     intent = "default",
     ...props
-  }, ref) => /* @__PURE__ */ jsx55(
+  }, ref) => /* @__PURE__ */ jsx56(
     "div",
     {
       ref,
@@ -4719,16 +4827,16 @@ var ActionPanel = React38.forwardRef(
         className
       ),
       ...props,
-      children: variant === "split" ? /* @__PURE__ */ jsxs43(Fragment9, { children: [
-        /* @__PURE__ */ jsxs43("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ jsx55("h3", { className: "font-semibold text-foreground", children: title }),
-          description && /* @__PURE__ */ jsx55("p", { className: "mt-1 text-sm text-muted-foreground", children: description })
+      children: variant === "split" ? /* @__PURE__ */ jsxs44(Fragment9, { children: [
+        /* @__PURE__ */ jsxs44("div", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsx56("h3", { className: "font-semibold text-foreground", children: title }),
+          description && /* @__PURE__ */ jsx56("p", { className: "mt-1 text-sm text-muted-foreground", children: description })
         ] }),
-        action && /* @__PURE__ */ jsx55("div", { className: "flex-shrink-0", children: action })
-      ] }) : /* @__PURE__ */ jsxs43(Fragment9, { children: [
-        /* @__PURE__ */ jsx55("h3", { className: "font-semibold text-foreground", children: title }),
-        description && /* @__PURE__ */ jsx55("p", { className: "mt-1 text-sm text-muted-foreground", children: description }),
-        action && /* @__PURE__ */ jsx55("div", { className: "mt-4", children: action })
+        action && /* @__PURE__ */ jsx56("div", { className: "flex-shrink-0", children: action })
+      ] }) : /* @__PURE__ */ jsxs44(Fragment9, { children: [
+        /* @__PURE__ */ jsx56("h3", { className: "font-semibold text-foreground", children: title }),
+        description && /* @__PURE__ */ jsx56("p", { className: "mt-1 text-sm text-muted-foreground", children: description }),
+        action && /* @__PURE__ */ jsx56("div", { className: "mt-4", children: action })
       ] })
     }
   )
@@ -4737,7 +4845,7 @@ ActionPanel.displayName = "ActionPanel";
 
 // src/divider.tsx
 import * as React39 from "react";
-import { jsx as jsx56, jsxs as jsxs44 } from "react/jsx-runtime";
+import { jsx as jsx57, jsxs as jsxs45 } from "react/jsx-runtime";
 var VARIANT_CLASSES = {
   solid: "border-solid",
   dashed: "border-dashed",
@@ -4753,7 +4861,7 @@ var Divider = React39.forwardRef(
     ...props
   }, ref) => {
     if (orientation === "vertical") {
-      return /* @__PURE__ */ jsx56(
+      return /* @__PURE__ */ jsx57(
         "div",
         {
           ref,
@@ -4770,7 +4878,7 @@ var Divider = React39.forwardRef(
       );
     }
     if (!label) {
-      return /* @__PURE__ */ jsx56(
+      return /* @__PURE__ */ jsx57(
         "div",
         {
           ref,
@@ -4784,7 +4892,7 @@ var Divider = React39.forwardRef(
         }
       );
     }
-    return /* @__PURE__ */ jsxs44(
+    return /* @__PURE__ */ jsxs45(
       "div",
       {
         ref,
@@ -4792,7 +4900,7 @@ var Divider = React39.forwardRef(
         role: "separator",
         ...props,
         children: [
-          labelPosition !== "left" && /* @__PURE__ */ jsx56(
+          labelPosition !== "left" && /* @__PURE__ */ jsx57(
             "div",
             {
               className: cn(
@@ -4801,7 +4909,7 @@ var Divider = React39.forwardRef(
               )
             }
           ),
-          /* @__PURE__ */ jsx56(
+          /* @__PURE__ */ jsx57(
             "span",
             {
               className: cn(
@@ -4811,7 +4919,7 @@ var Divider = React39.forwardRef(
               children: label
             }
           ),
-          labelPosition !== "right" && /* @__PURE__ */ jsx56(
+          labelPosition !== "right" && /* @__PURE__ */ jsx57(
             "div",
             {
               className: cn(
@@ -4829,7 +4937,7 @@ Divider.displayName = "Divider";
 
 // src/container.tsx
 import * as React40 from "react";
-import { jsx as jsx57 } from "react/jsx-runtime";
+import { jsx as jsx58 } from "react/jsx-runtime";
 var SIZE_CLASSES6 = {
   sm: "max-w-content-sm",
   md: "max-w-content-md",
@@ -4838,7 +4946,7 @@ var SIZE_CLASSES6 = {
   full: "max-w-full"
 };
 var Container = React40.forwardRef(
-  ({ className, size = "xl", padded = true, ...props }, ref) => /* @__PURE__ */ jsx57(
+  ({ className, size = "xl", padded = true, ...props }, ref) => /* @__PURE__ */ jsx58(
     "div",
     {
       ref,
@@ -4856,7 +4964,7 @@ Container.displayName = "Container";
 
 // src/page-content.tsx
 import * as React41 from "react";
-import { jsx as jsx58 } from "react/jsx-runtime";
+import { jsx as jsx59 } from "react/jsx-runtime";
 var GAP_CLASSES2 = {
   sm: "space-y-4",
   md: "space-y-6",
@@ -4864,7 +4972,7 @@ var GAP_CLASSES2 = {
   none: ""
 };
 var PageContent = React41.forwardRef(
-  ({ className, gap = "md", padded = true, children, ...props }, ref) => /* @__PURE__ */ jsx58(
+  ({ className, gap = "md", padded = true, children, ...props }, ref) => /* @__PURE__ */ jsx59(
     "div",
     {
       ref,
@@ -4878,7 +4986,7 @@ PageContent.displayName = "PageContent";
 
 // src/media-object.tsx
 import * as React42 from "react";
-import { jsx as jsx59, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx60, jsxs as jsxs46 } from "react/jsx-runtime";
 var MEDIA_SIZE = {
   sm: "h-8 w-8",
   md: "h-10 w-10",
@@ -4897,7 +5005,7 @@ var MediaObject = React42.forwardRef(
     ...props
   }, ref) => {
     if (stacked) {
-      return /* @__PURE__ */ jsxs45(
+      return /* @__PURE__ */ jsxs46(
         "div",
         {
           ref,
@@ -4907,17 +5015,17 @@ var MediaObject = React42.forwardRef(
           ),
           ...props,
           children: [
-            /* @__PURE__ */ jsx59("div", { className: cn("flex-shrink-0", MEDIA_SIZE[mediaSize]), children: media }),
-            /* @__PURE__ */ jsxs45("div", { className: "min-w-0", children: [
-              title && /* @__PURE__ */ jsx59("p", { className: "font-medium text-foreground", children: title }),
-              description && /* @__PURE__ */ jsx59("p", { className: "text-sm text-muted-foreground", children: description })
+            /* @__PURE__ */ jsx60("div", { className: cn("flex-shrink-0", MEDIA_SIZE[mediaSize]), children: media }),
+            /* @__PURE__ */ jsxs46("div", { className: "min-w-0", children: [
+              title && /* @__PURE__ */ jsx60("p", { className: "font-medium text-foreground", children: title }),
+              description && /* @__PURE__ */ jsx60("p", { className: "text-sm text-muted-foreground", children: description })
             ] }),
-            action && /* @__PURE__ */ jsx59("div", { children: action })
+            action && /* @__PURE__ */ jsx60("div", { children: action })
           ]
         }
       );
     }
-    return /* @__PURE__ */ jsxs45(
+    return /* @__PURE__ */ jsxs46(
       "div",
       {
         ref,
@@ -4928,12 +5036,12 @@ var MediaObject = React42.forwardRef(
         ),
         ...props,
         children: [
-          /* @__PURE__ */ jsx59("div", { className: cn("flex-shrink-0", MEDIA_SIZE[mediaSize]), children: media }),
-          /* @__PURE__ */ jsxs45("div", { className: "min-w-0 flex-1", children: [
-            title && /* @__PURE__ */ jsx59("p", { className: "font-medium text-foreground", children: title }),
-            description && /* @__PURE__ */ jsx59("p", { className: "text-sm text-muted-foreground", children: description })
+          /* @__PURE__ */ jsx60("div", { className: cn("flex-shrink-0", MEDIA_SIZE[mediaSize]), children: media }),
+          /* @__PURE__ */ jsxs46("div", { className: "min-w-0 flex-1", children: [
+            title && /* @__PURE__ */ jsx60("p", { className: "font-medium text-foreground", children: title }),
+            description && /* @__PURE__ */ jsx60("p", { className: "text-sm text-muted-foreground", children: description })
           ] }),
-          action && /* @__PURE__ */ jsx59("div", { className: "flex-shrink-0", children: action })
+          action && /* @__PURE__ */ jsx60("div", { className: "flex-shrink-0", children: action })
         ]
       }
     );
@@ -4943,7 +5051,7 @@ MediaObject.displayName = "MediaObject";
 
 // src/page-patterns.tsx
 import * as React43 from "react";
-import { jsx as jsx60, jsxs as jsxs46 } from "react/jsx-runtime";
+import { jsx as jsx61, jsxs as jsxs47 } from "react/jsx-runtime";
 var GUTTER_WIDTHS = {
   /** A single column of reading or a short list. */
   narrow: "max-w-content-md",
@@ -4951,7 +5059,7 @@ var GUTTER_WIDTHS = {
   default: "max-w-content-xl"
 };
 var PageGutter = React43.forwardRef(
-  ({ className, width = "default", ...props }, ref) => /* @__PURE__ */ jsx60(
+  ({ className, width = "default", ...props }, ref) => /* @__PURE__ */ jsx61(
     "div",
     {
       ref,
@@ -4966,22 +5074,22 @@ var PageGutter = React43.forwardRef(
 );
 PageGutter.displayName = "PageGutter";
 var PageHeading = React43.forwardRef(
-  ({ className, title, description, meta, actions, ...props }, ref) => /* @__PURE__ */ jsxs46(
+  ({ className, title, description, meta, actions, ...props }, ref) => /* @__PURE__ */ jsxs47(
     "header",
     {
       ref,
       className: cn(
-        "flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between",
+        "flex flex-col gap-4 sm:flex-row sm:flex-wrap sm:items-start sm:justify-between",
         className
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsxs46("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [
-          /* @__PURE__ */ jsx60("h1", { className: "break-words text-2xl font-semibold tracking-tight text-foreground sm:text-3xl", children: title }),
-          description && /* @__PURE__ */ jsx60("p", { className: "break-words text-sm text-muted-foreground sm:text-base", children: description }),
-          meta && /* @__PURE__ */ jsx60("div", { className: "mt-2 flex flex-wrap gap-2", children: meta })
+        /* @__PURE__ */ jsxs47("div", { className: "flex min-w-0 flex-1 flex-col gap-1 sm:basis-80", children: [
+          /* @__PURE__ */ jsx61("h1", { className: "break-words text-2xl font-semibold tracking-tight text-foreground sm:text-3xl", children: title }),
+          description && /* @__PURE__ */ jsx61("p", { className: "break-words text-sm text-muted-foreground sm:text-base", children: description }),
+          meta && /* @__PURE__ */ jsx61("div", { className: "mt-2 flex flex-wrap gap-2", children: meta })
         ] }),
-        actions && /* @__PURE__ */ jsx60("div", { className: "flex shrink-0 flex-wrap items-center gap-2", children: actions })
+        actions && /* @__PURE__ */ jsx61("div", { className: "flex max-w-full shrink-0 flex-wrap items-center gap-2", children: actions })
       ]
     }
   )
@@ -5000,14 +5108,14 @@ var SectionCard = React43.forwardRef(
   }, ref) => {
     const pad = size === "compact" ? "p-4" : "p-4 sm:p-6";
     const hasHead = Boolean(title || description || actions);
-    return /* @__PURE__ */ jsxs46(
+    return /* @__PURE__ */ jsxs47(
       Card,
       {
         ref,
         className: cn("min-w-0 overflow-hidden", className),
         ...props,
         children: [
-          hasHead && /* @__PURE__ */ jsxs46(
+          hasHead && /* @__PURE__ */ jsxs47(
             "div",
             {
               className: cn(
@@ -5017,8 +5125,8 @@ var SectionCard = React43.forwardRef(
                 flush && children ? "border-b border-border" : ""
               ),
               children: [
-                /* @__PURE__ */ jsxs46("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [
-                  title && /* @__PURE__ */ jsx60(
+                /* @__PURE__ */ jsxs47("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [
+                  title && /* @__PURE__ */ jsx61(
                     "h2",
                     {
                       className: cn(
@@ -5028,13 +5136,13 @@ var SectionCard = React43.forwardRef(
                       children: title
                     }
                   ),
-                  description && /* @__PURE__ */ jsx60("p", { className: "text-sm text-muted-foreground", children: description })
+                  description && /* @__PURE__ */ jsx61("p", { className: "text-sm text-muted-foreground", children: description })
                 ] }),
-                actions && /* @__PURE__ */ jsx60("div", { className: "flex shrink-0 flex-wrap items-center gap-2", children: actions })
+                actions && /* @__PURE__ */ jsx61("div", { className: "flex shrink-0 flex-wrap items-center gap-2", children: actions })
               ]
             }
           ),
-          children !== void 0 && children !== null && /* @__PURE__ */ jsx60("div", { className: cn("min-w-0", !flush && pad), children })
+          children !== void 0 && children !== null && /* @__PURE__ */ jsx61("div", { className: cn("min-w-0", !flush && pad), children })
         ]
       }
     );
@@ -5042,22 +5150,22 @@ var SectionCard = React43.forwardRef(
 );
 SectionCard.displayName = "SectionCard";
 var TabbedCard = React43.forwardRef(
-  ({ className, tabs, tabsLabel, children, ...props }, ref) => /* @__PURE__ */ jsxs46(
+  ({ className, tabs, tabsLabel, children, ...props }, ref) => /* @__PURE__ */ jsxs47(
     Card,
     {
       ref,
       className: cn("min-w-0 overflow-hidden", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx60("div", { className: "px-4 pt-3 sm:px-6", children: /* @__PURE__ */ jsx60(TabBar, { variant: "underline", "aria-label": tabsLabel, children: tabs }) }),
-        /* @__PURE__ */ jsx60("div", { className: "min-w-0 p-4 sm:p-6", children })
+        /* @__PURE__ */ jsx61("div", { className: "px-4 pt-3 sm:px-6", children: /* @__PURE__ */ jsx61(TabBar, { variant: "underline", "aria-label": tabsLabel, children: tabs }) }),
+        /* @__PURE__ */ jsx61("div", { className: "min-w-0 p-4 sm:p-6", children })
       ]
     }
   )
 );
 TabbedCard.displayName = "TabbedCard";
 var SidePanelLayout = React43.forwardRef(
-  ({ className, aside, asideLabel, children, ...props }, ref) => /* @__PURE__ */ jsxs46(
+  ({ className, aside, asideLabel, children, ...props }, ref) => /* @__PURE__ */ jsxs47(
     "div",
     {
       ref,
@@ -5067,8 +5175,8 @@ var SidePanelLayout = React43.forwardRef(
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx60("div", { className: "flex min-w-0 flex-col gap-6 lg:col-span-2", children }),
-        /* @__PURE__ */ jsx60(
+        /* @__PURE__ */ jsx61("div", { className: "flex min-w-0 flex-col gap-6 lg:col-span-2", children }),
+        /* @__PURE__ */ jsx61(
           "aside",
           {
             "aria-label": asideLabel,
@@ -5084,7 +5192,7 @@ SidePanelLayout.displayName = "SidePanelLayout";
 
 // src/intent-badge.tsx
 import * as React44 from "react";
-import { jsx as jsx61 } from "react/jsx-runtime";
+import { jsx as jsx62 } from "react/jsx-runtime";
 var INTENT_CLASSES = {
   neutral: "bg-muted text-muted-foreground border-border",
   // the primary tint is lighter than the intents': `primary-text` on a 10%
@@ -5093,7 +5201,7 @@ var INTENT_CLASSES = {
   ...INTENT_SUBTLE_STYLES
 };
 var IntentBadge = React44.forwardRef(
-  ({ className, intent = "neutral", children, ...props }, ref) => /* @__PURE__ */ jsx61(
+  ({ className, intent = "neutral", children, ...props }, ref) => /* @__PURE__ */ jsx62(
     "span",
     {
       ref,
@@ -5104,7 +5212,7 @@ var IntentBadge = React44.forwardRef(
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx61("span", { className: "truncate", children: isEmptyValue(children) ? /* @__PURE__ */ jsx61(EmptyValue, {}) : children })
+      children: /* @__PURE__ */ jsx62("span", { className: "truncate", children: isEmptyValue(children) ? /* @__PURE__ */ jsx62(EmptyValue, {}) : children })
     }
   )
 );
@@ -5112,7 +5220,7 @@ IntentBadge.displayName = "IntentBadge";
 
 // src/overflow-menu.tsx
 import * as React45 from "react";
-import { Fragment as Fragment10, jsx as jsx62, jsxs as jsxs47 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx63, jsxs as jsxs48 } from "react/jsx-runtime";
 function OverflowMenu({
   label,
   items,
@@ -5129,8 +5237,8 @@ function OverflowMenu({
     document.addEventListener("keydown", onKey);
     return () => document.removeEventListener("keydown", onKey);
   }, [open]);
-  return /* @__PURE__ */ jsxs47("div", { className: cn("relative inline-block", className), children: [
-    /* @__PURE__ */ jsx62(
+  return /* @__PURE__ */ jsxs48("div", { className: cn("relative inline-block", className), children: [
+    /* @__PURE__ */ jsx63(
       Button,
       {
         variant: "outline",
@@ -5140,11 +5248,11 @@ function OverflowMenu({
         "aria-expanded": open,
         "aria-controls": open ? menuId : void 0,
         onClick: () => setOpen(!open),
-        children: /* @__PURE__ */ jsx62(Icon, { name: "ellipsis", size: "sm" })
+        children: /* @__PURE__ */ jsx63(Icon, { name: "ellipsis", size: "sm" })
       }
     ),
-    open && /* @__PURE__ */ jsxs47(Fragment10, { children: [
-      /* @__PURE__ */ jsx62(
+    open && /* @__PURE__ */ jsxs48(Fragment10, { children: [
+      /* @__PURE__ */ jsx63(
         "div",
         {
           "aria-hidden": "true",
@@ -5152,14 +5260,14 @@ function OverflowMenu({
           onClick: () => setOpen(false)
         }
       ),
-      /* @__PURE__ */ jsx62(
+      /* @__PURE__ */ jsx63(
         "div",
         {
           id: menuId,
           role: "menu",
           "aria-label": label,
           className: "z-dropdown absolute right-0 top-full mt-2 flex w-56 max-w-[calc(100vw-2rem)] flex-col rounded-lg border border-border bg-popover p-1 text-popover-foreground shadow-lg",
-          children: items.map((item) => /* @__PURE__ */ jsxs47(
+          children: items.map((item) => /* @__PURE__ */ jsxs48(
             "button",
             {
               type: "button",
@@ -5174,8 +5282,8 @@ function OverflowMenu({
                 item.destructive ? "text-intent-error-foreground" : "text-popover-foreground"
               ),
               children: [
-                item.icon && /* @__PURE__ */ jsx62(Icon, { name: item.icon, size: "sm" }),
-                /* @__PURE__ */ jsx62("span", { className: "min-w-0 truncate", children: item.label })
+                item.icon && /* @__PURE__ */ jsx63(Icon, { name: item.icon, size: "sm" }),
+                /* @__PURE__ */ jsx63("span", { className: "min-w-0 truncate", children: item.label })
               ]
             },
             item.label
@@ -5188,7 +5296,7 @@ function OverflowMenu({
 
 // src/stage-list.tsx
 import * as React46 from "react";
-import { jsx as jsx63, jsxs as jsxs48 } from "react/jsx-runtime";
+import { jsx as jsx64, jsxs as jsxs49 } from "react/jsx-runtime";
 var StageList = React46.forwardRef(
   ({ stages, outcomes = [], current, ...props }, ref) => {
     const at = stages.findIndex((s) => s.value === current);
@@ -5197,7 +5305,7 @@ var StageList = React46.forwardRef(
       throw new Error(
         `StageList: current "${current}" is not one of the stages (${stages.map((s) => s.value).join(", ")}) or outcomes (${outcomes.map((s) => s.value).join(", ") || "none"})`
       );
-    return /* @__PURE__ */ jsxs48(
+    return /* @__PURE__ */ jsxs49(
       Stepper,
       {
         ref,
@@ -5206,7 +5314,7 @@ var StageList = React46.forwardRef(
         activeStep: outcome ? stages.length : at,
         ...props,
         children: [
-          stages.map((s) => /* @__PURE__ */ jsx63(
+          stages.map((s) => /* @__PURE__ */ jsx64(
             StepperStep,
             {
               label: s.label,
@@ -5214,7 +5322,7 @@ var StageList = React46.forwardRef(
             },
             s.value
           )),
-          outcome && /* @__PURE__ */ jsx63(StepperStep, { label: outcome.label, error: true }, outcome.value)
+          outcome && /* @__PURE__ */ jsx64(StepperStep, { label: outcome.label, error: true }, outcome.value)
         ]
       }
     );
@@ -5224,14 +5332,14 @@ StageList.displayName = "StageList";
 
 // src/clamped-list.tsx
 import * as React47 from "react";
-import { jsx as jsx64, jsxs as jsxs49 } from "react/jsx-runtime";
+import { jsx as jsx65, jsxs as jsxs50 } from "react/jsx-runtime";
 var MAX_HEIGHTS = {
   sm: "max-h-48",
   md: "max-h-72",
   lg: "max-h-96"
 };
 var ClampedList = React47.forwardRef(
-  ({ className, label, maxHeight = "md", children, ...props }, ref) => /* @__PURE__ */ jsxs49(
+  ({ className, label, maxHeight = "md", children, ...props }, ref) => /* @__PURE__ */ jsxs50(
     "div",
     {
       ref,
@@ -5247,13 +5355,13 @@ var ClampedList = React47.forwardRef(
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx64(
+        /* @__PURE__ */ jsx65(
           "div",
           {
             "aria-hidden": "true",
             "data-scroll-hint": "y",
             className: SCROLL_HINT_Y_MARK,
-            children: /* @__PURE__ */ jsx64("span", { className: "flex items-center rounded-full border border-border bg-card px-2 text-muted-foreground shadow-sm", children: /* @__PURE__ */ jsx64(Icon, { name: "chevron-down", size: "sm" }) })
+            children: /* @__PURE__ */ jsx65("span", { className: "flex items-center rounded-full border border-border bg-card px-2 text-muted-foreground shadow-sm", children: /* @__PURE__ */ jsx65(Icon, { name: "chevron-down", size: "sm" }) })
           }
         )
       ]
@@ -5264,7 +5372,7 @@ ClampedList.displayName = "ClampedList";
 
 // src/textarea.tsx
 import * as React48 from "react";
-import { jsx as jsx65, jsxs as jsxs50 } from "react/jsx-runtime";
+import { jsx as jsx66, jsxs as jsxs51 } from "react/jsx-runtime";
 var lengthOf = (v) => v === void 0 ? 0 : Array.isArray(v) ? v.join(",").length : String(v).length;
 var Textarea = React48.forwardRef(
   ({
@@ -5285,7 +5393,7 @@ var Textarea = React48.forwardRef(
     const [typed, setTyped] = React48.useState(() => lengthOf(defaultValue));
     const count = value === void 0 ? typed : lengthOf(value);
     const aria = fieldAria(error, errorMessageId);
-    const field = /* @__PURE__ */ jsx65(
+    const field = /* @__PURE__ */ jsx66(
       "textarea",
       {
         ref,
@@ -5310,9 +5418,9 @@ var Textarea = React48.forwardRef(
     );
     if (!showCount) return field;
     const atLimit = maxLength !== void 0 && count >= maxLength;
-    return /* @__PURE__ */ jsxs50("div", { className: "w-full min-w-0 space-y-1", children: [
+    return /* @__PURE__ */ jsxs51("div", { className: "w-full min-w-0 space-y-1", children: [
       field,
-      /* @__PURE__ */ jsx65(
+      /* @__PURE__ */ jsx66(
         "p",
         {
           id: countId,
@@ -5330,7 +5438,7 @@ Textarea.displayName = "Textarea";
 
 // src/select.tsx
 import * as React49 from "react";
-import { jsx as jsx66, jsxs as jsxs51 } from "react/jsx-runtime";
+import { jsx as jsx67, jsxs as jsxs52 } from "react/jsx-runtime";
 var CHEVRON_END = {
   sm: "right-2.5",
   md: "right-3",
@@ -5359,8 +5467,8 @@ var Select = React49.forwardRef(
         "Select: pass `options` or `<option>` children, not both"
       );
     const showsPlaceholder = placeholder !== void 0 && value === void 0 && defaultValue === void 0;
-    return /* @__PURE__ */ jsxs51("div", { className: "relative w-full min-w-0", children: [
-      /* @__PURE__ */ jsxs51(
+    return /* @__PURE__ */ jsxs52("div", { className: "relative w-full min-w-0", children: [
+      /* @__PURE__ */ jsxs52(
         "select",
         {
           ref,
@@ -5377,13 +5485,13 @@ var Select = React49.forwardRef(
           ),
           ...props,
           children: [
-            placeholder !== void 0 && /* @__PURE__ */ jsx66("option", { value: "", disabled: true, hidden: true, children: placeholder }),
-            options?.map((o) => /* @__PURE__ */ jsx66("option", { value: o.value, disabled: o.disabled, children: o.label }, o.value)),
+            placeholder !== void 0 && /* @__PURE__ */ jsx67("option", { value: "", disabled: true, hidden: true, children: placeholder }),
+            options?.map((o) => /* @__PURE__ */ jsx67("option", { value: o.value, disabled: o.disabled, children: o.label }, o.value)),
             children
           ]
         }
       ),
-      /* @__PURE__ */ jsx66(
+      /* @__PURE__ */ jsx67(
         Icon,
         {
           name: "chevron-down",
@@ -5401,7 +5509,7 @@ Select.displayName = "Select";
 
 // src/checkbox.tsx
 import * as React50 from "react";
-import { jsx as jsx67, jsxs as jsxs52 } from "react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs53 } from "react/jsx-runtime";
 var BOX = {
   sm: "size-4",
   md: "size-5"
@@ -5435,8 +5543,8 @@ var Checkbox = React50.forwardRef(
     const hasError = Boolean(error);
     const message = typeof error === "string" ? error : void 0;
     const describedBy = [description ? descId : void 0, message ? errorId : void 0].filter(Boolean).join(" ") || void 0;
-    return /* @__PURE__ */ jsxs52("div", { className: cn("flex items-start gap-2", className), children: [
-      /* @__PURE__ */ jsxs52(
+    return /* @__PURE__ */ jsxs53("div", { className: cn("flex items-start gap-2", className), children: [
+      /* @__PURE__ */ jsxs53(
         "span",
         {
           className: cn(
@@ -5444,7 +5552,7 @@ var Checkbox = React50.forwardRef(
             size === "sm" ? "mt-0.5" : "mt-px"
           ),
           children: [
-            /* @__PURE__ */ jsx67(
+            /* @__PURE__ */ jsx68(
               "input",
               {
                 ref: inner,
@@ -5471,13 +5579,13 @@ var Checkbox = React50.forwardRef(
                 ...props
               }
             ),
-            indeterminate ? /* @__PURE__ */ jsx67(
+            indeterminate ? /* @__PURE__ */ jsx68(
               "span",
               {
                 "aria-hidden": "true",
                 className: "pointer-events-none absolute h-0.5 w-1/2 rounded-full bg-primary-foreground"
               }
-            ) : /* @__PURE__ */ jsx67(
+            ) : /* @__PURE__ */ jsx68(
               Icon,
               {
                 name: "check",
@@ -5488,8 +5596,8 @@ var Checkbox = React50.forwardRef(
           ]
         }
       ),
-      (label || description || message) && /* @__PURE__ */ jsxs52("div", { className: "min-w-0 space-y-0.5", children: [
-        label && /* @__PURE__ */ jsx67(
+      (label || description || message) && /* @__PURE__ */ jsxs53("div", { className: "min-w-0 space-y-0.5", children: [
+        label && /* @__PURE__ */ jsx68(
           Label,
           {
             htmlFor: inputId,
@@ -5502,8 +5610,8 @@ var Checkbox = React50.forwardRef(
             children: label
           }
         ),
-        description && /* @__PURE__ */ jsx67("p", { id: descId, className: "text-xs text-muted-foreground", children: description }),
-        message && /* @__PURE__ */ jsx67("p", { id: errorId, className: "text-intent-error-foreground text-xs", children: message })
+        description && /* @__PURE__ */ jsx68("p", { id: descId, className: "text-xs text-muted-foreground", children: description }),
+        message && /* @__PURE__ */ jsx68("p", { id: errorId, className: "text-intent-error-foreground text-xs", children: message })
       ] })
     ] });
   }
@@ -5523,7 +5631,7 @@ var CheckboxGroup = React50.forwardRef(
     ...props
   }, ref) => {
     const errorId = React50.useId();
-    return /* @__PURE__ */ jsxs52(
+    return /* @__PURE__ */ jsxs53(
       "fieldset",
       {
         ref,
@@ -5532,14 +5640,14 @@ var CheckboxGroup = React50.forwardRef(
         className: cn("min-w-0 space-y-2", className),
         ...props,
         children: [
-          /* @__PURE__ */ jsx67("legend", { className: "mb-2 text-sm font-medium text-foreground", children: legend }),
-          /* @__PURE__ */ jsx67(
+          /* @__PURE__ */ jsx68("legend", { className: "mb-2 text-sm font-medium text-foreground", children: legend }),
+          /* @__PURE__ */ jsx68(
             "div",
             {
               className: cn(
                 orientation === "horizontal" ? "flex flex-wrap gap-x-6 gap-y-2" : "space-y-2"
               ),
-              children: options.map((o) => /* @__PURE__ */ jsx67(
+              children: options.map((o) => /* @__PURE__ */ jsx68(
                 Checkbox,
                 {
                   name,
@@ -5559,7 +5667,7 @@ var CheckboxGroup = React50.forwardRef(
               ))
             }
           ),
-          error && /* @__PURE__ */ jsx67("p", { id: errorId, className: "text-intent-error-foreground text-sm", children: error })
+          error && /* @__PURE__ */ jsx68("p", { id: errorId, className: "text-intent-error-foreground text-sm", children: error })
         ]
       }
     );
@@ -5569,7 +5677,7 @@ CheckboxGroup.displayName = "CheckboxGroup";
 
 // src/progress.tsx
 import * as React51 from "react";
-import { jsx as jsx68, jsxs as jsxs53 } from "react/jsx-runtime";
+import { jsx as jsx69, jsxs as jsxs54 } from "react/jsx-runtime";
 var FILL = {
   primary: "bg-primary-solid dark:bg-primary",
   success: "bg-intent-success-solid dark:bg-intent-success",
@@ -5590,9 +5698,9 @@ var Progress = React51.forwardRef(
       throw new Error(`Progress: value must be within 0\u2013100, got ${value}`);
     const labelId = React51.useId();
     const shown = Math.round(value ?? 0);
-    return /* @__PURE__ */ jsxs53("div", { ref, className: cn("w-full min-w-0 space-y-1.5", className), children: [
-      (label || showValue && value !== void 0) && /* @__PURE__ */ jsxs53("div", { className: "flex items-baseline justify-between gap-3 text-sm", children: [
-        label && /* @__PURE__ */ jsx68(
+    return /* @__PURE__ */ jsxs54("div", { ref, className: cn("w-full min-w-0 space-y-1.5", className), children: [
+      (label || showValue && value !== void 0) && /* @__PURE__ */ jsxs54("div", { className: "flex items-baseline justify-between gap-3 text-sm", children: [
+        label && /* @__PURE__ */ jsx69(
           "span",
           {
             id: labelId,
@@ -5600,12 +5708,12 @@ var Progress = React51.forwardRef(
             children: label
           }
         ),
-        showValue && value !== void 0 && /* @__PURE__ */ jsxs53("span", { className: "ml-auto shrink-0 tabular-nums text-muted-foreground", children: [
+        showValue && value !== void 0 && /* @__PURE__ */ jsxs54("span", { className: "ml-auto shrink-0 tabular-nums text-muted-foreground", children: [
           shown,
           "%"
         ] })
       ] }),
-      /* @__PURE__ */ jsx68(
+      /* @__PURE__ */ jsx69(
         "div",
         {
           role: "progressbar",
@@ -5619,7 +5727,7 @@ var Progress = React51.forwardRef(
             size === "sm" ? "h-1.5" : "h-2.5"
           ),
           ...props,
-          children: /* @__PURE__ */ jsx68(
+          children: /* @__PURE__ */ jsx69(
             "div",
             {
               "data-ui-boundary": "",