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

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

@@ -61,6 +61,20 @@ export declare class Button {
      * Define o valor inicial do botão em um formulário.
      */
     readonly value: string;
+    /**
+     * Define o rótulo acessível do botão.
+     * Este rótulo é usado por tecnologias assistivas para descrever a função do botão.
+     * É especialmente importante para botões com formato circular, onde o texto pode não ser visível.
+     * Se o botão não tiver um rótulo acessível, uma mensagem de aviso será exibida no console.
+     */
+    readonly ariaLabel: string;
+    /**
+     * Define o estado de pressionado do botão.
+     * Este atributo é usado para indicar se o botão está atualmente pressionado ou não.
+     * É especialmente útil para botões que podem ser alternados entre os estados pressionado e não pressionado.
+     * O valor deve ser 'true' ou 'false'.
+     */
+    readonly ariaPressed: string;
     private readonly handleClick;
     componentDidLoad(): void;
     private getCssClassMap;

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

@@ -23,19 +23,51 @@ export declare class Dropdown {
      * Caso não seja fornecido, um ID gerado automaticamente será usado.
      */
     readonly customId: string;
+    private triggerElement;
+    private targetElement;
+    private dropdownItems;
+    private dropdownLinks;
+    private focusableElement;
+    private clickHandler;
+    private triggerKeydownHandler;
+    private targetKeydownHandler;
     /**
      * Método chamado sempre que a propriedade `isOpen` muda.
      * Emite um evento com o novo estado do dropdown.
      */
-    isOpenChanged(): void;
+    isOpenChanged(newValue: boolean): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    private clearDropdownItemListeners;
+    componentDidLoad(): void;
     /**
      * Evento emitido quando o estado do dropdown muda.
      */
     brDropdownChange: EventEmitter<{
         'is-opened': boolean;
     }>;
+    /**
+     * Configura os comportamentos de interação do dropdown
+     */
+    private setBehavior;
+    /**
+     * Lida com o comportamento no trigger
+     */
+    private handleTriggerBehavior;
+    /**
+     * Inicializa os itens do dropdown com comportamentos de navegação com teclado,
+     * separando claramente entre elementos navegáveis por Tab e elementos navegáveis por setas
+     */
+    private initializeDropdownItems;
+    /**
+     * Handler específico para links
+     */
+    private handleLinkKeydown;
+    /**
+     * Handler para eventos de keydown nos itens não-link
+     * Implementa navegação completa por setas, Tab não navega entre estes itens
+     */
+    private handleItemKeydown;
     private getCssClassMap;
     /**
      * Alterna o estado do dropdown entre aberto e fechado.
@@ -63,5 +95,20 @@ export declare class Dropdown {
     hide(): Promise<{
         isOpen: boolean;
     }>;
+    /**
+     * Foca em um elemento específico com suporte a componentes personalizados
+     * @param targetElement Elemento a receber o foco
+     */
+    private focusOnElement;
+    /**
+     * Foca no elemento interativo dentro do slot trigger
+     * Esta função procura pelo elemento dentro do slot trigger e aplica o foco nele
+     */
+    private focusOnTriggerElement;
+    /**
+     * Define o foco no elemento interno do componente.
+     * Este método pode ser chamado externamente para garantir que o foco seja aplicado ao elemento correto.
+     */
+    setFocus(): Promise<void>;
     render(): any;
 }

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

@@ -57,5 +57,12 @@ export declare class Icon {
      * Aceita valores como "horizontal" para espelhar o ícone horizontalmente, "vertical" para espelhar verticalmente, ou ambos.
      */
     readonly flip?: 'horizontal' | 'vertical';
+    /**
+     * Determina se o ícone pode receber foco.
+     * Se definido como verdadeiro, o ícone pode ser navegado usando Tab.
+     * O valor padrão é `false`.
+     */
+    readonly isFocusable?: boolean;
+    componentDidLoad(): void;
     render(): any;
 }

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

@@ -125,6 +125,10 @@ export declare class Input {
      * Define o valor do passo para campos de entrada numéricos.
      */
     readonly step: number;
+    /**
+     * Texto exibido no botão de ação à direita do input.
+     */
+    readonly actionLabel: string;
     isPasswordVisible: boolean;
     internalState: 'info' | 'warning' | 'danger' | 'success';
     hasIconSlot: boolean;

package/dist/types/components.d.ts

@@ -71,6 +71,14 @@ export namespace Components {
      * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/button?tab=designer).
      */
     interface BrButton {
+        /**
+          * Define o rótulo acessível do botão. Este rótulo é usado por tecnologias assistivas para descrever a função do botão. É especialmente importante para botões com formato circular, onde o texto pode não ser visível. Se o botão não tiver um rótulo acessível, uma mensagem de aviso será exibida no console.
+         */
+        "ariaLabel": string;
+        /**
+          * Define o estado de pressionado do botão. Este atributo é usado para indicar se o botão está atualmente pressionado ou não. É especialmente útil para botões que podem ser alternados entre os estados pressionado e não pressionado. O valor deve ser 'true' ou 'false'.
+         */
+        "ariaPressed": string;
         /**
           * Define se o botão usará um esquema de cores escuro.
          */
@@ -290,6 +298,10 @@ export namespace Components {
           * @Method () para que possa ser chamado externamente.
          */
         "open": () => Promise<{ isOpen: boolean; }>;
+        /**
+          * Define o foco no elemento interno do componente. Este método pode ser chamado externamente para garantir que o foco seja aplicado ao elemento correto.
+         */
+        "setFocus": () => Promise<void>;
     }
     /**
      * O componente `br-footer` representa o rodapé do site, de acordo com a documentação de design do GovBR.
@@ -437,6 +449,10 @@ export namespace Components {
           * Nome do ícone a ser exibido, utilizando a biblioteca Iconify. Este nome deve corresponder ao nome do ícone definido na biblioteca para que ele seja exibido corretamente.
          */
         "iconName": string;
+        /**
+          * Determina se o ícone pode receber foco. Se definido como verdadeiro, o ícone pode ser navegado usando Tab. O valor padrão é `false`.
+         */
+        "isFocusable"?: boolean;
         /**
           * Se definido como verdadeiro, o ícone será alinhado verticalmente ao texto ao seu redor. Útil quando o ícone é usado em linha com texto para garantir que esteja alinhado corretamente com o texto. O valor padrão é `false`.
          */
@@ -454,6 +470,10 @@ export namespace Components {
      * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/input?tab=designer).
      */
     interface BrInput {
+        /**
+          * Texto exibido no botão de ação à direita do input.
+         */
+        "actionLabel": string;
         /**
           * Controla o comportamento de preenchimento automático do navegador para o input.
          */
@@ -1956,6 +1976,14 @@ declare namespace LocalJSX {
      * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/button?tab=designer).
      */
     interface BrButton {
+        /**
+          * Define o rótulo acessível do botão. Este rótulo é usado por tecnologias assistivas para descrever a função do botão. É especialmente importante para botões com formato circular, onde o texto pode não ser visível. Se o botão não tiver um rótulo acessível, uma mensagem de aviso será exibida no console.
+         */
+        "ariaLabel"?: string;
+        /**
+          * Define o estado de pressionado do botão. Este atributo é usado para indicar se o botão está atualmente pressionado ou não. É especialmente útil para botões que podem ser alternados entre os estados pressionado e não pressionado. O valor deve ser 'true' ou 'false'.
+         */
+        "ariaPressed"?: string;
         /**
           * Define se o botão usará um esquema de cores escuro.
          */
@@ -2315,6 +2343,10 @@ declare namespace LocalJSX {
           * Nome do ícone a ser exibido, utilizando a biblioteca Iconify. Este nome deve corresponder ao nome do ícone definido na biblioteca para que ele seja exibido corretamente.
          */
         "iconName"?: string;
+        /**
+          * Determina se o ícone pode receber foco. Se definido como verdadeiro, o ícone pode ser navegado usando Tab. O valor padrão é `false`.
+         */
+        "isFocusable"?: boolean;
         /**
           * Se definido como verdadeiro, o ícone será alinhado verticalmente ao texto ao seu redor. Útil quando o ícone é usado em linha com texto para garantir que esteja alinhado corretamente com o texto. O valor padrão é `false`.
          */
@@ -2332,6 +2364,10 @@ declare namespace LocalJSX {
      * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/input?tab=designer).
      */
     interface BrInput {
+        /**
+          * Texto exibido no botão de ação à direita do input.
+         */
+        "actionLabel"?: string;
         /**
           * Controla o comportamento de preenchimento automático do navegador para o input.
          */