@c15t/browser 3.0.0-alpha.0 → 3.0.0-alpha.2
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/AGENTS.md +3 -0
- package/CHANGELOG.md +25 -0
- package/dist/861.js +1 -1
- package/dist/925.js +21 -13
- package/dist/c15t.css +9 -112
- package/dist/c15t.devtools.js +1 -1
- package/dist/c15t.headless.js +1 -1
- package/dist/c15t.iab.css +3 -109
- package/dist/c15t.iab.js +9 -141
- package/dist/c15t.js +4 -30
- package/dist/iab.js +1 -1
- package/dist-types/auto-init.d.ts +1 -1
- package/dist-types/client.d.ts +1 -1
- package/dist-types/devtools.d.ts +1 -1
- package/dist-types/gated-scripts.d.ts +3 -2
- package/dist-types/global.d.ts +4 -4
- package/dist-types/headless.d.ts +11 -11
- package/dist-types/iab/mount.d.ts +1 -1
- package/dist-types/iab/preferences.d.ts +1 -1
- package/dist-types/iab/surface.d.ts +2 -2
- package/dist-types/iab/vendor-disclosures.d.ts +1 -1
- package/dist-types/iab.d.ts +7 -7
- package/dist-types/index.d.ts +12 -12
- package/dist-types/types.d.ts +3 -1
- package/dist-types/ui/banner.d.ts +2 -2
- package/dist-types/ui/dialog.d.ts +2 -2
- package/dist-types/ui/mount.d.ts +2 -2
- package/dist-types/ui/surface.d.ts +1 -1
- package/dist-types/ui/trigger.d.ts +2 -2
- package/dist-types/ui/widget.d.ts +1 -1
- package/dist-types/version.d.ts +1 -1
- package/docs/README.md +3 -0
- package/docs/frameworks/javascript/script-loader.md +47 -0
- package/docs/frameworks/javascript/script-tag.md +30 -6
- package/docs/integrations/building-integrations.md +5 -0
- package/docs/integrations/clear-on-revocation.md +167 -0
- package/docs/integrations/cloudflare-zaraz.md +399 -0
- package/docs/integrations/google-maps.md +20 -20
- package/docs/integrations/granular-consent.md +208 -0
- package/docs/integrations/overview.md +5 -4
- package/docs/integrations/youtube.md +26 -21
- package/package.json +7 -7
- package/readme.json +0 -44
package/dist/c15t.iab.css
CHANGED
|
@@ -1,114 +1,8 @@
|
|
|
1
1
|
/* default theme tokens (generated from defaultTheme) */
|
|
2
|
-
:root, :
|
|
3
|
-
--c15t-border: hsl(0, 0%, 90%);
|
|
4
|
-
--c15t-border-hover: hsl(0, 0%, 85%);
|
|
5
|
-
--c15t-duration-fast: 80ms;
|
|
6
|
-
--c15t-duration-normal: 150ms;
|
|
7
|
-
--c15t-duration-slow: 200ms;
|
|
8
|
-
--c15t-easing: cubic-bezier(0.4, 0, 0.2, 1);
|
|
9
|
-
--c15t-easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
10
|
-
--c15t-easing-out: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
11
|
-
--c15t-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
12
|
-
--c15t-font-family: system-ui, -apple-system, sans-serif;
|
|
13
|
-
--c15t-font-size-base: 1rem;
|
|
14
|
-
--c15t-font-size-lg: 1.125rem;
|
|
15
|
-
--c15t-font-size-sm: 0.875rem;
|
|
16
|
-
--c15t-font-weight-medium: 500;
|
|
17
|
-
--c15t-font-weight-normal: 400;
|
|
18
|
-
--c15t-font-weight-semibold: 600;
|
|
19
|
-
--c15t-line-height-normal: 1.5;
|
|
20
|
-
--c15t-line-height-relaxed: 1.75;
|
|
21
|
-
--c15t-line-height-tight: 1.25;
|
|
22
|
-
--c15t-overlay: hsla(0, 0%, 0%, 0.5);
|
|
23
|
-
--c15t-primary: hsl(228, 100%, 60%);
|
|
24
|
-
--c15t-primary-hover: hsl(228, 100%, 55%);
|
|
25
|
-
--c15t-radius-full: 9999px;
|
|
26
|
-
--c15t-radius-lg: 0.75rem;
|
|
27
|
-
--c15t-radius-md: 0.5rem;
|
|
28
|
-
--c15t-radius-sm: 0.25rem;
|
|
29
|
-
--c15t-shadow-lg: 0 8px 24px hsla(0, 0%, 0%, 0.12);
|
|
30
|
-
--c15t-shadow-md: 0 4px 12px hsla(0, 0%, 0%, 0.08);
|
|
31
|
-
--c15t-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05);
|
|
32
|
-
--c15t-space-lg: 1.5rem;
|
|
33
|
-
--c15t-space-md: 1rem;
|
|
34
|
-
--c15t-space-sm: 0.5rem;
|
|
35
|
-
--c15t-space-xl: 2rem;
|
|
36
|
-
--c15t-space-xs: 0.25rem;
|
|
37
|
-
--c15t-surface: hsl(0, 0%, 100%);
|
|
38
|
-
--c15t-surface-hover: hsl(0, 0%, 98%);
|
|
39
|
-
--c15t-switch-thumb: hsl(0, 0%, 100%);
|
|
40
|
-
--c15t-switch-track: hsl(0, 0%, 85%);
|
|
41
|
-
--c15t-switch-track-active: hsl(228, 100%, 60%);
|
|
42
|
-
--c15t-text: hsl(0, 0%, 10%);
|
|
43
|
-
--c15t-text-muted: hsl(0, 0%, 40%);
|
|
44
|
-
--c15t-text-on-primary: hsl(0, 0%, 100%);
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
:root.dark, :host(.dark), .dark .c15t-theme-root, :root.c15t-dark, :host(.c15t-dark), .c15t-dark .c15t-theme-root {
|
|
48
|
-
--c15t-border: hsl(0, 0%, 20%);
|
|
49
|
-
--c15t-border-hover: hsl(0, 0%, 25%);
|
|
50
|
-
--c15t-duration-fast: 80ms;
|
|
51
|
-
--c15t-duration-normal: 150ms;
|
|
52
|
-
--c15t-duration-slow: 200ms;
|
|
53
|
-
--c15t-easing: cubic-bezier(0.4, 0, 0.2, 1);
|
|
54
|
-
--c15t-easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
55
|
-
--c15t-easing-out: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
56
|
-
--c15t-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
57
|
-
--c15t-font-family: system-ui, -apple-system, sans-serif;
|
|
58
|
-
--c15t-font-size-base: 1rem;
|
|
59
|
-
--c15t-font-size-lg: 1.125rem;
|
|
60
|
-
--c15t-font-size-sm: 0.875rem;
|
|
61
|
-
--c15t-font-weight-medium: 500;
|
|
62
|
-
--c15t-font-weight-normal: 400;
|
|
63
|
-
--c15t-font-weight-semibold: 600;
|
|
64
|
-
--c15t-line-height-normal: 1.5;
|
|
65
|
-
--c15t-line-height-relaxed: 1.75;
|
|
66
|
-
--c15t-line-height-tight: 1.25;
|
|
67
|
-
--c15t-overlay: hsla(0, 0%, 0%, 0.7);
|
|
68
|
-
--c15t-primary: hsl(228, 100%, 70%);
|
|
69
|
-
--c15t-primary-hover: hsl(228, 100%, 65%);
|
|
70
|
-
--c15t-radius-full: 9999px;
|
|
71
|
-
--c15t-radius-lg: 0.75rem;
|
|
72
|
-
--c15t-radius-md: 0.5rem;
|
|
73
|
-
--c15t-radius-sm: 0.25rem;
|
|
74
|
-
--c15t-shadow-lg: 0 8px 24px hsla(0, 0%, 0%, 0.12);
|
|
75
|
-
--c15t-shadow-md: 0 4px 12px hsla(0, 0%, 0%, 0.08);
|
|
76
|
-
--c15t-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.05);
|
|
77
|
-
--c15t-space-lg: 1.5rem;
|
|
78
|
-
--c15t-space-md: 1rem;
|
|
79
|
-
--c15t-space-sm: 0.5rem;
|
|
80
|
-
--c15t-space-xl: 2rem;
|
|
81
|
-
--c15t-space-xs: 0.25rem;
|
|
82
|
-
--c15t-surface: hsl(0, 0%, 7%);
|
|
83
|
-
--c15t-surface-hover: hsl(0, 0%, 10%);
|
|
84
|
-
--c15t-switch-thumb: hsl(0, 0%, 93%);
|
|
85
|
-
--c15t-switch-track: hsl(0, 0%, 25%);
|
|
86
|
-
--c15t-switch-track-active: hsl(228, 100%, 70%);
|
|
87
|
-
--c15t-text: hsl(0, 0%, 93%);
|
|
88
|
-
--c15t-text-muted: hsl(0, 0%, 60%);
|
|
89
|
-
--c15t-text-on-primary: hsl(0, 0%, 100%);
|
|
90
|
-
}
|
|
2
|
+
: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%);}
|
|
91
3
|
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
* Apply this class to the root element before switching themes,
|
|
95
|
-
* then remove it after a short delay to prevent flash of
|
|
96
|
-
* animated content during the color scheme change.
|
|
97
|
-
*
|
|
98
|
-
* Example usage:
|
|
99
|
-
* document.documentElement.classList.add('c15t-no-transitions');
|
|
100
|
-
* // Switch theme...
|
|
101
|
-
* requestAnimationFrame(() => {
|
|
102
|
-
* document.documentElement.classList.remove('c15t-no-transitions');
|
|
103
|
-
* });
|
|
104
|
-
*/
|
|
105
|
-
.c15t-no-transitions,
|
|
106
|
-
.c15t-no-transitions *,
|
|
107
|
-
.c15t-no-transitions *::before,
|
|
108
|
-
.c15t-no-transitions *::after {
|
|
109
|
-
transition: none !important;
|
|
110
|
-
animation: none !important;
|
|
111
|
-
}
|
|
4
|
+
: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%);}
|
|
5
|
+
.c15t-no-transitions,.c15t-no-transitions *,.c15t-no-transitions *::before,.c15t-no-transitions *::after{transition: none !important;animation: none !important;}
|
|
112
6
|
|
|
113
7
|
/* primitives/button vars */
|
|
114
8
|
: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}
|