Merge 1.x-stable

9 years ago · cc4cab5b1e
parent be95d3fc23 143176bf41
commit cc4cab5b1e
17 changed files with 125 additions and 20 deletions
--- a/README-zh_CN.md
+++ b/README-zh_CN.md
@ -61,7 +61,8 @@ import 'antd/dist/antd.css';  // or 'antd/dist/antd.less'
 - [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)
+- [版本发布手册](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
+

 ## 如何贡献

--- a/README.md
+++ b/README.md
@ -14,8 +14,8 @@ We are now working on translate components document to English, and we need some

 ## Features

- An enterprise-class design language and high quality UI style.
- Rich library of UI components base on [React Component](http://react-component.github.io/badgeboard/).
+- An enterprise-class design language and high quality UI.
+- Graceful UI components out of the box, base on [React Component](http://react-component.github.io/badgeboard/).
 - A npm + webpack + babel + dora [workflow](http://ant-tool.github.io/index.html).

 ## Install
@ -54,9 +54,9 @@ import 'antd/dist/antd.css';  // or 'antd/dist/antd.less'

   ```jsx
   // import js and css modularly, parsed by babel-plugin-antd
-   import { DatePicker } from 'antd'; 
+   import { DatePicker } from 'antd';
   ```
-  
+
 - Manually import

   ```jsx
@ -94,7 +94,7 @@ tsconfig.json
 - [React style guide](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-code-style.md)
 - [React component design guide](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-design.md)
 - [Developer Instruction](https://github.com/ant-design/ant-design/wiki/Development)
- [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)
+- [Versioning Release Note](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
 - [FAQ](https://github.com/ant-design/ant-design/wiki/FAQ)
 - [CodePen boilerplate](http://codepen.io/anon/pen/wGOWGW?editors=001) for bug reports

--- a/components/checkbox/style/mixin.less
+++ b/components/checkbox/style/mixin.less
@ -151,6 +151,11 @@
    .@{checkbox-inner-prefix-cls}-input {
      cursor: default;
    }
+
+    & + span {
+      color: #ccc;
+      cursor: @cursor-disabled;
+    }
  }

  .@{checkbox-prefix-cls}-wrapper {
@ -177,4 +182,22 @@
      display: inline-block;
    }
  }
+
+  @ie8: \0screen;
+
+  // IE8 hack for https://github.com/ant-design/ant-design/issues/2148
+  @media @ie8 {
+    .@{checkbox-prefix-cls}-checked .@{checkbox-prefix-cls}-inner:before,
+    .@{checkbox-prefix-cls}-checked .@{checkbox-prefix-cls}-inner:after {
+      font-family: 'anticon';
+      content: '\E62E';
+      font-weight: bold;
+      font-size: 8px;
+      border: 0;
+      color: #fff;
+      left: 2px;
+      top: 3px;
+      position: absolute;
+    }
+  }
 }
--- a/components/date-picker/createPicker.tsx
+++ b/components/date-picker/createPicker.tsx
@ -4,6 +4,7 @@ import RcDatePicker from 'rc-calendar/lib/Picker';
 import GregorianCalendar from 'gregorian-calendar';
 import classNames from 'classnames';
 import assign from 'object-assign';
+import Icon from '../icon';

 export default function createPicker(TheCalendar) {
  // use class typescript error
@ -23,7 +24,14 @@ export default function createPicker(TheCalendar) {
      }
    },

-    handleChange(value) {
+    clearSelection = (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      this.setState({ value: null });
+      this.handleChange(null);
+    },
+
+    handleChange = (value) => {
      const props = this.props;
      if (!('value' in props)) {
        this.setState({value});
@ -71,6 +79,11 @@ export default function createPicker(TheCalendar) {
        pickerStyle.width = 180;
      }

+      const clearIcon = (!props.disabled && this.state.value) ?
+        <Icon type="cross-circle"
+          className="ant-calendar-picker-clear"
+          onClick={this.clearSelection}
+        /> : null;
      return (
        <span className={props.pickerClass} style={assign({}, pickerStyle, props.style)}>
          <RcDatePicker
@ -98,7 +111,8 @@ export default function createPicker(TheCalendar) {
                      placeholder={placeholder}
                      className={props.pickerInputClass}
                    />
-                    <span className="ant-calendar-picker-icon"/>
+                    {clearIcon}
+                    <span className="ant-calendar-picker-icon" />
                  </span>
                  );
                }
@ -108,6 +122,6 @@ export default function createPicker(TheCalendar) {
      );
    },
  });
-  
+
  return CalenderWrapper;
 }
--- a/components/date-picker/style/Calendar.less
+++ b/components/date-picker/style/Calendar.less
@ -246,6 +246,7 @@
  }

  .@{calendar-prefix-cls}-clear-btn {
+    display: none;
    position: absolute;
    right: 5px;
    text-indent: -76px;
--- a/components/date-picker/style/Picker.less
+++ b/components/date-picker/style/Picker.less
@ -37,7 +37,29 @@
  > input {
    outline: none;
  }
+  &-clear {
+    opacity: 0;
+    position: absolute;
+    right: 8px;
+    z-index: 1;
+    background: #fff;
+    top: 50%;
+    font-size: 12px;
+    color: #ccc;
+    width: 14px;
+    height: 14px;
+    margin-top: -7px;
+    line-height: 14px;
+    cursor: pointer;
+    transition: color 0.3s ease, opacity 0.15s ease;
+    &:hover {
+      color: #999;
+    }
+  }

+  &:hover &-clear {
+    opacity: 1;
+  }
  &-icon {
    position: absolute;
    user-select: none;
--- a/components/date-picker/style/RangePicker.less
+++ b/components/date-picker/style/RangePicker.less
@ -57,11 +57,19 @@
    margin-left: -29px;
  }

+  .@{calendar-prefix-cls}-time-picker-wrap {
+    left: 115px;
+  }
+  &-right .@{calendar-prefix-cls}-time-picker-wrap {
+    left: 100px;
+  }
+
  &.@{calendar-prefix-cls}-time &-right .@{calendar-prefix-cls}-date-input-wrap {
    margin-left: -15px;
  }

  .@{calendar-prefix-cls}-input-wrap {
+    position: relative;
    height: @input-box-height;
  }
  .@{calendar-prefix-cls}-input {
--- a/components/date-picker/style/TimePicker.less
+++ b/components/date-picker/style/TimePicker.less
@ -11,14 +11,17 @@
    .@{calendar-prefix-cls}-clear-btn {
      direction: ltr;
    }
+    .@{calendar-prefix-cls}-time-picker-wrap {
+      position: absolute;
+      right: 0;
+    }
  }
  .@{calendar-prefix-cls}-input,
  .@{timepicker-prefix-cls}-input {
-    .input;
-    border-radius: @border-radius-sm;
-    height: @input-height-sm;
-    width: 96px;
-    margin-right: 6px;
+    // .input;
+  }
+  .@{timepicker-prefix-cls}-input {
+    display: none;
  }
  .@{calendar-prefix-cls}-input {
    padding-right: 21px;
@ -27,6 +30,9 @@
    min-width: 168px;
  }
  .@{timepicker-prefix-cls}-icon {
-    display: none;
+    font-family: "anticon" !important;
+    position: relative;
+    content: "\E643";
+    display: inline;
  }
 }
--- a/components/form/index.md
+++ b/components/form/index.md
@ -76,9 +76,9 @@ CustomizedForm = Form.create({})(CustomizedForm);
 | resetFields | 重置一组输入控件的值与状态，如不传入参数，则重置所有组件 | Function([names: string[]]) |
 | getFieldProps | 用于和表单进行双向绑定，详见下方描述 | |

-#### this.props.form.getFieldProps(id, options)
+### this.props.form.getFieldProps(id, options)

-##### 特别注意
+#### 特别注意

 `getFieldProps` 调用不能位于纯函数组件中: https://github.com/facebook/react/pull/6534

@ -86,6 +86,8 @@ CustomizedForm = Form.create({})(CustomizedForm);

 > 在表单中 `defaultValue` 也不应该被设置，请使用下面的 `initialValue`。

+#### getFieldProps options
+
 | 参数      | 说明                                     | 类型 | 默认值 |
 |-----------|-----------------------------------------|-----|--------|
 | options.id | 必填输入控件唯一标志 | string | |
--- a/components/pagination/style/index.less
+++ b/components/pagination/style/index.less
@ -127,6 +127,7 @@
  &-prev,
  &-next {
    border: 1px solid @border-color-base;
+    background-color: #fff;

    a {
      color: #666;
--- a/components/radio/style/index.less
+++ b/components/radio/style/index.less
@ -106,6 +106,11 @@
  .@{radio-inner-prefix-cls}-input {
    cursor: default;
  }
+
+  .@{radio-prefix-cls}-disabled + span {
+    color: #ccc;
+    cursor: @cursor-disabled;
+  }
 }

 span.@{radio-prefix-cls} + * {
--- a/components/table/Table.tsx
+++ b/components/table/Table.tsx
@ -14,7 +14,9 @@ function noop() {
 import splitObject from '../_util/splitObject';
 function stopPropagation(e) {
  e.stopPropagation();
-  e.nativeEvent.stopImmediatePropagation();
+  if (e.nativeEvent.stopImmediatePropagation) {
+    e.nativeEvent.stopImmediatePropagation();
+  }
 }

 const defaultLocale = {
--- a/docs/react/getting-started.md
+++ b/docs/react/getting-started.md
@ -30,6 +30,14 @@ $ npm install antd-init -g

 更多功能请参考 [脚手架工具](https://github.com/ant-design/antd-init/) 和 [开发工具文档](http://ant-tool.github.io/)。

+> 除了官方提供的脚手架，您也可以使用社区提供的脚手架和范例：
+>
+>   - [react-redux-antd](https://github.com/okoala/react-redux-antd)
+>   - [react-antd-admin](https://github.com/fireyy/react-antd-admin)
+>   - [react-antd-redux-router-starter](https://github.com/yuzhouisme/react-antd-redux-router-starter)
+>   - [react-redux-antd-starter](https://github.com/BetaRabbit/react-redux-antd-starter)
+>   - [更多](https://github.com/ant-design/ant-design/issues/129)
+
 ### 2. 创建一个项目

 使用命令行进行初始化。
--- a/docs/react/introduce.md
+++ b/docs/react/introduce.md
@ -74,6 +74,7 @@ import 'antd/dist/antd.css';  // or 'antd/dist/antd.less'
 - [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://os.alipayobjects.com/rmsportal/HTXUgPGkyyxEivE.png)
+- [社区贡献脚手架和范例](https://github.com/ant-design/ant-design/issues/129)

 ## 谁在使用

--- a/site/theme/static/common.less
+++ b/site/theme/static/common.less
@ -92,7 +92,7 @@ div.main-container {
    display: block;
    width: 64px;
    margin: 0 auto 10px;
-    animation: loadTween 2S cubic-bezier(0.785, 0.135, 0.15, 0.86) infinite;
+    animation: loadTween 2s cubic-bezier(0.785, 0.135, 0.15, 0.86) infinite;
  }
 }
 #react-content:empty + .ant-site-loading {
--- a/site/theme/static/template.html
+++ b/site/theme/static/template.html
@ -13,7 +13,7 @@
  </head>
  <body>
    <div id="react-content"></div>
-    <div class="ant-site-loading">
+    <div class="ant-site-loading" id="ant-site-loading">
      <img src='https://t.alipayobjects.com/images/rmsweb/T1B9hfXcdvXXXXXXXX.svg' />
      <div id="loading-text">A Design Language</div>
    </div>
--- a/site/theme/template/Layout/index.jsx
+++ b/site/theme/template/Layout/index.jsx
@ -55,6 +55,17 @@ export default class Layout extends React.Component {
      });
      gaListenerSetted = true;
    }
+    const loadingNode = document.getElementById('ant-site-loading');
+    if (!loadingNode) {
+      return;
+    }
+    this.timer = setTimeout(() => {
+      loadingNode.parentNode.removeChild(loadingNode);
+    }, 450);
+  }
+
+  componentWillUnmount() {
+    clearTimeout(this.timer);
  }

  render() {