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

package/hydrate/package.json

@@ -0,0 +1,6 @@
+{
+  "name": "@govbr-ds/webcomponents/hydrate",
+  "description": "webcomponents component hydration app.",
+  "main": "index.js",
+  "types": "index.d.ts"
+}

package/loader/cdn.js

@@ -0,0 +1,3 @@
+
+module.exports = require('../dist/cjs/loader.cjs.js');
+module.exports.applyPolyfills = function() { return Promise.resolve() };

package/loader/index.cjs.js

@@ -0,0 +1,3 @@
+
+module.exports = require('../dist/cjs/loader.cjs.js');
+module.exports.applyPolyfills = function() { return Promise.resolve() };

package/loader/index.d.ts

@@ -0,0 +1,21 @@
+export * from '../dist/types/components';
+export interface CustomElementsDefineOptions {
+  exclude?: string[];
+  resourcesUrl?: string;
+  syncQueue?: boolean;
+  jmp?: (c: Function) => any;
+  raf?: (c: FrameRequestCallback) => number;
+  ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+}
+export declare function defineCustomElements(win?: Window, opts?: CustomElementsDefineOptions): void;
+export declare function applyPolyfills(): Promise<void>;
+
+/**
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare function setNonce(nonce: string): void;

package/loader/index.es2017.js

@@ -0,0 +1,3 @@
+
+export * from '../dist/esm/polyfills/index.js';
+export * from '../dist/esm/loader.js';

package/loader/index.js

@@ -0,0 +1,4 @@
+
+(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/polyfills/index.js';
+export * from '../dist/esm/loader.js';

package/loader/package.json

@@ -0,0 +1,11 @@
+{
+  "name": "webcomponents-loader",
+  "private": true,
+  "typings": "./index.d.ts",
+  "module": "./index.js",
+  "main": "./index.cjs.js",
+  "jsnext:main": "./index.es2017.js",
+  "es2015": "./index.es2017.js",
+  "es2017": "./index.es2017.js",
+  "unpkg": "./cdn.js"
+}

package/package.json

@@ -1,111 +1,78 @@
 {
   "name": "@govbr-ds/webcomponents",
-  "version": "2.0.0-next.4",
-  "private": false,
-  "description": "Projeto de Webcomponents baseado no GovBR-DS",
+  "version": "2.0.0-next.6",
+  "description": "Projeto de Web Components baseado no GovBR-DS",
   "keywords": [
     "design system",
     "govbr-ds",
-    "web components",
-    "vue"
+    "web components"
   ],
   "homepage": "https://gov.br/ds/webcomponents",
   "bugs": {
-    "url": "https://gitlab.com/govbr-ds/dev/wbc/govbr-ds-wbc/issues"
+    "url": "https://gitlab.com/govbr-ds/bibliotecas/wbc/govbr-ds-wbc/issues"
   },
   "repository": {
     "type": "git",
-    "url": "git@gitlab.com:govbr-ds/dev/wbc/govbr-ds-wbc.git"
+    "url": "git@gitlab.com:govbr-ds/bibliotecas/wbc/govbr-ds-wbc.git"
   },
   "license": "MIT",
-  "author": "SERPRO <govbr-ds@serpro.gov.br> (http://serpro.gov.br/)",
-  "contributors": [
-    "Dataprev (https://portal3.dataprev.gov.br/)"
-  ],
-  "main": "dist/webcomponents.umd.min.js",
+  "author": "SERPRO (http://serpro.gov.br/)",
+  "main": "dist/index.cjs.js",
+  "unpkg": "dist/webcomponents/webcomponents.esm.js",
+  "module": "dist/index.js",
+  "types": "dist/types/index.d.ts",
   "files": [
-    "/dist/**/*",
-    "!/dist/*.html"
+    "dist/",
+    "loader/",
+    "hydrate/",
+    "vscode-data.json"
   ],
   "scripts": {
-    "build": "vue-cli-service build --target lib --inline-vue --name webcomponents src/library/lib.js",
-    "build:storybook": "build-storybook -o public",
-    "commit": "git-cz",
-    "lint:js": "vue-cli-service lint --fix",
-    "lint:md": "markdownlint -d --fix **/*.md",
-    "prepare": "chmod +x ./node_modules/husky/lib/bin.js && husky install",
-    "storybook": "start-storybook -p 6006",
-    "test:ci": "jest --config ./jest.config.js --collectCoverage --coverageDirectory=\"./coverage\" --ci --reporters=default --reporters=jest-junit --watchAll=false",
-    "test:unit": "vue-cli-service test:unit --updateSnapshot"
+    "build": "run-s build:prod rename:docs lint:md",
+    "build:prod": "stencil build --docs --prod",
+    "rename:docs": "bash ./scripts/rename-autodocs-titles.sh",
+    "dev": "stencil build --dev --watch --serve",
+    "generate": "stencil generate",
+    "lint:md": "cross-env markdownlint -d -f '**/*.md'",
+    "test": "stencil test --spec --e2e",
+    "test.unit": "stencil test --spec",
+    "test.watch": "stencil test --spec --e2e",
+    "test.e2e": "stencil test --e2e",
+    "test.playwright": "npx playwright test",
+    "test.playwright.ui": "npx playwright test --ui"
   },
   "lint-staged": {
     "*.md": [
-      "prettier --write",
       "markdownlint -d --fix"
-    ],
-    "*.{js,ts,vue}": [
-      "vue-cli-service lint --fix",
-      "vue-cli-service test:unit --findRelatedTests",
-      "prettier --write"
     ]
   },
-  "config": {
-    "commitizen": {
-      "path": "@commitlint/cz-commitlint"
-    }
-  },
   "dependencies": {
-    "core-js": "3.30.1",
-    "maska": "^2.1.9",
-    "vue": "3.2.47",
-    "vuex": "^4.1.0"
+    "@axe-core/playwright": "^4.9.1",
+    "@fortawesome/fontawesome-svg-core": "^6.5.2",
+    "@fortawesome/free-brands-svg-icons": "^6.5.2",
+    "@fortawesome/free-regular-svg-icons": "^6.5.2",
+    "@fortawesome/free-solid-svg-icons": "^6.5.2",
+    "@stencil/core": "^4.17.2",
+    "@stencil/sass": "^3.0.12",
+    "iconify-icon": "^2.1.0"
   },
   "devDependencies": {
-    "@babel/core": "7.21.8",
-    "@babel/eslint-parser": "7.21.8",
-    "@fullhuman/postcss-purgecss": "5.0.0",
-    "@fullhuman/vue-cli-plugin-purgecss": "5.0.0",
-    "@govbr-ds/commit-config": "latest",
-    "@govbr-ds/core": "3.3.1",
-    "@govbr-ds/release-config": "latest",
-    "@semantic-release/exec": "6.0.3",
-    "@storybook/addon-actions": "6.5.16",
-    "@storybook/addon-docs": "6.5.16",
-    "@storybook/addon-essentials": "6.5.16",
-    "@storybook/addon-links": "6.5.16",
-    "@storybook/addons": "6.5.16",
-    "@storybook/builder-webpack5": "6.5.16",
-    "@storybook/manager-webpack5": "6.5.16",
-    "@storybook/theming": "6.5.16",
-    "@storybook/vue3": "6.5.16",
-    "@vue/cli-plugin-babel": "5.0.8",
-    "@vue/cli-plugin-eslint": "5.0.8",
-    "@vue/cli-plugin-unit-jest": "5.0.8",
-    "@vue/cli-service": "5.0.8",
-    "@vue/compiler-sfc": "3.2.47",
-    "@vue/eslint-config-prettier": "7.1.0",
-    "@vue/test-utils": "2.3.2",
-    "@vue/vue3-jest": "27.0.0",
-    "@whitespace/storybook-addon-html": "^5.1.4",
-    "babel-loader": "^8.3.0",
-    "eslint": "8.39.0",
-    "eslint-plugin-storybook": "0.6.12",
-    "eslint-plugin-vue": "9.11.0",
-    "git-pull-run": "1.4.0",
-    "husky": "8.0.3",
-    "jest-junit": "15.0.0",
-    "lint-staged": "13.2.2",
-    "markdownlint-cli": "0.34.0",
-    "postcss": "8.4.23",
-    "prettier": "^2.8.8",
-    "react": "16.8.0 || 17.0.0",
-    "react-dom": "16.8.0 || 17.0.0",
-    "sass": "1.58.3",
-    "sass-loader": "13.2.2",
-    "semantic-release-discord": "1.2.0",
-    "storybook-version": "^0.1.1",
-    "vue-loader": "^16.8.3",
-    "vue-router": "4.1.6",
-    "vue-syntax-highlight": "^0.1.8"
-  }
+    "@playwright/test": "^1.44.1",
+    "@stencil/angular-output-target": "^0.8.4",
+    "@stencil/react-output-target": "^0.5.3",
+    "@stencil/vue-output-target": "^0.8.8",
+    "@types/jest": "^29.5.12",
+    "@types/node": "^20.12.8",
+    "jest": "^29.7.0",
+    "jest-cli": "^29.7.0",
+    "puppeteer": "22.7.1",
+    "stencil-inline-svg": "^1.1.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"
 }

package/vscode-data.json

@@ -0,0 +1,309 @@
+{
+  "version": 1.1,
+  "tags": [
+    {
+      "name": "br-button",
+      "description": {
+        "kind": "markdown",
+        "value": "Consulte a [documentação GovBR-DS](https://www.gov.br/ds/components/button?tab=designer) para mais detalhes."
+      },
+      "attributes": [
+        {
+          "name": "active",
+          "description": "Estado: ativo"
+        },
+        {
+          "name": "block",
+          "description": "Comportamento: bloco"
+        },
+        {
+          "name": "circle",
+          "description": "Tipo: circular"
+        },
+        {
+          "name": "dark-mode",
+          "description": "Habilita botão para fundos escuros (dark mode/invertido)"
+        },
+        {
+          "name": "density",
+          "description": "Comportamento: densidade",
+          "values": [
+            {
+              "name": "large"
+            },
+            {
+              "name": "small"
+            }
+          ]
+        },
+        {
+          "name": "disabled",
+          "description": "Estado: desabilitado"
+        },
+        {
+          "name": "emphasis",
+          "description": "Ênfase",
+          "values": [
+            {
+              "name": "primary"
+            },
+            {
+              "name": "secondary"
+            }
+          ]
+        },
+        {
+          "name": "loading",
+          "description": "Estado: loading/progresso"
+        },
+        {
+          "name": "type",
+          "description": "[Tipo](https://developer.mozilla.org/pt-BR/docs/Web/HTML/Element/button#type) do botão.",
+          "values": [
+            {
+              "name": "button"
+            },
+            {
+              "name": "reset"
+            },
+            {
+              "name": "submit"
+            }
+          ]
+        },
+        {
+          "name": "value",
+          "description": "Valor do botão"
+        }
+      ]
+    },
+    {
+      "name": "br-checkbox",
+      "description": {
+        "kind": "markdown",
+        "value": "Consulte a [documentação GovBR-DS](https://www.gov.br/ds/components/checkbox?tab=designer) para mais detalhes."
+      },
+      "attributes": [
+        {
+          "name": "checked",
+          "description": ""
+        },
+        {
+          "name": "disabled",
+          "description": ""
+        },
+        {
+          "name": "invalid",
+          "description": ""
+        },
+        {
+          "name": "label",
+          "description": ""
+        },
+        {
+          "name": "name",
+          "description": ""
+        },
+        {
+          "name": "valid",
+          "description": ""
+        },
+        {
+          "name": "value",
+          "description": ""
+        }
+      ]
+    },
+    {
+      "name": "br-icon",
+      "description": {
+        "kind": "markdown",
+        "value": ":::info\n\nElemento HTML:\n\n```html\n<br-icon></br-icon>\n```\n\nDá onde buscar os icones: <https://icones.js.org/>\n\n:::"
+      },
+      "attributes": [
+        {
+          "name": "icon-name",
+          "description": "Nome do ícone Iconify a ser exibido"
+        },
+        {
+          "name": "class",
+          "description": "Classes CSS adicionais a serem aplicadas ao ícone"
+        },
+        {
+          "name": "flip",
+          "description": "Espelha o ícone horizontalmente, verticalmente ou ambos. Aceita valores \"horizontal\", \"vertical\"."
+        },
+        {
+          "name": "height",
+          "description": "Altura do ícone, pode ser especificada em qualquer unidade CSS válida (px, em, rem, etc.)"
+        },
+        {
+          "name": "inline",
+          "description": "Adiciona alinhamento vertical ao ícone quando embutido no texto"
+        },
+        {
+          "name": "rotate",
+          "description": "Rotaciona o ícone em diferentes ângulos. Aceita valores como \"90deg\", \"180deg\", \"270deg\"."
+        },
+        {
+          "name": "width",
+          "description": "Largura do ícone, pode ser especificada em qualquer unidade CSS válida (px, em, rem, etc.)"
+        }
+      ]
+    },
+    {
+      "name": "br-input",
+      "description": {
+        "kind": "markdown",
+        "value": "\nConsulte a [documentação GovBR-DS](https://www.gov.br/ds/components/input?tab=designer) para mais detalhes."
+      },
+      "attributes": [
+        {
+          "name": "autocomplete",
+          "description": "Define o comportamento padrão do browser para autocomplete em formulários",
+          "values": [
+            {
+              "name": "off"
+            },
+            {
+              "name": "on"
+            }
+          ]
+        },
+        {
+          "name": "autofocus",
+          "description": "Se definido como true, o campo de entrada receberá foco automaticamente quando o formulário for carregado"
+        },
+        {
+          "name": "button",
+          "description": "Define se o input vai ter um botão a direita"
+        },
+        {
+          "name": "danger",
+          "description": ""
+        },
+        {
+          "name": "density",
+          "description": "Comportamento: densidade",
+          "values": [
+            {
+              "name": "large"
+            },
+            {
+              "name": "small"
+            }
+          ]
+        },
+        {
+          "name": "disabled",
+          "description": "Se definido como true, o campo de entrada é desabilitado e não pode ser interrompido."
+        },
+        {
+          "name": "highlight",
+          "description": ""
+        },
+        {
+          "name": "icon",
+          "description": "Define se o input vai ser icon. Use o"
+        },
+        {
+          "name": "info",
+          "description": ""
+        },
+        {
+          "name": "inline",
+          "description": "Define o label e input como comportamento inline"
+        },
+        {
+          "name": "label",
+          "description": "Label para o input"
+        },
+        {
+          "name": "name",
+          "description": "Nome do campo de entrada"
+        },
+        {
+          "name": "placeholder",
+          "description": "Uma dica ou sugestão exibida dentro do campo de entrada quando ele está vazio"
+        },
+        {
+          "name": "readonly",
+          "description": "Se definido como true, o valor do campo de entrada pode ser exibido, mas não editado pelo usuário."
+        },
+        {
+          "name": "required",
+          "description": "Se definido como true, o campo de entrada deve ser preenchido antes que o formulário possa ser enviado."
+        },
+        {
+          "name": "success",
+          "description": ""
+        },
+        {
+          "name": "type",
+          "description": "Tipo de campo de entrada",
+          "values": [
+            {
+              "name": "color"
+            },
+            {
+              "name": "email"
+            },
+            {
+              "name": "hidden"
+            },
+            {
+              "name": "number"
+            },
+            {
+              "name": "password"
+            },
+            {
+              "name": "range"
+            },
+            {
+              "name": "search"
+            },
+            {
+              "name": "tel"
+            },
+            {
+              "name": "text"
+            },
+            {
+              "name": "url"
+            }
+          ]
+        },
+        {
+          "name": "value",
+          "description": "Valor inicial a ser exibido no campo de entrada."
+        },
+        {
+          "name": "warning",
+          "description": ""
+        }
+      ]
+    },
+    {
+      "name": "br-item",
+      "description": {
+        "kind": "markdown",
+        "value": "Consulte a [documentação GovBR-DS](https://www.gov.br/ds/components/item?tab=designer) para mais detalhes."
+      },
+      "attributes": [
+        {
+          "name": "active",
+          "description": ""
+        },
+        {
+          "name": "disabled",
+          "description": ""
+        },
+        {
+          "name": "selected",
+          "description": ""
+        }
+      ]
+    }
+  ]
+}