From f8d728161c4f657fd606c29c26972b79959b21d6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?= Date: Fri, 22 Apr 2022 13:35:27 +0800 Subject: [PATCH] docs: Update demo with Space (#35172) --- components/config-provider/demo/theme.md | 7 +- .../__snapshots__/demo-extend.test.ts.snap | 357 +++++++----- .../__tests__/__snapshots__/demo.test.js.snap | 357 +++++++----- components/dropdown/demo/basic.md | 9 +- components/dropdown/demo/event.md | 9 +- components/dropdown/demo/item.md | 9 +- components/dropdown/demo/menu-full.md | 9 +- components/dropdown/demo/overlay-visible.md | 9 +- components/dropdown/demo/sub-menu.md | 9 +- components/dropdown/demo/trigger.md | 9 +- .../__snapshots__/demo-extend.test.ts.snap | 530 +++++++++++------- .../__tests__/__snapshots__/demo.test.js.snap | 530 +++++++++++------- components/table/demo/dynamic-settings.md | 7 +- 13 files changed, 1140 insertions(+), 711 deletions(-) diff --git a/components/config-provider/demo/theme.md b/components/config-provider/demo/theme.md index 08ee960c6b..c89dff29d5 100644 --- a/components/config-provider/demo/theme.md +++ b/components/config-provider/demo/theme.md @@ -323,8 +323,11 @@ const FormSizeDemo = () => { /> } > - e.preventDefault()}> - Hover me + e.preventDefault()}> + + Hover me + + diff --git a/components/dropdown/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/dropdown/__tests__/__snapshots__/demo-extend.test.ts.snap index 9388bee355..cb04769392 100644 --- a/components/dropdown/__tests__/__snapshots__/demo-extend.test.ts.snap +++ b/components/dropdown/__tests__/__snapshots__/demo-extend.test.ts.snap @@ -2583,28 +2583,41 @@ Array [ exports[`renders ./components/dropdown/demo/basic.md extend context correctly 1`] = ` Array [ - Hover me - - - + Hover me + +
+ + + +
+
,
+
+ + + +
+
,
+
+ + + +
+
,
+
+ + + +
+
,
+
+ + + +
+
,
+
+ + + +
+
,
+
+ + + +
+
,
+
+ + + +
+
`; @@ -356,55 +369,81 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = ` exports[`renders ./components/dropdown/demo/event.md correctly 1`] = ` - Hover me, Click menu item - - - + Hover me, Click menu item + +
+ + + +
+
`; exports[`renders ./components/dropdown/demo/item.md correctly 1`] = ` - Hover me - - - + Hover me + +
+ + + +
+
`; @@ -626,55 +665,81 @@ exports[`renders ./components/dropdown/demo/loading.md correctly 1`] = ` exports[`renders ./components/dropdown/demo/menu-full.md correctly 1`] = ` - Hover to check menu style - - - + Hover to check menu style + +
+ + + +
+
`; exports[`renders ./components/dropdown/demo/overlay-visible.md correctly 1`] = ` - Hover me - - - + Hover me + +
+ + + +
+
`; @@ -784,54 +849,80 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = ` exports[`renders ./components/dropdown/demo/sub-menu.md correctly 1`] = ` - Cascading menu - - - + Cascading menu + +
+ + + +
+
`; exports[`renders ./components/dropdown/demo/trigger.md correctly 1`] = ` - Click me - - - + Click me + +
+ + + +
+
`; diff --git a/components/dropdown/demo/basic.md b/components/dropdown/demo/basic.md index 01a1533277..986b9b1d62 100644 --- a/components/dropdown/demo/basic.md +++ b/components/dropdown/demo/basic.md @@ -14,7 +14,7 @@ title: The most basic dropdown menu. ```jsx -import { Menu, Dropdown } from 'antd'; +import { Menu, Dropdown, Space } from 'antd'; import { DownOutlined, SmileOutlined } from '@ant-design/icons'; const menu = ( @@ -54,8 +54,11 @@ const menu = ( export default () => ( - e.preventDefault()}> - Hover me + e.preventDefault()}> + + Hover me + + ); diff --git a/components/dropdown/demo/event.md b/components/dropdown/demo/event.md index a7a36960c4..e8cbab610d 100644 --- a/components/dropdown/demo/event.md +++ b/components/dropdown/demo/event.md @@ -14,7 +14,7 @@ title: An event will be triggered when you click menu items, in which you can make different operations according to item's key. ```jsx -import { Menu, Dropdown, message } from 'antd'; +import { Menu, Dropdown, message, Space } from 'antd'; import { DownOutlined } from '@ant-design/icons'; const onClick = ({ key }) => { @@ -43,8 +43,11 @@ const menu = ( export default () => ( - e.preventDefault()}> - Hover me, Click menu item + e.preventDefault()}> + + Hover me, Click menu item + + ); diff --git a/components/dropdown/demo/item.md b/components/dropdown/demo/item.md index dc8eb3336e..1fdb7e080a 100644 --- a/components/dropdown/demo/item.md +++ b/components/dropdown/demo/item.md @@ -14,7 +14,7 @@ title: Divider and disabled menu item. ```jsx -import { Menu, Dropdown } from 'antd'; +import { Menu, Dropdown, Space } from 'antd'; import { DownOutlined } from '@ant-design/icons'; const menu = ( @@ -50,8 +50,11 @@ const menu = ( export default () => ( - e.preventDefault()}> - Hover me + e.preventDefault()}> + + Hover me + + ); diff --git a/components/dropdown/demo/menu-full.md b/components/dropdown/demo/menu-full.md index f89f57db5f..b9fecdb44d 100644 --- a/components/dropdown/demo/menu-full.md +++ b/components/dropdown/demo/menu-full.md @@ -19,7 +19,7 @@ This demo was created for debugging Menu styles inside Dropdown. [#19150](https://github.com/ant-design/ant-design/pull/19150) ```tsx -import { Menu, Dropdown, MenuProps } from 'antd'; +import { Menu, Dropdown, MenuProps, Space } from 'antd'; import { MailOutlined, AppstoreOutlined, SettingOutlined, DownOutlined } from '@ant-design/icons'; type MenuItem = Required['items'][number]; @@ -71,8 +71,11 @@ const menu = ; export default () => ( - e.preventDefault()}> - Hover to check menu style + e.preventDefault()}> + + Hover to check menu style + + ); diff --git a/components/dropdown/demo/overlay-visible.md b/components/dropdown/demo/overlay-visible.md index 6cf7104bac..b4980aa8a0 100644 --- a/components/dropdown/demo/overlay-visible.md +++ b/components/dropdown/demo/overlay-visible.md @@ -14,7 +14,7 @@ title: The default is to close the menu when you click on menu items, this feature can be turned off. ```jsx -import { Menu, Dropdown } from 'antd'; +import { Menu, Dropdown, Space } from 'antd'; import { DownOutlined } from '@ant-design/icons'; class OverlayVisible extends React.Component { @@ -58,8 +58,11 @@ class OverlayVisible extends React.Component { onVisibleChange={this.handleVisibleChange} visible={this.state.visible} > - e.preventDefault()}> - Hover me + e.preventDefault()}> + + Hover me + + ); diff --git a/components/dropdown/demo/sub-menu.md b/components/dropdown/demo/sub-menu.md index 26deeadbe8..ba80db5a21 100644 --- a/components/dropdown/demo/sub-menu.md +++ b/components/dropdown/demo/sub-menu.md @@ -14,7 +14,7 @@ title: The menu has multiple levels. ```jsx -import { Menu, Dropdown } from 'antd'; +import { Menu, Dropdown, Space } from 'antd'; import { DownOutlined } from '@ant-design/icons'; const { SubMenu } = Menu; @@ -71,8 +71,11 @@ const menu = ( export default () => ( - e.preventDefault()}> - Cascading menu + e.preventDefault()}> + + Cascading menu + + ); diff --git a/components/dropdown/demo/trigger.md b/components/dropdown/demo/trigger.md index 5c86a3d5dd..e8a4d02e1b 100644 --- a/components/dropdown/demo/trigger.md +++ b/components/dropdown/demo/trigger.md @@ -14,7 +14,7 @@ title: The default trigger mode is `hover`, you can change it to `click`. ```tsx -import { Menu, Dropdown } from 'antd'; +import { Menu, Dropdown, Space } from 'antd'; import { DownOutlined } from '@ant-design/icons'; const menu = ( @@ -41,8 +41,11 @@ const menu = ( export default () => ( - e.preventDefault()}> - Click me + e.preventDefault()}> + + Click me + + ); diff --git a/components/table/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/table/__tests__/__snapshots__/demo-extend.test.ts.snap index c1ba5775b6..be1255d050 100644 --- a/components/table/__tests__/__snapshots__/demo-extend.test.ts.snap +++ b/components/table/__tests__/__snapshots__/demo-extend.test.ts.snap @@ -3664,29 +3664,40 @@ Array [ @@ -3756,29 +3767,40 @@ Array [ @@ -3848,29 +3870,40 @@ Array [ @@ -3940,29 +3973,40 @@ Array [ @@ -4032,29 +4076,40 @@ Array [ @@ -4124,29 +4179,40 @@ Array [ @@ -4216,29 +4282,40 @@ Array [ @@ -4308,29 +4385,40 @@ Array [ @@ -4400,29 +4488,40 @@ Array [ @@ -4492,29 +4591,40 @@ Array [ diff --git a/components/table/__tests__/__snapshots__/demo.test.js.snap b/components/table/__tests__/__snapshots__/demo.test.js.snap index 989ab570b3..4343be62db 100644 --- a/components/table/__tests__/__snapshots__/demo.test.js.snap +++ b/components/table/__tests__/__snapshots__/demo.test.js.snap @@ -2937,29 +2937,40 @@ Array [ @@ -3029,29 +3040,40 @@ Array [ @@ -3121,29 +3143,40 @@ Array [ @@ -3213,29 +3246,40 @@ Array [ @@ -3305,29 +3349,40 @@ Array [ @@ -3397,29 +3452,40 @@ Array [ @@ -3489,29 +3555,40 @@ Array [ @@ -3581,29 +3658,40 @@ Array [ @@ -3673,29 +3761,40 @@ Array [ @@ -3765,29 +3864,40 @@ Array [ diff --git a/components/table/demo/dynamic-settings.md b/components/table/demo/dynamic-settings.md index 2ec0bf5015..a3b26bf5e6 100644 --- a/components/table/demo/dynamic-settings.md +++ b/components/table/demo/dynamic-settings.md @@ -49,8 +49,11 @@ const columns = [ render: () => ( Delete - - More actions + + + More actions + + ),