@sankhyalabs/ezui-docs 6.4.0-dev.2 → 6.4.0-dev.4
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.
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
# ez-classic-combo-box
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
9
|
+
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| --------------------- | ----------------------- | --------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------ | ----------- |
|
|
12
|
+
| `enabled` | `enabled` | Define se o combo box está habilitado. | `boolean` | `true` |
|
|
13
|
+
| `helpText` | `help-text` | Texto de ajuda exibido abaixo do combo box. | `string` | `undefined` |
|
|
14
|
+
| `iconClickable` | `icon-clickable` | Define se o ícone é clicável | `boolean` | `false` |
|
|
15
|
+
| `iconName` | `icon-name` | Nome do ícone. | `string` | `undefined` |
|
|
16
|
+
| `label` | `label` | Texto do label exibido acima do combo box. | `string` | `undefined` |
|
|
17
|
+
| `name` | `name` | Nome do combo box. | `string` | `undefined` |
|
|
18
|
+
| `options` | -- | Array com as opções do ez-classic-combo-box. Os elementos devem obedecer o formato: `{value: string, label: string}`. | `IOption[]` | `undefined` |
|
|
19
|
+
| `placeholder` | `placeholder` | Placeholder do combo box | `string` | `undefined` |
|
|
20
|
+
| `readonly` | `readonly` | Define se o combo box é somente leitura. | `boolean` | `false` |
|
|
21
|
+
| `state` | `state` | Estado visual do combo box: default, error, success ou warning. | `"default" \| "error" \| "success" \| "warning"` | `"default"` |
|
|
22
|
+
| `suppressEmptyOption` | `suppress-empty-option` | Se true remove a opção vazia da lista. | `boolean` | `false` |
|
|
23
|
+
| `suppressSearch` | `suppress-search` | Se true desabilita a digitação dentro do componente. | `boolean` | `false` |
|
|
24
|
+
| `textEmptyOption` | `text-empty-option` | Texto a ser apresentado na opção de valor nulo. | `string` | `undefined` |
|
|
25
|
+
| `titleIcon` | `title-icon` | Título do ícone (tooltip). | `string` | `undefined` |
|
|
26
|
+
| `value` | -- | Valor do combo box. | `IOption` | `null` |
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
## Events
|
|
30
|
+
|
|
31
|
+
| Event | Description | Type |
|
|
32
|
+
| -------------------- | --------------------------------------------------------- | ---------------------- |
|
|
33
|
+
| `ezBlur` | Evento disparado quando o combo box perde o foco. | `CustomEvent<IOption>` |
|
|
34
|
+
| `ezChange` | Evento disparado quando o valor do combo box muda. | `CustomEvent<IOption>` |
|
|
35
|
+
| `ezType` | Emitido quando é digitado no campo de entrada. | `CustomEvent<string>` |
|
|
36
|
+
| `ezVisibilityChange` | Emitido quando acontece a alteração de estado do popover. | `CustomEvent<boolean>` |
|
|
37
|
+
| `iconClick` | Evento disparado quando o ícone é clicado. | `CustomEvent<void>` |
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
## Methods
|
|
41
|
+
|
|
42
|
+
### `hidePopover() => Promise<void>`
|
|
43
|
+
|
|
44
|
+
Oculta o popover.
|
|
45
|
+
|
|
46
|
+
#### Returns
|
|
47
|
+
|
|
48
|
+
Type: `Promise<void>`
|
|
49
|
+
|
|
50
|
+
---
|
|
51
|
+
|
|
52
|
+
### `setBlur() => Promise<void>`
|
|
53
|
+
|
|
54
|
+
Remove o foco do campo.
|
|
55
|
+
|
|
56
|
+
#### Returns
|
|
57
|
+
|
|
58
|
+
Type: `Promise<void>`
|
|
59
|
+
|
|
60
|
+
---
|
|
61
|
+
|
|
62
|
+
### `setFocus(option?: OptionsSetFocus) => Promise<void>`
|
|
63
|
+
|
|
64
|
+
Aplica o foco no campo.
|
|
65
|
+
|
|
66
|
+
#### Returns
|
|
67
|
+
|
|
68
|
+
Type: `Promise<void>`
|
|
69
|
+
|
|
70
|
+
---
|
|
71
|
+
|
|
72
|
+
### `setValue(option: IOption) => Promise<void>`
|
|
73
|
+
|
|
74
|
+
|
|
75
|
+
|
|
76
|
+
#### Returns
|
|
77
|
+
|
|
78
|
+
Type: `Promise<void>`
|
|
79
|
+
|
|
80
|
+
---
|
|
81
|
+
|
|
82
|
+
### `showPopover() => Promise<void>`
|
|
83
|
+
|
|
84
|
+
Exibe o popover abaixo do input.
|
|
85
|
+
|
|
86
|
+
#### Returns
|
|
87
|
+
|
|
88
|
+
Type: `Promise<void>`
|
|
89
|
+
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
## Dependencies
|
|
94
|
+
|
|
95
|
+
### Depends on
|
|
96
|
+
|
|
97
|
+
- [ez-classic-input](../ez-classic-input)
|
|
98
|
+
- [ez-popover-core](../ez-popover-plus/subcomponent)
|
|
99
|
+
|
|
100
|
+
### Graph
|
|
101
|
+
```mermaid
|
|
102
|
+
graph TD;
|
|
103
|
+
ez-classic-combo-box --> ez-classic-input
|
|
104
|
+
ez-classic-combo-box --> ez-popover-core
|
|
105
|
+
ez-classic-input --> ez-icon
|
|
106
|
+
style ez-classic-combo-box fill:#f9f,stroke:#333,stroke-width:4px
|
|
107
|
+
```
|
|
108
|
+
|
|
109
|
+
----------------------------------------------
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
|
|
113
|
+
|
|
114
|
+
## CSS Variables
|
|
115
|
+
| Variable | Description |
|
|
116
|
+
|-|-|
|
|
117
|
+
| --ez-classic-combo-box-highlighted-bg-color | Define a cor da seleção do item. |
|
|
118
|
+
| --ez-classic-combo-box-max-height | Define a altura máxima do container da lista de opções. |
|
|
119
|
+
| --ez-classic-combo-box-list-bg-color | Define a cor de fundo da lista de opções. |
|
|
120
|
+
| --ez-classic-combo-box-item-hover-bg-color | Define a cor de fundo do item em hover. |
|
|
121
|
+
| --ez-classic-combo-box-selected-bg-color | Define a cor de fundo do item selecionado. |
|
|
122
|
+
| --ez-classic-combo-box-selected-text-color | Define a cor do texto do item selecionado. |
|
|
123
|
+
| --ez-classic-combo-box-selected-font-weight | Define o peso da fonte do item selecionado. |
|
|
124
|
+
| --ez-classic-combo-box-item-padding | Define o padding interno dos itens da lista. |
|
|
125
|
+
| --ez-classic-combo-box-item-border-radius | Define o border-radius dos itens da lista. |
|
|
126
|
+
| --ez-classic-combo-box-list-margin | Define a margem da lista de opções. |
|
|
127
|
+
| --ez-classic-combo-box-transition-duration | Define a duração da transição dos itens. |
|
|
128
|
+
| --ez-classic-combo-box-scrollbar-color | Define a cor da scrollbar. |
|
|
129
|
+
| --ez-classic-combo-box-no-results-margin | Define a margem do texto "sem resultados". |
|
|
130
|
+
| --ez-classic-combo-box-item-text-color | Define a cor do texto dos itens. |
|
|
131
|
+
| --ez-classic-combo-box-item-min-height | Define a altura mínima dos itens da lista. |
|
|
@@ -36,6 +36,7 @@
|
|
|
36
36
|
| ----------- | -------------------------------------------------------------------------------- | ------------------------------------------- |
|
|
37
37
|
| `ezBlur` | Evento disparado quando o input perde o foco. | `CustomEvent<string>` |
|
|
38
38
|
| `ezChange` | Evento disparado quando o valor do input muda. | `CustomEvent<string>` |
|
|
39
|
+
| `ezFocus` | Evento disparado quando o input ganha o foco. | `CustomEvent<string>` |
|
|
39
40
|
| `iconClick` | Evento disparado quando um ícone é clicado. Payload: { icon: "left" \| "right" } | `CustomEvent<{ icon: "left" \| "right"; }>` |
|
|
40
41
|
|
|
41
42
|
|
|
@@ -64,6 +65,10 @@ Type: `Promise<void>`
|
|
|
64
65
|
|
|
65
66
|
## Dependencies
|
|
66
67
|
|
|
68
|
+
### Used by
|
|
69
|
+
|
|
70
|
+
- [ez-classic-combo-box](../ez-classic-combo-box)
|
|
71
|
+
|
|
67
72
|
### Depends on
|
|
68
73
|
|
|
69
74
|
- [ez-icon](../ez-icon)
|
|
@@ -72,9 +77,28 @@ Type: `Promise<void>`
|
|
|
72
77
|
```mermaid
|
|
73
78
|
graph TD;
|
|
74
79
|
ez-classic-input --> ez-icon
|
|
80
|
+
ez-classic-combo-box --> ez-classic-input
|
|
75
81
|
style ez-classic-input fill:#f9f,stroke:#333,stroke-width:4px
|
|
76
82
|
```
|
|
77
83
|
|
|
78
84
|
----------------------------------------------
|
|
79
85
|
|
|
80
86
|
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
## CSS Variables
|
|
90
|
+
| Variable | Description |
|
|
91
|
+
|-|-|
|
|
92
|
+
| --ez-classic-input--label-color | Define a cor do texto do input. |
|
|
93
|
+
| --ez-classic-input--border-color-default | Define a cor da borda do input quando está no estado padrão. |
|
|
94
|
+
| --ez-classic-input--border-color-focus | Define a cor da borda do input quando está no estado de foco. |
|
|
95
|
+
| --ez-classic-input--border-color-success | Define a cor da borda do input quando está no estado de sucesso. |
|
|
96
|
+
| --ez-classic-input--border-color-error | Define a cor da borda do input quando está no estado de erro. |
|
|
97
|
+
| --ez-classic-input--border-color-warning | Define a cor da borda do input quando está no estado de aviso. |
|
|
98
|
+
| --ez-classic-input--background-color | Define a cor de fundo do input. |
|
|
99
|
+
| --ez-classic-input--background-color-disabled | Define a cor de fundo do input quando está desabilitado. |
|
|
100
|
+
| --ez-classic-input--text-color | Define a cor do texto do input. |
|
|
101
|
+
| --ez-classic-input--placeholder-color | Define a cor do texto do placeholder do input. |
|
|
102
|
+
| --ez-classic-input--icon-color | Define a cor do ícone do input. |
|
|
103
|
+
| --ez-classic-input--helptext-color | Define a cor do texto de ajuda do input. |
|
|
104
|
+
| --ez-classic-input--height | Define a altura do input. |
|
|
@@ -93,11 +93,13 @@ Type: `Promise<void>`
|
|
|
93
93
|
|
|
94
94
|
### Used by
|
|
95
95
|
|
|
96
|
+
- [ez-classic-combo-box](../../ez-classic-combo-box)
|
|
96
97
|
- [ez-popover-plus](..)
|
|
97
98
|
|
|
98
99
|
### Graph
|
|
99
100
|
```mermaid
|
|
100
101
|
graph TD;
|
|
102
|
+
ez-classic-combo-box --> ez-popover-core
|
|
101
103
|
ez-popover-plus --> ez-popover-core
|
|
102
104
|
style ez-popover-core fill:#f9f,stroke:#333,stroke-width:4px
|
|
103
105
|
```
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
# ez-progress-bar
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
9
|
+
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ---------- | ----------- | ------------------------------------------------------------ | -------- | ----------- |
|
|
12
|
+
| `helpText` | `help-text` | Mensagem auxiliar para contextualizar barra de carregamento. | `string` | `undefined` |
|
|
13
|
+
| `label` | `label` | Rótulo da barra de progresso. | `string` | `undefined` |
|
|
14
|
+
| `percent` | `percent` | Porcentagem de preenchimento da barra. | `number` | `undefined` |
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
----------------------------------------------
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## CSS Variables
|
|
23
|
+
| Variable | Description |
|
|
24
|
+
|-|-|
|
|
25
|
+
| --ez-progress-bar-container-height | Define a altura do container da barra de progresso. |
|
|
26
|
+
| --ez-progress-bar-radius | Define o arredondamento da barra de progresso e de seu container. |
|
|
27
|
+
| --ez-progress-bar-container-background | Define a cor de fundo do container da barra de progresso. |
|
|
28
|
+
| --ez-progress-bar-container-border | Define a cor de fundo do container da barra de progresso. |
|
|
29
|
+
| --ez-progress-bar-height | Define a altura da barra de progresso interna. |
|
|
30
|
+
| --ez-progress-bar-background | Define a altura da barra de progresso. |
|
|
31
|
+
| --ez-progress-bar-font-size | Define o tamanho da fonte do header. |
|
|
32
|
+
| --ez-progress-bar-header-color | Define a cor do texto do label. |
|
|
33
|
+
| --ez-progress-bar-gap | Define o espaçamento entre o header e a progressbar. |
|
|
34
|
+
| --ez-progress-bar-help-text-color | Define a cor do texto do help text. |
|
|
35
|
+
| --ez-progress-bar-help-text-font-size | Define a cor do texto do help text. |
|