mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-07 17:44:35 +08:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

docs: format all markdown (#38629)

Browse Source 
* chore: add prettier-ignore in markdown demo

* docs: format markdown api table

* docs: format markdown api table
This commit is contained in:
afc163 2022-11-17 17:31:26 +08:00 committed by GitHub
parent c9eab1078f
commit e027cbec1c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
126 changed files with 1926 additions and 1800 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
components/affix/index.en-US.md
View File

@ -19,6 +19,7 @@ Please note that Affix should not cover other content on the page, especially wh
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/on-change.tsx">Callback</code>
<code src="./demo/target.tsx">Container to scroll.</code>

1
components/affix/index.zh-CN.md
View File

@ -20,6 +20,7 @@ group:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/on-change.tsx">固定状态改变的回调</code>
<code src="./demo/target.tsx">滚动容器</code>

3
components/alert/index.en-US.md
View File

@ -18,6 +18,7 @@ Alert component for feedback.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/style.tsx">More types</code>
<code src="./demo/closable.tsx">Closable</code>
@ -34,7 +35,7 @@ Alert component for feedback.
## API
| Property | Description | Type | Default | Version |
| ----------- | -------------------------------------------------------------------- | ----------------------- | --------------------------------------------- | ------- |
| --- | --- | --- | --- | --- |
| action | The action of Alert | ReactNode | - | 4.9.0 |
| afterClose | Called when close animation is finished | () => void | - | |
| banner | Whether to show as banner | boolean | false | |

3
components/anchor/index.en-US.md
View File

@ -21,6 +21,7 @@ For displaying anchor hyperlinks on page and jumping between them.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/static.tsx">Static Anchor</code>
<code src="./demo/onClick.tsx">Customize the onClick event</code>
@ -33,7 +34,7 @@ For displaying anchor hyperlinks on page and jumping between them.
### Anchor Props
| Property | Description | Type | Default | Version |
| ---------------- | --------------------------------------------------------------------------------------------- | ----------------------------------- | ------------ | ------- |
| --- | --- | --- | --- | --- |
| affix | Fixed mode of Anchor | boolean | true | |
| bounds | Bounding distance of anchor area | number | 5 | |
| getContainer | Scrolling container | () => HTMLElement | () => window | |

3
components/anchor/index.zh-CN.md
View File

@ -22,6 +22,7 @@ group:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/static.tsx">静态位置</code>
<code src="./demo/onClick.tsx">自定义 onClick 事件</code>
@ -34,7 +35,7 @@ group:
### Anchor Props
| 成员 | 说明 | 类型 | 默认值 | 版本 |
| ---------------- | ----------------------------------------------------------------------------------- | ----------------------------------- | ------------ | ---- |
| --- | --- | --- | --- | --- |
| affix | 固定模式 | boolean | true | |
| bounds | 锚点区域边界 | number | 5 | |
| getContainer | 指定滚动的容器 | () => HTMLElement | () => window | |

1
components/auto-complete/index.en-US.md
View File

@ -22,6 +22,7 @@ The differences with Select are:
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic Usage</code>
<code src="./demo/options.tsx">Customized</code>
<code src="./demo/custom.tsx">Customize Input Component</code>

3
components/auto-complete/index.zh-CN.md
View File

@ -23,6 +23,7 @@ group:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本使用</code>
<code src="./demo/options.tsx">自定义选项</code>
<code src="./demo/custom.tsx">自定义输入组件</code>
@ -36,7 +37,7 @@ group:
## API
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------- | ------------------- | ------ |
| --- | --- | --- | --- | --- |
| allowClear | 支持清除 | boolean | false | |
| autoFocus | 自动获取焦点 | boolean | false | |
| backfill | 使用键盘选择选项的时候把选中项回填到输入框中 | boolean | false | |

1
components/avatar/index.en-US.md
View File

@ -13,6 +13,7 @@ Avatars can be used to represent people or objects. It supports images, `Icon`s,
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/type.tsx">Type</code>
<code src="./demo/dynamic.tsx">Autoset Font Size</code>

1
components/avatar/index.zh-CN.md
View File

@ -18,6 +18,7 @@ group:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/type.tsx">类型</code>
<code src="./demo/dynamic.tsx">自动调整字符大小</code>

3
components/back-top/index.en-US.md
View File

@ -16,6 +16,7 @@ group: Other
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/custom.tsx" iframe="400">Custom style</code>
@ -26,7 +27,7 @@ group: Other
> If you decide to use custom styles, please note the size limit: no more than `40px * 40px`.
| Property | Description | Type | Default | Version |
| ---------------- | --------------------------------------------------------------------------- | ----------------- | ------------ | ------- |
| --- | --- | --- | --- | --- |
| duration | Time to return to top（ms） | number | 450 | 4.4.0 |
| target | Specifies the scrollable area dom node | () => HTMLElement | () => window | |
| visibilityHeight | The BackTop button will not show until the scroll height reaches this value | number | 400 | |

3
components/back-top/index.zh-CN.md
View File

@ -17,6 +17,7 @@ group: 其他
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/custom.tsx" iframe="400">自定义样式</code>
@ -27,7 +28,7 @@ group: 其他
> 自定义样式宽高不大于 40px \* 40px。
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ---------------- | ------------------------------------------------------------- | ----------------- | ------------ | ----- |
| --- | --- | --- | --- | --- |
| duration | 回到顶部所需时间（ms） | number | 450 | 4.4.0 |
| target | 设置需要监听其滚动事件的元素，值为一个返回对应 DOM 元素的函数 | () => HTMLElement | () => window | |
| visibilityHeight | 滚动高度达到此参数值才出现 BackTop | number | 400 | |

1
components/badge/index.en-US.md
View File

@ -15,6 +15,7 @@ Badge normally appears in proximity to notifications or user avatars with eye-ca
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/no-wrapper.tsx">Standalone</code>
<code src="./demo/overflow.tsx">Overflow Count</code>

1
components/badge/index.zh-CN.md
View File

@ -16,6 +16,7 @@ group: 数据展示
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/no-wrapper.tsx">独立使用</code>
<code src="./demo/overflow.tsx">封顶数字</code>

5
components/breadcrumb/index.en-US.md
View File

@ -47,6 +47,7 @@ return (
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic Usage</code>
<code src="./demo/withIcon.tsx">With an Icon</code>
<code src="./demo/react-router.tsx" iframe="200">react-router V6</code>
@ -59,7 +60,7 @@ return (
### Breadcrumb
| Property | Description | Type | Default | Version |
| ---------- | --------------------------------------- | ------------------------------------------- | ------- | ------- |
| --- | --- | --- | --- | --- |
| itemRender | Custom item renderer | (route, params, routes, paths) => ReactNode | - | |
| params | Routing parameters | object | - | |
| routes | The routing stack information of router | [routes\[\]](#routes) | - | |
@ -68,7 +69,7 @@ return (
### Breadcrumb.Item
| Property | Description | Type | Default | Version |
| ------------- | ------------------------------------- | ---------------------------------- | ------- | ------- |
| --- | --- | --- | --- | --- |
| className | The additional css class | string | - | |
| dropdownProps | The dropdown props | [Dropdown](/components/dropdown) | - | |
| href | Target of hyperlink | string | - | |

3
components/breadcrumb/index.zh-CN.md
View File

@ -48,6 +48,7 @@ return (
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/withIcon.tsx">带有图标的</code>
<code src="./demo/react-router.tsx" iframe="200">react-router V6</code>
@ -60,7 +61,7 @@ return (
### Breadcrumb
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ---------- | ---------------------------------------- | ------------------------------------------- | ------ | ---- |
| --- | --- | --- | --- | --- |
| itemRender | 自定义链接函数，和 react-router 配置使用 | (route, params, routes, paths) => ReactNode | - | |
| params | 路由的参数 | object | - | |
| routes | router 的路由栈信息 | [routes\[\]](#routes) | - | |

1
components/button/index.en-US.md
View File

@ -32,6 +32,7 @@ And 4 other properties additionally.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Type</code>
<code src="./demo/icon.tsx">Icon</code>
<code src="./demo/debug-icon.tsx" debug>Debug Icon</code>

1
components/button/index.zh-CN.md
View File

@ -35,6 +35,7 @@ group:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">按钮类型</code>
<code src="./demo/icon.tsx">图标按钮</code>
<code src="./demo/debug-icon.tsx" debug>调试图标按钮</code>

1
components/calendar/index.en-US.md
View File

@ -15,6 +15,7 @@ When data is in the form of dates, such as schedules, timetables, prices calenda
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/notice-calendar.tsx">Notice Calendar</code>
<code src="./demo/card.tsx">Card</code>

1
components/calendar/index.zh-CN.md
View File

@ -16,6 +16,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/notice-calendar.tsx">通知事项日历</code>
<code src="./demo/card.tsx">卡片模式</code>

5
components/card/index.en-US.md
View File

@ -15,6 +15,7 @@ A card can be used to display content related to a single subject. The content c
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic card</code>
<code src="./demo/border-less.tsx">No border</code>
<code src="./demo/simple.tsx">Simple card</code>
@ -57,7 +58,7 @@ A card can be used to display content related to a single subject. The content c
### Card.Grid
| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| --------- | ------------------------------- | ------------- | ------- | ------- |
| className | The className of container | string | - | |
| hoverable | Lift up when hovering card grid | boolean | true | |
| style | The style object of container | CSSProperties | - | |
@ -65,7 +66,7 @@ A card can be used to display content related to a single subject. The content c
### Card.Meta
| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| ----------- | ----------------------------- | ------------- | ------- | ------- |
| avatar | Avatar or icon | ReactNode | - | |
| className | The className of container | string | - | |
| description | Description content | ReactNode | - | |

5
components/card/index.zh-CN.md
View File

@ -16,6 +16,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">典型卡片</code>
<code src="./demo/border-less.tsx">无边框</code>
<code src="./demo/simple.tsx">简洁卡片</code>
@ -58,7 +59,7 @@ demo:
### Card.Grid
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| --------- | ---------------------- | ------------- | ------ | ---- |
| className | 网格容器类名 | string | - | |
| hoverable | 鼠标移过时可浮起 | boolean | true | |
| style | 定义网格容器类名的样式 | CSSProperties | - | |
@ -66,7 +67,7 @@ demo:
### Card.Meta
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| ----------- | ------------------ | ------------- | ------ | ---- |
| avatar | 头像/图标 | ReactNode | - | |
| className | 容器类名 | string | - | |
| description | 描述内容 | ReactNode | - | |

1
components/carousel/index.en-US.md
View File

@ -17,6 +17,7 @@ A carousel component. Scales with its container.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/position.tsx">Position</code>
<code src="./demo/autoplay.tsx">Scroll automatically</code>

3
components/carousel/index.zh-CN.md
View File

@ -18,6 +18,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/position.tsx">位置</code>
<code src="./demo/autoplay.tsx">自动切换</code>
@ -38,7 +39,7 @@ demo:
## 方法
| 名称 | 描述 |
| --- | --- |
| ------------------------------ | ------------------------------------------------- |
| goTo(slideNumber, dontAnimate) | 切换到指定面板, dontAnimate = true 时，不使用动画 |
| next() | 切换到下一面板 |
| prev() | 切换到上一面板 |

1
components/cascader/index.en-US.md
View File

@ -17,6 +17,7 @@ Cascade selection box.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/default-value.tsx">Default value</code>
<code src="./demo/custom-trigger.tsx">Custom trigger</code>

1
components/cascader/index.zh-CN.md
View File

@ -18,6 +18,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/default-value.tsx">默认值</code>
<code src="./demo/custom-trigger.tsx">可以自定义显示</code>

1
components/checkbox/index.en-US.md
View File

@ -16,6 +16,7 @@ Checkbox component.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/disabled.tsx">Disabled</code>
<code src="./demo/controller.tsx">Controlled Checkbox</code>

3
components/checkbox/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本用法</code>
<code src="./demo/disabled.tsx">不可用</code>
<code src="./demo/controller.tsx">受控的 Checkbox</code>
@ -43,7 +44,7 @@ demo:
#### Checkbox Group
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------ | ------------------------------------------------------------ | ----------------------------------- | ------ | ---- |
| --- | --- | --- | --- | --- |
| defaultValue | 默认选中的选项 | string\[] | \[] | |
| disabled | 整组失效 | boolean | false | |
| name | CheckboxGroup 下所有 `input[type="checkbox"]` 的 `name` 属性 | string | - | |

5
components/collapse/index.en-US.md
View File

@ -14,6 +14,7 @@ A content area which can be collapsed and expanded.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Collapse</code>
<code src="./demo/accordion.tsx">Accordion</code>
<code src="./demo/mix.tsx">Nested panel</code>
@ -29,7 +30,7 @@ A content area which can be collapsed and expanded.
### Collapse
| Property | Description | Type | Default | Version |
| -------------------- | ---------------------------------------------------------------------------------------- | --------------------------------------------- | ---------------------------------------------------------------------- | ------- |
| --- | --- | --- | --- | --- |
| accordion | If true, Collapse renders as Accordion | boolean | false | |
| activeKey | Key of the active panel | string\[] \| string <br/> number\[] \| number | No default value. In `accordion` mode, it's the key of the first panel | |
| bordered | Toggles rendering of the border around the collapse block | boolean | true | |
@ -44,7 +45,7 @@ A content area which can be collapsed and expanded.
### Collapse.Panel
| Property | Description | Type | Default | Version |
| ----------- | ------------------------------------------------------------------------------------- | -------------------------------- | ------- | -------------------- |
| --- | --- | --- | --- | --- |
| collapsible | Specify whether the panel be collapsible or the trigger area of collapsible | `header` \| `icon` \| `disabled` | - | 4.9.0 (icon: 4.24.0) |
| extra | The extra element in the corner | ReactNode | - | |
| forceRender | Forced render of content on panel, instead of lazy rendering after clicking on header | boolean | false | |

5
components/collapse/index.zh-CN.md
View File

@ -15,6 +15,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/IxH16B9RD/Collapse.svg
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">折叠面板</code>
<code src="./demo/accordion.tsx">手风琴</code>
<code src="./demo/mix.tsx">面板嵌套</code>
@ -30,7 +31,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/IxH16B9RD/Collapse.svg
### Collapse
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| -------------------- | ---------------------------------------- | --------------------------------------------- | -------------------------------------- | ------ |
| --- | --- | --- | --- | --- |
| accordion | 手风琴模式 | boolean | false | |
| activeKey | 当前激活 tab 面板的 key | string\[] \| string <br/> number\[] \| number | 默认无，accordion 模式下默认第一个元素 | |
| bordered | 带边框风格的折叠面板 | boolean | true | |
@ -45,7 +46,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/IxH16B9RD/Collapse.svg
### Collapse.Panel
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ----------- | ------------------------------------------------------------------ | -------------------------------- | ------ | -------------------- |
| --- | --- | --- | --- | --- |
| collapsible | 是否可折叠或指定可折叠触发区域 | `header` \| `icon` \| `disabled` | - | 4.9.0 (icon: 4.24.0) |
| extra | 自定义渲染每个面板右上角的内容 | ReactNode | - | |
| forceRender | 被隐藏时是否渲染 DOM 结构 | boolean | false | |

3
components/config-provider/index.en-US.md
View File

@ -35,6 +35,7 @@ Some components use dynamic style to support wave effect. You can config `csp` p
## Examples
<!-- prettier-ignore -->
<code src="./demo/locale.tsx">Locale</code>
<code src="./demo/direction.tsx">Direction</code>
<code src="./demo/size.tsx">Component size</code>
@ -44,7 +45,7 @@ Some components use dynamic style to support wave effect. You can config `csp` p
## API
| Property | Description | Type | Default | Version |
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------- | ------------------- | ------------------- |
| --- | --- | --- | --- | --- |
| autoInsertSpaceInButton | Set false to remove space between 2 chinese characters on Button | boolean | true | |
| componentDisabled | Config antd component `disabled` | boolean | - | 4.21.0 |
| componentSize | Config antd component size | `small` \| `middle` \| `large` | - | |

3
components/config-provider/index.zh-CN.md
View File

@ -36,6 +36,7 @@ export default () => (
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/locale.tsx">国际化</code>
<code src="./demo/direction.tsx">方向</code>
<code src="./demo/size.tsx">组件尺寸</code>
@ -45,7 +46,7 @@ export default () => (
## API
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------------------ | ---------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- | ------------------- | ---------------------------------- |
| --- | --- | --- | --- | --- |
| autoInsertSpaceInButton | 设置为 `false` 时，移除按钮中 2 个汉字之间的空格 | boolean | true | |
| componentDisabled | 设置 antd 组件禁用状态 | boolean | - | 4.21.0 |
| componentSize | 设置 antd 组件大小 | `small` \| `middle` \| `large` | - | |

15
components/date-picker/index.en-US.md
View File

@ -15,6 +15,7 @@ By clicking the input box, you can select a date from a popup calendar.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/range-picker.tsx">Range Picker</code>
<code src="./demo/switchable.tsx">Switchable picker</code>
@ -75,7 +76,7 @@ import locale from 'antd/locale/zh_CN';
The following APIs are shared by DatePicker, RangePicker.
| Property | Description | Type | Default | Version |
| ----------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------- | ---------------- |
| --- | --- | --- | --- | --- |
| allowClear | Whether to show clear button | boolean | true | |
| autoFocus | If get focus when component mounted | boolean | false | |
| bordered | Whether has border style | boolean | true | |
@ -116,7 +117,7 @@ The following APIs are shared by DatePicker, RangePicker.
### DatePicker
| Property | Description | Type | Default | Version |
| --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------- | -------------------------------------------------- | ------- |
| --- | --- | --- | --- | --- |
| defaultPickerValue | To set default picker date | [dayjs](https://day.js.org/) | - | |
| defaultValue | To set default date, if start time or end time is null or undefined, the date range will be an open interval | [dayjs](https://day.js.org/) | - | |
| disabledTime | To specify the time that cannot be selected | function(date) | - | |
@ -134,7 +135,7 @@ The following APIs are shared by DatePicker, RangePicker.
### DatePicker\[picker=year]
| Property | Description | Type | Default | Version |
| ------------------ | --------------------------------------------------------------------- | ----------------------------------------- | ------- | ------- |
| --- | --- | --- | --- | --- |
| defaultPickerValue | To set default picker date | [dayjs](https://day.js.org/) | - | |
| defaultValue | To set default date | [dayjs](https://day.js.org/) | - | |
| format | To set the date format, refer to [dayjs](https://day.js.org/) | string | `YYYY` | |
@ -147,7 +148,7 @@ The following APIs are shared by DatePicker, RangePicker.
Added in `4.1.0`.
| Property | Description | Type | Default | Version |
| ------------------ | --------------------------------------------------------------------- | ----------------------------------------- | ---------- | ------- |
| --- | --- | --- | --- | --- |
| defaultPickerValue | To set default picker date | [dayjs](https://day.js.org/) | - | |
| defaultValue | To set default date | [dayjs](https://day.js.org/) | - | |
| format | To set the date format, refer to [dayjs](https://day.js.org/) | string | `YYYY-\QQ` | |
@ -158,7 +159,7 @@ Added in `4.1.0`.
### DatePicker\[picker=month]
| Property | Description | Type | Default | Version |
| ------------------ | --------------------------------------------------------------------- | ----------------------------------------- | --------- | ------- |
| --- | --- | --- | --- | --- |
| defaultPickerValue | To set default picker date | [dayjs](https://day.js.org/) | - | |
| defaultValue | To set default date | [dayjs](https://day.js.org/) | - | |
| format | To set the date format, refer to [dayjs](https://day.js.org/) | string | `YYYY-MM` | |
@ -170,7 +171,7 @@ Added in `4.1.0`.
### DatePicker\[picker=week]
| Property | Description | Type | Default | Version |
| ------------------ | --------------------------------------------------------------------- | ----------------------------------------- | --------- | ------- |
| --- | --- | --- | --- | --- |
| defaultPickerValue | To set default picker date | [dayjs](https://day.js.org/) | - | |
| defaultValue | To set default date | [dayjs](https://day.js.org/) | - | |
| format | To set the date format, refer to [dayjs](https://day.js.org/) | string | `YYYY-wo` | |
@ -181,7 +182,7 @@ Added in `4.1.0`.
### RangePicker
| Property | Description | Type | Default | Version |
| --------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------ | -------------------------------------------------- | ------- |
| --- | --- | --- | --- | --- |
| allowEmpty | Allow start or end input leave empty | \[boolean, boolean] | \[false, false] | |
| dateRender | Customize date cell. `info` argument is added in 4.3.0 | function(currentDate: dayjs, today: dayjs, info: { range: `start` \| `end` }) => React.ReactNode | - | |
| defaultPickerValue | To set default picker date | \[[dayjs](https://day.js.org/), [dayjs](https://day.js.org/)] | - | |

15
components/date-picker/index.zh-CN.md
View File

@ -16,6 +16,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/range-picker.tsx">范围选择器</code>
<code src="./demo/switchable.tsx">切换不同的选择器</code>
@ -76,7 +77,7 @@ import locale from 'antd/locale/zh_CN';
以下 API 为 DatePicker、 RangePicker 共享的 API。
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | ---------------- |
| --- | --- | --- | --- | --- |
| allowClear | 是否显示清除按钮 | boolean | true | |
| autoFocus | 自动获取焦点 | boolean | false | |
| bordered | 是否有边框 | boolean | true | |
@ -117,7 +118,7 @@ import locale from 'antd/locale/zh_CN';
### DatePicker
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------- | -------------------------------------------------- | ----- |
| --- | --- | --- | --- | --- |
| defaultPickerValue | 默认面板日期 | [dayjs](https://day.js.org/) | - | |
| defaultValue | 默认日期，如果开始时间或结束时间为 `null` 或者 `undefined`，日期范围将是一个开区间 | [dayjs](https://day.js.org/) | - | |
| disabledTime | 不可选择的时间 | function(date) | - | |
@ -135,7 +136,7 @@ import locale from 'antd/locale/zh_CN';
### DatePicker\[picker=year]
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------------ | ----------------------------------------------------- | ----------------------------------------- | ------ | ---- |
| --- | --- | --- | --- | --- |
| defaultPickerValue | 默认面板日期 | [dayjs](https://day.js.org/) | - | |
| defaultValue | 默认日期 | [dayjs](https://day.js.org/) | - | |
| format | 展示的日期格式，配置参考 [dayjs](https://day.js.org/) | string | `YYYY` | |
@ -148,7 +149,7 @@ import locale from 'antd/locale/zh_CN';
`4.1.0` 新增。
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------------ | ----------------------------------------------------- | ----------------------------------------- | ---------- | ---- |
| --- | --- | --- | --- | --- |
| defaultPickerValue | 默认面板日期 | [dayjs](https://day.js.org/) | - | |
| defaultValue | 默认日期 | [dayjs](https://day.js.org/) | - | |
| format | 展示的日期格式，配置参考 [dayjs](https://day.js.org/) | string | `YYYY-\QQ` | |
@ -159,7 +160,7 @@ import locale from 'antd/locale/zh_CN';
### DatePicker\[picker=month]
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------------ | ----------------------------------------------------- | ----------------------------------------- | --------- | ---- |
| --- | --- | --- | --- | --- |
| defaultPickerValue | 默认面板日期 | [dayjs](https://day.js.org/) | - | |
| defaultValue | 默认日期 | [dayjs](https://day.js.org/) | - | |
| format | 展示的日期格式，配置参考 [dayjs](https://day.js.org/) | string | `YYYY-MM` | |
@ -171,7 +172,7 @@ import locale from 'antd/locale/zh_CN';
### DatePicker\[picker=week]
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------------ | ----------------------------------------------------- | ----------------------------------------- | --------- | ---- |
| --- | --- | --- | --- | --- |
| defaultPickerValue | 默认面板日期 | [dayjs](https://day.js.org/) | - | |
| defaultValue | 默认日期 | [dayjs](https://day.js.org/) | - | |
| format | 展示的日期格式，配置参考 [dayjs](https://day.js.org/) | string | `YYYY-wo` | |
@ -182,7 +183,7 @@ import locale from 'antd/locale/zh_CN';
### RangePicker
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --------------------- | ---------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------ | -------------------------------------------------- | ---- |
| --- | --- | --- | --- | --- |
| allowEmpty | 允许起始项部分为空 | \[boolean, boolean] | \[false, false] | |
| dateRender | 自定义日期单元格的内容。`info` 参数自 4.3.0 添加 | function(currentDate: dayjs, today: dayjs, info: { range: `start` \| `end` }) => React.ReactNode | - | |
| defaultPickerValue | 默认面板日期 | [dayjs](https://day.js.org/)\[] | - | |

1
components/descriptions/index.en-US.md
View File

@ -15,6 +15,7 @@ Commonly displayed on the details page.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/border.tsx">border</code>
<code src="./demo/text.tsx" debug>border</code>

3
components/descriptions/index.zh-CN.md
View File

@ -16,6 +16,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/border.tsx">带边框的</code>
<code src="./demo/text.tsx" debug>复杂文本的情况</code>
@ -44,7 +45,7 @@ demo:
### DescriptionItem
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| ------------ | -------------- | ------------- | ------ | ----- |
| contentStyle | 自定义内容样式 | CSSProperties | - | 4.9.0 |
| label | 内容的描述 | ReactNode | - | |
| labelStyle | 自定义标签样式 | CSSProperties | - | 4.9.0 |

1
components/divider/index.en-US.md
View File

@ -18,6 +18,7 @@ A divider line separates different content.
## Examples
<!-- prettier-ignore -->
<code src="./demo/horizontal.tsx">Horizontal</code>
<code src="./demo/with-text.tsx">Divider with title</code>
<code src="./demo/plain.tsx">Text without heading style</code>

1
components/divider/index.zh-CN.md
View File

@ -19,6 +19,7 @@ group:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/horizontal.tsx">水平分割线</code>
<code src="./demo/with-text.tsx">带文字的分割线</code>
<code src="./demo/plain.tsx">分割文字使用正文样式</code>

1
components/drawer/index.en-US.md
View File

@ -20,6 +20,7 @@ A Drawer is a panel that is typically overlaid on top of a page and slides in fr
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic-right.tsx">Basic</code>
<code src="./demo/placement.tsx">Custom Placement</code>
<code src="./demo/extra.tsx">Extra Actions</code>

1
components/drawer/index.zh-CN.md
View File

@ -19,6 +19,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic-right.tsx">基础抽屉</code>
<code src="./demo/placement.tsx">自定义位置</code>
<code src="./demo/extra.tsx">额外操作</code>

5
components/dropdown/index.en-US.md
View File

@ -45,6 +45,7 @@ return (
## Examples
<!-- prettier-ignore -->
<code src="./demo/deprecated.tsx">Basic usage (deprecated syntactic sugar)</code>
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/placement.tsx">Placement</code>
@ -68,7 +69,7 @@ return (
### Dropdown
| Property | Description | Type | Default | Version |
| ------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------- | ------------------- | ------- |
| --- | --- | --- | --- | --- |
| arrow | Whether the dropdown arrow should be visible | boolean \| { pointAtCenter: boolean } | false | |
| autoFocus | Focus element in `overlay` when opened | boolean | false | 4.21.0 |
| disabled | Whether the dropdown menu is disabled | boolean | - | |
@ -88,7 +89,7 @@ return (
Same props from Dropdown. And includes additional props:
| Property | Description | Type | Default | Version |
| ------------- | ------------------------------------------------------------------------------------------- | --------------------------------------- | --------- | ------- |
| --- | --- | --- | --- | --- |
| buttonsRender | Custom buttons inside Dropdown.Button | (buttons: ReactNode\[]) => ReactNode\[] | - | |
| loading | Set the loading status of button | boolean \| { delay: number } | false | |
| danger | Set the danger status of button | boolean | - | 4.23.0 |

5
components/dropdown/index.zh-CN.md
View File

@ -49,6 +49,7 @@ return (
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/deprecated.tsx">基础用法（废弃的语法糖）</code>
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/placement.tsx">弹出位置</code>
@ -72,7 +73,7 @@ return (
属性如下
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------- | ------------------- | ------ |
| --- | --- | --- | --- | --- |
| arrow | 下拉框箭头是否显示 | boolean \| { pointAtCenter: boolean } | false | |
| autoFocus | 打开后自动聚焦下拉框 | boolean | false | 4.21.0 |
| disabled | 菜单是否禁用 | boolean | - | |
@ -92,7 +93,7 @@ return (
属性与 Dropdown 的相同。还包含以下属性：
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------- | ------------------------------------------------------------- | --------------------------------------- | --------- | ------ |
| --- | --- | --- | --- | --- |
| buttonsRender | 自定义左右两个按钮 | (buttons: ReactNode\[]) => ReactNode\[] | - | |
| loading | 设置按钮载入状态 | boolean \| { delay: number } | false | |
| danger | 设置危险按钮 | boolean | - | 4.23.0 |

1
components/empty/index.en-US.md
View File

@ -16,6 +16,7 @@ Empty state placeholder.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/simple.tsx">Chose image</code>
<code src="./demo/customize.tsx">Customize</code>

1
components/empty/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/simple.tsx">选择图片</code>
<code src="./demo/customize.tsx">自定义</code>

7
components/float-button/index.en-US.md
View File

@ -16,6 +16,7 @@ FloatButton. Available since `5.0.0`.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx" iframe="360">Basic</code>
<code src="./demo/type.tsx" iframe="360">Type</code>
<code src="./demo/shape.tsx" iframe="360">Shape</code>
@ -31,7 +32,7 @@ FloatButton. Available since `5.0.0`.
### common API
| Property | Description | Type | Default | Version |
| ----------- | ----------------------------------------- | ---------------------------- | --------- | ------- |
| --- | --- | --- | --- | --- |
| icon | Set the icon component of button | ReactNode | - | |
| description | Text and other | ReactNode | - | |
| tooltip | The text shown in the tooltip | ReactNode \| () => ReactNode | | |
@ -44,7 +45,7 @@ FloatButton. Available since `5.0.0`.
### FloatButton.Group
| Property | Description | Type | Default | Version |
| ------------ | --------------------------------------------- | ----------------------- | -------- | ------- |
| --- | --- | --- | --- | --- |
| shape | Setting button shape of children | `circle` \| `square` | `circle` | |
| trigger | Which action can trigger menu open/close | `click` \| `hover` | - | |
| open | Whether the menu is visible or not | boolean | - | |
@ -53,7 +54,7 @@ FloatButton. Available since `5.0.0`.
### FloatButton.BackTop
| Property | Description | Type | Default | Version |
| ---------------- | --------------------------------------------------------------------------- | ----------------- | ------------ | ------- |
| --- | --- | --- | --- | --- |
| duration | Time to return to top（ms） | number | 450 | |
| target | Specifies the scrollable area dom node | () => HTMLElement | () => window | |
| visibilityHeight | The BackTop button will not show until the scroll height reaches this value | number | 400 | |

3
components/float-button/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx" iframe="360">基本</code>
<code src="./demo/type.tsx" iframe="360">类型</code>
<code src="./demo/shape.tsx" iframe="360">形状</code>
@ -32,7 +33,7 @@ demo:
### 共同的 API
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ----------- | ----------------------------------------------------- | ---------------------------- | --------- | ---- |
| --- | --- | --- | --- | --- |
| icon | 自定义图标 | ReactNode | - | |
| description | 文字及其它内容 | ReactNode | - | |
| tooltip | 气泡卡片的内容 | ReactNode \| () => ReactNode | - | |

1
components/form/index.en-US.md
View File

@ -16,6 +16,7 @@ High performance Form component with data scope management. Including data colle
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic Usage</code>
<code src="./demo/control-hooks.tsx">Form methods</code>
<code src="./demo/control-ref.tsx">Form methods (Class component)</code>

13
components/form/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本使用</code>
<code src="./demo/control-hooks.tsx">表单方法调用</code>
<code src="./demo/control-ref.tsx">表单方法调用（Class component）</code>
@ -57,7 +58,7 @@ demo:
### Form
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------------ | ------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------- | ------------ | ------ |
| --- | --- | --- | --- | --- |
| colon | 配置 Form.Item 的 `colon` 的默认值。表示是否显示 label 后面的冒号 (只有在属性 layout 为 horizontal 时有效) | boolean | true | |
| disabled | 设置表单组件禁用，仅对 antd 组件有效 | boolean | false | 4.21.0 |
| component | 设置 Form 渲染元素，为 `false` 则不创建 DOM 节点 | ComponentType \| false | form | |
@ -112,7 +113,7 @@ const validateMessages = {
表单字段组件，用于数据双向绑定、校验、布局等。
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ----------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------- | ---------- | ----------------- |
| --- | --- | --- | --- | --- |
| colon | 配合 `label` 属性使用，表示是否显示 `label` 后面的冒号 | boolean | true | |
| dependencies | 设置依赖字段，说明[见下](#dependencies) | [NamePath](#NamePath)\[] | - | |
| extra | 额外的提示信息，和 `help` 类似，当需要错误信息和提示文案同时出现时，可以使用这个。 | ReactNode | - | |
@ -208,7 +209,7 @@ Form 通过增量更新方式，只更新被修改的字段相关组件以达到
为字段提供数组化管理。
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------ | ---------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------- | ------ | ----- |
| --- | --- | --- | --- | --- |
| children | 渲染函数 | (fields: Field\[], operation: { add, remove, move }, meta: { errors }) => React.ReactNode | - | |
| initialValue | 设置子元素默认值，如果与 Form 的 `initialValues` 冲突则以 Form 为准 | any\[] | - | 4.9.0 |
| name | 字段名，支持数组 | [NamePath](#NamePath) | - | |
@ -251,7 +252,7 @@ Form.List 渲染表单相关操作函数。
提供表单间联动功能，其下设置 `name` 的 Form 更新时，会自动触发对应事件。查看[示例](#components-form-demo-form-context)。
| 参数 | 说明 | 类型 | 默认值 |
| ------------ | -------------------- | ---------------------------------------------------------- | ------ |
| --- | --- | --- | --- |
| onFormChange | 子表单字段更新时触发 | function(formName: string, info: { changedFields, forms }) | - |
| onFormFinish | 子表单提交时触发 | function(formName: string, info: { values, forms }) | - |
@ -271,7 +272,7 @@ Form.List 渲染表单相关操作函数。
### FormInstance
| 名称 | 说明 | 类型 | 版本 |
| ----------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------ |
| --- | --- | --- | --- |
| getFieldError | 获取对应字段名的错误信息 | (name: [NamePath](#NamePath)) => string\[] | |
| getFieldInstance | 获取对应字段实例 | (name: [NamePath](#NamePath)) => any | 4.4.0 |
| getFieldsError | 获取一组字段名对应的错误信息，返回为数组形式 | (nameList?: [NamePath](#NamePath)\[]) => FieldError\[] | |
@ -423,7 +424,7 @@ type Rule = RuleConfig | ((form: FormInstance) => RuleConfig);
```
| 名称 | 说明 | 类型 | 版本 |
| --------------- | ----------------------------------------------------------------------------------------------------------------------------------- | --------------------------------- | ------ |
| --- | --- | --- | --- |
| defaultField | 仅在 `type` 为 `array` 类型时有效，用于指定数组元素的校验规则 | [rule](#Rule) | |
| enum | 是否匹配枚举中的值（需要将 `type` 设置为 `enum`） | any\[] | |
| fields | 仅在 `type` 为 `array` 或 `object` 类型时有效，用于指定子元素的校验规则 | Record&lt;string, [rule](#Rule)> | |

5
components/grid/index.en-US.md
View File

@ -36,6 +36,7 @@ Layout uses a 24 grid layout to define the width of each "box", but does not rig
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic Grid</code>
<code src="./demo/gutter.tsx">Grid Gutter</code>
<code src="./demo/offset.tsx">Column offset</code>
@ -59,7 +60,7 @@ If the Ant Design grid layout component does not meet your needs, you can use th
### Row
| Property | Description | Type | Default | Version |
| -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------- | -------------- |
| --- | --- | --- | --- | --- |
| align | Vertical alignment | `top` \| `middle` \| `bottom` \| `stretch` \| `{[key in 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'xxl']: 'top' \| 'middle' \| 'bottom' \| 'stretch'}` | `top` | object: 4.24.0 |
| gutter | Spacing between grids, could be a number or a object like { xs: 8, sm: 16, md: 24}. Or you can use array to make horizontal and vertical spacing work at the same time `[horizontal, vertical]` | number \| object \| array | 0 | |
| justify | Horizontal arrangement | `start` \| `end` \| `center` \| `space-around` \| `space-between` \| `space-evenly` \| `{[key in 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'xxl']: 'start' \| 'end' \| 'center' \| 'space-around' \| 'space-between' \| 'space-evenly'}` | `start` | object: 4.24.0 |
@ -68,7 +69,7 @@ If the Ant Design grid layout component does not meet your needs, you can use th
### Col
| Property | Description | Type | Default | Version |
| -------- | ------------------------------------------------------------------------------------------------------ | ---------------- | ------- | ------- |
| --- | --- | --- | --- | --- |
| flex | Flex layout style | string \| number | - | |
| offset | The number of cells to offset Col from the left | number | 0 | |
| order | Raster order | number | 0 | |

5
components/grid/index.zh-CN.md
View File

@ -35,6 +35,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基础栅格</code>
<code src="./demo/gutter.tsx">区块间隔</code>
<code src="./demo/offset.tsx">左右偏移</code>
@ -58,7 +59,7 @@ Ant Design 的布局组件若不能满足你的需求，你也可以直接使用
### Row
| 成员 | 说明 | 类型 | 默认值 | 版本 |
| ------- | -------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------- | -------------- |
| --- | --- | --- | --- | --- |
| align | 垂直对齐方式 | `top` \| `middle` \| `bottom` \| `stretch` \| `{[key in 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'xxl']: 'top' \| 'middle' \| 'bottom' \| 'stretch'}` | `top` | object: 4.24.0 |
| gutter | 栅格间隔，可以写成像素值或支持响应式的对象写法来设置水平间隔 { xs: 8, sm: 16, md: 24}。或者使用数组形式同时设置 `[水平间距, 垂直间距]` | number \| object \| array | 0 | |
| justify | 水平排列方式 | `start` \| `end` \| `center` \| `space-around` \| `space-between` \| `space-evenly` \| `{[key in 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'xxl']: 'start' \| 'end' \| 'center' \| 'space-around' \| 'space-between' \| 'space-evenly'}` | `start` | object: 4.24.0 |
@ -67,7 +68,7 @@ Ant Design 的布局组件若不能满足你的需求，你也可以直接使用
### Col
| 成员 | 说明 | 类型 | 默认值 | 版本 |
| ------ | -------------------------------------------------------------- | ---------------- | ------ | ---- |
| --- | --- | --- | --- | --- |
| flex | flex 布局属性 | string \| number | - | |
| offset | 栅格左侧的间隔格数，间隔内不可以有栅格 | number | 0 | |
| order | 栅格顺序 | number | 0 | |

1
components/icon/index.en-US.md
View File

@ -20,6 +20,7 @@ npm install --save @ant-design/icons
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/two-tone.tsx">Two-tone icon and colorful icon</code>
<code src="./demo/custom.tsx">Custom Icon</code>

3
components/icon/index.zh-CN.md
View File

@ -25,6 +25,7 @@ npm install --save @ant-design/icons
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本用法</code>
<code src="./demo/two-tone.tsx">多色图标</code>
<code src="./demo/custom.tsx">自定义图标</code>
@ -156,7 +157,7 @@ ReactDOM.render(<Icon component={MessageSvg} />, mountNode);
`Icon` 中的 `component` 组件的接受的属性如下：
| 字段 | 说明 | 类型 | 只读值 | 版本 |
| --- | --- | --- | --- | --- |
| --------- | ----------------------- | ---------------- | -------------- | ---- |
| className | 计算后的 `svg` 类名 | string | - | |
| fill | `svg` 元素填充的颜色 | string | `currentColor` | |
| height | `svg` 元素高度 | string \| number | `1em` | |

1
components/image/index.en-US.md
View File

@ -15,6 +15,7 @@ Previewable image.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic Usage</code>
<code src="./demo/fallback.tsx">Fault tolerant</code>
<code src="./demo/placeholder.tsx">Progressive Loading</code>

1
components/image/index.zh-CN.md
View File

@ -16,6 +16,7 @@ cover: https://gw.alipayobjects.com/zos/antfincdn/D1dXz9PZqa/image.svg
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本用法</code>
<code src="./demo/fallback.tsx">容错处理</code>
<code src="./demo/placeholder.tsx">渐进加载</code>

1
components/input-number/index.en-US.md
View File

@ -15,6 +15,7 @@ When a numeric value needs to be provided.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/size.tsx">Sizes</code>
<code src="./demo/addon.tsx">Pre / Post tab</code>

1
components/input-number/index.zh-CN.md
View File

@ -16,6 +16,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/size.tsx">三种大小</code>
<code src="./demo/addon.tsx">前置/后置标签</code>

15
components/input/index.en-US.md
View File

@ -16,6 +16,7 @@ A basic widget for getting the user input is a text field. Keyboard and mouse ca
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic usage</code>
<code src="./demo/size.tsx">Three sizes of Input</code>
<code src="./demo/addon.tsx">Pre / Post tab</code>
@ -43,7 +44,7 @@ A basic widget for getting the user input is a text field. Keyboard and mouse ca
### Input
| Property | Description | Type | Default | Version |
| ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------- | ------- | ------------------------- |
| --- | --- | --- | --- | --- |
| addonAfter | The label text displayed after (on the right side of) the input field | ReactNode | - | |
| addonBefore | The label text displayed before (on the left side of) the input field | ReactNode | - | |
| allowClear | If allow to remove input content with clear icon | boolean \| { clearIcon: ReactNode } | false | |
@ -69,7 +70,7 @@ The rest of the props of Input are exactly the same as the original [input](http
### Input.TextArea
| Property | Description | Type | Default | Version |
| ------------ | -------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------ | ------- | ------------------------------------------ |
| --- | --- | --- | --- | --- |
| allowClear | If allow to remove input content with clear icon | boolean | false | |
| autoSize | Height autosize feature, can be set to true \| false or an object { minRows: 2, maxRows: 6 } | boolean \| object | false | |
| bordered | Whether has border style | boolean | true | 4.5.0 |
@ -85,7 +86,7 @@ The rest of the props of `Input.TextArea` are the same as the original [textarea
#### Input.Search
| Property | Description | Type | Default |
| ----------- | -------------------------------------------------------------------------------------------------------- | ---------------------- | ------- |
| --- | --- | --- | --- |
| enterButton | Whether to show an enter button after input. This property conflicts with the `addonAfter` property | boolean \| ReactNode | false |
| loading | Search box with loading | boolean | false |
| onSearch | The callback function triggered when you click on the search-icon, the clear-icon or press the Enter key | function(value, event) | - |
@ -95,7 +96,7 @@ Supports all props of `Input`.
#### Input.Group
| Property | Description | Type | Default |
| -------- | ----------------------------------------------------------------------------------------------------------------- | ------- | --------- |
| --- | --- | --- | --- |
| compact | Whether use compact style | boolean | false |
| size | The size of `Input.Group` specifies the size of the included `Input` fields. Available: `large` `default` `small` | string | `default` |
@ -109,21 +110,21 @@ Supports all props of `Input`.
#### Input.Password
| Property | Description | Type | Default | Version |
| ---------------- | ------------------------------------------------------ | ------------------------------------------------ | ------------------------------------------------------------------------- | ------- |
| --- | --- | --- | --- | --- |
| iconRender | Custom toggle button | (visible) => ReactNode | (visible) => (visible ? &lt;EyeOutlined /> : &lt;EyeInvisibleOutlined />) | 4.3.0 |
| visibilityToggle | Whether show toggle button or control password visible | boolean \| [VisibilityToggle](#VisibilityToggle) | true | |
#### VisibilityToggle
| Property | Description | Type | Default | Version |
| --------------- | ------------------------------------------------------------ | ------- | ------- | ------- |
| --- | --- | --- | --- | --- |
| visible | Whether the password is show or hide | boolean | false | 4.24.0 |
| onVisibleChange | Callback executed when visibility of the password is changed | boolean | - | 4.24.0 |
#### Input Methods
| Name | Description | Parameters | Version |
| ----- | ------------ | -------------------------------------------------------------------------- | --------------- |
| --- | --- | --- | --- |
| blur | Remove focus | - | |
| focus | Get focus | (option?: { preventScroll?: boolean, cursor?: 'start' \| 'end' \| 'all' }) | option - 4.10.0 |

13
components/input/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本使用</code>
<code src="./demo/size.tsx">三种大小</code>
<code src="./demo/addon.tsx">前置/后置标签</code>
@ -44,7 +45,7 @@ demo:
### Input
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------- | ------ | ------------------------- |
| --- | --- | --- | --- | --- |
| addonAfter | 带标签的 input，设置后置标签 | ReactNode | - | |
| addonBefore | 带标签的 input，设置前置标签 | ReactNode | - | |
| allowClear | 可以点击清除图标删除内容 | boolean \| { clearIcon: ReactNode } | - | |
@ -70,7 +71,7 @@ Input 的其他属性和 React 自带的 [input](https://reactjs.org/docs/dom-el
### Input.TextArea
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------ | ------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------ | ------ | ------------------------------------------ |
| --- | --- | --- | --- | --- |
| allowClear | 可以点击清除图标删除内容 | boolean | false | |
| autoSize | 自适应内容高度，可设置为 true \| false 或对象：{ minRows: 2, maxRows: 6 } | boolean \| object | false | |
| bordered | 是否有边框 | boolean | true | 4.5.0 |
@ -86,7 +87,7 @@ Input 的其他属性和 React 自带的 [input](https://reactjs.org/docs/dom-el
#### Input.Search
| 参数 | 说明 | 类型 | 默认值 |
| ----------- | -------------------------------------------------------------- | ---------------------- | ------ |
| --- | --- | --- | --- |
| enterButton | 是否有确认按钮，可设为按钮文字。该属性会与 `addonAfter` 冲突。 | boolean \| ReactNode | false |
| loading | 搜索 loading | boolean | false |
| onSearch | 点击搜索图标、清除图标，或按下回车键时的回调 | function(value, event) | - |
@ -96,7 +97,7 @@ Input 的其他属性和 React 自带的 [input](https://reactjs.org/docs/dom-el
#### Input.Group
| 参数 | 说明 | 类型 | 默认值 |
| ------- | --------------------------------------------------------------------- | ------- | --------- |
| --- | --- | --- | --- |
| compact | 是否用紧凑模式 | boolean | false |
| size | `Input.Group` 中所有的 `Input` 的大小，可选 `large` `default` `small` | string | `default` |
@ -110,7 +111,7 @@ Input 的其他属性和 React 自带的 [input](https://reactjs.org/docs/dom-el
#### Input.Password
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ---------------- | -------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------- | ----- |
| --- | --- | --- | --- | --- |
| iconRender | 自定义切换按钮 | (visible) => ReactNode | (visible) => (visible ? &lt;EyeOutlined /> : &lt;EyeInvisibleOutlined />) | 4.3.0 |
| visibilityToggle | 是否显示切换按钮或者控制密码显隐 | boolean \| [VisibilityToggle](#VisibilityToggle) | true | |
@ -124,7 +125,7 @@ Input 的其他属性和 React 自带的 [input](https://reactjs.org/docs/dom-el
#### Input Methods
| 名称 | 说明 | 参数 | 版本 |
| ----- | -------- | -------------------------------------------------------------------------- | --------------- |
| --- | --- | --- | --- |
| blur | 取消焦点 | - | |
| focus | 获取焦点 | (option?: { preventScroll?: boolean, cursor?: 'start' \| 'end' \| 'all' }) | option - 4.10.0 |

5
components/layout/index.en-US.md
View File

@ -57,6 +57,7 @@ Style of a navigation should conform to its level.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic Structure</code>
<code src="./demo/top.tsx">Header-Content-Footer</code>
<code src="./demo/top-side-2.tsx">Header Sider 2</code>
@ -87,7 +88,7 @@ Style of a navigation should conform to its level.
The wrapper.
| Property | Description | Type | Default |
| --------- | --------------------------------------------------------------------------------------------------------- | ------------- | ------- |
| --- | --- | --- | --- |
| className | Container className | string | - |
| hasSider | Whether contain Sider in children, don't have to assign it normally. Useful in ssr avoid style flickering | boolean | - |
| style | To customize the styles | CSSProperties | - |
@ -97,7 +98,7 @@ The wrapper.
The sidebar.
| Property | Description | Type | Default |
| --------------------- | ------------------------------------------------------------------------------------------- | --------------------------------------------- | ------- |
| --- | --- | --- | --- |
| breakpoint | [Breakpoints](/components/grid/#Col) of the responsive layout | `xs` \| `sm` \| `md` \| `lg` \| `xl` \| `xxl` | - |
| className | Container className | string | - |
| collapsed | To set the current status | boolean | - |

5
components/layout/index.zh-CN.md
View File

@ -58,6 +58,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/hzEndUVEx/Layout.svg
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本结构</code>
<code src="./demo/top.tsx">上中下布局</code>
<code src="./demo/top-side-2.tsx">顶部-侧边布局-通栏</code>
@ -88,7 +89,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/hzEndUVEx/Layout.svg
布局容器。
| 参数 | 说明 | 类型 | 默认值 |
| --------- | ------------------------------------------------------------------ | ------------- | ------ |
| --- | --- | --- | --- |
| className | 容器 className | string | - |
| hasSider | 表示子元素里有 Sider，一般不用指定。可用于服务端渲染时避免样式闪动 | boolean | - |
| style | 指定样式 | CSSProperties | - |
@ -98,7 +99,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/hzEndUVEx/Layout.svg
侧边栏。
| 参数 | 说明 | 类型 | 默认值 |
| --------------------- | -------------------------------------------------------------------- | --------------------------------------------- | ------ |
| --- | --- | --- | --- |
| breakpoint | 触发响应式布局的[断点](/components/grid/#Col) | `xs` \| `sm` \| `md` \| `lg` \| `xl` \| `xxl` | - |
| className | 容器 className | string | - |
| collapsed | 当前收起状态 | boolean | - |

1
components/list/index.en-US.md
View File

@ -15,6 +15,7 @@ A list can be used to display content related to a single subject. The content c
## Examples
<!-- prettier-ignore -->
<code src="./demo/simple.tsx">Simple list</code>
<code src="./demo/basic.tsx">Basic list</code>
<code src="./demo/loadmore.tsx">Load more</code>

1
components/list/index.zh-CN.md
View File

@ -16,6 +16,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/simple.tsx">简单列表</code>
<code src="./demo/basic.tsx">基础列表</code>
<code src="./demo/loadmore.tsx">加载更多</code>

1
components/mentions/index.en-US.md
View File

@ -15,6 +15,7 @@ When you need to mention someone or something.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/async.tsx">Asynchronous loading</code>
<code src="./demo/form.tsx">With Form</code>

1
components/mentions/index.zh-CN.md
View File

@ -16,6 +16,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本使用</code>
<code src="./demo/async.tsx">异步加载</code>
<code src="./demo/form.tsx">配合 Form 使用</code>

5
components/menu/index.en-US.md
View File

@ -49,6 +49,7 @@ The legacy demo code for version `<4.20.0` could be found at [https://github.com
## Examples
<!-- prettier-ignore -->
<code src="./demo/deprecated.tsx">Basic usage (deprecated syntactic sugar)</code>
<code src="./demo/horizontal.tsx">Top Navigation</code>
<code src="./demo/inline.tsx">Inline menu</code>
@ -66,7 +67,7 @@ The legacy demo code for version `<4.20.0` could be found at [https://github.com
### Menu
| Param | Description | Type | Default value | Version |
| -------------------- | ---------------------------------------------------------------- | -------------------------------------------------------------------------- | ---------------------- | ------- |
| --- | --- | --- | --- | --- |
| defaultOpenKeys | Array with the keys of default opened sub menus | string\[] | - | |
| defaultSelectedKeys | Array with the keys of default selected menu items | string\[] | - | |
| expandIcon | custom expand icon of submenu | ReactNode \| `(props: SubMenuProps & { isSubMenu: boolean }) => ReactNode` | - | 4.9.0 |
@ -129,7 +130,7 @@ The legacy demo code for version `<4.20.0` could be found at [https://github.com
#### SubMenuType
| Param | Description | Type | Default value | Version |
| -------------- | ---------------------------------------------------------- | --------------------------- | ----------------- | ------- | --- |
| --- | --- | --- | --- | --- | --- |
| children | Sub-menus or sub-menu items | [ItemType\[\]](#ItemType) | - | |
| disabled | Whether sub-menu is disabled | boolean | false | |
| icon | Icon of sub menu | ReactNode | - | |

5
components/menu/index.zh-CN.md
View File

@ -50,6 +50,7 @@ return <Menu items={items} />;
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/deprecated.tsx">基础用法（废弃的语法糖）</code>
<code src="./demo/horizontal.tsx">顶部导航</code>
<code src="./demo/inline.tsx">内嵌菜单</code>
@ -67,7 +68,7 @@ return <Menu items={items} />;
### Menu
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| -------------------- | ---------------------------------------------- | -------------------------------------------------------------------------- | ---------------------- | ------ |
| --- | --- | --- | --- | --- |
| defaultOpenKeys | 初始展开的 SubMenu 菜单项 key 数组 | string\[] | - | |
| defaultSelectedKeys | 初始选中的菜单项 key 数组 | string\[] | - | |
| expandIcon | 自定义展开图标 | ReactNode \| `(props: SubMenuProps & { isSubMenu: boolean }) => ReactNode` | - | 4.9.0 |
@ -130,7 +131,7 @@ return <Menu items={items} />;
#### SubMenuType
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| -------------- | ------------------------------------ | --------------------------- | ------ | ---- |
| --- | --- | --- | --- | --- |
| children | 子菜单的菜单项 | [ItemType\[\]](#ItemType) | - | |
| disabled | 是否禁用 | boolean | false | |
| icon | 菜单图标 | ReactNode | - | |

3
components/message/index.en-US.md
View File

@ -17,6 +17,7 @@ Display global messages as feedback in response to user operations.
## Examples
<!-- prettier-ignore -->
<code src="./demo/hooks.tsx">Hooks usage (recommended)</code>
<code src="./demo/other.tsx">Other types of message</code>
<code src="./demo/duration.tsx">Customize duration</code>
@ -134,4 +135,4 @@ return (
### How to set static methods prefixCls ？
You can config with [`ConfigProvider.config`](/components/config-provider/#ConfigProvider.config()-4.13.0+)
You can config with [`ConfigProvider.config`](</components/config-provider/#ConfigProvider.config()-4.13.0+>)

5
components/message/index.zh-CN.md
View File

@ -18,6 +18,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/hooks.tsx">Hooks 调用（推荐）</code>
<code src="./demo/other.tsx">其他提示类型</code>
<code src="./demo/duration.tsx">修改延时</code>
@ -40,7 +41,7 @@ demo:
- `message.loading(content, [duration], onClose)`
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| -------- | ------------------------------------------- | ------------------- | ------ |
| content | 提示内容 | ReactNode \| config | - |
| duration | 自动关闭的延时，单位秒。设为 0 时不自动关闭 | number | 3 |
| onClose | 关闭时触发的回调函数 | function | - |
@ -135,4 +136,4 @@ return (
### 静态方法如何设置 prefixCls ？
你可以通过 [`ConfigProvider.config`](/components/config-provider/#ConfigProvider.config()-4.13.0+) 进行设置。
你可以通过 [`ConfigProvider.config`](</components/config-provider/#ConfigProvider.config()-4.13.0+>) 进行设置。

5
components/modal/index.en-US.md
View File

@ -15,6 +15,7 @@ When requiring users to interact with the application, but without jumping to a
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/async.tsx">Asynchronously close</code>
<code src="./demo/footer.tsx">Customized Footer</code>
@ -35,7 +36,7 @@ When requiring users to interact with the application, but without jumping to a
## API
| Property | Description | Type | Default | Version |
| ---------------------- | ---------------------------------------------------------------------------------------------------------- | ------------------------------------------------------ | ----------------------- | ------- |
| --- | --- | --- | --- | --- |
| afterClose | Specify a function that will be called when modal is closed completely | function | - | |
| bodyStyle | Body style for modal body element. Such as height, padding etc | CSSProperties | | |
| cancelButtonProps | The cancel button props | [ButtonProps](/components/button/#API) | - | |
@ -85,7 +86,7 @@ There are five ways to display the information based on the content's nature:
The items listed above are all functions, expecting a settings object as parameter. The properties of the object are follows:
| Property | Description | Type | Default | Version |
| ----------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------ | --------------------- | ------- |
| --- | --- | --- | --- | --- |
| afterClose | Specify a function that will be called when modal is closed completely | function | - | 4.9.0 |
| autoFocusButton | Specify which button to autofocus | null \| `ok` \| `cancel` | `ok` | |
| bodyStyle | Body style for modal body element. Such as height, padding etc | CSSProperties | | 4.8.0 |

5
components/modal/index.zh-CN.md
View File

@ -18,6 +18,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/async.tsx">异步关闭</code>
<code src="./demo/footer.tsx">自定义页脚</code>
@ -38,7 +39,7 @@ demo:
## API
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ---------------------- | ----------------------------------------------------------------- | ------------------------------------------------------ | -------------------- | ----- |
| --- | --- | --- | --- | --- |
| afterClose | Modal 完全关闭后的回调 | function | - | |
| bodyStyle | Modal body 样式 | CSSProperties | | |
| cancelButtonProps | cancel 按钮 props | [ButtonProps](/components/button/#API) | - | |
@ -88,7 +89,7 @@ demo:
以上均为一个函数，参数为 object，具体属性如下：
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ----------------- | ---------------------------------------------------------------- | ------------------------------------------------------ | --------------------- | ------ |
| --- | --- | --- | --- | --- |
| afterClose | Modal 完全关闭后的回调 | function | - | 4.9.0 |
| autoFocusButton | 指定自动获得焦点的按钮 | null \| `ok` \| `cancel` | `ok` | |
| bodyStyle | Modal body 样式 | CSSProperties | | 4.8.0 |

1
components/notification/index.en-US.md
View File

@ -20,6 +20,7 @@ To display a notification message at any of the four corners of the viewport. Ty
## Examples
<!-- prettier-ignore -->
<code src="./demo/hooks.tsx">Hooks usage (recommended)</code>
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/duration.tsx">Duration after which the notification box is closed</code>

1
components/notification/index.zh-CN.md
View File

@ -21,6 +21,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/hooks.tsx">Hooks 调用（推荐）</code>
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/duration.tsx">自动关闭的延时</code>

1
components/pagination/index.en-US.md
View File

@ -16,6 +16,7 @@ A long list can be divided into several pages using `Pagination`, and only one p
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/more.tsx">More</code>
<code src="./demo/changer.tsx">Changer</code>

1
components/pagination/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/more.tsx">更多</code>
<code src="./demo/changer.tsx">改变</code>

1
components/popconfirm/index.en-US.md
View File

@ -17,6 +17,7 @@ The difference with the `confirm` modal dialog is that it's more lightweight tha
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/locale.tsx">Locale text</code>
<code src="./demo/placement.tsx">Placement</code>

1
components/popconfirm/index.zh-CN.md
View File

@ -18,6 +18,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/locale.tsx">国际化</code>
<code src="./demo/placement.tsx">位置</code>

3
components/popover/index.en-US.md
View File

@ -17,6 +17,7 @@ Comparing with `Tooltip`, besides information `Popover` card can also provide ac
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/triggerType.tsx">Three ways to trigger</code>
<code src="./demo/placement.tsx">Placement</code>
@ -28,7 +29,7 @@ Comparing with `Tooltip`, besides information `Popover` card can also provide ac
## API
| Param | Description | Type | Default value | Version |
| --- | --- | --- | --- | --- |
| ------- | ------------------- | ---------------------------- | ------------- | ------- |
| content | Content of the card | ReactNode \| () => ReactNode | - | |
| title | Title of the card | ReactNode \| () => ReactNode | - | |

3
components/popover/index.zh-CN.md
View File

@ -18,6 +18,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/triggerType.tsx">三种触发方式</code>
<code src="./demo/placement.tsx">位置</code>
@ -29,7 +30,7 @@ demo:
## API
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| ------- | -------- | ---------------------------- | ------ | ---- |
| content | 卡片内容 | ReactNode \| () => ReactNode | - | |
| title | 卡片标题 | ReactNode \| () => ReactNode | - | |

9
components/progress/index.en-US.md
View File

@ -18,6 +18,7 @@ If it will take a long time to complete an operation, you can use `Progress` to
## Examples
<!-- prettier-ignore -->
<code src="./demo/line.tsx">Progress bar</code>
<code src="./demo/circle.tsx">Circular progress bar</code>
<code src="./demo/line-mini.tsx">Mini size progress bar</code>
@ -37,7 +38,7 @@ If it will take a long time to complete an operation, you can use `Progress` to
Properties that shared by all types.
| Property | Description | Type | Default |
| ------------- | ---------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ | -------------------------- |
| --- | --- | --- | --- |
| format | The template function of the content | function(percent, successPercent) | (percent) => percent + `%` |
| percent | To set the completion percentage | number | 0 |
| showInfo | Whether to display the progress value and the status icon | boolean | true |
@ -51,7 +52,7 @@ Properties that shared by all types.
### `type="line"`
| Property | Description | Type | Default | Version |
| ----------- | --------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- | ------- | ------------------ |
| --- | --- | --- | --- | --- |
| steps | The total step count | number | - | - |
| strokeColor | The color of progress bar, render `linear-gradient` when passing an object, could accept `string[]` when has `steps`. | string \| string[] \| { from: string; to: string; direction: string } | - | 4.21.0: `string[]` |
| strokeWidth | To set the width of the progress bar, unit: `px` | number | 10 | - |
@ -59,7 +60,7 @@ Properties that shared by all types.
### `type="circle"`
| Property | Description | Type | Default |
| ----------- | ------------------------------------------------------------------------------- | ---------------- | ------- |
| --- | --- | --- | --- |
| strokeColor | The color of circular progress, render `linear-gradient` when passing an object | string \| object | - |
| strokeWidth | To set the width of the circular progress, unit: percentage of the canvas width | number | 6 |
| width | To set the canvas width of the circular progress, unit: `px` | number | 132 |
@ -67,7 +68,7 @@ Properties that shared by all types.
### `type="dashboard"`
| Property | Description | Type | Default |
| ----------- | -------------------------------------------------------------------------------- | ------ | -------- |
| --- | --- | --- | --- |
| gapDegree | The gap degree of half circle, 0 ~ 295 | number | 75 |
| gapPosition | The gap position, options: `top` `bottom` `left` `right` | string | `bottom` |
| strokeWidth | To set the width of the dashboard progress, unit: percentage of the canvas width | number | 6 |

7
components/progress/index.zh-CN.md
View File

@ -19,6 +19,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/line.tsx">进度条</code>
<code src="./demo/circle.tsx">进度圈</code>
<code src="./demo/line-mini.tsx">小型进度条</code>
@ -38,7 +39,7 @@ demo:
各类型共用的属性。
| 属性 | 说明 | 类型 | 默认值 |
| ------------- | -------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------- | -------------------------- |
| --- | --- | --- | --- |
| format | 内容的模板函数 | function(percent, successPercent) | (percent) => percent + `%` |
| percent | 百分比 | number | 0 |
| showInfo | 是否显示进度数值或状态图标 | boolean | true |
@ -52,7 +53,7 @@ demo:
### `type="line"`
| 属性 | 说明 | 类型 | 默认值 | 版本 |
| ----------- | --------------------------------------------------------------------- | --------------------------------------------------------------------- | ------ | ------------------ |
| --- | --- | --- | --- | --- |
| steps | 进度条总共步数 | number | - | - |
| strokeColor | 进度条的色彩，传入 object 时为渐变。当有 `steps` 时支持传入一个数组。 | string \| string[] \| { from: string; to: string; direction: string } | - | 4.21.0: `string[]` |
| strokeWidth | 进度条线的宽度，单位 px | number | 10 | - |
@ -68,7 +69,7 @@ demo:
### `type="dashboard"`
| 属性 | 说明 | 类型 | 默认值 |
| ----------- | -------------------------------------------------- | -------------------------------------- | -------- |
| --- | --- | --- | --- |
| gapDegree | 仪表盘进度条缺口角度，可取值 0 ~ 295 | number | 75 |
| gapPosition | 仪表盘进度条缺口位置 | `top` \| `bottom` \| `left` \| `right` | `bottom` |
| strokeWidth | 仪表盘进度条线的宽度，单位是进度条画布宽度的百分比 | number | 6 |

1
components/radio/index.en-US.md
View File

@ -16,6 +16,7 @@ Radio.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/disabled.tsx">disabled</code>
<code src="./demo/radiogroup.tsx">Radio Group</code>

1
components/radio/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/disabled.tsx">不可用</code>
<code src="./demo/radiogroup.tsx">单选组合</code>

3
components/rate/index.en-US.md
View File

@ -16,6 +16,7 @@ Rate component.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/half.tsx">Half star</code>
<code src="./demo/text.tsx">Show copywriting</code>
@ -48,6 +49,6 @@ Rate component.
## Methods
| Name | Description |
| --- | --- |
| ------- | ------------ |
| blur() | Remove focus |
| focus() | Get focus |

3
components/rate/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/half.tsx">半星</code>
<code src="./demo/text.tsx">文案展现</code>
@ -49,6 +50,6 @@ demo:
## 方法
| 名称 | 描述 |
| --- | --- |
| ------- | -------- |
| blur() | 移除焦点 |
| focus() | 获取焦点 |

1
components/result/index.en-US.md
View File

@ -15,6 +15,7 @@ Use when important operations need to inform the user to process the results and
## Examples
<!-- prettier-ignore -->
<code src="./demo/success.tsx">Success</code>
<code src="./demo/info.tsx">Info</code>
<code src="./demo/warning.tsx">Warning</code>

1
components/result/index.zh-CN.md
View File

@ -16,6 +16,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/success.tsx">Success</code>
<code src="./demo/info.tsx">Info</code>
<code src="./demo/warning.tsx">Warning</code>

1
components/segmented/index.en-US.md
View File

@ -16,6 +16,7 @@ Segmented Controls. This component is available since `antd@4.20.0`.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/block.tsx">Block Segmented</code>
<code src="./demo/disabled.tsx">Basic</code>

1
components/segmented/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/block.tsx">Block 分段选择器</code>
<code src="./demo/disabled.tsx">不可用</code>

3
components/select/index.en-US.md
View File

@ -16,6 +16,7 @@ Select component to select value from options.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic Usage</code>
<code src="./demo/search.tsx">Select with search field</code>
<code src="./demo/multiple.tsx">multiple selection</code>
@ -52,7 +53,7 @@ Select component to select value from options.
### Select props
| Property | Description | Type | Default | Version |
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- | ------------------------------------------------------ | ---------------- |
| --- | --- | --- | --- | --- |
| allowClear | Show clear button | boolean | false | |
| autoClearSearchValue | Whether the current search will be cleared on selecting an item. Only applies when `mode` is set to `multiple` or `tags` | boolean | true | |
| autoFocus | Get focus by default | boolean | false | |

3
components/select/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本使用</code>
<code src="./demo/search.tsx">带搜索框</code>
<code src="./demo/multiple.tsx">多选</code>
@ -53,7 +54,7 @@ demo:
### Select props
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- | ------------------------------------------------------ | ---------------- |
| --- | --- | --- | --- | --- |
| allowClear | 支持清除 | boolean | false | |
| autoClearSearchValue | 是否在选中项后清空搜索框，只在 `mode` 为 `multiple` 或 `tags` 时有效 | boolean | true | |
| autoFocus | 默认获取焦点 | boolean | false | |

1
components/skeleton/index.en-US.md
View File

@ -18,6 +18,7 @@ Provide a placeholder while you wait for content to load, or to visualise conten
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/complex.tsx">Complex combination</code>
<code src="./demo/active.tsx">Active Animation</code>

1
components/skeleton/index.zh-CN.md
View File

@ -19,6 +19,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/complex.tsx">复杂的组合</code>
<code src="./demo/active.tsx">动画效果</code>

1
components/slider/index.en-US.md
View File

@ -15,6 +15,7 @@ To input a value in a range.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/input-number.tsx">Slider with InputNumber</code>
<code src="./demo/icon-slider.tsx">Slider with icon</code>

1
components/slider/index.zh-CN.md
View File

@ -16,6 +16,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/input-number.tsx">带输入框的滑块</code>
<code src="./demo/icon-slider.tsx">带 icon 的滑块</code>

5
components/space/index.en-US.md
View File

@ -16,6 +16,7 @@ Set components spacing.
## Examples
<!-- prettier-ignore -->
<code src="./demo/base.tsx">Basic Usage</code>
<code src="./demo/vertical.tsx">Vertical Space</code>
<code src="./demo/size.tsx">Space Size</code>
@ -34,7 +35,7 @@ Set components spacing.
## API
| Property | Description | Type | Default | Version |
| --------- | ------------------------------------------- | ---------------------------------------- | ------------ | --------------------- |
| --- | --- | --- | --- | --- |
| align | Align items | `start` \| `end` \|`center` \|`baseline` | - | 4.2.0 |
| direction | The space direction | `vertical` \| `horizontal` | `horizontal` | 4.1.0 |
| size | The space size | [Size](#Size) \| [Size\[\]](#Size) | `small` | 4.1.0 \| Array: 4.9.0 |
@ -59,7 +60,7 @@ Use Space.Compact when child form components are compactly connected and the bor
- TreeSelect
| Property | Description | Type | Default | Version |
| --------- | ------------------------------------------ | ------------------------------ | ------------ | ------- |
| --- | --- | --- | --- | --- |
| block | Option to fit width to its parent\'s width | boolean | false | 4.24.0 |
| direction | Set direction of layout | `vertical` \| `horizontal` | `horizontal` | 4.24.0 |
| size | Set child component size | `large` \| `middle` \| `small` | `middle` | 4.24.0 |

5
components/space/index.zh-CN.md
View File

@ -20,6 +20,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/base.tsx">基本用法</code>
<code src="./demo/vertical.tsx">垂直间距</code>
<code src="./demo/size.tsx">间距大小</code>
@ -40,7 +41,7 @@ demo:
### Space
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --------- | -------------------------------------- | ---------------------------------------- | ------------ | --------------------- |
| --- | --- | --- | --- | --- |
| align | 对齐方式 | `start` \| `end` \|`center` \|`baseline` | - | 4.2.0 |
| direction | 间距方向 | `vertical` \| `horizontal` | `horizontal` | 4.1.0 |
| size | 间距大小 | [Size](#Size) \| [Size\[\]](#Size) | `small` | 4.1.0 \| Array: 4.9.0 |
@ -67,7 +68,7 @@ demo:
- TreeSelect
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --------- | ---------------------------- | ------------------------------ | ------------ | ------ |
| --- | --- | --- | --- | --- |
| block | 将宽度调整为父元素宽度的选项 | boolean | false | 4.24.0 |
| direction | 指定排列方向 | `vertical` \| `horizontal` | `horizontal` | 4.24.0 |
| size | 子组件大小 | `large` \| `middle` \| `small` | `middle` | 4.24.0 |

1
components/spin/index.en-US.md
View File

@ -15,6 +15,7 @@ When part of the page is waiting for asynchronous data or during a rendering pro
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">basic Usage</code>
<code src="./demo/size.tsx">Size</code>
<code src="./demo/inside.tsx">Inside a container</code>

3
components/spin/index.zh-CN.md
View File

@ -16,6 +16,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本用法</code>
<code src="./demo/size.tsx">各种大小</code>
<code src="./demo/inside.tsx">容器</code>
@ -27,7 +28,7 @@ demo:
## API
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| ---------------- | -------------------------------------------- | ------------- | --------- |
| delay | 延迟显示加载效果的时间（防止闪烁） | number (毫秒) | - |
| indicator | 加载指示符 | ReactNode | - |
| size | 组件大小，可选值为 `small` `default` `large` | string | `default` |

1
components/statistic/index.en-US.md
View File

@ -16,6 +16,7 @@ Display statistic number.
## Examples
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">Basic</code>
<code src="./demo/unit.tsx">Unit</code>
<code src="./demo/card.tsx">In Card</code>

1
components/statistic/index.zh-CN.md
View File

@ -17,6 +17,7 @@ demo:
## 代码演示
<!-- prettier-ignore -->
<code src="./demo/basic.tsx">基本</code>
<code src="./demo/unit.tsx">单位</code>
<code src="./demo/card.tsx">在卡片中使用</code>

7
components/steps/index.en-US.md
View File

@ -30,6 +30,7 @@ return <Steps items={items} />;
## Examples
<!-- prettier-ignore -->
<code src="./demo/deprecated.tsx">Basic (deprecated syntactic sugar)</code>
<code src="./demo/simple.tsx">Basic</code>
<code src="./demo/small-size.tsx">Mini version</code>
@ -56,7 +57,7 @@ return <Steps items={items} />;
The whole of the step bar.
| Property | Description | Type | Default | Version |
| -------------- | ------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------- | ------------ | ----------- |
| --- | --- | --- | --- | --- |
| className | Additional class to Steps | string | - | |
| current | To set the current step, counting from 0. You can overwrite this state by using `status` of `Step` | number | 0 | |
| direction | To specify the direction of the step bar, `horizontal` or `vertical` | string | `horizontal` | |
@ -74,7 +75,7 @@ The whole of the step bar.
### `type="inline"`
| Property | Description | Type | Default | Version |
| --------- | ------------------------------------------------------------------------------------------------------------------- | --------------------- | --------- | ------- |
| --- | --- | --- | --- | --- |
| className | Additional class to Steps | string | - | |
| current | To set the current step, counting from 0. You can overwrite this state by using `status` of `Step` | number | 0 | |
| initial | Set the initial step, counting from 0 | number | 0 | |
@ -87,7 +88,7 @@ The whole of the step bar.
A single step in the step bar.
| Property | Description | Type | Default | Version |
| ----------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- | --------- | ------- | ------- |
| --- | --- | --- | --- | --- |
| description | Description of the step, optional property | ReactNode | - | |
| disabled | Disable click | boolean | false | |
| icon | Icon of the step, optional property | ReactNode | - | |

Some files were not shown because too many files have changed in this diff Show More