Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProPreset date ranges with a validated custom range and an optional previous-period or previous-year comparison.
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.
A dashboard needs quick ranges plus a custom range and a comparison window.
Do not use it when: Only one fixed range exists, or you need a full calendar popover.
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 |
|---|---|---|---|
today | string | "2026-10-27" | ISO date treated as today (keeps output deterministic). |
onChange | (v: { range; compare }) => void | - | Called with the resolved range and comparison range when valid. |
Presets are toggle buttons, comparison options are a radio fieldset and the custom inputs are labelled date fields. Errors are announced as alerts and the summary is polite live text.
The pattern ships with a test (dash-date-range-presets.test.tsx). Tests cover the previous-period maths, preset switching and the end-before-start validation.