# `lr-relative-time` - **Import** `import '@aceshooting/lyra-ui/components/lr-relative-time.js';` (stable tag alias; registers the tag) - **Class** `LyraRelativeTime`, also available unregistered from `@aceshooting/lyra-ui/components/utility/format/relative-time.class.js` - **Family** `components/utility/` — see `llms/index.md` for its siblings - **Status** `stable` since `4.0.0` — see the maturity and deprecation policy in `llms/shared.md` - **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [llms-full.txt](../../llms-full.txt) - **Deprecations** none - **Optional peers** none - **Themeable via** nothing component-specific — inherits only the shared surface - **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md` --- ## `lr-relative-time` `Intl.RelativeTimeFormat` output ("3 hours ago", "in 2 days"), relative to `Date.now()` at render. Text-only host — no CSS parts, events, or own tokens; locale resolution and `Intl`-instance caching are as described under `lr-format-number` above. **Properties:** - `date: string | number | Date = new Date()` — the target instant; unset means now. Numeric HTML attributes are epoch milliseconds, matching numeric property assignment (including zero and negative epochs); nonnumeric strings retain ordinary date/ISO parsing. **Changed in 8.0.0:** the former empty-string default rendered no content - `unit: 'second'|'minute'|'hour'|'day'|'week'|'month'|'quarter'|'year'|'auto' = 'auto'` — `'auto'` picks the largest unit whose own length fits inside the elapsed time, then rounds; naming a unit forces it (so a 90-minute delta with `unit="day"` rounds to "today"/0 days) - `numeric: 'always' | 'auto' = 'auto'` — `Intl`'s own option: `'auto'` allows "yesterday"/"tomorrow" in place of "1 day ago"/"in 1 day"; `'always'` keeps the numeric phrasing - `format: 'long' | 'short' | 'narrow' = 'long'` — forwarded as relative-time `style` - `sync: boolean = false` — schedules one timeout at the next rounded-value or auto-unit boundary, rather than fixed polling; it is cleared on disconnect and recalculated when inputs change Valid output is semantic ``. **Slots:** none — an unparseable `date` renders the empty string, with no fallback-content hook (unlike the three `lr-format-*` components above). Date input accepts primitive strings/numbers or a genuine `Date`; arbitrary objects are rejected without calling their conversion hooks.