Themes

Fields/Components/es-input
es-input

An optionally masked text input.

Props

Name
Description
Type
Default
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
mask

Apply an input mask

MaskOptions
or
undefined
messages

The validation messages of the field

ValidationMessages
or
undefined
name

The name of the field.

string
placeholder

The placeholder for the input.

string
readonly

If the field is editable.

boolean
or
undefined
value

The current value of the field.

string

MaskOptions

Options for applying a mask to an input. Uses imask.js internally.

Name
Description
Type
blocks

Blocks for a pattern mask. See imask.js

Record<string, any>
definitions

Definitions for a pattern mask. See imask.js

Record<string, any>
lazy

Make placeholder always visible.

boolean
mask

The mask to apply. See imask.js

any
overwrite

Enables characters overwriting instead of inserting. See imask.js

boolean
placeholderChar

Placeholder to use in the mask.

string
unmask

If the value should be unmasked on fieldchange

boolean

ValidationMessages

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

Events

Event
Detail
Description
enter
any

Emitted on keyup of enter, if no modifier keys are held.

fieldchange
FieldChange<string>

Emitted when the value of the field is changed.

CSS Variables

Name
Description
--field-grid-columns

The field layout.