Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA date range with a compare option for the previous period of the same length or the same dates last year, showing both ranges side by side. Use this when a metric is read against an earlier period and both periods must be shown unambiguously.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it when a metric is read against an earlier period and both periods must be shown unambiguously.
Do not use it for a single period with no comparison; use range-calendar.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
| value / defaultValue | { range; compare: none | previous | year } | none | Range and comparison mode. |
| onValueChange | (value, comparison: DateRange | null) => void | - | The comparison range for the mode. |
| max | string | - | Latest selectable day. |
The pattern ships with a Testing Library test (compare-to-previous-period.test.tsx) that covers the previous period, the same period last year (including 29 February) and none.