@marigold/components 11.4.1 → 12.0.0

package/dist/index.d.ts

@@ -1,14 +1,15 @@
 import { Orientation, RefObject, AriaLabelingProps as AriaLabelingProps$1 } from '@react-types/shared';
 export { Selection } from '@react-types/shared';
 export { useAsyncList, useListData } from '@react-stately/data';
+import { GapSpaceProp, AspectProp, WidthProp, PaddingSpaceProp, PaddingRightProp, PaddingLeftProp, PaddingBottomProp, PaddingTopProp, PaddingSpacePropX, PaddingSpacePropY, PlaceItemsProp, MaxWidthProp, HeightProp, TextAlignProp, ObjectFitProp, ObjectPositionProp, alignment, Theme, ThemeProviderProps, FontSizeProp, FontWeightProp, FontStyleProp, CursorProp } from '@marigold/system';
+export { DateFormat, NumericFormat, ThemeProvider, useTheme } from '@marigold/system';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import RAC, { ValidationResult, Key, DateValue, SlotProps, TagListProps, ProgressBarProps } from 'react-aria-components';
-export { Form, FormProps, RouterProvider } from 'react-aria-components';
+import RAC, { ValidationResult, Key, DialogProps as DialogProps$1, DateValue, SlotProps, TagListProps, ProgressBarProps } from 'react-aria-components';
+export { RouterProvider } from 'react-aria-components';
 import * as react from 'react';
 import react__default, { ReactNode, ReactElement, ElementType, ComponentPropsWithRef, ForwardRefExoticComponent, RefAttributes, Key as Key$1, CSSProperties, Dispatch, SetStateAction, JSX } from 'react';
-import { GapSpaceProp, AspectProp, WidthProp, PaddingSpaceProp, PaddingRightProp, PaddingLeftProp, PaddingBottomProp, PaddingTopProp, PaddingSpacePropX, PaddingSpacePropY, PlaceItemsProp, HeightProp, TextAlignProp, ObjectFitProp, ObjectPositionProp, alignment, Theme, ThemeProviderProps, FontSizeProp, FontWeightProp, FontStyleProp, CursorProp } from '@marigold/system';
-export { ThemeProvider, useTheme } from '@marigold/system';
 import { AriaRegionProps, NonZeroPercentage, DistributiveOmit, HtmlProps, AriaLabelingProps } from '@marigold/types';
+import { AriaLandmarkRole } from '@react-aria/landmark';
 import { Props } from 'react-select';
 import { OverlayTriggerState, OverlayTriggerProps } from 'react-stately';
 export { I18nProvider } from '@react-aria/i18n';
@@ -126,8 +127,7 @@ interface FieldGroupProps {
 }
 declare const FieldGroup: ({ labelWidth, children }: FieldGroupProps) => react_jsx_runtime.JSX.Element;
 
-interface ListBoxItemProps extends Omit<RAC.ListBoxItemProps, 'style' | 'className'> {
-}
+type ListBoxItemProps = Omit<RAC.ListBoxItemProps, 'style' | 'className'>;
 declare const _ListBoxItem: ({ ...props }: ListBoxItemProps) => react_jsx_runtime.JSX.Element;
 
 interface SectionProps extends Omit<RAC.SectionProps<object>, 'className' | 'style' | 'children'> {
@@ -402,8 +402,10 @@ interface CheckboxGroupProps extends Omit<RAC.CheckboxGroupProps, RemovedProps$m
 }
 declare const _CheckboxGroup: ({ children, variant, size, required, disabled, readOnly, error, width, orientation, ...rest }: CheckboxGroupProps) => react_jsx_runtime.JSX.Element;
 
-type RemovedProps$l = 'className' | 'style' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'isSelected' | 'isIndeterminate' | 'defaultSelected';
+type RemovedProps$l = 'children' | 'className' | 'style' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'isSelected' | 'isIndeterminate' | 'defaultSelected';
 interface CheckboxProps extends Omit<RAC.CheckboxProps, RemovedProps$l> {
+    variant?: string;
+    size?: string;
     /**
      * Whether the element should be checked (controlled).
      */
@@ -437,12 +439,11 @@ interface CheckboxProps extends Omit<RAC.CheckboxProps, RemovedProps$l> {
      * @default false
      */
     error?: boolean;
-    variant?: string;
-    size?: string;
     /**
-     * Children of the component.
+     * Set the label of the checkbox.
+     *
      */
-    children?: ReactNode;
+    label?: ReactNode;
 }
 interface CheckboxComponent extends ForwardRefExoticComponent<CheckboxProps & RefAttributes<HTMLLabelElement>> {
     /**
@@ -543,8 +544,17 @@ interface ModalProps$1 extends RAC.ModalOverlayProps {
 }
 interface DialogTriggerProps extends Omit<RAC.DialogTriggerProps, 'isOpen'>, Omit<ModalProps$1, RemovedProps$k> {
 }
-declare const _DialogTrigger: ({ open, dismissable, keyboardDismissable, size, ...rest }: DialogTriggerProps) => ReactNode;
+declare const _DialogTrigger: ({ open, dismissable, keyboardDismissable, ...rest }: DialogTriggerProps) => ReactNode;
 
+interface DialogComponent extends ForwardRefExoticComponent<DialogProps & RefAttributes<HTMLInputElement>> {
+    /**
+     * Options for the Combobox.
+     */
+    Trigger: typeof _DialogTrigger;
+    Title: typeof DialogTitle;
+    Content: typeof DialogContent;
+    Actions: typeof DialogActions;
+}
 interface DialogProps extends Omit<RAC.DialogProps, 'className' | 'style'> {
     variant?: string;
     size?: string;
@@ -553,14 +563,18 @@ interface DialogProps extends Omit<RAC.DialogProps, 'className' | 'style'> {
      */
     closeButton?: boolean;
 }
-interface DialogComponent extends ForwardRefExoticComponent<DialogProps & RefAttributes<HTMLInputElement>> {
+interface DialogProps extends Omit<RAC.DialogProps, 'className' | 'style'> {
+    variant?: string;
+    size?: string;
     /**
-     * Options for the Combobox.
+     * Show the close button.
      */
-    Trigger: typeof _DialogTrigger;
-    Title: typeof DialogTitle;
-    Content: typeof DialogContent;
-    Actions: typeof DialogActions;
+    closeButton?: boolean;
+    /**
+     * If `true`, the dialog will be non-modal, meaning it will not block interaction with the background content.
+     * @default false
+     */
+    isNonModal?: boolean;
 }
 declare const _Dialog: DialogComponent;
 
@@ -569,6 +583,78 @@ interface DividerProps extends RAC.SeparatorProps {
 }
 declare const _Divider: ({ variant, ...props }: DividerProps) => react_jsx_runtime.JSX.Element;
 
+interface DrawerContentProps {
+    variant?: string;
+    size?: string;
+    /**
+     * Children of the component.
+     */
+    children?: ReactNode;
+}
+
+interface DrawerTitleProps {
+    variant?: string;
+    size?: string;
+    /**
+     * Children of the component.
+     */
+    children?: React.ReactNode;
+}
+
+interface DrawerTriggerProps extends Omit<RAC.DialogTriggerProps, 'isOpen'> {
+    /**
+     * Whether the overlay is open by default (controlled).
+     * @default false
+     */
+    open?: boolean;
+}
+
+interface DrawerActions {
+    variant?: string;
+    size?: string;
+    /**
+     * Children of the component.
+     */
+    children?: ReactNode;
+}
+declare const DrawerActions: ({ variant, size, children }: DrawerActions) => react_jsx_runtime.JSX.Element;
+
+interface DrawerProps extends Omit<DialogProps$1, 'className' | 'style' | 'isOpen' | 'role'> {
+    variant?: string;
+    size?: string;
+    /**
+     * Whether the overlay is open by default (controlled).
+     * @default undefined
+     */
+    open?: boolean;
+    /**
+     * Whether pressing the escape key closes the modal.
+     * @default true
+     */
+    keyboardDismissable?: boolean;
+    /**
+     * Show the close button.
+     */
+    closeButton?: boolean;
+    /**
+     * The `role` property sets the ARIA landmark role for this component,
+     * enhancing accessibility by clarifying its purpose to assistive technologies.
+     *
+     * Only ARIA landmark roles (e.g., "complementary", "search", "banner", "navigation")
+     * can be used to ensure proper semantic context. Defaults to `"complementary"`
+     * for secondary content (e.g., filters, sidebar) that supports the main content.
+     * @default "complementary"
+     */
+    role?: Exclude<AriaLandmarkRole, 'main'>;
+}
+declare const Drawer: {
+    ({ children, variant, size, open, keyboardDismissable, closeButton, role, ...props }: DrawerProps): react_jsx_runtime.JSX.Element;
+    Trigger: ({ open, children, ...props }: DrawerTriggerProps) => react_jsx_runtime.JSX.Element;
+    Title: ({ variant, size, children }: DrawerTitleProps) => react_jsx_runtime.JSX.Element;
+    Content: ({ variant, size, children, }: DrawerContentProps) => react_jsx_runtime.JSX.Element;
+    Actions: ({ variant, size, children }: DrawerActions) => react_jsx_runtime.JSX.Element;
+};
+
 interface FooterProps extends Omit<HtmlProps<'footer'>, 'className'> {
     /**
      * The children of the component.
@@ -579,6 +665,15 @@ interface FooterProps extends Omit<HtmlProps<'footer'>, 'className'> {
 }
 declare const Footer: ({ children, variant, size, ...props }: FooterProps) => react_jsx_runtime.JSX.Element;
 
+interface FormProps extends Omit<RAC.FormProps, 'className' | 'style'>, MaxWidthProp {
+    /**
+     * Removes the form's visual container so that it does not impact the layout,
+     * letting child elements render naturally.
+     */
+    unstyled?: boolean;
+}
+declare const _Form: ({ unstyled, maxWidth, ...props }: FormProps) => react_jsx_runtime.JSX.Element;
+
 interface GridAreaProps {
     /**
      * Name of the grid area slot.
@@ -863,8 +958,7 @@ interface MenuSectionProps extends Omit<RAC.SectionProps<object>, RemovedProps$d
 }
 
 type RemovedProps$c = 'style' | 'className';
-interface MenuItemProps extends Omit<RAC.MenuItemProps, RemovedProps$c> {
-}
+type MenuItemProps = Omit<RAC.MenuItemProps, RemovedProps$c>;
 
 interface PopoverProps extends Omit<RAC.PopoverProps, 'isOpen' | 'isKeyboardDismissDisabled' | 'style' | 'className' | 'children'> {
     keyboardDismissDisabled?: boolean;
@@ -1226,14 +1320,13 @@ interface PaginationProps {
      */
     onChange?: (page: number) => void;
     /**
-     * Labels for the pagination controls.
+     * Labels for the pagination controls (Previous and Next button).
      */
     controlLabels?: [string, string];
 }
-declare const _Pagination: ({ defaultPage, page, totalItems, pageSize, onChange, controlLabels, }: PaginationProps) => react_jsx_runtime.JSX.Element;
+declare const _Pagination: ({ defaultPage, page, totalItems, pageSize, ...props }: PaginationProps) => react_jsx_runtime.JSX.Element;
 
-interface MarigoldProviderProps<T extends Theme> extends ThemeProviderProps<T> {
-}
+type MarigoldProviderProps<T extends Theme> = ThemeProviderProps<T>;
 declare function MarigoldProvider<T extends Theme>({ children, className, theme, }: MarigoldProviderProps<T>): react_jsx_runtime.JSX.Element;
 
 declare const OverlayContainerProvider: react.Provider<string | undefined>;
@@ -1483,7 +1576,9 @@ interface ScrollableProps extends WidthProp, AriaRegionProps {
 }
 declare const Scrollable: ({ children, width, height, ...props }: ScrollableProps) => react_jsx_runtime.JSX.Element;
 
-interface SliderProps<T> extends Omit<RAC.SliderProps<T>, 'isDisabled' | 'orientation'>, Pick<FieldBaseProps<'label'>, 'description'> {
+interface SliderProps<T> extends Omit<RAC.SliderProps<T>, 'children' | 'isDisabled' | 'orientation'>, Pick<FieldBaseProps<'label'>, 'description'> {
+    variant?: string;
+    size?: string;
     /**
      * Labels for the thumbs in the slider. Also used for the name when submitting the form.
      */
@@ -1493,23 +1588,18 @@ interface SliderProps<T> extends Omit<RAC.SliderProps<T>, 'isDisabled' | 'orient
      * @default full
      */
     width?: WidthProp['width'];
-    variant?: string;
-    size?: string;
     /**
      * If `true`, the input is disabled.
      * @default false
      */
     disabled?: boolean;
     /**
-     * @deprecated Will be removed in the next major version. Use `label` prop instead.
+     * Set the label of the slider.
      */
-    children?: ReactNode;
     label?: string;
 }
-declare const _Slider: react__default.ForwardRefExoticComponent<SliderProps<number | number[]> & react__default.RefAttributes<HTMLDivElement>>;
+declare const _Slider: react.ForwardRefExoticComponent<SliderProps<number | number[]> & react.RefAttributes<HTMLDivElement>>;
 
-interface SplitProps {
-}
 declare const Split: () => react_jsx_runtime.JSX.Element;
 
 interface StackProps extends GapSpaceProp, AriaRegionProps {
@@ -1533,11 +1623,14 @@ interface StackProps extends GapSpaceProp, AriaRegionProps {
 }
 declare const Stack: ({ children, space, stretch, alignX, alignY, ...props }: StackProps) => react_jsx_runtime.JSX.Element;
 
-type RemovedProps$6 = 'className' | 'isDisabled' | 'isReadOnly' | 'isSelected' | 'children' | 'slot';
+type RemovedProps$6 = 'children' | 'className' | 'isDisabled' | 'isReadOnly' | 'isSelected' | 'children' | 'slot';
 interface SwitchProps extends Omit<RAC.SwitchProps, RemovedProps$6> {
     variant?: string;
     size?: string;
-    children?: ReactNode;
+    /**
+     * Set the label of the switch.
+     */
+    label?: ReactNode;
     /**
      * Sets the width of the field. You can see allowed tokens here: https://tailwindcss.com/docs/width
      * @default full
@@ -1796,7 +1889,7 @@ declare const _Tooltip: {
 };
 
 type RemovedProps$1 = 'className' | 'style' | 'children' | 'isRequired';
-interface TagGroupProps extends Omit<RAC.TagGroupProps, RemovedProps$1>, Pick<TagListProps<object>, 'items' | 'children' | 'renderEmptyState'>, Pick<FieldBaseProps<'label'>, 'label' | 'description'> {
+interface TagGroupProps extends Omit<RAC.TagGroupProps, RemovedProps$1>, Pick<TagListProps<object>, 'items' | 'children'>, Pick<FieldBaseProps<'label'>, 'label' | 'description'> {
     variant?: string;
     size?: string;
     /**
@@ -1805,16 +1898,15 @@ interface TagGroupProps extends Omit<RAC.TagGroupProps, RemovedProps$1>, Pick<Ta
      */
     width?: WidthProp['width'];
     /**
-     * Displays a remove button on each tag.
-     * @default false
+     * The name of the field, used when submitting form data.
+     */
+    name?: string;
+    /**
+     * Provides content to display when there are no items in the tag list.
      */
-    allowsRemoving?: boolean;
+    emptyState?: TagListProps<object>['renderEmptyState'];
 }
 
-interface CloseButtonProps {
-    className: string;
-}
-declare const CloseButton: ({ className }: CloseButtonProps) => react_jsx_runtime.JSX.Element;
 type RemovedProps = 'className' | 'style' | 'isDisabled';
 interface TagProps extends Omit<RAC.TagProps, RemovedProps> {
     variant?: string;
@@ -1824,7 +1916,7 @@ interface TagProps extends Omit<RAC.TagProps, RemovedProps> {
 }
 declare const _Tag: {
     ({ variant, size, children, disabled, ...rest }: TagProps): react_jsx_runtime.JSX.Element;
-    Group: ({ width, items, children, renderEmptyState, variant, size, ...rest }: TagGroupProps) => react_jsx_runtime.JSX.Element;
+    Group: ({ width, items, children, emptyState, variant, size, name, ...rest }: TagGroupProps) => react_jsx_runtime.JSX.Element;
 };
 
 interface LoaderProps extends Pick<ProgressBarProps, 'id' | 'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-details'> {
@@ -1845,13 +1937,11 @@ interface XLoaderProps extends LoaderProps {
 }
 declare const XLoader: ({ mode, variant, ...props }: XLoaderProps) => react_jsx_runtime.JSX.Element;
 
-interface TabProps extends Omit<RAC.TabProps, 'className' | 'style'> {
-}
+type TabProps = Omit<RAC.TabProps, 'className' | 'style'>;
 
-interface TabPanelProps extends Omit<RAC.TabPanelProps, 'className' | 'style'> {
-}
+type TabPanelProps = Omit<RAC.TabPanelProps, 'className' | 'style'>;
 
-interface TabListProps extends Omit<RAC.TabListProps<Object>, 'className' | 'style'>, GapSpaceProp {
+interface TabListProps extends Omit<RAC.TabListProps<object>, 'className' | 'style'>, GapSpaceProp {
 }
 
 interface TabsProps extends Omit<RAC.TabsProps, 'className' | 'style' | 'isDisabled' | 'orientation' | 'slot'> {
@@ -1870,4 +1960,4 @@ declare const _Tabs: {
     Item: (props: TabProps) => react_jsx_runtime.JSX.Element;
 };
 
-export { Accordion, AccordionItem, type AccordionProps, ActionMenu, type GridAreaProps as AreaProps, Aside, type AsideProps, Aspect, type AspectProps, _Autocomplete as Autocomplete, type AutocompleteProps, Badge, type BadgeProps, Body, type BodyProps, Breakout, type BreakoutProps, _Button as Button, type ButtonProps, _Calendar as Calendar, type CalendarProps, Card, type CardProps, Center, type CenterProps, _Checkbox as Checkbox, type CheckboxComponent, _CheckboxGroup as CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, CloseButton, type ColumnProps, Columns, type ColumnsProps, _ComboBox as ComboBox, type ComboBoxProps, Container, type ContainerProps, _DateField as DateField, type DateFieldProps, _DatePicker as DatePicker, type DatePickerProps, _Dialog as Dialog, type DialogProps, type DisclosureProps, _Divider as Divider, type DividerProps, FieldBase, type FieldBaseProps, FieldGroup, FieldGroupContext, type FieldGroupContextProps, type FieldGroupProps, Footer, type FooterProps, Grid, type GridProps, _Header as Header, type HeaderProps, _Headline as Headline, type HeadlineProps, Image, type ImageProps, Inline, type InlineProps, _Input as Input, type InputProps, Inset, type InsetProps, _Label as Label, type LabelProps, _Link as Link, type LinkProps, List, type ListProps, MarigoldProvider, type MarigoldProviderProps, _Menu as Menu, type MenuProps, _Modal as Modal, type ModalProps, Multiselect, NonModal, type NonModalProps, type NonModalRenderProps, _NumberField as NumberField, type NumberFieldProps, OverlayContainerProvider, _Pagination as Pagination, type PaginationProps, _Popover as Popover, type PopoverProps, _Radio as Radio, type RadioComponent, _RadioGroup as RadioGroup, type RadioGroupProps, type RadioProps, type RemovedProps$l as RemovedProps, type RowProps, Scrollable, type ScrollableProps, _SearchField as SearchField, type SearchFieldProps, SectionMessage, type SectionMessageProps, _Select as Select, type SelectComponent, _SelectList as SelectList, type SelectListProps, type SelectProps, _Slider as Slider, type SliderProps, Split, type SplitProps, Stack, type StackProps, _Switch as Switch, type SwitchProps, Table, type TableProps, _Tabs as Tabs, type TabsProps, _Tag as Tag, type TagProps, type TemplateValue, _Text as Text, _TextArea as TextArea, type TextAreaProps, _TextField as TextField, type TextFieldProps, type TextProps, Tiles, type TilesProps, _Tooltip as Tooltip, type TooltipProps, Underlay, type UnderlayProps, XLoader, type XLoaderProps, _Calendar, gridColsAlign, gridColumn, useFieldGroupContext, usePortalContainer };
+export { Accordion, AccordionItem, type AccordionProps, ActionMenu, type GridAreaProps as AreaProps, Aside, type AsideProps, Aspect, type AspectProps, _Autocomplete as Autocomplete, type AutocompleteProps, Badge, type BadgeProps, Body, type BodyProps, Breakout, type BreakoutProps, _Button as Button, type ButtonProps, _Calendar as Calendar, type CalendarProps, Card, type CardProps, Center, type CenterProps, _Checkbox as Checkbox, type CheckboxComponent, _CheckboxGroup as CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type ColumnProps, Columns, type ColumnsProps, _ComboBox as ComboBox, type ComboBoxProps, Container, type ContainerProps, _DateField as DateField, type DateFieldProps, _DatePicker as DatePicker, type DatePickerProps, _Dialog as Dialog, type DialogProps, type DisclosureProps, _Divider as Divider, type DividerProps, Drawer, FieldBase, type FieldBaseProps, FieldGroup, FieldGroupContext, type FieldGroupContextProps, type FieldGroupProps, Footer, type FooterProps, _Form as Form, type FormProps, Grid, type GridProps, _Header as Header, type HeaderProps, _Headline as Headline, type HeadlineProps, Image, type ImageProps, Inline, type InlineProps, _Input as Input, type InputProps, Inset, type InsetProps, _Label as Label, type LabelProps, _Link as Link, type LinkProps, List, type ListProps, MarigoldProvider, type MarigoldProviderProps, _Menu as Menu, type MenuProps, _Modal as Modal, type ModalProps, Multiselect, NonModal, type NonModalProps, type NonModalRenderProps, _NumberField as NumberField, type NumberFieldProps, OverlayContainerProvider, _Pagination as Pagination, type PaginationProps, _Popover as Popover, type PopoverProps, _Radio as Radio, type RadioComponent, _RadioGroup as RadioGroup, type RadioGroupProps, type RadioProps, type RemovedProps$l as RemovedProps, type RowProps, Scrollable, type ScrollableProps, _SearchField as SearchField, type SearchFieldProps, SectionMessage, type SectionMessageProps, _Select as Select, type SelectComponent, _SelectList as SelectList, type SelectListProps, type SelectProps, _Slider as Slider, type SliderProps, Split, Stack, type StackProps, _Switch as Switch, type SwitchProps, Table, type TableProps, _Tabs as Tabs, type TabsProps, _Tag as Tag, type TagProps, type TemplateValue, _Text as Text, _TextArea as TextArea, type TextAreaProps, _TextField as TextField, type TextFieldProps, type TextProps, Tiles, type TilesProps, _Tooltip as Tooltip, type TooltipProps, Underlay, type UnderlayProps, XLoader, type XLoaderProps, _Calendar, gridColsAlign, gridColumn, useFieldGroupContext, usePortalContainer };