Date Utilities

The Date utilities provide functions for formatting and manipulating dates in JavaScript.

Functions

formatDate

function formatDate(date, format = 'LLL', options = {})

Formats a date according to the specified format string and options.

International Support This function uses Intl.DateTimeFormat internally, please refer to the associated docs for details on timezone and formatting usage.

Timezone Lookup You can use IANA.org’s guide to look up supported timezones.

Local Timezone Usage When the ‘local’ keyword is used for the timezone option, the function will use the local timezone of the environment where the code is running. This is particularly useful for displaying dates in the user’s local time without needing to detect the timezone programmatically.

Timezone Shorthand

formatDate provides additional shorthand timezones that can be used instead of their city counterparts.

const shorthand = reverseKeys({
    // North America
    'America/New_York': ['ET'],
    'America/Chicago': ['CT'],
    'America/Denver': ['MT'],
    'America/Los_Angeles': ['PT'],
    'America/Anchorage': ['AKT'],
    'Pacific/Honolulu': ['HT'],
    'America/Halifax': ['AT'],

    // South America
    'America/Sao_Paulo': ['BRT'],

    // Europe
    'Europe/London': ['UK', 'WET'],
    'Europe/Paris': ['CET', 'ECT'],
    'Europe/Helsinki': ['EET'],
    'Europe/Dublin': ['IRST'], // Note disambiguation with India

    // Australia/Oceania
    'Australia/Sydney': ['AET'],
    'Australia/Adelaide': ['ACT'],
    'Australia/Perth': ['AWT'],
    'Pacific/Auckland': ['NZT'],

    // Asia
    'Asia/Kolkata': ['IST', 'INST'], // Note disambiguation with Ireland
    'Asia/Tokyo': ['JST'],
    'Asia/Singapore': ['SGT']
});

Parameters

Name	Type	Default	Description
date	Date		The date to format
format	string	’LLL’	The format string (e.g., ‘YYYY-MM-DD’, ‘LT’, ‘LL’)
options	object		Additional formatting options

Options

Name	Type	Default	Description
locale	string	’default’	The locale to use for formatting
hour12	boolean	true	Whether to use 12-hour time
timezone	string	’UTC’	The timezone to use. Use ‘local’ for the local timezone.

Returns

A formatted date string.

Example

import { formatDate } from '@semantic-ui/utils';

const date = new Date('2023-05-15T14:30:00Z');

console.log(formatDate(date)); // "May 15, 2023 2:30 PM"
console.log(formatDate(date, 'YYYY-MM-DD')); // "2023-05-15"
console.log(formatDate(date, 'LT', { timezone: 'America/New_York' })); // "10:30 AM"
console.log(formatDate(date, 'LT', { timezone: 'local' })); // Formats using the local timezone