@dargmuesli/nuxt-cookie-control 2.0.0-beta.5 → 2.0.0-beta.7

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "@dargmuesli/nuxt-cookie-control",
-  "version": "2.0.0-beta.5",
+  "version": "2.0.0-beta.7",
   "configKey": "cookieControl",
   "compatibility": {
     "nuxt": "^3.0.0"

package/dist/module.mjs

@@ -11,7 +11,7 @@ const __filename = __cjs_url__.fileURLToPath(import.meta.url);
 const __dirname = __cjs_path__.dirname(__filename);
 const require = __cjs_mod__.createRequire(import.meta.url);
 const name = "@dargmuesli/nuxt-cookie-control";
-const version = "2.0.0-beta.5";
+const version = "2.0.0-beta.7";
 
 const en = {
   acceptAll: "Accept all",

package/dist/runtime/components/CookieControl.vue

@@ -85,8 +85,7 @@
                         type="checkbox"
                         :checked="
                           cookiesEnabledIds.includes(getCookieId(cookie)) ||
-                          (Cookies.get('cookie_control_consent')?.length ===
-                            0 &&
+                          (getCookieControlConsent()?.length === 0 &&
                             typeof moduleOptions.isIframeBlocked === 'object' &&
                             moduleOptions.isIframeBlocked.initialState)
                         "
@@ -127,7 +126,9 @@
                   v-text="localeStrings?.acceptAll"
                 />
                 <button
-                  @click="setConsent({ declineAll: true, consent: false })"
+                  @click="
+                    setConsent({ declineAll: true, isConsentGiven: false })
+                  "
                   v-text="localeStrings?.declineAll"
                 />
               </div>
@@ -140,15 +141,16 @@
 </template>
 
 <script setup lang="ts">
-import Cookies from 'js-cookie'
 import { ref, computed, onBeforeMount } from 'vue'
 
 import { Cookie, CookieType, Locale, Translatable } from '../types'
 import {
+  getCookieControlConsent,
   getCookieId,
   useAcceptNecessary,
   useSetConsent,
   useResolveTranslatable,
+  setCookies,
 } from '../methods'
 
 import { useCookieControl } from '#imports'
@@ -187,34 +189,31 @@ const toogleCookie = (cookie: Cookie) => {
 }
 const setConsent = ({
   type = undefined,
-  consent = true,
+  isConsentGiven = true,
   reload = true,
   declineAll = false,
 }: {
   type?: 'partial'
-  consent?: boolean
+  isConsentGiven?: boolean
   reload?: boolean
   declineAll?: boolean
 }) => {
-  const enabledCookies = declineAll
+  const cookieIds = declineAll
     ? []
-    : type === 'partial' && consent
+    : type === 'partial' && isConsentGiven
     ? cookiesEnabledIds.value
-    : moduleOptions.cookies.optional.map((cookie) => getCookieId(cookie))
+    : moduleOptions.cookies.optional.map((cookie: Cookie) =>
+        getCookieId(cookie)
+      )
 
   const expirationDate = new Date()
   expirationDate.setFullYear(expirationDate.getFullYear() + 1)
 
-  Cookies.set('cookie_control_consent', consent.toString(), {
+  setCookies({
+    isConsentGiven,
+    cookieIds,
     expires: expirationDate,
   })
-  Cookies.set(
-    'cookie_control_enabled_cookies',
-    consent ? enabledCookies.join(',') : '',
-    {
-      expires: expirationDate,
-    }
-  )
 
   if (reload) {
     window.location.reload()
@@ -258,7 +257,7 @@ onBeforeMount(async () => {
     }
   }
 
-  const cookieControlConsent = Cookies.get('cookie_control_consent')
+  const cookieControlConsent = getCookieControlConsent()
 
   if (!cookieControlConsent || !cookieControlConsent.length) {
     for (const cookieOptional of moduleOptions.cookies.optional) {

package/dist/runtime/components/CookieIframe.vue

@@ -6,7 +6,7 @@
         {{ localeStrings?.blockedIframe }}
         <a
           href="#"
-          @click.prevent="cookieControl.isModalActive.value = true"
+          @click.prevent="isModalActive = true"
           v-text="localeStrings?.here"
         />
       </p>
@@ -18,7 +18,7 @@
 import { computed } from 'vue'
 
 import { LOCALE_DEFAULT } from '../constants'
-import { Locale } from '../types'
+import { Cookie, Locale } from '../types'
 
 import { useCookieControl } from '#imports'
 
@@ -29,15 +29,14 @@ const props = withDefaults(defineProps<Props>(), {
   locale: LOCALE_DEFAULT,
 })
 
-const cookieControl = useCookieControl()
+const { cookiesEnabled, isModalActive, moduleOptions } = useCookieControl()
 
 // computations
 const isCookieFunctionalEnabled = computed(
   () =>
-    cookieControl.cookiesEnabled.value.filter((c) => c.name === 'functional')
-      .length > 0
-)
-const localeStrings = computed(
-  () => cookieControl.moduleOptions.localeTexts[props.locale]
+    cookiesEnabled.value.filter(
+      (cookieEnabled: Cookie) => cookieEnabled.name === 'functional'
+    ).length > 0
 )
+const localeStrings = computed(() => moduleOptions.localeTexts[props.locale])
 </script>

package/dist/runtime/methods.d.ts

@@ -1,8 +1,8 @@
 import { Ref } from 'vue';
-import { Cookie, Locale, ModuleOptions, Translatable } from './types';
+import { Cookie, ModuleOptions, Translatable } from './types';
 export declare const useAcceptNecessary: () => () => void;
-export declare const acceptNecessary: (enabled: Ref<Cookie[]>, consent: Ref<boolean>, necessaryCookies?: Cookie[]) => void;
-export declare const useResolveTranslatable: (locale?: Locale) => (translatable: Translatable) => string;
+export declare const acceptNecessary: (cookiesEnabledRef: Ref<Cookie[]>, isConsentGivenRef: Ref<boolean>, cookiesNecessary?: Cookie[]) => void;
+export declare const useResolveTranslatable: (locale?: import("./types").Locale) => (translatable: Translatable) => string;
 export declare const useSetConsent: () => () => void;
 export declare const setConsent: ({ isInit, isConsentGiven, moduleOptions, cookiesEnabled, cookiesEnabledIds, }: {
     isInit: boolean;
@@ -11,6 +11,12 @@ export declare const setConsent: ({ isInit, isConsentGiven, moduleOptions, cooki
     cookiesEnabled: Ref<Cookie[]>;
     cookiesEnabledIds: Ref<string[]>;
 }) => void;
+export declare const getCookieControlConsent: () => any;
 export declare const getCookieId: (cookie: Cookie) => string;
 export declare const clearCookies: (cookiesEnabledIds: string[], cookiesOptional: Cookie[]) => void;
 export declare const setHead: (enabledCookies: Cookie[]) => void;
+export declare const setCookies: ({ isConsentGiven, cookieIds, expires, }: {
+    isConsentGiven: boolean;
+    cookieIds: string[];
+    expires: Date;
+}) => void;

package/dist/runtime/methods.mjs

@@ -10,25 +10,26 @@ export const useAcceptNecessary = () => {
     moduleOptions.cookies?.necessary
   );
 };
-export const acceptNecessary = (enabled, consent, necessaryCookies = []) => {
+export const acceptNecessary = (cookiesEnabledRef, isConsentGivenRef, cookiesNecessary = []) => {
   const expires = new Date();
   expires.setFullYear(expires.getFullYear() + 1);
-  const necessaryCookieIds = necessaryCookies.map(
+  const necessaryCookieIds = cookiesNecessary.map(
     (necessaryCookie) => getCookieId(necessaryCookie)
   );
-  Cookies.set("cookie_control_enabled_cookies", necessaryCookieIds.join(","), {
+  setCookies({
+    isConsentGiven: isConsentGivenRef.value,
+    cookieIds: necessaryCookieIds,
     expires
   });
-  Cookies.set("cookie_control_consent", "true", { expires });
-  consent.value = true;
+  isConsentGivenRef.value = true;
   if (process.client) {
-    setHead(enabled.value);
+    setHead(cookiesEnabledRef.value);
   }
 };
 export const useResolveTranslatable = (locale = LOCALE_DEFAULT) => {
   return (translatable) => resolveTranslatable(translatable, locale);
 };
-const resolveTranslatable = (translatable, locale) => {
+const resolveTranslatable = (translatable, locale = LOCALE_DEFAULT) => {
   if (typeof translatable === "string")
     return translatable;
   if (!locale)
@@ -68,8 +69,8 @@ export const setConsent = ({
   }
   if (moduleOptions.cookies?.necessary)
     cookiesEnabled.value.push(
-      ...moduleOptions.cookies.necessary.filter((c) => {
-        return c.src;
+      ...moduleOptions.cookies.necessary.filter((cookieNecessary) => {
+        return cookieNecessary.src;
       })
     );
   cookiesEnabledIds.value = cookiesEnabled.value.map(
@@ -83,6 +84,7 @@ export const setConsent = ({
     );
   }
 };
+export const getCookieControlConsent = () => Cookies.get("cookie_control_consent");
 export const getCookieId = (cookie) => cookie.id || slugify(resolveTranslatable(cookie.name));
 export const clearCookies = (cookiesEnabledIds, cookiesOptional) => {
   const cookiesDisabled = cookiesOptional.filter(
@@ -115,3 +117,19 @@ export const setHead = (enabledCookies) => {
     head.appendChild(script);
   }
 };
+export const setCookies = ({
+  isConsentGiven,
+  cookieIds,
+  expires
+}) => {
+  Cookies.set(
+    "cookie_control_enabled_cookies",
+    isConsentGiven ? cookieIds.join(",") : "",
+    {
+      expires
+    }
+  );
+  Cookies.set("cookie_control_consent", isConsentGiven.toString(), {
+    expires
+  });
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dargmuesli/nuxt-cookie-control",
-  "version": "2.0.0-beta.5",
+  "version": "2.0.0-beta.7",
   "description": "Nuxt Cookies Control Module",
   "author": "Dario Ferderber <dario.ferderber@broj42.com>",
   "maintainers": [
@@ -52,25 +52,12 @@
     "husky": "8.0.2",
     "lint-staged": "13.1.0",
     "nuxt": "3.0.0",
-    "prettier": "2.8.0",
-    "typescript": "4.9.3",
-    "vite": "3.2.5",
+    "prettier": "2.8.1",
+    "typescript": "4.9.4",
     "vue": "3.2.45",
-    "vue-tsc": "1.0.11",
+    "vue-tsc": "1.0.12",
     "webpack": "5.75.0"
   },
-  "peerDependencies": {
-    "vite": "^3",
-    "webpack": "^5"
-  },
-  "peerDependenciesMeta": {
-    "vite": {
-      "optional": true
-    },
-    "webpack": {
-      "optional": true
-    }
-  },
   "resolutions": {
     "@dargmuesli/nuxt-cookie-control": "link:./"
   },