@sankhyalabs/ezui-docs 7.1.0-dev.20 → 7.1.0-dev.22
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-button/readme.md +4 -0
- package/components/ez-calendar/readme.md +4 -0
- package/components/ez-card-item/readme.md +4 -0
- package/components/ez-classic-combo-box/readme.md +11 -3
- package/components/ez-classic-date-input/readme.md +111 -0
- package/components/ez-classic-date-time-input/readme.md +111 -0
- package/components/ez-classic-input/readme.md +22 -1
- package/components/ez-classic-number-input/readme.md +107 -0
- package/components/ez-classic-search/readme.md +162 -0
- package/components/ez-classic-search/subcomponent/classic-search-list/readme.md +72 -0
- package/components/ez-classic-search-plus/readme.md +168 -0
- package/components/ez-classic-search-plus/subcomponent/ez-search-result-list/readme.md +90 -0
- package/components/ez-classic-text-area/readme.md +5 -0
- package/components/ez-classic-time-input/readme.md +88 -0
- package/components/ez-form/readme.md +46 -9
- package/components/ez-form-view/readme.md +54 -6
- package/components/ez-icon/readme.md +2 -0
- package/components/ez-image-input/readme.md +77 -0
- package/components/ez-popover-plus/readme.md +8 -0
- package/components/ez-popup/readme.md +2 -0
- package/components/ez-rich-text/readme.md +1 -1
- package/components/ez-skeleton/readme.md +4 -0
- package/package.json +1 -1
|
@@ -0,0 +1,162 @@
|
|
|
1
|
+
# ez-classic-search
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
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
|
+
| `classic` | `classic` | Se true, muda o tipo do text-input para classic. | `boolean` | `false` |
|
|
16
|
+
| `contextProperties` | `context-properties` | Propriedades de contexto da aplicação. | `any` | `undefined` |
|
|
17
|
+
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
18
|
+
| `ensureClearButtonVisible` | `ensure-clear-button-visible` | Garante que o botão de limpar pesquisa está sempre visível | `boolean` | `false` |
|
|
19
|
+
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
20
|
+
| `hideDescriptionInput` | `hide-description-input` | Se true o campo de de apresentação não será exibido. | `boolean` | `false` |
|
|
21
|
+
| `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` |
|
|
22
|
+
| `ignoreLimitCharsToSearch` | `ignore-limit-chars-to-search` | Define se deve ignorar o limite de caracteres mínimo para realizar uma pesquisa | `boolean` | `false` |
|
|
23
|
+
| `isTextSearch` | `is-text-search` | Informa se a pesquisa é do tipo texto. | `boolean` | `false` |
|
|
24
|
+
| `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined` |
|
|
25
|
+
| `listOptionsPosition` | -- | Define um posicionamento fixo para a lista de opções do CheckBox. | `IEzCheckBoxListPosition` | `undefined` |
|
|
26
|
+
| `mode` | `mode` | Define o tamanho do campo. | `"regular" \| "slim"` | `"regular"` |
|
|
27
|
+
| `optionLoader` | -- | Carrega as opções dinamicamente. | `(argument: ISearchArgument, ctxProperties?: any) => IOption \| IOption[] \| Promise<IOption[]>` | `undefined` |
|
|
28
|
+
| `options` | -- | Array com as opções do ez-combo-box. Os elementos devem obedecer o formato: `{value: string, label: string}`. | `IOption[]` | `undefined` |
|
|
29
|
+
| `required` | `required` | Define se o campo é obrigatório | `boolean` | `false` |
|
|
30
|
+
| `showMore` | `show-more` | Informa se deve exibir a opção de mostrar mais resultados. | `boolean` | `undefined` |
|
|
31
|
+
| `showOptionValue` | `show-option-value` | Se false cada opção na lista deve exibir somente o `label`. | `boolean` | `true` |
|
|
32
|
+
| `showSelectedValue` | `show-selected-value` | Se false a opção selecionada deve exibir somente o `label`. | `boolean` | `true` |
|
|
33
|
+
| `size` | `size` | Tamanho do input | `"default" \| "small" \| "xsmall"` | `"default"` |
|
|
34
|
+
| `stopPropagateEnterKeyEvent` | `stop-propagate-enter-key-event` | Se true, ineterrompe a propagação do evento de KeyDown da tecla enter | `boolean` | `false` |
|
|
35
|
+
| `suppressEmptyOption` | `suppress-empty-option` | Se true remove a opção vazia da lista. | `boolean` | `false` |
|
|
36
|
+
| `suppressInputPersist` | `suppress-input-persist` | Informa se o valor da opção selecionada deve persistir no input de texto. | `boolean` | `false` |
|
|
37
|
+
| `suppressPreLoad` | `suppress-pre-load` | Se true, desabilita pré-load das opções ao carregar componente | `boolean` | `true` |
|
|
38
|
+
| `suppressSearch` | `suppress-search` | Se true desabilita a digitação dentro do componente. | `boolean` | `false` |
|
|
39
|
+
| `value` | `value` | Define o valor do campo. | `IOption \| string` | `undefined` |
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
## Events
|
|
43
|
+
|
|
44
|
+
| Event | Description | Type |
|
|
45
|
+
| ---------- | ------------------------------------------------------ | ---------------------- |
|
|
46
|
+
| `ezChange` | Emitido quando acontece a alteração de valor do campo. | `CustomEvent<IOption>` |
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
## Methods
|
|
50
|
+
|
|
51
|
+
### `clearValue() => Promise<void>`
|
|
52
|
+
|
|
53
|
+
Limpa o valor do campo de pesquisa
|
|
54
|
+
|
|
55
|
+
#### Returns
|
|
56
|
+
|
|
57
|
+
Type: `Promise<void>`
|
|
58
|
+
|
|
59
|
+
---
|
|
60
|
+
|
|
61
|
+
### `getValueAsync() => Promise<unknown>`
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
#### Returns
|
|
66
|
+
|
|
67
|
+
Type: `Promise<unknown>`
|
|
68
|
+
|
|
69
|
+
---
|
|
70
|
+
|
|
71
|
+
### `isInvalid() => Promise<boolean>`
|
|
72
|
+
|
|
73
|
+
Retorna se o conteúdo é inválido.
|
|
74
|
+
|
|
75
|
+
#### Returns
|
|
76
|
+
|
|
77
|
+
Type: `Promise<boolean>`
|
|
78
|
+
|
|
79
|
+
---
|
|
80
|
+
|
|
81
|
+
### `setBlur() => Promise<void>`
|
|
82
|
+
|
|
83
|
+
Remove o foco do campo.
|
|
84
|
+
|
|
85
|
+
#### Returns
|
|
86
|
+
|
|
87
|
+
Type: `Promise<void>`
|
|
88
|
+
|
|
89
|
+
---
|
|
90
|
+
|
|
91
|
+
### `setFocus(options?: OptionsSetFocus) => Promise<void>`
|
|
92
|
+
|
|
93
|
+
Aplica o foco no campo.
|
|
94
|
+
|
|
95
|
+
#### Returns
|
|
96
|
+
|
|
97
|
+
Type: `Promise<void>`
|
|
98
|
+
|
|
99
|
+
|
|
100
|
+
|
|
101
|
+
|
|
102
|
+
## Dependencies
|
|
103
|
+
|
|
104
|
+
### Used by
|
|
105
|
+
|
|
106
|
+
- [ez-form-view](../ez-form-view)
|
|
107
|
+
|
|
108
|
+
### Depends on
|
|
109
|
+
|
|
110
|
+
- [ez-button](../ez-button)
|
|
111
|
+
- [ez-classic-input](../ez-classic-input)
|
|
112
|
+
- [ez-popover-plus](../ez-popover-plus)
|
|
113
|
+
- [classic-search-list](./subcomponent/classic-search-list)
|
|
114
|
+
|
|
115
|
+
### Graph
|
|
116
|
+
```mermaid
|
|
117
|
+
graph TD;
|
|
118
|
+
ez-classic-search --> ez-button
|
|
119
|
+
ez-classic-search --> ez-classic-input
|
|
120
|
+
ez-classic-search --> ez-popover-plus
|
|
121
|
+
ez-classic-search --> classic-search-list
|
|
122
|
+
ez-button --> ez-icon
|
|
123
|
+
ez-classic-input --> ez-icon
|
|
124
|
+
ez-popover-plus --> ez-popover-core
|
|
125
|
+
classic-search-list --> ez-card-item
|
|
126
|
+
ez-form-view --> ez-classic-search
|
|
127
|
+
style ez-classic-search fill:#f9f,stroke:#333,stroke-width:4px
|
|
128
|
+
```
|
|
129
|
+
|
|
130
|
+
----------------------------------------------
|
|
131
|
+
|
|
132
|
+
|
|
133
|
+
|
|
134
|
+
|
|
135
|
+
## CSS Variables
|
|
136
|
+
| Variable | Description |
|
|
137
|
+
|-|-|
|
|
138
|
+
| --ez-classic-search--height | Define altura do input. |
|
|
139
|
+
| --ez-classic-search--width | Define largura do input. |
|
|
140
|
+
| --ez-classic-search\_\_icon--width | Define largura do slot do ícone do input. |
|
|
141
|
+
| --ez-classic-search--border-radius | Define o raio da borda do input. |
|
|
142
|
+
| --ez-classic-search--border-radius-small | Define o raio da borda do input quando pequeno. |
|
|
143
|
+
| --ez-classic-search--font-size | Define o tamanho da fonte dentro do input. |
|
|
144
|
+
| --ez-classic-search--font-family | Define a família da fonte dentro do input. |
|
|
145
|
+
| --ez-classic-search--font-weight--large | Define o peso da fonte dentro do input quando pesada. |
|
|
146
|
+
| --ez-classic-search--font-weight--medium | Define o peso da fonte dentro do input quando média. |
|
|
147
|
+
| --ez-classic-search--background-color--xlight | Define a cor de fundo da lista de opções. |
|
|
148
|
+
| --ez-classic-search--background-medium | Define a cor de fundo dos itens da lista de opções. |
|
|
149
|
+
| --ez-classic-search--line-height | Define a altura da linha do texto dentro do input. |
|
|
150
|
+
| --ez-classic-search\_\_input--background-color | Define a cor de fundo do input. |
|
|
151
|
+
| --ez-classic-search\_\_input--border | Define o estilo da borda do input. |
|
|
152
|
+
| --ez-classic-search\_\_input--border-color | Define a cor da borda do input. |
|
|
153
|
+
| --ez-classic-search\_\_input--focus--border-color | Define a cor da borda do input quando focado. |
|
|
154
|
+
| --ez-classic-search\_\_input--disabled--background-color | Define a cor de fundo do input quando desabilitado. |
|
|
155
|
+
| --ez-classic-search\_\_input--disabled--color | Define a cor do texto dentro do input quando desabilitado. |
|
|
156
|
+
| --ez-classic-search\_\_input--error--border-color | Define a cor da borda do input quando com erro. |
|
|
157
|
+
| --ez-classic-search\_\_btn--color | Define a cor do botão de pesquisa do componente. |
|
|
158
|
+
| --ez-classic-search\_\_btn-disabled--color | Define a cor do botão de pesquisa do componente quando desabilitado. |
|
|
159
|
+
| --ez-classic-search\_\_btn-hover--color | Define a cor do botão de pesquisa do componente quando o mouse está sobre ele. |
|
|
160
|
+
| --ez-classic-search\_\_label--color | Define a cor do label. |
|
|
161
|
+
| --ez-classic-search--space--medium | Define um espaçamento mediano entre elementos do componente. |
|
|
162
|
+
| --ez-classic-search--space--small | Define um espaçamento pequeno entre elementos do componente. |
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
# classic-search-list
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
9
|
+
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| -------------------- | ----------------------- | ----------- | ------------------- | ----------- |
|
|
12
|
+
| `canShowListOptions` | `can-show-list-options` | | `boolean` | `undefined` |
|
|
13
|
+
| `preSelection` | `pre-selection` | | `number` | `undefined` |
|
|
14
|
+
| `showLoading` | `show-loading` | | `boolean` | `undefined` |
|
|
15
|
+
| `showOptionValue` | `show-option-value` | | `boolean` | `true` |
|
|
16
|
+
| `textEmptyList` | `text-empty-list` | | `string` | `undefined` |
|
|
17
|
+
| `value` | `value` | | `IOption \| string` | `undefined` |
|
|
18
|
+
| `visibleOptions` | -- | | `IOption[]` | `[]` |
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
## Events
|
|
22
|
+
|
|
23
|
+
| Event | Description | Type |
|
|
24
|
+
| -------------------- | ----------- | ---------------------- |
|
|
25
|
+
| `changePreSelection` | | `CustomEvent<number>` |
|
|
26
|
+
| `changeValue` | | `CustomEvent<IOption>` |
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
## Methods
|
|
30
|
+
|
|
31
|
+
### `nextOption() => Promise<void>`
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
#### Returns
|
|
36
|
+
|
|
37
|
+
Type: `Promise<void>`
|
|
38
|
+
|
|
39
|
+
---
|
|
40
|
+
|
|
41
|
+
### `previousOption() => Promise<void>`
|
|
42
|
+
|
|
43
|
+
|
|
44
|
+
|
|
45
|
+
#### Returns
|
|
46
|
+
|
|
47
|
+
Type: `Promise<void>`
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
|
|
51
|
+
|
|
52
|
+
## Dependencies
|
|
53
|
+
|
|
54
|
+
### Used by
|
|
55
|
+
|
|
56
|
+
- [ez-classic-search](../..)
|
|
57
|
+
|
|
58
|
+
### Depends on
|
|
59
|
+
|
|
60
|
+
- [ez-card-item](../../../ez-card-item)
|
|
61
|
+
|
|
62
|
+
### Graph
|
|
63
|
+
```mermaid
|
|
64
|
+
graph TD;
|
|
65
|
+
classic-search-list --> ez-card-item
|
|
66
|
+
ez-classic-search --> classic-search-list
|
|
67
|
+
style classic-search-list fill:#f9f,stroke:#333,stroke-width:4px
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
----------------------------------------------
|
|
71
|
+
|
|
72
|
+
|
|
@@ -0,0 +1,168 @@
|
|
|
1
|
+
# ez-classic-search-plus
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
9
|
+
|
|
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
|
+
| `disableCodeInput` | `disable-code-input` | Se true o campo de código ficara desabilitado. | `boolean` | `false` |
|
|
16
|
+
| `disableDescriptionInput` | `disable-description-input` | Se true o campo de de apresentação ficara desabilitado. | `boolean` | `false` |
|
|
17
|
+
| `enabled` | `enabled` | Se false o usuário não pode interagir com o campo. | `boolean` | `true` |
|
|
18
|
+
| `ensureClearButtonVisible` | `ensure-clear-button-visible` | Garante que o botão de limpar pesquisa está sempre visível | `boolean` | `false` |
|
|
19
|
+
| `errorMessage` | `error-message` | Define uma mensagem de orientação ao usuário, colocando o campo em modo inválido. | `string` | `undefined` |
|
|
20
|
+
| `hideDescriptionInput` | `hide-description-input` | Se true o campo de de apresentação não será exibido. | `boolean` | `false` |
|
|
21
|
+
| `hideErrorOnFocusOut` | `hide-error-on-focus-out` | Propriedade depreciada na nova versão do componente de pesquisa. | `boolean` | `true` |
|
|
22
|
+
| `ignoreLimitCharsToSearch` | `ignore-limit-chars-to-search` | Propriedade depreciada na nova versão do componente de pesquisa. | `boolean` | `false` |
|
|
23
|
+
| `isTextSearch` | `is-text-search` | Propriedade depreciada na nova versão do componente de pesquisa. | `boolean` | `false` |
|
|
24
|
+
| `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined` |
|
|
25
|
+
| `listOptionsPosition` | -- | Propriedade depreciada na nova versão do componente de pesquisa. | `IEzCheckBoxListPosition` | `undefined` |
|
|
26
|
+
| `mode` | `mode` | Define o tamanho do campo. | `"regular" \| "slim"` | `"regular"` |
|
|
27
|
+
| `optionLoader` | -- | Carrega as opções dinamicamente. | `(argument: ISearchArgument, ctxProperties?: any) => ISearchOption \| IOption \| (ISearchOption \| IOption)[] \| Promise<ISearchOption \| IOption \| (ISearchOption \| IOption)[]>` | `undefined` |
|
|
28
|
+
| `required` | `required` | Define se o campo é obrigatório | `boolean` | `false` |
|
|
29
|
+
| `showOptionValue` | `show-option-value` | Se false cada opção na lista deve exibir somente o `label`. | `boolean` | `true` |
|
|
30
|
+
| `showSelectedValue` | `show-selected-value` | Propriedade depreciada na nova versão do componente de pesquisa. | `boolean` | `true` |
|
|
31
|
+
| `size` | `size` | Tamanho do input | `"default" \| "small" \| "xsmall"` | `"default"` |
|
|
32
|
+
| `stopPropagateEnterKeyEvent` | `stop-propagate-enter-key-event` | Se true, interrompe a propagação do evento de KeyDown da tecla enter | `boolean` | `false` |
|
|
33
|
+
| `suppressEmptyOption` | `suppress-empty-option` | Propriedade depreciada na nova versão do componente de pesquisa. | `boolean` | `false` |
|
|
34
|
+
| `suppressPreLoad` | `suppress-pre-load` | Propriedade depreciada na nova versão do componente de pesquisa. | `boolean` | `true` |
|
|
35
|
+
| `suppressSearch` | `suppress-search` | Propriedade depreciada na nova versão do componente de pesquisa. | `boolean` | `false` |
|
|
36
|
+
| `value` | `value` | Define o valor do campo. | `IOption \| string` | `undefined` |
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
## Events
|
|
40
|
+
|
|
41
|
+
| Event | Description | Type |
|
|
42
|
+
| ---------- | ------------------------------------------------------ | ---------------------- |
|
|
43
|
+
| `ezChange` | Emitido quando acontece a alteração de valor do campo. | `CustomEvent<IOption>` |
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
## Methods
|
|
47
|
+
|
|
48
|
+
### `clearValue() => Promise<void>`
|
|
49
|
+
|
|
50
|
+
Limpa o valor do campo de pesquisa
|
|
51
|
+
|
|
52
|
+
#### Returns
|
|
53
|
+
|
|
54
|
+
Type: `Promise<void>`
|
|
55
|
+
|
|
56
|
+
---
|
|
57
|
+
|
|
58
|
+
### `getValueAsync() => Promise<IOption>`
|
|
59
|
+
|
|
60
|
+
Obtém o valor do componente só após a compo de apresentação
|
|
61
|
+
ter sido resolvido pelo option loader quando necessário
|
|
62
|
+
|
|
63
|
+
#### Returns
|
|
64
|
+
|
|
65
|
+
Type: `Promise<IOption>`
|
|
66
|
+
|
|
67
|
+
---
|
|
68
|
+
|
|
69
|
+
### `isInvalid() => Promise<boolean>`
|
|
70
|
+
|
|
71
|
+
Retorna se o conteúdo é inválido.
|
|
72
|
+
|
|
73
|
+
#### Returns
|
|
74
|
+
|
|
75
|
+
Type: `Promise<boolean>`
|
|
76
|
+
|
|
77
|
+
---
|
|
78
|
+
|
|
79
|
+
### `setBlur() => Promise<void>`
|
|
80
|
+
|
|
81
|
+
Remove o foco do campo.
|
|
82
|
+
|
|
83
|
+
#### Returns
|
|
84
|
+
|
|
85
|
+
Type: `Promise<void>`
|
|
86
|
+
|
|
87
|
+
---
|
|
88
|
+
|
|
89
|
+
### `setFocus(options?: OptionsSetFocus) => Promise<void>`
|
|
90
|
+
|
|
91
|
+
Aplica o foco no campo.
|
|
92
|
+
|
|
93
|
+
#### Returns
|
|
94
|
+
|
|
95
|
+
Type: `Promise<void>`
|
|
96
|
+
|
|
97
|
+
|
|
98
|
+
|
|
99
|
+
|
|
100
|
+
## Dependencies
|
|
101
|
+
|
|
102
|
+
### Used by
|
|
103
|
+
|
|
104
|
+
- [ez-form-view](../ez-form-view)
|
|
105
|
+
|
|
106
|
+
### Depends on
|
|
107
|
+
|
|
108
|
+
- [ez-classic-input](../ez-classic-input)
|
|
109
|
+
- [ez-popover-plus](../ez-popover-plus)
|
|
110
|
+
- [ez-classic-search-result-list](./subcomponent/ez-search-result-list)
|
|
111
|
+
|
|
112
|
+
### Graph
|
|
113
|
+
```mermaid
|
|
114
|
+
graph TD;
|
|
115
|
+
ez-classic-search-plus --> ez-classic-input
|
|
116
|
+
ez-classic-search-plus --> ez-popover-plus
|
|
117
|
+
ez-classic-search-plus --> ez-classic-search-result-list
|
|
118
|
+
ez-classic-input --> ez-icon
|
|
119
|
+
ez-popover-plus --> ez-popover-core
|
|
120
|
+
ez-classic-search-result-list --> ez-card-item
|
|
121
|
+
ez-classic-search-result-list --> ez-skeleton
|
|
122
|
+
ez-form-view --> ez-classic-search-plus
|
|
123
|
+
style ez-classic-search-plus fill:#f9f,stroke:#333,stroke-width:4px
|
|
124
|
+
```
|
|
125
|
+
|
|
126
|
+
----------------------------------------------
|
|
127
|
+
|
|
128
|
+
|
|
129
|
+
|
|
130
|
+
|
|
131
|
+
## CSS Variables
|
|
132
|
+
| Variable | Description |
|
|
133
|
+
|-|-|
|
|
134
|
+
| --ez-classic-search--height | Define altura do input. |
|
|
135
|
+
| --ez-classic-search--width | Define largura do input. |
|
|
136
|
+
| --ez-classic-search\_\_icon--width | Define largura do slot do ícone do input. |
|
|
137
|
+
| --ez-classic-search--border-radius | Define o raio da borda do input. |
|
|
138
|
+
| --ez-classic-search--border-radius-small | Define o raio da borda do input quando pequeno. |
|
|
139
|
+
| --ez-classic-search--font-size | Define o tamanho da fonte dentro do input. |
|
|
140
|
+
| --ez-classic-search--font-family | Define a família da fonte dentro do input. |
|
|
141
|
+
| --ez-classic-search--font-weight--large | Define o peso da fonte dentro do input quando pesada. |
|
|
142
|
+
| --ez-classic-search--font-weight--medium | Define o peso da fonte dentro do input quando média. |
|
|
143
|
+
| --ez-classic-search--background-color--xlight | Define a cor de fundo da lista de opções. |
|
|
144
|
+
| --ez-classic-search--background-medium | Define a cor de fundo dos itens da lista de opções. |
|
|
145
|
+
| --ez-classic-search--line-height | Define a altura da linha do texto dentro do input. |
|
|
146
|
+
| --ez-classic-search\_\_input--background-color | Define a cor de fundo do input. |
|
|
147
|
+
| --ez-classic-search\_\_input--border | Define o estilo da borda do input. |
|
|
148
|
+
| --ez-classic-search\_\_input--border-color | Define a cor da borda do input. |
|
|
149
|
+
| --ez-classic-search\_\_input--focus--border-color | Define a cor da borda do input quando focado. |
|
|
150
|
+
| --ez-classic-search\_\_input--disabled--background-color | Define a cor de fundo do input quando desabilitado. |
|
|
151
|
+
| --ez-classic-search\_\_input--disabled--color | Define a cor do texto dentro do input quando desabilitado. |
|
|
152
|
+
| --ez-classic-search\_\_input--error--border-color | Define a cor da borda do input quando com erro. |
|
|
153
|
+
| --ez-classic-search\_\_btn--color | Define a cor do botão de pesquisa do componente. |
|
|
154
|
+
| --ez-classic-search\_\_btn-disabled--color | Define a cor do botão de pesquisa do componente quando desabilitado. |
|
|
155
|
+
| --ez-classic-search\_\_btn-hover--color | Define a cor do botão de pesquisa do componente quando o mouse está sobre ele. |
|
|
156
|
+
| --ez-classic-search\_\_label--color | Define a cor do label. |
|
|
157
|
+
| --ez-classic-search\_\_list-title--primary | Define a cor do texto da lista de opções. |
|
|
158
|
+
| --ez-classic-search\_\_list-text--primary | Define a cor do texto do value da lista de opções. |
|
|
159
|
+
| --ez-classic-search\_\_list-height | Define a altura do box da lista de opções. |
|
|
160
|
+
| --ez-classic-search\_\_list-min-width | Define a largura mínima da lista de opções. |
|
|
161
|
+
| --ez-classic-search--space--medium | Define um espaçamento mediano entre elementos do componente. |
|
|
162
|
+
| --ez-classic-search--space--small | Define um espaçamento pequeno entre elementos do componente. |
|
|
163
|
+
| --ez-classic-search\_\_scrollbar--color-default | Define a cor da barra de rolagem do componente. |
|
|
164
|
+
| --ez-classic-search\_\_scrollbar--color-background | Define a cor de fundo da barra de rolagem do componente. |
|
|
165
|
+
| --ez-classic-search\_\_scrollbar--color-hover | Define a cor do hover na barra de rolagem do componente. |
|
|
166
|
+
| --ez-classic-search\_\_scrollbar--color-clicked | Define a cor do active na barra de rolagem do componente. |
|
|
167
|
+
| --ez-classic-search\_\_scrollbar--border-radius | Define o raio da borda da barra de rolagem do componente. |
|
|
168
|
+
| --ez-classic-search\_\_scrollbar--width | Define a largura da barra de rolagem do componente. |
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
# ez-classic-search-result-list
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
9
|
+
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ----------------- | ------------------- | ----------- | ------------------- | ----------- |
|
|
12
|
+
| `showLoading` | `show-loading` | | `boolean` | `undefined` |
|
|
13
|
+
| `showOptionValue` | `show-option-value` | | `boolean` | `true` |
|
|
14
|
+
| `value` | `value` | | `IOption \| string` | `undefined` |
|
|
15
|
+
| `visibleOptions` | -- | | `IOption[]` | `[]` |
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
## Events
|
|
19
|
+
|
|
20
|
+
| Event | Description | Type |
|
|
21
|
+
| ------------- | ----------- | ---------------------- |
|
|
22
|
+
| `changeValue` | | `CustomEvent<IOption>` |
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
## Methods
|
|
26
|
+
|
|
27
|
+
### `cancelSelection() => Promise<void>`
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
#### Returns
|
|
32
|
+
|
|
33
|
+
Type: `Promise<void>`
|
|
34
|
+
|
|
35
|
+
---
|
|
36
|
+
|
|
37
|
+
### `nextOption() => Promise<void>`
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
#### Returns
|
|
42
|
+
|
|
43
|
+
Type: `Promise<void>`
|
|
44
|
+
|
|
45
|
+
---
|
|
46
|
+
|
|
47
|
+
### `previousOption() => Promise<void>`
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
|
|
51
|
+
#### Returns
|
|
52
|
+
|
|
53
|
+
Type: `Promise<void>`
|
|
54
|
+
|
|
55
|
+
---
|
|
56
|
+
|
|
57
|
+
### `selectCurrentItem() => Promise<void>`
|
|
58
|
+
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
#### Returns
|
|
62
|
+
|
|
63
|
+
Type: `Promise<void>`
|
|
64
|
+
|
|
65
|
+
|
|
66
|
+
|
|
67
|
+
|
|
68
|
+
## Dependencies
|
|
69
|
+
|
|
70
|
+
### Used by
|
|
71
|
+
|
|
72
|
+
- [ez-classic-search-plus](../..)
|
|
73
|
+
|
|
74
|
+
### Depends on
|
|
75
|
+
|
|
76
|
+
- [ez-card-item](../../../ez-card-item)
|
|
77
|
+
- [ez-skeleton](../../../ez-skeleton)
|
|
78
|
+
|
|
79
|
+
### Graph
|
|
80
|
+
```mermaid
|
|
81
|
+
graph TD;
|
|
82
|
+
ez-classic-search-result-list --> ez-card-item
|
|
83
|
+
ez-classic-search-result-list --> ez-skeleton
|
|
84
|
+
ez-classic-search-plus --> ez-classic-search-result-list
|
|
85
|
+
style ez-classic-search-result-list fill:#f9f,stroke:#333,stroke-width:4px
|
|
86
|
+
```
|
|
87
|
+
|
|
88
|
+
----------------------------------------------
|
|
89
|
+
|
|
90
|
+
|
|
@@ -62,6 +62,10 @@ Type: `Promise<void>`
|
|
|
62
62
|
|
|
63
63
|
## Dependencies
|
|
64
64
|
|
|
65
|
+
### Used by
|
|
66
|
+
|
|
67
|
+
- [ez-form-view](../ez-form-view)
|
|
68
|
+
|
|
65
69
|
### Depends on
|
|
66
70
|
|
|
67
71
|
- [ez-icon](../ez-icon)
|
|
@@ -70,6 +74,7 @@ Type: `Promise<void>`
|
|
|
70
74
|
```mermaid
|
|
71
75
|
graph TD;
|
|
72
76
|
ez-classic-text-area --> ez-icon
|
|
77
|
+
ez-form-view --> ez-classic-text-area
|
|
73
78
|
style ez-classic-text-area fill:#f9f,stroke:#333,stroke-width:4px
|
|
74
79
|
```
|
|
75
80
|
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
# ez-classic-time-input
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
<!-- Auto Generated Below -->
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## Properties
|
|
9
|
+
|
|
10
|
+
| Property | Attribute | Description | Type | Default |
|
|
11
|
+
| ------------------------ | ------------------------- | --------------------------------------------------------------------------------- | ---------------------------------- | ----------- |
|
|
12
|
+
| `alternativePlaceholder` | `alternative-placeholder` | Texto alternativo 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
|
+
| `label` | `label` | Texto a ser apresentado como título do campo. | `string` | `undefined` |
|
|
18
|
+
| `mode` | `mode` | Define o tamanho do campo. | `"regular" \| "slim"` | `"regular"` |
|
|
19
|
+
| `required` | `required` | Define se o campo é obrigatório | `boolean` | `false` |
|
|
20
|
+
| `showSeconds` | `show-seconds` | Se true considera segundos. | `boolean` | `false` |
|
|
21
|
+
| `size` | `size` | Tamanho do input | `"default" \| "small" \| "xsmall"` | `"default"` |
|
|
22
|
+
| `value` | `value` | Define o valor do campo. | `number` | `undefined` |
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
## Events
|
|
26
|
+
|
|
27
|
+
| Event | Description | Type |
|
|
28
|
+
| ----------------------- | ---------------------------------------------------------------------------------------------- | ---------------------------- |
|
|
29
|
+
| `ezCancelWaitingChange` | Emitido quando não foi possível completar a alteração entre o evento ezStartChange e ezChange. | `CustomEvent<void>` |
|
|
30
|
+
| `ezChange` | Emitido quando acontece a alteração de valor do campo. | `CustomEvent<number>` |
|
|
31
|
+
| `ezStartChange` | Emitido ao iniciar a alteração (digitação incompleta). | `CustomEvent<WaitingChange>` |
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
## Methods
|
|
35
|
+
|
|
36
|
+
### `isInvalid() => Promise<boolean>`
|
|
37
|
+
|
|
38
|
+
Retorna se o conteúdo é inválido.
|
|
39
|
+
|
|
40
|
+
#### Returns
|
|
41
|
+
|
|
42
|
+
Type: `Promise<boolean>`
|
|
43
|
+
|
|
44
|
+
---
|
|
45
|
+
|
|
46
|
+
### `setBlur() => Promise<void>`
|
|
47
|
+
|
|
48
|
+
Remove o foco do campo.
|
|
49
|
+
|
|
50
|
+
#### Returns
|
|
51
|
+
|
|
52
|
+
Type: `Promise<void>`
|
|
53
|
+
|
|
54
|
+
---
|
|
55
|
+
|
|
56
|
+
### `setFocus({ selectText }: TFocusOptions) => Promise<void>`
|
|
57
|
+
|
|
58
|
+
Aplica o foco no campo.
|
|
59
|
+
|
|
60
|
+
#### Returns
|
|
61
|
+
|
|
62
|
+
Type: `Promise<void>`
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
|
|
66
|
+
|
|
67
|
+
## Dependencies
|
|
68
|
+
|
|
69
|
+
### Used by
|
|
70
|
+
|
|
71
|
+
- [ez-form-view](../ez-form-view)
|
|
72
|
+
|
|
73
|
+
### Depends on
|
|
74
|
+
|
|
75
|
+
- [ez-classic-input](../ez-classic-input)
|
|
76
|
+
|
|
77
|
+
### Graph
|
|
78
|
+
```mermaid
|
|
79
|
+
graph TD;
|
|
80
|
+
ez-classic-time-input --> ez-classic-input
|
|
81
|
+
ez-classic-input --> ez-icon
|
|
82
|
+
ez-form-view --> ez-classic-time-input
|
|
83
|
+
style ez-classic-time-input fill:#f9f,stroke:#333,stroke-width:4px
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
----------------------------------------------
|
|
87
|
+
|
|
88
|
+
|