Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA date field that writes the date back as today, tomorrow, in 3 days, last Friday or 2 weeks ago in the viewer's language, picking the unit that reads best. Use this when a date should be read at a glance as how far away it is, not only as a number.
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 date should be read at a glance as how far away it is, not only as a number.
Do not use it for exact moments within a day; use relative-time.
It composes date-field and date-time-core, which the CLI installs for you.
import { RelativeDateLabel } from "@/components/relative-date-label"<RelativeDateLabel locale="en" onValueChange={(date) => setDate(date)} />| Prop | Type | Default | Description |
|---|---|---|---|
| value / defaultValue / onValueChange | string | null | null | ISO date. |
| today | string | today | Reference day. |
| locale | string | browser | Language of the phrase. |
Intl.RelativeTimeFormat so it is grammatical in every language.The pattern ships with a Testing Library test (relative-date-label.test.tsx) that covers today, tomorrow, days, weeks, months, years, and another language.