shineout 1.7.0 → 1.7.1-beta.3

package/es/DatePicker/Range.js

@@ -1,235 +1,286 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import immer from 'immer'
-import { PureComponent } from '../component'
-import shallowEqual from '../utils/shallowEqual'
-import utils from './utils'
-import paramUtils from './paramUtils'
-import Picker from './Picker'
-import { datepickerClass } from './styles'
-import Quick from './Quick'
-
-class Range extends PureComponent {
-  constructor(props) {
-    super(props)
-
-    this.state = {
-      rangeDate: props.value,
-    }
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import React from 'react';
+import PropTypes from 'prop-types';
+import immer from 'immer';
+import { PureComponent } from '../component';
+import shallowEqual from '../utils/shallowEqual';
+import utils from './utils';
+import paramUtils from './paramUtils';
+import Picker from './Picker';
+import { datepickerClass } from './styles';
+import Quick from './Quick';
+
+var Range =
+/*#__PURE__*/
+function (_PureComponent) {
+  _inheritsLoose(Range, _PureComponent);
+
+  function Range(props) {
+    var _this;
 
-    this.pickers = []
-
-    this.handleChange = this.handleChange.bind(this)
-    this.handleFirstChange = this.handleChange.bind(this, 0)
-    this.handleSecondChange = this.handleChange.bind(this, 1)
-    this.handleDayHover = this.handleDayHover.bind(this)
-    this.bindFirstPicker = this.bindPicker.bind(this, 0)
-    this.bindSecondPicker = this.bindPicker.bind(this, 1)
-    this.handleDisabledStart = this.handleDisabled.bind(this, 'start')
-    this.handleDisabledEnd = this.handleDisabled.bind(this, 'end')
-    this.changeDateSmart = this.changeDateSmart.bind(this)
-    this.fillTime = this.fillTime.bind(this)
-    this.handleQuick = this.handleQuick.bind(this)
+    _this = _PureComponent.call(this, props) || this;
+    _this.state = {
+      rangeDate: props.value
+    };
+    _this.pickers = [];
+    _this.handleChange = _this.handleChange.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleFirstChange = _this.handleChange.bind(_assertThisInitialized(_assertThisInitialized(_this)), 0);
+    _this.handleSecondChange = _this.handleChange.bind(_assertThisInitialized(_assertThisInitialized(_this)), 1);
+    _this.handleDayHover = _this.handleDayHover.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.bindFirstPicker = _this.bindPicker.bind(_assertThisInitialized(_assertThisInitialized(_this)), 0);
+    _this.bindSecondPicker = _this.bindPicker.bind(_assertThisInitialized(_assertThisInitialized(_this)), 1);
+    _this.handleDisabledStart = _this.handleDisabled.bind(_assertThisInitialized(_assertThisInitialized(_this)), 'start');
+    _this.handleDisabledEnd = _this.handleDisabled.bind(_assertThisInitialized(_assertThisInitialized(_this)), 'end');
+    _this.changeDateSmart = _this.changeDateSmart.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.fillTime = _this.fillTime.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleQuick = _this.handleQuick.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    return _this;
   }
 
-  componentDidUpdate(prevProps) {
-    const { rangeDate } = this.state
-    if (
-      rangeDate.length !== 1 &&
-      !shallowEqual(prevProps.value, this.props.value) &&
-      !shallowEqual(this.state.rangeDate, this.props.value)
-    ) {
+  var _proto = Range.prototype;
+
+  _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
+    var rangeDate = this.state.rangeDate;
+
+    if (rangeDate.length !== 1 && !shallowEqual(prevProps.value, this.props.value) && !shallowEqual(this.state.rangeDate, this.props.value)) {
       // eslint-disable-next-line
-      this.setState({ rangeDate: this.props.value })
+      this.setState({
+        rangeDate: this.props.value
+      });
     }
-  }
+  };
 
-  bindPicker(index, el) {
-    this.pickers[index] = el
-  }
+  _proto.bindPicker = function bindPicker(index, el) {
+    this.pickers[index] = el;
+  };
 
-  resetRange(rangeDate) {
-    this.setState({ rangeDate })
-  }
+  _proto.resetRange = function resetRange(rangeDate) {
+    this.setState({
+      rangeDate: rangeDate
+    });
+  };
 
-  handleDayHover(date) {
+  _proto.handleDayHover = function handleDayHover(date) {
     if (this.state.rangeDate.length === 1) {
-      utils.cloneTime(date, this.props.value[1], this.props.format)
-      // this.setState({ hover: date })
+      utils.cloneTime(date, this.props.value[1], this.props.format); // this.setState({ hover: date })
     }
-  }
+  };
+
+  _proto.changeDateSmart = function changeDateSmart(rangeDate) {
+    if (!rangeDate[0] || !rangeDate[1]) return;
+    var s = rangeDate[0],
+        e = rangeDate[1];
+    var range = this.props.range;
 
-  changeDateSmart(rangeDate) {
-    if (!rangeDate[0] || !rangeDate[1]) return
-    const [s, e] = rangeDate
-    const { range } = this.props
     if (typeof range === 'number') {
-      if (utils.compareAsc(s, utils.addSeconds(e, -range)) < 0) rangeDate[1] = utils.addSeconds(s, range)
+      if (utils.compareAsc(s, utils.addSeconds(e, -range)) < 0) rangeDate[1] = utils.addSeconds(s, range);
     }
+
     if (utils.compareAsc(s, e) > 0) {
-      const sWitheTime = utils.toDate(s)
-      utils.setTime(sWitheTime, e)
-      rangeDate[1] = utils.compareAsc(s, sWitheTime) > 0 ? s : sWitheTime
+      var sWitheTime = utils.toDate(s);
+      utils.setTime(sWitheTime, e);
+      rangeDate[1] = utils.compareAsc(s, sWitheTime) > 0 ? s : sWitheTime;
     }
-  }
+  } // Be consistent with the parent onChange, expand first params: index
+  ;
 
-  // Be consistent with the parent onChange, expand first params: index
-  handleChange(index, date, change, end, mode, isQuickSelect, areaType) {
-    const { type, range, min, max } = this.props
+  _proto.handleChange = function handleChange(index, date, change, end, mode, isQuickSelect, areaType) {
+    var _this2 = this;
 
-    const handleOnChangeParams = paramUtils.handleOnChangeParams(areaType)
+    var _this$props = this.props,
+        type = _this$props.type,
+        range = _this$props.range,
+        min = _this$props.min,
+        max = _this$props.max;
+    var handleOnChangeParams = paramUtils.handleOnChangeParams(areaType);
 
     if (!change) {
-      const current = immer(this.props.current, draft => {
-        draft[index] = date
-      })
-      this.props.onChange(...handleOnChangeParams(current))
-      return
+      var _this$props2;
+
+      var current = immer(this.props.current, function (draft) {
+        draft[index] = date;
+      });
+
+      (_this$props2 = this.props).onChange.apply(_this$props2, handleOnChangeParams(current));
+
+      return;
     }
 
     if (mode === 'time') {
-      let endChangedDate
-      this.setState(
-        immer(draft => {
-          draft.rangeDate[index] = date
-          const [s, e] = draft.rangeDate
-          if (index !== 0) {
-            if (s && s.getHours() === e.getHours()) {
-              if (utils.compareAsc(s, e) === 1) {
-                e.setMinutes(s.getMinutes())
-              }
+      var endChangedDate;
+      this.setState(immer(function (draft) {
+        draft.rangeDate[index] = date;
+        var _draft$rangeDate = draft.rangeDate,
+            s = _draft$rangeDate[0],
+            e = _draft$rangeDate[1];
+
+        if (index !== 0) {
+          if (s && s.getHours() === e.getHours()) {
+            if (utils.compareAsc(s, e) === 1) {
+              e.setMinutes(s.getMinutes());
             }
-            return
-          }
-          if (range && utils.compareAsc(s, e) === 1) {
-            endChangedDate = date
-            draft.rangeDate[1] = endChangedDate
-          }
-          if (typeof range === 'number' && utils.compareAsc(s, utils.addSeconds(e, -range)) < 0) {
-            endChangedDate = utils.addSeconds(s, range)
-            draft.rangeDate[1] = endChangedDate
           }
-        }),
-        () => {
-          const current = immer(this.props.value, draft => {
-            draft[index] = date
-            if (endChangedDate) draft[1] = endChangedDate
-            draft[1 - index] = draft[1 - index] || ''
-          })
-          this.props.onChange(...handleOnChangeParams(current, true))
+
+          return;
+        }
+
+        if (range && utils.compareAsc(s, e) === 1) {
+          endChangedDate = date;
+          draft.rangeDate[1] = endChangedDate;
         }
-      )
-      return
+
+        if (typeof range === 'number' && utils.compareAsc(s, utils.addSeconds(e, -range)) < 0) {
+          endChangedDate = utils.addSeconds(s, range);
+          draft.rangeDate[1] = endChangedDate;
+        }
+      }), function () {
+        var _this2$props;
+
+        var current = immer(_this2.props.value, function (draft) {
+          draft[index] = date;
+          if (endChangedDate) draft[1] = endChangedDate;
+          draft[1 - index] = draft[1 - index] || '';
+        });
+
+        (_this2$props = _this2.props).onChange.apply(_this2$props, handleOnChangeParams(current, true));
+      });
+      return;
     }
 
     if (type === 'month') {
-      // eslint-disable-next-line
-      const rangeDate = [...this.state.rangeDate]
-      rangeDate[index] = date
-      rangeDate[1 - index] = rangeDate[1 - index] || ''
+      var _this$props3;
 
-      this.changeDateSmart(rangeDate)
+      // eslint-disable-next-line
+      var rangeDate = [].concat(this.state.rangeDate);
+      rangeDate[index] = date;
+      rangeDate[1 - index] = rangeDate[1 - index] || '';
+      this.changeDateSmart(rangeDate);
+      this.setState({
+        rangeDate: rangeDate
+      });
 
-      this.setState({ rangeDate })
-      this.props.onChange(...handleOnChangeParams(rangeDate, true, true, index === 1))
+      (_this$props3 = this.props).onChange.apply(_this$props3, handleOnChangeParams(rangeDate, true, true, index === 1));
 
-      return
+      return;
     }
 
-    utils.cloneTime(date, this.props.value[index])
+    utils.cloneTime(date, this.props.value[index]);
+
     if (min && utils.compareAsc(date, min) <= 0) {
-      utils.setTime(date, min)
+      utils.setTime(date, min);
     }
+
     if (max && utils.compareAsc(date, max) >= 0) {
-      utils.setTime(date, max)
-    }
-    // if (this.state.rangeDate.filter(a => a).length !== 1) {
+      utils.setTime(date, max);
+    } // if (this.state.rangeDate.filter(a => a).length !== 1) {
     //   this.setState({ rangeDate: index === 1 ? [undefined, date] : [date], hover: undefined })
     //   return
     // }
 
-    this.setState(
-      immer(draft => {
-        // const method = utils.compareAsc(draft.rangeDate[0], date) > 0 ? 'unshift' : 'push'
-        draft.rangeDate[index] = date
-        draft.rangeDate[1 - index] = draft.rangeDate[1 - index] || ''
-        // draft.rangeDate.map(this.fillTime)
-        // range change start&end
-        this.changeDateSmart(draft.rangeDate)
-        draft.hover = undefined
-      }),
-      () => {
-        // only 'datetime' don not need close, 'time is up'
-        this.props.onChange(...handleOnChangeParams(this.state.rangeDate, true, type !== 'datetime', index === 1))
-      }
-    )
-  }
 
-  fillTime(date, index) {
-    const { defaultTime, format, value } = this.props
-    return utils.formatDateWithDefaultTime(date, value[index], defaultTime[index], format)
-  }
+    this.setState(immer(function (draft) {
+      // const method = utils.compareAsc(draft.rangeDate[0], date) > 0 ? 'unshift' : 'push'
+      draft.rangeDate[index] = date;
+      draft.rangeDate[1 - index] = draft.rangeDate[1 - index] || ''; // draft.rangeDate.map(this.fillTime)
+      // range change start&end
+
+      _this2.changeDateSmart(draft.rangeDate);
+
+      draft.hover = undefined;
+    }), function () {
+      var _this2$props2;
+
+      // only 'datetime' don not need close, 'time is up'
+      (_this2$props2 = _this2.props).onChange.apply(_this2$props2, handleOnChangeParams(_this2.state.rangeDate, true, type !== 'datetime', index === 1));
+    });
+  };
+
+  _proto.fillTime = function fillTime(date, index) {
+    var _this$props4 = this.props,
+        defaultTime = _this$props4.defaultTime,
+        format = _this$props4.format,
+        value = _this$props4.value;
+    return utils.formatDateWithDefaultTime(date, value[index], defaultTime[index], format);
+  };
+
+  _proto.handleDisabled = function handleDisabled(type, date) {
+    var disabled = this.props.disabled;
+    var rangeDate = this.state.rangeDate;
 
-  handleDisabled(type, date) {
-    const { disabled } = this.props
-    const { rangeDate } = this.state
     if (disabled) {
-      return disabled(date, type, ...rangeDate)
+      return disabled.apply(void 0, [date, type].concat(rangeDate));
     }
-    return false
-  }
 
-  handleQuick(quick) {
-    this.setState({ rangeDate: quick.value })
-    this.props.onChange(...paramUtils.quickHandleChangeParams(quick.value, true, null, null, quick))
-  }
+    return false;
+  };
+
+  _proto.handleQuick = function handleQuick(quick) {
+    var _this$props5;
+
+    this.setState({
+      rangeDate: quick.value
+    });
+
+    (_this$props5 = this.props).onChange.apply(_this$props5, paramUtils.quickHandleChangeParams(quick.value, true, null, null, quick));
+  };
 
-  render() {
+  _proto.render = function render() {
     // min & max can not to child
-    const { current, value, range, children, min, max, quicks, ...props } = this.props
-    const rangeDate = [...this.state.rangeDate]
-    return (
-      <div className={datepickerClass('range-picker')}>
-        <Quick {...this.props} current={this.state.rangeDate} onChange={this.handleQuick} />
-        <Picker
-          {...props}
-          pos="start"
-          disabled={this.handleDisabledStart}
-          index={0}
-          min={min}
-          max={max}
-          current={current[0]}
-          range={typeof range === 'number' ? range : undefined}
-          rangeDate={rangeDate}
-          rangeTemp={rangeDate[0]}
-          onChange={this.handleFirstChange}
-          onChangeSync={this.handleChange}
-          onDayHover={this.handleDayHover}
-          ref={this.bindFirstPicker}
-          value={utils.toDateWithFormat(value[0], props.format)}
-          showTimePicker={value.length === 2}
-        />
-        <Picker
-          {...props}
-          disabled={this.handleDisabledEnd}
-          index={1}
-          min={rangeDate[0] ? rangeDate[0] : min}
-          max={max}
-          current={current[1]}
-          range={typeof range === 'number' ? range : undefined}
-          rangeDate={rangeDate}
-          rangeTemp={rangeDate[0]}
-          onChange={this.handleSecondChange}
-          onChangeSync={this.handleChange}
-          onDayHover={this.handleDayHover}
-          ref={this.bindSecondPicker}
-          value={utils.toDateWithFormat(value[1], props.format)}
-          showTimePicker={value.length === 2}
-        />
-      </div>
-    )
-  }
-}
+    var _this$props6 = this.props,
+        current = _this$props6.current,
+        value = _this$props6.value,
+        range = _this$props6.range,
+        children = _this$props6.children,
+        min = _this$props6.min,
+        max = _this$props6.max,
+        quicks = _this$props6.quicks,
+        props = _objectWithoutPropertiesLoose(_this$props6, ["current", "value", "range", "children", "min", "max", "quicks"]);
+
+    var rangeDate = [].concat(this.state.rangeDate);
+    return React.createElement("div", {
+      className: datepickerClass('range-picker')
+    }, React.createElement(Quick, _extends({}, this.props, {
+      current: this.state.rangeDate,
+      onChange: this.handleQuick
+    })), React.createElement(Picker, _extends({}, props, {
+      pos: "start",
+      disabled: this.handleDisabledStart,
+      index: 0,
+      min: min,
+      max: max,
+      current: current[0],
+      range: typeof range === 'number' ? range : undefined,
+      rangeDate: rangeDate,
+      rangeTemp: rangeDate[0],
+      onChange: this.handleFirstChange,
+      onChangeSync: this.handleChange,
+      onDayHover: this.handleDayHover,
+      ref: this.bindFirstPicker,
+      value: utils.toDateWithFormat(value[0], props.format),
+      showTimePicker: value.length === 2
+    })), React.createElement(Picker, _extends({}, props, {
+      disabled: this.handleDisabledEnd,
+      index: 1,
+      min: rangeDate[0] ? rangeDate[0] : min,
+      max: max,
+      current: current[1],
+      range: typeof range === 'number' ? range : undefined,
+      rangeDate: rangeDate,
+      rangeTemp: rangeDate[0],
+      onChange: this.handleSecondChange,
+      onChangeSync: this.handleChange,
+      onDayHover: this.handleDayHover,
+      ref: this.bindSecondPicker,
+      value: utils.toDateWithFormat(value[1], props.format),
+      showTimePicker: value.length === 2
+    })));
+  };
+
+  return Range;
+}(PureComponent);
 
 Range.propTypes = {
   current: PropTypes.array,
@@ -243,11 +294,9 @@ Range.propTypes = {
   defaultTime: PropTypes.array,
   quicks: PropTypes.array,
   min: PropTypes.object,
-  max: PropTypes.object,
-}
-
+  max: PropTypes.object
+};
 Range.defaultProps = {
-  value: [],
-}
-
-export default Range
+  value: []
+};
+export default Range;