Period selector
The period selector is for selecting a date range, with an optional compare range.
Install
Add the component and it’s dependencies to your project:
Import the component and it’s style:
Use
Here’s a fully working example
Types
The period selector is for selecting a date range or Period
. A Period and it’s related types are defined as:
Properties
name | type | description | required | default |
---|---|---|---|---|
activePeriod | Period | false | ||
onChange | (nextPeriod: Period) => void | true | ||
locale | Locale | Used to set the start of the week | false | |
calendarMaxDate | Date | Set max date that is selectable | false | 90 days from today |
calendarMinDate | Date | Set min date that is selectable | false | 2013-01-01 |
Internals
The period selector component is built up from a number of smaller components that are also exposed and can be used if needed.