react-lgpd-consent - v0.3.4
    Preparing search index...

    Interface ConsentProviderProps

    Propriedades do componente ConsentProvider - configuração principal da biblioteca.

    Types

    0.1.0

    <ConsentProvider
    categories={{ enabledCategories: ['analytics'] }}
    >
    <App />
    </ConsentProvider>
    <ConsentProvider
    categories={{
    enabledCategories: ['analytics', 'functional'],
    }}
    texts={{
    bannerMessage: 'Utilizamos cookies conforme LGPD...',
    controllerInfo: 'Controlado por: Ministério XYZ - CNPJ: 00.000.000/0001-00',
    dataTypes: 'Coletamos: dados de navegação para análise estatística',
    userRights: 'Direitos: acessar, corrigir, excluir dados',
    contactInfo: 'DPO: dpo@ministerio.gov.br'
    }}
    onConsentGiven={(state) => console.log('Consentimento:', state)}
    >
    <App />
    </ConsentProvider>
    interface ConsentProviderProps {
        blocking?: boolean;
        blockingStrategy?: "auto" | "provider" | "component";
        categories?: ProjectCategoriesConfig;
        children: ReactNode;
        cookie?: Partial<ConsentCookieOptions>;
        CookieBannerComponent?: ComponentType<CustomCookieBannerProps>;
        cookieBannerProps?: Record<string, any>;
        designTokens?: DesignTokens;
        disableDeveloperGuidance?: boolean;
        disableFloatingPreferencesButton?: boolean;
        FloatingPreferencesButtonComponent?: ComponentType<
            CustomFloatingPreferencesButtonProps,
        >;
        floatingPreferencesButtonProps?: Record<string, any>;
        hideBranding?: boolean;
        initialState?: ConsentState;
        onConsentGiven?: (state: ConsentState) => void;
        onPreferencesSaved?: (prefs: ConsentPreferences) => void;
        PreferencesModalComponent?: ComponentType<CustomPreferencesModalProps>;
        preferencesModalProps?: Record<string, any>;
        texts?: Partial<ConsentTexts>;
        theme?: any;
    }
    Index

    Properties

    blocking?: boolean

    Comportamento do banner de consentimento:

    • false (padrão): Banner não-intrusivo, usuário pode navegar livremente
    • true: Banner bloqueia interação até decisão (compliance rigorosa)
    blockingStrategy?: "auto" | "provider" | "component"

    Estratégia de bloqueio quando blocking estiver habilitado.

    • 'auto' (padrão):
      • Se usar o banner padrão da lib, o bloqueio visual/funcional fica a cargo do próprio banner.
      • Se usar CookieBannerComponent custom, o Provider NÃO cria overlay; o bloqueio fica a cargo do componente custom (compatibilidade atual).
    • 'provider': o Provider cria um overlay de bloqueio por cima da aplicação (e abaixo do banner), garantindo que cliques sejam bloqueados, independentemente do banner custom implementar ou não esse comportamento.
    • 'component': nenhum overlay do Provider; espera-se que o banner (padrão ou custom) trate o bloqueio.

    Observações:

    • Visual do overlay do Provider controlado por designTokens.layout.backdrop:
      • false: overlay transparente (bloqueia cliques sem escurecer — útil quando o app já possui um dark-filter visual próprio).
      • string (ex.: 'rgba(0,0,0,0.4)'): overlay com escurecimento gerenciado pela lib.
    • A11y: recomenda-se que o banner use semântica de diálogo (role="dialog", aria-modal="true") e trap de foco.

    Configuração das categorias de cookies utilizadas no projeto. Define quais categorias padrão serão habilitadas.

    categories={{ enabledCategories: ['analytics'] }}
    
    categories={{ enabledCategories: ['analytics', 'marketing'] }}
    
    children: ReactNode

    Elementos filhos - toda a aplicação que precisa de contexto de consentimento.

    cookie?: Partial<ConsentCookieOptions>

    Configurações do cookie de consentimento. Valores não fornecidos usam padrões seguros para LGPD.

    cookie={{
    name: 'meuAppConsent',
    maxAgeDays: 180,
    sameSite: 'Strict'
    }}
    CookieBannerComponent?: ComponentType<CustomCookieBannerProps>

    Componente customizado para substituir o banner padrão de cookies. Se não fornecido, o CookieBanner padrão será renderizado. Deve implementar a lógica de consentimento usando as props definidas em CustomCookieBannerProps.

    cookieBannerProps?: Record<string, any>

    Props adicionais passadas para o banner customizado.

    designTokens?: DesignTokens

    Tokens de design para customização visual avançada. Oferece controle direto sobre cores, fontes, espaçamento e layout.

    designTokens={{
    colors: { background: '#000', text: '#fff' },
    typography: { fontFamily: ''Inter', sans-serif' },
    spacing: { borderRadius: { banner: 0 } }
    }}
    disableDeveloperGuidance?: boolean

    Desabilita os avisos e sugestões para desenvolvedores no console. Útil para ambientes de produção ou quando os avisos não são desejados. Por padrão, os avisos já são desabilitados em builds de produção.

    disableFloatingPreferencesButton?: boolean

    Desabilita o botão flutuante de preferências. Útil quando o usuário da lib quer ter controle total sobre o acesso às preferências.

    FloatingPreferencesButtonComponent?: ComponentType<
        CustomFloatingPreferencesButtonProps,
    >

    Componente customizado para substituir o botão flutuante de preferências. Se não fornecido, o FloatingPreferencesButton padrão será renderizado. Deve implementar a lógica de consentimento usando as props definidas em CustomFloatingPreferencesButtonProps.

    floatingPreferencesButtonProps?: Record<string, any>

    Props adicionais passadas para o botão flutuante customizado.

    hideBranding?: boolean

    Oculta o branding "fornecido por LÉdipO.eti.br" dos componentes.

    initialState?: ConsentState

    Estado inicial do consentimento para hidratação SSR.

    // Em Next.js para evitar flash do banner
    <ConsentProvider initialState={{ consented: true, preferences: {...} }}>
    onConsentGiven?: (state: ConsentState) => void

    Callback executado quando usuário dá consentimento pela primeira vez. Útil para inicializar analytics, registrar evento, etc.

    onConsentGiven={(state) => {
    console.log('Consentimento registrado:', state)
    // Inicializar Google Analytics, etc.
    }}
    onPreferencesSaved?: (prefs: ConsentPreferences) => void

    Callback executado quando usuário modifica preferências. Executado após salvar as mudanças.

    onPreferencesSaved={(prefs) => {
    console.log('Novas preferências:', prefs)
    // Reconfigurar scripts baseado nas preferências
    }}
    PreferencesModalComponent?: ComponentType<CustomPreferencesModalProps>

    Componente customizado para substituir o modal padrão de preferências. Deve implementar a lógica de consentimento usando as props definidas em CustomPreferencesModalProps.

    preferencesModalProps?: Record<string, any>

    Props adicionais passadas para o modal customizado.

    texts?: Partial<ConsentTexts>

    Textos customizados da interface (banner e modal). Todos os campos são opcionais - valores não fornecidos usam o padrão em português.

    texts={{
    bannerMessage: 'We use cookies...',
    acceptAll: 'Accept All',
    declineAll: 'Reject'
    }}
    texts={{
    controllerInfo: 'Controlado por: Empresa XYZ - CNPJ: 12.345.678/0001-90',
    dataTypes: 'Coletamos: endereço IP, preferências de navegação',
    userRights: 'Você pode solicitar acesso, correção ou exclusão dos dados'
    }}
    theme?: any

    Tema customizado Material-UI aplicado aos componentes. Aceita qualquer objeto que será passado para ThemeProvider.

    theme={{
    palette: { primary: { main: '#1976d2' } },
    components: { MuiButton: { styleOverrides: { root: { borderRadius: 8 } } } }
    }}