https://github.com/rehookify/datepicker
The ultimate tiny tool for creating date and range pickers in your React applications.
https://github.com/rehookify/datepicker
date-picker hook range-picker react react-hooks time-picker
Last synced: 11 months ago
JSON representation
The ultimate tiny tool for creating date and range pickers in your React applications.
- Host: GitHub
- URL: https://github.com/rehookify/datepicker
- Owner: rehookify
- License: mit
- Created: 2022-11-11T10:29:12.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-12-06T11:22:05.000Z (over 1 year ago)
- Last Synced: 2025-06-29T16:55:39.919Z (12 months ago)
- Topics: date-picker, hook, range-picker, react, react-hooks, time-picker
- Language: TypeScript
- Homepage: https://rehookify.com/datepicker
- Size: 1000 KB
- Stars: 333
- Watchers: 4
- Forks: 22
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
README
# @rehookify/datepicker
`@rehookify/datepicker` is an ultimate tool for creating date, range, and time pickers in your React applications.
It provides behavioral and accessibility implementations for all sorts of calendars, date and time pickers.
[](https://bundlephobia.com/package/@rehookify/datepicker)
[](https://www.npmjs.com/package/@rehookify/datepicker)
[](https://discord.gg/vyM2jhYa33)
Tutorials |
Examples |
Configuration |
State |
Modular Hooks
## #StandWithUkraine 💙💛
We have war at our home 🇺🇦
Help us in our struggle, 💰 [United24](https://u24.gov.ua/), [KOLO](https://www.koloua.com/en), [Come Back Alive](https://savelife.in.ua/en/)
## Features
- Small in size.
- No dependencies.
- [Modular design](https://www.rehookify.com/datepicker/modular-hooks): You can use as little code as possible.
- Supports single, multiple, and range date selection, as well as a time picker.
- Multiple calendar support.
- Native localization support using *.toLocaleDateString* and *.toLocaleTimeString*.
- Follows the `prop-getters` pattern, providing all the necessary props for your components.
## Motivation
By picking a date picker for you project you can get such problems:
- 🙅 your component library doesn't have the component that you need;
- ⚙️ you need to make changes to your build process;
- 💅 your styling system is different from the most popular solution;
- 🦹 it's challenging to customise a component that matches your design;
- 💰 it could cost money to get needed components;
- 🏋️ the library is heavy and doesn't have tree-shaking;
- 📚 bad documentation;
- ⛔️ no tests, no TypeScript support, no examples...
## Instalation
`@rehookify/datepicker` is available as a package in npm registry.
You can use your favarite package manager to insall it:
```bash
npm i @rehookify/datepicker
```
```bash
yarn add @rehookify/datepicker
```
```bash
pnpm add @rehookify/datepicker
```
Start with [tutorials](https://rehookify.com/datepicker/tutorials)