@el7ven/cookie-kit 0.3.1 → 0.3.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@el7ven/cookie-kit",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "type": "module",
   "main": "./src/index.js",
   "module": "./src/index.js",
@@ -13,6 +13,26 @@
     "./vue": "./src/vue/index.js",
     "./analytics": "./src/core/analytics.js",
     "./config": "./src/core/index.js",
+    "./core": "./src/core/index.js",
+    "./core/ConsentManager": "./src/core/ConsentManager.js",
+    "./core/StorageAdapter": "./src/core/StorageAdapter.js",
+    "./core/ConsentMode": "./src/core/ConsentMode.js",
+    "./core/FocusTrap": "./src/core/FocusTrap.js",
+    "./core/ScriptLoader": "./src/core/ScriptLoader.js",
+    "./core/AnalyticsManager": "./src/core/AnalyticsManager.js",
+    "./core/GeoDetector": "./src/core/GeoDetector.js",
+    "./geo": "./src/geo/index.js",
+    "./geo/RegionRules": "./src/geo/RegionRules.js",
+    "./locales": "./src/locales/index.js",
+    "./providers": "./src/providers/index.js",
+    "./providers/GoogleConsentModeProvider": "./src/providers/GoogleConsentModeProvider.js",
+    "./plugins": "./src/plugins/index.js",
+    "./trackers": "./src/trackers/index.js",
+    "./rewriting": "./src/rewriting/index.js",
+    "./scripts": "./src/scripts/index.js",
+    "./utils/cookies": "./src/utils/cookies.js",
+    "./utils/dom": "./src/utils/dom.js",
+    "./utils/helpers": "./src/utils/helpers.js",
     "./composables/useCookieConsent": "./src/vue/composables/useCookieConsent.js",
     "./src/composables/useCookieConsent": "./src/vue/composables/useCookieConsent.js",
     "./package.json": "./package.json"

package/src/core/AnalyticsManager.js

@@ -0,0 +1,400 @@
+/**
+ * Analytics Manager — integrations with popular analytics services
+ * GA4, GTM, Meta Pixel, TikTok Pixel, Hotjar
+ * @module AnalyticsManager
+ */
+
+const ANALYTICS_PROVIDERS = {
+  ga4: {
+    category: 'analytics',
+    load: (config) => {
+      const id = config.GA_ID || config.id
+      if (!id) return
+
+      // gtag.js is already loaded in head.blade.php, just configure
+      if (window.gtag) {
+        // Google Consent Mode V2 - update consent to granted
+        gtag('consent', 'update', {
+          'analytics_storage': 'granted',
+          'ad_storage': 'denied',
+          'ad_user_data': 'denied',
+          'ad_personalization': 'denied'
+        })
+
+        // Configure GA4 with IP anonymization (GDPR requirement)
+        gtag('config', id, {
+          anonymize_ip: true
+        })
+      }
+
+      return true // Return success flag
+    },
+    unload: (config) => {
+      const id = config.GA_ID || config.id
+      
+      // Update consent to denied
+      if (window.gtag) {
+        gtag('consent', 'update', {
+          'analytics_storage': 'denied',
+          'ad_storage': 'denied',
+          'ad_user_data': 'denied',
+          'ad_personalization': 'denied'
+        })
+      }
+      
+      // Remove ALL GA cookies (including _ga_XXXX and _gat)
+      const cookies = document.cookie.split(';')
+      cookies.forEach(cookie => {
+        const name = cookie.split('=')[0].trim()
+        if (name.startsWith('_ga') || name.startsWith('_gid') || name.startsWith('_gat')) {
+          document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`
+        }
+      })
+    }
+  },
+
+  gtm: {
+    category: 'analytics',
+    load: (config) => {
+      const id = config.GTM_ID || config.id
+      if (!id) return
+
+      window.dataLayer = window.dataLayer || []
+      
+      // Google Consent Mode V2 - set consent to granted
+      window.dataLayer.push({
+        'event': 'consent_update',
+        'analytics_storage': 'granted',
+        'ad_storage': 'denied',
+        'ad_user_data': 'denied',
+        'ad_personalization': 'denied'
+      })
+      
+      window.dataLayer.push({
+        'gtm.start': new Date().getTime(),
+        event: 'gtm.js'
+      })
+
+      const script = document.createElement('script')
+      script.async = true
+      script.src = `https://www.googletagmanager.com/gtm.js?id=${id}`
+      document.head.appendChild(script)
+
+      return script
+    },
+    unload: (config) => {
+      const id = config.GTM_ID || config.id
+      
+      // Google Consent Mode V2 - set consent to denied
+      if (window.dataLayer) {
+        window.dataLayer.push({
+          'event': 'consent_update',
+          'analytics_storage': 'denied',
+          'ad_storage': 'denied',
+          'ad_user_data': 'denied',
+          'ad_personalization': 'denied'
+        })
+      }
+      
+      const scripts = document.querySelectorAll(`script[src*="googletagmanager.com/gtm.js?id=${id}"]`)
+      scripts.forEach(s => s.remove())
+    }
+  },
+
+  metaPixel: {
+    category: 'marketing',
+    load: (config) => {
+      const id = config.PIXEL_ID || config.id
+      if (!id) return
+
+      /* eslint-disable */
+      !function(f,b,e,v,n,t,s)
+      {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
+      n.callMethod.apply(n,arguments):n.queue.push(arguments)};
+      if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
+      n.queue=[];t=b.createElement(e);t.async=!0;
+      t.src=v;s=b.getElementsByTagName(e)[0];
+      s.parentNode.insertBefore(t,s)}(window, document,'script',
+      'https://connect.facebook.net/en_US/fbevents.js');
+      /* eslint-enable */
+
+      window.fbq('init', id)
+      window.fbq('track', 'PageView')
+    },
+    unload: () => {
+      delete window.fbq
+      delete window._fbq
+      const scripts = document.querySelectorAll('script[src*="connect.facebook.net"]')
+      scripts.forEach(s => s.remove())
+    }
+  },
+
+  yandexMetrica: {
+    category: 'analytics',
+    load: (config) => {
+      const id = config.YANDEX_ID || config.id
+      console.log('[AnalyticsManager] Yandex Metrica: Attempting to load with ID:', id)
+      if (!id) {
+        console.log('[AnalyticsManager] Yandex Metrica: No ID provided, skipping')
+        return
+      }
+
+      // Yandex.Metrika initialization with proper parameters
+      (function(m,e,t,r,i,k,a){
+        m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
+        m[i].l=1*new Date();
+        for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
+        k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)
+      })(window, document,'script','https://mc.yandex.ru/metrika/tag.js?id=' + id, 'ym');
+
+      ym(id, 'init', {
+        ssr: true,
+        webvisor: true,
+        clickmap: true,
+        ecommerce: "dataLayer",
+        referrer: document.referrer,
+        url: location.href,
+        accurateTrackBounce: true,
+        trackLinks: true
+      });
+      console.log('[AnalyticsManager] Yandex Metrica: Initialized with ID:', id)
+
+      return id
+    },
+    unload: (config) => {
+      const id = config.YANDEX_ID || config.id
+      console.log('[AnalyticsManager] Yandex Metrica: Unloading with ID:', id)
+      
+      // Remove Yandex cookies
+      const cookies = document.cookie.split(';')
+      let removedCookies = []
+      cookies.forEach(cookie => {
+        const name = cookie.split('=')[0].trim()
+        if (name.includes('yandex') || name.includes('ym') || name.includes('_ym')) {
+          document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`
+          removedCookies.push(name)
+        }
+      })
+      console.log('[AnalyticsManager] Yandex Metrica: Removed cookies:', removedCookies)
+      
+      // Remove script
+      const scripts = document.querySelectorAll('script[src*="yandex.ru/metrika"]')
+      scripts.forEach(s => s.remove())
+      console.log('[AnalyticsManager] Yandex Metrica: Removed scripts:', scripts.length)
+      
+      // Remove noscript image
+      const noscriptImgs = document.querySelectorAll('img[src*="yandex.ru/watch"]')
+      noscriptImgs.forEach(img => img.remove())
+      console.log('[AnalyticsManager] Yandex Metrica: Removed noscript images:', noscriptImgs.length)
+    }
+  },
+
+  googleRemarketing: {
+    category: 'marketing',
+    load: (config) => {
+      const id = config.REMARKETING_ID || config.id
+      console.log('[AnalyticsManager] Google Remarketing: Attempting to load with ID:', id)
+      if (!id) {
+        console.log('[AnalyticsManager] Google Remarketing: No ID provided, skipping')
+        return
+      }
+
+      window.google_tag_params = window.google_tag_params || {};
+      window.google_conversion_id = id;
+      window.google_conversion_label = '';
+      window.google_remarketing_only = true;
+      
+      const script = document.createElement('script')
+      script.src = `//www.googleadservices.com/pagead/conversion.js`
+      document.head.appendChild(script)
+      console.log('[AnalyticsManager] Google Remarketing: Script appended to head')
+
+      return script
+    },
+    unload: (config) => {
+      const id = config.REMARKETING_ID || config.id
+      console.log('[AnalyticsManager] Google Remarketing: Unloading with ID:', id)
+      
+      // Remove remarketing cookies
+      const cookies = document.cookie.split(';')
+      let removedCookies = []
+      cookies.forEach(cookie => {
+        const name = cookie.split('=')[0].trim()
+        if (name.includes('_ga') || name.includes('google')) {
+          document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`
+          removedCookies.push(name)
+        }
+      })
+      console.log('[AnalyticsManager] Google Remarketing: Removed cookies:', removedCookies)
+      
+      // Remove script
+      const scripts = document.querySelectorAll('script[src*="googleadservices.com"]')
+      scripts.forEach(s => s.remove())
+      console.log('[AnalyticsManager] Google Remarketing: Removed scripts:', scripts.length)
+    }
+  },
+
+  tiktokPixel: {
+    category: 'marketing',
+    load: (config) => {
+      const id = config.TIKTOK_ID || config.id
+      if (!id) return
+
+      /* eslint-disable */
+      !function(w,d,t){w.TiktokAnalyticsObject=t;var ttq=w[t]=w[t]||[];
+      ttq.methods=["page","track","identify","instances","debug","on","off","once","ready","alias","group","enableCookie","disableCookie"];
+      ttq.setAndDefer=function(t,e){t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}};
+      for(var i=0;i<ttq.methods.length;i++)ttq.setAndDefer(ttq,ttq.methods[i]);
+      ttq.instance=function(t){for(var e=ttq._i[t]||[],n=0;n<ttq.methods.length;n++)ttq.setAndDefer(e,ttq.methods[n]);return e};
+      ttq.load=function(e,n){var i="https://analytics.tiktok.com/i18n/pixel/events.js";
+      ttq._i=ttq._i||{};ttq._i[e]=[];ttq._i[e]._u=i;ttq._t=ttq._t||{};ttq._t[e]=+new Date;
+      ttq._o=ttq._o||{};ttq._o[e]=n||{};
+      var o=document.createElement("script");o.type="text/javascript";o.async=!0;o.src=i+"?sdkid="+e+"&lib="+t;
+      var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(o,a)};
+      }(window,document,"ttq");
+      /* eslint-enable */
+
+      window.ttq.load(id)
+      window.ttq.page()
+    },
+    unload: () => {
+      delete window.ttq
+      const scripts = document.querySelectorAll('script[src*="analytics.tiktok.com"]')
+      scripts.forEach(s => s.remove())
+    }
+  },
+
+  hotjar: {
+    category: 'analytics',
+    load: (config) => {
+      const id = config.HOTJAR_ID || config.id
+      if (!id) return
+
+      /* eslint-disable */
+      ;(function(h,o,t,j,a,r){
+        h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
+        h._hjSettings={hjid:id,hjsv:6};
+        a=o.getElementsByTagName('head')[0];
+        r=o.createElement('script');r.async=1;
+        r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
+        a.appendChild(r);
+      })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
+      /* eslint-enable */
+    },
+    unload: () => {
+      delete window.hj
+      delete window._hjSettings
+      const scripts = document.querySelectorAll('script[src*="static.hotjar.com"]')
+      scripts.forEach(s => s.remove())
+    }
+  }
+}
+
+export class AnalyticsManager {
+  constructor(consentManager, config = {}) {
+    this.manager = consentManager
+    this.config = config
+    this.activeProviders = new Set()
+
+    // Initialize Google Consent Mode V2 with default denied consent
+    this._initializeConsentMode()
+
+    this._init()
+  }
+
+  _initializeConsentMode() {
+    // Set default consent to denied (GDPR compliant) - only once
+    if (!window.gtag) {
+      window.dataLayer = window.dataLayer || []
+      window.gtag = function gtag() {
+        window.dataLayer.push(arguments)
+      }
+    }
+
+    // Set default consent to denied (GDPR compliant)
+    gtag('consent', 'default', {
+      'analytics_storage': 'denied',
+      'ad_storage': 'denied',
+      'ad_user_data': 'denied',
+      'ad_personalization': 'denied',
+      'wait_for_update': 500 // Prevent race conditions
+    })
+  }
+
+  _init() {
+    if (typeof window === 'undefined') return
+
+    // Listen for consent changes
+    this.manager.on('consentChanged', ({ categories }) => {
+      this._syncProviders(categories)
+    })
+
+    // Check existing consent
+    const consent = this.manager.getConsent()
+    if (consent?.hasConsented) {
+      this._syncProviders(consent.categories)
+    }
+
+    this.manager._debug('AnalyticsManager: initialized')
+  }
+
+  _syncProviders(categories) {
+    // When using direct gtag.js, both GA4 and GTM can work together
+    const hasGTM = this.config.gtm && (this.config.gtm.id || this.config.gtm.GTM_ID)
+    const hasGA4 = this.config.ga4 && (this.config.ga4.id || this.config.ga4.GA_ID)
+    
+    Object.entries(this.config).forEach(([providerName, providerConfig]) => {
+      const provider = ANALYTICS_PROVIDERS[providerName]
+      if (!provider || !providerConfig) return
+
+      const category = providerConfig.category || provider.category
+      const granted = categories[category] === true
+
+      if (granted && !this.activeProviders.has(providerName)) {
+        // Load provider
+        try {
+          provider.load(providerConfig)
+          this.activeProviders.add(providerName)
+        } catch (e) {
+          this.manager._debug('AnalyticsManager: load error', providerName, e)
+        }
+      } else if (!granted && this.activeProviders.has(providerName)) {
+        // Unload provider
+        try {
+          provider.unload(providerConfig)
+          this.activeProviders.delete(providerName)
+        } catch (e) {
+          this.manager._debug('AnalyticsManager: unload error', providerName, e)
+        }
+      }
+    })
+  }
+
+  /**
+   * Register a custom analytics provider
+   */
+  registerProvider(name, provider) {
+    ANALYTICS_PROVIDERS[name] = provider
+    this.manager._debug('AnalyticsManager: registered custom provider', name)
+  }
+
+  /**
+   * Get active providers
+   */
+  getActiveProviders() {
+    return [...this.activeProviders]
+  }
+
+  destroy() {
+    // Unload all active providers
+    this.activeProviders.forEach(name => {
+      const provider = ANALYTICS_PROVIDERS[name]
+      if (provider?.unload) {
+        provider.unload(this.config[name] || {})
+      }
+    })
+    this.activeProviders.clear()
+  }
+}
+
+export { ANALYTICS_PROVIDERS }