@marigold/components 5.0.0 → 5.2.0

package/dist/index.d.ts

@@ -20,6 +20,7 @@ import { AriaTextFieldProps } from '@react-types/textfield';
 import { PositionProps } from '@react-types/overlays';
 import { TooltipTriggerProps as TooltipTriggerProps$1 } from '@react-types/tooltip';
 import { aspect, size } from '@marigold/tokens';
+import { SearchAutocompleteProps } from '@react-types/autocomplete';
 import { CheckboxGroupState } from '@react-stately/checkbox';
 import { OverlayProps as OverlayProps$1, AriaPopoverProps, AriaModalOverlayProps } from '@react-aria/overlays';
 import { OverlayTriggerState } from '@react-stately/overlays';
@@ -235,15 +236,24 @@ interface ImageProps extends HtmlProps<'img'> {
 }
 declare const Image: ({ variant, size, fit, position, ...props }: ImageProps) => JSX.Element;
 
+interface InputFieldOwnProps extends Omit<HtmlProps<'input'>, 'size'> {
+}
+interface InputFieldProps extends Omit<React.ComponentPropsWithRef<'input'>, 'size'>, InputFieldOwnProps {
+}
+declare const InputField: React.ForwardRefExoticComponent<InputFieldOwnProps & React.RefAttributes<HTMLInputElement>>;
+
 interface InputThemeExtension extends ThemeExtension<'Input'> {
 }
-interface InputOwnProps extends Omit<HtmlProps<'input'>, 'size'> {
-    size?: string;
+interface InputProps extends Omit<HtmlProps<'div'>, 'size'> {
+    children: ReactNode;
+    space?: ResponsiveStyleValue<string>;
     variant?: string;
+    size?: string;
 }
-interface InputProps extends Omit<React.ComponentPropsWithRef<'input'>, 'size'>, InputOwnProps {
-}
-declare const Input: React.ForwardRefExoticComponent<InputOwnProps & React.RefAttributes<HTMLInputElement>>;
+declare const Input: {
+    ({ space, children, variant, size, ...props }: InputProps): JSX.Element;
+    Field: React.ForwardRefExoticComponent<InputFieldOwnProps & React.RefAttributes<HTMLInputElement>>;
+};
 
 interface LinkThemeExtension extends ThemeExtension<'Link'> {
 }
@@ -580,6 +590,34 @@ interface AspectProps extends HtmlProps<'div'> {
 }
 declare const Aspect: ({ ratio, maxWidth, children, }: AspectProps) => JSX.Element;
 
+interface AutocompleteProps extends Omit<SearchAutocompleteProps<object>, 'isDisabled' | 'isRequired' | 'isReadonly' | 'validationState' | 'icon' | 'onInputChange' | 'inputValue' | 'defaultInputValue'> {
+    disabled?: boolean;
+    required?: boolean;
+    readOnly?: boolean;
+    error?: boolean;
+    defaultValue?: SearchAutocompleteProps<object>['defaultInputValue'];
+    value?: SearchAutocompleteProps<object>['inputValue'];
+    /**
+     * Handler that is called when the input value changes.
+     */
+    onChange?: SearchAutocompleteProps<object>['onInputChange'];
+    /**
+     * Handler that is called when the SearchAutocomplete is submitted.
+     *
+     * A `key` will be passed if the submission is a selected item (e.g. a user
+     * clicks or presses enter on an option). If the input is a custom `value`, `key` will be `null`.
+     *
+     * A `value` will be passed if the submission is a custom value (e.g. a user
+     * types then presses enter). If the input is a selected item, `value` will be `null`.
+     */
+    onSubmit?: (key: Key | null, value: string | null) => void;
+    width?: string;
+}
+declare const Autocomplete: {
+    ({ disabled, required, readOnly, error, onChange, value, defaultValue, width, ...rest }: AutocompleteProps): JSX.Element;
+    Item: <T>(props: _react_types_shared.ItemProps<T>) => JSX.Element;
+};
+
 interface BreakoutProps extends HtmlProps<'div'> {
     children?: ReactNode;
     alignY?: 'top' | 'bottom' | 'center';
@@ -632,6 +670,19 @@ interface InlineProps {
 }
 declare const Inline: ({ space, alignX, alignY, children, ...props }: InlineProps) => JSX.Element;
 
+type InsetProps = {
+    children: ReactNode;
+    space?: never;
+    spaceX?: ResponsiveStyleValue<string>;
+    spaceY?: ResponsiveStyleValue<string>;
+} | {
+    children: ReactNode;
+    space?: ResponsiveStyleValue<string>;
+    spaceX?: never;
+    spaceY?: never;
+};
+declare const Inset: ({ space, spaceX, spaceY, children }: InsetProps) => JSX.Element;
+
 interface MarigoldProviderProps<T extends Theme$1> extends ThemeProviderProps<T>, GlobalProps {
 }
 declare function MarigoldProvider<T extends Theme$1>({ children, theme, selector, normalizeDocument, }: MarigoldProviderProps<T>): JSX.Element;
@@ -691,4 +742,4 @@ declare const Tiles: ({ space, stretch, equalHeight, tilesWidth, children, ...pr
 
 declare const XLoader: React.ForwardRefExoticComponent<SVGProps & React.RefAttributes<SVGElement>>;
 
-export { ActionMenu, Aside, AsideProps, Aspect, AspectProps, Badge, BadgeProps, BadgeThemeExtension, Body, BodyProps, BodyThemeExtension, Breakout, BreakoutProps, Button, ButtonOwnProps, ButtonProps, ButtonThemeExtension, Card, CardProps, CardThemeExtension, Center, CenterProps, Checkbox, CheckboxGroup, CheckboxGroupContext, CheckboxGroupContextProps, CheckboxProps, CheckboxThemeExtension, Columns, ColumnsProps, Container, ContainerProps, CustomCheckboxProps, CustomRadioProps, CustomSwitchProps, CustomTextAreaEvents, CustomTextFieldEvents, CustomizedTheme, Dialog, DialogChildProps, DialogProps, DialogThemeExtension, Divider, DividerProps, DividerThemeExtension, FieldBase, FieldBaseProps, FieldGroup, FieldGroupContext, FieldGroupContextProps, FieldGroupProps, FieldThemeExtension, Footer, FooterProps, FooterThemeExtension, Header, HeaderProps, HeaderThemeExtension, Headline, HeadlineProps, HeadlineThemeExtension, Image, ImageProps, ImageThemeExtension, Inline, InlineProps, Input, InputOwnProps, InputProps, InputThemeExtension, Label, LabelProps, LabelThemeExtension, Link, LinkOwnProps, LinkProps, LinkThemeExtension, List, ListProps, ListThemeExtension, MarigoldProvider, MarigoldProviderProps, Menu, MenuProps, MenuThemeExtension, Message, MessageProps, MessageThemeExtension, Modal, ModalProps, NumberField, NumberFieldProps, NumberFieldThemeExtension, Overlay, OverlayProps, Popover, PopoverProps, Radio, RadioComponent, RadioGroupProps, RadioProps, RadioThemeExtension, RowProps, Select, SelectComponent, SelectProps, SelectThemeExtension, Slider, SliderProps, SliderThemeExtension, Split, SplitProps, Stack, StackProps, Switch, SwitchProps, SwitchThemeExtension, Table, TableProps, TableThemeExtension, Text, TextArea, TextAreaProps, TextAreaThemeExtension, TextField, TextFieldProps, TextProps, TextThemeExtension, Theme, Tiles, TilesProps, Tooltip, TooltipProps, TooltipThemeExtension, Tray, TrayProps, TrayWrapper, Underlay, UnderlayProps, UnderlayThemeExtension, XLoader, extendTheme, useCheckboxGroupContext, useFieldGroupContext };
+export { ActionMenu, Aside, AsideProps, Aspect, AspectProps, Autocomplete, AutocompleteProps, Badge, BadgeProps, BadgeThemeExtension, Body, BodyProps, BodyThemeExtension, Breakout, BreakoutProps, Button, ButtonOwnProps, ButtonProps, ButtonThemeExtension, Card, CardProps, CardThemeExtension, Center, CenterProps, Checkbox, CheckboxGroup, CheckboxGroupContext, CheckboxGroupContextProps, CheckboxGroupProps, CheckboxProps, CheckboxThemeExtension, Columns, ColumnsProps, Container, ContainerProps, CustomCheckboxProps, CustomRadioProps, CustomSwitchProps, CustomTextAreaEvents, CustomTextFieldEvents, CustomizedTheme, Dialog, DialogChildProps, DialogProps, DialogThemeExtension, Divider, DividerProps, DividerThemeExtension, FieldBase, FieldBaseProps, FieldGroup, FieldGroupContext, FieldGroupContextProps, FieldGroupProps, FieldThemeExtension, Footer, FooterProps, FooterThemeExtension, Header, HeaderProps, HeaderThemeExtension, Headline, HeadlineProps, HeadlineThemeExtension, Image, ImageProps, ImageThemeExtension, Inline, InlineProps, Input, InputField, InputFieldOwnProps, InputFieldProps, InputProps, InputThemeExtension, Inset, InsetProps, Label, LabelProps, LabelThemeExtension, Link, LinkOwnProps, LinkProps, LinkThemeExtension, List, ListProps, ListThemeExtension, MarigoldProvider, MarigoldProviderProps, Menu, MenuProps, MenuThemeExtension, Message, MessageProps, MessageThemeExtension, Modal, ModalProps, NumberField, NumberFieldProps, NumberFieldThemeExtension, Overlay, OverlayProps, Popover, PopoverProps, Radio, RadioComponent, RadioGroupProps, RadioProps, RadioThemeExtension, RowProps, Select, SelectComponent, SelectProps, SelectThemeExtension, Slider, SliderProps, SliderThemeExtension, Split, SplitProps, Stack, StackProps, Switch, SwitchProps, SwitchThemeExtension, Table, TableProps, TableThemeExtension, Text, TextArea, TextAreaProps, TextAreaThemeExtension, TextField, TextFieldProps, TextProps, TextThemeExtension, Theme, Tiles, TilesProps, Tooltip, TooltipProps, TooltipThemeExtension, Tray, TrayProps, TrayWrapper, Underlay, UnderlayProps, UnderlayThemeExtension, XLoader, extendTheme, useCheckboxGroupContext, useFieldGroupContext };