@marvalt/madapter 2.1.0 → 2.2.1

package/dist/index.cjs

@@ -2346,13 +2346,93 @@ const useMauticRemoveFromSegment = () => {
     });
 };
 
+const TurnstileWidget = ({ siteKey, onSuccess, onError, onExpire, theme = 'auto', size = 'normal', tabIndex, }) => {
+    const widgetRef = React.useRef(null);
+    const widgetId = React.useRef(null);
+    const scriptLoaded = React.useRef(false);
+    React.useEffect(() => {
+        if (!widgetRef.current || !siteKey)
+            return;
+        const loadTurnstile = () => {
+            if (window.turnstile && widgetRef.current && !widgetId.current) {
+                try {
+                    widgetId.current = window.turnstile.render(widgetRef.current, {
+                        sitekey: siteKey,
+                        callback: onSuccess,
+                        'error-callback': onError,
+                        'expired-callback': onExpire,
+                        theme,
+                        size,
+                        tabindex: tabIndex,
+                    });
+                }
+                catch (error) {
+                    console.error('Failed to render Turnstile widget:', error);
+                    onError?.();
+                }
+            }
+        };
+        // Check if Turnstile is already loaded
+        if (window.turnstile) {
+            loadTurnstile();
+        }
+        else if (!scriptLoaded.current) {
+            // Load Turnstile script
+            scriptLoaded.current = true;
+            const script = document.createElement('script');
+            script.src = 'https://challenges.cloudflare.com/turnstile/v0/api.js';
+            script.async = true;
+            script.defer = true;
+            script.onload = loadTurnstile;
+            script.onerror = () => {
+                console.error('Failed to load Turnstile script');
+                onError?.();
+            };
+            document.head.appendChild(script);
+        }
+        return () => {
+            if (widgetId.current && window.turnstile) {
+                try {
+                    window.turnstile.remove(widgetId.current);
+                }
+                catch (error) {
+                    console.error('Failed to remove Turnstile widget:', error);
+                }
+                widgetId.current = null;
+            }
+        };
+    }, [siteKey, onSuccess, onError, onExpire, theme, size, tabIndex]);
+    return jsxRuntimeExports.jsx("div", { ref: widgetRef, className: "cf-turnstile" });
+};
+
 const MauticForm = ({ formId, title, description, className = '', form, onSubmit, onSuccess, onError, }) => {
     const [formData, setFormData] = React.useState({});
     const [errors, setErrors] = React.useState({});
     const [isSubmitting, setIsSubmitting] = React.useState(false);
     const [isSubmitted, setIsSubmitted] = React.useState(false);
     const [showSuccessMessage, setShowSuccessMessage] = React.useState(false);
+    const [turnstileToken, setTurnstileToken] = React.useState(null);
     const submitMutation = useMauticFormSubmission();
+    // Get Turnstile site key from environment
+    const getTurnstilesiteKey = () => {
+        // Check for Vite environment (browser)
+        if (typeof window !== 'undefined' && window.import?.meta?.env) {
+            return window.import.meta.env.VITE_TURNSTILE_SITE_KEY;
+        }
+        // Check for direct import.meta (Vite)
+        try {
+            // @ts-ignore - import.meta is a Vite-specific global
+            if (typeof ({ url: (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('index.cjs', document.baseURI).href)) }) !== 'undefined' && undefined) {
+                // @ts-ignore
+                return undefined.VITE_TURNSTILE_SITE_KEY;
+            }
+        }
+        catch (e) {
+            // import.meta not available
+        }
+        return undefined;
+    };
+    const turnstilesiteKey = getTurnstilesiteKey();
     React.useEffect(() => {
         if (!form) {
             console.warn(`Form ${formId} not found`);
@@ -2411,6 +2491,11 @@ const MauticForm = ({ formId, title, description, className = '', form, onSubmit
         if (!validateForm()) {
             return;
         }
+        // Check Turnstile token if enabled
+        if (turnstilesiteKey && !turnstileToken) {
+            setErrors(prev => ({ ...prev, _turnstile: 'Please complete the verification' }));
+            return;
+        }
         setIsSubmitting(true);
         setErrors({});
         try {
@@ -2426,7 +2511,12 @@ const MauticForm = ({ formId, title, description, className = '', form, onSubmit
                 formId: parseInt(formId),
                 fields: formData,
                 returnUrl: window.location.href,
-                ...(derivedFormName ? { formName: derivedFormName } : {})
+                ...(derivedFormName ? { formName: derivedFormName } : {}),
+                ...(turnstileToken ? {
+                    headers: {
+                        'cf-turnstile-response': turnstileToken
+                    }
+                } : {})
             };
             // Call custom onSubmit if provided
             if (onSubmit) {
@@ -2515,7 +2605,23 @@ const MauticForm = ({ formId, title, description, className = '', form, onSubmit
     return (jsxRuntimeExports.jsxs("form", { className: `mautic-form ${className}`, onSubmit: handleSubmit, children: [(title || form.name) && (jsxRuntimeExports.jsxs("div", { className: "form-header", children: [jsxRuntimeExports.jsx("h3", { children: title || form.name }), (description || form.description) && (jsxRuntimeExports.jsx("p", { className: "form-description", children: description || form.description }))] })), jsxRuntimeExports.jsx("div", { className: "form-fields", children: form.fields
                     // Filter out button/submit from field group; render them in actions
                     .filter((field) => field.type !== 'button' && field.alias !== 'submit')
-                    .map((field) => (jsxRuntimeExports.jsxs("div", { className: `form-field form-field-${field.type}`, children: [field.showLabel !== false && (jsxRuntimeExports.jsxs("label", { htmlFor: field.alias, className: "field-label", children: [field.label, field.isRequired && jsxRuntimeExports.jsx("span", { className: "required", children: "*" })] })), renderField(field), field.properties?.helpText && (jsxRuntimeExports.jsx("p", { className: "field-help", children: field.properties.helpText })), errors[field.alias] && (jsxRuntimeExports.jsx("p", { className: "field-error", children: errors[field.alias] }))] }, field.id))) }), jsxRuntimeExports.jsx("div", { className: "form-actions", children: jsxRuntimeExports.jsx("button", { type: "submit", disabled: isSubmitting, className: "submit-button", children: isSubmitting ? 'Submitting...' : 'Submit' }) }), submitMutation.error && (jsxRuntimeExports.jsx("div", { className: "form-error", children: jsxRuntimeExports.jsx("p", { children: "There was an error submitting the form. Please try again." }) }))] }));
+                    .map((field) => (jsxRuntimeExports.jsxs("div", { className: `form-field form-field-${field.type}`, children: [field.showLabel !== false && (jsxRuntimeExports.jsxs("label", { htmlFor: field.alias, className: "field-label", children: [field.label, field.isRequired && jsxRuntimeExports.jsx("span", { className: "required", children: "*" })] })), renderField(field), field.properties?.helpText && (jsxRuntimeExports.jsx("p", { className: "field-help", children: field.properties.helpText })), errors[field.alias] && (jsxRuntimeExports.jsx("p", { className: "field-error", children: errors[field.alias] }))] }, field.id))) }), turnstilesiteKey && (jsxRuntimeExports.jsxs("div", { className: "form-turnstile", children: [jsxRuntimeExports.jsx(TurnstileWidget, { siteKey: turnstilesiteKey, onSuccess: (token) => {
+                            setTurnstileToken(token);
+                            // Clear any turnstile error
+                            if (errors._turnstile) {
+                                setErrors(prev => {
+                                    const next = { ...prev };
+                                    delete next._turnstile;
+                                    return next;
+                                });
+                            }
+                        }, onError: () => {
+                            setTurnstileToken(null);
+                            setErrors(prev => ({ ...prev, _turnstile: 'Verification failed. Please try again.' }));
+                        }, onExpire: () => {
+                            setTurnstileToken(null);
+                            setErrors(prev => ({ ...prev, _turnstile: 'Verification expired. Please verify again.' }));
+                        }, theme: "auto", size: "normal" }), errors._turnstile && (jsxRuntimeExports.jsx("p", { className: "field-error turnstile-error", children: errors._turnstile }))] })), jsxRuntimeExports.jsx("div", { className: "form-actions", children: jsxRuntimeExports.jsx("button", { type: "submit", disabled: isSubmitting || (!!turnstilesiteKey && !turnstileToken), className: "submit-button", children: isSubmitting ? 'Submitting...' : 'Submit' }) }), submitMutation.error && (jsxRuntimeExports.jsx("div", { className: "form-error", children: jsxRuntimeExports.jsx("p", { children: "There was an error submitting the form. Please try again." }) }))] }));
 };
 
 const MauticTracking = ({ enabled, mauticUrl, proxyUrl, children }) => {
@@ -3076,6 +3182,7 @@ exports.MauticGenerator = MauticGenerator;
 exports.MauticProvider = MauticProvider;
 exports.MauticService = MauticService;
 exports.MauticTracking = MauticTracking;
+exports.TurnstileWidget = TurnstileWidget;
 exports.createMauticConfig = createMauticConfig;
 exports.formatFormDataForSubmission = formatFormDataForSubmission;
 exports.generateMauticData = generateMauticData;