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

    Interface FloatingPreferencesButtonProps

    Propriedades para customizar o comportamento e aparência do FloatingPreferencesButton.

    Interface que permite controle completo sobre o botão flutuante de preferências LGPD. O botão aparece após o consentimento inicial para permitir que usuários revisitem suas escolhas a qualquer momento.

    Suporta 4 posições fixas na tela:

    • bottom-left: Canto inferior esquerdo
    • bottom-right: Canto inferior direito (padrão)
    • top-left: Canto superior esquerdo
    • top-right: Canto superior direito
    • Ícone: Pode ser substituído por qualquer ReactNode
    • Tooltip: Texto exibido ao hover (padrão vem de useConsentTexts)
    • Cores: Respeita design tokens ou tema MUI
    • Offset: Distância da borda em pixels
    • Auto-hide: Opcional via hideWhenConsented (padrão: false)
    • Z-index: 1200 (acima de conteúdo normal, abaixo de modais MUI)
    • Transições: Suaves via tema MUI

    Components

    0.3.0

    <FloatingPreferencesButton
      position="bottom-left"
      offset={16}
    />

    import SettingsIcon from '@mui/icons-material/Settings'

    <FloatingPreferencesButton
      position="top-right"
      offset={32}
      icon={<SettingsIcon />}
      tooltip="Configurações de Privacidade"
      hideWhenConsented={true}
      FabProps={{
        size: 'large',
        color: 'secondary',
        sx: { boxShadow: 3 }
      }}
    />
    interface FloatingPreferencesButtonProps {
        FabProps?: Partial<FabProps>;
        hideWhenConsented?: boolean;
        icon?: ReactNode;
        offset?: number;
        position?: "bottom-left" | "bottom-right" | "top-left" | "top-right";
        tooltip?: string;
    }
    Index

    Properties

    FabProps? hideWhenConsented? icon? offset? position? tooltip?

    Properties

    FabProps?: Partial<FabProps>

    Props adicionais para o componente Fab do Material-UI.

    Permite customização completa do botão: tamanho, cor, elevação, sx, etc. Props passadas aqui sobrescrevem os defaults internos.

    undefined

    <FloatingPreferencesButton
      FabProps={{
        size: 'large',
        color: 'secondary',
        variant: 'extended',
        sx: { borderRadius: 2 }
      }}
    />
    hideWhenConsented?: boolean

    Se deve esconder o botão quando consentimento já foi dado.

    Útil para reduzir poluição visual após decisão inicial. Quando true, botão só aparece se consented === false.

    Importante: Mesmo escondido, usuário pode reabrir preferências via outras formas (ex: link no footer, menu de configurações).

    false
    icon?: ReactNode

    Ícone customizado para o botão.

    Pode ser qualquer ReactNode: ícone do MUI, SVG, imagem, texto, etc. Se omitido, usa <CookieOutlined /> do Material-UI Icons.

    <CookieOutlined />

    import SettingsIcon from '@mui/icons-material/Settings'
    <FloatingPreferencesButton icon={<SettingsIcon />} />
    offset?: number

    Offset (distância) da borda em pixels.

    Aplicado tanto horizontal quanto verticalmente dependendo da posição. Exemplo: offset={24} em bottom-right = 24px da direita e 24px do fundo.

    24
    position?: "bottom-left" | "bottom-right" | "top-left" | "top-right"

    Posição do botão flutuante na tela.

    Define o canto da viewport onde o botão será fixado. Usa position: fixed e responde a scroll da página.

    'bottom-right'
    tooltip?: string

    Tooltip customizado exibido ao passar o mouse.

    Se omitido, usa o valor de texts.preferencesButton do contexto, com fallback para "Gerenciar Preferências de Cookies".

    undefined (usa texto do contexto)

    <FloatingPreferencesButton tooltip="Configurações de Privacidade" />

    Settings

    Member Visibility

    On This Page

    PosicionamentoCustomização VisualComportamento
    Properties