@marigold/components 17.0.0 → 17.1.0

package/dist/index.cjs

@@ -2985,7 +2985,7 @@ function _objectWithoutProperties$1(e$1, t$1) {
 }
 
 //#endregion
-//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/react-select/dist/useStateManager-7e1e8489.esm.js
+//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.14_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-select/dist/useStateManager-7e1e8489.esm.js
 var _excluded$6 = [
 	"defaultInputValue",
 	"defaultMenuIsOpen",
@@ -4591,7 +4591,7 @@ function serializeStyles(args, registered, mergedProps) {
 }
 
 //#endregion
-//#region ../../node_modules/.pnpm/@emotion+use-insertion-effect-with-fallbacks@1.2.0_react@19.2.3/node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.esm.js
+//#region ../../node_modules/.pnpm/@emotion+use-insertion-effect-with-fallbacks@1.2.0_react@19.2.4/node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.esm.js
 var isBrowser$1 = typeof document !== "undefined";
 var syncFallback = function syncFallback$1(create) {
 	return create();
@@ -4601,7 +4601,7 @@ var useInsertionEffectAlwaysWithSyncFallback = !isBrowser$1 ? syncFallback : use
 var useInsertionEffectWithLayoutFallback = useInsertionEffect || react.useLayoutEffect;
 
 //#endregion
-//#region ../../node_modules/.pnpm/@emotion+react@11.14.0_@types+react@19.2.9_react@19.2.3/node_modules/@emotion/react/dist/emotion-element-d59e098f.esm.js
+//#region ../../node_modules/.pnpm/@emotion+react@11.14.0_@types+react@19.2.14_react@19.2.4/node_modules/@emotion/react/dist/emotion-element-d59e098f.esm.js
 var isDevelopment = false;
 var isBrowser = typeof document !== "undefined";
 var EmotionCacheContext = /* @__PURE__ */ react.createContext(typeof HTMLElement !== "undefined" ? /* @__PURE__ */ createCache({ key: "css" }) : null);
@@ -4684,7 +4684,7 @@ var require_extends = /* @__PURE__ */ __commonJSMin(((exports, module) => {
 }));
 
 //#endregion
-//#region ../../node_modules/.pnpm/@emotion+react@11.14.0_@types+react@19.2.9_react@19.2.3/node_modules/@emotion/react/dist/emotion-react.esm.js
+//#region ../../node_modules/.pnpm/@emotion+react@11.14.0_@types+react@19.2.14_react@19.2.4/node_modules/@emotion/react/dist/emotion-react.esm.js
 var import_extends = require_extends();
 var import_hoist_non_react_statics_cjs = require_hoist_non_react_statics_cjs();
 var jsx = function jsx$1(type, props) {
@@ -4830,7 +4830,7 @@ function getFrameElement(win) {
 }
 
 //#endregion
-//#region ../../node_modules/.pnpm/@floating-ui+dom@1.7.3/node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
+//#region ../../node_modules/.pnpm/@floating-ui+dom@1.7.4/node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
 function getCssDimensions(element) {
 	const css$3 = getComputedStyle$1(element);
 	let width = parseFloat(css$3.width) || 0;
@@ -5037,11 +5037,11 @@ function autoUpdate(reference, floating, update, options$1) {
 }
 
 //#endregion
-//#region ../../node_modules/.pnpm/use-isomorphic-layout-effect@1.2.1_@types+react@19.2.9_react@19.2.3/node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.esm.js
+//#region ../../node_modules/.pnpm/use-isomorphic-layout-effect@1.2.1_@types+react@19.2.14_react@19.2.4/node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.esm.js
 var index = typeof document !== "undefined" ? react.useLayoutEffect : function noop$1() {};
 
 //#endregion
-//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/react-select/dist/index-641ee5b8.esm.js
+//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.14_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-select/dist/index-641ee5b8.esm.js
 var _excluded$4 = [
 	"className",
 	"clearValue",
@@ -6021,7 +6021,7 @@ var require_memoize_one_cjs = /* @__PURE__ */ __commonJSMin(((exports, module) =
 }));
 
 //#endregion
-//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/react-select/dist/Select-ef7c0426.esm.js
+//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.14_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-select/dist/Select-ef7c0426.esm.js
 var import_memoize_one_cjs = /* @__PURE__ */ __toESM(require_memoize_one_cjs());
 function _EMOTION_STRINGIFIED_CSS_ERROR__$2() {
 	return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
@@ -8572,7 +8572,7 @@ var require_taggedTemplateLiteral = /* @__PURE__ */ __commonJSMin(((exports, mod
 }));
 
 //#endregion
-//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/react-select/dist/react-select.esm.js
+//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.14_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-select/dist/react-select.esm.js
 var import_objectSpread2 = require_objectSpread2();
 var import_slicedToArray = require_slicedToArray();
 var import_objectWithoutProperties = require_objectWithoutProperties();
@@ -10174,14 +10174,17 @@ const _TagField = (0, react.forwardRef)(function TagField$1({ disabled, required
 		...props,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_aria_components.Group, {
 			ref: triggerRef,
-			className: (0, __marigold_system.cn)("w-(--field-width) max-w-full min-w-0", classNames$2.trigger),
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TagDisplay, {
-				placeholder,
-				classNames: classNames$2,
-				disabled
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconButton, {
-				className: classNames$2.button,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronsVertical, {})
+			className: (0, __marigold_system.cn)("grid w-(--field-width) max-w-full min-w-0", classNames$2.trigger),
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Button, { className: "col-start-1 row-start-1 h-full w-full cursor-pointer opacity-0" }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "pointer-events-none col-start-1 row-start-1 flex flex-1 items-center justify-between gap-1 **:[[role=row]]:pointer-events-auto",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TagDisplay, {
+					placeholder,
+					classNames: classNames$2,
+					disabled
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronsVertical, {
+					className: "size-4 shrink-0",
+					"aria-hidden": "true"
+				})]
 			})]
 		}), isSmallScreen ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Tray, { children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Tray.Title, { children: rest.label }),

package/dist/index.d.cts

@@ -3,7 +3,7 @@ import { AriaLabelingProps, Orientation, RefObject, Selection } from "@react-typ
 import RAC, { BreadcrumbsProps as BreadcrumbsProps$1, ButtonProps as ButtonProps$1, DateValue, DialogProps as DialogProps$1, DisclosurePanelProps, DisclosureProps as DisclosureProps$1, DropIndicatorProps, HeadingProps, Key, ProgressBarProps, RouterProvider, SlotProps, TagListProps, TimeValue, TimeValue as TimeValue$1, ValidationResult, useAsyncList, useDragAndDrop, useListData } from "react-aria-components";
 import { AspectProp, CursorProp, DateFormat, FontSizeProp, FontStyleProp, FontWeightProp, HeightProp, LineHeightProp, MaxWidthProp, NumericFormat, PaddingBottomProp, PaddingLeftProp, PaddingRightProp, PaddingSpaceProp, PaddingSpacePropX, PaddingSpacePropY, PaddingTopProp, PlaceItemsProp, SpaceProp, SpacingTokens, TextAlignProp, TextWrapProp, Theme, ThemeProvider, ThemeProviderProps, WhiteSpaceProps, WidthProp, alignment, textAlign, useTheme } from "@marigold/system";
 import * as react_jsx_runtime3 from "react/jsx-runtime";
-import * as react10 from "react";
+import * as react8 from "react";
 import { CSSProperties, ComponentPropsWithRef, Dispatch, ElementType, FormEvent, FormHTMLAttributes, ForwardRefExoticComponent, JSX, Key as Key$1, PropsWithChildren, ReactElement, ReactNode, RefAttributes, SVGProps, SetStateAction } from "react";
 import { AriaLabelingProps as AriaLabelingProps$1, AriaRegionProps, DistributiveOmit, NonZeroPercentage } from "@marigold/types";
 import { AriaLandmarkRole } from "@react-aria/landmark";
@@ -221,7 +221,7 @@ interface FieldBaseProps<T extends ElementType> extends WidthProp, Pick<HelpText
   isInvalid?: boolean;
   isRequired?: boolean;
 }
-declare const FieldBase: <T extends ElementType>(props: FieldBaseProps<T> & DistributiveOmit<ComponentPropsWithRef<T>, "as"> & react10.RefAttributes<any>) => React.ReactNode;
+declare const FieldBase: <T extends ElementType>(props: FieldBaseProps<T> & DistributiveOmit<ComponentPropsWithRef<T>, "as"> & react8.RefAttributes<any>) => React.ReactNode;
 //#endregion
 //#region src/ListBox/ListBoxItem.d.ts
 type ListBoxItemProps = Omit<RAC.ListBoxItemProps, 'style' | 'className' | 'children'> & {
@@ -438,7 +438,7 @@ interface ButtonProps extends Omit<RAC.ButtonProps, RemovedProps$42> {
    */
   loading?: RAC.ButtonProps['isPending'];
 }
-declare const _Button: react10.ForwardRefExoticComponent<ButtonProps & react10.RefAttributes<HTMLButtonElement>>;
+declare const _Button: react8.ForwardRefExoticComponent<ButtonProps & react8.RefAttributes<HTMLButtonElement>>;
 //#endregion
 //#region src/Calendar/Calendar.d.ts
 type RemovedProps$41 = 'isDateUnavailable' | 'isDisabled' | 'isReadOnly' | 'isInvalid' | 'errorMessage' | 'className' | 'style';
@@ -713,7 +713,7 @@ interface CloseButtonProps extends Pick<ButtonProps, 'onPress' | 'size' | 'varia
   className?: string;
   style?: CSSProperties;
 }
-declare const CloseButton: react10.ForwardRefExoticComponent<CloseButtonProps & react10.RefAttributes<HTMLButtonElement>>;
+declare const CloseButton: react8.ForwardRefExoticComponent<CloseButtonProps & react8.RefAttributes<HTMLButtonElement>>;
 //#endregion
 //#region src/Collapsible/CollapsibleTrigger.d.ts
 interface CollapsibleProps$1 extends Omit<ButtonProps$1, 'className' | 'style'>, Pick<HeadingProps, 'level'> {
@@ -1023,7 +1023,7 @@ interface DateFieldProps extends Omit<RAC.DateFieldProps<DateValue>, RemovedProp
    */
   width?: WidthProp['width'];
 }
-declare const _DateField: react10.ForwardRefExoticComponent<DateFieldProps & react10.RefAttributes<HTMLInputElement>>;
+declare const _DateField: react8.ForwardRefExoticComponent<DateFieldProps & react8.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/DatePicker/DatePicker.d.ts
 type RemovedProps$36 = 'isDisabled' | 'isDateUnavailable' | 'isReadOnly' | 'isRequired' | 'isInvalid' | 'style' | 'className' | 'isOpen';
@@ -1065,7 +1065,7 @@ interface DatePickerProps extends Omit<RAC.DatePickerProps<DateValue>, RemovedPr
    */
   width?: WidthProp['width'];
 }
-declare const _DatePicker: react10.ForwardRefExoticComponent<DatePickerProps & react10.RefAttributes<HTMLDivElement>>;
+declare const _DatePicker: react8.ForwardRefExoticComponent<DatePickerProps & react8.RefAttributes<HTMLDivElement>>;
 //#endregion
 //#region src/Overlay/Modal.d.ts
 interface ModalProps extends Omit<RAC.ModalOverlayProps, 'render'> {
@@ -1083,7 +1083,7 @@ interface ModalProps extends Omit<RAC.ModalOverlayProps, 'render'> {
   keyboardDismissable?: boolean;
   size?: string;
 }
-declare const _Modal: react10.ForwardRefExoticComponent<Omit<ModalProps, "className" | "isOpen" | "isDismissable" | "isKeyboardDismissDisabled"> & react10.RefAttributes<HTMLDivElement>>;
+declare const _Modal: react8.ForwardRefExoticComponent<Omit<ModalProps, "className" | "isOpen" | "isDismissable" | "isKeyboardDismissDisabled"> & react8.RefAttributes<HTMLDivElement>>;
 //#endregion
 //#region src/Dialog/DialogActions.d.ts
 interface DialogActions {
@@ -1222,7 +1222,7 @@ interface ConfirmationConfig extends Pick<ConfirmationDialogProps, 'variant' | '
   content?: ReactNode;
 }
 type ConfirmationFn = (props: ConfirmationConfig) => Promise<ConfirmationResult>;
-declare const ConfirmationContext: react10.Context<ConfirmationFn | null>;
+declare const ConfirmationContext: react8.Context<ConfirmationFn | null>;
 declare const ConfirmationProvider: ({
   children
 }: PropsWithChildren) => react_jsx_runtime3.JSX.Element;
@@ -1457,7 +1457,7 @@ interface FormProps extends Omit<RAC.FormProps, 'className' | 'style'> {
    */
   maxWidth?: MaxWidthProp['maxWidth'];
 }
-declare const _Form: react10.ForwardRefExoticComponent<FormProps & react10.RefAttributes<HTMLFormElement>>;
+declare const _Form: react8.ForwardRefExoticComponent<FormProps & react8.RefAttributes<HTMLFormElement>>;
 //#endregion
 //#region src/Grid/GridArea.d.ts
 interface GridAreaProps {
@@ -1616,7 +1616,7 @@ interface InputProps extends Omit<RAC.InputProps, RemovedProps$31> {
   size?: string;
   className?: string;
 }
-declare const _Input: react10.ForwardRefExoticComponent<InputProps & react10.RefAttributes<HTMLInputElement>>;
+declare const _Input: react8.ForwardRefExoticComponent<InputProps & react8.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/Input/SearchInput.d.ts
 interface SearchInputProps extends Omit<InputProps, 'icon' | 'className'> {
@@ -1627,7 +1627,7 @@ interface SearchInputProps extends Omit<InputProps, 'icon' | 'className'> {
   };
   onClear?: () => void;
 }
-declare const SearchInput: react10.ForwardRefExoticComponent<SearchInputProps & react10.RefAttributes<HTMLInputElement>>;
+declare const SearchInput: react8.ForwardRefExoticComponent<SearchInputProps & react8.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/Inset/Inset.d.ts
 type InsetProps = (AriaRegionProps & {
@@ -1687,7 +1687,7 @@ interface LinkProps extends Omit<RAC.LinkProps, RemovedProps$29> {
    */
   disabled?: RAC.LinkProps['isDisabled'];
 }
-declare const _Link: react10.ForwardRefExoticComponent<LinkProps & react10.RefAttributes<HTMLAnchorElement>>;
+declare const _Link: react8.ForwardRefExoticComponent<LinkProps & react8.RefAttributes<HTMLAnchorElement>>;
 //#endregion
 //#region src/LinkButton/LinkButton.d.ts
 type RemovedProps$28 = 'isDisabled' | 'isPending' | 'className' | 'style';
@@ -1709,7 +1709,7 @@ interface LinkButtonProps extends Omit<RAC.LinkProps, RemovedProps$28> {
    */
   disabled?: RAC.LinkProps['isDisabled'];
 }
-declare const _LinkButton: react10.ForwardRefExoticComponent<LinkButtonProps & react10.RefAttributes<HTMLAnchorElement>>;
+declare const _LinkButton: react8.ForwardRefExoticComponent<LinkButtonProps & react8.RefAttributes<HTMLAnchorElement>>;
 //#endregion
 //#region src/List/ListItem.d.ts
 interface ListItemProps {
@@ -1767,7 +1767,7 @@ interface PopoverProps extends Omit<RAC.PopoverProps, 'isOpen' | 'isKeyboardDism
   open?: boolean;
   children: ReactNode;
 }
-declare const _Popover: react10.ForwardRefExoticComponent<PopoverProps & react10.RefAttributes<HTMLDivElement>>;
+declare const _Popover: react8.ForwardRefExoticComponent<PopoverProps & react8.RefAttributes<HTMLDivElement>>;
 //#endregion
 //#region src/Menu/Menu.d.ts
 type RemovedProps$25 = 'isOpen' | 'className' | 'style' | 'children';
@@ -2023,7 +2023,7 @@ interface NumberFieldProps extends Omit<RAC.NumberFieldProps, RemovedProps$24>,
    */
   placeholder?: string;
 }
-declare const _NumberField: react10.ForwardRefExoticComponent<NumberFieldProps & react10.RefAttributes<HTMLInputElement>>;
+declare const _NumberField: react8.ForwardRefExoticComponent<NumberFieldProps & react8.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/utils/useRenderProps.d.ts
 interface StyleRenderProps<T> {
@@ -2105,7 +2105,7 @@ interface NonModalProps extends Omit<OverlayTriggerProps, 'isOpen'>, AriaLabelin
    */
   ref?: RefObject<HTMLElement | null>;
 }
-declare const NonModal: react10.ForwardRefExoticComponent<Omit<NonModalProps, "ref"> & react10.RefAttributes<HTMLElement>>;
+declare const NonModal: react8.ForwardRefExoticComponent<Omit<NonModalProps, "ref"> & react8.RefAttributes<HTMLElement>>;
 //#endregion
 //#region src/Overlay/Underlay.d.ts
 interface UnderlayProps extends Omit<RAC.ModalOverlayProps, 'isOpen' | 'isDismissable' | 'isKeyboardDismissDisabled' | 'className' | 'render'> {
@@ -2385,7 +2385,7 @@ interface SearchFieldProps extends Omit<RAC.SearchFieldProps, RemovedProps$21>,
    */
   placeholder?: string;
 }
-declare const _SearchField: react10.ForwardRefExoticComponent<SearchFieldProps & react10.RefAttributes<HTMLInputElement>>;
+declare const _SearchField: react8.ForwardRefExoticComponent<SearchFieldProps & react8.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/SectionMessage/SectionMessageTitle.d.ts
 interface SectionMessageTitleProps {
@@ -2519,7 +2519,7 @@ interface SelectProps<T extends object, M extends SelectionMode = 'single'> exte
    */
   error?: boolean;
 }
-declare const Select: (<T extends object, M extends SelectionMode = "single">(props: SelectProps<T, M> & react10.RefAttributes<HTMLButtonElement>) => react10.ReactElement | null) & {
+declare const Select: (<T extends object, M extends SelectionMode = "single">(props: SelectProps<T, M> & react8.RefAttributes<HTMLButtonElement>) => react8.ReactElement | null) & {
   Option: ({
     ...props
   }: ListBoxItemProps) => react_jsx_runtime3.JSX.Element;
@@ -2548,7 +2548,7 @@ interface SelectListItemProps extends Omit<RAC.GridListItemProps<object>, Remove
    */
   disabled?: RAC.GridListItemProps<object>['isDisabled'];
 }
-declare const _SelectListItem: react10.ForwardRefExoticComponent<SelectListItemProps & react10.RefAttributes<HTMLDivElement>>;
+declare const _SelectListItem: react8.ForwardRefExoticComponent<SelectListItemProps & react8.RefAttributes<HTMLDivElement>>;
 //#endregion
 //#region src/SelectList/SelectList.d.ts
 type RemoveProps = 'style' | 'className' | 'onSelectionChange' | 'dragAndDropHooks';
@@ -2596,7 +2596,7 @@ interface SliderProps<T> extends Omit<RAC.SliderProps<T>, 'children' | 'isDisabl
    */
   label?: ReactNode;
 }
-declare const _Slider: react10.ForwardRefExoticComponent<SliderProps<number | number[]> & react10.RefAttributes<HTMLDivElement>>;
+declare const _Slider: react8.ForwardRefExoticComponent<SliderProps<number | number[]> & react8.RefAttributes<HTMLDivElement>>;
 //#endregion
 //#region src/Split/Split.d.ts
 declare const Split: () => react_jsx_runtime3.JSX.Element;
@@ -2673,7 +2673,7 @@ interface SwitchProps extends Omit<RAC.SwitchProps, RemovedProps$18> {
    */
   selected?: RAC.SwitchProps['isSelected'];
 }
-declare const _Switch: react10.ForwardRefExoticComponent<SwitchProps & react10.RefAttributes<HTMLLabelElement>>;
+declare const _Switch: react8.ForwardRefExoticComponent<SwitchProps & react8.RefAttributes<HTMLLabelElement>>;
 //#endregion
 //#region src/Table/TableHeader.d.ts
 type RemovedProps$17 = 'className' | 'style';
@@ -2875,9 +2875,9 @@ declare const Table: (({
     alignX,
     overflow: cellOverflow
   }: TableEditableCellProps) => react_jsx_runtime3.JSX.Element;
-  renderDropIndicator: ((target: RAC.DropTarget) => react10.JSX.Element) | undefined;
-  renderDragPreview: ((items: _react_types_shared0.DragItem[]) => react10.JSX.Element | {
-    element: react10.JSX.Element;
+  renderDropIndicator: ((target: RAC.DropTarget) => react8.JSX.Element) | undefined;
+  renderDragPreview: ((items: _react_types_shared0.DragItem[]) => react8.JSX.Element | {
+    element: react8.JSX.Element;
     x: number;
     y: number;
   }) | undefined;
@@ -3031,7 +3031,7 @@ interface TagFieldProps<T extends object> extends Omit<RAC.SelectProps<T, 'multi
    */
   emptyState?: ReactNode;
 }
-declare const TagField: (<T extends object>(props: TagFieldProps<T> & react10.RefAttributes<HTMLDivElement>) => react10.ReactElement | null) & {
+declare const TagField: (<T extends object>(props: TagFieldProps<T> & react8.RefAttributes<HTMLDivElement>) => react8.ReactElement | null) & {
   Option: ({
     ...props
   }: ListBoxItemProps) => react_jsx_runtime3.JSX.Element;
@@ -3134,7 +3134,7 @@ interface TextAreaProps extends Omit<RAC.TextFieldProps, RemovedProps$7>, Pick<R
    */
   rows?: number;
 }
-declare const _TextArea: react10.ForwardRefExoticComponent<TextAreaProps & react10.RefAttributes<HTMLTextAreaElement>>;
+declare const _TextArea: react8.ForwardRefExoticComponent<TextAreaProps & react8.RefAttributes<HTMLTextAreaElement>>;
 //#endregion
 //#region src/TextField/TextField.d.ts
 type RemovedProps$6 = 'className' | 'style' | 'children' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'value' | 'defaultValue' | 'slot';
@@ -3192,7 +3192,7 @@ interface TextFieldProps extends Omit<RAC.TextFieldProps, RemovedProps$6>, Pick<
    */
   placeholder?: string;
 }
-declare const _TextField: react10.ForwardRefExoticComponent<TextFieldProps & react10.RefAttributes<HTMLInputElement>>;
+declare const _TextField: react8.ForwardRefExoticComponent<TextFieldProps & react8.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/Tiles/Tiles.d.ts
 interface TilesProps extends AriaRegionProps {
@@ -3276,7 +3276,7 @@ interface TimeFieldProps extends Omit<RAC.TimeFieldProps<TimeValue$1>, RemovedPr
    */
   shouldForceLeadingZeros?: boolean;
 }
-declare const _TimeField: react10.ForwardRefExoticComponent<TimeFieldProps & react10.RefAttributes<HTMLInputElement>>;
+declare const _TimeField: react8.ForwardRefExoticComponent<TimeFieldProps & react8.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/Toast/Toast.d.ts
 type ToastContentProps = {

package/dist/index.mjs

@@ -2985,7 +2985,7 @@ function _objectWithoutProperties$1(e$1, t$1) {
 }
 
 //#endregion
-//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/react-select/dist/useStateManager-7e1e8489.esm.js
+//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.14_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-select/dist/useStateManager-7e1e8489.esm.js
 var _excluded$6 = [
 	"defaultInputValue",
 	"defaultMenuIsOpen",
@@ -4591,7 +4591,7 @@ function serializeStyles(args, registered, mergedProps) {
 }
 
 //#endregion
-//#region ../../node_modules/.pnpm/@emotion+use-insertion-effect-with-fallbacks@1.2.0_react@19.2.3/node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.esm.js
+//#region ../../node_modules/.pnpm/@emotion+use-insertion-effect-with-fallbacks@1.2.0_react@19.2.4/node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.esm.js
 var isBrowser$1 = typeof document !== "undefined";
 var syncFallback = function syncFallback$1(create) {
 	return create();
@@ -4601,7 +4601,7 @@ var useInsertionEffectAlwaysWithSyncFallback = !isBrowser$1 ? syncFallback : use
 var useInsertionEffectWithLayoutFallback = useInsertionEffect || React.useLayoutEffect;
 
 //#endregion
-//#region ../../node_modules/.pnpm/@emotion+react@11.14.0_@types+react@19.2.9_react@19.2.3/node_modules/@emotion/react/dist/emotion-element-d59e098f.esm.js
+//#region ../../node_modules/.pnpm/@emotion+react@11.14.0_@types+react@19.2.14_react@19.2.4/node_modules/@emotion/react/dist/emotion-element-d59e098f.esm.js
 var isDevelopment = false;
 var isBrowser = typeof document !== "undefined";
 var EmotionCacheContext = /* @__PURE__ */ React.createContext(typeof HTMLElement !== "undefined" ? /* @__PURE__ */ createCache({ key: "css" }) : null);
@@ -4684,7 +4684,7 @@ var require_extends = /* @__PURE__ */ __commonJSMin(((exports, module) => {
 }));
 
 //#endregion
-//#region ../../node_modules/.pnpm/@emotion+react@11.14.0_@types+react@19.2.9_react@19.2.3/node_modules/@emotion/react/dist/emotion-react.esm.js
+//#region ../../node_modules/.pnpm/@emotion+react@11.14.0_@types+react@19.2.14_react@19.2.4/node_modules/@emotion/react/dist/emotion-react.esm.js
 var import_extends = require_extends();
 var import_hoist_non_react_statics_cjs = require_hoist_non_react_statics_cjs();
 var jsx$1 = function jsx$2(type, props) {
@@ -4830,7 +4830,7 @@ function getFrameElement(win) {
 }
 
 //#endregion
-//#region ../../node_modules/.pnpm/@floating-ui+dom@1.7.3/node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
+//#region ../../node_modules/.pnpm/@floating-ui+dom@1.7.4/node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
 function getCssDimensions(element) {
 	const css$3 = getComputedStyle$1(element);
 	let width$1 = parseFloat(css$3.width) || 0;
@@ -5037,11 +5037,11 @@ function autoUpdate(reference, floating, update, options$1) {
 }
 
 //#endregion
-//#region ../../node_modules/.pnpm/use-isomorphic-layout-effect@1.2.1_@types+react@19.2.9_react@19.2.3/node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.esm.js
+//#region ../../node_modules/.pnpm/use-isomorphic-layout-effect@1.2.1_@types+react@19.2.14_react@19.2.4/node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.esm.js
 var index = typeof document !== "undefined" ? useLayoutEffect : function noop$1() {};
 
 //#endregion
-//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/react-select/dist/index-641ee5b8.esm.js
+//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.14_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-select/dist/index-641ee5b8.esm.js
 var _excluded$4 = [
 	"className",
 	"clearValue",
@@ -6021,7 +6021,7 @@ var require_memoize_one_cjs = /* @__PURE__ */ __commonJSMin(((exports, module) =
 }));
 
 //#endregion
-//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/react-select/dist/Select-ef7c0426.esm.js
+//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.14_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-select/dist/Select-ef7c0426.esm.js
 var import_memoize_one_cjs = /* @__PURE__ */ __toESM(require_memoize_one_cjs());
 function _EMOTION_STRINGIFIED_CSS_ERROR__$2() {
 	return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
@@ -8572,7 +8572,7 @@ var require_taggedTemplateLiteral = /* @__PURE__ */ __commonJSMin(((exports, mod
 }));
 
 //#endregion
-//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/react-select/dist/react-select.esm.js
+//#region ../../node_modules/.pnpm/react-select@5.10.2_@types+react@19.2.14_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-select/dist/react-select.esm.js
 var import_objectSpread2 = require_objectSpread2();
 var import_slicedToArray = require_slicedToArray();
 var import_objectWithoutProperties = require_objectWithoutProperties();
@@ -10174,14 +10174,17 @@ const _TagField = forwardRef(function TagField$1({ disabled, required, items, va
 		...props,
 		children: [/* @__PURE__ */ jsxs(Group, {
 			ref: triggerRef,
-			className: cn("w-(--field-width) max-w-full min-w-0", classNames$2.trigger),
-			children: [/* @__PURE__ */ jsx(TagDisplay, {
-				placeholder,
-				classNames: classNames$2,
-				disabled
-			}), /* @__PURE__ */ jsx(IconButton, {
-				className: classNames$2.button,
-				children: /* @__PURE__ */ jsx(ChevronsVertical, {})
+			className: cn("grid w-(--field-width) max-w-full min-w-0", classNames$2.trigger),
+			children: [/* @__PURE__ */ jsx(Button, { className: "col-start-1 row-start-1 h-full w-full cursor-pointer opacity-0" }), /* @__PURE__ */ jsxs("div", {
+				className: "pointer-events-none col-start-1 row-start-1 flex flex-1 items-center justify-between gap-1 **:[[role=row]]:pointer-events-auto",
+				children: [/* @__PURE__ */ jsx(TagDisplay, {
+					placeholder,
+					classNames: classNames$2,
+					disabled
+				}), /* @__PURE__ */ jsx(ChevronsVertical, {
+					className: "size-4 shrink-0",
+					"aria-hidden": "true"
+				})]
 			})]
 		}), isSmallScreen ? /* @__PURE__ */ jsxs(Tray, { children: [
 			/* @__PURE__ */ jsx(Tray.Title, { children: rest.label }),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marigold/components",
-  "version": "17.0.0",
+  "version": "17.1.0",
   "description": "Components for the Marigold Design System",
   "license": "MIT",
   "keywords": [
@@ -66,10 +66,10 @@
     "@react-stately/tree": "^3.9.5",
     "@react-types/shared": "^3.33.0",
     "@react-types/table": "^3.13.5",
-    "motion": "12.23.26",
+    "motion": "12.34.0",
     "react-aria-components": "^1.15.0",
     "react-stately": "^3.44.0",
-    "@marigold/system": "17.0.0",
+    "@marigold/system": "17.1.0",
     "@marigold/types": "1.4.0"
   },
   "peerDependencies": {
@@ -77,12 +77,12 @@
     "react-dom": ">=17.0.0"
   },
   "devDependencies": {
-    "@types/react": "19.2.7",
-    "lucide-react": "0.555.0",
-    "react": "19.2.3",
-    "react-dom": "19.2.3",
+    "@types/react": "19.2.14",
+    "lucide-react": "0.564.0",
+    "react": "19.2.4",
+    "react-dom": "19.2.4",
     "tsdown": "0.16.8",
-    "@marigold/icons": "1.3.31",
+    "@marigold/icons": "1.3.33",
     "@marigold/tsconfig": "0.4.2"
   },
   "scripts": {