DateFormatter

A wrapper around Intl.DateTimeFormat that fixes various browser bugs, and polyfills new features.

installyarn add @internationalized/date
version3.10.0
usageimport {DateFormatter} from '@internationalized/date'
View repository
GitHub
View package
NPM

Introduction#

DateFormatter is a wrapper around the native Intl.DateTimeFormat API. It exposes the same API, but works around several browser bugs and provides polyfills for newer features. These are currently:

  • A simple polyfill for the formatRange and formatRangeToParts methods for older browsers.
  • A workaround for a bug involving the hour12 option in Chrome and and the ECMAScript spec.
  • A workaround for a bug involving the hourCycle option in Safari.

See the MDN docs for full details on how to use the API.

Interface#

MethodDescription
constructor( (locale: string, , options: Intl.DateTimeFormatOptions )): void
format( (value: Date )): stringFormats a date as a string according to the locale and format options passed to the constructor.
formatToParts( (value: Date )): Intl.DateTimeFormatPart[]Formats a date to an array of parts such as separators, numbers, punctuation, and more.
formatRange( (start: Date, , end: Date )): stringFormats a date range as a string.
formatRangeToParts( (start: Date, , end: Date )): DateRangeFormatPart[]Formats a date range as an array of parts.
resolvedOptions(): Intl.ResolvedDateTimeFormatOptionsReturns the resolved formatting options based on the values passed to the constructor.