Datepicker
A date selection component with calendar dropdown. Supports single date and date range selection modes. Includes min/max date constraints, configurable display format, and week start day options. Works with Rails form builder or standalone.
Preview & Code
_datepicker.html.erb
███
██████████ █████████ ████████ ██████
██████
████ ███████ █████
███ ██████ ████████████████████████ █████ ██ ██████████ ████████████ ██████ ██████ █████ ██
██████████ █████
███ ██████ ████████████████████████ █████ █████████████ ██████ ██████ █████ ██
datepicker_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ ██████████████ ███████████ ████████████ ███████ █████████████ ███████████
██████ ██████ █ █
███████ █ █████ ███████ ████████ ████████████ ██
█████ █ █████ ███████ ████████ ████████ ██
████████ ███████
████████ ███████
██████████ █ █████ ███████ ████████ ████████ ██
datepicker_component.html.erb
████ ██████████ █████████████████ ███ ███ ████████████████████ ████████████████ ███
███ █████ ██
██ ██ ███████████████████ ██
██████ ████████ ████████ ███ ██████████ █████████████ ████
███ ██████████ ██
██ ██ █████████ ██
█████ ███████████████████ ████████████████
██ ███ ██
████████
██ ███ ██
datepicker_component.rb
█ ██████████████████████ ████
█████ ███████████████████ █ ███████████████████
███ ███████████
█████ ████
██████████ ████
█████ ████
██████ ████
██████ ████
█████ ████
datepicker_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ ██████████████ ███████████ ████████████ ███████ █████████████ ███████████
██████ ██████ █ █
███████ █ █████ ███████ ████████ ████████████ ██
█████ █ █████ ███████ ████████ ████████ ██
████████ ███████
████████ ███████
██████████ █ █████ ███████ ████████ ████████ ██
Changelog
- Initial release with single date and range selection modes
- Configurable date format display
- Min/max date constraints
- Week start day option (Sunday or Monday)
- Dark mode support
- Form builder and standalone modes
Get Full Access
Unlock the source code for this component and all others. One-time payment for lifetime access.
Get Access Now