merge master

components/cascader/index.en-US.md

@@ -72,9 +72,3 @@ interface Option {
 | ------- | ------------ | ------- |
 | blur()  | remove focus |         |
 | focus() | get focus    |         |
-
-<style>
-.ant-cascader-picker {
-  width: 300px;
-}
-</style>

components/cascader/index.zh-CN.md

@@ -74,10 +74,4 @@ interface Option {
 | blur()  | 移除焦点 |      |
 | focus() | 获取焦点 |      |
 
-<style>
-.ant-cascader-picker {
-  width: 300px;
-}
-</style>
-
 > 注意，如果需要获得中国省市区数据，可以参考 [china-division](https://gist.github.com/afc163/7582f35654fd03d5be7009444345ea17)。

components/date-picker/WeekPicker.tsx

@@ -143,6 +143,7 @@ class WeekPicker extends React.Component<any, WeekPickerState> {
       onBlur,
       id,
       suffixIcon,
+      defaultPickerValue,
     } = this.props;
 
     const prefixCls = getPrefixCls('calendar', customizePrefixCls);
@@ -170,6 +171,7 @@ class WeekPicker extends React.Component<any, WeekPickerState> {
         showToday={false}
         disabledDate={disabledDate}
         renderFooter={this.renderFooter}
+        defaultValue={defaultPickerValue}
       />
     );
     const clearIcon =

components/date-picker/wrapPicker.tsx

@@ -192,6 +192,7 @@ export default function wrapPicker(Picker: React.ComponentClass<any>, pickerType
                 className={timePickerCls}
                 placeholder={locale.timePickerLocale.placeholder}
                 transitionName="slide-up"
+                onEsc={() => {}}
               />
             ) : null;
 

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

@@ -1980,7 +1980,7 @@ exports[`renders ./components/input/demo/textarea-resize.md correctly 1`] = `
     class="ant-input"
     rows="4"
   >
-    autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。ending
+    The autoSize property applies to textarea nodes, and only the height changes automatically. In addition, autoSize can be set to an object, specifying the minimum number of rows and the maximum number of rows. The autoSize property applies to textarea nodes, and only the height changes automatically. In addition, autoSize can be set to an object, specifying the minimum number of rows and the maximum number of rows.
   </textarea>
 </div>
 `;

components/input/demo/textarea-resize.md

@@ -20,7 +20,7 @@ import { Input, Button } from 'antd';
 const { TextArea } = Input;
 
 const defaultValue =
-  'autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。autoSize 属性适用于 textarea 节点，并且只有高度会自动变化。另外 autoSize 可以设定为一个对象，指定最小行数和最大行数。ending';
+  'The autoSize property applies to textarea nodes, and only the height changes automatically. In addition, autoSize can be set to an object, specifying the minimum number of rows and the maximum number of rows. The autoSize property applies to textarea nodes, and only the height changes automatically. In addition, autoSize can be set to an object, specifying the minimum number of rows and the maximum number of rows.';
 
 class Demo extends React.Component {
   state = {

components/layout/index.en-US.md

@@ -87,7 +87,7 @@ The sidebar.
 
 | Property | Description | Type | Default | Version |
 | --- | --- | --- | --- | --- |
-| breakpoint | [breakpoints](/components/grid#api) of the responsive layout | Enum { 'xs', 'sm', 'md', 'lg', 'xl', 'xxl' } | - |  |
+| breakpoint | [breakpoints](/components/grid#Col) of the responsive layout | Enum { 'xs', 'sm', 'md', 'lg', 'xl', 'xxl' } | - |  |
 | className | container className | string | - |  |
 | collapsed | to set the current status | boolean | - |  |
 | collapsedWidth | width of the collapsed sidebar, by setting to `0` a special trigger will appear | number | 80 |  |
@@ -99,7 +99,7 @@ The sidebar.
 | trigger | specify the customized trigger, set to null to hide the trigger | string\|ReactNode | - |  |
 | width | width of the sidebar | number\|string | 200 |  |
 | onCollapse | the callback function, executed by clicking the trigger or activating the responsive layout | (collapsed, type) => {} | - |  |
-| onBreakpoint | the callback function, executed when [breakpoints](/components/grid#api) changed | (broken) => {} | - | 3.7.0 |
+| onBreakpoint | the callback function, executed when [breakpoints](/components/grid#API) changed | (broken) => {} | - | 3.7.0 |
 | zeroWidthTriggerStyle | to customize the styles of the special trigger that appears when `collapsedWidth` is 0 | object | - | 3.24.0 |
 
 #### breakpoint width

components/layout/index.zh-CN.md

@@ -88,7 +88,7 @@ title: Layout
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
-| breakpoint | 触发响应式布局的[断点](/components/grid#api) | Enum { 'xs', 'sm', 'md', 'lg', 'xl', 'xxl' } | - |  |
+| breakpoint | 触发响应式布局的[断点](/components/grid-cn/#Col) | Enum { 'xs', 'sm', 'md', 'lg', 'xl', 'xxl' } | - |  |
 | className | 容器 className | string | - |  |
 | collapsed | 当前收起状态 | boolean | - |  |
 | collapsedWidth | 收缩宽度，设置为 0 会出现特殊 trigger | number | 80 |  |
@@ -100,7 +100,7 @@ title: Layout
 | trigger | 自定义 trigger，设置为 null 时隐藏 trigger | string\|ReactNode | - |  |
 | width | 宽度 | number\|string | 200 |  |
 | onCollapse | 展开-收起时的回调函数，有点击 trigger 以及响应式反馈两种方式可以触发 | (collapsed, type) => {} | - |  |
-| onBreakpoint | 触发响应式布局[断点](/components/grid#api)时的回调 | (broken) => {} | - | 3.7.0 |
+| onBreakpoint | 触发响应式布局[断点](/components/grid#API)时的回调 | (broken) => {} | - | 3.7.0 |
 | zeroWidthTriggerStyle | 指定当 `collapsedWidth` 为 0 时出现的特殊 trigger 的样式 | object | - | 3.24.0 |
 
 #### breakpoint width

components/menu/style/index.less

@@ -364,7 +364,7 @@
 
     // disable margin collapsed
     .@{menu-prefix-cls}-submenu {
-      padding-bottom: 0.01px;
+      padding-bottom: 0.02px;
     }
 
     .@{menu-prefix-cls}-item:not(:last-child) {

components/select/style/index.less

@@ -382,10 +382,6 @@
     }
   }
 
-  &-allow-clear &-selection--single &-selection-selected-value {
-    padding-right: 16px;
-  }
-
   &-allow-clear &-selection--multiple &-selection__rendered,
   &-show-arrow &-selection--multiple &-selection__rendered {
     margin-right: 20px; // In case that clear button will overlap content

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

@@ -1032,11 +1032,9 @@ exports[`renders ./components/slider/demo/tip-formatter.md correctly 1`] = `
 `;
 
 exports[`renders ./components/slider/demo/vertical.md correctly 1`] = `
-<div
+<div>
-  style="height:300px"
->
   <div
-    style="float:left;height:300px;margin-left:70px"
+    style="display:inline-block;height:300px;margin-left:70px"
   >
     <div
       class="ant-slider ant-slider-vertical"
@@ -1067,7 +1065,7 @@ exports[`renders ./components/slider/demo/vertical.md correctly 1`] = `
     </div>
   </div>
   <div
-    style="float:left;height:300px;margin-left:70px"
+    style="display:inline-block;height:300px;margin-left:70px"
   >
     <div
       class="ant-slider ant-slider-vertical"
@@ -1108,7 +1106,7 @@ exports[`renders ./components/slider/demo/vertical.md correctly 1`] = `
     </div>
   </div>
   <div
-    style="float:left;height:300px;margin-left:70px"
+    style="display:inline-block;height:300px;margin-left:70px"
   >
     <div
       class="ant-slider ant-slider-with-marks ant-slider-vertical"

components/slider/demo/vertical.md

@@ -17,7 +17,7 @@ The vertical Slider.
 import { Slider } from 'antd';
 
 const style = {
-  float: 'left',
+  display: 'inline-block',
   height: 300,
   marginLeft: 70,
 };
@@ -35,7 +35,7 @@ const marks = {
 };
 
 ReactDOM.render(
-  <div style={{ height: 300 }}>
+  <div>
     <div style={style}>
       <Slider vertical defaultValue={30} />
     </div>

components/table/Table.tsx

@@ -807,7 +807,7 @@ class Table<T> extends React.Component<InternalTableProps<T>, TableState<T>> {
         current: this.state.pagination.current,
       };
     }
-    this.setState(newState, () => this.scrollToFirstRow());
+    this.setState(newState, this.scrollToFirstRow);
 
     this.props.store.setState({
       selectionDirty: false,
@@ -834,7 +834,7 @@ class Table<T> extends React.Component<InternalTableProps<T>, TableState<T>> {
       pageSize,
       current,
     };
-    this.setState({ pagination: nextPagination });
+    this.setState({ pagination: nextPagination }, this.scrollToFirstRow);
 
     const { onChange } = this.props;
     if (onChange) {
@@ -878,7 +878,7 @@ class Table<T> extends React.Component<InternalTableProps<T>, TableState<T>> {
 
     // Controlled
     if (this.getSortOrderColumns().length === 0) {
-      this.setState(newState, () => this.scrollToFirstRow());
+      this.setState(newState, this.scrollToFirstRow);
     }
 
     const { onChange } = this.props;

components/table/__tests__/Table.pagination.test.js

@@ -79,14 +79,32 @@ describe('Table.pagination', () => {
     expect(wrapper.find('.ant-pagination.mini')).toHaveLength(1);
   });
 
-  // TODO
   it('should scroll to first row when page change', () => {
-    const wrapper = mount(createTable({ scroll: { y: 20 } }));
+    const wrapper = mount(
+      createTable({ scroll: { y: 20 }, pagination: { showSizeChanger: true, pageSize: 2 } }),
+    );
+    const scrollToSpy = jest.spyOn(
+      wrapper
+        .find('Table')
+        .first()
+        .instance(),
+      'scrollToFirstRow',
+    );
+    expect(scrollToSpy).toHaveBeenCalledTimes(0);
 
     wrapper
       .find('Pager')
       .last()
       .simulate('click');
+    expect(scrollToSpy).toHaveBeenCalledTimes(1);
+
+    wrapper.find('.ant-select').simulate('click');
+    wrapper
+      .find('MenuItem')
+      .find('li')
+      .last()
+      .simulate('click');
+    expect(scrollToSpy).toHaveBeenCalledTimes(2);
   });
 
   it('fires change event', () => {

components/table/demo/fixed-columns-header.md

@@ -9,7 +9,7 @@ title:
 
 适合同时展示有大量数据和数据列。
 
-> 若列头与内容不对齐或出现列重复，请指定**固定列**的宽度 `width`。如果指定 `width` 不生效，请尝试建议留一列不设宽度以适应弹性布局，或者检查是否有[超长连续字段破坏布局](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241)。
+> 若列头与内容不对齐或出现列重复，请指定**固定列**的宽度 `width`。如果指定 `width` 不生效或出现白色垂直空隙，请尝试建议留一列不设宽度以适应弹性布局，或者检查是否有[超长连续字段破坏布局](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241)。
 >
 > 建议指定 `scroll.x` 为大于表格宽度的固定值或百分比。注意，且非固定列宽度之和不要超过 `scroll.x`。
 
@@ -17,7 +17,7 @@ title:
 
 A Solution for displaying large amounts of data with long columns.
 
-> Specify the width of columns if header and cell do not align properly. If specified width is not working, please try to leave one column at least without width to fit fluid layout, or make sure no [long word to break table layout](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241).
+> Specify the width of columns if header and cell do not align properly. If specified width is not working or have gutter between columns, please try to leave one column at least without width to fit fluid layout, or make sure no [long word to break table layout](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241).
 >
 > A fixed value which is greater than table width for `scroll.x` is recommended. The sum of unfixed columns should not greater than `scroll.x`.
 

components/table/demo/fixed-columns.md

@@ -9,7 +9,7 @@ title:
 
 对于列数很多的数据，可以固定前后的列，横向滚动查看其它数据，需要和 `scroll.x` 配合使用。
 
-> 若列头与内容不对齐或出现列重复，请指定**固定列**的宽度 `width`。如果指定 `width` 不生效，请尝试建议留一列不设宽度以适应弹性布局，或者检查是否有[超长连续字段破坏布局](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241)。
+> 若列头与内容不对齐或出现列重复，请指定**固定列**的宽度 `width`。如果指定 `width` 不生效或出现白色垂直空隙，请尝试建议留一列不设宽度以适应弹性布局，或者检查是否有[超长连续字段破坏布局](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241)。
 >
 > 建议指定 `scroll.x` 为大于表格宽度的固定值或百分比。注意，且非固定列宽度之和不要超过 `scroll.x`。
 
@@ -17,7 +17,7 @@ title:
 
 To fix some columns and scroll inside other columns, and you must set `scroll.x` meanwhile.
 
-> Specify the width of columns if header and cell do not align properly. If specified width is not working, please try to leave one column at least without width to fit fluid layout, or make sure no [long word to break table layout](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241).
+> Specify the width of columns if header and cell do not align properly. If specified width is not working or have gutter between columns, please try to leave one column at least without width to fit fluid layout, or make sure no [long word to break table layout](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241).
 >
 > A fixed value which is greater than table width for `scroll.x` is recommended. The sum of unfixed columns should not greater than `scroll.x`.
 

components/table/demo/fixed-header.md

@@ -9,13 +9,13 @@ title:
 
 方便一页内展示大量数据。
 
-需要指定 column 的 `width` 属性，否则列头和内容可能不对齐。如果指定 `width` 不生效，请尝试建议留一列不设宽度以适应弹性布局，或者检查是否有[超长连续字段破坏布局](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241)。
+需要指定 column 的 `width` 属性，否则列头和内容可能不对齐。如果指定 `width` 不生效或出现白色垂直空隙，请尝试建议留一列不设宽度以适应弹性布局，或者检查是否有[超长连续字段破坏布局](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241)。
 
 ## en-US
 
 Display large amounts of data in scrollable view.
 
-> Specify width of columns if header and cell do not align properly. If specified width is not working, please try to leave one column at least without width to fit fluid layout, or make sure no [long word to break table layout](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241).
+> Specify width of columns if header and cell do not align properly. If specified width is not working or have gutter between columns, please try to leave one column at least without width to fit fluid layout, or make sure no [long word to break table layout](https://github.com/ant-design/ant-design/issues/13825#issuecomment-449889241).
 
 ```jsx
 import { Table } from 'antd';

components/tree-select/__tests__/__snapshots__/demo.test.js.snap

@@ -5,7 +5,7 @@ exports[`renders ./components/tree-select/demo/async.md correctly 1`] = `
   aria-haspopup="listbox"
   class="ant-select ant-select-enabled"
   role="combobox"
-  style="width:300px"
+  style="width:100%"
   tabindex="0"
 >
   <span
@@ -53,7 +53,7 @@ exports[`renders ./components/tree-select/demo/basic.md correctly 1`] = `
   aria-haspopup="listbox"
   class="ant-select ant-select-enabled ant-select-allow-clear"
   role="combobox"
-  style="width:300px"
+  style="width:100%"
   tabindex="0"
 >
   <span
@@ -101,7 +101,7 @@ exports[`renders ./components/tree-select/demo/checkable.md correctly 1`] = `
   aria-haspopup="listbox"
   class="ant-select ant-select-enabled"
   role="combobox"
-  style="width:300px"
+  style="width:100%"
   tabindex="-1"
 >
   <span
@@ -184,7 +184,7 @@ exports[`renders ./components/tree-select/demo/multiple.md correctly 1`] = `
   aria-haspopup="listbox"
   class="ant-select ant-select-enabled ant-select-allow-clear"
   role="combobox"
-  style="width:300px"
+  style="width:100%"
   tabindex="-1"
 >
   <span
@@ -231,7 +231,7 @@ exports[`renders ./components/tree-select/demo/suffix.md correctly 1`] = `
   aria-haspopup="listbox"
   class="ant-select ant-select-enabled ant-select-allow-clear"
   role="combobox"
-  style="width:300px"
+  style="width:100%"
   tabindex="0"
 >
   <span
@@ -279,7 +279,7 @@ exports[`renders ./components/tree-select/demo/treeData.md correctly 1`] = `
   aria-haspopup="listbox"
   class="ant-select ant-select-enabled"
   role="combobox"
-  style="width:300px"
+  style="width:100%"
   tabindex="0"
 >
   <span

components/tree-select/demo/async.md

@@ -63,7 +63,7 @@ class Demo extends React.Component {
     return (
       <TreeSelect
         treeDataSimpleMode
-        style={{ width: 300 }}
+        style={{ width: '100%' }}
         value={this.state.value}
         dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
         placeholder="Please select"

components/tree-select/demo/basic.md

@@ -32,7 +32,7 @@ class Demo extends React.Component {
     return (
       <TreeSelect
         showSearch
-        style={{ width: 300 }}
+        style={{ width: '100%' }}
         value={this.state.value}
         dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
         placeholder="Please select"

components/tree-select/demo/checkable.md

@@ -74,7 +74,7 @@ class Demo extends React.Component {
       showCheckedStrategy: SHOW_PARENT,
       searchPlaceholder: 'Please select',
       style: {
-        width: 300,
+        width: '100%',
       },
     };
     return <TreeSelect {...tProps} />;

components/tree-select/demo/multiple.md

@@ -32,7 +32,7 @@ class Demo extends React.Component {
     return (
       <TreeSelect
         showSearch
-        style={{ width: 300 }}
+        style={{ width: '100%' }}
         value={this.state.value}
         dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
         placeholder="Please select"

components/tree-select/demo/suffix.md

@@ -35,7 +35,7 @@ class Demo extends React.Component {
       <TreeSelect
         showSearch
         suffixIcon={icon}
-        style={{ width: 300 }}
+        style={{ width: '100%' }}
         value={this.state.value}
         dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
         placeholder="Please select"

components/tree-select/demo/treeData.md

@@ -54,7 +54,7 @@ class Demo extends React.Component {
   render() {
     return (
       <TreeSelect
-        style={{ width: 300 }}
+        style={{ width: '100%' }}
         value={this.state.value}
         dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
         treeData={treeData}

components/upload/interface.tsx

@@ -41,6 +41,7 @@ export interface UploadFile<T = any> {
   linkProps?: any;
   type: string;
   xhr?: T;
+  preview?: string;
 }
 
 export interface UploadChangeParam<T extends object = UploadFile> {