@openwarelabs/ui 0.1.1 → 0.3.0

package/dist/index.js

@@ -1,6 +1,3 @@
-// src/components/Button/Button.tsx
-import { forwardRef } from "react";
-
 // src/utils/cx.ts
 function cx(...values) {
   const classes = [];
@@ -15,6 +12,52 @@ function cx(...values) {
   return classes.join(" ");
 }
 
+// src/components/Text/Text.tsx
+import { jsx } from "react/jsx-runtime";
+var elements = {
+  hero: "h1",
+  "page-title": "h1",
+  "section-title": "h2",
+  heading: "h3",
+  lead: "p",
+  prose: "p",
+  "dialog-title": "h2",
+  "card-title": "h3",
+  body: "p",
+  copy: "p",
+  label: "span",
+  button: "span",
+  caption: "span",
+  badge: "span",
+  overline: "span",
+  code: "code",
+  kbd: "kbd"
+};
+var mutedByDefault = ["lead", "copy", "caption", "overline"];
+function Text({ variant = "body", as, tone, align, truncate = false, className, children, ...props }) {
+  const Element = as ?? elements[variant];
+  const colour = tone ?? (mutedByDefault.includes(variant) ? "muted" : void 0);
+  return /* @__PURE__ */ jsx(
+    Element,
+    {
+      className: cx(
+        "ow-text",
+        `ow-type-${variant}`,
+        `ow-text--${variant}`,
+        colour && `ow-text--${colour}`,
+        align && align !== "start" && `ow-text--${align}`,
+        truncate && "ow-text--truncate",
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+
+// src/components/Button/Button.tsx
+import { forwardRef } from "react";
+
 // src/utils/text.ts
 function getInitials(name) {
   const words = name.trim().split(/\s+/).filter(Boolean);
@@ -27,9 +70,9 @@ function toAriaShortcut(shortcut) {
 }
 
 // src/components/Spinner/Spinner.tsx
-import { jsx } from "react/jsx-runtime";
+import { jsx as jsx2 } from "react/jsx-runtime";
 function Spinner({ size = "md", tone = "primary", label = "Loading", className }) {
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx2(
     "span",
     {
       className: cx("ow-spinner", `ow-spinner--${size}`, `ow-spinner--${tone}`, className),
@@ -39,7 +82,7 @@ function Spinner({ size = "md", tone = "primary", label = "Loading", className }
 }
 
 // src/components/Button/Button.tsx
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs } from "react/jsx-runtime";
 function buttonClassName({
   variant = "secondary",
   size = "md",
@@ -70,7 +113,7 @@ var Button = forwardRef(function Button2({
   variant = "secondary",
   ...buttonProps
 }, ref) {
-  const leading = loading ? /* @__PURE__ */ jsx2(Spinner, { size: "sm", tone: "current", label: "" }) : startIcon;
+  const leading = loading ? /* @__PURE__ */ jsx3(Spinner, { size: "sm", tone: "current", label: "" }) : startIcon;
   return /* @__PURE__ */ jsxs(
     "button",
     {
@@ -88,10 +131,10 @@ var Button = forwardRef(function Button2({
       "aria-keyshortcuts": shortcut ? toAriaShortcut(shortcut) : void 0,
       ...buttonProps,
       children: [
-        leading ? /* @__PURE__ */ jsx2("span", { className: "ow-button__icon", children: leading }) : null,
+        leading ? /* @__PURE__ */ jsx3("span", { className: "ow-button__icon", children: leading }) : null,
         iconOnly && loading ? null : children,
-        endIcon && !iconOnly ? /* @__PURE__ */ jsx2("span", { className: "ow-button__icon", children: endIcon }) : null,
-        shortcut && !iconOnly ? /* @__PURE__ */ jsx2("kbd", { "aria-hidden": "true", className: "ow-button__shortcut", children: shortcut }) : null
+        endIcon && !iconOnly ? /* @__PURE__ */ jsx3("span", { className: "ow-button__icon", children: endIcon }) : null,
+        shortcut && !iconOnly ? /* @__PURE__ */ jsx3("kbd", { "aria-hidden": "true", className: "ow-button__shortcut", children: shortcut }) : null
       ]
     }
   );
@@ -123,10 +166,10 @@ function useControllableState(value, defaultValue, onChange) {
 }
 
 // src/icons.tsx
-import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
 function icon(paths) {
   return function Icon({ size = 16, strokeWidth = 2, ...props }) {
-    return /* @__PURE__ */ jsx3(
+    return /* @__PURE__ */ jsx4(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
@@ -146,160 +189,160 @@ function icon(paths) {
     );
   };
 }
-var CheckIcon = icon(/* @__PURE__ */ jsx3("path", { d: "M20 6 9 17l-5-5" }));
-var ChevronDownIcon = icon(/* @__PURE__ */ jsx3("path", { d: "m6 9 6 6 6-6" }));
+var CheckIcon = icon(/* @__PURE__ */ jsx4("path", { d: "M20 6 9 17l-5-5" }));
+var ChevronDownIcon = icon(/* @__PURE__ */ jsx4("path", { d: "m6 9 6 6 6-6" }));
 var SearchIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("circle", { cx: "11", cy: "11", r: "8" }),
-    /* @__PURE__ */ jsx3("path", { d: "m21 21-4.3-4.3" })
+    /* @__PURE__ */ jsx4("circle", { cx: "11", cy: "11", r: "8" }),
+    /* @__PURE__ */ jsx4("path", { d: "m21 21-4.3-4.3" })
   ] })
 );
 var CornerDownLeftIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("polyline", { points: "9 10 4 15 9 20" }),
-    /* @__PURE__ */ jsx3("path", { d: "M20 4v7a4 4 0 0 1-4 4H4" })
+    /* @__PURE__ */ jsx4("polyline", { points: "9 10 4 15 9 20" }),
+    /* @__PURE__ */ jsx4("path", { d: "M20 4v7a4 4 0 0 1-4 4H4" })
   ] })
 );
 var XIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "M18 6 6 18" }),
-    /* @__PURE__ */ jsx3("path", { d: "m6 6 12 12" })
+    /* @__PURE__ */ jsx4("path", { d: "M18 6 6 18" }),
+    /* @__PURE__ */ jsx4("path", { d: "m6 6 12 12" })
   ] })
 );
 var UserIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }),
-    /* @__PURE__ */ jsx3("circle", { cx: "12", cy: "7", r: "4" })
+    /* @__PURE__ */ jsx4("path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }),
+    /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "7", r: "4" })
   ] })
 );
 var TrashIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "M3 6h18" }),
-    /* @__PURE__ */ jsx3("path", { d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" }),
-    /* @__PURE__ */ jsx3("path", { d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" }),
-    /* @__PURE__ */ jsx3("line", { x1: "10", x2: "10", y1: "11", y2: "17" }),
-    /* @__PURE__ */ jsx3("line", { x1: "14", x2: "14", y1: "11", y2: "17" })
+    /* @__PURE__ */ jsx4("path", { d: "M3 6h18" }),
+    /* @__PURE__ */ jsx4("path", { d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" }),
+    /* @__PURE__ */ jsx4("path", { d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" }),
+    /* @__PURE__ */ jsx4("line", { x1: "10", x2: "10", y1: "11", y2: "17" }),
+    /* @__PURE__ */ jsx4("line", { x1: "14", x2: "14", y1: "11", y2: "17" })
   ] })
 );
 var CircleCheckIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("circle", { cx: "12", cy: "12", r: "10" }),
-    /* @__PURE__ */ jsx3("path", { d: "m9 12 2 2 4-4" })
+    /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx4("path", { d: "m9 12 2 2 4-4" })
   ] })
 );
 var CircleAlertIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("circle", { cx: "12", cy: "12", r: "10" }),
-    /* @__PURE__ */ jsx3("line", { x1: "12", x2: "12", y1: "8", y2: "12" }),
-    /* @__PURE__ */ jsx3("line", { x1: "12", x2: "12.01", y1: "16", y2: "16" })
+    /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx4("line", { x1: "12", x2: "12", y1: "8", y2: "12" }),
+    /* @__PURE__ */ jsx4("line", { x1: "12", x2: "12.01", y1: "16", y2: "16" })
   ] })
 );
-var ChevronRightIcon = icon(/* @__PURE__ */ jsx3("path", { d: "m9 18 6-6-6-6" }));
-var ChevronLeftIcon = icon(/* @__PURE__ */ jsx3("path", { d: "m15 18-6-6 6-6" }));
-var ChevronUpIcon = icon(/* @__PURE__ */ jsx3("path", { d: "m18 15-6-6-6 6" }));
-var MinusIcon = icon(/* @__PURE__ */ jsx3("path", { d: "M5 12h14" }));
+var ChevronRightIcon = icon(/* @__PURE__ */ jsx4("path", { d: "m9 18 6-6-6-6" }));
+var ChevronLeftIcon = icon(/* @__PURE__ */ jsx4("path", { d: "m15 18-6-6 6-6" }));
+var ChevronUpIcon = icon(/* @__PURE__ */ jsx4("path", { d: "m18 15-6-6-6 6" }));
+var MinusIcon = icon(/* @__PURE__ */ jsx4("path", { d: "M5 12h14" }));
 var PlusIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "M5 12h14" }),
-    /* @__PURE__ */ jsx3("path", { d: "M12 5v14" })
+    /* @__PURE__ */ jsx4("path", { d: "M5 12h14" }),
+    /* @__PURE__ */ jsx4("path", { d: "M12 5v14" })
   ] })
 );
 var InfoIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("circle", { cx: "12", cy: "12", r: "10" }),
-    /* @__PURE__ */ jsx3("path", { d: "M12 16v-4" }),
-    /* @__PURE__ */ jsx3("path", { d: "M12 8h.01" })
+    /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx4("path", { d: "M12 16v-4" }),
+    /* @__PURE__ */ jsx4("path", { d: "M12 8h.01" })
   ] })
 );
 var TriangleAlertIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
-    /* @__PURE__ */ jsx3("path", { d: "M12 9v4" }),
-    /* @__PURE__ */ jsx3("path", { d: "M12 17h.01" })
+    /* @__PURE__ */ jsx4("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
+    /* @__PURE__ */ jsx4("path", { d: "M12 9v4" }),
+    /* @__PURE__ */ jsx4("path", { d: "M12 17h.01" })
   ] })
 );
 var PipetteIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "m2 22 1-1h3l9-9" }),
-    /* @__PURE__ */ jsx3("path", { d: "M3 21v-3l9-9" }),
-    /* @__PURE__ */ jsx3("path", { d: "m15 6 3.4-3.4a2.1 2.1 0 1 1 3 3L18 9l.4.4a2.1 2.1 0 1 1-3 3l-3.8-3.8a2.1 2.1 0 1 1 3-3l.4.4Z" })
+    /* @__PURE__ */ jsx4("path", { d: "m2 22 1-1h3l9-9" }),
+    /* @__PURE__ */ jsx4("path", { d: "M3 21v-3l9-9" }),
+    /* @__PURE__ */ jsx4("path", { d: "m15 6 3.4-3.4a2.1 2.1 0 1 1 3 3L18 9l.4.4a2.1 2.1 0 1 1-3 3l-3.8-3.8a2.1 2.1 0 1 1 3-3l.4.4Z" })
   ] })
 );
 var CopyIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
-    /* @__PURE__ */ jsx3("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
+    /* @__PURE__ */ jsx4("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
+    /* @__PURE__ */ jsx4("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
   ] })
 );
 var CalendarIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "M8 2v4" }),
-    /* @__PURE__ */ jsx3("path", { d: "M16 2v4" }),
-    /* @__PURE__ */ jsx3("rect", { width: "18", height: "18", x: "3", y: "4", rx: "2" }),
-    /* @__PURE__ */ jsx3("path", { d: "M3 10h18" })
+    /* @__PURE__ */ jsx4("path", { d: "M8 2v4" }),
+    /* @__PURE__ */ jsx4("path", { d: "M16 2v4" }),
+    /* @__PURE__ */ jsx4("rect", { width: "18", height: "18", x: "3", y: "4", rx: "2" }),
+    /* @__PURE__ */ jsx4("path", { d: "M3 10h18" })
   ] })
 );
 var FileIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
-    /* @__PURE__ */ jsx3("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" })
+    /* @__PURE__ */ jsx4("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
+    /* @__PURE__ */ jsx4("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" })
   ] })
 );
 var FolderIcon = icon(
-  /* @__PURE__ */ jsx3("path", { d: "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" })
+  /* @__PURE__ */ jsx4("path", { d: "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" })
 );
 var FolderOpenIcon = icon(
-  /* @__PURE__ */ jsx3("path", { d: "m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2" })
+  /* @__PURE__ */ jsx4("path", { d: "m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2" })
 );
 var UploadIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
-    /* @__PURE__ */ jsx3("polyline", { points: "17 8 12 3 7 8" }),
-    /* @__PURE__ */ jsx3("line", { x1: "12", x2: "12", y1: "3", y2: "15" })
+    /* @__PURE__ */ jsx4("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
+    /* @__PURE__ */ jsx4("polyline", { points: "17 8 12 3 7 8" }),
+    /* @__PURE__ */ jsx4("line", { x1: "12", x2: "12", y1: "3", y2: "15" })
   ] })
 );
 var ArrowUpRightIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "M7 7h10v10" }),
-    /* @__PURE__ */ jsx3("path", { d: "M7 17 17 7" })
+    /* @__PURE__ */ jsx4("path", { d: "M7 7h10v10" }),
+    /* @__PURE__ */ jsx4("path", { d: "M7 17 17 7" })
   ] })
 );
 var ArrowUpIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "m5 12 7-7 7 7" }),
-    /* @__PURE__ */ jsx3("path", { d: "M12 19V5" })
+    /* @__PURE__ */ jsx4("path", { d: "m5 12 7-7 7 7" }),
+    /* @__PURE__ */ jsx4("path", { d: "M12 19V5" })
   ] })
 );
 var ArrowDownIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "M12 5v14" }),
-    /* @__PURE__ */ jsx3("path", { d: "m19 12-7 7-7-7" })
+    /* @__PURE__ */ jsx4("path", { d: "M12 5v14" }),
+    /* @__PURE__ */ jsx4("path", { d: "m19 12-7 7-7-7" })
   ] })
 );
 var ChevronsUpDownIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("path", { d: "m7 15 5 5 5-5" }),
-    /* @__PURE__ */ jsx3("path", { d: "m7 9 5-5 5 5" })
+    /* @__PURE__ */ jsx4("path", { d: "m7 15 5 5 5-5" }),
+    /* @__PURE__ */ jsx4("path", { d: "m7 9 5-5 5 5" })
   ] })
 );
 var InboxIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("polyline", { points: "22 12 16 12 14 15 10 15 8 12 2 12" }),
-    /* @__PURE__ */ jsx3("path", { d: "M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z" })
+    /* @__PURE__ */ jsx4("polyline", { points: "22 12 16 12 14 15 10 15 8 12 2 12" }),
+    /* @__PURE__ */ jsx4("path", { d: "M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z" })
   ] })
 );
 var EllipsisIcon = icon(
   /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("circle", { cx: "12", cy: "12", r: "1" }),
-    /* @__PURE__ */ jsx3("circle", { cx: "19", cy: "12", r: "1" }),
-    /* @__PURE__ */ jsx3("circle", { cx: "5", cy: "12", r: "1" })
+    /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "12", r: "1" }),
+    /* @__PURE__ */ jsx4("circle", { cx: "19", cy: "12", r: "1" }),
+    /* @__PURE__ */ jsx4("circle", { cx: "5", cy: "12", r: "1" })
   ] })
 );
 
 // src/components/Button/ButtonGroup.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx5 } from "react/jsx-runtime";
 function ButtonGroup({ attached = true, orientation = "horizontal", className, ...props }) {
-  return /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx5(
     "div",
     {
       role: "group",
@@ -314,7 +357,7 @@ function ButtonGroup({ attached = true, orientation = "horizontal", className, .
   );
 }
 var CloseButton = forwardRef2(function CloseButton2({ size = "md", label = "Close", className, type = "button", ...buttonProps }, ref) {
-  return /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx5(
     "button",
     {
       ref,
@@ -322,13 +365,13 @@ var CloseButton = forwardRef2(function CloseButton2({ size = "md", label = "Clos
       "aria-label": label,
       className: cx("ow-close-button", `ow-close-button--${size}`, className),
       ...buttonProps,
-      children: /* @__PURE__ */ jsx4(XIcon, { size: size === "sm" ? 14 : 17 })
+      children: /* @__PURE__ */ jsx5(XIcon, { size: size === "sm" ? 14 : 17 })
     }
   );
 });
 var ToggleButton = forwardRef2(function ToggleButton2({ pressed, defaultPressed = false, onPressedChange, onClick, className, variant = "secondary", ...buttonProps }, ref) {
   const [isPressed, setPressed] = useControllableState(pressed, defaultPressed, onPressedChange);
-  return /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx5(
     Button,
     {
       ref,
@@ -386,7 +429,7 @@ function useIndicator(containerRef, selector, key) {
 }
 
 // src/components/SegmentedControl/SegmentedControl.tsx
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
 function SegmentedControl({
   options,
   value,
@@ -443,14 +486,14 @@ function SegmentedControl({
               onClick: () => setCurrent(option.value),
               onKeyDown: (event) => onKeyDown(event, index),
               children: [
-                option.icon ? /* @__PURE__ */ jsx5("span", { className: "ow-segmented__icon", children: option.icon }) : null,
+                option.icon ? /* @__PURE__ */ jsx6("span", { className: "ow-segmented__icon", children: option.icon }) : null,
                 option.label
               ]
             },
             option.value
           );
         }),
-        /* @__PURE__ */ jsx5("span", { className: "ow-indicator", "aria-hidden": "true" })
+        /* @__PURE__ */ jsx6("span", { className: "ow-indicator", "aria-hidden": "true" })
       ]
     }
   );
@@ -458,7 +501,7 @@ function SegmentedControl({
 
 // src/components/ChoiceCard/ChoiceCard.tsx
 import { forwardRef as forwardRef3 } from "react";
-import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
 var ChoiceCard = forwardRef3(function ChoiceCard2({ className, description, icon: icon2, recommended = false, shortcut, title, type = "button", ...buttonProps }, ref) {
   return /* @__PURE__ */ jsxs4(
     "button",
@@ -470,12 +513,12 @@ var ChoiceCard = forwardRef3(function ChoiceCard2({ className, description, icon
       ...buttonProps,
       children: [
         /* @__PURE__ */ jsxs4("span", { className: "ow-choice__top", children: [
-          /* @__PURE__ */ jsx6("span", { className: "ow-choice__icon", children: icon2 }),
-          shortcut ? /* @__PURE__ */ jsx6("kbd", { "aria-hidden": "true", className: "ow-choice__shortcut", children: shortcut }) : null
+          /* @__PURE__ */ jsx7("span", { className: "ow-choice__icon", children: icon2 }),
+          shortcut ? /* @__PURE__ */ jsx7("kbd", { "aria-hidden": "true", className: "ow-choice__shortcut", children: shortcut }) : null
         ] }),
         /* @__PURE__ */ jsxs4("span", { className: "ow-choice__text", children: [
-          /* @__PURE__ */ jsx6("span", { className: "ow-choice__title", children: title }),
-          /* @__PURE__ */ jsx6("span", { className: "ow-choice__description", children: description })
+          /* @__PURE__ */ jsx7("span", { className: "ow-choice__title", children: title }),
+          /* @__PURE__ */ jsx7("span", { className: "ow-choice__description", children: description })
         ] })
       ]
     }
@@ -510,7 +553,7 @@ async function copyText(text) {
 }
 
 // src/components/CodeBlock/CodeBlock.tsx
-import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
 function CopyButton({ value, label = "Copy", copiedLabel = "Copied", iconOnly = false, tone = "default", onCopy, className }) {
   const [copied, setCopied] = useState2(false);
   const timer = useRef3(0);
@@ -537,11 +580,11 @@ function CopyButton({ value, label = "Copy", copiedLabel = "Copied", iconOnly =
       },
       children: [
         /* @__PURE__ */ jsxs5("span", { className: "ow-copy-button__icon", "aria-hidden": "true", children: [
-          /* @__PURE__ */ jsx7(CopyIcon, { size: 14 }),
-          /* @__PURE__ */ jsx7(CheckIcon, { size: 14 })
+          /* @__PURE__ */ jsx8(CopyIcon, { size: 14 }),
+          /* @__PURE__ */ jsx8(CheckIcon, { size: 14 })
         ] }),
-        iconOnly ? null : /* @__PURE__ */ jsx7("span", { children: copied ? copiedLabel : label }),
-        /* @__PURE__ */ jsx7("span", { className: "ow-visually-hidden", "aria-live": "polite", children: copied ? copiedLabel : "" })
+        iconOnly ? null : /* @__PURE__ */ jsx8("span", { children: copied ? copiedLabel : label }),
+        /* @__PURE__ */ jsx8("span", { className: "ow-visually-hidden", "aria-live": "polite", children: copied ? copiedLabel : "" })
       ]
     }
   );
@@ -551,29 +594,29 @@ function CodeBlock({ code, html, title, language, showLineNumbers = false, copya
   const lines = code.replace(/\n$/, "").split("\n");
   return /* @__PURE__ */ jsxs5("div", { className: cx("ow-code-block", showLineNumbers && "ow-code-block--numbered", className), children: [
     hasHeader ? /* @__PURE__ */ jsxs5("div", { className: "ow-code-block__header", children: [
-      /* @__PURE__ */ jsx7("span", { className: "ow-code-block__title", children: title }),
-      language ? /* @__PURE__ */ jsx7("span", { className: "ow-code-block__language", children: language }) : null,
-      copyable ? /* @__PURE__ */ jsx7(CopyButton, { value: code, tone: "onDark", iconOnly: true, label: "Copy code" }) : null
-    ] }) : copyable ? /* @__PURE__ */ jsx7(CopyButton, { value: code, tone: "onDark", iconOnly: true, label: "Copy code", className: "ow-code-block__floating-copy" }) : null,
+      /* @__PURE__ */ jsx8("span", { className: "ow-code-block__title", children: title }),
+      language ? /* @__PURE__ */ jsx8("span", { className: "ow-code-block__language", children: language }) : null,
+      copyable ? /* @__PURE__ */ jsx8(CopyButton, { value: code, tone: "onDark", iconOnly: true, label: "Copy code" }) : null
+    ] }) : copyable ? /* @__PURE__ */ jsx8(CopyButton, { value: code, tone: "onDark", iconOnly: true, label: "Copy code", className: "ow-code-block__floating-copy" }) : null,
     /* @__PURE__ */ jsxs5("pre", { className: "ow-code-block__pre", style: maxHeight ? { maxHeight } : void 0, tabIndex: 0, children: [
-      showLineNumbers ? /* @__PURE__ */ jsx7("span", { className: "ow-code-block__numbers", "aria-hidden": "true", children: lines.map((_, index) => /* @__PURE__ */ jsx7("span", { children: index + 1 }, index)) }) : null,
-      html ? /* @__PURE__ */ jsx7("code", { className: "ow-code-block__code", dangerouslySetInnerHTML: { __html: html } }) : /* @__PURE__ */ jsx7("code", { className: "ow-code-block__code", children: code.replace(/\n$/, "") })
+      showLineNumbers ? /* @__PURE__ */ jsx8("span", { className: "ow-code-block__numbers", "aria-hidden": "true", children: lines.map((_, index) => /* @__PURE__ */ jsx8("span", { children: index + 1 }, index)) }) : null,
+      html ? /* @__PURE__ */ jsx8("code", { className: "ow-code-block__code", dangerouslySetInnerHTML: { __html: html } }) : /* @__PURE__ */ jsx8("code", { className: "ow-code-block__code", children: code.replace(/\n$/, "") })
     ] })
   ] });
 }
 function Snippet({ value, prompt = "$", className }) {
   return /* @__PURE__ */ jsxs5("div", { className: cx("ow-snippet", className), children: [
     /* @__PURE__ */ jsxs5("code", { className: "ow-snippet__code", children: [
-      prompt ? /* @__PURE__ */ jsx7("span", { className: "ow-snippet__prompt", "aria-hidden": "true", children: prompt }) : null,
+      prompt ? /* @__PURE__ */ jsx8("span", { className: "ow-snippet__prompt", "aria-hidden": "true", children: prompt }) : null,
       value
     ] }),
-    /* @__PURE__ */ jsx7(CopyButton, { value, iconOnly: true, label: `Copy ${value}` })
+    /* @__PURE__ */ jsx8(CopyButton, { value, iconOnly: true, label: `Copy ${value}` })
   ] });
 }
 
 // src/components/Field/Field.tsx
 import { cloneElement, isValidElement, useId } from "react";
-import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
 function Field({ label, children, hint, error, className }) {
   const generatedId = useId();
   const hintId = `${generatedId}-hint`;
@@ -583,20 +626,20 @@ function Field({ label, children, hint, error, className }) {
   const describedBy = [child?.props["aria-describedby"], hint ? hintId : void 0, error ? errorId : void 0].filter(Boolean).join(" ") || void 0;
   const invalidProp = child && typeof child.type !== "string" ? { isInvalid: child.props.isInvalid ?? Boolean(error) } : { "aria-invalid": error ? true : void 0 };
   return /* @__PURE__ */ jsxs6("div", { className: cx("ow-field", className), children: [
-    /* @__PURE__ */ jsx8("label", { className: "ow-field__label", htmlFor: controlId, children: label }),
+    /* @__PURE__ */ jsx9("label", { className: "ow-field__label", htmlFor: controlId, children: label }),
     child ? cloneElement(child, { id: controlId, "aria-describedby": describedBy, ...invalidProp }) : children,
-    hint ? /* @__PURE__ */ jsx8("p", { id: hintId, className: "ow-field__hint", children: hint }) : null,
-    error ? /* @__PURE__ */ jsx8("p", { id: errorId, role: "alert", className: "ow-field__error", children: error }) : null
+    hint ? /* @__PURE__ */ jsx9("p", { id: hintId, className: "ow-field__hint", children: hint }) : null,
+    error ? /* @__PURE__ */ jsx9("p", { id: errorId, role: "alert", className: "ow-field__error", children: error }) : null
   ] });
 }
 
 // src/components/Input/Input.tsx
 import { forwardRef as forwardRef4 } from "react";
-import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
 var Input = forwardRef4(function Input2({ className, isInvalid = false, size = "md", startContent, endContent, ...inputProps }, ref) {
   const invalid = isInvalid || void 0;
   if (startContent === void 0 && endContent === void 0) {
-    return /* @__PURE__ */ jsx9(
+    return /* @__PURE__ */ jsx10(
       "input",
       {
         ref,
@@ -617,9 +660,9 @@ var Input = forwardRef4(function Input2({ className, isInvalid = false, size = "
         className
       ),
       children: [
-        startContent !== void 0 ? /* @__PURE__ */ jsx9("span", { className: "ow-input-group__addon", children: startContent }) : null,
-        /* @__PURE__ */ jsx9("input", { ref, className: "ow-input-group__input", "aria-invalid": invalid, ...inputProps }),
-        endContent !== void 0 ? /* @__PURE__ */ jsx9("span", { className: "ow-input-group__addon", children: endContent }) : null
+        startContent !== void 0 ? /* @__PURE__ */ jsx10("span", { className: "ow-input-group__addon", children: startContent }) : null,
+        /* @__PURE__ */ jsx10("input", { ref, className: "ow-input-group__input", "aria-invalid": invalid, ...inputProps }),
+        endContent !== void 0 ? /* @__PURE__ */ jsx10("span", { className: "ow-input-group__addon", children: endContent }) : null
       ]
     }
   );
@@ -627,7 +670,7 @@ var Input = forwardRef4(function Input2({ className, isInvalid = false, size = "
 
 // src/components/SearchField/SearchField.tsx
 import { forwardRef as forwardRef5, useRef as useRef4 } from "react";
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 function assignRef(ref, value) {
   if (typeof ref === "function") ref(value);
   else if (ref) ref.current = value;
@@ -657,7 +700,7 @@ var SearchField = forwardRef5(function SearchField2({
       onSubmit?.(text);
     }
   }
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx11(
     Input,
     {
       ref: (element) => {
@@ -671,8 +714,8 @@ var SearchField = forwardRef5(function SearchField2({
       value: text,
       onChange: (event) => setText(event.target.value),
       onKeyDown: handleKeyDown,
-      startContent: /* @__PURE__ */ jsx10(SearchIcon, { size: size === "sm" ? 14 : 16 }),
-      endContent: loading ? /* @__PURE__ */ jsx10(Spinner, { size: "sm", label: "Searching" }) : text ? /* @__PURE__ */ jsx10(
+      startContent: /* @__PURE__ */ jsx11(SearchIcon, { size: size === "sm" ? 14 : 16 }),
+      endContent: loading ? /* @__PURE__ */ jsx11(Spinner, { size: "sm", label: "Searching" }) : text ? /* @__PURE__ */ jsx11(
         CloseButton,
         {
           size: "sm",
@@ -690,7 +733,7 @@ var SearchField = forwardRef5(function SearchField2({
 
 // src/components/NumberField/NumberField.tsx
 import { forwardRef as forwardRef6, useState as useState3 } from "react";
-import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
 var decimals = (step) => (String(step).split(".")[1] ?? "").length;
 var NumberField = forwardRef6(function NumberField2({
   value,
@@ -765,7 +808,7 @@ var NumberField = forwardRef6(function NumberField2({
         className
       ),
       children: [
-        /* @__PURE__ */ jsx11(
+        /* @__PURE__ */ jsx12(
           "button",
           {
             type: "button",
@@ -774,10 +817,10 @@ var NumberField = forwardRef6(function NumberField2({
             tabIndex: -1,
             disabled: disabled || atMin,
             onClick: () => stepBy(-1),
-            children: /* @__PURE__ */ jsx11(MinusIcon, { size: 14 })
+            children: /* @__PURE__ */ jsx12(MinusIcon, { size: 14 })
           }
         ),
-        /* @__PURE__ */ jsx11(
+        /* @__PURE__ */ jsx12(
           "input",
           {
             ref,
@@ -806,7 +849,7 @@ var NumberField = forwardRef6(function NumberField2({
             ...inputProps
           }
         ),
-        /* @__PURE__ */ jsx11(
+        /* @__PURE__ */ jsx12(
           "button",
           {
             type: "button",
@@ -815,7 +858,7 @@ var NumberField = forwardRef6(function NumberField2({
             tabIndex: -1,
             disabled: disabled || atMax,
             onClick: () => stepBy(1),
-            children: /* @__PURE__ */ jsx11(PlusIcon, { size: 14 })
+            children: /* @__PURE__ */ jsx12(PlusIcon, { size: 14 })
           }
         )
       ]
@@ -825,7 +868,7 @@ var NumberField = forwardRef6(function NumberField2({
 
 // src/components/InputOTP/InputOTP.tsx
 import { useRef as useRef5 } from "react";
-import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
 function InputOTP({
   length = 6,
   value,
@@ -889,8 +932,8 @@ function InputOTP({
   }
   return /* @__PURE__ */ jsxs9("div", { role: "group", "aria-label": ariaLabel, className: cx("ow-otp", isInvalid && "ow-otp--invalid", className), children: [
     chars.map((char, index) => /* @__PURE__ */ jsxs9("span", { className: "ow-otp__slot", children: [
-      groupSize && index > 0 && index % groupSize === 0 ? /* @__PURE__ */ jsx12("span", { className: "ow-otp__separator", "aria-hidden": "true" }) : null,
-      /* @__PURE__ */ jsx12(
+      groupSize && index > 0 && index % groupSize === 0 ? /* @__PURE__ */ jsx13("span", { className: "ow-otp__separator", "aria-hidden": "true" }) : null,
+      /* @__PURE__ */ jsx13(
         "input",
         {
           ref: (element) => {
@@ -918,7 +961,7 @@ function InputOTP({
         }
       )
     ] }, index)),
-    name ? /* @__PURE__ */ jsx12("input", { type: "hidden", name, value: code }) : null
+    name ? /* @__PURE__ */ jsx13("input", { type: "hidden", name, value: code }) : null
   ] });
 }
 
@@ -957,7 +1000,7 @@ function resizeTextArea(textArea) {
 }
 
 // src/components/Textarea/Textarea.tsx
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 var defaultAutoGrowMaxHeight = 180;
 function assignRef2(ref, element) {
   if (typeof ref === "function") ref(element);
@@ -991,7 +1034,7 @@ var Textarea = forwardRef7(function Textarea2({
     ...style,
     maxHeight: typeof autoGrowMaxHeight === "number" ? `${autoGrowMaxHeight}px` : autoGrowMaxHeight
   } : style;
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14(
     "textarea",
     {
       ...textareaProps,
@@ -1042,6 +1085,25 @@ function useFloating({
     const rect = anchor.getBoundingClientRect();
     const width = Math.max(floating.offsetWidth, matchWidth ? rect.width : 0);
     const height = floating.scrollHeight;
+    if (placement === "left" || placement === "right") {
+      const roomLeft = rect.left - offset - margin;
+      const roomRight = window.innerWidth - rect.right - offset - margin;
+      const onLeft = placement === "left" ? width <= roomLeft || roomLeft > roomRight : width > roomRight && roomLeft > roomRight;
+      const top2 = Math.min(Math.max(margin, rect.top + rect.height / 2 - height / 2), window.innerHeight - height - margin);
+      floating.dataset.side = onLeft ? "left" : "right";
+      setStyle({
+        position: "fixed",
+        inset: "auto",
+        margin: 0,
+        left: onLeft ? "auto" : rect.right + offset,
+        right: onLeft ? window.innerWidth - rect.left + offset : "auto",
+        top: top2,
+        bottom: "auto",
+        maxHeight: Math.max(120, Math.min(maxHeight, window.innerHeight - 2 * margin)),
+        ["--ow-floating-origin"]: `${onLeft ? "right" : "left"} center`
+      });
+      return;
+    }
     const below = window.innerHeight - rect.bottom - offset - margin;
     const above = rect.top - offset - margin;
     const wantsTop = placement.startsWith("top");
@@ -1137,7 +1199,7 @@ function usePresence(open, exitMs = exitDuration) {
 }
 
 // src/components/Select/Select.tsx
-import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
 var menuGap = 4;
 var menuMaxHeight = 288;
 var typeaheadResetMs = 600;
@@ -1326,10 +1388,10 @@ function Select({
         onMouseDown: (event) => event.preventDefault(),
         onClick: () => choose(index),
         children: [
-          /* @__PURE__ */ jsx14("span", { className: "ow-option__check", children: isSelected ? /* @__PURE__ */ jsx14(CheckIcon, { size: 14 }) : null }),
+          /* @__PURE__ */ jsx15("span", { className: "ow-option__check", children: isSelected ? /* @__PURE__ */ jsx15(CheckIcon, { size: 14 }) : null }),
           /* @__PURE__ */ jsxs10("span", { className: "ow-option__text", children: [
-            /* @__PURE__ */ jsx14("span", { className: cx("ow-option__label", valueClassName), children: option.label }),
-            option.description ? /* @__PURE__ */ jsx14("span", { className: "ow-option__description", children: option.description }) : null
+            /* @__PURE__ */ jsx15("span", { className: cx("ow-option__label", valueClassName), children: option.label }),
+            option.description ? /* @__PURE__ */ jsx15("span", { className: "ow-option__description", children: option.description }) : null
           ] })
         ]
       },
@@ -1361,8 +1423,8 @@ function Select({
           if (!menuRef.current?.contains(event.relatedTarget)) close();
         },
         children: [
-          /* @__PURE__ */ jsx14("span", { className: cx("ow-select__value", !selected && "ow-select__value--placeholder", valueClassName), children: selected ? selected.label : placeholder }),
-          /* @__PURE__ */ jsx14(ChevronDownIcon, { size: size === "sm" ? 14 : 16, className: "ow-select__chevron" })
+          /* @__PURE__ */ jsx15("span", { className: cx("ow-select__value", !selected && "ow-select__value--placeholder", valueClassName), children: selected ? selected.label : placeholder }),
+          /* @__PURE__ */ jsx15(ChevronDownIcon, { size: size === "sm" ? 14 : 16, className: "ow-select__chevron" })
         ]
       }
     ),
@@ -1382,11 +1444,11 @@ function Select({
         children: [
           options.map(
             (item, groupIndex) => isGroup(item) ? /* @__PURE__ */ jsxs10("div", { role: "group", "aria-label": item.label, className: "ow-listbox__group", children: [
-              /* @__PURE__ */ jsx14("div", { className: "ow-listbox__group-label", "aria-hidden": "true", children: item.label }),
+              /* @__PURE__ */ jsx15("div", { className: "ow-listbox__group-label", "aria-hidden": "true", children: item.label }),
               item.options.map(renderOption)
             ] }, `group-${item.label}-${groupIndex}`) : renderOption(item)
           ),
-          flat.length === 0 ? /* @__PURE__ */ jsx14("div", { className: "ow-listbox__empty", children: "No options" }) : null
+          flat.length === 0 ? /* @__PURE__ */ jsx15("div", { className: "ow-listbox__empty", children: "No options" }) : null
         ]
       }
     ) : null
@@ -1402,7 +1464,7 @@ import {
   useRef as useRef8,
   useState as useState7
 } from "react";
-import { Fragment as Fragment3, jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
 function assignRef3(ref, value) {
   if (typeof ref === "function") ref(value);
   else if (ref) ref.current = value;
@@ -1529,7 +1591,7 @@ var Combobox = forwardRef8(function Combobox2({
           className
         ),
         children: [
-          /* @__PURE__ */ jsx15(
+          /* @__PURE__ */ jsx16(
             "input",
             {
               ref: (element) => {
@@ -1560,7 +1622,7 @@ var Combobox = forwardRef8(function Combobox2({
               ...aria
             }
           ),
-          /* @__PURE__ */ jsx15(
+          /* @__PURE__ */ jsx16(
             "button",
             {
               type: "button",
@@ -1576,7 +1638,7 @@ var Combobox = forwardRef8(function Combobox2({
                   inputRef.current?.focus();
                 }
               },
-              children: /* @__PURE__ */ jsx15(ChevronDownIcon, { size: size === "sm" ? 14 : 16, className: cx("ow-select__chevron", isOpen && "ow-combobox__chevron--open") })
+              children: /* @__PURE__ */ jsx16(ChevronDownIcon, { size: size === "sm" ? 14 : 16, className: cx("ow-select__chevron", isOpen && "ow-combobox__chevron--open") })
             }
           )
         ]
@@ -1613,17 +1675,17 @@ var Combobox = forwardRef8(function Combobox2({
                 onMouseDown: (event) => event.preventDefault(),
                 onClick: () => choose(option),
                 children: [
-                  /* @__PURE__ */ jsx15("span", { className: "ow-option__check", children: isSelected ? /* @__PURE__ */ jsx15(CheckIcon, { size: 14 }) : null }),
+                  /* @__PURE__ */ jsx16("span", { className: "ow-option__check", children: isSelected ? /* @__PURE__ */ jsx16(CheckIcon, { size: 14 }) : null }),
                   /* @__PURE__ */ jsxs11("span", { className: "ow-option__text", children: [
-                    /* @__PURE__ */ jsx15("span", { className: "ow-option__label", children: option.label }),
-                    option.description ? /* @__PURE__ */ jsx15("span", { className: "ow-option__description", children: option.description }) : null
+                    /* @__PURE__ */ jsx16("span", { className: "ow-option__label", children: option.label }),
+                    option.description ? /* @__PURE__ */ jsx16("span", { className: "ow-option__description", children: option.description }) : null
                   ] })
                 ]
               },
               option.value
             );
           }),
-          results.length === 0 ? /* @__PURE__ */ jsx15("div", { className: "ow-listbox__empty", role: "presentation", children: emptyMessage }) : null
+          results.length === 0 ? /* @__PURE__ */ jsx16("div", { className: "ow-listbox__empty", role: "presentation", children: emptyMessage }) : null
         ]
       }
     ) : null
@@ -1639,7 +1701,7 @@ import {
   useId as useId4,
   useRef as useRef9
 } from "react";
-import { jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
 var CheckboxGroupContext = createContext(null);
 function assignRef4(ref, value) {
   if (typeof ref === "function") ref(value);
@@ -1677,7 +1739,7 @@ var Checkbox = forwardRef9(function Checkbox2({
         children === void 0 && className
       ),
       children: [
-        /* @__PURE__ */ jsx16(
+        /* @__PURE__ */ jsx17(
           "input",
           {
             ref: (element) => {
@@ -1698,7 +1760,7 @@ var Checkbox = forwardRef9(function Checkbox2({
             ...inputProps
           }
         ),
-        indeterminate ? /* @__PURE__ */ jsx16(MinusIcon, { className: "ow-checkbox__check ow-checkbox__check--dash", size: size === "sm" ? 10 : 12, strokeWidth: 3 }) : /* @__PURE__ */ jsx16(CheckIcon, { className: "ow-checkbox__check", size: size === "sm" ? 10 : 12, strokeWidth: 3 })
+        indeterminate ? /* @__PURE__ */ jsx17(MinusIcon, { className: "ow-checkbox__check ow-checkbox__check--dash", size: size === "sm" ? 10 : 12, strokeWidth: 3 }) : /* @__PURE__ */ jsx17(CheckIcon, { className: "ow-checkbox__check", size: size === "sm" ? 10 : 12, strokeWidth: 3 })
       ]
     }
   );
@@ -1706,8 +1768,8 @@ var Checkbox = forwardRef9(function Checkbox2({
   return /* @__PURE__ */ jsxs12("label", { className: cx("ow-check-label", (disabled || inGroup && group.disabled) && "ow-check-label--disabled", className), children: [
     box,
     /* @__PURE__ */ jsxs12("span", { className: "ow-check-label__text", children: [
-      /* @__PURE__ */ jsx16("span", { children }),
-      description ? /* @__PURE__ */ jsx16("span", { id: descriptionId, className: "ow-check-label__description", children: description }) : null
+      /* @__PURE__ */ jsx17("span", { children }),
+      description ? /* @__PURE__ */ jsx17("span", { id: descriptionId, className: "ow-check-label__description", children: description }) : null
     ] })
   ] });
 });
@@ -1727,7 +1789,7 @@ function CheckboxGroup({
   const [current, setCurrent] = useControllableState(value, defaultValue, onChange);
   const generatedName = useId4();
   const errorId = useId4();
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx17(
     CheckboxGroupContext.Provider,
     {
       value: {
@@ -1738,7 +1800,7 @@ function CheckboxGroup({
           setCurrent(checked ? [...current.filter((v) => v !== item), item] : current.filter((v) => v !== item));
         }
       },
-      children: /* @__PURE__ */ jsx16(
+      children: /* @__PURE__ */ jsx17(
         Fieldset,
         {
           legend: label,
@@ -1763,10 +1825,10 @@ function Fieldset({ legend, description, error, errorId, disabled, children, cla
       disabled,
       "aria-describedby": [description ? descriptionId : "", error ? resolvedErrorId : ""].filter(Boolean).join(" ") || void 0,
       children: [
-        /* @__PURE__ */ jsx16("legend", { className: "ow-fieldset__legend", children: legend }),
-        description ? /* @__PURE__ */ jsx16("p", { id: descriptionId, className: "ow-fieldset__description", children: description }) : null,
-        /* @__PURE__ */ jsx16("div", { className: "ow-fieldset__content", children }),
-        error ? /* @__PURE__ */ jsx16("p", { id: resolvedErrorId, role: "alert", className: "ow-field__error", children: error }) : null
+        /* @__PURE__ */ jsx17("legend", { className: "ow-fieldset__legend", children: legend }),
+        description ? /* @__PURE__ */ jsx17("p", { id: descriptionId, className: "ow-fieldset__description", children: description }) : null,
+        /* @__PURE__ */ jsx17("div", { className: "ow-fieldset__content", children }),
+        error ? /* @__PURE__ */ jsx17("p", { id: resolvedErrorId, role: "alert", className: "ow-field__error", children: error }) : null
       ]
     }
   );
@@ -1774,7 +1836,7 @@ function Fieldset({ legend, description, error, errorId, disabled, children, cla
 
 // src/components/RadioGroup/RadioGroup.tsx
 import { createContext as createContext2, useContext as useContext2, useId as useId5 } from "react";
-import { jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
 var RadioGroupContext = createContext2(null);
 function RadioGroup({
   label,
@@ -1792,7 +1854,7 @@ function RadioGroup({
 }) {
   const [current, select] = useControllableState(value, defaultValue, onChange);
   const generatedName = useId5();
-  return /* @__PURE__ */ jsx17(RadioGroupContext.Provider, { value: { name: name ?? generatedName, value: current, select, disabled }, children: /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx18(RadioGroupContext.Provider, { value: { name: name ?? generatedName, value: current, select, disabled }, children: /* @__PURE__ */ jsx18(
     Fieldset,
     {
       legend: label,
@@ -1814,7 +1876,7 @@ function Radio({ value, children, description, disabled, className, ...inputProp
   if (!group) throw new Error("Radio must be inside <RadioGroup>.");
   const isDisabled = disabled || group.disabled;
   return /* @__PURE__ */ jsxs13("label", { className: cx("ow-check-label", "ow-radio-label", isDisabled && "ow-check-label--disabled", className), children: [
-    /* @__PURE__ */ jsx17("span", { className: "ow-radio", children: /* @__PURE__ */ jsx17(
+    /* @__PURE__ */ jsx18("span", { className: "ow-radio", children: /* @__PURE__ */ jsx18(
       "input",
       {
         type: "radio",
@@ -1829,17 +1891,17 @@ function Radio({ value, children, description, disabled, className, ...inputProp
       }
     ) }),
     /* @__PURE__ */ jsxs13("span", { className: "ow-check-label__text", children: [
-      /* @__PURE__ */ jsx17("span", { children }),
-      description ? /* @__PURE__ */ jsx17("span", { id: descriptionId, className: "ow-check-label__description", children: description }) : null
+      /* @__PURE__ */ jsx18("span", { children }),
+      description ? /* @__PURE__ */ jsx18("span", { id: descriptionId, className: "ow-check-label__description", children: description }) : null
     ] })
   ] });
 }
 
 // src/components/Switch/Switch.tsx
 import { forwardRef as forwardRef10 } from "react";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 var Switch = forwardRef10(function Switch2({ checked, onChange, label, className, disabled, ...buttonProps }, ref) {
-  return /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx19(
     "button",
     {
       ref,
@@ -1851,14 +1913,14 @@ var Switch = forwardRef10(function Switch2({ checked, onChange, label, className
       className: cx("ow-switch", checked && "ow-switch--on", className),
       onClick: () => onChange(!checked),
       ...buttonProps,
-      children: /* @__PURE__ */ jsx18("span", { className: "ow-switch__knob" })
+      children: /* @__PURE__ */ jsx19("span", { className: "ow-switch__knob" })
     }
   );
 });
 
 // src/components/Slider/Slider.tsx
 import { useId as useId6 } from "react";
-import { jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
 function Slider({
   value,
   defaultValue,
@@ -1884,7 +1946,7 @@ function Slider({
   const end = () => onChangeEnd?.(current);
   const input = (which) => {
     const own = which === "low" ? low : high;
-    return /* @__PURE__ */ jsx19(
+    return /* @__PURE__ */ jsx20(
       "input",
       {
         type: "range",
@@ -1911,11 +1973,11 @@ function Slider({
   };
   return /* @__PURE__ */ jsxs14("div", { className: cx("ow-slider", disabled && "ow-slider--disabled", className), children: [
     label || showValue ? /* @__PURE__ */ jsxs14("div", { className: "ow-slider__header", children: [
-      label ? /* @__PURE__ */ jsx19("span", { id: labelId, className: "ow-slider__label", children: label }) : /* @__PURE__ */ jsx19("span", {}),
-      showValue ? /* @__PURE__ */ jsx19("output", { className: "ow-slider__value", "aria-hidden": "true", children: display }) : null
+      label ? /* @__PURE__ */ jsx20("span", { id: labelId, className: "ow-slider__label", children: label }) : /* @__PURE__ */ jsx20("span", {}),
+      showValue ? /* @__PURE__ */ jsx20("output", { className: "ow-slider__value", "aria-hidden": "true", children: display }) : null
     ] }) : null,
     /* @__PURE__ */ jsxs14("div", { className: "ow-slider__control", style, children: [
-      /* @__PURE__ */ jsx19("span", { className: "ow-slider__track", "aria-hidden": "true", children: /* @__PURE__ */ jsx19("span", { className: "ow-slider__fill" }) }),
+      /* @__PURE__ */ jsx20("span", { className: "ow-slider__track", "aria-hidden": "true", children: /* @__PURE__ */ jsx20("span", { className: "ow-slider__fill" }) }),
       isRange ? input("low") : null,
       input("high")
     ] })
@@ -1924,7 +1986,7 @@ function Slider({
 
 // src/components/FileDropZone/FileDropZone.tsx
 import { useId as useId7, useRef as useRef10, useState as useState8 } from "react";
-import { jsx as jsx20, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
 function matches(file, accept) {
   if (!accept) return true;
   return accept.split(",").some((rule) => {
@@ -2001,7 +2063,7 @@ function FileDropZone({
         take(event.dataTransfer.files);
       },
       children: [
-        /* @__PURE__ */ jsx20(
+        /* @__PURE__ */ jsx21(
           "input",
           {
             ref: inputRef,
@@ -2018,9 +2080,9 @@ function FileDropZone({
             }
           }
         ),
-        /* @__PURE__ */ jsx20("span", { className: "ow-dropzone__icon", children: icon2 ?? /* @__PURE__ */ jsx20(UploadIcon, { size: 20 }) }),
-        /* @__PURE__ */ jsx20("span", { className: "ow-dropzone__label", children: isDragging ? "Drop to add" : label }),
-        /* @__PURE__ */ jsx20("span", { id: hintId, className: "ow-dropzone__hint", "aria-live": "polite", children: error ?? problem ?? hint })
+        /* @__PURE__ */ jsx21("span", { className: "ow-dropzone__icon", children: icon2 ?? /* @__PURE__ */ jsx21(UploadIcon, { size: 20 }) }),
+        /* @__PURE__ */ jsx21("span", { className: "ow-dropzone__label", children: isDragging ? "Drop to add" : label }),
+        /* @__PURE__ */ jsx21("span", { id: hintId, className: "ow-dropzone__hint", "aria-live": "polite", children: error ?? problem ?? hint })
       ]
     }
   );
@@ -2065,7 +2127,7 @@ function formatDate(iso, locale, options) {
 }
 
 // src/components/Calendar/Calendar.tsx
-import { jsx as jsx21, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs16 } from "react/jsx-runtime";
 var Calendar = forwardRef11(function Calendar2({ value, defaultValue = "", onChange, min, max, isDateDisabled, locale, weekStartsOn = 1, autoFocus = false, className }, ref) {
   const [selected, setSelected] = useControllableState(value, defaultValue, onChange);
   const today = todayISO();
@@ -2130,7 +2192,7 @@ var Calendar = forwardRef11(function Calendar2({ value, defaultValue = "", onCha
   const canGoForward = !max || nextMonth <= max;
   return /* @__PURE__ */ jsxs16("div", { className: cx("ow-calendar", className), children: [
     /* @__PURE__ */ jsxs16("div", { className: "ow-calendar__header", children: [
-      /* @__PURE__ */ jsx21(
+      /* @__PURE__ */ jsx22(
         "button",
         {
           type: "button",
@@ -2138,10 +2200,10 @@ var Calendar = forwardRef11(function Calendar2({ value, defaultValue = "", onCha
           "aria-label": `Previous month, ${formatDate(prevMonth, locale, { month: "long", year: "numeric" })}`,
           disabled: !canGoBack,
           onClick: () => setFocused(clampDate(addMonths(focused, -1), min, max)),
-          children: /* @__PURE__ */ jsx21(ChevronLeftIcon, { size: 16 })
+          children: /* @__PURE__ */ jsx22(ChevronLeftIcon, { size: 16 })
         }
       ),
-      /* @__PURE__ */ jsx21("h2", { className: "ow-calendar__title", "aria-live": "polite", children: /* @__PURE__ */ jsx21(
+      /* @__PURE__ */ jsx22("h2", { className: "ow-calendar__title", "aria-live": "polite", children: /* @__PURE__ */ jsx22(
         "span",
         {
           className: cx("ow-calendar__title-text", slide.current.direction && `ow-calendar__slide--${slide.current.direction}`),
@@ -2149,7 +2211,7 @@ var Calendar = forwardRef11(function Calendar2({ value, defaultValue = "", onCha
         },
         monthIndex
       ) }),
-      /* @__PURE__ */ jsx21(
+      /* @__PURE__ */ jsx22(
         "button",
         {
           type: "button",
@@ -2157,17 +2219,17 @@ var Calendar = forwardRef11(function Calendar2({ value, defaultValue = "", onCha
           "aria-label": `Next month, ${formatDate(nextMonth, locale, { month: "long", year: "numeric" })}`,
           disabled: !canGoForward,
           onClick: () => setFocused(clampDate(addMonths(focused, 1), min, max)),
-          children: /* @__PURE__ */ jsx21(ChevronRightIcon, { size: 16 })
+          children: /* @__PURE__ */ jsx22(ChevronRightIcon, { size: 16 })
         }
       )
     ] }),
     /* @__PURE__ */ jsxs16("table", { ref: gridRef, role: "grid", className: "ow-calendar__grid", "aria-label": monthLabel, children: [
-      /* @__PURE__ */ jsx21("thead", { children: /* @__PURE__ */ jsx21("tr", { children: weekdayNames.map((name) => /* @__PURE__ */ jsx21("th", { scope: "col", abbr: name.long, className: "ow-calendar__weekday", children: name.short.slice(0, 2) }, name.long)) }) }),
-      /* @__PURE__ */ jsx21("tbody", { className: cx(slide.current.direction && `ow-calendar__slide--${slide.current.direction}`), children: weeks.map((week) => /* @__PURE__ */ jsx21("tr", { children: week.map((date) => {
+      /* @__PURE__ */ jsx22("thead", { children: /* @__PURE__ */ jsx22("tr", { children: weekdayNames.map((name) => /* @__PURE__ */ jsx22("th", { scope: "col", abbr: name.long, className: "ow-calendar__weekday", children: name.short.slice(0, 2) }, name.long)) }) }),
+      /* @__PURE__ */ jsx22("tbody", { className: cx(slide.current.direction && `ow-calendar__slide--${slide.current.direction}`), children: weeks.map((week) => /* @__PURE__ */ jsx22("tr", { children: week.map((date) => {
         const inMonth = parseISO(date).month === month;
         const isSelected = date === selected;
         const disabled = isDisabled(date);
-        return /* @__PURE__ */ jsx21("td", { role: "gridcell", "aria-selected": isSelected, className: "ow-calendar__cell", children: /* @__PURE__ */ jsx21(
+        return /* @__PURE__ */ jsx22("td", { role: "gridcell", "aria-selected": isSelected, className: "ow-calendar__cell", children: /* @__PURE__ */ jsx22(
           "button",
           {
             type: "button",
@@ -2199,7 +2261,7 @@ function clampDate(date, min, max) {
 
 // src/components/Calendar/DatePicker.tsx
 import { forwardRef as forwardRef12, useCallback as useCallback4, useId as useId8, useRef as useRef12, useState as useState10 } from "react";
-import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs17 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs17 } from "react/jsx-runtime";
 function assignRef5(ref, value) {
   if (typeof ref === "function") ref(value);
   else if (ref) ref.current = value;
@@ -2267,12 +2329,12 @@ var DatePicker = forwardRef12(function DatePicker2({
           }
         },
         children: [
-          /* @__PURE__ */ jsx22(CalendarIcon, { size: size === "sm" ? 14 : 16, className: "ow-date-picker__icon" }),
-          /* @__PURE__ */ jsx22("span", { id: `${panelId}-value`, className: cx("ow-select__value", !date && "ow-select__value--placeholder"), children: label })
+          /* @__PURE__ */ jsx23(CalendarIcon, { size: size === "sm" ? 14 : 16, className: "ow-date-picker__icon" }),
+          /* @__PURE__ */ jsx23("span", { id: `${panelId}-value`, className: cx("ow-select__value", !date && "ow-select__value--placeholder"), children: label })
         ]
       }
     ),
-    mounted ? /* @__PURE__ */ jsx22(
+    mounted ? /* @__PURE__ */ jsx23(
       "div",
       {
         ref: panelRef,
@@ -2283,7 +2345,7 @@ var DatePicker = forwardRef12(function DatePicker2({
         "aria-label": "Choose a date",
         className: "ow-popover ow-floating ow-date-picker__panel",
         style,
-        children: /* @__PURE__ */ jsx22(
+        children: /* @__PURE__ */ jsx23(
           Calendar,
           {
             ...calendarProps,
@@ -2302,13 +2364,13 @@ var DatePicker = forwardRef12(function DatePicker2({
 });
 
 // src/components/Alert/Alert.tsx
-import { jsx as jsx23, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
 var icons = {
-  info: /* @__PURE__ */ jsx23(InfoIcon, { size: 16 }),
-  success: /* @__PURE__ */ jsx23(CircleCheckIcon, { size: 16 }),
-  warning: /* @__PURE__ */ jsx23(TriangleAlertIcon, { size: 16 }),
-  danger: /* @__PURE__ */ jsx23(CircleAlertIcon, { size: 16 }),
-  neutral: /* @__PURE__ */ jsx23(InfoIcon, { size: 16 })
+  info: /* @__PURE__ */ jsx24(InfoIcon, { size: 16 }),
+  success: /* @__PURE__ */ jsx24(CircleCheckIcon, { size: 16 }),
+  warning: /* @__PURE__ */ jsx24(TriangleAlertIcon, { size: 16 }),
+  danger: /* @__PURE__ */ jsx24(CircleAlertIcon, { size: 16 }),
+  neutral: /* @__PURE__ */ jsx24(InfoIcon, { size: 16 })
 };
 function Alert({
   variant = "info",
@@ -2328,30 +2390,30 @@ function Alert({
       className: cx("ow-alert", `ow-alert--${variant}`, className),
       ...props,
       children: [
-        icon2 === false ? null : /* @__PURE__ */ jsx23("span", { className: "ow-alert__icon", children: icon2 ?? icons[variant] }),
+        icon2 === false ? null : /* @__PURE__ */ jsx24("span", { className: "ow-alert__icon", children: icon2 ?? icons[variant] }),
         /* @__PURE__ */ jsxs18("div", { className: "ow-alert__body", children: [
-          title ? /* @__PURE__ */ jsx23("div", { className: "ow-alert__title", children: title }) : null,
-          children ? /* @__PURE__ */ jsx23("div", { className: "ow-alert__description", children }) : null,
-          actions ? /* @__PURE__ */ jsx23("div", { className: "ow-alert__actions", children: actions }) : null
+          title ? /* @__PURE__ */ jsx24("div", { className: "ow-alert__title", children: title }) : null,
+          children ? /* @__PURE__ */ jsx24("div", { className: "ow-alert__description", children }) : null,
+          actions ? /* @__PURE__ */ jsx24("div", { className: "ow-alert__actions", children: actions }) : null
         ] }),
-        onClose ? /* @__PURE__ */ jsx23(CloseButton, { size: "sm", label: "Dismiss", className: "ow-alert__close", onClick: onClose }) : null
+        onClose ? /* @__PURE__ */ jsx24(CloseButton, { size: "sm", label: "Dismiss", className: "ow-alert__close", onClick: onClose }) : null
       ]
     }
   );
 }
 
 // src/components/Badge/Badge.tsx
-import { jsx as jsx24, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
 function Badge({ children, className, icon: icon2, size = "md", variant = "neutral", ...spanProps }) {
   return /* @__PURE__ */ jsxs19("span", { className: cx("ow-badge", `ow-badge--${size}`, `ow-badge--${variant}`, className), ...spanProps, children: [
-    icon2 ? /* @__PURE__ */ jsx24("span", { className: "ow-badge__icon", children: icon2 }) : null,
-    /* @__PURE__ */ jsx24("span", { children })
+    icon2 ? /* @__PURE__ */ jsx25("span", { className: "ow-badge__icon", children: icon2 }) : null,
+    /* @__PURE__ */ jsx25("span", { children })
   ] });
 }
 
 // src/components/Progress/Progress.tsx
 import { useId as useId9 } from "react";
-import { jsx as jsx25, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs20 } from "react/jsx-runtime";
 function ProgressBar({
   value,
   max = 100,
@@ -2369,10 +2431,10 @@ function ProgressBar({
   const text = valueLabel ?? `${Math.round(pct)}%`;
   return /* @__PURE__ */ jsxs20("div", { className: cx("ow-progress", `ow-progress--${size}`, `ow-progress--${tone}`, className), children: [
     label || showValue && !indeterminate ? /* @__PURE__ */ jsxs20("div", { className: "ow-progress__header", children: [
-      label ? /* @__PURE__ */ jsx25("span", { id: labelId, className: "ow-progress__label", children: label }) : /* @__PURE__ */ jsx25("span", {}),
-      showValue && !indeterminate ? /* @__PURE__ */ jsx25("span", { className: "ow-progress__value", children: text }) : null
+      label ? /* @__PURE__ */ jsx26("span", { id: labelId, className: "ow-progress__label", children: label }) : /* @__PURE__ */ jsx26("span", {}),
+      showValue && !indeterminate ? /* @__PURE__ */ jsx26("span", { className: "ow-progress__value", children: text }) : null
     ] }) : null,
-    /* @__PURE__ */ jsx25(
+    /* @__PURE__ */ jsx26(
       "div",
       {
         role: "progressbar",
@@ -2383,7 +2445,7 @@ function ProgressBar({
         "aria-valuenow": indeterminate ? void 0 : value,
         "aria-valuetext": indeterminate ? void 0 : text,
         className: cx("ow-progress__track", indeterminate && "ow-progress__track--indeterminate"),
-        children: /* @__PURE__ */ jsx25("div", { className: "ow-progress__fill", style: indeterminate ? void 0 : { width: `${pct}%` } })
+        children: /* @__PURE__ */ jsx26("div", { className: "ow-progress__fill", style: indeterminate ? void 0 : { width: `${pct}%` } })
       }
     )
   ] });
@@ -2419,8 +2481,8 @@ function ProgressCircle({
       style: { width: box, height: box },
       children: [
         /* @__PURE__ */ jsxs20("svg", { width: box, height: box, viewBox: `0 0 ${box} ${box}`, "aria-hidden": "true", children: [
-          /* @__PURE__ */ jsx25("circle", { className: "ow-progress-circle__track", cx: box / 2, cy: box / 2, r: radius, strokeWidth: stroke, fill: "none" }),
-          /* @__PURE__ */ jsx25(
+          /* @__PURE__ */ jsx26("circle", { className: "ow-progress-circle__track", cx: box / 2, cy: box / 2, r: radius, strokeWidth: stroke, fill: "none" }),
+          /* @__PURE__ */ jsx26(
             "circle",
             {
               className: "ow-progress-circle__fill",
@@ -2447,9 +2509,9 @@ function ProgressCircle({
 
 // src/components/Skeleton/Skeleton.tsx
 import { useEffect as useEffect8, useState as useState11 } from "react";
-import { jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs21 } from "react/jsx-runtime";
 function Skeleton({ width = "100%", height = 14, soft = false, shape = "bar", className }) {
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx27(
     "span",
     {
       className: cx("ow-skeleton", soft && "ow-skeleton--soft", shape === "block" && "ow-skeleton--block", className),
@@ -2465,26 +2527,26 @@ function SkeletonRows({ label = "Loading", rows = 4, delayMs = 150 }) {
     const timer = window.setTimeout(() => setIsVisible(true), delayMs);
     return () => window.clearTimeout(timer);
   }, [delayMs]);
-  return /* @__PURE__ */ jsx26("div", { role: "status", "aria-label": label, "aria-busy": "true", children: isVisible ? /* @__PURE__ */ jsx26("div", { className: "ow-skeleton-rows", "aria-hidden": "true", children: Array.from({ length: rows }, (_, index) => /* @__PURE__ */ jsxs21("div", { className: "ow-skeleton-rows__row", children: [
+  return /* @__PURE__ */ jsx27("div", { role: "status", "aria-label": label, "aria-busy": "true", children: isVisible ? /* @__PURE__ */ jsx27("div", { className: "ow-skeleton-rows", "aria-hidden": "true", children: Array.from({ length: rows }, (_, index) => /* @__PURE__ */ jsxs21("div", { className: "ow-skeleton-rows__row", children: [
     /* @__PURE__ */ jsxs21("div", { className: "ow-skeleton-rows__text", children: [
-      /* @__PURE__ */ jsx26(Skeleton, { width: `${28 + index * 17 % 22}%`, height: 14 }),
-      /* @__PURE__ */ jsx26(Skeleton, { width: `${46 + index * 23 % 30}%`, height: 12, soft: true })
+      /* @__PURE__ */ jsx27(Skeleton, { width: `${28 + index * 17 % 22}%`, height: 14 }),
+      /* @__PURE__ */ jsx27(Skeleton, { width: `${46 + index * 23 % 30}%`, height: 12, soft: true })
     ] }),
-    /* @__PURE__ */ jsx26(Skeleton, { width: 96, height: 32, soft: true, shape: "block" })
+    /* @__PURE__ */ jsx27(Skeleton, { width: 96, height: 32, soft: true, shape: "block" })
   ] }, index)) }) : null });
 }
 
 // src/components/Toast/Toast.tsx
 import { useEffect as useEffect9, useRef as useRef13 } from "react";
 import { Toaster as SonnerToaster, toast } from "sonner";
-import { jsx as jsx27 } from "react/jsx-runtime";
+import { jsx as jsx28 } from "react/jsx-runtime";
 var icons2 = {
-  success: /* @__PURE__ */ jsx27(CircleCheckIcon, { size: 16 }),
-  error: /* @__PURE__ */ jsx27(CircleAlertIcon, { size: 16 }),
-  warning: /* @__PURE__ */ jsx27(TriangleAlertIcon, { size: 16 }),
-  info: /* @__PURE__ */ jsx27(InfoIcon, { size: 16 }),
-  loading: /* @__PURE__ */ jsx27(Spinner, { size: "sm", label: "" }),
-  close: /* @__PURE__ */ jsx27(XIcon, { size: 12 })
+  success: /* @__PURE__ */ jsx28(CircleCheckIcon, { size: 16 }),
+  error: /* @__PURE__ */ jsx28(CircleAlertIcon, { size: 16 }),
+  warning: /* @__PURE__ */ jsx28(TriangleAlertIcon, { size: 16 }),
+  info: /* @__PURE__ */ jsx28(InfoIcon, { size: 16 }),
+  loading: /* @__PURE__ */ jsx28(Spinner, { size: "sm", label: "" }),
+  close: /* @__PURE__ */ jsx28(XIcon, { size: 12 })
 };
 function Toaster({
   position = "bottom-center",
@@ -2515,7 +2577,7 @@ function Toaster({
     observer.observe(document.body, { subtree: true, attributes: true, attributeFilter: ["open"] });
     return () => observer.disconnect();
   }, []);
-  return /* @__PURE__ */ jsx27("div", { ref: layerRef, ...manualPopover, className: "ow-toaster-layer", children: /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsx28("div", { ref: layerRef, ...manualPopover, className: "ow-toaster-layer", children: /* @__PURE__ */ jsx28(
     SonnerToaster,
     {
       id,
@@ -2537,7 +2599,7 @@ function Toaster({
 
 // src/components/Tooltip/Tooltip.tsx
 import { useEffect as useEffect10, useRef as useRef14, useState as useState12 } from "react";
-import { jsx as jsx28, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs22 } from "react/jsx-runtime";
 var lastClosedAt = 0;
 var warmWindow = 500;
 function Tooltip({ children, label, placement = "top", delay = 400 }) {
@@ -2584,7 +2646,7 @@ function Tooltip({ children, label, placement = "top", delay = 400 }) {
       onBlur: hide,
       children: [
         children,
-        mounted ? /* @__PURE__ */ jsx28("span", { ref: bubbleRef, ...manualPopover, "data-state": state, className: "ow-tooltip__bubble ow-floating", style, "aria-hidden": "true", children: label }) : null
+        mounted ? /* @__PURE__ */ jsx29("span", { ref: bubbleRef, ...manualPopover, "data-state": state, className: "ow-tooltip__bubble ow-floating", style, "aria-hidden": "true", children: label }) : null
       ]
     }
   );
@@ -2650,7 +2712,7 @@ function useModalDialog(open, onCancel) {
 }
 
 // src/components/Dialog/Dialog.tsx
-import { Fragment as Fragment5, jsx as jsx29, jsxs as jsxs23 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx30, jsxs as jsxs23 } from "react/jsx-runtime";
 function Dialog({
   open,
   onClose,
@@ -2671,13 +2733,13 @@ function Dialog({
   if (!mounted) return null;
   const body = /* @__PURE__ */ jsxs23(Fragment5, { children: [
     /* @__PURE__ */ jsxs23("div", { className: "ow-dialog__header", children: [
-      /* @__PURE__ */ jsx29("h2", { id: titleId, className: "ow-dialog__title", children: title }),
-      description ? /* @__PURE__ */ jsx29("div", { id: descriptionId, className: "ow-dialog__description", children: description }) : null
+      /* @__PURE__ */ jsx30("h2", { id: titleId, className: "ow-dialog__title", children: title }),
+      description ? /* @__PURE__ */ jsx30("div", { id: descriptionId, className: "ow-dialog__description", children: description }) : null
     ] }),
     children,
-    actions ? /* @__PURE__ */ jsx29("div", { className: "ow-dialog__actions", children: actions }) : null
+    actions ? /* @__PURE__ */ jsx30("div", { className: "ow-dialog__actions", children: actions }) : null
   ] });
-  return /* @__PURE__ */ jsx29(
+  return /* @__PURE__ */ jsx30(
     "dialog",
     {
       ref: dialogRef,
@@ -2685,7 +2747,7 @@ function Dialog({
       style: { width: `min(${width}px, calc(100% - 32px))` },
       "aria-labelledby": titleId,
       "aria-describedby": description ? descriptionId : void 0,
-      children: onSubmit ? /* @__PURE__ */ jsx29(
+      children: onSubmit ? /* @__PURE__ */ jsx30(
         "form",
         {
           className: "ow-dialog__body",
@@ -2695,7 +2757,7 @@ function Dialog({
           },
           children: body
         }
-      ) : /* @__PURE__ */ jsx29("div", { className: "ow-dialog__body", children: body })
+      ) : /* @__PURE__ */ jsx30("div", { className: "ow-dialog__body", children: body })
     }
   );
 }
@@ -2735,7 +2797,7 @@ function ConfirmDialog({
       width: 380,
       className: "ow-dialog--confirm",
       title: /* @__PURE__ */ jsxs23(Fragment5, { children: [
-        destructive ? /* @__PURE__ */ jsx29("span", { className: "ow-dialog__danger-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx29(TrashIcon, { size: 18 }) }) : null,
+        destructive ? /* @__PURE__ */ jsx30("span", { className: "ow-dialog__danger-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx30(TrashIcon, { size: 18 }) }) : null,
         title
       ] }),
       description,
@@ -2743,8 +2805,8 @@ function ConfirmDialog({
         if (!confirmDisabled && !isWorking) void confirm();
       },
       actions: /* @__PURE__ */ jsxs23(Fragment5, { children: [
-        /* @__PURE__ */ jsx29(Button, { type: "button", disabled: isWorking, autoFocus: true, onClick: onClose, children: "Cancel" }),
-        /* @__PURE__ */ jsx29(
+        /* @__PURE__ */ jsx30(Button, { type: "button", disabled: isWorking, autoFocus: true, onClick: onClose, children: "Cancel" }),
+        /* @__PURE__ */ jsx30(
           Button,
           {
             type: "submit",
@@ -2756,7 +2818,7 @@ function ConfirmDialog({
       ] }),
       children: [
         children,
-        error ? /* @__PURE__ */ jsx29("span", { role: "alert", className: "ow-dialog__error", children: error }) : null
+        error ? /* @__PURE__ */ jsx30("span", { role: "alert", className: "ow-dialog__error", children: error }) : null
       ]
     }
   );
@@ -2764,7 +2826,7 @@ function ConfirmDialog({
 
 // src/components/Drawer/Drawer.tsx
 import { useId as useId11 } from "react";
-import { jsx as jsx30, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx31, jsxs as jsxs24 } from "react/jsx-runtime";
 function Drawer({
   open,
   onClose,
@@ -2795,13 +2857,13 @@ function Drawer({
       children: [
         /* @__PURE__ */ jsxs24("header", { className: "ow-drawer__header", children: [
           /* @__PURE__ */ jsxs24("div", { className: "ow-drawer__titles", children: [
-            /* @__PURE__ */ jsx30("h2", { id: titleId, className: "ow-drawer__title", children: title }),
-            description ? /* @__PURE__ */ jsx30("p", { id: descriptionId, className: "ow-drawer__description", children: description }) : null
+            /* @__PURE__ */ jsx31("h2", { id: titleId, className: "ow-drawer__title", children: title }),
+            description ? /* @__PURE__ */ jsx31("p", { id: descriptionId, className: "ow-drawer__description", children: description }) : null
           ] }),
-          dismissible ? /* @__PURE__ */ jsx30(CloseButton, { onClick: onClose }) : null
+          dismissible ? /* @__PURE__ */ jsx31(CloseButton, { onClick: onClose }) : null
         ] }),
-        /* @__PURE__ */ jsx30("div", { className: "ow-drawer__body", children }),
-        footer ? /* @__PURE__ */ jsx30("footer", { className: "ow-drawer__footer", children: footer }) : null
+        /* @__PURE__ */ jsx31("div", { className: "ow-drawer__body", children }),
+        footer ? /* @__PURE__ */ jsx31("footer", { className: "ow-drawer__footer", children: footer }) : null
       ]
     }
   );
@@ -2816,7 +2878,7 @@ import {
   useId as useId12,
   useRef as useRef16
 } from "react";
-import { Fragment as Fragment6, jsx as jsx31, jsxs as jsxs25 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx32, jsxs as jsxs25 } from "react/jsx-runtime";
 function Popover({
   trigger,
   children,
@@ -2869,7 +2931,7 @@ function Popover({
     }
   }) : trigger;
   return /* @__PURE__ */ jsxs25(Fragment6, { children: [
-    /* @__PURE__ */ jsx31("span", { ref: anchorRef, className: "ow-popover-anchor", children: triggerElement }),
+    /* @__PURE__ */ jsx32("span", { ref: anchorRef, className: "ow-popover-anchor", children: triggerElement }),
     mounted ? /* @__PURE__ */ jsxs25(
       "div",
       {
@@ -2888,7 +2950,7 @@ function Popover({
           if (next && !panelRef.current?.contains(next) && !anchorRef.current?.contains(next)) setOpen(false);
         },
         children: [
-          title ? /* @__PURE__ */ jsx31("div", { id: `${id}-title`, className: "ow-popover__title", children: title }) : null,
+          title ? /* @__PURE__ */ jsx32("div", { id: `${id}-title`, className: "ow-popover__title", children: title }) : null,
           children
         ]
       }
@@ -2964,7 +3026,7 @@ function useMenuKeyboard({
 }
 
 // src/components/Menu/Menu.tsx
-import { jsx as jsx32, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx33, jsxs as jsxs26 } from "react/jsx-runtime";
 var MenuContext = createContext3(null);
 function Menu({ trigger, children, label, align = "start", above = false, width, defaultOpen = false, className }) {
   const [open, setOpen] = useState15(defaultOpen);
@@ -3004,7 +3066,7 @@ function Menu({ trigger, children, label, align = "start", above = false, width,
   }) : trigger;
   return /* @__PURE__ */ jsxs26("span", { ref: rootRef, className: "ow-menu", children: [
     triggerElement,
-    mounted ? /* @__PURE__ */ jsx32(
+    mounted ? /* @__PURE__ */ jsx33(
       MenuContext.Provider,
       {
         value: {
@@ -3013,7 +3075,7 @@ function Menu({ trigger, children, label, align = "start", above = false, width,
             triggerRef.current?.focus();
           }
         },
-        children: /* @__PURE__ */ jsx32(
+        children: /* @__PURE__ */ jsx33(
           "div",
           {
             ref: menuRef,
@@ -3050,18 +3112,18 @@ var MenuItem = forwardRef13(function MenuItem2({ icon: icon2, onSelect, destruct
       },
       ...buttonProps,
       children: [
-        icon2 ? /* @__PURE__ */ jsx32("span", { className: "ow-menu__icon", children: icon2 }) : null,
-        /* @__PURE__ */ jsx32("span", { className: "ow-menu__label", children }),
-        shortcut ? /* @__PURE__ */ jsx32("kbd", { className: "ow-menu__shortcut", children: shortcut }) : null
+        icon2 ? /* @__PURE__ */ jsx33("span", { className: "ow-menu__icon", children: icon2 }) : null,
+        /* @__PURE__ */ jsx33("span", { className: "ow-menu__label", children }),
+        shortcut ? /* @__PURE__ */ jsx33("kbd", { className: "ow-menu__shortcut", children: shortcut }) : null
       ]
     }
   );
 });
 function MenuLabel({ children }) {
-  return /* @__PURE__ */ jsx32("div", { className: "ow-menu__group-label", role: "presentation", children });
+  return /* @__PURE__ */ jsx33("div", { className: "ow-menu__group-label", role: "presentation", children });
 }
 function MenuSeparator() {
-  return /* @__PURE__ */ jsx32("div", { className: "ow-menu__separator", role: "separator" });
+  return /* @__PURE__ */ jsx33("div", { className: "ow-menu__separator", role: "separator" });
 }
 
 // src/components/CommandPalette/CommandPalette.tsx
@@ -3102,7 +3164,7 @@ function filterCommands(commands, query) {
 }
 
 // src/components/CommandPalette/CommandPalette.tsx
-import { jsx as jsx33, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs27 } from "react/jsx-runtime";
 function CommandPalette({ open, onClose, commands, placeholder = "Search commands\u2026" }) {
   const { dialogRef, mounted } = useModalDialog(open, onClose);
   const [query, setQuery] = useState16("");
@@ -3130,8 +3192,8 @@ function CommandPalette({ open, onClose, commands, placeholder = "Search command
   }
   return /* @__PURE__ */ jsxs27("dialog", { ref: dialogRef, className: "ow-dialog ow-palette", "aria-label": "Command palette", children: [
     /* @__PURE__ */ jsxs27("div", { className: "ow-palette__search", children: [
-      /* @__PURE__ */ jsx33(SearchIcon, { size: 16, className: "ow-palette__search-icon" }),
-      /* @__PURE__ */ jsx33(
+      /* @__PURE__ */ jsx34(SearchIcon, { size: 16, className: "ow-palette__search-icon" }),
+      /* @__PURE__ */ jsx34(
         "input",
         {
           autoFocus: true,
@@ -3158,13 +3220,13 @@ function CommandPalette({ open, onClose, commands, placeholder = "Search command
           }
         }
       ),
-      /* @__PURE__ */ jsx33("kbd", { className: "ow-palette__esc", children: "esc" })
+      /* @__PURE__ */ jsx34("kbd", { className: "ow-palette__esc", children: "esc" })
     ] }),
-    /* @__PURE__ */ jsx33("ul", { ref: listRef, id: listId, role: "listbox", "aria-label": "Commands", className: "ow-palette__list", children: results.length ? results.map((command, index) => {
+    /* @__PURE__ */ jsx34("ul", { ref: listRef, id: listId, role: "listbox", "aria-label": "Commands", className: "ow-palette__list", children: results.length ? results.map((command, index) => {
       const showGroup = !query.trim() && command.group && command.group !== results[index - 1]?.group;
       const isActive = command === active;
       return /* @__PURE__ */ jsxs27("li", { role: "presentation", children: [
-        showGroup ? /* @__PURE__ */ jsx33("div", { className: "ow-palette__group", children: command.group }) : null,
+        showGroup ? /* @__PURE__ */ jsx34("div", { className: "ow-palette__group", children: command.group }) : null,
         /* @__PURE__ */ jsxs27(
           "div",
           {
@@ -3180,11 +3242,11 @@ function CommandPalette({ open, onClose, commands, placeholder = "Search command
             onMouseMove: () => setActiveIndex(index),
             onClick: () => run(command),
             children: [
-              /* @__PURE__ */ jsx33("span", { className: "ow-palette__icon", "aria-hidden": "true", children: command.icon }),
-              /* @__PURE__ */ jsx33("span", { className: "ow-palette__title", children: command.title }),
-              command.disabled && isActive ? /* @__PURE__ */ jsx33("span", { className: "ow-palette__hint", children: command.disabled }) : command.hint ? /* @__PURE__ */ jsx33("span", { className: "ow-palette__hint", children: command.hint }) : null,
-              command.shortcut ? /* @__PURE__ */ jsx33("kbd", { className: "ow-palette__shortcut", children: command.shortcut }) : null,
-              isActive && !command.disabled ? /* @__PURE__ */ jsx33(CornerDownLeftIcon, { size: 13, className: "ow-palette__enter" }) : null
+              /* @__PURE__ */ jsx34("span", { className: "ow-palette__icon", "aria-hidden": "true", children: command.icon }),
+              /* @__PURE__ */ jsx34("span", { className: "ow-palette__title", children: command.title }),
+              command.disabled && isActive ? /* @__PURE__ */ jsx34("span", { className: "ow-palette__hint", children: command.disabled }) : command.hint ? /* @__PURE__ */ jsx34("span", { className: "ow-palette__hint", children: command.hint }) : null,
+              command.shortcut ? /* @__PURE__ */ jsx34("kbd", { className: "ow-palette__shortcut", children: command.shortcut }) : null,
+              isActive && !command.disabled ? /* @__PURE__ */ jsx34(CornerDownLeftIcon, { size: 13, className: "ow-palette__enter" }) : null
             ]
           }
         )
@@ -3205,7 +3267,7 @@ import {
   useLayoutEffect as useLayoutEffect4,
   useRef as useRef19
 } from "react";
-import { jsx as jsx34, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs28 } from "react/jsx-runtime";
 var TabsContext = createContext4(null);
 function useTabs(component) {
   const context = useContext4(TabsContext);
@@ -3216,7 +3278,7 @@ var idPart = (value) => value.replace(/[^\w-]/g, "_");
 function Tabs({ value, defaultValue = "", onValueChange, variant = "segmented", className, children, ...props }) {
   const [current, select] = useControllableState(value, defaultValue, onValueChange);
   const baseId = useId15();
-  return /* @__PURE__ */ jsx34(TabsContext.Provider, { value: { value: current, select, baseId, variant }, children: /* @__PURE__ */ jsx34("div", { className: cx("ow-tabs", `ow-tabs--${variant}`, className), ...props, children }) });
+  return /* @__PURE__ */ jsx35(TabsContext.Provider, { value: { value: current, select, baseId, variant }, children: /* @__PURE__ */ jsx35("div", { className: cx("ow-tabs", `ow-tabs--${variant}`, className), ...props, children }) });
 }
 function TabList({ className, onKeyDown, children, ...props }) {
   const { value, select } = useTabs("TabList");
@@ -3242,7 +3304,7 @@ function TabList({ className, onKeyDown, children, ...props }) {
   }
   return /* @__PURE__ */ jsxs28("div", { ref: listRef, role: "tablist", className: cx("ow-tabs__list", className), onKeyDown: handleKeyDown, ...props, children: [
     children,
-    /* @__PURE__ */ jsx34("span", { className: "ow-indicator", "aria-hidden": "true" })
+    /* @__PURE__ */ jsx35("span", { className: "ow-indicator", "aria-hidden": "true" })
   ] });
 }
 function Tab({ value, icon: icon2, className, children, onClick, ...props }) {
@@ -3265,7 +3327,7 @@ function Tab({ value, icon: icon2, className, children, onClick, ...props }) {
       },
       ...props,
       children: [
-        icon2 ? /* @__PURE__ */ jsx34("span", { className: "ow-tab__icon", children: icon2 }) : null,
+        icon2 ? /* @__PURE__ */ jsx35("span", { className: "ow-tab__icon", children: icon2 }) : null,
         children
       ]
     }
@@ -3275,7 +3337,7 @@ function TabPanel({ value, keepMounted = false, className, children, ...props })
   const { value: current, baseId } = useTabs("TabPanel");
   const selected = current === value;
   if (!selected && !keepMounted) return null;
-  return /* @__PURE__ */ jsx34(
+  return /* @__PURE__ */ jsx35(
     "div",
     {
       role: "tabpanel",
@@ -3298,7 +3360,7 @@ import {
   useId as useId16,
   useRef as useRef20
 } from "react";
-import { jsx as jsx35, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs29 } from "react/jsx-runtime";
 function DisclosureView({
   open,
   onToggle,
@@ -3320,7 +3382,7 @@ function DisclosureView({
   }, [open]);
   return /* @__PURE__ */ jsxs29("div", { className: cx(item ? "ow-accordion__item" : "ow-disclosure", className), "data-open": open, children: [
     /* @__PURE__ */ jsxs29("div", { className: "ow-disclosure__header", children: [
-      /* @__PURE__ */ jsx35(Heading, { className: "ow-disclosure__heading", children: /* @__PURE__ */ jsxs29(
+      /* @__PURE__ */ jsx36(Heading, { className: "ow-disclosure__heading", children: /* @__PURE__ */ jsxs29(
         "button",
         {
           type: "button",
@@ -3332,18 +3394,18 @@ function DisclosureView({
           "data-accordion-trigger": item ? "" : void 0,
           onClick: onToggle,
           children: [
-            /* @__PURE__ */ jsx35(ChevronRightIcon, { size: 14, className: "ow-disclosure__chevron" }),
-            icon2 ? /* @__PURE__ */ jsx35("span", { className: "ow-disclosure__icon", children: icon2 }) : null,
+            /* @__PURE__ */ jsx36(ChevronRightIcon, { size: 14, className: "ow-disclosure__chevron" }),
+            icon2 ? /* @__PURE__ */ jsx36("span", { className: "ow-disclosure__icon", children: icon2 }) : null,
             /* @__PURE__ */ jsxs29("span", { className: "ow-disclosure__titles", children: [
-              /* @__PURE__ */ jsx35("span", { className: "ow-disclosure__title", children: title }),
-              subtitle ? /* @__PURE__ */ jsx35("span", { className: "ow-disclosure__subtitle", children: subtitle }) : null
+              /* @__PURE__ */ jsx36("span", { className: "ow-disclosure__title", children: title }),
+              subtitle ? /* @__PURE__ */ jsx36("span", { className: "ow-disclosure__subtitle", children: subtitle }) : null
             ] })
           ]
         }
       ) }),
-      actions ? /* @__PURE__ */ jsx35("div", { className: "ow-disclosure__actions", children: actions }) : null
+      actions ? /* @__PURE__ */ jsx36("div", { className: "ow-disclosure__actions", children: actions }) : null
     ] }),
-    /* @__PURE__ */ jsx35(
+    /* @__PURE__ */ jsx36(
       "div",
       {
         ref: panelRef,
@@ -3351,7 +3413,7 @@ function DisclosureView({
         role: "region",
         "aria-labelledby": `${id}-trigger`,
         className: "ow-disclosure__panel",
-        children: /* @__PURE__ */ jsx35("div", { className: "ow-disclosure__clip", children: /* @__PURE__ */ jsx35("div", { className: "ow-disclosure__content", children }) })
+        children: /* @__PURE__ */ jsx36("div", { className: "ow-disclosure__clip", children: /* @__PURE__ */ jsx36("div", { className: "ow-disclosure__content", children }) })
       }
     )
   ] });
@@ -3366,7 +3428,7 @@ function Disclosure({
   ...props
 }) {
   const [isOpen, setOpen] = useControllableState(open, defaultOpen, onOpenChange);
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx36(
     DisclosureView,
     {
       ...props,
@@ -3408,12 +3470,12 @@ function Accordion({
     event.preventDefault();
     triggers[(moves[event.key] + triggers.length) % triggers.length]?.focus();
   }
-  return /* @__PURE__ */ jsx35(AccordionContext.Provider, { value: { isOpen: (item) => openValues.includes(item), toggle, headingLevel }, children: /* @__PURE__ */ jsx35("div", { className: cx("ow-accordion", `ow-accordion--${variant}`, className), onKeyDown: handleKeyDown, ...props, children }) });
+  return /* @__PURE__ */ jsx36(AccordionContext.Provider, { value: { isOpen: (item) => openValues.includes(item), toggle, headingLevel }, children: /* @__PURE__ */ jsx36("div", { className: cx("ow-accordion", `ow-accordion--${variant}`, className), onKeyDown: handleKeyDown, ...props, children }) });
 }
 function AccordionItem({ value, ...props }) {
   const context = useContext5(AccordionContext);
   if (!context) throw new Error("AccordionItem must be inside <Accordion>.");
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx36(
     DisclosureView,
     {
       ...props,
@@ -3427,13 +3489,13 @@ function AccordionItem({ value, ...props }) {
 
 // src/components/Breadcrumbs/Breadcrumbs.tsx
 import { forwardRef as forwardRef14 } from "react";
-import { Fragment as Fragment7, jsx as jsx36, jsxs as jsxs30 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx37, jsxs as jsxs30 } from "react/jsx-runtime";
 function Breadcrumbs({ items: items2, separator = "chevron", label = "Breadcrumb", className }) {
-  return /* @__PURE__ */ jsx36("nav", { "aria-label": label, className: cx("ow-breadcrumbs", className), children: /* @__PURE__ */ jsx36("ol", { className: "ow-breadcrumbs__list", children: items2.map((item, index) => {
+  return /* @__PURE__ */ jsx37("nav", { "aria-label": label, className: cx("ow-breadcrumbs", className), children: /* @__PURE__ */ jsx37("ol", { className: "ow-breadcrumbs__list", children: items2.map((item, index) => {
     const isLast = index === items2.length - 1;
     return /* @__PURE__ */ jsxs30("li", { className: "ow-breadcrumbs__item", children: [
-      isLast ? /* @__PURE__ */ jsx36("span", { className: "ow-breadcrumbs__current", "aria-current": "page", children: item.label }) : item.href ? /* @__PURE__ */ jsx36("a", { className: "ow-breadcrumbs__link", href: item.href, onClick: item.onClick, children: item.label }) : /* @__PURE__ */ jsx36("button", { type: "button", className: "ow-breadcrumbs__link", onClick: item.onClick, children: item.label }),
-      isLast ? null : /* @__PURE__ */ jsx36("span", { className: "ow-breadcrumbs__separator", "aria-hidden": "true", children: separator === "slash" ? "/" : /* @__PURE__ */ jsx36(ChevronRightIcon, { size: 14 }) })
+      isLast ? /* @__PURE__ */ jsx37("span", { className: "ow-breadcrumbs__current", "aria-current": "page", children: item.label }) : item.href ? /* @__PURE__ */ jsx37("a", { className: "ow-breadcrumbs__link", href: item.href, onClick: item.onClick, children: item.label }) : /* @__PURE__ */ jsx37("button", { type: "button", className: "ow-breadcrumbs__link", onClick: item.onClick, children: item.label }),
+      isLast ? null : /* @__PURE__ */ jsx37("span", { className: "ow-breadcrumbs__separator", "aria-hidden": "true", children: separator === "slash" ? "/" : /* @__PURE__ */ jsx37(ChevronRightIcon, { size: 14 }) })
     ] }, index);
   }) }) });
 }
@@ -3452,8 +3514,8 @@ var Link = forwardRef14(function Link2({ variant = "default", external = false,
       children: [
         children,
         external ? /* @__PURE__ */ jsxs30(Fragment7, { children: [
-          /* @__PURE__ */ jsx36(ArrowUpRightIcon, { size: 13, className: "ow-link__external" }),
-          /* @__PURE__ */ jsx36("span", { className: "ow-visually-hidden", children: " (opens in a new tab)" })
+          /* @__PURE__ */ jsx37(ArrowUpRightIcon, { size: 13, className: "ow-link__external" }),
+          /* @__PURE__ */ jsx37("span", { className: "ow-visually-hidden", children: " (opens in a new tab)" })
         ] }) : null
       ]
     }
@@ -3461,7 +3523,7 @@ var Link = forwardRef14(function Link2({ variant = "default", external = false,
 });
 
 // src/components/Pagination/Pagination.tsx
-import { jsx as jsx37, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs31 } from "react/jsx-runtime";
 function paginationItems(page, pageCount, siblingCount = 1, boundaryCount = 1) {
   const range = (from, to) => Array.from({ length: Math.max(0, to - from + 1) }, (_, i) => from + i);
   const startPages = range(1, Math.min(boundaryCount, pageCount));
@@ -3494,8 +3556,8 @@ function Pagination({
 }) {
   const items2 = paginationItems(page, pageCount, siblingCount, boundaryCount);
   const go = (next) => onPageChange(Math.min(Math.max(1, next), pageCount));
-  return /* @__PURE__ */ jsx37("nav", { "aria-label": label, className: cx("ow-pagination", `ow-pagination--${size}`, className), children: /* @__PURE__ */ jsxs31("ul", { className: "ow-pagination__list", children: [
-    /* @__PURE__ */ jsx37("li", { children: /* @__PURE__ */ jsx37(
+  return /* @__PURE__ */ jsx38("nav", { "aria-label": label, className: cx("ow-pagination", `ow-pagination--${size}`, className), children: /* @__PURE__ */ jsxs31("ul", { className: "ow-pagination__list", children: [
+    /* @__PURE__ */ jsx38("li", { children: /* @__PURE__ */ jsx38(
       "button",
       {
         type: "button",
@@ -3503,11 +3565,11 @@ function Pagination({
         "aria-label": "Previous page",
         disabled: page <= 1,
         onClick: () => go(page - 1),
-        children: /* @__PURE__ */ jsx37(ChevronLeftIcon, { size: 16 })
+        children: /* @__PURE__ */ jsx38(ChevronLeftIcon, { size: 16 })
       }
     ) }),
     items2.map(
-      (item) => typeof item === "number" ? /* @__PURE__ */ jsx37("li", { children: /* @__PURE__ */ jsx37(
+      (item) => typeof item === "number" ? /* @__PURE__ */ jsx38("li", { children: /* @__PURE__ */ jsx38(
         "button",
         {
           type: "button",
@@ -3517,9 +3579,9 @@ function Pagination({
           onClick: () => go(item),
           children: item
         }
-      ) }, item) : /* @__PURE__ */ jsx37("li", { className: "ow-pagination__gap", "aria-hidden": "true", children: "\u2026" }, item)
+      ) }, item) : /* @__PURE__ */ jsx38("li", { className: "ow-pagination__gap", "aria-hidden": "true", children: "\u2026" }, item)
     ),
-    /* @__PURE__ */ jsx37("li", { children: /* @__PURE__ */ jsx37(
+    /* @__PURE__ */ jsx38("li", { children: /* @__PURE__ */ jsx38(
       "button",
       {
         type: "button",
@@ -3527,7 +3589,7 @@ function Pagination({
         "aria-label": "Next page",
         disabled: page >= pageCount,
         onClick: () => go(page + 1),
-        children: /* @__PURE__ */ jsx37(ChevronRightIcon, { size: 16 })
+        children: /* @__PURE__ */ jsx38(ChevronRightIcon, { size: 16 })
       }
     ) })
   ] }) });
@@ -3535,12 +3597,12 @@ function Pagination({
 
 // src/components/Steps/Steps.tsx
 import { useId as useId17 } from "react";
-import { jsx as jsx38, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs32 } from "react/jsx-runtime";
 function Steps({ items: items2, current = 0, orientation = "vertical", title, label = "Steps", className }) {
   const statuses = items2.map((item, index) => item.status ?? (index < current ? "done" : index === current ? "current" : "upcoming"));
   const doneCount = statuses.filter((status) => status === "done").length;
   const headingId = useId17();
-  const list = /* @__PURE__ */ jsx38("ol", { className: "ow-steps__list", children: items2.map((item, index) => {
+  const list = /* @__PURE__ */ jsx39("ol", { className: "ow-steps__list", children: items2.map((item, index) => {
     const status = statuses[index];
     return /* @__PURE__ */ jsxs32(
       "li",
@@ -3548,15 +3610,15 @@ function Steps({ items: items2, current = 0, orientation = "vertical", title, la
         className: cx("ow-steps__item", `ow-steps__item--${status}`),
         "aria-current": status === "current" ? "step" : void 0,
         children: [
-          /* @__PURE__ */ jsx38("span", { className: "ow-steps__marker", children: status === "done" ? /* @__PURE__ */ jsx38(CheckIcon, { size: 14, strokeWidth: 3 }) : index + 1 }),
+          /* @__PURE__ */ jsx39("span", { className: "ow-steps__marker", children: status === "done" ? /* @__PURE__ */ jsx39(CheckIcon, { size: 14, strokeWidth: 3 }) : index + 1 }),
           /* @__PURE__ */ jsxs32("span", { className: "ow-steps__text", children: [
             /* @__PURE__ */ jsxs32("span", { className: "ow-steps__title", children: [
-              status === "done" ? /* @__PURE__ */ jsx38("span", { className: "ow-visually-hidden", children: "Done: " }) : null,
+              status === "done" ? /* @__PURE__ */ jsx39("span", { className: "ow-visually-hidden", children: "Done: " }) : null,
               item.title
             ] }),
-            item.description && (orientation === "horizontal" || status !== "done") ? /* @__PURE__ */ jsx38("span", { className: "ow-steps__description", children: item.description }) : null
+            item.description && (orientation === "horizontal" || status !== "done") ? /* @__PURE__ */ jsx39("span", { className: "ow-steps__description", children: item.description }) : null
           ] }),
-          item.action && status !== "done" && orientation === "vertical" ? /* @__PURE__ */ jsx38("span", { className: "ow-steps__action", children: item.action }) : null
+          item.action && status === "current" && orientation === "vertical" ? /* @__PURE__ */ jsx39("span", { className: "ow-steps__action", children: item.action }) : null
         ]
       },
       index
@@ -3570,7 +3632,7 @@ function Steps({ items: items2, current = 0, orientation = "vertical", title, la
       "aria-label": title && orientation === "vertical" ? void 0 : label,
       children: [
         title && orientation === "vertical" ? /* @__PURE__ */ jsxs32("div", { className: "ow-steps__header", children: [
-          /* @__PURE__ */ jsx38("h3", { id: headingId, className: "ow-steps__heading", children: title }),
+          /* @__PURE__ */ jsx39("h3", { id: headingId, className: "ow-steps__heading", children: title }),
           /* @__PURE__ */ jsxs32("span", { className: "ow-steps__count", children: [
             doneCount,
             " of ",
@@ -3586,25 +3648,25 @@ function Steps({ items: items2, current = 0, orientation = "vertical", title, la
 
 // src/components/NavList/NavList.tsx
 import { forwardRef as forwardRef15 } from "react";
-import { Fragment as Fragment8, jsx as jsx39, jsxs as jsxs33 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx40, jsxs as jsxs33 } from "react/jsx-runtime";
 function NavList({ label, heading, orientation = "vertical", children, className }) {
   return /* @__PURE__ */ jsxs33("nav", { "aria-label": label, className: cx("ow-nav", `ow-nav--${orientation}`, className), children: [
-    heading && orientation === "vertical" ? /* @__PURE__ */ jsx39("span", { className: "ow-nav__heading", children: heading }) : null,
+    heading && orientation === "vertical" ? /* @__PURE__ */ jsx40("span", { className: "ow-nav__heading", children: heading }) : null,
     children
   ] });
 }
 var NavItem = forwardRef15(function NavItem2({ icon: icon2, active = false, className, children, type = "button", href, end, ...buttonProps }, ref) {
   const content = /* @__PURE__ */ jsxs33(Fragment8, { children: [
-    icon2 ? /* @__PURE__ */ jsx39("span", { className: "ow-nav__icon", children: icon2 }) : null,
-    /* @__PURE__ */ jsx39("span", { className: "ow-nav__label", children }),
-    end !== void 0 ? /* @__PURE__ */ jsx39("span", { className: "ow-nav__end", children: end }) : null
+    icon2 ? /* @__PURE__ */ jsx40("span", { className: "ow-nav__icon", children: icon2 }) : null,
+    /* @__PURE__ */ jsx40("span", { className: "ow-nav__label", children }),
+    end !== void 0 ? /* @__PURE__ */ jsx40("span", { className: "ow-nav__end", children: end }) : null
   ] });
   const shared = {
     "aria-current": active ? "page" : void 0,
     className: cx("ow-nav__item", active && "ow-nav__item--active", className)
   };
   if (href !== void 0) {
-    return /* @__PURE__ */ jsx39(
+    return /* @__PURE__ */ jsx40(
       "a",
       {
         ref,
@@ -3615,12 +3677,12 @@ var NavItem = forwardRef15(function NavItem2({ icon: icon2, active = false, clas
       }
     );
   }
-  return /* @__PURE__ */ jsx39("button", { ref, type, ...shared, ...buttonProps, children: content });
+  return /* @__PURE__ */ jsx40("button", { ref, type, ...shared, ...buttonProps, children: content });
 });
 
 // src/components/Table/Table.tsx
 import { useMemo as useMemo5 } from "react";
-import { jsx as jsx40, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs34 } from "react/jsx-runtime";
 function compare(a, b) {
   if (typeof a === "number" && typeof b === "number") return a - b;
   return String(a).localeCompare(String(b), void 0, { numeric: true, sensitivity: "base" });
@@ -3639,6 +3701,7 @@ function Table({
   selectedKeys,
   defaultSelectedKeys = [],
   onSelectionChange,
+  rowLabel,
   emptyContent = "Nothing here yet.",
   density = "comfortable",
   stickyHeader = false,
@@ -3648,6 +3711,11 @@ function Table({
   const [currentSort, setSort] = useControllableState(sort, defaultSort, onSortChange);
   const [selected, setSelected] = useControllableState(selectedKeys, defaultSelectedKeys, onSelectionChange);
   const keyOf = (row) => typeof rowKey === "function" ? rowKey(row) : row[rowKey];
+  const labelOf = (row, index) => {
+    if (rowLabel) return rowLabel(row);
+    const first = columns[0] ? row[columns[0].key] : void 0;
+    return typeof first === "string" || typeof first === "number" ? String(first) : `row ${index + 1}`;
+  };
   const field = (row, key) => row[key];
   const sorted = useMemo5(() => {
     if (!currentSort || manualSort) return rows;
@@ -3665,16 +3733,16 @@ function Table({
     );
   }
   const selectable = selectionMode === "multiple";
-  return /* @__PURE__ */ jsx40(
+  return /* @__PURE__ */ jsx41(
     "div",
     {
       className: cx("ow-table-wrap", stickyHeader && "ow-table-wrap--sticky", className),
       style: maxHeight ? { maxHeight } : void 0,
       tabIndex: maxHeight ? 0 : void 0,
       children: /* @__PURE__ */ jsxs34("table", { className: cx("ow-table", `ow-table--${density}`), children: [
-        caption ? /* @__PURE__ */ jsx40("caption", { className: cx("ow-table__caption", hideCaption && "ow-visually-hidden"), children: caption }) : null,
-        /* @__PURE__ */ jsx40("thead", { children: /* @__PURE__ */ jsxs34("tr", { children: [
-          selectable ? /* @__PURE__ */ jsx40("th", { className: "ow-table__select", scope: "col", children: /* @__PURE__ */ jsx40(
+        caption ? /* @__PURE__ */ jsx41("caption", { className: cx("ow-table__caption", hideCaption && "ow-visually-hidden"), children: caption }) : null,
+        /* @__PURE__ */ jsx41("thead", { children: /* @__PURE__ */ jsxs34("tr", { children: [
+          selectable ? /* @__PURE__ */ jsx41("th", { className: "ow-table__select", scope: "col", children: /* @__PURE__ */ jsx41(
             Checkbox,
             {
               size: "sm",
@@ -3688,7 +3756,7 @@ function Table({
           ) }) : null,
           columns.map((column) => {
             const direction = currentSort?.key === column.key ? currentSort.direction : void 0;
-            return /* @__PURE__ */ jsx40(
+            return /* @__PURE__ */ jsx41(
               "th",
               {
                 scope: "col",
@@ -3697,29 +3765,29 @@ function Table({
                 style: column.width !== void 0 ? { width: column.width } : void 0,
                 children: column.sortable ? /* @__PURE__ */ jsxs34("button", { type: "button", className: "ow-table__sort", onClick: () => toggleSort(column.key), children: [
                   column.header,
-                  /* @__PURE__ */ jsx40("span", { className: cx("ow-table__sort-icon", direction && "ow-table__sort-icon--active"), children: direction === "ascending" ? /* @__PURE__ */ jsx40(ArrowUpIcon, { size: 12 }) : direction === "descending" ? /* @__PURE__ */ jsx40(ArrowDownIcon, { size: 12 }) : /* @__PURE__ */ jsx40(ChevronsUpDownIcon, { size: 12 }) })
+                  /* @__PURE__ */ jsx41("span", { className: cx("ow-table__sort-icon", direction && "ow-table__sort-icon--active"), children: direction === "ascending" ? /* @__PURE__ */ jsx41(ArrowUpIcon, { size: 12 }) : direction === "descending" ? /* @__PURE__ */ jsx41(ArrowDownIcon, { size: 12 }) : /* @__PURE__ */ jsx41(ChevronsUpDownIcon, { size: 12 }) })
                 ] }) : column.header
               },
               column.key
             );
           })
         ] }) }),
-        /* @__PURE__ */ jsx40("tbody", { children: sorted.length === 0 ? /* @__PURE__ */ jsx40("tr", { children: /* @__PURE__ */ jsx40("td", { className: "ow-table__empty", colSpan: columns.length + (selectable ? 1 : 0), children: emptyContent }) }) : sorted.map((row) => {
+        /* @__PURE__ */ jsx41("tbody", { children: sorted.length === 0 ? /* @__PURE__ */ jsx41("tr", { children: /* @__PURE__ */ jsx41("td", { className: "ow-table__empty", colSpan: columns.length + (selectable ? 1 : 0), children: emptyContent }) }) : sorted.map((row, index) => {
           const key = keyOf(row);
           const isSelected = selected.includes(key);
           return /* @__PURE__ */ jsxs34("tr", { className: cx(isSelected && "ow-table__row--selected"), children: [
-            selectable ? /* @__PURE__ */ jsx40("td", { className: "ow-table__select", children: /* @__PURE__ */ jsx40(
+            selectable ? /* @__PURE__ */ jsx41("td", { className: "ow-table__select", children: /* @__PURE__ */ jsx41(
               Checkbox,
               {
                 size: "sm",
-                "aria-label": "Select row",
+                "aria-label": `Select ${labelOf(row, index)}`,
                 checked: isSelected,
                 onChange: (event) => setSelected(
                   event.target.checked ? [...selected, key] : selected.filter((k) => k !== key)
                 )
               }
             ) }) : null,
-            columns.map((column) => /* @__PURE__ */ jsx40("td", { className: cx(`ow-table__cell--${column.align ?? "start"}`), children: column.render ? column.render(row) : field(row, column.key) }, column.key))
+            columns.map((column) => /* @__PURE__ */ jsx41("td", { className: cx(`ow-table__cell--${column.align ?? "start"}`), children: column.render ? column.render(row) : field(row, column.key) }, column.key))
           ] }, key);
         }) })
       ] })
@@ -3728,7 +3796,7 @@ function Table({
 }
 
 // src/components/Stat/Stat.tsx
-import { jsx as jsx41, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs35 } from "react/jsx-runtime";
 function Sparkline({ values }) {
   const max = Math.max(...values);
   const min = Math.min(...values);
@@ -3742,10 +3810,10 @@ function Sparkline({ values }) {
   const [lastX, lastY] = points[points.length - 1];
   return /* @__PURE__ */ jsxs35("div", { className: "ow-stat__trend", "aria-hidden": "true", children: [
     /* @__PURE__ */ jsxs35("svg", { viewBox: "0 0 100 40", preserveAspectRatio: "none", children: [
-      /* @__PURE__ */ jsx41("path", { d: `${line} L100 40 L0 40 Z`, className: "ow-stat__trend-area" }),
-      /* @__PURE__ */ jsx41("path", { d: line, className: "ow-stat__trend-line", vectorEffect: "non-scaling-stroke" })
+      /* @__PURE__ */ jsx42("path", { d: `${line} L100 40 L0 40 Z`, className: "ow-stat__trend-area" }),
+      /* @__PURE__ */ jsx42("path", { d: line, className: "ow-stat__trend-line", vectorEffect: "non-scaling-stroke" })
     ] }),
-    /* @__PURE__ */ jsx41("span", { className: "ow-stat__trend-end", style: { left: `${lastX}%`, top: `${lastY / 40 * 100}%` } })
+    /* @__PURE__ */ jsx42("span", { className: "ow-stat__trend-end", style: { left: `${lastX}%`, top: `${lastY / 40 * 100}%` } })
   ] });
 }
 function Stat({ label, value, icon: icon2, change, changeTone, description, trend, className }) {
@@ -3753,24 +3821,24 @@ function Stat({ label, value, icon: icon2, change, changeTone, description, tren
   const rising = change ? !/^[-−]/.test(change) : false;
   return /* @__PURE__ */ jsxs35("div", { className: cx("ow-stat", className), children: [
     /* @__PURE__ */ jsxs35("div", { className: "ow-stat__label", children: [
-      icon2 ? /* @__PURE__ */ jsx41("span", { className: "ow-stat__icon", children: icon2 }) : null,
-      /* @__PURE__ */ jsx41("span", { children: label })
+      icon2 ? /* @__PURE__ */ jsx42("span", { className: "ow-stat__icon", children: icon2 }) : null,
+      /* @__PURE__ */ jsx42("span", { children: label })
     ] }),
     /* @__PURE__ */ jsxs35("div", { className: "ow-stat__row", children: [
-      /* @__PURE__ */ jsx41("span", { className: "ow-stat__value", children: value }),
+      /* @__PURE__ */ jsx42("span", { className: "ow-stat__value", children: value }),
       change ? /* @__PURE__ */ jsxs35("span", { className: cx("ow-stat__change", `ow-stat__change--${tone}`), children: [
-        tone === "neutral" ? null : rising ? /* @__PURE__ */ jsx41(ArrowUpIcon, { size: 12 }) : /* @__PURE__ */ jsx41(ArrowDownIcon, { size: 12 }),
+        tone === "neutral" ? null : rising ? /* @__PURE__ */ jsx42(ArrowUpIcon, { size: 12 }) : /* @__PURE__ */ jsx42(ArrowDownIcon, { size: 12 }),
         change
       ] }) : null
     ] }),
-    description ? /* @__PURE__ */ jsx41("div", { className: "ow-stat__description", children: description }) : null,
-    trend && trend.length > 1 ? /* @__PURE__ */ jsx41(Sparkline, { values: trend }) : null
+    description ? /* @__PURE__ */ jsx42("div", { className: "ow-stat__description", children: description }) : null,
+    trend && trend.length > 1 ? /* @__PURE__ */ jsx42(Sparkline, { values: trend }) : null
   ] });
 }
 
 // src/components/FileTree/FileTree.tsx
 import { useMemo as useMemo6, useRef as useRef21, useState as useState17 } from "react";
-import { jsx as jsx42, jsxs as jsxs36 } from "react/jsx-runtime";
+import { jsx as jsx43, jsxs as jsxs36 } from "react/jsx-runtime";
 function flatten(nodes, expanded, parent, level = 1) {
   return nodes.flatMap((node) => {
     const path = parent ? `${parent}/${node.name}` : node.name;
@@ -3848,7 +3916,7 @@ function FileTree({
       const row = rows.find((entry) => entry.path === path);
       if (!row) return null;
       const isOpen = row.isFolder && expanded.has(path);
-      const icon2 = node.icon ?? (row.isFolder ? isOpen ? /* @__PURE__ */ jsx42(FolderOpenIcon, { size: 16 }) : /* @__PURE__ */ jsx42(FolderIcon, { size: 16 }) : /* @__PURE__ */ jsx42(FileIcon, { size: 16 }));
+      const icon2 = node.icon ?? (row.isFolder ? isOpen ? /* @__PURE__ */ jsx43(FolderOpenIcon, { size: 16 }) : /* @__PURE__ */ jsx43(FolderIcon, { size: 16 }) : /* @__PURE__ */ jsx43(FileIcon, { size: 16 }));
       return /* @__PURE__ */ jsxs36(
         "li",
         {
@@ -3877,51 +3945,51 @@ function FileTree({
                   activate(row);
                 },
                 children: [
-                  row.isFolder ? /* @__PURE__ */ jsx42(ChevronRightIcon, { size: 14, className: cx("ow-tree__chevron", isOpen && "ow-tree__chevron--open") }) : /* @__PURE__ */ jsx42("span", { className: "ow-tree__spacer" }),
-                  /* @__PURE__ */ jsx42("span", { className: cx("ow-tree__icon", row.isFolder && "ow-tree__icon--folder"), children: icon2 }),
-                  /* @__PURE__ */ jsx42("span", { className: "ow-tree__name", children: node.name }),
-                  node.meta ? /* @__PURE__ */ jsx42("span", { className: "ow-tree__meta", children: node.meta }) : null
+                  row.isFolder ? /* @__PURE__ */ jsx43(ChevronRightIcon, { size: 14, className: cx("ow-tree__chevron", isOpen && "ow-tree__chevron--open") }) : /* @__PURE__ */ jsx43("span", { className: "ow-tree__spacer" }),
+                  /* @__PURE__ */ jsx43("span", { className: cx("ow-tree__icon", row.isFolder && "ow-tree__icon--folder"), children: icon2 }),
+                  /* @__PURE__ */ jsx43("span", { className: "ow-tree__name", children: node.name }),
+                  node.meta ? /* @__PURE__ */ jsx43("span", { className: "ow-tree__meta", children: node.meta }) : null
                 ]
               }
             ),
-            isOpen && node.children.length > 0 ? /* @__PURE__ */ jsx42("ul", { role: "group", className: "ow-tree__group", children: render(node.children, path, level + 1) }) : null
+            isOpen && node.children.length > 0 ? /* @__PURE__ */ jsx43("ul", { role: "group", className: "ow-tree__group", children: render(node.children, path, level + 1) }) : null
           ]
         },
         path
       );
     });
   }
-  return /* @__PURE__ */ jsx42("ul", { role: "tree", "aria-label": label, className: cx("ow-tree", className), children: render(items2) });
+  return /* @__PURE__ */ jsx43("ul", { role: "tree", "aria-label": label, className: cx("ow-tree", className), children: render(items2) });
 }
 
 // src/components/EmptyState/EmptyState.tsx
-import { jsx as jsx43, jsxs as jsxs37 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs37 } from "react/jsx-runtime";
 function EmptyState({ title, description, icon: icon2, actions, bordered = false, className }) {
   return /* @__PURE__ */ jsxs37("div", { className: cx("ow-empty", bordered && "ow-empty--bordered", className), children: [
-    /* @__PURE__ */ jsx43("span", { className: "ow-empty__icon", "aria-hidden": "true", children: icon2 ?? /* @__PURE__ */ jsx43(InboxIcon, { size: 20 }) }),
+    /* @__PURE__ */ jsx44("span", { className: "ow-empty__icon", "aria-hidden": "true", children: icon2 ?? /* @__PURE__ */ jsx44(InboxIcon, { size: 20 }) }),
     /* @__PURE__ */ jsxs37("div", { className: "ow-empty__text", children: [
-      /* @__PURE__ */ jsx43("p", { className: "ow-empty__title", children: title }),
-      description ? /* @__PURE__ */ jsx43("p", { className: "ow-empty__description", children: description }) : null
+      /* @__PURE__ */ jsx44("p", { className: "ow-empty__title", children: title }),
+      description ? /* @__PURE__ */ jsx44("p", { className: "ow-empty__description", children: description }) : null
     ] }),
-    actions ? /* @__PURE__ */ jsx43("div", { className: "ow-empty__actions", children: actions }) : null
+    actions ? /* @__PURE__ */ jsx44("div", { className: "ow-empty__actions", children: actions }) : null
   ] });
 }
 
 // src/components/Tag/Tag.tsx
-import { jsx as jsx44, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx45, jsxs as jsxs38 } from "react/jsx-runtime";
 function Tag({ onRemove, variant = "neutral", size = "md", icon: icon2, removeLabel, className, children, ...props }) {
   const name = removeLabel ?? (typeof children === "string" ? children : "tag");
   return /* @__PURE__ */ jsxs38("span", { className: cx("ow-tag", `ow-tag--${variant}`, `ow-tag--${size}`, onRemove && "ow-tag--removable", className), ...props, children: [
-    icon2 ? /* @__PURE__ */ jsx44("span", { className: "ow-tag__icon", children: icon2 }) : null,
-    /* @__PURE__ */ jsx44("span", { className: "ow-tag__label", children }),
-    onRemove ? /* @__PURE__ */ jsx44("button", { type: "button", className: "ow-tag__remove", "aria-label": `Remove ${name}`, onClick: onRemove, children: /* @__PURE__ */ jsx44(XIcon, { size: 12 }) }) : null
+    icon2 ? /* @__PURE__ */ jsx45("span", { className: "ow-tag__icon", children: icon2 }) : null,
+    /* @__PURE__ */ jsx45("span", { className: "ow-tag__label", children }),
+    onRemove ? /* @__PURE__ */ jsx45("button", { type: "button", className: "ow-tag__remove", "aria-label": `Remove ${name}`, onClick: onRemove, children: /* @__PURE__ */ jsx45(XIcon, { size: 12 }) }) : null
   ] });
 }
 function TagGroup({ label, className, children, ...props }) {
-  return /* @__PURE__ */ jsx44("div", { role: "group", "aria-label": label, className: cx("ow-tag-group", className), ...props, children });
+  return /* @__PURE__ */ jsx45("div", { role: "group", "aria-label": label, className: cx("ow-tag-group", className), ...props, children });
 }
 function ColorSwatch({ color, name, value, size = "md", shape = "square", className }) {
-  const swatch = /* @__PURE__ */ jsx44(
+  const swatch = /* @__PURE__ */ jsx45(
     "span",
     {
       className: cx("ow-swatch", `ow-swatch--${size}`, shape === "circle" && "ow-swatch--circle"),
@@ -3929,43 +3997,53 @@ function ColorSwatch({ color, name, value, size = "md", shape = "square", classN
       ...name && !value ? { role: "img", "aria-label": name } : { "aria-hidden": true }
     }
   );
-  if (!name && !value) return /* @__PURE__ */ jsx44("span", { className, children: swatch });
+  if (!name && !value) return /* @__PURE__ */ jsx45("span", { className, children: swatch });
   return /* @__PURE__ */ jsxs38("span", { className: cx("ow-swatch-label", className), children: [
     swatch,
     /* @__PURE__ */ jsxs38("span", { className: "ow-swatch-label__text", children: [
-      name ? /* @__PURE__ */ jsx44("span", { className: "ow-swatch-label__name", children: name }) : null,
-      /* @__PURE__ */ jsx44("span", { className: "ow-swatch-label__value", children: value })
+      name ? /* @__PURE__ */ jsx45("span", { className: "ow-swatch-label__name", children: name }) : null,
+      /* @__PURE__ */ jsx45("span", { className: "ow-swatch-label__value", children: value })
     ] })
   ] });
 }
 
 // src/components/Avatar/Avatar.tsx
 import { useState as useState18 } from "react";
-import { jsx as jsx45 } from "react/jsx-runtime";
+import { jsx as jsx46 } from "react/jsx-runtime";
+var namedSizes = { sm: 24, md: 28, lg: 36, xl: 48 };
+function avatarSize(size) {
+  if (typeof size === "number") {
+    return { className: "ow-avatar--custom", style: { "--ow-avatar-size": `${size}px` }, pixels: size };
+  }
+  return { className: `ow-avatar--${size}`, pixels: namedSizes[size] };
+}
 function Avatar({ name, src, size = "md", label, className }) {
   const initials = getInitials(name);
   const [failedImage, setFailedImage] = useState18();
   const showImage = src && src !== failedImage;
-  return /* @__PURE__ */ jsx45(
+  const sizing = avatarSize(size);
+  return /* @__PURE__ */ jsx46(
     "span",
     {
-      className: cx("ow-avatar", `ow-avatar--${size}`, !initials && !showImage && "ow-avatar--empty", className),
+      className: cx("ow-avatar", sizing.className, !initials && !showImage && "ow-avatar--empty", className),
+      style: sizing.style,
       ...label ? { role: "img", "aria-label": label } : { "aria-hidden": true },
-      children: showImage ? /* @__PURE__ */ jsx45("img", { src, alt: "", className: "ow-avatar__image", onError: () => setFailedImage(src) }) : initials || /* @__PURE__ */ jsx45(UserIcon, { size: size === "sm" ? 13 : size === "lg" ? 18 : 15 })
+      children: showImage ? /* @__PURE__ */ jsx46("img", { src, alt: "", className: "ow-avatar__image", onError: () => setFailedImage(src) }) : initials || /* @__PURE__ */ jsx46(UserIcon, { size: Math.round(sizing.pixels * 0.52) })
     }
   );
 }
 
 // src/components/Avatar/AvatarGroup.tsx
 import { Children, cloneElement as cloneElement4, isValidElement as isValidElement4 } from "react";
-import { jsx as jsx46, jsxs as jsxs39 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs39 } from "react/jsx-runtime";
 function AvatarGroup({ children, max = 4, size = "md", label, className }) {
   const avatars = Children.toArray(children).filter(isValidElement4);
+  const sizing = avatarSize(size);
   const shown = avatars.slice(0, max);
   const hidden = avatars.length - shown.length;
   return /* @__PURE__ */ jsxs39("div", { role: "group", "aria-label": label, className: cx("ow-avatar-group", className), children: [
     shown.map((avatar) => cloneElement4(avatar, { size })),
-    hidden > 0 ? /* @__PURE__ */ jsxs39("span", { className: cx("ow-avatar", `ow-avatar--${size}`, "ow-avatar--count"), children: [
+    hidden > 0 ? /* @__PURE__ */ jsxs39("span", { className: cx("ow-avatar", sizing.className, "ow-avatar--count"), style: sizing.style, children: [
       /* @__PURE__ */ jsxs39("span", { "aria-hidden": "true", children: [
         "+",
         hidden
@@ -3978,37 +4056,41 @@ function AvatarGroup({ children, max = 4, size = "md", label, className }) {
     ] }) : null
   ] });
 }
+function userSize(size) {
+  if (typeof size !== "number") return `ow-user--${size}`;
+  return size >= 48 ? "ow-user--xl" : size >= 36 ? "ow-user--lg" : size >= 28 ? "ow-user--md" : "ow-user--sm";
+}
 function User({ name, description, src, size = "md", className }) {
-  return /* @__PURE__ */ jsxs39("div", { className: cx("ow-user", `ow-user--${size}`, className), children: [
-    /* @__PURE__ */ jsx46(Avatar, { name, src, size }),
+  return /* @__PURE__ */ jsxs39("div", { className: cx("ow-user", userSize(size), className), children: [
+    /* @__PURE__ */ jsx47(Avatar, { name, src, size }),
     /* @__PURE__ */ jsxs39("div", { className: "ow-user__text", children: [
-      /* @__PURE__ */ jsx46("span", { className: "ow-user__name", children: name }),
-      description ? /* @__PURE__ */ jsx46("span", { className: "ow-user__description", children: description }) : null
+      /* @__PURE__ */ jsx47("span", { className: "ow-user__name", children: name }),
+      description ? /* @__PURE__ */ jsx47("span", { className: "ow-user__description", children: description }) : null
     ] })
   ] });
 }
 
 // src/components/Kbd/Kbd.tsx
-import { jsx as jsx47 } from "react/jsx-runtime";
+import { jsx as jsx48 } from "react/jsx-runtime";
 function Kbd({ className, ...props }) {
-  return /* @__PURE__ */ jsx47("kbd", { className: cx("ow-kbd", className), ...props });
+  return /* @__PURE__ */ jsx48("kbd", { className: cx("ow-kbd", className), ...props });
 }
 function Code({ className, ...props }) {
-  return /* @__PURE__ */ jsx47("code", { className: cx("ow-code", className), ...props });
+  return /* @__PURE__ */ jsx48("code", { className: cx("ow-code", className), ...props });
 }
 
 // src/components/Card/Card.tsx
-import { jsx as jsx48, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs40 } from "react/jsx-runtime";
 function Card({ className, padding = "md", ...props }) {
-  return /* @__PURE__ */ jsx48("div", { className: cx("ow-card", `ow-card--pad-${padding}`, className), ...props });
+  return /* @__PURE__ */ jsx49("div", { className: cx("ow-card", `ow-card--pad-${padding}`, className), ...props });
 }
 function SettingsRow({ children, description, label, className }) {
   return /* @__PURE__ */ jsxs40("div", { className: cx("ow-settings-row", className), children: [
     /* @__PURE__ */ jsxs40("div", { className: "ow-settings-row__text", children: [
-      /* @__PURE__ */ jsx48("span", { className: "ow-settings-row__label", children: label }),
-      description ? /* @__PURE__ */ jsx48("div", { className: "ow-settings-row__description", children: description }) : null
+      /* @__PURE__ */ jsx49("span", { className: "ow-settings-row__label", children: label }),
+      description ? /* @__PURE__ */ jsx49("div", { className: "ow-settings-row__description", children: description }) : null
     ] }),
-    /* @__PURE__ */ jsx48("div", { className: "ow-settings-row__control", children })
+    /* @__PURE__ */ jsx49("div", { className: "ow-settings-row__control", children })
   ] });
 }
 
@@ -4018,7 +4100,7 @@ import {
   useRef as useRef22,
   useState as useState19
 } from "react";
-import { jsx as jsx49 } from "react/jsx-runtime";
+import { jsx as jsx50 } from "react/jsx-runtime";
 var space = (token) => token === "none" ? "0" : `var(--ow-space-${token})`;
 var alignments = { start: "flex-start", center: "center", end: "flex-end", stretch: "stretch", baseline: "baseline", between: "space-between" };
 function Stack({
@@ -4034,7 +4116,7 @@ function Stack({
   ...props
 }) {
   const Element = as;
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     Element,
     {
       className: cx("ow-stack", className),
@@ -4054,9 +4136,9 @@ function Stack({
 function Separator({ orientation = "horizontal", label, spacing = "none", className }) {
   const margin2 = orientation === "horizontal" ? `${space(spacing)} 0` : `0 ${space(spacing)}`;
   if (label && orientation === "horizontal") {
-    return /* @__PURE__ */ jsx49("div", { role: "separator", className: cx("ow-separator-label", className), style: { margin: margin2 }, children: /* @__PURE__ */ jsx49("span", { className: "ow-separator-label__text", children: label }) });
+    return /* @__PURE__ */ jsx50("div", { role: "separator", className: cx("ow-separator-label", className), style: { margin: margin2 }, children: /* @__PURE__ */ jsx50("span", { className: "ow-separator-label__text", children: label }) });
   }
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     "div",
     {
       role: "separator",
@@ -4096,7 +4178,7 @@ function ScrollShadow({
       observer?.disconnect();
     };
   }, [orientation]);
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     "div",
     {
       ref,
@@ -4117,14 +4199,14 @@ function ScrollShadow({
   );
 }
 function VisuallyHidden({ className, ...props }) {
-  return /* @__PURE__ */ jsx49("span", { className: cx("ow-visually-hidden", className), ...props });
+  return /* @__PURE__ */ jsx50("span", { className: cx("ow-visually-hidden", className), ...props });
 }
 
 // src/components/Marketing/Marketing.tsx
 import { useRef as useRef23 } from "react";
-import { jsx as jsx50, jsxs as jsxs41 } from "react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs41 } from "react/jsx-runtime";
 function Chip({ className, ...props }) {
-  return /* @__PURE__ */ jsx50("span", { className: cx("ow-chip", className), ...props });
+  return /* @__PURE__ */ jsx51("span", { className: cx("ow-chip", className), ...props });
 }
 function SectionHeading({
   eyebrow,
@@ -4135,16 +4217,16 @@ function SectionHeading({
   className
 }) {
   return /* @__PURE__ */ jsxs41("div", { className: cx("ow-section-heading", align === "center" && "ow-section-heading--center", className), children: [
-    eyebrow ? /* @__PURE__ */ jsx50(Chip, { children: eyebrow }) : null,
-    /* @__PURE__ */ jsx50(Heading, { className: "ow-section-heading__title", children: title }),
-    intro ? /* @__PURE__ */ jsx50("p", { className: "ow-section-heading__intro", children: intro }) : null
+    eyebrow ? /* @__PURE__ */ jsx51(Chip, { children: eyebrow }) : null,
+    /* @__PURE__ */ jsx51(Heading, { className: "ow-section-heading__title", children: title }),
+    intro ? /* @__PURE__ */ jsx51("p", { className: "ow-section-heading__intro", children: intro }) : null
   ] });
 }
 function SiteHeader({ brand, nav, actions, className }) {
   return /* @__PURE__ */ jsxs41("header", { className: cx("ow-site-header", className), children: [
-    /* @__PURE__ */ jsx50("div", { className: "ow-site-header__brand", children: brand }),
-    nav ? /* @__PURE__ */ jsx50("nav", { className: "ow-site-header__nav", children: nav }) : null,
-    actions ? /* @__PURE__ */ jsx50("div", { className: "ow-site-header__actions", children: actions }) : null
+    /* @__PURE__ */ jsx51("div", { className: "ow-site-header__brand", children: brand }),
+    nav ? /* @__PURE__ */ jsx51("nav", { className: "ow-site-header__nav", children: nav }) : null,
+    actions ? /* @__PURE__ */ jsx51("div", { className: "ow-site-header__actions", children: actions }) : null
   ] });
 }
 function DotGrid({ fade = false, interactive = false, className, children, onPointerMove, ...props }) {
@@ -4165,9 +4247,9 @@ function DotGrid({ fade = false, interactive = false, className, children, onPoi
       onPointerMove: track,
       ...props,
       children: [
-        /* @__PURE__ */ jsx50("span", { className: "ow-dot-grid__dots", "aria-hidden": "true" }),
-        interactive ? /* @__PURE__ */ jsx50("span", { className: "ow-dot-grid__brass", "aria-hidden": "true" }) : null,
-        /* @__PURE__ */ jsx50("div", { className: "ow-dot-grid__content", children })
+        /* @__PURE__ */ jsx51("span", { className: "ow-dot-grid__dots", "aria-hidden": "true" }),
+        interactive ? /* @__PURE__ */ jsx51("span", { className: "ow-dot-grid__brass", "aria-hidden": "true" }) : null,
+        /* @__PURE__ */ jsx51("div", { className: "ow-dot-grid__content", children })
       ]
     }
   );
@@ -4176,7 +4258,7 @@ function DotGrid({ fade = false, interactive = false, className, children, onPoi
 // src/components/ColorPicker/ColorPicker.tsx
 import { forwardRef as forwardRef16, useCallback as useCallback6, useEffect as useEffect18, useId as useId18, useRef as useRef24, useState as useState20 } from "react";
 import { HexAlphaColorPicker, HexColorInput, HexColorPicker } from "react-colorful";
-import { Fragment as Fragment9, jsx as jsx51, jsxs as jsxs42 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx52, jsxs as jsxs42 } from "react/jsx-runtime";
 var swatchColor = (swatch) => typeof swatch === "string" ? swatch : swatch.color;
 var swatchName = (swatch) => typeof swatch === "string" ? swatch : swatch.name;
 var same = (a, b) => a.toLowerCase().replace(/^#/, "") === b.toLowerCase().replace(/^#/, "");
@@ -4212,12 +4294,12 @@ function ColorPicker({
     }
   }
   return /* @__PURE__ */ jsxs42("div", { ref: rootRef, role: "group", "aria-label": ariaLabel, className: cx("ow-color-picker", className), children: [
-    /* @__PURE__ */ jsx51(Picker, { color, onChange: change }),
+    /* @__PURE__ */ jsx52(Picker, { color, onChange: change }),
     showInput || eyeDropper && canPick ? /* @__PURE__ */ jsxs42("div", { className: "ow-color-picker__row", children: [
-      eyeDropper && canPick ? /* @__PURE__ */ jsx51("button", { type: "button", className: "ow-color-picker__dropper", "aria-label": "Pick a colour from the screen", onClick: pickFromScreen, children: /* @__PURE__ */ jsx51(PipetteIcon, { size: 15 }) }) : null,
+      eyeDropper && canPick ? /* @__PURE__ */ jsx52("button", { type: "button", className: "ow-color-picker__dropper", "aria-label": "Pick a colour from the screen", onClick: pickFromScreen, children: /* @__PURE__ */ jsx52(PipetteIcon, { size: 15 }) }) : null,
       showInput ? /* @__PURE__ */ jsxs42("span", { className: "ow-input-group ow-input-group--sm ow-color-picker__input", children: [
-        /* @__PURE__ */ jsx51("span", { className: "ow-input-group__addon", "aria-hidden": "true", children: "#" }),
-        /* @__PURE__ */ jsx51(
+        /* @__PURE__ */ jsx52("span", { className: "ow-input-group__addon", "aria-hidden": "true", children: "#" }),
+        /* @__PURE__ */ jsx52(
           HexColorInput,
           {
             className: "ow-input-group__input",
@@ -4229,11 +4311,11 @@ function ColorPicker({
           }
         )
       ] }) : null,
-      /* @__PURE__ */ jsx51("span", { className: "ow-color-picker__preview", style: { "--ow-color-picker-value": color }, "aria-hidden": "true" })
+      /* @__PURE__ */ jsx52("span", { className: "ow-color-picker__preview", style: { "--ow-color-picker-value": color }, "aria-hidden": "true" })
     ] }) : null,
-    swatches?.length ? /* @__PURE__ */ jsx51("div", { className: "ow-color-picker__swatches", role: "group", "aria-label": "Swatches", children: swatches.map((swatch) => {
+    swatches?.length ? /* @__PURE__ */ jsx52("div", { className: "ow-color-picker__swatches", role: "group", "aria-label": "Swatches", children: swatches.map((swatch) => {
       const swatchValue = swatchColor(swatch);
-      return /* @__PURE__ */ jsx51(
+      return /* @__PURE__ */ jsx52(
         "button",
         {
           type: "button",
@@ -4318,13 +4400,13 @@ var ColorField = forwardRef16(function ColorField2({
           }
         },
         children: [
-          /* @__PURE__ */ jsx51("span", { className: "ow-color-field__swatch", style: { "--ow-color-picker-value": color }, "aria-hidden": "true" }),
-          /* @__PURE__ */ jsx51("span", { id: `${panelId}-value`, className: "ow-select__value ow-color-field__value", children: color.toUpperCase() }),
-          /* @__PURE__ */ jsx51(ChevronDownIcon, { size: size === "sm" ? 14 : 16, className: "ow-select__chevron" })
+          /* @__PURE__ */ jsx52("span", { className: "ow-color-field__swatch", style: { "--ow-color-picker-value": color }, "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx52("span", { id: `${panelId}-value`, className: "ow-select__value ow-color-field__value", children: color.toUpperCase() }),
+          /* @__PURE__ */ jsx52(ChevronDownIcon, { size: size === "sm" ? 14 : 16, className: "ow-select__chevron" })
         ]
       }
     ),
-    mounted ? /* @__PURE__ */ jsx51(
+    mounted ? /* @__PURE__ */ jsx52(
       "div",
       {
         ref: panelRef,
@@ -4338,7 +4420,7 @@ var ColorField = forwardRef16(function ColorField2({
         onKeyDown: (event) => {
           if (event.key === "Enter" && event.target.closest(".react-colorful")) close();
         },
-        children: /* @__PURE__ */ jsx51(ColorPicker, { ...pickerProps, value: color, onChange: setColor })
+        children: /* @__PURE__ */ jsx52(ColorPicker, { ...pickerProps, value: color, onChange: setColor })
       }
     ) : null
   ] });
@@ -4613,6 +4695,7 @@ export {
   Tabs,
   Tag,
   TagGroup,
+  Text,
   Textarea,
   Toaster,
   ToggleButton,