moonstone/ Input
Moonstone styled input components.
import Input from '@enact/moonstone/Input';Members
InputComponent
A Spottable, Moonstone styled input component with embedded icon support.
By default, Input maintains the state of its value property. Supply the defaultValue
property to control its initial value. If you wish to directly control updates to the component,
supply a value to value at creation time and update it in response to onChange events.
import Input from '@enact/moonstone/Input';Properties
Focuses the internal input when the component gains 5-way focus.
By default, the internal input is not editable when the component is focused via 5-way and must be selected to become interactive. In pointer mode, the input will be editable when clicked.
Default: falseSets the initial value.
Applies a disabled style and prevents interacting with the component.
Default: falseBlurs the input when the "enter" key is pressed.
Default: falseCalled when the internal input is focused.
Called when the internal input loses focus.
Called when the component is removed when it had focus.
Disables spotlight navigation into the component.
Default: false
InputBaseComponent
A Moonstone styled input component.
It supports start and end icons. Note that this base component is not stateless as many other base components are. However, it does not support Spotlight. Apps will want to use Input.
import {InputBase} from '@enact/moonstone/Input';Properties
Disables Input and becomes non-interactive.
Default: falseBlurs the input when the "enter" key is pressed.
Default: falseThe icon to be placed at the end of the input.
See: moonstone/Icon.IconThe icon to be placed at the beginning of the input.
See: moonstone/Icon.IconIndicates value is invalid and shows invalidMessage, if set.
Default: falseThe tooltip text to be displayed when the input is invalid.
If this value is falsy, the tooltip will be shown with the default message.
Default: 'Please enter a valid value.'Called when blurred.
Called when the input value is changed.
Called when clicked.
Called when focused.
Called when a key is pressed down.
Text to display when value is not set.
Default: ''The size of the input field.
Default: 'small'The type of input.
Accepted values correspond to the standard HTML5 input types.
See: MDN input types docDefault: 'text'The value of the input.