@c15t/react 3.0.0-alpha.8 → 3.0.0

package/docs/frameworks/react/vendor-consent.md

@@ -22,6 +22,10 @@ TC string instead; see [IAB TCF](./iab.md).
 
 ## Declare the vendors
 
+Built-in `@c15t/integrations` helpers already list their vendor by name, so
+you only declare a vendor for a script of your own, or to replace a helper's
+name and privacy policy.
+
 Declare the vendors next to the scripts in `src/scripts.ts`, using the `vendor`
 slug each script already carries:
 
@@ -66,11 +70,19 @@ helper sets `vendor` to its script ID, so `xPixel()` is `x-pixel`, `gtag()`
 is `gtag` and `cloudflareZaraz()` is `cloudflare-zaraz`. Each
 [vendor guide](../../integrations/overview.md) names its slug.
 
-Declaring a helper's vendor is optional. Without a declaration the script
-still loads with its category, but the dialog has no switch for it. In
-development, c15t logs a console warning that names the slug, so you can
-declare it if visitors should be able to turn it off. Production builds
-skip the warning.
+You don't need to declare a helper's vendor. Each helper also sets
+`vendorDetails` on its script: the vendor's name, privacy policy, homepage
+and legal entity. The dialog lists the vendor with its own switch from
+those. Declare the vendor in `vendors` to replace them, for example to link
+your own data processing notice, or when you self-host a tool such as
+Matomo, Umami, Plausible or PostHog and the vendor's privacy policy doesn't
+cover your install. A declaration replaces `vendorDetails` as a whole and
+doesn't merge with it.
+
+Your own scripts can set `vendorDetails` too. A script with a `vendor` slug
+and no `name` and `privacyPolicyUrl` from any source still loads with its
+category, but the dialog has no switch for it. In development, c15t logs a
+console warning that names the slug. Production builds skip the warning.
 
 A self-hosted backend can declare vendors too. `/init` returns them and c15t
 merges them with the vendors in code. When both declare the same `id`, the
@@ -165,8 +177,8 @@ the same as withdrawing a category, so code the vendor already ran stops.
 Test the production build in a private window with DevTools Network open and
 filtered to `ads-twitter.com`:
 
-1. Declare `x-pixel` and register `xPixel()`. Open Privacy settings. The
-   marketing row lists X Pixel with a switch.
+1. Register `xPixel()`. Open Privacy settings. The marketing row lists X
+   Pixel with a switch.
 2. Allow marketing and save. `uwt.js` loads.
 3. Open Privacy settings, switch X Pixel off and save. c15t reloads the
    page. After the reload there is no `uwt.js` request, and other marketing

package/docs/guides/banner-experiments.md

@@ -32,9 +32,7 @@ import type { ReactNode } from 'react';
 
 import { scripts } from './scripts';
 
-import 'c15t/react/styles.css';
-
-const mode = hosted({ url: 'https://your-project.inth.app' });
+const mode = hosted({ backendURL: 'https://your-project.inth.app' });
 
 // `control` is the stock banner. `wall` blocks the page until the visitor
 // chooses.
@@ -258,7 +256,6 @@ import { resolveConsent } from 'c15t/next/server';
 import { Suspense } from 'react';
 import type { ReactNode } from 'react';
 
-import { consentOptions } from '@/c15t.server';
 import { ExperimentConsent } from '@/components/experiment-consent';
 import { bannerExperiment } from '@/lib/experiment';
 import { bannerExperimentFlag } from '@/lib/flags';
@@ -268,7 +265,6 @@ import '@/styles/globals.css';
 const ResolvedConsent = async ({ children }: { children: ReactNode }) => {
 	const arm = await bannerExperimentFlag();
 	const state = await resolveConsent({
-		...consentOptions,
 		// `off` keeps this visitor out of the experiment.
 		experiment: arm === 'off' ? undefined : { ...bannerExperiment, arm },
 	});
@@ -401,6 +397,22 @@ arm re-assigns only the visitors who were in it. For a clean analysis, change
 Built-in assignment is not available in Astro; see
 [Astro](#astro).
 
+A Vite app's early `/init` script, from `consentManifest()`, picks the arm
+the same way when you pass it the experiment, and the app then runs that
+arm. Import the same object into `vite.config.ts`:
+
+```ts title="vite.config.ts"
+consentManifest({ initPrefetch: { experiment: bannerExperiment } });
+```
+
+Without it, the app sends its own `/init` for visitors who have not chosen
+yet. The same goes for `consentPrefetchHead` in TanStack Start and
+`buildPrefetchScript` elsewhere, which take the same `experiment` option.
+
+When a feature flag picks the arm, leave `experiment` out of
+`initPrefetch`. The script would pick its own arm and send it to the
+backend, and the app would then send a second `/init` with the flag's arm.
+
 ## Acknowledge presentation diagnostics
 
 Each arm is resolved under the visitor's policy the same way `presentation`
@@ -494,11 +506,12 @@ owed to, and how many of them accepted. c15t sends both to the backend on
 its own; you do not wire anything up.
 
 * **Visitors owed the banner.** While a visitor has no stored choice, every
-  `/init` carries their arm in an `x-c15t-experiment: <id>=<arm>` header,
-  and the backend puts it on that request's session report as
+  `/init` carries their arm as `<id>=<arm>` in the `experiment` query
+  parameter, and the backend puts it on that request's session report as
   `experiment: { id, arm }`. In manifest mode, the server render or the
   init route puts it on the report it sends to `POST /sessions`. A visitor
-  who already chose is not shown the banner, so is not counted.
+  who already chose is not shown the banner, so is not counted. A
+  server-to-server caller can send the `x-c15t-experiment` header instead.
 * **Choices.** Every choice saved through `POST /subjects` carries the arm
   in `metadata.experiment`, as above.
 

package/docs/guides/troubleshooting.md

@@ -1,8 +1,8 @@
 ---
 title: Troubleshooting
 description: Fix a missing banner, analytics that load before consent, choices
-  lost on reload, CORS errors, hydration differences and failed static builds in
-  c15t v3.
+  lost on reload, CORS errors, hydration differences, failed manifest downloads,
+  mode errors and failed static builds in c15t v3.
 group: guides
 ---
 
@@ -35,12 +35,12 @@ defined by exports" or "Module not found".
 
 Install the v3 release and check the lockfile:
 
-| Package manager | Command                  |
-| :-------------- | :----------------------- |
-| npm             | `npm install c15t@alpha` |
-| pnpm            | `pnpm add c15t@alpha`    |
-| yarn            | `yarn add c15t@alpha`    |
-| bun             | `bun add c15t@alpha`     |
+| Package manager | Command            |
+| :-------------- | :----------------- |
+| npm             | `npm install c15t` |
+| pnpm            | `pnpm add c15t`    |
+| yarn            | `yarn add c15t`    |
+| bun             | `bun add c15t`     |
 
 Keep every c15t package, including `@c15t/integrations`, on the same release.
 Mixing v2 and v3 packages is not supported.
@@ -49,14 +49,14 @@ Mixing v2 and v3 packages is not supported.
 
 No banner is sometimes correct. Find out which case you have:
 
-| What DevTools shows                                | Cause                                                                                                                       | Fix                                                                                                                                                                                     |
-| -------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| The backend request failed or has a CORS error     | Wrong backend URL, or your origin is not trusted                                                                            | Copy the URL from your Inth project exactly, including any path. Add the site's origin, such as `https://www.example.com` or `http://localhost:3000`, to the project's trusted origins. |
-| Requests go to `your-project.inth.app` and fail    | The placeholder backend URL from the guides is still in your code                                                           | Replace `https://your-project.inth.app` with the URL from your Inth project, including any path prefix.                                                                                 |
-| No backend request at all                          | No provider mounted, or the provider runs in offline mode                                                                   | Check `window.c15t`. Confirm the provider receives `hosted()` with your backend URL, or the `backendURL` option your framework uses.                                                    |
-| The policy resolved and no prompt is needed        | The visitor's location maps to a policy without a prompt, such as a US state without a privacy law in the recommended rules | Expected. Test from a location that needs a prompt. Server helpers such as Next.js `resolveConsent` accept a `country` override for testing; remove it before you deploy.               |
-| The policy resolved and a choice is stored         | A returning visitor                                                                                                         | Expected. Clear site data or use a private window.                                                                                                                                      |
-| The banner is in the DOM but invisible or unstyled | The stylesheet is missing, or loaded before Tailwind CSS 4                                                                  | Import your framework's c15t stylesheet from your global CSS. See [customization](../customization/overview.md).                                                                        |
+| What DevTools shows                                | Cause                                                                                                                                                                                                          | Fix                                                                                                                                                                                                                                                    |
+| -------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| The backend request failed or has a CORS error     | Wrong backend URL, or your origin is not trusted                                                                                                                                                               | Copy the URL from your Inth project exactly, including any path. Add the site's origin, such as `https://www.example.com` or `http://localhost:3000`, to the project's trusted origins.                                                                |
+| Requests go to `your-project.inth.app` and fail    | The placeholder backend URL from the guides is still in your code                                                                                                                                              | Replace `https://your-project.inth.app` with the URL from your Inth project, including any path prefix.                                                                                                                                                |
+| No backend request at all                          | No provider mounted, the provider runs in offline mode, or the page resolved from a bundled manifest                                                                                                           | Check `window.c15t`. `mode: 'manifest'` with no request is expected for a policy that does not depend on location. Otherwise confirm your framework's backend URL variable is set, as [consent modes](../concepts/modes.md#set-the-backend-url) lists. |
+| The policy resolved and no prompt is needed        | The visitor's location maps to a policy without a prompt, such as a US state without a privacy law in the recommended rules                                                                                    | Expected. Test from a location that needs a prompt. Server helpers such as Next.js `resolveConsent` accept a `country` override for testing; remove it before you deploy.                                                                              |
+| The policy resolved and a choice is stored         | A returning visitor                                                                                                                                                                                            | Expected. Clear site data or use a private window.                                                                                                                                                                                                     |
+| The banner is in the DOM but invisible or unstyled | c15t's rules are missing: `styles: false` without an imported stylesheet, a Content Security Policy that blocks c15t's `<style>` elements, Tailwind CSS 3's preflight, or a SvelteKit app without `c15tHandle` | See [stylesheets and CSS layers](../customization/stylesheets.md) for how your framework loads c15t's rules.                                                                                                                                           |
 
 Do not "fix" a missing banner by granting every category or turning c15t off.
 While the policy is unresolved, every optional category stays denied. Turning
@@ -67,23 +67,27 @@ the runtime off lets optional scripts load.
 c15t only controls scripts you register with it. Find every other loader:
 
 * A `<script>` tag in your HTML, layout or `_document`.
-* A framework plugin, such as `@next/third-parties`, `nuxt-gtag` or a Vercel
-  or Netlify analytics toggle.
+* A framework package or plugin, such as `@next/third-parties`,
+  `@nuxt/scripts`, `nuxt-gtag` or a Vercel or Netlify analytics toggle.
 * A tag in Google Tag Manager that fires on page view.
 * An embed, such as a YouTube iframe, rendered without `ConsentGate`.
 
 Remove the extra loader and register the vendor through
-[integrations](../integrations/overview.md). Then reload with the Network panel
-open and cache disabled. The vendor's domain should be absent until you allow
-its category.
+[integrations](../integrations/overview.md). To replace a framework package,
+follow [migrate from `@next/third-parties`](https://c15t.com/docs/frameworks/next/scripts#migrate-from-nextthird-parties),
+[migrate from `@nuxt/scripts`](https://c15t.com/docs/frameworks/nuxt/scripts#migrate-from-nuxtscripts)
+or [migrate from `nuxt-gtag`](https://c15t.com/docs/frameworks/nuxt/scripts#migrate-from-nuxt-gtag).
+Then reload with the Network panel open and cache disabled. The vendor's
+domain should be absent until you allow its category.
 
 Also check the policy. Under an opt-out policy, optional categories are allowed
 before a choice, so the request is expected.
 
-Google Tag and Google Tag Manager are an exception by design. Their helpers
-load before a choice and send Google Consent Mode signals, so a request to
-Google before consent is expected. If you need no request at all before
-consent, read [Google Tag Manager](../integrations/google-tag-manager.md) first.
+Google Tag and Google Tag Manager are an exception by design. By default
+their helpers load before a choice and send Google Consent Mode signals, so a
+request to Google before consent is expected. If you need no request at all
+before consent, set `loadMode: 'after-consent'`; see
+[Google Tag Manager](../integrations/google-tag-manager.md#choose-when-the-container-loads).
 
 ## Why does the choice disappear on reload?
 
@@ -116,6 +120,66 @@ Never keep consent state in a module-level variable on the server. One
 visitor's state can leak into another request. Create it per request, as the
 framework guides do.
 
+## Why does the build fail to download the manifest?
+
+`manifest()` resolves from a policy snapshot that the build downloads from
+`${backendURL}/manifest`. A production build stops when the download fails,
+and dev logs the same message as a warning. Every framework uses the same
+messages, prefixed with the integration's name, such as
+`@c15t/nextjs/build`, `@c15t/core/build` (for `c15t/build`),
+`@c15t/tanstack-start/build`, `@c15t/vue/vite`, `@c15t/svelte/vite`,
+`@c15t/vue` (Nuxt) or `@c15t/astro`:
+
+| Message                                                                                                                                           | Cause                                                                                                                           | Fix                                                                                                                                            |
+| ------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------- |
+| `could not fetch the consent manifest from <url> during the build (fetch failed: ...)`, with `ENOTFOUND`, `ECONNREFUSED` or another network error | The build cannot reach the backend                                                                                              | Build where the backend is reachable, or deploy with `C15T_ON_BUILD_ERROR=runtime`                                                             |
+| `... (no response within 10 seconds)`                                                                                                             | The backend did not answer in time                                                                                              | Check the backend, or build where it is reachable                                                                                              |
+| `... (/manifest responded 404 Not Found)`, or another status                                                                                      | The URL is not your project's backend, such as the `https://your-project.inth.app` placeholder or a URL missing its path prefix | Copy the backend URL exactly as Inth shows it                                                                                                  |
+| `... (/manifest returned an invalid consent manifest.)`                                                                                           | The URL answered with something other than a consent manifest, such as an HTML page                                             | Point the backend URL at the backend itself, not your site or a dashboard page                                                                 |
+| `no backend URL is set, so the build cannot fetch the consent manifest. Pass backendURL or set ...`                                               | No `backendURL` option and no backend URL variable                                                                              | Set the variable your framework reads; see [consent modes](../concepts/modes.md#set-the-backend-url)                                           |
+| `skipped the consent manifest fetch because "/api/c15t" is not an absolute http(s) URL, so the server fetches the policy at runtime.`             | A relative backend URL. A notice, not an error.                                                                                 | Pass the absolute backend URL. With `onBuildError: 'fail'`, this stops the build with `build-time manifests require an absolute upstream URL.` |
+| `C15T_ON_BUILD_ERROR must be 'runtime' or 'fail', received "..."`                                                                                 | The variable has another value                                                                                                  | Set it to `runtime` or `fail`, or unset it                                                                                                     |
+| `onBuildError must be 'runtime' or 'fail', received "..."`                                                                                        | The option has another value                                                                                                    | Pass `'runtime'` or `'fail'`                                                                                                                   |
+
+Each failure message ends with what to do next. In a production build:
+``Set `C15T_ON_BUILD_ERROR=runtime` (or `onBuildError: 'runtime'`) to deploy with runtime fetching.``
+The Vite plugins add one more fix. The plugin can't see a mode set in app
+code, so an app that uses `manifest({ manifestURL })` or
+`manifest({ source: 'runtime' })` should pass `source: 'runtime'` to
+`consentManifest()`, and the build skips the download.
+A failed download never reuses an older snapshot. With
+`C15T_ON_BUILD_ERROR=runtime`, the build finishes without a snapshot, and the
+manifest is fetched at runtime. Dev warnings end with
+`The server fetches it at runtime instead. A production build stops on this error.`
+
+[Consent modes](../concepts/modes.md#what-happens-when-the-download-fails)
+describes the policy and when the build skips the download.
+
+### A single-page app warns that the policy depends on location
+
+`consentManifest()` from `c15t/build` logs this warning when it downloads a
+policy with location rules:
+
+```txt
+@c15t/core/build: the consent policy depends on the visitor's location, which the browser doesn't know. Unless you pass `inputs` or `geoURL` to `manifest()`, every first visit still calls the backend's /init, so the bundled policy adds bytes without saving a request. Consider `mode: hosted()` instead.
+```
+
+Pass the visitor's `{ country, region }` as `manifest({ inputs })` when your
+edge knows it, or a `geoURL` that answers with it. Otherwise switch the mode
+to `hosted()`, which asks `/init` without bundling the policy.
+
+## Why does the provider say a mode is required?
+
+The browser throws when a provider or `init()` gets no mode, or a mode name
+instead of a factory:
+
+| Message                                                                                                                                                                                                               | Fix                                                                                                                                                                                                                                                                                            |
+| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| ``@c15t/react ConsentProvider: `mode` is required. Use manifest() or hosted().``                                                                                                                                      | Pass `mode`, such as `manifest()` from the same package. The start of the message names the package and the API that got no mode, such as `@c15t/svelte ConsentProvider` or `@c15t/core createConsentRuntime()`. Production builds name the package only: ``@c15t/react: `mode` is required.`` |
+| ``@c15t/browser: `mode` must be a factory, such as manifest(), hosted() or offline() from @c15t/browser. Mode names like "hosted" work only in the script-tag builds.``                                               | Import the factory and call it: `init({ mode: hosted() })`.                                                                                                                                                                                                                                    |
+| ``c15t: hosted() needs `backendURL`. Pass it, or add consentManifest() from c15t/build to your Vite config and set VITE_C15T_BACKEND_URL (or VITE_INTH_PROJECT_URL).``                                                | The React `hosted()` found no backend URL. `@c15t/browser` throws the same message prefixed `@c15t/browser:`. A production build prints only the first sentence.                                                                                                                               |
+| ``c15t: `mode` is the hosted() transport itself, so its code ships in the client bundle. Pass the hosted() your framework package exports instead: it is plain data, and the root loads the code only when it runs.`` | A warning outside production. A server-rendered root got a transport from `c15t/react`. Import the mode from your framework package. Next.js has its own wording; see [Next.js troubleshooting](https://c15t.com/docs/frameworks/next/troubleshooting).                                        |
+
 ## Why does the static build fail when development works?
 
 A static host serves files only. Route handlers, server functions, rewrites
@@ -135,7 +199,7 @@ every optional category stays denied.
 
 ## Why does my theme do nothing?
 
-Check that the c15t stylesheet loads, that you set a token or slot the
+Check that c15t's rules load, that you set a token or slot the
 component actually reads, and that the state attribute you target is on the
 element you style. A `data-variant` on the banner root is not on its card.
 Check the Tailwind version and CSS layer order before adding specificity. See

package/docs/guides/verify-consent.md

@@ -44,10 +44,11 @@ nothing.
 | Turn that category off again                 | The page reloads, and the vendor does not load after the reload.                                                  |
 | Navigate between pages without a full reload | Each vendor loads once, not once per navigation.                                                                  |
 
-Google Tag and Google Tag Manager load before consent on purpose and send
-Consent Mode signals. For them, check that the consent state in the request
-parameters changes when the visitor chooses, not that requests are absent.
-See [Google Tag Manager](../integrations/google-tag-manager.md).
+By default, Google Tag and Google Tag Manager load before consent on purpose
+and send Consent Mode signals. For them, check that the consent state in the
+request parameters changes when the visitor chooses, not that requests are
+absent. With `loadMode: 'after-consent'`, they follow the table above. See
+[Google Tag Manager](../integrations/google-tag-manager.md).
 
 ## Check each location
 
@@ -72,10 +73,24 @@ having clicked anything. Turn GPC off and confirm the restriction ends.
 
 ## Check failure behavior
 
-Block the backend URL in DevTools (right-click the request, then **Block
-request URL**) and reload. No banner appears, and no optional vendor loads.
-A missing banner must never mean "allowed". Then unblock it and confirm the
-page recovers.
+Make the request that initializes consent fail, then reload. Depending on your
+setup, that is the backend `/init`, a same-origin init route, a manifest fetch,
+or the `/init` a bundled manifest falls back to when a regional policy needs a
+location the browser does not know.
+
+* For a request the browser makes, block it in DevTools (right-click the
+  request, then **Block request URL**).
+* When the server resolves consent before the page loads, the browser never
+  sees that request. Make it fail on the server instead, for example by
+  pointing the backend URL at an unreachable address for one run.
+* With a custom transport, make its `init` fail.
+
+No banner appears, and vendors that wait for consent send no requests. Skip this
+check only if the page makes no initialization request at all, such as a
+build-time manifest with no regional fallback. A helper that always loads, such
+as `gtag` with its default `loadMode`, still loads; check that it reports denied
+consent. A missing banner must never mean "allowed". Then undo the change and
+confirm the page recovers.
 
 ## Check the interface
 

package/docs/integrations/adobe-analytics.md

@@ -3,22 +3,32 @@ title: Adobe Analytics
 description: Load an Adobe Data Collection Tags property only after measurement
   consent with the c15t adobeAnalytics helper, and check its extensions in
   DevTools.
+seoTitle: Adobe Analytics cookie consent with c15t
+seoDescription: Load Adobe Analytics only with measurement consent. The c15t
+  adobeAnalytics helper gates your Adobe Data Collection Tags property.
 icon: adobe-analytics
 group: integrations
 ---
 
+The c15t `adobeAnalytics` helper keeps your Adobe Data Collection Tags property
+off the page until `measurement` has consent. This property loads Adobe
+Analytics. The helper sends no consent signal to Adobe, so every extension in
+the property runs under the consent for `measurement`. If the visitor withdraws
+consent, c15t removes the script element. By default, c15t also reloads the
+page.
+
 ## Configure Adobe Analytics
 
 Copy the full embed URL for your property environment from the Adobe Data
 Collection embed code. Adobe has no shared loader that takes only an account
 ID, so `adobeAnalytics` needs the whole URL. Remove the original embed code.
 
-| Package manager | Command                                |
-| :-------------- | :------------------------------------- |
-| npm             | `npm install @c15t/integrations@alpha` |
-| pnpm            | `pnpm add @c15t/integrations@alpha`    |
-| yarn            | `yarn add @c15t/integrations@alpha`    |
-| bun             | `bun add @c15t/integrations@alpha`     |
+| Package manager | Command                          |
+| :-------------- | :------------------------------- |
+| npm             | `npm install @c15t/integrations` |
+| pnpm            | `pnpm add @c15t/integrations`    |
+| yarn            | `yarn add @c15t/integrations`    |
+| bun             | `bun add @c15t/integrations`     |
 
 ```ts title="src/consent-scripts.ts"
 import { adobeAnalytics } from '@c15t/integrations/adobe-analytics';
@@ -38,51 +48,41 @@ endpoint, policy, styles and consent UI. Remove the vendor's original script,
 SDK initializer or tag-manager entry, so the vendor loads only through c15t.
 
 The vendor pages put the helper in `src/consent-scripts.ts`. If your framework
-quickstart already created a scripts file, such as `lib/scripts.ts` in the
-Next.js guide, add the helper to that array instead of creating a second file.
+quickstart already has a `scripts` array, such as the one in `c15t.config.ts`
+in the Next.js guide, add the helper to that array instead of creating a
+second file.
 The `scripts` export is a configuration, not an initializer. Add it to the c15t provider you already have, at the registration
 point for your framework below. These are edits to that provider, not a second
 provider.
 
 **Next.js**
 
-Import the configuration into the client boundary from your router guide:
-
-```ts
-import { ConsentRoot } from 'c15t/next';
-import { scripts } from './consent-scripts';
-```
+Add the configuration to `scripts` in `c15t.config.ts`, next to
+`next.config.ts`:
 
-Keep the server-resolved `state` and shared `consentConfig` from your
-router guide. Its manifest, init and save URLs stay in effect. Add
-`scripts` as a top-level prop on the existing root:
+```ts title="c15t.config.ts"
+import { defineConsentConfig } from 'c15t/next';
+import { scripts } from './src/consent-scripts';
 
-```tsx
-<ConsentRoot state={state} config={consentConfig} scripts={scripts}>
-  {children}
-</ConsentRoot>
+export default defineConsentConfig({ scripts });
 ```
 
-App Router, Pages Router and static export all use this `ConsentRoot` in
-the `'use client'` wrapper `components/consent.tsx`. Keep `scripts` there,
-because a Server Component cannot pass script callbacks to it. See
+Keep the rest of your config, such as `mode` and `routePrefix`, in the
+same call. `ConsentRoot` reads the config in the browser, so the layout
+keeps passing only `state`. App Router, Pages Router and static export all
+read the same file. See
 [Next.js scripts and embeds](https://c15t.com/docs/frameworks/next/scripts).
 
 **TanStack Start**
 
 Import the configuration into your root route and pass it to the existing
-`ConsentRoot` as a top-level prop. Keep the loader, `backendURL` and
-`initRoute` from the [TanStack Start quickstart](https://c15t.com/docs/frameworks/tanstack-start/quickstart):
+`ConsentRoot` as a top-level prop. Keep the loader from the
+[TanStack Start quickstart](https://c15t.com/docs/frameworks/tanstack-start/quickstart):
 
 ```tsx title="src/routes/__root.tsx"
 import { scripts } from '../consent-scripts';
 
-<ConsentRoot
-  state={consent}
-  backendURL={backendURL}
-  initRoute={false}
-  scripts={scripts}
->
+<ConsentRoot state={consent} scripts={scripts}>
 ```
 
 Import vendor helpers in the root route module, not in a server function.
@@ -101,8 +101,8 @@ import { scripts } from './consent-scripts';
 <ConsentProvider options={{ mode, scripts }}>
 ```
 
-`mode` is the `hosted({ url: 'https://your-project.inth.app' })` value
-from the [React quickstart](../frameworks/react/quickstart.md). Keep the banner,
+`mode` is the `manifest()` value from the
+[React quickstart](../frameworks/react/quickstart.md). Keep the banner,
 dialog and preferences link inside the provider. See
 [React scripts and embeds](../frameworks/react/scripts.md).
 
@@ -131,15 +131,16 @@ callbacks. Write the vendor IDs into `consent-scripts.ts`. See
 Pass the scripts to the existing `c15tVue` plugin call in `src/main.ts`:
 
 ```ts title="src/main.ts"
+import { c15tVue, manifest } from 'c15t/vue/vue-plugin';
 import { scripts } from './consent-scripts';
 
 app.use(c15tVue, {
-  backendURL: 'https://your-project.inth.app',
+  mode: manifest(),
   scripts,
 });
 ```
 
-Keep your existing backend URL and other options. The plugin starts one
+Keep your existing `mode` and other options. The plugin starts one
 script loader when the app mounts, after it has applied the visitor's stored
 choice. Do not also call `createScriptLoader` from a component. See
 [Vue scripts and embeds](https://c15t.com/docs/frameworks/vue/scripts).
@@ -147,12 +148,11 @@ choice. Do not also call `createScriptLoader` from a component. See
 **Astro**
 
 Add the scripts to the client entrypoint from the
-[Astro quickstart](https://c15t.com/docs/frameworks/astro/quickstart), the module that the
-integration's `clientEntrypoint` option names. Keep `mode`, `ui` and the
-framework integration in `astro.config.mjs` as they are. If the module
-already exports scripts, combine the two arrays.
+[Astro quickstart](https://c15t.com/docs/frameworks/astro/quickstart), `src/c15t.client.ts`,
+which the integration finds on its own. Keep `astro.config.mjs` as it is.
+If the module already exports scripts, combine the two arrays.
 
-```ts title="src/consent-client.ts"
+```ts title="src/c15t.client.ts"
 import type { C15tClientOptionsExtension } from 'c15t/astro';
 import { scripts } from './consent-scripts';
 
@@ -172,15 +172,13 @@ pass them as a top-level prop:
 
 ```svelte title="src/App.svelte"
 <script lang="ts">
-  import { ConsentManagerProvider, hosted } from '@c15t/svelte';
+  import { ConsentProvider, manifest } from '@c15t/svelte';
   import { scripts } from './consent-scripts';
-
-  const mode = hosted({ url: 'https://your-project.inth.app' });
 </script>
 
-<ConsentManagerProvider {mode} {scripts}>
+<ConsentProvider mode={manifest()} {scripts}>
   <!-- Keep your application, consent UI and preferences link here. -->
-</ConsentManagerProvider>
+</ConsentProvider>
 ```
 
 Retain the styles and consent UI from the [Svelte quickstart](https://c15t.com/docs/frameworks/svelte/quickstart).
@@ -188,22 +186,21 @@ The provider owns the loader and disposes it on unmount.
 
 **SvelteKit**
 
-Add the scripts to the existing root layout provider. Keep the server load
-and its serializable prefetch data from the [SvelteKit quickstart](https://c15t.com/docs/frameworks/sveltekit/quickstart).
+Add the scripts to the existing `ConsentRoot` in the root layout. Keep the
+handle and the layout load from the [SvelteKit quickstart](https://c15t.com/docs/frameworks/sveltekit/quickstart).
 
 ```svelte title="src/routes/+layout.svelte"
 <script lang="ts">
-  import { ConsentManagerProvider, hosted } from '@c15t/svelte';
+  import { ConsentRoot } from '@c15t/svelte';
   import { scripts } from '../consent-scripts';
 
   let { children, data } = $props();
-  const mode = hosted({ url: 'https://your-project.inth.app' });
 </script>
 
-<ConsentManagerProvider {mode} {scripts} prefetch={data.prefetch}>
+<ConsentRoot state={data.consent} {scripts}>
   {@render children()}
   <!-- Keep your consent UI and preferences link here. -->
-</ConsentManagerProvider>
+</ConsentRoot>
 ```
 
 Import vendor helpers in the layout component, not in `+layout.server.ts`:
@@ -230,20 +227,19 @@ to a pasted snippet. See [HTML scripts](https://c15t.com/docs/frameworks/html/sc
 
 **JavaScript**
 
-Pass the scripts to `init()` from `@c15t/browser`, next to your backend
-URL:
+Pass the scripts to `init()` from `@c15t/browser`, next to your mode:
 
 ```ts
-import { init } from '@c15t/browser';
+import { init, manifest } from '@c15t/browser';
 import { scripts } from './consent-scripts';
 
 const consent = init({
-  backendURL: 'https://your-project.inth.app',
+  mode: manifest(),
   scripts,
 });
 ```
 
-Keep the backend URL from your quickstart. With
+Keep the mode from your quickstart. With
 `createConsentRuntime` from `c15t/runtime`, pass `scripts` to it instead.
 A kernel you create yourself needs a loader from
 `c15t/modules/script-loader`. Attach one loader per kernel. See
@@ -251,11 +247,11 @@ A kernel you create yourself needs a loader from
 
 ## Options
 
-| Option               | Default  | Behavior                                                                                                                                                       |
-| -------------------- | -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `scriptUrl`          | Required | Full `https:` embed URL of the Tags property environment. Self-hosted embeds work. The helper trims the value. Empty, unparseable and non-`https:` URLs throw. |
-| `async`              | `true`   | Loads the Tags library asynchronously. Set `false` only for a legacy synchronous deployment.                                                                   |
-| `seedAdobeDataLayer` | `true`   | Sets `window.adobeDataLayer` to an empty array before the library loads, only when the global is undefined.                                                    |
+| Option               | Default  | Behavior                                                                                                                                                                                           |
+| -------------------- | -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `scriptUrl`          | Required | Full `https:` embed URL of the Tags property environment. Self-hosted embeds work. The helper trims the value. Empty, unparseable and non-`https:` URLs log an error and the script does not load. |
+| `async`              | `true`   | Loads the Tags library asynchronously. Set `false` only for a legacy synchronous deployment.                                                                                                       |
+| `seedAdobeDataLayer` | `true`   | Sets `window.adobeDataLayer` to an empty array before the library loads, only when the global is undefined.                                                                                        |
 
 ## Loading and revocation
 
@@ -295,8 +291,8 @@ permission before each of your own event calls. The reload does not delete
 cookies the vendor already set; see
 [clear on revocation for your framework](./overview.md#vendor-switches-and-cookie-cleanup).
 
-The helper sets `vendor` to its script ID, so once you declare that vendor a
-visitor can turn it off inside an allowed category. See
+The helper lists its vendor by name in the preference dialog, so a visitor can
+turn it off inside an allowed category. See
 [vendor consent for your framework](./overview.md#vendor-switches-and-cookie-cleanup). The
 [consent verification guide](../guides/verify-consent.md) covers navigation,
 expiry and hosting checks.