nuxt-x-affiliate
Date Display
Locale-aware <time> element for ISO dates — long / short / numeric / relative presets with UTC pinning for SSR stability.
Date Display
The XAFDateDisplay component renders an ISO date as a semantic <time datetime="…"> element, formatted through useXafDateFormat(). It follows the active useXafLocale() locale by default and can pin to UTC so server- and client-rendered output never mismatch on YYYY-MM-DD inputs.
Components
<XAFDateDisplay />
<XAFDateDisplay date="2026-02-15" />
<XAFDateDisplay date="2026-02-15" format="short" locale="en-GB" />
<XAFDateDisplay date="2026-02-15T10:30:00Z" format="relative" />
<XAFDateDisplay date="2026-02-15" utc fallback="Unpublished" />
Props
| Prop | Type | Default | Description |
|---|---|---|---|
date | string | required | ISO date string to display. |
locale | string | active useXafLocale value or 'en-US' | BCP-47 locale. |
format | 'long' | 'short' | 'numeric' | 'relative' | 'long' | Format preset. 'relative' renders strings like "2 days ago". |
utc | boolean | false | Pin to UTC for SSR stability (recommended for YYYY-MM-DD inputs). |
fallback | string | '' | Fallback text when the date is empty or invalid. |
AI Context
component: XAFDateDisplay
package: "@xenterprises/nuxt-x-affiliate"
use-when: Rendering ISO dates as locale-aware semantic <time> elements with SSR-stable output (UTC pinning) and long/short/numeric/relative presets.
Content Index
Listing-page section composing XAFContentCard grids or lists — hero header, empty state, and optional "View all" link for /reviews and /articles indexes.
useAffiliate
SSR-safe state management for affiliate data, stats, referrals, payouts, and commission tiers — with computed helpers and setter methods.