0.1.4 • Published 4 years ago

intl-dateformat v0.1.4

Weekly downloads
10,782
License
MIT
Repository
github
Last release
4 years ago

intl-dateformat is a simple date formatting library that leverage the Intl.DateTimeFormat API to format dates in different languages and timezones without having to clutter your JavaScript bundles.

Features

  • Small: As it directly leverages Intl.DateTimeFormat, there is no need to bundle additional locales or a timezones database. It's already in your Browser!
  • 👌Simple: It supports a subset of ISO 8601 formats, discarding very rarely used date parts.
  • 🤟 Extensible: That said, if you want to customize things you can pass custom formatters.

Installation

$ npm install intl-dateformat

Example

import formatDate from 'intl-dateformat'

const date = new Date(Date.UTC(1984, 0, 17, 16, 13, 37, 0))

formatDate(date, 'YYYY-MM-DD hh:mm:ss A')
// → 1984-01-17 04:13:37 PM
formatDate(date, 'YYYY-MM-DD hh:mm:ss A', { timezone: 'Asia/Singapore' })
// → 1984-01-18 00:13:37 AM
formatDate(date, 'YYYY, MMMM dddd DD')
// → 1984, January Tuesday 17
formatDate(date, '[It is] dddd [today!]')
// → It is Tuesday today!
formatDate(date, 'YYYY, MMMM dddd DD', { locale: 'fr' })
// → 1984, Janvier Mardi 17

Usage

import formatDate from 'intl-dateformat'

const date = new Date(Date.UTC(1984, 0, 17, 16, 13, 37, 0))

formatDate(date, 'YYYY-MM-DD hh:mm:ss A')
// → 1984-01-17 04:13:37 PM
ArgumentDescriptionType
dateThe date to formatDate, number
formatThe format to useSee Format
optionsCustom locale or timezoneSee Options

Format

The format is a combination of the following masks:

MaskDescriptionExample
YYYY4-digits year1984
YY2-digits year84
MMMMMonth nameJanuary
MMMShort month nameJan
DD2-digits day17
ddddDay of the weekTuesday
dddShort day of the weekTue
ADay periodAM, PM
aLowercased day periodam, pm
HH24-hours hour16
hh12-hours hour04
mm2-digit minute13
ss2-digit second37

Masks will be replaced by their associated date part.

You can also pass string literals in the format by surrouding them with a []:

formatDate(date, '[It is] dddd [today!]')
// → It is Tuesday today!

Options

  • locale - A BCP 47 tag to identify the output language
    • Type: string
    • Default: The system locale
    • Example: fr, fr-FR
  • timezone - A IANA timezone
    • Type: string
    • Default: The system timezone
    • Example: Europe/Paris, America/Chicago

Custom formatters

If you find yourself missing some date parts, no problem we got you covered. You can create your own dateFormat function and add your custom formatters:

import { createDateFormatter } from 'intl-dateformat'

const formatDate = createDateFormatter({
  // numeric hour
  h: ({ hour }) => hour[0] === '0' ? hour[1] : hour
  // milliseconds
  SSS: (parts, date) => String(date.getTime()).slice(-3)
})

const date = new Date(Date.UTC(1984, 0, 17, 16, 13, 37, 0))

formatDate(date, 'YYYY-MM-DD h:mm:ss.SSS')
// → 1984-01-17 4:13:37.505
ArgumentDescriptionType
formattersCustom formattersSee Formatters

Formatters

Formatters are represented as a dictionary of functions, where the key represents the mask that is to be matched in the format and the value is the function that will format the date.

The formatter function takes the following arguments:

  • parts - An object containing all the date parts provided by Intl.DateTimeFormat. You can inspect the DatePartName type for an exhaustive list of all the date parts
  • date - The original date passed to the formatDate function.