merge from remote

CHANGELOG.en-US.md

@@ -16,6 +16,46 @@ toc: false
 
 ---
 
+### 2.1.6
+
+`2018-02-05`
+
+
+- **Bug Fix**
+
+  - 🐞  Fix `Modal.prompt` can not input.
+### 2.1.5
+
+`2018-01-29`
+
+- **Feature**
+
+  - 🌟 `ImagePicker` support custom `accept`.([#2269](https://github.com/ant-design/ant-design-mobile/pull/2269))
+
+- **Bug Fix**
+
+  - 🐞  Fix `InputItem` be cover by keyboard in ios 11. ([#2289](https://github.com/ant-design/ant-design-mobile/pull/2289))
+  - 🐞  Fix `Menu` be content be coverd by confim button.([#2273](https://github.com/ant-design/ant-design-mobile/issues/2273))
+  - 🐞  Fix `Progress` tsd。([#2292](https://github.com/ant-design/ant-design-mobile/issues/2292))
+  - 🐞  [React Native] Fix `TextareaItem` extra margin left.([#2260](https://github.com/ant-design/ant-design-mobile/pull/2260))
+
+
+- **Enhancement**
+
+  - 📝  Fix [Picker](https://github.com/ant-design/ant-design-mobile/issues/2291), [DatePicker, Calendar](https://github.com/ant-design/ant-design-mobile/issues/2282) doc.
+
+### 2.1.4
+
+`2018-01-23`
+
+- **Bug Fix**
+
+  - Fix: Modal defaultValue problem. ([#2221](https://github.com/ant-design/ant-design-mobile/pull/2221))
+  - Fix: Modal click event not correctly. ([#1975](https://github.com/ant-design/ant-design-mobile/pull/1975))
+  - Fix: TextArea styles.
+  - Fix: DatePicker/Picker value cache problem.
+  - Fix: InputItem error. ([#2220](https://github.com/ant-design/ant-design-mobile/pull/2220))
+
 ### 2.1.3
 
 `2017-12-29`

CHANGELOG.zh-CN.md

@@ -15,6 +15,48 @@ toc: false
 
 ---
 
+### 2.1.6
+
+`2018-02-05`
+
+
+- **Bug Fix**
+
+  - 🐞  修复 `Modal.prompt` 无法输入的问题。
+
+
+### 2.1.5
+
+`2018-01-29`
+
+- **Feature**
+
+  - 🌟 `ImagePicker` 支持自定义 `accept` 属性。([#2269](https://github.com/ant-design/ant-design-mobile/pull/2269))
+
+- **Bug Fix**
+
+  - 🐞  修复 `InputItem` 在 ios 11 上 focus 时被键盘遮盖的问题。([#2289](https://github.com/ant-design/ant-design-mobile/pull/2289))
+  - 🐞  修复 `Menu` 确定按钮遮盖内容列表的问题。([#2273](https://github.com/ant-design/ant-design-mobile/issues/2273))
+  - 🐞  修复 `Progress` tsd。([#2292](https://github.com/ant-design/ant-design-mobile/issues/2292))
+  - 🐞  [React Native] 修复 `TextareaItem` 多余的左间距。([#2260](https://github.com/ant-design/ant-design-mobile/pull/2260))
+
+
+- **Enhancement**
+
+  - 📝 修复 [Picker](https://github.com/ant-design/ant-design-mobile/issues/2291), [DatePicker, Calendar](https://github.com/ant-design/ant-design-mobile/issues/2282) 文档。
+
+### 2.1.4
+
+`2018-01-23`
+
+- **Bug Fix**
+
+  - 修复: Modal defaultValue 问题 ([#2221](https://github.com/ant-design/ant-design-mobile/pull/2221))
+  - 修复: Modal 关闭事件问题 ([#1975](https://github.com/ant-design/ant-design-mobile/pull/1975))
+  - 修复: TextArea 样式问题
+  - 修复: DatePicker/Picker 值缓存问题
+  - 修复: InputItem 报错 ([#2220](https://github.com/ant-design/ant-design-mobile/pull/2220))
+
 ### 2.1.3
 
 `2017-12-29`

components/calendar/demo/basic.md

@@ -107,8 +107,8 @@ class Test extends React.Component {
           {this.renderBtn('水平进入', 'Horizontal enter', { enterDirection: 'horizontal' })}
           {this.renderBtn('默认选择范围', 'Selected Date Range', { defaultValue: [new Date(+now - 86400000), new Date(+now - 345600000)] })}
           {this.renderBtn('onSelect API', 'onSelect API', {
-            onSelect: (date) => {
-              console.log('onSelect', date);
+            onSelect: (date, state) => {
+              console.log('onSelect', date, state);
               return [date, new Date(+now - 604800000)];
             },
           })}

components/calendar/index.en-US.md

@@ -33,7 +33,7 @@ infiniteOpt|infinite scroll optimize|boolean| false|false
 initalMonths|inital months|number| 6|false
 maxDate|max date|Date||false
 minDate|min date|Date||false
-onSelect | on select dates callback | (date: \[Date, Date\] \| \[Date\]) => \[Date, Date\] \| \[Date\] \| void | | false
+onSelect | on select dates callback | | (date: Date, state?: \[Date | undefined, Date | undefined\]) => \[Date, Date\] \| \[Date\] \| void | | false
 onSelectHasDisableDate|on select has disable date|(date: Date[]) => void||false
 rowSize|row size|'normal' \| 'xl'||false
 defaultValue | default date select value | \[Date, Date\] \| \[Date\] | | false

components/calendar/index.zh-CN.md

@@ -35,7 +35,7 @@ infiniteOpt | 无限滚动优化（大范围选择）| boolean | false | false
 initalMonths | 初始化月个数 | number | 6 | false
 maxDate | 最大日期 | Date | | false
 minDate | 最小日期 | Date | | false
-onSelect | 选择区间回调 | (date: \[Date, Date\] \| \[Date\]) => \[Date, Date\] \| \[Date\] \| void | | false
+onSelect | 选择区间回调 | (date: Date, state?: \[Date | undefined, Date | undefined\]) => \[Date, Date\] \| \[Date\] \| void | | false
 onSelectHasDisableDate | 选择区间包含不可用日期 | (date: Date[]) => void | | false
 rowSize | 行大小 | 'normal' \| 'xl' | | false
 defaultValue | 默认日历选择范围 | \[Date, Date\] \| \[Date\] | | false

components/carousel/demo/basic.md

@@ -137,6 +137,7 @@ ReactDOM.render(<App />, mountNode);
 .space-carousel {
   padding: 16px;
   background: #DEF1E5;
+  overflow: hidden;
 }
 .my-carousel .v-item {
   height: 36px;

components/date-picker/index.en-US.md

@@ -31,6 +31,8 @@ Properties | Descrition | Type | Default
 | extra   | the display text | String  |  `请选择`  |
 | prefixCls (`WEB only`) |  prefix class  | string | `am-picker` |
 | className (`WEB only`) |  className | string | - |
+| onOk  | handler called when click ok | (val): void  |  - |
+| onDismiss  | handler called when click cancel | (): void  |  -  |
 
 Note: The date strings have different implementations in different browsers. For example, `new Date ('2017-1-1')` is an Invalid Date on Safari but is parsed properly on Chrome.
 

components/date-picker/index.tsx

@@ -14,6 +14,7 @@ export interface PropsType extends BasePropsType {
   pickerPrefixCls?: string;
   popupPrefixCls?: string;
   onOk?: (x: any) => void;
+  onVisibleChange?: (visible: boolean) => void;
 }
 export default class DatePicker extends React.Component<PropsType, any> {
   static defaultProps = {
@@ -47,6 +48,13 @@ export default class DatePicker extends React.Component<PropsType, any> {
     }
   }
 
+  onVisibleChange = (_) => {
+    this.scrollValue = undefined;
+    if (this.props.onVisibleChange) {
+      this.props.onVisibleChange(_);
+    }
+  }
+
   fixOnOk = (picker: any) => {
     if (picker) {
       picker.onOk = this.onOk;
@@ -68,7 +76,9 @@ export default class DatePicker extends React.Component<PropsType, any> {
      * PickerView 对外通过 value “只支持 受控” 模式
      *
      * DatePicker / Picker 对外只有 value 属性 (没有 defaultValue)，
-     * 其中 List 展示部分 “只支持 受控” 模式，弹出的 选择器部分 “只支持 非受控” 模式
+     * 其中 List 展示部分 “只支持 受控” 模式，
+     * 弹出的 选择器部分 会随外部 value 改变而变、同时能自由滚动
+     * （即不会因为传入的 value 不变而不能滚动 (不像原生 input 的受控行为)）
      *
      */
 
@@ -100,6 +110,7 @@ export default class DatePicker extends React.Component<PropsType, any> {
         dismissText={this.props.dismissText || dismissText}
         okText={this.props.okText || okText}
         ref={this.fixOnOk}
+        onVisibleChange={this.onVisibleChange}
       >
         {
           children && React.cloneElement(

components/date-picker/index.zh-CN.md

@@ -32,6 +32,8 @@ subtitle: 日期选择
 | extra   | 显示文案 | String  |  `请选择`  |
 | prefixCls (`WEB only`) |  class前缀 | string | `am-picker` |
 | className (`WEB only`) |  样式类名 | string | - |
+| onOk  | 点击选中时执行的回调 | (val): void  |  无 |
+| onDismiss  | 点击取消时执行的回调 | (): void  |  无  |
 
 注意：日期字符串在不同浏览器有不同的实现，例如 `new Date('2017-1-1')` 在 Safari 上是 Invalid Date，而在 Chrome 上是能正常解析的。
 

components/grid/demo/basic.md

@@ -48,7 +48,7 @@ const GridExample = () => (
       )}
     />
     <div className="sub-title">Custom GridCell Style</div>
-    <Grid data={data1} columnNum={3} itemStyle={{ height: '150px', backgroundColor: '#ffff00' }} />
+    <Grid data={data1} columnNum={3} itemStyle={{ height: '150px', background: 'rgba(0,0,0,.05)' }} />
   </div>
 );
 

components/grid/style/index.less

@@ -83,11 +83,12 @@
         }
       }
     }
-  }
-  &.@{gridPrefixCls}-carousel {
-    .@{gridPrefixCls}-carousel-page {
-      .hairline('top');
-      .hairline('right');
+
+    &.@{gridPrefixCls}-carousel {
+      .@{gridPrefixCls}-carousel-page {
+        .hairline('top');
+        .hairline('right');
+      }
     }
   }
 

components/image-picker/PropsType.tsx

@@ -9,4 +9,5 @@ export interface ImagePickerPropTypes {
   onFail?: (msg: string) => void;
   selectable?: boolean;
   multiple?: boolean;
+  accept?: string;
 }

components/image-picker/__tests__/__snapshots__/demo.test.js.snap

@@ -1,5 +1,78 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`renders ./components/image-picker/demo/accept.md correctly 1`] = `
+<div>
+  <div
+    class="am-image-picker"
+  >
+    <div
+      class="am-image-picker-list"
+      role="group"
+    >
+      <div
+        class="am-flexbox am-flexbox-align-center"
+      >
+        <div
+          class="am-flexbox-item"
+        >
+          <div
+            class="am-image-picker-item"
+          >
+            <div
+              aria-label="Click and Remove this image"
+              class="am-image-picker-item-remove"
+              role="button"
+            />
+            <div
+              aria-label="Image can be clicked"
+              class="am-image-picker-item-content"
+              role="button"
+              style="background-image:url(https://zos.alipayobjects.com/rmsportal/PZUUCKTRIHWiZSY.jpeg);transform:rotate(0deg)"
+            />
+          </div>
+        </div>
+        <div
+          class="am-flexbox-item"
+        >
+          <div
+            class="am-image-picker-item"
+          >
+            <div
+              aria-label="Click and Remove this image"
+              class="am-image-picker-item-remove"
+              role="button"
+            />
+            <div
+              aria-label="Image can be clicked"
+              class="am-image-picker-item-content"
+              role="button"
+              style="background-image:url(https://zos.alipayobjects.com/rmsportal/hqQWgTXdrlmVVYi.jpeg);transform:rotate(0deg)"
+            />
+          </div>
+        </div>
+        <div
+          class="am-flexbox-item"
+        >
+          <div
+            aria-label="Choose and add image"
+            class="am-image-picker-item am-image-picker-upload-btn"
+            role="button"
+          >
+            <input
+              accept="image/gif,image/jpeg,image/jpg,image/png"
+              type="file"
+            />
+          </div>
+        </div>
+        <div
+          class="am-flexbox-item"
+        />
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
 exports[`renders ./components/image-picker/demo/basic.md correctly 1`] = `
 <div
   class="am-wingblank am-wingblank-lg"

components/image-picker/demo/accept.md

@@ -0,0 +1,47 @@
+---
+order: 2
+title:
+  zh-CN: 自定义文件类型
+  en-US: 'Cutom file accept'
+---
+
+````jsx
+import { ImagePicker } from 'antd-mobile';
+
+const data = [{
+  url: 'https://zos.alipayobjects.com/rmsportal/PZUUCKTRIHWiZSY.jpeg',
+  id: '2121',
+}, {
+  url: 'https://zos.alipayobjects.com/rmsportal/hqQWgTXdrlmVVYi.jpeg',
+  id: '2122',
+}];
+
+class ImagePickerExample extends React.Component {
+  state = {
+    files: data,
+  }
+  onChange = (files, type, index) => {
+    console.log(files, type, index);
+    this.setState({
+      files,
+    });
+  }
+
+  render() {
+    const { files } = this.state;
+    return (
+      <div>
+        <ImagePicker
+          files={files}
+          onChange={this.onChange}
+          onImageClick={(index, fs) => console.log(index, fs)}
+          selectable={files.length < 5}
+          accept="image/gif,image/jpeg,image/jpg,image/png"
+        />
+      </div>
+    );
+  }
+}
+
+ReactDOM.render(<ImagePickerExample />, mountNode);
+````

components/image-picker/index.en-US.md

@@ -20,5 +20,6 @@ Properties | Descrition | Type | Default
 | onFail | Callback is called when canceled image selection(`RN`) or failed selection(`WEB`)  | (msg: string): void |   |
 | selectable | whether to show selector button  | boolean |  true |
 | multiple| whether support choose multi images at once  | boolean |  false |
+| accept| File type accept  | string |  image/* |
 
 > Note: Only return assets-library type for RN, if you want to upload files, see https://github.com/facebook/react-native/issues/201

components/image-picker/index.tsx

@@ -22,6 +22,7 @@ export default class ImagePicker extends React.Component<ImagePickerPropTypes, a
     onFail: noop,
     selectable: true,
     multiple: false,
+    accept: 'image/*',
   };
 
   fileSelectorInput: any;
@@ -147,7 +148,7 @@ export default class ImagePicker extends React.Component<ImagePickerPropTypes, a
   }
   render() {
     const {
-      prefixCls, style, className, files = [], selectable, onAddImageClick, multiple,
+      prefixCls, style, className, files = [], selectable, onAddImageClick, multiple, accept,
     } = this.props;
 
     const imgItemList: any[] = [];
@@ -192,7 +193,7 @@ export default class ImagePicker extends React.Component<ImagePickerPropTypes, a
             <input
               ref={(input) => { this.fileSelectorInput = input; }}
               type="file"
-              accept="image/*"
+              accept={accept}
               onChange={() => { this.onFileChange(); }}
               multiple={multiple}
             />

components/image-picker/index.zh-CN.md

@@ -21,6 +21,7 @@ subtitle: 图片选择器
 | onFail | 选择失败(`WEB`)或者取消回调(`RN`)  | (msg: string): void |   |
 | selectable| 是否显示添加按钮  | boolean |  true |
 | multiple| 是否支持多选  | boolean |  false |
+| accept| 图片类型  | string |  image/* |
 
 
 > 注: RN 版本回传 assets-library (性能考虑)，需要使用 native 模块进行上传，可参考 https://github.com/facebook/react-native/issues/201