shineout 1.12.2 → 1.12.3

package/esm/DatePicker/Text.js

@@ -0,0 +1,141 @@
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React, { PureComponent } from 'react';
+import { getParent, focusElement } from '../utils/dom/element';
+import utils from './utils';
+import { datepickerClass } from './styles';
+import { getLocale } from '../locale';
+var target = null;
+document.addEventListener('mousedown', function (e) {
+  // eslint-disable-next-line prefer-destructuring
+  target = e.target;
+}, true);
+var DefaultValue = {
+  value: ''
+};
+
+var Text =
+/*#__PURE__*/
+function (_PureComponent) {
+  _inheritsLoose(Text, _PureComponent);
+
+  function Text(props) {
+    var _this;
+
+    _this = _PureComponent.call(this, props) || this;
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "element", void 0);
+
+    _this.handleBlur = _this.handleBlur.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleInput = _this.handleInput.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleFocus = _this.handleFocus.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.bindElement = _this.bindElement.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    return _this;
+  }
+
+  var _proto = Text.prototype;
+
+  _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
+    if (prevProps.focus !== this.props.focus && this.props.focus && this.element && (this.props.focusElement === this.element || !this.props.focusElement)) {
+      focusElement.end(this.element);
+    }
+  };
+
+  _proto.getOptions = function getOptions() {
+    var timeZone = this.props.timeZone;
+    return {
+      timeZone: timeZone,
+      weekStartsOn: getLocale('startOfWeek')
+    };
+  };
+
+  _proto.bindElement = function bindElement(el) {
+    var onTextSpanRef = this.props.onTextSpanRef;
+    this.element = el;
+    if (onTextSpanRef) onTextSpanRef(el);
+  };
+
+  _proto.handleBlur = function handleBlur(e) {
+    var _this$props = this.props,
+        format = _this$props.format,
+        index = _this$props.index,
+        onChange = _this$props.onChange,
+        value = _this$props.value;
+    var txt = e.target.innerText;
+    if (getParent(target, "." + datepickerClass('picker'))) return;
+    if (txt === value) return;
+
+    if (txt.trim().length === 0) {
+      onChange(undefined, index, e);
+    } else {
+      if (typeof format !== 'string') {
+        console.error('formatResult should be string when inputable is true');
+      }
+
+      var newValue = typeof format === 'string' ? utils.toDateWithFormat(txt, format, undefined, this.getOptions()) : undefined; // if translate fail, clear
+
+      if (!newValue) {
+        // @ts-ignore
+        this.element.innerText = null;
+      }
+
+      onChange(newValue, index, e);
+    }
+  };
+
+  _proto.handleFocus = function handleFocus(e) {
+    var onTextSpanRef = this.props.onTextSpanRef;
+    if (onTextSpanRef) onTextSpanRef(e.target);
+  };
+
+  _proto.handleInput = function handleInput(e) {
+    if (e.keyCode === 13) {
+      e.preventDefault();
+      e.stopPropagation();
+      this.element.blur();
+      this.handleBlur(e); // must wait for handleBlur to finish executing
+
+      Promise.resolve().then(function () {
+        document.dispatchEvent(new Event('mousedown', {
+          bubbles: true
+        }));
+      });
+    }
+  };
+
+  _proto.render = function render() {
+    var _this$props2 = this.props,
+        className = _this$props2.className,
+        inputable = _this$props2.inputable,
+        value = _this$props2.value,
+        placeholder = _this$props2.placeholder,
+        disabled = _this$props2.disabled,
+        focus = _this$props2.focus;
+
+    if (!inputable || disabled || !focus) {
+      return React.createElement("span", {
+        onClick: this.handleFocus,
+        className: className
+      }, value || placeholder);
+    }
+
+    return React.createElement("span", {
+      ref: this.bindElement,
+      contentEditable: inputable,
+      onBlur: this.handleBlur,
+      onFocus: this.handleFocus,
+      onKeyDown: this.handleInput,
+      className: className,
+      dangerouslySetInnerHTML: {
+        __html: value
+      }
+    });
+  };
+
+  return Text;
+}(PureComponent);
+
+_defineProperty(Text, "defaultProps", DefaultValue);
+
+export default Text;

package/esm/DatePicker/Time.d.ts

@@ -0,0 +1,21 @@
+import { PureComponent } from 'react';
+import { UnionPannelProps } from './Props';
+declare class Time extends PureComponent<UnionPannelProps> {
+    defaultValue: Date;
+    handleMinuteChange: (val: number) => void;
+    handleHourChange: (val: number) => void;
+    handleSecondChange: (val: number) => void;
+    handleAMPMChange: (val: number) => void;
+    constructor(props: UnionPannelProps);
+    getOptions(): {
+        timeZone: string | undefined;
+        weekStartsOn: any;
+    };
+    getDefaultTime(): Date;
+    getValue(): Date;
+    handleDisabled(value: Date, val: number, mode: 'H' | 'h' | 'm' | 'minute' | 's' | 'second' | 'ampm', onlyVaild?: boolean): boolean | (boolean | Date)[];
+    handleChange(type: 'hour' | 'minute' | 'second' | 'ampm', val: number): void;
+    renderTimeScroller(value: Date, min: Date | null, max: Date | null, hours: number): (false | JSX.Element)[];
+    render(): JSX.Element;
+}
+export default Time;

package/esm/DatePicker/Time.js

@@ -0,0 +1,215 @@
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React, { PureComponent } from 'react';
+import { datepickerClass } from './styles';
+import TimeScroll from './TimeScroll';
+import utils from './utils';
+import { isRTL } from '../config';
+import paramUtils from './paramUtils';
+import { getLocale } from '../locale';
+
+var Time =
+/*#__PURE__*/
+function (_PureComponent) {
+  _inheritsLoose(Time, _PureComponent);
+
+  function Time(props) {
+    var _this;
+
+    _this = _PureComponent.call(this, props) || this;
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "defaultValue", void 0);
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleMinuteChange", void 0);
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleHourChange", void 0);
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleSecondChange", void 0);
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleAMPMChange", void 0);
+
+    _this.defaultValue = _this.getDefaultTime();
+    _this.handleHourChange = _this.handleChange.bind(_assertThisInitialized(_assertThisInitialized(_this)), 'hour');
+    _this.handleMinuteChange = _this.handleChange.bind(_assertThisInitialized(_assertThisInitialized(_this)), 'minute');
+    _this.handleSecondChange = _this.handleChange.bind(_assertThisInitialized(_assertThisInitialized(_this)), 'second');
+    _this.handleAMPMChange = _this.handleChange.bind(_assertThisInitialized(_assertThisInitialized(_this)), 'ampm');
+    _this.handleDisabled = _this.handleDisabled.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    props.disabledRegister(_this.handleDisabled, 'time', props.index);
+    return _this;
+  }
+
+  var _proto = Time.prototype;
+
+  _proto.getOptions = function getOptions() {
+    var timeZone = this.props.timeZone;
+    return {
+      timeZone: timeZone,
+      weekStartsOn: getLocale('startOfWeek')
+    };
+  };
+
+  _proto.getDefaultTime = function getDefaultTime() {
+    var idx = 0;
+    var current = utils.newDate();
+    var _this$props = this.props,
+        index = _this$props.index,
+        defaultTime = _this$props.defaultTime,
+        format = _this$props.format;
+    if (typeof index === 'number') idx = index;
+    if (!defaultTime[idx]) return current;
+    return utils.cloneTime(current, defaultTime[idx], format, this.getOptions());
+  };
+
+  _proto.getValue = function getValue() {
+    return this.props.value || this.defaultValue;
+  };
+
+  _proto.handleDisabled = function handleDisabled(value, val, mode, onlyVaild) {
+    var _this$props2 = this.props,
+        disabled = _this$props2.disabled,
+        min = _this$props2.min,
+        max = _this$props2.max,
+        range = _this$props2.range,
+        disabledTime = _this$props2.disabledTime;
+
+    var _paramUtils$judgeTime = paramUtils.judgeTimeByRange(val, value, mode, min, max, range, disabled, disabledTime, this.getOptions()),
+        isDisabled = _paramUtils$judgeTime[0],
+        date = _paramUtils$judgeTime[1];
+
+    return onlyVaild ? isDisabled : [isDisabled, date];
+  };
+
+  _proto.handleChange = function handleChange(type, val) {
+    var _this$props3;
+
+    var format = this.props.format;
+    var value = this.getValue();
+    var mode = type;
+
+    if (type === 'hour') {
+      if (format.indexOf('h') >= 0) {
+        mode = 'h';
+      } else {
+        mode = 'H';
+      }
+    }
+
+    var _this$handleDisabled = this.handleDisabled(value, val, mode),
+        isDisabled = _this$handleDisabled[0],
+        date = _this$handleDisabled[1];
+
+    if (isDisabled) return;
+
+    (_this$props3 = this.props).onChange.apply(_this$props3, paramUtils.timeHandleChangeParams(date, true, false, true));
+
+    this.props.onChange(paramUtils.timeHandleChangeParams(date, true, false)[0]);
+  };
+
+  _proto.renderTimeScroller = function renderTimeScroller(value, min, max, hours) {
+    var _this$props4 = this.props,
+        format = _this$props4.format,
+        hourStep = _this$props4.hourStep,
+        minuteStep = _this$props4.minuteStep,
+        secondStep = _this$props4.secondStep,
+        range = _this$props4.range,
+        disabled = _this$props4.disabled,
+        disabledTime = _this$props4.disabledTime;
+    var rtl = isRTL();
+    var res = [format.indexOf('H') >= 0 && React.createElement(TimeScroll, {
+      key: "HH",
+      current: value,
+      value: utils.getDateInfo(value, 'hour', this.getOptions()),
+      mode: "H",
+      range: range,
+      min: min,
+      max: max,
+      disabled: disabled,
+      total: 24,
+      step: hourStep,
+      onChange: this.handleHourChange,
+      disabledTime: disabledTime
+    }), format.indexOf('h') >= 0 && React.createElement(TimeScroll, {
+      key: "hh",
+      current: value,
+      mode: "h",
+      range: range,
+      min: min,
+      max: max,
+      disabled: disabled,
+      value: hours,
+      total: 12,
+      step: hourStep,
+      onChange: this.handleHourChange,
+      disabledTime: disabledTime
+    }), format.indexOf('m') >= 0 && React.createElement(TimeScroll, {
+      key: "mm",
+      current: value,
+      mode: "m",
+      range: range,
+      min: min,
+      max: max,
+      disabled: disabled,
+      value: utils.getDateInfo(value, 'minute', this.getOptions()),
+      step: minuteStep,
+      onChange: this.handleMinuteChange,
+      disabledTime: disabledTime
+    }), format.indexOf('s') >= 0 && React.createElement(TimeScroll, {
+      key: "ss",
+      current: value,
+      mode: "s",
+      range: range,
+      min: min,
+      max: max,
+      disabled: disabled,
+      value: utils.getDateInfo(value, 'second', this.getOptions()),
+      step: secondStep,
+      onChange: this.handleSecondChange,
+      disabledTime: disabledTime
+    }), /a|A/.test(format) && React.createElement(TimeScroll, {
+      key: "ampm",
+      current: value,
+      mode: "ampm",
+      range: range,
+      min: min,
+      max: max,
+      disabled: disabled,
+      value: utils.getDateInfo(value, 'hour', this.getOptions()) >= 12 ? 1 : 0,
+      total: 2,
+      ampm: true,
+      onChange: this.handleAMPMChange,
+      disabledTime: disabledTime
+    })];
+
+    if (rtl) {
+      res = res.reverse();
+    }
+
+    return res;
+  };
+
+  _proto.render = function render() {
+    var _this$props5 = this.props,
+        format = _this$props5.format,
+        mi = _this$props5.min,
+        ma = _this$props5.max;
+    var value = this.getValue();
+    var className = datepickerClass('time-picker');
+    var hours = value.getHours();
+
+    if (format.indexOf('h') >= 0 && hours >= 12) {
+      hours -= 12;
+    } // reset
+
+
+    var min = utils.resetTimeByFormat(mi, format, this.getOptions());
+    var max = utils.resetTimeByFormat(ma, format, this.getOptions());
+    return React.createElement("div", {
+      className: className
+    }, this.renderTimeScroller(value, min, max, hours));
+  };
+
+  return Time;
+}(PureComponent);
+
+export default Time;

package/esm/DatePicker/TimeScroll.d.ts

@@ -0,0 +1,26 @@
+import React, { PureComponent } from 'react';
+import { TimeScrollProps } from './Props';
+declare class TimeScroll extends PureComponent<TimeScrollProps> {
+    static defaultProps: {
+        total: number;
+    };
+    element: HTMLDivElement;
+    constructor(props: TimeScrollProps);
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    getOptions(): {
+        timeZone: string | undefined;
+        weekStartsOn: any;
+    };
+    getValue(v: number): number;
+    getItemStyle(num: number, isDisabled: boolean): React.CSSProperties | null;
+    bindElement(el: HTMLDivElement): void;
+    updateScrollTop(): void;
+    scrollToValue(): void;
+    handleClick(value: number): void;
+    handleMouseLeave(): void;
+    handleScroll(): void;
+    renderItem(num: number): JSX.Element | null;
+    render(): JSX.Element;
+}
+export default TimeScroll;

package/esm/DatePicker/TimeScroll.js

@@ -0,0 +1,185 @@
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React, { PureComponent } from 'react';
+import { range } from '../utils/numbers';
+import { datepickerClass } from './styles';
+import paramUtils from './paramUtils';
+import { getLocale } from '../locale';
+var lineHeight = 30;
+var grayStyle = {
+  1: {
+    color: '#888'
+  },
+  2: {
+    color: '#ccc'
+  },
+  3: {
+    color: '#eee'
+  }
+};
+var DefaultValue = {
+  total: 60
+};
+
+var TimeScroll =
+/*#__PURE__*/
+function (_PureComponent) {
+  _inheritsLoose(TimeScroll, _PureComponent);
+
+  function TimeScroll(props) {
+    var _this;
+
+    _this = _PureComponent.call(this, props) || this;
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "element", void 0);
+
+    _this.bindElement = _this.bindElement.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleMouseLeave = _this.handleMouseLeave.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleScroll = _this.handleScroll.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    return _this;
+  }
+
+  var _proto = TimeScroll.prototype;
+
+  _proto.componentDidMount = function componentDidMount() {
+    this.updateScrollTop();
+  };
+
+  _proto.componentDidUpdate = function componentDidUpdate() {
+    this.updateScrollTop();
+  };
+
+  _proto.getOptions = function getOptions() {
+    var timeZone = this.props.timeZone;
+    return {
+      timeZone: timeZone,
+      weekStartsOn: getLocale('startOfWeek')
+    };
+  };
+
+  _proto.getValue = function getValue(v) {
+    var _this$props = this.props,
+        step = _this$props.step,
+        ampm = _this$props.ampm;
+    if (!step || ampm) return v;
+    return Math.ceil(v / step);
+  };
+
+  _proto.getItemStyle = function getItemStyle(num, isDisabled) {
+    if (isDisabled) return null;
+
+    if (this.props.ampm || typeof this.props.step === 'number' && this.props.step > 0) {
+      if (this.props.value % this.props.step) return null;
+      return grayStyle[Math.ceil(Math.abs(this.props.value - num) / this.props.step)];
+    }
+
+    return grayStyle[Math.abs(this.props.value - num)];
+  };
+
+  _proto.bindElement = function bindElement(el) {
+    this.element = el;
+  };
+
+  _proto.updateScrollTop = function updateScrollTop() {
+    var _this2 = this;
+
+    var value = this.props.value;
+    if (!this.element) return;
+    if (typeof this.props.step === 'number' && this.props.step > 0 && value % this.props.step) return;
+
+    if (this.element.scrollTop !== lineHeight * value) {
+      setTimeout(function () {
+        if (_this2.element) _this2.scrollToValue();
+      });
+    }
+  };
+
+  _proto.scrollToValue = function scrollToValue() {
+    var value = this.props.value;
+    this.element.scrollTop = lineHeight * this.getValue(value);
+  };
+
+  _proto.handleClick = function handleClick(value) {
+    this.props.onChange(value);
+    this.element.scrollTop = lineHeight * this.getValue(value);
+  };
+
+  _proto.handleMouseLeave = function handleMouseLeave() {
+    var value = Math.round(this.element.scrollTop / lineHeight);
+    this.element.scrollTop = lineHeight * value;
+  };
+
+  _proto.handleScroll = function handleScroll() {
+    var _this$props2 = this.props,
+        step = _this$props2.step,
+        ampm = _this$props2.ampm;
+    var value = Math.round(this.element.scrollTop / lineHeight);
+    if (value * step === this.props.value) return;
+
+    if (typeof step === 'number' && step > 0 && !ampm && value !== this.props.value) {
+      this.props.onChange(value * step);
+      return;
+    }
+
+    if (value !== this.props.value) this.props.onChange(value);
+  };
+
+  _proto.renderItem = function renderItem(num) {
+    var _this$props3 = this.props,
+        ampm = _this$props3.ampm,
+        _this$props3$total = _this$props3.total,
+        total = _this$props3$total === void 0 ? DefaultValue.total : _this$props3$total,
+        value = _this$props3.value,
+        step = _this$props3.step,
+        mode = _this$props3.mode,
+        min = _this$props3.min,
+        max = _this$props3.max,
+        ra = _this$props3.range,
+        current = _this$props3.current,
+        disabled = _this$props3.disabled,
+        disabledTime = _this$props3.disabledTime;
+    if (typeof step === 'number' && step <= 0) return null;
+    if (!ampm && typeof step === 'number' && num % step !== 0) return null;
+    var text = num;
+    if (ampm) text = ['am', 'pm'][num];else if (total === 12 && num === 0) text = '12';else if (num < 10) text = "0" + num;
+
+    var _paramUtils$judgeTime = paramUtils.judgeTimeByRange(num, current, mode, min, max, ra, disabled, disabledTime, this.getOptions()),
+        isDisabled = _paramUtils$judgeTime[0];
+
+    var className = datepickerClass(!isDisabled && value === num && 'time-active');
+    return React.createElement("span", {
+      key: num,
+      className: className,
+      style: this.getItemStyle(num, isDisabled),
+      onClick: this.handleClick.bind(this, num)
+    }, text);
+  };
+
+  _proto.render = function render() {
+    var _this3 = this;
+
+    var total = this.props.total;
+    return React.createElement("div", {
+      ref: this.bindElement,
+      className: datepickerClass('time-list'),
+      onMouseLeave: this.handleMouseLeave,
+      onScroll: this.handleScroll
+    }, React.createElement("div", {
+      className: datepickerClass('pad')
+    }), range(total, 0).map(function (v) {
+      return _this3.renderItem(v);
+    }), React.createElement("div", {
+      className: datepickerClass('pad')
+    }));
+  };
+
+  return TimeScroll;
+}(PureComponent);
+
+_defineProperty(TimeScroll, "defaultProps", DefaultValue);
+
+TimeScroll.defaultProps = {
+  total: 60
+};
+export default TimeScroll;

package/esm/DatePicker/Year.d.ts

@@ -0,0 +1,17 @@
+import { PureComponent } from 'react';
+import { UnionPannelProps } from './Props';
+declare class Year extends PureComponent<UnionPannelProps> {
+    handlePrevRange: () => void;
+    handleNextRange: () => void;
+    constructor(props: UnionPannelProps);
+    getOptions(): {
+        timeZone: string | undefined;
+        weekStartsOn: any;
+    };
+    handleChange(year: number): void;
+    handleRangeChange(year: number): void;
+    handleDisabled(date: Date): boolean | undefined;
+    renderYear(y: number): JSX.Element;
+    render(): JSX.Element;
+}
+export default Year;