Merge pull request #563 from ant-design/develop-0.10.0

0.10.0 Release

.eslintrc

@@ -2,12 +2,15 @@
   "extends": ["eslint-config-airbnb"],
   "env": {
     "browser": true,
-    "node": true
+    "node": true,
+    "mocha": true,
+    "jest": true,
+    "es6": true
   },
   "ecmaFeatures": {
-    "jsx": true
+    "jsx": true,
+    "experimentalObjectRestSpread": true
   },
-  "parser": "babel-eslint",
   "plugins": [
     "react",
     "babel"
@@ -38,6 +41,7 @@
     "space-before-blocks": 0,
     "space-before-function-paren": 0,
     "spaced-comment": 0,
-    "vars-on-top": 0
+    "vars-on-top": 0,
+    "id-length": 0
   }
 }

.travis.yml

@@ -1,4 +1,4 @@
 language: node_js
 
 node_js:
-  - "iojs"
+  - "4"

CHANGELOG.md

@@ -4,17 +4,88 @@
 
 ---
 
-## 0.9.4 `2015-11-04`
+## 0.10.0 `2015-11-20`
+
+- 全面兼容 `react@0.14.x`。
+- 新增 [时间选择 Timepicker](http://ant.design/components/timepicker/)、[日历 Calendar](http://ant.design/components/calendar/)、[加载中 Spin](http://ant.design/components/spin/) 组件。
+- [Button](http://ant.design/components/button/)、[Iconfont](http://ant.design/components/icon/)、[Layout](http://ant.design/components/layout/)、[Form](http://ant.design/components/form/) [Input](http://ant.design/components/form/#demo-input) 等样式模块改造为 React 组件。
+- 新增 [Queue-anim](http://ant.design/components/queue-anim/) 组件，更换了原来的 enter-animation。
+- 全新的[字体图标](/components/icon)。
+	- 全面更新视觉风格，补充更多图标。[#313](https://github.com/ant-design/ant-design/issues/313)
+	- 调整字体基线，告别对图标位置的特殊调节。(感谢 [iconfont.cn](http://iconfont.cn) 的鼎力支持)
+- Datepicker、Dropdown、Select、Popover、Popconfirm 等浮层组件添加在空间不足的情况下自动调整位置功能。
+- Popover、Tooltip、Popconfirm 组件支持 12 个方向。[#312](https://github.com/ant-design/ant-design/issues/312)
+- 优先使用苹方字体。
+- 统一 size 属性的可选值为 `small` `default` `large`。
+- 开始初步补充[测试用例](https://github.com/ant-design/ant-design/tree/1a3a19793c0791201666fdcf0dbd12a30fad4be0/tests)。
+- 提供主色系更换的方案。[#384](https://github.com/ant-design/ant-design/issues/384)
+- 添加[色彩换算工具](http://ant.design/spec/colors#色彩换算工具)。
+- 添加布局和导航规范，以及[常用布局](http://ant.design/spec/layout/)。
+- 文档支持标题和演示的锚点，方便分享文档和演示代码。
+- 提供多版本的文档，在[主站](http://ant.design)的右下角提供切换按钮。
+- [antd-bin](https://github.com/ant-tool/xtool) 升级到 `0.10`。
+	- 拆分出 [antd-init](https://github.com/ant-design/antd-init) 和 [antd-build](https://github.com/ant-design/antd-build)。
+	- 提供代理功能。
+	- 提供 UI 测试功能。
+
+#### 组件变更
+
+- Table
+	- 支持单选。[演示](/components/table/#demo-row-selection-radio-props)
+	- 选择模式支持默认选中和不可用效果。[演示](/components/table/#demo-row-selection-props)
+	- 列支持了 `colSpan` 和 `rowSpan` 配置。[演示](/components/table/#demo-colspan-rowspan)
+	- 新增 `loading` 属性。
+	- 筛选增加 `filterMultiple` 属性，支持单选的配置。
+- Datepicker
+	- 添加国际化支持。
+	- 添加手动输入和清除功能。
+	- 优化了视觉样式。
+	- 修复不标准的日期格式导致显示错误的问题。
+	- 用 `onChange` 属性代替 `onSelect` 属性。
+- Validation 修复了 对 Datepicker、Input-number、Select 的支持，并添加了相关演示。
+- Carousel 的依赖 react-slick 升级到 0.9.x，相关 API 也相应更新。
+- Tree 组件支持完全受控模式。[#397](https://github.com/ant-design/ant-design/issues/397)
+- Input Number
+	- 组件输入体验优化，现在可以键入任意字符，失焦时格式化为合法值。
+	- 修复不支持小数 step 的问题。[#530](https://github.com/ant-design/ant-design/issues/530)
+- Tabs 新增[垂直页签功能](http://ant.design/components/tabs/#demo-vertical-left)。
+- Upload 组件视觉优化，新增高级浏览器下的上传进度展示。[#311](https://github.com/ant-design/ant-design/issues/311)
+- Menu
+	- 视觉效果大幅优化。
+	- 新增 [dark 主题](http://ant.design/components/menu/#demo-theme) 的样式。
+	- 修复一个链接点击区域的问题。[#535](https://github.com/ant-design/ant-design/issues/535)
+- Dropdown 用 onClick 代替 onSelect 作为推荐的使用方式，因为原有的 onSelect 只在变化时触发。
+- Slider
+	- 新增[双滑块功能](http://ant.design/components/slider/#demo-range)。
+	- 优化 marks 属性的使用逻辑，使其可以和具体数值进行绑定。[slider#26](https://github.com//react-component/slider/issues/26)
+	- 属性命名优化，用 `dots` 代替了 `withDots` 属性，用 `included` 代替了 `isIncluded`。
+- Badge 当 `count` 为 0 时不展示。
+- Progress 新增 `format` 属性，能够自定义展示的进度文案。
+- Modal 新增 `confirmLoading` 属性。
+- 新增 Radio.Button 的失效样式。
+- 提供 IE8 下的圆角按钮[兼容方案](http://ant.design/components/button/#ie8-border-radius-support)。
+- `antd.Notification()` 修正为 `antd.notification()`。
+- 另有巨量样式的修复和优化。
+
+> 备注：
+>
+> - [计划和推进 issue](https://github.com/ant-design/ant-design/issues/276)
+> - [0.10 升级指南](/docs/upgrade-to-0.10)
+
+
+## 0.9.3 ~ 0.9.5 `2015-11-04`
 
 * 增加对 React 版本的检测提示机制，0.9.x 序列只能使用 `react@~0.13.3`。
 
+
 ## 0.9.2 `2015-10-26`
 
-* Tooltip 的 title 为空时不展示浮层。[9b53117](9b5311791e73270c7c16a602ac74dd59719a5f76)
-* 修复 Upload 文件列表链接的 target 属性。[340a170](340a1702b6a7b065ac02d417c891e1886dfe470d)
-* 修复 Datepicker 设置 defaultValue 时星期顺序错误的问题。[9ef1450](9ef14500f3abfcc7081f8dceab8187ec835e3918)
+* Tooltip 的 title 为空时不展示浮层。[9b53117](https://github.com/ant-design/ant-design/commit/9b5311791e73270c7c16a602ac74dd59719a5f76)
+* 修复 Upload 文件列表链接的 target 属性。[340a170](https://github.com/ant-design/ant-design/commit/340a1702b6a7b065ac02d417c891e1886dfe470d)
+* 修复 Datepicker 设置 defaultValue 时星期顺序错误的问题。[9ef1450](https://github.com/ant-design/ant-design/commit/9ef14500f3abfcc7081f8dceab8187ec835e3918)
 * 修复一些小的样式问题。
 
+
 ## 0.9.1 `2015-09-26`
 
 * 添加 Pagination pageSize 发生变化的回调。[#317](https://github.com/ant-design/ant-design/issues/317)

README-zh_CN.md

@@ -0,0 +1,62 @@
+# Ant Design [![](https://img.shields.io/travis/ant-design/ant-design.svg?style=flat-square)](https://travis-ci.org/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) [![Join the chat at https://gitter.im/ant-design/ant-design](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
+
+一套企业级的 UI 设计语言和 React 实现。
+
+<p align="center">
+  <a href="http://ant.design">
+    <img width="360" src="https://t.alipayobjects.com/images/rmsweb/T1B9hfXcdvXXXXXXXX.svg">
+  </a>
+</p>
+
+## 特性
+
+- 提炼自企业级后台产品的交互语言和视觉风格。
+- [React Component](http://react-component.github.io/badgeboard/) 基础上二次封装的丰富实用的 UI 组件。
+- 基于 React 的组件化开发模式。
+- 背靠 npm 生态圈。
+- 基于 webpack 的调试构建方案，支持 ES6。
+
+
+## 安装
+
+```bash
+npm install antd
+```
+
+## 示例
+
+- 使用全部组件
+
+  ```jsx
+  import { Datepicker } from 'antd';
+  ReactDOM.render(<Datepicker />, mountNode);
+  ```
+
+- 按需使用
+
+  ```jsx
+  import 'antd/lib/index.css'; // 只需在页面入口模块引用一次
+  import Datepicker from 'antd/lib/datepicker';
+  ReactDOM.render(<Datepicker />, mountNode);
+  ```
+
+## 浏览器支持
+
+现代浏览器和 IE8 及以上。
+
+## 链接
+
+- [首页](http://ant.design/)
+- [文档和组件](http://ant.design/docs/introduce)
+- [构建调试工具](https://github.com/ant-design/antd-bin)
+- [开发计划](https://github.com/ant-design/ant-design/issues/9)
+- [修改记录](CHANGELOG.md)
+- [React 模块](http://react-component.github.io/)
+- [React 代码规范](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-code-style.md)
+- [组件设计原则](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-design.md)
+- [网站和组件开发说明](https://github.com/ant-design/ant-design/wiki/%E7%BD%91%E7%AB%99%E5%92%8C%E7%BB%84%E4%BB%B6%E5%BC%80%E5%8F%91%E8%AF%B4%E6%98%8E)
+- [版本发布手册](https://github.com/ant-design/ant-design/wiki/%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
+
+## 如何贡献
+
+我们欢迎任何形式的贡献，有任何建议或意见您可以进行 [Pull Request](https://github.com/ant-design/ant-design/pulls)，或者给我们 [提问](https://github.com/ant-design/ant-design/issues)。

README.md

@@ -1,43 +1,60 @@
-# Ant Design [![](https://img.shields.io/travis/ant-design/ant-design.svg?style=flat-square)](https://travis-ci.org/ant-design/ant-design) [![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd) [![Join the chat at https://gitter.im/ant-design/ant-design](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
+# Ant Design [![](https://img.shields.io/travis/ant-design/ant-design.svg?style=flat-square)](https://travis-ci.org/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) [![Join the chat at https://gitter.im/ant-design/ant-design](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
 
-一套企业级的 UI 设计语言和 React 实现。
+An enterprise-class UI design language and React-based implementation.
 
-<p align="center">
-  <a href="http://ant.design">
-    <img width="360" src="https://t.alipayobjects.com/images/rmsweb/T1B9hfXcdvXXXXXXXX.svg">
-  </a>
-</p>
+![](https://t.alipayobjects.com/images/rmsweb/T11aVgXc4eXXXXXXXX.svg)
 
-## 特性
+## Features
 
-- 提炼自企业级后台产品的交互语言和视觉风格。
-- [React Component](http://react-component.github.io/badgeboard/) 基础上二次封装的丰富实用的 UI 组件。
-- 基于 React 的组件化开发模式。
-- 背靠 npm 生态圈。
-- 基于 webpack 的调试构建方案，支持 ES6。
+- An enterprise-class graphical design language and framework for financial applications
+- Rich library of UI components base on [React Component](http://react-component.github.io/badgeboard/).
+- A Component development model based on React.
+- Backed by the npm ecosystem.
+- webpack-based debug builds supporting ES6
 
+## Install
 
-## 示例
-
-```jsx
-import { Datepicker } from 'antd';
-React.render(<Datepicker />, mountNode);
+```bash
+npm install antd
 ```
 
-## 链接
+## Usage example
+
+- Use all components
+
+  ```jsx
+  import { Datepicker } from 'antd';
+  ReactDOM.render(<Datepicker />, mountNode);
+  ```
+
+- Use on demand
+
+  ```jsx
+  import 'antd/lib/index.css'; // only need to import once in entry module
+  import Datepicker from 'antd/lib/datepicker';
+  ReactDOM.render(<Datepicker />, mountNode);
+  ```
+
+## Browser Support
+
+Normal browsers and Internet Explorer 8+.
+
+
+## Links
+
+- [Home page](http://ant.design/)
+- [Documentation and Components](http://ant.design/docs/introduce)
+- [Components](http://ant.design/components/)
+- [Build/Debug tools](https://github.com/ant-design/antd-bin)
+- [Roadmap](https://github.com/ant-design/ant-design/issues/9)
+- [ChangeLog](CHANGELOG.md)
+- [React modules](http://react-component.github.io/)
+- [React style guide](https://github.com/react-component/react-component.github.io/blob/master/docs/en-US/component-code-style.md)
+- [React component design guide](https://github.com/react-component/react-component.github.io/blob/master/docs/en-US/component-design.md)
+- [Developer Instruction](https://github.com/ant-design/ant-design/wiki/%E7%BD%91%E7%AB%99%E5%92%8C%E7%BB%84%E4%BB%B6%E5%BC%80%E5%8F%91%E8%AF%B4%E6%98%8E)
+- [Versioning Release Note](https://github.com/ant-design/ant-design/wiki/%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
 
-- [首页](http://ant.design/)
-- [文档](http://ant.design/docs/introduce)
-- [组件](http://ant.design/components/)
-- [构建调试 antd-bin](https://github.com/ant-design/antd-bin)
-- [开发计划](https://github.com/ant-design/ant-design/issues/9)
-- [修改记录](CHANGELOG.md)
-- [React 模块](http://react-component.github.io/)
-- [React 代码规范](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-code-style.md)
-- [组件设计原则](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-design.md)
-- [网站和组件开发说明](https://github.com/ant-design/ant-design/wiki/%E7%BD%91%E7%AB%99%E5%92%8C%E7%BB%84%E4%BB%B6%E5%BC%80%E5%8F%91%E8%AF%B4%E6%98%8E)
-- [版本发布手册](https://github.com/ant-design/ant-design/wiki/%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
 
-## 如何贡献
+## Contributing
 
-我们欢迎任何形式的贡献，有任何建议或意见您可以进行 [Pull Request](https://github.com/ant-design/ant-design/pulls)，或者给我们 [提问](https://github.com/ant-design/ant-design/issues)。
+We welcome all contributions, please submit any ideas as [pull requests](https://github.com/ant-design/ant-design/pulls) or as a [GitHub issue](https://github.com/ant-design/ant-design/issues).

components/affix/demo/basic.md

@@ -7,11 +7,11 @@
 ---
 
 ````jsx
-var Affix = antd.Affix;
+import { Affix, Button } from 'antd';
 
-React.render(
+ReactDOM.render(
   <Affix>
-    <button className="ant-btn ant-btn-primary">固定在顶部</button>
+    <Button type="primary">固定在顶部</Button>
   </Affix>
 , document.getElementById('components-affix-demo-basic'));
 ````

components/affix/demo/offset.md

@@ -7,11 +7,11 @@
 ---
 
 ````jsx
-var Affix = antd.Affix;
+import { Affix, Button } from 'antd';
 
-React.render(
+ReactDOM.render(
   <Affix offset={75}>
-    <button className="ant-btn ant-btn-primary">固定在距离顶部 75px 的位置</button>
+    <Button type="primary">固定在距离顶部 75px 的位置</Button>
   </Affix>
 , document.getElementById('components-affix-demo-offset'));
 ````

components/affix/index.jsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import rcUtil from 'rc-util';
 
 function getScroll(w, top) {
@@ -52,15 +53,15 @@ let Affix = React.createClass({
   handleScroll() {
     let affix = this.state.affix;
     let scrollTop = getScroll(window, true);
-    let elemOffset = getOffset(this.getDOMNode());
+    let elemOffset = getOffset(ReactDOM.findDOMNode(this));
 
     if (!affix && (elemOffset.top - this.props.offset) < scrollTop) {
       this.setState({
         affix: true,
         affixStyle: {
           top: this.props.offset,
           left: elemOffset.left,
-          width: this.getDOMNode().offsetWidth
+          width: ReactDOM.findDOMNode(this).offsetWidth
         }
       });
     }

components/alert/demo/basic.md

@@ -7,8 +7,8 @@
 ---
 
 ````jsx
-var Alert = antd.Alert;
+import { Alert } from 'antd';
 
-React.render(<Alert message="成功提示的文案" type="success" />
+ReactDOM.render(<Alert message="成功提示的文案" type="success" />
 , document.getElementById('components-alert-demo-basic'));
 ````