Skip to content
Documentation

Per-category consent

By default <ConsentBanner /> is a single accept/decline. Pass categories to switch it into a checklist with “Accept all” / “Decline all” / “Save preferences” actions instead:

<ConsentBanner
categories={[
{ id: 'analytics', label: 'Analytics', description: 'Helps us understand site usage.' },
{ id: 'marketing', label: 'Marketing', description: 'Used for ad personalization.' },
]}
/>

Try it live on the Demo page.

gateScript, getConsent, whenAccepted, and setConsent all take a category argument, defaulting to 'all' — the implicit category used when you don’t pass categories at all:

gateScript({ src: 'https://example.com/analytics.js', category: 'analytics' });
getConsent('analytics'); // 'accept' | 'decline' | null
whenAccepted(() => {
/* ... */
}, 'analytics');

Only include categories that genuinely need a yes/no under your privacy policy. “Necessary” cookies — ones that don’t legally require consent — aren’t a category here; just load those scripts directly, without gateScript().

Each category entry supports a default flag to pre-check it:

{ id: 'analytics', label: 'Analytics', default: true }

Leave this false (the default) unless you have a specific, defensible reason to pre-select it. Pre-ticked consent boxes are a recognized dark pattern under GDPR guidance — see GDPR-related features for more on this.