chore: merge master

2024-11-27 20:49:53 +08:00 · 2019-11-25 15:16:59 +08:00 · 2019-11-25 15:16:59 +08:00 · b37b317b69
commit b37b317b69
parent 667883ceb0 a210784294
43 changed files with 637 additions and 315 deletions
--- a/.codesandbox/ci.json
+++ b/.codesandbox/ci.json
@ -0,0 +1,3 @@
+{
+  "sandboxes": ["wk04r016q8"]
+}
--- a/.github/workflows/deploy-site.yml
+++ b/.github/workflows/deploy-site.yml
@ -9,13 +9,20 @@ jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
-    - name: Checkout
+    - name: checkout
      uses: actions/checkout@master

-    - name: Deploy website
-      uses: JamesIves/github-pages-deploy-action@master
+    - name: install
+      run: npm install
+
+    - name: build
+      run: npm run predeploy
+
+    - name: deploy
+      uses: peaceiris/actions-gh-pages@v2.5.0
      env:
-        ACCESS_TOKEN: ${{ secrets.ACCESS_TOKEN }}
-        BRANCH: gh-pages
-        FOLDER: _site
-        BUILD_SCRIPT: npm install && npm run predeploy
+        ACTIONS_DEPLOY_KEY: ${{ secrets.ACCESS_TOKEN }}
+        PUBLISH_BRANCH: gh-pages
+        PUBLISH_DIR: ./_site
+      with:
+        emptyCommits: false
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@ -3,16 +3,217 @@ name: test
 on: [push]

 jobs:
-  build:
-
+  setup:
    runs-on: ubuntu-latest

    steps:
      - name: checkout
        uses: actions/checkout@master

+      - name: cache package-lock.json
+        uses: actions/cache@v1
+        with:
+          path: package-temp-dir
+          key: lock-${{ github.sha }}
+
+      - name: create package-lock.json
+        run: npm i --package-lock-only
+
+      - name: hack for singe file
+        run: |
+          mkdir package-temp-dir
+          cp package-lock.json package-temp-dir
+
+      - name: cache node_modules
+        id: node_modules_cache_id
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+
      - name: install
-        run: npm install
+        if: steps.node_modules_cache_id.outputs.cache-hit != 'true'
+        run: npm ci
+
+  compile:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: checkout
+        uses: actions/checkout@master
+
+      - name: restore cache from package-lock.json
+        uses: actions/cache@v1
+        with:
+          path: package-temp-dir
+          key: lock-${{ github.sha }}
+
+      - name: restore cache from node_modules
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+
+      - name: cache lib
+        uses: actions/cache@v1
+        with:
+          path: lib
+          key: lib-${{ github.sha }}
+
+      - name: cache es
+        uses: actions/cache@v1
+        with:
+          path: es
+          key: es-${{ github.sha }}
+
+      - name: compile
+        run: npm run compile
+
+      - name: check
+        run: node ./tests/dekko/lib.test.js
+
+    needs: setup
+
+  dist:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: checkout
+        uses: actions/checkout@master
+
+      - name: restore cache from package-lock.json
+        uses: actions/cache@v1
+        with:
+          path: package-temp-dir
+          key: lock-${{ github.sha }}
+
+      - name: restore cache from node_modules
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+
+      - name: dist
+        run: npm run dist
+
+      - name: check
+        run: node ./tests/dekko/dist.test.js

      - name: test
-        run: npm run test-all
+        run: npm test
+        env:
+          LIB_DIR: dist
+
+    needs: setup
+
+  lint:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: checkout
+        uses: actions/checkout@master
+
+      - name: restore cache from package-lock.json
+        uses: actions/cache@v1
+        with:
+          path: package-temp-dir
+          key: lock-${{ github.sha }}
+
+      - name: restore cache from node_modules
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+
+      - name: lint
+        run: npm run lint
+
+    needs: setup
+
+  node:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: checkout
+        uses: actions/checkout@master
+
+      - name: restore cache from package-lock.json
+        uses: actions/cache@v1
+        with:
+          path: package-temp-dir
+          key: lock-${{ github.sha }}
+
+      - name: restore cache from node_modules
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+
+      - name: test
+        run: npm test
+
+    needs: setup
+
+  lib:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: checkout
+        uses: actions/checkout@master
+
+      - name: restore cache from package-lock.json
+        uses: actions/cache@v1
+        with:
+          path: package-temp-dir
+          key: lock-${{ github.sha }}
+
+      - name: restore cache from node_modules
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+
+      - name: restore cache from lib
+        uses: actions/cache@v1
+        with:
+          path: lib
+          key: lib-${{ github.sha }}
+
+      - name: test
+        run: npm test
+        env:
+          LIB_DIR: lib
+
+    needs: compile
+
+  es:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: checkout
+        uses: actions/checkout@master
+
+      - name: restore cache from package-lock.json
+        uses: actions/cache@v1
+        with:
+          path: package-temp-dir
+          key: lock-${{ github.sha }}
+
+      - name: restore cache from node_modules
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+
+      - name: restore cache from es
+        uses: actions/cache@v1
+        with:
+          path: es
+          key: es-${{ github.sha }}
+
+      - name: test
+        run: npm test
+        env:
+          LIB_DIR: es
+
+    needs: compile
--- a/CHANGELOG.en-US.md
+++ b/CHANGELOG.en-US.md
@ -15,6 +15,29 @@ timeline: true

 ---

+## 3.25.3
+
+`2019-11-24`
+
+- 🐞 Fix TimePicker disabled item style when focussed. [#19812](https://github.com/ant-design/ant-design/pull/19812) [@yoyo837](https://github.com/yoyo837)
+- 🐞 Fix Menu.Item link style inside Badge. [#19810](https://github.com/ant-design/ant-design/pull/19810)
+- 🐞 Fix Upload `picture-card` type, for crashed style when list item is removing. [#19783](https://github.com/ant-design/ant-design/pull/19783) [@qq645381995](https://github.com/qq645381995)
+- 🇳🇱 Update `sk-SK` locales. [#19787](https://github.com/ant-design/ant-design/pull/19787) [@Kamahl19](https://github.com/Kamahl19)
+- TypeScript
+  - ⚡️ Export interface types in Tooltip. [19846](https://github.com/ant-design/ant-design/pull/19846) [@kachkaev](https://github.com/kachkaev)
+
+## 3.25.2
+
+`2019-11-17`
+
+- 🐞 Fix Upload List do not have tooltip when upload failed. [#19689](https://github.com/ant-design/ant-design/pull/19689) [@qq645381995](https://github.com/qq645381995)
+- 💄 Fix Transfer search style to avoid text overlap with clear icon. [#19693](https://github.com/ant-design/ant-design/pull/19693) [@Abdullah700](https://github.com/Abdullah700)
+- 🇳🇱 Update `NL-nl` locales. [#19734](https://github.com/ant-design/ant-design/pull/19734) [@hoest](https://github.com/hoest)
+- TypeScript
+  - 🐞 Fix Table FilterDropdownProps definition. [#19701](https://github.com/ant-design/ant-design/pull/19701) [@DeanVanNiekerk](https://github.com/DeanVanNiekerk)
+  - 🛠 Slider add `reverse` definition. [#19713](https://github.com/ant-design/ant-design/pull/19713) [@jacklee814](https://github.com/jacklee814)
+  - 🐞 Update Table `filteredValue` definition. [#19722](https://github.com/ant-design/ant-design/pull/19722) [@andelf](https://github.com/andelf)
+
 ## 3.25.1

 `2019-11-10`
--- a/CHANGELOG.zh-CN.md
+++ b/CHANGELOG.zh-CN.md
@ -15,6 +15,29 @@ timeline: true

 ---

+## 3.25.3
+
+`2019-11-24`
+
+- 🐞 修复 TimePicker 禁用项 focus 时的样式问题。[#19812](https://github.com/ant-design/ant-design/pull/19812) [@yoyo837](https://github.com/yoyo837)
+- 🐞 修复 Menu.Item 链接在 Badge 内时，始终处于 active 状态的问题。[#19810](https://github.com/ant-design/ant-design/pull/19810)
+- 🐞 修复 Upload 类型为 `picture-card` 时，列表删除时的样式问题。[#19783](https://github.com/ant-design/ant-design/pull/19783) [@qq645381995](https://github.com/qq645381995)
+- 🇳🇱 更新 `sk-SK` 国际化。[#19787](https://github.com/ant-design/ant-design/pull/19787) [@Kamahl19](https://github.com/Kamahl19)
+- TypeScript
+  - ⚡️ 导出 Tooltip 类型定义。[19846](https://github.com/ant-design/ant-design/pull/19846) [@kachkaev](https://github.com/kachkaev)
+
+## 3.25.2
+
+`2019-11-17`
+
+- 🐞 修复 Upload List 上传错误时没有鼠标悬浮提示的问题。[#19689](https://github.com/ant-design/ant-design/pull/19689) [@qq645381995](https://github.com/qq645381995)
+- 💄 修复 Transfer 输入框内容会与清除按钮重叠的问题。[#19693](https://github.com/ant-design/ant-design/pull/19693) [@Abdullah700](https://github.com/Abdullah700)
+- 🇳🇱 更新 `NL-nl` 国际化。[#19734](https://github.com/ant-design/ant-design/pull/19734) [@hoest](https://github.com/hoest)
+- TypeScript
+  - 🐞 修复 Table FilterDropdownProps 定义。[#19701](https://github.com/ant-design/ant-design/pull/19701) [@DeanVanNiekerk](https://github.com/DeanVanNiekerk)
+  - 🛠 Slider 添加 `reverse` 定义。[#19713](https://github.com/ant-design/ant-design/pull/19713) [@jacklee814](https://github.com/jacklee814)
+  - 🐞 更新 Table `filteredValue` 定义。[#19722](https://github.com/ant-design/ant-design/pull/19722) [@andelf](https://github.com/andelf)
+
 ## 3.25.1

 `2019-11-10`
--- a/README.md
+++ b/README.md
@ -10,7 +10,7 @@

 An enterprise-class UI design language and React UI library.

-[![CircleCI branch](https://img.shields.io/circleci/project/github/ant-design/ant-design/master.svg?style=flat-square)](https://circleci.com/gh/ant-design/ant-design) ![CI Status](https://github.com/ant-design/ant-design/workflows/Node%20CI/badge.svg) [![Codecov](https://img.shields.io/codecov/c/github/ant-design/ant-design/master.svg?style=flat-square)](https://codecov.io/gh/ant-design/ant-design/branch/master) [![](https://flat.badgen.net/npm/v/antd?icon=npm)](https://www.npmjs.com/package/antd) [![](https://badgen.net/npm/v/antd/next)](https://www.npmjs.com/package/antd) [![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](http://npmjs.com/antd)
+[![CircleCI branch](https://img.shields.io/circleci/project/github/ant-design/ant-design/master.svg?style=flat-square)](https://circleci.com/gh/ant-design/ant-design) ![CI Status](https://github.com/ant-design/ant-design/workflows/test/badge.svg) [![Codecov](https://img.shields.io/codecov/c/github/ant-design/ant-design/master.svg?style=flat-square)](https://codecov.io/gh/ant-design/ant-design/branch/master) [![](https://flat.badgen.net/npm/v/antd?icon=npm)](https://www.npmjs.com/package/antd) [![](https://badgen.net/npm/v/antd/next)](https://www.npmjs.com/package/antd) [![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](http://npmjs.com/antd)

 [![Dependencies](https://img.shields.io/david/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design) [![DevDependencies](https://img.shields.io/david/dev/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design?type=dev) [![Total alerts](https://flat.badgen.net/lgtm/alerts/g/ant-design/ant-design)](https://lgtm.com/projects/g/ant-design/ant-design/alerts/) [![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fant-design%2Fant-design.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2Fant-design%2Fant-design?ref=badge_shield) [![Issues need help](https://flat.badgen.net/github/label-issues/ant-design/ant-design/help%20wanted/open)](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22)

--- a/components/auto-complete/index.en-US.md
+++ b/components/auto-complete/index.en-US.md
@ -45,8 +45,8 @@ When there is a need for autocomplete functionality.

 ## FAQ

-### Why text composition system not works well with onSearch in controlled mode?
+### Why doesn't the text composition system work well with onSearch in controlled mode?

-Please use `onChange` to manage control state. `onSearch` is used for searching input which is not same as `onChange`. Besides, click on the option also not trigger the `onSearch` event.
+Please use `onChange` to manage control state. `onSearch` is used for searching input which is not same as `onChange`. Besides, clicking on the option will not trigger the `onSearch` event.

 Related issue: [#18230](https://github.com/ant-design/ant-design/issues/18230) [#17916](https://github.com/ant-design/ant-design/issues/17916)
--- a/components/config-provider/tests/snapshots/components.test.js.snap
+++ b/components/config-provider/tests/snapshots/components.test.js.snap
@ -17923,7 +17923,9 @@ exports[`ConfigProvider components Upload configProvider 1`] = `
  <div
    class="config-upload-list config-upload-list-text"
  >
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="config-upload-list-item config-upload-list-item-done config-upload-list-item-list-type-text"
@ -18035,7 +18037,9 @@ exports[`ConfigProvider components Upload normal 1`] = `
  <div
    class="ant-upload-list ant-upload-list-text"
  >
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"
@ -18147,7 +18151,9 @@ exports[`ConfigProvider components Upload prefixCls 1`] = `
  <div
    class="ant-upload-list ant-upload-list-text"
  >
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"
--- a/components/config-provider/index.en-US.md
+++ b/components/config-provider/index.en-US.md
@ -9,7 +9,7 @@ title: ConfigProvider

 ## Usage

-This component provides a configuration to all React components underneath itself via the [context API](https://facebook.github.io/react/docs/context.html), In the render tree all components will have access to the provided config.
+This component provides a configuration to all React components underneath itself via the [context API](https://facebook.github.io/react/docs/context.html). In the render tree all components will have access to the provided config.

 ```jsx
 import { ConfigProvider } from 'antd';
@ -25,7 +25,7 @@ return (

 ### Content Security Policy

-Some component use dynamic style to support wave effect. You can config `csp` prop if Content Security Policy (CSP) is enabled:
+Some components use dynamic style to support wave effect. You can config `csp` prop if Content Security Policy (CSP) is enabled:

 ```jsx
 <ConfigProvider csp={{ nonce: 'YourNonceCode' }}>
@ -48,6 +48,6 @@ Some component use dynamic style to support wave effect. You can config `csp` pr

 ## FAQ

-#### Locale problem is still existed in DatePicker even ConfigProvider `locale` is used?
+#### Does the locale problem still exist in DatePicker even if ConfigProvider `locale` is used?

-Please make sure you set moment locale by `moment.locale('zh-cn')`, or you don't have two moment of different version.
+Please make sure you set moment locale by `moment.locale('zh-cn')` or that you don't have two different versions of moment.
--- a/components/drawer/demo/form-in-drawer.md
+++ b/components/drawer/demo/form-in-drawer.md
@ -45,6 +45,7 @@ class DrawerForm extends React.Component {
          width={720}
          onClose={this.onClose}
          visible={this.state.visible}
+          bodyStyle={{ paddingBottom: 80 }}
        >
          <Form layout="vertical" hideRequiredMark>
            <Row gutter={16}>
@ -144,7 +145,7 @@ class DrawerForm extends React.Component {
          <div
            style={{
              position: 'absolute',
-              left: 0,
+              right: 0,
              bottom: 0,
              width: '100%',
              borderTop: '1px solid #e9e9e9',
--- a/components/drawer/style/drawer.less
+++ b/components/drawer/style/drawer.less
@ -197,6 +197,10 @@
    line-height: @line-height-base;
    word-wrap: break-word;
  }
+  &-wrapper-body {
+    height: 100%;
+    overflow: auto;
+  }

  &-mask {
    position: absolute;
--- a/components/locale/nl_NL.tsx
+++ b/components/locale/nl_NL.tsx
@ -9,12 +9,18 @@ export default {
  DatePicker,
  TimePicker,
  Calendar,
+  global: {
+    placeholder: 'Maak een selectie',
+  },
  Table: {
    filterTitle: 'Filteren',
    filterConfirm: 'OK',
    filterReset: 'Reset',
    selectAll: 'Selecteer huidige pagina',
    selectInvert: 'Deselecteer huidige pagina',
+    sortTitle: 'Sorteren',
+    expand: 'Rij uitklappen',
+    collapse: 'Rij inklappen',
  },
  Modal: {
    okText: 'OK',
@ -26,6 +32,7 @@ export default {
    cancelText: 'Annuleren',
  },
  Transfer: {
+    titles: ['', ''],
    searchPlaceholder: 'Zoeken',
    itemUnit: 'item',
    itemsUnit: 'items',
@ -40,4 +47,16 @@ export default {
  Empty: {
    description: 'Geen gegevens',
  },
+  Icon: {
+    icon: 'icoon',
+  },
+  Text: {
+    edit: 'Bewerken',
+    copy: 'Kopieren',
+    copied: 'Gekopieerd',
+    expand: 'Uitklappen',
+  },
+  PageHeader: {
+    back: 'Terug',
+  },
 };
--- a/components/locale/sk_SK.tsx
+++ b/components/locale/sk_SK.tsx
@ -9,12 +9,18 @@ export default {
  DatePicker,
  TimePicker,
  Calendar,
+  global: {
+    placeholder: 'Prosím vyberte',
+  },
  Table: {
    filterTitle: 'Filter',
    filterConfirm: 'OK',
    filterReset: 'Obnoviť',
    selectAll: 'Vybrať všetko',
    selectInvert: 'Vybrať opačné',
+    sortTitle: 'Zoradiť',
+    expand: 'Rozbaliť riadok',
+    collapse: 'Zbaliť riadok',
  },
  Modal: {
    okText: 'OK',
@ -26,6 +32,7 @@ export default {
    cancelText: 'Zrušiť',
  },
  Transfer: {
+    titles: ['', ''],
    searchPlaceholder: 'Vyhľadávanie',
    itemUnit: 'položka',
    itemsUnit: 'položiek',
@ -40,4 +47,16 @@ export default {
  Empty: {
    description: 'Žiadne dáta',
  },
+  Icon: {
+    icon: 'ikona',
+  },
+  Text: {
+    edit: 'Upraviť',
+    copy: 'Kopírovať',
+    copied: 'Skopírované',
+    expand: 'Zväčšiť',
+  },
+  PageHeader: {
+    back: 'Späť',
+  },
 };
--- a/components/menu/style/index.less
+++ b/components/menu/style/index.less
@ -74,6 +74,14 @@
    }
  }

+  // https://github.com/ant-design/ant-design/issues/19809
+  &-item > .@{ant-prefix}-badge > a {
+    color: @menu-item-color;
+    &:hover {
+      color: @menu-highlight-color;
+    }
+  }
+
  &-item-divider {
    height: 1px;
    overflow: hidden;
--- a/components/notification/tests/snapshots/demo.test.js.snap
+++ b/components/notification/tests/snapshots/demo.test.js.snap
@ -46,69 +46,40 @@ exports[`renders ./components/notification/demo/duration.md correctly 1`] = `

 exports[`renders ./components/notification/demo/placement.md correctly 1`] = `
 <div>
-  <div
-    class="ant-select ant-select-single ant-select-show-arrow"
-    style="width:120px;margin-right:10px"
-  >
-    <div
-      class="ant-select-selector"
-    >
-      <span
-        class="ant-select-selection-search"
-      >
-        <input
-          aria-activedescendant="undefined_list_0"
-          aria-autocomplete="list"
-          aria-controls="undefined_list"
-          aria-haspopup="listbox"
-          aria-owns="undefined_list"
-          autocomplete="off"
-          class="ant-select-selection-search-input"
-          role="combobox"
-          style="opacity:0"
-          value=""
-        />
-      </span>
-      <span
-        class="ant-select-selection-item"
-      >
-        topRight
-      </span>
-    </div>
-    <span
-      aria-hidden="true"
-      class="ant-select-arrow"
-      style="user-select:none;-webkit-user-select:none"
-      unselectable="on"
-    >
-      <span
-        aria-label="down"
-        class="anticon anticon-down"
-        role="img"
-      >
-        <svg
-          aria-hidden="true"
-          class=""
-          data-icon="down"
-          fill="currentColor"
-          focusable="false"
-          height="1em"
-          viewBox="64 64 896 896"
-          width="1em"
-        >
-          <path
-            d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
-          />
-        </svg>
-      </span>
-    </span>
-  </div>
  <button
    class="ant-btn ant-btn-primary"
    type="button"
  >
    <span>
-      Open the notification box
+      topLeft
+    </span>
+  </button>
+  <button
+    class="ant-btn ant-btn-primary"
+    type="button"
+  >
+    <span>
+      topRight
+    </span>
+  </button>
+  <div
+    class="ant-divider ant-divider-horizontal"
+    role="separator"
+  />
+  <button
+    class="ant-btn ant-btn-primary"
+    type="button"
+  >
+    <span>
+      bottomLeft
+    </span>
+  </button>
+  <button
+    class="ant-btn ant-btn-primary"
+    type="button"
+  >
+    <span>
+      bottomRight
    </span>
  </button>
 </div>
--- a/components/notification/demo/placement.md
+++ b/components/notification/demo/placement.md
@ -7,44 +7,42 @@ title:

 ## zh-CN

-可以设置通知从右上角、右下角、左下角、左上角弹出。
+通知从右上角、右下角、左下角、左上角弹出。

 ## en-US

 A notification box can appear from the `topRight`, `bottomRight`, `bottomLeft` or `topLeft` of the viewport.

 ```jsx
-import { Button, Select, notification } from 'antd';
+import { Button, Icon, notification, Divider } from 'antd';

-const { Option } = Select;
-const options = ['topLeft', 'topRight', 'bottomLeft', 'bottomRight'];
-const openNotification = () => {
-  notification.open({
-    message: 'Notification Title',
+const openNotification = placement => {
+  notification.info({
+    message: `Notification ${placement}`,
    description:
      'This is the content of the notification. This is the content of the notification. This is the content of the notification.',
+    placement,
  });
 };

 ReactDOM.render(
  <div>
-    <Select
-      defaultValue="topRight"
-      style={{ width: 120, marginRight: 10 }}
-      onChange={val => {
-        notification.config({
-          placement: val,
-        });
-      }}
-    >
-      {options.map(val => (
-        <Option key={val} value={val}>
-          {val}
-        </Option>
-      ))}
-    </Select>
-    <Button type="primary" onClick={openNotification}>
-      Open the notification box
+    <Button type="primary" onClick={() => openNotification('topLeft')}>
+      <Icon type="radius-upleft" />
+      topLeft
+    </Button>
+    <Button type="primary" onClick={() => openNotification('topRight')}>
+      <Icon type="radius-upright" />
+      topRight
+    </Button>
+    <Divider />
+    <Button type="primary" onClick={() => openNotification('bottomLeft')}>
+      <Icon type="radius-bottomleft" />
+      bottomLeft
+    </Button>
+    <Button type="primary" onClick={() => openNotification('bottomRight')}>
+      <Icon type="radius-bottomright" />
+      bottomRight
    </Button>
  </div>,
  mountNode,
--- a/components/select/index.en-US.md
+++ b/components/select/index.en-US.md
@ -39,7 +39,7 @@ Select component to select value from options.
 | 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://codesandbox.io/s/4j168r7jw0) | function(triggerNode) | () => document.body |  |
 | labelInValue | whether to embed label in value, turn the format of value from `string` to `{key: string, label: ReactNode}` | boolean | false |  |
 | maxTagCount | Max tag count to show | number | - |  |
-| maxTagTextLength | Max tag count to show | number | - |  |
+| maxTagTextLength | Max tag text length to show | number | - |  |
 | maxTagPlaceholder | Placeholder for not showing tags | ReactNode/function(omittedValues) | - |  |
 | mode | Set mode of Select | 'default' \| 'multiple' \| 'tags' | 'default' |  |
 | notFoundContent | Specify content to show when no result matches.. | string | 'Not Found' |  |
--- a/components/slider/index.tsx
+++ b/components/slider/index.tsx
@ -31,6 +31,7 @@ export interface SliderProps {
  prefixCls?: string;
  tooltipPrefixCls?: string;
  range?: boolean;
+  reverse?: boolean;
  min?: number;
  max?: number;
  step?: number | null;
--- a/components/table/tests/snapshots/demo.test.js.snap
+++ b/components/table/tests/snapshots/demo.test.js.snap
@ -1234,35 +1234,17 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        John Brown
-                      </span>
-                    </span>
+                    John Brown
                  </td>
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        32
-                      </span>
-                    </span>
+                    32
                  </td>
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        New York No. 1 Lake Park
-                      </span>
-                    </span>
+                    New York No. 1 Lake Park
                  </td>
                </tr>
                <tr
@ -1271,35 +1253,17 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        Joe Black
-                      </span>
-                    </span>
+                    Joe Black
                  </td>
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        42
-                      </span>
-                    </span>
+                    42
                  </td>
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        London No. 1 Lake Park
-                      </span>
-                    </span>
+                    London No. 1 Lake Park
                  </td>
                </tr>
                <tr
@ -1308,35 +1272,17 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        Jim Green
-                      </span>
-                    </span>
+                    Jim Green
                  </td>
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        32
-                      </span>
-                    </span>
+                    32
                  </td>
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        Sidney No. 1 Lake Park
-                      </span>
-                    </span>
+                    Sidney No. 1 Lake Park
                  </td>
                </tr>
                <tr
@ -1345,35 +1291,17 @@ exports[`renders ./components/table/demo/custom-filter-panel.md correctly 1`] =
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        Jim Red
-                      </span>
-                    </span>
+                    Jim Red
                  </td>
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        32
-                      </span>
-                    </span>
+                    32
                  </td>
                  <td
                    class="ant-table-cell"
                  >
-                    <span>
-                      <span
-                        class=""
-                      >
-                        London No. 2 Lake Park
-                      </span>
-                    </span>
+                    London No. 2 Lake Park
                  </td>
                </tr>
              </tbody>
--- a/components/table/demo/custom-filter-panel.md
+++ b/components/table/demo/custom-filter-panel.md
@ -48,6 +48,7 @@ const data = [
 class App extends React.Component {
  state = {
    searchText: '',
+    searchedColumn: '',
  };

  getColumnSearchProps = dataIndex => ({
@ -60,12 +61,12 @@ class App extends React.Component {
          placeholder={`Search ${dataIndex}`}
          value={selectedKeys[0]}
          onChange={e => setSelectedKeys(e.target.value ? [e.target.value] : [])}
-          onPressEnter={() => this.handleSearch(selectedKeys, confirm)}
+          onPressEnter={() => this.handleSearch(selectedKeys, confirm, dataIndex)}
          style={{ width: 188, marginBottom: 8, display: 'block' }}
        />
        <Button
          type="primary"
-          onClick={() => this.handleSearch(selectedKeys, confirm)}
+          onClick={() => this.handleSearch(selectedKeys, confirm, dataIndex)}
          icon={<Search />}
          size="small"
          style={{ width: 90, marginRight: 8 }}
@ -88,19 +89,25 @@ class App extends React.Component {
        setTimeout(() => this.searchInput.select());
      }
    },
-    render: text => (
-      <Highlighter
-        highlightStyle={{ backgroundColor: '#ffc069', padding: 0 }}
-        searchWords={[this.state.searchText]}
-        autoEscape
-        textToHighlight={text.toString()}
-      />
-    ),
+    render: text =>
+      this.state.searchedColumn === dataIndex ? (
+        <Highlighter
+          highlightStyle={{ backgroundColor: '#ffc069', padding: 0 }}
+          searchWords={[this.state.searchText]}
+          autoEscape
+          textToHighlight={text.toString()}
+        />
+      ) : (
+        text
+      ),
  });

-  handleSearch = (selectedKeys, confirm) => {
+  handleSearch = (selectedKeys, confirm, dataIndex) => {
    confirm();
-    this.setState({ searchText: selectedKeys[0] });
+    this.setState({
+      searchText: selectedKeys[0],
+      searchedColumn: dataIndex,
+    });
  };

  handleReset = clearFilters => {
--- a/components/table/index.en-US.md
+++ b/components/table/index.en-US.md
@ -61,7 +61,7 @@ const columns = [
 | --- | --- | --- | --- |
 | tableLayout | [table-layout](https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout) attribute of table element | - \| 'auto' \| 'fixed' | -<hr />`fixed` when header/columns are fixed, or using `column.ellipsis` |
 | bordered | Whether to show all table borders | boolean | `false` |
-| columns | Columns of table | [ColumnProps](https://git.io/vMMXC)\[] | - |
+| columns | Columns of table | [ColumnProps](#Column)\[] | - |
 | components | Override default table elements | [TableComponents](https://git.io/fANxz) | - |
 | dataSource | Data record array to be displayed | any\[] | - |
 | expandable | Config expandable content | [expandable](#expandable) | - |
--- a/components/table/index.zh-CN.md
+++ b/components/table/index.zh-CN.md
@ -66,7 +66,7 @@ const columns = [
 | --- | --- | --- | --- |
 | tableLayout | 表格元素的 [table-layout](https://developer.mozilla.org/zh-CN/docs/Web/CSS/table-layout) 属性，设为 `fixed` 表示内容不会影响列的布局 | - \| 'auto' \| 'fixed' | 无<hr />固定表头/列或使用了 `column.ellipsis` 时，默认值为 `fixed` |
 | bordered | 是否展示外边框和列边框 | boolean | false |
-| columns | 表格列的配置描述，具体项见下表 | [ColumnProps](https://git.io/vMMXC)\[] | - |
+| columns | 表格列的配置描述，具体项见下表 | [ColumnProps](#Column)\[] | - |
 | components | 覆盖默认的 table 元素 | [TableComponents](https://git.io/fANxz) | - |
 | dataSource | 数据数组 | any\[] | - |
 | expandable | 配置展开属性 | [expandable](#expandable) | - |
--- a/components/table/interface.tsx
+++ b/components/table/interface.tsx
@ -1,8 +1,4 @@
-import {
-  GetRowKey,
-  ColumnType as RcColumnType,
-  ExpandableConfig,
-} from 'rc-table/lib/interface';
+import { GetRowKey, ColumnType as RcColumnType, ExpandableConfig } from 'rc-table/lib/interface';
 import { CheckboxProps } from '../checkbox';
 import { PaginationConfig } from '../pagination';

@ -60,7 +56,7 @@ export interface FilterDropdownProps {
  setSelectedKeys: (selectedKeys: string[]) => void;
  selectedKeys: React.Key[];
  confirm: () => void;
-  clearFilters: (selectedKeys: string[]) => void;
+  clearFilters?: () => void;
  filters?: ColumnFilterItem[];
  visible: boolean;
 }
@ -86,7 +82,7 @@ export interface ColumnType<RecordType> extends RcColumnType<RecordType> {
  filters?: ColumnFilterItem[];
  filterDropdown?: React.ReactNode | ((props: FilterDropdownProps) => React.ReactNode);
  filterMultiple?: boolean;
-  filteredValue?: Key[];
+  filteredValue?: Key[] | null;
  filterIcon?: React.ReactNode | ((filtered: boolean) => React.ReactNode);
  onFilter?: (value: any, record: RecordType) => boolean;
  filterDropdownVisible?: boolean;
@ -94,7 +90,7 @@ export interface ColumnType<RecordType> extends RcColumnType<RecordType> {
 }

 export interface ColumnGroupType<RecordType> extends ColumnType<RecordType> {
-  children: ColumnsType<RecordType>
+  children: ColumnsType<RecordType>;
 }

 export type ColumnsType<RecordType = unknown> = (
--- a/components/time-picker/style/index.less
+++ b/components/time-picker/style/index.less
@ -124,6 +124,10 @@
        background: transparent;
        cursor: not-allowed;
      }
+      &:focus {
+        color: @btn-disable-color;
+        font-weight: inherit;
+      }
    }
  }

--- a/components/tooltip/index.tsx
+++ b/components/tooltip/index.tsx
@ -65,12 +65,12 @@ export interface AbstractTooltipProps {

 export type RenderFunction = () => React.ReactNode;

-interface TooltipPropsWithOverlay extends AbstractTooltipProps {
+export interface TooltipPropsWithOverlay extends AbstractTooltipProps {
  title?: React.ReactNode | RenderFunction;
  overlay: React.ReactNode | RenderFunction;
 }

-interface TooltipPropsWithTitle extends AbstractTooltipProps {
+export interface TooltipPropsWithTitle extends AbstractTooltipProps {
  title: React.ReactNode | RenderFunction;
  overlay?: React.ReactNode | RenderFunction;
 }
--- a/components/upload/UploadList.tsx
+++ b/components/upload/UploadList.tsx
@ -248,9 +248,11 @@ export default class UploadList extends React.Component<UploadListProps, any> {
          </div>
        </div>
      );
-
+      const listContainerNameClass = classNames({
+        [`${prefixCls}-list-picture-card-container`]: listType === 'picture-card',
+      });
      return (
-        <div key={file.uid}>
+        <div key={file.uid} className={listContainerNameClass}>
          {file.status === 'error' ? <Tooltip title={message}>{dom}</Tooltip> : <span>{dom}</span>}
        </div>
      );
--- a/components/upload/tests/snapshots/demo.test.js.snap
+++ b/components/upload/tests/snapshots/demo.test.js.snap
@ -33,7 +33,9 @@ exports[`renders ./components/upload/demo/defaultFileList.md correctly 1`] = `
  <div
    class="ant-upload-list ant-upload-list-text"
  >
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"
@ -134,7 +136,9 @@ exports[`renders ./components/upload/demo/defaultFileList.md correctly 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"
@ -235,7 +239,9 @@ exports[`renders ./components/upload/demo/defaultFileList.md correctly 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <div
        class="ant-upload-list-item ant-upload-list-item-error ant-upload-list-item-list-type-text"
      >
@ -348,7 +354,9 @@ exports[`renders ./components/upload/demo/fileList.md correctly 1`] = `
  <div
    class="ant-upload-list ant-upload-list-text"
  >
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"
@ -463,7 +471,9 @@ exports[`renders ./components/upload/demo/picture-card.md correctly 1`] = `
    <div
      class="ant-upload-list ant-upload-list-picture-card"
    >
-      <div>
+      <div
+        class="ant-upload-list-picture-card-container"
+      >
        <span>
          <div
            class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture-card"
@ -575,7 +585,9 @@ exports[`renders ./components/upload/demo/picture-card.md correctly 1`] = `
          </div>
        </span>
      </div>
-      <div>
+      <div
+        class="ant-upload-list-picture-card-container"
+      >
        <span>
          <div
            class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture-card"
@ -687,7 +699,9 @@ exports[`renders ./components/upload/demo/picture-card.md correctly 1`] = `
          </div>
        </span>
      </div>
-      <div>
+      <div
+        class="ant-upload-list-picture-card-container"
+      >
        <span>
          <div
            class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture-card"
@ -799,7 +813,9 @@ exports[`renders ./components/upload/demo/picture-card.md correctly 1`] = `
          </div>
        </span>
      </div>
-      <div>
+      <div
+        class="ant-upload-list-picture-card-container"
+      >
        <span>
          <div
            class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture-card"
@ -911,7 +927,9 @@ exports[`renders ./components/upload/demo/picture-card.md correctly 1`] = `
          </div>
        </span>
      </div>
-      <div>
+      <div
+        class="ant-upload-list-picture-card-container"
+      >
        <div
          class="ant-upload-list-item ant-upload-list-item-error ant-upload-list-item-list-type-picture-card"
        >
@ -1040,7 +1058,9 @@ exports[`renders ./components/upload/demo/picture-style.md correctly 1`] = `
    <div
      class="ant-upload-list ant-upload-list-picture"
    >
-      <div>
+      <div
+        class=""
+      >
        <span>
          <div
            class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -1133,7 +1153,9 @@ exports[`renders ./components/upload/demo/picture-style.md correctly 1`] = `
          </div>
        </span>
      </div>
-      <div>
+      <div
+        class=""
+      >
        <div
          class="ant-upload-list-item ant-upload-list-item-error ant-upload-list-item-list-type-picture"
        >
@ -1233,7 +1255,9 @@ exports[`renders ./components/upload/demo/picture-style.md correctly 1`] = `
    <div
      class="ant-upload-list ant-upload-list-picture"
    >
-      <div>
+      <div
+        class=""
+      >
        <span>
          <div
            class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -1326,7 +1350,9 @@ exports[`renders ./components/upload/demo/picture-style.md correctly 1`] = `
          </div>
        </span>
      </div>
-      <div>
+      <div
+        class=""
+      >
        <div
          class="ant-upload-list-item ant-upload-list-item-error ant-upload-list-item-list-type-picture"
        >
--- a/components/upload/tests/snapshots/uploadlist.test.js.snap
+++ b/components/upload/tests/snapshots/uploadlist.test.js.snap
@ -410,7 +410,9 @@ exports[`Upload List should non-image format file preview 1`] = `
  <div
    class="ant-upload-list ant-upload-list-picture"
  >
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -523,7 +525,9 @@ exports[`Upload List should non-image format file preview 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -616,7 +620,9 @@ exports[`Upload List should non-image format file preview 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -729,7 +735,9 @@ exports[`Upload List should non-image format file preview 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -842,7 +850,9 @@ exports[`Upload List should non-image format file preview 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -935,7 +945,9 @@ exports[`Upload List should non-image format file preview 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -1028,7 +1040,9 @@ exports[`Upload List should non-image format file preview 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -1121,7 +1135,9 @@ exports[`Upload List should non-image format file preview 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -1214,7 +1230,9 @@ exports[`Upload List should non-image format file preview 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -1307,7 +1325,9 @@ exports[`Upload List should non-image format file preview 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@ -1431,7 +1451,9 @@ exports[`Upload List should support showRemoveIcon and showPreviewIcon 1`] = `
  <div
    class="ant-upload-list ant-upload-list-picture"
  >
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-uploading ant-upload-list-item-list-type-picture"
@ -1474,7 +1496,9 @@ exports[`Upload List should support showRemoveIcon and showPreviewIcon 1`] = `
        </div>
      </span>
    </div>
-    <div>
+    <div
+      class=""
+    >
      <span>
        <div
          class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
--- a/components/upload/style/index.less
+++ b/components/upload/style/index.less
@ -360,6 +360,12 @@
    &.@{upload-prefix-cls}-list::after {
      display: none;
    }
+    &-container {
+      float: left;
+      width: @upload-picture-card-size;
+      height: @upload-picture-card-size;
+      margin: 0 8px 8px 0;
+    }
    .@{upload-item} {
      float: left;
      width: @upload-picture-card-size;
--- a/docs/react/recommendation.en-US.md
+++ b/docs/react/recommendation.en-US.md
@ -7,7 +7,7 @@ title: Third-Party Libraries

 | Category | Recommended Components |
 | --- | --- |
-| Visualization and charts | [🔥 AntV 数据可视化解决方案](https://antv.alipay.com) [BizCharts](https://github.com/alibaba/BizCharts) [recharts](https://github.com/recharts/recharts/) [viser](https://viserjs.github.io/) |
+| Visualization and charts | [AntV Data Visualization](https://antv.vision/en) [🔥 AntV Charting Library](https://g2plot.antv.vision/en) [BizCharts](https://github.com/alibaba/BizCharts) [recharts](https://github.com/recharts/recharts/) [viser](https://viserjs.github.io/) |
 | Router | [react-router](https://github.com/ReactTraining/react-router) |
 | Layout | [@rebass/grid](https://github.com/rebassjs/grid) [react-blocks](http://whoisandy.github.io/react-blocks/) [react-flexbox-grid](https://github.com/roylee0704/react-flexbox-grid) |
 | Drag and drop | [react-beautiful-dnd](https://github.com/atlassian/react-beautiful-dnd/) [react-dnd](https://github.com/gaearon/react-dnd) [react-sortable-hoc](https://github.com/clauderic/react-sortable-hoc) |
@ -40,14 +40,14 @@ title: Third-Party Libraries

 There are some products to recommend for developer/designer/product manager.

-| Category | Recommended Products |
-| --- | --- |
-| Documentation | [🐦 Yuque](https://www.yuque.com/?chInfo=ch_antd) |
-| Icon | [Iconfont](https://www.iconfont.cn/) |
-| Sketch plugin | [Kitchen](https://kitchen.alipay.com) |
+| Category          | Recommended Products                                                  |
+| ----------------- | --------------------------------------------------------------------- |
+| Documentation     | [🐦 Yuque](https://www.yuque.com/?chInfo=ch_antd)                     |
+| Icon              | [Iconfont](https://www.iconfont.cn/)                                  |
+| Sketch plugin     | [Kitchen](https://kitchen.alipay.com)                                 |
 | Online Playground | [codesandbox](https://codesandbox.io/) [codepen](https://codepen.io/) |
-| Image Compressor | [tinypng](https://tinypng.com/) |
-| Charts Dictionary | [G2](https://antv.alipay.com/zh-cn/g2/3.x/demo/index.html) [图之典](http://tuzhidian.com/) |
+| Image Compressor  | [tinypng](https://tinypng.com/)                                       |
+| Charts Dictionary | [图之典](http://tuzhidian.com/)                                       |

 <style>
 .markdown table td:first-child {
--- a/docs/react/recommendation.zh-CN.md
+++ b/docs/react/recommendation.zh-CN.md
@ -7,7 +7,7 @@ title: 社区精选组件

 | 类型 | 推荐组件 |
 | --- | --- |
-| 可视化图表 | [🔥 AntV 数据可视化解决方案](https://antv.alipay.com) [BizCharts](https://github.com/alibaba/BizCharts) [recharts](https://github.com/recharts/recharts/) [viser](https://viserjs.github.io/) |
+| 可视化图表 | [AntV 数据可视化解决方案](https://antv.vision/zh) [🔥 AntV 图表库](https://g2plot.antv.vision/zh) [BizCharts](https://github.com/alibaba/BizCharts) [recharts](https://github.com/recharts/recharts/) [viser](https://viserjs.github.io/) |
 | 路由 | [react-router](https://github.com/ReactTraining/react-router) |
 | 布局 | [@rebass/grid](https://github.com/rebassjs/grid) [react-blocks](https://github.com/whoisandy/react-blocks) [react-flexbox-grid](https://github.com/roylee0704/react-flexbox-grid) |
 | 拖拽 | [react-beautiful-dnd](https://github.com/atlassian/react-beautiful-dnd/) [react-dnd](https://github.com/gaearon/react-dnd) [react-sortable-hoc](https://github.com/clauderic/react-sortable-hoc) |
@ -40,14 +40,14 @@ title: 社区精选组件

 还有一些常用的前端/设计/产品相关的工具推荐给大家使用。

-| 类型 | 推荐产品 |
-| --- | --- |
-| 文档管理 | [🐦 语雀](https://www.yuque.com/?chInfo=ch_antd) |
-| 图标 | [阿里巴巴矢量图标库](https://www.iconfont.cn/) |
-| Sketch 插件 | [Kitchen](https://kitchen.alipay.com) |
+| 类型         | 推荐产品                                                              |
+| ------------ | --------------------------------------------------------------------- |
+| 文档管理     | [🐦 语雀](https://www.yuque.com/?chInfo=ch_antd)                      |
+| 图标         | [阿里巴巴矢量图标库](https://www.iconfont.cn/)                        |
+| Sketch 插件  | [Kitchen](https://kitchen.alipay.com)                                 |
 | 在线代码编辑 | [codesandbox](https://codesandbox.io/) [codepen](https://codepen.io/) |
-| 图片压缩 | [tinypng](https://tinypng.com/) |
-| 图表分类查询 | [G2](https://antv.alipay.com/zh-cn/g2/3.x/demo/index.html) [图之典](http://tuzhidian.com/) |
+| 图片压缩     | [tinypng](https://tinypng.com/)                                       |
+| 图表分类查询 | [图之典](http://tuzhidian.com/)                                       |

 <style>
 .markdown table td:first-child {
--- a/docs/spec/visual.en-US.md
+++ b/docs/spec/visual.en-US.md
@ -11,16 +11,16 @@ At the same time, this is a dynamically updated design document, your reading an

 We provide comprehensive design principles & guidelines and design resource files (Sketch), as well as a complete graphical usage note to help users quickly understand charts and design high quality visualization charts.

- [Design Principles](https://antv.alipay.com/zh-cn/vis/design/color.html)
- [Design Resources](https://antv.alipay.com/en-us/vis/resource/index.html)
- [chart usage](https://antv.alipay.com/zh-cn/vis/chart/index.html)
+- [Design Principles](https://antv.vision/zh/docs/specification/principles/basic)
+- [Design Resources](https://antv.vision/zh/docs/specification/resources)
+- [Charts Usage](https://antv-2018.alipay.com/zh-cn/vis/chart/index.html)

 ## Front end implementation

-We encapsulate a set of AntV component libraries based on native JavaScript, which includes a high-interaction base chart library G2, a chart library G6 focusing on process and relationship analysis, a chart library F2 for mobile applications, and other frameworks in the community. Implementation version.
+We encapsulate a set of AntV component libraries based on native JavaScript, which includes a high-interaction base chart library G2Plot, a chart library G6 focusing on process and relationship analysis, a chart library F2 for mobile applications, and other frameworks in the community. Implementation version.

- [G2 (official implementation)](https://antv.alipay.com/zh-cn/g2/3.x/index.html)
- [G6 (official implementation)](https://antv.alipay.com/zh-cn/g6/1.x/index.html)
- [F2 (official implementation)](https://antv.alipay.com/zh-cn/f2/3.x/index.html)
- [BizCharts (React)](https://alibaba.github.io/BizCharts/)
- [Viser (React / Vue / Angular)](https://viserjs.github.io/)
+- [G2: Grammar of Graphics](https://g2.antv.vision/en)
+- [G2Plot: a charting library](https://g2plot.antv.vision/en) 🔥
+- [G6: Graph Visualization Framework](https://g6.antv.vision/en)
+- [F2: Mobile Charts](https://f2.antv.vision/en)
+- [L7: Geospatial Visualization Analysis](https://l7.antv.vision/en)
--- a/docs/spec/visual.zh-CN.md
+++ b/docs/spec/visual.zh-CN.md
@ -11,16 +11,16 @@ title: 可视化

 我们提供完善的设计原则 & 指引和设计资源文件（Sketch），此外还提供了一份完整的图表用法说明，来帮助用户快速理解图表并设计出高质量的可视化图表。

- [设计原则](https://antv.alipay.com/zh-cn/vis/design/color.html)
- [设计资源](https://antv.alipay.com/zh-cn/vis/resource/index.html)
- [图表用法](https://antv.alipay.com/zh-cn/vis/chart/index.html)
+- [设计原则](https://antv.vision/zh/docs/specification/principles/basic)
+- [设计资源](https://antv.vision/zh/docs/specification/resources)
+- [图表用法](https://antv-2018.alipay.com/zh-cn/vis/chart/index.html)

 ## 前端实现

-我们基于原生 JavaScipt 封装了一套 AntV 的组件库，其包含高交互基础图表库 G2，专注解决流程与关系分析的图表库 G6，适于移动端应用的图表库 F2 等，也欢迎社区其他框架的实现版本。
+我们基于原生 JavaScipt 封装了一套 AntV 的组件库，其包含高交互基础图表库 G2Plot，专注解决流程与关系分析的图表库 G6，适于移动端应用的图表库 F2 等，也欢迎社区其他框架的实现版本。

- [G2（官方实现）](https://antv.alipay.com/zh-cn/g2/3.x/index.html)
- [G6（官方实现）](https://antv.alipay.com/zh-cn/g6/1.x/index.html)
- [F2（官方实现）](https://antv.alipay.com/zh-cn/f2/3.x/index.html)
- [BizCharts (React)](https://alibaba.github.io/BizCharts/)
- [Viser (React / Vue / Angular)](https://viserjs.github.io/)
+- [G2 可视化引擎](https://g2.antv.vision/zh)
+- [G2Plot 开箱即用的图表库](https://g2plot.antv.vision/zh) 🔥
+- [G6 图可视化引擎](https://g6.antv.vision/zh)
+- [F2 移动端可视化方案](https://f2.antv.vision/zh)
+- [L7 地理空间数据可视分析引擎](https://l7.antv.vision/zh)
--- a/package.json
+++ b/package.json
@ -42,10 +42,11 @@
  "scripts": {
    "api-collection": "antd-tools run api-collection",
    "authors": "git log --format='%aN <%aE>' | sort -u | grep -v 'users.noreply.github.com' | grep -v 'gitter.im' | grep -v '.local>' | grep -v 'alibaba-inc.com' | grep -v 'alipay.com' | grep -v 'taobao.com' > AUTHORS.txt",
+    "build": "npm run compile && npm run dist",
    "bundlesize": "bundlesize",
    "check-commit": "node ./scripts/check-commit.js",
    "compile": "antd-tools run compile",
-    "predeploy": "antd-tools run clean && npm run site && cp netlify.toml CNAME _site && cp .circleci/config.yml _site && npm run site:test",
+    "predeploy": "antd-tools run clean && npm run site && cp netlify.toml CNAME _site && cp -r .circleci/ _site && npm run site:test",
    "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",
    "dist": "antd-tools run dist",
@ -128,7 +129,7 @@
    "rc-steps": "~3.5.0",
    "rc-switch": "~1.9.0",
    "rc-table": "~7.0.0-alpha.20",
-    "rc-tabs": "~9.6.4",
+    "rc-tabs": "~9.7.0",
    "rc-time-picker": "~4.0.0-alpha.2",
    "rc-tooltip": "~3.7.3",
    "rc-tree": "~3.0.0-alpha.37",
@ -149,8 +150,10 @@
    "@ant-design/tools": "^8.0.4",
    "@packtracker/webpack-plugin": "^2.0.1",
    "@sentry/browser": "^5.4.0",
+    "@stackblitz/sdk": "^1.3.0",
    "@types/classnames": "^2.2.8",
    "@types/gtag.js": "^0.0.3",
+    "@types/jest": "^24.0.23",
    "@types/lodash": "^4.14.139",
    "@types/prop-types": "^15.7.1",
    "@types/raf": "^3.4.0",
@ -159,7 +162,7 @@
    "@types/shallowequal": "^1.1.1",
    "@types/warning": "^3.0.0",
    "@typescript-eslint/eslint-plugin": "^2.0.0",
-    "@typescript-eslint/parser": "~2.7.0",
+    "@typescript-eslint/parser": "~2.8.0",
    "antd-theme-generator": "^1.1.6",
    "babel-eslint": "^10.0.1",
    "babel-plugin-add-react-displayname": "^0.0.5",
@ -235,7 +238,7 @@
    "rimraf": "^3.0.0",
    "scrollama": "^2.0.0",
    "simple-git": "^1.113.0",
-    "stylelint": "^11.0.0",
+    "stylelint": "^12.0.0",
    "stylelint-config-prettier": "^6.0.0",
    "stylelint-config-rational-order": "^0.1.2",
    "stylelint-config-standard": "^19.0.0",
--- a/site/theme/en-US.js
+++ b/site/theme/en-US.js
@ -24,6 +24,7 @@ module.exports = {
    'app.demo.code.hide': 'Hide code',
    'app.demo.codepen': 'Open in CodePen',
    'app.demo.codesandbox': 'Open in CodeSandbox',
+    'app.demo.stackblitz': 'Open in Stackblitz',
    'app.demo.riddle': 'Open in Riddle',
    'app.home.slogan': "The world's second most popular React UI framework",
    'app.home.introduce':
@ -49,6 +50,7 @@ module.exports = {
    'app.home.getting-started': 'Getting Started',
    'app.home.recommend': 'Recommend',
    'app.home.recommend.yuque': 'Yuque, our favorite documentation tool',
+    'app.home.recommend.antv': 'AntV: brand new data visualization solution',
    'app.home.more': 'Learn more',
    'app.home.more-mobile-react': 'Ant Design Mobile of React',
    'app.home.more-mobile-angular': 'Ant Design Mobile of Angular',
--- a/site/theme/static/demo.less
+++ b/site/theme/static/demo.less
@ -198,6 +198,16 @@
    }
  }

+  &-code-action {
+    width: 20px;
+    height: 20px;
+    color: @site-text-color-secondary;
+    font-size: 16px;
+    line-height: 18px;
+    cursor: pointer;
+    transition: all 0.24s;
+  }
+
  &-code-copy {
    width: 20px;
    height: 20px;
--- a/site/theme/template/Content/Demo/index.jsx
+++ b/site/theme/template/Content/Demo/index.jsx
@ -6,8 +6,8 @@ import CopyToClipboard from 'react-copy-to-clipboard';
 import classNames from 'classnames';
 import LZString from 'lz-string';
 import { Tooltip } from 'antd';
-import { Snippets, Check } from '@ant-design/icons';
-
+import { Snippets, Check, Thunderbolt } from '@ant-design/icons';
+import stackblitzSdk from '@stackblitz/sdk';
 import CodePreview from './CodePreview';
 import EditButton from '../EditButton';
 import ErrorBoundary from '../ErrorBoundary';
@ -194,30 +194,34 @@ class Demo extends React.Component {
      },
      { react: 'latest', 'react-dom': 'latest', antd: 'latest' },
    );
-    const codesanboxPrefillConfig = {
-      files: {
-        'package.json': {
-          content: {
-            dependencies,
-          },
-        },
-        'index.css': {
-          content: (style || '').replace(new RegExp(`#${meta.id}\\s*`, 'g'), ''),
-        },
-        'index.js': {
-          content: `
+    const indexJsContent = `
 import React from 'react';
 import ReactDOM from 'react-dom';
 import 'antd/dist/antd.css';
 import './index.css';
 ${sourceCode.replace('mountNode', "document.getElementById('container')")}
-          `,
-        },
+          `;
+    const indexCssContent = (style || '').replace(new RegExp(`#${meta.id}\\s*`, 'g'), '');
+    const codesanboxPrefillConfig = {
+      files: {
+        'package.json': { content: { dependencies } },
+        'index.css': { content: indexCssContent },
+        'index.js': { content: indexJsContent },
        'index.html': {
          content: html,
        },
      },
    };
+    const stackblitzPrefillConfig = {
+      title: `${localizedTitle} - Ant Design Demo`,
+      template: 'create-react-app',
+      dependencies,
+      files: {
+        'index.css': indexCssContent,
+        'index.js': indexJsContent,
+        'index.html': html,
+      },
+    };
    return (
      <section className={codeBoxClass} id={meta.id}>
        <section className="code-box-demo">
@ -289,6 +293,17 @@ ${sourceCode.replace('mountNode', "document.getElementById('container')")}
                />
              </Tooltip>
            </form>
+            <Tooltip title={<FormattedMessage id="app.demo.stackblitz" />}>
+              <span
+                className="code-box-code-action"
+                onClick={() => {
+                  this.track({ type: 'stackblitz', demo: meta.id });
+                  stackblitzSdk.openProject(stackblitzPrefillConfig);
+                }}
+              >
+                <Thunderbolt />
+              </span>
+            </Tooltip>
            <CopyToClipboard text={sourceCode} onCopy={() => this.handleCodeCopied(meta.id)}>
              <Tooltip
                visible={copyTooltipVisible}
--- a/site/theme/template/Home/Banner.jsx
+++ b/site/theme/template/Home/Banner.jsx
@ -23,10 +23,22 @@ const Banner = ({ isMobile }) => {
    <div className="home-page-wrapper banner-wrapper" id="banner">
      <div className="banner-bg-wrapper">
        <svg width="400px" height="576px" viewBox="0 0 400 576" fill="none">
-          <TweenOne component="g" animation={[{ opacity: 0, type: 'from' }, { ...loop, y: 15 }]}>
+          <TweenOne
+            component="g"
+            animation={[
+              { opacity: 0, type: 'from' },
+              { ...loop, y: 15 },
+            ]}
+          >
            <ellipse cx="100" cy="100" rx="6" ry="6" stroke="#2F54EB" strokeWidth="1.6" />
          </TweenOne>
-          <TweenOne component="g" animation={[{ opacity: 0, type: 'from' }, { ...loop, y: -15 }]}>
+          <TweenOne
+            component="g"
+            animation={[
+              { opacity: 0, type: 'from' },
+              { ...loop, y: -15 },
+            ]}
+          >
            <g transform="translate(200 450)">
              <g style={{ transformOrigin: '50% 50%', transform: 'rotate(-340deg)' }}>
                <rect stroke="#FADB14" strokeWidth="1.6" width="9" height="9" />
@ -86,23 +98,20 @@ const Banner = ({ isMobile }) => {
              <FormattedMessage id="app.home.recommend" />
            </Divider>
            <a
-              href="https://www.yuque.com/?chInfo=ch_antd"
+              href={`https://antv.vision/${isZhCN ? 'zh' : 'en'}?from=antd`}
              target="_blank"
              rel="noopener noreferrer"
              onClick={() => {
                if (window.gtag) {
                  window.gtag('event', '点击', {
                    event_category: '首页推广',
-                    event_label: 'https://www.yuque.com/?chInfo=ch_antd',
+                    event_label: `https://antv.vision/${isZhCN ? 'zh' : 'en'}?from=antd`,
                  });
                }
              }}
            >
-              <img
-                src="https://gw.alipayobjects.com/zos/rmsportal/XuVpGqBFxXplzvLjJBZB.svg"
-                alt="yuque logo"
-              />
-              <FormattedMessage id="app.home.recommend.yuque" />
+              <img src="https://antv.vision/icons/icon-512x512.png" alt="AntV logo" />
+              <FormattedMessage id="app.home.recommend.antv" />
              <Right style={{ marginLeft: 6, fontSize: 12, opacity: 0.6 }} />
            </a>
          </div>
--- a/site/theme/template/Home/Page2.jsx
+++ b/site/theme/template/Home/Page2.jsx
@ -30,7 +30,7 @@ const page2Data = [
    img: 'https://gw.alipayobjects.com/zos/rmsportal/slVtnOCcgeAcLEPwtewY.svg',
    name: 'AntV',
    slogan: <FormattedMessage id="app.home.product-antv-slogan" />,
-    link: 'https://antv.alipay.com/zh-cn/index.html',
+    link: 'https://antv.vision',
  },
  {
    img: 'https://gw.alipayobjects.com/zos/rmsportal/EAHlyTmYeDtTkZIPbUnP.svg',
--- a/site/theme/template/Layout/Footer.jsx
+++ b/site/theme/template/Layout/Footer.jsx
@ -266,7 +266,7 @@ class Footer extends React.Component {
              />
            ),
            title: 'AntV',
-            url: 'https://antv.alipay.com',
+            url: 'https://antv.vision',
            description: <FormattedMessage id="app.footer.antv.slogan" />,
            openExternal: true,
          },
--- a/site/theme/zh-CN.js
+++ b/site/theme/zh-CN.js
@ -24,6 +24,7 @@ module.exports = {
    'app.demo.code.hide': '收起代码',
    'app.demo.codepen': '在 CodePen 中打开',
    'app.demo.codesandbox': '在 CodeSandbox 中打开',
+    'app.demo.stackblitz': '在 Stackblitz 中打开',
    'app.demo.riddle': '在 Riddle 中打开',
    'app.home.slogan': '一个 UI 设计语言',
    'app.home.introduce':
@ -46,6 +47,7 @@ module.exports = {
    'app.home.getting-started': '开始使用',
    'app.home.recommend': '推荐',
    'app.home.recommend.yuque': '语雀，我们都喜欢的文档工具',
+    'app.home.recommend.antv': 'AntV：全新的蚂蚁金服数据可视化解决方案',
    'app.home.more': '查看更多',
    'app.home.more-mobile-react': 'Ant Design Mobile of React',
    'app.home.more-mobile-angular': 'Ant Design Mobile of Angular',
--- a/tsconfig.json
+++ b/tsconfig.json
@ -14,7 +14,8 @@
    "noUnusedLocals": true,
    "noImplicitAny": true,
    "target": "es6",
-    "lib": ["dom", "es2017"]
+    "lib": ["dom", "es2017"],
+    "skipLibCheck": true
  },
  "exclude": ["node_modules", "lib", "es"]
 }
--- a/webpack.config.js
+++ b/webpack.config.js
@ -36,15 +36,18 @@ if (process.env.RUN_ENV === 'PRODUCTION') {
    ignoreMomentLocale(config);
    externalMoment(config);
    addLocales(config);
-    // https://docs.packtracker.io/uploading-your-webpack-stats/webpack-plugin
-    config.plugins.push(
-      new PacktrackerPlugin({
-        project_token: '8adbb892-ee4a-4d6f-93bb-a03219fb6778',
-        upload: process.env.CI === 'true',
-        fail_build: true,
-        exclude_assets: name => !['antd.min.js', 'antd.min.css'].includes(name),
-      }),
-    );
+    // skip codesandbox ci
+    if (!process.env.CSB_REPO) {
+      // https://docs.packtracker.io/uploading-your-webpack-stats/webpack-plugin
+      config.plugins.push(
+        new PacktrackerPlugin({
+          project_token: '8adbb892-ee4a-4d6f-93bb-a03219fb6778',
+          upload: process.env.CI === 'true',
+          fail_build: true,
+          exclude_assets: name => !['antd.min.js', 'antd.min.css'].includes(name),
+        }),
+      );
+    }
  });
 }