moonstone/ Day Selector
Moonstone styled inline day selector components.
import DaySelector from '@enact/moonstone/DaySelector';Members
DaySelectorComponent
An inline day of the week selection component, ready to use in Moonstone applications.
DaySelector may be used to select one or more days of the week from a horizontal list of
abbreviated day names.
By default, DaySelector maintains the state of its selected property. Supply the
defaultSelected property to control its initial value. If you wish to directly control updates
to the component, supply a value to selected at creation time and update it in response to
onChange events.
Usage:
<DaySelector
defaultSelected={[2, 3]}
longDayLabels
onSelect={handleSelect}
/>import DaySelector from '@enact/moonstone/DaySelector';DaySelectorBaseComponent
A Moonstone styled inline day of the week selection component.
This component is most often not used directly but may be composed within another component as it is within DaySelector.
import {DaySelectorBase} from '@enact/moonstone/DaySelector';Properties
Disables DaySelector and the control becomes non-interactive.
Called when an day is selected or unselected.
The event payload will be an object with the following members:
selected- An array of numbers representing the selected days, 0 indexedcontent- Localized string representing the selected days
An array of numbers (0-indexed) representing the selected days of the week.
DaySelectorDecoratorHigher-Order Component
Applies Moonstone specific behaviors to DaySelector.
import {DaySelectorDecorator} from '@enact/moonstone/DaySelector';Properties added to wrapped component
The format for names of days used in the label.
Default: 'long'Applies a disabled style and prevents interacting with the component.
Default: falseThe text displayed in the label when every day is selected.
Default: 'Every Day'The text displayed in the label when every weekeday is selected.
Default: 'Every Weekday'The text displayed in the label when every weekend day is selected.
Default: 'Every Weekend'Called when an day is selected or unselected.
The event payload will be an object with the following members:
selected- An array of numbers representing the selected days, 0 indexedcontent- Localized string representing the selected days
An array of numbers (0-indexed) representing the selected days of the week.