Skip to content

Commit 13b4f6a

Browse files
shruti-14shruti-14
authored
Upgrade react version to ^18.2.0
Upgrade react version to ^18.2.0
1 parent 8d8fe12 commit 13b4f6a

8 files changed

+14271
-190
lines changed

‎DateTime.js

+5-4
Original file line numberDiff line numberDiff line change
@@ -141,12 +141,13 @@ var Datetime = createClass({
141141
formats.datetime = formats.date && formats.time ?
142142
formats.date + ' ' + formats.time :
143143
formats.date || formats.time
144-
;
144+
;
145145

146146
return formats;
147147
},
148148

149-
componentWillReceiveProps: function (nextProps) {
149+
// eslint-disable-next-line camelcase
150+
UNSAFE_componentWillReceiveProps: function (nextProps) {
150151
var formats = this.getFormats(nextProps),
151152
updatedState = {}
152153
;
@@ -469,8 +470,8 @@ var Datetime = createClass({
469470
// TODO: Make a function or clean up this code,
470471
// logic right now is really hard to follow
471472
var className = 'rdt' + (this.props.className ?
472-
( Array.isArray( this.props.className ) ?
473-
' ' + this.props.className.join( ' ' ) : ' ' + this.props.className) : ''),
473+
( Array.isArray( this.props.className ) ?
474+
' ' + this.props.className.join( ' ' ) : ' ' + this.props.className) : ''),
474475
children = [];
475476

476477
if ( this.props.input ) {

‎demo/src/index.js

+7-4
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
1-
import React from 'react';
2-
import ReactDOM from 'react-dom';
3-
import App from './App';
1+
import React from "react";
2+
import { createRoot } from "react-dom/client";
43

5-
ReactDOM.render(<App />, document.getElementById('root'));
4+
import App from "./App";
5+
6+
const container = document.getElementById("root");
7+
const root = createRoot(container);
8+
root.render(<App />);

‎example/example.js

+17-16
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,20 @@
1-
var DateTime = require('../DateTime.js');
2-
var React = require('react');
3-
var ReactDOM = require('react-dom');
4-
var moment = require('moment');
1+
var DateTime = require("../DateTime.js");
2+
var React = require("react");
3+
var client = require("react-dom/client");
4+
var moment = require("moment");
55

6-
ReactDOM.render(
6+
const container = document.getElementById("datetime");
7+
const root = client.createRoot(container);
8+
root.render(
79
React.createElement(DateTime, {
8-
value: moment(),
9-
dateFormat: 'MMM D, YYYY',
10-
timeFormat: 'h:mm a',
11-
onChange: function (date) {
12-
console.log('onChange called with the following date:', date.format());
13-
},
14-
closeOnSelect: true,
15-
showTimeSelector: true,
16-
displayTimeZone: 'America/Phoenix'
17-
}),
18-
document.getElementById('datetime')
10+
value: moment(),
11+
dateFormat: "MMM D, YYYY",
12+
timeFormat: "h:mm a",
13+
onChange: function (date) {
14+
console.log("onChange called with the following date:", date.format());
15+
},
16+
closeOnSelect: true,
17+
showTimeSelector: true,
18+
displayTimeZone: "America/Phoenix",
19+
})
1920
);

‎example/formatChangeExample.js

+29-28
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,35 @@
1-
var DateTime = require('../DateTime.js');
2-
var React = require('react');
3-
var ReactDOM = require('react-dom');
4-
var createClass = require('create-react-class');
5-
var moment = require('moment');
1+
var DateTime = require("../DateTime.js");
2+
var React = require("react");
3+
var client = require("react-dom/client");
4+
var createClass = require("create-react-class");
5+
var moment = require("moment");
66

77
var Wrapper = createClass({
8-
getInitialState: function() {
9-
return {
10-
dateFormat: 'YYYY-MM-DD'
11-
};
12-
},
8+
getInitialState: function () {
9+
return {
10+
dateFormat: "YYYY-MM-DD",
11+
};
12+
},
1313

14-
updateFormat: function(format) {
15-
console.log('changing state');
16-
this.setState({
17-
dateFormat: 'DD.MM.YYYY'
18-
});
19-
},
14+
updateFormat: function (format) {
15+
console.log("changing state");
16+
this.setState({
17+
dateFormat: "DD.MM.YYYY",
18+
});
19+
},
2020

21-
componentDidMount: function() {
22-
setTimeout(this.updateFormat, 2000);
23-
},
21+
componentDidMount: function () {
22+
setTimeout(this.updateFormat, 2000);
23+
},
2424

25-
render: function() {
26-
return React.createElement(DateTime,
27-
{ dateFormat: this.state.dateFormat, timeFormat: false, defaultValue: moment() });
28-
}
25+
render: function () {
26+
return React.createElement(DateTime, {
27+
dateFormat: this.state.dateFormat,
28+
timeFormat: false,
29+
defaultValue: moment(),
30+
});
31+
},
2932
});
30-
31-
ReactDOM.render(
32-
React.createElement(Wrapper),
33-
document.getElementById('datetime')
34-
);
33+
const container = document.getElementById("datetime");
34+
const root = client.createRoot(container);
35+
root.render(React.createElement(Wrapper));

‎example/viewModeChangeExample.js

+29-28
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,36 @@
1-
var DateTime = require('../DateTime.js');
2-
var React = require('react');
3-
var ReactDOM = require('react-dom');
4-
var createClass = require('create-react-class');
5-
var moment = require('moment');
1+
var DateTime = require("../DateTime.js");
2+
var React = require("react");
3+
var client = require("react-dom/client");
4+
var createClass = require("create-react-class");
5+
var moment = require("moment");
66

77
var Wrapper = createClass({
8-
getInitialState: function() {
9-
return {
10-
viewMode: 'time'
11-
};
12-
},
8+
getInitialState: function () {
9+
return {
10+
viewMode: "time",
11+
};
12+
},
1313

14-
updateView: function(format) {
15-
console.log('changing viewMode to days');
16-
this.setState({
17-
viewMode: 'days'
18-
});
19-
},
14+
updateView: function (format) {
15+
console.log("changing viewMode to days");
16+
this.setState({
17+
viewMode: "days",
18+
});
19+
},
2020

21-
componentDidMount: function() {
22-
setTimeout(this.updateView, 3000);
23-
},
21+
componentDidMount: function () {
22+
setTimeout(this.updateView, 3000);
23+
},
2424

25-
render: function() {
26-
console.log('Current viewmode: ' + this.state.viewMode);
27-
return React.createElement(DateTime,
28-
{ viewMode: this.state.viewMode, defaultValue: moment() });
29-
}
25+
render: function () {
26+
console.log("Current viewmode: " + this.state.viewMode);
27+
return React.createElement(DateTime, {
28+
viewMode: this.state.viewMode,
29+
defaultValue: moment(),
30+
});
31+
},
3032
});
3133

32-
ReactDOM.render(
33-
React.createElement(Wrapper),
34-
document.getElementById('datetime')
35-
);
34+
const container = document.getElementById("datetime");
35+
const root = client.createRoot(container);
36+
root.render(React.createElement(Wrapper));

0 commit comments

Comments
 (0)