Autocomplete

The Autocomplete component allow user to type and select from a list of options.

DetailsProperties

Autocomplete

Property
Type
Description
title
string | node

This prop can be either a string or a Node. It will provide a title for the items

itemsRequired
array

An array of items to be used as options for the select

selectedItem
any

The selected Item to be shown on the autocomplete

itemToString
func

In case the array of items is not an array of strings, this function is used on each item to return the string that will be shown on the filter

childrenRequired
func

Function that will render the 'filter' component.

itemSize
number

The height of each item in the list Because the list is virtualized this is required beforehand.

renderItem
func

Function that returns a component to render the item

position
Position.TOP | Position.TOP_LEFT | Position.TOP_RIGHT | Position.BOTTOM | Position.BOTTOM_LEFT | Position.BOTTOM_RIGHT | Position.LEFT | Position.RIGHT

The position of the Popover the Autocomplete is rendered in.

itemsFilter
func

A function that is used to filter the items. It should return a subset of the initial items. By default the "fuzzaldrin-plus" package is used.

isFilterDisabled
bool

Prop that enables and disables filtering True: Enables Filtering False: Disables Filtering

popoverMinWidth
number

Defines the minimum height the results container will be

popoverMaxHeight
number

Defines the maximum height the results container will be

allowOtherValues
bool

Whether or not the input accepts arbitrary user input beyond the provided items

AutocompleteItem

Property
Type
Description
children
node

style
object

isSelected
bool

isHighlighted
bool