fivo_cookie_consent 0.2.0

data/app/assets/javascripts/fivo_cookie_consent.js

@@ -0,0 +1,924 @@
+/**
+ * GDPR Cookie Consent Manager
+ * Handles cookie consent banner display, user preferences, and localStorage management
+ */
+class GDPRCookieConsent {
+  constructor() {
+    this.storageKey = 'gdpr_cookie_consent';
+    this.cookieLifespan = 365; // days
+    this.banner = null;
+    this.modal = null;
+    this.detectedCookies = {};
+    this.expandedCategories = new Set();
+
+    this.init();
+  }
+
+  /**
+   * Initialize the cookie consent manager
+   */
+  init() {
+    // Wait for DOM to be ready
+    if (document.readyState === 'loading') {
+      document.addEventListener('DOMContentLoaded', () => this.setup());
+    } else {
+      this.setup();
+    }
+  }
+
+  /**
+   * Setup event listeners and check consent status
+   */
+  setup() {
+    this.banner = document.getElementById('gdpr-cookie-banner');
+    this.modal = document.getElementById('gdpr-cookie-modal');
+
+    if (!this.banner || !this.modal) {
+      console.warn('GDPR Cookie Consent: Banner or modal not found');
+      return;
+    }
+
+    this.setupEventListeners();
+    this.detectAndCategorizeInitialCookies();
+    this.checkConsentStatus();
+    this.setupCookieObserver();
+  }
+
+  /**
+   * Setup all event listeners for banner and modal interactions
+   */
+  setupEventListeners() {
+    // Banner buttons
+    this.banner.addEventListener('click', (e) => {
+      const action = e.target.dataset.action;
+      if (action === 'accept') {
+        this.acceptAll();
+      } else if (action === 'decline') {
+        this.declineAll();
+      } else if (action === 'settings') {
+        this.openModal();
+      }
+    });
+
+    // Modal interactions
+    this.modal.addEventListener('click', (e) => {
+      // Check the clicked element and its parents for data-action
+      let element = e.target;
+      let action = null;
+
+      // Traverse up the DOM to find an element with data-action
+      while (element && element !== this.modal) {
+        if (element.dataset && element.dataset.action) {
+          action = element.dataset.action;
+          break;
+        }
+        element = element.parentElement;
+      }
+
+      if (action === 'close-modal') {
+        e.preventDefault();
+        this.closeModal();
+      } else if (action === 'save-preferences') {
+        this.savePreferences();
+      } else if (action === 'decline-all') {
+        this.declineAll();
+      }
+    });
+
+    // Close modal on Escape key
+    document.addEventListener('keydown', (e) => {
+      if (e.key === 'Escape' && this.isModalOpen()) {
+        this.closeModal();
+      }
+    });
+  }
+
+  /**
+   * Check if user has already made consent choices
+   */
+  checkConsentStatus() {
+    const consent = this.getConsent();
+    if (!consent) {
+      this.showBanner();
+    } else {
+      this.loadPreferences();
+    }
+  }
+
+  /**
+   * Show the cookie consent banner
+   */
+  showBanner() {
+    if (this.banner) {
+      this.banner.style.display = 'block';
+      // Add animation class for better UX
+      setTimeout(() => {
+        this.banner.classList.add('gdpr-banner--visible');
+      }, 100);
+    }
+  }
+
+  /**
+   * Hide the cookie consent banner
+   */
+  hideBanner() {
+    if (this.banner) {
+      this.banner.classList.remove('gdpr-banner--visible');
+      setTimeout(() => {
+        this.banner.style.display = 'none';
+      }, 300);
+    }
+  }
+
+  /**
+   * Open the preferences modal
+   */
+  openModal() {
+    if (this.modal) {
+      this.modal.style.display = 'block';
+      document.body.style.overflow = 'hidden';
+      // Re-detect cookies in case they changed since initial load
+      this.detectAndCategorizeInitialCookies();
+
+      // Load current preferences into modal
+      this.loadPreferences();
+
+      // Setup category expansion functionality
+      this.setupCategoryExpansion();
+
+      // Focus management for accessibility
+      const firstInput = this.modal.querySelector('input[type="checkbox"]:not([disabled])');
+      if (firstInput) {
+        firstInput.focus();
+      }
+    }
+  }
+
+  /**
+   * Close the preferences modal
+   */
+  closeModal() {
+    if (this.modal) {
+      this.modal.style.display = 'none';
+      document.body.style.overflow = '';
+    }
+  }
+
+  /**
+   * Check if modal is currently open
+   */
+  isModalOpen() {
+    return this.modal && this.modal.style.display === 'block';
+  }
+
+  /**
+   * Accept all cookie categories
+   */
+  acceptAll() {
+    const consent = {
+      necessary: true,
+      analytics: true,
+      marketing: true,
+      functional: true,
+      savedAt: new Date().toISOString()
+    };
+
+    this.saveConsent(consent);
+    this.hideBanner();
+    this.closeModal();
+    this.dispatchEvent('gdpr:accept', { categories: ['analytics', 'marketing', 'functional'] });
+    this.dispatchEvent('gdpr:change', { consent: consent });
+  }
+
+  /**
+   * Decline all non-necessary cookies
+   */
+  declineAll() {
+    const consent = {
+      necessary: true,
+      analytics: false,
+      marketing: false,
+      functional: false,
+      savedAt: new Date().toISOString()
+    };
+
+    this.saveConsent(consent);
+    this.hideBanner();
+    this.closeModal();
+    this.dispatchEvent('gdpr:decline', { categories: ['analytics', 'marketing', 'functional'] });
+    this.dispatchEvent('gdpr:change', { consent: consent });
+  }
+
+  /**
+   * Save user preferences from modal
+   */
+  savePreferences() {
+    const consent = {
+      necessary: true,
+      analytics: this.getCheckboxValue('gdpr-analytics'),
+      marketing: this.getCheckboxValue('gdpr-marketing'),
+      functional: this.getCheckboxValue('gdpr-functional'),
+      savedAt: new Date().toISOString()
+    };
+
+    this.saveConsent(consent);
+    this.hideBanner();
+    this.closeModal();
+
+    // Dispatch events for accepted and declined categories
+    const accepted = [];
+    const declined = [];
+
+    ['analytics', 'marketing', 'functional'].forEach(category => {
+      if (consent[category]) {
+        accepted.push(category);
+      } else {
+        declined.push(category);
+      }
+    });
+
+    if (accepted.length > 0) {
+      this.dispatchEvent('gdpr:accept', { categories: accepted });
+    }
+    if (declined.length > 0) {
+      this.dispatchEvent('gdpr:decline', { categories: declined });
+    }
+
+    this.dispatchEvent('gdpr:change', { consent: consent });
+
+    // Re-detect cookies after saving preferences
+    setTimeout(() => {
+      this.detectAndCategorizeInitialCookies();
+    }, 100);
+  }
+
+  /**
+   * Load preferences into modal checkboxes
+   */
+  loadPreferences() {
+    const consent = this.getConsent();
+    if (!consent) return;
+
+    this.setCheckboxValue('gdpr-analytics', consent.analytics);
+    this.setCheckboxValue('gdpr-marketing', consent.marketing);
+    this.setCheckboxValue('gdpr-functional', consent.functional);
+  }
+
+  /**
+   * Get checkbox value by ID
+   */
+  getCheckboxValue(id) {
+    const checkbox = document.getElementById(id);
+    return checkbox ? checkbox.checked : false;
+  }
+
+  /**
+   * Set checkbox value by ID
+   */
+  setCheckboxValue(id, value) {
+    const checkbox = document.getElementById(id);
+    if (checkbox) {
+      checkbox.checked = value;
+    }
+  }
+
+  /**
+   * Save consent to localStorage
+   */
+  saveConsent(consent) {
+    try {
+      localStorage.setItem(this.storageKey, JSON.stringify(consent));
+    } catch (error) {
+      console.error('GDPR Cookie Consent: Failed to save consent to localStorage', error);
+    }
+  }
+
+  /**
+   * Get consent from localStorage
+   */
+  getConsent() {
+    try {
+      const stored = localStorage.getItem(this.storageKey);
+      if (!stored) return null;
+
+      const consent = JSON.parse(stored);
+
+      // Check if consent is still valid (not expired)
+      if (consent.savedAt) {
+        const savedDate = new Date(consent.savedAt);
+        const expiryDate = new Date(savedDate.getTime() + (this.cookieLifespan * 24 * 60 * 60 * 1000));
+
+        if (new Date() > expiryDate) {
+          this.clearConsent();
+          return null;
+        }
+      }
+
+      return consent;
+    } catch (error) {
+      console.error('GDPR Cookie Consent: Failed to read consent from localStorage', error);
+      return null;
+    }
+  }
+
+  /**
+   * Clear consent from localStorage
+   */
+  clearConsent() {
+    try {
+      localStorage.removeItem(this.storageKey);
+    } catch (error) {
+      console.error('GDPR Cookie Consent: Failed to clear consent from localStorage', error);
+    }
+  }
+
+  /**
+   * Dispatch custom events for cookie consent changes
+   */
+  dispatchEvent(eventName, detail) {
+    const event = new CustomEvent(eventName, {
+      detail: detail,
+      bubbles: true,
+      cancelable: true
+    });
+
+    document.dispatchEvent(event);
+  }
+
+  /**
+   * Check if a specific category is consented to
+   */
+  hasConsent(category) {
+    const consent = this.getConsent();
+    return consent ? consent[category] === true : false;
+  }
+
+  /**
+   * Get all consent categories
+   */
+  getAllConsent() {
+    return this.getConsent();
+  }
+
+  /**
+   * Force show banner (useful for testing or settings page)
+   */
+  showBannerForced() {
+    this.showBanner();
+  }
+
+  /**
+   * Force show modal (useful for settings page)
+   */
+  showModalForced() {
+    this.openModal();
+  }
+
+  /**
+   * Detect and categorize cookies initially
+   */
+  detectAndCategorizeInitialCookies() {
+    // Get client-side detectable cookies
+    this.detectedCookies = this.detectCookies();
+
+    // Merge with server-side cookies
+    this.mergeServerSideCookies();
+
+    this.updateCookieDisplay();
+  }
+
+  /**
+   * Merge server-side cookies (HttpOnly) with client-side detected cookies
+   */
+  mergeServerSideCookies() {
+    if (!this.banner) return;
+
+    try {
+      const serverCookiesData = this.banner.dataset.serverCookies;
+      if (!serverCookiesData) return;
+
+      const serverCookies = JSON.parse(serverCookiesData);
+
+      // Merge server-side cookies into detected cookies
+      Object.keys(serverCookies).forEach(category => {
+        if (this.detectedCookies[category] && serverCookies[category]) {
+          // Add server-side cookies to the category, avoiding duplicates
+          serverCookies[category].forEach(serverCookie => {
+            const exists = this.detectedCookies[category].some(cookie =>
+              cookie.name === serverCookie.name
+            );
+
+            if (!exists) {
+              this.detectedCookies[category].push(serverCookie);
+            }
+          });
+        }
+      });
+    } catch (error) {
+      console.warn('GDPR: Failed to parse server-side cookies', error);
+    }
+  }
+
+  /**
+   * Set up cookie observer to detect new cookies
+   */
+  setupCookieObserver() {
+    // Simple interval-based observer for cookie changes
+    setInterval(() => {
+      // Detect client-side cookies first
+      const newCookies = this.detectCookies();
+
+      // Clone so we don’t accidentally mutate the comparison object
+      this.detectedCookies = JSON.parse(JSON.stringify(newCookies));
+
+      // Always merge the server-side (HttpOnly) cookies so they persist
+      this.mergeServerSideCookies();
+
+      // If the overall cookie snapshot changed, re-render the UI
+      if (JSON.stringify(this.detectedCookies) !== JSON.stringify(newCookies)) {
+        this.updateCookieDisplay();
+        this.updateCategoryStates();
+      }
+    }, 2000); // Check every 2 seconds
+  }
+
+  /**
+   * Detect cookies and categorize them
+   * @returns {Object} Categorized cookies object
+   */
+  detectCookies() {
+    const cookies = {};
+    const categorized = {
+      necessary: [],
+      analytics: [],
+      marketing: [],
+      functional: [],
+      uncategorised: []
+    };
+
+    // Parse document.cookie
+    if (document.cookie && document.cookie.trim()) {
+      document.cookie.split(';').forEach(cookie => {
+        const trimmed = cookie.trim();
+        if (trimmed) {
+          const [name, ...valueParts] = trimmed.split('=');
+          const value = valueParts.join('='); // Handle values with = in them
+
+          if (name && name.trim()) {
+            const cookieName = name.trim();
+            cookies[cookieName] = {
+              name: cookieName,
+              value: value ? value.trim() : '',
+              duration: this.getCookieDuration(cookieName),
+              description: this.getCookieDescription(cookieName)
+            };
+          }
+        }
+      });
+    }
+
+    // Categorize cookies based on patterns
+    Object.values(cookies).forEach(cookie => {
+      const category = this.categorizeCookie(cookie.name);
+      categorized[category].push(cookie);
+    });
+
+    return categorized;
+  }
+
+  /**
+   * Categorize a cookie based on its name
+   * @param {string} cookieName - Name of the cookie
+   * @returns {string} Category name
+   */
+  categorizeCookie(cookieName) {
+    const patterns = this.getCookiePatterns();
+
+    for (const [category, regexList] of Object.entries(patterns)) {
+      for (const pattern of regexList) {
+        if (cookieName.match(pattern)) {
+          return category;
+        }
+      }
+    }
+    return 'uncategorised';
+  }
+
+  /**
+   * Get cookie patterns from configuration
+   * @returns {Object} Cookie patterns object
+   */
+  getCookiePatterns() {
+    // Default patterns - in production these would come from Ruby config
+    return {
+      necessary: [
+        /^_session_/,
+        /^session_/,
+        /^csrf_token/,
+        /^authenticity_token/,
+        /^_rails_/,
+        /^gdpr_cookie_consent$/
+      ],
+      analytics: [
+        /^_ga/,
+        /^_gid/,
+        /^_gat/,
+        /^_gtag/,
+        /^__utm/,
+        /^_dc_gtm_/,
+        /^_hjid/,
+        /^_hjFirstSeen/,
+        /^_hj/
+      ],
+      marketing: [
+        /^_fbp/,
+        /^_fbc/,
+        /^fr$/,
+        /^tr$/,
+        /^_pinterest_/,
+        /^_pin_unauth/,
+        /^__Secure-3PAPISID/,
+        /^__Secure-3PSID/,
+        /^NID$/,
+        /^IDE$/
+      ],
+      functional: [
+        /^_locale/,
+        /^language/,
+        /^theme/,
+        /^preferences/,
+        /^_user_settings/,
+        /^_ui_/
+      ]
+    };
+  }
+
+  /**
+   * Get cookie duration (simplified)
+   * @param {string} cookieName - Name of the cookie
+   * @returns {string} Duration description
+   */
+  getCookieDuration(cookieName) {
+    // Simplified duration detection
+    if (cookieName.match(/^_session_|^session_/)) {
+      return 'Session';
+    }
+    if (cookieName.match(/^_ga/)) {
+      return '2 Jahre';
+    }
+    if (cookieName.match(/^_gid/)) {
+      return '24 Stunden';
+    }
+    return 'Unbekannt';
+  }
+
+  /**
+   * Get cookie description
+   * @param {string} cookieName - Name of the cookie
+   * @returns {string} Cookie description
+   */
+  getCookieDescription(cookieName) {
+    const descriptions = {
+      '_ga': 'Google Analytics Hauptcookie',
+      '_gid': 'Google Analytics Sitzungs-ID',
+      '_gat': 'Google Analytics Drosselung',
+      '_fbp': 'Facebook Pixel Browser-ID',
+      '_fbc': 'Facebook Click-ID'
+    };
+
+    return descriptions[cookieName] || '';
+  }
+
+  /**
+   * Update cookie display in modal
+   */
+  updateCookieDisplay() {
+    if (!this.modal) return;
+
+    const categories = ['necessary', 'analytics', 'marketing', 'functional'];
+
+    categories.forEach(category => {
+      this.updateCategoryDisplay(category);
+    });
+
+    // Show uncategorised cookies only in development mode
+    if (this.isDevelopmentMode() && this.detectedCookies.uncategorised.length > 0) {
+      this.showUncategorisedCookies();
+    }
+  }
+
+  /**
+   * Update individual category display
+   * @param {string} category - Category name
+   */
+  updateCategoryDisplay(category) {
+    const categoryElement = this.modal.querySelector(`[data-category-section="${category}"]`);
+    if (!categoryElement) return;
+
+    const cookies = this.detectedCookies[category] || [];
+    const cookieListElement = categoryElement.querySelector('.gdpr-modal__cookie-list');
+    const emptyStateElement = categoryElement.querySelector('.gdpr-modal__empty-state');
+    const toggleElement = categoryElement.querySelector('input[type="checkbox"]');
+    const chevronElement = categoryElement.querySelector('.gdpr-modal__chevron');
+
+    // Determine expansion state (default collapsed)
+    const isExpanded = this.expandedCategories.has(category);
+
+    // Update empty state
+    if (cookies.length === 0) {
+      if (emptyStateElement) {
+        emptyStateElement.style.display = 'block';
+      }
+      if (cookieListElement) {
+        cookieListElement.style.display = 'none';
+      }
+
+      // Hide chevron for empty categories
+      if (chevronElement) {
+        chevronElement.style.display = 'none';
+      }
+    } else {
+      if (emptyStateElement) {
+        emptyStateElement.style.display = 'none';
+      }
+      if (cookieListElement) {
+        // Always (re)render table contents so data is fresh
+        this.renderCookieTable(cookieListElement, cookies);
+
+        // Show or hide list based on expansion state
+        cookieListElement.style.display = isExpanded ? 'block' : 'none';
+      }
+
+      // Enable toggle for non-empty categories
+      if (toggleElement && category !== 'necessary') {
+        toggleElement.disabled = false;
+        toggleElement.removeAttribute('aria-disabled');
+        const toggleContainer = toggleElement.closest('.gdpr-modal__toggle');
+        if (toggleContainer) {
+          toggleContainer.classList.remove('gdpr-modal__toggle--disabled');
+        }
+      }
+
+      // Show chevron for non-empty categories and set orientation
+      if (chevronElement) {
+        chevronElement.style.display = 'inline';
+        chevronElement.textContent = isExpanded ? '▾' : '▶';
+        chevronElement.setAttribute('aria-expanded', isExpanded ? 'true' : 'false');
+      }
+    }
+  }
+
+  /**
+   * Render cookie table
+   * @param {Element} container - Container element
+   * @param {Array} cookies - Array of cookie objects
+   */
+  renderCookieTable(container, cookies) {
+    const table = document.createElement('table');
+    table.className = 'gdpr-modal__cookie-table';
+
+    // Table header
+    const header = document.createElement('thead');
+    header.innerHTML = `
+      <tr>
+        <th>Name</th>
+        <th>Dauer</th>
+        <th>Beschreibung</th>
+      </tr>
+    `;
+    table.appendChild(header);
+
+    // Table body
+    const body = document.createElement('tbody');
+    cookies.forEach(cookie => {
+      const row = document.createElement('tr');
+      row.innerHTML = `
+        <td><code>${this.escapeHtml(cookie.name)}</code></td>
+        <td>${this.escapeHtml(cookie.duration)}</td>
+        <td>${this.escapeHtml(cookie.description)}</td>
+      `;
+      body.appendChild(row);
+    });
+    table.appendChild(body);
+
+    container.innerHTML = '';
+    container.appendChild(table);
+  }
+
+  /**
+   * Update category states based on detected cookies
+   */
+  updateCategoryStates() {
+    // Re-enable toggles that now have cookies
+    const categories = ['analytics', 'marketing', 'functional'];
+
+    categories.forEach(category => {
+      const cookies = this.detectedCookies[category] || [];
+      const toggleElement = this.modal?.querySelector(`#gdpr-${category}`);
+
+      if (toggleElement && cookies.length > 0) {
+        toggleElement.disabled = false;
+        toggleElement.removeAttribute('aria-disabled');
+        const toggleContainer = toggleElement.closest('.gdpr-modal__toggle');
+        if (toggleContainer) {
+          toggleContainer.classList.remove('gdpr-modal__toggle--disabled');
+        }
+      }
+    });
+  }
+
+  /**
+   * Check if in development mode
+   * @returns {boolean} True if in development mode
+   */
+  isDevelopmentMode() {
+    return window.location.hostname === 'localhost' ||
+      window.location.hostname === '127.0.0.1' ||
+      window.location.hostname.includes('dev');
+  }
+
+  /**
+   * Show uncategorised cookies section
+   */
+  showUncategorisedCookies() {
+    // Implementation would add a special section for uncategorised cookies
+    console.log('Uncategorised cookies detected:', this.detectedCookies.uncategorised);
+  }
+
+  /**
+   * Setup category expansion functionality
+   */
+  setupCategoryExpansion() {
+    if (!this.modal) return;
+
+    // Add click handlers for category headers with chevrons
+    this.modal.addEventListener('click', (e) => {
+      // Allow click either on chevron or entire header row
+      const header = e.target.closest('.gdpr-modal__category-header');
+      if (header) {
+        const category = header.dataset.category;
+        if (category) {
+          this.toggleCategoryExpansion(category);
+        }
+      }
+    });
+  }
+
+  /**
+   * Toggle category expansion
+   * @param {string} category - Category to toggle
+   */
+  toggleCategoryExpansion(category) {
+    const categoryElement = this.modal.querySelector(`[data-category-section="${category}"]`);
+    const cookieListElement = categoryElement?.querySelector('.gdpr-modal__cookie-list');
+    const chevronElement = categoryElement?.querySelector('.gdpr-modal__chevron');
+    const cookies = this.detectedCookies[category] || [];
+
+    // Do not expand categories that currently have no cookies; only show the empty state
+    if (!categoryElement || !cookieListElement || cookies.length === 0) {
+      return;
+    }
+
+    const isExpanded = this.expandedCategories.has(category);
+
+    if (isExpanded) {
+      // Collapse
+      cookieListElement.style.display = 'none';
+      chevronElement.textContent = '▶';
+      chevronElement.setAttribute('aria-expanded', 'false');
+      this.expandedCategories.delete(category);
+    } else {
+      // Expand
+      cookieListElement.style.display = 'block';
+      chevronElement.textContent = '▾';
+      chevronElement.setAttribute('aria-expanded', 'true');
+      this.expandedCategories.add(category);
+    }
+  }
+
+  /**
+   * Escape HTML for safe rendering
+   * @param {string} text - Text to escape
+   * @returns {string} Escaped text
+   */
+  escapeHtml(text) {
+    const div = document.createElement('div');
+    div.textContent = text;
+    return div.innerHTML;
+  }
+}
+
+// Auto-initialize when module is loaded
+let gdprInstance = null;
+
+// Initialize GDPR Cookie Consent
+function initGDPRCookieConsent() {
+  if (!gdprInstance) {
+    gdprInstance = new GDPRCookieConsent();
+  }
+  return gdprInstance;
+}
+
+function processGdprPlaceholders() {
+  const instance = initGDPRCookieConsent();
+  const placeholders = document.querySelectorAll(
+    'script[type="text/plain"][data-gdpr-category]:not([data-gdpr-loaded="true"])'
+  );
+
+  placeholders.forEach((element) => {
+    const category = element.dataset.gdprCategory;
+    if (!category || !instance.hasConsent(category)) {
+      return;
+    }
+
+    const src = element.dataset.gdprSrc;
+    const inlineCode = element.textContent && element.textContent.trim();
+
+    if (!src && !inlineCode) {
+      element.dataset.gdprLoaded = 'true';
+      return;
+    }
+
+    const script = document.createElement('script');
+
+    if (src) {
+      script.src = src;
+    }
+
+    if (element.dataset.gdprAsync === 'true') {
+      script.async = true;
+    }
+
+    if (element.dataset.gdprDefer === 'true') {
+      script.defer = true;
+    }
+
+    if (!src && inlineCode) {
+      script.text = inlineCode;
+    }
+
+    script.setAttribute('data-gdpr-origin', 'fivo_cookie_consent');
+
+    if (element.parentNode) {
+      element.parentNode.insertBefore(script, element);
+    }
+
+    element.dataset.gdprLoaded = 'true';
+  });
+}
+
+function bootstrapGdprScriptLoading() {
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', processGdprPlaceholders);
+  } else {
+    processGdprPlaceholders();
+  }
+
+  document.addEventListener('gdpr:accept', processGdprPlaceholders);
+  document.addEventListener('gdpr:change', processGdprPlaceholders);
+}
+
+// Export for manual initialization if needed
+const GDPRConsent = {
+  getConsent() {
+    return initGDPRCookieConsent().getAllConsent();
+  },
+  hasConsent(category) {
+    return initGDPRCookieConsent().hasConsent(category);
+  },
+  on(eventName, handler) {
+    if (!eventName || typeof handler !== 'function') {
+      return;
+    }
+    document.addEventListener(eventName, handler);
+  },
+  off(eventName, handler) {
+    if (!eventName || typeof handler !== 'function') {
+      return;
+    }
+    document.removeEventListener(eventName, handler);
+  },
+  reset() {
+    const instance = initGDPRCookieConsent();
+    instance.clearConsent();
+    instance.showBannerForced();
+  },
+  showBanner() {
+    initGDPRCookieConsent().showBannerForced();
+  },
+  showModal() {
+    initGDPRCookieConsent().showModalForced();
+  }
+};
+
+window.GDPRCookieConsent = GDPRCookieConsent;
+window.initGDPRCookieConsent = initGDPRCookieConsent;
+window.GDPRConsent = GDPRConsent;
+
+// Auto-initialize
+initGDPRCookieConsent();
+bootstrapGdprScriptLoading();
+
+// Export for ES6 modules
+export default GDPRCookieConsent;
+export { initGDPRCookieConsent, GDPRConsent };