@dargmuesli/nuxt-cookie-control 8.4.19 → 8.4.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/module.d.mts CHANGED
@@ -31,6 +31,7 @@ interface LocaleStrings {
31
31
  settingsUnsaved: string;
32
32
  }
33
33
  interface ModuleOptions {
34
+ _isPrerendered: boolean | undefined;
34
35
  barPosition: 'top-left' | 'top-right' | 'top-full' | 'bottom-left' | 'bottom-right' | 'bottom-full';
35
36
  closeModalOnClickOutside: boolean;
36
37
  colors: false | Record<string, unknown>;
package/dist/module.d.ts CHANGED
@@ -31,6 +31,7 @@ interface LocaleStrings {
31
31
  settingsUnsaved: string;
32
32
  }
33
33
  interface ModuleOptions {
34
+ _isPrerendered: boolean | undefined;
34
35
  barPosition: 'top-left' | 'top-right' | 'top-full' | 'bottom-left' | 'bottom-right' | 'bottom-full';
35
36
  closeModalOnClickOutside: boolean;
36
37
  colors: false | Record<string, unknown>;
package/dist/module.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dargmuesli/nuxt-cookie-control",
3
- "version": "8.4.19",
3
+ "version": "8.4.21",
4
4
  "configKey": "cookieControl",
5
5
  "compatibility": {
6
6
  "nuxt": ">=3.0.0"
package/dist/module.mjs CHANGED
@@ -2,6 +2,7 @@ import { resolve } from 'node:path';
2
2
  import { pathToFileURL } from 'node:url';
3
3
  import { createResolver, defineNuxtModule, addPlugin, addImports, addTypeTemplate, updateTemplates, extendWebpackConfig, extendViteConfig, resolvePath } from '@nuxt/kit';
4
4
  import { defu } from 'defu';
5
+ import en from '../dist/runtime/locale/en.js';
5
6
 
6
7
  const CONFIG_KEY = "cookieControl";
7
8
 
@@ -47,6 +48,7 @@ const replaceCodePlugin = (config) => {
47
48
  };
48
49
 
49
50
  const DEFAULTS = {
51
+ _isPrerendered: void 0,
50
52
  barPosition: "bottom-full",
51
53
  closeModalOnClickOutside: false,
52
54
  colors: {
@@ -99,30 +101,11 @@ const DEFAULTS = {
99
101
  isIframeBlocked: false,
100
102
  isModalForced: false,
101
103
  locales: ["en"],
102
- // TODO: use Nuxt module "i18n"
103
- localeTexts: {
104
- en: {
105
- accept: "Accept",
106
- acceptAll: "Accept all",
107
- bannerDescription: "We use our own cookies and third-party cookies so that we can display this website correctly and better understand how this website is used, with a view to improving the services we offer. A decision on cookie usage permissions can be changed anytime using the cookie button that will appear after a selection has been made on this banner.",
108
- bannerTitle: "Cookies",
109
- close: "Close",
110
- cookiesFunctional: "Functional cookies",
111
- cookiesNecessary: "Necessary cookies",
112
- cookiesOptional: "Optional cookies",
113
- decline: "Decline",
114
- declineAll: "Decline all",
115
- here: "here",
116
- iframeBlocked: "To see this, please enable functional cookies",
117
- manageCookies: "Learn more and customize",
118
- save: "Save",
119
- settingsUnsaved: "You have unsaved settings"
120
- }
121
- }
104
+ localeTexts: { en }
122
105
  };
123
106
 
124
107
  const name = "@dargmuesli/nuxt-cookie-control";
125
- const version = "8.4.19";
108
+ const version = "8.4.21";
126
109
 
127
110
  const resolver = createResolver(import.meta.url);
128
111
  const runtimeDir = resolver.resolve("./runtime");
@@ -143,6 +126,7 @@ const module = defineNuxtModule({
143
126
  }
144
127
  },
145
128
  async setup(moduleOptions, nuxt) {
129
+ moduleOptions._isPrerendered = nuxt.options._generate;
146
130
  nuxt.options.alias["#cookie-control/set-vars"] = moduleOptions.isCssPonyfillEnabled ? resolver.resolve(runtimeDir, "set-vars/ponyfill") : resolver.resolve(runtimeDir, "set-vars/native");
147
131
  nuxt.options.alias["#cookie-control"] = runtimeDir;
148
132
  nuxt.options.build.transpile.push("#cookie-control");
@@ -0,0 +1,13 @@
1
+ <template>
2
+ <slot v-if="!isPrerendered" />
3
+ <ClientOnly v-else>
4
+ <slot />
5
+ </ClientOnly>
6
+ </template>
7
+
8
+ <script setup lang="ts">
9
+ import { useRuntimeConfig } from '#app'
10
+
11
+ const runtimeConfig = useRuntimeConfig()
12
+ const isPrerendered = runtimeConfig.public.cookieControl._isPrerendered
13
+ </script>
@@ -1,208 +1,212 @@
1
1
  <template>
2
- <aside class="cookieControl">
3
- <transition :name="`cookieControl__Bar--${moduleOptions.barPosition}`">
4
- <div
5
- v-if="!isConsentGiven && !moduleOptions.isModalForced"
6
- :class="`cookieControl__Bar cookieControl__Bar--${moduleOptions.barPosition}`"
7
- >
8
- <div class="cookieControl__BarContainer">
9
- <div>
10
- <slot name="bar">
11
- <h2 v-text="localeStrings?.bannerTitle" />
12
- <p v-text="localeStrings?.bannerDescription" />
13
- </slot>
14
- </div>
15
- <div class="cookieControl__BarButtons">
16
- <button
17
- type="button"
18
- @click="accept()"
19
- v-text="localeStrings?.accept"
20
- />
21
- <button
22
- v-if="moduleOptions.isAcceptNecessaryButtonEnabled"
23
- type="button"
24
- @click="decline()"
25
- v-text="localeStrings?.decline"
26
- />
27
- <button
28
- type="button"
29
- @click="isModalActive = true"
30
- v-text="localeStrings?.manageCookies"
31
- />
2
+ <ClientOnlyPrerender>
3
+ <aside class="cookieControl">
4
+ <transition :name="`cookieControl__Bar--${moduleOptions.barPosition}`">
5
+ <div
6
+ v-if="!isConsentGiven && !moduleOptions.isModalForced"
7
+ :class="`cookieControl__Bar cookieControl__Bar--${moduleOptions.barPosition}`"
8
+ >
9
+ <div class="cookieControl__BarContainer">
10
+ <div>
11
+ <slot name="bar">
12
+ <h2 v-text="localeStrings?.bannerTitle" />
13
+ <p v-text="localeStrings?.bannerDescription" />
14
+ </slot>
15
+ </div>
16
+ <div class="cookieControl__BarButtons">
17
+ <button
18
+ type="button"
19
+ @click="accept()"
20
+ v-text="localeStrings?.accept"
21
+ />
22
+ <button
23
+ v-if="moduleOptions.isAcceptNecessaryButtonEnabled"
24
+ type="button"
25
+ @click="decline()"
26
+ v-text="localeStrings?.decline"
27
+ />
28
+ <button
29
+ type="button"
30
+ @click="isModalActive = true"
31
+ v-text="localeStrings?.manageCookies"
32
+ />
33
+ </div>
32
34
  </div>
33
35
  </div>
34
- </div>
35
- </transition>
36
- <button
37
- v-if="moduleOptions.isControlButtonEnabled && isConsentGiven"
38
- aria-label="Cookie control"
39
- class="cookieControl__ControlButton"
40
- data-testid="nuxt-cookie-control-control-button"
41
- type="button"
42
- @click="isModalActive = true"
43
- >
44
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
45
- <path
46
- fill="currentColor"
47
- d="M510.52 255.82c-69.97-.85-126.47-57.69-126.47-127.86-70.17 0-127-56.49-127.86-126.45-27.26-4.14-55.13.3-79.72 12.82l-69.13 35.22a132.221 132.221 0 00-57.79 57.81l-35.1 68.88a132.645 132.645 0 00-12.82 80.95l12.08 76.27a132.521 132.521 0 0037.16 72.96l54.77 54.76a132.036 132.036 0 0072.71 37.06l76.71 12.15c27.51 4.36 55.7-.11 80.53-12.76l69.13-35.21a132.273 132.273 0 0057.79-57.81l35.1-68.88c12.56-24.64 17.01-52.58 12.91-79.91zM176 368c-17.67 0-32-14.33-32-32s14.33-32 32-32 32 14.33 32 32-14.33 32-32 32zm32-160c-17.67 0-32-14.33-32-32s14.33-32 32-32 32 14.33 32 32-14.33 32-32 32zm160 128c-17.67 0-32-14.33-32-32s14.33-32 32-32 32 14.33 32 32-14.33 32-32 32z"
48
- />
49
- </svg>
50
- </button>
51
- <transition name="cookieControl__Modal">
52
- <div
53
- v-if="isModalActive"
54
- class="cookieControl__Modal"
55
- @click.self="onModalClick"
36
+ </transition>
37
+ <button
38
+ v-if="moduleOptions.isControlButtonEnabled && isConsentGiven"
39
+ aria-label="Cookie control"
40
+ class="cookieControl__ControlButton"
41
+ data-testid="nuxt-cookie-control-control-button"
42
+ type="button"
43
+ @click="isModalActive = true"
56
44
  >
57
- <p
58
- v-if="isSaved"
59
- class="cookieControl__ModalUnsaved"
60
- v-text="localeStrings?.settingsUnsaved"
61
- />
62
- <div class="cookieControl__ModalContent">
63
- <div class="cookieControl__ModalContentInner">
64
- <slot name="modal" />
65
- <button
66
- v-if="!moduleOptions.isModalForced"
67
- class="cookieControl__ModalClose"
68
- type="button"
69
- @click="isModalActive = false"
70
- v-text="localeStrings?.close"
71
- />
72
- <template v-for="cookieType in CookieType" :key="cookieType">
73
- <template v-if="moduleOptions.cookies[cookieType].length">
74
- <h2
75
- v-text="
76
- localeStrings &&
77
- (cookieType === CookieType.NECESSARY
78
- ? localeStrings.cookiesNecessary
79
- : localeStrings.cookiesOptional)
80
- "
81
- />
82
- <ul>
83
- <li
84
- v-for="cookie in moduleOptions.cookies[cookieType]"
85
- :key="cookie.id"
86
- >
87
- <slot name="cookie" v-bind="{ cookie }">
88
- <div class="cookieControl__ModalInputWrapper">
89
- <input
90
- v-if="
91
- cookieType === CookieType.NECESSARY &&
92
- cookie.name !== 'functional'
93
- "
94
- :id="resolveTranslatable(cookie.name, props.locale)"
95
- type="checkbox"
96
- disabled
97
- checked
98
- />
99
- <input
100
- v-else
101
- :id="resolveTranslatable(cookie.name, props.locale)"
102
- type="checkbox"
103
- :checked="
104
- isConsentGiven === undefined
105
- ? cookie.isPreselected
106
- : getCookieIds(localCookiesEnabled).includes(
107
- cookie.id,
108
- )
109
- "
110
- @change="toogleCookie(cookie)"
111
- />
112
- <button type="button" @click="toggleButton($event)">
113
- {{ getName(cookie.name) }}
114
- </button>
115
- <label
116
- class="cookieControl__ModalCookieName"
117
- :for="resolveTranslatable(cookie.name, props.locale)"
118
- tabindex="0"
119
- @keydown="toggleLabel($event)"
120
- >
121
- {{ getName(cookie.name) }}
122
- <span v-if="cookie.description">
123
- {{ getDescription(cookie.description) }}
124
- </span>
125
- <span
45
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
46
+ <path
47
+ fill="currentColor"
48
+ d="M510.52 255.82c-69.97-.85-126.47-57.69-126.47-127.86-70.17 0-127-56.49-127.86-126.45-27.26-4.14-55.13.3-79.72 12.82l-69.13 35.22a132.221 132.221 0 00-57.79 57.81l-35.1 68.88a132.645 132.645 0 00-12.82 80.95l12.08 76.27a132.521 132.521 0 0037.16 72.96l54.77 54.76a132.036 132.036 0 0072.71 37.06l76.71 12.15c27.51 4.36 55.7-.11 80.53-12.76l69.13-35.21a132.273 132.273 0 0057.79-57.81l35.1-68.88c12.56-24.64 17.01-52.58 12.91-79.91zM176 368c-17.67 0-32-14.33-32-32s14.33-32 32-32 32 14.33 32 32-14.33 32-32 32zm32-160c-17.67 0-32-14.33-32-32s14.33-32 32-32 32 14.33 32 32-14.33 32-32 32zm160 128c-17.67 0-32-14.33-32-32s14.33-32 32-32 32 14.33 32 32-14.33 32-32 32z"
49
+ />
50
+ </svg>
51
+ </button>
52
+ <transition name="cookieControl__Modal">
53
+ <div
54
+ v-if="isModalActive"
55
+ class="cookieControl__Modal"
56
+ @click.self="onModalClick"
57
+ >
58
+ <p
59
+ v-if="isSaved"
60
+ class="cookieControl__ModalUnsaved"
61
+ v-text="localeStrings?.settingsUnsaved"
62
+ />
63
+ <div class="cookieControl__ModalContent">
64
+ <div class="cookieControl__ModalContentInner">
65
+ <slot name="modal" />
66
+ <button
67
+ v-if="!moduleOptions.isModalForced"
68
+ class="cookieControl__ModalClose"
69
+ type="button"
70
+ @click="isModalActive = false"
71
+ v-text="localeStrings?.close"
72
+ />
73
+ <template v-for="cookieType in CookieType" :key="cookieType">
74
+ <template v-if="moduleOptions.cookies[cookieType].length">
75
+ <h2
76
+ v-text="
77
+ localeStrings &&
78
+ (cookieType === CookieType.NECESSARY
79
+ ? localeStrings.cookiesNecessary
80
+ : localeStrings.cookiesOptional)
81
+ "
82
+ />
83
+ <ul>
84
+ <li
85
+ v-for="cookie in moduleOptions.cookies[cookieType]"
86
+ :key="cookie.id"
87
+ >
88
+ <slot name="cookie" v-bind="{ cookie }">
89
+ <div class="cookieControl__ModalInputWrapper">
90
+ <input
126
91
  v-if="
127
- moduleOptions.isCookieIdVisible &&
128
- cookie.targetCookieIds
92
+ cookieType === CookieType.NECESSARY &&
93
+ cookie.name !== 'functional'
129
94
  "
95
+ :id="resolveTranslatable(cookie.name, props.locale)"
96
+ type="checkbox"
97
+ disabled
98
+ checked
99
+ />
100
+ <input
101
+ v-else
102
+ :id="resolveTranslatable(cookie.name, props.locale)"
103
+ type="checkbox"
104
+ :checked="
105
+ isConsentGiven === undefined
106
+ ? cookie.isPreselected
107
+ : getCookieIds(localCookiesEnabled).includes(
108
+ cookie.id,
109
+ )
110
+ "
111
+ @change="toogleCookie(cookie)"
112
+ />
113
+ <button type="button" @click="toggleButton($event)">
114
+ {{ getName(cookie.name) }}
115
+ </button>
116
+ <label
117
+ class="cookieControl__ModalCookieName"
118
+ :for="
119
+ resolveTranslatable(cookie.name, props.locale)
120
+ "
121
+ tabindex="0"
122
+ @keydown="toggleLabel($event)"
130
123
  >
131
- <br />
132
- {{
133
- 'IDs: ' +
134
- cookie.targetCookieIds
135
- .map((id) => `"${id}"`)
136
- .join(', ')
137
- }}
138
- </span>
139
- <template
140
- v-if="Object.entries(cookie.links || {}).length"
141
- >
124
+ {{ getName(cookie.name) }}
125
+ <span v-if="cookie.description">
126
+ {{ getDescription(cookie.description) }}
127
+ </span>
142
128
  <span
143
- v-for="entry in Object.entries(
144
- cookie.links || {},
145
- )"
146
- :key="entry[0]"
129
+ v-if="
130
+ moduleOptions.isCookieIdVisible &&
131
+ cookie.targetCookieIds
132
+ "
147
133
  >
148
134
  <br />
149
- <NuxtLink
150
- :to="entry[0]"
151
- @click="
152
- !entry[0].toLowerCase().startsWith('http')
153
- ? (isModalActive = false)
154
- : null
155
- "
156
- >
157
- {{ entry[1] || entry[0] }}
158
- </NuxtLink>
135
+ {{
136
+ 'IDs: ' +
137
+ cookie.targetCookieIds
138
+ .map((id) => `"${id}"`)
139
+ .join(', ')
140
+ }}
159
141
  </span>
160
- </template>
161
- </label>
162
- </div>
163
- </slot>
164
- </li>
165
- </ul>
142
+ <template
143
+ v-if="Object.entries(cookie.links || {}).length"
144
+ >
145
+ <span
146
+ v-for="entry in Object.entries(
147
+ cookie.links || {},
148
+ )"
149
+ :key="entry[0]"
150
+ >
151
+ <br />
152
+ <NuxtLink
153
+ :to="entry[0]"
154
+ @click="
155
+ !entry[0].toLowerCase().startsWith('http')
156
+ ? (isModalActive = false)
157
+ : null
158
+ "
159
+ >
160
+ {{ entry[1] || entry[0] }}
161
+ </NuxtLink>
162
+ </span>
163
+ </template>
164
+ </label>
165
+ </div>
166
+ </slot>
167
+ </li>
168
+ </ul>
169
+ </template>
166
170
  </template>
167
- </template>
168
- <div class="cookieControl__ModalButtons">
169
- <button
170
- type="button"
171
- @click="
172
- () => {
173
- acceptPartial()
174
- isModalActive = false
175
- }
176
- "
177
- v-text="localeStrings?.save"
178
- />
179
- <button
180
- type="button"
181
- @click="
182
- () => {
183
- accept()
184
- isModalActive = false
185
- }
186
- "
187
- v-text="localeStrings?.acceptAll"
188
- />
189
- <button
190
- v-if="!moduleOptions.isModalForced"
191
- type="button"
192
- @click="
193
- () => {
194
- declineAll()
195
- isModalActive = false
196
- }
197
- "
198
- v-text="localeStrings?.declineAll"
199
- />
171
+ <div class="cookieControl__ModalButtons">
172
+ <button
173
+ type="button"
174
+ @click="
175
+ () => {
176
+ acceptPartial()
177
+ isModalActive = false
178
+ }
179
+ "
180
+ v-text="localeStrings?.save"
181
+ />
182
+ <button
183
+ type="button"
184
+ @click="
185
+ () => {
186
+ accept()
187
+ isModalActive = false
188
+ }
189
+ "
190
+ v-text="localeStrings?.acceptAll"
191
+ />
192
+ <button
193
+ v-if="!moduleOptions.isModalForced"
194
+ type="button"
195
+ @click="
196
+ () => {
197
+ declineAll()
198
+ isModalActive = false
199
+ }
200
+ "
201
+ v-text="localeStrings?.declineAll"
202
+ />
203
+ </div>
200
204
  </div>
201
205
  </div>
202
206
  </div>
203
- </div>
204
- </transition>
205
- </aside>
207
+ </transition>
208
+ </aside>
209
+ </ClientOnlyPrerender>
206
210
  </template>
207
211
 
208
212
  <script setup lang="ts">
@@ -223,6 +227,7 @@ import {
223
227
  import { COOKIE_ID_SEPARATOR } from '#cookie-control/constants'
224
228
  import setCssVariables from '#cookie-control/set-vars'
225
229
  import { useCookieControl, useCookie, useNuxtApp } from '#imports'
230
+ import ClientOnlyPrerender from '#cookie-control/components/ClientOnlyPrerender.vue'
226
231
 
227
232
  export interface Props {
228
233
  locale?: Locale
@@ -1,19 +1,21 @@
1
1
  <template>
2
- <iframe
3
- v-if="isCookieFunctionalEnabled"
4
- :cookie-enabled="null"
5
- v-bind="$attrs"
6
- />
7
- <div v-else class="cookieControl__BlockedIframe">
8
- <p>
9
- {{ localeStrings?.iframeBlocked }}
10
- <a
11
- href="#"
12
- @click.prevent="isModalActive = true"
13
- v-text="localeStrings?.here"
14
- />
15
- </p>
16
- </div>
2
+ <ClientOnlyPrerender>
3
+ <iframe
4
+ v-if="isCookieFunctionalEnabled"
5
+ :cookie-enabled="null"
6
+ v-bind="$attrs"
7
+ />
8
+ <div v-else class="cookieControl__BlockedIframe">
9
+ <p>
10
+ {{ localeStrings?.iframeBlocked }}
11
+ <a
12
+ href="#"
13
+ @click.prevent="isModalActive = true"
14
+ v-text="localeStrings?.here"
15
+ />
16
+ </p>
17
+ </div>
18
+ </ClientOnlyPrerender>
17
19
  </template>
18
20
 
19
21
  <script setup lang="ts">
@@ -21,6 +23,7 @@ import { computed } from 'vue'
21
23
 
22
24
  import type { Cookie } from '#cookie-control/types'
23
25
  import { useNuxtApp, useCookieControl } from '#imports'
26
+ import ClientOnlyPrerender from '#cookie-control/components/ClientOnlyPrerender.vue'
24
27
 
25
28
  const { cookiesEnabled, isModalActive, moduleOptions } = useCookieControl()
26
29
  const nuxtApp = useNuxtApp()
package/package.json CHANGED
@@ -14,26 +14,26 @@
14
14
  "@commitlint/cli": "19.6.1",
15
15
  "@commitlint/config-conventional": "19.6.0",
16
16
  "@dargmuesli/nuxt-cookie-control": "link:",
17
- "@nuxt/eslint-config": "0.7.3",
17
+ "@nuxt/eslint-config": "0.7.5",
18
18
  "@nuxt/module-builder": "0.8.4",
19
- "@nuxt/schema": "3.14.1592",
19
+ "@nuxt/schema": "3.15.1",
20
20
  "@semantic-release/changelog": "6.0.3",
21
- "@semantic-release/commit-analyzer": "13.0.0",
21
+ "@semantic-release/commit-analyzer": "13.0.1",
22
22
  "@semantic-release/git": "10.0.1",
23
23
  "@semantic-release/github": "11.0.1",
24
24
  "@semantic-release/npm": "12.0.1",
25
- "@semantic-release/release-notes-generator": "14.0.2",
26
- "eslint": "9.17.0",
27
- "eslint-config-prettier": "9.1.0",
25
+ "@semantic-release/release-notes-generator": "14.0.3",
26
+ "eslint": "9.18.0",
27
+ "eslint-config-prettier": "10.0.1",
28
28
  "eslint-plugin-prettier": "5.2.1",
29
29
  "husky": "9.1.7",
30
- "lint-staged": "15.2.11",
31
- "nuxt": "3.14.1592",
30
+ "lint-staged": "15.3.0",
31
+ "nuxt": "3.15.1",
32
32
  "prettier": "3.4.2",
33
- "semantic-release": "24.2.0",
34
- "vite": "6.0.3",
33
+ "semantic-release": "24.2.1",
34
+ "vite": "6.0.7",
35
35
  "vue": "3.5.13",
36
- "vue-tsc": "2.1.10",
36
+ "vue-tsc": "2.2.0",
37
37
  "webpack": "5.97.1"
38
38
  },
39
39
  "engines": {
@@ -69,7 +69,7 @@
69
69
  "Jonas Thelemann"
70
70
  ],
71
71
  "name": "@dargmuesli/nuxt-cookie-control",
72
- "packageManager": "pnpm@9.15.0",
72
+ "packageManager": "pnpm@9.15.4",
73
73
  "publishConfig": {
74
74
  "access": "public"
75
75
  },
@@ -80,7 +80,7 @@
80
80
  },
81
81
  "repository": "https://github.com/dargmuesli/nuxt-cookie-control",
82
82
  "resolutions": {
83
- "@nuxt/kit": "3.14.1592"
83
+ "@nuxt/kit": "3.15.1"
84
84
  },
85
85
  "scripts": {
86
86
  "build": "nuxt-module-build build",
@@ -94,5 +94,5 @@
94
94
  },
95
95
  "type": "module",
96
96
  "types": "./dist/types.d.ts",
97
- "version": "8.4.19"
97
+ "version": "8.4.21"
98
98
  }