@marigold/components 8.0.2 → 9.0.1

package/dist/index.mjs

@@ -306,10 +306,9 @@ var Aspect = ({
 };
 
 // src/Autocomplete/Autocomplete.tsx
-import {
+import React, {
   forwardRef as forwardRef8
 } from "react";
-import React from "react";
 import { ComboBox, ComboBoxStateContext } from "react-aria-components";
 import { cn as cn13, useClassNames as useClassNames9 } from "@marigold/system";
 
@@ -322,13 +321,6 @@ import { useContext } from "react";
 import { FieldError, FieldErrorContext, Text } from "react-aria-components";
 import { cn as cn4, useClassNames as useClassNames2 } from "@marigold/system";
 import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
-var Description = ({ children }) => {
-  const ctx = useContext(FieldErrorContext);
-  if (ctx && ctx.isInvalid) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx7(Text, { slot: "description", children });
-};
 var Icon = ({ className }) => /* @__PURE__ */ jsx7(
   "svg",
   {
@@ -351,6 +343,10 @@ var HelpText = ({
     variant,
     size
   });
+  const ctx = useContext(FieldErrorContext);
+  if (!description && ctx && !ctx.isInvalid) {
+    return null;
+  }
   return /* @__PURE__ */ jsxs3("div", { className: cn4(classNames2.container), children: [
     /* @__PURE__ */ jsx7(FieldError, { ...props, className: "flex flex-col", children: (validation) => {
       const messages = (typeof errorMessage === "function" ? errorMessage(validation) : errorMessage) || validation.validationErrors;
@@ -362,7 +358,7 @@ var HelpText = ({
         messages
       ] });
     } }),
-    /* @__PURE__ */ jsx7(Description, { children: description })
+    ctx && ctx.isInvalid ? null : /* @__PURE__ */ jsx7(Text, { slot: "description", children: description })
   ] });
 };
 
@@ -708,7 +704,7 @@ var Underlay = ({
     ModalOverlay,
     {
       className: ({ isEntering, isExiting }) => cn11(
-        "fixed inset-0 z-40 flex min-h-full items-center justify-center overflow-y-auto backdrop-blur ",
+        "fixed inset-0 z-40 flex min-h-full items-center justify-center overflow-y-auto backdrop-blur",
         isEntering ? "animate-in fade-in duration-300 ease-out" : "",
         isExiting ? "animate-out fade-out duration-200 ease-in" : "",
         classNames2
@@ -759,6 +755,7 @@ var _Popover = forwardRef7(
         ref,
         ...props,
         className: classNames2,
+        placement,
         offset: 0,
         UNSTABLE_portalContainer: portal,
         children
@@ -915,7 +912,7 @@ import { useClassNames as useClassNames12 } from "@marigold/system";
 import { jsx as jsx22 } from "react/jsx-runtime";
 var Badge = ({ variant, size, children, ...props }) => {
   const classNames2 = useClassNames12({ component: "Badge", variant, size });
-  return /* @__PURE__ */ jsx22("div", { ...props, className: classNames2, children });
+  return /* @__PURE__ */ jsx22("div", { className: classNames2, ...props, children });
 };
 
 // src/Breakout/Breakout.tsx
@@ -925,8 +922,7 @@ var Breakout = ({
   height,
   children,
   alignX = "left",
-  alignY = "center",
-  ...props
+  alignY = "center"
 }) => {
   var _a, _b, _c, _d;
   return /* @__PURE__ */ jsx23(
@@ -940,7 +936,6 @@ var Breakout = ({
         "h-[--height]"
       ),
       style: createVar4({ height }),
-      ...props,
       children
     }
   );
@@ -1029,9 +1024,8 @@ var Center = ({
 };
 
 // src/Checkbox/Checkbox.tsx
-import { forwardRef as forwardRef11, useContext as useContext5 } from "react";
+import { forwardRef as forwardRef11 } from "react";
 import { Checkbox } from "react-aria-components";
-import { CheckboxGroupStateContext } from "react-aria-components";
 import { cn as cn18, useClassNames as useClassNames16 } from "@marigold/system";
 
 // src/Checkbox/CheckBoxField.tsx
@@ -1045,6 +1039,11 @@ var CheckboxField = ({ children, labelWidth }) => {
   ] });
 };
 
+// src/Checkbox/Context.tsx
+import { createContext as createContext4, useContext as useContext5 } from "react";
+var CheckboxGroupContext = createContext4(null);
+var useCheckboxGroupContext = () => useContext5(CheckboxGroupContext);
+
 // src/Checkbox/Checkbox.tsx
 import { Fragment as Fragment2, jsx as jsx28, jsxs as jsxs11 } from "react/jsx-runtime";
 var CheckMark = () => /* @__PURE__ */ jsx28("svg", { viewBox: "0 0 12 10", children: /* @__PURE__ */ jsx28(
@@ -1072,7 +1071,7 @@ var Icon2 = ({ className, checked, indeterminate, ...props }) => {
         "flex shrink-0 grow-0 basis-4 items-center justify-center",
         "h-4 w-4 p-px",
         "bg-white",
-        "rounded-[3px] border border-solid border-black ",
+        "rounded-[3px] border border-solid border-black",
         className
       ),
       ...props,
@@ -1082,15 +1081,14 @@ var Icon2 = ({ className, checked, indeterminate, ...props }) => {
 };
 var _Checkbox = forwardRef11(
   ({
-    className,
-    indeterminate,
     error,
     disabled,
-    defaultChecked,
-    children,
-    checked,
     readOnly,
     required,
+    checked,
+    defaultChecked,
+    indeterminate,
+    children,
     variant,
     size,
     ...rest
@@ -1106,8 +1104,12 @@ var _Checkbox = forwardRef11(
       ...rest
     };
     const { labelWidth } = useFieldGroupContext();
-    const classNames2 = useClassNames16({ component: "Checkbox", variant, size });
-    const state = useContext5(CheckboxGroupStateContext);
+    const group = useCheckboxGroupContext();
+    const classNames2 = useClassNames16({
+      component: "Checkbox",
+      variant: variant || (group == null ? void 0 : group.variant),
+      size: size || (group == null ? void 0 : group.size)
+    });
     const component = /* @__PURE__ */ jsx28(
       Checkbox,
       {
@@ -1131,21 +1133,13 @@ var _Checkbox = forwardRef11(
         ] })
       }
     );
-    return !state && labelWidth ? /* @__PURE__ */ jsx28(CheckboxField, { labelWidth, children: component }) : component;
+    return !group && !!labelWidth ? /* @__PURE__ */ jsx28(CheckboxField, { labelWidth, children: component }) : component;
   }
 );
 
 // src/Checkbox/CheckboxGroup.tsx
 import { CheckboxGroup } from "react-aria-components";
 import { cn as cn19, useClassNames as useClassNames17 } from "@marigold/system";
-
-// src/Checkbox/Context.tsx
-import { createContext as createContext4, useContext as useContext6 } from "react";
-var CheckboxGroupContext = createContext4(
-  null
-);
-
-// src/Checkbox/CheckboxGroup.tsx
 import { jsx as jsx29 } from "react/jsx-runtime";
 var _CheckboxGroup = ({
   children,
@@ -1279,7 +1273,7 @@ var Container = ({
 };
 
 // src/Dialog/Dialog.tsx
-import { useContext as useContext7 } from "react";
+import { useContext as useContext6 } from "react";
 import { Dialog, OverlayTriggerStateContext } from "react-aria-components";
 import { cn as cn23, useClassNames as useClassNames19 } from "@marigold/system";
 
@@ -1300,7 +1294,7 @@ var _Headline = ({
   children,
   align = "left",
   color,
-  level = 1,
+  level = "1",
   ...props
 }) => {
   const theme = useTheme2();
@@ -1390,7 +1384,7 @@ var _DialogTrigger = ({
 // src/Dialog/Dialog.tsx
 import { Fragment as Fragment3, jsx as jsx35, jsxs as jsxs13 } from "react/jsx-runtime";
 var CloseButton = ({ className }) => {
-  const { close } = useContext7(OverlayTriggerStateContext);
+  const { close } = useContext6(OverlayTriggerStateContext);
   return /* @__PURE__ */ jsx35("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx35(
     "button",
     {
@@ -1419,7 +1413,7 @@ var _Dialog = ({
   ...props
 }) => {
   const classNames2 = useClassNames19({ component: "Dialog", variant, size });
-  let state = useContext7(OverlayTriggerStateContext);
+  let state = useContext6(OverlayTriggerStateContext);
   let children = props.children;
   if (typeof children === "function") {
     children = children({
@@ -1681,14 +1675,14 @@ import { cn as cn29, useClassNames as useClassNames26 } from "@marigold/system";
 
 // src/Calendar/CalendarGridHeader.tsx
 import { startOfWeek, today } from "@internationalized/date";
-import { useContext as useContext8, useMemo } from "react";
+import { useContext as useContext7, useMemo } from "react";
 import { CalendarStateContext } from "react-aria-components";
 import { useCalendarGrid } from "@react-aria/calendar";
 import { useDateFormatter, useLocale } from "@react-aria/i18n";
 import { useClassNames as useClassNames25 } from "@marigold/system";
 import { jsx as jsx46 } from "react/jsx-runtime";
 function CalendarGridHeader(props) {
-  const state = useContext8(CalendarStateContext);
+  const state = useContext7(CalendarStateContext);
   const { headerProps } = useCalendarGrid(props, state);
   const { locale } = useLocale();
   const dayFormatter = useDateFormatter({
@@ -1727,7 +1721,7 @@ var _CalendarGrid = () => {
 };
 
 // src/Calendar/CalendarListBox.tsx
-import { useContext as useContext9 } from "react";
+import { useContext as useContext8 } from "react";
 import { CalendarStateContext as CalendarStateContext2 } from "react-aria-components";
 import { ChevronDown as ChevronDown2 } from "@marigold/icons";
 import { cn as cn30, useClassNames as useClassNames27 } from "@marigold/system";
@@ -1755,7 +1749,7 @@ function CalendarListBox({
   isDisabled,
   setSelectedDropdown
 }) {
-  const state = useContext9(CalendarStateContext2);
+  const state = useContext8(CalendarStateContext2);
   const months = useFormattedMonths(state.timeZone, state.focusedDate);
   const buttonStyles = "flex items-center justify-between gap-1 overflow-hidden";
   const { select: selectClassNames } = useClassNames27({ component: "Select" });
@@ -1819,11 +1813,11 @@ function MonthControls() {
 var MonthControls_default = MonthControls;
 
 // src/Calendar/MonthListBox.tsx
-import { useContext as useContext10 } from "react";
+import { useContext as useContext9 } from "react";
 import { CalendarStateContext as CalendarStateContext3 } from "react-aria-components";
 import { jsx as jsx50 } from "react/jsx-runtime";
 var MonthListBox = ({ setSelectedDropdown }) => {
-  const state = useContext10(CalendarStateContext3);
+  const state = useContext9(CalendarStateContext3);
   const months = useFormattedMonths(state.timeZone, state.focusedDate);
   let onChange = (index) => {
     let value = Number(index) + 1;
@@ -1858,7 +1852,7 @@ var MonthListBox_default = MonthListBox;
 
 // src/Calendar/YearListBox.tsx
 import {
-  useContext as useContext11,
+  useContext as useContext10,
   useEffect as useEffect2,
   useRef as useRef3
 } from "react";
@@ -1866,7 +1860,7 @@ import { CalendarStateContext as CalendarStateContext4 } from "react-aria-compon
 import { useDateFormatter as useDateFormatter3 } from "@react-aria/i18n";
 import { jsx as jsx51 } from "react/jsx-runtime";
 var YearListBox = ({ setSelectedDropdown }) => {
-  const state = useContext11(CalendarStateContext4);
+  const state = useContext10(CalendarStateContext4);
   const years = [];
   let formatter = useDateFormatter3({
     year: "numeric",
@@ -2097,9 +2091,9 @@ var _Link = forwardRef14(
 import { useClassNames as useClassNames32 } from "@marigold/system";
 
 // src/List/Context.ts
-import { createContext as createContext5, useContext as useContext12 } from "react";
+import { createContext as createContext5, useContext as useContext11 } from "react";
 var ListContext = createContext5({});
-var useListContext = () => useContext12(ListContext);
+var useListContext = () => useContext11(ListContext);
 
 // src/List/ListItem.tsx
 import { jsx as jsx56 } from "react/jsx-runtime";
@@ -2190,9 +2184,9 @@ var ActionMenu = ({
 import { cn as cn36, useClassNames as useClassNames37 } from "@marigold/system";
 
 // src/SectionMessage/Context.tsx
-import { createContext as createContext6, useContext as useContext13 } from "react";
+import { createContext as createContext6, useContext as useContext12 } from "react";
 var SectionMessageContext = createContext6({});
-var useSectionMessageContext = () => useContext13(SectionMessageContext);
+var useSectionMessageContext = () => useContext12(SectionMessageContext);
 
 // src/SectionMessage/SectionMessageContent.tsx
 import { cn as cn34 } from "@marigold/system";
@@ -2552,11 +2546,11 @@ import { Radio } from "react-aria-components";
 import { cn as cn41, useClassNames as useClassNames42 } from "@marigold/system";
 
 // src/Radio/Context.ts
-import { createContext as createContext7, useContext as useContext14 } from "react";
+import { createContext as createContext7, useContext as useContext13 } from "react";
 var RadioGroupContext = createContext7(
   null
 );
-var useRadioGroupContext = () => useContext14(RadioGroupContext);
+var useRadioGroupContext = () => useContext13(RadioGroupContext);
 
 // src/Radio/RadioGroup.tsx
 import { RadioGroup } from "react-aria-components";
@@ -2722,22 +2716,33 @@ var _Select = forwardRef18(
       ...rest
     };
     const classNames2 = useClassNames43({ component: "Select", variant, size });
-    return /* @__PURE__ */ jsxs29(FieldBase, { isOpen: true, as: Select, ref, ...props, children: [
-      /* @__PURE__ */ jsxs29(
-        Button6,
-        {
-          className: cn42(
-            "flex w-full items-center justify-between gap-1 overflow-hidden",
-            classNames2.select
+    return /* @__PURE__ */ jsxs29(
+      FieldBase,
+      {
+        isOpen: true,
+        as: Select,
+        ref,
+        variant,
+        size,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs29(
+            Button6,
+            {
+              className: cn42(
+                "flex w-full items-center justify-between gap-1 overflow-hidden",
+                classNames2.select
+              ),
+              children: [
+                /* @__PURE__ */ jsx73(SelectValue, {}),
+                /* @__PURE__ */ jsx73(ChevronDown, { className: cn42("size-4", classNames2.icon) })
+              ]
+            }
           ),
-          children: [
-            /* @__PURE__ */ jsx73(SelectValue, {}),
-            /* @__PURE__ */ jsx73(ChevronDown, { className: "size-4" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx73(_Popover, { children: /* @__PURE__ */ jsx73(_ListBox, { items, children: props.children }) })
-    ] });
+          /* @__PURE__ */ jsx73(_Popover, { children: /* @__PURE__ */ jsx73(_ListBox, { items, children: props.children }) })
+        ]
+      }
+    );
   }
 );
 _Select.Option = _ListBox.Item;
@@ -2751,11 +2756,11 @@ import { GridList as SelectList } from "react-aria-components";
 import { cn as cn44, useClassNames as useClassNames44 } from "@marigold/system";
 
 // src/SelectList/Context.ts
-import { createContext as createContext8, useContext as useContext15 } from "react";
+import { createContext as createContext8, useContext as useContext14 } from "react";
 var SelectListContext = createContext8(
   {}
 );
-var useSelectListContext = () => useContext15(SelectListContext);
+var useSelectListContext = () => useContext14(SelectListContext);
 
 // src/SelectList/SelectListItem.tsx
 import { forwardRef as forwardRef19 } from "react";
@@ -2893,14 +2898,10 @@ var _Slider = forwardRef21(
 
 // src/Split/Split.tsx
 import { jsx as jsx78 } from "react/jsx-runtime";
-var Split = (props) => /* @__PURE__ */ jsx78("div", { ...props, role: "separator", className: "grow" });
+var Split = () => /* @__PURE__ */ jsx78("div", { role: "separator", className: "grow" });
 
 // src/Stack/Stack.tsx
-import {
-  alignment as alignment3,
-  cn as cn47,
-  gapSpace as gapSpace7
-} from "@marigold/system";
+import { alignment as alignment3, cn as cn47, gapSpace as gapSpace7 } from "@marigold/system";
 import { jsx as jsx79 } from "react/jsx-runtime";
 var Stack = ({
   children,
@@ -2971,7 +2972,7 @@ var _Switch = forwardRef22(
             "div",
             {
               className: cn48(
-                "h-6 w-12 basis-12 rounded-3xl group-disabled/switch:cursor-not-allowed ",
+                "h-6 w-12 basis-12 rounded-3xl group-disabled/switch:cursor-not-allowed",
                 classNames2.track
               ),
               children: /* @__PURE__ */ jsx80(
@@ -3009,15 +3010,27 @@ import {
 import { cn as cn54, useClassNames as useClassNames48 } from "@marigold/system";
 
 // src/Table/Context.tsx
-import { createContext as createContext9, useContext as useContext16 } from "react";
+import { createContext as createContext9, useContext as useContext15 } from "react";
 var TableContext = createContext9({});
-var useTableContext = () => useContext16(TableContext);
+var useTableContext = () => useContext15(TableContext);
 
 // src/Table/TableBody.tsx
 import { useTableRowGroup } from "@react-aria/table";
 import { jsx as jsx81 } from "react/jsx-runtime";
-var TableBody = ({ children }) => {
+var TableBody = ({ children, emptyState }) => {
   const { rowGroupProps } = useTableRowGroup();
+  const { state, classNames: classNames2 } = useTableContext();
+  if (state.collection.size === 0 && emptyState) {
+    return /* @__PURE__ */ jsx81("tr", { className: classNames2 == null ? void 0 : classNames2.row, role: "row", children: /* @__PURE__ */ jsx81(
+      "td",
+      {
+        className: classNames2 == null ? void 0 : classNames2.cell,
+        colSpan: state.collection.size,
+        role: "rowheader",
+        children: emptyState()
+      }
+    ) });
+  }
   return /* @__PURE__ */ jsx81("tbody", { ...rowGroupProps, children });
 };
 
@@ -3127,8 +3140,7 @@ import { useHover } from "@react-aria/interactions";
 import { useTableColumnHeader } from "@react-aria/table";
 import { mergeProps as mergeProps5 } from "@react-aria/utils";
 import { SortDown, SortUp } from "@marigold/icons";
-import { cn as cn51, useStateProps as useStateProps4 } from "@marigold/system";
-import { width as twWidth5 } from "@marigold/system";
+import { cn as cn51, width as twWidth5, useStateProps as useStateProps4 } from "@marigold/system";
 import { jsx as jsx84, jsxs as jsxs33 } from "react/jsx-runtime";
 var TableColumnHeader = ({
   column,
@@ -3162,7 +3174,7 @@ var TableColumnHeader = ({
       align,
       children: [
         column.rendered,
-        column.props.allowsSorting && (((_a = state.sortDescriptor) == null ? void 0 : _a.column) === column.key ? ((_b = state.sortDescriptor) == null ? void 0 : _b.direction) === "ascending" ? /* @__PURE__ */ jsx84(SortUp, { className: "inline-block" }) : /* @__PURE__ */ jsx84(SortDown, { className: "inline-block" }) : /* @__PURE__ */ jsx84(SortDown, { className: "inline-block" }))
+        column.props.allowsSorting && (((_a = state.sortDescriptor) == null ? void 0 : _a.column) === column.key ? ((_b = state.sortDescriptor) == null ? void 0 : _b.direction) === "ascending" ? /* @__PURE__ */ jsx84(SortUp, { className: "inline-block" }) : /* @__PURE__ */ jsx84(SortDown, { className: "inline-block" }) : /* @__PURE__ */ jsx84("span", { className: "invisible", children: /* @__PURE__ */ jsx84(SortDown, { className: "inline-block" }) }))
       ]
     }
   );
@@ -3288,7 +3300,7 @@ var TableSelectAllCell = ({
     "th",
     {
       ref,
-      className: cn53(twWidth6[width], ["  leading-none"], classNames2 == null ? void 0 : classNames2.header),
+      className: cn53(twWidth6[width], ["leading-none"], classNames2 == null ? void 0 : classNames2.header),
       ...mergeProps7(columnHeaderProps, hoverProps, focusProps),
       ...stateProps,
       align,
@@ -3306,6 +3318,7 @@ var Table = ({
   selectionMode = "none",
   disableKeyboardNavigation = false,
   stickyHeader,
+  emptyState,
   ...props
 }) => {
   const interactive = selectionMode !== "none";
@@ -3364,7 +3377,7 @@ var Table = ({
                 );
               }
             ) }, headerRow.key)) }),
-            /* @__PURE__ */ jsxs34(TableBody, { children: [
+            /* @__PURE__ */ jsxs34(TableBody, { emptyState, children: [
               ...collection.rows.map(
                 (row) => row.type === "item" && /* @__PURE__ */ jsx89(TableRow, { row, children: [...collection.getChildren(row.key)].map((cell, index) => {
                   var _a, _b;
@@ -3483,15 +3496,7 @@ import { forwardRef as forwardRef24 } from "react";
 import { TextField as TextField2 } from "react-aria-components";
 import { jsx as jsx92 } from "react/jsx-runtime";
 var _TextField = forwardRef24(
-  ({
-    variant,
-    size,
-    required,
-    disabled,
-    readOnly,
-    error,
-    ...rest
-  }, ref) => {
+  ({ required, disabled, readOnly, error, ...rest }, ref) => {
     const props = {
       isDisabled: disabled,
       isReadOnly: readOnly,
@@ -3806,9 +3811,9 @@ import { Tabs } from "react-aria-components";
 import { useClassNames as useClassNames52 } from "@marigold/system";
 
 // src/Tabs/Context.ts
-import { createContext as createContext10, useContext as useContext17 } from "react";
+import { createContext as createContext10, useContext as useContext16 } from "react";
 var TabContext = createContext10({});
-var useTabContext = () => useContext17(TabContext);
+var useTabContext = () => useContext16(TabContext);
 
 // src/Tabs/Tab.tsx
 import { Tab } from "react-aria-components";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marigold/components",
-  "version": "8.0.2",
+  "version": "9.0.1",
   "description": "Components for the Marigold Design System",
   "license": "MIT",
   "keywords": [
@@ -23,28 +23,28 @@
     "directory": "packages/components"
   },
   "dependencies": {
-    "@internationalized/date": "3.5.4",
-    "@react-aria/accordion": "3.0.0-alpha.29",
-    "@react-aria/button": "3.9.5",
-    "@react-aria/calendar": "3.5.8",
-    "@react-aria/focus": "3.17.1",
-    "@react-aria/i18n": "3.11.1",
-    "@react-aria/interactions": "3.21.3",
-    "@react-aria/overlays": "3.22.1",
-    "@react-aria/selection": "3.18.1",
-    "@react-aria/ssr": "3.9.4",
-    "@react-aria/table": "3.14.1",
-    "@react-aria/utils": "3.24.1",
-    "@react-aria/visually-hidden": "3.8.12",
-    "@react-stately/collections": "3.10.7",
-    "@react-stately/data": "3.11.4",
-    "@react-stately/table": "3.11.8",
-    "@react-stately/tree": "3.8.1",
-    "@react-types/shared": "3.23.1",
-    "@react-types/table": "3.9.5",
-    "react-aria-components": "1.2.1",
-    "@marigold/icons": "1.2.54",
-    "@marigold/system": "8.0.2",
+    "@internationalized/date": "3.5.5",
+    "@react-aria/accordion": "3.0.0-alpha.31",
+    "@react-aria/button": "3.9.7",
+    "@react-aria/calendar": "3.5.10",
+    "@react-aria/focus": "3.18.1",
+    "@react-aria/i18n": "3.12.1",
+    "@react-aria/interactions": "3.22.1",
+    "@react-aria/overlays": "3.23.1",
+    "@react-aria/selection": "3.19.1",
+    "@react-aria/ssr": "3.9.5",
+    "@react-aria/table": "3.15.1",
+    "@react-aria/utils": "3.25.1",
+    "@react-aria/visually-hidden": "3.8.14",
+    "@react-stately/collections": "3.10.9",
+    "@react-stately/data": "3.11.6",
+    "@react-stately/table": "3.12.1",
+    "@react-stately/tree": "3.8.3",
+    "@react-types/shared": "3.24.1",
+    "@react-types/table": "3.10.1",
+    "react-aria-components": "1.3.1",
+    "@marigold/icons": "1.2.56",
+    "@marigold/system": "9.0.1",
     "@marigold/types": "1.1.1"
   },
   "peerDependencies": {