API reference

`<ConsentProvider>`

Prop	Type	Default
`adapter`	`ConsentAdapter`	`local()`	Which CMP to talk to.
`consentMode`	`boolean \| "auto"`	`"auto"`	Mirror consent into Google Consent Mode.
`services`	`ServiceSpec[]`	—	Services to list before they mount.
`onChange`	`(state: ConsentState) => void`	—	Called whenever consent changes.

`useConsent()`

const {
  ready,        // the CMP has loaded and answered
  hasDecision,  // the user actually chose
  view,         // "hidden" | "banner" | "settings"
  isOpen,       // view !== "hidden"
  categories,   // { essential: true, analytics: false, … }
  has,          // (category | serviceId | ServiceSpec) => boolean
  open,
  openSettings,
  close,
  acceptAll,
  rejectAll,
  reset,
  supports,     // which of the actions above this CMP can do
  services,     // registered services, for building a UI
  cmp,          // { id, name }
  state,        // the raw ConsentState
} = useConsent();

`useHasConsent(target)`

useHasConsent("analytics");
useHasConsent("hotjar");
useHasConsent({ id: "acme", category: "marketing", aliases: ["Acme Ltd."] });

A bare string is a category when the CMP knows one by that name, and a service otherwise.

`useCookieService(spec)`

Registers the service and returns whether it may run. <CookieService> is this plus conditional rendering.

`useConsentForm()`

const {
  categories, // [{ category, granted, locked, services, toggle }]
  dirty,      // the draft differs from what is saved
  save,
  acceptAll,
  rejectAll,
} = useConsentForm();

Needs a platform that accepts consent from your own UI (supports.setConsent). See The banner.

`<CookieService>`

Prop	Type
`id`	`string`	Required. A catalog id fills in everything else.
`name`	`string`	Label in the preferences UI.
`category`	`CategoryName`	What gates it. Defaults to `functional`.
`description`	`string`	One line for the preferences UI.
`aliases`	`string[]`	Other names CMPs file it under.
`consentMode`	`boolean`	Render regardless and let Consent Mode gate it.
`fallback`	`ReactNode`	Shown while consent is missing.
`children`	`ReactNode \| (granted: boolean) => ReactNode`

`<ConsentScript>`

Takes the same service props, plus:

Prop	Type
`src`	`string`	External script URL.
`children`	`string`	Inline script body.
`attributes`	`Record<string, string>`	Extra attributes for the tag.
`onLoad`	`() => void`

Adapters

local(options?) — the built-in CMP
localStorageAdapter, cookieStorage(options?) — storage backends
defineAdapter(definition) — write your own
loadScript(src, attributes?), waitFor(getter, options?) — the helpers, standalone

consentModeSnippet(waitForUpdate?) — the consent default snippet, as a string
toConsentModeSignals(state) — categories → Google's four signals

Helpers

The same functions the hooks use, usable outside React:

hasConsent(state, target)
hasCategoryConsent(state, category)
hasServiceConsent(state, service)
listCategories(state)
resolveService(spec) — apply the catalog and the defaults
normalizeId(value) — the key-folding rule
catalog — the built-in service catalog
ConsentStore — the store the provider drives

Constants

CATEGORIES — ["essential", "functional", "analytics", "marketing"]
OPTIONAL_CATEGORIES — the three the user can turn off
INITIAL_STATE — nothing known, nothing granted
DEFAULT_STORAGE_KEY — "libconsent"

On this page