Fix ts error temporarily, DefinitelyTyped/DefinitelyTyped#25342

3.4.4
Fix upload onChange arg type when beforeUpload return false, close #10293
2026-02-09 10:59:19 +08:00 · 2018-04-28 15:02:25 +08:00 · 2018-04-28 14:32:20 +08:00 · 2018-04-28 14:17:29 +08:00 · 2018-04-28 14:17:01 +08:00 · 2018-04-23 17:23:35 +08:00
358 changed files with 18690 additions and 4746 deletions
--- a/.babelrc
+++ b/.babelrc
@@ -1,10 +0,0 @@
-{
-  "env": {
-    "test": {
-      "presets": ["es2015", "react", "stage-0"],
-      "plugins": [
-        "add-module-exports"
-      ]
-    }
-  }
-}
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -61,8 +61,10 @@ if (process.env.RUN_ENV === 'DEMO') {
    'no-console': 0,
    'no-plusplus': 0,
    'eol-last': 0,
+    'no-script-url': 0,
    'prefer-rest-params': 0,
    'react/no-multi-comp': 0,
+    'react/prefer-stateless-function': 0,
    'jsx-a11y/href-no-hash': 0,
    'import/newline-after-import': 0,
  });
--- a/.github/CONTRIBUTING.md
+++ b/.github/CONTRIBUTING.md
@@ -1,66 +1,13 @@
 # Contributing to Ant Design

-[中文版](./CONTRIBUTING.zh-CN.md)
+Want to contribute to Ant Design? There are a few things you need to know.

-The following is a set of guidelines for contributing to Ant Design. Please spend several minutes in reading these guidelines before you create an issue or pull request.
+We wrote a **[contribution guide](https://ant.design/docs/react/contributing)** to help you get started.

-## Code of Conduct
+---

-We have adopted a [Code of Conduct](../CODE_OF_CONDUCT.md) that we expect project participants to adhere to. Please read the full text so that you can understand what actions will and will not be tolerated.
+# 参与共建

-## Open Development
+想要给 Ant Design 贡献自己的一份力量？

-All work on Ant Design happens directly on [GitHub](https://github.com/ant-design). Both core team members and external contributors send pull requests which go through the same review process.
-
-## Branch Organization
-
-According to our [release schedule](../CHANGELOG.md#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.
-
-## 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).
-
-## Proposing a Change
-
-If you intend to change the public API or introduce new feature, we also recommend use our [issue helper](http://new-issue.ant.design) to create a feature request issue.
-
-## Your First Pull Request
-
-Working on your first Pull Request? You can learn how from this free video series:
-
-[How to Contribute to an Open Source Project on GitHub](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github)
-
-To help you get your feet wet and get you familiar with our contribution process, we have a list of [good first issues](https://github.com/ant-design/ant-design/issues?q=is%3Aissue+is%3Aopen+label%3A%22good+first+issue%22) that contain bugs or small features that have a relatively limited scope. This is a great place to get started.
-
-If you decide to fix an issue, please be sure to check the comment thread in case somebody is already working on a fix. If nobody is working on it at the moment, please leave a comment stating that you intend to work on it so other people don’t accidentally duplicate your effort.
-
-If somebody claims an issue but doesn’t follow up for more than two weeks, it’s fine to take over it but you should still leave a comment.
-
-## Sending a Pull Request
-
-The core team is monitoring for pull requests. We will review your pull request and either merge it, request changes to it, or close it with an explanation.
-
-**Before submitting a pull request**, please make sure the following is done:
-
-1. Fork the repository and create your branch from [proper branch](./CONTRIBUTING.md#branch-organization).
-1. Run `npm install` in the repository root.
-1. If you’ve fixed a bug or added code that should be tested, add tests!
-1. Ensure the test suite passes (npm run test). Tip: `npm test -- --watch TestName` is helpful in development.
-1. Run `npm test -- -u` to update [jest snapshot](http://facebook.github.io/jest/docs/en/snapshot-testing.html#snapshot-testing-with-jest) and commit these changes as well (if has).
-1. Make sure your code lints (npm run lint). Tip: Lint runs automatically when you `git commit`.
-
-Sending a Pull Request to [react-component](https://github.com/react-component/):
-
-Since antd's components are based on react-component, sometimes you may need to send pull request to the corresponding react-component repository. If it's a bugfix pull request, after it's merged, the core team will release a patch release for that component as soon as possible, then you only need to do is reinstalling antd in your project to get the latest patch release. If it's a feature pull request, after it's merged, the core team will release a minor release, then you need raise another pull request to [Ant Design](https://github.com/ant-design/ant-design/) to update dependencies, document and TypeScript interfaces (if needed).
-
-## Development Workflow
-
-After cloning antd, run `npm install` to fetch its dependencies. Then, you can run several commands:
-
-1. `npm start` runs Ant Design website locally.
-1. `npm run lint` checks the code style.
-1. `npm test` runs the complete test suite.
-1. `npm run compile` compiles TypeScript code to the `lib` and `es` directory.
-1. `npm run dist` creates UMD build of antd.
+我们写了一份 **[贡献指南](https://ant.design/docs/react/contributing-cn)** 来帮助你开始。
--- a/.jest.js
+++ b/.jest.js
@@ -37,6 +37,7 @@ module.exports = {
    '!components/style/index.tsx',
    '!components/*/locale/index.tsx',
    '!components/*/__tests__/**/type.tsx',
+    '!components/**/*/interface.{ts,tsx}',
  ],
  transformIgnorePatterns,
  snapshotSerializers: [
--- a/.travis.yml
+++ b/.travis.yml
@@ -19,7 +19,6 @@ matrix:
      - env: REACT=15 TEST_TYPE=test:es
      - env: REACT=15 TEST_TYPE=test:dom
      - env: REACT=15 TEST_TYPE=test:node
-      - env: REACT=16 TEST_TYPE=bisheng:build

 before_script:
  - scripts/install-react.sh
--- a/AUTHORS.txt
+++ b/AUTHORS.txt
@@ -1,18 +1,26 @@
+778758944 <778758944@qq.com>
 Aaron Planell López <aaronplanell@gmail.com>
 Adrian Dimitrov <dimitrov.adrian@gmail.com>
 Albert Zheng <lisong.zheng@gmail.com>
 Albert 理斯特 <shuaizhexu@gmail.com>
+Aleck Landgraf <aleck.landgraf@gmail.com>
 Alexander <labriko@yandex.ru>
+Alexander Suevalov <suevalov.work@gmail.com>
 Alexandre Kirszenberg <a.kirszenberg@gmail.com>
+Amorites <751809522@qq.com>
 Anas Tawfeek <anas.tawfeek@outlook.com>
 Andrew Murray <radarhere@gmail.com>
 Andrey G <plandem@gmail.com>
+Arnab Sen <arnabsen@gmail.com>
 Arthur Denner Oliveira Santos <arthurdenner7@gmail.com>
+Arvin Xu <arvinx@foxmail.com>
 BK Heleth <bon.hoo@hotmail.com>
 Babajide Fowotade <jide.b.tade@gmail.com>
+Bartek <bartek.kozera@gmail.com>
 Benjamin Kniffler <bkniffler@me.com>
 Benjy Cui <benjytrys@gmail.com>
 Bernie <bernie.wangbj@gmail.com>
+Bilal Sirazitdinov <bilalsir@yandex.ru>
 Bill Sheikh <bilawals22@gmail.com>
 Bo Chen <bochen2014@yahoo.com>
 Bozhao <yubz86@gmail.com>
@@ -20,113 +28,187 @@ Brett Lamy <bel423@me.com>
 Brook Shi <iwxiaot@gmail.com>
 Bruce Mitchener <bruce.mitchener@gmail.com>
 Bruno Maia <bruno.mm.maia@gmail.com>
+Bryan Berger <bb@ga.co>
 C <4019980@qq.com>
 Cam Song <neosoyn@gmail.com>
+Camol <kwwnjujlc@sina.com>
+Canwen Xu <canwenxu@126.com>
 Catalin Miron <mironcatalin@gmail.com>
 Cee Cirno <i@cee.moe>
+Chang Wang <cheapsteak@gmail.com>
 Chikara Chan <chenhongtu@51xianqu.net>
 Chris Kelly <cjke.7777@gmail.com>
 ChrisFan <chris.fan.dev@gmail.com>
+Christopher Deutsch <cd@cdeutsch.com>
+Chuang Yu <cyu9960@gmail.com>
+Claudio Restifo <claudio.restifo@gmail.com>
 Cody Chan <int64ago@gmail.com>
 Colton Pierson <colton@coltonpierson.com>
+Confiks <confiks@scriptbase.org>
 Conway Anderson <hello@conwayanderson.com>
 Cordaro <elvis07@163.com>
 D & R <jdz321@qq.com>
 Damian Green <damian.green@microlease.com>
+Dan Minshew <ofenixculpa@gmail.com>
+Dane David <dndavid102@gmail.com>
 Danny Hoower Antonio Viasus Avila <danjavia@gmail.com>
 Daqi Song <dqaria@gmail.com>
 Darren Poon <dyhpoon@gmail.com>
+David Schneider <davschne@gmail.com>
 DengYun <tdzl2003@gmail.com>
+Dimitri Mitropoulos <dimitrimitropoulos@gmail.com>
+Dmitry Bolotin <bolotin.dmitriy@gmail.com>
 Dorian <dorian@doma.io>
+DosLin <doslino@gmail.com>
+EcmaProSrc.P/ka <asoiso@foxmail.com>
 Edd Hannay <accounts@edd.fm>
 Eddie Xie <oeddyo@gmail.com>
+Eden Wang <Eden.Wang@Akmii.com>
 Eden Wang <yociduo@vip.qq.com>
 Egor Yurtaev <yurtaev.egor@gmail.com>
+Eli White <github@eli-white.com>
 Emma <sima.zhang1990@gmail.com>
 Eric <84263800@qq.com>
 Erwann Mest <m+github@kud.io>
 Evgeny Kuznetsov <jackk@ya.ru>
 Eward Song <eward.song@gmail.com>
+Flynn <li.fulin@foxmail.com>
+For177 <mengqiang.q@gmail.com>
+Geoff Holden <geoff@brightloudnoise.com>
+George Gray <george@ummodesign.com>
 Graeme Yeates <gyeates@clearpath.ai>
 Graeme Yeates <yeatesgraeme@gmail.com>
 Gray Choi <gray.choi.1988@gmail.com>
 Guan Hao <raptium@gmail.com>
+Guan Yu Pan (Jacky) <jackypan1989@gmail.com>
 HJin.me <hjin.me@gmail.com>
 Hai Phan Nguyen <pnghai@gmail.com>
 Haibin Yu <haibin.yu@oceanwing.com>
 Hanai <ihanai1991@gmail.com>
 Haroen Viaene <fingebimus@me.com>
 Harshit Mehrotra <harshitmehrotra@hotmail.com>
+Henri Normak <henri.normak@gmail.com>
 Hubert Argasinski <argasinski.hubert@gmail.com>
+Hughen <446370503@163.com>
 Hugo LEHMANN <shogi31@gmail.com>
 Igor G <i.gaidai4uk@gmail.com>
 ImJoeHs <865439601@qq.com>
 Inclined.Z <zjq0717@163.com>
 Infinity <305870677@qq.com>
+Ivan Kravets <me@ikravets.com>
 Ivo Stratev <ivo.stratev.tues@gmail.com>
+JaePil Jung <jjp5023@gmail.com>
 James <james@schoolshape.com>
+Jeffrey Carl Faden <jeffreyatw@gmail.com>
 Jerry Bendy <jerry@icewingcc.com>
 Jesper We <jesper@journeyman.se>
+Jiabin Peng <png.inside@gmail.com>
 Jialei <jialeicui@126.com>
 Jieraaa <842533841@qq.com>
+Jing Ma <mjingm87@qq.com>
 Joe <qiaolibo@126.com>
 Joe Hsu <jhsu.x1@gmail.com>
+John Johnson III <john@johnjohnson.cc>
+John Nguyen <jtnguyen236@gmail.com>
 Jonatas Walker <jonataswalker@gmail.com>
+Jonny Buchanan <jonathan.buchanan@gmail.com>
 Jordan Hornblow <jordan@jch254.com>
+Josué <ujosuegt@outlook.com>
+Juan Rodrigo Venegas Boesch <jrvboesch@gmail.com>
 Junyu Zhan <irrigator@yeah.net>
+Kaien Liao <liaokaien@gmail.com>
 Kenaniah Cerny <kenaniah@gmail.com>
 Kenneth Truong <kenneth.e.truong@gmail.com>
 Kevin Ivan <info@kevinivan.com>
 KgTong <kgtong1992@gmail.com>
+Khalifa Lame <khalibloo@gmail.com>
+Kiho · Cham <monkindey@163.com>
 Kimmo Saari <kimmo.saari@revolt.fi>
+Kirill Stiopin <kirill.stiopin@hotmail.com>
 Knacktus <knacktus@gmail.com>
+Kyle Kelley <rgbkrk@gmail.com>
 Kyle Rosenberg <kyle.rosenberg@gmail.com>
 Larry Laski <larry.laski@gmail.com>
 LeeHarlan <709886167@qq.com>
+LeezQ <lizhenq2009@gmail.com>
 Leo <clinyong@gmail.com>
 Leon Shi <superRaytin@163.com>
 Leon Shi <superRaytin@gmail.com>
 Liu Yang <zation1@gmail.com>
 LongYinan <lynweklm@gmail.com>
+Lyndon001 <lld207@126.com>
 MG12 <wuzhao.mail@gmail.com>
 Ma Tianxiao <matx2215@outlook.com>
 Madis Väin <madisvain@gmail.com>
 Manjit Kumar <manjit1727@gmail.com>
+Manweill <mic.liangwenwei@foxmail.com>
+Marco Afonso <mafonso333@gmail.com>
+Marcus Bransbury <marcus.bransbury@gmail.com>
 Marius Ileana <visvadw@gmail.com>
+Mars Wong <marswong618@gmail.com>
 Marshall Chen <Juniors.fei@gmail.com>
 Martin Litvaj <kamahl19@gmail.com>
 Martin Novák <martinnovak@outlook.com>
+Mathew <khayaanimations@gmail.com>
+Maximilian Meyer <Maximilian.Meyer@br.de>
 Meck <yesmeck@gmail.com>
 MeiLin <postget.me@gmail.com>
+Meow-z <372086270@qq.com>
+Miaow <i@zfeng.net>
+Michalis Macheras <diodosier@gmail.com>
 Min <dicklwm@163.com>
+MinJeong Kim <min7859@gmail.com>
 Minqi Pan <pmq2001@gmail.com>
 Minsung Ryu <ryums0227@gmail.com>
 Mitchell Demler <mitchell.demler@harcourts.net>
+Mohamed Seada <mohamed.seada.1994@gmail.com>
 Mr.Tone <vector@malubei.com>
+MuYu <mr.muzea@gmail.com>
+Mário Gonçalves <mario.mc.goncalves@gmail.com>
+Nathan Griffin <nathan@gatherhere.com>
 Nathan Tavares Nascimento <nathan.tnascimento@gmail.com>
 Nathan Wells <nwwells@gmail.com>
+Neekey <ni184775761@gmail.com>
+Nekron <nekron.hyt@gmail.com>
 Neverland <chenjiahan@buaa.edu.cn>
 Nico <nicolas@freddelacompta.com>
+Nidhi Agarwal <nidhi.agarwal@zomato.com>
 Nimo <nimo.jser@gmail.com>
 Nishant Arora <na.nishantarora@gmail.com>
+Nokecy <Nokecy@163.com>
 OAwan <georgio.wan@gmail.com>
+Oleksandr Kovalchuk <me.olexandr.kovalchuk@gmail.com>
+OuYancey <ou.yancey@gmail.com>
 Panjie Setiawan Wicaksono <panjie@panjiesw.com>
 Patrick Gidich <patrick.gidich@simnova.com>
 Patryk <longer44@gmail.com>
+Peter <usstpeter@gmail.com>
 Peter Berg <atticusberg@gmail.com>
 Pierre <pierre@bazoge.com>
+Pierre Neter <pierreneter@gmail.com>
 Piper Chester <piperchester@gmail.com>
 Pixy Yuan <pixy.bupt@gmail.com>
 Pyiner <lijiuyang1992@gmail.com>
+Pyroboomka <qwaarty@mail.ru>
 Qiaosen Huang <joesonw@gmail.com>
 Qingrong Ke <keqingrong1992@gmail.com>
 Rafael Cosman <rafaelcosman@alumni.stanford.edu>
+Ramsés Moreno <ramses@cuatromedios.com>
+Randy <randypriv@gmail.com>
 RaoHai <surgesoft@gmail.com>
+Reed Sun <superreedsun@gmail.com>
 Rex <zhangzilong.zzl@163.com>
+Ricardo Raphael Joson <rrjoson08@gmail.com>
 Richard D. Worth <rdworth@gmail.com>
 Robert Wilkinson <wilkinson.robert.a@gmail.com>
+Rohan Malhotra <rohan.root@gmail.com>
 Rrrandom <emanonhere@gmail.com>
+SHEN Lin <shenlin192@gmail.com>
 Sakol Assawasagool <koobitor@gmail.com>
+Sam Chen <chenxsan@gmail.com>
+Sam Maxwell <sam@paybase.io>
+Sangle <whb97@163.com>
+Sanjay Kumar <kris.gooner@gmail.com>
 Sanjay Kumar <sk@tectusdreamlab.com>
 Sean Lin <sean@ejoy.com>
 Sean Sun <pinggodstudio@gmail.com>
@@ -134,39 +216,74 @@ Sebastian Blade <blade254353074@hotmail.com>
 Sergio Crisostomo <sergiosbox@gmail.com>
 Shawn Sit <xueqingxiao@gmail.com>
 ShiTengFei <shitengfei@goyoo.com>
+Shubham Kanodia <shubhamsizzles@gmail.com>
 SimaQ <sima.zhang1990@gmail.com>
+Spencer <spjy@hawaii.edu>
+Stephen Esser <Stephen.Esser@gmail.com>
+Tao <magicdawn@qq.com>
 Tao Zhang <windse7en@gmail.com>
+Taylor Sabell <taylorsabell@gmail.com>
+Tengjiao Cai <caitengjiao1987@gmail.com>
+Terence <trence320@163.com>
 The Rock <zhoguoxin@126.com>
 Tino D <ginodeis@gmail.com>
+Tom Gao <tom@zoomsoft.cc>
+Trotyl Yu <trotyl@qq.com>
+Troy Thompson <troynt@gmail.com>
 Tyler <chaotyler@gmail.com>
+Ubaldo Quintana <blkdr@hotmail.com>
 Vadim Macagon <vadim.macagon@gmail.com>
 Valentin Vichnal <valentin@vichnal.com>
-Vemund Santi <veund@santi.no>
+Vemund Santi <vemund@santi.no>
+Vic <709147950@qq.com>
 Vincent Zhang <vxzhong@qq.com>
+ViviaRui <zr1450995198@163.com>
 Walter Barbagallo <turbometalskater@gmail.com>
+Wang Jun <amos.callmexyz@gmail.com>
 Warren Seymour <warren@fountainhead.tech>
 Wei Zhu <yesmeck@gmail.com>
+Wenchao Hu <zjuhwc@gmail.com>
 Will Chen <willchen90@gmail.com>
+WingGao <wing.gao@live.com>
+Wu Haotian <whtsky@gmail.com>
+XBTop1! <xbtop1@gmail.com>
 Xie Guanglei <xieguanglei@hotmail.com>
+XuMM_12 <owiatsq@sina.cn>
+Yang Bin <yangkghjh@gmail.com>
+Yasin Uslu <nepjua@gmail.com>
 Yiming <ymjrcc@qq.com>
 Yogesh <yogeshkumar180592@gmail.com>
+YuChao Liang <l.yuch@foxmail.com>
+Yunus EŞ <yunus@yunuses.com>
+Yury Kozyrev <urakozz@me.com>
 Yusuke Ito <novi.mad@gmail.com>
 Yuwei Ba <i@xiaoba.me>
 YuyingWu <wuyuying1128@gmail.com>
 Zack Craig <zack@zack6849.com>
 Zap <a124116186@qq.com>
+Zhang Zhi <fytriht@gmail.com>
+Zheeeng <hi@zheeeng.me>
+Ziluo <gyfzzu@gmail.com>
 afc163 <afc163@gmail.com>
+ahalimkara <ahalimkara@gmail.com>
+ascoders <576625322@qq.com>
 ashishg-qburst <ashishg@qburst.com>
 bang <sqibang@gmail.com>
 bang88 <sqibang@gmail.com>
 blankzust <450811238@qq.com>
+byuanama <byuan@ama.com.au>
+bzone <yarnbcoder@gmail.com>
 caoyi <caoyi0905@mail.hfut.edu.cn>
 cathayandy <wzm_andy@126.com>
+chaofeis <408067385@qq.com>
 chchen <cc272309126@gmail.com>
 chencheng (云谦) <sorrycc@gmail.com>
+chencheng <sorrycc@gmail.com>
+cjahv <cjahv@qq.com>
 clinyong <clinyong@gmail.com>
 corneyl <cornieljoosse@gmail.com>
 ddcat1115 <ddcat1115@gmail.com>
+delesseps <andrewlessels@gmail.com>
 denzw <denzw@21cn.com>
 detailyang <detailyang@gmail.com>
 devqin <devqin@gmail.com>
@@ -181,40 +298,67 @@ feng zhi hao <fzhihao@outlook.com>
 fengmk2 <m@fengmk2.com>
 flashback313 <windmark2012@gmail.com>
 genie <genie88@163.com>
+gregahren <grega.hren@gmail.com>
 handycode <lihandi@gmail.com>
 hansnow <hansnow2012@gmail.com>
 haoxin <coderhaoxin@outlook.com>
 hardfist <yangjianzju@gmail.com>
+hauwa123 <hauwa.aminu@outlook.com>
+henryv0 <henryvo94@gmail.com>
 hi-caicai <hi@cai-cai.me>
+huzzbuzz <huzzbuzz@outlook.com>
 iamcastelli <sowed@cyberdude.com>
+imosapatryk <imosa.patryk@gmail.com>
+infeng <fzhihao@outlook.com>
+int2d <int2d@qq.com>
 ioldfish <fish.wangl@gmail.com>
 jasonslyvia <jasonslyvia@gmail.com>
+jasonxia23 <xia.jason23@gmail.com>
 jiang <155259966@qq.com>
+jim <wasd2144@hotmail.com>
 jinouwuque <ee2win@gmail.com>
+junjing.zhang <zhangjunjing@gmail.com>
 kacjay <45483388@qq.com>
 kagawagao <kingsongao1221@gmail.com>
 kaifei <150641329@qq.com>
 kasinooya <kasinooya@gmail.com>
 kayw <kayw@outlook.com>
 kdenz <ksnz93@gmail.com>
+kdepp <kdepp.cd@gmail.com>
 keng <keng@renderinghouse.com>
+keqingrong <keqingrong1992@gmail.com>
 ko <git@yaksok.net>
+konakona <lovekonakona@gmail.com>
 kossel <lis.yichao@gmail.com>
+kuang <p2227@hotmail.com>
 kun sam <kunsam624@icloud.com>
 leadream <857098475@qq.com>
 lehug <zcszuo5811@126.com>
 leon.shi <superRaytin@163.com>
 lgmcolin <gengmin.lgm@gmail.com>
 lgmcolin <lgmcolin@gmail.com>
+liangfei <njliangfei@gmail.com>
 liekkas <zjq0717@163.com>
+lihqi <455711093@qq.com>
 lixiaochou077 <qi.liqi07@gmail.com>
 lixiaoyang <lixiaoyang2345@gmail.com>
+lixiaoyang1992 <lixiaoyang2345@gmail.com>
 lizhaocai <lzc09008@gmail.com>
+lizhen <lizhen@youzan.com>
 loganpowell <loganp@tepper.cmu.edu>
+luyiming <luyimingchn@gmail.com>
+lvren <luren6049@qq.com>
 mArker <252133226@qq.com>
+memoryza <jincai.wang@foxmail.com>
+mgrdevport <mgrdevport@gmail.com>
 mitchell.demler <mitchell.demler@harcourts.net>
+mkermani144 <mkermani144@gmail.com>
+monkindey <monkindey@163.com>
 muzuiget <muzuiget@gmail.com>
 natergj <nater_nater@me.com>
+neekey <ni184775761@gmail.com>
+niko <644506165@qq.com>
+nikogu <644506165@qq.com>
 paranoidjk <hust2012jiangkai@gmail.com>
 parlop <parlop@gmail.com>
 pd4d10 <pd4d10@gmail.com>
@@ -224,8 +368,11 @@ pizn <pizner@gmail.com>
 plandem <plandem@gmail.com>
 popomore <sakura9515@gmail.com>
 qubaoming <qubaoming@didichuxing.com>
+ravirambles <ravirambles@gmail.com>
 ryangun <ryangun@foxmail.com>
+ryanhoho <hswacoal@gmail.com>
 sadmark <zhoubin@laidian360.com>
+sallen450 <jqh101@sina.com>
 shelwin <wxfans@gmail.com>
 shenlin192@gmail.com <shenlin192@gmail.com>
 shlice <licesh@gmail.com>
@@ -236,17 +383,26 @@ snadn <snadn@snadn.cn>
 sojournerc <cmeyer@zvelo.com>
 sorrycc <sorrycc@gmail.com>
 swindme <swindme@163.com>
+syssam <s.y.s.sam.sys@gmail.com>
+thegatheringstorm <tgs@tgs.blue>
 tianli.zhao <275287902@qq.com>
 tom <caolvchong@gmail.com>
+twobin <twobin@live.com>
+u3u <qwq@qwq.cat>
 ustccjw <317713370@qq.com>
+valleykid <valleykiddy@gmail.com>
+vgeyi <vgeyiz@126.com>
 wangtao0101 <yuecjn@gmail.com>
+wangxiaolei <fatelei@gmail.com>
 warmhug <hualei5280@gmail.com>
 whtang906 <whtang906@gmail.com>
 wizawu <wizawu@gmail.com>
 wonyun <wy393767068@163.com>
 xiaofan2406 <xiaofan2406@gmail.com>
+yangwukang <yangwukang@boco.com.cn>
 yeliex <yeliex@yeliex.com>
 yiminghe <yiminghe@gmail.com>
+yociduo <yociduo@vip.qq.com>
 yubozhao <yubz86@gmail.com>
 yuche <i@yuche.me>
 z <haig8@msn.com>
@@ -255,26 +411,46 @@ zerob4wl <zerob4wl@gmail.com>
 zhangpc <zhangpc@tenxcloud.com>
 zhaocai <lzc09008@gmail.com>
 zhujun24 <zhujun87654321@gmail.com>
+zhuyue <fuping.dfp@antfin.com>
 zilong <jzlxiaohei@163.com>
 zinkey <yaya@uloveit.com.cn>
 zollero <corona7@163.com>
+zombiej <smith3816@gmail.com>
 zuiidea <zuiiidea@gmail.com>
-一喵呜 <hyb628@gmail.com>
-乔奕轩 <qiao_yixuan@163.com>
-低位 <zhujun87654321@gmail.com>
-偏右 <afc163@gmail.com>
-可乐 <zaxlct@foxmail.com>
-吕立青 <jimmy.jinglv@gmail.com>
-广彬-梁 <326741518@qq.com>
-柚子男 <yozman@sina.com>
-白羊座小葛 <abeyuhang@gmail.com>
-英布 <chaoren1641@gmail.com>
-蔡伦 <sliuqin@gmail.com>
-逸达 <dqaria@gmail.com>
 邦 <sqibang@gmail.com>
-闲耘™ <hotoo.cn@gmail.com>
+爱but的苍蝇 <354788473@qq.com>
+拷钉 <41830859@qq.com>
+竹尔 <Juelchiang@gmail.com>
+偏右 <afc163@gmail.com>
+英布 <chaoren1641@gmail.com>
+朮厃 <cn.ah.liu@gmail.com>
+诸岳 <dengfuping_develop@163.com>
+逸达 <dqaria@gmail.com>
+蔡伦 <sliuqin@gmail.com>
 陆离 <surgesoft@gmail.com>
+愚道 <tingzhao.ytz@antfin.com>
 陈帅 <wasd2144@hotmail.com>
-马斯特 <sd4399340@126.com>
-马金花儿 <o.o@mug.dog>
+松子 <window.pibarr@gmail.com>
+可乐 <zaxlct@foxmail.com>
+山客 <zeakhold@gmail.com>
+曾凯 <zengkai2009@foxmail.com>
+低位 <zhujun87654321@gmail.com>
+广彬-梁 <326741518@qq.com>
+徐坤龙 <272992168@qq.com>
 黄子毅 <576625322@qq.com>
+翁润雨 <593110501@qq.com>
+崔宏森 <948346354@qq.com>
+闲耘™ <hotoo.cn@gmail.com>
+一喵呜 <hyb628@gmail.com>
+吕立青 <jimmy.jinglv@gmail.com>
+隋鑫磊 <joshuasui@gmail.com>
+乔奕轩 <qiao_yixuan@163.com>
+马斯特 <sd4399340@126.com>
+王集鹄 <wjhu111@21cn.com>
+柚子男 <yozman@sina.com>
+愚指导 <yutingzhao1991@sina.com>
+愚指导-TZ <yutingzhao1991@sina.com>
+超能刚哥 <margox@foxmail.com>
+马金花儿 <o.o@mug.dog>
+रोहन मल्होत्रा <rohan.malhotra@adwyze.com>
+白羊座小葛 <abeyuhang@gmail.com>
--- a/CHANGELOG.en-US.md
+++ b/CHANGELOG.en-US.md
@@ -15,9 +15,249 @@ timeline: true

 ---

+## 3.4.4
+
+`2018-04-28`
+
+- 🐞 Fix that Upload file in`onChange({ file })` is not a File instance introduced in `3.4.2`. [#10293](https://github.com/ant-design/ant-design/issues/10293)
+- 🐞 Fix style lose bug when use tree shaking in webpack@4. [#10217](https://github.com/ant-design/ant-design/pull/10217) [@whtsky](https://github.com/whtsky)
+
+## 3.4.3
+
+`2018-04-23`
+
+- 🐞 Fix style lose bug when use tree shaking in webpack@4. [#10197](https://github.com/ant-design/ant-design/pull/10197) [@Aladdin-ADD](https://github.com/Aladdin-ADD)
+- 🐞 Fix `Menu` item's clickable region in dark theme. [#10187](https://github.com/ant-design/ant-design/pull/10187) [@dgeibi ](https://github.com/dgeibi )
+
+## 3.4.2
+
+`2018-04-22`
+
+- 💄 Deployed site by [netlify](http://netlify.com/) to avoid blocking by GFW.
+- 🐞 Fix TypeScript definitions of Menu, Tooltip, Card, Anchor, Avatar, Form, Tabs, Transfer, Tree, AutoComplete and etc.
+- 💄 Added `sideEffects` to `package.json` for better Tree-Shaking. [#10043](https://github.com/ant-design/ant-design/pull/10043) [@Aladdin-ADD](https://github.com/Aladdin-ADD)
+- List
+  - 🐞 Fix extra border. [#10028](https://github.com/ant-design/ant-design/issues/10028)
+  - 🐞 Fix extra prop warning of `locale`. [#10128](https://github.com/ant-design/ant-design/pull/10128) [@slonoed](https://github.com/slonoed)
+- 🐞 Fix wrong preview image of Upload list when file.url contains url params. [#10102](https://github.com/ant-design/ant-design/issues/10102)
+- 🐞 Fix Progress when percent is out of range. [0eb8357](https://github.com/ant-design/ant-design/commit/0eb835772dbaa7ed14babe03fc177821c5bd5ca5)
+- Menu
+  - 🐞 Fix arrow style of disabled SubMenu. [#10113](https://github.com/ant-design/ant-design/issues/10113)
+  - 🐞 Fix that menu width is wrong when `collapsedWidth` is assigned as px string like `40px`. [#10140](https://github.com/ant-design/ant-design/issues/10140)
+- 🐞 Fix that sometimes controlled input in Form cannot be edited. [#9790](https://github.com/ant-design/ant-design/issues/9790)
+- 🐞 Fix padding jumping issue of loading Card. [#10052](https://github.com/ant-design/ant-design/pull/10052) [@zheeeng](https://github.com/zheeeng)
+- 🐞 Fix that Avatar's fallback text don't scale as the text avatar does. [#10184](https://github.com/ant-design/ant-design/pull/10184)
+- 🐞 Fix Table `getCheckboxProps` cannot be updated as expected. [#10133](https://github.com/ant-design/ant-design/issues/10133)
+- 🐞 Fix CheckboxGroup `prefixCls` prop not passed to Checkbox. [#9950](https://github.com/ant-design/ant-design/issues/9950)
+
+## 3.4.1
+
+`2018-04-08`
+
+- 🐞 Fix TypeScript type error caused by code error of Badge. [#9931](https://github.com/ant-design/ant-design/issues/9931)
+- 💄 Improve clicking region of Card `actions`. [#9882](https://github.com/ant-design/ant-design/issues/9882)
+- 🐞 Fix Divider style issue when used with float elements. [#9956](https://github.com/ant-design/ant-design/issues/9956)
+- 🐞 Fix style issue of Form in advanced-search mode. [#9907](https://github.com/ant-design/ant-design/issues/9907)
+- 🐞 Add `onHeaderRow` TypeScript type definitions for Table. [#9902](https://github.com/ant-design/ant-design/pull/9902) [@Nokecy](https://github.com/Nokecy)
+- 💄 Improve the customized-icon demo of Tree. [#9893](https://github.com/ant-design/ant-design/pull/9893)
+- 🐞 Fix image url display with non-image extention in Upload. [#9936](https://github.com/ant-design/ant-design/pull/9936)
+
+## 3.4.0
+
+`2018-04-01`
+
+- Tree
+  - 🛠 In this version, we refactored the underlying code of Tree to resolve some long living issues.
+  - 🌟 Added `defaultExpandParent` for expanding parent at first render.
+  - 🌟 Added `disabled` for disabling the whole tree.
+  - 🌟 Added `TreeNode[icon]` to allow setting custom node icon.
+  - 🌟 Improved the check logic for disabled TreeNode.
+- 🌟 Anchor added `getContainer` for setting the container of scroll content.
+- 🌟 Table added a new less variable `@table-expanded-row-bg`. [#9789](https://github.com/ant-design/ant-design/pull/9789)
+- 🐞 Fixed a less syntax error. [#9832](https://github.com/ant-design/ant-design/pull/9832) [@jojoLockLock](https://github.com/jojoLockLock)
+- 🐞 Fixed `moment.locale` invoking error in LocaleProvider. [#9853](https://github.com/ant-design/ant-design/pull/9853)
+- 🐞 Fixed issue resulting in `style` of WeekPicker not works. [#9848](https://github.com/ant-design/ant-design/issues/9848)
+- 🐞 Fixed type definition of Layout.Sider. [#9885](https://github.com/ant-design/ant-design/pull/9885) [@zachguo](https://github.com/zachguo)
+- 💄 Improved style of Modal for long contents. [#9592](https://github.com/ant-design/ant-design/pull/9592)
+- 🌟 Added new locale Slovenian.
+
+## 3.3.3
+
+`2018-03-25`
+
+- Revert Upload `file` type change in previous version  which causes breaking change.
+
+## 3.3.2
+
+`2018-03-24`
+
+- 🐞 `Carousel`: Upgrade `react-slick` version to fix width calculation. [#3659](https://github.com/ant-design/ant-design/issues/3659)
+- 💄 `Rate`: Adjust `disabled` style. [#9747](https://github.com/ant-design/ant-design/issues/9747)
+- 💄 `Modal`: Adjust `confirm-modal` style to fix display issue when content use grid layout. [#9374](https://github.com/ant-design/ant-design/issues/9374)
+- 💄 `Menu`: Adjust style to fix mouse trigger event region. [#9666](https://github.com/ant-design/ant-design/pull/9666) [@dgeibi](https://github.com/dgeibi)
+- 🐞 `Upload`: Fix type of `file` on `beforeUpload` function. [#9775](https://github.com/ant-design/ant-design/issues/9775)
+- 🐞 `Button`: Fix `two-chinese-words` space not re-calculate when text changed. [4502ad8](https://github.com/ant-design/ant-design/commit/4502ad8376e536c450fa4f27d2a5855be5a153e7)
+
+## 3.3.1
+
+`2018-03-18`
+
+- 💄 Tweak danger button focus style.
+- 🐞 Fix a show error when the value of enterButton is a button element.  [#9639](https://github.com/ant-design/ant-design/issues/9639)
+- 🐞 Fix missing key of `column.title` in Table .[#9658](https://github.com/ant-design/ant-design/issues/9658) [@terence55](https://github.com/terence55)
+- 🐞 Fix `scroll: { x: true }` not working if `.ant-table-scroll table` width is `auto`. [#9704](https://github.com/ant-design/ant-design/pull/9704)
+- 🐞 Fix when the helper message disappears, the input box will shake.  [#8831](https://github.com/ant-design/ant-design/issues/8831)
+- 🐞 Fix isMoment call in `TimePicker` will report error in parcel. [85c78e4](https://github.com/ant-design/ant-design/commit/85c78e49a91737c2841dc42621db21ca248b62b4)
+- 🐞 Tweak `Table` border radius. [#9674](https://github.com/ant-design/ant-design/pull/9674)
+## 3.3.0
+
+`2018-03-12`
+
+- 🌟 Add `afterClose` prop for `Alert` to achieve smooth unmount. [#9448](https://github.com/ant-design/ant-design/pull/9448) [@Hughen](https://github.com/Hughen)
+- 🌟 Add `validRange` prop for `Calendar` to set the date range. [71f65a0](https://github.com/ant-design/ant-design/commit/71f65a0be8e72a67f334c57e79ae3ff5fb640630) [@Rohanhacker](https://github.com/Rohanhacker)
+- 🌟 Add `defaultActiveTabKey` prop for `Card` to initial TabPane's active key. [30fe88d](https://github.com/ant-design/ant-design/commit/30fe88d4bdcec765bf92ca32a755d9646b36978e) [@u3u](https://github.com/u3u)
+- `DatePicker`
+    - 🌟 Add `dropdownClassName` prop to set the className of popup calendar. [#7211](https://github.com/ant-design/ant-design/issues/7211)
+    - 🐞 Fix the error of resolving `moment` object. [#9539](https://github.com/ant-design/ant-design/pull/9539)
+    - 🐞 Fix uncorrect import of `turkish(tr_TR)` locale file. [#9373](https://github.com/ant-design/ant-design/issues/9373)
+- 🌟 Add `orientation` prop for `Divider` to set the alignment of text in divider. [#9275](https://github.com/ant-design/ant-design/pull/9275) [@jrvboesch](https://github.com/jrvboesch)
+- 🌟 Add `keyboard` prop for `Modal` to set whether Modal could be closed by `Esc` key. [#8818](https://github.com/ant-design/ant-design/issues/8818)
+- 🌟 Improve the TypeScript definition of `event` param in `onChange` prop for `Radio` and `Checkbox`. [#9574](https://github.com/ant-design/ant-design/issues/9574)
+- `Table`
+    - 🌟 Add `position` prop in `pagination` prop to set the position of pagination. [#9357](https://github.com/ant-design/ant-design/pull/9357) [@kanweiwei](https://github.com/kanweiwei)
+    - 🌟 Add event param of `onSelect` prop in `rowSelection` prop. [#9376](https://github.com/ant-design/ant-design/pull/9376) [@kanweiwei](https://github.com/kanweiwei)
+    - 🌟 Add `columnWidth` prop in `rowSelection` prop to set the column width of selection. [#9474](https://github.com/ant-design/ant-design/pull/9474) [@SimpleFrontend](https://github.com/SimpleFrontend)
+    - 🐞 Fix border radius issue in `Chrome` for `Table`. [af8e54f](https://github.com/ant-design/ant-design/commit/af8e54f1d6ac2891892e39b153cbe3e998370f61)
+- 🌟 Add `pendingDot` prop for `Timeline` to set icon of ghost node. [#9546](https://github.com/ant-design/ant-design/pull/9546) [@SimpleFrontend](https://github.com/SimpleFrontend)
+- 🌟 Add `inputReadOnly` prop for `TimePicker` to set if it's read only. [4a69446](https://github.com/ant-design/ant-design/commit/4a69446be155c1c176b18cb2c31459f999aa5d5e) [@JesperWe](https://github.com/JesperWe)
+- 🌟 Add `dropdownClassName` prop for `TreeSelect`. [69b154f](https://github.com/ant-design/ant-design/commit/69b154f9a9cfa5f2d89a82b6ed730d4d8793de73) [56e4ce0](https://github.com/ant-design/ant-design/commit/56e4ce099d950601538d72243563021e8083776b)
+- 🌟 Improve the preview for `Upload` when uploading the file of non-image format. [#9621](https://github.com/ant-design/ant-design/pull/9621) [@zswang](https://github.com/zswang)
+- 🐞 Fix `successPercent` prop that cannot decide the success status for `Progress`. [#9382](https://github.com/ant-design/ant-design/issues/9382)
+- 🐞 Fix font size for `Tabs`. [#9509](https://github.com/ant-design/ant-design/pull/9509)
+- 🐞 Fix that disabled parent node cannot spread for `Tree` and `TreeSelect`. [#9539](https://github.com/ant-design/ant-design/pull/9539)
+
+## 3.2.3
+
+`2018-03-02`
+
+- 🐞 Fix props `onPopupScroll` ts define in `Select`. [#9475](https://github.com/ant-design/ant-design/pull/9475) [@twobin](https://github.com/twobin)
+- 🐞 Fix `Table` filter dropdown menu popup container. [#9209](https://github.com/ant-design/ant-design/issues/9209)
+- 🐞 Fix `Timeline` head custom style error in chrome. [#9429](https://github.com/ant-design/ant-design/pull/9429) [@vthinkxie](https://github.com/vthinkxie)
+- 🐞 Fix `Select` dropdown border. [82092c1](https://github.com/ant-design/ant-design/commit/82092c154ac1fa7ff2f89e1adbdf0aaf22e3ff53)
+- 🐞 Fix compatibility with less 3. [#7850](https://github.com/ant-design/ant-design/issues/7850)
+- 🐞 Fix `DatePicker.WeekPicker` year. [#9463](https://github.com/ant-design/ant-design/issues/9463)
+- 🐞 Fix `Button.Group` align issue in chrome. [#9457](https://github.com/ant-design/ant-design/issues/9457)
+
+## 3.2.2
+
+`2018-02-24`
+
+- 🌟 Add font-family variable for `Pagination`. [#9351](https://github.com/ant-design/ant-design/issues/9351)
+- 🌟 Add font-weight variable for `Badge`. [#9352](https://github.com/ant-design/ant-design/issues/9352)
+- 🐞 Fix table custom spin indicator. [#9355](https://github.com/ant-design/ant-design/issues/9355)
+- 🐞 Fix `Form.create`. [#9331](https://github.com/ant-design/ant-design/issues/9331)
+- 🐞 Revert typescript definition of `column.dataIndex`. [#9393](https://github.com/ant-design/ant-design/issues/9393)
+- 🐞 Fix last menu item in Sider could be blocked by collapse trigger. [#9398](https://github.com/ant-design/ant-design/issues/9398) [@MJ111](https://github.com/MJ111)
+- 🐞 Fix badge works wrong in dot mode. [#9359](https://github.com/ant-design/ant-design/issues/9359) [@khayalan-mathew](https://github.com/khayalan-mathew)
+
+## 3.2.1
+
+`2018-02-11`
+
+- 🌟 Add icons of some famous products. [c04377e5](https://github.com/ant-design/ant-design/commit/c04377e5413d344b37c34ceac6fee456933fa516)
+- Mention
+  - 🌟 `multiLines` mode will support autosize.
+  - 🐞 Fix paste not working when `placeholder` is specified. [#9215](https://github.com/ant-design/ant-design/issues/9215)
+- Table
+  - 🐞 Fix padding of middle size table. [#9319](https://github.com/ant-design/ant-design/issues/9319)
+  - 🐞 Fix border bug of small size table. [#8980](https://github.com/ant-design/ant-design/issues/8980)
+  - 🐞 Fix overflow issue of sort icon interactive area. [#8979](https://github.com/ant-design/ant-design/issues/8979)
+  - 🌟 Improve typescript definition of `column.dataIndex`. [#9298](https://github.com/ant-design/ant-design/pull/9298) [@clinyong](https://github.com/clinyong)
+- Select
+  - 🐞 Fix wrong scroll position when navigating active item with keyboard. [#9276](https://github.com/ant-design/ant-design/issues/9276)
+  - 🐞 Fix arrow position in IE11.
+- 🐞 Fix issue that file item showing `uploading` when Upload `beforeUpload` return false. [#8020](https://github.com/ant-design/ant-design/issues/8020)
+- 🐞 Fix misplace of feedback icon of `vertical` layout Form. [#9153](https://github.com/ant-design/ant-design/issues/9153)
+- 🐞 Fix loading style missing of empty childen Card. [#9258](https://github.com/ant-design/ant-design/issues/9258)
+- 🐞 Fix background color of Avatar when image source is not existe. [#9278](https://github.com/ant-design/ant-design/pull/9278) [@andriijas](https://github.com/andriijas)
+- 🐞 Fix RangePicker `Cannot read property 'locale' of undefined` error when select end date. [#9267](https://github.com/ant-design/ant-design/issues/9267)
+- 🐞 Fix style problem when using disabled button with Tooltip inside ButtonGroup. [#9296](https://github.com/ant-design/ant-design/issues/9296) [#9296](https://github.com/ant-design/ant-design/issues/9296)
+- 🐞 Fix z-index of Dropdown's submenu. [#9218](https://github.com/ant-design/ant-design/issues/9218)
+
+## 3.2.0
+
+`2018-02-04`
+
+- 🌟 Add new `tabBarGutter` prop to Tab to allow setting gutter between tabs. [#8644](https://github.com/ant-design/ant-design/pull/8644) [@lixiaoyang1992](https://github.com/lixiaoyang1992)
+- 🌟 Add new `hasSider` prop to Layout to avoid render error when server rendering. [#8937](https://github.com/ant-design/ant-design/issues/8937)
+- 🌟 Add new `successPercent` to Progress to allow showing two phases. [Demo](https://ant.design/components/progress/#components-progress-demo-segment)
+- 🌟 Add new `iconType` prop to Alert to allow settting icon type. [#8811](https://github.com/ant-design/ant-design/pull/8811) [@minwe](https://github.com/ant-design/ant-design/pull/8811)
+- 🌟 Add `id` prop to DatePicker. [#8598](https://github.com/ant-design/ant-design/pull/8598) [@mgrdevport](https://github.com/mgrdevport)
+- 🌟 Add new `forceRender` prop to Collapse to allow rendering hide panel. [#9192](https://github.com/ant-design/ant-design/pull/9192) [#Pyroboomka](https://github.com/ant-design/ant-design/pull/9192) [@paulcmason](https://github.com/react-component/collapse/pull/82)
+- RangePicker
+  - 🌟 Improve `ranges` prop to allow passing function to it. [#8281](https://github.com/ant-design/ant-design/issues/8281)
+  - 🐞 Fix issue resulting in can not input start date manually. [#6999](https://github.com/ant-design/ant-design/issues/6999)
+  - 🐞 Fix issue resulting date panel being closed without animation when click on the preset range. [#6364](https://github.com/ant-design/ant-design/issues/6364)
+  - 🐞 Fix issue resulting `onOk` is not being trigged, when click on the preset range. [#7747](https://github.com/ant-design/ant-design/issues/7747)
+- Select
+  - 🌟 Improve `onChange`, `onDeselect`, they will receive selected `Option` as second paramteter.
+  - 🐞 Fix issue resulting in `onSelect` is not trigged when using automatic tokenization. [#9094](https://github.com/ant-design/ant-design/issues/9094)
+  - 🐞 Fix the missing scrollbar in Chrome.
+- 🌟 Improve Table's `rowSelection[getCheckboxProps]` prop, now the all the properties returned by `getCheckboxProps` will be passed to checkbox. [#9054](https://github.com/ant-design/ant-design/pull/9054) [@mgrdevport](https://github.com/ant-design/ant-design/pull/9054)
+- 🐞 Fix issue resulting in Calendar's `mode` not being allowed to be changed from outside. [#9243](https://github.com/ant-design/ant-design/pull/9243) [@mgrdevport](https://github.com/ant-design/ant-design/pull/9243)
+- 🐞 Fix issue resulting AutoComplete showing wrong border when showing validattion message.[9f2b490](https://github.com/ant-design/ant-design/commit/9f2b4905f09fca503da7a8bb5f2b8347bea663b7)
+- 🐞 Fix issue resulting in DatePicker showing wrong time in the control mode. [#8885](https://github.com/ant-design/ant-design/issues/8885)
+- 🐞 Fix issue resulting in TextArea showing wrong height in Edge. [#9108](https://github.com/ant-design/ant-design/pull/9108) [@cuyl](https://github.com/cuyl)
+- 🐞 Fix issue resulting in Tabs showing wrong tab style when using `type="card"` combine with `tabPosition="bottom"`. [#9165](https://github.com/ant-design/ant-design/pull/9165) [@ryanhoho](https://github.com/ryanhoho)
+- 🌟 Add new Kurdish locale.
+
+## 3.1.6
+
+`2018-01-28`
+
+- 🐞 Revert [#9141](https://github.com/ant-design/ant-design/pull/9141) since it causes year and month can not be selected in DatePicker.
+
+
+## 3.1.5
+
+`2018-01-27`
+
+- 🐞 Fix Select Options were disappeared when click the scrollbar in IE11. [#7934](https://github.com/ant-design/ant-design/issues/7934) [@tianlang89757](https://github.com/tianlang89757)
+- 🐞 Fix Form `getFieldDecorator` referenced item will conflicted when using the same id. [#9103](https://github.com/ant-design/ant-design/issues/9103) [#7351](https://github.com/ant-design/ant-design/issues/7351)
+- 🐞 Fix RangePicker i18n issue which will shown the last language when change the language. [#8970](https://github.com/ant-design/ant-design/issues/8970)
+- 🐞 Fix DatePicker shown wrong in the control mode. [#8885](https://github.com/ant-design/ant-design/issues/8885)
+- 🐞 Fix Table shown emptyText when loading state. [#9095](https://github.com/ant-design/ant-design/pull/9095) [@sallen450](https://github.com/sallen450)
+- 🐞 Add Icon `file-word`. [#9092](https://github.com/ant-design/ant-design/issues/9092) [#9061](https://github.com/ant-design/ant-design/issues/9061)
+- 🐞 Fix wrong font family. [commit/506f97](https://github.com/ant-design/ant-design/commit/506f97640ec34a6d3d9fdb18e8036e5d34796a5f)
+- 📖 Add some TypeScript type definitions
+  - Add `duration` for Notification. [pull/9120](https://github.com/ant-design/ant-design/pull/9120) [@duhongjun](https://github.com/duhongjun)
+  - Add `style` for Steps. [pull/9126](https://github.com/ant-design/ant-design/pull/9126) [@wanliyunyan](https://github.com/wanliyunyan)
+- 🌟 Optimize Avatar default background color. [commit/275946](https://github.com/ant-design/ant-design/commit/275946090823ab8da90f1871976c671b2c7ac851)
+- 🌟 Add the less variable for Slider and Menu. [pull/9065](https://github.com/ant-design/ant-design/pull/9065) [pull/9115](https://github.com/ant-design/ant-design/pull/9115)  [@mrgeorgegray](https://github.com/mrgeorgegray)
+
+## 3.1.4
+
+`2018-01-21`
+
+- 🐞 Fix ButtonGroup z-index issue. [#9014](https://github.com/ant-design/ant-design/issues/9014)
+- 🐞 Fix Dropdown.Button can not be fully disabled. [#8991](https://github.com/ant-design/ant-design/issues/8991) [@sallen450](https://github.com/sallen450)
+- 🐞 Fix Layout error responsive docs. [#8995](https://github.com/ant-design/ant-design/pull/8995) [@ReedSun](https://github.com/ReedSun)
+- 🐞 Fix List `grid` do not support xxl. [#9019](https://github.com/ant-design/ant-design/issues/9019)
+- 🐞 Fix RangePicker can not cancel selected start date when the panel is closed. [#8839](https://github.com/ant-design/ant-design/issues/8839)
+- 🐞 Fix Tabs error margin. [commit/200d6c](https://github.com/ant-design/ant-design/commit/200d6cb11aba12a488510f957353bbd5bd1dcd1b)
+- 🐞 Fix WeekPicker shows error weeks. [#9021](https://github.com/ant-design/ant-design/issues/9021)
+- 🐞 Fix some TypeScript type definitions.
+  - Add `subMenuCloseDelay` and `subMenuOpenDelay` for Menu. [#8976](https://github.com/ant-design/ant-design/issues/8976) [@Rohanhacker](https://github.com/Rohanhacker)
+  - Refactor DatePicker types. [commit/0bb531](https://github.com/ant-design/ant-design/commit/0bb531aca6cb2045d5323196a599c925537a4eb0)
+  - Fix Input `maxLength` type definitions. [#9046](https://github.com/ant-design/ant-design/pull/9046) [@Riokai](https://github.com/Riokai)
+- 🌟 Add some new less variables.
+  - About Checkbox and Radio: [#9003](https://github.com/ant-design/ant-design/pull/9003) [@mrgeorgegray](https://github.com/mrgeorgegray)
+  - About Breadcrumb: [#9022](https://github.com/ant-design/ant-design/pull/9022) [@mrgeorgegray](https://github.com/mrgeorgegray)
+- 🌟 Add aliyun icon.
+
 ## 3.1.3

-`2019-01-14`
+`2018-01-14`

 - 🐞 Fix error when passing `null` `locale` to LocaleProvider.

@@ -225,7 +465,7 @@ We provide a [migration tool](https://github.com/ant-design/antd-migration-helpe
  - 🌟 `status` can use whith `children` now. [#8164](https://github.com/ant-design/ant-design/issues/8164)
 - Card
  - 🌟 Added new `inner` type. [Demo](https://ant.design/components/card/#components-card-demo-inner)。
-  - 🌟 Added `cover`、`actions` and a new `Meta` component. [Demo](https://ant.design/components/card/#components-card-demo-meta)。
+  - 🌟 Added `cover`, `actions` and a new `Meta` component. [Demo](https://ant.design/components/card/#components-card-demo-meta)。
 - DatePicker
  - 🌟 Added `mode` and `onPanelChange`，to allow controlling the panel mode. [Demo](https://ant.design/components/date-picker/#components-date-picker-demo-mode)。
  - 🌟 Added `WeekPicker` component. [Demo](https://ant.design/components/date-picker/#components-date-picker-demo-basic)
@@ -261,7 +501,7 @@ We provide a [migration tool](https://github.com/ant-design/antd-migration-helpe
  - 🌟 Added `column[defaultSortOrder]` to allow setting default sort order. [#8111](https://github.com/ant-design/ant-design/pull/8111) [@megawac](https://github.com/megawac)
  - 🌟 Added `rowSelection[fixed]` to allow fixing the selection column.。
  - 🙅 Deprecated `getBodyWrapper`, please use `components` instead.
-  - 🙅 Deprecated `onRowClick`，`onRowDoubleClick`、`onRowContextMenu`、`onRowMouseEnter`、`onRowMouseLeave`, please use `onRow` instead.
+  - 🙅 Deprecated `onRowClick`，`onRowDoubleClick`, `onRowContextMenu`, `onRowMouseEnter`, `onRowMouseLeave`, please use `onRow` instead.
    ```javascript
    <Table onRow={(record) => ({
      onClick: () => {},
--- a/CHANGELOG.zh-CN.md
+++ b/CHANGELOG.zh-CN.md
@@ -15,9 +15,250 @@ timeline: true

 ---

+## 3.4.4
+
+`2018-04-28`
+
+- 🐞 修复 3.4.2 中引入的 Upload 中 onChange 参数 `{ file }` file 不是 File 实例的问题。[#10293](https://github.com/ant-design/ant-design/issues/10293)
+- 🐞 修复 webpack@4 下使用 Tree Shaking 样式丢失的问题。[#10217](https://github.com/ant-design/ant-design/pull/10217) [@whtsky](https://github.com/whtsky)
+
+## 3.4.3
+
+`2018-04-23`
+
+- 🐞 修复了 webpack@4 下使用 Tree Shaking 样式丢失的问题。[#10197](https://github.com/ant-design/ant-design/pull/10197) [@Aladdin-ADD](https://github.com/Aladdin-ADD)
+- 🐞 修复 `Menu` 组件在 `dark` 主题下点击区域的问题。[#10187](https://github.com/ant-design/ant-design/pull/10187) [@dgeibi](https://github.com/dgeibi)
+
+## 3.4.2
+
+`2018-04-22`
+
+- 💄 部署网站到 [netlify](http://netlify.com/)，解决网站被墙的问题。
+- 🐞 修复和调整 Menu、Tooltip、Card、Anchor、Avatar、Form、Tabs、Transfer、Tree、AutoComplete 等组件的 TypeScript 定义。
+- 💄 增加 `sideEffects` 配置以优化 Tree Shaking 效果。[#10043](https://github.com/ant-design/ant-design/pull/10043) [@Aladdin-ADD](https://github.com/Aladdin-ADD)
+- List
+  - 🐞 修复多余边框问题。[#10028](https://github.com/ant-design/ant-design/issues/10028)
+  - 🐞 修复 `locale` 属性被传递给 div 的警告。[#10128](https://github.com/ant-design/ant-design/pull/10128) [@slonoed](https://github.com/slonoed)
+- 🐞 修复 Upload 的文件 url 带有参数时，图片预览效果失效的问题。[#10102](https://github.com/ant-design/ant-design/issues/10102)
+- 🐞 修复 Progress 的百分比越界时的展现。[0eb8357](https://github.com/ant-design/ant-design/commit/0eb835772dbaa7ed14babe03fc177821c5bd5ca5)
+- Menu
+  - 🐞 修复 SubMenu 的失效箭头样式。[#10113](https://github.com/ant-design/ant-design/issues/10113)
+  - 🐞 修复 `collapsedWidth` 为像素字符串 `40px` 菜单宽度失效的问题。[#10140](https://github.com/ant-design/ant-design/issues/10140)
+- 🐞 修复一个某些情况下 Form 内使用受控组件时无法编辑的问题。[#9790](https://github.com/ant-design/ant-design/issues/9790)
+- 🐞 修复 Card 切换 loading 状态时的内边距跳动问题。[#10052](https://github.com/ant-design/ant-design/pull/10052) [@zheeeng](https://github.com/zheeeng)
+- 🐞 修复 Avatar 图片加载失败时的文字没有正确缩放的问题。[#10184](https://github.com/ant-design/ant-design/pull/10184)
+- 🐞 修复 Table 的 `getCheckboxProps` 无法动态更新的问题。[#10133](https://github.com/ant-design/ant-design/issues/10133)
+- 🐞 修复 CheckGroup 指定 `prefixCls` 没有传递给 Checkbox 的问题。[#9950](https://github.com/ant-design/ant-design/issues/9950)
+
+## 3.4.1
+
+`2018-04-08`
+
+- 🐞 修复了 Badge 代码错误引起的 TypeScript 类型报错。[#9931](https://github.com/ant-design/ant-design/issues/9931)
+- 💄 优化了 Card `actions` 点击区域的范围。[#9882](https://github.com/ant-design/ant-design/issues/9882)
+- 🐞 修复了 Divider 与浮动元素一起使用时的样式问题。[#9956](https://github.com/ant-design/ant-design/issues/9956)
+- 🐞 修复了 Form 高级搜索模式下的样式问题。[#9907](https://github.com/ant-design/ant-design/issues/9907)
+- 🐞 补充了 Table 缺失的 `onHeaderRow` TypeScript 定义。[#9902](https://github.com/ant-design/ant-design/pull/9902) [@Nokecy](https://github.com/Nokecy)
+- 💄 优化了 Tree 自定义图标示例。[#9893](https://github.com/ant-design/ant-design/pull/9893)
+- 🐞 修复了 Upload 对无扩展名图片地址的预览展示问题。[#9936](https://github.com/ant-design/ant-design/pull/9936)
+
+## 3.4.0
+
+`2018-04-01`
+
+- Tree
+  - 🛠 在这个版本里，我们重构了 Tree 底层的代码，以解决一些存在了很久的问题。
+  - 🌟 新增 `defaultExpandParent` 用于在第一次渲染时自动展开父节点。
+  - 🌟 新增 `disabled` 用于禁用整棵树。
+  - 🌟 TreeNode 新增 `icon` 用于设置自定义图标。
+  - 🌟 优化了 TreeNode 设置 `disabled` 时的勾选逻辑。
+- 🌟 Anchor 新增 `getContainer` 用于指定内容滚动的容器。
+- 🌟 Table 新增 less 变量 `@table-expanded-row-bg`。[#9789](https://github.com/ant-design/ant-design/pull/9789)
+- 🐞 修复一处 less 语法错误。[#9832](https://github.com/ant-design/ant-design/pull/9832) [@jojoLockLock](https://github.com/jojoLockLock)
+- 🐞 修复 LocaleProvider 中 moment.locale 调用报错的问题。 [#9853](https://github.com/ant-design/ant-design/pull/9853)
+- 🐞 修复 WeekPicker 的 style 属性不生效的问题。[#9848](https://github.com/ant-design/ant-design/issues/9848)
+- 🐞 修复 Layout.Sider 的 TypeScript 定义。[#9885](https://github.com/ant-design/ant-design/pull/9885) [@zachguo](https://github.com/zachguo)
+- 💄 优化了 Modal 中超长内容的显示。[#9592](https://github.com/ant-design/ant-design/pull/9592)
+- 🌟 新增斯洛维尼亚语。
+
+## 3.3.3
+
+`2018-03-25`
+
+- 回退上个版本 Upload 中 `file` 类型的修改。
+
+## 3.3.2
+
+`2018-03-24`
+
+- 🐞 `Carousel`: 升级 `react-slick` 版本以修复宽度计算错误。 [#3659](https://github.com/ant-design/ant-design/issues/3659)
+- 💄 `Rate`: 调整 `disabled` 样式。 [#9747](https://github.com/ant-design/ant-design/issues/9747)
+- 💄 `Modal`: 调整 `confirm-modal` 样式以修复 content 内使用栅格会错位的问题。 [#9374](https://github.com/ant-design/ant-design/issues/9374)
+- 💄 `Menu`: 调整样式以修复鼠标事件范围。[#9666](https://github.com/ant-design/ant-design/pull/9666) [@dgeibi](https://github.com/dgeibi)
+- 🐞 `Upload`: 修复 `beforeUpload` 的 `file` 类型错误。 [#9775](https://github.com/ant-design/ant-design/issues/9775)
+- 🐞 `Button`: 修复文本改变时，空格插入没有重新计算 [4502ad8](https://github.com/ant-design/ant-design/commit/4502ad8376e536c450fa4f27d2a5855be5a153e7)
+
+## 3.3.1
+
+`2018-03-18`
+
+- 💄 调整 danger Button 的 `focus` 样式。
+- 🐞 修复 enterButton 的值为 button 元素时显示错误的问题。 [#9639](https://github.com/ant-design/ant-design/issues/9639)
+- 🐞 修复 Table 中的 `column.title` 的缺少 key 的问题。 [#9658](https://github.com/ant-design/ant-design/issues/9658) [@terence55](https://github.com/terence55)
+- 🐞 修复 `scroll: { x: true }` 在 `.ant-table-scroll table`宽度为 `auto`的情况下不工作的问题。[#9704](https://github.com/ant-design/ant-design/pull/9704)
+- 🐞 修复表单校验文字消失的时候输入框会抖一下的问题。 [#8831](https://github.com/ant-design/ant-design/issues/8831)
+- 🐞 修复 `TimePicker` 里的 isMoment 调用在 parcel 里会报错的问题。[85c78e4](https://github.com/ant-design/ant-design/commit/85c78e49a91737c2841dc42621db21ca248b62b4)
+- 💄 调整 Table 的圆角样式。 [#9674](https://github.com/ant-design/ant-design/pull/9674)
+
+## 3.3.0
+
+`2018-03-12`
+
+- 🌟 `Alert` 组件新增 `afterClose` 属性，用于实现更流畅的关闭效果。[#9448](https://github.com/ant-design/ant-design/pull/9448) [@Hughen](https://github.com/Hughen)
+- 🌟 `Calendar` 组件新增 `validRange` 属性，用于设置显示的时间范围。[71f65a0](https://github.com/ant-design/ant-design/commit/71f65a0be8e72a67f334c57e79ae3ff5fb640630) [@Rohanhacker](https://github.com/Rohanhacker)
+- 🌟 `Card` 组件新增 `defaultActiveTabKey` 属性，用于初始化选中面板的 key。[30fe88d](https://github.com/ant-design/ant-design/commit/30fe88d4bdcec765bf92ca32a755d9646b36978e) [@u3u](https://github.com/u3u)
+- `DatePicker`
+    - 🌟 新增 `dropdownClassName` 属性，用于设置弹出日历的 className。[#7211](https://github.com/ant-design/ant-design/issues/7211)
+    - 🐞 修复解析 `moment` 对象出错的问题。[#9539](https://github.com/ant-design/ant-design/pull/9539)
+    - 🐞 修复引入土耳其语 `tr_TR` 文件的问题。[#9373](https://github.com/ant-design/ant-design/issues/9373)
+- 🌟 `Divider` 组件新增 `orientation` 属性，用于设置分割线内文本的对齐方式。[#9275](https://github.com/ant-design/ant-design/pull/9275) [@jrvboesch](https://github.com/jrvboesch)
+- 🌟 `Modal` 组件新增 `keyboard` 属性，用于设置按下 `Esc` 键是否可以关闭 `Modal`。[#8818](https://github.com/ant-design/ant-design/issues/8818)
+- 🌟 优化 `Radio` 和 `Checkbox` 组件 `onChange` 属性中的事件参数的 `TypeScript` 类型定义的问题。[#9574](https://github.com/ant-design/ant-design/issues/9574)
+- `Table`
+    - 🌟 新增 `pagination` 属性的配置项 `position`，用于设置分页的显示位置。[#9357](https://github.com/ant-design/ant-design/pull/9357) [@kanweiwei](https://github.com/kanweiwei)
+    - 🌟 新增 `rowSelection` 属性的配置项 `onSelect` 回调函数的事件参数。[#9376](https://github.com/ant-design/ant-design/pull/9376) [@kanweiwei](https://github.com/kanweiwei)
+    - 🌟 新增 `rowSelection` 属性的配置项 `columnWidth`，用于设置选择框的列宽。[#9474](https://github.com/ant-design/ant-design/pull/9474) [@SimpleFrontend](https://github.com/SimpleFrontend)
+    - 🐞 修复 `Table` 组件在 `Chrome` 下圆角边框样式的问题。[af8e54f](https://github.com/ant-design/ant-design/commit/af8e54f1d6ac2891892e39b153cbe3e998370f61)
+- 🌟 `Timeline` 组件新增 `pendingDot` 属性，用于设置幽灵节点的图标。[#9546](https://github.com/ant-design/ant-design/pull/9546) [@SimpleFrontend](https://github.com/SimpleFrontend)
+- 🌟 `TimePicker` 组件新增 `inputReadOnly` 属性，用于设置组件是否只读。[4a69446](https://github.com/ant-design/ant-design/commit/4a69446be155c1c176b18cb2c31459f999aa5d5e) [@JesperWe](https://github.com/JesperWe)
+- 🌟 `TreeSelect` 组件新增 `dropdownClassName` 属性。[69b154f](https://github.com/ant-design/ant-design/commit/69b154f9a9cfa5f2d89a82b6ed730d4d8793de73) [56e4ce0](https://github.com/ant-design/ant-design/commit/56e4ce099d950601538d72243563021e8083776b)
+- 🌟 优化 `Upload` 组件在上传非图片格式文件时的预览效果。[#9621](https://github.com/ant-design/ant-design/pull/9621) [@zswang](https://github.com/zswang)
+- 🐞 修复 `Progress` 组件的 `successPercent` 属性无法决定组件是否处于 `success` 状态的问题。[#9382](https://github.com/ant-design/ant-design/issues/9382)
+- 🐞 修复 `Tabs` 组件字体尺寸的问题。[#9509](https://github.com/ant-design/ant-design/pull/9509)
+- 🐞 修复 `Tree` 和 `TreeSelect` 组件的父节点在 `disabled` 状态下无法展开的问题。[#9539](https://github.com/ant-design/ant-design/pull/9539)
+
+## 3.2.3
+
+`2018-03-02`
+
+- 🐞 修复组件 `Select` 中的 `onPopupScroll` 属性的 ts 定义。 [#9475](https://github.com/ant-design/ant-design/pull/9475) [@twobin](https://github.com/twobin)
+- 🐞 修复 `Table` 过滤条件下拉选择框的问题。 [#9209](https://github.com/ant-design/ant-design/issues/9209)
+- 🐞 修复 `Timeline` 自定义头部样式在 Chrome 下的显示问题。 [#9429](https://github.com/ant-design/ant-design/pull/9429) [@vthinkxie](https://github.com/vthinkxie)
+- 🐞 修复 `Select` 下拉窗口的边框显示问题。 [82092c1](https://github.com/ant-design/ant-design/commit/82092c154ac1fa7ff2f89e1adbdf0aaf22e3ff53)
+- 🐞 修复对 less 3 的兼容性问题。 [#7850](https://github.com/ant-design/ant-design/issues/7850)
+- 🐞 修复 `DatePicker.WeekPicker` 年份问题。 [#9463](https://github.com/ant-design/ant-design/issues/9463)
+- 🐞 修复 `Button.Group` 在 Chrome 下的定位对齐问题。 [#9457](https://github.com/ant-design/ant-design/issues/9457)
+
+## 3.2.2
+
+`2018-02-24`
+
+- 🌟 添加 `Pagination` 字体变量。 [#9351](https://github.com/ant-design/ant-design/issues/9351)
+- 🌟 添加 `Badge` 字重变量。 [#9352](https://github.com/ant-design/ant-design/issues/9352)
+- 🐞 修复 `Table` 当自定义 `loading.indicator` 时，不显示emptyText。 [#9355](https://github.com/ant-design/ant-design/issues/9355)
+- 🐞 修复 `Form.create` 。 [#9331](https://github.com/ant-design/ant-design/issues/9331)
+- 🐞 回滚 `Table` 中 `column.dataIndex` 的 TypeScript 定义。 [#9393](https://github.com/ant-design/ant-design/issues/9393)
+- 🐞 修复 `Layout` 中 sider 高度不足时，最后一个菜单无法显示。 [#9398](https://github.com/ant-design/ant-design/issues/9398) [@MJ111](https://github.com/MJ111)
+- 🐞 修复 `Badge` dot 模式问题。 [#9359](https://github.com/ant-design/ant-design/issues/9359) [@khayalan-mathew](https://github.com/khayalan-mathew)
+
+## 3.2.1
+
+`2018-02-11`
+
+- 🌟 新增了部分著名产品的图标。[c04377e5](https://github.com/ant-design/ant-design/commit/c04377e5413d344b37c34ceac6fee456933fa516)
+- Mention
+  - 🌟 现在 `multiLines` 模式的高度将默认自适应内容。
+  - 🐞 修复指定了 `placeholder` 时无法粘贴内容的问题。[#9215](https://github.com/ant-design/ant-design/issues/9215)
+- Table
+  - 🐞 修复中号表格的 padding。[#9319](https://github.com/ant-design/ant-design/issues/9319)
+  - 🐞 修复小号表格的边框错位问题。[#8980](https://github.com/ant-design/ant-design/issues/8980)
+  - 🐞 修复排序图标点击区域溢出表头的问题。[#8979](https://github.com/ant-design/ant-design/issues/8979)
+  - 🌟 优化了 `column.dataIndex` 的 TypeScript 定义。[#9298](https://github.com/ant-design/ant-design/pull/9298) [@clinyong](https://github.com/clinyong)
+- Select
+  - 🐞 修复使用键盘导航时，滚动条不会自动定位的问题。[#9276](https://github.com/ant-design/ant-design/issues/9276)
+  - 🐞 修复在 IE11 下的箭头位置。
+- 🐞 修复 Upload `beforeUpload` 返回 `false` 时，上传文件仍然显示 `uploading` 以及文件列表被替换的问题。[#8020](https://github.com/ant-design/ant-design/issues/8020)
+- 🐞 修复 `vertical` 布局的 Form 下反馈图标错位的问题。[#9153](https://github.com/ant-design/ant-design/issues/9153)
+- 🐞 修复 Card 没有子节点时 `loading` 样式不生效的问题。[#9258](https://github.com/ant-design/ant-design/issues/9258)
+- 🐞 修复 Avatar 的图片不存在时的背景色。[#9278](https://github.com/ant-design/ant-design/pull/9278) [@andriijas](https://github.com/andriijas)
+- 🐞 修复 RangePicker 选择结束时间时报 `Cannot read property 'locale' of undefined` 的问题。[#9267](https://github.com/ant-design/ant-design/issues/9267)
+- 🐞 修复 ButtonGroup 内使用了失效按钮和 Tooltip 时样式错位的问题。[#9296](https://github.com/ant-design/ant-design/issues/9296) [#9296](https://github.com/ant-design/ant-design/issues/9296)
+- 🐞 修复 Dropdown 的子菜单被遮挡的问题。[#9218](https://github.com/ant-design/ant-design/issues/9218)
+
+## 3.2.0
+
+`2018-02-04`
+
+- 🌟 Tab 新增 `tabBarGutter` 属性，用于设置 tabs 之间的间隙。[#8644](https://github.com/ant-design/ant-design/pull/8644) [@lixiaoyang1992](https://github.com/lixiaoyang1992)
+- 🌟 Layout 新增 `hasSider` 属性，用于避免服务端渲染时显示问题。[#8937](https://github.com/ant-design/ant-design/issues/8937)
+- 🌟 Progress 新增 `successPercent` 属性，用于显示分段进度条。[例子](https://ant.design/components/progress-cn/#components-progress-demo-segment)
+- 🌟 Alert 新增 `iconType` 属性，用于显示自定义图标。[#8811](https://github.com/ant-design/ant-design/pull/8811) [@minwe](https://github.com/ant-design/ant-design/pull/8811)
+- 🌟 DatePicker 新增 `id` 属性。[#8598](https://github.com/ant-design/ant-design/pull/8598) [@mgrdevport](https://github.com/mgrdevport)
+- 🌟 Collapse 新增 `forceRender` 属性，用于渲染隐藏的内容。[#9192](https://github.com/ant-design/ant-design/pull/9192) [#Pyroboomka](https://github.com/ant-design/ant-design/pull/9192) [@paulcmason](https://github.com/react-component/collapse/pull/82)
+- RangePicker
+  - 🌟 改进 `ranges` 属性，使其支持方法。[#8281](https://github.com/ant-design/ant-design/issues/8281)
+  - 🐞 修复无法手动输入开始时间的问题。[#6999](https://github.com/ant-design/ant-design/issues/6999)
+  - 🐞 修复点击预设范围关闭日期面板的时候没有动画的问题。[#6364](https://github.com/ant-design/ant-design/issues/6364)
+  - 🐞 修复点击预设范围时不触发 `onOk` 的问题。[#7747](https://github.com/ant-design/ant-design/issues/7747)
+- Select
+  - 🌟 改进了 `onChange`、`onDeselect` 方法，现在他们会接受选中的 `Option` 作为第二个参数。
+  - 🐞 修复自动分词不触发 `onSelect` 的问题。[#9094](https://github.com/ant-design/ant-design/issues/9094)
+  - 🐞 修复 Chrome 上下拉框没有滚动条的问题。
+- 🌟 改进 Table 的 `rowSelection[getCheckboxProps]` 属性，现在可以传任意属性给 chekbox 了。[#9054](https://github.com/ant-design/ant-design/pull/9054) [@mgrdevport](https://github.com/ant-design/ant-design/pull/9054)
+- 🐞 修复 Calendar 的 `mode` 属性不能从外部控制的问题。[#9243](https://github.com/ant-design/ant-design/pull/9243) [@mgrdevport](https://github.com/ant-design/ant-design/pull/9243)
+- 🐞 修复 AutoComplete 在 Form 中显示错误信息时的边框颜色。[9f2b490](https://github.com/ant-design/ant-design/commit/9f2b4905f09fca503da7a8bb5f2b8347bea663b7)
+- 🐞 修复 DatePicker 在受控模式下时间显示不正确的问题。[#8885](https://github.com/ant-design/ant-design/issues/8885)
+- 🐞 修复 TextArea 在 Edge 下高度计算错误的问题。[#9108](https://github.com/ant-design/ant-design/pull/9108) [@cuyl](https://github.com/cuyl)
+- 🐞 修复 Tabs 在 card 模式且 tabPosition 是 `bottom` 时的样式问题。[#9165](https://github.com/ant-design/ant-design/pull/9165) [@ryanhoho](https://github.com/ryanhoho)
+- 🌟 新增库尔德语。
+
+
+## 3.1.6
+
+`2018-01-28`
+
+- 🐞 回退了 [#9141](https://github.com/ant-design/ant-design/pull/9141) 的修改，因其导致的 DatePicker 年月无法选择。
+
+## 3.1.5
+
+`2018-01-27`
+
+- 🐞 修复了 Select 下拉选择框在 IE11 点击滚动条会无故消失的问题。[#7934](https://github.com/ant-design/ant-design/issues/7934) [@tianlang89757](https://github.com/tianlang89757)
+- 🐞 修复了 Form 中使用 `getFieldDecorator` 当 id 重复时引用冲突的问题。[#9103](https://github.com/ant-design/ant-design/issues/9103) [#7351](https://github.com/ant-design/ant-design/issues/7351)
+- 🐞 修复了 RangePicker 在语言切换时会显示上一次的语言的问题。[#8970](https://github.com/ant-design/ant-design/issues/8970)
+- 🐞 修复了 DatePicker 在受控模式下时间显示不正确的问题。[#8885](https://github.com/ant-design/ant-design/issues/8885)
+- 🐞 修复了 Table 在 `loading` 时显示空提示的问题。[#9095](https://github.com/ant-design/ant-design/pull/9095) [@sallen450](https://github.com/sallen450)
+- 🐞 补充 Icon 类型 `file-word`。[#9092](https://github.com/ant-design/ant-design/issues/9092) [#9061](https://github.com/ant-design/ant-design/issues/9061)
+- 🐞 修复写错的字体名称，造成浏览器无法正确识别的问题。[commit/506f97](https://github.com/ant-design/ant-design/commit/506f97640ec34a6d3d9fdb18e8036e5d34796a5f)
+- 📖 修复了 TypeScript 定义
+  - 补充 Notification 缺失的 `duration` 定义。[pull/9120](https://github.com/ant-design/ant-design/pull/9120) [@duhongjun](https://github.com/duhongjun)
+  - 补充 Steps 缺失的 `style` 定义。[pull/9126](https://github.com/ant-design/ant-design/pull/9126) [@wanliyunyan](https://github.com/wanliyunyan)
+- 🌟 优化了 Avatar 的默认背景色。[commit/275946](https://github.com/ant-design/ant-design/commit/275946090823ab8da90f1871976c671b2c7ac851)
+- 🌟 新增了 Slider 以及 Menu 的 less 变量，更加方便的修改主题。[pull/9065](https://github.com/ant-design/ant-design/pull/9065) [pull/9115](https://github.com/ant-design/ant-design/pull/9115)  [@mrgeorgegray](https://github.com/mrgeorgegray)
+
+## 3.1.4
+
+`2018-01-21`
+
+- 🐞 修复 ButtonGroup 错误 z-index 导致的样式问题。[#9014](https://github.com/ant-design/ant-design/issues/9014)
+- 🐞 修复 Dropdown.Button 不能被完全禁用的问题。[#8991](https://github.com/ant-design/ant-design/issues/8991) [@sallen450](https://github.com/sallen450)
+- 🐞 修复 Layout 错误的响应式相关文档。[#8995](https://github.com/ant-design/ant-design/pull/8995) [@ReedSun](https://github.com/ReedSun)
+- 🐞 修复 List `grid` 不支持 xxl 配置的问题。[#9019](https://github.com/ant-design/ant-design/issues/9019)
+- 🐞 修复 RangePicker 关闭选择面板之后无法清空已选开始时间的问题。[#8839](https://github.com/ant-design/ant-design/issues/8839)
+- 🐞 修复 Tabs 错误外边距导致的样式问题。[commit/200d6c](https://github.com/ant-design/ant-design/commit/200d6cb11aba12a488510f957353bbd5bd1dcd1b)
+- 🐞 修复 WeekPicker 显示错误周数的问题。[#9021](https://github.com/ant-design/ant-design/issues/9021)
+- 🐞 修复 TypeScript 定义
+  - 补充 Menu 缺失的 `subMenuCloseDelay` 和 `subMenuOpenDelay`。[#8976](https://github.com/ant-design/ant-design/issues/8976) [@Rohanhacker](https://github.com/Rohanhacker)
+  - 重构了 DatePicker 相关 type 定义。[commit/0bb531](https://github.com/ant-design/ant-design/commit/0bb531aca6cb2045d5323196a599c925537a4eb0)
+  - 修复了 Input `maxLength` type 定义。[#9046](https://github.com/ant-design/ant-design/pull/9046) [@Riokai](https://github.com/Riokai)
+- 🌟 新增 less 变量
+  - Checkbox 和 Radio 相关：[#9003](https://github.com/ant-design/ant-design/pull/9003) [@mrgeorgegray](https://github.com/mrgeorgegray)
+  - Breadcrumb 相关：[#9022](https://github.com/ant-design/ant-design/pull/9022) [@mrgeorgegray](https://github.com/mrgeorgegray)
+- 🌟 新增 aliyun 图标。
+
 ## 3.1.3

-`2019-01-14`
+`2018-01-14`

 - 🐞 修复 `locale` 为 `null` 时 LocaleProvider 出错的问题。

@@ -284,7 +525,7 @@ timeline: true
    ```
 - Select
  - 🌟 默认和多选模式下 Option 的值允许使用 number。
-  - 🌟 新增 `maxTagCount 和 `maxTagPlaceholder`，用与设置最多可显示的选中项。
+  - 🌟 新增 `maxTagCount 和 `maxTagPlaceholder`，用于设置最多可显示的选中项。
  - 🌟 新增 `showAction`，用于设置出发下拉框打开的事件。
  - 🌟 新增 `onMouseEnter` 和 `onMouseLeave` 事件回调。
 - LocaleProvider
--- a/README-zh_CN.md
+++ b/README-zh_CN.md
@@ -11,7 +11,7 @@
 [![Dependency Status](https://img.shields.io/gemnasium/react-component/trigger.svg?style=flat-square)](https://gemnasium.com/ant-design/ant-design)

 [![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
-[![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](https://npmjs.org/package/antd)
+[![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](http://www.npmtrends.com/antd)
 [![Percentage of issues still open](http://isitmaintained.com/badge/open/ant-design/ant-design.svg)](http://isitmaintained.com/project/ant-design/ant-design "Percentage of issues still open")
 [![Gitter](https://badges.gitter.im/ant-design/ant-design-english.svg)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) (English)
 [![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)（中文）
@@ -25,7 +25,7 @@
 - 提炼自企业级中后台产品的交互语言和视觉风格。
 - 开箱即用的高质量 React 组件。
 - 使用 TypeScript 构建，提供完整的类型定义文件。
- 基于 npm + webpack + [dva](https://github.com/dvajs/dva) 的企业级开发框架。
+- 全链路开发和设计工具体系。

 ## 支持环境

@@ -35,7 +35,7 @@

 ## 参与共建 [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)

-`antd` 是一个开源项目，我们欢迎社区参与共建。如果你对此项目感兴趣，有 [很多方式](https://opensource.guide/how-to-contribute/) 进行参与。你可以 watch 这个仓库，加入 [issue 中的讨论](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3ADiscussion)，以及尝试实现一些 [已接受的特性](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3A%22PR+welcome%22)。我们会给予有活跃贡献的社区成员 [collaborator 权限](https://github.com/ant-design/ant-design/issues/3222)。
+请参考[贡献指南](https://ant.design/docs/react/contributing-cn).

 ## 安装

@@ -88,6 +88,7 @@ import 'antd/dist/antd.css';  // or 'antd/dist/antd.less'

 ```bash
 $ git clone git@github.com:ant-design/ant-design.git
+$ cd ant-design
 $ npm install
 $ npm start
 ```
--- a/README.md
+++ b/README.md
@@ -11,7 +11,7 @@
 [![Dependency Status](https://img.shields.io/gemnasium/react-component/trigger.svg?style=flat-square)](https://gemnasium.com/ant-design/ant-design)

 [![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
-[![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](https://npmjs.org/package/antd)
+[![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](http://www.npmtrends.com/antd)
 [![Percentage of issues still open](http://isitmaintained.com/badge/open/ant-design/ant-design.svg)](http://isitmaintained.com/project/ant-design/ant-design "Percentage of issues still open")
 [![Gitter](https://badges.gitter.im/ant-design/ant-design-english.svg)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) (English)
 [![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)（中文）
@@ -26,10 +26,10 @@ An enterprise-class UI design language and React-based implementation.

 ## Features

- An enterprise-class UI design language for web applications.
+- An enterprise-class UI design system for desktop applications.
 - A set of high-quality React components out of the box.
- Written in TypeScript with complete define types.
- A npm + webpack + [dva](https://github.com/dvajs/dva) front-end development workflow.
+- Written in TypeScript with predictable static types.
+- The whole package of development and design resources and tools.

 ## Environment Support

@@ -39,7 +39,7 @@ An enterprise-class UI design language and React-based implementation.

 ## Let's build a better antd together [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)

-Read our [contributing guide](./.github/CONTRIBUTING.md).
+Read our [contributing guide](https://ant.design/docs/react/contributing).

 ## Install

@@ -92,6 +92,7 @@ See [i18n](http://ant.design/docs/react/i18n).

 ```bash
 $ git clone git@github.com:ant-design/ant-design.git
+$ cd ant-design
 $ npm install
 $ npm start
 ```
--- a/components/tests/index.test.js
+++ b/components/tests/index.test.js
@@ -1,7 +1,15 @@
-import * as antd from '..';
+const warnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});
+const antd = require('..');

 describe('antd', () => {
  it('exports modules correctly', () => {
    expect(Object.keys(antd)).toMatchSnapshot();
  });
+
+  it('should hint when import all components', () => {
+    expect(warnSpy).toBeCalledWith(
+      'You are using a whole package of antd, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size.'
+    );
+    warnSpy.mockRestore();
+  });
 });
--- a/components/_util/callMoment.tsx
+++ b/components/_util/callMoment.tsx
@@ -1,4 +0,0 @@
-// https://github.com/moment/moment/issues/3650
-export default function callMoment(moment: any, ...args: any[]) {
-  return (moment.default || moment)(...args);
-}
--- a/components/_util/interopDefault.ts
+++ b/components/_util/interopDefault.ts
@@ -0,0 +1,4 @@
+// https://github.com/moment/moment/issues/3650
+export default function interopDefault(m: any) {
+  return m.default || m;
+}
--- a/components/_util/throttleByAnimationFrame.tsx
+++ b/components/_util/throttleByAnimationFrame.tsx
@@ -2,7 +2,7 @@ import getRequestAnimationFrame, { cancelRequestAnimationFrame } from '../_util/

 const reqAnimFrame = getRequestAnimationFrame();

-export default function throttleByAnimationFrame(fn: () => void) {
+export default function throttleByAnimationFrame(fn: (...args: any[]) => void) {
  let requestId: number | null;

  const later = (args: any[]) => () => {
--- a/components/_util/type.ts
+++ b/components/_util/type.ts
@@ -0,0 +1,3 @@
+export type Diff<T extends string, U extends string> = ({ [P in T]: P } &
+  { [P in U]: never } & { [x: string]: never })[T];
+export type Omit<T, K extends keyof T> = Pick<T, Diff<keyof T, K>>;
--- a/components/affix/index.tsx
+++ b/components/affix/index.tsx
@@ -95,6 +95,7 @@ export default class Affix extends React.Component<AffixProps, AffixState> {
  };

  private fixedNode: HTMLElement;
+  private placeholderNode: HTMLElement;

  setAffixStyle(e: any, affixStyle: React.CSSProperties | null) {
    const { onChange = noop, target = getDefaultTarget } = this.props;
@@ -123,6 +124,21 @@ export default class Affix extends React.Component<AffixProps, AffixState> {
    this.setState({ placeholderStyle: placeholderStyle as React.CSSProperties });
  }

+  syncPlaceholderStyle(e: any) {
+    const { affixStyle } = this.state;
+    if (!affixStyle) {
+      return;
+    }
+    this.placeholderNode.style.cssText = '';
+    this.setAffixStyle(e, {
+      ...affixStyle,
+      width: this.placeholderNode.offsetWidth,
+    });
+    this.setPlaceholderStyle({
+      width: this.placeholderNode.offsetWidth,
+    });
+  }
+
  @throttleByAnimationFrameDecorator()
  updatePosition(e: any) {
    let { offsetTop, offsetBottom, offset, target = getDefaultTarget } = this.props;
@@ -194,6 +210,10 @@ export default class Affix extends React.Component<AffixProps, AffixState> {
      }
      this.setPlaceholderStyle(null);
    }
+
+    if (e.type === 'resize') {
+      this.syncPlaceholderStyle(e);
+    }
  }

  componentDidMount() {
@@ -245,6 +265,10 @@ export default class Affix extends React.Component<AffixProps, AffixState> {
    this.fixedNode = node;
  }

+  savePlaceholderNode = (node: HTMLDivElement) => {
+    this.placeholderNode = node;
+  }
+
  render() {
    const className = classNames({
      [this.props.prefixCls || 'ant-affix']: this.state.affixStyle,
@@ -253,7 +277,7 @@ export default class Affix extends React.Component<AffixProps, AffixState> {
    const props = omit(this.props, ['prefixCls', 'offsetTop', 'offsetBottom', 'target', 'onChange']);
    const placeholderStyle = { ...this.state.placeholderStyle, ...this.props.style };
    return (
-      <div {...props} style={placeholderStyle}>
+      <div {...props} style={placeholderStyle} ref={this.savePlaceholderNode}>
        <div className={className} ref={this.saveFixedNode} style={this.state.affixStyle}>
          {this.props.children}
        </div>
--- a/components/alert/tests/snapshots/demo.test.js.snap
+++ b/components/alert/tests/snapshots/demo.test.js.snap
@@ -366,6 +366,34 @@ exports[`renders ./components/alert/demo/icon.md correctly 1`] = `
 </div>
 `;

+exports[`renders ./components/alert/demo/smooth-closed.md correctly 1`] = `
+<div>
+  <div
+    class="ant-alert ant-alert-success ant-alert-no-icon"
+    data-show="true"
+  >
+    <span
+      class="ant-alert-message"
+    >
+      Alert Message Text
+    </span>
+    <span
+      class="ant-alert-description"
+    />
+    <a
+      class="ant-alert-close-icon"
+    >
+      <i
+        class="anticon anticon-cross"
+      />
+    </a>
+  </div>
+  <p>
+    placeholder text here
+  </p>
+</div>
+`;
+
 exports[`renders ./components/alert/demo/style.md correctly 1`] = `
 <div>
  <div
--- a/components/alert/demo/smooth-closed.md
+++ b/components/alert/demo/smooth-closed.md
@@ -0,0 +1,48 @@
+---
+order: 7
+title:
+  zh-CN: 平滑地卸载
+  en-US: Smoothly Unmount
+---
+
+## zh-CN
+
+平滑、自然的卸载提示
+
+## en-US
+
+Smoothly and unaffectedly unmount Alert.
+
+````jsx
+import { Alert } from 'antd';
+
+class App extends React.Component {
+  state = {
+    visible: true,
+  }
+  handleClose = () => {
+    this.setState({ visible: false });
+  }
+  render() {
+    return (
+      <div>
+        {
+          this.state.visible ? (
+            <Alert
+              message="Alert Message Text"
+              type="success"
+              closable
+              afterClose={this.handleClose}
+            />
+          ) : null
+        }
+        <p>placeholder text here</p>
+      </div>
+    );
+  }
+}
+
+ReactDOM.render(
+  <App />
+, mountNode);
+````
--- a/components/alert/index.en-US.md
+++ b/components/alert/index.en-US.md
@@ -15,11 +15,13 @@ Alert component for feedback.

 | Property | Description | Type | Default |
 | -------- | ----------- | ---- | ------- |
+| afterClose | Called when close animation is finished | () => void | - |
 | banner | Whether to show as banner | boolean | false |
 | closable | Whether Alert can be closed | boolean | - |
 | closeText | Close text to show | string\|ReactNode | - |
 | description | Additional content of Alert | string\|ReactNode | - |
 | message | Content of Alert | string\|ReactNode | - |
 | showIcon | Whether to show icon | boolean | false, in `banner` mode default is true |
+| iconType | Icon type, effective when `showIcon` is `true` | string | - |
 | type | Type of Alert styles, options: `success`, `info`, `warning`, `error` | string | `info`, in `banner` mode default is `warning` |
-| onClose | Callback when Alert is closed | Function | - |
+| onClose | Callback when Alert is closed | (e: MouseEvent) => void | - |
--- a/components/alert/index.tsx
+++ b/components/alert/index.tsx
@@ -21,8 +21,11 @@ export interface AlertProps {
  description?: React.ReactNode;
  /** Callback when close Alert */
  onClose?: React.MouseEventHandler<HTMLAnchorElement>;
+  /** Trigger when animation ending of Alert */
+  afterClose?: () => void;
  /** Whether to show icon */
  showIcon?: boolean;
+  iconType?: string;
  style?: React.CSSProperties;
  prefixCls?: string;
  className?: string;
@@ -55,11 +58,12 @@ export default class Alert extends React.Component<AlertProps, any> {
      closed: true,
      closing: true,
    });
+    (this.props.afterClose || noop)();
  }
  render() {
    let {
      closable, description, type, prefixCls = 'ant-alert', message, closeText, showIcon, banner,
-      className = '', style,
+      className = '', style, iconType,
    } = this.props;

    // banner模式默认有 Icon
@@ -67,27 +71,28 @@ export default class Alert extends React.Component<AlertProps, any> {
    // banner模式默认为警告
    type = banner && type === undefined ? 'warning' : type || 'info';

-    let iconType = '';
-    switch (type) {
-      case 'success':
-        iconType = 'check-circle';
-        break;
-      case 'info':
-        iconType = 'info-circle';
-        break;
-      case 'error':
-        iconType = 'cross-circle';
-        break;
-      case 'warning':
-        iconType = 'exclamation-circle';
-        break;
-      default:
-        iconType = 'default';
-    }
+    if (!iconType) {
+      switch (type) {
+        case 'success':
+          iconType = 'check-circle';
+          break;
+        case 'info':
+          iconType = 'info-circle';
+          break;
+        case 'error':
+          iconType = 'cross-circle';
+          break;
+        case 'warning':
+          iconType = 'exclamation-circle';
+          break;
+        default:
+          iconType = 'default';
+      }

-    // use outline icon in alert with description
-    if (!!description) {
-      iconType += '-o';
+      // use outline icon in alert with description
+      if (!!description) {
+        iconType += '-o';
+      }
    }

    let alertCls = classNames(prefixCls, {
--- a/components/alert/index.zh-CN.md
+++ b/components/alert/index.zh-CN.md
@@ -16,11 +16,13 @@ title: Alert

 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
+| afterClose | 关闭动画结束后的回掉 | () => void | - |
 | banner | 是否用作顶部公告 | boolean | false |
 | closable | 默认不显示关闭按钮 | boolean | 无 |
 | closeText | 自定义关闭按钮 | string\|ReactNode | 无 |
 | description | 警告提示的辅助性文字介绍 | string\|ReactNode | 无 |
 | message | 警告提示内容 | string\|ReactNode | 无 |
 | showIcon | 是否显示辅助图标 | boolean | false，`banner` 模式下默认值为 true |
+| iconType | 自定义图标类型，`showIcon` 为 `true` 时有效 | string | - |
 | type | 指定警告提示的样式，有四种选择 `success`、`info`、`warning`、`error` | string | `info`，`banner` 模式下默认值为 `warning` |
-| onClose | 关闭时触发的回调函数 | Function | 无 |
+| onClose | 关闭时触发的回调函数 | (e: MouseEvent) => void | 无 |
--- a/components/anchor/Anchor.tsx
+++ b/components/anchor/Anchor.tsx
@@ -8,11 +8,11 @@ import AnchorLink from './AnchorLink';
 import getScroll from '../_util/getScroll';
 import getRequestAnimationFrame from '../_util/getRequestAnimationFrame';

-function getDefaultTarget() {
+function getDefaultContainer() {
  return window;
 }

-function getOffsetTop(element: HTMLElement): number {
+function getOffsetTop(element: HTMLElement, container: AnchorContainer): number {
  if (!element) {
    return 0;
  }
@@ -24,9 +24,11 @@ function getOffsetTop(element: HTMLElement): number {
  const rect = element.getBoundingClientRect();

  if (rect.width || rect.height) {
-    const doc = element.ownerDocument;
-    const docElem = doc.documentElement;
-    return rect.top - docElem.clientTop;
+    if (container === window) {
+      container = element.ownerDocument.documentElement;
+      return rect.top - container.clientTop;
+    }
+    return rect.top - (container as HTMLElement).getBoundingClientRect().top;
  }

  return rect.top;
@@ -43,21 +45,27 @@ function easeInOutCubic(t: number, b: number, c: number, d: number) {

 const reqAnimFrame = getRequestAnimationFrame();
 const sharpMatcherRegx = /#([^#]+)$/;
-function scrollTo(href: string, offsetTop = 0, target: () => Window | HTMLElement, callback = () => { }) {
-  const scrollTop = getScroll(target(), true);
+function scrollTo(href: string, offsetTop = 0, getContainer: () => AnchorContainer, callback = () => { }) {
+  const container = getContainer();
+  const scrollTop = getScroll(container, true);
  const sharpLinkMatch = sharpMatcherRegx.exec(href);
  if (!sharpLinkMatch) { return; }
  const targetElement = document.getElementById(sharpLinkMatch[1]);
  if (!targetElement) {
    return;
  }
-  const eleOffsetTop = getOffsetTop(targetElement);
+  const eleOffsetTop = getOffsetTop(targetElement, container);
  const targetScrollTop = scrollTop + eleOffsetTop - offsetTop;
  const startTime = Date.now();
  const frameFunc = () => {
    const timestamp = Date.now();
    const time = timestamp - startTime;
-    window.scrollTo(window.pageXOffset, easeInOutCubic(time, scrollTop, targetScrollTop, 450));
+    const nextScrollTop = easeInOutCubic(time, scrollTop, targetScrollTop, 450);
+    if (container === window) {
+      window.scrollTo(window.pageXOffset, nextScrollTop);
+    } else {
+      (container as HTMLElement).scrollTop = nextScrollTop;
+    }
    if (time < 450) {
      reqAnimFrame(frameFunc);
    } else {
@@ -73,6 +81,8 @@ type Section = {
  top: number;
 };

+export type AnchorContainer =  HTMLElement | Window;
+
 export interface AnchorProps {
  prefixCls?: string;
  className?: string;
@@ -82,7 +92,14 @@ export interface AnchorProps {
  bounds?: number;
  affix?: boolean;
  showInkInFixed?: boolean;
-  target?: () => HTMLElement | Window;
+  getContainer?: () => AnchorContainer;
+}
+
+export interface AnchorDefaultProps extends AnchorProps {
+  prefixCls: string;
+  affix: boolean;
+  showInkInFixed: boolean;
+  getContainer: () => AnchorContainer;
 }

 export default class Anchor extends React.Component<AnchorProps, any> {
@@ -92,6 +109,7 @@ export default class Anchor extends React.Component<AnchorProps, any> {
    prefixCls: 'ant-anchor',
    affix: true,
    showInkInFixed: false,
+    getContainer: getDefaultContainer,
  };

  static childContextTypes = {
@@ -133,8 +151,8 @@ export default class Anchor extends React.Component<AnchorProps, any> {
  }

  componentDidMount() {
-    const getTarget = this.props.target || getDefaultTarget;
-    this.scrollEvent = addEventListener(getTarget(), 'scroll', this.handleScroll);
+    const { getContainer } = this.props as AnchorDefaultProps;
+    this.scrollEvent = addEventListener(getContainer(), 'scroll', this.handleScroll);
    this.handleScroll();
  }

@@ -159,10 +177,10 @@ export default class Anchor extends React.Component<AnchorProps, any> {
  }

  handleScrollTo = (link: string) => {
-    const { offsetTop, target = getDefaultTarget } = this.props;
+    const { offsetTop, getContainer } = this.props as AnchorDefaultProps;
    this.animating = true;
    this.setState({ activeLink: link });
-    scrollTo(link, offsetTop, target, () => {
+    scrollTo(link, offsetTop, getContainer, () => {
      this.animating = false;
    });
  }
@@ -174,16 +192,20 @@ export default class Anchor extends React.Component<AnchorProps, any> {
    }

    const linkSections: Array<Section> = [];
+    const { getContainer } = this.props as AnchorDefaultProps;
+    const container = getContainer();
    this.links.forEach(link => {
      const sharpLinkMatch = sharpMatcherRegx.exec(link.toString());
      if (!sharpLinkMatch) { return; }
      const target = document.getElementById(sharpLinkMatch[1]);
-      if (target && getOffsetTop(target) < offsetTop + bounds) {
-        const top = getOffsetTop(target);
-        linkSections.push({
-          link,
-          top,
-        });
+      if (target) {
+        const top = getOffsetTop(target, container);
+        if (top < offsetTop + bounds) {
+          linkSections.push({
+            link,
+            top,
+          });
+        }
      }
    });

@@ -199,7 +221,8 @@ export default class Anchor extends React.Component<AnchorProps, any> {
      return;
    }
    const { prefixCls } = this.props;
-    const linkNode = ReactDOM.findDOMNode(this as any).getElementsByClassName(`${prefixCls}-link-title-active`)[0];
+    const anchorNode = ReactDOM.findDOMNode(this) as Element;
+    const linkNode = anchorNode.getElementsByClassName(`${prefixCls}-link-title-active`)[0];
    if (linkNode) {
      this.inkNode.style.top = `${(linkNode as any).offsetTop + linkNode.clientHeight / 2 - 4.5}px`;
    }
--- a/components/anchor/index.en-US.md
+++ b/components/anchor/index.en-US.md
@@ -19,6 +19,7 @@ For displaying anchor hyperlinks on page and jumping between them.
 | -------- | ----------- | ---- | ------- |
 | affix | Fixed mode of Anchor | boolean | true |
 | bounds | Bounding distance of anchor area | number | 5(px) |
+| getContainer | Scrolling container | () => HTMLElement | () => window  |
 | offsetBottom | Pixels to offset from bottom when calculating position of scroll | number | - |
 | offsetTop | Pixels to offset from top when calculating position of scroll | number | 0 |
 | showInkInFixed | Whether show ink-balls in Fixed mode | boolean | false |
--- a/components/anchor/index.zh-CN.md
+++ b/components/anchor/index.zh-CN.md
@@ -20,6 +20,7 @@ title: Anchor
 | --- | --- | --- | --- |
 | affix | 固定模式 | boolean | true |
 | bounds | 锚点区域边界 | number | 5(px) |
+| getContainer | 指定滚动的容器 | () => HTMLElement | () => window |
 | offsetBottom | 距离窗口底部达到指定偏移量后触发 | number |  |
 | offsetTop | 距离窗口顶部达到指定偏移量后触发 | number |  |
 | showInkInFixed | 固定模式是否显示小圆点 | boolean | false |
--- a/components/auto-complete/index.tsx
+++ b/components/auto-complete/index.tsx
@@ -21,7 +21,7 @@ export type ValidInputElement =
 export interface AutoCompleteProps extends AbstractSelectProps {
  value?: SelectValue;
  defaultValue?: SelectValue;
-  dataSource: DataSourceItemType[];
+  dataSource?: DataSourceItemType[];
  optionLabelProp?: string;
  onChange?: (value: SelectValue) => void;
  onSelect?: (value: SelectValue, option: Object) => any;
--- a/components/avatar/tests/Avatar.test.js
+++ b/components/avatar/tests/Avatar.test.js
@@ -8,4 +8,22 @@ describe('Avatar Render', () => {
    const children = wrapper.find('.ant-avatar-string');
    expect(children.length).toBe(1);
  });
+
+  it('should render fallback string correctly', () => {
+    const div = global.document.createElement('div');
+    global.document.body.appendChild(div);
+
+    const wrapper = mount(<Avatar src="http://error.url">Fallback</Avatar>, { attachTo: div });
+    wrapper.instance().setScale = jest.fn(() => wrapper.instance().setState({ scale: 0.5 }));
+    wrapper.setState({ isImgExist: false });
+
+    const children = wrapper.find('.ant-avatar-string');
+    expect(children.length).toBe(1);
+    expect(children.text()).toBe('Fallback');
+    expect(wrapper.instance().setScale).toBeCalled();
+    expect(div.querySelector('.ant-avatar-string').style.transform).toBe('scale(0.5)');
+
+    wrapper.detach();
+    global.document.body.removeChild(div);
+  });
 });
--- a/components/avatar/index.tsx
+++ b/components/avatar/index.tsx
@@ -46,7 +46,8 @@ export default class Avatar extends React.Component<AvatarProps, AvatarState> {

  componentDidUpdate(prevProps: AvatarProps, prevState: AvatarState) {
    if (prevProps.children !== this.props.children
-        || (prevState.scale !== this.state.scale && this.state.scale === 1)) {
+        || (prevState.scale !== this.state.scale && this.state.scale === 1)
+        || (prevState.isImgExist !== this.state.isImgExist)) {
      this.setScale();
    }
  }
@@ -55,7 +56,8 @@ export default class Avatar extends React.Component<AvatarProps, AvatarState> {
    const childrenNode = this.avatarChildren;
    if (childrenNode) {
      const childrenWidth = childrenNode.offsetWidth;
-      const avatarWidth = ReactDOM.findDOMNode(this).getBoundingClientRect().width;
+      const avatarNode = ReactDOM.findDOMNode(this) as Element;
+      const avatarWidth = avatarNode.getBoundingClientRect().width;
      // add 4px gap for each side to get better performance
      if (avatarWidth - 8 < childrenWidth) {
        this.setState({
@@ -83,7 +85,7 @@ export default class Avatar extends React.Component<AvatarProps, AvatarState> {

    const classString = classNames(prefixCls, className, sizeCls, {
      [`${prefixCls}-${shape}`]: shape,
-      [`${prefixCls}-image`]: src,
+      [`${prefixCls}-image`]: src && this.state.isImgExist,
      [`${prefixCls}-icon`]: icon,
    });

--- a/components/avatar/style/index.less
+++ b/components/avatar/style/index.less
@@ -12,6 +12,11 @@
  white-space: nowrap;
  position: relative;
  overflow: hidden;
+  vertical-align: middle;
+
+  &-image {
+    background: transparent;
+  }

  .avatar-size(@avatar-size-base, @avatar-font-size-base);

--- a/components/back-top/tests/index.test.js
+++ b/components/back-top/tests/index.test.js
@@ -19,6 +19,6 @@ describe('BackTop', () => {
    jest.runAllTimers();
    wrapper.find('.ant-back-top').simulate('click');
    jest.runAllTimers();
-    expect(Math.round(document.documentElement.scrollTop)).toBe(0);
+    expect(Math.abs(Math.round(document.documentElement.scrollTop))).toBe(0);
  });
 });
--- a/components/badge/ScrollNumber.tsx
+++ b/components/badge/ScrollNumber.tsx
@@ -106,7 +106,7 @@ export default class ScrollNumber extends Component<ScrollNumberProps, ScrollNum
    return createElement('span', {
      className: `${this.props.prefixCls}-only`,
      style: {
-        transition: removeTransition && 'none',
+        transition: removeTransition ? 'none' : undefined,
        msTransform: `translateY(${-position * 100}%)`,
        WebkitTransform: `translateY(${-position * 100}%)`,
        transform: `translateY(${-position * 100}%)`,
--- a/components/badge/tests/snapshots/demo.test.js.snap
+++ b/components/badge/tests/snapshots/demo.test.js.snap
@@ -423,6 +423,13 @@ exports[`renders ./components/badge/demo/dot.md correctly 1`] = `
      data-show="true"
    />
  </span>
+  <span
+    class="ant-badge"
+  >
+    <i
+      class="anticon anticon-notification"
+    />
+  </span>
  <span
    class="ant-badge"
  >
--- a/components/badge/tests/index.test.js
+++ b/components/badge/tests/index.test.js
@@ -0,0 +1,14 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import Badge from '../index';
+
+describe('Badge', () => {
+  test('badge dot not scaling count > 9', () => {
+    const badge = mount(<Badge count={10} dot />);
+    expect(badge.find('.ant-card-multiple-words').length).toBe(0);
+  });
+  test('badge dot not showing count == 0', () => {
+    const badge = mount(<Badge count={0} dot />);
+    expect(badge.find('.ant-badge-dot').length).toBe(0);
+  });
+});
--- a/components/badge/demo/dot.md
+++ b/components/badge/demo/dot.md
@@ -12,6 +12,7 @@ title:
 ## en-US

 This will simply display a red badge, without a specific count.
+If count equals 0, it won't display the dot.

 ````jsx
 import { Badge, Icon } from 'antd';
@@ -21,6 +22,9 @@ ReactDOM.render(
    <Badge dot>
      <Icon type="notification" />
    </Badge>
+    <Badge count={0} dot>
+      <Icon type="notification" />
+    </Badge>
    <Badge dot>
      <a href="#">Link something</a>
    </Badge>
--- a/components/badge/index.en-US.md
+++ b/components/badge/index.en-US.md
@@ -26,7 +26,7 @@ Badge normally appears in proximity to notifications or user avatars with eye-ca
 | -------- | ----------- | ---- | ------- |
 | count | Number to show in badge | number\|ReactNode |  |
 | dot | Whether to display a red dot instead of `count` | boolean | `false` |
-| offset | set offset of the badge dot, like [x, y] | [number, number] | - |
+| offset | set offset of the badge dot, like`[x, y]` | `[number, number]` | - |
 | overflowCount | Max count to show | number | 99 |
 | showZero | Whether to show badge when `count` is zero | boolean | `false` |
 | status | Set Badge as a status dot | `success` \| `processing` \| `default` \| `error` \| `warning` | `''` |
--- a/components/badge/index.tsx
+++ b/components/badge/index.tsx
@@ -59,14 +59,13 @@ export default class Badge extends React.Component<BadgeProps, any> {
      offset,
      ...restProps,
    } = this.props;
-    const isDot = dot || status;
    let displayCount = (count as number) > (overflowCount as number) ? `${overflowCount}+` : count;
+    const isZero = displayCount === '0' || displayCount === 0;
+    const isDot = (dot && !isZero) || status;
    // dot mode don't need count
    if (isDot) {
      displayCount = '';
    }
-
-    const isZero = displayCount === '0' || displayCount === 0;
    const isEmpty = displayCount === null || displayCount === undefined || displayCount === '';
    const hidden = (isEmpty || (isZero && !showZero)) && !isDot;
    const statusCls = classNames({
@@ -76,7 +75,7 @@ export default class Badge extends React.Component<BadgeProps, any> {
    const scrollNumberCls = classNames({
      [`${prefixCls}-dot`]: isDot,
      [`${prefixCls}-count`]: !isDot,
-      [`${prefixCls}-multiple-words`]: count && count.toString && count.toString().length > 1,
+      [`${prefixCls}-multiple-words`]: !isDot && count && count.toString && count.toString().length > 1,
      [`${prefixCls}-status-${status}`]: !!status,
    });
    const badgeCls = classNames(className, prefixCls, {
--- a/components/badge/index.zh-CN.md
+++ b/components/badge/index.zh-CN.md
@@ -27,7 +27,7 @@ title: Badge
 | --- | --- | --- | --- |
 | count | 展示的数字，大于 overflowCount 时显示为 `${overflowCount}+`，为 0 时隐藏 | number\|ReactNode  |  |
 | dot | 不展示数字，只有一个小红点 | boolean | false |
-| offset | 设置状态点的位置偏移，格式为 [x, y] | [number, number] | - |
+| offset | 设置状态点的位置偏移，格式为 `[x, y]` | `[number, number]` | - |
 | overflowCount | 展示封顶的数字值 | number | 99 |
 | showZero | 当数值为 0 时，是否展示 Badge | boolean | false |
 | status | 设置 Badge 为状态点 | Enum{ 'success', 'processing, 'default', 'error', 'warning' } | '' |
--- a/components/badge/style/index.less
+++ b/components/badge/style/index.less
@@ -24,6 +24,7 @@
    text-align: center;
    padding: 0 6px;
    font-size: @badge-font-size;
+    font-weight: @badge-font-weight;
    white-space: nowrap;
    transform-origin: -10% center;
    box-shadow: 0 0 0 1px #fff;
@@ -112,7 +113,10 @@
    top: auto;
    display: block;
    position: relative;
-    transform: none !important;
+  }
+
+  &-not-a-wrapper .@{badge-prefix-cls}-count {
+    transform: none;
  }
 }

--- a/components/breadcrumb/style/index.less
+++ b/components/breadcrumb/style/index.less
@@ -5,22 +5,23 @@

 .@{breadcrumb-prefix-cls} {
  .reset-component;
-  color: @text-color-secondary;
+  color: @breadcrumb-base-color;
+  font-size: @breadcrumb-font-size;

  .@{iconfont-css-prefix} {
-    font-size: @font-size-sm;
+    font-size: @breadcrumb-icon-font-size;
  }

  a {
-    color: @text-color-secondary;
+    color: @breadcrumb-link-color;
    transition: color .3s;
    &:hover {
-      color: @primary-5;
+      color: @breadcrumb-link-color-hover;
    }
  }

  & > span:last-child {
-    color: @text-color;
+    color: @breadcrumb-last-item-color;
  }

  & > span:last-child &-separator {
@@ -28,8 +29,8 @@
  }

  &-separator {
-    margin: 0 @padding-xs;
-    color: @text-color-secondary;
+    margin: @breadcrumb-separator-margin;
+    color: @breadcrumb-separator-color;
  }

  &-link {
--- a/components/button/tests/snapshots/demo.test.js.snap
+++ b/components/button/tests/snapshots/demo.test.js.snap
@@ -212,7 +212,7 @@ exports[`renders ./components/button/demo/disabled.md correctly 1`] = `
  </button>
  <br />
  <button
-    class="ant-btn"
+    class="ant-btn ant-btn-background-ghost"
    type="button"
  >
    <span>
@@ -220,7 +220,7 @@ exports[`renders ./components/button/demo/disabled.md correctly 1`] = `
    </span>
  </button>
  <button
-    class="ant-btn"
+    class="ant-btn ant-btn-background-ghost"
    disabled=""
    type="button"
  >
@@ -481,6 +481,7 @@ exports[`renders ./components/button/demo/size.md correctly 1`] = `
          checked=""
          class="ant-radio-button-input"
          type="radio"
+          value="large"
        />
        <span
          class="ant-radio-button-inner"
@@ -499,6 +500,7 @@ exports[`renders ./components/button/demo/size.md correctly 1`] = `
        <input
          class="ant-radio-button-input"
          type="radio"
+          value="default"
        />
        <span
          class="ant-radio-button-inner"
@@ -517,6 +519,7 @@ exports[`renders ./components/button/demo/size.md correctly 1`] = `
        <input
          class="ant-radio-button-input"
          type="radio"
+          value="small"
        />
        <span
          class="ant-radio-button-inner"
--- a/components/button/tests/index.test.js
+++ b/components/button/tests/index.test.js
@@ -28,6 +28,24 @@ describe('Button', () => {
    expect(wrapper2).toMatchSnapshot();
  });

+  it('renders Chinese characters correctly in HOC', () => {
+    const Text = props => <span>{props.children}</span>;
+    const wrapper = mount(
+      <Button><Text>按钮</Text></Button>
+    );
+    expect(wrapper.find('.ant-btn').hasClass('ant-btn-two-chinese-chars')).toBe(true);
+    wrapper.setProps({
+      children: <Text>大按钮</Text>,
+    });
+    wrapper.update();
+    expect(wrapper.find('.ant-btn').hasClass('ant-btn-two-chinese-chars')).toBe(false);
+    wrapper.setProps({
+      children: <Text>按钮</Text>,
+    });
+    wrapper.update();
+    expect(wrapper.find('.ant-btn').hasClass('ant-btn-two-chinese-chars')).toBe(true);
+  });
+
  it('have static perperty for type detecting', () => {
    const wrapper = mount(
      <Button>Button Text</Button>
--- a/components/button/button.tsx
+++ b/components/button/button.tsx
@@ -34,7 +34,7 @@ function insertSpace(child: React.ReactChild, needInserted: boolean) {
  return child;
 }

-export type ButtonType = 'primary' | 'ghost' | 'dashed' | 'danger';
+export type ButtonType = 'default' | 'primary' | 'ghost' | 'dashed' | 'danger';
 export type ButtonShape = 'circle' | 'circle-outline';
 export type ButtonSize = 'small' | 'default' | 'large';

@@ -47,6 +47,8 @@ export interface ButtonProps {
  onClick?: React.FormEventHandler<any>;
  onMouseUp?: React.FormEventHandler<any>;
  onMouseDown?: React.FormEventHandler<any>;
+  onKeyPress?: React.KeyboardEventHandler<any>;
+  onKeyDown?: React.KeyboardEventHandler<any>;
  tabIndex?: number;
  loading?: boolean | { delay?: number };
  disabled?: boolean;
@@ -93,13 +95,7 @@ export default class Button extends React.Component<ButtonProps, any> {
  }

  componentDidMount() {
-    // Fix for HOC usage like <FormatMessage />
-    const buttonText = (findDOMNode(this) as HTMLElement).innerText;
-    if (this.isNeedInserted() && isTwoCNChar(buttonText)) {
-      this.setState({
-        hasTwoCNChar: true,
-      });
-    }
+    this.fixTwoCNChar();
  }

  componentWillReceiveProps(nextProps: ButtonProps) {
@@ -117,6 +113,10 @@ export default class Button extends React.Component<ButtonProps, any> {
    }
  }

+  componentDidUpdate() {
+    this.fixTwoCNChar();
+  }
+
  componentWillUnmount() {
    if (this.timeout) {
      clearTimeout(this.timeout);
@@ -126,6 +126,23 @@ export default class Button extends React.Component<ButtonProps, any> {
    }
  }

+  fixTwoCNChar() {
+    // Fix for HOC usage like <FormatMessage />
+    const node = (findDOMNode(this) as HTMLElement);
+    const buttonText = node.textContent || node.innerText;
+    if (this.isNeedInserted() && isTwoCNChar(buttonText)) {
+      if (!this.state.hasTwoCNChar) {
+        this.setState({
+          hasTwoCNChar: true,
+        });
+      }
+    } else if (this.state.hasTwoCNChar) {
+      this.setState({
+        hasTwoCNChar: false,
+      });
+    }
+  }
+
  handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {
    // Add click effect
    this.setState({ clicked: true });
--- a/components/button/demo/disabled.md
+++ b/components/button/demo/disabled.md
@@ -24,8 +24,8 @@ ReactDOM.render(
    <Button>Default</Button>
    <Button disabled>Default(disabled)</Button>
    <br />
-    <Button>Ghost</Button>
-    <Button disabled>Ghost(disabled)</Button>
+    <Button ghost>Ghost</Button>
+    <Button ghost disabled>Ghost(disabled)</Button>
    <br />
    <Button type="dashed">Dashed</Button>
    <Button type="dashed" disabled>Dashed(disabled)</Button>
--- a/components/button/index.en-US.md
+++ b/components/button/index.en-US.md
@@ -36,7 +36,8 @@ To get a customized button, just set `type`/`shape`/`size`/`loading`/`disabled`.
  margin-right: 8px;
  margin-bottom: 12px;
 }
-[id^=components-button-demo-] .ant-btn-group > .ant-btn {
+[id^=components-button-demo-] .ant-btn-group > .ant-btn,
+[id^=components-button-demo-] .ant-btn-group > span > .ant-btn {
  margin-right: 0;
 }
 </style>
--- a/components/button/style/index.less
+++ b/components/button/style/index.less
@@ -156,7 +156,7 @@
  }

  &-background-ghost&-primary {
-    .button-variant-ghost(@primary-color);
+    .button-variant-ghost(@btn-primary-bg);
  }

  &-background-ghost&-danger {
--- a/components/button/style/mixin.less
+++ b/components/button/style/mixin.less
@@ -54,11 +54,14 @@
 .button-variant-danger(@color; @background; @border) {
  .button-color(@color; @background; @border);

-  &:hover,
-  &:focus {
+  &:hover {
    .button-color(@btn-primary-color; ~`colorPalette("@{color}", 5)`; ~`colorPalette("@{color}", 5)`);
  }

+  &:focus {
+    .button-color(~`colorPalette("@{color}", 5)`; #fff; ~`colorPalette("@{color}", 5)`);
+  }
+
  &:active,
  &.active {
    .button-color(@btn-primary-color; ~`colorPalette("@{color}", 7)`; ~`colorPalette("@{color}", 7)`);
@@ -108,7 +111,7 @@
  display: inline-block;
  > .@{btnClassName} {
    position: relative;
-    z-index: 1;
+    line-height: @btn-height-base - 2px;

    &:hover,
    &:focus,
@@ -125,10 +128,12 @@
  // size
  &-lg > .@{btnClassName} {
    .button-size(@btn-height-lg; @btn-padding-lg; @btn-font-size-lg; @btn-border-radius-base);
+    line-height: @btn-height-lg - 2px;
  }

  &-sm > .@{btnClassName} {
    .button-size(@btn-height-sm; @btn-padding-sm; @font-size-base; @btn-border-radius-sm);
+    line-height: @btn-height-sm - 2px;
    > .@{iconfont-css-prefix} {
      font-size: @font-size-base;
    }
@@ -199,7 +204,8 @@
  &:focus,
  &:active,
  &.active {
-    background: #fff;
+    background: @btn-default-bg;
+    text-decoration: none;
  }
 }

@@ -242,6 +248,8 @@

  .@{btnClassName} + .@{btnClassName},
  .@{btnClassName} + &,
+  span + .@{btnClassName},
+  .@{btnClassName} + span,
  & + .@{btnClassName},
  & + & {
    margin-left: -1px;
@@ -251,15 +259,19 @@
    border-radius: 0;
  }

-  > .@{btnClassName}:first-child {
+  > .@{btnClassName}:first-child,
+  > span:first-child > .@{btnClassName} {
    margin-left: 0;
-    &:not(:last-child) {
-      border-bottom-right-radius: 0;
-      border-top-right-radius: 0;
-    }
  }

-  > .@{btnClassName}:last-child:not(:first-child) {
+  > .@{btnClassName}:first-child:not(:last-child),
+  > span:first-child:not(:last-child) > .@{btnClassName} {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0;
+  }
+
+  > .@{btnClassName}:last-child:not(:first-child),
+  > span:last-child:not(:first-child) > .@{btnClassName} {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
  }
--- a/components/calendar/Header.tsx
+++ b/components/calendar/Header.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import * as moment from 'moment';
 import { PREFIX_CLS } from './Constants';
 import Select from '../select';
-import { Group, Button } from '../radio';
+import { Group, Button, RadioChangeEvent } from '../radio';
 const Option = Select.Option;

 export interface HeaderProps {
@@ -15,6 +15,7 @@ export interface HeaderProps {
  onValueChange?: (value: moment.Moment) => void;
  onTypeChange?: (type: string) => void;
  value: any;
+  validRange ?: [moment.Moment, moment.Moment];
 }

 export default class Header extends React.Component<HeaderProps, any> {
@@ -27,11 +28,21 @@ export default class Header extends React.Component<HeaderProps, any> {
  private calenderHeaderNode: HTMLDivElement;

  getYearSelectElement(year: number) {
-    const { yearSelectOffset, yearSelectTotal, locale, prefixCls, fullscreen } = this.props;
-    const start = year - (yearSelectOffset as number);
-    const end = start + (yearSelectTotal as number);
+    const {
+      yearSelectOffset,
+      yearSelectTotal,
+      locale,
+      prefixCls,
+      fullscreen,
+      validRange,
+    } = this.props;
+    let start = year - (yearSelectOffset as number);
+    let end = start + (yearSelectTotal as number);
+    if (validRange) {
+      start = validRange[0].get('year');
+      end = validRange[1].get('year') + 1;
+    }
    const suffix = locale.year === '年' ? '年' : '';
-
    const options: React.ReactElement<any>[] = [];
    for (let index = start; index < end; index++) {
      options.push(<Option key={`${index}`}>{index + suffix}</Option>);
@@ -63,13 +74,22 @@ export default class Header extends React.Component<HeaderProps, any> {

  getMonthSelectElement(month: number, months: number[]) {
    const props = this.props;
-    const { prefixCls, fullscreen } = props;
+    const { prefixCls, fullscreen, validRange, value } = props;
    const options: React.ReactElement<any>[] = [];
-
-    for (let index = 0; index < 12; index++) {
+    let start = 0;
+    let end = 12;
+    if (validRange) {
+      const [rangeStart, rangeEnd] = validRange;
+      const currentYear = value.get('year');
+      if (rangeEnd.get('year') === currentYear) {
+        end = rangeEnd.get('month') + 1;
+      } else {
+        start = rangeStart.get('month');
+      }
+    }
+    for (let index = start; index < end; index++) {
      options.push(<Option key={`${index}`}>{months[index]}</Option>);
    }
-
    return (
      <Select
        size={fullscreen ? 'default' : 'small'}
@@ -85,8 +105,21 @@ export default class Header extends React.Component<HeaderProps, any> {
  }

  onYearChange = (year: string) => {
-    const newValue = this.props.value.clone();
+    const { value, validRange } = this.props;
+    const newValue = value.clone();
    newValue.year(parseInt(year, 10));
+    // switch the month so that it remains within range when year changes
+    if (validRange) {
+      const [ start, end ] = validRange;
+      const newYear = newValue.get('year');
+      const newMonth = newValue.get('month');
+      if (newYear === end.get('year') && newMonth > end.get('month')) {
+        newValue.month(end.get('month'));
+      }
+      if (newYear === start.get('year') && newMonth < start.get('month')) {
+        newValue.month(start.get('month'));
+      }
+    }

    const onValueChange = this.props.onValueChange;
    if (onValueChange) {
@@ -103,7 +136,7 @@ export default class Header extends React.Component<HeaderProps, any> {
    }
  }

-  onTypeChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+  onTypeChange = (e: RadioChangeEvent) => {
    const onTypeChange = this.props.onTypeChange;
    if (onTypeChange) {
      onTypeChange(e.target.value);
--- a/components/calendar/tests/snapshots/demo.test.js.snap
+++ b/components/calendar/tests/snapshots/demo.test.js.snap
@@ -84,6 +84,7 @@ exports[`renders ./components/calendar/demo/basic.md correctly 1`] = `
            checked=""
            class="ant-radio-button-input"
            type="radio"
+            value="date"
          />
          <span
            class="ant-radio-button-inner"
@@ -102,6 +103,7 @@ exports[`renders ./components/calendar/demo/basic.md correctly 1`] = `
          <input
            class="ant-radio-button-input"
            type="radio"
+            value="month"
          />
          <span
            class="ant-radio-button-inner"
@@ -1091,6 +1093,7 @@ exports[`renders ./components/calendar/demo/card.md correctly 1`] = `
              checked=""
              class="ant-radio-button-input"
              type="radio"
+              value="date"
            />
            <span
              class="ant-radio-button-inner"
@@ -1109,6 +1112,7 @@ exports[`renders ./components/calendar/demo/card.md correctly 1`] = `
            <input
              class="ant-radio-button-input"
              type="radio"
+              value="month"
            />
            <span
              class="ant-radio-button-inner"
@@ -2096,6 +2100,7 @@ exports[`renders ./components/calendar/demo/notice-calendar.md correctly 1`] = `
            checked=""
            class="ant-radio-button-input"
            type="radio"
+            value="date"
          />
          <span
            class="ant-radio-button-inner"
@@ -2114,6 +2119,7 @@ exports[`renders ./components/calendar/demo/notice-calendar.md correctly 1`] = `
          <input
            class="ant-radio-button-input"
            type="radio"
+            value="month"
          />
          <span
            class="ant-radio-button-inner"
@@ -3511,6 +3517,7 @@ exports[`renders ./components/calendar/demo/select.md correctly 1`] = `
              checked=""
              class="ant-radio-button-input"
              type="radio"
+              value="date"
            />
            <span
              class="ant-radio-button-inner"
@@ -3529,6 +3536,7 @@ exports[`renders ./components/calendar/demo/select.md correctly 1`] = `
            <input
              class="ant-radio-button-input"
              type="radio"
+              value="month"
            />
            <span
              class="ant-radio-button-inner"
--- a/components/calendar/tests/index.test.js
+++ b/components/calendar/tests/index.test.js
@@ -14,4 +14,88 @@ describe('Calendar', () => {
    const value = onSelect.mock.calls[0][0];
    expect(Moment.isMoment(value)).toBe(true);
  });
+
+  it('only Valid range should be selectable', () => {
+    const onSelect = jest.fn();
+    const validRange = [Moment('2018-02-02'), Moment('2018-02-18')];
+    const wrapper = mount(
+      <Calendar onSelect={onSelect} validRange={validRange} defaultValue={Moment('2018-02-02')} />
+    );
+    wrapper.find('[title="February 1, 2018"]').at(0).simulate('click');
+    wrapper.find('[title="February 2, 2018"]').at(0).simulate('click');
+    expect(onSelect.mock.calls.length).toBe(1);
+  });
+
+  it('dates other than in valid range should be disabled', () => {
+    const onSelect = jest.fn();
+    const validRange = [Moment('2018-02-02'), Moment('2018-02-18')];
+    const wrapper = mount(
+      <Calendar onSelect={onSelect} validRange={validRange} defaultValue={Moment('2018-02-02')} />
+    );
+    wrapper.find('[title="February 20, 2018"]').at(0).simulate('click');
+    const elem = wrapper.find('[title="February 20, 2018"]').hasClass('ant-fullcalendar-disabled-cell');
+    expect(elem).toEqual(true);
+    expect(onSelect.mock.calls.length).toBe(0);
+  });
+
+  it('months other than in valid range should be disabled', () => {
+    const onSelect = jest.fn();
+    const validRange = [Moment('2018-02-02'), Moment('2018-05-18')];
+    const wrapper = mount(
+      <Calendar onSelect={onSelect} validRange={validRange} defaultValue={Moment('2018-02-02')} mode="year" />
+    );
+    expect(wrapper.find('[title="Jan"]').at(0).hasClass('ant-fullcalendar-month-panel-cell-disabled')).toBe(true);
+    expect(wrapper.find('[title="Feb"]').at(0).hasClass('ant-fullcalendar-month-panel-cell-disabled')).toBe(false);
+    expect(wrapper.find('[title="Jun"]').at(0).hasClass('ant-fullcalendar-month-panel-cell-disabled')).toBe(true);
+    wrapper.find('[title="Jan"]').at(0).simulate('click');
+    wrapper.find('[title="Mar"]').at(0).simulate('click');
+    expect(onSelect.mock.calls.length).toBe(1);
+  });
+
+  it('months other than in valid range should not be shown in header', () => {
+    const validRange = [Moment('2017-02-02'), Moment('2018-05-18')];
+    const wrapper = mount(
+      <Calendar validRange={validRange} />
+    );
+    wrapper.find('.ant-fullcalendar-year-select').hostNodes().simulate('click');
+    wrapper.find('.ant-select-dropdown-menu-item').first().simulate('click');
+    wrapper.find('.ant-fullcalendar-month-select').hostNodes().simulate('click');
+    // 2 years and 11 months
+    expect(wrapper.find('.ant-select-dropdown-menu-item').length).toBe(13);
+  });
+
+  it('getDateRange should returns a disabledDate function', () => {
+    const validRange = [Moment('2018-02-02'), Moment('2018-05-18')];
+    const wrapper = mount(
+      <Calendar validRange={validRange} defaultValue={Moment('2018-02-02')} />
+    );
+    const instance = wrapper.instance();
+    const disabledDate = instance.getDateRange(validRange);
+    expect(disabledDate(Moment('2018-06-02'))).toBe(true);
+    expect(disabledDate(Moment('2018-04-02'))).toBe(false);
+  });
+
+  it('Calendar should change mode by prop', () => {
+    const monthMode = 'month';
+    const yearMode = 'year';
+    const wrapper = mount(
+      <Calendar />
+    );
+    expect(wrapper.state().mode).toEqual(monthMode);
+    wrapper.setProps({ mode: 'year' });
+    expect(wrapper.state().mode).toEqual(yearMode);
+  });
+
+  it('Calendar should switch mode', () => {
+    const monthMode = 'month';
+    const yearMode = 'year';
+    const onPanelChangeStub = jest.fn();
+    const wrapper = mount(
+      <Calendar mode={yearMode} onPanelChange={onPanelChangeStub} />
+    );
+    expect(wrapper.state().mode).toEqual(yearMode);
+    wrapper.instance().setType('date');
+    expect(wrapper.state().mode).toEqual(monthMode);
+    expect(onPanelChangeStub).toHaveBeenCalledTimes(1);
+  });
 });
--- a/components/calendar/index.en-US.md
+++ b/components/calendar/index.en-US.md
@@ -40,6 +40,7 @@ When data is in the form of dates, such as schedules, timetables, prices calenda
 | mode | The display mode of the calendar | `month` \| `year` | `month` |
 | monthCellRender | Customize the display of the month cell, the returned content will be appended to the cell | function(date: moment): ReactNode | - |
 | monthFullCellRender | Customize the display of the month cell, the returned content will override the cell | function(date: moment): ReactNode | - |
+| validRange | to set valid range | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)] | - |
 | value | The current selected date | [moment](http://momentjs.com/) | current date |
 | onPanelChange | Callback for when panel changes | function(date: moment, mode: string) | - |
 | onSelect | Callback for when a date is selected | function(date: moment） | - |
--- a/components/calendar/index.tsx
+++ b/components/calendar/index.tsx
@@ -5,7 +5,7 @@ import FullCalendar from 'rc-calendar/lib/FullCalendar';
 import LocaleReceiver from '../locale-provider/LocaleReceiver';
 import { PREFIX_CLS } from './Constants';
 import Header from './Header';
-import callMoment from '../_util/callMoment';
+import interopDefault from '../_util/interopDefault';
 import enUS from './locale/en_US';

 export { HeaderProps } from './Header';
@@ -37,6 +37,7 @@ export interface CalendarProps {
  onPanelChange?: (date?: moment.Moment, mode?: CalendarMode) => void;
  onSelect?: (date?: moment.Moment) => void;
  disabledDate?: (current: moment.Moment) => boolean;
+  validRange ?: [moment.Moment, moment.Moment];
 }

 export interface CalendarState {
@@ -72,8 +73,8 @@ export default class Calendar extends React.Component<CalendarProps, CalendarSta
  constructor(props: CalendarProps) {
    super(props);

-    const value = props.value || props.defaultValue || callMoment(moment);
-    if (!moment.isMoment(value)) {
+    const value = props.value || props.defaultValue || interopDefault(moment)();
+    if (!interopDefault(moment).isMoment(value)) {
      throw new Error(
        'The value/defaultValue of Calendar must be a moment object after `antd@2.0`, ' +
        'see: https://u.ant.design/calendar-value',
@@ -91,6 +92,11 @@ export default class Calendar extends React.Component<CalendarProps, CalendarSta
        value: nextProps.value!,
      });
    }
+    if ('mode' in nextProps && nextProps.mode !== this.props.mode) {
+      this.setState({
+          mode: nextProps.mode!,
+      });
+    }
  }

  monthCellRender = (value: moment.Moment) => {
@@ -161,6 +167,21 @@ export default class Calendar extends React.Component<CalendarProps, CalendarSta
    this.setValue(value, 'select');
  }

+  getDateRange = (
+    validRange: [moment.Moment, moment.Moment],
+    disabledDate?: (current: moment.Moment) => boolean,
+  ) => (current: moment.Moment) => {
+      if (!current) {
+        return false;
+      }
+      const [ startDate, endDate ] = validRange;
+      const inRange = !current.isBetween(startDate, endDate, 'days', '[]');
+      if (disabledDate) {
+        return (disabledDate(current) || inRange);
+      }
+      return inRange;
+    }
+
  renderCalendar = (locale: any, localeCode: string) => {
    const { state, props } = this;
    const { value, mode } = state;
@@ -178,6 +199,12 @@ export default class Calendar extends React.Component<CalendarProps, CalendarSta
    const monthCellRender = monthFullCellRender || this.monthCellRender;
    const dateCellRender = dateFullCellRender || this.dateCellRender;

+    let disabledDate = props.disabledDate;
+
+    if (props.validRange) {
+      disabledDate = this.getDateRange(props.validRange, disabledDate);
+    }
+
    return (
      <div className={cls} style={style}>
        <Header
@@ -188,9 +215,11 @@ export default class Calendar extends React.Component<CalendarProps, CalendarSta
          prefixCls={prefixCls}
          onTypeChange={this.onHeaderTypeChange}
          onValueChange={this.onHeaderValueChange}
+          validRange={props.validRange}
        />
        <FullCalendar
          {...props}
+          disabledDate={disabledDate}
          Select={noop}
          locale={locale.lang}
          type={type}
--- a/components/calendar/index.zh-CN.md
+++ b/components/calendar/index.zh-CN.md
@@ -41,6 +41,7 @@ title: Calendar
 | mode | 初始模式，`month/year` | string | month |
 | monthCellRender | 自定义渲染月单元格，返回内容会被追加到单元格 | function(date: moment): ReactNode | 无 |
 | monthFullCellRender | 自定义渲染月单元格，返回内容覆盖单元格 | function(date: moment): ReactNode | 无 |
+| validRange | 设置可以显示的日期 | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)] | 无 |
 | value | 展示日期 | [moment](http://momentjs.com/) | 当前日期 |
 | onPanelChange | 日期面板变化回调 | function(date: moment, mode: string) | 无 |
 | onSelect | 点击选择日期回调 | function(date: moment） | 无 |
--- a/components/calendar/locale/ku_IQ.tsx
+++ b/components/calendar/locale/ku_IQ.tsx
@@ -0,0 +1,2 @@
+import ku_IQ from '../../date-picker/locale/ku_IQ';
+export default ku_IQ;
--- a/components/calendar/locale/sl_SI.tsx
+++ b/components/calendar/locale/sl_SI.tsx
@@ -0,0 +1,2 @@
+import sl_SI from '../../date-picker/locale/sl_SI';
+export default sl_SI;
--- a/components/card/tests/snapshots/demo.test.js.snap
+++ b/components/card/tests/snapshots/demo.test.js.snap
@@ -30,17 +30,15 @@ exports[`renders ./components/card/demo/basic.md correctly 1`] = `
  <div
    class="ant-card-body"
  >
-    <div>
-      <p>
-        Card content
-      </p>
-      <p>
-        Card content
-      </p>
-      <p>
-        Card content
-      </p>
-    </div>
+    <p>
+      Card content
+    </p>
+    <p>
+      Card content
+    </p>
+    <p>
+      Card content
+    </p>
  </div>
 </div>
 `;
@@ -69,17 +67,15 @@ exports[`renders ./components/card/demo/border-less.md correctly 1`] = `
    <div
      class="ant-card-body"
    >
-      <div>
-        <p>
-          Card content
-        </p>
-        <p>
-          Card content
-        </p>
-        <p>
-          Card content
-        </p>
-      </div>
+      <p>
+        Card content
+      </p>
+      <p>
+        Card content
+      </p>
+      <p>
+        Card content
+      </p>
    </div>
  </div>
 </div>
@@ -101,23 +97,21 @@ exports[`renders ./components/card/demo/flexible-content.md correctly 1`] = `
  <div
    class="ant-card-body"
  >
-    <div>
+    <div
+      class="ant-card-meta"
+    >
      <div
-        class="ant-card-meta"
+        class="ant-card-meta-detail"
      >
        <div
-          class="ant-card-meta-detail"
+          class="ant-card-meta-title"
        >
-          <div
-            class="ant-card-meta-title"
-          >
-            Europe Street beat
-          </div>
-          <div
-            class="ant-card-meta-description"
-          >
-            www.instagram.com
-          </div>
+          Europe Street beat
+        </div>
+        <div
+          class="ant-card-meta-description"
+        >
+          www.instagram.com
        </div>
      </div>
    </div>
@@ -145,49 +139,47 @@ exports[`renders ./components/card/demo/grid-card.md correctly 1`] = `
  <div
    class="ant-card-body"
  >
-    <div>
-      <div
-        class="ant-card-grid"
-        style="width:25%;text-align:center"
-      >
-        Content
-      </div>
-      <div
-        class="ant-card-grid"
-        style="width:25%;text-align:center"
-      >
-        Content
-      </div>
-      <div
-        class="ant-card-grid"
-        style="width:25%;text-align:center"
-      >
-        Content
-      </div>
-      <div
-        class="ant-card-grid"
-        style="width:25%;text-align:center"
-      >
-        Content
-      </div>
-      <div
-        class="ant-card-grid"
-        style="width:25%;text-align:center"
-      >
-        Content
-      </div>
-      <div
-        class="ant-card-grid"
-        style="width:25%;text-align:center"
-      >
-        Content
-      </div>
-      <div
-        class="ant-card-grid"
-        style="width:25%;text-align:center"
-      >
-        Content
-      </div>
+    <div
+      class="ant-card-grid"
+      style="width:25%;text-align:center"
+    >
+      Content
+    </div>
+    <div
+      class="ant-card-grid"
+      style="width:25%;text-align:center"
+    >
+      Content
+    </div>
+    <div
+      class="ant-card-grid"
+      style="width:25%;text-align:center"
+    >
+      Content
+    </div>
+    <div
+      class="ant-card-grid"
+      style="width:25%;text-align:center"
+    >
+      Content
+    </div>
+    <div
+      class="ant-card-grid"
+      style="width:25%;text-align:center"
+    >
+      Content
+    </div>
+    <div
+      class="ant-card-grid"
+      style="width:25%;text-align:center"
+    >
+      Content
+    </div>
+    <div
+      class="ant-card-grid"
+      style="width:25%;text-align:center"
+    >
+      Content
    </div>
  </div>
 </div>
@@ -224,9 +216,7 @@ exports[`renders ./components/card/demo/in-column.md correctly 1`] = `
        <div
          class="ant-card-body"
        >
-          <div>
-            Card content
-          </div>
+          Card content
        </div>
      </div>
    </div>
@@ -253,9 +243,7 @@ exports[`renders ./components/card/demo/in-column.md correctly 1`] = `
        <div
          class="ant-card-body"
        >
-          <div>
-            Card content
-          </div>
+          Card content
        </div>
      </div>
    </div>
@@ -282,9 +270,7 @@ exports[`renders ./components/card/demo/in-column.md correctly 1`] = `
        <div
          class="ant-card-body"
        >
-          <div>
-            Card content
-          </div>
+          Card content
        </div>
      </div>
    </div>
@@ -312,158 +298,248 @@ exports[`renders ./components/card/demo/inner.md correctly 1`] = `
  <div
    class="ant-card-body"
  >
-    <div>
-      <p
-        style="font-size:14px;color:rgba(0, 0, 0, 0.85);margin-bottom:16px;font-weight:500"
-      >
-        Group title
-      </p>
+    <p
+      style="font-size:14px;color:rgba(0, 0, 0, 0.85);margin-bottom:16px;font-weight:500"
+    >
+      Group title
+    </p>
+    <div
+      class="ant-card ant-card-bordered ant-card-type-inner"
+    >
      <div
-        class="ant-card ant-card-bordered ant-card-type-inner"
+        class="ant-card-head"
      >
        <div
-          class="ant-card-head"
+          class="ant-card-head-wrapper"
        >
          <div
-            class="ant-card-head-wrapper"
+            class="ant-card-head-title"
          >
-            <div
-              class="ant-card-head-title"
-            >
-              Inner Card title
-            </div>
-            <div
-              class="ant-card-extra"
-            >
-              <a
-                href="#"
-              >
-                More
-              </a>
-            </div>
+            Inner Card title
          </div>
-        </div>
-        <div
-          class="ant-card-body"
-        >
-          <div>
-            Inner Card content
+          <div
+            class="ant-card-extra"
+          >
+            <a
+              href="#"
+            >
+              More
+            </a>
          </div>
        </div>
      </div>
      <div
-        class="ant-card ant-card-bordered ant-card-type-inner"
-        style="margin-top:16px"
+        class="ant-card-body"
+      >
+        Inner Card content
+      </div>
+    </div>
+    <div
+      class="ant-card ant-card-bordered ant-card-type-inner"
+      style="margin-top:16px"
+    >
+      <div
+        class="ant-card-head"
      >
        <div
-          class="ant-card-head"
+          class="ant-card-head-wrapper"
        >
          <div
-            class="ant-card-head-wrapper"
+            class="ant-card-head-title"
          >
-            <div
-              class="ant-card-head-title"
+            Inner Card title
+          </div>
+          <div
+            class="ant-card-extra"
+          >
+            <a
+              href="#"
            >
-              Inner Card title
-            </div>
-            <div
-              class="ant-card-extra"
-            >
-              <a
-                href="#"
-              >
-                More
-              </a>
-            </div>
-          </div>
-        </div>
-        <div
-          class="ant-card-body"
-        >
-          <div>
-            Inner Card content
+              More
+            </a>
          </div>
        </div>
      </div>
+      <div
+        class="ant-card-body"
+      >
+        Inner Card content
+      </div>
    </div>
  </div>
 </div>
 `;

 exports[`renders ./components/card/demo/loading.md correctly 1`] = `
-<div
-  class="ant-card ant-card-loading ant-card-bordered"
-  style="width:34%"
->
+<div>
  <div
-    class="ant-card-head"
+    class="ant-card ant-card-loading ant-card-bordered"
  >
    <div
-      class="ant-card-head-wrapper"
+      class="ant-card-head"
    >
      <div
-        class="ant-card-head-title"
+        class="ant-card-head-wrapper"
      >
-        Card title
+        <div
+          class="ant-card-head-title"
+        >
+          Card title
+        </div>
+      </div>
+    </div>
+    <div
+      class="ant-card-body"
+    >
+      <div
+        class="ant-card-loading-content"
+      >
+        <div
+          class="ant-row"
+          style="margin-left:-4px;margin-right:-4px"
+        >
+          <div
+            class="ant-col-22"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+        </div>
+        <div
+          class="ant-row"
+          style="margin-left:-4px;margin-right:-4px"
+        >
+          <div
+            class="ant-col-8"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+          <div
+            class="ant-col-15"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+        </div>
+        <div
+          class="ant-row"
+          style="margin-left:-4px;margin-right:-4px"
+        >
+          <div
+            class="ant-col-6"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+          <div
+            class="ant-col-18"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+        </div>
+        <div
+          class="ant-row"
+          style="margin-left:-4px;margin-right:-4px"
+        >
+          <div
+            class="ant-col-13"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+          <div
+            class="ant-col-9"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+        </div>
+        <div
+          class="ant-row"
+          style="margin-left:-4px;margin-right:-4px"
+        >
+          <div
+            class="ant-col-4"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+          <div
+            class="ant-col-3"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+          <div
+            class="ant-col-16"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+        </div>
+        <div
+          class="ant-row"
+          style="margin-left:-4px;margin-right:-4px"
+        >
+          <div
+            class="ant-col-8"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+          <div
+            class="ant-col-6"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+          <div
+            class="ant-col-8"
+            style="padding-left:4px;padding-right:4px"
+          >
+            <div
+              class="ant-card-loading-block"
+            />
+          </div>
+        </div>
      </div>
    </div>
  </div>
-  <div
-    class="ant-card-body"
+  <button
+    class="ant-btn"
+    style="margin-top:16px"
+    type="button"
  >
-    <div
-      class="ant-card-loading-content"
-    >
-      <p
-        class="ant-card-loading-block"
-        style="width:94%"
-      />
-      <p>
-        <span
-          class="ant-card-loading-block"
-          style="width:28%"
-        />
-        <span
-          class="ant-card-loading-block"
-          style="width:62%"
-        />
-      </p>
-      <p>
-        <span
-          class="ant-card-loading-block"
-          style="width:22%"
-        />
-        <span
-          class="ant-card-loading-block"
-          style="width:66%"
-        />
-      </p>
-      <p>
-        <span
-          class="ant-card-loading-block"
-          style="width:56%"
-        />
-        <span
-          class="ant-card-loading-block"
-          style="width:39%"
-        />
-      </p>
-      <p>
-        <span
-          class="ant-card-loading-block"
-          style="width:21%"
-        />
-        <span
-          class="ant-card-loading-block"
-          style="width:15%"
-        />
-        <span
-          class="ant-card-loading-block"
-          style="width:40%"
-        />
-      </p>
-    </div>
-  </div>
+    <span>
+      Toggle loading
+    </span>
+  </button>
 </div>
 `;

@@ -483,34 +559,32 @@ exports[`renders ./components/card/demo/meta.md correctly 1`] = `
  <div
    class="ant-card-body"
  >
-    <div>
+    <div
+      class="ant-card-meta"
+    >
      <div
-        class="ant-card-meta"
+        class="ant-card-meta-avatar"
+      >
+        <span
+          class="ant-avatar ant-avatar-circle ant-avatar-image"
+        >
+          <img
+            src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png"
+          />
+        </span>
+      </div>
+      <div
+        class="ant-card-meta-detail"
      >
        <div
-          class="ant-card-meta-avatar"
+          class="ant-card-meta-title"
        >
-          <span
-            class="ant-avatar ant-avatar-circle ant-avatar-image"
-          >
-            <img
-              src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png"
-            />
-          </span>
+          Card title
        </div>
        <div
-          class="ant-card-meta-detail"
+          class="ant-card-meta-description"
        >
-          <div
-            class="ant-card-meta-title"
-          >
-            Card title
-          </div>
-          <div
-            class="ant-card-meta-description"
-          >
-            This is the description
-          </div>
+          This is the description
        </div>
      </div>
    </div>
@@ -557,17 +631,15 @@ exports[`renders ./components/card/demo/simple.md correctly 1`] = `
  <div
    class="ant-card-body"
  >
-    <div>
-      <p>
-        Card content
-      </p>
-      <p>
-        Card content
-      </p>
-      <p>
-        Card content
-      </p>
-    </div>
+    <p>
+      Card content
+    </p>
+    <p>
+      Card content
+    </p>
+    <p>
+      Card content
+    </p>
  </div>
 </div>
 `;
@@ -640,8 +712,8 @@ exports[`renders ./components/card/demo/tabs.md correctly 1`] = `
                  />
                  <div
                    aria-disabled="false"
-                    aria-selected="true"
-                    class="ant-tabs-tab-active ant-tabs-tab"
+                    aria-selected="false"
+                    class=" ant-tabs-tab"
                    role="tab"
                  >
                    tab1
@@ -661,11 +733,11 @@ exports[`renders ./components/card/demo/tabs.md correctly 1`] = `
        </div>
        <div
          class="ant-tabs-content ant-tabs-content-animated"
-          style="margin-left:0%"
+          style="display:none"
        >
          <div
-            aria-hidden="false"
-            class="ant-tabs-tabpane ant-tabs-tabpane-active"
+            aria-hidden="true"
+            class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
            role="tabpanel"
          />
          <div
@@ -679,11 +751,9 @@ exports[`renders ./components/card/demo/tabs.md correctly 1`] = `
    <div
      class="ant-card-body"
    >
-      <div>
-        <p>
-          content1
-        </p>
-      </div>
+      <p>
+        content1
+      </p>
    </div>
  </div>
  <br />
@@ -739,16 +809,16 @@ exports[`renders ./components/card/demo/tabs.md correctly 1`] = `
                  />
                  <div
                    aria-disabled="false"
-                    aria-selected="true"
-                    class="ant-tabs-tab-active ant-tabs-tab"
+                    aria-selected="false"
+                    class=" ant-tabs-tab"
                    role="tab"
                  >
                    article
                  </div>
                  <div
                    aria-disabled="false"
-                    aria-selected="false"
-                    class=" ant-tabs-tab"
+                    aria-selected="true"
+                    class="ant-tabs-tab-active ant-tabs-tab"
                    role="tab"
                  >
                    app
@@ -768,18 +838,18 @@ exports[`renders ./components/card/demo/tabs.md correctly 1`] = `
        </div>
        <div
          class="ant-tabs-content ant-tabs-content-animated"
-          style="margin-left:0%"
+          style="margin-left:-100%"
        >
-          <div
-            aria-hidden="false"
-            class="ant-tabs-tabpane ant-tabs-tabpane-active"
-            role="tabpanel"
-          />
          <div
            aria-hidden="true"
            class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
            role="tabpanel"
          />
+          <div
+            aria-hidden="false"
+            class="ant-tabs-tabpane ant-tabs-tabpane-active"
+            role="tabpanel"
+          />
          <div
            aria-hidden="true"
            class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
@@ -791,11 +861,9 @@ exports[`renders ./components/card/demo/tabs.md correctly 1`] = `
    <div
      class="ant-card-body"
    >
-      <div>
-        <p>
-          article content
-        </p>
-      </div>
+      <p>
+        app content
+      </p>
    </div>
  </div>
 </div>
--- a/components/card/demo/loading.md
+++ b/components/card/demo/loading.md
@@ -14,11 +14,30 @@ title:
 Shows a loading indicator while the contents of the card is being fetched.

 ````jsx
-import { Card } from 'antd';
+import { Card, Button } from 'antd';
+
+class LoadingCard extends React.Component {
+  state = {
+    loading: true,
+  }
+
+  handleClick = () => {
+    this.setState({ loading: !this.state.loading });
+  }
+
+  render() {
+    return (
+      <div>
+        <Card loading={this.state.loading} title="Card title">
+          Whatever content
+        </Card>
+        <Button onClick={this.handleClick} style={{ marginTop: 16 }}>Toggle loading</Button>
+      </div>
+    );
+  }
+}

 ReactDOM.render(
-  <Card loading title="Card title" style={{ width: '34%' }}>
-    Whatever content
-  </Card>
+  <LoadingCard />
 , mountNode);
 ````
--- a/components/card/demo/tabs.md
+++ b/components/card/demo/tabs.md
@@ -49,7 +49,7 @@ const contentListNoTitle = {
 class TabsCard extends React.Component {
  state = {
    key: 'tab1',
-    noTitleKey: 'article',
+    noTitleKey: 'app',
  }
  onTabChange = (key, type) => {
    console.log(key, type);
@@ -71,6 +71,7 @@ class TabsCard extends React.Component {
        <Card
          style={{ width: '100%' }}
          tabList={tabListNoTitle}
+          activeTabKey={this.state.noTitleKey}
          onTabChange={(key) => { this.onTabChange(key, 'noTitleKey'); }}
        >
          {contentListNoTitle[this.state.noTitleKey]}
--- a/components/card/index.en-US.md
+++ b/components/card/index.en-US.md
@@ -29,6 +29,8 @@ A card can be used to display content related to a single subject. The content c
 | hoverable | Lift up when hovering card | boolean | false |
 | loading | Shows a loading indicator while the contents of the card are being fetched | boolean | false |
 | tabList | List of TabPane's head. | Array&lt;{key: string, tab: ReactNode}> | - |
+| activeTabKey | Current TabPane's key | string | - |
+| defaultActiveTabKey | Initial active TabPane's key, if `activeTabKey` is not set. | string | - |
 | title | Card title | string\|ReactNode | - |
 | type | Card style type, can be set to `inner` or not set | string | - |
 | onTabChange | Callback when tab is switched | (key) => void | - |
--- a/components/card/index.tsx
+++ b/components/card/index.tsx
@@ -5,8 +5,11 @@ import omit from 'omit.js';
 import Grid from './Grid';
 import Meta from './Meta';
 import Tabs from '../tabs';
+import Row from '../row';
+import Col from '../col';
 import { throttleByAnimationFrameDecorator } from '../_util/throttleByAnimationFrame';
 import warning from '../_util/warning';
+import { Omit } from '../_util/type';

 export { CardGridProps } from './Grid';
 export { CardMetaProps } from './Meta';
@@ -18,7 +21,7 @@ export interface CardTabListType {
  tab: React.ReactNode;
 }

-export interface CardProps {
+export interface CardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
  prefixCls?: string;
  title?: React.ReactNode;
  extra?: React.ReactNode;
@@ -36,16 +39,24 @@ export interface CardProps {
  actions?: Array<React.ReactNode>;
  tabList?: CardTabListType[];
  onTabChange?: (key: string) => void;
+  activeTabKey?: string;
+  defaultActiveTabKey?: string;
 }

-export default class Card extends React.Component<CardProps, {}> {
+export interface CardState {
+  widerPadding: boolean;
+}
+
+export default class Card extends React.Component<CardProps, CardState> {
  static Grid: typeof Grid = Grid;
  static Meta: typeof Meta = Meta;
-  resizeEvent: any;
-  updateWiderPaddingCalled: boolean;
+
  state = {
    widerPadding: false,
  };
+
+  private resizeEvent: any;
+  private updateWiderPaddingCalled: boolean = false;
  private container: HTMLDivElement;
  componentDidMount() {
    this.updateWiderPadding();
@@ -54,9 +65,9 @@ export default class Card extends React.Component<CardProps, {}> {
    if ('noHovering' in this.props) {
      warning(
        !this.props.noHovering,
-        '`noHovering` of Card is deperated, you can remove it safely or use `hoverable` instead.',
+        '`noHovering` of Card is deprecated, you can remove it safely or use `hoverable` instead.',
      );
-      warning(!!this.props.noHovering, '`noHovering={false}` of Card is deperated, use `hoverable` instead.');
+      warning(!!this.props.noHovering, '`noHovering={false}` of Card is deprecated, use `hoverable` instead.');
    }
  }
  componentWillUnmount() {
@@ -70,14 +81,14 @@ export default class Card extends React.Component<CardProps, {}> {
    if (!this.container) {
      return;
    }
-    // 936 is a magic card width pixer number indicated by designer
-    const WIDTH_BOUDARY_PX = 936;
-    if (this.container.offsetWidth >= WIDTH_BOUDARY_PX && !this.state.widerPadding) {
+    // 936 is a magic card width pixel number indicated by designer
+    const WIDTH_BOUNDARY_PX = 936;
+    if (this.container.offsetWidth >= WIDTH_BOUNDARY_PX && !this.state.widerPadding) {
      this.setState({ widerPadding: true }, () => {
        this.updateWiderPaddingCalled = true; // first render without css transition
      });
    }
-    if (this.container.offsetWidth < WIDTH_BOUDARY_PX && this.state.widerPadding) {
+    if (this.container.offsetWidth < WIDTH_BOUNDARY_PX && this.state.widerPadding) {
      this.setState({ widerPadding: false }, () => {
        this.updateWiderPaddingCalled = true; // first render without css transition
      });
@@ -123,7 +134,7 @@ export default class Card extends React.Component<CardProps, {}> {
  render() {
    const {
      prefixCls = 'ant-card', className, extra, bodyStyle, noHovering, hoverable, title, loading,
-      bordered = true, type, cover, actions, tabList, children, ...others,
+      bordered = true, type, cover, actions, tabList, children, activeTabKey, defaultActiveTabKey, ...others,
    } = this.props;

    const classString = classNames(prefixCls, className, {
@@ -139,30 +150,75 @@ export default class Card extends React.Component<CardProps, {}> {

    const loadingBlock = (
      <div className={`${prefixCls}-loading-content`}>
-        <p className={`${prefixCls}-loading-block`} style={{ width: '94%' }} />
-        <p>
-          <span className={`${prefixCls}-loading-block`} style={{ width: '28%' }} />
-          <span className={`${prefixCls}-loading-block`} style={{ width: '62%' }} />
-        </p>
-        <p>
-          <span className={`${prefixCls}-loading-block`} style={{ width: '22%' }} />
-          <span className={`${prefixCls}-loading-block`} style={{ width: '66%' }} />
-        </p>
-        <p>
-          <span className={`${prefixCls}-loading-block`} style={{ width: '56%' }} />
-          <span className={`${prefixCls}-loading-block`} style={{ width: '39%' }} />
-        </p>
-        <p>
-          <span className={`${prefixCls}-loading-block`} style={{ width: '21%' }} />
-          <span className={`${prefixCls}-loading-block`} style={{ width: '15%' }} />
-          <span className={`${prefixCls}-loading-block`} style={{ width: '40%' }} />
-        </p>
+        <Row gutter={8}>
+          <Col span={22}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+        </Row>
+        <Row gutter={8}>
+          <Col span={8}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+          <Col span={15}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+        </Row>
+        <Row gutter={8}>
+          <Col span={6}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+          <Col span={18}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+        </Row>
+        <Row gutter={8}>
+          <Col span={13}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+          <Col span={9}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+        </Row>
+        <Row gutter={8}>
+          <Col span={4}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+          <Col span={3}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+          <Col span={16}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+        </Row>
+        <Row gutter={8}>
+          <Col span={8}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+          <Col span={6}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+          <Col span={8}>
+            <div className={`${prefixCls}-loading-block`} />
+          </Col>
+        </Row>
      </div>
    );

+    const hasActiveTabKey = activeTabKey !== undefined;
+    const extraProps = {
+      [hasActiveTabKey ? 'activeKey' : 'defaultActiveKey']: hasActiveTabKey
+        ? activeTabKey
+        : defaultActiveTabKey,
+    };
+
    let head;
    const tabs = tabList && tabList.length ? (
-      <Tabs className={`${prefixCls}-head-tabs`} size="large" onChange={this.onTabChange}>
+      <Tabs
+        {...extraProps}
+        className={`${prefixCls}-head-tabs`}
+        size="large"
+        onChange={this.onTabChange}
+      >
        {tabList.map(item => <Tabs.TabPane tab={item.tab} key={item.key} />)}
      </Tabs>
    ) : null;
@@ -180,7 +236,7 @@ export default class Card extends React.Component<CardProps, {}> {
    const coverDom = cover ? <div className={`${prefixCls}-cover`}>{cover}</div> : null;
    const body = (
      <div className={`${prefixCls}-body`} style={bodyStyle}>
-        {loading ? loadingBlock : <div>{children}</div>}
+        {loading ? loadingBlock : children}
      </div>
    );
    const actionDom = actions && actions.length ?
@@ -192,7 +248,7 @@ export default class Card extends React.Component<CardProps, {}> {
      <div {...divProps} className={classString} ref={this.saveRef}>
        {head}
        {coverDom}
-        {children ? body : null}
+        {body}
        {actionDom}
      </div>
    );
--- a/components/card/index.zh-CN.md
+++ b/components/card/index.zh-CN.md
@@ -30,6 +30,8 @@ cols: 1
 | hoverable | 鼠标移过时可浮起 | boolean | false |
 | loading | 当卡片内容还在加载中时，可以用 loading 展示一个占位 | boolean | false |
 | tabList | 页签标题列表 | Array&lt;{key: string, tab: ReactNode}> | - |
+| activeTabKey | 当前激活页签的 key | string | - |
+| defaultActiveTabKey | 初始化选中页签的 key，如果没有设置 activeTabKey | string | 第一个页签 |
 | title | 卡片标题 | string\|ReactNode | - |
 | type | 卡片类型，可设置为 `inner` 或 不设置 | string | - |
 | onTabChange | 页签切换的回调 | (key) => void | - |
--- a/components/card/style/index.less
+++ b/components/card/style/index.less
@@ -72,7 +72,7 @@
    .clearfix;
  }

-  &-contain-grid &-body {
+  &-contain-grid:not(&-loading) {
    margin: -1px 0 0 -1px;
    padding: 0;
  }
@@ -135,10 +135,16 @@

        & > .anticon {
          font-size: 16px;
+          line-height: 22px;
+          display: block;
+          width: 100%;
        }

        a {
          color: @text-color-secondary;
+          line-height: 22px;
+          display: inline-block;
+          width: 100%;

          &:hover {
            color: @primary-color;
@@ -165,10 +171,6 @@
    transition: padding .3s;
  }

-  &-padding-transition &-extra {
-    transition: right .3s;
-  }
-
  &-type-inner &-head {
    padding: 0 @card-padding-base;
    background: @background-color-light;
@@ -219,20 +221,17 @@

  &-loading &-body {
    user-select: none;
-    padding: 0;
  }

  &-loading-content {
-    padding: @card-padding-base;
    p {
      margin: 0;
    }
  }

  &-loading-block {
-    display: inline-block;
-    margin: 5px 2% 0 0;
    height: 14px;
+    margin: 4px 0;
    border-radius: @border-radius-sm;
    background: linear-gradient(90deg, rgba(207, 216, 220, .2), rgba(207, 216, 220, .4), rgba(207, 216, 220, .2));
    animation: card-loading 1.4s ease infinite;
--- a/components/carousel/tests/snapshots/demo.test.js.snap
+++ b/components/carousel/tests/snapshots/demo.test.js.snap
@@ -5,72 +5,213 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
  class="ant-carousel"
 >
  <div
-    class="slick-initialized slick-slider"
+    class="slick-slider slick-initialized"
+    dir="ltr"
  >
    <div
      class="slick-list"
    >
      <div
        class="slick-track"
+        style="width:900%;left:-100%"
      >
        <div
+          aria-hidden="true"
          class="slick-slide slick-cloned"
          data-index="-1"
+          style="width:11.11111111111111%"
+          tabindex="-1"
        >
-          <h3>
-            4
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                4
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-active slick-cloned"
+          aria-hidden="false"
+          class="slick-slide slick-active slick-current"
          data-index="0"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            1
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                1
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="1"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            2
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                2
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="2"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            3
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                3
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="3"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            4
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                4
+              </h3>
+            </div>
+          </div>
        </div>
        <div
+          aria-hidden="true"
          class="slick-slide slick-cloned"
          data-index="4"
+          style="width:11.11111111111111%"
+          tabindex="-1"
        >
-          <h3>
-            1
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                1
+              </h3>
+            </div>
+          </div>
+        </div>
+        <div
+          aria-hidden="true"
+          class="slick-slide slick-cloned"
+          data-index="5"
+          style="width:11.11111111111111%"
+          tabindex="-1"
+        >
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                2
+              </h3>
+            </div>
+          </div>
+        </div>
+        <div
+          aria-hidden="true"
+          class="slick-slide slick-cloned"
+          data-index="6"
+          style="width:11.11111111111111%"
+          tabindex="-1"
+        >
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                3
+              </h3>
+            </div>
+          </div>
+        </div>
+        <div
+          aria-hidden="true"
+          class="slick-slide slick-cloned"
+          data-index="7"
+          style="width:11.11111111111111%"
+          tabindex="-1"
+        >
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                4
+              </h3>
+            </div>
+          </div>
        </div>
      </div>
    </div>
+    <ul
+      class="slick-dots"
+      style="display:block"
+    >
+      <li
+        class="slick-active"
+      >
+        <button>
+          1
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          2
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          3
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          4
+        </button>
+      </li>
+    </ul>
  </div>
 </div>
 `;
@@ -80,72 +221,213 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
  class="ant-carousel"
 >
  <div
-    class="slick-initialized slick-slider"
+    class="slick-slider slick-initialized"
+    dir="ltr"
  >
    <div
      class="slick-list"
    >
      <div
        class="slick-track"
+        style="width:900%;left:-100%"
      >
        <div
+          aria-hidden="true"
          class="slick-slide slick-cloned"
          data-index="-1"
+          style="width:11.11111111111111%"
+          tabindex="-1"
        >
-          <h3>
-            4
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                4
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-active slick-cloned"
+          aria-hidden="false"
+          class="slick-slide slick-active slick-current"
          data-index="0"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            1
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                1
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="1"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            2
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                2
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="2"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            3
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                3
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="3"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            4
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                4
+              </h3>
+            </div>
+          </div>
        </div>
        <div
+          aria-hidden="true"
          class="slick-slide slick-cloned"
          data-index="4"
+          style="width:11.11111111111111%"
+          tabindex="-1"
        >
-          <h3>
-            1
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                1
+              </h3>
+            </div>
+          </div>
+        </div>
+        <div
+          aria-hidden="true"
+          class="slick-slide slick-cloned"
+          data-index="5"
+          style="width:11.11111111111111%"
+          tabindex="-1"
+        >
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                2
+              </h3>
+            </div>
+          </div>
+        </div>
+        <div
+          aria-hidden="true"
+          class="slick-slide slick-cloned"
+          data-index="6"
+          style="width:11.11111111111111%"
+          tabindex="-1"
+        >
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                3
+              </h3>
+            </div>
+          </div>
+        </div>
+        <div
+          aria-hidden="true"
+          class="slick-slide slick-cloned"
+          data-index="7"
+          style="width:11.11111111111111%"
+          tabindex="-1"
+        >
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                4
+              </h3>
+            </div>
+          </div>
        </div>
      </div>
    </div>
+    <ul
+      class="slick-dots"
+      style="display:block"
+    >
+      <li
+        class="slick-active"
+      >
+        <button>
+          1
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          2
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          3
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          4
+        </button>
+      </li>
+    </ul>
  </div>
 </div>
 `;
@@ -155,56 +437,123 @@ exports[`renders ./components/carousel/demo/fade.md correctly 1`] = `
  class="ant-carousel"
 >
  <div
-    class="slick-initialized slick-slider"
+    class="slick-slider slick-initialized"
+    dir="ltr"
  >
    <div
      class="slick-list"
    >
      <div
        class="slick-track"
+        style="width:900%;left:-100%"
      >
        <div
-          class="slick-slide slick-active slick-cloned"
+          aria-hidden="false"
+          class="slick-slide slick-active slick-current"
          data-index="0"
-          style="outline:none;position:relative;left:0;opacity:1;transition:opacity 500ms ease;-webkit-transition:opacity 500ms ease"
+          style="outline:none;width:11.11111111111111%;position:relative;left:0;opacity:1;transition:opacity 500ms ease, visibility 500ms ease;-webkit-transition:opacity 500ms ease, visibility 500ms ease"
          tabindex="-1"
        >
-          <h3>
-            1
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                1
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="1"
-          style="outline:none;position:relative;left:0;opacity:0;transition:opacity 500ms ease;-webkit-transition:opacity 500ms ease"
+          style="outline:none;width:11.11111111111111%;position:relative;left:-11px;opacity:0;transition:opacity 500ms ease, visibility 500ms ease;-webkit-transition:opacity 500ms ease, visibility 500ms ease"
          tabindex="-1"
        >
-          <h3>
-            2
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                2
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="2"
-          style="outline:none;position:relative;left:0;opacity:0;transition:opacity 500ms ease;-webkit-transition:opacity 500ms ease"
+          style="outline:none;width:11.11111111111111%;position:relative;left:-22px;opacity:0;transition:opacity 500ms ease, visibility 500ms ease;-webkit-transition:opacity 500ms ease, visibility 500ms ease"
          tabindex="-1"
        >
-          <h3>
-            3
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                3
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="3"
-          style="outline:none;position:relative;left:0;opacity:0;transition:opacity 500ms ease;-webkit-transition:opacity 500ms ease"
+          style="outline:none;width:11.11111111111111%;position:relative;left:-33px;opacity:0;transition:opacity 500ms ease, visibility 500ms ease;-webkit-transition:opacity 500ms ease, visibility 500ms ease"
          tabindex="-1"
        >
-          <h3>
-            4
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                4
+              </h3>
+            </div>
+          </div>
        </div>
      </div>
    </div>
+    <ul
+      class="slick-dots"
+      style="display:block"
+    >
+      <li
+        class="slick-active"
+      >
+        <button>
+          1
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          2
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          3
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          4
+        </button>
+      </li>
+    </ul>
  </div>
 </div>
 `;
@@ -214,72 +563,213 @@ exports[`renders ./components/carousel/demo/vertical.md correctly 1`] = `
  class="ant-carousel ant-carousel-vertical"
 >
  <div
-    class="slick-initialized slick-slider slick-vertical"
+    class="slick-slider slick-vertical slick-initialized"
+    dir="ltr"
  >
    <div
      class="slick-list"
    >
      <div
        class="slick-track"
+        style="width:900%;left:-100%"
      >
        <div
+          aria-hidden="true"
          class="slick-slide slick-cloned"
          data-index="-1"
+          style="width:11.11111111111111%"
+          tabindex="-1"
        >
-          <h3>
-            4
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                4
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-active slick-cloned"
+          aria-hidden="false"
+          class="slick-slide slick-active slick-current"
          data-index="0"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            1
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                1
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="1"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            2
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                2
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="2"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            3
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                3
+              </h3>
+            </div>
+          </div>
        </div>
        <div
-          class="slick-slide slick-cloned"
+          aria-hidden="true"
+          class="slick-slide"
          data-index="3"
-          style="outline:none"
+          style="outline:none;width:11.11111111111111%"
          tabindex="-1"
        >
-          <h3>
-            4
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                4
+              </h3>
+            </div>
+          </div>
        </div>
        <div
+          aria-hidden="true"
          class="slick-slide slick-cloned"
          data-index="4"
+          style="width:11.11111111111111%"
+          tabindex="-1"
        >
-          <h3>
-            1
-          </h3>
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                1
+              </h3>
+            </div>
+          </div>
+        </div>
+        <div
+          aria-hidden="true"
+          class="slick-slide slick-cloned"
+          data-index="5"
+          style="width:11.11111111111111%"
+          tabindex="-1"
+        >
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                2
+              </h3>
+            </div>
+          </div>
+        </div>
+        <div
+          aria-hidden="true"
+          class="slick-slide slick-cloned"
+          data-index="6"
+          style="width:11.11111111111111%"
+          tabindex="-1"
+        >
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                3
+              </h3>
+            </div>
+          </div>
+        </div>
+        <div
+          aria-hidden="true"
+          class="slick-slide slick-cloned"
+          data-index="7"
+          style="width:11.11111111111111%"
+          tabindex="-1"
+        >
+          <div>
+            <div
+              style="width:100%;display:inline-block"
+              tabindex="-1"
+            >
+              <h3>
+                4
+              </h3>
+            </div>
+          </div>
        </div>
      </div>
    </div>
+    <ul
+      class="slick-dots"
+      style="display:block"
+    >
+      <li
+        class="slick-active"
+      >
+        <button>
+          1
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          2
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          3
+        </button>
+      </li>
+      <li
+        class=""
+      >
+        <button>
+          4
+        </button>
+      </li>
+    </ul>
  </div>
 </div>
 `;
--- a/components/carousel/index.tsx
+++ b/components/carousel/index.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import debounce from 'lodash.debounce';
+import debounce from 'lodash/debounce';

 // matchMedia polyfill for
 // https://github.com/WickyNilliams/enquire.js/issues/82
--- a/components/cascader/tests/snapshots/index.test.js.snap
+++ b/components/cascader/tests/snapshots/index.test.js.snap
@@ -214,3 +214,29 @@ exports[`Cascader popup correctly with defaultValue 1`] = `
  </div>
 </div>
 `;
+
+exports[`Cascader support controlled mode 1`] = `
+<span
+  class="ant-cascader-picker"
+  tabindex="0"
+>
+  <span
+    class="ant-cascader-picker-label"
+  >
+    Zhejiang / Hangzhou / West Lake
+  </span>
+  <input
+    autocomplete="off"
+    class="ant-input ant-cascader-input "
+    readonly=""
+    type="text"
+    value=""
+  />
+  <i
+    class="anticon anticon-cross-circle ant-cascader-picker-clear"
+  />
+  <i
+    class="anticon anticon-down ant-cascader-picker-arrow"
+  />
+</span>
+`;
--- a/components/cascader/tests/index.test.js
+++ b/components/cascader/tests/index.test.js
@@ -46,6 +46,16 @@ describe('Cascader', () => {
    expect(render(wrapper.find('Trigger').instance().getComponent())).toMatchSnapshot();
  });

+  it('support controlled mode', () => {
+    const wrapper = mount(
+      <Cascader options={options} />
+    );
+    wrapper.setProps({
+      value: ['zhejiang', 'hangzhou', 'xihu'],
+    });
+    expect(wrapper.render()).toMatchSnapshot();
+  });
+
  it('popup correctly with defaultValue', () => {
    const wrapper = mount(
      <Cascader options={options} defaultValue={['zhejiang', 'hangzhou']} />
--- a/components/cascader/demo/search.md
+++ b/components/cascader/demo/search.md
@@ -52,12 +52,16 @@ function onChange(value, selectedOptions) {
  console.log(value, selectedOptions);
 }

+function filter(inputValue, path) {
+  return (path.some(option => (option.label).toLowerCase().indexOf(inputValue.toLowerCase()) > -1));
+}
+
 ReactDOM.render(
  <Cascader
    options={options}
    onChange={onChange}
    placeholder="Please select"
-    showSearch
+    showSearch={{ filter }}
  />,
  mountNode
 );
--- a/components/checkbox/Checkbox.tsx
+++ b/components/checkbox/Checkbox.tsx
@@ -5,26 +5,39 @@ import RcCheckbox from 'rc-checkbox';
 import shallowEqual from 'shallowequal';
 import CheckboxGroup, { CheckboxGroupContext } from './Group';

-export interface AbstractCheckboxProps {
+export interface AbstractCheckboxProps<T> {
  prefixCls?: string;
  className?: string;
  defaultChecked?: boolean;
  checked?: boolean;
  style?: React.CSSProperties;
  disabled?: boolean;
-  onChange?: React.ChangeEventHandler<HTMLInputElement>;
+  onChange?: (e: T) => void;
  onMouseEnter?: React.MouseEventHandler<any>;
  onMouseLeave?: React.MouseEventHandler<any>;
+  onKeyPress?: React.KeyboardEventHandler<any>;
+  onKeyDown?: React.KeyboardEventHandler<any>;
  value?: any;
  tabIndex?: number;
  name?: string;
  children?: React.ReactNode;
 }

-export interface CheckboxProps extends AbstractCheckboxProps {
+export interface CheckboxProps extends AbstractCheckboxProps<CheckboxChangeEvent> {
  indeterminate?: boolean;
 }

+export interface CheckboxChangeEventTarget extends CheckboxProps {
+  checked: boolean;
+}
+
+export interface CheckboxChangeEvent {
+  target: CheckboxChangeEventTarget;
+  stopPropagation: () => void;
+  preventDefault: () => void;
+  nativeEvent: MouseEvent;
+}
+
 export default class Checkbox extends React.Component<CheckboxProps, {}> {
  static Group: typeof CheckboxGroup;
  static defaultProps = {
--- a/components/checkbox/Group.tsx
+++ b/components/checkbox/Group.tsx
@@ -41,7 +41,7 @@ export interface CheckboxGroupContext {
 export default class CheckboxGroup extends React.Component<CheckboxGroupProps, CheckboxGroupState> {
  static defaultProps = {
    options: [],
-    prefixCls: 'ant-checkbox-group',
+    prefixCls: 'ant-checkbox',
  };

  static propTypes = {
@@ -115,23 +115,25 @@ export default class CheckboxGroup extends React.Component<CheckboxGroupProps, C
  render() {
    const { props, state } = this;
    const { prefixCls, className, style, options } = props;
+    const groupPrefixCls = `${prefixCls}-group`;
    let children = props.children;
    if (options && options.length > 0) {
      children = this.getOptions().map(option => (
        <Checkbox
+          prefixCls={prefixCls}
          key={option.value}
          disabled={'disabled' in option ? option.disabled : props.disabled}
          value={option.value}
          checked={state.value.indexOf(option.value) !== -1}
          onChange={() => this.toggleOption(option)}
-          className={`${prefixCls}-item`}
+          className={`${groupPrefixCls}-item`}
        >
          {option.label}
        </Checkbox>
      ));
    }

-    const classString = classNames(prefixCls, className);
+    const classString = classNames(groupPrefixCls, className);
    return (
      <div className={classString} style={style}>
        {children}
--- a/components/checkbox/tests/snapshots/demo.test.js.snap
+++ b/components/checkbox/tests/snapshots/demo.test.js.snap
@@ -59,6 +59,7 @@ exports[`renders ./components/checkbox/demo/check-all.md correctly 1`] = `
          checked=""
          class="ant-checkbox-input"
          type="checkbox"
+          value="Apple"
        />
        <span
          class="ant-checkbox-inner"
@@ -77,6 +78,7 @@ exports[`renders ./components/checkbox/demo/check-all.md correctly 1`] = `
        <input
          class="ant-checkbox-input"
          type="checkbox"
+          value="Pear"
        />
        <span
          class="ant-checkbox-inner"
@@ -96,6 +98,7 @@ exports[`renders ./components/checkbox/demo/check-all.md correctly 1`] = `
          checked=""
          class="ant-checkbox-input"
          type="checkbox"
+          value="Orange"
        />
        <span
          class="ant-checkbox-inner"
@@ -210,6 +213,7 @@ exports[`renders ./components/checkbox/demo/group.md correctly 1`] = `
          checked=""
          class="ant-checkbox-input"
          type="checkbox"
+          value="Apple"
        />
        <span
          class="ant-checkbox-inner"
@@ -228,6 +232,7 @@ exports[`renders ./components/checkbox/demo/group.md correctly 1`] = `
        <input
          class="ant-checkbox-input"
          type="checkbox"
+          value="Pear"
        />
        <span
          class="ant-checkbox-inner"
@@ -246,6 +251,7 @@ exports[`renders ./components/checkbox/demo/group.md correctly 1`] = `
        <input
          class="ant-checkbox-input"
          type="checkbox"
+          value="Orange"
        />
        <span
          class="ant-checkbox-inner"
@@ -270,6 +276,7 @@ exports[`renders ./components/checkbox/demo/group.md correctly 1`] = `
        <input
          class="ant-checkbox-input"
          type="checkbox"
+          value="Apple"
        />
        <span
          class="ant-checkbox-inner"
@@ -289,6 +296,7 @@ exports[`renders ./components/checkbox/demo/group.md correctly 1`] = `
          checked=""
          class="ant-checkbox-input"
          type="checkbox"
+          value="Pear"
        />
        <span
          class="ant-checkbox-inner"
@@ -307,6 +315,7 @@ exports[`renders ./components/checkbox/demo/group.md correctly 1`] = `
        <input
          class="ant-checkbox-input"
          type="checkbox"
+          value="Orange"
        />
        <span
          class="ant-checkbox-inner"
@@ -333,6 +342,7 @@ exports[`renders ./components/checkbox/demo/group.md correctly 1`] = `
          class="ant-checkbox-input"
          disabled=""
          type="checkbox"
+          value="Apple"
        />
        <span
          class="ant-checkbox-inner"
@@ -352,6 +362,7 @@ exports[`renders ./components/checkbox/demo/group.md correctly 1`] = `
          class="ant-checkbox-input"
          disabled=""
          type="checkbox"
+          value="Pear"
        />
        <span
          class="ant-checkbox-inner"
@@ -371,6 +382,7 @@ exports[`renders ./components/checkbox/demo/group.md correctly 1`] = `
          class="ant-checkbox-input"
          disabled=""
          type="checkbox"
+          value="Orange"
        />
        <span
          class="ant-checkbox-inner"
@@ -404,6 +416,7 @@ exports[`renders ./components/checkbox/demo/layout.md correctly 1`] = `
          <input
            class="ant-checkbox-input"
            type="checkbox"
+            value="A"
          />
          <span
            class="ant-checkbox-inner"
@@ -426,6 +439,7 @@ exports[`renders ./components/checkbox/demo/layout.md correctly 1`] = `
          <input
            class="ant-checkbox-input"
            type="checkbox"
+            value="B"
          />
          <span
            class="ant-checkbox-inner"
@@ -448,6 +462,7 @@ exports[`renders ./components/checkbox/demo/layout.md correctly 1`] = `
          <input
            class="ant-checkbox-input"
            type="checkbox"
+            value="C"
          />
          <span
            class="ant-checkbox-inner"
@@ -470,6 +485,7 @@ exports[`renders ./components/checkbox/demo/layout.md correctly 1`] = `
          <input
            class="ant-checkbox-input"
            type="checkbox"
+            value="D"
          />
          <span
            class="ant-checkbox-inner"
@@ -492,6 +508,7 @@ exports[`renders ./components/checkbox/demo/layout.md correctly 1`] = `
          <input
            class="ant-checkbox-input"
            type="checkbox"
+            value="E"
          />
          <span
            class="ant-checkbox-inner"
--- a/components/checkbox/tests/snapshots/group.test.js.snap
+++ b/components/checkbox/tests/snapshots/group.test.js.snap
@@ -0,0 +1,46 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CheckboxGroup passes prefixCls down to checkbox 1`] = `
+<div
+  class="my-checkbox-group"
+>
+  <label
+    class="my-checkbox-group-item my-checkbox-wrapper"
+  >
+    <span
+      class="my-checkbox"
+    >
+      <input
+        class="my-checkbox-input"
+        type="checkbox"
+        value="Apple"
+      />
+      <span
+        class="my-checkbox-inner"
+      />
+    </span>
+    <span>
+      Apple
+    </span>
+  </label>
+  <label
+    class="my-checkbox-group-item my-checkbox-wrapper"
+  >
+    <span
+      class="my-checkbox"
+    >
+      <input
+        class="my-checkbox-input"
+        type="checkbox"
+        value="Orange"
+      />
+      <span
+        class="my-checkbox-inner"
+      />
+    </span>
+    <span>
+      Orange
+    </span>
+  </label>
+</div>
+`;
--- a/components/checkbox/tests/group.test.js
+++ b/components/checkbox/tests/group.test.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mount, render } from 'enzyme';
 import Checkbox from '../index';

 describe('CheckboxGroup', () => {
@@ -51,4 +51,17 @@ describe('CheckboxGroup', () => {
    groupWrapper.find('.ant-checkbox-input').at(1).simulate('change');
    expect(onChangeGroup).toBeCalledWith(['Apple']);
  });
+
+  it('passes prefixCls down to checkbox', () => {
+    const options = [
+      { label: 'Apple', value: 'Apple' },
+      { label: 'Orange', value: 'Orange' },
+    ];
+
+    const wrapper = render(
+      <Checkbox.Group prefixCls="my-checkbox" options={options} />
+    );
+
+    expect(wrapper).toMatchSnapshot();
+  });
 });
--- a/components/checkbox/index.tsx
+++ b/components/checkbox/index.tsx
@@ -1,7 +1,7 @@
 import Checkbox from './Checkbox';
 import Group from './Group';

-export { CheckboxProps } from './Checkbox';
+export { CheckboxProps, CheckboxChangeEvent } from './Checkbox';
 export { CheckboxGroupProps, CheckboxOptionType } from './Group';

 Checkbox.Group = Group;
--- a/components/checkbox/style/mixin.less
+++ b/components/checkbox/style/mixin.less
@@ -17,7 +17,7 @@
    .@{checkbox-prefix-cls}-wrapper:hover &-inner,
    &:hover &-inner,
    &-input:focus + &-inner {
-      border-color: @primary-color;
+      border-color: @checkbox-color;
    }

    &-checked:after {
@@ -27,7 +27,7 @@
      width: 100%;
      height: 100%;
      border-radius: @border-radius-sm;
-      border: 1px solid @primary-color;
+      border: 1px solid @checkbox-color;
      content: '';
      animation: antCheckboxEffect 0.36s ease-in-out;
      animation-fill-mode: both;
@@ -115,8 +115,8 @@
  .@{checkbox-prefix-cls}-checked,
  .@{checkbox-prefix-cls}-indeterminate {
    .@{checkbox-inner-prefix-cls} {
-      background-color: @primary-color;
-      border-color: @primary-color;
+      background-color: @checkbox-color;
+      border-color: @checkbox-color;
    }
  }

--- a/components/collapse/CollapsePanel.tsx
+++ b/components/collapse/CollapsePanel.tsx
@@ -10,6 +10,7 @@ export interface CollapsePanelProps {
  style?: React.CSSProperties;
  showArrow?: boolean;
  prefixCls?: string;
+  forceRender?: boolean;
 }

 export default class CollapsePanel extends React.Component<CollapsePanelProps, {}> {
--- a/components/collapse/index.en-US.md
+++ b/components/collapse/index.en-US.md
@@ -30,3 +30,4 @@ A content area which can be collapsed and expanded.
 | header | Title of the panel | string\|ReactNode | - |
 | key | Unique key identifying the panel from among its siblings | string | - |
 | showArrow | If `false`, panel will not show arrow icon | boolean | `true` |
+| forceRender | Forced render of content on panel, instead of lazy rending after clicking on header | boolean | `false` |
--- a/components/collapse/index.zh-CN.md
+++ b/components/collapse/index.zh-CN.md
@@ -30,3 +30,4 @@ cols: 1
 | disabled | 禁用后的面板展开与否将无法通过用户交互改变 | boolean | false |
 | header | 面板头内容 | string\|ReactNode | 无 |
 | key | 对应 activeKey | string | 无 |
+| forceRender | 被隐藏时是否渲染 DOM 结构 | boolean | false |
--- a/components/date-picker/RangePicker.tsx
+++ b/components/date-picker/RangePicker.tsx
@@ -6,9 +6,8 @@ import RcDatePicker from 'rc-calendar/lib/Picker';
 import classNames from 'classnames';
 import Icon from '../icon';
 import warning from '../_util/warning';
-import callMoment from '../_util/callMoment';
-
-export type RangePickerValue = moment.Moment[];
+import interopDefault from '../_util/interopDefault';
+import { RangePickerValue, RangePickerPresetRange } from './interface';

 export interface RangePickerState {
  value?: RangePickerValue;
@@ -17,21 +16,21 @@ export interface RangePickerState {
  hoverValue?: RangePickerValue;
 }

-function getShowDateFromValue(value: moment.Moment[]): moment.Moment[] | undefined {
+function getShowDateFromValue(value: RangePickerValue) {
  const [start, end] = value;
  // value could be an empty array, then we should not reset showDate
  if (!start && !end) {
    return;
  }
  const newEnd = end && end.isSame(start, 'month') ? end.clone().add(1, 'month') : end;
-  return [start, newEnd];
+  return [start, newEnd] as RangePickerValue;
 }

 function formatValue(value: moment.Moment | undefined, format: string): string {
  return (value && value.format(format)) || '';
 }

-function pickerValueAdapter(value?: moment.Moment | moment.Moment[]): moment.Moment[] | undefined {
+function pickerValueAdapter(value?: moment.Moment | RangePickerValue): RangePickerValue | undefined {
  if (!value) {
    return;
  }
@@ -48,6 +47,21 @@ function isEmptyArray(arr: any) {
  return false;
 }

+function fixLocale(value: RangePickerValue | undefined, localeCode: string) {
+  if (!localeCode) {
+    return;
+  }
+  if (!value || value.length === 0) {
+    return;
+  }
+  if (value[0]) {
+    value[0]!.locale(localeCode);
+  }
+  if (value[1]) {
+    value[1]!.locale(localeCode);
+  }
+}
+
 export default class RangePicker extends React.Component<any, RangePickerState> {
  static defaultProps = {
    prefixCls: 'ant-calendar',
@@ -61,8 +75,8 @@ export default class RangePicker extends React.Component<any, RangePickerState>
    super(props);
    const value = props.value || props.defaultValue || [];
    if (
-      value[0] && !moment.isMoment(value[0]) ||
-      value[1] && !moment.isMoment(value[1])
+      value[0] && !interopDefault(moment).isMoment(value[0]) ||
+      value[1] && !interopDefault(moment).isMoment(value[1])
    ) {
      throw new Error(
        'The value/defaultValue of RangePicker must be a moment object array after `antd@2.0`, ' +
@@ -72,7 +86,7 @@ export default class RangePicker extends React.Component<any, RangePickerState>
    const pickerValue = !value || isEmptyArray(value) ? props.defaultPickerValue : value;
    this.state = {
      value,
-      showDate: pickerValueAdapter(pickerValue || callMoment(moment)),
+      showDate: pickerValueAdapter(pickerValue || interopDefault(moment)()),
      open: props.open,
      hoverValue: [],
    };
@@ -103,7 +117,7 @@ export default class RangePicker extends React.Component<any, RangePickerState>

  clearHoverValue = () => this.setState({ hoverValue: [] });

-  handleChange = (value: moment.Moment[]) => {
+  handleChange = (value: RangePickerValue) => {
    const props = this.props;
    if (!('value' in props)) {
      this.setState(({ showDate }) => ({
@@ -122,6 +136,10 @@ export default class RangePicker extends React.Component<any, RangePickerState>
      this.setState({ open });
    }

+    if (open === false) {
+      this.clearHoverValue();
+    }
+
    const { onOpenChange } = this.props;
    if (onOpenChange) {
      onOpenChange(open);
@@ -132,7 +150,36 @@ export default class RangePicker extends React.Component<any, RangePickerState>

  handleHoverChange = (hoverValue: any) => this.setState({ hoverValue });

-  setValue(value: moment.Moment[], hidePanel?: boolean) {
+  handleRangeMouseLeave = () => {
+    if (this.state.open) {
+      this.clearHoverValue();
+    }
+  }
+
+  handleCalendarInputSelect = (value: RangePickerValue) => {
+    if (!value[0]) {
+      return;
+    }
+    this.setState(({ showDate }) => ({
+      value,
+      showDate: getShowDateFromValue(value) || showDate,
+    }));
+  }
+
+  handleRangeClick = (value: RangePickerPresetRange) => {
+    if (typeof value === 'function') {
+      value = value();
+    }
+
+    this.setValue(value, true);
+
+    const { onOk } = this.props;
+    if (onOk) {
+      onOk(value);
+    }
+  }
+
+  setValue(value: RangePickerValue, hidePanel?: boolean) {
    this.handleChange(value);
    if ((hidePanel || !this.props.showTime) && !('open' in this.props)) {
      this.setState({ open: false });
@@ -166,9 +213,9 @@ export default class RangePicker extends React.Component<any, RangePickerState>
      return (
        <a
          key={range}
-          onClick={() => this.setValue(value, true)}
+          onClick={() => this.handleRangeClick(value)}
          onMouseEnter={() => this.setState({ hoverValue: value })}
-          onMouseLeave={this.clearHoverValue}
+          onMouseLeave={this.handleRangeMouseLeave}
        >
          {range}
        </a>
@@ -192,14 +239,9 @@ export default class RangePicker extends React.Component<any, RangePickerState>
      ranges, onOk, locale, localeCode, format,
      dateRender, onCalendarChange,
    } = props;
-    if (value && localeCode) {
-      if (value[0]) {
-        value[0].locale(localeCode);
-      }
-      if (value[1]) {
-        value[1].locale(localeCode);
-      }
-    }
+
+    fixLocale(value, localeCode);
+    fixLocale(showDate, localeCode);

    warning(!('onOK' in props), 'It should be `RangePicker[onOk]`, instead of `onOK`!');

@@ -250,6 +292,7 @@ export default class RangePicker extends React.Component<any, RangePickerState>
        onHoverChange={this.handleHoverChange}
        onPanelChange={props.onPanelChange}
        showToday={showToday}
+        onInputSelect={this.handleCalendarInputSelect}
      />
    );

@@ -298,6 +341,7 @@ export default class RangePicker extends React.Component<any, RangePickerState>
    return (
      <span
        ref={this.savePicker}
+        id={props.id}
        className={classNames(props.className, props.pickerClass)}
        style={{ ...style, ...pickerStyle }}
        tabIndex={props.disabled ? -1 : 0}
--- a/components/date-picker/WeekPicker.tsx
+++ b/components/date-picker/WeekPicker.tsx
@@ -4,6 +4,7 @@ import Calendar from 'rc-calendar';
 import RcDatePicker from 'rc-calendar/lib/Picker';
 import classNames from 'classnames';
 import Icon from '../icon';
+import interopDefault from '../_util/interopDefault';

 function formatValue(value: moment.Moment | null, format: string): string {
  return (value && value.format(format)) || '';
@@ -11,7 +12,7 @@ function formatValue(value: moment.Moment | null, format: string): string {

 export default class WeekPicker extends React.Component<any, any> {
  static defaultProps = {
-    format: 'YYYY-Wo',
+    format: 'gggg-wo',
    allowClear: true,
  };

@@ -20,7 +21,7 @@ export default class WeekPicker extends React.Component<any, any> {
  constructor(props: any) {
    super(props);
    const value = props.value || props.defaultValue;
-    if (value && !moment.isMoment(value)) {
+    if (value && !interopDefault(moment).isMoment(value)) {
      throw new Error(
        'The value/defaultValue of DatePicker or MonthPicker must be ' +
        'a moment object after `antd@2.0`, see: https://u.ant.design/date-picker-value',
@@ -39,8 +40,8 @@ export default class WeekPicker extends React.Component<any, any> {
    const selectedValue = this.state.value;
    const { prefixCls } = this.props;
    if (selectedValue &&
-        current.year() === selectedValue.year() &&
-        current.week() === selectedValue.week()) {
+      current.year() === selectedValue.year() &&
+      current.week() === selectedValue.week()) {
      return (
        <div className={`${prefixCls}-selected-day`}>
          <div className={`${prefixCls}-date`}>
@@ -50,7 +51,7 @@ export default class WeekPicker extends React.Component<any, any> {
      );
    }
    return (
-      <div className={`${prefixCls}-calendar-date`}>
+      <div className={`${prefixCls}-date`}>
        {current.date()}
      </div>
    );
@@ -83,6 +84,7 @@ export default class WeekPicker extends React.Component<any, any> {
    const {
      prefixCls, className, disabled, pickerClass, popupStyle,
      pickerInputClass, format, allowClear, locale, localeCode, disabledDate,
+      style, onFocus, onBlur,
    } = this.props;

    const pickerValue = this.state.value;
@@ -122,8 +124,9 @@ export default class WeekPicker extends React.Component<any, any> {
            value={(value && value.format(format)) || ''}
            placeholder={placeholder}
            className={pickerInputClass}
-            onFocus={this.props.onFocus}
-            onBlur={this.props.onBlur}
+            onFocus={onFocus}
+            onBlur={onBlur}
+            style={style}
          />
          {clearIcon}
          <span className={`${prefixCls}-picker-icon`} />
@@ -131,7 +134,7 @@ export default class WeekPicker extends React.Component<any, any> {
      );
    };
    return (
-      <span className={classNames(className, pickerClass)}>
+      <span className={classNames(className, pickerClass)} id={this.props.id}>
        <RcDatePicker
          {...this.props}
          calendar={calendar}
--- a/components/date-picker/tests/DatePicker.test.js
+++ b/components/date-picker/tests/DatePicker.test.js
@@ -3,11 +3,27 @@ import { mount } from 'enzyme';
 import moment from 'moment';
 import MockDate from 'mockdate';
 import DatePicker from '..';
+import {
+  selectDate,
+  openPanel,
+  clearInput,
+  nextYear,
+  nextMonth,
+  hasSelected,
+} from './utils';
 import focusTest from '../../../tests/shared/focusTest';

 describe('DatePicker', () => {
  focusTest(DatePicker);

+  beforeEach(() => {
+    MockDate.set(moment('2016-11-22'));
+  });
+
+  afterEach(() => {
+    MockDate.reset();
+  });
+
  it('prop locale should works', () => {
    const locale = {
      lang: {
@@ -46,12 +62,80 @@ describe('DatePicker', () => {
        placeholder: 'Избор на час',
      },
    };
-    MockDate.set(new Date('2016-11-22').getTime() + (new Date().getTimezoneOffset() * 60 * 1000));
    const birthday = moment('2000-01-01', 'YYYY-MM-DD');
    const wrapper = mount(
      <DatePicker open locale={locale} value={birthday} />
    );
    expect(wrapper.render()).toMatchSnapshot();
-    MockDate.reset();
+  });
+
+  // Fix https://github.com/ant-design/ant-design/issues/8885
+  it('control value after panel closed', () => {
+    class Test extends React.Component {
+      state = {
+        cleared: false,
+        value: moment(),
+      }
+
+      onChange = (value) => {
+        let cleared = this.state.cleared;
+
+        if (cleared) {
+          value = moment(moment(value).format('YYYY-MM-DD 12:12:12'));
+          cleared = false;
+        }
+
+        if (!value) {
+          cleared = true;
+        }
+
+        this.setState({ value, cleared });
+      }
+
+      render() {
+        return (
+          <DatePicker
+            showTime
+            value={this.state.value}
+            format="YYYY-MM-DD HH:mm:ss"
+            onChange={this.onChange}
+          />
+        );
+      }
+    }
+
+    const wrapper = mount(<Test />);
+    // clear input
+    clearInput(wrapper);
+    openPanel(wrapper);
+    selectDate(wrapper, moment('2016-11-13'));
+    expect(wrapper.find('.ant-calendar-input').getDOMNode().value).toBe('2016-11-13 12:12:12');
+    selectDate(wrapper, moment('2016-11-14'));
+    expect(wrapper.find('.ant-calendar-input').getDOMNode().value).toBe('2016-11-14 12:12:12');
+  });
+
+  it('triggers onChange only when date was selected', () => {
+    const handleChange = jest.fn();
+    const wrapper = mount(
+      <DatePicker onChange={handleChange} />
+    );
+    openPanel(wrapper);
+    nextYear(wrapper);
+    expect(handleChange).not.toBeCalled();
+    nextMonth(wrapper);
+    expect(handleChange).not.toBeCalled();
+    selectDate(wrapper, moment('2017-12-22'));
+    expect(handleChange).toBeCalled();
+  });
+
+  it('clear input', () => {
+    const wrapper = mount(
+      <DatePicker />
+    );
+    openPanel(wrapper);
+    selectDate(wrapper, moment('2016-11-23'));
+    clearInput(wrapper);
+    openPanel(wrapper);
+    expect(hasSelected(wrapper, moment('2016-11-22'))).toBe(true);
  });
 });
--- a/components/date-picker/tests/RangePicker.test.js
+++ b/components/date-picker/tests/RangePicker.test.js
@@ -2,6 +2,8 @@ import React from 'react';
 import { mount, render } from 'enzyme';
 import moment from 'moment';
 import DatePicker from '../';
+import { setMockDate, resetMockDate } from '../../../tests/utils';
+import { selectDate } from './utils';
 import focusTest from '../../../tests/shared/focusTest';

 const { RangePicker } = DatePicker;
@@ -9,6 +11,14 @@ const { RangePicker } = DatePicker;
 describe('RangePicker', () => {
  focusTest(RangePicker);

+  beforeEach(() => {
+    setMockDate();
+  });
+
+  afterEach(() => {
+    resetMockDate();
+  });
+
  it('show month panel according to value', () => {
    const birthday = moment('2000-01-01', 'YYYY-MM-DD').locale('zh-cn');
    const wrapper = mount(
@@ -112,4 +122,97 @@ describe('RangePicker', () => {
    expect(() => rangeCalendarWrapper.find('.ant-calendar-cell').at(15).simulate('click').simulate('click'))
      .not.toThrow();
  });
+
+  it('clear hover value after panel close', () => {
+    jest.useFakeTimers();
+    const wrapper = mount(
+      <div>
+        <RangePicker value={[moment(), moment().add(2, 'day')]} />
+      </div>
+    );
+    wrapper.find('.ant-calendar-picker-input').simulate('click');
+    wrapper.find('.ant-calendar-cell').at(25).simulate('click');
+    wrapper.find('.ant-calendar-cell').at(27).simulate('mouseEnter');
+    document.dispatchEvent(new MouseEvent('mousedown'));
+    jest.runAllTimers();
+    wrapper.find('.ant-calendar-picker-input').simulate('click');
+    expect(
+      wrapper.find('.ant-calendar-cell').at(23).hasClass('ant-calendar-in-range-cell')
+    ).toBe(true);
+  });
+
+  describe('preset range', () => {
+    it('static range', () => {
+      const range = [moment().subtract(2, 'd'), moment()];
+      const format = 'YYYY-MM-DD HH:mm:ss';
+      const wrapper = mount(
+        <RangePicker
+          ranges={{ 'recent two days': range }}
+          format={format}
+        />
+      );
+      wrapper.find('.ant-calendar-picker-input').simulate('click');
+      wrapper.find('.ant-calendar-range-quick-selector a').simulate('click');
+      expect(
+        wrapper.find('.ant-calendar-range-picker-input').first().getDOMNode().value
+      ).toBe(range[0].format(format));
+      expect(
+        wrapper.find('.ant-calendar-range-picker-input').last().getDOMNode().value
+      ).toBe(range[1].format(format));
+    });
+
+    it('function range', () => {
+      const range = [moment().subtract(2, 'd'), moment()];
+      const format = 'YYYY-MM-DD HH:mm:ss';
+      const wrapper = mount(
+        <RangePicker
+          ranges={{ 'recent two days': () => range }}
+          format={format}
+        />
+      );
+      wrapper.find('.ant-calendar-picker-input').simulate('click');
+      wrapper.find('.ant-calendar-range-quick-selector a').simulate('click');
+      expect(
+        wrapper.find('.ant-calendar-range-picker-input').first().getDOMNode().value
+      ).toBe(range[0].format(format));
+      expect(
+        wrapper.find('.ant-calendar-range-picker-input').last().getDOMNode().value
+      ).toBe(range[1].format(format));
+    });
+  });
+
+  // https://github.com/ant-design/ant-design/issues/6999
+  it('input date manually', () => {
+    const wrapper = mount(<RangePicker open />);
+    const dateString = '2008-12-31';
+    const input = wrapper.find('.ant-calendar-input').first();
+    input.simulate('change', { target: { value: dateString } });
+    expect(input.getDOMNode().value).toBe(dateString);
+  });
+
+  it('triggers onOk when click on preset range', () => {
+    const handleOk = jest.fn();
+    const range = [moment().subtract(2, 'd'), moment()];
+    const wrapper = mount(
+      <RangePicker
+        ranges={{ 'recent two days': range }}
+        onOk={handleOk}
+      />
+    );
+    wrapper.find('.ant-calendar-picker-input').simulate('click');
+    wrapper.find('.ant-calendar-range-quick-selector a').simulate('click');
+    expect(handleOk).toBeCalledWith(range);
+  });
+
+  // https://github.com/ant-design/ant-design/issues/9267
+  it('invali end date not throw error', () => {
+    const wrapper = mount(<RangePicker />);
+    wrapper.find('.ant-calendar-picker-input').simulate('click');
+    selectDate(wrapper, moment('2017-09-18'), 0);
+    selectDate(wrapper, moment('2017-10-18'), 1);
+    wrapper.find('.ant-calendar-picker-input').simulate('click');
+    expect(() =>
+      wrapper.find('.ant-calendar-input').at(1).simulate('change', { target: { value: '2016-01-01' } })
+    ).not.toThrow();
+  });
 });
--- a/components/date-picker/tests/WeekPicker.test.js
+++ b/components/date-picker/tests/WeekPicker.test.js
@@ -1,3 +1,5 @@
+import React from 'react';
+import { mount } from 'enzyme';
 import DatePicker from '..';
 import focusTest from '../../../tests/shared/focusTest';

@@ -5,4 +7,11 @@ const { WeekPicker } = DatePicker;

 describe('WeekPicker', () => {
  focusTest(WeekPicker);
+
+  it('should support style prop', () => {
+    const wrapper = mount(
+      <WeekPicker style={{ width: 400 }} />
+    );
+    expect(wrapper.render()).toMatchSnapshot();
+  });
 });
--- a/components/date-picker/tests/snapshots/WeekPicker.test.js.snap
+++ b/components/date-picker/tests/snapshots/WeekPicker.test.js.snap
@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`WeekPicker should support style prop 1`] = `
+<span
+  class="ant-calendar-picker"
+>
+  <span>
+    <input
+      class="ant-calendar-picker-input ant-input"
+      placeholder="Select date"
+      readonly=""
+      style="width: 400px;"
+      value=""
+    />
+    <span
+      class="ant-calendar-picker-icon"
+    />
+  </span>
+</span>
+`;
--- a/components/date-picker/tests/snapshots/demo.test.js.snap
+++ b/components/date-picker/tests/snapshots/demo.test.js.snap
@@ -601,6 +601,7 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
        <input
          class="ant-radio-button-input"
          type="radio"
+          value="large"
        />
        <span
          class="ant-radio-button-inner"
@@ -620,6 +621,7 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
          checked=""
          class="ant-radio-button-input"
          type="radio"
+          value="default"
        />
        <span
          class="ant-radio-button-inner"
@@ -638,6 +640,7 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
        <input
          class="ant-radio-button-input"
          type="radio"
+          value="small"
        />
        <span
          class="ant-radio-button-inner"
--- a/components/date-picker/tests/snapshots/other.test.js.snap
+++ b/components/date-picker/tests/snapshots/other.test.js.snap
@@ -443,7 +443,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="1999年12月27日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      27
                    </div>
@@ -454,7 +454,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="1999年12月28日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      28
                    </div>
@@ -465,7 +465,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="1999年12月29日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      29
                    </div>
@@ -476,7 +476,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="1999年12月30日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      30
                    </div>
@@ -487,7 +487,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="1999年12月31日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      31
                    </div>
@@ -539,7 +539,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月3日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      3
                    </div>
@@ -550,7 +550,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月4日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      4
                    </div>
@@ -561,7 +561,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月5日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      5
                    </div>
@@ -572,7 +572,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月6日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      6
                    </div>
@@ -583,7 +583,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月7日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      7
                    </div>
@@ -594,7 +594,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月8日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      8
                    </div>
@@ -605,7 +605,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月9日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      9
                    </div>
@@ -627,7 +627,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月10日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      10
                    </div>
@@ -638,7 +638,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月11日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      11
                    </div>
@@ -649,7 +649,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月12日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      12
                    </div>
@@ -660,7 +660,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月13日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      13
                    </div>
@@ -671,7 +671,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月14日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      14
                    </div>
@@ -682,7 +682,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月15日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      15
                    </div>
@@ -693,7 +693,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月16日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      16
                    </div>
@@ -715,7 +715,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月17日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      17
                    </div>
@@ -726,7 +726,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月18日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      18
                    </div>
@@ -737,7 +737,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月19日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      19
                    </div>
@@ -748,7 +748,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月20日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      20
                    </div>
@@ -759,7 +759,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月21日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      21
                    </div>
@@ -770,7 +770,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月22日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      22
                    </div>
@@ -781,7 +781,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月23日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      23
                    </div>
@@ -803,7 +803,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月24日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      24
                    </div>
@@ -814,7 +814,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月25日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      25
                    </div>
@@ -825,7 +825,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月26日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      26
                    </div>
@@ -836,7 +836,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月27日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      27
                    </div>
@@ -847,7 +847,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月28日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      28
                    </div>
@@ -858,7 +858,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月29日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      29
                    </div>
@@ -869,7 +869,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月30日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      30
                    </div>
@@ -891,7 +891,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年1月31日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      31
                    </div>
@@ -902,7 +902,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年2月1日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      1
                    </div>
@@ -913,7 +913,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年2月2日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      2
                    </div>
@@ -924,7 +924,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年2月3日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      3
                    </div>
@@ -935,7 +935,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年2月4日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      4
                    </div>
@@ -946,7 +946,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年2月5日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      5
                    </div>
@@ -957,7 +957,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
                    title="2000年2月6日"
                  >
                    <div
-                      class="ant-calendar-calendar-date"
+                      class="ant-calendar-date"
                    >
                      6
                    </div>
--- a/components/date-picker/tests/utils.js
+++ b/components/date-picker/tests/utils.js
@@ -0,0 +1,28 @@
+/* eslint-disable import/prefer-default-export */
+export function selectDate(wrapper, date, index) {
+  let calendar = wrapper;
+  if (index !== undefined) {
+    calendar = wrapper.find('.ant-calendar-range-part').at(index);
+  }
+  calendar.find({ title: date.format('LL'), role: 'gridcell' }).simulate('click');
+}
+
+export function hasSelected(wrapper, date) {
+  return wrapper.find({ title: date.format('LL'), role: 'gridcell' }).hasClass('ant-calendar-selected-day');
+}
+
+export function openPanel(wrapper) {
+  wrapper.find('.ant-calendar-picker-input').simulate('click');
+}
+
+export function clearInput(wrapper) {
+  wrapper.find('.ant-calendar-picker-clear').hostNodes().simulate('click');
+}
+
+export function nextYear(wrapper) {
+  wrapper.find('.ant-calendar-next-year-btn').simulate('click');
+}
+
+export function nextMonth(wrapper) {
+  wrapper.find('.ant-calendar-next-month-btn').simulate('click');
+}
--- a/components/date-picker/createPicker.tsx
+++ b/components/date-picker/createPicker.tsx
@@ -6,7 +6,7 @@ import classNames from 'classnames';
 import omit from 'omit.js';
 import Icon from '../icon';
 import warning from '../_util/warning';
-import callMoment from '../_util/callMoment';
+import interopDefault from '../_util/interopDefault';

 export interface PickerProps {
  value?: moment.Moment;
@@ -26,7 +26,7 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
    constructor(props: any) {
      super(props);
      const value = props.value || props.defaultValue;
-      if (value && !moment.isMoment(value)) {
+      if (value && !interopDefault(moment).isMoment(value)) {
        throw new Error(
          'The value/defaultValue of DatePicker or MonthPicker must be ' +
          'a moment object after `antd@2.0`, see: https://u.ant.design/date-picker-value',
@@ -34,6 +34,7 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
      }
      this.state = {
        value,
+        showDate: value,
      };
    }

@@ -41,6 +42,7 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
      if ('value' in nextProps) {
        this.setState({
          value: nextProps.value,
+          showDate: nextProps.value,
        });
      }
    }
@@ -63,11 +65,18 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
    handleChange = (value: moment.Moment | null) => {
      const props = this.props;
      if (!('value' in props)) {
-        this.setState({ value });
+        this.setState({
+          value,
+          showDate: value,
+        });
      }
      props.onChange(value, (value && value.format(props.format)) || '');
    }

+    handleCalendarChange = (value: moment.Moment) => {
+      this.setState({ showDate: value });
+    }
+
    focus() {
      this.input.focus();
    }
@@ -81,7 +90,7 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
    }

    render() {
-      const { value } = this.state;
+      const { value, showDate } = this.state;
      const props = omit(this.props, ['onChange']);
      const { prefixCls, locale, localeCode } = props;

@@ -95,6 +104,10 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
        [`${prefixCls}-month`]: MonthCalendar === TheCalendar,
      });

+      if (value && localeCode) {
+        value.locale(localeCode);
+      }
+
      let pickerProps: Object = {};
      let calendarProps: any = {};
      if (props.showTime) {
@@ -119,7 +132,7 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
          disabledTime={disabledTime}
          locale={locale.lang}
          timePicker={props.timePicker}
-          defaultValue={props.defaultPickerValue || callMoment(moment)}
+          defaultValue={props.defaultPickerValue || interopDefault(moment)()}
          dateInputPlaceholder={placeholder}
          prefixCls={prefixCls}
          className={calendarClassName}
@@ -130,6 +143,8 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
          monthCellContentRender={props.monthCellContentRender}
          renderFooter={this.renderFooter}
          onPanelChange={props.onPanelChange}
+          onChange={this.handleCalendarChange}
+          value={showDate}
        />
      );

@@ -156,12 +171,9 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
        </div>
      );

-      const pickerValue = value;
-      if (pickerValue && localeCode) {
-        pickerValue.locale(localeCode);
-      }
      return (
        <span
+          id={props.id}
          className={classNames(props.className, props.pickerClass)}
          style={props.style}
          onFocus={props.onFocus}
@@ -171,7 +183,7 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
            {...props}
            {...pickerProps}
            calendar={calendar}
-            value={pickerValue}
+            value={value}
            prefixCls={`${prefixCls}-picker-container`}
            style={props.popupStyle}
          >
--- a/components/date-picker/index.en-US.md
+++ b/components/date-picker/index.en-US.md
@@ -47,6 +47,7 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicke
 | open | open state of picker | boolean | - |
 | placeholder | placeholder of date input | string\|RangePicker\[] | - |
 | popupStyle | to customize the style of the popup calendar | object | {} |
+| dropdownClassName | to customize the className of the popup calendar  | string | - |
 | size | determine the size of the input box, the height of `large` and `small`, are 40px and 24px respectively, while default size is 32px | string | - |
 | style | to customize the style of the input box | object | {} |
 | onOpenChange | a callback function, can be executed whether the popup calendar is popped up or closed | function(status) | - |
@@ -90,7 +91,7 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicke
 | Property | Description | Type | Default |
 | -------- | ----------- | ---- | ------- |
 | defaultValue | to set default date | [moment](http://momentjs.com/) | - |
-| format | to set the date format, refer to [moment.js](http://momentjs.com/) | string | "YYYY-Wo" |
+| format | to set the date format, refer to [moment.js](http://momentjs.com/) | string | "YYYY-wo" |
 | value | to set date | [moment](http://momentjs.com/) | - |
 | onChange | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | - |

@@ -101,7 +102,7 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicke
 | defaultValue | to set default date | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)] | - |
 | disabledTime | to specify the time that cannot be selected | function(dates: [moment, moment], partial: `'start'|'end'`) | - |
 | format | to set the date format | string | "YYYY-MM-DD HH:mm:ss" |
-| ranges | preseted ranges for quick selection | { [range: string]&#x3A; [moment](http://momentjs.com/)\[] } | - |
+| ranges | preseted ranges for quick selection | { \[range: string\]&#x3A; [moment](http://momentjs.com/)\[] } \| () => { \[range: string\]&#x3A; [moment](http://momentjs.com/)\[] } | - |
 | renderExtraFooter | render extra footer in panel | () => React.ReactNode | - |
 | showTime | to provide an additional time selection | object\|boolean | [TimePicker Options](/components/time-picker/#API) |
 | showTime.defaultValue | to set default time of selected date, [demo](https://ant.design/components/date-picker/#components-date-picker-demo-disabled-date) | [moment](http://momentjs.com/)\[] | [moment(), moment()] |
--- a/components/date-picker/index.tsx
+++ b/components/date-picker/index.tsx
@@ -1,98 +1,20 @@
 import * as React from 'react';
-import * as moment from 'moment';
 import RcCalendar from 'rc-calendar';
 import MonthCalendar from 'rc-calendar/lib/MonthCalendar';
 import createPicker from './createPicker';
 import wrapPicker from './wrapPicker';
 import RangePicker from './RangePicker';
 import WeekPicker from './WeekPicker';
-import { TimePickerProps } from '../time-picker';
+import { DatePickerProps, DatePickerDecorator } from './interface';

-export interface PickerProps {
-  prefixCls?: string;
-  inputPrefixCls?: string;
-  format?: string;
-  disabled?: boolean;
-  allowClear?: boolean;
-  className?: string;
-  style?: React.CSSProperties;
-  popupStyle?: React.CSSProperties;
-  locale?: any;
-  size?: 'large' | 'small' | 'default';
-  getCalendarContainer?: (triggerNode: Element) => HTMLElement;
-  open?: boolean;
-  onOpenChange?: (status: boolean) => void;
-  disabledDate?: (current: moment.Moment) => boolean;
-  renderExtraFooter?: () => React.ReactNode;
-  dateRender?: (current: moment.Moment, today: moment.Moment) => React.ReactNode;
-}
-
-export interface SinglePickerProps {
-  value?: moment.Moment;
-  defaultValue?: moment.Moment;
-  defaultPickerValue?: moment.Moment;
-  onChange?: (date: moment.Moment, dateString: string) => void;
-}
-
-export interface DatePickerProps extends PickerProps, SinglePickerProps {
-  className?: string;
-  showTime?: TimePickerProps | boolean;
-  showToday?: boolean;
-  open?: boolean;
-  disabledTime?: (current: moment.Moment) => {
-    disabledHours?: () => number[],
-    disabledMinutes?: () => number[],
-    disabledSeconds?: () => number[],
-  };
-  onOpenChange?: (status: boolean) => void;
-  onOk?: (selectedTime: moment.Moment) => void;
-  placeholder?: string;
-}
 const DatePicker = wrapPicker(createPicker(RcCalendar)) as React.ClassicComponentClass<DatePickerProps>;

-export interface MonthPickerProps extends PickerProps, SinglePickerProps {
-  className?: string;
-  placeholder?: string;
-}
 const MonthPicker = wrapPicker(createPicker(MonthCalendar), 'YYYY-MM');

-export interface RangePickerProps extends PickerProps {
-  className?: string;
-  value?: [moment.Moment, moment.Moment];
-  defaultValue?: [moment.Moment, moment.Moment];
-  defaultPickerValue?: [moment.Moment, moment.Moment];
-  onChange?: (dates: [moment.Moment, moment.Moment], dateStrings: [string, string]) => void;
-  onCalendarChange?: (dates: [moment.Moment, moment.Moment], dateStrings: [string, string]) => void;
-  onOk?: (selectedTime: moment.Moment) => void;
-  showTime?: TimePickerProps | boolean;
-  ranges?: {
-    [range: string]: moment.Moment[],
-  };
-  placeholder?: [string, string];
-  mode?: string | string[];
-  disabledTime?: (current: moment.Moment, type: string) => {
-    disabledHours?: () => number[],
-    disabledMinutes?: () => number[],
-    disabledSeconds?: () => number[],
-  };
-  onPanelChange?: (value?: moment.Moment[], mode?: string | string[]) => void;
-}
-
-export interface WeexPickerProps extends PickerProps, SinglePickerProps {
-  className?: string;
-  placeholder?: string;
-}
-
 Object.assign(DatePicker, {
  RangePicker: wrapPicker(RangePicker),
  MonthPicker,
-  WeekPicker: wrapPicker(WeekPicker, 'YYYY-Wo'),
+  WeekPicker: wrapPicker(WeekPicker, 'gggg-wo'),
 });

-export interface DatePickerDecorator extends React.ClassicComponentClass<DatePickerProps> {
-  RangePicker: React.ClassicComponentClass<RangePickerProps>;
-  MonthPicker: React.ClassicComponentClass<MonthPickerProps>;
-  WeekPicker: React.ClassicComponentClass<WeexPickerProps>;
-}
-
 export default DatePicker as DatePickerDecorator;
--- a/components/date-picker/index.zh-CN.md
+++ b/components/date-picker/index.zh-CN.md
@@ -47,7 +47,8 @@ subtitle: 日期选择框
 | locale | 国际化配置 | object | [默认配置](https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json) |
 | open | 控制弹层是否展开 | boolean | - |
 | placeholder | 输入框提示文字 | string\|RangePicker\[] | - |
-| popupStyle | 格外的弹出日历样式 | object | {} |
+| popupStyle | 额外的弹出日历样式 | object | {} |
+| dropdownClassName | 额外的弹出日历 className | string | - |
 | size | 输入框大小，`large` 高度为 40px，`small` 为 24px，默认是 32px | string | 无 |
 | style | 自定义输入框样式 | object | {} |
 | onOpenChange | 弹出日历和关闭日历的回调 | function(status) | 无 |
@@ -90,7 +91,7 @@ subtitle: 日期选择框
 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
 | defaultValue | 默认日期 | [moment](http://momentjs.com/) | - |
-| format | 展示的日期格式，配置参考 [moment.js](http://momentjs.com/) | string | "YYYY-Wo" |
+| format | 展示的日期格式，配置参考 [moment.js](http://momentjs.com/) | string | "YYYY-wo" |
 | value | 日期 | [moment](http://momentjs.com/) | - |
 | onChange | 时间发生变化的回调，发生在用户选择时间时 | function(date: moment, dateString: string) | - |

@@ -101,7 +102,7 @@ subtitle: 日期选择框
 | defaultValue | 默认日期 | [moment](http://momentjs.com/)\[] | 无 |
 | disabledTime | 不可选择的时间 | function(dates: [moment, moment], partial: `'start'|'end'`) | 无 |
 | format | 展示的日期格式 | string | "YYYY-MM-DD HH:mm:ss" |
-| ranges       | 预设时间范围快捷选择 | { [range: string]&#x3A; [moment](http://momentjs.com/)\[] } | 无 |
+| ranges       | 预设时间范围快捷选择 | { \[range: string\]&#x3A; [moment](http://momentjs.com/)\[] } \| () => { \[range: string\]&#x3A; [moment](http://momentjs.com/)\[] } | 无 |
 | renderExtraFooter | 在面板中添加额外的页脚 | () => React.ReactNode | - |
 | showTime | 增加时间选择功能 | Object\|boolean | [TimePicker Options](/components/time-picker/#API) |
 | showTime.defaultValue | 设置用户选择日期时默认的时分秒，[例子](https://ant.design/components/date-picker/#components-date-picker-demo-disabled-date) | [moment](http://momentjs.com/)\[] | [moment(), moment()] |
--- a/components/date-picker/interface.tsx
+++ b/components/date-picker/interface.tsx
@@ -0,0 +1,91 @@
+import * as React from 'react';
+import * as moment from 'moment';
+import { TimePickerProps } from '../time-picker';
+
+export interface PickerProps {
+  id?: number | string;
+  prefixCls?: string;
+  inputPrefixCls?: string;
+  format?: string;
+  disabled?: boolean;
+  allowClear?: boolean;
+  className?: string;
+  style?: React.CSSProperties;
+  popupStyle?: React.CSSProperties;
+  dropdownClassName?: string;
+  locale?: any;
+  size?: 'large' | 'small' | 'default';
+  getCalendarContainer?: (triggerNode: Element) => HTMLElement;
+  open?: boolean;
+  onOpenChange?: (status: boolean) => void;
+  disabledDate?: (current: moment.Moment) => boolean;
+  renderExtraFooter?: () => React.ReactNode;
+  dateRender?: (current: moment.Moment, today: moment.Moment) => React.ReactNode;
+}
+
+export interface SinglePickerProps {
+  value?: moment.Moment;
+  defaultValue?: moment.Moment;
+  defaultPickerValue?: moment.Moment;
+  onChange?: (date: moment.Moment, dateString: string) => void;
+}
+
+export interface DatePickerProps extends PickerProps, SinglePickerProps {
+  className?: string;
+  showTime?: TimePickerProps | boolean;
+  showToday?: boolean;
+  open?: boolean;
+  disabledTime?: (current: moment.Moment) => {
+    disabledHours?: () => number[],
+    disabledMinutes?: () => number[],
+    disabledSeconds?: () => number[],
+  };
+  onOpenChange?: (status: boolean) => void;
+  onOk?: (selectedTime: moment.Moment) => void;
+  placeholder?: string;
+}
+
+export interface MonthPickerProps extends PickerProps, SinglePickerProps {
+  className?: string;
+  placeholder?: string;
+}
+
+export type RangePickerValue =
+  undefined[] |
+  [moment.Moment] |
+  [undefined, moment.Moment] |
+  [moment.Moment, moment.Moment];
+export type RangePickerPresetRange = RangePickerValue | (() => RangePickerValue);
+
+export interface RangePickerProps extends PickerProps {
+  className?: string;
+  value?: RangePickerValue;
+  defaultValue?: RangePickerValue;
+  defaultPickerValue?: RangePickerValue;
+  onChange?: (dates: RangePickerValue, dateStrings: [string, string]) => void;
+  onCalendarChange?: (dates: RangePickerValue, dateStrings: [string, string]) => void;
+  onOk?: (selectedTime: moment.Moment) => void;
+  showTime?: TimePickerProps | boolean;
+  ranges?: {
+    [range: string]: RangePickerPresetRange,
+  };
+  placeholder?: [string, string];
+  mode?: string | string[];
+  disabledTime?: (current: moment.Moment, type: string) => {
+    disabledHours?: () => number[],
+    disabledMinutes?: () => number[],
+    disabledSeconds?: () => number[],
+  };
+  onPanelChange?: (value?: RangePickerValue, mode?: string | string[]) => void;
+}
+
+export interface WeekPickerProps extends PickerProps, SinglePickerProps {
+  className?: string;
+  placeholder?: string;
+}
+
+export interface DatePickerDecorator extends React.ClassicComponentClass<DatePickerProps> {
+  RangePicker: React.ClassicComponentClass<RangePickerProps>;
+  MonthPicker: React.ClassicComponentClass<MonthPickerProps>;
+  WeekPicker: React.ClassicComponentClass<WeekPickerProps>;
+}
--- a/components/date-picker/locale/ku_IQ.tsx
+++ b/components/date-picker/locale/ku_IQ.tsx
@@ -0,0 +1,18 @@
+import CalendarLocale from 'rc-calendar/lib/locale/ku_IQ';
+import TimePickerLocale from '../../time-picker/locale/ku_IQ';
+
+// Merge into a locale object
+const locale = {
+  lang: {
+    placeholder: 'Dîrok hilbijêre',
+    rangePlaceholder: ['Dîroka destpêkê', 'Dîroka dawîn'],
+    ...CalendarLocale,
+  },
+  timePickerLocale: {
+    ...TimePickerLocale,
+  },
+};
+
+// All settings at:
+// https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json
+export default locale;
--- a/components/date-picker/locale/sl_SI.tsx
+++ b/components/date-picker/locale/sl_SI.tsx
@@ -0,0 +1,43 @@
+import TimePickerLocale from '../../time-picker/locale/sl_SI';
+
+// Merge into a locale object
+const locale = {
+  lang: {
+    placeholder: 'Izberite datum',
+    rangePlaceholder: ['Začetni datum', 'Končni datum'],
+    today: 'Danes',
+    now: 'Trenutno',
+    backToToday: 'Nazaj na trenutni datum',
+    ok: 'Ok',
+    clear: 'Počisti',
+    month: 'Mesec',
+    year: 'Leto',
+    timeSelect: 'Izberi čas',
+    dateSelect: 'Izberi datum',
+    monthSelect: 'Izberite mesec',
+    yearSelect: 'Izberite leto',
+    decadeSelect: 'Izberite desetletje',
+    yearFormat: 'YYYY',
+    dateFormat: 'D.M.YYYY',
+    dayFormat: 'D',
+    dateTimeFormat: 'D.M.YYYY HH:mm:ss',
+    monthFormat: 'MMMM',
+    monthBeforeYear: true,
+    previousMonth: 'Prejšnji mesec (PageUp)',
+    nextMonth: 'Naslednji mesec (PageDown)',
+    previousYear: 'Lansko leto (Control + left)',
+    nextYear: 'Naslednje leto (Control + right)',
+    previousDecade: 'Prejšnje desetletje',
+    nextDecade: 'Naslednje desetletje',
+    previousCentury: 'Zadnje stoletje',
+    nextCentury: 'Naslednje stoletje',
+  },
+  timePickerLocale: {
+    ...TimePickerLocale,
+  },
+};
+
+// All settings at:
+// https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json
+
+export default locale;
--- a/components/date-picker/locale/tr_TR.tsx
+++ b/components/date-picker/locale/tr_TR.tsx
@@ -1,4 +1,4 @@
-import CalendarLocale from 'rc-calendar/lib/locale/en_US';
+import CalendarLocale from 'rc-calendar/lib/locale/tr_TR';
 import TimePickerLocale from '../../time-picker/locale/tr_TR';

 // Merge into a locale object
--- a/components/date-picker/style/TimePicker.less
+++ b/components/date-picker/style/TimePicker.less
@@ -126,7 +126,6 @@
  .@{calendar-prefix-cls}-footer {
    position: relative;
    height: auto;
-    line-height: auto;

    &-btn {
      text-align: right;
--- a/components/divider/tests/snapshots/demo.test.js.snap
+++ b/components/divider/tests/snapshots/demo.test.js.snap
@@ -32,6 +32,35 @@ exports[`renders ./components/divider/demo/horizontal.md correctly 1`] = `
 </div>
 `;

+exports[`renders ./components/divider/demo/orientation.md correctly 1`] = `
+<div>
+  <div
+    class="ant-divider ant-divider-horizontal ant-divider-with-text-left"
+  >
+    <span
+      class="ant-divider-inner-text"
+    >
+      Left Text
+    </span>
+  </div>
+  <p>
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista probare, quae sunt a te dicta? Refert tamen, quo modo.
+  </p>
+  <div
+    class="ant-divider ant-divider-horizontal ant-divider-with-text-right"
+  >
+    <span
+      class="ant-divider-inner-text"
+    >
+      Right Text
+    </span>
+  </div>
+  <p>
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista probare, quae sunt a te dicta? Refert tamen, quo modo.
+  </p>
+</div>
+`;
+
 exports[`renders ./components/divider/demo/vertical.md correctly 1`] = `
 <div>
  Text
--- a/components/divider/demo/orientation.md
+++ b/components/divider/demo/orientation.md
@@ -0,0 +1,27 @@
+---
+order: 2
+title:
+  zh-CN: 标题位置
+  en-US: Orientation of title
+---
+
+## zh-CN
+
+修改分割线标题的位置。
+
+## en-US
+
+Set orientation of divider to left or right.
+
+````jsx
+import { Divider } from 'antd';
+
+ReactDOM.render(
+  <div>
+    <Divider orientation="left">Left Text</Divider>
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista probare, quae sunt a te dicta? Refert tamen, quo modo.</p>
+    <Divider orientation="right">Right Text</Divider>
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista probare, quae sunt a te dicta? Refert tamen, quo modo.</p>
+  </div>
+, mountNode);
+````
--- a/components/divider/index.en-US.md
+++ b/components/divider/index.en-US.md
@@ -18,5 +18,6 @@ A divider line separates different content.

 | Property | Description | Type | Default |
 | -------- | ----------- | ---- | ------- |
-| dashed | whether line is dasded | Boolean | false |
+| dashed | whether line is dashed | Boolean | false |
 | type | direction type of divider | enum: `horizontal` `vertical` | `horizontal` |
+| orientation | position of title inside divider | enum: `left` `right` `center` | `center` |
--- a/components/divider/index.tsx
+++ b/components/divider/index.tsx
@@ -4,6 +4,7 @@ import classNames from 'classnames';
 export interface DividerProps {
  prefixCls?: string;
  type?: 'horizontal' | 'vertical';
+  orientation?: 'left' | 'right';
  className?: string;
  children?: React.ReactNode;
  dashed?: boolean;
@@ -13,14 +14,16 @@ export interface DividerProps {
 export default function Divider({
  prefixCls = 'ant',
  type = 'horizontal',
+  orientation = '',
  className,
  children,
  dashed,
  ...restProps,
 }: DividerProps) {
+  const orientationPrefix = (orientation.length > 0) ? '-' + orientation : orientation;
  const classString = classNames(
    className, `${prefixCls}-divider`, `${prefixCls}-divider-${type}`, {
-    [`${prefixCls}-divider-with-text`]: children,
+    [`${prefixCls}-divider-with-text${orientationPrefix}`]: children,
    [`${prefixCls}-divider-dashed`]: !!dashed,
  });
  return (
--- a/components/divider/index.zh-CN.md
+++ b/components/divider/index.zh-CN.md
@@ -18,3 +18,4 @@ subtitle: 分割线
 | --- | --- | --- | --- |
 | dashed | 是否虚线 | Boolean | false |
 | type | 水平还是垂直类型 | enum: `horizontal` `vertical` | `horizontal` |
+| orientation | 分割线标题的位置 | enum: `left` `right` | `center` |
--- a/components/divider/style/index.less
+++ b/components/divider/style/index.less
@@ -22,6 +22,7 @@
    height: 1px;
    width: 100%;
    margin: 24px 0;
+    clear: both;
  }
  &-horizontal&-with-text {
    display: table;
@@ -44,17 +45,81 @@
      transform: translateY(50%);
    }
  }
-
  &-inner-text {
    display: inline-block;
    padding: 0 24px;
  }
+  &-horizontal&-with-text-left {
+    display: table;
+    white-space: nowrap;
+    text-align: center;
+    background: transparent;
+    font-weight: 500;
+    color: @heading-color;
+    font-size: @font-size-base;
+    margin: 16px 0;

+    &:before {
+      content: '';
+      display: table-cell;
+      position: relative;
+      top: 50%;
+      width: 5%;
+      border-top: 1px solid @border-color-split;
+      transform: translateY(50%);
+    }
+    &:after {
+      content: '';
+      display: table-cell;
+      position: relative;
+      top: 50%;
+      width: 95%;
+      border-top: 1px solid @border-color-split;
+      transform: translateY(50%);
+    }
+    &-inner-text {
+      display: inline-block;
+      padding: 0 10px;
+    }
+  }
+
+  &-horizontal&-with-text-right {
+    display: table;
+    white-space: nowrap;
+    text-align: center;
+    background: transparent;
+    font-weight: 500;
+    color: @heading-color;
+    font-size: @font-size-base;
+    margin: 16px 0;
+
+    &:before {
+      content: '';
+      display: table-cell;
+      position: relative;
+      top: 50%;
+      width: 95%;
+      border-top: 1px solid @border-color-split;
+      transform: translateY(50%);
+    }
+    &:after {
+      content: '';
+      display: table-cell;
+      position: relative;
+      top: 50%;
+      width: 5%;
+      border-top: 1px solid @border-color-split;
+      transform: translateY(50%);
+    }
+    &-inner-text {
+      display: inline-block;
+      padding: 0 10px;
+    }
+  }
  &-dashed {
    background: none;
    border-top: 1px dashed @border-color-split;
  }
-
  &-horizontal&-with-text&-dashed {
    border-top: 0;
    &:before,
--- a/components/dropdown/tests/snapshots/demo.test.js.snap
+++ b/components/dropdown/tests/snapshots/demo.test.js.snap
@@ -58,6 +58,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
    </button>
    <button
      class="ant-btn ant-dropdown-trigger ant-btn-default"
+      disabled=""
      type="button"
    >
      <i
--- a/Show More
+++ b/Show More