qt-public-ui/es/CompatibleAntd3/time-picker/index.js

新设计规范下业务组件库

import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
import _extends from "@babel/runtime/helpers/esm/extends";
import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
var _excluded = ["getPopupContainer", "prefixCls", "className", "addon", "placeholder"];
/* eslint-disable */
import * as React from 'react';
import * as moment from 'moment';
import omit from 'omit.js';
import { polyfill } from 'react-lifecycles-compat';
import RcTimePicker from 'rc-time-picker/lib/TimePicker';
import classNames from 'classnames';
import warning from '../_util/warning';
import LocaleReceiver from '../locale-provider/LocaleReceiver';
import { ConfigConsumer } from '../config-provider/context';
import enUS from './locale/en_US';
import interopDefault from '../_util/interopDefault';
import Icon from '../../Icon';
export function generateShowHourMinuteSecond(format) {
  // Ref: http://momentjs.com/docs/#/parsing/string-format/
  return {
    showHour: format.indexOf('H') > -1 || format.indexOf('h') > -1 || format.indexOf('k') > -1,
    showMinute: format.indexOf('m') > -1,
    showSecond: format.indexOf('s') > -1
  };
}
var TimePicker = /*#__PURE__*/function (_React$Component) {
  function TimePicker(_props) {
    var _this;
    _this = _React$Component.call(this, _props) || this;
    _this.timePickerRef = void 0;
    _this.getDefaultLocale = function () {
      var defaultLocale = _extends({}, enUS, _this.props.locale);
      return defaultLocale;
    };
    _this.handleOpenClose = function (_ref) {
      var open = _ref.open;
      var onOpenChange = _this.props.onOpenChange;
      if (onOpenChange) {
        onOpenChange(open);
      }
    };
    _this.saveTimePicker = function (timePickerRef) {
      _this.timePickerRef = timePickerRef;
    };
    _this.handleChange = function (value) {
      if (!('value' in _this.props)) {
        _this.setState({
          value: value
        });
      }
      var _this$props = _this.props,
        onChange = _this$props.onChange,
        _this$props$format = _this$props.format,
        format = _this$props$format === void 0 ? 'HH:mm:ss' : _this$props$format;
      if (onChange) {
        onChange(value, value && value.format(format) || '');
      }
    };
    _this.renderTimePicker = function (locale) {
      return /*#__PURE__*/React.createElement(ConfigConsumer, null, function (_ref2) {
        var _classNames;
        var getContextPopupContainer = _ref2.getPopupContainer,
          getPrefixCls = _ref2.getPrefixCls;
        var _this$props2 = _this.props,
          getPopupContainer = _this$props2.getPopupContainer,
          customizePrefixCls = _this$props2.prefixCls,
          className = _this$props2.className,
          addon = _this$props2.addon,
          placeholder = _this$props2.placeholder,
          props = _objectWithoutPropertiesLoose(_this$props2, _excluded);
        var size = props.size;
        var pickerProps = omit(props, ['defaultValue', 'suffixIcon', 'allowEmpty', 'allowClear']);
        var format = _this.getDefaultFormat();
        var prefixCls = getPrefixCls('time-picker', customizePrefixCls);
        var pickerClassName = classNames(className, (_classNames = {}, _classNames[prefixCls + "-" + size] = !!size, _classNames));
        var pickerAddon = function pickerAddon(panel) {
          return addon ? /*#__PURE__*/React.createElement("div", {
            className: prefixCls + "-panel-addon"
          }, addon(panel)) : null;
        };
        return /*#__PURE__*/React.createElement(RcTimePicker, _extends({}, generateShowHourMinuteSecond(format), pickerProps, {
          allowEmpty: _this.getAllowClear(),
          prefixCls: prefixCls,
          getPopupContainer: getPopupContainer || getContextPopupContainer,
          ref: _this.saveTimePicker,
          format: format,
          className: pickerClassName,
          value: _this.state.value,
          placeholder: placeholder === undefined ? locale.placeholder : placeholder,
          onChange: _this.handleChange,
          onOpen: _this.handleOpenClose,
          onClose: _this.handleOpenClose,
          addon: pickerAddon,
          inputIcon: _this.renderInputIcon(prefixCls),
          clearIcon: _this.renderClearIcon(prefixCls)
        }));
      });
    };
    var _value = _props.value || _props.defaultValue;
    if (_value && !interopDefault(moment).isMoment(_value)) {
      throw new Error('The value/defaultValue of TimePicker must be a moment object after `antd@2.0`, ' + 'see: https://u.ant.design/time-picker-value');
    }
    _this.state = {
      value: _value
    };
    warning(!('allowEmpty' in _props), 'TimePicker', '`allowEmpty` is deprecated. Please use `allowClear` instead.');
    return _this;
  }
  _inheritsLoose(TimePicker, _React$Component);
  TimePicker.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps) {
    if ('value' in nextProps) {
      return {
        value: nextProps.value
      };
    }
    return null;
  };
  var _proto = TimePicker.prototype;
  _proto.getDefaultFormat = function getDefaultFormat() {
    var _this$props3 = this.props,
      format = _this$props3.format,
      use12Hours = _this$props3.use12Hours;
    if (format) {
      return format;
    }
    if (use12Hours) {
      return 'h:mm:ss a';
    }
    return 'HH:mm:ss';
  };
  _proto.getAllowClear = function getAllowClear() {
    var _this$props4 = this.props,
      allowClear = _this$props4.allowClear,
      allowEmpty = _this$props4.allowEmpty;
    if ('allowClear' in this.props) {
      return allowClear;
    }
    return allowEmpty;
  };
  _proto.focus = function focus() {
    this.timePickerRef.focus();
  };
  _proto.blur = function blur() {
    this.timePickerRef.blur();
  };
  _proto.renderInputIcon = function renderInputIcon(prefixCls) {
    var suffixIcon = this.props.suffixIcon;
    var clockIcon = suffixIcon && React.isValidElement(suffixIcon) && React.cloneElement(suffixIcon, {
      className: classNames(suffixIcon.props.className, prefixCls + "-clock-icon")
    }) || /*#__PURE__*/React.createElement(Icon, {
      type: "clock-circle",
      className: prefixCls + "-clock-icon"
    });
    return /*#__PURE__*/React.createElement("span", {
      className: prefixCls + "-icon"
    }, clockIcon);
  };
  _proto.renderClearIcon = function renderClearIcon(prefixCls) {
    var clearIcon = this.props.clearIcon;
    var clearIconPrefixCls = prefixCls + "-clear";
    if (clearIcon && React.isValidElement(clearIcon)) {
      return React.cloneElement(clearIcon, {
        className: classNames(clearIcon.props.className, clearIconPrefixCls)
      });
    }
    return /*#__PURE__*/React.createElement(Icon, {
      type: "close-circle",
      className: clearIconPrefixCls,
      theme: "filled"
    });
  };
  _proto.render = function render() {
    return /*#__PURE__*/React.createElement(LocaleReceiver, {
      componentName: "TimePicker",
      defaultLocale: this.getDefaultLocale()
    }, this.renderTimePicker);
  };
  return TimePicker;
}(React.Component);
TimePicker.defaultProps = {
  align: {
    offset: [0, -2]
  },
  disabledHours: undefined,
  disabledMinutes: undefined,
  disabledSeconds: undefined,
  hideDisabledOptions: false,
  placement: 'bottomLeft',
  transitionName: 'slide-up',
  focusOnOpen: true
};
polyfill(TimePicker);
export default TimePicker;