@dargmuesli/nuxt-cookie-control 5.10.3 → 6.0.0

package/README.md

@@ -1,14 +1,14 @@
 # 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)
+[![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=19sFguJo7SKUvmH4xu9DhK9ZXzR6oWLX8)
 
 ✅ Translated for: ar, az, bg, cs, da, de, en, es, fi, fr, hr, hu, it, ja, ko, lt, nl, no, oc, pt, pl, rs, ru, sk, sv, tr and uk
 
 ✅ Vue 3 support
 
-✅ Components and composables are [auto-imported](https://nuxt.com/docs/guide/concepts/auto-imports)
+⚠️ For Nuxt 2, please use nuxt-cookie-control < 3.0.0
 
 🚩 API changes since continuing Dario Ferderber's work on [gitlab.com/broj42/nuxt-cookie-control](https://gitlab.com/broj42/nuxt-cookie-control), make sure to read the README!
 
@@ -17,14 +17,18 @@
 
 [![Stackblitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/dargmuesli/nuxt-cookie-control?file=playground%2Fapp.vue)
 
+
 ### Installation
+
 ```bash
 npm i -D @dargmuesli/nuxt-cookie-control
 yarn add -D @dargmuesli/nuxt-cookie-control
 pnpm i -D @dargmuesli/nuxt-cookie-control
 ```
 
+
 ### Configuration
+
 ```javascript
 // nuxt.config.js
 
@@ -44,7 +48,9 @@ modules: [
 ]
 ```
 
+
 ### Usage
+
 ```html
 <!-- app.vue -->
 
@@ -147,6 +153,11 @@ cookieExpiryOffsetMs: 1000 * 60 * 60 * 24 * 365, // one year
 cookieNameIsConsentGiven: 'ncc_c',
 cookieNameCookiesEnabledIds: 'ncc_e',
 
+// Options to pass to nuxt's useCookie
+cookieOptions: {
+  path: '/',
+}
+
 // Switch to toggle the "accept necessary" button.
 isAcceptNecessaryButtonEnabled: true
 
@@ -169,18 +180,10 @@ isDashInDescriptionEnabled: true,
 // Switch to toggle the blocking of iframes.
 // This can be used to prevent iframes from adding additional cookies.
 isIframeBlocked: false,
-// or:
-// isIframeBlocked: {
-//   initialState: false
-// },
 
 // Switch to toggle the modal being shown right away, requiring a user's decision.
 isModalForced: false,
 
-// The domain to set cookies on.
-// This is useful in case you have subdomains (shop.yourdomain.com)
-domain: 'yourdomain.com',
-
 // The locales to include.
 locales: ['en'],
 
@@ -214,6 +217,7 @@ Every property the includes a `{ en: ... }` value is a translatable property tha
 ### Component Slots
 
 #### Bar
+
 ```html
 <CookieControl>
   <template #bar>
@@ -225,6 +229,7 @@ Every property the includes a `{ en: ... }` value is a translatable property tha
 ```
 
 #### Modal
+
 ```html
 <template #modal>
   <h3>Modal title</h3>
@@ -233,6 +238,7 @@ Every property the includes a `{ en: ... }` value is a translatable property tha
 ```
 
 #### Cookie
+
 ```html
 <template #cookie="{config}">
   <span v-for="c in config" :key="c.id" v-text="c.cookies"/>
@@ -240,6 +246,7 @@ Every property the includes a `{ en: ... }` value is a translatable property tha
 ```
 
 ### Props
+
 - locale: `['en']`
 ```html
 <CookieControl locale="de"/>

package/dist/module.d.ts

@@ -1,4 +1,5 @@
 import * as _nuxt_schema from '@nuxt/schema';
+import { CookieOptions } from 'nuxt/app';
 
 type Locale = 'ar' | 'az' | 'bg' | 'cs' | 'da' | 'de' | 'en' | 'es' | 'fi' | 'fr' | 'hr' | 'hu' | 'it' | 'ja' | 'ko' | 'lt' | 'nl' | 'no' | 'oc' | 'pt' | 'pl' | 'rs' | 'ru' | 'sk' | 'sv' | 'tr' | 'uk';
 type PartialRecord<K extends keyof any, T> = Partial<Record<K, T>>;
@@ -39,16 +40,14 @@ interface ModuleOptions {
         necessary: Cookie[];
         optional: Cookie[];
     };
-    domain: string;
+    cookieOptions: CookieOptions;
     isAcceptNecessaryButtonEnabled: boolean;
     isControlButtonEnabled: boolean;
     isCookieIdVisible: boolean;
     isCssEnabled: boolean;
     isCssPonyfillEnabled: boolean;
     isDashInDescriptionEnabled: boolean;
-    isIframeBlocked: boolean | {
-        initialState: boolean;
-    };
+    isIframeBlocked: boolean;
     isModalForced: boolean;
     locales: Locale[];
     localeTexts: PartialRecord<Locale, Partial<LocaleStrings>>;

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "@dargmuesli/nuxt-cookie-control",
-  "version": "5.10.3",
+  "version": "6.0.0",
   "configKey": "cookieControl",
   "compatibility": {
     "nuxt": "^3.0.0"

package/dist/module.mjs

@@ -3,7 +3,7 @@ import { pathToFileURL } from 'node:url';
 import { createResolver, defineNuxtModule, addPlugin, addImports, addTemplate, extendWebpackConfig, resolvePath } from '@nuxt/kit';
 
 const name = "@dargmuesli/nuxt-cookie-control";
-const version = "5.10.3";
+const version = "6.0.0";
 
 const en = {
   accept: "Accept",
@@ -62,6 +62,9 @@ const DEFAULTS = {
   // one year
   cookieNameIsConsentGiven: "ncc_c",
   cookieNameCookiesEnabledIds: "ncc_e",
+  cookieOptions: {
+    path: "/"
+  },
   isAcceptNecessaryButtonEnabled: true,
   isControlButtonEnabled: true,
   isCookieIdVisible: false,
@@ -70,7 +73,6 @@ const DEFAULTS = {
   isDashInDescriptionEnabled: true,
   isIframeBlocked: false,
   isModalForced: false,
-  domain: "",
   locales: ["en"],
   localeTexts: { en }
 };
@@ -122,8 +124,7 @@ export default ${JSON.stringify(
 const blockIframes = (moduleOptions) => {
   if (moduleOptions.isIframeBlocked) {
     const isIframeBlocked = {
-      name: "functional",
-      initialState: typeof moduleOptions.isIframeBlocked !== "boolean" && moduleOptions.isIframeBlocked.initialState !== void 0 ? moduleOptions.isIframeBlocked.initialState : true
+      name: "functional"
     };
     if (moduleOptions.cookies) {
       if (moduleOptions.cookies.optional) {

package/dist/runtime/components/CookieControl.vue

@@ -94,12 +94,8 @@
                           type="checkbox"
                           :checked="
                             getCookieIds(localCookiesEnabled).includes(
-                              getCookieId(cookie)
-                            ) ||
-                            (cookieIsConsentGiven !== allCookieIdsString &&
-                              typeof moduleOptions.isIframeBlocked ===
-                                'object' &&
-                              moduleOptions.isIframeBlocked.initialState)
+                              getCookieId(cookie),
+                            )
                           "
                           @change="toogleCookie(cookie)"
                         />
@@ -135,7 +131,7 @@
                           >
                             <span
                               v-for="entry in Object.entries(
-                                cookie.links || {}
+                                cookie.links || {},
                               )"
                               :key="entry[0]"
                             >
@@ -196,7 +192,6 @@ import {
   getCookieId,
   getCookieIds,
   removeCookie,
-  setCookie,
   resolveTranslatable,
 } from '../methods'
 import setCssVariables from '#cookie-control/set-vars'
@@ -219,12 +214,20 @@ const {
 } = useCookieControl()
 
 // data
-const expires = new Date()
+const expires = new Date(Date.now() + moduleOptions.cookieExpiryOffsetMs)
 const localCookiesEnabled = ref([...(cookiesEnabled.value || [])])
 const allCookieIdsString = getAllCookieIdsString(moduleOptions)
-const cookieIsConsentGiven = useCookie(moduleOptions.cookieNameIsConsentGiven)
+const cookieIsConsentGiven = useCookie(moduleOptions.cookieNameIsConsentGiven, {
+  expires,
+  ...moduleOptions.cookieOptions,
+})
+
 const cookieCookiesEnabledIds = useCookie(
-  moduleOptions.cookieNameCookiesEnabledIds
+  moduleOptions.cookieNameCookiesEnabledIds,
+  {
+    expires,
+    ...moduleOptions.cookieOptions,
+  },
 )
 
 // computations
@@ -232,7 +235,7 @@ const isSaved = computed(
   () =>
     getCookieIds(cookiesEnabled.value || [])
       .sort()
-      .join('|') !== getCookieIds(localCookiesEnabled.value).sort().join('|')
+      .join('|') !== getCookieIds(localCookiesEnabled.value).sort().join('|'),
 )
 const localeStrings = computed(() => moduleOptions.localeTexts[props.locale])
 
@@ -275,9 +278,6 @@ const getName = (name: Translatable) => {
     ? localeStrings.value?.cookiesFunctional
     : resolveTranslatable(name, props.locale)
 }
-const init = () => {
-  expires.setTime(expires.getTime() + moduleOptions.cookieExpiryOffsetMs)
-}
 const onModalClick = () => {
   if (moduleOptions.closeModalOnClickOutside) {
     isModalActive.value = false
@@ -295,7 +295,7 @@ const setCookies = ({
     ? [
         ...moduleOptions.cookies.necessary,
         ...moduleOptions.cookies.optional.filter((cookieOptional: Cookie) =>
-          cookiesOptionalEnabledNew.includes(cookieOptional)
+          cookiesOptionalEnabledNew.includes(cookieOptional),
         ),
       ]
     : []
@@ -311,7 +311,7 @@ const toggleButton = ($event: MouseEvent) => {
 }
 const toogleCookie = (cookie: Cookie) => {
   const cookieIndex = getCookieIds(localCookiesEnabled.value).indexOf(
-    getCookieId(cookie)
+    getCookieId(cookie),
   )
 
   if (cookieIndex < 0) {
@@ -338,11 +338,7 @@ onBeforeMount(() => {
 
   if (cookieIsConsentGiven.value === allCookieIdsString) {
     for (const cookieOptional of moduleOptions.cookies.optional) {
-      if (
-        typeof moduleOptions.isIframeBlocked === 'boolean'
-          ? moduleOptions.isIframeBlocked === true
-          : moduleOptions.isIframeBlocked.initialState === true
-      ) {
+      if (moduleOptions.isIframeBlocked) {
         localCookiesEnabled.value.push(cookieOptional)
       }
     }
@@ -358,13 +354,7 @@ watch(
     localCookiesEnabled.value = [...(current || [])]
 
     if (isConsentGiven.value) {
-      setCookie(
-        moduleOptions.cookieNameCookiesEnabledIds,
-        getCookieIds(current || []).join('|'),
-        {
-          expires,
-        }
-      )
+      cookieCookiesEnabledIds.value = getCookieIds(current || []).join('|')
 
       for (const cookieEnabled of current || []) {
         if (!cookieEnabled.src) continue
@@ -379,7 +369,7 @@ watch(
 
     // delete formerly enabled cookies that are now disabled
     const cookiesOptionalDisabled = moduleOptions.cookies.optional.filter(
-      (cookieOptional) => !(current || []).includes(cookieOptional)
+      (cookieOptional) => !(current || []).includes(cookieOptional),
     )
 
     for (const cookieOptionalDisabled of cookiesOptionalDisabled) {
@@ -392,7 +382,7 @@ watch(
       if (cookieOptionalDisabled.src) {
         for (const script of [
           ...document.head.querySelectorAll(
-            `script[src="${cookieOptionalDisabled.src}"]`
+            `script[src="${cookieOptionalDisabled.src}"]`,
           ),
         ]) {
           script.parentNode?.removeChild(script)
@@ -400,19 +390,13 @@ watch(
       }
     }
   },
-  { deep: true }
+  { deep: true },
 )
 watch(isConsentGiven, (current, _previous) => {
   if (current === undefined) {
     cookieIsConsentGiven.value = undefined
   } else {
-    setCookie(
-      moduleOptions.cookieNameIsConsentGiven,
-      current ? allCookieIdsString : '0',
-      {
-        expires,
-      }
-    )
+    cookieIsConsentGiven.value = current ? allCookieIdsString : '0'
   }
 })
 
@@ -421,7 +405,4 @@ defineExpose({
   acceptPartial,
   decline,
 })
-
-// initialization
-init()
 </script>

package/dist/runtime/components/CookieIframe.vue

@@ -35,8 +35,8 @@ const { cookiesEnabled, isModalActive, moduleOptions } = useCookieControl()
 const isCookieFunctionalEnabled = computed(
   () =>
     (cookiesEnabled.value || []).filter(
-      (cookieEnabled: Cookie) => cookieEnabled.name === 'functional'
-    ).length > 0
+      (cookieEnabled: Cookie) => cookieEnabled.name === 'functional',
+    ).length > 0,
 )
 const localeStrings = computed(() => moduleOptions.localeTexts[props.locale])
 </script>

package/dist/runtime/methods.d.ts

@@ -1,9 +1,7 @@
-import { type CookieSerializeOptions } from 'cookie-es';
 import { Cookie, ModuleOptions, Translatable } from './types';
 export declare const getAllCookieIdsString: (moduleOptions: ModuleOptions) => string;
 export declare const getCookieId: (cookie: Cookie) => string;
 export declare const getCookieIds: (cookies: Cookie[]) => string[];
 export declare const removeCookie: (name: string) => string;
 export declare const resolveTranslatable: (translatable: Translatable, locale?: import("./types").Locale) => string;
-export declare const setCookie: (name: string, value: string, options: CookieSerializeOptions) => string;
 export declare const useResolveTranslatable: (locale?: import("./types").Locale) => (translatable: Translatable) => string;

package/dist/runtime/methods.mjs

@@ -18,10 +18,6 @@ export const resolveTranslatable = (translatable, locale = LOCALE_DEFAULT) => {
     throw new Error(`Could not get translation for locale ${locale}.`);
   return result;
 };
-export const setCookie = (name, value, options) => document.cookie = serialize(name, value, {
-  sameSite: "strict",
-  ...options
-});
 export const useResolveTranslatable = (locale = LOCALE_DEFAULT) => {
   return (translatable) => resolveTranslatable(translatable, locale);
 };

package/dist/runtime/plugin.mjs

@@ -3,9 +3,13 @@ import { getAllCookieIdsString, getCookieId } from "./methods.mjs";
 import { defineNuxtPlugin, useCookie } from "#imports";
 import moduleOptions from "#build/cookie-control-options";
 export default defineNuxtPlugin((_nuxtApp) => {
-  const cookieIsConsentGiven = useCookie(moduleOptions.cookieNameIsConsentGiven);
+  const cookieIsConsentGiven = useCookie(
+    moduleOptions.cookieNameIsConsentGiven,
+    moduleOptions.cookieOptions
+  );
   const cookieCookiesEnabledIds = useCookie(
-    moduleOptions.cookieNameCookiesEnabledIds
+    moduleOptions.cookieNameCookiesEnabledIds,
+    moduleOptions.cookieOptions
   ).value?.split("|");
   const isConsentGiven = ref(
     cookieIsConsentGiven === void 0 ? void 0 : cookieIsConsentGiven.value === getAllCookieIdsString(moduleOptions)

package/dist/runtime/types.d.ts

@@ -1,4 +1,5 @@
 import { Ref } from 'vue';
+import { CookieOptions } from 'nuxt/app';
 export type Locale = 'ar' | 'az' | 'bg' | 'cs' | 'da' | 'de' | 'en' | 'es' | 'fi' | 'fr' | 'hr' | 'hu' | 'it' | 'ja' | 'ko' | 'lt' | 'nl' | 'no' | 'oc' | 'pt' | 'pl' | 'rs' | 'ru' | 'sk' | 'sv' | 'tr' | 'uk';
 export type PartialRecord<K extends keyof any, T> = Partial<Record<K, T>>;
 export type Translatable = string | PartialRecord<Locale, string>;
@@ -42,16 +43,14 @@ export interface ModuleOptions {
         necessary: Cookie[];
         optional: Cookie[];
     };
-    domain: string;
+    cookieOptions: CookieOptions;
     isAcceptNecessaryButtonEnabled: boolean;
     isControlButtonEnabled: boolean;
     isCookieIdVisible: boolean;
     isCssEnabled: boolean;
     isCssPonyfillEnabled: boolean;
     isDashInDescriptionEnabled: boolean;
-    isIframeBlocked: boolean | {
-        initialState: boolean;
-    };
+    isIframeBlocked: boolean;
     isModalForced: boolean;
     locales: Locale[];
     localeTexts: PartialRecord<Locale, Partial<LocaleStrings>>;

package/dist/runtime/types.mjs

@@ -43,6 +43,9 @@ export const DEFAULTS = {
   // one year
   cookieNameIsConsentGiven: "ncc_c",
   cookieNameCookiesEnabledIds: "ncc_e",
+  cookieOptions: {
+    path: "/"
+  },
   isAcceptNecessaryButtonEnabled: true,
   isControlButtonEnabled: true,
   isCookieIdVisible: false,
@@ -51,7 +54,6 @@ export const DEFAULTS = {
   isDashInDescriptionEnabled: true,
   isIframeBlocked: false,
   isModalForced: false,
-  domain: "",
   locales: ["en"],
   localeTexts: { en }
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dargmuesli/nuxt-cookie-control",
-  "version": "5.10.3",
-  "description": "Nuxt Cookies Control Module",
+  "version": "6.0.0",
+  "description": "Nuxt Cookie Control Module",
   "author": "Dario Ferderber <dario.ferderber@broj42.com>",
   "maintainers": [
     "Jonas Thelemann"
@@ -18,7 +18,7 @@
   "engines": {
     "node": ">=16"
   },
-  "packageManager": "pnpm@8.6.5",
+  "packageManager": "pnpm@8.6.7",
   "exports": {
     ".": {
       "import": "./dist/module.mjs",
@@ -35,11 +35,12 @@
   "scripts": {
     "build": "nuxt-module-build",
     "lint": "eslint --ext .js,.ts,.vue . && nuxt typecheck",
+    "lint:fix": "eslint --ext .js,.ts,.vue --fix . && nuxt typecheck --fix",
     "prepack": "pnpm build",
     "prepare": "husky install"
   },
   "dependencies": {
-    "@nuxt/kit": "3.6.1",
+    "@nuxt/kit": "3.6.2",
     "@sindresorhus/slugify": "2.2.1",
     "css-vars-ponyfill": "2.4.8",
     "string-replace-loader": "3.1.0"
@@ -50,17 +51,17 @@
     "@dargmuesli/nuxt-cookie-control": "link:.",
     "@nuxt/module-builder": "0.4.0",
     "@nuxtjs/eslint-config-typescript": "12.0.0",
-    "eslint": "8.43.0",
+    "eslint": "8.44.0",
     "eslint-config-prettier": "8.8.0",
-    "eslint-plugin-prettier": "4.2.1",
+    "eslint-plugin-prettier": "5.0.0",
     "husky": "8.0.3",
-    "lint-staged": "13.2.2",
-    "nuxt": "3.6.1",
-    "prettier": "2.8.8",
-    "typescript": "5.1.3",
+    "lint-staged": "13.2.3",
+    "nuxt": "3.6.2",
+    "prettier": "3.0.0",
+    "typescript": "5.1.6",
     "vue": "3.3.4",
-    "vue-tsc": "1.8.2",
-    "webpack": "5.88.0"
+    "vue-tsc": "1.8.4",
+    "webpack": "5.88.1"
   },
   "publishConfig": {
     "access": "public"