@el7ven/cookie-kit 0.2.19 → 0.2.21

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@el7ven/cookie-kit",
-  "version": "0.2.19",
+  "version": "0.2.21",
   "type": "module",
   "main": "./src/index.js",
   "module": "./src/index.js",
@@ -11,8 +11,10 @@
     "./dist/styles": "./dist/styles/index.css",
     "./react": "./src/react/index.js",
     "./vue": "./src/vue/index.js",
-    "./src/composables/useCookieConsent": "./src/vue/composables/useCookieConsent.js",
+    "./analytics": "./src/core/analytics.js",
+    "./config": "./src/core/index.js",
     "./composables/useCookieConsent": "./src/vue/composables/useCookieConsent.js",
+    "./src/composables/useCookieConsent": "./src/vue/composables/useCookieConsent.js",
     "./package.json": "./package.json"
   },
   "files": [

package/src/core/analytics.js

@@ -0,0 +1,220 @@
+/**
+ * @el7ven/cookie-kit - Analytics Integration Module
+ * Google Consent Mode v2, GTM, GA4, Meta Pixel, Yandex Metrica
+ */
+
+/**
+ * Initialize Google Consent Mode v2 with default denied state
+ */
+export function initGoogleConsentMode() {
+  if (typeof window === 'undefined') return
+
+  window.dataLayer = window.dataLayer || []
+  window.gtag = window.gtag || function gtag() { window.dataLayer.push(arguments) }
+
+  // Set default consent state - all denied until user consents
+  window.gtag('consent', 'default', {
+    ad_storage: 'denied',
+    ad_user_data: 'denied',
+    ad_personalization: 'denied',
+    analytics_storage: 'denied',
+    functionality_storage: 'denied',
+    personalization_storage: 'denied',
+    security_storage: 'granted' // Always granted for security
+  })
+}
+
+/**
+ * Update Google Consent Mode based on cookie consent categories
+ * @param {Object} categories - { analytics: true, marketing: false, preferences: true }
+ */
+export function updateGoogleConsent(categories = {}) {
+  if (typeof window === 'undefined' || !window.gtag) return
+
+  const consentUpdate = {
+    analytics_storage: categories.analytics ? 'granted' : 'denied',
+    ad_storage: categories.marketing ? 'granted' : 'denied',
+    ad_user_data: categories.marketing ? 'granted' : 'denied',
+    ad_personalization: categories.marketing ? 'granted' : 'denied',
+    functionality_storage: categories.preferences ? 'granted' : 'denied',
+    personalization_storage: categories.preferences ? 'granted' : 'denied',
+    security_storage: 'granted'
+  }
+
+  window.gtag('consent', 'update', consentUpdate)
+}
+
+/**
+ * Load Google Tag Manager
+ * @param {string} gtmId - GTM container ID (e.g., 'GTM-XXXXX')
+ */
+export function loadGTM(gtmId) {
+  if (!gtmId || typeof document === 'undefined') return
+
+  const script = document.createElement('script')
+  script.async = true
+  script.src = `https://www.googletagmanager.com/gtm.js?id=${gtmId}`
+  document.head.appendChild(script)
+
+  window.dataLayer = window.dataLayer || []
+  window.dataLayer.push({
+    'gtm.start': new Date().getTime(),
+    event: 'gtm.js'
+  })
+}
+
+/**
+ * Load Google Analytics 4
+ * @param {string} ga4Id - GA4 measurement ID (e.g., 'G-XXXXX')
+ */
+export function loadGA4(ga4Id) {
+  if (!ga4Id || typeof document === 'undefined') return
+
+  const script = document.createElement('script')
+  script.async = true
+  script.src = `https://www.googletagmanager.com/gtag/js?id=${ga4Id}`
+  document.head.appendChild(script)
+
+  window.dataLayer = window.dataLayer || []
+  window.gtag = window.gtag || function gtag() { window.dataLayer.push(arguments) }
+  window.gtag('js', new Date())
+  window.gtag('config', ga4Id)
+}
+
+/**
+ * Load Meta (Facebook) Pixel
+ * @param {string} pixelId - Meta Pixel ID
+ */
+export function loadMetaPixel(pixelId) {
+  if (!pixelId || typeof window === 'undefined') 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', pixelId)
+  window.fbq('track', 'PageView')
+}
+
+/**
+ * Load Yandex Metrica
+ * @param {string} counterId - Yandex Metrica counter ID
+ */
+export function loadYandexMetrica(counterId) {
+  if (!counterId || typeof document === 'undefined') return
+
+  /* eslint-disable */
+  (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", "ym");
+  /* eslint-enable */
+
+  window.ym(counterId, 'init', {
+    clickmap: true,
+    trackLinks: true,
+    accurateTrackBounce: true,
+    webvisor: true
+  })
+}
+
+/**
+ * Block/unblock scripts based on consent categories
+ * Scripts with data-cookie-category attribute will be managed
+ * @param {Object} categories - { analytics: true, marketing: false }
+ */
+export function manageScriptBlocking(categories = {}) {
+  if (typeof document === 'undefined') return
+
+  document.querySelectorAll('script[data-cookie-category]').forEach(script => {
+    const category = script.getAttribute('data-cookie-category')
+    if (categories[category]) {
+      // Re-enable script
+      if (script.type === 'text/plain' && script.dataset.originalSrc) {
+        const newScript = document.createElement('script')
+        newScript.src = script.dataset.originalSrc
+        newScript.async = true
+        script.parentNode.replaceChild(newScript, script)
+      }
+    }
+  })
+}
+
+/**
+ * Create analytics manager that auto-integrates with cookie consent
+ * @param {Object} config - { ga4: 'G-XXX', gtm: 'GTM-XXX', metaPixel: 'XXX', yandexMetrica: 'XXX' }
+ * @returns {Object} Analytics manager instance
+ */
+export function createAnalyticsManager(config = {}) {
+  let initialized = false
+
+  const init = () => {
+    if (initialized) return
+    initialized = true
+
+    // Always init Google Consent Mode first (denied by default)
+    initGoogleConsentMode()
+
+    // Load GTM if configured (it respects consent mode)
+    if (config.gtm) loadGTM(config.gtm)
+  }
+
+  const onConsentUpdate = (categories = {}) => {
+    // Update Google Consent Mode
+    updateGoogleConsent(categories)
+
+    // Load analytics scripts based on consent
+    if (categories.analytics) {
+      if (config.ga4) loadGA4(config.ga4)
+      if (config.yandexMetrica) loadYandexMetrica(config.yandexMetrica)
+    }
+
+    if (categories.marketing) {
+      if (config.metaPixel) loadMetaPixel(config.metaPixel)
+    }
+
+    // Manage script blocking
+    manageScriptBlocking(categories)
+  }
+
+  const connectToCookieConsent = () => {
+    if (typeof window === 'undefined') return
+
+    // Wait for CookieConsent to be available
+    const checkInterval = setInterval(() => {
+      if (window.CookieConsent) {
+        clearInterval(checkInterval)
+
+        // Check if consent already given
+        const currentConsent = window.CookieConsent.getConsent()
+        if (currentConsent?.categories) {
+          onConsentUpdate(currentConsent.categories)
+        }
+
+        // Listen for future changes
+        window.CookieConsent.on('consentChanged', ({ consent }) => {
+          if (consent?.categories) {
+            onConsentUpdate(consent.categories)
+          }
+        })
+      }
+    }, 100)
+
+    // Stop checking after 10 seconds
+    setTimeout(() => clearInterval(checkInterval), 10000)
+  }
+
+  return {
+    init,
+    onConsentUpdate,
+    connectToCookieConsent
+  }
+}

package/src/core/index.js

@@ -1,13 +1,120 @@
 import { VERSION, getVersion, getVersionInfo, logVersion } from './version.js'
 
 const DEFAULT_CONFIG = {
-  storageKey: 'cookie_consent',
+  // Version and revision for consent invalidation
+  version: 'v2',
+  revision: 0,
+  
+  // GDPR compliance
   consentExpireDays: 365,
+  auditLog: false,
+  
+  // Storage
+  storageKey: 'cookie_consent',
+  storageType: 'localStorage', // 'localStorage' | 'cookie' | 'both'
+  
+  // Mode
+  mode: 'gdpr', // 'gdpr' | 'essential'
+  
+  // Auto show
+  autoShow: true,
+  
+  // Debug
+  debug: false,
+  
+  // Region (optional)
+  region: null, // 'EU' | 'US' | 'OTHER'
+  
+  // Categories
   categories: {
-    necessary: { required: true, enabled: true },
-    analytics: { required: false, enabled: false },
-    marketing: { required: false, enabled: false },
-    preferences: { required: false, enabled: false }
+    necessary: {
+      id: 'necessary',
+      label: 'Necesare',
+      description: 'Cookie-uri esențiale pentru funcționarea site-ului',
+      required: true,
+      locked: true,
+      enabled: true
+    },
+    analytics: {
+      id: 'analytics',
+      label: 'Analiză',
+      description: 'Cookie-uri pentru analiza traficului și comportamentului utilizatorilor',
+      required: false,
+      locked: false,
+      enabled: true
+    },
+    marketing: {
+      id: 'marketing',
+      label: 'Marketing',
+      description: 'Cookie-uri pentru publicitate personalizată',
+      required: false,
+      locked: false,
+      enabled: true
+    },
+    preferences: {
+      id: 'preferences',
+      label: 'Preferințe',
+      description: 'Cookie-uri pentru salvarea preferințelor utilizatorului',
+      required: false,
+      locked: false,
+      enabled: true
+    }
+  },
+  
+  // Texts
+  texts: {
+    essential: {
+      title: '🍪 Файлы Cookie',
+      message: 'Мы используем необходимые файлы cookie для работы сайта. Никакой аналитики и маркетинга.',
+      button: 'Принять'
+    },
+    gdpr: {
+      title: 'Preferințe Cookie-uri',
+      message: 'Folosim cookie-uri pentru a-ți oferi cea mai bună experiență. Alege ce tipuri de cookie-uri accepți.',
+      buttons: {
+        acceptAll: 'Acceptă toate',
+        rejectAll: 'Respinge toate',
+        acceptSelection: 'Acceptă selecția',
+        settings: 'Setări'
+      }
+    },
+    settings: {
+      title: 'Setări Cookie-uri',
+      tabs: {
+        privacy: 'Confidențialitate'
+      },
+      buttons: {
+        acceptAll: 'Acceptă toate',
+        rejectAll: 'Respinge toate',
+        acceptSelection: 'Salvează selecția'
+      },
+      links: {
+        moreInfo: 'Mai multe informații',
+        cookieDetails: 'Detalii cookie-uri'
+      }
+    }
+  },
+  
+  // Policy links
+  policies: {
+    privacy: '/privacy-policy',
+    cookies: '/cookie-policy'
+  },
+  
+  // Display options
+  display: {
+    position: 'bottom-right', // 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left' | 'center'
+    backdrop: true,
+    closeOnBackdrop: true
+  },
+  
+  // Analytics providers (optional)
+  analytics: null,
+  
+  // Script blocking (optional)
+  scriptBlocking: {
+    enabled: true,
+    strategy: 'data-category' // 'data-category' | 'type-rewrite'
   }
 }
 

package/src/index.js

@@ -8,8 +8,12 @@
 // Core functionality
 export { createCookieKit, CookieKitCore, DEFAULT_CONFIG } from './core/index.js'
 
+// Analytics integration
+export { createAnalyticsManager, initGoogleConsentMode, updateGoogleConsent, loadGTM, loadGA4, loadMetaPixel, loadYandexMetrica, manageScriptBlocking } from './core/analytics.js'
+
 // Import for default export
 import { createCookieKit, CookieKitCore, DEFAULT_CONFIG } from './core/index.js'
+import { createAnalyticsManager } from './core/analytics.js'
 import { initCookieKit } from './js/index.js'
 import { VERSION } from './core/version.js'
 
@@ -22,6 +26,9 @@ export * from './react/index.js'
 // Vue components  
 export * from './vue/index.js'
 
+// Vue composable
+export { useCookieConsent } from './vue/composables/useCookieConsent.js'
+
 // Version info
 export { VERSION, getVersion, getVersionInfo, logVersion } from './core/version.js'
 
@@ -59,6 +66,7 @@ export function autoCookieConsent(config = {}) {
 export default {
   createCookieKit,
   createCookieConsent,
+  createAnalyticsManager,
   autoCookieConsent,
   initCookieKit,
   CookieKitCore,