@sankhyalabs/ezui-docs 6.4.4 → 6.5.0-dev.10
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.
- package/components/ez-actions-button/readme.md +2 -2
- package/components/ez-avatar/readme.md +1 -0
- package/components/ez-button/readme.md +33 -15
- package/components/ez-calendar/readme.md +3 -3
- package/components/ez-check/readme.md +3 -1
- package/components/ez-chip/readme.md +38 -22
- package/components/ez-classic-combo-box/readme.md +4 -4
- package/components/ez-classic-input/readme.md +1 -1
- package/components/ez-classic-text-area/readme.md +1 -1
- package/components/ez-collapsible-box/readme.md +2 -2
- package/components/ez-combo-box/ez-combo-box-list/readme.md +13 -13
- package/components/ez-combo-box/readme.md +27 -26
- package/components/ez-date-input/readme.md +3 -3
- package/components/ez-date-time-input/readme.md +3 -3
- package/components/ez-filter-input/readme.md +4 -4
- package/components/ez-form/readme.md +28 -2
- package/components/ez-form-view/custom-input/readme.md +2 -2
- package/components/ez-form-view/readme.md +29 -2
- package/components/ez-grid/readme.md +20 -20
- package/components/ez-grid/subcomponents/readme.md +1 -1
- package/components/ez-guide-navigator/readme.md +8 -6
- package/components/ez-icon/readme.md +8 -0
- package/components/ez-list/readme.md +5 -5
- package/components/ez-list-item/readme.md +43 -0
- package/components/ez-loading-bar/readme.md +1 -1
- package/components/ez-modal-container/readme.md +7 -0
- package/components/ez-number-input/readme.md +3 -3
- package/components/ez-pagination/readme.md +57 -0
- package/components/ez-popover/readme.md +3 -3
- package/components/ez-popover-plus/readme.md +5 -5
- package/components/ez-popover-plus/subcomponent/readme.md +5 -5
- package/components/ez-popup/readme.md +32 -12
- package/components/ez-rich-text/ez-link-builder/readme.md +70 -0
- package/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar-arrows/readme.md +29 -0
- package/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar-configs/readme.md +29 -0
- package/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar-item/readme.md +49 -0
- package/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar-letters/readme.md +29 -0
- package/components/ez-rich-text/ez-rich-toolbar/readme.md +54 -0
- package/components/ez-rich-text/ez-simple-image-uploader/readme.md +79 -0
- package/components/ez-rich-text/readme.md +122 -0
- package/components/ez-search/readme.md +4 -4
- package/components/ez-search/subcomponent/search-list/readme.md +1 -1
- package/components/ez-search-plus/readme.md +4 -4
- package/components/ez-search-plus/subcomponent/ez-search-result-list/readme.md +3 -3
- package/components/ez-sidebar-navigator/readme.md +2 -2
- package/components/ez-sortable-list/readme.md +16 -16
- package/components/ez-spinner/readme.md +27 -0
- package/components/ez-split-button/readme.md +35 -25
- package/components/ez-tag-input/readme.md +132 -0
- package/components/ez-text-area/readme.md +19 -5
- package/components/ez-text-input/readme.md +6 -2
- package/components/ez-tile/readme.md +1 -1
- package/components/ez-tile-medium/readme.md +1 -1
- package/components/ez-time-input/readme.md +2 -2
- package/components/ez-tooltip/readme.md +6 -0
- package/components/ez-tree/readme.md +28 -6
- package/components/ez-upload/readme.md +2 -2
- package/components/ez-view-stack/readme.md +1 -1
- package/package.json +1 -1
|
@@ -39,7 +39,7 @@ Oculta a lista de ações.
|
|
|
39
39
|
|
|
40
40
|
Type: `Promise<void>`
|
|
41
41
|
|
|
42
|
-
|
|
42
|
+
---
|
|
43
43
|
|
|
44
44
|
### `isOpened() => Promise<boolean>`
|
|
45
45
|
|
|
@@ -49,7 +49,7 @@ Verifica se a lista de ações está aberta.
|
|
|
49
49
|
|
|
50
50
|
Type: `Promise<boolean>`
|
|
51
51
|
|
|
52
|
-
|
|
52
|
+
---
|
|
53
53
|
|
|
54
54
|
### `showActions() => Promise<void>`
|
|
55
55
|
|
|
@@ -9,6 +9,7 @@
|
|
|
9
9
|
|
|
10
10
|
| Property | Attribute | Description | Type | Default |
|
|
11
11
|
| --------------- | ---------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------- | ----------- |
|
|
12
|
+
| `iconName` | `icon-name` | Nome do ícone que deve ser exibido no avatar. | `string` | `undefined` |
|
|
12
13
|
| `imageSrc` | `image-src` | URL da imagem do Avatar. | `string` | `undefined` |
|
|
13
14
|
| `isInteractive` | `is-interactive` | Se true, o Avatar será interativo. Caso contrário, será estático. | `boolean` | `false` |
|
|
14
15
|
| `name` | `name` | Nome do usuário para exibição da inicial. | `string` | `undefined` |
|
|
@@ -7,14 +7,20 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property
|
|
11
|
-
|
|
|
12
|
-
| `enabled`
|
|
13
|
-
| `iconName`
|
|
14
|
-
| `image`
|
|
15
|
-
| `
|
|
16
|
-
| `
|
|
17
|
-
| `
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ------------------- | -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------- | ----------- |
|
|
12
|
+
| `enabled` | `enabled` | ⚠️ **[DEPRECATED]** Use `isDisabled` prop instead.Se false o usuário não pode interagir com o botão. | `boolean` | `true` |
|
|
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
|
+
| `image` | `image` | Define o caminho usado nos modos `icon` e `label-icon` para imagens não contempladas na biblioteca de ícones. | `string` | `undefined` |
|
|
15
|
+
| `isDisabled` | `is-disabled` | Se verdadeiro o clique no botão fica desabilitado mas a navegação continua funcional. Se full, o usuário não pode interagir com o botão. | `"" \| "full" \| boolean` | `false` |
|
|
16
|
+
| `label` | `label` | Texto a ser apresentado como título do botão. | `string` | `undefined` |
|
|
17
|
+
| `leftIconName` | `left-icon-name` | Define o ícone esquerdo do ez-button. Tem prioridade sobre o slot `leftIcon`. | `string` | `undefined` |
|
|
18
|
+
| `mode` | `mode` | Define o modo de uso do botão. | `"icon" \| "label-icon" \| "link" \| "regular"` | `"regular"` |
|
|
19
|
+
| `rightIconName` | `right-icon-name` | Define o ícone direto do ez-button. Tem prioridade sobre o slot `rightIcon`. | `string` | `undefined` |
|
|
20
|
+
| `size` | `size` | Define o tamanho do ez-button. | `"large" \| "medium" \| "small" \| "x-small"` | `"medium"` |
|
|
21
|
+
| `suppressAnimation` | `suppress-animation` | Se verdadeiro, desabilita a animação de ripple. | `boolean` | `false` |
|
|
22
|
+
| `type` | `type` | Define o tipo do botão. Pode ser `button`, `submit` ou `reset`. | `string` | `"button"` |
|
|
23
|
+
| `variant` | `variant` | Define a variante do ez-button. | `"primary" \| "secondary" \| "tertiary"` | `undefined` |
|
|
18
24
|
|
|
19
25
|
|
|
20
26
|
## Methods
|
|
@@ -27,7 +33,7 @@ Remove o foco do botão.
|
|
|
27
33
|
|
|
28
34
|
Type: `Promise<void>`
|
|
29
35
|
|
|
30
|
-
|
|
36
|
+
---
|
|
31
37
|
|
|
32
38
|
### `setFocus() => Promise<void>`
|
|
33
39
|
|
|
@@ -51,6 +57,8 @@ Type: `Promise<void>`
|
|
|
51
57
|
- [ez-grid](../ez-grid)
|
|
52
58
|
- [ez-guide-navigator](../ez-guide-navigator)
|
|
53
59
|
- [ez-modal-container](../ez-modal-container)
|
|
60
|
+
- [ez-pagination](../ez-pagination)
|
|
61
|
+
- [ez-popup](../ez-popup)
|
|
54
62
|
- [ez-sidebar-navigator](../ez-sidebar-navigator)
|
|
55
63
|
- [ez-split-item](../ez-split-panel/structure/item)
|
|
56
64
|
- [ez-text-edit](../ez-text-edit)
|
|
@@ -72,6 +80,8 @@ graph TD;
|
|
|
72
80
|
ez-grid --> ez-button
|
|
73
81
|
ez-guide-navigator --> ez-button
|
|
74
82
|
ez-modal-container --> ez-button
|
|
83
|
+
ez-pagination --> ez-button
|
|
84
|
+
ez-popup --> ez-button
|
|
75
85
|
ez-sidebar-navigator --> ez-button
|
|
76
86
|
ez-split-item --> ez-button
|
|
77
87
|
ez-text-edit --> ez-button
|
|
@@ -91,30 +101,38 @@ graph TD;
|
|
|
91
101
|
| --ez-button--min-width | Define a largura mínima do componente. |
|
|
92
102
|
| --ez-button--width | Define a largura do componente. |
|
|
93
103
|
| --ez-button--height | Define a altura do componente. |
|
|
94
|
-
| --ez-button\_\_icon--width | Define a largura do slot que contém o ícone. |
|
|
95
|
-
| --ez-button\_\_inline\_\_icon--padding | Define o espaçamento entre o ícone e o label. |
|
|
96
104
|
| --ez-button--padding-top | Define o espaçamento superior ao label. |
|
|
97
105
|
| --ez-button--padding-bottom | Define o espaçamento inferior ao label. |
|
|
98
106
|
| --ez-button--padding-right | Define o espaçamento à direita do label. |
|
|
99
107
|
| --ez-button--padding-left | Define o espaçamento à esquerda do label. |
|
|
108
|
+
| --ez-button--icon--gap | Define o gap entre o texto e ícone, quando existir. |
|
|
100
109
|
| --ez-button--color | Define a cor do label. |
|
|
110
|
+
| --ez-button--label-icon--color | Define a cor do label do botao tipo label-icon. |
|
|
111
|
+
| --ez-button--label-icon--hover-color | Define a cor do label do botao tipo label-icon, quando o mouse sobre o botão. |
|
|
112
|
+
| --ez-button--label-icon--disabled-color | Define a cor do label do botao tipo label-icon, quando desabilitado. |
|
|
113
|
+
| --ez-button--left-icon--color | Define a cor do icone esquerdo. |
|
|
114
|
+
| --ez-button--right-icon--color | Define a cor do icone direito, quando o mouse está sobre o botão. |
|
|
115
|
+
| --ez-button--left-icon--hover-color | Define a cor do icone esquerdo. |
|
|
116
|
+
| --ez-button--right-icon--hover-color | Define a cor do icone direito, quando o mouse está sobre o botão. |
|
|
117
|
+
| --ez-button--left-icon--disabled-color | Define a cor do icone esquerdo, quando desabilitado. |
|
|
118
|
+
| --ez-button--right-icon--disabled-color | Define a cor do icone direito, quando desabilitado. |
|
|
101
119
|
| --ez-button--font-size | Define o tamanho do label. |
|
|
102
120
|
| --ez-button--font-family | Define a família da fonte do label. |
|
|
103
121
|
| --ez-button--font-weight | Define o peso da fonte do label. |
|
|
104
122
|
| --ez-button--background-color | Define a cor de fundo do botão. |
|
|
105
123
|
| --ez-button--border-radius | Define o raio da borda do botão. |
|
|
106
124
|
| --ez-button--border | Define o estilo da borda do botão. |
|
|
125
|
+
| --ez-button--hover--border | Define o estilo da borda do botão quando em hover. |
|
|
107
126
|
| --ez-button--justify-content | Define o alinhamento horizontal do conteúdo do botão. |
|
|
108
127
|
| --ez-button--hover-color | Define a cor do texto e do ícone quando o cursor está sobre o botão. |
|
|
109
128
|
| --ez-button--hover--background-color | Define a cor de fundo quando o cursor está sobre o botão. |
|
|
110
129
|
| --ez-button--disabled-color | Define a cor do texto quando o botão está desabilitado. |
|
|
111
130
|
| --ez-button--disabled--background-color | Define a cor de fundo quando o botão está desabilitado. |
|
|
112
|
-
| --ez-button--
|
|
113
|
-
| --ez-button--
|
|
114
|
-
| --ez-button--active-color | Define a cor do texto e do ícone ao ativar o botão. |
|
|
115
|
-
| --ez-button--active--background-color | Define a cor do fundo ao ativar o botão. |
|
|
131
|
+
| --ez-button--disabled--border | Define a cor da borda quando o botão está desabilitado. |
|
|
132
|
+
| --ez-button--disabled-icon-color | Define a cor do icone quando o botão está desabilitado. |
|
|
116
133
|
| --ez-button--link-color | Define a cor do texto do botão no modo link. |
|
|
117
134
|
| --ez-button--link--hover-color | Define a cor do texto do botão no hover do modo link. |
|
|
135
|
+
| --ez-button--link-disabled-color | Define a cor do texto do botão no hover do modo link, quando desabilitado. |
|
|
118
136
|
| --ez-button--link--small--font-size | Define o tamanho small na fonte do texto do botão no modo link. |
|
|
119
137
|
| --ez-button--link--medium--font-size | Define o tamanho medium na fonte do texto do botão no modo link. |
|
|
120
138
|
| --ez-button--link--large--font-size | Define o tamanho large na fonte do texto do botão no modo link. |
|
|
@@ -32,7 +32,7 @@ Ajusta o posicionamento horizontal do ez-calendar conforme a disponibilidade de
|
|
|
32
32
|
|
|
33
33
|
Type: `Promise<void>`
|
|
34
34
|
|
|
35
|
-
|
|
35
|
+
---
|
|
36
36
|
|
|
37
37
|
### `fitVertical(topOffset: number, bottomOffset: number) => Promise<void>`
|
|
38
38
|
|
|
@@ -42,7 +42,7 @@ Ajusta o posicionamento vertical do ez-calendar conforme a disponibilidade de es
|
|
|
42
42
|
|
|
43
43
|
Type: `Promise<void>`
|
|
44
44
|
|
|
45
|
-
|
|
45
|
+
---
|
|
46
46
|
|
|
47
47
|
### `hide() => Promise<void>`
|
|
48
48
|
|
|
@@ -52,7 +52,7 @@ Oculta o ez-calendar.
|
|
|
52
52
|
|
|
53
53
|
Type: `Promise<void>`
|
|
54
54
|
|
|
55
|
-
|
|
55
|
+
---
|
|
56
56
|
|
|
57
57
|
### `show(top?: string, left?: string, bottom?: string, right?: string) => Promise<void>`
|
|
58
58
|
|
|
@@ -35,7 +35,7 @@ Obtém o modo escolhido.
|
|
|
35
35
|
|
|
36
36
|
Type: `Promise<CheckMode>`
|
|
37
37
|
|
|
38
|
-
|
|
38
|
+
---
|
|
39
39
|
|
|
40
40
|
### `setFocus() => Promise<void>`
|
|
41
41
|
|
|
@@ -53,6 +53,7 @@ Type: `Promise<void>`
|
|
|
53
53
|
### Used by
|
|
54
54
|
|
|
55
55
|
- [ez-form-view](../ez-form-view)
|
|
56
|
+
- [ez-link-builder](../ez-rich-text/ez-link-builder)
|
|
56
57
|
- [ez-list](../ez-list)
|
|
57
58
|
- [ez-multi-selection-list](../ez-multi-selection-list)
|
|
58
59
|
|
|
@@ -60,6 +61,7 @@ Type: `Promise<void>`
|
|
|
60
61
|
```mermaid
|
|
61
62
|
graph TD;
|
|
62
63
|
ez-form-view --> ez-check
|
|
64
|
+
ez-link-builder --> ez-check
|
|
63
65
|
ez-list --> ez-check
|
|
64
66
|
ez-multi-selection-list --> ez-check
|
|
65
67
|
style ez-check fill:#f9f,stroke:#333,stroke-width:4px
|
|
@@ -7,24 +7,32 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property | Attribute | Description | Type
|
|
11
|
-
| ------------------------ | --------------------------- | ----------------------------------------------------------------------------------------------------------------------- |
|
|
12
|
-
| `disableAutoUpdateValue` | `disable-auto-update-value` | Desabilita a alteração da propriedade value ao clicar. | `boolean`
|
|
13
|
-
| `enabled` | `enabled` | Se false o usuário não pode interagir com o ez-chip. | `boolean`
|
|
14
|
-
| `
|
|
15
|
-
| `
|
|
16
|
-
| `
|
|
17
|
-
| `
|
|
18
|
-
| `
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ------------------------ | --------------------------- | ----------------------------------------------------------------------------------------------------------------------- | ---------------------------------- | ----------- |
|
|
12
|
+
| `disableAutoUpdateValue` | `disable-auto-update-value` | Desabilita a alteração da propriedade value ao clicar. | `boolean` | `false` |
|
|
13
|
+
| `enabled` | `enabled` | Se false o usuário não pode interagir com o ez-chip. | `boolean` | `true` |
|
|
14
|
+
| `iconNameLeft` | `icon-name-left` | Define o icone esquerdo. | `string` | `undefined` |
|
|
15
|
+
| `iconNameRight` | `icon-name-right` | Define o icone direito. | `string` | `undefined` |
|
|
16
|
+
| `label` | `label` | Texto a ser apresentado como título do ez-chip. | `string` | `undefined` |
|
|
17
|
+
| `maxWidth` | `max-width` | Define o tamanho máximo do chip. | `string` | `undefined` |
|
|
18
|
+
| `mode` | `mode` | Define o modo de uso do ez-chip. | `"action" \| "label"` | `undefined` |
|
|
19
|
+
| `removePosition` | `remove-position` | Determina o posicionamento do botão de remover (não disponível no modo `action`). Se não informado, não exibe o botão. | `"left" \| "right"` | `undefined` |
|
|
20
|
+
| `removeWithKeyboard` | `remove-with-keyboard` | Define se o chip deve ser removido ao pressionar a tecla Enter quando focado. | `boolean` | `false` |
|
|
21
|
+
| `showNativeTooltip` | `show-native-tooltip` | Exibe condicionalmente o tooltip nativo do navegador ao sobrepor o cursor acima do elemento. | `boolean` | `false` |
|
|
22
|
+
| `size` | `size` | Define o tamanho do chip. | `"default" \| "large" \| "medium"` | `'default'` |
|
|
23
|
+
| `tabIndex` | `tab-index` | Define o tabindex do chip. Por padrão é 0, permitindo que o chip seja focável. | `number` | `0` |
|
|
24
|
+
| `type` | `type` | Define o tipo de estilização do chip. | `"primary" \| "secondary"` | `'primary'` |
|
|
25
|
+
| `value` | `value` | Define o valor do ez-chip. | `boolean` | `false` |
|
|
19
26
|
|
|
20
27
|
|
|
21
28
|
## Events
|
|
22
29
|
|
|
23
|
-
| Event | Description | Type
|
|
24
|
-
| ------------- | ----------------------------------------------------------- |
|
|
25
|
-
| `actionClick` | Emitido no modo "action" quando o usuário clica no ez-chip. | `CustomEvent<void>`
|
|
26
|
-
| `
|
|
27
|
-
| `
|
|
30
|
+
| Event | Description | Type |
|
|
31
|
+
| ------------- | ----------------------------------------------------------- | ------------------------------------------- |
|
|
32
|
+
| `actionClick` | Emitido no modo "action" quando o usuário clica no ez-chip. | `CustomEvent<void>` |
|
|
33
|
+
| `iconClick` | Emitido quando o icone é acionado. | `CustomEvent<{ icon: "left" \| "right"; }>` |
|
|
34
|
+
| `removeChip` | Emitido quando o botão de remoção é acionado. | `CustomEvent<void>` |
|
|
35
|
+
| `valueChange` | Emitido quando acontece a alteração de valor do ez-chip. | `CustomEvent<boolean>` |
|
|
28
36
|
|
|
29
37
|
|
|
30
38
|
## Methods
|
|
@@ -37,7 +45,7 @@ Remove o foco do ez-chip.
|
|
|
37
45
|
|
|
38
46
|
Type: `Promise<void>`
|
|
39
47
|
|
|
40
|
-
|
|
48
|
+
---
|
|
41
49
|
|
|
42
50
|
### `setFocus() => Promise<void>`
|
|
43
51
|
|
|
@@ -52,14 +60,21 @@ Type: `Promise<void>`
|
|
|
52
60
|
|
|
53
61
|
## Dependencies
|
|
54
62
|
|
|
63
|
+
### Used by
|
|
64
|
+
|
|
65
|
+
- [ez-tag-input](../ez-tag-input)
|
|
66
|
+
|
|
55
67
|
### Depends on
|
|
56
68
|
|
|
69
|
+
- [ez-tooltip](../ez-tooltip)
|
|
57
70
|
- [ez-icon](../ez-icon)
|
|
58
71
|
|
|
59
72
|
### Graph
|
|
60
73
|
```mermaid
|
|
61
74
|
graph TD;
|
|
75
|
+
ez-chip --> ez-tooltip
|
|
62
76
|
ez-chip --> ez-icon
|
|
77
|
+
ez-tag-input --> ez-chip
|
|
63
78
|
style ez-chip fill:#f9f,stroke:#333,stroke-width:4px
|
|
64
79
|
```
|
|
65
80
|
|
|
@@ -75,19 +90,20 @@ graph TD;
|
|
|
75
90
|
| --ez-label-chip\_\_label--font-size | Define o tamanho do label. |
|
|
76
91
|
| --ez-label-chip\_\_label--font-family | Define a família da fonte do label. |
|
|
77
92
|
| --ez-label-chip\_\_label--font-weight | Define o peso da fonte do label. |
|
|
78
|
-
| --ez-label-chip\_\
|
|
79
|
-
| --ez-label-chip\_\_label--
|
|
80
|
-
| --ez-label-chip\_\_label--
|
|
93
|
+
| --ez-label-chip\_\_horizontal-padding | Define o espaçamento do label. |
|
|
94
|
+
| --ez-label-chip\_\_label--text--primary | Define a cor do texto. |
|
|
95
|
+
| --ez-label-chip\_\_label--icon--primary | Define a cor do ícone. |
|
|
81
96
|
| --ez-label-chip\_\_label\_\_container--border-radius | Define o raio da borda do container do chip. |
|
|
82
97
|
| --ez-label-chip\_\_label\_\_container--border | Define o estilo da borda do container. |
|
|
83
98
|
| --ez-label-chip\_\_label\_\_container--border-color-strokes | Define a cor da borda do container. |
|
|
84
99
|
| --ez-label-chip\_\_label\_\_container--color-primary | Define a cor do texto, do ícone do label e do botão de remoção (quando o chip está ativo). |
|
|
85
100
|
| --ez-label-chip\_\_label\_\_container-color--disable-secondary | Define a cor da borda e do fundo quando o chip está desativado. |
|
|
86
|
-
| --ez-label-chip\_\_label\_\_container--background-color | Define a cor de fundo do container
|
|
101
|
+
| --ez-label-chip\_\_label\_\_container--background-color | Define a cor de fundo do container. |
|
|
87
102
|
| --ez-label-chip\_\_label\_\_container--border-color | Define a cor da borda do container quando ativo. |
|
|
88
|
-
| --ez-label-chip\_\_label\_\_container--
|
|
89
|
-
| --ez-label-chip\_\_label\_\_container--default--background-color--
|
|
90
|
-
| --ez-label-chip\_\_label\_\_container--default--color--
|
|
103
|
+
| --ez-label-chip\_\_label\_\_container--border-color-active | Define a cor da borda do container quando ativo. |
|
|
104
|
+
| --ez-label-chip\_\_label\_\_container--default--background-color--active | Define a cor do fundo do container quando o cursor está ativo. |
|
|
105
|
+
| --ez-label-chip\_\_label\_\_container--default--color--active | Define a cor do texto quando o cursor está sobre ele. |
|
|
91
106
|
| --ez-label-chip\_\_label\_\_container--text--disabled | Define a cor do texto e do ícone quando o chip está desabilitado. |
|
|
92
107
|
| --ez-label-chip\_\_label\_\_container--default--border-color--active | Define a cor da borda quando o componente está ativo. |
|
|
108
|
+
| --ez-label-chip\_\_label\_\_container--secondary--border-color--active | Define a cor da borda quando o componente está ativo e na variação secundária. |
|
|
93
109
|
| --ez-label-chip\_\_label\_\_container--default--margin-top | Define a margem superior. |
|
|
@@ -47,7 +47,7 @@ Oculta o popover.
|
|
|
47
47
|
|
|
48
48
|
Type: `Promise<void>`
|
|
49
49
|
|
|
50
|
-
|
|
50
|
+
---
|
|
51
51
|
|
|
52
52
|
### `setBlur() => Promise<void>`
|
|
53
53
|
|
|
@@ -57,7 +57,7 @@ Remove o foco do campo.
|
|
|
57
57
|
|
|
58
58
|
Type: `Promise<void>`
|
|
59
59
|
|
|
60
|
-
|
|
60
|
+
---
|
|
61
61
|
|
|
62
62
|
### `setFocus(option?: OptionsSetFocus) => Promise<void>`
|
|
63
63
|
|
|
@@ -67,7 +67,7 @@ Aplica o foco no campo.
|
|
|
67
67
|
|
|
68
68
|
Type: `Promise<void>`
|
|
69
69
|
|
|
70
|
-
|
|
70
|
+
---
|
|
71
71
|
|
|
72
72
|
### `setValue(option: IOption) => Promise<void>`
|
|
73
73
|
|
|
@@ -77,7 +77,7 @@ Type: `Promise<void>`
|
|
|
77
77
|
|
|
78
78
|
Type: `Promise<void>`
|
|
79
79
|
|
|
80
|
-
|
|
80
|
+
---
|
|
81
81
|
|
|
82
82
|
### `showPopover() => Promise<void>`
|
|
83
83
|
|
|
@@ -41,7 +41,7 @@ Aplica o foco no campo de edição de título.
|
|
|
41
41
|
|
|
42
42
|
Type: `Promise<void>`
|
|
43
43
|
|
|
44
|
-
|
|
44
|
+
---
|
|
45
45
|
|
|
46
46
|
### `cancelEdition() => Promise<void>`
|
|
47
47
|
|
|
@@ -51,7 +51,7 @@ Cancela a edição de título.
|
|
|
51
51
|
|
|
52
52
|
Type: `Promise<void>`
|
|
53
53
|
|
|
54
|
-
|
|
54
|
+
---
|
|
55
55
|
|
|
56
56
|
### `showHide() => Promise<void>`
|
|
57
57
|
|
|
@@ -7,17 +7,17 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property | Attribute | Description | Type | Default
|
|
11
|
-
| ----------------- | ------------------- | -------------------------------------------------------------------- | --------------------------- |
|
|
12
|
-
| `maxWidth` | `max-width` | Largura máxima da lista, em pixels. | `number` | `undefined`
|
|
13
|
-
| `onOptionHover` | -- | Callback chamado quando o mouse passa sobre uma opção. | `(index: number) => void` | `undefined`
|
|
14
|
-
| `onOptionSelect` | -- | Callback chamado quando uma opção é selecionada. | `(option: IOption) => void` | `undefined`
|
|
15
|
-
| `preSelection` | `pre-selection` | Índice da opção pré-selecionada na lista. | `number` | `undefined`
|
|
16
|
-
| `showLoading` | `show-loading` | Indica se o indicador de carregamento deve ser exibido. | `boolean` | `undefined`
|
|
17
|
-
| `showOptionValue` | `show-option-value` | Indica se o valor de cada opção deve ser exibido junto com o rótulo. | `boolean` | `undefined`
|
|
18
|
-
| `textEmptyList` | `text-empty-list` | Mensagem exibida quando a lista de opções está vazia. | `string` | `
|
|
19
|
-
| `visibleOptions` | -- | Lista de opções visíveis que serão exibidas no componente. | `IOption[]` | `undefined`
|
|
20
|
-
| `width` | `width` | Largura fixa da lista, em pixels. | `number` | `undefined`
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ----------------- | ------------------- | -------------------------------------------------------------------- | --------------------------- | ----------- |
|
|
12
|
+
| `maxWidth` | `max-width` | Largura máxima da lista, em pixels. | `number` | `undefined` |
|
|
13
|
+
| `onOptionHover` | -- | Callback chamado quando o mouse passa sobre uma opção. | `(index: number) => void` | `undefined` |
|
|
14
|
+
| `onOptionSelect` | -- | Callback chamado quando uma opção é selecionada. | `(option: IOption) => void` | `undefined` |
|
|
15
|
+
| `preSelection` | `pre-selection` | Índice da opção pré-selecionada na lista. | `number` | `undefined` |
|
|
16
|
+
| `showLoading` | `show-loading` | Indica se o indicador de carregamento deve ser exibido. | `boolean` | `undefined` |
|
|
17
|
+
| `showOptionValue` | `show-option-value` | Indica se o valor de cada opção deve ser exibido junto com o rótulo. | `boolean` | `undefined` |
|
|
18
|
+
| `textEmptyList` | `text-empty-list` | Mensagem exibida quando a lista de opções está vazia. | `string` | `undefined` |
|
|
19
|
+
| `visibleOptions` | -- | Lista de opções visíveis que serão exibidas no componente. | `IOption[]` | `undefined` |
|
|
20
|
+
| `width` | `width` | Largura fixa da lista, em pixels. | `number` | `undefined` |
|
|
21
21
|
|
|
22
22
|
|
|
23
23
|
## Methods
|
|
@@ -30,7 +30,7 @@ Move a seleção para a próxima opção na lista.
|
|
|
30
30
|
|
|
31
31
|
Type: `Promise<void>`
|
|
32
32
|
|
|
33
|
-
|
|
33
|
+
---
|
|
34
34
|
|
|
35
35
|
### `previousOption() => Promise<void>`
|
|
36
36
|
|
|
@@ -40,7 +40,7 @@ Move a seleção para a opção anterior na lista, sem ultrapassar o início.
|
|
|
40
40
|
|
|
41
41
|
Type: `Promise<void>`
|
|
42
42
|
|
|
43
|
-
|
|
43
|
+
---
|
|
44
44
|
|
|
45
45
|
### `selectCurrentOption() => Promise<void>`
|
|
46
46
|
|
|
@@ -7,28 +7,29 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property | Attribute | Description | Type | Default
|
|
11
|
-
| ---------------------------- | -------------------------------- | ------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------- |
|
|
12
|
-
| `alternativePlaceholder` | `alternative-placeholder` | Texto alternativo a ser apresentado como título do campo. | `string` | `undefined`
|
|
13
|
-
| `autoFocus` | `auto-focus` | Se true o campo de texto receberá o foco ao ser renderizado. | `boolean` | `false`
|
|
14
|
-
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true`
|
|
15
|
-
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true`
|
|
16
|
-
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined`
|
|
17
|
-
| `hideErrorOnFocusOut` | `hide-error-on-focus-out` | Quando verdadeiro deixa de exibir a mensagem de erro (se existente) quando focar em um elemento diferente. | `boolean` | `true`
|
|
18
|
-
| `isTextSearch` | `is-text-search` | Informa se a pesquisa é do tipo texto. | `boolean` | `false`
|
|
19
|
-
| `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined`
|
|
20
|
-
| `limitCharsToSearch` | `limit-chars-to-search` | Define o limite de caracteres mínimo para realizar uma pesquisa | `number` | `3`
|
|
21
|
-
| `listOptionsPosition` | -- | Define um posicionamento fixo para a lista de opções do CheckBox. | `IEzCheckBoxListPosition` | `undefined`
|
|
22
|
-
| `mode` | `mode` | Define o tamanho do campo. | `"regular" \| "slim"` | `"regular"`
|
|
23
|
-
| `optionLoader` | -- | Carrega as opções dinamicamente. | `(argument: ISearchArgument) => IOption \| IOption[] \| Promise<IOption[]>` | `undefined`
|
|
24
|
-
| `options` | -- | Array com as opções do ez-combo-box. Os elementos devem obedecer o formato: `{value: string, label: string}`. | `IOption[]` | `undefined`
|
|
25
|
-
| `
|
|
26
|
-
| `
|
|
27
|
-
| `
|
|
28
|
-
| `
|
|
29
|
-
| `
|
|
30
|
-
| `
|
|
31
|
-
| `
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ---------------------------- | -------------------------------- | ------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------- | ----------- |
|
|
12
|
+
| `alternativePlaceholder` | `alternative-placeholder` | Texto alternativo a ser apresentado como título do campo. | `string` | `undefined` |
|
|
13
|
+
| `autoFocus` | `auto-focus` | Se true o campo de texto receberá o foco ao ser renderizado. | `boolean` | `false` |
|
|
14
|
+
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true` |
|
|
15
|
+
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
16
|
+
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
17
|
+
| `hideErrorOnFocusOut` | `hide-error-on-focus-out` | Quando verdadeiro deixa de exibir a mensagem de erro (se existente) quando focar em um elemento diferente. | `boolean` | `true` |
|
|
18
|
+
| `isTextSearch` | `is-text-search` | Informa se a pesquisa é do tipo texto. | `boolean` | `false` |
|
|
19
|
+
| `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined` |
|
|
20
|
+
| `limitCharsToSearch` | `limit-chars-to-search` | Define o limite de caracteres mínimo para realizar uma pesquisa | `number` | `3` |
|
|
21
|
+
| `listOptionsPosition` | -- | Define um posicionamento fixo para a lista de opções do CheckBox. | `IEzCheckBoxListPosition` | `undefined` |
|
|
22
|
+
| `mode` | `mode` | Define o tamanho do campo. | `"regular" \| "slim"` | `"regular"` |
|
|
23
|
+
| `optionLoader` | -- | Carrega as opções dinamicamente. | `(argument: ISearchArgument) => IOption \| IOption[] \| Promise<IOption[]>` | `undefined` |
|
|
24
|
+
| `options` | -- | Array com as opções do ez-combo-box. Os elementos devem obedecer o formato: `{value: string, label: string}`. | `IOption[]` | `undefined` |
|
|
25
|
+
| `preventAutoFocus` | `prevent-auto-focus` | Se true, impede que o campo de texto receba foco automaticamente ao abrir as opções. | `boolean` | `false` |
|
|
26
|
+
| `showOptionValue` | `show-option-value` | Se true cada opção na lista exibe o `value` junto com `label`. | `boolean` | `false` |
|
|
27
|
+
| `showSelectedValue` | `show-selected-value` | Se true a opção selecionada exibe o `value` junto com `label`. | `boolean` | `false` |
|
|
28
|
+
| `stopPropagateEnterKeyEvent` | `stop-propagate-enter-key-event` | Se true, ineterrompe a propagação do evento de KeyDown da tecla enter | `boolean` | `true` |
|
|
29
|
+
| `suppressEmptyOption` | `suppress-empty-option` | Se true remove a opção vazia da lista. | `boolean` | `false` |
|
|
30
|
+
| `suppressSearch` | `suppress-search` | Se true desabilita a digitação dentro do componente. | `boolean` | `false` |
|
|
31
|
+
| `textEmptyOption` | `text-empty-option` | Texto a ser apresentado na opção de valor nulo. | `string` | `undefined` |
|
|
32
|
+
| `value` | `value` | Define o valor do campo. | `IOption \| string` | `undefined` |
|
|
32
33
|
|
|
33
34
|
|
|
34
35
|
## Events
|
|
@@ -48,7 +49,7 @@ Limpa o valor do campo de pesquisa
|
|
|
48
49
|
|
|
49
50
|
Type: `Promise<void>`
|
|
50
51
|
|
|
51
|
-
|
|
52
|
+
---
|
|
52
53
|
|
|
53
54
|
### `getValueAsync() => Promise<unknown>`
|
|
54
55
|
|
|
@@ -58,7 +59,7 @@ Type: `Promise<void>`
|
|
|
58
59
|
|
|
59
60
|
Type: `Promise<unknown>`
|
|
60
61
|
|
|
61
|
-
|
|
62
|
+
---
|
|
62
63
|
|
|
63
64
|
### `isInvalid() => Promise<boolean>`
|
|
64
65
|
|
|
@@ -68,7 +69,7 @@ Retorna se o conteúdo é inválido.
|
|
|
68
69
|
|
|
69
70
|
Type: `Promise<boolean>`
|
|
70
71
|
|
|
71
|
-
|
|
72
|
+
---
|
|
72
73
|
|
|
73
74
|
### `setBlur() => Promise<void>`
|
|
74
75
|
|
|
@@ -78,7 +79,7 @@ Remove o foco do campo.
|
|
|
78
79
|
|
|
79
80
|
Type: `Promise<void>`
|
|
80
81
|
|
|
81
|
-
|
|
82
|
+
---
|
|
82
83
|
|
|
83
84
|
### `setFocus(options?: TFocusOptions) => Promise<void>`
|
|
84
85
|
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
|
|
39
39
|
Type: `Promise<Date>`
|
|
40
40
|
|
|
41
|
-
|
|
41
|
+
---
|
|
42
42
|
|
|
43
43
|
### `isInvalid() => Promise<boolean>`
|
|
44
44
|
|
|
@@ -48,7 +48,7 @@ Retorna se o conteúdo é inválido.
|
|
|
48
48
|
|
|
49
49
|
Type: `Promise<boolean>`
|
|
50
50
|
|
|
51
|
-
|
|
51
|
+
---
|
|
52
52
|
|
|
53
53
|
### `setBlur() => Promise<void>`
|
|
54
54
|
|
|
@@ -58,7 +58,7 @@ Remove o foco do campo.
|
|
|
58
58
|
|
|
59
59
|
Type: `Promise<void>`
|
|
60
60
|
|
|
61
|
-
|
|
61
|
+
---
|
|
62
62
|
|
|
63
63
|
### `setFocus(options?: TFocusOptions) => Promise<void>`
|
|
64
64
|
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
|
|
40
40
|
Type: `Promise<Date>`
|
|
41
41
|
|
|
42
|
-
|
|
42
|
+
---
|
|
43
43
|
|
|
44
44
|
### `isInvalid() => Promise<boolean>`
|
|
45
45
|
|
|
@@ -49,7 +49,7 @@ Retorna se o conteúdo é inválido.
|
|
|
49
49
|
|
|
50
50
|
Type: `Promise<boolean>`
|
|
51
51
|
|
|
52
|
-
|
|
52
|
+
---
|
|
53
53
|
|
|
54
54
|
### `setBlur() => Promise<void>`
|
|
55
55
|
|
|
@@ -59,7 +59,7 @@ Remove o foco do campo.
|
|
|
59
59
|
|
|
60
60
|
Type: `Promise<void>`
|
|
61
61
|
|
|
62
|
-
|
|
62
|
+
---
|
|
63
63
|
|
|
64
64
|
### `setFocus(options?: TFocusOptions) => Promise<void>`
|
|
65
65
|
|
|
@@ -39,7 +39,7 @@ Método responsável por resetar o valor do campo para o ultimo valor inputado.
|
|
|
39
39
|
|
|
40
40
|
Type: `Promise<void>`
|
|
41
41
|
|
|
42
|
-
|
|
42
|
+
---
|
|
43
43
|
|
|
44
44
|
### `isInvalid() => Promise<boolean>`
|
|
45
45
|
|
|
@@ -49,7 +49,7 @@ Retorna se o conteúdo é inválido.
|
|
|
49
49
|
|
|
50
50
|
Type: `Promise<boolean>`
|
|
51
51
|
|
|
52
|
-
|
|
52
|
+
---
|
|
53
53
|
|
|
54
54
|
### `setBlur() => Promise<void>`
|
|
55
55
|
|
|
@@ -59,7 +59,7 @@ Remove o foco do campo.
|
|
|
59
59
|
|
|
60
60
|
Type: `Promise<void>`
|
|
61
61
|
|
|
62
|
-
|
|
62
|
+
---
|
|
63
63
|
|
|
64
64
|
### `setFocus(options?: TFocusOptions) => Promise<void>`
|
|
65
65
|
|
|
@@ -69,7 +69,7 @@ Aplica o foco no campo.
|
|
|
69
69
|
|
|
70
70
|
Type: `Promise<void>`
|
|
71
71
|
|
|
72
|
-
|
|
72
|
+
---
|
|
73
73
|
|
|
74
74
|
### `setValue(newValue: string) => Promise<void>`
|
|
75
75
|
|