@govbr-ds/webcomponents 1.4.1 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/README.md +87 -38
  2. package/dist/webcomponents.common.js +19387 -26685
  3. package/dist/webcomponents.common.js.map +1 -1
  4. package/dist/webcomponents.umd.js +19388 -26686
  5. package/dist/webcomponents.umd.js.map +1 -1
  6. package/dist/webcomponents.umd.min.js +7 -1
  7. package/dist/webcomponents.umd.min.js.map +1 -1
  8. package/package.json +65 -74
package/README.md CHANGED
@@ -1,63 +1,110 @@
1
- # Web Components GOVBR-DS
1
+ # Web Components GovBR-DS
2
2
 
3
- Biblioteca baseada no [GOVBR-DS](https://gov.br/ds 'GOVBR-DS') e construída usando Web Components para ser independente de frameworks.
3
+ Biblioteca baseada no [GovBR-DS](https://gov.br/ds 'GovBR-DS') e construída usando Web Components para ser independente de frameworks.
4
4
 
5
5
  ## Tecnologias
6
6
 
7
7
  Esse projeto é desenvolvido usando:
8
8
 
9
- 1. [VueJS 3](https://v3.vuejs.org/ 'VueJS 3')
10
- 1. [Storybook](https://storybook.js.org/ 'Storybook')
11
- 1. [Jest](https://jestjs.io/ 'Jest')
9
+ 1. [GovBR-DS](https://gov.br/ds/ 'GovBR-DS')
10
+ 2. [Font Awesome](https://fontawesome.com/ 'Font Awesome')
11
+ 3. [Fonte Rawline](https://www.cdnfonts.com/rawline.font/ 'Fonte Rawline')
12
+ 4. [VueJS 3](https://v3.vuejs.org/ 'VueJS 3')
13
+ 5. [Storybook](https://storybook.js.org/ 'Storybook')
14
+ 6. [Jest](https://jestjs.io/ 'Jest')
12
15
 
13
- Para saber mais detalhes sobre Web Components sugerimos que consulte o [MDN](https://developer.mozilla.org/pt-BR/docs/Web/Web_Components 'Web Components | MDN').
16
+ > Para saber mais detalhes sobre Web Components sugerimos que consulte o [MDN](https://developer.mozilla.org/pt-BR/docs/Web/Web_Components 'Web Components | MDN').
14
17
 
15
- ## Dependências
18
+ ## Uso
16
19
 
17
- Para conseguir usar nossa biblioteca sem problemas temos as seguintes dependências:
20
+ Existem 2 maneiras de usar nossos Web Components:
18
21
 
19
- 1. [GOVBR-DS](https://gov.br/ds/ 'GOVBR-DS')
20
-
21
- 1. [Font Awesome](https://fontawesome.com/ 'Font Awesome')
22
-
23
- 1. [Fonte Rawline](https://www.cdnfonts.com/rawline.font/ 'Fonte Rawline')
24
-
25
- > O fontawesome e a fonte rawline podem ser importadas de um CDN. Consulte a documentação no site do [GOVBR-DS](https://www.gov.br/ds/ 'GOVBR-DS') para mais detalhes.
26
-
27
- ## Instalação
22
+ - Pacote NPM
28
23
 
29
24
  ```bash
30
25
  npm install --save @govbr-ds/webcomponents
31
- ```## Uso
26
+ ```
32
27
 
33
- Depois de instalada, importe a biblioteca de dentro da parta node_modules:
28
+ Depois de instalada, importe a biblioteca de dentro da pasta *node_modules*:
34
29
 
35
30
  ```javascript
36
31
  @import "node_modules/@govbr-ds/webcomponents/dist/webcomponents.umd.min.js"
37
32
  ```
38
33
 
34
+ - CDN
35
+
36
+ ```html
37
+ <script src="https://unpkg.com/@govbr-ds/webcomponents@VERSÃO/dist/webcomponents.umd.min.js"></script>
38
+ ```
39
+
40
+ > Troque **versão** pela versão do pacote que deseja
41
+
42
+ **Importante**: O CDN <https://unpkg.com/> não é mantido por nossa equipe e portanto não podemos garantir um SLO. Considere importar os arquivos necessários para uma infraestrutura interna caso isso seja um impedimento para seu projeto.
43
+
44
+ ### Font Awesome e Fonte Rawline
45
+
46
+ Nossos componentes usam a [Fonte Rawline](https://www.cdnfonts.com/rawline.font/ 'Fonte Rawline') juntamente com a [Font Awesome](https://fontawesome.com/ 'Font Awesome') padrão do DS.
47
+
48
+ Consulte a documentação no site do [GovBR-DS](https://www.gov.br/ds/como-comecar/instalacao 'GovBR-DS') para mais detalhes sobre como importá-los de seus respectivos CDNs.
49
+
39
50
  ### Exemplos de uso
40
51
 
41
- Disponibilizamos alguns exemplos de como usar esse projeto com algumas tecnologias. Consulte o [nosso grupo aqui no gitlab](https://gitlab.com/govbr-ds/dev/wbc 'GOVBR-DS/DEV/WBC') e procure pelos projetos de 'Quickstart' para mais detalhes.
52
+ Disponibilizamos alguns exemplos de como usar esse projeto com algumas tecnologias. Consulte o [nosso grupo aqui no gitlab](https://gitlab.com/govbr-ds/dev/wbc 'GovBR-DS/DEV/WBC') e procure pelos projetos de 'Quickstart' para mais detalhes.
53
+
54
+ ## Estrutura de pastas
55
+
56
+ > Vamos explicar apenas as pastas/arquivos que são importantes para o entendimento do projeto e contribuição.
57
+
58
+ ```markdown
59
+ /raiz
60
+ └───public
61
+ │ └───index.html
62
+ └───src
63
+ │ │───App.vue
64
+ │ │───main.js
65
+ │ │
66
+ │ │───library
67
+ │ │ │───lib.js
68
+ │ │ │───components
69
+ │ │ │───mixins
70
+ │ │ └───util
71
+ │ │───pages
72
+ │ │───router
73
+ │ └───stories
74
+ ```
75
+
76
+ - **public/index.html**: página inicial da aplicação Vue que faz uso dos componentes da biblioteca.
77
+ - **src**
78
+ - **App.vue** e **main.js**: arquivos da aplicação Vue.
79
+ - **library**
80
+ - **lib.js**: inicializa todos os custom elements e define o que faz parte da biblioteca. É usado para fazer o build final.
81
+ - **components**: pasta com os componentes da biblioteca, seus testes e stories do storybook.
82
+ - **mixins**: mixins que são usados em vários componentes.
83
+ - **util**: funções criadas para facilitar ações dentro dos componentes
84
+ - **pages**: páginas da aplicação Vue. São os exemplos que usamos para testar
85
+ - **router**: arquivo com as rotas apontando para as páginas (pages) da aplicação Vue
86
+ - **stories**: Arquivos com as stories gerais do storybook
42
87
 
43
- ## Rodando localmente
88
+ > Aplicação Vue é uma aplicação criada para testar rapidamente nossos componentes. Ela não é disponibilizada no build e nem disponibilizamos um site com ela.
44
89
 
45
- Clone o projeto
90
+ ## Rodar o projeto na máquina local
91
+
92
+ Clone o projeto:
46
93
 
47
94
  ```bash
48
- git clone git@gitlab.com:govbr-ds/dev/wbc/govbr-ds-wbc.git
95
+ git clone git@gitlab.com:govbr-ds/dev/wbc/govbr-ds-wbc.git
49
96
  ```
50
97
 
51
- Entre no diretório do projeto
98
+ Entre no diretório do projeto:
52
99
 
53
100
  ```bash
54
- cd govbr-ds-wbc
101
+ cd govbr-ds-wbc
55
102
  ```
56
103
 
57
- Instale as dependências
104
+ Instale as dependências:
58
105
 
59
106
  ```bash
60
- npm install
107
+ npm install
61
108
  ```
62
109
 
63
110
  Para executar a nossa biblioteca a partir do código-fonte você tem 2 opções:
@@ -90,9 +137,9 @@ Nossa documentação está disponível em <https://gov.br/ds/webcomponents/>.
90
137
 
91
138
  Antes de abrir um Merge Request tenha em mente algumas informações:
92
139
 
93
- - Esse é um projeto opensource e contribuições são bem-vindas.
94
- - Para facilitar a aprovação da sua contribuição, escolha um título curto, simples e explicativo para o MR, e siga os padrões da nossa [wiki](https://govbr-ds.gitlab.io/govbr-ds-wiki/ 'Wiki').
95
- - Quer contribuir com o projeto? Confira o nosso guia [como contribuir](./CONTRIBUTING.md 'Como contribuir?').
140
+ - Esse é um projeto opensource e contribuições são bem-vindas.
141
+ - Para facilitar a aprovação da sua contribuição, escolha um título curto, simples e explicativo para o MR, e siga os padrões da nossa [wiki](https://gov.br/ds/wiki/ 'Wiki').
142
+ - Quer contribuir com o projeto? Confira o nosso guia [como contribuir](./CONTRIBUTING.md 'Como contribuir?').
96
143
 
97
144
  ### Reportar bugs/necessidades
98
145
 
@@ -106,27 +153,29 @@ Nos comprometemos a responder a todas as issues.
106
153
 
107
154
  Use nossos canais abaixo para obter tirar suas dúvidas:
108
155
 
109
- - Site do GOVBR-DS <http://gov.br/ds>
156
+ - Site do GovBR-DS <http://gov.br/ds>
110
157
 
111
- - Web Components <https://gov.br/ds/webcomponents/>
158
+ - Web Components <https://gov.br/ds/webcomponents/>
112
159
 
113
- - Pelo nosso email <govbr-ds@serpro.gov.br>
160
+ - Pelo nosso email <govbr-ds@serpro.gov.br>
114
161
 
115
- - Usando nosso canal no discord <https://discord.gg/U5GwPfqhUP>
162
+ - Usando nosso canal no discord <https://discord.gg/U5GwPfqhUP>
116
163
 
117
164
  ## Commits
118
165
 
119
- Nesse projeto usamos um padrão para branches e commits. Por favor observe a documentação na nossa [wiki](https://govbr-ds.gitlab.io/govbr-ds-wiki/ 'Wiki') para aprender sobre os nossos padrões.
166
+ Nesse projeto usamos um padrão para branches e commits. Por favor observe a documentação na nossa [wiki](https://gov.br/ds/wiki/ 'Wiki') para aprender sobre os nossos padrões.
120
167
 
121
168
  ## Apêndice
122
169
 
123
170
  ### Polyfill
124
171
 
125
- Caso os requisitos to seu projeto incluam navegadores que não suportam completamente os Web Components, adicione os [polyfills](https://www.webcomponents.org/polyfills) ao seu projeto.
172
+ Caso os requisitos do seu projeto incluam navegadores que não suportam completamente os Web Components, adicione os [polyfills](https://www.webcomponents.org/polyfills) ao seu projeto.
173
+
174
+ Para aprender com instalar, consulte a [documentação oficial](https://github.com/webcomponents/polyfills/tree/master/packages/webcomponentsjs 'Polyfills')
126
175
 
127
- Para aprender com instalar, consulte a [documentação oficial](https://github.com/webcomponents/polyfills/tree/master/packages/webcomponentsjs 'Polyfills')## Créditos
176
+ ## Créditos
128
177
 
129
- Os Web Components do [GOVBR-DS](https://gov.br/ds/ 'GOVBR-DS') são criados pelo [SERPRO](https://www.serpro.gov.br/ 'SERPRO | Serviço Federal de Processamento de Dados') e [Dataprev](https://www.dataprev.gov.br/ 'Dataprev | Empresa de Tecnologia e Informações da Previdência') juntamente com a participação da comunidade.
178
+ Os Web Components do [GovBR-DS](https://gov.br/ds/ 'GovBR-DS') são criados pelo [SERPRO](https://www.serpro.gov.br/ 'SERPRO | Serviço Federal de Processamento de Dados') e [Dataprev](https://www.dataprev.gov.br/ 'Dataprev | Empresa de Tecnologia e Informações da Previdência') juntamente com a participação da comunidade.
130
179
 
131
180
  ## Licença
132
181