date-core

Headless, i18n-aware reactive state engine for calendars and date fields.

The state layer behind @fluixi/calendar (and the upcoming date field / date picker). It wraps @internationalized/date — Adobe/Unicode's immutable, framework-agnostic date library — in fine-grained reactive builders. No JSX, no DOM: just signals describing a calendar's visible month, roving focus, navigation and selection.

Because it builds on @internationalized/date, you get multiple calendar systems (Gregorian, Buddhist, Hebrew, Islamic, …), time-zone awareness, DST correctness and locale-driven formatting for free.

Installation

pnpm add @fluixi/date-core

API

createCalendarState(options)

Single-date selection. Returns the visible range, the roving focusedDate, navigation methods (focusNextDay, focusNextPage, focusSectionStart, …), grid helpers (getDatesInWeek, getWeekDays, weeksInMonth), cell predicates (isSelected, isCellDisabled, isCellUnavailable, isCellToday, isOutsideVisibleRange) and selectDate / selectFocusedDate.

import { createCalendarState, parseDate } from '@fluixi/date-core';

const state = createCalendarState({
  locale: 'en-US',
  defaultValue: parseDate('2024-03-15'),
  minValue: parseDate('2024-01-01'),
});

state.visibleRange().start.toString(); // '2024-03-01'
state.focusNextRow();
state.selectFocusedDate();

createRangeCalendarState(options)

Two-click range selection layered on the same grid machinery. Adds anchorDate, a live highlightedRange preview, highlightDate (pointer sweep), and isSelectionStart / isSelectionEnd.

Options

Both builders accept reactive (MaybeAccessor) locale, minValue, maxValue, isDisabled, isReadOnly, firstDayOfWeek, timeZone, plus isDateUnavailable, visibleDuration, pageBehavior and a createCalendar hook for non-Gregorian systems.

Re-exports

The common @internationalized/date primitives (CalendarDate, DateFormatter, today, parseDate, getLocalTimeZone, isSameDay, …) are re-exported so consumers don't need a direct dependency.

License

MIT