Date Utilities
The headless package exports a set of native Date helper functions. These replace the need for libraries like dayjs or date-fns — the library has zero external date dependencies.
All functions are pure (they return new Date objects rather than mutating the input).
Import
import { today, parseDate, startOf, endOf, add, subtract, isSame, isBefore, isAfter, diff, daysInMonth, setYear, setMonth, setDate, setHour, setMinute, setSecond, formatBasic,} from "react-date-range-picker-headless";DateUnit Type
Most functions accept a DateUnit parameter:
type DateUnit = "year" | "month" | "week" | "day" | "hour" | "minute" | "second" | "millisecond";Functions
today
Returns the current date/time.
const now = today(); // new Date()parseDate
Parse a value into a Date object. Returns new Date() if the input is falsy.
parseDate("2026-03-01"); // DateparseDate(1709251200000); // Date from timestampparseDate(existingDate); // CloneparseDate(null); // new Date() (fallback)Signature: parseDate(date?: Date | string | number | null): Date
startOf
Get the start of a unit of time.
startOf(date, "day"); // 2026-03-01 00:00:00.000startOf(date, "month"); // 2026-03-01 00:00:00.000startOf(date, "year"); // 2026-01-01 00:00:00.000startOf(date, "week"); // Start of week (default Sunday)startOf(date, "week", 1); // Start of week (Monday)Signature: startOf(date: Date, unit: DateUnit, weekStartsOn?: number): Date
endOf
Get the end of a unit of time.
endOf(date, "day"); // 2026-03-01 23:59:59.999endOf(date, "month"); // 2026-03-31 23:59:59.999endOf(date, "year"); // 2026-12-31 23:59:59.999Signature: endOf(date: Date, unit: DateUnit, weekStartsOn?: number): Date
add
Add an amount of time to a date.
add(date, 1, "day"); // Tomorrowadd(date, 3, "month"); // 3 months lateradd(date, -1, "year"); // 1 year agoadd(date, 2, "hour"); // 2 hours laterHandles month overflow (e.g. Jan 31 + 1 month = Feb 28, not Mar 3).
Signature: add(date: Date, amount: number, unit: DateUnit): Date
subtract
Subtract an amount of time from a date. Equivalent to add(date, -amount, unit).
subtract(date, 7, "day"); // 7 days agosubtract(date, 1, "month"); // 1 month agoSignature: subtract(date: Date, amount: number, unit: DateUnit): Date
isSame
Check if two dates are the same at a given unit of precision.
isSame(date1, date2, "day"); // Same calendar day?isSame(date1, date2, "month"); // Same month?isSame(date1, date2, "year"); // Same year?isSame(null, date2, "day"); // false (null-safe)Signature: isSame(date1: Date | null | undefined, date2: Date | null | undefined, unit?: DateUnit): boolean
isBefore
Check if the first date is before the second at a given precision.
isBefore(date1, date2, "day"); // Is date1 on an earlier day?isBefore(date1, date2); // Millisecond comparisonSignature: isBefore(date1: Date, date2: Date, unit?: DateUnit): boolean
isAfter
Check if the first date is after the second at a given precision.
isAfter(date1, date2, "day"); // Is date1 on a later day?Signature: isAfter(date1: Date, date2: Date, unit?: DateUnit): boolean
diff
Get the difference between two dates in a given unit.
diff(date1, date2, "day"); // Number of days betweendiff(date1, date2, "month"); // Number of months betweendiff(date1, date2, "year"); // Number of years betweenSignature: diff(date1: Date, date2: Date, unit: DateUnit): number
daysInMonth
Get the number of days in a date’s month.
daysInMonth(new Date(2026, 1)); // 28 (February 2026)daysInMonth(new Date(2026, 0)); // 31 (January 2026)Signature: daysInMonth(date: Date): number
setYear / setMonth / setDate / setHour / setMinute / setSecond
Set a specific part of a date, returning a new Date.
setYear(date, 2027); // Change year to 2027setMonth(date, 5); // Change to June (0-indexed)setDate(date, 15); // Change to 15thsetHour(date, 14); // Change to 2 PMsetMinute(date, 30); // Change to :30setSecond(date, 0); // Change to :00setYear and setMonth handle overflow (e.g. Feb 29 in a leap year, set to a non-leap year, clamps to Feb 28).
Signatures:
setYear(date: Date, year: number): DatesetMonth(date: Date, month: number): DatesetDate(date: Date, day: number): DatesetHour(date: Date, hour: number): DatesetMinute(date: Date, minute: number): DatesetSecond(date: Date, second: number): Date
formatBasic
Format a date using a template string.
formatBasic(date, "YYYY-MM-DD"); // "2026-03-01"formatBasic(date, "YYYY/MM/DD HH:mm:ss"); // "2026/03/01 14:30:00"formatBasic(date, "M/D"); // "3/1"formatBasic(date, "hh:mm A"); // Note: A token not supported, use period from hookSupported tokens:
| Token | Output | Example |
|---|---|---|
YYYY | 4-digit year | 2026 |
MM | 2-digit month | 03 |
M | Month (no padding) | 3 |
DD | 2-digit day | 01 |
D | Day (no padding) | 1 |
HH | 2-digit hour (24h) | 14 |
H | Hour (24h, no padding) | 14 |
hh | 2-digit hour (12h) | 02 |
h | Hour (12h, no padding) | 2 |
mm | 2-digit minute | 30 |
m | Minute (no padding) | 30 |
ss | 2-digit second | 05 |
s | Second (no padding) | 5 |
Signature: formatBasic(date: Date, format: string): string