@certuscyber/consent-react

LGPD consent management SDK for React 18/19, Next.js, and Lovable apps. Mirrors @certuscyber/consent-vue behavior.

Demo local

nvm use
cp .env.example .env   # ajuste VITE_PUBLIC_KEY e VITE_API_URL
npm install
npm run dev            # http://localhost:5175

npm

npm install @certuscyber/consent-react

Import styles in your app entry (or _app.tsx / layout.tsx):

import '@certuscyber/consent-react/style.css';

Imperative (script tag / non-React host)

import { initCertusConsent } from '@certuscyber/consent-react';

await initCertusConsent({
  publicKey: 'YOUR_PUBLIC_KEY',
  baseUrl: 'https://consent-backend.certuscyber.com.br', // optional
});

React component

import '@certuscyber/consent-react/style.css';
import { CertusConsentRoot } from '@certuscyber/consent-react';

export default function App() {
  return (
    <>
      <CertusConsentRoot publicKey="YOUR_PUBLIC_KEY" />
      {/* your app */}
    </>
  );
}

Hook

import { useConsent } from '@certuscyber/consent-react';

function MyComponent() {
  const { consentState, acceptAll, openPreferences } = useConsent();
  // ...
}

Global API

After init, window.__CERTUS_CONSENT__ exposes openPreferences, withdrawConsent, acceptAll, rejectAll, and saveCustom.

CDN

Add before </body>:

<script
  src="https://cdn.certuscyber.com.br/consent-react.min.js"
  data-key="YOUR_PUBLIC_KEY"
  data-api="https://consent-backend.certuscyber.com.br"
  defer
></script>

• data-key (required): public key from the Certus Consent admin panel.
• data-api (optional): backend base URL. Defaults to production API when omitted.

Styles are bundled in the CDN build; no separate CSS file is required.

Exports

| Export | Description | |--------|-------------| | initCertusConsent | Init + optional host mount | | initConsent | Init only (Vue parity) | | mountConsentHost | Mount banner widget on document.body | | CertusConsentRoot | React portal wrapper | | useConsent | Hook with config, state, and actions | | acceptAll, rejectAll, saveCustom, openPreferences, withdrawConsent | Imperative actions |

Default backend when baseUrl is empty: https://consent-backend.certuscyber.com.br