Components
WeeksView
Displays a configurable window of continuous week rows that span month boundaries.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| weekCount* | number | — | Number of week rows to display simultaneously. |
| firstWeek | FirstWeekSpec | undefined | — | The controlled first visible week. When provided, the component is controlled. |
| defaultFirstWeek | FirstWeekSpec | undefined | — | The initial first visible week (uncontrolled). |
| onFirstWeekChange | ((date: PlainDate) => void) | undefined | — | Called when the first visible week changes via navigation or focus movement. |
| scrollBy | "row" | "page" | undefined | "row" | How much to scroll per navigation step.
- "row" — scroll one week row at a time.
- "page" — scroll a full page (all visible rows) at a time. |
| outOfRangeBehavior | OutOfRangeBehavior | undefined | "unbounded" | How the visible window behaves at the min/max bounds. min/max
always restrict which **days are selectable**; this controls whether the
window may scroll beyond them, and how the edge is handled. See
OutOfRangeBehavior.
- "unbounded" — navigation is never restricted by min/max.
- "stop" — navigation halts once the next step has no in-range day.
- "stop-shrink" — like "stop", but the window shrinks at the edge.
- "snap" — overshooting jumps snap the window edge to the last/first
in-range week.
- "snap-shrink" — snap to the boundary, shrinking if still out of range. |
| onWindowChange | ((info: WindowInfo) => void) | undefined | — | Called when the visible window changes. |
| children | React.ReactNode | — | React children. |
Window Info
| Prop | Type | Default | Description |
|---|---|---|---|
| windowStart* | PlainDate | — | The first date of the visible window. |
| windowEnd* | PlainDate | — | The last date of the visible window. |
| weekCount* | number | — | Number of week rows in the window (the prop value, not actual when shrunk). |
| dayCount* | number | — | Total number of calendar days in the window. |
| enabledWeekCount* | number | — | Number of weeks that contain at least one enabled date. |
| enabledDayCount* | number | — | Number of enabled (selectable) dates in the window. |
| visibleMonths* | VisibleMonth[] | — | Distinct months visible in the window, in chronological order. |
First Week Spec
| Prop | Type | Default | Description |
|---|---|---|---|
| toLocaleString* | (() => string) | ((locales?: string | string[] | undefined, options?: Intl.DateTimeFormatOptions | undefined) => string) | { (): string; (locales?: string | string[] | undefined, options?: Intl.DateTimeFormatOptions | undefined): string; (locales?: Intl.LocalesArgument, options?: Intl.DateTimeFormatOptions | undefined): string; } | — | |
| toString* | ((options?: Temporal.ShowCalendarOption | undefined) => string) | (() => string) | (() => string) | — | |
| valueOf* | (() => never) | (() => number) | (() => Object) | — |
Members
PlainDateDate{ isoWeek: number; isoYear: number; }{ week: number; year: number; }{ month: number; year: number; day?: number; }