From e09ce6284e28615a1f15bfbe49ec9985b67ea9ae Mon Sep 17 00:00:00 2001 From: afc163 Date: Sat, 6 Jun 2020 13:56:26 +0800 Subject: [PATCH] :clapper: update DatePicker and TimePicker demo --- .../__tests__/__snapshots__/demo.test.js.snap | 256 +++++++++--------- components/date-picker/demo/basic.md | 4 +- components/date-picker/demo/bordered.md | 4 +- components/date-picker/demo/date-render.md | 4 +- components/date-picker/demo/disabled-date.md | 4 +- components/date-picker/demo/disabled.md | 4 +- components/date-picker/demo/extra-footer.md | 4 +- components/date-picker/demo/format.md | 4 +- components/date-picker/demo/mode.md | 4 +- .../date-picker/demo/presetted-ranges.md | 4 +- components/date-picker/demo/range-picker.md | 4 +- components/date-picker/demo/size.md | 4 +- components/date-picker/demo/start-end.md | 4 +- components/date-picker/demo/suffix.md | 4 +- components/date-picker/demo/time.md | 4 +- .../__tests__/__snapshots__/demo.test.js.snap | 148 +++++----- components/time-picker/demo/12hours.md | 4 +- components/time-picker/demo/basic.md | 5 +- components/time-picker/demo/disabled.md | 8 +- components/time-picker/demo/hide-column.md | 8 +- components/time-picker/demo/range-picker.md | 7 +- components/time-picker/demo/size.md | 4 +- components/time-picker/demo/suffix.md | 4 +- components/time-picker/demo/value.md | 16 +- 24 files changed, 259 insertions(+), 257 deletions(-) diff --git a/components/date-picker/__tests__/__snapshots__/demo.test.js.snap b/components/date-picker/__tests__/__snapshots__/demo.test.js.snap index 6a8dc42e2c..26c0d66067 100644 --- a/components/date-picker/__tests__/__snapshots__/demo.test.js.snap +++ b/components/date-picker/__tests__/__snapshots__/demo.test.js.snap @@ -1,7 +1,7 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`renders ./components/date-picker/demo/basic.md correctly 1`] = ` -
+Array [
@@ -41,8 +41,8 @@ exports[`renders ./components/date-picker/demo/basic.md correctly 1`] = `
-
-
+ , +
,
@@ -82,8 +82,8 @@ exports[`renders ./components/date-picker/demo/basic.md correctly 1`] = `
- -
+ , +
,
@@ -123,8 +123,8 @@ exports[`renders ./components/date-picker/demo/basic.md correctly 1`] = `
- -
+ , +
,
@@ -164,8 +164,8 @@ exports[`renders ./components/date-picker/demo/basic.md correctly 1`] = `
- -
+ , +
,
@@ -205,12 +205,12 @@ exports[`renders ./components/date-picker/demo/basic.md correctly 1`] = `
- - + , +] `; exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = ` -
+Array [
@@ -250,8 +250,8 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
-
-
+ , +
,
@@ -291,8 +291,8 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
- -
+ , +
,
@@ -332,8 +332,8 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
- -
+ , +
,
@@ -373,8 +373,8 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
- -
+ , +
,
@@ -457,8 +457,8 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = ` -
-
+ , +
,
@@ -541,8 +541,8 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = ` -
-
+ , +
,
@@ -625,8 +625,8 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = ` -
-
+ , +
,
@@ -709,12 +709,12 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = ` -
- + , +] `; exports[`renders ./components/date-picker/demo/date-render.md correctly 1`] = ` -
+Array [
@@ -754,7 +754,7 @@ exports[`renders ./components/date-picker/demo/date-render.md correctly 1`] = `
-
+ ,
@@ -837,12 +837,12 @@ exports[`renders ./components/date-picker/demo/date-render.md correctly 1`] = ` -
- + , +] `; exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = ` -
+Array [
@@ -883,8 +883,8 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
-
-
+ , +
,
@@ -925,8 +925,8 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
- -
+ , +
,
@@ -1011,8 +1011,8 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = ` -
-
+ , +
,
@@ -1120,12 +1120,12 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = ` -
- + , +] `; exports[`renders ./components/date-picker/demo/disabled-date.md correctly 1`] = ` -
+Array [
@@ -1165,8 +1165,8 @@ exports[`renders ./components/date-picker/demo/disabled-date.md correctly 1`] =
-
-
+ , +
,
@@ -1206,8 +1206,8 @@ exports[`renders ./components/date-picker/demo/disabled-date.md correctly 1`] =
- -
+ , +
,
@@ -1290,7 +1290,7 @@ exports[`renders ./components/date-picker/demo/disabled-date.md correctly 1`] = -
+ ,
@@ -1373,12 +1373,12 @@ exports[`renders ./components/date-picker/demo/disabled-date.md correctly 1`] = -
- + , +] `; exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = ` -
+Array [
@@ -1418,8 +1418,8 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = `
-
-
+ , +
,
@@ -1459,8 +1459,8 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = `
- -
+ , +
,
@@ -1543,8 +1543,8 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = ` -
-
+ , +
,
@@ -1627,8 +1627,8 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = ` -
-
+ , +
,
@@ -1668,12 +1668,12 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = `
- - + , +] `; exports[`renders ./components/date-picker/demo/format.md correctly 1`] = ` -
+Array [
@@ -1737,8 +1737,8 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
-
-
+ , +
,
@@ -1802,8 +1802,8 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
- -
+ , +
,
@@ -1867,8 +1867,8 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
- -
+ , +
,
@@ -1975,12 +1975,12 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = ` -
- + , +] `; exports[`renders ./components/date-picker/demo/mode.md correctly 1`] = ` -
+Array [
@@ -2020,8 +2020,8 @@ exports[`renders ./components/date-picker/demo/mode.md correctly 1`] = `
-
-
+ , +
,
@@ -2104,12 +2104,12 @@ exports[`renders ./components/date-picker/demo/mode.md correctly 1`] = ` -
- + , +] `; exports[`renders ./components/date-picker/demo/presetted-ranges.md correctly 1`] = ` -
+Array [
@@ -2192,8 +2192,8 @@ exports[`renders ./components/date-picker/demo/presetted-ranges.md correctly 1`] -
-
+
, +
,
@@ -2276,12 +2276,12 @@ exports[`renders ./components/date-picker/demo/presetted-ranges.md correctly 1`] -
- + , +] `; exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = ` -
+Array [
@@ -2364,8 +2364,8 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = ` -
-
+
, +
,
@@ -2448,8 +2448,8 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = ` -
-
+ , +
,
@@ -2532,8 +2532,8 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = ` -
-
+ , +
,
@@ -2616,8 +2616,8 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = ` -
-
+ , +
,
@@ -2700,8 +2700,8 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = ` -
- + , +] `; exports[`renders ./components/date-picker/demo/select-in-range.md correctly 1`] = ` @@ -2791,7 +2791,7 @@ exports[`renders ./components/date-picker/demo/select-in-range.md correctly 1`] `; exports[`renders ./components/date-picker/demo/size.md correctly 1`] = ` -
+Array [
@@ -2853,9 +2853,9 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = ` Small -
-
-
+
, +
, +
,
@@ -2895,8 +2895,8 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
- -
+ , +
,
@@ -2936,8 +2936,8 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
- -
+ , +
,
@@ -3020,8 +3020,8 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = ` -
-
+ , +
,
@@ -3061,12 +3061,12 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
- - + , +] `; exports[`renders ./components/date-picker/demo/start-end.md correctly 1`] = ` -
+Array [
@@ -3106,7 +3106,7 @@ exports[`renders ./components/date-picker/demo/start-end.md correctly 1`] = `
-
+ ,
@@ -3146,12 +3146,12 @@ exports[`renders ./components/date-picker/demo/start-end.md correctly 1`] = `
- - + , +] `; exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = ` -
+Array [
@@ -3191,8 +3191,8 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
-
-
+ , +
,
@@ -3232,8 +3232,8 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
- -
+ , +
,
@@ -3316,8 +3316,8 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = ` -
-
+ , +
,
@@ -3357,8 +3357,8 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
- -
+ , +
,
@@ -3379,8 +3379,8 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = ` ab
- -
+ , +
,
@@ -3401,8 +3401,8 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = ` ab
- -
+ , +
,
@@ -3466,8 +3466,8 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = ` > ab -
-
+ , +
,
@@ -3488,12 +3488,12 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = ` ab
- - + , +] `; exports[`renders ./components/date-picker/demo/time.md correctly 1`] = ` -
+Array [
@@ -3533,8 +3533,8 @@ exports[`renders ./components/date-picker/demo/time.md correctly 1`] = `
-
-
+ , +
,
@@ -3617,6 +3617,6 @@ exports[`renders ./components/date-picker/demo/time.md correctly 1`] = ` -
- + , +] `; diff --git a/components/date-picker/demo/basic.md b/components/date-picker/demo/basic.md index 333c116890..e0be734574 100644 --- a/components/date-picker/demo/basic.md +++ b/components/date-picker/demo/basic.md @@ -21,7 +21,7 @@ function onChange(date, dateString) { } ReactDOM.render( -
+ <>
@@ -31,7 +31,7 @@ ReactDOM.render(
-
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/bordered.md b/components/date-picker/demo/bordered.md index 9c66f8b41f..237616e974 100644 --- a/components/date-picker/demo/bordered.md +++ b/components/date-picker/demo/bordered.md @@ -19,7 +19,7 @@ import { DatePicker } from 'antd'; const { RangePicker } = DatePicker; ReactDOM.render( -
+ <>
@@ -35,7 +35,7 @@ ReactDOM.render(
-
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/date-render.md b/components/date-picker/demo/date-render.md index f553da0e6a..c741a001b8 100644 --- a/components/date-picker/demo/date-render.md +++ b/components/date-picker/demo/date-render.md @@ -19,7 +19,7 @@ import { DatePicker } from 'antd'; const { RangePicker } = DatePicker; ReactDOM.render( -
+ <> { const style = {}; @@ -48,7 +48,7 @@ ReactDOM.render( ); }} /> -
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/disabled-date.md b/components/date-picker/demo/disabled-date.md index 8ed87cc727..c8c4931728 100644 --- a/components/date-picker/demo/disabled-date.md +++ b/components/date-picker/demo/disabled-date.md @@ -56,7 +56,7 @@ function disabledRangeTime(_, type) { } ReactDOM.render( -
+ <> -
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/disabled.md b/components/date-picker/demo/disabled.md index c9f1b8cbed..78d51eb33a 100644 --- a/components/date-picker/demo/disabled.md +++ b/components/date-picker/demo/disabled.md @@ -21,7 +21,7 @@ const { MonthPicker, RangePicker } = DatePicker; const dateFormat = 'YYYY-MM-DD'; ReactDOM.render( -
+ <>
@@ -35,7 +35,7 @@ ReactDOM.render( defaultValue={[moment('2019-09-03', dateFormat), moment('2019-11-22', dateFormat)]} disabled={[false, true]} /> -
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/extra-footer.md b/components/date-picker/demo/extra-footer.md index 75489dd2d1..dcbd10ea4c 100644 --- a/components/date-picker/demo/extra-footer.md +++ b/components/date-picker/demo/extra-footer.md @@ -19,7 +19,7 @@ import { DatePicker } from 'antd'; const { RangePicker } = DatePicker; ReactDOM.render( -
+ <> 'extra footer'} />
'extra footer'} showTime /> @@ -29,7 +29,7 @@ ReactDOM.render( 'extra footer'} showTime />
'extra footer'} picker="month" /> -
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/format.md b/components/date-picker/demo/format.md index f2104bcdbd..c1c45192af 100644 --- a/components/date-picker/demo/format.md +++ b/components/date-picker/demo/format.md @@ -25,7 +25,7 @@ const monthFormat = 'YYYY/MM'; const dateFormatList = ['DD/MM/YYYY', 'DD/MM/YY']; ReactDOM.render( -
+ <>
@@ -36,7 +36,7 @@ ReactDOM.render( defaultValue={[moment('2015/01/01', dateFormat), moment('2015/01/01', dateFormat)]} format={dateFormat} /> -
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/mode.md b/components/date-picker/demo/mode.md index f4a00a20b5..0b533caa0b 100644 --- a/components/date-picker/demo/mode.md +++ b/components/date-picker/demo/mode.md @@ -77,11 +77,11 @@ class ControlledRangePicker extends React.Component { } ReactDOM.render( -
+ <>
-
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/presetted-ranges.md b/components/date-picker/demo/presetted-ranges.md index 28b66ff4ad..ed731bb3ab 100644 --- a/components/date-picker/demo/presetted-ranges.md +++ b/components/date-picker/demo/presetted-ranges.md @@ -25,7 +25,7 @@ function onChange(dates, dateStrings) { } ReactDOM.render( -
+ <> -
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/range-picker.md b/components/date-picker/demo/range-picker.md index c897328703..e510a7f04b 100644 --- a/components/date-picker/demo/range-picker.md +++ b/components/date-picker/demo/range-picker.md @@ -19,7 +19,7 @@ import { DatePicker } from 'antd'; const { RangePicker } = DatePicker; ReactDOM.render( -
+ <>
@@ -29,7 +29,7 @@ ReactDOM.render(
-
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/size.md b/components/date-picker/demo/size.md index a6170a40bb..a3059196bb 100644 --- a/components/date-picker/demo/size.md +++ b/components/date-picker/demo/size.md @@ -30,7 +30,7 @@ class PickerSizesDemo extends React.Component { render() { const { size } = this.state; return ( -
+ <> Large Default @@ -45,7 +45,7 @@ class PickerSizesDemo extends React.Component {
-
+ ); } } diff --git a/components/date-picker/demo/start-end.md b/components/date-picker/demo/start-end.md index 821b5e8c14..0accc92242 100644 --- a/components/date-picker/demo/start-end.md +++ b/components/date-picker/demo/start-end.md @@ -73,7 +73,7 @@ class DateRange extends React.Component { render() { const { startValue, endValue, endOpen } = this.state; return ( -
+ <> -
+ ); } } diff --git a/components/date-picker/demo/suffix.md b/components/date-picker/demo/suffix.md index a50c5090f1..3c8ef25ba3 100644 --- a/components/date-picker/demo/suffix.md +++ b/components/date-picker/demo/suffix.md @@ -26,7 +26,7 @@ function onChange(date, dateString) { } ReactDOM.render( -
+ <>
@@ -42,7 +42,7 @@ ReactDOM.render(
-
, + , mountNode, ); ``` diff --git a/components/date-picker/demo/time.md b/components/date-picker/demo/time.md index 5c25d6cd45..21e3660add 100644 --- a/components/date-picker/demo/time.md +++ b/components/date-picker/demo/time.md @@ -28,7 +28,7 @@ function onOk(value) { } ReactDOM.render( -
+ <>
-
, + , mountNode, ); ``` diff --git a/components/time-picker/__tests__/__snapshots__/demo.test.js.snap b/components/time-picker/__tests__/__snapshots__/demo.test.js.snap index 9373653639..0c35345190 100644 --- a/components/time-picker/__tests__/__snapshots__/demo.test.js.snap +++ b/components/time-picker/__tests__/__snapshots__/demo.test.js.snap @@ -1,7 +1,7 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`renders ./components/time-picker/demo/12hours.md correctly 1`] = ` -
+Array [
@@ -44,7 +44,7 @@ exports[`renders ./components/time-picker/demo/12hours.md correctly 1`] = `
-
+ ,
- + ,
@@ -131,8 +131,8 @@ exports[`renders ./components/time-picker/demo/12hours.md correctly 1`] = `
- - + , +] `; exports[`renders ./components/time-picker/demo/addon.md correctly 1`] = ` @@ -437,98 +437,96 @@ exports[`renders ./components/time-picker/demo/interval-options.md correctly 1`] `; exports[`renders ./components/time-picker/demo/range-picker.md correctly 1`] = ` -
+
-
- -
-
- - - - - -
-
- -
-
+
+
+
+ +
+
+ + + + +
`; exports[`renders ./components/time-picker/demo/size.md correctly 1`] = ` -
+Array [
@@ -595,7 +593,7 @@ exports[`renders ./components/time-picker/demo/size.md correctly 1`] = `
-
+
,
@@ -662,7 +660,7 @@ exports[`renders ./components/time-picker/demo/size.md correctly 1`] = `
-
+
,
@@ -729,8 +727,8 @@ exports[`renders ./components/time-picker/demo/size.md correctly 1`] = `
- - + , +] `; exports[`renders ./components/time-picker/demo/suffix.md correctly 1`] = ` diff --git a/components/time-picker/demo/12hours.md b/components/time-picker/demo/12hours.md index e4b74d3dc8..69f514f5e4 100644 --- a/components/time-picker/demo/12hours.md +++ b/components/time-picker/demo/12hours.md @@ -21,11 +21,11 @@ function onChange(time, timeString) { } ReactDOM.render( -
+ <> -
, + , mountNode, ); ``` diff --git a/components/time-picker/demo/basic.md b/components/time-picker/demo/basic.md index d4e8b54ed1..8aef219595 100644 --- a/components/time-picker/demo/basic.md +++ b/components/time-picker/demo/basic.md @@ -22,7 +22,10 @@ function onChange(time, timeString) { } ReactDOM.render( - , + , mountNode, ); ``` diff --git a/components/time-picker/demo/disabled.md b/components/time-picker/demo/disabled.md index a66ffccfbc..dba590ac84 100644 --- a/components/time-picker/demo/disabled.md +++ b/components/time-picker/demo/disabled.md @@ -17,5 +17,11 @@ A disabled state of the `TimePicker`. import { TimePicker } from 'antd'; import moment from 'moment'; -ReactDOM.render(, mountNode); +ReactDOM.render( + , + mountNode, +); ``` diff --git a/components/time-picker/demo/hide-column.md b/components/time-picker/demo/hide-column.md index 793cac85aa..21b1488b2a 100644 --- a/components/time-picker/demo/hide-column.md +++ b/components/time-picker/demo/hide-column.md @@ -19,5 +19,11 @@ import moment from 'moment'; const format = 'HH:mm'; -ReactDOM.render(, mountNode); +ReactDOM.render( + , + mountNode, +); ``` diff --git a/components/time-picker/demo/range-picker.md b/components/time-picker/demo/range-picker.md index d0768dbf35..629938001b 100644 --- a/components/time-picker/demo/range-picker.md +++ b/components/time-picker/demo/range-picker.md @@ -18,10 +18,5 @@ import { TimePicker } from 'antd'; const { RangePicker } = TimePicker; -ReactDOM.render( -
- -
, - mountNode, -); +ReactDOM.render(, mountNode); ``` diff --git a/components/time-picker/demo/size.md b/components/time-picker/demo/size.md index 1a554fe594..f7f9f613be 100644 --- a/components/time-picker/demo/size.md +++ b/components/time-picker/demo/size.md @@ -18,11 +18,11 @@ import { TimePicker } from 'antd'; import moment from 'moment'; ReactDOM.render( -
+ <> -
, + , mountNode, ); ``` diff --git a/components/time-picker/demo/suffix.md b/components/time-picker/demo/suffix.md index 9afa4fe79d..4b1bafd3f6 100644 --- a/components/time-picker/demo/suffix.md +++ b/components/time-picker/demo/suffix.md @@ -23,11 +23,9 @@ function onChange(time, timeString) { console.log(time, timeString); } -const icon = ; - ReactDOM.render( } onChange={onChange} defaultOpenValue={moment('00:00:00', 'HH:mm:ss')} />, diff --git a/components/time-picker/demo/value.md b/components/time-picker/demo/value.md index 19a29a81f9..059041fe5d 100644 --- a/components/time-picker/demo/value.md +++ b/components/time-picker/demo/value.md @@ -14,21 +14,17 @@ value 和 onChange 需要配合使用。 `value` and `onChange` should be used together, ```jsx +import React, { useState } from 'react'; import { TimePicker } from 'antd'; -class Demo extends React.Component { - state = { - value: null, - }; +const Demo = () => { + const [value, setValue] = useState(null); - onChange = time => { - console.log(time); - this.setState({ value: time }); + const onChange = time => { + setValue(time); }; - render() { - return ; - } + return ; } ReactDOM.render(, mountNode);