@sankhyalabs/ezui-docs 5.22.0-dev.9 → 5.22.0-dev.90
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-breadcrumb/readme.md +1 -0
- package/components/ez-button/readme.md +3 -1
- package/components/ez-card-item/readme.md +1 -0
- package/components/ez-collapsible-box/readme.md +2 -0
- package/components/ez-combo-box/readme.md +23 -19
- package/components/ez-date-input/readme.md +4 -1
- package/components/ez-date-time-input/readme.md +4 -1
- package/components/ez-double-list/readme.md +70 -0
- package/components/ez-dropdown/readme.md +3 -0
- package/components/ez-filter-input/readme.md +6 -1
- package/components/ez-form/readme.md +2 -0
- package/components/ez-form-view/readme.md +2 -0
- package/components/ez-grid/readme.md +49 -16
- package/components/ez-grid/subcomponents/readme.md +4 -2
- package/components/ez-guide-navigator/readme.md +2 -0
- package/components/ez-icon/readme.md +2 -0
- package/components/ez-list/readme.md +21 -17
- package/components/ez-modal/readme.md +10 -10
- package/components/ez-multi-selection-list/readme.md +2 -0
- package/components/ez-number-input/readme.md +4 -0
- package/components/ez-popover/readme.md +2 -2
- package/components/ez-popover-plus/readme.md +105 -0
- package/components/ez-popup/readme.md +8 -7
- package/components/ez-scroller/readme.md +2 -0
- package/components/ez-search/readme.md +26 -20
- package/components/ez-skeleton/readme.md +13 -0
- package/components/ez-split-button/readme.md +2 -1
- package/components/ez-split-panel/readme.md +12 -4
- package/components/ez-split-panel/structure/item/readme.md +6 -5
- package/components/ez-text-area/readme.md +3 -1
- package/components/ez-text-edit/readme.md +2 -0
- package/components/ez-text-input/readme.md +21 -12
- package/components/ez-time-input/readme.md +3 -0
- package/components/ez-tooltip/readme.md +44 -0
- package/components/ez-tree/readme.md +5 -4
- package/package.json +1 -1
|
@@ -14,7 +14,7 @@
|
|
|
14
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
15
|
| `label` | `label` | Texto a ser apresentado como título do botão. | `string` | `undefined` |
|
|
16
16
|
| `mode` | `mode` | Define o modo de uso do botão. | `"icon" \| "label-icon" \| "link" \| "regular"` | `"regular"` |
|
|
17
|
-
| `size` | `size` | Define o tamanho do ez-button. | `"large" \| "medium" \| "small"`
|
|
17
|
+
| `size` | `size` | Define o tamanho do ez-button. | `"large" \| "medium" \| "small" \| "x-small"` | `undefined` |
|
|
18
18
|
|
|
19
19
|
|
|
20
20
|
## Methods
|
|
@@ -47,6 +47,7 @@ Type: `Promise<void>`
|
|
|
47
47
|
- [ez-actions-button](../ez-actions-button)
|
|
48
48
|
- [ez-alert-list](../ez-alert-list)
|
|
49
49
|
- [ez-dialog](../ez-dialog)
|
|
50
|
+
- [ez-double-list](../ez-double-list)
|
|
50
51
|
- [ez-grid](../ez-grid)
|
|
51
52
|
- [ez-guide-navigator](../ez-guide-navigator)
|
|
52
53
|
- [ez-modal-container](../ez-modal-container)
|
|
@@ -66,6 +67,7 @@ graph TD;
|
|
|
66
67
|
ez-actions-button --> ez-button
|
|
67
68
|
ez-alert-list --> ez-button
|
|
68
69
|
ez-dialog --> ez-button
|
|
70
|
+
ez-double-list --> ez-button
|
|
69
71
|
ez-grid --> ez-button
|
|
70
72
|
ez-guide-navigator --> ez-button
|
|
71
73
|
ez-modal-container --> ez-button
|
|
@@ -9,6 +9,7 @@
|
|
|
9
9
|
|
|
10
10
|
| Property | Attribute | Description | Type | Default |
|
|
11
11
|
| ----------- | ------------ | ------------------------------------------------------------------------------------------------------------- | ---------- | ----------- |
|
|
12
|
+
| `compacted` | `compacted` | Determina se o componente será apresentado no modo compacto. | `boolean` | `false` |
|
|
12
13
|
| `enableKey` | `enable-key` | Determina se a chave do item deve ser exibida. | `boolean` | `true` |
|
|
13
14
|
| `item` | -- | Determina o conteúdo do card. Deve conter um objeto no formato: `{title: string, key: string, details: any}`. | `CardItem` | `undefined` |
|
|
14
15
|
|
|
@@ -82,6 +82,8 @@ graph TD;
|
|
|
82
82
|
ez-collapsible-box --> ez-text-edit
|
|
83
83
|
ez-text-edit --> ez-text-input
|
|
84
84
|
ez-text-edit --> ez-button
|
|
85
|
+
ez-text-input --> ez-tooltip
|
|
86
|
+
ez-text-input --> ez-icon
|
|
85
87
|
ez-button --> ez-icon
|
|
86
88
|
ez-form-view --> ez-collapsible-box
|
|
87
89
|
style ez-collapsible-box fill:#f9f,stroke:#333,stroke-width:4px
|
|
@@ -7,24 +7,26 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property
|
|
11
|
-
|
|
|
12
|
-
| `
|
|
13
|
-
| `
|
|
14
|
-
| `
|
|
15
|
-
| `
|
|
16
|
-
| `
|
|
17
|
-
| `
|
|
18
|
-
| `
|
|
19
|
-
| `
|
|
20
|
-
| `
|
|
21
|
-
| `
|
|
22
|
-
| `
|
|
23
|
-
| `
|
|
24
|
-
| `
|
|
25
|
-
| `
|
|
26
|
-
| `
|
|
27
|
-
| `
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ---------------------------- | -------------------------------- | ------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------- | ----------- |
|
|
12
|
+
| `autoFocus` | `auto-focus` | Se true o campo de texto receberá o foco ao ser renderizado. | `boolean` | `false` |
|
|
13
|
+
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true` |
|
|
14
|
+
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
15
|
+
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
16
|
+
| `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` |
|
|
17
|
+
| `isTextSearch` | `is-text-search` | Informa se a pesquisa é do tipo texto. | `boolean` | `false` |
|
|
18
|
+
| `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined` |
|
|
19
|
+
| `limitCharsToSearch` | `limit-chars-to-search` | Define o limite de caracteres mínimo para realizar uma pesquisa | `number` | `3` |
|
|
20
|
+
| `listOptionsPosition` | -- | Define um posicionamento fixo para a lista de opções do CheckBox. | `IEzCheckBoxListPosition` | `undefined` |
|
|
21
|
+
| `mode` | `mode` | Define o tamanho do campo. | `"regular" \| "slim"` | `"regular"` |
|
|
22
|
+
| `optionLoader` | -- | Carrega as opções dinamicamente. | `(argument: ISearchArgument) => IOption \| IOption[] \| Promise<IOption[]>` | `undefined` |
|
|
23
|
+
| `options` | -- | Array com as opções do ez-combo-box. Os elementos devem obedecer o formato: `{value: string, label: string}`. | `IOption[]` | `undefined` |
|
|
24
|
+
| `showOptionValue` | `show-option-value` | Se true cada opção na lista exibe o `value` junto com `label`. | `boolean` | `false` |
|
|
25
|
+
| `showSelectedValue` | `show-selected-value` | Se true a opção selecionada exibe o `value` junto com `label`. | `boolean` | `false` |
|
|
26
|
+
| `stopPropagateEnterKeyEvent` | `stop-propagate-enter-key-event` | Se true, ineterrompe a propagação do evento de KeyDown da tecla enter | `boolean` | `true` |
|
|
27
|
+
| `suppressEmptyOption` | `suppress-empty-option` | Se true remove a opção vazia da lista. | `boolean` | `false` |
|
|
28
|
+
| `suppressSearch` | `suppress-search` | Se true desabilita a digitação dentro do componente. | `boolean` | `false` |
|
|
29
|
+
| `value` | `value` | Define o valor do campo. | `IOption \| string` | `undefined` |
|
|
28
30
|
|
|
29
31
|
|
|
30
32
|
## Events
|
|
@@ -76,7 +78,7 @@ Type: `Promise<void>`
|
|
|
76
78
|
|
|
77
79
|
|
|
78
80
|
|
|
79
|
-
### `setFocus() => Promise<void>`
|
|
81
|
+
### `setFocus(options?: TFocusOptions) => Promise<void>`
|
|
80
82
|
|
|
81
83
|
Aplica o foco no campo.
|
|
82
84
|
|
|
@@ -103,6 +105,8 @@ Type: `Promise<void>`
|
|
|
103
105
|
graph TD;
|
|
104
106
|
ez-combo-box --> ez-text-input
|
|
105
107
|
ez-combo-box --> ez-icon
|
|
108
|
+
ez-text-input --> ez-tooltip
|
|
109
|
+
ez-text-input --> ez-icon
|
|
106
110
|
ez-form-view --> ez-combo-box
|
|
107
111
|
style ez-combo-box fill:#f9f,stroke:#333,stroke-width:4px
|
|
108
112
|
```
|
|
@@ -9,6 +9,7 @@
|
|
|
9
9
|
|
|
10
10
|
| Property | Attribute | Description | Type | Default |
|
|
11
11
|
| -------------- | ---------------- | --------------------------------------------------------------------------------- | --------------------- | ----------- |
|
|
12
|
+
| `autoFocus` | `auto-focus` | Se true o campo de texto receberá o foco ao ser renderizado. | `boolean` | `false` |
|
|
12
13
|
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true` |
|
|
13
14
|
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
14
15
|
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
@@ -58,7 +59,7 @@ Type: `Promise<void>`
|
|
|
58
59
|
|
|
59
60
|
|
|
60
61
|
|
|
61
|
-
### `setFocus() => Promise<void>`
|
|
62
|
+
### `setFocus(options?: TFocusOptions) => Promise<void>`
|
|
62
63
|
|
|
63
64
|
Aplica o foco no campo.
|
|
64
65
|
|
|
@@ -85,6 +86,8 @@ Type: `Promise<void>`
|
|
|
85
86
|
graph TD;
|
|
86
87
|
ez-date-input --> ez-text-input
|
|
87
88
|
ez-date-input --> ez-calendar
|
|
89
|
+
ez-text-input --> ez-tooltip
|
|
90
|
+
ez-text-input --> ez-icon
|
|
88
91
|
ez-form-view --> ez-date-input
|
|
89
92
|
style ez-date-input fill:#f9f,stroke:#333,stroke-width:4px
|
|
90
93
|
```
|
|
@@ -9,6 +9,7 @@
|
|
|
9
9
|
|
|
10
10
|
| Property | Attribute | Description | Type | Default |
|
|
11
11
|
| -------------- | ---------------- | --------------------------------------------------------------------------------- | --------------------- | ----------- |
|
|
12
|
+
| `autoFocus` | `auto-focus` | Se true o campo de texto receberá o foco ao ser renderizado. | `boolean` | `false` |
|
|
12
13
|
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true` |
|
|
13
14
|
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
14
15
|
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
@@ -59,7 +60,7 @@ Type: `Promise<void>`
|
|
|
59
60
|
|
|
60
61
|
|
|
61
62
|
|
|
62
|
-
### `setFocus() => Promise<void>`
|
|
63
|
+
### `setFocus(options?: TFocusOptions) => Promise<void>`
|
|
63
64
|
|
|
64
65
|
Aplica o foco no campo.
|
|
65
66
|
|
|
@@ -86,6 +87,8 @@ Type: `Promise<void>`
|
|
|
86
87
|
graph TD;
|
|
87
88
|
ez-date-time-input --> ez-text-input
|
|
88
89
|
ez-date-time-input --> ez-calendar
|
|
90
|
+
ez-text-input --> ez-tooltip
|
|
91
|
+
ez-text-input --> ez-icon
|
|
89
92
|
ez-form-view --> ez-date-time-input
|
|
90
93
|
style ez-date-time-input fill:#f9f,stroke:#333,stroke-width:4px
|
|
91
94
|
```
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
# ez-double-list
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
9
|
+
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ------------------- | --------------------- | ----------------------------------------------------------------------------------- | ------------ | ---------------- |
|
|
12
|
+
| `entityLabel` | `entity-label` | Nome da entidade listada. Exemplo: "Campo", "Item", "Empresa". | `string` | `'item'` |
|
|
13
|
+
| `entityLabelPlural` | `entity-label-plural` | Variação plura do nome da entidade listada. Exemplo: "Campos", "Itens", "Empresas". | `string` | `'itens'` |
|
|
14
|
+
| `leftList` | -- | Define a lista origem. | `ListItem[]` | `[]` |
|
|
15
|
+
| `leftListLabel` | `left-list-label` | Rótulo da lista esquerda. | `string` | `'disponíveis'` |
|
|
16
|
+
| `leftTitle` | `left-title` | Define o título da lista origem. | `string` | `undefined` |
|
|
17
|
+
| `rightList` | -- | Define a lista destino. | `ListItem[]` | `[]` |
|
|
18
|
+
| `rightListLabel` | `right-list-label` | Rótulo da lista direita. | `string` | `'selecionados'` |
|
|
19
|
+
| `rightTitle` | `right-title` | Define o título da lista destino. | `string` | `undefined` |
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## Events
|
|
23
|
+
|
|
24
|
+
| Event | Description | Type |
|
|
25
|
+
| -------------------- | ----------- | ------------------------- |
|
|
26
|
+
| `ezLeftListChanged` | | `CustomEvent<ListItem[]>` |
|
|
27
|
+
| `ezRightListChanged` | | `CustomEvent<ListItem[]>` |
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
## Methods
|
|
31
|
+
|
|
32
|
+
### `resetSelectedLists() => Promise<void>`
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
#### Returns
|
|
37
|
+
|
|
38
|
+
Type: `Promise<void>`
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
|
|
43
|
+
## Dependencies
|
|
44
|
+
|
|
45
|
+
### Depends on
|
|
46
|
+
|
|
47
|
+
- [ez-scroller](../ez-scroller)
|
|
48
|
+
- [ez-list](../ez-list)
|
|
49
|
+
- [ez-filter-input](../ez-filter-input)
|
|
50
|
+
- [ez-button](../ez-button)
|
|
51
|
+
|
|
52
|
+
### Graph
|
|
53
|
+
```mermaid
|
|
54
|
+
graph TD;
|
|
55
|
+
ez-double-list --> ez-scroller
|
|
56
|
+
ez-double-list --> ez-list
|
|
57
|
+
ez-double-list --> ez-filter-input
|
|
58
|
+
ez-double-list --> ez-button
|
|
59
|
+
ez-list --> ez-check
|
|
60
|
+
ez-filter-input --> ez-text-input
|
|
61
|
+
ez-filter-input --> ez-icon
|
|
62
|
+
ez-text-input --> ez-tooltip
|
|
63
|
+
ez-text-input --> ez-icon
|
|
64
|
+
ez-button --> ez-icon
|
|
65
|
+
style ez-double-list fill:#f9f,stroke:#333,stroke-width:4px
|
|
66
|
+
```
|
|
67
|
+
|
|
68
|
+
----------------------------------------------
|
|
69
|
+
|
|
70
|
+
|
|
@@ -19,6 +19,7 @@
|
|
|
19
19
|
| Event | Description | Type |
|
|
20
20
|
| ------------------ | ------------------------------------------------------------------------------------------------------------------------------ | --------------------------------- |
|
|
21
21
|
| `ezClick` | Emitido quando ocorrer um click em um item da lista, o IDropdownItem que recebeu o click deve ser enviado como data do evento. | `CustomEvent<IDropdownItem>` |
|
|
22
|
+
| `ezHover` | Emitido quando ocorrer o ponteiro do mouse é colocado sobre um item. | `CustomEvent<IDropdownItem>` |
|
|
22
23
|
| `ezOutsideClick` | Emitido quando ocorrer um click fora do componente. | `CustomEvent<void>` |
|
|
23
24
|
| `ezSubActionClick` | Emitido quando ocorrer um click em uma ação secundaria do item, o IDropdownSubAction deve ser enviado como data do evento. | `CustomEvent<IDropdownSubAction>` |
|
|
24
25
|
|
|
@@ -32,11 +33,13 @@
|
|
|
32
33
|
|
|
33
34
|
### Depends on
|
|
34
35
|
|
|
36
|
+
- [ez-skeleton](../ez-skeleton)
|
|
35
37
|
- [ez-icon](../ez-icon)
|
|
36
38
|
|
|
37
39
|
### Graph
|
|
38
40
|
```mermaid
|
|
39
41
|
graph TD;
|
|
42
|
+
ez-dropdown --> ez-skeleton
|
|
40
43
|
ez-dropdown --> ez-icon
|
|
41
44
|
ez-breadcrumb --> ez-dropdown
|
|
42
45
|
ez-split-button --> ez-dropdown
|
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
| Property | Attribute | Description | Type | Default |
|
|
11
11
|
| -------------- | ---------------- | --------------------------------------------------------------------------------- | --------------------- | ----------- |
|
|
12
12
|
| `asyncSearch` | `async-search` | Define se o campo irá funcionar de forma assíncrona. | `boolean` | `false` |
|
|
13
|
+
| `autoFocus` | `auto-focus` | Se true o campo de texto receberá o foco ao ser renderizado. | `boolean` | `false` |
|
|
13
14
|
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true` |
|
|
14
15
|
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
15
16
|
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
@@ -60,7 +61,7 @@ Type: `Promise<void>`
|
|
|
60
61
|
|
|
61
62
|
|
|
62
63
|
|
|
63
|
-
### `setFocus() => Promise<void>`
|
|
64
|
+
### `setFocus(options?: TFocusOptions) => Promise<void>`
|
|
64
65
|
|
|
65
66
|
Aplica o foco no campo.
|
|
66
67
|
|
|
@@ -85,6 +86,7 @@ Type: `Promise<void>`
|
|
|
85
86
|
|
|
86
87
|
### Used by
|
|
87
88
|
|
|
89
|
+
- [ez-double-list](../ez-double-list)
|
|
88
90
|
- [ez-guide-navigator](../ez-guide-navigator)
|
|
89
91
|
- [ez-multi-selection-list](../ez-multi-selection-list)
|
|
90
92
|
|
|
@@ -98,6 +100,9 @@ Type: `Promise<void>`
|
|
|
98
100
|
graph TD;
|
|
99
101
|
ez-filter-input --> ez-text-input
|
|
100
102
|
ez-filter-input --> ez-icon
|
|
103
|
+
ez-text-input --> ez-tooltip
|
|
104
|
+
ez-text-input --> ez-icon
|
|
105
|
+
ez-double-list --> ez-filter-input
|
|
101
106
|
ez-guide-navigator --> ez-filter-input
|
|
102
107
|
ez-multi-selection-list --> ez-filter-input
|
|
103
108
|
style ez-filter-input fill:#f9f,stroke:#333,stroke-width:4px
|
|
@@ -88,6 +88,8 @@ graph TD;
|
|
|
88
88
|
ez-collapsible-box --> ez-text-edit
|
|
89
89
|
ez-text-edit --> ez-text-input
|
|
90
90
|
ez-text-edit --> ez-button
|
|
91
|
+
ez-text-input --> ez-tooltip
|
|
92
|
+
ez-text-input --> ez-icon
|
|
91
93
|
ez-button --> ez-icon
|
|
92
94
|
ez-combo-box --> ez-text-input
|
|
93
95
|
ez-combo-box --> ez-icon
|
|
@@ -94,6 +94,8 @@ graph TD;
|
|
|
94
94
|
ez-collapsible-box --> ez-text-edit
|
|
95
95
|
ez-text-edit --> ez-text-input
|
|
96
96
|
ez-text-edit --> ez-button
|
|
97
|
+
ez-text-input --> ez-tooltip
|
|
98
|
+
ez-text-input --> ez-icon
|
|
97
99
|
ez-button --> ez-icon
|
|
98
100
|
ez-combo-box --> ez-text-input
|
|
99
101
|
ez-combo-box --> ez-icon
|
|
@@ -7,19 +7,28 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property
|
|
11
|
-
|
|
|
12
|
-
| `autoFocus`
|
|
13
|
-
| `canEdit`
|
|
14
|
-
| `columnfilterDataSource`
|
|
15
|
-
| `
|
|
16
|
-
| `
|
|
17
|
-
| `
|
|
18
|
-
| `
|
|
19
|
-
| `
|
|
20
|
-
| `
|
|
21
|
-
| `
|
|
22
|
-
| `
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ------------------------------- | ----------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------- | ----------- |
|
|
12
|
+
| `autoFocus` | `auto-focus` | Define se a grid será focada ao ser carregada. | `boolean` | `true` |
|
|
13
|
+
| `canEdit` | `can-edit` | Define se a edição está habilitada na grid. | `boolean` | `true` |
|
|
14
|
+
| `columnfilterDataSource` | -- | Define um `IMultiSelectionListDataSource` responsável por alimentar o filtro de colunas. | `IMultiSelectionListDataSource` | `undefined` |
|
|
15
|
+
| `compact` | `compact` | Define se a grade deve ser exibida em modo compacto | `boolean` | `false` |
|
|
16
|
+
| `config` | -- | Configuração de exibição da grade. | `IGridConfig` | `undefined` |
|
|
17
|
+
| `dataUnit` | -- | Unidade de dados. Responsável pelo controle de edição de registros e informações pertinentes aos campos. | `DataUnit` | `undefined` |
|
|
18
|
+
| `enableContinuousInsert` | `enable-continuous-insert` | Ativa/desativa a inserção continua na grade Só funciona quando a prop enableGridInsert está ativa | `boolean` | `true` |
|
|
19
|
+
| `enableGridInsert` | `enable-grid-insert` | Ativa inserção de registros no modo grade. | `boolean` | `false` |
|
|
20
|
+
| `enableLockManagerLoadingComp` | `enable-lock-manager-loading-comp` | Define se o componente deve usar o LockManager para controle de carregamento da aplicação | `boolean` | `false` |
|
|
21
|
+
| `enableLockManagerTaskbarClick` | `enable-lock-manager-taskbar-click` | Ativa inserção de registros no modo grade pela Taskbar. | `boolean` | `true` |
|
|
22
|
+
| `enableRowTableStriped` | `enable-row-table-striped` | Ativa modo de linhas com cores alternadas. | `boolean` | `true` |
|
|
23
|
+
| `multipleSelection` | `multiple-selection` | Habilita a seleção de várias linhas. | `boolean` | `undefined` |
|
|
24
|
+
| `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` |
|
|
25
|
+
| `paginationCounterMode` | `pagination-counter-mode` | Define se a grid será focada ao ser carregada. | `"auto" \| "hidden" \| "show"` | `'show'` |
|
|
26
|
+
| `recordsValidator` | -- | Define um validador responsável pela integridade dos registros. | `IRecordValidator` | `undefined` |
|
|
27
|
+
| `selectionToastConfig` | -- | Configuração da seleção de grade no toast. | `ISelectionToastConfig` | `undefined` |
|
|
28
|
+
| `serverUrl` | `server-url` | Endereço do servidor para obtenção dos dados. | `string` | `undefined` |
|
|
29
|
+
| `statusResolver` | -- | Define um `IStatusResolver` responsável pelo estado da coluna de status. | `((data: object) => string) \| IStatusResolver` | `undefined` |
|
|
30
|
+
| `suppressCheckboxColumn` | `suppress-checkbox-column` | Informa se a coluna de chechbox deve ser suprimida | `boolean` | `false` |
|
|
31
|
+
| `useEnterLikeTab` | `use-enter-like-tab` | Quando verdadeiro, o ENTER fará a navegação como se fosse a tecla TAB na grade. | `boolean` | `false` |
|
|
23
32
|
|
|
24
33
|
|
|
25
34
|
## Events
|
|
@@ -75,6 +84,16 @@ Type: `Promise<void>`
|
|
|
75
84
|
|
|
76
85
|
|
|
77
86
|
|
|
87
|
+
### `checkStopEditOutsideClick(event: MouseEvent) => Promise<void>`
|
|
88
|
+
|
|
89
|
+
|
|
90
|
+
|
|
91
|
+
#### Returns
|
|
92
|
+
|
|
93
|
+
Type: `Promise<void>`
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
|
|
78
97
|
### `filterColumns(search: string) => Promise<Array<EzGridColumn>>`
|
|
79
98
|
|
|
80
99
|
Usa um argumento para filtrar as colunas po label
|
|
@@ -205,23 +224,35 @@ Type: `Promise<void>`
|
|
|
205
224
|
|
|
206
225
|
|
|
207
226
|
|
|
227
|
+
### `stopEdit() => Promise<void>`
|
|
228
|
+
|
|
229
|
+
Para a edição da grade.
|
|
230
|
+
|
|
231
|
+
#### Returns
|
|
232
|
+
|
|
233
|
+
Type: `Promise<void>`
|
|
234
|
+
|
|
235
|
+
|
|
236
|
+
|
|
208
237
|
|
|
209
238
|
## Dependencies
|
|
210
239
|
|
|
211
240
|
### Depends on
|
|
212
241
|
|
|
242
|
+
- [ez-popover](../ez-popover)
|
|
243
|
+
- [ez-icon](../ez-icon)
|
|
213
244
|
- [ez-button](../ez-button)
|
|
214
245
|
- [filter-column](subcomponents)
|
|
215
|
-
- [ez-icon](../ez-icon)
|
|
216
246
|
|
|
217
247
|
### Graph
|
|
218
248
|
```mermaid
|
|
219
249
|
graph TD;
|
|
250
|
+
ez-grid --> ez-popover
|
|
251
|
+
ez-grid --> ez-icon
|
|
220
252
|
ez-grid --> ez-button
|
|
221
253
|
ez-grid --> filter-column
|
|
222
|
-
ez-grid --> ez-icon
|
|
223
254
|
ez-button --> ez-icon
|
|
224
|
-
filter-column --> ez-popover
|
|
255
|
+
filter-column --> ez-popover-plus
|
|
225
256
|
filter-column --> ez-button
|
|
226
257
|
filter-column --> ez-multi-selection-list
|
|
227
258
|
ez-multi-selection-list --> ez-check
|
|
@@ -233,6 +264,8 @@ graph TD;
|
|
|
233
264
|
ez-list --> ez-check
|
|
234
265
|
ez-filter-input --> ez-text-input
|
|
235
266
|
ez-filter-input --> ez-icon
|
|
267
|
+
ez-text-input --> ez-tooltip
|
|
268
|
+
ez-text-input --> ez-icon
|
|
236
269
|
ez-search --> ez-card-item
|
|
237
270
|
ez-search --> ez-text-input
|
|
238
271
|
ez-search --> ez-icon
|
|
@@ -57,14 +57,14 @@ Type: `Promise<void>`
|
|
|
57
57
|
|
|
58
58
|
### Depends on
|
|
59
59
|
|
|
60
|
-
- [ez-popover](../../ez-popover)
|
|
60
|
+
- [ez-popover-plus](../../ez-popover-plus)
|
|
61
61
|
- [ez-button](../../ez-button)
|
|
62
62
|
- [ez-multi-selection-list](../../ez-multi-selection-list)
|
|
63
63
|
|
|
64
64
|
### Graph
|
|
65
65
|
```mermaid
|
|
66
66
|
graph TD;
|
|
67
|
-
filter-column --> ez-popover
|
|
67
|
+
filter-column --> ez-popover-plus
|
|
68
68
|
filter-column --> ez-button
|
|
69
69
|
filter-column --> ez-multi-selection-list
|
|
70
70
|
ez-button --> ez-icon
|
|
@@ -77,6 +77,8 @@ graph TD;
|
|
|
77
77
|
ez-list --> ez-check
|
|
78
78
|
ez-filter-input --> ez-text-input
|
|
79
79
|
ez-filter-input --> ez-icon
|
|
80
|
+
ez-text-input --> ez-tooltip
|
|
81
|
+
ez-text-input --> ez-icon
|
|
80
82
|
ez-search --> ez-card-item
|
|
81
83
|
ez-search --> ez-text-input
|
|
82
84
|
ez-search --> ez-icon
|
|
@@ -126,6 +126,8 @@ graph TD;
|
|
|
126
126
|
ez-sidebar-button --> ez-icon
|
|
127
127
|
ez-filter-input --> ez-text-input
|
|
128
128
|
ez-filter-input --> ez-icon
|
|
129
|
+
ez-text-input --> ez-tooltip
|
|
130
|
+
ez-text-input --> ez-icon
|
|
129
131
|
ez-button --> ez-icon
|
|
130
132
|
ez-tree --> ez-icon
|
|
131
133
|
style ez-guide-navigator fill:#f9f,stroke:#333,stroke-width:4px
|
|
@@ -37,6 +37,7 @@
|
|
|
37
37
|
- [ez-sidebar-button](../ez-sidebar-button)
|
|
38
38
|
- [ez-split-button](../ez-split-button)
|
|
39
39
|
- [ez-tabselector](../ez-tabselector)
|
|
40
|
+
- [ez-text-input](../ez-text-input)
|
|
40
41
|
- [ez-time-input](../ez-time-input)
|
|
41
42
|
- [ez-tree](../ez-tree)
|
|
42
43
|
|
|
@@ -62,6 +63,7 @@ graph TD;
|
|
|
62
63
|
ez-sidebar-button --> ez-icon
|
|
63
64
|
ez-split-button --> ez-icon
|
|
64
65
|
ez-tabselector --> ez-icon
|
|
66
|
+
ez-text-input --> ez-icon
|
|
65
67
|
ez-time-input --> ez-icon
|
|
66
68
|
ez-tree --> ez-icon
|
|
67
69
|
style ez-icon fill:#f9f,stroke:#333,stroke-width:4px
|
|
@@ -7,26 +7,28 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property
|
|
11
|
-
|
|
|
12
|
-
| `dataSource`
|
|
13
|
-
| `
|
|
14
|
-
| `
|
|
15
|
-
| `
|
|
16
|
-
| `
|
|
17
|
-
| `
|
|
18
|
-
| `
|
|
19
|
-
| `
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ------------------------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------- | ----------- |
|
|
12
|
+
| `dataSource` | -- | Define a lista inicial do componente. | `(ListItem \| ListGroup)[]` | `[]` |
|
|
13
|
+
| `enableMultipleSelection` | `enable-multiple-selection` | Habilita seleção de múltiplos items. | `boolean` | `false` |
|
|
14
|
+
| `ezDraggable` | `ez-draggable` | Se true habilita `drag and drop` para os itens. | `boolean` | `false` |
|
|
15
|
+
| `ezSelectable` | `ez-selectable` | Se true os itens serão selecionáveis. | `boolean` | `false` |
|
|
16
|
+
| `hoverFeedback` | `hover-feedback` | Quando verdadeiro, ativa o feedback visual ao efetuar houver nos itens da lista. | `boolean` | `false` |
|
|
17
|
+
| `itemLeftSlotBuilder` | -- | Função builder que possibilita gerar conteúdo dinâmico à esquerda do item da lista. * Observação: No react ele se transforma em VNode e não como HTMLElement. | `(item: ListItem, group?: ListGroup) => string \| HTMLElement` | `undefined` |
|
|
18
|
+
| `itemSlotBuilder` | -- | Função builder que possibilita alterar como o item da lista vai ser apresentado. Observação: No react ele se transforma em VNode e não como HTMLElement. | `(item: ListItem, group?: ListGroup) => string \| HTMLElement` | `undefined` |
|
|
19
|
+
| `listMode` | `list-mode` | Define o modo de apresentação da lista. | `"check" \| "regular"` | `'regular'` |
|
|
20
|
+
| `useGroups` | `use-groups` | Se true os grupos serão exibidos. | `boolean` | `false` |
|
|
20
21
|
|
|
21
22
|
|
|
22
23
|
## Events
|
|
23
24
|
|
|
24
|
-
| Event
|
|
25
|
-
|
|
|
26
|
-
| `ezChange`
|
|
27
|
-
| `ezCheckChange`
|
|
28
|
-
| `ezDoubleClick`
|
|
29
|
-
| `ezSelectItem`
|
|
25
|
+
| Event | Description | Type |
|
|
26
|
+
| ----------------------- | -------------------------------------------------------------- | ---------------------------------------- |
|
|
27
|
+
| `ezChange` | Emitido quando acontece a alteração de estado da lista. | `CustomEvent<(ListItem \| ListGroup)[]>` |
|
|
28
|
+
| `ezCheckChange` | Emitido quando acontece a alteração de um item do checkbox. | `CustomEvent<ListItem>` |
|
|
29
|
+
| `ezDoubleClick` | Emitido quando ocorre um duplo clique em um item da lista. | `CustomEvent<ListItem>` |
|
|
30
|
+
| `ezSelectItem` | Emitido sempre que um item da lista for selecionado. | `CustomEvent<ListItem>` |
|
|
31
|
+
| `ezSelectMultipleItems` | Emitido sempre que um ou vários item da lista for selecionado. | `CustomEvent<ListItem[]>` |
|
|
30
32
|
|
|
31
33
|
|
|
32
34
|
## Methods
|
|
@@ -81,7 +83,7 @@ Type: `Promise<void>`
|
|
|
81
83
|
|
|
82
84
|
|
|
83
85
|
|
|
84
|
-
### `setSelection(selectedItem: ListItem, scrollToOption?: boolean) => Promise<void>`
|
|
86
|
+
### `setSelection(selectedItem: ListItem, scrollToOption?: boolean, shitkey?: boolean, ctrlKey?: boolean) => Promise<void>`
|
|
85
87
|
|
|
86
88
|
Aplica seleção nas linhas da lista.
|
|
87
89
|
|
|
@@ -97,6 +99,7 @@ Type: `Promise<void>`
|
|
|
97
99
|
### Used by
|
|
98
100
|
|
|
99
101
|
- [ez-alert-list](../ez-alert-list)
|
|
102
|
+
- [ez-double-list](../ez-double-list)
|
|
100
103
|
- [ez-multi-selection-list](../ez-multi-selection-list)
|
|
101
104
|
|
|
102
105
|
### Depends on
|
|
@@ -108,6 +111,7 @@ Type: `Promise<void>`
|
|
|
108
111
|
graph TD;
|
|
109
112
|
ez-list --> ez-check
|
|
110
113
|
ez-alert-list --> ez-list
|
|
114
|
+
ez-double-list --> ez-list
|
|
111
115
|
ez-multi-selection-list --> ez-list
|
|
112
116
|
style ez-list fill:#f9f,stroke:#333,stroke-width:4px
|
|
113
117
|
```
|
|
@@ -7,16 +7,16 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property | Attribute | Description | Type
|
|
11
|
-
| ------------------- | --------------------- | ---------------------------------------------------------------------------------------------------- |
|
|
12
|
-
| `align` | `align` | Define o alinhamento do ez-modal. | `"left" \| "right"`
|
|
13
|
-
| `closeEsc` | `close-esc` | Define se o ez-modal será fechado ao clicar `ESC`. | `boolean`
|
|
14
|
-
| `closeOutsideClick` | `close-outside-click` | Define se o modal será fechado ao clicar fora do conteúdo. | `boolean`
|
|
15
|
-
| `closeOutsideLeave` | `close-outside-leave` | Define se o modal será fechado se o mouse sair para fora do conteúdo. | `boolean`
|
|
16
|
-
| `heightMode` | `height-mode` | Ativa o modo Full, permitindo que o Modal expanda-se verticalmente e ocupe todo o espaço disponível. | `"full" \| "regular"`
|
|
17
|
-
| `modalSize` | `modal-size` | Define o tamanho do ez-modal. Devem ser definidas seguindo grid-layout. Exemplo: `col-sd-3`. | `string`
|
|
18
|
-
| `opened` | `opened` | Define se o ez-modal está aberto. | `boolean`
|
|
19
|
-
| `scrim` | `scrim` | Define o tipo de scrim a ser aplicado no overlay do modal | `"light" \| "medium"` | `"medium"` |
|
|
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
|
+
| `closeOutsideLeave` | `close-outside-leave` | Define se o modal será fechado se o mouse sair para fora do conteúdo. | `boolean` | `false` |
|
|
16
|
+
| `heightMode` | `height-mode` | Ativa o modo Full, permitindo que o Modal expanda-se verticalmente e ocupe todo o espaço disponível. | `"full" \| "regular"` | `"regular"` |
|
|
17
|
+
| `modalSize` | `modal-size` | Define o tamanho do ez-modal. Devem ser definidas seguindo grid-layout. Exemplo: `col-sd-3`. | `string` | `undefined` |
|
|
18
|
+
| `opened` | `opened` | Define se o ez-modal está aberto. | `boolean` | `true` |
|
|
19
|
+
| `scrim` | `scrim` | Define o tipo de scrim a ser aplicado no overlay do modal | `"light" \| "medium" \| "none"` | `"medium"` |
|
|
20
20
|
|
|
21
21
|
|
|
22
22
|
## Events
|
|
@@ -9,6 +9,8 @@
|
|
|
9
9
|
|
|
10
10
|
| Property | Attribute | Description | Type | Default |
|
|
11
11
|
| ----------------- | ------------------ | ---------------------------------------------------------------------------------------------------------------------- | --------------------- | ----------- |
|
|
12
|
+
| `allowNegative` | `allow-negative` | Se false, o input não aceitará números negativos. | `boolean` | `true` |
|
|
13
|
+
| `autoFocus` | `auto-focus` | Se true o campo de texto receberá o foco ao ser renderizado. | `boolean` | `false` |
|
|
12
14
|
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true` |
|
|
13
15
|
| `enabled` | `enabled` | Se false, o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
14
16
|
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
@@ -85,6 +87,8 @@ Type: `Promise<void>`
|
|
|
85
87
|
```mermaid
|
|
86
88
|
graph TD;
|
|
87
89
|
ez-number-input --> ez-text-input
|
|
90
|
+
ez-text-input --> ez-tooltip
|
|
91
|
+
ez-text-input --> ez-icon
|
|
88
92
|
ez-form-view --> ez-number-input
|
|
89
93
|
style ez-number-input fill:#f9f,stroke:#333,stroke-width:4px
|
|
90
94
|
```
|
|
@@ -70,12 +70,12 @@ Type: `Promise<void>`
|
|
|
70
70
|
|
|
71
71
|
### Used by
|
|
72
72
|
|
|
73
|
-
- [
|
|
73
|
+
- [ez-grid](../ez-grid)
|
|
74
74
|
|
|
75
75
|
### Graph
|
|
76
76
|
```mermaid
|
|
77
77
|
graph TD;
|
|
78
|
-
|
|
78
|
+
ez-grid --> ez-popover
|
|
79
79
|
style ez-popover fill:#f9f,stroke:#333,stroke-width:4px
|
|
80
80
|
```
|
|
81
81
|
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
# ez-popover-plus
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
9
|
+
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| --------------- | ---------------- | --------------------------------------------------------------------------------- | ------------------------------- | -------------------------------------------------------- |
|
|
12
|
+
| `anchorElement` | `anchor-element` | Define o elemento de ancoragem. | `HTMLElement \| string` | `undefined` |
|
|
13
|
+
| `autoClose` | `auto-close` | Define que será fechado automaticamente quando o usuário clicar fora do conteúdo. | `boolean` | `true` |
|
|
14
|
+
| `boxWidth` | `box-width` | Ajusta o comportamento da largura do popover. | `"fit-content" \| "full-width"` | `"fit-content"` |
|
|
15
|
+
| `opened` | `opened` | Define se o ez-popover está aberto. | `boolean` | `false` |
|
|
16
|
+
| `options` | -- | Define as opções do elemento. | `IEzPopoverAnchorOptions` | `{ horizontalGap: 0, verticalGap: 0, fromRight: false }` |
|
|
17
|
+
| `overlayType` | `overlay-type` | Define o tipo de overlay do popover. | `"light" \| "medium" \| "none"` | `"light"` |
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
## Events
|
|
21
|
+
|
|
22
|
+
| Event | Description | Type |
|
|
23
|
+
| -------------------- | ------------------------------------------------------------ | ---------------------- |
|
|
24
|
+
| `ezVisibilityChange` | Emitido quando acontece a alteração de estado do componente. | `CustomEvent<boolean>` |
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
## Methods
|
|
28
|
+
|
|
29
|
+
### `hide() => Promise<void>`
|
|
30
|
+
|
|
31
|
+
Oculta o ez-popover.
|
|
32
|
+
|
|
33
|
+
#### Returns
|
|
34
|
+
|
|
35
|
+
Type: `Promise<void>`
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
### `setAnchorElement(anchor: HTMLElement | string) => Promise<void>`
|
|
40
|
+
|
|
41
|
+
Altera o elemento de ancoragem.
|
|
42
|
+
|
|
43
|
+
#### Returns
|
|
44
|
+
|
|
45
|
+
Type: `Promise<void>`
|
|
46
|
+
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
### `setOptions(options: IEzPopoverAnchorOptions) => Promise<void>`
|
|
50
|
+
|
|
51
|
+
Altera as opções.
|
|
52
|
+
|
|
53
|
+
#### Returns
|
|
54
|
+
|
|
55
|
+
Type: `Promise<void>`
|
|
56
|
+
|
|
57
|
+
|
|
58
|
+
|
|
59
|
+
### `show(top?: string | number, left?: string | number) => Promise<void>`
|
|
60
|
+
|
|
61
|
+
Exibe o ez-popover.
|
|
62
|
+
|
|
63
|
+
#### Returns
|
|
64
|
+
|
|
65
|
+
Type: `Promise<void>`
|
|
66
|
+
|
|
67
|
+
|
|
68
|
+
|
|
69
|
+
### `showUnder(element: HTMLElement | string, options?: IEzPopoverAnchorOptions) => Promise<void>`
|
|
70
|
+
|
|
71
|
+
Ancora a exibição do popOver a um elemento HTML.
|
|
72
|
+
|
|
73
|
+
#### Returns
|
|
74
|
+
|
|
75
|
+
Type: `Promise<void>`
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
|
|
79
|
+
### `updatePosition(top?: string, left?: string) => Promise<void>`
|
|
80
|
+
|
|
81
|
+
Atualiza a posição do popover.
|
|
82
|
+
|
|
83
|
+
#### Returns
|
|
84
|
+
|
|
85
|
+
Type: `Promise<void>`
|
|
86
|
+
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
|
|
90
|
+
## Dependencies
|
|
91
|
+
|
|
92
|
+
### Used by
|
|
93
|
+
|
|
94
|
+
- [filter-column](../ez-grid/subcomponents)
|
|
95
|
+
|
|
96
|
+
### Graph
|
|
97
|
+
```mermaid
|
|
98
|
+
graph TD;
|
|
99
|
+
filter-column --> ez-popover-plus
|
|
100
|
+
style ez-popover-plus fill:#f9f,stroke:#333,stroke-width:4px
|
|
101
|
+
```
|
|
102
|
+
|
|
103
|
+
----------------------------------------------
|
|
104
|
+
|
|
105
|
+
|
|
@@ -7,13 +7,14 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property
|
|
11
|
-
|
|
|
12
|
-
| `
|
|
13
|
-
| `
|
|
14
|
-
| `
|
|
15
|
-
| `
|
|
16
|
-
| `
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| --------------- | ---------------- | ------------------------------------------------------------- | -------------------------------------------------------------------- | ----------- |
|
|
12
|
+
| `enabledScroll` | `enabled-scroll` | Possibilita scroll vertical no conteúdo interno do componente | `boolean` | `false` |
|
|
13
|
+
| `ezTitle` | `ez-title` | Texto a ser apresentado como título do componente. | `string` | `undefined` |
|
|
14
|
+
| `heightMode` | `height-mode` | Define altura do componente. | `"auto" \| "full"` | `"full"` |
|
|
15
|
+
| `opened` | `opened` | Define se o ez-popover está aberto. | `boolean` | `false` |
|
|
16
|
+
| `size` | `size` | Define a largura do ez-popup. | `"auto" \| "large" \| "medium" \| "small" \| "x-large" \| "x-small"` | `"medium"` |
|
|
17
|
+
| `useHeader` | `use-header` | Define se o componente utilizará cabeçalho. | `boolean` | `true` |
|
|
17
18
|
|
|
18
19
|
|
|
19
20
|
## Events
|
|
@@ -18,12 +18,14 @@
|
|
|
18
18
|
|
|
19
19
|
### Used by
|
|
20
20
|
|
|
21
|
+
- [ez-double-list](../ez-double-list)
|
|
21
22
|
- [ez-guide-navigator](../ez-guide-navigator)
|
|
22
23
|
- [ez-sidebar-navigator](../ez-sidebar-navigator)
|
|
23
24
|
|
|
24
25
|
### Graph
|
|
25
26
|
```mermaid
|
|
26
27
|
graph TD;
|
|
28
|
+
ez-double-list --> ez-scroller
|
|
27
29
|
ez-guide-navigator --> ez-scroller
|
|
28
30
|
ez-sidebar-navigator --> ez-scroller
|
|
29
31
|
style ez-scroller fill:#f9f,stroke:#333,stroke-width:4px
|
|
@@ -7,25 +7,29 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property
|
|
11
|
-
|
|
|
12
|
-
| `
|
|
13
|
-
| `
|
|
14
|
-
| `
|
|
15
|
-
| `
|
|
16
|
-
| `
|
|
17
|
-
| `
|
|
18
|
-
| `
|
|
19
|
-
| `
|
|
20
|
-
| `
|
|
21
|
-
| `
|
|
22
|
-
| `
|
|
23
|
-
| `
|
|
24
|
-
| `
|
|
25
|
-
| `
|
|
26
|
-
| `
|
|
27
|
-
| `
|
|
28
|
-
| `
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ---------------------------- | -------------------------------- | ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------ | ----------- |
|
|
12
|
+
| `autoFocus` | `auto-focus` | Se true o campo de texto receberá o foco ao ser renderizado. | `boolean` | `false` |
|
|
13
|
+
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true` |
|
|
14
|
+
| `contextProperties` | `context-properties` | Propriedades de contexto da aplicação. | `any` | `undefined` |
|
|
15
|
+
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
16
|
+
| `ensureClearButtonVisible` | `ensure-clear-button-visible` | Garante que o botão de limpar pesquisa está sempre visível | `boolean` | `false` |
|
|
17
|
+
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
18
|
+
| `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` |
|
|
19
|
+
| `ignoreLimitCharsToSearch` | `ignore-limit-chars-to-search` | Define se deve ignorar o limite de caracteres mínimo para realizar uma pesquisa | `boolean` | `false` |
|
|
20
|
+
| `isTextSearch` | `is-text-search` | Informa se a pesquisa é do tipo texto. | `boolean` | `false` |
|
|
21
|
+
| `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined` |
|
|
22
|
+
| `listOptionsPosition` | -- | Define um posicionamento fixo para a lista de opções do CheckBox. | `IEzCheckBoxListPosition` | `undefined` |
|
|
23
|
+
| `mode` | `mode` | Define o tamanho do campo. | `"regular" \| "slim"` | `"regular"` |
|
|
24
|
+
| `optionLoader` | -- | Carrega as opções dinamicamente. | `(argument: ISearchArgument, ctxProperties?: any) => IOption \| IOption[] \| Promise<IOption[]>` | `undefined` |
|
|
25
|
+
| `options` | -- | Array com as opções do ez-combo-box. Os elementos devem obedecer o formato: `{value: string, label: string}`. | `IOption[]` | `undefined` |
|
|
26
|
+
| `showOptionValue` | `show-option-value` | Se false cada opção na lista deve exibir somente o `label`. | `boolean` | `true` |
|
|
27
|
+
| `showSelectedValue` | `show-selected-value` | Se false a opção selecionada deve exibir somente o `label`. | `boolean` | `true` |
|
|
28
|
+
| `stopPropagateEnterKeyEvent` | `stop-propagate-enter-key-event` | Se true, ineterrompe a propagação do evento de KeyDown da tecla enter | `boolean` | `false` |
|
|
29
|
+
| `suppressEmptyOption` | `suppress-empty-option` | Se true remove a opção vazia da lista. | `boolean` | `false` |
|
|
30
|
+
| `suppressPreLoad` | `suppress-pre-load` | Se true, desabilita pré-load das opções ao carregar componente | `boolean` | `true` |
|
|
31
|
+
| `suppressSearch` | `suppress-search` | Se true desabilita a digitação dentro do componente. | `boolean` | `false` |
|
|
32
|
+
| `value` | `value` | Define o valor do campo. | `IOption \| string` | `undefined` |
|
|
29
33
|
|
|
30
34
|
|
|
31
35
|
## Events
|
|
@@ -77,7 +81,7 @@ Type: `Promise<void>`
|
|
|
77
81
|
|
|
78
82
|
|
|
79
83
|
|
|
80
|
-
### `setFocus() => Promise<void>`
|
|
84
|
+
### `setFocus(options?: TFocusOptions) => Promise<void>`
|
|
81
85
|
|
|
82
86
|
Aplica o foco no campo.
|
|
83
87
|
|
|
@@ -107,6 +111,8 @@ graph TD;
|
|
|
107
111
|
ez-search --> ez-card-item
|
|
108
112
|
ez-search --> ez-text-input
|
|
109
113
|
ez-search --> ez-icon
|
|
114
|
+
ez-text-input --> ez-tooltip
|
|
115
|
+
ez-text-input --> ez-icon
|
|
110
116
|
ez-form-view --> ez-search
|
|
111
117
|
ez-multi-selection-list --> ez-search
|
|
112
118
|
style ez-search fill:#f9f,stroke:#333,stroke-width:4px
|
|
@@ -17,6 +17,19 @@
|
|
|
17
17
|
| `width` | `width` | Width of the skeleton ex. 100px, 100%, auto etc. | `string` | `null` |
|
|
18
18
|
|
|
19
19
|
|
|
20
|
+
## Dependencies
|
|
21
|
+
|
|
22
|
+
### Used by
|
|
23
|
+
|
|
24
|
+
- [ez-dropdown](../ez-dropdown)
|
|
25
|
+
|
|
26
|
+
### Graph
|
|
27
|
+
```mermaid
|
|
28
|
+
graph TD;
|
|
29
|
+
ez-dropdown --> ez-skeleton
|
|
30
|
+
style ez-skeleton fill:#f9f,stroke:#333,stroke-width:4px
|
|
31
|
+
```
|
|
32
|
+
|
|
20
33
|
----------------------------------------------
|
|
21
34
|
|
|
22
35
|
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
| `leftTitle` | `left-title` | Texto a ser apresentado como title do botão principal | `string` | `undefined` |
|
|
18
18
|
| `mode` | `mode` | Define o modo de uso do botão. | `"default" \| "icon-left" \| "icon-only"` | `'default'` |
|
|
19
19
|
| `rightTitle` | `right-title` | Texto a ser apresentado como title do botão dropdown | `string` | `'Mais opções'` |
|
|
20
|
-
| `size` | `size` | Define o tamanho do ez-split-button. | `"large" \| "medium"`
|
|
20
|
+
| `size` | `size` | Define o tamanho do ez-split-button. | `"large" \| "medium" \| "small"` | `'medium'` |
|
|
21
21
|
|
|
22
22
|
|
|
23
23
|
## Events
|
|
@@ -74,6 +74,7 @@ Type: `Promise<void>`
|
|
|
74
74
|
graph TD;
|
|
75
75
|
ez-split-button --> ez-icon
|
|
76
76
|
ez-split-button --> ez-dropdown
|
|
77
|
+
ez-dropdown --> ez-skeleton
|
|
77
78
|
ez-dropdown --> ez-icon
|
|
78
79
|
style ez-split-button fill:#f9f,stroke:#333,stroke-width:4px
|
|
79
80
|
```
|
|
@@ -7,10 +7,18 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property | Attribute | Description
|
|
11
|
-
| ---------------- | ------------------ |
|
|
12
|
-
| `anchorToExpand` | `anchor-to-expand` | Responsável por definir o painel que limita o tamanho do item expandido.
|
|
13
|
-
| `direction` | `direction` |
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ---------------- | ------------------ | -------------------------------------------------------------------------------------- | ------------------- | ---------- |
|
|
12
|
+
| `anchorToExpand` | `anchor-to-expand` | Responsável por definir o painel que limita o tamanho do item expandido. | `boolean` | `false` |
|
|
13
|
+
| `direction` | `direction` | | `"column" \| "row"` | `'column'` |
|
|
14
|
+
| `structural` | `structural` | Define se o painel está sendo utilizado como estrutura para apresentação de outro item | `boolean` | `false` |
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
## Events
|
|
18
|
+
|
|
19
|
+
| Event | Description | Type |
|
|
20
|
+
| ----------- | ----------- | ----------------------------- |
|
|
21
|
+
| `resizeEnd` | | `CustomEvent<IPanelSizeInfo>` |
|
|
14
22
|
|
|
15
23
|
|
|
16
24
|
## Methods
|
|
@@ -7,11 +7,12 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property | Attribute | Description
|
|
11
|
-
| -------------- | --------------- |
|
|
12
|
-
| `enableExpand` | `enable-expand` | Define se o item pode ser expandido
|
|
13
|
-
| `label` | `label` | Define um título para o painel.
|
|
14
|
-
| `size` | `size` | Define o tamanho inicial do painel.
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| -------------- | --------------- | -------------------------------------------------------------------------------------- | --------- | ----------- |
|
|
12
|
+
| `enableExpand` | `enable-expand` | Define se o item pode ser expandido | `boolean` | `true` |
|
|
13
|
+
| `label` | `label` | Define um título para o painel. | `string` | `undefined` |
|
|
14
|
+
| `size` | `size` | Define o tamanho inicial do painel. | `string` | `undefined` |
|
|
15
|
+
| `structural` | `structural` | Define se o painel está sendo utilizado como estrutura para apresentação de outro item | `boolean` | `false` |
|
|
15
16
|
|
|
16
17
|
|
|
17
18
|
## Dependencies
|
|
@@ -9,8 +9,10 @@
|
|
|
9
9
|
|
|
10
10
|
| Property | Attribute | Description | Type | Default |
|
|
11
11
|
| -------------- | ---------------- | --------------------------------------------------------------------------------- | --------------------- | ----------- |
|
|
12
|
+
| `autoFocus` | `auto-focus` | Se true o campo de texto receberá o foco ao ser renderizado. | `boolean` | `false` |
|
|
13
|
+
| `autoRows` | `auto-rows` | Ativa a opção de fazer as linhas do componente serem baseados na altura máxima. | `boolean` | `false` |
|
|
12
14
|
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true` |
|
|
13
|
-
| `enableResize` | `enable-resize` | Ativa a opção de fazer resize do input. | `boolean` | `
|
|
15
|
+
| `enableResize` | `enable-resize` | Ativa a opção de fazer resize do input. | `boolean` | `true` |
|
|
14
16
|
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
15
17
|
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
16
18
|
| `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined` |
|
|
@@ -50,6 +50,8 @@ Type: `Promise<void>`
|
|
|
50
50
|
graph TD;
|
|
51
51
|
ez-text-edit --> ez-text-input
|
|
52
52
|
ez-text-edit --> ez-button
|
|
53
|
+
ez-text-input --> ez-tooltip
|
|
54
|
+
ez-text-input --> ez-icon
|
|
53
55
|
ez-button --> ez-icon
|
|
54
56
|
ez-collapsible-box --> ez-text-edit
|
|
55
57
|
style ez-text-edit fill:#f9f,stroke:#333,stroke-width:4px
|
|
@@ -7,18 +7,20 @@
|
|
|
7
7
|
|
|
8
8
|
## Properties
|
|
9
9
|
|
|
10
|
-
| Property
|
|
11
|
-
|
|
|
12
|
-
| `
|
|
13
|
-
| `
|
|
14
|
-
| `
|
|
15
|
-
| `
|
|
16
|
-
| `
|
|
17
|
-
| `
|
|
18
|
-
| `
|
|
19
|
-
| `
|
|
20
|
-
| `
|
|
21
|
-
| `
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ---------------- | ------------------ | --------------------------------------------------------------------------------- | --------------------- | ----------- |
|
|
12
|
+
| `autoFocus` | `auto-focus` | Se true o campo receberá o foco ao ser renderizado. | `boolean` | `false` |
|
|
13
|
+
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true` |
|
|
14
|
+
| `cleanValueMask` | `clean-value-mask` | Para remover a máscara quando fizer um apply no formulário. | `boolean` | `false` |
|
|
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
|
+
| `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined` |
|
|
18
|
+
| `mask` | `mask` | Aplica uma máscara no conteúdo conforme o padrão estabelecido | `string` | `undefined` |
|
|
19
|
+
| `mode` | `mode` | Define o tamanho do campo. | `"regular" \| "slim"` | `"regular"` |
|
|
20
|
+
| `noBorder` | `no-border` | Se true o campo não terá bordas. | `boolean` | `false` |
|
|
21
|
+
| `password` | `password` | Se true o campo não terá bordas. | `boolean` | `false` |
|
|
22
|
+
| `restrict` | `restrict` | Restringe o que o usuário pode digitar. | `string` | `undefined` |
|
|
23
|
+
| `value` | `value` | Define o valor do campo. | `string` | `undefined` |
|
|
22
24
|
|
|
23
25
|
|
|
24
26
|
## Events
|
|
@@ -75,9 +77,16 @@ Type: `Promise<void>`
|
|
|
75
77
|
- [ez-text-edit](../ez-text-edit)
|
|
76
78
|
- [ez-time-input](../ez-time-input)
|
|
77
79
|
|
|
80
|
+
### Depends on
|
|
81
|
+
|
|
82
|
+
- [ez-tooltip](../ez-tooltip)
|
|
83
|
+
- [ez-icon](../ez-icon)
|
|
84
|
+
|
|
78
85
|
### Graph
|
|
79
86
|
```mermaid
|
|
80
87
|
graph TD;
|
|
88
|
+
ez-text-input --> ez-tooltip
|
|
89
|
+
ez-text-input --> ez-icon
|
|
81
90
|
ez-combo-box --> ez-text-input
|
|
82
91
|
ez-date-input --> ez-text-input
|
|
83
92
|
ez-date-time-input --> ez-text-input
|
|
@@ -9,6 +9,7 @@
|
|
|
9
9
|
|
|
10
10
|
| Property | Attribute | Description | Type | Default |
|
|
11
11
|
| -------------- | ---------------- | --------------------------------------------------------------------------------- | --------------------- | ----------- |
|
|
12
|
+
| `autoFocus` | `auto-focus` | Se true o campo de texto receberá o foco ao ser renderizado. | `boolean` | `false` |
|
|
12
13
|
| `canShowError` | `can-show-error` | Se false deixa de exibir a mensagem de erro dentro do campo. | `boolean` | `true` |
|
|
13
14
|
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
14
15
|
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
@@ -76,6 +77,8 @@ Type: `Promise<void>`
|
|
|
76
77
|
graph TD;
|
|
77
78
|
ez-time-input --> ez-text-input
|
|
78
79
|
ez-time-input --> ez-icon
|
|
80
|
+
ez-text-input --> ez-tooltip
|
|
81
|
+
ez-text-input --> ez-icon
|
|
79
82
|
ez-form-view --> ez-time-input
|
|
80
83
|
style ez-time-input fill:#f9f,stroke:#333,stroke-width:4px
|
|
81
84
|
```
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
# ez-tooltip
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
9
|
+
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ------------------ | --------------- | ----------------------------------------------------------- | ------------- | ----------- |
|
|
12
|
+
| `anchoringElement` | -- | Elemento HTML que será utilizado como ancoragem do tooltip. | `HTMLElement` | `undefined` |
|
|
13
|
+
| `errorMessage` | `error-message` | Mensagem de erro que será apresentada no tooltip. | `string` | `undefined` |
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
## Methods
|
|
17
|
+
|
|
18
|
+
### `positionTooltip() => Promise<void>`
|
|
19
|
+
|
|
20
|
+
Reposiciona o tooltip de acordo com a posição do elemento de ancoragem.
|
|
21
|
+
|
|
22
|
+
#### Returns
|
|
23
|
+
|
|
24
|
+
Type: `Promise<void>`
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
## Dependencies
|
|
30
|
+
|
|
31
|
+
### Used by
|
|
32
|
+
|
|
33
|
+
- [ez-text-input](../ez-text-input)
|
|
34
|
+
|
|
35
|
+
### Graph
|
|
36
|
+
```mermaid
|
|
37
|
+
graph TD;
|
|
38
|
+
ez-text-input --> ez-tooltip
|
|
39
|
+
style ez-tooltip fill:#f9f,stroke:#333,stroke-width:4px
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
----------------------------------------------
|
|
43
|
+
|
|
44
|
+
|
|
@@ -18,10 +18,11 @@
|
|
|
18
18
|
|
|
19
19
|
## Events
|
|
20
20
|
|
|
21
|
-
| Event
|
|
22
|
-
|
|
|
23
|
-
| `ezChange`
|
|
24
|
-
| `
|
|
21
|
+
| Event | Description | Type |
|
|
22
|
+
| --------------- | ------------------------------------------------- | ------------------------ |
|
|
23
|
+
| `ezChange` | Emitido quando um item é selecionado na árvore. | `CustomEvent<ITreeItem>` |
|
|
24
|
+
| `ezDbClickItem` | Emitido ao dar clique duplo em um item da árvore. | `CustomEvent<ITreeItem>` |
|
|
25
|
+
| `ezOpenItem` | Emitido quando um item é aberto na árvore. | `CustomEvent<ITreeItem>` |
|
|
25
26
|
|
|
26
27
|
|
|
27
28
|
## Methods
|