@c15t/react 3.0.0-alpha.10 → 3.0.0-alpha.12
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 +1 -0
- package/dist/aggregate-components.js +1 -1
- package/dist/chunk-warming.js +1 -1
- package/dist/components/consent-gate/atoms.js +1 -1
- package/dist/components/iab-panel/atoms/root.js +1 -1
- package/dist/components/iab-panel/iab-panel.js +1 -1
- package/dist/components/iab-prompt/atoms/root.js +1 -1
- package/dist/components/iab-prompt/iab-prompt.js +1 -1
- package/dist/components/panel/atoms/root.js +1 -1
- package/dist/components/panel-trigger/atoms/root.js +1 -1
- package/dist/components/panel-trigger/panel-trigger.js +1 -1
- package/dist/components/panel-trigger/toolbar-loader.js +2 -0
- package/dist/components/preferences/atoms/root.js +1 -1
- package/dist/components/prompt/atoms/root.js +1 -1
- package/dist/components/shared/surface-styles.js +1 -1
- package/dist/devtools.js +1 -1
- package/dist/iab/styles.tw3.css +2 -2
- package/dist/iab-dialog-deferred.js +2 -0
- package/dist/iab.js +1 -1
- package/dist/styles.tw3.css +2 -2
- package/dist/utils/deferred-module.js +1 -1
- package/dist/version.js +1 -1
- package/dist-types/chunk-warming.d.ts +8 -11
- package/dist-types/components/panel-trigger/toolbar-loader.d.ts +34 -0
- package/dist-types/components/shared/surface-styles.d.ts +26 -2
- package/dist-types/iab-dialog-deferred.d.ts +36 -0
- package/dist-types/iab.d.ts +2 -1
- package/dist-types/version.d.ts +1 -1
- package/docs/README.md +1 -0
- package/docs/concepts/choose-your-setup.md +5 -2
- package/docs/concepts/data-fetching.md +24 -10
- package/docs/concepts/modes.md +9 -6
- package/docs/customization/slots.md +16 -16
- package/docs/customization/tokens.md +29 -0
- package/docs/frameworks/react/components/consent-banner.md +3 -3
- package/docs/frameworks/react/components/consent-dialog.md +3 -3
- package/docs/frameworks/react/components/consent-provider.md +12 -9
- package/docs/frameworks/react/components.md +3 -3
- package/docs/frameworks/react/content-security-policy.md +8 -2
- package/docs/frameworks/react/iab.md +19 -0
- package/docs/frameworks/react/quickstart.md +25 -79
- package/docs/frameworks/react/rendering.md +161 -139
- package/docs/frameworks/react/scripts.md +3 -3
- package/docs/frameworks/react/troubleshooting.md +17 -16
- package/docs/frameworks/react/upgrade-v3.md +5 -4
- package/docs/guides/banner-experiments.md +16 -0
- package/docs/integrations/overview.md +1 -0
- package/docs/integrations/vercel-speed-insights.md +306 -0
- package/package.json +7 -7
package/dist/styles.tw3.css
CHANGED
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
@media only screen and (resolution>=192dpi){:root, :host{--consent-dialog-border-width-hairline:.5px}}
|
|
45
45
|
|
|
46
46
|
/* components/prompt vars */
|
|
47
|
-
:root, :host{--consent-banner-font-family:var(--c15t-font-family);--consent-banner-line-height:var(--c15t-line-height-normal);--consent-banner-text-size-adjust:100%;--consent-banner-tab-size:4;--consent-banner-border-radius-sm:var(--c15t-radius-sm);--consent-banner-border-radius:var(--c15t-radius-lg);--consent-banner-max-width:440px;--consent-banner-widget-max-width:20rem;--consent-banner-wall-max-width:30rem;--consent-banner-branding-tag-offset:2rem;--consent-banner-entry-duration:var(--c15t-duration-normal);--consent-banner-entry-timing:var(--c15t-easing-out);--consent-banner-animation-duration:var(--c15t-duration-fast);--consent-banner-animation-timing:var(--c15t-easing-in);--consent-banner-border-width:1px;--consent-banner-border-width-hairline:1px;--consent-banner-shadow:var(--c15t-shadow-lg);--consent-banner-shadow-dark:var(--c15t-shadow-lg);--consent-banner-background-color:var(--c15t-surface);--consent-banner-background-color-dark:var(--c15t-surface);--consent-banner-footer-background-color:var(--c15t-surface-hover);--consent-banner-footer-background-color-dark:var(--c15t-surface-hover);--consent-banner-text-color:var(--c15t-text);--consent-banner-text-color-dark:var(--c15t-text);--consent-banner-border-color:var(--c15t-border);--consent-banner-border-color-dark:var(--c15t-border);--consent-banner-title-color:var(--c15t-text);--consent-banner-title-color-dark:var(--c15t-text);--consent-banner-description-color:var(--c15t-text-muted);--consent-banner-description-color-dark:var(--c15t-text-muted);--consent-banner-overlay-background-color:var(--c15t-overlay);--consent-banner-overlay-background-color-dark:var(--c15t-overlay)}
|
|
47
|
+
:root, :host{--consent-banner-font-family:var(--c15t-font-family);--consent-banner-line-height:var(--c15t-line-height-normal);--consent-banner-text-size-adjust:100%;--consent-banner-tab-size:4;--consent-banner-border-radius-sm:var(--c15t-radius-sm);--consent-banner-border-radius:var(--c15t-radius-lg);--consent-banner-max-width:440px;--consent-banner-widget-max-width:20rem;--consent-banner-wall-max-width:30rem;--consent-banner-branding-tag-offset:2rem;--consent-banner-entry-duration:var(--c15t-duration-normal);--consent-banner-entry-timing:var(--c15t-easing-out);--consent-banner-animation-duration:var(--c15t-duration-fast);--consent-banner-animation-timing:var(--c15t-easing-in);--consent-banner-border-width:1px;--consent-banner-border-width-hairline:1px;--consent-banner-shadow:var(--c15t-shadow-lg);--consent-banner-shadow-dark:var(--c15t-shadow-lg);--consent-banner-background-color:var(--c15t-surface);--consent-banner-background-color-dark:var(--c15t-surface);--consent-banner-footer-background-color:var(--c15t-surface-hover);--consent-banner-footer-background-color-dark:var(--c15t-surface-hover);--consent-banner-text-color:var(--c15t-text);--consent-banner-text-color-dark:var(--c15t-text);--consent-banner-border-color:var(--c15t-border);--consent-banner-border-color-dark:var(--c15t-border);--consent-banner-title-color:var(--c15t-text);--consent-banner-title-color-dark:var(--c15t-text);--consent-banner-description-color:var(--c15t-text-muted);--consent-banner-description-color-dark:var(--c15t-text-muted);--consent-banner-overlay-background-color:var(--c15t-overlay);--consent-banner-overlay-background-color-dark:var(--c15t-overlay);--consent-banner-z-index:999998;--consent-banner-overlay-z-index:999997}
|
|
48
48
|
@media only screen and (resolution>=192dpi){:root, :host{--consent-banner-border-width-hairline:.5px}}
|
|
49
49
|
|
|
50
50
|
/* components/branding */
|
|
@@ -66,7 +66,7 @@
|
|
|
66
66
|
.c15t-ui-trigger-Hjg5y{--cdt-size-sm:32px;--cdt-size-md:40px;--cdt-size-lg:48px;--cdt-bg:var(--c15t-surface,#fff);--cdt-bg-hover:var(--c15t-surface-hover,var(--cdt-bg));--cdt-border:var(--c15t-border,#e5e5e5);--cdt-shadow:var(--c15t-shadow-lg,0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a);--cdt-shadow-hover:var(--c15t-shadow-xl,0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a);--cdt-radius:var(--c15t-radius-full,9999px);--cdt-offset:var(--c15t-space-md,20px);--cdt-transition-duration:var(--c15t-duration-slow);--cdt-transition-easing:var(--c15t-easing-out);--cdt-snap-duration:var(--c15t-duration-slow);--cdt-snap-easing:var(--c15t-easing-in-out);--cdt-icon-color:var(--c15t-text,#171717);--cdt-focus-ring:var(--c15t-primary,#3b82f6);z-index:9999;width:var(--cdt-size-md);height:var(--cdt-size-md);border:1px solid var(--cdt-border);border-radius:var(--cdt-radius);background:var(--cdt-bg);box-shadow:var(--cdt-shadow);cursor:grab;transition:transform var(--cdt-transition-duration) var(--cdt-transition-easing), box-shadow var(--cdt-transition-duration) var(--cdt-transition-easing), background var(--cdt-transition-duration) var(--cdt-transition-easing);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;will-change:transform;justify-content:center;align-items:center;margin:0;padding:0;display:flex;position:fixed}@media (hover:hover) and (pointer:fine){.c15t-ui-trigger-Hjg5y:hover{background:var(--cdt-bg-hover);box-shadow:var(--cdt-shadow-hover)}}.c15t-ui-trigger-Hjg5y:active,.c15t-ui-trigger-Hjg5y.c15t-ui-dragging-R4Cm2,.c15t-ui-trigger-Hjg5y[data-dragging]{cursor:grabbing;transform:scale(1.02)}.c15t-ui-trigger-Hjg5y:focus{outline:none}.c15t-ui-trigger-Hjg5y:focus-visible{outline:2px solid var(--cdt-focus-ring);outline-offset:2px}.c15t-ui-trigger-Hjg5y[data-size=sm],.c15t-ui-sm-sud0y{width:var(--cdt-size-sm);height:var(--cdt-size-sm)}.c15t-ui-trigger-Hjg5y[data-size=md],.c15t-ui-md-CZrWA{width:var(--cdt-size-md);height:var(--cdt-size-md)}.c15t-ui-trigger-Hjg5y[data-size=lg],.c15t-ui-lg-fGzix{width:var(--cdt-size-lg);height:var(--cdt-size-lg)}.c15t-ui-icon-dD5R6{width:50%;height:50%;color:var(--cdt-icon-color);pointer-events:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.c15t-ui-icon-dD5R6 svg{width:100%;height:100%}.c15t-ui-text-Garil{margin-left:var(--c15t-space-xs,6px);font-family:var(--c15t-font-family,system-ui, sans-serif);font-size:var(--c15t-font-size-sm,14px);font-weight:var(--c15t-font-weight-medium,500);color:var(--cdt-icon-color);white-space:nowrap;pointer-events:none;line-height:1}.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil){width:auto;height:auto;padding:var(--c15t-space-sm,8px) var(--c15t-space-md,16px);border-radius:var(--c15t-radius-lg,12px);gap:var(--c15t-space-xs,6px)}.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil) .c15t-ui-icon-dD5R6{width:16px;height:16px}.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil)[data-size=sm],.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil).c15t-ui-sm-sud0y{padding:var(--c15t-space-xs,6px) var(--c15t-space-sm,10px)}.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil)[data-size=sm] .c15t-ui-icon-dD5R6,.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil).c15t-ui-sm-sud0y .c15t-ui-icon-dD5R6{width:14px;height:14px}.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil)[data-size=sm] .c15t-ui-text-Garil,.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil).c15t-ui-sm-sud0y .c15t-ui-text-Garil{font-size:var(--c15t-font-size-xs,12px)}.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil)[data-size=lg],.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil).c15t-ui-lg-fGzix{padding:var(--c15t-space-md,12px) var(--c15t-space-lg,20px)}.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil)[data-size=lg] .c15t-ui-icon-dD5R6,.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil).c15t-ui-lg-fGzix .c15t-ui-icon-dD5R6{width:20px;height:20px}.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil)[data-size=lg] .c15t-ui-text-Garil,.c15t-ui-trigger-Hjg5y:has(.c15t-ui-text-Garil).c15t-ui-lg-fGzix .c15t-ui-text-Garil{font-size:var(--c15t-font-size-md,16px)}.c15t-ui-bottomRight-RqjMF{right:var(--cdt-offset);bottom:var(--cdt-offset)}.c15t-ui-bottomLeft-J3DsX{bottom:var(--cdt-offset);left:var(--cdt-offset)}.c15t-ui-topRight-Ln04J{top:var(--cdt-offset);right:var(--cdt-offset)}.c15t-ui-topLeft-tpeaf{top:var(--cdt-offset);left:var(--cdt-offset)}.c15t-ui-snapping-YupfG{transition:top var(--cdt-snap-duration) var(--cdt-snap-easing), right var(--cdt-snap-duration) var(--cdt-snap-easing), bottom var(--cdt-snap-duration) var(--cdt-snap-easing), left var(--cdt-snap-duration) var(--cdt-snap-easing), transform var(--cdt-snap-duration) var(--cdt-snap-easing)}.c15t-ui-hidden-tV2GK{display:none}.c15t-dark .c15t-ui-trigger-Hjg5y{--cdt-bg:var(--c15t-surface,#262626);--cdt-bg-hover:var(--c15t-surface-hover,#404040);--cdt-border:var(--c15t-border,#404040);--cdt-icon-color:var(--c15t-text,#fafafa);--cdt-shadow:0 10px 15px -3px #0000004d, 0 4px 6px -4px #0000004d;--cdt-shadow-hover:0 20px 25px -5px #0006, 0 8px 10px -6px #0006}.c15t-ui-toolbar-gCKkL{--cdtt-size-sm:32px;--cdtt-size-md:40px;--cdtt-size-lg:48px;--cdtt-bg:var(--c15t-surface,#fff);--cdtt-bg-hover:var(--c15t-surface-hover,#f5f5f5);--cdtt-border:var(--c15t-border,#d4d4d4);--cdtt-primary:var(--c15t-primary,#16a779);--cdtt-primary-hover:var(--c15t-primary-hover,#128866);--cdtt-primary-text:var(--c15t-text-on-primary,#fff);--cdtt-icon-color:var(--c15t-text,#262626);--cdtt-focus-ring:var(--c15t-primary,#16a779);--cdtt-offset:var(--c15t-space-md,20px);--cdtt-transition-duration:var(--c15t-duration-fast,.16s);--cdtt-transition-easing:var(--c15t-easing-out,ease-out);--cdtt-shadow:var(--c15t-shadow-md,0 4px 10px #00000014, 0 1px 2px #0000000f);z-index:9999;width:max-content;color:var(--cdtt-icon-color);background:var(--cdtt-bg);border:1px solid var(--cdtt-border);border-radius:var(--c15t-radius-md,6px);box-shadow:var(--cdtt-shadow);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;will-change:transform;transition:transform var(--cdtt-transition-duration) var(--cdtt-transition-easing), box-shadow var(--cdtt-transition-duration) var(--cdtt-transition-easing), background var(--cdtt-transition-duration) var(--cdtt-transition-easing);align-items:stretch;margin:0;padding:0;display:inline-flex;position:fixed;overflow:hidden}.c15t-ui-toolbar-gCKkL.c15t-ui-bottomRight-RqjMF{right:max(var(--cdtt-offset), env(safe-area-inset-right,0px));bottom:max(var(--cdtt-offset), env(safe-area-inset-bottom,0px))}.c15t-ui-toolbar-gCKkL.c15t-ui-bottomLeft-J3DsX{bottom:max(var(--cdtt-offset), env(safe-area-inset-bottom,0px));left:max(var(--cdtt-offset), env(safe-area-inset-left,0px))}.c15t-ui-toolbar-gCKkL.c15t-ui-topRight-Ln04J{top:max(var(--cdtt-offset), env(safe-area-inset-top,0px));right:max(var(--cdtt-offset), env(safe-area-inset-right,0px))}.c15t-ui-toolbar-gCKkL.c15t-ui-topLeft-tpeaf{top:max(var(--cdtt-offset), env(safe-area-inset-top,0px));left:max(var(--cdtt-offset), env(safe-area-inset-left,0px))}.c15t-ui-toolbar-gCKkL.c15t-ui-dragging-R4Cm2{cursor:grabbing;box-shadow:var(--c15t-shadow-lg,0 10px 20px #00000024, 0 3px 6px #00000014)}.c15t-ui-toolbarVertical-MQ8bT{flex-direction:column}.c15t-ui-toolbarItem-OO8Dy{width:var(--cdtt-size-md);height:var(--cdtt-size-md);color:var(--cdtt-icon-color);border:0;border-inline-start:1px solid var(--cdtt-border);cursor:inherit;transition:color var(--cdtt-transition-duration) var(--cdtt-transition-easing), background var(--cdtt-transition-duration) var(--cdtt-transition-easing);background:0 0;border-radius:0;flex:none;justify-content:center;align-items:center;margin:0;padding:0;display:flex;position:relative}.c15t-ui-toolbarItem-OO8Dy:first-child{border-inline-start:0}.c15t-ui-toolbarVertical-MQ8bT .c15t-ui-toolbarItem-OO8Dy{border-top:1px solid var(--cdtt-border);border-inline-start:0}.c15t-ui-toolbarVertical-MQ8bT .c15t-ui-toolbarItem-OO8Dy:first-child{border-top:0}.c15t-ui-toolbar-gCKkL .c15t-ui-toolbarItem-OO8Dy.c15t-ui-sm-sud0y{width:var(--cdtt-size-sm);height:var(--cdtt-size-sm)}.c15t-ui-toolbar-gCKkL .c15t-ui-toolbarItem-OO8Dy.c15t-ui-md-CZrWA{width:var(--cdtt-size-md);height:var(--cdtt-size-md)}.c15t-ui-toolbar-gCKkL .c15t-ui-toolbarItem-OO8Dy.c15t-ui-lg-fGzix{width:var(--cdtt-size-lg);height:var(--cdtt-size-lg)}.c15t-ui-toolbarItem-OO8Dy[data-c15t-trigger-action=preferences]{color:var(--cdtt-primary-text);background:var(--cdtt-primary)}.c15t-ui-toolbarItem-OO8Dy[data-c15t-trigger-action=devtools][aria-expanded=true]{color:var(--cdtt-primary);background:var(--cdtt-bg-hover)}.c15t-ui-toolbarItem-OO8Dy:focus{outline:none}.c15t-ui-toolbarItem-OO8Dy:focus-visible{z-index:1;outline:2px solid var(--cdtt-focus-ring);outline-offset:-3px}.c15t-ui-toolbarItem-OO8Dy:disabled{cursor:not-allowed;opacity:.45}.c15t-ui-toolbarIcon-FpHKR{pointer-events:none;flex-shrink:0;justify-content:center;align-items:center;width:50%;height:50%;display:flex}.c15t-ui-toolbarIcon-FpHKR>span,.c15t-ui-toolbarIcon-FpHKR svg{width:100%;height:100%;display:flex}@media (hover:hover) and (pointer:fine){.c15t-ui-toolbarItem-OO8Dy:hover:not(:disabled){background:var(--cdtt-bg-hover)}.c15t-ui-toolbarItem-OO8Dy[data-c15t-trigger-action=preferences]:hover:not(:disabled){background:var(--cdtt-primary-hover)}}.c15t-ui-toolbarItem-OO8Dy:active:not(:disabled){box-shadow:inset 0 1px 3px #00000029}:is(.c15t-dark .c15t-ui-toolbar-gCKkL,.dark .c15t-ui-toolbar-gCKkL){--cdtt-bg:var(--c15t-surface,#262626);--cdtt-bg-hover:var(--c15t-surface-hover,#343434);--cdtt-border:var(--c15t-border,#525252);--cdtt-icon-color:var(--c15t-text,#fafafa);--cdtt-shadow:0 8px 18px #00000052, 0 2px 5px #00000038}.c15t-ui-trigger-Hjg5y[data-disable-animation],.c15t-ui-trigger-Hjg5y[data-disable-animation].c15t-ui-snapping-YupfG,.c15t-ui-toolbar-gCKkL[data-disable-animation],.c15t-ui-toolbar-gCKkL[data-disable-animation].c15t-ui-snapping-YupfG,.c15t-ui-toolbar-gCKkL[data-disable-animation] .c15t-ui-toolbarItem-OO8Dy{transition:none}@media (prefers-reduced-motion:reduce){.c15t-ui-trigger-Hjg5y,.c15t-ui-toolbar-gCKkL,.c15t-ui-toolbarItem-OO8Dy,.c15t-ui-snapping-YupfG{transition:none}}
|
|
67
67
|
|
|
68
68
|
/* components/prompt */
|
|
69
|
-
.c15t-ui-root-p7SV0:not(.headless){box-sizing:border-box;z-index:999998;width:100%;font-family:var(--consent-banner-font-family);line-height:var(--consent-banner-line-height);-webkit-text-size-adjust:var(--consent-banner-text-size-adjust);-webkit-font-smoothing:antialiased;tab-size:var(--consent-banner-tab-size);flex-direction:column;padding:1rem;display:flex;position:fixed}:is(.c15t-ui-bannerEnterActive-IytGL:not(.headless),.c15t-ui-bannerEnterFrom-BJMc7:not(.headless),.c15t-ui-bannerEnterTo-yatsy:not(.headless),.c15t-ui-bannerEntering-Cqrwl:not(.headless),.c15t-ui-bannerLeaveFrom-RVGoD:not(.headless),.c15t-ui-bannerVisible-AFth0:not(.headless)){opacity:1}.c15t-ui-bannerEntering-Cqrwl[data-entry=late]:not(.c15t-ui-bannerHidden-R0_3M):not(.headless){transition:opacity var(--consent-banner-entry-duration) var(--consent-banner-entry-timing)}@starting-style{.c15t-ui-bannerEntering-Cqrwl[data-entry=late]:not(.headless){opacity:0}}.c15t-ui-bannerLeaveActive-C7qrk:not(.headless){transition:opacity var(--consent-banner-animation-duration) var(--consent-banner-animation-timing)}.c15t-ui-bannerLeaveTo-dXNcB:not(.headless){opacity:0}.c15t-ui-bannerHidden-R0_3M:not(.headless){opacity:0;transition:opacity var(--consent-banner-animation-duration) var(--consent-banner-animation-timing)}@media (width>=640px){.c15t-ui-root-p7SV0:not(.headless){width:auto;padding:1.5rem}}.c15t-ui-root-p7SV0[data-position=bottom-left]:not(.headless){bottom:0;left:0}.c15t-ui-root-p7SV0[data-position=bottom-right]:not(.headless){bottom:0;right:0}.c15t-ui-root-p7SV0[data-position=top-left]:not(.headless){top:0;left:0}.c15t-ui-root-p7SV0[data-position=top-right]:not(.headless){top:0;right:0}.c15t-ui-root-p7SV0[data-variant=floating][data-position=bottom-center]:not(.headless){inset-inline:0;width:fit-content;margin-inline:auto;bottom:0}.c15t-ui-root-p7SV0[data-variant=floating][data-position=top-center]:not(.headless){inset-inline:0;width:fit-content;margin-inline:auto;top:0}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless){width:100%;padding:0;left:0;right:0}.c15t-ui-root-p7SV0[data-variant=bar][data-position=bottom]:not(.headless){top:auto;bottom:0}.c15t-ui-root-p7SV0[data-variant=bar][data-position=top]:not(.headless){top:0;bottom:auto}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-cardShell-djyPy{width:100%;max-width:none}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-card-lgjVq{box-shadow:var(--consent-banner-shadow);border-width:0;border-radius:0}.c15t-ui-root-p7SV0[data-variant=bar][data-position=bottom]:not(.headless) .c15t-ui-card-lgjVq{border-top-width:var(--consent-banner-border-width);padding-bottom:env(safe-area-inset-bottom);border-top-style:solid}.c15t-ui-root-p7SV0[data-variant=bar][data-position=top]:not(.headless) .c15t-ui-card-lgjVq{border-bottom-width:var(--consent-banner-border-width);border-bottom-style:solid}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-cardShell-djyPy>[data-variant=banner-tag]{margin-inline-end:1.5rem}.c15t-ui-root-p7SV0[data-variant=bar][data-position=top]:not(.headless) .c15t-ui-cardShell-djyPy>[data-variant=banner-tag]{border-top-width:0;border-bottom-width:1px;border-radius:0 0 .75rem .75rem;order:1;margin-block:-1px 0}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{flex-direction:column;align-items:stretch;gap:.75rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rights-wZg5K{flex-direction:column;align-items:flex-start}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe button[data-action]:not(.c15t-ui-rightLink-IXsSJ){flex:auto;width:100%;min-width:0}@media (width>=640px){.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{flex-direction:row;justify-content:space-between;align-items:center}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rights-wZg5K{flex-flow:wrap;align-items:center;margin-inline-end:auto}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe>*{width:auto}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe button[data-action]:not(.c15t-ui-rightLink-IXsSJ){flex:none;width:auto}}@media (width>=1024px){.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-card-lgjVq{flex-direction:row;align-items:center;display:flex}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-header-S6GiJ{flex:auto;min-width:0}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{background-color:#0000;width:auto;min-width:0}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-card-lgjVq>:not([hidden])~:not([hidden]){border-top-width:0}}:is(.c15t-ui-root-p7SV0[data-variant=floating][data-position$=-right]:not(.headless) .c15t-ui-cardShell-djyPy,.c15t-ui-root-p7SV0[data-variant=widget][data-position$=-right]:not(.headless) .c15t-ui-cardShell-djyPy){margin-left:auto;margin-right:0}:is(.c15t-ui-root-p7SV0[data-variant=floating][data-position$=-left]:not(.headless) .c15t-ui-cardShell-djyPy,.c15t-ui-root-p7SV0[data-variant=widget][data-position$=-left]:not(.headless) .c15t-ui-cardShell-djyPy){margin-left:0;margin-right:auto}.c15t-ui-root-p7SV0[data-variant=floating][data-position$=-center]:not(.headless) .c15t-ui-cardShell-djyPy{margin-left:auto;margin-right:auto}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless){padding:.75rem}@media (width>=640px){.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless){padding:1rem}}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-cardShell-djyPy{width:min(calc(100vw - 1.5rem), var(--consent-banner-widget-max-width))}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-header-S6GiJ{padding:.75rem}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-title-vm8nL{font-size:.875rem;line-height:1.25rem}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-description-s8Qhg{font-size:.8125rem;line-height:1.125rem}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-footer-JhJAe{gap:.5rem;padding:.75rem}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-footer-JhJAe button[data-action]:not(.c15t-ui-rightLink-IXsSJ){padding:.5rem .75rem}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rightLink-IXsSJ{font-size:.8125rem;line-height:1.125rem}.c15t-ui-root-p7SV0[data-variant=wall]:not(.headless){place-items:center;width:auto;padding:1rem;display:grid;inset:0}.c15t-ui-root-p7SV0[data-variant=wall]:not(.headless) .c15t-ui-cardShell-djyPy{width:min(calc(100vw - 2rem), var(--consent-banner-wall-max-width))}.c15t-ui-card-lgjVq:not(.headless){border-radius:var(--consent-banner-border-radius);border-width:var(--consent-banner-border-width);border-style:solid;border-color:var(--consent-banner-border-color);background-color:var(--consent-banner-background-color);width:100%;box-shadow:var(--consent-banner-shadow);position:relative;overflow:hidden}.c15t-ui-cardShell-djyPy:not(.headless){width:min(calc(100vw - 2rem), var(--consent-banner-max-width));flex-direction:column;display:flex;container:c15t-banner/inline-size}@media (width>=640px){.c15t-ui-cardShell-djyPy:not(.headless){width:min(calc(100vw - 3rem), var(--consent-banner-max-width))}}.c15t-dark .c15t-ui-card-lgjVq:not(.headless){background-color:var(--consent-banner-background-color-dark);border-color:var(--consent-banner-border-color-dark);box-shadow:var(--consent-banner-shadow-dark)}.c15t-dark .c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-card-lgjVq{box-shadow:var(--consent-banner-shadow-dark)}.c15t-ui-card-lgjVq:not(.headless)>:not([hidden])~:not([hidden]){border-top-width:var(--consent-banner-border-width);border-top-style:solid;border-color:var(--consent-banner-border-color)}.c15t-dark .c15t-ui-card-lgjVq:not(.headless)>:not([hidden])~:not([hidden]){border-color:var(--consent-banner-border-color-dark)}.c15t-ui-card-lgjVq:not(.headless):focus{outline:none}.c15t-ui-header-S6GiJ:not(.headless){color:var(--consent-banner-text-color);flex-direction:column;padding:1rem;display:flex}.c15t-dark .c15t-ui-header-S6GiJ:not(.headless){color:var(--consent-banner-text-color-dark)}@media (width>=640px){.c15t-ui-header-S6GiJ:not(.headless){padding:1.5rem}}.c15t-ui-header-S6GiJ:not(.headless)>:not([hidden])~:not([hidden]){--consent-banner-space-y-reverse:0;margin-top:calc(.5rem * calc(1 - var(--consent-banner-space-y-reverse)));margin-bottom:calc(.5rem * var(--consent-banner-space-y-reverse))}.c15t-ui-footer-JhJAe:not(.headless){background-color:var(--consent-banner-footer-background-color);flex-direction:column;justify-content:space-between;gap:.75rem;padding:1rem 1.25rem;display:flex}.c15t-dark .c15t-ui-footer-JhJAe:not(.headless){background-color:var(--consent-banner-footer-background-color-dark)}@media (width>=640px){.c15t-ui-footer-JhJAe:not(.headless){flex-direction:row}}.c15t-ui-rights-wZg5K:not(.headless){flex-flow:wrap;align-items:center;gap:.75rem;min-width:0;display:flex}.c15t-ui-rightLink-IXsSJ:not(.headless){width:auto;font:inherit;font-family:var(--consent-banner-font-family);letter-spacing:-.006em;color:var(--consent-banner-description-color);text-underline-offset:.15em;text-align:start;cursor:pointer;border-radius:var(--consent-banner-border-radius-sm);touch-action:manipulation;background:0 0;border:0;flex:none;align-self:center;margin:0;padding:0;font-size:.875rem;font-weight:400;line-height:1.25rem;text-decoration:underline;display:inline-block}.c15t-ui-rightLink-IXsSJ:not(.headless):hover{color:var(--consent-banner-text-color)}.c15t-ui-rightLink-IXsSJ:not(.headless):focus-visible{box-shadow:var(--button-shadow-primary-focus,0 0 0 2px var(--c15t-primary));outline:none}.c15t-dark .c15t-ui-rightLink-IXsSJ:not(.headless){color:var(--consent-banner-description-color-dark)}.c15t-dark .c15t-ui-rightLink-IXsSJ:not(.headless):hover{color:var(--consent-banner-text-color-dark)}.c15t-dark .c15t-ui-rightLink-IXsSJ:not(.headless):focus-visible{box-shadow:var(--button-shadow-primary-focus-dark,0 0 0 2px var(--c15t-primary))}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe{flex-direction:column;align-items:stretch;gap:.75rem}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rights-wZg5K{flex-direction:column;align-items:flex-start;gap:.5rem}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe button[data-action]:not(.c15t-ui-rightLink-IXsSJ){flex:auto;width:100%;min-width:0}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rightLink-IXsSJ{flex:none;align-self:flex-start;width:auto}@media (width>=640px){.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe{flex-direction:row;justify-content:space-between;align-items:center;gap:.75rem}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rights-wZg5K{flex-flow:wrap;flex:auto;align-items:center;gap:.75rem;min-width:0}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe>*{width:auto}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe button[data-action]:not(.c15t-ui-rightLink-IXsSJ){flex:none;width:auto}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rightLink-IXsSJ{align-self:center}}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-header-S6GiJ,.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{padding:.75rem 1rem}@media (width>=640px){.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-header-S6GiJ{padding:1rem 1.5rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{padding:.75rem 1.5rem}}@media (width>=1024px){.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-header-S6GiJ{padding:.75rem 1.5rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-header-S6GiJ>:not([hidden])~:not([hidden]){margin-top:.25rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-title-vm8nL{line-height:1.25rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{flex:none;gap:.75rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rights-wZg5K{flex-flow:row;flex:none;align-items:center;gap:.75rem;margin-inline-end:0}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rightLink-IXsSJ{white-space:nowrap;font-size:.8125rem;line-height:1.125rem}}.c15t-ui-description-s8Qhg:not(.headless){letter-spacing:-.006em;color:var(--consent-banner-description-color);font-size:.875rem;font-weight:400;line-height:1.25rem}.c15t-dark .c15t-ui-description-s8Qhg:not(.headless){color:var(--consent-banner-description-color-dark)}.c15t-ui-description-s8Qhg[data-context=banner]:not(.headless){letter-spacing:-.006em;color:var(--consent-banner-description-color);font-size:.875rem;font-weight:400;line-height:1.25rem}.c15t-dark .c15t-ui-description-s8Qhg[data-context=banner]:not(.headless){color:var(--consent-banner-description-color-dark)}.c15t-ui-description-s8Qhg[data-context=dialog]:not(.headless){color:var(--consent-dialog-muted-color);font-size:var(--consent-dialog-description-font-size);font-weight:var(--consent-dialog-description-font-weight);line-height:var(--consent-dialog-description-line-height)}.c15t-dark .c15t-ui-description-s8Qhg[data-context=dialog]:not(.headless){color:var(--consent-dialog-muted-color-dark)}.c15t-ui-description-s8Qhg[data-context=manager]:not(.headless){color:var(--consent-manager-text-muted-color)}.c15t-dark .c15t-ui-description-s8Qhg[data-context=manager]:not(.headless){color:var(--consent-manager-text-muted-color-dark)}.c15t-ui-title-vm8nL:not(.headless){letter-spacing:-.011em;color:var(--consent-banner-title-color);margin:0;font-size:1rem;font-weight:500;line-height:1.5rem}.c15t-dark .c15t-ui-title-vm8nL:not(.headless){color:var(--consent-banner-title-color-dark)}.c15t-ui-overlay-DoHh4:not(.headless){background-color:var(--consent-banner-overlay-background-color);z-index:999997;position:fixed;inset:0}:is(.c15t-ui-overlayEnterActive-YGn_8:not(.headless),.c15t-ui-overlayEnterFrom-OtDqj:not(.headless),.c15t-ui-overlayEnterTo-jcvNq:not(.headless),.c15t-ui-overlayEntering-p5Z3U:not(.headless),.c15t-ui-overlayLeaveFrom-EYTMT:not(.headless),.c15t-ui-overlayVisible-ywHQp:not(.headless)){opacity:1}.c15t-ui-overlayEntering-p5Z3U[data-entry=late]:not(.c15t-ui-overlayHidden-WgrJC):not(.headless){transition:opacity var(--consent-banner-entry-duration) var(--consent-banner-entry-timing)}@starting-style{.c15t-ui-overlayEntering-p5Z3U[data-entry=late]:not(.headless){opacity:0}}.c15t-ui-overlayLeaveActive-FvP5W:not(.headless){transition:opacity var(--consent-banner-animation-duration) var(--consent-banner-animation-timing)}.c15t-ui-overlayLeaveTo-V7aI7:not(.headless){opacity:0}.c15t-ui-overlayHidden-WgrJC:not(.headless){opacity:0;transition:opacity var(--consent-banner-animation-duration) var(--consent-banner-animation-timing)}.c15t-dark .c15t-ui-overlay-DoHh4:not(.headless){background-color:var(--consent-banner-overlay-background-color-dark)}@media (prefers-reduced-motion:reduce){.c15t-ui-bannerEntering-Cqrwl[data-entry=late]:not(.c15t-ui-bannerHidden-R0_3M):not(.headless),.c15t-ui-overlayEntering-p5Z3U[data-entry=late]:not(.c15t-ui-overlayHidden-WgrJC):not(.headless),.c15t-ui-bannerLeaveActive-C7qrk:not(.headless),.c15t-ui-bannerHidden-R0_3M:not(.headless),.c15t-ui-overlayLeaveActive-FvP5W:not(.headless),.c15t-ui-overlayHidden-WgrJC:not(.headless){transition:none;animation:none}}
|
|
69
|
+
.c15t-ui-root-p7SV0:not(.headless){box-sizing:border-box;width:100%;z-index:var(--consent-banner-z-index);pointer-events:none;font-family:var(--consent-banner-font-family);line-height:var(--consent-banner-line-height);-webkit-text-size-adjust:var(--consent-banner-text-size-adjust);-webkit-font-smoothing:antialiased;tab-size:var(--consent-banner-tab-size);flex-direction:column;padding:1rem;display:flex;position:fixed}.c15t-ui-root-p7SV0:not(.headless)>*{pointer-events:auto}.c15t-ui-root-p7SV0:not(.headless)>.c15t-ui-cardShell-djyPy:not(.headless){pointer-events:none}.c15t-ui-cardShell-djyPy:not(.headless)>*,.c15t-ui-root-p7SV0[data-blocking=true]:not(.headless){pointer-events:auto}:is(.c15t-ui-bannerEnterActive-IytGL:not(.headless),.c15t-ui-bannerEnterFrom-BJMc7:not(.headless),.c15t-ui-bannerEnterTo-yatsy:not(.headless),.c15t-ui-bannerEntering-Cqrwl:not(.headless),.c15t-ui-bannerLeaveFrom-RVGoD:not(.headless),.c15t-ui-bannerVisible-AFth0:not(.headless)){opacity:1}.c15t-ui-bannerEntering-Cqrwl[data-entry=late]:not(.c15t-ui-bannerHidden-R0_3M):not(.headless){transition:opacity var(--consent-banner-entry-duration) var(--consent-banner-entry-timing)}@starting-style{.c15t-ui-bannerEntering-Cqrwl[data-entry=late]:not(.headless){opacity:0}}.c15t-ui-bannerLeaveActive-C7qrk:not(.headless){transition:opacity var(--consent-banner-animation-duration) var(--consent-banner-animation-timing)}.c15t-ui-bannerLeaveTo-dXNcB:not(.headless){opacity:0}.c15t-ui-bannerHidden-R0_3M:not(.headless){opacity:0;transition:opacity var(--consent-banner-animation-duration) var(--consent-banner-animation-timing)}@media (width>=640px){.c15t-ui-root-p7SV0:not(.headless){width:auto;padding:1.5rem}}.c15t-ui-root-p7SV0[data-position=bottom-left]:not(.headless){bottom:0;left:0}.c15t-ui-root-p7SV0[data-position=bottom-right]:not(.headless){bottom:0;right:0}.c15t-ui-root-p7SV0[data-position=top-left]:not(.headless){top:0;left:0}.c15t-ui-root-p7SV0[data-position=top-right]:not(.headless){top:0;right:0}.c15t-ui-root-p7SV0[data-variant=floating][data-position=bottom-center]:not(.headless){inset-inline:0;width:fit-content;margin-inline:auto;bottom:0}.c15t-ui-root-p7SV0[data-variant=floating][data-position=top-center]:not(.headless){inset-inline:0;width:fit-content;margin-inline:auto;top:0}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless){width:100%;padding:0;left:0;right:0}.c15t-ui-root-p7SV0[data-variant=bar][data-position=bottom]:not(.headless){top:auto;bottom:0}.c15t-ui-root-p7SV0[data-variant=bar][data-position=top]:not(.headless){top:0;bottom:auto}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-cardShell-djyPy{width:100%;max-width:none}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-card-lgjVq{box-shadow:var(--consent-banner-shadow);border-width:0;border-radius:0}.c15t-ui-root-p7SV0[data-variant=bar][data-position=bottom]:not(.headless) .c15t-ui-card-lgjVq{border-top-width:var(--consent-banner-border-width);padding-bottom:env(safe-area-inset-bottom);border-top-style:solid}.c15t-ui-root-p7SV0[data-variant=bar][data-position=top]:not(.headless) .c15t-ui-card-lgjVq{border-bottom-width:var(--consent-banner-border-width);padding-top:env(safe-area-inset-top);border-bottom-style:solid}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-cardShell-djyPy>[data-variant=banner-tag]{margin-inline-end:1.5rem}.c15t-ui-root-p7SV0[data-variant=bar][data-position=top]:not(.headless) .c15t-ui-cardShell-djyPy>[data-variant=banner-tag]{border-top-width:0;border-bottom-width:1px;border-radius:0 0 .75rem .75rem;order:1;margin-block:-1px 0}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{flex-direction:column;align-items:stretch;gap:.75rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rights-wZg5K{flex-direction:column;align-items:flex-start}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe button[data-action]:not(.c15t-ui-rightLink-IXsSJ){flex:auto;width:100%;min-width:0}@media (width>=640px){.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{flex-direction:row;justify-content:space-between;align-items:center}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rights-wZg5K{flex-flow:wrap;align-items:center;margin-inline-end:auto}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe>*{width:auto}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe button[data-action]:not(.c15t-ui-rightLink-IXsSJ){flex:none;width:auto}}@media (width>=1024px){.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-card-lgjVq{flex-direction:row;align-items:center;display:flex}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-header-S6GiJ{flex:auto;min-width:0}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{background-color:#0000;width:auto;min-width:0}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-card-lgjVq>:not([hidden])~:not([hidden]){border-top-width:0}}:is(.c15t-ui-root-p7SV0[data-variant=floating][data-position$=-right]:not(.headless) .c15t-ui-cardShell-djyPy,.c15t-ui-root-p7SV0[data-variant=widget][data-position$=-right]:not(.headless) .c15t-ui-cardShell-djyPy){margin-left:auto;margin-right:0}:is(.c15t-ui-root-p7SV0[data-variant=floating][data-position$=-left]:not(.headless) .c15t-ui-cardShell-djyPy,.c15t-ui-root-p7SV0[data-variant=widget][data-position$=-left]:not(.headless) .c15t-ui-cardShell-djyPy){margin-left:0;margin-right:auto}.c15t-ui-root-p7SV0[data-variant=floating][data-position$=-center]:not(.headless) .c15t-ui-cardShell-djyPy{margin-left:auto;margin-right:auto}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless){padding:.75rem}@media (width>=640px){.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless){padding:1rem}}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-cardShell-djyPy{width:min(calc(100vw - 1.5rem), var(--consent-banner-widget-max-width))}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-header-S6GiJ{padding:.75rem}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-title-vm8nL{font-size:.875rem;line-height:1.25rem}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-description-s8Qhg{font-size:.8125rem;line-height:1.125rem}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-footer-JhJAe{gap:.5rem;padding:.75rem}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-footer-JhJAe button[data-action]:not(.c15t-ui-rightLink-IXsSJ){padding:.5rem .75rem}.c15t-ui-root-p7SV0[data-variant=widget]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rightLink-IXsSJ{font-size:.8125rem;line-height:1.125rem}.c15t-ui-root-p7SV0[data-variant=wall]:not(.headless){place-items:center;width:auto;padding:1rem;display:grid;inset:0}.c15t-ui-root-p7SV0[data-variant=wall]:not(.headless) .c15t-ui-cardShell-djyPy{width:min(calc(100vw - 2rem), var(--consent-banner-wall-max-width))}.c15t-ui-card-lgjVq:not(.headless){border-radius:var(--consent-banner-border-radius);border-width:var(--consent-banner-border-width);border-style:solid;border-color:var(--consent-banner-border-color);background-color:var(--consent-banner-background-color);width:100%;box-shadow:var(--consent-banner-shadow);position:relative;overflow:hidden}.c15t-ui-cardShell-djyPy:not(.headless){width:min(calc(100vw - 2rem), var(--consent-banner-max-width));flex-direction:column;display:flex;container:c15t-banner/inline-size}@media (width>=640px){.c15t-ui-cardShell-djyPy:not(.headless){width:min(calc(100vw - 3rem), var(--consent-banner-max-width))}}.c15t-dark .c15t-ui-card-lgjVq:not(.headless){background-color:var(--consent-banner-background-color-dark);border-color:var(--consent-banner-border-color-dark);box-shadow:var(--consent-banner-shadow-dark)}.c15t-dark .c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-card-lgjVq{box-shadow:var(--consent-banner-shadow-dark)}.c15t-ui-card-lgjVq:not(.headless)>:not([hidden])~:not([hidden]){border-top-width:var(--consent-banner-border-width);border-top-style:solid;border-color:var(--consent-banner-border-color)}.c15t-dark .c15t-ui-card-lgjVq:not(.headless)>:not([hidden])~:not([hidden]){border-color:var(--consent-banner-border-color-dark)}.c15t-ui-card-lgjVq:not(.headless):focus{outline:none}.c15t-ui-header-S6GiJ:not(.headless){color:var(--consent-banner-text-color);flex-direction:column;padding:1rem;display:flex}.c15t-dark .c15t-ui-header-S6GiJ:not(.headless){color:var(--consent-banner-text-color-dark)}@media (width>=640px){.c15t-ui-header-S6GiJ:not(.headless){padding:1.5rem}}.c15t-ui-header-S6GiJ:not(.headless)>:not([hidden])~:not([hidden]){--consent-banner-space-y-reverse:0;margin-top:calc(.5rem * calc(1 - var(--consent-banner-space-y-reverse)));margin-bottom:calc(.5rem * var(--consent-banner-space-y-reverse))}.c15t-ui-footer-JhJAe:not(.headless){background-color:var(--consent-banner-footer-background-color);flex-direction:column;justify-content:space-between;gap:.75rem;padding:1rem 1.25rem;display:flex}.c15t-dark .c15t-ui-footer-JhJAe:not(.headless){background-color:var(--consent-banner-footer-background-color-dark)}@media (width>=640px){.c15t-ui-footer-JhJAe:not(.headless){flex-direction:row}}.c15t-ui-rights-wZg5K:not(.headless){flex-flow:wrap;align-items:center;gap:.75rem;min-width:0;display:flex}.c15t-ui-rightLink-IXsSJ:not(.headless){width:auto;font:inherit;font-family:var(--consent-banner-font-family);letter-spacing:-.006em;color:var(--consent-banner-description-color);text-underline-offset:.15em;text-align:start;cursor:pointer;border-radius:var(--consent-banner-border-radius-sm);touch-action:manipulation;background:0 0;border:0;flex:none;align-self:center;margin:0;padding:0;font-size:.875rem;font-weight:400;line-height:1.25rem;text-decoration:underline;display:inline-block}.c15t-ui-rightLink-IXsSJ:not(.headless):hover{color:var(--consent-banner-text-color)}.c15t-ui-rightLink-IXsSJ:not(.headless):focus-visible{box-shadow:var(--button-shadow-primary-focus,0 0 0 2px var(--c15t-primary));outline:none}.c15t-dark .c15t-ui-rightLink-IXsSJ:not(.headless){color:var(--consent-banner-description-color-dark)}.c15t-dark .c15t-ui-rightLink-IXsSJ:not(.headless):hover{color:var(--consent-banner-text-color-dark)}.c15t-dark .c15t-ui-rightLink-IXsSJ:not(.headless):focus-visible{box-shadow:var(--button-shadow-primary-focus-dark,0 0 0 2px var(--c15t-primary))}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe{flex-direction:column;align-items:stretch;gap:.75rem}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rights-wZg5K{flex-direction:column;align-items:flex-start;gap:.5rem}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe button[data-action]:not(.c15t-ui-rightLink-IXsSJ){flex:auto;width:100%;min-width:0}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rightLink-IXsSJ{flex:none;align-self:flex-start;width:auto}@media (width>=640px){.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe{flex-direction:row;justify-content:space-between;align-items:center;gap:.75rem}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rights-wZg5K{flex-flow:wrap;flex:auto;align-items:center;gap:.75rem;min-width:0}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe>*{width:auto}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe button[data-action]:not(.c15t-ui-rightLink-IXsSJ){flex:none;width:auto}.c15t-ui-root-p7SV0[data-prompt=notice]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rightLink-IXsSJ{align-self:center}}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-header-S6GiJ,.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{padding:.75rem 1rem}@media (width>=640px){.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-header-S6GiJ{padding:1rem 1.5rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{padding:.75rem 1.5rem}}@media (width>=1024px){.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-header-S6GiJ{padding:.75rem 1.5rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-header-S6GiJ>:not([hidden])~:not([hidden]){margin-top:.25rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-title-vm8nL{line-height:1.25rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe{flex:none;gap:.75rem}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rights-wZg5K{flex-flow:row;flex:none;align-items:center;gap:.75rem;margin-inline-end:0}.c15t-ui-root-p7SV0[data-variant=bar]:not(.headless) .c15t-ui-footer-JhJAe .c15t-ui-rightLink-IXsSJ{white-space:nowrap;font-size:.8125rem;line-height:1.125rem}}.c15t-ui-description-s8Qhg:not(.headless){letter-spacing:-.006em;color:var(--consent-banner-description-color);font-size:.875rem;font-weight:400;line-height:1.25rem}.c15t-dark .c15t-ui-description-s8Qhg:not(.headless){color:var(--consent-banner-description-color-dark)}.c15t-ui-description-s8Qhg[data-context=banner]:not(.headless){letter-spacing:-.006em;color:var(--consent-banner-description-color);font-size:.875rem;font-weight:400;line-height:1.25rem}.c15t-dark .c15t-ui-description-s8Qhg[data-context=banner]:not(.headless){color:var(--consent-banner-description-color-dark)}.c15t-ui-description-s8Qhg[data-context=dialog]:not(.headless){color:var(--consent-dialog-muted-color);font-size:var(--consent-dialog-description-font-size);font-weight:var(--consent-dialog-description-font-weight);line-height:var(--consent-dialog-description-line-height)}.c15t-dark .c15t-ui-description-s8Qhg[data-context=dialog]:not(.headless){color:var(--consent-dialog-muted-color-dark)}.c15t-ui-description-s8Qhg[data-context=manager]:not(.headless){color:var(--consent-manager-text-muted-color)}.c15t-dark .c15t-ui-description-s8Qhg[data-context=manager]:not(.headless){color:var(--consent-manager-text-muted-color-dark)}.c15t-ui-title-vm8nL:not(.headless){letter-spacing:-.011em;color:var(--consent-banner-title-color);margin:0;font-size:1rem;font-weight:500;line-height:1.5rem}.c15t-dark .c15t-ui-title-vm8nL:not(.headless){color:var(--consent-banner-title-color-dark)}.c15t-ui-overlay-DoHh4:not(.headless){background-color:var(--consent-banner-overlay-background-color);z-index:var(--consent-banner-overlay-z-index);position:fixed;inset:0}:is(.c15t-ui-overlayEnterActive-YGn_8:not(.headless),.c15t-ui-overlayEnterFrom-OtDqj:not(.headless),.c15t-ui-overlayEnterTo-jcvNq:not(.headless),.c15t-ui-overlayEntering-p5Z3U:not(.headless),.c15t-ui-overlayLeaveFrom-EYTMT:not(.headless),.c15t-ui-overlayVisible-ywHQp:not(.headless)){opacity:1}.c15t-ui-overlayEntering-p5Z3U[data-entry=late]:not(.c15t-ui-overlayHidden-WgrJC):not(.headless){transition:opacity var(--consent-banner-entry-duration) var(--consent-banner-entry-timing)}@starting-style{.c15t-ui-overlayEntering-p5Z3U[data-entry=late]:not(.headless){opacity:0}}.c15t-ui-overlayLeaveActive-FvP5W:not(.headless){transition:opacity var(--consent-banner-animation-duration) var(--consent-banner-animation-timing)}.c15t-ui-overlayLeaveTo-V7aI7:not(.headless){opacity:0}.c15t-ui-overlayHidden-WgrJC:not(.headless){opacity:0;transition:opacity var(--consent-banner-animation-duration) var(--consent-banner-animation-timing)}.c15t-dark .c15t-ui-overlay-DoHh4:not(.headless){background-color:var(--consent-banner-overlay-background-color-dark)}@media (prefers-reduced-motion:reduce){.c15t-ui-bannerEntering-Cqrwl[data-entry=late]:not(.c15t-ui-bannerHidden-R0_3M):not(.headless),.c15t-ui-overlayEntering-p5Z3U[data-entry=late]:not(.c15t-ui-overlayHidden-WgrJC):not(.headless),.c15t-ui-bannerLeaveActive-C7qrk:not(.headless),.c15t-ui-bannerHidden-R0_3M:not(.headless),.c15t-ui-overlayLeaveActive-FvP5W:not(.headless),.c15t-ui-overlayHidden-WgrJC:not(.headless){transition:none;animation:none}}
|
|
70
70
|
|
|
71
71
|
/* components/accordion */
|
|
72
72
|
.c15t-ui-list-T3EU0:not(.headless){gap:var(--accordion-stack-gap,.75rem);display:grid}.c15t-ui-item-Jgm_X:not(.headless){border:1px solid var(--accordion-border-color,var(--c15t-border));border-radius:var(--accordion-radius,var(--c15t-radius-md));box-shadow:none;background-color:var(--accordion-background-color,var(--c15t-surface));padding:0;display:grid;overflow:visible}.c15t-dark .c15t-ui-item-Jgm_X:not(.headless){border-color:var(--accordion-border-color-dark,var(--c15t-border));background-color:var(--accordion-background-color-dark,var(--c15t-surface))}.c15t-ui-triggerRow-xXdTH:not(.headless){align-items:center;gap:var(--accordion-gap,var(--c15t-space-xs));box-sizing:border-box;width:100%;padding:var(--accordion-padding,var(--c15t-space-sm));border-radius:var(--accordion-radius,var(--c15t-radius-md));color:var(--accordion-text-color,var(--c15t-text));transition:background-color var(--accordion-duration,var(--c15t-duration-normal)) var(--accordion-ease,var(--c15t-easing));background-color:#0000;border:0;grid-column:1/-1;grid-template-columns:minmax(0,1fr) auto;margin:0;display:grid}.c15t-ui-triggerRow-xXdTH:not(.headless):hover{background-color:var(--accordion-background-hover,var(--c15t-surface-hover))}.c15t-dark .c15t-ui-triggerRow-xXdTH:not(.headless){color:var(--accordion-text-color-dark,var(--c15t-text))}.c15t-dark .c15t-ui-triggerRow-xXdTH:not(.headless):hover{background-color:var(--accordion-background-hover-dark,var(--c15t-surface-hover))}.c15t-ui-item-Jgm_X:not(.headless):has(.c15t-ui-trigger-KT5J_:focus-visible){outline:2px solid var(--accordion-focus-ring,var(--c15t-primary));outline-offset:-2px}.c15t-dark .c15t-ui-item-Jgm_X:not(.headless):has(.c15t-ui-trigger-KT5J_:focus-visible){outline-color:var(--accordion-focus-ring-dark,var(--c15t-primary))}.c15t-ui-trigger-KT5J_:not(.headless):focus-visible{outline:none}.c15t-ui-item-Jgm_X:not(.headless)>.c15t-ui-content-qdPhy{grid-column:1/-1}.c15t-ui-trigger-KT5J_:not(.headless){appearance:none;align-items:center;gap:var(--accordion-gap,var(--c15t-space-xs));min-width:0;min-height:calc(var(--accordion-icon-size,1.25rem) + .25rem);font-family:inherit;font-size:var(--accordion-title-size,var(--c15t-font-size-sm));line-height:var(--c15t-line-height-tight);letter-spacing:inherit;font-weight:var(--c15t-font-weight-normal);border-radius:var(--accordion-radius,var(--c15t-radius-md));width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;flex:auto;align-self:stretch;padding:0;display:flex;position:relative}.c15t-ui-arrow-JFKgd:not(.headless){color:var(--accordion-arrow-color,color-mix(in srgb, var(--c15t-text-muted) 60%, var(--c15t-surface)));width:var(--accordion-icon-size,1.25rem);height:var(--accordion-icon-size,1.25rem);transition:transform var(--accordion-duration,var(--c15t-duration-normal)) var(--accordion-ease,var(--c15t-easing));flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.c15t-ui-arrow-JFKgd:not(.headless) svg{width:100%;height:100%;display:block}.c15t-dark .c15t-ui-arrow-JFKgd:not(.headless){color:var(--accordion-arrow-color-dark,color-mix(in srgb, var(--c15t-text-muted) 40%, var(--c15t-text)))}.c15t-ui-header-ogZie:not(.headless){flex-direction:column;flex:1;min-width:0;display:flex}.c15t-ui-title-vmC1f:not(.headless){font:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0}.c15t-ui-control-dy7nh:not(.headless){flex-shrink:0;align-self:center;position:relative;top:-1px}.c15t-ui-restriction-bXiI7:not(.headless){padding:0 var(--accordion-row-padding-x,var(--c15t-space-md)) .75rem;color:var(--accordion-restriction-color,var(--c15t-text-muted));font-size:var(--c15t-font-size-sm);line-height:var(--c15t-line-height-normal);grid-column:1/-1;margin:0;display:block}.c15t-ui-content-qdPhy:not(.headless){color:var(--accordion-content-color,color-mix(in srgb, var(--c15t-text-muted) 87%, var(--c15t-text)));letter-spacing:inherit;transition:grid-template-rows var(--accordion-duration,var(--c15t-duration-normal)) var(--accordion-ease,var(--c15t-easing));grid-template-rows:0fr;padding:0;font-size:.875rem;line-height:1.5;display:grid;overflow:hidden}.c15t-ui-content-qdPhy:not(.headless)[data-state=open]{grid-template-rows:1fr}.c15t-ui-content-qdPhy:not(.headless)[data-state=closed]{pointer-events:none}.c15t-ui-contentViewport-O2Kny:not(.headless){min-height:0;padding-top:0;padding-inline:calc(var(--accordion-icon-size,1.25rem) + var(--accordion-gap,var(--c15t-space-xs)));overflow:hidden}.c15t-ui-contentInner-b3ykf:not(.headless){opacity:1;transition:opacity calc(var(--accordion-duration,var(--c15t-duration-normal)) * .35) var(--c15t-easing-out);padding-top:0}.c15t-ui-content-qdPhy[data-state=open] .c15t-ui-contentViewport-O2Kny:not(.headless){padding-bottom:var(--accordion-padding,var(--c15t-space-sm))}.c15t-ui-content-qdPhy[data-state=closed] .c15t-ui-contentViewport-O2Kny:not(.headless){padding-bottom:0}.c15t-ui-content-qdPhy[data-state=closed] .c15t-ui-contentInner-b3ykf:not(.headless){opacity:0}.c15t-dark .c15t-ui-content-qdPhy:not(.headless){color:var(--accordion-content-color-dark,var(--c15t-text-muted))}:is([data-disable-animation] .c15t-ui-content-qdPhy:not(.headless),.disable-animation .c15t-ui-content-qdPhy:not(.headless)),:is([data-disable-animation] .c15t-ui-contentInner-b3ykf:not(.headless),.disable-animation .c15t-ui-contentInner-b3ykf:not(.headless)),:is([data-disable-animation] .c15t-ui-arrow-JFKgd:not(.headless),.disable-animation .c15t-ui-arrow-JFKgd:not(.headless)){transition:none}@media (prefers-reduced-motion:reduce){.c15t-ui-triggerRow-xXdTH:not(.headless),.c15t-ui-arrow-JFKgd:not(.headless),.c15t-ui-content-qdPhy:not(.headless),.c15t-ui-contentInner-b3ykf:not(.headless){transition:none}}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsx as
|
|
2
|
+
import{jsx as e}from"react/jsx-runtime";import{Suspense as r,forwardRef as t,lazy as a,useSyncExternalStore as o}from"react";let n=n=>{let l,u={status:"pending"},c=u,s=!1,d=new Set,i=()=>c,f=()=>u,m=e=>(s||=e,l??=(async()=>{try{let e=await n();return c={module:e,status:"ready"},e}catch(e){throw s?c={error:e,status:"error"}:l=void 0,e}})()),p=!1,y=()=>{p||(p=!0,queueMicrotask(()=>{for(let e of(p=!1,c={...c},d))e()}))},h=e=>(d.add(e),()=>{d.delete(e)});return{component(n){let l=a(()=>{let e=(async()=>({default:n(await m(!0))}))();return e.then(y,y),e}),u=t((t,a)=>{let n=o(h,i,f);if("error"===n.status)throw n.error;return e(r,{fallback:null,children:e(l,{...t,ref:a})})});return u.displayName="DeferredComponent",u},async preload(){try{await m(!1)}catch{}}}};export{n as createDeferredModule};
|
package/dist/version.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
let e="3.0.0-alpha.
|
|
1
|
+
let e="3.0.0-alpha.12";export{e as version};
|
|
@@ -7,10 +7,10 @@
|
|
|
7
7
|
*
|
|
8
8
|
* - Intent: pointerenter or focus on any `ConsentButton` that opens the
|
|
9
9
|
* dialog, including the stock banner's Customize button.
|
|
10
|
-
* - Idle:
|
|
11
|
-
* while the banner is shown or a dialog trigger is mounted.
|
|
12
|
-
*
|
|
13
|
-
*
|
|
10
|
+
* - Idle: in the browser's first idle period after the page's load event,
|
|
11
|
+
* while the banner is shown or a dialog trigger is mounted. This covers a
|
|
12
|
+
* tap, which leaves intent warming no lead time: on touch, pointerenter
|
|
13
|
+
* fires with the tap itself.
|
|
14
14
|
*
|
|
15
15
|
* Module-level registry keeps banner components decoupled from the
|
|
16
16
|
* aggregate exports (no context change, tree-shakes with the aggregate).
|
|
@@ -19,8 +19,8 @@ type Warmer = () => void;
|
|
|
19
19
|
/**
|
|
20
20
|
* When the deferred consent dialog starts loading before it opens.
|
|
21
21
|
*
|
|
22
|
-
* - `'idle'`:
|
|
23
|
-
*
|
|
22
|
+
* - `'idle'`: in the browser's first idle period after the page's load
|
|
23
|
+
* event, while the banner is shown or a button that opens the dialog is
|
|
24
24
|
* mounted. Also on hover or focus of such a button.
|
|
25
25
|
* - `'intent'`: only on hover or focus of a button that opens the dialog.
|
|
26
26
|
*
|
|
@@ -45,12 +45,9 @@ export declare const warmDialogChunk: () => void;
|
|
|
45
45
|
*/
|
|
46
46
|
export declare const useIdleDialogWarming: (active: boolean) => void;
|
|
47
47
|
/**
|
|
48
|
-
* Reset module state between tests.
|
|
49
|
-
* after load, `0` unless a test passes another delay.
|
|
48
|
+
* Reset module state between tests.
|
|
50
49
|
*
|
|
51
50
|
* @internal
|
|
52
51
|
*/
|
|
53
|
-
export declare const resetDialogChunkWarmingForTests: (
|
|
54
|
-
idleWarmDelayMs?: number;
|
|
55
|
-
}) => void;
|
|
52
|
+
export declare const resetDialogChunkWarmingForTests: () => void;
|
|
56
53
|
export {};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Loads the trigger toolbar on demand. The single-button trigger becomes a
|
|
3
|
+
* toolbar only while `<ConsentDevTools>` is mounted, so apps without
|
|
4
|
+
* DevTools never download it. The DevTools entry registers the toolbar when
|
|
5
|
+
* it loads, so the swap to a toolbar never waits on a request.
|
|
6
|
+
*
|
|
7
|
+
* @internal
|
|
8
|
+
* @packageDocumentation
|
|
9
|
+
*/
|
|
10
|
+
import type { TriggerToolbar } from './atoms/toolbar.js';
|
|
11
|
+
/** The toolbar view the trigger renders while DevTools is mounted. */
|
|
12
|
+
export type TriggerToolbarComponent = typeof TriggerToolbar;
|
|
13
|
+
/**
|
|
14
|
+
* Make the toolbar available synchronously.
|
|
15
|
+
*
|
|
16
|
+
* @param component - The toolbar view.
|
|
17
|
+
* @internal
|
|
18
|
+
*/
|
|
19
|
+
export declare const registerTriggerToolbar: (component: TriggerToolbarComponent) => void;
|
|
20
|
+
/**
|
|
21
|
+
* The toolbar view when it has loaded or been registered.
|
|
22
|
+
*
|
|
23
|
+
* @returns The toolbar view, or `undefined` while it is not loaded.
|
|
24
|
+
* @internal
|
|
25
|
+
*/
|
|
26
|
+
export declare const getTriggerToolbar: () => TriggerToolbarComponent | undefined;
|
|
27
|
+
/**
|
|
28
|
+
* Load the toolbar view. A failed load is not cached, so a later call
|
|
29
|
+
* retries.
|
|
30
|
+
*
|
|
31
|
+
* @returns The toolbar view.
|
|
32
|
+
* @internal
|
|
33
|
+
*/
|
|
34
|
+
export declare const loadTriggerToolbar: () => Promise<TriggerToolbarComponent>;
|
|
@@ -2,9 +2,33 @@
|
|
|
2
2
|
export interface SurfaceStyleSheet {
|
|
3
3
|
/** Dedupes the stylesheet: a page renders each `id` once. */
|
|
4
4
|
id: string;
|
|
5
|
-
/** The stylesheet text. */
|
|
5
|
+
/** The stylesheet text. Empty for a deferred sheet. */
|
|
6
6
|
css: string;
|
|
7
|
+
/**
|
|
8
|
+
* Loads the text of a deferred sheet. A browser bundle gets one in place
|
|
9
|
+
* of `css` when the framework already put the sheet in the server HTML,
|
|
10
|
+
* as the Next.js adapter does, so the text ships once.
|
|
11
|
+
*/
|
|
12
|
+
load?: () => Promise<string>;
|
|
7
13
|
}
|
|
14
|
+
/**
|
|
15
|
+
* Starts loading the deferred sheets the page does not hold yet. Safe to
|
|
16
|
+
* call often: each sheet loads once, and the next call retries a failed
|
|
17
|
+
* load.
|
|
18
|
+
*
|
|
19
|
+
* @internal
|
|
20
|
+
*/
|
|
21
|
+
export declare const preloadSurfaceSheets: (sheets: readonly SurfaceStyleSheet[]) => Promise<void>;
|
|
22
|
+
/**
|
|
23
|
+
* Whether a surface can show: its deferred sheets are in the page or
|
|
24
|
+
* loaded. Starts loading the missing ones after mount, so a surface that
|
|
25
|
+
* renders later, like a banner waiting on the browser's consent fetch,
|
|
26
|
+
* finds them ready. Hydration reads `true`: the server rendered the sheets
|
|
27
|
+
* it rendered the surface with.
|
|
28
|
+
*
|
|
29
|
+
* @internal
|
|
30
|
+
*/
|
|
31
|
+
export declare const useSurfaceSheetsReady: (sheets: readonly SurfaceStyleSheet[], noStyle?: boolean) => boolean;
|
|
8
32
|
/**
|
|
9
33
|
* Renders the stylesheets a stock surface needs as `<style>` elements.
|
|
10
34
|
*
|
|
@@ -33,4 +57,4 @@ export interface SurfaceStyleSheet {
|
|
|
33
57
|
export declare const SurfaceStyles: ({ sheets, noStyle, }: {
|
|
34
58
|
sheets: readonly SurfaceStyleSheet[];
|
|
35
59
|
noStyle?: boolean;
|
|
36
|
-
}) => import("react").JSX.Element[] | null;
|
|
60
|
+
}) => (import("react").JSX.Element | null)[] | null;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import type { IABConsentDialogCompoundComponent } from './components/iab-panel/index.js';
|
|
2
|
+
/**
|
|
3
|
+
* The IAB TCF preference centre: purposes, stacks, special features and
|
|
4
|
+
* per-vendor consent and legitimate-interest controls.
|
|
5
|
+
*
|
|
6
|
+
* @remarks
|
|
7
|
+
* The component code loads on demand. It downloads in the browser's first
|
|
8
|
+
* idle period after the page's `load` event while the IAB banner is shown,
|
|
9
|
+
* on hover or focus of the banner's Customize button or partners link, or
|
|
10
|
+
* when the dialog opens, whichever comes first. `preloadDialog: 'intent'` in
|
|
11
|
+
* the provider options skips the idle load. `open={true}` or `showTrigger`
|
|
12
|
+
* loads it on mount under a model `models` lists; under another model,
|
|
13
|
+
* `showTrigger` loads only the trigger.
|
|
14
|
+
*
|
|
15
|
+
* The compound parts (`IABConsentDialog.Root`, `.Card`, `.Header`, `.Tabs`,
|
|
16
|
+
* `.TabButton`, `.Content`, `.Footer`, `.Overlay`, `.FeatureItem`,
|
|
17
|
+
* `.PurposeItem`, `.StackItem`, `.VendorList`) load the same module when
|
|
18
|
+
* they render.
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* ```tsx
|
|
22
|
+
* <IABProvider cmpId={28}>
|
|
23
|
+
* <IABConsentBanner />
|
|
24
|
+
* <IABConsentDialog />
|
|
25
|
+
* </IABProvider>
|
|
26
|
+
* ```
|
|
27
|
+
*
|
|
28
|
+
* @public
|
|
29
|
+
*/
|
|
30
|
+
export declare const IABConsentDialog: IABConsentDialogCompoundComponent;
|
|
31
|
+
/**
|
|
32
|
+
* Reset the warming state shared by mounted dialogs between tests.
|
|
33
|
+
*
|
|
34
|
+
* @internal
|
|
35
|
+
*/
|
|
36
|
+
export declare const resetIABDialogWarmingForTests: () => void;
|
package/dist-types/iab.d.ts
CHANGED
|
@@ -24,7 +24,8 @@
|
|
|
24
24
|
* @packageDocumentation
|
|
25
25
|
*/
|
|
26
26
|
export { IABConsentBanner, type IABConsentBannerProps, } from './components/iab-prompt/index.js';
|
|
27
|
-
export {
|
|
27
|
+
export type { IABConsentDialogProps } from './components/iab-panel/index.js';
|
|
28
|
+
export { IABConsentDialog } from './iab-dialog-deferred.js';
|
|
28
29
|
export { type HeadlessIABBannerAction, type HeadlessIABBannerState, type HeadlessIABDialogAction, type HeadlessIABDialogState, type HeadlessIABPreferenceTab, type UseHeadlessIABConsentUIResult, useHeadlessIABConsentUI, } from './hooks/use-headless-iab-consent-ui.js';
|
|
29
30
|
export { IABProvider } from './iab-context.js';
|
|
30
31
|
export type { IABProviderProps } from './iab-context.js';
|
package/dist-types/version.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const version = "3.0.0-alpha.
|
|
1
|
+
export declare const version = "3.0.0-alpha.12";
|
package/docs/README.md
CHANGED
|
@@ -125,5 +125,6 @@ These docs describe c15t v3. Find your app's row in Choose your setup, then foll
|
|
|
125
125
|
- [TikTok Pixel](./integrations/tiktok-pixel.md): Load the TikTok Pixel only after marketing consent with the c15t tiktokPixel helper, guard ttq event calls, and check it in DevTools.
|
|
126
126
|
- [Umami Analytics](./integrations/umami-analytics.md): Load the Umami Analytics tracker only after measurement consent with the c15t umamiAnalytics helper, point it at a self-hosted instance, and check it in DevTools.
|
|
127
127
|
- [Vercel Analytics](./integrations/vercel-analytics.md): Load the Vercel Web Analytics script only after measurement consent with the c15t vercelAnalytics helper, choose the debug script, and check it in DevTools.
|
|
128
|
+
- [Vercel Speed Insights](./integrations/vercel-speed-insights.md): Load the Vercel Speed Insights collector only after measurement consent with the c15t vercelSpeedInsights helper, drop Web Vitals reports on revocation, and check it in DevTools.
|
|
128
129
|
- [X Pixel](./integrations/x-pixel.md): Load the X Pixel only after marketing consent with the c15t xPixel helper, guard twq conversion events, and check it in DevTools.
|
|
129
130
|
- [YouTube](./integrations/youtube.md): Gate YouTube embeds with c15t v3 in Next.js, TanStack Start, React, Nuxt, Vue, Astro, Svelte, SvelteKit or JavaScript.
|
|
@@ -78,8 +78,11 @@ public policy manifest, never a response that contains a visitor's consent.
|
|
|
78
78
|
Use a build-time manifest as the default for supported production builds.
|
|
79
79
|
`manifest()` is the default mode in Next.js, TanStack Start, Nuxt, Astro and
|
|
80
80
|
SvelteKit, so their servers resolve requests from the deployment's snapshot.
|
|
81
|
-
|
|
82
|
-
|
|
81
|
+
React, Vue and Svelte single-page apps have no server, so their quickstarts
|
|
82
|
+
use `hosted()`: the backend reads each visitor's location from the `/init`
|
|
83
|
+
request. They can bundle the manifest for browser resolution too, but a
|
|
84
|
+
regional policy still needs `/init` on a first visit unless the page knows
|
|
85
|
+
the location. The framework quickstarts show the build
|
|
83
86
|
integration. [Consent modes](./modes.md) lists every mode, its
|
|
84
87
|
options and the backend URL variable each framework reads.
|
|
85
88
|
|
|
@@ -14,14 +14,14 @@ the same protocol, so every path below works with either. Only `offline()`
|
|
|
14
14
|
removes backend requests. For a recommendation by framework, start with
|
|
15
15
|
[choose your setup](./choose-your-setup.md).
|
|
16
16
|
|
|
17
|
-
| Fetching path
|
|
18
|
-
|
|
|
19
|
-
| Build-time manifest, recommended | Your server
|
|
20
|
-
| Cached manifest on your server
|
|
21
|
-
| Regular backend `/init`
|
|
22
|
-
| Manifest in the browser
|
|
23
|
-
| Offline
|
|
24
|
-
| Custom transport
|
|
17
|
+
| Fetching path | Where policy resolves | Where choices are submitted | Choose it when |
|
|
18
|
+
| --------------------------------------------------------- | -------------------------------------------------------------------------------------------- | --------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
19
|
+
| Build-time manifest, recommended for server-rendered apps | Your server resolves a bundled policy snapshot with each visitor's inputs | Inth or your c15t backend | Your framework renders on the server, supports a build integration, and policy changes can ship with a rebuild |
|
|
20
|
+
| Cached manifest on your server | Your application resolves public policy data with each request's location and signals | Inth or your c15t backend | Policy changes must reach the app without rebuilding, or builds cannot access the backend |
|
|
21
|
+
| Regular backend `/init` | The consent backend | The same backend | You have no application server, as in a React, Vue or Svelte single-page app, want the fewest moving parts, or need backend-owned request resolution |
|
|
22
|
+
| Manifest in the browser | The browser, using a supplied location, or `/init` when the policy needs one it doesn't have | Inth or your c15t backend | The policy has no location rules or the page knows the visitor's location, and you accept about 3 KB more bundle and a rebuild for policy edits |
|
|
23
|
+
| Offline | The browser or local runtime, using bundled rules | No backend submission | Local development and tests. Not recommended for production environments. |
|
|
24
|
+
| Custom transport | Your implementation | Your implementation | An existing service cannot use the c15t backend protocol |
|
|
25
25
|
|
|
26
26
|
## What is a consent manifest?
|
|
27
27
|
|
|
@@ -53,7 +53,9 @@ download fails.
|
|
|
53
53
|
The framework quickstarts include the build integration for supported
|
|
54
54
|
deployments. Server resolution uses the snapshot without an upstream manifest
|
|
55
55
|
request. Browser resolution includes the policy and resolver in the client
|
|
56
|
-
bundle, and
|
|
56
|
+
bundle, and still calls `/init` for a regional policy when the browser doesn't
|
|
57
|
+
know the visitor's location, so the React, Vue and Svelte quickstarts use
|
|
58
|
+
`hosted()` instead. Static Nuxt and
|
|
57
59
|
Astro sites and script-tag sites keep the runtime setup from their guides.
|
|
58
60
|
|
|
59
61
|
The snapshot is fixed at build time:
|
|
@@ -133,7 +135,11 @@ Saves replayed after going offline carry none.
|
|
|
133
135
|
|
|
134
136
|
Set it on the runtime or provider. In Next.js use `defineConsentConfig({ journey })`;
|
|
135
137
|
in TanStack Start pass the same value to `resolveConsent` and `ConsentRoot`; with
|
|
136
|
-
the inline prefetch script, pass it to `buildPrefetchScript
|
|
138
|
+
the inline prefetch script, pass it to `buildPrefetchScript` or to
|
|
139
|
+
`consentManifest({ initPrefetch: { journey } })`. Left unset, the script
|
|
140
|
+
continues a `'tab'` journey the tab already holds. A tab's first page has
|
|
141
|
+
none, so its `/init` reports the scope as `'page'`. The id still links it to
|
|
142
|
+
the save. Pass `journey: 'tab'` to the script too if you report on scope. Vue, Svelte, Astro
|
|
137
143
|
and the script tag use `'page'`. A manifest that resolves locally in the
|
|
138
144
|
browser reports no init, so it sends no journey.
|
|
139
145
|
|
|
@@ -161,6 +167,14 @@ A same-origin URL named `/api/c15t/init` can instead resolve from a cached
|
|
|
161
167
|
manifest in your application. The URL name alone does not tell you which path
|
|
162
168
|
runs.
|
|
163
169
|
|
|
170
|
+
In the browser, an inline script in `<head>` can start `/init` while the
|
|
171
|
+
app's JavaScript downloads, and `hosted()` uses that response. Vite apps get
|
|
172
|
+
it from `consentManifest()` by default, Nuxt adds it to pages with
|
|
173
|
+
`ssr: false`, and TanStack Start has `consentPrefetchHead`. Elsewhere, render
|
|
174
|
+
`buildPrefetchScript({ backendURL })` from `c15t` yourself. If c15t assigns
|
|
175
|
+
a banner experiment's arm, give the script the same `experiment`, or
|
|
176
|
+
`hosted()` sends a second `/init` for visitors who have not chosen yet.
|
|
177
|
+
|
|
164
178
|
## How do transports and proxies differ?
|
|
165
179
|
|
|
166
180
|
A transport implements initialization, saving and optional record operations.
|
package/docs/concepts/modes.md
CHANGED
|
@@ -15,15 +15,18 @@ and `offline()`. Consent choices go to the backend in `manifest()` and
|
|
|
15
15
|
`hosted()`, whether that backend is [Inth](https://inth.com) or a
|
|
16
16
|
[self-hosted c15t backend](https://v3.c15t.com/docs/self-host/quickstart).
|
|
17
17
|
|
|
18
|
-
| Mode | Where the policy resolves | Backend requests on a first visit
|
|
19
|
-
| ------------------------- | ------------------------------------------------------------------------------------------------------------------- |
|
|
20
|
-
| `manifest()`, the default | Your server, from the policy the build downloaded. With `resolve: 'browser'`, or in a single-page app, the browser. | None to resolve the policy. Choices post to `/subjects`. |
|
|
21
|
-
| `hosted()` | The backend's `GET /init` | One `/init` per page that resolves consent.
|
|
22
|
-
| `offline()` | The browser, from rules in your bundle | None. Choices stay in the browser.
|
|
18
|
+
| Mode | Where the policy resolves | Backend requests on a first visit | Use it when |
|
|
19
|
+
| ------------------------- | ------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
20
|
+
| `manifest()`, the default | Your server, from the policy the build downloaded. With `resolve: 'browser'`, or in a single-page app, the browser. | None to resolve the policy, unless the browser needs a location it doesn't have. Choices post to `/subjects`. | Server-rendered apps. Rebuild to ship policy changes, or set `source: 'runtime'`. |
|
|
21
|
+
| `hosted()` | The backend's `GET /init` | One `/init` per page that resolves consent. | Single-page apps and static hosting without a server, where the backend reads each visitor's location from the request. Policy edits apply without a rebuild. |
|
|
22
|
+
| `offline()` | The browser, from rules in your bundle | None. Choices stay in the browser. | Local development, tests and demos. Not recommended for production environments. |
|
|
23
23
|
|
|
24
24
|
`manifest()` is the default in Next.js, TanStack Start, Nuxt, Astro and
|
|
25
25
|
SvelteKit. React, Vue, Svelte and `@c15t/browser` have no default: pass a
|
|
26
|
-
mode yourself.
|
|
26
|
+
mode yourself. The React, Vue and Svelte quickstarts use `hosted()`, because
|
|
27
|
+
a browser has no request location and a bundled regional policy still needs
|
|
28
|
+
`/init` on a first visit. The JavaScript quickstart uses `manifest()`. The
|
|
29
|
+
script tag picks its
|
|
27
30
|
mode from the bundle file; see
|
|
28
31
|
[choose a mode](https://v3.c15t.com/docs/frameworks/html/attributes-and-api#choose-a-mode).
|
|
29
32
|
|
|
@@ -65,22 +65,22 @@ Modules, vanilla-extract, StyleX and Emotion, and
|
|
|
65
65
|
|
|
66
66
|
## Banner parts
|
|
67
67
|
|
|
68
|
-
| Part | `components` key | `theme.slots` key | `data-testid`
|
|
69
|
-
| ------------------------------------------- | ------------------------------------ | ---------------------------------- |
|
|
70
|
-
| Positioning root, with the state attributes | `banner.root` | `consentBanner` | `consent-banner-root`
|
|
71
|
-
| Card sizing and branding container | `banner.cardShell` | None |
|
|
72
|
-
| Visible card | `banner.card` | `consentBannerCard` | `consent-banner-card`
|
|
73
|
-
| Title and description container | `banner.header` | `consentBannerHeader` |
|
|
74
|
-
| Title | `banner.title` | `consentBannerTitle` |
|
|
75
|
-
| Description | `description.banner` | `consentBannerDescription` |
|
|
76
|
-
| Action area | `banner.footer` | `consentBannerFooter` |
|
|
77
|
-
| Group of action groups | `banner.actions` | None |
|
|
78
|
-
| One group of equally prominent actions | `banner.actionGroup` | `consentBannerFooterSubGroup` |
|
|
79
|
-
| Group of right links | `banner.rights` | `consentBannerRights` |
|
|
80
|
-
| One right link | `banner.rightLink` | `consentBannerRightLink` |
|
|
81
|
-
| Backdrop of a blocking banner | `banner.overlay` | `consentBannerOverlay` |
|
|
82
|
-
| "Secured by" tag | `tag.banner` | `consentBannerTag` |
|
|
83
|
-
| Filled and outlined buttons | `button.primary`, `button.secondary` | `buttonPrimary`, `buttonSecondary` |
|
|
68
|
+
| Part | `components` key | `theme.slots` key | `data-testid` |
|
|
69
|
+
| ------------------------------------------- | ------------------------------------ | ---------------------------------- | ------------------------- |
|
|
70
|
+
| Positioning root, with the state attributes | `banner.root` | `consentBanner` | `consent-banner-root` |
|
|
71
|
+
| Card sizing and branding container | `banner.cardShell` | None | |
|
|
72
|
+
| Visible card | `banner.card` | `consentBannerCard` | `consent-banner-card` |
|
|
73
|
+
| Title and description container | `banner.header` | `consentBannerHeader` | |
|
|
74
|
+
| Title | `banner.title` | `consentBannerTitle` | |
|
|
75
|
+
| Description | `description.banner` | `consentBannerDescription` | |
|
|
76
|
+
| Action area | `banner.footer` | `consentBannerFooter` | |
|
|
77
|
+
| Group of action groups | `banner.actions` | None | |
|
|
78
|
+
| One group of equally prominent actions | `banner.actionGroup` | `consentBannerFooterSubGroup` | |
|
|
79
|
+
| Group of right links | `banner.rights` | `consentBannerRights` | |
|
|
80
|
+
| One right link | `banner.rightLink` | `consentBannerRightLink` | |
|
|
81
|
+
| Backdrop of a blocking banner | `banner.overlay` | `consentBannerOverlay` | |
|
|
82
|
+
| "Secured by" tag | `tag.banner` | `consentBannerTag` | `consent-banner-branding` |
|
|
83
|
+
| Filled and outlined buttons | `button.primary`, `button.secondary` | `buttonPrimary`, `buttonSecondary` | |
|
|
84
84
|
|
|
85
85
|
The button parts apply to every c15t button of that style, in the banner and
|
|
86
86
|
the dialog. The script tag's banner has no rights group, so
|
|
@@ -169,6 +169,35 @@ them, on any screen size.
|
|
|
169
169
|
Test long translations and small screens after changing width or typography.
|
|
170
170
|
A compact banner must still fit the required actions.
|
|
171
171
|
|
|
172
|
+
## Stack the banner with your own layers
|
|
173
|
+
|
|
174
|
+
The banner and its overlay sit at the top of the page's stacking order by
|
|
175
|
+
default. Lower them when a navbar, drawer, or chat widget should cover the
|
|
176
|
+
banner.
|
|
177
|
+
|
|
178
|
+
| Variable | Default | Target |
|
|
179
|
+
| -------------------------------------- | -------- | ----------------------------- |
|
|
180
|
+
| `--consent-banner-z-index` | `999998` | Banner |
|
|
181
|
+
| `--consent-banner-overlay-z-index` | `999997` | Backdrop of a blocking banner |
|
|
182
|
+
| `--iab-consent-banner-z-index` | `999998` | IAB TCF banner |
|
|
183
|
+
| `--iab-consent-banner-overlay-z-index` | `999997` | IAB TCF banner backdrop |
|
|
184
|
+
| `--consent-dialog-z-index` | `999999` | Preferences dialog |
|
|
185
|
+
| `--consent-dialog-overlay-z-index` | `999998` | Preferences dialog backdrop |
|
|
186
|
+
|
|
187
|
+
```css
|
|
188
|
+
:root {
|
|
189
|
+
--consent-banner-z-index: 40;
|
|
190
|
+
--consent-banner-overlay-z-index: 39;
|
|
191
|
+
}
|
|
192
|
+
```
|
|
193
|
+
|
|
194
|
+
Keep each z-index above its overlay's, or the backdrop covers the card it
|
|
195
|
+
belongs to. Keep the dialog above the banner so Customize opens on top.
|
|
196
|
+
|
|
197
|
+
Only the card and the "Secured by" tag take clicks. Clicks on the space
|
|
198
|
+
around a floating card, or beside the tag on a bar, reach the page. A
|
|
199
|
+
blocking banner catches every click.
|
|
200
|
+
|
|
172
201
|
## Restyle the "Secured by" tag
|
|
173
202
|
|
|
174
203
|
The tag sits on the edge of the banner and dialog cards and uses the primary
|
|
@@ -18,13 +18,13 @@ import {
|
|
|
18
18
|
ConsentDialog,
|
|
19
19
|
ConsentDialogLink,
|
|
20
20
|
ConsentProvider,
|
|
21
|
-
|
|
21
|
+
hosted,
|
|
22
22
|
} from 'c15t/react';
|
|
23
23
|
import type { ReactNode } from 'react';
|
|
24
24
|
|
|
25
25
|
const options = {
|
|
26
|
-
//
|
|
27
|
-
mode:
|
|
26
|
+
// Asks VITE_C15T_BACKEND_URL for each visitor's policy.
|
|
27
|
+
mode: hosted(),
|
|
28
28
|
scripts: [
|
|
29
29
|
posthog({
|
|
30
30
|
id: 'phc_your_project_key',
|
|
@@ -20,13 +20,13 @@ import {
|
|
|
20
20
|
ConsentDialog,
|
|
21
21
|
ConsentDialogLink,
|
|
22
22
|
ConsentProvider,
|
|
23
|
-
|
|
23
|
+
hosted,
|
|
24
24
|
} from 'c15t/react';
|
|
25
25
|
import type { ReactNode } from 'react';
|
|
26
26
|
|
|
27
27
|
const options = {
|
|
28
|
-
//
|
|
29
|
-
mode:
|
|
28
|
+
// Asks VITE_C15T_BACKEND_URL for each visitor's policy.
|
|
29
|
+
mode: hosted(),
|
|
30
30
|
scripts: [
|
|
31
31
|
posthog({
|
|
32
32
|
id: 'phc_your_project_key',
|
|
@@ -20,13 +20,13 @@ import {
|
|
|
20
20
|
ConsentDialog,
|
|
21
21
|
ConsentDialogLink,
|
|
22
22
|
ConsentProvider,
|
|
23
|
-
|
|
23
|
+
hosted,
|
|
24
24
|
} from 'c15t/react';
|
|
25
25
|
import type { ReactNode } from 'react';
|
|
26
26
|
|
|
27
27
|
const options = {
|
|
28
|
-
//
|
|
29
|
-
mode:
|
|
28
|
+
// Asks VITE_C15T_BACKEND_URL for each visitor's policy.
|
|
29
|
+
mode: hosted(),
|
|
30
30
|
scripts: [
|
|
31
31
|
posthog({
|
|
32
32
|
id: 'phc_your_project_key',
|
|
@@ -48,11 +48,14 @@ export const Consent = ({ children }: { children: ReactNode }) => (
|
|
|
48
48
|
);
|
|
49
49
|
```
|
|
50
50
|
|
|
51
|
-
`
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
to the backend URL from your Inth project. To
|
|
55
|
-
|
|
51
|
+
`hosted()` from `c15t/react` asks the backend's `/init` for the visitor's
|
|
52
|
+
policy on each page load, and sends consent choices to the same backend. It
|
|
53
|
+
uses the backend URL `consentManifest()` read from `VITE_C15T_BACKEND_URL` or
|
|
54
|
+
`VITE_INTH_PROJECT_URL`. Set one to the backend URL from your Inth project. To
|
|
55
|
+
resolve a bundled policy in the browser instead, pass `manifest()` from
|
|
56
|
+
`c15t/react`; see
|
|
57
|
+
[rendering](../rendering.md#bundle-the-policy-at-build-time).
|
|
58
|
+
The Next.js and TanStack Start adapters export `ConsentRoot` instead, which wraps
|
|
56
59
|
this provider and passes it server-resolved state.
|
|
57
60
|
|
|
58
61
|
## Provider options
|
|
@@ -67,7 +70,7 @@ the provider to change them. `scripts`, `vendors`, `networkBlocker`,
|
|
|
67
70
|
|
|
68
71
|
| Option | Purpose |
|
|
69
72
|
| ----------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
70
|
-
| `mode` | Required. `
|
|
73
|
+
| `mode` | Required. `hosted()` for the backend's `/init`, `manifest()` for a bundled policy, `offline()` for local policies, all from `c15t/react`, or `custom()` for your own transport. See [consent modes](../../../concepts/modes.md) |
|
|
71
74
|
| `prefetch` | Server-resolved state, or a promise of it, from a framework adapter's server helper |
|
|
72
75
|
| `scripts` | Consent-gated vendor scripts. See [scripts and embeds](../scripts.md) |
|
|
73
76
|
| `vendors` | Vendors listed under their category with their own switch. See [vendor consent](../vendor-consent.md) |
|