Popularity
1.7
Growing
Activity
9.0
Growing
59
3
11
Monthly Downloads: 0
Programming language: JavaScript
License: MIT License
date-range-picker alternatives and similar libraries
Based on the "Date / Time picker" category.
Alternatively, view date-range-picker alternatives based on common mentions on social networks and blogs.
-
react-nice-dates
demo/docs A responsive, touch-friendly, and modular date picker library. -
r-date-picker
React.js high customize date picker component, easy style it.
Get performance insights in less than 4 minutes
Scout APM uses tracing logic that ties bottlenecks to source code so you know the exact line of code causing performance issues and can get back to building a great product faster.
Sponsored
scoutapm.com
Do you think we are missing an alternative of date-range-picker or a related project?
README
date-range-picker
A React-Redux date picker calendar with ranges.
Demo at https://almogtavor.github.io/date-range-picker/
[](public/example-image.png)
Usage
function MyComponent() {
return (
<DateRangePicker />
)
}
}
Options
Property | Type | Allowed Values | Default Value | Description |
---|---|---|---|---|
language | String | English , Hebrew |
English |
component's lanuguage. currently support English and Hebrew. Notice Languages such Hebrew changes the whole component from left to right to right to left. |
colorsPalette | String | enabled , disabled |
enabled |
by enabling colors palette you can choose the component's color. |
format | String | any combination of 2 Ds, 2 Ms and 2\4 Ys with other | DD-MM-YYYY |
the format of the dates. |
selectAllButton | String | enabled , disabled |
enabled |
depends on current borad's view (dates, months, or years), select all enabled items. |
startDate | date | date object | new Date(1900, 0, 0) |
calendar's start date. |
endDate | date | date object | new Date(2025, 0, 0) |
calendar's end date. |
firstDayOfWeekIndex | int | 0 - 6 | 0 (sunday) | first day of the week (etc monday, sunday). |
pickMethod | String | date , range , ranges |
range |
date means picking one day (on one board). range is to peak dates two dates. ranges is to pick an array of ranges (with view option on hover). |
defaultColor | String | any color format item | #2196f3 |
default component's color. becomes the first option on colors palette. |
daysAmountTab | String | enabled , disabled |
disabled |
by enabling, there will be a button on the left that you can open and choose prepared range, or days amount up to today. |
boardsNum | int | 1, 2 | 1 | by specifing you can choose the component's boards number. |