import { jsxs, jsx } from "react/jsx-runtime";
import DOMPurify from "dompurify";
import { useRef, useState, useEffect } from "react";
import { IconAlertCircle } from "../../icons/index.mjs";
/* empty css                                                                                                                                                                                       */
/* empty css                                                                                                                                                                                        */
/* empty css                                                                                                                                                                                                */
/* empty css                                                                                                                                                                                           */
/* empty css                                                                                                                                                                                           */
import { Alert } from "../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Alert/Alert.mjs";
const FormErrorMessage = ({
  message,
  onDismiss,
  autoScroll,
  closable = false,
  ...rest
}) => {
  const bottomRef = useRef(null);
  const [show, setShow] = useState(true);
  useEffect(() => {
    var _a;
    if (!autoScroll) return;
    (_a = bottomRef.current) == null ? void 0 : _a.scrollIntoView({ behavior: "smooth" });
  }, [autoScroll, message]);
  useEffect(() => {
    setShow(true);
  }, [message]);
  if (!message || !show) {
    return null;
  }
  return /* @__PURE__ */ jsxs(
    Alert,
    {
      withCloseButton: Boolean(onDismiss) || closable,
      color: "red",
      icon: /* @__PURE__ */ jsx(IconAlertCircle, {}),
      onClose: () => {
        setShow(false);
        onDismiss == null ? void 0 : onDismiss();
      },
      ...rest,
      children: [
        /* @__PURE__ */ jsx("div", { dangerouslySetInnerHTML: { __html: DOMPurify.sanitize(message) } }),
        /* @__PURE__ */ jsx("div", { ref: bottomRef })
      ]
    }
  );
};
FormErrorMessage.displayName = "HookFormErrorMessage";
export {
  FormErrorMessage
};
