import { jsx } from "react/jsx-runtime";
import React from "react";
import { DSInputText } from "@elliemae/ds-controlled-form";
import {
  Controller,
  useFormContext
} from "react-hook-form";
const MaskedInputText = ({
  name,
  defaultValue = "",
  rules = {},
  useMask,
  maskOpts,
  ...rest
}) => {
  const [, setVal] = React.useState(defaultValue);
  const { setValue } = useFormContext();
  const opts = React.useMemo(
    () => ({
      ...maskOpts,
      onChange: ((_, maskedValue) => setValue(name, maskedValue, {
        shouldValidate: true,
        shouldDirty: true,
        shouldTouch: true
      })),
      valueSetter: setVal
    }),
    [maskOpts, name, setValue]
  );
  const inputProps = useMask(opts);
  return /* @__PURE__ */ jsx(
    Controller,
    {
      name,
      defaultValue,
      rules,
      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ jsx(DSInputText, { hasError: !!error, ...rest, ...field, ...inputProps })
    }
  );
};
export {
  MaskedInputText
};
