From 4ae1870eacfd0d15c3c4f9219883f66655485782 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=A0=97=E5=98=89=E7=94=B7?= <574980606@qq.com> Date: Fri, 25 Nov 2022 17:43:09 +0800 Subject: [PATCH] docs: update demo --- .../__snapshots__/demo-extend.test.ts.snap | 1836 +++++++++-------- .../__tests__/__snapshots__/demo.test.ts.snap | 1816 ++++++++-------- components/progress/demo/circle-mini.tsx | 2 +- components/progress/demo/circle.tsx | 2 +- components/progress/demo/dashboard.tsx | 8 +- components/progress/demo/dynamic.tsx | 26 +- components/progress/demo/format.tsx | 2 +- components/progress/demo/gradient-line.tsx | 13 +- components/progress/demo/linecap.tsx | 8 +- components/progress/demo/segment.tsx | 16 +- 10 files changed, 1965 insertions(+), 1764 deletions(-) diff --git a/components/progress/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/progress/__tests__/__snapshots__/demo-extend.test.ts.snap index 877582332ffe..d4cea7cb7c2c 100644 --- a/components/progress/__tests__/__snapshots__/demo-extend.test.ts.snap +++ b/components/progress/__tests__/__snapshots__/demo-extend.test.ts.snap @@ -1,197 +1,213 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`renders ./components/progress/demo/circle.tsx extend context correctly 1`] = ` -Array [ +
- - - - - - - 75% - + + + + + + + 75% + +
-
, +
- - - - - - + + + + + - + + - +
- , +
- - - - - - + + + + + - + + - +
- , -] + + `; exports[`renders ./components/progress/demo/circle-dynamic.tsx extend context correctly 1`] = ` @@ -395,305 +411,333 @@ Array [ `; exports[`renders ./components/progress/demo/circle-mini.tsx extend context correctly 1`] = ` -Array [ +
- - - - - - - 30% - + + + + + + + 30% + +
-
, +
- - - - - - + + + + + - + + - +
- , +
- - - - - - + + + + + - + + - +
- , -] + + `; exports[`renders ./components/progress/demo/dashboard.tsx extend context correctly 1`] = ` -Array [ +
- - - - - - - 75% - + + + + + + + 75% + +
-
, +
- - - - - - - 75% - + + + + + + + 75% + +
- , -] + + `; exports[`renders ./components/progress/demo/dynamic.tsx extend context correctly 1`] = ` @@ -783,111 +827,123 @@ Array [ `; exports[`renders ./components/progress/demo/format.tsx extend context correctly 1`] = ` -Array [ +
- - - - - - - 75 Days - + + + + + + + 75 Days + +
-
, +
- - - - - - - Done - + + + + + + + Done + +
- , -] + + `; exports[`renders ./components/progress/demo/gradient-line.tsx extend context correctly 1`] = ` @@ -939,161 +995,175 @@ Array [ ,
- - - + - + + + + + + - - - - - - - - - 90% - + + + + 90% + +
+
- , -
- - - - - - - - - - - - - - - + + + + + +
+
, ] @@ -1407,106 +1477,120 @@ Array [ ,
- - - - - - - 75% - +
+ + + + + + + 75% + +
+
- , -
- - - - - - - 75% - +
+ + + + + + + 75% + +
+
, ] @@ -1566,152 +1650,166 @@ Array [ ,
- - - - - - - 60% - -
-
, -
-
+ + + + + + class="ant-progress-text" + title="60%" + > + 60% +
+
+
-
, -
- - - - - - - 60% - -
-
, -
-
+ + + + + + class="ant-progress-text" + title="60%" + > + 60% +
+
+
diff --git a/components/progress/__tests__/__snapshots__/demo.test.ts.snap b/components/progress/__tests__/__snapshots__/demo.test.ts.snap index 842bc60adaed..44b91bae74a2 100644 --- a/components/progress/__tests__/__snapshots__/demo.test.ts.snap +++ b/components/progress/__tests__/__snapshots__/demo.test.ts.snap @@ -1,197 +1,213 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`renders ./components/progress/demo/circle.tsx correctly 1`] = ` -Array [ +
- - - - - - - 75% - + + + + + + + 75% + +
-
, +
- - - - - - + + + + + - + + - +
- , +
- - - - - - + + + + + - + + - +
- , -] + + `; exports[`renders ./components/progress/demo/circle-dynamic.tsx correctly 1`] = ` @@ -366,305 +382,333 @@ Array [ `; exports[`renders ./components/progress/demo/circle-mini.tsx correctly 1`] = ` -Array [ +
- - - - - - - 30% - + + + + + + + 30% + +
-
, +
- - - - - - + + + + + - + + - +
- , +
- - - - - - + + + + + - + + - +
- , -] + + `; exports[`renders ./components/progress/demo/dashboard.tsx correctly 1`] = ` -Array [ +
- - - - - - - 75% - + + + + + + + 75% + +
-
, +
- - - - - - - 75% - + + + + + + + 75% + +
- , -] + + `; exports[`renders ./components/progress/demo/dynamic.tsx correctly 1`] = ` @@ -754,111 +798,123 @@ Array [ `; exports[`renders ./components/progress/demo/format.tsx correctly 1`] = ` -Array [ +
- - - - - - - 75 Days - + + + + + + + 75 Days + +
-
, +
- - - - - - - Done - + + + + + + + Done + +
- , -] + + `; exports[`renders ./components/progress/demo/gradient-line.tsx correctly 1`] = ` @@ -900,171 +956,185 @@ Array [ class="ant-progress-bg" style="width:99.9%;height:8px;background-image:linear-gradient(to right, #108ee9, #87d068)" /> - - - - 99.9% - - , -
-
- - - - - - - - - - - - - 90% - -
-
, -
-
- - - - - - - - - - - - +
+ + 99.9% + +
, +
+
+
- - - + + 90% + +
+
+
+
+
+
+ + + + + + + + + + + + + + + + +
+
, ] @@ -1378,106 +1448,120 @@ Array [ ,
- - - - - - - 75% - +
+ + + + + + + 75% + +
+
- , -
- - - - - - - 75% - +
+ + + + + + + 75% + +
+
, ] @@ -1513,106 +1597,120 @@ Array [ ,
- - - - - - - 60% - +
+ + + + + + + 60% + +
+
- , -
- - - - - - - 60% - +
+ + + + + + + 60% + +
+
, ] diff --git a/components/progress/demo/circle-mini.tsx b/components/progress/demo/circle-mini.tsx index a9b081db4119..eff6e4e47886 100644 --- a/components/progress/demo/circle-mini.tsx +++ b/components/progress/demo/circle-mini.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Progress, Space } from 'antd'; const App: React.FC = () => ( - + diff --git a/components/progress/demo/circle.tsx b/components/progress/demo/circle.tsx index 959fcbbe1a84..bf1cb83cb8a1 100644 --- a/components/progress/demo/circle.tsx +++ b/components/progress/demo/circle.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Progress, Space } from 'antd'; const App: React.FC = () => ( - + diff --git a/components/progress/demo/dashboard.tsx b/components/progress/demo/dashboard.tsx index 3929df9342a6..27a758a42d70 100644 --- a/components/progress/demo/dashboard.tsx +++ b/components/progress/demo/dashboard.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { Progress } from 'antd'; +import { Progress, Space } from 'antd'; const App: React.FC = () => ( - <> - + + - + ); export default App; diff --git a/components/progress/demo/dynamic.tsx b/components/progress/demo/dynamic.tsx index a49450591476..960495b12b24 100644 --- a/components/progress/demo/dynamic.tsx +++ b/components/progress/demo/dynamic.tsx @@ -3,22 +3,26 @@ import { MinusOutlined, PlusOutlined } from '@ant-design/icons'; import { Button, Progress } from 'antd'; const App: React.FC = () => { - const [percent, setPercent] = useState(0); + const [percent, setPercent] = useState(0); const increase = () => { - let newPercent = percent + 10; - if (newPercent > 100) { - newPercent = 100; - } - setPercent(newPercent); + setPercent((prevPercent) => { + const newPercent = prevPercent + 10; + if (newPercent > 100) { + return 100; + } + return newPercent; + }); }; const decline = () => { - let newPercent = percent - 10; - if (newPercent < 0) { - newPercent = 0; - } - setPercent(newPercent); + setPercent((prevPercent) => { + const newPercent = prevPercent - 10; + if (newPercent < 0) { + return 0; + } + return newPercent; + }); }; return ( diff --git a/components/progress/demo/format.tsx b/components/progress/demo/format.tsx index caccddfb9f46..a9c885458c1a 100644 --- a/components/progress/demo/format.tsx +++ b/components/progress/demo/format.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Progress, Space } from 'antd'; const App: React.FC = () => ( - + `${percent} Days`} /> 'Done'} /> diff --git a/components/progress/demo/gradient-line.tsx b/components/progress/demo/gradient-line.tsx index 226470248564..87fcb2ee6e79 100644 --- a/components/progress/demo/gradient-line.tsx +++ b/components/progress/demo/gradient-line.tsx @@ -1,17 +1,14 @@ import React from 'react'; -import { Progress } from 'antd'; +import { Progress, Space } from 'antd'; const App: React.FC = () => ( <> - - + + + + ); diff --git a/components/progress/demo/linecap.tsx b/components/progress/demo/linecap.tsx index ba73fb519ca0..ec09f4816d9b 100644 --- a/components/progress/demo/linecap.tsx +++ b/components/progress/demo/linecap.tsx @@ -1,11 +1,13 @@ import React from 'react'; -import { Progress } from 'antd'; +import { Progress, Space } from 'antd'; const App: React.FC = () => ( <> - - + + + + ); diff --git a/components/progress/demo/segment.tsx b/components/progress/demo/segment.tsx index 8ab1315c20ad..e1a0a2f1ef9d 100644 --- a/components/progress/demo/segment.tsx +++ b/components/progress/demo/segment.tsx @@ -1,17 +1,19 @@ import React from 'react'; -import { Progress, Tooltip } from 'antd'; +import { Progress, Tooltip, Space } from 'antd'; const App: React.FC = () => ( <> - - - - - - + + + + + + + + );