mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 02:59:58 +08:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

docs(modal): use Record<SemanticDOM> instead of classnames/styles type (#50330)

Browse Source
This commit is contained in:
thinkasany 2024-08-09 17:04:34 +08:00 committed by GitHub
parent 7085ab39d0
commit 2fba70d33f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 10 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/modal/demo/_semantic.tsx
View File

@ -9,7 +9,7 @@ const locales = {
cn: {
mask: '遮罩层元素',
wrapper: '包裹层元素，一般用于动画容器',
content: 'Drawer 容器元素',
content: 'Modal 容器元素',
header: '头部元素',
body: '内容元素',
footer: '底部元素',
@ -17,7 +17,7 @@ const locales = {
en: {
mask: 'Mask element',
wrapper: 'Wrapper element. Used for motion container',
content: 'Drawer container element',
content: 'Modal container element',
header: 'Header element',
body: 'Body element',
footer: 'Footer element',
@ -57,6 +57,8 @@ const App: React.FC = () => {
<SemanticPreview
semantics={[
{ name: 'mask', desc: locale.mask, version: '5.13.0' },
{ name: 'content', desc: locale.content, version: '5.13.0' },
{ name: 'wrapper', desc: locale.wrapper, version: '5.13.0' },
{ name: 'header', desc: locale.header, version: '5.13.0' },
{ name: 'body', desc: locale.body, version: '5.13.0' },
{ name: 'footer', desc: locale.footer, version: '5.13.0' },

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

@ -48,8 +48,8 @@ Common props ref：[Common props](/docs/react/common-props)
| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| afterClose | Specify a function that will be called when modal is closed completely | function | - | |
| classNames | Config Modal build-in module's className | `header?: string; body?: string; footer?: string; mask?: string; content?: string; wrapper?: string;` | - | |
| styles | Config Modal build-in module's style | `header?: CSSProperties; body?: CSSProperties; footer?: CSSProperties; mask?: CSSProperties; content?: CSSProperties; wrapper?: CSSProperties;` | - | 5.10.0 |
| classNames | Config Modal build-in module's className | [Record<SemanticDOM, string>](#semantic-dom) | - | |
| styles | Config Modal build-in module's style | [Record<SemanticDOM, CSSProperties>](#semantic-dom) | - | 5.10.0 |
| cancelButtonProps | The cancel button props | [ButtonProps](/components/button/#api) | - | |
| cancelText | Text of the Cancel button | ReactNode | `Cancel` | |
| centered | Centered Modal | boolean | false | |
@ -192,7 +192,7 @@ const confirmed = await modal.confirm({ ... });
| originNode | default node | React.ReactNode | - |
| extra | extended options | { OkBtn: FC; CancelBtn: FC } | - |
### `styles` and `classNames` attribute
## Semantic DOM
<code src="./demo/_semantic.tsx" simplify="true"></code>

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

@ -49,8 +49,8 @@ demo:
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| afterClose | Modal 完全关闭后的回调 | function | - | |
| classNames | 配置弹窗内置模块的 className | `header?: string; body?: string; footer?: string; mask?: string; content?: string; wrapper?: string;` | - | |
| styles | 配置弹窗内置模块的 style | `header?: CSSProperties; body?: CSSProperties; footer?: CSSProperties; mask?: CSSProperties; content?: CSSProperties; wrapper?: CSSProperties;` | - | 5.10.0 |
| classNames | 配置弹窗内置模块的 className | [Record<SemanticDOM, string>](#semantic-dom) | - | |
| styles | 配置弹窗内置模块的 style | [Record<SemanticDOM, CSSProperties>](#semantic-dom) | - | 5.10.0 |
| cancelButtonProps | cancel 按钮 props | [ButtonProps](/components/button-cn#api) | - | |
| cancelText | 取消按钮文字 | ReactNode | `取消` | |
| centered | 垂直居中展示 Modal | boolean | false | |
@ -193,7 +193,7 @@ const confirmed = await modal.confirm({ ... });
| originNode | 默认节点 | React.ReactNode | - |
| extra | 扩展选项 | { OkBtn: FC; CancelBtn: FC } | - |
### `styles` and `classNames` 属性
## Semantic DOM
<code src="./demo/_semantic.tsx" simplify="true"></code>