# `lr-format-date` - **Import** `import '@aceshooting/lyra-ui/components/lr-format-date.js';` (stable tag alias; registers the tag) - **Class** `LyraFormatDate`, also available unregistered from `@aceshooting/lyra-ui/components/utility/format/format-date.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-format-date` `Intl.DateTimeFormat` output. Text-only host — no CSS parts, events, or own tokens; locale resolution and `Intl`-instance caching are as described in `llms/components/lr-format-number.md`. **Properties:** - `date: string | number | Date = new Date()` — unset means the construction-time current instant. 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 fallback content - optional granular fields: `weekday`, `era`, `year`, `month`, `day`, `hour`, `minute`, `second`, and `timeZoneName` (attribute `time-zone-name`), each restricted to its corresponding published `Intl.DateTimeFormat` literal set - `dateStyle?: 'full'|'long'|'medium'|'short'` (attribute `date-style`), `timeStyle?: …` (attribute `time-style`) — the preset-style set - `timeZone?: string` (attribute `time-zone`) — an IANA zone name, forwarded through **both** option sets - `hourFormat: 'auto' | '12' | '24' = 'auto'` (`hour-format`) — maps to `hour12` when explicit Setting either `dateStyle` or `timeStyle` switches the component to the preset-style set and the granular fields are then ignored entirely (`Intl` throws when the two are mixed); leave both unset to use the granular set. An unparseable `date` renders the default slot. An invalid `timeZone` throws a `RangeError` inside `Intl`, which is caught and retried once without the zone — so the output falls back to the browser's local zone instead of failing to render. Valid output is wrapped in semantic ``. Date input accepts primitive strings/numbers or a genuine `Date`; arbitrary objects are rejected without calling their `valueOf()`, `toString()`, or other conversion hooks. **Slots:** default — fallback content for an invalid/unparseable `date`.