@c15t/react 2.0.0-rc.7 → 2.0.0-rc.9

package/docs/integrations/linkedin-insights.md

@@ -27,7 +27,7 @@ linkedinInsights({
 |Property|Type|Description|Default|Required|
 |:--|:--|:--|:--|:--:|
 |id|string|Your LinkedIn Insights ID|-|✅ Required|
-|script|Script \|undefined|Override or extend the default script values. Options: \`id\`: 'linkedin-insights'; \`src\`: \`https\://snap.licdn.com/li.lms-analytics/insight.min.js\`; \`category\`: 'marketing'|-|Optional|
+|scriptSrc|string \|undefined|LinkedIn Insights loader URL.|-|Optional|
 
 ### Script
 

package/docs/integrations/meta-pixel.md

@@ -41,7 +41,7 @@ metaPixelEvent('Purchase', { value: 10.0, currency: 'USD' });
 |Property|Type|Description|Default|Required|
 |:--|:--|:--|:--|:--:|
 |pixelId|string|Your Meta Pixel ID|-|✅ Required|
-|script|Script \|undefined|Override or extend the default script values. Options: \`id\`: 'meta-pixel'; \`src\`: \`https\://connect.facebook.net/en\_US/fbevents.js\`; \`category\`: 'marketing'|-|Optional|
+|scriptSrc|string \|undefined|Meta Pixel loader URL.|-|Optional|
 
 ### Script
 

package/docs/integrations/microsoft-uet.md

@@ -30,7 +30,7 @@ microsoftUet({
 |Property|Type|Description|Default|Required|
 |:--|:--|:--|:--|:--:|
 |id|string|Your Microsoft UET ID|-|✅ Required|
-|script|Script \|undefined|Override or extend the default script values. Options: \`id\`: 'microsoft-uet'; \`src\`: \`//bat.bing.com/bat.js\`; \`category\`: 'marketing'|-|Optional|
+|scriptSrc|string \|undefined|Microsoft UET loader URL.|-|Optional|
 
 ### Script
 

package/docs/integrations/overview.md

@@ -1,9 +1,16 @@
 ---
 title: Integrations
 description: "Many of your tools may require consent to be given before they can be used. This is especially true for analytics and marketing tools. \nc15t has various ways to integrate with your tools, depending on the tool you are using."
-lastModified: 2025-10-02
+lastModified: 2026-04-10
 
 ---
+c15t supports two integration styles:
+
+* use a prebuilt helper from `@c15t/scripts`
+* build your own script or manifest-backed helper
+
+If you are building something reusable or contributing to `@c15t/scripts`, start with the [custom integration guide](/docs/integrations/building-integrations).
+
 ## General Pattern
 
 Every integration provides a script configuration function. Pass it to your framework's setup:
@@ -68,12 +75,21 @@ export function App({ children }: { children: React.ReactNode }) {
 
 Many marketing and analytics tools are commonly loaded using a script tag, such as Google Tag Manager (GTM), Google Tag (gtag.js), Meta Pixel and TikTok Pixel.
 
-c15t's script loader allows you to easily integrate your tools that require consent with c15t, to make this even easier we have provided a set of prebuilt scripts for you to use.
+c15t's script loader allows you to easily integrate your tools that require consent with c15t. The prebuilt integrations in `@c15t/scripts` are the recommended starting point, and the custom integration guide explains how to build your own when you need something more specialized.
 
 * [JavaScript](/docs/frameworks/javascript/script-loader)
 * [React](/docs/frameworks/react/script-loader)
 * [Next.js](/docs/frameworks/next/script-loader)
 
+## Building Your Own
+
+If you need a vendor we do not ship yet:
+
+* build a one-off `Script` directly in your app for simple cases
+* build a reusable manifest-backed helper for shared or package-level integrations
+
+Read the [custom integration guide](/docs/integrations/building-integrations) for the manifest phases, structured step model, testing checklist, and devtools debugging flow.
+
 ## has() method
 
 The `has()` method allows you to check if the user has given consent for a specific purpose. You can learn more about the `has()` method [here](/docs/frameworks/javascript/store/checking-consent).

package/docs/integrations/posthog.md

@@ -1,7 +1,7 @@
 ---
 title: PostHog
 description: PostHog is an open-source product analytics platform for tracking user behavior, session replays, feature flags, and A/B testing. It supports cookieless tracking, allowing analytics to continue even without cookie consent.
-lastModified: 2025-09-19
+lastModified: 2026-04-08
 
 icon: posthog
 ---
@@ -25,7 +25,7 @@ This is the recommended approach if you're using the Posthog JS SDK, this is com
    posthog.opt_out_capturing() // Avoids accidental tracking without consent till c15t has loaded
    ```
 
-2. **Adding the SDK callback to c15t** The PostHog SDK approach uses callbacks.onConsentSet instead of scripts. This lets you toggle PostHog's opt-in/opt-out based on the user's consent choice.
+2. **Sync settled consent once, then subscribe to real changes** The recommended PostHog SDK approach uses two phases: run one initial sync after c15t has finished resolving consent, then subscribe to future real preference changes with subscribeToConsentChanges().
 
    > ℹ️ Info:
    >
@@ -35,20 +35,38 @@ This is the recommended approach if you're using the Posthog JS SDK, this is com
    import { getOrCreateConsentRuntime } from 'c15t';
    import { posthog } from 'posthog-js';
 
-   getOrCreateConsentRuntime({
+   function syncPostHogMeasurementConsent(hasMeasurementConsent: boolean) {
+     if (hasMeasurementConsent) {
+       posthog.opt_in_capturing();
+     } else {
+       posthog.opt_out_capturing();
+     }
+   }
+
+   const runtime = getOrCreateConsentRuntime({
      mode: 'hosted',
      callbacks: {
-       onConsentSet({ preferences }) {
-         if (preferences.measurement) {
-           posthog.opt_in_capturing();
-         } else {
-           posthog.opt_out_capturing();
-         }
-       }
-     }
+       onBannerFetched() {
+         syncPostHogMeasurementConsent(
+           runtime.consentStore.getState().has('measurement')
+         );
+       },
+     },
    });
+
+   runtime.consentStore
+     .getState()
+     .subscribeToConsentChanges(({ allowedCategories }) => {
+       syncPostHogMeasurementConsent(
+         allowedCategories.includes('measurement')
+       );
+     });
    ```
 
+   > ℹ️ Info:
+   >
+   > Avoid using onConsentSet plus manual deduplication for PostHog. subscribeToConsentChanges() already gives you the exact change-only semantics most analytics SDKs need.
+
 ## PostHog Script Implementation
 
 If you want to load posthog via a script tag it's recommended to use this approach.
@@ -80,8 +98,13 @@ By default c15t will always load the script regardless of consent. This is becau
    posthog({
      id: 'phc_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
      apiHost: 'https://eu.i.posthog.com',
-     defaults: '2025-05-24',
-     options: { person_profiles: 'identified_only' }
+     scriptUrl: 'https://eu-assets.i.posthog.com/static/array.js',
+     initOptions: {
+       api_host: 'https://eu.i.posthog.com',
+       ui_host: 'https://eu.i.posthog.com',
+       autocapture: false,
+       person_profiles: 'identified_only',
+     }
    })
    ```
 
@@ -92,10 +115,9 @@ By default c15t will always load the script regardless of consent. This is becau
 |Property|Type|Description|Default|Required|
 |:--|:--|:--|:--|:--:|
 |id|string|Your posthog id, begins with 'phc\_'.|-|✅ Required|
-|apiHost|string|Your posthog api host.|'https\://eu.i.posthog.com'|✅ Required|
-|defaults|string|The defaults for the posthog script.|-|✅ Required|
-|options|Record\<string, unknown>|Other optional options for the posthog script.|-|✅ Required|
-|script|Script \|undefined|Override or extend the default script values. Options: \`id\`: 'posthog-consent'; \`category\`: 'measurement'|-|Optional|
+|apiHost|string \|undefined|Your posthog api host.|'https\://eu.i.posthog.com'|Optional|
+|scriptUrl|string \|undefined|The PostHog array loader URL.|-|Optional|
+|initOptions|Record\<string, unknown> \|undefined|PostHog init options passed to \`posthog.init(...)\`.|-|Optional|
 
 ### Script
 

package/docs/integrations/tiktok-pixel.md

@@ -31,7 +31,7 @@ tiktokPixel({
 |Property|Type|Description|Default|Required|
 |:--|:--|:--|:--|:--:|
 |pixelId|string|Your TikTok Pixel ID|-|✅ Required|
-|script|Script \|undefined|Override or extend the default script values. Options: \`id\`: 'tiktok-pixel'; \`src\`: \`https\://analytics.tiktok.com/i18n/pixel/events.js\`; \`category\`: 'marketing'|-|Optional|
+|scriptSrc|string \|undefined|TikTok Pixel loader base URL.|-|Optional|
 
 ### Script
 

package/docs/integrations/x-pixel.md

@@ -37,7 +37,7 @@ xPixelEvent('tw-xxxx-xxxx', { value: 10.00, currency: 'USD' });
 |Property|Type|Description|Default|Required|
 |:--|:--|:--|:--|:--:|
 |pixelId|string|Your X Pixel ID|-|✅ Required|
-|script|Script \|undefined|Override or extend the default script values. Options: \`id\`: 'x-pixel'; \`src\`: \`https\://static.ads-twitter.com/uwt.js\`; \`category\`: 'marketing'|-|Optional|
+|scriptSrc|string \|undefined|X Pixel loader URL.|-|Optional|
 
 ### Script
 

package/docs/optimization.md

@@ -50,7 +50,7 @@ const prefetchScript = buildPrefetchScript({
 </head>
 ```
 
-Then consume the prefetched data in your provider:
+Then initialize your provider normally. Matching prefetched data is consumed automatically by the runtime during first store initialization:
 
 ```tsx
 import {
@@ -58,7 +58,6 @@ import {
   ConsentBanner,
   ConsentDialog,
 } from '@c15t/react';
-import { getPrefetchedInitialData } from 'c15t';
 
 export default function App({ children }: { children: React.ReactNode }) {
   return (
@@ -66,9 +65,6 @@ export default function App({ children }: { children: React.ReactNode }) {
       options={{
         mode: 'hosted',
         backendURL: '/api/c15t',
-        ssrData: getPrefetchedInitialData({
-          backendURL: '/api/c15t',
-        }),
       }}
     >
       <ConsentBanner />
@@ -80,7 +76,7 @@ export default function App({ children }: { children: React.ReactNode }) {
 ```
 
 > ℹ️ **Info:**
-> If you use overrides or custom credentials in buildPrefetchScript, pass the same values to getPrefetchedInitialData(...) so it resolves the matching prefetched request.
+> If overrides.gpc conflicts with the browser's ambient GPC signal, the prefetched entry is not reused and c15t falls back to a normal client /init.
 
 ## Keep The Provider Mounted Across Navigation
 

package/docs/policy-packs.md

@@ -6,7 +6,7 @@ Policy packs configure how c15t handles regional consent — which model (opt-in
 
 **For most apps, you just need a `ConsentManagerProvider` pointing at your backend with presets configured there.** The frontend receives the resolved policy via the `/init` response — no client-side policy config required.
 
-When a backend isn't available — local development, static previews, Storybook, or as a resilience fallback — you can pass policies directly to the provider via `offlinePolicy.policyPacks` and c15t resolves them locally.
+When a backend isn't available — local development, static previews, Storybook, automated tests, or as a resilience fallback during a temporary outage — you can pass policies directly to the provider via `offlinePolicy.policyPacks` and c15t resolves them locally.
 
 > ℹ️ **Info:**
 > For QA and testing, use the c15t DevTools to simulate different regions and policy responses against your real backend, rather than switching to offline mode.
@@ -29,9 +29,9 @@ When using consent.io or a self-hosted backend, the provider connects automatica
 
 The backend resolves the correct policy based on the visitor's geo data and returns it in the `/init` response. Configure your presets on the backend side.
 
-## Offline Presets (Fallback)
+## Offline Presets (Development and Fallback)
 
-When no backend is available, pass presets directly to the provider:
+Use offline presets mainly for local development, Storybook, deterministic tests, or temporary backend outages:
 
 ```tsx
 import { policyPackPresets } from '@c15t/react';
@@ -105,7 +105,7 @@ export function ConsentManager({ children }: { children: ReactNode }) {
 
 ## Offline / Fallback
 
-For local development, static sites, or when the backend is unreachable, pass policies directly:
+For local development, previews, automated tests, or when the backend is temporarily unreachable, pass policies directly:
 
 ```tsx
 import type { ReactNode } from 'react';
@@ -144,7 +144,7 @@ export function ConsentManager({ children }: { children: ReactNode }) {
 ## Provider Shape
 
 Configure packs through `offlinePolicy.policyPacks`. Add `offlinePolicy.i18n`
-when you want offline mode to mirror hosted policy-profile language behavior:
+when you want local previews or fallback behavior to mirror hosted policy-profile language behavior:
 
 ```tsx
 <ConsentManagerProvider
@@ -203,7 +203,7 @@ With that setup, offline mode resolves language the same way as hosted mode:
 |`offlinePolicy: { policyPacks: [] }`|Explicit no-banner mode|
 |Non-empty pack, no match, no default|Explicit no-banner mode|
 
-Omitting the option gives you a safe opt-in default for local development and outage scenarios. Providing it tells c15t you want policy-driven behavior exactly as configured.
+Omitting the option gives you a safe opt-in default for local development and outage scenarios. Providing it tells c15t you want deterministic preview or fallback behavior exactly as configured.
 
 ## QA and Debugging
 
@@ -215,7 +215,7 @@ For deeper inspection:
 * Open the DevTools Policy panel to inspect matcher resolution and fingerprints
 * Compare your frontend preview with the backend `/init` response before shipping
 
-If you need fully deterministic resolution without a backend (e.g., in automated tests or Storybook), pair `offlinePolicy.policyPacks` with `overrides`:
+If you need fully deterministic resolution without a backend during testing or preview work (for example, in automated tests or Storybook), pair `offlinePolicy.policyPacks` with `overrides`:
 
 ```tsx
 options={{

package/docs/quickstart.md

@@ -33,15 +33,17 @@ availableIn:
    |yarn|`yarn add @c15t/react`|
    |bun|`bun add @c15t/react`|
 
-2. **Import styles** Import the prebuilt component stylesheet at the root of your application. This is required for styled components to render correctly.
+2. **Import styles** Import the prebuilt component stylesheet in your app-level CSS entrypoint. This is required for styled components to render correctly.
 
-   ```tsx
-   import '@c15t/react/styles.css';
+   ```css
+   @import "@c15t/react/styles.css";
    ```
 
+   Keeping the c15t stylesheet in your global CSS entrypoint makes layer and cascade order explicit. JS/TSX side-effect imports can load in a different order across framework and Tailwind tooling, which makes style regressions harder to debug.
+
    > ℹ️ Info:
    >
-   > If you are using the headless API or fully custom styling, you can skip this import.
+   > If you are using the headless API or fully custom styling, you can skip this import. src/main.tsx should keep importing ./index.css as usual.
 
 3. **Create ConsentManager components** Create a provider component with the consent UI and a wrapper that re-exports it. This initializes the consent store and makes consent state available to all child components.
 
@@ -81,7 +83,11 @@ availableIn:
 
    > ℹ️ Info:
    >
-   > Don't have a backend yet? You can use mode: 'offline' for local-only consent storage, but review the browser-only storage consequences before choosing it for production.
+   > Hosted mode is the recommended production setup because the backend resolves jurisdiction and policy, keeps durable consent records, and lets c15t recover from temporary network failures by re-syncing later.
+   >
+   > ℹ️ Info:
+   >
+   > Don't have a backend yet? You can use mode: 'offline' for local-only consent storage, but it gives up backend audit history, server-side consent awareness, and automatic jurisdiction detection. Review the browser-only storage consequences before choosing it for production.
 
 4. **Mount ConsentManager at the app root** Wrap your existing app tree with ConsentManager so all routes/components can access consent state.
 

package/docs/script-loader.md

@@ -4,7 +4,7 @@ description: Gate third-party scripts behind consent - load Google Analytics, Me
 ---
 The script loader manages third-party scripts based on consent state. Scripts are defined in the provider's `scripts` option and are automatically loaded when their required consent category is granted, and unloaded when consent is revoked.
 
-c15t has a collection of premade scripts available on the @c15t/scripts package. It's recomended to check if a pre-built integration exists before manually creating a script, see the [integrations overview](/docs/integrations/overview).
+c15t has a collection of premade scripts available in `@c15t/scripts`. Check the [integrations overview](/docs/integrations/overview) first before manually building a script.
 
 |Package manager|Command|
 |:--|:--|
@@ -15,6 +15,12 @@ c15t has a collection of premade scripts available on the @c15t/scripts package.
 
 > ℹ️ **Info:**
 > We recommend using the pre-built integrations when possible.
+>
+> ℹ️ **Info:**
+> If you need a vendor we do not ship yet, see the custom integration guide. It covers both one-off Script objects and reusable manifest-backed integrations.
+>
+> ℹ️ **Info:**
+> For app-specific scripts, use a plain Script object. For reusable integrations, prefer a manifest-backed helper so startup phases, consent signaling, and future server-side loading support stay structured.
 
 ## Basic Usage
 
@@ -47,6 +53,21 @@ export function ConsentManager({ children }: { children: ReactNode }) {
 }
 ```
 
+## Choose the Right Approach
+
+* Use a plain `Script` for one-off app code.
+* Use a manifest-backed helper in `@c15t/scripts` for reusable integrations, contributions, or anything that needs structured startup behavior.
+
+If you are building something reusable, start with the [custom integration guide](/docs/integrations/building-integrations) before using raw callbacks.
+
+## Reusable Integrations
+
+For app-specific use, raw `Script` objects are usually enough.
+
+For reusable integrations, c15t uses a manifest-backed model in `@c15t/scripts`. That keeps startup phases, consent signaling, and vendor-specific boot logic structured instead of hidden inside large callback bodies.
+
+If you are building an integration for multiple apps or contributing upstream, use the [custom integration guide](/docs/integrations/building-integrations).
+
 ## Script Types
 
 ### Standard Scripts

package/docs/styling/tailwind.md

@@ -6,41 +6,47 @@ c15t works with Tailwind CSS out of the box. Use the `slots` theme option to app
 
 ## Setup
 
-Import the standard c15t stylesheet once at the root of your app:
+Import the standard c15t stylesheet once in your app-level CSS entrypoint:
 
-```tsx
-// React
-import '@c15t/react/styles.css';
+```css
+/* React: src/index.css */
+@import "@c15t/react/styles.css";
 
-// Next.js
-import '@c15t/nextjs/styles.css';
+/* Next.js: app/globals.css */
+@import "@c15t/nextjs/styles.css";
 ```
 
+Keeping the c15t stylesheet in your global CSS entrypoint makes layer and cascade order explicit. JS/TSX side-effect imports can load in a different order across framework and Tailwind tooling, which makes style regressions harder to debug.
+
 ### Tailwind v4
 
-Tailwind v4 automatically scans your source files. Import Tailwind normally. c15t component styles join Tailwind's `components` layer automatically, so no extra c15t-specific layer declaration is needed:
+Tailwind v4 automatically scans your source files. Import Tailwind normally, then place the c15t stylesheet immediately after it. c15t component styles join Tailwind's `components` layer automatically, so no extra c15t-specific layer declaration is needed:
 
-```css
+```css title="src/index.css"
 @import "tailwindcss";
+@import "@c15t/react/styles.css";
 ```
 
-### Tailwind v3
+```css title="app/globals.css"
+@import "tailwindcss";
+@import "@c15t/nextjs/styles.css";
+```
 
-Import the Tailwind 3-compatible c15t stylesheet before your app Tailwind globals, then keep your standard Tailwind directives in the app stylesheet:
+### Tailwind v3
 
-```tsx title="app/layout.tsx"
-import '@c15t/react/styles.tw3.css';
-import './globals.css';
-```
+Import the Tailwind 3-compatible c15t stylesheet after `@tailwind components;` and before `@tailwind utilities;`:
 
-```tsx title="app/layout.tsx"
-import '@c15t/nextjs/styles.tw3.css';
-import './globals.css';
+```css title="src/index.css"
+@tailwind base;
+@tailwind components;
+@import "@c15t/react/styles.tw3.css";
+@tailwind utilities;
 ```
 
 ```css title="app/globals.css"
 @tailwind base;
 @tailwind components;
+@import "@c15t/nextjs/styles.tw3.css";
 @tailwind utilities;
 ```
 

package/iab/styles.css

@@ -0,0 +1 @@
+@import "../dist/iab/styles.css";

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@c15t/react",
-	"version": "2.0.0-rc.7",
+	"version": "2.0.0-rc.9",
 	"description": "Developer-first CMP for React: cookie banner, consent manager, preferences centre. GDPR ready with minimal setup and rich customization",
 	"keywords": [
 		"react",
@@ -32,16 +32,16 @@
 	"type": "module",
 	"exports": {
 		"./styles.css": "./dist/styles.css",
-		"./styles.tw3.css": "./src/styles.tw3.css",
+		"./styles.tw3.css": "./dist/styles.tw3.css",
 		"./iab/styles.css": "./dist/iab/styles.css",
-		"./iab/styles.tw3.css": "./src/iab/styles.tw3.css",
+		"./iab/styles.tw3.css": "./dist/iab/styles.tw3.css",
 		"./primitives": {
-			"types": "./dist/primitives.d.ts",
+			"types": "./dist-types/primitives.d.ts",
 			"import": "./dist/primitives.js",
 			"require": "./dist/primitives.cjs"
 		},
 		"./primitives/*": {
-			"types": "./dist/primitives/*.d.ts",
+			"types": "./dist-types/primitives/*.d.ts",
 			"import": "./dist/primitives/*.js",
 			"require": "./dist/primitives/*.cjs"
 		},
@@ -139,17 +139,19 @@
 		"docs",
 		"dist-types",
 		"client",
+		"styles.css",
+		"iab",
 		"src/styles.tw3.css",
 		"src/iab/styles.tw3.css",
 		"!dist/mockServiceWorker.js"
 	],
 	"scripts": {
 		"prebuild": "genversion --esm --semi src/version.ts",
-		"build": "bun prebuild && rslib build && bun run clean:dist:test-artifacts && bun ../../scripts/agent-docs/generate-package-docs.ts @c15t/react",
+		"build": "bun prebuild && rslib build && bun ../../scripts/normalize-dist-types.mjs && bun scripts/generate-distribution-css.ts && bun run clean:dist:test-artifacts && bun ../../scripts/agent-docs/generate-package-docs.ts @c15t/react",
 		"build:agent-docs": "bun ../../scripts/agent-docs/generate-package-docs.ts @c15t/react",
 		"check-types": "bun prebuild && tsc --noEmit",
 		"clean:dist:test-artifacts": "bun --eval \"import { rmSync } from 'node:fs'; rmSync('dist/mockServiceWorker.js', { force: true });\"",
-		"dev": "bun prebuild && rslib build",
+		"dev": "bun prebuild && rslib build && bun ../../scripts/normalize-dist-types.mjs && bun scripts/generate-distribution-css.ts",
 		"fmt": "bun biome format --write . && bun biome check --formatter-enabled=false --linter-enabled=false --write",
 		"lint": "bun biome lint ./src",
 		"prepack": "cd ../.. && bunx turbo run build --filter=@c15t/react",
@@ -162,13 +164,13 @@
 		"not op_mini all"
 	],
 	"dependencies": {
-		"@c15t/ui": "2.0.0-rc.7",
-		"c15t": "2.0.0-rc.6",
+		"@c15t/ui": "2.0.0-rc.9",
+		"c15t": "2.0.0-rc.8",
 		"clsx": "2.1.1"
 	},
 	"devDependencies": {
-		"@c15t/backend": "2.0.0-rc.6",
-		"@c15t/iab": "2.0.0-rc.6",
+		"@c15t/backend": "2.0.0-rc.8",
+		"@c15t/iab": "2.0.0-rc.8",
 		"@c15t/typescript-config": "0.0.1-beta.1",
 		"@c15t/vitest-config": "1.0.0",
 		"@iabtechlabtcf/core": "^1.5.20",

package/readme.json

@@ -21,6 +21,12 @@
 		"",
 		"```bash\npnpm add @c15t/react\n```",
 		"",
+		"Then add the prebuilt stylesheet to your app-level CSS entrypoint:",
+		"",
+		"```css\n/* src/index.css */\n@import \"@c15t/react/styles.css\";\n```",
+		"",
+		"If you use the prebuilt IAB TCF UI, also import `@c15t/react/iab/styles.css`. It is published separately so non-IAB apps do not ship those component rules.",
+		"",
 		"To manually install, follow the guide in our [docs – manual setup](https://c15t.com/docs/frameworks/react/quickstart#manual-setup)."
 	],
 	"usage": [

package/src/iab/styles.css

@@ -0,0 +1,11 @@
+/**
+ * @c15t/react — IAB TCF component styles.
+ *
+ * Add this stylesheet to the same global CSS entrypoint as your base c15t styles
+ * when using IAB consent components. Do not import either stylesheet from JS/TSX.
+ *
+ * Usage (src/index.css):
+ *   @import "@c15t/react/styles.css";
+ *   @import "@c15t/react/iab/styles.css";
+ */
+@import "@c15t/ui/iab/styles.css";

package/src/iab/styles.tw3.css

@@ -1,10 +1,14 @@
 /**
  * @c15t/react/iab — Tailwind 3-compatible IAB component styles.
  *
- * Import this stylesheet before your app Tailwind globals so utility classes
- * can come after the c15t base rules.
+ * Add this stylesheet to the same global CSS entrypoint as your base c15t styles.
+ * Do not import either stylesheet from JS/TSX files.
  *
- * Usage:
- *   import '@c15t/react/iab/styles.tw3.css';
+ * Usage (src/index.css):
+ *   @tailwind base;
+ *   @tailwind components;
+ *   @import "@c15t/react/styles.tw3.css";
+ *   @import "@c15t/react/iab/styles.tw3.css";
+ *   @tailwind utilities;
  */
 @import "@c15t/ui/iab/styles.tw3.css";

package/src/styles.css

@@ -0,0 +1,10 @@
+/**
+ * @c15t/react — Non-IAB prebuilt component styles.
+ *
+ * Import this stylesheet once from your app-level CSS entrypoint
+ * when using prebuilt (styled) consent components.
+ *
+ * Usage (src/index.css):
+ *   @import "@c15t/react/styles.css";
+ */
+@import "@c15t/ui/styles.css";

package/src/styles.tw3.css

@@ -1,10 +1,13 @@
 /**
  * @c15t/react — Tailwind 3-compatible prebuilt component styles.
  *
- * Import this stylesheet before your app Tailwind globals so utility classes
- * can come after the c15t base rules.
+ * Import this stylesheet in the same global CSS entrypoint as Tailwind 3,
+ * after `@tailwind components;` and before `@tailwind utilities;`.
  *
- * Usage:
- *   import '@c15t/react/styles.tw3.css';
+ * Usage (src/index.css):
+ *   @tailwind base;
+ *   @tailwind components;
+ *   @import "@c15t/react/styles.tw3.css";
+ *   @tailwind utilities;
  */
 @import "@c15t/ui/styles.tw3.css";

package/styles.css

@@ -0,0 +1 @@
+@import "./dist/styles.css";

package/dist/components/shared/libs/policy-actions.cjs

@@ -1 +0,0 @@
-"use strict";const __rslib_import_meta_url__="u"<typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.d=(e,o)=>{for(var r in o)__webpack_require__.o(o,r)&&!__webpack_require__.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:o[r]})},__webpack_require__.o=(e,o)=>Object.prototype.hasOwnProperty.call(e,o),__webpack_require__.r=e=>{"u">typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{flattenPolicyActionGroups:()=>flattenPolicyActionGroups,hasPolicyHints:()=>hasPolicyHints,resolvePolicyActionGroups:()=>resolvePolicyActionGroups,resolvePolicyAllowedActions:()=>resolvePolicyAllowedActions,resolvePolicyDirection:()=>resolvePolicyDirection,resolvePolicyOrderedActions:()=>resolvePolicyOrderedActions,resolvePolicyPrimaryActions:()=>resolvePolicyPrimaryActions,resolvePolicyUiProfile:()=>resolvePolicyUiProfile,shouldFillPolicyActions:()=>shouldFillPolicyActions});const DEFAULT_POLICY_ACTIONS=["reject","accept","customize"];function dedupeActions(e){return e&&0!==e.length?[...new Set(e)]:[]}function resolvePolicyAllowedActions(e){let o=dedupeActions(e.allowedActions);return o.length>0?o:[...DEFAULT_POLICY_ACTIONS]}function flattenPolicyActionGroups(e){return e&&0!==e.length?e.flatMap(e=>Array.isArray(e)?e:[e]):[]}function resolvePolicyActionGroups(e){let o=dedupeActions(e.allowedActions);if(0===o.length)return[];if(!e.layout||0===e.layout.length)return[[...o]];let r=new Set(o),i=[],t=new Set;for(let o of e.layout){let e=dedupeActions(Array.isArray(o)?o:[o]).filter(e=>!(!r.has(e)||t.has(e))&&(t.add(e),!0));e.length>0&&i.push(e)}return i.length>0?i:[[...o]]}function resolvePolicyOrderedActions(e){return flattenPolicyActionGroups(resolvePolicyActionGroups({allowedActions:e.allowedActions,layout:e.layout}))}function resolvePolicyPrimaryActions(e){let o=e.orderedActions.includes("customize")?["customize"]:[];if(!e.primaryActions||0===e.primaryActions.length)return o;let r=e.primaryActions.filter(o=>e.orderedActions.includes(o));return r.length>0?r:o}function resolvePolicyDirection(e){return"column"===e?"column":"row"}function resolvePolicyUiProfile(e){return"balanced"===e||"compact"===e||"strict"===e?e:"compact"}function shouldFillPolicyActions(e){let o=resolvePolicyUiProfile(e.uiProfile),r=new Set(e.actionGroups.flat()).size,i=e.actionGroups.length>1,t="column"===e.direction;return"strict"===o||"balanced"===o&&(r<=2||3===r&&(i||t))}function hasPolicyHints(e){return!!e&&Object.values(e).some(e=>Array.isArray(e)?e.length>0:void 0!==e)}for(var __rspack_i in exports.flattenPolicyActionGroups=__webpack_exports__.flattenPolicyActionGroups,exports.hasPolicyHints=__webpack_exports__.hasPolicyHints,exports.resolvePolicyActionGroups=__webpack_exports__.resolvePolicyActionGroups,exports.resolvePolicyAllowedActions=__webpack_exports__.resolvePolicyAllowedActions,exports.resolvePolicyDirection=__webpack_exports__.resolvePolicyDirection,exports.resolvePolicyOrderedActions=__webpack_exports__.resolvePolicyOrderedActions,exports.resolvePolicyPrimaryActions=__webpack_exports__.resolvePolicyPrimaryActions,exports.resolvePolicyUiProfile=__webpack_exports__.resolvePolicyUiProfile,exports.shouldFillPolicyActions=__webpack_exports__.shouldFillPolicyActions,__webpack_exports__)-1===["flattenPolicyActionGroups","hasPolicyHints","resolvePolicyActionGroups","resolvePolicyAllowedActions","resolvePolicyDirection","resolvePolicyOrderedActions","resolvePolicyPrimaryActions","resolvePolicyUiProfile","shouldFillPolicyActions"].indexOf(__rspack_i)&&(exports[__rspack_i]=__webpack_exports__[__rspack_i]);Object.defineProperty(exports,"__esModule",{value:!0});

package/dist/components/shared/libs/policy-actions.js

@@ -1 +0,0 @@
-let t=["reject","accept","customize"];function e(t){return t&&0!==t.length?[...new Set(t)]:[]}function o(o){let n=e(o.allowedActions);return n.length>0?n:[...t]}function n(t){return t&&0!==t.length?t.flatMap(t=>Array.isArray(t)?t:[t]):[]}function r(t){let o=e(t.allowedActions);if(0===o.length)return[];if(!t.layout||0===t.layout.length)return[[...o]];let n=new Set(o),r=[],l=new Set;for(let o of t.layout){let t=e(Array.isArray(o)?o:[o]).filter(t=>!(!n.has(t)||l.has(t))&&(l.add(t),!0));t.length>0&&r.push(t)}return r.length>0?r:[[...o]]}function l(t){return n(r({allowedActions:t.allowedActions,layout:t.layout}))}function i(t){let e=t.orderedActions.includes("customize")?["customize"]:[];if(!t.primaryActions||0===t.primaryActions.length)return e;let o=t.primaryActions.filter(e=>t.orderedActions.includes(e));return o.length>0?o:e}function c(t){return"column"===t?"column":"row"}function u(t){return"balanced"===t||"compact"===t||"strict"===t?t:"compact"}function s(t){let e=u(t.uiProfile),o=new Set(t.actionGroups.flat()).size,n=t.actionGroups.length>1,r="column"===t.direction;return"strict"===e||"balanced"===e&&(o<=2||3===o&&(n||r))}function a(t){return!!t&&Object.values(t).some(t=>Array.isArray(t)?t.length>0:void 0!==t)}export{n as flattenPolicyActionGroups,a as hasPolicyHints,r as resolvePolicyActionGroups,o as resolvePolicyAllowedActions,c as resolvePolicyDirection,l as resolvePolicyOrderedActions,i as resolvePolicyPrimaryActions,u as resolvePolicyUiProfile,s as shouldFillPolicyActions};

package/dist-types/components/shared/libs/policy-actions.d.ts

@@ -1,26 +0,0 @@
-import type { PolicyUiAction, PolicyUiActionDirection, PolicyUiActionGroup, PolicyUiProfile, PolicyUiSurfaceConfig } from '../../../../../core/dist-types/index.d.ts';
-export type { PolicyUiAction, PolicyUiActionDirection, PolicyUiActionGroup, PolicyUiProfile, PolicyUiSurfaceConfig, };
-export declare function resolvePolicyAllowedActions(params: {
-    allowedActions?: PolicyUiAction[];
-}): PolicyUiAction[];
-export declare function flattenPolicyActionGroups(layout?: PolicyUiActionGroup[]): PolicyUiAction[];
-export declare function resolvePolicyActionGroups(params: {
-    allowedActions: PolicyUiAction[];
-    layout?: PolicyUiActionGroup[];
-}): PolicyUiAction[][];
-export declare function resolvePolicyOrderedActions(params: {
-    allowedActions: PolicyUiAction[];
-    layout?: PolicyUiActionGroup[];
-}): PolicyUiAction[];
-export declare function resolvePolicyPrimaryActions(params: {
-    orderedActions: PolicyUiAction[];
-    primaryActions?: PolicyUiAction[];
-}): PolicyUiAction[];
-export declare function resolvePolicyDirection(direction?: PolicyUiActionDirection): PolicyUiActionDirection;
-export declare function resolvePolicyUiProfile(profile?: PolicyUiProfile): PolicyUiProfile;
-export declare function shouldFillPolicyActions(params: {
-    uiProfile?: PolicyUiProfile;
-    actionGroups: PolicyUiAction[][];
-    direction?: PolicyUiActionDirection;
-}): boolean;
-export declare function hasPolicyHints(surface?: PolicyUiSurfaceConfig): boolean;