angular-visuals 0.1.4 → 0.2.1
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/README.md +31 -45
- package/fesm2022/angular-visuals.mjs +1863 -204
- package/fesm2022/angular-visuals.mjs.map +1 -1
- package/package.json +2 -1
- package/styles/angular-visuals.css +39 -0
- package/types/angular-visuals.d.ts +533 -3
package/README.md
CHANGED
|
@@ -67,14 +67,14 @@ A biblioteca pode ser usada em aplicações Ionic/Capacitor como camada de compo
|
|
|
67
67
|
|
|
68
68
|
| Categoria | Componentes |
|
|
69
69
|
| --- | --- |
|
|
70
|
-
| Base | `AvBadge`, `AvButton`, `AvCard`, `AvIcon` |
|
|
71
|
-
| Formulários | `AvForm`, `AvInput`, `AvSelect`, `AvMultiSelect`, `AvCheckbox`, `AvCurrencyInput`, `AvDateTimePicker`, `AvSwitch`, `AvSlider`, `AvFileUpload`, `AvTextArea` |
|
|
72
|
-
| Layout e dados | `AvGrid`, `AvTable`, `AvPaginator`, `AvCalendar` |
|
|
73
|
-
| Navegação | `AvSidenav`, `AvNavLink`, `AvNavDropdown`, `AvTabs`, `AvTab`, `AvStepper`, `AvStep` |
|
|
74
|
-
| Feedback | `AvProgressBar`, `AvProgressBarCircle` |
|
|
70
|
+
| Base | `AvAvatar`, `AvBadge`, `AvButton`, `AvButtonGroup`, `AvCard`, `AvChip`, `AvIcon`, `AvTag` |
|
|
71
|
+
| Formulários | `AvForm`, `AvInput`, `AvInputGroup`, `AvSelect`, `AvMultiSelect`, `AvCheckbox`, `AvRadioGroup`, `AvRadio`, `AvCurrencyInput`, `AvDateTimePicker`, `AvSwitch`, `AvSlider`, `AvFileUpload`, `AvTextArea` |
|
|
72
|
+
| Layout e dados | `AvAccordion`, `AvGrid`, `AvTable`, `AvPaginator`, `AvCalendar`, `AvTimeline` |
|
|
73
|
+
| Navegação | `AvBottomnav`, `AvBreadcrumb`, `AvSidenav`, `AvNavLink`, `AvNavDropdown`, `AvTabs`, `AvTab`, `AvStepper`, `AvStep` |
|
|
74
|
+
| Feedback | `AvAlert`, `AvEmptyState`, `AvSkeleton`, `AvProgressBar`, `AvProgressBarCircle` |
|
|
75
75
|
| Mídia | `AvCarousel`, `AvCarouselItem` |
|
|
76
|
-
| Overlay | `AvTooltip`, `AvDropdown`, `AvDropdownItem` |
|
|
77
|
-
| Primitives | `AvText` |
|
|
76
|
+
| Overlay | `AvTooltip`, `AvDropdown`, `AvDropdownItem`, `AvToast`, `ToastService`, `AvDialog`, `AvPopover`, `AvDrawer` |
|
|
77
|
+
| Primitives | `AvText`, `AvBox`, `AvCenter`, `AvHeading`, `AvKbd`, `AvSpacer`, `AvVisuallyHidden` |
|
|
78
78
|
|
|
79
79
|
### Primitives
|
|
80
80
|
|
|
@@ -107,6 +107,19 @@ A biblioteca pode ser usada em aplicações Ionic/Capacitor como camada de compo
|
|
|
107
107
|
</av-sidenav>
|
|
108
108
|
```
|
|
109
109
|
|
|
110
|
+
### Navegação inferior
|
|
111
|
+
|
|
112
|
+
`AvBottomnav` projeta `AvNavLink` e muda o destaque ativo com `highlight`: `floating-circle`, `normal`, `static`, `inline-label` ou `underline`.
|
|
113
|
+
|
|
114
|
+
```html
|
|
115
|
+
<av-bottomnav highlight="underline" variant="purple">
|
|
116
|
+
<av-nav-link label="Home" icon="menu" [active]="true" variant="purple" />
|
|
117
|
+
<av-nav-link label="Buscar" icon="search" variant="purple" />
|
|
118
|
+
<av-nav-link label="Agenda" icon="calendar_today" variant="purple" />
|
|
119
|
+
<av-nav-link label="Perfil" icon="schedule" variant="purple" />
|
|
120
|
+
</av-bottomnav>
|
|
121
|
+
```
|
|
122
|
+
|
|
110
123
|
## Serviços
|
|
111
124
|
|
|
112
125
|
### `ThemeService`
|
|
@@ -159,47 +172,20 @@ Depois de registrado, o ícone pode ser usado pelos componentes que aceitam nome
|
|
|
159
172
|
<button av-button icon="custom-icon">Ação</button>
|
|
160
173
|
```
|
|
161
174
|
|
|
162
|
-
## Roadmap
|
|
163
|
-
### Fase 1: Feedback e primitives
|
|
164
|
-
|
|
165
|
-
1. `AvSpinner` — loading indeterminado simples.
|
|
166
|
-
2. `AvSkeleton` — estado de carregamento reutilizável.
|
|
167
|
-
3. `AvAlert` — feedback com `variant`, `appearance` e `AvIcon`.
|
|
168
|
-
4. `AvEmptyState` — estado vazio para tabelas, selects, árvores e outras telas.
|
|
169
|
-
9. `AvVisuallyHidden` — conteúdo visualmente oculto para acessibilidade.
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
10. `AvToast` — feedback temporário em overlay.
|
|
174
|
-
11. `ToastService` — API programática para exibir toasts.
|
|
175
|
-
12. `AvDialog` — base para overlays complexos.
|
|
176
|
-
13. `AvPopover` — conteúdo contextual usando a infraestrutura de overlay.
|
|
177
|
-
14. `AvDrawer` — variação estrutural de diálogo.
|
|
178
|
-
|
|
179
|
-
### Fase 3: Componentes básicos
|
|
180
|
-
|
|
181
|
-
15. `AvAccordion` — conteúdo expansível.
|
|
182
|
-
16. `AvBreadcrumb` — navegação hierárquica.
|
|
183
|
-
17. `AvRadioGroup` e `AvRadio` — controles de seleção única para completar os forms.
|
|
184
|
-
|
|
185
|
-
### Fase 4: Componentes compostos
|
|
175
|
+
## Roadmap restante
|
|
186
176
|
|
|
187
|
-
|
|
188
|
-
19. `AvDateRangePicker` — evolução do `AvDateTimePicker`.
|
|
189
|
-
20. `AvDataTable` — tabela com ordenação, filtros, seleção, loading, estado vazio e paginação.
|
|
177
|
+
O roadmap mostra apenas o que ainda falta implementar como componente dedicado. O que já foi entregue aparece na tabela de componentes disponíveis.
|
|
190
178
|
|
|
191
|
-
###
|
|
179
|
+
### Média complexidade
|
|
192
180
|
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
24. `AvIconPicker` — catálogo de ícones usando registry, combobox, grid e popover.
|
|
181
|
+
1. `AvCombobox` — input, overlay, busca, seleção e navegação por teclado.
|
|
182
|
+
2. `AvDateRangePicker` — evolução do `AvDateTimePicker` para intervalos.
|
|
183
|
+
3. `AvIconPicker` — catálogo de ícones usando registry, busca, grid e popover.
|
|
197
184
|
|
|
198
|
-
###
|
|
185
|
+
### Alta complexidade
|
|
199
186
|
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
27. `AvCenter` — centralização de conteúdo.
|
|
203
|
-
28. `AvSpacer` — espaçamento explícito em layouts.
|
|
187
|
+
4. `AvTreeView` — árvore com expansão, seleção, estado parcial e navegação por teclado.
|
|
188
|
+
5. `AvCommandPalette` — busca e navegação por teclado composta por diálogo, input, ícones, atalhos e estado vazio.
|
|
204
189
|
|
|
205
|
-
|
|
190
|
+
### Incrementos futuros
|
|
191
|
+
As primeiras versões de `AvAccordion`, `AvButtonGroup`, `AvInputGroup`, `AvRadioGroup`, `AvBreadcrumb` e `AvTimeline` priorizam API simples, projeção de conteúdo e integração com Angular Forms onde necessário. Versões futuras podem ampliar casos específicos, como navegação por teclado mais rica no `AvAccordion` e seleção múltipla no `AvButtonGroup`.
|