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:
Make sure the component is referenced in your tailwind config:
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.
