FinallyReact Design Library

JavaScript is disabled in your browser.

Please enable JavaScript to explore FinallyReact.

Dropdown

When life gives you options, make a dropdown

The Dropdown component can be used by importing { Dropdown } from "finallyreact"

Example

Filter on Search

With Clear

Sizes

No Outline

Color

Select (no typing)

Select Sizes

Select - Placeholder

Select - With Clear

Disabled

Simple

Dropdown Props

Prop Name	Prop Type	Description
autoFilterOnSearch	boolean	Automatically filter options when typing
color	string	Any FinallyReact color
disabled	boolean	Disables user interaction
initialValue	any	Initial value of the dropdown
name	string	Optional identifier for the dropdown
onSearch	(value: string) => void	Callback for when the user types
optionContainerProps	HTMLAttributes	Props for the option container
optionProps	HTMLAttributes	Props for all options
options	object[]	Options for the dropdown
options[].disabled	boolean	Disables the option
options[].label	string	Label of the option
options[].value	any	Value of the option
select	boolean	Renders a select dropdown
simple	boolean	Renders a simple dropdown
size	'sm' \| 'md' \| 'lg'	Size of the dropdown
textInputProps	TextInputProps	Props for the text input
value	any	Value of the dropdown