import { type EventEmitter } from '../../stencil-public-runtime'; import type { PaginationColorMode, PaginationDensity, PaginationPageChangeDetail, PaginationPerPageChangeDetail, PaginationVariant } from './pagination.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/pagination?tab=designer). * * @category Navegação * @status stable * * @slot pagination-info - Informação customizada da paginação contextual. Quando utilizado, o texto padrão de contagem é substituído. * @slot loading - Indicador exibido enquanto uma página é carregada. * * @part nav - Parte para o contêiner raiz da paginação (elemento nav), usada para estilização via ::part(). * @part list - Parte para a lista de páginas (elemento ul), usada para estilização via ::part(). * @part page - Parte para os itens de página numérica (elemento a), usada para estilização via ::part(). * @part ellipsis - Parte para o botão de reticências e seu contêiner. * @part ellipsis-button - Parte encaminhada do botão de reticências. * @part per-page - Parte para o seletor de itens por página na variante contextual. * @part per-page-container - Contêiner encaminhado do seletor de itens por página. * @part per-page-input - Campo encaminhado do seletor de itens por página. * @part per-page-list - Lista encaminhada do seletor de itens por página. * @part go-to - Parte para o seletor de navegação direta na variante contextual. * @part go-to-container - Contêiner encaminhado do seletor de navegação direta. * @part go-to-input - Campo encaminhado do seletor de navegação direta. * @part go-to-list - Lista encaminhada do seletor de navegação direta. * @part prev-button - Parte para o botão de página anterior, usada para estilização via ::part(). * @part prev-button-inner - Botão interno encaminhado da página anterior. * @part next-button - Parte para o botão de próxima página, usada para estilização via ::part(). * @part next-button-inner - Botão interno encaminhado da próxima página. * @part loading - Área do indicador de carregamento. */ export declare class Pagination { private static readonly ELLIPSIS_VISIBLE_ITEMS; private static readonly ELLIPSIS_ITEM_HEIGHT_FALLBACK; private static readonly ELLIPSIS_OVERSCAN; private static readonly LARGE_PAGE_THRESHOLD; /** * Referência ao elemento host do componente. * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente. */ el: HTMLBrPaginationElement; /** * Estado interno para responsividade. Verdadeiro quando viewport < sm. */ private isSmall; /** Materializa as opções completas somente após a primeira abertura do seletor. */ private goToOptionsReady; private goToSearchTerm; /** * Controla a janela visível de cada dropdown de reticências. */ private ellipsisScrollOffsets; /** * Altura efetiva dos itens do dropdown de reticências. * O valor fixo é usado somente até a primeira medição válida do DOM. */ private ellipsisItemHeight; /** * Define se a paginação usará um esquema de cores escuro. * Quando definido como `dark`, aplica a classe `dark-mode` ao container principal. */ colorMode?: PaginationColorMode; /** * Identificador único do componente. * Quando omitido, um valor é gerado automaticamente. * * > **Padrão:** valor único gerado por Helpers.generateUniqueId(). * * > **Uso compartilhado:** mantenha esta descrição idêntica em todos os componentes que usam `customId`. */ customId: string; /** * Quantidade total de páginas (mínimo 1). */ total: number; /** Quantidade total de páginas. Tem precedência sobre `total`. */ totalPages?: number; /** * Página atual (1-indexada). Valores fora do intervalo serão ajustados. */ current: number; /** Página atual. Tem precedência sobre `current`. */ currentPage?: number; /** * Define o rótulo acessível usado por tecnologias assistivas. * * > **Uso compartilhado:** mantenha esta descrição idêntica em todos os componentes que usam `ariaLabel`. */ ariaLabel: string; /** * Rótulo acessível do botão de página anterior. */ previousLabel: string; /** * Rótulo acessível do botão de próxima página. */ nextLabel: string; /** * Rótulo acessível do botão de reticências que abre a lista de páginas ocultas. */ ellipsisLabel: string; /** * Define a densidade visual do componente. * * - `small`: Alta densidade (componente menor, mais compacto e com menos espaçamento). * - `medium`: Densidade intermediária, padrão recomendado para a maioria dos casos. * - `large`: Baixa densidade (componente maior, mais espaçamento e altura). * * > **Uso compartilhado:** mantenha esta descrição idêntica em todos os componentes que usam `density`. */ density: PaginationDensity; /** * Variante de renderização do componente. * - `default`: paginação numérica (padrão) * - `contextual`: paginação contextual com seletores e informação de itens */ variant: PaginationVariant; /** * Mantém `current` e `perPage` sob controle da aplicação. * * Quando ativo, interações apenas emitem a intenção de mudança. A aplicação * deve atualizar a propriedade correspondente após concluir seu processamento. * * @default false */ controlled: boolean; /** Indica que a página solicitada ainda está sendo carregada pelo consumidor. * @default false */ loading: boolean; /** * Total de itens (aplicável na variante contextual). */ totalItems?: number; /** * Itens por página (aplicável na variante contextual). */ perPage: number; /** * Opções disponíveis de itens por página (variante contextual). */ perPageOptions: number[]; /** * Rótulo do seletor de itens por página (variante contextual). */ perPageLabel: string; /** * Rótulo do seletor "ir para página" (variante contextual). */ goToPageLabel: string; /** * Sufixo textual para a informação de quantidade de itens (variante contextual). */ itemsText: string; handleTotalChange(): void; handleTotalPagesChange(newValue?: number): void; handleCurrentChange(newValue: number): void; handleCurrentPageChange(newValue?: number): void; handlePerPagePropChange(newValue: number): void; handleTotalItemsChange(): void; handleDensityChange(): void; /** * Solicita uma página por interação do usuário ou pelo método público. * * Em `controlled`, o evento informa a página solicitada, mas `current` só * muda quando a aplicação confirma o resultado. O componente não faz * chamadas remotas nem cancela a consulta do consumidor. */ pageChange: EventEmitter; /** * Evento canônico para iniciar o carregamento de uma página. * O `detail` contém `{ page }`; o evento não é cancelável. */ brPaginationPageChange: EventEmitter; /** * Solicita uma quantidade de itens por página (variante contextual). * Em `controlled`, a aplicação confirma a mudança atribuindo `perPage`. */ perPageChange: EventEmitter; /** * Evento canônico para iniciar o carregamento de uma nova quantidade de * itens. O `detail` contém `{ perPage }`; o evento não é cancelável. */ brPaginationPerPageChange: EventEmitter; connectedCallback(): void; disconnectedCallback(): void; componentWillLoad(): void; componentDidLoad(): void; componentDidRender(): void; /** * Define programaticamente a página atual dentro do intervalo permitido. * @param page Página desejada (1-indexada). * Em `controlled`, emite a solicitação sem alterar `current`. */ setPage(page: number): Promise; /** * Solicita navegação programática para uma página (1-indexada). * Em `controlled`, aguarda a confirmação externa para alterar `current`. */ goToPage(page: number): Promise; private mqlSmall?; private mqlSmallHandler?; private lastInteraction?; private ellipsisScrollFrame; private pendingEllipsisScrollOffsets; private pendingEllipsisFocus; private goToOptionsCache; private pendingGoToPage?; private pendingGoToResetFrame; private computeItemHeightForDensity; private setupMediaQuery; private cleanupMediaQuery; private getCssClassMap; private getDefaultTotalPages; private clampPage; private goTo; private handlePrevClick; private handleNextClick; private handlePageClickFactory; private handleEllipsisItemClickFactory; private getVisiblePageButtons; private focusPageButtonByIndex; private handlePageKeyDown; private queueFocusAfterNavigation; private getComputedNavAriaLabel; private renderPageButton; private getEllipsisRangeKey; private resetAllEllipsisScrollOffsets; private resetEllipsisScrollOffset; private getEllipsisMetrics; private setEllipsisScrollOffset; private getEllipsisListElement; private focusEllipsisItemNow; private flushPendingEllipsisFocus; private ensureEllipsisItemVisible; private handleEllipsisScrollFactory; private getEllipsisBoundaryNavigationIndex; private handleEllipsisEscape; private handleEllipsisBoundaryNavigation; private handleEllipsisItemKeyDownFactory; private renderEllipsis; private renderPagesSmall; private renderPagesStandard; private renderPages; private renderLoading; private getTotalPages; private getRangeInfo; private handlePerPageChange; handleContextualSelectChange(event: CustomEvent): void; private renderPerPageDropdown; private renderPerPageSelect; private handleGoToPageChange; private renderGoToSelect; private handleGoToSelectOpened; private getWindowedGoToOptions; private getCurrentGoToOption; private getGoToOptions; private renderContextual; render(): any; }