@redrob-labs/ui v1.0.2 · Redrob Group Design System 2026

Timestamp

Borders · src/components/Timestamp/Timestamp.tsx

A moment in time, in the reader's zone, with the zone said out loud.

A bare "14:00" is only unambiguous to whoever wrote it. The zone is printed, not assumed, and originZone shows the same moment where it happened - which is what a person in Noida reading a Seoul deadline actually needs.

relative changes the face, never the record: the datetime attribute stays an ISO string and the absolute reading stays in the title. "3 hours ago" is friendly and useless in a screenshot, so it never replaces the exact value, it only covers it.

An unparseable value renders as itself rather than "Invalid Date", because the raw string is at least a clue about where the bad data came from.

Import

import { Timestamp } from '@redrob-labs/ui';

Rendered

The design system's own preview case, run against this package's build. The parity gate compares this rendering to the reference bundle's.

Props

PropTypeNotes
at required Date | string | number The moment. A Date, or anything new Date() accepts.
zone string Zone to show it in. Defaults to the reader's own.
originZone string A second reading in the zone the event happened in, when that differs.
locale string
precision 'date' | 'minute' | 'second' How much to show. date drops the clock entirely.
zoneStyle 'short' | 'long' | 'shortOffset' | 'longOffset'
relative boolean Show "3 hours ago" on the face. The absolute value stays in the tooltip.
className string