Skip to content
This repository was archived by the owner on May 19, 2025. It is now read-only.

Commit 5ec2b60

Browse files
committed
add changelog
1 parent d5477ef commit 5ec2b60

File tree

1 file changed

+117
-0
lines changed

1 file changed

+117
-0
lines changed

CHANGELOG.md

Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
# Changelog
2+
All notable changes to this project will be documented in this file.
3+
4+
The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
5+
and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
6+
7+
8+
9+
## [Unreleased]
10+
11+
### Changed
12+
- BREAKING: `Calendar` and `DateRange` are now totally controlled components with stateless date management.
13+
14+
- BREAKING: React-date-range is no longer use moment out of the box. Input and output values are native Date object. Until v2 version you don't depent on momentjs. You can keep continue to use moment if you want like below
15+
16+
OLD
17+
```js
18+
// this.state.eventDate: momentjs object
19+
<Calendar
20+
date={this.state.eventDate}
21+
onChange={date => this.setState({eventDate: date})}
22+
/>
23+
```
24+
25+
NEW
26+
```js
27+
<Calendar
28+
date={this.state.eventDate} // js object
29+
onChange={date => this.setState({ eventDate: date })} //
30+
/>
31+
```
32+
33+
NEW with moment (or any other date libraries)
34+
```js
35+
<Calendar
36+
date={this.state.eventDate.toDate()} // convert moment object to js Date
37+
onChange={date => this.setState({ eventDate: moment(date) })} //
38+
/>
39+
```
40+
- BREAKING: Theming and style approach complately changed. `react-date-range` don't use inline styles any more. At the new version you should import **skeleton styles** and **theme styles**
41+
42+
```js
43+
// main style file
44+
import 'react-date-range/dist/styles.css';
45+
// theme css file
46+
import 'react-date-range/dist/theme/default.css';
47+
```
48+
49+
- BREAKING: `Calendar` and `DateRange` Components, no longer support string typed `lang` prop.
50+
51+
OLD
52+
```js
53+
<Calendar lang="tr" />
54+
```
55+
56+
NEW
57+
```js
58+
import turkish from 'react-date-range/locale/tr';
59+
// you can view full list in https://github.com/Adphorus/react-date-range/tree/next/src/locale/index.js
60+
<Calendar locale={turkish} />
61+
```
62+
63+
- BREAKING: `DateRange` handle range data with `ranges:Array` prop instead of `startDate` and `endDate` props.
64+
65+
OLD
66+
```js
67+
<DateRange
68+
startDate={new Date()}
69+
endDate={new Date(2048, 6, 6)}
70+
onChange={ change => {
71+
console.log(change);
72+
/* prints:
73+
{
74+
startDate: Moment,
75+
endDate: Moment
76+
}
77+
/*
78+
} }
79+
/>
80+
```
81+
82+
NEW
83+
```js
84+
<DateRange
85+
ranges={[{
86+
startDate: new Date(),
87+
endDate: new Date(2048, 06, 06),
88+
key: 'selection',
89+
}]}
90+
onChange={changes => {
91+
console.log(changes);
92+
/* prints
93+
{
94+
selection: {
95+
startDate: Date,
96+
endDate: Date
97+
}
98+
}
99+
*/
100+
}}
101+
/>
102+
```
103+
- `calendars` prop renamed as `months`. And `Calendar` component is accepting `months` prop just like `DateRange`. Default value changed to `1` from `2`.
104+
### Removed
105+
106+
- `format` prop removed. No longer accepts string input for `Calendar` or `DateRange`. You should parse dates like below:
107+
Native js: `new Date(dateString)`
108+
Date-fns: `fns.parse(dateString)`
109+
Momentjs: `moment(dateString).toDate()`
110+
111+
- `disableDaysBeforeToday` prop removed. use `minDate={new Date()}` instead.
112+
113+
- `firstDayOfWeek` prop removed. It is auto detecting from locale prop.
114+
115+
- `init` prop removed.
116+
117+

0 commit comments

Comments
 (0)