import { type EventEmitter } from '../../stencil-public-runtime'; import type { BrNavigateDetail, BrNavigationMode } from '../global.types'; import type { BreadcrumbItem } from './breadcrumb.types'; /** * Para a documentação completa, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/breadcrumb?tab=designer). * * @category Navegação * @status stable * @slot default - Itens de breadcrumb declarados via elementos br-crumb. * * @part nav - Elemento nav do breadcrumb. * @part list - Lista ordenada de itens do breadcrumb. */ export declare class Breadcrumb { el: HTMLBrBreadcrumbElement; /** * Largura interna dos itens do breadcrumb. */ contentWidth: number; /** * Lista interna de itens normalizados usada na renderização do breadcrumb. */ innerCrumbs: BreadcrumbItem[]; /** * Define o estado do botão 'Folder'. * Caso a lista dropdown esteja oculta o ícone no botão será 'folder-plus'. * Caso a lista dropdown esteja visível o ícone no botão será 'folder-minus'. */ isFolderOpen: boolean; /** * Define o estado isSmallScreen, usado para verificar a largura do container pai e aplicar as mudanças do formato mobile. * No formato mobile o breadcrumb apresenta um comportamento específico. */ isSmallScreen: boolean; /** * Define se o breadcrumb deve truncar os itens por falta de espaço. */ isTruncate: boolean; /** * Largura do container pai do breadcrumb. */ parentWidth: number; /** * Define o estado oculto ou visível do tooltip. */ showTooltip: boolean; /** * Define o posicionamento do tooltip na tela. */ tooltipText: string; /** * Identificador único do componente. * Quando omitido, um valor é gerado automaticamente. * * > **Padrão:** valor único gerado por generateUniqueId(). * */ customId: string; /** * Caso não seja fornecido, o valor padrão será /. * @deprecated Use `homeHref`. */ homeUrl: string; /** URL canônica da página inicial. Quando informada, tem precedência sobre `homeUrl`. */ homeHref?: string; /** * Define o array de objetos que receberá os nomes e links do breadcrumb. * Define valor padrão do breadcrumb 'defaultCrumbs'. */ crumbs: string | BreadcrumbItem[]; /** * Controla como os links do breadcrumb integram a navegação mantendo `href` real nos itens navegáveis. * - `native` (padrão): preserva o comportamento do navegador, conforme HTML/W3C. * - `event`: emite `brNavigate`; se o evento for cancelado, bloqueia a navegação nativa para a SPA assumir. * Cliques com modificadores, botão do meio ou `target` diferente de `_self` permanecem nativos. */ navigationMode: BrNavigationMode; /** * Evento cancelável emitido em `navigation-mode="event"` para cliques primários sem modificadores em links `_self`. * Chame `event.preventDefault()` no listener para impedir a navegação nativa e entregar `event.detail.href` ao roteador da SPA. */ brNavigate: EventEmitter; /** * Adiciona o 'resizeObserver' para checar o tamanho do container pai. */ connectedCallback(): void; /** * Remove o 'resizeObserver'. */ disconnectedCallback(): void; /** * Executa cálculos de largura após o componente ser carregado. */ componentWillLoad(): void; componentDidLoad(): void; handleCrumbPropsChange(): void; private slotElement; private hasLoaded; private defaultCrumbs; private floatingManager?; private hoveredElement?; private tooltipElement?; private tooltipArrowElement?; /** * Atualiza o estado 'isSmallScreen' com base no tamanho do container pai, se menor que 570px. */ private resizeObserver; private widthCalculationFrame; private readonly crumbKeys; private crumbKeySequence; private get effectiveHomeHref(); private normalizeTarget; private registerCrumbItems; /** * Verifica se o texto do link contém mais de 20 caracteres e realiza o truncamento deste caso positivo. * O número de caracteres pode ser configurado na variável 'truncateCharactersLimit'. */ private truncateText; private isTruncatedLabel; /** * Exibe o tooltip e define seu posicionamento, caso o usuário realize o 'mouse over'. */ private handleMouseOver; /** * Esconde o tooltip caso o usuário realize o 'mouse out'. */ private handleMouseOut; private handleNavigation; private positionTooltip; private cleanupTooltipPosition; /** * Converte de string para JSON o valor passado na propriedade 'crumbs'. * Retorna o valor padrão do Breadcrumbs caso crumbs seja vazio ou inválido */ private getParsedItems; private getCrumbKey; /** * Ao clicar no botão HOME, direciona o usuário para a URL configurada. */ private handleHomeClick; /** * Altera o estado do botão 'Folder', caso a lista dropdown esteja aberta ou fechada. */ private toggleFolder; /** * Define as classes CSS usadas no breadcrumb. */ private getCssClassMap; /** * Atualiza os estados de largura do breadcrumb ao detectar mudanças no container pai. */ private updateContainerSize; /** * Calcula a largura total dos itens do breadcrumb para determinar se precisa de truncamento. */ private calculateItemsWidth; /** * Renderiza botão Home */ private renderHomeButton; /** * Renderiza botão Folder no comportamento truncado */ private renderTruncateButton; /** * Renderiza itens do Breadcrumb no comportamento mobile ou truncado */ private renderBreadcrumbItems; private renderCollapsedBreadcrumbItems; private renderDesktopBreadcrumbItems; /** * Renderiza item da página atual */ private renderMobileActiveItem; /** * Renderiza lista dropdown contendo os itens do Breadcrumb */ private renderBreadcrumbList; private shouldSkipFloatingListItem; private getListItemAriaLabel; /** * Com o roving tabindex de `br-list` (apenas um item por vez alcançável via Tab), * o item de onde o usuário sai da lista via Tab pode ser qualquer um -- não mais * necessariamente o de índice `totalItems - 3` como antes, quando todo item era * um tab stop nativo e Tab sempre percorria a lista em ordem sequencial. Por isso * o handler de saída é anexado a todo item; `handleKeyDownOut` já valida internamente * se a saída deve de fato ocorrer (`isFolderOpen && isTruncate && !isSmallScreen`). */ private getListItemKeyDownHandler; private renderBreadcrumbListItem; /** * Renderiza itens do Breadcrumb no formato desktop */ private renderBreadcrumbLink; /** * Renderiza Tooltip */ private renderTooltip; /** * Controla navegação pelo teclado após lista de itens aberta * Dispara foco no primeiro item da lista flutuante */ private handleKeyDown; /** * Ao finalizar navegação por teclado dentro da lista, dispara foco no item fora da lista flutuante */ private handleKeyDownOut; render(): any; }