@govbr-ds/webcomponents 2.0.0-next.18 → 2.0.0-next.19

package/loader/cdn.js

@@ -1 +1,6 @@
-module.exports = require('../dist/cjs/loader.cjs.js');
+/*!
+ * Construído com @govbr-ds/webcomponents
+ * Padrão Digital de Governo.
+ */
+module.exports = require('../dist/cjs/loader.cjs.js');
+module.exports.applyPolyfills = function() { return Promise.resolve() };

package/loader/index.cjs.js

@@ -1 +1,6 @@
-module.exports = require('../dist/cjs/loader.cjs.js');
+/*!
+ * Construído com @govbr-ds/webcomponents
+ * Padrão Digital de Governo.
+ */
+module.exports = require('../dist/cjs/loader.cjs.js');
+module.exports.applyPolyfills = function() { return Promise.resolve() };

package/loader/index.es2017.js

@@ -1 +1,6 @@
+/*!
+ * Construído com @govbr-ds/webcomponents
+ * Padrão Digital de Governo.
+ */
+export * from '../dist/esm/polyfills/index.js';
 export * from '../dist/esm/loader.js';

package/loader/index.js

@@ -1,2 +1,7 @@
+/*!
+ * Construído com @govbr-ds/webcomponents
+ * Padrão Digital de Governo.
+ */
 (function(){if("undefined"!==typeof window&&void 0!==window.Reflect&&void 0!==window.customElements){var a=HTMLElement;window.HTMLElement=function(){return Reflect.construct(a,[],this.constructor)};HTMLElement.prototype=a.prototype;HTMLElement.prototype.constructor=HTMLElement;Object.setPrototypeOf(HTMLElement,a)}})();
-export * from '../dist/esm/loader.js';
+export * from '../dist/esm/polyfills/index.js';
+export * from '../dist/esm-es5/loader.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@govbr-ds/webcomponents",
-  "version": "2.0.0-next.18",
+  "version": "2.0.0-next.19",
   "description": "Projeto de Web Components baseado no GovBR-DS",
   "keywords": [
     "design system",
@@ -28,16 +28,15 @@
     "vscode-data.json"
   ],
   "scripts": {
-    "build": "run-s build:prod rename:docs lint:md",
-    "build:prod": "stencil build --docs --prod",
+    "build": "run-s build:prod lint:md",
+    "build:prod": "stencil build --prod",
     "clear": "rm -rf .stencil dist hydrate loader www vscode-data.json",
-    "dev": "stencil build -docs --dev --watch --serve",
+    "dev": "stencil build --dev --watch --serve",
     "generate": "stencil generate",
     "lint:md": "cross-env markdownlint -d -f '**/*.md'",
     "lint:tsx": "eslint src/**/*{.ts,.tsx} --fix",
-    "rename:docs": "bash ./scripts/rename-autodocs-titles.sh",
-    "test:playwright": "npx playwright test",
-    "test:playwright.ui": "npx playwright test --ui",
+    "test:e2e": "npx playwright test",
+    "test:e2e:ui": "npx playwright test --ui",
     "test:unit": "stencil test --spec -- --collectCoverage",
     "test:watch": "stencil test --spec --watchAll"
   },
@@ -49,34 +48,32 @@
       "eslint --fix"
     ]
   },
-  "dependencies": {
-    "@govbr-ds/core": "3.6.0",
-    "@stencil/core": "4.21.0",
-    "@stencil/sass": "3.0.12",
-    "iconify-icon": "2.1.0"
-  },
   "devDependencies": {
     "@axe-core/playwright": "^4.10.0",
     "@fullhuman/postcss-purgecss": "^6.0.0",
-    "@playwright/test": "^1.47.2",
-    "@stencil-community/eslint-plugin": "^0.8.0",
+    "@govbr-ds/core": "^3.6.0",
+    "@playwright/test": "^1.48.2",
+    "@stencil-community/eslint-plugin": "^0.9.0",
     "@stencil-community/postcss": "^2.2.0",
-    "@stencil/angular-output-target": "^0.9.0",
-    "@stencil/react-output-target": "^0.7.1",
-    "@stencil/vue-output-target": "^0.8.9",
-    "@types/autoprefixer": "^10.2.0",
-    "@types/jest": "^29.5.13",
-    "@types/node": "^22.7.4",
+    "@stencil/angular-output-target": "^0.10.0",
+    "@stencil/core": "^4.22.2",
+    "@stencil/react-output-target": "^0.7.4",
+    "@stencil/sass": "^3.0.12",
+    "@stencil/vue-output-target": "0.8.9",
+    "@types/autoprefixer": "^10.2.4",
+    "@types/jest": "^29.5.14",
+    "@types/node": "^22.9.0",
     "autoprefixer": "^10.4.20",
+    "iconify-icon": "^2.1.0",
     "jest": "^29.7.0",
     "jest-cli": "^29.7.0",
-    "puppeteer": "23.5.0"
+    "puppeteer": "^23.7.0"
   },
   "publishConfig": {
     "access": "public"
   },
   "collection": "dist/collection/collection-manifest.json",
   "collection:main": "dist/collection/index.js",
-  "es2015": "dist/esm/index.js",
-  "es2017": "dist/esm/index.js"
+  "es2015": "dist/esm-es5/loader.js",
+  "es2017": "dist/esm/loader.js"
 }

package/vscode-data.json

@@ -10,7 +10,26 @@
       "attributes": [
         {
           "name": "density",
-          "description": "Ajusta a densidade, alterando o espaçamento interno para um visual mais compacto ou mais expandido."
+          "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": "icon-height",
+          "description": "Altura do ícone no avatar do tipo icônico"
+        },
+        {
+          "name": "icon-width",
+          "description": "Largura do ícone no avatar do tipo icônico"
         },
         {
           "name": "image",
@@ -24,6 +43,10 @@
           "name": "is-iconic",
           "description": "Indica se o avatar deve ser exibido como um ícone em vez de uma imagem fotográfica.\nSe definido como verdadeiro, o avatar será exibido como um ícone."
         },
+        {
+          "name": "margin-top",
+          "description": "Ajuste para a margem de cima do ícone no avatar do tipo icônico"
+        },
         {
           "name": "text",
           "description": "Texto exibido no avatar do tipo 'letra'.\nEsse texto será mostrado em vez de uma imagem e pode ser usado para representar iniciais ou outras informações textuais."
@@ -54,7 +77,7 @@
               "name": "large"
             },
             {
-              "name": "middle"
+              "name": "medium"
             },
             {
               "name": "small"
@@ -137,7 +160,7 @@
         },
         {
           "name": "id",
-          "description": "Especifica o ID do componente, que é usado para conectar o label correspondente ao checkbox.\nSe não for fornecido, o ID será o mesmo valor atribuído à propriedade `name`."
+          "description": "Identificador único do input.\nCaso não seja fornecido, um ID gerado automaticamente será usado."
         },
         {
           "name": "disabled",
@@ -161,7 +184,7 @@
         },
         {
           "name": "state",
-          "description": "Indica a validade do checkbox.\nValores possíveis:\n- 'valid': O checkbox é considerado válido.\n- 'invalid': O checkbox é considerado inválido.\nSe não for especificado, o valor padrão é `null`, indicando que a validade não foi definida.",
+          "description": "Indica a validade do checkbox.\nValores possíveis:\n'valid': O checkbox é considerado válido.\n'invalid': O checkbox é considerado inválido.\nSe não for especificado, o valor padrão é `null`, indicando que a validade não foi definida.",
           "values": [
             {
               "name": "invalid"
@@ -201,10 +224,6 @@
           "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."
         },
-        {
-          "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."
-        },
         {
           "name": "flip",
           "description": "Define o tipo de espelhamento do ícone.\nAceita valores como \"horizontal\" para espelhar o ícone horizontalmente, \"vertical\" para espelhar verticalmente, ou ambos.",
@@ -221,6 +240,10 @@
           "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'."
         },
+        {
+          "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."
+        },
         {
           "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`."
@@ -266,12 +289,8 @@
           ]
         },
         {
-          "name": "danger",
-          "description": "Se verdadeiro, o input indica um estado de validação com erro."
-        },
-        {
-          "name": "default-i-d",
-          "description": "Identificador único do campo de entrada.\nCaso não seja fornecido, um ID gerado automaticamente será usado."
+          "name": "id",
+          "description": "Identificador único do input.\nCaso não seja fornecido, um ID gerado automaticamente será usado."
         },
         {
           "name": "density",
@@ -296,10 +315,6 @@
           "name": "help-text",
           "description": "Texto adicional que fornece ajuda ou informações sobre o input."
         },
-        {
-          "name": "info",
-          "description": "Se verdadeiro, o input indica um estado informativo."
-        },
         {
           "name": "is-highlight",
           "description": "Se verdadeiro, o input terá destaque visual."
@@ -329,8 +344,22 @@
           "description": "Se verdadeiro, o input é obrigatório e deve ser preenchido antes que o formulário possa ser enviado."
         },
         {
-          "name": "success",
-          "description": "Se verdadeiro, o input indica um estado de validação bem-sucedido."
+          "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": "danger"
+            },
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            }
+          ]
         },
         {
           "name": "type",
@@ -374,10 +403,6 @@
         {
           "name": "value",
           "description": "Valor inicial exibido no input.\nPode ser alterado pelo usuário se a propriedade `readonly` não estiver ativa."
-        },
-        {
-          "name": "warning",
-          "description": "Se verdadeiro, o input indica um estado de alerta."
         }
       ]
     },
@@ -396,7 +421,7 @@
               "name": "large"
             },
             {
-              "name": "middle"
+              "name": "medium"
             },
             {
               "name": "small"
@@ -473,6 +498,10 @@
         "value": "Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/list?tab=designer)."
       },
       "attributes": [
+        {
+          "name": "header",
+          "description": "Define o cabeçalho para a lista."
+        },
         {
           "name": "hide-header-divider",
           "description": "Indica que o divider para o título da lista estará oculto."
@@ -480,10 +509,6 @@
         {
           "name": "is-horizontal",
           "description": "Indica se a lista será horizontal. Por padrão, a lista é vertical."
-        },
-        {
-          "name": "list-title",
-          "description": "Define o título para a lista."
         }
       ]
     },
@@ -533,7 +558,7 @@
         },
         {
           "name": "message",
-          "description": "**[OBRIGATÓRIO]** 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."
+          "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."
         },
         {
           "name": "message-title",
@@ -545,7 +570,7 @@
         },
         {
           "name": "state",
-          "description": "**[OBRIGATÓRIO]** Define o estado visual da mensagem.\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'.",
+          "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": "danger"
@@ -576,7 +601,7 @@
         },
         {
           "name": "id",
-          "description": "Especifica o ID do componente, que é usado para conectar o label correspondente ao radio.\nSe não for fornecido, o ID será gerado automaticamente e de forma aleatória"
+          "description": "Identificador único do input.\nCaso não seja fornecido, um ID gerado automaticamente será usado."
         },
         {
           "name": "disabled",
@@ -625,7 +650,7 @@
         },
         {
           "name": "id",
-          "description": "Especifica o ID do componente, que é usado para conectar o label correspondente ao checkbox.\nSe não for fornecido, o ID será o mesmo valor atribuído à propriedade `name`."
+          "description": "Identificador único do switch.\nCaso não seja fornecido, um ID gerado automaticamente será usado."
         },
         {
           "name": "density",
@@ -695,24 +720,31 @@
       },
       "attributes": [
         {
-          "name": "default-id",
-          "description": "Identificador único do textarea, gerado automaticamente.\nEste ID é utilizado para associar o textarea a outros elementos, como rótulos,\ne garantir que cada instância do componente tenha um identificador distinto."
+          "name": "id",
+          "description": "Identificador único do textarea.\nCaso não seja fornecido, um ID gerado automaticamente será usado."
         },
         {
           "name": "density",
-          "description": "Ajusta a densidade do componente, podendo ser 'small', 'medium' ou 'large'."
+          "description": "Ajusta a densidade do componente, podendo ser 'small', 'medium' ou 'large'.",
+          "values": [
+            {
+              "name": "large"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "small"
+            }
+          ]
         },
         {
           "name": "disabled",
           "description": "Indica se o textarea está desabilitado. Quando verdadeiro, o usuário não pode interagir com o campo."
         },
         {
-          "name": "is-dark-mode",
-          "description": "Ativa o modo escuro para o componente. Quando verdadeiro, o componente será exibido em um tema escuro."
-        },
-        {
-          "name": "is-label-left",
-          "description": "Define se o rótulo deve ser exibido à esquerda do textarea. Quando verdadeiro, o rótulo é posicionado à esquerda."
+          "name": "is-inline",
+          "description": "Se verdadeiro, o rótulo e o input estarão na mesma linha (layout inline)."
         },
         {
           "name": "label",
@@ -727,8 +759,19 @@
           "description": "Texto exibido quando o textarea está vazio. Ajuda a guiar o usuário sobre o que deve ser inserido."
         },
         {
-          "name": "states",
-          "description": "Define o estado visual do componente, podendo ser 'danger', 'success' ou 'warning'."
+          "name": "state",
+          "description": "Define o estado visual do componente, podendo ser 'danger', 'success' ou 'warning'.",
+          "values": [
+            {
+              "name": "danger"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            }
+          ]
         },
         {
           "name": "value",

package/dist/cjs/app-globals-3a1e7e63.js

@@ -1,7 +0,0 @@
-'use strict';
-
-const globalScripts = () => {};
-
-exports.globalScripts = globalScripts;
-
-//# sourceMappingURL=app-globals-3a1e7e63.js.map

package/dist/cjs/app-globals-3a1e7e63.js.map

@@ -1 +0,0 @@
-{"file":"app-globals-3a1e7e63.js","mappings":";;AAAY,MAAC,aAAa,GAAG,MAAM;;;;","names":[],"sources":["@stencil/core/internal/app-globals"],"sourcesContent":["export const globalScripts = () => {};\n"],"version":3}