@marigold/components 6.0.0 → 6.0.1

package/dist/index.mjs

@@ -730,6 +730,7 @@ import {
   usePopover
 } from "@react-aria/overlays";
 import { FocusScope as FocusScope2 } from "@react-aria/focus";
+import { useClassNames as useClassNames9 } from "@marigold/system";
 var Popover = forwardRef7(
   (props, ref) => {
     const fallbackRef = useRef5(null);
@@ -756,11 +757,15 @@ var PopoverWrapper = forwardRef7(
       },
       state
     );
+    const classNames2 = useClassNames9({
+      component: "Popover",
+      variant: placement
+    });
     return /* @__PURE__ */ React19.createElement(FocusScope2, { restoreFocus: true }, !isNonModal && /* @__PURE__ */ React19.createElement(Underlay, { ...underlayProps }), /* @__PURE__ */ React19.createElement(
       "div",
       {
         ...popoverProps,
-        className: placement === "top" ? "mb-0.5" : "mt-0.5",
+        className: classNames2,
         style: {
           ...popoverProps.style,
           minWidth: props.triggerRef.current ? props.triggerRef.current.offsetWidth : void 0
@@ -1085,9 +1090,9 @@ ComboBox.Item = Item3;
 
 // src/Badge/Badge.tsx
 import React24 from "react";
-import { useClassNames as useClassNames9 } from "@marigold/system";
+import { useClassNames as useClassNames10 } from "@marigold/system";
 var Badge = ({ variant, size, children, ...props }) => {
-  const classNames2 = useClassNames9({ component: "Badge", variant, size });
+  const classNames2 = useClassNames10({ component: "Badge", variant, size });
   return /* @__PURE__ */ React24.createElement("div", { ...props, className: classNames2 }, children);
 };
 
@@ -1122,9 +1127,9 @@ var Breakout = ({
 
 // src/Body/Body.tsx
 import React26 from "react";
-import { useClassNames as useClassNames10 } from "@marigold/system";
+import { useClassNames as useClassNames11 } from "@marigold/system";
 var Body = ({ children, variant, size, ...props }) => {
-  const classNames2 = useClassNames10({ component: "Body", variant, size });
+  const classNames2 = useClassNames11({ component: "Body", variant, size });
   return /* @__PURE__ */ React26.createElement("section", { ...props, className: classNames2 }, children);
 };
 
@@ -1140,7 +1145,7 @@ import {
   paddingSpaceX,
   paddingSpaceY,
   paddingTop,
-  useClassNames as useClassNames11
+  useClassNames as useClassNames12
 } from "@marigold/system";
 var Card = ({
   children,
@@ -1156,7 +1161,7 @@ var Card = ({
   pr,
   ...props
 }) => {
-  const classNames2 = useClassNames11({ component: "Card", variant, size });
+  const classNames2 = useClassNames12({ component: "Card", variant, size });
   return /* @__PURE__ */ React27.createElement(
     "div",
     {
@@ -1265,7 +1270,7 @@ var CheckboxGroup = ({
 };
 
 // src/Checkbox/Checkbox.tsx
-import { useClassNames as useClassNames12, cn as cn14 } from "@marigold/system";
+import { useClassNames as useClassNames13, cn as cn14 } from "@marigold/system";
 var CheckMark = () => /* @__PURE__ */ React30.createElement("svg", { viewBox: "0 0 12 10" }, /* @__PURE__ */ React30.createElement(
   "path",
   {
@@ -1348,7 +1353,7 @@ var Checkbox = forwardRef9(
       }),
       inputRef
     );
-    const classNames2 = useClassNames12({ component: "Checkbox", variant, size });
+    const classNames2 = useClassNames13({ component: "Checkbox", variant, size });
     const { hoverProps, isHovered } = useHover3({
       isDisabled: inputProps.disabled
     });
@@ -1487,11 +1492,11 @@ var Container = ({
 import React37, { useRef as useRef9 } from "react";
 import { useButton as useButton5 } from "@react-aria/button";
 import { useDialog } from "@react-aria/dialog";
-import { cn as cn19, useClassNames as useClassNames15 } from "@marigold/system";
+import { cn as cn19, useClassNames as useClassNames16 } from "@marigold/system";
 
 // src/Header/Header.tsx
 import React33 from "react";
-import { cn as cn17, useClassNames as useClassNames13 } from "@marigold/system";
+import { cn as cn17, useClassNames as useClassNames14 } from "@marigold/system";
 var Header = ({
   children,
   variant,
@@ -1499,7 +1504,7 @@ var Header = ({
   className,
   ...props
 }) => {
-  const classNames2 = useClassNames13({
+  const classNames2 = useClassNames14({
     component: "Header",
     variant,
     size,
@@ -1511,7 +1516,7 @@ var Header = ({
 // src/Headline/Headline.tsx
 import React34 from "react";
 import {
-  useClassNames as useClassNames14,
+  useClassNames as useClassNames15,
   cn as cn18,
   createVar as createVar8,
   textAlign,
@@ -1529,7 +1534,7 @@ var Headline = ({
   ...props
 }) => {
   const theme = useTheme2();
-  const classNames2 = useClassNames14({
+  const classNames2 = useClassNames15({
     component: "Headline",
     variant,
     size: size != null ? size : `level-${level}`
@@ -1676,7 +1681,7 @@ var Dialog = ({
   const ref = useRef9(null);
   const { close } = useDialogContext();
   const { dialogProps, titleProps } = useDialog(props, ref);
-  const classNames2 = useClassNames15({ component: "Dialog", variant, size });
+  const classNames2 = useClassNames16({ component: "Dialog", variant, size });
   return /* @__PURE__ */ React37.createElement("div", { className: classNames2.container, ...dialogProps }, closeButton && /* @__PURE__ */ React37.createElement(CloseButton, { className: classNames2.closeButton }), typeof children === "function" ? children({ close, titleProps }) : props["aria-labelledby"] ? children : addTitleProps(children, titleProps));
 };
 Dialog.Trigger = DialogTrigger;
@@ -1685,18 +1690,18 @@ Dialog.Controller = DialogController;
 // src/Divider/Divider.tsx
 import React38 from "react";
 import { useSeparator } from "@react-aria/separator";
-import { useClassNames as useClassNames16 } from "@marigold/system";
+import { useClassNames as useClassNames17 } from "@marigold/system";
 var Divider = ({ variant, ...props }) => {
   const { separatorProps } = useSeparator(props);
-  const classNames2 = useClassNames16({ component: "Divider", variant });
+  const classNames2 = useClassNames17({ component: "Divider", variant });
   return /* @__PURE__ */ React38.createElement("div", { className: classNames2, ...props, ...separatorProps });
 };
 
 // src/Footer/Footer.tsx
 import React39 from "react";
-import { useClassNames as useClassNames17 } from "@marigold/system";
+import { useClassNames as useClassNames18 } from "@marigold/system";
 var Footer = ({ children, variant, size, ...props }) => {
-  const classNames2 = useClassNames17({ component: "Footer", variant, size });
+  const classNames2 = useClassNames18({ component: "Footer", variant, size });
   return /* @__PURE__ */ React39.createElement("footer", { ...props, className: classNames2 }, children);
 };
 
@@ -1704,7 +1709,7 @@ var Footer = ({ children, variant, size, ...props }) => {
 import React40 from "react";
 import {
   cn as cn20,
-  useClassNames as useClassNames18,
+  useClassNames as useClassNames19,
   objectFit,
   objectPosition
 } from "@marigold/system";
@@ -1715,7 +1720,7 @@ var Image = ({
   position = "none",
   ...props
 }) => {
-  const classNames2 = useClassNames18({ component: "Image", variant, size });
+  const classNames2 = useClassNames19({ component: "Image", variant, size });
   return /* @__PURE__ */ React40.createElement(
     "img",
     {
@@ -1768,7 +1773,7 @@ import { useLocale } from "@react-aria/i18n";
 import { useDateFieldState } from "@react-stately/datepicker";
 import { useDateField } from "@react-aria/datepicker";
 import { createCalendar } from "@internationalized/date";
-import { cn as cn23, useClassNames as useClassNames19, useStateProps as useStateProps8 } from "@marigold/system";
+import { cn as cn23, useClassNames as useClassNames20, useStateProps as useStateProps8 } from "@marigold/system";
 
 // src/DateField/DateSegment.tsx
 import React42, { useRef as useRef10 } from "react";
@@ -1862,7 +1867,7 @@ var DateField = ({
     state,
     ref
   );
-  const classNames2 = useClassNames19({ component: "DateField", variant, size });
+  const classNames2 = useClassNames20({ component: "DateField", variant, size });
   const { focusProps, isFocused } = useFocusRing6({
     within: true,
     isTextInput: true,
@@ -1953,13 +1958,13 @@ import { getWeeksInMonth, startOfWeek, today } from "@internationalized/date";
 import React44, { useRef as useRef12 } from "react";
 import { useCalendarCell } from "@react-aria/calendar";
 import { mergeProps as mergeProps9 } from "@react-aria/utils";
-import { cn as cn24, useClassNames as useClassNames20, useStateProps as useStateProps9 } from "@marigold/system";
+import { cn as cn24, useClassNames as useClassNames21, useStateProps as useStateProps9 } from "@marigold/system";
 import { useHover as useHover5 } from "@react-aria/interactions";
 var CalendarCell = (props) => {
   const ref = useRef12(null);
   const { state } = props;
   let { cellProps, buttonProps, formattedDate, isOutsideVisibleRange } = useCalendarCell(props, state, ref);
-  const classNames2 = useClassNames20({
+  const classNames2 = useClassNames21({
     component: "Calendar"
   });
   const isDisabled = cellProps["aria-disabled"];
@@ -2030,7 +2035,7 @@ var CalendarGrid = ({ state, ...props }) => {
 
 // src/Calendar/Calendar.tsx
 import { ChevronRight, ChevronLeft } from "@marigold/icons";
-import { cn as cn26, useClassNames as useClassNames22, useStateProps as useStateProps11 } from "@marigold/system";
+import { cn as cn26, useClassNames as useClassNames23, useStateProps as useStateProps11 } from "@marigold/system";
 
 // src/Calendar/MonthDropdown.tsx
 import React47 from "react";
@@ -2050,7 +2055,7 @@ import { Item as Item4, Section } from "@react-stately/collections";
 import { mergeProps as mergeProps10, useObjectRef as useObjectRef6 } from "@react-aria/utils";
 import {
   cn as cn25,
-  useClassNames as useClassNames21,
+  useClassNames as useClassNames22,
   useSmallScreen,
   useStateProps as useStateProps10
 } from "@marigold/system";
@@ -2104,7 +2109,7 @@ var Select = forwardRef10(
       buttonRef
     );
     const { focusProps, isFocusVisible } = useFocusRing7();
-    const classNames2 = useClassNames21({ component: "Select", variant, size });
+    const classNames2 = useClassNames22({ component: "Select", variant, size });
     const isSmallScreen = useSmallScreen();
     const stateProps = useStateProps10({
       disabled,
@@ -2273,7 +2278,7 @@ var Calendar = ({
   const calendarState = useStateProps11({
     disabled: state.isDisabled
   });
-  const classNames2 = useClassNames22({ component: "Calendar" });
+  const classNames2 = useClassNames23({ component: "Calendar" });
   return /* @__PURE__ */ React49.createElement(
     "div",
     {
@@ -2311,7 +2316,7 @@ var Calendar = ({
 import React50, { useRef as useRef15 } from "react";
 import { useDatePickerState } from "@react-stately/datepicker";
 import { useDatePicker } from "@react-aria/datepicker";
-import { cn as cn27, useClassNames as useClassNames23, useStateProps as useStateProps12 } from "@marigold/system";
+import { cn as cn27, useClassNames as useClassNames24, useStateProps as useStateProps12 } from "@marigold/system";
 import { mergeProps as mergeProps11 } from "@react-aria/utils";
 var DatePicker = ({
   disabled,
@@ -2345,7 +2350,7 @@ var DatePicker = ({
     ref
   );
   const { isDisabled, errorMessage, description, label } = props;
-  const classNames2 = useClassNames23({
+  const classNames2 = useClassNames24({
     component: "DatePicker",
     size,
     variant
@@ -2411,7 +2416,7 @@ var Inset = ({
 // src/Link/Link.tsx
 import React52, { forwardRef as forwardRef11 } from "react";
 import { useLink } from "@react-aria/link";
-import { useClassNames as useClassNames24 } from "@marigold/system";
+import { useClassNames as useClassNames25 } from "@marigold/system";
 import { useObjectRef as useObjectRef7 } from "@react-aria/utils";
 var Link = forwardRef11(
   ({
@@ -2435,7 +2440,7 @@ var Link = forwardRef11(
       linkRef
     );
     const Component = as;
-    const classNames2 = useClassNames24({
+    const classNames2 = useClassNames25({
       component: "Link",
       variant,
       size,
@@ -2457,7 +2462,7 @@ var Link = forwardRef11(
 
 // src/List/List.tsx
 import React54 from "react";
-import { useClassNames as useClassNames25 } from "@marigold/system";
+import { useClassNames as useClassNames26 } from "@marigold/system";
 
 // src/List/Context.ts
 import { createContext as createContext5, useContext as useContext5 } from "react";
@@ -2480,7 +2485,7 @@ var List = ({
   ...props
 }) => {
   const Component = as;
-  const classNames2 = useClassNames25({ component: "List", variant, size });
+  const classNames2 = useClassNames26({ component: "List", variant, size });
   return /* @__PURE__ */ React54.createElement(Component, { ...props, className: classNames2[as] }, /* @__PURE__ */ React54.createElement(ListContext.Provider, { value: { classNames: classNames2.item } }, children));
 };
 List.Item = ListItem;
@@ -2491,7 +2496,7 @@ import { useMenu } from "@react-aria/menu";
 import { Item as Item5, Section as Section2 } from "@react-stately/collections";
 import { useTreeState as useTreeState2 } from "@react-stately/tree";
 import { useSyncRef } from "@react-aria/utils";
-import { useClassNames as useClassNames27 } from "@marigold/system";
+import { useClassNames as useClassNames28 } from "@marigold/system";
 
 // src/Menu/Context.ts
 import {
@@ -2592,13 +2597,13 @@ var MenuItem = ({
 // src/Menu/MenuSection.tsx
 import React57 from "react";
 import { useMenuSection } from "@react-aria/menu";
-import { useClassNames as useClassNames26 } from "@marigold/system";
+import { useClassNames as useClassNames27 } from "@marigold/system";
 var MenuSection = ({ onAction, item, state }) => {
   let { itemProps, headingProps, groupProps } = useMenuSection({
     heading: item.rendered,
     "aria-label": item["aria-label"]
   });
-  const className = useClassNames26({ component: "Menu" });
+  const className = useClassNames27({ component: "Menu" });
   return /* @__PURE__ */ React57.createElement(React57.Fragment, null, item.key !== state.collection.getFirstKey() && /* @__PURE__ */ React57.createElement("li", null, /* @__PURE__ */ React57.createElement(Divider, { variant: "section" })), /* @__PURE__ */ React57.createElement("ul", { ...itemProps }, item.rendered && /* @__PURE__ */ React57.createElement("span", { ...headingProps, className: className.section }, item.rendered), /* @__PURE__ */ React57.createElement("li", { ...groupProps, className: "pb-1" }, [...item.props.children].map((node) => /* @__PURE__ */ React57.createElement(
     MenuItem,
     {
@@ -2620,7 +2625,7 @@ var Menu = ({ variant, size, ...props }) => {
   const state = useTreeState2({ ...ownProps, selectionMode: "none" });
   const { menuProps } = useMenu(ownProps, state, ref);
   useSyncRef({ ref: scrollRef }, ref);
-  const classNames2 = useClassNames27({ component: "Menu", variant, size });
+  const classNames2 = useClassNames28({ component: "Menu", variant, size });
   return /* @__PURE__ */ React58.createElement("ul", { ref, className: classNames2.container, ...menuProps }, [...state.collection].map((item) => {
     if (item.type === "section") {
       return /* @__PURE__ */ React58.createElement(
@@ -2658,7 +2663,7 @@ var ActionMenu = (props) => {
 
 // src/Message/Message.tsx
 import React60 from "react";
-import { cn as cn29, useClassNames as useClassNames28 } from "@marigold/system";
+import { cn as cn29, useClassNames as useClassNames29 } from "@marigold/system";
 var icons = {
   info: () => /* @__PURE__ */ React60.createElement(
     "svg",
@@ -2716,7 +2721,7 @@ var Message = ({
   children,
   ...props
 }) => {
-  const classNames2 = useClassNames28({ component: "Message", variant, size });
+  const classNames2 = useClassNames29({ component: "Message", variant, size });
   const Icon3 = icons[variant];
   return /* @__PURE__ */ React60.createElement(
     "div",
@@ -2747,7 +2752,7 @@ import { useLocale as useLocale4 } from "@react-aria/i18n";
 import { useNumberField } from "@react-aria/numberfield";
 import { mergeProps as mergeProps14, useObjectRef as useObjectRef9 } from "@react-aria/utils";
 import { useNumberFieldState } from "@react-stately/numberfield";
-import { cn as cn31, useClassNames as useClassNames29, useStateProps as useStateProps15 } from "@marigold/system";
+import { cn as cn31, useClassNames as useClassNames30, useStateProps as useStateProps15 } from "@marigold/system";
 
 // src/NumberField/StepButton.tsx
 import React61, { useRef as useRef19 } from "react";
@@ -2852,7 +2857,7 @@ var NumberField = forwardRef12(
       readOnly,
       required
     });
-    const classNames2 = useClassNames29({
+    const classNames2 = useClassNames30({
       component: "NumberField",
       size,
       variant
@@ -2945,7 +2950,7 @@ import { useRadio } from "@react-aria/radio";
 import { mergeProps as mergeProps15, useObjectRef as useObjectRef10 } from "@react-aria/utils";
 import {
   cn as cn33,
-  useClassNames as useClassNames30,
+  useClassNames as useClassNames31,
   useStateProps as useStateProps17
 } from "@marigold/system";
 
@@ -3045,7 +3050,7 @@ var Radio = forwardRef13(
       state,
       inputRef
     );
-    const classNames2 = useClassNames30({
+    const classNames2 = useClassNames31({
       component: "Radio",
       variant: variant || props.variant,
       size: size || props.size
@@ -3095,7 +3100,7 @@ import { useSlider } from "@react-aria/slider";
 import { useSliderState } from "@react-stately/slider";
 import { useNumberFormatter } from "@react-aria/i18n";
 import { useObjectRef as useObjectRef11 } from "@react-aria/utils";
-import { cn as cn35, createVar as createVar9, useClassNames as useClassNames31, useStateProps as useStateProps19 } from "@marigold/system";
+import { cn as cn35, createVar as createVar9, useClassNames as useClassNames32, useStateProps as useStateProps19 } from "@marigold/system";
 
 // src/Slider/Thumb.tsx
 import React66, { useEffect } from "react";
@@ -3154,7 +3159,7 @@ var Slider = forwardRef14(
       state,
       trackRef
     );
-    const classNames2 = useClassNames31({
+    const classNames2 = useClassNames32({
       component: "Slider",
       variant,
       size
@@ -3254,7 +3259,7 @@ import { useFocusRing as useFocusRing12 } from "@react-aria/focus";
 import { useSwitch } from "@react-aria/switch";
 import { useObjectRef as useObjectRef12 } from "@react-aria/utils";
 import { useToggleState as useToggleState2 } from "@react-stately/toggle";
-import { cn as cn37, createVar as createVar10, useStateProps as useStateProps20, useClassNames as useClassNames32 } from "@marigold/system";
+import { cn as cn37, createVar as createVar10, useStateProps as useStateProps20, useClassNames as useClassNames33 } from "@marigold/system";
 var Switch = forwardRef15(
   ({
     variant,
@@ -3283,7 +3288,7 @@ var Switch = forwardRef15(
       readOnly,
       focus: isFocusVisible
     });
-    const classNames2 = useClassNames32({ component: "Switch", size, variant });
+    const classNames2 = useClassNames33({ component: "Switch", size, variant });
     return /* @__PURE__ */ React70.createElement(
       "label",
       {
@@ -3342,7 +3347,7 @@ import {
   TableHeader as Header2,
   useTableState
 } from "@react-stately/table";
-import { cn as cn42, useClassNames as useClassNames34 } from "@marigold/system";
+import { cn as cn42, useClassNames as useClassNames35 } from "@marigold/system";
 
 // src/Table/Context.tsx
 import { createContext as createContext8, useContext as useContext8 } from "react";
@@ -3538,12 +3543,12 @@ import { useFocusRing as useFocusRing16 } from "@react-aria/focus";
 import { useHover as useHover10 } from "@react-aria/interactions";
 import { useTableRow } from "@react-aria/table";
 import { mergeProps as mergeProps20 } from "@react-aria/utils";
-import { cn as cn40, useClassNames as useClassNames33, useStateProps as useStateProps24 } from "@marigold/system";
+import { cn as cn40, useClassNames as useClassNames34, useStateProps as useStateProps24 } from "@marigold/system";
 var TableRow = ({ children, row }) => {
   const ref = useRef24(null);
   const { interactive, state, ...ctx } = useTableContext();
   const { variant, size } = row.props;
-  const classNames2 = useClassNames33({
+  const classNames2 = useClassNames34({
     component: "Table",
     variant: variant || ctx.variant,
     size: size || ctx.size
@@ -3644,7 +3649,7 @@ var Table = ({
     props.selectionBehavior !== "replace"
   });
   const { gridProps } = useTable(props, state, tableRef);
-  const classNames2 = useClassNames34({
+  const classNames2 = useClassNames35({
     component: "Table",
     variant,
     size
@@ -3698,7 +3703,7 @@ import {
   fontWeight,
   get as get2,
   textAlign as textAlign2,
-  useClassNames as useClassNames35,
+  useClassNames as useClassNames36,
   useTheme as useTheme5,
   textSize,
   textStyle
@@ -3716,7 +3721,7 @@ var Text = ({
   ...props
 }) => {
   const theme = useTheme5();
-  const classNames2 = useClassNames35({
+  const classNames2 = useClassNames36({
     component: "Text",
     variant,
     size
@@ -3753,7 +3758,7 @@ import { useHover as useHover12 } from "@react-aria/interactions";
 import { useFocusRing as useFocusRing18 } from "@react-aria/focus";
 import { useTextField } from "@react-aria/textfield";
 import { useObjectRef as useObjectRef13 } from "@react-aria/utils";
-import { useClassNames as useClassNames36, useStateProps as useStateProps26 } from "@marigold/system";
+import { useClassNames as useClassNames37, useStateProps as useStateProps26 } from "@marigold/system";
 var TextArea = forwardRef16(
   ({
     variant,
@@ -3789,7 +3794,7 @@ var TextArea = forwardRef16(
       required,
       error
     });
-    const classNames2 = useClassNames36({ component: "TextArea", variant, size });
+    const classNames2 = useClassNames37({ component: "TextArea", variant, size });
     return /* @__PURE__ */ React81.createElement(
       FieldBase,
       {
@@ -3916,7 +3921,7 @@ var Tiles = ({
 // src/Tooltip/Tooltip.tsx
 import React85 from "react";
 import { useTooltip } from "@react-aria/tooltip";
-import { cn as cn45, useClassNames as useClassNames37 } from "@marigold/system";
+import { cn as cn45, useClassNames as useClassNames38 } from "@marigold/system";
 
 // src/Tooltip/Context.ts
 import { createContext as createContext9, useContext as useContext9 } from "react";
@@ -3985,7 +3990,7 @@ var TooltipTrigger = ({
 var Tooltip = ({ children, variant, size }) => {
   const { arrowProps, state, overlayRef, placement, ...rest } = useTooltipContext();
   const { tooltipProps } = useTooltip({}, state);
-  const classNames2 = useClassNames37({ component: "Tooltip", variant, size });
+  const classNames2 = useClassNames38({ component: "Tooltip", variant, size });
   return /* @__PURE__ */ React85.createElement(
     "div",
     {
@@ -4020,7 +4025,7 @@ import { useStateProps as useStateProps28 } from "@marigold/system";
 import React86 from "react";
 import { useTag } from "@react-aria/tag";
 import { useFocusRing as useFocusRing20 } from "@react-aria/focus";
-import { cn as cn46, useClassNames as useClassNames38 } from "@marigold/system";
+import { cn as cn46, useClassNames as useClassNames39 } from "@marigold/system";
 import { mergeProps as mergeProps23 } from "@react-aria/utils";
 var Tag = ({ variant, size, item, state, ...rest }) => {
   const props = {
@@ -4037,7 +4042,7 @@ var Tag = ({ variant, size, item, state, ...rest }) => {
     state,
     ref
   );
-  const classNames2 = useClassNames38({ component: "Tag", variant, size });
+  const classNames2 = useClassNames39({ component: "Tag", variant, size });
   return /* @__PURE__ */ React86.createElement(
     "span",
     {
@@ -4335,7 +4340,7 @@ var XLoader = forwardRef18((props, ref) => /* @__PURE__ */ React88.createElement
 // src/Tabs/Tabs.tsx
 import React91 from "react";
 import { useTabList } from "@react-aria/tabs";
-import { cn as cn48, useClassNames as useClassNames39, gapSpace as gapSpace8 } from "@marigold/system";
+import { cn as cn48, useClassNames as useClassNames40, gapSpace as gapSpace8 } from "@marigold/system";
 import { useTabListState } from "@react-stately/tabs";
 import { useRef as useRef31 } from "react";
 
@@ -4406,7 +4411,7 @@ var Tabs = ({
   };
   const state = useTabListState(props);
   const { tabListProps } = useTabList(props, state, ref);
-  const classNames2 = useClassNames39({
+  const classNames2 = useClassNames40({
     component: "Tabs",
     size,
     variant

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marigold/components",
-  "version": "6.0.0",
+  "version": "6.0.1",
   "description": "Components for the Marigold Design System",
   "license": "MIT",
   "keywords": [
@@ -82,8 +82,8 @@
     "@react-types/shared": "3.18.1",
     "@react-types/tooltip": "3.4.2",
     "react-is": "18.2.0",
-    "@marigold/icons": "1.2.6",
-    "@marigold/system": "6.0.0",
+    "@marigold/icons": "1.2.7",
+    "@marigold/system": "6.0.1",
     "@marigold/types": "1.0.1"
   },
   "peerDependencies": {