import HCaptcha from "@hcaptcha/react-hcaptcha";
import React from "react";
const Captcha = ({ siteKey, resetSignal = 0, error, onTokenChange, onBlur, className, }) => {
    const captchaRef = React.useRef(null);
    const onTokenChangeRef = React.useRef(onTokenChange);
    React.useEffect(() => {
        onTokenChangeRef.current = onTokenChange;
    }, [onTokenChange]);
    const handleTokenChange = React.useCallback((token) => {
        var _a;
        (_a = onTokenChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onTokenChangeRef, token || "");
    }, []);
    React.useEffect(() => {
        var _a;
        (_a = captchaRef.current) === null || _a === void 0 ? void 0 : _a.resetCaptcha();
        handleTokenChange("");
    }, [resetSignal, handleTokenChange]);
    if (!siteKey) {
        return (React.createElement("div", { className: className || "text-center text-sm text-red-500" }, "Captcha is not configured."));
    }
    return (React.createElement("div", { className: className || "flex flex-col items-center gap-2" },
        React.createElement(HCaptcha, { sitekey: siteKey, ref: captchaRef, onVerify: (token) => {
                handleTokenChange(token);
                onBlur === null || onBlur === void 0 ? void 0 : onBlur();
            }, onExpire: () => {
                var _a;
                handleTokenChange(null);
                (_a = captchaRef.current) === null || _a === void 0 ? void 0 : _a.resetCaptcha();
                onBlur === null || onBlur === void 0 ? void 0 : onBlur();
            }, onError: () => {
                handleTokenChange(null);
                onBlur === null || onBlur === void 0 ? void 0 : onBlur();
            } }),
        error && React.createElement("span", { className: "text-sm text-red-500" }, error)));
};
export default Captcha;
//# sourceMappingURL=Captcha.js.map