Cookie Consent

A cookie consent banner and a preferences modal, built on vanilla-cookieconsent and themed to your tokens. This is the pack-cookies pack, and it is free.

No special integration needed

Frontend only. No backend files, no Prisma models, no environment variables, no third-party account. It does not even need a starter: it is the one feature pack with no capability requirements, so it installs on the bare template.

What you get

• A consent banner on first visit, with accept, reject, and manage buttons.
• A preferences modal with per-category toggles (necessary, analytics, marketing), reachable again through the CookieConsentAction button you can place in a footer or settings page.
• Revocable consent. Users can change their mind and the change fires the same events.
• Script gating: your analytics or marketing tags subscribe to consent events and only load once allowed.
• Styling from your semantic theme tokens, so it matches the rest of the app in light and dark mode.
• Every string in the message catalog, so it translates with everything else.

How it mounts

The pack adds a CookieConsentProvider to the app's root providers through the manifest's providers field. Nothing else in your tree changes. Choices persist in a first-party cc_cookie, and vanilla-cookieconsent fires cc:onConsent and cc:onChange on window, which is how you gate a script:

import * as CookieConsent from "vanilla-cookieconsent";

window.addEventListener("cc:onConsent", () => {
  if (CookieConsent.acceptedCategory("analytics")) {
    // load your analytics client here
  }
});

The category ids live in COOKIE_CATEGORIES next to the config, so a typo is a type error.

Environment variables

None.