"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const useBindingState = require("../../form/hooks/useBindingState.cjs");
const useSSRLayoutEffect = require("../../hooks/useSSRLayoutEffect.cjs");
const classNames = require("../../utils/classNames.cjs");
require("../../utils/globals.cjs");
require("zod");
const useDebounce = require("../../hooks/useDebounce.cjs");
const useDidUpdateEffect = require("../../hooks/useDidUpdateEffect.cjs");
const radixDialog = require("../../workarounds/radixDialog.cjs");
const config_context = require("../config/config.context.cjs");
const inputWrapper_component = require("../inputWrapper/inputWrapper.component.cjs");
require("./input.theme.css.cjs");
function _interopNamespaceDefault(e) {
  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
  if (e) {
    for (const k in e) {
      if (k !== "default") {
        const d = Object.getOwnPropertyDescriptor(e, k);
        Object.defineProperty(n, k, d.get ? d : {
          enumerable: true,
          get: () => e[k]
        });
      }
    }
  }
  n.default = e;
  return Object.freeze(n);
}
const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
const DebounceInputBase = React__namespace.forwardRef(({ milliseconds, value, onValueChange, onChange, ...nativeProps }, ref) => {
  const [actualValue, setActualValue] = useDebounce.useDebounce(milliseconds, value, onValueChange);
  const onChangeEvent = React__namespace.useCallback((e) => {
    setActualValue(e.currentTarget.value);
    onChange == null ? void 0 : onChange(e);
  }, [setActualValue, onChange]);
  return jsxRuntime.jsx("input", { ref, value: actualValue, onChange: onChangeEvent, ...nativeProps });
});
DebounceInputBase.displayName = "DebounceInput";
const Input = React__namespace.forwardRef(
  ({ bind, onChange, value, className, leftOverlay, rightOverlay, validationErrorMessages, validationMode, errorIcon: validationErrorIcon, pending, disabled, disableOnPending, statusPosition, hideIconOnStatus, onValueChange, scrollValidationErrorsIntoView, delay, validationErrorsClassName, statusClassName, inputClassName, label, required, requiredIndicator, displaySize, labelClassName, labelId, wrapperTestId, error, autoValidate, ...nativeProps }, ref) => {
    const reactId = React__namespace.useId();
    const id = nativeProps.id ?? reactId;
    const [boundValue, setBoundValue, bindConfig] = useBindingState.useBindingState(bind, {
      value: value == null ? void 0 : value.toString(),
      validationErrorMessages,
      validationMode,
      validationErrorIcon,
      autoValidate
    });
    const [internalValue, setInternalValue] = React__namespace.useState(boundValue == null ? void 0 : boundValue.toString());
    useSSRLayoutEffect.useSSRLayoutEffect(() => {
      if ((boundValue == null ? void 0 : boundValue.toString()) !== (internalValue == null ? void 0 : internalValue.toString())) {
        setInternalValue(boundValue == null ? void 0 : boundValue.toString());
      }
    }, [boundValue]);
    const globals = config_context.useArmstrongConfig({
      validationMode: bindConfig.validationMode,
      disableControlOnPending: disableOnPending,
      hideInputErrorIconOnStatus: hideIconOnStatus,
      inputDisplaySize: displaySize,
      inputStatusPosition: statusPosition,
      requiredIndicator,
      validationErrorIcon: bindConfig.validationErrorIcon,
      scrollValidationErrorsIntoView,
      autoValidate: bindConfig.autoValidate
    });
    const parseValue = React__namespace.useCallback((unparsedValue) => {
      if (nativeProps.type !== "number") {
        return unparsedValue;
      }
      if (!unparsedValue) {
        return void 0;
      }
      if (!Number.isNaN(parseFloat(unparsedValue))) {
        return parseFloat(unparsedValue);
      }
      return null;
    }, [nativeProps.type]);
    const onBindValueChange = React__namespace.useCallback((parsedValue) => {
      var _a, _b, _c;
      const formattedValue = ((_c = (_b = (_a = bind == null ? void 0 : bind.bindConfig) == null ? void 0 : _a.format) == null ? void 0 : _b.toData) == null ? void 0 : _c.call(_b, parsedValue)) || parsedValue;
      setBoundValue(formattedValue);
    }, [setBoundValue, bind]);
    const updateValue = React__namespace.useCallback((newValue) => {
      const parsedValue = parseValue(newValue);
      if (parsedValue !== null) {
        onBindValueChange(parsedValue);
        onValueChange == null ? void 0 : onValueChange(parsedValue);
      }
    }, [parseValue, onBindValueChange, onValueChange]);
    const onValueChangeEvent = React__namespace.useCallback((currentValue) => {
      setInternalValue(currentValue);
      updateValue(currentValue);
    }, [updateValue]);
    const onValueChangeRaw = React__namespace.useCallback((event) => {
      onChange == null ? void 0 : onChange(event);
      const newValue = event.currentTarget.value;
      setInternalValue(newValue);
      updateValue(newValue);
    }, [onChange, updateValue]);
    useDidUpdateEffect.useDidUpdateEffect(() => {
      if (globals.autoValidate && bindConfig.isTouched) {
        bindConfig.validate();
      }
    }, [boundValue]);
    const onBlurEvent = React__namespace.useCallback((event) => {
      var _a;
      if (globals.autoValidate && !bindConfig.isTouched) {
        bindConfig.validate();
      }
      bindConfig.setTouched(true);
      radixDialog.onBlurWorkaround(event);
      return (_a = nativeProps.onBlur) == null ? void 0 : _a.call(nativeProps, event);
    }, [bindConfig, globals.autoValidate, nativeProps]);
    const inputProps = {
      id,
      className: classNames.concat("arm-input-base-input", inputClassName),
      /** fallback to an empty string if bind is passed in but bound value is undefined to avoid React warning */
      value: (internalValue == null ? void 0 : internalValue.toString()) ?? (bind && ""),
      disabled,
      ...nativeProps,
      onBlur: onBlurEvent
    };
    return jsxRuntime.jsxs(inputWrapper_component.InputWrapper, { "data-size": globals.inputDisplaySize, className: classNames.concat(className, "arm-input-base"), statusClassName: classNames.concat(statusClassName, "arm-input-base-status"), validationErrorsClassName: classNames.concat(validationErrorsClassName, "arm-input-base-validation"), leftOverlay, rightOverlay, validationErrorMessages: bindConfig.validationErrorMessages, errorIcon: bindConfig.validationErrorIcon, validationMode: bindConfig.validationMode, pending, disabled, statusPosition: globals.inputStatusPosition, scrollValidationErrorsIntoView: globals.scrollValidationErrorsIntoView, disableOnPending: globals.disableControlOnPending, hideIconOnStatus: globals.hideInputErrorIconOnStatus, label, labelId: labelId ?? id, labelClassName: classNames.concat(labelClassName, "arm-input-base-label"), required, error, requiredIndicator: globals.requiredIndicator, "data-testid": wrapperTestId, displaySize: globals.inputDisplaySize, children: [!!delay && jsxRuntime.jsx(DebounceInputBase, { ...nativeProps, ...inputProps, milliseconds: delay, onChange, onValueChange: onValueChangeEvent, ref, "data-size": displaySize }), !delay && jsxRuntime.jsx("input", { ...nativeProps, ...inputProps, onChange: onValueChangeRaw, ref, "data-size": displaySize })] });
  }
  // type assertion to ensure generic works with RefForwarded component
  // DO NOT CHANGE TYPE WITHOUT CHANGING THIS, FIND TYPE BY INSPECTING React.forwardRef
);
Input.displayName = "Input";
exports.Input = Input;
//# sourceMappingURL=input.component.cjs.map
