'use strict';

exports.__esModule = true;

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

var InputText = (0, _react.forwardRef)(function (_ref, ref) {
  var _ref$type = _ref.type,
      type = _ref$type === undefined ? 'text' : _ref$type,
      pre = _ref.pre,
      readOnly = _ref.readOnly,
      disabled = _ref.disabled,
      _ref$inputAttribute = _ref.inputAttribute,
      inputAttribute = _ref$inputAttribute === undefined ? {} : _ref$inputAttribute,
      defaultValue = _ref.defaultValue,
      value = _ref.value,
      digits = _ref.digits,
      max = _ref.max,
      min = _ref.min,
      placeholder = _ref.placeholder,
      maxLength = _ref.maxLength,
      autoFocus = _ref.autoFocus,
      autoSelect = _ref.autoSelect,
      licon = _ref.licon,
      liconAttribute = _ref.liconAttribute,
      ricon = _ref.ricon,
      riconAttribute = _ref.riconAttribute,
      clear = _ref.clear,
      clearAttribute = _ref.clearAttribute,
      rcaption = _ref.rcaption,
      children = _ref.children,
      onClick = _ref.onClick,
      onCompositionStart = _ref.onCompositionStart,
      onCompositionUpdate = _ref.onCompositionUpdate,
      onCompositionEnd = _ref.onCompositionEnd,
      onInput = _ref.onInput,
      onChange = _ref.onChange,
      onBlur = _ref.onBlur,
      onFocus = _ref.onFocus,
      others = _objectWithoutProperties(_ref, ['type', 'pre', 'readOnly', 'disabled', 'inputAttribute', 'defaultValue', 'value', 'digits', 'max', 'min', 'placeholder', 'maxLength', 'autoFocus', 'autoSelect', 'licon', 'liconAttribute', 'ricon', 'riconAttribute', 'clear', 'clearAttribute', 'rcaption', 'children', 'onClick', 'onCompositionStart', 'onCompositionUpdate', 'onCompositionEnd', 'onInput', 'onChange', 'onBlur', 'onFocus']);

  var refEl = (0, _react.useRef)(null);
  var refElInput = (0, _react.useRef)(null);
  var refElPre = (0, _react.useRef)(null);
  (0, _react.useImperativeHandle)(ref, function () {
    return refEl.current;
  });

  var _useState = (0, _react.useState)(false),
      clearShow = _useState[0],
      setClearShow = _useState[1];

  (0, _react.useEffect)(function () {
    var val = refElInput.current.value;
    // 更新清除按钮和自适应的高度
    updateClear(val);
    preAutoSize(val);
    // 自动获取焦点
    if (autoFocus) {
      focus();
    }
  }, []); // eslint-disable-line

  // 更新清空按钮
  (0, _react.useEffect)(function () {
    if (refElInput.current) {
      updateClear(refElInput.current.value);
      preAutoSize(refElInput.current.value);
    }
  }, [value]); // eslint-disable-line

  // 更新清除按钮
  function updateClear(val) {
    if (typeof val === 'number') {
      val = String(val);
    }
    if (val) {
      setClearShow(true);
    } else {
      setClearShow(false);
    }
  }
  // 自动扩充功能
  function preAutoSize(val) {
    if (!pre) return;
    refElPre.current.children[0].innerText = val;
    refElInput.current.style.height = refElPre.current.clientHeight + 'px';
  }
  // 校验maxLength和max、min
  function correctNumber(originVal) {
    var val = originVal;
    if (typeof val === 'number') val = String(val);
    // 最大长度
    if (maxLength && val && val.length > maxLength) {
      val = val.substring(0, maxLength);
    }
    // 小数位截取
    if (!isNaN(digits)) {
      if (val.indexOf('.') !== -1) {
        val = val.substring(0, val.indexOf('.') + Number(digits) + 1);
      }
    }
    // 输入时只校验最大值、小数点、最大长度、返回错误
    if (!isNaN(max) && !isNaN(val)) {
      if (val > max) val = max;
    }
    if (!isNaN(min) && !isNaN(val)) {
      if (val < min) val = min;
    }
    return val;
  }
  // 点击加减号清除时获取焦点
  function focus() {
    if (disabled || readOnly || !refElInput.current) return;
    refElInput.current.focus();
    if (autoSelect) refElInput.current.select();
  }
  // 清空按钮控制
  function inputHandler(event) {
    var e = event.nativeEvent;
    // 修改值时有渲染延迟, 更新清空按钮和自适应的高度
    setTimeout(function () {
      updateClear(e.target.value);
      preAutoSize(e.target.value);
    }, 100);
    // Callback
    if (onInput) onInput(e, e.target.value);
  }
  // 修改值回调
  function changeHandler(e, value, callback) {
    var target = e.target;
    var val = typeof value === 'string' || typeof value === 'number' ? value : target.value;
    // 校验maxLength和max、min
    if (val !== '') {
      val = correctNumber(target.value);
    }
    if (callback) {
      callback(e, val);
    }
  }

  // 点击容器
  function clickHandler(e) {
    var elInput = refElInput.current;
    if (!elInput) return;
    if (disabled) return;
    var target = e.target;
    if (target.classList.contains('clearicon')) {
      clickClear(e);
      e.stopPropagation();
      return;
    }
    if (target.classList.contains('licon') && liconAttribute && liconAttribute.onClick) {
      liconAttribute.onClick(e, elInput.value);
      e.stopPropagation();
      return;
    }
    if (target.classList.contains('ricon') && riconAttribute && riconAttribute.onClick) {
      riconAttribute.onClick(e, elInput.value);
      e.stopPropagation();
      return;
    }
    if (target.classList.contains('input-text') && inputAttribute.onClick) {
      inputAttribute.onClick(e, elInput.value);
      e.stopPropagation();
      return;
    }
    if (onClick) {
      onClick(e, elInput.value);
      e.stopPropagation();
    }
  }
  // 点击清除
  function clickClear(event) {
    focus();
    var e = { target: refElInput.current };
    if (clear && typeof clear === 'function') clear(e, '');
    // Callback
    if (onChange) {
      onChange(e, '');
    } else if (!value) {
      // 有value没有onChange本身就清空不掉, 所以要控制这种情况不允许清空
      e.target.value = '';
    }
    // 修改值时有渲染延迟, 更新清空按钮和自适应的高度
    setTimeout(function () {
      updateClear(e.target.value);
      preAutoSize(e.target.value);
    }, 100);

    event.stopPropagation();
  }
  // render
  function getInputDOM() {
    // 剔除掉onClick事件, 因为在容器onClick已经回调了
    var otherInputAttribute = filterProps(inputAttribute);
    // pre类型
    if (pre) {
      // pre的左右padding
      var preLeft = 0;
      var preRight = 0;
      if (otherInputAttribute.style) {
        if (otherInputAttribute.style.padding) {
          var paddingValues = otherInputAttribute.style.padding.split(' ');
          if (paddingValues.length === 1) {
            preLeft = paddingValues[0];
            preRight = paddingValues[0];
          } else if (paddingValues.length === 2) {
            preLeft = paddingValues[1];
            preRight = paddingValues[1];
          } else if (paddingValues.length === 4) {
            preLeft = paddingValues[1];
            preRight = paddingValues[3];
          }
        } else if (otherInputAttribute.style.paddingLeft || otherInputAttribute.style.paddingRight) {
          preLeft = otherInputAttribute.style.paddingLeft || '0';
          preRight = otherInputAttribute.style.paddingRight || '0';
        }
      }
      return _react2.default.createElement(
        'div',
        _extends({}, otherInputAttribute, { className: 'input-pre-box' + (otherInputAttribute.className ? ' ' + otherInputAttribute.className : '') }),
        _react2.default.createElement('textarea', {
          ref: refElInput,
          autoFocus: autoFocus,
          value: value,
          defaultValue: defaultValue,
          maxLength: maxLength,
          readOnly: readOnly,
          disabled: disabled,
          className: 'input-pre',
          placeholder: placeholder,
          onChange: onChange ? function (e) {
            return changeHandler(e, null, onChange);
          } : null,
          onCompositionStart: onCompositionStart ? function (e) {
            return changeHandler(e, null, onCompositionStart);
          } : null,
          onCompositionUpdate: onCompositionUpdate ? function (e) {
            return changeHandler(e, null, onCompositionUpdate);
          } : null,
          onCompositionEnd: onCompositionEnd ? function (e) {
            return changeHandler(e, null, onCompositionEnd);
          } : null,
          onInput: inputHandler,
          onBlur: onBlur,
          onFocus: onFocus
        }),
        _react2.default.createElement(
          'pre',
          { ref: refElPre, style: { left: preLeft, right: preRight } },
          _react2.default.createElement('span', null)
        )
      );
    }
    // textarea类型
    if (type === 'textarea') {
      // 如果值绑定属性,则只有通过父组件的prop来改变值
      return _react2.default.createElement('textarea', _extends({
        ref: refElInput
      }, otherInputAttribute, {
        autoFocus: autoFocus,
        value: value,
        defaultValue: defaultValue,
        maxLength: maxLength,
        readOnly: readOnly,
        disabled: disabled,
        placeholder: placeholder,
        onChange: onChange ? function (e) {
          return changeHandler(e, null, onChange);
        } : null,
        onCompositionStart: onCompositionStart ? function (e) {
          return changeHandler(e, null, onCompositionStart);
        } : null,
        onCompositionUpdate: onCompositionUpdate ? function (e) {
          return changeHandler(e, null, onCompositionUpdate);
        } : null,
        onCompositionEnd: onCompositionEnd ? function (e) {
          return changeHandler(e, null, onCompositionEnd);
        } : null,
        onInput: inputHandler,
        onBlur: onBlur,
        onFocus: onFocus,
        className: 'input-area' + (otherInputAttribute.className ? ' ' + otherInputAttribute.className : '')
      }));
    }
    // 其它类型
    return _react2.default.createElement('input', _extends({
      ref: refElInput,
      type: type
    }, otherInputAttribute, {
      className: 'input-text' + (otherInputAttribute.className ? ' ' + otherInputAttribute.className : ''),
      defaultValue: defaultValue,
      value: value,
      min: min,
      max: max,
      maxLength: maxLength,
      disabled: disabled,
      readOnly: readOnly,
      placeholder: placeholder,
      onChange: onChange ? function (e) {
        return changeHandler(e, null, onChange);
      } : null,
      onCompositionStart: onCompositionStart ? function (e) {
        return changeHandler(e, null, onCompositionStart);
      } : null,
      onCompositionUpdate: onCompositionUpdate ? function (e) {
        return changeHandler(e, null, onCompositionUpdate);
      } : null,
      onCompositionEnd: onCompositionEnd ? function (e) {
        return changeHandler(e, null, onCompositionEnd);
      } : null,
      onInput: inputHandler,
      autoFocus: autoFocus,
      onBlur: onBlur,
      onFocus: onFocus
    }));
  }

  // 过滤已经回调的属性
  function filterProps(props) {
    if (!props) return {};

    var onClick = props.onClick,
        otherProps = _objectWithoutProperties(props, ['onClick']);

    return _extends({}, otherProps);
  }

  // 剔除掉onClick事件, 因为在容器onClick已经回调了
  var otherLiconAttribute = filterProps(liconAttribute);
  var otherRiconAttribute = filterProps(riconAttribute);
  var otherClearAttribute = filterProps(clearAttribute);
  return _react2.default.createElement(
    'div',
    _extends({ ref: refEl }, others, { className: 'input-text-box' + (others.className ? ' ' + others.className : ''), onClick: clickHandler }),
    licon && licon,
    liconAttribute && _react2.default.createElement('i', _extends({}, otherLiconAttribute, { className: 'licon icon' + (otherLiconAttribute.className ? ' ' + otherLiconAttribute.className : '') })),
    getInputDOM(),
    children && children,
    clearShow && clear && !readOnly && !disabled && _react2.default.createElement('i', _extends({}, otherClearAttribute, { className: 'icon clearicon' + (otherClearAttribute.className ? ' ' + otherClearAttribute.className : ' ricon close-icon-clear size18') })),
    riconAttribute && _react2.default.createElement('i', _extends({}, otherRiconAttribute, { className: 'ricon icon' + (otherRiconAttribute.className ? ' ' + otherRiconAttribute.className : '') })),
    ricon && ricon,
    rcaption && rcaption
  );
});

exports.default = InputText;
module.exports = exports['default'];