import React__default, { useRef, useState, useImperativeHandle, useEffect } from "react";
import cs from "../_util/classNames.js";
import omit from "../_util/omit.js";
import ResizeObserver from "../_util/resizeObserver.js";
import IconClose from "../../icon/react-icon/IconClose/index.js";
import IconHover from "../_class/icon-hover.js";
import { isObject } from "../_util/is.js";
import useComposition from "./useComposition.js";
import { jsxs, Fragment, jsx } from "../../../../../../@emotion_react@11.10.4_3toe27fv7etiytxb5kxc7fxaw4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
var __assign = globalThis && globalThis.__assign || function() {
  __assign = Object.assign || function(t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
      s = arguments[i];
      for (var p in s)
        if (Object.prototype.hasOwnProperty.call(s, p))
          t[p] = s[p];
    }
    return t;
  };
  return __assign.apply(this, arguments);
};
var __rest = globalThis && globalThis.__rest || function(s, e) {
  var t = {};
  for (var p in s)
    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
      t[p] = s[p];
  if (s != null && typeof Object.getOwnPropertySymbols === "function")
    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
      if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
        t[p[i]] = s[p[i]];
    }
  return t;
};
var __read = globalThis && globalThis.__read || function(o, n) {
  var m = typeof Symbol === "function" && o[Symbol.iterator];
  if (!m)
    return o;
  var i = m.call(o), r, ar = [], e;
  try {
    while ((n === void 0 || n-- > 0) && !(r = i.next()).done)
      ar.push(r.value);
  } catch (error) {
    e = {
      error
    };
  } finally {
    try {
      if (r && !r.done && (m = i["return"]))
        m.call(i);
    } finally {
      if (e)
        throw e.error;
    }
  }
  return ar;
};
var InputComponent = React__default.forwardRef(function(props, ref) {
  var _a;
  var allowClear = props.allowClear, error = props.error, disabled = props.disabled, placeholder = props.placeholder, className = props.className, style = props.style, height = props.height, prefixCls = props.prefixCls, hasParent = props.hasParent, size = props.size, value = props.value, autoFitWidth = props.autoFitWidth, onClear = props.onClear, readOnly = props.readOnly, onChange = props.onChange, onKeyDown = props.onKeyDown, onPressEnter = props.onPressEnter, propMaxLength = props.maxLength, rest = __rest(props, ["allowClear", "error", "disabled", "placeholder", "className", "style", "height", "prefixCls", "hasParent", "size", "value", "autoFitWidth", "onClear", "readOnly", "onChange", "onKeyDown", "onPressEnter", "maxLength"]);
  var otherProps = omit(rest, ["showWordLimit", "className", "defaultValue", "addBefore", "addAfter", "afterStyle", "beforeStyle", "prefix", "suffix"]);
  var refInput = useRef();
  var refInputMirror = useRef();
  var refPrevInputWidth = useRef(null);
  var _b = __read(useState(null), 2), inputElementWidth = _b[0], setInputElementWidth = _b[1];
  var maxLength = isObject(propMaxLength) ? propMaxLength.errorOnly ? void 0 : propMaxLength.length : propMaxLength;
  var _c = useComposition({
    value,
    maxLength,
    onChange,
    onKeyDown,
    onPressEnter
  }), compositionValue = _c.compositionValue, valueChangeHandler = _c.valueChangeHandler, compositionHandler = _c.compositionHandler, keyDownHandler = _c.keyDownHandler, triggerValueChangeCallback = _c.triggerValueChangeCallback;
  var inputClassNames = cs(prefixCls, prefixCls && (_a = {}, _a[prefixCls + "-size-" + size] = size, _a[prefixCls + "-error"] = error, _a[prefixCls + "-disabled"] = disabled, _a), hasParent ? void 0 : className);
  var inputProps = __assign(__assign({
    "aria-invalid": error
  }, otherProps), {
    readOnly,
    maxLength,
    disabled,
    placeholder,
    value: compositionValue || value || "",
    className: inputClassNames,
    onKeyDown: keyDownHandler,
    onChange: valueChangeHandler,
    onCompositionStart: compositionHandler,
    onCompositionUpdate: compositionHandler,
    onCompositionEnd: compositionHandler
  });
  useImperativeHandle(ref, function() {
    return {
      dom: refInput.current,
      focus: function() {
        refInput.current && refInput.current.focus && refInput.current.focus();
      },
      blur: function() {
        refInput.current && refInput.current.blur && refInput.current.blur();
      }
    };
  }, []);
  var updateInputWidth = function() {
    if (refInputMirror.current && refInput.current) {
      if (!inputProps.value && placeholder) {
        setInputElementWidth(null);
      } else {
        var width = refInputMirror.current.offsetWidth;
        setInputElementWidth(width + (width ? 8 : 4));
      }
    }
  };
  useEffect(function() {
    return autoFitWidth && updateInputWidth();
  }, []);
  var mirrorValue = inputProps.value || placeholder;
  return /* @__PURE__ */ jsxs(Fragment, {
    children: [allowClear ? /* @__PURE__ */ jsxs(Fragment, {
      children: [/* @__PURE__ */ jsx("input", {
        ...__assign({
          ref: refInput
        }, inputProps)
      }), !readOnly && !disabled && allowClear && value ? /* @__PURE__ */ jsx(IconHover, {
        className: prefixCls + "-clear-icon",
        onClick: function(e) {
          e.stopPropagation();
          if (refInput.current && refInput.current.focus) {
            refInput.current.focus();
          }
          triggerValueChangeCallback("", e);
          onClear && onClear();
        },
        children: /* @__PURE__ */ jsx(IconClose, {
          onMouseDown: function(e) {
            e.preventDefault();
          }
        })
      }) : null]
    }) : /* @__PURE__ */ jsx("input", {
      ...__assign({
        ref: refInput
      }, inputProps, {
        style: hasParent ? {} : __assign(__assign(__assign({}, style), "height" in props ? {
          height
        } : {}), typeof inputElementWidth === "number" ? {
          width: inputElementWidth
        } : {})
      })
    }), autoFitWidth && /* @__PURE__ */ jsx(ResizeObserver, {
      onResize: function() {
        var inputWidth = refInputMirror.current.offsetWidth;
        if (typeof autoFitWidth === "object") {
          var delay = typeof autoFitWidth.delay === "function" ? autoFitWidth.delay(inputWidth, refPrevInputWidth.current) : autoFitWidth.delay;
          delay ? setTimeout(updateInputWidth, delay) : updateInputWidth();
        } else {
          updateInputWidth();
        }
        refPrevInputWidth.current = inputWidth;
      },
      children: /* @__PURE__ */ jsx("span", {
        className: prefixCls + "-mirror",
        ref: refInputMirror,
        children: mirrorValue && mirrorValue.replace(/\s/g, "\xA0")
      })
    })]
  });
});
InputComponent.displayName = "InputComponent";
const InputComponent$1 = InputComponent;
export {
  InputComponent$1 as default
};
//# sourceMappingURL=input-element.js.map
