Web Date Range Picker

A powerful and flexible date picker component with single and range selection modes, internationalization support, and comprehensive customization options.

Key Features

Single & Range Selection

Support for both single date and date range selection with intuitive click and drag interactions

Input Masking

Automatic date formatting as you type with support for multiple date formats

Multi-Month Display

Display multiple months side by side in horizontal or grid layouts

Internationalization

Built-in support for multiple languages with auto-detection and custom strings

Date Restrictions

Min/max dates, disabled weekdays, custom disable logic, and more

Keyboard Navigation

Full keyboard support with arrow keys, home/end, page up/down, and shortcuts

Custom Styling

Fully themeable with CSS custom properties and extensive style options

Web Component

Use as a standard web component or via JavaScript API

TypeScript Support

Full TypeScript definitions included for better development experience

Quick Start

Install via npm:

Installation
 

Use as a Web Component:

Web Component
 

Or use the JavaScript API:

JavaScript API
 

Next Steps