@c15t/react 3.0.0-alpha.2 → 3.0.0-alpha.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (148) hide show
  1. package/AGENTS.md +6 -1
  2. package/dist/aggregate-components.js +1 -1
  3. package/dist/chunk-warming.js +1 -1
  4. package/dist/component-hooks/use-headless-iab-consent-ui.js +1 -1
  5. package/dist/component-hooks/use-panel-trigger.js +1 -1
  6. package/dist/components/consent-gate/consent-gate.js +1 -1
  7. package/dist/components/consent-preferences-link/consent-preferences-link.js +1 -1
  8. package/dist/components/iab-panel/atoms/purpose-item.js +1 -1
  9. package/dist/components/iab-panel/atoms/stack-item.js +1 -1
  10. package/dist/components/iab-panel/iab-panel.js +1 -1
  11. package/dist/components/iab-panel/index.js +1 -1
  12. package/dist/components/panel/atoms/overlay.js +1 -1
  13. package/dist/components/panel/atoms/root.js +1 -1
  14. package/dist/components/panel/index.js +1 -1
  15. package/dist/components/panel/panel.js +1 -1
  16. package/dist/components/panel-trigger/atoms/button.js +1 -1
  17. package/dist/components/panel-trigger/atoms/icon.js +1 -1
  18. package/dist/components/panel-trigger/atoms/root.js +1 -1
  19. package/dist/components/panel-trigger/atoms/trigger-icons.js +1 -0
  20. package/dist/components/panel-trigger/panel-trigger-toolbar.js +1 -1
  21. package/dist/components/preferences/atoms/accordion.js +1 -1
  22. package/dist/components/preferences/atoms/root.js +1 -1
  23. package/dist/components/preferences/atoms/vendor-list.js +1 -1
  24. package/dist/components/preferences/index.js +1 -1
  25. package/dist/components/prompt/policy-actions.js +1 -1
  26. package/dist/components/shared/primitives/button.js +1 -1
  27. package/dist/components/shared/ui/accordion/accordion.js +1 -1
  28. package/dist/components/shared/ui/collapsible/collapsible.js +1 -1
  29. package/dist/components/shared/ui/logo.js +1 -1
  30. package/dist/components/shared/ui/preference-item/preference-item.js +1 -1
  31. package/dist/components/shared/ui/switch/switch.js +1 -1
  32. package/dist/components/shared/ui/tabs/tabs.js +1 -1
  33. package/dist/consent-theme.js +1 -0
  34. package/dist/draft.js +1 -1
  35. package/dist/external-iab-context.js +1 -1
  36. package/dist/headless.js +1 -1
  37. package/dist/hooks/use-committed-ref.js +2 -0
  38. package/dist/hooks.js +1 -1
  39. package/dist/iab/styles.tw3.css +1 -41
  40. package/dist/iab-context.js +1 -1
  41. package/dist/index.js +1 -1
  42. package/dist/kernel-selector.js +1 -0
  43. package/dist/module-hooks/iframe-blocker.js +1 -1
  44. package/dist/module-hooks/network-blocker.js +1 -1
  45. package/dist/module-hooks/network-hold.js +2 -0
  46. package/dist/module-hooks/persistence.js +1 -1
  47. package/dist/panel.js +1 -1
  48. package/dist/preferences.js +1 -2
  49. package/dist/provider.js +1 -1
  50. package/dist/styles.tw3.css +0 -45
  51. package/dist/ui-save.js +1 -1
  52. package/dist/utils/deferred-module.js +1 -1
  53. package/dist/version.js +1 -1
  54. package/dist-types/chunk-warming.d.ts +41 -8
  55. package/dist-types/component-hooks/use-headless-iab-consent-ui.d.ts +1 -1
  56. package/dist-types/components/iab-panel/atoms/purpose-item.d.ts +4 -1
  57. package/dist-types/components/iab-panel/atoms/stack-item.d.ts +6 -1
  58. package/dist-types/components/iab-panel/index.d.ts +1 -0
  59. package/dist-types/components/panel/index.d.ts +1 -0
  60. package/dist-types/components/panel/panel.d.ts +1 -1
  61. package/dist-types/components/panel-trigger/atoms/trigger-icons.d.ts +20 -0
  62. package/dist-types/components/preferences/index.d.ts +1 -0
  63. package/dist-types/components/shared/ui/accordion/accordion.d.ts +1 -0
  64. package/dist-types/components/shared/ui/collapsible/collapsible.d.ts +1 -0
  65. package/dist-types/components/shared/ui/logo.d.ts +0 -10
  66. package/dist-types/components/shared/ui/preference-item/preference-item.d.ts +14 -0
  67. package/dist-types/components/shared/ui/switch/switch.d.ts +1 -0
  68. package/dist-types/components/shared/ui/tabs/tabs.d.ts +1 -0
  69. package/dist-types/consent-theme.d.ts +38 -0
  70. package/dist-types/draft.d.ts +43 -6
  71. package/dist-types/headless.d.ts +0 -1
  72. package/dist-types/hooks/use-committed-ref.d.ts +24 -0
  73. package/dist-types/hooks.d.ts +2 -0
  74. package/dist-types/index.d.ts +3 -2
  75. package/dist-types/kernel-selector.d.ts +66 -0
  76. package/dist-types/module-hooks/iframe-blocker.d.ts +27 -0
  77. package/dist-types/module-hooks/network-blocker.d.ts +23 -0
  78. package/dist-types/module-hooks/network-hold.d.ts +47 -0
  79. package/dist-types/panel.d.ts +13 -1
  80. package/dist-types/preferences.d.ts +12 -1
  81. package/dist-types/provider.d.ts +41 -8
  82. package/dist-types/ui-config-context.d.ts +2 -0
  83. package/dist-types/ui-save.d.ts +21 -1
  84. package/dist-types/utils/deferred-module.d.ts +3 -1
  85. package/dist-types/version.d.ts +1 -1
  86. package/docs/README.md +6 -1
  87. package/docs/customization/overview.md +4 -3
  88. package/docs/customization/recipes.md +4 -2
  89. package/docs/customization/tokens.md +66 -3
  90. package/docs/frameworks/react/components/consent-dialog.md +45 -6
  91. package/docs/frameworks/react/components/consent-gate.md +8 -4
  92. package/docs/frameworks/react/components/consent-manager-provider.md +34 -14
  93. package/docs/frameworks/react/components/consent-widget.md +9 -0
  94. package/docs/frameworks/react/concepts/consent-categories.md +8 -1
  95. package/docs/frameworks/react/hooks/{use-consent-manager/overview.md → overview.md} +7 -5
  96. package/docs/frameworks/react/iab/overview.md +121 -1
  97. package/docs/frameworks/react/network-blocker.md +146 -0
  98. package/docs/frameworks/react/script-loader.md +6 -0
  99. package/docs/frameworks/react/styling/overview.md +71 -22
  100. package/docs/guides/consent-state.md +327 -0
  101. package/docs/guides/shared-consent-controls.md +158 -0
  102. package/docs/integrations/adobe-analytics.md +1 -1
  103. package/docs/integrations/ahrefs-analytics.md +1 -1
  104. package/docs/integrations/amplitude.md +1 -1
  105. package/docs/integrations/clearbit.md +1 -1
  106. package/docs/integrations/cloudflare-web-analytics.md +1 -1
  107. package/docs/integrations/cloudflare-zaraz.md +1 -1
  108. package/docs/integrations/crisp.md +1 -1
  109. package/docs/integrations/databuddy.md +1 -1
  110. package/docs/integrations/fathom-analytics.md +1 -1
  111. package/docs/integrations/front-chat.md +322 -0
  112. package/docs/integrations/google-maps.md +1 -1
  113. package/docs/integrations/google-tag-manager.md +1 -1
  114. package/docs/integrations/google-tag.md +1 -1
  115. package/docs/integrations/granular-consent.md +3 -1
  116. package/docs/integrations/heap.md +1 -1
  117. package/docs/integrations/hightouch.md +1 -1
  118. package/docs/integrations/hotjar.md +1 -1
  119. package/docs/integrations/intercom.md +1 -1
  120. package/docs/integrations/linkedin-insights.md +1 -1
  121. package/docs/integrations/logrocket.md +1 -1
  122. package/docs/integrations/matomo-analytics.md +1 -1
  123. package/docs/integrations/meta-pixel.md +1 -1
  124. package/docs/integrations/microsoft-clarity.md +1 -1
  125. package/docs/integrations/microsoft-uet.md +1 -1
  126. package/docs/integrations/mixpanel-analytics.md +1 -1
  127. package/docs/integrations/one-dollar-stats.md +305 -0
  128. package/docs/integrations/openai-pixel.md +1 -1
  129. package/docs/integrations/overview.md +17 -14
  130. package/docs/integrations/pinterest-tag.md +321 -0
  131. package/docs/integrations/pirsch.md +1 -1
  132. package/docs/integrations/plausible-analytics.md +1 -1
  133. package/docs/integrations/posthog.md +1 -1
  134. package/docs/integrations/promptwatch.md +1 -1
  135. package/docs/integrations/reddit-pixel.md +1 -1
  136. package/docs/integrations/rudderstack.md +1 -1
  137. package/docs/integrations/rybbit-analytics.md +1 -1
  138. package/docs/integrations/segment.md +1 -1
  139. package/docs/integrations/snapchat-pixel.md +1 -1
  140. package/docs/integrations/tiktok-pixel.md +1 -1
  141. package/docs/integrations/umami-analytics.md +1 -1
  142. package/docs/integrations/vercel-analytics.md +1 -1
  143. package/docs/integrations/x-pixel.md +1 -1
  144. package/docs/integrations/youtube.md +1 -1
  145. package/docs/upgrade-v3.md +129 -1
  146. package/package.json +7 -7
  147. package/dist/component-hooks/use-manager.js +0 -2
  148. package/dist-types/component-hooks/use-manager.d.ts +0 -45
@@ -1,4 +1,4 @@
1
- import type { AllConsentNames, ConsentState, SaveResult, SaveInput } from '@c15t/core';
1
+ import type { AllConsentNames, ConsentKernel, ConsentState, SaveResult, SaveInput } from '@c15t/core';
2
2
  import type { ReactNode } from 'react';
3
3
  /** A local, unmasked selection, committed only by an explicit save. */
4
4
  export interface ConsentDraftHandle {
@@ -27,6 +27,28 @@ export interface ConsentDraftHandle {
27
27
  save: () => Promise<SaveResult>;
28
28
  reset: () => void;
29
29
  }
30
+ interface DraftSnapshot {
31
+ values: ConsentState;
32
+ displayedCategories: readonly AllConsentNames[];
33
+ vendors: Record<string, boolean>;
34
+ isDirty: boolean;
35
+ isStale: boolean;
36
+ }
37
+ declare const createDraftStore: (kernel: ConsentKernel, defaults?: Partial<ConsentState>) => {
38
+ acceptAll(): void;
39
+ connect(): import("@c15t/core").Unsubscribe;
40
+ getSnapshot: () => DraftSnapshot;
41
+ /** The kernel this draft reads from and saves into. */
42
+ kernel: ConsentKernel;
43
+ rejectAll(): void;
44
+ reset: () => void;
45
+ save(input?: SaveInput, categories?: readonly AllConsentNames[], onSuccess?: () => void): Promise<SaveResult>;
46
+ set(category: AllConsentNames, value: boolean): void;
47
+ setVendor(vendorId: string, granted: boolean): void;
48
+ subscribe(listener: () => void): () => void;
49
+ update: (patch: Partial<ConsentState>) => void;
50
+ };
51
+ type DraftStore = ReturnType<typeof createDraftStore>;
30
52
  export interface ConsentDraftProviderProps {
31
53
  children: ReactNode;
32
54
  /** Defaults apply only to categories without an explicit receipt. */
@@ -35,11 +57,25 @@ export interface ConsentDraftProviderProps {
35
57
  export declare const ConsentDraftProvider: ({ children, initial, }: ConsentDraftProviderProps) => import("react").JSX.Element;
36
58
  /** Internal UI save path shared by stock controls and headless actions. */
37
59
  export declare const useConsentSaveAction: () => (input?: SaveInput) => Promise<SaveResult>;
38
- /** Keep the compatibility manager selection and its save on the same draft. */
39
- export declare const useConsentManagerDraft: () => {
40
- draft: ConsentDraftHandle;
41
- save: (input?: SaveInput) => Promise<SaveResult>;
42
- };
60
+ /**
61
+ * The nearest consent draft store, for the stock preference rows. Pair with
62
+ * {@link useConsentDraftSlice} so a row re-renders only when its own slice
63
+ * changes, not on every staged edit elsewhere in the draft.
64
+ *
65
+ * @returns The shared draft store, or a local one outside a provider.
66
+ * @internal
67
+ */
68
+ export declare const useConsentDraftStore: () => DraftStore;
69
+ /**
70
+ * Subscribes to one slice of a consent draft store.
71
+ *
72
+ * @param store - Store from {@link useConsentDraftStore}.
73
+ * @param selector - Picks the slice. Return a primitive or a reference the
74
+ * draft already holds.
75
+ * @returns The selected slice.
76
+ * @internal
77
+ */
78
+ export declare const useConsentDraftSlice: <SliceType>(store: DraftStore, selector: (draft: DraftSnapshot) => SliceType) => SliceType;
43
79
  /** Read and edit displayed choices without replacing masked effective permissions. */
44
80
  export declare const useConsentDraft: () => ConsentDraftHandle;
45
81
  /** The vendor slice of the consent draft, for a custom vendor control. */
@@ -81,3 +117,4 @@ export interface VendorDraftHandle {
81
117
  * @public
82
118
  */
83
119
  export declare const useVendorDraft: () => VendorDraftHandle;
120
+ export {};
@@ -6,7 +6,6 @@
6
6
  */
7
7
  export { defaultTranslationConfig, detectBrowserLanguage, mergeTranslationConfigs, prepareTranslationConfig, } from '@c15t/core';
8
8
  export { type ConsentDialogTriggerVisibility, type UseConsentDialogTriggerOptions, type UseConsentDialogTriggerResult, useConsentDialogTrigger, } from './component-hooks/use-panel-trigger.js';
9
- export { useConsentManager } from './component-hooks/use-manager.js';
10
9
  export { type HeadlessConsentBannerAction, type HeadlessConsentBannerState, type HeadlessConsentDialogAction, type HeadlessConsentDialogState, type HeadlessConsentSurface, type HeadlessConsentSurfaceAction, type HeadlessConsentSurfaceState, type HeadlessConsentWriteAction, useHeadlessConsentUI, } from './component-hooks/use-headless-consent-ui.js';
11
10
  export { useTranslations } from './component-hooks/use-translations.js';
12
11
  export { useColorScheme } from './hooks/use-color-scheme.js';
@@ -0,0 +1,24 @@
1
+ /**
2
+ * A ref that holds `value` from the render React most recently committed.
3
+ *
4
+ * Consent guards use it to answer "is this still the kernel, draft or IAB
5
+ * selection this component renders?" when a kept callback runs, including
6
+ * from a descendant's layout effect in the very commit that switched
7
+ * runtimes.
8
+ *
9
+ * Why an insertion effect: React runs insertion effects while it applies a
10
+ * commit, before any layout effect of that commit, and never for a render it
11
+ * discards. Assigning the ref during render would publish values from
12
+ * renders React throws away (an interrupted concurrent render, StrictMode's
13
+ * second render). A layout effect is too late, because descendants' layout
14
+ * effects run before their ancestors'. A passive effect is later still.
15
+ * Assigning the committed value is idempotent, so StrictMode's replayed
16
+ * effects cannot leave a stale value behind.
17
+ *
18
+ * @param value - The value this render uses.
19
+ * @returns A ref whose `current` is the last committed `value`.
20
+ * @internal
21
+ */
22
+ export declare const useCommittedRef: <Value>(value: Value) => {
23
+ readonly current: Value;
24
+ };
@@ -65,6 +65,8 @@ export declare const useHasConsentPolicy: () => boolean;
65
65
  * {@link useHasConsentPolicy}.
66
66
  */
67
67
  export declare const useHasConsentUI: () => boolean;
68
+ /** Whether c15t or an external CMP offers a preferences control. */
69
+ export declare const useHasConsentPreferences: () => boolean;
68
70
  /**
69
71
  * Derived consent model (opt-in / opt-out / iab), or `null` while no policy
70
72
  * rule is resolved. The kernel keeps a safe fallback rule internally; this
@@ -48,13 +48,14 @@ export type { ConsentGateProps, FrameProps } from './components/consent-gate/ind
48
48
  export { ConsentGate, Frame } from './components/consent-gate/index.js';
49
49
  export type { ConsentDraftHandle, ConsentDraftProviderProps, VendorDraftHandle, } from './draft.js';
50
50
  export { ConsentDraftProvider, useConsentDraft, useVendorDraft } from './draft.js';
51
- export { useConsentManager } from './component-hooks/use-manager.js';
52
51
  export { useTranslations } from './component-hooks/use-translations.js';
53
- export { useActiveUI, useBranding, useConsent, useConsents, useHasConsentPolicy, useHasConsentUI, useIABEnabled, useIABSnapshot, useIdentify, useInit, useLocation, useModel, useOverrides, usePromptPresentation, usePolicyCategories, usePreferencesPresentation, usePolicyScopeMode, usePurposeConsent, useSaveConsents, useSetActiveUI, useSetLanguage, useSetOverrides, useSnapshot, useSpecialFeatureOptIn, useTCString, useUser, useDeclaredVendors, useVendorAllowed, useVendorChoice, useVendorConsent, } from './hooks.js';
52
+ export { useActiveUI, useBranding, useConsent, useConsents, useHasConsentPolicy, useHasConsentPreferences, useHasConsentUI, useIABEnabled, useIABSnapshot, useIdentify, useInit, useLocation, useModel, useOverrides, usePromptPresentation, usePolicyCategories, usePreferencesPresentation, usePolicyScopeMode, usePurposeConsent, useRegisterConsentCategories, useSaveConsents, useSetActiveUI, useSetLanguage, useSetOverrides, useSnapshot, useSpecialFeatureOptIn, useSubscribeToConsentChanges, useTCString, useUser, useDeclaredVendors, useVendorAllowed, useVendorChoice, useVendorConsent, } from './hooks.js';
54
53
  export type { UseIframeBlockerOptions, UseNetworkBlockerOptions, UsePersistenceOptions, UseScriptLoaderOptions, } from './module-hooks.js';
55
54
  export { useIframeBlocker, useNetworkBlocker, usePersistence, useScriptLoader, } from './module-hooks.js';
56
55
  export type { ConsentProviderOptions, ConsentProviderCallbacks, ConsentProviderPrefetch, ConsentProviderProps, ExternalRuntimeProviderOptions, ExternalRuntimeProviderProps, OwnedRuntimeProviderProps, } from './provider.js';
57
56
  export { ConsentProvider } from './provider.js';
57
+ export { ConsentTheme } from './consent-theme.js';
58
+ export type { ConsentThemeProps } from './consent-theme.js';
58
59
  export type { ReactUIOptions } from './types/manager.js';
59
60
  export { defineTheme, type Theme } from './types/theme/index.js';
60
61
  export { useExplicitChoice, useEffectivePermissions, usePromptRequirement, useNoticeDismissal, usePrivacySignals, useOptOutDirectives, usePolicyResolution, usePolicyRule, useRestrictions, useDismissNotice, } from './hooks.js';
@@ -0,0 +1,66 @@
1
+ /**
2
+ * Kernel access for the hooks and the stock components. The component
3
+ * selectors below each read a single derived value, so a component
4
+ * re-renders only when that value changes. Not exported from any package
5
+ * entry.
6
+ *
7
+ * @packageDocumentation
8
+ * @internal
9
+ */
10
+ import type { AllConsentNames, ConsentKernel, ConsentSnapshot } from '@c15t/core';
11
+ /**
12
+ * Reads the kernel from the nearest provider.
13
+ *
14
+ * @returns The provider's kernel.
15
+ * @throws {Error} When called outside a `ConsentProvider`.
16
+ * @internal
17
+ */
18
+ export declare const useKernel: () => ConsentKernel;
19
+ /**
20
+ * Subscribes to one slice of the kernel snapshot. React re-renders the
21
+ * caller only when the selected value `Object.is`-differs, so a selector
22
+ * must return a primitive or a reference the snapshot already holds.
23
+ *
24
+ * @param selector - Picks the slice from a snapshot.
25
+ * @returns The selected slice.
26
+ * @internal
27
+ */
28
+ export declare const useKernelSelector: <SliceType>(selector: (snap: ConsentSnapshot) => SliceType) => SliceType;
29
+ /**
30
+ * Like `useKernelSelector`, for selectors that evaluate a gate at a point in
31
+ * time. The server render and hydration evaluate at the snapshot's own
32
+ * `evaluatedAt`, so they never read the clock: a Next.js `cacheComponents`
33
+ * prerender rejects `Date.now()` in a Client Component. In the browser the
34
+ * gate is evaluated at `Date.now()`, so an expiry the kernel's deadline
35
+ * timer has not processed yet still denies.
36
+ *
37
+ * @param selector - Picks the slice from a snapshot at the given time.
38
+ * @returns The selected slice.
39
+ * @internal
40
+ */
41
+ export declare const useGateSelector: <SliceType>(selector: (snap: ConsentSnapshot, now: number) => SliceType) => SliceType;
42
+ /**
43
+ * Whether content gated on one category may render, with the kernel's gate
44
+ * semantics. Server rendering and hydration read no clock; see
45
+ * `useGateSelector`.
46
+ *
47
+ * @param category - Category the content needs.
48
+ * @returns `true` while the category is permitted.
49
+ * @internal
50
+ */
51
+ export declare const useCategoryAllowed: (category: AllConsentNames) => boolean;
52
+ /**
53
+ * Language of the active translation bundle.
54
+ *
55
+ * @returns The bundle's language, or the default language before one loads.
56
+ * @internal
57
+ */
58
+ export declare const useTranslationLanguage: () => string;
59
+ /**
60
+ * Categories the preference surface lists: `necessary` plus the recorded
61
+ * choice scope, or the policy scope when no choice scope applies.
62
+ *
63
+ * @returns A list whose identity changes only when the scope does.
64
+ * @internal
65
+ */
66
+ export declare const useDisplayedCategories: () => readonly AllConsentNames[];
@@ -1,6 +1,33 @@
1
+ import type { ConsentKernel } from '@c15t/core';
1
2
  import type { IframeBlockerHandle } from '@c15t/core/modules/iframe-blocker';
2
3
  export interface UseIframeBlockerOptions {
3
4
  disableAutomaticBlocking?: boolean;
4
5
  }
5
6
  export declare const useIframeBlocker: (options?: UseIframeBlockerOptions) => IframeBlockerHandle;
7
+ /**
8
+ * Call `onFound` when a gated iframe is on the page: at once when one is
9
+ * there already, and again for each batch of gated frames that arrives.
10
+ *
11
+ * Until the returned stop function runs, a gated frame that arrives with a
12
+ * `src` the snapshot does not clearly allow is paused (`src` moved to
13
+ * `data-src`), as the loaded blocker would pause it. Frames on the page at
14
+ * the first call are left to the blocker, which is what happens when it
15
+ * loads with the provider.
16
+ *
17
+ * @param kernel - The kernel whose snapshot decides what is clearly allowed.
18
+ * @param onFound - Called for every sighting; the caller dedupes.
19
+ * @returns Stops watching.
20
+ * @internal
21
+ */
22
+ export declare const watchGatedIframes: (kernel: ConsentKernel, onFound: () => void) => () => void;
23
+ /**
24
+ * The provider's default iframe blocker. Loads the blocker module when the
25
+ * first gated iframe (`data-category` or `data-vendor`) is on the page
26
+ * instead of on every mount, so pages without one never download it.
27
+ *
28
+ * @param options - Blocker options. With `disableAutomaticBlocking` the
29
+ * module loads at once, as it did before.
30
+ * @internal
31
+ */
32
+ export declare const useIframeBlockerOnDemand: (options?: UseIframeBlockerOptions) => void;
6
33
  export type { IframeBlockerHandle };
@@ -5,5 +5,28 @@ export interface UseNetworkBlockerOptions {
5
5
  logBlockedRequests?: boolean;
6
6
  onRequestBlocked?: (info: BlockedRequestInfo) => void;
7
7
  }
8
+ /**
9
+ * Block `fetch` and XHR requests that match `rules` until the visitor's
10
+ * consent allows them.
11
+ *
12
+ * Blocking starts during the first render in the browser: matching requests
13
+ * wait from then on, including ones sent from this component's children's
14
+ * mount effects and from effects that run before this component's. The
15
+ * blocker loads after mount and decides each waiting request. On the
16
+ * server the hook does nothing.
17
+ *
18
+ * Rendering has a side effect: the first render patches `fetch` and
19
+ * `XMLHttpRequest` to hold matching requests. If React discards that
20
+ * render and never commits it, the hold ends after 10 seconds. Nothing
21
+ * checked consent for the requests it held, so they fail as blocked: a 451
22
+ * response for `fetch`, a failed XHR.
23
+ *
24
+ * Prefer the provider's `networkBlocker` option. It starts blocking when
25
+ * the provider renders, so it also covers components rendered before this
26
+ * one.
27
+ *
28
+ * @param options - Rules and logging options.
29
+ * @returns A handle to update rules or toggle blocking.
30
+ */
8
31
  export declare const useNetworkBlocker: (options: UseNetworkBlockerOptions) => NetworkBlockerHandle;
9
32
  export type { BlockedRequestInfo, NetworkBlockerHandle, NetworkBlockerRule };
@@ -0,0 +1,47 @@
1
+ import type { NetworkBlockerRule } from '@c15t/core/modules/network-blocker';
2
+ import type { NetworkHold } from '@c15t/core/modules/network-hold';
3
+ /**
4
+ * How long a hold started during render waits for its component to commit.
5
+ * A render React throws away never commits, so nothing else would end its
6
+ * hold. When this runs out the hold ends, and since nothing checked consent
7
+ * for the requests it held, they get the blocker's answer for a blocked
8
+ * request instead of being sent.
9
+ * @internal
10
+ */
11
+ export declare const UNCOMMITTED_HOLD_MS = 10000;
12
+ /**
13
+ * The render-time hold behind one network blocker mount.
14
+ * @internal
15
+ */
16
+ export interface EarlyNetworkHold {
17
+ /**
18
+ * Call from the mount effect, before loading the blocker. Keeps the hold
19
+ * from expiring, starts a new one if it already ended (a StrictMode or
20
+ * kernel re-run after the blocker took over, or a commit that came after
21
+ * the expiry), and returns it for `createNetworkBlocker({ hold })`. A
22
+ * disabled blocker gets a hold that holds nothing, so it cannot end
23
+ * another caller's hold.
24
+ */
25
+ claim: (rules: readonly NetworkBlockerRule[], enabled: boolean | undefined) => NetworkHold;
26
+ /**
27
+ * Call from the mount effect's cleanup. Ends a hold no blocker took
28
+ * over, unless the effect runs again first (StrictMode, a kernel change).
29
+ * Nothing checked consent for what that hold held, so those requests get
30
+ * the blocker's answer for a blocked request instead of being sent.
31
+ */
32
+ unmount: () => void;
33
+ }
34
+ /**
35
+ * Hold requests matching `rules` from this component's first render in the
36
+ * browser, before any child renders or runs an effect. The network blocker
37
+ * loads after mount and takes the hold over.
38
+ *
39
+ * Rendering is not side-effect free: the first render patches `fetch` and
40
+ * `XMLHttpRequest`. That is safe because the hold only delays matching
41
+ * requests, a render React discards ends its hold after
42
+ * {@link UNCOMMITTED_HOLD_MS} (failing what it held as blocked), and on the
43
+ * server it does nothing.
44
+ *
45
+ * @internal
46
+ */
47
+ export declare const useEarlyNetworkHold: (rules: readonly NetworkBlockerRule[], enabled: boolean | undefined) => EarlyNetworkHold;
@@ -1 +1,13 @@
1
- export * from './components/panel/index.js';
1
+ /**
2
+ * `@c15t/react/consent-dialog`: the deferred `ConsentDialog`, the same
3
+ * component the `@c15t/react` entry exports. Its implementation and styles
4
+ * load when the dialog first opens, or earlier when something preloads it,
5
+ * so importing this entry adds nothing heavy to the first load.
6
+ *
7
+ * The eager dialog and its individual parts (`Card`, `Header`, `Overlay`,
8
+ * ...) are in `@c15t/react/components/consent-dialog`.
9
+ *
10
+ * @packageDocumentation
11
+ */
12
+ export { ConsentDialog } from './aggregate-components.js';
13
+ export type { ConsentDialogCompoundComponent, ConsentDialogProps, } from './components/panel/index.js';
@@ -1 +1,12 @@
1
- export * from './components/preferences/index.js';
1
+ /**
2
+ * `@c15t/react/consent-widget`: the deferred `ConsentWidget`, the same
3
+ * component the `@c15t/react` entry exports. Its implementation and styles
4
+ * load when the widget first renders.
5
+ *
6
+ * The eager widget and its individual parts (`Accordion`, `Switch`, `Footer`,
7
+ * ...) are in `@c15t/react/components/consent-widget`.
8
+ *
9
+ * @packageDocumentation
10
+ */
11
+ export { ConsentWidget } from './aggregate-components.js';
12
+ export type { ConsentWidgetCompoundComponent, ConsentWidgetProps, } from './components/preferences/index.js';
@@ -1,16 +1,17 @@
1
1
  import type { AllConsentNames, ClearOnRevocationConfig, ConsentPresentation, Callbacks, I18nConfig, KernelConfig, KernelOverrides, KernelUser, LegalLinks, ProviderTransportFactory, StorageConfig, User, Vendor } from '@c15t/core';
2
2
  import type { Script } from '@c15t/core/modules/script-loader';
3
- import type { ConsentRuntime } from '@c15t/core/runtime';
3
+ import type { ConsentControlOptions, ConsentRuntime } from '@c15t/core/runtime';
4
4
  import type { ReactNode } from 'react';
5
+ import type { DialogPreload } from './chunk-warming.js';
5
6
  import type { UseNetworkBlockerOptions, UsePersistenceOptions, UseScriptLoaderOptions } from './module-hooks.js';
6
7
  import type { UseIframeBlockerOptions } from './module-hooks/iframe-blocker.js';
7
8
  import type { ReactUIOptions } from './types/manager.js';
8
9
  import type { ReactComponentSlots } from './types/slots.js';
9
10
  /** Events emitted by the mounted provider without snapshot-derived consent aliases. */
10
- export type ConsentProviderCallbacks = Pick<Callbacks, 'onChoiceRecorded' | 'onPermissionsChanged' | 'onError'>;
11
+ export type ConsentProviderCallbacks = Pick<Callbacks, 'onChoiceRecorded' | 'onPermissionsChanged' | 'onError' | 'onBeforeConsentRevocationReload'>;
11
12
  /** Prepared policy and records; legacy consent projections are not provider inputs. */
12
13
  export type ConsentProviderPrefetch = Omit<KernelConfig, 'initialDraft' | 'transport'>;
13
- export interface ConsentProviderOptions extends Pick<ReactUIOptions, 'colorScheme' | 'disableAnimation' | 'noStyle' | 'scrollLock' | 'theme' | 'trapFocus'> {
14
+ export interface ConsentProviderOptions extends ConsentControlOptions, Pick<ReactUIOptions, 'colorScheme' | 'disableAnimation' | 'noStyle' | 'scrollLock' | 'theme' | 'trapFocus'> {
14
15
  enabled?: boolean;
15
16
  presentation?: ConsentPresentation;
16
17
  /**
@@ -18,9 +19,10 @@ export interface ConsentProviderOptions extends Pick<ReactUIOptions, 'colorSchem
18
19
  *
19
20
  * @remarks
20
21
  * Set this when your CSP uses a nonce-based policy instead of
21
- * `'unsafe-inline'`. The provider forwards it to the injected theme
22
- * `<style>` element and to every `<script>` element created by the
23
- * script loader. A per-script `nonce` still takes precedence.
22
+ * `'unsafe-inline'`. The provider forwards it to every `<script>`
23
+ * element created by the script loader. A per-script `nonce` still takes
24
+ * precedence. Pass the same nonce to `ConsentTheme`, which renders the
25
+ * theme `<style>` element.
24
26
  */
25
27
  nonce?: string;
26
28
  /**
@@ -83,6 +85,15 @@ export interface ConsentProviderOptions extends Pick<ReactUIOptions, 'colorSchem
83
85
  * Initial-only: remount the provider to replace its cleanup configuration.
84
86
  */
85
87
  clearOnRevocation?: ClearOnRevocationConfig;
88
+ /**
89
+ * Reload the page after an accept, reject or save turns off a category or
90
+ * vendor that was granted, or after a `consentSource` withdraws one.
91
+ * Removing a script cannot stop code that already ran, so the reload
92
+ * starts a document with only permitted code. Waits for the save request.
93
+ * Set `false` to handle revocation yourself.
94
+ * @default true
95
+ */
96
+ reloadOnConsentRevoked?: boolean;
86
97
  scripts?: Script[];
87
98
  /**
88
99
  * Vendors offered for vendor-level consent outside IAB. Each sits inside a
@@ -94,7 +105,12 @@ export interface ConsentProviderOptions extends Pick<ReactUIOptions, 'colorSchem
94
105
  vendors?: Vendor[];
95
106
  scriptLoader?: UseScriptLoaderOptions;
96
107
  networkBlocker?: UseNetworkBlockerOptions | false;
97
- /** Discover and gate DOM iframes with data-category. Enabled by default. */
108
+ /**
109
+ * Discover and gate DOM iframes with data-category. Enabled by default.
110
+ * The blocker loads when the first gated iframe is on the page; until it
111
+ * runs, a gated iframe that arrives with a `src` consent does not allow
112
+ * is paused.
113
+ */
98
114
  iframeBlocker?: UseIframeBlockerOptions | false;
99
115
  persistence?: boolean | UsePersistenceOptions;
100
116
  i18n?: Partial<I18nConfig>;
@@ -103,6 +119,21 @@ export interface ConsentProviderOptions extends Pick<ReactUIOptions, 'colorSchem
103
119
  /** Per-component slot attribute overrides (shared contract with @c15t/vue). */
104
120
  components?: ReactComponentSlots;
105
121
  legalLinks?: LegalLinks;
122
+ /**
123
+ * When the deferred `<ConsentDialog />` starts loading before it opens.
124
+ *
125
+ * - `'idle'` (default): after the page's load event, in browser idle time,
126
+ * while the banner is shown or a button that opens the dialog is
127
+ * mounted, and on hover or focus of such a button. Skipped when the
128
+ * visitor has Save-Data on or a 2G-class connection.
129
+ * - `'intent'`: only on hover or focus of a button that opens the dialog.
130
+ *
131
+ * Neither loads the dialog on a visit that shows no banner and has no
132
+ * dialog trigger.
133
+ *
134
+ * @default 'idle'
135
+ */
136
+ preloadDialog?: DialogPreload;
106
137
  /**
107
138
  * Adapter package name reported by `window.c15t`.
108
139
  * @internal
@@ -149,7 +180,9 @@ export type ConsentProviderProps = OwnedRuntimeProviderProps | ExternalRuntimePr
149
180
  * Pass `runtime` to render a runtime someone else created. The provider
150
181
  * then borrows its kernel and mounts none of the side-effecting modules —
151
182
  * no second `init()`, no second persistence handle, no second `window.c15t`
152
- * — and does not dispose it on unmount.
183
+ * — and does not dispose it on unmount. Handing it a different runtime
184
+ * switches the tree to that runtime's kernel; switching between a borrowed
185
+ * runtime and a provider-built kernel still needs a remount.
153
186
  *
154
187
  * @example
155
188
  * ```tsx
@@ -1,9 +1,11 @@
1
1
  import type { LegalLinks, ConsentPresentation } from '@c15t/core';
2
+ import type { DialogPreload } from './chunk-warming.js';
2
3
  import type { ReactComponentSlots } from './types/slots.js';
3
4
  export interface V3UIConfigValue {
4
5
  components?: ReactComponentSlots;
5
6
  presentation?: ConsentPresentation;
6
7
  legalLinks?: LegalLinks;
8
+ preloadDialog?: DialogPreload;
7
9
  }
8
10
  export declare const V3UIConfigContext: import("react").Context<V3UIConfigValue>;
9
11
  export declare const useUIConfig: () => V3UIConfigValue;
@@ -1,5 +1,25 @@
1
1
  import type { ConsentKernel, SaveResult } from '@c15t/core';
2
2
  /** Explicit navigation supersedes a pending UI action, even to the same dialog. */
3
3
  export declare const invalidateConsentUIAction: (kernel: ConsentKernel) => void;
4
- /** Keep an open preferences dialog available until its own save succeeds. */
4
+ /**
5
+ * Close the preferences dialog as soon as its choice is recorded locally.
6
+ *
7
+ * The kernel commits the receipt and updates permissions synchronously, so
8
+ * the dialog closes in the task that handled the click. Storage is written
9
+ * one task later, still ahead of the request, and the request runs after:
10
+ * its outcome never reopens the dialog, and a failed request stays queued
11
+ * for replay by the kernel. A save that recorded nothing (an unchanged
12
+ * selection) closes when it resolves successfully, unless explicit
13
+ * navigation or a newer action came first.
14
+ */
5
15
  export declare const saveConsentUI: (kernel: ConsentKernel, save: () => Promise<SaveResult>, canClose: () => boolean) => Promise<SaveResult>;
16
+ /**
17
+ * Close an IAB surface in the task that handled the click.
18
+ *
19
+ * An IAB choice commits once its TC string is encoded, which can wait on the
20
+ * TCF library chunk but never on the backend. The surface closes first and
21
+ * comes back only when that local step recorded nothing (the vendor list
22
+ * failed to load, or the policy changed underneath), so the visitor can try
23
+ * again. A failed backend request never reopens it.
24
+ */
25
+ export declare const saveIABConsentUI: (kernel: ConsentKernel, save: () => Promise<void> | void) => Promise<void>;
@@ -1,7 +1,9 @@
1
1
  import type { ComponentType } from 'react';
2
2
  /**
3
- * Share an on-demand module across exports and intent preloading. Ready client
3
+ * Share an on-demand module across exports and preloading. Ready client
4
4
  * retries run synchronously; Suspense retains server rendering and hydration.
5
+ * A failed import is cached for rendered exports only, so a failed preload
6
+ * does not stop a later open from retrying.
5
7
  *
6
8
  * @internal
7
9
  */
@@ -1 +1 @@
1
- export declare const version = "3.0.0-alpha.2";
1
+ export declare const version = "3.0.0-alpha.3";
package/docs/README.md CHANGED
@@ -32,8 +32,9 @@ These docs describe v3. Start with Inth hosted setup, identify the framework, ro
32
32
  - [Consent categories](./frameworks/react/concepts/consent-categories.md): Assign optional features to categories and understand how policy scope affects permission.
33
33
  - [Policy presets](./frameworks/react/concepts/policy-presets.md): Understand how policy rules affect React prompts, permissions and persistent privacy controls.
34
34
  - [Headless](./frameworks/react/headless.md): Build a custom consent banner in React with the c15t/react/headless hooks inside your ConsentProvider.
35
- - [Hooks](./frameworks/react/hooks/use-consent-manager/overview.md): Gate features and save consent choices in React components with the focused hooks exported from c15t/react.
35
+ - [Hooks](./frameworks/react/hooks/overview.md): Gate features and save consent choices in React components with the focused hooks exported from c15t/react.
36
36
  - [IAB TCF](./frameworks/react/iab/overview.md): Mount the IAB TCF banner and dialog inside a React ConsentProvider and configure the CMP ID, policy and vendor data.
37
+ - [Block network requests](./frameworks/react/network-blocker.md): Block fetch and XHR calls to third-party domains in a React app until the visitor grants their consent category.
37
38
  - [Quickstart](./frameworks/react/quickstart.md): Connect a React application to Inth and add consent UI, persistence and a preferences link.
38
39
  - [Load scripts with consent](./frameworks/react/script-loader.md): Register vendor scripts once and let effective permissions control loading.
39
40
  - [Styling](./frameworks/react/styling/overview.md): Import the React stylesheet and theme c15t components with tokens, slots, and class names on ConsentProvider.
@@ -44,6 +45,7 @@ These docs describe v3. Start with Inth hosted setup, identify the framework, ro
44
45
  - [Understand consent state](./guides/consent-state.md): Distinguish policy resolution, effective permissions, explicit choices, notices and privacy signals.
45
46
  - [Data fetching and transports](./guides/data-fetching.md): Choose cached manifests, backend init or offline policy resolution, and understand where consent records are saved.
46
47
  - [Choose a deployment mode](./guides/deployment-modes.md): Choose who runs your consent backend, then select manifest, init or offline resolution for your deployment.
48
+ - [Share consent controls across frameworks](./guides/shared-consent-controls.md): Use the same c15t script lifecycle, external consent source, and event controls in every framework.
47
49
  - [Troubleshoot consent](./guides/troubleshooting.md): Diagnose missing banners, early vendor requests, lost choices and hydration differences.
48
50
  - [Verify consent before shipping](./guides/verify-consent.md): Test requests, policy resolution, persistence, navigation and preference changes in a production build.
49
51
 
@@ -68,6 +70,7 @@ These docs describe v3. Start with Inth hosted setup, identify the framework, ro
68
70
  - [Crisp](./integrations/crisp.md): Configure Crisp with c15t v3, understand functionality permission and verify loading and revocation.
69
71
  - [Databuddy](./integrations/databuddy.md): Configure Databuddy's initial and updated consent state with c15t v3.
70
72
  - [Fathom Analytics](./integrations/fathom-analytics.md): Configure Fathom Analytics with c15t v3, understand measurement permission and verify loading and revocation.
73
+ - [Front Chat](./integrations/front-chat.md): Load the Front Chat widget with functionality permission, forward CSP nonces and clear the session on revocation.
71
74
  - [Google Maps](./integrations/google-maps.md): Prevent a map iframe from mounting before the required permission.
72
75
  - [Google Tag](./integrations/google-tag.md): Configure gtag with c15t Consent Mode signals and understand its loading behavior.
73
76
  - [Google Tag Manager](./integrations/google-tag-manager.md): Load GTM with c15t consent signals and verify the tags inside your container.
@@ -83,8 +86,10 @@ These docs describe v3. Start with Inth hosted setup, identify the framework, ro
83
86
  - [Microsoft Clarity](./integrations/microsoft-clarity.md): Configure Microsoft Clarity with c15t v3, understand measurement permission and verify loading and revocation.
84
87
  - [Microsoft UET](./integrations/microsoft-uet.md): Configure Microsoft UET with c15t v3, understand marketing permission and verify loading and revocation.
85
88
  - [Mixpanel](./integrations/mixpanel-analytics.md): Configure Mixpanel with c15t v3, understand measurement permission and verify loading and revocation.
89
+ - [OneDollarStats](./integrations/one-dollar-stats.md): Load the OneDollarStats tracker with measurement permission, forward its settings and verify loading and revocation.
86
90
  - [OpenAI Pixel](./integrations/openai-pixel.md): Configure the OpenAI Measurement Pixel for ChatGPT Ads with c15t v3, manage marketing permission and verify conversion delivery.
87
91
  - [Overview](./integrations/overview.md): Find all c15t integrations for analytics, tag managers, advertising, chat and embedded content.
92
+ - [Pinterest Tag](./integrations/pinterest-tag.md): Configure the Pinterest Tag with c15t v3, track typed events and verify marketing permission, revocation and reload.
88
93
  - [Pirsch](./integrations/pirsch.md): Configure Pirsch with c15t v3, understand measurement permission and verify loading and revocation.
89
94
  - [Plausible Analytics](./integrations/plausible-analytics.md): Configure Plausible Analytics with c15t v3, understand measurement permission and verify loading and revocation.
90
95
  - [PostHog](./integrations/posthog.md): Choose PostHog loading and cookieless behavior, configure the region, and synchronize v3 permissions.
@@ -34,10 +34,11 @@ layout can be restored by the policy renderer.
34
34
  ## Use the adapter's configuration shape
35
35
 
36
36
  React and Next.js accept provider `theme`, `presentation` and `components`
37
- options. Vue and Nuxt expose their own shared configuration, including CSS
37
+ options, and render theme tokens with `ConsentTheme` on the server. Vue and Nuxt expose their own shared configuration, including CSS
38
38
  `tokens` and component slots. Svelte accepts its provider options and theme
39
- contract. Astro serializes integration options and uses the selected adapter for
40
- dialogs. Do not move a configuration object between frameworks without checking
39
+ slots; SvelteKit renders the token CSS from a server `load`. Astro serializes
40
+ integration options, renders the theme tokens on the server and uses the
41
+ selected adapter for dialogs. Do not move a configuration object between frameworks without checking
41
42
  the target types.
42
43
 
43
44
  Read [tokens and CSS](./tokens.md),
@@ -26,8 +26,10 @@ export const brandTheme = defineTheme({
26
26
 
27
27
  ```
28
28
 
29
- Install `@c15t/ui` to use `defineTheme` directly. Pass `brandTheme` as `theme` in
30
- your existing React or Next.js provider options. Keep your Inth mode and script
29
+ Install `@c15t/ui` to use `defineTheme` directly. Render
30
+ `<ConsentTheme theme={brandTheme} />` on the server for the tokens, and pass
31
+ `brandTheme` as `theme` in your existing React or Next.js provider options for
32
+ the action styles. Keep your Inth mode and script
31
33
  configuration. The theme source above is also imported by the runnable example,
32
34
  so the rendered result and the documentation use the same values.
33
35