Dates & Times

Date and time formatting utilities with locale-aware display and relative time formatting.

formatRelativeTime

Displays how long ago or how far in the future a date is, with human-friendly output like "2 hours ago" or "in 3 days".

import { formatRelativeTime } from "@tilt-legal/cubitt-components/utilities/formatters";

formatRelativeTime(new Date()); // "just now"
formatRelativeTime(pastDate); // "2 hours ago"
formatRelativeTime("2024-01-15T10:30:00Z"); // "2 months ago"
formatRelativeTime(1705330200000); // "2 months ago" (Unix timestamp)
PropertyTypeDefaultDescription
addSuffixbooleantrueAdd "ago" or "in" suffix
addApproxPrefixbooleantrueAdd "about" prefix for approximate times
localeLocale-date-fns locale object (from date-fns/locale)

formatShortDate

Formats dates in a compact, locale-aware format suitable for tables and lists.

import { formatShortDate } from "@tilt-legal/cubitt-components/utilities/formatters";

formatShortDate(new Date()); // "Jan 15, 2024"
formatShortDate("2024-01-15T10:30:00Z"); // "Jan 15, 2024"
formatShortDate(1705330200000); // "Jan 15, 2024" (Unix timestamp)
ParameterTypeDefaultDescription
dateDate | string | number-Date to format (Date object, ISO string, or Unix timestamp)
localestring'en-AU'Locale code

formatLongDate

Formats dates in a readable, spelled-out format for better readability and accessibility.

import { formatLongDate } from "@tilt-legal/cubitt-components/utilities/formatters";

formatLongDate(new Date()); // "January 15, 2024"
formatLongDate("2024-01-15T10:30:00Z"); // "January 15, 2024"
formatLongDate(1705330200000); // "January 15, 2024" (Unix timestamp)
ParameterTypeDefaultDescription
dateDate | string | number-Date to format (Date object, ISO string, or Unix timestamp)
localestring'en-AU'Locale code

formatTime

Formats time in a user-friendly 12-hour format with lowercase am/pm indicator.

import { formatTime } from "@tilt-legal/cubitt-components/utilities/formatters";

formatTime(new Date()); // "2:30 pm"
formatTime("2024-01-15T14:30:00Z"); // "2:30 pm"
formatTime(1705330200000); // "2:30 pm" (Unix timestamp)
ParameterTypeDefaultDescription
dateDate | string | number-Date to format (Date object, ISO string, or Unix timestamp)
localestring'en-AU'Locale code

formatDateTime

Combines date and time formatting for complete timestamp display.

import { formatDateTime } from "@tilt-legal/cubitt-components/utilities/formatters";

formatDateTime(new Date()); // "Jan 15, 2024 at 2:30 PM"
formatDateTime("2024-01-15T14:30:00Z"); // "Jan 15, 2024 at 2:30 PM"
formatDateTime(1705330200000); // "Jan 15, 2024 at 2:30 PM" (Unix timestamp)
ParameterTypeDefaultDescription
dateDate | string | number-Date to format (Date object, ISO string, or Unix timestamp)
localestring'en-AU'Locale code

formatLongDateTime

Combines long date and time formatting for formal, fully spelled-out timestamp display.

import { formatLongDateTime } from "@tilt-legal/cubitt-components/utilities/formatters";

formatLongDateTime(new Date()); // "January 15, 2024 at 2:30 PM"
formatLongDateTime("2024-01-15T14:30:00Z"); // "January 15, 2024 at 2:30 PM"
formatLongDateTime(1705330200000); // "January 15, 2024 at 2:30 PM" (Unix timestamp)
ParameterTypeDefaultDescription
dateDate | string | number-Date to format (Date object, ISO string, or Unix timestamp)
localestring'en-AU'Locale code

formatDateTimeWithZone

Displays timestamps with timezone information for global applications where timezone context is important.

import { formatDateTimeWithZone } from "@tilt-legal/cubitt-components/utilities/formatters";

formatDateTimeWithZone(new Date()); // "Jan 15, 2024, 2:30 PM AEDT"
formatDateTimeWithZone("2024-01-15T14:30:00Z"); // "Jan 15, 2024, 2:30 PM AEDT"
formatDateTimeWithZone(1705330200000); // "Jan 15, 2024, 2:30 PM AEDT" (Unix timestamp)
formatDateTimeWithZone(new Date(), "en-AU", "long");
// "Jan 15, 2024, 2:30 PM Australian Eastern Daylight Time"
ParameterTypeDefaultDescription
dateDate | string | number-Date to format (Date object, ISO string, or Unix timestamp)
localestring'en-AU'Locale code
timeZoneName'short' | 'long''short'Timezone display format

formatLongDateTimeWithZone

Combines fully spelled-out date and time with timezone information for formal, timezone-aware timestamp display.

import { formatLongDateTimeWithZone } from "@tilt-legal/cubitt-components/utilities/formatters";

formatLongDateTimeWithZone(new Date()); // "January 15, 2024, 2:30 PM AEDT"
formatLongDateTimeWithZone("2024-01-15T14:30:00Z"); // "January 15, 2024, 2:30 PM AEDT"
formatLongDateTimeWithZone(1705330200000); // "January 15, 2024, 2:30 PM AEDT" (Unix timestamp)
formatLongDateTimeWithZone(new Date(), "en-AU", "long");
// "January 15, 2024, 2:30 PM Australian Eastern Daylight Time"
ParameterTypeDefaultDescription
dateDate | string | number-Date to format (Date object, ISO string, or Unix timestamp)
localestring'en-AU'Locale code
timeZoneName'short' | 'long''short'Timezone display format

On this page