diff --git a/components/tag/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/tag/__tests__/__snapshots__/demo-extend.test.ts.snap index 9092a24210..f76ca4f109 100644 --- a/components/tag/__tests__/__snapshots__/demo-extend.test.ts.snap +++ b/components/tag/__tests__/__snapshots__/demo-extend.test.ts.snap @@ -240,62 +240,120 @@ Array [ Presets , -
- +
- magenta - - + magenta + +
+
- red - - + red + +
+
- volcano - - + volcano + +
+
- orange - - + orange + +
+
- gold - - + gold + +
+
- lime - - + lime + +
+
- green - - + green + +
+
- cyan - - + cyan + +
+
- blue - - + blue + +
+
- geekblue - - + geekblue + +
+
- purple - + + purple + +
,
, -
- +
- #f50 - - + #f50 + +
+
- #2db7f5 - - + #2db7f5 + +
+
- #87d068 - - + #87d068 + +
+
- #108ee9 - + + #108ee9 + +
, ] `; exports[`renders ./components/tag/demo/colorful-inverse.tsx extend context correctly 1`] = ` -Array [ +
, -
magenta +
+
red +
+
volcano +
+
orange +
+
gold +
+
lime +
+
green +
+
cyan +
+
blue +
+
geekblue +
+
purple -
, -] +
+ `; exports[`renders ./components/tag/demo/control.tsx extend context correctly 1`] = ` @@ -679,32 +806,60 @@ Array [ Without icon , -
- +
- success - - + success + +
+
- processing - - + processing + +
+
- error - - + error + +
+
- warning - - + warning + +
+
- default - + + default + +
,
, -
- +
- + + + + success + - - success - - - +
- + + + + processing + - - processing - - - +
- + + + + error + - - error - - - +
- + + + + warning + - - warning - - - +
- + + + + waiting + - - waiting - - - +
- + + + + stop + - - stop - - +
, ] `; diff --git a/components/tag/__tests__/__snapshots__/demo.test.ts.snap b/components/tag/__tests__/__snapshots__/demo.test.ts.snap index 827e595e64..f2e470d89b 100644 --- a/components/tag/__tests__/__snapshots__/demo.test.ts.snap +++ b/components/tag/__tests__/__snapshots__/demo.test.ts.snap @@ -240,62 +240,120 @@ Array [ Presets
, -
- +
- magenta - - + magenta + +
+
- red - - + red + +
+
- volcano - - + volcano + +
+
- orange - - + orange + +
+
- gold - - + gold + +
+
- lime - - + lime + +
+
- green - - + green + +
+
- cyan - - + cyan + +
+
- blue - - + blue + +
+
- geekblue - - + geekblue + +
+
- purple - + + purple + +
,
, -
- +
- #f50 - - + #f50 + +
+
- #2db7f5 - - + #2db7f5 + +
+
- #87d068 - - + #87d068 + +
+
- #108ee9 - + + #108ee9 + +
, ] `; exports[`renders ./components/tag/demo/colorful-inverse.tsx correctly 1`] = ` -Array [ +
, -
magenta +
+
red +
+
volcano +
+
orange +
+
gold +
+
lime +
+
green +
+
cyan +
+
blue +
+
geekblue +
+
purple -
, -] +
+
`; exports[`renders ./components/tag/demo/control.tsx correctly 1`] = ` @@ -679,32 +806,60 @@ Array [ Without icon
, -
- +
- success - - + success + +
+
- processing - - + processing + +
+
- error - - + error + +
+
- warning - - + warning + +
+
- default - + + default + +
,
, -
- +
- + + + + success + - - success - - - +
- + + + + processing + - - processing - - - +
- + + + + error + - - error - - - +
- + + + + warning + - - warning - - - +
- + + + + waiting + - - waiting - - - +
- + + + + stop + - - stop - - +
, ] `; diff --git a/components/tag/demo/colorful-inverse.md b/components/tag/demo/colorful-inverse.md index 8c3af980fd..04c4f7d958 100644 --- a/components/tag/demo/colorful-inverse.md +++ b/components/tag/demo/colorful-inverse.md @@ -5,9 +5,3 @@ ## en-US Internal inverse color tag - - diff --git a/components/tag/demo/colorful-inverse.tsx b/components/tag/demo/colorful-inverse.tsx index 5d94f6358a..18b8f7a03a 100644 --- a/components/tag/demo/colorful-inverse.tsx +++ b/components/tag/demo/colorful-inverse.tsx @@ -1,23 +1,20 @@ import React from 'react'; -import { Divider, Tag } from 'antd'; +import { Space, Tag } from 'antd'; const App: React.FC = () => ( - <> - Presets Inverse -
- magenta - red - volcano - orange - gold - lime - green - cyan - blue - geekblue - purple -
- + + magenta + red + volcano + orange + gold + lime + green + cyan + blue + geekblue + purple + ); export default App; diff --git a/components/tag/demo/colorful.md b/components/tag/demo/colorful.md index a8cec2e91b..b8f16f60e6 100644 --- a/components/tag/demo/colorful.md +++ b/components/tag/demo/colorful.md @@ -5,9 +5,3 @@ ## en-US We preset a series of colorful tag styles for use in different situations. You can also set it to a hex color string for custom color. - - diff --git a/components/tag/demo/colorful.tsx b/components/tag/demo/colorful.tsx index 55d43efff3..51e06f2a63 100644 --- a/components/tag/demo/colorful.tsx +++ b/components/tag/demo/colorful.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { Divider, Tag } from 'antd'; +import { Divider, Space, Tag } from 'antd'; const App: React.FC = () => ( <> Presets -
+ magenta red volcano @@ -16,14 +16,14 @@ const App: React.FC = () => ( blue geekblue purple -
+ Custom -
+ #f50 #2db7f5 #87d068 #108ee9 -
+ ); diff --git a/components/tag/demo/status.tsx b/components/tag/demo/status.tsx index 94764c548a..f289ef5335 100644 --- a/components/tag/demo/status.tsx +++ b/components/tag/demo/status.tsx @@ -7,20 +7,20 @@ import { MinusCircleOutlined, SyncOutlined, } from '@ant-design/icons'; -import { Divider, Tag } from 'antd'; +import { Divider, Space, Tag } from 'antd'; const App: React.FC = () => ( <> Without icon -
+ success processing error warning default -
+ With icon -
+ } color="success"> success @@ -39,7 +39,7 @@ const App: React.FC = () => ( } color="default"> stop -
+ ); diff --git a/components/tooltip/demo/colorful.md b/components/tooltip/demo/colorful.md index e5dbe95141..b1f8106316 100644 --- a/components/tooltip/demo/colorful.md +++ b/components/tooltip/demo/colorful.md @@ -5,9 +5,3 @@ ## en-US We preset a series of colorful Tooltip styles for use in different situations. - -```css -.ant-tag { - margin-bottom: 8px; -} -``` diff --git a/components/tooltip/demo/colorful.tsx b/components/tooltip/demo/colorful.tsx index 4df674cb92..ae9f532191 100644 --- a/components/tooltip/demo/colorful.tsx +++ b/components/tooltip/demo/colorful.tsx @@ -16,6 +16,7 @@ const colors = [ 'gold', 'lime', ]; + const customColors = ['#f50', '#2db7f5', '#87d068', '#108ee9']; const App: React.FC = () => (