Is your feature request related to a problem? Please describe.
QUI currently lacks date/time input components, which are essential for forms requiring date
selection (bookings, scheduling, filtering, etc.). Users must either use native HTML5 inputs
(inconsistent across browsers) or integrate third-party libraries that don't match QUI's design
system.
Describe the solution you'd like
Implement a suite of date/time picker components following QUI's established 3-tier architecture:
- DatePicker (Priority: High) - Single date selection with calendar popup
- DateRangePicker (Priority: Medium) - Start/end date range selection
- TimePicker (Priority: Medium) - Hour/minute/second selection
- DateTimePicker (Priority: Low) - Combined date + time selection
Components should include:
- Calendar navigation (month/year)
- Keyboard accessibility (arrow keys, Enter, Escape)
- Min/max date constraints
- Disabled date ranges
- Multiple size variants (sm, md, lg)
- Theme support (all QDS themes)
- Localization support
- Integration with React Hook Form / Angular Forms
Describe alternatives you've considered
- Native HTML5
<input type="date"> - Inconsistent UI across browsers, limited styling
- Third-party libraries (react-datepicker, antd DatePicker) - Don't match QDS design system
- Building custom solutions - No consistency, duplicated effort
Additional context
Infrastructure: dayjs, @floating-ui/react, accessibility patterns already available
Expected scope: ~50-60 files for MVP (React DatePicker only)
Full implementation: ~100-130 files (similar to Stepper #221)
Is your feature request related to a problem? Please describe.
QUI currently lacks date/time input components, which are essential for forms requiring date
selection (bookings, scheduling, filtering, etc.). Users must either use native HTML5 inputs
(inconsistent across browsers) or integrate third-party libraries that don't match QUI's design
system.
Describe the solution you'd like
Implement a suite of date/time picker components following QUI's established 3-tier architecture:
Components should include:
Describe alternatives you've considered
<input type="date">- Inconsistent UI across browsers, limited stylingAdditional context
Infrastructure: dayjs, @floating-ui/react, accessibility patterns already available
Expected scope: ~50-60 files for MVP (React DatePicker only)
Full implementation: ~100-130 files (similar to Stepper #221)