@ship-it-ui/ui 0.0.6 → 0.0.7

package/dist/index.cjs

@@ -93,6 +93,7 @@ __export(index_exports, {
   HoverCardRoot: () => HoverCardRoot,
   HoverCardTrigger: () => HoverCardTrigger,
   IconButton: () => IconButton,
+  InlineEdit: () => InlineEdit,
   Input: () => Input,
   Kbd: () => Kbd,
   LargeTitle: () => LargeTitle,
@@ -717,11 +718,198 @@ function Field({ label, hint, error, required, className, children, ...props })
   ] });
 }
 
-// src/components/Input/Input.tsx
+// src/components/InlineEdit/InlineEdit.tsx
 var import_class_variance_authority3 = require("class-variance-authority");
 var import_react15 = require("react");
 var import_jsx_runtime8 = require("react/jsx-runtime");
-var inputWrapperStyles = (0, import_class_variance_authority3.cva)(
+var displayStyles = (0, import_class_variance_authority3.cva)(
+  [
+    "inline-block cursor-text rounded-[3px] px-[2px] -mx-[2px]",
+    "outline-none transition-[background,box-shadow] duration-(--duration-micro)",
+    "hover:bg-panel-2",
+    "focus-visible:ring-[2px] focus-visible:ring-accent-dim"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "text-[12px]",
+        md: "text-[13px]",
+        lg: "text-[14px]"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+);
+var inputStyles = (0, import_class_variance_authority3.cva)(
+  [
+    "border bg-panel text-text font-sans outline-none",
+    "transition-[border-color,box-shadow] duration-(--duration-micro)",
+    "focus:ring-[3px] focus:ring-accent-dim focus:border-accent",
+    "placeholder:text-text-dim"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-6 px-2 text-[12px] rounded-md",
+        md: "h-[28px] px-[8px] text-[13px] rounded-md",
+        lg: "h-8 px-[10px] text-[14px] rounded-md"
+      },
+      tone: {
+        default: "border-border",
+        err: "border-err focus:border-err focus:ring-err/30"
+      }
+    },
+    defaultVariants: { size: "md", tone: "default" }
+  }
+);
+var InlineEdit = (0, import_react15.forwardRef)(function InlineEdit2({
+  value,
+  onValueChange,
+  as = "span",
+  activate = "dblclick",
+  commitOnBlur = true,
+  validate,
+  placeholder = "Empty",
+  disabled = false,
+  editing: editingProp,
+  onEditingChange,
+  size,
+  className,
+  inputClassName,
+  "aria-label": ariaLabel,
+  ...rest
+}, forwardedRef) {
+  const [editing, setEditing] = useControllableState({
+    value: editingProp,
+    defaultValue: false,
+    onChange: onEditingChange
+  });
+  const [draft, setDraft] = (0, import_react15.useState)(value);
+  const [error, setError] = (0, import_react15.useState)(null);
+  const inputRef = (0, import_react15.useRef)(null);
+  (0, import_react15.useEffect)(() => {
+    if (!editing) {
+      setDraft(value);
+      setError(null);
+    }
+  }, [editing, value]);
+  (0, import_react15.useEffect)(() => {
+    if (!editing) return;
+    const el = inputRef.current;
+    if (!el) return;
+    el.focus();
+    el.select();
+  }, [editing]);
+  const commit = (0, import_react15.useCallback)(() => {
+    const next = draft;
+    if (validate) {
+      const msg = validate(next);
+      if (msg !== null) {
+        setError(msg);
+        return;
+      }
+    }
+    setError(null);
+    setEditing(false);
+    if (next !== value) onValueChange(next);
+  }, [draft, validate, value, onValueChange, setEditing]);
+  const cancel = (0, import_react15.useCallback)(() => {
+    setDraft(value);
+    setError(null);
+    setEditing(false);
+  }, [value, setEditing]);
+  const beginEdit = (0, import_react15.useCallback)(() => {
+    if (disabled) return;
+    setDraft(value);
+    setError(null);
+    setEditing(true);
+  }, [disabled, value, setEditing]);
+  (0, import_react15.useImperativeHandle)(forwardedRef, () => ({ edit: beginEdit, cancel }), [beginEdit, cancel]);
+  const onDisplayKeyDown = (e) => {
+    if (disabled) return;
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      beginEdit();
+    }
+  };
+  const onDisplayActivate = (e) => {
+    if (disabled) return;
+    if (activate === "dblclick" && e.detail >= 2 || activate === "click" && e.detail >= 1) {
+      e.preventDefault();
+      beginEdit();
+    }
+  };
+  const onInputKeyDown = (e) => {
+    if (e.key === "Enter") {
+      e.preventDefault();
+      commit();
+    } else if (e.key === "Escape") {
+      e.preventDefault();
+      cancel();
+    }
+  };
+  if (editing) {
+    const errorId = `${rest.id ?? "inline-edit"}-error`;
+    const inputAriaLabel = ariaLabel ?? value ?? placeholder;
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "inline-flex flex-col items-stretch gap-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        "input",
+        {
+          ref: inputRef,
+          type: "text",
+          value: draft,
+          onChange: (e) => {
+            setDraft(e.target.value);
+            if (error) setError(null);
+          },
+          onKeyDown: onInputKeyDown,
+          onBlur: () => {
+            if (commitOnBlur) commit();
+            else cancel();
+          },
+          placeholder,
+          "aria-label": inputAriaLabel,
+          "aria-invalid": error ? true : void 0,
+          "aria-errormessage": error ? errorId : void 0,
+          className: cn(inputStyles({ size, tone: error ? "err" : "default" }), inputClassName)
+        }
+      ),
+      error && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { id: errorId, role: "alert", className: "text-err text-[11px]", children: error })
+    ] });
+  }
+  const Tag3 = as;
+  const isHeading = as === "h1" || as === "h2" || as === "h3";
+  const isEmpty = value.length === 0;
+  const displayText = isEmpty ? placeholder : value;
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    Tag3,
+    {
+      role: isHeading ? void 0 : "button",
+      "aria-roledescription": isHeading ? "editable" : void 0,
+      tabIndex: disabled ? -1 : 0,
+      "aria-disabled": disabled || void 0,
+      "aria-label": ariaLabel ?? `Edit ${value || placeholder}`,
+      "data-empty": isEmpty || void 0,
+      onClick: onDisplayActivate,
+      onKeyDown: onDisplayKeyDown,
+      className: cn(
+        displayStyles({ size }),
+        isEmpty && "text-text-dim italic",
+        disabled && "cursor-not-allowed opacity-50 hover:bg-transparent",
+        className
+      ),
+      ...rest,
+      children: displayText
+    }
+  );
+});
+InlineEdit.displayName = "InlineEdit";
+
+// src/components/Input/Input.tsx
+var import_class_variance_authority4 = require("class-variance-authority");
+var import_react16 = require("react");
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var inputWrapperStyles = (0, import_class_variance_authority4.cva)(
   [
     "flex items-center gap-[6px] font-sans transition-[border-color,box-shadow] duration-(--duration-micro)",
     "border focus-within:ring-[3px]",
@@ -753,16 +941,16 @@ var inputWrapperStyles = (0, import_class_variance_authority3.cva)(
     defaultVariants: { size: "md", tone: "default", density: "comfortable" }
   }
 );
-var Input = (0, import_react15.forwardRef)(function Input2({ size, tone, density, icon, trailing, error, width, className, style, disabled, ...props }, ref) {
+var Input = (0, import_react16.forwardRef)(function Input2({ size, tone, density, icon, trailing, error, width, className, style, disabled, ...props }, ref) {
   const computedTone = error ? "err" : tone;
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
     "div",
     {
       className: cn(inputWrapperStyles({ size, tone: computedTone, density }), className),
       style: { width, ...style },
       children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "text-text-dim leading-none", children: icon }),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        icon && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-text-dim leading-none", children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           "input",
           {
             ref,
@@ -776,7 +964,7 @@ var Input = (0, import_react15.forwardRef)(function Input2({ size, tone, density
             ...props
           }
         ),
-        trailing && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "text-text-dim text-[11px]", children: trailing })
+        trailing && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-text-dim text-[11px]", children: trailing })
       ]
     }
   );
@@ -784,9 +972,9 @@ var Input = (0, import_react15.forwardRef)(function Input2({ size, tone, density
 Input.displayName = "Input";
 
 // src/components/Input/SearchInput.tsx
-var import_react16 = require("react");
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var SearchInput = (0, import_react16.forwardRef)(function SearchInput2({
+var import_react17 = require("react");
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var SearchInput = (0, import_react17.forwardRef)(function SearchInput2({
   shortcut,
   width,
   density = "comfortable",
@@ -799,7 +987,7 @@ var SearchInput = (0, import_react16.forwardRef)(function SearchInput2({
   const isTouch = density === "touch";
   const resolvedWidth = width ?? (isTouch ? "100%" : 360);
   const resolvedShortcut = shortcut ?? (isTouch ? void 0 : "\u2318K");
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
     "div",
     {
       className: cn(
@@ -812,8 +1000,8 @@ var SearchInput = (0, import_react16.forwardRef)(function SearchInput2({
       ),
       style: { width: resolvedWidth, ...style },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: cn("text-text-dim leading-none", isTouch && "text-[18px]"), "aria-hidden": true, children: "\u2315" }),
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: cn("text-text-dim leading-none", isTouch && "text-[18px]"), "aria-hidden": true, children: "\u2315" }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
           "input",
           {
             ref,
@@ -827,7 +1015,7 @@ var SearchInput = (0, import_react16.forwardRef)(function SearchInput2({
             ...props
           }
         ),
-        resolvedShortcut && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("kbd", { className: "text-text-dim border-border rounded-xs border px-[6px] py-[2px] font-mono text-[10px]", children: resolvedShortcut })
+        resolvedShortcut && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("kbd", { className: "text-text-dim border-border rounded-xs border px-[6px] py-[2px] font-mono text-[10px]", children: resolvedShortcut })
       ]
     }
   );
@@ -835,16 +1023,16 @@ var SearchInput = (0, import_react16.forwardRef)(function SearchInput2({
 SearchInput.displayName = "SearchInput";
 
 // src/components/OTP/OTP.tsx
-var import_react17 = require("react");
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var OTP = (0, import_react17.forwardRef)(function OTP2({ length = 6, onComplete, onChange, defaultValue = "", ariaLabel = "Code", className, disabled }, ref) {
-  const baseId = (0, import_react17.useId)();
-  const refs = (0, import_react17.useRef)([]);
-  const [values, setValues] = (0, import_react17.useState)(
+var import_react18 = require("react");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var OTP = (0, import_react18.forwardRef)(function OTP2({ length = 6, onComplete, onChange, defaultValue = "", ariaLabel = "Code", className, disabled }, ref) {
+  const baseId = (0, import_react18.useId)();
+  const refs = (0, import_react18.useRef)([]);
+  const [values, setValues] = (0, import_react18.useState)(
     () => Array.from({ length }, (_, i) => defaultValue[i] ?? "")
   );
-  const [completedAnnouncement, setCompletedAnnouncement] = (0, import_react17.useState)("");
-  (0, import_react17.useImperativeHandle)(ref, () => ({
+  const [completedAnnouncement, setCompletedAnnouncement] = (0, import_react18.useState)("");
+  (0, import_react18.useImperativeHandle)(ref, () => ({
     focus: () => refs.current[0]?.focus(),
     reset: () => {
       setValues(Array(length).fill(""));
@@ -894,8 +1082,8 @@ var OTP = (0, import_react17.forwardRef)(function OTP2({ length = 6, onComplete,
     }
     refs.current[Math.min(pasted.length, length - 1)]?.focus();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: cn("flex gap-2", className), children: [
-    values.map((c, i) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: cn("flex gap-2", className), children: [
+    values.map((c, i) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
       "input",
       {
         id: `${baseId}-${i}`,
@@ -921,23 +1109,23 @@ var OTP = (0, import_react17.forwardRef)(function OTP2({ length = 6, onComplete,
       },
       i
     )),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "sr-only", "aria-live": "polite", "aria-atomic": "true", children: completedAnnouncement })
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "sr-only", "aria-live": "polite", "aria-atomic": "true", children: completedAnnouncement })
   ] });
 });
 OTP.displayName = "OTP";
 
 // src/components/Radio/Radio.tsx
 var RadixRadio = __toESM(require("@radix-ui/react-radio-group"), 1);
-var import_react18 = require("react");
-var import_jsx_runtime11 = require("react/jsx-runtime");
-var RadioGroup = (0, import_react18.forwardRef)(function RadioGroup2({ className, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(RadixRadio.Root, { ref, className: cn("flex flex-col gap-2", className), ...props });
+var import_react19 = require("react");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var RadioGroup = (0, import_react19.forwardRef)(function RadioGroup2({ className, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(RadixRadio.Root, { ref, className: cn("flex flex-col gap-2", className), ...props });
 });
 RadioGroup.displayName = "RadioGroup";
-var Radio = (0, import_react18.forwardRef)(function Radio2({ label, className, id: idProp, ...props }, ref) {
-  const reactId = (0, import_react18.useId)();
+var Radio = (0, import_react19.forwardRef)(function Radio2({ label, className, id: idProp, ...props }, ref) {
+  const reactId = (0, import_react19.useId)();
   const id = idProp ?? `radio-${reactId}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
     "span",
     {
       className: cn(
@@ -946,7 +1134,7 @@ var Radio = (0, import_react18.forwardRef)(function Radio2({ label, className, i
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
           RadixRadio.Item,
           {
             ref,
@@ -959,10 +1147,10 @@ var Radio = (0, import_react18.forwardRef)(function Radio2({ label, className, i
               "focus-visible:ring-accent-dim outline-none focus-visible:ring-[3px]"
             ),
             ...props,
-            children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(RadixRadio.Indicator, { className: "bg-accent block h-[7px] w-[7px] rounded-full" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(RadixRadio.Indicator, { className: "bg-accent block h-[7px] w-[7px] rounded-full" })
           }
         ),
-        label && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("label", { htmlFor: id, className: "cursor-pointer text-[13px]", children: label })
+        label && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("label", { htmlFor: id, className: "cursor-pointer text-[13px]", children: label })
       ]
     }
   );
@@ -971,8 +1159,8 @@ Radio.displayName = "Radio";
 
 // src/components/Select/Select.tsx
 var RadixSelect = __toESM(require("@radix-ui/react-select"), 1);
-var import_react19 = require("react");
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_react20 = require("react");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 var SelectRoot = RadixSelect.Root;
 var SelectValue = RadixSelect.Value;
 var SelectGroup = RadixSelect.Group;
@@ -982,8 +1170,8 @@ var triggerClasses = {
   md: "h-[34px] px-[10px] text-[13px]",
   lg: "h-10 px-3 text-[14px]"
 };
-var SelectTrigger = (0, import_react19.forwardRef)(function SelectTrigger2({ size = "md", className, children, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+var SelectTrigger = (0, import_react20.forwardRef)(function SelectTrigger2({ size = "md", className, children, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
     RadixSelect.Trigger,
     {
       ref,
@@ -999,15 +1187,15 @@ var SelectTrigger = (0, import_react19.forwardRef)(function SelectTrigger2({ siz
       ...props,
       children: [
         children,
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(RadixSelect.Icon, { className: "text-text-dim text-[11px] leading-none", children: "\u25BE" })
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixSelect.Icon, { className: "text-text-dim text-[11px] leading-none", children: "\u25BE" })
       ]
     }
   );
 });
 SelectTrigger.displayName = "SelectTrigger";
-var SelectContent = (0, import_react19.forwardRef)(
+var SelectContent = (0, import_react20.forwardRef)(
   function SelectContent2({ className, children, position = "popper", sideOffset = 6, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(RadixSelect.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixSelect.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       RadixSelect.Content,
       {
         ref,
@@ -1019,15 +1207,15 @@ var SelectContent = (0, import_react19.forwardRef)(
           className
         ),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(RadixSelect.Viewport, { children })
+        children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixSelect.Viewport, { children })
       }
     ) });
   }
 );
 SelectContent.displayName = "SelectContent";
-var SelectItem = (0, import_react19.forwardRef)(
+var SelectItem = (0, import_react20.forwardRef)(
   function SelectItem2({ className, children, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       RadixSelect.Item,
       {
         ref,
@@ -1039,7 +1227,7 @@ var SelectItem = (0, import_react19.forwardRef)(
           className
         ),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(RadixSelect.ItemText, { children })
+        children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixSelect.ItemText, { children })
       }
     );
   }
@@ -1054,30 +1242,30 @@ function Select({
   "aria-labelledby": ariaLabelledBy,
   ...rootProps
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(RadixSelect.Root, { ...rootProps, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(RadixSelect.Root, { ...rootProps, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       SelectTrigger,
       {
         size,
         className,
         "aria-label": ariaLabel,
         "aria-labelledby": ariaLabelledBy,
-        children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectValue, { placeholder })
+        children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SelectValue, { placeholder })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectContent, { children: options.map((opt) => {
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SelectContent, { children: options.map((opt) => {
       const value = typeof opt === "string" ? opt : opt.value;
       const label = typeof opt === "string" ? opt : opt.label;
-      return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectItem, { value, children: label }, value);
+      return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SelectItem, { value, children: label }, value);
     }) })
   ] });
 }
 
 // src/components/Slider/Slider.tsx
 var RadixSlider = __toESM(require("@radix-ui/react-slider"), 1);
-var import_react20 = require("react");
-var import_jsx_runtime13 = require("react/jsx-runtime");
-var Slider = (0, import_react20.forwardRef)(function Slider2({
+var import_react21 = require("react");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var Slider = (0, import_react21.forwardRef)(function Slider2({
   showValue,
   width = 240,
   className,
@@ -1092,10 +1280,10 @@ var Slider = (0, import_react20.forwardRef)(function Slider2({
   const arrValue = Array.isArray(value) ? value : value !== void 0 ? [value] : void 0;
   const arrDefault = Array.isArray(defaultValue) ? defaultValue : defaultValue !== void 0 ? [defaultValue] : void 0;
   const isControlled = arrValue !== void 0;
-  const [uncontrolledValue, setUncontrolledValue] = (0, import_react20.useState)(arrDefault);
+  const [uncontrolledValue, setUncontrolledValue] = (0, import_react21.useState)(arrDefault);
   const currentValue = isControlled ? arrValue : uncontrolledValue;
   const wasScalar = !Array.isArray(value ?? defaultValue) && (value ?? defaultValue) !== void 0;
-  const handleValueChange = (0, import_react20.useCallback)(
+  const handleValueChange = (0, import_react21.useCallback)(
     (next) => {
       if (!isControlled) setUncontrolledValue(next);
       if (onValueChange) {
@@ -1106,14 +1294,14 @@ var Slider = (0, import_react20.forwardRef)(function Slider2({
   );
   const display = currentValue?.[0] ?? props.min ?? 0;
   const thumbCount = (arrValue ?? arrDefault)?.length ?? 1;
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
     "span",
     {
       ref,
       className: cn("inline-flex items-center gap-[10px]", className),
       style: { width },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
           RadixSlider.Root,
           {
             value: arrValue,
@@ -1122,11 +1310,11 @@ var Slider = (0, import_react20.forwardRef)(function Slider2({
             className: "relative flex h-4 flex-1 touch-none items-center select-none",
             ...props,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixSlider.Track, { className: "bg-panel-2 relative h-1 grow rounded-full", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixSlider.Range, { className: "bg-accent absolute h-full rounded-full" }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(RadixSlider.Track, { className: "bg-panel-2 relative h-1 grow rounded-full", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(RadixSlider.Range, { className: "bg-accent absolute h-full rounded-full" }) }),
               Array.from({ length: thumbCount }, (_, i) => {
                 const perThumb = thumbLabels?.[i];
                 const thumbAriaLabel = perThumb ?? (ariaLabelledBy ? void 0 : ariaLabel ?? "Value");
-                return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                   RadixSlider.Thumb,
                   {
                     className: cn(
@@ -1143,7 +1331,7 @@ var Slider = (0, import_react20.forwardRef)(function Slider2({
             ]
           }
         ),
-        showValue && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-text-muted min-w-[28px] text-right font-mono text-[11px]", children: display })
+        showValue && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "text-text-muted min-w-[28px] text-right font-mono text-[11px]", children: display })
       ]
     }
   );
@@ -1152,8 +1340,8 @@ Slider.displayName = "Slider";
 
 // src/components/Switch/Switch.tsx
 var RadixSwitch = __toESM(require("@radix-ui/react-switch"), 1);
-var import_react21 = require("react");
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_react22 = require("react");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 var trackClasses = {
   comfortable: {
     sm: "h-4 w-7",
@@ -1174,10 +1362,10 @@ var thumbClasses = {
     md: "h-[26px] w-[26px] data-[state=checked]:translate-x-5"
   }
 };
-var Switch = (0, import_react21.forwardRef)(function Switch2({ label, size = "md", density = "comfortable", className, id: idProp, ...props }, ref) {
-  const reactId = (0, import_react21.useId)();
+var Switch = (0, import_react22.forwardRef)(function Switch2({ label, size = "md", density = "comfortable", className, id: idProp, ...props }, ref) {
+  const reactId = (0, import_react22.useId)();
   const id = idProp ?? `sw-${reactId}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
     "span",
     {
       className: cn(
@@ -1186,7 +1374,7 @@ var Switch = (0, import_react21.forwardRef)(function Switch2({ label, size = "md
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           RadixSwitch.Root,
           {
             ref,
@@ -1199,7 +1387,7 @@ var Switch = (0, import_react21.forwardRef)(function Switch2({ label, size = "md
               trackClasses[density][size]
             ),
             ...props,
-            children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               RadixSwitch.Thumb,
               {
                 className: cn(
@@ -1211,7 +1399,7 @@ var Switch = (0, import_react21.forwardRef)(function Switch2({ label, size = "md
             )
           }
         ),
-        label && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        label && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           "label",
           {
             htmlFor: id,
@@ -1226,10 +1414,10 @@ var Switch = (0, import_react21.forwardRef)(function Switch2({ label, size = "md
 Switch.displayName = "Switch";
 
 // src/components/Textarea/Textarea.tsx
-var import_class_variance_authority4 = require("class-variance-authority");
-var import_react22 = require("react");
-var import_jsx_runtime15 = require("react/jsx-runtime");
-var textareaStyles = (0, import_class_variance_authority4.cva)(
+var import_class_variance_authority5 = require("class-variance-authority");
+var import_react23 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var textareaStyles = (0, import_class_variance_authority5.cva)(
   [
     "w-full font-sans text-text bg-panel rounded-md p-[10px]",
     "border outline-none transition-[border-color,box-shadow] duration-(--duration-micro)",
@@ -1247,8 +1435,8 @@ var textareaStyles = (0, import_class_variance_authority4.cva)(
     defaultVariants: { tone: "default" }
   }
 );
-var Textarea = (0, import_react22.forwardRef)(function Textarea2({ tone, error, rows = 4, className, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var Textarea = (0, import_react23.forwardRef)(function Textarea2({ tone, error, rows = 4, className, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     "textarea",
     {
       ref,
@@ -1263,11 +1451,11 @@ Textarea.displayName = "Textarea";
 
 // src/components/Avatar/Avatar.tsx
 var RadixAvatar = __toESM(require("@radix-ui/react-avatar"), 1);
-var import_react24 = require("react");
+var import_react25 = require("react");
 
 // src/components/StatusDot/StatusDot.tsx
-var import_react23 = require("react");
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_react24 = require("react");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var stateColor = {
   ok: "bg-ok",
   warn: "bg-warn",
@@ -1292,8 +1480,8 @@ var stateLabel = {
   sync: "Syncing",
   accent: "Active"
 };
-var StatusDot = (0, import_react23.forwardRef)(function StatusDot2({ state = "ok", label, pulse, size = 8, className, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+var StatusDot = (0, import_react24.forwardRef)(function StatusDot2({ state = "ok", label, pulse, size = 8, className, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     "span",
     {
       ref,
@@ -1302,7 +1490,7 @@ var StatusDot = (0, import_react23.forwardRef)(function StatusDot2({ state = "ok
       className: cn("inline-flex items-center gap-[6px]", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
           "span",
           {
             className: cn(
@@ -1314,7 +1502,7 @@ var StatusDot = (0, import_react23.forwardRef)(function StatusDot2({ state = "ok
             style: { width: size, height: size }
           }
         ),
-        label && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-text-muted text-[12px]", children: label })
+        label && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-text-muted text-[12px]", children: label })
       ]
     }
   );
@@ -1331,7 +1519,7 @@ var sizePx = {
 };
 
 // src/components/Avatar/Avatar.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var statusBg = {
   ok: "bg-ok",
   warn: "bg-warn",
@@ -1346,11 +1534,11 @@ function hashHue(str) {
   for (let i = 0; i < str.length; i++) h = (h * 31 + str.charCodeAt(i)) % 360;
   return h;
 }
-var Avatar = (0, import_react24.forwardRef)(function Avatar2({ name = "?", src, size = "md", status, initials, className, style, ...props }, ref) {
+var Avatar = (0, import_react25.forwardRef)(function Avatar2({ name = "?", src, size = "md", status, initials, className, style, ...props }, ref) {
   const dim = sizePx[size];
   const hue = hashHue(name);
   const computedInitials = initials ?? initialsFor(name);
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
     "span",
     {
       ref,
@@ -1358,7 +1546,7 @@ var Avatar = (0, import_react24.forwardRef)(function Avatar2({ name = "?", src,
       style: { width: dim, height: dim, ...style },
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
           RadixAvatar.Root,
           {
             className: "border-border relative inline-flex h-full w-full shrink-0 overflow-hidden rounded-full border",
@@ -1366,8 +1554,8 @@ var Avatar = (0, import_react24.forwardRef)(function Avatar2({ name = "?", src,
               background: src ? void 0 : `oklch(var(--color-avatar-fallback-l) var(--color-avatar-fallback-c) ${hue})`
             },
             children: [
-              src && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(RadixAvatar.Image, { src, alt: name, className: "h-full w-full object-cover" }),
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+              src && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(RadixAvatar.Image, { src, alt: name, className: "h-full w-full object-cover" }),
+              /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
                 RadixAvatar.Fallback,
                 {
                   className: "flex h-full w-full items-center justify-center font-sans font-semibold text-white",
@@ -1378,7 +1566,7 @@ var Avatar = (0, import_react24.forwardRef)(function Avatar2({ name = "?", src,
             ]
           }
         ),
-        status && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        status && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
           "span",
           {
             role: "img",
@@ -1397,16 +1585,16 @@ var Avatar = (0, import_react24.forwardRef)(function Avatar2({ name = "?", src,
 Avatar.displayName = "Avatar";
 
 // src/components/Avatar/AvatarGroup.tsx
-var import_react25 = require("react");
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var AvatarGroup = (0, import_react25.forwardRef)(function AvatarGroup2({ names, max = 3, size = "md", className, ...props }, ref) {
+var import_react26 = require("react");
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var AvatarGroup = (0, import_react26.forwardRef)(function AvatarGroup2({ names, max = 3, size = "md", className, ...props }, ref) {
   const dim = sizePx[size];
   const visible = names.slice(0, max);
   const rest = names.length - visible.length;
   const overlap = -dim * 0.35;
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { ref, className: cn("inline-flex", className), ...props, children: [
-    visible.map((n, i) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { style: { marginLeft: i === 0 ? 0 : overlap }, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Avatar, { name: n, size }) }, `${n}-${i}`)),
-    rest > 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { ref, className: cn("inline-flex", className), ...props, children: [
+    visible.map((n, i) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { style: { marginLeft: i === 0 ? 0 : overlap }, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Avatar, { name: n, size }) }, `${n}-${i}`)),
+    rest > 0 && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
       "span",
       {
         "aria-label": `+${rest} more`,
@@ -1428,10 +1616,10 @@ var AvatarGroup = (0, import_react25.forwardRef)(function AvatarGroup2({ names,
 AvatarGroup.displayName = "AvatarGroup";
 
 // src/components/Badge/Badge.tsx
-var import_class_variance_authority5 = require("class-variance-authority");
-var import_react26 = require("react");
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var badgeStyles = (0, import_class_variance_authority5.cva)("inline-flex items-center font-sans leading-none whitespace-nowrap", {
+var import_class_variance_authority6 = require("class-variance-authority");
+var import_react27 = require("react");
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var badgeStyles = (0, import_class_variance_authority6.cva)("inline-flex items-center font-sans leading-none whitespace-nowrap", {
   variants: {
     variant: {
       neutral: "bg-panel-2 text-text-muted border border-border",
@@ -1464,28 +1652,28 @@ var dotColorClass = {
   solid: "bg-bg"
 };
 var dotSize = { sm: "h-[5px] w-[5px]", md: "h-[6px] w-[6px]", lg: "h-[7px] w-[7px]" };
-var Badge = (0, import_react26.forwardRef)(function Badge2({ variant = "neutral", size = "md", dot, icon, className, children, ...props }, ref) {
+var Badge = (0, import_react27.forwardRef)(function Badge2({ variant = "neutral", size = "md", dot, icon, className, children, ...props }, ref) {
   const sz = size ?? "md";
   const v = variant ?? "neutral";
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { ref, className: cn(badgeStyles({ variant, size }), className), ...props, children: [
-    dot && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { ref, className: cn(badgeStyles({ variant, size }), className), ...props, children: [
+    dot && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       "span",
       {
         "aria-hidden": true,
         className: cn("inline-block rounded-full", dotSize[sz], dotColorClass[v])
       }
     ),
-    icon && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "inline-flex leading-none", children: icon }),
+    icon && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "inline-flex leading-none", children: icon }),
     children
   ] });
 });
 Badge.displayName = "Badge";
 
 // src/components/Card/Card.tsx
-var import_class_variance_authority6 = require("class-variance-authority");
-var import_react27 = require("react");
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var cardStyles = (0, import_class_variance_authority6.cva)(
+var import_class_variance_authority7 = require("class-variance-authority");
+var import_react28 = require("react");
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var cardStyles = (0, import_class_variance_authority7.cva)(
   "block bg-panel border border-border transition-[border-color,transform,box-shadow] duration-(--duration-step)",
   {
     variants: {
@@ -1506,7 +1694,7 @@ var cardStyles = (0, import_class_variance_authority6.cva)(
     defaultVariants: { variant: "default", interactive: false, density: "comfortable" }
   }
 );
-var Card = (0, import_react27.forwardRef)(function Card2({
+var Card = (0, import_react28.forwardRef)(function Card2({
   variant,
   interactive,
   density,
@@ -1538,7 +1726,7 @@ var Card = (0, import_react27.forwardRef)(function Card2({
       onClick(e);
     }
   } : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
     "div",
     {
       ref,
@@ -1553,20 +1741,20 @@ var Card = (0, import_react27.forwardRef)(function Card2({
       ),
       ...props,
       children: [
-        (title || actions) && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: cn("flex items-start gap-3", (description || children) && "mb-[10px]"), children: [
-          title && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex-1 text-[14px] font-medium", children: title }),
-          actions && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex gap-1", children: actions })
+        (title || actions) && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: cn("flex items-start gap-3", (description || children) && "mb-[10px]"), children: [
+          title && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex-1 text-[14px] font-medium", children: title }),
+          actions && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex gap-1", children: actions })
         ] }),
-        description && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: cn("text-text-muted text-[12px] leading-[1.55]", children && "mb-[14px]"), children: description }),
+        description && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: cn("text-text-muted text-[12px] leading-[1.55]", children && "mb-[14px]"), children: description }),
         children,
-        footer && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "border-border text-text-dim mt-[14px] border-t pt-3 text-[11px]", children: footer })
+        footer && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "border-border text-text-dim mt-[14px] border-t pt-3 text-[11px]", children: footer })
       ]
     }
   );
 });
 Card.displayName = "Card";
-var CardLink = (0, import_react27.forwardRef)(function CardLink2({ variant, density, title, description, footer, className, children, href, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+var CardLink = (0, import_react28.forwardRef)(function CardLink2({ variant, density, title, description, footer, className, children, href, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
     "a",
     {
       ref,
@@ -1579,10 +1767,10 @@ var CardLink = (0, import_react27.forwardRef)(function CardLink2({ variant, dens
       ),
       ...props,
       children: [
-        title && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: cn("flex items-start", (description || children) && "mb-[10px]"), children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex-1 text-[14px] font-medium", children: title }) }),
-        description && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: cn("text-text-muted text-[12px] leading-[1.55]", children && "mb-[14px]"), children: description }),
+        title && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: cn("flex items-start", (description || children) && "mb-[10px]"), children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex-1 text-[14px] font-medium", children: title }) }),
+        description && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: cn("text-text-muted text-[12px] leading-[1.55]", children && "mb-[14px]"), children: description }),
         children,
-        footer && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "border-border text-text-dim mt-[14px] border-t pt-3 text-[11px]", children: footer })
+        footer && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "border-border text-text-dim mt-[14px] border-t pt-3 text-[11px]", children: footer })
       ]
     }
   );
@@ -1590,28 +1778,28 @@ var CardLink = (0, import_react27.forwardRef)(function CardLink2({ variant, dens
 CardLink.displayName = "CardLink";
 
 // src/components/Card/StatCard.tsx
-var import_react28 = require("react");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_react29 = require("react");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var trendClasses = {
   up: "text-ok",
   down: "text-err",
   flat: "text-text-dim"
 };
 var trendArrows = { up: "\u2191", down: "\u2193", flat: "\u2192" };
-var StatCard = (0, import_react28.forwardRef)(function StatCard2({ label, value, delta, trend = "flat", icon, className, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+var StatCard = (0, import_react29.forwardRef)(function StatCard2({ label, value, delta, trend = "flat", icon, className, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     "div",
     {
       ref,
       className: cn("bg-panel border-border rounded-base block border p-[18px]", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "mb-[10px] flex items-center justify-between", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "text-text-dim font-mono text-[10px] tracking-wide uppercase", children: label }),
-          icon && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "text-text-dim text-[14px]", children: icon })
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "mb-[10px] flex items-center justify-between", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "text-text-dim font-mono text-[10px] tracking-wide uppercase", children: label }),
+          icon && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "text-text-dim text-[14px]", children: icon })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "text-text font-mono text-[26px] leading-none font-medium tracking-tight", children: value }),
-        delta !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: cn("mt-[6px] font-mono text-[11px]", trendClasses[trend]), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "text-text font-mono text-[26px] leading-none font-medium tracking-tight", children: value }),
+        delta !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: cn("mt-[6px] font-mono text-[11px]", trendClasses[trend]), children: [
           trendArrows[trend],
           " ",
           delta
@@ -1623,11 +1811,11 @@ var StatCard = (0, import_react28.forwardRef)(function StatCard2({ label, value,
 StatCard.displayName = "StatCard";
 
 // src/components/Chip/Chip.tsx
-var import_react29 = require("react");
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var Chip = (0, import_react29.forwardRef)(function Chip2({ icon, onRemove, density = "comfortable", className, children, ...props }, ref) {
+var import_react30 = require("react");
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var Chip = (0, import_react30.forwardRef)(function Chip2({ icon, onRemove, density = "comfortable", className, children, ...props }, ref) {
   const isTouch = density === "touch";
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
     "span",
     {
       ref,
@@ -1639,9 +1827,9 @@ var Chip = (0, import_react29.forwardRef)(function Chip2({ icon, onRemove, densi
       ),
       ...props,
       children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: cn("text-text-dim inline-flex", isTouch ? "text-[12px]" : "text-[10px]"), children: icon }),
+        icon && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: cn("text-text-dim inline-flex", isTouch ? "text-[12px]" : "text-[10px]"), children: icon }),
         children,
-        onRemove && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        onRemove && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           "button",
           {
             type: "button",
@@ -1661,10 +1849,10 @@ var Chip = (0, import_react29.forwardRef)(function Chip2({ icon, onRemove, densi
 Chip.displayName = "Chip";
 
 // src/components/Kbd/Kbd.tsx
-var import_react30 = require("react");
-var import_jsx_runtime23 = require("react/jsx-runtime");
-var Kbd = (0, import_react30.forwardRef)(function Kbd2({ className, children, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+var import_react31 = require("react");
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var Kbd = (0, import_react31.forwardRef)(function Kbd2({ className, children, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     "kbd",
     {
       ref,
@@ -1683,11 +1871,11 @@ Kbd.displayName = "Kbd";
 
 // src/components/ScrollArea/ScrollArea.tsx
 var RadixScrollArea = __toESM(require("@radix-ui/react-scroll-area"), 1);
-var import_react31 = require("react");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_react32 = require("react");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var scrollbarBase = "flex touch-none select-none p-[2px] transition-colors duration-(--duration-micro)";
 var thumbBase = 'relative flex-1 rounded-full bg-text-muted/40 hover:bg-text-muted/60 before:absolute before:inset-1/2 before:size-full before:min-h-[44px] before:min-w-[44px] before:-translate-x-1/2 before:-translate-y-1/2 before:content-[""]';
-var ScrollArea = (0, import_react31.forwardRef)(function ScrollArea2({
+var ScrollArea = (0, import_react32.forwardRef)(function ScrollArea2({
   type = "hover",
   orientation = "vertical",
   scrollHideDelay = 600,
@@ -1699,7 +1887,7 @@ var ScrollArea = (0, import_react31.forwardRef)(function ScrollArea2({
 }, ref) {
   const showVertical = orientation === "vertical" || orientation === "both";
   const showHorizontal = orientation === "horizontal" || orientation === "both";
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
     RadixScrollArea.Root,
     {
       ref,
@@ -1708,7 +1896,7 @@ var ScrollArea = (0, import_react31.forwardRef)(function ScrollArea2({
       className: cn("relative overflow-hidden", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
           RadixScrollArea.Viewport,
           {
             ref: viewportRef,
@@ -1716,15 +1904,15 @@ var ScrollArea = (0, import_react31.forwardRef)(function ScrollArea2({
             children
           }
         ),
-        showVertical && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        showVertical && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
           RadixScrollArea.Scrollbar,
           {
             orientation: "vertical",
             className: cn(scrollbarBase, "bg-panel-2/40 hover:bg-panel-2/80 h-full w-[10px]"),
-            children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(RadixScrollArea.Thumb, { className: thumbBase })
+            children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(RadixScrollArea.Thumb, { className: thumbBase })
           }
         ),
-        showHorizontal && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        showHorizontal && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
           RadixScrollArea.Scrollbar,
           {
             orientation: "horizontal",
@@ -1732,10 +1920,10 @@ var ScrollArea = (0, import_react31.forwardRef)(function ScrollArea2({
               scrollbarBase,
               "bg-panel-2/40 hover:bg-panel-2/80 h-[10px] w-full flex-col"
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(RadixScrollArea.Thumb, { className: thumbBase })
+            children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(RadixScrollArea.Thumb, { className: thumbBase })
           }
         ),
-        orientation === "both" && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(RadixScrollArea.Corner, { className: "bg-panel-2/60" })
+        orientation === "both" && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(RadixScrollArea.Corner, { className: "bg-panel-2/60" })
       ]
     }
   );
@@ -1743,10 +1931,10 @@ var ScrollArea = (0, import_react31.forwardRef)(function ScrollArea2({
 ScrollArea.displayName = "ScrollArea";
 
 // src/components/Skeleton/Skeleton.tsx
-var import_class_variance_authority7 = require("class-variance-authority");
-var import_react32 = require("react");
-var import_jsx_runtime25 = require("react/jsx-runtime");
-var skeletonStyles = (0, import_class_variance_authority7.cva)("block bg-panel-2 animate-[ship-skeleton_1.4s_infinite]", {
+var import_class_variance_authority8 = require("class-variance-authority");
+var import_react33 = require("react");
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var skeletonStyles = (0, import_class_variance_authority8.cva)("block bg-panel-2 animate-[ship-skeleton_1.4s_infinite]", {
   variants: {
     shape: {
       line: "rounded-xs",
@@ -1757,11 +1945,11 @@ var skeletonStyles = (0, import_class_variance_authority7.cva)("block bg-panel-2
   defaultVariants: { shape: "line" }
 });
 var defaultHeight = { line: 14, block: 80, circle: 40 };
-var Skeleton = (0, import_react32.forwardRef)(function Skeleton2({ shape = "line", width = "100%", height, standalone = false, className, style, ...props }, ref) {
+var Skeleton = (0, import_react33.forwardRef)(function Skeleton2({ shape = "line", width = "100%", height, standalone = false, className, style, ...props }, ref) {
   const h = height ?? defaultHeight[shape];
   const w = shape === "circle" ? h : width;
   const a11yProps = standalone ? { role: "status", "aria-busy": true, "aria-label": "Loading" } : { "aria-hidden": true };
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "div",
     {
       ref,
@@ -1773,11 +1961,11 @@ var Skeleton = (0, import_react32.forwardRef)(function Skeleton2({ shape = "line
   );
 });
 Skeleton.displayName = "Skeleton";
-var SkeletonGroup = (0, import_react32.forwardRef)(function SkeletonGroup2({ label = "Loading", loading = true, className, children, ...props }, ref) {
+var SkeletonGroup = (0, import_react33.forwardRef)(function SkeletonGroup2({ label = "Loading", loading = true, className, children, ...props }, ref) {
   if (!loading) {
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { ref, className, ...props, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { ref, className, ...props, children });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "div",
     {
       ref,
@@ -1793,10 +1981,10 @@ var SkeletonGroup = (0, import_react32.forwardRef)(function SkeletonGroup2({ lab
 SkeletonGroup.displayName = "SkeletonGroup";
 
 // src/components/Tag/Tag.tsx
-var import_react33 = require("react");
-var import_jsx_runtime26 = require("react/jsx-runtime");
-var Tag = (0, import_react33.forwardRef)(function Tag2({ onRemove, icon, size = 22, className, children, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+var import_react34 = require("react");
+var import_jsx_runtime27 = require("react/jsx-runtime");
+var Tag = (0, import_react34.forwardRef)(function Tag2({ onRemove, icon, size = 22, className, children, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
     "span",
     {
       ref,
@@ -1808,9 +1996,9 @@ var Tag = (0, import_react33.forwardRef)(function Tag2({ onRemove, icon, size =
       style: { height: size },
       ...props,
       children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-text-dim inline-flex", children: icon }),
+        icon && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "text-text-dim inline-flex", children: icon }),
         children,
-        onRemove && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+        onRemove && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
           "button",
           {
             type: "button",
@@ -1828,14 +2016,14 @@ Tag.displayName = "Tag";
 
 // src/components/ContextMenu/ContextMenu.tsx
 var RadixContext = __toESM(require("@radix-ui/react-context-menu"), 1);
-var import_react34 = require("react");
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_react35 = require("react");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 var ContextMenuRoot = RadixContext.Root;
 var ContextMenuTrigger = RadixContext.Trigger;
 var ContextMenuPortal = RadixContext.Portal;
-var ContextMenuContent = (0, import_react34.forwardRef)(
+var ContextMenuContent = (0, import_react35.forwardRef)(
   function ContextMenuContent2({ className, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(RadixContext.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(RadixContext.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       RadixContext.Content,
       {
         ref,
@@ -1855,26 +2043,26 @@ var itemBase = cn(
   "data-[highlighted]:bg-panel-2",
   "data-[disabled]:opacity-40 data-[disabled]:cursor-not-allowed"
 );
-var ContextMenuItem = (0, import_react34.forwardRef)(
+var ContextMenuItem = (0, import_react35.forwardRef)(
   function ContextMenuItem2({ icon, trailing, destructive, className, children, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
       RadixContext.Item,
       {
         ref,
         className: cn(itemBase, destructive ? "text-err" : "text-text", className),
         ...props,
         children: [
-          icon && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "w-[14px] text-[12px] opacity-70", children: icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "flex-1", children }),
-          trailing && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "text-text-dim font-mono text-[10px]", children: trailing })
+          icon && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "w-[14px] text-[12px] opacity-70", children: icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "flex-1", children }),
+          trailing && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-text-dim font-mono text-[10px]", children: trailing })
         ]
       }
     );
   }
 );
 ContextMenuItem.displayName = "ContextMenuItem";
-var ContextMenuSeparator = (0, import_react34.forwardRef)(function ContextMenuSeparator2({ className, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+var ContextMenuSeparator = (0, import_react35.forwardRef)(function ContextMenuSeparator2({ className, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     RadixContext.Separator,
     {
       ref,
@@ -1888,15 +2076,15 @@ var ContextMenu = RadixContext.Root;
 
 // src/components/Dialog/Dialog.tsx
 var RadixDialog = __toESM(require("@radix-ui/react-dialog"), 1);
-var import_react35 = require("react");
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_react36 = require("react");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var DialogRoot = RadixDialog.Root;
 var DialogTrigger = RadixDialog.Trigger;
 var DialogClose = RadixDialog.Close;
 var DialogPortal = RadixDialog.Portal;
-var DialogOverlay = (0, import_react35.forwardRef)(
+var DialogOverlay = (0, import_react36.forwardRef)(
   function DialogOverlay2({ className, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
       RadixDialog.Overlay,
       {
         ref,
@@ -1911,10 +2099,10 @@ var DialogOverlay = (0, import_react35.forwardRef)(
   }
 );
 DialogOverlay.displayName = "DialogOverlay";
-var DialogContent = (0, import_react35.forwardRef)(function DialogContent2({ className, width = 460, style, children, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(DialogPortal, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(DialogOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+var DialogContent = (0, import_react36.forwardRef)(function DialogContent2({ className, width = 460, style, children, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(DialogPortal, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(DialogOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
       RadixDialog.Content,
       {
         ref,
@@ -1934,32 +2122,32 @@ var DialogContent = (0, import_react35.forwardRef)(function DialogContent2({ cla
 });
 DialogContent.displayName = "DialogContent";
 function Dialog({ title, description, footer, width, children, ...rootProps }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(DialogRoot, { ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(DialogContent, { width, children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(DialogRoot, { ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(DialogContent, { width, children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
       RadixDialog.Title,
       {
         className: cn("text-[16px] font-medium", description ? "mb-[6px]" : "mb-4"),
         children: title
       }
     ),
-    description && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(RadixDialog.Description, { className: "text-text-muted mb-[18px] text-[13px] leading-[1.55]", children: description }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(RadixDialog.Description, { className: "text-text-muted mb-[18px] text-[13px] leading-[1.55]", children: description }),
     children,
-    footer && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "mt-5 flex justify-end gap-2", children: footer })
+    footer && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "mt-5 flex justify-end gap-2", children: footer })
   ] }) });
 }
 
 // src/components/Dialog/Drawer.tsx
 var RadixDialog2 = __toESM(require("@radix-ui/react-dialog"), 1);
-var import_react36 = require("react");
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_react37 = require("react");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 var sideClasses = {
   left: "top-0 bottom-0 left-0 border-r border-border-strong data-[state=open]:animate-[ship-slide-in-left_220ms_var(--easing-out)]",
   right: "top-0 bottom-0 right-0 border-l border-border-strong data-[state=open]:animate-[ship-slide-in-right_220ms_var(--easing-out)]",
   bottom: "bottom-0 left-0 right-0 border-t border-border-strong rounded-t-m-sheet data-[state=open]:animate-[ship-slide-in-bottom_240ms_var(--easing-out)]"
 };
-var DrawerHeader = ({ title, onClose }) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "border-border flex items-center justify-between border-b p-[16px] px-5", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(RadixDialog2.Title, { className: "text-[14px] font-medium", children: title }),
-  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+var DrawerHeader = ({ title, onClose }) => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "border-border flex items-center justify-between border-b p-[16px] px-5", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(RadixDialog2.Title, { className: "text-[14px] font-medium", children: title }),
+  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
     RadixDialog2.Close,
     {
       onClick: onClose,
@@ -1969,15 +2157,15 @@ var DrawerHeader = ({ title, onClose }) => /* @__PURE__ */ (0, import_jsx_runtim
     }
   )
 ] });
-var SheetHeader = ({ title }) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "px-5 pb-3", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(RadixDialog2.Title, { className: "text-m-body-lg font-semibold tracking-tight", children: title }) });
-var DragHandle = () => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "flex justify-center pt-3 pb-2", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "bg-border-strong h-1 w-9 rounded-full" }) });
-var Drawer = (0, import_react36.forwardRef)(function Drawer2({ side = "right", title, width = 420, height = "85vh", handle, children, ...rootProps }, ref) {
+var SheetHeader = ({ title }) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "px-5 pb-3", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(RadixDialog2.Title, { className: "text-m-body-lg font-semibold tracking-tight", children: title }) });
+var DragHandle = () => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "flex justify-center pt-3 pb-2", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "bg-border-strong h-1 w-9 rounded-full" }) });
+var Drawer = (0, import_react37.forwardRef)(function Drawer2({ side = "right", title, width = 420, height = "85vh", handle, children, ...rootProps }, ref) {
   const isBottom = side === "bottom";
   const showHandle = isBottom && (handle ?? true);
   const dimensionStyle = isBottom ? { height } : { width };
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(DialogRoot, { ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(DialogPortal, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(DialogOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DialogRoot, { ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(DialogPortal, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DialogOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
       RadixDialog2.Content,
       {
         ref,
@@ -1988,9 +2176,9 @@ var Drawer = (0, import_react36.forwardRef)(function Drawer2({ side = "right", t
         ),
         style: dimensionStyle,
         children: [
-          showHandle && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(DragHandle, {}),
-          title ? isBottom ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SheetHeader, { title }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(DrawerHeader, { title }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(RadixDialog2.Title, { className: "sr-only", children: isBottom ? "Sheet" : "Drawer" }),
-          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: cn("flex-1 overflow-auto", isBottom ? "px-5 pb-6" : "p-5"), children })
+          showHandle && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DragHandle, {}),
+          title ? isBottom ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SheetHeader, { title }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DrawerHeader, { title }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(RadixDialog2.Title, { className: "sr-only", children: isBottom ? "Sheet" : "Drawer" }),
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: cn("flex-1 overflow-auto", isBottom ? "px-5 pb-6" : "p-5"), children })
         ]
       }
     )
@@ -2000,12 +2188,12 @@ Drawer.displayName = "Drawer";
 
 // src/components/Dialog/Sheet.tsx
 var RadixDialog3 = __toESM(require("@radix-ui/react-dialog"), 1);
-var import_react37 = require("react");
-var import_jsx_runtime30 = require("react/jsx-runtime");
-var Sheet = (0, import_react37.forwardRef)(function Sheet2({ title, width = "min(640px, 90vw)", children, ...rootProps }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DialogRoot, { ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(DialogPortal, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DialogOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+var import_react38 = require("react");
+var import_jsx_runtime31 = require("react/jsx-runtime");
+var Sheet = (0, import_react38.forwardRef)(function Sheet2({ title, width = "min(640px, 90vw)", children, ...rootProps }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(DialogRoot, { ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(DialogPortal, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(DialogOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
       RadixDialog3.Content,
       {
         ref,
@@ -2017,7 +2205,7 @@ var Sheet = (0, import_react37.forwardRef)(function Sheet2({ title, width = "min
         ),
         style: { width },
         children: [
-          title ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(RadixDialog3.Title, { className: "mb-1 text-[15px] font-medium", children: title }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(RadixDialog3.Title, { className: "sr-only", children: "Sheet" }),
+          title ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(RadixDialog3.Title, { className: "mb-1 text-[15px] font-medium", children: title }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(RadixDialog3.Title, { className: "sr-only", children: "Sheet" }),
           children
         ]
       }
@@ -2028,15 +2216,15 @@ Sheet.displayName = "Sheet";
 
 // src/components/Dialog/AlertDialog.tsx
 var RadixAlert = __toESM(require("@radix-ui/react-alert-dialog"), 1);
-var import_react38 = require("react");
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_react39 = require("react");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var AlertDialogRoot = RadixAlert.Root;
 var AlertDialogTrigger = RadixAlert.Trigger;
 var AlertDialogAction = RadixAlert.Action;
 var AlertDialogCancel = RadixAlert.Cancel;
-var AlertDialog = (0, import_react38.forwardRef)(function AlertDialog2({ title, description, footer, width = 460, children, ...rootProps }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(AlertDialogRoot, { ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(RadixAlert.Portal, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+var AlertDialog = (0, import_react39.forwardRef)(function AlertDialog2({ title, description, footer, width = 460, children, ...rootProps }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(AlertDialogRoot, { ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(RadixAlert.Portal, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
       RadixAlert.Overlay,
       {
         className: cn(
@@ -2045,7 +2233,7 @@ var AlertDialog = (0, import_react38.forwardRef)(function AlertDialog2({ title,
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
       RadixAlert.Content,
       {
         ref,
@@ -2056,16 +2244,16 @@ var AlertDialog = (0, import_react38.forwardRef)(function AlertDialog2({ title,
           "data-[state=open]:animate-[ship-dialog-in_180ms_var(--easing-out)]"
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
             RadixAlert.Title,
             {
               className: cn("text-[16px] font-medium", description ? "mb-[6px]" : "mb-4"),
               children: title
             }
           ),
-          description && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(RadixAlert.Description, { className: "text-text-muted mb-[18px] text-[13px] leading-[1.55]", children: description }),
+          description && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(RadixAlert.Description, { className: "text-text-muted mb-[18px] text-[13px] leading-[1.55]", children: description }),
           children,
-          footer && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "mt-5 flex justify-end gap-2", children: footer })
+          footer && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "mt-5 flex justify-end gap-2", children: footer })
         ]
       }
     )
@@ -2075,17 +2263,17 @@ AlertDialog.displayName = "AlertDialog";
 
 // src/components/DropdownMenu/DropdownMenu.tsx
 var RadixMenu = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
-var import_react39 = require("react");
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_react40 = require("react");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var DropdownMenuRoot = RadixMenu.Root;
 var DropdownMenuTrigger = RadixMenu.Trigger;
 var DropdownMenuPortal = RadixMenu.Portal;
 var DropdownMenuGroup = RadixMenu.Group;
 var DropdownMenuLabel = RadixMenu.Label;
 var DropdownMenuRadioGroup = RadixMenu.RadioGroup;
-var DropdownMenuContent = (0, import_react39.forwardRef)(
+var DropdownMenuContent = (0, import_react40.forwardRef)(
   function DropdownMenuContent2({ className, sideOffset = 6, align = "start", ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(RadixMenu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(RadixMenu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
       RadixMenu.Content,
       {
         ref,
@@ -2107,32 +2295,32 @@ var itemBase2 = cn(
   "data-[highlighted]:bg-panel-2",
   "data-[disabled]:opacity-40 data-[disabled]:cursor-not-allowed"
 );
-var MenuItem = (0, import_react39.forwardRef)(function MenuItem2({ icon, trailing, destructive, className, children, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+var MenuItem = (0, import_react40.forwardRef)(function MenuItem2({ icon, trailing, destructive, className, children, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
     RadixMenu.Item,
     {
       ref,
       className: cn(itemBase2, destructive ? "text-err" : "text-text", className),
       ...props,
       children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "w-[14px] text-[12px] opacity-70", children: icon }),
-        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "flex-1", children }),
-        trailing && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-text-dim font-mono text-[10px]", children: trailing })
+        icon && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "w-[14px] text-[12px] opacity-70", children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "flex-1", children }),
+        trailing && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "text-text-dim font-mono text-[10px]", children: trailing })
       ]
     }
   );
 });
 MenuItem.displayName = "MenuItem";
-var MenuCheckboxItem = (0, import_react39.forwardRef)(
+var MenuCheckboxItem = (0, import_react40.forwardRef)(
   function MenuCheckboxItem2({ className, children, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
       RadixMenu.CheckboxItem,
       {
         ref,
         className: cn(itemBase2, "text-text relative pl-[26px]", className),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(RadixMenu.ItemIndicator, { className: "text-accent absolute top-1/2 left-2 -translate-y-1/2 text-[10px]", children: "\u2713" }),
+          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(RadixMenu.ItemIndicator, { className: "text-accent absolute top-1/2 left-2 -translate-y-1/2 text-[10px]", children: "\u2713" }),
           children
         ]
       }
@@ -2140,9 +2328,9 @@ var MenuCheckboxItem = (0, import_react39.forwardRef)(
   }
 );
 MenuCheckboxItem.displayName = "MenuCheckboxItem";
-var MenuSeparator = (0, import_react39.forwardRef)(
+var MenuSeparator = (0, import_react40.forwardRef)(
   function MenuSeparator2({ className, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
       RadixMenu.Separator,
       {
         ref,
@@ -2157,14 +2345,14 @@ var DropdownMenu = RadixMenu.Root;
 
 // src/components/HoverCard/HoverCard.tsx
 var RadixHoverCard = __toESM(require("@radix-ui/react-hover-card"), 1);
-var import_react40 = require("react");
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_react41 = require("react");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var HoverCardRoot = RadixHoverCard.Root;
 var HoverCardTrigger = RadixHoverCard.Trigger;
 var HoverCardPortal = RadixHoverCard.Portal;
-var HoverCardContent = (0, import_react40.forwardRef)(
+var HoverCardContent = (0, import_react41.forwardRef)(
   function HoverCardContent2({ className, sideOffset = 4, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(RadixHoverCard.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(RadixHoverCard.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
       RadixHoverCard.Content,
       {
         ref,
@@ -2181,25 +2369,25 @@ var HoverCardContent = (0, import_react40.forwardRef)(
 );
 HoverCardContent.displayName = "HoverCardContent";
 function HoverCard({ trigger, content, ...rootProps }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(RadixHoverCard.Root, { openDelay: 200, closeDelay: 120, ...rootProps, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(RadixHoverCard.Trigger, { asChild: true, children: trigger }),
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(HoverCardContent, { children: content })
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(RadixHoverCard.Root, { openDelay: 200, closeDelay: 120, ...rootProps, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(RadixHoverCard.Trigger, { asChild: true, children: trigger }),
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(HoverCardContent, { children: content })
   ] });
 }
 
 // src/components/Popover/Popover.tsx
 var RadixPopover = __toESM(require("@radix-ui/react-popover"), 1);
-var import_react41 = require("react");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_react42 = require("react");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var PopoverRoot = RadixPopover.Root;
 var PopoverTrigger = RadixPopover.Trigger;
 var PopoverAnchor = RadixPopover.Anchor;
 var PopoverPortal = RadixPopover.Portal;
 var PopoverClose = RadixPopover.Close;
 var PopoverArrow = RadixPopover.Arrow;
-var PopoverContent = (0, import_react41.forwardRef)(
+var PopoverContent = (0, import_react42.forwardRef)(
   function PopoverContent2({ className, align = "start", sideOffset = 6, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(RadixPopover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RadixPopover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
       RadixPopover.Content,
       {
         ref,
@@ -2220,9 +2408,9 @@ var Popover = RadixPopover.Root;
 
 // src/components/Toast/Toast.tsx
 var RadixToast = __toESM(require("@radix-ui/react-toast"), 1);
-var import_react42 = require("react");
-var import_jsx_runtime35 = require("react/jsx-runtime");
-var ToastContext = (0, import_react42.createContext)(null);
+var import_react43 = require("react");
+var import_jsx_runtime36 = require("react/jsx-runtime");
+var ToastContext = (0, import_react43.createContext)(null);
 var variantIcon = {
   default: "\u25CF",
   info: "\u2139",
@@ -2247,8 +2435,8 @@ var variantBorderLeft = {
 var toastIdCounter = 0;
 var nextToastId = () => `toast-${++toastIdCounter}`;
 function ToastProvider({ children }) {
-  const [toasts, setToasts] = (0, import_react42.useState)([]);
-  const toast = (0, import_react42.useCallback)((t) => {
+  const [toasts, setToasts] = (0, import_react43.useState)([]);
+  const toast = (0, import_react43.useCallback)((t) => {
     const explicitId = t.id;
     const id = explicitId ?? nextToastId();
     const entry = { ...t, id };
@@ -2260,24 +2448,24 @@ function ToastProvider({ children }) {
     });
     return id;
   }, []);
-  const dismiss = (0, import_react42.useCallback)((id) => {
+  const dismiss = (0, import_react43.useCallback)((id) => {
     setToasts((prev) => prev.filter((t) => t.id !== id));
   }, []);
-  const value = (0, import_react42.useMemo)(() => ({ toast, dismiss }), [toast, dismiss]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(ToastContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(RadixToast.Provider, { swipeDirection: "right", children: [
+  const value = (0, import_react43.useMemo)(() => ({ toast, dismiss }), [toast, dismiss]);
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ToastContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(RadixToast.Provider, { swipeDirection: "right", children: [
     children,
-    toasts.map((t) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(ToastCard, { toast: t, onDismiss: () => dismiss(t.id) }, t.id)),
-    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RadixToast.Viewport, { className: "z-toast fixed right-5 bottom-5 flex w-[380px] max-w-[calc(100vw-40px)] flex-col gap-2 outline-none" })
+    toasts.map((t) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ToastCard, { toast: t, onDismiss: () => dismiss(t.id) }, t.id)),
+    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(RadixToast.Viewport, { className: "z-toast fixed right-5 bottom-5 flex w-[380px] max-w-[calc(100vw-40px)] flex-col gap-2 outline-none" })
   ] }) });
 }
 function useToast() {
-  const ctx = (0, import_react42.useContext)(ToastContext);
+  const ctx = (0, import_react43.useContext)(ToastContext);
   if (!ctx) throw new Error("useToast must be inside <ToastProvider>");
   return ctx;
 }
-var ToastCard = (0, import_react42.forwardRef)(function ToastCard2({ toast, onDismiss }, ref) {
+var ToastCard = (0, import_react43.forwardRef)(function ToastCard2({ toast, onDismiss }, ref) {
   const variant = toast.variant ?? "default";
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
     RadixToast.Root,
     {
       ref,
@@ -2292,13 +2480,13 @@ var ToastCard = (0, import_react42.forwardRef)(function ToastCard2({ toast, onDi
         variantBorderLeft[variant]
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: cn("mt-px text-[14px] leading-none", variantTextColor[variant]), children: variantIcon[variant] }),
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RadixToast.Title, { className: "text-text text-[13px] font-medium", children: toast.title }),
-          toast.description && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RadixToast.Description, { className: "text-text-muted mt-[2px] text-[12px] leading-[1.5]", children: toast.description }),
-          toast.action && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "mt-2", children: toast.action })
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: cn("mt-px text-[14px] leading-none", variantTextColor[variant]), children: variantIcon[variant] }),
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(RadixToast.Title, { className: "text-text text-[13px] font-medium", children: toast.title }),
+          toast.description && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(RadixToast.Description, { className: "text-text-muted mt-[2px] text-[12px] leading-[1.5]", children: toast.description }),
+          toast.action && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "mt-2", children: toast.action })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
           RadixToast.Close,
           {
             "aria-label": "Dismiss",
@@ -2314,16 +2502,16 @@ ToastCard.displayName = "ToastCard";
 
 // src/components/Tooltip/Tooltip.tsx
 var RadixTooltip = __toESM(require("@radix-ui/react-tooltip"), 1);
-var import_react43 = require("react");
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_react44 = require("react");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var TooltipProvider = RadixTooltip.Provider;
 var Tooltip = RadixTooltip.Root;
 var TooltipTrigger = RadixTooltip.Trigger;
 var TooltipPortal = RadixTooltip.Portal;
 var TooltipArrow = RadixTooltip.Arrow;
-var TooltipContent = (0, import_react43.forwardRef)(
+var TooltipContent = (0, import_react44.forwardRef)(
   function TooltipContent2({ className, sideOffset = 6, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(RadixTooltip.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(RadixTooltip.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
       RadixTooltip.Content,
       {
         ref,
@@ -2346,17 +2534,17 @@ function SimpleTooltip({
   side = "top",
   delayDuration = 400
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(TooltipProvider, { delayDuration, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(Tooltip, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(TooltipTrigger, { asChild: true, children }),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(TooltipContent, { side, children: content })
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(TooltipProvider, { delayDuration, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(Tooltip, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(TooltipTrigger, { asChild: true, children }),
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(TooltipContent, { side, children: content })
   ] }) });
 }
 
 // src/patterns/Alert/Alert.tsx
-var import_class_variance_authority8 = require("class-variance-authority");
-var import_react44 = require("react");
-var import_jsx_runtime37 = require("react/jsx-runtime");
-var alertStyles = (0, import_class_variance_authority8.cva)("flex items-start gap-3 rounded-base border bg-panel p-3 text-[13px]", {
+var import_class_variance_authority9 = require("class-variance-authority");
+var import_react45 = require("react");
+var import_jsx_runtime38 = require("react/jsx-runtime");
+var alertStyles = (0, import_class_variance_authority9.cva)("flex items-start gap-3 rounded-base border bg-panel p-3 text-[13px]", {
   variants: {
     tone: {
       accent: "border-border border-l-2 border-l-accent",
@@ -2379,7 +2567,7 @@ var defaultGlyph = {
   warn: "!",
   err: "\xD7"
 };
-var Alert = (0, import_react44.forwardRef)(function Alert2({
+var Alert = (0, import_react45.forwardRef)(function Alert2({
   tone = "accent",
   title,
   description,
@@ -2391,7 +2579,7 @@ var Alert = (0, import_react44.forwardRef)(function Alert2({
   ...props
 }, ref) {
   const t = tone ?? "accent";
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
     "div",
     {
       ref,
@@ -2400,13 +2588,13 @@ var Alert = (0, import_react44.forwardRef)(function Alert2({
       className: cn(alertStyles({ tone }), className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { "aria-hidden": true, className: cn("mt-[1px] text-[14px] leading-none", iconColorClass[t]), children: icon ?? defaultGlyph[t] }),
-        /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "min-w-0 flex-1", children: [
-          title && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "font-medium", children: title }),
-          description && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "text-text-muted mt-[2px] text-[12px]", children: description }),
+        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { "aria-hidden": true, className: cn("mt-[1px] text-[14px] leading-none", iconColorClass[t]), children: icon ?? defaultGlyph[t] }),
+        /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "min-w-0 flex-1", children: [
+          title && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "font-medium", children: title }),
+          description && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "text-text-muted mt-[2px] text-[12px]", children: description }),
           children
         ] }),
-        action && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "ml-1 shrink-0", children: action })
+        action && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "ml-1 shrink-0", children: action })
       ]
     }
   );
@@ -2414,10 +2602,10 @@ var Alert = (0, import_react44.forwardRef)(function Alert2({
 Alert.displayName = "Alert";
 
 // src/patterns/Banner/Banner.tsx
-var import_class_variance_authority9 = require("class-variance-authority");
-var import_react45 = require("react");
-var import_jsx_runtime38 = require("react/jsx-runtime");
-var bannerStyles = (0, import_class_variance_authority9.cva)(
+var import_class_variance_authority10 = require("class-variance-authority");
+var import_react46 = require("react");
+var import_jsx_runtime39 = require("react/jsx-runtime");
+var bannerStyles = (0, import_class_variance_authority10.cva)(
   "flex items-center gap-3 border-b border-border px-[14px] py-2 text-[12px]",
   {
     variants: {
@@ -2441,9 +2629,9 @@ var defaultGlyph2 = {
   warn: "!",
   err: "\xD7"
 };
-var Banner = (0, import_react45.forwardRef)(function Banner2({ tone = "accent", sticky, icon, action, live = "polite", className, children, ...props }, ref) {
+var Banner = (0, import_react46.forwardRef)(function Banner2({ tone = "accent", sticky, icon, action, live = "polite", className, children, ...props }, ref) {
   const t = tone ?? "accent";
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
     "div",
     {
       ref,
@@ -2452,9 +2640,9 @@ var Banner = (0, import_react45.forwardRef)(function Banner2({ tone = "accent",
       className: cn(bannerStyles({ tone, sticky }), className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { "aria-hidden": true, className: "leading-none", children: icon ?? defaultGlyph2[t] }),
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "min-w-0 flex-1", children }),
-        action && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "ml-auto", children: action })
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { "aria-hidden": true, className: "leading-none", children: icon ?? defaultGlyph2[t] }),
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "min-w-0 flex-1", children }),
+        action && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "ml-auto", children: action })
       ]
     }
   );
@@ -2462,28 +2650,28 @@ var Banner = (0, import_react45.forwardRef)(function Banner2({ tone = "accent",
 Banner.displayName = "Banner";
 
 // src/patterns/Breadcrumbs/Breadcrumbs.tsx
-var import_react46 = require("react");
-var import_jsx_runtime39 = require("react/jsx-runtime");
-var Breadcrumbs = (0, import_react46.forwardRef)(function Breadcrumbs2({ separator = "/", className, children, ...props }, ref) {
-  const crumbs = import_react46.Children.toArray(children).filter(import_react46.isValidElement);
+var import_react47 = require("react");
+var import_jsx_runtime40 = require("react/jsx-runtime");
+var Breadcrumbs = (0, import_react47.forwardRef)(function Breadcrumbs2({ separator = "/", className, children, ...props }, ref) {
+  const crumbs = import_react47.Children.toArray(children).filter(import_react47.isValidElement);
   const last = crumbs.length - 1;
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("nav", { ref, "aria-label": "Breadcrumb", className: cn("text-[13px]", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("ol", { className: "text-text-muted flex flex-wrap items-center gap-[6px]", children: crumbs.map((crumb, i) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("nav", { ref, "aria-label": "Breadcrumb", className: cn("text-[13px]", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("ol", { className: "text-text-muted flex flex-wrap items-center gap-[6px]", children: crumbs.map((crumb, i) => {
     const isCurrent = i === last;
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("li", { className: "inline-flex items-center gap-[6px]", children: [
-      isCurrent ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Crumb, { ...crumb.props, current: true }) : crumb,
-      !isCurrent && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { "aria-hidden": true, className: "text-text-dim", children: separator })
+    return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("li", { className: "inline-flex items-center gap-[6px]", children: [
+      isCurrent ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Crumb, { ...crumb.props, current: true }) : crumb,
+      !isCurrent && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { "aria-hidden": true, className: "text-text-dim", children: separator })
     ] }, i);
   }) }) });
 });
 Breadcrumbs.displayName = "Breadcrumbs";
-var Crumb = (0, import_react46.forwardRef)(function Crumb2({ current, className, href, children, ...props }, ref) {
+var Crumb = (0, import_react47.forwardRef)(function Crumb2({ current, className, href, children, ...props }, ref) {
   if (current) {
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { "aria-current": "page", className: cn("text-text", className), children });
+    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { "aria-current": "page", className: cn("text-text", className), children });
   }
   if (href === void 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: cn("text-text-dim", className), children });
+    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: cn("text-text-dim", className), children });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
     "a",
     {
       ref,
@@ -2497,8 +2685,8 @@ var Crumb = (0, import_react46.forwardRef)(function Crumb2({ current, className,
 Crumb.displayName = "Crumb";
 
 // src/patterns/Combobox/Combobox.tsx
-var import_react47 = require("react");
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_react48 = require("react");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 function normalize(option) {
   if (typeof option === "string") {
     return { value: option, label: option, searchText: option.toLowerCase() };
@@ -2514,7 +2702,7 @@ function normalize(option) {
   };
 }
 var defaultFilter = (option, query) => option.searchText.includes(query.toLowerCase());
-var Combobox = (0, import_react47.forwardRef)(function Combobox2({
+var Combobox = (0, import_react48.forwardRef)(function Combobox2({
   options,
   value: valueProp,
   defaultValue,
@@ -2531,16 +2719,16 @@ var Combobox = (0, import_react47.forwardRef)(function Combobox2({
   id,
   "aria-label": ariaLabel
 }, ref) {
-  const reactId = (0, import_react47.useId)();
+  const reactId = (0, import_react48.useId)();
   const listboxId = `${id ?? reactId}-listbox`;
   const inputId = id ?? `${reactId}-input`;
-  const normalized = (0, import_react47.useMemo)(() => options.map(normalize), [options]);
+  const normalized = (0, import_react48.useMemo)(() => options.map(normalize), [options]);
   const [value, setValue] = useControllableState({
     value: valueProp,
     defaultValue,
     onChange: onValueChange
   });
-  const initialQuery = (0, import_react47.useMemo)(() => {
+  const initialQuery = (0, import_react48.useMemo)(() => {
     if (defaultQuery !== void 0) return defaultQuery;
     if (defaultValue !== void 0) {
       const opt = normalized.find((o) => o.value === defaultValue);
@@ -2553,10 +2741,10 @@ var Combobox = (0, import_react47.forwardRef)(function Combobox2({
     defaultValue: initialQuery,
     onChange: onQueryChange
   });
-  const [open, setOpen] = (0, import_react47.useState)(false);
-  const wrapperRef = (0, import_react47.useRef)(null);
+  const [open, setOpen] = (0, import_react48.useState)(false);
+  const wrapperRef = (0, import_react48.useRef)(null);
   useOutsideClick(wrapperRef, () => setOpen(false));
-  const filtered = (0, import_react47.useMemo)(
+  const filtered = (0, import_react48.useMemo)(
     () => query ? normalized.filter((o) => filter(o, query)) : normalized,
     [normalized, query, filter]
   );
@@ -2568,7 +2756,7 @@ var Combobox = (0, import_react47.forwardRef)(function Combobox2({
       if (item && !item.disabled) commit(item);
     }
   });
-  (0, import_react47.useEffect)(() => {
+  (0, import_react48.useEffect)(() => {
     setCursor(0);
   }, [query, setCursor]);
   function commit(option) {
@@ -2591,8 +2779,8 @@ var Combobox = (0, import_react47.forwardRef)(function Combobox2({
       setOpen(false);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { ref: wrapperRef, className: "relative", style: { width }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { ref: wrapperRef, className: "relative", style: { width }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
       "input",
       {
         ref,
@@ -2626,7 +2814,7 @@ var Combobox = (0, import_react47.forwardRef)(function Combobox2({
         )
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
       "ul",
       {
         id: listboxId,
@@ -2636,9 +2824,9 @@ var Combobox = (0, import_react47.forwardRef)(function Combobox2({
           "z-dropdown absolute top-full right-0 left-0 mt-1 max-h-[220px] overflow-auto",
           "border-border bg-panel rounded-md border p-1 shadow-lg"
         ),
-        children: filtered.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("li", { className: "text-text-dim px-2 py-3 text-center text-[12px]", role: "presentation", children: emptyState ?? "No matches" }) : filtered.map((option, i) => {
+        children: filtered.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("li", { className: "text-text-dim px-2 py-3 text-center text-[12px]", role: "presentation", children: emptyState ?? "No matches" }) : filtered.map((option, i) => {
           const isActive = i === cursor;
-          return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+          return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
             "li",
             {
               id: `${listboxId}-option-${i}`,
@@ -2656,8 +2844,8 @@ var Combobox = (0, import_react47.forwardRef)(function Combobox2({
                 option.disabled && "pointer-events-none opacity-40"
               ),
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { children: option.label }),
-                option.description && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "text-text-dim text-[11px]", children: option.description })
+                /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { children: option.label }),
+                option.description && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "text-text-dim text-[11px]", children: option.description })
               ]
             },
             option.value
@@ -2665,19 +2853,19 @@ var Combobox = (0, import_react47.forwardRef)(function Combobox2({
         })
       }
     ),
-    name && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("input", { type: "hidden", name, value: value ?? "", readOnly: true })
+    name && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("input", { type: "hidden", name, value: value ?? "", readOnly: true })
   ] });
 });
 Combobox.displayName = "Combobox";
 
 // src/patterns/CommandPalette/CommandPalette.tsx
 var RadixDialog4 = __toESM(require("@radix-ui/react-dialog"), 1);
-var import_react48 = require("react");
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_react49 = require("react");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 function flatItems(groups) {
   return groups.flatMap((g) => g.items);
 }
-var CommandPalette = (0, import_react48.forwardRef)(
+var CommandPalette = (0, import_react49.forwardRef)(
   function CommandPalette2({
     open,
     onOpenChange,
@@ -2690,7 +2878,7 @@ var CommandPalette = (0, import_react48.forwardRef)(
     emptyState,
     width = 540
   }, ref) {
-    const flat = (0, import_react48.useMemo)(() => flatItems(groups), [groups]);
+    const flat = (0, import_react49.useMemo)(() => flatItems(groups), [groups]);
     const { cursor, setCursor, onKeyDown } = useKeyboardList({
       count: flat.length,
       defaultCursor: 0,
@@ -2699,15 +2887,15 @@ var CommandPalette = (0, import_react48.forwardRef)(
         if (item) onSelect(item.id);
       }
     });
-    const reactId = (0, import_react48.useId)();
+    const reactId = (0, import_react49.useId)();
     const listboxId = `${reactId}-listbox`;
     const optionId = (i) => `${listboxId}-option-${i}`;
     const hasMatches = flat.length > 0;
-    (0, import_react48.useEffect)(() => {
+    (0, import_react49.useEffect)(() => {
       setCursor(0);
     }, [query, groups, setCursor]);
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(RadixDialog4.Root, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(RadixDialog4.Portal, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(RadixDialog4.Root, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(RadixDialog4.Portal, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
         RadixDialog4.Overlay,
         {
           className: cn(
@@ -2716,7 +2904,7 @@ var CommandPalette = (0, import_react48.forwardRef)(
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
         RadixDialog4.Content,
         {
           ref,
@@ -2730,10 +2918,10 @@ var CommandPalette = (0, import_react48.forwardRef)(
           ),
           onKeyDown,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(RadixDialog4.Title, { className: "sr-only", children: "Command palette" }),
-            /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "border-border flex items-center gap-[10px] border-b px-4 py-[14px]", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { "aria-hidden": true, className: "text-text-dim", children: "\u2315" }),
-              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(RadixDialog4.Title, { className: "sr-only", children: "Command palette" }),
+            /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "border-border flex items-center gap-[10px] border-b px-4 py-[14px]", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { "aria-hidden": true, className: "text-text-dim", children: "\u2315" }),
+              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
                 "input",
                 {
                   autoFocus: true,
@@ -2750,9 +2938,9 @@ var CommandPalette = (0, import_react48.forwardRef)(
                   className: "text-text placeholder:text-text-dim flex-1 border-0 bg-transparent text-[14px] outline-none"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "border-border text-text-dim rounded-xs border px-[6px] py-[2px] font-mono text-[10px]", children: "ESC" })
+              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "border-border text-text-dim rounded-xs border px-[6px] py-[2px] font-mono text-[10px]", children: "ESC" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { id: listboxId, className: "min-h-[220px] p-2", role: "listbox", "aria-label": "Results", children: flat.length === 0 ? emptyState ?? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "text-text-dim px-3 py-5 text-center text-[12px]", children: "No matches" }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { id: listboxId, className: "min-h-[220px] p-2", role: "listbox", "aria-label": "Results", children: flat.length === 0 ? emptyState ?? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "text-text-dim px-3 py-5 text-center text-[12px]", children: "No matches" }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
               CommandGroups,
               {
                 groups,
@@ -2762,7 +2950,7 @@ var CommandPalette = (0, import_react48.forwardRef)(
                 optionId
               }
             ) }),
-            footer && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "border-border text-text-dim flex gap-4 border-t px-[14px] py-[10px] font-mono text-[10px]", children: footer })
+            footer && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "border-border text-text-dim flex gap-4 border-t px-[14px] py-[10px] font-mono text-[10px]", children: footer })
           ]
         }
       )
@@ -2772,10 +2960,10 @@ var CommandPalette = (0, import_react48.forwardRef)(
 CommandPalette.displayName = "CommandPalette";
 function CommandGroups({ groups, cursor, setCursor, onSelect, optionId }) {
   let runningIndex = 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: groups.map((group, gIdx) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_jsx_runtime42.Fragment, { children: groups.map((group, gIdx) => {
     if (group.items.length === 0) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { children: [
-      group.label && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "text-text-dim px-2 pt-2 pb-1 font-mono text-[9px] tracking-[1.4px] uppercase", children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { children: [
+      group.label && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "text-text-dim px-2 pt-2 pb-1 font-mono text-[9px] tracking-[1.4px] uppercase", children: [
         group.label,
         " \xB7 ",
         group.items.length
@@ -2783,7 +2971,7 @@ function CommandGroups({ groups, cursor, setCursor, onSelect, optionId }) {
       group.items.map((item) => {
         const myIndex = runningIndex++;
         const isActive = cursor === myIndex;
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
           "button",
           {
             id: optionId(myIndex),
@@ -2797,7 +2985,7 @@ function CommandGroups({ groups, cursor, setCursor, onSelect, optionId }) {
               isActive ? "bg-accent-dim text-accent" : "text-text hover:bg-panel-2"
             ),
             children: [
-              item.glyph != null && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+              item.glyph != null && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
                 "span",
                 {
                   "aria-hidden": true,
@@ -2808,11 +2996,11 @@ function CommandGroups({ groups, cursor, setCursor, onSelect, optionId }) {
                   children: item.glyph
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("span", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "block truncate text-[13px]", children: item.label }),
-                item.description && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "text-text-dim block truncate text-[11px]", children: item.description })
+              /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("span", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "block truncate text-[13px]", children: item.label }),
+                item.description && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "text-text-dim block truncate text-[11px]", children: item.description })
               ] }),
-              item.trailing && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "text-text-dim font-mono text-[10px]", children: item.trailing })
+              item.trailing && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "text-text-dim font-mono text-[10px]", children: item.trailing })
             ]
           },
           item.id
@@ -2834,8 +3022,8 @@ function filterCommandItems(query, groups) {
 }
 
 // src/patterns/DataTable/DataTable.tsx
-var import_react49 = require("react");
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_react50 = require("react");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 var alignClass = {
   left: "text-left",
   right: "text-right",
@@ -2870,12 +3058,12 @@ function DataTable(props) {
     defaultValue: new Set(defaultSelected ?? []),
     onChange: onSelectionChange
   });
-  const sortableMap = (0, import_react49.useMemo)(() => {
+  const sortableMap = (0, import_react50.useMemo)(() => {
     const m = /* @__PURE__ */ new Map();
     for (const c of columns) if (c.accessor) m.set(c.key, c);
     return m;
   }, [columns]);
-  const sortedData = (0, import_react49.useMemo)(() => {
+  const sortedData = (0, import_react50.useMemo)(() => {
     if (!sort) return [...data];
     const col = sortableMap.get(sort.key);
     if (!col || !col.accessor) return [...data];
@@ -2887,12 +3075,12 @@ function DataTable(props) {
       return String(av).localeCompare(String(bv)) * factor;
     });
   }, [data, sort, sortableMap]);
-  const allIds = (0, import_react49.useMemo)(() => sortedData.map(rowKey), [sortedData, rowKey]);
+  const allIds = (0, import_react50.useMemo)(() => sortedData.map(rowKey), [sortedData, rowKey]);
   const selectedSet = selected ?? EMPTY_SET;
   const allSelected = allIds.length > 0 && allIds.every((id) => selectedSet.has(id));
   const someSelected = !allSelected && allIds.some((id) => selectedSet.has(id));
-  const headerCheckRef = (0, import_react49.useRef)(null);
-  (0, import_react49.useEffect)(() => {
+  const headerCheckRef = (0, import_react50.useRef)(null);
+  (0, import_react50.useEffect)(() => {
     if (headerCheckRef.current) headerCheckRef.current.indeterminate = someSelected;
   }, [someSelected]);
   const toggleSort = (key) => {
@@ -2923,10 +3111,10 @@ function DataTable(props) {
       return next;
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("table", { ref, className: cn("w-full border-collapse text-[12px]", className), children: [
-    caption && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("caption", { className: "sr-only", children: caption }),
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("thead", { className: cn("bg-panel-2", stickyHeader && "z-raised sticky top-0"), children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("tr", { children: [
-      selectable && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("th", { scope: "col", className: "border-border w-8 border-b px-3 py-2 text-left", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("table", { ref, className: cn("w-full border-collapse text-[12px]", className), children: [
+    caption && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("caption", { className: "sr-only", children: caption }),
+    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("thead", { className: cn("bg-panel-2", stickyHeader && "z-raised sticky top-0"), children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("tr", { children: [
+      selectable && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("th", { scope: "col", className: "border-border w-8 border-b px-3 py-2 text-left", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
         "input",
         {
           ref: headerCheckRef,
@@ -2942,8 +3130,8 @@ function DataTable(props) {
         const isSorted = sort?.key === col.key;
         const ariaSort = !sortable ? void 0 : isSorted ? sort?.direction === "asc" ? "ascending" : "descending" : "none";
         const align = col.align ?? "left";
-        const indicator = sortable && isSorted && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { "aria-hidden": true, className: "ml-1", children: sort?.direction === "asc" ? "\u2191" : "\u2193" });
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+        const indicator = sortable && isSorted && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { "aria-hidden": true, className: "ml-1", children: sort?.direction === "asc" ? "\u2191" : "\u2193" });
+        return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           "th",
           {
             scope: "col",
@@ -2955,7 +3143,7 @@ function DataTable(props) {
               sortable && "cursor-pointer",
               isSorted ? "text-accent" : "text-text-dim"
             ),
-            children: sortable ? /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+            children: sortable ? /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
               "button",
               {
                 type: "button",
@@ -2972,8 +3160,8 @@ function DataTable(props) {
         );
       })
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("tbody", { children: [
-      sortedData.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("tbody", { children: [
+      sortedData.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
         "td",
         {
           colSpan: columns.length + (selectable ? 1 : 0),
@@ -2984,7 +3172,7 @@ function DataTable(props) {
       sortedData.map((row) => {
         const id = rowKey(row);
         const isSelected = selectedSet.has(id);
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
           "tr",
           {
             "data-state": isSelected ? "selected" : void 0,
@@ -2993,7 +3181,7 @@ function DataTable(props) {
               isSelected ? "bg-accent-dim/50" : "hover:bg-panel-2"
             ),
             children: [
-              selectable && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("td", { className: "px-3 py-[10px]", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              selectable && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("td", { className: "px-3 py-[10px]", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                 "input",
                 {
                   type: "checkbox",
@@ -3003,7 +3191,7 @@ function DataTable(props) {
                   className: "cursor-pointer accent-[var(--color-accent)]"
                 }
               ) }),
-              columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("td", { className: cn("px-3 py-[10px]", alignClass[col.align ?? "left"]), children: col.cell ? col.cell(row) : col.accessor ? String(col.accessor(row)) : null }, col.key))
+              columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("td", { className: cn("px-3 py-[10px]", alignClass[col.align ?? "left"]), children: col.cell ? col.cell(row) : col.accessor ? String(col.accessor(row)) : null }, col.key))
             ]
           },
           id
@@ -3014,8 +3202,8 @@ function DataTable(props) {
 }
 
 // src/patterns/DatePicker/Calendar.tsx
-var import_react50 = require("react");
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_react51 = require("react");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 var MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
 var DAYS = ["S", "M", "T", "W", "T", "F", "S"];
 function isSameDay(a, b) {
@@ -3026,7 +3214,7 @@ function clampDay(year, month, day) {
   const max = new Date(year, month + 1, 0).getDate();
   return Math.min(Math.max(1, day), max);
 }
-var Calendar = (0, import_react50.forwardRef)(function Calendar2({
+var Calendar = (0, import_react51.forwardRef)(function Calendar2({
   value,
   defaultValue,
   onValueChange,
@@ -3039,9 +3227,9 @@ var Calendar = (0, import_react50.forwardRef)(function Calendar2({
   className,
   ...props
 }, ref) {
-  const [today] = (0, import_react50.useState)(() => /* @__PURE__ */ new Date());
-  const [hydrated, setHydrated] = (0, import_react50.useState)(false);
-  (0, import_react50.useEffect)(() => setHydrated(true), []);
+  const [today] = (0, import_react51.useState)(() => /* @__PURE__ */ new Date());
+  const [hydrated, setHydrated] = (0, import_react51.useState)(false);
+  (0, import_react51.useEffect)(() => setHydrated(true), []);
   const [selectedDate, setSelectedDate] = useControllableState({
     value,
     defaultValue,
@@ -3049,12 +3237,12 @@ var Calendar = (0, import_react50.forwardRef)(function Calendar2({
   });
   const initialMonth = defaultMonth ?? defaultValue?.getMonth() ?? today.getMonth();
   const initialYear = defaultYear ?? defaultValue?.getFullYear() ?? today.getFullYear();
-  const [internalMonth, setInternalMonth] = (0, import_react50.useState)(initialMonth);
-  const [internalYear, setInternalYear] = (0, import_react50.useState)(initialYear);
+  const [internalMonth, setInternalMonth] = (0, import_react51.useState)(initialMonth);
+  const [internalYear, setInternalYear] = (0, import_react51.useState)(initialYear);
   const month = monthProp ?? internalMonth;
   const year = yearProp ?? internalYear;
   const isControlled = monthProp !== void 0 && yearProp !== void 0;
-  const setVisible = (0, import_react50.useCallback)(
+  const setVisible = (0, import_react51.useCallback)(
     (m, y) => {
       if (!isControlled) {
         setInternalMonth(m);
@@ -3064,36 +3252,36 @@ var Calendar = (0, import_react50.forwardRef)(function Calendar2({
     },
     [isControlled, onVisibleMonthChange]
   );
-  const goPrev = (0, import_react50.useCallback)(() => {
+  const goPrev = (0, import_react51.useCallback)(() => {
     const m = month === 0 ? 11 : month - 1;
     const y = month === 0 ? year - 1 : year;
     setVisible(m, y);
   }, [month, year, setVisible]);
-  const goNext = (0, import_react50.useCallback)(() => {
+  const goNext = (0, import_react51.useCallback)(() => {
     const m = month === 11 ? 0 : month + 1;
     const y = month === 11 ? year + 1 : year;
     setVisible(m, y);
   }, [month, year, setVisible]);
   const daysInMonth = new Date(year, month + 1, 0).getDate();
   const firstDayOfMonth = new Date(year, month, 1).getDay();
-  const [focusedDate, setFocusedDate] = (0, import_react50.useState)(() => {
+  const [focusedDate, setFocusedDate] = (0, import_react51.useState)(() => {
     if (selectedDate) return selectedDate;
     return new Date(initialYear, initialMonth, 1);
   });
-  (0, import_react50.useEffect)(() => {
+  (0, import_react51.useEffect)(() => {
     if (selectedDate) setFocusedDate(selectedDate);
   }, [selectedDate]);
   const focusedInVisibleMonth = focusedDate.getMonth() === month && focusedDate.getFullYear() === year;
   const effectiveFocusDay = focusedInVisibleMonth ? focusedDate.getDate() : clampDay(year, month, focusedDate.getDate());
-  const dayRefs = (0, import_react50.useRef)(/* @__PURE__ */ new Map());
-  const shouldFocusRef = (0, import_react50.useRef)(false);
-  (0, import_react50.useEffect)(() => {
+  const dayRefs = (0, import_react51.useRef)(/* @__PURE__ */ new Map());
+  const shouldFocusRef = (0, import_react51.useRef)(false);
+  (0, import_react51.useEffect)(() => {
     if (!shouldFocusRef.current) return;
     shouldFocusRef.current = false;
     const node = dayRefs.current.get(effectiveFocusDay);
     node?.focus();
   }, [effectiveFocusDay, month, year]);
-  const moveFocus = (0, import_react50.useCallback)(
+  const moveFocus = (0, import_react51.useCallback)(
     (next) => {
       setFocusedDate(next);
       shouldFocusRef.current = true;
@@ -3105,7 +3293,7 @@ var Calendar = (0, import_react50.forwardRef)(function Calendar2({
     },
     [month, year, setVisible]
   );
-  const onCellKeyDown = (0, import_react50.useCallback)(
+  const onCellKeyDown = (0, import_react51.useCallback)(
     (e, day) => {
       const current = new Date(year, month, day);
       let next = null;
@@ -3157,7 +3345,7 @@ var Calendar = (0, import_react50.forwardRef)(function Calendar2({
     },
     [month, year, moveFocus]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
     "div",
     {
       ref,
@@ -3169,14 +3357,14 @@ var Calendar = (0, import_react50.forwardRef)(function Calendar2({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "mb-3 flex items-center justify-between", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("span", { className: "text-[13px] font-medium", "aria-live": "polite", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "mb-3 flex items-center justify-between", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("span", { className: "text-[13px] font-medium", "aria-live": "polite", children: [
             MONTHS[month],
             " ",
             year
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex gap-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex gap-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
               IconButton,
               {
                 size: "sm",
@@ -3186,11 +3374,11 @@ var Calendar = (0, import_react50.forwardRef)(function Calendar2({
                 onClick: goPrev
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(IconButton, { size: "sm", variant: "ghost", icon: "\u203A", "aria-label": "Next month", onClick: goNext })
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(IconButton, { size: "sm", variant: "ghost", icon: "\u203A", "aria-label": "Next month", onClick: goNext })
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { role: "grid", "aria-label": `${MONTHS[month]} ${year}`, className: "flex flex-col gap-[2px]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { role: "row", className: "grid grid-cols-7 gap-[2px]", children: DAYS.map((d, i) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { role: "grid", "aria-label": `${MONTHS[month]} ${year}`, className: "flex flex-col gap-[2px]", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { role: "row", className: "grid grid-cols-7 gap-[2px]", children: DAYS.map((d, i) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
             "div",
             {
               role: "columnheader",
@@ -3210,7 +3398,7 @@ var Calendar = (0, import_react50.forwardRef)(function Calendar2({
                 const cellIndex = r * 7 + c;
                 const dayNum = cellIndex - firstDayOfMonth + 1;
                 if (dayNum < 1 || dayNum > daysInMonth) {
-                  cells.push(/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { role: "gridcell", "aria-hidden": true }, `pad-${r}-${c}`));
+                  cells.push(/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { role: "gridcell", "aria-hidden": true }, `pad-${r}-${c}`));
                   continue;
                 }
                 const date = new Date(year, month, dayNum);
@@ -3220,7 +3408,7 @@ var Calendar = (0, import_react50.forwardRef)(function Calendar2({
                 const isFocused = dayNum === effectiveFocusDay;
                 const day = dayNum;
                 cells.push(
-                  /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { role: "gridcell", "aria-selected": isSelected, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { role: "gridcell", "aria-selected": isSelected, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
                     "button",
                     {
                       ref: (node) => {
@@ -3251,7 +3439,7 @@ var Calendar = (0, import_react50.forwardRef)(function Calendar2({
                 );
               }
               rows.push(
-                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { role: "row", className: "grid grid-cols-7 gap-[2px]", children: cells }, `row-${r}`)
+                /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { role: "row", className: "grid grid-cols-7 gap-[2px]", children: cells }, `row-${r}`)
               );
             }
             return rows;
@@ -3265,10 +3453,10 @@ Calendar.displayName = "Calendar";
 
 // src/patterns/DatePicker/DatePicker.tsx
 var RadixPopover2 = __toESM(require("@radix-ui/react-popover"), 1);
-var import_react51 = require("react");
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_react52 = require("react");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var defaultFormat = (d) => d.toLocaleDateString();
-var DatePicker = (0, import_react51.forwardRef)(function DatePicker2({
+var DatePicker = (0, import_react52.forwardRef)(function DatePicker2({
   value: valueProp,
   defaultValue,
   onValueChange,
@@ -3282,14 +3470,14 @@ var DatePicker = (0, import_react51.forwardRef)(function DatePicker2({
   id,
   name
 }, ref) {
-  const [open, setOpen] = (0, import_react51.useState)(false);
+  const [open, setOpen] = (0, import_react52.useState)(false);
   const [value, setValue] = useControllableState({
     value: valueProp,
     defaultValue,
     onChange: onValueChange
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(RadixPopover2.Root, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(RadixPopover2.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(RadixPopover2.Root, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(RadixPopover2.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
       "button",
       {
         ref,
@@ -3306,18 +3494,18 @@ var DatePicker = (0, import_react51.forwardRef)(function DatePicker2({
         ),
         style: { width },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { "aria-hidden": true, className: "text-text-dim", children: "\u25A2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: cn("flex-1 truncate", !value && "text-text-dim"), children: value ? format(value) : emptyLabel ?? placeholder })
+          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { "aria-hidden": true, className: "text-text-dim", children: "\u25A2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: cn("flex-1 truncate", !value && "text-text-dim"), children: value ? format(value) : emptyLabel ?? placeholder })
         ]
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(RadixPopover2.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(RadixPopover2.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
       RadixPopover2.Content,
       {
         align: "start",
         sideOffset: 6,
         className: "z-popover outline-none data-[state=open]:animate-[ship-pop-in_140ms_var(--easing-out)]",
-        children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
           Calendar,
           {
             value,
@@ -3332,17 +3520,17 @@ var DatePicker = (0, import_react51.forwardRef)(function DatePicker2({
         )
       }
     ) }),
-    name && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("input", { type: "hidden", name, value: value ? value.toISOString() : "", readOnly: true })
+    name && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("input", { type: "hidden", name, value: value ? value.toISOString() : "", readOnly: true })
   ] });
 });
 DatePicker.displayName = "DatePicker";
 
 // src/patterns/Dots/Dots.tsx
-var import_react52 = require("react");
-var import_jsx_runtime45 = require("react/jsx-runtime");
-var Dots = (0, import_react52.forwardRef)(function Dots2({ total, current, onChange, className, "aria-label": ariaLabel = "Progress", ...props }, ref) {
+var import_react53 = require("react");
+var import_jsx_runtime46 = require("react/jsx-runtime");
+var Dots = (0, import_react53.forwardRef)(function Dots2({ total, current, onChange, className, "aria-label": ariaLabel = "Progress", ...props }, ref) {
   const interactive = typeof onChange === "function";
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
     "nav",
     {
       ref,
@@ -3356,7 +3544,7 @@ var Dots = (0, import_react52.forwardRef)(function Dots2({ total, current, onCha
           isActive ? "w-[18px] bg-accent" : "w-[6px] bg-panel-2"
         );
         if (interactive) {
-          return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
             "button",
             {
               type: "button",
@@ -3373,7 +3561,7 @@ var Dots = (0, import_react52.forwardRef)(function Dots2({ total, current, onCha
             i
           );
         }
-        return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { "aria-hidden": true, className: sharedClass }, i);
+        return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { "aria-hidden": true, className: sharedClass }, i);
       })
     }
   );
@@ -3381,13 +3569,13 @@ var Dots = (0, import_react52.forwardRef)(function Dots2({ total, current, onCha
 Dots.displayName = "Dots";
 
 // src/patterns/Dropzone/Dropzone.tsx
-var import_react53 = require("react");
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_react54 = require("react");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 function listToArray(list) {
   if (!list) return [];
   return Array.from(list);
 }
-var Dropzone = (0, import_react53.forwardRef)(function Dropzone2({
+var Dropzone = (0, import_react54.forwardRef)(function Dropzone2({
   onFiles,
   accept,
   multiple = true,
@@ -3398,7 +3586,7 @@ var Dropzone = (0, import_react53.forwardRef)(function Dropzone2({
   className,
   ...props
 }, ref) {
-  const [isDragging, setIsDragging] = (0, import_react53.useState)(false);
+  const [isDragging, setIsDragging] = (0, import_react54.useState)(false);
   const onDragOver = (e) => {
     if (disabled) return;
     e.preventDefault();
@@ -3412,7 +3600,7 @@ var Dropzone = (0, import_react53.forwardRef)(function Dropzone2({
     const files = listToArray(e.dataTransfer.files);
     if (files.length) onFiles?.(files);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
     "label",
     {
       ref,
@@ -3429,7 +3617,7 @@ var Dropzone = (0, import_react53.forwardRef)(function Dropzone2({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
           "input",
           {
             type: "file",
@@ -3445,7 +3633,7 @@ var Dropzone = (0, import_react53.forwardRef)(function Dropzone2({
             }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
           "div",
           {
             "aria-hidden": true,
@@ -3453,8 +3641,8 @@ var Dropzone = (0, import_react53.forwardRef)(function Dropzone2({
             children: icon
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "mb-1 text-[13px] font-medium", children: title }),
-        description && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "text-text-dim text-[11px]", children: description })
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "mb-1 text-[13px] font-medium", children: title }),
+        description && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "text-text-dim text-[11px]", children: description })
       ]
     }
   );
@@ -3462,10 +3650,10 @@ var Dropzone = (0, import_react53.forwardRef)(function Dropzone2({
 Dropzone.displayName = "Dropzone";
 
 // src/patterns/EmptyState/EmptyState.tsx
-var import_class_variance_authority10 = require("class-variance-authority");
-var import_react54 = require("react");
-var import_jsx_runtime47 = require("react/jsx-runtime");
-var plateStyles = (0, import_class_variance_authority10.cva)("grid h-12 w-12 place-items-center rounded-base text-[22px]", {
+var import_class_variance_authority11 = require("class-variance-authority");
+var import_react55 = require("react");
+var import_jsx_runtime48 = require("react/jsx-runtime");
+var plateStyles = (0, import_class_variance_authority11.cva)("grid h-12 w-12 place-items-center rounded-base text-[22px]", {
   variants: {
     tone: {
       neutral: "bg-panel-2 text-text-muted",
@@ -3477,8 +3665,8 @@ var plateStyles = (0, import_class_variance_authority10.cva)("grid h-12 w-12 pla
   },
   defaultVariants: { tone: "neutral" }
 });
-var EmptyState = (0, import_react54.forwardRef)(function EmptyState2({ icon, title, description, action, chips, tone, className, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
+var EmptyState = (0, import_react55.forwardRef)(function EmptyState2({ icon, title, description, action, chips, tone, className, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
     "div",
     {
       ref,
@@ -3488,10 +3676,10 @@ var EmptyState = (0, import_react54.forwardRef)(function EmptyState2({ icon, tit
       ),
       ...props,
       children: [
-        icon != null && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { "aria-hidden": true, className: plateStyles({ tone: tone ?? "neutral" }), children: icon }),
-        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "text-[14px] font-medium", children: title }),
-        description && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "text-text-muted max-w-[260px] text-[12px] leading-[1.5]", children: description }),
-        chips && chips.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "flex w-full flex-col gap-1", children: chips.map((c, i) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+        icon != null && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { "aria-hidden": true, className: plateStyles({ tone: tone ?? "neutral" }), children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "text-[14px] font-medium", children: title }),
+        description && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "text-text-muted max-w-[260px] text-[12px] leading-[1.5]", children: description }),
+        chips && chips.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "flex w-full flex-col gap-1", children: chips.map((c, i) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
           "button",
           {
             type: "button",
@@ -3513,18 +3701,18 @@ var EmptyState = (0, import_react54.forwardRef)(function EmptyState2({ icon, tit
 EmptyState.displayName = "EmptyState";
 
 // src/patterns/FileChip/FileChip.tsx
-var import_react55 = require("react");
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_react56 = require("react");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 function deriveExt(name) {
   const dot = name.lastIndexOf(".");
   if (dot < 0) return "FILE";
   return name.slice(dot + 1).slice(0, 4).toUpperCase();
 }
-var FileChip = (0, import_react55.forwardRef)(function FileChip2({ name, size, progress, icon, onRemove, failed, className, ...props }, ref) {
+var FileChip = (0, import_react56.forwardRef)(function FileChip2({ name, size, progress, icon, onRemove, failed, className, ...props }, ref) {
   const ext = deriveExt(name);
   const showProgress = typeof progress === "number";
   const isComplete = showProgress && progress >= 100;
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
     "div",
     {
       ref,
@@ -3534,7 +3722,7 @@ var FileChip = (0, import_react55.forwardRef)(function FileChip2({ name, size, p
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
           "span",
           {
             "aria-hidden": true,
@@ -3542,17 +3730,17 @@ var FileChip = (0, import_react55.forwardRef)(function FileChip2({ name, size, p
             children: icon ?? ext
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "truncate text-[12px] font-medium", children: name }),
-          /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: cn("font-mono text-[10px]", failed ? "text-err" : "text-text-dim"), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "truncate text-[12px] font-medium", children: name }),
+          /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: cn("font-mono text-[10px]", failed ? "text-err" : "text-text-dim"), children: [
             size,
-            showProgress && !isComplete && /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("span", { children: [
+            showProgress && !isComplete && /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("span", { children: [
               " \xB7 ",
               Math.round(progress),
               "%"
             ] })
           ] }),
-          showProgress && !isComplete && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "bg-panel mt-1 h-[2px] overflow-hidden rounded-full", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+          showProgress && !isComplete && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "bg-panel mt-1 h-[2px] overflow-hidden rounded-full", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
             "div",
             {
               className: cn(
@@ -3563,7 +3751,7 @@ var FileChip = (0, import_react55.forwardRef)(function FileChip2({ name, size, p
             }
           ) })
         ] }),
-        onRemove && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+        onRemove && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
           "button",
           {
             type: "button",
@@ -3583,10 +3771,10 @@ var FileChip = (0, import_react55.forwardRef)(function FileChip2({ name, size, p
 FileChip.displayName = "FileChip";
 
 // src/patterns/FilterPanel/FilterPanel.tsx
-var import_react56 = require("react");
-var import_jsx_runtime49 = require("react/jsx-runtime");
+var import_react57 = require("react");
+var import_jsx_runtime50 = require("react/jsx-runtime");
 var EMPTY = Object.freeze({});
-var FilterPanel = (0, import_react56.forwardRef)(function FilterPanel2({
+var FilterPanel = (0, import_react57.forwardRef)(function FilterPanel2({
   facets,
   value,
   defaultValue,
@@ -3604,7 +3792,7 @@ var FilterPanel = (0, import_react56.forwardRef)(function FilterPanel2({
     onChange: onValueChange
   });
   const total = facets.reduce((sum, facet) => sum + (selection[facet.id]?.length ?? 0), 0);
-  const toggle = (0, import_react56.useCallback)(
+  const toggle = (0, import_react57.useCallback)(
     (facetId, optionValue, next) => {
       setSelection((prev) => {
         const current = prev?.[facetId] ?? [];
@@ -3615,11 +3803,11 @@ var FilterPanel = (0, import_react56.forwardRef)(function FilterPanel2({
     },
     [setSelection]
   );
-  const handleReset = (0, import_react56.useCallback)(() => {
+  const handleReset = (0, import_react57.useCallback)(() => {
     setSelection(EMPTY);
     onReset?.();
   }, [setSelection, onReset]);
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
     "div",
     {
       ref,
@@ -3631,10 +3819,10 @@ var FilterPanel = (0, import_react56.forwardRef)(function FilterPanel2({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { className: "text-text-dim font-mono text-[10px] tracking-[1.4px] uppercase", children: title }),
-          total > 0 && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Badge, { size: "sm", variant: "accent", children: total }),
-          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "text-text-dim font-mono text-[10px] tracking-[1.4px] uppercase", children: title }),
+          total > 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Badge, { size: "sm", variant: "accent", children: total }),
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
             Button,
             {
               type: "button",
@@ -3647,7 +3835,7 @@ var FilterPanel = (0, import_react56.forwardRef)(function FilterPanel2({
             }
           )
         ] }),
-        facets.map((facet) => /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+        facets.map((facet) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
           FilterFacetGroup,
           {
             facet,
@@ -3664,12 +3852,12 @@ var FilterPanel = (0, import_react56.forwardRef)(function FilterPanel2({
 FilterPanel.displayName = "FilterPanel";
 function FilterFacetGroup({ facet, selected, counts, onToggle }) {
   const collapsible = facet.collapsible ?? true;
-  const [open, setOpen] = (0, import_react56.useState)(facet.defaultOpen ?? true);
+  const [open, setOpen] = (0, import_react57.useState)(facet.defaultOpen ?? true);
   const isOpen = !collapsible || open;
   const selectedCount = selected.length;
   const headingClass = "text-text-muted flex items-center gap-[6px] font-mono text-[10px] tracking-[1.4px] uppercase";
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("section", { className: "flex flex-col gap-1", children: [
-    collapsible ? /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("section", { className: "flex flex-col gap-1", children: [
+    collapsible ? /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
       "button",
       {
         type: "button",
@@ -3682,20 +3870,20 @@ function FilterFacetGroup({ facet, selected, counts, onToggle }) {
           "hover:text-text"
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { className: "flex-1 text-left", children: facet.label }),
-          selectedCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Badge, { size: "sm", variant: "neutral", children: selectedCount }),
-          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { "aria-hidden": true, className: "text-[10px] opacity-70", children: isOpen ? "\u25BE" : "\u25B8" })
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "flex-1 text-left", children: facet.label }),
+          selectedCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Badge, { size: "sm", variant: "neutral", children: selectedCount }),
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { "aria-hidden": true, className: "text-[10px] opacity-70", children: isOpen ? "\u25BE" : "\u25B8" })
         ]
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: cn(headingClass, "px-1 py-[2px]"), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { className: "flex-1", children: facet.label }),
-      selectedCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Badge, { size: "sm", variant: "neutral", children: selectedCount })
+    ) : /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: cn(headingClass, "px-1 py-[2px]"), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "flex-1", children: facet.label }),
+      selectedCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Badge, { size: "sm", variant: "neutral", children: selectedCount })
     ] }),
-    isOpen && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("ul", { className: "m-0 flex list-none flex-col gap-[2px] p-0", children: facet.options.map((option) => {
+    isOpen && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("ul", { className: "m-0 flex list-none flex-col gap-[2px] p-0", children: facet.options.map((option) => {
       const isSelected = selected.includes(option.value);
       const count = counts?.[option.value];
-      return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("li", { className: "flex items-center gap-2 px-1 py-[3px]", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("li", { className: "flex items-center gap-2 px-1 py-[3px]", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
           Checkbox,
           {
             checked: isSelected,
@@ -3703,25 +3891,25 @@ function FilterFacetGroup({ facet, selected, counts, onToggle }) {
             label: option.label
           }
         ),
-        typeof count === "number" && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { className: "text-text-dim ml-auto font-mono text-[10px] tabular-nums", children: count })
+        typeof count === "number" && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "text-text-dim ml-auto font-mono text-[10px] tabular-nums", children: count })
       ] }, option.value);
     }) })
   ] });
 }
 
 // src/patterns/HealthScore/HealthScore.tsx
-var import_react58 = require("react");
+var import_react59 = require("react");
 
 // src/patterns/RadialProgress/RadialProgress.tsx
-var import_react57 = require("react");
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_react58 = require("react");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var toneStrokeClass = {
   accent: "stroke-accent",
   ok: "stroke-ok",
   warn: "stroke-warn",
   err: "stroke-err"
 };
-var RadialProgress = (0, import_react57.forwardRef)(
+var RadialProgress = (0, import_react58.forwardRef)(
   function RadialProgress2({
     value,
     max = 100,
@@ -3739,7 +3927,7 @@ var RadialProgress = (0, import_react57.forwardRef)(
     const c = 2 * Math.PI * r;
     const dash = pct / 100 * c;
     const resolvedTone = tone ?? (clamped >= max ? "ok" : "accent");
-    return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
       "div",
       {
         ref,
@@ -3752,8 +3940,8 @@ var RadialProgress = (0, import_react57.forwardRef)(
         style: { width: size, height: size },
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
               "circle",
               {
                 cx: size / 2,
@@ -3764,7 +3952,7 @@ var RadialProgress = (0, import_react57.forwardRef)(
                 className: "stroke-panel-2"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
               "circle",
               {
                 cx: size / 2,
@@ -3782,7 +3970,7 @@ var RadialProgress = (0, import_react57.forwardRef)(
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "absolute inset-0 grid place-items-center font-mono text-[11px] font-medium tabular-nums", children: children ?? `${Math.round(pct)}%` })
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "absolute inset-0 grid place-items-center font-mono text-[11px] font-medium tabular-nums", children: children ?? `${Math.round(pct)}%` })
         ]
       }
     );
@@ -3791,7 +3979,7 @@ var RadialProgress = (0, import_react57.forwardRef)(
 RadialProgress.displayName = "RadialProgress";
 
 // src/patterns/HealthScore/HealthScore.tsx
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 function deltaTone(delta) {
   if (delta > 0) return "ok";
   if (delta < 0) return "err";
@@ -3808,7 +3996,7 @@ var toneTextClass = {
   warn: "text-warn",
   err: "text-err"
 };
-var HealthScore = (0, import_react58.forwardRef)(function HealthScore2({
+var HealthScore = (0, import_react59.forwardRef)(function HealthScore2({
   value,
   max = 100,
   delta,
@@ -3823,7 +4011,7 @@ var HealthScore = (0, import_react58.forwardRef)(function HealthScore2({
   const pct = max > 0 ? Math.round(Math.min(max, Math.max(0, value)) / max * 100) : 0;
   const resolvedTone = tone ?? (pct >= 80 ? "ok" : pct >= 50 ? "accent" : "warn");
   const indicatorTone = typeof delta === "number" ? deltaTone(delta) : "accent";
-  const core = /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
+  const core = /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
     "div",
     {
       ref,
@@ -3831,10 +4019,10 @@ var HealthScore = (0, import_react58.forwardRef)(function HealthScore2({
       "aria-label": ariaLabel ?? `${pct}% health`,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(RadialProgress, { value, max, size, tone: resolvedTone }),
-        label && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "text-text-muted mt-1 text-[12px] leading-tight", children: label }),
-        typeof delta === "number" && /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: cn("font-mono text-[11px] tabular-nums", toneTextClass[indicatorTone]), children: [
-          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { "aria-hidden": true, children: deltaGlyph(delta) }),
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(RadialProgress, { value, max, size, tone: resolvedTone }),
+        label && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "text-text-muted mt-1 text-[12px] leading-tight", children: label }),
+        typeof delta === "number" && /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: cn("font-mono text-[11px] tabular-nums", toneTextClass[indicatorTone]), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { "aria-hidden": true, children: deltaGlyph(delta) }),
           " ",
           Math.abs(delta)
         ] })
@@ -3844,15 +4032,15 @@ var HealthScore = (0, import_react58.forwardRef)(function HealthScore2({
   if (!breakdown || breakdown.length === 0) {
     return core;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
     HoverCard,
     {
-      trigger: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "inline-flex", children: core }),
-      content: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "flex min-w-[180px] flex-col gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "text-text-dim font-mono text-[9px] tracking-[1.4px] uppercase", children: "Breakdown" }),
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("ul", { className: "m-0 flex list-none flex-col gap-1 p-0 text-[12px]", children: breakdown.map((entry, i) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("li", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "text-text-muted flex-1 truncate", children: entry.label }),
-          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+      trigger: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "inline-flex", children: core }),
+      content: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "flex min-w-[180px] flex-col gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "text-text-dim font-mono text-[9px] tracking-[1.4px] uppercase", children: "Breakdown" }),
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("ul", { className: "m-0 flex list-none flex-col gap-1 p-0 text-[12px]", children: breakdown.map((entry, i) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("li", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "text-text-muted flex-1 truncate", children: entry.label }),
+          /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
             "span",
             {
               className: cn(
@@ -3870,21 +4058,21 @@ var HealthScore = (0, import_react58.forwardRef)(function HealthScore2({
 HealthScore.displayName = "HealthScore";
 
 // src/patterns/LargeTitle/LargeTitle.tsx
-var import_react59 = require("react");
-var import_jsx_runtime52 = require("react/jsx-runtime");
-var LargeTitle = (0, import_react59.forwardRef)(function LargeTitle2({ title, eyebrow, trailing, className, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+var import_react60 = require("react");
+var import_jsx_runtime53 = require("react/jsx-runtime");
+var LargeTitle = (0, import_react60.forwardRef)(function LargeTitle2({ title, eyebrow, trailing, className, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
     "header",
     {
       ref,
       className: cn("px-screen flex items-end justify-between gap-3 py-3 pb-4", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "min-w-0 flex-1", children: [
-          eyebrow && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "text-m-eyebrow text-accent mb-[6px] font-mono tracking-wide uppercase", children: eyebrow }),
-          /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("h1", { className: "text-m-h1 m-0 truncate leading-tight font-medium tracking-tight", children: title })
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "min-w-0 flex-1", children: [
+          eyebrow && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "text-m-eyebrow text-accent mb-[6px] font-mono tracking-wide uppercase", children: eyebrow }),
+          /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("h1", { className: "text-m-h1 m-0 truncate leading-tight font-medium tracking-tight", children: title })
         ] }),
-        trailing && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "shrink-0", children: trailing })
+        trailing && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "shrink-0", children: trailing })
       ]
     }
   );
@@ -3893,10 +4081,10 @@ LargeTitle.displayName = "LargeTitle";
 
 // src/patterns/Menubar/Menubar.tsx
 var RadixMenubar = __toESM(require("@radix-ui/react-menubar"), 1);
-var import_react60 = require("react");
-var import_jsx_runtime53 = require("react/jsx-runtime");
-var Menubar = (0, import_react60.forwardRef)(function Menubar2({ className, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+var import_react61 = require("react");
+var import_jsx_runtime54 = require("react/jsx-runtime");
+var Menubar = (0, import_react61.forwardRef)(function Menubar2({ className, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     RadixMenubar.Root,
     {
       ref,
@@ -3910,9 +4098,9 @@ var Menubar = (0, import_react60.forwardRef)(function Menubar2({ className, ...p
 });
 Menubar.displayName = "Menubar";
 var MenubarMenu = RadixMenubar.Menu;
-var MenubarTrigger = (0, import_react60.forwardRef)(
+var MenubarTrigger = (0, import_react61.forwardRef)(
   function MenubarTrigger2({ className, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       RadixMenubar.Trigger,
       {
         ref,
@@ -3929,9 +4117,9 @@ var MenubarTrigger = (0, import_react60.forwardRef)(
   }
 );
 MenubarTrigger.displayName = "MenubarTrigger";
-var MenubarContent = (0, import_react60.forwardRef)(
+var MenubarContent = (0, import_react61.forwardRef)(
   function MenubarContent2({ className, sideOffset = 6, align = "start", ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(RadixMenubar.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(RadixMenubar.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       RadixMenubar.Content,
       {
         ref,
@@ -3953,24 +4141,24 @@ var itemBase3 = cn(
   "data-[highlighted]:bg-panel-2",
   "data-[disabled]:opacity-40 data-[disabled]:cursor-not-allowed"
 );
-var MenubarItem = (0, import_react60.forwardRef)(function MenubarItem2({ trailing, destructive, className, children, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
+var MenubarItem = (0, import_react61.forwardRef)(function MenubarItem2({ trailing, destructive, className, children, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
     RadixMenubar.Item,
     {
       ref,
       className: cn(itemBase3, destructive ? "text-err" : "text-text", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "flex-1", children }),
-        trailing && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "text-text-dim font-mono text-[10px]", children: trailing })
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "flex-1", children }),
+        trailing && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "text-text-dim font-mono text-[10px]", children: trailing })
       ]
     }
   );
 });
 MenubarItem.displayName = "MenubarItem";
-var MenubarSeparator = (0, import_react60.forwardRef)(
+var MenubarSeparator = (0, import_react61.forwardRef)(
   function MenubarSeparator2({ className, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       RadixMenubar.Separator,
       {
         ref,
@@ -3984,13 +4172,13 @@ MenubarSeparator.displayName = "MenubarSeparator";
 
 // src/patterns/NavBar/NavBar.tsx
 var RadixNav = __toESM(require("@radix-ui/react-navigation-menu"), 1);
-var import_react62 = require("react");
+var import_react63 = require("react");
 
 // src/patterns/Sidebar/Sidebar.tsx
-var import_react61 = require("react");
-var import_jsx_runtime54 = require("react/jsx-runtime");
-var Sidebar = (0, import_react61.forwardRef)(function Sidebar2({ width = 240, className, style, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+var import_react62 = require("react");
+var import_jsx_runtime55 = require("react/jsx-runtime");
+var Sidebar = (0, import_react62.forwardRef)(function Sidebar2({ width = 240, className, style, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     "aside",
     {
       ref,
@@ -4004,12 +4192,12 @@ var Sidebar = (0, import_react61.forwardRef)(function Sidebar2({ width = 240, cl
   );
 });
 Sidebar.displayName = "Sidebar";
-var NavItem = (0, import_react61.forwardRef)(
+var NavItem = (0, import_react62.forwardRef)(
   function NavItem2({ icon, label, active, badge, href, disabled, className, ...props }, ref) {
-    const inner = /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
-      icon && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { "aria-hidden": true, className: "w-[14px] text-center opacity-80", children: icon }),
-      /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "flex-1 truncate", children: label }),
-      badge != null && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+    const inner = /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
+      icon && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { "aria-hidden": true, className: "w-[14px] text-center opacity-80", children: icon }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "flex-1 truncate", children: label }),
+      badge != null && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
         "span",
         {
           className: cn(
@@ -4030,7 +4218,7 @@ var NavItem = (0, import_react61.forwardRef)(
     );
     if (href) {
       const anchorProps = props;
-      return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
         "a",
         {
           ref,
@@ -4044,7 +4232,7 @@ var NavItem = (0, import_react61.forwardRef)(
       );
     }
     const buttonProps = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
       "button",
       {
         ref,
@@ -4059,7 +4247,7 @@ var NavItem = (0, import_react61.forwardRef)(
   }
 );
 NavItem.displayName = "NavItem";
-var NavSection = (0, import_react61.forwardRef)(function NavSection2({
+var NavSection = (0, import_react62.forwardRef)(function NavSection2({
   label,
   icon,
   action,
@@ -4073,16 +4261,16 @@ var NavSection = (0, import_react61.forwardRef)(function NavSection2({
   ...props
 }, ref) {
   const isControlled = open !== void 0;
-  const [internalOpen, setInternalOpen] = (0, import_react61.useState)(defaultOpen);
+  const [internalOpen, setInternalOpen] = (0, import_react62.useState)(defaultOpen);
   const isOpen = !collapsible || (isControlled ? open : internalOpen);
-  const toggle = (0, import_react61.useCallback)(() => {
+  const toggle = (0, import_react62.useCallback)(() => {
     const next = !isOpen;
     if (!isControlled) setInternalOpen(next);
     onOpenChange?.(next);
   }, [isOpen, isControlled, onOpenChange]);
   const eyebrowClass = "text-text-dim flex items-center gap-[6px] px-2 pt-2 font-mono text-[9px] tracking-[1.4px] uppercase";
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { ref, className: cn("flex flex-col gap-1", className), ...props, children: [
-    collapsible ? /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { ref, className: cn("flex flex-col gap-1", className), ...props, children: [
+    collapsible ? /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
       "button",
       {
         type: "button",
@@ -4095,18 +4283,18 @@ var NavSection = (0, import_react61.forwardRef)(function NavSection2({
           "hover:text-text-muted"
         ),
         children: [
-          icon != null && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { "aria-hidden": true, className: "opacity-80", children: icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "flex-1 text-left", children: label }),
+          icon != null && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { "aria-hidden": true, className: "opacity-80", children: icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "flex-1 text-left", children: label }),
           action,
-          /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { "aria-hidden": true, className: "text-[10px] opacity-70", children: isOpen ? "\u25BE" : "\u25B8" })
+          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { "aria-hidden": true, className: "text-[10px] opacity-70", children: isOpen ? "\u25BE" : "\u25B8" })
         ]
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: eyebrowClass, children: [
-      icon != null && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { "aria-hidden": true, className: "opacity-80", children: icon }),
-      /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "flex-1", children: label }),
+    ) : /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: eyebrowClass, children: [
+      icon != null && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { "aria-hidden": true, className: "opacity-80", children: icon }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "flex-1", children: label }),
       action
     ] }),
-    isOpen && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+    isOpen && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
       "div",
       {
         className: cn("flex flex-col gap-[2px]", indent > 0 && "border-border ml-2 border-l"),
@@ -4119,12 +4307,12 @@ var NavSection = (0, import_react61.forwardRef)(function NavSection2({
 NavSection.displayName = "NavSection";
 
 // src/patterns/NavBar/NavBar.tsx
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 function isActiveTree(item, activeId) {
   if (item.id === activeId) return true;
   return item.children?.some((c) => isActiveTree(c, activeId)) ?? false;
 }
-var NavBar = (0, import_react62.forwardRef)(function NavBar2({
+var NavBar = (0, import_react63.forwardRef)(function NavBar2({
   orientation = "horizontal",
   items,
   brand,
@@ -4138,17 +4326,17 @@ var NavBar = (0, import_react62.forwardRef)(function NavBar2({
   ...props
 }, ref) {
   const isControlled = value !== void 0;
-  const [internalValue, setInternalValue] = (0, import_react62.useState)(defaultValue);
+  const [internalValue, setInternalValue] = (0, import_react63.useState)(defaultValue);
   const activeId = isControlled ? value : internalValue;
-  const [drawerOpen, setDrawerOpen] = (0, import_react62.useState)(false);
-  const select = (0, import_react62.useCallback)(
+  const [drawerOpen, setDrawerOpen] = (0, import_react63.useState)(false);
+  const select = (0, import_react63.useCallback)(
     (id) => {
       if (!isControlled) setInternalValue(id);
       onValueChange?.(id);
     },
     [isControlled, onValueChange]
   );
-  const handleItemActivate = (0, import_react62.useCallback)(
+  const handleItemActivate = (0, import_react63.useCallback)(
     (id) => {
       select(id);
       setDrawerOpen(false);
@@ -4160,7 +4348,7 @@ var NavBar = (0, import_react62.forwardRef)(function NavBar2({
     // drawer is open on a viewport that's resizing past `md`, both navs can
     // sit in the DOM together. Identical accessible names would trip axe's
     // `landmark-unique` rule.
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("nav", { "aria-label": "Mobile navigation", className: "flex flex-col gap-1", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("nav", { "aria-label": "Mobile navigation", className: "flex flex-col gap-1", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       VerticalItem,
       {
         item,
@@ -4170,14 +4358,14 @@ var NavBar = (0, import_react62.forwardRef)(function NavBar2({
       item.id
     )) })
   );
-  const mobileBar = responsive ? /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+  const mobileBar = responsive ? /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
     "div",
     {
       className: cn(
         "border-border bg-panel z-overlay sticky top-0 flex h-[52px] items-center gap-4 border-b px-5 md:hidden"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
           "button",
           {
             type: "button",
@@ -4187,15 +4375,15 @@ var NavBar = (0, import_react62.forwardRef)(function NavBar2({
             children: "\u2630"
           }
         ),
-        brand && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "flex flex-1 items-center text-[13px] font-medium whitespace-nowrap", children: brand }),
-        actions && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "flex items-center gap-3", children: actions })
+        brand && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "flex flex-1 items-center text-[13px] font-medium whitespace-nowrap", children: brand }),
+        actions && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "flex items-center gap-3", children: actions })
       ]
     }
   ) : null;
   if (orientation === "horizontal") {
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
       mobileBar,
-      /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
         "header",
         {
           ref,
@@ -4206,10 +4394,10 @@ var NavBar = (0, import_react62.forwardRef)(function NavBar2({
           ),
           ...props,
           children: [
-            brand && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "shrink-0 text-[13px] font-medium whitespace-nowrap", children: brand }),
-            /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(RadixNav.Root, { className: "relative flex-1", delayDuration: 120, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(RadixNav.List, { className: "m-0! flex list-none! items-center gap-1 p-0! [&_li]:m-0!", children: items.map(
-                (item) => item.children?.length ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+            brand && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "shrink-0 text-[13px] font-medium whitespace-nowrap", children: brand }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(RadixNav.Root, { className: "relative flex-1", delayDuration: 120, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(RadixNav.List, { className: "m-0! flex list-none! items-center gap-1 p-0! [&_li]:m-0!", children: items.map(
+                (item) => item.children?.length ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
                   HorizontalDropdown,
                   {
                     item,
@@ -4218,7 +4406,7 @@ var NavBar = (0, import_react62.forwardRef)(function NavBar2({
                     onActivate: handleItemActivate
                   },
                   item.id
-                ) : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(RadixNav.Item, { children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+                ) : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(RadixNav.Item, { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
                   HorizontalLink,
                   {
                     item,
@@ -4227,13 +4415,13 @@ var NavBar = (0, import_react62.forwardRef)(function NavBar2({
                   }
                 ) }, item.id)
               ) }),
-              /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "z-popover absolute top-full left-0 flex justify-start", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(RadixNav.Viewport, { className: "origin-top-left data-[state=open]:animate-[ship-fade-in_120ms_var(--easing-out)]" }) })
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "z-popover absolute top-full left-0 flex justify-start", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(RadixNav.Viewport, { className: "origin-top-left data-[state=open]:animate-[ship-fade-in_120ms_var(--easing-out)]" }) })
             ] }),
-            actions && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "flex items-center gap-3", children: actions })
+            actions && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "flex items-center gap-3", children: actions })
           ]
         }
       ),
-      responsive && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+      responsive && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
         Drawer,
         {
           open: drawerOpen,
@@ -4246,9 +4434,9 @@ var NavBar = (0, import_react62.forwardRef)(function NavBar2({
       )
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
     mobileBar,
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
       "aside",
       {
         ref,
@@ -4261,8 +4449,8 @@ var NavBar = (0, import_react62.forwardRef)(function NavBar2({
         ),
         ...props,
         children: [
-          brand && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "px-2 py-1 text-[13px] font-medium", children: brand }),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("nav", { "aria-label": "Sidebar navigation", className: "flex flex-1 flex-col gap-1 overflow-y-auto", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+          brand && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "px-2 py-1 text-[13px] font-medium", children: brand }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("nav", { "aria-label": "Sidebar navigation", className: "flex flex-1 flex-col gap-1 overflow-y-auto", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
             VerticalItem,
             {
               item,
@@ -4271,11 +4459,11 @@ var NavBar = (0, import_react62.forwardRef)(function NavBar2({
             },
             item.id
           )) }),
-          actions && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "border-border mt-auto flex flex-col gap-2 border-t pt-3", children: actions })
+          actions && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "border-border mt-auto flex flex-col gap-2 border-t pt-3", children: actions })
         ]
       }
     ),
-    responsive && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    responsive && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       Drawer,
       {
         open: drawerOpen,
@@ -4304,13 +4492,13 @@ function HorizontalLink({ item, active, onActivate }) {
     }
     onActivate(item.id);
   };
-  const inner = /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
-    item.icon != null && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { "aria-hidden": true, className: "opacity-80", children: item.icon }),
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { children: item.label }),
-    item.badge != null && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ItemBadge, { active, children: item.badge })
+  const inner = /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
+    item.icon != null && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { "aria-hidden": true, className: "opacity-80", children: item.icon }),
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children: item.label }),
+    item.badge != null && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ItemBadge, { active, children: item.badge })
   ] });
   if (item.href) {
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(RadixNav.Link, { asChild: true, active, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(RadixNav.Link, { asChild: true, active, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       "a",
       {
         href: item.href,
@@ -4322,7 +4510,7 @@ function HorizontalLink({ item, active, onActivate }) {
       }
     ) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(RadixNav.Link, { asChild: true, active, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(RadixNav.Link, { asChild: true, active, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     "button",
     {
       type: "button",
@@ -4335,8 +4523,8 @@ function HorizontalLink({ item, active, onActivate }) {
   ) });
 }
 function HorizontalDropdown({ item, active, activeId, onActivate }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(RadixNav.Item, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(RadixNav.Item, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
       RadixNav.Trigger,
       {
         className: cn(
@@ -4348,9 +4536,9 @@ function HorizontalDropdown({ item, active, activeId, onActivate }) {
         ),
         disabled: item.disabled,
         children: [
-          item.icon != null && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { "aria-hidden": true, className: "opacity-80", children: item.icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { children: item.label }),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+          item.icon != null && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { "aria-hidden": true, className: "opacity-80", children: item.icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children: item.label }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
             "span",
             {
               "aria-hidden": true,
@@ -4361,7 +4549,7 @@ function HorizontalDropdown({ item, active, activeId, onActivate }) {
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(RadixNav.Content, { className: "border-border bg-panel min-w-[220px] rounded-xs border p-2 shadow-lg", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("ul", { className: "m-0! flex list-none! flex-col gap-[2px] p-0! [&_li]:m-0!", children: item.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(DropdownLink, { item: child, active: child.id === activeId, onActivate }) }, child.id)) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(RadixNav.Content, { className: "border-border bg-panel min-w-[220px] rounded-xs border p-2 shadow-lg", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("ul", { className: "m-0! flex list-none! flex-col gap-[2px] p-0! [&_li]:m-0!", children: item.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(DropdownLink, { item: child, active: child.id === activeId, onActivate }) }, child.id)) }) })
   ] });
 }
 function DropdownLink({ item, active, onActivate }) {
@@ -4378,13 +4566,13 @@ function DropdownLink({ item, active, onActivate }) {
     }
     onActivate(item.id);
   };
-  const inner = /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
-    item.icon != null && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { "aria-hidden": true, className: "opacity-80", children: item.icon }),
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "flex-1", children: item.label }),
-    item.badge != null && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ItemBadge, { active, children: item.badge })
+  const inner = /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
+    item.icon != null && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { "aria-hidden": true, className: "opacity-80", children: item.icon }),
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "flex-1", children: item.label }),
+    item.badge != null && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ItemBadge, { active, children: item.badge })
   ] });
   if (item.href) {
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(RadixNav.Link, { asChild: true, active, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(RadixNav.Link, { asChild: true, active, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       "a",
       {
         href: item.href,
@@ -4396,7 +4584,7 @@ function DropdownLink({ item, active, onActivate }) {
       }
     ) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(RadixNav.Link, { asChild: true, active, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(RadixNav.Link, { asChild: true, active, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     "button",
     {
       type: "button",
@@ -4411,9 +4599,9 @@ function DropdownLink({ item, active, onActivate }) {
 function VerticalItem({ item, activeId, onActivate }) {
   const hasChildren = (item.children?.length ?? 0) > 0;
   const treeActive = isActiveTree(item, activeId);
-  const [open, setOpen] = (0, import_react62.useState)(treeActive);
-  const prevTreeActive = (0, import_react62.useRef)(treeActive);
-  (0, import_react62.useEffect)(() => {
+  const [open, setOpen] = (0, import_react63.useState)(treeActive);
+  const prevTreeActive = (0, import_react63.useRef)(treeActive);
+  (0, import_react63.useEffect)(() => {
     if (treeActive && !prevTreeActive.current) setOpen(true);
     prevTreeActive.current = treeActive;
   }, [treeActive]);
@@ -4425,7 +4613,7 @@ function VerticalItem({ item, activeId, onActivate }) {
       }
       onActivate(item.id);
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       NavItem,
       {
         icon: item.icon,
@@ -4438,8 +4626,8 @@ function VerticalItem({ item, activeId, onActivate }) {
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
       "button",
       {
         type: "button",
@@ -4455,18 +4643,18 @@ function VerticalItem({ item, activeId, onActivate }) {
           item.disabled && "pointer-events-none opacity-50"
         ),
         children: [
-          item.icon != null && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { "aria-hidden": true, className: "w-[14px] text-center opacity-80", children: item.icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "flex-1 truncate", children: item.label }),
-          item.badge != null && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ItemBadge, { active: treeActive, children: item.badge }),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { "aria-hidden": true, className: "text-[10px] opacity-60", children: open ? "\u25BE" : "\u25B8" })
+          item.icon != null && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { "aria-hidden": true, className: "w-[14px] text-center opacity-80", children: item.icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "flex-1 truncate", children: item.label }),
+          item.badge != null && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ItemBadge, { active: treeActive, children: item.badge }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { "aria-hidden": true, className: "text-[10px] opacity-60", children: open ? "\u25BE" : "\u25B8" })
         ]
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "border-border mt-1 ml-[18px] flex flex-col gap-[2px] border-l pl-3", children: item.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(VerticalItem, { item: child, activeId, onActivate }, child.id)) })
+    open && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "border-border mt-1 ml-[18px] flex flex-col gap-[2px] border-l pl-3", children: item.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(VerticalItem, { item: child, activeId, onActivate }, child.id)) })
   ] });
 }
 function ItemBadge({ active, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     "span",
     {
       className: cn(
@@ -4479,8 +4667,8 @@ function ItemBadge({ active, children }) {
 }
 
 // src/patterns/OnboardingChecklist/OnboardingChecklist.tsx
-var import_react63 = require("react");
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_react64 = require("react");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 var statusDot = {
   pending: "off",
   "in-progress": "sync",
@@ -4491,11 +4679,11 @@ var labelStateClass = {
   "in-progress": "text-text",
   done: "text-text-dim line-through"
 };
-var OnboardingChecklist = (0, import_react63.forwardRef)(
+var OnboardingChecklist = (0, import_react64.forwardRef)(
   function OnboardingChecklist2({ items, onItemClick, title = "Get started", progressLabel, hideProgress, className, ...props }, ref) {
     const total = items.length;
     const done = items.filter((i) => i.status === "done").length;
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
       "section",
       {
         ref,
@@ -4506,11 +4694,11 @@ var OnboardingChecklist = (0, import_react63.forwardRef)(
         ),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("header", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-[14px] font-medium", children: title }),
-            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-text-dim ml-auto font-mono text-[11px] tabular-nums", children: progressLabel ?? `${done} of ${total} complete` })
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("header", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "text-[14px] font-medium", children: title }),
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "text-text-dim ml-auto font-mono text-[11px] tabular-nums", children: progressLabel ?? `${done} of ${total} complete` })
           ] }),
-          !hideProgress && total > 0 && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+          !hideProgress && total > 0 && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
             "div",
             {
               role: "progressbar",
@@ -4519,7 +4707,7 @@ var OnboardingChecklist = (0, import_react63.forwardRef)(
               "aria-valuenow": done,
               "aria-label": typeof title === "string" ? `${title} progress` : "Setup progress",
               className: "bg-panel-2 h-[3px] w-full overflow-hidden rounded-full",
-              children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
                 "span",
                 {
                   "aria-hidden": true,
@@ -4532,10 +4720,10 @@ var OnboardingChecklist = (0, import_react63.forwardRef)(
               )
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("ul", { className: "m-0 flex list-none flex-col gap-1 p-0", children: items.map((item) => {
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("ul", { className: "m-0 flex list-none flex-col gap-1 p-0", children: items.map((item) => {
             const interactive = typeof onItemClick === "function";
-            const labelBlock = /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+            const labelBlock = /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
                 StatusDot,
                 {
                   state: statusDot[item.status],
@@ -4544,17 +4732,17 @@ var OnboardingChecklist = (0, import_react63.forwardRef)(
                   className: "mt-[3px]"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-[2px]", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: cn("text-[13px]", labelStateClass[item.status]), children: item.label }),
-                item.description && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-text-muted text-[12px] leading-[1.45]", children: item.description })
+              /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-[2px]", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: cn("text-[13px]", labelStateClass[item.status]), children: item.label }),
+                item.description && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "text-text-muted text-[12px] leading-[1.45]", children: item.description })
               ] })
             ] });
             const labelRegionClass = cn(
               "flex flex-1 items-start gap-3 rounded-md px-2 py-2 text-left transition-colors duration-(--duration-micro)",
               interactive && "cursor-pointer outline-none hover:bg-panel-2 focus-visible:ring-[3px] focus-visible:ring-accent-dim"
             );
-            return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("li", { className: "flex items-start gap-2", children: [
-              interactive ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("li", { className: "flex items-start gap-2", children: [
+              interactive ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
                 "button",
                 {
                   type: "button",
@@ -4563,8 +4751,8 @@ var OnboardingChecklist = (0, import_react63.forwardRef)(
                   className: labelRegionClass,
                   children: labelBlock
                 }
-              ) : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: labelRegionClass, children: labelBlock }),
-              item.action && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "shrink-0 self-center", children: item.action })
+              ) : /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: labelRegionClass, children: labelBlock }),
+              item.action && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "shrink-0 self-center", children: item.action })
             ] }, item.id);
           }) })
         ]
@@ -4575,8 +4763,8 @@ var OnboardingChecklist = (0, import_react63.forwardRef)(
 OnboardingChecklist.displayName = "OnboardingChecklist";
 
 // src/patterns/Pagination/Pagination.tsx
-var import_react64 = require("react");
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_react65 = require("react");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 function buildRange(page, total, siblings) {
   if (total <= 0) return [];
   const items = [];
@@ -4589,9 +4777,9 @@ function buildRange(page, total, siblings) {
   if (total > 1) items.push(total);
   return items;
 }
-var Pagination = (0, import_react64.forwardRef)(function Pagination2({ page, total, onPageChange, siblings = 1, className, ...props }, ref) {
+var Pagination = (0, import_react65.forwardRef)(function Pagination2({ page, total, onPageChange, siblings = 1, className, ...props }, ref) {
   const items = buildRange(page, total, siblings);
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
     "nav",
     {
       ref,
@@ -4599,7 +4787,7 @@ var Pagination = (0, import_react64.forwardRef)(function Pagination2({ page, tot
       className: cn("inline-flex items-center gap-1", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
           IconButton,
           {
             size: "sm",
@@ -4612,7 +4800,7 @@ var Pagination = (0, import_react64.forwardRef)(function Pagination2({ page, tot
         ),
         items.map((item, i) => {
           if (item === "start-ellipsis" || item === "end-ellipsis") {
-            return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
               "span",
               {
                 "aria-hidden": true,
@@ -4623,7 +4811,7 @@ var Pagination = (0, import_react64.forwardRef)(function Pagination2({ page, tot
             );
           }
           const isActive = item === page;
-          return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
             "button",
             {
               type: "button",
@@ -4641,7 +4829,7 @@ var Pagination = (0, import_react64.forwardRef)(function Pagination2({ page, tot
             item
           );
         }),
-        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
           IconButton,
           {
             size: "sm",
@@ -4659,10 +4847,10 @@ var Pagination = (0, import_react64.forwardRef)(function Pagination2({ page, tot
 Pagination.displayName = "Pagination";
 
 // src/patterns/Progress/Progress.tsx
-var import_class_variance_authority11 = require("class-variance-authority");
-var import_react65 = require("react");
-var import_jsx_runtime58 = require("react/jsx-runtime");
-var trackStyles = (0, import_class_variance_authority11.cva)("w-full rounded-full bg-panel-2 overflow-hidden", {
+var import_class_variance_authority12 = require("class-variance-authority");
+var import_react66 = require("react");
+var import_jsx_runtime59 = require("react/jsx-runtime");
+var trackStyles = (0, import_class_variance_authority12.cva)("w-full rounded-full bg-panel-2 overflow-hidden", {
   variants: {
     size: {
       sm: "h-[3px]",
@@ -4672,7 +4860,7 @@ var trackStyles = (0, import_class_variance_authority11.cva)("w-full rounded-ful
   },
   defaultVariants: { size: "md" }
 });
-var fillStyles = (0, import_class_variance_authority11.cva)("h-full rounded-full transition-[width] duration-(--duration-step)", {
+var fillStyles = (0, import_class_variance_authority12.cva)("h-full rounded-full transition-[width] duration-(--duration-step)", {
   variants: {
     tone: {
       accent: "bg-accent",
@@ -4683,7 +4871,7 @@ var fillStyles = (0, import_class_variance_authority11.cva)("h-full rounded-full
   },
   defaultVariants: { tone: "accent" }
 });
-var Progress = (0, import_react65.forwardRef)(function Progress2({
+var Progress = (0, import_react66.forwardRef)(function Progress2({
   value = 0,
   max = 100,
   indeterminate = false,
@@ -4697,15 +4885,15 @@ var Progress = (0, import_react65.forwardRef)(function Progress2({
   const clamped = Math.min(max, Math.max(0, value));
   const pct = max > 0 ? clamped / max * 100 : 0;
   const display = Math.round(pct);
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { ref, className: cn("flex w-full flex-col gap-2", className), ...props, children: [
-    label != null && /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "flex text-[12px]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { className: "text-text-muted", children: label }),
-      showValue && !indeterminate && /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("span", { className: "text-text ml-auto font-mono tabular-nums", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { ref, className: cn("flex w-full flex-col gap-2", className), ...props, children: [
+    label != null && /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "flex text-[12px]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-text-muted", children: label }),
+      showValue && !indeterminate && /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("span", { className: "text-text ml-auto font-mono tabular-nums", children: [
         display,
         "%"
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
       "div",
       {
         role: "progressbar",
@@ -4714,7 +4902,7 @@ var Progress = (0, import_react65.forwardRef)(function Progress2({
         "aria-valuenow": indeterminate ? void 0 : display,
         "aria-label": typeof label === "string" ? label : void 0,
         className: trackStyles({ size }),
-        children: indeterminate ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+        children: indeterminate ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
           "span",
           {
             "aria-hidden": true,
@@ -4724,7 +4912,7 @@ var Progress = (0, import_react65.forwardRef)(function Progress2({
               "animate-[ship-indeterminate_1.4s_linear_infinite]"
             )
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { "aria-hidden": true, className: fillStyles({ tone }), style: { width: `${pct}%` } })
+        ) : /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { "aria-hidden": true, className: fillStyles({ tone }), style: { width: `${pct}%` } })
       }
     )
   ] });
@@ -4732,18 +4920,18 @@ var Progress = (0, import_react65.forwardRef)(function Progress2({
 Progress.displayName = "Progress";
 
 // src/patterns/PullToRefresh/PullToRefresh.tsx
-var import_react66 = require("react");
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_react67 = require("react");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 var labels = {
   idle: "Pull to refresh",
   pulling: "Pull to refresh",
   ready: "Release to refresh",
   loading: "Refreshing\u2026"
 };
-var PullToRefresh = (0, import_react66.forwardRef)(function PullToRefresh2({ state = "idle", label, className, ...props }, ref) {
+var PullToRefresh = (0, import_react67.forwardRef)(function PullToRefresh2({ state = "idle", label, className, ...props }, ref) {
   const isLoading = state === "loading";
   const transform = state === "ready" ? "rotate(180deg)" : state === "pulling" ? "rotate(90deg)" : "rotate(0deg)";
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
     "div",
     {
       ref,
@@ -4753,7 +4941,7 @@ var PullToRefresh = (0, import_react66.forwardRef)(function PullToRefresh2({ sta
       className: cn("text-text-muted flex flex-col items-center gap-[6px] py-3", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
           "div",
           {
             "aria-hidden": true,
@@ -4769,7 +4957,7 @@ var PullToRefresh = (0, import_react66.forwardRef)(function PullToRefresh2({ sta
             }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-m-eyebrow font-mono tracking-wide uppercase", children: label ?? labels[state] })
+        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "text-m-eyebrow font-mono tracking-wide uppercase", children: label ?? labels[state] })
       ]
     }
   );
@@ -4777,8 +4965,8 @@ var PullToRefresh = (0, import_react66.forwardRef)(function PullToRefresh2({ sta
 PullToRefresh.displayName = "PullToRefresh";
 
 // src/patterns/Sparkline/Sparkline.tsx
-var import_react67 = require("react");
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_react68 = require("react");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 function buildPath(values, w, h) {
   if (values.length === 0) return { line: "", area: "" };
   const pad = 2;
@@ -4797,7 +4985,7 @@ function buildPath(values, w, h) {
   )} L${pad.toFixed(2)},${(h - pad).toFixed(2)} Z`;
   return { line, area };
 }
-var Sparkline = (0, import_react67.forwardRef)(function Sparkline2({
+var Sparkline = (0, import_react68.forwardRef)(function Sparkline2({
   values,
   width = 160,
   height = 32,
@@ -4808,8 +4996,8 @@ var Sparkline = (0, import_react67.forwardRef)(function Sparkline2({
   "aria-label": ariaLabel = "Trend",
   ...props
 }, ref) {
-  const { line, area } = (0, import_react67.useMemo)(() => buildPath(values, width, height), [values, width, height]);
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
+  const { line, area } = (0, import_react68.useMemo)(() => buildPath(values, width, height), [values, width, height]);
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
     "svg",
     {
       ref,
@@ -4821,8 +5009,8 @@ var Sparkline = (0, import_react67.forwardRef)(function Sparkline2({
       className: cn("inline-block", className),
       ...props,
       children: [
-        fill && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("path", { d: area, fill: stroke, fillOpacity: 0.16, stroke: "none" }),
-        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+        fill && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: area, fill: stroke, fillOpacity: 0.16, stroke: "none" }),
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
           "path",
           {
             d: line,
@@ -4840,16 +5028,16 @@ var Sparkline = (0, import_react67.forwardRef)(function Sparkline2({
 Sparkline.displayName = "Sparkline";
 
 // src/patterns/Spinner/Spinner.tsx
-var import_react68 = require("react");
-var import_jsx_runtime61 = require("react/jsx-runtime");
+var import_react69 = require("react");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 var sizes = {
   sm: { box: "h-3 w-3", border: "border-[2px]" },
   md: { box: "h-4 w-4", border: "border-[2px]" },
   lg: { box: "h-5 w-5", border: "border-[2px]" }
 };
-var Spinner2 = (0, import_react68.forwardRef)(function Spinner3({ size = "md", label = "Loading", className, ...props }, ref) {
+var Spinner2 = (0, import_react69.forwardRef)(function Spinner3({ size = "md", label = "Loading", className, ...props }, ref) {
   const s = sizes[size];
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
     "span",
     {
       ref,
@@ -4857,7 +5045,7 @@ var Spinner2 = (0, import_react68.forwardRef)(function Spinner3({ size = "md", l
       "aria-label": label,
       className: cn("inline-block", className),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
         "span",
         {
           "aria-hidden": true,
@@ -4874,8 +5062,8 @@ var Spinner2 = (0, import_react68.forwardRef)(function Spinner3({ size = "md", l
 Spinner2.displayName = "Spinner";
 
 // src/patterns/Stepper/Stepper.tsx
-var import_react69 = require("react");
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_react70 = require("react");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 var dotBase = "h-6 w-6 rounded-full grid place-items-center text-[11px] font-mono font-semibold border";
 var dotStateClass = {
   done: "bg-accent text-on-accent border-accent",
@@ -4892,8 +5080,8 @@ function stateFor(index, current) {
   if (index === current) return "current";
   return "upcoming";
 }
-var Stepper = (0, import_react69.forwardRef)(function Stepper2({ steps, current, className, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+var Stepper = (0, import_react70.forwardRef)(function Stepper2({ steps, current, className, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
     "ol",
     {
       ref,
@@ -4905,19 +5093,19 @@ var Stepper = (0, import_react69.forwardRef)(function Stepper2({ steps, current,
         const id = typeof step === "string" ? void 0 : step.id;
         const state = stateFor(i, current);
         const connectorActive = i < current;
-        return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_react69.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_react70.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
             "li",
             {
               "aria-current": state === "current" ? "step" : void 0,
               className: "flex items-center gap-2",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { "aria-hidden": true, className: cn(dotBase, dotStateClass[state]), children: state === "done" ? "\u2713" : i + 1 }),
-                /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { className: cn("text-[12px]", labelStateClass2[state]), children: label })
+                /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { "aria-hidden": true, className: cn(dotBase, dotStateClass[state]), children: state === "done" ? "\u2713" : i + 1 }),
+                /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: cn("text-[12px]", labelStateClass2[state]), children: label })
               ]
             }
           ),
-          i < steps.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+          i < steps.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
             "span",
             {
               "aria-hidden": true,
@@ -4932,13 +5120,13 @@ var Stepper = (0, import_react69.forwardRef)(function Stepper2({ steps, current,
 Stepper.displayName = "Stepper";
 
 // src/patterns/TabBar/TabBar.tsx
-var import_react70 = require("react");
-var import_jsx_runtime63 = require("react/jsx-runtime");
-var TabBar = (0, import_react70.forwardRef)(function TabBar2({ items, value, defaultValue, onValueChange, className, ...props }, ref) {
+var import_react71 = require("react");
+var import_jsx_runtime64 = require("react/jsx-runtime");
+var TabBar = (0, import_react71.forwardRef)(function TabBar2({ items, value, defaultValue, onValueChange, className, ...props }, ref) {
   const isControlled = value !== void 0;
-  const [internalValue, setInternalValue] = (0, import_react70.useState)(defaultValue);
+  const [internalValue, setInternalValue] = (0, import_react71.useState)(defaultValue);
   const activeId = isControlled ? value : internalValue;
-  const handleSelect = (0, import_react70.useCallback)(
+  const handleSelect = (0, import_react71.useCallback)(
     (id, e) => {
       if (!isControlled) setInternalValue(id);
       onValueChange?.(id);
@@ -4946,7 +5134,7 @@ var TabBar = (0, import_react70.forwardRef)(function TabBar2({ items, value, def
     },
     [isControlled, onValueChange]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
     "nav",
     {
       ref,
@@ -4961,7 +5149,7 @@ var TabBar = (0, import_react70.forwardRef)(function TabBar2({ items, value, def
       children: items.map((item) => {
         const isActive = item.id === activeId;
         if (item.elevated) {
-          return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "grid place-items-center", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
+          return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "grid place-items-center", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
             "button",
             {
               type: "button",
@@ -4977,13 +5165,13 @@ var TabBar = (0, import_react70.forwardRef)(function TabBar2({ items, value, def
                 "disabled:cursor-not-allowed disabled:opacity-40"
               ),
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { "aria-hidden": true, children: item.icon }),
-                /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "sr-only", children: item.label })
+                /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { "aria-hidden": true, children: item.icon }),
+                /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: "sr-only", children: item.label })
               ]
             }
           ) }, item.id);
         }
-        return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
           "button",
           {
             type: "button",
@@ -4998,9 +5186,9 @@ var TabBar = (0, import_react70.forwardRef)(function TabBar2({ items, value, def
               isActive ? "text-accent-text" : "text-text-muted hover:text-text"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("span", { className: "relative inline-flex", "aria-hidden": true, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("span", { className: "relative inline-flex", "aria-hidden": true, children: [
                 item.icon,
-                item.badge != null && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+                item.badge != null && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
                   "span",
                   {
                     className: cn(
@@ -5011,9 +5199,9 @@ var TabBar = (0, import_react70.forwardRef)(function TabBar2({ items, value, def
                   }
                 )
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("span", { className: "text-[10px] font-medium tracking-tight", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("span", { className: "text-[10px] font-medium tracking-tight", children: [
                 item.label,
-                item.badge != null && /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("span", { className: "sr-only", children: [
+                item.badge != null && /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("span", { className: "sr-only", children: [
                   ", ",
                   item.badge,
                   " unread"
@@ -5031,11 +5219,11 @@ TabBar.displayName = "TabBar";
 
 // src/patterns/Tabs/Tabs.tsx
 var RadixTabs = __toESM(require("@radix-ui/react-tabs"), 1);
-var import_class_variance_authority12 = require("class-variance-authority");
-var import_react71 = require("react");
-var import_jsx_runtime64 = require("react/jsx-runtime");
-var TabsVariantContext = (0, import_react71.createContext)("underline");
-var tabsListStyles = (0, import_class_variance_authority12.cva)("", {
+var import_class_variance_authority13 = require("class-variance-authority");
+var import_react72 = require("react");
+var import_jsx_runtime65 = require("react/jsx-runtime");
+var TabsVariantContext = (0, import_react72.createContext)("underline");
+var tabsListStyles = (0, import_class_variance_authority13.cva)("", {
   variants: {
     variant: {
       underline: "flex gap-6 border-b border-border",
@@ -5043,7 +5231,7 @@ var tabsListStyles = (0, import_class_variance_authority12.cva)("", {
     }
   }
 });
-var tabsTriggerStyles = (0, import_class_variance_authority12.cva)(
+var tabsTriggerStyles = (0, import_class_variance_authority13.cva)(
   "cursor-pointer outline-none transition-colors duration-(--duration-micro) focus-visible:ring-[3px] focus-visible:ring-accent-dim",
   {
     variants: {
@@ -5064,8 +5252,8 @@ var tabsTriggerStyles = (0, import_class_variance_authority12.cva)(
     }
   }
 );
-var Tabs = (0, import_react71.forwardRef)(function Tabs2({ variant = "underline", className, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(TabsVariantContext.Provider, { value: variant, children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+var Tabs = (0, import_react72.forwardRef)(function Tabs2({ variant = "underline", className, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(TabsVariantContext.Provider, { value: variant, children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
     RadixTabs.Root,
     {
       ref,
@@ -5075,14 +5263,14 @@ var Tabs = (0, import_react71.forwardRef)(function Tabs2({ variant = "underline"
   ) });
 });
 Tabs.displayName = "Tabs";
-var TabsList = (0, import_react71.forwardRef)(function TabsList2({ className, ...props }, ref) {
-  const variant = (0, import_react71.useContext)(TabsVariantContext);
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(RadixTabs.List, { ref, className: cn(tabsListStyles({ variant }), className), ...props });
+var TabsList = (0, import_react72.forwardRef)(function TabsList2({ className, ...props }, ref) {
+  const variant = (0, import_react72.useContext)(TabsVariantContext);
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(RadixTabs.List, { ref, className: cn(tabsListStyles({ variant }), className), ...props });
 });
 TabsList.displayName = "TabsList";
-var Tab = (0, import_react71.forwardRef)(function Tab2({ className, ...props }, ref) {
-  const variant = (0, import_react71.useContext)(TabsVariantContext);
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+var Tab = (0, import_react72.forwardRef)(function Tab2({ className, ...props }, ref) {
+  const variant = (0, import_react72.useContext)(TabsVariantContext);
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
     RadixTabs.Trigger,
     {
       ref,
@@ -5092,9 +5280,9 @@ var Tab = (0, import_react71.forwardRef)(function Tab2({ className, ...props },
   );
 });
 Tab.displayName = "Tab";
-var TabsContent = (0, import_react71.forwardRef)(
+var TabsContent = (0, import_react72.forwardRef)(
   function TabsContent2({ className, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
       RadixTabs.Content,
       {
         ref,
@@ -5110,8 +5298,8 @@ var TabsContent = (0, import_react71.forwardRef)(
 TabsContent.displayName = "TabsContent";
 
 // src/patterns/Timeline/Timeline.tsx
-var import_react72 = require("react");
-var import_jsx_runtime65 = require("react/jsx-runtime");
+var import_react73 = require("react");
+var import_jsx_runtime66 = require("react/jsx-runtime");
 var ringClass = {
   accent: "border-accent",
   ok: "border-ok",
@@ -5119,8 +5307,8 @@ var ringClass = {
   err: "border-err",
   muted: "border-text-dim"
 };
-var Timeline = (0, import_react72.forwardRef)(function Timeline2({ events, className, children, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+var Timeline = (0, import_react73.forwardRef)(function Timeline2({ events, className, children, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
     "ol",
     {
       ref,
@@ -5130,14 +5318,14 @@ var Timeline = (0, import_react72.forwardRef)(function Timeline2({ events, class
         className
       ),
       ...props,
-      children: events ? events.map((e, i) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(TimelineItem, { tone: e.tone, time: e.time, description: e.description, children: e.title }, i)) : children
+      children: events ? events.map((e, i) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(TimelineItem, { tone: e.tone, time: e.time, description: e.description, children: e.title }, i)) : children
     }
   );
 });
 Timeline.displayName = "Timeline";
-var TimelineItem = (0, import_react72.forwardRef)(function TimelineItem2({ tone = "accent", description, time, className, children, ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("li", { ref, className: cn("relative mb-[18px] last:mb-0", className), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+var TimelineItem = (0, import_react73.forwardRef)(function TimelineItem2({ tone = "accent", description, time, className, children, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("li", { ref, className: cn("relative mb-[18px] last:mb-0", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
       "span",
       {
         "aria-hidden": true,
@@ -5147,15 +5335,15 @@ var TimelineItem = (0, import_react72.forwardRef)(function TimelineItem2({ tone
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "text-[13px] font-medium", children }),
-    description && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "text-text-muted text-[12px]", children: description }),
-    time && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "text-text-dim mt-[2px] font-mono text-[10px]", children: time })
+    /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "text-[13px] font-medium", children }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "text-text-muted text-[12px]", children: description }),
+    time && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "text-text-dim mt-[2px] font-mono text-[10px]", children: time })
   ] });
 });
 TimelineItem.displayName = "TimelineItem";
 
 // src/patterns/Timeline/ActivityTimeline.tsx
-var import_react73 = require("react");
+var import_react74 = require("react");
 
 // src/patterns/Timeline/formatRelative.ts
 var SECOND = 1e3;
@@ -5190,7 +5378,7 @@ function formatRelative(input, now = /* @__PURE__ */ new Date()) {
 }
 
 // src/patterns/Timeline/ActivityTimeline.tsx
-var import_jsx_runtime66 = require("react/jsx-runtime");
+var import_jsx_runtime67 = require("react/jsx-runtime");
 var ringClass2 = {
   accent: "border-accent",
   ok: "border-ok",
@@ -5198,10 +5386,10 @@ var ringClass2 = {
   err: "border-err",
   muted: "border-text-dim"
 };
-var ActivityTimeline = (0, import_react73.forwardRef)(
+var ActivityTimeline = (0, import_react74.forwardRef)(
   function ActivityTimeline2({ events, relativeNow, className, ...props }, ref) {
     const now = relativeNow ?? /* @__PURE__ */ new Date();
-    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
       "ol",
       {
         ref,
@@ -5214,8 +5402,8 @@ var ActivityTimeline = (0, import_react73.forwardRef)(
         children: events.map((event) => {
           const tone = event.tone ?? "accent";
           const time = formatRelative(event.at, now);
-          return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("li", { className: "relative mb-4 last:mb-0", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("li", { className: "relative mb-4 last:mb-0", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
               "span",
               {
                 "aria-hidden": true,
@@ -5225,16 +5413,16 @@ var ActivityTimeline = (0, import_react73.forwardRef)(
                 )
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "flex items-baseline gap-2", children: [
-              event.icon && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { "aria-hidden": true, className: "text-text-muted font-mono text-[12px]", children: event.icon }),
-              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "text-[13px] font-medium", children: event.title }),
-              time && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("time", { className: "text-text-dim ml-auto font-mono text-[10px]", children: time })
+            /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: "flex items-baseline gap-2", children: [
+              event.icon && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { "aria-hidden": true, className: "text-text-muted font-mono text-[12px]", children: event.icon }),
+              /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "text-[13px] font-medium", children: event.title }),
+              time && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("time", { className: "text-text-dim ml-auto font-mono text-[10px]", children: time })
             ] }),
-            event.actor && /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "text-text-muted mt-[2px] flex items-center gap-[6px] text-[12px]", children: [
-              event.actor.avatar && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { "aria-hidden": true, className: "inline-flex", children: event.actor.avatar }),
-              /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { children: event.actor.name })
+            event.actor && /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: "text-text-muted mt-[2px] flex items-center gap-[6px] text-[12px]", children: [
+              event.actor.avatar && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { "aria-hidden": true, className: "inline-flex", children: event.actor.avatar }),
+              /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { children: event.actor.name })
             ] }),
-            event.payload && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "border-border bg-panel-2 mt-2 rounded-md border px-3 py-2 font-mono text-[11px] leading-[1.5]", children: event.payload })
+            event.payload && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "border-border bg-panel-2 mt-2 rounded-md border px-3 py-2 font-mono text-[11px] leading-[1.5]", children: event.payload })
           ] }, event.id);
         })
       }
@@ -5244,9 +5432,9 @@ var ActivityTimeline = (0, import_react73.forwardRef)(
 ActivityTimeline.displayName = "ActivityTimeline";
 
 // src/patterns/Topbar/Topbar.tsx
-var import_react74 = require("react");
-var import_jsx_runtime67 = require("react/jsx-runtime");
-var Topbar = (0, import_react74.forwardRef)(function Topbar2({
+var import_react75 = require("react");
+var import_jsx_runtime68 = require("react/jsx-runtime");
+var Topbar = (0, import_react75.forwardRef)(function Topbar2({
   title,
   eyebrow,
   leading,
@@ -5260,7 +5448,7 @@ var Topbar = (0, import_react74.forwardRef)(function Topbar2({
 }, ref) {
   const isTouch = density === "touch";
   const backHandler = typeof back === "function" ? back : back ? onBack : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
     "header",
     {
       ref,
@@ -5271,7 +5459,7 @@ var Topbar = (0, import_react74.forwardRef)(function Topbar2({
       ),
       ...props,
       children: [
-        isTouch && back && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+        isTouch && back && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
           "button",
           {
             type: "button",
@@ -5285,7 +5473,7 @@ var Topbar = (0, import_react74.forwardRef)(function Topbar2({
               "hover:bg-panel-2 h-touch w-touch",
               "focus-visible:ring-accent-dim outline-none focus-visible:ring-[3px]"
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
               "svg",
               {
                 width: "20",
@@ -5295,15 +5483,15 @@ var Topbar = (0, import_react74.forwardRef)(function Topbar2({
                 stroke: "currentColor",
                 strokeWidth: "2",
                 "aria-hidden": true,
-                children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("path", { d: "m15 18-6-6 6-6" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("path", { d: "m15 18-6-6 6-6" })
               }
             )
           }
         ),
         leading,
-        (title || isTouch && eyebrow) && /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: cn("min-w-0", isTouch && "flex-1"), children: [
-          isTouch && eyebrow && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "text-m-eyebrow text-accent font-mono tracking-wide uppercase", children: eyebrow }),
-          title && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+        (title || isTouch && eyebrow) && /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: cn("min-w-0", isTouch && "flex-1"), children: [
+          isTouch && eyebrow && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "text-m-eyebrow text-accent font-mono tracking-wide uppercase", children: eyebrow }),
+          title && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
             "div",
             {
               className: cn(
@@ -5313,8 +5501,8 @@ var Topbar = (0, import_react74.forwardRef)(function Topbar2({
             }
           )
         ] }),
-        !isTouch && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "flex flex-1 items-center" }),
-        actions && /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: cn("flex items-center", isTouch ? "gap-1" : "gap-3"), children: actions }),
+        !isTouch && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "flex flex-1 items-center" }),
+        actions && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: cn("flex items-center", isTouch ? "gap-1" : "gap-3"), children: actions }),
         children
       ]
     }
@@ -5323,8 +5511,8 @@ var Topbar = (0, import_react74.forwardRef)(function Topbar2({
 Topbar.displayName = "Topbar";
 
 // src/patterns/Tree/Tree.tsx
-var import_react75 = require("react");
-var import_jsx_runtime68 = require("react/jsx-runtime");
+var import_react76 = require("react");
+var import_jsx_runtime69 = require("react/jsx-runtime");
 var EMPTY_SET2 = /* @__PURE__ */ new Set();
 function flattenVisible(items, expanded, level, parentId, out) {
   for (const item of items) {
@@ -5335,7 +5523,7 @@ function flattenVisible(items, expanded, level, parentId, out) {
     }
   }
 }
-var Tree = (0, import_react75.forwardRef)(function Tree2({
+var Tree = (0, import_react76.forwardRef)(function Tree2({
   items,
   expanded: expandedProp,
   defaultExpanded,
@@ -5358,24 +5546,24 @@ var Tree = (0, import_react75.forwardRef)(function Tree2({
     onChange: onValueChange
   });
   const expandedSet = expanded ?? EMPTY_SET2;
-  const flatVisible = (0, import_react75.useMemo)(() => {
+  const flatVisible = (0, import_react76.useMemo)(() => {
     const out = [];
     flattenVisible(items, expandedSet, 1, null, out);
     return out;
   }, [items, expandedSet]);
-  const [activeId, setActiveId] = (0, import_react75.useState)(null);
-  (0, import_react75.useEffect)(() => {
+  const [activeId, setActiveId] = (0, import_react76.useState)(null);
+  (0, import_react76.useEffect)(() => {
     if (activeId && !flatVisible.some((f) => f.id === activeId)) {
       setActiveId(null);
     }
   }, [activeId, flatVisible]);
-  const tabStopId = (0, import_react75.useMemo)(() => {
+  const tabStopId = (0, import_react76.useMemo)(() => {
     if (activeId && flatVisible.some((f) => f.id === activeId)) return activeId;
     if (value && flatVisible.some((f) => f.id === value)) return value;
     return flatVisible[0]?.id ?? null;
   }, [activeId, flatVisible, value]);
-  const listRef = (0, import_react75.useRef)(null);
-  const setRefs = (0, import_react75.useCallback)(
+  const listRef = (0, import_react76.useRef)(null);
+  const setRefs = (0, import_react76.useCallback)(
     (node) => {
       listRef.current = node;
       if (typeof ref === "function") ref(node);
@@ -5383,20 +5571,20 @@ var Tree = (0, import_react75.forwardRef)(function Tree2({
     },
     [ref]
   );
-  const focusItem = (0, import_react75.useCallback)((id) => {
+  const focusItem = (0, import_react76.useCallback)((id) => {
     const root = listRef.current;
     if (!root) return;
     const el = root.querySelector(`[data-treeitem-id="${CSS.escape(id)}"]`);
     el?.focus();
   }, []);
-  const moveActive = (0, import_react75.useCallback)(
+  const moveActive = (0, import_react76.useCallback)(
     (id) => {
       setActiveId(id);
       queueMicrotask(() => focusItem(id));
     },
     [focusItem]
   );
-  const toggle = (0, import_react75.useCallback)(
+  const toggle = (0, import_react76.useCallback)(
     (id) => {
       setExpanded((prev) => {
         const next = new Set(prev ?? EMPTY_SET2);
@@ -5407,7 +5595,7 @@ var Tree = (0, import_react75.forwardRef)(function Tree2({
     },
     [setExpanded]
   );
-  const expand = (0, import_react75.useCallback)(
+  const expand = (0, import_react76.useCallback)(
     (id) => {
       setExpanded((prev) => {
         const base = prev ?? EMPTY_SET2;
@@ -5419,7 +5607,7 @@ var Tree = (0, import_react75.forwardRef)(function Tree2({
     },
     [setExpanded]
   );
-  const collapse = (0, import_react75.useCallback)(
+  const collapse = (0, import_react76.useCallback)(
     (id) => {
       setExpanded((prev) => {
         const base = prev ?? EMPTY_SET2;
@@ -5431,13 +5619,13 @@ var Tree = (0, import_react75.forwardRef)(function Tree2({
     },
     [setExpanded]
   );
-  const selectItem = (0, import_react75.useCallback)(
+  const selectItem = (0, import_react76.useCallback)(
     (id) => {
       setValue(id);
     },
     [setValue]
   );
-  const handleKeyDown = (0, import_react75.useCallback)(
+  const handleKeyDown = (0, import_react76.useCallback)(
     (e) => {
       onKeyDown?.(e);
       if (e.defaultPrevented) return;
@@ -5517,7 +5705,7 @@ var Tree = (0, import_react75.forwardRef)(function Tree2({
       toggle
     ]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "ul",
     {
       ref: setRefs,
@@ -5525,7 +5713,7 @@ var Tree = (0, import_react75.forwardRef)(function Tree2({
       className: cn("flex flex-col gap-px text-[12px]", className),
       onKeyDown: handleKeyDown,
       ...props,
-      children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+      children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
         TreeItemRow,
         {
           item,
@@ -5560,8 +5748,8 @@ function TreeItemRow({
   const isExpanded = hasChildren && expanded.has(item.id);
   const isSelected = selected === item.id;
   const isTabStop = tabStopId === item.id;
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("li", { role: "none", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("li", { role: "none", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
       "div",
       {
         role: "treeitem",
@@ -5584,14 +5772,14 @@ function TreeItemRow({
           isSelected ? "bg-accent-dim text-accent" : "text-text hover:bg-panel-2"
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { "aria-hidden": true, className: "text-text-dim grid w-3 place-items-center text-[10px]", children: hasChildren ? isExpanded ? "\u25BE" : "\u25B8" : "" }),
-          item.icon && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { "aria-hidden": true, className: "text-[12px] opacity-80", children: item.icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "flex-1 truncate", children: item.label }),
+          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { "aria-hidden": true, className: "text-text-dim grid w-3 place-items-center text-[10px]", children: hasChildren ? isExpanded ? "\u25BE" : "\u25B8" : "" }),
+          item.icon && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { "aria-hidden": true, className: "text-[12px] opacity-80", children: item.icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "flex-1 truncate", children: item.label }),
           item.trailing
         ]
       }
     ),
-    hasChildren && isExpanded && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("ul", { role: "group", className: "flex flex-col gap-px", children: (item.children ?? []).map((child) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    hasChildren && isExpanded && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("ul", { role: "group", className: "flex flex-col gap-px", children: (item.children ?? []).map((child) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
       TreeItemRow,
       {
         item: child,
@@ -5610,9 +5798,9 @@ function TreeItemRow({
 
 // src/patterns/WizardDialog/WizardDialog.tsx
 var RadixDialog5 = __toESM(require("@radix-ui/react-dialog"), 1);
-var import_react76 = require("react");
-var import_jsx_runtime69 = require("react/jsx-runtime");
-var WizardDialog = (0, import_react76.forwardRef)(function WizardDialog2({
+var import_react77 = require("react");
+var import_jsx_runtime70 = require("react/jsx-runtime");
+var WizardDialog = (0, import_react77.forwardRef)(function WizardDialog2({
   open,
   defaultOpen,
   onOpenChange,
@@ -5628,19 +5816,19 @@ var WizardDialog = (0, import_react76.forwardRef)(function WizardDialog2({
   cancelLabel,
   onCancel
 }, ref) {
-  const [current, setCurrent] = (0, import_react76.useState)(initialStep);
+  const [current, setCurrent] = (0, import_react77.useState)(initialStep);
   const total = steps.length;
   const safeCurrent = Math.min(current, Math.max(0, total - 1));
   const step = steps[safeCurrent];
-  const goTo = (0, import_react76.useCallback)(
+  const goTo = (0, import_react77.useCallback)(
     (index) => {
       setCurrent(Math.min(Math.max(0, index), Math.max(0, total - 1)));
     },
     [total]
   );
-  const goNext = (0, import_react76.useCallback)(() => setCurrent((c) => Math.min(c + 1, total - 1)), [total]);
-  const goBack = (0, import_react76.useCallback)(() => setCurrent((c) => Math.max(c - 1, 0)), []);
-  const ctx = (0, import_react76.useMemo)(
+  const goNext = (0, import_react77.useCallback)(() => setCurrent((c) => Math.min(c + 1, total - 1)), [total]);
+  const goBack = (0, import_react77.useCallback)(() => setCurrent((c) => Math.max(c - 1, 0)), []);
+  const ctx = (0, import_react77.useMemo)(
     () => ({
       current: safeCurrent,
       total,
@@ -5652,7 +5840,7 @@ var WizardDialog = (0, import_react76.forwardRef)(function WizardDialog2({
     }),
     [safeCurrent, total, goNext, goBack, goTo]
   );
-  const stepperSteps = (0, import_react76.useMemo)(() => steps.map((s) => ({ id: s.id, label: s.label })), [steps]);
+  const stepperSteps = (0, import_react77.useMemo)(() => steps.map((s) => ({ id: s.id, label: s.label })), [steps]);
   if (!step) return null;
   const canAdvance = step.canAdvance ? step.canAdvance(ctx) : true;
   const body = typeof step.content === "function" ? step.content(ctx) : step.content;
@@ -5663,23 +5851,23 @@ var WizardDialog = (0, import_react76.forwardRef)(function WizardDialog2({
       goNext();
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(DialogRoot, { open, defaultOpen, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(DialogContent, { ref, width, children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(WizardTitle, { children: title }),
-    description && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(WizardDescription, { children: description }),
-    /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "mb-5", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Stepper, { steps: stepperSteps, current: safeCurrent }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "mb-5", children: body }),
-    /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex justify-end gap-2", children: [
-      cancelLabel && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Button, { type: "button", variant: "ghost", onClick: onCancel, children: cancelLabel }),
-      /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Button, { type: "button", variant: "secondary", onClick: goBack, disabled: ctx.isFirst, children: backLabel }),
-      /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Button, { type: "button", variant: "primary", onClick: handlePrimary, disabled: !canAdvance, children: ctx.isLast ? completeLabel : nextLabel })
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(DialogRoot, { open, defaultOpen, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(DialogContent, { ref, width, children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(WizardTitle, { children: title }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(WizardDescription, { children: description }),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "mb-5", children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Stepper, { steps: stepperSteps, current: safeCurrent }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "mb-5", children: body }),
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "flex justify-end gap-2", children: [
+      cancelLabel && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Button, { type: "button", variant: "ghost", onClick: onCancel, children: cancelLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Button, { type: "button", variant: "secondary", onClick: goBack, disabled: ctx.isFirst, children: backLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Button, { type: "button", variant: "primary", onClick: handlePrimary, disabled: !canAdvance, children: ctx.isLast ? completeLabel : nextLabel })
     ] })
   ] }) });
 });
 function WizardTitle({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(RadixDialog5.Title, { className: "mb-2 text-[16px] font-medium", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(RadixDialog5.Title, { className: "mb-2 text-[16px] font-medium", children });
 }
 function WizardDescription({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(RadixDialog5.Description, { className: "text-text-muted mb-4 text-[13px] leading-[1.55]", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(RadixDialog5.Description, { className: "text-text-muted mb-4 text-[13px] leading-[1.55]", children });
 }
 WizardDialog.displayName = "WizardDialog";
 // Annotate the CommonJS export names for ESM import in node:
@@ -5745,6 +5933,7 @@ WizardDialog.displayName = "WizardDialog";
   HoverCardRoot,
   HoverCardTrigger,
   IconButton,
+  InlineEdit,
   Input,
   Kbd,
   LargeTitle,