@c15t/nextjs 3.0.0-alpha.0 → 3.0.0-alpha.1

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.
Files changed (13) hide show
  1. package/AGENTS.md +1 -0
  2. package/dist/iab/styles.tw3.css +4 -110
  3. package/dist/root.js +1 -1
  4. package/dist/styles.tw3.css +4 -110
  5. package/dist/version.js +1 -1
  6. package/dist-types/root.d.ts +8 -2
  7. package/dist-types/version.d.ts +1 -1
  8. package/docs/README.md +1 -0
  9. package/docs/frameworks/next/components/consent-manager-provider.md +8 -0
  10. package/docs/frameworks/next/script-loader.md +8 -0
  11. package/docs/frameworks/next/styling/overview.md +10 -0
  12. package/docs/integrations/clear-on-revocation.md +167 -0
  13. package/package.json +3 -3
package/AGENTS.md CHANGED
@@ -74,6 +74,7 @@ These docs describe v3. Start with Inth hosted setup, identify the framework, ro
74
74
  - [Ahrefs Analytics](./docs/integrations/ahrefs-analytics.md): Configure Ahrefs Analytics with c15t v3, understand measurement permission and verify loading and revocation.
75
75
  - [Amplitude](./docs/integrations/amplitude.md): Configure Amplitude with c15t v3, understand measurement permission and verify loading and revocation.
76
76
  - [Custom integrations](./docs/integrations/building-integrations.md): Define loading, initialization and consent-change behavior for a vendor without a helper.
77
+ - [Clear on revocation](./docs/integrations/clear-on-revocation.md): Remove configured first-party cookies and Web Storage keys when their consent category is denied.
77
78
  - [Clearbit](./docs/integrations/clearbit.md): Configure Clearbit with c15t v3, understand marketing permission and verify loading and revocation.
78
79
  - [Cloudflare Web Analytics](./docs/integrations/cloudflare-web-analytics.md): Configure Cloudflare Web Analytics with c15t v3, understand measurement permission and verify loading and revocation.
79
80
  - [Crisp](./docs/integrations/crisp.md): Configure Crisp with c15t v3, understand functionality permission and verify loading and revocation.
package/dist/iab/styles.tw3.css CHANGED
@@ -5,116 +5,10 @@
5
5
  * nested package CSS imports still include the complete stylesheet.
6
6
  */
7
7
  /* default theme tokens (generated from defaultTheme) */
8
- :root, :host, .c15t-theme-root {
9
- --c15t-border: hsl(0, 0%, 90%);
10
- --c15t-border-hover: hsl(0, 0%, 85%);
11
- --c15t-duration-fast: 80ms;
12
- --c15t-duration-normal: 150ms;
13
- --c15t-duration-slow: 200ms;
14
- --c15t-easing: cubic-bezier(0.4, 0, 0.2, 1);
15
- --c15t-easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
16
- --c15t-easing-out: cubic-bezier(0.215, 0.61, 0.355, 1);
17
- --c15t-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
18
- --c15t-font-family: system-ui, -apple-system, sans-serif;
19
- --c15t-font-size-base: 1rem;
20
- --c15t-font-size-lg: 1.125rem;
21
- --c15t-font-size-sm: 0.875rem;
22
- --c15t-font-weight-medium: 500;
23
- --c15t-font-weight-normal: 400;
24
- --c15t-font-weight-semibold: 600;
25
- --c15t-line-height-normal: 1.5;
26
- --c15t-line-height-relaxed: 1.75;
27
- --c15t-line-height-tight: 1.25;
28
- --c15t-overlay: hsla(0, 0%, 0%, 0.5);
29
- --c15t-primary: hsl(228, 100%, 60%);
30
- --c15t-primary-hover: hsl(228, 100%, 55%);
31
- --c15t-radius-full: 9999px;
32
- --c15t-radius-lg: 0.75rem;
33
- --c15t-radius-md: 0.5rem;
34
- --c15t-radius-sm: 0.25rem;
35
- --c15t-shadow-lg: 0 8px 24px hsla(0, 0%, 0%, 0.12);
36
- --c15t-shadow-md: 0 4px 12px hsla(0, 0%, 0%, 0.08);
37
- --c15t-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05);
38
- --c15t-space-lg: 1.5rem;
39
- --c15t-space-md: 1rem;
40
- --c15t-space-sm: 0.5rem;
41
- --c15t-space-xl: 2rem;
42
- --c15t-space-xs: 0.25rem;
43
- --c15t-surface: hsl(0, 0%, 100%);
44
- --c15t-surface-hover: hsl(0, 0%, 98%);
45
- --c15t-switch-thumb: hsl(0, 0%, 100%);
46
- --c15t-switch-track: hsl(0, 0%, 85%);
47
- --c15t-switch-track-active: hsl(228, 100%, 60%);
48
- --c15t-text: hsl(0, 0%, 10%);
49
- --c15t-text-muted: hsl(0, 0%, 40%);
50
- --c15t-text-on-primary: hsl(0, 0%, 100%);
51
- }
52
-
53
- :root.dark, :host(.dark), .dark .c15t-theme-root, :root.c15t-dark, :host(.c15t-dark), .c15t-dark .c15t-theme-root {
54
- --c15t-border: hsl(0, 0%, 20%);
55
- --c15t-border-hover: hsl(0, 0%, 25%);
56
- --c15t-duration-fast: 80ms;
57
- --c15t-duration-normal: 150ms;
58
- --c15t-duration-slow: 200ms;
59
- --c15t-easing: cubic-bezier(0.4, 0, 0.2, 1);
60
- --c15t-easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
61
- --c15t-easing-out: cubic-bezier(0.215, 0.61, 0.355, 1);
62
- --c15t-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
63
- --c15t-font-family: system-ui, -apple-system, sans-serif;
64
- --c15t-font-size-base: 1rem;
65
- --c15t-font-size-lg: 1.125rem;
66
- --c15t-font-size-sm: 0.875rem;
67
- --c15t-font-weight-medium: 500;
68
- --c15t-font-weight-normal: 400;
69
- --c15t-font-weight-semibold: 600;
70
- --c15t-line-height-normal: 1.5;
71
- --c15t-line-height-relaxed: 1.75;
72
- --c15t-line-height-tight: 1.25;
73
- --c15t-overlay: hsla(0, 0%, 0%, 0.7);
74
- --c15t-primary: hsl(228, 100%, 70%);
75
- --c15t-primary-hover: hsl(228, 100%, 65%);
76
- --c15t-radius-full: 9999px;
77
- --c15t-radius-lg: 0.75rem;
78
- --c15t-radius-md: 0.5rem;
79
- --c15t-radius-sm: 0.25rem;
80
- --c15t-shadow-lg: 0 8px 24px hsla(0, 0%, 0%, 0.12);
81
- --c15t-shadow-md: 0 4px 12px hsla(0, 0%, 0%, 0.08);
82
- --c15t-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05);
83
- --c15t-space-lg: 1.5rem;
84
- --c15t-space-md: 1rem;
85
- --c15t-space-sm: 0.5rem;
86
- --c15t-space-xl: 2rem;
87
- --c15t-space-xs: 0.25rem;
88
- --c15t-surface: hsl(0, 0%, 7%);
89
- --c15t-surface-hover: hsl(0, 0%, 10%);
90
- --c15t-switch-thumb: hsl(0, 0%, 93%);
91
- --c15t-switch-track: hsl(0, 0%, 25%);
92
- --c15t-switch-track-active: hsl(228, 100%, 70%);
93
- --c15t-text: hsl(0, 0%, 93%);
94
- --c15t-text-muted: hsl(0, 0%, 60%);
95
- --c15t-text-on-primary: hsl(0, 0%, 100%);
96
- }
97
-
98
- /*
99
- * Utility class to disable transitions during theme switching.
100
- * Apply this class to the root element before switching themes,
101
- * then remove it after a short delay to prevent flash of
102
- * animated content during the color scheme change.
103
- *
104
- * Example usage:
105
- * document.documentElement.classList.add('c15t-no-transitions');
106
- * // Switch theme...
107
- * requestAnimationFrame(() => {
108
- * document.documentElement.classList.remove('c15t-no-transitions');
109
- * });
110
- */
111
- .c15t-no-transitions,
112
- .c15t-no-transitions *,
113
- .c15t-no-transitions *::before,
114
- .c15t-no-transitions *::after {
115
- transition: none !important;
116
- animation: none !important;
117
- }
8
+ :root,:host,.c15t-theme-root{--c15t-border: hsl(0, 0%, 90%);--c15t-border-hover: hsl(0, 0%, 85%);--c15t-duration-fast: 80ms;--c15t-duration-normal: 150ms;--c15t-duration-slow: 200ms;--c15t-easing: cubic-bezier(0.4, 0, 0.2, 1);--c15t-easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);--c15t-easing-out: cubic-bezier(0.215, 0.61, 0.355, 1);--c15t-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);--c15t-font-family: system-ui, -apple-system, sans-serif;--c15t-font-size-base: 1rem;--c15t-font-size-lg: 1.125rem;--c15t-font-size-sm: 0.875rem;--c15t-font-weight-medium: 500;--c15t-font-weight-normal: 400;--c15t-font-weight-semibold: 600;--c15t-line-height-normal: 1.5;--c15t-line-height-relaxed: 1.75;--c15t-line-height-tight: 1.25;--c15t-overlay: hsla(0, 0%, 0%, 0.5);--c15t-primary: hsl(228, 100%, 60%);--c15t-primary-hover: hsl(228, 100%, 55%);--c15t-radius-full: 9999px;--c15t-radius-lg: 0.75rem;--c15t-radius-md: 0.5rem;--c15t-radius-sm: 0.25rem;--c15t-shadow-lg: 0 8px 24px hsla(0, 0%, 0%, 0.12);--c15t-shadow-md: 0 4px 12px hsla(0, 0%, 0%, 0.08);--c15t-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05);--c15t-space-lg: 1.5rem;--c15t-space-md: 1rem;--c15t-space-sm: 0.5rem;--c15t-space-xl: 2rem;--c15t-space-xs: 0.25rem;--c15t-surface: hsl(0, 0%, 100%);--c15t-surface-hover: hsl(0, 0%, 98%);--c15t-switch-thumb: hsl(0, 0%, 100%);--c15t-switch-track: hsl(0, 0%, 85%);--c15t-switch-track-active: hsl(228, 100%, 60%);--c15t-text: hsl(0, 0%, 10%);--c15t-text-muted: hsl(0, 0%, 40%);--c15t-text-on-primary: hsl(0, 0%, 100%);}
9
+
10
+ :root.dark,:host(.dark),.dark .c15t-theme-root,:root.c15t-dark,:host(.c15t-dark),.c15t-dark .c15t-theme-root{--c15t-border: hsl(0, 0%, 20%);--c15t-border-hover: hsl(0, 0%, 25%);--c15t-duration-fast: 80ms;--c15t-duration-normal: 150ms;--c15t-duration-slow: 200ms;--c15t-easing: cubic-bezier(0.4, 0, 0.2, 1);--c15t-easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);--c15t-easing-out: cubic-bezier(0.215, 0.61, 0.355, 1);--c15t-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);--c15t-font-family: system-ui, -apple-system, sans-serif;--c15t-font-size-base: 1rem;--c15t-font-size-lg: 1.125rem;--c15t-font-size-sm: 0.875rem;--c15t-font-weight-medium: 500;--c15t-font-weight-normal: 400;--c15t-font-weight-semibold: 600;--c15t-line-height-normal: 1.5;--c15t-line-height-relaxed: 1.75;--c15t-line-height-tight: 1.25;--c15t-overlay: hsla(0, 0%, 0%, 0.7);--c15t-primary: hsl(228, 100%, 70%);--c15t-primary-hover: hsl(228, 100%, 65%);--c15t-radius-full: 9999px;--c15t-radius-lg: 0.75rem;--c15t-radius-md: 0.5rem;--c15t-radius-sm: 0.25rem;--c15t-shadow-lg: 0 8px 24px hsla(0, 0%, 0%, 0.12);--c15t-shadow-md: 0 4px 12px hsla(0, 0%, 0%, 0.08);--c15t-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05);--c15t-space-lg: 1.5rem;--c15t-space-md: 1rem;--c15t-space-sm: 0.5rem;--c15t-space-xl: 2rem;--c15t-space-xs: 0.25rem;--c15t-surface: hsl(0, 0%, 7%);--c15t-surface-hover: hsl(0, 0%, 10%);--c15t-switch-thumb: hsl(0, 0%, 93%);--c15t-switch-track: hsl(0, 0%, 25%);--c15t-switch-track-active: hsl(228, 100%, 70%);--c15t-text: hsl(0, 0%, 93%);--c15t-text-muted: hsl(0, 0%, 60%);--c15t-text-on-primary: hsl(0, 0%, 100%);}
11
+ .c15t-no-transitions,.c15t-no-transitions *,.c15t-no-transitions *::before,.c15t-no-transitions *::after{transition: none !important;animation: none !important;}
118
12
 
119
13
  /* primitives/button vars */
120
14
  :root, :host{--button-primary:var(--c15t-primary);--button-primary-dark:var(--c15t-primary);--button-primary-hover:var(--c15t-primary-hover);--button-primary-hover-dark:var(--c15t-primary-hover);--button-neutral:var(--c15t-text-muted);--button-neutral-dark:var(--c15t-text-muted);--button-neutral-hover:var(--c15t-text);--button-neutral-hover-dark:var(--c15t-text);--button-neutral-soft:var(--c15t-surface-hover);--button-neutral-soft-dark:var(--c15t-surface-hover);--button-focus-ring:var(--c15t-primary);--button-focus-ring-dark:var(--c15t-primary);--button-text:var(--c15t-text);--button-text-dark:var(--c15t-text);--button-text-hover:var(--c15t-text);--button-text-hover-dark:var(--c15t-text);--button-background-color:var(--c15t-surface);--button-background-color-dark:var(--c15t-surface);--button-border:var(--c15t-border);--button-border-dark:var(--c15t-border);--button-hover-overlay:var(--c15t-surface-hover);--button-hover-overlay-dark:var(--c15t-surface-hover);--button-primary-hover-tint:color-mix(in srgb, var(--c15t-primary) 10%, transparent);--button-neutral-hover-tint:color-mix(in srgb, var(--c15t-text) 10%, transparent);--button-font:var(--c15t-font-family);--button-border-width:1px;--button-border-style:solid;--button-border-color:var(--c15t-border);--button-border-radius:var(--c15t-radius-md);--button-font-weight:var(--c15t-font-weight-medium);--button-font-size:var(--c15t-font-size-sm);--button-line-height:var(--c15t-line-height-tight);--button-transition:opacity var(--c15t-duration-fast) var(--c15t-easing), transform var(--c15t-duration-fast) var(--c15t-easing);--button-hover-transition-color:background-color var(--c15t-duration-fast) var(--c15t-easing);--button-hover-transition-full:background-color var(--c15t-duration-fast) var(--c15t-easing), box-shadow var(--c15t-duration-fast) var(--c15t-easing), color var(--c15t-duration-fast) var(--c15t-easing);--button-cursor:pointer;--button-shadow:var(--c15t-shadow-sm);--button-shadow-dark:var(--c15t-shadow-sm);--button-shadow-primary-focus:0 0 0 2px var(--button-focus-ring);--button-shadow-neutral-focus:0 0 0 2px var(--button-focus-ring);--button-shadow-primary-focus-dark:0 0 0 2px var(--button-focus-ring-dark);--button-shadow-neutral-focus-dark:0 0 0 2px var(--button-focus-ring-dark);--button-shadow-primary:var(--button-shadow), inset 0 0 0 1px var(--button-primary);--button-shadow-primary-dark:var(--button-shadow-dark), inset 0 0 0 1px var(--button-primary-dark);--button-shadow-primary-hover:none;--button-shadow-primary-hover-dark:none;--button-shadow-neutral:var(--button-shadow), inset 0 0 0 1px var(--button-neutral-soft);--button-shadow-neutral-dark:var(--button-shadow-dark), inset 0 0 0 1px var(--button-neutral-soft-dark);--button-shadow-neutral-hover:none;--button-shadow-neutral-hover-dark:none}
package/dist/root.js CHANGED
@@ -1,2 +1,2 @@
1
1
  "use client";
2
- import{jsx as t}from"react/jsx-runtime";import{custom as r,hosted as a,offline as e}from"@c15t/react";import{ConsentProvider as n}from"@c15t/react/provider";import{useMemo as i}from"react";let o=async function(t){let{createManifestTransport:r}=await import("@c15t/core/transports/manifest");return r(t)},c=function(t){let r,a=function(){return r??=(async()=>{try{return await o(t)}catch(t){throw r=void 0,t}})()};return{async identify(t,r){await (await a()).identify?.(t,r)},async init(t){let r=await a();return await r.init?.(t)??{}},loadSubjectRecord:async t=>await (await a()).loadSubjectRecord?.(t)??null,async recordPrivacyOptOut(t,r){await (await a()).recordPrivacyOptOut?.(t,r)},async save(t){let r=await a();if(!r.save)throw Error("@c15t/nextjs: manifest transport cannot save.");return await r.save(t)}}},s=({state:o,backendURL:s,config:d,scripts:u,scriptLoader:m,networkBlocker:f,persistence:p,options:w,children:R})=>{var l;let y=s??d?.backendURL,v=d?.initURL||!y?void 0:d?.manifestURL,L=i(()=>y&&v?c({backendURL:y,manifestURL:v}):void 0,[v,y]),U=(l={backendURL:y,config:d,manifestTransport:L,mode:w?.mode}).mode?l.mode:l.backendURL?l.config?.initURL?a({assertDecisionInputs:!0,initURL:l.config.initURL,url:l.backendURL}):l.manifestTransport?r(l.manifestTransport):a({url:l.backendURL}):e();return t(n,{options:{...w,__debugPkg:"@c15t/nextjs",mode:U,networkBlocker:f,persistence:p,prefetch:o,scriptLoader:m,scripts:u},children:R})};export{s as ConsentRoot};
2
+ import{jsx as t}from"react/jsx-runtime";import{custom as r,hosted as a,offline as e}from"@c15t/react";import{ConsentProvider as n}from"@c15t/react/provider";import{useMemo as i}from"react";let o=async function(t){let{createManifestTransport:r}=await import("@c15t/core/transports/manifest");return r(t)},c=function(t){let r,a=function(){return r??=(async()=>{try{return await o(t)}catch(t){throw r=void 0,t}})()};return{async identify(t,r){await (await a()).identify?.(t,r)},async init(t){let r=await a();return await r.init?.(t)??{}},loadSubjectRecord:async t=>await (await a()).loadSubjectRecord?.(t)??null,async recordPrivacyOptOut(t,r){await (await a()).recordPrivacyOptOut?.(t,r)},async save(t){let r=await a();if(!r.save)throw Error("@c15t/nextjs: manifest transport cannot save.");return await r.save(t)}}},s=({state:o,backendURL:s,config:d,scripts:u,scriptLoader:m,clearOnRevocation:f,networkBlocker:p,persistence:w,options:R,children:l})=>{var y;let v=s??d?.backendURL,L=d?.initURL||!v?void 0:d?.manifestURL,U=i(()=>v&&L?c({backendURL:v,manifestURL:L}):void 0,[L,v]),b=(y={backendURL:v,config:d,manifestTransport:U,mode:R?.mode}).mode?y.mode:y.backendURL?y.config?.initURL?a({assertDecisionInputs:!0,initURL:y.config.initURL,url:y.backendURL}):y.manifestTransport?r(y.manifestTransport):a({url:y.backendURL}):e();return t(n,{options:{...R,__debugPkg:"@c15t/nextjs",clearOnRevocation:f,mode:b,networkBlocker:p,persistence:w,prefetch:o,scriptLoader:m,scripts:u},children:l})};export{s as ConsentRoot};
package/dist/styles.tw3.css CHANGED
@@ -5,116 +5,10 @@
5
5
  * nested package CSS imports still include the complete stylesheet.
6
6
  */
7
7
  /* default theme tokens (generated from defaultTheme) */
8
- :root, :host, .c15t-theme-root {
9
- --c15t-border: hsl(0, 0%, 90%);
10
- --c15t-border-hover: hsl(0, 0%, 85%);
11
- --c15t-duration-fast: 80ms;
12
- --c15t-duration-normal: 150ms;
13
- --c15t-duration-slow: 200ms;
14
- --c15t-easing: cubic-bezier(0.4, 0, 0.2, 1);
15
- --c15t-easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
16
- --c15t-easing-out: cubic-bezier(0.215, 0.61, 0.355, 1);
17
- --c15t-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
18
- --c15t-font-family: system-ui, -apple-system, sans-serif;
19
- --c15t-font-size-base: 1rem;
20
- --c15t-font-size-lg: 1.125rem;
21
- --c15t-font-size-sm: 0.875rem;
22
- --c15t-font-weight-medium: 500;
23
- --c15t-font-weight-normal: 400;
24
- --c15t-font-weight-semibold: 600;
25
- --c15t-line-height-normal: 1.5;
26
- --c15t-line-height-relaxed: 1.75;
27
- --c15t-line-height-tight: 1.25;
28
- --c15t-overlay: hsla(0, 0%, 0%, 0.5);
29
- --c15t-primary: hsl(228, 100%, 60%);
30
- --c15t-primary-hover: hsl(228, 100%, 55%);
31
- --c15t-radius-full: 9999px;
32
- --c15t-radius-lg: 0.75rem;
33
- --c15t-radius-md: 0.5rem;
34
- --c15t-radius-sm: 0.25rem;
35
- --c15t-shadow-lg: 0 8px 24px hsla(0, 0%, 0%, 0.12);
36
- --c15t-shadow-md: 0 4px 12px hsla(0, 0%, 0%, 0.08);
37
- --c15t-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05);
38
- --c15t-space-lg: 1.5rem;
39
- --c15t-space-md: 1rem;
40
- --c15t-space-sm: 0.5rem;
41
- --c15t-space-xl: 2rem;
42
- --c15t-space-xs: 0.25rem;
43
- --c15t-surface: hsl(0, 0%, 100%);
44
- --c15t-surface-hover: hsl(0, 0%, 98%);
45
- --c15t-switch-thumb: hsl(0, 0%, 100%);
46
- --c15t-switch-track: hsl(0, 0%, 85%);
47
- --c15t-switch-track-active: hsl(228, 100%, 60%);
48
- --c15t-text: hsl(0, 0%, 10%);
49
- --c15t-text-muted: hsl(0, 0%, 40%);
50
- --c15t-text-on-primary: hsl(0, 0%, 100%);
51
- }
52
-
53
- :root.dark, :host(.dark), .dark .c15t-theme-root, :root.c15t-dark, :host(.c15t-dark), .c15t-dark .c15t-theme-root {
54
- --c15t-border: hsl(0, 0%, 20%);
55
- --c15t-border-hover: hsl(0, 0%, 25%);
56
- --c15t-duration-fast: 80ms;
57
- --c15t-duration-normal: 150ms;
58
- --c15t-duration-slow: 200ms;
59
- --c15t-easing: cubic-bezier(0.4, 0, 0.2, 1);
60
- --c15t-easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
61
- --c15t-easing-out: cubic-bezier(0.215, 0.61, 0.355, 1);
62
- --c15t-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
63
- --c15t-font-family: system-ui, -apple-system, sans-serif;
64
- --c15t-font-size-base: 1rem;
65
- --c15t-font-size-lg: 1.125rem;
66
- --c15t-font-size-sm: 0.875rem;
67
- --c15t-font-weight-medium: 500;
68
- --c15t-font-weight-normal: 400;
69
- --c15t-font-weight-semibold: 600;
70
- --c15t-line-height-normal: 1.5;
71
- --c15t-line-height-relaxed: 1.75;
72
- --c15t-line-height-tight: 1.25;
73
- --c15t-overlay: hsla(0, 0%, 0%, 0.7);
74
- --c15t-primary: hsl(228, 100%, 70%);
75
- --c15t-primary-hover: hsl(228, 100%, 65%);
76
- --c15t-radius-full: 9999px;
77
- --c15t-radius-lg: 0.75rem;
78
- --c15t-radius-md: 0.5rem;
79
- --c15t-radius-sm: 0.25rem;
80
- --c15t-shadow-lg: 0 8px 24px hsla(0, 0%, 0%, 0.12);
81
- --c15t-shadow-md: 0 4px 12px hsla(0, 0%, 0%, 0.08);
82
- --c15t-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05);
83
- --c15t-space-lg: 1.5rem;
84
- --c15t-space-md: 1rem;
85
- --c15t-space-sm: 0.5rem;
86
- --c15t-space-xl: 2rem;
87
- --c15t-space-xs: 0.25rem;
88
- --c15t-surface: hsl(0, 0%, 7%);
89
- --c15t-surface-hover: hsl(0, 0%, 10%);
90
- --c15t-switch-thumb: hsl(0, 0%, 93%);
91
- --c15t-switch-track: hsl(0, 0%, 25%);
92
- --c15t-switch-track-active: hsl(228, 100%, 70%);
93
- --c15t-text: hsl(0, 0%, 93%);
94
- --c15t-text-muted: hsl(0, 0%, 60%);
95
- --c15t-text-on-primary: hsl(0, 0%, 100%);
96
- }
97
-
98
- /*
99
- * Utility class to disable transitions during theme switching.
100
- * Apply this class to the root element before switching themes,
101
- * then remove it after a short delay to prevent flash of
102
- * animated content during the color scheme change.
103
- *
104
- * Example usage:
105
- * document.documentElement.classList.add('c15t-no-transitions');
106
- * // Switch theme...
107
- * requestAnimationFrame(() => {
108
- * document.documentElement.classList.remove('c15t-no-transitions');
109
- * });
110
- */
111
- .c15t-no-transitions,
112
- .c15t-no-transitions *,
113
- .c15t-no-transitions *::before,
114
- .c15t-no-transitions *::after {
115
- transition: none !important;
116
- animation: none !important;
117
- }
8
+ :root,:host,.c15t-theme-root{--c15t-border: hsl(0, 0%, 90%);--c15t-border-hover: hsl(0, 0%, 85%);--c15t-duration-fast: 80ms;--c15t-duration-normal: 150ms;--c15t-duration-slow: 200ms;--c15t-easing: cubic-bezier(0.4, 0, 0.2, 1);--c15t-easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);--c15t-easing-out: cubic-bezier(0.215, 0.61, 0.355, 1);--c15t-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);--c15t-font-family: system-ui, -apple-system, sans-serif;--c15t-font-size-base: 1rem;--c15t-font-size-lg: 1.125rem;--c15t-font-size-sm: 0.875rem;--c15t-font-weight-medium: 500;--c15t-font-weight-normal: 400;--c15t-font-weight-semibold: 600;--c15t-line-height-normal: 1.5;--c15t-line-height-relaxed: 1.75;--c15t-line-height-tight: 1.25;--c15t-overlay: hsla(0, 0%, 0%, 0.5);--c15t-primary: hsl(228, 100%, 60%);--c15t-primary-hover: hsl(228, 100%, 55%);--c15t-radius-full: 9999px;--c15t-radius-lg: 0.75rem;--c15t-radius-md: 0.5rem;--c15t-radius-sm: 0.25rem;--c15t-shadow-lg: 0 8px 24px hsla(0, 0%, 0%, 0.12);--c15t-shadow-md: 0 4px 12px hsla(0, 0%, 0%, 0.08);--c15t-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05);--c15t-space-lg: 1.5rem;--c15t-space-md: 1rem;--c15t-space-sm: 0.5rem;--c15t-space-xl: 2rem;--c15t-space-xs: 0.25rem;--c15t-surface: hsl(0, 0%, 100%);--c15t-surface-hover: hsl(0, 0%, 98%);--c15t-switch-thumb: hsl(0, 0%, 100%);--c15t-switch-track: hsl(0, 0%, 85%);--c15t-switch-track-active: hsl(228, 100%, 60%);--c15t-text: hsl(0, 0%, 10%);--c15t-text-muted: hsl(0, 0%, 40%);--c15t-text-on-primary: hsl(0, 0%, 100%);}
9
+
10
+ :root.dark,:host(.dark),.dark .c15t-theme-root,:root.c15t-dark,:host(.c15t-dark),.c15t-dark .c15t-theme-root{--c15t-border: hsl(0, 0%, 20%);--c15t-border-hover: hsl(0, 0%, 25%);--c15t-duration-fast: 80ms;--c15t-duration-normal: 150ms;--c15t-duration-slow: 200ms;--c15t-easing: cubic-bezier(0.4, 0, 0.2, 1);--c15t-easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);--c15t-easing-out: cubic-bezier(0.215, 0.61, 0.355, 1);--c15t-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);--c15t-font-family: system-ui, -apple-system, sans-serif;--c15t-font-size-base: 1rem;--c15t-font-size-lg: 1.125rem;--c15t-font-size-sm: 0.875rem;--c15t-font-weight-medium: 500;--c15t-font-weight-normal: 400;--c15t-font-weight-semibold: 600;--c15t-line-height-normal: 1.5;--c15t-line-height-relaxed: 1.75;--c15t-line-height-tight: 1.25;--c15t-overlay: hsla(0, 0%, 0%, 0.7);--c15t-primary: hsl(228, 100%, 70%);--c15t-primary-hover: hsl(228, 100%, 65%);--c15t-radius-full: 9999px;--c15t-radius-lg: 0.75rem;--c15t-radius-md: 0.5rem;--c15t-radius-sm: 0.25rem;--c15t-shadow-lg: 0 8px 24px hsla(0, 0%, 0%, 0.12);--c15t-shadow-md: 0 4px 12px hsla(0, 0%, 0%, 0.08);--c15t-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05);--c15t-space-lg: 1.5rem;--c15t-space-md: 1rem;--c15t-space-sm: 0.5rem;--c15t-space-xl: 2rem;--c15t-space-xs: 0.25rem;--c15t-surface: hsl(0, 0%, 7%);--c15t-surface-hover: hsl(0, 0%, 10%);--c15t-switch-thumb: hsl(0, 0%, 93%);--c15t-switch-track: hsl(0, 0%, 25%);--c15t-switch-track-active: hsl(228, 100%, 70%);--c15t-text: hsl(0, 0%, 93%);--c15t-text-muted: hsl(0, 0%, 60%);--c15t-text-on-primary: hsl(0, 0%, 100%);}
11
+ .c15t-no-transitions,.c15t-no-transitions *,.c15t-no-transitions *::before,.c15t-no-transitions *::after{transition: none !important;animation: none !important;}
118
12
 
119
13
  /* primitives/button vars */
120
14
  :root, :host{--button-primary:var(--c15t-primary);--button-primary-dark:var(--c15t-primary);--button-primary-hover:var(--c15t-primary-hover);--button-primary-hover-dark:var(--c15t-primary-hover);--button-neutral:var(--c15t-text-muted);--button-neutral-dark:var(--c15t-text-muted);--button-neutral-hover:var(--c15t-text);--button-neutral-hover-dark:var(--c15t-text);--button-neutral-soft:var(--c15t-surface-hover);--button-neutral-soft-dark:var(--c15t-surface-hover);--button-focus-ring:var(--c15t-primary);--button-focus-ring-dark:var(--c15t-primary);--button-text:var(--c15t-text);--button-text-dark:var(--c15t-text);--button-text-hover:var(--c15t-text);--button-text-hover-dark:var(--c15t-text);--button-background-color:var(--c15t-surface);--button-background-color-dark:var(--c15t-surface);--button-border:var(--c15t-border);--button-border-dark:var(--c15t-border);--button-hover-overlay:var(--c15t-surface-hover);--button-hover-overlay-dark:var(--c15t-surface-hover);--button-primary-hover-tint:color-mix(in srgb, var(--c15t-primary) 10%, transparent);--button-neutral-hover-tint:color-mix(in srgb, var(--c15t-text) 10%, transparent);--button-font:var(--c15t-font-family);--button-border-width:1px;--button-border-style:solid;--button-border-color:var(--c15t-border);--button-border-radius:var(--c15t-radius-md);--button-font-weight:var(--c15t-font-weight-medium);--button-font-size:var(--c15t-font-size-sm);--button-line-height:var(--c15t-line-height-tight);--button-transition:opacity var(--c15t-duration-fast) var(--c15t-easing), transform var(--c15t-duration-fast) var(--c15t-easing);--button-hover-transition-color:background-color var(--c15t-duration-fast) var(--c15t-easing);--button-hover-transition-full:background-color var(--c15t-duration-fast) var(--c15t-easing), box-shadow var(--c15t-duration-fast) var(--c15t-easing), color var(--c15t-duration-fast) var(--c15t-easing);--button-cursor:pointer;--button-shadow:var(--c15t-shadow-sm);--button-shadow-dark:var(--c15t-shadow-sm);--button-shadow-primary-focus:0 0 0 2px var(--button-focus-ring);--button-shadow-neutral-focus:0 0 0 2px var(--button-focus-ring);--button-shadow-primary-focus-dark:0 0 0 2px var(--button-focus-ring-dark);--button-shadow-neutral-focus-dark:0 0 0 2px var(--button-focus-ring-dark);--button-shadow-primary:var(--button-shadow), inset 0 0 0 1px var(--button-primary);--button-shadow-primary-dark:var(--button-shadow-dark), inset 0 0 0 1px var(--button-primary-dark);--button-shadow-primary-hover:none;--button-shadow-primary-hover-dark:none;--button-shadow-neutral:var(--button-shadow), inset 0 0 0 1px var(--button-neutral-soft);--button-shadow-neutral-dark:var(--button-shadow-dark), inset 0 0 0 1px var(--button-neutral-soft-dark);--button-shadow-neutral-hover:none;--button-shadow-neutral-hover-dark:none}
package/dist/version.js CHANGED
@@ -1 +1 @@
1
- let e="3.0.0-alpha.0";export{e as version};
1
+ let e="3.0.0-alpha.1";export{e as version};
package/dist-types/root.d.ts CHANGED
@@ -35,6 +35,12 @@ export interface ConsentRootProps {
35
35
  * Script tags to manage with the script-loader module.
36
36
  */
37
37
  scripts?: Script[];
38
+ /**
39
+ * Remove configured browser data for initially denied categories after policy
40
+ * resolution and when consent is later revoked.
41
+ * Initial-only: remount ConsentRoot to replace the cleanup configuration.
42
+ */
43
+ clearOnRevocation?: ConsentProviderOptions['clearOnRevocation'];
38
44
  /**
39
45
  * Script-loader options.
40
46
  */
@@ -50,7 +56,7 @@ export interface ConsentRootProps {
50
56
  /**
51
57
  * Additional React provider options.
52
58
  */
53
- options?: Omit<ConsentProviderOptions, 'mode' | 'networkBlocker' | 'persistence' | 'prefetch' | 'scriptLoader' | 'scripts' | '__debugPkg'> & {
59
+ options?: Omit<ConsentProviderOptions, 'mode' | 'clearOnRevocation' | 'networkBlocker' | 'persistence' | 'prefetch' | 'scriptLoader' | 'scripts' | '__debugPkg'> & {
54
60
  mode?: ProviderTransportFactory;
55
61
  };
56
62
  children: ReactNode;
@@ -83,4 +89,4 @@ export interface ConsentRootProps {
83
89
  * }
84
90
  * ```
85
91
  */
86
- export declare const ConsentRoot: ({ state, backendURL, config, scripts, scriptLoader, networkBlocker, persistence, options, children, }: ConsentRootProps) => import("react").JSX.Element;
92
+ export declare const ConsentRoot: ({ state, backendURL, config, scripts, scriptLoader, clearOnRevocation, networkBlocker, persistence, options, children, }: ConsentRootProps) => import("react").JSX.Element;
package/dist-types/version.d.ts CHANGED
@@ -1 +1 @@
1
- export declare const version = "3.0.0-alpha.0";
1
+ export declare const version = "3.0.0-alpha.1";
package/docs/README.md CHANGED
@@ -74,6 +74,7 @@ These docs describe v3. Start with Inth hosted setup, identify the framework, ro
74
74
  - [Ahrefs Analytics](./integrations/ahrefs-analytics.md): Configure Ahrefs Analytics with c15t v3, understand measurement permission and verify loading and revocation.
75
75
  - [Amplitude](./integrations/amplitude.md): Configure Amplitude with c15t v3, understand measurement permission and verify loading and revocation.
76
76
  - [Custom integrations](./integrations/building-integrations.md): Define loading, initialization and consent-change behavior for a vendor without a helper.
77
+ - [Clear on revocation](./integrations/clear-on-revocation.md): Remove configured first-party cookies and Web Storage keys when their consent category is denied.
77
78
  - [Clearbit](./integrations/clearbit.md): Configure Clearbit with c15t v3, understand marketing permission and verify loading and revocation.
78
79
  - [Cloudflare Web Analytics](./integrations/cloudflare-web-analytics.md): Configure Cloudflare Web Analytics with c15t v3, understand measurement permission and verify loading and revocation.
79
80
  - [Crisp](./integrations/crisp.md): Configure Crisp with c15t v3, understand functionality permission and verify loading and revocation.
package/docs/frameworks/next/components/consent-manager-provider.md CHANGED
@@ -67,3 +67,11 @@ Its owner must start and dispose that runtime.
67
67
  For standard Next.js setups, keep `ConsentRoot`. It supports
68
68
  [browser initialization](../client-side.md) as well as
69
69
  [server prefetch](../server-side.md).
70
+
71
+ ## Clear data when consent is denied
72
+
73
+ Pass `clearOnRevocation` to `ConsentRoot`, or through the client provider's
74
+ `options`, to declare cookies and Web Storage keys by optional consent category.
75
+ Cleanup runs in the browser after policy resolution. The provider option is
76
+ initial-only. See [clear on revocation](../../../integrations/clear-on-revocation.md)
77
+ for examples, cookie scopes, and browser limits.
package/docs/frameworks/next/script-loader.md CHANGED
@@ -166,3 +166,11 @@ with DevTools, or follow [verification](../../guides/verify-consent.md) in your
166
166
  Use [custom integrations](../../integrations/building-integrations.md) for an
167
167
  unlisted vendor. Google helpers have a separate
168
168
  [Consent Mode contract](../../integrations/google-tag-manager.md).
169
+
170
+ ## Clear stored tracking data
171
+
172
+ Script gating does not remove cookies or Web Storage entries that a script
173
+ already wrote. Add `clearOnRevocation` to your `ConsentRoot` or provider
174
+ options to remove declared data when its category is denied. See
175
+ [clear on revocation](../../integrations/clear-on-revocation.md) for configuration
176
+ and browser limits.
package/docs/frameworks/next/styling/overview.md CHANGED
@@ -43,6 +43,16 @@ Colors, radii, shadows, typography, and motion come from `--c15t-*` custom
43
43
  properties. Set them on the provider through `theme`, or override the
44
44
  variables directly in your CSS.
45
45
 
46
+ React and Next.js render the theme stylesheet in the server HTML before
47
+ the banner. Pass the same theme on the server and the first client render
48
+ so your custom tokens apply before hydration. The provider's `nonce`
49
+ option also applies to this stylesheet for Content Security Policy.
50
+
51
+ `colorScheme: 'dark'` applies dark tokens in the server HTML.
52
+ `colorScheme: 'system'` uses a CSS media query to follow the visitor's
53
+ preference before hydration. If your app manages dark mode through a
54
+ root class instead, include that class in the server HTML too.
55
+
46
56
  ```tsx
47
57
  import { ConsentProvider, defineTheme } from 'c15t/next';
48
58
 
package/docs/integrations/clear-on-revocation.md ADDED
@@ -0,0 +1,167 @@
1
+ ---
2
+ title: Clear on revocation
3
+ description: Remove configured first-party cookies and Web Storage keys when
4
+ their consent category is denied.
5
+ group: integrations
6
+ ---
7
+
8
+ ## Configure cleanup
9
+
10
+ Add `clearOnRevocation` to your provider or runtime options. Declare only the
11
+ data owned by each optional category:
12
+
13
+ ```ts
14
+ import { hosted, type ClearOnRevocationConfig } from 'c15t';
15
+ import { createConsentRuntime } from 'c15t/runtime';
16
+
17
+ const clearOnRevocation = {
18
+ measurement: {
19
+ cookies: ['_ga', '_ga_*'],
20
+ localStorage: ['analytics:*'],
21
+ },
22
+ marketing: {
23
+ cookies: ['_fbp'],
24
+ sessionStorage: ['campaign-id'],
25
+ },
26
+ } satisfies ClearOnRevocationConfig;
27
+
28
+ const runtime = createConsentRuntime({
29
+ mode: hosted({ url: '/api/c15t' }),
30
+ clearOnRevocation,
31
+ });
32
+
33
+ // Start in the browser after mount. The endpoint must serve your c15t backend.
34
+ runtime.start();
35
+
36
+ // Call runtime.dispose() when the app no longer needs consent management.
37
+ ```
38
+
39
+ For React, pass the same configuration through `ConsentProvider.options`:
40
+
41
+ ```tsx
42
+ import type { ReactNode } from 'react';
43
+ import { ConsentProvider, hosted } from 'c15t/react';
44
+
45
+ const mode = hosted({ url: '/api/c15t' });
46
+
47
+ export function Consent({ children }: { children: ReactNode }) {
48
+ return (
49
+ <ConsentProvider
50
+ options={{
51
+ mode,
52
+ clearOnRevocation: {
53
+ measurement: { cookies: ['_ga', '_ga_*'] },
54
+ },
55
+ }}
56
+ >
57
+ {children}
58
+ </ConsentProvider>
59
+ );
60
+ }
61
+ ```
62
+
63
+ The same option is available in Next.js and TanStack Start `ConsentRoot` props, Vue and
64
+ Nuxt configuration, Svelte providers, and Astro integration options. Solid and
65
+ other headless integrations can use `createConsentRuntime` as shown above.
66
+ Every adapter uses the same cleanup module.
67
+
68
+ Omitting `clearOnRevocation` leaves cleanup disabled. The provider option is
69
+ initial-only. Remount the provider to replace its cleanup configuration. For
70
+ a shared runtime, configure the runtime owner rather than a borrowing provider.
71
+
72
+ ## Matching names and cookie scopes
73
+
74
+ Use an exact string or a nonempty prefix followed by `*`. `_ga_*` matches
75
+ `_ga_ABC123`; it does not match `_ga`. Regular expressions, wildcards in other
76
+ positions, and a bare `*` are unsupported. Web Storage keys may contain spaces,
77
+ Unicode, and punctuation. Cookie names use their raw spelling, without URL
78
+ decoding.
79
+
80
+ Cookies can share a name while having different domains or paths. Cleanup
81
+ tries the current host and its parent domains, and the current path and its
82
+ ancestors. To target a specific scope, use an object:
83
+
84
+ ```ts
85
+ const clearOnRevocation = {
86
+ measurement: {
87
+ cookies: [
88
+ { name: 'analytics-id', domain: 'example.com', path: '/' },
89
+ { name: 'checkout-metrics', domain: '', path: '/checkout' },
90
+ { name: 'partitioned-metrics', partitioned: true },
91
+ ],
92
+ },
93
+ };
94
+ ```
95
+
96
+ An empty `domain` means host-only. Explicit domains and paths replace the
97
+ automatic attempts for that field. Exact names can be deleted at a configured
98
+ path even when the current page cannot read that cookie. Prefix matching can
99
+ only discover cookie names visible to the current page, so use an exact name
100
+ for a cookie on another path.
101
+
102
+ Partitioned cookies require `partitioned: true`; ordinary targets remove
103
+ unpartitioned cookies. Cookie deletion preserves the browser's `__Secure-`
104
+ and `__Host-` prefix requirements. c15t protects its own consent, notice,
105
+ privacy, pending-save, and IAB consent records in cookies and localStorage,
106
+ including configured custom storage keys, even if your patterns match them.
107
+ c15t does not store consent in sessionStorage, so targeted entries there are
108
+ removed even when their names match consent storage keys.
109
+
110
+ ## When cleanup runs
111
+
112
+ The runtime attaches cleanup after persistence and the script loader. Cleanup
113
+ waits while the policy is pending. On the first settled snapshot, it removes
114
+ configured data for every denied category. This includes a new opt-in visitor
115
+ who has not made a choice and a returning visitor whose permission expired.
116
+
117
+ After that first pass, cleanup runs when a category changes from allowed to
118
+ denied. Saving a refusal, expiry, a policy change, Global Privacy Control,
119
+ or synchronized records can cause that transition. Under an opt-out policy,
120
+ an expired grant that remains effectively allowed does not trigger deletion.
121
+ The `necessary` category cannot be configured for cleanup.
122
+
123
+ Cleanup keeps waiting if a failed initial request leaves the policy pending.
124
+ If a previously settled policy falls back to denial after an initialization
125
+ failure, cleanup removes its configured data. A later successful retry cannot
126
+ restore deleted data.
127
+
128
+ Runtime construction, server rendering, draft checkbox edits, opening the
129
+ dialog, and disposal do not clear data. Cleanup does not poll storage or repeat
130
+ on unrelated UI updates.
131
+
132
+ ## Use an existing kernel
133
+
134
+ For a manually assembled integration, attach the module in the browser after
135
+ persistence hydration and script-loader setup:
136
+
137
+ ```ts
138
+ import { createClearOnRevocation } from 'c15t/modules/clear-on-revocation';
139
+
140
+ const cleanup = createClearOnRevocation({
141
+ kernel,
142
+ config: { measurement: { cookies: ['_ga', '_ga_*'] } },
143
+ storageConfig,
144
+ });
145
+
146
+ // Stop observing consent when this integration is torn down.
147
+ cleanup.dispose();
148
+ ```
149
+
150
+ Here `kernel` is your existing consent kernel. Pass the same `storageConfig`
151
+ used by persistence so cleanup protects custom record keys. Attaching the
152
+ module can immediately clear denied categories if the policy is already
153
+ settled. Do not also attach it when your provider or runtime owns cleanup.
154
+
155
+ ## Browser limits
156
+
157
+ Cleanup can remove JavaScript-accessible first-party cookies and keys in the
158
+ current origin's `localStorage` and `sessionStorage`. It cannot remove
159
+ `HttpOnly` cookies or another origin's data. Keep `HttpOnly` protections and
160
+ use your server to expire cookies that require server access. Cookie deletion
161
+ must match the cookie's scope. See the
162
+ [browser cookie documentation](https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/Cookies).
163
+
164
+ Browser restrictions can prevent reads or deletions. Cleanup failures do not
165
+ block consent updates. A running SDK may write data again after a sweep, so
166
+ keep script gating and the integration's consent-change or teardown behavior
167
+ configured. Deleting a script element cannot undo JavaScript it already ran.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@c15t/nextjs",
3
- "version": "3.0.0-alpha.0",
3
+ "version": "3.0.0-alpha.1",
4
4
  "description": "Next.js cookie banner and consent management platform for App Router, Pages Router, SSR, IAB TCF, and Consent Mode.",
5
5
  "keywords": [
6
6
  "app-router",
@@ -137,8 +137,8 @@
137
137
  "test:watch": "bun prebuild && vitest --passWithNoTests"
138
138
  },
139
139
  "dependencies": {
140
- "@c15t/core": "3.0.0-alpha.0",
141
- "@c15t/react": "3.0.0-alpha.0",
140
+ "@c15t/core": "3.0.0-alpha.1",
141
+ "@c15t/react": "3.0.0-alpha.1",
142
142
  "@c15t/schema": "3.0.0-alpha.0",
143
143
  "@c15t/translations": "3.0.0-alpha.0"
144
144
  },