allowCreate
Description
If true
, enables the creation of autocomplete option.
Type
boolean
Default
false
Leave Yamada UI a star
StarMultiAutocomplete
is a component used to display suggestions based on user text input and to obtain multiple values.
Description
If true
, enables the creation of autocomplete option.
Type
boolean
Default
false
Description
If true
, enables the free input.
Type
boolean
Description
The animation of the popover.
Type
"bottom" | "left" | "right" | "scale" | "top" | "none"
Default
'scale'
Description
The boundary area for the popper. Used within the preventOverflow
modifier.
Type
HTMLElement | "clippingParents" | "scrollParent"
Default
'clippingParents'
Description
If true
, display the select clear icon.
Type
boolean
Default
true
Description
Props for multi autocomplete clear icon element.
Type
AutocompleteIconProps
Description
The number of delay time to close.
Type
number
Default
200
Description
If true
, the popover will close when you blur out it by clicking outside or tabbing out.
Type
boolean
Default
true
Description
If true
, the popover will close when you hit the Esc
key.
Type
boolean
Default
true
Description
If true
, the list element will be closed when value is selected.
Type
boolean
Default
false
Description
The visual color appearance of the component.
Type
"blackAlpha" | "whiteAlpha" | "amber" | "blue" | "info" | "link" | "primary" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "success" | "indigo" | "lime" | "neutral" | "orange" | "warning" | "pink" | "purple" | "red" | "danger" | "rose" | "sky" | "teal" | "violet" | "secondary" | "yellow"
Description
The custom display value to use.
Type
FC<{
index: number
label: string
value: string | number
onRemove: MouseEventHandler<HTMLElement>
}>
Description
Props for multi autocomplete container element.
Type
Omit<HTMLUIProps, "children">
Description
Props for multi autocomplete content element.
Type
Omit<MotionProps, "children">
Description
Props for autocomplete create element.
Type
Omit<AutocompleteCreateProps, "children">
Description
If true
, the popover will be initially opened.
Deprecated
Use defaultOpen
instead
Type
boolean
Description
If true
, the popover will be initially opened.
Type
boolean
Description
The initial value of the autocomplete.
Type
string[]
Description
If true
, the form control will be disabled.
Type
boolean
Default
false
Description
The animation duration.
Type
number | MotionLifecycleProps<number>
Description
The message displayed when the search yields no hits.
Type
string
Default
'No results found'
Description
Props for autocomplete empty element.
Type
Omit<AutocompleteEmptyProps, "children">
Description
The border color when the input is invalid.
Type
string
Description
If provided, determines whether the popper will reposition itself on scroll
and resize
of the window.
Type
type ONLY_FOR_FORMAT =
| boolean
| { resize?: boolean | undefined; scroll?: boolean | undefined }
Default
true
Description
Props for multi autocomplete field element.
Type
Omit<MultiAutocompleteFieldProps,
"children" | "separator" | "inputProps" | "component" | "keepPlaceholder">
Description
If true
, the popper will change its placement and flip when it's about to overflow its boundary area.
Type
boolean
Default
true
Description
The border color when the input is focused.
Type
string
Description
The footer of the autocomplete content element.
Type
string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | FC<...>
Description
Function to format text when search input.
Type
(value: string) => string
Description
The distance or margin between the reference and popper.
It is used internally to create an offset
modifier.
Type
UIValue<number>
Default
8
Description
The header of the autocomplete content element.
Type
string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | FC<...>
Description
Props for multi autocomplete icon element.
Type
AutocompleteIconProps
Description
Props for multi autocomplete input element.
Type
HTMLUIProps<"input">
Description
The position to be inserted when the autocomplete option is created.
Type
[string, "first" | "last"] | Union<"first" | "last">
Default
'first'
Description
If true
, the form control will be invalid.
Type
boolean
Default
false
Description
If true
, display the select clear icon.
Deprecated
Use clearable
instead.
Type
boolean
Default
true
Description
If true
, the form control will be disabled.
Deprecated
Use disabled
instead.
Type
boolean
Default
false
Description
If true
, the form control will be invalid.
Deprecated
Use invalid
instead.
Type
boolean
Default
false
Description
If true
, the PopoverContent rendering will be deferred until the popover is open.
Deprecated
Use lazy
instead
Type
boolean
Default
false
Description
If true
, the popover will be opened.
Deprecated
Use open
instead
Type
boolean
Description
If true
, the form control will be readonly.
Deprecated
Use readOnly
instead.
Type
boolean
Default
false
Description
If true
, the form control will be required.
Deprecated
Use required
instead.
Type
boolean
Default
false
Description
If provided, generate options based on items.
Type
AutocompleteItem[]
Description
If true
, keep the placeholder.
Type
boolean
Default
false
Description
If true
, the PopoverContent rendering will be deferred until the popover is open.
Type
boolean
Default
false
Description
The lazy behavior of popover's content when not visible. Only works when lazy={true}
- unmount
: The popover's content is always unmounted when not open.
- keepMounted
: The popover's content initially unmounted, but stays mounted when popover is open.
Type
LazyMode
Default
'unmount'
Description
Props for multi autocomplete list element.
Type
Omit<AutocompleteListProps, "children">
Description
If true
, the popper will match the width of the reference at all times.
It's useful for autocomplete
, date-picker
and select
patterns.
Type
boolean
Default
false
Description
The maximum selectable value.
Type
number
Description
Array of popper.js modifiers. Check the docs to see the list of possible modifiers you can pass.
Type
Partial<Modifier<string, any>>[]
Docs
https://popper.js.org/docs/v2/modifiers/Description
The main and cross-axis offset to displace popper element from its reference element.
Type
[number, number]
Description
If true
, the selected item(s) will be excluded from the list.
Type
boolean
Default
false
Description
The callback invoked when value state changes.
Type
(value: string[]) => void
Description
Callback fired when the popover closes.
Type
() => void
Description
The callback invoked when autocomplete option created.
Type
(
newItem: AutocompleteItem,
newItems: AutocompleteItem[],
) => void
Description
Callback fired when the popover opens.
Type
() => void
Description
The callback invoked when search input.
Type
(ev: ChangeEvent<HTMLInputElement>) => void
Description
If true
, the popover will be opened.
Type
boolean
Description
The number of delay time to open.
Type
number
Default
200
Description
Props for select option element.
Type
Omit<AutocompleteOptionProps, "value" | "children">
Description
The placement of the popper relative to its reference.
Type
UIValue<Placement>
Default
'bottom'
Description
Props to be forwarded to the portal component.
Type
Omit<PortalProps, "children">
Default
'{ disabled: true }'
Description
If true
, will prevent the popper from being cut off and ensure it's visible within the boundary area.
Type
boolean
Default
true
Description
If true
, the form control will be readonly.
Type
boolean
Default
false
Description
If true
, the form control will be required.
Type
boolean
Default
false
Description
The visual separator between each value.
Type
string
Default
','
Description
The size of the MultiAutocomplete.
Type
"xs" | "sm" | "md" | "lg" | "xl"
Default
"md"
Description
The CSS positioning strategy to use.
Type
"fixed" | "absolute"
Default
'absolute'
Description
The value of the autocomplete.
Type
string[]
Description
The variant of the MultiAutocomplete.
Type
"filled" | "flushed" | "outline" | "unstyled"
Default
"outline"
Edit this page on GitHub