import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
import React__default, { forwardRef, useRef, useState } from 'react';
import { numericFormatter, NumericFormat } from 'react-number-format';
import { useForkRef } from '../../hooks/useForkRef.js';

var _excluded = ["thousandSeparator", "decimalScale", "decimalSeparator", "disabled", "value", "onChange", "defaultValue", "onPaste"];
var composeNumberFormat = function composeNumberFormat(InputComponent) {
  return /*#__PURE__*/forwardRef(function (_ref, outerRef) {
    var _ref$thousandSeparato = _ref.thousandSeparator,
      thousandSeparator = _ref$thousandSeparato === void 0 ? ' ' : _ref$thousandSeparato,
      _ref$decimalScale = _ref.decimalScale,
      decimalScale = _ref$decimalScale === void 0 ? 3 : _ref$decimalScale,
      _ref$decimalSeparator = _ref.decimalSeparator,
      decimalSeparator = _ref$decimalSeparator === void 0 ? '.' : _ref$decimalSeparator,
      disabled = _ref.disabled,
      outerValue = _ref.value,
      onChange = _ref.onChange,
      defaultValue = _ref.defaultValue,
      onPaste = _ref.onPaste,
      rest = _objectWithoutProperties(_ref, _excluded);
    var inputRef = useRef(null);
    var inputForkRef = useForkRef(inputRef, outerRef);
    var _useState = useState(defaultValue || ''),
      _useState2 = _slicedToArray(_useState, 2),
      innerValue = _useState2[0],
      setInnerValue = _useState2[1];
    var value = numericFormatter(String(outerValue !== null && outerValue !== void 0 ? outerValue : innerValue), {
      thousandSeparator: thousandSeparator,
      decimalScale: decimalScale,
      decimalSeparator: decimalSeparator
    });
    var handleChangeValue = function handleChangeValue(values, sourceInfo) {
      var changeEvent = sourceInfo.event;
      setInnerValue(values.value);
      if (onChange) {
        onChange(changeEvent, values);
      }
    };
    var handlePaste = function handlePaste(event) {
      if (disabled) {
        return;
      }
      if (decimalSeparator !== '.' && inputRef.current) {
        if (!Number.isNaN(Number(event.clipboardData.getData('text/plain')))) {
          event.preventDefault();
          var pastedValue = event.clipboardData.getData('text/plain').replace('.', decimalSeparator);
          var input = event.target;
          var startPos = input.selectionStart || 0;
          var newCursorPos = startPos + pastedValue.length;
          setInnerValue(pastedValue);
          setTimeout(function () {
            var _inputRef$current;
            (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.setSelectionRange(newCursorPos, newCursorPos);
          }, 10);
        }
      }
      if (onPaste) {
        onPaste(event);
      }
    };
    return /*#__PURE__*/React__default.createElement(NumericFormat, _extends({
      value: value,
      disabled: disabled,
      thousandSeparator: thousandSeparator,
      decimalScale: decimalScale,
      decimalSeparator: decimalSeparator,
      customInput: InputComponent,
      getInputRef: inputForkRef,
      _textEllipsisDisable: true,
      onValueChange: handleChangeValue,
      onPaste: handlePaste
    }, rest));
  });
};

export { composeNumberFormat };
