@marigold/components 13.0.0 → 14.0.0

package/dist/index.js

@@ -1834,21 +1834,11 @@ var ProgressCycle = ({
 // src/Button/Button.tsx
 var import_jsx_runtime30 = require("react/jsx-runtime");
 var _Button = (0, import_react19.forwardRef)(
-  ({
-    children,
-    variant,
-    size: size2,
-    className,
-    disabled,
-    loading,
-    fullWidth,
-    ...props
-  }, ref) => {
+  ({ children, variant, size: size2, disabled, loading, fullWidth, ...props }, ref) => {
     const classNames3 = (0, import_system28.useClassNames)({
       component: "Button",
       variant,
-      size: size2,
-      className
+      size: size2
     });
     return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       import_react_aria_components18.Button,
@@ -2262,9 +2252,7 @@ var icons = {
     }
   )
 };
-var DialogTrigger = (0, import_react23.forwardRef)(
-  ({ open, ...rest }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_aria_components22.DialogTrigger, { isOpen: open, ...rest })
-);
+var DialogTrigger = ({ open, ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_aria_components22.DialogTrigger, { isOpen: open, ...rest });
 var _ContextualHelp = (0, import_react23.forwardRef)(
   ({
     children,
@@ -3320,6 +3308,7 @@ var _Calendar = ({
   readOnly,
   size: size2,
   variant,
+  width = "fit",
   dateUnavailable,
   ...rest
 }) => {
@@ -3339,7 +3328,8 @@ var _Calendar = ({
     import_react_aria_components45.Calendar,
     {
       className: (0, import_system65.cn)(
-        "relative flex min-h-[350px] w-fit flex-col rounded-xs p-4",
+        "relative flex min-h-[350px] flex-col rounded-xs p-4",
+        import_system65.width[width],
         classNames3.calendar
       ),
       ...props,
@@ -9966,12 +9956,16 @@ var SelectListContext = (0, import_react60.createContext)(
 );
 var useSelectListContext = () => (0, import_react60.useContext)(SelectListContext);
 
+// src/SelectList/SelectListAction.tsx
+var import_jsx_runtime96 = require("react/jsx-runtime");
+var SelectListAction = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("div", { className: "order-last", children });
+
 // src/SelectList/SelectListItem.tsx
 var import_react61 = require("react");
 var import_react_aria_components59 = require("react-aria-components");
 var import_system86 = require("@marigold/system");
-var import_jsx_runtime96 = require("react/jsx-runtime");
-var CheckMark3 = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("svg", { width: "12px", height: "10px", viewBox: "0 0 12 10", className, children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+var import_jsx_runtime97 = require("react/jsx-runtime");
+var CheckMark3 = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("svg", { width: "12px", height: "10px", viewBox: "0 0 12 10", className, children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
   "path",
   {
     fill: "currentColor",
@@ -9982,10 +9976,10 @@ var CheckMark3 = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx
 var SelectionIndicator = ({ selectionMode }) => {
   switch (selectionMode) {
     case "multiple": {
-      return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(_Checkbox, { slot: "selection" });
+      return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(_Checkbox, { slot: "selection" });
     }
     case "single": {
-      return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(CheckMark3, { className: "invisible hidden" });
+      return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(CheckMark3, { className: "invisible hidden" });
     }
   }
 };
@@ -9993,16 +9987,19 @@ var _SelectListItem = (0, import_react61.forwardRef)(
   ({ children, disabled, ...props }, ref) => {
     let textValue = typeof children === "string" ? children : void 0;
     const { classNames: classNames3 } = useSelectListContext();
-    return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
       import_react_aria_components59.GridListItem,
       {
         isDisabled: disabled,
         textValue,
         ...props,
-        className: (0, import_system86.cn)("group-[layout=grid]/list:flex-row", classNames3 == null ? void 0 : classNames3.item),
+        className: (0, import_system86.cn)(
+          classNames3 == null ? void 0 : classNames3.item,
+          "grid grid-flow-col [grid-template-columns:min-content_1fr]"
+        ),
         ref,
-        children: ({ selectionMode }) => /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)("div", { className: "selection-indicator contents", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(SelectionIndicator, { selectionMode }),
+        children: ({ selectionMode }) => /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "selection-indicator contents", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(SelectionIndicator, { selectionMode }),
           children
         ] })
       }
@@ -10011,7 +10008,7 @@ var _SelectListItem = (0, import_react61.forwardRef)(
 );
 
 // src/SelectList/SelectList.tsx
-var import_jsx_runtime97 = require("react/jsx-runtime");
+var import_jsx_runtime98 = require("react/jsx-runtime");
 var _SelectList = (0, import_react62.forwardRef)(
   ({ onChange: onChange2, ...rest }, ref) => {
     const classNames3 = (0, import_system87.useClassNames)({ component: "ListBox" });
@@ -10019,7 +10016,7 @@ var _SelectList = (0, import_react62.forwardRef)(
       onSelectionChange: onChange2,
       ...rest
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(SelectListContext.Provider, { value: { classNames: classNames3 }, children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: classNames3.container, children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(SelectListContext.Provider, { value: { classNames: classNames3 }, children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: classNames3.container, children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
       import_react_aria_components60.GridList,
       {
         ...props,
@@ -10035,16 +10032,17 @@ var _SelectList = (0, import_react62.forwardRef)(
   }
 );
 _SelectList.Item = _SelectListItem;
+_SelectList.Action = SelectListAction;
 
 // src/Scrollable/Scrollable.tsx
 var import_system88 = require("@marigold/system");
-var import_jsx_runtime98 = require("react/jsx-runtime");
+var import_jsx_runtime99 = require("react/jsx-runtime");
 var Scrollable = ({
   children,
   width = "full",
   height,
   ...props
-}) => /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
   "div",
   {
     ...props,
@@ -10058,7 +10056,7 @@ var Scrollable = ({
 var import_react63 = require("react");
 var import_react_aria_components61 = require("react-aria-components");
 var import_system89 = require("@marigold/system");
-var import_jsx_runtime99 = require("react/jsx-runtime");
+var import_jsx_runtime100 = require("react/jsx-runtime");
 var _Slider = (0, import_react63.forwardRef)(
   ({
     thumbLabels,
@@ -10078,7 +10076,7 @@ var _Slider = (0, import_react63.forwardRef)(
       isDisabled: disabled,
       ...rest
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(
       FieldBase,
       {
         as: import_react_aria_components61.Slider,
@@ -10090,14 +10088,14 @@ var _Slider = (0, import_react63.forwardRef)(
         ref,
         ...props,
         children: [
-          label && /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(_Label, { children: label }),
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_react_aria_components61.SliderOutput, { className: (0, import_system89.cn)("flex justify-end", classNames3.output), children: ({ state }) => state.values.map((_, i) => state.getThumbValueLabel(i)).join(" \u2013 ") }),
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+          label && /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(_Label, { children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_react_aria_components61.SliderOutput, { className: (0, import_system89.cn)("flex justify-end", classNames3.output), children: ({ state }) => state.values.map((_, i) => state.getThumbValueLabel(i)).join(" \u2013 ") }),
+          /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
             import_react_aria_components61.SliderTrack,
             {
               className: (0, import_system89.cn)("relative col-span-2 h-2 w-full", classNames3.track),
-              children: ({ state }) => /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(import_jsx_runtime99.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+              children: ({ state }) => /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(import_jsx_runtime100.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
                   "div",
                   {
                     className: (0, import_system89.cn)(
@@ -10106,7 +10104,7 @@ var _Slider = (0, import_react63.forwardRef)(
                     )
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
                   "div",
                   {
                     className: (0, import_system89.cn)(
@@ -10119,7 +10117,7 @@ var _Slider = (0, import_react63.forwardRef)(
                     }
                   }
                 ),
-                state.values.map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+                state.values.map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
                   import_react_aria_components61.SliderThumb,
                   {
                     className: (0, import_system89.cn)("top-1/2 cursor-pointer", classNames3.thumb),
@@ -10139,13 +10137,13 @@ var _Slider = (0, import_react63.forwardRef)(
 );
 
 // src/Split/Split.tsx
-var import_jsx_runtime100 = require("react/jsx-runtime");
-var Split = () => /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { role: "separator", className: "grow" });
+var import_jsx_runtime101 = require("react/jsx-runtime");
+var Split = () => /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("div", { role: "separator", className: "grow" });
 
 // src/Stack/Stack.tsx
 var import_react64 = require("react");
 var import_system90 = require("@marigold/system");
-var import_jsx_runtime101 = require("react/jsx-runtime");
+var import_jsx_runtime102 = require("react/jsx-runtime");
 var Stack = ({
   children,
   space = 0,
@@ -10157,8 +10155,8 @@ var Stack = ({
 }) => {
   var _a, _b, _c, _d;
   const Component2 = asList ? "ul" : "div";
-  const stackChildren = asList ? import_react64.Children.map(children, (child) => child != null ? /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("li", { children: child }) : null) : children;
-  return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+  const stackChildren = asList ? import_react64.Children.map(children, (child) => child != null ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("li", { children: child }) : null) : children;
+  return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
     Component2,
     {
       className: (0, import_system90.cn)(
@@ -10178,7 +10176,7 @@ var Stack = ({
 var import_react65 = require("react");
 var import_react_aria_components62 = require("react-aria-components");
 var import_system91 = require("@marigold/system");
-var import_jsx_runtime102 = require("react/jsx-runtime");
+var import_jsx_runtime103 = require("react/jsx-runtime");
 var _Switch = (0, import_react65.forwardRef)(
   ({
     variant,
@@ -10197,7 +10195,7 @@ var _Switch = (0, import_react65.forwardRef)(
       isSelected: selected,
       ...rest
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
       import_react_aria_components62.Switch,
       {
         ...props,
@@ -10209,8 +10207,8 @@ var _Switch = (0, import_react65.forwardRef)(
           classNames3.container
         ),
         children: [
-          label && /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(_Label, { elementType: "span", children: label }),
-          /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("div", { className: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("div", { className: classNames3.track, children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("div", { className: classNames3.thumb }) }) })
+          label && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(_Label, { elementType: "span", children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: classNames3.track, children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: classNames3.thumb }) }) })
         ]
       }
     );
@@ -10230,7 +10228,7 @@ var useTableContext = () => (0, import_react66.useContext)(TableContext);
 
 // src/Table/TableBody.tsx
 var import_table = require("@react-aria/table");
-var import_jsx_runtime103 = require("react/jsx-runtime");
+var import_jsx_runtime104 = require("react/jsx-runtime");
 var TableBody = ({
   children,
   className,
@@ -10239,7 +10237,7 @@ var TableBody = ({
   const { rowGroupProps } = (0, import_table.useTableRowGroup)();
   const { state, classNames: classNames3 } = useTableContext();
   if (state.collection.size === 0 && emptyState) {
-    return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("tbody", { className, children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("tr", { className: classNames3 == null ? void 0 : classNames3.row, role: "row", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("tbody", { className, children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("tr", { className: classNames3 == null ? void 0 : classNames3.row, role: "row", children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
       "td",
       {
         className: classNames3 == null ? void 0 : classNames3.cell,
@@ -10249,7 +10247,7 @@ var TableBody = ({
       }
     ) }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("tbody", { ...rowGroupProps, className, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("tbody", { ...rowGroupProps, className, children });
 };
 
 // src/Table/TableCell.tsx
@@ -10258,7 +10256,7 @@ var import_focus3 = require("@react-aria/focus");
 var import_table2 = require("@react-aria/table");
 var import_utils9 = require("@react-aria/utils");
 var import_system92 = require("@marigold/system");
-var import_jsx_runtime104 = require("react/jsx-runtime");
+var import_jsx_runtime105 = require("react/jsx-runtime");
 var TableCell = ({
   cell,
   align = "left",
@@ -10285,7 +10283,7 @@ var TableCell = ({
   };
   const { focusProps, isFocusVisible } = (0, import_focus3.useFocusRing)();
   const stateProps = (0, import_system92.useStateProps)({ disabled, focusVisible: isFocusVisible });
-  return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
     "td",
     {
       ref,
@@ -10327,7 +10325,7 @@ var mapCheckboxProps = ({
 };
 
 // src/Table/TableCheckboxCell.tsx
-var import_jsx_runtime105 = require("react/jsx-runtime");
+var import_jsx_runtime106 = require("react/jsx-runtime");
 var TableCheckboxCell = ({
   cell,
   alignY = "middle"
@@ -10347,7 +10345,7 @@ var TableCheckboxCell = ({
   );
   const { focusProps, isFocusVisible } = (0, import_focus4.useFocusRing)();
   const stateProps = (0, import_system93.useStateProps)({ disabled, focusVisible: isFocusVisible });
-  return /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
     "td",
     {
       ref,
@@ -10355,7 +10353,7 @@ var TableCheckboxCell = ({
       ...(0, import_utils10.mergeProps)(gridCellProps, focusProps),
       ...stateProps,
       valign: alignY,
-      children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(_Checkbox, { ...checkboxProps })
+      children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(_Checkbox, { ...checkboxProps })
     }
   );
 };
@@ -10367,7 +10365,7 @@ var import_interactions2 = require("@react-aria/interactions");
 var import_table4 = require("@react-aria/table");
 var import_utils12 = require("@react-aria/utils");
 var import_system94 = require("@marigold/system");
-var import_jsx_runtime106 = require("react/jsx-runtime");
+var import_jsx_runtime107 = require("react/jsx-runtime");
 var TableColumnHeader = ({
   column: column2,
   width = "auto",
@@ -10389,7 +10387,7 @@ var TableColumnHeader = ({
     hover: isHovered,
     focusVisible: isFocusVisible
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
     "th",
     {
       colSpan: column2.colspan,
@@ -10400,7 +10398,7 @@ var TableColumnHeader = ({
       align,
       children: [
         column2.rendered,
-        column2.props.allowsSorting && (((_a = state.sortDescriptor) == null ? void 0 : _a.column) === column2.key ? ((_b = state.sortDescriptor) == null ? void 0 : _b.direction) === "ascending" ? /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(SortUp, { className: "inline-block" }) : /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(SortDown, { className: "inline-block" }) : /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("span", { className: "hidden", children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(SortDown, { className: "inline-block" }) }))
+        column2.props.allowsSorting && (((_a = state.sortDescriptor) == null ? void 0 : _a.column) === column2.key ? ((_b = state.sortDescriptor) == null ? void 0 : _b.direction) === "ascending" ? /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(SortUp, { className: "inline-block" }) : /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(SortDown, { className: "inline-block" }) : /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "hidden", children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(SortDown, { className: "inline-block" }) }))
       ]
     }
   );
@@ -10409,11 +10407,11 @@ var TableColumnHeader = ({
 // src/Table/TableHeader.tsx
 var import_table5 = require("@react-aria/table");
 var import_system95 = require("@marigold/system");
-var import_jsx_runtime107 = require("react/jsx-runtime");
+var import_jsx_runtime108 = require("react/jsx-runtime");
 var TableHeader = ({ stickyHeader, children }) => {
   const { rowGroupProps } = (0, import_table5.useTableRowGroup)();
   const { classNames: classNames3 } = useTableContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
     "thead",
     {
       ...rowGroupProps,
@@ -10430,7 +10428,7 @@ var TableHeader = ({ stickyHeader, children }) => {
 // src/Table/TableHeaderRow.tsx
 var import_react70 = require("react");
 var import_table6 = require("@react-aria/table");
-var import_jsx_runtime108 = require("react/jsx-runtime");
+var import_jsx_runtime109 = require("react/jsx-runtime");
 var TableHeaderRow = ({
   item,
   className,
@@ -10439,7 +10437,7 @@ var TableHeaderRow = ({
   const { state } = useTableContext();
   const ref = (0, import_react70.useRef)(null);
   const { rowProps } = (0, import_table6.useTableHeaderRow)({ node: item }, state, ref);
-  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("tr", { ...rowProps, className, ref, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("tr", { ...rowProps, className, ref, children });
 };
 
 // src/Table/TableRow.tsx
@@ -10449,7 +10447,7 @@ var import_interactions3 = require("@react-aria/interactions");
 var import_table7 = require("@react-aria/table");
 var import_utils13 = require("@react-aria/utils");
 var import_system96 = require("@marigold/system");
-var import_jsx_runtime109 = require("react/jsx-runtime");
+var import_jsx_runtime110 = require("react/jsx-runtime");
 var TableRow = ({ children, row }) => {
   const ref = (0, import_react71.useRef)(null);
   const { interactive, state, ...ctx } = useTableContext();
@@ -10479,7 +10477,7 @@ var TableRow = ({ children, row }) => {
     focusVisible: isFocusVisible,
     active: isPressed
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
     "tr",
     {
       ref,
@@ -10503,7 +10501,7 @@ var import_interactions4 = require("@react-aria/interactions");
 var import_table8 = require("@react-aria/table");
 var import_utils14 = require("@react-aria/utils");
 var import_system97 = require("@marigold/system");
-var import_jsx_runtime110 = require("react/jsx-runtime");
+var import_jsx_runtime111 = require("react/jsx-runtime");
 var TableSelectAllCell = ({
   column: column2,
   width = "auto",
@@ -10525,7 +10523,7 @@ var TableSelectAllCell = ({
     hover: isHovered,
     focusVisible: isFocusVisible
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
     "th",
     {
       ref,
@@ -10533,13 +10531,13 @@ var TableSelectAllCell = ({
       ...(0, import_utils14.mergeProps)(columnHeaderProps, hoverProps, focusProps),
       ...stateProps,
       align,
-      children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(_Checkbox, { ...checkboxProps })
+      children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(_Checkbox, { ...checkboxProps })
     }
   );
 };
 
 // src/Table/Table.tsx
-var import_jsx_runtime111 = require("react/jsx-runtime");
+var import_jsx_runtime112 = require("react/jsx-runtime");
 var Table = ({
   variant,
   size: size2,
@@ -10569,11 +10567,11 @@ var Table = ({
     size: size2
   });
   const { collection } = state;
-  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
     TableContext.Provider,
     {
       value: { state, interactive, classNames: classNames3, variant, size: size2 },
-      children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(
         "table",
         {
           ref: tableRef,
@@ -10585,7 +10583,7 @@ var Table = ({
           ),
           ...gridProps,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(TableHeader, { stickyHeader, children: collection.headerRows.map((headerRow) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(TableHeader, { stickyHeader, children: collection.headerRows.map((headerRow) => /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
               TableHeaderRow,
               {
                 item: headerRow,
@@ -10593,7 +10591,7 @@ var Table = ({
                 children: [...collection.getChildren(headerRow.key)].map(
                   (column2) => {
                     var _a, _b, _c, _d, _e;
-                    return ((_a = column2.props) == null ? void 0 : _a.isSelectionCell) ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+                    return ((_a = column2.props) == null ? void 0 : _a.isSelectionCell) ? /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
                       TableSelectAllCell,
                       {
                         width: (_b = column2.props) == null ? void 0 : _b.width,
@@ -10601,7 +10599,7 @@ var Table = ({
                         align: (_c = column2.props) == null ? void 0 : _c.align
                       },
                       column2.key
-                    ) : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+                    ) : /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
                       TableColumnHeader,
                       {
                         width: (_d = column2.props) == null ? void 0 : _d.width,
@@ -10615,19 +10613,19 @@ var Table = ({
               },
               headerRow.key
             )) }),
-            /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(TableBody, { className: classNames3.body, emptyState, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(TableBody, { className: classNames3.body, emptyState, children: [
               ...collection.rows.map(
-                (row) => row.type === "item" && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(TableRow, { row, children: [...collection.getChildren(row.key)].map((cell, index2) => {
+                (row) => row.type === "item" && /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(TableRow, { row, children: [...collection.getChildren(row.key)].map((cell, index2) => {
                   var _a, _b;
                   const currentColumn = collection.columns[index2];
-                  return ((_a = cell.props) == null ? void 0 : _a.isSelectionCell) ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+                  return ((_a = cell.props) == null ? void 0 : _a.isSelectionCell) ? /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
                     TableCheckboxCell,
                     {
                       cell,
                       alignY
                     },
                     cell.key
-                  ) : /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+                  ) : /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
                     TableCell,
                     {
                       align: (_b = currentColumn.props) == null ? void 0 : _b.align,
@@ -10654,7 +10652,7 @@ Table.Row = import_table10.Row;
 // src/Text/Text.tsx
 var import_react_aria_components63 = require("react-aria-components");
 var import_system99 = require("@marigold/system");
-var import_jsx_runtime112 = require("react/jsx-runtime");
+var import_jsx_runtime113 = require("react/jsx-runtime");
 var _Text = ({
   variant,
   size: size2,
@@ -10675,7 +10673,7 @@ var _Text = ({
   });
   const Component2 = props.slot ? import_react_aria_components63.Text : as;
   const elementType = props.slot ? { elementType: as } : {};
-  return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
     Component2,
     {
       ...props,
@@ -10700,7 +10698,7 @@ var _Text = ({
 var import_react74 = require("react");
 var import_react_aria_components64 = require("react-aria-components");
 var import_system100 = require("@marigold/system");
-var import_jsx_runtime113 = require("react/jsx-runtime");
+var import_jsx_runtime114 = require("react/jsx-runtime");
 var _TextArea = (0, import_react74.forwardRef)(
   ({
     variant,
@@ -10720,14 +10718,14 @@ var _TextArea = (0, import_react74.forwardRef)(
       isRequired: required,
       ...rest
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(FieldBase, { as: import_react_aria_components64.TextField, ...props, variant, size: size2, children: /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(import_react_aria_components64.TextArea, { className: classNames3, ref, rows }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(FieldBase, { as: import_react_aria_components64.TextField, ...props, variant, size: size2, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(import_react_aria_components64.TextArea, { className: classNames3, ref, rows }) });
   }
 );
 
 // src/TextField/TextField.tsx
 var import_react75 = require("react");
 var import_react_aria_components65 = require("react-aria-components");
-var import_jsx_runtime114 = require("react/jsx-runtime");
+var import_jsx_runtime115 = require("react/jsx-runtime");
 var _TextField = (0, import_react75.forwardRef)(
   ({ required, disabled, readOnly, error, ...rest }, ref) => {
     const props = {
@@ -10737,13 +10735,13 @@ var _TextField = (0, import_react75.forwardRef)(
       isRequired: required,
       ...rest
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(FieldBase, { as: import_react_aria_components65.TextField, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(_Input, { ref }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(FieldBase, { as: import_react_aria_components65.TextField, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(_Input, { ref }) });
   }
 );
 
 // src/Tiles/Tiles.tsx
 var import_system101 = require("@marigold/system");
-var import_jsx_runtime115 = require("react/jsx-runtime");
+var import_jsx_runtime116 = require("react/jsx-runtime");
 var Tiles = ({
   space = 0,
   stretch = false,
@@ -10756,7 +10754,7 @@ var Tiles = ({
   if (stretch) {
     column2 = `minmax(${column2}, 1fr)`;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
     "div",
     {
       ...props,
@@ -10779,7 +10777,7 @@ var import_system102 = require("@marigold/system");
 
 // src/Tooltip/TooltipTrigger.tsx
 var import_react_aria_components66 = require("react-aria-components");
-var import_jsx_runtime116 = require("react/jsx-runtime");
+var import_jsx_runtime117 = require("react/jsx-runtime");
 var _TooltipTrigger = ({
   delay = 1e3,
   children,
@@ -10793,11 +10791,11 @@ var _TooltipTrigger = ({
     isOpen: open,
     delay
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_react_aria_components66.TooltipTrigger, { ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_react_aria_components66.TooltipTrigger, { ...props, children });
 };
 
 // src/Tooltip/Tooltip.tsx
-var import_jsx_runtime117 = require("react/jsx-runtime");
+var import_jsx_runtime118 = require("react/jsx-runtime");
 var _Tooltip = ({ children, variant, size: size2, open, ...rest }) => {
   const props = {
     ...rest,
@@ -10805,12 +10803,12 @@ var _Tooltip = ({ children, variant, size: size2, open, ...rest }) => {
   };
   const classNames3 = (0, import_system102.useClassNames)({ component: "Tooltip", variant, size: size2 });
   const portal = usePortalContainer();
-  return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
     import_overlays5.UNSAFE_PortalProvider,
     {
       getContainer: () => portal instanceof HTMLElement ? portal : null,
-      children: /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(import_react_aria_components67.Tooltip, { ...props, className: (0, import_system102.cn)("group/tooltip", classNames3.container), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_react_aria_components67.OverlayArrow, { className: classNames3.arrow, children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("svg", { width: 8, height: 8, viewBox: "0 0 8 8", children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("path", { d: "M0 0 L4 4 L8 0" }) }) }),
+      children: /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(import_react_aria_components67.Tooltip, { ...props, className: (0, import_system102.cn)("group/tooltip", classNames3.container), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(import_react_aria_components67.OverlayArrow, { className: classNames3.arrow, children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("svg", { width: 8, height: 8, viewBox: "0 0 8 8", children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("path", { d: "M0 0 L4 4 L8 0" }) }) }),
         children
       ] })
     }
@@ -10829,13 +10827,13 @@ var import_system103 = require("@marigold/system");
 // src/TagGroup/TagGroupHiddenInput.tsx
 var import_react76 = require("react");
 var import_react_aria_components68 = require("react-aria-components");
-var import_jsx_runtime118 = require("react/jsx-runtime");
+var import_jsx_runtime119 = require("react/jsx-runtime");
 var TagGroupHiddenInput = ({ name }) => {
   var _a;
   const state = (0, import_react76.useContext)(import_react_aria_components68.ListStateContext);
   const selectedKeys = Array.from((_a = state == null ? void 0 : state.selectionManager.selectedKeys) != null ? _a : []);
   if (!selectedKeys.length) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { hidden: true, "aria-hidden": "true", children: selectedKeys.map((key) => /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("div", { hidden: true, "aria-hidden": "true", children: selectedKeys.map((key) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
     "input",
     {
       type: "checkbox",
@@ -10849,7 +10847,7 @@ var TagGroupHiddenInput = ({ name }) => {
 };
 
 // src/TagGroup/TagGroup.tsx
-var import_jsx_runtime119 = require("react/jsx-runtime");
+var import_jsx_runtime120 = require("react/jsx-runtime");
 var _TagGroup = ({
   width,
   items,
@@ -10861,8 +10859,8 @@ var _TagGroup = ({
   ...rest
 }) => {
   const classNames3 = (0, import_system103.useClassNames)({ component: "Tag", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(FieldBase, { as: import_react_aria_components69.TagGroup, ...rest, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(FieldBase, { as: import_react_aria_components69.TagGroup, ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
       import_react_aria_components69.TagList,
       {
         items,
@@ -10871,12 +10869,12 @@ var _TagGroup = ({
         children
       }
     ),
-    name ? /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(TagGroupHiddenInput, { name }) : null
+    name ? /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(TagGroupHiddenInput, { name }) : null
   ] });
 };
 
 // src/TagGroup/Tag.tsx
-var import_jsx_runtime120 = require("react/jsx-runtime");
+var import_jsx_runtime121 = require("react/jsx-runtime");
 var _Tag = ({ variant, size: size2, children, disabled, ...rest }) => {
   let textValue = typeof children === "string" ? children : void 0;
   const classNames3 = (0, import_system104.useClassNames)({ component: "Tag", variant, size: size2 });
@@ -10884,15 +10882,15 @@ var _Tag = ({ variant, size: size2, children, disabled, ...rest }) => {
     isDisabled: disabled,
     ...rest
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
     import_react_aria_components70.Tag,
     {
       textValue,
       ...props,
       className: (0, import_system104.cn)("data-selection-mode:cursor-pointer", classNames3.tag),
-      children: ({ allowsRemoving }) => /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)(import_jsx_runtime120.Fragment, { children: [
+      children: ({ allowsRemoving }) => /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(import_jsx_runtime121.Fragment, { children: [
         children,
-        allowsRemoving && /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(CloseButton, { className: classNames3.closeButton, slot: "remove" })
+        allowsRemoving && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(CloseButton, { className: classNames3.closeButton, slot: "remove" })
       ] })
     }
   );
@@ -10923,7 +10921,7 @@ var intlMessages2 = {
 };
 
 // src/XLoader/BaseLoader.tsx
-var import_jsx_runtime121 = require("react/jsx-runtime");
+var import_jsx_runtime122 = require("react/jsx-runtime");
 var BaseLoader = ({
   variant,
   size: size2,
@@ -10933,7 +10931,7 @@ var BaseLoader = ({
 }) => {
   const stringFormatter = (0, import_i18n6.useLocalizedStringFormatter)(intlMessages2, "marigold");
   const className = (0, import_system105.useClassNames)({ component: "XLoader", variant, size: size2 });
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(
     import_react_aria_components71.ProgressBar,
     {
       className: className.container,
@@ -10941,7 +10939,7 @@ var BaseLoader = ({
       "aria-label": ariaLabel || children ? ariaLabel : stringFormatter.format("loadingMessage"),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(
           "svg",
           {
             xmlns: "http://www.w3.org/2000/svg",
@@ -10949,13 +10947,13 @@ var BaseLoader = ({
             fill: "currentColor",
             className: className.loader,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("path", { id: "XMLID_1_", d: "M35.3 27h26.5l54 74.1H88.7z" }),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("path", { id: "XMLID_1_", d: "M35.3 27h26.5l54 74.1H88.7z" }),
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_5_",
                   d: "M124.3 12.8h-.7c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.7c0 2.7-2.2 4.9-4.9 4.9z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -10968,12 +10966,12 @@ var BaseLoader = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_18_",
                   d: "M115.9 24.4h-.7c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.7c0 2.7-2.2 4.9-4.9 4.9z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -10986,12 +10984,12 @@ var BaseLoader = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_19_",
                   d: "M107.5 35.9h-.7c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.7c0 2.7-2.2 4.9-4.9 4.9z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -11004,12 +11002,12 @@ var BaseLoader = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_20_",
                   d: "M99.1 47.5h-.7c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.7c0 2.7-2.2 4.9-4.9 4.9z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -11022,12 +11020,12 @@ var BaseLoader = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_21_",
                   d: "M90.7 59H90c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.7c0 2.8-2.2 4.9-4.9 4.9z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -11040,12 +11038,12 @@ var BaseLoader = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_22_",
                   d: "M68 89.8h-.7c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.8c0 2.6-2.2 4.8-4.9 4.8z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -11058,12 +11056,12 @@ var BaseLoader = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_23_",
                   d: "M59.6 101.4h-.7c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.7c0 2.7-2.2 4.9-4.9 4.9z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -11076,12 +11074,12 @@ var BaseLoader = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_24_",
                   d: "M51.2 112.9h-.7c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.7c-.1 2.8-2.2 4.9-4.9 4.9z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -11094,12 +11092,12 @@ var BaseLoader = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_25_",
                   d: "M42.8 124.5h-.7c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.7c-.1 2.7-2.2 4.9-4.9 4.9z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -11112,12 +11110,12 @@ var BaseLoader = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_26_",
                   d: "M34.4 136h-.7c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.7c-.1 2.7-2.2 4.9-4.9 4.9z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -11130,12 +11128,12 @@ var BaseLoader = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                 "path",
                 {
                   id: "XMLID_27_",
                   d: "M26 147.6h-.7c-2.7 0-4.9-2.2-4.9-4.9v-.7c0-2.7 2.2-4.9 4.9-4.9h.7c2.7 0 4.9 2.2 4.9 4.9v.7c-.1 2.8-2.2 4.9-4.9 4.9z",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
                     "animate",
                     {
                       attributeName: "opacity",
@@ -11151,17 +11149,17 @@ var BaseLoader = ({
             ]
           }
         ),
-        children ? /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_react_aria_components71.Label, { className: className.label, children }) : null
+        children ? /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(import_react_aria_components71.Label, { className: className.label, children }) : null
       ]
     }
   );
 };
 
 // src/XLoader/XLoader.tsx
-var import_jsx_runtime122 = require("react/jsx-runtime");
+var import_jsx_runtime123 = require("react/jsx-runtime");
 var LoaderFullScreen = (props) => {
   const id = (0, import_utils16.useId)();
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(Underlay, { defaultOpen: true, keyboardDismissable: true, variant: "modal", children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(import_react_aria_components72.Modal, { className: "grid h-(--visual-viewport-height) cursor-progress place-items-center", children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(import_react_aria_components72.Dialog, { className: "outline-0", "aria-labelledby": id, children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(BaseLoader, { id, ...props }) }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(Underlay, { defaultOpen: true, keyboardDismissable: true, variant: "modal", children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_react_aria_components72.Modal, { className: "grid h-(--visual-viewport-height) cursor-progress place-items-center", children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_react_aria_components72.Dialog, { className: "outline-0", "aria-labelledby": id, children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(BaseLoader, { id, ...props }) }) }) });
 };
 var LoaderSection = (props) => {
   const className = (0, import_system106.useClassNames)({
@@ -11169,9 +11167,9 @@ var LoaderSection = (props) => {
     variant: "modal",
     className: "flex size-full items-center justify-center"
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("div", { className, children: /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(BaseLoader, { ...props }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)("div", { className, children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(BaseLoader, { ...props }) });
 };
-var XLoader = ({ mode, variant, ...props }) => mode === "fullscreen" ? /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(LoaderFullScreen, { variant: variant != null ? variant : "inverted", ...props }) : mode === "section" ? /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(LoaderSection, { variant: variant != null ? variant : "inverted", ...props }) : /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(BaseLoader, { variant, ...props });
+var XLoader = ({ mode, variant, ...props }) => mode === "fullscreen" ? /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(LoaderFullScreen, { variant: variant != null ? variant : "inverted", ...props }) : mode === "section" ? /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(LoaderSection, { variant: variant != null ? variant : "inverted", ...props }) : /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(BaseLoader, { variant, ...props });
 
 // src/Tabs/Tabs.tsx
 var import_react_aria_components76 = require("react-aria-components");
@@ -11185,10 +11183,10 @@ var useTabContext = () => (0, import_react77.useContext)(TabContext);
 // src/Tabs/Tab.tsx
 var import_react_aria_components73 = require("react-aria-components");
 var import_system107 = require("@marigold/system");
-var import_jsx_runtime123 = require("react/jsx-runtime");
+var import_jsx_runtime124 = require("react/jsx-runtime");
 var _Tab = (props) => {
   const { classNames: classNames3 } = useTabContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     import_react_aria_components73.Tab,
     {
       ...props,
@@ -11204,10 +11202,10 @@ var _Tab = (props) => {
 // src/Tabs/TabList.tsx
 var import_react_aria_components74 = require("react-aria-components");
 var import_system108 = require("@marigold/system");
-var import_jsx_runtime124 = require("react/jsx-runtime");
+var import_jsx_runtime125 = require("react/jsx-runtime");
 var _TabList = ({ space = 2, ...props }) => {
   const { classNames: classNames3 } = useTabContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
     import_react_aria_components74.TabList,
     {
       ...props,
@@ -11219,14 +11217,14 @@ var _TabList = ({ space = 2, ...props }) => {
 
 // src/Tabs/TabPanel.tsx
 var import_react_aria_components75 = require("react-aria-components");
-var import_jsx_runtime125 = require("react/jsx-runtime");
+var import_jsx_runtime126 = require("react/jsx-runtime");
 var _TabPanel = (props) => {
   const { classNames: classNames3 } = useTabContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(import_react_aria_components75.TabPanel, { ...props, className: classNames3.tabpanel, children: props.children });
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(import_react_aria_components75.TabPanel, { ...props, className: classNames3.tabpanel, children: props.children });
 };
 
 // src/Tabs/Tabs.tsx
-var import_jsx_runtime126 = require("react/jsx-runtime");
+var import_jsx_runtime127 = require("react/jsx-runtime");
 var _Tabs = ({ disabled, variant, size: size2 = "medium", ...rest }) => {
   const props = {
     isDisabled: disabled,
@@ -11237,7 +11235,7 @@ var _Tabs = ({ disabled, variant, size: size2 = "medium", ...rest }) => {
     size: size2,
     variant
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(TabContext.Provider, { value: { classNames: classNames3 }, children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(import_react_aria_components76.Tabs, { ...props, className: classNames3.container, children: props.children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(TabContext.Provider, { value: { classNames: classNames3 }, children: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(import_react_aria_components76.Tabs, { ...props, className: classNames3.container, children: props.children }) });
 };
 _Tabs.List = _TabList;
 _Tabs.TabPanel = _TabPanel;
@@ -11250,7 +11248,7 @@ var import_react_aria_components77 = require("react-aria-components");
 var import_react78 = require("react");
 var import_react_aria_components78 = require("react-aria-components");
 var import_system110 = require("@marigold/system");
-var import_jsx_runtime127 = require("react/jsx-runtime");
+var import_jsx_runtime128 = require("react/jsx-runtime");
 var _TimeField = (0, import_react78.forwardRef)(
   ({
     required,
@@ -11270,7 +11268,7 @@ var _TimeField = (0, import_react78.forwardRef)(
       isRequired: required,
       ...rest
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
       FieldBase,
       {
         as: import_react_aria_components78.TimeField,
@@ -11279,7 +11277,7 @@ var _TimeField = (0, import_react78.forwardRef)(
         width,
         ...props,
         ref,
-        children: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(import_react_aria_components78.DateInput, { className: classNames3.field, children: (segment) => /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(import_react_aria_components78.DateSegment, { className: classNames3.segment, segment }) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(import_react_aria_components78.DateInput, { className: classNames3.field, children: (segment) => /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(import_react_aria_components78.DateSegment, { className: classNames3.segment, segment }) })
       }
     );
   }