diff --git a/.antd-tools.config.js b/.antd-tools.config.js index 6e13477744..2764d150f1 100644 --- a/.antd-tools.config.js +++ b/.antd-tools.config.js @@ -34,7 +34,7 @@ function finalizeCompile() { let componentsLessContent = ''; // Build components in one file: lib/style/components.less fs.readdir(componentsPath, (err, files) => { - files.forEach((file) => { + files.forEach(file => { if (fs.existsSync(path.join(componentsPath, file, 'style', 'index.less'))) { componentsLessContent += `@import "../${path.join(file, 'style', 'index.less')}";\n`; } diff --git a/.depslintrc.js b/.depslintrc.js index e6f0f4488a..b599f5e773 100644 --- a/.depslintrc.js +++ b/.depslintrc.js @@ -11,8 +11,8 @@ module.exports = { ], modulePattern: [ { - pattern: /ConfigConsumer.*renderEmpty/sm, + pattern: /ConfigConsumer.*renderEmpty/ms, module: '../empty', }, ], -}; \ No newline at end of file +}; diff --git a/.eslintrc.js b/.eslintrc.js index 3f0a87c580..73c422cc7d 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -1,9 +1,5 @@ const eslintrc = { - extends: [ - 'airbnb', - 'prettier', - 'plugin:jest/recommended', - ], + extends: ['airbnb', 'prettier', 'plugin:jest/recommended'], env: { browser: true, node: true, @@ -12,12 +8,7 @@ const eslintrc = { es6: true, }, parser: 'babel-eslint', - plugins: [ - 'markdown', - 'react', - 'babel', - 'jest', - ], + plugins: ['markdown', 'react', 'babel', 'jest'], rules: { 'react/jsx-one-expression-per-line': 0, 'react/prop-types': 0, diff --git a/.github/ISSUE_TEMPLATE/----please-use-new-issue-ant-design---.md b/.github/ISSUE_TEMPLATE/----please-use-new-issue-ant-design---.md index 43410e957e..c03c5fde3c 100644 --- a/.github/ISSUE_TEMPLATE/----please-use-new-issue-ant-design---.md +++ b/.github/ISSUE_TEMPLATE/----please-use-new-issue-ant-design---.md @@ -1,9 +1,7 @@ --- -name: "⚠️ Please use new-issue.ant.design ⚠️" -about: The issue which is not created via http://new-issue.ant.design will be closed - immediately. -labels: - +name: '⚠️ Please use new-issue.ant.design ⚠️' +about: The issue which is not created via http://new-issue.ant.design will be closed immediately. +labels: --- The issue which is not created via http://new-issue.ant.design will be closed immediately. diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md index 1a6bb98ce3..217dc2ba66 100644 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -7,6 +7,7 @@ Please makes sure that these form are filled before submitting your pull request [[中文版模板 / Chinese template](https://github.com/ant-design/ant-design/blob/master/.github/PULL_REQUEST_TEMPLATE/pr_cn.md)] --> + ### 🤔 This is a ... - [ ] New feature diff --git a/.github/PULL_REQUEST_TEMPLATE/pr_cn.md b/.github/PULL_REQUEST_TEMPLATE/pr_cn.md index b6a3cef430..86630f71bb 100644 --- a/.github/PULL_REQUEST_TEMPLATE/pr_cn.md +++ b/.github/PULL_REQUEST_TEMPLATE/pr_cn.md @@ -7,6 +7,7 @@ [[English Template / 英文模板](?expand=1)] --> + ### 🤔 这个变动的性质是？ - [ ] 新特性提交 diff --git a/.prettierrc b/.prettierrc index 3dc446bfad..84d393d19b 100644 --- a/.prettierrc +++ b/.prettierrc @@ -11,4 +11,4 @@ } } ] -} \ No newline at end of file +} diff --git a/.remarkrc.js b/.remarkrc.js index 505e5ef689..b4d85871eb 100644 --- a/.remarkrc.js +++ b/.remarkrc.js @@ -1,8 +1,5 @@ const config = { - plugins: [ - 'remark-preset-lint-recommended', - ['remark-lint-list-item-indent', 'space'], - ], + plugins: ['remark-preset-lint-recommended', ['remark-lint-list-item-indent', 'space']], }; module.exports = config; diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md index 5f26d3a452..d1df64ec91 100644 --- a/CODE_OF_CONDUCT.md +++ b/CODE_OF_CONDUCT.md @@ -8,19 +8,19 @@ In the interest of fostering an open and welcoming environment, we as contributo Examples of behavior that contributes to creating a positive environment include: -* Using welcoming and inclusive language -* Being respectful of differing viewpoints and experiences -* Gracefully accepting constructive criticism -* Focusing on what is best for the community -* Showing empathy towards other community members +- Using welcoming and inclusive language +- Being respectful of differing viewpoints and experiences +- Gracefully accepting constructive criticism +- Focusing on what is best for the community +- Showing empathy towards other community members Examples of unacceptable behavior by participants include: -* The use of sexualized language or imagery and unwelcome sexual attention or advances -* Trolling, insulting/derogatory comments, and personal or political attacks -* Public or private harassment -* Publishing others' private information, such as a physical or electronic address, without explicit permission -* Other conduct which could reasonably be considered inappropriate in a professional setting +- The use of sexualized language or imagery and unwelcome sexual attention or advances +- Trolling, insulting/derogatory comments, and personal or political attacks +- Public or private harassment +- Publishing others' private information, such as a physical or electronic address, without explicit permission +- Other conduct which could reasonably be considered inappropriate in a professional setting ## Our Responsibilities diff --git a/README-zh_CN.md b/README-zh_CN.md index 4b0a17a7cc..26d63302da 100644 --- a/README-zh_CN.md +++ b/README-zh_CN.md @@ -10,21 +10,11 @@ 一套企业级的 UI 设计语言和 React 实现。 -[![Build Status](https://dev.azure.com/ant-design/ant-design/_apis/build/status/ant-design.ant-design?branchName=master)](https://dev.azure.com/ant-design/ant-design/_build/latest?definitionId=2?branchName=master) -[![CircleCI branch](https://img.shields.io/circleci/project/github/ant-design/ant-design/master.svg?style=flat-square)](https://circleci.com/gh/ant-design/ant-design) -[![Codecov](https://img.shields.io/codecov/c/github/ant-design/ant-design/master.svg?style=flat-square)](https://codecov.io/gh/ant-design/ant-design/branch/master) -[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd) -[![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](http://npmjs.com/antd) +[![Build Status](https://dev.azure.com/ant-design/ant-design/_apis/build/status/ant-design.ant-design?branchName=master)](https://dev.azure.com/ant-design/ant-design/_build/latest?definitionId=2?branchName=master) [![CircleCI branch](https://img.shields.io/circleci/project/github/ant-design/ant-design/master.svg?style=flat-square)](https://circleci.com/gh/ant-design/ant-design) [![Codecov](https://img.shields.io/codecov/c/github/ant-design/ant-design/master.svg?style=flat-square)](https://codecov.io/gh/ant-design/ant-design/branch/master) [![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd) [![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](http://npmjs.com/antd) -[![Dependencies](https://img.shields.io/david/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design) -[![DevDependencies](https://img.shields.io/david/dev/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design?type=dev) -[![Total alerts](https://flat.badgen.net/lgtm/alerts/g/ant-design/ant-design)](https://lgtm.com/projects/g/ant-design/ant-design/alerts/) -[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fant-design%2Fant-design.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2Fant-design%2Fant-design?ref=badge_shield) -[![Issues need help](https://flat.badgen.net/github/label-issues/ant-design/ant-design/help%20wanted/open)](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22) +[![Dependencies](https://img.shields.io/david/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design) [![DevDependencies](https://img.shields.io/david/dev/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design?type=dev) [![Total alerts](https://flat.badgen.net/lgtm/alerts/g/ant-design/ant-design)](https://lgtm.com/projects/g/ant-design/ant-design/alerts/) [![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fant-design%2Fant-design.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2Fant-design%2Fant-design?ref=badge_shield) [![Issues need help](https://flat.badgen.net/github/label-issues/ant-design/ant-design/help%20wanted/open)](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22) -[![](https://img.shields.io/twitter/follow/AntDesignUI.svg?label=Ant%20Design&style=social)](https://twitter.com/AntDesignUI) -[![Gitter](https://img.shields.io/gitter/room/ant-design/ant-design-english.svg?style=flat-square&logoWidth=20&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjEyMzUiIGhlaWdodD0iNjUwIiB2aWV3Qm94PSIwIDAgNzQxMCAzOTAwIj4NCjxyZWN0IHdpZHRoPSI3NDEwIiBoZWlnaHQ9IjM5MDAiIGZpbGw9IiNiMjIyMzQiLz4NCjxwYXRoIGQ9Ik0wLDQ1MEg3NDEwbTAsNjAwSDBtMCw2MDBINzQxMG0wLDYwMEgwbTAsNjAwSDc0MTBtMCw2MDBIMCIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjMwMCIvPg0KPHJlY3Qgd2lkdGg9IjI5NjQiIGhlaWdodD0iMjEwMCIgZmlsbD0iIzNjM2I2ZSIvPg0KPGcgZmlsbD0iI2ZmZiI%2BDQo8ZyBpZD0iczE4Ij4NCjxnIGlkPSJzOSI%2BDQo8ZyBpZD0iczUiPg0KPGcgaWQ9InM0Ij4NCjxwYXRoIGlkPSJzIiBkPSJNMjQ3LDkwIDMxNy41MzQyMzAsMzA3LjA4MjAzOSAxMzIuODczMjE4LDE3Mi45MTc5NjFIMzYxLjEyNjc4MkwxNzYuNDY1NzcwLDMwNy4wODIwMzl6Ii8%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzIiB5PSI0MjAiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3MiIHk9Ijg0MCIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgeT0iMTI2MCIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjcyIgeT0iMTY4MCIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjczQiIHg9IjI0NyIgeT0iMjEwIi8%2BDQo8L2c%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzOSIgeD0iNDk0Ii8%2BDQo8L2c%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzMTgiIHg9Ijk4OCIvPg0KPHVzZSB4bGluazpocmVmPSIjczkiIHg9IjE5NzYiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3M1IiB4PSIyNDcwIi8%2BDQo8L2c%2BDQo8L3N2Zz4%3D)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) -[![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square&logoWidth=20&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjkwMCIgaGVpZ2h0PSI2MDAiIHZpZXdCb3g9IjAgMCAzMCAyMCI%2BDQo8ZGVmcz4NCjxwYXRoIGlkPSJzIiBkPSJNMCwtMSAwLjU4Nzc4NSwwLjgwOTAxNyAtMC45NTEwNTcsLTAuMzA5MDE3SDAuOTUxMDU3TC0wLjU4Nzc4NSwwLjgwOTAxN3oiIGZpbGw9IiNmZmRlMDAiLz4NCjwvZGVmcz4NCjxyZWN0IHdpZHRoPSIzMCIgaGVpZ2h0PSIyMCIgZmlsbD0iI2RlMjkxMCIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNSw1KSBzY2FsZSgzKSIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAsMikgcm90YXRlKDIzLjAzNjI0MykiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3MiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyLDQpIHJvdGF0ZSg0NS44Njk4OTgpIi8%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMiw3KSByb3RhdGUoNjkuOTQ1Mzk2KSIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAsOSkgcm90YXRlKDIwLjY1OTgwOCkiLz4NCjwvc3ZnPg%3D%3D)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) +[![](https://img.shields.io/twitter/follow/AntDesignUI.svg?label=Ant%20Design&style=social)](https://twitter.com/AntDesignUI) [![Gitter](https://img.shields.io/gitter/room/ant-design/ant-design-english.svg?style=flat-square&logoWidth=20&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjEyMzUiIGhlaWdodD0iNjUwIiB2aWV3Qm94PSIwIDAgNzQxMCAzOTAwIj4NCjxyZWN0IHdpZHRoPSI3NDEwIiBoZWlnaHQ9IjM5MDAiIGZpbGw9IiNiMjIyMzQiLz4NCjxwYXRoIGQ9Ik0wLDQ1MEg3NDEwbTAsNjAwSDBtMCw2MDBINzQxMG0wLDYwMEgwbTAsNjAwSDc0MTBtMCw2MDBIMCIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjMwMCIvPg0KPHJlY3Qgd2lkdGg9IjI5NjQiIGhlaWdodD0iMjEwMCIgZmlsbD0iIzNjM2I2ZSIvPg0KPGcgZmlsbD0iI2ZmZiI%2BDQo8ZyBpZD0iczE4Ij4NCjxnIGlkPSJzOSI%2BDQo8ZyBpZD0iczUiPg0KPGcgaWQ9InM0Ij4NCjxwYXRoIGlkPSJzIiBkPSJNMjQ3LDkwIDMxNy41MzQyMzAsMzA3LjA4MjAzOSAxMzIuODczMjE4LDE3Mi45MTc5NjFIMzYxLjEyNjc4MkwxNzYuNDY1NzcwLDMwNy4wODIwMzl6Ii8%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzIiB5PSI0MjAiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3MiIHk9Ijg0MCIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgeT0iMTI2MCIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjcyIgeT0iMTY4MCIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjczQiIHg9IjI0NyIgeT0iMjEwIi8%2BDQo8L2c%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzOSIgeD0iNDk0Ii8%2BDQo8L2c%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzMTgiIHg9Ijk4OCIvPg0KPHVzZSB4bGluazpocmVmPSIjczkiIHg9IjE5NzYiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3M1IiB4PSIyNDcwIi8%2BDQo8L2c%2BDQo8L3N2Zz4%3D)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) [![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square&logoWidth=20&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjkwMCIgaGVpZ2h0PSI2MDAiIHZpZXdCb3g9IjAgMCAzMCAyMCI%2BDQo8ZGVmcz4NCjxwYXRoIGlkPSJzIiBkPSJNMCwtMSAwLjU4Nzc4NSwwLjgwOTAxNyAtMC45NTEwNTcsLTAuMzA5MDE3SDAuOTUxMDU3TC0wLjU4Nzc4NSwwLjgwOTAxN3oiIGZpbGw9IiNmZmRlMDAiLz4NCjwvZGVmcz4NCjxyZWN0IHdpZHRoPSIzMCIgaGVpZ2h0PSIyMCIgZmlsbD0iI2RlMjkxMCIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNSw1KSBzY2FsZSgzKSIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAsMikgcm90YXRlKDIzLjAzNjI0MykiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3MiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyLDQpIHJvdGF0ZSg0NS44Njk4OTgpIi8%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMiw3KSByb3RhdGUoNjkuOTQ1Mzk2KSIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAsOSkgcm90YXRlKDIwLjY1OTgwOCkiLz4NCjwvc3ZnPg%3D%3D)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) @@ -41,13 +31,13 @@ ## 🖥 支持环境 -* 现代浏览器和 IE9 及以上。 -* 支持服务端渲染。 -* [Electron](http://electron.atom.io/) +- 现代浏览器和 IE9 及以上。 +- 支持服务端渲染。 +- [Electron](http://electron.atom.io/) | [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | [Opera](http://godban.github.io/browsers-support-badges/)
Opera | [Electron](http://godban.github.io/browsers-support-badges/)
Electron | -| --------- | --------- | --------- | --------- | --------- | --------- | -| IE9, IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions| last 2 versions +| --- | --- | --- | --- | --- | --- | +| IE9, IE10, IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions | last 2 versions | ## 📦 安装 @@ -69,7 +59,7 @@ ReactDOM.render(, mountNode); 引入样式： ```jsx -import 'antd/dist/antd.css'; // or 'antd/dist/antd.less' +import 'antd/dist/antd.css'; // or 'antd/dist/antd.less' ``` 你也可以 [按需加载组件](https://ant.design/docs/react/getting-started-cn#按需加载)。 diff --git a/README.md b/README.md index 149972c10c..b4c6b6b334 100644 --- a/README.md +++ b/README.md @@ -10,21 +10,11 @@ An enterprise-class UI design language and React implementation. -[![Build Status](https://dev.azure.com/ant-design/ant-design/_apis/build/status/ant-design.ant-design?branchName=master)](https://dev.azure.com/ant-design/ant-design/_build/latest?definitionId=2?branchName=master) -[![CircleCI branch](https://img.shields.io/circleci/project/github/ant-design/ant-design/master.svg?style=flat-square)](https://circleci.com/gh/ant-design/ant-design) -[![Codecov](https://img.shields.io/codecov/c/github/ant-design/ant-design/master.svg?style=flat-square)](https://codecov.io/gh/ant-design/ant-design/branch/master) -[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd) -[![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](http://npmjs.com/antd) +[![Build Status](https://dev.azure.com/ant-design/ant-design/_apis/build/status/ant-design.ant-design?branchName=master)](https://dev.azure.com/ant-design/ant-design/_build/latest?definitionId=2?branchName=master) [![CircleCI branch](https://img.shields.io/circleci/project/github/ant-design/ant-design/master.svg?style=flat-square)](https://circleci.com/gh/ant-design/ant-design) [![Codecov](https://img.shields.io/codecov/c/github/ant-design/ant-design/master.svg?style=flat-square)](https://codecov.io/gh/ant-design/ant-design/branch/master) [![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd) [![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](http://npmjs.com/antd) -[![Dependencies](https://img.shields.io/david/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design) -[![DevDependencies](https://img.shields.io/david/dev/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design?type=dev) -[![Total alerts](https://flat.badgen.net/lgtm/alerts/g/ant-design/ant-design)](https://lgtm.com/projects/g/ant-design/ant-design/alerts/) -[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fant-design%2Fant-design.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2Fant-design%2Fant-design?ref=badge_shield) -[![Issues need help](https://flat.badgen.net/github/label-issues/ant-design/ant-design/help%20wanted/open)](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22) +[![Dependencies](https://img.shields.io/david/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design) [![DevDependencies](https://img.shields.io/david/dev/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design?type=dev) [![Total alerts](https://flat.badgen.net/lgtm/alerts/g/ant-design/ant-design)](https://lgtm.com/projects/g/ant-design/ant-design/alerts/) [![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fant-design%2Fant-design.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2Fant-design%2Fant-design?ref=badge_shield) [![Issues need help](https://flat.badgen.net/github/label-issues/ant-design/ant-design/help%20wanted/open)](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22) -[![](https://img.shields.io/twitter/follow/AntDesignUI.svg?label=Ant%20Design&style=social)](https://twitter.com/AntDesignUI) -[![Gitter](https://img.shields.io/gitter/room/ant-design/ant-design-english.svg?style=flat-square&logoWidth=20&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjEyMzUiIGhlaWdodD0iNjUwIiB2aWV3Qm94PSIwIDAgNzQxMCAzOTAwIj4NCjxyZWN0IHdpZHRoPSI3NDEwIiBoZWlnaHQ9IjM5MDAiIGZpbGw9IiNiMjIyMzQiLz4NCjxwYXRoIGQ9Ik0wLDQ1MEg3NDEwbTAsNjAwSDBtMCw2MDBINzQxMG0wLDYwMEgwbTAsNjAwSDc0MTBtMCw2MDBIMCIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjMwMCIvPg0KPHJlY3Qgd2lkdGg9IjI5NjQiIGhlaWdodD0iMjEwMCIgZmlsbD0iIzNjM2I2ZSIvPg0KPGcgZmlsbD0iI2ZmZiI%2BDQo8ZyBpZD0iczE4Ij4NCjxnIGlkPSJzOSI%2BDQo8ZyBpZD0iczUiPg0KPGcgaWQ9InM0Ij4NCjxwYXRoIGlkPSJzIiBkPSJNMjQ3LDkwIDMxNy41MzQyMzAsMzA3LjA4MjAzOSAxMzIuODczMjE4LDE3Mi45MTc5NjFIMzYxLjEyNjc4MkwxNzYuNDY1NzcwLDMwNy4wODIwMzl6Ii8%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzIiB5PSI0MjAiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3MiIHk9Ijg0MCIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgeT0iMTI2MCIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjcyIgeT0iMTY4MCIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjczQiIHg9IjI0NyIgeT0iMjEwIi8%2BDQo8L2c%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzOSIgeD0iNDk0Ii8%2BDQo8L2c%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzMTgiIHg9Ijk4OCIvPg0KPHVzZSB4bGluazpocmVmPSIjczkiIHg9IjE5NzYiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3M1IiB4PSIyNDcwIi8%2BDQo8L2c%2BDQo8L3N2Zz4%3D)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) -[![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square&logoWidth=20&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjkwMCIgaGVpZ2h0PSI2MDAiIHZpZXdCb3g9IjAgMCAzMCAyMCI%2BDQo8ZGVmcz4NCjxwYXRoIGlkPSJzIiBkPSJNMCwtMSAwLjU4Nzc4NSwwLjgwOTAxNyAtMC45NTEwNTcsLTAuMzA5MDE3SDAuOTUxMDU3TC0wLjU4Nzc4NSwwLjgwOTAxN3oiIGZpbGw9IiNmZmRlMDAiLz4NCjwvZGVmcz4NCjxyZWN0IHdpZHRoPSIzMCIgaGVpZ2h0PSIyMCIgZmlsbD0iI2RlMjkxMCIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNSw1KSBzY2FsZSgzKSIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAsMikgcm90YXRlKDIzLjAzNjI0MykiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3MiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyLDQpIHJvdGF0ZSg0NS44Njk4OTgpIi8%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMiw3KSByb3RhdGUoNjkuOTQ1Mzk2KSIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAsOSkgcm90YXRlKDIwLjY1OTgwOCkiLz4NCjwvc3ZnPg%3D%3D)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) +[![](https://img.shields.io/twitter/follow/AntDesignUI.svg?label=Ant%20Design&style=social)](https://twitter.com/AntDesignUI) [![Gitter](https://img.shields.io/gitter/room/ant-design/ant-design-english.svg?style=flat-square&logoWidth=20&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjEyMzUiIGhlaWdodD0iNjUwIiB2aWV3Qm94PSIwIDAgNzQxMCAzOTAwIj4NCjxyZWN0IHdpZHRoPSI3NDEwIiBoZWlnaHQ9IjM5MDAiIGZpbGw9IiNiMjIyMzQiLz4NCjxwYXRoIGQ9Ik0wLDQ1MEg3NDEwbTAsNjAwSDBtMCw2MDBINzQxMG0wLDYwMEgwbTAsNjAwSDc0MTBtMCw2MDBIMCIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjMwMCIvPg0KPHJlY3Qgd2lkdGg9IjI5NjQiIGhlaWdodD0iMjEwMCIgZmlsbD0iIzNjM2I2ZSIvPg0KPGcgZmlsbD0iI2ZmZiI%2BDQo8ZyBpZD0iczE4Ij4NCjxnIGlkPSJzOSI%2BDQo8ZyBpZD0iczUiPg0KPGcgaWQ9InM0Ij4NCjxwYXRoIGlkPSJzIiBkPSJNMjQ3LDkwIDMxNy41MzQyMzAsMzA3LjA4MjAzOSAxMzIuODczMjE4LDE3Mi45MTc5NjFIMzYxLjEyNjc4MkwxNzYuNDY1NzcwLDMwNy4wODIwMzl6Ii8%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzIiB5PSI0MjAiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3MiIHk9Ijg0MCIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgeT0iMTI2MCIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjcyIgeT0iMTY4MCIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjczQiIHg9IjI0NyIgeT0iMjEwIi8%2BDQo8L2c%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzOSIgeD0iNDk0Ii8%2BDQo8L2c%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzMTgiIHg9Ijk4OCIvPg0KPHVzZSB4bGluazpocmVmPSIjczkiIHg9IjE5NzYiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3M1IiB4PSIyNDcwIi8%2BDQo8L2c%2BDQo8L3N2Zz4%3D)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) [![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square&logoWidth=20&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjkwMCIgaGVpZ2h0PSI2MDAiIHZpZXdCb3g9IjAgMCAzMCAyMCI%2BDQo8ZGVmcz4NCjxwYXRoIGlkPSJzIiBkPSJNMCwtMSAwLjU4Nzc4NSwwLjgwOTAxNyAtMC45NTEwNTcsLTAuMzA5MDE3SDAuOTUxMDU3TC0wLjU4Nzc4NSwwLjgwOTAxN3oiIGZpbGw9IiNmZmRlMDAiLz4NCjwvZGVmcz4NCjxyZWN0IHdpZHRoPSIzMCIgaGVpZ2h0PSIyMCIgZmlsbD0iI2RlMjkxMCIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNSw1KSBzY2FsZSgzKSIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAsMikgcm90YXRlKDIzLjAzNjI0MykiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3MiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyLDQpIHJvdGF0ZSg0NS44Njk4OTgpIi8%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMiw3KSByb3RhdGUoNjkuOTQ1Mzk2KSIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAsOSkgcm90YXRlKDIwLjY1OTgwOCkiLz4NCjwvc3ZnPg%3D%3D)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) @@ -41,13 +31,13 @@ English | [简体中文](./README-zh_CN.md) ## 🖥 Environment Support -* Modern browsers and Internet Explorer 9+ (with [polyfills](https://ant.design/docs/react/getting-started#Compatibility)) -* Server-side Rendering -* [Electron](http://electron.atom.io/) +- Modern browsers and Internet Explorer 9+ (with [polyfills](https://ant.design/docs/react/getting-started#Compatibility)) +- Server-side Rendering +- [Electron](http://electron.atom.io/) | [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | [Opera](http://godban.github.io/browsers-support-badges/)
Opera | [Electron](http://godban.github.io/browsers-support-badges/)
Electron | -| --------- | --------- | --------- | --------- | --------- | --------- | -| IE9, IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions| last 2 versions +| --- | --- | --- | --- | --- | --- | +| IE9, IE10, IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions | last 2 versions | ## 📦 Install @@ -69,7 +59,7 @@ ReactDOM.render(, mountNode); And import style manually: ```jsx -import 'antd/dist/antd.css'; // or 'antd/dist/antd.less' +import 'antd/dist/antd.css'; // or 'antd/dist/antd.less' ``` Or [import components on demand](https://ant.design/docs/react/getting-started#Import-on-Demand). diff --git a/components/_util/raf.ts b/components/_util/raf.ts index 97ff765d02..652716d972 100644 --- a/components/_util/raf.ts +++ b/components/_util/raf.ts @@ -35,4 +35,4 @@ wrapperRaf.cancel = function(pid?: number) { delete ids[pid]; }; -wrapperRaf.ids = ids; // export this for test usage \ No newline at end of file +wrapperRaf.ids = ids; // export this for test usage diff --git a/components/_util/reactNode.ts b/components/_util/reactNode.ts index 200a81da98..5caccdd4d4 100644 --- a/components/_util/reactNode.ts +++ b/components/_util/reactNode.ts @@ -4,4 +4,4 @@ export function cloneElement(element: React.ReactNode, ...restArgs: any[]) { if (!React.isValidElement(element)) return element; return React.cloneElement(element, ...restArgs); -} \ No newline at end of file +} diff --git a/components/affix/demo/basic.md b/components/affix/demo/basic.md index 0d6e96d3e0..3b914b1721 100644 --- a/components/affix/demo/basic.md +++ b/components/affix/demo/basic.md @@ -13,14 +13,14 @@ title: The simplest usage. -````jsx +```jsx import { Affix, Button } from 'antd'; class Demo extends React.Component { state = { top: 10, bottom: 10, - } + }; render() { return ( @@ -56,4 +56,4 @@ class Demo extends React.Component { } ReactDOM.render(, mountNode); -```` +``` diff --git a/components/affix/demo/on-change.md b/components/affix/demo/on-change.md index 9d9a89c9d4..92c2804f15 100644 --- a/components/affix/demo/on-change.md +++ b/components/affix/demo/on-change.md @@ -13,13 +13,13 @@ title: Callback with affixed state. -````jsx +```jsx import { Affix, Button } from 'antd'; ReactDOM.render( console.log(affixed)}> , - mountNode + mountNode, ); -```` +``` diff --git a/components/affix/demo/target.md b/components/affix/demo/target.md index d78ab9100e..81034f11c0 100644 --- a/components/affix/demo/target.md +++ b/components/affix/demo/target.md @@ -13,18 +13,21 @@ title: Set a `target` for 'Affix', which is listen to scroll event of target element (default is `window`). -````jsx +```jsx import { Affix, Button } from 'antd'; class Demo extends React.Component { render() { return ( -
{ this.container = node; }}> +
{ + this.container = node; + }} + >
this.container}> - +
@@ -33,7 +36,7 @@ class Demo extends React.Component { } ReactDOM.render(, mountNode); -```` +``` \ No newline at end of file + diff --git a/components/empty/demo/simple.md b/components/empty/demo/simple.md index 0ae4286b58..877c17ae4f 100644 --- a/components/empty/demo/simple.md +++ b/components/empty/demo/simple.md @@ -16,8 +16,5 @@ You can choose another style of `image` by setting image to `Empty.PRESENTED_IMA ```jsx import { Empty } from 'antd'; -ReactDOM.render( - , - mountNode -); +ReactDOM.render(, mountNode); ``` diff --git a/components/empty/index.en-US.md b/components/empty/index.en-US.md index fccf075d56..819b28fe76 100644 --- a/components/empty/index.en-US.md +++ b/components/empty/index.en-US.md @@ -21,17 +21,17 @@ Empty state placeholder. ``` | Property | Description | Type | Default | -| -------- | ----------- | ---- | ------- | +| --- | --- | --- | --- | | description | Customize description | string \| ReactNode | - | -| imageStyle | style of image | CSSProperties | - | +| imageStyle | style of image | CSSProperties | - | | image | Customize image. Will tread as image url when string provided. | string \| ReactNode | `Empty.PRESENTED_IMAGE_DEFAULT` | ## Built-in images -+ Empty.PRESENTED_IMAGE_SIMPLE +- Empty.PRESENTED_IMAGE_SIMPLE -+ Empty.PRESENTED_IMAGE_DEFAULT +- Empty.PRESENTED_IMAGE_DEFAULT diff --git a/components/empty/index.zh-CN.md b/components/empty/index.zh-CN.md index 8f257037b3..1ff11a54b2 100644 --- a/components/empty/index.zh-CN.md +++ b/components/empty/index.zh-CN.md @@ -29,10 +29,10 @@ cols: 1 ## 内置图片 (3.16.0 以上版本) -+ Empty.PRESENTED_IMAGE_SIMPLE +- Empty.PRESENTED_IMAGE_SIMPLE -+ Empty.PRESENTED_IMAGE_DEFAULT +- Empty.PRESENTED_IMAGE_DEFAULT diff --git a/components/form/demo/advanced-search.md b/components/form/demo/advanced-search.md index 416925cb28..1137b6834c 100644 --- a/components/form/demo/advanced-search.md +++ b/components/form/demo/advanced-search.md @@ -17,11 +17,8 @@ Three columns layout is often used for advanced searching of data table. Because the width of label is not fixed, you may need to adjust it by customizing its style. - -````jsx -import { - Form, Row, Col, Input, Button, Icon, -} from 'antd'; +```jsx +import { Form, Row, Col, Input, Button, Icon } from 'antd'; class AdvancedSearchForm extends React.Component { state = { @@ -38,46 +35,45 @@ class AdvancedSearchForm extends React.Component { {getFieldDecorator(`field-${i}`, { - rules: [{ - required: true, - message: 'Input something!', - }], - })( - - )} + rules: [ + { + required: true, + message: 'Input something!', + }, + ], + })()} - + , ); } return children; } - handleSearch = (e) => { + handleSearch = e => { e.preventDefault(); this.props.form.validateFields((err, values) => { console.log('Received values of form: ', values); }); - } + }; handleReset = () => { this.props.form.resetFields(); - } + }; toggle = () => { const { expand } = this.state; this.setState({ expand: !expand }); - } + }; render() { return ( -
+ {this.getFields()} - + @@ -97,11 +93,11 @@ ReactDOM.render(
Search Result List
, - mountNode + mountNode, ); -```` +``` -````css +```css .ant-advanced-search-form { padding: 24px; background: #fbfbfb; @@ -116,7 +112,7 @@ ReactDOM.render( .ant-advanced-search-form .ant-form-item-control-wrapper { flex: 1; } -```` +``` diff --git a/components/table/index.en-US.md b/components/table/index.en-US.md index 301790c0d1..83271215ca 100644 --- a/components/table/index.en-US.md +++ b/components/table/index.en-US.md @@ -17,33 +17,40 @@ A table displays rows of data. Specify `dataSource` of Table as an array of data. ```jsx -const dataSource = [{ - key: '1', - name: 'Mike', - age: 32, - address: '10 Downing Street' -}, { - key: '2', - name: 'John', - age: 42, - address: '10 Downing Street' -}]; +const dataSource = [ + { + key: '1', + name: 'Mike', + age: 32, + address: '10 Downing Street', + }, + { + key: '2', + name: 'John', + age: 42, + address: '10 Downing Street', + }, +]; -const columns = [{ - title: 'Name', - dataIndex: 'name', - key: 'name', -}, { - title: 'Age', - dataIndex: 'age', - key: 'age', -}, { - title: 'Address', - dataIndex: 'address', - key: 'address', -}]; +const columns = [ + { + title: 'Name', + dataIndex: 'name', + key: 'name', + }, + { + title: 'Age', + dataIndex: 'age', + key: 'age', + }, + { + title: 'Address', + dataIndex: 'address', + key: 'address', + }, +]; - +
; ``` ## API @@ -51,7 +58,7 @@ const columns = [{ ### Table | Property | Description | Type | Default | -| -------- | ----------- | ---- | ------- | +| --- | --- | --- | --- | | bordered | Whether to show all table borders | boolean | `false` | | childrenColumnName | The column contains children to display | string\[] | children | | columns | Columns of table | [ColumnProps](https://git.io/vMMXC)\[] | - | @@ -89,16 +96,16 @@ Same as `onRow` `onHeaderRow` `onCell` `onHeaderCell`
{ return { - onClick: (event) => {}, // click row - onDoubleClick: (event) => {}, // double click row - onContextMenu: (event) => {}, // right button click row - onMouseEnter: (event) => {}, // mouse enter row - onMouseLeave: (event) => {}, // mouse leave row + onClick: event => {}, // click row + onDoubleClick: event => {}, // double click row + onContextMenu: event => {}, // right button click row + onMouseEnter: event => {}, // mouse enter row + onMouseLeave: event => {}, // mouse leave row }; }} - onHeaderRow={(column) => { + onHeaderRow={column => { return { - onClick: () => {}, // click header row + onClick: () => {}, // click header row }; }} /> @@ -109,7 +116,7 @@ Same as `onRow` `onHeaderRow` `onCell` `onHeaderCell` One of the Table `columns` prop for describing the table's columns, Column has the same API. | Property | Description | Type | Default | -| -------- | ----------- | ---- | ------- | +| --- | --- | --- | --- | | align | specify which way that column is aligned | 'left' \| 'right' \| 'center' | 'left' | | className | className of this column | string | - | | colSpan | Span of this column's title | number | | @@ -137,16 +144,16 @@ One of the Table `columns` prop for describing the table's columns, Column has t ### ColumnGroup -| Property | Description | Type | Default | -| -------- | ----------- | ---- | ------- | -| title | Title of the column group | string\|ReactNode | - | +| Property | Description | Type | Default | +| -------- | ------------------------- | ----------------- | ------- | +| title | Title of the column group | string\|ReactNode | - | ### pagination Properties for pagination. -| Property | Description | Type | Default | -| -------- | ----------- | ---- | ------- | +| Property | Description | Type | Default | +| -------- | ------------------------------------ | --------------------------- | -------- | | position | specify the position of `Pagination` | 'top' \| 'bottom' \| 'both' | 'bottom' | More about pagination, please check [`Pagination`](/components/pagination/). @@ -156,7 +163,7 @@ More about pagination, please check [`Pagination`](/components/pagination/). Properties for row selection. | Property | Description | Type | Default | -| -------- | ----------- | ---- | ------- | +| --- | --- | --- | --- | | columnWidth | Set the width of the selection column | string\|number | `60px` | | columnTitle | Set the title of the selection column | string\|React.ReactNode | - | | fixed | Fixed selection column on the left | boolean | - | @@ -173,7 +180,7 @@ Properties for row selection. ### selection | Property | Description | Type | Default | -| -------- | ----------- | ---- | ------- | +| --- | --- | --- | --- | | key | Unique key of this selection | string | - | | text | Display text of this selection | string\|React.ReactNode | - | | onSelect | Callback executed when this selection is clicked | Function(changeableRowKeys) | - | diff --git a/components/table/index.zh-CN.md b/components/table/index.zh-CN.md index 8b4d19a50c..63a91847a6 100644 --- a/components/table/index.zh-CN.md +++ b/components/table/index.zh-CN.md @@ -22,33 +22,40 @@ subtitle: 表格 指定表格的数据源 `dataSource` 为一个数组。 ```jsx -const dataSource = [{ - key: '1', - name: '胡彦斌', - age: 32, - address: '西湖区湖底公园1号' -}, { - key: '2', - name: '胡彦祖', - age: 42, - address: '西湖区湖底公园1号' -}]; +const dataSource = [ + { + key: '1', + name: '胡彦斌', + age: 32, + address: '西湖区湖底公园1号', + }, + { + key: '2', + name: '胡彦祖', + age: 42, + address: '西湖区湖底公园1号', + }, +]; -const columns = [{ - title: '姓名', - dataIndex: 'name', - key: 'name', -}, { - title: '年龄', - dataIndex: 'age', - key: 'age', -}, { - title: '住址', - dataIndex: 'address', - key: 'address', -}]; +const columns = [ + { + title: '姓名', + dataIndex: 'name', + key: 'name', + }, + { + title: '年龄', + dataIndex: 'age', + key: 'age', + }, + { + title: '住址', + dataIndex: 'address', + key: 'address', + }, +]; -
+
; ``` ## API @@ -92,18 +99,18 @@ const columns = [{ ```jsx
{ + onRow={record => { return { - onClick: (event) => {}, // 点击行 - onDoubleClick: (event) => {}, - onContextMenu: (event) => {}, - onMouseEnter: (event) => {}, // 鼠标移入行 - onMouseLeave: (event) => {} + onClick: event => {}, // 点击行 + onDoubleClick: event => {}, + onContextMenu: event => {}, + onMouseEnter: event => {}, // 鼠标移入行 + onMouseLeave: event => {}, }; }} - onHeaderRow={(column) => { + onHeaderRow={column => { return { - onClick: () => {}, // 点击表头行 + onClick: () => {}, // 点击表头行 }; }} /> @@ -129,7 +136,7 @@ const columns = [{ | filters | 表头的筛选菜单项 | object\[] | - | | fixed | 列是否固定，可选 `true`(等效于 left) `'left'` `'right'` | boolean\|string | false | | key | React 需要的 key，如果已经设置了唯一的 `dataIndex`，可以忽略这个属性 | string | - | -| render | 生成复杂数据的渲染函数，参数分别为当前行的值，当前行数据，行索引，@return里面可以设置表格[行/列合并](#components-table-demo-colspan-rowspan) | Function(text, record, index) {} | - | +| render | 生成复杂数据的渲染函数，参数分别为当前行的值，当前行数据，行索引，@return 里面可以设置表格[行/列合并](#components-table-demo-colspan-rowspan) | Function(text, record, index) {} | - | | sorter | 排序函数，本地排序使用一个函数(参考 [Array.sort](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort) 的 compareFunction)，需要服务端排序可设为 true | Function\|boolean | - | | sortOrder | 排序的受控属性，外界可用此控制列的排序，可设置为 `'ascend'` `'descend'` `false` | boolean\|string | - | | sortDirections | 支持的排序方式，取值为 `'ascend'` `'descend'` | Array | `['ascend', 'descend']` | @@ -142,16 +149,16 @@ const columns = [{ ### ColumnGroup -| 参数 | 说明 | 类型 | 默认值 | -| --- | --- | --- | --- | -| title | 列头显示文字 | string\|ReactNode | - | +| 参数 | 说明 | 类型 | 默认值 | +| ----- | ------------ | ----------------- | ------ | +| title | 列头显示文字 | string\|ReactNode | - | ### pagination 分页的配置项。 -| 参数 | 说明 | 类型 | 默认值 | -| --- | --- | --- | --- | +| 参数 | 说明 | 类型 | 默认值 | +| -------- | ------------------ | --------------------------- | -------- | | position | 指定分页显示的位置 | 'top' \| 'bottom' \| 'both' | 'bottom' | 更多配置项，请查看 [`Pagination`](/components/pagination/)。 @@ -177,11 +184,11 @@ const columns = [{ ### selection -| 参数 | 说明 | 类型 | 默认值 | -| --- | --- | --- | --- | -| key | React 需要的 key，建议设置 | string | - | -| text | 选择项显示的文字 | string\|React.ReactNode | - | -| onSelect | 选择项点击回调 | Function(changeableRowKeys) | - | +| 参数 | 说明 | 类型 | 默认值 | +| -------- | -------------------------- | --------------------------- | ------ | +| key | React 需要的 key，建议设置 | string | - | +| text | 选择项显示的文字 | string\|React.ReactNode | - | +| onSelect | 选择项点击回调 | Function(changeableRowKeys) | - | ## 在 TypeScript 中使用 diff --git a/components/tabs/demo/basic.md b/components/tabs/demo/basic.md index f38ab33d1b..8a269341be 100644 --- a/components/tabs/demo/basic.md +++ b/components/tabs/demo/basic.md @@ -13,7 +13,7 @@ title: Default activate first tab. -````jsx +```jsx import { Tabs } from 'antd'; const TabPane = Tabs.TabPane; @@ -24,10 +24,16 @@ function callback(key) { ReactDOM.render( - Content of Tab Pane 1 - Content of Tab Pane 2 - Content of Tab Pane 3 + + Content of Tab Pane 1 + + + Content of Tab Pane 2 + + + Content of Tab Pane 3 + , - mountNode + mountNode, ); -```` +``` diff --git a/components/tabs/demo/card-top.md b/components/tabs/demo/card-top.md index a4272f3a5c..a002fb2444 100644 --- a/components/tabs/demo/card-top.md +++ b/components/tabs/demo/card-top.md @@ -13,7 +13,7 @@ title: Should be used at the top of container, needs to override styles. -````jsx +```jsx import { Tabs } from 'antd'; const TabPane = Tabs.TabPane; @@ -38,11 +38,11 @@ ReactDOM.render( , - mountNode + mountNode, ); -```` +``` -````css +```css .card-container > .ant-tabs-card > .ant-tabs-content { height: 120px; margin-top: -16px; @@ -66,7 +66,7 @@ ReactDOM.render( border-color: #fff; background: #fff; } -```` +``` diff --git a/components/time-picker/index.zh-CN.md b/components/time-picker/index.zh-CN.md index 9fee313076..16391f51d8 100644 --- a/components/time-picker/index.zh-CN.md +++ b/components/time-picker/index.zh-CN.md @@ -9,17 +9,17 @@ title: TimePicker ## 何时使用 -* * * +--- 当用户需要输入一个时间，可以点击标准输入框，弹出时间面板进行选择。 ## API -* * * +--- ```jsx import moment from 'moment'; - +; ``` | 参数 | 说明 | 类型 | 默认值 | @@ -55,9 +55,9 @@ import moment from 'moment'; ## 方法 -| 名称 | 描述 | -| --- | --- | -| blur() | 移除焦点 | +| 名称 | 描述 | +| ------- | -------- | +| blur() | 移除焦点 | | focus() | 获取焦点 | diff --git a/components/timeline/demo/alternate.md b/components/timeline/demo/alternate.md index 1de38bd9d7..582b5e22ba 100644 --- a/components/timeline/demo/alternate.md +++ b/components/timeline/demo/alternate.md @@ -13,18 +13,24 @@ title: Alternate timeline. -````jsx +```jsx import { Timeline, Icon } from 'antd'; ReactDOM.render( Create a services site 2015-09-01 Solve initial network problems 2015-09-01 - }>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. + }> + Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque + laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto + beatae vitae dicta sunt explicabo. + Network problems being solved 2015-09-01 Create a services site 2015-09-01 - }>Technical testing 2015-09-01 + }> + Technical testing 2015-09-01 + , - mountNode + mountNode, ); -```` +``` diff --git a/components/timeline/demo/basic.md b/components/timeline/demo/basic.md index fd338084e2..a3b2026290 100644 --- a/components/timeline/demo/basic.md +++ b/components/timeline/demo/basic.md @@ -13,7 +13,7 @@ title: Basic timeline. -````jsx +```jsx import { Timeline } from 'antd'; ReactDOM.render( @@ -23,6 +23,6 @@ ReactDOM.render( Technical testing 2015-09-01 Network problems being solved 2015-09-01 , - mountNode + mountNode, ); -```` +``` diff --git a/components/timeline/demo/color.md b/components/timeline/demo/color.md index 48a0409ee7..ec367dcc54 100644 --- a/components/timeline/demo/color.md +++ b/components/timeline/demo/color.md @@ -1,6 +1,6 @@ --- order: 1 -title: +title: zh-CN: 圆圈颜色 en-US: Color --- @@ -9,11 +9,11 @@ title: 圆圈颜色，绿色用于已完成、成功状态，红色表示告警或错误状态，蓝色可表示正在进行或其他默认状态。 -## en-US +## en-US Set the color of circles. `green` means completed or success status, `red` means warning or error, and `blue` means ongoing or other default status. -````jsx +```jsx import { Timeline } from 'antd'; ReactDOM.render( @@ -31,6 +31,6 @@ ReactDOM.render(

Technical testing 3 2015-09-01

, - mountNode + mountNode, ); -```` +``` diff --git a/components/timeline/demo/custom.md b/components/timeline/demo/custom.md index 753850b94c..0d80e21838 100644 --- a/components/timeline/demo/custom.md +++ b/components/timeline/demo/custom.md @@ -13,16 +13,18 @@ title: Set a node as an icon or other custom element. -````jsx +```jsx import { Timeline, Icon } from 'antd'; ReactDOM.render( Create a services site 2015-09-01 Solve initial network problems 2015-09-01 - } color="red">Technical testing 2015-09-01 + } color="red"> + Technical testing 2015-09-01 + Network problems being solved 2015-09-01 , - mountNode + mountNode, ); -```` +``` diff --git a/components/timeline/demo/pending.md b/components/timeline/demo/pending.md index c791be7ce3..b54b444096 100644 --- a/components/timeline/demo/pending.md +++ b/components/timeline/demo/pending.md @@ -11,20 +11,19 @@ title: ## en-US -When the timeline is incomplete and ongoing, put a ghost node at last. Set `pending` as truthy value to enable displaying pending item. You can customize the pending content by passing a React Element. Meanwhile, `pendingDot={a React Element}` is used to customize the dot of the pending item. -`reverse={true}` is used for reversing nodes. +When the timeline is incomplete and ongoing, put a ghost node at last. Set `pending` as truthy value to enable displaying pending item. You can customize the pending content by passing a React Element. Meanwhile, `pendingDot={a React Element}` is used to customize the dot of the pending item. `reverse={true}` is used for reversing nodes. -````jsx +```jsx import { Timeline, Button } from 'antd'; class PendingTimeLine extends React.Component { state = { reverse: false, - } + }; handleClick = () => { this.setState({ reverse: !this.state.reverse }); - } + }; render() { return ( @@ -34,11 +33,13 @@ class PendingTimeLine extends React.Component { Solve initial network problems 2015-09-01 Technical testing 2015-09-01 - + ); } } ReactDOM.render(, mountNode); -```` +``` diff --git a/components/timeline/demo/right.md b/components/timeline/demo/right.md index 31316e40a9..cfd9f0813e 100644 --- a/components/timeline/demo/right.md +++ b/components/timeline/demo/right.md @@ -13,16 +13,18 @@ title: Right alternate timeline. -````jsx +```jsx import { Timeline, Icon } from 'antd'; ReactDOM.render( Create a services site 2015-09-01 Solve initial network problems 2015-09-01 - } color="red">Technical testing 2015-09-01 + } color="red"> + Technical testing 2015-09-01 + Network problems being solved 2015-09-01 , - mountNode + mountNode, ); -```` +``` diff --git a/components/timeline/index.en-US.md b/components/timeline/index.en-US.md index 0dff00319c..7a4817d76c 100644 --- a/components/timeline/index.en-US.md +++ b/components/timeline/index.en-US.md @@ -27,7 +27,7 @@ Vertical display timeline. Timeline | Property | Description | Type | Default | -| -------- | ----------- | ---- | ------- | +| --- | --- | --- | --- | | pending | Set the last ghost node's existence or its content | boolean\|string\|ReactNode | `false` | | pendingDot | Set the dot of the last ghost node when pending is true | string\|ReactNode | `` | | reverse | reverse nodes or not | boolean | false | @@ -38,7 +38,7 @@ Timeline Node of timeline | Property | Description | Type | Default | Version | -| -------- | ----------- | ---- | ------- | ------- | -| color | Set the circle's color to `blue`, `red`, `green` or other custom colors | string | `blue` | | -| dot | Customize timeline dot | string\|ReactNode | - | | +| --- | --- | --- | --- | --- | +| color | Set the circle's color to `blue`, `red`, `green` or other custom colors | string | `blue` | | +| dot | Customize timeline dot | string\|ReactNode | - | | | position | Customize node position | `left` \| `right` | - | 3.17.0 | diff --git a/components/timeline/index.zh-CN.md b/components/timeline/index.zh-CN.md index 1505150a70..8d6c07f1e3 100644 --- a/components/timeline/index.zh-CN.md +++ b/components/timeline/index.zh-CN.md @@ -32,14 +32,14 @@ title: Timeline | pending | 指定最后一个幽灵节点是否存在或内容 | boolean\|string\|ReactNode | false | | pendingDot | 当最后一个幽灵节点存在時，指定其时间图点 | string\|ReactNode | `` | | reverse | 节点排序 | boolean | false | -| mode | 通过设置 `mode` 可以改变时间轴和内容的相对位置 | `left` \| `alternate` \| `right` | - | +| mode | 通过设置 `mode` 可以改变时间轴和内容的相对位置 | `left` \| `alternate` \| `right` | - | ### Timeline.Item 时间轴的每一个节点。 -| 参数 | 说明 | 类型 | 默认值 | 版本 | -| --- | --- | --- | --- | --- | -| color | 指定圆圈颜色 `blue, red, green`，或自定义的色值 | string | blue | | -| dot | 自定义时间轴点 | string\|ReactNode | - | | -| position | 自定义节点位置 | `left` \| `right` | - | 3.17.0 | +| 参数 | 说明 | 类型 | 默认值 | 版本 | +| -------- | ----------------------------------------------- | ----------------- | ------ | ------ | +| color | 指定圆圈颜色 `blue, red, green`，或自定义的色值 | string | blue | | +| dot | 自定义时间轴点 | string\|ReactNode | - | | +| position | 自定义节点位置 | `left` \| `right` | - | 3.17.0 | diff --git a/components/tooltip/demo/arrow-point-at-center.md b/components/tooltip/demo/arrow-point-at-center.md index 42358a0c2e..cc6bab1b3b 100644 --- a/components/tooltip/demo/arrow-point-at-center.md +++ b/components/tooltip/demo/arrow-point-at-center.md @@ -13,7 +13,7 @@ title: By specifying `arrowPointAtCenter` prop, the arrow will point to the center of the target element. -````jsx +```jsx import { Tooltip, Button } from 'antd'; ReactDOM.render( @@ -25,9 +25,9 @@ ReactDOM.render( , - mountNode + mountNode, ); -```` +``` - + @@ -79,24 +94,31 @@