@aviala-design/spiral 2.8.1 → 2.9.0

package/dist/index.cjs

@@ -76,6 +76,18 @@ __export(index_exports, {
   DatePickerContent: () => DatePickerContent,
   DatePickerField: () => DatePickerField,
   DatePickerTrigger: () => DatePickerTrigger,
+  Drawer: () => Drawer,
+  DrawerBody: () => DrawerBody,
+  DrawerClose: () => DrawerClose,
+  DrawerContent: () => DrawerContent,
+  DrawerDescription: () => DrawerDescription,
+  DrawerFooter: () => DrawerFooter,
+  DrawerHeader: () => DrawerHeader,
+  DrawerHeaderText: () => DrawerHeaderText,
+  DrawerOverlay: () => DrawerOverlay,
+  DrawerPortal: () => DrawerPortal,
+  DrawerTitle: () => DrawerTitle,
+  DrawerTrigger: () => DrawerTrigger,
   Feedback: () => Feedback,
   Fieldset: () => Fieldset,
   Form: () => Form,
@@ -191,6 +203,7 @@ __export(index_exports, {
   backChevronSide: () => backChevronSide,
   buttonVariants: () => buttonVariants,
   cn: () => cn,
+  drawerContentVariants: () => drawerContentVariants,
   enUS: () => en_US_default,
   formatDisplayDate: () => formatDisplayDate,
   formatMonthYear: () => formatMonthYear,
@@ -528,6 +541,9 @@ var zhCN = {
   Modal: {
     close: "\u5173\u95ED\u5BF9\u8BDD\u6846"
   },
+  Drawer: {
+    close: "\u5173\u95ED\u62BD\u5C49"
+  },
   Feedback: {
     close: "\u5173\u95ED"
   },
@@ -662,6 +678,9 @@ var enUS = {
   Modal: {
     close: "Close dialog"
   },
+  Drawer: {
+    close: "Close drawer"
+  },
   Feedback: {
     close: "Dismiss"
   },
@@ -5197,6 +5216,7 @@ var Slider = (0, import_react39.forwardRef)(
     onLostPointerCapture,
     showValueTooltip = false,
     formatValueTooltip,
+    orientation,
     ...props
   }, ref) => {
     const resolvedType = type ?? "default";
@@ -5209,10 +5229,31 @@ var Slider = (0, import_react39.forwardRef)(
     const [activeThumbIndex, setActiveThumbIndex] = (0, import_react39.useState)(
       null
     );
+    const valueTransitionAxisKey = `${resolvedType}:${orientation ?? "horizontal"}`;
+    const [valueTransitionGate, setValueTransitionGate] = (0, import_react39.useState)({
+      axisKey: valueTransitionAxisKey,
+      ready: false
+    });
+    const valueTransitionReady = valueTransitionGate.axisKey === valueTransitionAxisKey && valueTransitionGate.ready;
     const [uncontrolledValue, setUncontrolledValue] = (0, import_react39.useState)(
       resolvedDefaultValue
     );
     const currentValues = value ?? uncontrolledValue;
+    (0, import_react39.useLayoutEffect)(() => {
+      let frame2 = 0;
+      const frame1 = requestAnimationFrame(() => {
+        frame2 = requestAnimationFrame(() => {
+          setValueTransitionGate({
+            axisKey: valueTransitionAxisKey,
+            ready: true
+          });
+        });
+      });
+      return () => {
+        cancelAnimationFrame(frame1);
+        cancelAnimationFrame(frame2);
+      };
+    }, [valueTransitionAxisKey]);
     const handleValueChange = (next) => {
       if (value == null) setUncontrolledValue(next);
       if (showValueTooltip) {
@@ -5264,7 +5305,9 @@ var Slider = (0, import_react39.forwardRef)(
         "data-type": resolvedType,
         "data-disabled": disabled ? "true" : void 0,
         "data-dragging": isDragging ? "true" : void 0,
+        "data-value-transition": valueTransitionReady ? "true" : void 0,
         "data-value-tooltip": showValueTooltip ? "true" : void 0,
+        orientation,
         onValueChange: handleValueChange,
         onPointerDown: handlePointerDown,
         onPointerMove: handlePointerMove,
@@ -8753,10 +8796,163 @@ var ModalFooter = (0, import_react52.forwardRef)(
 );
 ModalFooter.displayName = "ModalFooter";
 
-// src/components/tooltip.tsx
-var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"), 1);
+// src/components/drawer.tsx
+var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"), 1);
+var import_icons15 = require("@aviala-design/icons");
+var import_class_variance_authority12 = require("class-variance-authority");
 var import_react53 = require("react");
 var import_jsx_runtime50 = require("react/jsx-runtime");
+var DRAWER_ICON_SIZE = 22;
+var drawerContentVariants = (0, import_class_variance_authority12.cva)("aviala-drawer-content", {
+  variants: {
+    position: {
+      left: "aviala-drawer-content--position-left",
+      right: "aviala-drawer-content--position-right",
+      top: "aviala-drawer-content--position-top",
+      bottom: "aviala-drawer-content--position-bottom"
+    }
+  },
+  defaultVariants: {
+    position: "right"
+  }
+});
+function assignRef4(ref, value) {
+  if (!ref) return;
+  if (typeof ref === "function") {
+    ref(value);
+    return;
+  }
+  ref.current = value;
+}
+function renderDrawerIcon(node) {
+  if (!node) return null;
+  const content = (0, import_react53.isValidElement)(node) && typeof node.type !== "string" ? (0, import_react53.cloneElement)(node, {
+    width: DRAWER_ICON_SIZE,
+    height: DRAWER_ICON_SIZE,
+    className: cn(
+      node.props.className,
+      "shrink-0"
+    )
+  }) : node;
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "aviala-drawer__icon", "aria-hidden": true, children: content });
+}
+var Drawer = DialogPrimitive2.Root;
+var DrawerTrigger = DialogPrimitive2.Trigger;
+var DrawerPortal = DialogPrimitive2.Portal;
+var DrawerClose = DialogPrimitive2.Close;
+var DrawerOverlay = (0, import_react53.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+  DialogPrimitive2.Overlay,
+  {
+    ref,
+    className: cn("aviala-drawer-overlay", className),
+    ...props
+  }
+));
+DrawerOverlay.displayName = DialogPrimitive2.Overlay.displayName;
+var DrawerContent = (0, import_react53.forwardRef)(
+  ({
+    className,
+    children,
+    position = "right",
+    portalled = true,
+    showOverlay = true,
+    onOpenAutoFocus,
+    ...props
+  }, ref) => {
+    const [overlayContainer, setOverlayContainer] = (0, import_react53.useState)(null);
+    const overlay = showOverlay ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DrawerOverlay, {}) : null;
+    const panel = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+      DialogPrimitive2.Content,
+      {
+        ref: (node) => {
+          assignRef4(ref, node);
+          setOverlayContainer(node);
+        },
+        className: cn(drawerContentVariants({ position }), className),
+        "data-position": position ?? "right",
+        onOpenAutoFocus,
+        ...props,
+        children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(OverlayContainerProvider, { container: overlayContainer, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "aviala-drawer-content__surface", children }) })
+      }
+    );
+    if (!portalled) {
+      return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
+        overlay,
+        panel
+      ] });
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(DialogPrimitive2.Portal, { children: [
+      overlay,
+      panel
+    ] });
+  }
+);
+DrawerContent.displayName = DialogPrimitive2.Content.displayName;
+var DrawerHeader = (0, import_react53.forwardRef)(
+  ({
+    className,
+    children,
+    icon,
+    showIcon = false,
+    showClose = true,
+    closeLabel,
+    ...props
+  }, ref) => {
+    const locale = useLocaleMessages("Drawer");
+    const resolvedCloseLabel = closeLabel ?? locale.close;
+    return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { ref, className: cn("aviala-drawer__header", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "aviala-drawer__header-row", children: [
+      showIcon ? renderDrawerIcon(icon) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "aviala-drawer__header-main", children }),
+      showClose ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DialogPrimitive2.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+        Button,
+        {
+          type: "button",
+          mode: "noBackgroundCustom",
+          iconOnly: true,
+          "aria-label": resolvedCloseLabel,
+          className: "aviala-drawer__close",
+          leftIcon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons15.SymbolWrong, { "aria-hidden": true })
+        }
+      ) }) : null
+    ] }) });
+  }
+);
+DrawerHeader.displayName = "DrawerHeader";
+var DrawerTitle = (0, import_react53.forwardRef)(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DialogPrimitive2.Title, { ref, asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Typography, { level: "text", className: cn("aviala-drawer__title", className), children }) }));
+DrawerTitle.displayName = DialogPrimitive2.Title.displayName;
+var DrawerDescription = (0, import_react53.forwardRef)(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DialogPrimitive2.Description, { ref, asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Typography, { level: "caption", className: cn("aviala-drawer__description", className), children }) }));
+DrawerDescription.displayName = DialogPrimitive2.Description.displayName;
+function DrawerHeaderText({
+  title,
+  description,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DrawerHeader, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "aviala-drawer__header-typeface", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DrawerTitle, { children: title }),
+    description ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DrawerDescription, { children: description }) : null
+  ] }) });
+}
+var DrawerBody = (0, import_react53.forwardRef)(
+  ({ className, children, layout = "default", title, description, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { ref, className: cn("aviala-drawer__body", className), ...props, children: layout === "text" ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+    Typeface,
+    {
+      className: "aviala-drawer__body-typeface",
+      content: "textTitle",
+      primary: title,
+      secondary: description ?? children
+    }
+  ) : children })
+);
+DrawerBody.displayName = "DrawerBody";
+var DrawerFooter = (0, import_react53.forwardRef)(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { ref, className: cn("aviala-drawer__footer", className), ...props })
+);
+DrawerFooter.displayName = "DrawerFooter";
+
+// src/components/tooltip.tsx
+var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"), 1);
+var import_react54 = require("react");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var TOOLTIP_DELAY_DURATION = 300;
 function TooltipProvider({
   children,
@@ -8764,7 +8960,7 @@ function TooltipProvider({
   skipDelayDuration = 0,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
     TooltipPrimitive.Provider,
     {
       delayDuration,
@@ -8776,7 +8972,7 @@ function TooltipProvider({
 }
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
-var TooltipContent = (0, import_react53.forwardRef)(
+var TooltipContent = (0, import_react54.forwardRef)(
   ({
     className,
     children,
@@ -8787,7 +8983,7 @@ var TooltipContent = (0, import_react53.forwardRef)(
     ...props
   }, ref) => {
     const overlayContainer = useOverlayPortalContainer();
-    return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(TooltipPrimitive.Portal, { container: overlayContainer, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TooltipPrimitive.Portal, { container: overlayContainer, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
       TooltipPrimitive.Content,
       {
         ref,
@@ -8796,7 +8992,7 @@ var TooltipContent = (0, import_react53.forwardRef)(
         className: cn("aviala-tooltip-content", className),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
             "div",
             {
               className: cn(
@@ -8806,13 +9002,13 @@ var TooltipContent = (0, import_react53.forwardRef)(
               children
             }
           ),
-          showArrow ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+          showArrow ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
             TooltipPrimitive.Arrow,
             {
               asChild: true,
               width: TOOLTIP_POINTER.width,
               height: TOOLTIP_POINTER.height,
-              children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                 OverlayPointerSvg,
                 {
                   className: "aviala-tooltip-content__arrow",
@@ -8831,8 +9027,8 @@ var TooltipContent = (0, import_react53.forwardRef)(
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 
 // src/components/responsive-tooltip.tsx
-var import_react54 = require("react");
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_react55 = require("react");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var RESPONSIVE_TOOLTIP_LONG_PRESS_MS = 500;
 var LONG_PRESS_MOVE_THRESHOLD_PX = 10;
 function ResponsiveTooltip({
@@ -8853,26 +9049,26 @@ function ResponsiveTooltip({
 }) {
   const coarse = useCoarsePointer();
   const isControlled = openProp !== void 0;
-  const [internalOpen, setInternalOpen] = (0, import_react54.useState)(defaultOpen);
+  const [internalOpen, setInternalOpen] = (0, import_react55.useState)(defaultOpen);
   const open = isControlled ? openProp : internalOpen;
-  const setOpen = (0, import_react54.useCallback)(
+  const setOpen = (0, import_react55.useCallback)(
     (next) => {
       if (!isControlled) setInternalOpen(next);
       onOpenChange?.(next);
     },
     [isControlled, onOpenChange]
   );
-  const longPressTimerRef = (0, import_react54.useRef)(null);
-  const pressOriginRef = (0, import_react54.useRef)(null);
-  const suppressClickRef = (0, import_react54.useRef)(false);
-  const clearLongPressTimer = (0, import_react54.useCallback)(() => {
+  const longPressTimerRef = (0, import_react55.useRef)(null);
+  const pressOriginRef = (0, import_react55.useRef)(null);
+  const suppressClickRef = (0, import_react55.useRef)(false);
+  const clearLongPressTimer = (0, import_react55.useCallback)(() => {
     if (longPressTimerRef.current != null) {
       clearTimeout(longPressTimerRef.current);
       longPressTimerRef.current = null;
     }
   }, []);
-  (0, import_react54.useEffect)(() => () => clearLongPressTimer(), [clearLongPressTimer]);
-  const handlePointerDown = (0, import_react54.useCallback)(
+  (0, import_react55.useEffect)(() => () => clearLongPressTimer(), [clearLongPressTimer]);
+  const handlePointerDown = (0, import_react55.useCallback)(
     (event) => {
       if (event.pointerType === "mouse") return;
       clearLongPressTimer();
@@ -8886,7 +9082,7 @@ function ResponsiveTooltip({
     },
     [clearLongPressTimer, longPressMs, setOpen]
   );
-  const handlePointerMove = (0, import_react54.useCallback)(
+  const handlePointerMove = (0, import_react55.useCallback)(
     (event) => {
       const origin = pressOriginRef.current;
       if (!origin || longPressTimerRef.current == null) return;
@@ -8899,13 +9095,13 @@ function ResponsiveTooltip({
     },
     [clearLongPressTimer]
   );
-  const handlePointerEnd = (0, import_react54.useCallback)(() => {
+  const handlePointerEnd = (0, import_react55.useCallback)(() => {
     clearLongPressTimer();
     pressOriginRef.current = null;
   }, [clearLongPressTimer]);
   if (coarse) {
-    return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(Popover, { open, onOpenChange: setOpen, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Popover, { open, onOpenChange: setOpen, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
         PopoverTrigger,
         {
           asChild: true,
@@ -8928,7 +9124,7 @@ function ResponsiveTooltip({
           children
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
         PopoverContent,
         {
           appearance: "tooltip",
@@ -8944,7 +9140,7 @@ function ResponsiveTooltip({
       )
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
     Tooltip,
     {
       delayDuration,
@@ -8952,8 +9148,8 @@ function ResponsiveTooltip({
       defaultOpen,
       onOpenChange,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TooltipTrigger, { asChild: true, children }),
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(TooltipTrigger, { asChild: true, children }),
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
           TooltipContent,
           {
             side,
@@ -8972,12 +9168,12 @@ function ResponsiveTooltip({
 }
 
 // src/components/feedback.tsx
-var import_class_variance_authority12 = require("class-variance-authority");
-var import_icons15 = require("@aviala-design/icons");
-var import_react55 = require("react");
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_class_variance_authority13 = require("class-variance-authority");
+var import_icons16 = require("@aviala-design/icons");
+var import_react56 = require("react");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var FEEDBACK_ICON_SIZE = 22;
-var feedbackVariants = (0, import_class_variance_authority12.cva)("aviala-feedback", {
+var feedbackVariants = (0, import_class_variance_authority13.cva)("aviala-feedback", {
   variants: {
     type: {
       information: "aviala-feedback--type-information",
@@ -9003,7 +9199,7 @@ var feedbackVariants = (0, import_class_variance_authority12.cva)("aviala-feedba
 });
 function renderFeedbackIcon(node) {
   if (!node) return null;
-  const content = (0, import_react55.isValidElement)(node) && typeof node.type !== "string" ? (0, import_react55.cloneElement)(node, {
+  const content = (0, import_react56.isValidElement)(node) && typeof node.type !== "string" ? (0, import_react56.cloneElement)(node, {
     width: FEEDBACK_ICON_SIZE,
     height: FEEDBACK_ICON_SIZE,
     className: cn(
@@ -9011,25 +9207,25 @@ function renderFeedbackIcon(node) {
       "shrink-0"
     )
   }) : node;
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "aviala-feedback__icon", "aria-hidden": true, children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "aviala-feedback__icon", "aria-hidden": true, children: content });
 }
 function defaultStatusIcon(type, mode) {
   const iconMode = mode === "primary" ? "fill" : "default";
   const thickness = "Regular";
   switch (type) {
     case "information":
-      return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_icons15.SymbolInformationCircle, { thickness, mode: iconMode, "aria-hidden": true });
+      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.SymbolInformationCircle, { thickness, mode: iconMode, "aria-hidden": true });
     case "warning":
-      return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_icons15.SymbolWarningCircle, { thickness, mode: iconMode, "aria-hidden": true });
+      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.SymbolWarningCircle, { thickness, mode: iconMode, "aria-hidden": true });
     case "wrong":
-      return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_icons15.SymbolWrongCircle, { thickness, mode: iconMode, "aria-hidden": true });
+      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.SymbolWrongCircle, { thickness, mode: iconMode, "aria-hidden": true });
     case "success":
-      return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_icons15.SymbolRightCircle, { thickness, mode: iconMode, "aria-hidden": true });
+      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.SymbolRightCircle, { thickness, mode: iconMode, "aria-hidden": true });
     case "normal":
-      return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_icons15.GeneralNotification, { thickness, mode: "default", "aria-hidden": true });
+      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.GeneralNotification, { thickness, mode: "default", "aria-hidden": true });
   }
 }
-var Feedback = (0, import_react55.forwardRef)(
+var Feedback = (0, import_react56.forwardRef)(
   ({
     className,
     type = "information",
@@ -9053,7 +9249,7 @@ var Feedback = (0, import_react55.forwardRef)(
     const tone = mode === "primary" ? "white" : "default";
     const isSmall = resolvedSize === "small";
     const resolvedRole = resolvedType === "wrong" ? "alert" : "status";
-    return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       "div",
       {
         ref,
@@ -9067,9 +9263,9 @@ var Feedback = (0, import_react55.forwardRef)(
         "data-size": resolvedSize,
         "data-mode": mode,
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "aviala-feedback__body", children: [
+        children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "aviala-feedback__body", children: [
           renderFeedbackIcon(icon ?? defaultStatusIcon(resolvedType, mode)),
-          isSmall ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Typography, { level: "text", tone, className: "aviala-feedback__title", children: title }) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+          isSmall ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Typography, { level: "text", tone, className: "aviala-feedback__title", children: title }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
             Typeface,
             {
               className: "aviala-feedback__typeface",
@@ -9079,7 +9275,7 @@ var Feedback = (0, import_react55.forwardRef)(
               tone
             }
           ),
-          action ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+          action ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
             Link,
             {
               level: "text",
@@ -9095,7 +9291,7 @@ var Feedback = (0, import_react55.forwardRef)(
               children: action
             }
           ) : null,
-          showClose ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+          showClose ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
             Link,
             {
               level: "text",
@@ -9104,7 +9300,7 @@ var Feedback = (0, import_react55.forwardRef)(
               href: onClose ? "#" : void 0,
               "aria-label": resolvedCloseLabel,
               className: "aviala-feedback__close",
-              leftIcon: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_icons15.SymbolWrong, { "aria-hidden": true }),
+              leftIcon: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.SymbolWrong, { "aria-hidden": true }),
               onClick: (event) => {
                 if (onClose) {
                   event.preventDefault();
@@ -9121,12 +9317,12 @@ var Feedback = (0, import_react55.forwardRef)(
 Feedback.displayName = "Feedback";
 
 // src/components/alert.tsx
-var import_icons16 = require("@aviala-design/icons");
-var import_class_variance_authority13 = require("class-variance-authority");
-var import_react56 = require("react");
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_icons17 = require("@aviala-design/icons");
+var import_class_variance_authority14 = require("class-variance-authority");
+var import_react57 = require("react");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var ALERT_ICON_SIZE = 16;
-var alertVariants = (0, import_class_variance_authority13.cva)("aviala-alert", {
+var alertVariants = (0, import_class_variance_authority14.cva)("aviala-alert", {
   variants: {
     type: {
       info: "aviala-alert--type-info",
@@ -9152,7 +9348,7 @@ var alertVariants = (0, import_class_variance_authority13.cva)("aviala-alert", {
 });
 function renderAlertIcon(node) {
   if (!node) return null;
-  const content = (0, import_react56.isValidElement)(node) && typeof node.type !== "string" ? (0, import_react56.cloneElement)(node, {
+  const content = (0, import_react57.isValidElement)(node) && typeof node.type !== "string" ? (0, import_react57.cloneElement)(node, {
     width: ALERT_ICON_SIZE,
     height: ALERT_ICON_SIZE,
     className: cn(
@@ -9160,23 +9356,23 @@ function renderAlertIcon(node) {
       "shrink-0"
     )
   }) : node;
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "aviala-alert__icon", "aria-hidden": true, children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "aviala-alert__icon", "aria-hidden": true, children: content });
 }
 function defaultStatusIcon2(type) {
   const iconProps = { thickness: "Regular", mode: "fill", "aria-hidden": true };
   switch (type) {
     case "info":
     case "neutral":
-      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.SymbolInformationCircle, { ...iconProps });
+      return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons17.SymbolInformationCircle, { ...iconProps });
     case "warning":
-      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.SymbolWarningCircle, { ...iconProps });
+      return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons17.SymbolWarningCircle, { ...iconProps });
     case "error":
-      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.SymbolWrongCircle, { ...iconProps });
+      return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons17.SymbolWrongCircle, { ...iconProps });
     case "success":
-      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.SymbolRightCircle, { ...iconProps });
+      return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons17.SymbolRightCircle, { ...iconProps });
   }
 }
-var Alert = (0, import_react56.forwardRef)(
+var Alert = (0, import_react57.forwardRef)(
   ({
     className,
     type = "info",
@@ -9204,7 +9400,7 @@ var Alert = (0, import_react56.forwardRef)(
     const resolvedType = type ?? "info";
     const resolvedRole = resolvedType === "error" ? "alert" : "status";
     const hasActions = showActions && (action || secondaryAction);
-    return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
       "div",
       {
         ref,
@@ -9216,9 +9412,9 @@ var Alert = (0, import_react56.forwardRef)(
         "data-appearance": appearance,
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "aviala-alert__body", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "aviala-alert__body", children: [
             showIcon ? renderAlertIcon(icon ?? defaultStatusIcon2(resolvedType)) : null,
-            isSmall ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Typography, { level: "text", className: "aviala-alert__title", children: title }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+            isSmall ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Typography, { level: "text", className: "aviala-alert__title", children: title }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
               Typeface,
               {
                 className: "aviala-alert__typeface",
@@ -9227,7 +9423,7 @@ var Alert = (0, import_react56.forwardRef)(
                 secondary: description
               }
             ),
-            quickAction ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+            quickAction ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
               Link,
               {
                 level: "text",
@@ -9243,7 +9439,7 @@ var Alert = (0, import_react56.forwardRef)(
                 children: quickAction
               }
             ) : null,
-            dismissible ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+            dismissible ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
               Link,
               {
                 level: "text",
@@ -9252,7 +9448,7 @@ var Alert = (0, import_react56.forwardRef)(
                 href: onDismiss ? "#" : void 0,
                 "aria-label": resolvedCloseLabel,
                 className: "aviala-alert__close",
-                leftIcon: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons16.SymbolWrong, { "aria-hidden": true }),
+                leftIcon: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons17.SymbolWrong, { "aria-hidden": true }),
                 onClick: (event) => {
                   if (onDismiss) {
                     event.preventDefault();
@@ -9262,8 +9458,8 @@ var Alert = (0, import_react56.forwardRef)(
               }
             ) : null
           ] }),
-          hasActions ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "aviala-alert__actions", children: [
-            action ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+          hasActions ? /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "aviala-alert__actions", children: [
+            action ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
               Link,
               {
                 level: "caption",
@@ -9279,7 +9475,7 @@ var Alert = (0, import_react56.forwardRef)(
                 children: action
               }
             ) : null,
-            secondaryAction ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+            secondaryAction ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
               Link,
               {
                 level: "caption",
@@ -9304,32 +9500,32 @@ var Alert = (0, import_react56.forwardRef)(
 Alert.displayName = "Alert";
 
 // src/components/list.tsx
-var import_icons17 = require("@aviala-design/icons");
-var import_react57 = require("react");
-var import_jsx_runtime54 = require("react/jsx-runtime");
-var List = (0, import_react57.forwardRef)(
-  ({ className, title, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { ref, className: cn("aviala-list", className), ...props, children: [
-    title != null ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ListTitle, { children: title }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ListGroup, { children })
+var import_icons18 = require("@aviala-design/icons");
+var import_react58 = require("react");
+var import_jsx_runtime55 = require("react/jsx-runtime");
+var List = (0, import_react58.forwardRef)(
+  ({ className, title, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { ref, className: cn("aviala-list", className), ...props, children: [
+    title != null ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ListTitle, { children: title }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ListGroup, { children })
   ] })
 );
 List.displayName = "List";
-var ListTitle = (0, import_react57.forwardRef)(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { ref, className: cn("aviala-list-title", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: cn(typographyVariants({ level: "text" })), children }) })
+var ListTitle = (0, import_react58.forwardRef)(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { ref, className: cn("aviala-list-title", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: cn(typographyVariants({ level: "text" })), children }) })
 );
 ListTitle.displayName = "ListTitle";
-var ListGroup = (0, import_react57.forwardRef)(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { ref, className: cn("aviala-list-group", className), role: "list", ...props, children })
+var ListGroup = (0, import_react58.forwardRef)(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { ref, className: cn("aviala-list-group", className), role: "list", ...props, children })
 );
 ListGroup.displayName = "ListGroup";
 function ListItemGroup({ label, children, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: cn("aviala-list", className), children: [
-    label != null ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ListTitle, { children: label }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ListGroup, { children })
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: cn("aviala-list", className), children: [
+    label != null ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ListTitle, { children: label }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ListGroup, { children })
   ] });
 }
-var ListDivider = (0, import_react57.forwardRef)(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+var ListDivider = (0, import_react58.forwardRef)(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     "span",
     {
       ref,
@@ -9340,15 +9536,15 @@ var ListDivider = (0, import_react57.forwardRef)(
   )
 );
 ListDivider.displayName = "ListDivider";
-var ListSeparator = (0, import_react57.forwardRef)(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("hr", { ref, className: cn("aviala-list-separator", className), ...props })
+var ListSeparator = (0, import_react58.forwardRef)(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("hr", { ref, className: cn("aviala-list-separator", className), ...props })
 );
 ListSeparator.displayName = "ListSeparator";
 function renderLeadingIcon(node, leading) {
   if (leading === "none") return null;
   const iconSize = leading === "shaped" ? 20 : 22;
-  const content = node ?? (leading === "shaped" ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons17.GeneralSetting, { "aria-hidden": true }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons17.GeneralSetting, { "aria-hidden": true }));
-  const rendered = (0, import_react57.isValidElement)(content) && typeof content.type !== "string" ? (0, import_react57.cloneElement)(content, {
+  const content = node ?? (leading === "shaped" ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_icons18.GeneralSetting, { "aria-hidden": true }) : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_icons18.GeneralSetting, { "aria-hidden": true }));
+  const rendered = (0, import_react58.isValidElement)(content) && typeof content.type !== "string" ? (0, import_react58.cloneElement)(content, {
     width: iconSize,
     height: iconSize,
     className: cn(
@@ -9356,7 +9552,7 @@ function renderLeadingIcon(node, leading) {
       "shrink-0"
     )
   }) : content;
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "aviala-list-item__icon", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "aviala-list-item__icon", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     "span",
     {
       className: cn(
@@ -9366,7 +9562,7 @@ function renderLeadingIcon(node, leading) {
     }
   ) });
 }
-var ListItem = (0, import_react57.forwardRef)(
+var ListItem = (0, import_react58.forwardRef)(
   ({
     className,
     itemType = "select",
@@ -9394,48 +9590,48 @@ var ListItem = (0, import_react57.forwardRef)(
   }, ref) => {
     const locale = useLocaleMessages("List");
     const rtl = useRtl();
-    const ChevronIcon = rtl ? import_icons17.DirectionArrowLeftLight : import_icons17.DirectionArrowRightLight;
+    const ChevronIcon = rtl ? import_icons18.DirectionArrowLeftLight : import_icons18.DirectionArrowRightLight;
     const isInteractive = interactive ?? (onClick != null || href != null);
     const chevronVisible = showChevron ?? itemType === "action";
-    const primaryAction = action ?? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Button, { mode: "primary", size: "regular", leftIcon: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons17.GeneralSetting, { "aria-hidden": true }), children: actionLabel });
-    const chevron = chevronVisible ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "aviala-list-item__chevron", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ChevronIcon, { width: 18, height: 18 }) }) : null;
+    const primaryAction = action ?? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Button, { mode: "primary", size: "regular", leftIcon: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_icons18.GeneralSetting, { "aria-hidden": true }), children: actionLabel });
+    const chevron = chevronVisible ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "aviala-list-item__chevron", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ChevronIcon, { width: 18, height: 18 }) }) : null;
     const renderTrailing = () => {
       const hideActions = !showTrailing || trailing === null;
       if (hideActions) {
-        return chevron && itemType === "action" ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "aviala-list-item__more", children: chevron }) : null;
+        return chevron && itemType === "action" ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "aviala-list-item__more", children: chevron }) : null;
       }
       if (trailing !== void 0) return trailing;
       switch (itemType) {
         case "action":
-          return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "aviala-list-item__more", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "aviala-list-item__trailing", children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "aviala-list-item__more", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "aviala-list-item__trailing", children: [
               primaryAction,
-              secondaryAction ?? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+              secondaryAction ?? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
                 Button,
                 {
                   mode: "default",
                   size: "regular",
                   iconOnly: true,
                   "aria-label": locale.more,
-                  leftIcon: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons17.GeneralSetting, { "aria-hidden": true })
+                  leftIcon: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_icons18.GeneralSetting, { "aria-hidden": true })
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ListDivider, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ListDivider, {}),
             chevron
           ] });
         case "switch":
-          return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "aviala-list-item__trailing", children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "aviala-list-item__trailing", children: [
             primaryAction,
-            /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ListDivider, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Switch, { ...switchProps })
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ListDivider, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Switch, { ...switchProps })
           ] });
         case "select":
         default:
-          return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "aviala-list-item__trailing", children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "aviala-list-item__trailing", children: [
             primaryAction,
-            /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ListDivider, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "aviala-list-item__select", children: select })
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ListDivider, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "aviala-list-item__select", children: select })
           ] });
       }
     };
@@ -9449,15 +9645,15 @@ var ListItem = (0, import_react57.forwardRef)(
       "data-top-divider": showTopDivider === void 0 ? void 0 : showTopDivider ? "true" : "false"
     };
     const trailingNode = renderTrailing();
-    const body = /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
+    const body = /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
       renderLeadingIcon(icon, leading),
-      /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "aviala-list-item__body", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "aviala-list-item__content", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "aviala-list-item__head", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Typeface, { content: "textCaption", primary: title, secondary: subtitle }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "aviala-list-item__body", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "aviala-list-item__content", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "aviala-list-item__head", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Typeface, { content: "textCaption", primary: title, secondary: subtitle }) }),
         trailingNode
       ] }) })
     ] });
     if (href && !disabled) {
-      return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
         "a",
         {
           ref,
@@ -9473,7 +9669,7 @@ var ListItem = (0, import_react57.forwardRef)(
         }
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
       "div",
       {
         ref,
@@ -9492,14 +9688,14 @@ ListItem.displayName = "ListItem";
 // src/components/navigation.tsx
 var PopoverPrimitive7 = __toESM(require("@radix-ui/react-popover"), 1);
 var import_react_slot5 = require("@radix-ui/react-slot");
-var import_react58 = require("react");
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_react59 = require("react");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 function navigationItemButtonMode(active) {
   return active ? "second" : "noBackgroundCustom";
 }
-var NavigationDirectionContext = (0, import_react58.createContext)("vertical");
+var NavigationDirectionContext = (0, import_react59.createContext)("vertical");
 function useNavigationDirection() {
-  return (0, import_react58.useContext)(NavigationDirectionContext);
+  return (0, import_react59.useContext)(NavigationDirectionContext);
 }
 var NAVIGATION_ANIMATION_MS_FALLBACK = 300;
 var NAVIGATION_ANIMATION_EASING_FALLBACK = "cubic-bezier(0.16, 1, 0.3, 1)";
@@ -9661,21 +9857,21 @@ function runIndicatorAnimation(el, group, start, next, durationMs, easing, gener
   };
 }
 function useNavigationIndicator(groupRef, direction, layoutKey) {
-  const indicatorRef = (0, import_react58.useRef)(null);
-  const metricsRef = (0, import_react58.useRef)(null);
-  const animationRef = (0, import_react58.useRef)(null);
-  const animationGenerationRef = (0, import_react58.useRef)(0);
-  const isAnimatingRef = (0, import_react58.useRef)(false);
-  const layoutTrackingFrameRef = (0, import_react58.useRef)(null);
-  const isLayoutTrackingRef = (0, import_react58.useRef)(false);
-  const isInitialMount = (0, import_react58.useRef)(true);
-  const [activeRevision, setActiveRevision] = (0, import_react58.useState)(0);
-  const measureIndicator = (0, import_react58.useCallback)(() => {
+  const indicatorRef = (0, import_react59.useRef)(null);
+  const metricsRef = (0, import_react59.useRef)(null);
+  const animationRef = (0, import_react59.useRef)(null);
+  const animationGenerationRef = (0, import_react59.useRef)(0);
+  const isAnimatingRef = (0, import_react59.useRef)(false);
+  const layoutTrackingFrameRef = (0, import_react59.useRef)(null);
+  const isLayoutTrackingRef = (0, import_react59.useRef)(false);
+  const isInitialMount = (0, import_react59.useRef)(true);
+  const [activeRevision, setActiveRevision] = (0, import_react59.useState)(0);
+  const measureIndicator = (0, import_react59.useCallback)(() => {
     const group = groupRef.current;
     if (!group) return null;
     return measureNavigationIndicator(group, direction);
   }, [direction, groupRef]);
-  const syncIndicator = (0, import_react58.useCallback)(
+  const syncIndicator = (0, import_react59.useCallback)(
     (metrics, instant = false) => {
       metricsRef.current = metrics;
       const el = indicatorRef.current;
@@ -9683,14 +9879,14 @@ function useNavigationIndicator(groupRef, direction, layoutKey) {
     },
     []
   );
-  const cancelLayoutTracking = (0, import_react58.useCallback)(() => {
+  const cancelLayoutTracking = (0, import_react59.useCallback)(() => {
     if (layoutTrackingFrameRef.current != null) {
       cancelAnimationFrame(layoutTrackingFrameRef.current);
       layoutTrackingFrameRef.current = null;
     }
     isLayoutTrackingRef.current = false;
   }, []);
-  const remeasureIndicator = (0, import_react58.useCallback)(() => {
+  const remeasureIndicator = (0, import_react59.useCallback)(() => {
     if (isLayoutTrackingRef.current) return;
     const metrics = measureIndicator();
     if (!metrics) return;
@@ -9699,7 +9895,7 @@ function useNavigationIndicator(groupRef, direction, layoutKey) {
     isAnimatingRef.current = false;
     syncIndicator(metrics, true);
   }, [measureIndicator, syncIndicator]);
-  const startExpandCollapseTracking = (0, import_react58.useCallback)(() => {
+  const startExpandCollapseTracking = (0, import_react59.useCallback)(() => {
     const group = groupRef.current;
     const el = indicatorRef.current;
     if (!group || !el) return;
@@ -9756,14 +9952,14 @@ function useNavigationIndicator(groupRef, direction, layoutKey) {
     };
     layoutTrackingFrameRef.current = requestAnimationFrame(tick);
   }, [cancelLayoutTracking, groupRef, measureIndicator, syncIndicator]);
-  const onIndicatorRef = (0, import_react58.useCallback)((node) => {
+  const onIndicatorRef = (0, import_react59.useCallback)((node) => {
     indicatorRef.current = node;
     if (node && metricsRef.current && isInitialMount.current) {
       applyIndicatorMetrics(node, metricsRef.current, true);
       isInitialMount.current = false;
     }
   }, []);
-  (0, import_react58.useLayoutEffect)(() => {
+  (0, import_react59.useLayoutEffect)(() => {
     const group = groupRef.current;
     const next = measureIndicator();
     if (!next) return;
@@ -9811,7 +10007,7 @@ function useNavigationIndicator(groupRef, direction, layoutKey) {
     syncIndicator,
     groupRef
   ]);
-  (0, import_react58.useLayoutEffect)(() => {
+  (0, import_react59.useLayoutEffect)(() => {
     const group = groupRef.current;
     if (!group) return;
     const observer = new MutationObserver((mutations) => {
@@ -9868,7 +10064,7 @@ function useNavigationIndicator(groupRef, direction, layoutKey) {
     startExpandCollapseTracking,
     syncIndicator
   ]);
-  (0, import_react58.useEffect)(() => {
+  (0, import_react59.useEffect)(() => {
     if (direction !== "vertical") return;
     const group = groupRef.current;
     if (!group) return;
@@ -9896,7 +10092,7 @@ function useNavigationIndicator(groupRef, direction, layoutKey) {
   }, [direction, groupRef, measureIndicator, syncIndicator]);
   return onIndicatorRef;
 }
-var Navigation = (0, import_react58.forwardRef)(
+var Navigation = (0, import_react59.forwardRef)(
   ({
     className,
     as: Tag2 = "nav",
@@ -9904,7 +10100,7 @@ var Navigation = (0, import_react58.forwardRef)(
     direction = "vertical",
     dividingLine = false,
     ...props
-  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(NavigationDirectionContext.Provider, { value: direction, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(NavigationDirectionContext.Provider, { value: direction, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     Tag2,
     {
       ref,
@@ -9917,8 +10113,8 @@ var Navigation = (0, import_react58.forwardRef)(
   ) })
 );
 Navigation.displayName = "Navigation";
-var NavigationBrand = (0, import_react58.forwardRef)(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+var NavigationBrand = (0, import_react59.forwardRef)(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     "div",
     {
       ref,
@@ -9928,40 +10124,40 @@ var NavigationBrand = (0, import_react58.forwardRef)(
   )
 );
 NavigationBrand.displayName = "NavigationBrand";
-var NavigationBrandTitle = (0, import_react58.forwardRef)(({ className, asChild = false, children, ...props }, ref) => {
+var NavigationBrandTitle = (0, import_react59.forwardRef)(({ className, asChild = false, children, ...props }, ref) => {
   const Comp = asChild ? import_react_slot5.Slot : "a";
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     Comp,
     {
       ref,
       className: cn("aviala-navigation-brand__title aviala-focus-ring", className),
       ...props,
-      children: asChild ? children : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Typography, { level: "text", as: "span", children })
+      children: asChild ? children : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Typography, { level: "text", as: "span", children })
     }
   );
 });
 NavigationBrandTitle.displayName = "NavigationBrandTitle";
-var NavigationSection = (0, import_react58.forwardRef)(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+var NavigationSection = (0, import_react59.forwardRef)(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
   "div",
   {
     ref,
     className: cn("aviala-navigation-section", className),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Typography, { level: "caption", as: "p", children })
+    children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Typography, { level: "caption", as: "p", children })
   }
 ));
 NavigationSection.displayName = "NavigationSection";
-var NavigationGroup = (0, import_react58.forwardRef)(
+var NavigationGroup = (0, import_react59.forwardRef)(
   ({ className, children, ...props }, ref) => {
     const direction = useNavigationDirection();
     const layoutKey = useThemeLayoutKey();
-    const groupRef = (0, import_react58.useRef)(null);
+    const groupRef = (0, import_react59.useRef)(null);
     const onIndicatorRef = useNavigationIndicator(
       groupRef,
       direction,
       layoutKey
     );
-    const setRefs = (0, import_react58.useCallback)(
+    const setRefs = (0, import_react59.useCallback)(
       (node) => {
         groupRef.current = node;
         if (typeof ref === "function") {
@@ -9972,14 +10168,14 @@ var NavigationGroup = (0, import_react58.forwardRef)(
       },
       [ref]
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
       "div",
       {
         ref: setRefs,
         className: cn("aviala-navigation-group", className),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
             "span",
             {
               ref: onIndicatorRef,
@@ -9995,17 +10191,17 @@ var NavigationGroup = (0, import_react58.forwardRef)(
   }
 );
 NavigationGroup.displayName = "NavigationGroup";
-var NavigationItemGroup = (0, import_react58.forwardRef)(({ className, expanded, children, ...props }, ref) => {
+var NavigationItemGroup = (0, import_react59.forwardRef)(({ className, expanded, children, ...props }, ref) => {
   const isCollapsible = expanded !== void 0;
   const isCollapsed = isCollapsible && !expanded;
-  const innerRef = (0, import_react58.useRef)(null);
-  (0, import_react58.useLayoutEffect)(() => {
+  const innerRef = (0, import_react59.useRef)(null);
+  (0, import_react59.useLayoutEffect)(() => {
     const inner = innerRef.current;
     if (!inner) return;
     if (isCollapsed) inner.setAttribute("inert", "");
     else inner.removeAttribute("inert");
   }, [isCollapsed]);
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     "div",
     {
       ref,
@@ -10013,7 +10209,7 @@ var NavigationItemGroup = (0, import_react58.forwardRef)(({ className, expanded,
       "data-expanded": isCollapsible ? expanded ? "true" : "false" : void 0,
       "aria-hidden": isCollapsed ? true : void 0,
       ...props,
-      children: isCollapsible ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { ref: innerRef, className: "aviala-navigation-item-group__inner", children }) : children
+      children: isCollapsible ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { ref: innerRef, className: "aviala-navigation-item-group__inner", children }) : children
     }
   );
 });
@@ -10024,9 +10220,9 @@ function renderItemIcon3(node) {
     level: "text",
     biggerSize: true
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "aviala-navigation-item__icon", children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "aviala-navigation-item__icon", children: content });
 }
-var NavigationItem = (0, import_react58.forwardRef)(
+var NavigationItem = (0, import_react59.forwardRef)(
   ({
     className,
     active,
@@ -10041,9 +10237,9 @@ var NavigationItem = (0, import_react58.forwardRef)(
     const Comp = asChild ? import_react_slot5.Slot : "a";
     const isActive = active ?? ariaCurrent === "page";
     const mode = navigationItemButtonMode(isActive);
-    const controlContent = /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
+    const controlContent = /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
       renderItemIcon3(leftIcon),
-      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
         Typography,
         {
           level: "text",
@@ -10052,15 +10248,15 @@ var NavigationItem = (0, import_react58.forwardRef)(
           children
         }
       ),
-      rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "aviala-navigation-item__chevron", children: renderItemIcon3(rightIcon) }) : null
+      rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "aviala-navigation-item__chevron", children: renderItemIcon3(rightIcon) }) : null
     ] });
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       "span",
       {
         className: cn("aviala-navigation-item", className),
         "data-item-type": itemType,
         "data-active": isActive ? "true" : "false",
-        children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
           Comp,
           {
             ref,
@@ -10079,7 +10275,7 @@ var NavigationItem = (0, import_react58.forwardRef)(
   }
 );
 NavigationItem.displayName = "NavigationItem";
-var NavigationActions = (0, import_react58.forwardRef)(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+var NavigationActions = (0, import_react59.forwardRef)(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
   "div",
   {
     ref,
@@ -10089,7 +10285,7 @@ var NavigationActions = (0, import_react58.forwardRef)(({ className, children, .
   }
 ));
 NavigationActions.displayName = "NavigationActions";
-var NavigationActionsSlot = (0, import_react58.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+var NavigationActionsSlot = (0, import_react59.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
   "div",
   {
     ref,
@@ -10099,9 +10295,9 @@ var NavigationActionsSlot = (0, import_react58.forwardRef)(({ className, ...prop
 ));
 NavigationActionsSlot.displayName = "NavigationActionsSlot";
 var NAVIGATION_MENU_CLOSE_DELAY_MS = 150;
-var NavigationItemMenuContext = (0, import_react58.createContext)(null);
+var NavigationItemMenuContext = (0, import_react59.createContext)(null);
 function useNavigationItemMenuContext(component) {
-  const context = (0, import_react58.useContext)(NavigationItemMenuContext);
+  const context = (0, import_react59.useContext)(NavigationItemMenuContext);
   if (!context) {
     throw new Error(`${component} must be used within <NavigationItemMenu>`);
   }
@@ -10115,28 +10311,28 @@ function NavigationItemMenu({
   onOpenChange,
   children
 }) {
-  const [internalValue, setInternalValue] = (0, import_react58.useState)(defaultValue);
+  const [internalValue, setInternalValue] = (0, import_react59.useState)(defaultValue);
   const isValueControlled = valueProp !== void 0;
   const value = isValueControlled ? valueProp : internalValue;
-  const [internalOpen, setInternalOpen] = (0, import_react58.useState)(false);
+  const [internalOpen, setInternalOpen] = (0, import_react59.useState)(false);
   const isOpenControlled = openProp !== void 0;
   const open = isOpenControlled ? openProp : internalOpen;
-  const closeTimerRef = (0, import_react58.useRef)(null);
-  const openedByHoverRef = (0, import_react58.useRef)(false);
-  const setOpen = (0, import_react58.useCallback)(
+  const closeTimerRef = (0, import_react59.useRef)(null);
+  const openedByHoverRef = (0, import_react59.useRef)(false);
+  const setOpen = (0, import_react59.useCallback)(
     (nextOpen) => {
       if (!isOpenControlled) setInternalOpen(nextOpen);
       onOpenChange?.(nextOpen);
     },
     [isOpenControlled, onOpenChange]
   );
-  const cancelClose = (0, import_react58.useCallback)(() => {
+  const cancelClose = (0, import_react59.useCallback)(() => {
     if (closeTimerRef.current != null) {
       window.clearTimeout(closeTimerRef.current);
       closeTimerRef.current = null;
     }
   }, []);
-  const openMenu = (0, import_react58.useCallback)(
+  const openMenu = (0, import_react59.useCallback)(
     (viaHover) => {
       cancelClose();
       openedByHoverRef.current = viaHover;
@@ -10144,14 +10340,14 @@ function NavigationItemMenu({
     },
     [cancelClose, setOpen]
   );
-  const scheduleClose = (0, import_react58.useCallback)(() => {
+  const scheduleClose = (0, import_react59.useCallback)(() => {
     cancelClose();
     closeTimerRef.current = window.setTimeout(() => {
       closeTimerRef.current = null;
       setOpen(false);
     }, NAVIGATION_MENU_CLOSE_DELAY_MS);
   }, [cancelClose, setOpen]);
-  const select = (0, import_react58.useCallback)(
+  const select = (0, import_react59.useCallback)(
     (nextValue) => {
       if (!isValueControlled) setInternalValue(nextValue);
       onValueChange?.(nextValue);
@@ -10160,8 +10356,8 @@ function NavigationItemMenu({
     },
     [cancelClose, isValueControlled, onValueChange, setOpen]
   );
-  (0, import_react58.useEffect)(() => cancelClose, [cancelClose]);
-  const contextValue = (0, import_react58.useMemo)(
+  (0, import_react59.useEffect)(() => cancelClose, [cancelClose]);
+  const contextValue = (0, import_react59.useMemo)(
     () => ({
       value,
       hasSelection: value != null && value !== "",
@@ -10173,7 +10369,7 @@ function NavigationItemMenu({
     }),
     [cancelClose, openMenu, scheduleClose, select, value]
   );
-  const handleOpenChange = (0, import_react58.useCallback)(
+  const handleOpenChange = (0, import_react59.useCallback)(
     (nextOpen) => {
       if (nextOpen) openedByHoverRef.current = false;
       cancelClose();
@@ -10181,9 +10377,9 @@ function NavigationItemMenu({
     },
     [cancelClose, setOpen]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(NavigationItemMenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Popover, { open, onOpenChange: handleOpenChange, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(NavigationItemMenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Popover, { open, onOpenChange: handleOpenChange, children }) });
 }
-var NavigationItemMenuTrigger = (0, import_react58.forwardRef)(
+var NavigationItemMenuTrigger = (0, import_react59.forwardRef)(
   ({
     className,
     active,
@@ -10195,7 +10391,7 @@ var NavigationItemMenuTrigger = (0, import_react58.forwardRef)(
     const menu = useNavigationItemMenuContext("NavigationItemMenuTrigger");
     const isActive = active ?? menu.hasSelection;
     const mode = navigationItemButtonMode(isActive);
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       "span",
       {
         className: cn("aviala-navigation-item", className),
@@ -10203,7 +10399,7 @@ var NavigationItemMenuTrigger = (0, import_react58.forwardRef)(
         "data-active": isActive ? "true" : "false",
         onMouseEnter: () => menu.openMenu(true),
         onMouseLeave: menu.scheduleClose,
-        children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(PopoverPrimitive7.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PopoverPrimitive7.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
           "button",
           {
             ref,
@@ -10216,7 +10412,7 @@ var NavigationItemMenuTrigger = (0, import_react58.forwardRef)(
             ...props,
             children: [
               renderItemIcon3(leftIcon),
-              /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
                 Typography,
                 {
                   level: "text",
@@ -10225,7 +10421,7 @@ var NavigationItemMenuTrigger = (0, import_react58.forwardRef)(
                   children
                 }
               ),
-              rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "aviala-navigation-item__chevron", children: renderItemIcon3(rightIcon) }) : null
+              rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "aviala-navigation-item__chevron", children: renderItemIcon3(rightIcon) }) : null
             ]
           }
         ) })
@@ -10234,7 +10430,7 @@ var NavigationItemMenuTrigger = (0, import_react58.forwardRef)(
   }
 );
 NavigationItemMenuTrigger.displayName = "NavigationItemMenuTrigger";
-var NavigationItemMenuContent = (0, import_react58.forwardRef)(
+var NavigationItemMenuContent = (0, import_react59.forwardRef)(
   ({
     className,
     side,
@@ -10248,7 +10444,7 @@ var NavigationItemMenuContent = (0, import_react58.forwardRef)(
     const direction = useNavigationDirection();
     const writingDirection = useDirection();
     const menu = useNavigationItemMenuContext("NavigationItemMenuContent");
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(PopoverPrimitive7.Portal, { container: overlayContainer, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PopoverPrimitive7.Portal, { container: overlayContainer, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       PopoverPrimitive7.Content,
       {
         ref,
@@ -10269,7 +10465,7 @@ var NavigationItemMenuContent = (0, import_react58.forwardRef)(
   }
 );
 NavigationItemMenuContent.displayName = "NavigationItemMenuContent";
-var NavigationItemMenuItem = (0, import_react58.forwardRef)(
+var NavigationItemMenuItem = (0, import_react59.forwardRef)(
   ({
     className,
     value,
@@ -10283,7 +10479,7 @@ var NavigationItemMenuItem = (0, import_react58.forwardRef)(
   }, ref) => {
     const menu = useNavigationItemMenuContext("NavigationItemMenuItem");
     const isSelected = selected ?? menu.value === value;
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
       "button",
       {
         ref,
@@ -10303,7 +10499,7 @@ var NavigationItemMenuItem = (0, import_react58.forwardRef)(
         ...props,
         children: [
           renderItemIcon3(leftIcon),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
             Typography,
             {
               level: "text",
@@ -10312,7 +10508,7 @@ var NavigationItemMenuItem = (0, import_react58.forwardRef)(
               children
             }
           ),
-          rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "aviala-navigation-menu-item__trailing", children: renderItemIcon3(rightIcon) }) : null
+          rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "aviala-navigation-menu-item__trailing", children: renderItemIcon3(rightIcon) }) : null
         ]
       }
     );
@@ -10321,11 +10517,11 @@ var NavigationItemMenuItem = (0, import_react58.forwardRef)(
 NavigationItemMenuItem.displayName = "NavigationItemMenuItem";
 
 // src/components/tab.tsx
-var import_react59 = require("react");
-var import_jsx_runtime56 = require("react/jsx-runtime");
-var TabContext = (0, import_react59.createContext)(null);
+var import_react60 = require("react");
+var import_jsx_runtime57 = require("react/jsx-runtime");
+var TabContext = (0, import_react60.createContext)(null);
 function useTabContext() {
-  const ctx = (0, import_react59.useContext)(TabContext);
+  const ctx = (0, import_react60.useContext)(TabContext);
   if (!ctx) {
     throw new Error("TabItem must be used within Tab");
   }
@@ -10337,10 +10533,10 @@ function tabItemButtonMode(style, active) {
   return active ? "noBackground" : "noBackgroundCustom";
 }
 function useTabState(value, defaultValue, onValueChange) {
-  const [internal, setInternal] = (0, import_react59.useState)(defaultValue ?? "");
+  const [internal, setInternal] = (0, import_react60.useState)(defaultValue ?? "");
   const isControlled = value !== void 0;
   const current = isControlled ? value : internal;
-  const setValue = (0, import_react59.useCallback)(
+  const setValue = (0, import_react60.useCallback)(
     (next) => {
       if (!isControlled) setInternal(next);
       onValueChange?.(next);
@@ -10383,9 +10579,9 @@ function measureTabIndicator(list) {
   };
 }
 function useTabIndicator(listRef, enabled, layoutKey, value) {
-  const indicatorRef = (0, import_react59.useRef)(null);
-  const isInitial = (0, import_react59.useRef)(true);
-  const sync = (0, import_react59.useCallback)(
+  const indicatorRef = (0, import_react60.useRef)(null);
+  const isInitial = (0, import_react60.useRef)(true);
+  const sync = (0, import_react60.useCallback)(
     (instant) => {
       const list = listRef.current;
       const el = indicatorRef.current;
@@ -10398,7 +10594,7 @@ function useTabIndicator(listRef, enabled, layoutKey, value) {
     },
     [enabled, listRef]
   );
-  (0, import_react59.useLayoutEffect)(() => {
+  (0, import_react60.useLayoutEffect)(() => {
     if (!enabled) {
       if (indicatorRef.current) indicatorRef.current.dataset.visible = "false";
       return;
@@ -10406,7 +10602,7 @@ function useTabIndicator(listRef, enabled, layoutKey, value) {
     sync(isInitial.current);
     isInitial.current = false;
   }, [enabled, layoutKey, sync, value]);
-  (0, import_react59.useEffect)(() => {
+  (0, import_react60.useEffect)(() => {
     if (!enabled) return;
     const list = listRef.current;
     if (!list) return;
@@ -10429,11 +10625,11 @@ function renderTabIcon(node) {
     level: "text",
     biggerSize: true
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "aviala-tab-item__icon", children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "aviala-tab-item__icon", children: content });
 }
 function TabCardEar({ side }) {
   const d = side === "start" ? "M8 8L0 8C4 8 8 5.5 8 0L8 8Z" : "M0 8L8 8C4 8 0 5.5 0 0L0 8Z";
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "aviala-tab-item__ear", "data-side": side, "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "aviala-tab-item__ear", "data-side": side, "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -10441,11 +10637,11 @@ function TabCardEar({ side }) {
       height: "8",
       viewBox: "0 0 8 8",
       fill: "none",
-      children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("path", { d, fill: "currentColor" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("path", { d, fill: "currentColor" })
     }
   ) });
 }
-var Tab = (0, import_react59.forwardRef)(
+var Tab = (0, import_react60.forwardRef)(
   ({
     className,
     style: tabStyle = "default",
@@ -10463,18 +10659,18 @@ var Tab = (0, import_react59.forwardRef)(
     const [value, setValue] = useTabState(valueProp, defaultValue, onValueChange);
     const layoutKey = useThemeLayoutKey();
     const direction = useDirection();
-    const listRef = (0, import_react59.useRef)(null);
-    const itemsRef = (0, import_react59.useRef)(/* @__PURE__ */ new Map());
+    const listRef = (0, import_react60.useRef)(null);
+    const itemsRef = (0, import_react60.useRef)(/* @__PURE__ */ new Map());
     const showIndicator = tabStyle === "default";
     const indicatorRef = useTabIndicator(listRef, showIndicator, layoutKey, value);
-    const registerItem = (0, import_react59.useCallback)(
+    const registerItem = (0, import_react60.useCallback)(
       (itemValue, el) => {
         if (el) itemsRef.current.set(itemValue, el);
         else itemsRef.current.delete(itemValue);
       },
       []
     );
-    const ctx = (0, import_react59.useMemo)(
+    const ctx = (0, import_react60.useMemo)(
       () => ({
         value,
         onValueChange: setValue,
@@ -10484,7 +10680,7 @@ var Tab = (0, import_react59.forwardRef)(
       }),
       [value, setValue, tabStyle, disabled, registerItem]
     );
-    const focusAdjacent = (0, import_react59.useCallback)(
+    const focusAdjacent = (0, import_react60.useCallback)(
       (current, delta) => {
         const entries = Array.from(itemsRef.current.entries()).filter(
           ([, el2]) => !el2.disabled
@@ -10531,7 +10727,7 @@ var Tab = (0, import_react59.forwardRef)(
         }
       }
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TabContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(TabContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
       "div",
       {
         ref,
@@ -10541,8 +10737,8 @@ var Tab = (0, import_react59.forwardRef)(
         ...spiralDebugId("tab"),
         ...props,
         children: [
-          startSlot != null && startSlot !== false ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "aviala-tab__slot", "data-slot": "start", children: startSlot }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+          startSlot != null && startSlot !== false ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "aviala-tab__slot", "data-slot": "start", children: startSlot }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
             "div",
             {
               ref: listRef,
@@ -10552,7 +10748,7 @@ var Tab = (0, import_react59.forwardRef)(
               onKeyDown: handleListKeyDown,
               ...spiralDebugId("tab.list"),
               children: [
-                showIndicator ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+                showIndicator ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
                   "span",
                   {
                     ref: indicatorRef,
@@ -10565,14 +10761,14 @@ var Tab = (0, import_react59.forwardRef)(
               ]
             }
           ),
-          endSlot != null && endSlot !== false ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "aviala-tab__slot", "data-slot": "end", children: endSlot }) : null
+          endSlot != null && endSlot !== false ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "aviala-tab__slot", "data-slot": "end", children: endSlot }) : null
         ]
       }
     ) });
   }
 );
 Tab.displayName = "Tab";
-var TabItem = (0, import_react59.forwardRef)(
+var TabItem = (0, import_react60.forwardRef)(
   ({
     className,
     value,
@@ -10586,7 +10782,7 @@ var TabItem = (0, import_react59.forwardRef)(
     const active = ctx.value === value;
     const disabled = Boolean(ctx.disabled || disabledProp);
     const mode = tabItemButtonMode(ctx.style, active);
-    const setRefs = (0, import_react59.useCallback)(
+    const setRefs = (0, import_react60.useCallback)(
       (node) => {
         ctx.registerItem(value, node);
         if (typeof ref === "function") ref(node);
@@ -10595,7 +10791,7 @@ var TabItem = (0, import_react59.forwardRef)(
       [ctx, ref, value]
     );
     const showCardEars = ctx.style === "card" && active;
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
       "span",
       {
         className: cn("aviala-tab-item", className),
@@ -10604,8 +10800,8 @@ var TabItem = (0, import_react59.forwardRef)(
         "data-disabled": disabled ? "true" : void 0,
         ...spiralDebugId("tab.item"),
         children: [
-          showCardEars ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TabCardEar, { side: "start" }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+          showCardEars ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(TabCardEar, { side: "start" }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
             "button",
             {
               ref: setRefs,
@@ -10628,7 +10824,7 @@ var TabItem = (0, import_react59.forwardRef)(
               ...props,
               children: [
                 renderTabIcon(leftIcon),
-                children != null && children !== false ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+                children != null && children !== false ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
                   Typography,
                   {
                     level: "text",
@@ -10640,7 +10836,7 @@ var TabItem = (0, import_react59.forwardRef)(
               ]
             }
           ),
-          showCardEars ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TabCardEar, { side: "end" }) : null
+          showCardEars ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(TabCardEar, { side: "end" }) : null
         ]
       }
     );
@@ -10649,11 +10845,11 @@ var TabItem = (0, import_react59.forwardRef)(
 TabItem.displayName = "TabItem";
 
 // src/components/upload.tsx
-var import_icons18 = require("@aviala-design/icons");
-var import_class_variance_authority14 = require("class-variance-authority");
-var import_react60 = require("react");
-var import_jsx_runtime57 = require("react/jsx-runtime");
-var uploadVariants = (0, import_class_variance_authority14.cva)("aviala-upload aviala-focus-ring", {
+var import_icons19 = require("@aviala-design/icons");
+var import_class_variance_authority15 = require("class-variance-authority");
+var import_react61 = require("react");
+var import_jsx_runtime58 = require("react/jsx-runtime");
+var uploadVariants = (0, import_class_variance_authority15.cva)("aviala-upload aviala-focus-ring", {
   variants: {
     style: {
       default: "aviala-upload--style-default",
@@ -10664,7 +10860,7 @@ var uploadVariants = (0, import_class_variance_authority14.cva)("aviala-upload a
     style: "default"
   }
 });
-var Upload = (0, import_react60.forwardRef)(
+var Upload = (0, import_react61.forwardRef)(
   ({
     className,
     style = "default",
@@ -10686,8 +10882,8 @@ var Upload = (0, import_react60.forwardRef)(
     const resolvedTitle = title ?? locale.title;
     const resolvedDescription = description ?? locale.description;
     const resolvedLabel = label ?? locale.label;
-    const inputRef = (0, import_react60.useRef)(null);
-    const [dragging, setDragging] = (0, import_react60.useState)(false);
+    const inputRef = (0, import_react61.useRef)(null);
+    const [dragging, setDragging] = (0, import_react61.useState)(false);
     const resolvedStyle = style ?? "default";
     const allowDrag = dragAndDrop ?? resolvedStyle === "large";
     const openPicker = () => {
@@ -10706,7 +10902,7 @@ var Upload = (0, import_react60.forwardRef)(
         onChange?.(event.dataTransfer.files);
       }
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
       "div",
       {
         ref,
@@ -10737,7 +10933,7 @@ var Upload = (0, import_react60.forwardRef)(
         onDrop: handleDrop,
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
             "input",
             {
               ref: inputRef,
@@ -10752,8 +10948,8 @@ var Upload = (0, import_react60.forwardRef)(
               ...inputProps
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "aviala-upload__icon", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_icons18.GeneralUpload, { width: 16, height: 16 }) }),
-          resolvedStyle === "large" ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { className: "aviala-upload__icon", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_icons19.GeneralUpload, { width: 16, height: 16 }) }),
+          resolvedStyle === "large" ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
             Typeface,
             {
               className: "aviala-upload__typeface",
@@ -10761,7 +10957,7 @@ var Upload = (0, import_react60.forwardRef)(
               primary: resolvedTitle,
               secondary: resolvedDescription
             }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Typography, { level: "text", as: "span", className: "aviala-upload__label", children: resolvedLabel })
+          ) : /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Typography, { level: "text", as: "span", className: "aviala-upload__label", children: resolvedLabel })
         ]
       }
     );
@@ -10770,14 +10966,14 @@ var Upload = (0, import_react60.forwardRef)(
 Upload.displayName = "Upload";
 
 // src/components/video/video.tsx
-var import_react66 = require("react");
+var import_react67 = require("react");
 
 // src/components/video/video-controls.tsx
-var import_icons20 = require("@aviala-design/icons");
-var import_react64 = require("react");
+var import_icons21 = require("@aviala-design/icons");
+var import_react65 = require("react");
 
 // src/components/video/use-video-state.ts
-var import_react61 = require("react");
+var import_react62 = require("react");
 function videoObjectFitToCss(fit) {
   switch (fit) {
     case "stretch":
@@ -10841,26 +11037,26 @@ function useVideoState({
   onPrevious,
   onNext
 }) {
-  const [playing, setPlaying] = (0, import_react61.useState)(false);
-  const [currentTime, setCurrentTime] = (0, import_react61.useState)(0);
-  const [duration, setDuration] = (0, import_react61.useState)(0);
-  const [seeking, setSeeking] = (0, import_react61.useState)(false);
-  const [fullscreen, setFullscreen] = (0, import_react61.useState)(false);
-  const [internalMuted, setInternalMuted] = (0, import_react61.useState)(defaultMuted);
+  const [playing, setPlaying] = (0, import_react62.useState)(false);
+  const [currentTime, setCurrentTime] = (0, import_react62.useState)(0);
+  const [duration, setDuration] = (0, import_react62.useState)(0);
+  const [seeking, setSeeking] = (0, import_react62.useState)(false);
+  const [fullscreen, setFullscreen] = (0, import_react62.useState)(false);
+  const [internalMuted, setInternalMuted] = (0, import_react62.useState)(defaultMuted);
   const muted = mutedProp ?? internalMuted;
-  const [internalRate, setInternalRate] = (0, import_react61.useState)(defaultPlaybackRate);
+  const [internalRate, setInternalRate] = (0, import_react62.useState)(defaultPlaybackRate);
   const playbackRate = rateProp ?? internalRate;
-  const [internalObjectFit, setInternalObjectFit] = (0, import_react61.useState)(defaultObjectFit);
+  const [internalObjectFit, setInternalObjectFit] = (0, import_react62.useState)(defaultObjectFit);
   const objectFit = objectFitProp ?? internalObjectFit;
-  const [internalVolumeBalance, setInternalVolumeBalance] = (0, import_react61.useState)(defaultVolumeBalance);
+  const [internalVolumeBalance, setInternalVolumeBalance] = (0, import_react62.useState)(defaultVolumeBalance);
   const volumeBalance = volumeBalanceProp ?? internalVolumeBalance;
-  const [internalVolume, setInternalVolume] = (0, import_react61.useState)(
+  const [internalVolume, setInternalVolume] = (0, import_react62.useState)(
     () => Math.min(1, Math.max(0, defaultVolume))
   );
   const volume = volumeProp ?? internalVolume;
-  const balanceGraphRef = (0, import_react61.useRef)(null);
-  const seekingRef = (0, import_react61.useRef)(false);
-  const setMuted = (0, import_react61.useCallback)(
+  const balanceGraphRef = (0, import_react62.useRef)(null);
+  const seekingRef = (0, import_react62.useRef)(false);
+  const setMuted = (0, import_react62.useCallback)(
     (next) => {
       if (mutedProp === void 0) setInternalMuted(next);
       onMutedChange?.(next);
@@ -10869,7 +11065,7 @@ function useVideoState({
     },
     [mutedProp, onMutedChange, videoRef]
   );
-  const setPlaybackRate = (0, import_react61.useCallback)(
+  const setPlaybackRate = (0, import_react62.useCallback)(
     (next) => {
       if (rateProp === void 0) setInternalRate(next);
       onPlaybackRateChange?.(next);
@@ -10878,14 +11074,14 @@ function useVideoState({
     },
     [rateProp, onPlaybackRateChange, videoRef]
   );
-  const setObjectFit = (0, import_react61.useCallback)(
+  const setObjectFit = (0, import_react62.useCallback)(
     (next) => {
       if (objectFitProp === void 0) setInternalObjectFit(next);
       onObjectFitChange?.(next);
     },
     [objectFitProp, onObjectFitChange]
   );
-  const setVolume = (0, import_react61.useCallback)(
+  const setVolume = (0, import_react62.useCallback)(
     (next) => {
       const clamped = Math.min(1, Math.max(0, next));
       if (volumeProp === void 0) setInternalVolume(clamped);
@@ -10897,14 +11093,14 @@ function useVideoState({
     },
     [muted, onVolumeChange, setMuted, videoRef, volumeProp]
   );
-  const setVolumeBalance = (0, import_react61.useCallback)(
+  const setVolumeBalance = (0, import_react62.useCallback)(
     (next) => {
       if (volumeBalanceProp === void 0) setInternalVolumeBalance(next);
       onVolumeBalanceChange?.(next);
     },
     [volumeBalanceProp, onVolumeBalanceChange]
   );
-  (0, import_react61.useEffect)(() => {
+  (0, import_react62.useEffect)(() => {
     const video = videoRef.current;
     if (!video) return;
     video.muted = muted;
@@ -10944,7 +11140,7 @@ function useVideoState({
       video.removeEventListener("volumechange", onVolumeChangeEvent);
     };
   }, [videoRef, muted, playbackRate, volume, mutedProp, volumeProp]);
-  (0, import_react61.useEffect)(() => {
+  (0, import_react62.useEffect)(() => {
     if (!playing) return;
     const video = videoRef.current;
     if (!video) return;
@@ -10959,7 +11155,7 @@ function useVideoState({
     raf = requestAnimationFrame(tick);
     return () => cancelAnimationFrame(raf);
   }, [playing, videoRef]);
-  (0, import_react61.useEffect)(() => {
+  (0, import_react62.useEffect)(() => {
     const onFullscreenChange = () => {
       const root = rootRef.current;
       const active = document.fullscreenElement === root || // Safari
@@ -10973,7 +11169,7 @@ function useVideoState({
       document.removeEventListener("webkitfullscreenchange", onFullscreenChange);
     };
   }, [rootRef]);
-  (0, import_react61.useEffect)(() => {
+  (0, import_react62.useEffect)(() => {
     const video = videoRef.current;
     if (!video) return;
     let cancelled = false;
@@ -11015,7 +11211,7 @@ function useVideoState({
       cancelled = true;
     };
   }, [volumeBalance, videoRef]);
-  (0, import_react61.useEffect)(() => {
+  (0, import_react62.useEffect)(() => {
     return () => {
       const graph = balanceGraphRef.current;
       if (!graph) return;
@@ -11028,7 +11224,7 @@ function useVideoState({
       balanceGraphRef.current = null;
     };
   }, []);
-  const togglePlay = (0, import_react61.useCallback)(() => {
+  const togglePlay = (0, import_react62.useCallback)(() => {
     const video = videoRef.current;
     if (!video) return;
     if (video.paused) {
@@ -11037,7 +11233,7 @@ function useVideoState({
       video.pause();
     }
   }, [videoRef]);
-  const seekBy = (0, import_react61.useCallback)(
+  const seekBy = (0, import_react62.useCallback)(
     (delta) => {
       const video = videoRef.current;
       if (!video) return;
@@ -11050,21 +11246,21 @@ function useVideoState({
     },
     [videoRef]
   );
-  const handlePrevious = (0, import_react61.useCallback)(() => {
+  const handlePrevious = (0, import_react62.useCallback)(() => {
     if (onPrevious) {
       onPrevious();
       return;
     }
     seekBy(-skipSeconds);
   }, [onPrevious, seekBy, skipSeconds]);
-  const handleNext = (0, import_react61.useCallback)(() => {
+  const handleNext = (0, import_react62.useCallback)(() => {
     if (onNext) {
       onNext();
       return;
     }
     seekBy(skipSeconds);
   }, [onNext, seekBy, skipSeconds]);
-  const seekTo = (0, import_react61.useCallback)(
+  const seekTo = (0, import_react62.useCallback)(
     (time) => {
       const video = videoRef.current;
       if (!video) return;
@@ -11077,11 +11273,11 @@ function useVideoState({
     },
     [videoRef]
   );
-  const beginSeek = (0, import_react61.useCallback)(() => {
+  const beginSeek = (0, import_react62.useCallback)(() => {
     seekingRef.current = true;
     setSeeking(true);
   }, []);
-  const previewSeek = (0, import_react61.useCallback)(
+  const previewSeek = (0, import_react62.useCallback)(
     (time) => {
       const video = videoRef.current;
       if (!video) return;
@@ -11094,14 +11290,14 @@ function useVideoState({
     },
     [videoRef]
   );
-  const endSeek = (0, import_react61.useCallback)(() => {
+  const endSeek = (0, import_react62.useCallback)(() => {
     seekingRef.current = false;
     setSeeking(false);
   }, []);
-  const toggleMute = (0, import_react61.useCallback)(() => {
+  const toggleMute = (0, import_react62.useCallback)(() => {
     setMuted(!muted);
   }, [muted, setMuted]);
-  const toggleFullscreen = (0, import_react61.useCallback)(async () => {
+  const toggleFullscreen = (0, import_react62.useCallback)(async () => {
     const root = rootRef.current;
     if (!root) return;
     const doc = document;
@@ -11148,7 +11344,7 @@ function useVideoState({
 }
 
 // src/components/video/video-animated-icon.tsx
-var import_react62 = require("react");
+var import_react63 = require("react");
 
 // src/components/video/video-animated-icon-markup.ts
 var VIDEO_ANIMATED_ICON_MARKUP = {
@@ -11159,7 +11355,7 @@ var VIDEO_ANIMATED_ICON_MARKUP = {
 };
 
 // src/components/video/video-animated-icon.tsx
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 var VIDEO_TRANSPORT_ANIMATION_MS = 550;
 function prefersReducedMotion3() {
   return typeof window !== "undefined" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
@@ -11219,21 +11415,21 @@ function setLayerActive(layer, active) {
 function setLayerRest(layer, rest) {
   layer.dataset.rest = rest ? "true" : "false";
 }
-var VideoAnimatedIcon = (0, import_react62.memo)(function VideoAnimatedIcon2({
+var VideoAnimatedIcon = (0, import_react63.memo)(function VideoAnimatedIcon2({
   name,
   playToken = 0
 }) {
-  const uid = (0, import_react62.useId)().replace(/:/g, "");
-  const hostRef = (0, import_react62.useRef)(null);
-  const playLayerRef = (0, import_react62.useRef)(null);
-  const pauseLayerRef = (0, import_react62.useRef)(null);
-  const singleLayerRef = (0, import_react62.useRef)(null);
-  const lockRef = (0, import_react62.useRef)(false);
-  const shownRef = (0, import_react62.useRef)(name);
-  const nameRef = (0, import_react62.useRef)(name);
+  const uid = (0, import_react63.useId)().replace(/:/g, "");
+  const hostRef = (0, import_react63.useRef)(null);
+  const playLayerRef = (0, import_react63.useRef)(null);
+  const pauseLayerRef = (0, import_react63.useRef)(null);
+  const singleLayerRef = (0, import_react63.useRef)(null);
+  const lockRef = (0, import_react63.useRef)(false);
+  const shownRef = (0, import_react63.useRef)(name);
+  const nameRef = (0, import_react63.useRef)(name);
   nameRef.current = name;
   const isPlayPause = name === "play" || name === "pause";
-  (0, import_react62.useLayoutEffect)(() => {
+  (0, import_react63.useLayoutEffect)(() => {
     if (isPlayPause) {
       const playLayer = playLayerRef.current;
       const pauseLayer = pauseLayerRef.current;
@@ -11257,7 +11453,7 @@ var VideoAnimatedIcon = (0, import_react62.memo)(function VideoAnimatedIcon2({
     setLayerRest(layer, true);
     shownRef.current = name;
   }, []);
-  (0, import_react62.useLayoutEffect)(() => {
+  (0, import_react63.useLayoutEffect)(() => {
     if (playToken === 0) return;
     if (prefersReducedMotion3()) {
       const target2 = nameRef.current;
@@ -11309,7 +11505,7 @@ var VideoAnimatedIcon = (0, import_react62.memo)(function VideoAnimatedIcon2({
     }, VIDEO_TRANSPORT_ANIMATION_MS);
     return () => window.clearTimeout(timer);
   }, [playToken]);
-  (0, import_react62.useLayoutEffect)(() => {
+  (0, import_react63.useLayoutEffect)(() => {
     if (lockRef.current) return;
     if (shownRef.current === name) return;
     if (name !== "play" && name !== "pause") return;
@@ -11322,8 +11518,8 @@ var VideoAnimatedIcon = (0, import_react62.memo)(function VideoAnimatedIcon2({
     shownRef.current = name;
   }, [name]);
   if (isPlayPause) {
-    return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("span", { ref: hostRef, className: "aviala-video__animated-icon", "aria-hidden": true, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("span", { ref: hostRef, className: "aviala-video__animated-icon", "aria-hidden": true, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
         "span",
         {
           ref: playLayerRef,
@@ -11331,7 +11527,7 @@ var VideoAnimatedIcon = (0, import_react62.memo)(function VideoAnimatedIcon2({
           "data-active": "true"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
         "span",
         {
           ref: pauseLayerRef,
@@ -11341,7 +11537,7 @@ var VideoAnimatedIcon = (0, import_react62.memo)(function VideoAnimatedIcon2({
       )
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
     "span",
     {
       ref: hostRef,
@@ -11349,7 +11545,7 @@ var VideoAnimatedIcon = (0, import_react62.memo)(function VideoAnimatedIcon2({
       "data-flip": name === "next" ? "true" : void 0,
       "data-mirror-motion": name === "previous" ? "true" : void 0,
       "aria-hidden": true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
         "span",
         {
           ref: singleLayerRef,
@@ -11363,7 +11559,7 @@ var VideoAnimatedIcon = (0, import_react62.memo)(function VideoAnimatedIcon2({
 });
 
 // src/components/video/video-settings.tsx
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 function VideoSettings({
   locale,
   objectFit,
@@ -11372,29 +11568,29 @@ function VideoSettings({
   onVolumeBalanceChange,
   trigger
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(Popover, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(PopoverTrigger, { asChild: true, children: trigger }),
-    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(PopoverContent, { side: "top", align: "end", showArrow: true, flush: true, sideOffset: 8, children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "aviala-video__settings-body", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Typography, { level: "subtitle", children: locale.settingsTitle }),
-      /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "aviala-video__settings-section", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Typography, { level: "text", children: locale.aspectRatio }),
-        /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(Popover, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(PopoverTrigger, { asChild: true, children: trigger }),
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(PopoverContent, { side: "top", align: "end", showArrow: true, flush: true, sideOffset: 8, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "aviala-video__settings-body", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Typography, { level: "subtitle", children: locale.settingsTitle }),
+      /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "aviala-video__settings-section", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Typography, { level: "text", children: locale.aspectRatio }),
+        /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
           SegmentatorGroup,
           {
             equalWidth: true,
             value: objectFit,
             onValueChange: (value) => onObjectFitChange(value),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(SegmentatorItem, { value: "original", children: locale.aspectOriginal }),
-              /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(SegmentatorItem, { value: "stretch", children: locale.aspectStretch }),
-              /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(SegmentatorItem, { value: "fill", children: locale.aspectFill })
+              /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(SegmentatorItem, { value: "original", children: locale.aspectOriginal }),
+              /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(SegmentatorItem, { value: "stretch", children: locale.aspectStretch }),
+              /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(SegmentatorItem, { value: "fill", children: locale.aspectFill })
             ]
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "aviala-video__settings-row", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Typography, { level: "text", children: locale.volumeBalance }),
-        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "aviala-video__settings-row", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Typography, { level: "text", children: locale.volumeBalance }),
+        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
           Switch,
           {
             size: "small",
@@ -11409,9 +11605,9 @@ function VideoSettings({
 }
 
 // src/components/video/video-speed.tsx
-var import_icons19 = require("@aviala-design/icons");
-var import_react63 = require("react");
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_icons20 = require("@aviala-design/icons");
+var import_react64 = require("react");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 function formatSpeedRate(template, rate) {
   return interpolate(template, { rate });
 }
@@ -11424,11 +11620,11 @@ function VideoSpeed({
   onPlaybackRateChange,
   trigger
 }) {
-  const [open, setOpen] = (0, import_react63.useState)(false);
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(PopoverTrigger, { asChild: true, children: trigger }),
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(PopoverContent, { side: "top", align: "center", showArrow: true, flush: true, sideOffset: 8, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: "aviala-video__speed-menu", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { className: "aviala-select-group", role: "none", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+  const [open, setOpen] = (0, import_react64.useState)(false);
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(PopoverTrigger, { asChild: true, children: trigger }),
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(PopoverContent, { side: "top", align: "center", showArrow: true, flush: true, sideOffset: 8, children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "aviala-video__speed-menu", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "aviala-select-group", role: "none", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
         "div",
         {
           className: cn(
@@ -11438,7 +11634,7 @@ function VideoSpeed({
           children: title
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
         "div",
         {
           className: "aviala-select-group__slot",
@@ -11446,7 +11642,7 @@ function VideoSpeed({
           "aria-label": label,
           children: playbackRates.map((rate) => {
             const selected = rate === playbackRate;
-            return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
+            return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
               "button",
               {
                 type: "button",
@@ -11460,7 +11656,7 @@ function VideoSpeed({
                   setOpen(false);
                 },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
                     "span",
                     {
                       className: cn(
@@ -11470,12 +11666,12 @@ function VideoSpeed({
                       children: formatSpeedRate(rateTemplate, rate)
                     }
                   ),
-                  selected ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+                  selected ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
                     "span",
                     {
                       className: "aviala-select-item__trailing-radio",
                       "aria-hidden": true,
-                      children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_icons19.SymbolRight, { level: "text", biggerSize: true, "aria-hidden": true })
+                      children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_icons20.SymbolRight, { level: "text", biggerSize: true, "aria-hidden": true })
                     }
                   ) : null
                 ]
@@ -11490,17 +11686,17 @@ function VideoSpeed({
 }
 
 // src/components/video/video-volume.tsx
-var import_jsx_runtime61 = require("react/jsx-runtime");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 function VideoVolume({
   label,
   percent,
   onPercentChange,
   trigger
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(Popover, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(PopoverTrigger, { asChild: true, children: trigger }),
-    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(PopoverContent, { side: "top", align: "center", showArrow: true, flush: true, sideOffset: 8, children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "aviala-video__volume-body", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Popover, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(PopoverTrigger, { asChild: true, children: trigger }),
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(PopoverContent, { side: "top", align: "center", showArrow: true, flush: true, sideOffset: 8, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "aviala-video__volume-body", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
         Slider,
         {
           className: "aviala-video__volume-slider",
@@ -11514,13 +11710,13 @@ function VideoVolume({
           onValueChange: (values) => onPercentChange(values[0] ?? 0)
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Typography, { level: "text", children: `${percent}%` })
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Typography, { level: "text", children: `${percent}%` })
     ] }) })
   ] });
 }
 
 // src/components/video/video-controls.tsx
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 function volumePercent(volume, muted) {
   if (muted) return 0;
   return Math.round(Math.min(1, Math.max(0, volume)) * 100);
@@ -11528,17 +11724,17 @@ function volumePercent(volume, muted) {
 function VolumeTriggerIcon({
   percent
 }) {
-  if (percent <= 0) return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_icons20.GeneralVolumeSlash, { mode: "fill", "aria-hidden": true });
-  if (percent < 34) return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_icons20.GeneralVolumeMin, { mode: "fill", "aria-hidden": true });
-  if (percent < 67) return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_icons20.GeneralVolumeMiddle, { mode: "fill", "aria-hidden": true });
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_icons20.GeneralVolumeMax, { mode: "fill", "aria-hidden": true });
+  if (percent <= 0) return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons21.GeneralVolumeSlash, { mode: "fill", "aria-hidden": true });
+  if (percent < 34) return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons21.GeneralVolumeMin, { mode: "fill", "aria-hidden": true });
+  if (percent < 67) return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons21.GeneralVolumeMiddle, { mode: "fill", "aria-hidden": true });
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons21.GeneralVolumeMax, { mode: "fill", "aria-hidden": true });
 }
 function ControlIconButton({
   label,
   icon,
   onClick
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
     Button,
     {
       type: "button",
@@ -11552,34 +11748,34 @@ function ControlIconButton({
     }
   );
 }
-var VideoTransportButtons = (0, import_react64.memo)(function VideoTransportButtons2({
+var VideoTransportButtons = (0, import_react65.memo)(function VideoTransportButtons2({
   playing,
   locale,
   onTogglePlay,
   onPrevious,
   onNext
 }) {
-  const [prevToken, setPrevToken] = (0, import_react64.useState)(0);
-  const [nextToken, setNextToken] = (0, import_react64.useState)(0);
-  const [playToken, setPlayToken] = (0, import_react64.useState)(0);
-  const playLockRef = (0, import_react64.useRef)(false);
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "aviala-video__group", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+  const [prevToken, setPrevToken] = (0, import_react65.useState)(0);
+  const [nextToken, setNextToken] = (0, import_react65.useState)(0);
+  const [playToken, setPlayToken] = (0, import_react65.useState)(0);
+  const playLockRef = (0, import_react65.useRef)(false);
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "aviala-video__group", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
       ControlIconButton,
       {
         label: locale.previous,
-        icon: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(VideoAnimatedIcon, { name: "previous", playToken: prevToken }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(VideoAnimatedIcon, { name: "previous", playToken: prevToken }),
         onClick: () => {
           setPrevToken((token) => token + 1);
           onPrevious();
         }
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
       ControlIconButton,
       {
         label: playing ? locale.pause : locale.play,
-        icon: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+        icon: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
           VideoAnimatedIcon,
           {
             name: playing ? "pause" : "play",
@@ -11597,11 +11793,11 @@ var VideoTransportButtons = (0, import_react64.memo)(function VideoTransportButt
         }
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
       ControlIconButton,
       {
         label: locale.next,
-        icon: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(VideoAnimatedIcon, { name: "next", playToken: nextToken }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(VideoAnimatedIcon, { name: "next", playToken: nextToken }),
         onClick: () => {
           setNextToken((token) => token + 1);
           onNext();
@@ -11617,9 +11813,9 @@ function VideoTimeInput({
 }) {
   const safeDuration = Number.isFinite(duration) && duration > 0 ? duration : 0;
   const timeLabel = `${formatVideoTime(currentTime)} / ${formatVideoTime(safeDuration)}`;
-  const [editing, setEditing] = (0, import_react64.useState)(false);
-  const [draft, setDraft] = (0, import_react64.useState)(timeLabel);
-  (0, import_react64.useEffect)(() => {
+  const [editing, setEditing] = (0, import_react65.useState)(false);
+  const [draft, setDraft] = (0, import_react65.useState)(timeLabel);
+  (0, import_react65.useEffect)(() => {
     if (!editing) setDraft(timeLabel);
   }, [editing, timeLabel]);
   const commit = () => {
@@ -11630,7 +11826,7 @@ function VideoTimeInput({
     }
     setEditing(false);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
     Input,
     {
       className: "aviala-video__time",
@@ -11692,9 +11888,9 @@ function VideoControls({
   const sliderMax = safeDuration > 0 ? safeDuration : 1;
   const sliderValue = Math.min(Math.max(0, currentTime), sliderMax);
   const percent = volumePercent(volume, muted);
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "aviala-video__controls", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "aviala-video__bar", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "aviala-video__bar-bg", "aria-hidden": true }),
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "aviala-video__controls", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "aviala-video__bar", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "aviala-video__bar-bg", "aria-hidden": true }),
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
       VideoTransportButtons,
       {
         playing,
@@ -11704,8 +11900,8 @@ function VideoControls({
         onNext
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "aviala-video__progress", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "aviala-video__progress", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
         VideoTimeInput,
         {
           currentTime,
@@ -11718,7 +11914,7 @@ function VideoControls({
           }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
         Slider,
         {
           className: "aviala-video__seek",
@@ -11742,8 +11938,8 @@ function VideoControls({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "aviala-video__group", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "aviala-video__group", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
         VideoSpeed,
         {
           label: locale.speed,
@@ -11752,7 +11948,7 @@ function VideoControls({
           playbackRate,
           playbackRates,
           onPlaybackRateChange,
-          trigger: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+          trigger: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
             Button,
             {
               type: "button",
@@ -11766,13 +11962,13 @@ function VideoControls({
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
         VideoVolume,
         {
           label: locale.volume,
           percent,
           onPercentChange: (next) => onVolumeChange(next / 100),
-          trigger: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+          trigger: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
             Button,
             {
               type: "button",
@@ -11781,12 +11977,12 @@ function VideoControls({
               iconOnly: true,
               allRound: true,
               "aria-label": locale.volume,
-              leftIcon: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(VolumeTriggerIcon, { percent })
+              leftIcon: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(VolumeTriggerIcon, { percent })
             }
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
         VideoSettings,
         {
           locale,
@@ -11794,7 +11990,7 @@ function VideoControls({
           volumeBalance,
           onObjectFitChange,
           onVolumeBalanceChange,
-          trigger: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+          trigger: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
             Button,
             {
               type: "button",
@@ -11803,16 +11999,16 @@ function VideoControls({
               iconOnly: true,
               allRound: true,
               "aria-label": locale.settings,
-              leftIcon: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_icons20.GeneralSetting, { mode: "fill", "aria-hidden": true })
+              leftIcon: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons21.GeneralSetting, { mode: "fill", "aria-hidden": true })
             }
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
         ControlIconButton,
         {
           label: fullscreen ? locale.exitFullscreen : locale.fullscreen,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_icons20.GeneralFullScreen, { mode: "fill", "aria-hidden": true }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_icons21.GeneralFullScreen, { mode: "fill", "aria-hidden": true }),
           onClick: onToggleFullscreen
         }
       )
@@ -11821,7 +12017,7 @@ function VideoControls({
 }
 
 // src/components/video/use-controls-auto-hide.ts
-var import_react65 = require("react");
+var import_react66 = require("react");
 var DEFAULT_AUTO_HIDE_DELAY_MS = 2500;
 function isOverlayOpen() {
   if (typeof document === "undefined") return false;
@@ -11843,23 +12039,23 @@ function useVideoControlsAutoHide({
   seeking,
   rootRef
 }) {
-  const [hidden, setHidden] = (0, import_react65.useState)(false);
-  const timerRef = (0, import_react65.useRef)(null);
-  const enabledRef = (0, import_react65.useRef)(enabled);
-  const playingRef = (0, import_react65.useRef)(playing);
-  const seekingRef = (0, import_react65.useRef)(seeking);
-  const delayRef = (0, import_react65.useRef)(delayMs);
+  const [hidden, setHidden] = (0, import_react66.useState)(false);
+  const timerRef = (0, import_react66.useRef)(null);
+  const enabledRef = (0, import_react66.useRef)(enabled);
+  const playingRef = (0, import_react66.useRef)(playing);
+  const seekingRef = (0, import_react66.useRef)(seeking);
+  const delayRef = (0, import_react66.useRef)(delayMs);
   enabledRef.current = enabled;
   playingRef.current = playing;
   seekingRef.current = seeking;
   delayRef.current = delayMs;
-  const clearTimer = (0, import_react65.useCallback)(() => {
+  const clearTimer = (0, import_react66.useCallback)(() => {
     if (timerRef.current != null) {
       window.clearTimeout(timerRef.current);
       timerRef.current = null;
     }
   }, []);
-  const scheduleHide = (0, import_react65.useCallback)(() => {
+  const scheduleHide = (0, import_react66.useCallback)(() => {
     clearTimer();
     if (!enabledRef.current || !playingRef.current) return;
     timerRef.current = window.setTimeout(() => {
@@ -11872,11 +12068,11 @@ function useVideoControlsAutoHide({
       setHidden(true);
     }, delayRef.current);
   }, [clearTimer, rootRef]);
-  const reveal = (0, import_react65.useCallback)(() => {
+  const reveal = (0, import_react66.useCallback)(() => {
     setHidden(false);
     scheduleHide();
   }, [scheduleHide]);
-  (0, import_react65.useEffect)(() => {
+  (0, import_react66.useEffect)(() => {
     if (!enabled || !playing) {
       clearTimer();
       setHidden(false);
@@ -11889,7 +12085,7 @@ function useVideoControlsAutoHide({
     }
     scheduleHide();
   }, [clearTimer, enabled, playing, scheduleHide, seeking]);
-  (0, import_react65.useEffect)(() => {
+  (0, import_react66.useEffect)(() => {
     const root = rootRef.current;
     if (!root || !enabled) return;
     const onActivity = () => {
@@ -11905,13 +12101,13 @@ function useVideoControlsAutoHide({
       root.removeEventListener("focusin", onActivity);
     };
   }, [enabled, reveal, rootRef]);
-  (0, import_react65.useEffect)(() => () => clearTimer(), [clearTimer]);
+  (0, import_react66.useEffect)(() => () => clearTimer(), [clearTimer]);
   return enabled && playing ? hidden : false;
 }
 
 // src/components/video/video.tsx
-var import_jsx_runtime63 = require("react/jsx-runtime");
-var Video = (0, import_react66.forwardRef)(
+var import_jsx_runtime64 = require("react/jsx-runtime");
+var Video = (0, import_react67.forwardRef)(
   ({
     appearance = "default",
     skipSeconds = 10,
@@ -11944,8 +12140,8 @@ var Video = (0, import_react66.forwardRef)(
     ...videoProps
   }, ref) => {
     const locale = useLocaleMessages("Video");
-    const rootRef = (0, import_react66.useRef)(null);
-    const videoRef = (0, import_react66.useRef)(null);
+    const rootRef = (0, import_react67.useRef)(null);
+    const videoRef = (0, import_react67.useRef)(null);
     const state = useVideoState({
       videoRef,
       rootRef,
@@ -11975,7 +12171,7 @@ var Video = (0, import_react66.forwardRef)(
       seeking: state.seeking,
       rootRef
     });
-    (0, import_react66.useImperativeHandle)(
+    (0, import_react67.useImperativeHandle)(
       ref,
       () => ({
         video: videoRef.current,
@@ -11984,7 +12180,7 @@ var Video = (0, import_react66.forwardRef)(
       }),
       []
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
       "div",
       {
         ref: rootRef,
@@ -12005,7 +12201,7 @@ var Video = (0, import_react66.forwardRef)(
         "data-fullscreen": state.fullscreen ? "true" : void 0,
         ...spiralDebugId("video"),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "aviala-video__stage", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "aviala-video__stage", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
             "video",
             {
               ref: videoRef,
@@ -12024,7 +12220,7 @@ var Video = (0, import_react66.forwardRef)(
               children
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
             VideoControls,
             {
               locale,
@@ -12060,8 +12256,8 @@ var Video = (0, import_react66.forwardRef)(
 Video.displayName = "Video";
 
 // src/components/scroll-picker.tsx
-var import_react67 = require("react");
-var import_jsx_runtime64 = require("react/jsx-runtime");
+var import_react68 = require("react");
+var import_jsx_runtime65 = require("react/jsx-runtime");
 var LOOP_SECTIONS2 = WHEEL_LOOP_SECTIONS;
 var MIDDLE_SECTION2 = WHEEL_LOOP_MIDDLE_SECTION;
 function readMetrics(container) {
@@ -12089,7 +12285,7 @@ function readRawIndex(container, metrics) {
   return Math.round(fractionalIndexAtScrollTop(metrics, container.scrollTop));
 }
 function ScrollPicker({ className, children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: cn("aviala-scroll-picker", className), ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: cn("aviala-scroll-picker", className), ...props, children });
 }
 function ScrollPickerColumn({
   className,
@@ -12101,29 +12297,29 @@ function ScrollPickerColumn({
   formatValue,
   getValueKey
 }) {
-  const scrollRef = (0, import_react67.useRef)(null);
-  const clipTrackRef = (0, import_react67.useRef)(null);
-  const isUserScrollingRef = (0, import_react67.useRef)(false);
-  const isProgrammaticScrollRef = (0, import_react67.useRef)(false);
-  const smoothTargetValueRef = (0, import_react67.useRef)(null);
-  const scrollEndTimerRef = (0, import_react67.useRef)(void 0);
-  const wheelAccumRef = (0, import_react67.useRef)(0);
-  const wheelAccumIdleTimerRef = (0, import_react67.useRef)(void 0);
-  const selectedValueRef = (0, import_react67.useRef)(value);
-  const reactId = (0, import_react67.useId)();
+  const scrollRef = (0, import_react68.useRef)(null);
+  const clipTrackRef = (0, import_react68.useRef)(null);
+  const isUserScrollingRef = (0, import_react68.useRef)(false);
+  const isProgrammaticScrollRef = (0, import_react68.useRef)(false);
+  const smoothTargetValueRef = (0, import_react68.useRef)(null);
+  const scrollEndTimerRef = (0, import_react68.useRef)(void 0);
+  const wheelAccumRef = (0, import_react68.useRef)(0);
+  const wheelAccumIdleTimerRef = (0, import_react68.useRef)(void 0);
+  const selectedValueRef = (0, import_react68.useRef)(value);
+  const reactId = (0, import_react68.useId)();
   selectedValueRef.current = value;
-  const getIndex = (0, import_react67.useCallback)(
+  const getIndex = (0, import_react68.useCallback)(
     (candidate) => {
       const index = values.findIndex((item) => Object.is(item, candidate));
       return index >= 0 ? index : 0;
     },
     [values]
   );
-  const repeatedValues = (0, import_react67.useMemo)(() => {
+  const repeatedValues = (0, import_react68.useMemo)(() => {
     if (!loop) return [...values];
     return Array.from({ length: LOOP_SECTIONS2 }, () => values).flat();
   }, [loop, values]);
-  const syncClipTrack = (0, import_react67.useCallback)(() => {
+  const syncClipTrack = (0, import_react68.useCallback)(() => {
     const container = scrollRef.current;
     const track = clipTrackRef.current;
     if (!container || !track) return;
@@ -12134,7 +12330,7 @@ function ScrollPickerColumn({
     const offset = container.scrollTop + (container.clientHeight - bandHeight) / 2;
     track.style.transform = `translate3d(0, ${-offset}px, 0)`;
   }, []);
-  const scrollToIndex = (0, import_react67.useCallback)(
+  const scrollToIndex = (0, import_react68.useCallback)(
     (index, behavior = "auto") => {
       const container = scrollRef.current;
       if (!container) return;
@@ -12150,7 +12346,7 @@ function ScrollPickerColumn({
     },
     [syncClipTrack]
   );
-  const settleScroll = (0, import_react67.useCallback)(() => {
+  const settleScroll = (0, import_react68.useCallback)(() => {
     const container = scrollRef.current;
     if (!container) return;
     const wasProgrammatic = isProgrammaticScrollRef.current;
@@ -12207,7 +12403,7 @@ function ScrollPickerColumn({
     wheelAccumRef.current = 0;
     syncClipTrack();
   }, [loop, onChange, syncClipTrack, values]);
-  const handleScroll = (0, import_react67.useCallback)(() => {
+  const handleScroll = (0, import_react68.useCallback)(() => {
     syncClipTrack();
     if (isProgrammaticScrollRef.current) return;
     isUserScrollingRef.current = true;
@@ -12216,7 +12412,7 @@ function ScrollPickerColumn({
     }
     scrollEndTimerRef.current = setTimeout(settleScroll, WHEEL_SCROLL_END_MS);
   }, [settleScroll, syncClipTrack]);
-  (0, import_react67.useLayoutEffect)(() => {
+  (0, import_react68.useLayoutEffect)(() => {
     if (isUserScrollingRef.current) return;
     if (smoothTargetValueRef.current != null && Object.is(smoothTargetValueRef.current, value)) {
       return;
@@ -12240,7 +12436,7 @@ function ScrollPickerColumn({
     }
     scrollToIndex(targetIndex, "auto");
   }, [getIndex, loop, scrollToIndex, syncClipTrack, value, values.length]);
-  (0, import_react67.useEffect)(() => {
+  (0, import_react68.useEffect)(() => {
     const container = scrollRef.current;
     if (!container) return;
     const onScrollEnd = () => {
@@ -12257,7 +12453,7 @@ function ScrollPickerColumn({
       }
     };
   }, [settleScroll]);
-  (0, import_react67.useEffect)(() => {
+  (0, import_react68.useEffect)(() => {
     const container = scrollRef.current;
     if (!container) return;
     const onWheel = (event) => {
@@ -12353,9 +12549,9 @@ function ScrollPickerColumn({
     }
   };
   const selectedOptionId = `${reactId}-${getIndex(value)}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: cn("aviala-scroll-picker-column", className), children: /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "aviala-scroll-picker-column__viewport", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "aviala-scroll-picker-column__highlight", "aria-hidden": true }),
-    /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: cn("aviala-scroll-picker-column", className), children: /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "aviala-scroll-picker-column__viewport", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "aviala-scroll-picker-column__highlight", "aria-hidden": true }),
+    /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
       "div",
       {
         ref: scrollRef,
@@ -12366,13 +12562,13 @@ function ScrollPickerColumn({
         "aria-activedescendant": selectedOptionId,
         tabIndex: 0,
         onKeyDown: handleKeyDown,
-        children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("ul", { className: "aviala-scroll-picker-column__list", children: repeatedValues.map((itemValue, index) => {
+        children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("ul", { className: "aviala-scroll-picker-column__list", children: repeatedValues.map((itemValue, index) => {
           const isCommitted = Object.is(itemValue, value);
           const valueIndex = loop ? normalizeWheelIndex(index, values.length) : index;
           const optionId = `${reactId}-${loop ? index : valueIndex}`;
           const key = getValueKey?.(itemValue, index) ?? `${String(itemValue)}-${index}`;
           const useSelectedId = isCommitted && (!loop || Math.floor(index / values.length) === MIDDLE_SECTION2);
-          return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("li", { className: "contents", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("li", { className: "contents", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
             ScrollPickerItem,
             {
               id: useSelectedId ? selectedOptionId : optionId,
@@ -12391,9 +12587,9 @@ function ScrollPickerColumn({
         }) })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "aviala-scroll-picker-column__clip", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { ref: clipTrackRef, className: "aviala-scroll-picker-column__clip-track", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "aviala-scroll-picker-column__list", children: repeatedValues.map((itemValue, index) => {
+    /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "aviala-scroll-picker-column__clip", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { ref: clipTrackRef, className: "aviala-scroll-picker-column__clip-track", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "aviala-scroll-picker-column__list", children: repeatedValues.map((itemValue, index) => {
       const key = getValueKey?.(itemValue, index) ?? `clip-${String(itemValue)}-${index}`;
-      return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
         "div",
         {
           className: cn(
@@ -12414,7 +12610,7 @@ function ScrollPickerItem({
   className,
   onSelect
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
     "button",
     {
       type: "button",
@@ -12435,15 +12631,15 @@ function ScrollPickerItem({
 }
 
 // src/components/breadcrumb.tsx
-var import_icons21 = require("@aviala-design/icons");
-var import_class_variance_authority15 = require("class-variance-authority");
-var import_react68 = require("react");
-var import_jsx_runtime65 = require("react/jsx-runtime");
-var BreadcrumbSizeContext = (0, import_react68.createContext)("default");
+var import_icons22 = require("@aviala-design/icons");
+var import_class_variance_authority16 = require("class-variance-authority");
+var import_react69 = require("react");
+var import_jsx_runtime66 = require("react/jsx-runtime");
+var BreadcrumbSizeContext = (0, import_react69.createContext)("default");
 function breadcrumbTypeLevel(size) {
   return size === "small" ? "caption" : "text";
 }
-var breadcrumbVariants = (0, import_class_variance_authority15.cva)("aviala-breadcrumb", {
+var breadcrumbVariants = (0, import_class_variance_authority16.cva)("aviala-breadcrumb", {
   variants: {
     size: {
       default: "aviala-breadcrumb--size-default",
@@ -12454,11 +12650,11 @@ var breadcrumbVariants = (0, import_class_variance_authority15.cva)("aviala-brea
     size: "default"
   }
 });
-var Breadcrumb = (0, import_react68.forwardRef)(
+var Breadcrumb = (0, import_react69.forwardRef)(
   ({ className, size = "default", children, ...props }, ref) => {
     const locale = useLocaleMessages("Breadcrumb");
     const resolvedSize = size ?? "default";
-    return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(BreadcrumbSizeContext.Provider, { value: resolvedSize, children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(BreadcrumbSizeContext.Provider, { value: resolvedSize, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
       "nav",
       {
         ref,
@@ -12466,18 +12662,18 @@ var Breadcrumb = (0, import_react68.forwardRef)(
         className: cn(breadcrumbVariants({ size: resolvedSize }), className),
         "data-size": resolvedSize,
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("ol", { className: "aviala-breadcrumb__list", children })
+        children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("ol", { className: "aviala-breadcrumb__list", children })
       }
     ) });
   }
 );
 Breadcrumb.displayName = "Breadcrumb";
-var BreadcrumbItem = (0, import_react68.forwardRef)(
+var BreadcrumbItem = (0, import_react69.forwardRef)(
   ({ className, href, current = false, icon, onClick, children, ...props }, ref) => {
-    const size = (0, import_react68.useContext)(BreadcrumbSizeContext);
-    const label = /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(import_jsx_runtime65.Fragment, { children: [
-      icon ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: "aviala-breadcrumb-item__icon", children: icon }) : null,
-      children != null ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    const size = (0, import_react69.useContext)(BreadcrumbSizeContext);
+    const label = /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
+      icon ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { className: "aviala-breadcrumb-item__icon", children: icon }) : null,
+      children != null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
         Typography,
         {
           level: breadcrumbTypeLevel(size),
@@ -12487,13 +12683,13 @@ var BreadcrumbItem = (0, import_react68.forwardRef)(
         }
       ) : null
     ] });
-    return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
       "li",
       {
         ref,
         className: cn("aviala-breadcrumb-item-wrap", className),
         ...props,
-        children: href != null ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+        children: href != null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
           "a",
           {
             href,
@@ -12502,7 +12698,7 @@ var BreadcrumbItem = (0, import_react68.forwardRef)(
             "aria-current": current ? "page" : void 0,
             children: label
           }
-        ) : onClick != null ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+        ) : onClick != null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
           "button",
           {
             type: "button",
@@ -12512,7 +12708,7 @@ var BreadcrumbItem = (0, import_react68.forwardRef)(
             onClick,
             children: label
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+        ) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
           "span",
           {
             className: "aviala-breadcrumb-item",
@@ -12526,10 +12722,10 @@ var BreadcrumbItem = (0, import_react68.forwardRef)(
   }
 );
 BreadcrumbItem.displayName = "BreadcrumbItem";
-var BreadcrumbSeparator = (0, import_react68.forwardRef)(
+var BreadcrumbSeparator = (0, import_react69.forwardRef)(
   ({ className, children = "/", ...props }, ref) => {
-    const size = (0, import_react68.useContext)(BreadcrumbSizeContext);
-    return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    const size = (0, import_react69.useContext)(BreadcrumbSizeContext);
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
       "li",
       {
         ref,
@@ -12537,13 +12733,13 @@ var BreadcrumbSeparator = (0, import_react68.forwardRef)(
         "aria-hidden": true,
         className: cn("aviala-breadcrumb-separator", className),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Typography, { level: breadcrumbTypeLevel(size), as: "span", children })
+        children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Typography, { level: breadcrumbTypeLevel(size), as: "span", children })
       }
     );
   }
 );
 BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
-var BreadcrumbEllipsisItem = (0, import_react68.forwardRef)(
+var BreadcrumbEllipsisItem = (0, import_react69.forwardRef)(
   ({
     className,
     href,
@@ -12553,13 +12749,13 @@ var BreadcrumbEllipsisItem = (0, import_react68.forwardRef)(
     ...props
   }, ref) => {
     const rtl = useRtl();
-    const ChevronIcon = rtl ? import_icons21.DirectionArrowLeftLight : import_icons21.DirectionArrowRightLight;
-    const content = /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(import_jsx_runtime65.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Typography, { level: "text", as: "span", className: "aviala-breadcrumb-ellipsis-item__label", children }),
-      showChevron ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: "aviala-breadcrumb-ellipsis-item__chevron", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(ChevronIcon, { width: 14, height: 14, thickness: "Light" }) }) : null
+    const ChevronIcon = rtl ? import_icons22.DirectionArrowLeftLight : import_icons22.DirectionArrowRightLight;
+    const content = /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Typography, { level: "text", as: "span", className: "aviala-breadcrumb-ellipsis-item__label", children }),
+      showChevron ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { className: "aviala-breadcrumb-ellipsis-item__chevron", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(ChevronIcon, { width: 14, height: 14, thickness: "Light" }) }) : null
     ] });
     if (href != null) {
-      return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
         "a",
         {
           ref,
@@ -12571,7 +12767,7 @@ var BreadcrumbEllipsisItem = (0, import_react68.forwardRef)(
         }
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
       "button",
       {
         ref,
@@ -12585,7 +12781,7 @@ var BreadcrumbEllipsisItem = (0, import_react68.forwardRef)(
   }
 );
 BreadcrumbEllipsisItem.displayName = "BreadcrumbEllipsisItem";
-var BreadcrumbEllipsis = (0, import_react68.forwardRef)(
+var BreadcrumbEllipsis = (0, import_react69.forwardRef)(
   ({
     className,
     children,
@@ -12598,11 +12794,11 @@ var BreadcrumbEllipsis = (0, import_react68.forwardRef)(
     ...props
   }, ref) => {
     const locale = useLocaleMessages("Breadcrumb");
-    const size = (0, import_react68.useContext)(BreadcrumbSizeContext);
-    const [uncontrolledActivated, setUncontrolledActivated] = (0, import_react68.useState)(defaultActivated);
+    const size = (0, import_react69.useContext)(BreadcrumbSizeContext);
+    const [uncontrolledActivated, setUncontrolledActivated] = (0, import_react69.useState)(defaultActivated);
     const isControlled = activatedProp !== void 0;
     const activated = isControlled ? Boolean(activatedProp) : uncontrolledActivated;
-    const setActivated = (0, import_react68.useCallback)(
+    const setActivated = (0, import_react69.useCallback)(
       (next) => {
         if (!isControlled) setUncontrolledActivated(next);
         onActivatedChange?.(next);
@@ -12610,8 +12806,8 @@ var BreadcrumbEllipsis = (0, import_react68.forwardRef)(
       [isControlled, onActivatedChange]
     );
     const iconSize = 14;
-    const icon = children ?? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_icons21.SymbolMore, { width: iconSize, height: iconSize, thickness: "Light", "aria-hidden": true });
-    const trigger = /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    const icon = children ?? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_icons22.SymbolMore, { width: iconSize, height: iconSize, thickness: "Light", "aria-hidden": true });
+    const trigger = /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
       "button",
       {
         type: "button",
@@ -12630,9 +12826,9 @@ var BreadcrumbEllipsis = (0, import_react68.forwardRef)(
         children: icon
       }
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("li", { ref, className: cn("aviala-breadcrumb-ellipsis-wrap", className), children: menu != null ? /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(Popover, { open: activated, onOpenChange: setActivated, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(PopoverTrigger, { asChild: true, children: trigger }),
-      /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("li", { ref, className: cn("aviala-breadcrumb-ellipsis-wrap", className), children: menu != null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(Popover, { open: activated, onOpenChange: setActivated, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(PopoverTrigger, { asChild: true, children: trigger }),
+      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
         PopoverContent,
         {
           className: "aviala-breadcrumb-ellipsis-menu",
@@ -12641,7 +12837,7 @@ var BreadcrumbEllipsis = (0, import_react68.forwardRef)(
           sideOffset: 7,
           showArrow: false,
           role: "menu",
-          children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "aviala-breadcrumb-ellipsis-menu__items", children: menu })
+          children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "aviala-breadcrumb-ellipsis-menu__items", children: menu })
         }
       )
     ] }) : trigger });
@@ -12650,9 +12846,9 @@ var BreadcrumbEllipsis = (0, import_react68.forwardRef)(
 BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
 
 // src/components/pagehead.tsx
-var import_react69 = require("react");
-var import_jsx_runtime66 = require("react/jsx-runtime");
-var Pagehead = (0, import_react69.forwardRef)(
+var import_react70 = require("react");
+var import_jsx_runtime67 = require("react/jsx-runtime");
+var Pagehead = (0, import_react70.forwardRef)(
   ({
     className,
     back,
@@ -12662,26 +12858,26 @@ var Pagehead = (0, import_react69.forwardRef)(
     actions,
     children,
     ...props
-  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("header", { ref, className: cn("aviala-pagehead", className), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "aviala-pagehead__main", children: [
-      back != null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "aviala-pagehead__back", children: back }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "aviala-pagehead__title-block", children: [
-        breadcrumb != null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "aviala-pagehead__breadcrumb", children: breadcrumb }) : null,
-        title != null || description != null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "aviala-pagehead__title", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Typeface, { content: "textCaption", primary: title, secondary: description }) }) : null,
+  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("header", { ref, className: cn("aviala-pagehead", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: "aviala-pagehead__main", children: [
+      back != null ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "aviala-pagehead__back", children: back }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: "aviala-pagehead__title-block", children: [
+        breadcrumb != null ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "aviala-pagehead__breadcrumb", children: breadcrumb }) : null,
+        title != null || description != null ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "aviala-pagehead__title", children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(Typeface, { content: "textCaption", primary: title, secondary: description }) }) : null,
         children
       ] })
     ] }),
-    actions != null ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "aviala-pagehead__actions", children: actions }) : null
+    actions != null ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "aviala-pagehead__actions", children: actions }) : null
   ] })
 );
 Pagehead.displayName = "Pagehead";
 
 // src/components/steps.tsx
-var import_icons22 = require("@aviala-design/icons");
-var import_class_variance_authority16 = require("class-variance-authority");
-var import_react70 = require("react");
-var import_jsx_runtime67 = require("react/jsx-runtime");
-var stepsVariants = (0, import_class_variance_authority16.cva)("aviala-steps", {
+var import_icons23 = require("@aviala-design/icons");
+var import_class_variance_authority17 = require("class-variance-authority");
+var import_react71 = require("react");
+var import_jsx_runtime68 = require("react/jsx-runtime");
+var stepsVariants = (0, import_class_variance_authority17.cva)("aviala-steps", {
   variants: {
     direction: {
       horizontal: "aviala-steps--direction-horizontal",
@@ -12692,8 +12888,8 @@ var stepsVariants = (0, import_class_variance_authority16.cva)("aviala-steps", {
     direction: "horizontal"
   }
 });
-var Steps = (0, import_react70.forwardRef)(
-  ({ className, direction = "horizontal", children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+var Steps = (0, import_react71.forwardRef)(
+  ({ className, direction = "horizontal", children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
     "div",
     {
       ref,
@@ -12708,20 +12904,20 @@ Steps.displayName = "Steps";
 function defaultStepsIconContent(state, index) {
   switch (state) {
     case "done":
-      return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_icons22.SymbolRight, { width: 12, height: 12, thickness: "Bold", "aria-hidden": true });
+      return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_icons23.SymbolRight, { width: 12, height: 12, thickness: "Bold", "aria-hidden": true });
     case "fail":
-      return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_icons22.SymbolWrong, { width: 12, height: 12, thickness: "Bold", "aria-hidden": true });
+      return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_icons23.SymbolWrong, { width: 12, height: 12, thickness: "Bold", "aria-hidden": true });
     case "warning":
-      return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_icons22.SymbolWarning, { width: 12, height: 12, thickness: "Bold", "aria-hidden": true });
+      return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_icons23.SymbolWarning, { width: 12, height: 12, thickness: "Bold", "aria-hidden": true });
     case "waiting":
     case "inProgress":
     case "default":
     default:
-      return index != null ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(Typography, { level: "caption", as: "span", className: "aviala-steps-icon__index", children: index }) : null;
+      return index != null ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Typography, { level: "caption", as: "span", className: "aviala-steps-icon__index", children: index }) : null;
   }
 }
-var StepsIcon = (0, import_react70.forwardRef)(
-  ({ className, state = "default", index, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+var StepsIcon = (0, import_react71.forwardRef)(
+  ({ className, state = "default", index, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
     "span",
     {
       ref,
@@ -12733,7 +12929,7 @@ var StepsIcon = (0, import_react70.forwardRef)(
   )
 );
 StepsIcon.displayName = "StepsIcon";
-var StepsItem = (0, import_react70.forwardRef)(
+var StepsItem = (0, import_react71.forwardRef)(
   ({
     className,
     state = "default",
@@ -12743,7 +12939,7 @@ var StepsItem = (0, import_react70.forwardRef)(
     icon,
     children,
     ...props
-  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
+  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
     "div",
     {
       ref,
@@ -12751,9 +12947,9 @@ var StepsItem = (0, import_react70.forwardRef)(
       "data-state": state,
       ...props,
       children: [
-        icon ?? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(StepsIcon, { state, index }),
-        /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: "aviala-steps-item__body", children: [
-          title != null ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+        icon ?? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(StepsIcon, { state, index }),
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "aviala-steps-item__body", children: [
+          title != null ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
             Typography,
             {
               level: "subtitle",
@@ -12762,7 +12958,7 @@ var StepsItem = (0, import_react70.forwardRef)(
               children: title
             }
           ) : null,
-          description != null ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+          description != null ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
             Typography,
             {
               level: "text",
@@ -12780,9 +12976,9 @@ var StepsItem = (0, import_react70.forwardRef)(
 StepsItem.displayName = "StepsItem";
 
 // src/components/pagination.tsx
-var import_icons23 = require("@aviala-design/icons");
-var import_react71 = require("react");
-var import_jsx_runtime68 = require("react/jsx-runtime");
+var import_icons24 = require("@aviala-design/icons");
+var import_react72 = require("react");
+var import_jsx_runtime69 = require("react/jsx-runtime");
 function buildPageList(page, pageCount) {
   if (pageCount <= 7) {
     return Array.from({ length: pageCount }, (_, index) => index + 1);
@@ -12815,7 +13011,7 @@ function ellipsisRange(pages, index) {
   for (let p = start; p <= end; p += 1) range.push(p);
   return range;
 }
-var Pagination = (0, import_react71.forwardRef)(
+var Pagination = (0, import_react72.forwardRef)(
   ({
     className,
     page: pageProp,
@@ -12835,15 +13031,15 @@ var Pagination = (0, import_react71.forwardRef)(
   }, ref) => {
     const locale = useLocaleMessages("Pagination");
     const rtl = useRtl();
-    const PrevIcon = rtl ? import_icons23.DirectionArrowRightLight : import_icons23.DirectionArrowLeftLight;
-    const NextIcon = rtl ? import_icons23.DirectionArrowLeftLight : import_icons23.DirectionArrowRightLight;
+    const PrevIcon = rtl ? import_icons24.DirectionArrowRightLight : import_icons24.DirectionArrowLeftLight;
+    const NextIcon = rtl ? import_icons24.DirectionArrowLeftLight : import_icons24.DirectionArrowRightLight;
     const resolvedJumpLabel = jumpLabel ?? locale.jumpTo;
     const resolvedSizeLabel = sizeLabel ?? locale.pageSize;
     const resolvedSizeOptionLabel = sizeOptionLabel ?? ((size) => interpolate(locale.items, { size }));
-    const [uncontrolledPage, setUncontrolledPage] = (0, import_react71.useState)(defaultPage);
-    const [uncontrolledPageSize, setUncontrolledPageSize] = (0, import_react71.useState)(defaultPageSize);
-    const [jumpValue, setJumpValue] = (0, import_react71.useState)("");
-    const [openEllipsis, setOpenEllipsis] = (0, import_react71.useState)(null);
+    const [uncontrolledPage, setUncontrolledPage] = (0, import_react72.useState)(defaultPage);
+    const [uncontrolledPageSize, setUncontrolledPageSize] = (0, import_react72.useState)(defaultPageSize);
+    const [jumpValue, setJumpValue] = (0, import_react72.useState)("");
+    const [openEllipsis, setOpenEllipsis] = (0, import_react72.useState)(null);
     const page = pageProp ?? uncontrolledPage;
     const pageSize = pageSizeProp ?? uncontrolledPageSize;
     const safePageCount = Math.max(1, pageCount);
@@ -12864,7 +13060,7 @@ var Pagination = (0, import_react71.forwardRef)(
       setPage(parsed);
       setJumpValue("");
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
       "div",
       {
         ref,
@@ -12873,8 +13069,8 @@ var Pagination = (0, import_react71.forwardRef)(
         "aria-label": props["aria-label"] ?? locale.pagination,
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "aviala-pagination__controls", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "aviala-pagination__controls", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
               Button,
               {
                 mode: "noBackgroundCustom",
@@ -12882,18 +13078,18 @@ var Pagination = (0, import_react71.forwardRef)(
                 iconOnly: true,
                 "aria-label": locale.previous,
                 disabled: currentPage <= 1,
-                leftIcon: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(PrevIcon, { "aria-hidden": true }),
+                leftIcon: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(PrevIcon, { "aria-hidden": true }),
                 onClick: () => setPage(currentPage - 1)
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "aviala-pagination__pages", children: pages.map(
-              (item, index) => item === "ellipsis" ? /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "aviala-pagination__pages", children: pages.map(
+              (item, index) => item === "ellipsis" ? /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
                 Popover,
                 {
                   open: openEllipsis === index,
                   onOpenChange: (open) => setOpenEllipsis(open ? index : null),
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
                       "button",
                       {
                         type: "button",
@@ -12904,10 +13100,10 @@ var Pagination = (0, import_react71.forwardRef)(
                         ),
                         "aria-label": locale.morePages,
                         "aria-haspopup": "menu",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Typography, { level: "text", as: "span", children: "\u2026" })
+                        children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Typography, { level: "text", as: "span", children: "\u2026" })
                       }
                     ) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(PopoverContent, { className: "aviala-pagination__ellipsis-content", showArrow: true, flush: true, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "aviala-pagination__ellipsis-menu", children: ellipsisRange(pages, index).map((p) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(PopoverContent, { className: "aviala-pagination__ellipsis-content", showArrow: true, flush: true, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "aviala-pagination__ellipsis-menu", children: ellipsisRange(pages, index).map((p) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
                       "button",
                       {
                         type: "button",
@@ -12920,14 +13116,14 @@ var Pagination = (0, import_react71.forwardRef)(
                           setPage(p);
                           setOpenEllipsis(null);
                         },
-                        children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Typography, { level: "text", as: "span", children: p })
+                        children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Typography, { level: "text", as: "span", children: p })
                       },
                       p
                     )) }) })
                   ]
                 },
                 `ellipsis-${index}`
-              ) : /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+              ) : /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
                 "button",
                 {
                   type: "button",
@@ -12939,12 +13135,12 @@ var Pagination = (0, import_react71.forwardRef)(
                   "data-active": item === currentPage ? "true" : void 0,
                   "aria-current": item === currentPage ? "page" : void 0,
                   onClick: () => setPage(item),
-                  children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Typography, { level: "text", as: "span", children: item })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Typography, { level: "text", as: "span", children: item })
                 },
                 item
               )
             ) }),
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
               Button,
               {
                 mode: "noBackgroundCustom",
@@ -12952,14 +13148,14 @@ var Pagination = (0, import_react71.forwardRef)(
                 iconOnly: true,
                 "aria-label": locale.next,
                 disabled: currentPage >= safePageCount,
-                leftIcon: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(NextIcon, { "aria-hidden": true }),
+                leftIcon: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(NextIcon, { "aria-hidden": true }),
                 onClick: () => setPage(currentPage + 1)
               }
             )
           ] }),
-          showJump ? /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "aviala-pagination__jump", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Typography, { level: "text", as: "span", children: resolvedJumpLabel }),
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+          showJump ? /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "aviala-pagination__jump", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Typography, { level: "text", as: "span", children: resolvedJumpLabel }),
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
               Input,
               {
                 className: "aviala-pagination__jump-input",
@@ -12979,15 +13175,15 @@ var Pagination = (0, import_react71.forwardRef)(
               }
             )
           ] }) : null,
-          showSizeChanger ? /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "aviala-pagination__size", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Typography, { level: "text", as: "span", children: resolvedSizeLabel }),
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+          showSizeChanger ? /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "aviala-pagination__size", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Typography, { level: "text", as: "span", children: resolvedSizeLabel }),
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
               Select,
               {
                 value: String(pageSize),
                 onValueChange: (value) => setPageSize(Number(value)),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
                     SelectTrigger,
                     {
                       size: "regular",
@@ -12995,7 +13191,7 @@ var Pagination = (0, import_react71.forwardRef)(
                       "aria-label": locale.pageSizeAria
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(SelectContent, { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(SelectItemGroup, { children: pageSizeOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(SelectContent, { children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(SelectItemGroup, { children: pageSizeOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
                     SelectItem,
                     {
                       value: String(option),
@@ -13016,16 +13212,16 @@ var Pagination = (0, import_react71.forwardRef)(
 Pagination.displayName = "Pagination";
 
 // src/components/card.tsx
-var import_icons24 = require("@aviala-design/icons");
-var import_react72 = require("react");
-var import_jsx_runtime69 = require("react/jsx-runtime");
-var Card = (0, import_react72.forwardRef)(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { ref, className: cn("aviala-card", className), ...props, children })
+var import_icons25 = require("@aviala-design/icons");
+var import_react73 = require("react");
+var import_jsx_runtime70 = require("react/jsx-runtime");
+var Card = (0, import_react73.forwardRef)(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { ref, className: cn("aviala-card", className), ...props, children })
 );
 Card.displayName = "Card";
 function renderCardIcon(node) {
   if (!node) return null;
-  const content = (0, import_react72.isValidElement)(node) && typeof node.type !== "string" ? (0, import_react72.cloneElement)(node, {
+  const content = (0, import_react73.isValidElement)(node) && typeof node.type !== "string" ? (0, import_react73.cloneElement)(node, {
     width: 14,
     height: 14,
     className: cn(
@@ -13033,9 +13229,9 @@ function renderCardIcon(node) {
       "shrink-0"
     )
   }) : node;
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "aviala-card-head__icon", children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "aviala-card-head__icon", children: content });
 }
-var CardHead = (0, import_react72.forwardRef)(
+var CardHead = (0, import_react73.forwardRef)(
   ({
     className,
     slotType = "select",
@@ -13053,39 +13249,39 @@ var CardHead = (0, import_react72.forwardRef)(
   }, ref) => {
     const locale = useLocaleMessages("Card");
     const rtl = useRtl();
-    const ChevronIcon = rtl ? import_icons24.DirectionArrowLeftLight : import_icons24.DirectionArrowRightLight;
-    const primaryAction = action ?? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Button, { mode: "primary", size: "regular", leftIcon: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_icons24.GeneralSetting, { "aria-hidden": true }), children: actionLabel });
+    const ChevronIcon = rtl ? import_icons25.DirectionArrowLeftLight : import_icons25.DirectionArrowRightLight;
+    const primaryAction = action ?? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Button, { mode: "primary", size: "regular", leftIcon: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_icons25.GeneralSetting, { "aria-hidden": true }), children: actionLabel });
     const renderTrailing = () => {
       if (trailing !== void 0) return trailing;
       switch (slotType) {
         case "action":
-          return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "aviala-card-head__trailing", children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "aviala-card-head__trailing", children: [
             primaryAction,
-            secondaryAction ?? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+            secondaryAction ?? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
               Button,
               {
                 mode: "default",
                 size: "regular",
                 iconOnly: true,
                 "aria-label": locale.more,
-                leftIcon: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_icons24.GeneralSetting, { "aria-hidden": true })
+                leftIcon: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_icons25.GeneralSetting, { "aria-hidden": true })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "aviala-card__divider", "aria-hidden": true }),
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ChevronIcon, { width: 14, height: 14, "aria-hidden": true })
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "aviala-card__divider", "aria-hidden": true }),
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ChevronIcon, { width: 14, height: 14, "aria-hidden": true })
           ] });
         case "switch":
-          return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "aviala-card-head__trailing", children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "aviala-card-head__trailing", children: [
             primaryAction,
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "aviala-card__divider", "aria-hidden": true }),
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Switch, { ...switchProps })
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "aviala-card__divider", "aria-hidden": true }),
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Switch, { ...switchProps })
           ] });
         case "select":
         default:
-          return select != null ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "aviala-card-head__trailing", children: select }) : null;
+          return select != null ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "aviala-card-head__trailing", children: select }) : null;
       }
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
       "div",
       {
         ref,
@@ -13093,9 +13289,9 @@ var CardHead = (0, import_react72.forwardRef)(
         "data-type": slotType,
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "aviala-card-head__main", children: [
-            renderCardIcon(icon ?? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_icons24.GeneralSetting, { "aria-hidden": true })),
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "aviala-card-head__title", children: title != null || description != null ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Typeface, { content: "textCaption", primary: title, secondary: description }) : children })
+          /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "aviala-card-head__main", children: [
+            renderCardIcon(icon ?? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_icons25.GeneralSetting, { "aria-hidden": true })),
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "aviala-card-head__title", children: title != null || description != null ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Typeface, { content: "textCaption", primary: title, secondary: description }) : children })
           ] }),
           renderTrailing()
         ]
@@ -13104,11 +13300,11 @@ var CardHead = (0, import_react72.forwardRef)(
   }
 );
 CardHead.displayName = "CardHead";
-var CardBody = (0, import_react72.forwardRef)(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { ref, className: cn("aviala-card-body", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "aviala-card-body__content", children: typeof children === "string" || typeof children === "number" ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Typography, { level: "text", as: "span", children }) : children }) })
+var CardBody = (0, import_react73.forwardRef)(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { ref, className: cn("aviala-card-body", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "aviala-card-body__content", children: typeof children === "string" || typeof children === "number" ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Typography, { level: "text", as: "span", children }) : children }) })
 );
 CardBody.displayName = "CardBody";
-var CardBottom = (0, import_react72.forwardRef)(
+var CardBottom = (0, import_react73.forwardRef)(
   ({
     className,
     slotType = "action",
@@ -13123,47 +13319,47 @@ var CardBottom = (0, import_react72.forwardRef)(
   }, ref) => {
     const locale = useLocaleMessages("Card");
     const rtl = useRtl();
-    const ChevronIcon = rtl ? import_icons24.DirectionArrowLeftLight : import_icons24.DirectionArrowRightLight;
-    const primaryAction = action ?? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Button, { mode: "primary", size: "regular", leftIcon: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_icons24.GeneralSetting, { "aria-hidden": true }), children: actionLabel });
+    const ChevronIcon = rtl ? import_icons25.DirectionArrowLeftLight : import_icons25.DirectionArrowRightLight;
+    const primaryAction = action ?? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Button, { mode: "primary", size: "regular", leftIcon: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_icons25.GeneralSetting, { "aria-hidden": true }), children: actionLabel });
     const renderTrailing = () => {
       if (trailing !== void 0) return trailing;
       if (children != null) return children;
       switch (slotType) {
         case "switch":
-          return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_jsx_runtime69.Fragment, { children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
             primaryAction,
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "aviala-card__divider", "aria-hidden": true }),
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Switch, { ...switchProps })
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "aviala-card__divider", "aria-hidden": true }),
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Switch, { ...switchProps })
           ] });
         case "select":
           return select;
         case "action":
         default:
-          return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_jsx_runtime69.Fragment, { children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
             primaryAction,
-            secondaryAction ?? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+            secondaryAction ?? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
               Button,
               {
                 mode: "default",
                 size: "regular",
                 iconOnly: true,
                 "aria-label": locale.more,
-                leftIcon: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_icons24.GeneralSetting, { "aria-hidden": true })
+                leftIcon: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_icons25.GeneralSetting, { "aria-hidden": true })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("span", { className: "aviala-card__divider", "aria-hidden": true }),
-            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ChevronIcon, { width: 14, height: 14, "aria-hidden": true })
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "aviala-card__divider", "aria-hidden": true }),
+            /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ChevronIcon, { width: 14, height: 14, "aria-hidden": true })
           ] });
       }
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
       "div",
       {
         ref,
         className: cn("aviala-card-bottom", className),
         "data-type": slotType,
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "aviala-card-bottom__trailing", children: renderTrailing() })
+        children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "aviala-card-bottom__trailing", children: renderTrailing() })
       }
     );
   }
@@ -13171,10 +13367,10 @@ var CardBottom = (0, import_react72.forwardRef)(
 CardBottom.displayName = "CardBottom";
 
 // src/components/table.tsx
-var import_react73 = require("react");
-var import_jsx_runtime70 = require("react/jsx-runtime");
-var Table = (0, import_react73.forwardRef)(
-  ({ className, stickyHeader = false, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+var import_react74 = require("react");
+var import_jsx_runtime71 = require("react/jsx-runtime");
+var Table = (0, import_react74.forwardRef)(
+  ({ className, stickyHeader = false, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
     "div",
     {
       ref,
@@ -13187,8 +13383,8 @@ var Table = (0, import_react73.forwardRef)(
   )
 );
 Table.displayName = "Table";
-var TableRow = (0, import_react73.forwardRef)(
-  ({ className, header = false, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+var TableRow = (0, import_react74.forwardRef)(
+  ({ className, header = false, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
     "div",
     {
       ref,
@@ -13203,7 +13399,7 @@ var TableRow = (0, import_react73.forwardRef)(
 TableRow.displayName = "TableRow";
 function renderCellIcon(node, sized = true) {
   if (!node) return null;
-  const content = sized && (0, import_react73.isValidElement)(node) && typeof node.type !== "string" ? (0, import_react73.cloneElement)(node, {
+  const content = sized && (0, import_react74.isValidElement)(node) && typeof node.type !== "string" ? (0, import_react74.cloneElement)(node, {
     width: 16,
     height: 16,
     className: cn(
@@ -13211,39 +13407,39 @@ function renderCellIcon(node, sized = true) {
       "shrink-0"
     )
   }) : node;
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "aviala-table-cell__icon", children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "aviala-table-cell__icon", children: content });
 }
 function renderTextBlock(text, caption) {
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("span", { className: "aviala-table-cell__text", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Typography, { level: "text", as: "span", children: text }),
-    caption != null && caption !== false ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Typography, { level: "caption", as: "span", className: "aviala-table-cell__caption", children: caption }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("span", { className: "aviala-table-cell__text", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Typography, { level: "text", as: "span", children: text }),
+    caption != null && caption !== false ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Typography, { level: "caption", as: "span", className: "aviala-table-cell__caption", children: caption }) : null
   ] });
 }
 function renderActions(actions) {
   if (actions == null) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "aviala-table-cell__actions", children: actions });
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "aviala-table-cell__actions", children: actions });
 }
 function renderCellBody(main, actions) {
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("span", { className: "aviala-table-cell__body", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "aviala-table-cell__main", children: main }),
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("span", { className: "aviala-table-cell__body", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "aviala-table-cell__main", children: main }),
     renderActions(actions)
   ] });
 }
-var TableHead = (0, import_react73.forwardRef)(
+var TableHead = (0, import_react74.forwardRef)(
   ({ className, content = "text", actions, checkboxProps, children, ...props }, ref) => {
     const renderBody = () => {
       if (content === "checkbox") {
-        return children ?? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Checkbox, { ...checkboxProps });
+        return children ?? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Checkbox, { ...checkboxProps });
       }
       if (children != null) {
-        return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "aviala-table-cell__main", children: typeof children === "string" || typeof children === "number" ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Typography, { level: "text", as: "span", children }) : children }),
+        return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "aviala-table-cell__main", children: typeof children === "string" || typeof children === "number" ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Typography, { level: "text", as: "span", children }) : children }),
           renderActions(actions)
         ] });
       }
       return null;
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
       "div",
       {
         ref,
@@ -13257,7 +13453,7 @@ var TableHead = (0, import_react73.forwardRef)(
   }
 );
 TableHead.displayName = "TableHead";
-var TableCell = (0, import_react73.forwardRef)(
+var TableCell = (0, import_react74.forwardRef)(
   ({
     className,
     content = "text",
@@ -13279,16 +13475,16 @@ var TableCell = (0, import_react73.forwardRef)(
       if (children != null) return children;
       switch (content) {
         case "checkbox":
-          return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Checkbox, { ...checkboxProps });
+          return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Checkbox, { ...checkboxProps });
         case "switch":
-          return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Switch, { ...switchProps });
+          return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Switch, { ...switchProps });
         case "action":
           return renderActions(actions);
         case "icon+text":
-          return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
             grabber,
             renderCellBody(
-              /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
                 renderCellIcon(icon),
                 renderTextBlock(text, caption)
               ] }),
@@ -13296,44 +13492,44 @@ var TableCell = (0, import_react73.forwardRef)(
             )
           ] });
         case "icon-place+text":
-          return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
             grabber,
             renderCellBody(
-              /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "aviala-table-cell__icon-place", children: iconPlace ?? renderCellIcon(icon, false) ?? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Avatar, { content: "text", level: "text", lineHeightFix: false, children: "A" }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "aviala-table-cell__icon-place", children: iconPlace ?? renderCellIcon(icon, false) ?? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Avatar, { content: "text", level: "text", lineHeightFix: false, children: "A" }) }),
                 renderTextBlock(text, caption)
               ] }),
               actions
             )
           ] });
         case "people":
-          return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
             grabber,
             renderCellBody(
-              /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
-                people ?? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Avatar, { content: "text", level: "text", lineHeightFix: false, children: "A" }),
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+                people ?? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Avatar, { content: "text", level: "text", lineHeightFix: false, children: "A" }),
                 renderTextBlock(text, caption)
               ] }),
               actions
             )
           ] });
         case "badge":
-          return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
             grabber,
             renderCellBody(
-              badge ?? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(Badge, { style: "theme", level: "caption", children: badgeLabel ?? "Text" }),
+              badge ?? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Badge, { style: "theme", level: "caption", children: badgeLabel ?? "Text" }),
               actions
             )
           ] });
         case "text":
         default:
-          return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
             grabber,
             renderCellBody(renderTextBlock(text, caption), actions)
           ] });
       }
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
       "div",
       {
         ref,
@@ -13394,6 +13590,18 @@ TableCell.displayName = "TableCell";
   DatePickerContent,
   DatePickerField,
   DatePickerTrigger,
+  Drawer,
+  DrawerBody,
+  DrawerClose,
+  DrawerContent,
+  DrawerDescription,
+  DrawerFooter,
+  DrawerHeader,
+  DrawerHeaderText,
+  DrawerOverlay,
+  DrawerPortal,
+  DrawerTitle,
+  DrawerTrigger,
   Feedback,
   Fieldset,
   Form,
@@ -13509,6 +13717,7 @@ TableCell.displayName = "TableCell";
   backChevronSide,
   buttonVariants,
   cn,
+  drawerContentVariants,
   enUS,
   formatDisplayDate,
   formatMonthYear,