Calendar

Accessibility

• Grid role with arrow key movement.
• Each day has a full label, like Wednesday, November 4, 2026.
• Today is marked with aria-current.

Motion

• Months slide 24 px the way you paged, in 280 ms.
• The selected chip scales from 0.9. A range band follows the pointer after the start is picked.
• With reduced motion, months swap and the fill changes in place.

Responsive behavior

• 36 px cells on Web and 44 px on Mobile.
• Two months stack on Mobile.

Performance

• Only range mode adds a hover handler, so other modes do not re-render every cell on hover.
• Intl formatters are memoized per locale, and booked days sit in a set.
• Six rows always, so paging causes no layout shift.

• Import Calendar from @/components/fetaui/calendar.
• mode is single, range or datetime. Range values are { start, end }, and datetime needs slots.
• onApply adds the Apply or Confirm footer. Without it, read onValueChange.
• booked and isDisabled both block picking. Without a value or defaultMonth, the month waits for the browser. The demo's Apply does nothing. Dropdowns compose Select.