@dargmuesli/nuxt-cookie-control 2.2.4 → 3.0.0-beta.2

package/README.md

@@ -1,9 +1,11 @@
 # Nuxt Cookie Control
+[![npm version][npm-version-src]][npm-version-href] [![npm downloads][npm-downloads-src]][npm-downloads-href]
+
+![Nuxt Cookie Control](https://drive.google.com/a/broj42.com/uc?id=1FGQVyj2s0OT-gpTYxH_FuQhe6oU9iejW)
+
 
 Continuing Dario Ferderber's work on [gitlab.com/broj42/nuxt-cookie-control](https://gitlab.com/broj42/nuxt-cookie-control).
 
-![Nuxt Cookie Control](https://drive.google.com/a/broj42.com/uc?id=1FGQVyj2s0OT-gpTYxH_FuQhe6oU9iejW)
-####
 Try it out here:
 [Nuxt.js Cookie Control](https://codesandbox.io/s/vkwqmm577)
 
@@ -13,8 +15,7 @@ npm i -D @dargmuesli/nuxt-cookie-control
 yarn add -D @dargmuesli/nuxt-cookie-control
 pnpm i -D @dargmuesli/nuxt-cookie-control
 ```
-[![npm version][npm-version-src]][npm-version-href]
-[![npm downloads][npm-downloads-src]][npm-downloads-href]
+
 
 ```javascript
 // nuxt.config.js
@@ -49,7 +50,7 @@ const {
 } = useCookieControl()
 </script>
 ```
-## Slot
+## Component Slots
 ### Bar
 ```html
 <CookieControl>
@@ -140,6 +141,13 @@ cookies: {
   optional: [],
 }
 
+// The milliseconds from now until expiry of the cookies that are being set by this module.
+cookieExpiryOffsetMs: 1000 * 60 * 60 * 24 * 365, // one year
+
+// Names for the cookies that are being set by this module.
+cookieNameIsConsentGiven: 'cookie_control_is_consent_given',
+cookieNameCookiesEnabledIds: 'cookie_control_cookies_enabled_ids',
+
 // Switch to toggle the "accept necessary" button.
 isAcceptNecessaryButtonEnabled: true
 
@@ -188,9 +196,9 @@ Every property the includes a `{ en: ... }` value is a translatable property tha
   description: {
     en:  'Used for cookie control.'
   },
-  id: 'ga', // if unset, the slugified name will be used
+  id: 'ga', // if unset, `getCookieId(cookie)` returns the cookie's slugified name instead, which e.g. is used to fill the state's `enabledCookieIds` list
   name: {
-    en: 'Google Analytics'
+    en: 'Google Analytics' // you always have to specify a cookie name (in English)
   },
   src: 'https://www.googletagmanager.com/gtag/js?id=<API-KEY>',
   targetCookieIds: ['cookie_control_consent', 'cookie_control_enabled_cookies']

package/dist/module.d.ts

@@ -34,6 +34,9 @@ interface ModuleOptions {
         necessary: Cookie[];
         optional: Cookie[];
     };
+    cookieExpiryOffsetMs: number;
+    cookieNameIsConsentGiven: string;
+    cookieNameCookiesEnabledIds: string;
     isAcceptNecessaryButtonEnabled?: boolean;
     isControlButtonEnabled?: boolean;
     isCssEnabled?: boolean;

package/dist/module.json

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

package/dist/module.mjs

@@ -1,17 +1,8 @@
 import { resolve } from 'node:path';
-import { createResolver, defineNuxtModule, addPlugin, addImports, addTemplate, isNuxt2, extendWebpackConfig, resolvePath } from '@nuxt/kit';
+import { createResolver, defineNuxtModule, addPlugin, addImports, addTemplate, extendWebpackConfig, resolvePath } from '@nuxt/kit';
 
-
-
-// -- Unbuild CommonJS Shims --
-import __cjs_url__ from 'url';
-import __cjs_path__ from 'path';
-import __cjs_mod__ from 'module';
-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.2.4";
+const version = "3.0.0-beta.2";
 
 const en = {
   acceptAll: "Accept all",
@@ -20,7 +11,7 @@ const en = {
   barTitle: "Cookies",
   blockedIframe: "To see this, please enable functional cookies",
   close: "Close",
-  declineAll: "Delete all",
+  declineAll: "Decline all",
   functional: "Functional cookies",
   here: "here",
   manageCookies: "Manage cookies",
@@ -64,6 +55,9 @@ const DEFAULTS = {
     necessary: [],
     optional: []
   },
+  cookieExpiryOffsetMs: 1e3 * 60 * 60 * 24 * 365,
+  cookieNameIsConsentGiven: "cookie_control_is_consent_given",
+  cookieNameCookiesEnabledIds: "cookie_control_cookies_enabled_ids",
   isAcceptNecessaryButtonEnabled: true,
   isControlButtonEnabled: true,
   isCssEnabled: true,
@@ -116,28 +110,6 @@ export default ${JSON.stringify(
         2
       )} as ModuleOptions`
     });
-    if (isNuxt2()) {
-      try {
-        if (require.resolve("nuxt-purgecss").length > 0) {
-          if (nuxt.options.purgeCSS) {
-            if (nuxt.options.purgeCSS.whitelistPatternsChildren) {
-              nuxt.options.purgeCSS.whitelistPatternsChildren.push(
-                /cookieControl/
-              );
-            } else {
-              nuxt.options.purgeCSS.whitelistPatternsChildren = [
-                /cookieControl/
-              ];
-            }
-          } else {
-            nuxt.options.purgeCSS = {
-              whitelistPatternsChildren: [/cookieControl/]
-            };
-          }
-        }
-      } catch (e) {
-      }
-    }
   }
 });
 const blockIframes = (moduleOptions) => {

package/dist/runtime/components/CookieControl.vue

@@ -3,7 +3,7 @@
     <section class="cookieControl">
       <transition :name="`cookieControl__Bar--${moduleOptions.barPosition}`">
         <div
-          v-if="isColorsSet && !isConsentGiven"
+          v-if="isColorsSet && isConsentGiven === undefined"
           :class="`cookieControl__Bar cookieControl__Bar--${moduleOptions.barPosition}`"
         >
           <div class="cookieControl__BarContainer">
@@ -14,13 +14,10 @@
               </slot>
             </div>
             <div class="cookieControl__BarButtons">
-              <button
-                @click="setConsent({ reload: false })"
-                v-text="localeStrings?.acceptAll"
-              />
+              <button @click="acceptAll()" v-text="localeStrings?.acceptAll" />
               <button
                 v-if="moduleOptions.isAcceptNecessaryButtonEnabled"
-                @click="acceptNecessary"
+                @click="acceptNecessary()"
                 v-text="localeStrings?.acceptNecessary"
               />
               <button
@@ -33,7 +30,9 @@
       </transition>
       <button
         v-if="
-          moduleOptions.isControlButtonEnabled && isColorsSet && isConsentGiven
+          moduleOptions.isControlButtonEnabled &&
+          isColorsSet &&
+          isConsentGiven !== undefined
         "
         aria-label="Cookie control"
         class="cookieControl__ControlButton"
@@ -50,7 +49,7 @@
       <transition name="cookieControl__Modal">
         <div v-if="isModalActive" class="cookieControl__Modal">
           <p
-            v-if="!saved"
+            v-if="isSaved"
             class="cookieControl__ModalUnsaved"
             v-text="localeStrings?.unsaved"
           />
@@ -85,8 +84,10 @@
                         :id="resolveTranslatable(cookie.name)"
                         type="checkbox"
                         :checked="
-                          cookiesEnabledIds.includes(getCookieId(cookie)) ||
-                          (getCookieControlConsent()?.length === 0 &&
+                          cookiesEnabled?.includes(cookie) ||
+                          (Cookies.get(
+                            moduleOptions.cookieNameIsConsentGiven
+                          ) !== 'true' &&
                             typeof moduleOptions.isIframeBlocked === 'object' &&
                             moduleOptions.isIframeBlocked.initialState)
                         "
@@ -118,16 +119,29 @@
               </div>
               <div class="cookieControl__ModalButtons">
                 <button
-                  @click="setConsent({ type: 'partial' })"
+                  @click="
+                    () => {
+                      acceptPartial()
+                      isModalActive = false
+                    }
+                  "
                   v-text="localeStrings?.save"
                 />
                 <button
-                  @click="() => setConsent({})"
+                  @click="
+                    () => {
+                      acceptAll()
+                      isModalActive = false
+                    }
+                  "
                   v-text="localeStrings?.acceptAll"
                 />
                 <button
                   @click="
-                    setConsent({ declineAll: true, isConsentGiven: false })
+                    () => {
+                      declineAll()
+                      isModalActive = false
+                    }
                   "
                   v-text="localeStrings?.declineAll"
                 />
@@ -141,17 +155,11 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed, onBeforeMount } from 'vue'
+import Cookies from 'js-cookie'
+import { ref, computed, onBeforeMount, watch } from 'vue'
 
 import { Cookie, CookieType, Locale, Translatable } from '../types'
-import {
-  getCookieControlConsent,
-  getCookieId,
-  useAcceptNecessary,
-  useSetConsent,
-  useResolveTranslatable,
-  setCookies,
-} from '../methods'
+import { getCookieIds, useResolveTranslatable } from '../methods'
 
 import { useCookieControl } from '#imports'
 
@@ -162,64 +170,62 @@ const props = withDefaults(defineProps<Props>(), {
   locale: 'en',
 })
 
-const { cookiesEnabledIds, isConsentGiven, isModalActive, moduleOptions } =
-  useCookieControl()
-const setConsentFun = useSetConsent()
-const acceptNecessary = useAcceptNecessary()
+const {
+  cookiesEnabled,
+  cookiesEnabledIds,
+  isConsentGiven,
+  isModalActive,
+  moduleOptions,
+} = useCookieControl()
 const resolveTranslatable = useResolveTranslatable(props.locale)
 
 // data
-const saved = ref(true)
+const expires = new Date()
 const isColorsSet = ref(false)
+const localCookiesEnabled = ref([...(cookiesEnabled.value || [])])
 
 // computations
+const isSaved = computed(
+  () =>
+    getCookieIds(cookiesEnabled.value || [])
+      .sort()
+      .join(',') !== getCookieIds(localCookiesEnabled.value).sort().join(',')
+)
 const localeStrings = computed(() => moduleOptions.localeTexts[props.locale])
 
 // methods
-const toogleCookie = (cookie: Cookie) => {
-  const cookieId = getCookieId(cookie)
-
-  if (saved.value) saved.value = false
-
-  if (!cookiesEnabledIds.value.includes(cookieId)) {
-    cookiesEnabledIds.value.push(cookieId)
-  } else {
-    cookiesEnabledIds.value.splice(cookiesEnabledIds.value.indexOf(cookieId), 1)
-  }
+const acceptAll = () => {
+  setCookies({
+    isConsentGiven: true,
+    cookiesOptionalEnabled: moduleOptions.cookies.optional,
+  })
 }
-const setConsent = ({
-  type = undefined,
-  isConsentGiven = true,
-  reload = true,
-  declineAll = false,
-}: {
-  type?: 'partial'
-  isConsentGiven?: boolean
-  reload?: boolean
-  declineAll?: boolean
-}) => {
-  const cookieIds = declineAll
-    ? []
-    : type === 'partial' && isConsentGiven
-    ? cookiesEnabledIds.value
-    : moduleOptions.cookies.optional.map((cookie: Cookie) =>
-        getCookieId(cookie)
-      )
-
-  const expirationDate = new Date()
-  expirationDate.setFullYear(expirationDate.getFullYear() + 1)
-
+const acceptNecessary = () => {
   setCookies({
-    isConsentGiven,
-    cookieIds,
-    expires: expirationDate,
+    isConsentGiven: true,
+    cookiesOptionalEnabled: moduleOptions.cookies?.necessary,
   })
-
-  if (reload) {
-    window.location.reload()
+}
+const acceptPartial = () => {
+  setCookies({
+    isConsentGiven: true,
+    cookiesOptionalEnabled: localCookiesEnabled.value,
+  })
+}
+const declineAll = () => {
+  setCookies({
+    isConsentGiven: false,
+    cookiesOptionalEnabled: [],
+  })
+}
+const toogleCookie = (cookie: Cookie) => {
+  if (!localCookiesEnabled.value.includes(cookie)) {
+    localCookiesEnabled.value.push(cookie)
   } else {
-    setConsentFun()
-    isModalActive.value = false
+    localCookiesEnabled.value.splice(
+      localCookiesEnabled.value.indexOf(cookie),
+      1
+    )
   }
 }
 const getDescription = (description: Translatable) =>
@@ -233,6 +239,29 @@ const getName = (name: Translatable) => {
     ? name
     : name[props.locale]
 }
+const init = () => {
+  expires.setTime(expires.getTime() + moduleOptions.cookieExpiryOffsetMs)
+}
+const setCookies = ({
+  cookiesOptionalEnabled: cookiesOptionalEnabledNew,
+  isConsentGiven: isConsentGivenNew,
+}: {
+  cookiesOptionalEnabled: Cookie[]
+  isConsentGiven: boolean
+}) => {
+  isConsentGiven.value = isConsentGivenNew // must come before an update to `cookiesEnabled`
+  cookiesEnabled.value = isConsentGivenNew
+    ? [
+        ...moduleOptions.cookies.necessary,
+        ...moduleOptions.cookies.optional.filter((cookieOptional: Cookie) =>
+          cookiesOptionalEnabledNew?.includes(cookieOptional)
+        ),
+      ]
+    : []
+  cookiesEnabledIds.value = isConsentGivenNew
+    ? getCookieIds(cookiesEnabled.value)
+    : []
+}
 
 // lifecycle
 onBeforeMount(async () => {
@@ -259,18 +288,76 @@ onBeforeMount(async () => {
     isColorsSet.value = true
   }
 
-  const cookieControlConsent = getCookieControlConsent()
-
-  if (!cookieControlConsent || !cookieControlConsent.length) {
+  if (Cookies.get(moduleOptions.cookieNameIsConsentGiven) === 'true') {
     for (const cookieOptional of moduleOptions.cookies.optional) {
       if (
         typeof moduleOptions.isIframeBlocked === 'boolean'
           ? moduleOptions.isIframeBlocked === true
           : moduleOptions.isIframeBlocked?.initialState === true
       ) {
-        cookiesEnabledIds.value.push(getCookieId(cookieOptional))
+        localCookiesEnabled.value.push(cookieOptional)
+      }
+    }
+  }
+})
+watch(
+  () => cookiesEnabled.value,
+  (current, _previous) => {
+    if (isConsentGiven.value) {
+      Cookies.set(
+        moduleOptions.cookieNameCookiesEnabledIds,
+        getCookieIds(current || []).join(','),
+        {
+          expires,
+        }
+      )
+
+      for (const cookieEnabled of current || []) {
+        if (!cookieEnabled.src) continue
+
+        const script = document.createElement('script')
+        script.src = cookieEnabled.src
+        document.getElementsByTagName('head')[0].appendChild(script)
+      }
+    } else {
+      Cookies.remove(moduleOptions.cookieNameCookiesEnabledIds)
+    }
+
+    // delete formerly enabled cookies that are now disabled
+    const cookiesOptionalDisabled = moduleOptions.cookies.optional.filter(
+      (cookieOptional) => !(current || []).includes(cookieOptional)
+    )
+
+    for (const cookieOptionalDisabled of cookiesOptionalDisabled) {
+      if (!cookieOptionalDisabled.targetCookieIds) continue
+
+      for (const cookieOptionalDisabledId of cookieOptionalDisabled.targetCookieIds) {
+        Cookies.remove(cookieOptionalDisabledId)
+      }
+
+      if (cookieOptionalDisabled.src) {
+        for (const script of [
+          ...document.head.querySelectorAll(
+            `script[src="${cookieOptionalDisabled.src}"]`
+          ),
+        ]) {
+          script.parentNode?.removeChild(script)
+        }
       }
     }
+  },
+  { deep: true }
+)
+watch(isConsentGiven, (current, _previous) => {
+  if (current === undefined) {
+    Cookies.remove(moduleOptions.cookieNameIsConsentGiven)
+  } else {
+    Cookies.set(moduleOptions.cookieNameIsConsentGiven, current.toString(), {
+      expires,
+    })
   }
 })
+
+// initialization
+init()
 </script>

package/dist/runtime/components/CookieIframe.vue

@@ -34,7 +34,7 @@ const { cookiesEnabled, isModalActive, moduleOptions } = useCookieControl()
 // computations
 const isCookieFunctionalEnabled = computed(
   () =>
-    cookiesEnabled.value.filter(
+    (cookiesEnabled.value || []).filter(
       (cookieEnabled: Cookie) => cookieEnabled.name === 'functional'
     ).length > 0
 )

package/dist/runtime/locale/en.mjs

@@ -5,7 +5,7 @@ export default {
   barTitle: "Cookies",
   blockedIframe: "To see this, please enable functional cookies",
   close: "Close",
-  declineAll: "Delete all",
+  declineAll: "Decline all",
   functional: "Functional cookies",
   here: "here",
   manageCookies: "Manage cookies",

package/dist/runtime/methods.d.ts

@@ -1,22 +1,4 @@
-import { Ref } from 'vue';
-import { Cookie, ModuleOptions, Translatable } from './types';
-export declare const useAcceptNecessary: () => () => void;
-export declare const acceptNecessary: (cookiesEnabledRef: Ref<Cookie[]>, 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;
-    isConsentGiven: Ref<boolean | undefined>;
-    moduleOptions: ModuleOptions;
-    cookiesEnabled: Ref<Cookie[]>;
-    cookiesEnabledIds: Ref<string[]>;
-}) => void;
-export declare const getCookieControlConsent: () => any;
+import { Cookie, Translatable } from './types';
 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;
+export declare const getCookieIds: (cookies: Cookie[]) => string[];
+export declare const useResolveTranslatable: (locale?: import("./types").Locale) => (translatable: Translatable) => string;

package/dist/runtime/methods.mjs

@@ -1,25 +1,7 @@
-import Cookies from "js-cookie";
 import slugify from "@sindresorhus/slugify";
-import { useCookieControl } from "./composables.mjs";
 import { LOCALE_DEFAULT } from "./constants.mjs";
-export const useAcceptNecessary = () => {
-  const { cookiesEnabled, moduleOptions } = useCookieControl();
-  return () => acceptNecessary(cookiesEnabled, moduleOptions.cookies?.necessary);
-};
-export const acceptNecessary = (cookiesEnabledRef, cookiesNecessary = []) => {
-  const expires = new Date();
-  expires.setFullYear(expires.getFullYear() + 1);
-  const necessaryCookieIds = cookiesNecessary.map(
-    (necessaryCookie) => getCookieId(necessaryCookie)
-  );
-  setCookies({
-    isConsentGiven: true,
-    cookieIds: necessaryCookieIds,
-    expires
-  });
-  setHead(cookiesEnabledRef.value);
-  window.location.reload();
-};
+export const getCookieId = (cookie) => cookie.id || slugify(resolveTranslatable(cookie.name));
+export const getCookieIds = (cookies) => cookies.map((cookie) => getCookieId(cookie));
 export const useResolveTranslatable = (locale = LOCALE_DEFAULT) => {
   return (translatable) => resolveTranslatable(translatable, locale);
 };
@@ -33,94 +15,3 @@ const resolveTranslatable = (translatable, locale = LOCALE_DEFAULT) => {
     throw new Error(`Could not get translation for locale ${locale}.`);
   return result;
 };
-export const useSetConsent = () => {
-  const { isConsentGiven, moduleOptions, cookiesEnabled, cookiesEnabledIds } = useCookieControl();
-  return () => setConsent({
-    isInit: false,
-    isConsentGiven,
-    moduleOptions,
-    cookiesEnabled,
-    cookiesEnabledIds
-  });
-};
-export const setConsent = ({
-  isInit = false,
-  isConsentGiven,
-  moduleOptions,
-  cookiesEnabled,
-  cookiesEnabledIds
-}) => {
-  isConsentGiven.value = Cookies.get("cookie_control_consent") === "true";
-  cookiesEnabled.value = [];
-  cookiesEnabledIds.value = [];
-  if (isConsentGiven.value) {
-    const enabledFromCookie = Cookies.get("cookie_control_enabled_cookies");
-    cookiesEnabled.value.push(
-      ...moduleOptions.cookies.optional.filter(
-        (cookieOptional) => enabledFromCookie?.includes(getCookieId(cookieOptional))
-      )
-    );
-  }
-  if (moduleOptions.cookies?.necessary)
-    cookiesEnabled.value.push(
-      ...moduleOptions.cookies.necessary.filter(
-        (cookieNecessary) => cookieNecessary.src
-      )
-    );
-  cookiesEnabledIds.value = cookiesEnabled.value.map(
-    (cookieEnabled) => getCookieId(cookieEnabled)
-  );
-  if (process.client && !isInit) {
-    setHead(cookiesEnabled.value);
-    clearCookies(cookiesEnabledIds.value, moduleOptions.cookies.optional);
-  }
-};
-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(
-    (cookieOptional) => !cookiesEnabledIds.includes(getCookieId(cookieOptional))
-  );
-  for (const cookieDisabled of cookiesDisabled) {
-    if (!cookieDisabled.targetCookieIds)
-      continue;
-    for (const cookieDisabledId of cookieDisabled.targetCookieIds) {
-      Cookies.remove(cookieDisabledId);
-    }
-    if (cookieDisabled.src) {
-      for (const s of [
-        ...document.head.querySelectorAll(
-          `script[src="${cookieDisabled.src}"]`
-        )
-      ]) {
-        s.parentNode?.removeChild(s);
-      }
-    }
-  }
-};
-export const setHead = (enabledCookies) => {
-  const head = document.getElementsByTagName("head")[0];
-  for (const cookieEnabled of enabledCookies) {
-    if (!cookieEnabled.src)
-      continue;
-    const script = document.createElement("script");
-    script.src = cookieEnabled.src;
-    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/dist/runtime/plugin.mjs

@@ -1,11 +1,29 @@
+import Cookies from "js-cookie";
 import { ref } from "vue";
-import { setConsent } from "./methods.mjs";
+import { getCookieId } from "./methods.mjs";
 import { defineNuxtPlugin } from "#imports";
 import moduleOptions from "#build/cookie-control-options";
 export default defineNuxtPlugin((_nuxtApp) => {
-  const isConsentGiven = ref();
-  const cookiesEnabled = ref([]);
-  const cookiesEnabledIds = ref([]);
+  const cookieIsConsentGiven = Cookies.get(
+    moduleOptions.cookieNameIsConsentGiven
+  );
+  const cookieCookiesEnabledIds = Cookies.get(
+    moduleOptions.cookieNameCookiesEnabledIds
+  )?.split(",");
+  const isConsentGiven = ref(
+    cookieIsConsentGiven === void 0 ? void 0 : cookieIsConsentGiven === "true"
+  );
+  const cookiesEnabled = ref(
+    cookieCookiesEnabledIds === void 0 ? void 0 : [
+      ...moduleOptions.cookies.necessary.filter(
+        (cookieNecessary) => cookieCookiesEnabledIds.includes(getCookieId(cookieNecessary))
+      ),
+      ...moduleOptions.cookies.optional.filter(
+        (cookieOptional) => cookieCookiesEnabledIds.includes(getCookieId(cookieOptional))
+      )
+    ]
+  );
+  const cookiesEnabledIds = ref(cookieCookiesEnabledIds);
   const isModalActive = ref();
   const state = {
     isConsentGiven,
@@ -14,13 +32,6 @@ export default defineNuxtPlugin((_nuxtApp) => {
     isModalActive,
     moduleOptions
   };
-  setConsent({
-    isInit: !process.client,
-    isConsentGiven,
-    moduleOptions,
-    cookiesEnabled,
-    cookiesEnabledIds
-  });
   return {
     provide: {
       cookies: state

package/dist/runtime/types.d.ts

@@ -37,6 +37,9 @@ export interface ModuleOptions {
         necessary: Cookie[];
         optional: Cookie[];
     };
+    cookieExpiryOffsetMs: number;
+    cookieNameIsConsentGiven: string;
+    cookieNameCookiesEnabledIds: string;
     isAcceptNecessaryButtonEnabled?: boolean;
     isControlButtonEnabled?: boolean;
     isCssEnabled?: boolean;
@@ -51,9 +54,9 @@ export interface ModuleOptions {
 }
 export declare const DEFAULTS: Required<ModuleOptions>;
 export interface State {
-    cookiesEnabled: Ref<Cookie[]>;
-    cookiesEnabledIds: Ref<string[]>;
-    isConsentGiven: Ref<boolean>;
+    cookiesEnabled: Ref<Cookie[] | undefined>;
+    cookiesEnabledIds: Ref<string[] | undefined>;
+    isConsentGiven: Ref<boolean | undefined>;
     isModalActive: Ref<boolean>;
     moduleOptions: ModuleOptions;
 }

package/dist/runtime/types.mjs

@@ -37,6 +37,9 @@ export const DEFAULTS = {
     necessary: [],
     optional: []
   },
+  cookieExpiryOffsetMs: 1e3 * 60 * 60 * 24 * 365,
+  cookieNameIsConsentGiven: "cookie_control_is_consent_given",
+  cookieNameCookiesEnabledIds: "cookie_control_cookies_enabled_ids",
   isAcceptNecessaryButtonEnabled: true,
   isControlButtonEnabled: true,
   isCssEnabled: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dargmuesli/nuxt-cookie-control",
-  "version": "2.2.4",
+  "version": "3.0.0-beta.2",
   "description": "Nuxt Cookies Control Module",
   "author": "Dario Ferderber <dario.ferderber@broj42.com>",
   "maintainers": [
@@ -52,10 +52,10 @@
     "husky": "8.0.3",
     "lint-staged": "13.1.0",
     "nuxt": "3.0.0",
-    "prettier": "2.8.1",
+    "prettier": "2.8.2",
     "typescript": "4.9.4",
     "vue": "3.2.45",
-    "vue-tsc": "1.0.22",
+    "vue-tsc": "1.0.24",
     "webpack": "5.75.0"
   },
   "resolutions": {