GitHub

Reference headless

calendar

interface 4 type 5 function 1
interface Interfaces 4
interface

# CalendarContext

Reactive context surfaced to consumers.

Members

focusedDate
focusedDate: CalendarDate

Currently focused day cell. Mirrors tabindex="0" on its grid cell.

isDateUnavailable
isDateUnavailable: IsDateUnavailable | null

Disable predicate. Returns true if the given date should be marked unavailable in the grid (e.g. a public holiday). Pure function — must not capture mutable external state if you want predictable transitions.

maxValue
maxValue: CalendarDate | null

Inclusive upper bound for selectable dates. null = no ceiling.

minValue
minValue: CalendarDate | null

Inclusive lower bound for selectable dates. null = no floor.

selectedDate
selectedDate: CalendarDate | null

Currently selected date, or null if nothing is selected yet.

selections
selections: number

Number of user-initiated selections since construction (telemetry hook).

interface calendar/index.ts · L38

# CalendarController

Members

context
readonly context: Readonly<CalendarContext>
disabled
readonly disabled: boolean
focusedDate
readonly focusedDate: CalendarDate
id
readonly id: string

Stable controller id, used to derive deterministic day-cell ids.

machine
readonly machine: CalendarMachine

Underlying machine — exposed for advanced use, debugging, and tests.

root
readonly root: Attachment

Attachment for the grid container — owns keyboard nav.

selectedDate
readonly selectedDate: CalendarDate | null
state
readonly state: CalendarState
dayCell()
dayCell(date): Attachment

Factory: attachment for a specific day cell.

###### Parameters

###### date

CalendarDate

###### Returns

Attachment

dayCellId()
dayCellId(date): string

Compute the deterministic id for a day cell.

###### Parameters

###### date

CalendarDate

###### Returns

string

focus()
focus(date): void

###### Parameters

###### date

CalendarDate

###### Returns

void

isSelectable()
isSelectable(date): boolean

Pure helper: is this date currently selectable?

###### Parameters

###### date

CalendarDate

###### Returns

boolean

select()
select(date): void

###### Parameters

###### date

CalendarDate

###### Returns

void

setDisabled()
setDisabled(disabled): void

###### Parameters

###### disabled

boolean

###### Returns

void

setValue()
setValue(date): void

###### Parameters

###### date

CalendarDate | null

###### Returns

void

subscribe()
subscribe(listener): () => void

Subscribe to state changes. Returns an unsubscribe.

###### Parameters

###### listener

(snapshot) => void

###### Returns

() => void

interface

# CreateCalendarInput

Construction input.

Members

disabled?
optional disabled?: boolean

Construct in the disabled state. Defaults to false.

focusedDate
focusedDate: CalendarDate

Date to focus initially. Required — the grid must always have a focused cell.

isDateUnavailable?
optional isDateUnavailable?: IsDateUnavailable | null

Disable predicate.

maxValue?
optional maxValue?: CalendarDate | null

Inclusive upper bound for selectable dates.

minValue?
optional minValue?: CalendarDate | null

Inclusive lower bound for selectable dates.

selectedDate?
optional selectedDate?: CalendarDate | null

Initial selection. Defaults to null (no selection).

interface calendar/index.ts · L74

# CreateCalendarOptions

Construction input.

Members

direction?
optional direction?: "ltr" | "rtl"

Reading direction. RTL inverts the meaning of ArrowLeft/ArrowRight to follow visual flow. Defaults to 'ltr'.

disabled?
optional disabled?: boolean

Construct in the disabled state. Defaults to false.

###### Inherited from

CreateCalendarInput.disabled

focusedDate
focusedDate: CalendarDate

Date to focus initially. Required — the grid must always have a focused cell.

###### Inherited from

CreateCalendarInput.focusedDate

id?
optional id?: string

Stable id override.

isDateUnavailable?
optional isDateUnavailable?: IsDateUnavailable | null

Disable predicate.

###### Inherited from

CreateCalendarInput.isDateUnavailable

maxValue?
optional maxValue?: CalendarDate | null

Inclusive upper bound for selectable dates.

###### Inherited from

CreateCalendarInput.maxValue

minValue?
optional minValue?: CalendarDate | null

Inclusive lower bound for selectable dates.

###### Inherited from

CreateCalendarInput.minValue

onFocusChange?
optional onFocusChange?: (date) => void

Called whenever focus moves to a new date (keyboard or programmatic).

###### Parameters

###### date

CalendarDate

###### Returns

void

onSelect?
optional onSelect?: (date) => void

Called when the user selects a new date. Not called for controlled setValue.

###### Parameters

###### date

CalendarDate

###### Returns

void

selectedDate?
optional selectedDate?: CalendarDate | null

Initial selection. Defaults to null (no selection).

###### Inherited from

CreateCalendarInput.selectedDate

type Type Aliases 5
type calendar/index.ts · L36

# Attachment

Attachment = (node) => void | (() => void)

Parameters

node
HTMLElement

Returns

void | (() => void)
type

# CalendarEvent

CalendarEvent = { date: CalendarDate; type: "FOCUS_DATE"; } | { days: number; type: "FOCUS_DAY_DELTA"; } | { months: number; type: "FOCUS_MONTH_DELTA"; } | { type: "FOCUS_YEAR_DELTA"; years: number; } | { date: CalendarDate; type: "SELECT"; } | { date: CalendarDate | null; type: "SET_VALUE"; } | { type: "DISABLE"; } | { type: "ENABLE"; }

Calendar machine events.

type

# CalendarState

CalendarState = "idle" | "disabled"

State names.

type

# IsDateUnavailable

IsDateUnavailable = (date) => boolean

Predicate for marking individual dates as unavailable (e.g. holidays).

Parameters

date
CalendarDate

Returns

boolean
function Functions 1