@sankhyalabs/ezui-docs 2.3.1 → 2.3.2

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 (34) hide show
  1. package/components/ez-actions-button/readme.md +28 -16
  2. package/components/ez-button/readme.md +45 -10
  3. package/components/ez-calendar/readme.md +47 -15
  4. package/components/ez-card-item/readme.md +21 -6
  5. package/components/ez-check/readme.md +59 -14
  6. package/components/ez-chip/readme.md +38 -14
  7. package/components/ez-collapsible-box/readme.md +34 -19
  8. package/components/ez-combo-box/readme.md +58 -21
  9. package/components/ez-date-input/readme.md +23 -15
  10. package/components/ez-date-time-input/readme.md +24 -16
  11. package/components/ez-dialog/readme.md +39 -23
  12. package/components/ez-filter-input/readme.md +14 -15
  13. package/components/ez-form/readme.md +6 -26
  14. package/components/ez-grid/readme.md +36 -31
  15. package/components/ez-icon/readme.md +11 -5
  16. package/components/ez-list/readme.md +57 -19
  17. package/components/ez-loading-bar/readme.md +2 -2
  18. package/components/ez-modal/readme.md +18 -11
  19. package/components/ez-modal-container/readme.md +9 -9
  20. package/components/ez-number-input/readme.md +17 -17
  21. package/components/ez-popover/readme.md +25 -16
  22. package/components/ez-popup/readme.md +25 -10
  23. package/components/ez-radio-button/readme.md +40 -10
  24. package/components/ez-scroller/readme.md +11 -5
  25. package/components/ez-search/readme.md +17 -18
  26. package/components/ez-tabselector/readme.md +15 -8
  27. package/components/ez-text-area/readme.md +40 -16
  28. package/components/ez-text-edit/readme.md +9 -9
  29. package/components/ez-text-input/readme.md +47 -18
  30. package/components/ez-time-input/readme.md +16 -16
  31. package/components/ez-toast/readme.md +18 -9
  32. package/components/ez-upload/readme.md +33 -11
  33. package/components/ez-view-stack/readme.md +2 -2
  34. package/package.json +1 -1
package/components/ez-icon/readme.md CHANGED
@@ -7,11 +7,11 @@
7
7
 
8
8
  ## Properties
9
9
 
10
- | Property | Attribute | Description | Type | Default |
11
- | ---------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------ | -------- | ----------- |
12
- | `href` | `href` | Path da imagem | `string` | `undefined` |
13
- | `iconName` | `icon-name` | Nome do icone disponível no pacote de fontes [ez-icons](https://sankhyalabs-storybook.herokuapp.com/themes/default/icons/fonts/index.html) | `string` | `undefined` |
14
- | `size` | `size` | Tamanho do ícone | `string` | `'medium'` |
10
+ | Property | Attribute | Description | Type | Default |
11
+ | ---------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------- | ----------- |
12
+ | `href` | `href` | Define o endereço da imagem quando não contempladas na biblioteca de ícones. | `string` | `undefined` |
13
+ | `iconName` | `icon-name` | Define o ícone a ser usado da biblioteca de ícones: [ez-icons](https://sankhyalabs-storybook.herokuapp.com/themes/default/icons/fonts/index.html) | `string` | `undefined` |
14
+ | `size` | `size` | Define o tamanho do ícone. | `"large" \| "medium" \| "small" \| "x-large" \| "x-small"` | `"medium"` |
15
15
 
16
16
 
17
17
  ## Dependencies
@@ -48,3 +48,9 @@ graph TD;
48
48
  ----------------------------------------------
49
49
 
50
50
 
51
+
52
+
53
+ ## CSS Variables
54
+ | Variable | Description |
55
+ |-|-|
56
+ | --ez-icon--color | Define a cor do ícone. |
package/components/ez-list/readme.md CHANGED
@@ -7,27 +7,27 @@
7
7
 
8
8
  ## Properties
9
9
 
10
- | Property | Attribute | Description | Type | Default |
11
- | ----------------- | --------------- | -------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------- | ----------- |
12
- | `dataSource` | -- | Define a lista inicial do componente. | `any[]` | `[]` |
13
- | `ezDraggable` | `ez-draggable` | Define se o componente terá o comportamento de arrasto de linhas. | `boolean` | `false` |
14
- | `ezSelectable` | `ez-selectable` | Define se os items da lista serão selecionáveis. | `boolean` | `false` |
15
- | `itemSlotBuilder` | -- | Define se é possível selecionar mais de um registro. /** Função responsável por renderizar um conteúdo dentro do item da lista. | `(item: any, group?: any) => HTMLElement` | `undefined` |
16
- | `useGroups` | `use-groups` | Define se o componente renderizará os itens separados em grupos.. | `boolean` | `false` |
10
+ | Property | Attribute | Description | Type | Default |
11
+ | ----------------- | --------------- | -------------------------------------------------------------------- | ----------------------------------------- | ----------- |
12
+ | `dataSource` | -- | Define a lista inicial do componente. | `(ListGroup \| ListItem)[]` | `[]` |
13
+ | `ezDraggable` | `ez-draggable` | Se true habilita `drag and drop` para os itens. | `boolean` | `false` |
14
+ | `ezSelectable` | `ez-selectable` | Se true os itens serão selecionáveis. | `boolean` | `false` |
15
+ | `itemSlotBuilder` | -- | Define um `builder` para construir o `HTMLElement` do item da lista. | `(item: any, group?: any) => HTMLElement` | `undefined` |
16
+ | `useGroups` | `use-groups` | Se true os grupos serão exibidos. | `boolean` | `false` |
17
17
 
18
18
 
19
19
  ## Events
20
20
 
21
- | Event | Description | Type |
22
- | ---------- | ------------------------------------------------------------ | ---------------------------------------- |
23
- | `ezChange` | Evento disparado ao modificar ordenação nas linhas da grade. | `CustomEvent<ListGroup[] \| ListItem[]>` |
21
+ | Event | Description | Type |
22
+ | ---------- | ------------------------------------------------------- | ---------------------------------------- |
23
+ | `ezChange` | Emitido quando acontece a alteração de estado da lista. | `CustomEvent<(ListGroup \| ListItem)[]>` |
24
24
 
25
25
 
26
26
  ## Methods
27
27
 
28
28
  ### `clearHistory() => Promise<void>`
29
29
 
30
- Responsável por limpar a lista de histórico do componente.
30
+ Limpa o histórico da lista.
31
31
 
32
32
  #### Returns
33
33
 
@@ -35,29 +35,29 @@ Type: `Promise<void>`
35
35
 
36
36
 
37
37
 
38
- ### `getList() => Promise<ListItem[] | ListGroup[]>`
38
+ ### `getList() => Promise<Array<ListItem | ListGroup>>`
39
39
 
40
- Retorna a lista de items conforme o modo de uso.
40
+ Obtém a lista de items ou grupos.
41
41
 
42
42
  #### Returns
43
43
 
44
- Type: `Promise<ListItem[] | ListGroup[]>`
44
+ Type: `Promise<(ListGroup | ListItem)[]>`
45
45
 
46
46
 
47
47
 
48
- ### `getSelection() => Promise<any>`
48
+ ### `getSelection() => Promise<ListItem>`
49
49
 
50
- Retorna o item selecionado.
50
+ Obtém o item selecionado.
51
51
 
52
52
  #### Returns
53
53
 
54
- Type: `Promise<any>`
54
+ Type: `Promise<ListItem>`
55
55
 
56
56
 
57
57
 
58
58
  ### `scrollToTop() => Promise<void>`
59
59
 
60
- Responsável por dar um scroll top no componente da lista.
60
+ Traz o conteúdo da lista para a área visível.
61
61
 
62
62
  #### Returns
63
63
 
@@ -67,7 +67,7 @@ Type: `Promise<void>`
67
67
 
68
68
  ### `setSelection(selectedItem: ListItem, scrollToOption?: boolean) => Promise<void>`
69
69
 
70
- Recebe como argumento um ListItem {label: string} e um booleano que define se o componente deve fazer scroll para exibir o item específico (opcional).
70
+ Aplica seleção nas linhas da lista.
71
71
 
72
72
  #### Returns
73
73
 
@@ -79,3 +79,41 @@ Type: `Promise<void>`
79
79
  ----------------------------------------------
80
80
 
81
81
 
82
+
83
+
84
+ ## CSS Variables
85
+ | Variable | Description |
86
+ |-|-|
87
+ | --ez-list\_\_host--z-index | Define a camada de visibilidae do componente. |
88
+ | --ez-list\_\_host--border-radius | Define o raio da borda do componente. |
89
+ | --ez-list\_\_host--padding | Define o espaçamento entre a lista e o componente. |
90
+ | --ez-list\_\_icon--padding | Define o espaçamento interno do ícone. |
91
+ | --ez-list\_\_icon--color | Define a cor do ícone de arrasto do item da lista. |
92
+ | --ez-list\_\_item--margin | Define o espaçamento externo do item da lista. |
93
+ | --ez-list\_\_item--color | Define a cor do texto do item da lista. |
94
+ | --ez-list\_\_item--border-bottom | Define o estilo borda inferior do item da lista. |
95
+ | --ez-list\_\_item--border-color | Define a cor da borda inferior do item da lista. |
96
+ | --ez-list\_\_item--font-family | Define o estilo do texto do item da lista. |
97
+ | --ez-list\_\_item--font-size | Define o tamanho do texto do item da lista. |
98
+ | --ez-list\_\_selectable--padding-right | Define o espaçamento lateral direito para items selecionados. |
99
+ | --ez-list\_\_selectable--padding-left | Define o espaçamento lateral esquerdo para items selecionados. |
100
+ | --ez-list\_\_selected-item--border-radius | Define o raio da borda de items selecionados. |
101
+ | --ez-list\_\_selected-item--background-color | Define a cor de fundo de items selecionados. |
102
+ | --ez-list\_\_group--font-family | Define o estilo do texto do grupo da lista. |
103
+ | --ez-list\_\_group--font-size | Define o tamanho do texto do grupo da lista. |
104
+ | --ez-list\_\_group--font-weight | Define o peso do texto do grupo da lista. |
105
+ | --ez-list\_\_group--padding-bottom | Define o espaçamento inferior do grupo da lista. |
106
+ | --ez-list\_\_group-overlay--font-family | Define o estilo do texto da área de transferência de grupos. |
107
+ | --ez-list\_\_group-overlay--font-size | Define o tamanho do texto da área de transferência de grupos. |
108
+ | --ez-list\_\_group-container-scrollbar--border-radius | Define o raio da borda da barra de rolagem do container de grupos. |
109
+ | --ez-list\_\_group-container-scrollbar--width | Define a largura da barra de rolagem do container de grupos. |
110
+ | --ez-list\_\_group-container-scrollbar--background-color-primary | Define a cor da barra de rolagem do container de grupos. |
111
+ | --ez-list\_\_group-container-scrollbar--background-color-secondary | Define a cor de fundo da barra de rolagem do container de grupos. |
112
+ | --ez-list\_\_over--border--color | Define a cor da borda pontilhada sobre os elementos da lista. |
113
+ | --ez-list\_\_last-droppable-space--height | Define a altura do container para arrasto para última posição . |
114
+ | --ez-list\_\_draggable-scrollbar--border-radius | Define o raio da borda da barra de rolagem do componente. |
115
+ | --ez-list\_\_draggable-scrollbar--width | Define a largura da barra de rolagem do componente. |
116
+ | --ez-list\_\_draggable-scrollbar--background-color-primary | Define a cor da barra de rolagem do componente. |
117
+ | --ez-list\_\_draggable-scrollbar--background-color-secondary | Define a cor de fundo da barra de rolagem do componente. |
118
+ | --ez-list\_\_draggable-list--padding-bottom | Define o espaçamento do container de itens arrastáveis . |
119
+ | --ez-list\_\_draggable-icon--image | Define a imagem do ícone de drag. |
package/components/ez-loading-bar/readme.md CHANGED
@@ -9,7 +9,7 @@
9
9
 
10
10
  ### `hide() => Promise<void>`
11
11
 
12
-
12
+ Oculta o ez-loading-bar.
13
13
 
14
14
  #### Returns
15
15
 
@@ -19,7 +19,7 @@ Type: `Promise<void>`
19
19
 
20
20
  ### `show() => Promise<void>`
21
21
 
22
-
22
+ Exibe o ez-loading-bar.
23
23
 
24
24
  #### Returns
25
25
 
package/components/ez-modal/readme.md CHANGED
@@ -7,23 +7,30 @@
7
7
 
8
8
  ## Properties
9
9
 
10
- | Property | Attribute | Description | Type | Default |
11
- | ------------------- | --------------------- | ------------------------------------------------------------------------------------------------ | --------- | ----------- |
12
- | `align` | `align` | Define o alinhamento do modal. Seus valores podem ser "right" ou "left" | `string` | `undefined` |
13
- | `closeEsc` | `close-esc` | Define se o modal será fechado ao clicar ESC | `boolean` | `false` |
14
- | `closeOutsideClick` | `close-outside-click` | Define se o modal será fechado ao clicar fora do conteúdo. | `boolean` | `false` |
15
- | `modalSize` | `modal-size` | Define o tamanho do modal. Devem ser utilizados os tamanhos definidos de colunas como "col-sd-3" | `string` | `undefined` |
16
- | `opened` | `opened` | Controle de exibição do Modal | `boolean` | `true` |
10
+ | Property | Attribute | Description | Type | Default |
11
+ | ------------------- | --------------------- | -------------------------------------------------------------------------------------------- | ------------------- | ----------- |
12
+ | `align` | `align` | Define o alinhamento do ez-modal. | `"left" \| "right"` | `undefined` |
13
+ | `closeEsc` | `close-esc` | Define se o ez-modal será fechado ao clicar `ESC`. | `boolean` | `false` |
14
+ | `closeOutsideClick` | `close-outside-click` | Define se o modal será fechado ao clicar fora do conteúdo. | `boolean` | `false` |
15
+ | `modalSize` | `modal-size` | Define o tamanho do ez-modal. Devem ser definidas seguindo grid-layout. Exemplo: `col-sd-3`. | `string` | `undefined` |
16
+ | `opened` | `opened` | Define se o ez-modal está aberto. | `boolean` | `true` |
17
17
 
18
18
 
19
19
  ## Events
20
20
 
21
- | Event | Description | Type |
22
- | -------------- | -------------------------------------------------------------- | ---------------------- |
23
- | `ezCloseModal` | Um evento disparado quando o modal é fechado (onEzCloseModal). | `CustomEvent<boolean>` |
24
- | `ezOpenModal` | Um evento disparado quando o modal é aberto (onEzOpenModal). | `CustomEvent<any>` |
21
+ | Event | Description | Type |
22
+ | -------------- | --------------------------------- | ---------------------- |
23
+ | `ezCloseModal` | Emitido quando o modal é fechado. | `CustomEvent<boolean>` |
24
+ | `ezOpenModal` | Emitido quando o modal é aberto. | `CustomEvent<any>` |
25
25
 
26
26
 
27
27
  ----------------------------------------------
28
28
 
29
29
 
30
+
31
+
32
+ ## CSS Variables
33
+ | Variable | Description |
34
+ |-|-|
35
+ | --ez-modal-z-index | Define a camada em que o componente será exibido. |
36
+ | --ez-modal-vertical-padding | Define o espaçamento vertical do conteúdo do modal. |
package/components/ez-modal-container/readme.md CHANGED
@@ -7,15 +7,15 @@
7
7
 
8
8
  ## Properties
9
9
 
10
- | Property | Attribute | Description | Type | Default |
11
- | -------------------- | ---------------------- | -------------------------------------------------------------------- | --------- | ----------- |
12
- | `cancelButtonLabel` | `cancel-button-label` | Determina o texto do botão de cancelar | `string` | `undefined` |
13
- | `cancelButtonStatus` | `cancel-button-status` | Variação de estado do botão de cancelar: [HIDDEN\|ENABLED\|DISABLED] | `string` | `undefined` |
14
- | `modalSubTitle` | `modal-sub-title` | Subtítulo (opcional), geralmente usado para orientação do usuário | `string` | `undefined` |
15
- | `modalTitle` | `modal-title` | Título do modal | `string` | `undefined` |
16
- | `okButtonLabel` | `ok-button-label` | Determina o texto do botão de Ok | `string` | `undefined` |
17
- | `okButtonStatus` | `ok-button-status` | Variação de estado do botão de ok: [HIDDEN\|ENABLED\|DISABLED] | `string` | `undefined` |
18
- | `showTitleBar` | `show-title-bar` | Determina se o cabeçalho com o título deverá ser mostrado | `boolean` | `true` |
10
+ | Property | Attribute | Description | Type | Default |
11
+ | -------------------- | ---------------------- | ---------------------------------------------------------------- | ------------------------------------- | ----------- |
12
+ | `cancelButtonLabel` | `cancel-button-label` | Define o texto do botão de cancelamento. | `string` | `undefined` |
13
+ | `cancelButtonStatus` | `cancel-button-status` | Define o estado do botão de cancelamento. | `"DISABLED" \| "ENABLED" \| "HIDDEN"` | `undefined` |
14
+ | `modalSubTitle` | `modal-sub-title` | Texto do subtítulo, geralmente usado para orientação do usuário. | `string` | `undefined` |
15
+ | `modalTitle` | `modal-title` | Texto a ser apresentado como título do modal. | `string` | `undefined` |
16
+ | `okButtonLabel` | `ok-button-label` | Determina o texto do botão de confirmação. | `string` | `undefined` |
17
+ | `okButtonStatus` | `ok-button-status` | Define o estado do botão de confirmação. | `"DISABLED" \| "ENABLED" \| "HIDDEN"` | `undefined` |
18
+ | `showTitleBar` | `show-title-bar` | Define se o cabeçalho será mostrado. | `boolean` | `true` |
19
19
 
20
20
 
21
21
  ## Events
package/components/ez-number-input/readme.md CHANGED
@@ -7,31 +7,31 @@
7
7
 
8
8
  ## Properties
9
9
 
10
- | Property | Attribute | Description | Type | Default |
11
- | ----------------- | ------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------- | ----------- |
12
- | `enabled` | `enabled` | Deixa o campo disponível ou não para uso. | `boolean` | `true` |
13
- | `errorMessage` | `error-message` | Quando há um problema de validação, serve como orientação ao usuário | `string` | `undefined` |
14
- | `label` | `label` | Título do campo | `string` | `undefined` |
15
- | `mode` | `mode` | Define o modo do tamanho do campo; opções: slim e regular. | `string` | `"regular"` |
16
- | `precision` | `precision` | Precisão decimal, ou seja, quantas casas decimais podem ser exibidas. Caso a quantidade de casas decimais do valor seja maior que precision, haverá arredondamento | `number` | `undefined` |
17
- | `prettyPrecision` | `pretty-precision` | Esse atributo determina qual é o número mínimo de casas depois da vírgula. Exemplo: Digamos que a precision seja igual a 4, assim qualquer número será representado com 4 casas decimais mesmo que iguais a zero: 1,0100. Se prettiprecision igual a 2, como não há necessidade de mais de duas casas decimais o valor exibido será 1,01. Por outro lado, até a quarta casa não haverá arredondamento (1,1234 = 1,1234) mas a partir da quinta casa sim (1,12345 = 1,1235). | `number` | `undefined` |
18
- | `value` | `value` | O valor informado pelo usuário | `number` | `undefined` |
10
+ | Property | Attribute | Description | Type | Default |
11
+ | ----------------- | ------------------ | ---------------------------------------------------------------------------------------------------------------------- | --------------------- | ----------- |
12
+ | `enabled` | `enabled` | Se false, o usuário não pode interagir com o campo. | `boolean` | `true` |
13
+ | `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
14
+ | `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined` |
15
+ | `mode` | `mode` | Define o tamanho do campo. | `"regular" \| "slim"` | `"regular"` |
16
+ | `precision` | `precision` | Define quantas casas decimais serão exibidas. Caso haja mais casas haverá arredondamento. | `number` | `undefined` |
17
+ | `prettyPrecision` | `pretty-precision` | Define qual é o mínimo de casas depois da vírgula. Exemplo: 1,1 será exibido como 1,1000 quando `prettyPrecision = 4`. | `number` | `undefined` |
18
+ | `value` | `value` | Define o valor do campo. | `number` | `undefined` |
19
19
 
20
20
 
21
21
  ## Events
22
22
 
23
- | Event | Description | Type |
24
- | ----------------------- | ----------------------------------------------------------------------------------------------------------------------------- | ---------------------------- |
25
- | `ezCancelWaitingChange` | Entre o evento ezStartChange e ezChange, se por algum motivo não foi possível completar a alteração, esse evento é disparado. | `CustomEvent<void>` |
26
- | `ezChange` | Evento disparado quando o estado do componente é alterado (onEzChange). | `CustomEvent<number>` |
27
- | `ezStartChange` | Evento emitido ao iniciar a alteração (remover ou adicionar um arquivo). | `CustomEvent<WaitingChange>` |
23
+ | Event | Description | Type |
24
+ | ----------------------- | ---------------------------------------------------------------------------------------------- | ---------------------------- |
25
+ | `ezCancelWaitingChange` | Emitido quando não foi possível completar a alteração entre o evento ezStartChange e ezChange. | `CustomEvent<void>` |
26
+ | `ezChange` | Emitido quando acontece a alteração de valor do campo. | `CustomEvent<number>` |
27
+ | `ezStartChange` | Emitido ao iniciar a alteração (digitação incompleta). | `CustomEvent<WaitingChange>` |
28
28
 
29
29
 
30
30
  ## Methods
31
31
 
32
32
  ### `isInvalid() => Promise<boolean>`
33
33
 
34
- Retorna informando se o campo está inválido (true | false)
34
+ Retorna se o conteúdo é inválido.
35
35
 
36
36
  #### Returns
37
37
 
@@ -41,7 +41,7 @@ Type: `Promise<boolean>`
41
41
 
42
42
  ### `setBlur() => Promise<void>`
43
43
 
44
- Remove o foco no componente de input
44
+ Remove o foco do campo.
45
45
 
46
46
  #### Returns
47
47
 
@@ -51,7 +51,7 @@ Type: `Promise<void>`
51
51
 
52
52
  ### `setFocus() => Promise<void>`
53
53
 
54
- Realiza o foco no componente de input
54
+ Aplica o foco no campo.
55
55
 
56
56
  #### Returns
57
57
 
package/components/ez-popover/readme.md CHANGED
@@ -7,30 +7,30 @@
7
7
 
8
8
  ## Properties
9
9
 
10
- | Property | Attribute | Description | Type | Default |
11
- | -------------- | --------------- | --------------------------------------------------------------------------------------------- | -------------------- | --------------- |
12
- | `autoClose` | `auto-close` | No modo floating = false o popover só se tornará visível quando o método show() for acionado. | `boolean` | `true` |
13
- | `bottom` | `bottom` | Offset bottom do popover em relação ao componente pai | `string` | `"0px"` |
14
- | `boxWidth` | `box-width` | Ajusta o comportamento da largura do popover. Opções: "100% e "fit-content" (default) | `string` | `"fit-content"` |
15
- | `innerElement` | `inner-element` | Array de componente(s) que irá(ão) abrir o popover. | `string \| string[]` | `undefined` |
16
- | `left` | `left` | Offset left do popover em relação ao componente pai | `string` | `"0px"` |
17
- | `opened` | `opened` | Externaliza estado atual do componente. | `boolean` | `undefined` |
18
- | `right` | `right` | Offset right do popover em relação ao componente pai | `string` | `"0px"` |
19
- | `top` | `top` | Offset top do popover em relação ao componente pai | `string` | `"0px"` |
10
+ | Property | Attribute | Description | Type | Default |
11
+ | -------------- | --------------- | --------------------------------------------------------------------------------- | ------------------------------- | --------------- |
12
+ | `autoClose` | `auto-close` | Define que será fechado automaticamente quando o usuário clicar fora do conteúdo. | `boolean` | `true` |
13
+ | `bottom` | `bottom` | Define a distância de baixo. Devem ser usados valores válidos de CSS. | `string` | `"0px"` |
14
+ | `boxWidth` | `box-width` | Ajusta o comportamento da largura do popover. | `"fit-content" \| "full-width"` | `"fit-content"` |
15
+ | `innerElement` | `inner-element` | Define as tags que serão consideradas conteúdo. | `string \| string[]` | `undefined` |
16
+ | `left` | `left` | Define a distância do lado esquerdo. Devem ser usados valores válidos de CSS. | `string` | `"0px"` |
17
+ | `opened` | `opened` | Define se o ez-popover está aberto. | `boolean` | `undefined` |
18
+ | `right` | `right` | Define a distância do lado direito. Devem ser usados valores válidos de CSS. | `string` | `"0px"` |
19
+ | `top` | `top` | Define a distância do topo. Devem ser usados valores válidos de CSS. | `string` | `"0px"` |
20
20
 
21
21
 
22
22
  ## Events
23
23
 
24
- | Event | Description | Type |
25
- | -------------------- | ------------------------------------------------- | ---------------------- |
26
- | `ezVisibilityChange` | Evento disparado ao exibir/ocultar o componente. | `CustomEvent<boolean>` |
24
+ | Event | Description | Type |
25
+ | -------------------- | ------------------------------------------------------------ | ---------------------- |
26
+ | `ezVisibilityChange` | Emitido quando acontece a alteração de estado do componente. | `CustomEvent<boolean>` |
27
27
 
28
28
 
29
29
  ## Methods
30
30
 
31
31
  ### `hide() => Promise<void>`
32
32
 
33
- Usado no modo floating. Faz com que o componente seja ocultado.
33
+ Oculta o ez-popover.
34
34
 
35
35
  #### Returns
36
36
 
@@ -40,7 +40,7 @@ Type: `Promise<void>`
40
40
 
41
41
  ### `show(top?: string, left?: string, bottom?: string, right?: string) => Promise<void>`
42
42
 
43
- Faz com que o popover seja renderizado na DOM.
43
+ Exibe o ez-popover.
44
44
 
45
45
  #### Returns
46
46
 
@@ -50,7 +50,7 @@ Type: `Promise<void>`
50
50
 
51
51
  ### `updatePosition(top?: string, left?: string, bottom?: string, right?: string) => Promise<void>`
52
52
 
53
- Atualiza a posição do popover em relação ao componente pai.
53
+ Atualiza a posição do popover.
54
54
 
55
55
  #### Returns
56
56
 
@@ -62,3 +62,12 @@ Type: `Promise<void>`
62
62
  ----------------------------------------------
63
63
 
64
64
 
65
+
66
+
67
+ ## CSS Variables
68
+ | Variable | Description |
69
+ |-|-|
70
+ | --ez-popover\_\_box--border-radius | Define o raio da borda do popover. |
71
+ | --ez-popover\_\_box--box-shadow | Define a sombra do popover. |
72
+ | --ez-popover\_\_box--background-color | Define a cor de fundo do popover. |
73
+ | --ez-popover\_\_box--z-index | Define a camada de visibilidade do popover. |
package/components/ez-popup/readme.md CHANGED
@@ -7,22 +7,37 @@
7
7
 
8
8
  ## Properties
9
9
 
10
- | Property | Attribute | Description | Type | Default |
11
- | ------------ | ------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | --------- | ----------- |
12
- | `ezTitle` | `ez-title` | Título do componente. | `string` | `undefined` |
13
- | `heightMode` | `height-mode` | Define se o componente utilizará um cabeçalho com botão de fechamento. | `string` | `"full"` |
14
- | `opened` | `opened` | Controla a exibição do componente. | `boolean` | `false` |
15
- | `size` | `size` | Define o width que o componente deve ter, seguindo o grid system. Os valores devem estar compreendidos em [x-small \| small \| medium \| large \| x-large]. | `string` | `"medium"` |
16
- | `useHeader` | `use-header` | Define se o componente utilizará um cabeçalho com botão de fechamento. | `boolean` | `true` |
10
+ | Property | Attribute | Description | Type | Default |
11
+ | ------------ | ------------- | -------------------------------------------------- | ---------------------------------------------------------- | ----------- |
12
+ | `ezTitle` | `ez-title` | Texto a ser apresentado como título do componente. | `string` | `undefined` |
13
+ | `heightMode` | `height-mode` | Define altura do componente. | `"auto" \| "full"` | `"full"` |
14
+ | `opened` | `opened` | Define se o ez-popover está aberto. | `boolean` | `false` |
15
+ | `size` | `size` | Define a largura do ez-popup. | `"large" \| "medium" \| "small" \| "x-large" \| "x-small"` | `"medium"` |
16
+ | `useHeader` | `use-header` | Define se o componente utilizará cabeçalho. | `boolean` | `true` |
17
17
 
18
18
 
19
19
  ## Events
20
20
 
21
- | Event | Description | Type |
22
- | -------------- | --------------------------------------------------------------- | ------------------ |
23
- | `ezClosePopup` | Evento disparado ao clicar no botão de fechar (onEzClosePopup). | `CustomEvent<any>` |
21
+ | Event | Description | Type |
22
+ | -------------- | ------------------------------------------------------ | ------------------ |
23
+ | `ezClosePopup` | Emitido ao clicar no botão de fechar (onEzClosePopup). | `CustomEvent<any>` |
24
24
 
25
25
 
26
26
  ----------------------------------------------
27
27
 
28
28
 
29
+
30
+
31
+ ## CSS Variables
32
+ | Variable | Description |
33
+ |-|-|
34
+ | --ez-popup-z-index | Define a camada em que o componente será exibido. |
35
+ | --ez-popup\_\_container--color | Define a cor do texto do container do popup. |
36
+ | --ez-popup\_\_container--padding | Define o espaçamento do container do popup. |
37
+ | --ez-popup\_\_header--padding-bottom | Define o espaçamento inferior do cabeçalho do popup. |
38
+ | --ez-popup\_\_title--font-family | Define a família da fonte do título do popup. |
39
+ | --ez-popup\_\_title--font-size | Define o tamanho da fonte do título do popup. |
40
+ | --ez-popup\_\_title--color | Define a cor da fonte do título do popup. |
41
+ | --ez-popup\_\_title--font-weight | Define o peso da fonte do título do popup. |
42
+ | --ez-popup\_\_btn\_\_close--icon-color | Define a cor do ícone do botão de fechamento. |
43
+ | --ez-popup\_\_btn\_\_close--icon | Contém o ícone do botão de fechamento. |
package/components/ez-radio-button/readme.md CHANGED
@@ -7,22 +7,52 @@
7
7
 
8
8
  ## Properties
9
9
 
10
- | Property | Attribute | Description | Type | Default |
11
- | ----------- | ----------- | --------------------------------------------------------------------------------------- | ---------------------------- | ------------ |
12
- | `direction` | `direction` | Define a direção em que os itens são apresentadoss, podendo ser horizontal ou vertical. | `"horizontal" \| "vertical"` | `"vertical"` |
13
- | `enabled` | `enabled` | Define se o componente está habilitado ou desabilitado | `boolean` | `true` |
14
- | `label` | `label` | Determina a descrição do grupo | `string` | `undefined` |
15
- | `options` | -- | Define as opções que serão apresentadas | `Radio[]` | `[]` |
16
- | `value` | `value` | Representa o valor atualmente selecionado entre as opções | `any` | `undefined` |
10
+ | Property | Attribute | Description | Type | Default |
11
+ | ----------- | ----------- | -------------------------------------------------- | ---------------------------- | ------------ |
12
+ | `direction` | `direction` | Define a direção dos itens. | `"horizontal" \| "vertical"` | `"vertical"` |
13
+ | `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
14
+ | `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined` |
15
+ | `options` | -- | Define as opções que serão apresentadas | `Radio[]` | `[]` |
16
+ | `value` | `value` | Define o valor do campo. | `any` | `undefined` |
17
17
 
18
18
 
19
19
  ## Events
20
20
 
21
- | Event | Description | Type |
22
- | ---------- | ------------------------------------------------- | ------------------ |
23
- | `ezChange` | Evento disparado quando uma opção for selecionada | `CustomEvent<any>` |
21
+ | Event | Description | Type |
22
+ | ---------- | ------------------------------------------------------ | ------------------ |
23
+ | `ezChange` | Emitido quando acontece a alteração de valor do campo. | `CustomEvent<any>` |
24
24
 
25
25
 
26
26
  ----------------------------------------------
27
27
 
28
28
 
29
+
30
+
31
+ ## CSS Variables
32
+ | Variable | Description |
33
+ |-|-|
34
+ | --ez-radio-button--font-family | Define a família da fonte do label. |
35
+ | --ez-radio-button--font-size | Define o tamanho do label. |
36
+ | --ez-radio-button--font-weight | Define o peso da fonte do label. |
37
+ | --ez-radio-button--font-color | Define a cor do texto. |
38
+ | --ez-radio-button--padding-vertical | Define o espaço superior e inferior da lista de opções. |
39
+ | --ez-radio-button--padding-horizontal | Define o espaço lateral da lista de opções. |
40
+ | --ez-radio-button\_\_form-label--font-family | Define a família da fonte do label. |
41
+ | --ez-radio-button\_\_form-label--font-weight | Define o peso da fonte do label. |
42
+ | --ez-radio-button\_\_form-label--title-primary | Define a cor do texto. |
43
+ | --ez-radio-button\_\_form-label--font-size | Define o tamanho do label. |
44
+ | --ez-radio-button\_\_form-label--padding-horizontal | Define o espaço lateral da lista de opções. |
45
+ | --ez-radio-button\_\_form-radio--border-color | cor da borda do radio sem seleção (sem seleção / sem foco / sem hover / enabled) |
46
+ | --ez-radio-button\_\_form-radio--checked--color | cor do radio selecionado (com seleção / sem foco / sem hover / enabled) |
47
+ | --ez-radio-button\_\_form-radio--disabled--border-color | cor da borda do radio quando está desativado (sem seleção / sem foco / sem hover / disabled) |
48
+ | --ez-radio-button\_\_form-radio--disabled--background-color | cor do background do radio quando está desativado (sem seleção / sem foco / sem hover / disabled) |
49
+ | --ez-radio-button\_\_form-radio--disabled--color | cor da label quando o radio está desativado (sem seleção / sem foco / sem hover / disabled) |
50
+ | --ez-radio-button\_\_form-radio--disabled--before--background-color | cor do centro do radio quando o radio está desativado (com seleção / sem foco / sem hover / disabled) |
51
+ | --ez-radio-button\_\_form-radio--focus--background-color | cor do background quando o radio está ativado e sem seleção (sem seleção / com foco / sem hover / enabled) |
52
+ | --ez-radio-button\_\_form-radio--checked--box-shadow-color | cor do box-shadow quando o radio está ativado e sem seleção (sem seleção / com foco / sem hover / enabled) |
53
+ | --ez-radio-button\_\_form-radio--checked--focus--background-color | cor do background quando o radio está marcado e com foco (com seleção / com foco / sem hover / enabled) |
54
+ | --ez-radio-button\_\_form-radio--checked--focus--box-shadow-color | cor do background quando o radio está marcado e com foco (com seleção / com foco / sem hover / enabled) |
55
+ | --ez-radio-button\_\_form-radio--checked--hover--background-color | cor do background quando o radio está marcado, com foco e com hover (com seleção / com foco / com hover / enabled) |
56
+ | --ez-radio-button\_\_form-radio--checked--hover--box-shadow-color | cor do box-shadow quando o radio está marcado, com foco e com hover (com seleção / com foco / com hover / enabled) |
57
+ | --ez-radio-button\_\_form-radio--hover--box-shadow-color | cor do hover quando o radio está desmarcado (sem seleção / sem foco / com hover / enabled) |
58
+ | --ez-radio-button\_\_form-radio--checked--disabled--hover--background-color | cor do fundo quando o radio está marcado e desativado (com seleção / sem foco / com hover / disabled) |
package/components/ez-scroller/readme.md CHANGED
@@ -7,13 +7,19 @@
7
7
 
8
8
  ## Properties
9
9
 
10
- | Property | Attribute | Description | Type | Default |
11
- | -------------- | --------------- | ----------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------- | ------------------------ |
12
- | `activeShadow` | `active-shadow` | Determina de o efeito de sombreado está ativo. | `boolean` | `false` |
13
- | `direction` | `direction` | Determina se haverá scroll na direção Vertical, Horizontal ou Ambos. Por padrão, a direção é "Ambos". | `EzScrollDirection.BOTH \| EzScrollDirection.HORIZONTAL \| EzScrollDirection.VERTICAL` | `EzScrollDirection.BOTH` |
14
- | `locked` | `locked` | Determina se o scroll estará bloqueado quando necessário. | `boolean` | `false` |
10
+ | Property | Attribute | Description | Type | Default |
11
+ | -------------- | --------------- | -------------------------------------- | -------------------------------------------------------------------------------------- | ----------- |
12
+ | `activeShadow` | `active-shadow` | Define se haverá efeito de sombreado. | `boolean` | `false` |
13
+ | `direction` | `direction` | Define a direção em que haverá scroll. | `EzScrollDirection.BOTH \| EzScrollDirection.HORIZONTAL \| EzScrollDirection.VERTICAL` | `undefined` |
14
+ | `locked` | `locked` | Define se o `scroll` estará bloqueado. | `boolean` | `false` |
15
15
 
16
16
 
17
17
  ----------------------------------------------
18
18
 
19
19
 
20
+
21
+
22
+ ## CSS Variables
23
+ | Variable | Description |
24
+ |-|-|
25
+ | --ez-scroller--box-shadow-color | Define a cor de efeito de sombreado com componente. |