rc-calendar

rc-calendar is a comprehensive, unstyled React calendar and date-picker component family. It provides everything from a single-date calendar to month, year, and decade views, a range calendar for selecting date spans, a full-calendar layout, and a picker wrapper that turns any input into a popup calendar. Time selection, localization, and keyboard navigation are built in.

Originally the date engine behind Ant Design’s DatePicker, rc-calendar exposes low-level, highly configurable primitives you can style and compose to build custom date and range pickers. While newer projects often use its successor rc-picker, rc-calendar remains widely depended upon across the React ecosystem.

What You Get

• A single-date Calendar plus MonthCalendar, RangeCalendar, and FullCalendar components
• A Picker wrapper that attaches a popup calendar to any input or trigger element
• Built-in time selection, footer actions (Today, OK, Clear), and keyboard navigation
• Localization support with bundled locale files for many languages
• Unstyled, highly configurable primitives designed to be themed and composed

Common Use Cases

• Adding a date picker to a form input with a popup calendar
• Letting users select a start and end date with the range calendar
• Building month or year pickers for reporting and filtering interfaces
• Rendering a full-page calendar view for scheduling or event displays

Under The Hood

Architecture - The library is organized by view type under src/: Calendar.jsx (the core day grid), MonthCalendar.jsx, RangeCalendar.js, and FullCalendar.jsx, each composed from smaller pieces in src/date, src/month, src/year, src/decade, and shared chrome like CalendarHeader.jsx and CalendarFooter.jsx. Picker.jsx wraps a calendar in an rc-trigger popup so it can attach to inputs. Locale data lives in src/locale and shared behaviour in src/mixin and src/util.

Tech Stack - JavaScript (JSX) compiled with Babel, published to lib. It depends on moment for date math, rc-trigger for popup positioning, rc-util for React helpers, react-lifecycles-compat for cross-version lifecycle support, classnames, and prop-types. Styling is provided via Less files.

Code Quality - The repo has an extensive Enzyme/Jest test suite under tests/ with snapshot coverage for Calendar, RangeCalendar, MonthCalendar, FullCalendar, Picker, and locale handling, tracked on Codecov. It is a mature, long-lived project (700+ commits, 122 contributors) though built on older-generation React patterns (mixins, moment) that its successor rc-picker modernises.

API Design - Each component exposes a rich prop surface (value/defaultValue, onChange, onSelect, disabledDate, showToday, timePicker, locale) that trades some simplicity for deep configurability. The separation into distinct calendar variants plus a Picker wrapper keeps concerns clear, and the moment-based value model was familiar to most React developers of its era.