@marigold/components 17.1.0 → 17.2.0

package/dist/legacy.cjs

@@ -1,13 +1,14 @@
-const require_Checkbox = require('./Checkbox-DIbAWlSt.cjs');
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_Checkbox = require('./Checkbox-CZH5yLn1.cjs');
 const require_index = require('./index.cjs');
-let __marigold_system = require("@marigold/system");
+let _marigold_system = require("@marigold/system");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
-let __react_aria_utils = require("@react-aria/utils");
-let __react_aria_interactions = require("@react-aria/interactions");
-let __react_aria_focus = require("@react-aria/focus");
-let __react_aria_table = require("@react-aria/table");
-let __react_stately_table = require("@react-stately/table");
+let _react_aria_focus = require("@react-aria/focus");
+let _react_aria_interactions = require("@react-aria/interactions");
+let _react_aria_utils = require("@react-aria/utils");
+let _react_aria_table = require("@react-aria/table");
+let _react_stately_table = require("@react-stately/table");
 
 //#region src/legacy/Table/Context.tsx
 const TableContext = (0, react.createContext)({});
@@ -16,7 +17,7 @@ const useTableContext = () => (0, react.useContext)(TableContext);
 //#endregion
 //#region src/legacy/Table/TableBody.tsx
 const TableBody = ({ children = void 0, className, emptyState }) => {
-	const { rowGroupProps } = (0, __react_aria_table.useTableRowGroup)();
+	const { rowGroupProps } = (0, _react_aria_table.useTableRowGroup)();
 	const { state, classNames } = useTableContext();
 	if (state.collection.size === 0 && emptyState) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tbody", {
 		className,
@@ -48,21 +49,21 @@ const TableCell = ({ cell, align = "left", alignY = "middle" }) => {
 	const ref = (0, react.useRef)(null);
 	const { interactive, state, classNames } = useTableContext();
 	const disabled = state.disabledKeys.has(cell.parentKey);
-	const { gridCellProps } = (0, __react_aria_table.useTableCell)({ node: cell }, state, ref);
+	const { gridCellProps } = (0, _react_aria_table.useTableCell)({ node: cell }, state, ref);
 	const cellProps = interactive ? gridCellProps : {
 		...gridCellProps,
 		onMouseDown: (e) => e.stopPropagation(),
 		onPointerDown: (e) => e.stopPropagation()
 	};
-	const { focusProps, isFocusVisible } = (0, __react_aria_focus.useFocusRing)();
-	const stateProps = (0, __marigold_system.useStateProps)({
+	const { focusProps, isFocusVisible } = (0, _react_aria_focus.useFocusRing)();
+	const stateProps = (0, _marigold_system.useStateProps)({
 		disabled,
 		focusVisible: isFocusVisible
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
 		ref,
 		className: classNames?.cell,
-		...(0, __react_aria_utils.mergeProps)(cellProps, focusProps),
+		...(0, _react_aria_utils.mergeProps)(cellProps, focusProps),
 		...stateProps,
 		align,
 		valign: alignY,
@@ -92,17 +93,17 @@ const TableCheckboxCell = ({ cell, alignY = "middle" }) => {
 	const ref = (0, react.useRef)(null);
 	const { state, classNames } = useTableContext();
 	const disabled = state.disabledKeys.has(cell.parentKey);
-	const { gridCellProps } = (0, __react_aria_table.useTableCell)({ node: cell }, state, ref);
-	const { checkboxProps } = mapCheckboxProps((0, __react_aria_table.useTableSelectionCheckbox)({ key: cell.parentKey }, state));
-	const { focusProps, isFocusVisible } = (0, __react_aria_focus.useFocusRing)();
-	const stateProps = (0, __marigold_system.useStateProps)({
+	const { gridCellProps } = (0, _react_aria_table.useTableCell)({ node: cell }, state, ref);
+	const { checkboxProps } = mapCheckboxProps((0, _react_aria_table.useTableSelectionCheckbox)({ key: cell.parentKey }, state));
+	const { focusProps, isFocusVisible } = (0, _react_aria_focus.useFocusRing)();
+	const stateProps = (0, _marigold_system.useStateProps)({
 		disabled,
 		focusVisible: isFocusVisible
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
 		ref,
-		className: (0, __marigold_system.cn)("leading-none", classNames?.cell),
-		...(0, __react_aria_utils.mergeProps)(gridCellProps, focusProps),
+		className: (0, _marigold_system.cn)("leading-none", classNames?.cell),
+		...(0, _react_aria_utils.mergeProps)(gridCellProps, focusProps),
 		...stateProps,
 		valign: alignY,
 		"data-rac": true,
@@ -112,22 +113,22 @@ const TableCheckboxCell = ({ cell, alignY = "middle" }) => {
 
 //#endregion
 //#region src/icons/SortDown.tsx
-const SortDown = ({ size = 24, className, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__marigold_system.SVG, {
+const SortDown = ({ size = 24, className, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_marigold_system.SVG, {
 	width: size,
 	height: size,
 	viewBox: "0 0 24 24",
-	className: (0, __marigold_system.cn)("flex-none shrink-0 fill-current", className),
+	className: (0, _marigold_system.cn)("flex-none shrink-0 fill-current", className),
 	...props,
 	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M17.3962 10.0496L12.5042 14.9416C12.3731 15.0727 12.1984 15.1492 12.0128 15.1492C11.8272 15.1492 11.6524 15.0727 11.5214 14.9416L6.62934 10.0496C6.49827 9.91854 6.42188 9.7439 6.42188 9.55816C6.42188 9.17606 6.73856 8.85938 7.12078 8.85938H16.9048C17.287 8.85938 17.6037 9.17606 17.6037 9.55816C17.6037 9.7439 17.5273 9.91854 17.3962 10.0496Z" })
 });
 
 //#endregion
 //#region src/icons/SortUp.tsx
-const SortUp = ({ size = 24, className, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__marigold_system.SVG, {
+const SortUp = ({ size = 24, className, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_marigold_system.SVG, {
 	width: size,
 	height: size,
 	viewBox: "0 0 24 24",
-	className: (0, __marigold_system.cn)("flex-none shrink-0 fill-current", className),
+	className: (0, _marigold_system.cn)("flex-none shrink-0 fill-current", className),
 	...props,
 	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M16.9048 15.1491H7.12078C6.73856 15.1491 6.42188 14.8324 6.42188 14.4503C6.42188 14.2645 6.49827 14.0899 6.62934 13.9588L11.5214 9.06684C11.6524 8.93577 11.8272 8.85938 12.0128 8.85938C12.1984 8.85938 12.3731 8.93577 12.5042 9.06684L17.3962 13.9588C17.5273 14.0899 17.6037 14.2645 17.6037 14.4503C17.6037 14.8324 17.287 15.1491 16.9048 15.1491Z" })
 });
@@ -137,18 +138,18 @@ const SortUp = ({ size = 24, className, ...props }) => /* @__PURE__ */ (0, react
 const TableColumnHeader = ({ column, width = "auto", align = "left" }) => {
 	const ref = (0, react.useRef)(null);
 	const { state, classNames } = useTableContext();
-	const { columnHeaderProps } = (0, __react_aria_table.useTableColumnHeader)({ node: column }, state, ref);
-	const { hoverProps, isHovered } = (0, __react_aria_interactions.useHover)({});
-	const { focusProps, isFocusVisible } = (0, __react_aria_focus.useFocusRing)();
-	const stateProps = (0, __marigold_system.useStateProps)({
+	const { columnHeaderProps } = (0, _react_aria_table.useTableColumnHeader)({ node: column }, state, ref);
+	const { hoverProps, isHovered } = (0, _react_aria_interactions.useHover)({});
+	const { focusProps, isFocusVisible } = (0, _react_aria_focus.useFocusRing)();
+	const stateProps = (0, _marigold_system.useStateProps)({
 		hover: isHovered,
 		focusVisible: isFocusVisible
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("th", {
 		colSpan: column.colspan,
 		ref,
-		className: (0, __marigold_system.cn)("whitespace-nowrap data-[react-aria-pressable=\"true\"]:cursor-pointer", __marigold_system.width[width], classNames?.header),
-		...(0, __react_aria_utils.mergeProps)(columnHeaderProps, hoverProps, focusProps),
+		className: (0, _marigold_system.cn)("whitespace-nowrap data-[react-aria-pressable=\"true\"]:cursor-pointer", _marigold_system.width[width], classNames?.header),
+		...(0, _react_aria_utils.mergeProps)(columnHeaderProps, hoverProps, focusProps),
 		...stateProps,
 		align,
 		"data-rac": true,
@@ -162,11 +163,11 @@ const TableColumnHeader = ({ column, width = "auto", align = "left" }) => {
 //#endregion
 //#region src/legacy/Table/TableHeader.tsx
 const TableHeader = ({ stickyHeader, children }) => {
-	const { rowGroupProps } = (0, __react_aria_table.useTableRowGroup)();
+	const { rowGroupProps } = (0, _react_aria_table.useTableRowGroup)();
 	const { classNames } = useTableContext();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("thead", {
 		...rowGroupProps,
-		className: (0, __marigold_system.cn)(classNames?.thead, stickyHeader ? "sticky [&_th]:sticky [&_th]:top-0" : ""),
+		className: (0, _marigold_system.cn)(classNames?.thead, stickyHeader ? "sticky [&_th]:sticky [&_th]:top-0" : ""),
 		"data-rac": true,
 		children
 	});
@@ -177,7 +178,7 @@ const TableHeader = ({ stickyHeader, children }) => {
 const TableHeaderRow = ({ item, className, children }) => {
 	const { state } = useTableContext();
 	const ref = (0, react.useRef)(null);
-	const { rowProps } = (0, __react_aria_table.useTableHeaderRow)({ node: item }, state, ref);
+	const { rowProps } = (0, _react_aria_table.useTableHeaderRow)({ node: item }, state, ref);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", {
 		...rowProps,
 		className,
@@ -193,17 +194,17 @@ const TableRow = ({ children, row }) => {
 	const ref = (0, react.useRef)(null);
 	const { interactive, state, ...ctx } = useTableContext();
 	const { variant, size } = row.props;
-	const classNames = (0, __marigold_system.useClassNames)({
+	const classNames = (0, _marigold_system.useClassNames)({
 		component: "LegacyTable",
 		variant: variant || ctx.variant,
 		size: size || ctx.size
 	});
-	const { rowProps, isPressed } = (0, __react_aria_table.useTableRow)({ node: row }, state, ref);
+	const { rowProps, isPressed } = (0, _react_aria_table.useTableRow)({ node: row }, state, ref);
 	const disabled = state.disabledKeys.has(row.key);
 	const selected = state.selectionManager.isSelected(row.key);
-	const { focusProps, isFocusVisible } = (0, __react_aria_focus.useFocusRing)();
-	const { hoverProps, isHovered } = (0, __react_aria_interactions.useHover)({ isDisabled: disabled || !interactive });
-	const stateProps = (0, __marigold_system.useStateProps)({
+	const { focusProps, isFocusVisible } = (0, _react_aria_focus.useFocusRing)();
+	const { hoverProps, isHovered } = (0, _react_aria_interactions.useHover)({ isDisabled: disabled || !interactive });
+	const stateProps = (0, _marigold_system.useStateProps)({
 		disabled,
 		selected,
 		hover: isHovered,
@@ -212,8 +213,8 @@ const TableRow = ({ children, row }) => {
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", {
 		ref,
-		className: (0, __marigold_system.cn)([!interactive ? "cursor-text" : disabled ? "cursor-default" : "cursor-pointer"], classNames?.row),
-		...(0, __react_aria_utils.mergeProps)(rowProps, focusProps, hoverProps),
+		className: (0, _marigold_system.cn)([!interactive ? "cursor-text" : disabled ? "cursor-default" : "cursor-pointer"], classNames?.row),
+		...(0, _react_aria_utils.mergeProps)(rowProps, focusProps, hoverProps),
 		...stateProps,
 		"data-rac": true,
 		children
@@ -225,18 +226,18 @@ const TableRow = ({ children, row }) => {
 const TableSelectAllCell = ({ column, width = "auto", align = "left" }) => {
 	const ref = (0, react.useRef)(null);
 	const { state, classNames } = useTableContext();
-	const { columnHeaderProps } = (0, __react_aria_table.useTableColumnHeader)({ node: column }, state, ref);
-	const { checkboxProps } = mapCheckboxProps((0, __react_aria_table.useTableSelectAllCheckbox)(state));
-	const { hoverProps, isHovered } = (0, __react_aria_interactions.useHover)({});
-	const { focusProps, isFocusVisible } = (0, __react_aria_focus.useFocusRing)();
-	const stateProps = (0, __marigold_system.useStateProps)({
+	const { columnHeaderProps } = (0, _react_aria_table.useTableColumnHeader)({ node: column }, state, ref);
+	const { checkboxProps } = mapCheckboxProps((0, _react_aria_table.useTableSelectAllCheckbox)(state));
+	const { hoverProps, isHovered } = (0, _react_aria_interactions.useHover)({});
+	const { focusProps, isFocusVisible } = (0, _react_aria_focus.useFocusRing)();
+	const stateProps = (0, _marigold_system.useStateProps)({
 		hover: isHovered,
 		focusVisible: isFocusVisible
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
 		ref,
-		className: (0, __marigold_system.cn)(__marigold_system.width[width], ["leading-none"], classNames?.header),
-		...(0, __react_aria_utils.mergeProps)(columnHeaderProps, hoverProps, focusProps),
+		className: (0, _marigold_system.cn)(_marigold_system.width[width], ["leading-none"], classNames?.header),
+		...(0, _react_aria_utils.mergeProps)(columnHeaderProps, hoverProps, focusProps),
 		...stateProps,
 		align,
 		"data-rac": true,
@@ -249,7 +250,7 @@ const TableSelectAllCell = ({ column, width = "auto", align = "left" }) => {
 const Table = ({ variant, size, stretch = false, selectionMode = "none", disableKeyboardNavigation = false, stickyHeader, emptyState, alignY = "middle", ...props }) => {
 	const interactive = selectionMode !== "none";
 	const tableRef = (0, react.useRef)(null);
-	const state = (0, __react_stately_table.useTableState)({
+	const state = (0, _react_stately_table.useTableState)({
 		...props,
 		selectionMode,
 		showSelectionCheckboxes: selectionMode === "multiple" && props.selectionBehavior !== "replace"
@@ -259,8 +260,8 @@ const Table = ({ variant, size, stretch = false, selectionMode = "none", disable
 	* so we test here for undefined here to be save.
 	*/
 	if (disableKeyboardNavigation !== void 0) state.isKeyboardNavigationDisabled = disableKeyboardNavigation;
-	const { gridProps } = (0, __react_aria_table.useTable)(props, state, tableRef);
-	const classNames = (0, __marigold_system.useClassNames)({
+	const { gridProps } = (0, _react_aria_table.useTable)(props, state, tableRef);
+	const classNames = (0, _marigold_system.useClassNames)({
 		component: "LegacyTable",
 		variant,
 		size
@@ -277,7 +278,7 @@ const Table = ({ variant, size, stretch = false, selectionMode = "none", disable
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("table", {
 			ref: tableRef,
 			"data-rac": true,
-			className: (0, __marigold_system.cn)(
+			className: (0, _marigold_system.cn)(
 				"group/table border-collapse",
 				/**
 				* Prevents wide tables from causing overlays to become scrollable on
@@ -324,11 +325,11 @@ const Table = ({ variant, size, stretch = false, selectionMode = "none", disable
 		})
 	});
 };
-Table.Body = __react_stately_table.TableBody;
-Table.Cell = __react_stately_table.Cell;
-Table.Column = __react_stately_table.Column;
-Table.Header = __react_stately_table.TableHeader;
-Table.Row = __react_stately_table.Row;
+Table.Body = _react_stately_table.TableBody;
+Table.Cell = _react_stately_table.Cell;
+Table.Column = _react_stately_table.Column;
+Table.Header = _react_stately_table.TableHeader;
+Table.Row = _react_stately_table.Row;
 
 //#endregion
 exports.Table = Table;

package/dist/legacy.mjs

@@ -1,10 +1,10 @@
-import { t as _Checkbox } from "./Checkbox-D6DudF_g.mjs";
+import { t as _Checkbox } from "./Checkbox-CCWwHNw2.mjs";
 import { SVG, cn, useClassNames, useStateProps, width } from "@marigold/system";
 import { createContext, useContext, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { mergeProps } from "@react-aria/utils";
-import { useHover } from "@react-aria/interactions";
 import { useFocusRing } from "@react-aria/focus";
+import { useHover } from "@react-aria/interactions";
+import { mergeProps } from "@react-aria/utils";
 import { useTable, useTableCell, useTableColumnHeader, useTableHeaderRow, useTableRow, useTableRowGroup, useTableSelectAllCheckbox, useTableSelectionCheckbox } from "@react-aria/table";
 import { Cell, Column, Row, TableBody, TableHeader, useTableState } from "@react-stately/table";
 
@@ -133,7 +133,7 @@ const SortUp = ({ size = 24, className, ...props }) => /* @__PURE__ */ jsx(SVG,
 
 //#endregion
 //#region src/legacy/Table/TableColumnHeader.tsx
-const TableColumnHeader = ({ column, width: width$1 = "auto", align = "left" }) => {
+const TableColumnHeader = ({ column, width: width$2 = "auto", align = "left" }) => {
 	const ref = useRef(null);
 	const { state, classNames } = useTableContext();
 	const { columnHeaderProps } = useTableColumnHeader({ node: column }, state, ref);
@@ -146,7 +146,7 @@ const TableColumnHeader = ({ column, width: width$1 = "auto", align = "left" })
 	return /* @__PURE__ */ jsxs("th", {
 		colSpan: column.colspan,
 		ref,
-		className: cn("whitespace-nowrap data-[react-aria-pressable=\"true\"]:cursor-pointer", width[width$1], classNames?.header),
+		className: cn("whitespace-nowrap data-[react-aria-pressable=\"true\"]:cursor-pointer", width[width$2], classNames?.header),
 		...mergeProps(columnHeaderProps, hoverProps, focusProps),
 		...stateProps,
 		align,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marigold/components",
-  "version": "17.1.0",
+  "version": "17.2.0",
   "description": "Components for the Marigold Design System",
   "license": "MIT",
   "keywords": [
@@ -45,31 +45,31 @@
     "directory": "packages/components"
   },
   "dependencies": {
-    "@internationalized/date": "^3.11.0",
-    "@react-aria/button": "^3.14.4",
-    "@react-aria/calendar": "^3.9.4",
-    "@react-aria/collections": "3.0.2",
-    "@react-aria/focus": "^3.21.4",
-    "@react-aria/i18n": "^3.12.15",
-    "@react-aria/interactions": "^3.27.0",
-    "@react-aria/label": "^3.7.24",
-    "@react-aria/landmark": "^3.0.9",
-    "@react-aria/overlays": "^3.31.1",
-    "@react-aria/selection": "^3.27.1",
+    "@internationalized/date": "^3.12.0",
+    "@react-aria/button": "^3.14.5",
+    "@react-aria/calendar": "^3.9.5",
+    "@react-aria/collections": "3.0.3",
+    "@react-aria/focus": "^3.21.5",
+    "@react-aria/i18n": "^3.12.16",
+    "@react-aria/interactions": "^3.27.1",
+    "@react-aria/label": "^3.7.25",
+    "@react-aria/landmark": "^3.0.10",
+    "@react-aria/overlays": "^3.31.2",
+    "@react-aria/selection": "^3.27.2",
     "@react-aria/ssr": "^3.9.10",
-    "@react-aria/table": "^3.17.10",
-    "@react-aria/utils": "^3.33.0",
-    "@react-aria/visually-hidden": "^3.8.30",
-    "@react-stately/collections": "^3.12.9",
-    "@react-stately/data": "^3.15.1",
-    "@react-stately/table": "^3.15.3",
-    "@react-stately/tree": "^3.9.5",
-    "@react-types/shared": "^3.33.0",
-    "@react-types/table": "^3.13.5",
-    "motion": "12.34.0",
-    "react-aria-components": "^1.15.0",
-    "react-stately": "^3.44.0",
-    "@marigold/system": "17.1.0",
+    "@react-aria/table": "^3.17.11",
+    "@react-aria/utils": "^3.33.1",
+    "@react-aria/visually-hidden": "^3.8.31",
+    "@react-stately/collections": "^3.12.10",
+    "@react-stately/data": "^3.15.2",
+    "@react-stately/table": "^3.15.4",
+    "@react-stately/tree": "^3.9.6",
+    "@react-types/shared": "^3.33.1",
+    "@react-types/table": "^3.13.6",
+    "motion": "12.34.3",
+    "react-aria-components": "^1.16.0",
+    "react-stately": "^3.45.0",
+    "@marigold/system": "17.2.0",
     "@marigold/types": "1.4.0"
   },
   "peerDependencies": {
@@ -78,11 +78,11 @@
   },
   "devDependencies": {
     "@types/react": "19.2.14",
-    "lucide-react": "0.564.0",
+    "lucide-react": "0.575.0",
     "react": "19.2.4",
     "react-dom": "19.2.4",
-    "tsdown": "0.16.8",
-    "@marigold/icons": "1.3.33",
+    "tsdown": "0.20.3",
+    "@marigold/icons": "1.3.34",
     "@marigold/tsconfig": "0.4.2"
   },
   "scripts": {