Exports the moonstone/Picker.Picker and moonstone/Picker.PickerBase components. The default export is moonstone/Picker.Picker.
import Picker from '@enact/moonstone/Picker';Members
PickerComponent
A Picker component that allows selecting values from a list of values.
By default, Picker 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 Picker from '@enact/moonstone/Picker';PickerBaseComponent
The base component for moonstone/Picker.Picker. This version is not spottable.
import {PickerBase} from '@enact/moonstone/Picker';Properties
- aria-valuetext
Overrides the
aria-valuetextfor the picker. By default,aria-valuetextis set to the current selected child text.- children
Children from which to pick
- decrementIcon
Assign a custom icon for the decrementer. All strings supported by {Icon} are supported. Without a custom icon, the default is used, and is automatically changed when the {Icon#orientation} is changed.
- disabled
When
true, the Picker is shown as disabled and does not generateonChange{@glossary event}.- incrementIcon
Assign a custom icon for the incrementer. All strings supported by {Icon} are supported. Without a custom icon, the default is used, and is automatically changed when the {Icon#orientation} is changed.
- joined
Determines the user interaction of the control. A joined picker allows the user to use the arrow keys to adjust the picker's value. The user may no longer use those arrow keys to navigate, while this control is focused. A split control allows full navigation, but requires individual ENTER presses on the incrementer and decrementer buttons. Pointer interaction is the same for both formats.
- marqueeDisabled
By default, each picker item is wrapped by a orientation. When
marqueeDisabledistrue, the items will not be wrapped.- noAnimation
By default, the picker will animate transitions between items if it has a defined
width. SpecifyingnoAnimationwill prevent any transition animation for the component.- onChange
A function to run when the control should increment or decrement.
- orientation
Sets the orientation of the picker, whether the buttons are above and below or on the sides of the value. Must be either
'horizontal'or'vertical'.- value
Index of the selected child
Default: 0- width
Choose a specific size for your picker.
'small','medium','large', or set tonullto assume auto-sizing.'small'is good for numeric pickers,'medium'for single or short word pickers,'large'for maximum-sized pickers.You may also supply a number. This number will determine the minumum size of the Picker. Setting a number to less than the number of characters in your longest value may produce unexpected results.
- wrap
Should the picker stop incrementing when the picker reaches the last element? Set
wraptotrueto allow the picker to continue from the opposite end of the list of options.