@praxisui/dynamic-fields 9.0.6 → 9.0.8
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.
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"schemaVersion": "1.0.0",
|
|
3
|
-
"generatedAt": "2026-08-
|
|
3
|
+
"generatedAt": "2026-08-20T18:11:26.392Z",
|
|
4
4
|
"packageName": "@praxisui/dynamic-fields",
|
|
5
|
-
"packageVersion": "9.0.
|
|
5
|
+
"packageVersion": "9.0.8",
|
|
6
6
|
"sourceRegistry": "praxis-component-registry-ingestion",
|
|
7
7
|
"sourceRegistryVersion": "1.0.0",
|
|
8
8
|
"componentCount": 76,
|
|
@@ -37,7 +37,7 @@ keywords:
|
|
|
37
37
|
- "select vs autocomplete"
|
|
38
38
|
- "custom host field"
|
|
39
39
|
- "inline filter"
|
|
40
|
-
last_updated: "2026-
|
|
40
|
+
last_updated: "2026-08-20"
|
|
41
41
|
---
|
|
42
42
|
|
|
43
43
|
# Dynamic Fields Field Selection Guide
|
|
@@ -107,13 +107,13 @@ Se o schema usa `input` para algo que depois exige validacao pesada, busca seman
|
|
|
107
107
|
|
|
108
108
|
## 2. Local vs remoto
|
|
109
109
|
|
|
110
|
-
| Scenario
|
|
111
|
-
|
|
|
112
|
-
| poucas opcoes estaveis
|
|
113
|
-
| lista media/grande com busca local
|
|
114
|
-
| lista remota/paginada
|
|
115
|
-
| entidade de negocio remota com status, permissao, reidratacao ou dependencias | `entityLookup`
|
|
116
|
-
| busca incremental com semantica de sugestao
|
|
110
|
+
| Scenario | Prefer | Why |
|
|
111
|
+
| ----------------------------------------------------------------------------- | ------------------- | ------------------------------------------------------------------------------------------------------------- |
|
|
112
|
+
| poucas opcoes estaveis | `select` | simples, previsivel, barato |
|
|
113
|
+
| lista media/grande com busca local | `searchable-select` | reduz carga visual |
|
|
114
|
+
| lista remota/paginada | `async-select` | evita preload caro |
|
|
115
|
+
| entidade de negocio remota com status, permissao, reidratacao ou dependencias | `entityLookup` | preserva identidade de entidade e usa contrato `RESOURCE_ENTITY` em vez de tratar entidade como opcao simples |
|
|
116
|
+
| busca incremental com semantica de sugestao | `autoComplete` | boa UX para descoberta |
|
|
117
117
|
|
|
118
118
|
### Invariante de UX para selecao pesquisavel
|
|
119
119
|
|
|
@@ -131,6 +131,36 @@ pode manter dois estados internos, mas eles nao podem ser confundidos:
|
|
|
131
131
|
- limpar, indicador de abertura e ajuda permanecem agrupados em uma unica faixa
|
|
132
132
|
de sufixo, sem aumentar a altura do campo em layouts estreitos.
|
|
133
133
|
|
|
134
|
+
#### Contrato de composição da faixa de ações
|
|
135
|
+
|
|
136
|
+
Os controles Material de seleção (`select`, `searchable-select`,
|
|
137
|
+
`async-select`, `multiSelect` e `autoComplete`) compartilham uma faixa final de
|
|
138
|
+
ações. Ela é uma regra de composição interna da biblioteca, não uma nova
|
|
139
|
+
configuração de metadata:
|
|
140
|
+
|
|
141
|
+
- quando presente, o indicador de abertura pertence ao trigger e nunca é uma
|
|
142
|
+
ação tabulável;
|
|
143
|
+
- `clearButton` e ajuda popover são renderizados somente quando efetivamente
|
|
144
|
+
disponíveis; a faixa não reserva slots para ações ausentes;
|
|
145
|
+
- a ordem visual e de foco é sempre trigger, limpar e ajuda;
|
|
146
|
+
- cada botão de ícone preserva nome acessível localizado, foco visível e alvo
|
|
147
|
+
compatível com uso por toque;
|
|
148
|
+
- indicador, limpar e ajuda mantêm espaçamento lógico, inclusive em RTL, sem
|
|
149
|
+
sobrepor valor, label ou contorno;
|
|
150
|
+
- loading substitui temporariamente o indicador de abertura, sem criar um novo
|
|
151
|
+
item na ordem de foco;
|
|
152
|
+
- readonly remove o indicador de abertura e bloqueia mutações sem transformar o
|
|
153
|
+
valor em estado disabled; disabled remove o trigger da interação nativa;
|
|
154
|
+
- em viewport estreito, o valor trunca dentro do trigger e a faixa preserva as
|
|
155
|
+
ações, sem provocar scroll horizontal.
|
|
156
|
+
|
|
157
|
+
A matriz mínima de regressão deve cobrir: somente indicador; indicador +
|
|
158
|
+
limpar; indicador + ajuda; indicador + limpar + ajuda; loading; readonly;
|
|
159
|
+
disabled; valor longo; viewport estreito; e RTL. Mudanças na família de Selects
|
|
160
|
+
não devem ser aprovadas apenas por comparação visual: o gate deve verificar
|
|
161
|
+
geometria, ordem de teclado, nomes acessíveis e retorno de foco ao fechar o
|
|
162
|
+
overlay.
|
|
163
|
+
|
|
134
164
|
Em `async-select`, `searchable=true` e `multiple=false` materializam esse
|
|
135
165
|
combobox unico. Nao insira input, botao, toolbar ou footer interativo dentro de
|
|
136
166
|
`mat-select`; para resultados remotos, a carga incremental do combobox ocorre
|
|
@@ -177,10 +207,10 @@ Checklist minimo para promocao:
|
|
|
177
207
|
|
|
178
208
|
Exemplos oficiais atuais:
|
|
179
209
|
|
|
180
|
-
| Exemplo
|
|
181
|
-
|
|
|
210
|
+
| Exemplo | Papel na plataforma | Status |
|
|
211
|
+
| ------------------------------ | ---------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- |
|
|
182
212
|
| `human-resources.funcionarios` | referencia base de entidade humana reutilizavel em formularios, filtros e detalhes por surface | oficial para demonstrar `entityLookup` simples e `inlineEntityLookup` |
|
|
183
|
-
| `procurement.*`
|
|
213
|
+
| `procurement.*` | demo enterprise com fornecedor, empresa, contrato, produto e pedido de compra dependentes | oficial como prova corporativa de dependencias e reidratacao |
|
|
184
214
|
|
|
185
215
|
Novos candidatos, como centros de custo, contratos, projetos ou ativos, devem
|
|
186
216
|
entrar por esse mesmo funil. Se o recurso ainda nao publica `byIds`,
|
|
@@ -189,16 +219,41 @@ mas nao como exemplo canonico completo.
|
|
|
189
219
|
|
|
190
220
|
## 3. Simples vs range
|
|
191
221
|
|
|
192
|
-
| Need
|
|
193
|
-
|
|
|
194
|
-
| um numero
|
|
195
|
-
| um valor monetario
|
|
196
|
-
| uma data
|
|
197
|
-
| uma hora
|
|
198
|
-
| faixa numerica
|
|
199
|
-
| faixa monetaria
|
|
200
|
-
| faixa temporal
|
|
201
|
-
| lista repetivel de objetos | `array`
|
|
222
|
+
| Need | Prefer | Avoid |
|
|
223
|
+
| -------------------------- | -------------------------- | ------------------------------------ |
|
|
224
|
+
| um numero | `numericTextBox` | `rangeSlider` |
|
|
225
|
+
| um valor monetario | `currency` | `priceRange` |
|
|
226
|
+
| uma data | `date` | `dateRange` |
|
|
227
|
+
| uma hora | `time` ou `timePicker` | `timeRange` |
|
|
228
|
+
| faixa numerica | `rangeSlider` | dois `numericTextBox` desconectados |
|
|
229
|
+
| faixa monetaria | `priceRange` | dois `currency` soltos |
|
|
230
|
+
| faixa temporal | `dateRange` ou `timeRange` | dois campos sem semantica de range |
|
|
231
|
+
| lista repetivel de objetos | `array` | varios grupos duplicados manualmente |
|
|
232
|
+
|
|
233
|
+
### Contrato de ações dos campos Material
|
|
234
|
+
|
|
235
|
+
Campos escalares como `input`, `textarea`, `email`, `url`, `search`, `phone`,
|
|
236
|
+
`numericTextBox`, `currency`, `password`, `dateInput`, `datetimeLocal`, `month`,
|
|
237
|
+
`week`, `year` e `time` materializam limpar e ajuda em uma única faixa final,
|
|
238
|
+
nessa ordem, sem reservar slots para ações ausentes. Símbolos, unidades e ícones
|
|
239
|
+
de contexto permanecem semanticamente ligados ao valor e aparecem antes da
|
|
240
|
+
faixa. Em `password`, revelar precede limpar e ajuda.
|
|
241
|
+
|
|
242
|
+
`date`, `dateRange`, `timePicker` e `timeRange` preservam a ordem: valor, toggle
|
|
243
|
+
do seletor, limpar e ajuda. Em `timeRange`, as ações que afetam o intervalo
|
|
244
|
+
completo pertencem ao segundo campo, depois do toggle de fim; não devem aparecer
|
|
245
|
+
soltas abaixo do par. Hint e erro do intervalo pertencem ao subscript dinâmico do
|
|
246
|
+
grupo e devem ser descritos pelos dois inputs.
|
|
247
|
+
|
|
248
|
+
Todas essas famílias e os controles de seleção reutilizam a mesma composição
|
|
249
|
+
interna de clear/help. Variantes podem projetar adornos não interativos antes ou
|
|
250
|
+
depois do clear (por exemplo, spinner e seta), mas não podem recriar geometria,
|
|
251
|
+
foco ou espaçamento localmente.
|
|
252
|
+
|
|
253
|
+
Todos os botões usam alvos mínimos de 40 px, nomes acessíveis e foco visível. Em
|
|
254
|
+
readonly ou presentation, os toggles e mutações ficam desabilitados. Em largura
|
|
255
|
+
estreita, ranges podem empilhar os campos, mas não provocar scroll horizontal
|
|
256
|
+
nem separar as ações do campo que as contextualiza.
|
|
202
257
|
|
|
203
258
|
## 4. Padrao vs custom host
|
|
204
259
|
|
|
@@ -253,30 +308,30 @@ Use `rich-content` quando:
|
|
|
253
308
|
|
|
254
309
|
## 7. Decision table
|
|
255
310
|
|
|
256
|
-
| Question
|
|
257
|
-
|
|
|
258
|
-
| o usuario escreve texto curto?
|
|
259
|
-
| o usuario escreve texto longo?
|
|
260
|
-
| o usuario escolhe 1 opcao de lista pequena?
|
|
261
|
-
| o usuario escolhe 1 opcao de lista grande?
|
|
262
|
-
| a lista vem do backend sob demanda?
|
|
263
|
-
| o usuario escolhe entidade real do dominio?
|
|
264
|
-
| a UX parece busca com sugestoes?
|
|
265
|
-
| o valor e monetario?
|
|
266
|
-
| o valor e data?
|
|
267
|
-
| o valor e horario?
|
|
268
|
-
| o padrao e lookup governado com busca?
|
|
269
|
-
| o padrao e range com semantica propria?
|
|
270
|
-
| o padrao e visual semantico?
|
|
271
|
-
| o valor e booleano?
|
|
272
|
-
| a escolha unica precisa ser muito explicita?
|
|
273
|
-
| ha multiplas escolhas discretas?
|
|
274
|
-
| ha hierarquia?
|
|
275
|
-
| ha uma colecao repetivel de objetos?
|
|
276
|
-
| ha anexos?
|
|
277
|
-
| o controle e acao, nao dado?
|
|
278
|
-
| o valor readonly precisa de indicador compacto em celula/lista/formulario? | `presentation.presenter = "microVisualization"`
|
|
279
|
-
| nada do catalogo resolve sem gambiarra?
|
|
311
|
+
| Question | Prefer |
|
|
312
|
+
| -------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- |
|
|
313
|
+
| o usuario escreve texto curto? | `input` |
|
|
314
|
+
| o usuario escreve texto longo? | `textarea` |
|
|
315
|
+
| o usuario escolhe 1 opcao de lista pequena? | `select` |
|
|
316
|
+
| o usuario escolhe 1 opcao de lista grande? | `searchable-select` |
|
|
317
|
+
| a lista vem do backend sob demanda? | `async-select` |
|
|
318
|
+
| o usuario escolhe entidade real do dominio? | `entityLookup` |
|
|
319
|
+
| a UX parece busca com sugestoes? | `autoComplete` |
|
|
320
|
+
| o valor e monetario? | `currency` / `priceRange` |
|
|
321
|
+
| o valor e data? | `date` / `dateRange` |
|
|
322
|
+
| o valor e horario? | `time` / `timePicker` / `timeRange` |
|
|
323
|
+
| o padrao e lookup governado com busca? | `entityLookup` quando houver identidade/status/politica; `searchable-select` / `async-select` / `autoComplete` para opcoes simples |
|
|
324
|
+
| o padrao e range com semantica propria? | `priceRange` / `dateRange` / `timeRange` / `inlineDateRange` |
|
|
325
|
+
| o padrao e visual semantico? | `rating` / `inlinePipelineStatus` / `inlineSentiment` / `inlineColorLabel` |
|
|
326
|
+
| o valor e booleano? | `toggle` |
|
|
327
|
+
| a escolha unica precisa ser muito explicita? | `radio` ou `buttonToggle` |
|
|
328
|
+
| ha multiplas escolhas discretas? | `checkbox` ou `multiSelect` |
|
|
329
|
+
| ha hierarquia? | `treeSelect` / `multiSelectTree` |
|
|
330
|
+
| ha uma colecao repetivel de objetos? | `array` |
|
|
331
|
+
| ha anexos? | `upload` |
|
|
332
|
+
| o controle e acao, nao dado? | `button` |
|
|
333
|
+
| o valor readonly precisa de indicador compacto em celula/lista/formulario? | `presentation.presenter = "microVisualization"` |
|
|
334
|
+
| nada do catalogo resolve sem gambiarra? | field custom do host |
|
|
280
335
|
|
|
281
336
|
## 8. Enterprise recommendations
|
|
282
337
|
|