docs: add changelog (#17902)

Release 3.20.6

.github/FUNDING.yml

@@ -1,8 +1,8 @@
 # These are supported funding model platforms
 
 github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2]
-patreon: # Replace with a single Patreon username
 open_collective: ant-design
+patreon: ant_design
 ko_fi: # Replace with a single Ko-fi username
 tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel
 custom: # Replace with a single custom sponsorship URL

.github/PULL_REQUEST_TEMPLATE.md

@@ -21,20 +21,18 @@ Please makes sure that these form are filled before submitting your pull request
 - [ ] Branch merge
 - [ ] Other (about what?)
 
-### 👻 What's the background?
+### 🔗 Related issue link
 
 <!--
 1. Describe the source of requirement, like related issue link.
-
-2. Describe the problem and the scenario.
 -->
 
-### 💡 Solution
+### 💡 Background and solution
 
 <!--
-1. How to fix the problem, and list final API implementation and usage sample if that is an new feature.
-
+1. Describe the problem and the scenario.
 2. GIF or snapshot should be provided if includes UI/interactive modification.
+3. How to fix the problem, and list final API implementation and usage sample if that is an new feature.
 -->
 
 ### 📝 Changelog

.github/PULL_REQUEST_TEMPLATE/pr_cn.md

@@ -21,20 +21,18 @@
 - [ ] 分支合并
 - [ ] 其他改动（是关于什么的改动？）
 
-### 👻 需求背景
+### 🔗 相关 Issue
 
 <!--
 1. 描述相关需求的来源，如相关的 issue 讨论链接。
-
-2. 要解决的具体问题。
 -->
 
-### 💡 解决方案和最终实现是？
+### 💡 需求背景和解决方案
 
 <!--
-1. 列出最终的 API 实现和用法。
-
-2. 涉及UI/交互变动需要有截图或 GIF。
+1. 要解决的具体问题。
+2. 列出最终的 API 实现和用法。
+3. 涉及UI/交互变动需要有截图或 GIF。
 -->
 
 ### 📝 更新日志怎么写？

.github/main.workflow

@@ -0,0 +1,14 @@
+workflow "Deploy website" {
+  on = "release"
+  resolves = ["Deploy"]
+}
+
+action "Deploy" {
+  uses = "docker://node:10"
+  runs = [
+    "sh",
+    "-c",
+    "git remote set-url origin https://${DEPLOY_TOKEN}@github.com/ant-design/ant-design.git && npm install && npm run deploy"
+  ],
+  secrets = ["DEPLOY_TOKEN"]
+}

.jest.js

@@ -2,7 +2,7 @@ const libDir = process.env.LIB_DIR;
 
 const transformIgnorePatterns = [
   '/dist/',
-  'node_modules/(?!(_react-dnd|react-dnd|_dnd-core|dnd-core))[^/]+?/(?!(es|node_modules)/)', // Ignore modules without es dir
+  'node_modules/[^/]+?/(?!(es|node_modules)/)', // Ignore modules without es dir
 ];
 
 module.exports = {
@@ -10,6 +10,14 @@ module.exports = {
   setupFiles: ['./tests/setup.js'],
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'md'],
   modulePathIgnorePatterns: ['/_site/'],
+  moduleNameMapper: {
+    '^dnd-core$': 'dnd-core/dist/cjs',
+    '^react-dnd$': 'react-dnd/dist/cjs',
+    '^react-dnd-html5-backend$': 'react-dnd-html5-backend/dist/cjs',
+    '^react-dnd-touch-backend$': 'react-dnd-touch-backend/dist/cjs',
+    '^react-dnd-test-backend$': 'react-dnd-test-backend/dist/cjs',
+    '^react-dnd-test-utils$': 'react-dnd-test-utils/dist/cjs',
+  },
   testPathIgnorePatterns: ['/node_modules/', 'dekko', 'node'],
   transform: {
     '\\.tsx?$': './node_modules/antd-tools/lib/jest/codePreprocessor',

.jest.node.js

@@ -1,9 +1,10 @@
-const { transformIgnorePatterns } = require('./.jest');
+const { moduleNameMapper, transformIgnorePatterns } = require('./.jest');
 
 // jest config for server render environment
 module.exports = {
   setupFiles: ['./tests/setup.js'],
   moduleFileExtensions: ['ts', 'tsx', 'js', 'md'],
+  moduleNameMapper,
   transform: {
     '\\.tsx?$': './node_modules/antd-tools/lib/jest/codePreprocessor',
     '\\.js$': './node_modules/antd-tools/lib/jest/codePreprocessor',

.remarkrc.js

@@ -1,5 +0,0 @@
-const config = {
-  plugins: ['remark-preset-lint-recommended', ['remark-lint-list-item-indent', 'space']],
-};
-
-module.exports = config;

CHANGELOG.en-US.md

@@ -15,6 +15,161 @@ timeline: true
 
 ---
 
+## 3.20.7
+
+- 🐞 Fix Upload can not click in Form.Item. [#17897](https://github.com/ant-design/ant-design/pull/17897)
+
+## 3.20.6
+
+`2019-07-24`
+
+- 🐞 Fix Col miss the place when its height is 0. [#17748](https://github.com/ant-design/ant-design/pull/17748) [@yoyo837](https://github.com/yoyo837)
+- 🐞 Fix Cascader was broken when `options`'s `children` is `null`. [#17756](https://github.com/ant-design/ant-design/pull/17756)
+- 🐞 Fix Checkbox padding where all spans align left. [#17752](https://github.com/ant-design/ant-design/pull/17752) [#17761](https://github.com/ant-design/ant-design/pull/17761) [@inovux](https://github.com/inovux)
+- 🐞 Fix Input line height style bug in IE. [#17759](https://github.com/ant-design/ant-design/pull/17759)
+- 🐞 Fix last item of Rate has additional margin. [#17764](https://github.com/ant-design/ant-design/pull/17764) [@inovux](https://github.com/inovux)
+- 🐞 Fix Radio.Button disabled item border style. [#17775](https://github.com/ant-design/ant-design/pull/17775)
+- 🐞 Fix DatePicker `@input-hover-border-color` variables not working. [#17784](https://github.com/ant-design/ant-design/pull/17784)
+- 🐞 Fix Transfer not re-render list when `dataSource` with `lazy`. [#17783](https://github.com/ant-design/ant-design/pull/17783)
+- 🐞 Fix RangePicker `defaultValue` startTime later than endTime. [#17694](https://github.com/ant-design/ant-design/pull/17694) [@mraiguo](https://github.com/mraiguo)
+- 💄 Tweak long `placeholder` truncate style. [#17797](https://github.com/ant-design/ant-design/pull/17797) [@Kapiroska](https://github.com/Kapiroska)
+- 🐞 Fix Menu circular dependencies. [#17805](https://github.com/ant-design/ant-design/pull/17805) [@phthhieu](https://github.com/phthhieu)
+- 🐞 Fix Alert `message` style. [#17808](https://github.com/ant-design/ant-design/pull/17808) [@mtadams007](https://github.com/mtadams007)
+- 🐞 Fix Result `extra` is not centered. [#17786](https://github.com/ant-design/ant-design/pull/17786) [@nnecec](https://github.com/nnecec)
+- 🐞 Fix Progress with mini `value` not keeps bar radius round. [#17819](https://github.com/ant-design/ant-design/pull/17819)
+- 🐞 Fix Statistic.Countdown `format` not escaping characters in square brackets. [#17841](https://github.com/ant-design/ant-design/pull/17841)
+- 🐞 Fix Table custom `filterDropdown` always triggering `onChange` in some situations. [#17846](https://github.com/ant-design/ant-design/pull/17846)
+- 🐞 Fix TimePicker weird render bug in Safari. [#17857](https://github.com/ant-design/ant-design/pull/17857)
+
+## 3.20.5
+
+`2019-07-19`
+
+- 🐞 Fix `<Button type="danger" ghost />` broken style. [#17743](https://github.com/ant-design/ant-design/pull/17743)
+
+## 3.20.4
+
+`2019-07-19`
+
+- 🐞 Fix multiple level Drawer with falsy `mask`, parent Drawer can not collapse after removing sub component. [#17698](https://github.com/ant-design/ant-design/pull/17698)
+- 🐞 Fix Table border radius missing in Firefox. [#17641](https://github.com/ant-design/ant-design/pull/17641)
+- 🐞 Fix Menu throw warning `Cannot update during an existing state transition`. [#17657](https://github.com/ant-design/ant-design/pull/17657)
+- 🐞 Fix Affix not resize when container size changed. [#17678](https://github.com/ant-design/ant-design/pull/17678)
+- 🐞 Fix Anchor not update bind element when `getContainer` changed. [#17677](https://github.com/ant-design/ant-design/pull/17677)
+- 🐞 Fix window scroll issue when using Modal and Drawer same time. [#17600](https://github.com/ant-design/ant-design/pull/17600)
+- 🌟 Empty `description` supports `false`. [#17659](https://github.com/ant-design/ant-design/pull/17659) [@billfeller](https://github.com/billfeller)
+- 💄 Remove Pagination element underline style to avoid polluted by global style. [#17728](https://github.com/ant-design/ant-design/pull/17728)
+- 💄 Extends Card action click area. [#17705](https://github.com/ant-design/ant-design/pull/17705) [@lhx6538665](https://github.com/lhx6538665)
+- 💄 Tweak less variables and UI to improve style customization. [#17705](https://github.com/ant-design/ant-design/pull/17705)
+
+  - Optimize danger Button UI design.
+
+    <img width="103" class="markdown-inline-image" alt="image" src="https://user-images.githubusercontent.com/507615/61370809-e37aa480-a8c5-11e9-98b3-51ce06dfba24.png">
+
+  - Fix `@border-radius-sm` not working for Slider, TreeSelect.
+  - Added some less variables for Progress, Tabs, Slider and Timeline.
+
+- TypeScript
+  - 💄 Improve type definition of Form. [#17676](https://github.com/ant-design/ant-design/pull/17676) [@lixiaoyang1992](https://github.com/lixiaoyang1992)
+  - 💄 Improve type definition of Tabs. [#17675](https://github.com/ant-design/ant-design/pull/17675)
+
+## 3.20.3
+
+`2019-07-15`
+
+- 🚨 Revert change of Input suffix style in [#17508](https://github.com/ant-design/ant-design/pull/17508), since it introduced other problems
+
+## 3.20.2
+
+`2019-07-13`
+
+- 📖 Add version description for every features. [#17373](https://github.com/ant-design/ant-design/pull/17373) [@muzea](https://github.com/muzea)
+- 🐞 Fix Button transition style when loading. [#17596](https://github.com/ant-design/ant-design/pull/17596) [@LilyWakana](https://github.com/LilyWakana)
+- Cascader
+  - 🐞 Fix not display `notFoundContent` when options.length is 0. [#17538](https://github.com/ant-design/ant-design/pull/17538)
+  - 🐞 Fix option's loading not aligned when `isLeaf` is true. [#17550](https://github.com/ant-design/ant-design/pull/17550)
+  - 🐞 Fix over-length text covered by arrow. [#17583](https://github.com/ant-design/ant-design/pull/17583)
+- 🐞 Fix Input style when suffix and clear icon exist both. [#17508](https://github.com/ant-design/ant-design/pull/17508) [@LilyWakana](https://github.com/LilyWakana)
+- TypeScript
+  - 💄 Improve type definition of Cascader's option. [#17581](https://github.com/ant-design/ant-design/pull/17581) [@MrHeer](https://github.com/MrHeer)
+  - 🐞 Fix type definition of Descriptions.title. [#17559](https://github.com/ant-design/ant-design/pull/17559)
+  - 🐞 Fix type definition of Collapse.activeKey, Collapse.defaultActiveKey and CollapsePanel.key. [#17557](https://github.com/ant-design/ant-design/pull/17557) [@thylsky](https://github.com/thylsky)
+
+## 3.20.1
+
+- 💄 Optimize TimePicker focus style. [#17447](https://github.com/ant-design/ant-design/pull/17447)
+- 💄 Optimize DatePicker arrow style for resolve messy when not use utf-8. [#17480](https://github.com/ant-design/ant-design/pull/17480)
+- 🐞 Remove useless props which Drawer pass to rc-drawer for avoid error. [#17390](https://github.com/ant-design/ant-design/pull/17390)
+- 🐞 Fix Tabs disabled tab and next icon style. [#17500](https://github.com/ant-design/ant-design/pull/17500)
+- 🐞 Fix Result's problem that the `className` is empty and the class name is wrong. [#17389](https://github.com/ant-design/ant-design/pull/17389)
+- 🐞 Fix DatePicker's input box is obscured on safari. [#17421](https://github.com/ant-design/ant-design/pull/17421)
+- 🐞 Fix typo icon name `colum-height` to `column-height`. [#17458](https://github.com/ant-design/ant-design/pull/17458)
+- TypeScript
+  - 🐞 Fix Form `onSubmit` type. [#17412](https://github.com/ant-design/ant-design/pull/17412)
+  - 🐞 Fix omit AutoComplete `loading` type. [#17433](https://github.com/ant-design/ant-design/pull/17433)
+  - 🐞 Fix Switch `onClick` type. [#17502](https://github.com/ant-design/ant-design/pull/17502) [@DiamondYuan](https://github.com/DiamondYuan)
+
+## 3.20.0
+
+- 🔥🔥🔥 Add [Result](https://ant.design/components/result) Used to feed back the results of a series of operational tasks.
+- 🔥 Descriptions support vertical layout. [#17330](https://github.com/ant-design/ant-design/pull/17330) [@hengkx](https://github.com/hengkx)
+- 🔥 Progress.Circle support gradient line color. [#17315](https://github.com/ant-design/ant-design/pull/17315) [@hengkx](https://github.com/hengkx)
+
+  <img class="markdown-inline-image" src="https://gw.alipayobjects.com/zos/antfincdn/WogwW6kA4O/method-draw-image.svg" alt="Progress">
+
+- 🔥 Optimize PageHeader className naming. [#17321](https://github.com/ant-design/ant-design/pull/17321)
+- 🐞 Drawer fixes `maskCloseble` to false, keyboard ESC closes invalid. [#17316](https://github.com/ant-design/ant-design/pull/17316)
+- 🐞 Fixed an issue where Drawer closes not calling `afterVisibleChange` in Edge. [#17311](https://github.com/ant-design/ant-design/pull/17311)
+- 🌟 Drawer adds `keyboard` to allow opening and closing of responses to keyboard events. [#17316](https://github.com/ant-design/ant-design/pull/17316)
+- 🌟 Popconfirm adds the `disabled` props to control whether the click child element pops up. [#16985](https://github.com/ant-design/ant-design/pull/16985) [@lhyt](https://github.com/lhyt)
+- ⌨️ Improve TimePicker accessibility. [#17099](https://github.com/ant-design/ant-design/pull/17099)
+- 💄 Fix Tooltip arrow shadow style. [#17264](https://github.com/ant-design/ant-design/pull/17264)
+- 🐞 Fix Descriptions.Item not support `className`. [#17280](https://github.com/ant-design/ant-design/pull/17280)
+- 🐞 Fixing Descriptions.Item does not set a label and will also display the `:` question. [#17337](https://github.com/ant-design/ant-design/pull/17337)
+- 🐞 Fixed the incorrect color of the `placeholder` of the Mentions. [#17317](https://github.com/ant-design/ant-design/pull/17317)
+- 🐞 Fixed incorrect line-height for Mentions. [#17347](https://github.com/ant-design/ant-design/pull/17347)
+- 💄 Fixed small Table header background to white according to design spec. [#17351](https://github.com/ant-design/ant-design/pull/17351)
+- 🌟 The CheckboxGroup`onChange` value keeps the order of the options. [#17342](https://github.com/ant-design/ant-design/pull/17342) [@yoyo837](https://github.com/yoyo837)
+- 🐞 Fix Tooltip not work correctly on disabled Switch. [#17372](https://github.com/ant-design/ant-design/pull/17372)
+- 💄 Add variables [#16843](https://github.com/ant-design/ant-design/pull/16843) [#17031](https://github.com/ant-design/ant-design/pull/17031) [#16996](https://github.com/ant-design/ant-design/pull/16996) [@alxkosov](https://github.com/alxkosov):
+  - `@dropdown-line-height`
+  - `@dropdown-font-size`
+  - `@dropdown-vertical-padding`
+  - `@collapse-panel-border-radius`
+  - `@table-body-selected-sort-bg`
+  - `@table-selected-row-hover-bg`
+- TypeScript
+  - 🌟 Improve the type definition of the Switch. [#17331](https://github.com/ant-design/ant-design/pull/17331)
+  - 🐞 Skeleton AvatarProps `size` supports number. [#17331](https://github.com/ant-design/ant-design/pull/17331)
+- 📝 Updated several documents. [#17336](https://github.com/ant-design/ant-design/pull/17336) [#17345](https://github.com/ant-design/ant-design/pull/17345) [#17355](https://github.com/ant-design/ant-design/pull/17355)
+
+## 3.19.8
+
+`2019-06-24`
+
+- 🐞 Revert `unknown` to `any` for now to avoid introducing tones of errors in one time. [#17249](https://github.com/ant-design/ant-design/issues/17249)
+
+## 3.19.7
+
+`2019-06-21`
+
+- 🐞 Fix Descriptions throw error when contains falsy child. [#17207](https://github.com/ant-design/ant-design/pull/17207) [@superandrew213](http://github.com/superandrew213)
+- 🐞 Fix a scrollbar style problem of empty Table in IE. [#17223](https://github.com/ant-design/ant-design/pull/17223)
+- 🐞 Fix single Breadcrumb not showing on PageHeader. [#17209](https://github.com/ant-design/ant-design/pull/17209)
+- 🐞 Fix Modal that 24px botton area cannot trigger mask click event. [#17229](https://github.com/ant-design/ant-design/pull/17229)
+- 🐞 Fix Layout Sider‘s zero-width trigger `z-index` bug. [#17228](https://github.com/ant-design/ant-design/pull/17228)
+- TypeScript
+  - ⚡️ Use the `unknown` type in typescript 3.0 to improve defintions. [#14044](https://github.com/ant-design/ant-design/issues/14044) [@Zzzen](http://github.com/Zzzen)
+  - 🐞 Fix Calendar `headerRender` should be optional. [#17063](https://github.com/ant-design/ant-design/pull/17063) [@wonderjar](http://github.com/wonderjar)
+
+## 3.19.6
+
+`2019-06-19`
+
+- 🐞 Fix nest Card `extra` position not correct. [#17140](https://github.com/ant-design/ant-design/pull/17140)
+- 🐞 Fix Table crash while `filter` dynamic change. [#17141](https://github.com/ant-design/ant-design/pull/17141)
+- 🐞 Fix TextArea & DatePicker separator position too low and align issue. [#17165](https://github.com/ant-design/ant-design/pull/17165)
+
 ## 3.19.5
 
 `2019-06-17`

CHANGELOG.zh-CN.md

@@ -15,6 +15,161 @@ timeline: true
 
 ---
 
+## 3.20.7
+
+- 🐞 修复 Upload 在 Form.Item 中无法点击的问题。[#17897](https://github.com/ant-design/ant-design/pull/17897)
+
+## 3.20.6
+
+`2019-07-24`
+
+- 🐞 修复 Col 在高度为 0 时的占位问题。 [#17748](https://github.com/ant-design/ant-design/pull/17748) [@yoyo837](https://github.com/yoyo837)
+- 🐞 修复 Cascader `options` 中 `children` 为 `null` 时报错的问题。[#17756](https://github.com/ant-design/ant-design/pull/17756)
+- 🐞 修复 Checkbox 左对齐的内边距问题。[#17752](https://github.com/ant-design/ant-design/pull/17752) [#17761](https://github.com/ant-design/ant-design/pull/17761) [@inovux](https://github.com/inovux)
+- 🐞 修复 Input 在 IE 下错位的问题。[#17759](https://github.com/ant-design/ant-design/pull/17759)
+- 🐞 修复最后一个 Rate 有额外边距的问题。[#17764](https://github.com/ant-design/ant-design/pull/17764) [@inovux](https://github.com/inovux)
+- 🐞 修复 Radio.Button 失效项的边框样式问题。[#17775](https://github.com/ant-design/ant-design/pull/17775)
+- 🐞 修复 DatePicker `@input-hover-border-color` 变量不生效的问题。[#17784](https://github.com/ant-design/ant-design/pull/17784)
+- 🐞 修复 Transfer 在 `lazy` 时更新数据不触发重新渲染的问题。[#17783](https://github.com/ant-design/ant-design/pull/17783)
+- 🐞 修复 RangePicker `defaultValue` 中开始时间可大于结束时间的问题。[#17694](https://github.com/ant-design/ant-design/pull/17694) [@mraiguo](https://github.com/mraiguo)
+- 💄 优化 `placeholder` 文字过长时的截断样式兼容性问题。[#17797](https://github.com/ant-design/ant-design/pull/17797) [@Kapiroska](https://github.com/Kapiroska)
+- 🐞 修复 Menu 循环依赖的问题。[#17805](https://github.com/ant-design/ant-design/pull/17805) [@phthhieu](https://github.com/phthhieu)
+- 🐞 修复 Alert `message` 样式问题。[#17808](https://github.com/ant-design/ant-design/pull/17808) [@mtadams007](https://github.com/mtadams007)
+- 🐞 修复 Result `extra` 部分不居中的问题。[#17786](https://github.com/ant-design/ant-design/pull/17786) [@nnecec](https://github.com/nnecec)
+- 🐞 修复 Progress 在 `value` 较小时，左边条不够圆的问题。[#17819](https://github.com/ant-design/ant-design/pull/17819)
+- 🐞 修复 Statistic.Countdown `format` 不支持方括号保留字符串的问题。[#17841](https://github.com/ant-design/ant-design/pull/17841)
+- 🐞 修复 Table 自定义 `filterDropdown` 在某些情况下消失时总是触发 `onChange` 的问题。[#17846](https://github.com/ant-design/ant-design/pull/17846)
+- 🐞 修复 TimePicker 在 Safari 下的滚动条渲染问题。[#17857](https://github.com/ant-design/ant-design/pull/17857)
+
+## 3.20.5
+
+`2019-07-19`
+
+- 🐞 修复 `<Button type="danger" ghost />` 样式问题。[#17743](https://github.com/ant-design/ant-design/pull/17743)
+
+## 3.20.4
+
+`2019-07-19`
+
+- 🐞 修复多层级 Drawer 的 `mask` 为 false 时，卸载子级组件后父抽屉不收回的问题。[#17698](https://github.com/ant-design/ant-design/pull/17698)
+- 🐞 修复 Table 圆角样式在 Firefox 下丢失的问题。[#17641](https://github.com/ant-design/ant-design/pull/17641)
+- 🐞 修复 Menu 抛出 `Cannot update during an existing state transition` 警告的问题。[#17657](https://github.com/ant-design/ant-design/pull/17657)
+- 🐞 修复 Affix 容器变化时尺寸不变的问题。[#17678](https://github.com/ant-design/ant-design/pull/17678)
+- 🐞 修复 Anchor 监听元素不随着 `getContainer` 变化的问题。[#17677](https://github.com/ant-design/ant-design/pull/17677)
+- 🐞 修复 Modal 和 Drawer 同时使用导致的窗体滚动条冲突的问题。[#17600](https://github.com/ant-design/ant-design/pull/17600)
+- 🌟 Empty `description` 支持 `false`。 [#17659](https://github.com/ant-design/ant-design/pull/17659) [@billfeller](https://github.com/billfeller)
+- 💄 去除 Pagination 元素下划线以防止被全局样式污染。[#17728](https://github.com/ant-design/ant-design/pull/17728)
+- 💄 拓展 Card action 可点击区域。[#17705](https://github.com/ant-design/ant-design/pull/17705) [@lhx6538665](https://github.com/lhx6538665)
+- 💄 对 Less 变量进行了一波调整，以适应更多细节风格定制。[#17697](https://github.com/ant-design/ant-design/pull/17697)
+
+  - 调整危险按钮样式。
+
+    <img width="103" class="markdown-inline-image" alt="image" src="https://user-images.githubusercontent.com/507615/61370809-e37aa480-a8c5-11e9-98b3-51ce06dfba24.png">
+
+  - 修复 `@border-radius-sm` 对 Slider、TreeSelect 不生效的问题。
+  - Progress、Tabs、Slider、Timeline 组件补充 less 变量。
+
+- TypeScript
+  - 💄 完善 Form 的类型定义。[#17676](https://github.com/ant-design/ant-design/pull/17676) [@lixiaoyang1992](https://github.com/lixiaoyang1992)
+  - 💄 完善 Tabs 的类型定义。[#17675](https://github.com/ant-design/ant-design/pull/17675)
+
+## 3.20.3
+
+`2019-07-15`
+
+- 🚨 回滚 [#17508](https://github.com/ant-design/ant-design/pull/17508) 中对 Input 后缀样式的修改，因其导致了其他更多问题。
+
+## 3.20.2
+
+`2019-07-13`
+
+- 📖 文档中增加对组件新特性的版本说明。[#17373](https://github.com/ant-design/ant-design/pull/17373) [@muzea](https://github.com/muzea)
+- 🐞 修复 Button 组件的 loading 样式问题。[#17596](https://github.com/ant-design/ant-design/pull/17596) [@LilyWakana](https://github.com/LilyWakana)
+- Cascader
+  - 🐞 修复 options 为空时不展示空内容的问题。[#17538](https://github.com/ant-design/ant-design/pull/17538)
+  - 🐞 修复 option 的 isLeaf 为 true 时 loading 样式没有对齐的问题。[#17550](https://github.com/ant-design/ant-design/pull/17550)
+  - 🐞 修复文本过长被箭头遮挡的问题。[#17583](https://github.com/ant-design/ant-design/pull/17583)
+- 🐞 修复 Input 组件存在多个后缀图标时的样式错乱问题。[#17508](https://github.com/ant-design/ant-design/pull/17508) [@LilyWakana](https://github.com/LilyWakana)
+- TypeScript
+  - 💄 完善 Cascader 的 `option` 类型定义。[#17581](https://github.com/ant-design/ant-design/pull/17581) [@MrHeer](https://github.com/MrHeer)
+  - 🐞 修复 Descriptions 的 `title` 类型定义。[#17559](https://github.com/ant-design/ant-design/pull/17559)
+  - 🐞 修复 Collapse 的 activeKey、defaultActiveKey 以及 Collapse.Panel 的 key 类型定义。[#17557](https://github.com/ant-design/ant-design/pull/17557) [@thylsky](https://github.com/thylsky)
+
+## 3.20.1
+
+- 💄 优化 TimePicker 聚焦状态的样式。[#17447](https://github.com/ant-design/ant-design/pull/17447)
+- 💄 优化 DatePicker 箭头样式，解决非 utf-8 编码下箭头样式乱码的问题。[#17480](https://github.com/ant-design/ant-design/pull/17480)
+- 🐞 删除 Drawer 中传给 rc-drawer 的不必要的属性避免报错。[#17390](https://github.com/ant-design/ant-design/pull/17390)
+- 🐞 修复 Tabs 当前失效页签样式以及切换图标错位 2px 的问题。[#17500](https://github.com/ant-design/ant-design/pull/17500)
+- 🐞 修复 Result 组件 `className` 为空造成类名错误的问题。[#17389](https://github.com/ant-design/ant-design/pull/17389)
+- 🐞 修复 safari 浏览器 DatePicker 组件输入框被遮挡的问题。[#17421](https://github.com/ant-design/ant-design/pull/17421)
+- 🐞 修复图标名 `colum-height` 为 `column-height`。[#17458](https://github.com/ant-design/ant-design/pull/17458)
+- TypeScript
+  - 🐞 修复 Form `onSubmit` TypeScript 定义。[#17412](https://github.com/ant-design/ant-design/pull/17412)
+  - 🐞 修复 AutoComplete 多余的 `loading` 属性 TypeScript 定义。[#17433](https://github.com/ant-design/ant-design/pull/17433)
+  - 🐞 修复 Switch 的 `onClick` 的 TypeScript 定义。[#17502](https://github.com/ant-design/ant-design/pull/17502) [@DiamondYuan](https://github.com/DiamondYuan)
+
+## 3.20.0
+
+- 🔥🔥🔥 新增 [Result](https://ant.design/components/result) 用于反馈一系列操作任务的处理结果。
+- 🔥 Descriptions 支持垂直布局。[#17330](https://github.com/ant-design/ant-design/pull/17330) [@hengkx](https://github.com/hengkx)
+- 🔥 优化 PageHeader 的 `className` 定义。[#17321](https://github.com/ant-design/ant-design/pull/17321)
+- 🔥 Progress.Circle 支持渐变色。[#17315](https://github.com/ant-design/ant-design/pull/17315) [@hengkx](https://github.com/hengkx)
+
+  <img class="markdown-inline-image" src="https://gw.alipayobjects.com/zos/antfincdn/WogwW6kA4O/method-draw-image.svg" alt="Progress">
+
+- 🐞 Drawer 修复 `maskCloseble` 为 false，键盘 ESC 关闭无效的问题。[#17316](https://github.com/ant-design/ant-design/pull/17316)
+- 🐞 修复在 Edge 下 Drawer 关闭后没有调用 `afterVisibleChange` 的问题。[#17311](https://github.com/ant-design/ant-design/pull/17311)
+- 🌟 Drawer 新增 `keyboard`，允许打开关闭对键盘事件的响应。[#17316](https://github.com/ant-design/ant-design/pull/17316)
+- 🌟 Popconfirm 增加 `disabled` props，用于控制点击子元素是否弹出。[#16985](https://github.com/ant-design/ant-design/pull/16985) [@lhyt](https://github.com/lhyt)
+- ⌨️ 改进 TimePicker 可访问性。[#17099](https://github.com/ant-design/ant-design/pull/17099)
+- 💄 修复 Tooltip 箭头阴影样式。[#17264](https://github.com/ant-design/ant-design/pull/17264)
+- 🐞 修复 Descriptions.Item 不支持 `className` 的问题。[#17280](https://github.com/ant-design/ant-design/pull/17280)
+- 🐞 修复 Descriptions.Item 不设置 label，也会显示 `:` 的问题。[#17337](https://github.com/ant-design/ant-design/pull/17337)
+- 🐞 修复 Mentions 组件的 `placeholder` 颜色不正确的问题。[#17317](https://github.com/ant-design/ant-design/pull/17317)
+- 🐞 修复 Mentions 组件的行高不正确的问题。[#17347](https://github.com/ant-design/ant-design/pull/17347)
+- 💄 按照设计规范修复小号 Table 的背景色。[#17351](https://github.com/ant-design/ant-design/pull/17351)
+- 🌟 CheckboxGroup `onChange` 值保持选项的顺序。[#17342](https://github.com/ant-design/ant-design/pull/17342) [@yoyo837](https://github.com/yoyo837)
+- 🐞 修复 Tooltip 在 disabled Switch 中工作不正确的问题。[#17372](https://github.com/ant-design/ant-design/pull/17372)
+- 💄 增加 less 变量 [#16843](https://github.com/ant-design/ant-design/pull/16843) [#17031](https://github.com/ant-design/ant-design/pull/17031) [#16996](https://github.com/ant-design/ant-design/pull/16996) [@alxkosov](https://github.com/alxkosov)：
+  - `@dropdown-line-height`
+  - `@dropdown-font-size`
+  - `@dropdown-vertical-padding`
+  - `@collapse-panel-border-radius`
+  - `@table-body-selected-sort-bg`
+  - `@table-selected-row-hover-bg`
+- TypeScript
+  - 🌟 改进 Switch 的类型定义。[#17331](https://github.com/ant-design/ant-design/pull/17331)
+  - 🐞 Skeleton AvatarProps `size` 支持 number。[#17331](https://github.com/ant-design/ant-design/pull/17331)
+- 📝 更新了几处文档。[#17336](https://github.com/ant-design/ant-design/pull/17336) [#17345](https://github.com/ant-design/ant-design/pull/17345) [#17355](https://github.com/ant-design/ant-design/pull/17355)
+
+## 3.19.8
+
+`2019-06-24`
+
+- 🐞 回滚 `unknown` 到 `any` 避免一次性引入大量 TS 错误。[#17249](https://github.com/ant-design/ant-design/issues/17249)
+
+## 3.19.7
+
+`2019-06-21`
+
+- 🐞 修复 Descriptions 内无法嵌套空值的问题。[#17207](https://github.com/ant-design/ant-design/pull/17207) [@superandrew213](http://github.com/superandrew213)
+- 🐞 修复 Table 空数据表格在 IE 下的一个滚动条样式问题。[#17223](https://github.com/ant-design/ant-design/pull/17223)
+- 🐞 修复单个 Breadcrumb 未在 PageHeader 上显示的问题。[#17209](https://github.com/ant-design/ant-design/pull/17209)
+- 🐞 修复 Modal 底部 24px 像素遮罩区域无法触发关闭弹窗行为。[#17229](https://github.com/ant-design/ant-design/pull/17229)
+- 🐞 修复 Layout Sider 的展开按钮 `z-index` 太低的问题。[#17228](https://github.com/ant-design/ant-design/pull/17228)
+- TypeScript
+  - ⚡️ 使用 `unknown` 代替 `any` 优化 TypeScript 定义。[#14044](https://github.com/ant-design/ant-design/issues/14044) [@Zzzen](http://github.com/Zzzen)
+  - 🐞 修复 Calendar `headerRender` 属性为可选。[#17063](https://github.com/ant-design/ant-design/pull/17063) [@wonderjar](http://github.com/wonderjar)
+
+## 3.19.6
+
+`2019-06-19`
+
+- 🐞 修复嵌套 Card `extra` 位置不正确的问题。[#17140](https://github.com/ant-design/ant-design/pull/17140)
+- 🐞 修复 Table 动态改变 `filter` 时报错的问题。[#17141](https://github.com/ant-design/ant-design/pull/17141)
+- 🐞 修复 TextArea 和 RangePicker 分隔符位置偏下和对齐的问题。[#17165](https://github.com/ant-design/ant-design/pull/17165)
+
 ## 3.19.5
 
 `2019-06-17`
@@ -259,14 +414,14 @@ timeline: true
 - 🐞 修复 List 分页无法改变每页条数。[#15871](https://github.com/ant-design/ant-design/pull/15871)
 - 🐞 修复 RangePicker 结束时间不可输入。[#15866](https://github.com/ant-design/ant-design/pull/15866)
 - 📝 站点 [Icon](https://ant.design/components/icon-cn/) 支持图标搜索。[#15867](https://github.com/ant-design/ant-design/pull/15867) [@DiamondYuan](https://github.com/DiamondYuan)
-- 🐞 修复 TimePicker `locale` 属性无效的问题。 [#15837](https://github.com/ant-design/ant-design/pull/15837)
+- 🐞 修复 TimePicker `locale` 属性无效的问题。[#15837](https://github.com/ant-design/ant-design/pull/15837)
 - 🐞 修复 Steps 同时使用 `progressDot` 和 `size="small"` 时的样式错乱问题。[#15856](https://github.com/ant-design/ant-design/pull/15856)
-- 🐞 修复 Affix 的内容高度改变时，位置不更新的问题。 [#15899](https://github.com/ant-design/ant-design/pull/15899)
+- 🐞 修复 Affix 的内容高度改变时，位置不更新的问题。[#15899](https://github.com/ant-design/ant-design/pull/15899)
 - Table
   - 🐞 修复 Table 使用排序时，表头设置 `align: right` 失效的问题。[#15895](https://github.com/ant-design/ant-design/pull/15895)
-  - 🐞 修复 Table 筛选使用 string 以外类型的展示问题。 [#15817](https://github.com/ant-design/ant-design/pull/15817)
+  - 🐞 修复 Table 筛选使用 string 以外类型的展示问题。[#15817](https://github.com/ant-design/ant-design/pull/15817)
 - 🐞 修复 Badge `count` 为负数时的显示问题。[#15810](https://github.com/ant-design/ant-design/pull/15810)
-- 💄 优化 `Empty.PRESENTED_IMAGE_SIMPLE` 的默认样式。 [#15841](https://github.com/ant-design/ant-design/pull/15841)
+- 💄 优化 `Empty.PRESENTED_IMAGE_SIMPLE` 的默认样式。[#15841](https://github.com/ant-design/ant-design/pull/15841)
 - 🌟 新增 less 变量 `@html-selector` 用于支持主题前缀。[#15613](https://github.com/ant-design/ant-design/pull/15613) [@krokofant](https://github.com/krokofant)
 - TypeScript
   - 🐞 修复 Table `columnGroup` 定义。[fc45d](https://github.com/ant-design/ant-design/commit/fc45d7003efab225298bbc7ac740df40d34872d1)
@@ -340,7 +495,7 @@ timeline: true
 
 `2019-03-17`
 
-- 🌟 补充了 less 变量 `@pagination-item-bg-active`、`@icon-color`。 [#15302](https://github.com/ant-design/ant-design/pull/15302) [#15345](https://github.com/ant-design/ant-design/pull/15345)
+- 🌟 补充了 less 变量 `@pagination-item-bg-active`、`@icon-color`。[#15302](https://github.com/ant-design/ant-design/pull/15302) [#15345](https://github.com/ant-design/ant-design/pull/15345)
 - 🐞 修复引入 PageHeader 导致 tree-shaking 失效的问题。[#15354](https://github.com/ant-design/ant-design/pull/15354)
 - List
   - 🐞 修复 List 的一些样式问题。[#15328](https://github.com/ant-design/ant-design/pull/15328)
@@ -392,8 +547,8 @@ timeline: true
 
 `2019-03-04`
 
-- 🌟 PageHeader 支持 `className` prop。 [#15159](https://github.com/ant-design/ant-design/pull/15159)
-- 🐞 修复 Form 输出警告信息的问题。 [#15160](https://github.com/ant-design/ant-design/pull/15160)
+- 🌟 PageHeader 支持 `className` prop。[#15159](https://github.com/ant-design/ant-design/pull/15159)
+- 🐞 修复 Form 输出警告信息的问题。[#15160](https://github.com/ant-design/ant-design/pull/15160)
 - 🐞 修复 ConfigProvider 中 getPopupContainer 对于 DatePicker 无效的问题。[#15156](https://github.com/ant-design/ant-design/pull/15156)
 - 🐞 修复 Collapse `extra` 位置错误的问题。[#15176](https://github.com/ant-design/ant-design/pull/15176)
 
@@ -478,7 +633,7 @@ timeline: true
   - 🐞 修复 `pagination` 为 `true` 时报错的问题。
   - 🐞 修复过滤下拉框会被遮挡的问题。[#11730](https://github.com/ant-design/ant-design/issues/11730)
 - TypeScript 类型
-  - 🐞 修复 Checkbox 缺少的 `onClick` 类型。 [#14762](https://github.com/ant-design/ant-design/pull/14762) [@Frezc](https://github.com/Frezc)
+  - 🐞 修复 Checkbox 缺少的 `onClick` 类型。[#14762](https://github.com/ant-design/ant-design/pull/14762) [@Frezc](https://github.com/Frezc)
   - 🐞 修复 Menu 缺少的 `onTitleMouseEnter` 和 `onTitleMouseLeave` 类型。[#14737](https://github.com/ant-design/ant-design/pull/14737) [#GabeMedrash](https://github.com/ant-design/ant-design/pull/14737)
 
 ## 3.13.2
@@ -802,8 +957,8 @@ timeline: true
   - 🌟 onCell 方法增加 `index` 参数。[#222](https://github.com/react-component/table/pull/222) [@yoyo837](https://github.com/yoyo837)
 - Select 组件升级 `rc-select` 到 `8.6.0`
   - 🌟 增加 `removeIcon`、`clearIcon`、`menuItemSelectedIcon` 属性，用于自定义删除、清空、选中的图标。[#12958](https://github.com/ant-design/ant-design/pull/12958) [@kimochg](https://github.com/kimochg)
-  - 🌟 增加 `dropdownRender` 属性， 用于自定义下拉框内容。[#10831](https://github.com/ant-design/ant-design/issues/10831)
-  - 🌟 增加 `loading` 属性， 用于展示加载中状态。[#11225](https://github.com/ant-design/ant-design/issues/11225)
+  - 🌟 增加 `dropdownRender` 属性，用于自定义下拉框内容。[#10831](https://github.com/ant-design/ant-design/issues/10831)
+  - 🌟 增加 `loading` 属性，用于展示加载中状态。[#11225](https://github.com/ant-design/ant-design/issues/11225)
 - 💄 Menu.Item 组件增加 `title` 属性，用于在收缩时展示的悬浮标题。[#12952](https://github.com/ant-design/ant-design/pull/12952)
 - Cascader 升级 `rc-calendar` 到 `9.8.0`
   - 🌟 支持多种时间格式。[#437](https://github.com/react-component/calendar/pull/437) [@onlyann](https://github.com/onlyann)
@@ -1067,7 +1222,7 @@ timeline: true
 
 在开学之际我们带来了久违的 `3.9.0` 的更新。多个重量级的新特性和大量修复，使 Ant Design 的能力显著提升。
 
-- 🔥🔥🔥 在 `3.9.0` 版本中，我们重绘了所有的图标，新增了两大类，超过 90 个新图标，并且为每个图标增加了多种风格。为此我们重写了 Icon 组件，使用 `SVG` 替换了 `fontface` 图标，增加了多个特性，可以快速的使用新的图标和风格。 ![](https://gw.alipayobjects.com/zos/rmsportal/CVDHuodLwcDeyQBDoUIZ.png)
+- 🔥🔥🔥 在 `3.9.0` 版本中，我们重绘了所有的图标，新增了两大类，超过 90 个新图标，并且为每个图标增加了多种风格。为此我们重写了 Icon 组件，使用 `SVG` 替换了 `fontface` 图标，增加了多个特性，可以快速的使用新的图标和风格。![](https://gw.alipayobjects.com/zos/rmsportal/CVDHuodLwcDeyQBDoUIZ.png)
   - 💄 使用 `SVG` 图标替换了 `css` 字体图标，[可以看这里的讨论了解 svg 的优势](https://github.com/ant-design/ant-design/issues/10353)。
   - 💄 提供了三套图标风格线性、实色和双色图标，默认为线性风格。
   - 🌟 新增了 **编辑类** 和 **数据类** 两个新类别。
@@ -1907,8 +2062,8 @@ timeline: true
 
 ### 以下在 2.x 中废弃的特性被移除
 
-- 🗑 移除了 DatePicker.Calendar， 请直接使用 Calendar 组件。
-- 🗑 移除了 DatePicker 的 `toggleOpen` 属性， 请使用 `onOpenChange` 代替。
+- 🗑 移除了 DatePicker.Calendar，请直接使用 Calendar 组件。
+- 🗑 移除了 DatePicker 的 `toggleOpen` 属性，请使用 `onOpenChange` 代替。
 - 🗑 移除了 Form 的 `inline`、`horizontal`、`vertical` 属性，请使用 `layout` 代替。
 - 🗑 移除了 Select 的 `multiple`、`tags`、`combobox` 属性，请使用 `mode` 代替。
 - 🗑 移除了 Input 对 `type='textarea'` 的支持，请直接使用 `Input.TextArea` 组件。

README-zh_CN.md

@@ -80,6 +80,11 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
 - [更新日志](CHANGELOG.en-US.md)
 - [React 底层基础组件](http://react-component.github.io/)
 - [移动端组件](http://mobile.ant.design)
+- [Ant Design 图标](https://github.com/ant-design/ant-design-icons)
+- [Ant Design 色彩](https://github.com/ant-design/ant-design-colors)
+- [Ant Design Pro 布局组件](https://github.com/ant-design/ant-design-pro-layout)
+- [Ant Design Pro 区块集](https://github.com/ant-design/pro-blocks)
+- [Dark Theme](https://github.com/ant-design/ant-design-dark-theme)
 - [首页模板集](https://landing.ant.design)
 - [动效](https://motion.ant.design)
 - [脚手架市场](http://scaffold.ant.design)

README.md

@@ -80,6 +80,11 @@ See [i18n](http://ant.design/docs/react/i18n).
 - [Change Log](CHANGELOG.en-US.md)
 - [rc-components](http://react-component.github.io/)
 - [Mobile UI](http://mobile.ant.design)
+- [Ant Design Icons](https://github.com/ant-design/ant-design-icons)
+- [Ant Design Colors](https://github.com/ant-design/ant-design-colors)
+- [Ant Design Pro Layout](https://github.com/ant-design/ant-design-pro-layout)
+- [Ant Design Pro Blocks](https://github.com/ant-design/pro-blocks)
+- [Dark Theme](https://github.com/ant-design/ant-design-dark-theme)
 - [Landing Pages](https://landing.ant.design)
 - [Motion](https://motion.ant.design)
 - [Scaffold Market](http://scaffold.ant.design)

components/__tests__/__snapshots__/index.test.js.snap

@@ -46,6 +46,7 @@ Array [
   "Progress",
   "Radio",
   "Rate",
+  "Result",
   "Row",
   "Select",
   "Skeleton",

components/_util/__tests__/util.test.js

@@ -169,7 +169,11 @@ describe('Test utils function', () => {
 
     it('should not throw when click it', () => {
       expect(() => {
-        const wrapper = mount(<Wave><div /></Wave>);
+        const wrapper = mount(
+          <Wave>
+            <div />
+          </Wave>,
+        );
         wrapper.simulate('click');
       }).not.toThrow();
     });
@@ -184,9 +188,7 @@ describe('Test utils function', () => {
 
   describe('TransButton', () => {
     it('can be focus/blur', () => {
-      const wrapper = mount(
-        <TransButton>TransButton</TransButton>,
-      );
+      const wrapper = mount(<TransButton>TransButton</TransButton>);
       expect(typeof wrapper.instance().focus).toBe('function');
       expect(typeof wrapper.instance().blur).toBe('function');
     });
@@ -194,9 +196,7 @@ describe('Test utils function', () => {
     it('should trigger onClick when press enter', () => {
       const onClick = jest.fn();
       const preventDefault = jest.fn();
-      const wrapper = mount(
-        <TransButton onClick={onClick}>TransButton</TransButton>,
-      );
+      const wrapper = mount(<TransButton onClick={onClick}>TransButton</TransButton>);
       wrapper.simulate('keyUp', { keyCode: KeyCode.ENTER });
       expect(onClick).toHaveBeenCalled();
       wrapper.simulate('keyDown', { keyCode: KeyCode.ENTER, preventDefault });

components/_util/interopDefault.ts

@@ -1,4 +1,5 @@
 // https://github.com/moment/moment/issues/3650
+// since we are using ts 3.5.1, it should be safe to remove.
 export default function interopDefault(m: any) {
   return m.default || m;
 }

components/affix/__tests__/Affix.test.js

@@ -162,29 +162,37 @@ describe('Affix Render', () => {
     });
   });
 
-  it('updatePosition when size changed', () => {
-    document.body.innerHTML = '<div id="mounter" />';
+  describe('updatePosition when size changed', () => {
+    function test(name, index) {
+      it(name, () => {
+        document.body.innerHTML = '<div id="mounter" />';
 
-    const updateCalled = jest.fn();
-    wrapper = mount(<AffixMounter offsetBottom={0} onTestUpdatePosition={updateCalled} />, {
-      attachTo: document.getElementById('mounter'),
-    });
+        const updateCalled = jest.fn();
+        wrapper = mount(<AffixMounter offsetBottom={0} onTestUpdatePosition={updateCalled} />, {
+          attachTo: document.getElementById('mounter'),
+        });
 
-    jest.runAllTimers();
+        jest.runAllTimers();
 
-    movePlaceholder(300);
-    expect(wrapper.instance().affix.state.affixStyle).toBeTruthy();
-    jest.runAllTimers();
-    wrapper.update();
+        movePlaceholder(300);
+        expect(wrapper.instance().affix.state.affixStyle).toBeTruthy();
+        jest.runAllTimers();
+        wrapper.update();
 
-    // Mock trigger resize
-    updateCalled.mockReset();
-    wrapper
-      .find('ReactResizeObserver')
-      .instance()
-      .onResize();
-    jest.runAllTimers();
+        // Mock trigger resize
+        updateCalled.mockReset();
+        wrapper
+          .find('ReactResizeObserver')
+          .at(index)
+          .instance()
+          .onResize();
+        jest.runAllTimers();
 
-    expect(updateCalled).toHaveBeenCalled();
+        expect(updateCalled).toHaveBeenCalled();
+      });
+    }
+
+    test('inner', 0);
+    test('outer', 1);
   });
 });

components/affix/__tests__/__snapshots__/demo.test.js.snap

@@ -34,6 +34,37 @@ exports[`renders ./components/affix/demo/basic.md correctly 1`] = `
 </div>
 `;
 
+exports[`renders ./components/affix/demo/debug.md correctly 1`] = `
+<div
+  style="height:10000px"
+>
+  <div>
+    Top
+  </div>
+  <div>
+    <div
+      class=""
+    >
+      <div
+        style="background:red"
+      >
+        <button
+          class="ant-btn ant-btn-primary"
+          type="button"
+        >
+          <span>
+            Affix top
+          </span>
+        </button>
+      </div>
+    </div>
+  </div>
+  <div>
+    Bottom
+  </div>
+</div>
+`;
+
 exports[`renders ./components/affix/demo/on-change.md correctly 1`] = `
 <div>
   <div

components/affix/demo/debug.md

@@ -0,0 +1,50 @@
+---
+order: 99
+title:
+  zh-CN: 调试
+  en-US: Debug
+debug: true
+---
+
+## zh-CN
+
+DEBUG
+
+## en-US
+
+DEBUG
+
+```jsx
+import { Affix, Button } from 'antd';
+
+class Demo extends React.Component {
+  state = {
+    top: 10,
+  };
+
+  render() {
+    return (
+      <div style={{ height: 10000 }}>
+        <div>Top</div>
+        <Affix offsetTop={this.state.top}>
+          <div style={{ background: 'red' }}>
+            <Button
+              type="primary"
+              onClick={() => {
+                this.setState({
+                  top: this.state.top + 10,
+                });
+              }}
+            >
+              Affix top
+            </Button>
+          </div>
+        </Affix>
+        <div>Bottom</div>
+      </div>
+    );
+  }
+}
+
+ReactDOM.render(<Demo />, mountNode);
+```

components/affix/index.en-US.md

@@ -14,12 +14,12 @@ Please note that Affix should not cover other content on the page, especially wh
 
 ## API
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| offsetBottom | Pixels to offset from bottom when calculating position of scroll | number | - |
-| offsetTop | Pixels to offset from top when calculating position of scroll | number | 0 |
-| target | specifies the scrollable area dom node | () => HTMLElement | () => window |
-| onChange | Callback for when affix state is changed | Function(affixed) | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| offsetBottom | Pixels to offset from bottom when calculating position of scroll | number | - |  |
+| offsetTop | Pixels to offset from top when calculating position of scroll | number | 0 |  |
+| target | specifies the scrollable area dom node | () => HTMLElement | () => window |  |
+| onChange | Callback for when affix state is changed | Function(affixed) | - |  |
 
 **Note:** Children of `Affix` can not be `position: absolute`, but you can set `Affix` as `position: absolute`:
 

components/affix/index.tsx

@@ -256,8 +256,8 @@ class Affix extends React.Component<AffixProps, AffixState> {
 
   // =================== Render ===================
   renderAffix = ({ getPrefixCls }: ConfigConsumerProps) => {
-    const { affixStyle, placeholderStyle, status } = this.state;
-    const { prefixCls, style, children } = this.props;
+    const { affixStyle, placeholderStyle } = this.state;
+    const { prefixCls, children } = this.props;
     const className = classNames({
       [getPrefixCls('affix', prefixCls)]: affixStyle,
     });
@@ -267,22 +267,26 @@ class Affix extends React.Component<AffixProps, AffixState> {
     if (process.env.NODE_ENV === 'test') {
       props = omit(props, ['onTestUpdatePosition']);
     }
-    const mergedPlaceholderStyle = {
-      ...(status === AffixStatus.None ? placeholderStyle : null),
-      ...style,
-    };
+
     return (
-      <div {...props} style={mergedPlaceholderStyle} ref={this.savePlaceholderNode}>
-        <div className={className} ref={this.saveFixedNode} style={this.state.affixStyle}>
-          <ResizeObserver
-            onResize={() => {
-              this.updatePosition();
-            }}
-          >
-            {children}
-          </ResizeObserver>
+      <ResizeObserver
+        onResize={() => {
+          this.updatePosition();
+        }}
+      >
+        <div {...props} ref={this.savePlaceholderNode}>
+          {affixStyle && <div style={placeholderStyle} aria-hidden="true" />}
+          <div className={className} ref={this.saveFixedNode} style={affixStyle}>
+            <ResizeObserver
+              onResize={() => {
+                this.updatePosition();
+              }}
+            >
+              {children}
+            </ResizeObserver>
+          </div>
         </div>
-      </div>
+      </ResizeObserver>
     );
   };
 

components/affix/index.zh-CN.md

@@ -15,12 +15,12 @@ title: Affix
 
 ## API
 
-| 成员 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| offsetBottom | 距离窗口底部达到指定偏移量后触发 | number |  |
-| offsetTop | 距离窗口顶部达到指定偏移量后触发 | number |  |
-| target | 设置 `Affix` 需要监听其滚动事件的元素，值为一个返回对应 DOM 元素的函数 | () => HTMLElement | () => window |
-| onChange | 固定状态改变时触发的回调函数 | Function(affixed) | 无 |
+| 成员 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| offsetBottom | 距离窗口底部达到指定偏移量后触发 | number |  |  |
+| offsetTop | 距离窗口顶部达到指定偏移量后触发 | number |  |  |
+| target | 设置 `Affix` 需要监听其滚动事件的元素，值为一个返回对应 DOM 元素的函数 | () => HTMLElement | () => window |  |
+| onChange | 固定状态改变时触发的回调函数 | Function(affixed) | 无 |  |
 
 **注意：**`Affix` 内的元素不要使用绝对定位，如需要绝对定位的效果，可以直接设置 `Affix` 为绝对定位：
 

components/alert/index.en-US.md

@@ -13,15 +13,15 @@ Alert component for feedback.
 
 ## API
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| afterClose | Called when close animation is finished | () => void | - |
-| banner | Whether to show as banner | boolean | false |
-| closable | Whether Alert can be closed | boolean | - |
-| closeText | Close text to show | string\|ReactNode | - |
-| description | Additional content of Alert | string\|ReactNode | - |
-| icon | Custom icon, effective when `showIcon` is `true` | ReactNode | - |
-| message | Content of Alert | string\|ReactNode | - |
-| showIcon | Whether to show icon | boolean | false, in `banner` mode default is true |
-| type | Type of Alert styles, options: `success`, `info`, `warning`, `error` | string | `info`, in `banner` mode default is `warning` |
-| onClose | Callback when Alert is closed | (e: MouseEvent) => void | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| afterClose | Called when close animation is finished | () => void | - | 3.3.1 |
+| banner | Whether to show as banner | boolean | false |  |
+| closable | Whether Alert can be closed | boolean | - |  |
+| closeText | Close text to show | string\|ReactNode | - |  |
+| description | Additional content of Alert | string\|ReactNode | - |  |
+| icon | Custom icon, effective when `showIcon` is `true` | ReactNode | - | 3.10.0 |
+| message | Content of Alert | string\|ReactNode | - |  |
+| showIcon | Whether to show icon | boolean | false, in `banner` mode default is true |  |
+| type | Type of Alert styles, options: `success`, `info`, `warning`, `error` | string | `info`, in `banner` mode default is `warning` |  |
+| onClose | Callback when Alert is closed | (e: MouseEvent) => void | - |  |

components/alert/index.zh-CN.md

@@ -14,15 +14,15 @@ title: Alert
 
 ## API
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| afterClose | 关闭动画结束后触发的回调函数 | () => void | - |
-| banner | 是否用作顶部公告 | boolean | false |
-| closable | 默认不显示关闭按钮 | boolean | 无 |
-| closeText | 自定义关闭按钮 | string\|ReactNode | 无 |
-| description | 警告提示的辅助性文字介绍 | string\|ReactNode | 无 |
-| icon | 自定义图标，`showIcon` 为 `true` 时有效 | ReactNode | - |
-| message | 警告提示内容 | string\|ReactNode | 无 |
-| showIcon | 是否显示辅助图标 | boolean | false，`banner` 模式下默认值为 true |
-| type | 指定警告提示的样式，有四种选择 `success`、`info`、`warning`、`error` | string | `info`，`banner` 模式下默认值为 `warning` |
-| onClose | 关闭时触发的回调函数 | (e: MouseEvent) => void | 无 |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| afterClose | 关闭动画结束后触发的回调函数 | () => void | - | 3.3.1 |
+| banner | 是否用作顶部公告 | boolean | false |  |
+| closable | 默认不显示关闭按钮 | boolean | 无 |  |
+| closeText | 自定义关闭按钮 | string\|ReactNode | 无 |  |
+| description | 警告提示的辅助性文字介绍 | string\|ReactNode | 无 |  |
+| icon | 自定义图标，`showIcon` 为 `true` 时有效 | ReactNode | - | 3.10.0 |
+| message | 警告提示内容 | string\|ReactNode | 无 |  |
+| showIcon | 是否显示辅助图标 | boolean | false，`banner` 模式下默认值为 true |  |
+| type | 指定警告提示的样式，有四种选择 `success`、`info`、`warning`、`error` | string | `info`，`banner` 模式下默认值为 `warning` |  |
+| onClose | 关闭时触发的回调函数 | (e: MouseEvent) => void | 无 |  |

components/alert/style/index.less

@@ -124,6 +124,10 @@
     font-size: @font-size-lg;
   }
 
+  &-message {
+    color: @alert-message-color;
+  }
+
   &-with-description &-description {
     display: block;
   }

components/anchor/Anchor.tsx

@@ -145,6 +145,8 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
   };
 
   private inkNode: HTMLSpanElement;
+  // scroll scope's container
+  private scrollContainer: HTMLElement | Window;
 
   private links: string[] = [];
   private scrollEvent: any;
@@ -174,7 +176,8 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
 
   componentDidMount() {
     const { getContainer } = this.props as AnchorDefaultProps;
-    this.scrollEvent = addEventListener(getContainer(), 'scroll', this.handleScroll);
+    this.scrollContainer = getContainer();
+    this.scrollEvent = addEventListener(this.scrollContainer, 'scroll', this.handleScroll);
     this.handleScroll();
   }
 
@@ -185,6 +188,16 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
   }
 
   componentDidUpdate() {
+    if (this.scrollEvent) {
+      const { getContainer } = this.props as AnchorDefaultProps;
+      const currentContainer = getContainer();
+      if (this.scrollContainer !== currentContainer) {
+        this.scrollContainer = currentContainer;
+        this.scrollEvent.remove();
+        this.scrollEvent = addEventListener(this.scrollContainer, 'scroll', this.handleScroll);
+        this.handleScroll();
+      }
+    }
     this.updateInk();
   }
 
@@ -192,10 +205,14 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
     if (this.animating) {
       return;
     }
+    const { activeLink } = this.state;
     const { offsetTop, bounds } = this.props;
-    this.setState({
-      activeLink: this.getCurrentAnchor(offsetTop, bounds),
-    });
+    const currentActiveLink = this.getCurrentAnchor(offsetTop, bounds);
+    if (activeLink !== currentActiveLink) {
+      this.setState({
+        activeLink: currentActiveLink,
+      });
+    }
   };
 
   handleScrollTo = (link: string) => {

components/anchor/AnchorLink.tsx

@@ -9,7 +9,7 @@ export interface AnchorLinkProps {
   prefixCls?: string;
   href: string;
   title: React.ReactNode;
-  children?: any;
+  children?: React.ReactNode;
   className?: string;
 }
 

components/anchor/__tests__/Anchor.test.js

@@ -4,6 +4,8 @@ import Anchor from '..';
 
 const { Link } = Anchor;
 
+const delay = timeout => new Promise(resolve => setTimeout(resolve, timeout));
+
 describe('Anchor Render', () => {
   it('Anchor render perfectly', () => {
     const wrapper = mount(
@@ -62,7 +64,7 @@ describe('Anchor Render', () => {
     wrapper.instance().handleScrollTo('##API');
     expect(wrapper.instance().state.activeLink).toBe('##API');
     expect(scrollToSpy).not.toHaveBeenCalled();
-    await new Promise(resolve => setTimeout(resolve, 1000));
+    await delay(1000);
     expect(scrollToSpy).toHaveBeenCalled();
   });
 
@@ -130,4 +132,116 @@ describe('Anchor Render', () => {
     expect(event).not.toBe(undefined);
     expect(link).toEqual({ href, title });
   });
+
+  it('Different function returns the same DOM', async () => {
+    let root = document.getElementById('root');
+    if (!root) {
+      root = document.createElement('div', { id: 'root' });
+      root.id = 'root';
+      document.body.appendChild(root);
+    }
+    mount(<div id="API">Hello</div>, { attachTo: root });
+    const getContainerA = () => {
+      return document.getElementById('API');
+    };
+    const getContainerB = () => {
+      return document.getElementById('API');
+    };
+
+    const wrapper = mount(
+      <Anchor getContainer={getContainerA}>
+        <Link href="#API" title="API" />
+      </Anchor>,
+    );
+    const removeListenerSpy = jest.spyOn(wrapper.instance().scrollEvent, 'remove');
+    await delay(1000);
+    wrapper.setProps({ getContainer: getContainerB });
+    expect(removeListenerSpy).not.toHaveBeenCalled();
+  });
+
+  it('Different function returns different DOM', async () => {
+    let root = document.getElementById('root');
+    if (!root) {
+      root = document.createElement('div', { id: 'root' });
+      root.id = 'root';
+      document.body.appendChild(root);
+    }
+    mount(
+      <div>
+        <div id="API1">Hello</div>
+        <div id="API2">World</div>
+      </div>,
+      { attachTo: root },
+    );
+    const getContainerA = () => {
+      return document.getElementById('API1');
+    };
+    const getContainerB = () => {
+      return document.getElementById('API2');
+    };
+    const wrapper = mount(
+      <Anchor getContainer={getContainerA}>
+        <Link href="#API1" title="API1" />
+        <Link href="#API2" title="API2" />
+      </Anchor>,
+    );
+    const removeListenerSpy = jest.spyOn(wrapper.instance().scrollEvent, 'remove');
+    expect(removeListenerSpy).not.toHaveBeenCalled();
+    await delay(1000);
+    wrapper.setProps({ getContainer: getContainerB });
+    expect(removeListenerSpy).toHaveBeenCalled();
+  });
+
+  it('Same function returns the same DOM', () => {
+    let root = document.getElementById('root');
+    if (!root) {
+      root = document.createElement('div', { id: 'root' });
+      root.id = 'root';
+      document.body.appendChild(root);
+    }
+    mount(<div id="API">Hello</div>, { attachTo: root });
+    const getContainer = () => document.getElementById('API');
+    const wrapper = mount(
+      <Anchor getContainer={getContainer}>
+        <Link href="#API" title="API" />
+      </Anchor>,
+    );
+    wrapper.find('a[href="#API"]').simulate('click');
+    wrapper.instance().handleScroll();
+    expect(wrapper.instance().state).not.toBe(null);
+  });
+
+  it('Same function returns different DOM', async () => {
+    let root = document.getElementById('root');
+    if (!root) {
+      root = document.createElement('div', { id: 'root' });
+      root.id = 'root';
+      document.body.appendChild(root);
+    }
+    mount(
+      <div>
+        <div id="API1">Hello</div>
+        <div id="API2">World</div>
+      </div>,
+      { attachTo: root },
+    );
+    const holdContainer = {
+      container: document.getElementById('API1'),
+    };
+    const getContainer = () => {
+      return holdContainer.container;
+    };
+    const wrapper = mount(
+      <Anchor getContainer={getContainer}>
+        <Link href="#API1" title="API1" />
+        <Link href="#API2" title="API2" />
+      </Anchor>,
+    );
+    const removeListenerSpy = jest.spyOn(wrapper.instance().scrollEvent, 'remove');
+    expect(removeListenerSpy).not.toHaveBeenCalled();
+    await delay(1000);
+    holdContainer.container = document.getElementById('API2');
+    wrapper.setProps({ 'data-only-trigger-re-render': true });
+    expect(removeListenerSpy).toHaveBeenCalled();
+  });
 });

components/anchor/index.en-US.md

@@ -15,19 +15,19 @@ For displaying anchor hyperlinks on page and jumping between them.
 
 ### Anchor Props
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| affix | Fixed mode of Anchor | boolean | true |
-| bounds | Bounding distance of anchor area | number | 5(px) |
-| getContainer | Scrolling container | () => HTMLElement | () => window |
-| offsetBottom | Pixels to offset from bottom when calculating position of scroll | number | - |
-| offsetTop | Pixels to offset from top when calculating position of scroll | number | 0 |
-| showInkInFixed | Whether show ink-balls in Fixed mode | boolean | false |
-| onClick | set the handler to handle `click` event | Function(e: Event, link: Object) | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| affix | Fixed mode of Anchor | boolean | true |  |
+| bounds | Bounding distance of anchor area | number | 5(px) |  |
+| getContainer | Scrolling container | () => HTMLElement | () => window | 3.4.0 |
+| offsetBottom | Pixels to offset from bottom when calculating position of scroll | number | - |  |
+| offsetTop | Pixels to offset from top when calculating position of scroll | number | 0 |  |
+| showInkInFixed | Whether show ink-balls in Fixed mode | boolean | false |  |
+| onClick | set the handler to handle `click` event | Function(e: Event, link: Object) | - | 3.9.0 |
 
 ### Link Props
 
-| Property | Description          | Type              | Default |
-| -------- | -------------------- | ----------------- | ------- |
-| href     | target of hyperlink  | string            |         |
-| title    | content of hyperlink | string\|ReactNode |         |
+| Property | Description          | Type              | Default | Version |
+| -------- | -------------------- | ----------------- | ------- | ------- |
+| href     | target of hyperlink  | string            |         |         |
+| title    | content of hyperlink | string\|ReactNode |         |         |

components/anchor/index.zh-CN.md

@@ -16,19 +16,19 @@ title: Anchor
 
 ### Anchor Props
 
-| 成员 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| affix | 固定模式 | boolean | true |
-| bounds | 锚点区域边界 | number | 5(px) |
-| getContainer | 指定滚动的容器 | () => HTMLElement | () => window |
-| offsetBottom | 距离窗口底部达到指定偏移量后触发 | number |  |
-| offsetTop | 距离窗口顶部达到指定偏移量后触发 | number |  |
-| showInkInFixed | 固定模式是否显示小圆点 | boolean | false |
-| onClick | `click` 事件的 handler | Function(e: Event, link: Object) | - |
+| 成员 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| affix | 固定模式 | boolean | true |  |
+| bounds | 锚点区域边界 | number | 5(px) |  |
+| getContainer | 指定滚动的容器 | () => HTMLElement | () => window | 3.4.0 |
+| offsetBottom | 距离窗口底部达到指定偏移量后触发 | number |  |  |
+| offsetTop | 距离窗口顶部达到指定偏移量后触发 | number |  |  |
+| showInkInFixed | 固定模式是否显示小圆点 | boolean | false |  |
+| onClick | `click` 事件的 handler | Function(e: Event, link: Object) | - | 3.9.0 |
 
 ### Link Props
 
-| 成员  | 说明     | 类型              | 默认值 |
-| ----- | -------- | ----------------- | ------ |
-| href  | 锚点链接 | string            |        |
-| title | 文字内容 | string\|ReactNode |        |
+| 成员  | 说明     | 类型              | 默认值 | 版本 |
+| ----- | -------- | ----------------- | ------ | ---- |
+| href  | 锚点链接 | string            |        |      |
+| title | 文字内容 | string\|ReactNode |        |      |

components/auto-complete/index.en-US.md

@@ -18,33 +18,33 @@ const dataSource = ['12345', '23456', '34567'];
 <AutoComplete dataSource={dataSource} />;
 ```
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| allowClear | Show clear button, effective in multiple mode only. | boolean | false |
-| autoFocus | get focus when component mounted | boolean | false |
-| backfill | backfill selected item the input when using keyboard | boolean | false |
-| children (for customize input element) | customize input element | HTMLInputElement / HTMLTextAreaElement / React.ReactElement<InputProps> | `<Input />` |
-| children (for dataSource) | Data source for autocomplet | React.ReactElement<OptionProps> / Array&lt;React.ReactElement<OptionProps>> | - |
-| dataSource | Data source for autocomplete | [DataSourceItemType](https://git.io/vMMKF)\[] |  |
-| defaultActiveFirstOption | Whether active first option by default | boolean | true |
-| defaultValue | Initial selected option. | string\|string\[]\| - |
-| disabled | Whether disabled select | boolean | false |
-| filterOption | If true, filter options by input, if function, filter options against it. The function will receive two arguments, `inputValue` and `option`, if the function returns `true`, the option will be included in the filtered set; Otherwise, it will be excluded. | boolean or function(inputValue, option) | true |
-| optionLabelProp | Which prop value of option will render as content of select. | string | `children` |
-| placeholder | placeholder of input | string | - |
-| value | selected option | string\|string\[]\|{ key: string, label: string\|ReactNode }\|Array&lt;{ key: string, label: string\|ReactNode }> | - |
-| onBlur | Called when leaving the component. | function() | - |
-| onChange | Called when select an option or input value change, or value of input is changed | function(value) | - |
-| onFocus | Called when entering the component | function() | - |
-| onSearch | Called when searching items. | function(value) | - |
-| onSelect | Called when a option is selected. param is option's value and option instance. | function(value, option) | - |
-| defaultOpen | Initial open state of dropdown | boolean | - |
-| open | Controlled open state of dropdown | boolean | - |
-| onDropdownVisibleChange | Call when dropdown open | function(open) | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| allowClear | Show clear button, effective in multiple mode only. | boolean | false |  |
+| autoFocus | get focus when component mounted | boolean | false |  |
+| backfill | backfill selected item the input when using keyboard | boolean | false |  |
+| children (for customize input element) | customize input element | HTMLInputElement / HTMLTextAreaElement / React.ReactElement<InputProps> | `<Input />` |  |
+| children (for dataSource) | Data source for autocomplete | React.ReactElement<OptionProps> / Array&lt;React.ReactElement<OptionProps>> | - |  |
+| dataSource | Data source for autocomplete | [DataSourceItemType](https://git.io/vMMKF)\[] | - |  |
+| defaultActiveFirstOption | Whether active first option by default | boolean | true |  |
+| defaultValue | Initial selected option. | string\|string\[] | - |  |
+| disabled | Whether disabled select | boolean | false |  |
+| filterOption | If true, filter options by input, if function, filter options against it. The function will receive two arguments, `inputValue` and `option`, if the function returns `true`, the option will be included in the filtered set; Otherwise, it will be excluded. | boolean or function(inputValue, option) | true |  |
+| optionLabelProp | Which prop value of option will render as content of select. | string | `children` |  |
+| placeholder | placeholder of input | string | - |  |
+| value | selected option | string\|string\[]\|{ key: string, label: string\|ReactNode }\|Array&lt;{ key: string, label: string\|ReactNode }> | - |  |
+| onBlur | Called when leaving the component. | function() | - | 3.6.5 |
+| onChange | Called when select an option or input value change, or value of input is changed | function(value) | - |  |
+| onFocus | Called when entering the component | function() | - | 3.6.5 |
+| onSearch | Called when searching items. | function(value) | - |  |
+| onSelect | Called when a option is selected. param is option's value and option instance. | function(value, option) | - |  |
+| defaultOpen | Initial open state of dropdown | boolean | - | 3.9.3 |
+| open | Controlled open state of dropdown | boolean | - | 3.9.3 |
+| onDropdownVisibleChange | Call when dropdown open | function(open) | - | 3.9.3 |
 
 ## Methods
 
-| Name    | Description  |
-| ------- | ------------ |
-| blur()  | remove focus |
-| focus() | get focus    |
+| Name    | Description  | Version |
+| ------- | ------------ | ------- |
+| blur()  | remove focus |         |
+| focus() | get focus    |         |

components/auto-complete/index.tsx

@@ -5,6 +5,7 @@ import InputElement from './InputElement';
 import Input, { InputProps } from '../input';
 import Select, { AbstractSelectProps, SelectValue, OptionProps, OptGroupProps } from '../select';
 import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
+import { Omit } from '../_util/type';
 
 export interface DataSourceItemObject {
   value: string;
@@ -26,7 +27,7 @@ export type ValidInputElement =
   | HTMLTextAreaElement
   | React.ReactElement<AutoCompleteInputProps>;
 
-export interface AutoCompleteProps extends AbstractSelectProps {
+export interface AutoCompleteProps extends Omit<AbstractSelectProps, 'loading'> {
   value?: SelectValue;
   defaultValue?: SelectValue;
   dataSource?: DataSourceItemType[];

components/auto-complete/index.zh-CN.md

@@ -19,34 +19,34 @@ const dataSource = ['12345', '23456', '34567'];
 <AutoComplete dataSource={dataSource} />;
 ```
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| allowClear | 支持清除, 单选模式有效 | boolean | false |
-| autoFocus | 自动获取焦点 | boolean | false |
-| backfill | 使用键盘选择选项的时候把选中项回填到输入框中 | boolean | false |
-| children (自动完成的数据源) | 自动完成的数据源 | React.ReactElement<OptionProps> / Array&lt;React.ReactElement<OptionProps>> | - |
-| children (自定义输入框) | 自定义输入框 | HTMLInputElement / HTMLTextAreaElement / React.ReactElement<InputProps> | `<Input />` |
-| dataSource | 自动完成的数据源 | [DataSourceItemType](https://git.io/vMMKF)\[] |  |
-| defaultActiveFirstOption | 是否默认高亮第一个选项。 | boolean | true |
-| defaultValue | 指定默认选中的条目 | string\|string\[]\| 无 |
-| disabled | 是否禁用 | boolean | false |
-| filterOption | 是否根据输入项进行筛选。当其为一个函数时，会接收 `inputValue` `option` 两个参数，当 `option` 符合筛选条件时，应返回 `true`，反之则返回 `false`。 | boolean or function(inputValue, option) | true |
-| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。[示例](https://codesandbox.io/s/4j168r7jw0) | Function(triggerNode) | () => document.body |
-| optionLabelProp | 回填到选择框的 Option 的属性值，默认是 Option 的子元素。比如在子元素需要高亮效果时，此值可以设为 `value`。 | string | `children` |
-| placeholder | 输入框提示 | string | - |
-| value | 指定当前选中的条目 | string\|string\[]\|{ key: string, label: string\|ReactNode }\|Array&lt;{ key: string, label: string\|ReactNode }> | 无 |
-| onBlur | 失去焦点时的回调 | function() | - |
-| onChange | 选中 option，或 input 的 value 变化时，调用此函数 | function(value) | 无 |
-| onFocus | 获得焦点时的回调 | function() | - |
-| onSearch | 搜索补全项的时候调用 | function(value) | 无 |
-| onSelect | 被选中时调用，参数为选中项的 value 值 | function(value, option) | 无 |
-| defaultOpen | 是否默认展开下拉菜单 | boolean | - |
-| open | 是否展开下拉菜单 | boolean | - |
-| onDropdownVisibleChange | 展开下拉菜单的回调 | function(open) | - |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| allowClear | 支持清除, 单选模式有效 | boolean | false |  |
+| autoFocus | 自动获取焦点 | boolean | false |  |
+| backfill | 使用键盘选择选项的时候把选中项回填到输入框中 | boolean | false |  |
+| children (自动完成的数据源) | 自动完成的数据源 | React.ReactElement<OptionProps> / Array&lt;React.ReactElement<OptionProps>> | - |  |  |
+| children (自定义输入框) | 自定义输入框 | HTMLInputElement / HTMLTextAreaElement / React.ReactElement<InputProps> | `<Input />` | @todo.muyu |
+| dataSource | 自动完成的数据源 | [DataSourceItemType](https://git.io/vMMKF)\[] |  |  |
+| defaultActiveFirstOption | 是否默认高亮第一个选项。 | boolean | true |  |
+| defaultValue | 指定默认选中的条目 | string\|string\[]\| 无 |  |
+| disabled | 是否禁用 | boolean | false |  |
+| filterOption | 是否根据输入项进行筛选。当其为一个函数时，会接收 `inputValue` `option` 两个参数，当 `option` 符合筛选条件时，应返回 `true`，反之则返回 `false`。 | boolean or function(inputValue, option) | true |  |
+| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。[示例](https://codesandbox.io/s/4j168r7jw0) | Function(triggerNode) | () => document.body | 3.19.4 |
+| optionLabelProp | 回填到选择框的 Option 的属性值，默认是 Option 的子元素。比如在子元素需要高亮效果时，此值可以设为 `value`。 | string | `children` |  |
+| placeholder | 输入框提示 | string | - |  |
+| value | 指定当前选中的条目 | string\|string\[]\|{ key: string, label: string\|ReactNode }\|Array&lt;{ key: string, label: string\|ReactNode }> | 无 |  |
+| onBlur | 失去焦点时的回调 | function() | - | 3.6.5 |
+| onChange | 选中 option，或 input 的 value 变化时，调用此函数 | function(value) | 无 |  |
+| onFocus | 获得焦点时的回调 | function() | - | 3.6.5 |
+| onSearch | 搜索补全项的时候调用 | function(value) | 无 |  |
+| onSelect | 被选中时调用，参数为选中项的 value 值 | function(value, option) | 无 |  |
+| defaultOpen | 是否默认展开下拉菜单 | boolean | - | 3.9.3 |
+| open | 是否展开下拉菜单 | boolean | - | 3.9.3 |
+| onDropdownVisibleChange | 展开下拉菜单的回调 | function(open) | - | 3.9.3 |
 
 ## 方法
 
-| 名称    | 描述     |
-| ------- | -------- |
-| blur()  | 移除焦点 |
-| focus() | 获取焦点 |
+| 名称    | 描述     | 版本 |
+| ------- | -------- | ---- |
+| blur()  | 移除焦点 |      |
+| focus() | 获取焦点 |      |

components/avatar/index.en-US.md

@@ -8,12 +8,12 @@ Avatars can be used to represent people or objects. It supports images, `Icon`s,
 
 ## API
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| icon | the `Icon` type for an icon avatar, see `Icon` Component | string | - |
-| shape | the shape of avatar | `circle` \| `square` | `circle` |
-| size | the size of the avatar | number \| string: `large` `small` `default` | `default` |
-| src | the address of the image for an image avatar | string | - |
-| srcSet | a list of sources to use for different screen resolutions | string | - |
-| alt | This attribute defines the alternative text describing the image | string | - |
-| onError | handler when img load error, return false to prevent default fallback behavior | () => boolean | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| icon | the `Icon` type for an icon avatar, see `Icon` Component | string | - |  |
+| shape | the shape of avatar | `circle` \| `square` | `circle` |  |
+| size | the size of the avatar | number \| string: `large` `small` `default` | `default` |  |
+| src | the address of the image for an image avatar | string | - |  |
+| srcSet | a list of sources to use for different screen resolutions | string | - | 3.11.0 |
+| alt | This attribute defines the alternative text describing the image | string | - | 3.7.0 |
+| onError | handler when img load error, return false to prevent default fallback behavior | () => boolean | - | 3.8.0 |

components/avatar/index.tsx

@@ -20,7 +20,7 @@ export interface AvatarProps {
   style?: React.CSSProperties;
   prefixCls?: string;
   className?: string;
-  children?: any;
+  children?: React.ReactNode;
   alt?: string;
   /* callback when img load error */
   /* return false to prevent Avatar show default fallback behavior, then you can do fallback by your self*/

components/avatar/index.zh-CN.md

@@ -13,12 +13,12 @@ title: Avatar
 
 ## API
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| icon | 设置头像的图标类型，参考 `Icon` 组件 | string | - |
-| shape | 指定头像的形状 | Enum{ 'circle', 'square' } | `circle` |
-| size | 设置头像的大小 | number \| Enum{ 'large', 'small', 'default' } | `default` |
-| src | 图片类头像的资源地址 | string | - |
-| srcSet | 设置图片类头像响应式资源地址 | string | - |
-| alt | 图像无法显示时的替代文本 | string | - |
-| onError | 图片加载失败的事件，返回 false 会关闭组件默认的 fallback 行为 | () => boolean | - |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| icon | 设置头像的图标类型，参考 `Icon` 组件 | string | - |  |
+| shape | 指定头像的形状 | Enum{ 'circle', 'square' } | `circle` |  |
+| size | 设置头像的大小 | number \| Enum{ 'large', 'small', 'default' } | `default` |  |
+| src | 图片类头像的资源地址 | string | - |  |
+| srcSet | 设置图片类头像响应式资源地址 | string | - | 3.11.0 |
+| alt | 图像无法显示时的替代文本 | string | - | 3.7.0 |
+| onError | 图片加载失败的事件，返回 false 会关闭组件默认的 fallback 行为 | () => boolean | - | 3.8.0 |

components/back-top/index.en-US.md

@@ -17,8 +17,8 @@ title: BackTop
 >
 > If you decide to use custom styles, please note the size limit: no more than `40px * 40px`.
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| 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 |
-| onClick | a callback function, which can be executed when you click the button | Function | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| 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 |  |
+| onClick | a callback function, which can be executed when you click the button | Function | - |  |

components/back-top/index.tsx

@@ -25,7 +25,7 @@ function getDefaultTarget() {
 
 export interface BackTopProps {
   visibilityHeight?: number;
-  onClick?: React.MouseEventHandler<any>;
+  onClick?: React.MouseEventHandler<HTMLElement>;
   target?: () => HTMLElement | Window;
   prefixCls?: string;
   className?: string;

components/back-top/index.zh-CN.md

@@ -18,8 +18,8 @@ title: BackTop
 >
 > 自定义样式宽高不大于 40px \* 40px。
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| target | 设置需要监听其滚动事件的元素，值为一个返回对应 DOM 元素的函数 | Function | () => window |
-| visibilityHeight | 滚动高度达到此参数值才出现 `BackTop` | number | 400 |
-| onClick | 点击按钮的回调函数 | Function | - |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| target | 设置需要监听其滚动事件的元素，值为一个返回对应 DOM 元素的函数 | Function | () => window |  |
+| visibilityHeight | 滚动高度达到此参数值才出现 `BackTop` | number | 400 |  |
+| onClick | 点击按钮的回调函数 | Function | - |  |

components/badge/ScrollNumber.tsx

@@ -22,7 +22,7 @@ export interface ScrollNumberProps {
   prefixCls?: string;
   className?: string;
   count?: string | number | null;
-  displayComponent?: React.ReactElement<any>;
+  displayComponent?: React.ReactElement<HTMLElement>;
   component?: string;
   onAnimated?: Function;
   style?: React.CSSProperties;
@@ -105,7 +105,7 @@ class ScrollNumber extends Component<ScrollNumberProps, ScrollNumberState> {
     if (onAnimated) {
       onAnimated();
     }
-  }
+  };
 
   renderNumberList(position: number) {
     const childrenToReturn: React.ReactElement<any>[] = [];

components/badge/index.en-US.md

@@ -32,4 +32,4 @@ Badge normally appears in proximity to notifications or user avatars with eye-ca
 | showZero | Whether to show badge when `count` is zero | boolean | `false` |  |
 | status | Set Badge as a status dot | `success` \| `processing` \| `default` \| `error` \| `warning` | `''` |  |
 | text | If `status` is set, `text` sets the display text of the status `dot` | string | `''` |  |
-| title | Text to show when hovering over the badge | string | `count` |  |
+| title | Text to show when hovering over the badge | string | `count` | 3.5.0 |

components/badge/index.zh-CN.md

@@ -33,4 +33,4 @@ title: Badge
 | showZero | 当数值为 0 时，是否展示 Badge | boolean | false |  |
 | status | 设置 Badge 为状态点 | Enum{ 'success', 'processing, 'default', 'error', 'warning' } | '' |  |
 | text | 在设置了 `status` 的前提下有效，设置状态点的文本 | string | '' |  |
-| title | 设置鼠标放在状态点上时显示的文字 | string | `count` |  |
+| title | 设置鼠标放在状态点上时显示的文字 | string | `count` | 3.5.0 |

components/breadcrumb/Breadcrumb.tsx

@@ -20,9 +20,9 @@ export interface BreadcrumbProps {
   params?: any;
   separator?: React.ReactNode;
   itemRender?: (
-    route: any,
+    route: Route,
     params: any,
-    routes: Array<any>,
+    routes: Array<Route>,
     paths: Array<string>,
   ) => React.ReactNode;
   style?: React.CSSProperties;
@@ -72,21 +72,21 @@ export default class Breadcrumb extends React.Component<BreadcrumbProps, any> {
   }
 
   getPath = (path: string, params: any) => {
-     path = (path || '').replace(/^\//, '');
-     Object.keys(params).forEach(key => {
-         path = path.replace(`:${key}`, params[key]);
-     });
-     return path;
-  }
+    path = (path || '').replace(/^\//, '');
+    Object.keys(params).forEach(key => {
+      path = path.replace(`:${key}`, params[key]);
+    });
+    return path;
+  };
 
   addChildPath = (paths: string[], childPath: string = '', params: any) => {
     const originalPaths = [...paths];
     const path = this.getPath(childPath, params);
     if (path) {
-       originalPaths.push(path);
+      originalPaths.push(path);
     }
     return originalPaths;
- }
+  };
 
   genForRoutes = ({
     routes = [],
@@ -107,12 +107,10 @@ export default class Breadcrumb extends React.Component<BreadcrumbProps, any> {
         overlay = (
           <Menu>
             {route.children.map(child => (
-                <Menu.Item key={child.breadcrumbName || child.path}>
-                  {
-                    itemRender(child, params, routes, this.addChildPath(paths, child.path, params))
-                  }
-                </Menu.Item>
-             ))}
+              <Menu.Item key={child.breadcrumbName || child.path}>
+                {itemRender(child, params, routes, this.addChildPath(paths, child.path, params))}
+              </Menu.Item>
+            ))}
           </Menu>
         );
       }

components/breadcrumb/index.en-US.md

@@ -15,12 +15,12 @@ A breadcrumb displays the current location within a hierarchy. It allows going b
 
 ## API
 
-| Property | Description | Type | Optional | Default |
-| --- | --- | --- | --- | --- |
-| itemRender | Custom item renderer | (route, params, routes, paths) => ReactNode |  | - |
-| params | Routing parameters | object |  | - |
-| routes | The routing stack information of router | [routes\[\]](#routes) |  | - |
-| separator | Custom separator | string\|ReactNode |  | `/` |
+| Property | Description | Type | Optional | Default | Version |
+| --- | --- | --- | --- | --- | --- |
+| itemRender | Custom item renderer | (route, params, routes, paths) => ReactNode |  | - |  |
+| params | Routing parameters | object |  | - |  |
+| routes | The routing stack information of router | [routes\[\]](#routes) |  | - |  |
+| separator | Custom separator | string\|ReactNode |  | `/` |  |
 
 ### Use with browserHistory
 

components/breadcrumb/index.zh-CN.md

@@ -17,21 +17,20 @@ title: Breadcrumb
 
 ### Breadcrumb
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| itemRender | 自定义链接函数，和 react-router 配置使用 | (route, params, routes, paths) => ReactNode | - |
-| params | 路由的参数 | object | - |
-| routes | router 的路由栈信息 | [routes\[\]](#routes) | - |
-| separator | 分隔符自定义 | string\|ReactNode | '/' |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| itemRender | 自定义链接函数，和 react-router 配置使用 | (route, params, routes, paths) => ReactNode | - | 3.17.0 |
+| params | 路由的参数 | object | - | 3.17.0 |
+| routes | router 的路由栈信息 | [routes\[\]](#routes) | - | 3.17.0 |
+| separator | 分隔符自定义 | string\|ReactNode | '/' | 3.17.0 |
 
 ### Breadcrumb.Item
 
-| 参数      | 参数           | 类型                                   | 默认值 |
-| --------- | -------------- | -------------------------------------- | ------ |
-| href      | 链接的目的地   | string                                 | -      |
-| separator | 自定义的分隔符 | string\|ReactNode                      | '/'    |
-| overlay   | 下来菜单的内容 | [Menu](/components/menu) \| () => Menu | -      |
-| onClick   | 单击事件       | (e:MouseEvent)=>void                   | -      |
+| 参数    | 参数           | 类型                                   | 默认值 | 版本   |
+| ------- | -------------- | -------------------------------------- | ------ | ------ |
+| href    | 链接的目的地   | string                                 | -      | 3.17.0 |
+| overlay | 下拉菜单的内容 | [Menu](/components/menu) \| () => Menu | -      | 3.17.0 |
+| onClick | 单击事件       | (e:MouseEvent)=>void                   | -      | 3.17.0 |
 
 ### routes
 

components/button/button.tsx

@@ -91,15 +91,15 @@ export interface BaseButtonProps {
 export type AnchorButtonProps = {
   href: string;
   target?: string;
-  onClick?: React.MouseEventHandler<any>;
+  onClick?: React.MouseEventHandler<HTMLElement>;
 } & BaseButtonProps &
-  Omit<React.AnchorHTMLAttributes<any>, 'type'>;
+  Omit<React.AnchorHTMLAttributes<any>, 'type' | 'onClick'>;
 
 export type NativeButtonProps = {
   htmlType?: ButtonHTMLType;
-  onClick?: React.MouseEventHandler<any>;
+  onClick?: React.MouseEventHandler<HTMLElement>;
 } & BaseButtonProps &
-  Omit<React.ButtonHTMLAttributes<any>, 'type'>;
+  Omit<React.ButtonHTMLAttributes<any>, 'type' | 'onClick'>;
 
 export type ButtonProps = Partial<AnchorButtonProps & NativeButtonProps>;
 
@@ -289,7 +289,7 @@ class Button extends React.Component<ButtonProps, ButtonState> {
 
     const buttonNode = (
       <button
-        {...otherProps as NativeButtonProps}
+        {...(otherProps as NativeButtonProps)}
         type={htmlType}
         className={classes}
         onClick={this.handleClick}

components/button/demo/size.md

@@ -30,7 +30,7 @@ class ButtonSize extends React.Component {
   };
 
   render() {
-    const size = this.state.size;
+    const { size } = this.state;
     return (
       <div>
         <Radio.Group value={size} onChange={this.handleSizeChange}>

components/button/index.en-US.md

@@ -14,32 +14,30 @@ A button means an operation (or a series of operations). Clicking a button will
 
 To get a customized button, just set `type`/`shape`/`size`/`loading`/`disabled`.
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| disabled | disabled state of button | boolean | `false` |
-| ghost | make background transparent and invert text and border colors, added in 2.7 | boolean | `false` |
-| href | redirect url of link button | string | - |
-| htmlType | set the original html `type` of `button`, see: [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type) | string | `button` |
-| icon | set the icon of button, see: Icon component | string | - |
-| loading | set the loading status of button | boolean \| { delay: number } | `false` |
-| shape | can be set to `circle`, `round` or omitted | string | - |
-| size | can be set to `small` `large` or omitted | string | `default` |
-| target | same as target attribute of a, works when href is specified | string | - |
-| type | can be set to `primary` `ghost` `dashed` `danger` `link`(added in 3.17) or omitted (meaning `default`) | string | `default` |
-| onClick | set the handler to handle `click` event | (event) => void | - |
-| block | option to fit button width to its parent width | boolean | `false` |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| disabled | disabled state of button | boolean | `false` | 3.5.1 |
+| ghost | make background transparent and invert text and border colors, added in 2.7 | boolean | `false` |  |
+| href | redirect url of link button | string | - |  |
+| htmlType | set the original html `type` of `button`, see: [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type) | string | `button` |  |
+| icon | set the icon of button, see: Icon component | string | - |  |
+| loading | set the loading status of button | boolean \| { delay: number } | `false` |  |
+| shape | can be set to `circle`, `round` or omitted | string | - |  |
+| size | can be set to `small` `large` or omitted | string | `default` |  |
+| target | same as target attribute of a, works when href is specified | string | - |  |
+| type | can be set to `primary` `ghost` `dashed` `danger` `link`(added in 3.17) or omitted (meaning `default`) | string | `default` |  |
+| onClick | set the handler to handle `click` event | (event) => void | - |  |
+| block | option to fit button width to its parent width | boolean | `false` | 3.8.0 |
 
 It accepts all props which native button support.
 
-`<Button>Hello world!</Button>` will be rendered into `<button><span>Hello world!</span></button>`, and all the properties which are not listed above will be transferred to the `<button>` tag.
-
-`<Button href="http://example.com">Hello world!</Button>` will be rendered into `<a href="http://example.com"><span>Hello world!</span></a>`.
-
 ## FAQ
 
-### How to remove space between 2 chinese characters
+### How to remove space between 2 chinese characters?
 
-Use [ConfigProvider](/components/config-provider/#API) to set `autoInsertSpaceInButton` as `false`.
+Following Ant Design specification, we will add one space between if Button contains two chinese characters only. If you don't need that, you can use [ConfigProvider](/components/config-provider/#API) to set `autoInsertSpaceInButton` as `false`.
+
+![](https://gw.alipayobjects.com/zos/antfincdn/Hz5HL9gsT4/f29f170d-b78d-4d2b-aa71-0da6a9ead4d9.png)
 
 <style>
 [id^=components-button-demo-] .ant-btn {

components/button/index.zh-CN.md

@@ -17,32 +17,30 @@ subtitle: 按钮
 
 按钮的属性说明如下：
 
-| 属性 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| disabled | 按钮失效状态 | boolean | `false` |
-| ghost | 幽灵属性，使按钮背景透明，版本 2.7 中增加 | boolean | false |
-| href | 点击跳转的地址，指定此属性 button 的行为和 a 链接一致 | string | - |
-| htmlType | 设置 `button` 原生的 `type` 值，可选值请参考 [HTML 标准](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type) | string | `button` |
-| icon | 设置按钮的图标类型 | string | - |
-| loading | 设置按钮载入状态 | boolean \| { delay: number } | `false` |
-| shape | 设置按钮形状，可选值为 `circle`、 `round` 或者不设 | string | - |
-| size | 设置按钮大小，可选值为 `small` `large` 或者不设 | string | `default` |
-| target | 相当于 a 链接的 target 属性，href 存在时生效 | string | - |
-| type | 设置按钮类型，可选值为 `primary` `dashed` `danger` `link`(3.17 中增加) 或者不设 | string | - |
-| onClick | 点击按钮时的回调 | (event) => void | - |
-| block | 将按钮宽度调整为其父宽度的选项 | boolean | `false` |
+| 属性 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| disabled | 按钮失效状态 | boolean | `false` | 3.5.1 |
+| ghost | 幽灵属性，使按钮背景透明，版本 2.7 中增加 | boolean | false |  |
+| href | 点击跳转的地址，指定此属性 button 的行为和 a 链接一致 | string | - |  |
+| htmlType | 设置 `button` 原生的 `type` 值，可选值请参考 [HTML 标准](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type) | string | `button` |  |
+| icon | 设置按钮的图标类型 | string | - |  |
+| loading | 设置按钮载入状态 | boolean \| { delay: number } | `false` |  |
+| shape | 设置按钮形状，可选值为 `circle`、 `round` 或者不设 | string | - |  |
+| size | 设置按钮大小，可选值为 `small` `large` 或者不设 | string | `default` |  |
+| target | 相当于 a 链接的 target 属性，href 存在时生效 | string | - |  |
+| type | 设置按钮类型，可选值为 `primary` `dashed` `danger` `link`(3.17 中增加) 或者不设 | string | - |  |
+| onClick | 点击按钮时的回调 | (event) => void | - |  |
+| block | 将按钮宽度调整为其父宽度的选项 | boolean | `false` | 3.8.0 |
 
 支持原生 button 的其他所有属性。
 
-`<Button>Hello world!</Button>` 最终会被渲染为 `<button><span>Hello world!</span></button>`，并且除了上表中的属性，其它属性都会直接传到原生 button 上。
-
-`<Button href="http://example.com">Hello world!</Button>` 则会渲染为 `<a href="http://example.com"><span>Hello world!</span></a>`。
-
 ## FAQ
 
-### 如何移除 2 个汉字之间的空格
+### 如何移除两个汉字之间的空格？
 
-设置 [ConfigProvider](/components/config-provider/#API) 的 `autoInsertSpaceInButton` 为 `false`。
+根据 Ant Design 设计规范要求，我们会在按钮内只有两个汉字时自动添加空格，如果你不需要这个特性，可以设置 [ConfigProvider](/components/config-provider/#API) 的 `autoInsertSpaceInButton` 为 `false`。
+
+![](https://gw.alipayobjects.com/zos/antfincdn/Hz5HL9gsT4/f29f170d-b78d-4d2b-aa71-0da6a9ead4d9.png)
 
 <style>
 [id^="components-button-demo-"] .ant-btn {

components/button/style/index.less

@@ -24,6 +24,7 @@
   > i,
   > span {
     display: inline-block;
+    transition: margin-left 0.3s @ease-in-out;
     pointer-events: none;
   }
 
@@ -166,7 +167,7 @@
   }
 
   &-background-ghost&-danger {
-    .button-variant-ghost(@btn-danger-color);
+    .button-variant-ghost(@btn-danger-border);
   }
 
   &-background-ghost&-link {

components/button/style/mixin.less

@@ -66,26 +66,6 @@
   }
   .button-disabled();
 }
-.button-variant-danger(@color; @background; @border) {
-  .button-color(@color; @background; @border);
-  &:hover {
-    .button-color(
-      @btn-primary-color; ~`colorPalette('@{color}', 5) `; ~`colorPalette('@{color}', 5) `
-    );
-  }
-  &:focus {
-    .button-color(
-      ~`colorPalette('@{color}', 5) `; @component-background; ~`colorPalette('@{color}', 5) `
-    );
-  }
-  &:active,
-  &.active {
-    .button-color(
-      @btn-primary-color; ~`colorPalette('@{color}', 7) `; ~`colorPalette('@{color}', 7) `
-    );
-  }
-  .button-disabled();
-}
 .button-variant-ghost(@color; @border: @color) {
   .button-color(@color; transparent; @border);
   text-shadow: none;
@@ -230,7 +210,7 @@
 }
 // danger button style
 .btn-danger() {
-  .button-variant-danger(@btn-danger-color, @btn-danger-bg, @btn-danger-border);
+  .button-variant-primary(@btn-danger-color, @btn-danger-bg);
 }
 // link button style
 .btn-link() {

components/calendar/Header.tsx

@@ -12,6 +12,8 @@ export interface RenderHeader {
   onTypeChange: (type: string) => void;
 }
 
+export type HeaderRender = (headerRender: RenderHeader) => React.ReactNode;
+
 export interface HeaderProps {
   prefixCls?: string;
   locale?: any;
@@ -23,7 +25,7 @@ export interface HeaderProps {
   onTypeChange?: (type: string) => void;
   value: moment.Moment;
   validRange?: [moment.Moment, moment.Moment];
-  headerRender: (header: RenderHeader) => React.ReactNode;
+  headerRender?: HeaderRender;
 }
 
 export default class Header extends React.Component<HeaderProps, any> {
@@ -138,7 +140,7 @@ export default class Header extends React.Component<HeaderProps, any> {
   };
 
   onInternalTypeChange = (e: RadioChangeEvent) => {
-    this.onTypeChange(e.target.value);
+    this.onTypeChange(e.target.value as string);
   };
 
   onTypeChange = (type: string) => {
@@ -178,8 +180,8 @@ export default class Header extends React.Component<HeaderProps, any> {
     );
   };
 
-  headerRenderCustom = (): React.ReactNode => {
-    const { headerRender, type, onValueChange, value } = this.props;
+  headerRenderCustom = (headerRender: HeaderRender): React.ReactNode => {
+    const { type, onValueChange, value } = this.props;
 
     return headerRender({
       value,
@@ -194,7 +196,7 @@ export default class Header extends React.Component<HeaderProps, any> {
     const typeSwitch = this.getTypeSwitch();
     const { yearReactNode, monthReactNode } = this.getMonthYearSelections(getPrefixCls);
     return headerRender ? (
-      this.headerRenderCustom()
+      this.headerRenderCustom(headerRender)
     ) : (
       <div className={`${prefixCls}-header`} ref={this.getCalenderHeaderNode}>
         {yearReactNode}

components/calendar/index.en-US.md

@@ -40,9 +40,9 @@ When data is in the form of dates, such as schedules, timetables, prices calenda
 | mode | The display mode of the calendar | `month` \| `year` | `month` |  |
 | monthCellRender | Customize the display of the month cell, the returned content will be appended to the cell | function(date: moment): ReactNode | - |  |
 | monthFullCellRender | Customize the display of the month cell, the returned content will override the cell | function(date: moment): ReactNode | - |  |
-| validRange | to set valid range | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)] | - |  |
-| value | The current selected date | [moment](http://momentjs.com/) | current date |
+| validRange | to set valid range | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)] | - | 3.3.0 |
+| value | The current selected date | [moment](http://momentjs.com/) | current date |  |
 | onPanelChange | Callback for when panel changes | function(date: moment, mode: string) | - |  |
 | onSelect | Callback for when a date is selected | function(date: moment） | - |  |
-| onChange | Callback for when date changes | function(date: moment） | - |  |
+| onChange | Callback for when date changes | function(date: moment） | - | 3.8.0 |
 | headerRender | render custom header in panel | function(object:{value: moment, type: string, onChange: f(), onTypeChange: f()}) | - | 3.19.0 |

components/calendar/index.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import * as moment from 'moment';
 import FullCalendar from 'rc-calendar/lib/FullCalendar';
-import Header, { RenderHeader } from './Header';
+import Header, { HeaderRender } from './Header';
 import enUS from './locale/en_US';
 import LocaleReceiver from '../locale-provider/LocaleReceiver';
 import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
@@ -41,7 +41,7 @@ export interface CalendarProps {
   onChange?: (date?: moment.Moment) => void;
   disabledDate?: (current: moment.Moment) => boolean;
   validRange?: [moment.Moment, moment.Moment];
-  headerRender: (header: RenderHeader) => React.ReactNode;
+  headerRender?: HeaderRender;
 }
 
 export interface CalendarState {
@@ -56,7 +56,6 @@ class Calendar extends React.Component<CalendarProps, CalendarState> {
     onSelect: noop,
     onPanelChange: noop,
     onChange: noop,
-    headerRender: null,
   };
 
   static propTypes = {
@@ -73,6 +72,7 @@ class Calendar extends React.Component<CalendarProps, CalendarState> {
     value: PropTypes.object as PropTypes.Requireable<moment.Moment>,
     onSelect: PropTypes.func,
     onChange: PropTypes.func,
+    headerRender: PropTypes.func,
   };
 
   static getDerivedStateFromProps(nextProps: CalendarProps) {

components/calendar/index.zh-CN.md

@@ -34,16 +34,16 @@ title: Calendar
 | --- | --- | --- | --- | --- |
 | dateCellRender | 自定义渲染日期单元格，返回内容会被追加到单元格 | function(date: moment): ReactNode | 无 |  |
 | dateFullCellRender | 自定义渲染日期单元格，返回内容覆盖单元格 | function(date: moment): ReactNode | 无 |  |
-| defaultValue | 默认展示的日期 | [moment](http://momentjs.com/) | 默认日期 |
+| defaultValue | 默认展示的日期 | [moment](http://momentjs.com/) | 默认日期 |  |
 | disabledDate | 不可选择的日期 | (currentDate: moment) => boolean | 无 |  |
 | fullscreen | 是否全屏显示 | boolean | true |  |
 | locale | 国际化配置 | object | [默认配置](https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json) |  |
-| mode | 初始模式，`month/year` | string | month |
+| mode | 初始模式，`month/year` | string | month |  |
 | monthCellRender | 自定义渲染月单元格，返回内容会被追加到单元格 | function(date: moment): ReactNode | 无 |  |
 | monthFullCellRender | 自定义渲染月单元格，返回内容覆盖单元格 | function(date: moment): ReactNode | 无 |  |
-| validRange | 设置可以显示的日期 | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)] | 无 |  |
-| value | 展示日期 | [moment](http://momentjs.com/) | 当前日期 |
+| validRange | 设置可以显示的日期 | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)] | 无 | 3.3.0 |
+| value | 展示日期 | [moment](http://momentjs.com/) | 当前日期 |  |
 | onPanelChange | 日期面板变化回调 | function(date: moment, mode: string) | 无 |  |
 | onSelect | 点击选择日期回调 | function(date: moment） | 无 |  |
-| onChange | 日期变化回调 | function(date: moment） | 无 |  |
+| onChange | 日期变化回调 | function(date: moment） | 无 | 3.8.0 |
 | headerRender | 自定义头部内容 | function(object:{value: moment, type: string, onChange: f(), onTypeChange: f()}) | 无 | 3.19.0 |

components/card/index.en-US.md

@@ -19,37 +19,37 @@ A card can be used to display content related to a single subject. The content c
 
 ### Card
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| actions | The action list, shows at the bottom of the Card. | Array<ReactNode> | - |
-| activeTabKey | Current TabPane's key | string | - |
-| headStyle | Inline style to apply to the card head | object | - |
-| bodyStyle | Inline style to apply to the card content | object | - |
-| bordered | Toggles rendering of the border around the card | boolean | `true` |
-| cover | Card cover | ReactNode | - |
-| defaultActiveTabKey | Initial active TabPane's key, if `activeTabKey` is not set. | string | - |
-| extra | Content to render in the top-right corner of the card | string\|ReactNode | - |
-| hoverable | Lift up when hovering card | boolean | false |
-| loading | Shows a loading indicator while the contents of the card are being fetched | boolean | false |
-| tabList | List of TabPane's head. | Array<{key: string, tab: ReactNode}> | - |
-| size | Size of card | `default` \| `small` | `default` |
-| title | Card title | string\|ReactNode | - |
-| type | Card style type, can be set to `inner` or not set | string | - |
-| onTabChange | Callback when tab is switched | (key) => void | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| actions | The action list, shows at the bottom of the Card. | Array<ReactNode> | - |  |
+| activeTabKey | Current TabPane's key | string | - | 3.3.0 |
+| headStyle | Inline style to apply to the card head | object | - | 3.8.0 |
+| bodyStyle | Inline style to apply to the card content | object | - |  |
+| bordered | Toggles rendering of the border around the card | boolean | `true` |  |
+| cover | Card cover | ReactNode | - |  |
+| defaultActiveTabKey | Initial active TabPane's key, if `activeTabKey` is not set. | string | - | 3.3.0 |
+| extra | Content to render in the top-right corner of the card | string\|ReactNode | - |  |
+| hoverable | Lift up when hovering card | boolean | false |  |
+| loading | Shows a loading indicator while the contents of the card are being fetched | boolean | false |  |
+| tabList | List of TabPane's head. | Array<{key: string, tab: ReactNode}> | - |  |
+| size | Size of card | `default` \| `small` | `default` | 3.12.0 |
+| title | Card title | string\|ReactNode | - |  |
+| type | Card style type, can be set to `inner` or not set | string | - |  |
+| onTabChange | Callback when tab is switched | (key) => void | - |  |
 
 ### Card.Grid
 
-| Property  | Description               | Type   | Default |
-| --------- | ------------------------- | ------ | ------- |
-| className | className of container    | string | -       |
-| style     | style object of container | object | -       |
+| Property  | Description               | Type   | Default | Version |
+| --------- | ------------------------- | ------ | ------- | ------- |
+| className | className of container    | string | -       |         |
+| style     | style object of container | object | -       |         |
 
 ### Card.Meta
 
-| Property    | Description               | Type      | Default |
-| ----------- | ------------------------- | --------- | ------- |
-| avatar      | avatar or icon            | ReactNode | -       |
-| className   | className of container    | string    | -       |
-| description | description content       | ReactNode | -       |
-| style       | style object of container | object    | -       |
-| title       | title content             | ReactNode | -       |
+| Property    | Description               | Type      | Default | Version |
+| ----------- | ------------------------- | --------- | ------- | ------- |
+| avatar      | avatar or icon            | ReactNode | -       |         |
+| className   | className of container    | string    | -       |         |
+| description | description content       | ReactNode | -       |         |
+| style       | style object of container | object    | -       |         |
+| title       | title content             | ReactNode | -       |         |

components/card/index.zh-CN.md

@@ -20,37 +20,37 @@ cols: 1
 
 ### Card
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| actions | 卡片操作组，位置在卡片底部 | Array<ReactNode> | - |
-| activeTabKey | 当前激活页签的 key | string | - |
-| headStyle | 自定义标题区域样式 | object | - |
-| bodyStyle | 内容区域自定义样式 | object | - |
-| bordered | 是否有边框 | boolean | true |
-| cover | 卡片封面 | ReactNode | - |
-| defaultActiveTabKey | 初始化选中页签的 key，如果没有设置 activeTabKey | string | 第一个页签 |
-| extra | 卡片右上角的操作区域 | string\|ReactNode | - |
-| hoverable | 鼠标移过时可浮起 | boolean | false |
-| loading | 当卡片内容还在加载中时，可以用 loading 展示一个占位 | boolean | false |
-| tabList | 页签标题列表 | Array<{key: string, tab: ReactNode}> | - |
-| size | card 的尺寸 | `default` \| `small` | `default` |
-| title | 卡片标题 | string\|ReactNode | - |
-| type | 卡片类型，可设置为 `inner` 或 不设置 | string | - |
-| onTabChange | 页签切换的回调 | (key) => void | - |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| actions | 卡片操作组，位置在卡片底部 | Array<ReactNode> | - |  |
+| activeTabKey | 当前激活页签的 key | string | - | 3.3.0 |
+| headStyle | 自定义标题区域样式 | object | - | 3.8.0 |
+| bodyStyle | 内容区域自定义样式 | object | - |  |
+| bordered | 是否有边框 | boolean | true |  |
+| cover | 卡片封面 | ReactNode | - |  |
+| defaultActiveTabKey | 初始化选中页签的 key，如果没有设置 activeTabKey | string | 第一个页签 | 3.3.0 |
+| extra | 卡片右上角的操作区域 | string\|ReactNode | - |  |
+| hoverable | 鼠标移过时可浮起 | boolean | false |  |
+| loading | 当卡片内容还在加载中时，可以用 loading 展示一个占位 | boolean | false |  |
+| tabList | 页签标题列表 | Array<{key: string, tab: ReactNode}> | - |  |
+| size | card 的尺寸 | `default` \| `small` | `default` | 3.12.0 |
+| title | 卡片标题 | string\|ReactNode | - |  |
+| type | 卡片类型，可设置为 `inner` 或 不设置 | string | - |  |
+| onTabChange | 页签切换的回调 | (key) => void | - |  |
 
 ### Card.Grid
 
-| Property  | Description            | Type   | Default |
-| --------- | ---------------------- | ------ | ------- |
-| className | 网格容器类名           | string | -       |
-| style     | 定义网格容器类名的样式 | object | -       |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --------- | ---------------------- | ------ | ------- | ---- |
+| className | 网格容器类名           | string | -       |      |
+| style     | 定义网格容器类名的样式 | object | -       |      |
 
 ### Card.Meta
 
-| Property    | Description        | Type      | Default |
-| ----------- | ------------------ | --------- | ------- |
-| avatar      | 头像/图标          | ReactNode | -       |
-| className   | 容器类名           | string    | -       |
-| description | 描述内容           | ReactNode | -       |
-| style       | 定义容器类名的样式 | object    | -       |
-| title       | 标题内容           | ReactNode | -       |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| ----------- | ------------------ | --------- | ------- | ---- |
+| avatar      | 头像/图标          | ReactNode | -       |      |
+| className   | 容器类名           | string    | -       |      |
+| description | 描述内容           | ReactNode | -       |      |
+| style       | 定义容器类名的样式 | object    | -       |      |
+| title       | 标题内容           | ReactNode | -       |      |

components/card/style/index.less

@@ -109,7 +109,7 @@
     padding-bottom: 0;
   }
 
-  &-contain-tabs &-extra {
+  &-contain-tabs > &-head &-extra {
     padding-bottom: 0;
   }
 
@@ -139,7 +139,7 @@
 
       & > span {
         position: relative;
-        display: inline-block;
+        display: block;
         min-width: 32px;
         font-size: 14px;
         line-height: 22px;
@@ -155,7 +155,8 @@
           line-height: 22px;
         }
 
-        a {
+        a,
+        i {
           display: inline-block;
           width: 100%;
           color: @text-color-secondary;
@@ -163,6 +164,7 @@
 
           &:hover {
             color: @primary-color;
+            transition: color 0.3s;
           }
         }
       }

components/carousel/__tests__/index.test.js

@@ -3,11 +3,11 @@ import { mount } from 'enzyme';
 import Carousel from '..';
 
 describe('Carousel', () => {
-  beforeAll(() => {
+  beforeEach(() => {
     jest.useFakeTimers();
   });
 
-  afterAll(() => {
+  afterEach(() => {
     jest.useRealTimers();
   });
 

components/carousel/index.en-US.md

@@ -26,10 +26,10 @@ A carousel component. Scales with its container.
 
 ## Methods
 
-| Name | Description |
-| --- | --- |
-| goTo(slideNumber, dontAnimate) | Go to slide index, if dontAnimate=true, it happens without animation |
-| next() | Change current slide to next slide |
-| prev() | Change current slide to previous slide |
+| Name | Description | Version |
+| --- | --- | --- |
+| goTo(slideNumber, dontAnimate) | Go to slide index, if dontAnimate=true, it happens without animation | 3.9.3 |
+| next() | Change current slide to next slide |  |
+| prev() | Change current slide to previous slide |  |
 
 For more info on the parameters, refer to the <https://github.com/akiran/react-slick>

components/carousel/index.zh-CN.md

@@ -17,20 +17,20 @@ subtitle: 走马灯
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
-| afterChange | 切换面板的回调 | function(current) | 无 |  |
-| autoplay | 是否自动切换 | boolean | false |  |
-| beforeChange | 切换面板的回调 | function(from, to) | 无 |  |
-| dotPosition | 面板指示点位置，可选 `top` `bottom` `left` `right` | string | bottom | 3.17.0 |
-| dots | 是否显示面板指示点 | boolean | true |  |
-| easing | 动画效果 | string | linear |  |
-| effect | 动画效果函数，可取 scrollx, fade | string | scrollx |  |
+| afterChange | 切换面板的回调 | function(current) | 无 |  |  |
+| autoplay | 是否自动切换 | boolean | false |  |  |
+| beforeChange | 切换面板的回调 | function(from, to) | 无 |  |  |
+| dotPosition | 面板指示点位置，可选 `top` `bottom` `left` `right` | string | bottom | 3.17.0 | 3.17.0 |
+| dots | 是否显示面板指示点 | boolean | true |  |  |
+| easing | 动画效果 | string | linear |  |  |
+| effect | 动画效果函数，可取 scrollx, fade | string | scrollx |  |  |
 
 ## 方法
 
 | 名称                           | 描述                                              |
 | ------------------------------ | ------------------------------------------------- |
-| goTo(slideNumber, dontAnimate) | 切换到指定面板, dontAnimate = true 时，不使用动画 |
-| next()                         | 切换到下一面板                                    |
-| prev()                         | 切换到上一面板                                    |
+| goTo(slideNumber, dontAnimate) | 切换到指定面板, dontAnimate = true 时，不使用动画 | 3.9.3 |
+| next()                         | 切换到下一面板                                    |  |
+| prev()                         | 切换到上一面板                                    |  |
 
 更多参数可参考：<https://github.com/akiran/react-slick>

components/cascader/__tests__/__snapshots__/index.test.js.snap

@@ -1256,6 +1256,299 @@ exports[`Cascader should render not found content 1`] = `
 </Popup>
 `;
 
+exports[`Cascader should show not found content when options.length is 0 1`] = `
+<Popup
+  action={
+    Array [
+      "click",
+    ]
+  }
+  align={
+    Object {
+      "offset": Array [
+        0,
+        4,
+      ],
+      "overflow": Object {
+        "adjustX": 1,
+        "adjustY": 1,
+      },
+      "points": Array [
+        "tl",
+        "bl",
+      ],
+    }
+  }
+  className=""
+  destroyPopupOnHide={false}
+  getClassNameFromAlign={[Function]}
+  getRootDomNode={[Function]}
+  mask={false}
+  onAlign={[Function]}
+  onMouseDown={[Function]}
+  onTouchStart={[Function]}
+  prefixCls="ant-cascader-menus"
+  style={Object {}}
+  transitionName="slide-up"
+  visible={true}
+>
+  <div>
+    <Animate
+      animation={Object {}}
+      component=""
+      componentProps={Object {}}
+      exclusive={true}
+      onAppear={[Function]}
+      onEnd={[Function]}
+      onEnter={[Function]}
+      onLeave={[Function]}
+      showProp="xVisible"
+      transitionAppear={true}
+      transitionEnter={true}
+      transitionLeave={true}
+      transitionName="slide-up"
+    >
+      <AnimateChild
+        animation={Object {}}
+        key="popup"
+        transitionAppear={true}
+        transitionEnter={true}
+        transitionLeave={true}
+        transitionName="slide-up"
+      >
+        <Align
+          align={
+            Object {
+              "offset": Array [
+                0,
+                4,
+              ],
+              "overflow": Object {
+                "adjustX": 1,
+                "adjustY": 1,
+              },
+              "points": Array [
+                "tl",
+                "bl",
+              ],
+            }
+          }
+          childrenProps={
+            Object {
+              "visible": "xVisible",
+            }
+          }
+          disabled={false}
+          key="popup"
+          monitorBufferTime={50}
+          monitorWindowResize={true}
+          onAlign={[Function]}
+          target={[Function]}
+          xVisible={true}
+        >
+          <PopupInner
+            className="ant-cascader-menus  ant-cascader-menus-placement-bottomLeft "
+            hiddenClassName="ant-cascader-menus-hidden"
+            onMouseDown={[Function]}
+            onTouchStart={[Function]}
+            prefixCls="ant-cascader-menus"
+            style={Object {}}
+            visible={true}
+          >
+            <div
+              className="ant-cascader-menus  ant-cascader-menus-placement-bottomLeft "
+              onMouseDown={[Function]}
+              onTouchStart={[Function]}
+              style={Object {}}
+            >
+              <LazyRenderBox
+                className="ant-cascader-menus-content"
+                visible={true}
+              >
+                <Menus
+                  activeValue={Array []}
+                  allowClear={true}
+                  builtinPlacements={
+                    Object {
+                      "bottomLeft": Object {
+                        "offset": Array [
+                          0,
+                          4,
+                        ],
+                        "overflow": Object {
+                          "adjustX": 1,
+                          "adjustY": 1,
+                        },
+                        "points": Array [
+                          "tl",
+                          "bl",
+                        ],
+                      },
+                      "bottomRight": Object {
+                        "offset": Array [
+                          0,
+                          4,
+                        ],
+                        "overflow": Object {
+                          "adjustX": 1,
+                          "adjustY": 1,
+                        },
+                        "points": Array [
+                          "tr",
+                          "br",
+                        ],
+                      },
+                      "topLeft": Object {
+                        "offset": Array [
+                          0,
+                          -4,
+                        ],
+                        "overflow": Object {
+                          "adjustX": 1,
+                          "adjustY": 1,
+                        },
+                        "points": Array [
+                          "bl",
+                          "tl",
+                        ],
+                      },
+                      "topRight": Object {
+                        "offset": Array [
+                          0,
+                          -4,
+                        ],
+                        "overflow": Object {
+                          "adjustX": 1,
+                          "adjustY": 1,
+                        },
+                        "points": Array [
+                          "br",
+                          "tr",
+                        ],
+                      },
+                    }
+                  }
+                  defaultFieldNames={
+                    Object {
+                      "children": "children",
+                      "label": "label",
+                      "value": "value",
+                    }
+                  }
+                  disabled={false}
+                  dropdownMenuColumnStyle={
+                    Object {
+                      "height": "auto",
+                      "width": 0,
+                    }
+                  }
+                  expandIcon={
+                    <Icon
+                      type="right"
+                    />
+                  }
+                  expandTrigger="click"
+                  fieldNames={
+                    Object {
+                      "children": "children",
+                      "label": "label",
+                      "value": "value",
+                    }
+                  }
+                  loadingIcon={
+                    <span
+                      className="ant-cascader-menu-item-loading-icon"
+                    >
+                      <Icon
+                        spin={true}
+                        type="redo"
+                      />
+                    </span>
+                  }
+                  onChange={[Function]}
+                  onItemDoubleClick={[Function]}
+                  onPopupVisibleChange={[Function]}
+                  onSelect={[Function]}
+                  options={
+                    Array [
+                      Object {
+                        "disabled": true,
+                        "label": <Context.Consumer>
+                          [Function]
+                        </Context.Consumer>,
+                        "value": "ANT_CASCADER_NOT_FOUND",
+                      },
+                    ]
+                  }
+                  placeholder="Please select"
+                  popupClassName=""
+                  popupPlacement="bottomLeft"
+                  popupVisible={true}
+                  prefixCls="ant-cascader"
+                  transitionName="slide-up"
+                  value={Array []}
+                  visible={true}
+                >
+                  <div>
+                    <ul
+                      className="ant-cascader-menu"
+                      key="0"
+                      style={
+                        Object {
+                          "height": "auto",
+                          "width": 0,
+                        }
+                      }
+                    >
+                      <li
+                        className="ant-cascader-menu-item ant-cascader-menu-item-disabled"
+                        key="ANT_CASCADER_NOT_FOUND"
+                        onClick={[Function]}
+                        onDoubleClick={[Function]}
+                        onMouseDown={[Function]}
+                        role="menuitem"
+                        title=""
+                      >
+                        <OriginEmpty
+                          className="ant-empty-small"
+                          image="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNDEiIHZpZXdCb3g9IjAgMCA2NCA0MSIgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAxKSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgIDxlbGxpcHNlIGZpbGw9IiNGNUY1RjUiIGN4PSIzMiIgY3k9IjMzIiByeD0iMzIiIHJ5PSI3Ii8+CiAgICA8ZyBmaWxsLXJ1bGU9Im5vbnplcm8iIHN0cm9rZT0iI0Q5RDlEOSI+CiAgICAgIDxwYXRoIGQ9Ik01NSAxMi43Nkw0NC44NTQgMS4yNThDNDQuMzY3LjQ3NCA0My42NTYgMCA0Mi45MDcgMEgyMS4wOTNjLS43NDkgMC0xLjQ2LjQ3NC0xLjk0NyAxLjI1N0w5IDEyLjc2MVYyMmg0NnYtOS4yNHoiLz4KICAgICAgPHBhdGggZD0iTTQxLjYxMyAxNS45MzFjMC0xLjYwNS45OTQtMi45MyAyLjIyNy0yLjkzMUg1NXYxOC4xMzdDNTUgMzMuMjYgNTMuNjggMzUgNTIuMDUgMzVoLTQwLjFDMTAuMzIgMzUgOSAzMy4yNTkgOSAzMS4xMzdWMTNoMTEuMTZjMS4yMzMgMCAyLjIyNyAxLjMyMyAyLjIyNyAyLjkyOHYuMDIyYzAgMS42MDUgMS4wMDUgMi45MDEgMi4yMzcgMi45MDFoMTQuNzUyYzEuMjMyIDAgMi4yMzctMS4zMDggMi4yMzctMi45MTN2LS4wMDd6IiBmaWxsPSIjRkFGQUZBIi8+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4K"
+                        >
+                          <LocaleReceiver
+                            componentName="Empty"
+                          >
+                            <div
+                              className="ant-empty ant-empty-normal ant-empty-small"
+                            >
+                              <div
+                                className="ant-empty-image"
+                              >
+                                <img
+                                  alt="No Data"
+                                  src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNDEiIHZpZXdCb3g9IjAgMCA2NCA0MSIgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAxKSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgIDxlbGxpcHNlIGZpbGw9IiNGNUY1RjUiIGN4PSIzMiIgY3k9IjMzIiByeD0iMzIiIHJ5PSI3Ii8+CiAgICA8ZyBmaWxsLXJ1bGU9Im5vbnplcm8iIHN0cm9rZT0iI0Q5RDlEOSI+CiAgICAgIDxwYXRoIGQ9Ik01NSAxMi43Nkw0NC44NTQgMS4yNThDNDQuMzY3LjQ3NCA0My42NTYgMCA0Mi45MDcgMEgyMS4wOTNjLS43NDkgMC0xLjQ2LjQ3NC0xLjk0NyAxLjI1N0w5IDEyLjc2MVYyMmg0NnYtOS4yNHoiLz4KICAgICAgPHBhdGggZD0iTTQxLjYxMyAxNS45MzFjMC0xLjYwNS45OTQtMi45MyAyLjIyNy0yLjkzMUg1NXYxOC4xMzdDNTUgMzMuMjYgNTMuNjggMzUgNTIuMDUgMzVoLTQwLjFDMTAuMzIgMzUgOSAzMy4yNTkgOSAzMS4xMzdWMTNoMTEuMTZjMS4yMzMgMCAyLjIyNyAxLjMyMyAyLjIyNyAyLjkyOHYuMDIyYzAgMS42MDUgMS4wMDUgMi45MDEgMi4yMzcgMi45MDFoMTQuNzUyYzEuMjMyIDAgMi4yMzctMS4zMDggMi4yMzctMi45MTN2LS4wMDd6IiBmaWxsPSIjRkFGQUZBIi8+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4K"
+                                />
+                              </div>
+                              <p
+                                className="ant-empty-description"
+                              >
+                                No Data
+                              </p>
+                            </div>
+                          </LocaleReceiver>
+                        </OriginEmpty>
+                      </li>
+                    </ul>
+                  </div>
+                </Menus>
+              </LazyRenderBox>
+            </div>
+          </PopupInner>
+        </Align>
+      </AnimateChild>
+    </Animate>
+  </div>
+</Popup>
+`;
+
 exports[`Cascader support controlled mode 1`] = `
 <span
   class="ant-cascader-picker"

components/cascader/__tests__/index.test.js

@@ -398,6 +398,19 @@ describe('Cascader', () => {
     errorSpy.mockReset();
   });
 
+  it('should show not found content when options.length is 0', () => {
+    const customerOptions = [];
+    const wrapper = mount(<Cascader options={customerOptions} />);
+    wrapper.find('input').simulate('click');
+    const popupWrapper = mount(
+      wrapper
+        .find('Trigger')
+        .instance()
+        .getComponent(),
+    );
+    expect(popupWrapper).toMatchSnapshot();
+  });
+
   describe('limit filtered item count', () => {
     const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
 
@@ -429,4 +442,33 @@ describe('Cascader', () => {
       );
     });
   });
+
+  it('should warning if not find `value` in `options`', () => {
+    const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+    mount(<Cascader options={[{ label: 'a', value: 'a', children: [{ label: 'b' }] }]} />);
+    expect(errorSpy).toHaveBeenCalledWith(
+      'Warning: [antd: Cascader] Not found `value` in `options`.',
+    );
+    errorSpy.mockRestore();
+  });
+
+  // https://github.com/ant-design/ant-design/issues/17690
+  it('should not breaks when children is null', () => {
+    const optionsWithChildrenNull = [
+      {
+        value: 'zhejiang',
+        label: 'Zhejiang',
+        children: [
+          {
+            value: 'hangzhou',
+            label: 'Hangzhou',
+            children: null,
+          },
+        ],
+      },
+    ];
+    expect(() => {
+      mount(<Cascader options={optionsWithChildrenNull} />);
+    }).not.toThrow();
+  });
 });

components/cascader/index.en-US.md

@@ -14,53 +14,64 @@ Cascade selection box.
 
 ## API
 
-```html
-<Cascader options="{options}" onChange="{onChange}" />
+```jsx
+<Cascader options={options} onChange={onChange} />
 ```
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| allowClear | whether allow clear | boolean | true |
-| autoFocus | get focus when component mounted | boolean | false |
-| changeOnSelect | change value on each selection if set to true, see above demo for details | boolean | false |
-| className | additional css class | string | - |
-| defaultValue | initial selected value | string\[] | \[] |
-| disabled | whether disabled select | boolean | false |
-| displayRender | render function of displaying selected options | `(label, selectedOptions) => ReactNode` | `label => label.join(' / ')` |
-| expandTrigger | expand current item when click or hover, one of 'click' 'hover' | string | 'click' |
-| fieldNames | custom field name for label and value and children (before 3.7.0 it calls `filedNames` which is typo）) | object | `{ label: 'label', value: 'value', children: 'children' }` |
-| getPopupContainer | Parent Node which the selector should be rendered to. Default to `body`. When position issues happen, try to modify it into scrollable content and position it relative.[example](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body |
-| loadData | To load option lazily, and it cannot work with `showSearch` | `(selectedOptions) => void` | - |
-| notFoundContent | Specify content to show when no result matches. | string | 'Not Found' |
-| options | data options of cascade | object | - |
-| placeholder | input placeholder | string | 'Please select' |
-| popupClassName | additional className of popup overlay | string | - |
-| popupPlacement | use preset popup align config from builtinPlacements：`bottomLeft` `bottomRight` `topLeft` `topRight` | string | `bottomLeft` |
-| popupVisible | set visible of cascader popup | boolean | - |
-| showSearch | Whether show search input in single mode. | boolean\|object | false |
-| size | input size, one of `large` `default` `small` | string | `default` |
-| style | additional style | string | - |
-| suffixIcon | The custom suffix icon | ReactNode | - |
-| value | selected value | string\[] | - |
-| onChange | callback when finishing cascader select | `(value, selectedOptions) => void` | - |
-| onPopupVisibleChange | callback when popup shown or hidden | `(value) => void` | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| allowClear | whether allow clear | boolean | true |  |
+| autoFocus | get focus when component mounted | boolean | false |  |
+| changeOnSelect | change value on each selection if set to true, see above demo for details | boolean | false |  |
+| className | additional css class | string | - |  |
+| defaultValue | initial selected value | string\[] | \[] |  |
+| disabled | whether disabled select | boolean | false |  |
+| displayRender | render function of displaying selected options | `(label, selectedOptions) => ReactNode` | `label => label.join(' / ')` |  |
+| expandTrigger | expand current item when click or hover, one of 'click' 'hover' | string | 'click' |  |
+| fieldNames | custom field name for label and value and children (before 3.7.0 it calls `filedNames` which is typo）) | object | `{ label: 'label', value: 'value', children: 'children' }` | 3.7.0 |
+| getPopupContainer | Parent Node which the selector should be rendered to. Default to `body`. When position issues happen, try to modify it into scrollable content and position it relative.[example](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body |  |
+| loadData | To load option lazily, and it cannot work with `showSearch` | `(selectedOptions) => void` | - |  |
+| notFoundContent | Specify content to show when no result matches. | string | 'Not Found' |  |
+| options | data options of cascade | [Option](#Option)[] | - |  |
+| placeholder | input placeholder | string | 'Please select' |  |
+| popupClassName | additional className of popup overlay | string | - |  |
+| popupPlacement | use preset popup align config from builtinPlacements：`bottomLeft` `bottomRight` `topLeft` `topRight` | string | `bottomLeft` |  |
+| popupVisible | set visible of cascader popup | boolean | - |  |
+| showSearch | Whether show search input in single mode. | boolean\|object | false |  |
+| size | input size, one of `large` `default` `small` | string | `default` |  |
+| style | additional style | string | - |  |
+| suffixIcon | The custom suffix icon | ReactNode | - | 3.10.0 |
+| value | selected value | string\[] | - |  |
+| onChange | callback when finishing cascader select | `(value, selectedOptions) => void` | - |  |
+| onPopupVisibleChange | callback when popup shown or hidden | `(value) => void` | - |  |
 
 Fields in `showSearch`:
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| filter | The function will receive two arguments, inputValue and option, if the function returns true, the option will be included in the filtered set; Otherwise, it will be excluded. | `function(inputValue, path): boolean` |  |
-| limit | Set the count of filtered items | number \| false | 50 |
-| matchInputWidth | Whether the width of result list equals to input's | boolean |  |
-| render | Used to render filtered options. | `function(inputValue, path): ReactNode` |  |
-| sort | Used to sort filtered options. | `function(a, b, inputValue)` |  |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| filter | The function will receive two arguments, inputValue and option, if the function returns true, the option will be included in the filtered set; Otherwise, it will be excluded. | `function(inputValue, path): boolean` |  |  |
+| limit | Set the count of filtered items | number \| false | 50 | 3.11.0 |
+| matchInputWidth | Whether the width of result list equals to input's | boolean |  |  |
+| render | Used to render filtered options. | `function(inputValue, path): ReactNode` |  |  |
+| sort | Used to sort filtered options. | `function(a, b, inputValue)` |  |  |
+
+### Option
+
+```typescript
+interface Option {
+  value: string;
+  label?: React.ReactNode;
+  disabled?: boolean;
+  children?: Option[];
+}
+```
 
 ## Methods
 
-| Name    | Description  |
-| ------- | ------------ |
-| blur()  | remove focus |
-| focus() | get focus    |
+| Name    | Description  | Version |
+| ------- | ------------ | ------- |
+| blur()  | remove focus |         |
+| focus() | get focus    |         |
 
 <style>
 .ant-cascader-picker {

components/cascader/index.tsx

@@ -15,6 +15,8 @@ export interface CascaderOptionType {
   value?: string;
   label?: React.ReactNode;
   disabled?: boolean;
+  isLeaf?: boolean;
+  loading?: boolean;
   children?: Array<CascaderOptionType>;
   [key: string]: any;
 }
@@ -204,6 +206,14 @@ function flattenTree(
 
 const defaultDisplayRender = (label: string[]) => label.join(' / ');
 
+function warningValueNotExist(list: CascaderOptionType[], fieldNames: FieldNamesType = {}) {
+  (list || []).forEach(item => {
+    const valueFieldName = fieldNames.value || 'value';
+    warning(valueFieldName in item, 'Cascader', 'Not found `value` in `options`.');
+    warningValueNotExist(item[fieldNames.children || 'children'], fieldNames);
+  });
+}
+
 class Cascader extends React.Component<CascaderProps, CascaderState> {
   static defaultProps = {
     placeholder: 'Please select',
@@ -229,6 +239,10 @@ class Cascader extends React.Component<CascaderProps, CascaderState> {
       newState.flattenOptions = flattenTree(nextProps.options, nextProps);
     }
 
+    if (process.env.NODE_ENV !== 'production' && nextProps.options) {
+      warningValueNotExist(nextProps.options, getFieldNames(nextProps));
+    }
+
     return newState;
   }
 
@@ -424,6 +438,7 @@ class Cascader extends React.Component<CascaderProps, CascaderState> {
       allowClear,
       showSearch = false,
       suffixIcon,
+      notFoundContent,
       ...otherProps
     } = props;
 
@@ -481,8 +496,19 @@ class Cascader extends React.Component<CascaderProps, CascaderState> {
     ]);
 
     let options = props.options;
-    if (state.inputValue) {
-      options = this.generateFilteredOptions(prefixCls, renderEmpty);
+    if (options.length > 0) {
+      if (state.inputValue) {
+        options = this.generateFilteredOptions(prefixCls, renderEmpty);
+      }
+    } else {
+      const names: FilledFieldNamesType = getFilledFieldNames(this.props);
+      options = [
+        {
+          [names.label]: notFoundContent || renderEmpty('Cascader'),
+          [names.value]: 'ANT_CASCADER_NOT_FOUND',
+          disabled: true,
+        },
+      ];
     }
     // Dropdown menu should keep previous status until it is fully closed.
     if (!state.popupVisible) {
@@ -500,7 +526,7 @@ class Cascader extends React.Component<CascaderProps, CascaderState> {
     // The default value of `matchInputWidth` is `true`
     const resultListMatchInputWidth =
       (showSearch as ShowSearchType).matchInputWidth === false ? false : true;
-    if (resultListMatchInputWidth && state.inputValue && this.input) {
+    if (resultListMatchInputWidth && (state.inputValue || isNotFound) && this.input) {
       dropdownMenuColumnStyle.width = this.input.input.offsetWidth;
     }
 

components/cascader/index.zh-CN.md

@@ -15,53 +15,64 @@ subtitle: 级联选择
 
 ## API
 
-```html
-<Cascader options="{options}" onChange="{onChange}" />
+```jsx
+<Cascader options={options} onChange={onChange} />
 ```
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| allowClear | 是否支持清除 | boolean | true |
-| autoFocus | 自动获取焦点 | boolean | false |
-| changeOnSelect | 当此项为 true 时，点选每级菜单选项值都会发生变化，具体见上面的演示 | boolean | false |
-| className | 自定义类名 | string | - |
-| defaultValue | 默认的选中项 | string\[] | \[] |
-| disabled | 禁用 | boolean | false |
-| displayRender | 选择后展示的渲染函数 | `(label, selectedOptions) => ReactNode` | `label => label.join(' / ')` |
-| expandTrigger | 次级菜单的展开方式，可选 'click' 和 'hover' | string | 'click' |
-| fieldNames | 自定义 options 中 label name children 的字段（注意，3.7.0 之前的版本为 `filedNames`） | object | `{ label: 'label', value: 'value', children: 'children' }` |
-| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。[示例](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body |
-| loadData | 用于动态加载选项，无法与 `showSearch` 一起使用 | `(selectedOptions) => void` | - |
-| notFoundContent | 当下拉列表为空时显示的内容 | string | 'Not Found' |
-| options | 可选项数据源 | object | - |
-| placeholder | 输入框占位文本 | string | '请选择' |
-| popupClassName | 自定义浮层类名 | string | - |
-| popupPlacement | 浮层预设位置：`bottomLeft` `bottomRight` `topLeft` `topRight` | Enum | `bottomLeft` |
-| popupVisible | 控制浮层显隐 | boolean | - |
-| showSearch | 在选择框中显示搜索框 | boolean | false |
-| size | 输入框大小，可选 `large` `default` `small` | string | `default` |
-| style | 自定义样式 | string | - |
-| suffixIcon | 自定义的选择框后缀图标 | ReactNode | - |
-| value | 指定选中项 | string\[] | - |
-| onChange | 选择完成后的回调 | `(value, selectedOptions) => void` | - |
-| onPopupVisibleChange | 显示/隐藏浮层的回调 | `(value) => void` | - |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| allowClear | 是否支持清除 | boolean | true |  |
+| autoFocus | 自动获取焦点 | boolean | false |  |
+| changeOnSelect | 当此项为 true 时，点选每级菜单选项值都会发生变化，具体见上面的演示 | boolean | false |  |
+| className | 自定义类名 | string | - |  |
+| defaultValue | 默认的选中项 | string\[] | \[] |  |
+| disabled | 禁用 | boolean | false |  |
+| displayRender | 选择后展示的渲染函数 | `(label, selectedOptions) => ReactNode` | `label => label.join(' / ')` |  |
+| expandTrigger | 次级菜单的展开方式，可选 'click' 和 'hover' | string | 'click' |  |
+| fieldNames | 自定义 options 中 label name children 的字段（注意，3.7.0 之前的版本为 `filedNames`） | object | `{ label: 'label', value: 'value', children: 'children' }` | 3.7.0 |
+| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。[示例](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body |  |
+| loadData | 用于动态加载选项，无法与 `showSearch` 一起使用 | `(selectedOptions) => void` | - |  |
+| notFoundContent | 当下拉列表为空时显示的内容 | string | 'Not Found' |  |
+| options | 可选项数据源 | [Option](#Option)[] | - |  |
+| placeholder | 输入框占位文本 | string | '请选择' |  |
+| popupClassName | 自定义浮层类名 | string | - |  |
+| popupPlacement | 浮层预设位置：`bottomLeft` `bottomRight` `topLeft` `topRight` | Enum | `bottomLeft` |  |
+| popupVisible | 控制浮层显隐 | boolean | - |  |
+| showSearch | 在选择框中显示搜索框 | boolean | false |  |
+| size | 输入框大小，可选 `large` `default` `small` | string | `default` |  |
+| style | 自定义样式 | string | - |  |
+| suffixIcon | 自定义的选择框后缀图标 | ReactNode | - | 3.10.0 |
+| value | 指定选中项 | string\[] | - |  |
+| onChange | 选择完成后的回调 | `(value, selectedOptions) => void` | - |  |
+| onPopupVisibleChange | 显示/隐藏浮层的回调 | `(value) => void` | - |  |
 
 `showSearch` 为对象时，其中的字段：
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| filter | 接收 `inputValue` `path` 两个参数，当 `path` 符合筛选条件时，应返回 true，反之则返回 false。 | `function(inputValue, path): boolean` |  |
-| limit | 搜索结果展示数量 | number \| false | 50 |
-| matchInputWidth | 搜索结果列表是否与输入框同宽 | boolean |  |
-| render | 用于渲染 filter 后的选项 | `function(inputValue, path): ReactNode` |  |
-| sort | 用于排序 filter 后的选项 | `function(a, b, inputValue)` |  |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| filter | 接收 `inputValue` `path` 两个参数，当 `path` 符合筛选条件时，应返回 true，反之则返回 false。 | `function(inputValue, path): boolean` |  |  |
+| limit | 搜索结果展示数量 | number \| false | 50 | 3.11.0 |
+| matchInputWidth | 搜索结果列表是否与输入框同宽 | boolean |  |  |
+| render | 用于渲染 filter 后的选项 | `function(inputValue, path): ReactNode` |  |  |
+| sort | 用于排序 filter 后的选项 | `function(a, b, inputValue)` |  |  |
+
+### Option
+
+```typescript
+interface Option {
+  value: string;
+  label?: React.ReactNode;
+  disabled?: boolean;
+  children?: Option[];
+}
+```
 
 ## 方法
 
-| 名称    | 描述     |
-| ------- | -------- |
-| blur()  | 移除焦点 |
-| focus() | 获取焦点 |
+| 名称    | 描述     | 版本 |
+| ------- | -------- | ---- |
+| blur()  | 移除焦点 |      |
+| focus() | 获取焦点 |      |
 
 <style>
 .ant-cascader-picker {

components/cascader/style/index.less

@@ -11,6 +11,8 @@
     // Keep it static for https://github.com/ant-design/ant-design/issues/16738
     position: static;
     width: 100%;
+    // https://github.com/ant-design/ant-design/issues/17582
+    padding-right: 24px;
     // Add important to fix https://github.com/ant-design/ant-design/issues/5078
     // because input.less will compile after cascader.less
     background-color: transparent !important;
@@ -60,7 +62,7 @@
       width: 100%;
       height: 20px;
       margin-top: -10px;
-      padding: 0 @control-padding-horizontal;
+      padding: 0 20px 0 @control-padding-horizontal;
       overflow: hidden;
       line-height: 20px;
       white-space: nowrap;
@@ -211,7 +213,7 @@
     }
 
     &-expand &-expand-icon,
-    &-expand &-loading-icon {
+    &-loading-icon {
       .iconfont-size-under-12px(10px);
 
       position: absolute;

components/checkbox/Checkbox.tsx

@@ -15,11 +15,11 @@ export interface AbstractCheckboxProps<T> {
   style?: React.CSSProperties;
   disabled?: boolean;
   onChange?: (e: T) => void;
-  onClick?: React.MouseEventHandler<any>;
-  onMouseEnter?: React.MouseEventHandler<any>;
-  onMouseLeave?: React.MouseEventHandler<any>;
-  onKeyPress?: React.KeyboardEventHandler<any>;
-  onKeyDown?: React.KeyboardEventHandler<any>;
+  onClick?: React.MouseEventHandler<HTMLElement>;
+  onMouseEnter?: React.MouseEventHandler<HTMLElement>;
+  onMouseLeave?: React.MouseEventHandler<HTMLElement>;
+  onKeyPress?: React.KeyboardEventHandler<HTMLElement>;
+  onKeyDown?: React.KeyboardEventHandler<HTMLElement>;
   value?: any;
   tabIndex?: number;
   name?: string;

components/checkbox/Group.tsx

@@ -136,7 +136,16 @@ class CheckboxGroup extends React.Component<CheckboxGroupProps, CheckboxGroupSta
     }
     const onChange = this.props.onChange;
     if (onChange) {
-      onChange(value.filter(val => registeredValues.indexOf(val) !== -1));
+      const options = this.getOptions();
+      onChange(
+        value
+          .filter(val => registeredValues.indexOf(val) !== -1)
+          .sort((a, b) => {
+            const indexA = options.findIndex(opt => opt.value === a);
+            const indexB = options.findIndex(opt => opt.value === b);
+            return indexA - indexB;
+          }),
+      );
     }
   };
 

components/checkbox/__tests__/group.test.js

@@ -133,4 +133,38 @@ describe('CheckboxGroup', () => {
 
     expect(onChange).toHaveBeenCalledWith([2]);
   });
+
+  // https://github.com/ant-design/ant-design/issues/17297
+  it('onChange should keep the order of the original values', () => {
+    const onChange = jest.fn();
+    const wrapper = mount(
+      <Checkbox.Group onChange={onChange}>
+        <Checkbox key={1} value={1} />
+        <Checkbox key={2} value={2} />
+        <Checkbox key={3} value={3} />
+        <Checkbox key={4} value={4} />
+      </Checkbox.Group>,
+    );
+
+    wrapper
+      .find('.ant-checkbox-input')
+      .at(0)
+      .simulate('change');
+    expect(onChange).toHaveBeenCalledWith([1]);
+    wrapper
+      .find('.ant-checkbox-input')
+      .at(1)
+      .simulate('change');
+    expect(onChange).toHaveBeenCalledWith([1, 2]);
+    wrapper
+      .find('.ant-checkbox-input')
+      .at(0)
+      .simulate('change');
+    expect(onChange).toHaveBeenCalledWith([2]);
+    wrapper
+      .find('.ant-checkbox-input')
+      .at(0)
+      .simulate('change');
+    expect(onChange).toHaveBeenCalledWith([1, 2]);
+  });
 });

components/checkbox/index.en-US.md

@@ -17,31 +17,31 @@ Checkbox component.
 
 #### Checkbox
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| autoFocus | get focus when component mounted | boolean | false |
-| checked | Specifies whether the checkbox is selected. | boolean | false |
-| defaultChecked | Specifies the initial state: whether or not the checkbox is selected. | boolean | false |
-| disabled | Disable checkbox | boolean | false |
-| indeterminate | indeterminate checked state of checkbox | boolean | false |
-| onChange | The callback function that is triggered when the state changes. | Function(e:Event) | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| autoFocus | get focus when component mounted | boolean | false | 3.6.2 |
+| checked | Specifies whether the checkbox is selected. | boolean | false | 3.6.2 |
+| defaultChecked | Specifies the initial state: whether or not the checkbox is selected. | boolean | false | 3.6.2 |
+| disabled | Disable checkbox | boolean | false | 3.6.2 |
+| indeterminate | indeterminate checked state of checkbox | boolean | false | 3.6.2 |
+| onChange | The callback function that is triggered when the state changes. | Function(e:Event) | - | 3.6.2 |
 
 #### Checkbox Group
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| defaultValue | Default selected value | string\[] | \[] |
-| disabled | Disable all checkboxes | boolean | false |
-| name | The `name` property of all `input[type="checkbox"]` children | string | - |
-| options | Specifies options | string\[] | \[] |
-| value | Used for setting the currently selected value. | string\[] | \[] |
-| onChange | The callback function that is triggered when the state changes. | Function(checkedValue) | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| defaultValue | Default selected value | string\[] | \[] | 3.6.2 |
+| disabled | Disable all checkboxes | boolean | false | 3.6.2 |
+| name | The `name` property of all `input[type="checkbox"]` children | string | - | 3.16.0 |
+| options | Specifies options | string\[] | \[] | 3.6.2 |
+| value | Used for setting the currently selected value. | string\[] | \[] | 3.6.2 |
+| onChange | The callback function that is triggered when the state changes. | Function(checkedValue) | - | 3.6.2 |
 
 ### Methods
 
 #### Checkbox
 
-| Name    | Description  |
-| ------- | ------------ |
-| blur()  | remove focus |
-| focus() | get focus    |
+| Name    | Description  | Version |
+| ------- | ------------ | ------- |
+| blur()  | remove focus | 3.6.2   |
+| focus() | get focus    | 3.6.2   |

components/checkbox/index.zh-CN.md

@@ -18,31 +18,31 @@ title: Checkbox
 
 #### Checkbox
 
-| 参数           | 说明                                    | 类型              | 默认值 |
-| -------------- | --------------------------------------- | ----------------- | ------ |
-| autoFocus      | 自动获取焦点                            | boolean           | false  |
-| checked        | 指定当前是否选中                        | boolean           | false  |
-| defaultChecked | 初始是否选中                            | boolean           | false  |
-| disabled       | 失效状态                                | boolean           | false  |
-| indeterminate  | 设置 indeterminate 状态，只负责样式控制 | boolean           | false  |
-| onChange       | 变化时回调函数                          | Function(e:Event) | -      |
+| 参数           | 说明                                    | 类型              | 默认值 | 版本  |
+| -------------- | --------------------------------------- | ----------------- | ------ | ----- |
+| autoFocus      | 自动获取焦点                            | boolean           | false  | 3.6.2 |
+| checked        | 指定当前是否选中                        | boolean           | false  | 3.6.2 |
+| defaultChecked | 初始是否选中                            | boolean           | false  | 3.6.2 |
+| disabled       | 失效状态                                | boolean           | false  | 3.6.2 |
+| indeterminate  | 设置 indeterminate 状态，只负责样式控制 | boolean           | false  | 3.6.2 |
+| onChange       | 变化时回调函数                          | Function(e:Event) | -      | 3.6.2 |
 
 #### Checkbox Group
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| defaultValue | 默认选中的选项 | string\[] | \[] |
-| disabled | 整组失效 | boolean | false |
-| name | CheckboxGroup 下所有 `input[type="checkbox"]` 的 `name` 属性 | string | - |
-| options | 指定可选项 | string\[] | \[] |
-| value | 指定选中的选项 | string\[] | \[] |
-| onChange | 变化时回调函数 | Function(checkedValue) | - |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| defaultValue | 默认选中的选项 | string\[] | \[] | 3.6.2 |
+| disabled | 整组失效 | boolean | false | 3.6.2 |
+| name | CheckboxGroup 下所有 `input[type="checkbox"]` 的 `name` 属性 | string | - | 3.16.0 |
+| options | 指定可选项 | string\[] | \[] | 3.6.2 |
+| value | 指定选中的选项 | string\[] | \[] | 3.6.2 |
+| onChange | 变化时回调函数 | Function(checkedValue) | - | 3.6.2 |
 
 ### 方法
 
 #### Checkbox
 
-| 名称    | 描述     |
-| ------- | -------- |
-| blur()  | 移除焦点 |
-| focus() | 获取焦点 |
+| 名称    | 描述     | 版本  |
+| ------- | -------- | ----- |
+| blur()  | 移除焦点 | 3.6.2 |
+| focus() | 获取焦点 | 3.6.2 |

components/checkbox/style/mixin.less

@@ -150,7 +150,6 @@
     }
   }
 
-  .@{checkbox-prefix-cls}-wrapper + span,
   .@{checkbox-prefix-cls} + span {
     padding-right: 8px;
     padding-left: 8px;

components/collapse/Collapse.tsx

@@ -9,8 +9,8 @@ import animation from '../_util/openAnimation';
 export type ExpandIconPosition = 'left' | 'right';
 
 export interface CollapseProps {
-  activeKey?: Array<string> | string;
-  defaultActiveKey?: Array<string>;
+  activeKey?: Array<string | number> | string | number;
+  defaultActiveKey?: Array<string | number> | string | number;
   /** 手风琴效果 */
   accordion?: boolean;
   destroyInactivePanel?: boolean;
@@ -19,7 +19,7 @@ export interface CollapseProps {
   className?: string;
   bordered?: boolean;
   prefixCls?: string;
-  expandIcon?: (panelProps: any) => React.ReactNode;
+  expandIcon?: (panelProps: PanelProps) => React.ReactNode;
   expandIconPosition?: ExpandIconPosition;
 }
 

components/collapse/CollapsePanel.tsx

@@ -4,7 +4,7 @@ import classNames from 'classnames';
 import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
 
 export interface CollapsePanelProps {
-  key: string;
+  key: string | number;
   header: React.ReactNode;
   disabled?: boolean;
   className?: string;

components/collapse/demo/accordion.md

@@ -16,7 +16,7 @@ In accordion mode, only one panel can be expanded at a time.
 ```jsx
 import { Collapse } from 'antd';
 
-const Panel = Collapse.Panel;
+const { Panel } = Collapse;
 
 const text = `
   A dog is a type of domesticated animal.

components/collapse/demo/basic.md

@@ -16,7 +16,7 @@ By default, any number of panels can be expanded at a time. The first panel is e
 ```jsx
 import { Collapse } from 'antd';
 
-const Panel = Collapse.Panel;
+const { Panel } = Collapse;
 
 function callback(key) {
   console.log(key);

components/collapse/demo/borderless.md

@@ -16,7 +16,7 @@ A borderless style of Collapse.
 ```jsx
 import { Collapse } from 'antd';
 
-const Panel = Collapse.Panel;
+const { Panel } = Collapse;
 
 const text = (
   <p style={{ paddingLeft: 24 }}>

components/collapse/demo/custom.md

@@ -16,7 +16,7 @@ Customize the background, border, margin styles and icon for each panel.
 ```jsx
 import { Collapse, Icon } from 'antd';
 
-const Panel = Collapse.Panel;
+const { Panel } = Collapse;
 
 const text = `
   A dog is a type of domesticated animal.

components/collapse/demo/mix.md

@@ -16,7 +16,7 @@ title:
 ```jsx
 import { Collapse } from 'antd';
 
-const Panel = Collapse.Panel;
+const { Panel } = Collapse;
 
 function callback(key) {
   console.log(key);

components/collapse/demo/noarrow.md

@@ -16,7 +16,7 @@ You can hide the arrow icon by passing `showArrow={false}` to `CollapsePanel` co
 ```jsx
 import { Collapse } from 'antd';
 
-const Panel = Collapse.Panel;
+const { Panel } = Collapse;
 
 function callback(key) {
   console.log(key);

components/collapse/index.en-US.md

@@ -18,22 +18,22 @@ A content area which can be collapsed and expanded.
 
 | Property | Description | Type | Default | Version |
 | --- | --- | --- | --- | --- |
-| activeKey | Key of the active panel | string\[]\|string | No default value. In `accordion` mode, it's the key of the first panel. |  |
-| defaultActiveKey | Key of the initial active panel | string | - |  |
-| bordered | Toggles rendering of the border around the collapse block | boolean | `true` |  |
-| accordion | If `true`, `Collapse` renders as `Accordion` | boolean | `false` |  |
+| activeKey | Key of the active panel | string\[]\|string\| number\[]\|number | No default value. In `accordion` mode, it's the key of the first panel. |  |
+| defaultActiveKey | Key of the initial active panel | string\[]\|string\| number\[]\|number | - |  |
+| bordered | Toggles rendering of the border around the collapse block | boolean | `true` | 3.6.5 |
+| accordion | If `true`, `Collapse` renders as `Accordion` | boolean | `false` | 3.6.5 |
 | onChange | Callback function executed when active panel is changed | Function | - |  |
-| expandIcon | allow to customize collapse icon | (panelProps) => ReactNode | - |  |
+| expandIcon | allow to customize collapse icon | (panelProps) => ReactNode | - | 3.13.0 |
 | expandIconPosition | Set expand icon position: `left`, `right` | `left` | - | 3.17.0 |
-| destroyInactivePanel | Destroy Inactive Panel | boolean | `false` |  |
+| destroyInactivePanel | Destroy Inactive Panel | boolean | `false` | 3.6.5 |
 
 ### Collapse.Panel
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| disabled | If `true`, panel cannot be opened or closed | boolean | `false` |
-| forceRender | Forced render of content on panel, instead of lazy rending after clicking on header | boolean | `false` |
-| header | Title of the panel | string\|ReactNode | - |
-| key | Unique key identifying the panel from among its siblings | string | - |
-| showArrow | If `false`, panel will not show arrow icon | boolean | `true` |
-| extra | extra element in the corner | ReactNode | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| disabled | If `true`, panel cannot be opened or closed | boolean | `false` |  |
+| forceRender | Forced render of content on panel, instead of lazy rending after clicking on header | boolean | `false` | 3.2.0 |
+| header | Title of the panel | string\|ReactNode | - |  |
+| key | Unique key identifying the panel from among its siblings | string\|number | - |  |
+| showArrow | If `false`, panel will not show arrow icon | boolean | `true` | 3.1.0 |
+| extra | extra element in the corner | ReactNode | - | 3.14.0 |

components/collapse/index.zh-CN.md

@@ -19,22 +19,22 @@ cols: 1
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
-| activeKey | 当前激活 tab 面板的 key | string\[]\|string | 默认无，accordion 模式下默认第一个元素 |  |
-| defaultActiveKey | 初始化选中面板的 key | string | 无 |  |
-| bordered | 带边框风格的折叠面板 | boolean | `true` |  |
-| accordion | 手风琴模式 | boolean | `false` |  |
+| activeKey | 当前激活 tab 面板的 key | string\[]\|string\| number\[]\|number | 默认无，accordion 模式下默认第一个元素 |  |
+| defaultActiveKey | 初始化选中面板的 key | string\[]\|string\| number\[]\|number | 无 |  |
+| bordered | 带边框风格的折叠面板 | boolean | `true` | 3.13.0 |
+| accordion | 手风琴模式 | boolean | `false` | 3.13.0 |
 | onChange | 切换面板的回调 | Function | 无 |  |
-| expandIcon | 自定义切换图标 | (panelProps) => ReactNode | - |  |
+| expandIcon | 自定义切换图标 | (panelProps) => ReactNode | - | 3.13.0 |
 | expandIconPosition | 设置图标位置： `left`, `right` | `left` | - | 3.17.0 |
-| destroyInactivePanel | 销毁折叠隐藏的面板 | boolean | `false` |  |
+| destroyInactivePanel | 销毁折叠隐藏的面板 | boolean | `false` | 3.13.0 |
 
 ### Collapse.Panel
 
-| 参数        | 说明                                       | 类型              | 默认值 |
-| ----------- | ------------------------------------------ | ----------------- | ------ |
-| disabled    | 禁用后的面板展开与否将无法通过用户交互改变 | boolean           | false  |
-| forceRender | 被隐藏时是否渲染 DOM 结构                  | boolean           | false  |
-| header      | 面板头内容                                 | string\|ReactNode | 无     |
-| key         | 对应 activeKey                             | string            | 无     |
-| showArrow   | 是否展示当前面板上的箭头                   | boolean           | `true` |
-| extra       | 自定义渲染每个面板右上角的内容             | ReactNode         | -      |
+| 参数        | 说明                                       | 类型              | 默认值 | 版本   |
+| ----------- | ------------------------------------------ | ----------------- | ------ | ------ |
+| disabled    | 禁用后的面板展开与否将无法通过用户交互改变 | boolean           | false  |        |
+| forceRender | 被隐藏时是否渲染 DOM 结构                  | boolean           | false  | 3.2.0  |
+| header      | 面板头内容                                 | string\|ReactNode | 无     |        |
+| key         | 对应 activeKey                             | string\|number            | 无     |        |
+| showArrow   | 是否展示当前面板上的箭头                   | boolean           | `true` | 3.13.0 |
+| extra       | 自定义渲染每个面板右上角的内容             | ReactNode         | -      | 3.14.0 |

components/collapse/style/index.less

@@ -9,7 +9,7 @@
   background-color: @collapse-header-bg;
   border: @border-width-base @border-style-base @border-color-base;
   border-bottom: 0;
-  border-radius: @border-radius-base;
+  border-radius: @collapse-panel-border-radius;
 
   & > &-item {
     border-bottom: @border-width-base @border-style-base @border-color-base;
@@ -17,7 +17,7 @@
     &:last-child {
       &,
       & > .@{collapse-prefix-cls}-header {
-        border-radius: 0 0 @border-radius-base @border-radius-base;
+        border-radius: 0 0 @collapse-panel-border-radius @collapse-panel-border-radius;
       }
     }
 
@@ -97,7 +97,7 @@
 
   &-item:last-child {
     > .@{collapse-prefix-cls}-content {
-      border-radius: 0 0 @border-radius-base @border-radius-base;
+      border-radius: 0 0 @collapse-panel-border-radius @collapse-panel-border-radius;
     }
   }
 

components/comment/index.en-US.md

@@ -13,11 +13,11 @@ Comments can be used to enable discussions on an entity such as a page, blog pos
 
 ## API
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| actions | List of action items rendered below the comment content | Array<ReactNode> | - |
-| author | The element to display as the comment author | string\|ReactNode | - |
-| avatar | The element to display as the comment avatar - generally an antd `Avatar` or src | string\|ReactNode | - |
-| children | Nested comments should be provided as children of the Comment | ReactNode | - |
-| content | The main content of the comment | string\|ReactNode | - |
-| datetime | A datetime element containing the time to be displayed | string\|ReactNode | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| actions | List of action items rendered below the comment content | Array<ReactNode> | - | 3.11.0 |
+| author | The element to display as the comment author | string\|ReactNode | - | 3.11.0 |
+| avatar | The element to display as the comment avatar - generally an antd `Avatar` or src | string\|ReactNode | - | 3.11.0 |
+| children | Nested comments should be provided as children of the Comment | ReactNode | - | 3.11.0 |
+| content | The main content of the comment | string\|ReactNode | - | 3.11.0 |
+| datetime | A datetime element containing the time to be displayed | string\|ReactNode | - | 3.11.0 |

components/comment/index.tsx

@@ -14,7 +14,7 @@ export interface CommentProps {
   /** The main content of the comment */
   content: React.ReactNode;
   /** Nested comments should be provided as children of the Comment */
-  children?: any;
+  children?: React.ReactNode;
   /** Comment prefix defaults to '.ant-comment' */
   prefixCls?: string;
   /** Additional style for the comment */

components/comment/index.zh-CN.md

@@ -14,11 +14,11 @@ cols: 1
 
 ## API
 
-| Property | Description                                            | Type              | Default |
-| -------- | ------------------------------------------------------ | ----------------- | ------- |
-| actions  | 在评论内容下面呈现的操作项列表                         | Array<ReactNode>  | -       |
-| author   | 要显示为注释作者的元素                                 | string\|ReactNode | -       |
-| avatar   | 要显示为评论头像的元素 - 通常是 antd `Avatar` 或者 src | string\|ReactNode | -       |
-| children | 嵌套注释应作为注释的子项提供                           | ReactNode         | -       |
-| content  | 评论的主要内容                                         | string\|ReactNode | -       |
-| datetime | 展示时间描述                                           | string\|ReactNode | -       |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| actions | 在评论内容下面呈现的操作项列表 | Array<ReactNode> | - | 3.11.0 |
+| author | 要显示为注释作者的元素 | string\|ReactNode | - | 3.11.0 |
+| avatar | 要显示为评论头像的元素 - 通常是 antd `Avatar` 或者 src | string\|ReactNode | - | 3.11.0 |
+| children | 嵌套注释应作为注释的子项提供 | ReactNode | - | 3.11.0 |
+| content | 评论的主要内容 | string\|ReactNode | - | 3.11.0 |
+| datetime | 展示时间描述 | string\|ReactNode | - | 3.11.0 |

components/config-provider/__tests__/components.test.js

@@ -354,7 +354,7 @@ describe('ConfigProvider', () => {
     // Modal
     testPair('Modal', props => (
       <div>
-        <Modal {...props} visible>
+        <Modal {...props} visible getContainer={false}>
           Bamboo is Little Light
         </Modal>
       </div>

components/config-provider/index.en-US.md

@@ -35,10 +35,10 @@ Some component use dynamic style to support wave effect. You can config `csp` pr
 
 ## API
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| autoInsertSpaceInButton | Set `false` to remove space between 2 chinese characters on Button | boolean | true |
-| csp | Set [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) config | { nonce: string } | - |
-| renderEmpty | set empty content of components. Ref [Empty](/components/empty/) | Function(componentName: string): ReactNode | - |
-| getPopupContainer | to set the container of the popup element. The default is to create a `div` element in `body`. | Function(triggerNode) | `() => document.body` |
-| prefixCls | set prefix class | string | ant |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| autoInsertSpaceInButton | Set `false` to remove space between 2 chinese characters on Button | boolean | true | 3.13.0 |
+| csp | Set [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) config | { nonce: string } | - | 3.13.1 |
+| renderEmpty | set empty content of components. Ref [Empty](/components/empty/) | Function(componentName: string): ReactNode | - | 3.12.2 |
+| getPopupContainer | to set the container of the popup element. The default is to create a `div` element in `body`. | Function(triggerNode) | `() => document.body` | 3.11.0 |
+| prefixCls | set prefix class | string | ant | 3.12.0 |

components/config-provider/index.zh-CN.md

@@ -36,10 +36,10 @@ return (
 
 ## API
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| autoInsertSpaceInButton | 设置为 `false` 时，移除按钮中 2 个汉字之间的空格 | boolean | true |
-| csp | 设置 [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) 配置 | { nonce: string } | - |
-| renderEmpty | 自定义组件空状态。参考 [空状态](/components/empty/) | Function(componentName: string): ReactNode | - |
-| getPopupContainer | 弹出框（Select, Tooltip, Menu 等等）渲染父节点，默认渲染到 body 上。 | Function(triggerNode) | () => document.body |
-| prefixCls | 设置统一样式前缀 | string | ant |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| autoInsertSpaceInButton | 设置为 `false` 时，移除按钮中 2 个汉字之间的空格 | boolean | true | 3.13.0 |
+| csp | 设置 [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) 配置 | { nonce: string } | - | 3.13.1 |
+| renderEmpty | 自定义组件空状态。参考 [空状态](/components/empty/) | Function(componentName: string): ReactNode | - | 3.12.2 |
+| getPopupContainer | 弹出框（Select, Tooltip, Menu 等等）渲染父节点，默认渲染到 body 上。 | Function(triggerNode) | () => document.body | 3.11.0 |
+| prefixCls | 设置统一样式前缀 | string | ant | 3.12.0 |

components/date-picker/InputIcon.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import Icon from '../icon';
 import classNames from 'classnames';
 
-export default function InputIcon(props: { suffixIcon: any; prefixCls: string }) {
+export default function InputIcon(props: { suffixIcon: React.ReactNode; prefixCls: string }) {
   const { suffixIcon, prefixCls } = props;
   return (
     (suffixIcon &&

components/date-picker/RangePicker.tsx

@@ -150,6 +150,9 @@ class RangePicker extends React.Component<any, RangePickerState> {
         showDate: getShowDateFromValue(value) || showDate,
       }));
     }
+    if (value[0] && value[0].diff(value[1]) > 0) {
+      value[1] = undefined;
+    }
     const [start, end] = value;
     props.onChange(value, [formatDate(start, props.format), formatDate(end, props.format)]);
   };

components/date-picker/__tests__/RangePicker.test.js

@@ -387,4 +387,17 @@ describe('RangePicker', () => {
       ).toBe(false);
     });
   });
+
+  // https://github.com/ant-design/ant-design/issues/17135
+  it('the end time should be less than the start time', () => {
+    const wrapper = mount(
+      <RangePicker defaultValue={[moment(), moment()]} />,
+    );
+    wrapper.find('.ant-calendar-picker-input').simulate('click');
+    const firstInput = wrapper.find('.ant-calendar-input').first();
+    const secondInput = wrapper.find('.ant-calendar-input').last();
+    firstInput.simulate('change', { target: { value: moment().add(1, 'day').format('YYYY-MM-DD')}});
+    expect(firstInput.getDOMNode().value).toBe(moment().add(1, 'day').format('YYYY-MM-DD'));
+    expect(secondInput.getDOMNode().value).toBe('');
+  });
 });

components/date-picker/demo/start-end.md

@@ -30,7 +30,7 @@ class DateRange extends React.Component {
   };
 
   disabledStartDate = startValue => {
-    const endValue = this.state.endValue;
+    const { endValue } = this.state;
     if (!startValue || !endValue) {
       return false;
     }
@@ -38,7 +38,7 @@ class DateRange extends React.Component {
   };
 
   disabledEndDate = endValue => {
-    const startValue = this.state.startValue;
+    const { startValue } = this.state;
     if (!endValue || !startValue) {
       return false;
     }

components/date-picker/index.en-US.md

@@ -45,79 +45,80 @@ import 'moment/locale/zh-cn';
 
 The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicker.
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| allowClear | Whether to show clear button | boolean | true |
-| autoFocus | get focus when component mounted | boolean | false |
-| className | picker className | string | '' |
-| dateRender | custom rendering function for date cells | function(currentDate: moment, today: moment) => React.ReactNode | - |
-| disabled | determine whether the DatePicker is disabled | boolean | false |
-| disabledDate | specify the date that cannot be selected | (currentDate: moment) => boolean | - |
-| dropdownClassName | to customize the className of the popup calendar | string | - |
-| getCalendarContainer | to set the container of the floating layer, while the default is to create a `div` element in `body` | function(trigger) | - |
-| locale | localization configuration | object | [default](https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json) |
-| mode | picker panel mode | `time|date|month|year|decade` | 'date' |
-| open | open state of picker | boolean | - |
-| placeholder | placeholder of date input | string\|RangePicker\[] | - |
-| popupStyle | to customize the style of the popup calendar | object | {} |
-| size | determine the size of the input box, the height of `large` and `small`, are 40px and 24px respectively, while default size is 32px | string | - |
-| suffixIcon | The custom suffix icon | ReactNode | - |
-| style | to customize the style of the input box | object | {} |
-| onOpenChange | a callback function, can be executed whether the popup calendar is popped up or closed | function(status) | - |
-| onPanelChange | callback when picker panel mode is changed | function(value, mode) | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| allowClear | Whether to show clear button | boolean | true |  |
+| autoFocus | get focus when component mounted | boolean | false |  |
+| className | picker className | string | '' |  |
+| dateRender | custom rendering function for date cells | function(currentDate: moment, today: moment) => React.ReactNode | - |  |
+| disabled | determine whether the DatePicker is disabled | boolean | false |  |
+| disabledDate | specify the date that cannot be selected | (currentDate: moment) => boolean | - |  |
+| dropdownClassName | to customize the className of the popup calendar | string | - | 3.3.0 |
+| getCalendarContainer | to set the container of the floating layer, while the default is to create a `div` element in `body` | function(trigger) | - |  |
+| locale | localization configuration | object | [default](https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json) |  |
+| mode | picker panel mode（[Cannot select year or month anymore?](/docs/react/faq#When-set-mode-to-DatePicker/RangePicker,-cannot-select-year-or-month-anymore?) | `time|date|month|year|decade` | 'date' |  |
+| open | open state of picker | boolean | - |  |
+| placeholder | placeholder of date input | string\|RangePicker\[] | - |  |
+| popupStyle | to customize the style of the popup calendar | object | {} |  |
+| size | determine the size of the input box, the height of `large` and `small`, are 40px and 24px respectively, while default size is 32px | string | - |  |
+| suffixIcon | The custom suffix icon | ReactNode | - | 3.10.0 |
+| style | to customize the style of the input box | object | {} |  |
+| onOpenChange | a callback function, can be executed whether the popup calendar is popped up or closed | function(status) | - |  |
+| onPanelChange | callback when picker panel mode is changed | function(value, mode) | - | 3.5.0 |
 
 ### Common Methods
 
-| Name    | Description  |
-| ------- | ------------ |
-| blur()  | remove focus |
-| focus() | get focus    |
+| Name    | Description  | Version |
+| ------- | ------------ | ------- |
+| blur()  | remove focus |         |
+| focus() | get focus    |         |
 
 ### DatePicker
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| defaultValue | to set default date, if start time or end time is null or undefined, the date range will be an open interval | [moment](http://momentjs.com/) | - |
-| defaultPickerValue | to set default picker date | [moment](http://momentjs.com/) | - |
-| disabledTime | to specify the time that cannot be selected | function(date) | - |
-| format | to set the date format, refer to [moment.js](http://momentjs.com/). When an array is provided, all values are used for parsing and first value is used for formatting. | string \| string[] | "YYYY-MM-DD" |
-| renderExtraFooter | render extra footer in panel | (mode) => React.ReactNode | - |
-| showTime | to provide an additional time selection | object\|boolean | [TimePicker Options](/components/time-picker/#API) |
-| showTime.defaultValue | to set default time of selected date, [demo](#components-date-picker-demo-disabled-date) | [moment](http://momentjs.com/) | moment() |
-| showToday | whether to show "Today" button | boolean | true |
-| value | to set date | [moment](http://momentjs.com/) | - |
-| onChange | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | - |
-| onOk | callback when click ok button | function() | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| defaultValue | to set default date, if start time or end time is null or undefined, the date range will be an open interval | [moment](http://momentjs.com/) | - |  |
+| defaultPickerValue | to set default picker date | [moment](http://momentjs.com/) | - | 3.10.8 |
+| disabledTime | to specify the time that cannot be selected | function(date) | - |  |
+| format | to set the date format, refer to [moment.js](http://momentjs.com/). When an array is provided, all values are used for parsing and first value is used for formatting. | string \| string[] | "YYYY-MM-DD" |  |
+| renderExtraFooter | render extra footer in panel | (mode) => React.ReactNode | - |  |
+| showTime | to provide an additional time selection | object\|boolean | [TimePicker Options](/components/time-picker/#API) |  |
+| showTime.defaultValue | to set default time of selected date, [demo](#components-date-picker-demo-disabled-date) | [moment](http://momentjs.com/) | moment() |  |
+| showToday | whether to show "Today" button | boolean | true |  |
+| value | to set date | [moment](http://momentjs.com/) | - |  |
+| onChange | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | - |  |
+| onOk | callback when click ok button | function() | - |  |
+| onPanelChange | Callback function for panel changing | function(value, mode) | - | 3.19.8 |
 
 ### MonthPicker
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| defaultValue | to set default date | [moment](http://momentjs.com/) | - |
-| defaultPickerValue | to set default picker date | [moment](http://momentjs.com/) | - |
-| format | to set the date format, refer to [moment.js](http://momentjs.com/) | string | "YYYY-MM" |
-| monthCellContentRender | Custom month cell content render method | function(date, locale): ReactNode | - |
-| renderExtraFooter | render extra footer in panel | () => React.ReactNode | - |
-| value | to set date | [moment](http://momentjs.com/) | - |
-| onChange | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| defaultValue | to set default date | [moment](http://momentjs.com/) | - |  |
+| defaultPickerValue | to set default picker date | [moment](http://momentjs.com/) | - | 3.10.8 |
+| format | to set the date format, refer to [moment.js](http://momentjs.com/) | string | "YYYY-MM" |  |
+| monthCellContentRender | Custom month cell content render method | function(date, locale): ReactNode | - |  |
+| renderExtraFooter | render extra footer in panel | () => React.ReactNode | - |  |
+| value | to set date | [moment](http://momentjs.com/) | - |  |
+| onChange | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | - |  |
 
 ### WeekPicker
 
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| defaultValue | to set default date | [moment](http://momentjs.com/) | - |
-| defaultPickerValue | to set default picker date | [moment](http://momentjs.com/) | - |
-| format | to set the date format, refer to [moment.js](http://momentjs.com/) | string | "YYYY-wo" |
-| value | to set date | [moment](http://momentjs.com/) | - |
-| onChange | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | - |
-| renderExtraFooter | render extra footer in panel | (mode) => React.ReactNode | - |
+| Property | Description | Type | Default | Version |
+| --- | --- | --- | --- | --- |
+| defaultValue | to set default date | [moment](http://momentjs.com/) | - |  |
+| defaultPickerValue | to set default picker date | [moment](http://momentjs.com/) | - | 3.10.8 |
+| format | to set the date format, refer to [moment.js](http://momentjs.com/) | string | "YYYY-wo" |  |
+| value | to set date | [moment](http://momentjs.com/) | - |  |
+| onChange | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | - |  |
+| renderExtraFooter | render extra footer in panel | (mode) => React.ReactNode | - | 3.12.0 |
 
 ### RangePicker
 
 | Property | Description | Type | Default | Version |
 | --- | --- | --- | --- | --- |
 | defaultValue | to set default date | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)] | - |  |
-| defaultPickerValue | to set default picker date | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)\] | - |  |
+| defaultPickerValue | to set default picker date | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)\] | - | 3.10.8 |
 | disabledTime | to specify the time that cannot be selected | function(dates: \[moment, moment], partial: `'start'|'end'`) | - |  |
 | format | to set the date format, refer to [moment.js](http://momentjs.com/). When an array is provided, all values are used for parsing and first value is used for formatting. | string \| string[] | "YYYY-MM-DD HH:mm:ss" |  |
 | ranges | preseted ranges for quick selection | { \[range: string]: [moment](http://momentjs.com/)\[] } \| { \[range: string]: () => [moment](http://momentjs.com/)\[] } | - |  |
@@ -126,7 +127,7 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicke
 | showTime | to provide an additional time selection | object\|boolean | [TimePicker Options](/components/time-picker/#API) |  |
 | showTime.defaultValue | to set default time of selected date, [demo](#components-date-picker-demo-disabled-date) | [moment](http://momentjs.com/)\[] | \[moment(), moment()] |  |
 | value | to set date | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)] | - |  |
-| onCalendarChange | a callback function, can be executed when the start time or the end time of the range is changing | function(dates: \[moment, moment], dateStrings: \[string, string]) | - |  |
+| onCalendarChange | a callback function, can be executed when the start time or the end time of the range is changing | function(dates: \[moment, moment], dateStrings: \[string, string]) | - | 3.10.9 |
 | onChange | a callback function, can be executed when the selected time is changing | function(dates: \[moment, moment], dateStrings: \[string, string]) | - |  |
 | onOk | callback when click ok button | function(dates: [moment](http://momentjs.com/)\[]) | - |  |
 

components/date-picker/index.zh-CN.md

@@ -47,80 +47,80 @@ moment.locale('zh-cn');
 
 以下 API 为 DatePicker、MonthPicker、RangePicker, WeekPicker 共享的 API。
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| allowClear | 是否显示清除按钮 | boolean | true |
-| autoFocus | 自动获取焦点 | boolean | false |
-| className | 选择器 className | string | '' |
-| dateRender | 自定义日期单元格的内容 | function(currentDate: moment, today: moment) => React.ReactNode | - |
-| disabled | 禁用 | boolean | false |
-| disabledDate | 不可选择的日期 | (currentDate: moment) => boolean | 无 |
-| dropdownClassName | 额外的弹出日历 className | string | - |
-| getCalendarContainer | 定义浮层的容器，默认为 body 上新建 div | function(trigger) | 无 |
-| locale | 国际化配置 | object | [默认配置](https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json) |
-| open | 控制弹层是否展开 | boolean | - |
-| placeholder | 输入框提示文字 | string\|RangePicker\[] | - |
-| popupStyle | 额外的弹出日历样式 | object | {} |
-| size | 输入框大小，`large` 高度为 40px，`small` 为 24px，默认是 32px | string | 无 |
-| suffixIcon | 自定义的选择框后缀图标 | ReactNode | - |
-| style | 自定义输入框样式 | object | {} |
-| onOpenChange | 弹出日历和关闭日历的回调 | function(status) | 无 |
-| onPanelChange | 日历面板切换的回调 | function(value, mode) | - |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| allowClear | 是否显示清除按钮 | boolean | true |  |
+| autoFocus | 自动获取焦点 | boolean | false |  |
+| className | 选择器 className | string | '' |  |
+| dateRender | 自定义日期单元格的内容 | function(currentDate: moment, today: moment) => React.ReactNode | - |  |
+| disabled | 禁用 | boolean | false |  |
+| disabledDate | 不可选择的日期 | (currentDate: moment) => boolean | 无 |  |
+| dropdownClassName | 额外的弹出日历 className | string | - | 3.3.0 |
+| getCalendarContainer | 定义浮层的容器，默认为 body 上新建 div | function(trigger) | 无 |  |
+| locale | 国际化配置 | object | [默认配置](https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json) |  |
+| mode | 日期面板的状态（[设置后无法选择年份/月份？](/docs/react/faq#当我指定了-DatePicker/RangePicker-的-mode-属性后，点击后无法选择年份/月份？)） | `time|date|month|year|decade` | 'date' |  |
+| open | 控制弹层是否展开 | boolean | - |  |
+| placeholder | 输入框提示文字 | string\|RangePicker\[] | - |  |
+| popupStyle | 额外的弹出日历样式 | object | {} |  |
+| size | 输入框大小，`large` 高度为 40px，`small` 为 24px，默认是 32px | string | 无 |  |
+| suffixIcon | 自定义的选择框后缀图标 | ReactNode | - | 3.10.0 |
+| style | 自定义输入框样式 | object | {} |  |
+| onOpenChange | 弹出日历和关闭日历的回调 | function(status) | 无 |  |
+| onPanelChange | 日历面板切换的回调 | function(value, mode) | - | 3.12.0 |
 
 ### 共同的方法
 
-| 名称    | 描述     |
-| ------- | -------- |
-| blur()  | 移除焦点 |
-| focus() | 获取焦点 |
+| 名称    | 描述     | 版本 |
+| ------- | -------- | ---- |
+| blur()  | 移除焦点 |      |
+| focus() | 获取焦点 |      |
 
 ### DatePicker
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| defaultValue | 默认日期，如果开始时间或结束时间为 `null` 或者 `undefined`，日期范围将是一个开区间 | [moment](http://momentjs.com/) | 无 |
-| defaultPickerValue | 默认面板日期 | [moment](http://momentjs.com/) | 无 |
-| disabledTime | 不可选择的时间 | function(date) | 无 |
-| format | 设置日期格式，为数组时支持多格式匹配，展示以第一个为准。配置参考 [moment.js](http://momentjs.com/) | string \| string[] | "YYYY-MM-DD" |
-| mode | 日期面板的状态 | `time|date|month|year|decade` | 'date' |
-| renderExtraFooter | 在面板中添加额外的页脚 | (mode) => React.ReactNode | - |
-| showTime | 增加时间选择功能 | Object\|boolean | [TimePicker Options](/components/time-picker/#API) |
-| showTime.defaultValue | 设置用户选择日期时默认的时分秒，[例子](#components-date-picker-demo-disabled-date) | [moment](http://momentjs.com/) | moment() |
-| showToday | 是否展示“今天”按钮 | boolean | true |
-| value | 日期 | [moment](http://momentjs.com/) | 无 |
-| onChange | 时间发生变化的回调 | function(date: moment, dateString: string) | 无 |
-| onOk | 点击确定按钮的回调 | function() | - |
-| onPanelChange | 日期面板变化时的回调 | function(value, mode) | - |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| defaultValue | 默认日期，如果开始时间或结束时间为 `null` 或者 `undefined`，日期范围将是一个开区间 | [moment](http://momentjs.com/) | 无 |  |
+| defaultPickerValue | 默认面板日期 | [moment](http://momentjs.com/) | 无 | 3.10.8 |
+| disabledTime | 不可选择的时间 | function(date) | 无 |  |
+| format | 设置日期格式，为数组时支持多格式匹配，展示以第一个为准。配置参考 [moment.js](http://momentjs.com/) | string \| string[] | "YYYY-MM-DD" |  |
+| renderExtraFooter | 在面板中添加额外的页脚 | (mode) => React.ReactNode | - |  |
+| showTime | 增加时间选择功能 | Object\|boolean | [TimePicker Options](/components/time-picker/#API) |  |
+| showTime.defaultValue | 设置用户选择日期时默认的时分秒，[例子](#components-date-picker-demo-disabled-date) | [moment](http://momentjs.com/) | moment() |  |
+| showToday | 是否展示“今天”按钮 | boolean | true |  |
+| value | 日期 | [moment](http://momentjs.com/) | 无 |  |
+| onChange | 时间发生变化的回调 | function(date: moment, dateString: string) | 无 |  |
+| onOk | 点击确定按钮的回调 | function() | - |  |
+| onPanelChange | 日期面板变化时的回调 | function(value, mode) | - | 3.5.0 |
 
 ### MonthPicker
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| defaultValue | 默认日期 | [moment](http://momentjs.com/) | 无 |
-| defaultPickerValue | 默认面板日期 | [moment](http://momentjs.com/) | 无 |
-| format | 展示的日期格式，配置参考 [moment.js](http://momentjs.com/) | string | "YYYY-MM" |
-| monthCellContentRender | 自定义的月份内容渲染方法 | function(date, locale): ReactNode | - |
-| renderExtraFooter | 在面板中添加额外的页脚 | () => React.ReactNode | - |
-| value | 日期 | [moment](http://momentjs.com/) | 无 |
-| onChange | 时间发生变化的回调，发生在用户选择时间时 | function(date: moment, dateString: string) | - |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| defaultValue | 默认日期 | [moment](http://momentjs.com/) | 无 |  |
+| defaultPickerValue | 默认面板日期 | [moment](http://momentjs.com/) | 无 | 3.10.8 |
+| format | 展示的日期格式，配置参考 [moment.js](http://momentjs.com/) | string | "YYYY-MM" |  |
+| monthCellContentRender | 自定义的月份内容渲染方法 | function(date, locale): ReactNode | - |  |
+| renderExtraFooter | 在面板中添加额外的页脚 | () => React.ReactNode | - |  |
+| value | 日期 | [moment](http://momentjs.com/) | 无 |  |
+| onChange | 时间发生变化的回调，发生在用户选择时间时 | function(date: moment, dateString: string) | - |  |
 
 ### WeekPicker
 
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| defaultValue | 默认日期 | [moment](http://momentjs.com/) | - |
-| defaultPickerValue | 默认面板日期 | [moment](http://momentjs.com/) | 无 |
-| format | 展示的日期格式，配置参考 [moment.js](http://momentjs.com/) | string | "YYYY-wo" |
-| value | 日期 | [moment](http://momentjs.com/) | - |
-| onChange | 时间发生变化的回调，发生在用户选择时间时 | function(date: moment, dateString: string) | - |
-| renderExtraFooter | 在面板中添加额外的页脚 | (mode) => React.ReactNode | - |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| defaultValue | 默认日期 | [moment](http://momentjs.com/) | - |  |
+| defaultPickerValue | 默认面板日期 | [moment](http://momentjs.com/) | 无 | 3.10.8 |
+| format | 展示的日期格式，配置参考 [moment.js](http://momentjs.com/) | string | "YYYY-wo" |  |
+| value | 日期 | [moment](http://momentjs.com/) | - |  |
+| onChange | 时间发生变化的回调，发生在用户选择时间时 | function(date: moment, dateString: string) | - |  |
+| renderExtraFooter | 在面板中添加额外的页脚 | (mode) => React.ReactNode | - | 3.12.0 |
 
 ### RangePicker
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
 | defaultValue | 默认日期 | [moment](http://momentjs.com/)\[] | 无 |  |
-| defaultPickerValue | 默认面板日期 | [moment](http://momentjs.com/)\[] | 无 |  |
+| defaultPickerValue | 默认面板日期 | [moment](http://momentjs.com/)\[] | 无 | 3.10.8 |
 | disabledTime | 不可选择的时间 | function(dates: \[moment, moment\], partial: `'start'|'end'`) | 无 |  |
 | format | 展示的日期格式 | string | "YYYY-MM-DD HH:mm:ss" |  |
 | ranges | 预设时间范围快捷选择 | { \[range: string]: [moment](http://momentjs.com/)\[] } \| { \[range: string]: () => [moment](http://momentjs.com/)\[] } | 无 |  |
@@ -141,4 +141,4 @@ moment.locale('zh-cn');
 
 ## FAQ
 
-- [当我指定了 DatePicker/RangePicker 的 `mode` 属性后，点击后无法选择年份/月份？](/docs/react/faq-cn#当我指定了-DatePicker/RangePicker-的-mode-属性后，点击后无法选择年份/月份？)
+- [当我指定了 DatePicker/RangePicker 的 mode 属性后，点击后无法选择年份/月份？](/docs/react/faq#当我指定了-DatePicker/RangePicker-的-mode-属性后，点击后无法选择年份/月份？)

components/date-picker/style/Calendar.less

@@ -1,3 +1,64 @@
+.calendarLeftArrow() {
+  height: 100%;
+
+  &::before,
+  &::after {
+    position: relative;
+    top: -1px;
+    display: inline-block;
+    width: 8px;
+    height: 8px;
+    vertical-align: middle;
+    border: 0 solid #aaa;
+    border-width: 1.5px 0 0 1.5px;
+    border-radius: 1px;
+    transform: rotate(-45deg) scale(.8);
+    transition: all .3s;
+    content: '';
+  }
+
+  &:hover::before,
+  &:hover::after {
+    border-color: @text-color;
+  }
+
+  &::after {
+    display: none;
+  }
+}
+
+.calendarLeftDoubleArrow() {
+  .calendarLeftArrow;
+
+  &::after {
+    position: relative;
+    left: -3px;
+    display: inline-block;
+  }
+}
+
+.calendarRightArrow() {
+  .calendarLeftArrow;
+
+  &::before,
+  &::after {
+    transform: rotate(135deg) scale(.8);
+  }
+}
+
+.calendarRightDoubleArrow() {
+  .calendarRightArrow;
+
+  &::before {
+    position: relative;
+    left: 3px;
+  }
+
+  &::after {
+    display: inline-block;
+  }
+}
+
 .calendarPanelHeader(@calendar-prefix-cls) {
   height: 40px;
   line-height: 40px;
@@ -49,36 +110,24 @@
   .@{calendar-prefix-cls}-prev-decade-btn,
   .@{calendar-prefix-cls}-prev-year-btn {
     left: 7px;
-
-    &::after {
-      content: '«';
-    }
+    .calendarLeftDoubleArrow;
   }
 
   .@{calendar-prefix-cls}-next-century-btn,
   .@{calendar-prefix-cls}-next-decade-btn,
   .@{calendar-prefix-cls}-next-year-btn {
     right: 7px;
-
-    &::after {
-      content: '»';
-    }
+    .calendarRightDoubleArrow;
   }
 
   .@{calendar-prefix-cls}-prev-month-btn {
     left: 29px;
-
-    &::after {
-      content: '‹';
-    }
+    .calendarLeftArrow;
   }
 
   .@{calendar-prefix-cls}-next-month-btn {
     right: 29px;
-
-    &::after {
-      content: '›';
-    }
+    .calendarRightArrow;
   }
 }
 

components/date-picker/style/Picker.less

@@ -43,6 +43,10 @@
 
   &-input {
     outline: none;
+
+    &.@{ant-prefix}-input {
+      line-height: @line-height-base;
+    }
   }
 
   &-input.@{ant-prefix}-input-sm {
@@ -51,7 +55,7 @@
   }
 
   &:hover &-input:not(.@{ant-prefix}-input-disabled) {
-    border-color: @primary-color;
+    border-color: @input-hover-border-color;
   }
 
   &:focus &-input:not(.@{ant-prefix}-input-disabled) {

components/date-picker/style/RangePicker.less

@@ -7,7 +7,6 @@
   background-color: transparent;
   border: 0;
   outline: 0;
-  vertical-align: top;
   .placeholder();
 
   &[disabled] {
@@ -97,10 +96,10 @@
   .@{calendar-prefix-cls}-input,
   .@{calendar-timepicker-prefix-cls}-input {
     .input;
-
     height: @input-height-sm;
     padding-right: 0;
     padding-left: 0;
+    line-height: @input-height-sm;
     border: 0;
     box-shadow: none;
 

components/date-picker/style/TimePicker.less

@@ -48,7 +48,6 @@
   &-select {
     position: relative; // Fix chrome weird render bug
     float: left;
-    box-sizing: border-box;
     height: 226px;
     overflow: hidden;
     font-size: @font-size-base;
@@ -68,7 +67,6 @@
     }
 
     ul {
-      box-sizing: border-box;
       width: 100%;
       max-height: 206px;
       margin: 0;
@@ -77,30 +75,35 @@
     }
 
     li {
-      box-sizing: content-box;
       width: 100%;
       height: 24px;
       margin: 0;
-      padding-left: 32px;
       line-height: 24px;
+      text-align: center;
       list-style: none;
       cursor: pointer;
-      transition: background 0.3s ease;
+      transition: all .3s;
       user-select: none;
-    }
 
-    li:last-child::after {
-      display: block;
-      height: 202px;
-      content: '';
-    }
+      &:last-child::after {
+        display: block;
+        height: 202px;
+        content: '';
+      }
 
-    li:hover {
-      background: @item-hover-bg;
+      &:hover {
+        background: @item-hover-bg;
+      }
+
+      &:focus {
+        color: @primary-color;
+        font-weight: 600;
+        outline: none;
+      }
     }
 
     li&-option-selected {
-      font-weight: bold;
+      font-weight: 600;
       background: @time-picker-selected-bg;
     }
 

components/descriptions/__tests__/__snapshots__/demo.test.js.snap

@@ -105,7 +105,7 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
 
 exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
 <div
-  class="ant-descriptions bordered"
+  class="ant-descriptions ant-descriptions-bordered"
 >
   <div
     class="ant-descriptions-title"
@@ -120,33 +120,33 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
         <tr
           class="ant-descriptions-row"
         >
-          <td
+          <th
             class="ant-descriptions-item-label"
           >
             Product
-          </td>
+          </th>
           <td
             class="ant-descriptions-item-content"
             colspan="1"
           >
             Cloud Database
           </td>
-          <td
+          <th
             class="ant-descriptions-item-label"
           >
             Billing Mode
-          </td>
+          </th>
           <td
             class="ant-descriptions-item-content"
             colspan="1"
           >
             Prepaid
           </td>
-          <td
+          <th
             class="ant-descriptions-item-label"
           >
             Automatic Renewal
-          </td>
+          </th>
           <td
             class="ant-descriptions-item-content"
             colspan="1"
@@ -157,22 +157,22 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
         <tr
           class="ant-descriptions-row"
         >
-          <td
+          <th
             class="ant-descriptions-item-label"
           >
             Order time
-          </td>
+          </th>
           <td
             class="ant-descriptions-item-content"
             colspan="1"
           >
             2018-04-24 18:00:00
           </td>
-          <td
+          <th
             class="ant-descriptions-item-label"
           >
             Usage Time
-          </td>
+          </th>
           <td
             class="ant-descriptions-item-content"
             colspan="5"
@@ -183,11 +183,11 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
         <tr
           class="ant-descriptions-row"
         >
-          <td
+          <th
             class="ant-descriptions-item-label"
           >
             Status
-          </td>
+          </th>
           <td
             class="ant-descriptions-item-content"
             colspan="5"
@@ -209,33 +209,33 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
         <tr
           class="ant-descriptions-row"
         >
-          <td
+          <th
             class="ant-descriptions-item-label"
           >
             Negotiated Amount
-          </td>
+          </th>
           <td
             class="ant-descriptions-item-content"
             colspan="1"
           >
             $80.00
           </td>
-          <td
+          <th
             class="ant-descriptions-item-label"
           >
             Discount
-          </td>
+          </th>
           <td
             class="ant-descriptions-item-content"
             colspan="1"
           >
             $20.00
           </td>
-          <td
+          <th
             class="ant-descriptions-item-label"
           >
             Official Receipts
-          </td>
+          </th>
           <td
             class="ant-descriptions-item-content"
             colspan="1"
@@ -246,11 +246,11 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
         <tr
           class="ant-descriptions-row"
         >
-          <td
+          <th
             class="ant-descriptions-item-label"
           >
             Config Info
-          </td>
+          </th>
           <td
             class="ant-descriptions-item-content"
             colspan="5"
@@ -278,7 +278,7 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
 exports[`renders ./components/descriptions/demo/responsive.md correctly 1`] = `
 <div>
   <div
-    class="ant-descriptions"
+    class="ant-descriptions ant-descriptions-bordered"
   >
     <div
       class="ant-descriptions-title"
@@ -293,128 +293,100 @@ exports[`renders ./components/descriptions/demo/responsive.md correctly 1`] = `
           <tr
             class="ant-descriptions-row"
           >
+            <th
+              class="ant-descriptions-item-label"
+            >
+              Product
+            </th>
             <td
-              class="ant-descriptions-item"
+              class="ant-descriptions-item-content"
               colspan="1"
             >
-              <span
-                class="ant-descriptions-item-label"
-              >
-                Product
-              </span>
-              <span
-                class="ant-descriptions-item-content"
-              >
-                Cloud Database
-              </span>
+              Cloud Database
             </td>
+            <th
+              class="ant-descriptions-item-label"
+            >
+              Billing
+            </th>
             <td
-              class="ant-descriptions-item"
+              class="ant-descriptions-item-content"
               colspan="1"
             >
-              <span
-                class="ant-descriptions-item-label"
-              >
-                Billing
-              </span>
-              <span
-                class="ant-descriptions-item-content"
-              >
-                Prepaid
-              </span>
+              Prepaid
             </td>
+            <th
+              class="ant-descriptions-item-label"
+            >
+              time
+            </th>
             <td
-              class="ant-descriptions-item"
+              class="ant-descriptions-item-content"
               colspan="1"
             >
-              <span
-                class="ant-descriptions-item-label"
-              >
-                time
-              </span>
-              <span
-                class="ant-descriptions-item-content"
-              >
-                18:00:00
-              </span>
+              18:00:00
             </td>
           </tr>
           <tr
             class="ant-descriptions-row"
           >
+            <th
+              class="ant-descriptions-item-label"
+            >
+              Amount
+            </th>
             <td
-              class="ant-descriptions-item"
+              class="ant-descriptions-item-content"
               colspan="1"
             >
-              <span
-                class="ant-descriptions-item-label"
-              >
-                Amount
-              </span>
-              <span
-                class="ant-descriptions-item-content"
-              >
-                $80.00
-              </span>
+              $80.00
             </td>
+            <th
+              class="ant-descriptions-item-label"
+            >
+              Discount
+            </th>
             <td
-              class="ant-descriptions-item"
+              class="ant-descriptions-item-content"
               colspan="1"
             >
-              <span
-                class="ant-descriptions-item-label"
-              >
-                Discount
-              </span>
-              <span
-                class="ant-descriptions-item-content"
-              >
-                $20.00
-              </span>
+              $20.00
             </td>
+            <th
+              class="ant-descriptions-item-label"
+            >
+              Official
+            </th>
             <td
-              class="ant-descriptions-item"
+              class="ant-descriptions-item-content"
               colspan="1"
             >
-              <span
-                class="ant-descriptions-item-label"
-              >
-                Official
-              </span>
-              <span
-                class="ant-descriptions-item-content"
-              >
-                $60.00
-              </span>
+              $60.00
             </td>
           </tr>
           <tr
             class="ant-descriptions-row"
           >
-            <td
-              class="ant-descriptions-item"
-              colspan="3"
+            <th
+              class="ant-descriptions-item-label"
             >
-              <span
-                class="ant-descriptions-item-label"
-              >
-                Config Info
-              </span>
-              <span
-                class="ant-descriptions-item-content"
-              >
-                Data disk type: MongoDB
-                <br />
-                Database version: 3.4
-                <br />
-                Package: dds.mongo.mid
-                <br />
-                Storage space: 10 GB
-                <br />
-                Replication_factor:3
-                <br />
-                Region: East China 1
-              </span>
+              Config Info
+            </th>
+            <td
+              class="ant-descriptions-item-content"
+              colspan="5"
+            >
+              Data disk type: MongoDB
+              <br />
+              Database version: 3.4
+              <br />
+              Package: dds.mongo.mid
+              <br />
+              Storage space: 10 GB
+              <br />
+              Replication_factor:3
+              <br />
+              Region: East China 1
             </td>
           </tr>
         </tbody>
@@ -491,7 +463,7 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
   <br />
   <br />
   <div
-    class="ant-descriptions bordered"
+    class="ant-descriptions ant-descriptions-bordered"
   >
     <div
       class="ant-descriptions-title"
@@ -506,33 +478,33 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
           <tr
             class="ant-descriptions-row"
           >
-            <td
+            <th
               class="ant-descriptions-item-label"
             >
               Product
-            </td>
+            </th>
             <td
               class="ant-descriptions-item-content"
               colspan="1"
             >
               Cloud Database
             </td>
-            <td
+            <th
               class="ant-descriptions-item-label"
             >
               Billing
-            </td>
+            </th>
             <td
               class="ant-descriptions-item-content"
               colspan="1"
             >
               Prepaid
             </td>
-            <td
+            <th
               class="ant-descriptions-item-label"
             >
               time
-            </td>
+            </th>
             <td
               class="ant-descriptions-item-content"
               colspan="1"
@@ -543,33 +515,33 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
           <tr
             class="ant-descriptions-row"
           >
-            <td
+            <th
               class="ant-descriptions-item-label"
             >
               Amount
-            </td>
+            </th>
             <td
               class="ant-descriptions-item-content"
               colspan="1"
             >
               $80.00
             </td>
-            <td
+            <th
               class="ant-descriptions-item-label"
             >
               Discount
-            </td>
+            </th>
             <td
               class="ant-descriptions-item-content"
               colspan="1"
             >
               $20.00
             </td>
-            <td
+            <th
               class="ant-descriptions-item-label"
             >
               Official
-            </td>
+            </th>
             <td
               class="ant-descriptions-item-content"
               colspan="1"
@@ -580,11 +552,11 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
           <tr
             class="ant-descriptions-row"
           >
-            <td
+            <th
               class="ant-descriptions-item-label"
             >
               Config Info
-            </td>
+            </th>
             <td
               class="ant-descriptions-item-content"
               colspan="5"
@@ -609,3 +581,341 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
   </div>
 </div>
 `;
+
+exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
+<div
+  class="ant-descriptions"
+>
+  <div
+    class="ant-descriptions-title"
+  >
+    User Info
+  </div>
+  <div
+    class="ant-descriptions-view"
+  >
+    <table>
+      <tbody>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item"
+            colspan="1"
+          >
+            <span
+              class="ant-descriptions-item-label"
+            >
+              UserName
+            </span>
+          </td>
+          <td
+            class="ant-descriptions-item"
+            colspan="1"
+          >
+            <span
+              class="ant-descriptions-item-label"
+            >
+              Telephone
+            </span>
+          </td>
+          <td
+            class="ant-descriptions-item"
+            colspan="1"
+          >
+            <span
+              class="ant-descriptions-item-label"
+            >
+              Live
+            </span>
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item"
+            colspan="1"
+          >
+            <span
+              class="ant-descriptions-item-content"
+            >
+              Zhou Maomao
+            </span>
+          </td>
+          <td
+            class="ant-descriptions-item"
+            colspan="1"
+          >
+            <span
+              class="ant-descriptions-item-content"
+            >
+              1810000000
+            </span>
+          </td>
+          <td
+            class="ant-descriptions-item"
+            colspan="1"
+          >
+            <span
+              class="ant-descriptions-item-content"
+            >
+              Hangzhou, Zhejiang
+            </span>
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item"
+            colspan="1"
+          >
+            <span
+              class="ant-descriptions-item-label"
+            >
+              Remark
+            </span>
+          </td>
+          <td
+            class="ant-descriptions-item"
+            colspan="2"
+          >
+            <span
+              class="ant-descriptions-item-label"
+            >
+              Address
+            </span>
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item"
+            colspan="1"
+          >
+            <span
+              class="ant-descriptions-item-content"
+            >
+              empty
+            </span>
+          </td>
+          <td
+            class="ant-descriptions-item"
+            colspan="2"
+          >
+            <span
+              class="ant-descriptions-item-content"
+            >
+              No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China
+            </span>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</div>
+`;
+
+exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`] = `
+<div
+  class="ant-descriptions ant-descriptions-bordered"
+>
+  <div
+    class="ant-descriptions-title"
+  >
+    User Info
+  </div>
+  <div
+    class="ant-descriptions-view"
+  >
+    <table>
+      <tbody>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item-label"
+            colspan="1"
+          >
+            Product
+          </td>
+          <td
+            class="ant-descriptions-item-label"
+            colspan="1"
+          >
+            Billing Mode
+          </td>
+          <td
+            class="ant-descriptions-item-label"
+            colspan="1"
+          >
+            Automatic Renewal
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item-content"
+            colspan="1"
+          >
+            Cloud Database
+          </td>
+          <td
+            class="ant-descriptions-item-content"
+            colspan="1"
+          >
+            Prepaid
+          </td>
+          <td
+            class="ant-descriptions-item-content"
+            colspan="1"
+          >
+            YES
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item-label"
+            colspan="1"
+          >
+            Order time
+          </td>
+          <td
+            class="ant-descriptions-item-label"
+            colspan="5"
+          >
+            Usage Time
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item-content"
+            colspan="1"
+          >
+            2018-04-24 18:00:00
+          </td>
+          <td
+            class="ant-descriptions-item-content"
+            colspan="5"
+          >
+            2019-04-24 18:00:00
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item-label"
+            colspan="5"
+          >
+            Status
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item-content"
+            colspan="5"
+          >
+            <span
+              class="ant-badge ant-badge-status ant-badge-not-a-wrapper"
+            >
+              <span
+                class="ant-badge-status-dot ant-badge-status-processing"
+              />
+              <span
+                class="ant-badge-status-text"
+              >
+                Running
+              </span>
+            </span>
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item-label"
+            colspan="1"
+          >
+            Negotiated Amount
+          </td>
+          <td
+            class="ant-descriptions-item-label"
+            colspan="1"
+          >
+            Discount
+          </td>
+          <td
+            class="ant-descriptions-item-label"
+            colspan="1"
+          >
+            Official Receipts
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item-content"
+            colspan="1"
+          >
+            $80.00
+          </td>
+          <td
+            class="ant-descriptions-item-content"
+            colspan="1"
+          >
+            $20.00
+          </td>
+          <td
+            class="ant-descriptions-item-content"
+            colspan="1"
+          >
+            $60.00
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item-label"
+            colspan="5"
+          >
+            Config Info
+          </td>
+        </tr>
+        <tr
+          class="ant-descriptions-row"
+        >
+          <td
+            class="ant-descriptions-item-content"
+            colspan="5"
+          >
+            Data disk type: MongoDB
+            <br />
+            Database version: 3.4
+            <br />
+            Package: dds.mongo.mid
+            <br />
+            Storage space: 10 GB
+            <br />
+            Replication_factor:3
+            <br />
+            Region: East China 1
+            <br />
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</div>
+`;