import { type EventEmitter } from '../../stencil-public-runtime'; import type { CookiebarMode, CookiebarOutputData } from './cookiebar.types'; /** * O `br-cookiebar` avisa sobre o uso de cookies e registra o consentimento da pessoa, por categoria e por cookie. * * Ele aparece como uma barra no rodapé (`mode="default"`) e abre um painel com as categorias quando a pessoa escolhe "Definir Cookies" (`mode="open"`). * * ### Como usar * * 1. Escreva o texto da barra em `info-text`. * 2. Coloque o título e a introdução do painel em um `br-cookiebar-header`. * 3. Crie um `br-cookiebar-group` por categoria e, dentro dele, um `br-cookiebar-cookie` por cookie. Use `group-opt-out="false"` nas categorias que não podem ser desativadas. * 4. Adicione os links de política em `br-cookiebar-link`, no slot `links`. * 5. Ouça `brCookiebarResponse` para salvar a escolha e ative `show` somente enquanto não houver escolha salva. * * ```html * * * * * * * * * * ``` * * ```js * const cookiebar = document.querySelector('br-cookiebar'); * cookiebar.show = !localStorage.getItem('consentimento'); * cookiebar.addEventListener('brCookiebarResponse', (event) => { * localStorage.setItem('consentimento', JSON.stringify(event.detail)); * }); * ``` * * `event.detail` traz o estado de cada categoria (`cookieGroups`) e de cada cookie (`cookieList`). Para reabrir o painel depois, por exemplo num link "Preferências de cookies", chame `openPanel()`. * * ### Quando evitar * * - Avisos que não tratam de consentimento: use `br-message` ou `br-notification`. * * Consulte as [diretrizes de design do GovBR](https://www.gov.br/ds/components/cookiebar?tab=designer). * * @category Feedback, Sobreposições * @status stable * @slot default - Recebe os subcomponentes `br-cookiebar-group`, `br-cookiebar-note-group` e `br-cookiebar-note`. * @slot header - Recebe `br-cookiebar-header` ou HTML livre. * @slot links - Recebe links complementares (`br-cookiebar-link` ou elementos `` livres). * @slot actions - Recebe botões de ação. Se vazio, o componente renderiza os botões padrão. * * @part container - Container raiz do componente. * @part default-panel - Painel fechado (modo default). * @part open-panel - Painel expandido (modo open). * @part header - Cabeçalho do painel aberto. * @part body - Corpo do painel aberto (com rolagem). * @part footer - Rodapé com botões de ação. * @part scrim - Camada de sobreposição opcional. */ export declare class Cookiebar { el: HTMLBrCookiebarElement; /** * Descrição do painel `open` espelhada no Shadow DOM para uso em `aria-describedby`. * Derivada do `entryText` do `br-cookiebar-header` filho (quando presente). * Necessária porque `aria-describedby` não cruza o limite shadow/light DOM. */ private openPanelDescription; /** Indica se há conteúdo no slot `actions`. Controla a exibição da área de ações. */ private hasActionsSlot; /** Indica se há conteúdo no slot `header`. Controla a exibição da área de cabeçalho. */ private hasHeaderSlot; /** Indica se há conteúdo no slot `links`. Controla a exibição da área de links. */ private hasLinksSlot; /** Indica se o viewport está no breakpoint mobile (x-small, ≤575px). */ private isMobile; /** * Texto anunciado pela região `aria-live` ao exibir o painel default. * Mantido em elemento sr-only separado para não interferir com o foco do container. */ private openLiveAnnouncement; /** Estado atual do checkbox "Selecionar tudo": `true`, `false` ou `'indeterminate'`. */ private selectAllState; /** Identificador único; gerado automaticamente quando omitido. */ readonly customId: string; /** * Controla a visibilidade do componente. * O consumidor é responsável por definir este valor com base na persistência do consentimento * (ex: verificar se já existe um cookie de consentimento salvo). */ show: boolean; /** * Estado visual atual do painel. Valores inválidos usam `default`. * - `default`: barra inferior com texto e botões. * - `open`: painel de tela cheia com grupos de cookies configuráveis. */ mode: CookiebarMode; /** * Define se o cookiebar opera no padrão opt-out (`true`, recomendado) ou opt-in (`false`). * - **opt-out** (`true`): botão secundário "Definir Cookies"; usuário pode configurar cookies. * - **opt-in** (`false`): botão secundário "Ver Política de Cookies"; painel é somente leitura. */ readonly allOptOut: boolean; /** Texto informativo exibido na barra inferior (modo default), descrevendo a política de cookies. */ readonly infoText: string; /** Texto do botão primário de aceite. Padrão: `Aceitar`. */ readonly acceptButton: string; /** * Texto do botão de rejeição dos cookies não obrigatórios. * Exibido apenas quando `show-reject-button="true"`. */ readonly rejectButton: string; /** * Quando `true`, exibe o botão "Rejeitar não obrigatórios" nos painéis default e open. * Cookies de grupos com `group-opt-out="false"` (sempre ativos) não são afetados. */ readonly showRejectButton: boolean; /** Texto do botão secundário quando `all-opt-out="true"`. */ readonly optOutButton: string; /** Texto do botão secundário quando `all-opt-out="false"`. */ readonly optInButton: string; /** * `aria-label` do botão fechar exibido no canto do painel expandido (`mode="open"`). * Permite traduzir o rótulo para outros idiomas. */ readonly closeLabel: string; /** * `aria-label` do painel expandido (`mode="open"`), que possui `role="dialog"`. * Leitores de tela anunciam este texto ao entrar no diálogo modal de configuração de cookies. * Deve descrever o propósito do diálogo de forma sucinta (ex: "Configurações de cookies"). */ readonly panelLabel: string; /** * `aria-label` da barra de aviso de cookies (`mode="default"`). * Deve descrever o propósito da região de forma sucinta (ex: "Aviso de cookies"). */ readonly defaultPanelLabel: string; /** Rótulo do título da seção de grupos de cookies. */ readonly cookieGroupsLabel: string; /** * `aria-label` do elemento `