@praxisui/dynamic-fields 9.0.59 → 9.0.61
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 +1 -1
- package/ai/component-registry.json +21425 -311
- package/docs/dynamic-fields-inline-components-guide.md +8 -7
- package/docs/dynamic-fields-inline-filter-runtime-contract.md +2 -0
- package/fesm2022/praxisui-dynamic-fields.mjs +4157 -1584
- package/package.json +3 -3
- package/src/lib/components/inline-currency-range/pdx-inline-currency-range.json-api.md +12 -5
- package/src/lib/components/inline-distance-radius/pdx-inline-distance-radius.json-api.md +140 -485
- package/src/lib/components/inline-rating/pdx-inline-rating.json-api.md +127 -438
- package/types/praxisui-dynamic-fields.d.ts +118 -14
|
@@ -7,7 +7,7 @@ document_kind: "json-api-canonical"
|
|
|
7
7
|
reference_mode: "canonical"
|
|
8
8
|
contract_format: "json"
|
|
9
9
|
contract_source: "runtime-and-code"
|
|
10
|
-
description: "
|
|
10
|
+
description: "Contrato canônico do filtro inline de avaliação, incluindo meia estrela, gradiente e confirmação explícita."
|
|
11
11
|
category: "components"
|
|
12
12
|
sub_category: "dynamic-fields"
|
|
13
13
|
audience:
|
|
@@ -18,11 +18,11 @@ level: "advanced"
|
|
|
18
18
|
status: "active"
|
|
19
19
|
owner: "praxis-ui"
|
|
20
20
|
source_of_truth:
|
|
21
|
-
- "projects/praxis-dynamic-fields/src/lib/components/inline-rating/inline-rating.component.ts"
|
|
22
|
-
- "projects/praxis-dynamic-fields/src/lib/components/inline-range-slider/inline-range-slider.component.ts"
|
|
23
21
|
- "projects/praxis-core/src/lib/models/material-field-metadata.interface.ts"
|
|
24
|
-
|
|
25
|
-
|
|
22
|
+
- "projects/praxis-dynamic-fields/src/lib/components/inline-rating/inline-rating.component.ts"
|
|
23
|
+
- "projects/praxis-metadata-editor/src/lib/config/inline-rating.config.ts"
|
|
24
|
+
source_of_truth_last_verified: "2026-09-04"
|
|
25
|
+
last_updated: "2026-09-04"
|
|
26
26
|
toc: true
|
|
27
27
|
sidebar: true
|
|
28
28
|
tags:
|
|
@@ -32,516 +32,227 @@ tags:
|
|
|
32
32
|
api_stability: "canonical"
|
|
33
33
|
schema_verified: true
|
|
34
34
|
runtime_verified: true
|
|
35
|
-
editor_coverage_verified:
|
|
35
|
+
editor_coverage_verified: true
|
|
36
36
|
runtime_scope: "public"
|
|
37
37
|
legacy_paths_present: true
|
|
38
38
|
has_known_mismatches: false
|
|
39
39
|
related_components:
|
|
40
40
|
- "praxis-table"
|
|
41
41
|
- "pdx-inline-range-slider"
|
|
42
|
-
- "pdx-material-
|
|
42
|
+
- "pdx-material-rating"
|
|
43
43
|
---
|
|
44
44
|
|
|
45
45
|
# pdx-inline-rating
|
|
46
46
|
|
|
47
|
-
|
|
47
|
+
Filtro compacto para uma avaliação mínima/máxima. A seleção primária acontece em um range slider; as estrelas comunicam a escala e refletem valores inteiros ou de meia estrela.
|
|
48
48
|
|
|
49
49
|
## Summary
|
|
50
50
|
|
|
51
|
-
-
|
|
52
|
-
-
|
|
53
|
-
-
|
|
54
|
-
-
|
|
51
|
+
- `min`, `max` e `step` definem a escala canônica.
|
|
52
|
+
- `step: 0.5` habilita meia estrela sem criar um segundo modelo de valor.
|
|
53
|
+
- Em modo explícito, o painel mantém rascunho até Aplicar.
|
|
54
|
+
- O gradiente de três stops pode ser configurado visualmente no editor de metadados.
|
|
55
55
|
|
|
56
56
|
## Purpose and scope
|
|
57
57
|
|
|
58
|
-
|
|
59
|
-
- Esta referencia cobre contrato publico, classificacao de paths e semantica de cobertura (runtime/schema/editor).
|
|
60
|
-
- Fora de escopo: quickstart, tutorial narrativo e notas arquiteturais que nao alteram contrato publico.
|
|
58
|
+
Use para filtrar satisfação, qualidade, risco ou desempenho quando a métrica corporativa já estiver representada por uma escala de avaliação. A definição da métrica e suas regras pertencem ao domínio, não ao componente.
|
|
61
59
|
|
|
62
60
|
## Consulta rapida (obrigatorio)
|
|
63
61
|
|
|
64
|
-
|
|
|
65
|
-
| --- | --- | --- |
|
|
66
|
-
|
|
|
67
|
-
|
|
|
68
|
-
|
|
|
69
|
-
|
|
|
70
|
-
|
|
|
71
|
-
|
|
|
72
|
-
| Known mismatches | `false` | Registrar observed vs desired de forma auditavel | Active | frontmatter.has_known_mismatches |
|
|
62
|
+
| Tema | Contrato | Status |
|
|
63
|
+
| --- | --- | --- |
|
|
64
|
+
| Escala | `min`, `max`, `step` | Active |
|
|
65
|
+
| Meia estrela | `step: 0.5` | Active |
|
|
66
|
+
| Valor | `{ start, end }` | Active |
|
|
67
|
+
| Confirmação | `inlineOverlay.applyMode: explicit` | Active |
|
|
68
|
+
| Gradiente | `ratingGradientLowColor/MidColor/HighColor` | Active |
|
|
69
|
+
| Steppers | marcas derivadas de `step` e `showTicks` | Active |
|
|
73
70
|
|
|
74
71
|
## Source of truth
|
|
75
72
|
|
|
76
|
-
|
|
|
77
|
-
| --- | --- |
|
|
78
|
-
|
|
|
79
|
-
|
|
|
80
|
-
|
|
|
73
|
+
| Fonte | Responsabilidade |
|
|
74
|
+
| --- | --- |
|
|
75
|
+
| `material-field-metadata.interface.ts` | Paths públicos compartilhados e aliases legados |
|
|
76
|
+
| `inline-rating.component.ts` | Interação, formatação e estado draft/committed |
|
|
77
|
+
| `inline-rating.config.ts` | Cobertura visual do editor |
|
|
81
78
|
|
|
82
79
|
## Support legend
|
|
83
80
|
|
|
84
|
-
- **Active
|
|
85
|
-
- **
|
|
86
|
-
- **
|
|
87
|
-
- **Schema-only**: presente em schema/tipos sem cobertura runtime confirmada.
|
|
81
|
+
- **Active:** comportamento coberto por runtime e testes focais.
|
|
82
|
+
- **Deprecated:** alias mantido apenas para migração.
|
|
83
|
+
- **Host-owned:** regra que precisa ser fornecida pelo consumidor.
|
|
88
84
|
|
|
89
85
|
## Contract status snapshot
|
|
90
86
|
|
|
91
|
-
|
|
|
87
|
+
| Superfície | Estado | Observação |
|
|
92
88
|
| --- | --- | --- |
|
|
93
|
-
|
|
|
94
|
-
|
|
|
95
|
-
|
|
|
96
|
-
|
|
|
97
|
-
| Runtime verified | `true` | Revisar sempre com evidencia de runtime |
|
|
98
|
-
| Schema verified | `true` | Revisar sempre com evidencia de tipos/schema |
|
|
99
|
-
| Editor coverage verified | `false` | Revisar sempre com evidencia de editor/tooling |
|
|
100
|
-
| Current path hygiene | `true` | Segregar consistencia do contrato canonico |
|
|
101
|
-
| Has known mismatches | `false` | Divergencias devem aparecer em secao dedicada |
|
|
89
|
+
| Runtime | Active | Range, meia estrela, presets, ticks e gradiente |
|
|
90
|
+
| Schema/type | Active | Usa contrato de range estendido |
|
|
91
|
+
| Editor visual | Active | Escala, ações, cores e responsividade |
|
|
92
|
+
| Persistência | Host-owned | O componente não armazena configuração |
|
|
102
93
|
|
|
103
94
|
## Contract classification (obrigatorio)
|
|
104
95
|
|
|
105
96
|
### Canonical paths (public contract)
|
|
106
97
|
|
|
107
|
-
| Path |
|
|
108
|
-
| --- | --- | --- | --- |
|
|
109
|
-
| `metadata` |
|
|
110
|
-
| `
|
|
111
|
-
| `metadata.
|
|
112
|
-
| `metadata.
|
|
113
|
-
| `metadata.
|
|
114
|
-
| `metadata.
|
|
115
|
-
| `
|
|
116
|
-
| `
|
|
98
|
+
| Path | Tipo | Default | Cobertura |
|
|
99
|
+
| --- | --- | --- | --- |
|
|
100
|
+
| `metadata.controlType` | `inlineRating` | obrigatório | Runtime/editor |
|
|
101
|
+
| `metadata.min` | number | `1` | Runtime/editor |
|
|
102
|
+
| `metadata.max` | number | `5` | Runtime/editor |
|
|
103
|
+
| `metadata.step` | number | `1` | Runtime/editor |
|
|
104
|
+
| `metadata.allowHalf` | boolean | `false` | Runtime/editor |
|
|
105
|
+
| `metadata.itemsCount` | number | derivado de max | Runtime/editor |
|
|
106
|
+
| `metadata.quickPresets` | array/string | vazio | Runtime/editor |
|
|
107
|
+
| `metadata.ratingGradientLowColor` | CSS color | token semântico | Runtime/editor |
|
|
108
|
+
| `metadata.ratingGradientMidColor` | CSS color | token semântico | Runtime/editor |
|
|
109
|
+
| `metadata.ratingGradientHighColor` | CSS color | token semântico | Runtime/editor |
|
|
110
|
+
| `metadata.ratingBadgeIcon` | string | `star` | Runtime/editor |
|
|
111
|
+
| `metadata.inlineOverlay` | object | modo compartilhado | Runtime/editor |
|
|
112
|
+
| `metadata.inlineAutoSize` | object | tokens responsivos | Runtime/editor |
|
|
117
113
|
|
|
118
114
|
### Path audit
|
|
119
115
|
|
|
120
|
-
|
|
|
121
|
-
| --- | --- | --- |
|
|
122
|
-
| `
|
|
123
|
-
| `
|
|
124
|
-
| `
|
|
125
|
-
| `
|
|
126
|
-
| `
|
|
127
|
-
| `
|
|
128
|
-
| `
|
|
129
|
-
|
|
116
|
+
| Path legado | Substituição | Estado |
|
|
117
|
+
| --- | --- | --- |
|
|
118
|
+
| `ratingMin` | `min` | Deprecated |
|
|
119
|
+
| `ratingMax` | `max` | Deprecated |
|
|
120
|
+
| `ratingStep` | `step` | Deprecated |
|
|
121
|
+
| `ratingAllowHalf` | `allowHalf` | Deprecated |
|
|
122
|
+
| `ratingPrecision` / `precision` | `step` | Deprecated |
|
|
123
|
+
| `ratingIcon` | `prefixIcon` | Deprecated |
|
|
124
|
+
| `ratingToneColors` / `ratingColors` / `starColors` | três stops de gradiente | Deprecated |
|
|
125
|
+
|
|
126
|
+
Não existe path público chamado `0.5`; esse valor é uma opção válida de `step`.
|
|
130
127
|
|
|
131
128
|
### Internal-only paths
|
|
132
129
|
|
|
133
|
-
|
|
130
|
+
Percentuais de preenchimento parcial, índices das estrelas e controles temporários do painel não são configuração pública.
|
|
134
131
|
|
|
135
132
|
### Experimental paths
|
|
136
133
|
|
|
137
|
-
|
|
134
|
+
Não há paths experimentais publicados.
|
|
138
135
|
|
|
139
136
|
## Public contract surface (obrigatorio)
|
|
140
137
|
|
|
141
138
|
### Top-level configuration blocks
|
|
142
139
|
|
|
143
|
-
|
|
144
|
-
| --- | --- | --- | --- | --- |
|
|
145
|
-
| `metadata` | Payload declarativo principal do componente | true | deep-merge | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
146
|
-
| `0` | Configuracao especifica de runtime | false | override | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
147
|
-
| `readonlyMode` | Override de readonly no host/runtime | false | override | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
148
|
-
| `disabledMode` | Override de disabled no host/runtime | false | override | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
149
|
-
| `visible` | Override de visibilidade no host/runtime | false | override | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
150
|
-
| `presentationMode` | Renderizacao de apresentacao sem interacao | false | override | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
140
|
+
O host fornece `FieldMetadata`; o valor confirmado é mantido no `FormControl` como faixa `{ start, end }`.
|
|
151
141
|
|
|
152
142
|
### Nested configuration blocks
|
|
153
143
|
|
|
154
|
-
|
|
155
|
-
| --- | --- | --- | --- | --- | --- |
|
|
156
|
-
| `0.5` | unknown | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
157
|
-
| `metadata.ratingIcon` | string | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
158
|
-
| `metadata.prefixIcon` | string | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
159
|
-
| `metadata.inlineAutoSize.*` | object | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
160
|
-
| `metadata.quickPresets` | array | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
144
|
+
`inlineOverlay.actions` configura Aplicar, Cancelar e Limpar. `inlineAutoSize` configura limites responsivos. Os três stops de gradiente permanecem propriedades independentes.
|
|
161
145
|
|
|
162
146
|
### Input bindings (inbound data)
|
|
163
147
|
|
|
164
|
-
|
|
165
|
-
| --- | --- | --- | --- | --- | --- |
|
|
166
|
-
| `metadata` | object | true | host-json | component-defined | Primary inbound contract payload. |
|
|
167
|
-
| `readonlyMode` | boolean | false | host-runtime | not-yet-verified | Host-level behavioral override. |
|
|
168
|
-
| `disabledMode` | boolean | false | host-runtime | not-yet-verified | Host-level behavioral override. |
|
|
169
|
-
| `visible` | boolean | false | host-runtime | not-yet-verified | Host-level behavioral override. |
|
|
170
|
-
| `presentationMode` | boolean | false | host-runtime | not-yet-verified | Host-level behavioral override. |
|
|
148
|
+
Metadados, controle externo e estados globais são herdados do runtime de Dynamic Fields.
|
|
171
149
|
|
|
172
150
|
### Output events
|
|
173
151
|
|
|
174
|
-
|
|
175
|
-
| --- | --- | --- | --- | --- |
|
|
176
|
-
| `valueChange` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
177
|
-
| `focusChange` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
178
|
-
| `nativeBlur` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
179
|
-
| `nativeChange` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
152
|
+
O componente usa CVA/`FormControl`. Interações temporárias não devem alterar o valor confirmado antes de Aplicar.
|
|
180
153
|
|
|
181
154
|
### External side channels
|
|
182
155
|
|
|
183
|
-
|
|
184
|
-
| --- | --- | --- | --- | --- |
|
|
185
|
-
| `host/services/storage` | bidirectional | component-defined | component-defined | Side channels variam por componente e host; verificar em source_of_truth. |
|
|
156
|
+
Não existem chamadas HTTP ou persistência dentro do componente.
|
|
186
157
|
|
|
187
158
|
### Host/runtime dependencies
|
|
188
159
|
|
|
189
|
-
|
|
190
|
-
| --- | --- | --- | --- | --- |
|
|
191
|
-
| `inline-rating.component.ts` | true | browser/dev/prod/ssr | contract resolution | Refer to `projects/praxis-dynamic-fields/src/lib/components/inline-rating/inline-rating.component.ts`. |
|
|
192
|
-
| `inline-range-slider.component.ts` | true | browser/dev/prod/ssr | contract resolution | Refer to `projects/praxis-dynamic-fields/src/lib/components/inline-range-slider/inline-range-slider.component.ts`. |
|
|
193
|
-
| `material-field-metadata.interface.ts` | true | browser/dev/prod/ssr | contract resolution | Refer to `projects/praxis-core/src/lib/models/material-field-metadata.interface.ts`. |
|
|
160
|
+
Requer providers padrão de `@praxisui/core`, Dynamic Fields e Angular Material/CDK.
|
|
194
161
|
|
|
195
162
|
## Coverage by surface (obrigatorio)
|
|
196
163
|
|
|
197
164
|
### Coverage matrix (runtime, schema/type, editor/tooling)
|
|
198
165
|
|
|
199
|
-
|
|
|
200
|
-
| --- | --- | --- | --- |
|
|
201
|
-
|
|
|
202
|
-
|
|
|
203
|
-
|
|
|
166
|
+
| Capacidade | Runtime | Tipo | Editor visual |
|
|
167
|
+
| --- | --- | --- | --- |
|
|
168
|
+
| Range inteiro | Sim | Sim | Sim |
|
|
169
|
+
| Meia estrela | Sim | Sim | Sim |
|
|
170
|
+
| Ticks/steppers | Sim | Sim | Sim |
|
|
171
|
+
| Aplicar/Cancelar/Limpar | Sim | Sim | Sim |
|
|
172
|
+
| Gradiente de três stops | Sim | Sim | Sim |
|
|
173
|
+
| Presets rápidos | Sim | Sim | Sim |
|
|
204
174
|
|
|
205
175
|
### Runtime coverage boundaries
|
|
206
176
|
|
|
207
|
-
|
|
208
|
-
- Pre-condicoes: payload JSON valido, bindings de host consistentes e dependencias descritas no source_of_truth.
|
|
209
|
-
- Fora de cobertura confirmada: caminhos internos, experimentais ou aliases nao enumerados formalmente.
|
|
177
|
+
As estrelas são uma representação visual da faixa. O slider de dois thumbs é o controle primário para evitar ambiguidade entre nota exata e intervalo.
|
|
210
178
|
|
|
211
179
|
### Editor and tooling notes
|
|
212
180
|
|
|
213
|
-
|
|
214
|
-
- O que esta exposto no editor visual depende da cobertura real do workspace e nao deve ser inferido como suporte runtime total.
|
|
215
|
-
- Campos disponiveis apenas via JSON/manual devem continuar no contrato, com rotulo explicito de cobertura parcial.
|
|
216
|
-
- Quando houver divergencia entre editor e runtime, manter mismatch rastreavel em secao dedicada.
|
|
181
|
+
O editor apresenta meia estrela, escala, ticks, ações e gradiente com preview. Aliases aparecem apenas na seção de compatibilidade.
|
|
217
182
|
|
|
218
183
|
## Resolution and precedence model (obrigatorio)
|
|
219
184
|
|
|
220
185
|
### Merge order
|
|
221
186
|
|
|
222
|
-
|
|
223
|
-
2. contrato JSON recebido
|
|
224
|
-
3. overrides de host/runtime
|
|
225
|
-
4. normalizacoes internas
|
|
187
|
+
Schema canônico → override persistido → preview da sessão.
|
|
226
188
|
|
|
227
189
|
### Fallback order
|
|
228
190
|
|
|
229
|
-
|
|
191
|
+
`step` → `allowHalf` → aliases de precisão → default inteiro.
|
|
230
192
|
|
|
231
193
|
### Override points
|
|
232
194
|
|
|
233
|
-
|
|
234
|
-
- configuracao JSON de runtime
|
|
235
|
-
- integracoes de host (servicos/tokens/adapters)
|
|
195
|
+
Escala, presets, ícones, cores, ações e limites responsivos podem ser authorados por metadata.
|
|
236
196
|
|
|
237
197
|
### Runtime normalization
|
|
238
198
|
|
|
239
|
-
|
|
199
|
+
Valores são limitados a `min/max`, encaixados em `step` e ordenados como `{ start, end }`.
|
|
240
200
|
|
|
241
201
|
### Precedence rules
|
|
242
202
|
|
|
243
|
-
|
|
203
|
+
O painel e as estrelas podem exibir o rascunho; trigger, tooltip, ARIA e payload continuam no valor confirmado até Aplicar.
|
|
244
204
|
|
|
245
205
|
## Validation and error semantics (obrigatorio)
|
|
246
206
|
|
|
247
207
|
### Validation model
|
|
248
208
|
|
|
249
|
-
|
|
250
|
-
| --- | --- | --- | --- | --- |
|
|
251
|
-
| canonical-paths | parse/runtime | component-defined (warn/reject/default) | not-yet-standardized | Semantica detalhada preservada na referencia tecnica por componente. |
|
|
209
|
+
`min < max`, `step > 0`, faixa ordenada e cores CSS válidas. Para meia estrela, use `step: 0.5`.
|
|
252
210
|
|
|
253
211
|
### Invalid and unknown field handling
|
|
254
212
|
|
|
255
|
-
|
|
256
|
-
- Tipos invalidos: pode haver fallback, warning ou falha, conforme runtime especifico.
|
|
257
|
-
- Valores fora de dominio: registrar observed vs desired em Known limitations and mismatches.
|
|
213
|
+
Paths desconhecidos não ganham comportamento runtime. Aliases legados são normalizados conforme a tabela de migração.
|
|
258
214
|
|
|
259
215
|
### Fail-open / fail-closed behavior
|
|
260
216
|
|
|
261
|
-
|
|
262
|
-
| --- | --- | --- | --- |
|
|
263
|
-
| invalid-or-unknown-field | component-defined | not-yet-verified | Pode gerar warning, fallback silencioso ou rejeicao; validar por componente. |
|
|
217
|
+
Configuração visual inválida usa tokens seguros; faixa inválida impede confirmação.
|
|
264
218
|
|
|
265
219
|
### Runtime warnings vs hard failures
|
|
266
220
|
|
|
267
|
-
|
|
268
|
-
| --- | --- | --- | --- |
|
|
269
|
-
| partial-or-declared-only-coverage | warning | logs/eventos do componente | Confirmar ligacao runtime antes de uso critico. |
|
|
270
|
-
| mismatch-confirmed | error-or-warning | componente/host observability | Planejar migracao e corrigir contrato/runtime. |
|
|
221
|
+
Warnings de metadata devem ser tratados no editor. Indisponibilidade da fonte de dados é responsabilidade do host/tabela.
|
|
271
222
|
|
|
272
223
|
## Detailed API reference
|
|
273
|
-
### Preserved technical reference (normalized from previous revision)
|
|
274
|
-
|
|
275
|
-
### 1. Visao Geral e Quando Usar
|
|
276
|
-
`pdx-inline-rating` e o filtro de rating inline com estrelas, slider de faixa e tema de tons (low/mid/high).
|
|
277
|
-
|
|
278
|
-
Use quando precisar:
|
|
279
|
-
- filtrar notas em escala (ex.: satisfacao, qualidade, risco);
|
|
280
|
-
- operar em modo range com destaque visual por estrelas;
|
|
281
|
-
- aplicar meia estrela e cores corporativas configuraveis.
|
|
282
|
-
|
|
283
|
-
### 2. API do Componente (Inputs/Outputs)
|
|
284
|
-
| Propriedade | Tipo | Padrao | Obrigatorio | Comportamento |
|
|
285
|
-
| --- | --- | --- | --- | --- |
|
|
286
|
-
| `metadata` | `MaterialRangeSliderMetadata` | - | Sim | Contrato principal do rating inline. |
|
|
287
|
-
| `readonlyMode/disabledMode/visible/presentationMode` | `boolean` | `false/false/true/false` | Nao | Estados de host do campo inline. |
|
|
288
|
-
| `valueChange` | `{start:number,end:number}` | - | Output herdado | Intervalo de rating selecionado. |
|
|
289
|
-
|
|
290
|
-
### 3. Matriz de Cobertura JSON (Completa)
|
|
291
|
-
#### 3.1 Campos especificos do componente
|
|
292
|
-
| Caminho JSON | Tipo | Status | Comportamento em runtime |
|
|
293
|
-
| --- | --- | --- | --- |
|
|
294
|
-
| `metadata.min/max` e aliases `ratingMin/ratingMax/itemsCount` | `number` | Ativo | Limites da escala de rating. |
|
|
295
|
-
| `metadata.step/ratingStep` | `number` | Ativo | Passo da escala. |
|
|
296
|
-
| `metadata.allowHalf/ratingAllowHalf` | `boolean` | Ativo | Forca passo de meia estrela quando `true`. |
|
|
297
|
-
| `metadata.ratingPrecision/precision` | `number\|string` | Ativo | Ajuste adicional de precisao (`0.5`/`half`). |
|
|
298
|
-
| `metadata.ratingIcon` / `metadata.prefixIcon` | `string` | Ativo | Icone do trigger/cabecalho. |
|
|
299
|
-
| `metadata.ratingToneColors/ratingColors/starColors` | `object\|array` | Ativo | Paleta para tons low/mid/high das estrelas. |
|
|
300
|
-
| `metadata.ratingToneLowColor/mid/highColor` | `string` | Ativo | Override direto de cor por tom. |
|
|
301
|
-
| `metadata.ratingGradientLowColor/midColor/highColor` | `string` | Ativo | Gradiente semantico aplicado na escala visual das estrelas. |
|
|
302
|
-
| `metadata.ratingBadgeColor/ratingIndicatorColor` | `string` | Ativo | Cor de badges e indicador de escala. |
|
|
303
|
-
| `metadata.inlineAutoSize.*` | `object` | Ativo | Largura do trigger e painel de rating. |
|
|
304
|
-
| `metadata.inlineOverlay.applyMode` | `'auto'\|'explicit'` | Ativo | Define se slider, inputs e presets comitam durante a interacao ou ficam em rascunho ate `Aplicar`. |
|
|
305
|
-
| `metadata.inlineOverlay.actions.apply/cancel/clear` | `object` | Ativo | Labels, aria, icones, `appearance` e `colorRole` das acoes do painel, materializados por tokens do tema. |
|
|
306
|
-
| `metadata.quickPresets` | `array` | Ativo | Presets herdados do range inline para faixa de rating. |
|
|
307
|
-
|
|
308
|
-
Quando `allowHalf`/`ratingAllowHalf` ou a precisao de `0.5` estiver ativa, as estrelas do painel tambem aceitam selecao direta: clique na metade esquerda para selecionar o meio ponto anterior e na metade direita para o ponto inteiro. A selecao por estrela cria uma faixa pontual (`start = end`); use o slider para abrir uma faixa. Em `inlineOverlay.applyMode: "explicit"`, a selecao direta permanece em rascunho ate `Aplicar`.
|
|
309
|
-
|
|
310
|
-
#### 3.2 Campos herdados compartilhados (exaustivo)
|
|
311
|
-
- `projects/praxis-dynamic-fields/src/lib/components/inlineRange/pdx-inline-range-slider.json-api.md`
|
|
312
|
-
- `projects/praxis-dynamic-fields/src/lib/components/material-range-slider/pdx-material-range-slider.json-api.md`
|
|
313
|
-
|
|
314
|
-
Resumo de composicao deste componente:
|
|
315
|
-
- `Ativo`: escala de estrelas com range e tema por tons.
|
|
316
|
-
- `Extensao de runtime`: aliases `rating*` para semantica de dominio.
|
|
317
|
-
|
|
318
|
-
### 4. Mapeamento de Comportamento
|
|
319
|
-
- Sempre trabalha sobre valor de faixa (`start/end`) para representacao visual.
|
|
320
|
-
- Estrelas mudam tom conforme banda (`low/mid/high`) e selecao atual.
|
|
321
|
-
- Resolucao de passo prioriza `allowHalf`/`ratingAllowHalf`.
|
|
322
|
-
- Presets e slider usam clamp por `min/max` com snap por `step`.
|
|
323
|
-
- Com `inlineOverlay.applyMode: "explicit"`, estrelas, badges, inputs e presets refletem o rascunho do painel; `Aplicar` comita, enquanto `Cancelar`, `Esc` e fechamento externo restauram o valor anterior.
|
|
324
|
-
|
|
325
|
-
### 5. Exemplo Minimo (JSON + Uso)
|
|
326
|
-
```json
|
|
327
|
-
{
|
|
328
|
-
"componentId": "pdx-inline-rating",
|
|
329
|
-
"metadata": {
|
|
330
|
-
"name": "rating",
|
|
331
|
-
"label": "Rating",
|
|
332
|
-
"controlType": "rangeSlider",
|
|
333
|
-
"ratingMin": 1,
|
|
334
|
-
"ratingMax": 5,
|
|
335
|
-
"ratingStep": 1
|
|
336
|
-
}
|
|
337
|
-
}
|
|
338
|
-
```
|
|
339
|
-
Uso: filtro de rating inteiro (1 a 5).
|
|
340
|
-
|
|
341
|
-
### 6. Exemplo Corporativo (JSON + Uso)
|
|
342
|
-
```json
|
|
343
|
-
{
|
|
344
|
-
"componentId": "pdx-inline-rating",
|
|
345
|
-
"metadata": {
|
|
346
|
-
"name": "npsBand",
|
|
347
|
-
"label": "NPS",
|
|
348
|
-
"controlType": "rangeSlider",
|
|
349
|
-
"mode": "range",
|
|
350
|
-
"ratingMin": 0,
|
|
351
|
-
"ratingMax": 10,
|
|
352
|
-
"ratingAllowHalf": true,
|
|
353
|
-
"ratingToneLowColor": "#dc2626",
|
|
354
|
-
"ratingToneMidColor": "#f59e0b",
|
|
355
|
-
"ratingToneHighColor": "#16a34a",
|
|
356
|
-
"ratingBadgeColor": "#f59e0b",
|
|
357
|
-
"inlineOverlay": {
|
|
358
|
-
"applyMode": "explicit",
|
|
359
|
-
"actions": {
|
|
360
|
-
"apply": { "label": "Aplicar", "appearance": "filled", "colorRole": "primary" },
|
|
361
|
-
"cancel": { "label": "Cancelar", "appearance": "text", "colorRole": "neutral" },
|
|
362
|
-
"clear": { "label": "Limpar", "appearance": "outlined", "colorRole": "neutral" }
|
|
363
|
-
}
|
|
364
|
-
},
|
|
365
|
-
"inlineAutoSize": { "minWidth": 176, "maxWidth": 320, "panelMinWidth": 280, "panelMaxWidth": 400 },
|
|
366
|
-
"quickPresets": [
|
|
367
|
-
{ "id": "detractors", "label": "Detratores", "start": 0, "end": 6 },
|
|
368
|
-
{ "id": "promoters", "label": "Promotores", "start": 9, "end": 10 }
|
|
369
|
-
]
|
|
370
|
-
}
|
|
371
|
-
}
|
|
372
|
-
```
|
|
373
|
-
Uso: filtro corporativo de percepcao com bandas de NPS.
|
|
374
|
-
|
|
375
|
-
### 7. Troubleshooting e Armadilhas Comuns
|
|
376
|
-
1. Nao aplica meia estrela.
|
|
377
|
-
Correcao: habilitar `allowHalf`/`ratingAllowHalf` ou `ratingPrecision=0.5`.
|
|
378
224
|
|
|
379
|
-
|
|
380
|
-
Correcao: revisar `ratingMin/ratingMax` (ou `min/max`).
|
|
381
|
-
|
|
382
|
-
3. Cores de tom nao mudam.
|
|
383
|
-
Correcao: validar `ratingTone*` e fallback de paleta.
|
|
384
|
-
|
|
385
|
-
4. Presets nao refletem no slider.
|
|
386
|
-
Correcao: conferir intervalos de preset dentro de `min/max`.
|
|
387
|
-
|
|
388
|
-
5. Trigger sem icone custom.
|
|
389
|
-
Correcao: preencher `ratingIcon` ou `prefixIcon`.
|
|
390
|
-
|
|
391
|
-
### 8. Cross-links
|
|
392
|
-
- `projects/praxis-dynamic-fields/src/lib/components/inlineRange/pdx-inline-range-slider.json-api.md`
|
|
393
|
-
- `projects/praxis-dynamic-fields/src/lib/components/material-range-slider/pdx-material-range-slider.json-api.md`
|
|
394
|
-
|
|
395
|
-
### 9. Relatorio de Validacao Estrutural
|
|
396
|
-
- Visao geral: PASS
|
|
397
|
-
- API (inputs/outputs): PASS
|
|
398
|
-
- Cobertura JSON completa (especifico + herdado): PASS
|
|
399
|
-
- Mapeamento de comportamento: PASS
|
|
400
|
-
- Exemplo minimo: PASS
|
|
401
|
-
- Exemplo corporativo: PASS
|
|
402
|
-
- Troubleshooting: PASS
|
|
225
|
+
As propriedades comuns de range, overlay, clear button, acessibilidade e auto size também são aplicáveis.
|
|
403
226
|
|
|
404
227
|
## JSON path index (obrigatorio)
|
|
405
228
|
|
|
406
|
-
|
|
407
|
-
| --- | --- | --- | --- | --- | --- |
|
|
408
|
-
| `metadata` | object | true | n/a | Partial | See Detailed API reference. |
|
|
409
|
-
| `0.5` | unknown | false | n/a | Partial | See Detailed API reference. |
|
|
410
|
-
| `metadata.ratingIcon` | string | false | n/a | Partial | See Detailed API reference. |
|
|
411
|
-
| `metadata.prefixIcon` | string | false | n/a | Partial | See Detailed API reference. |
|
|
412
|
-
| `metadata.inlineAutoSize.*` | object | false | n/a | Partial | See Detailed API reference. |
|
|
413
|
-
| `metadata.inlineOverlay.applyMode` | `'auto'\|'explicit'` | false | `auto` | Active | Controls draft versus immediate commit behavior. |
|
|
414
|
-
| `metadata.inlineOverlay.actions.*` | object | false | n/a | Active | Panel action labels, aria, icons and theme roles. |
|
|
415
|
-
| `metadata.quickPresets` | array | false | n/a | Partial | See Detailed API reference. |
|
|
416
|
-
| `readonlyMode` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
417
|
-
| `disabledMode` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
418
|
-
| `visible` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
419
|
-
| `presentationMode` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
229
|
+
`min`, `max`, `step`, `allowHalf`, `itemsCount`, `quickPresets`, `showTicks`, `discrete`, `prefixIcon`, `ratingGradientLowColor`, `ratingGradientMidColor`, `ratingGradientHighColor`, `ratingBadgeIcon`, `ratingBadgeIconColor`, `ratingActiveIcon`, `ratingInactiveIcon`, `inlineOverlay`, `inlineAutoSize`.
|
|
420
230
|
|
|
421
231
|
## Events reference (obrigatorio)
|
|
422
232
|
|
|
423
|
-
|
|
|
424
|
-
| --- | --- | --- |
|
|
425
|
-
|
|
|
426
|
-
|
|
|
427
|
-
|
|
|
428
|
-
|
|
|
233
|
+
| Ação | Rascunho | Valor confirmado |
|
|
234
|
+
| --- | --- | --- |
|
|
235
|
+
| Arrastar/teclado/preset | Atualiza | Não altera |
|
|
236
|
+
| Aplicar | Mantém e fecha | Atualiza |
|
|
237
|
+
| Cancelar/Escape | Descarta | Não altera |
|
|
238
|
+
| Limpar + Aplicar | Esvazia | Confirma vazio |
|
|
429
239
|
|
|
430
240
|
## Styling API (obrigatorio quando aplicavel)
|
|
431
241
|
|
|
432
|
-
|
|
433
|
-
| --- | --- | --- | --- |
|
|
434
|
-
| `metadata.ratingIcon` | component | Styling-related JSON path | Validate against runtime implementation. |
|
|
435
|
-
| `metadata.prefixIcon` | component | Styling-related JSON path | Validate against runtime implementation. |
|
|
242
|
+
Use tokens compartilhados `--pdx-inline-field-*`, `--pdx-inline-panel-*` e os tokens semânticos de rating. O gradiente não deve reutilizar automaticamente a cor de destaque do botão.
|
|
436
243
|
|
|
437
244
|
## Examples (obrigatorio)
|
|
438
245
|
|
|
439
|
-
| Example | Scenario | Validates | Notes |
|
|
440
|
-
| --- | --- | --- | --- |
|
|
441
|
-
| `Minimal valid` | baseline payload | required contract blocks | Extracted from preserved technical reference when available. |
|
|
442
|
-
| `Common setup` | common component usage | standard runtime behavior | Validate against host integration path. |
|
|
443
|
-
| `Advanced setup` | richer config with overrides | precedence and normalization | Requires runtime confirmation for edge cases. |
|
|
444
|
-
| `Enterprise scenario` | governance/legacy/migration context | auditability and compatibility boundaries | Include tenant-specific constraints when applicable. |
|
|
445
|
-
|
|
446
246
|
### Minimal valid
|
|
447
247
|
|
|
448
248
|
```json
|
|
449
249
|
{
|
|
450
|
-
"
|
|
451
|
-
"
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
"ratingMax": 5,
|
|
457
|
-
"ratingStep": 1
|
|
458
|
-
},
|
|
459
|
-
"readonlyMode": false
|
|
460
|
-
}
|
|
461
|
-
```
|
|
462
|
-
|
|
463
|
-
### Common setup
|
|
464
|
-
|
|
465
|
-
```json
|
|
466
|
-
{
|
|
467
|
-
"componentId": "pdx-inline-rating",
|
|
468
|
-
"metadata": {
|
|
469
|
-
"name": "npsBand",
|
|
470
|
-
"label": "NPS",
|
|
471
|
-
"controlType": "rangeSlider",
|
|
472
|
-
"mode": "range",
|
|
473
|
-
"ratingMin": 0,
|
|
474
|
-
"ratingMax": 10,
|
|
475
|
-
"ratingAllowHalf": true,
|
|
476
|
-
"ratingToneLowColor": "#dc2626",
|
|
477
|
-
"ratingToneMidColor": "#f59e0b",
|
|
478
|
-
"ratingToneHighColor": "#16a34a",
|
|
479
|
-
"ratingBadgeColor": "#f59e0b",
|
|
480
|
-
"inlineAutoSize": {
|
|
481
|
-
"minWidth": 176,
|
|
482
|
-
"maxWidth": 320,
|
|
483
|
-
"panelMinWidth": 280,
|
|
484
|
-
"panelMaxWidth": 400
|
|
485
|
-
},
|
|
486
|
-
"quickPresets": [
|
|
487
|
-
{
|
|
488
|
-
"id": "detractors",
|
|
489
|
-
"label": "Detratores",
|
|
490
|
-
"start": 0,
|
|
491
|
-
"end": 6
|
|
492
|
-
},
|
|
493
|
-
{
|
|
494
|
-
"id": "promoters",
|
|
495
|
-
"label": "Promotores",
|
|
496
|
-
"start": 9,
|
|
497
|
-
"end": 10
|
|
498
|
-
}
|
|
499
|
-
],
|
|
500
|
-
"ratingIcon": "pdx-inline-rating-common"
|
|
501
|
-
}
|
|
502
|
-
}
|
|
503
|
-
```
|
|
504
|
-
|
|
505
|
-
### Advanced setup
|
|
506
|
-
|
|
507
|
-
```json
|
|
508
|
-
{
|
|
509
|
-
"componentId": "pdx-inline-rating",
|
|
510
|
-
"metadata": {
|
|
511
|
-
"name": "npsBand",
|
|
512
|
-
"label": "NPS",
|
|
513
|
-
"controlType": "rangeSlider",
|
|
514
|
-
"mode": "range",
|
|
515
|
-
"ratingMin": 0,
|
|
516
|
-
"ratingMax": 10,
|
|
517
|
-
"ratingAllowHalf": true,
|
|
518
|
-
"ratingToneLowColor": "#dc2626",
|
|
519
|
-
"ratingToneMidColor": "#f59e0b",
|
|
520
|
-
"ratingToneHighColor": "#16a34a",
|
|
521
|
-
"ratingBadgeColor": "#f59e0b",
|
|
522
|
-
"inlineAutoSize": {
|
|
523
|
-
"minWidth": 176,
|
|
524
|
-
"maxWidth": 320,
|
|
525
|
-
"panelMinWidth": 280,
|
|
526
|
-
"panelMaxWidth": 400
|
|
527
|
-
},
|
|
528
|
-
"quickPresets": [
|
|
529
|
-
{
|
|
530
|
-
"id": "detractors",
|
|
531
|
-
"label": "Detratores",
|
|
532
|
-
"start": 0,
|
|
533
|
-
"end": 6
|
|
534
|
-
},
|
|
535
|
-
{
|
|
536
|
-
"id": "promoters",
|
|
537
|
-
"label": "Promotores",
|
|
538
|
-
"start": 9,
|
|
539
|
-
"end": 10
|
|
540
|
-
}
|
|
541
|
-
]
|
|
542
|
-
},
|
|
543
|
-
"readonlyMode": false,
|
|
544
|
-
"disabledMode": false
|
|
250
|
+
"name": "evaluation",
|
|
251
|
+
"controlType": "inlineRating",
|
|
252
|
+
"min": 1,
|
|
253
|
+
"max": 5,
|
|
254
|
+
"step": 0.5,
|
|
255
|
+
"allowHalf": true
|
|
545
256
|
}
|
|
546
257
|
```
|
|
547
258
|
|
|
@@ -549,61 +260,39 @@ Correcao: preencher `ratingIcon` ou `prefixIcon`.
|
|
|
549
260
|
|
|
550
261
|
```json
|
|
551
262
|
{
|
|
552
|
-
"
|
|
553
|
-
"
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
"
|
|
565
|
-
"
|
|
566
|
-
"
|
|
567
|
-
"
|
|
568
|
-
"
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
"quickPresets": [
|
|
572
|
-
{
|
|
573
|
-
"id": "detractors",
|
|
574
|
-
"label": "Detratores",
|
|
575
|
-
"start": 0,
|
|
576
|
-
"end": 6
|
|
577
|
-
},
|
|
578
|
-
{
|
|
579
|
-
"id": "promoters",
|
|
580
|
-
"label": "Promotores",
|
|
581
|
-
"start": 9,
|
|
582
|
-
"end": 10
|
|
583
|
-
}
|
|
584
|
-
]
|
|
585
|
-
},
|
|
586
|
-
"presentationMode": true,
|
|
587
|
-
"visible": true
|
|
263
|
+
"name": "supplierQuality",
|
|
264
|
+
"label": "Qualidade do fornecedor",
|
|
265
|
+
"controlType": "inlineRating",
|
|
266
|
+
"min": 1,
|
|
267
|
+
"max": 5,
|
|
268
|
+
"step": 0.5,
|
|
269
|
+
"allowHalf": true,
|
|
270
|
+
"showTicks": true,
|
|
271
|
+
"ratingGradientLowColor": "#dc2626",
|
|
272
|
+
"ratingGradientMidColor": "#f59e0b",
|
|
273
|
+
"ratingGradientHighColor": "#16a34a",
|
|
274
|
+
"inlineOverlay": {
|
|
275
|
+
"applyMode": "explicit",
|
|
276
|
+
"actions": {
|
|
277
|
+
"apply": { "label": "Aplicar", "appearance": "filled", "colorRole": "primary" },
|
|
278
|
+
"cancel": { "label": "Cancelar", "appearance": "text", "colorRole": "neutral" },
|
|
279
|
+
"clear": { "label": "Limpar", "appearance": "outlined", "colorRole": "neutral" }
|
|
280
|
+
}
|
|
281
|
+
}
|
|
588
282
|
}
|
|
589
283
|
```
|
|
590
284
|
|
|
591
285
|
## Compatibility and migration notes (recomendado)
|
|
592
286
|
|
|
593
|
-
|
|
594
|
-
| --- | --- | --- | --- | --- |
|
|
595
|
-
| Historical aliases coexist with canonical paths | Active consumers using legacy JSON keys | Keep canonical paths for new usage and map aliases in migration backlog | not-yet-defined | Track via component-level migration issue |
|
|
287
|
+
Prefira `min/max/step`, `allowHalf`, `prefixIcon` e os três stops de gradiente. Os aliases listados existem apenas para ler configurações antigas.
|
|
596
288
|
|
|
597
289
|
## Known limitations and mismatches (recomendado)
|
|
598
290
|
|
|
599
|
-
|
|
600
|
-
| --- | --- | --- | --- | --- | --- |
|
|
601
|
-
| Canonical contract parity | No confirmed mismatch in this revision; runtime linkage verified for core flows (2026-03-06), with editor/tooling coverage pending | Keep runtime/schema/editor alignment evidence updated | Low | n/a | Monitor in periodic audit |
|
|
291
|
+
Não há incompatibilidades conhecidas entre runtime e editor para os paths canônicos documentados.
|
|
602
292
|
|
|
603
293
|
## Source references (obrigatorio)
|
|
604
294
|
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
| schema-types | projects/praxis-core/src/lib/models/material-field-metadata.interface.ts | Primary source of truth for contract and behavior. | 2026-03-06 | verified-path |
|
|
295
|
+
- `projects/praxis-core/src/lib/models/material-field-metadata.interface.ts`
|
|
296
|
+
- `projects/praxis-dynamic-fields/src/lib/components/inline-rating/inline-rating.component.ts`
|
|
297
|
+
- `projects/praxis-dynamic-fields/src/lib/components/inline-rating/inline-rating.component.spec.ts`
|
|
298
|
+
- `projects/praxis-metadata-editor/src/lib/config/inline-rating.config.ts`
|