moonstone/ExpandableInput

Moonstone styled expandable input.

import ExpandableInput from '@enact/moonstone/ExpandableInput';

Members

ExpandableInputComponent

A stateful component that expands to render a moonstone/Input.Input.

By default, ExpandableInput 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.

ExpandableInput is an expandable component and it maintains its open/closed state by default. The initial state can be supplied using defaultOpen. In order to directly control the open/closed state, supply a value for open at creation time and update its value in response to onClose/onOpen events.

import ExpandableInput from '@enact/moonstone/ExpandableInput';

ExpandableInputBaseComponent

A stateless component that expands to render a moonstone/Input.Input.

import {ExpandableInputBase} from '@enact/moonstone/ExpandableInput';
Properties
title
String

The primary text of the item.

disabled
Boolean

Disables ExpandableInput and the control becomes non-interactive.

iconAfter
String

The icon to be placed at the end of the input.

iconBefore
String

The icon to be placed at the beginning of the input.

noneText
String

Text to display when no value is set.

onChange
Function

Called when the expandable value is changed.

onClose
Function

Called when a condition occurs which should cause the expandable to close.

onSpotlightDisappear
Function

Called when the component is removed while retaining focus.

onSpotlightLeft
Function

Called prior to focus leaving the expandable when the 5-way left key is pressed.

onSpotlightRight
Function

Called prior to focus leaving the expandable when the 5-way right key is pressed.

open
Boolean

Opens the control, with the contents visible.

placeholder
String

The placeholder text to display.

See: moonstone/Input.Input#placeholder
spotlightDisabled
Boolean

Disables spotlight navigation in the component.

Default: false
type
String

The type of input. Accepted values correspond to the standard HTML5 input types.

See: moonstone/Input.Input#type
value
StringNumber

The value of the input.

See: moonstone/Input.Input#value
ArrayBooleanFunctionModuleNumberObjectString