@govbr-ds/webcomponents 2.0.0-next.61 → 2.0.0-next.63

package/dist/webcomponents.html-custom-data.json

@@ -8,59 +8,101 @@
       "attributes": [
         {
           "name": "density",
+          "description": "Ajusta a densidade, alterando o espaçamento interno para um visual mais compacto ou mais expandido.",
           "values": [
             { "name": "small" },
             { "name": "medium" },
             { "name": "large" }
           ]
         },
-        { "name": "custom-id", "values": [] },
-        { "name": "src", "values": [] },
-        { "name": "alt", "values": [] },
-        { "name": "is-iconic", "values": [] },
-        { "name": "text", "values": [] },
-        { "name": "disabled", "values": [] },
-        { "name": "bg-color", "values": [] }
-      ],
-      "references": []
-    },
-    {
-      "name": "br-breadcrumb",
-      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/breadcrumb?tab=designer).\n---\n",
-      "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "home-url", "values": [] },
-        { "name": "crumbs", "values": [{ "name": "BreadcrumbItem[]" }] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "src",
+          "description": "URL da imagem a ser exibida no avatar do tipo 'fotográfico'.\nDeve ser uma URL válida que aponta para a imagem desejada.",
+          "values": []
+        },
+        {
+          "name": "alt",
+          "description": "Texto alternativo (alt) associado à imagem do avatar. Essencial para acessibilidade.\nDeve descrever de forma clara e concisa o conteúdo da imagem, por exemplo: \"Foto de perfil de João Silva\".",
+          "values": []
+        },
+        {
+          "name": "is-iconic",
+          "description": "Força a exibição do ícone padrão, sobrescreve outras opções (texto ou imagem).\nÚtil para manter consistência visual ou quando se deseja um avatar neutro independente do conteúdo disponível.",
+          "values": []
+        },
+        {
+          "name": "text",
+          "description": "Conteúdo textual do avatar.\nApenas o primeiro caractere será exibido em maiúscula.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Define se o avatar está desabilitado",
+          "values": []
+        },
+        {
+          "name": "bg-color",
+          "description": "Permite definir a cor de fundo do componente.\nAceita os seguintes formatos de cor:\n- Cores nomeadas do CSS: 'red', 'blue', 'green', 'yellow', etc.\n- Códigos hexadecimais: '#ff0000', '#00ff00', '#0000ff', etc.\n- Valores RGB: 'rgb(255, 0, 0)', 'rgb(0, 255, 0)', etc.\n- Valores RGBA: 'rgba(255, 0, 0, 0.5)', 'rgba(0, 255, 0, 0.8)', etc.\n- Valores HSL: 'hsl(0, 100%, 50%)', 'hsl(120, 100%, 50%)', etc.\n- Valores HSLA: 'hsla(0, 100%, 50%, 0.5)', 'hsla(240, 100%, 50%, 0.7)', etc.\nSe não especificada, usa a cor padrão do tema.",
+          "values": []
+        }
       ],
       "references": []
     },
     {
       "name": "br-button",
-      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/button?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para o rótulo ou conteúdo do botão.",
+      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/button?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para o rótulo ou conteúdo do botão.\n\n### **CSS Parts:**\n - **button** - Parte para o elemento button interno, usada para estilos customizados via ::part(button).",
       "attributes": [
-        { "name": "color-mode", "values": [{ "name": "dark" }] },
-        { "name": "custom-id", "values": [] },
+        {
+          "name": "color-mode",
+          "description": "Define se o botão usará um esquema de cores escuro.",
+          "values": [{ "name": "dark" }]
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
         {
           "name": "density",
+          "description": "Ajusta a densidade, alterando o espaçamento interno para um visual mais compacto ou mais expandido.",
           "values": [
             { "name": "large" },
             { "name": "medium" },
             { "name": "small" }
           ]
         },
-        { "name": "disabled", "values": [] },
+        {
+          "name": "disabled",
+          "description": "Desativa o botão, tornando-o não interativo.",
+          "values": []
+        },
         {
           "name": "emphasis",
+          "description": "Define a ênfase do botão, alterando sua aparência para criar hierarquia visual e destacar ações importantes.",
           "values": [
             { "name": "primary" },
             { "name": "secondary" },
             { "name": "tertiary" }
           ]
         },
-        { "name": "is-active", "values": [] },
-        { "name": "is-loading", "values": [] },
+        {
+          "name": "is-active",
+          "description": "Indica se o botão está no estado ativo.\nSe definido como verdadeiro, o botão será exibido como ativo.",
+          "values": []
+        },
+        {
+          "name": "is-loading",
+          "description": "Aplica o estado de \"progresso\" ao botão.\nO botão exibirá um indicador de carregamento ou progresso.",
+          "values": []
+        },
         {
           "name": "shape",
+          "description": "Define o formato do botão.",
           "values": [
             { "name": "circle" },
             { "name": "block" },
@@ -69,16 +111,55 @@
         },
         {
           "name": "type",
+          "description": "Define o tipo de botão, especificando seu comportamento padrão.",
           "values": [
             { "name": "button" },
             { "name": "reset" },
             { "name": "submit" }
           ]
         },
-        { "name": "value", "values": [] },
-        { "name": "custom-tab-index", "values": [] },
-        { "name": "aria-label", "values": [] },
-        { "name": "aria-pressed", "values": [] }
+        {
+          "name": "value",
+          "description": "Define o valor inicial do botão em um formulário.",
+          "values": []
+        },
+        {
+          "name": "custom-tab-index",
+          "description": "Define o índice de tabulação do botão.\nÚtil para remover o botão da sequência de tabulação (tabindex=\"-1\") quando ele é puramente decorativo ou o foco é gerenciado por um componente pai.",
+          "values": []
+        },
+        {
+          "name": "aria-label",
+          "description": "Define o rótulo acessível do botão.\nEste rótulo é usado por tecnologias assistivas para descrever a função do botão.\nÉ especialmente importante para botões com formato circular, onde o texto pode não ser visível.\nSe o botão não tiver um rótulo acessível, uma mensagem de aviso será exibida no console.",
+          "values": []
+        },
+        {
+          "name": "aria-pressed",
+          "description": "Define o estado de pressionado do botão.\nEste atributo é usado para indicar se o botão está atualmente pressionado ou não.\nÉ especialmente útil para botões que podem ser alternados entre os estados pressionado e não pressionado.\nO valor deve ser 'true' ou 'false'.",
+          "values": []
+        }
+      ],
+      "references": []
+    },
+    {
+      "name": "br-breadcrumb",
+      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/breadcrumb?tab=designer).\n---\n",
+      "attributes": [
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "home-url",
+          "description": "Caso não seja fornecido, o valor padrão será /.",
+          "values": []
+        },
+        {
+          "name": "crumbs",
+          "description": "Define o array de objetos que receberá os nomes e links do breadcrumb.\nDefine valor padrão do breadcrumb 'defaultCrumbs'.",
+          "values": [{ "name": "BreadcrumbItem[]" }]
+        }
       ],
       "references": []
     },
@@ -86,9 +167,21 @@
       "name": "br-card",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/card?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para conteúdo livre do card, quando não usar a estrutura de slots nomeados.\n- **header** - Slot para o conteúdo do cabeçalho do card.\n- **content** - Slot para o corpo principal do card ao usar a estrutura de slots.\n- **footer** - Slot para o conteúdo do rodapé do card.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "disabled", "values": [] },
-        { "name": "hover", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Define se o card está desabilitado.\nQuando true, o card fica com opacidade reduzida e não responde a interações.",
+          "values": []
+        },
+        {
+          "name": "hover",
+          "description": "Define se o card tem hover interativo.\nQuando true, o card terá efeitos visuais ao passar o mouse.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -96,19 +189,56 @@
       "name": "br-checkbox",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/checkbox?tab=designer).\n---\n\n\n### **Events:**\n - **checkedChange** - Disparado depois que o valor do `checked` foi alterado\n- **indeterminateChange** - Disparado depois que o valor do `indeterminate` foi alterado.\n\n### **Methods:**\n - **setIndeterminate(value: _boolean_)** - Define o estado indeterminado do checkbox.\n- **toggleChecked()** - Inverte o valor da prop `checked`\n- **setNumberOfChildren(value: _number_)** - Define o número de checkboxes filhos em um grupo de checkboxes.\n\n### **Slots:**\n - **default** - Slot para o rótulo do checkbox, como alternativa à propriedade label.",
       "attributes": [
-        { "name": "indeterminate", "values": [] },
-        { "name": "checked", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "disabled", "values": [] },
-        { "name": "has-hidden-label", "values": [] },
-        { "name": "label", "values": [] },
-        { "name": "name", "values": [] },
+        {
+          "name": "indeterminate",
+          "description": "Define o estado intermediário do checkbox.\nQuando verdadeiro, exibe uma marcação parcial visual que indica seleção parcial.\nÚtil para representar grupos onde alguns itens estão selecionados, mas não todos.\nAo clicar no checkbox neste estado, ele será automaticamente alterado para marcado.",
+          "values": []
+        },
+        {
+          "name": "checked",
+          "description": "Define o estado de seleção do checkbox.\nSe definido como verdadeiro, o checkbox estará marcado. Caso contrário, estará desmarcado.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Desativa o checkbox, tornando-o não interativo.",
+          "values": []
+        },
+        {
+          "name": "has-hidden-label",
+          "description": "Define se o label associado ao checkbox deve ser oculto.\nSe definido como verdadeiro, o texto do label será oculto, mas o checkbox ainda estará visível e funcional.",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "Texto descritivo exibido à direita do checkbox.\nCaso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.",
+          "values": []
+        },
+        {
+          "name": "name",
+          "description": "Define o nome do checkbox, que é utilizado para agrupar checkboxes em formulários e identificar o campo.\nO valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários.",
+          "values": []
+        },
         {
           "name": "state",
+          "description": "Indica a validade do checkbox.\nSe não for especificado, o valor padrão é `null`, indicando que a validade não foi definida.",
           "values": [{ "name": "valid" }, { "name": "invalid" }]
         },
-        { "name": "value", "values": [] },
-        { "name": "is-father", "values": [] }
+        {
+          "name": "value",
+          "description": "Define o valor associado ao checkbox quando ele faz parte de um formulário nativo (`<form>`).\nEsse valor é enviado com o formulário quando o checkbox está selecionado.\n**Nota:** Esta propriedade não deve ser utilizada para determinar se o checkbox está selecionado; para verificar o estado de seleção, use a propriedade `checked`.",
+          "values": []
+        },
+        {
+          "name": "is-father",
+          "description": "Indica se o checkbox é pai de um grupo de checkboxes.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -116,11 +246,31 @@
       "name": "br-checkgroup",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/checkgroup?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para adicionar os checkboxes que serão controlados pelo checkgroup.",
       "attributes": [
-        { "name": "label", "values": [] },
-        { "name": "label-selecionado", "values": [] },
-        { "name": "label-desselecionado", "values": [] },
-        { "name": "indeterminate", "values": [] },
-        { "name": "custom-id", "values": [] }
+        {
+          "name": "label",
+          "description": "Texto descritivo do grupo.",
+          "values": []
+        },
+        {
+          "name": "label-selecionado",
+          "description": "Define o texto do label quando o checkbox está marcado.",
+          "values": []
+        },
+        {
+          "name": "label-desselecionado",
+          "description": "Define o texto do label quando o checkbox está desmarcado.",
+          "values": []
+        },
+        {
+          "name": "indeterminate",
+          "description": "Define o estado intermediário do checkbox.\nSe definido como verdadeiro, o checkbox exibirá um estado intermediário, que é um estado visual que indica que a opção está parcialmente selecionada.\nEste estado é útil quando o checkbox faz parte de um grupo com seleção parcial.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -128,13 +278,34 @@
       "name": "br-collapse",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/collapse?tab=designer).\n---\n\n\n### **Events:**\n - **brDidOpen** - Emitido ao expandir, com o identificador e o grupo de accordion.\n- **brDidClose** - Emitido ao recolher, com o identificador e o grupo de accordion.\n\n### **Methods:**\n - **handleOpen(event: _CustomEvent<{ id: string; accordionGroup: string }>_)** - Fecha este collapse quando outro do mesmo grupo é aberto.\n- **openCollapse()** - Abre o collapse programaticamente.\n- **closeCollapse()** - Fecha o collapse programaticamente.\n- **render()** - Renderiza o <details> com acionador e conteúdo expansível.\n\n### **Slots:**\n - **default** - Slot para o conteúdo expansível exibido ao abrir o collapse.\n- **trigger** - Slot para personalizar o acionador (texto, ícones, imagens, etc.).",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "open", "values": [] },
-        { "name": "accordion-group", "values": [] },
-        { "name": "icon-to-show", "values": [] },
-        { "name": "icon-to-hide", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único do componente. Um valor é gerado automaticamente quando não informado.",
+          "values": []
+        },
+        {
+          "name": "open",
+          "description": "Controla se o collapse está aberto.",
+          "values": []
+        },
+        {
+          "name": "accordion-group",
+          "description": "Identifica o grupo de accordion; quando informado, mantém apenas um item aberto por vez no mesmo grupo.",
+          "values": []
+        },
+        {
+          "name": "icon-to-show",
+          "description": "Classe CSS do ícone exibido quando o conteúdo está oculto.",
+          "values": []
+        },
+        {
+          "name": "icon-to-hide",
+          "description": "Classe CSS do ícone exibido quando o conteúdo está visível.",
+          "values": []
+        },
         {
           "name": "icon-position",
+          "description": "Define a posição do ícone no acionador: 'left' ou 'right'.",
           "values": [{ "name": "left" }, { "name": "right" }]
         }
       ],
@@ -144,13 +315,41 @@
       "name": "br-datetime-picker",
       "description": "Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/datetime-picker?tab=designer).\n---\n\n\n### **Events:**\n - **brDateTimeChange** - Evento disparado quando a data selecionada é alterada, tanto por interação do usuário quanto por métodos programáticos.\n\n### **Methods:**\n \n- **close()** - Fecha o dropdown do calendário.\n- **getValue(): _Promise<Date | null>_** - Retorna a data atualmente selecionada no datetime-picker.\n- **open()** - Abre o dropdown do calendário.\n- **reset()** - Reseta o estado interno do componente para os valores iniciais.\n- **setValue(value: _Date | null_)** - Define a data selecionada no datetime-picker.\n- **toggle()** - Alterna o estado do dropdown do calendário entre aberto e fechado.\n- **formResetCallback()** - Manipulador de reset do formulário.\n- **render(): __** - Renderiza o componente datetime-picker",
       "attributes": [
-        { "name": "auto-select-today", "values": [] },
-        { "name": "disabled", "values": [] },
-        { "name": "mode", "values": [{ "name": "DatetimePickerMode" }] },
-        { "name": "name", "values": [] },
-        { "name": "placeholder", "values": [] },
-        { "name": "value", "values": [{ "name": "Date" }] },
-        { "name": "week-starts-on", "values": [{ "name": "WeekDayIndex" }] }
+        {
+          "name": "auto-select-today",
+          "description": "Define se a data atual deve ser selecionada automaticamente ao abrir o datetime-picker.\nO padrão é false",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Define se o datetime-picker está desabilitado.",
+          "values": []
+        },
+        {
+          "name": "mode",
+          "description": "Define o modo do datetime-picker.\nOs valores possíveis são:\n- \"date\": Permite selecionar apenas a data.\n- \"time\": Permite selecionar apenas o horário.\n- \"datetime\": Permite selecionar tanto a data quanto o horário.",
+          "values": [{ "name": "DatetimePickerMode" }]
+        },
+        {
+          "name": "name",
+          "description": "Define o nome do campo do datetime-picker.\nEste nome será utilizado ao submeter o formulário que contém o datetime-picker.",
+          "values": []
+        },
+        {
+          "name": "placeholder",
+          "description": "Define o placeholder do campo de entrada do datetime-picker.",
+          "values": []
+        },
+        {
+          "name": "value",
+          "description": "Define o valor inicial do datetime-picker.\nPode ser uma instância de Date ou null.\nSe não for fornecido, o valor padrão será null.",
+          "values": [{ "name": "Date" }]
+        },
+        {
+          "name": "week-starts-on",
+          "description": "Define o dia da semana em que a semana começa.\nOs valores possíveis são:\n0 - Domingo\n1 - Segunda-feira\n2 - Terça-feira\n3 - Quarta-feira\n4 - Quinta-feira\n5 - Sexta-feira\n6 - Sábado",
+          "values": [{ "name": "WeekDayIndex" }]
+        }
       ],
       "references": []
     },
@@ -158,21 +357,66 @@
       "name": "br-divider",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/divider?tab=designer).\n---\n\n\n### **Methods:**\n - **updateColor()** - Watcher para a cor do divisor.\nAtualiza a propriedade CSS '--border-color' do elemento para refletir a cor definida.\nIsso permite que o divisor use cores personalizadas sem precisar de estilos adicionais.\n- **updateMargins()** - Watcher para as propriedades de margin.\nAtualiza as propriedades CSS customizáveis do elemento para refletir os margins definidos.\n\n### **Slots:**\n - **default** - Slot opcional para conteúdo dentro do divisor (texto, ícones ou elementos personalizados).",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "orientation", "values": [{ "name": "DividerOrientation" }] },
-        { "name": "thickness", "values": [{ "name": "DividerThickness" }] },
+        {
+          "name": "custom-id",
+          "description": "ID personalizado para o elemento, útil para acessibilidade e identificação única.\nSe não for fornecido, um ID único será gerado automaticamente.",
+          "values": []
+        },
+        {
+          "name": "orientation",
+          "description": "Orientação do divisor.Em modo vertical, posicione dentro de um container com `display: flex`.",
+          "values": [{ "name": "DividerOrientation" }]
+        },
+        {
+          "name": "thickness",
+          "description": "Espessura visual do divisor.",
+          "values": [{ "name": "DividerThickness" }]
+        },
         {
           "name": "border-style",
+          "description": "Estilo de borda do divisor.",
           "values": [{ "name": "DividerBorderStyle" }]
         },
-        { "name": "is-dark-mode", "values": [] },
-        { "name": "color", "values": [] },
-        { "name": "align", "values": [{ "name": "DividerAlign" }] },
-        { "name": "bleed", "values": [] },
-        { "name": "margin-top", "values": [] },
-        { "name": "margin-bottom", "values": [] },
-        { "name": "margin-left", "values": [] },
-        { "name": "margin-right", "values": [] }
+        {
+          "name": "is-dark-mode",
+          "description": "Ativa variante de alto contraste para fundos escuros.",
+          "values": []
+        },
+        {
+          "name": "color",
+          "description": "Cor do divisor.\nAceita os seguintes formatos de cor:\n- Cores nomeadas do CSS: 'red', 'blue', 'green', 'yellow', etc.\n- Códigos hexadecimais: '#ff0000', '#00ff00', '#0000ff', etc.\n- Valores RGB: 'rgb(255, 0, 0)', 'rgb(0, 255, 0)', etc.\n- Valores RGBA: 'rgba(255, 0, 0, 0.5)', 'rgba(0, 255, 0, 0.8)', etc.\n- Valores HSL: 'hsl(0, 100%, 50%)', 'hsl(120, 100%, 50%)', etc.\n- Valores HSLA: 'hsla(0, 100%, 50%, 0.5)', 'hsla(240, 100%, 50%, 0.7)', etc.\nSe não definida, usa a cor padrão do tema.",
+          "values": []
+        },
+        {
+          "name": "align",
+          "description": "Alinhamento do conteúdo quando há slot interno.",
+          "values": [{ "name": "DividerAlign" }]
+        },
+        {
+          "name": "bleed",
+          "description": "Faz o divisor ocupar toda a largura do container, compensando paddings laterais.",
+          "values": []
+        },
+        {
+          "name": "margin-top",
+          "description": "Margin top em pixels; se omitido, aplica padrão interno.",
+          "values": []
+        },
+        {
+          "name": "margin-bottom",
+          "description": "Margin bottom em pixels; se omitido, aplica padrão interno.",
+          "values": []
+        },
+        {
+          "name": "margin-left",
+          "description": "Margin left em pixels; se omitido, aplica padrão interno.",
+          "values": []
+        },
+        {
+          "name": "margin-right",
+          "description": "Margin right em pixels; se omitido, aplica padrão interno.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -180,10 +424,19 @@
       "name": "br-dropdown",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/dropdown?tab=designer).\n---\n\n\n### **Events:**\n - **brDropdownChange** - Evento emitido quando o estado do dropdown muda.\n- **brDidOpen** - Evento emitido quando o dropdown é aberto.\nEste evento é usado para implementar o auto-dismiss de outros dropdowns.\n\n### **Methods:**\n - **isOpenChanged(newValue: _boolean_)** - Método chamado sempre que a propriedade `isOpen` muda.\nEmite um evento com o novo estado do dropdown.\n- **targetZIndexChanged()** - Aplica o novo valor de z-index ao elemento target.\n- **open(): _Promise<{ isOpen: boolean }>_** - Abre o dropdown.\nDefine a propriedade `isOpen` como verdadeira e retorna o novo estado.\n Este método pode ser chamado externamente.\n- **hide(): _Promise<{ isOpen: boolean }>_** - Esconde o dropdown.\nDefine a propriedade `isOpen` como falsa e retorna o novo estado.\nEste método pode ser chamado externamente.\n- **setFocus()** - Define o foco no elemento interno do componente.\nEste método pode ser chamado externamente para garantir que o foco seja aplicado ao elemento correto.\n\n### **Slots:**\n - **trigger** - Slot para o elemento que aciona a abertura do dropdown.\n- **target** - Slot para o conteúdo exibido pelo dropdown.",
       "attributes": [
-        { "name": "is-open", "values": [] },
-        { "name": "custom-id", "values": [] },
+        {
+          "name": "is-open",
+          "description": "Indica se o dropdown está aberto ou fechado.\nEsta propriedade é refletida no DOM e pode ser alterada externamente.\nO valor padrão é falso (fechado).",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
         {
           "name": "placement",
+          "description": "Define o posicionamento do target (alvo) em relação ao trigger (acionador).",
           "values": [
             { "name": "" },
             { "name": "bottom-start" },
@@ -196,8 +449,16 @@
             { "name": "top" }
           ]
         },
-        { "name": "prevent-auto-dismiss", "values": [] },
-        { "name": "target-z-index", "values": [] }
+        {
+          "name": "prevent-auto-dismiss",
+          "description": "Define se o dropdown deve permanecer aberto quando outro dropdown é aberto.\nQuando definido como false (padrão), o dropdown será fechado automaticamente quando outro dropdown for aberto.\nQuando definido como true, o dropdown permanecerá aberto mesmo quando outro dropdown for aberto.",
+          "values": []
+        },
+        {
+          "name": "target-z-index",
+          "description": "Define o z-index do elemento target (alvo) do dropdown.\nPermite customizar a ordem de sobreposição do painel dropdown em relação aos demais elementos da página.\nO valor padrão utiliza a variável CSS do design system: var(--z-index-layer-1).",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -205,12 +466,21 @@
       "name": "br-footer",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/footer?tab=designer).\n---\n\n\n### **Methods:**\n - **render(): __** - Renderiza o componente.\n\n### **Slots:**\n - **logo** - Slot para o logo do rodapé, utilizando o componente br-logo.\n- **default** - Slot para o mapa do site, utilizando br-footer-category e br-footer-item.\n- **social-network** - Slot para as redes sociais, utilizando br-footer-social.\n- **partner-logo** - Slot para logos de parceiros, utilizando br-logo.\n- **legal** - Slot para informações legais, utilizando br-footer-legal.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
         {
           "name": "theme",
+          "description": "Indica o tema do rodapé.",
           "values": [{ "name": "dark" }, { "name": "light" }]
         },
-        { "name": "social-network-title", "values": [] }
+        {
+          "name": "social-network-title",
+          "description": "Texto de descrição das redes sociais.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -218,19 +488,56 @@
       "name": "br-header",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/header?tab=designer).\n---\n\n\n### **Events:**\n - **headerCompactChange** - Evento disparado quando o cabeçalho entra ou sai do modo compacto.\nO evento contém os detalhes do estado compacto e o ID do componente pai.\n- **headerWidthChange** - Evento disparado para indicar qual lista deve encolher primeiro.\nO evento contém os detalhes do ID do componente pai e o nome da lista.\n\n### **Methods:**\n - **watchIsCompact(newValue: _boolean_)** - Observa mudanças na propriedade isCompact.\n- **resetHeaderList()** - Reinicializa o estado das listas do cabeçalho, disparando o evento de redimensionamento.\nPode ser chamado externamente para forçar a atualização das listas.\n- **render(): __** - Renderiza o componente.\n\n### **Slots:**\n - **logo** - Slot para a logo do cabeçalho.\n- **signature** - Slot para a assinatura visual da organização.\n- **links** - Slot para links de navegação principais.\n- **functions** - Slot para botões de ação no cabeçalho.\n- **search** - Slot para o campo de busca.\n- **access** - Slot para o botão de acesso ou autenticação.\n- **menu-trigger** - Slot para o botão que abre o menu.\n- **caption** - Slot para o título do cabeçalho.\n- **subcaption** - Slot para o subtítulo do cabeçalho.",
       "attributes": [
-        { "name": "caption", "values": [] },
-        { "name": "caption-url", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "density", "values": [{ "name": "HeaderDensity" }] },
-        { "name": "is-compact", "values": [] },
-        { "name": "is-sticky", "values": [] },
-        { "name": "signature", "values": [] },
+        {
+          "name": "caption",
+          "description": "Texto exibido como título do cabeçalho.",
+          "values": []
+        },
+        {
+          "name": "caption-url",
+          "description": "URL associada ao título do cabeçalho.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único do cabeçalho; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "density",
+          "description": "Densidade do cabeçalho: controla espaçamento e proporções.",
+          "values": [{ "name": "HeaderDensity" }]
+        },
+        {
+          "name": "is-compact",
+          "description": "Ativa o modo compacto do cabeçalho.",
+          "values": []
+        },
+        {
+          "name": "is-sticky",
+          "description": "Fixa o cabeçalho no topo durante a rolagem.",
+          "values": []
+        },
+        {
+          "name": "signature",
+          "description": "Texto da assinatura exibida ao lado da logo.",
+          "values": []
+        },
         {
           "name": "shrink-first",
+          "description": "Define qual lista encolhe primeiro quando o espaço é limitado.",
           "values": [{ "name": "links" }, { "name": "functions" }]
         },
-        { "name": "subcaption", "values": [] },
-        { "name": "subcaption-url", "values": [] }
+        {
+          "name": "subcaption",
+          "description": "Texto exibido como subtítulo do cabeçalho.",
+          "values": []
+        },
+        {
+          "name": "subcaption-url",
+          "description": "URL associada ao subtítulo do cabeçalho.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -238,14 +545,39 @@
       "name": "br-icon",
       "description": "O componente `br-icon` fornece uma maneira flexível e dinâmica de incorporar ícones nas aplicações.\nUtilizando a biblioteca Iconify, ele permite o uso de uma ampla variedade de ícones.\n\nCom opções para especificar a altura e largura, adicionar classes CSS personalizadas, e definir como o ícone\ndeve ser rotacionado ou espelhado, o `br-icon` oferece aos desenvolvedores as ferramentas necessárias para\nintegrar ícones de forma consistente com o estilo e design de suas aplicações, melhorando a experiência do usuário\ne a clareza das interfaces.\n\nPara mais informações sobre quais ícones estão disponíveis, consulte a documentação do [Iconify](https://iconify.design/).\n---\n",
       "attributes": [
-        { "name": "icon-name", "values": [] },
-        { "name": "height", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "width", "values": [] },
-        { "name": "css-classes", "values": [] },
-        { "name": "is-inline", "values": [] },
+        {
+          "name": "icon-name",
+          "description": "Nome do ícone a ser exibido, utilizando a biblioteca Iconify.\nEste nome deve corresponder ao nome do ícone definido na biblioteca para que ele seja exibido corretamente.",
+          "values": []
+        },
+        {
+          "name": "height",
+          "description": "Define a altura do ícone. Pode ser especificada em qualquer unidade CSS válida, como pixels (px), ems (em), rems (rem), etc.\nO valor padrão é '16'.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "width",
+          "description": "Define a largura do ícone. Pode ser especificada em qualquer unidade CSS válida, como pixels (px), ems (em), rems (rem), etc.\nO valor padrão é '24'.",
+          "values": []
+        },
+        {
+          "name": "css-classes",
+          "description": "Permite adicionar classes CSS adicionais ao ícone.\nUse esta propriedade para aplicar estilos personalizados ao ícone, além dos estilos padrão.",
+          "values": []
+        },
+        {
+          "name": "is-inline",
+          "description": "Se definido como verdadeiro, o ícone será alinhado verticalmente ao texto ao seu redor.\nÚtil quando o ícone é usado em linha com texto para garantir que esteja alinhado corretamente com o texto.\nO valor padrão é `false`.",
+          "values": []
+        },
         {
           "name": "rotate",
+          "description": "Define o ângulo de rotação do ícone.",
           "values": [
             { "name": "90deg" },
             { "name": "180deg" },
@@ -254,10 +586,19 @@
         },
         {
           "name": "flip",
+          "description": "Define o tipo de espelhamento do ícone.",
           "values": [{ "name": "horizontal" }, { "name": "vertical" }]
         },
-        { "name": "is-focusable", "values": [] },
-        { "name": "lazy", "values": [] }
+        {
+          "name": "is-focusable",
+          "description": "Determina se o ícone pode receber foco.\nSe definido como verdadeiro, o ícone pode ser navegado usando Tab.\nO valor padrão é `false`.",
+          "values": []
+        },
+        {
+          "name": "lazy",
+          "description": "Controla o comportamento de carregamento do ícone através do observer interno do Iconify.\n\nComportamento:\n- Padrão (propriedade não definida): carregamento imediato aplicando `noobserver` para evitar problemas de layout shift\n- `lazy={true}`: ativa o observer para carregamento lazy otimizado (útil em documentos longos com muitos ícones)\n- `lazy={false}`: carregamento imediato aplicando `noobserver` (mesmo comportamento do padrão)\n\n**Nota**: O padrão foi alterado para carregamento imediato para resolver problemas de deslocamento de layout\nque ocorriam quando ícones eram carregados depois do conteúdo inicial.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -267,6 +608,7 @@
       "attributes": [
         {
           "name": "type",
+          "description": "Especifica o tipo de entrada do campo.",
           "values": [
             { "name": "" },
             { "name": "color" },
@@ -284,21 +626,36 @@
         },
         {
           "name": "autocomplete",
+          "description": "Controla o comportamento de preenchimento automático do navegador para o input.",
           "values": [{ "name": "on" }, { "name": "off" }]
         },
         {
           "name": "density",
+          "description": "Ajusta a densidade, alterando o espaçamento interno para um visual mais compacto ou mais expandido.",
           "values": [
             { "name": "large" },
             { "name": "medium" },
             { "name": "small" }
           ]
         },
-        { "name": "disabled", "values": [] },
-        { "name": "is-inline", "values": [] },
-        { "name": "is-highlight", "values": [] },
+        {
+          "name": "disabled",
+          "description": "Desativa o input, tornando-o não interativo.",
+          "values": []
+        },
+        {
+          "name": "is-inline",
+          "description": "Se verdadeiro, o rótulo e o input estarão na mesma linha (layout inline).",
+          "values": []
+        },
+        {
+          "name": "is-highlight",
+          "description": "Se verdadeiro, o input terá destaque visual.",
+          "values": []
+        },
         {
           "name": "state",
+          "description": "Define o estado do input\nOs possíveis valores são:\n- 'info': Mensagem informativa.\n- 'warning': Mensagem de aviso.\n- 'danger': Mensagem de erro ou alerta.\n- 'success': Mensagem de sucesso.\nO valor padrão é 'info'.",
           "values": [
             { "name": "info" },
             { "name": "warning" },
@@ -306,30 +663,111 @@
             { "name": "success" }
           ]
         },
-        { "name": "label", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "name", "values": [] },
-        { "name": "placeholder", "values": [] },
-        { "name": "readonly", "values": [] },
-        { "name": "required", "values": [] },
-        { "name": "value", "values": [] },
-        { "name": "control-width", "values": [] },
-        { "name": "borderless", "values": [] },
-        { "name": "help-text", "values": [] },
+        {
+          "name": "label",
+          "description": "Texto exibido como rótulo do input.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "name",
+          "description": "Nome do input, utilizado para identificação em formulários.",
+          "values": []
+        },
+        {
+          "name": "placeholder",
+          "description": "Texto exibido dentro do input quando está vazio, fornecendo uma dica ou sugestão ao usuário.",
+          "values": []
+        },
+        {
+          "name": "readonly",
+          "description": "Se verdadeiro, o valor do input é exibido, mas não pode ser editado pelo usuário.",
+          "values": []
+        },
+        {
+          "name": "required",
+          "description": "Se verdadeiro, o input é obrigatório e deve ser preenchido antes que o formulário possa ser enviado.",
+          "values": []
+        },
+        {
+          "name": "value",
+          "description": "Valor exibido no input.\nPode ser alterado pelo usuário se a propriedade `readonly` não estiver ativa.",
+          "values": []
+        },
+        {
+          "name": "control-width",
+          "description": "Largura do campo de entrada (por exemplo, '88px').\nQuando definido, sobrescreve a largura padrão de 100%.",
+          "values": []
+        },
+        {
+          "name": "borderless",
+          "description": "Remove a borda do input quando não está em foco.\nÚtil para composições contextuais (ex.: paginação).",
+          "values": []
+        },
+        {
+          "name": "help-text",
+          "description": "Texto adicional que fornece ajuda ou informações sobre o input.",
+          "values": []
+        },
         {
           "name": "autocorrect",
+          "description": "Controla a correção automática do texto.",
           "values": [{ "name": "off" }, { "name": "on" }]
         },
-        { "name": "min", "values": [] },
-        { "name": "max", "values": [] },
-        { "name": "minlength", "values": [] },
-        { "name": "maxlength", "values": [] },
-        { "name": "multiple", "values": [] },
-        { "name": "pattern", "values": [] },
-        { "name": "mask", "values": [] },
-        { "name": "step", "values": [] },
-        { "name": "action-label", "values": [] },
-        { "name": "action-tab-index", "values": [] }
+        {
+          "name": "min",
+          "description": "Define o valor mínimo para campos de entrada numéricos.",
+          "values": []
+        },
+        {
+          "name": "max",
+          "description": "Define o valor máximo para campos de entrada numéricos.",
+          "values": []
+        },
+        {
+          "name": "minlength",
+          "description": "Define o comprimento mínimo do valor do campo de entrada.",
+          "values": []
+        },
+        {
+          "name": "maxlength",
+          "description": "Define o comprimento máximo do valor do campo de entrada.",
+          "values": []
+        },
+        {
+          "name": "multiple",
+          "description": "Se verdadeiro, permite a seleção de múltiplos arquivos.",
+          "values": []
+        },
+        {
+          "name": "pattern",
+          "description": "Define o padrão de entrada para validação.",
+          "values": []
+        },
+        {
+          "name": "mask",
+          "description": "Máscara aplicada ao valor digitado (use `#` para marcar posições numéricas).",
+          "values": []
+        },
+        {
+          "name": "step",
+          "description": "Define o valor do passo para campos de entrada numéricos.",
+          "values": []
+        },
+        {
+          "name": "action-label",
+          "description": "Texto exibido no botão de ação à direita do input.",
+          "values": []
+        },
+        {
+          "name": "action-tab-index",
+          "description": "Define o tabindex do botão de ação.\nÚtil para remover o botão da sequência de tabulação quando o foco é gerenciado externamente (ex.: br-select).",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -337,14 +775,39 @@
       "name": "br-item",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/item?tab=designer).\n---\n\n\n### **Events:**\n - **brDidClick** - Evento customizado emitido quando o item é clicado, aplicável apenas se o item for um botão (`<button>`).\nPode ser utilizado para ações personalizadas, exceto quando o item está desativado.\n- **brDidSelect** - Evento customizado aplicável para todos os tipos de elementos (`div`, `button`, `a`), emitido quando o item é selecionado e desde que a propriedade `isInteractive` esteja presente.\n\n### **Methods:**\n - **setFocus()** - Define o foco no elemento interno do componente.\nEste método pode ser chamado externamente para garantir que o foco seja aplicado ao elemento correto.\n\n### **Slots:**\n - **default** - Área de conteúdo, podendo conter qualquer componente, exceto botões primários e componentes relacionados à navegação (como carrosséis, paginações, abas, menus, etc.).\n- **start** - Área de recursos visuais, podendo conter elementos como ícones, avatares e mídias.\n- **end** - Área de recursos complementares, podendo conter componentes interativos, metadados e informações adicionais.",
       "attributes": [
-        { "name": "disabled", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "is-active", "values": [] },
-        { "name": "is-selected", "values": [] },
-        { "name": "is-interactive", "values": [] },
-        { "name": "href", "values": [] },
+        {
+          "name": "disabled",
+          "description": "Desativa o item, tornando-o não interativo.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "is-active",
+          "description": "Indica se o item está no estado ativo.\nSe definido como verdadeiro, o item será exibido como ativo.",
+          "values": []
+        },
+        {
+          "name": "is-selected",
+          "description": "Indica se o item está no estado selecionado.\nSe definido como verdadeiro, o item será exibido como selecionado.",
+          "values": []
+        },
+        {
+          "name": "is-interactive",
+          "description": "Marca o item como interativo, permitindo que toda a superfície do item seja clicável.",
+          "values": []
+        },
+        {
+          "name": "href",
+          "description": "URL ou caminho para o qual o usuário será direcionado ao clicar no item. Quando definido, o item será renderizado como um link.",
+          "values": []
+        },
         {
           "name": "target",
+          "description": "Define o alvo do link quando `href` está presente. Pode ser:\n- `_blank` para abrir em uma nova aba,\n- `_self` para abrir na mesma aba,\n- `_parent` para abrir na aba pai,\n- `_top` para abrir na aba superior.",
           "values": [
             { "name": "_blank" },
             { "name": "_self" },
@@ -352,18 +815,28 @@
             { "name": "_top" }
           ]
         },
-        { "name": "is-button", "values": [] },
+        {
+          "name": "is-button",
+          "description": "Quando definido como `true`, o item será tratado como um botão.",
+          "values": []
+        },
         {
           "name": "type",
+          "description": "Tipo do botão, aplicável apenas se `isButton` for `true`. Pode ser:\n- `'submit'` para enviar um formulário,\n- `'reset'` para redefinir um formulário,\n- `'button'` para um botão padrão.",
           "values": [
             { "name": "submit" },
             { "name": "reset" },
             { "name": "button" }
           ]
         },
-        { "name": "value", "values": [] },
+        {
+          "name": "value",
+          "description": "Define um valor associado ao br-item quando renderizado como um botão, utilizado em contextos de formulário.",
+          "values": []
+        },
         {
           "name": "density",
+          "description": "Ajusta a densidade, alterando o espaçamento interno para um visual mais compacto ou mais expandido.",
           "values": [
             { "name": "large" },
             { "name": "medium" },
@@ -377,12 +850,36 @@
       "name": "br-list",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/list?tab=designer).\n---\n\n\n### **Methods:**\n - **render(): __** - Renderiza o componente.\n\n### **Slots:**\n - **default** - Slot para os itens da lista.\n- **header** - Slot para ações ou conteúdo do cabeçalho da lista.",
       "attributes": [
-        { "name": "header", "values": [] },
-        { "name": "is-horizontal", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "hide-header-divider", "values": [] },
-        { "name": "collapse", "values": [] },
-        { "name": "accordion", "values": [] }
+        {
+          "name": "header",
+          "description": "Define o cabeçalho para a lista.",
+          "values": []
+        },
+        {
+          "name": "is-horizontal",
+          "description": "Indica se a lista será horizontal. Por padrão, a lista é vertical.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "hide-header-divider",
+          "description": "Indica que o divider para o título da lista estará oculto.",
+          "values": []
+        },
+        {
+          "name": "collapse",
+          "description": "Indica se a lista possui o comportamento de collapse.",
+          "values": []
+        },
+        {
+          "name": "accordion",
+          "description": "Indica se a lista possui o comportamento de accordion.\nO valor da propriedade define o grupo, ou seja, o accordion é aplicado a todas as listas que possuem o mesmo valor para esta propriedade.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -390,11 +887,31 @@
       "name": "br-loading",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/loading?tab=designer).\n---\n",
       "attributes": [
-        { "name": "is-progress", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "progress-percent", "values": [] },
-        { "name": "is-medium", "values": [] },
-        { "name": "label", "values": [] }
+        {
+          "name": "is-progress",
+          "description": "Determina o tipo de indicador a ser exibido:\n- Se verdadeiro, exibirá uma barra de progresso com a porcentagem de progresso.\n- Se falso, exibirá um indicador de carregamento indeterminado.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "progress-percent",
+          "description": "Define a porcentagem de progresso a ser exibida na barra de progresso.\nDeve ser um valor numérico entre 0 e 100. Ignorado se `isProgress` estiver definido como falso.",
+          "values": []
+        },
+        {
+          "name": "is-medium",
+          "description": "Se verdadeiro, ajusta o tamanho do indicador de carregamento para o tamanho médio.",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "Texto a ser exibido abaixo do indicador de carregamento.\nPode ser usado para fornecer informações adicionais ou descritivas sobre o estado do carregamento.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -402,39 +919,81 @@
       "name": "br-magic-button",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/magic-button?tab=designer).\n---\n\n\n### **Methods:**\n - **render()** - Renderiza o componente.\n\n### **Slots:**\n - **default** - Conteúdo interno do botão (texto ou ícone).",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "label", "values": [] },
-        { "name": "icon", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nSe não for fornecido, será gerado automaticamente.",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "Texto do rótulo do botão.\nUtilizado como conteúdo principal quando presente.",
+          "values": []
+        },
+        {
+          "name": "icon",
+          "description": "Nome do ícone a ser exibido.\nDeve corresponder a um ícone disponível no sistema de ícones.",
+          "values": []
+        },
         {
           "name": "density",
+          "description": "Densidade do botão.\nDefine o tamanho do componente:\n- `large` para grande\n- `medium` para médio\n- `small` para pequeno",
           "values": [
             { "name": "large" },
             { "name": "medium" },
             { "name": "small" }
           ]
         },
-        { "name": "circle", "values": [] },
-        { "name": "aria-label", "values": [] }
+        {
+          "name": "circle",
+          "description": "Define se o botão terá formato circular.\nAplica contorno arredondado completo quando `true` e não houver `label`.",
+          "values": []
+        },
+        {
+          "name": "aria-label",
+          "description": "Texto de acessibilidade (ARIA label).\nDeve ser fornecido para ícones sem texto para garantir acessibilidade.",
+          "values": []
+        }
       ],
       "references": []
     },
     {
       "name": "br-menu",
-      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/menu?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para o conteúdo principal do menu (menu-list e menu-item).\n- **header** - Slot para o cabeçalho do menu, exibido apenas em modo não contextual.\n- **logo** - Slot para logotipos de parceiros no rodapé.\n- **link** - Slot para links externos no rodapé (use br-menu-link).\n- **social** - Slot para ícones de redes sociais no rodapé.\n- **info** - Slot para informações adicionais no rodapé.",
+      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/menu?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para o conteúdo principal do menu (menu-list e menu-item).\n- **header** - Slot para o cabeçalho do menu, exibido apenas em modo não contextual.\n- **logo** - Slot para logotipos de parceiros no rodapé.\n- **link** - Slot para links externos no rodapé (use br-menu-link).\n- **social** - Slot para ícones de redes sociais no rodapé.\n- **info** - Slot para informações adicionais no rodapé.\n\n### **CSS Parts:**\n - **footer** - Parte para o contêiner principal do rodapé do menu, agrupando logos, links, redes sociais e informações.\n- **logo** - Parte para a área de logotipos de parceiros no rodapé.\n- **link** - Parte para links úteis ou navegação secundária no rodapé.\n- **social** - Parte para ícones de redes sociais no rodapé.\n- **info** - Parte para informações adicionais, como licença ou direitos autorais.",
       "attributes": [
-        { "name": "breakpoints", "values": [] },
-        { "name": "push", "values": [] },
-        { "name": "contextual", "values": [] },
+        {
+          "name": "breakpoints",
+          "description": "Classes CSS para definir breakpoints responsivos do menu.\nUtilize esta propriedade para controlar a largura do menu em diferentes tamanhos de tela.",
+          "values": []
+        },
+        {
+          "name": "push",
+          "description": "Define se o menu deve usar comportamento push (sempre visível em telas maiores).\nQuando ativado, o menu permanece fixo na lateral e empurra o conteúdo principal.",
+          "values": []
+        },
+        {
+          "name": "contextual",
+          "description": "Define se o menu deve usar comportamento contextual (aparece na parte inferior).\nQuando ativado, o menu é posicionado na parte inferior da tela em dispositivos móveis.",
+          "values": []
+        },
         {
           "name": "density",
+          "description": "Define a densidade dos itens do menu, alterando o espaçamento interno.\n- `small` (densidade alta): itens mais compactos\n- `medium` (padrão): equilíbrio entre economia de espaço e separação\n- `large` (densidade baixa): maior espaçamento (recomendado em touch)",
           "values": [
             { "name": "large" },
             { "name": "medium" },
             { "name": "small" }
           ]
         },
-        { "name": "social-title", "values": [] },
-        { "name": "contextual-label", "values": [] }
+        {
+          "name": "social-title",
+          "description": "Título da seção de redes sociais exibida no rodapé do menu.\nUtilize esta propriedade para personalizar o texto que aparece acima dos ícones sociais.",
+          "values": []
+        },
+        {
+          "name": "contextual-label",
+          "description": "Rótulo do botão trigger do menu contextual.\nExibido apenas em modo contextual e em telas menores (mobile).",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -442,16 +1001,49 @@
       "name": "br-message",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/message?tab=designer).\n---\n\n\n### **Events:**\n - **brDidClose** - Evento emitido quando o usuário fecha a mensagem, se closable for true.\n\n### **Slots:**\n - **default** - Utilizado para inserir qualquer conteúdo que será exibido no corpo da mensagem.\n- **icon** - Slot para ícone customizado. Se usado, certifique-se de adicionar aria-label apropriado ou aria-hidden=\"true\" se for decorativo.",
       "attributes": [
-        { "name": "message-title", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "message", "values": [] },
-        { "name": "is-inline", "values": [] },
-        { "name": "is-closable", "values": [] },
-        { "name": "auto-remove", "values": [] },
-        { "name": "show-icon", "values": [] },
-        { "name": "is-feedback", "values": [] },
+        {
+          "name": "message-title",
+          "description": "Define o título da mensagem, que é exibido no início, acima da mensagem principal.\nEste título serve para destacar a mensagem textual. Não é aplicável para mensagens do tipo feedback.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "message",
+          "description": "Define o texto da mensagem que será exibido.\nEste é o conteúdo principal da mensagem. A propriedade `message` é obrigatória e deve ser fornecida para que a mensagem apareça.",
+          "values": []
+        },
+        {
+          "name": "is-inline",
+          "description": "Se definido como verdadeiro, o título da mensagem será exibido na mesma linha que a mensagem principal.\nIsso pode ser útil para criar um layout onde o título e a mensagem estão alinhados horizontalmente.",
+          "values": []
+        },
+        {
+          "name": "is-closable",
+          "description": "Se definido como verdadeiro, um botão de fechar será exibido para permitir que o usuário feche a mensagem.\nO fechamento emitirá o evento `brDidClose`, mas não removerá automaticamente o componente do DOM, a menos que a propriedade `autoRemove` também esteja definida como `true`.\nEste recurso não está disponível para mensagens do tipo feedback.",
+          "values": []
+        },
+        {
+          "name": "auto-remove",
+          "description": "Controla o comportamento do fechamento do componente quando `isClosable` é verdadeiro.\n- Se definido como `true`, o componente será automaticamente removido do DOM ao clicar no botão de fechar.\n- Se definido como `false`, o componente permanecerá no DOM e apenas emitirá o evento `brDidClose`.\n\nEsta propriedade não tem efeito se `isClosable` for `false`.\nO valor padrão é `false`.",
+          "values": []
+        },
+        {
+          "name": "show-icon",
+          "description": "Se definido como verdadeiro, um ícone associado à mensagem será exibido.\nUse esta propriedade para mostrar ou ocultar o ícone da mensagem conforme necessário.",
+          "values": []
+        },
+        {
+          "name": "is-feedback",
+          "description": "Define se a mensagem é do tipo feedback, geralmente usada para fornecer contexto adicional sobre ações do usuário.\nExemplos incluem mensagens de validação em campos de formulário. Não disponível para mensagens que não sejam de feedback.",
+          "values": []
+        },
         {
           "name": "state",
+          "description": "Define o estado do message.\nOs possíveis valores são:\n- 'info': Mensagem informativa.\n- 'warning': Mensagem de aviso.\n- 'danger': Mensagem de erro ou alerta.\n- 'success': Mensagem de sucesso.\nO valor padrão é 'info'.",
           "values": [
             { "name": "info" },
             { "name": "warning" },
@@ -459,21 +1051,46 @@
             { "name": "success" }
           ]
         },
-        { "name": "aria-label", "values": [] }
+        {
+          "name": "aria-label",
+          "description": "Define um rótulo customizado para leitores de tela.\nSe não fornecido, será gerado automaticamente baseado no estado da mensagem.\nExemplo: \"Mensagem de sucesso\", \"Mensagem de erro\", etc.",
+          "values": []
+        }
       ],
       "references": []
     },
     {
       "name": "br-modal",
-      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/modal?tab=designer).\n---\n\n\n### **Events:**\n - **brModalClose** - Evento emitido quando o modal solicita ser fechado (pelo botão 'x', tecla 'Escape' ou clique no scrim).\n\n### **Methods:**\n - **open()** - Método público para abrir o modal\n- **close()** - Método público para fechar o modal\n\n### **Slots:**\n - **header** - Cabeçalho do modal. Se não for usado, o `title-text` será exibido.\n- **default** - Corpo do modal.\n- **footer** - Rodapé do modal.\n- **close-button** - Botão de fechar customizado. Se não for usado, o botão padrão será exibido.",
+      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/modal?tab=designer).\n---\n\n\n### **Events:**\n - **brModalOpen** - Evento emitido quando o modal é aberto (quando `show` muda de `false` para `true`).\n- **brModalClose** - Evento emitido após o modal ser fechado (quando `show` muda de `true` para `false`).\n- **brModalBeforeClose** - Evento emitido antes do fechamento do modal (quando o botão X é clicado).\nSe autoClose está desativado, o desenvolvedor deve fechar manualmente o modal após este evento.\nSe autoClose está ativado, o modal fecha automaticamente após este evento.\n\n### **Methods:**\n - **open()** - Método público para abrir o modal\n- **close()** - Método público para fechar o modal\n\n### **Slots:**\n - **header** - Cabeçalho do modal. Se não for usado, o `title-text` será exibido.\n- **default** - Corpo do modal.\n- **footer** - Rodapé do modal.\n- **close-button** - Botão de fechar customizado. Se não for usado, o botão padrão será exibido.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "title-text", "values": [] },
-        { "name": "show", "values": [] },
-        { "name": "auto-close", "values": [] },
-        { "name": "initial-focus-selector", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "title-text",
+          "description": "O texto do título a ser exibido no cabeçalho do modal. Usado quando o slot `header` não é fornecido.",
+          "values": []
+        },
+        {
+          "name": "show",
+          "description": "Controla a visibilidade do modal.",
+          "values": []
+        },
+        {
+          "name": "auto-close",
+          "description": "Define o comportamento de fechamento do modal.\n\n- `true`: O modal fecha automaticamente ao clicar no botão fechar.\n- `false`: O modal emite `brModalBeforeClose` mas não fecha, permitindo a implementação de lógica customizada (validação, confirmação, etc.) antes do fechamento. O desenvolvedor deve\n  controlar manualmente o fechamento.",
+          "values": []
+        },
+        {
+          "name": "initial-focus-selector",
+          "description": "Seletor CSS para o elemento que deve receber foco quando o modal é aberto.",
+          "values": []
+        },
         {
           "name": "size",
+          "description": "Define o tamanho (largura) do modal.",
           "values": [
             { "name": "xsmall" },
             { "name": "small" },
@@ -482,10 +1099,14 @@
             { "name": "auto" }
           ]
         },
-        { "name": "scrim", "values": [] },
-        { "name": "scrollable", "values": [] },
+        {
+          "name": "scrollable",
+          "description": "Se `true`, habilita a rolagem interna do conteúdo do modal.",
+          "values": []
+        },
         {
           "name": "align-footer",
+          "description": "Define o alinhamento do conteúdo do rodapé (slot=\"footer\").",
           "values": [
             { "name": "start" },
             { "name": "end" },
@@ -497,18 +1118,51 @@
     },
     {
       "name": "br-pagination",
-      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/pagination?tab=designer).\n---\n\n\n### **Events:**\n - **pageChange** - Emite quando a página muda por interação do usuário.\n- **perPageChange** - Emite quando o valor de itens por página é alterado (variante contextual).",
+      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/pagination?tab=designer).\n---\n\n\n### **Events:**\n - **pageChange** - Emite quando a página muda por interação do usuário.\n- **perPageChange** - Emite quando o valor de itens por página é alterado (variante contextual).\n\n### **CSS Parts:**\n - **nav** - Parte para o contêiner raiz da paginação (elemento nav), usada para estilização via ::part().\n- **list** - Parte para a lista de páginas (elemento ul), usada para estilização via ::part().\n- **page** - Parte para os itens de página numérica (elemento a), usada para estilização via ::part().\n- **prev-button** - Parte para o botão de página anterior, usada para estilização via ::part().\n- **next-button** - Parte para o botão de próxima página, usada para estilização via ::part().",
       "attributes": [
-        { "name": "color-mode", "values": [{ "name": "dark" }] },
-        { "name": "custom-id", "values": [] },
-        { "name": "total", "values": [] },
-        { "name": "current", "values": [] },
-        { "name": "aria-label", "values": [] },
-        { "name": "previous-label", "values": [] },
-        { "name": "next-label", "values": [] },
-        { "name": "ellipsis-label", "values": [] },
+        {
+          "name": "color-mode",
+          "description": "Define se a paginação usará um esquema de cores escuro.\nQuando definido como `dark`, aplica a classe `dark-mode` ao container principal.",
+          "values": [{ "name": "dark" }]
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "total",
+          "description": "Quantidade total de páginas (mínimo 1).",
+          "values": []
+        },
+        {
+          "name": "current",
+          "description": "Página atual (1-indexada). Valores fora do intervalo serão ajustados.",
+          "values": []
+        },
+        {
+          "name": "aria-label",
+          "description": "Rótulo acessível do container `nav`.\nSe não fornecido, será gerado automaticamente um rótulo descritivo e único\nno momento da renderização (ex.: \"Paginação: página 2 de 10\").",
+          "values": []
+        },
+        {
+          "name": "previous-label",
+          "description": "Rótulo acessível do botão de página anterior.",
+          "values": []
+        },
+        {
+          "name": "next-label",
+          "description": "Rótulo acessível do botão de próxima página.",
+          "values": []
+        },
+        {
+          "name": "ellipsis-label",
+          "description": "Rótulo acessível do botão de reticências que abre a lista de páginas ocultas.",
+          "values": []
+        },
         {
           "name": "density",
+          "description": "Ajusta a densidade da paginação, alterando o espaçamento interno para um visual mais compacto ou mais expandido.",
           "values": [
             { "name": "large" },
             { "name": "medium" },
@@ -517,14 +1171,39 @@
         },
         {
           "name": "variant",
+          "description": "Variante de renderização do componente.\n- `default`: paginação numérica (padrão)\n- `contextual`: paginação contextual com seletores e informação de itens",
           "values": [{ "name": "default" }, { "name": "contextual" }]
         },
-        { "name": "total-items", "values": [] },
-        { "name": "per-page", "values": [] },
-        { "name": "per-page-options", "values": [{ "name": "number[]" }] },
-        { "name": "per-page-label", "values": [] },
-        { "name": "go-to-page-label", "values": [] },
-        { "name": "items-text", "values": [] }
+        {
+          "name": "total-items",
+          "description": "Total de itens (aplicável na variante contextual).",
+          "values": []
+        },
+        {
+          "name": "per-page",
+          "description": "Itens por página (aplicável na variante contextual).",
+          "values": []
+        },
+        {
+          "name": "per-page-options",
+          "description": "Opções disponíveis de itens por página (variante contextual).",
+          "values": [{ "name": "number[]" }]
+        },
+        {
+          "name": "per-page-label",
+          "description": "Rótulo do seletor de itens por página (variante contextual).",
+          "values": []
+        },
+        {
+          "name": "go-to-page-label",
+          "description": "Rótulo do seletor \"ir para página\" (variante contextual).",
+          "values": []
+        },
+        {
+          "name": "items-text",
+          "description": "Sufixo textual para a informação de quantidade de itens (variante contextual).",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -532,17 +1211,46 @@
       "name": "br-radio",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/radio?tab=designer).\n---\n\n\n### **Events:**\n - **checkedChange** - Disparado depois que o valor do `checked` foi alterado\n\n### **Methods:**\n - **handleKeyDown(event: _KeyboardEvent_)** - Navega e seleciona o próximo/anterior rádio habilitado no grupo via teclas de seta.\nAtivado por 'keydown', move a seleção entre rádios do mesmo 'name'\nusando as setas, partindo do rádio atualmente checado.\n- **toggleChecked()** - Inverte o valor da prop `checked`\n\n### **Slots:**\n - **default** - Slot para o rótulo do rádio, como alternativa à propriedade label.",
       "attributes": [
-        { "name": "checked", "values": [] },
-        { "name": "disabled", "values": [] },
+        {
+          "name": "checked",
+          "description": "Define o estado de seleção do radio.\nSe definido como verdadeiro, o radio estará marcado. Caso contrário, estará desmarcado.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Desativa o radio, tornando-o não interativo.",
+          "values": []
+        },
         {
           "name": "state",
+          "description": "Indica a validade do radio.\nSe não for especificado, o valor padrão é `null`, indicando que a validade não foi definida.",
           "values": [{ "name": "valid" }, { "name": "invalid" }]
         },
-        { "name": "has-hidden-label", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "name", "values": [] },
-        { "name": "label", "values": [] },
-        { "name": "value", "values": [] }
+        {
+          "name": "has-hidden-label",
+          "description": "Define se o label associado ao radio deve ser oculto.\nSe definido como verdadeiro, o texto do label será oculto, mas o radio ainda estará visível e funcional.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "name",
+          "description": "Define o nome do radio, que é utilizado para agrupar radios em formulários e identificar o campo.\nO valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários.",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "Texto descritivo exibido à direita do radio.\nCaso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.",
+          "values": []
+        },
+        {
+          "name": "value",
+          "description": "Define o valor associado ao radio quando ele faz parte de um formulário nativo (`<form>`).\nEsse valor é enviado com o formulário quando o radio está selecionado.\n**Nota:** Esta propriedade não deve ser utilizada para determinar se o radio está selecionado; para verificar o estado de seleção, use a propriedade `checked`.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -550,10 +1258,19 @@
       "name": "br-scrim",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/scrim?tab=designer).\n---\n\n\n### **Events:**\n - **brScrimOpen** - Indica que o scrim foi aberto.\n- **brScrimClose** - Indica que o scrim foi fechado\n\n### **Methods:**\n - **setScrollThreshold(threshold: _number_)** - Define o limite de rolagem para o fechamento automático do scrim.\n- **open()** - Método público para exibir o scrim\n- **close()** - Método público para esconder o scrim\n- **toggle()** - Método público para alternar o estado de exibição do scrim\n\n### **Slots:**\n - **default** - Slot para o conteúdo principal a ser exibido sobre o fundo escurecido do scrim.\n- **activator** - Slot para o elemento ativador do scrim, com prioridade sobre a propriedade activator.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "is-open", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "is-open",
+          "description": "Ativa/desativa o scrim",
+          "values": []
+        },
         {
           "name": "position-content",
+          "description": "Posiciona o conteúdo no topo, centro, direita, esquerda, abaixo dentro do scrim",
           "values": [
             { "name": "top" },
             { "name": "center" },
@@ -562,21 +1279,51 @@
             { "name": "bottom" }
           ]
         },
-        { "name": "disable-close-on-click", "values": [] },
-        { "name": "z-index", "values": [] },
-        { "name": "bg-color", "values": [] },
-        { "name": "custom-opacity", "values": [] },
+        {
+          "name": "disable-close-on-click",
+          "description": "Desativa o fechamento do scrim ao ser clicado",
+          "values": []
+        },
+        {
+          "name": "z-index",
+          "description": "Define o valor de z-index do scrim",
+          "values": []
+        },
+        {
+          "name": "bg-color",
+          "description": "Cor de fundo personalizada para o scrim.\nAceita os seguintes formatos de cor:\n- Cores nomeadas do CSS: 'red', 'blue', 'green', 'yellow', etc.\n- Códigos hexadecimais: '#ff0000', '#00ff00', '#0000ff', etc.\n- Valores RGB: 'rgb(255, 0, 0)', 'rgb(0, 255, 0)', etc.\n- Valores RGBA: 'rgba(255, 0, 0, 0.5)', 'rgba(0, 255, 0, 0.8)', etc.\n- Valores HSL: 'hsl(0, 100%, 50%)', 'hsl(120, 100%, 50%)', etc.\n- Valores HSLA: 'hsla(0, 100%, 50%, 0.5)', 'hsla(240, 100%, 50%, 0.7)', etc.\nSe não especificada, usa a cor padrão do tema.",
+          "values": []
+        },
+        {
+          "name": "custom-opacity",
+          "description": "Define a opacidade personalizada do scrim",
+          "values": []
+        },
         {
           "name": "display-mode",
+          "description": "Define o modo de exibição do scrim:\n- 'fullscreen': Ocupa toda a tela (position: fixed).\n- 'parent': Ocupa apenas o elemento pai (position: absolute).\nO elemento pai deve ter `position: relative` ou outro valor de posicionamento diferente de `static`.",
           "values": [{ "name": "fullscreen" }, { "name": "parent" }]
         },
         {
           "name": "scroll-strategy",
+          "description": "Define a estratégia de manipulação de rolagem quando scrim está aberto\n- 'block': Impede a rolagem completamente\n- 'close': Fecha o scrim quando ocorre rolagem",
           "values": [{ "name": "block" }, { "name": "close" }]
         },
-        { "name": "scroll-threshold", "values": [] },
-        { "name": "activator", "values": [] },
-        { "name": "aria-label", "values": [] }
+        {
+          "name": "scroll-threshold",
+          "description": "Determina quanto de rolagem (em pixels) é necessário para acionar a ação de fechamento automático do scrim.",
+          "values": []
+        },
+        {
+          "name": "activator",
+          "description": "Define o seletor para o elemento activator.\nNota: O slot 'activator' tem prioridade sobre esta propriedade.",
+          "values": []
+        },
+        {
+          "name": "aria-label",
+          "description": "Define um rótulo acessível personalizado para o diálogo.\nSe não fornecido, será usado \"Conteúdo do diálogo\" como padrão.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -584,11 +1331,24 @@
       "name": "br-select",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/select?tab=designer).\n---\n\n\n### **Events:**\n - **valueChange** - Evento emitido sempre que houver atualização nos itens selecionados.\nRENOMEADO PARA valueChange para compatibilidade com ngModel.\n- **optionHover** - Emite os dados da opção quando ela recebe foco/hover (antes da seleção).\n- **opened** - Dispara quando o dropdown é aberto.\n- **closed** - Dispara quando o dropdown é fechado.\n\n### **Methods:**\n - **toggleOpen()** - Inverte o valor da prop `isOpen`\n- **clear()** - Limpa todas as opções selecionadas.\n- **getValue(): _Promise<string | string[]>_** - Retorna o valor selecionado.\n- **setValue(newValue: _string | string[]_)** - Define o valor do componente.",
       "attributes": [
-        { "name": "label", "values": [] },
-        { "name": "placeholder", "values": [] },
-        { "name": "is-multiple", "values": [] },
+        {
+          "name": "label",
+          "description": "Rótulo que indica o tipo de informação que deve ser selecionada.",
+          "values": []
+        },
+        {
+          "name": "placeholder",
+          "description": "Texto auxiliar exibido antes de uma seleção.",
+          "values": []
+        },
+        {
+          "name": "is-multiple",
+          "description": "Habilita o modo múltiplo para selecionar várias opções.",
+          "values": []
+        },
         {
           "name": "options",
+          "description": "Define as opções disponíveis no componente de seleção.\nSe 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.\nExemplo de uso:\n```typescript\noptions='[{\"label\": \"Sim\", \"value\": \"1\"}, {\"label\": \"Não\", \"value\": \"0\"}]'\n// ou\noptions=[{ label: \"Sim\", value: \"1\" }, { label: \"Não\", value: \"0\" }]\n```",
           "values": [
             { "name": "" },
             {
@@ -596,48 +1356,109 @@
             }
           ]
         },
-        { "name": "select-all-label", "values": [] },
-        { "name": "unselect-all-label", "values": [] },
-        { "name": "show-search-icon", "values": [] },
-        { "name": "is-open", "values": [] },
-        { "name": "is-inline", "values": [] },
-        { "name": "input-width", "values": [] },
-        { "name": "borderless", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "value", "values": [{ "name": "string[]" }] }
+        {
+          "name": "select-all-label",
+          "description": "Rótulo para selecionar todas as opções.",
+          "values": []
+        },
+        {
+          "name": "unselect-all-label",
+          "description": "Rótulo para desmarcar todas as opções.",
+          "values": []
+        },
+        {
+          "name": "show-search-icon",
+          "description": "Exibe o ícone de busca no campo de entrada.",
+          "values": []
+        },
+        {
+          "name": "is-open",
+          "description": "Indica se a listagem de itens do select está expandida",
+          "values": []
+        },
+        {
+          "name": "is-inline",
+          "description": "Exibe o rótulo e o controle em linha (ao lado), ao invés de empilhados.\nÚtil para casos contextuais como paginação.",
+          "values": []
+        },
+        {
+          "name": "input-width",
+          "description": "Largura do campo de entrada interno (por exemplo, '88px').\nQuando definido, sobrescreve a largura padrão de 100% do input.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Desabilita a interação com o componente `br-select`.\nQuando `true`, o input e as opções ficam desabilitados e não respondem a cliques ou teclas.",
+          "values": []
+        },
+        {
+          "name": "borderless",
+          "description": "Propaga para o input interno a remoção da borda quando desfocado.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "value",
+          "description": "Valor selecionado (string para single, string[] para multiple)",
+          "values": [{ "name": "string[]" }]
+        }
       ],
       "references": []
     },
     {
       "name": "br-sign-in",
-      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/sign-in?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para o texto do sign-in.\n- **icon** - Slot para ícone personalizado, com padrão fa6-solid:user para shape=\"circle\".\n- **image** - Slot para imagem ou ícone ao lado do texto.",
+      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/sign-in?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para o texto do sign-in.\n- **icon** - Slot para ícone personalizado, com padrão fa6-solid:user para shape=\"circle\".\n- **image** - Slot para imagem ou ícone ao lado do texto.\n\n### **CSS Parts:**\n - **content** - Parte para a área de conteúdo/texto do sign-in, usada para estilização via ::part().\n- **image** - Parte para a área da imagem/ícone, usada para controle de tamanho via CSS e ::part().",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "color-mode", "values": [{ "name": "dark" }] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "color-mode",
+          "description": "Define se o sign-in usará um esquema de cores escuro.",
+          "values": [{ "name": "dark" }]
+        },
         {
           "name": "density",
+          "description": "Ajusta a densidade, alterando o espaçamento interno para um visual mais compacto ou mais expandido.",
           "values": [
             { "name": "large" },
             { "name": "medium" },
             { "name": "small" }
           ]
         },
-        { "name": "disabled", "values": [] },
+        {
+          "name": "disabled",
+          "description": "Desativa o sign-in, tornando-o não interativo.",
+          "values": []
+        },
         {
           "name": "emphasis",
+          "description": "Define a ênfase do sign-in, alterando sua aparência para criar hierarquia visual.",
           "values": [{ "name": "primary" }, { "name": "secondary" }]
         },
         {
           "name": "shape",
+          "description": "Define o formato do sign-in.",
           "values": [
             { "name": "block" },
             { "name": "circle" },
             { "name": "pill" }
           ]
         },
-        { "name": "href", "values": [] },
+        {
+          "name": "href",
+          "description": "URL para onde o usuário será redirecionado ao clicar. Use para login com provedores externos ou em sites tradicionais.",
+          "values": []
+        },
         {
           "name": "target",
+          "description": "Define onde abrir o link quando href é fornecido.",
           "values": [
             { "name": "_self" },
             { "name": "_blank" },
@@ -645,43 +1466,67 @@
             { "name": "_top" }
           ]
         },
-        { "name": "aria-label", "values": [] }
+        {
+          "name": "aria-label",
+          "description": "Define o rótulo acessível do sign-in, especialmente importante para formatos circulares.",
+          "values": []
+        }
       ],
       "references": []
     },
     {
       "name": "br-skip-link",
-      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/skip-link?tab=designer).\n---\n\n\n### **Events:**\n - **brSkiplinkNavigation** - Evento emitido quando um item do skiplink é ativado.\nO evento contém informações sobre o item acionado e o elemento target.\n- **brDidShow** - Evento emitido quando o skiplink se torna visível.\n- **brDidHide** - Evento emitido quando o skiplink se torna oculto.\n\n### **Methods:**\n - **watchModeChanges()** - Observa mudanças nos estados que afetam o modo efetivo (simple/compound)\ne atualiza as contagens dos itens quando necessário.\n- **handleItemNavigation(event: _CustomEvent<{ itemId: string; target: string }>_)** - Listener para eventos de navegação dos itens filhos.\n- **handleFocusIn()** - Listener para evento de foco no componente.\n- **handleFocusOut(event: _FocusEvent_)** - Listener para evento de perda de foco no componente.\n- **handleKeyDown(event: _KeyboardEvent_)** - Listener para a tecla Escape.\n- **hide(): _Promise<void>_** - Oculta o componente programaticamente.\n- **show(): _Promise<void>_** - Exibe o componente programaticamente.\n\n### **Slots:**\n - **default** - Slot para inserir os itens de navegação rápida (br-skiplink-item).",
+      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/skip-link?tab=designer).\n---\n\n\n### **Events:**\n - **brSkiplinkNavigation** - Evento emitido quando um item do skiplink é ativado.\nO evento contém informações sobre o item acionado e o elemento target.\n- **brDidShow** - Evento emitido quando o skiplink se torna visível.\n- **brDidHide** - Evento emitido quando o skiplink se torna oculto.\n\n### **Methods:**\n - **watchModeChanges()** - Observa mudanças nos estados que afetam o modo efetivo (simple/compound)\ne atualiza as contagens dos itens quando necessário.\n- **handleItemNavigation(event: _CustomEvent<{ itemId: string; target: string }>_)** - Listener para eventos de navegação dos itens filhos.\n- **handleFocusIn()** - Listener para evento de foco no componente.\n- **handleFocusOut(event: _FocusEvent_)** - Listener para evento de perda de foco no componente.\n- **handleKeyDown(event: _KeyboardEvent_)** - Listener para a tecla Escape.\n- **hide(): _Promise<void>_** - Oculta o componente programaticamente.\n- **show(): _Promise<void>_** - Exibe o componente programaticamente.\n\n### **Slots:**\n - **default** - Slot para inserir os itens de navegação rápida (br-skiplink-item).\n\n### **CSS Parts:**\n - **container** - Parte para o contêiner principal do componente skip-link, usada para estilização via ::part().",
       "attributes": [
-        { "name": "custom-id", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
         {
           "name": "variant",
+          "description": "Define se o skip link apresenta um ou múltiplos itens visíveis.\n- 'simple': Exibe apenas um item por vez.\n- 'compound': Exibe uma lista com múltiplos itens.",
           "values": [{ "name": "simple" }, { "name": "compound" }]
         },
         {
           "name": "position",
+          "description": "Define a posição do skip link na tela.\n- 'top-left': Posicionado no canto superior esquerdo.\n- 'top-center': Posicionado no centro superior.\n- 'top-right': Posicionado no canto superior direito.",
           "values": [
             { "name": "top-left" },
             { "name": "top-center" },
             { "name": "top-right" }
           ]
         },
-        { "name": "z-index", "values": [] },
-        { "name": "show-item-count", "values": [] }
+        {
+          "name": "z-index",
+          "description": "Define o z-index do componente.\nControla a ordem de empilhamento do componente na página.",
+          "values": []
+        },
+        {
+          "name": "show-item-count",
+          "description": "Exibe a contagem de itens no formato (1/4), (2/4), etc.\nQuando `true`, cada item mostrará sua posição relativa ao total de itens.\nPor padrão, é `true` para o modo simple e `false` para o modo compound.",
+          "values": []
+        }
       ],
       "references": []
     },
     {
       "name": "br-step",
-      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/step?tab=designer).\n---\n\n\n### **Events:**\n - **brDidLoad** - Emite um evento após o componente ter sido carregado pela primeira vez.\nUtilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.\nConsulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n- **brWillLoad** - Emite um evento antes do componente ser renderizado pela primeira vez, permitindo a preparação de dados ou inicializações necessárias.\nUtilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.\nConsulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdwillLoad) para mais detalhes.\n- **brShouldUpdate** - Emite um evento para indicar se o componente deve ser atualizado ou não.\nEste evento é chamado antes de qualquer atualização do componente para decidir se a atualização deve prosseguir.\nConsulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes.\n- **brStepChange** - Emite um evento quando o step ativo muda.\nO evento carrega o índice do novo step ativo (0-based).\n\n### **Methods:**\n - **handleClick(event)** - listener para ouvir o evento de click no componente step\nAtravés desse listener o componente define qual será o proximo passo do step que terá o estado ativo\n- **ProceedToNextStep()** - \nMé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\n- **BackToPreviousStep()** - \nMé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\n- **StepValidation(validationStatus: _'success' | 'info' | 'danger' | 'warning'_)** - \nMé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.\n- **GetActiveStep()** - \nMétodo disponibilizado via API do elemento que permite a um componente externo obter a etapa com o estado ativo do componente Step.\n\n### **Slots:**\n - **default** - Slot para os itens do step (br-step-item), aceitando apenas esse componente.",
+      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/step?tab=designer).\n---\n\n\n### **Events:**\n - **brDidLoad** - Emite um evento após o componente ter sido carregado pela primeira vez.\nUtilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.\nConsulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n- **brWillLoad** - Emite um evento antes do componente ser renderizado pela primeira vez, permitindo a preparação de dados ou inicializações necessárias.\nUtilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.\nConsulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdwillLoad) para mais detalhes.\n- **brShouldUpdate** - Emite um evento para indicar se o componente deve ser atualizado ou não.\nEste evento é chamado antes de qualquer atualização do componente para decidir se a atualização deve prosseguir.\nConsulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes.\n- **brStepChange** - Emite um evento quando o step ativo muda.\nO evento carrega o índice do novo step ativo (0-based).\n\n### **Methods:**\n - **handleClick(event)** - listener para ouvir o evento de click no componente step\nAtravés desse listener o componente define qual será o proximo passo do step que terá o estado ativo\n- **ProceedToNextStep()** - \nMé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\n- **BackToPreviousStep()** - \nMé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\n- **StepValidation(validationStatus: _'success' | 'info' | 'danger' | 'warning'_)** - \nMé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.\n- **GetActiveStep()** - \nMétodo disponibilizado via API do elemento que permite a um componente externo obter a etapa com o estado ativo do componente Step.\n\n### **Slots:**\n - **default** - Slot para os itens do step (br-step-item), aceitando apenas esse componente.\n\n### **CSS Parts:**\n - **container** - Parte para o contêiner principal envolvendo todos os step-items, usada para estilizar layout geral via ::part().",
       "attributes": [
         {
           "name": "layout",
+          "description": "propriedade responsável por definir a orientação do componente Step",
           "values": [{ "name": "horizontal" }, { "name": "vertical" }]
         },
-        { "name": "initial-step", "values": [] },
+        {
+          "name": "initial-step",
+          "description": "\ndefine o passo que começará destacado",
+          "values": []
+        },
         {
           "name": "label-position",
+          "description": "\nPropriedade que  define a posição onde o texto de destaque,label, ficará localizado no stepItem",
           "values": [
             { "name": "top" },
             { "name": "right" },
@@ -691,6 +1536,7 @@
         },
         {
           "name": "content-type",
+          "description": "\nPropriedade que define o tipo de conteúdo a ser exibido dentro do componente step  e stepItem",
           "values": [
             { "name": "default" },
             { "name": "br-icon" },
@@ -700,10 +1546,12 @@
         },
         {
           "name": "mode",
+          "description": "\nPropriedade que define o tipo de comportamento que o componente Step deverá seguir",
           "values": [{ "name": "controller" }, { "name": "step" }]
         },
         {
           "name": "progression-type",
+          "description": "\nPropriedade que define o tipo de progressão de etapas que o step vai executar",
           "values": [{ "name": "linear" }, { "name": "nonlinear" }]
         }
       ],
@@ -713,21 +1561,59 @@
       "name": "br-switch",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/switch?tab=designer).\n---\n\n\n### **Events:**\n - **checkedChange** - Disparado depois que o valor do `checked` foi alterado\n\n### **Methods:**\n - **toggleChecked()** - Inverte o valor da prop `checked`\n\n### **Slots:**\n - **default** - Slot para o rótulo do switch, com prioridade sobre a propriedade label.",
       "attributes": [
-        { "name": "disabled", "values": [] },
-        { "name": "checked", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "label", "values": [] },
+        {
+          "name": "disabled",
+          "description": "Desativa o switch, tornando-o não interativo.",
+          "values": []
+        },
+        {
+          "name": "checked",
+          "description": "Define o estado de seleção do checkbox.\nSe definido como verdadeiro, o checkbox estará marcado. Caso contrário, estará desmarcado.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "Texto descritivo.\nCaso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.",
+          "values": []
+        },
         {
           "name": "label-position",
+          "description": "Posição do rótulo em relação ao switch.",
           "values": [{ "name": "right" }, { "name": "left" }, { "name": "top" }]
         },
-        { "name": "label-on", "values": [] },
-        { "name": "label-off", "values": [] },
-        { "name": "has-icon", "values": [] },
-        { "name": "name", "values": [] },
-        { "name": "value", "values": [] },
+        {
+          "name": "label-on",
+          "description": "Texto exibido quando o switch está ativado.",
+          "values": []
+        },
+        {
+          "name": "label-off",
+          "description": "Texto exibido quando o switch está desativado.",
+          "values": []
+        },
+        {
+          "name": "has-icon",
+          "description": "Adiciona um ícone ao switch para indicar a mudança de estado.",
+          "values": []
+        },
+        {
+          "name": "name",
+          "description": "Define o nome do switch, que é utilizado para agrupar switches em formulários e identificar o campo.\nO valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários.",
+          "values": []
+        },
+        {
+          "name": "value",
+          "description": "Define o valor associado ao switch quando ele faz parte de um formulário nativo (`<form>`).\nEsse valor é enviado com o formulário quando o switch está selecionado.\n**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`.",
+          "values": []
+        },
         {
           "name": "density",
+          "description": "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.",
           "values": [
             { "name": "large" },
             { "name": "medium" },
@@ -739,21 +1625,35 @@
     },
     {
       "name": "br-tab",
-      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/tab?tab=designer).\n---\n\n\n### **Events:**\n - **brTabChange** - Evento disparado quando um tab é ativado.\n\n### **Methods:**\n - **activeTabChanged(newId: _string_)** - Observa mudanças no tab ativo para atualizar os estados\n- **colorModeChanged(newValue: _string_)** - Observa mudanças no color mode para propagar aos filhos\n- **handleTabItemPropsChange()** - Escuta evento de mudança de propriedades dos tab-items filhos.\nEste listener garante que o componente pai seja re-renderizado quando\npropriedades como tabItemTitle, icon, counter ou onlyIcon mudam dinamicamente.\n\n### **Slots:**\n - **default** - Slot para inserir os itens das abas (br-tab-item)",
+      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/tab?tab=designer).\n---\n\n\n### **Events:**\n - **brTabChange** - Evento disparado quando um tab é ativado.\n\n### **Methods:**\n - **activeTabChanged(newId: _string_)** - Observa mudanças no tab ativo para atualizar os estados\n- **colorModeChanged(newValue: _string_)** - Observa mudanças no color mode para propagar aos filhos\n- **handleTabItemPropsChange()** - Escuta evento de mudança de propriedades dos tab-items filhos.\nEste listener garante que o componente pai seja re-renderizado quando\npropriedades como tabItemTitle, icon, counter ou onlyIcon mudam dinamicamente.\n\n### **Slots:**\n - **default** - Slot para inserir os itens das abas (br-tab-item)\n\n### **CSS Parts:**\n - **container** - Parte para o contêiner principal das abas\n- **nav** - Parte para a navegação das abas",
       "attributes": [
-        { "name": "custom-id", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
         {
           "name": "density",
+          "description": "A propriedade 'density' define a densidade do componente.",
           "values": [
             { "name": "small" },
             { "name": "medium" },
             { "name": "large" }
           ]
         },
-        { "name": "color-mode", "values": [{ "name": "dark" }] },
-        { "name": "label", "values": [] },
+        {
+          "name": "color-mode",
+          "description": "Define se o Tab usará um esquema de cores escuro.",
+          "values": [{ "name": "dark" }]
+        },
+        {
+          "name": "label",
+          "description": "Label de acessibilidade para a navegação das tabs",
+          "values": []
+        },
         {
           "name": "align-items-tab",
+          "description": "Define o alinhamento horizontal dos itens da tab na barra de navegação.\n- 'start': Alinha à esquerda\n- 'center': Centraliza\n- 'end': Alinha à direita",
           "values": [
             { "name": "start" },
             { "name": "center" },
@@ -766,22 +1666,57 @@
     {
       "name": "br-table",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/table?tab=designer).\n---\n\n\n### **Methods:**\n - **render(): __** - Define o JSX do componente.\n\n### **Slots:**\n - **default** - Slot para as linhas e células da tabela.",
-      "attributes": [{ "name": "custom-id", "values": [] }],
+      "attributes": [
+        {
+          "name": "custom-id",
+          "description": "Identificador único aplicado na tag raiz do shadowRoot.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        }
+      ],
       "references": []
     },
     {
       "name": "br-tag",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/textarea?tag=designer).\n---\n\n\n### **Events:**\n - **radioSelected** - Evento emitido quando a tag é selecionada.\n\n### **Slots:**\n - **default** - Slot para inserir o conteúdo da tag, como rótulo ou ícone",
       "attributes": [
-        { "name": "label", "values": [] },
-        { "name": "icon-name", "values": [] },
-        { "name": "name", "values": [] },
-        { "name": "multiple", "values": [] },
-        { "name": "selected", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "bg-color", "values": [] },
+        {
+          "name": "label",
+          "description": "A propriedade 'label' é uma string que representa o texto a ser exibido no componente.\nEla é refletida no DOM, permitindo que alterações no valor sejam refletidas no elemento HTML correspondente.",
+          "values": []
+        },
+        {
+          "name": "icon-name",
+          "description": "A propriedade 'iconName' define o nome do ícone que será exibido ao lado do texto.\nO valor padrão é 'fa-solid:car', que corresponde a um ícone de carro da biblioteca Font Awesome.",
+          "values": []
+        },
+        {
+          "name": "name",
+          "description": "A propriedade 'name' é uma string que representa o nome do grupo da tag para seleção.\nEla é refletida no DOM, permitindo que alterações no valor sejam refletidas no elemento HTML correspondente.",
+          "values": []
+        },
+        {
+          "name": "multiple",
+          "description": "A tag permite seleção múltipla.",
+          "values": []
+        },
+        {
+          "name": "selected",
+          "description": "A tag está selecionada.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "bg-color",
+          "description": "A propriedade 'color' permite definir a cor do componente.\nAceita valores como 'red', 'blue', entre outros, e é refletida no DOM.",
+          "values": []
+        },
         {
           "name": "density",
+          "description": "A propriedade 'density' permite definir a densidade do componente.",
           "values": [
             { "name": "small" },
             { "name": "medium" },
@@ -790,18 +1725,43 @@
         },
         {
           "name": "shape",
+          "description": "A propriedade 'shape' define o formato do componente.",
           "values": [
             { "name": "circle" },
             { "name": "rounded" },
             { "name": "default" }
           ]
         },
-        { "name": "status", "values": [] },
-        { "name": "interaction", "values": [] },
-        { "name": "interaction-select", "values": [] },
-        { "name": "disabled", "values": [] },
-        { "name": "aria-label", "values": [] },
-        { "name": "aria-describedby", "values": [] }
+        {
+          "name": "status",
+          "description": "Transforma a tag em um indicador de status, com aparência circular.\nÉ flexível podendo ser utilizado com label ou apenas a superfície circular (informação é transmitida por meio de cores).",
+          "values": []
+        },
+        {
+          "name": "interaction",
+          "description": "Interação deve ser habilitada.",
+          "values": []
+        },
+        {
+          "name": "interaction-select",
+          "description": "Interação de seleção deve ser habilitada.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Tag deve estar desabilitado.",
+          "values": []
+        },
+        {
+          "name": "aria-label",
+          "description": "Rótulo personalizado para leitores de tela.\nQuando fornecido, substitui completamente o texto visível para usuários de leitores de tela.\nÚtil quando o texto visível não é suficientemente descritivo (ex: ícones, abreviações).",
+          "values": []
+        },
+        {
+          "name": "aria-describedby",
+          "description": "ID do elemento que fornece descrição adicional da tag.\nReferencia um elemento na página que contém informações complementares sobre a tag.\nA descrição é lida após o conteúdo principal, fornecendo contexto extra aos usuários de leitores de tela.\nExemplo: aria-describedby=\"help-status\" onde existe <div id=\"help-status\">Aguardando aprovação</div>",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -809,16 +1769,49 @@
       "name": "br-textarea",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/textarea?tab=designer).\n---\n\n\n### **Events:**\n - **valueChange** - Valor atualizado do textarea\n\n### **Methods:**\n - **setValue(newValue: _string_)** - Define um novo valor para o textarea.\n\n### **Slots:**\n - **default** - Slot para texto adicional ou instruções a serem exibidos junto ao textarea.",
       "attributes": [
-        { "name": "value", "values": [] },
-        { "name": "label", "values": [] },
-        { "name": "placeholder", "values": [] },
-        { "name": "aria-label", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "disabled", "values": [] },
-        { "name": "maxlength", "values": [] },
-        { "name": "show-counter", "values": [] },
+        {
+          "name": "value",
+          "description": "Valor exibido no textarea.\nPode ser alterado pelo usuário se a propriedade `readonly` não estiver ativa.",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "Texto exibido como rótulo do input.",
+          "values": []
+        },
+        {
+          "name": "placeholder",
+          "description": "Texto exibido dentro do input quando está vazio, fornecendo uma dica ou sugestão ao usuário.",
+          "values": []
+        },
+        {
+          "name": "aria-label",
+          "description": "Texto alternativo para acessibilidade quando não há label visível.\nFornece um rótulo para tecnologias assistivas sem exibir visualmente.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Indica se o textarea está desabilitado. Quando verdadeiro, o usuário não pode interagir com o campo.",
+          "values": []
+        },
+        {
+          "name": "maxlength",
+          "description": "Número máximo de caracteres permitidos no textarea. Se definido como 0, não há limite.",
+          "values": []
+        },
+        {
+          "name": "show-counter",
+          "description": "Mostra o contador com a quantidade máxima de caracteres.",
+          "values": []
+        },
         {
           "name": "state",
+          "description": "Define o estado visual do componente, podendo ser 'danger', 'success' ou 'warning'.",
           "values": [
             { "name": "danger" },
             { "name": "success" },
@@ -827,15 +1820,28 @@
         },
         {
           "name": "density",
+          "description": "Ajusta a densidade do componente, podendo ser 'small', 'medium' ou 'large'.",
           "values": [
             { "name": "small" },
             { "name": "medium" },
             { "name": "large" }
           ]
         },
-        { "name": "is-inline", "values": [] },
-        { "name": "rows", "values": [] },
-        { "name": "cols", "values": [] }
+        {
+          "name": "is-inline",
+          "description": "Se verdadeiro, o rótulo e o input estarão na mesma linha (layout inline).",
+          "values": []
+        },
+        {
+          "name": "rows",
+          "description": "Número de linhas visíveis no textarea.\nDefine a altura do componente em relação ao número de linhas de texto exibidas.",
+          "values": []
+        },
+        {
+          "name": "cols",
+          "description": "Número de colunas (caracteres) visíveis no textarea.\nDefine a largura do componente em relação ao número de caracteres por linha.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -843,14 +1849,46 @@
       "name": "br-tooltip",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/tooltip?tab=designer).\n---\n\n\n### **Events:**\n - **brDidOpen** - Emitido quando o tooltip abre.\n- **brDidClose** - Emitido quando o tooltip fecha.\n\n### **Methods:**\n - **handleVisibilityChange(visible: _boolean_): __** - Watcher para monitorar alterações na propriedade `isVisible`.\n- **handleFocusIn()** - Exibe o tooltip quando o acionador recebe foco.\n- **handleFocusOut()** - Oculta o tooltip quando o acionador perde foco.\n- **handleKeyDown(event: _KeyboardEvent_)** - Fecha com Escape quando o documento recebe a tecla.\n- **render(): __** - Renderiza o componente.\nEste método é responsável por gerar o conteúdo HTML do componente.\nEle utiliza a função `h` do Stencil para criar elementos JSX.\n\n### **Slots:**\n - **trigger** - Slot para o elemento que aciona a exibição do tooltip.\n- **content** - Slot para o conteúdo exibido no tooltip.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "position", "values": [{ "name": "TooltipPosition" }] },
-        { "name": "type", "values": [{ "name": "TooltipType" }] },
-        { "name": "density", "values": [{ "name": "TooltipDensity" }] },
-        { "name": "state", "values": [{ "name": "TooltipState" }] },
-        { "name": "is-auto-visible", "values": [] },
-        { "name": "show-delay", "values": [] },
-        { "name": "hide-delay", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único do tooltip; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "position",
+          "description": "Posição do tooltip em relação ao acionador.",
+          "values": [{ "name": "TooltipPosition" }]
+        },
+        {
+          "name": "type",
+          "description": "Tipo do tooltip: 'standard' (simples) ou 'popover' (mais rico, com fechamento por interação).",
+          "values": [{ "name": "TooltipType" }]
+        },
+        {
+          "name": "density",
+          "description": "Densidade do tooltip: controla compacidade do conteúdo.",
+          "values": [{ "name": "TooltipDensity" }]
+        },
+        {
+          "name": "state",
+          "description": "Estado visual do tooltip: 'info', 'warning', 'error' ou 'success'.",
+          "values": [{ "name": "TooltipState" }]
+        },
+        {
+          "name": "is-auto-visible",
+          "description": "Exibe automaticamente sem interação quando true; caso contrário, depende do acionador.",
+          "values": []
+        },
+        {
+          "name": "show-delay",
+          "description": "Atraso em milissegundos antes de exibir.",
+          "values": []
+        },
+        {
+          "name": "hide-delay",
+          "description": "Atraso em milissegundos antes de ocultar.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -858,13 +1896,34 @@
       "name": "br-upload",
       "description": "## Design System\n---\n\n\n### **Events:**\n - **selectedFilesChange** - Emitido quando a lista de arquivos selecionados muda.\n- **brRemove** - Evento emitido quando um arquivo da lista `uploadFiles` (externos) é removido pelo usuário.\nO objeto emitido contém os dados do arquivo removido.\n\n### **Slots:**\n - **default** - Texto personalizado para o botão de upload. Se não fornecido, será exibido \"Selecione o arquivo\" como texto padrão. Use este slot para personalizar o texto do botão de acordo com o contexto do upload, por exemplo: \"Anexar documentos\", \"Enviar imagens\", etc.\n- **upload-list** - Permite customizar a área de listagem de arquivos. Se utilizado, substitui a lista padrão gerada pelo componente.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "accept", "values": [] },
-        { "name": "label", "values": [] },
-        { "name": "upload-files", "values": [{ "name": "IUploadFile[]" }] },
-        { "name": "disabled", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único do componente; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "accept",
+          "description": "Tipos de arquivo permitidos (ex.: 'image/*').",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "Rótulo exibido acima do botão de upload.",
+          "values": []
+        },
+        {
+          "name": "upload-files",
+          "description": "Lista de arquivos já enviados (para edição ou pré-visualização).\nPode ser uma string JSON ou um array de objetos IUploadFile.",
+          "values": [{ "name": "IUploadFile[]" }]
+        },
+        {
+          "name": "disabled",
+          "description": "Desativa interação e seleção de arquivos quando true.",
+          "values": []
+        },
         {
           "name": "state",
+          "description": "Estado visual: 'info', 'warning', 'danger' ou 'success'.",
           "values": [
             { "name": "info" },
             { "name": "warning" },
@@ -872,7 +1931,11 @@
             { "name": "success" }
           ]
         },
-        { "name": "multiple", "values": [] }
+        {
+          "name": "multiple",
+          "description": "Indica se o componente permite a seleção de múltiplos arquivos.\nQuando definido como `true`, o usuário pode selecionar mais de um arquivo para upload.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -880,16 +1943,26 @@
       "name": "br-wizard",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/wizard?tab=designer).\n---\n\n\n### **Events:**\n - **brWizardStepChange** - Evento emitido APÓS mudar de etapa com sucesso.\n\nEste evento é disparado independente da origem da navegação:\n- Botões \"Avançar\" ou \"Voltar\"\n- Click direto em um step do indicador de progresso\n- Chamadas programáticas via métodos públicos (goToStep, nextStep, etc)\n- **brWizardBeforeStepChange** - Evento emitido ANTES de mudar de etapa (permite validação e cancelamento).\n\nComportamento:\n- Disparado apenas ao AVANÇAR (targetStep > currentStep)\n- Não é disparado ao VOLTAR (targetStep < currentStep)\n- Funciona tanto para cliques nos botões quanto para cliques diretos nos steps\n- Pode ser cancelado com `event.preventDefault()` para bloquear a navegação\n- **brWizardComplete** - Evento emitido ao concluir o wizard (última etapa).\n- **brWizardCancel** - Evento emitido ao cancelar o wizard.\n- **brWizardNavigationBlocked** - Evento emitido quando uma ação é bloqueada (validação falha, progressão linear impedida).\nEmite uma string indicando o motivo: 'linear-progression' ou 'validation-failed'.\nUse getCurrentStepIndex() para obter o contexto da etapa atual.\n\n### **Methods:**\n - **handleProgressionTypeChange()** - Observa mudanças no tipo de progressão.\nAtualiza a navegação dos painéis quando muda entre linear/nonlinear.\n- **handleInitialStepChange()** - Observa mudanças na etapa inicial.\nReinicializa o wizard quando a prop initialStep é alterada externamente.\n- **handleCurrentStepChange(newStep: _number_, oldStep: _number_)** - Observa mudanças na etapa atual (fonte única de verdade).\nSincroniza com br-step, atualiza painéis, anuncia mudança e move foco.\n- **handleSlotChange(event: _Event_)** - Detecta quando o slot muda (painéis adicionados/removidos dinamicamente).\nRedescobre os painéis e ressincroniza o estado.\n- **handleStepChange(event: _CustomEvent<{ activeStep: number }>_)** - Detecta quando o br-step muda de etapa ativa.\nValida e sincroniza a navegação com o componente interno br-step.\n- **nextStep(): __** - Avança para a próxima etapa.\nExecuta validação via evento `brWizardBeforeStepChange` antes de navegar.\n- **previousStep(): __** - Volta para a etapa anterior.\nNão executa validação ao retornar.\n- **goToStep(stepNumber: _number_): __** - Navega para uma etapa específica.\nExecuta validação se estiver avançando (etapa alvo > etapa atual).\n- **reset(): __** - Retorna à primeira etapa do wizard.\nNão executa validação (útil para reiniciar o fluxo).\n- **getCurrentStep(): __** - Retorna o elemento HTML do painel ativo no momento.\n- **getAllSteps(): __** - Retorna todos os painéis do wizard.\n- **getStepByIndex(stepNumber: _number_): __** - Retorna um painel específico pelo índice.\n- **getCurrentStepIndex(): __** - Retorna o índice (número) da etapa atual.\nA numeração começa em 1 (primeira etapa = 1, segunda = 2, etc).\n- **getTotalSteps(): __** - Retorna o número total de etapas do wizard.\n- **render(): __** - Método de renderização principal do componente.\nMonta a estrutura completa do wizard com acessibilidade integrada.\n\n### **Slots:**\n - **default** - Slot para os painéis de etapa (br-wizard-panel) do wizard.",
       "attributes": [
-        { "name": "initial-step", "values": [] },
+        {
+          "name": "initial-step",
+          "description": "Índice da etapa inicial do wizard.\nDefine qual etapa será exibida ao carregar o componente.\nA numeração começa em 1 (primeira etapa = 1, segunda = 2, etc).",
+          "values": []
+        },
         {
           "name": "orientation",
+          "description": "Orientação visual do wizard.\nDefine se os indicadores de progresso serão exibidos horizontalmente ou verticalmente.",
           "values": [{ "name": "horizontal" }, { "name": "vertical" }]
         },
         {
           "name": "progression-type",
+          "description": "Tipo de progressão entre etapas.\n- `linear`: O usuário deve completar cada etapa sequencialmente. Não é possível pular etapas futuras.\n- `nonlinear`: O usuário pode navegar livremente entre qualquer etapa.",
           "values": [{ "name": "linear" }, { "name": "nonlinear" }]
         },
-        { "name": "custom-id", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "ID customizado para o componente.\nSe não fornecido, um ID único será gerado automaticamente.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -897,8 +1970,16 @@
       "name": "br-footer-category",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/footer?tab=designer).\n---\n\n\n### **Methods:**\n - **render(): __** - Renderiza o componente.\n\n### **Slots:**\n - **default** - Slot para os itens da categoria no rodapé, utilizando br-footer-item.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "label", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único do componente; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "Título da categoria exibido no cabeçalho da lista.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -906,36 +1987,68 @@
       "name": "br-footer-item",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/footer?tab=designer).\n---\n\n\n### **Methods:**\n - **render(): __** - Renderiza o componente\n\n### **Slots:**\n - **default** - Slot para o conteúdo do item no rodapé, incluindo texto ou componentes de roteamento para SPAs.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "href", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "href",
+          "description": "URL ou caminho para o qual o usuário será direcionado ao clicar no item.\nQuando definido, o item será renderizado como um link.",
+          "values": []
+        }
       ],
       "references": []
     },
     {
       "name": "br-footer-legal",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/footer?tab=designer).\n---\n\n\n### **Methods:**\n - **render(): __** - Renderiza o componente.\n\n### **Slots:**\n - **default** - Slot para informações legais no rodapé, como direitos autorais ou termos de uso.",
-      "attributes": [{ "name": "custom-id", "values": [] }],
+      "attributes": [
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        }
+      ],
       "references": []
     },
     {
       "name": "br-footer-logo",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/footer?tab=designer).\n---\n\n\n### **Methods:**\n - **render(): __** - Monta o JSX que representa o componente.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "src", "values": [] },
-        { "name": "description", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        { "name": "src", "description": "Url da logo padrão.", "values": [] },
+        {
+          "name": "description",
+          "description": "Descrição da logo.",
+          "values": []
+        },
         {
           "name": "position",
+          "description": "Posição da logo.",
           "values": [
             { "name": "left" },
             { "name": "center" },
             { "name": "right" }
           ]
         },
-        { "name": "is-partner", "values": [] },
-        { "name": "href", "values": [] },
+        {
+          "name": "is-partner",
+          "description": "Define se a logo é de um parceiro.",
+          "values": []
+        },
+        {
+          "name": "href",
+          "description": "URL de destino quando a logo for clicada.\nSe fornecido, a logo será envolvida em um link.",
+          "values": []
+        },
         {
           "name": "target",
+          "description": "Target do link quando href é fornecido.",
           "values": [
             { "name": "_blank" },
             { "name": "_self" },
@@ -950,10 +2063,18 @@
       "name": "br-footer-social",
       "description": "O subcomponente `br-footer-social` representa os ícones de redes sociais no rodapé do site, de acordo com a documentação de design do GovBR.\nEle deve ser utilizado como filho direto do componente [`br-footer`](/docs/components/footer).\n---\n\n\n### **Methods:**\n - **render(): __** - Renderiza o componente.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "icon", "values": [] },
-        { "name": "description", "values": [] },
-        { "name": "href", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        { "name": "icon", "description": "Ícone da rede social", "values": [] },
+        {
+          "name": "description",
+          "description": "Descrição do ícone da rede social",
+          "values": []
+        },
+        { "name": "href", "description": "URL da rede social", "values": [] }
       ],
       "references": []
     },
@@ -961,11 +2082,24 @@
       "name": "br-header-function",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/header?tab=designer).\n---\n\n\n### **Methods:**\n - **handleHeaderWidthChange(event: _CustomEvent<{ id: string; listNames: string[]; shrink: boolean }>_)** - Listener para o evento 'headerWidthChange', disparado pelo componente pai 'br-header'.\nO evento contém o ID do pai e o nome da lista.\nSe o ID do pai corresponder ao ID do cabeçalho atual, o evento será tratado.\n- **render(): __** - Renderiza o componente.\n\n### **Slots:**\n - **default** - Slot para o nome ou rótulo da funcionalidade.\n- **icon** - Slot para ícone que representa a funcionalidade.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "href", "values": [] },
-        { "name": "icon-name", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "href",
+          "description": "URL de destino da funcionalidade.",
+          "values": []
+        },
+        {
+          "name": "icon-name",
+          "description": "Nome do ícone exibido.",
+          "values": []
+        },
         {
           "name": "target",
+          "description": "Define o alvo do link quando `href` está presente. Pode ser:\n- `_blank` para abrir em uma nova aba,\n- `_self` para abrir na mesma aba,\n- `_parent` para abrir na aba pai,\n- `_top` para abrir na aba superior.",
           "values": [
             { "name": "_blank" },
             { "name": "_self" },
@@ -980,10 +2114,15 @@
       "name": "br-header-link",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/header?tab=designer).\n---\n\n\n### **Methods:**\n - **render(): __** - Renderiza o componente.\n\n### **Slots:**\n - **default** - Slot para o conteúdo do link exibido no cabeçalho.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "href", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        { "name": "href", "description": "URL do link.", "values": [] },
         {
           "name": "target",
+          "description": "Define o alvo do link quando `href` está presente. Pode ser:\n- `_blank` para abrir em uma nova aba,\n- `_self` para abrir na mesma aba,\n- `_parent` para abrir na aba pai,\n- `_top` para abrir na aba superior.",
           "values": [
             { "name": "_blank" },
             { "name": "_self" },
@@ -998,8 +2137,16 @@
       "name": "br-header-list",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/header?tab=designer).\n---\n\n\n### **Events:**\n - **headerListUpdate** - Evento disparado para indicar qual lista deve encolher primeiro.\nO evento envia o ID do componente pai e o nome da lista.\n- **headerListFocused** - Evento disparado quando a lista recebe foco.\nO evento envia o ID do componente.\n\n### **Methods:**\n - **closeList()** - Fecha a lista.\n- **isListOpen(): __** - Verifica se a lista está aberta.\n- **openList(): _Promise<void>_** - Abre a lista.\n- **render(): __** - Renderiza o componente.\n\n### **Slots:**\n - **default** - Slot para o conteúdo da lista de navegação no cabeçalho.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "list-title", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "list-title",
+          "description": "Título da lista.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -1007,12 +2154,29 @@
       "name": "br-header-logo",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/header?tab=designer).\n---\n\n\n### **Methods:**\n - **handleIsCompactChange()** - Observa mudanças na propriedade `isCompact` e ajusta a altura da logo se `hasDefaultHeight` for verdadeiro.\n- **render(): __** - Renderiza o componente.\n\n### **Slots:**\n - **default** - Slot para a logo personalizada exibida no cabeçalho.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "description", "values": [] },
-        { "name": "href", "values": [] },
-        { "name": "is-compact", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único; gerado automaticamente quando omitido.",
+          "values": []
+        },
+        {
+          "name": "description",
+          "description": "Texto alternativo/descritivo da logo.",
+          "values": []
+        },
+        {
+          "name": "href",
+          "description": "URL de destino quando a logo for clicada.\nSe fornecido, a logo será envolvida em um link.",
+          "values": []
+        },
+        {
+          "name": "is-compact",
+          "description": "Alterna para versão compacta quando true.",
+          "values": []
+        },
         {
           "name": "target",
+          "description": "Target do link quando href é fornecido.",
           "values": [
             { "name": "_blank" },
             { "name": "_self" },
@@ -1020,9 +2184,9 @@
             { "name": "_top" }
           ]
         },
-        { "name": "src", "values": [] },
-        { "name": "width", "values": [] },
-        { "name": "height", "values": [] }
+        { "name": "src", "description": "Url da logo padrão.", "values": [] },
+        { "name": "width", "description": "Largura da imagem.", "values": [] },
+        { "name": "height", "description": "Altura da imagem.", "values": [] }
       ],
       "references": []
     },
@@ -1030,10 +2194,26 @@
       "name": "br-menu-header",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/menu-header?tab=designer).\n---\n\n\n### **Events:**\n - **brMenuHeaderClose** - Evento emitido quando o botão de fechar é clicado\n\n### **Slots:**\n - **logo** - Slot para logo personalizado no cabeçalho.\n- **signature** - Slot para a assinatura personalizada do sistema.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "logo-src", "values": [] },
-        { "name": "logo-alt", "values": [] },
-        { "name": "signature", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "logo-src",
+          "description": "URL da imagem do logo no cabeçalho do menu",
+          "values": []
+        },
+        {
+          "name": "logo-alt",
+          "description": "Texto alternativo para a imagem do logo",
+          "values": []
+        },
+        {
+          "name": "signature",
+          "description": "Texto de identificação do site ou sistema",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -1041,8 +2221,16 @@
       "name": "br-menu-info",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/menu-info?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para conteúdo personalizado no lugar do texto padrão de informações.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "info", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "info",
+          "description": "Informações adicionais em formato de texto",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -1050,10 +2238,19 @@
       "name": "br-menu-item",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/menu?tab=designer).\n---\n",
       "attributes": [
-        { "name": "icon", "values": [] },
-        { "name": "href", "values": [] },
+        {
+          "name": "icon",
+          "description": "Ícone exibido no item do menu.\nUtilize esta propriedade para definir o ícone que será mostrado ao lado do conteúdo do item.",
+          "values": []
+        },
+        {
+          "name": "href",
+          "description": "URL de destino do link do item do menu.\nUtilize esta propriedade para definir o endereço para onde o usuário será direcionado ao clicar no item.",
+          "values": []
+        },
         {
           "name": "target",
+          "description": "Define como o link será aberto.\n- `_self`: abre no mesmo contexto de navegação (padrão)\n- `_blank`: abre em nova aba ou janela\n- `_parent`: abre no contexto pai\n- `_top`: abre no contexto de nível superior",
           "values": [
             { "name": "_self" },
             { "name": "_blank" },
@@ -1061,17 +2258,30 @@
             { "name": "_top" }
           ]
         },
-        { "name": "divider", "values": [] },
-        { "name": "active", "values": [] },
+        {
+          "name": "divider",
+          "description": "Define se o item deve exibir um divisor visual.\nQuando ativado, adiciona uma linha separadora para organizar visualmente os itens do menu.",
+          "values": []
+        },
+        {
+          "name": "active",
+          "description": "Define se o item do menu está ativo/selecionado.\nQuando ativado, aplica estilos visuais para destacar o item como atual ou selecionado.",
+          "values": []
+        },
         {
           "name": "display-mode",
+          "description": "Define o modo de exibição do item, controlando os ícones de expansão.\n- `accordion`: exibe setas para cima/baixo (usado em menus de nível 0).\n- `drill-down`: exibe seta para a direita (usado em menus de níveis 1+).\n- `none`: não exibe ícones de expansão.",
           "values": [
             { "name": "accordion" },
             { "name": "drill-down" },
             { "name": "none" }
           ]
         },
-        { "name": "expanded", "values": [] }
+        {
+          "name": "expanded",
+          "description": "Indica se o item está expandido para fins de acessibilidade (ARIA).\nEste estado é controlado externamente (por exemplo, por br-menu-list).\nNão altera o estado visual de \"active\".",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -1079,9 +2289,13 @@
       "name": "br-menu-link",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/menu?tab=designer).\n---\n\n\n### **Events:**\n - **brLinkClick** - Evento emitido quando o link externo é clicado\n\n### **Slots:**\n - **icon** - Slot para ícone personalizado do link.\n- **url** - Slot para o texto ou URL exibido no link.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "url", "values": [] },
-        { "name": "titulo", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        { "name": "url", "description": "URL do link", "values": [] },
+        { "name": "titulo", "description": "Título do link", "values": [] }
       ],
       "references": []
     },
@@ -1089,11 +2303,31 @@
       "name": "br-menu-list",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/menu?tab=designer).\n---\n\n\n### **Events:**\n - **folderToggled** - Emitido quando um folder é expandido ou recolhido no nível 0 (comportamento acordeão).\n- **navigateToSubmenu** - Emitido quando navegando para um submenu nos níveis 1+ (comportamento drill-down).",
       "attributes": [
-        { "name": "icon", "values": [] },
-        { "name": "label", "values": [] },
-        { "name": "menu-level", "values": [] },
-        { "name": "divider", "values": [] },
-        { "name": "expanded", "values": [] }
+        {
+          "name": "icon",
+          "description": "Ícone exibido no item do menu.\nUtilize esta propriedade para definir o ícone que será mostrado ao lado do label.",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "Texto do label do item do menu.\nUtilize esta propriedade para definir o texto que será exibido no item do menu.",
+          "values": []
+        },
+        {
+          "name": "menu-level",
+          "description": "Nível do menu na hierarquia de navegação.\nUtilizado para determinar o comportamento do menu (acordeão para nível 0, drill-down para níveis superiores).",
+          "values": []
+        },
+        {
+          "name": "divider",
+          "description": "Define se o item deve exibir um divisor visual.\nQuando ativado, adiciona uma linha separadora para organizar visualmente os itens do menu.",
+          "values": []
+        },
+        {
+          "name": "expanded",
+          "description": "Define se o menu-list inicia expandido.\nÚtil para manter agrupamentos abertos por padrão no menu contextual.",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -1101,11 +2335,27 @@
       "name": "br-menu-logo",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/menu?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para logo ou conteúdo que substitui a imagem padrão.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "src", "values": [] },
-        { "name": "alt", "values": [] },
-        { "name": "width", "values": [] },
-        { "name": "height", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "ID personalizado para o elemento, útil para acessibilidade e identificação única.\nSe não for fornecido, um ID único será gerado automaticamente.",
+          "values": []
+        },
+        { "name": "src", "description": "URL da imagem", "values": [] },
+        {
+          "name": "alt",
+          "description": "Texto alternativo da imagem",
+          "values": []
+        },
+        {
+          "name": "width",
+          "description": "Largura da imagem (com unidade, ex: '100px', '50%')",
+          "values": []
+        },
+        {
+          "name": "height",
+          "description": "Altura da imagem (com unidade, ex: '80px', 'auto')",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -1113,10 +2363,18 @@
       "name": "br-menu-social",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/menu?tab=designer).\n---\n\n\n### **Events:**\n - **brSocialClick** - Evento emitido quando o link de rede social é clicado\n\n### **Slots:**\n - **icon** - Slot para ícone personalizado da rede social.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "url", "values": [] },
-        { "name": "aria-label", "values": [] },
-        { "name": "icon", "values": [] }
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        { "name": "url", "description": "URL do link", "values": [] },
+        {
+          "name": "aria-label",
+          "description": "Rótulo para acessibilidade",
+          "values": []
+        },
+        { "name": "icon", "description": "Ícone da rede social", "values": [] }
       ],
       "references": []
     },
@@ -1124,20 +2382,41 @@
       "name": "br-skiplink-item",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/skip-link?tab=designer).\n---\n\n\n### **Events:**\n - **brSkiplinkItemClick** - Evento emitido quando o item é clicado/ativado.\nO evento contém informações sobre o item e o target.\n- **brSkiplinkItemFocus** - Evento emitido quando o item recebe foco.\n\n### **Methods:**\n - **itemFocus(): _Promise<void>_** - Move o foco para este item.\n- **navigateToTarget(): _Promise<void>_** - Navega para o target definido.\nMove o foco para o elemento alvo e ajusta a rolagem da página se necessário.\n- **handleClick(_event: _MouseEvent_)** - Listener para cliques no item.\n- **handleKeyDown(event: _KeyboardEvent_)** - Listener para teclas Enter, Space e atalho Alt+[keyNumber].\n- **handleFocus()** - Listener para foco no item.\n\n### **Slots:**\n - **default** - Slot para o texto do link de navegação rápida.\n- **tag** - Slot para personalizar a tag numérica do atalho de teclado, exibindo o valor de key-number por padrão.",
       "attributes": [
-        { "name": "target", "values": [] },
-        { "name": "key-number", "values": [] },
-        { "name": "custom-id", "values": [] },
-        { "name": "hide-tag", "values": [] }
+        {
+          "name": "target",
+          "description": "ID do elemento de destino ou seletor CSS.\nEste é o elemento para o qual o usuário será levado ao ativar este item.",
+          "values": []
+        },
+        {
+          "name": "key-number",
+          "description": "Número da tecla para acesso rápido.\nPermite que o usuário ative este item pressionando Alt+[keyNumber].\nAceita valores de 1 a 9.\nEsta propriedade implementa uma alternativa ao accessKey nativa,\nfornecendo um atalho de teclado consistente e acessível.",
+          "values": []
+        },
+        {
+          "name": "custom-id",
+          "description": "ID personalizado.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "hide-tag",
+          "description": "Controla a visibilidade da tag numérica.\nQuando `true`, a tag numérica não será exibida, mesmo que `keyNumber` esteja definido.\nO atalho de teclado continua funcionando, apenas a indicação visual é ocultada.",
+          "values": []
+        }
       ],
       "references": []
     },
     {
       "name": "br-step-item",
-      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/step?tab=designer).\n---\n\n\n### **Events:**\n - **brWillRender** - Emite um evento após o componente ter sido carregado pela primeira vez.\nUtilize este evento para realizar ações que devem ocorrer antes que o componente seja renderizado ou atualizado.\nConsulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n- **brDidRender** - Emite um evento após o componente ter sido carregado pela primeira vez.\nUtilize este evento para realizar ações que devem ocorrer antes que o componente seja renderizado ou atualizado.\nConsulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n\n### **Methods:**\n - **watchItemIsActive(newValue: _boolean_, oldValue: _boolean_)** - 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\n- **setStepItemPositionStatus(value: _'first' | 'middle' | 'last'_)** - \nMétodo disponibilizado via api do elemento que indica a posição do step item, ele serve para setar o state stepItemPositionStatus do componente\n- **handleShowTimeLine(value: _boolean_, layout)** - Método que define a orientação do stepItem e controla a exibição da linha do tempo após o componente.\n- **setLabelPosition(value: _'top' | 'right' | 'bottom' | 'left'_)** - \nMétodo disponibilizado via api do elemento que atribui o valor ao estado que define onde o label, o texto de destaque, irá ficar localizado\n- **setContentType(value: _'default' | 'br-icon' | 'no-content' | 'slotted'_)** - \nMétodo disponibilizado via api do elemento que atribui o valor que irá definir o tipo de conteúdo apresentado dentro do componente stepItem\n- **setMode(value: _'controller' | 'step'_)** - \nMé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.\n- **setContent(value: _string_)** - \nMétodo disponibilizado via api do elemento que atribui o valor que irá ser exibido dentro do componente stepItem\n\n### **Slots:**\n - **label-area** - Slot para conteúdo customizado dentro do botão do item do step.",
+      "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/step?tab=designer).\n---\n\n\n### **Events:**\n - **brWillRender** - Emite um evento após o componente ter sido carregado pela primeira vez.\nUtilize este evento para realizar ações que devem ocorrer antes que o componente seja renderizado ou atualizado.\nConsulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n- **brDidRender** - Emite um evento após o componente ter sido carregado pela primeira vez.\nUtilize este evento para realizar ações que devem ocorrer antes que o componente seja renderizado ou atualizado.\nConsulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n\n### **Methods:**\n - **watchItemIsActive(newValue: _boolean_, oldValue: _boolean_)** - 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\n- **setStepItemPositionStatus(value: _'first' | 'middle' | 'last'_)** - \nMétodo disponibilizado via api do elemento que indica a posição do step item, ele serve para setar o state stepItemPositionStatus do componente\n- **handleShowTimeLine(value: _boolean_, layout)** - Método que define a orientação do stepItem e controla a exibição da linha do tempo após o componente.\n- **setLabelPosition(value: _'top' | 'right' | 'bottom' | 'left'_)** - \nMétodo disponibilizado via api do elemento que atribui o valor ao estado que define onde o label, o texto de destaque, irá ficar localizado\n- **setContentType(value: _'default' | 'br-icon' | 'no-content' | 'slotted'_)** - \nMétodo disponibilizado via api do elemento que atribui o valor que irá definir o tipo de conteúdo apresentado dentro do componente stepItem\n- **setMode(value: _'controller' | 'step'_)** - \nMé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.\n- **setContent(value: _string_)** - \nMétodo disponibilizado via api do elemento que atribui o valor que irá ser exibido dentro do componente stepItem\n\n### **Slots:**\n - **label-area** - Slot para conteúdo customizado dentro do botão do item do step.\n\n### **CSS Parts:**\n - **item-container** - Parte para o contêiner externo do item do step, usada para estilizar posicionamento e espaçamento via ::part().\n- **item-content** - Parte para o contêiner interno com indicador visual e label, usada para estilizar conteúdo via ::part().\n- **label** - Parte para o contêiner do texto da etapa, usada para estilizar tipografia e cor via ::part().",
       "attributes": [
-        { "name": "label", "values": [] },
+        {
+          "name": "label",
+          "description": "Propriedade que define o conteúdo do texto auxiliar de realce do item de Step.",
+          "values": []
+        },
         {
           "name": "highlight",
+          "description": "Propriedade que define o tipo de ícone de destaque exibido pelo item Step, com quatro opções disponíveis: \"success\", \"info\", \"danger\" e \"warning\".",
           "values": [
             { "name": "success" },
             { "name": "info" },
@@ -1145,10 +2424,26 @@
             { "name": "warning" }
           ]
         },
-        { "name": "active", "values": [] },
-        { "name": "disabled", "values": [] },
-        { "name": "br-icon-name", "values": [] },
-        { "name": "br-icon-aria", "values": [] }
+        {
+          "name": "active",
+          "description": "Propriedade que define se o item Step está com estado ativo.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Propriedade que define se o item Step está com estado desativado..",
+          "values": []
+        },
+        {
+          "name": "br-icon-name",
+          "description": "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.",
+          "values": []
+        },
+        {
+          "name": "br-icon-aria",
+          "description": "Propriedade Define o nome do ícone o texto de acessibilidade apresentando quando o tipo de conteúdo for o br-icon",
+          "values": []
+        }
       ],
       "references": []
     },
@@ -1156,13 +2451,41 @@
       "name": "br-tab-item",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/tab?tab=designer).\n---\n\n\n### **Events:**\n - **brTabItemPropsChange** - Evento disparado quando as propriedades do tab-item mudam.\nO componente pai (br-tab) escuta este evento para atualizar a navegação.\n\n### **Methods:**\n - **tabItemTitleChanged()** - Observa mudanças no título e notifica o pai\n- **iconChanged()** - Observa mudanças no ícone e notifica o pai\n- **counterChanged()** - Observa mudanças no contador e notifica o pai\n- **onlyIconChanged()** - Observa mudanças em onlyIcon e notifica o pai\n\n### **Slots:**\n - **default** - Slot para o conteúdo do item da aba.",
       "attributes": [
-        { "name": "tab-item-id", "values": [] },
-        { "name": "tab-item-title", "values": [] },
-        { "name": "icon", "values": [] },
-        { "name": "only-icon", "values": [] },
-        { "name": "is-active", "values": [] },
-        { "name": "counter", "values": [] },
-        { "name": "color-mode", "values": [{ "name": "dark" }] }
+        {
+          "name": "tab-item-id",
+          "description": "Identificador único do item da tab.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "tab-item-title",
+          "description": "Define o título do item de tab que aparece no botão de navegação",
+          "values": []
+        },
+        {
+          "name": "icon",
+          "description": "Define ícone do item de tab",
+          "values": []
+        },
+        {
+          "name": "only-icon",
+          "description": "Define se exibe apenas o ícone, sem texto",
+          "values": []
+        },
+        {
+          "name": "is-active",
+          "description": "Define se o item de tab está ativo/visível",
+          "values": []
+        },
+        {
+          "name": "counter",
+          "description": "Define contador do item de tab (exibido abaixo do botão)",
+          "values": []
+        },
+        {
+          "name": "color-mode",
+          "description": "Define se o Tab usará um esquema de cores escuro",
+          "values": [{ "name": "dark" }]
+        }
       ],
       "references": []
     },
@@ -1170,10 +2493,19 @@
       "name": "br-table-cell",
       "description": "Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/table?tab=designer).\n---\n\n\n### **Methods:**\n - **handleHorizontalAlignChange(newValue: _HorizontalAlign_)** - Watcher que observa as mudanças na propriedade `horizontalAlign`.\n- **handleHorizontalAlignDidChange(event: _CustomEvent_)** - Ouve o evento disparado ao alterar o alinhamento horizontal do conteúdo da célula.\n- **render(): __** - Define o JSX do componente.\n\n### **Slots:**\n - **default** - Slot para o conteúdo da célula da tabela.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "has-vertical-border", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "has-vertical-border",
+          "description": "Define se a célula do cabeçalho possui borda vertical.",
+          "values": []
+        },
         {
           "name": "horizontal-align",
+          "description": "Define o alinhamento horizontal do conteúdo da célula.",
           "values": [{ "name": "HorizontalAlign" }]
         }
       ],
@@ -1183,10 +2515,19 @@
       "name": "br-table-header-cell",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/table?tab=designer).\n---\n\n\n### **Events:**\n - **brHorizontalAlignDidChange** - Evento disparado ao alterar o alinhamento horizontal do conteúdo da célula.\n\n### **Slots:**\n - **default** - Slot para o conteúdo da célula de cabeçalho da tabela.",
       "attributes": [
-        { "name": "custom-id", "values": [] },
-        { "name": "has-vertical-border", "values": [] },
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        },
+        {
+          "name": "has-vertical-border",
+          "description": "Define se a célula do cabeçalho possui borda vertical.",
+          "values": []
+        },
         {
           "name": "horizontal-align",
+          "description": "Define o alinhamento horizontal do conteúdo da célula.\nEsse alinhamento é propagado para as demais células da coluna.",
           "values": [{ "name": "HorizontalAlign" }]
         }
       ],
@@ -1195,19 +2536,37 @@
     {
       "name": "br-table-header-row",
       "description": "## Design System\n\nPara a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/table?tab=designer).\n---\n\n\n### **Methods:**\n - **render(): __** - Define o JSX do componente.\n\n### **Slots:**\n - **default** - Slot para as células de cabeçalho da linha da tabela.",
-      "attributes": [{ "name": "custom-id", "values": [] }],
+      "attributes": [
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        }
+      ],
       "references": []
     },
     {
       "name": "br-table-row",
       "description": "Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/table?tab=designer).\n---\n\n\n### **Slots:**\n - **default** - Slot para as células da linha da tabela.",
-      "attributes": [{ "name": "custom-id", "values": [] }],
+      "attributes": [
+        {
+          "name": "custom-id",
+          "description": "Identificador único.\nCaso não seja fornecido, um ID gerado automaticamente será usado.",
+          "values": []
+        }
+      ],
       "references": []
     },
     {
       "name": "br-wizard-panel",
       "description": "Wizard Panel (Painel de etapa do Wizard)\nRepresenta uma etapa individual dentro do br-wizard.\n---\n\n\n### **Slots:**\n - **default** - Slot para o conteúdo da etapa (formulários, campos ou informações da fase atual).",
-      "attributes": [{ "name": "label", "values": [] }],
+      "attributes": [
+        {
+          "name": "label",
+          "description": "Label do painel (aparece no indicador de progresso)",
+          "values": []
+        }
+      ],
       "references": []
     }
   ]