@marigold/components 11.4.0 → 11.4.1

package/dist/index.js

@@ -903,7 +903,7 @@ __export(index_exports, {
   Popover: () => _Popover,
   Radio: () => _Radio,
   RadioGroup: () => _RadioGroup,
-  RouterProvider: () => import_react_aria_components68.RouterProvider,
+  RouterProvider: () => import_react_aria_components69.RouterProvider,
   Scrollable: () => Scrollable,
   SearchField: () => _SearchField,
   SectionMessage: () => SectionMessage,
@@ -1397,7 +1397,7 @@ var import_react_aria_components9 = require("react-aria-components");
 var import_jsx_runtime14 = require("react/jsx-runtime");
 var _ListBoxItem = ({ ...props }) => {
   const { classNames: classNames3 } = useListBoxContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_aria_components9.ListBoxItem, { ...props, className: classNames3.option });
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_aria_components9.ListBoxItem, { ...props, className: classNames3.item });
 };
 
 // src/ListBox/ListBoxSection.tsx
@@ -2180,101 +2180,14 @@ var Container = ({
 );
 
 // src/Dialog/Dialog.tsx
-var import_react26 = require("react");
+var import_react28 = require("react");
 var import_react_aria_components25 = require("react-aria-components");
-var import_system40 = require("@marigold/system");
-
-// src/Dialog/DialogActions.tsx
-var import_system35 = require("@marigold/system");
-var import_jsx_runtime39 = require("react/jsx-runtime");
-var DialogActions = ({ variant, size: size2, children }) => {
-  const classNames3 = (0, import_system35.useClassNames)({ component: "Dialog", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: (0, import_system35.cn)("[grid-area:actions]", classNames3.actions), children });
-};
-
-// src/Dialog/DialogContent.tsx
-var import_system36 = require("@marigold/system");
-var import_jsx_runtime40 = require("react/jsx-runtime");
-var DialogContent = ({
-  variant,
-  size: size2,
-  children
-}) => {
-  const classNames3 = (0, import_system36.useClassNames)({ component: "Dialog", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: (0, import_system36.cn)("[grid-area:content]", classNames3.content), children });
-};
-
-// src/Dialog/DialogTitle.tsx
-var import_system39 = require("@marigold/system");
-
-// src/Header/Header.tsx
-var import_react_aria_components21 = require("react-aria-components");
-var import_system37 = require("@marigold/system");
-var import_jsx_runtime41 = require("react/jsx-runtime");
-var _Header = ({ variant, size: size2, ...props }) => {
-  const classNames3 = (0, import_system37.useClassNames)({
-    component: "Header",
-    variant,
-    size: size2
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react_aria_components21.Header, { className: classNames3, ...props, children: props.children });
-};
-
-// src/Headline/Headline.tsx
-var import_react_aria_components22 = require("react-aria-components");
 var import_system38 = require("@marigold/system");
-var import_jsx_runtime42 = require("react/jsx-runtime");
-var _Headline = ({
-  variant,
-  size: size2,
-  children,
-  align = "left",
-  color,
-  level = "1",
-  ...props
-}) => {
-  const classNames3 = (0, import_system38.useClassNames)({
-    component: "Headline",
-    variant,
-    size: size2 != null ? size2 : `level-${level}`
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-    import_react_aria_components22.Heading,
-    {
-      level: Number(level),
-      ...props,
-      className: (0, import_system38.cn)(
-        classNames3,
-        "max-w-(--maxHeadlineWidth)",
-        // possibly set by a <Container>
-        import_system38.textAlign[align]
-      ),
-      style: { color: color && (0, import_system38.ensureCssVar)(color, "color") },
-      children
-    }
-  );
-};
-
-// src/Dialog/DialogTitle.tsx
-var import_jsx_runtime43 = require("react/jsx-runtime");
-var DialogTitle = ({
-  level = "2",
-  variant,
-  size: size2,
-  children
-}) => {
-  const classNames3 = (0, import_system39.useClassNames)({ component: "Dialog", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(_Header, { className: (0, import_system39.cn)("[grid-area:title]", classNames3.header), children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(_Headline, { slot: "title", level, children }) });
-};
-
-// src/Dialog/DialogTrigger.tsx
-var import_react25 = require("react");
-var import_react_aria_components24 = require("react-aria-components");
 
 // src/Overlay/Modal.tsx
 var import_react24 = require("react");
-var import_react_aria_components23 = require("react-aria-components");
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_react_aria_components21 = require("react-aria-components");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var _Modal = (0, import_react24.forwardRef)(({ open, dismissable, keyboardDismissable, ...rest }, ref) => {
   const props = {
     isOpen: open,
@@ -2282,15 +2195,15 @@ var _Modal = (0, import_react24.forwardRef)(({ open, dismissable, keyboardDismis
     isKeyboardDismissDisabled: keyboardDismissable,
     ...rest
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
     Underlay,
     {
       dismissable,
       keyboardDismissable,
       open,
       variant: "modal",
-      children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
-        import_react_aria_components23.Modal,
+      children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+        import_react_aria_components21.Modal,
         {
           ref,
           className: "relative flex w-full justify-center",
@@ -2302,52 +2215,229 @@ var _Modal = (0, import_react24.forwardRef)(({ open, dismissable, keyboardDismis
   );
 });
 
+// src/Overlay/NonModal.tsx
+var import_react26 = require("react");
+var import_react_aria_components22 = require("react-aria-components");
+var import_react_stately = require("react-stately");
+var import_focus = require("@react-aria/focus");
+var import_overlays2 = require("@react-aria/overlays");
+var import_ssr2 = require("@react-aria/ssr");
+var import_utils = require("@react-aria/utils");
+
+// src/utils/useRenderProps.tsx
+var import_react25 = require("react");
+function useRenderProps(props) {
+  let {
+    className,
+    style,
+    children,
+    defaultClassName = void 0,
+    defaultChildren = void 0,
+    defaultStyle,
+    values
+  } = props;
+  return (0, import_react25.useMemo)(() => {
+    let computedClassName;
+    let computedStyle;
+    let computedChildren;
+    if (typeof className === "function") {
+      computedClassName = className({ ...values, defaultClassName });
+    } else {
+      computedClassName = className;
+    }
+    if (typeof style === "function") {
+      computedStyle = style({ ...values, defaultStyle: defaultStyle || {} });
+    } else {
+      computedStyle = style;
+    }
+    if (typeof children === "function") {
+      computedChildren = children({ ...values, defaultChildren });
+    } else if (children == null) {
+      computedChildren = defaultChildren;
+    } else {
+      computedChildren = children;
+    }
+    return {
+      className: computedClassName != null ? computedClassName : defaultClassName,
+      style: computedStyle || defaultStyle ? { ...defaultStyle, ...computedStyle } : void 0,
+      children: computedChildren != null ? computedChildren : defaultChildren,
+      "data-rac": ""
+    };
+  }, [
+    className,
+    style,
+    children,
+    defaultClassName,
+    defaultChildren,
+    defaultStyle,
+    values
+  ]);
+}
+
+// src/Overlay/useNonModal.ts
+var import_overlays = require("@react-aria/overlays");
+var useNonModal = ({ nonModalRef, keyboardDismissable = true }, state) => {
+  let { overlayProps } = (0, import_overlays.useOverlay)(
+    {
+      isOpen: state.isOpen,
+      onClose: state.close,
+      shouldCloseOnBlur: false,
+      isDismissable: false,
+      isKeyboardDismissDisabled: keyboardDismissable ? false : true
+    },
+    nonModalRef
+  );
+  return {
+    nonModalProps: overlayProps
+  };
+};
+
+// src/Overlay/NonModal.tsx
+var import_jsx_runtime40 = require("react/jsx-runtime");
+var NonModalInner = ({ state, isExiting, ...props }) => {
+  const { nonModalProps } = useNonModal(props, state);
+  const ref = props.nonModalRef;
+  const portalContainer = usePortalContainer();
+  const isEntering = (0, import_utils.useEnterAnimation)(ref) || props.isEntering || false;
+  const renderProps = useRenderProps({
+    ...props,
+    defaultClassName: "react-aria-NonModalOverlay",
+    values: {
+      isEntering,
+      isExiting,
+      state
+    }
+  });
+  const viewport = (0, import_utils.useViewportSize)();
+  const style = {
+    ...renderProps.style,
+    "--visual-viewport-height": viewport.height + "px"
+  };
+  const overlay = /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+    "div",
+    {
+      ...(0, import_utils.mergeProps)((0, import_utils.filterDOMProps)(props), nonModalProps),
+      ...renderProps,
+      tabIndex: -1,
+      "aria-label": props["aria-label"],
+      "aria-labelledby": props["aria-labelledby"],
+      ref,
+      slot: props.slot || void 0,
+      style,
+      "data-entering": isEntering || void 0,
+      "data-exiting": isExiting || void 0,
+      children: [
+        renderProps.children,
+        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_overlays2.DismissButton, { onDismiss: state.close })
+      ]
+    }
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+    import_overlays2.Overlay,
+    {
+      isExiting,
+      portalContainer,
+      disableFocusManagement: true,
+      children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_focus.FocusScope, { restoreFocus: true, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react_aria_components22.Provider, { values: [[import_react_aria_components22.OverlayTriggerStateContext, state]], children: overlay }) })
+    }
+  );
+};
+var NonModal = (0, import_react26.forwardRef)(
+  ({ open, ...rest }, ref) => {
+    const props = {
+      isOpen: open,
+      ...rest
+    };
+    ref = (0, import_utils.useObjectRef)(ref);
+    const contextState = (0, import_react26.useContext)(import_react_aria_components22.OverlayTriggerStateContext);
+    const localState = (0, import_react_stately.useOverlayTriggerState)(props);
+    const state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;
+    const isExiting = (0, import_utils.useExitAnimation)(ref, state.isOpen) || props.isExiting || false;
+    const isSSR = (0, import_ssr2.useIsSSR)();
+    if (state && !state.isOpen && !isExiting || isSSR) {
+      return null;
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+      NonModalInner,
+      {
+        ...props,
+        nonModalRef: ref,
+        state,
+        isExiting
+      }
+    );
+  }
+);
+
+// src/Dialog/DialogActions.tsx
+var import_system35 = require("@marigold/system");
+var import_jsx_runtime41 = require("react/jsx-runtime");
+var DialogActions = ({ variant, size: size2, children }) => {
+  const classNames3 = (0, import_system35.useClassNames)({ component: "Dialog", variant, size: size2 });
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: (0, import_system35.cn)("[grid-area:actions]", classNames3.actions), children });
+};
+
+// src/Dialog/DialogContent.tsx
+var import_system36 = require("@marigold/system");
+var import_jsx_runtime42 = require("react/jsx-runtime");
+var DialogContent = ({
+  variant,
+  size: size2,
+  children
+}) => {
+  const classNames3 = (0, import_system36.useClassNames)({ component: "Dialog", variant, size: size2 });
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: (0, import_system36.cn)("[grid-area:content]", classNames3.content), children });
+};
+
+// src/Dialog/DialogTitle.tsx
+var import_react_aria_components23 = require("react-aria-components");
+var import_system37 = require("@marigold/system");
+var import_jsx_runtime43 = require("react/jsx-runtime");
+var DialogTitle = ({ variant, size: size2, children }) => {
+  const classNames3 = (0, import_system37.useClassNames)({
+    component: "Dialog",
+    variant,
+    size: size2
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react_aria_components23.Header, { className: (0, import_system37.cn)("[grid-area:title]", classNames3.header), children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react_aria_components23.Heading, { slot: "title", className: classNames3.title, children }) });
+};
+
 // src/Dialog/DialogTrigger.tsx
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_react27 = require("react");
+var import_react_aria_components24 = require("react-aria-components");
+var import_interactions = require("@react-aria/interactions");
+var import_jsx_runtime44 = require("react/jsx-runtime");
+var DialogContext = (0, import_react27.createContext)({});
 var _DialogTrigger = ({
   open,
   dismissable,
   keyboardDismissable,
-  isNonModal,
+  size: size2,
   ...rest
 }) => {
   const props = {
     isOpen: open,
+    isDismissable: dismissable,
+    isKeyboardDismissDisabled: !keyboardDismissable,
     ...rest
   };
-  const children = import_react25.Children.toArray(props.children);
-  const [dialogTrigger, dialog] = children;
-  const hasDialogTrigger = dialogTrigger.type !== _Dialog;
-  const currentDialog = children.length < 2 ? !hasDialogTrigger && dialogTrigger : dialog;
-  if (isNonModal)
-    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react_aria_components24.DialogTrigger, { ...props, children: props.children });
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_react_aria_components24.DialogTrigger, { ...props, children: [
-    hasDialogTrigger && dialogTrigger,
-    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
-      _Modal,
-      {
-        dismissable,
-        keyboardDismissable,
-        children: currentDialog
-      }
-    )
-  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(DialogContext.Provider, { value: props, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react_aria_components24.DialogTrigger, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_interactions.PressResponder, { isPressed: false, children: props.children }) }) });
 };
 
 // src/Dialog/Dialog.tsx
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var CloseButton = ({ className }) => {
-  const ctx = (0, import_react26.useContext)(import_react_aria_components25.OverlayTriggerStateContext);
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  const ctx = (0, import_react28.useContext)(import_react_aria_components25.OverlayTriggerStateContext);
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
     "button",
     {
-      className: (0, import_system40.cn)(
+      className: (0, import_system38.cn)(
         "h-4 w-4 cursor-pointer border-none p-0 leading-normal outline-0",
         className
       ),
       onClick: ctx == null ? void 0 : ctx.close,
       slot: "dismiss-button",
-      children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("svg", { viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("svg", { viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
         "path",
         {
           fillRule: "evenodd",
@@ -2358,36 +2448,46 @@ var CloseButton = ({ className }) => {
     }
   );
 };
-var _Dialog = ({
-  variant,
-  size: size2,
-  closeButton,
-  isNonModal,
-  ...props
-}) => {
-  var _a;
-  const classNames3 = (0, import_system40.useClassNames)({ component: "Dialog", variant, size: size2 });
-  const state = (0, import_react26.useContext)(import_react_aria_components25.OverlayTriggerStateContext);
-  const children = typeof props.children === "function" ? props.children({
-    close: (_a = state == null ? void 0 : state.close) != null ? _a : () => {
-    }
-  }) : props.children;
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
-    import_react_aria_components25.Dialog,
-    {
-      ...props,
-      className: (0, import_system40.cn)(
-        "relative outline-hidden [&>*:not(:last-child)]:mb-4",
-        "grid [grid-template-areas:'title'_'content'_'actions']",
-        classNames3.container
-      ),
-      children: [
-        closeButton && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(CloseButton, { className: classNames3.closeButton }),
-        children
-      ]
-    }
-  );
-};
+var _Dialog = (0, import_react28.forwardRef)(
+  (props, ref) => {
+    var _a;
+    const classNames3 = (0, import_system38.useClassNames)({
+      component: "Dialog",
+      variant: props.variant,
+      size: props.size
+    });
+    const { isDismissable, isKeyboardDismissDisabled, isOpen } = (0, import_react28.useContext)(DialogContext);
+    const state = (0, import_react28.useContext)(import_react_aria_components25.OverlayTriggerStateContext);
+    const children = typeof props.children === "function" ? props.children({
+      close: (_a = state == null ? void 0 : state.close) != null ? _a : () => {
+      }
+    }) : props.children;
+    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+      _Modal,
+      {
+        dismissable: isDismissable,
+        keyboardDismissable: isKeyboardDismissDisabled,
+        open: isOpen,
+        children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
+          import_react_aria_components25.Dialog,
+          {
+            ...props,
+            ref,
+            className: (0, import_system38.cn)(
+              "relative outline-hidden [&>*:not(:last-child)]:mb-4",
+              "grid [grid-template-areas:'title'_'content'_'actions']",
+              classNames3.container
+            ),
+            children: [
+              props.closeButton && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(CloseButton, { className: classNames3.closeButton }),
+              children
+            ]
+          }
+        )
+      }
+    );
+  }
+);
 _Dialog.Trigger = _DialogTrigger;
 _Dialog.Title = DialogTitle;
 _Dialog.Content = DialogContent;
@@ -2395,33 +2495,33 @@ _Dialog.Actions = DialogActions;
 
 // src/Divider/Divider.tsx
 var import_react_aria_components26 = require("react-aria-components");
-var import_system41 = require("@marigold/system");
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_system39 = require("@marigold/system");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 var _Divider = ({ variant, ...props }) => {
-  const classNames3 = (0, import_system41.useClassNames)({ component: "Divider", variant });
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react_aria_components26.Separator, { className: (0, import_system41.cn)("border-none", classNames3), ...props });
+  const classNames3 = (0, import_system39.useClassNames)({ component: "Divider", variant });
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_react_aria_components26.Separator, { className: (0, import_system39.cn)("border-none", classNames3), ...props });
 };
 
 // src/Footer/Footer.tsx
-var import_system42 = require("@marigold/system");
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_system40 = require("@marigold/system");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 var Footer = ({ children, variant, size: size2, ...props }) => {
-  const classNames3 = (0, import_system42.useClassNames)({ component: "Footer", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("footer", { ...props, className: classNames3, children });
+  const classNames3 = (0, import_system40.useClassNames)({ component: "Footer", variant, size: size2 });
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("footer", { ...props, className: classNames3, children });
 };
 
 // src/Form/Form.tsx
 var import_react_aria_components27 = require("react-aria-components");
 
 // src/Grid/Grid.tsx
-var import_system43 = require("@marigold/system");
+var import_system41 = require("@marigold/system");
 
 // src/Grid/GridArea.tsx
-var import_jsx_runtime49 = require("react/jsx-runtime");
-var GridArea = ({ name, children }) => /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { style: { gridArea: name }, children });
+var import_jsx_runtime48 = require("react/jsx-runtime");
+var GridArea = ({ name, children }) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { style: { gridArea: name }, children });
 
 // src/Grid/Grid.tsx
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var parseGridAreas = (areas) => areas.map((area) => `"${area}"`).join("\n");
 var parseTemplateValue = (values) => values.map((val) => typeof val === "number" ? `${val}fr` : val).join(" ");
 var Grid = ({
@@ -2433,10 +2533,10 @@ var Grid = ({
   space = 0,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
     "div",
     {
-      className: (0, import_system43.cn)("grid", import_system43.gapSpace[space], import_system43.height[height]),
+      className: (0, import_system41.cn)("grid", import_system41.gapSpace[space], import_system41.height[height]),
       style: {
         gridTemplateAreas: parseGridAreas(areas),
         gridTemplateColumns: parseTemplateValue(columns),
@@ -2449,9 +2549,57 @@ var Grid = ({
 };
 Grid.Area = GridArea;
 
+// src/Header/Header.tsx
+var import_react_aria_components28 = require("react-aria-components");
+var import_system42 = require("@marigold/system");
+var import_jsx_runtime50 = require("react/jsx-runtime");
+var _Header = ({ variant, size: size2, ...props }) => {
+  const classNames3 = (0, import_system42.useClassNames)({
+    component: "Header",
+    variant,
+    size: size2
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react_aria_components28.Header, { className: classNames3, ...props, children: props.children });
+};
+
+// src/Headline/Headline.tsx
+var import_react_aria_components29 = require("react-aria-components");
+var import_system43 = require("@marigold/system");
+var import_jsx_runtime51 = require("react/jsx-runtime");
+var _Headline = ({
+  variant,
+  size: size2,
+  children,
+  align = "left",
+  color,
+  level = "1",
+  ...props
+}) => {
+  const classNames3 = (0, import_system43.useClassNames)({
+    component: "Headline",
+    variant,
+    size: size2 != null ? size2 : `level-${level}`
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+    import_react_aria_components29.Heading,
+    {
+      level: Number(level),
+      ...props,
+      className: (0, import_system43.cn)(
+        classNames3,
+        "max-w-(--maxHeadlineWidth)",
+        // possibly set by a <Container>
+        import_system43.textAlign[align]
+      ),
+      style: { color: color && (0, import_system43.ensureCssVar)(color, "color") },
+      children
+    }
+  );
+};
+
 // src/Image/Image.tsx
 var import_system44 = require("@marigold/system");
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var Image = ({
   variant,
   size: size2,
@@ -2460,7 +2608,7 @@ var Image = ({
   ...props
 }) => {
   const classNames3 = (0, import_system44.useClassNames)({ component: "Image", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
     "img",
     {
       ...props,
@@ -2477,7 +2625,7 @@ var Image = ({
 
 // src/Inline/Inline.tsx
 var import_system45 = require("@marigold/system");
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var Inline = ({
   space = 0,
   alignX,
@@ -2486,7 +2634,7 @@ var Inline = ({
   ...props
 }) => {
   var _a, _b, _c, _d;
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
     "div",
     {
       ...props,
@@ -2502,28 +2650,28 @@ var Inline = ({
 };
 
 // src/DateField/DateField.tsx
-var import_react27 = require("react");
-var import_react_aria_components30 = require("react-aria-components");
+var import_react29 = require("react");
+var import_react_aria_components32 = require("react-aria-components");
 
 // src/DateField/DateInput.tsx
-var import_react_aria_components29 = require("react-aria-components");
+var import_react_aria_components31 = require("react-aria-components");
 var import_system47 = require("@marigold/system");
 
 // src/DateField/DateSegment.tsx
-var import_react_aria_components28 = require("react-aria-components");
+var import_react_aria_components30 = require("react-aria-components");
 var import_system46 = require("@marigold/system");
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var _DateSegment = ({ segment, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
-    import_react_aria_components28.DateSegment,
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+    import_react_aria_components30.DateSegment,
     {
       ...props,
       segment,
       style: {
         minWidth: segment.maxValue != null ? `${String(segment.maxValue).length}ch` : void 0
       },
-      children: ({ text, placeholder, isPlaceholder }) => /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+      children: ({ text, placeholder, isPlaceholder }) => /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
           "span",
           {
             "aria-hidden": "true",
@@ -2534,25 +2682,25 @@ var _DateSegment = ({ segment, ...props }) => {
             children: isPlaceholder && (placeholder == null ? void 0 : placeholder.toUpperCase())
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { children: isPlaceholder ? "" : segment.type === "month" || segment.type === "day" ? segment.text.padStart(2, "0") : text })
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { children: isPlaceholder ? "" : segment.type === "month" || segment.type === "day" ? segment.text.padStart(2, "0") : text })
       ] })
     }
   );
 };
 
 // src/DateField/DateInput.tsx
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 var _DateInput = ({ variant, size: size2, action, ...props }) => {
   const classNames3 = (0, import_system47.useClassNames)({ component: "DateField", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_react_aria_components29.Group, { className: classNames3.field, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_aria_components29.DateInput, { className: "flex flex-1 items-center", ...props, children: (segment) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(_DateSegment, { className: classNames3.segment, segment }) }),
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_react_aria_components31.Group, { className: classNames3.field, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react_aria_components31.DateInput, { className: "flex flex-1 items-center", ...props, children: (segment) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(_DateSegment, { className: classNames3.segment, segment }) }),
     action ? action : null
   ] });
 };
 
 // src/DateField/DateField.tsx
-var import_jsx_runtime55 = require("react/jsx-runtime");
-var _DateField = (0, import_react27.forwardRef)(
+var import_jsx_runtime56 = require("react/jsx-runtime");
+var _DateField = (0, import_react29.forwardRef)(
   ({
     variant,
     size: size2,
@@ -2570,46 +2718,46 @@ var _DateField = (0, import_react27.forwardRef)(
       isRequired: required,
       ...rest
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       FieldBase,
       {
-        as: import_react_aria_components30.DateField,
+        as: import_react_aria_components32.DateField,
         variant,
         size: size2,
         ref,
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(_DateInput, { action })
+        children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(_DateInput, { action })
       }
     );
   }
 );
 
 // src/Calendar/Calendar.tsx
-var import_react32 = require("react");
-var import_react_aria_components36 = require("react-aria-components");
+var import_react34 = require("react");
+var import_react_aria_components38 = require("react-aria-components");
 var import_system52 = require("@marigold/system");
 
 // src/Calendar/CalendarGrid.tsx
-var import_react_aria_components32 = require("react-aria-components");
+var import_react_aria_components34 = require("react-aria-components");
 var import_system49 = require("@marigold/system");
 
 // src/Calendar/CalendarGridHeader.tsx
 var import_date = require("@internationalized/date");
-var import_react28 = require("react");
-var import_react_aria_components31 = require("react-aria-components");
+var import_react30 = require("react");
+var import_react_aria_components33 = require("react-aria-components");
 var import_calendar = require("@react-aria/calendar");
 var import_i18n3 = require("@react-aria/i18n");
 var import_system48 = require("@marigold/system");
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 function CalendarGridHeader(props) {
-  const state = (0, import_react28.useContext)(import_react_aria_components31.CalendarStateContext);
+  const state = (0, import_react30.useContext)(import_react_aria_components33.CalendarStateContext);
   const { headerProps } = (0, import_calendar.useCalendarGrid)(props, state);
   const { locale } = (0, import_i18n3.useLocale)();
   const dayFormatter = (0, import_i18n3.useDateFormatter)({
     weekday: "short",
     timeZone: state.timeZone
   });
-  const weekDays = (0, import_react28.useMemo)(() => {
+  const weekDays = (0, import_react30.useMemo)(() => {
     const weekStart = (0, import_date.startOfWeek)((0, import_date.today)(state.timeZone), locale);
     return [...new Array(7).keys()].map((index2) => {
       const date = weekStart.add({ days: index2 });
@@ -2618,17 +2766,17 @@ function CalendarGridHeader(props) {
     });
   }, [locale, state.timeZone, dayFormatter]);
   const classNames3 = (0, import_system48.useClassNames)({ component: "Calendar" });
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("thead", { ...headerProps, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("tr", { children: weekDays.map((day, index2) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("th", { className: classNames3.calendarHeader, children: day.substring(0, 2) }, index2)) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("thead", { ...headerProps, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("tr", { children: weekDays.map((day, index2) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("th", { className: classNames3.calendarHeader, children: day.substring(0, 2) }, index2)) }) });
 }
 
 // src/Calendar/CalendarGrid.tsx
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 var _CalendarGrid = () => {
   const classNames3 = (0, import_system49.useClassNames)({ component: "Calendar" });
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_react_aria_components32.CalendarGrid, { className: classNames3.calendarGrid, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(CalendarGridHeader, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_react_aria_components32.CalendarGridBody, { children: (date) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
-      import_react_aria_components32.CalendarCell,
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_react_aria_components34.CalendarGrid, { className: classNames3.calendarGrid, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(CalendarGridHeader, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react_aria_components34.CalendarGridBody, { children: (date) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+      import_react_aria_components34.CalendarCell,
       {
         date,
         className: (0, import_system49.cn)(
@@ -2641,8 +2789,8 @@ var _CalendarGrid = () => {
 };
 
 // src/Calendar/CalendarListBox.tsx
-var import_react29 = require("react");
-var import_react_aria_components33 = require("react-aria-components");
+var import_react31 = require("react");
+var import_react_aria_components35 = require("react-aria-components");
 var import_system50 = require("@marigold/system");
 
 // src/Calendar/useFormattedMonths.tsx
@@ -2662,17 +2810,17 @@ function useFormattedMonths(timeZone, focusedDate) {
 }
 
 // src/Calendar/CalendarListBox.tsx
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 function CalendarListBox({
   type,
   isDisabled,
   setSelectedDropdown
 }) {
-  const state = (0, import_react29.useContext)(import_react_aria_components33.CalendarStateContext);
+  const state = (0, import_react31.useContext)(import_react_aria_components35.CalendarStateContext);
   const months = useFormattedMonths(state.timeZone, state.focusedDate);
   const buttonStyles = "flex items-center justify-between gap-1 overflow-hidden";
   const { select: selectClassNames } = (0, import_system50.useClassNames)({ component: "Select" });
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
     "button",
     {
       disabled: isDisabled,
@@ -2681,7 +2829,7 @@ function CalendarListBox({
       "data-testid": type,
       children: [
         type === "month" ? months[state.focusedDate.month - 1].substring(0, 3) : state.focusedDate.year,
-        /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(ChevronDown, {})
+        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(ChevronDown, {})
       ]
     }
   );
@@ -2689,10 +2837,10 @@ function CalendarListBox({
 
 // src/Calendar/MonthControls.tsx
 var import_system51 = require("@marigold/system");
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 function MonthControls() {
   const classNames3 = (0, import_system51.useClassNames)({ component: "Calendar" });
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
     "div",
     {
       className: (0, import_system51.cn)(
@@ -2700,22 +2848,22 @@ function MonthControls() {
         classNames3.calendarControllers
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
           IconButton,
           {
             className: (0, import_system51.cn)("inline-flex items-center justify-center gap-[0.5ch]"),
             variant: "navigation",
             slot: "previous",
-            children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(ChevronLeft, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(ChevronLeft, {})
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
           IconButton,
           {
             className: (0, import_system51.cn)("inline-flex items-center justify-center gap-[0.5ch]"),
             variant: "navigation",
             slot: "next",
-            children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(ChevronRight, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(ChevronRight, {})
           }
         )
       ]
@@ -2725,24 +2873,24 @@ function MonthControls() {
 var MonthControls_default = MonthControls;
 
 // src/Calendar/MonthListBox.tsx
-var import_react30 = require("react");
-var import_react_aria_components34 = require("react-aria-components");
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_react32 = require("react");
+var import_react_aria_components36 = require("react-aria-components");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 var MonthListBox = ({ setSelectedDropdown }) => {
-  const state = (0, import_react30.useContext)(import_react_aria_components34.CalendarStateContext);
+  const state = (0, import_react32.useContext)(import_react_aria_components36.CalendarStateContext);
   const months = useFormattedMonths(state.timeZone, state.focusedDate);
   let onChange2 = (index2) => {
     let value = Number(index2) + 1;
     let date = state.focusedDate.set({ month: value });
     state.setFocusedDate(date);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
     "ul",
     {
       "data-testid": "monthOptions",
       className: "grid h-full max-h-[300px] min-w-[300px] grid-cols-3 gap-y-10 overflow-y-scroll p-2",
       children: months.map((month, index2) => {
-        return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("li", { className: "flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("li", { className: "flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
           _Button,
           {
             slot: "previous",
@@ -2763,12 +2911,12 @@ var MonthListBox = ({ setSelectedDropdown }) => {
 var MonthListBox_default = MonthListBox;
 
 // src/Calendar/YearListBox.tsx
-var import_react31 = require("react");
-var import_react_aria_components35 = require("react-aria-components");
+var import_react33 = require("react");
+var import_react_aria_components37 = require("react-aria-components");
 var import_i18n5 = require("@react-aria/i18n");
-var import_jsx_runtime61 = require("react/jsx-runtime");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 var YearListBox = ({ setSelectedDropdown }) => {
-  const state = (0, import_react31.useContext)(import_react_aria_components35.CalendarStateContext);
+  const state = (0, import_react33.useContext)(import_react_aria_components37.CalendarStateContext);
   const years = [];
   let formatter = (0, import_i18n5.useDateFormatter)({
     year: "numeric",
@@ -2781,8 +2929,8 @@ var YearListBox = ({ setSelectedDropdown }) => {
       formatted: formatter.format(date.toDate(state.timeZone))
     });
   }
-  const activeButtonRef = (0, import_react31.useRef)(null);
-  (0, import_react31.useEffect)(() => {
+  const activeButtonRef = (0, import_react33.useRef)(null);
+  (0, import_react33.useEffect)(() => {
     if (activeButtonRef.current) {
       const activeButton = activeButtonRef.current;
       activeButton == null ? void 0 : activeButton.scrollIntoView({
@@ -2796,19 +2944,19 @@ var YearListBox = ({ setSelectedDropdown }) => {
     let date = years[index2].value;
     state.setFocusedDate(date);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
     "ul",
     {
       "data-testid": "yearOptions",
       className: "grid h-full max-h-[300px] min-w-[300px] grid-cols-3 gap-y-10 overflow-y-scroll p-2",
       children: years.map((year, index2) => {
         const isActive = +year.formatted === state.focusedDate.year;
-        return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("li", { className: "flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("li", { className: "flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
           "div",
           {
             ref: isActive ? activeButtonRef : null,
             style: { height: "100%", width: "100%" },
-            children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
               _Button,
               {
                 slot: "previous",
@@ -2833,7 +2981,7 @@ var YearListBox = ({ setSelectedDropdown }) => {
 var YearListBox_default = YearListBox;
 
 // src/Calendar/Calendar.tsx
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 var _Calendar = ({
   disabled,
   readOnly,
@@ -2849,23 +2997,23 @@ var _Calendar = ({
     ...rest
   };
   const classNames3 = (0, import_system52.useClassNames)({ component: "Calendar" });
-  const [selectedDropdown, setSelectedDropdown] = (0, import_react32.useState)();
+  const [selectedDropdown, setSelectedDropdown] = (0, import_react34.useState)();
   const ViewMap = {
-    month: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(MonthListBox_default, { setSelectedDropdown }),
-    year: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(YearListBox_default, { setSelectedDropdown })
+    month: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(MonthListBox_default, { setSelectedDropdown }),
+    year: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(YearListBox_default, { setSelectedDropdown })
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
-    import_react_aria_components36.Calendar,
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+    import_react_aria_components38.Calendar,
     {
       className: (0, import_system52.cn)(
         "flex min-h-[350px] w-fit flex-col rounded-xs p-4",
         classNames3.calendar
       ),
       ...props,
-      children: selectedDropdown ? ViewMap[selectedDropdown] : /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_jsx_runtime62.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "mb-4 flex items-center justify-between", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "flex w-fit gap-4", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+      children: selectedDropdown ? ViewMap[selectedDropdown] : /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_jsx_runtime63.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "mb-4 flex items-center justify-between", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "flex w-fit gap-4", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
               CalendarListBox,
               {
                 type: "month",
@@ -2873,7 +3021,7 @@ var _Calendar = ({
                 setSelectedDropdown
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
               CalendarListBox,
               {
                 type: "year",
@@ -2882,20 +3030,20 @@ var _Calendar = ({
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(MonthControls_default, {})
+          /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(MonthControls_default, {})
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(_CalendarGrid, {})
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(_CalendarGrid, {})
       ] })
     }
   );
 };
 
 // src/DatePicker/DatePicker.tsx
-var import_react33 = __toESM(require("react"));
-var import_react_aria_components37 = require("react-aria-components");
+var import_react35 = __toESM(require("react"));
+var import_react_aria_components39 = require("react-aria-components");
 var import_system53 = require("@marigold/system");
-var import_jsx_runtime63 = require("react/jsx-runtime");
-var _DatePicker = import_react33.default.forwardRef(
+var import_jsx_runtime64 = require("react/jsx-runtime");
+var _DatePicker = import_react35.default.forwardRef(
   ({
     dateUnavailable,
     disabled,
@@ -2923,19 +3071,19 @@ var _DatePicker = import_react33.default.forwardRef(
       size: size2,
       variant
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
       FieldBase,
       {
-        as: import_react_aria_components37.DatePicker,
+        as: import_react_aria_components39.DatePicker,
         variant,
         size: size2,
         ...props,
         ref,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
             _DateInput,
             {
-              action: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(IconButton, { className: classNames3, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+              action: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(IconButton, { className: classNames3, children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
                 "svg",
                 {
                   "data-testid": "action",
@@ -2943,12 +3091,12 @@ var _DatePicker = import_react33.default.forwardRef(
                   width: 24,
                   height: 24,
                   fill: "currentColor",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("path", { d: "M20.0906 19.2V6.6C20.0906 5.61 19.2806 4.8 18.2906 4.8H17.3906V3H15.5906V4.8H8.39062V3H6.59062V4.8H5.69063C4.69163 4.8 3.89962 5.61 3.89962 6.6L3.89062 19.2C3.89062 20.19 4.69163 21 5.69063 21H18.2906C19.2806 21 20.0906 20.19 20.0906 19.2ZM9.29062 11.1001H7.49061V12.9001H9.29062V11.1001ZM5.69062 8.40009H18.2906V6.60008H5.69062V8.40009ZM18.2906 10.2V19.2H5.69062V10.2H18.2906ZM14.6906 12.9001H16.4906V11.1001H14.6906V12.9001ZM12.8906 12.9001H11.0906V11.1001H12.8906V12.9001Z" })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("path", { d: "M20.0906 19.2V6.6C20.0906 5.61 19.2806 4.8 18.2906 4.8H17.3906V3H15.5906V4.8H8.39062V3H6.59062V4.8H5.69063C4.69163 4.8 3.89962 5.61 3.89962 6.6L3.89062 19.2C3.89062 20.19 4.69163 21 5.69063 21H18.2906C19.2806 21 20.0906 20.19 20.0906 19.2ZM9.29062 11.1001H7.49061V12.9001H9.29062V11.1001ZM5.69062 8.40009H18.2906V6.60008H5.69062V8.40009ZM18.2906 10.2V19.2H5.69062V10.2H18.2906ZM14.6906 12.9001H16.4906V11.1001H14.6906V12.9001ZM12.8906 12.9001H11.0906V11.1001H12.8906V12.9001Z" })
                 }
               ) })
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(_Popover, { children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react_aria_components37.Dialog, { children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(_Calendar, { disabled }) }) })
+          /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(_Popover, { children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_react_aria_components39.Dialog, { children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(_Calendar, { disabled }) }) })
         ]
       }
     );
@@ -2957,8 +3105,8 @@ var _DatePicker = import_react33.default.forwardRef(
 
 // src/Inset/Inset.tsx
 var import_system54 = require("@marigold/system");
-var import_jsx_runtime64 = require("react/jsx-runtime");
-var Inset = ({ space, spaceX, spaceY, children }) => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+var import_jsx_runtime65 = require("react/jsx-runtime");
+var Inset = ({ space, spaceX, spaceY, children }) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
   "div",
   {
     className: (0, import_system54.cn)(
@@ -2971,18 +3119,18 @@ var Inset = ({ space, spaceX, spaceY, children }) => /* @__PURE__ */ (0, import_
 );
 
 // src/Link/Link.tsx
-var import_react34 = require("react");
-var import_react_aria_components38 = require("react-aria-components");
+var import_react36 = require("react");
+var import_react_aria_components40 = require("react-aria-components");
 var import_system55 = require("@marigold/system");
-var import_jsx_runtime65 = require("react/jsx-runtime");
-var _Link = (0, import_react34.forwardRef)(
+var import_jsx_runtime66 = require("react/jsx-runtime");
+var _Link = (0, import_react36.forwardRef)(
   ({ variant, size: size2, disabled, children, ...props }, ref) => {
     const classNames3 = (0, import_system55.useClassNames)({
       component: "Link",
       variant,
       size: size2
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react_aria_components38.Link, { ...props, ref, className: classNames3, isDisabled: disabled, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react_aria_components40.Link, { ...props, ref, className: classNames3, isDisabled: disabled, children });
   }
 );
 
@@ -2990,19 +3138,19 @@ var _Link = (0, import_react34.forwardRef)(
 var import_system56 = require("@marigold/system");
 
 // src/List/Context.ts
-var import_react35 = require("react");
-var ListContext = (0, import_react35.createContext)({});
-var useListContext = () => (0, import_react35.useContext)(ListContext);
+var import_react37 = require("react");
+var ListContext = (0, import_react37.createContext)({});
+var useListContext = () => (0, import_react37.useContext)(ListContext);
 
 // src/List/ListItem.tsx
-var import_jsx_runtime66 = require("react/jsx-runtime");
+var import_jsx_runtime67 = require("react/jsx-runtime");
 var ListItem = ({ children, ...props }) => {
   const { classNames: classNames3 } = useListContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("li", { ...props, className: classNames3, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("li", { ...props, className: classNames3, children });
 };
 
 // src/List/List.tsx
-var import_jsx_runtime67 = require("react/jsx-runtime");
+var import_jsx_runtime68 = require("react/jsx-runtime");
 var List = ({
   as = "ul",
   children,
@@ -3012,37 +3160,37 @@ var List = ({
 }) => {
   const Component2 = as;
   const classNames3 = (0, import_system56.useClassNames)({ component: "List", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(Component2, { ...props, className: classNames3[as], children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(ListContext.Provider, { value: { classNames: classNames3.item }, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Component2, { ...props, className: classNames3[as], children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ListContext.Provider, { value: { classNames: classNames3.item }, children }) });
 };
 List.Item = ListItem;
 
 // src/Menu/Menu.tsx
-var import_react_aria_components41 = require("react-aria-components");
+var import_react_aria_components43 = require("react-aria-components");
 var import_system59 = require("@marigold/system");
 
 // src/Menu/MenuItem.tsx
-var import_react_aria_components39 = require("react-aria-components");
+var import_react_aria_components41 = require("react-aria-components");
 var import_system57 = require("@marigold/system");
-var import_jsx_runtime68 = require("react/jsx-runtime");
+var import_jsx_runtime69 = require("react/jsx-runtime");
 var _MenuItem = ({ children, ...props }) => {
   const classNames3 = (0, import_system57.useClassNames)({ component: "Menu" });
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react_aria_components39.MenuItem, { ...props, className: classNames3.item, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_react_aria_components41.MenuItem, { ...props, className: classNames3.item, children });
 };
 
 // src/Menu/MenuSection.tsx
-var import_react_aria_components40 = require("react-aria-components");
+var import_react_aria_components42 = require("react-aria-components");
 var import_system58 = require("@marigold/system");
-var import_jsx_runtime69 = require("react/jsx-runtime");
+var import_jsx_runtime70 = require("react/jsx-runtime");
 var _MenuSection = ({ children, title, ...props }) => {
   const className = (0, import_system58.useClassNames)({ component: "Menu" });
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_react_aria_components40.MenuSection, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(_Header, { className: className.section, children: title }),
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_react_aria_components42.MenuSection, { ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(_Header, { className: className.section, children: title }),
     children
   ] });
 };
 
 // src/Menu/Menu.tsx
-var import_jsx_runtime70 = require("react/jsx-runtime");
+var import_jsx_runtime71 = require("react/jsx-runtime");
 var _Menu = ({
   children,
   label,
@@ -3055,18 +3203,18 @@ var _Menu = ({
   ...props
 }) => {
   const classNames3 = (0, import_system59.useClassNames)({ component: "Menu", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_react_aria_components41.MenuTrigger, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(_Button, { variant: "menu", disabled, "aria-label": ariaLabel, children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(_Popover, { open, placement, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_react_aria_components41.Menu, { ...props, className: classNames3.container, children }) })
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_react_aria_components43.MenuTrigger, { ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(_Button, { variant: "menu", disabled, "aria-label": ariaLabel, children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(_Popover, { open, placement, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_react_aria_components43.Menu, { ...props, className: classNames3.container, children }) })
   ] });
 };
 _Menu.Item = _MenuItem;
 _Menu.Section = _MenuSection;
 
 // src/Menu/ActionMenu.tsx
-var import_react_aria_components42 = require("react-aria-components");
+var import_react_aria_components44 = require("react-aria-components");
 var import_system60 = require("@marigold/system");
-var import_jsx_runtime71 = require("react/jsx-runtime");
+var import_jsx_runtime72 = require("react/jsx-runtime");
 var ActionMenu = ({
   variant,
   size: size2,
@@ -3074,50 +3222,50 @@ var ActionMenu = ({
   ...props
 }) => {
   const classNames3 = (0, import_system60.useClassNames)({ component: "Menu", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_react_aria_components42.MenuTrigger, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(_Button, { variant: "menu", size: "small", disabled, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_system60.SVG, { viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("path", { d: "M12.0117 7.47656C13.2557 7.47656 14.2734 6.45879 14.2734 5.21484C14.2734 3.9709 13.2557 2.95312 12.0117 2.95312C10.7678 2.95312 9.75 3.9709 9.75 5.21484C9.75 6.45879 10.7678 7.47656 12.0117 7.47656ZM12.0117 9.73828C10.7678 9.73828 9.75 10.7561 9.75 12C9.75 13.2439 10.7678 14.2617 12.0117 14.2617C13.2557 14.2617 14.2734 13.2439 14.2734 12C14.2734 10.7561 13.2557 9.73828 12.0117 9.73828ZM12.0117 16.5234C10.7678 16.5234 9.75 17.5412 9.75 18.7852C9.75 20.0291 10.7678 21.0469 12.0117 21.0469C13.2557 21.0469 14.2734 20.0291 14.2734 18.7852C14.2734 17.5412 13.2557 16.5234 12.0117 16.5234Z" }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(_Popover, { children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_react_aria_components42.Menu, { ...props, className: classNames3.container, children: props.children }) })
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(import_react_aria_components44.MenuTrigger, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(_Button, { variant: "menu", size: "small", disabled, children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_system60.SVG, { viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("path", { d: "M12.0117 7.47656C13.2557 7.47656 14.2734 6.45879 14.2734 5.21484C14.2734 3.9709 13.2557 2.95312 12.0117 2.95312C10.7678 2.95312 9.75 3.9709 9.75 5.21484C9.75 6.45879 10.7678 7.47656 12.0117 7.47656ZM12.0117 9.73828C10.7678 9.73828 9.75 10.7561 9.75 12C9.75 13.2439 10.7678 14.2617 12.0117 14.2617C13.2557 14.2617 14.2734 13.2439 14.2734 12C14.2734 10.7561 13.2557 9.73828 12.0117 9.73828ZM12.0117 16.5234C10.7678 16.5234 9.75 17.5412 9.75 18.7852C9.75 20.0291 10.7678 21.0469 12.0117 21.0469C13.2557 21.0469 14.2734 20.0291 14.2734 18.7852C14.2734 17.5412 13.2557 16.5234 12.0117 16.5234Z" }) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(_Popover, { children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_react_aria_components44.Menu, { ...props, className: classNames3.container, children: props.children }) })
   ] });
 };
 
 // src/SectionMessage/SectionMessage.tsx
-var import_react37 = require("react");
+var import_react39 = require("react");
 var import_button = require("@react-aria/button");
 var import_system63 = require("@marigold/system");
 
 // src/SectionMessage/Context.tsx
-var import_react36 = require("react");
-var SectionMessageContext = (0, import_react36.createContext)({});
-var useSectionMessageContext = () => (0, import_react36.useContext)(SectionMessageContext);
+var import_react38 = require("react");
+var SectionMessageContext = (0, import_react38.createContext)({});
+var useSectionMessageContext = () => (0, import_react38.useContext)(SectionMessageContext);
 
 // src/SectionMessage/SectionMessageContent.tsx
 var import_system61 = require("@marigold/system");
-var import_jsx_runtime72 = require("react/jsx-runtime");
+var import_jsx_runtime73 = require("react/jsx-runtime");
 var SectionMessageContent = ({
   children
 }) => {
   const { classNames: classNames3 } = useSectionMessageContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: (0, import_system61.cn)("[grid-area:content]", classNames3.content), children });
+  return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: (0, import_system61.cn)("[grid-area:content]", classNames3.content), children });
 };
 
 // src/SectionMessage/SectionMessageTitle.tsx
 var import_system62 = require("@marigold/system");
-var import_jsx_runtime73 = require("react/jsx-runtime");
+var import_jsx_runtime74 = require("react/jsx-runtime");
 var SectionMessageTitle = ({ children }) => {
   const { classNames: classNames3 } = useSectionMessageContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: (0, import_system62.cn)("[grid-area:title]", classNames3.title), children });
+  return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: (0, import_system62.cn)("[grid-area:title]", classNames3.title), children });
 };
 
 // src/SectionMessage/SectionMessage.tsx
-var import_jsx_runtime74 = require("react/jsx-runtime");
+var import_jsx_runtime75 = require("react/jsx-runtime");
 var icons = {
-  success: () => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+  success: () => /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
       fill: "currentColor",
-      children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
         "path",
         {
           fillRule: "evenodd",
@@ -3127,13 +3275,13 @@ var icons = {
       )
     }
   ),
-  info: () => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+  info: () => /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
       fill: "currentColor",
-      children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
         "path",
         {
           fillRule: "evenodd",
@@ -3143,13 +3291,13 @@ var icons = {
       )
     }
   ),
-  warning: () => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+  warning: () => /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
       fill: "currentColor",
-      children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
         "path",
         {
           fillRule: "evenodd",
@@ -3159,13 +3307,13 @@ var icons = {
       )
     }
   ),
-  error: () => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+  error: () => /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
       fill: "currentColor",
-      children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
         "path",
         {
           fillRule: "evenodd",
@@ -3185,14 +3333,14 @@ var SectionMessage = ({
   onCloseChange,
   ...props
 }) => {
-  const buttonRef = (0, import_react37.useRef)(null);
+  const buttonRef = (0, import_react39.useRef)(null);
   const classNames3 = (0, import_system63.useClassNames)({
     component: "SectionMessage",
     variant,
     size: size2
   });
   const Icon4 = icons[variant];
-  const [internalVisible, setInternalVisible] = (0, import_react37.useState)(true);
+  const [internalVisible, setInternalVisible] = (0, import_react39.useState)(true);
   const isCurrentlyVisible = close != null ? close : internalVisible;
   const { buttonProps } = (0, import_button.useButton)(props, buttonRef);
   const handleClose = () => {
@@ -3202,15 +3350,15 @@ var SectionMessage = ({
     }
   };
   if (!isCurrentlyVisible) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(SectionMessageContext.Provider, { value: { classNames: classNames3 }, children: /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(SectionMessageContext.Provider, { value: { classNames: classNames3 }, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
     "div",
     {
       role: variant === "error" ? "alert" : void 0,
       ...props,
       className: (0, import_system63.cn)("grid auto-rows-min", classNames3.container),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: (0, import_system63.cn)("[grid-area:icon]", classNames3.icon), children: Icon4 && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(Icon4, {}) }),
-        closeButton && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: (0, import_system63.cn)("[grid-area:icon]", classNames3.icon), children: Icon4 && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Icon4, {}) }),
+        closeButton && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
           "button",
           {
             ...buttonProps,
@@ -3218,7 +3366,7 @@ var SectionMessage = ({
             "aria-label": "close",
             className: (0, import_system63.cn)("[grid-area:close]", classNames3.close),
             onClick: handleClose,
-            children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("svg", { viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("svg", { viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
               "path",
               {
                 fillRule: "evenodd",
@@ -3237,7 +3385,7 @@ SectionMessage.Title = SectionMessageTitle;
 SectionMessage.Content = SectionMessageContent;
 
 // src/Multiselect/Multiselect.tsx
-var import_react_aria_components43 = require("react-aria-components");
+var import_react_aria_components45 = require("react-aria-components");
 
 // ../../node_modules/.pnpm/@babel+runtime@7.27.0/node_modules/@babel/runtime/helpers/esm/typeof.js
 function _typeof(o) {
@@ -3377,33 +3525,33 @@ function _objectWithoutProperties(e, t) {
 }
 
 // ../../node_modules/.pnpm/react-select@5.10.1_@types+react@19.1.0_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/react-select/dist/useStateManager-7e1e8489.esm.js
-var import_react38 = require("react");
+var import_react40 = require("react");
 var _excluded = ["defaultInputValue", "defaultMenuIsOpen", "defaultValue", "inputValue", "menuIsOpen", "onChange", "onInputChange", "onMenuClose", "onMenuOpen", "value"];
 function useStateManager(_ref3) {
   var _ref$defaultInputValu = _ref3.defaultInputValue, defaultInputValue = _ref$defaultInputValu === void 0 ? "" : _ref$defaultInputValu, _ref$defaultMenuIsOpe = _ref3.defaultMenuIsOpen, defaultMenuIsOpen = _ref$defaultMenuIsOpe === void 0 ? false : _ref$defaultMenuIsOpe, _ref$defaultValue = _ref3.defaultValue, defaultValue = _ref$defaultValue === void 0 ? null : _ref$defaultValue, propsInputValue = _ref3.inputValue, propsMenuIsOpen = _ref3.menuIsOpen, propsOnChange = _ref3.onChange, propsOnInputChange = _ref3.onInputChange, propsOnMenuClose = _ref3.onMenuClose, propsOnMenuOpen = _ref3.onMenuOpen, propsValue = _ref3.value, restSelectProps = _objectWithoutProperties(_ref3, _excluded);
-  var _useState = (0, import_react38.useState)(propsInputValue !== void 0 ? propsInputValue : defaultInputValue), _useState2 = _slicedToArray(_useState, 2), stateInputValue = _useState2[0], setStateInputValue = _useState2[1];
-  var _useState3 = (0, import_react38.useState)(propsMenuIsOpen !== void 0 ? propsMenuIsOpen : defaultMenuIsOpen), _useState4 = _slicedToArray(_useState3, 2), stateMenuIsOpen = _useState4[0], setStateMenuIsOpen = _useState4[1];
-  var _useState5 = (0, import_react38.useState)(propsValue !== void 0 ? propsValue : defaultValue), _useState6 = _slicedToArray(_useState5, 2), stateValue = _useState6[0], setStateValue = _useState6[1];
-  var onChange2 = (0, import_react38.useCallback)(function(value2, actionMeta) {
+  var _useState = (0, import_react40.useState)(propsInputValue !== void 0 ? propsInputValue : defaultInputValue), _useState2 = _slicedToArray(_useState, 2), stateInputValue = _useState2[0], setStateInputValue = _useState2[1];
+  var _useState3 = (0, import_react40.useState)(propsMenuIsOpen !== void 0 ? propsMenuIsOpen : defaultMenuIsOpen), _useState4 = _slicedToArray(_useState3, 2), stateMenuIsOpen = _useState4[0], setStateMenuIsOpen = _useState4[1];
+  var _useState5 = (0, import_react40.useState)(propsValue !== void 0 ? propsValue : defaultValue), _useState6 = _slicedToArray(_useState5, 2), stateValue = _useState6[0], setStateValue = _useState6[1];
+  var onChange2 = (0, import_react40.useCallback)(function(value2, actionMeta) {
     if (typeof propsOnChange === "function") {
       propsOnChange(value2, actionMeta);
     }
     setStateValue(value2);
   }, [propsOnChange]);
-  var onInputChange = (0, import_react38.useCallback)(function(value2, actionMeta) {
+  var onInputChange = (0, import_react40.useCallback)(function(value2, actionMeta) {
     var newValue;
     if (typeof propsOnInputChange === "function") {
       newValue = propsOnInputChange(value2, actionMeta);
     }
     setStateInputValue(newValue !== void 0 ? newValue : value2);
   }, [propsOnInputChange]);
-  var onMenuOpen = (0, import_react38.useCallback)(function() {
+  var onMenuOpen = (0, import_react40.useCallback)(function() {
     if (typeof propsOnMenuOpen === "function") {
       propsOnMenuOpen();
     }
     setStateMenuIsOpen(true);
   }, [propsOnMenuOpen]);
-  var onMenuClose = (0, import_react38.useCallback)(function() {
+  var onMenuClose = (0, import_react40.useCallback)(function() {
     if (typeof propsOnMenuClose === "function") {
       propsOnMenuClose();
     }
@@ -3436,7 +3584,7 @@ function _extends() {
 
 // ../../node_modules/.pnpm/react-select@5.10.1_@types+react@19.1.0_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/react-select/dist/react-select.esm.js
 var React11 = __toESM(require("react"));
-var import_react45 = require("react");
+var import_react47 = require("react");
 
 // ../../node_modules/.pnpm/@babel+runtime@7.27.0/node_modules/@babel/runtime/helpers/esm/classCallCheck.js
 function _classCallCheck(a, n) {
@@ -3544,11 +3692,11 @@ function _toConsumableArray(r) {
 
 // ../../node_modules/.pnpm/react-select@5.10.1_@types+react@19.1.0_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/react-select/dist/Select-aab027f3.esm.js
 var React10 = __toESM(require("react"));
-var import_react43 = require("react");
+var import_react45 = require("react");
 
 // ../../node_modules/.pnpm/@emotion+react@11.14.0_@types+react@19.1.0_react@19.1.0/node_modules/@emotion/react/dist/emotion-element-d59e098f.esm.js
 var React8 = __toESM(require("react"));
-var import_react39 = require("react");
+var import_react41 = require("react");
 
 // ../../node_modules/.pnpm/@emotion+sheet@1.4.0/node_modules/@emotion/sheet/dist/emotion-sheet.esm.js
 var isDevelopment = false;
@@ -4736,15 +4884,15 @@ var EmotionCacheContext = /* @__PURE__ */ React8.createContext(
 );
 var CacheProvider = EmotionCacheContext.Provider;
 var withEmotionCache = function withEmotionCache2(func) {
-  return /* @__PURE__ */ (0, import_react39.forwardRef)(function(props, ref) {
-    var cache = (0, import_react39.useContext)(EmotionCacheContext);
+  return /* @__PURE__ */ (0, import_react41.forwardRef)(function(props, ref) {
+    var cache = (0, import_react41.useContext)(EmotionCacheContext);
     return func(props, cache, ref);
   });
 };
 if (!isBrowser4) {
   withEmotionCache = function withEmotionCache3(func) {
     return function(props) {
-      var cache = (0, import_react39.useContext)(EmotionCacheContext);
+      var cache = (0, import_react41.useContext)(EmotionCacheContext);
       if (cache === null) {
         cache = createCache({
           key: "css"
@@ -4828,7 +4976,7 @@ var Emotion$1 = Emotion;
 var React9 = __toESM(require("react"));
 var import_extends2 = __toESM(require_extends());
 var import_hoist_non_react_statics = __toESM(require_hoist_non_react_statics_cjs());
-var jsx75 = function jsx76(type, props) {
+var jsx76 = function jsx77(type, props) {
   var args = arguments;
   if (props == null || !hasOwn.call(props, "css")) {
     return React9.createElement.apply(void 0, args);
@@ -4846,7 +4994,7 @@ var jsx75 = function jsx76(type, props) {
   var JSX;
   /* @__PURE__ */ (function(_JSX) {
   })(JSX || (JSX = _jsx.JSX || (_jsx.JSX = {})));
-})(jsx75 || (jsx75 = {}));
+})(jsx76 || (jsx76 = {}));
 function css() {
   for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
     args[_key] = arguments[_key];
@@ -4876,7 +5024,7 @@ function _taggedTemplateLiteral(e, t) {
 }
 
 // ../../node_modules/.pnpm/react-select@5.10.1_@types+react@19.1.0_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/react-select/dist/index-641ee5b8.esm.js
-var import_react42 = require("react");
+var import_react44 = require("react");
 var import_react_dom = require("react-dom");
 
 // ../../node_modules/.pnpm/@floating-ui+utils@0.2.9/node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs
@@ -5277,9 +5425,9 @@ function autoUpdate(reference, floating, update, options2) {
 }
 
 // ../../node_modules/.pnpm/use-isomorphic-layout-effect@1.2.0_@types+react@19.1.0_react@19.1.0/node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.esm.js
-var import_react40 = require("react");
+var import_react42 = require("react");
 var isClient = typeof document !== "undefined";
-var index = isClient ? import_react40.useLayoutEffect : import_react40.useEffect;
+var index = isClient ? import_react42.useLayoutEffect : import_react42.useEffect;
 
 // ../../node_modules/.pnpm/react-select@5.10.1_@types+react@19.1.0_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/react-select/dist/index-641ee5b8.esm.js
 var _excluded$4 = ["className", "clearValue", "cx", "getStyles", "getClassNames", "getValue", "hasValue", "isMulti", "isRtl", "options", "selectOption", "selectProps", "setValue", "theme"];
@@ -5613,13 +5761,13 @@ var menuCSS = function menuCSS2(_ref23, unstyled) {
     marginTop: spacing2.menuGutter
   });
 };
-var PortalPlacementContext = /* @__PURE__ */ (0, import_react42.createContext)(null);
+var PortalPlacementContext = /* @__PURE__ */ (0, import_react44.createContext)(null);
 var MenuPlacer = function MenuPlacer2(props) {
   var children = props.children, minMenuHeight = props.minMenuHeight, maxMenuHeight = props.maxMenuHeight, menuPlacement = props.menuPlacement, menuPosition = props.menuPosition, menuShouldScrollIntoView = props.menuShouldScrollIntoView, theme = props.theme;
-  var _ref3 = (0, import_react42.useContext)(PortalPlacementContext) || {}, setPortalPlacement = _ref3.setPortalPlacement;
-  var ref = (0, import_react42.useRef)(null);
-  var _useState = (0, import_react42.useState)(maxMenuHeight), _useState2 = _slicedToArray(_useState, 2), maxHeight = _useState2[0], setMaxHeight = _useState2[1];
-  var _useState3 = (0, import_react42.useState)(null), _useState4 = _slicedToArray(_useState3, 2), placement = _useState4[0], setPlacement = _useState4[1];
+  var _ref3 = (0, import_react44.useContext)(PortalPlacementContext) || {}, setPortalPlacement = _ref3.setPortalPlacement;
+  var ref = (0, import_react44.useRef)(null);
+  var _useState = (0, import_react44.useState)(maxMenuHeight), _useState2 = _slicedToArray(_useState, 2), maxHeight = _useState2[0], setMaxHeight = _useState2[1];
+  var _useState3 = (0, import_react44.useState)(null), _useState4 = _slicedToArray(_useState3, 2), placement = _useState4[0], setPlacement = _useState4[1];
   var controlHeight2 = theme.spacing.controlHeight;
   index(function() {
     var menuEl = ref.current;
@@ -5649,7 +5797,7 @@ var MenuPlacer = function MenuPlacer2(props) {
 };
 var Menu3 = function Menu4(props) {
   var children = props.children, innerRef = props.innerRef, innerProps = props.innerProps;
-  return jsx75("div", _extends({}, getStyleProps(props, "menu", {
+  return jsx76("div", _extends({}, getStyleProps(props, "menu", {
     menu: true
   }), {
     ref: innerRef
@@ -5671,7 +5819,7 @@ var menuListCSS = function menuListCSS2(_ref4, unstyled) {
 };
 var MenuList = function MenuList2(props) {
   var children = props.children, innerProps = props.innerProps, innerRef = props.innerRef, isMulti = props.isMulti;
-  return jsx75("div", _extends({}, getStyleProps(props, "menuList", {
+  return jsx76("div", _extends({}, getStyleProps(props, "menuList", {
     "menu-list": true,
     "menu-list--is-multi": isMulti
   }), {
@@ -5691,7 +5839,7 @@ var noOptionsMessageCSS = noticeCSS;
 var loadingMessageCSS = noticeCSS;
 var NoOptionsMessage = function NoOptionsMessage2(_ref6) {
   var _ref6$children = _ref6.children, children = _ref6$children === void 0 ? "No options" : _ref6$children, innerProps = _ref6.innerProps, restProps = _objectWithoutProperties(_ref6, _excluded$3);
-  return jsx75("div", _extends({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
+  return jsx76("div", _extends({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
     children,
     innerProps
   }), "noOptionsMessage", {
@@ -5701,7 +5849,7 @@ var NoOptionsMessage = function NoOptionsMessage2(_ref6) {
 };
 var LoadingMessage = function LoadingMessage2(_ref7) {
   var _ref7$children = _ref7.children, children = _ref7$children === void 0 ? "Loading..." : _ref7$children, innerProps = _ref7.innerProps, restProps = _objectWithoutProperties(_ref7, _excluded2$1);
-  return jsx75("div", _extends({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
+  return jsx76("div", _extends({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
     children,
     innerProps
   }), "loadingMessage", {
@@ -5721,16 +5869,16 @@ var menuPortalCSS = function menuPortalCSS2(_ref8) {
 };
 var MenuPortal = function MenuPortal2(props) {
   var appendTo = props.appendTo, children = props.children, controlElement = props.controlElement, innerProps = props.innerProps, menuPlacement = props.menuPlacement, menuPosition = props.menuPosition;
-  var menuPortalRef = (0, import_react42.useRef)(null);
-  var cleanupRef = (0, import_react42.useRef)(null);
-  var _useState5 = (0, import_react42.useState)(coercePlacement(menuPlacement)), _useState6 = _slicedToArray(_useState5, 2), placement = _useState6[0], setPortalPlacement = _useState6[1];
-  var portalPlacementContext = (0, import_react42.useMemo)(function() {
+  var menuPortalRef = (0, import_react44.useRef)(null);
+  var cleanupRef = (0, import_react44.useRef)(null);
+  var _useState5 = (0, import_react44.useState)(coercePlacement(menuPlacement)), _useState6 = _slicedToArray(_useState5, 2), placement = _useState6[0], setPortalPlacement = _useState6[1];
+  var portalPlacementContext = (0, import_react44.useMemo)(function() {
     return {
       setPortalPlacement
     };
   }, []);
-  var _useState7 = (0, import_react42.useState)(null), _useState8 = _slicedToArray(_useState7, 2), computedPosition = _useState8[0], setComputedPosition = _useState8[1];
-  var updateComputedPosition = (0, import_react42.useCallback)(function() {
+  var _useState7 = (0, import_react44.useState)(null), _useState8 = _slicedToArray(_useState7, 2), computedPosition = _useState8[0], setComputedPosition = _useState8[1];
+  var updateComputedPosition = (0, import_react44.useCallback)(function() {
     if (!controlElement) return;
     var rect = getBoundingClientObj(controlElement);
     var scrollDistance = menuPosition === "fixed" ? 0 : window.pageYOffset;
@@ -5745,7 +5893,7 @@ var MenuPortal = function MenuPortal2(props) {
   index(function() {
     updateComputedPosition();
   }, [updateComputedPosition]);
-  var runAutoUpdate = (0, import_react42.useCallback)(function() {
+  var runAutoUpdate = (0, import_react44.useCallback)(function() {
     if (typeof cleanupRef.current === "function") {
       cleanupRef.current();
       cleanupRef.current = null;
@@ -5759,12 +5907,12 @@ var MenuPortal = function MenuPortal2(props) {
   index(function() {
     runAutoUpdate();
   }, [runAutoUpdate]);
-  var setMenuPortalElement = (0, import_react42.useCallback)(function(menuPortalElement) {
+  var setMenuPortalElement = (0, import_react44.useCallback)(function(menuPortalElement) {
     menuPortalRef.current = menuPortalElement;
     runAutoUpdate();
   }, [runAutoUpdate]);
   if (!appendTo && menuPosition !== "fixed" || !computedPosition) return null;
-  var menuWrapper = jsx75("div", _extends({
+  var menuWrapper = jsx76("div", _extends({
     ref: setMenuPortalElement
   }, getStyleProps(_objectSpread2(_objectSpread2({}, props), {}, {
     offset: computedPosition.offset,
@@ -5773,7 +5921,7 @@ var MenuPortal = function MenuPortal2(props) {
   }), "menuPortal", {
     "menu-portal": true
   }), innerProps), children);
-  return jsx75(PortalPlacementContext.Provider, {
+  return jsx76(PortalPlacementContext.Provider, {
     value: portalPlacementContext
   }, appendTo ? /* @__PURE__ */ (0, import_react_dom.createPortal)(menuWrapper, appendTo) : menuWrapper);
 };
@@ -5789,7 +5937,7 @@ var containerCSS = function containerCSS2(_ref3) {
 };
 var SelectContainer = function SelectContainer2(props) {
   var children = props.children, innerProps = props.innerProps, isDisabled = props.isDisabled, isRtl = props.isRtl;
-  return jsx75("div", _extends({}, getStyleProps(props, "container", {
+  return jsx76("div", _extends({}, getStyleProps(props, "container", {
     "--is-disabled": isDisabled,
     "--is-rtl": isRtl
   }), innerProps), children);
@@ -5810,7 +5958,7 @@ var valueContainerCSS = function valueContainerCSS2(_ref23, unstyled) {
 };
 var ValueContainer = function ValueContainer2(props) {
   var children = props.children, innerProps = props.innerProps, isMulti = props.isMulti, hasValue = props.hasValue;
-  return jsx75("div", _extends({}, getStyleProps(props, "valueContainer", {
+  return jsx76("div", _extends({}, getStyleProps(props, "valueContainer", {
     "value-container": true,
     "value-container--is-multi": isMulti,
     "value-container--has-value": hasValue
@@ -5826,7 +5974,7 @@ var indicatorsContainerCSS = function indicatorsContainerCSS2() {
 };
 var IndicatorsContainer = function IndicatorsContainer2(props) {
   var children = props.children, innerProps = props.innerProps;
-  return jsx75("div", _extends({}, getStyleProps(props, "indicatorsContainer", {
+  return jsx76("div", _extends({}, getStyleProps(props, "indicatorsContainer", {
     indicators: true
   }), innerProps), children);
 };
@@ -5847,7 +5995,7 @@ var _ref2 = process.env.NODE_ENV === "production" ? {
 };
 var Svg = function Svg2(_ref3) {
   var size2 = _ref3.size, props = _objectWithoutProperties(_ref3, _excluded$2);
-  return jsx75("svg", _extends({
+  return jsx76("svg", _extends({
     height: size2,
     width: size2,
     viewBox: "0 0 20 20",
@@ -5857,16 +6005,16 @@ var Svg = function Svg2(_ref3) {
   }, props));
 };
 var CrossIcon = function CrossIcon2(props) {
-  return jsx75(Svg, _extends({
+  return jsx76(Svg, _extends({
     size: 20
-  }, props), jsx75("path", {
+  }, props), jsx76("path", {
     d: "M14.348 14.849c-0.469 0.469-1.229 0.469-1.697 0l-2.651-3.030-2.651 3.029c-0.469 0.469-1.229 0.469-1.697 0-0.469-0.469-0.469-1.229 0-1.697l2.758-3.15-2.759-3.152c-0.469-0.469-0.469-1.228 0-1.697s1.228-0.469 1.697 0l2.652 3.031 2.651-3.031c0.469-0.469 1.228-0.469 1.697 0s0.469 1.229 0 1.697l-2.758 3.152 2.758 3.15c0.469 0.469 0.469 1.229 0 1.698z"
   }));
 };
 var DownChevron = function DownChevron2(props) {
-  return jsx75(Svg, _extends({
+  return jsx76(Svg, _extends({
     size: 20
-  }, props), jsx75("path", {
+  }, props), jsx76("path", {
     d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
   }));
 };
@@ -5887,18 +6035,18 @@ var baseCSS = function baseCSS2(_ref3, unstyled) {
 var dropdownIndicatorCSS = baseCSS;
 var DropdownIndicator = function DropdownIndicator2(props) {
   var children = props.children, innerProps = props.innerProps;
-  return jsx75("div", _extends({}, getStyleProps(props, "dropdownIndicator", {
+  return jsx76("div", _extends({}, getStyleProps(props, "dropdownIndicator", {
     indicator: true,
     "dropdown-indicator": true
-  }), innerProps), children || jsx75(DownChevron, null));
+  }), innerProps), children || jsx76(DownChevron, null));
 };
 var clearIndicatorCSS = baseCSS;
 var ClearIndicator = function ClearIndicator2(props) {
   var children = props.children, innerProps = props.innerProps;
-  return jsx75("div", _extends({}, getStyleProps(props, "clearIndicator", {
+  return jsx76("div", _extends({}, getStyleProps(props, "clearIndicator", {
     indicator: true,
     "clear-indicator": true
-  }), innerProps), children || jsx75(CrossIcon, null));
+  }), innerProps), children || jsx76(CrossIcon, null));
 };
 var indicatorSeparatorCSS = function indicatorSeparatorCSS2(_ref4, unstyled) {
   var isDisabled = _ref4.isDisabled, _ref4$theme = _ref4.theme, baseUnit2 = _ref4$theme.spacing.baseUnit, colors2 = _ref4$theme.colors;
@@ -5914,7 +6062,7 @@ var indicatorSeparatorCSS = function indicatorSeparatorCSS2(_ref4, unstyled) {
 };
 var IndicatorSeparator = function IndicatorSeparator2(props) {
   var innerProps = props.innerProps;
-  return jsx75("span", _extends({}, innerProps, getStyleProps(props, "indicatorSeparator", {
+  return jsx76("span", _extends({}, innerProps, getStyleProps(props, "indicatorSeparator", {
     "indicator-separator": true
   })));
 };
@@ -5938,7 +6086,7 @@ var loadingIndicatorCSS = function loadingIndicatorCSS2(_ref5, unstyled) {
 };
 var LoadingDot = function LoadingDot2(_ref6) {
   var delay = _ref6.delay, offset2 = _ref6.offset;
-  return jsx75("span", {
+  return jsx76("span", {
     css: /* @__PURE__ */ css({
       animation: "".concat(loadingDotAnimations, " 1s ease-in-out ").concat(delay, "ms infinite;"),
       backgroundColor: "currentColor",
@@ -5953,20 +6101,20 @@ var LoadingDot = function LoadingDot2(_ref6) {
 };
 var LoadingIndicator = function LoadingIndicator2(_ref7) {
   var innerProps = _ref7.innerProps, isRtl = _ref7.isRtl, _ref7$size = _ref7.size, size2 = _ref7$size === void 0 ? 4 : _ref7$size, restProps = _objectWithoutProperties(_ref7, _excluded2);
-  return jsx75("div", _extends({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
+  return jsx76("div", _extends({}, getStyleProps(_objectSpread2(_objectSpread2({}, restProps), {}, {
     innerProps,
     isRtl,
     size: size2
   }), "loadingIndicator", {
     indicator: true,
     "loading-indicator": true
-  }), innerProps), jsx75(LoadingDot, {
+  }), innerProps), jsx76(LoadingDot, {
     delay: 0,
     offset: isRtl
-  }), jsx75(LoadingDot, {
+  }), jsx76(LoadingDot, {
     delay: 160,
     offset: true
-  }), jsx75(LoadingDot, {
+  }), jsx76(LoadingDot, {
     delay: 320,
     offset: !isRtl
   }));
@@ -5998,7 +6146,7 @@ var css$1 = function css2(_ref3, unstyled) {
 };
 var Control = function Control2(props) {
   var children = props.children, isDisabled = props.isDisabled, isFocused = props.isFocused, innerRef = props.innerRef, innerProps = props.innerProps, menuIsOpen = props.menuIsOpen;
-  return jsx75("div", _extends({
+  return jsx76("div", _extends({
     ref: innerRef
   }, getStyleProps(props, "control", {
     control: true,
@@ -6019,16 +6167,16 @@ var groupCSS = function groupCSS2(_ref3, unstyled) {
   };
 };
 var Group2 = function Group3(props) {
-  var children = props.children, cx = props.cx, getStyles = props.getStyles, getClassNames2 = props.getClassNames, Heading3 = props.Heading, headingProps = props.headingProps, innerProps = props.innerProps, label = props.label, theme = props.theme, selectProps = props.selectProps;
-  return jsx75("div", _extends({}, getStyleProps(props, "group", {
+  var children = props.children, cx = props.cx, getStyles = props.getStyles, getClassNames2 = props.getClassNames, Heading4 = props.Heading, headingProps = props.headingProps, innerProps = props.innerProps, label = props.label, theme = props.theme, selectProps = props.selectProps;
+  return jsx76("div", _extends({}, getStyleProps(props, "group", {
     group: true
-  }), innerProps), jsx75(Heading3, _extends({}, headingProps, {
+  }), innerProps), jsx76(Heading4, _extends({}, headingProps, {
     selectProps,
     theme,
     getStyles,
     getClassNames: getClassNames2,
     cx
-  }), label), jsx75("div", null, children));
+  }), label), jsx76("div", null, children));
 };
 var groupHeadingCSS = function groupHeadingCSS2(_ref23, unstyled) {
   var _ref2$theme = _ref23.theme, colors2 = _ref2$theme.colors, spacing2 = _ref2$theme.spacing;
@@ -6050,7 +6198,7 @@ var GroupHeading = function GroupHeading2(props) {
   var _cleanCommonProps = cleanCommonProps(props);
   _cleanCommonProps.data;
   var innerProps = _objectWithoutProperties(_cleanCommonProps, _excluded$1);
-  return jsx75("div", _extends({}, getStyleProps(props, "groupHeading", {
+  return jsx76("div", _extends({}, getStyleProps(props, "groupHeading", {
     "group-heading": true
   }), innerProps));
 };
@@ -6102,11 +6250,11 @@ var inputStyle = function inputStyle2(isHidden) {
 var Input2 = function Input3(props) {
   var cx = props.cx, value = props.value;
   var _cleanCommonProps = cleanCommonProps(props), innerRef = _cleanCommonProps.innerRef, isDisabled = _cleanCommonProps.isDisabled, isHidden = _cleanCommonProps.isHidden, inputClassName = _cleanCommonProps.inputClassName, innerProps = _objectWithoutProperties(_cleanCommonProps, _excluded3);
-  return jsx75("div", _extends({}, getStyleProps(props, "input", {
+  return jsx76("div", _extends({}, getStyleProps(props, "input", {
     "input-container": true
   }), {
     "data-value": value || ""
-  }), jsx75("input", _extends({
+  }), jsx76("input", _extends({
     className: cx({
       input: true
     }, inputClassName),
@@ -6160,35 +6308,35 @@ var multiValueRemoveCSS = function multiValueRemoveCSS2(_ref3, unstyled) {
 };
 var MultiValueGeneric = function MultiValueGeneric2(_ref4) {
   var children = _ref4.children, innerProps = _ref4.innerProps;
-  return jsx75("div", innerProps, children);
+  return jsx76("div", innerProps, children);
 };
 var MultiValueContainer = MultiValueGeneric;
 var MultiValueLabel = MultiValueGeneric;
 function MultiValueRemove(_ref5) {
   var children = _ref5.children, innerProps = _ref5.innerProps;
-  return jsx75("div", _extends({
+  return jsx76("div", _extends({
     role: "button"
-  }, innerProps), children || jsx75(CrossIcon, {
+  }, innerProps), children || jsx76(CrossIcon, {
     size: 14
   }));
 }
 var MultiValue = function MultiValue2(props) {
   var children = props.children, components2 = props.components, data = props.data, innerProps = props.innerProps, isDisabled = props.isDisabled, removeProps3 = props.removeProps, selectProps = props.selectProps;
   var Container2 = components2.Container, Label3 = components2.Label, Remove = components2.Remove;
-  return jsx75(Container2, {
+  return jsx76(Container2, {
     data,
     innerProps: _objectSpread2(_objectSpread2({}, getStyleProps(props, "multiValue", {
       "multi-value": true,
       "multi-value--is-disabled": isDisabled
     })), innerProps),
     selectProps
-  }, jsx75(Label3, {
+  }, jsx76(Label3, {
     data,
     innerProps: _objectSpread2({}, getStyleProps(props, "multiValueLabel", {
       "multi-value__label": true
     })),
     selectProps
-  }, children), jsx75(Remove, {
+  }, children), jsx76(Remove, {
     data,
     innerProps: _objectSpread2(_objectSpread2({}, getStyleProps(props, "multiValueRemove", {
       "multi-value__remove": true
@@ -6221,7 +6369,7 @@ var optionCSS = function optionCSS2(_ref3, unstyled) {
 };
 var Option = function Option2(props) {
   var children = props.children, isDisabled = props.isDisabled, isFocused = props.isFocused, isSelected = props.isSelected, innerRef = props.innerRef, innerProps = props.innerProps;
-  return jsx75("div", _extends({}, getStyleProps(props, "option", {
+  return jsx76("div", _extends({}, getStyleProps(props, "option", {
     option: true,
     "option--is-disabled": isDisabled,
     "option--is-focused": isFocused,
@@ -6245,7 +6393,7 @@ var placeholderCSS = function placeholderCSS2(_ref3, unstyled) {
 };
 var Placeholder = function Placeholder2(props) {
   var children = props.children, innerProps = props.innerProps;
-  return jsx75("div", _extends({}, getStyleProps(props, "placeholder", {
+  return jsx76("div", _extends({}, getStyleProps(props, "placeholder", {
     placeholder: true
   }), innerProps), children);
 };
@@ -6267,7 +6415,7 @@ var css3 = function css4(_ref3, unstyled) {
 };
 var SingleValue = function SingleValue2(props) {
   var children = props.children, isDisabled = props.isDisabled, innerProps = props.innerProps;
-  return jsx75("div", _extends({}, getStyleProps(props, "singleValue", {
+  return jsx76("div", _extends({}, getStyleProps(props, "singleValue", {
     "single-value": true,
     "single-value--is-disabled": isDisabled
   }), innerProps), children);
@@ -6369,7 +6517,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__$2
 };
 var A11yText = function A11yText2(props) {
-  return jsx75("span", _extends({
+  return jsx76("span", _extends({
     css: _ref
   }, props));
 };
@@ -6430,10 +6578,10 @@ var LiveRegion = function LiveRegion2(props) {
   var ariaLiveMessages = selectProps.ariaLiveMessages, getOptionLabel4 = selectProps.getOptionLabel, inputValue = selectProps.inputValue, isMulti = selectProps.isMulti, isOptionDisabled3 = selectProps.isOptionDisabled, isSearchable = selectProps.isSearchable, menuIsOpen = selectProps.menuIsOpen, options2 = selectProps.options, screenReaderStatus2 = selectProps.screenReaderStatus, tabSelectsValue = selectProps.tabSelectsValue, isLoading = selectProps.isLoading;
   var ariaLabel = selectProps["aria-label"];
   var ariaLive = selectProps["aria-live"];
-  var messages = (0, import_react43.useMemo)(function() {
+  var messages = (0, import_react45.useMemo)(function() {
     return _objectSpread2(_objectSpread2({}, defaultAriaLiveMessages), ariaLiveMessages || {});
   }, [ariaLiveMessages]);
-  var ariaSelected = (0, import_react43.useMemo)(function() {
+  var ariaSelected = (0, import_react45.useMemo)(function() {
     var message = "";
     if (ariaSelection && messages.onChange) {
       var option = ariaSelection.option, selectedOptions = ariaSelection.options, removedValue = ariaSelection.removedValue, removedValues = ariaSelection.removedValues, value = ariaSelection.value;
@@ -6455,7 +6603,7 @@ var LiveRegion = function LiveRegion2(props) {
     }
     return message;
   }, [ariaSelection, messages, isOptionDisabled3, selectValue, getOptionLabel4]);
-  var ariaFocused = (0, import_react43.useMemo)(function() {
+  var ariaFocused = (0, import_react45.useMemo)(function() {
     var focusMsg = "";
     var focused = focusedOption || focusedValue;
     var isSelected = !!(focusedOption && selectValue && selectValue.includes(focusedOption));
@@ -6474,7 +6622,7 @@ var LiveRegion = function LiveRegion2(props) {
     }
     return focusMsg;
   }, [focusedOption, focusedValue, getOptionLabel4, isOptionDisabled3, messages, focusableOptions, selectValue, isAppleDevice2]);
-  var ariaResults = (0, import_react43.useMemo)(function() {
+  var ariaResults = (0, import_react45.useMemo)(function() {
     var resultsMsg = "";
     if (menuIsOpen && options2.length && !isLoading && messages.onFilter) {
       var resultsMessage = screenReaderStatus2({
@@ -6488,7 +6636,7 @@ var LiveRegion = function LiveRegion2(props) {
     return resultsMsg;
   }, [focusableOptions, inputValue, menuIsOpen, messages, options2, screenReaderStatus2, isLoading]);
   var isInitialFocus = (ariaSelection === null || ariaSelection === void 0 ? void 0 : ariaSelection.action) === "initial-input-focus";
-  var ariaGuidance = (0, import_react43.useMemo)(function() {
+  var ariaGuidance = (0, import_react45.useMemo)(function() {
     var guidanceMsg = "";
     if (messages.guidance) {
       var context = focusedValue ? "value" : menuIsOpen ? "menu" : "input";
@@ -6504,18 +6652,18 @@ var LiveRegion = function LiveRegion2(props) {
     }
     return guidanceMsg;
   }, [ariaLabel, focusedOption, focusedValue, isMulti, isOptionDisabled3, isSearchable, menuIsOpen, messages, selectValue, tabSelectsValue, isInitialFocus]);
-  var ScreenReaderText = jsx75(import_react43.Fragment, null, jsx75("span", {
+  var ScreenReaderText = jsx76(import_react45.Fragment, null, jsx76("span", {
     id: "aria-selection"
-  }, ariaSelected), jsx75("span", {
+  }, ariaSelected), jsx76("span", {
     id: "aria-focused"
-  }, ariaFocused), jsx75("span", {
+  }, ariaFocused), jsx76("span", {
     id: "aria-results"
-  }, ariaResults), jsx75("span", {
+  }, ariaResults), jsx76("span", {
     id: "aria-guidance"
   }, ariaGuidance));
-  return jsx75(import_react43.Fragment, null, jsx75(A11yText$1, {
+  return jsx76(import_react45.Fragment, null, jsx76(A11yText$1, {
     id
-  }, isInitialFocus && ScreenReaderText), jsx75(A11yText$1, {
+  }, isInitialFocus && ScreenReaderText), jsx76(A11yText$1, {
     "aria-live": ariaLive,
     "aria-atomic": "false",
     "aria-relevant": "additions text",
@@ -6828,7 +6976,7 @@ var _excluded4 = ["innerRef"];
 function DummyInput(_ref3) {
   var innerRef = _ref3.innerRef, props = _objectWithoutProperties(_ref3, _excluded4);
   var filteredProps = removeProps(props, "onExited", "in", "enter", "exit", "appear");
-  return jsx75("input", _extends({
+  return jsx76("input", _extends({
     ref: innerRef
   }, filteredProps, {
     css: /* @__PURE__ */ css({
@@ -6860,11 +7008,11 @@ var cancelScroll = function cancelScroll2(event) {
 };
 function useScrollCapture(_ref3) {
   var isEnabled = _ref3.isEnabled, onBottomArrive = _ref3.onBottomArrive, onBottomLeave = _ref3.onBottomLeave, onTopArrive = _ref3.onTopArrive, onTopLeave = _ref3.onTopLeave;
-  var isBottom = (0, import_react43.useRef)(false);
-  var isTop = (0, import_react43.useRef)(false);
-  var touchStart = (0, import_react43.useRef)(0);
-  var scrollTarget = (0, import_react43.useRef)(null);
-  var handleEventDelta = (0, import_react43.useCallback)(function(event, delta) {
+  var isBottom = (0, import_react45.useRef)(false);
+  var isTop = (0, import_react45.useRef)(false);
+  var touchStart = (0, import_react45.useRef)(0);
+  var scrollTarget = (0, import_react45.useRef)(null);
+  var handleEventDelta = (0, import_react45.useCallback)(function(event, delta) {
     if (scrollTarget.current === null) return;
     var _scrollTarget$current = scrollTarget.current, scrollTop = _scrollTarget$current.scrollTop, scrollHeight = _scrollTarget$current.scrollHeight, clientHeight = _scrollTarget$current.clientHeight;
     var target = scrollTarget.current;
@@ -6898,17 +7046,17 @@ function useScrollCapture(_ref3) {
       cancelScroll(event);
     }
   }, [onBottomArrive, onBottomLeave, onTopArrive, onTopLeave]);
-  var onWheel = (0, import_react43.useCallback)(function(event) {
+  var onWheel = (0, import_react45.useCallback)(function(event) {
     handleEventDelta(event, event.deltaY);
   }, [handleEventDelta]);
-  var onTouchStart = (0, import_react43.useCallback)(function(event) {
+  var onTouchStart = (0, import_react45.useCallback)(function(event) {
     touchStart.current = event.changedTouches[0].clientY;
   }, []);
-  var onTouchMove = (0, import_react43.useCallback)(function(event) {
+  var onTouchMove = (0, import_react45.useCallback)(function(event) {
     var deltaY = touchStart.current - event.changedTouches[0].clientY;
     handleEventDelta(event, deltaY);
   }, [handleEventDelta]);
-  var startListening = (0, import_react43.useCallback)(function(el) {
+  var startListening = (0, import_react45.useCallback)(function(el) {
     if (!el) return;
     var notPassive = supportsPassiveEvents ? {
       passive: false
@@ -6917,13 +7065,13 @@ function useScrollCapture(_ref3) {
     el.addEventListener("touchstart", onTouchStart, notPassive);
     el.addEventListener("touchmove", onTouchMove, notPassive);
   }, [onTouchMove, onTouchStart, onWheel]);
-  var stopListening = (0, import_react43.useCallback)(function(el) {
+  var stopListening = (0, import_react45.useCallback)(function(el) {
     if (!el) return;
     el.removeEventListener("wheel", onWheel, false);
     el.removeEventListener("touchstart", onTouchStart, false);
     el.removeEventListener("touchmove", onTouchMove, false);
   }, [onTouchMove, onTouchStart, onWheel]);
-  (0, import_react43.useEffect)(function() {
+  (0, import_react45.useEffect)(function() {
     if (!isEnabled) return;
     var element = scrollTarget.current;
     startListening(element);
@@ -6970,9 +7118,9 @@ var listenerOptions = {
 };
 function useScrollLock(_ref3) {
   var isEnabled = _ref3.isEnabled, _ref$accountForScroll = _ref3.accountForScrollbars, accountForScrollbars = _ref$accountForScroll === void 0 ? true : _ref$accountForScroll;
-  var originalStyles = (0, import_react43.useRef)({});
-  var scrollTarget = (0, import_react43.useRef)(null);
-  var addScrollLock = (0, import_react43.useCallback)(function(touchScrollTarget) {
+  var originalStyles = (0, import_react45.useRef)({});
+  var scrollTarget = (0, import_react45.useRef)(null);
+  var addScrollLock = (0, import_react45.useCallback)(function(touchScrollTarget) {
     if (!canUseDOM) return;
     var target = document.body;
     var targetStyle = target && target.style;
@@ -7005,7 +7153,7 @@ function useScrollLock(_ref3) {
     }
     activeScrollLocks += 1;
   }, [accountForScrollbars]);
-  var removeScrollLock = (0, import_react43.useCallback)(function(touchScrollTarget) {
+  var removeScrollLock = (0, import_react45.useCallback)(function(touchScrollTarget) {
     if (!canUseDOM) return;
     var target = document.body;
     var targetStyle = target && target.style;
@@ -7026,7 +7174,7 @@ function useScrollLock(_ref3) {
       }
     }
   }, [accountForScrollbars]);
-  (0, import_react43.useEffect)(function() {
+  (0, import_react45.useEffect)(function() {
     if (!isEnabled) return;
     var element = scrollTarget.current;
     addScrollLock(element);
@@ -7070,7 +7218,7 @@ function ScrollManager(_ref3) {
     setScrollCaptureTarget(element);
     setScrollLockTarget(element);
   };
-  return jsx75(import_react43.Fragment, null, lockEnabled && jsx75("div", {
+  return jsx76(import_react45.Fragment, null, lockEnabled && jsx76("div", {
     onClick: blurSelectInput,
     css: _ref2$1
   }), children(targetRef));
@@ -7089,7 +7237,7 @@ var _ref22 = process.env.NODE_ENV === "production" ? {
 };
 var RequiredInput = function RequiredInput2(_ref3) {
   var name = _ref3.name, onFocus2 = _ref3.onFocus;
-  return jsx75("input", {
+  return jsx76("input", {
     required: true,
     name,
     tabIndex: -1,
@@ -8648,7 +8796,7 @@ var Select = /* @__PURE__ */ function(_Component) {
     }
   }]);
   return Select3;
-}(import_react43.Component);
+}(import_react45.Component);
 Select.defaultProps = defaultProps;
 
 // ../../node_modules/.pnpm/react-select@5.10.1_@types+react@19.1.0_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/react-select/dist/react-select.esm.js
@@ -8664,7 +8812,7 @@ var import_typeof5 = __toESM(require_typeof());
 var import_taggedTemplateLiteral2 = __toESM(require_taggedTemplateLiteral());
 var import_defineProperty3 = __toESM(require_defineProperty());
 var import_react_dom2 = require("react-dom");
-var StateManagedSelect = /* @__PURE__ */ (0, import_react45.forwardRef)(function(props, ref) {
+var StateManagedSelect = /* @__PURE__ */ (0, import_react47.forwardRef)(function(props, ref) {
   var baseSelectProps = useStateManager(props);
   return /* @__PURE__ */ React11.createElement(Select, _extends({
     ref
@@ -8673,11 +8821,11 @@ var StateManagedSelect = /* @__PURE__ */ (0, import_react45.forwardRef)(function
 var StateManagedSelect$1 = StateManagedSelect;
 
 // ../../node_modules/.pnpm/@react-aria+label@3.7.16_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/@react-aria/label/dist/useLabel.mjs
-var import_utils5 = require("@react-aria/utils");
+var import_utils6 = require("@react-aria/utils");
 function $d191a55c9702f145$export$8467354a121f1b9f(props) {
   let { id, label, "aria-labelledby": ariaLabelledby, "aria-label": ariaLabel, labelElementType = "label" } = props;
-  id = (0, import_utils5.useId)(id);
-  let labelId = (0, import_utils5.useId)();
+  id = (0, import_utils6.useId)(id);
+  let labelId = (0, import_utils6.useId)();
   let labelProps = {};
   if (label) {
     ariaLabelledby = ariaLabelledby ? `${labelId} ${ariaLabelledby}` : labelId;
@@ -8686,7 +8834,7 @@ function $d191a55c9702f145$export$8467354a121f1b9f(props) {
       htmlFor: labelElementType === "label" ? id : void 0
     };
   } else if (!ariaLabelledby && !ariaLabel) console.warn("If you do not provide a visible label, you must specify an aria-label or aria-labelledby attribute for accessibility");
-  let fieldProps = (0, import_utils5.useLabels)({
+  let fieldProps = (0, import_utils6.useLabels)({
     id,
     "aria-label": ariaLabel,
     "aria-labelledby": ariaLabelledby
@@ -8698,23 +8846,23 @@ function $d191a55c9702f145$export$8467354a121f1b9f(props) {
 }
 
 // ../../node_modules/.pnpm/@react-aria+label@3.7.16_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/@react-aria/label/dist/useField.mjs
-var import_utils6 = require("@react-aria/utils");
+var import_utils7 = require("@react-aria/utils");
 function $2baaea4c71418dea$export$294aa081a6c6f55d(props) {
   let { description, errorMessage, isInvalid, validationState } = props;
   let { labelProps, fieldProps } = (0, $d191a55c9702f145$export$8467354a121f1b9f)(props);
-  let descriptionId = (0, import_utils6.useSlotId)([
+  let descriptionId = (0, import_utils7.useSlotId)([
     Boolean(description),
     Boolean(errorMessage),
     isInvalid,
     validationState
   ]);
-  let errorMessageId = (0, import_utils6.useSlotId)([
+  let errorMessageId = (0, import_utils7.useSlotId)([
     Boolean(description),
     Boolean(errorMessage),
     isInvalid,
     validationState
   ]);
-  fieldProps = (0, import_utils6.mergeProps)(fieldProps, {
+  fieldProps = (0, import_utils7.mergeProps)(fieldProps, {
     "aria-describedby": [
       descriptionId,
       // Use aria-describedby for error message because aria-errormessage is unsupported using VoiceOver or NVDA. See https://github.com/adobe/react-spectrum/issues/1346#issuecomment-740136268
@@ -8735,9 +8883,9 @@ function $2baaea4c71418dea$export$294aa081a6c6f55d(props) {
 }
 
 // src/Multiselect/Multiselect.tsx
-var import_utils7 = require("@react-aria/utils");
+var import_utils8 = require("@react-aria/utils");
 var import_system64 = require("@marigold/system");
-var import_jsx_runtime75 = require("react/jsx-runtime");
+var import_jsx_runtime76 = require("react/jsx-runtime");
 var propsToBeRemoved = [
   "clearValue",
   "getStyles",
@@ -8763,8 +8911,8 @@ var Input4 = ({ innerRef, placeholder, hasValue, ...props }) => {
     },
     {}
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
-    import_react_aria_components43.Input,
+  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+    import_react_aria_components45.Input,
     {
       disabled: props.isDisabled,
       ref: innerRef,
@@ -8774,11 +8922,11 @@ var Input4 = ({ innerRef, placeholder, hasValue, ...props }) => {
   );
 };
 var MultiValueRemove2 = ({ innerProps }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(import_react_aria_components43.Button, { slot: "remove", ...innerProps, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("svg", { viewBox: "0 0 20 20", fill: "currentColor", width: 20, height: 20, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("path", { d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_react_aria_components45.Button, { slot: "remove", ...innerProps, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("svg", { viewBox: "0 0 20 20", fill: "currentColor", width: 20, height: 20, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("path", { d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" }) }) });
 };
 var getClassNames = (classNames3) => ({
   control: () => (0, import_system64.cn)(
-    "relative flex items-center box-border flex-wrap justify-between ",
+    "relative flex items-center box-border flex-wrap justify-between",
     classNames3.container
   ),
   container: () => "pointer-events-auto",
@@ -8826,12 +8974,12 @@ var Multiselect = ({
     label: props.label,
     errorMessage
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
-    import_react_aria_components43.Provider,
+  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+    import_react_aria_components45.Provider,
     {
       values: [
         [
-          import_react_aria_components43.FieldErrorContext,
+          import_react_aria_components45.FieldErrorContext,
           {
             isInvalid: !!error,
             validationDetails: {},
@@ -8839,7 +8987,7 @@ var Multiselect = ({
           }
         ],
         [
-          import_react_aria_components43.InputContext,
+          import_react_aria_components45.InputContext,
           {
             ...fieldProps,
             placeholder,
@@ -8847,7 +8995,7 @@ var Multiselect = ({
           }
         ],
         [
-          import_react_aria_components43.ButtonContext,
+          import_react_aria_components45.ButtonContext,
           {
             // react-select doesn't handle readonly so we had to do it manually here
             // keep to the button disabled in read only to prevent menu from opening
@@ -8856,7 +9004,7 @@ var Multiselect = ({
           }
         ]
       ],
-      children: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
         "div",
         {
           className: (0, import_system64.cn)(classNames3.field, "group/field"),
@@ -8864,8 +9012,8 @@ var Multiselect = ({
           "data-invalid": error,
           "data-readonly": readOnly,
           children: [
-            props.label && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(_Label, { ...labelProps, children: props.label }),
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+            props.label && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(_Label, { ...labelProps, children: props.label }),
+            /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
               StateManagedSelect$1,
               {
                 ...props,
@@ -8889,7 +9037,7 @@ var Multiselect = ({
                 inputId: fieldProps.id,
                 "aria-invalid": error,
                 isClearable: false,
-                instanceId: (0, import_utils7.useId)(),
+                instanceId: (0, import_utils8.useId)(),
                 isSearchable: !readOnly,
                 isMulti: true,
                 closeMenuOnSelect: false,
@@ -8899,19 +9047,19 @@ var Multiselect = ({
                 components: {
                   Input: Input4,
                   MultiValueRemove: MultiValueRemove2,
-                  DropdownIndicator: ({ innerProps, isDisabled }) => /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+                  DropdownIndicator: ({ innerProps, isDisabled }) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
                     "button",
                     {
                       ...innerProps,
                       disabled: isDisabled,
                       className: classNames3.icon,
-                      children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ChevronDown, { className: "size-4" })
+                      children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(ChevronDown, { className: "size-4" })
                     }
                   )
                 }
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(HelpText, { description, errorMessage })
+            /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(HelpText, { description, errorMessage })
           ]
         }
       )
@@ -8920,15 +9068,15 @@ var Multiselect = ({
 };
 
 // src/NumberField/NumberField.tsx
-var import_react46 = require("react");
-var import_react_aria_components45 = require("react-aria-components");
+var import_react48 = require("react");
+var import_react_aria_components47 = require("react-aria-components");
 var import_system66 = require("@marigold/system");
 
 // src/NumberField/StepButton.tsx
-var import_react_aria_components44 = require("react-aria-components");
+var import_react_aria_components46 = require("react-aria-components");
 var import_system65 = require("@marigold/system");
-var import_jsx_runtime76 = require("react/jsx-runtime");
-var Plus = () => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("svg", { width: 16, height: 16, viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+var import_jsx_runtime77 = require("react/jsx-runtime");
+var Plus = () => /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("svg", { width: 16, height: 16, viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
   "path",
   {
     fillRule: "evenodd",
@@ -8936,7 +9084,7 @@ var Plus = () => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("svg", { width: 1
     d: "M10 3a1 1 0 011 1v5h5a1 1 0 110 2h-5v5a1 1 0 11-2 0v-5H4a1 1 0 110-2h5V4a1 1 0 011-1z"
   }
 ) });
-var Minus = () => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("svg", { width: 16, height: 16, viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+var Minus = () => /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("svg", { width: 16, height: 16, viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
   "path",
   {
     fillRule: "evenodd",
@@ -8946,8 +9094,8 @@ var Minus = () => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("svg", { width:
 ) });
 var _StepButton = ({ direction, className, ...props }) => {
   const Icon4 = direction === "up" ? Plus : Minus;
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
-    import_react_aria_components44.Button,
+  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+    import_react_aria_components46.Button,
     {
       className: (0, import_system65.cn)(
         [
@@ -8957,14 +9105,14 @@ var _StepButton = ({ direction, className, ...props }) => {
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Icon4, {})
+      children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(Icon4, {})
     }
   );
 };
 
 // src/NumberField/NumberField.tsx
-var import_jsx_runtime77 = require("react/jsx-runtime");
-var _NumberField = (0, import_react46.forwardRef)(
+var import_jsx_runtime78 = require("react/jsx-runtime");
+var _NumberField = (0, import_react48.forwardRef)(
   ({
     variant,
     size: size2,
@@ -8988,15 +9136,15 @@ var _NumberField = (0, import_react46.forwardRef)(
       ...rest
     };
     const showStepper = !hideStepper && !readOnly;
-    return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
       FieldBase,
       {
-        as: import_react_aria_components45.NumberField,
+        as: import_react_aria_components47.NumberField,
         ...props,
         "data-readonly": readOnly ? "true" : void 0,
         "data-stepper": showStepper ? "true" : void 0,
-        children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_react_aria_components45.Group, { className: (0, import_system66.cn)("flex items-stretch", classNames3.group), children: [
-          showStepper && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(import_react_aria_components47.Group, { className: (0, import_system66.cn)("flex items-stretch", classNames3.group), children: [
+          showStepper && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
             _StepButton,
             {
               className: classNames3.stepper,
@@ -9004,14 +9152,14 @@ var _NumberField = (0, import_react46.forwardRef)(
               slot: "decrement"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
-            import_react_aria_components45.Input,
+          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+            import_react_aria_components47.Input,
             {
               ref,
               className: (0, import_system66.cn)("h-full flex-1 outline-none", classNames3.input)
             }
           ),
-          showStepper && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+          showStepper && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
             _StepButton,
             {
               className: classNames3.stepper,
@@ -9025,160 +9173,6 @@ var _NumberField = (0, import_react46.forwardRef)(
   }
 );
 
-// src/Overlay/NonModal.tsx
-var import_react48 = require("react");
-var import_react_aria_components46 = require("react-aria-components");
-var import_react_stately = require("react-stately");
-var import_focus = require("@react-aria/focus");
-var import_overlays2 = require("@react-aria/overlays");
-var import_ssr2 = require("@react-aria/ssr");
-var import_utils8 = require("@react-aria/utils");
-
-// src/utils/useRenderProps.tsx
-var import_react47 = require("react");
-function useRenderProps(props) {
-  let {
-    className,
-    style,
-    children,
-    defaultClassName = void 0,
-    defaultChildren = void 0,
-    defaultStyle,
-    values
-  } = props;
-  return (0, import_react47.useMemo)(() => {
-    let computedClassName;
-    let computedStyle;
-    let computedChildren;
-    if (typeof className === "function") {
-      computedClassName = className({ ...values, defaultClassName });
-    } else {
-      computedClassName = className;
-    }
-    if (typeof style === "function") {
-      computedStyle = style({ ...values, defaultStyle: defaultStyle || {} });
-    } else {
-      computedStyle = style;
-    }
-    if (typeof children === "function") {
-      computedChildren = children({ ...values, defaultChildren });
-    } else if (children == null) {
-      computedChildren = defaultChildren;
-    } else {
-      computedChildren = children;
-    }
-    return {
-      className: computedClassName != null ? computedClassName : defaultClassName,
-      style: computedStyle || defaultStyle ? { ...defaultStyle, ...computedStyle } : void 0,
-      children: computedChildren != null ? computedChildren : defaultChildren,
-      "data-rac": ""
-    };
-  }, [
-    className,
-    style,
-    children,
-    defaultClassName,
-    defaultChildren,
-    defaultStyle,
-    values
-  ]);
-}
-
-// src/Overlay/useNonModal.ts
-var import_overlays = require("@react-aria/overlays");
-var useNonModal = ({ nonModalRef, keyboardDismissable = true }, state) => {
-  let { overlayProps } = (0, import_overlays.useOverlay)(
-    {
-      isOpen: state.isOpen,
-      onClose: state.close,
-      shouldCloseOnBlur: false,
-      isDismissable: false,
-      isKeyboardDismissDisabled: keyboardDismissable ? false : true
-    },
-    nonModalRef
-  );
-  return {
-    nonModalProps: overlayProps
-  };
-};
-
-// src/Overlay/NonModal.tsx
-var import_jsx_runtime78 = require("react/jsx-runtime");
-var NonModalInner = ({ state, isExiting, ...props }) => {
-  const { nonModalProps } = useNonModal(props, state);
-  const ref = props.nonModalRef;
-  const portalContainer = usePortalContainer();
-  const isEntering = (0, import_utils8.useEnterAnimation)(ref) || props.isEntering || false;
-  const renderProps = useRenderProps({
-    ...props,
-    defaultClassName: "react-aria-NonModalOverlay",
-    values: {
-      isEntering,
-      isExiting,
-      state
-    }
-  });
-  const viewport = (0, import_utils8.useViewportSize)();
-  const style = {
-    ...renderProps.style,
-    "--visual-viewport-height": viewport.height + "px"
-  };
-  const overlay = /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
-    "div",
-    {
-      ...(0, import_utils8.mergeProps)((0, import_utils8.filterDOMProps)(props), nonModalProps),
-      ...renderProps,
-      tabIndex: -1,
-      "aria-label": props["aria-label"],
-      "aria-labelledby": props["aria-labelledby"],
-      ref,
-      slot: props.slot || void 0,
-      style,
-      "data-entering": isEntering || void 0,
-      "data-exiting": isExiting || void 0,
-      children: [
-        renderProps.children,
-        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_overlays2.DismissButton, { onDismiss: state.close })
-      ]
-    }
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
-    import_overlays2.Overlay,
-    {
-      isExiting,
-      portalContainer,
-      disableFocusManagement: true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_focus.FocusScope, { restoreFocus: true, children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_react_aria_components46.Provider, { values: [[import_react_aria_components46.OverlayTriggerStateContext, state]], children: overlay }) })
-    }
-  );
-};
-var NonModal = (0, import_react48.forwardRef)(
-  ({ open, ...rest }, ref) => {
-    const props = {
-      isOpen: open,
-      ...rest
-    };
-    ref = (0, import_utils8.useObjectRef)(ref);
-    const contextState = (0, import_react48.useContext)(import_react_aria_components46.OverlayTriggerStateContext);
-    const localState = (0, import_react_stately.useOverlayTriggerState)(props);
-    const state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;
-    const isExiting = (0, import_utils8.useExitAnimation)(ref, state.isOpen) || props.isExiting || false;
-    const isSSR = (0, import_ssr2.useIsSSR)();
-    if (state && !state.isOpen && !isExiting || isSSR) {
-      return null;
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
-      NonModalInner,
-      {
-        ...props,
-        nonModalRef: ref,
-        state,
-        isExiting
-      }
-    );
-  }
-);
-
 // src/Pagination/Pagination.tsx
 var import_react52 = require("react");
 var import_system69 = require("@marigold/system");
@@ -9276,7 +9270,7 @@ var PageButton = (props) => {
 
 // src/Pagination/useKeyboardNavigation.tsx
 var import_react51 = require("react");
-var import_interactions = require("@react-aria/interactions");
+var import_interactions2 = require("@react-aria/interactions");
 var NavigationTypes = {
   Prev: "prev",
   Next: "next",
@@ -9332,7 +9326,7 @@ var useKeyboardNavigation = ({
     },
     [isItemDisabled]
   );
-  const { keyboardProps } = (0, import_interactions.useKeyboard)({
+  const { keyboardProps } = (0, import_interactions2.useKeyboard)({
     onKeyDown: (e) => {
       let newFocusedItem = focusedItem;
       switch (e.key) {
@@ -9520,7 +9514,7 @@ var _Pagination = ({
 
 // src/Radio/Radio.tsx
 var import_react54 = require("react");
-var import_react_aria_components48 = require("react-aria-components");
+var import_react_aria_components49 = require("react-aria-components");
 var import_system71 = require("@marigold/system");
 
 // src/Radio/Context.ts
@@ -9531,7 +9525,7 @@ var RadioGroupContext = (0, import_react53.createContext)(
 var useRadioGroupContext = () => (0, import_react53.useContext)(RadioGroupContext);
 
 // src/Radio/RadioGroup.tsx
-var import_react_aria_components47 = require("react-aria-components");
+var import_react_aria_components48 = require("react-aria-components");
 var import_system70 = require("@marigold/system");
 var import_jsx_runtime83 = require("react/jsx-runtime");
 var _RadioGroup = ({
@@ -9560,7 +9554,7 @@ var _RadioGroup = ({
   return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
     FieldBase,
     {
-      as: import_react_aria_components47.RadioGroup,
+      as: import_react_aria_components48.RadioGroup,
       width,
       label,
       description,
@@ -9610,7 +9604,7 @@ var _Radio = (0, import_react54.forwardRef)(
       size: size2 || props.size
     });
     return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
-      import_react_aria_components48.Radio,
+      import_react_aria_components49.Radio,
       {
         ref,
         className: (0, import_system71.cn)(
@@ -9643,7 +9637,7 @@ _Radio.Group = _RadioGroup;
 
 // src/SearchField/SearchField.tsx
 var import_react55 = require("react");
-var import_react_aria_components49 = require("react-aria-components");
+var import_react_aria_components50 = require("react-aria-components");
 var import_jsx_runtime85 = require("react/jsx-runtime");
 var _SearchField = (0, import_react55.forwardRef)(
   ({ disabled, required, readOnly, error, action, ...rest }, ref) => {
@@ -9654,7 +9648,7 @@ var _SearchField = (0, import_react55.forwardRef)(
       isReadOnly: readOnly,
       isInvalid: error
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(FieldBase, { as: import_react_aria_components49.SearchField, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(FieldBase, { as: import_react_aria_components50.SearchField, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
       SearchInput,
       {
         ref,
@@ -9666,7 +9660,7 @@ var _SearchField = (0, import_react55.forwardRef)(
 
 // src/Select/Select.tsx
 var import_react56 = require("react");
-var import_react_aria_components50 = require("react-aria-components");
+var import_react_aria_components51 = require("react-aria-components");
 var import_system72 = require("@marigold/system");
 var import_jsx_runtime86 = require("react/jsx-runtime");
 var _Select = (0, import_react56.forwardRef)(
@@ -9690,7 +9684,7 @@ var _Select = (0, import_react56.forwardRef)(
       ...rest
     };
     const classNames3 = (0, import_system72.useClassNames)({ component: "Select", variant, size: size2 });
-    return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(FieldBase, { as: import_react_aria_components50.Select, ref, variant, size: size2, ...props, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(FieldBase, { as: import_react_aria_components51.Select, ref, variant, size: size2, ...props, children: [
       /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(
         IconButton,
         {
@@ -9699,7 +9693,7 @@ var _Select = (0, import_react56.forwardRef)(
             classNames3.select
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(import_react_aria_components50.SelectValue, { className: "[&>[slot=description]]:hidden" }),
+            /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(import_react_aria_components51.SelectValue, { className: "[&>[slot=description]]:hidden" }),
             /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(ChevronDown, { className: (0, import_system72.cn)("size-4", classNames3.icon) })
           ]
         }
@@ -9713,7 +9707,7 @@ _Select.Section = _ListBox.Section;
 
 // src/SelectList/SelectList.tsx
 var import_react59 = require("react");
-var import_react_aria_components52 = require("react-aria-components");
+var import_react_aria_components53 = require("react-aria-components");
 var import_system74 = require("@marigold/system");
 
 // src/SelectList/Context.ts
@@ -9725,7 +9719,7 @@ var useSelectListContext = () => (0, import_react57.useContext)(SelectListContex
 
 // src/SelectList/SelectListItem.tsx
 var import_react58 = require("react");
-var import_react_aria_components51 = require("react-aria-components");
+var import_react_aria_components52 = require("react-aria-components");
 var import_system73 = require("@marigold/system");
 var import_jsx_runtime87 = require("react/jsx-runtime");
 var _SelectListItem = (0, import_react58.forwardRef)(
@@ -9733,7 +9727,7 @@ var _SelectListItem = (0, import_react58.forwardRef)(
     let textValue = typeof children === "string" ? children : void 0;
     const { classNames: classNames3 } = useSelectListContext();
     return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
-      import_react_aria_components51.GridListItem,
+      import_react_aria_components52.GridListItem,
       {
         textValue,
         ...props,
@@ -9758,7 +9752,7 @@ var _SelectList = (0, import_react59.forwardRef)(
       ...rest
     };
     return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(SelectListContext.Provider, { value: { classNames: classNames3 }, children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: classNames3.container, children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
-      import_react_aria_components52.GridList,
+      import_react_aria_components53.GridList,
       {
         ...props,
         layout: "grid",
@@ -9794,7 +9788,7 @@ var Scrollable = ({
 
 // src/Slider/Slider.tsx
 var import_react60 = require("react");
-var import_react_aria_components53 = require("react-aria-components");
+var import_react_aria_components54 = require("react-aria-components");
 var import_system76 = require("@marigold/system");
 var import_jsx_runtime90 = require("react/jsx-runtime");
 var _Slider = (0, import_react60.forwardRef)(
@@ -9819,7 +9813,7 @@ var _Slider = (0, import_react60.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(
       FieldBase,
       {
-        as: import_react_aria_components53.Slider,
+        as: import_react_aria_components54.Slider,
         className: (0, import_system76.cn)(
           "grid grid-cols-[auto_1fr] gap-y-1",
           classNames3.container,
@@ -9829,9 +9823,9 @@ var _Slider = (0, import_react60.forwardRef)(
         ...props,
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(_Label, { children: props.children && props.children || label && label }),
-          /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(import_react_aria_components53.SliderOutput, { className: (0, import_system76.cn)("flex justify-end", classNames3.output), children: ({ state }) => state.values.map((_, i) => state.getThumbValueLabel(i)).join(" \u2013 ") }),
+          /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(import_react_aria_components54.SliderOutput, { className: (0, import_system76.cn)("flex justify-end", classNames3.output), children: ({ state }) => state.values.map((_, i) => state.getThumbValueLabel(i)).join(" \u2013 ") }),
           /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
-            import_react_aria_components53.SliderTrack,
+            import_react_aria_components54.SliderTrack,
             {
               className: (0, import_system76.cn)("relative col-span-2 h-2 w-full", classNames3.track),
               children: ({ state }) => /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(import_jsx_runtime90.Fragment, { children: [
@@ -9858,7 +9852,7 @@ var _Slider = (0, import_react60.forwardRef)(
                   }
                 ),
                 state.values.map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
-                  import_react_aria_components53.SliderThumb,
+                  import_react_aria_components54.SliderThumb,
                   {
                     className: (0, import_system76.cn)("top-1/2 cursor-pointer", classNames3.thumb),
                     index: i,
@@ -9910,7 +9904,7 @@ var Stack = ({
 
 // src/Switch/Switch.tsx
 var import_react61 = require("react");
-var import_react_aria_components54 = require("react-aria-components");
+var import_react_aria_components55 = require("react-aria-components");
 var import_system78 = require("@marigold/system");
 var import_jsx_runtime93 = require("react/jsx-runtime");
 var _Switch = (0, import_react61.forwardRef)(
@@ -9932,7 +9926,7 @@ var _Switch = (0, import_react61.forwardRef)(
       ...rest
     };
     return /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(
-      import_react_aria_components54.Switch,
+      import_react_aria_components55.Switch,
       {
         ...props,
         ref,
@@ -10088,7 +10082,7 @@ var TableCheckboxCell = ({ cell }) => {
 // src/Table/TableColumnHeader.tsx
 var import_react65 = require("react");
 var import_focus4 = require("@react-aria/focus");
-var import_interactions2 = require("@react-aria/interactions");
+var import_interactions3 = require("@react-aria/interactions");
 var import_table4 = require("@react-aria/table");
 var import_utils12 = require("@react-aria/utils");
 var import_system81 = require("@marigold/system");
@@ -10108,7 +10102,7 @@ var TableColumnHeader = ({
     state,
     ref
   );
-  const { hoverProps, isHovered } = (0, import_interactions2.useHover)({});
+  const { hoverProps, isHovered } = (0, import_interactions3.useHover)({});
   const { focusProps, isFocusVisible } = (0, import_focus4.useFocusRing)();
   const stateProps = (0, import_system81.useStateProps)({
     hover: isHovered,
@@ -10171,7 +10165,7 @@ var TableHeaderRow = ({
 // src/Table/TableRow.tsx
 var import_react67 = require("react");
 var import_focus5 = require("@react-aria/focus");
-var import_interactions3 = require("@react-aria/interactions");
+var import_interactions4 = require("@react-aria/interactions");
 var import_table7 = require("@react-aria/table");
 var import_utils13 = require("@react-aria/utils");
 var import_system83 = require("@marigold/system");
@@ -10195,7 +10189,7 @@ var TableRow = ({ children, row }) => {
   const disabled = state.disabledKeys.has(row.key);
   const selected = state.selectionManager.isSelected(row.key);
   const { focusProps, isFocusVisible } = (0, import_focus5.useFocusRing)();
-  const { hoverProps, isHovered } = (0, import_interactions3.useHover)({
+  const { hoverProps, isHovered } = (0, import_interactions4.useHover)({
     isDisabled: disabled || !interactive
   });
   const stateProps = (0, import_system83.useStateProps)({
@@ -10225,7 +10219,7 @@ var TableRow = ({ children, row }) => {
 // src/Table/TableSelectAllCell.tsx
 var import_react68 = require("react");
 var import_focus6 = require("@react-aria/focus");
-var import_interactions4 = require("@react-aria/interactions");
+var import_interactions5 = require("@react-aria/interactions");
 var import_table8 = require("@react-aria/table");
 var import_utils14 = require("@react-aria/utils");
 var import_system84 = require("@marigold/system");
@@ -10245,7 +10239,7 @@ var TableSelectAllCell = ({
     ref
   );
   const { checkboxProps } = mapCheckboxProps((0, import_table8.useTableSelectAllCheckbox)(state));
-  const { hoverProps, isHovered } = (0, import_interactions4.useHover)({});
+  const { hoverProps, isHovered } = (0, import_interactions5.useHover)({});
   const { focusProps, isFocusVisible } = (0, import_focus6.useFocusRing)();
   const stateProps = (0, import_system84.useStateProps)({
     hover: isHovered,
@@ -10369,7 +10363,7 @@ Table.Header = import_table10.TableHeader;
 Table.Row = import_table10.Row;
 
 // src/Text/Text.tsx
-var import_react_aria_components55 = require("react-aria-components");
+var import_react_aria_components56 = require("react-aria-components");
 var import_system86 = require("@marigold/system");
 var import_jsx_runtime103 = require("react/jsx-runtime");
 var _Text = ({
@@ -10390,7 +10384,7 @@ var _Text = ({
     variant,
     size: size2
   });
-  const Component2 = props.slot ? import_react_aria_components55.Text : as;
+  const Component2 = props.slot ? import_react_aria_components56.Text : as;
   const elementType = props.slot ? { elementType: as } : {};
   return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
     Component2,
@@ -10415,7 +10409,7 @@ var _Text = ({
 
 // src/TextArea/TextArea.tsx
 var import_react70 = require("react");
-var import_react_aria_components56 = require("react-aria-components");
+var import_react_aria_components57 = require("react-aria-components");
 var import_system87 = require("@marigold/system");
 var import_jsx_runtime104 = require("react/jsx-runtime");
 var _TextArea = (0, import_react70.forwardRef)(
@@ -10437,13 +10431,13 @@ var _TextArea = (0, import_react70.forwardRef)(
       isRequired: required,
       ...rest
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(FieldBase, { as: import_react_aria_components56.TextField, ...props, variant, size: size2, children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_react_aria_components56.TextArea, { className: classNames3, ref, rows }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(FieldBase, { as: import_react_aria_components57.TextField, ...props, variant, size: size2, children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_react_aria_components57.TextArea, { className: classNames3, ref, rows }) });
   }
 );
 
 // src/TextField/TextField.tsx
 var import_react71 = require("react");
-var import_react_aria_components57 = require("react-aria-components");
+var import_react_aria_components58 = require("react-aria-components");
 var import_jsx_runtime105 = require("react/jsx-runtime");
 var _TextField = (0, import_react71.forwardRef)(
   ({ required, disabled, readOnly, error, ...rest }, ref) => {
@@ -10454,7 +10448,7 @@ var _TextField = (0, import_react71.forwardRef)(
       isRequired: required,
       ...rest
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(FieldBase, { as: import_react_aria_components57.TextField, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(_Input, { ref }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(FieldBase, { as: import_react_aria_components58.TextField, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(_Input, { ref }) });
   }
 );
 
@@ -10490,11 +10484,11 @@ var Tiles = ({
 };
 
 // src/Tooltip/Tooltip.tsx
-var import_react_aria_components59 = require("react-aria-components");
+var import_react_aria_components60 = require("react-aria-components");
 var import_system89 = require("@marigold/system");
 
 // src/Tooltip/TooltipTrigger.tsx
-var import_react_aria_components58 = require("react-aria-components");
+var import_react_aria_components59 = require("react-aria-components");
 var import_jsx_runtime107 = require("react/jsx-runtime");
 var _TooltipTrigger = ({
   delay = 1e3,
@@ -10509,7 +10503,7 @@ var _TooltipTrigger = ({
     isOpen: open,
     delay
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_react_aria_components58.TooltipTrigger, { ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_react_aria_components59.TooltipTrigger, { ...props, children });
 };
 
 // src/Tooltip/Tooltip.tsx
@@ -10522,13 +10516,13 @@ var _Tooltip = ({ children, variant, size: size2, open, ...rest }) => {
   const classNames3 = (0, import_system89.useClassNames)({ component: "Tooltip", variant, size: size2 });
   const portal = usePortalContainer();
   return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
-    import_react_aria_components59.Tooltip,
+    import_react_aria_components60.Tooltip,
     {
       ...props,
       className: (0, import_system89.cn)("group/tooltip", classNames3.container),
       UNSTABLE_portalContainer: portal,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_react_aria_components59.OverlayArrow, { className: classNames3.arrow, children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("svg", { width: 8, height: 8, viewBox: "0 0 8 8", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("path", { d: "M0 0 L4 4 L8 0" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_react_aria_components60.OverlayArrow, { className: classNames3.arrow, children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("svg", { width: 8, height: 8, viewBox: "0 0 8 8", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("path", { d: "M0 0 L4 4 L8 0" }) }) }),
         children
       ]
     }
@@ -10537,11 +10531,11 @@ var _Tooltip = ({ children, variant, size: size2, open, ...rest }) => {
 _Tooltip.Trigger = _TooltipTrigger;
 
 // src/TagGroup/Tag.tsx
-var import_react_aria_components61 = require("react-aria-components");
+var import_react_aria_components62 = require("react-aria-components");
 var import_system91 = require("@marigold/system");
 
 // src/TagGroup/TagGroup.tsx
-var import_react_aria_components60 = require("react-aria-components");
+var import_react_aria_components61 = require("react-aria-components");
 var import_system90 = require("@marigold/system");
 var import_jsx_runtime109 = require("react/jsx-runtime");
 var _TagGroup = ({
@@ -10554,8 +10548,8 @@ var _TagGroup = ({
   ...rest
 }) => {
   const classNames3 = (0, import_system90.useClassNames)({ component: "Tag", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(FieldBase, { as: import_react_aria_components60.TagGroup, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
-    import_react_aria_components60.TagList,
+  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(FieldBase, { as: import_react_aria_components61.TagGroup, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+    import_react_aria_components61.TagList,
     {
       items,
       className: classNames3.listItems,
@@ -10568,7 +10562,7 @@ var _TagGroup = ({
 // src/TagGroup/Tag.tsx
 var import_jsx_runtime110 = require("react/jsx-runtime");
 var CloseButton2 = ({ className }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_react_aria_components61.Button, { slot: "remove", className, children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("svg", { viewBox: "0 0 20 20", fill: "currentColor", width: 20, height: 20, children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("path", { d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_react_aria_components62.Button, { slot: "remove", className, children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("svg", { viewBox: "0 0 20 20", fill: "currentColor", width: 20, height: 20, children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("path", { d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" }) }) });
 };
 var _Tag = ({ variant, size: size2, children, disabled, ...rest }) => {
   let textValue = typeof children === "string" ? children : void 0;
@@ -10578,7 +10572,7 @@ var _Tag = ({ variant, size: size2, children, disabled, ...rest }) => {
     ...rest
   };
   return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
-    import_react_aria_components61.Tag,
+    import_react_aria_components62.Tag,
     {
       textValue,
       ...props,
@@ -10601,12 +10595,12 @@ _Tag.Group = _TagGroup;
 var import_visually_hidden = require("@react-aria/visually-hidden");
 
 // src/XLoader/XLoader.tsx
-var import_react_aria_components63 = require("react-aria-components");
+var import_react_aria_components64 = require("react-aria-components");
 var import_utils16 = require("@react-aria/utils");
 var import_system93 = require("@marigold/system");
 
 // src/XLoader/BaseLoader.tsx
-var import_react_aria_components62 = require("react-aria-components");
+var import_react_aria_components63 = require("react-aria-components");
 var import_i18n6 = require("@react-aria/i18n");
 var import_system92 = require("@marigold/system");
 
@@ -10632,7 +10626,7 @@ var BaseLoader = ({
   const stringFormatter = (0, import_i18n6.useLocalizedStringFormatter)(intlMessages2, "marigold");
   const className = (0, import_system92.useClassNames)({ component: "XLoader", variant, size: size2 });
   return /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
-    import_react_aria_components62.ProgressBar,
+    import_react_aria_components63.ProgressBar,
     {
       className: className.container,
       isIndeterminate: true,
@@ -10849,7 +10843,7 @@ var BaseLoader = ({
             ]
           }
         ),
-        children ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_react_aria_components62.Label, { className: className.label, children }) : null
+        children ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(import_react_aria_components63.Label, { className: className.label, children }) : null
       ]
     }
   );
@@ -10859,7 +10853,7 @@ var BaseLoader = ({
 var import_jsx_runtime112 = require("react/jsx-runtime");
 var LoaderFullScreen = (props) => {
   const id = (0, import_utils16.useId)();
-  return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(Underlay, { defaultOpen: true, keyboardDismissable: true, variant: "modal", children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_react_aria_components63.Modal, { className: "grid h-(--visual-viewport-height) cursor-progress place-items-center", children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_react_aria_components63.Dialog, { className: "outline-0", "aria-labelledby": id, children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(BaseLoader, { id, ...props }) }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(Underlay, { defaultOpen: true, keyboardDismissable: true, variant: "modal", children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_react_aria_components64.Modal, { className: "grid h-(--visual-viewport-height) cursor-progress place-items-center", children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(import_react_aria_components64.Dialog, { className: "outline-0", "aria-labelledby": id, children: /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(BaseLoader, { id, ...props }) }) }) });
 };
 var LoaderSection = (props) => {
   const className = (0, import_system93.useClassNames)({
@@ -10872,7 +10866,7 @@ var LoaderSection = (props) => {
 var XLoader = ({ mode, variant, ...props }) => mode === "fullscreen" ? /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(LoaderFullScreen, { variant: variant != null ? variant : "inverted", ...props }) : mode === "section" ? /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(LoaderSection, { variant: variant != null ? variant : "inverted", ...props }) : /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(BaseLoader, { variant, ...props });
 
 // src/Tabs/Tabs.tsx
-var import_react_aria_components67 = require("react-aria-components");
+var import_react_aria_components68 = require("react-aria-components");
 var import_system96 = require("@marigold/system");
 
 // src/Tabs/Context.ts
@@ -10881,13 +10875,13 @@ var TabContext = (0, import_react72.createContext)({});
 var useTabContext = () => (0, import_react72.useContext)(TabContext);
 
 // src/Tabs/Tab.tsx
-var import_react_aria_components64 = require("react-aria-components");
+var import_react_aria_components65 = require("react-aria-components");
 var import_system94 = require("@marigold/system");
 var import_jsx_runtime113 = require("react/jsx-runtime");
 var _Tab = (props) => {
   const { classNames: classNames3 } = useTabContext();
   return /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
-    import_react_aria_components64.Tab,
+    import_react_aria_components65.Tab,
     {
       ...props,
       className: (0, import_system94.cn)(
@@ -10900,13 +10894,13 @@ var _Tab = (props) => {
 };
 
 // src/Tabs/TabList.tsx
-var import_react_aria_components65 = require("react-aria-components");
+var import_react_aria_components66 = require("react-aria-components");
 var import_system95 = require("@marigold/system");
 var import_jsx_runtime114 = require("react/jsx-runtime");
 var _TabList = ({ space = 2, ...props }) => {
   const { classNames: classNames3 } = useTabContext();
   return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
-    import_react_aria_components65.TabList,
+    import_react_aria_components66.TabList,
     {
       ...props,
       className: (0, import_system95.cn)("flex", import_system95.gapSpace[space], classNames3.tabsList),
@@ -10916,11 +10910,11 @@ var _TabList = ({ space = 2, ...props }) => {
 };
 
 // src/Tabs/TabPanel.tsx
-var import_react_aria_components66 = require("react-aria-components");
+var import_react_aria_components67 = require("react-aria-components");
 var import_jsx_runtime115 = require("react/jsx-runtime");
 var _TabPanel = (props) => {
   const { classNames: classNames3 } = useTabContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_react_aria_components66.TabPanel, { ...props, className: classNames3.tabpanel, children: props.children });
+  return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_react_aria_components67.TabPanel, { ...props, className: classNames3.tabpanel, children: props.children });
 };
 
 // src/Tabs/Tabs.tsx
@@ -10935,14 +10929,14 @@ var _Tabs = ({ disabled, variant, size: size2 = "medium", ...rest }) => {
     size: size2,
     variant
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(TabContext.Provider, { value: { classNames: classNames3 }, children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_react_aria_components67.Tabs, { ...props, className: classNames3.container, children: props.children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(TabContext.Provider, { value: { classNames: classNames3 }, children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_react_aria_components68.Tabs, { ...props, className: classNames3.container, children: props.children }) });
 };
 _Tabs.List = _TabList;
 _Tabs.TabPanel = _TabPanel;
 _Tabs.Item = _Tab;
 
 // src/RouterProvider/RouterProvider.tsx
-var import_react_aria_components68 = require("react-aria-components");
+var import_react_aria_components69 = require("react-aria-components");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Accordion,