Merge branch master into develop-1.0.0

CHANGELOG.md

@@ -9,6 +9,16 @@ timeline: true
 
 ---
 
+## 0.12.16
+
+- 修复 Collapse 在 safari 中切换动画异常的问题。[#1494](https://github.com/ant-design/ant-design/issues/1494)
+- 修复 Table 的 selectedRowKeys 在初次渲染时失效的问题。[#1501](https://github.com/ant-design/ant-design/issues/1501)
+- Table 现在点击选择框时将不再触发 `onRowClick`。[#1470](https://github.com/ant-design/ant-design/issues/1470)
+- 修复一个 Calender 服务端渲染时提示 `Option is not defined` 的问题。[#1521](https://github.com/ant-design/ant-design/issues/1521)
+- 修复 Menu 动态切换模式时的一些细节问题。
+- 优化了 export 导出图标。
+- 修复 Form 的一些样式细节。
+
 ## 0.12.15
 
 - 升级 rc-collapse 修复一个性能问题。

components/form/FormItem.jsx

@@ -82,7 +82,7 @@ export default class FormItem extends React.Component {
 
   renderExtra() {
     const { prefixCls, extra } = this.props;
-    return <div className={prefixClsFn(prefixCls, 'extra')}>{extra}</div>;
+    return <span className={prefixClsFn(prefixCls, 'extra')}>{extra}</span>;
   }
 
   getValidateStatus() {

components/menu/demo/switch-mode.md

@@ -0,0 +1,64 @@
+---
+order: 5
+title: 切换菜单类型
+---
+
+展示动态切换模式。
+
+````jsx
+import { Menu, Icon, Switch } from 'antd';
+const SubMenu = Menu.SubMenu;
+const MenuItemGroup = Menu.ItemGroup;
+
+const Sider = React.createClass({
+  getInitialState() {
+    return {
+      mode: 'inline',
+    };
+  },
+  changeMode(value) {
+    this.setState({
+      mode: value ? 'vertical' : 'inline',
+    });
+  },
+  render() {
+    return (
+      <div>
+        <Switch onChange={this.changeMode} />
+        <br />
+        <br />
+        <Menu
+          style={{ width: 240 }}
+          defaultOpenKeys={['sub1']}
+          mode={this.state.mode}>
+          <SubMenu key="sub1" title={<span><Icon type="mail" /><span>导航一</span></span>}>
+            <MenuItemGroup title="分组1">
+              <Menu.Item key="1">选项1</Menu.Item>
+              <Menu.Item key="2">选项2</Menu.Item>
+            </MenuItemGroup>
+            <MenuItemGroup title="分组2">
+              <Menu.Item key="3">选项3</Menu.Item>
+              <Menu.Item key="4">选项4</Menu.Item>
+            </MenuItemGroup>
+          </SubMenu>
+          <SubMenu key="sub2" title={<span><Icon type="appstore" /><span>导航二</span></span>}>
+            <Menu.Item key="5">选项5</Menu.Item>
+            <Menu.Item key="6">选项6</Menu.Item>
+            <SubMenu key="sub3" title="三级导航">
+              <Menu.Item key="7">选项7</Menu.Item>
+              <Menu.Item key="8">选项8</Menu.Item>
+            </SubMenu>
+          </SubMenu>
+          <SubMenu key="sub4" title={<span><Icon type="setting" /><span>导航三</span></span>}>
+            <Menu.Item key="9">选项9</Menu.Item>
+            <Menu.Item key="10">选项10</Menu.Item>
+            <Menu.Item key="11">选项11</Menu.Item>
+            <Menu.Item key="12">选项12</Menu.Item>
+          </SubMenu>
+        </Menu>
+      </div>
+    );
+  }
+});
+ReactDOM.render(<Sider />, mountNode);
+````

components/menu/index.jsx

@@ -24,6 +24,12 @@ export default class Menu extends React.Component {
       openKeys: []
     };
   }
+  componentWillReceiveProps(nextProps) {
+    if (this.props.mode === 'inline' &&
+        nextProps.mode !== 'inline') {
+      this.switchModeFromInline = true;
+    }
+  }
   handleClick = (e) => {
     this.setState({
       openKeys: []
@@ -50,7 +56,14 @@ export default class Menu extends React.Component {
           openAnimation = 'slide-up';
           break;
         case 'vertical':
-          openAnimation = 'zoom-big';
+          // When mode switch from inline
+          // submenu should hide without animation
+          if (this.switchModeFromInline) {
+            openAnimation = '';
+            this.switchModeFromInline = false;
+          } else {
+            openAnimation = 'zoom-big';
+          }
           break;
         case 'inline':
           openAnimation = animation;

components/menu/index.md

@@ -30,7 +30,7 @@ english: Menu
 | 参数     | 说明           | 类型     | 默认值       |
 |----------|----------------|----------|--------------|
 | theme    | 主题颜色 | enum: `light` `dark` | 'light' |
-| mode    | 菜单类型 | enum: `vertical` `horizontal` `inline` | vertical |
+| mode    | 菜单类型，现在支持垂直、水平、和内嵌模式三种 | enum: `vertical` `horizontal` `inline` | vertical |
 | selectedKeys | 当前选中的菜单项 key 数组 |  |      |
 | defaultSelectedKeys | 初始选中的菜单项 key 数组 |  |      |
 | openKeys | 当前展开的菜单项 key 数组 |  |      |

style/components/menu.less

@@ -87,6 +87,13 @@
     }
   }
 
+  &-vertical &-sub {
+    border-right: 0;
+    .@{menu-prefix-cls}-item {
+      border-right: 0;
+    }
+  }
+
   &-inline {
     .@{menu-prefix-cls}-selected,
     .@{menu-prefix-cls}-item-selected {