Merge branch 'master' into feature

2024-11-27 20:49:53 +08:00 · 2018-09-16 17:29:04 +08:00 · 2018-09-16 17:29:04 +08:00 · cd9b8b20b5
commit cd9b8b20b5
parent f9dd709e2f 72c085b520
33 changed files with 478 additions and 58 deletions
--- a/README-zh_CN.md
+++ b/README-zh_CN.md
@ -87,7 +87,7 @@ import 'antd/dist/antd.css';  // or 'antd/dist/antd.less'
 - [设计规范速查手册](https://github.com/ant-design/ant-design/wiki/Ant-Design-%E8%AE%BE%E8%AE%A1%E5%9F%BA%E7%A1%80%E7%AE%80%E7%89%88)
 - [开发者说明](https://github.com/ant-design/ant-design/wiki/Development)
 - [版本发布规则](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [常见问题](https://github.com/ant-design/ant-design/wiki/FAQ)
+- [常见问题](https://ant.design/docs/react/faq-cn)
 - [CodeSandbox 模板](https://u.ant.design/codesandbox-repro) for bug reports
 - [Awesome Ant Design](https://github.com/websemantics/awesome-ant-design)
 - [定制主题](http://ant.design/docs/react/customize-theme-cn)
--- a/README.md
+++ b/README.md
@ -86,7 +86,7 @@ See [i18n](http://ant.design/docs/react/i18n).
 - [Motion](https://motion.ant.design)
 - [Developer Instruction](https://github.com/ant-design/ant-design/wiki/Development)
 - [Versioning Release Note](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [FAQ](https://github.com/ant-design/ant-design/wiki/FAQ)
+- [FAQ](https://ant.design/docs/react/faq)
 - [CodeSandbox Template](https://u.ant.design/codesandbox-repro) for bug reports
 - [Awesome Ant Design](https://github.com/websemantics/awesome-ant-design)
 - [Customize Theme](http://ant.design/docs/react/customize-theme)
--- a/components/card/tests/snapshots/demo.test.js.snap
+++ b/components/card/tests/snapshots/demo.test.js.snap
@ -813,7 +813,7 @@ exports[`renders ./components/card/demo/tabs.md correctly 1`] = `
        class="ant-tabs ant-tabs-top ant-card-head-tabs ant-tabs-large ant-tabs-line"
      >
        <div
-          class="ant-tabs-bar ant-card-head-tabs"
+          class="ant-tabs-bar"
          role="tablist"
          tabindex="0"
        >
@ -948,7 +948,7 @@ exports[`renders ./components/card/demo/tabs.md correctly 1`] = `
        class="ant-tabs ant-tabs-top ant-card-head-tabs ant-tabs-large ant-tabs-line"
      >
        <div
-          class="ant-tabs-bar ant-card-head-tabs"
+          class="ant-tabs-bar"
          role="tablist"
          tabindex="0"
        >
--- a/components/form/index.en-US.md
+++ b/components/form/index.en-US.md
@ -182,10 +182,7 @@ More option at [rc-form option](https://github.com/react-component/form#option-o

 ### Form.Item

-Note:
-
- If Form.Item has multiple children that had been decorated by `getFieldDecorator`, `help` and `required` and `validateStatus` can't be generated automatically.
- Before `2.2.0`, form controls must be child of Form.Item, otherwise, you need to set `help`, `required` and `validateStatus` by yourself.
+Note: if Form.Item has multiple children that had been decorated by `getFieldDecorator`, `help` and `required` and `validateStatus` can't be generated automatically.

 | Property | Description | Type | Default Value |
 | -------- | ----------- | ---- | ------------- |
--- a/components/form/index.zh-CN.md
+++ b/components/form/index.zh-CN.md
@ -183,10 +183,7 @@ validateFields(['field1', 'field2'], options, (errors, values) => {

 ### Form.Item

-注意：
-
- 一个 Form.Item 建议只放一个被 getFieldDecorator 装饰过的 child，当有多个被装饰过的 child 时，`help` `required` `validateStatus` 无法自动生成。
- `2.2.0` 之前，只有当表单域为 Form.Item 的子元素时，才会自动生成 `help` `required` `validateStatus`，嵌套情况需要自行设置。
+注意：一个 Form.Item 建议只放一个被 getFieldDecorator 装饰过的 child，当有多个被装饰过的 child 时，`help` `required` `validateStatus` 无法自动生成。

 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
--- a/components/icon/index.en-US.md
+++ b/components/icon/index.en-US.md
@ -29,6 +29,19 @@ ReactDOM.render(<IconDisplay />, mountNode);
 | component | The component used for the root node. This will override the **`type`** property. | ComponentType<CustomIconComponentProps\> | - |
 | twoToneColor | Only support the two-tone icon. Specific the primary color. | string (hex color) | - |

+### Svg icons
+
+We introduced svg icons in `3.9.x` version replacing font icons which brings benefits below:
+
+- Complete offline usage of icon, no dependency of alipay cdn font icon file and no more empty square during downloading than no need to deploy icon font files locally either.
+- Much more display accuracy in lower-level screens.
+- Support multiple colors for icon.
+- No need to change built-in icons with overriding styles by providing more props in component.
+
+More disscussion of svg icon reference to [#10353](https://github.com/ant-design/ant-design/issues/10353).
+
+> ⚠️ About the extra bundle size brought by all svg icons we imported in antd@3.9.x, we will provide new API to allow developers importing icons as your need, you can trace [#12011](https://github.com/ant-design/ant-design/issues/12011) for further progress.
+
 The properties `theme`, `component` and `twoToneColor` are added in `antd@3.9.x`. The best practice is to pass the property `theme` to every `<Icon />` components.

 ```jsx
@ -41,6 +54,8 @@ All the icons will render to `<svg>`. You can still set `style` and `className`
 <Icon type="message" style={{ fontSize: '16px', color: '#08c' }} theme="outlined" />
 ```

+### Set TwoTone Color
+
 When using the two-tone icons, you can use the static methods `Icon.getTwoToneColor()` and `Icon.setTwoToneColor(colorString)` to spicify the primary color.

 ```jsx
@ -48,6 +63,8 @@ Icon.setTwoToneColor('#eb2f96');
 Icon.getTwoToneColor(); // #eb2f96
 ```

+### Custom Svg Icon
+
 You can import svg icon as an react component by using `webpack` and [`@svgr/webpack`](https://www.npmjs.com/package/@svgr/webpack). `@svgr/webpack`'s `options` [reference](https://github.com/smooth-code/svgr#options).

 ```js
@ -89,12 +106,11 @@ The following properties are available for the component:
 | className | The computed class name of the `svg` element | string | - |
 | style | The computed style of the `svg` element | CSSProperties | - |

+### Custom Font Icon

-### Use custom icon with iconfont.cn
+We added a `createFromIconfontCN` function to help developer using their own icons deployed at [iconfont.cn](http://iconfont.cn/) in a convenient way.

-#### Icon.createFromIconfontCN(options)
-
-This method is specified for [iconfont.cn](http://iconfont.cn/).
+> This method is specified for [iconfont.cn](http://iconfont.cn/).

 ```js
 const MyIcon = Icon.createFromIconfontCN({
--- a/components/icon/index.zh-CN.md
+++ b/components/icon/index.zh-CN.md
@ -16,7 +16,7 @@ toc: false

 > 点击图标即可复制代码。

-双色图标可能略有缺失，我们还在持续补充中。
+新版图标可能略有缺失，我们还在持续补充中。

 ```__react
 import IconDisplay from 'site/theme/template/IconDisplay';
@ -32,9 +32,22 @@ ReactDOM.render(<IconDisplay />, mountNode);
 | theme | 图标主题风格。可选实心、描线、双色等主题风格，适用于官方图标 | 'filled' \| 'outlined' \| 'twoTone' | 'outlined' |
 | spin | 是否有旋转动画 | boolean | false |
 | component | 控制如何渲染图标，通常是一个渲染根标签为 `<svg>` 的 `React` 组件，**会使 `type` 属性失效** | ComponentType<CustomIconComponentProps\> | - |
-| twoToneColor | 仅适用双色图标。设置双色图标的主要颜色。 | string (十六进制颜色) | - |
+| twoToneColor | 仅适用双色图标。设置双色图标的主要颜色 | string (十六进制颜色) | - |

-其中 `theme`, `component`, `twoToneColor` 是 `antd@3.9.x` 新增加的属性。最佳实践是给使用的 `<Icon />` 组件传入属性 `theme` 以明确图标的主题风格。例如：
+### Svg 图标
+
+在 `3.9.x` 版本后，我们使用了 svg 图标替换了原先的 font 图标，从而带来了以下优势：
+
+- 完全离线化使用，不需要从支付宝 cdn 下载字体文件，图标不会因为网络问题呈现方块，也无需字体文件本地部署。
+- 在低端设备上 svg 有更好的清晰度。
+- 支持多色图标。
+- 对于内建图标的更换可以提供更多 API，而不需要进行样式覆盖。
+
+更多讨论可参考：[#10353](https://github.com/ant-design/ant-design/issues/10353)。
+
+> ⚠️ 目前 3.9.x 上我们全量引入了所有图标，导致 antd 默认的包体积有一定增加，我们会在不远的未来增加新的 API 来实现图标的按需使用，更多相关讨论可关注：[#12011](https://github.com/ant-design/ant-design/issues/12011)。
+
+其中 `theme`, `component`, `twoToneColor` 是 `3.9.x` 版本新增加的属性。最佳实践是给使用的 `<Icon />` 组件传入属性 `theme` 以明确图标的主题风格。例如：

 ```jsx
 <Icon type="star" theme="filled" />
@ -46,13 +59,17 @@ ReactDOM.render(<IconDisplay />, mountNode);
 <Icon type="message" style={{ fontSize: '16px', color: '#08c' }} />
 ```

-对于双色图标，可以通过使用 `Icon.getTwoToneColor()` 和 `Icon.setTwoToneColor(colorString)` 来设置图标主色。
+### 双色图标主色
+
+对于双色图标，可以通过使用 `Icon.getTwoToneColor()` 和 `Icon.setTwoToneColor(colorString)` 来全局设置图标主色。

 ```jsx
 Icon.setTwoToneColor('#eb2f96');
 Icon.getTwoToneColor(); // #eb2f96
 ```

+### 自定义 svg 图标
+
 如果使用 `webpack`，可以通过配置 [@svgr/webpack](https://www.npmjs.com/package/@svgr/webpack) 来将 `svg` 图标作为 `React` 组件导入。`@svgr/webpack` 的 `options` 选项请参阅 [svgr文档](https://github.com/smooth-code/svgr#options)。

 ```js
@ -94,11 +111,9 @@ ReactDOM.render(
 | className | 计算后的 `svg` 类名 | string | - |
 | style | 计算后的 `svg` 元素样式 | CSSProperties | - |

-### 使用 iconfont.cn 的自定义图标
+### 自定义 font 图标

-#### Icon.createFromIconfontCN(options)
-
-这个方法适用于 `iconfont.cn` 的用户
+在 `3.9.x` 里，我们提供了一个 `createFromIconfontCN` 方法，方便开发者调用在 [iconfont.cn](http://iconfont.cn/) 上自行管理的图标。

 ```js
 const MyIcon = Icon.createFromIconfontCN({
--- a/components/locale-provider/tests/snapshots/index.test.js.snap
+++ b/components/locale-provider/tests/snapshots/index.test.js.snap
@ -5873,6 +5873,7 @@ exports[`Locale Provider should display the text as ar 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -10750,6 +10751,7 @@ exports[`Locale Provider should display the text as bg 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -15627,6 +15629,7 @@ exports[`Locale Provider should display the text as ca 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -20504,6 +20507,7 @@ exports[`Locale Provider should display the text as cs 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -25381,6 +25385,7 @@ exports[`Locale Provider should display the text as de 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -30258,6 +30263,7 @@ exports[`Locale Provider should display the text as el 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -35135,6 +35141,7 @@ exports[`Locale Provider should display the text as en 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -40012,6 +40019,7 @@ exports[`Locale Provider should display the text as en-gb 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -44889,6 +44897,7 @@ exports[`Locale Provider should display the text as es 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -49766,6 +49775,7 @@ exports[`Locale Provider should display the text as et 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -54643,6 +54653,7 @@ exports[`Locale Provider should display the text as fa 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -59520,6 +59531,7 @@ exports[`Locale Provider should display the text as fi 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -64397,6 +64409,7 @@ exports[`Locale Provider should display the text as fr 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -69274,6 +69287,7 @@ exports[`Locale Provider should display the text as fr 2`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -74151,6 +74165,7 @@ exports[`Locale Provider should display the text as is 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -79028,6 +79043,7 @@ exports[`Locale Provider should display the text as it 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -83905,6 +83921,7 @@ exports[`Locale Provider should display the text as ja 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -88782,6 +88799,7 @@ exports[`Locale Provider should display the text as ko 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -93659,6 +93677,7 @@ exports[`Locale Provider should display the text as ku-iq 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -98536,6 +98555,7 @@ exports[`Locale Provider should display the text as mn-mn 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -103413,6 +103433,7 @@ exports[`Locale Provider should display the text as nb 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -108290,6 +108311,7 @@ exports[`Locale Provider should display the text as nl 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -113167,6 +113189,7 @@ exports[`Locale Provider should display the text as nl-be 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -118044,6 +118067,7 @@ exports[`Locale Provider should display the text as pl 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -122921,6 +122945,7 @@ exports[`Locale Provider should display the text as pt 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -127798,6 +127823,7 @@ exports[`Locale Provider should display the text as pt-br 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -132675,6 +132701,7 @@ exports[`Locale Provider should display the text as ru 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -137552,6 +137579,7 @@ exports[`Locale Provider should display the text as sk 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -142429,6 +142457,7 @@ exports[`Locale Provider should display the text as sl 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -147306,6 +147335,7 @@ exports[`Locale Provider should display the text as sr 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -152183,6 +152213,7 @@ exports[`Locale Provider should display the text as sv 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -157060,6 +157091,7 @@ exports[`Locale Provider should display the text as th 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -161937,6 +161969,7 @@ exports[`Locale Provider should display the text as tr 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -166814,6 +166847,7 @@ exports[`Locale Provider should display the text as uk 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -171691,6 +171725,7 @@ exports[`Locale Provider should display the text as vi 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -176568,6 +176603,7 @@ exports[`Locale Provider should display the text as zh-cn 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
@ -181445,6 +181481,7 @@ exports[`Locale Provider should display the text as zh-tw 1`] = `
        />
        <div
          class="ant-popover-inner"
+          role="tooltip"
        >
          <div>
            <div
--- a/components/notification/demo/custom-icon.md
+++ b/components/notification/demo/custom-icon.md
@ -20,7 +20,7 @@ const openNotification = () => {
  notification.open({
    message: 'Notification Title',
    description: 'This is the content of the notification. This is the content of the notification. This is the content of the notification.',
-    icon: <Icon type="smile-circle" style={{ color: '#108ee9' }} />,
+    icon: <Icon type="smile" style={{ color: '#108ee9' }} />,
  });
 };

--- a/components/popconfirm/tests/snapshots/index.test.js.snap
+++ b/components/popconfirm/tests/snapshots/index.test.js.snap
@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`Popconfirm should show overlay when trigger is clicked 1`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"></div><div class=\\"ant-popover-inner\\"><div><div class=\\"ant-popover-inner-content\\"><div class=\\"ant-popover-message\\"><i class=\\"anticon anticon-exclamation-circle\\"><svg viewBox=\\"64 64 896 896\\" class=\\"\\" data-icon=\\"exclamation-circle\\" width=\\"1em\\" height=\\"1em\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z\\"></path></svg></i><div class=\\"ant-popover-message-title\\">code</div></div><div class=\\"ant-popover-buttons\\"><button type=\\"button\\" class=\\"ant-btn ant-btn-sm\\"><span>Cancel</span></button><button type=\\"button\\" class=\\"ant-btn ant-btn-primary ant-btn-sm\\"><span>OK</span></button></div></div></div></div></div>"`;
+exports[`Popconfirm should show overlay when trigger is clicked 1`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div><div class=\\"ant-popover-inner-content\\"><div class=\\"ant-popover-message\\"><i class=\\"anticon anticon-exclamation-circle\\"><svg viewBox=\\"64 64 896 896\\" class=\\"\\" data-icon=\\"exclamation-circle\\" width=\\"1em\\" height=\\"1em\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z\\"></path></svg></i><div class=\\"ant-popover-message-title\\">code</div></div><div class=\\"ant-popover-buttons\\"><button type=\\"button\\" class=\\"ant-btn ant-btn-sm\\"><span>Cancel</span></button><button type=\\"button\\" class=\\"ant-btn ant-btn-primary ant-btn-sm\\"><span>OK</span></button></div></div></div></div></div>"`;

-exports[`Popconfirm should show overlay when trigger is clicked 2`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"></div><div class=\\"ant-popover-inner\\"><div><div class=\\"ant-popover-inner-content\\"><div class=\\"ant-popover-message\\"><i class=\\"anticon anticon-exclamation-circle\\"><svg viewBox=\\"64 64 896 896\\" class=\\"\\" data-icon=\\"exclamation-circle\\" width=\\"1em\\" height=\\"1em\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z\\"></path></svg></i><div class=\\"ant-popover-message-title\\">code</div></div><div class=\\"ant-popover-buttons\\"><button type=\\"button\\" class=\\"ant-btn ant-btn-sm\\"><span>Cancel</span></button><button type=\\"button\\" class=\\"ant-btn ant-btn-primary ant-btn-sm\\"><span>OK</span></button></div></div></div></div></div>"`;
+exports[`Popconfirm should show overlay when trigger is clicked 2`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div><div class=\\"ant-popover-inner-content\\"><div class=\\"ant-popover-message\\"><i class=\\"anticon anticon-exclamation-circle\\"><svg viewBox=\\"64 64 896 896\\" class=\\"\\" data-icon=\\"exclamation-circle\\" width=\\"1em\\" height=\\"1em\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z\\"></path></svg></i><div class=\\"ant-popover-message-title\\">code</div></div><div class=\\"ant-popover-buttons\\"><button type=\\"button\\" class=\\"ant-btn ant-btn-sm\\"><span>Cancel</span></button><button type=\\"button\\" class=\\"ant-btn ant-btn-primary ant-btn-sm\\"><span>OK</span></button></div></div></div></div></div>"`;
--- a/components/popover/tests/snapshots/index.test.js.snap
+++ b/components/popover/tests/snapshots/index.test.js.snap
@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

-exports[`Popover should show overlay when trigger is clicked 1`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"></div><div class=\\"ant-popover-inner\\"><div><div class=\\"ant-popover-title\\">code</div><div class=\\"ant-popover-inner-content\\">console.log('hello world')</div></div></div></div>"`;
+exports[`Popover should show overlay when trigger is clicked 1`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div><div class=\\"ant-popover-title\\">code</div><div class=\\"ant-popover-inner-content\\">console.log('hello world')</div></div></div></div>"`;

-exports[`Popover should show overlay when trigger is clicked 2`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"></div><div class=\\"ant-popover-inner\\"><div><div class=\\"ant-popover-title\\">code</div><div class=\\"ant-popover-inner-content\\">console.log('hello world')</div></div></div></div>"`;
+exports[`Popover should show overlay when trigger is clicked 2`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div><div class=\\"ant-popover-title\\">code</div><div class=\\"ant-popover-inner-content\\">console.log('hello world')</div></div></div></div>"`;
--- a/components/slider/tests/snapshots/index.test.js.snap
+++ b/components/slider/tests/snapshots/index.test.js.snap
@ -13,6 +13,7 @@ exports[`Slider should show tooltip when hovering slider handler 1`] = `
      />
      <div
        class="ant-tooltip-inner"
+        role="tooltip"
      >
        30
      </div>
@ -34,6 +35,7 @@ exports[`Slider should show tooltip when hovering slider handler 2`] = `
      />
      <div
        class="ant-tooltip-inner"
+        role="tooltip"
      >
        30
      </div>
--- a/components/style/mixins/iconfont.less
+++ b/components/style/mixins/iconfont.less
@ -4,13 +4,13 @@
  vertical-align: -0.125em; // for SVG icon, see https://blog.prototypr.io/align-svg-icons-to-text-and-say-goodbye-to-font-icons-d44b3d7b26b4
  text-align: center;
  text-transform: none;
-  line-height: 1;
+  line-height: 0;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  svg {
-    display: block;
+    display: inline-block;
  }

  &:before {
--- a/components/table/style/index.less
+++ b/components/table/style/index.less
@ -95,7 +95,7 @@

  &-thead > tr,
  &-tbody > tr {
-    transition: all .3s;
+    transition: all .3s, height 0s;
    &.@{table-prefix-cls}-row-hover,
    &:hover {
      & > td {
--- a/components/tabs/index.tsx
+++ b/components/tabs/index.tsx
@ -158,12 +158,14 @@ export default class Tabs extends React.Component<TabsProps, any> {
      </div>
    ) : null;

+    const { className: dropped, ...tabBarProps } = this.props;
+
    return (
      <RcTabs
        {...this.props}
        className={cls}
        tabBarPosition={tabPosition}
-        renderTabBar={() => <TabBar {...this.props} tabBarExtraContent={tabBarExtraContent}/>}
+        renderTabBar={() => <TabBar {...tabBarProps} tabBarExtraContent={tabBarExtraContent}/>}
        renderTabContent={() => <TabContent animated={tabPaneAnimated} animatedWithMargin />}
        onChange={this.handleChange}
      >
--- a/components/tooltip/index.en-US.md
+++ b/components/tooltip/index.en-US.md
@ -26,7 +26,7 @@ The following APIs are shared by Tooltip, Popconfirm, Popover.
 | arrowPointAtCenter | Whether the arrow is pointed at the center of target, supported after `antd@1.11+` | boolean | `false` |
 | autoAdjustOverflow | Whether to adjust popup placement automatically when popup is off screen | boolean | `true` |
 | defaultVisible | Whether the floating tooltip card is visible by default | boolean | `false` |
-| getPopupContainer | The DOM container of the tip, the default behavior is to create a `div` element in `body`. Use `getTooltipContainer` if you are using `antd@<2.5.2` | Function(triggerNode) | () => document.body |
+| getPopupContainer | The DOM container of the tip, the default behavior is to create a `div` element in `body` | Function(triggerNode) | () => document.body |
 | mouseEnterDelay | Delay in seconds, before tooltip is shown on mouse enter | number | 0 |
 | mouseLeaveDelay | Delay in seconds, before tooltip is hidden on mouse leave | number | 0.1 |
 | overlayClassName | Class name of the tooltip card | string | - |
--- a/components/tooltip/index.zh-CN.md
+++ b/components/tooltip/index.zh-CN.md
@ -28,7 +28,7 @@ title: Tooltip
 | arrowPointAtCenter | 箭头是否指向目标元素中心，`antd@1.11+` 支持 | boolean | `false` |
 | autoAdjustOverflow | 气泡被遮挡时自动调整位置 | boolean | `true` |
 | defaultVisible | 默认是否显隐 | boolean | false |
-| getPopupContainer | 浮层渲染父节点，默认渲染到 body 上。`2.5.2` 之前请使用 `getTooltipContainer` | Function(triggerNode) | () => document.body |
+| getPopupContainer | 浮层渲染父节点，默认渲染到 body 上 | Function(triggerNode) | () => document.body |
 | mouseEnterDelay | 鼠标移入后延时多少才显示 Tooltip，单位：秒 | number | 0 |
 | mouseLeaveDelay | 鼠标移出后延时多少才隐藏 Tooltip，单位：秒 | number | 0.1 |
 | overlayClassName | 卡片类名 | string | 无 |
--- a/components/tree-select/interface.tsx
+++ b/components/tree-select/interface.tsx
@ -35,7 +35,7 @@ export interface TreeSelectProps extends AbstractSelectProps {
  multiple?: boolean;
  maxTagCount?: number;
  onSelect?: (value: any) => void;
-  onChange?: (value: any, label: any) => void;
+  onChange?: (value: any, label: any, extra: any) => void;
  onSearch?: (value: any) => void;
  searchPlaceholder?: string;
  dropdownStyle?: React.CSSProperties;
--- a/components/upload/UploadList.tsx
+++ b/components/upload/UploadList.tsx
@ -136,15 +136,17 @@ export default class UploadList extends React.Component<UploadListProps, any> {
        [`${prefixCls}-list-item`]: true,
        [`${prefixCls}-list-item-${file.status}`]: true,
      });
+      const linkProps = typeof file.linkProps === 'string'
+        ? JSON.parse(file.linkProps) : file.linkProps;
      const preview = file.url ? (
        <a
-          {...file.linkProps}
-          href={file.url}
          target="_blank"
          rel="noopener noreferrer"
          className={`${prefixCls}-list-item-name`}
-          onClick={e => this.handlePreview(file, e)}
          title={file.name}
+          {...linkProps}
+          href={file.url}
+          onClick={e => this.handlePreview(file, e)}
        >
          {file.name}
        </a>
--- a/components/upload/tests/upload.test.js
+++ b/components/upload/tests/upload.test.js
@ -185,4 +185,43 @@ describe('Upload', () => {
      });
    });
  });
+
+  it('should support linkProps as object', () => {
+    const fileList = [{
+      uid: '-1',
+      name: 'foo.png',
+      status: 'done',
+      url: 'http://www.baidu.com/xxx.png',
+      linkProps: {
+        download: 'image',
+        rel: 'noopener',
+      },
+    }];
+    const wrapper = mount(
+      <Upload fileList={fileList} />
+    );
+    const linkNode = wrapper.find('a.ant-upload-list-item-name');
+    expect(linkNode.props().download).toBe('image');
+    expect(linkNode.props().rel).toBe('noopener');
+  });
+
+  it('should support linkProps as json stringify', () => {
+    const linkPropsString = JSON.stringify({
+      download: 'image',
+      rel: 'noopener',
+    });
+    const fileList = [{
+      uid: '-1',
+      name: 'foo.png',
+      status: 'done',
+      url: 'http://www.baidu.com/xxx.png',
+      linkProps: linkPropsString,
+    }];
+    const wrapper = mount(
+      <Upload fileList={fileList} />
+    );
+    const linkNode = wrapper.find('a.ant-upload-list-item-name');
+    expect(linkNode.props().download).toBe('image');
+    expect(linkNode.props().rel).toBe('noopener');
+  });
 });
--- a/components/upload/index.en-US.md
+++ b/components/upload/index.en-US.md
@ -66,8 +66,6 @@ When uploading state change, it returns:
   }
   ```

-   > Before `antd@1.9.0`, this parameter will be Array Object `[file, ...]` in multiple mode, while in `antd@1.9.0+`, it will always be an Object.
-
 2. `fileList` current list of files
 3. `event` response from server, including uploading progress, supported by advanced browsers.

--- a/components/upload/index.zh-CN.md
+++ b/components/upload/index.zh-CN.md
@ -67,8 +67,6 @@ title: Upload
   }
   ```

-   > `antd@1.9.0` 之前，multiple 模式下，此参数为一个对象数组 `[file, ...]`，`antd@1.9.0` 开始无论是否多选，均为一个对象。
-
 2. `fileList` 当前的文件列表。
 3. `event` 上传中的服务端响应内容，包含了上传进度等信息，高级浏览器支持。

--- a/docs/react/contributing.en-US.md
+++ b/docs/react/contributing.en-US.md
@ -1,5 +1,5 @@
 ---
-order: 9
+order: 10
 title: Contributing
 toc: false
 ---
@ -16,13 +16,13 @@ All work on Ant Design happens directly on [GitHub](https://github.com/ant-desig

 ## Branch Organization

-According to our [release schedule](changelog#Release-Schedule), we'll cut a `feature` branch (e.g. `feature-3.1` for 3.1 release) from `master` every month. If you send a bugfix pull request, please do it against the `master` branch, if it's a feature pull request, please do it against the `feature` branch.
+According to our [release schedule](changelog#Release-Schedule), we maintians two branchs `master` and `feature`. If you send a bugfix pull request, please do it against the `master` branch, if it's a feature pull request, please do it against the `feature` branch.

 ## Bugs

 We are using [GitHub Issues](https://github.com/ant-design/ant-design/issues) for bug tracing. The best way to get your bug fixed is using our [issue helper](http://new-issue.ant.design) and provide a reprduction with this [template](https://u.ant.design/codesandbox-repro).

-Before you reporting a bug, please make sure you've searched exists issues, and read our [FAQ](https://github.com/ant-design/ant-design/wiki/FAQ).
+Before you reporting a bug, please make sure you've searched exists issues, and read our [FAQ](/docs/react/faq).

 ## Proposing a Change

--- a/docs/react/contributing.zh-CN.md
+++ b/docs/react/contributing.zh-CN.md
@ -1,5 +1,5 @@
 ---
-order: 9
+order: 10
 title: 贡献指南
 toc: false
 ---
@ -16,13 +16,13 @@ toc: false

 ## 分支管理

-基于我们的 [发布周期](/changelog)，我们每个月都会从 `master` 分支切一个 `feature` 分支出来（比如 `features-3.1` 分支用来发布 3.1 版本）。 如果你要修一个 bug，那么请发 pull request 到 `master`；如果你要提一个增加新功能的 pull request，那么请基于 `feature` 分支来做。
+基于我们的 [发布周期](/changelog)，我们长期维护两个分支 `master` 和 `feature`。如果你要修一个 bug，那么请发 pull request 到 `master`；如果你要提一个增加新功能的 pull request，那么请基于 `feature` 分支来做。

 ## Bugs

 我们使用 [GitHub Issues](https://github.com/ant-design/ant-design/issues) 来做 bug 追踪。 如果你想要你发现的 bug 被快速解决，最好的办法就是通过我们提供的 [issue 小助手](http://new-issue.ant.design) 来提 issue。并且能使用这个 [模板](https://u.ant.design/codesandbox-repro) 来提供重现。

-在你报告一个 bug 之前，请先确保已经搜索过已有的 issue 和阅读了我们的 [常见问题](https://github.com/ant-design/ant-design/wiki/FAQ)。
+在你报告一个 bug 之前，请先确保已经搜索过已有的 issue 和阅读了我们的 [常见问题](/docs/react/faq)。

 ## 新增功能

--- a/docs/react/customize-theme.en-US.md
+++ b/docs/react/customize-theme.en-US.md
@ -98,7 +98,7 @@ Another approach to customize theme is creating a `less` file within variables t

 Note: This way will load the styles of all components, regardless of your demand, which cause `style` option of `babel-plugin-import` not working.

-## How to avoid modifying global styles ?
+## How to avoid modifying global styles?

 Currently ant-design is designed as a whole experience and modify global styles (eg `body` etc).
 If you need to integrate ant-design as a part of an existing website, it's likely you want to prevent ant-design to override global styles.
--- a/docs/react/faq.en-US.md
+++ b/docs/react/faq.en-US.md
@ -0,0 +1,160 @@
+---
+order: 9
+title: FAQ
+---
+
+Search in the questions about React first: https://reactfaq.site .
+
+---
+
+### Are you going to provide Vue(etc...) edition?
+
+No, but [the LICENSE of ant-design](https://github.com/ant-design/ant-design/blob/master/LICENSE) is MIT. So, you can try to implement it with ant-design's [style](https://github.com/ant-design/ant-design/tree/master/style), like: [ant-design-vue](https://github.com/vueComponent/ant-design-vue) [vue-beauty)](https://github.com/FE-Driver/vue-beauty) or [antue](https://github.com/zzuu666/antue).
+
+### Are you going to provide Sass/Stylus(etc...) style file?
+
+No, actually, you can convert Less to Sass/Stylus(etc...) with tools (which you can Google).
+
+### `Select Dropdown DatePicker TimePicker Popover Popconfirm` will disappear when I click another popup component inside it, How to resolve it?
+
+Use `<Select getPopupContainer={trigger => trigger.parentNode}>` to render component inside Popover. (Or other getXxxxContainer props)
+
+https://ant.design/components/select/#Select-props
+
+related issue: [#3487](https://github.com/ant-design/ant-design/issues/3487) [#3438](https://github.com/ant-design/ant-design/issues/3438)
+
+### `Select Dropdown DatePicker TimePicker Popover Popconfirm` will scroll with page?
+
+Use `<Select getPopupContainer={trigger => trigger.parentNode}>` to render component inside the scroll area. (Or other getXxxxContainer props).
+
+https://ant.design/components/select/#Select-props
+
+related issue: [#3487](https://github.com/ant-design/ant-design/issues/3487) [#3438](https://github.com/ant-design/ant-design/issues/3438)
+
+### How to modify default theme of Ant Design?
+
+See: https://ant.design/docs/react/customize-theme .
+
+### Would you supply other themes?
+
+No, we follow Ant Design specification. https://github.com/ant-design/ant-design/issues/1241
+
+### How to modify `Menu`/`Button`(etc...)'s style?
+
+You can override its style. But we don't recommend to do so. antd is not only a set of React components but also a design specification.
+
+### I just want to use `Menu`/`Button`(etc...), but it seems that I have to import the whole antd and its style.
+
+Try [babel-plugin-import](https://github.com/ant-design/babel-plugin-import), or import what you need in this way:
+
+```jsx
+import Menu from 'antd/lib/menu';
+import 'antd/lib/button/style/css';
+```
+
+or (ES6 way with tree shaking):
+
+```jsx
+import { Menu, Breadcrumb, Icon } from 'antd';
+```
+
+### How to optimize momentjs bundle size with webpack?
+
+See: https://github.com/jmblog/how-to-optimize-momentjs-with-webpack
+
+### It doesn't work when I change `defaultValue` dynamically.
+
+The `defaultXxxx` (like `defaultValue`) of `Input`/`Select`(etc...) only works in first render. It is a specification of React, please read [React's documentation](https://facebook.github.io/react/docs/forms.html#controlled-components).
+
+### I set the `value` of `Input`/`Select`(etc...), and then, it cannot be changed by user's action.
+
+Try `defaultValue` or `onChange` to change `value`, and please read [React's documentation](https://facebook.github.io/react/docs/forms.html#controlled-components).
+
+### antd override my global styles!
+
+Yes, antd is designed to develop a complete background application, we override some global styles for styling convenience and it can't be removed now. More info trace https://github.com/ant-design/ant-design/issues/4331 .
+
+Or follow instruction in [How to avoid modifying global styles?](docs/react/customize-theme#How-to-avoid-modifying-global-styles-?)
+
+### I cannot install `antd` and `antd`'s dependencies(etc...). FYI, I live in China mainland.
+
+Long live the Girl Friend Wall! And try [cnpm](http://npm.taobao.org/).
+
+### I set `dependencies.antd` as git repository in package.json, but it doesn't work.
+
+Yes, please install `antd` with npm.
+
+### `message` and `notification` is lower case, but other components are capitalized. Typo?
+
+No, as `message` is just a function, not a React Component.
+
+### `antd` doesn't work well in mobile.
+
+Please check [And Design Mobile](http://mobile.ant.design) for details. `antd` has not been optimized to do so. You may try [react-component](https://github.com/react-component/), those repositories which start with 'm-' 'rn-' are designed for mobile.
+
+### Does `antd` supply standalone files like 'react' do?
+
+Yep, you can [import `antd` with script tag](https://ant.design/docs/react/install?locale=en-US#Import-in-Browser). But we recommend use `npm` to import `antd`, it is simple and ease to maintain.
+
+### I can't visit `icon` in my network environment.
+
+You should deploy the iconfont files to your network by following this [example](https://github.com/ant-design/antd-init/tree/7c1a33cadb98f2fd8688fe527dd7f98215b9bced/examples/local-iconfont). [#1070](https://github.com/ant-design/ant-design/issues/1070)
+
+After 3.9.x [we are using svg icon](/components/icon#svg-icons) so you don't need to deploy iconfont locally any more!
+
+### How to extend antd's components?
+
+If you need some features which should not be included in antd, try to extend antd's component with [HOC](https://gist.github.com/sebmarkbage/ef0bf1f338a7182b6775). [more](https://medium.com/@dan_abramov/mixins-are-dead-long-live-higher-order-components-94a0d2f9e750#.eeu8q01s1)
+
+### How to spell Ant Design correctly?
+
+- ✅ **Ant Design**: Capitalized with space, for the design language
+- ✅ **antd**: all lowercase, for the React UI library
+
+Here are some typical wrong examples:
+
+- ❌ AntD
+- ❌ antD
+- ❌ Antd
+- ❌ ant design
+- ❌ AntDesign
+- ❌ antdesign
+- ❌ Antdesign
+
+### Do you guys have any channel for donation? like PayPal or Alipay.
+
+No yet.
+
+### Why not?
+
+Alibaba will pay us.
+
+---
+
+## Errors & Warnings
+
+Here are some errors & warnings that you may meet while using antd, but most of them are not bugs of antd.
+
+### Adjacent JSX elements must be wrapped in an enclosing tag
+
+An [answer from StackOverflow](http://stackoverflow.com/questions/25034994/how-to-correctly-wrap-few-td-tags-for-jsxtransformer), and please read [React's documentation](http://facebook.github.io/react/docs/displaying-data.html#components-are-just-like-functions).
+
+### React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components)
+
+Please make sure that you import `antd`'s components correctly. Read the corresponding documentation of the `antd`'s version which you use. And pay attention to typo.
+
+### rm is not recognized as an internal or external command
+
+Please read this [issue](https://github.com/ant-design/ant-design/issues/650#issuecomment-164966511), or try Linux/Unix.
+
+### Failed propType: Invalid prop `AAA` of type `BBB` supplied to `CCC`, expected `DDD`. Check the render method of `EEE`.
+
+Please read the corresponding documentation of the `antd`'s version which you use, and make sure that you pass value with correct type to `antd`'s components,
+
+### Unknown option: xxx/package.json.presets
+
+An [answer from Stack Overflow](http://stackoverflow.com/questions/33685365/unknown-option-babelrc-presets).
+
+### Invariant Violation: findComponentRoot(...): Unable to find element.
+
+You may import React twice. Set React & ReactDOM as external, if you are using webpack, See: [#525](https://github.com/ant-design/ant-design/issues/525). If you are using others(browserify, etc...), please read its documentation and find options which can set React & ReactDOM as external.
--- a/docs/react/faq.zh-CN.md
+++ b/docs/react/faq.zh-CN.md
@ -0,0 +1,160 @@
+---
+order: 9
+title: FAQ
+---
+
+Search in the questions about React first: https://reactfaq.site .
+
+---
+
+### Are you going to provide Vue(etc...) edition?
+
+No, but [the LICENSE of ant-design](https://github.com/ant-design/ant-design/blob/master/LICENSE) is MIT. So, you can try to implement it with ant-design's [style](https://github.com/ant-design/ant-design/tree/master/style), like: [ant-design-vue](https://github.com/vueComponent/ant-design-vue) [vue-beauty)](https://github.com/FE-Driver/vue-beauty) or [antue](https://github.com/zzuu666/antue).
+
+### Are you going to provide Sass/Stylus(etc...) style file?
+
+No, actually, you can convert Less to Sass/Stylus(etc...) with tools (which you can Google).
+
+### `Select Dropdown DatePicker TimePicker Popover Popconfirm` will disappear when I click another popup component inside it, How to resolve it?
+
+Use `<Select getPopupContainer={trigger => trigger.parentNode}>` to render component inside Popover. (Or other getXxxxContainer props)
+
+https://ant.design/components/select/#Select-props
+
+related issue: [#3487](https://github.com/ant-design/ant-design/issues/3487) [#3438](https://github.com/ant-design/ant-design/issues/3438)
+
+### `Select Dropdown DatePicker TimePicker Popover Popconfirm` will scroll with page?
+
+Use `<Select getPopupContainer={trigger => trigger.parentNode}>` to render component inside the scroll area. (Or other getXxxxContainer props).
+
+https://ant.design/components/select/#Select-props
+
+related issue: [#3487](https://github.com/ant-design/ant-design/issues/3487) [#3438](https://github.com/ant-design/ant-design/issues/3438)
+
+### How to modify default theme of Ant Design?
+
+See: https://ant.design/docs/react/customize-theme .
+
+### Would you supply other themes?
+
+No, we follow Ant Design specification. https://github.com/ant-design/ant-design/issues/1241
+
+### How to modify `Menu`/`Button`(etc...)'s style?
+
+You can override its style. But we don't recommend to do so. antd is not only a set of React components but also a design specification.
+
+### I just want to use `Menu`/`Button`(etc...), but it seems that I have to import the whole antd and its style.
+
+Try [babel-plugin-import](https://github.com/ant-design/babel-plugin-import), or import what you need in this way:
+
+```jsx
+import Menu from 'antd/lib/menu';
+import 'antd/lib/button/style/css';
+```
+
+or (ES6 way with tree shaking):
+
+```jsx
+import { Menu, Breadcrumb, Icon } from 'antd';
+```
+
+### How to optimize momentjs bundle size with webpack?
+
+See: https://github.com/jmblog/how-to-optimize-momentjs-with-webpack
+
+### It doesn't work when I change `defaultValue` dynamically.
+
+The `defaultXxxx` (like `defaultValue`) of `Input`/`Select`(etc...) only works in first render. It is a specification of React, please read [React's documentation](https://facebook.github.io/react/docs/forms.html#controlled-components).
+
+### I set the `value` of `Input`/`Select`(etc...), and then, it cannot be changed by user's action.
+
+Try `defaultValue` or `onChange` to change `value`, and please read [React's documentation](https://facebook.github.io/react/docs/forms.html#controlled-components).
+
+### antd override my global styles!
+
+Yes, antd is designed to develop a complete background application, we override some global styles for styling convenience and it can't be removed now. More info trace https://github.com/ant-design/ant-design/issues/4331 .
+
+Or follow instruction in [How to avoid modifying global styles?](docs/react/customize-theme#How-to-avoid-modifying-global-styles-?)
+
+### I cannot install `antd` and `antd`'s dependencies(etc...). FYI, I live in China mainland.
+
+Long live the Girl Friend Wall! And try [cnpm](http://npm.taobao.org/).
+
+### I set `dependencies.antd` as git repository in package.json, but it doesn't work.
+
+Yes, please install `antd` with npm.
+
+### `message` and `notification` is lower case, but other components are capitalized. Typo?
+
+No, as `message` is just a function, not a React Component.
+
+### `antd` doesn't work well in mobile.
+
+Please check [And Design Mobile](http://mobile.ant.design) for details. `antd` has not been optimized to do so. You may try [react-component](https://github.com/react-component/), those repositories which start with 'm-' 'rn-' are designed for mobile.
+
+### Does `antd` supply standalone files like 'react' do?
+
+Yep, you can [import `antd` with script tag](https://ant.design/docs/react/install?locale=en-US#Import-in-Browser). But we recommend use `npm` to import `antd`, it is simple and ease to maintain.
+
+### I can't visit `icon` in my network environment.
+
+You should deploy the iconfont files to your network by following this [example](https://github.com/ant-design/antd-init/tree/7c1a33cadb98f2fd8688fe527dd7f98215b9bced/examples/local-iconfont). [#1070](https://github.com/ant-design/ant-design/issues/1070)
+
+After 3.9.x [we are using svg icon](/components/icon#svg-icons) so you don't need to deploy iconfont locally any more!
+
+### How to extend antd's components?
+
+If you need some features which should not be included in antd, try to extend antd's component with [HOC](https://gist.github.com/sebmarkbage/ef0bf1f338a7182b6775). [more](https://medium.com/@dan_abramov/mixins-are-dead-long-live-higher-order-components-94a0d2f9e750#.eeu8q01s1)
+
+### How to spell Ant Design correctly?
+
+- ✅ **Ant Design**: Capitalized with space, for the design language
+- ✅ **antd**: all lowercase, for the React UI library
+
+Here are some typical wrong examples:
+
+- ❌ AntD
+- ❌ antD
+- ❌ Antd
+- ❌ ant design
+- ❌ AntDesign
+- ❌ antdesign
+- ❌ Antdesign
+
+### Do you guys have any channel for donation? like PayPal or Alipay.
+
+No yet.
+
+### Why not?
+
+Alibaba will pay us.
+
+---
+
+## Errors & Warnings
+
+Here are some errors & warnings that you may meet while using antd, but most of them are not bugs of antd.
+
+### Adjacent JSX elements must be wrapped in an enclosing tag
+
+An [answer from StackOverflow](http://stackoverflow.com/questions/25034994/how-to-correctly-wrap-few-td-tags-for-jsxtransformer), and please read [React's documentation](http://facebook.github.io/react/docs/displaying-data.html#components-are-just-like-functions).
+
+### React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components)
+
+Please make sure that you import `antd`'s components correctly. Read the corresponding documentation of the `antd`'s version which you use. And pay attention to typo.
+
+### rm is not recognized as an internal or external command
+
+Please read this [issue](https://github.com/ant-design/ant-design/issues/650#issuecomment-164966511), or try Linux/Unix.
+
+### Failed propType: Invalid prop `AAA` of type `BBB` supplied to `CCC`, expected `DDD`. Check the render method of `EEE`.
+
+Please read the corresponding documentation of the `antd`'s version which you use, and make sure that you pass value with correct type to `antd`'s components,
+
+### Unknown option: xxx/package.json.presets
+
+An [answer from Stack Overflow](http://stackoverflow.com/questions/33685365/unknown-option-babelrc-presets).
+
+### Invariant Violation: findComponentRoot(...): Unable to find element.
+
+You may import React twice. Set React & ReactDOM as external, if you are using webpack, See: [#525](https://github.com/ant-design/ant-design/issues/525). If you are using others(browserify, etc...), please read its documentation and find options which can set React & ReactDOM as external.
--- a/docs/react/introduce.en-US.md
+++ b/docs/react/introduce.en-US.md
@ -129,7 +129,7 @@ import 'antd/dist/antd.css';  // or 'antd/dist/antd.less'
 - [Motion](https://motion.ant.design)
 - [Developer Instruction](https://github.com/ant-design/ant-design/wiki/Development)
 - [Versioning Release Note](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [FAQ](https://github.com/ant-design/ant-design/wiki/FAQ)
+- [FAQ](/docs/react/faq)
 - [CodeSandbox template](https://u.ant.design/codesandbox-repro) for bug reports
 - [Awesome Ant Design](https://github.com/websemantics/awesome-ant-design)
 - [Customize Theme](/docs/react/customize-theme)
--- a/docs/react/introduce.zh-CN.md
+++ b/docs/react/introduce.zh-CN.md
@ -128,7 +128,7 @@ import 'antd/dist/antd.css';  // or 'antd/dist/antd.less'
 - [设计规范速查手册](https://github.com/ant-design/ant-design/wiki/Ant-Design-%E8%AE%BE%E8%AE%A1%E5%9F%BA%E7%A1%80%E7%AE%80%E7%89%88)
 - [开发者说明](https://github.com/ant-design/ant-design/wiki/Development)
 - [版本发布规则](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [常见问题](https://github.com/ant-design/ant-design/wiki/FAQ)
+- [常见问题](/docs/react/faq)
 - [CodeSandbox 模板](https://u.ant.design/codesandbox-repro) for bug reports
 - [Awesome Ant Design](https://github.com/websemantics/awesome-ant-design)
 - [定制主题](/docs/react/customize-theme)
--- a/package.json
+++ b/package.json
@ -206,6 +206,7 @@
    "site": "cross-env NODE_ENV=production bisheng build --ssr -c ./site/bisheng.config.js && node ./scripts/generateColorLess.js",
    "predeploy": "antd-tools run clean && npm run site && cp netlify.toml _site && cp -r .circleci _site",
    "deploy": "bisheng gh-pages --push-only",
+    "deploy:china-mirror": "git checkout gh-pages && git pull origin gh-pages && git push git@gitee.com:ant-design/ant-design.git gh-pages",
    "pub": "antd-tools run pub",
    "prepublish": "antd-tools run guard",
    "pre-publish": "npm run test-all && node ./scripts/prepub",
--- a/site/theme/static/demo.less
+++ b/site/theme/static/demo.less
@ -193,10 +193,6 @@
    border-radius: 20px;
    opacity: 0;

-    svg {
-      display: inline-block;
-    }
-
    &:hover {
      color: @site-text-color-secondary;
      transform: scale(1.2);
--- a/site/theme/static/markdown.less
+++ b/site/theme/static/markdown.less
@ -59,7 +59,7 @@
  height: 1px;
  border: 0;
  background: @site-border-color-split;
-  margin: 72px 0;
+  margin: 56px 0;
  clear: both;
 }

--- a/site/theme/template/Layout/Footer.jsx
+++ b/site/theme/template/Layout/Footer.jsx
@ -205,7 +205,7 @@ class Footer extends React.Component {
                  </a>
                </div>
                <div>
-                  <a target="_blank" rel="noopener noreferrer" href="https://github.com/ant-design/ant-design/wiki/FAQ">
+                  <a target="_blank" rel="noopener noreferrer" href="/docs/react/faq">
                    <FormattedMessage id="app.footer.faq" />
                  </a>
                </div>