@el7ven/cookie-kit 0.2.16 → 0.2.18

package/README.md

@@ -1,8 +1,8 @@
-# @el7ven/cookie-consent
+# @el7ven/cookie-kit
 
-> Unified cookie consent management for GDPR compliance with React and Vue support
+> Unified cookie consent management kit for GDPR compliance with React, Vue, and Vanilla JS support
 
-[![npm version](https://badge.fury.io/js/@el7ven%2Fcookie-consent.svg)](https://badge.fury.io/js/@el7ven%2Fcookie-consent)
+[![npm version](https://badge.fury.io/js/@el7ven%2Fcookie-kit.svg)](https://badge.fury.io/js/@el7ven%2Fcookie-kit)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
 A comprehensive, production-ready cookie consent solution that helps websites comply with GDPR and other privacy regulations. Built with modern JavaScript and supports React, Vue, and vanilla JS applications.
@@ -21,7 +21,7 @@ A comprehensive, production-ready cookie consent solution that helps websites co
 ## 📦 Installation
 
 ```bash
-npm install @el7ven/cookie-consent@beta
+npm install @el7ven/cookie-kit
 ```
 
 ## 🚀 Quick Start
@@ -29,8 +29,8 @@ npm install @el7ven/cookie-consent@beta
 ### Vanilla JavaScript
 
 ```javascript
-import { createCookieConsent } from '@el7ven/cookie-consent'
-import '@el7ven/cookie-consent/styles'
+import { createCookieConsent } from '@el7ven/cookie-kit'
+import '@el7ven/cookie-kit/styles'
 
 const cookieConsent = await createCookieConsent({
   categories: {
@@ -54,8 +54,8 @@ console.log('Analytics enabled:', consent.categories.analytics.enabled)
 ### React
 
 ```jsx
-import { CookieKitProvider, useCookieKit } from '@el7ven/cookie-consent/react'
-import '@el7ven/cookie-consent/styles'
+import { CookieKitProvider, useCookieKit } from '@el7ven/cookie-kit/react'
+import '@el7ven/cookie-kit/styles'
 
 function App() {
   return (
@@ -95,8 +95,8 @@ function MyComponent() {
 </template>
 
 <script setup>
-import { useCookieKit } from '@el7ven/cookie-consent/vue'
-import '@el7ven/cookie-consent/styles'
+import { useCookieKit } from '@el7ven/cookie-kit/vue'
+import '@el7ven/cookie-kit/styles'
 
 const { consent, acceptAll, rejectAll } = useCookieKit({
   categories: {
@@ -170,7 +170,7 @@ const config = {
 ### Custom Components
 
 ```javascript
-import { createCookieKit } from '@el7ven/cookie-consent'
+import { createCookieKit } from '@el7ven/cookie-kit'
 
 const cookieKit = createCookieKit(config)
 
@@ -188,7 +188,7 @@ const consent = cookieKit.getConsent()
 
 ## 📄 License
 
-MIT © [Igor Semionov](https://github.com/El7ven)
+MIT © [El7ven](https://github.com/El7ven)
 
 ## 🤝 Contributing
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@el7ven/cookie-kit",
-  "version": "0.2.16",
+  "version": "0.2.18",
   "type": "module",
   "main": "./src/index.js",
   "module": "./src/index.js",

package/src/vue/composables/useCookieConsent.js

@@ -4,9 +4,10 @@ export function useCookieConsent(config = {}) {
   const isVisible = ref(false)
   const isSettingsMode = ref(false)
   const currentTab = ref('categories')
-  const consentVersion = ref('1.0.0')
+  const consentVersion = ref(config.consentVersion || '1.0.0')
   
-  const categories = ref({
+  // Use config categories or default
+  const categories = ref(config.categories || {
     necessary: { 
       required: true, 
       enabled: true, 
@@ -35,17 +36,19 @@ export function useCookieConsent(config = {}) {
     canCustomize: true
   })
   
-  const isV2 = ref(true)
+  const isV2 = ref(consentVersion.value === 'v2')
   
   const hasConsent = computed(() => {
     return localStorage.getItem('cookie-consent') !== null
   })
   
-  const consentData = computed(() => {
+  const consent = computed(() => {
     const stored = localStorage.getItem('cookie-consent')
     return stored ? JSON.parse(stored) : null
   })
   
+  const consentData = computed(() => consent.value)
+  
   const showConsent = () => {
     isVisible.value = true
   }
@@ -54,6 +57,10 @@ export function useCookieConsent(config = {}) {
     isVisible.value = false
   }
   
+  const showSettings = () => {
+    isSettingsMode.value = true
+  }
+  
   const openSettings = () => {
     isSettingsMode.value = true
   }
@@ -62,10 +69,19 @@ export function useCookieConsent(config = {}) {
     isSettingsMode.value = false
   }
   
+  const close = () => {
+    isVisible.value = false
+    isSettingsMode.value = false
+  }
+  
   const selectTab = (tab) => {
     currentTab.value = tab
   }
   
+  const setTab = (tab) => {
+    currentTab.value = tab
+  }
+  
   const toggleCategory = (categoryName, enabled) => {
     if (categories.value[categoryName] && !categories.value[categoryName].required) {
       categories.value[categoryName].enabled = enabled
@@ -73,7 +89,7 @@ export function useCookieConsent(config = {}) {
   }
   
   const acceptSelection = () => {
-    const consent = {
+    const consentRecord = {
       version: consentVersion.value,
       timestamp: new Date().toISOString(),
       categories: Object.keys(categories.value).reduce((acc, key) => {
@@ -82,7 +98,7 @@ export function useCookieConsent(config = {}) {
       }, {})
     }
     
-    localStorage.setItem('cookie-consent', JSON.stringify(consent))
+    localStorage.setItem('cookie-consent', JSON.stringify(consentRecord))
     capabilities.value.hasConsented = true
     hideConsent()
     closeSettings()
@@ -104,6 +120,10 @@ export function useCookieConsent(config = {}) {
     acceptSelection()
   }
   
+  const acceptSelected = () => {
+    acceptSelection()
+  }
+  
   const resetConsent = () => {
     localStorage.removeItem('cookie-consent')
     capabilities.value.hasConsented = false
@@ -114,6 +134,33 @@ export function useCookieConsent(config = {}) {
     })
   }
   
+  // Focus trap functions
+  let activeElement = null
+  
+  const activateFocusTrap = (element) => {
+    if (!element) return
+    
+    activeElement = document.activeElement
+    const focusableElements = element.querySelectorAll(
+      'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+    )
+    
+    if (focusableElements.length > 0) {
+      focusableElements[0].focus()
+    }
+  }
+  
+  const deactivateFocusTrap = () => {
+    if (activeElement && activeElement.focus) {
+      activeElement.focus()
+    }
+    activeElement = null
+  }
+  
+  const cleanup = () => {
+    deactivateFocusTrap()
+  }
+  
   const handleClose = () => {
     hideConsent()
     closeSettings()
@@ -151,6 +198,10 @@ export function useCookieConsent(config = {}) {
     }
   })
   
+  onUnmounted(() => {
+    cleanup()
+  })
+  
   return {
     isVisible,
     isSettingsMode,
@@ -160,17 +211,25 @@ export function useCookieConsent(config = {}) {
     isV2,
     consentVersion,
     hasConsent,
+    consent,
     consentData,
     showConsent,
     hideConsent,
+    showSettings,
     openSettings,
     closeSettings,
+    close,
     selectTab,
+    setTab,
     toggleCategory,
     acceptSelection,
     acceptAll,
     rejectAll,
+    acceptSelected,
     resetConsent,
+    activateFocusTrap,
+    deactivateFocusTrap,
+    cleanup,
     handleClose,
     handleOpenSettings,
     handleSelectTab,