@govbr-ds/webcomponents 2.0.0-next.4 → 2.0.0-next.40

package/dist/types/components/scrim/scrim.d.ts

@@ -0,0 +1,128 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/scrim?tab=designer).
+ *
+ * @slot default - Elemento que será exibido junto com o Scrim, devendo ser fornecido através do slot. Esse elemento representa o conteúdo principal a ser destacado sobre o fundo escurecido.
+ * @slot activator - Elemento que, quando clicado, ativa/desativa o scrim. Tem prioridade sobre a propriedade 'activator'.
+ */
+export declare class Scrim {
+    /**
+     * Referência ao elemento host do componente.
+     */
+    el: HTMLBrScrimElement;
+    elementInternals: ElementInternals;
+    /**
+     * Identificador único.
+     * Caso não seja fornecido, um ID gerado automaticamente será usado.
+     */
+    readonly customId: string;
+    /**
+     * Ativa/desativa o scrim
+     */
+    isOpen: boolean;
+    /**
+     * Posiciona o conteúdo no topo, centro, direita, esquerda, abaixo dentro do scrim
+     */
+    positionContent: 'top' | 'center' | 'right' | 'left' | 'bottom';
+    /**
+     * Desativa o fechamento do scrim ao ser clicado
+     */
+    disableCloseOnClick: boolean;
+    /**
+     * Define o valor de z-index do scrim
+     */
+    zIndex: number | null;
+    /**
+     * Define um valor CSS personalizado para o background do scrim
+     */
+    customBackground: string | null;
+    /**
+     * Define a opacidade personalizada do scrim
+     */
+    customOpacity: number | null;
+    /**
+     * Define o modo de exibição do scrim:
+     * - 'fullscreen': Ocupa toda a tela (position: fixed).
+     * - 'parent': Ocupa apenas o elemento pai (position: absolute).
+     * O elemento pai deve ter `position: relative` ou outro valor de posicionamento diferente de `static`.
+     */
+    displayMode: 'fullscreen' | 'parent';
+    /**
+     * Define a estratégia de manipulação de rolagem quando scrim está aberto
+     * - 'block': Impede a rolagem completamente
+     * - 'close': Fecha o scrim quando ocorre rolagem
+     */
+    scrollStrategy: 'block' | 'close';
+    /**
+     * Determina quanto de rolagem (em pixels) é necessário para acionar a ação de fechamento automático do scrim.
+     */
+    scrollThreshold: number;
+    /**
+     * Define o seletor para o elemento activator.
+     * Pode ser:
+     * - Um seletor CSS (ex: '.button-class', '#button-id')
+     * - A string 'parent' para usar o elemento pai como activator
+     * Nota: O slot 'activator' tem prioridade sobre esta propriedade.
+     */
+    activator: string | null;
+    /** Indica que o scrim foi aberto. */
+    brScrimOpen: EventEmitter;
+    /** Indica que o scrim foi fechado */
+    brScrimClose: EventEmitter;
+    isActive: boolean;
+    hasActivatorSlot: boolean;
+    private contentRef;
+    private activatorElement;
+    private scrollOffset;
+    private lastScrollTop;
+    private previouslyFocusedElement;
+    private static readonly FOCUSABLE_SELECTORS;
+    handleOpenChange(newValue: boolean): void;
+    updateStyles(): void;
+    handleActivatorChange(): void;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private checkActivatorSlot;
+    private setupActivatorSlotClick;
+    private setupActivator;
+    private handleActivatorClick;
+    private addActivatorClickListener;
+    private removeActivatorClickListener;
+    private cleanupActivatorSlotClick;
+    private applyScrollStrategy;
+    private enableScrollBlock;
+    private enableScrollWatcher;
+    private handleBlockScroll;
+    private resetScrolling;
+    private handleScrollClose;
+    private focusFirstElement;
+    private restoreFocus;
+    private getFocusableElements;
+    private filterVisibleElements;
+    private handleKeyDown;
+    private shouldHandleEscape;
+    private handleTabNavigation;
+    private shouldTrapFocus;
+    private wrapFocus;
+    private handleMaskClick;
+    private getCssClassMap;
+    /**
+     * Define o limite de rolagem para o fechamento automático do scrim.
+     */
+    setScrollThreshold(threshold: number): Promise<void>;
+    /**
+     * Método público para exibir o scrim
+     */
+    open(): Promise<void>;
+    /**
+     * Método público para esconder o scrim
+     */
+    close(): Promise<void>;
+    /**
+     * Método público para alternar o estado de exibição do scrim
+     */
+    toggle(): Promise<void>;
+    render(): any;
+}

package/dist/types/components/select/select.d.ts

@@ -0,0 +1,119 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class Select {
+    /**
+     * Referência ao elemento host do componente.
+     * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.
+     */
+    el: HTMLBrSelectElement;
+    elementInternals: ElementInternals;
+    /**
+     * Rótulo que indica o tipo de informação que deve ser selecionada.
+     */
+    label: string;
+    /**
+     * Texto auxiliar exibido antes de uma seleção.
+     */
+    placeholder: string;
+    /**
+     * Habilita o modo múltiplo para selecionar várias opções.
+     */
+    isMultiple: boolean;
+    /**
+     * Define as opções disponíveis no componente de seleção.
+     * Pode ser fornecida como:
+     * - Uma **string** contendo um JSON válido que será analisado em um array de objetos. Exemplo: `'[{"label": "Opção 1", "value": "1"}]'.
+     * - Um **array de objetos**, onde cada objeto representa uma opção com as propriedades:
+     *   - `label`: O texto exibido para o usuário (obrigatório).
+     *   - `value`: O valor associado à opção (obrigatório).
+     *   - `selected`: Um boolean opcional que indica se a opção está pré-selecionada (padrão: `false`).
+     * Se uma string for fornecida, ela será convertida internamente para um array via `JSON.parse`. Caso o formato seja inválido, um erro será registrado e as opções serão definidas como um array vazio.
+     * Exemplo de uso:
+     * ```typescript
+     * options='[{"label": "Sim", "value": "1"}, {"label": "Não", "value": "0"}]'
+     * // ou
+     * options=[{ label: "Sim", value: "1" }, { label: "Não", value: "0" }]
+     * ```
+     */
+    options: string | {
+        label: string;
+        value: string;
+        selected?: boolean;
+    }[];
+    /**
+     * Rótulo para selecionar todas as opções.
+     */
+    selectAllLabel: string;
+    /**
+     * Rótulo para desmarcar todas as opções.
+     */
+    unselectAllLabel: string;
+    /**
+     * Exibe o ícone de busca no campo de entrada.
+     */
+    showSearchIcon: boolean;
+    /**
+     * Indica se a listagem de itens do select está expandida
+     */
+    isOpen: boolean;
+    /**
+     * Identificador único.
+     * Caso não seja fornecido, um ID gerado automaticamente será usado.
+     */
+    readonly customId: string;
+    parsedOptions: {
+        label: string;
+        value: string;
+        selected?: boolean;
+    }[];
+    inputValue: string;
+    isAllSelected: boolean;
+    isExpanded: boolean;
+    focusedIndex: number;
+    /**
+     * Evento emitido sempre que houver atualização nos itens selecionados.
+     */
+    brDidSelectChange: EventEmitter;
+    synchronizeSelect(): void;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    /**
+     * Fecha a lista suspensa (`dropdown`) do `br-select` quando o usuário clica fora do componente.
+     * O listener global é adicionado no `componentDidLoad` e removido no `disconnectedCallback` para evitar vazamentos de memória.
+     * Se a lista estiver aberta (`this.isExpanded`) e o clique ocorrer fora (`!this.el.contains(target)`), ela é fechada.
+     * A reatividade do StencilJS garante a atualização automática da interface.
+     * A arrow function (`=>`) mantém o contexto correto de `this` ao ser usada como callback.
+     *
+     * @param {MouseEvent} event O evento de clique.
+     * @returns {void}
+     */
+    private readonly handleClickOutside;
+    private handleKeydownOnInput;
+    private handleKeydownOnList;
+    private handleKeydownOnItem;
+    private handleSelectAllKeyDown;
+    private resetFocus;
+    private focusItemInDirection;
+    private focusItem;
+    private openSelect;
+    private closeSelect;
+    private handleSelection;
+    private updateSelectedOptions;
+    private getStringValue;
+    private emitSelectedOptions;
+    private updateSelectedAllState;
+    private toggleSelectAll;
+    private renderInput;
+    private renderSelectAllCheckbox;
+    private renderOptions;
+    /**
+     * Determina um id para o radio.
+     */
+    private getComputedId;
+    /**
+     * Inverte o valor da prop `isOpen`
+     */
+    toggleOpen(): Promise<void>;
+    private getCssClassMap;
+    render(): any;
+}

package/dist/types/components/step/step.d.ts

@@ -0,0 +1,103 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/step?tab=designer).
+ *
+ * @slot default - Slot que abriga o componente step-item. Este slot tem a particularidade de aceitar somente o componente step-item em sua composição. Caso outro elemento ou componente seja incluído dentro dele, o componente Step não será renderizado, e uma mensagem de erro será exibida no console.
+ */
+export declare class Step {
+    /**
+     * Referência ao elemento host do componente.
+     * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.
+     */
+    el: HTMLBrStepElement;
+    elementInternals: ElementInternals;
+    /**
+     * propriedade responsável por definir a orientação do componente Step
+     */
+    layout: 'horizontal' | 'vertical';
+    /**
+     *
+     * define o passo que começará destacado
+     */
+    initialStep: string;
+    /**
+     *
+     * Propriedade que  define a posição onde o texto de destaque,label, ficará localizado no stepItem
+     */
+    labelPosition?: 'top' | 'right' | 'bottom' | 'left';
+    /**
+     *
+     * Propriedade que define o tipo de conteúdo a ser exibido dentro do componente step  e stepItem
+     */
+    contentType: 'default' | 'br-icon' | 'no-content' | 'slotted';
+    /**
+     *
+     * Propriedade que define o tipo de comportamento que o componente Step deverá seguir
+     */
+    mode: 'controller' | 'step';
+    /**
+     *
+     * Propriedade que define o tipo de progressão de etapas que o step vai executar
+     */
+    progressionType: 'linear' | 'nonlinear';
+    activeStep: number;
+    stepItems: Element[];
+    /**
+     * Emite um evento após o componente ter sido carregado pela primeira vez.
+     * Utilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.
+     * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.
+     */
+    brDidLoad: EventEmitter<void>;
+    componentDidLoad(): void;
+    /**
+     * Emite um evento antes do componente ser renderizado pela primeira vez, permitindo a preparação de dados ou inicializações necessárias.
+     * Utilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.
+     * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdwillLoad) para mais detalhes.
+     */
+    brWilLoad: EventEmitter<void>;
+    componentWillLoad(): void;
+    /**
+     * Emite um evento para indicar se o componente deve ser atualizado ou não.
+     * Este evento é chamado antes de qualquer atualização do componente para decidir se a atualização deve prosseguir.
+     * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes.
+     */
+    brShouldUpdate: EventEmitter<void>;
+    componentShouldUpdate(newValue: any, oldValue: any, stateName: any): void;
+    /**
+     * listener para ouvir o evento de click no componente step
+     * Através desse listener o componente define qual será o proximo passo do step que terá o estado ativo
+     */
+    handleClick(event: any): void;
+    private getStepItemsElements;
+    private setStepItemsLabelPosition;
+    private setStepItemsDefaultContent;
+    private setStepItemsContentType;
+    private setStepItemsMode;
+    private getStepItemPosition;
+    private configureTimeLine;
+    private configureLinearProgression;
+    /**
+     *
+     * Método disponibilizado via API do elemento que controla o componente Step, responsável por avançar para o próximo passo e atualizar o valor do estado activeStep
+     */
+    ProceedToNextStep(): Promise<void>;
+    /**
+     *
+     * Método disponibilizado via API do elemento que controla o componente Step, responsável por retornar ao passo anterior e atualizar o valor do estado activeStep
+     */
+    BackToPreviousStep(): Promise<void>;
+    /**
+     *
+     * Método disponibilizado via API do elemento que integra um componente externo ao componente Step, permitindo sinalizar validações ou destacar a etapa com estado ativo.
+     */
+    StepValidation(validationStatus: 'success' | 'info' | 'danger' | 'warning'): Promise<void>;
+    /**
+     *
+     * Método disponibilizado via API do elemento que permite a um componente externo obter a etapa com o estado ativo do componente Step.
+     */
+    GetActiveStep(): Promise<number>;
+    private getCssClassMap;
+    private AriaObjectContent;
+    private getAreaLabel;
+    render(): any;
+}

package/dist/types/components/step-item/step-item.d.ts

@@ -0,0 +1,102 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/step?tab=designer).
+ *
+ * @slot nomeado label-area: insere o conteúdo customizado dentro do botão que compõe o componente.
+ */
+export declare class StepItem {
+    /**
+     * Referência ao elemento host do componente.
+     * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.
+     */
+    el: HTMLBrStepItemElement;
+    elementInternals: ElementInternals;
+    /**
+     *  Propriedade que define o conteúdo do texto auxiliar de realce do item de Step.
+     */
+    label: string;
+    /**
+     *  Propriedade que define o tipo de ícone de destaque exibido pelo item Step, com quatro opções disponíveis: "success", "info", "danger" e "warning".
+     */
+    highlight?: 'success' | 'info' | 'danger' | 'warning';
+    /**
+     *  Propriedade que define se o item Step está com estado ativo.
+     */
+    active: boolean;
+    /**
+     *  Propriedade que define se o item Step está com estado desativado..
+     */
+    disabled: boolean;
+    /**
+     *  Propriedade Define o nome do ícone do componente BRIcon que será exibido como conteúdo do step item, propriedade funciona apenas quando o state contentType assume o valor br-icon.
+     */
+    brIconName?: string;
+    /**
+     *  Propriedade Define o nome do ícone o texto de acessibilidade apresentando quando o tipo de conteúdo for o br-icon
+     */
+    brIconAria: string;
+    showTimeLine: boolean;
+    stepItemPositionStatus: 'first' | 'middle' | 'last';
+    stepLayout: 'horizontal' | 'vertical';
+    labelPosition: 'top' | 'right' | 'bottom' | 'left';
+    contentType: 'default' | 'br-icon' | 'no-content' | 'slotted';
+    mode: 'controller' | 'step';
+    content: string;
+    ariaLabelContent: string;
+    /**
+     * Emite um evento após o componente ter sido carregado pela primeira vez.
+     * Utilize este evento para realizar ações que devem ocorrer antes que o componente seja renderizado ou atualizado.
+     * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.
+     */
+    brWillRender: EventEmitter<void>;
+    componentWillRender(): void;
+    /**
+     * Emite um evento após o componente ter sido carregado pela primeira vez.
+     * Utilize este evento para realizar ações que devem ocorrer antes que o componente seja renderizado ou atualizado.
+     * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.
+     */
+    brDidRender: EventEmitter<void>;
+    componentDidRender(): void;
+    /**
+     * Watch que observa o valor da propriedade active, e ao alterar seu valor este método altera o valor do campo de acessibilidade aria-selected
+     */
+    watchItemIsActive(newValue: boolean, oldValue: boolean): void;
+    /**
+     *
+     * Método disponibilizado via api do elemento que indica a posição do step item, ele serve para setar o state stepItemPositionStatus do componente
+     */
+    setStepItemPositionStatus(value: 'first' | 'middle' | 'last'): Promise<void>;
+    /**
+     * Método que define a orientação do stepItem e controla a exibição da linha do tempo após o componente.
+     */
+    handleShowTimeLine(value: boolean, layout: any): Promise<void>;
+    /**
+     *
+     * Método disponibilizado via api do elemento que atribui o valor ao estado que define onde o label, o texto de destaque, irá ficar localizado
+     */
+    setLabelPosition(value: 'top' | 'right' | 'bottom' | 'left'): Promise<void>;
+    /**
+     *
+     * Método disponibilizado via api do elemento que atribui o valor que irá definir o tipo de conteúdo apresentado dentro do componente stepItem
+     */
+    setContentType(value: 'default' | 'br-icon' | 'no-content' | 'slotted'): Promise<void>;
+    /**
+     *
+     * Método disponibilizado via api do elemento que atribui o valor que irá definir o modo como o componente irá se comportar e exibir seu estilo.
+     */
+    setMode(value: 'controller' | 'step'): Promise<void>;
+    /**
+     *
+     * Método disponibilizado via api do elemento que atribui o valor que irá ser exibido dentro do componente stepItem
+     */
+    setContent(value: string): Promise<void>;
+    private getStepContainerClassMap;
+    private getStepItemContentClassMap;
+    private getStepItemIndicatorAreaClassMap;
+    private getStepItemLabelAreaClassMap;
+    private getHighlightClass;
+    private getStepItemIndicatorClass;
+    private highLightAriaLabel;
+    private IconsName;
+    render(): any;
+}

package/dist/types/components/switch/switch.d.ts

@@ -0,0 +1,80 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ *  Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/switch?tab=designer).
+ *
+ * @slot default - Descreve o que o switch faz quando a alternância estiver ativada. A label passada por slot tem precedência sobre a propriedade 'label'.
+ */
+export declare class Switch {
+    /**
+     * Referência ao elemento host do componente.
+     * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.
+     */
+    el: HTMLBrSwitchElement;
+    elementInternals: ElementInternals;
+    /**
+     * Desativa o switch, tornando-o não interativo.
+     */
+    readonly disabled: boolean;
+    /**
+     * Define o estado de seleção do checkbox.
+     * Se definido como verdadeiro, o checkbox estará marcado. Caso contrário, estará desmarcado.
+     */
+    checked: boolean;
+    /**
+     * Identificador único.
+     * Caso não seja fornecido, um ID gerado automaticamente será usado.
+     */
+    readonly customId: string;
+    /**
+     * Texto descritivo.
+     * Caso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.
+     */
+    readonly label: string;
+    /**
+     * Posição do rótulo em relação ao switch.
+     */
+    readonly labelPosition: 'right' | 'left' | 'top';
+    /**
+     * Texto exibido quando o switch está ativado.
+     */
+    readonly labelOn: string;
+    /**
+     * Texto exibido quando o switch está desativado.
+     */
+    readonly labelOff: string;
+    /**
+     * Adiciona um ícone ao switch para indicar a mudança de estado.
+     */
+    readonly hasIcon: boolean;
+    /**
+     * Define o nome do switch, que é utilizado para agrupar switches em formulários e identificar o campo.
+     * O valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários.
+     */
+    readonly name: string;
+    /**
+     * Define o valor associado ao switch quando ele faz parte de um formulário nativo (`<form>`).
+     * Esse valor é enviado com o formulário quando o switch está selecionado.
+     * **Nota:** Esta propriedade não deve ser utilizada para determinar se o switch está selecionado; para verificar o estado de seleção, use a propriedade `checked`.
+     */
+    readonly value: string;
+    /** O ajuste da densidade consiste em aumentar ou reduzir a área de interação do switch. Quanto menor for a densidade, maior a área de interação. */
+    readonly density: 'large' | 'medium' | 'small';
+    _slotDefault: boolean;
+    componentWillLoad(): void;
+    /**
+     * Disparado depois que o valor do `checked` foi alterado
+     */
+    /**
+     * Disparado depois que o valor do `checked` foi alterado
+     */
+    checkedChange: EventEmitter<boolean>;
+    private _hasSlotContentDefault;
+    private readonly handleCheckedChange;
+    private readonly handleClick;
+    /**
+     * Inverte o valor da prop `checked`
+     */
+    toggleChecked(): Promise<void>;
+    private getCssClassMap;
+    render(): any;
+}

package/dist/types/components/tab/tab.d.ts

@@ -0,0 +1,103 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/tab-item?tab=designer).
+ *
+ * @slot default - Slot com os componentes item da tab
+ */
+export declare class Tab {
+    el: HTMLBrTabElement;
+    elementInternals: ElementInternals;
+    /**
+     * A propriedade 'density' define a densidade do componente.
+     * Os valores possíveis são 'small', 'medium' e 'large'.
+     * @type {string}
+     * @default 'medium'
+     */
+    readonly density: 'small' | 'medium' | 'large';
+    /**
+     * Define se o Tab usará um esquema de cores.
+     * Apenas o esquema 'dark' está disponível para o modo escuro.
+     * @type {string}
+     */
+    colorMode: string;
+    /**
+     * A propriedade 'activeTab' define o tab ativo.
+     */
+    activeTab: string;
+    /**
+     * A propriedade 'tabItems' lista dos tabs items .
+     */
+    tabItems: Element[];
+    /**
+     * A propriedade 'tabContent' armazena o conteúdo dos tabs.
+     * @type {string}
+     * @memberof Tab
+     */
+    tabContent: string;
+    private maxWidth;
+    private hostStyle;
+    private containerStyle;
+    private mutationObserver;
+    private focusElementIndex;
+    brDidActive: EventEmitter;
+    private getCssClassMap;
+    private setupHostStyles;
+    private updateContainerStyles;
+    /**
+     * Obtém os elementos de tab items dentro do componente.
+     * Se não houver elementos, emite um aviso.
+     * @private
+     * @returns {void}
+     * @memberof Tab
+     */
+    private getTabItemsElements;
+    /**
+     * Atualiza o conteúdo dos tabs com base nos elementos de tab items.
+     * Cada tab item é transformado em um painel de tab com o ID apropriado.
+     * O painel ativo é marcado com a classe 'active'.
+     * @private
+     * @returns {void}
+     * @memberof Tab
+     * @description
+     */
+    private updateTabContent;
+    /**
+     * Atualiza a largura máxima do componente com base na largura da janela.
+     * Se a largura da janela não estiver disponível, define a largura máxima como 100%.
+     * @private
+     * @returns {void}
+     * @memberof Tab
+     * @description
+     * Esta função calcula a largura máxima do componente com base na posição do elemento na tela.
+     */
+    private updateMaxWidth;
+    /**
+     * Obtém o ID do tab item.
+     * @private
+     * @param {Element} tab - O elemento do tab item.
+     * @returns {string} - O ID do tab item.
+     * @memberof Tab
+     * @description
+     * Esta função retorna o ID do tab item, que é armazenado no atributo 'tab-item-id'.
+     */
+    private getTabID;
+    /**
+     *
+     * @param tab
+     * @returns
+     */
+    private isTabActive;
+    private verifActiveTab;
+    activeTabChanged(newValue: string): void;
+    /**
+     * Evento de navegação por teclado
+     * @param event
+     */
+    private handleKeyNavigation;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    private handleTabClick;
+    private setActiveTab;
+    render(): any;
+}

package/dist/types/components/tab-item/tab-item.d.ts

@@ -0,0 +1,52 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/tab-item?tab=designer).
+ *
+ * @slot default - Slot com conteúdo do item da tab
+ */
+export declare class TabItem {
+    /**
+     * Referência ao elemento host do componente.
+     * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.
+     */
+    el: HTMLBrTabItemElement;
+    readonly TabItemId: string;
+    /**
+     * Define ícone do item de tab
+     * @type {string}
+     */
+    readonly icon: string;
+    /**
+     * Define o título do item de tab
+     * @type {string}
+     */
+    readonly tabItemTitle: string;
+    /**
+     * Define se mostra somente o ícone
+     * @type {boolean}
+     * @default false
+     */
+    readonly onlyIcon: boolean;
+    /**
+     * Define se o item de tab é ativo
+     * @type {boolean}
+     */
+    isActive: boolean;
+    /**
+     * Define contador do item de tab
+     * @type {string}
+     */
+    readonly counter: string;
+    /**
+     * Define se o Tab usará um esquema de cores.
+     * Apenas o esquema 'dark' está disponível para o modo escuro.
+     * @type {string}
+     */
+    colorMode: string;
+    elementInternals: ElementInternals;
+    itemTabClick: EventEmitter<{
+        id: string;
+    }>;
+    private getCssClassMap;
+    render(): any;
+}