react-lgpd-consent - v0.3.4
    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 {
        blocking?: boolean;
        debug?: boolean;
        hideBranding?: boolean;
        PaperProps?: Partial<PaperProps>;
        policyLinkUrl?: string;
        SnackbarProps?: Partial<SnackbarProps>;
    }
    Index

    Properties

    blocking? debug? hideBranding? PaperProps? policyLinkUrl? SnackbarProps?

    Properties

    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
    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"
    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
    }}

    Settings

    Member Visibility

    On This Page

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