@sankhyalabs/ezui-docs 0.0.0-feat-dev-KB-108673.2 → 0.0.0-feat-dev-KB-108978.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.
|
@@ -17,8 +17,10 @@
|
|
|
17
17
|
| `maxWidth` | `max-width` | Define o tamanho máximo do chip. | `string` | `undefined` |
|
|
18
18
|
| `mode` | `mode` | Define o modo de uso do ez-chip. | `"action" \| "label"` | `undefined` |
|
|
19
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` |
|
|
20
21
|
| `showNativeTooltip` | `show-native-tooltip` | Exibe condicionalmente o tooltip nativo do navegador ao sobrepor o cursor acima do elemento. | `boolean` | `false` |
|
|
21
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` |
|
|
22
24
|
| `type` | `type` | Define o tipo de estilização do chip. | `"primary" \| "secondary"` | `'primary'` |
|
|
23
25
|
| `value` | `value` | Define o valor do ez-chip. | `boolean` | `false` |
|
|
24
26
|
|
|
@@ -58,6 +60,10 @@ Type: `Promise<void>`
|
|
|
58
60
|
|
|
59
61
|
## Dependencies
|
|
60
62
|
|
|
63
|
+
### Used by
|
|
64
|
+
|
|
65
|
+
- [ez-tag-input](../ez-tag-input)
|
|
66
|
+
|
|
61
67
|
### Depends on
|
|
62
68
|
|
|
63
69
|
- [ez-tooltip](../ez-tooltip)
|
|
@@ -68,6 +74,7 @@ Type: `Promise<void>`
|
|
|
68
74
|
graph TD;
|
|
69
75
|
ez-chip --> ez-tooltip
|
|
70
76
|
ez-chip --> ez-icon
|
|
77
|
+
ez-tag-input --> ez-chip
|
|
71
78
|
style ez-chip fill:#f9f,stroke:#333,stroke-width:4px
|
|
72
79
|
```
|
|
73
80
|
|
|
@@ -98,4 +105,5 @@ graph TD;
|
|
|
98
105
|
| --ez-label-chip\_\_label\_\_container--default--color--active | Define a cor do texto quando o cursor está sobre ele. |
|
|
99
106
|
| --ez-label-chip\_\_label\_\_container--text--disabled | Define a cor do texto e do ícone quando o chip está desabilitado. |
|
|
100
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. |
|
|
101
109
|
| --ez-label-chip\_\_label\_\_container--default--margin-top | Define a margem superior. |
|
|
@@ -37,14 +37,13 @@
|
|
|
37
37
|
|
|
38
38
|
## Events
|
|
39
39
|
|
|
40
|
-
| Event
|
|
41
|
-
|
|
|
42
|
-
| `componentReady`
|
|
43
|
-
| `configChange`
|
|
44
|
-
| `ezColumnStateChange`
|
|
45
|
-
| `ezDoubleClick`
|
|
46
|
-
| `
|
|
47
|
-
| `ezSelectionChange` | Emitido quando acontece a alteração de seleção de linhas. | `CustomEvent<ISelection>` |
|
|
40
|
+
| Event | Description | Type |
|
|
41
|
+
| --------------------- | ------------------------------------------------------------------------------------------- | ------------------------------------ |
|
|
42
|
+
| `componentReady` | Emitido quando o componente estiver completamente carregado. | `CustomEvent<void>` |
|
|
43
|
+
| `configChange` | Emitido quando acontece a alteração de configuração do grade. | `CustomEvent<IGridConfig>` |
|
|
44
|
+
| `ezColumnStateChange` | Emitido quando acontece a alteração de estado das colunas do grid: Ordenação, largura, etc. | `CustomEvent<EzGridColumStateEvent>` |
|
|
45
|
+
| `ezDoubleClick` | Emitido com o duplo clique de uma linha | `CustomEvent<any>` |
|
|
46
|
+
| `ezSelectionChange` | Emitido quando acontece a alteração de seleção de linhas. | `CustomEvent<ISelection>` |
|
|
48
47
|
|
|
49
48
|
|
|
50
49
|
## Methods
|
|
@@ -252,10 +251,6 @@ Type: `Promise<void>`
|
|
|
252
251
|
|
|
253
252
|
## Dependencies
|
|
254
253
|
|
|
255
|
-
### Used by
|
|
256
|
-
|
|
257
|
-
- [ez-grid-view](../ez-dataset)
|
|
258
|
-
|
|
259
254
|
### Depends on
|
|
260
255
|
|
|
261
256
|
- [ez-popover](../ez-popover)
|
|
@@ -293,7 +288,6 @@ graph TD;
|
|
|
293
288
|
ez-search --> ez-popover-plus
|
|
294
289
|
ez-search --> search-list
|
|
295
290
|
search-list --> ez-card-item
|
|
296
|
-
ez-grid-view --> ez-grid
|
|
297
291
|
style ez-grid fill:#f9f,stroke:#333,stroke-width:4px
|
|
298
292
|
```
|
|
299
293
|
|
|
@@ -0,0 +1,132 @@
|
|
|
1
|
+
# ez-tag-input
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
9
|
+
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| -------------------------------- | ----------------------------------- | ------------------------------------------------------------------------------- | ------------------------------------------------------------ | ----------- |
|
|
12
|
+
| `allowDuplicates` | `allow-duplicates` | Define se tags duplicadas são permitidas | `boolean` | `false` |
|
|
13
|
+
| `enabled` | `enabled` | Define se o input está habilitado | `boolean` | `true` |
|
|
14
|
+
| `helpText` | `help-text` | Texto de ajuda exibido abaixo do input | `string` | `undefined` |
|
|
15
|
+
| `label` | `label` | Texto do label exibido acima do input | `string` | `''` |
|
|
16
|
+
| `maxTagLength` | `max-tag-length` | Tamanho máximo de uma tag | `number` | `undefined` |
|
|
17
|
+
| `maxTags` | `max-tags` | Número máximo de tags permitidas | `number` | `undefined` |
|
|
18
|
+
| `name` | `name` | Nome do input | `string` | `undefined` |
|
|
19
|
+
| `placeholder` | `placeholder` | Placeholder do input | `string` | `''` |
|
|
20
|
+
| `readonly` | `readonly` | Define se o input é somente leitura | `boolean` | `false` |
|
|
21
|
+
| `state` | `state` | Estado visual do componente | `"default" \| "error" \| "success" \| "warning"` | `"default"` |
|
|
22
|
+
| `suppressBackspaceToRemove` | `suppress-backspace-to-remove` | Define se a tecla Backspace deve remover a última tag quando o input está vazio | `boolean` | `false` |
|
|
23
|
+
| `suppressTagsKeyboardNavigation` | `suppress-tags-keyboard-navigation` | Define se a navegação por teclado pelas tags deve ser suprimida | `boolean` | `false` |
|
|
24
|
+
| `tags` | -- | Array de tags iniciais | `string[]` | `[]` |
|
|
25
|
+
| `validator` | -- | Função de validação customizada para tags | `(tag: string, existingTags: string[]) => string \| boolean` | `undefined` |
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
## Events
|
|
29
|
+
|
|
30
|
+
| Event | Description | Type |
|
|
31
|
+
| ------------------- | --------------------------------------------- | ----------------------------------------------- |
|
|
32
|
+
| `ezBlur` | Evento disparado quando o input perde foco | `CustomEvent<void>` |
|
|
33
|
+
| `ezChange` | Evento disparado quando as tags mudam | `CustomEvent<string[]>` |
|
|
34
|
+
| `ezFocus` | Evento disparado quando o input recebe foco | `CustomEvent<void>` |
|
|
35
|
+
| `ezTagAdded` | Evento disparado quando uma tag é adicionada | `CustomEvent<string>` |
|
|
36
|
+
| `ezTagRemoved` | Evento disparado quando uma tag é removida | `CustomEvent<string>` |
|
|
37
|
+
| `ezType` | Emitido quando é digitado no campo de entrada | `CustomEvent<string>` |
|
|
38
|
+
| `ezValidationError` | Evento disparado quando uma validação falha | `CustomEvent<{ tag: string; error?: string; }>` |
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
## Methods
|
|
42
|
+
|
|
43
|
+
### `addTag(tag: string) => Promise<boolean>`
|
|
44
|
+
|
|
45
|
+
Adiciona uma tag programaticamente
|
|
46
|
+
|
|
47
|
+
#### Returns
|
|
48
|
+
|
|
49
|
+
Type: `Promise<boolean>`
|
|
50
|
+
|
|
51
|
+
---
|
|
52
|
+
|
|
53
|
+
### `clearTags() => Promise<void>`
|
|
54
|
+
|
|
55
|
+
Limpa todas as tags
|
|
56
|
+
|
|
57
|
+
#### Returns
|
|
58
|
+
|
|
59
|
+
Type: `Promise<void>`
|
|
60
|
+
|
|
61
|
+
---
|
|
62
|
+
|
|
63
|
+
### `removeTag(tag: string) => Promise<boolean>`
|
|
64
|
+
|
|
65
|
+
Remove uma tag programaticamente
|
|
66
|
+
|
|
67
|
+
#### Returns
|
|
68
|
+
|
|
69
|
+
Type: `Promise<boolean>`
|
|
70
|
+
|
|
71
|
+
---
|
|
72
|
+
|
|
73
|
+
### `setBlur() => Promise<void>`
|
|
74
|
+
|
|
75
|
+
Remove o foco do campo
|
|
76
|
+
|
|
77
|
+
#### Returns
|
|
78
|
+
|
|
79
|
+
Type: `Promise<void>`
|
|
80
|
+
|
|
81
|
+
---
|
|
82
|
+
|
|
83
|
+
### `setFocus(option?: OptionsSetFocus) => Promise<void>`
|
|
84
|
+
|
|
85
|
+
Aplica o foco no campo
|
|
86
|
+
|
|
87
|
+
#### Returns
|
|
88
|
+
|
|
89
|
+
Type: `Promise<void>`
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
## Dependencies
|
|
95
|
+
|
|
96
|
+
### Depends on
|
|
97
|
+
|
|
98
|
+
- [ez-chip](../ez-chip)
|
|
99
|
+
|
|
100
|
+
### Graph
|
|
101
|
+
```mermaid
|
|
102
|
+
graph TD;
|
|
103
|
+
ez-tag-input --> ez-chip
|
|
104
|
+
ez-chip --> ez-tooltip
|
|
105
|
+
ez-chip --> ez-icon
|
|
106
|
+
style ez-tag-input fill:#f9f,stroke:#333,stroke-width:4px
|
|
107
|
+
```
|
|
108
|
+
|
|
109
|
+
----------------------------------------------
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
|
|
113
|
+
|
|
114
|
+
## CSS Variables
|
|
115
|
+
| Variable | Description |
|
|
116
|
+
|-|-|
|
|
117
|
+
| --ez-tag-input--background-color | Define a cor de fundo do container do input. |
|
|
118
|
+
| --ez-tag-input--border-color-default | Define a cor da borda no estado padrão. |
|
|
119
|
+
| --ez-tag-input--border-color-focused | Define a cor da borda no estado focado. |
|
|
120
|
+
| --ez-tag-input--border-color-error | Define a cor da borda no estado de erro. |
|
|
121
|
+
| --ez-tag-input--border-color-success | Define a cor da borda no estado de sucesso. |
|
|
122
|
+
| --ez-tag-input--border-color-warning | Define a cor da borda no estado de aviso. |
|
|
123
|
+
| --ez-tag-input--border-radius | Define o raio da borda do container. |
|
|
124
|
+
| --ez-tag-input--padding | Define o espaçamento interno do container. |
|
|
125
|
+
| --ez-tag-input--gap | Define o espaçamento entre tags e input. |
|
|
126
|
+
| --ez-tag-input--label-color | Define a cor do texto do label. |
|
|
127
|
+
| --ez-tag-input--label-font-weight | Define o peso da fonte do label. |
|
|
128
|
+
| --ez-tag-input--input-color | Define a cor do texto do input. |
|
|
129
|
+
| --ez-tag-input--input-font-size | Define o tamanho da fonte do input. |
|
|
130
|
+
| --ez-tag-input--placeholder-color | Define a cor do placeholder. |
|
|
131
|
+
| --ez-tag-input--background-color-disabled | Define a cor de fundo do input quando está desabilitado. |
|
|
132
|
+
| --ez-tag-input--helptext-color | Define a cor do texto de ajuda do input. |
|
package/package.json
CHANGED
|
@@ -1,183 +0,0 @@
|
|
|
1
|
-
# ez-grid-view
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
<!-- Auto Generated Below -->
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
## Properties
|
|
9
|
-
|
|
10
|
-
| Property | Attribute | Description | Type | Default |
|
|
11
|
-
| -------------------------- | ---------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------- | ------------------------------- |
|
|
12
|
-
| `autoFocus` | `auto-focus` | Define se a grid será focada ao ser carregada. | `boolean` | `true` |
|
|
13
|
-
| `columnsConfig` | -- | Configuração de exibição da grade. | `ColumnConfig[]` | `undefined` |
|
|
14
|
-
| `compact` | `compact` | Define se a grade deve ser exibida em modo compacto | `boolean` | `false` |
|
|
15
|
-
| `enableRowTableStriped` | `enable-row-table-striped` | Ativa modo de linhas com cores alternadas. | `boolean` | `true` |
|
|
16
|
-
| `metadata` | -- | Metadados que definem a estrutura da grade. | `UnitMetadata` | `undefined` |
|
|
17
|
-
| `multipleSelection` | `multiple-selection` | Habilita a seleção de várias linhas. | `boolean` | `false` |
|
|
18
|
-
| `outlineMode` | `outline-mode` | Altera visualmente as sombras e bordas do componente Quando false, aplica o padrão de sombras ao componente (Utilizar quando for o elemento principal do layout) Quando true, aplica o padrão de outline ao componente (Utilizar quando estiver contido em outro elemento como um painel ou pop-up) | `boolean` | `false` |
|
|
19
|
-
| `pageSize` | `page-size` | Quantidad ede registros por página. | `number` | `150` |
|
|
20
|
-
| `paginationCounterMode` | `pagination-counter-mode` | Define a forma como a paginação irá se comportar. | `"auto" \| "hidden" \| "show"` | `'auto'` |
|
|
21
|
-
| `recordDateFormat` | `record-date-format` | Formato dos campos data dos registros. | `RECORD_DATE_FORMAT.DD_MM_YYYY \| RECORD_DATE_FORMAT.ISO` | `RECORD_DATE_FORMAT.DD_MM_YYYY` |
|
|
22
|
-
| `records` | -- | Registros a serem exibidos na grade. | `Record[]` | `undefined` |
|
|
23
|
-
| `suppressCheckboxColumn` | `suppress-checkbox-column` | Informa se a coluna de chechbox deve ser suprimida | `boolean` | `false` |
|
|
24
|
-
| `suppressFilterColumn` | `suppress-filter-column` | Informa se a grade deve suprimir o filtro de coluna. | `boolean` | `false` |
|
|
25
|
-
| `suppressHorizontalScroll` | `suppress-horizontal-scroll` | Define se a grade deve suprimir o scroll horizontal. | `boolean` | `false` |
|
|
26
|
-
| `useSearchColumn` | `use-search-column` | Define se a grade deve exibir um buscador de coluna com uso do Ctrl+F | `boolean` | `true` |
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
## Methods
|
|
30
|
-
|
|
31
|
-
### `addColumnMenuItem(label: string, name: string, action: Function, icon: HTMLElement | string) => Promise<void>`
|
|
32
|
-
|
|
33
|
-
Adiciona item de menu nas colunas.
|
|
34
|
-
|
|
35
|
-
#### Returns
|
|
36
|
-
|
|
37
|
-
Type: `Promise<void>`
|
|
38
|
-
|
|
39
|
-
---
|
|
40
|
-
|
|
41
|
-
### `addCustomValueFormatter(columnName: string, customFormatter: ICustomFormatter) => Promise<void>`
|
|
42
|
-
|
|
43
|
-
Registra um formatador de valores para uma coluna da grid.
|
|
44
|
-
|
|
45
|
-
#### Returns
|
|
46
|
-
|
|
47
|
-
Type: `Promise<void>`
|
|
48
|
-
|
|
49
|
-
---
|
|
50
|
-
|
|
51
|
-
### `addGridCustomRender(fieldName: string, customRender: ICustomRender, detailContext?: string) => Promise<void>`
|
|
52
|
-
|
|
53
|
-
Registra um render customizado para colunas da grid.
|
|
54
|
-
|
|
55
|
-
#### Returns
|
|
56
|
-
|
|
57
|
-
Type: `Promise<void>`
|
|
58
|
-
|
|
59
|
-
---
|
|
60
|
-
|
|
61
|
-
### `filterColumns(search: string) => Promise<Array<EzGridColumn>>`
|
|
62
|
-
|
|
63
|
-
Usa um argumento para filtrar as colunas por label
|
|
64
|
-
|
|
65
|
-
#### Returns
|
|
66
|
-
|
|
67
|
-
Type: `Promise<EzGridColumn[]>`
|
|
68
|
-
|
|
69
|
-
---
|
|
70
|
-
|
|
71
|
-
### `getDataUnit() => Promise<DataUnit>`
|
|
72
|
-
|
|
73
|
-
Obtém o DataUnit da grade.
|
|
74
|
-
|
|
75
|
-
#### Returns
|
|
76
|
-
|
|
77
|
-
Type: `Promise<DataUnit>`
|
|
78
|
-
|
|
79
|
-
---
|
|
80
|
-
|
|
81
|
-
### `getSelection() => Promise<Array<any>>`
|
|
82
|
-
|
|
83
|
-
Obtém as linhas selecionadas.
|
|
84
|
-
|
|
85
|
-
#### Returns
|
|
86
|
-
|
|
87
|
-
Type: `Promise<any[]>`
|
|
88
|
-
|
|
89
|
-
---
|
|
90
|
-
|
|
91
|
-
### `locateColumn(columnName: string) => Promise<void>`
|
|
92
|
-
|
|
93
|
-
Localiza determinada coluna tornando-a visível.
|
|
94
|
-
|
|
95
|
-
#### Returns
|
|
96
|
-
|
|
97
|
-
Type: `Promise<void>`
|
|
98
|
-
|
|
99
|
-
---
|
|
100
|
-
|
|
101
|
-
### `quickFilter(term: string) => Promise<void>`
|
|
102
|
-
|
|
103
|
-
Aplica um filtro rápido.
|
|
104
|
-
|
|
105
|
-
#### Returns
|
|
106
|
-
|
|
107
|
-
Type: `Promise<void>`
|
|
108
|
-
|
|
109
|
-
---
|
|
110
|
-
|
|
111
|
-
### `refresh() => Promise<void>`
|
|
112
|
-
|
|
113
|
-
Recarrega os registros da grade.
|
|
114
|
-
|
|
115
|
-
#### Returns
|
|
116
|
-
|
|
117
|
-
Type: `Promise<void>`
|
|
118
|
-
|
|
119
|
-
---
|
|
120
|
-
|
|
121
|
-
### `removeCustomValueFormatter(columnName: string) => Promise<void>`
|
|
122
|
-
|
|
123
|
-
Remove o formatador de valores de uma coluna da grid.
|
|
124
|
-
|
|
125
|
-
#### Returns
|
|
126
|
-
|
|
127
|
-
Type: `Promise<void>`
|
|
128
|
-
|
|
129
|
-
---
|
|
130
|
-
|
|
131
|
-
### `setFocus() => Promise<void>`
|
|
132
|
-
|
|
133
|
-
Atribui o foco para a grade.
|
|
134
|
-
|
|
135
|
-
#### Returns
|
|
136
|
-
|
|
137
|
-
Type: `Promise<void>`
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
## Dependencies
|
|
143
|
-
|
|
144
|
-
### Depends on
|
|
145
|
-
|
|
146
|
-
- [ez-grid](../ez-grid)
|
|
147
|
-
|
|
148
|
-
### Graph
|
|
149
|
-
```mermaid
|
|
150
|
-
graph TD;
|
|
151
|
-
ez-grid-view --> ez-grid
|
|
152
|
-
ez-grid --> ez-popover
|
|
153
|
-
ez-grid --> ez-icon
|
|
154
|
-
ez-grid --> ez-button
|
|
155
|
-
ez-grid --> filter-column
|
|
156
|
-
ez-grid --> ez-search
|
|
157
|
-
ez-button --> ez-icon
|
|
158
|
-
filter-column --> ez-popover-plus
|
|
159
|
-
filter-column --> ez-button
|
|
160
|
-
filter-column --> ez-multi-selection-list
|
|
161
|
-
ez-popover-plus --> ez-popover-core
|
|
162
|
-
ez-multi-selection-list --> ez-check
|
|
163
|
-
ez-multi-selection-list --> ez-list
|
|
164
|
-
ez-multi-selection-list --> ez-icon
|
|
165
|
-
ez-multi-selection-list --> multi-selection-box-message
|
|
166
|
-
ez-multi-selection-list --> ez-filter-input
|
|
167
|
-
ez-multi-selection-list --> ez-search
|
|
168
|
-
ez-list --> ez-check
|
|
169
|
-
ez-filter-input --> ez-text-input
|
|
170
|
-
ez-filter-input --> ez-icon
|
|
171
|
-
ez-text-input --> ez-tooltip
|
|
172
|
-
ez-text-input --> ez-icon
|
|
173
|
-
ez-search --> ez-text-input
|
|
174
|
-
ez-search --> ez-icon
|
|
175
|
-
ez-search --> ez-popover-plus
|
|
176
|
-
ez-search --> search-list
|
|
177
|
-
search-list --> ez-card-item
|
|
178
|
-
style ez-grid-view fill:#f9f,stroke:#333,stroke-width:4px
|
|
179
|
-
```
|
|
180
|
-
|
|
181
|
-
----------------------------------------------
|
|
182
|
-
|
|
183
|
-
|