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

    Interface CookieBannerProps

    Propriedades para customizar o comportamento e aparência do componente CookieBanner.

    Esta interface permite controle completo sobre o banner de consentimento, desde o comportamento de exibição até a customização visual avançada. O banner pode operar em dois modos principais: bloqueante (modal) ou não-bloqueante (snackbar).

    • Bloqueante (blocking: true): Banner como modal sobreposto, impede interação
    • Não-bloqueante (blocking: false): Banner como snackbar, permite navegação
    • Suporte completo a theming via ThemeProvider
    • Props diretas para componentes internos (SnackbarProps, PaperProps)
    • Compatibilidade com design tokens customizados
    • Responsividade automática em diferentes viewport sizes
    • Prop debug força exibição independente do estado de consentimento
    • Logging automático de interações do usuário quando ativo
    • Suporte a React DevTools para inspecionar props
    <CookieBanner
      policyLinkUrl="/privacy-policy"
      blocking={false}
    />

    <CookieBanner
      policyLinkUrl="https://example.com/cookies"
      blocking={true}
      hideBranding={true}
      debug={process.env.NODE_ENV === 'development'}
      SnackbarProps={{
        anchorOrigin: { vertical: 'top', horizontal: 'center' }
      }}
      PaperProps={{
        elevation: 8,
        sx: { borderRadius: 2 }
      }}
    />

    0.1.0

    interface CookieBannerProps {
        anchor?: "center" | "left" | "right";
        blocking?: boolean;
        debug?: boolean;
        hideBranding?: boolean;
        language?: "fr" | "pt" | "en" | "es" | "de" | "it";
        offset?: number;
        PaperProps?: Partial<PaperProps>;
        policyLinkUrl?: string;
        position?: "bottom" | "top";
        SnackbarProps?: Partial<SnackbarProps>;
        termsLinkUrl?: string;
        texts?: Partial<AdvancedConsentTexts>;
        textVariant?: "formal" | "casual" | "concise" | "detailed";
    }
    Index

    Properties

    anchor? blocking? debug? hideBranding? language? offset? PaperProps? policyLinkUrl? position? SnackbarProps? termsLinkUrl? texts? textVariant?

    Properties

    anchor?: "center" | "left" | "right"

    Âncora horizontal do banner (left/center/right). Útil para alinhar o snackbar ou banners com largura menor que 100%.

    blocking?: boolean

    Controla se o banner bloqueia interação com o restante da página.

    • true: Banner como modal/overlay, bloqueia interação até decisão
    • false: Banner como snackbar, permite navegação normal

    Banner bloqueante é mais eficaz para compliance, mas pode afetar UX.

    true
    debug?: boolean

    Força exibição do banner em modo de debug, independente do consentimento.

    Útil durante desenvolvimento para testar diferentes estados visuais. Nunca deixe true em produção - causará exibição permanente do banner.

    false
    hideBranding?: boolean

    Oculta a marca "fornecido por LÉdipO.eti.br" no banner.

    A biblioteca é open-source e gratuita. O branding é uma forma de apoiar o projeto, mas pode ser removido se necessário para sua marca.

    false
    language?: "fr" | "pt" | "en" | "es" | "de" | "it"

    Idioma local para resolver texts.i18n. Se omitido, usa o idioma do contexto (quando configurado no Provider).

    offset?: number

    Offset em px para afastar o banner das bordas da viewport. Exemplo: offset={64} empurra o banner 64px para cima quando position="bottom".

    PaperProps?: Partial<PaperProps>

    Propriedades personalizadas para o componente Paper que envolve o conteúdo.

    Permite customização avançada da aparência: elevação, bordas, cores, etc. Aplicado em ambos os modos (bloqueante e não-bloqueante).

    PaperProps={{
      elevation: 12,
      sx: {
        borderRadius: '16px',
        border: '2px solid',
        borderColor: 'primary.main'
      }
    }}
    policyLinkUrl?: string

    URL para a política de privacidade ou cookies do site.

    Quando fornecida, aparece como link "Política de Privacidade" no banner. Link abre em nova aba/janela (target="_blank") por segurança.

    "/privacy-policy" | "https://example.com/cookies"
    position?: "bottom" | "top"

    Posição vertical do banner (top/bottom). Sobrescreve designTokens.layout.position quando definido.

    SnackbarProps?: Partial<SnackbarProps>

    Propriedades personalizadas para o componente Snackbar (modo não-bloqueante).

    Aplica-se apenas quando blocking={false}. Permite customização completa da posição, animação e comportamento do snackbar do Material-UI.

    SnackbarProps={{
      anchorOrigin: { vertical: 'top', horizontal: 'center' },
      autoHideDuration: null, // Banner fica até decisão do usuário
      TransitionComponent: Slide
    }}
    termsLinkUrl?: string

    URL para os termos de uso do site (opcional). Quando fornecida, será considerada uma rota "segura" para não aplicar bloqueio total (overlay) mesmo em modo bloqueante.

    texts?: Partial<AdvancedConsentTexts>

    Textos customizados para o banner. Permite sobrescrever textos do contexto e aplicar i18n localmente.

    textVariant?: "formal" | "casual" | "concise" | "detailed"

    Variação de tom local para resolver texts.variants.

    Settings

    Member Visibility

    On This Page

    Modos de ExibiçãoIntegração com Material-UIDebug e Desenvolvimento
    Properties