@marvalt/madapter 1.0.14 → 1.1.0

package/dist/index.esm.js

@@ -1,7 +1,7 @@
-import { useQueryClient, useMutation, useQuery } from '@tanstack/react-query';
 import fs from 'fs';
 import path from 'path';
 import React, { useState, useEffect, createContext, useMemo, useContext } from 'react';
+import { useQueryClient, useMutation, useQuery } from '@tanstack/react-query';
 
 /**
  * @license GPL-3.0-or-later
@@ -21,18 +21,17 @@ import React, { useState, useEffect, createContext, useMemo, useContext } from '
  */
 class MauticClient {
     constructor(config) {
+        this.baseUrl = '';
         this.config = config;
-        if (config.authMode === 'cloudflare_proxy' && config.cloudflareWorkerUrl && config.appId && config.workerSecret) {
+        if (config.authMode === 'cloudflare_proxy' && config.cloudflareWorkerUrl) {
             // Cloudflare Worker proxy (recommended - uses Secrets Store)
             this.proxyUrl = config.cloudflareWorkerUrl;
-            this.appId = config.appId;
-            this.workerSecret = config.workerSecret;
             this.useProxy = true;
             this.isConfigured = true;
         }
         else if (config.authMode === 'direct' && config.apiUrl) {
             // Direct Mautic API access (legacy - for local development only)
-            this.baseUrl = config.apiUrl;
+            this.baseUrl = config.apiUrl || '';
             this.useProxy = false;
             this.isConfigured = true;
         }
@@ -47,17 +46,7 @@ class MauticClient {
             throw new Error('Mautic service not properly configured. Check your configuration.');
         }
     }
-    getAuthHeaders() {
-        if (this.useProxy) {
-            return {
-                'x-app-id': this.appId || '',
-                'x-app-secret': this.workerSecret || '',
-            };
-        }
-        else {
-            return {};
-        }
-    }
+    getAuthHeaders() { return {}; }
     async makeRequest(endpoint, options = {}) {
         this.validateConfiguration();
         let url;
@@ -83,7 +72,7 @@ class MauticClient {
         const isFormSubmission = endpoint.startsWith('/form/submit') ||
             (endpoint.startsWith('/forms/') && endpoint.includes('/submit'));
         const headers = {
-            ...this.getAuthHeaders(),
+            // no app headers in proxy mode
             ...options.headers,
         };
         // Default JSON only for non-form submissions when a body exists and no explicit content-type provided
@@ -316,8 +305,6 @@ const createMauticConfig = (overrides = {}) => {
         authMode: getEnvVar('VITE_AUTH_MODE') || getEnvVar('VITE_MAUTIC_AUTH_MODE') || 'cloudflare_proxy',
         apiUrl: getEnvVar('VITE_MAUTIC_URL'),
         cloudflareWorkerUrl: getEnvVar('VITE_MAUTIC_PROXY_URL'),
-        appId: getEnvVar('VITE_FRONTEND_ID'),
-        workerSecret: getEnvVar('VITE_FRONTEND_SECRET'),
         timeout: parseInt(getEnvVar('VITE_MAUTIC_TIMEOUT') || '30000'),
         retries: parseInt(getEnvVar('VITE_MAUTIC_RETRIES') || '3'),
         ...overrides,
@@ -327,10 +314,6 @@ const createMauticConfig = (overrides = {}) => {
     if (merged.authMode === 'cloudflare_proxy') {
         if (!merged.cloudflareWorkerUrl)
             errors.push('cloudflareWorkerUrl is required for cloudflare_proxy mode');
-        if (!merged.appId)
-            errors.push('appId is required for cloudflare_proxy mode');
-        if (!merged.workerSecret)
-            errors.push('workerSecret is required for cloudflare_proxy mode');
     }
     if (merged.authMode === 'direct') {
         if (!merged.apiUrl)
@@ -353,12 +336,6 @@ const validateMauticConfig = (config) => {
         if (!config.cloudflareWorkerUrl) {
             errors.push('cloudflareWorkerUrl is required for cloudflare_proxy mode');
         }
-        if (!config.appId) {
-            errors.push('appId is required for cloudflare_proxy mode');
-        }
-        if (!config.workerSecret) {
-            errors.push('workerSecret is required for cloudflare_proxy mode');
-        }
     }
     else if (config.authMode === 'direct') {
         if (!config.apiUrl) {
@@ -400,7 +377,7 @@ const mergeMauticConfig = (base, overrides) => {
  */
 const isMauticEnabled = (config) => {
     if (config.authMode === 'cloudflare_proxy') {
-        return !!(config.cloudflareWorkerUrl && config.appId && config.workerSecret);
+        return !!config.cloudflareWorkerUrl;
     }
     else if (config.authMode === 'direct') {
         return !!config.apiUrl;
@@ -415,323 +392,12 @@ const getMauticConfigSummary = (config) => {
         authMode: config.authMode,
         hasApiUrl: !!config.apiUrl,
         hasCloudflareWorkerUrl: !!config.cloudflareWorkerUrl,
-        hasAppId: !!config.appId,
-        hasWorkerSecret: !!config.workerSecret,
         timeout: config.timeout,
         retries: config.retries,
         isEnabled: isMauticEnabled(config),
     };
 };
 
-/**
- * @license GPL-3.0-or-later
- *
- * This file is part of the MarVAlt Open SDK.
- * Copyright (c) 2025 Vibune Pty Ltd.
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
- * See the GNU General Public License for more details.
- */
-// Create a default client instance (will be overridden by provider)
-let defaultClient = null;
-/**
- * Set the default Mautic client for hooks
- */
-const setMauticClient = (client) => {
-    defaultClient = client;
-};
-/**
- * Get the current Mautic client
- */
-const getMauticClient = () => {
-    if (!defaultClient) {
-        // Lazy initialize the client from environment if not set by provider/service
-        const config = createMauticConfig();
-        defaultClient = new MauticClient(config);
-    }
-    return defaultClient;
-};
-/**
- * Custom hook for submitting forms to Mautic
- */
-const useMauticFormSubmission = () => {
-    const queryClient = useQueryClient();
-    return useMutation({
-        mutationFn: (submission) => {
-            const client = getMauticClient();
-            return client.submitForm(submission.formId, submission);
-        },
-        onSuccess: (data, variables) => {
-            if (import.meta.env?.DEV) {
-                console.log('Mautic form submission successful:', data);
-            }
-            // Invalidate related queries
-            queryClient.invalidateQueries({ queryKey: ['mautic-contacts'] });
-            // Track the submission event
-            if (variables.contact?.email) {
-                const client = getMauticClient();
-                client.trackEvent('form_submission', {
-                    formId: variables.formId,
-                    email: variables.contact.email
-                }).catch(console.error);
-            }
-        },
-        onError: (error) => {
-            console.error('Mautic form submission failed:', error);
-        },
-    });
-};
-/**
- * Custom hook for creating Mautic contacts
- */
-const useMauticCreateContact = () => {
-    const queryClient = useQueryClient();
-    return useMutation({
-        mutationFn: (contact) => {
-            const client = getMauticClient();
-            return client.createContact(contact);
-        },
-        onSuccess: (data, variables) => {
-            if (import.meta.env?.DEV) {
-                console.log('Mautic contact created:', data);
-            }
-            // Invalidate contacts queries
-            queryClient.invalidateQueries({ queryKey: ['mautic-contacts'] });
-            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.email] });
-        },
-        onError: (error) => {
-            console.error('Failed to create Mautic contact:', error);
-        },
-    });
-};
-/**
- * Custom hook for updating Mautic contacts
- */
-const useMauticUpdateContact = () => {
-    const queryClient = useQueryClient();
-    return useMutation({
-        mutationFn: ({ contactId, contact }) => {
-            const client = getMauticClient();
-            return client.updateContact(contactId, contact);
-        },
-        onSuccess: (data, variables) => {
-            if (import.meta.env?.DEV) {
-                console.log('Mautic contact updated:', data);
-            }
-            // Invalidate related queries
-            queryClient.invalidateQueries({ queryKey: ['mautic-contacts'] });
-            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.contactId] });
-        },
-        onError: (error) => {
-            console.error('Failed to update Mautic contact:', error);
-        },
-    });
-};
-/**
- * Custom hook for fetching Mautic contact by email
- */
-const useMauticContactByEmail = (email) => {
-    return useQuery({
-        queryKey: ['mautic-contact', email],
-        queryFn: () => {
-            const client = getMauticClient();
-            return client.getContactByEmail(email);
-        },
-        enabled: !!email && email.includes('@'),
-        staleTime: 5 * 60 * 1000, // 5 minutes
-        gcTime: 10 * 60 * 1000,
-    });
-};
-/**
- * Custom hook for fetching Mautic forms
- */
-const useMauticForms = () => {
-    return useQuery({
-        queryKey: ['mautic-forms'],
-        queryFn: () => {
-            const client = getMauticClient();
-            return client.getForms();
-        },
-        staleTime: 30 * 60 * 1000, // Forms don't change often
-        gcTime: 60 * 60 * 1000,
-    });
-};
-/**
- * Custom hook for fetching a specific Mautic form
- */
-const useMauticForm = (formId) => {
-    return useQuery({
-        queryKey: ['mautic-form', formId],
-        queryFn: () => {
-            const client = getMauticClient();
-            return client.getForm(formId);
-        },
-        enabled: !!formId,
-        staleTime: 30 * 60 * 1000,
-        gcTime: 60 * 60 * 1000,
-    });
-};
-/**
- * Custom hook for tracking Mautic events
- */
-const useMauticEventTracking = () => {
-    return useMutation({
-        mutationFn: ({ email, eventName, eventData }) => {
-            const client = getMauticClient();
-            return client.trackEvent(eventName, {
-                email,
-                ...(eventData || {})
-            });
-        },
-        onSuccess: (data, variables) => {
-            if (import.meta.env?.DEV) {
-                console.log('Mautic event tracked successfully:', variables.eventName);
-            }
-        },
-        onError: (error, variables) => {
-            console.error('Failed to track Mautic event:', variables.eventName, error);
-        },
-    });
-};
-/**
- * Custom hook for adding tags to contacts
- */
-const useMauticAddTags = () => {
-    const queryClient = useQueryClient();
-    return useMutation({
-        mutationFn: ({ contactId, tags }) => {
-            const client = getMauticClient();
-            return client.addTagToContact(contactId, tags);
-        },
-        onSuccess: (data, variables) => {
-            if (import.meta.env?.DEV) {
-                console.log('Tags added to Mautic contact:', variables.tags);
-            }
-            // Invalidate contact queries
-            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.contactId] });
-        },
-        onError: (error) => {
-            console.error('Failed to add tags to Mautic contact:', error);
-        },
-    });
-};
-/**
- * Custom hook for removing tags from contacts
- */
-const useMauticRemoveTags = () => {
-    const queryClient = useQueryClient();
-    return useMutation({
-        mutationFn: ({ contactId, tags }) => {
-            const client = getMauticClient();
-            return client.removeTagFromContact(contactId, tags);
-        },
-        onSuccess: (data, variables) => {
-            if (import.meta.env?.DEV) {
-                console.log('Tags removed from Mautic contact:', variables.tags);
-            }
-            // Invalidate contact queries
-            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.contactId] });
-        },
-        onError: (error) => {
-            console.error('Failed to remove tags from Mautic contact:', error);
-        },
-    });
-};
-/**
- * Custom hook for getting contact tags
- */
-const useMauticContactTags = (contactId) => {
-    return useQuery({
-        queryKey: ['mautic-contact-tags', contactId],
-        queryFn: () => {
-            const client = getMauticClient();
-            return client.getContactTags(contactId);
-        },
-        enabled: !!contactId,
-        staleTime: 5 * 60 * 1000,
-        gcTime: 10 * 60 * 1000,
-    });
-};
-/**
- * Custom hook for getting all tags
- */
-const useMauticTags = () => {
-    return useQuery({
-        queryKey: ['mautic-tags'],
-        queryFn: () => {
-            const client = getMauticClient();
-            return client.getTags();
-        },
-        staleTime: 30 * 60 * 1000,
-        gcTime: 60 * 60 * 1000,
-    });
-};
-/**
- * Custom hook for getting segments
- */
-const useMauticSegments = () => {
-    return useQuery({
-        queryKey: ['mautic-segments'],
-        queryFn: () => {
-            const client = getMauticClient();
-            return client.getSegments();
-        },
-        staleTime: 30 * 60 * 1000,
-        gcTime: 60 * 60 * 1000,
-    });
-};
-/**
- * Custom hook for adding contact to segment
- */
-const useMauticAddToSegment = () => {
-    const queryClient = useQueryClient();
-    return useMutation({
-        mutationFn: ({ contactId, segmentId }) => {
-            const client = getMauticClient();
-            return client.addContactToSegment(contactId, segmentId);
-        },
-        onSuccess: (data, variables) => {
-            if (import.meta.env?.DEV) {
-                console.log('Contact added to segment:', variables.segmentId);
-            }
-            // Invalidate contact queries
-            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.contactId] });
-        },
-        onError: (error) => {
-            console.error('Failed to add contact to segment:', error);
-        },
-    });
-};
-/**
- * Custom hook for removing contact from segment
- */
-const useMauticRemoveFromSegment = () => {
-    const queryClient = useQueryClient();
-    return useMutation({
-        mutationFn: ({ contactId, segmentId }) => {
-            const client = getMauticClient();
-            return client.removeContactFromSegment(contactId, segmentId);
-        },
-        onSuccess: (data, variables) => {
-            if (import.meta.env?.DEV) {
-                console.log('Contact removed from segment:', variables.segmentId);
-            }
-            // Invalidate contact queries
-            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.contactId] });
-        },
-        onError: (error) => {
-            console.error('Failed to remove contact from segment:', error);
-        },
-    });
-};
-
 /**
  * @license GPL-3.0-or-later
  *
@@ -833,9 +499,19 @@ class MauticService {
         return this.client.trackEvent(eventName, eventData);
     }
 }
-// Export configured instance
-const mauticService = new MauticService();
-setMauticClient(mauticService['client']);
+// Export configured instance (guarded to avoid throwing at import time)
+let mauticService = null;
+try {
+    mauticService = new MauticService();
+    // Initialize the default client for hooks
+    // Lazy import to avoid circular/side-effect issues in some environments
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    const { setMauticClient } = require('../react/hooks/useMautic');
+    setMauticClient(mauticService['client']);
+}
+catch {
+    // Silently skip initialization when environment is not configured
+}
 
 /**
  * @license GPL-3.0-or-later
@@ -855,17 +531,57 @@ setMauticClient(mauticService['client']);
  */
 class MauticGenerator {
     constructor(config) {
+        this.cachedToken = null;
         this.config = config;
         this.client = new MauticClient({
             authMode: config.authMode,
             apiUrl: config.apiUrl,
             cloudflareWorkerUrl: config.cloudflareWorkerUrl,
-            appId: config.appId,
-            workerSecret: config.workerSecret,
+            clientId: config.clientId,
+            clientSecret: config.clientSecret,
+            cfAccessClientId: config.cfAccessClientId,
+            cfAccessClientSecret: config.cfAccessClientSecret,
             timeout: config.timeout,
             retries: config.retries,
         });
     }
+    /**
+     * Get OAuth2 token for direct mode API calls
+     */
+    async getOAuth2Token() {
+        if (this.cachedToken && this.cachedToken.expires_at > Date.now() + 300000) {
+            console.log('🔑 Using cached OAuth2 token');
+            return this.cachedToken.access_token;
+        }
+        if (!this.config.clientId || !this.config.clientSecret) {
+            throw new Error('OAuth2 credentials (clientId, clientSecret) required for direct mode');
+        }
+        console.log('🔑 Fetching new OAuth2 token...');
+        const tokenUrl = `${this.config.apiUrl}/oauth/v2/token`;
+        const body = new URLSearchParams({
+            grant_type: 'client_credentials',
+            client_id: this.config.clientId,
+            client_secret: this.config.clientSecret,
+        });
+        const headers = { 'Content-Type': 'application/x-www-form-urlencoded' };
+        if (this.config.cfAccessClientId && this.config.cfAccessClientSecret) {
+            headers['CF-Access-Client-Id'] = this.config.cfAccessClientId;
+            headers['CF-Access-Client-Secret'] = this.config.cfAccessClientSecret;
+            console.log('🔐 Added CF Access headers to OAuth2 token request');
+        }
+        const resp = await fetch(tokenUrl, { method: 'POST', headers, body: body.toString() });
+        if (!resp.ok) {
+            const errText = await resp.text();
+            throw new Error(`OAuth2 token failed: ${resp.status} ${errText}`);
+        }
+        const data = await resp.json();
+        this.cachedToken = {
+            access_token: data.access_token,
+            expires_at: Date.now() + (data.expires_in * 1000),
+        };
+        console.log('✅ OAuth2 token cached');
+        return this.cachedToken.access_token;
+    }
     /**
      * Generate static data for Mautic forms
      */
@@ -899,7 +615,7 @@ class MauticGenerator {
                         // Include other important form properties
                         formType: formDetails.formType || 'standalone',
                         // Extract fields with validation and properties
-                        fields: (formDetails.fields || []).map(field => ({
+                        fields: (formDetails.fields || []).map((field) => ({
                             id: field.id,
                             label: field.label,
                             alias: field.alias,
@@ -918,7 +634,7 @@ class MauticGenerator {
                             }
                         })),
                         // Extract actions
-                        actions: (formDetails.actions || []).map(action => ({
+                        actions: (formDetails.actions || []).map((action) => ({
                             id: action.id,
                             name: action.name,
                             type: action.type,
@@ -942,10 +658,10 @@ class MauticGenerator {
             const staticData = {
                 generated_at: new Date().toISOString(),
                 total_forms: forms.length,
-                forms: forms.map(form => ({
+                forms: forms.map((form) => ({
                     id: parseInt(form.id),
                     name: form.name,
-                    alias: form.alias || form.name.toLowerCase().replace(/\s+/g, '-'),
+                    alias: String(form.alias ?? (form.name || '').toLowerCase().replace(/\s+/g, '-')),
                     description: form.description,
                     isPublished: form.isPublished,
                     fields: form.fields,
@@ -992,49 +708,44 @@ class MauticGenerator {
      * Fetch list of forms from Mautic
      */
     async fetchMauticFormsList() {
-        const baseUrl = this.config.cloudflareWorkerUrl;
-        if (!baseUrl)
-            throw new Error('VITE_MAUTIC_PROXY_URL not configured');
-        const url = `${baseUrl}?endpoint=/forms`;
-        const headers = {
-            'Content-Type': 'application/json',
-        };
-        if (this.config.appId) {
-            headers['x-app-id'] = this.config.appId;
+        if (this.config.authMode === 'cloudflare_proxy') {
+            const forms = await this.client.getForms();
+            return Array.isArray(forms) ? forms : [];
         }
-        if (this.config.workerSecret) {
-            headers['x-app-secret'] = this.config.workerSecret;
+        // Direct mode with OAuth2
+        const token = await this.getOAuth2Token();
+        const url = `${this.config.apiUrl}/api/forms`;
+        const headers = { 'Authorization': `Bearer ${token}` };
+        if (this.config.cfAccessClientId && this.config.cfAccessClientSecret) {
+            headers['CF-Access-Client-Id'] = this.config.cfAccessClientId;
+            headers['CF-Access-Client-Secret'] = this.config.cfAccessClientSecret;
         }
-        const response = await fetch(url, { headers });
-        if (!response.ok) {
-            throw new Error(`Failed to fetch forms list: ${response.status} ${response.statusText}`);
-        }
-        const data = await response.json().catch(() => ({}));
-        const forms = data.forms;
-        return Array.isArray(forms) ? forms : [];
+        const resp = await fetch(url, { headers });
+        if (!resp.ok)
+            throw new Error(`Failed to fetch forms: ${resp.status}`);
+        const data = await resp.json();
+        return Array.isArray(data.forms) ? data.forms : [];
     }
     /**
      * Fetch individual form details from Mautic
      */
     async fetchMauticForm(formId) {
-        const baseUrl = this.config.cloudflareWorkerUrl;
-        if (!baseUrl)
-            throw new Error('VITE_MAUTIC_PROXY_URL not configured');
-        const url = `${baseUrl}?endpoint=/forms/${formId}`;
-        const headers = {
-            'Content-Type': 'application/json',
-        };
-        if (this.config.appId) {
-            headers['x-app-id'] = this.config.appId;
-        }
-        if (this.config.workerSecret) {
-            headers['x-app-secret'] = this.config.workerSecret;
+        if (this.config.authMode === 'cloudflare_proxy') {
+            return this.client.getForm(parseInt(formId, 10));
         }
-        const response = await fetch(url, { headers });
-        if (!response.ok) {
-            throw new Error(`Failed to fetch form ${formId}: ${response.status} ${response.statusText}`);
+        // Direct mode with OAuth2
+        const token = await this.getOAuth2Token();
+        const url = `${this.config.apiUrl}/api/forms/${formId}`;
+        const headers = { 'Authorization': `Bearer ${token}` };
+        if (this.config.cfAccessClientId && this.config.cfAccessClientSecret) {
+            headers['CF-Access-Client-Id'] = this.config.cfAccessClientId;
+            headers['CF-Access-Client-Secret'] = this.config.cfAccessClientSecret;
         }
-        return response.json().catch(() => ({}));
+        const resp = await fetch(url, { headers });
+        if (!resp.ok)
+            throw new Error(`Failed to fetch form ${formId}: ${resp.status}`);
+        const data = await resp.json();
+        return data.form || data;
     }
 }
 /**
@@ -2400,6 +2111,315 @@ if (process.env.NODE_ENV === 'production') {
 
 var jsxRuntimeExports = jsxRuntime.exports;
 
+/**
+ * @license GPL-3.0-or-later
+ *
+ * This file is part of the MarVAlt Open SDK.
+ * Copyright (c) 2025 Vibune Pty Ltd.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+ * See the GNU General Public License for more details.
+ */
+// Create a default client instance (will be overridden by provider)
+let defaultClient = null;
+/**
+ * Set the default Mautic client for hooks
+ */
+const setMauticClient = (client) => {
+    defaultClient = client;
+};
+/**
+ * Get the current Mautic client
+ */
+const getMauticClient = () => {
+    if (!defaultClient) {
+        // Lazy initialize the client from environment if not set by provider/service
+        const config = createMauticConfig();
+        defaultClient = new MauticClient(config);
+    }
+    return defaultClient;
+};
+/**
+ * Custom hook for submitting forms to Mautic
+ */
+const useMauticFormSubmission = () => {
+    const queryClient = useQueryClient();
+    return useMutation({
+        mutationFn: (submission) => {
+            const client = getMauticClient();
+            return client.submitForm(submission.formId, submission);
+        },
+        onSuccess: (data, variables) => {
+            if (process.env.NODE_ENV === 'development') {
+                console.log('Mautic form submission successful:', data);
+            }
+            // Invalidate related queries
+            queryClient.invalidateQueries({ queryKey: ['mautic-contacts'] });
+            // Track the submission event
+            if (variables.contact?.email) {
+                const client = getMauticClient();
+                client.trackEvent('form_submission', {
+                    formId: variables.formId,
+                    email: variables.contact.email
+                }).catch(console.error);
+            }
+        },
+        onError: (error) => {
+            console.error('Mautic form submission failed:', error);
+        },
+    });
+};
+/**
+ * Custom hook for creating Mautic contacts
+ */
+const useMauticCreateContact = () => {
+    const queryClient = useQueryClient();
+    return useMutation({
+        mutationFn: (contact) => {
+            const client = getMauticClient();
+            return client.createContact(contact);
+        },
+        onSuccess: (data, variables) => {
+            if (process.env.NODE_ENV === 'development') {
+                console.log('Mautic contact created:', data);
+            }
+            // Invalidate contacts queries
+            queryClient.invalidateQueries({ queryKey: ['mautic-contacts'] });
+            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.email] });
+        },
+        onError: (error) => {
+            console.error('Failed to create Mautic contact:', error);
+        },
+    });
+};
+/**
+ * Custom hook for updating Mautic contacts
+ */
+const useMauticUpdateContact = () => {
+    const queryClient = useQueryClient();
+    return useMutation({
+        mutationFn: ({ contactId, contact }) => {
+            const client = getMauticClient();
+            return client.updateContact(contactId, contact);
+        },
+        onSuccess: (data, variables) => {
+            if (process.env.NODE_ENV === 'development') {
+                console.log('Mautic contact updated:', data);
+            }
+            // Invalidate related queries
+            queryClient.invalidateQueries({ queryKey: ['mautic-contacts'] });
+            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.contactId] });
+        },
+        onError: (error) => {
+            console.error('Failed to update Mautic contact:', error);
+        },
+    });
+};
+/**
+ * Custom hook for fetching Mautic contact by email
+ */
+const useMauticContactByEmail = (email) => {
+    return useQuery({
+        queryKey: ['mautic-contact', email],
+        queryFn: () => {
+            const client = getMauticClient();
+            return client.getContactByEmail(email);
+        },
+        enabled: !!email && email.includes('@'),
+        staleTime: 5 * 60 * 1000, // 5 minutes
+        gcTime: 10 * 60 * 1000,
+    });
+};
+/**
+ * Custom hook for fetching Mautic forms
+ */
+const useMauticForms = () => {
+    return useQuery({
+        queryKey: ['mautic-forms'],
+        queryFn: () => {
+            const client = getMauticClient();
+            return client.getForms();
+        },
+        staleTime: 30 * 60 * 1000, // Forms don't change often
+        gcTime: 60 * 60 * 1000,
+    });
+};
+/**
+ * Custom hook for fetching a specific Mautic form
+ */
+const useMauticForm = (formId) => {
+    return useQuery({
+        queryKey: ['mautic-form', formId],
+        queryFn: () => {
+            const client = getMauticClient();
+            return client.getForm(formId);
+        },
+        enabled: !!formId,
+        staleTime: 30 * 60 * 1000,
+        gcTime: 60 * 60 * 1000,
+    });
+};
+/**
+ * Custom hook for tracking Mautic events
+ */
+const useMauticEventTracking = () => {
+    return useMutation({
+        mutationFn: ({ email, eventName, eventData }) => {
+            const client = getMauticClient();
+            return client.trackEvent(eventName, {
+                email,
+                ...(eventData || {})
+            });
+        },
+        onSuccess: (data, variables) => {
+            if (process.env.NODE_ENV === 'development') {
+                console.log('Mautic event tracked successfully:', variables.eventName);
+            }
+        },
+        onError: (error, variables) => {
+            console.error('Failed to track Mautic event:', variables.eventName, error);
+        },
+    });
+};
+/**
+ * Custom hook for adding tags to contacts
+ */
+const useMauticAddTags = () => {
+    const queryClient = useQueryClient();
+    return useMutation({
+        mutationFn: ({ contactId, tags }) => {
+            const client = getMauticClient();
+            return client.addTagToContact(contactId, tags);
+        },
+        onSuccess: (data, variables) => {
+            if (process.env.NODE_ENV === 'development') {
+                console.log('Tags added to Mautic contact:', variables.tags);
+            }
+            // Invalidate contact queries
+            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.contactId] });
+        },
+        onError: (error) => {
+            console.error('Failed to add tags to Mautic contact:', error);
+        },
+    });
+};
+/**
+ * Custom hook for removing tags from contacts
+ */
+const useMauticRemoveTags = () => {
+    const queryClient = useQueryClient();
+    return useMutation({
+        mutationFn: ({ contactId, tags }) => {
+            const client = getMauticClient();
+            return client.removeTagFromContact(contactId, tags);
+        },
+        onSuccess: (data, variables) => {
+            if (process.env.NODE_ENV === 'development') {
+                console.log('Tags removed from Mautic contact:', variables.tags);
+            }
+            // Invalidate contact queries
+            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.contactId] });
+        },
+        onError: (error) => {
+            console.error('Failed to remove tags from Mautic contact:', error);
+        },
+    });
+};
+/**
+ * Custom hook for getting contact tags
+ */
+const useMauticContactTags = (contactId) => {
+    return useQuery({
+        queryKey: ['mautic-contact-tags', contactId],
+        queryFn: () => {
+            const client = getMauticClient();
+            return client.getContactTags(contactId);
+        },
+        enabled: !!contactId,
+        staleTime: 5 * 60 * 1000,
+        gcTime: 10 * 60 * 1000,
+    });
+};
+/**
+ * Custom hook for getting all tags
+ */
+const useMauticTags = () => {
+    return useQuery({
+        queryKey: ['mautic-tags'],
+        queryFn: () => {
+            const client = getMauticClient();
+            return client.getTags();
+        },
+        staleTime: 30 * 60 * 1000,
+        gcTime: 60 * 60 * 1000,
+    });
+};
+/**
+ * Custom hook for getting segments
+ */
+const useMauticSegments = () => {
+    return useQuery({
+        queryKey: ['mautic-segments'],
+        queryFn: () => {
+            const client = getMauticClient();
+            return client.getSegments();
+        },
+        staleTime: 30 * 60 * 1000,
+        gcTime: 60 * 60 * 1000,
+    });
+};
+/**
+ * Custom hook for adding contact to segment
+ */
+const useMauticAddToSegment = () => {
+    const queryClient = useQueryClient();
+    return useMutation({
+        mutationFn: ({ contactId, segmentId }) => {
+            const client = getMauticClient();
+            return client.addContactToSegment(contactId, segmentId);
+        },
+        onSuccess: (data, variables) => {
+            if (process.env.NODE_ENV === 'development') {
+                console.log('Contact added to segment:', variables.segmentId);
+            }
+            // Invalidate contact queries
+            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.contactId] });
+        },
+        onError: (error) => {
+            console.error('Failed to add contact to segment:', error);
+        },
+    });
+};
+/**
+ * Custom hook for removing contact from segment
+ */
+const useMauticRemoveFromSegment = () => {
+    const queryClient = useQueryClient();
+    return useMutation({
+        mutationFn: ({ contactId, segmentId }) => {
+            const client = getMauticClient();
+            return client.removeContactFromSegment(contactId, segmentId);
+        },
+        onSuccess: (data, variables) => {
+            if (process.env.NODE_ENV === 'development') {
+                console.log('Contact removed from segment:', variables.segmentId);
+            }
+            // Invalidate contact queries
+            queryClient.invalidateQueries({ queryKey: ['mautic-contact', variables.contactId] });
+        },
+        onError: (error) => {
+            console.error('Failed to remove contact from segment:', error);
+        },
+    });
+};
+
 const MauticForm = ({ formId, title, description, className = '', form, onSubmit, onSuccess, onError, }) => {
     const [formData, setFormData] = useState({});
     const [errors, setErrors] = useState({});
@@ -2572,21 +2592,19 @@ const MauticForm = ({ formId, title, description, className = '', form, onSubmit
                     .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." }) }))] }));
 };
 
-const MauticTracking = ({ enabled, mauticUrl, proxyUrl, appId, workerSecret, children }) => {
+const MauticTracking = ({ enabled, mauticUrl, proxyUrl, children }) => {
     useEffect(() => {
         // Determine if tracking is enabled
-        const isEnabled = enabled ?? (!!proxyUrl && !!appId && !!workerSecret);
+        const isEnabled = enabled ?? !!proxyUrl;
         const trackingProxyUrl = proxyUrl;
         // Debug logging to understand configuration
-        if (import.meta.env?.DEV) {
+        if (process.env.NODE_ENV === 'development') {
             console.log('🔍 Mautic Tracking Debug:', {
                 isEnabled,
                 mauticUrl,
                 trackingProxyUrl,
-                hasAppId: !!appId,
-                hasWorkerSecret: !!workerSecret,
-                isDev: import.meta.env?.DEV,
-                isProd: import.meta.env?.PROD
+                isDev: true,
+                isProd: false
             });
         }
         // Check if tracking is enabled
@@ -2595,7 +2613,7 @@ const MauticTracking = ({ enabled, mauticUrl, proxyUrl, appId, workerSecret, chi
             return;
         }
         // Check if we're in development mode - skip tracking in dev
-        if (import.meta.env?.DEV) {
+        if (process.env.NODE_ENV === 'development') {
             console.log('Mautic tracking disabled in development mode');
             return;
         }
@@ -2606,6 +2624,8 @@ const MauticTracking = ({ enabled, mauticUrl, proxyUrl, appId, workerSecret, chi
         }
         console.log('✅ Mautic tracking enabled for production');
         // Initialize Mautic tracking with error handling
+        // Capture original fetch for cleanup
+        let originalFetch;
         try {
             // Pre-initialize tracking object and queue (standard Mautic snippet behavior)
             window.MauticTrackingObject = 'mt';
@@ -2613,20 +2633,12 @@ const MauticTracking = ({ enabled, mauticUrl, proxyUrl, appId, workerSecret, chi
                 (window.mt.q = window.mt.q || []).push(arguments);
             };
             // Intercept Mautic tracking API calls to use our proxy (generic /mtc/ matcher)
-            const originalFetch = window.fetch.bind(window);
+            originalFetch = window.fetch.bind(window);
             const interceptFetch = function (url, options) {
                 if (typeof url === 'string' && /\/mtc\//.test(url)) {
                     try {
                         const proxyUrl = url.replace(/https?:\/\/[^/]+\/mtc\//, `${trackingProxyUrl}?endpoint=/mtc/`);
-                        const proxyOptions = {
-                            ...options,
-                            headers: {
-                                ...options?.headers,
-                                'Content-Type': 'application/json',
-                                'x-app-id': appId || '',
-                                ...(workerSecret ? { 'x-app-secret': workerSecret } : {})
-                            }
-                        };
+                        const proxyOptions = { ...options };
                         return originalFetch(proxyUrl, proxyOptions);
                     }
                     catch (e) {
@@ -2636,16 +2648,9 @@ const MauticTracking = ({ enabled, mauticUrl, proxyUrl, appId, workerSecret, chi
                 return originalFetch(url, options);
             };
             window.fetch = interceptFetch;
-            // Fetch the tracking script through the proxy with required headers
+            // Fetch the tracking script through the proxy
             const trackingScriptUrl = `${trackingProxyUrl}?endpoint=/mtc.js`;
-            fetch(trackingScriptUrl, {
-                method: 'GET',
-                headers: {
-                    'Content-Type': 'application/javascript',
-                    'x-app-id': appId || '',
-                    ...(workerSecret ? { 'x-app-secret': workerSecret } : {})
-                }
-            })
+            fetch(trackingScriptUrl, { method: 'GET' })
                 .then(response => {
                 if (!response.ok) {
                     throw new Error(`Failed to load Mautic tracking script: ${response.status}`);
@@ -2673,12 +2678,11 @@ const MauticTracking = ({ enabled, mauticUrl, proxyUrl, appId, workerSecret, chi
         }
         // Cleanup function
         return () => {
-            // Restore original fetch if needed
-            if (window.fetch !== originalFetch) {
+            if (originalFetch && window.fetch !== originalFetch) {
                 window.fetch = originalFetch;
             }
         };
-    }, [enabled, mauticUrl, proxyUrl, appId, workerSecret]);
+    }, [enabled, mauticUrl, proxyUrl]);
     // Render children if provided, otherwise render nothing
     return children ? jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: children }) : null;
 };
@@ -3053,30 +3057,33 @@ const validateField = (field, value) => {
 const validateCustomRule = (rule, value, field) => {
     switch (rule) {
         case 'min_length':
-            if (typeof value === 'string' && value.length < (field.properties?.minLength || 0)) {
-                return `Minimum length is ${field.properties?.minLength} characters`;
+            if (typeof value === 'string' && value.length < Number(field.properties?.minLength ?? 0)) {
+                return `Minimum length is ${Number(field.properties?.minLength ?? 0)} characters`;
             }
             break;
         case 'max_length':
-            if (typeof value === 'string' && value.length > (field.properties?.maxLength || 1000)) {
-                return `Maximum length is ${field.properties?.maxLength} characters`;
+            if (typeof value === 'string' && value.length > Number(field.properties?.maxLength ?? 1000)) {
+                return `Maximum length is ${Number(field.properties?.maxLength ?? 1000)} characters`;
             }
             break;
         case 'min_value':
-            if (typeof value === 'number' && value < (field.properties?.minValue || 0)) {
-                return `Minimum value is ${field.properties?.minValue}`;
+            if (typeof value === 'number' && value < Number(field.properties?.minValue ?? 0)) {
+                return `Minimum value is ${Number(field.properties?.minValue ?? 0)}`;
             }
             break;
         case 'max_value':
-            if (typeof value === 'number' && value > (field.properties?.maxValue || 1000000)) {
-                return `Maximum value is ${field.properties?.maxValue}`;
+            if (typeof value === 'number' && value > Number(field.properties?.maxValue ?? 1000000)) {
+                return `Maximum value is ${Number(field.properties?.maxValue ?? 1000000)}`;
             }
             break;
         case 'pattern':
-            if (field.properties?.pattern) {
-                const regex = new RegExp(field.properties.pattern);
-                if (!regex.test(value)) {
-                    return 'Invalid format';
+            {
+                const pattern = field.properties?.pattern;
+                if (pattern) {
+                    const regex = new RegExp(String(pattern));
+                    if (!regex.test(value)) {
+                        return 'Invalid format';
+                    }
                 }
             }
             break;