Themes

Fields/Components/es-select
es-select

A searchable select dropdown.

Props

Name
Description
Type
Default
chevronIcon

Icon to use as a chevron.

[namespace: string
or
symbol, name: string]
or
string
[ICON_NAMESPACE, chevron]
disabled

If the field is disabled.

boolean
or
undefined
inputProps

Pass props directly to the input.

undefined
or
{ [x: string]: any; }
invalid

If the field is currently in an error state.

boolean
or
undefined
label

The label of the field.

string
messages

The validation messages of the field

ValidationMessages
or
undefined
name

The name of the field.

string
optionFilter

Pass a custom search filter function

((filter: string, option: TypeaheadOption) => boolean)
or
undefined
options

A list of options to choose from.

TypeaheadOption[]
placeholder

The placeholder for the input.

string
or
undefined
readonly

If the field is editable.

boolean
or
undefined
renderOption

Overwrite the default option renderer.

((h: typeof h, option: any, chosen: boolean) => string
or
VNode
or
VNode[]
or
null)
or
undefined
renderValue

Overwrite the default value renderer.

(h: typeof h, value: any, rawValue: string) => string
or
VNode
or
VNode[]
or
null
(_, o, v) => o?.name ?? v
value

The current value of the field.

null
or
string

ValidationMessages

Name
Description
Type
children
Record<number, Record<Severity, ValidationMessage[]>>
error
ValidationMessage[]
info
ValidationMessage[]
warning
ValidationMessage[]

TypeaheadOption

An option to be selected.

Name
Description
Type
name

The display name of the option.

string
value

The string to be used as a value.

string

Events

Event
Detail
Description
fieldchange
FieldChange<string | null>

Emitted when the value of the field is changed.

Parts

Name
Description
input

The wrapping div of the input.

true_input

The input element.