@c15t/nextjs 2.0.0-rc.9 → 2.0.2

package/docs/styling/slots.md

@@ -4,7 +4,7 @@ description: Target individual component parts with styles using the slot system
 ---
 ## What are Slots?
 
-Slots let you target specific parts of consent components with styles. Each component is built from named slots such as `consentBannerTitle` and `consentDialogFooter`.
+Slots let you target specific parts of consent components with styles. Each component is built from named slots such as `consentBannerTitle` and `consentDialogTag`.
 
 Use slots after the stock component APIs and design tokens:
 
@@ -88,6 +88,7 @@ Use the typed API reference below for the full slot list and descriptions. It st
 |consentBannerDescription|SlotStyle \|undefined|Banner description text element.|-|Optional|
 |consentBannerFooter|SlotStyle \|undefined|Footer container for banner action buttons.|-|Optional|
 |consentBannerFooterSubGroup|SlotStyle \|undefined|Nested button group inside the banner footer.|-|Optional|
+|consentBannerTag|SlotStyle \|undefined|Branding tag rendered above the consent banner card.|-|Optional|
 |consentBannerOverlay|SlotStyle \|undefined|Backdrop overlay rendered behind the banner when enabled.|-|Optional|
 |consentDialog|SlotStyle \|undefined|Root wrapper for the consent dialog modal.|-|Optional|
 |consentDialogCard|SlotStyle \|undefined|Main dialog card container.|-|Optional|
@@ -95,22 +96,25 @@ Use the typed API reference below for the full slot list and descriptions. It st
 |consentDialogTitle|SlotStyle \|undefined|Dialog title text element.|-|Optional|
 |consentDialogDescription|SlotStyle \|undefined|Dialog description text element.|-|Optional|
 |consentDialogContent|SlotStyle \|undefined|Dialog content region (typically holds ConsentWidget).|-|Optional|
-|consentDialogFooter|SlotStyle \|undefined|Dialog footer container with actions/branding.|-|Optional|
+|consentDialogFooter|SlotStyle \|undefined|Footer container used by compound dialog layouts.|-|Optional|
+|consentDialogTag|SlotStyle \|undefined|Branding tag rendered below the stock consent dialog card.|-|Optional|
 |consentDialogOverlay|SlotStyle \|undefined|Backdrop overlay rendered behind the dialog.|-|Optional|
 |consentWidget|SlotStyle \|undefined|Root wrapper for the consent widget/preferences panel.|-|Optional|
 |consentWidgetAccordion|SlotStyle \|undefined|Accordion region listing consent categories.|-|Optional|
 |consentWidgetFooter|SlotStyle \|undefined|Footer area for widget actions and links.|-|Optional|
-|consentWidgetBranding|SlotStyle \|undefined|Branding element rendered in the widget footer.|-|Optional|
+|consentWidgetTag|SlotStyle \|undefined|Branding tag rendered below the standalone consent widget.|-|Optional|
 |frame|SlotStyle \|undefined|Frame wrapper used by blocking placeholders (e.g., iframe blocking).|-|Optional|
 |iabConsentBanner|SlotStyle \|undefined|Root wrapper for the IAB consent banner.|-|Optional|
 |iabConsentBannerCard|SlotStyle \|undefined|Main card container for IAB banner content.|-|Optional|
 |iabConsentBannerHeader|SlotStyle \|undefined|Header region for IAB banner title/description.|-|Optional|
 |iabConsentBannerFooter|SlotStyle \|undefined|Footer container for IAB banner actions.|-|Optional|
+|iabConsentBannerTag|SlotStyle \|undefined|Branding tag rendered above the IAB banner card.|-|Optional|
 |iabConsentBannerOverlay|SlotStyle \|undefined|Backdrop overlay rendered behind the IAB banner.|-|Optional|
 |iabConsentDialog|SlotStyle \|undefined|Root wrapper for the IAB consent dialog.|-|Optional|
 |iabConsentDialogCard|SlotStyle \|undefined|Main card container for IAB dialog content.|-|Optional|
 |iabConsentDialogHeader|SlotStyle \|undefined|Header region for IAB dialog title/description.|-|Optional|
 |iabConsentDialogFooter|SlotStyle \|undefined|Footer container for IAB dialog actions.|-|Optional|
+|iabConsentDialogTag|SlotStyle \|undefined|Branding tag rendered below the IAB dialog card.|-|Optional|
 |iabConsentDialogOverlay|SlotStyle \|undefined|Backdrop overlay rendered behind the IAB dialog.|-|Optional|
 |buttonPrimary|SlotStyle \|undefined|Shared primary button style used across consent components.|-|Optional|
 |buttonSecondary|SlotStyle \|undefined|Shared secondary button style used across consent components.|-|Optional|

package/docs/styling/tailwind.md

@@ -18,17 +18,21 @@ Import the standard c15t stylesheet once in your app-level CSS entrypoint:
 
 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.
 
+With Tailwind v4, keep c15t at the end of the top-level `@import` block so Fumadocs, `tw-animate-css`, and other preset imports do not override c15t theme tokens.
+
 ### Tailwind v4
 
-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:
+Tailwind v4 automatically scans your source files. Import Tailwind normally, then keep the c15t stylesheet last in the top-level `@import` block so Fumadocs, `tw-animate-css`, or other preset styles load first. c15t component styles join Tailwind's `components` layer automatically, so no extra c15t-specific layer declaration is needed:
 
 ```css title="src/index.css"
 @import "tailwindcss";
+@import "tw-animate-css";
 @import "@c15t/react/styles.css";
 ```
 
 ```css title="app/globals.css"
 @import "tailwindcss";
+@import "tw-animate-css";
 @import "@c15t/nextjs/styles.css";
 ```
 
@@ -50,6 +54,24 @@ Import the Tailwind 3-compatible c15t stylesheet after `@tailwind components;` a
 @tailwind utilities;
 ```
 
+## Troubleshooting: Fumadocs Overrides c15t Styles
+
+If c15t components render partially unstyled or lose their theme tokens inside a Fumadocs site, check the order of the imports in `app/globals.css`.
+
+**Cause:** Fumadocs preset imports can load after c15t and override the tokens and layer output that c15t components depend on.
+
+**Fix:** Keep `@c15t/nextjs/styles.css` at the end of the top-level `@import` block:
+
+```css title="app/globals.css"
+@import "tailwindcss";
+@import "tw-animate-css";
+@import "fumadocs-ui/css/shadcn.css";
+@import "fumadocs-ui/css/preset.css";
+@import "@c15t/nextjs/styles.css";
+```
+
+If you use other preset or docs-site stylesheets, apply the same rule: load them first, then import c15t last in the top-level import block.
+
 ## Using Tailwind with Slots
 
 Apply Tailwind classes via the theme's `slots` object:

package/docs/styling/tokens.md

@@ -6,6 +6,8 @@ description: The six base token categories that control colors, typography, spac
 
 Color tokens define the palette for all consent components. Set `colors` for light mode and `dark` for dark mode overrides.
 
+When `textOnPrimary` is omitted, c15t derives it automatically from `primary` to keep text readable on primary-filled surfaces such as stock branding tags and buttons. Set `textOnPrimary` explicitly when you need a specific foreground color.
+
 ```tsx
 const theme = {
   colors: {
@@ -45,7 +47,7 @@ const theme = {
 |borderHover|string \|undefined|Hover state for bordered elements.|-|Optional|
 |text|string \|undefined|Primary text color for headings and body.|-|Optional|
 |textMuted|string \|undefined|Muted text color for secondary content.|-|Optional|
-|textOnPrimary|string \|undefined|Text color for content on primary background.|-|Optional|
+|textOnPrimary|string \|undefined|Text color for content on primary background. Auto-derived from \`primary\` when omitted.|-|Optional|
 |overlay|string \|undefined|Overlay color for modal backdrops.|-|Optional|
 |switchTrack|string \|undefined|Toggle track color (off state).|-|Optional|
 |switchTrackActive|string \|undefined|Toggle track color (on state).|-|Optional|

package/iab/styles.tw3.css

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

package/package.json

@@ -1,32 +1,48 @@
 {
 	"name": "@c15t/nextjs",
-	"version": "2.0.0-rc.9",
-	"description": "Developer-first CMP for Next.js: cookie banner, consent manager, preferences centre. GDPR ready with minimal setup and rich customization.",
+	"version": "2.0.2",
+	"description": "Headless cookie banner, consent manager & preference center for Next.js. App Router & Pages Router, RSC, GDPR/CCPA/LGPD/TCF compliant.",
 	"keywords": [
 		"nextjs",
+		"next",
+		"next-cookie-banner",
+		"nextjs-consent",
+		"next-cmp",
 		"consent",
 		"privacy",
 		"gdpr",
 		"ccpa",
 		"lgpd",
-		"server-side rendering",
+		"tcf",
+		"iab",
+		"cmp",
 		"react",
+		"headless",
 		"typescript",
 		"cookie-banner",
+		"cookie-consent",
 		"consent-management-platform",
-		"cmp",
+		"consent-management",
 		"consent-banner",
-		"user-consent",
-		"privacy-compliance",
-		"web-privacy"
+		"preference-center",
+		"app-router",
+		"pages-router",
+		"server-components",
+		"rsc",
+		"ssr",
+		"server-side-rendering",
+		"tracking-consent"
 	],
 	"homepage": "https://c15t.com/docs/frameworks/next/quickstart",
+	"bugs": {
+		"url": "https://github.com/c15t/c15t/issues"
+	},
 	"repository": {
 		"type": "git",
 		"url": "https://github.com/c15t/c15t.git",
 		"directory": "packages/nextjs"
 	},
-	"license": "GPL-3.0-only",
+	"license": "Apache-2.0",
 	"sideEffects": [
 		"**/*.css"
 	],
@@ -61,6 +77,7 @@
 		"dist-types",
 		"client",
 		"styles.css",
+		"styles.tw3.css",
 		"iab",
 		"src/styles.css",
 		"src/styles.tw3.css",
@@ -72,20 +89,20 @@
 		"build": "bun prebuild && rslib build && bun ../../scripts/normalize-dist-types.mjs && bun scripts/generate-distribution-css.ts && bun ../../scripts/agent-docs/generate-package-docs.ts @c15t/nextjs",
 		"build:agent-docs": "bun ../../scripts/agent-docs/generate-package-docs.ts @c15t/nextjs",
 		"check-types": "bun prebuild && tsc --noEmit",
-		"dev": "bun prebuild && rslib build && bun ../../scripts/normalize-dist-types.mjs && bun scripts/generate-distribution-css.ts",
+		"dev": "sh -c 'bun prebuild && rslib build --no-dts --no-clean && bun scripts/generate-distribution-css.ts && rslib build --watch --no-dts --no-clean'",
 		"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/nextjs",
+		"prepack": "bun run build",
 		"test": "bun prebuild && vitest run --passWithNoTests",
 		"test:watch": "bun prebuild && vitest --passWithNoTests"
 	},
 	"dependencies": {
-		"@c15t/react": "2.0.0-rc.9",
-		"@c15t/translations": "2.0.0-rc.8",
-		"c15t": "2.0.0-rc.8"
+		"@c15t/react": "2.0.2",
+		"@c15t/translations": "2.0.0",
+		"c15t": "2.0.0"
 	},
 	"devDependencies": {
-		"@c15t/typescript-config": "0.0.1-beta.1",
+		"@c15t/typescript-config": "0.0.1",
 		"@c15t/vitest-config": "1.0.0",
 		"genversion": "3.2.0",
 		"typescript": "6.0.2"

package/readme.json

@@ -1,6 +1,6 @@
 {
 	"title": "@c15t/nextjs: Next.js Integration",
-	"description": "Developer-first CMP for Next.js: cookie banner, consent manager, preferences centre. GDPR ready with minimal setup and rich customization",
+	"description": "Headless cookie banner, consent manager & preference center for Next.js. App Router & Pages Router, RSC, GDPR/CCPA/LGPD/TCF compliant.",
 	"features": [
 		"Works with Next.js 15, 14, and 13",
 		"Full 'use client' support for React Server Components",
@@ -15,7 +15,7 @@
 		"Next.js 13.5.4 or later",
 		"React 18 or later",
 		"Node.js 18.17.0 or later",
-		"A hosted [c15t instance](https://consent.io) (free sign-up) or [self-hosted deployment](https://c15t.com/docs/self-host/v2)"
+		"A hosted [c15t instance](https://inth.com) (free sign-up) or [self-hosted deployment](https://c15t.com/docs/self-host/v2)"
 	],
 	"manualInstallation": [
 		"",
@@ -25,14 +25,14 @@
 		"",
 		"```css\n/* app/globals.css */\n@import \"@c15t/nextjs/styles.css\";\n```",
 		"",
-		"To manually install, follow the guide in our [docs – manual setup](https://c15t.com/docs/frameworks/nextjs/quickstart#manual-setup)."
+		"To manually install, follow the guide in our [docs – manual setup](https://c15t.com/docs/frameworks/next/quickstart#manual-setup)."
 	],
 	"usage": [
 		"Import `ConsentManagerProvider` in your app's root layout",
-		"Add `CookieBanner` and `ConsentManagerDialog` components",
+		"Add `ConsentBanner` and `ConsentDialog` components",
 		"Customise styling and behaviour to fit your app",
 		"For full implementation details, see the [Next.js quickstart docs](https://c15t.com/docs/frameworks/next/quickstart)",
-		"```tsx\n// app/layout.tsx\nimport { ConsentManagerProvider, CookieBanner } from '@c15t/nextjs'\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <ConsentManagerProvider>\n          {children}\n          <CookieBanner />\n        </ConsentManagerProvider>\n      </body>\n    </html>\n  )\n}\n```"
+		"```tsx\n// app/layout.tsx\nimport {\n  ConsentManagerProvider,\n  ConsentBanner,\n  ConsentDialog,\n} from '@c15t/nextjs'\n\nexport default function RootLayout({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <ConsentManagerProvider>\n          {children}\n          <ConsentBanner />\n          <ConsentDialog />\n        </ConsentManagerProvider>\n      </body>\n    </html>\n  )\n}\n```"
 	],
 	"docsLink": "https://c15t.com/docs/frameworks/next/quickstart",
 	"quickStartLink": "https://c15t.com/docs/frameworks/next/quickstart",

package/styles.tw3.css

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