feat(components): add accessible DateRangePicker component #1326

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Closed

ajaythakkar wants to merge 1 commit into unovue:dev from ajaythakkar:feat/date-range-picker

ajaythakkar commented Jul 2, 2025 •

edited

Loading

Summary

This PR adds a fully accessible DateRangePicker component built using Reka-UI primitives. The component supports:

✅ Keyboard accessibility
✅ v-model and update:modelValue support
✅ Range selection with visual feedback
✅ Clearable selections
✅ Optional custom paging logic (e.g., year-level paging)
✅ Tailwind CSS styling via data- attributes

Files Added

apps/www/src/registry/default/ui/date-range-picker/DateRangePicker.vue
apps/www/src/registry/default/example/DateRangePicker.vue
apps/www/src/registry/default/ui/date-range-picker.json
apps/www/src/content/docs/components/date-range-picker.md

Let me know if you'd like this component extended to new-york style or need additional unit tests.

daterangess

Thanks!


          feat(components): add accessible DateRangePicker component

551679f

Collaborator

sadeghbarati commented Aug 17, 2025

We already have DateRangePicker but one difference is it's RangeCalendar compose with Popover

sadeghbarati closed this

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet