Calendar
Markdown for agentsMonth grid with ISO date keys, min/max bounds and full keyboard navigation.
npx @slipstream-ui/cli@latest add calendarMonth grid
November 2026
SunMonTueWedThuFriSat
Selected: 2026-11-13
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| value | string | — | Selected day as `YYYY-MM-DD` (controlled). |
| defaultValue | string | — | Initial day when uncontrolled. |
| onValueChange | (value: string) => void | — | Fired with the ISO key. |
| min / max | string | — | Selectable bounds, inclusive. |
| weekStartsOn | 0 | 1 | 0 | Sunday or Monday first. |
| isDateDisabled | (value: string) => boolean | — | Block individual days. |
| autoFocus | boolean | false | Focus the active day on mount. |
| disabled | boolean | — | Disables the grid and month controls. |
Accessibility
- role=grid with rows, columnheaders and gridcells; the month label is announced politely.
- Arrow keys move by day or week, Home/End jump to the week bounds, PageUp/PageDown change month, Enter selects.
- One tab stop: roving tabindex keeps the grid compact for keyboard users.
- Today uses aria-current="date"; selection uses aria-selected on the cell.
Browser support
| Browser | Tested versions |
|---|---|
| Chrome | 111+ (Mar 2023) |
| Edge | 111+ (Mar 2023) |
| Firefox | 121+ (Dec 2023) |
| Safari | 17.2+ — macOS & iOS (Dec 2023) |
Slipstream components rely only on CSS custom properties, Flexbox/Grid, and ARIA — the everyday baseline of the last two years of evergreen releases. Anything newer is progressive enhancement: unsupported browsers keep full functionality with static behavior instead of animations.