Merge branch 'master' into merge-portal

.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。
 -->
 
 ### 📝 更新日志怎么写？

CHANGELOG.en-US.md

@@ -15,6 +15,12 @@ timeline: true
 
 ---
 
+## 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`

CHANGELOG.zh-CN.md

@@ -15,6 +15,12 @@ timeline: true
 
 ---
 
+## 3.20.3
+
+`2019-07-15`
+
+- 🚨 回滚 [#17508](https://github.com/ant-design/ant-design/pull/17508) 中对 Input 后缀样式的修改，因其导致了其他更多问题。
+
 ## 3.20.2
 
 `2019-07-13`

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.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/drawer/index.zh-CN.md

@@ -21,7 +21,7 @@ title: Drawer
 | closable | 是否显示右上角的关闭按钮 | boolean | true | 3.7.0 |
 | destroyOnClose | 关闭时销毁 Drawer 里的子元素 | boolean | false | 3.7.0 |
 | getContainer | 指定 Drawer 挂载的 HTML 节点, false 为挂载在当前 dom | HTMLElement \| `() => HTMLElement` \| Selectors \| false | 'body' | 3.7.0 |
-| maskClosable | 点击蒙层是否允许关闭 | boolean | true | 3.7.0 | 
+| maskClosable | 点击蒙层是否允许关闭 | boolean | true | 3.7.0 |
 | mask | 是否展示遮罩 | Boolean | true | 3.7.0 |
 | maskStyle | 遮罩样式 | object | {} | 3.7.0 |
 | style | 可用于设置 Drawer 最外层容器的样式 | object | - | 3.7.0 |

components/form/Form.tsx

@@ -141,7 +141,7 @@ export type WrappedFormUtils<V = any> = {
   /** 获取一个输入控件的值 */
   getFieldValue(fieldName: string): any;
   /** 设置一组输入控件的值 */
-  setFieldsValue(obj: Object): void;
+  setFieldsValue(obj: Object, callback?: Function): void;
   /** 设置一组输入控件的值 */
   setFields(obj: Object): void;
   /** 校验并获取一组输入域的值与 Error */

components/form/index.en-US.md

@@ -92,7 +92,7 @@ If the form has been decorated by `Form.create` then it has `this.props.form` pr
 | isFieldValidating | Check if the specified field is being validated. | Function(name) |  |
 | resetFields | Reset the specified fields' value(to `initialValue`) and status. If you don't specify a parameter, all the fields will be reset. | Function(\[names: string\[]]) |  |
 | setFields | Set value and error state of fields. [Code Sample](https://github.com/react-component/form/blob/3b9959b57ab30b41d8890ff30c79a7e7c383cad3/examples/server-validate.js#L74-L79) | ({<br />&nbsp;&nbsp;\[fieldName\]: {value: any, errors: \[Error\] }<br />}) => void |  |
-| setFieldsValue | Set the value of a field. (Note: please don't use it in `componentWillReceiveProps`, otherwise, it will cause an endless loop, [reason](https://github.com/ant-design/ant-design/issues/2985)) | ({ \[fieldName\]&#x3A; value }) => void |  |
+| setFieldsValue | Set the value of a field. (Note: please don't use it in `componentWillReceiveProps`, otherwise, it will cause an endless loop, [reason](https://github.com/ant-design/ant-design/issues/2985)) | (<br />&nbsp;&nbsp;{ \[fieldName\]&#x3A; value },<br />&nbsp;&nbsp;callback: Function<br />) => void |  |
 | validateFields | Validate the specified fields and get theirs values and errors. If you don't specify the parameter of fieldNames, you will validate all fields. | (<br />&nbsp;&nbsp;\[fieldNames: string\[]],<br />&nbsp;&nbsp;\[options: object\],<br />&nbsp;&nbsp;callback(errors, values)<br />) => void |  |
 | validateFieldsAndScroll | This function is similar to `validateFields`, but after validation, if the target field is not in visible area of form, form will be automatically scrolled to the target field area. | same as `validateFields` |  |
 

components/form/index.zh-CN.md

@@ -95,7 +95,7 @@ this.form // => The instance of CustomizedForm
 | isFieldValidating | 判断一个输入控件是否在校验状态 | Function(name) |  |
 | resetFields | 重置一组输入控件的值（为 `initialValue`）与状态，如不传入参数，则重置所有组件 | Function(\[names: string\[]]) |  |
 | setFields | 设置一组输入控件的值与错误状态：[代码](https://github.com/react-component/form/blob/3b9959b57ab30b41d8890ff30c79a7e7c383cad3/examples/server-validate.js#L74-L79) | ({<br />&nbsp;&nbsp;\[fieldName\]: {value: any, errors: \[Error\] }<br />}) => void |  |
-| setFieldsValue | 设置一组输入控件的值（注意：不要在 `componentWillReceiveProps` 内使用，否则会导致死循环，[原因](https://github.com/ant-design/ant-design/issues/2985)） | ({ \[fieldName\]&#x3A; value }) => void |  |
+| setFieldsValue | 设置一组输入控件的值（注意：不要在 `componentWillReceiveProps` 内使用，否则会导致死循环，[原因](https://github.com/ant-design/ant-design/issues/2985)） | (<br />&nbsp;&nbsp;{ \[fieldName\]&#x3A; value },<br />&nbsp;&nbsp;callback: Function<br />) => void |  |
 | validateFields | 校验并获取一组输入域的值与 Error，若 fieldNames 参数为空，则校验全部组件 | (<br />&nbsp;&nbsp;\[fieldNames: string\[]],<br />&nbsp;&nbsp;\[options: object\],<br />&nbsp;&nbsp;callback(errors, values)<br />) => void |  |
 | validateFieldsAndScroll | 与 `validateFields` 相似，但校验完后，如果校验不通过的菜单域不在可见范围内，则自动滚动进可见范围 | 参考 `validateFields` |  |
 

components/input/style/mixin.less

@@ -370,20 +370,12 @@
     position: absolute;
     top: 50%;
     z-index: 2;
-    height: calc(100% - 2px);
     color: @input-color;
     line-height: 0;
-    background-color: #fff;
     transform: translateY(-50%);
     :not(.anticon) {
       line-height: @line-height-base;
     }
-    .anticon {
-      position: relative;
-      top: 50%;
-      vertical-align: top;
-      transform: translateY(-50%);
-    }
   }
 
   .@{inputClass}-prefix {

components/menu/MenuItem.tsx

@@ -5,7 +5,11 @@ import { MenuContext, MenuContextProps } from './';
 import Tooltip, { TooltipProps } from '../tooltip';
 import { SiderContext, SiderContextProps } from '../layout/Sider';
 
-export interface MenuItemProps {
+export interface MenuItemProps
+  extends Omit<
+    React.HTMLAttributes<HTMLLIElement>,
+    'title' | 'onClick' | 'onMouseEnter' | 'onMouseLeave'
+  > {
   rootPrefixCls?: string;
   disabled?: boolean;
   level?: number;

components/menu/__tests__/index.test.js

@@ -569,7 +569,6 @@ describe('Menu', () => {
         .instance()
         .getMenuOpenAnimation(''),
     ).toBe('');
-    expect(wrapper.find('InternalMenu').state().switchingModeFromInline).toBe(false);
   });
 
   it('MenuItem should not render Tooltip when inlineCollapsed is false', () => {

components/menu/index.tsx

@@ -276,10 +276,6 @@ class InternalMenu extends React.Component<InternalMenuProps, MenuState> {
         // submenu should hide without animation
         if (this.state.switchingModeFromInline) {
           menuOpenAnimation = '';
-          this.setState({
-            switchingModeFromInline: false,
-          });
-          // this.switchingModeFromInline = false;
         } else {
           menuOpenAnimation = 'zoom-big';
         }

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

@@ -5152,6 +5152,7 @@ exports[`renders ./components/table/demo/fixed-columns.md correctly 1`] = `
             <div
               class="ant-table-body"
               style="overflow-x:scroll;-webkit-transform:translate3d (0, 0, 0)"
+              tabindex="-1"
             >
               <table
                 class="ant-table-fixed"
@@ -6057,6 +6058,7 @@ exports[`renders ./components/table/demo/fixed-columns-header.md correctly 1`] =
             <div
               class="ant-table-body"
               style="overflow-x:scroll;-webkit-transform:translate3d (0, 0, 0);max-height:300px;overflow-y:scroll"
+              tabindex="-1"
             >
               <table
                 class="ant-table-fixed"
@@ -7526,6 +7528,7 @@ exports[`renders ./components/table/demo/fixed-header.md correctly 1`] = `
             <div
               class="ant-table-body"
               style="max-height:240px;overflow-y:scroll"
+              tabindex="-1"
             >
               <table
                 class=""
@@ -9195,6 +9198,7 @@ exports[`renders ./components/table/demo/grouping-columns.md correctly 1`] = `
             <div
               class="ant-table-body"
               style="overflow-x:scroll;-webkit-transform:translate3d (0, 0, 0);max-height:240px;overflow-y:scroll"
+              tabindex="-1"
             >
               <table
                 class="ant-table-fixed"

components/table/style/index.less

@@ -28,11 +28,13 @@
     overflow-y: hidden !important;
   }
 
+  // https://github.com/ant-design/ant-design/issues/17611
   table {
     width: 100%;
     text-align: left;
     border-radius: @table-border-radius-base @table-border-radius-base 0 0;
-    border-collapse: collapse;
+    border-collapse: separate;
+    border-spacing: 0;
   }
 
   &-thead > tr > th {
@@ -638,7 +640,10 @@
       border: 1px solid @border-color-split;
       border-width: 1px 1px 1px 0;
     }
-    &.@{table-prefix-cls}-hide-scrollbar .@{table-prefix-cls}-thead > tr > th:last-child {
+    &.@{table-prefix-cls}-hide-scrollbar
+      .@{table-prefix-cls}-thead
+      > tr:only-child
+      > th:last-child {
       border-right-color: transparent;
     }
   }
@@ -740,10 +745,9 @@
 
 /**
 * Another fix of Firefox:
-* - https://github.com/ant-design/ant-design/issues/12628
-* - https://github.com/ant-design/ant-design/issues/12628
 */
 @supports (-moz-appearance: meterbar) {
+  // https://github.com/ant-design/ant-design/issues/12628
   .@{table-prefix-cls}-thead > tr > th.@{table-prefix-cls}-column-has-actions {
     background-clip: padding-box;
   }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "antd",
-  "version": "3.20.2",
+  "version": "3.20.3",
   "title": "Ant Design",
   "description": "An enterprise-class UI design language and React components implementation",
   "homepage": "http://ant.design/",
@@ -75,7 +75,7 @@
     "rc-pagination": "~1.20.1",
     "rc-progress": "~2.5.0",
     "rc-rate": "~2.5.0",
-    "rc-select": "~9.1.4",
+    "rc-select": "~9.2.0",
     "rc-slider": "~8.6.11",
     "rc-steps": "~3.4.1",
     "rc-switch": "~1.9.0",