@praxisui/dynamic-fields 9.0.66 → 9.0.67
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 +6 -0
- package/ai/component-registry.json +3604 -1063
- package/docs/color-components-evolution-plan.md +369 -0
- package/docs/dynamic-fields-field-catalog.md +28 -28
- package/docs/dynamic-fields-inline-components-guide.md +1 -0
- package/docs/dynamic-fields-inline-filter-catalog.md +11 -2
- package/docs/dynamic-fields-inline-filter-runtime-contract.md +2 -0
- package/docs/dynamic-fields-inventory.md +83 -82
- package/docs/governed-color-token-selection-observation-rfc.md +38 -0
- package/fesm2022/praxisui-dynamic-fields.mjs +4236 -936
- package/package.json +4 -3
- package/src/lib/components/color-input/pdx-color-input.json-api.md +209 -171
- package/src/lib/components/color-picker/pdx-color-picker.json-api.md +273 -245
- package/src/lib/components/inline-color-label/pdx-inline-color-label.json-api.md +224 -195
- package/types/praxisui-dynamic-fields.d.ts +227 -12
|
@@ -23,7 +23,7 @@ source_of_truth:
|
|
|
23
23
|
- "projects/praxis-core/src/lib/models/material-field-metadata.interface.ts"
|
|
24
24
|
- "projects/praxis-dynamic-fields/src/lib/base/simple-base-input.component.ts"
|
|
25
25
|
source_of_truth_last_verified: "2026-03-06"
|
|
26
|
-
last_updated: "2026-
|
|
26
|
+
last_updated: "2026-09-06"
|
|
27
27
|
toc: true
|
|
28
28
|
sidebar: true
|
|
29
29
|
tags:
|
|
@@ -33,10 +33,10 @@ tags:
|
|
|
33
33
|
api_stability: "canonical"
|
|
34
34
|
schema_verified: true
|
|
35
35
|
runtime_verified: true
|
|
36
|
-
editor_coverage_verified:
|
|
36
|
+
editor_coverage_verified: true
|
|
37
37
|
runtime_scope: "public"
|
|
38
38
|
legacy_paths_present: true
|
|
39
|
-
has_known_mismatches:
|
|
39
|
+
has_known_mismatches: true
|
|
40
40
|
related_components:
|
|
41
41
|
- "praxis-table"
|
|
42
42
|
- "pdx-base-input-runtime-contract"
|
|
@@ -56,30 +56,32 @@ Este documento e a referencia canonica da API JSON de pdx-color-picker.
|
|
|
56
56
|
|
|
57
57
|
## Purpose and scope
|
|
58
58
|
|
|
59
|
+
Paletas governadas usam `materializeGovernedPaletteEntries` do Core para associar cada token à sua cor resolvida. O tooltip da amostra mostra nome publicado, tokenId, papel semântico e cor; busca inclui nomes e aliases, e variantes da mesma família podem ser comparadas explicitamente. Tokens distintos continuam representados mesmo quando a cor coincide. O rascunho e o valor aplicado permanecem strings CSS; ao aplicar um token, `governedSelectionChange` emite sua identidade separadamente. Cancelar não emite a identidade, e recentes, precisão e cores locais emitem `null`, sem inferência por cor.
|
|
60
|
+
|
|
59
61
|
- O componente consome payload JSON metadata-driven e expoe comportamento runtime configuravel por contrato.
|
|
60
62
|
- Esta referencia cobre contrato publico, classificacao de paths e semantica de cobertura (runtime/schema/editor).
|
|
61
63
|
- Fora de escopo: quickstart, tutorial narrativo e notas arquiteturais que nao alteram contrato publico.
|
|
62
64
|
|
|
63
65
|
## Consulta rapida (obrigatorio)
|
|
64
66
|
|
|
65
|
-
| Regra/tema
|
|
66
|
-
|
|
|
67
|
-
| Component id
|
|
68
|
-
| Primary contract source | `runtime-and-code` | Runtime, schema e docs devem permanecer rastreaveis
|
|
69
|
-
| Runtime coverage
|
|
70
|
-
| Schema/type coverage
|
|
71
|
-
| Editor/tooling coverage | `false`
|
|
72
|
-
| Legacy paths
|
|
73
|
-
| Known mismatches
|
|
67
|
+
| Regra/tema | Observado | Canonico desejado | Status | Evidencia |
|
|
68
|
+
| ----------------------- | ------------------ | ---------------------------------------------------------------------- | ------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
69
|
+
| Component id | `pdx-color-picker` | Manter ID canonico estavel e versionado por contrato | Active | frontmatter.component |
|
|
70
|
+
| Primary contract source | `runtime-and-code` | Runtime, schema e docs devem permanecer rastreaveis | Partial | frontmatter.contract_source + source_of_truth |
|
|
71
|
+
| Runtime coverage | `true` | Comportamentos runtime criticos devem ficar explicitamente verificados | Active | `projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.metadata.ts`, `projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.component.ts` |
|
|
72
|
+
| Schema/type coverage | `true` | Tipos e schema devem refletir paths publicos do contrato | Active | source_of_truth + Detailed API reference |
|
|
73
|
+
| Editor/tooling coverage | `false` | Editor/tooling deve espelhar somente contrato publico suportado | Partial | `projects/praxis-core/src/lib/metadata/field-selector-control-type.constants.ts`, `projects/praxis-dynamic-fields/src/lib/services/component-registry/component-registry.service.ts` |
|
|
74
|
+
| Legacy paths | `true` | Segregar legado de caminhos canonicos com janela de migracao | Partial | frontmatter.legacy_paths_present |
|
|
75
|
+
| Known mismatches | `false` | Registrar observed vs desired de forma auditavel | Active | frontmatter.has_known_mismatches |
|
|
74
76
|
|
|
75
77
|
## Source of truth
|
|
76
78
|
|
|
77
|
-
| Source
|
|
78
|
-
|
|
|
79
|
-
| projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.metadata.ts
|
|
80
|
-
| projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.component.ts | runtime-code
|
|
81
|
-
| projects/praxis-core/src/lib/models/material-field-metadata.interface.ts
|
|
82
|
-
| projects/praxis-dynamic-fields/src/lib/base/simple-base-input.component.ts
|
|
79
|
+
| Source | Kind | Notes |
|
|
80
|
+
| -------------------------------------------------------------------------------------------- | --------------- | ------------------------------------------------------------------- |
|
|
81
|
+
| projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.metadata.ts | schema-metadata | Arquivo presente no repositorio e usado como evidencia de contrato. |
|
|
82
|
+
| projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.component.ts | runtime-code | Arquivo presente no repositorio e usado como evidencia de contrato. |
|
|
83
|
+
| projects/praxis-core/src/lib/models/material-field-metadata.interface.ts | schema-types | Arquivo presente no repositorio e usado como evidencia de contrato. |
|
|
84
|
+
| projects/praxis-dynamic-fields/src/lib/base/simple-base-input.component.ts | runtime-code | Arquivo presente no repositorio e usado como evidencia de contrato. |
|
|
83
85
|
|
|
84
86
|
## Support legend
|
|
85
87
|
|
|
@@ -91,40 +93,40 @@ Este documento e a referencia canonica da API JSON de pdx-color-picker.
|
|
|
91
93
|
|
|
92
94
|
## Contract status snapshot
|
|
93
95
|
|
|
94
|
-
| Item
|
|
95
|
-
|
|
|
96
|
-
| Reference mode
|
|
97
|
-
| Contract format
|
|
98
|
-
| Contract source
|
|
99
|
-
| Runtime scope
|
|
100
|
-
| Runtime verified
|
|
101
|
-
| Schema verified
|
|
102
|
-
| Editor coverage verified | `false`
|
|
103
|
-
| Legacy paths present
|
|
104
|
-
| Has known mismatches
|
|
96
|
+
| Item | Value | Notes |
|
|
97
|
+
| ------------------------ | ------------------ | ---------------------------------------------- |
|
|
98
|
+
| Reference mode | `canonical` | Deve permanecer canonico |
|
|
99
|
+
| Contract format | `json` | Contrato metadata-driven |
|
|
100
|
+
| Contract source | `runtime-and-code` | Alinhar com source_of_truth |
|
|
101
|
+
| Runtime scope | `public` | Escopo publicado para consumidores |
|
|
102
|
+
| Runtime verified | `true` | Revisar sempre com evidencia de runtime |
|
|
103
|
+
| Schema verified | `true` | Revisar sempre com evidencia de tipos/schema |
|
|
104
|
+
| Editor coverage verified | `false` | Revisar sempre com evidencia de editor/tooling |
|
|
105
|
+
| Legacy paths present | `true` | Segregar legado de contrato canonico |
|
|
106
|
+
| Has known mismatches | `false` | Divergencias devem aparecer em secao dedicada |
|
|
105
107
|
|
|
106
108
|
## Contract classification (obrigatorio)
|
|
107
109
|
|
|
108
110
|
### Canonical paths (public contract)
|
|
109
111
|
|
|
110
|
-
| Path
|
|
111
|
-
|
|
|
112
|
-
| `metadata`
|
|
113
|
-
| `readonlyMode`
|
|
114
|
-
| `disabledMode`
|
|
115
|
-
| `visible`
|
|
116
|
-
| `presentationMode`
|
|
117
|
-
| `metadata.controlType` | string
|
|
118
|
-
| `metadata.format`
|
|
119
|
-
| `metadata.views`
|
|
112
|
+
| Path | Type | Required | Default | Status | Notes |
|
|
113
|
+
| ---------------------- | ------- | -------- | ------- | ------- | ------------------------------------------------- |
|
|
114
|
+
| `metadata` | object | true | n/a | Partial | See Detailed API reference for runtime semantics. |
|
|
115
|
+
| `readonlyMode` | boolean | false | n/a | Partial | See Detailed API reference for runtime semantics. |
|
|
116
|
+
| `disabledMode` | boolean | false | n/a | Partial | See Detailed API reference for runtime semantics. |
|
|
117
|
+
| `visible` | boolean | false | n/a | Partial | See Detailed API reference for runtime semantics. |
|
|
118
|
+
| `presentationMode` | boolean | false | n/a | Partial | See Detailed API reference for runtime semantics. |
|
|
119
|
+
| `metadata.controlType` | string | false | n/a | Partial | See Detailed API reference for runtime semantics. |
|
|
120
|
+
| `metadata.format` | string | false | n/a | Partial | See Detailed API reference for runtime semantics. |
|
|
121
|
+
| `metadata.views` | array | false | n/a | Partial | See Detailed API reference for runtime semantics. |
|
|
120
122
|
|
|
121
123
|
### Supported legacy paths
|
|
122
124
|
|
|
123
|
-
| Legacy path
|
|
124
|
-
|
|
|
125
|
-
| `metadata.showPreview` | `metadata.boolean`
|
|
126
|
-
| `metadata.showAlpha`
|
|
127
|
-
| `metadata.showPreview` | `metadata.preview`
|
|
125
|
+
| Legacy path | Canonical replacement | Support window | Runtime behavior | Notes |
|
|
126
|
+
| ---------------------- | --------------------- | --------------- | ----------------------------------- | ----------------------------------------------------------- |
|
|
127
|
+
| `metadata.showPreview` | `metadata.boolean` | not-yet-defined | accepted for backward compatibility | Alias inferido da evidencia preservada; validar em runtime. |
|
|
128
|
+
| `metadata.showAlpha` | `metadata.boolean` | not-yet-defined | accepted for backward compatibility | Alias inferido da evidencia preservada; validar em runtime. |
|
|
129
|
+
| `metadata.showPreview` | `metadata.preview` | not-yet-defined | accepted for backward compatibility | Alias inferido da evidencia preservada; validar em runtime. |
|
|
128
130
|
|
|
129
131
|
### Internal-only paths
|
|
130
132
|
|
|
@@ -138,80 +140,80 @@ Nao ha paths experimentais confirmados no contrato publico desta revisao.
|
|
|
138
140
|
|
|
139
141
|
### Top-level configuration blocks
|
|
140
142
|
|
|
141
|
-
| Block
|
|
142
|
-
|
|
|
143
|
-
| `metadata`
|
|
144
|
-
| `readonlyMode`
|
|
145
|
-
| `disabledMode`
|
|
146
|
-
| `visible`
|
|
147
|
-
| `presentationMode` | Renderizacao de apresentacao sem interacao
|
|
148
|
-
| `gradientSettings` | Configuracao especifica de runtime
|
|
143
|
+
| Block | Purpose | Required | Merge strategy | Notes |
|
|
144
|
+
| ------------------ | ------------------------------------------- | -------- | -------------- | ---------------------------------------------------------------------- |
|
|
145
|
+
| `metadata` | Payload declarativo principal do componente | true | deep-merge | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
146
|
+
| `readonlyMode` | Override de readonly no host/runtime | false | override | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
147
|
+
| `disabledMode` | Override de disabled no host/runtime | false | override | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
148
|
+
| `visible` | Override de visibilidade no host/runtime | false | override | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
149
|
+
| `presentationMode` | Renderizacao de apresentacao sem interacao | false | override | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
150
|
+
| `gradientSettings` | Configuracao especifica de runtime | false | override | runtime linkage verified for core flows (component specs, 2026-03-06). |
|
|
149
151
|
|
|
150
152
|
### Nested configuration blocks
|
|
151
153
|
|
|
152
|
-
| Path
|
|
153
|
-
|
|
|
154
|
-
| `metadata.controlType`
|
|
155
|
-
| `metadata.format`
|
|
156
|
-
| `metadata.views`
|
|
157
|
-
| `metadata.activeView`
|
|
158
|
-
| `metadata.preview`
|
|
159
|
-
| `metadata.showPreview`
|
|
160
|
-
| `metadata.clearButton`
|
|
161
|
-
| `metadata.actionsLayout`
|
|
162
|
-
| `metadata.showAlpha`
|
|
163
|
-
| `gradientSettings.showOpacity` | boolean | false
|
|
154
|
+
| Path | Type | Required | Default | Constraints | Notes |
|
|
155
|
+
| ------------------------------ | ------- | -------- | ------- | ----------------- | ------------------------------------ |
|
|
156
|
+
| `metadata.controlType` | string | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
157
|
+
| `metadata.format` | string | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
158
|
+
| `metadata.views` | array | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
159
|
+
| `metadata.activeView` | string | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
160
|
+
| `metadata.preview` | boolean | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
161
|
+
| `metadata.showPreview` | boolean | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
162
|
+
| `metadata.clearButton` | object | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
163
|
+
| `metadata.actionsLayout` | string | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
164
|
+
| `metadata.showAlpha` | boolean | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
165
|
+
| `gradientSettings.showOpacity` | boolean | false | n/a | component-defined | Partial; verify per source_of_truth. |
|
|
164
166
|
|
|
165
167
|
### Input bindings (inbound data)
|
|
166
168
|
|
|
167
|
-
| Binding/Path
|
|
168
|
-
|
|
|
169
|
-
| `metadata`
|
|
170
|
-
| `readonlyMode`
|
|
171
|
-
| `disabledMode`
|
|
172
|
-
| `visible`
|
|
173
|
-
| `presentationMode` | boolean | false
|
|
169
|
+
| Binding/Path | Type | Required | Source | Runtime normalization | Notes |
|
|
170
|
+
| ------------------ | ------- | -------- | ------------ | --------------------- | --------------------------------- |
|
|
171
|
+
| `metadata` | object | true | host-json | component-defined | Primary inbound contract payload. |
|
|
172
|
+
| `readonlyMode` | boolean | false | host-runtime | not-yet-verified | Host-level behavioral override. |
|
|
173
|
+
| `disabledMode` | boolean | false | host-runtime | not-yet-verified | Host-level behavioral override. |
|
|
174
|
+
| `visible` | boolean | false | host-runtime | not-yet-verified | Host-level behavioral override. |
|
|
175
|
+
| `presentationMode` | boolean | false | host-runtime | not-yet-verified | Host-level behavioral override. |
|
|
174
176
|
|
|
175
177
|
### Output events
|
|
176
178
|
|
|
177
|
-
| Event
|
|
178
|
-
|
|
|
179
|
-
| `valueChange`
|
|
180
|
-
| `open`
|
|
181
|
-
| `close`
|
|
182
|
-
| `cancel`
|
|
179
|
+
| Event | Payload | Trigger | Stability | Notes |
|
|
180
|
+
| ------------------ | ------- | ------------- | ------------ | ----------------------------------------------- |
|
|
181
|
+
| `valueChange` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
182
|
+
| `open` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
183
|
+
| `close` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
184
|
+
| `cancel` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
183
185
|
| `activeViewChange` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
184
186
|
| `activeColorClick` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
185
|
-
| `focusEvent`
|
|
186
|
-
| `blurEvent`
|
|
187
|
-
| `focusChange`
|
|
188
|
-
| `nativeBlur`
|
|
189
|
-
| `nativeChange`
|
|
187
|
+
| `focusEvent` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
188
|
+
| `blurEvent` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
189
|
+
| `focusChange` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
190
|
+
| `nativeBlur` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
191
|
+
| `nativeChange` | unknown | runtime-event | Experimental | Validate payload shape against source_of_truth. |
|
|
190
192
|
|
|
191
193
|
### External side channels
|
|
192
194
|
|
|
193
|
-
| Channel
|
|
194
|
-
|
|
|
195
|
+
| Channel | Direction | Contract | Failure mode | Notes |
|
|
196
|
+
| ----------------------- | ------------- | ----------------- | ----------------- | ------------------------------------------------------------------------- |
|
|
195
197
|
| `host/services/storage` | bidirectional | component-defined | component-defined | Side channels variam por componente e host; verificar em source_of_truth. |
|
|
196
198
|
|
|
197
199
|
### Host/runtime dependencies
|
|
198
200
|
|
|
199
|
-
| Dependency
|
|
200
|
-
|
|
|
201
|
-
| `pdx-color-picker.metadata.ts`
|
|
202
|
-
| `pdx-color-picker.component.ts`
|
|
203
|
-
| `material-field-metadata.interface.ts` | true
|
|
204
|
-
| `simple-base-input.component.ts`
|
|
201
|
+
| Dependency | Required | Environment | Purpose | Notes |
|
|
202
|
+
| -------------------------------------- | -------- | -------------------- | ------------------- | -------------------------------------------------------------------------------------------------------- |
|
|
203
|
+
| `pdx-color-picker.metadata.ts` | true | browser/dev/prod/ssr | contract resolution | Refer to `projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.metadata.ts`. |
|
|
204
|
+
| `pdx-color-picker.component.ts` | true | browser/dev/prod/ssr | contract resolution | Refer to `projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.component.ts`. |
|
|
205
|
+
| `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`. |
|
|
206
|
+
| `simple-base-input.component.ts` | true | browser/dev/prod/ssr | contract resolution | Refer to `projects/praxis-dynamic-fields/src/lib/base/simple-base-input.component.ts`. |
|
|
205
207
|
|
|
206
208
|
## Coverage by surface (obrigatorio)
|
|
207
209
|
|
|
208
210
|
### Coverage matrix (runtime, schema/type, editor/tooling)
|
|
209
211
|
|
|
210
|
-
| Surface
|
|
211
|
-
|
|
|
212
|
-
| Runtime
|
|
213
|
-
| Schema/Types
|
|
214
|
-
| Editor/Tooling | `false`
|
|
212
|
+
| Surface | Verified | Coverage status | Evidence | Notes |
|
|
213
|
+
| -------------- | -------- | --------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
214
|
+
| Runtime | `true` | Active | `projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.metadata.ts`, `projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.component.ts` | Core runtime flows verified via focused component specs on 2026-03-06; editor/tooling coverage remains independent. |
|
|
215
|
+
| Schema/Types | `true` | Active | source_of_truth + Detailed API reference | Reconcile schema/types with canonical paths during follow-up when needed. |
|
|
216
|
+
| Editor/Tooling | `false` | Partial | `projects/praxis-core/src/lib/metadata/field-selector-control-type.constants.ts`, `projects/praxis-dynamic-fields/src/lib/services/component-registry/component-registry.service.ts` | Selector/control-type tooling linkage verified via default selector map and registry seeding; visual editor end-to-end coverage remains not-yet-verified. |
|
|
215
217
|
|
|
216
218
|
### Runtime coverage boundaries
|
|
217
219
|
|
|
@@ -257,9 +259,9 @@ Em conflito entre alias legado e path canonico, priorizar path canonico e regist
|
|
|
257
259
|
|
|
258
260
|
### Validation model
|
|
259
261
|
|
|
260
|
-
| Path/Rule
|
|
261
|
-
|
|
|
262
|
-
| canonical-paths | parse/runtime
|
|
262
|
+
| Path/Rule | Validation phase | Behavior on fail | Error code / warning | Notes |
|
|
263
|
+
| --------------- | ---------------- | --------------------------------------- | -------------------- | -------------------------------------------------------------------- |
|
|
264
|
+
| canonical-paths | parse/runtime | component-defined (warn/reject/default) | not-yet-standardized | Semantica detalhada preservada na referencia tecnica por componente. |
|
|
263
265
|
|
|
264
266
|
### Invalid and unknown field handling
|
|
265
267
|
|
|
@@ -269,103 +271,115 @@ Em conflito entre alias legado e path canonico, priorizar path canonico e regist
|
|
|
269
271
|
|
|
270
272
|
### Fail-open / fail-closed behavior
|
|
271
273
|
|
|
272
|
-
| Condition
|
|
273
|
-
|
|
|
274
|
+
| Condition | Mode | Runtime behavior | Consumer impact |
|
|
275
|
+
| ------------------------ | ----------------- | ---------------- | ---------------------------------------------------------------------------- |
|
|
274
276
|
| invalid-or-unknown-field | component-defined | not-yet-verified | Pode gerar warning, fallback silencioso ou rejeicao; validar por componente. |
|
|
275
277
|
|
|
276
278
|
### Runtime warnings vs hard failures
|
|
277
279
|
|
|
278
|
-
| Condition
|
|
279
|
-
|
|
|
280
|
-
| partial-or-declared-only-coverage | warning
|
|
281
|
-
| mismatch-confirmed
|
|
280
|
+
| Condition | Severity | Observability | Consumer action |
|
|
281
|
+
| --------------------------------- | ---------------- | ----------------------------- | ----------------------------------------------- |
|
|
282
|
+
| partial-or-declared-only-coverage | warning | logs/eventos do componente | Confirmar ligacao runtime antes de uso critico. |
|
|
283
|
+
| mismatch-confirmed | error-or-warning | componente/host observability | Planejar migracao e corrigir contrato/runtime. |
|
|
282
284
|
|
|
283
285
|
## Detailed API reference
|
|
286
|
+
|
|
284
287
|
### Preserved technical reference (normalized from previous revision)
|
|
285
288
|
|
|
286
289
|
### 1. Visao Geral e Quando Usar
|
|
290
|
+
|
|
287
291
|
`pdx-color-picker` e o color picker avancado orientado por JSON em `@praxisui/dynamic-fields`.
|
|
288
292
|
|
|
289
293
|
Use quando precisar:
|
|
294
|
+
|
|
290
295
|
- selecao de cor com abas (gradiente e paleta);
|
|
291
296
|
- fluxo de `Aplicar` / `Cancelar` / `Limpar`;
|
|
292
297
|
- persistencia local de cores customizadas e recentes;
|
|
293
298
|
- conversao de formato (`hex`, `rgb`, `rgba`, `hsl`) e preview.
|
|
294
299
|
|
|
295
300
|
### 2. API do Componente (Inputs/Outputs)
|
|
296
|
-
|
|
297
|
-
|
|
|
298
|
-
|
|
|
299
|
-
| `
|
|
300
|
-
| `
|
|
301
|
-
| `
|
|
302
|
-
| `
|
|
303
|
-
| `
|
|
304
|
-
| `
|
|
305
|
-
| `
|
|
306
|
-
| `
|
|
307
|
-
| `
|
|
308
|
-
| `
|
|
309
|
-
| `
|
|
310
|
-
| `
|
|
301
|
+
|
|
302
|
+
| Propriedade | Tipo | Padrao | Obrigatorio | Comportamento |
|
|
303
|
+
| ------------------ | ------------------------- | ------- | ----------- | --------------------------------------- |
|
|
304
|
+
| `metadata` | `any` | - | Sim | Payload principal do componente. |
|
|
305
|
+
| `readonlyMode` | `boolean` | `false` | Nao | Sobrescreve leitura no host. |
|
|
306
|
+
| `disabledMode` | `boolean` | `false` | Nao | Sobrescreve estado disabled no host. |
|
|
307
|
+
| `visible` | `boolean` | `true` | Nao | Controla exibicao no host. |
|
|
308
|
+
| `presentationMode` | `boolean` | `false` | Nao | Modo apresentacao (sem edicao). |
|
|
309
|
+
| `valueChange` | `string \| null` | - | Output | Emite valor final ao aplicar alteracao. |
|
|
310
|
+
| `governedSelectionChange` | `GovernedColorTokenSelection \| null` | - | Output | Emite a identidade governada somente no `Aplicar`; emite `null` para uma escolha local. |
|
|
311
|
+
| `open` | `void` | - | Output | Emite ao abrir fluxo de selecao. |
|
|
312
|
+
| `close` | `void` | - | Output | Emite ao fechar painel. |
|
|
313
|
+
| `cancel` | `void` | - | Output | Emite ao cancelar alteracoes. |
|
|
314
|
+
| `activeViewChange` | `'gradient' \| 'palette'` | - | Output | Emite troca de aba ativa. |
|
|
315
|
+
| `activeColorClick` | `string` | - | Output | Emite clique em swatch da paleta. |
|
|
316
|
+
| `focusEvent` | `void` | - | Output | Emite ao receber foco. |
|
|
317
|
+
| `blurEvent` | `void` | - | Output | Emite ao perder foco. |
|
|
311
318
|
|
|
312
319
|
### 3. Matriz de Cobertura JSON (Completa)
|
|
320
|
+
|
|
313
321
|
#### 3.1 Campos especificos do componente
|
|
314
|
-
|
|
315
|
-
|
|
|
316
|
-
|
|
|
317
|
-
| `metadata.
|
|
318
|
-
| `metadata.
|
|
319
|
-
| `metadata.
|
|
320
|
-
| `metadata.
|
|
321
|
-
| `metadata.
|
|
322
|
-
| `metadata.
|
|
323
|
-
| `metadata.
|
|
324
|
-
| `metadata.
|
|
325
|
-
| `metadata.
|
|
326
|
-
| `metadata.gradientSettings.
|
|
327
|
-
| `metadata.
|
|
328
|
-
| `metadata.paletteSettings.
|
|
329
|
-
| `metadata.paletteSettings.
|
|
330
|
-
| `metadata.
|
|
331
|
-
| `metadata.popupSettings.
|
|
332
|
-
| `metadata.popupSettings.
|
|
333
|
-
| `metadata.
|
|
334
|
-
| `metadata.
|
|
335
|
-
| `metadata.
|
|
336
|
-
| `metadata.
|
|
337
|
-
| `metadata.
|
|
338
|
-
| `metadata.
|
|
339
|
-
| `metadata.
|
|
340
|
-
| `metadata.
|
|
341
|
-
| `metadata.
|
|
342
|
-
| `metadata.
|
|
343
|
-
| `metadata.
|
|
344
|
-
| `metadata.
|
|
345
|
-
| `metadata.
|
|
346
|
-
| `metadata.
|
|
347
|
-
| `metadata.
|
|
348
|
-
| `metadata.
|
|
349
|
-
| `metadata.
|
|
350
|
-
| `metadata.
|
|
322
|
+
|
|
323
|
+
| Caminho JSON | Tipo | Status | Comportamento em runtime |
|
|
324
|
+
| --------------------------------------- | ---------------------------------------------------- | ------------------- | ------------------------------------------------------------------------------- |
|
|
325
|
+
| `metadata.controlType` | `'colorPicker'` | Ativo | Identifica contrato do componente no host. |
|
|
326
|
+
| `metadata.format` | `'hex' \| 'rgb' \| 'rgba' \| 'hsl'` | Ativo | Define formato final em `onApply()`. |
|
|
327
|
+
| `metadata.views` | `Array<'gradient' \| 'palette'>` | Extensao de runtime | Define abas habilitadas. |
|
|
328
|
+
| `metadata.activeView` | `'gradient' \| 'palette'` | Extensao de runtime | Define aba inicial ativa. |
|
|
329
|
+
| `metadata.preview` | `boolean` | Extensao de runtime | Exibe/oculta preview superior do painel. |
|
|
330
|
+
| `metadata.showPreview` | `boolean` | Ativo | Alias legado de `preview`. |
|
|
331
|
+
| `metadata.clearButton` | `boolean \| object` | Ativo | Configura botao de limpar (icone/tooltip/aria). |
|
|
332
|
+
| `metadata.actionsLayout` | `'start' \| 'end'` | Extensao de runtime | Posiciona botoes de acao no rodape. |
|
|
333
|
+
| `metadata.showAlpha` | `boolean` | Ativo | Alias legado para `gradientSettings.showOpacity`. |
|
|
334
|
+
| `metadata.gradientSettings.showOpacity` | `boolean` | Extensao de runtime | Exibe slider de opacidade. |
|
|
335
|
+
| `metadata.gradientSettings.channel` | `'hsv' \| 'hsl'` | Extensao de runtime | Campo aceito no contrato atual (sem variacao visual completa no MVP). |
|
|
336
|
+
| `metadata.paletteSettings.preset` | `string` | Extensao de runtime | Seleciona preset de paleta (`basic`, `office`, `material`). |
|
|
337
|
+
| `metadata.paletteSettings.colors` | `string[]` | Extensao de runtime | Sobrescreve cores base da paleta. |
|
|
338
|
+
| `metadata.paletteSettings.columns` | `number` | Extensao de runtime | Define colunas da grade de swatches. |
|
|
339
|
+
| `metadata.popupSettings.width` | `number \| string` | Extensao de runtime | Define largura do painel popup. |
|
|
340
|
+
| `metadata.popupSettings.anchor` | `Element` | Extensao de runtime | Campo aceito para evolucao de ancoragem. |
|
|
341
|
+
| `metadata.popupSettings.appendTo` | `Element \| ViewContainerRef` | Extensao de runtime | Campo aceito para evolucao de portal/append. |
|
|
342
|
+
| `metadata.adaptiveMode` | `boolean` | Extensao de runtime | Opt-in (default false): diálogo Praxis abaixo de 600 px; menu em telas maiores. |
|
|
343
|
+
| `metadata.adaptiveTitle` | `string` | Extensao de runtime | Campo aceito para fluxo adaptive. |
|
|
344
|
+
| `metadata.adaptiveSubtitle` | `any` | Extensao de runtime | Campo aceito para fluxo adaptive. |
|
|
345
|
+
| `metadata.fillMode` | `'solid' \| 'flat' \| 'outline'` | Extensao de runtime | Campo aceito para theming do trigger. |
|
|
346
|
+
| `metadata.rounded` | `'none' \| 'small' \| 'medium' \| 'large' \| 'full'` | Extensao de runtime | Campo aceito para theming do trigger. |
|
|
347
|
+
| `metadata.size` | `'small' \| 'medium' \| 'large'` | Extensao de runtime | Campo aceito para theming do trigger. |
|
|
348
|
+
| `metadata.icon` | `string` | Extensao de runtime | Icone do botao de abrir picker. |
|
|
349
|
+
| `metadata.iconClass` | `string \| string[] \| object` | Extensao de runtime | Campo aceito para classes de icone. |
|
|
350
|
+
| `metadata.svgIcon` | `SVGIcon` | Extensao de runtime | Campo aceito para icone SVG. |
|
|
351
|
+
| `metadata.tabindex` | `number` | Extensao de runtime | Tab order do input. |
|
|
352
|
+
| `metadata.disabled` | `boolean` | Extensao de runtime | Sobrescreve `disabledMode` localmente. |
|
|
353
|
+
| `metadata.readonly` | `boolean` | Extensao de runtime | Sobrescreve `readonlyMode` localmente. |
|
|
354
|
+
| `metadata.visible` | `boolean` | Extensao de runtime | Sobrescreve visibilidade local. |
|
|
355
|
+
| `metadata.presentationMode` | `boolean` | Extensao de runtime | Sobrescreve modo apresentacao local. |
|
|
356
|
+
| `metadata.presetColors` | `string[]` | Declared-only | Declarado na interface de core, sem consumo direto neste componente. |
|
|
357
|
+
| `metadata.allowCustomColors` | `boolean` | Declared-only | Declarado na interface de core, sem flag dedicada no runtime atual. |
|
|
358
|
+
| `metadata.variant` | `'compact' \| 'default' \| 'block'` | Declared-only | Declarado na interface de core, sem template dedicado. |
|
|
359
|
+
| `metadata.showInput` | `boolean` | Declared-only | Declarado na interface de core, sem toggle especifico do input. |
|
|
351
360
|
|
|
352
361
|
#### 3.2 Campos herdados compartilhados (exaustivo)
|
|
362
|
+
|
|
353
363
|
Contrato completo dos campos herdados consumidos por `SimpleBaseInput`:
|
|
364
|
+
|
|
354
365
|
- [pdx-base-input-runtime-contract.json-api.md](projects/praxis-dynamic-fields/src/lib/base/pdx-base-input-runtime-contract.json-api.md)
|
|
355
366
|
|
|
356
367
|
Resumo de composicao deste componente:
|
|
368
|
+
|
|
357
369
|
- `Ativo`: campos legado/compativeis de `MaterialColorPickerMetadata` + clear.
|
|
358
370
|
- `Extensao de runtime`: contrato avancado de views/palette/popup/theming.
|
|
359
371
|
- `Declared-only`: parte da interface de core ainda sem efeito no template atual.
|
|
360
372
|
|
|
361
373
|
### 4. Mapeamento de Comportamento
|
|
374
|
+
|
|
362
375
|
- Paginacao: nao se aplica.
|
|
363
376
|
- Ordenacao: nao se aplica.
|
|
364
377
|
- Selecao: valor de cor em string, aplicado apenas ao confirmar (`Aplicar`).
|
|
365
|
-
- Eventos: `open`, `close`, `cancel`, `activeViewChange`, `activeColorClick`, `valueChange`.
|
|
378
|
+
- Eventos: `open`, `close`, `cancel`, `activeViewChange`, `activeColorClick`, `valueChange`, `governedSelectionChange`.
|
|
366
379
|
- Renderizacao: `mat-form-field` + painel com tabs, preview, swatches e acoes.
|
|
367
380
|
|
|
368
381
|
### 5. Exemplo Minimo (JSON + Uso)
|
|
382
|
+
|
|
369
383
|
```json
|
|
370
384
|
{
|
|
371
385
|
"componentId": "pdx-color-picker",
|
|
@@ -377,9 +391,11 @@ Resumo de composicao deste componente:
|
|
|
377
391
|
}
|
|
378
392
|
}
|
|
379
393
|
```
|
|
394
|
+
|
|
380
395
|
Uso: abre seletor de cor e retorna valor no formato hexadecimal ao clicar em `Aplicar`.
|
|
381
396
|
|
|
382
397
|
### 6. Exemplo Corporativo (JSON + Uso)
|
|
398
|
+
|
|
383
399
|
```json
|
|
384
400
|
{
|
|
385
401
|
"componentId": "pdx-color-picker",
|
|
@@ -416,30 +432,34 @@ Uso: abre seletor de cor e retorna valor no formato hexadecimal ao clicar em `Ap
|
|
|
416
432
|
}
|
|
417
433
|
}
|
|
418
434
|
```
|
|
435
|
+
|
|
419
436
|
Uso: configura fluxo corporativo completo de escolha de cor com alpha, paleta padronizada e controles de UX.
|
|
420
437
|
|
|
421
438
|
### 7. Troubleshooting e Armadilhas Comuns
|
|
422
|
-
|
|
423
|
-
|
|
439
|
+
|
|
440
|
+
1. Esperar que `adaptiveMode=true` use bottom sheet ou troque o overlay durante a edição.
|
|
441
|
+
Correção: usa `@praxisui/dialog` abaixo de 600 px, conforme a viewport ao abrir; redimensionar durante a edição preserva o overlay e o rascunho. O pacote `@praxisui/dialog` é uma peer dependency obrigatória. `adaptiveTitle` personaliza o título; `adaptiveSubtitle` continua preparatório.
|
|
424
442
|
|
|
425
443
|
2. Definir `presetColors` e nao ver efeito.
|
|
426
|
-
Correcao: o componente usa `paletteSettings.colors`; `presetColors` da interface de core nao e consumido diretamente.
|
|
444
|
+
Correcao: o componente usa `paletteSettings.colors`; `presetColors` da interface de core nao e consumido diretamente.
|
|
427
445
|
|
|
428
446
|
3. Esperar atualizacao de valor sem clicar `Aplicar`.
|
|
429
|
-
Correcao: mudancas ficam em rascunho (`draft`) ate confirmar com `Aplicar`.
|
|
447
|
+
Correcao: mudancas ficam em rascunho (`draft`) ate confirmar com `Aplicar`.
|
|
430
448
|
|
|
431
449
|
4. Preencher `showInput` ou `variant` e nao notar mudanca visual.
|
|
432
|
-
Correcao: esses campos estao declarados na interface, mas ainda sem comportamento dedicado no template atual.
|
|
450
|
+
Correcao: esses campos estao declarados na interface, mas ainda sem comportamento dedicado no template atual.
|
|
433
451
|
|
|
434
452
|
5. Perder historico de cores recentes/customizadas.
|
|
435
|
-
Correcao: persistencia usa `localStorage`; verificar politica corporativa do navegador/sandbox.
|
|
453
|
+
Correcao: persistencia usa `localStorage`; verificar politica corporativa do navegador/sandbox.
|
|
436
454
|
|
|
437
455
|
### 8. Cross-links
|
|
456
|
+
|
|
438
457
|
- `projects/praxis-dynamic-fields/src/lib/base/pdx-base-input-runtime-contract.json-api.md`
|
|
439
458
|
- `projects/praxis-dynamic-fields/src/lib/components/color-input/pdx-color-input.json-api.md`
|
|
440
459
|
- `projects/praxis-dynamic-fields/src/lib/components/material-colorpicker/material-colorpicker.component.ts`
|
|
441
460
|
|
|
442
461
|
### 9. Relatorio de Validacao Estrutural
|
|
462
|
+
|
|
443
463
|
- Visao geral: PASS
|
|
444
464
|
- API (inputs/outputs): PASS
|
|
445
465
|
- Cobertura JSON completa (especifico + herdado): PASS
|
|
@@ -450,59 +470,59 @@ Correcao: persistencia usa `localStorage`; verificar politica corporativa do nav
|
|
|
450
470
|
|
|
451
471
|
## JSON path index (obrigatorio)
|
|
452
472
|
|
|
453
|
-
| Path
|
|
454
|
-
|
|
|
455
|
-
| `metadata`
|
|
456
|
-
| `readonlyMode`
|
|
457
|
-
| `disabledMode`
|
|
458
|
-
| `visible`
|
|
459
|
-
| `presentationMode`
|
|
460
|
-
| `metadata.controlType`
|
|
461
|
-
| `metadata.format`
|
|
462
|
-
| `metadata.views`
|
|
463
|
-
| `metadata.activeView`
|
|
464
|
-
| `metadata.preview`
|
|
465
|
-
| `metadata.showPreview`
|
|
466
|
-
| `metadata.clearButton`
|
|
467
|
-
| `metadata.actionsLayout`
|
|
468
|
-
| `metadata.showAlpha`
|
|
469
|
-
| `gradientSettings.showOpacity`
|
|
470
|
-
| `metadata.gradientSettings.showOpacity` | boolean | false
|
|
471
|
-
| `metadata.gradientSettings.channel`
|
|
472
|
-
| `metadata.paletteSettings.preset`
|
|
473
|
-
| `metadata.paletteSettings.colors`
|
|
474
|
-
| `metadata.paletteSettings.columns`
|
|
473
|
+
| Path | Type | Required | Default | Status | Notes |
|
|
474
|
+
| --------------------------------------- | ------- | -------- | ------- | ------- | --------------------------- |
|
|
475
|
+
| `metadata` | object | true | n/a | Partial | See Detailed API reference. |
|
|
476
|
+
| `readonlyMode` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
477
|
+
| `disabledMode` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
478
|
+
| `visible` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
479
|
+
| `presentationMode` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
480
|
+
| `metadata.controlType` | string | false | n/a | Partial | See Detailed API reference. |
|
|
481
|
+
| `metadata.format` | string | false | n/a | Partial | See Detailed API reference. |
|
|
482
|
+
| `metadata.views` | array | false | n/a | Partial | See Detailed API reference. |
|
|
483
|
+
| `metadata.activeView` | string | false | n/a | Partial | See Detailed API reference. |
|
|
484
|
+
| `metadata.preview` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
485
|
+
| `metadata.showPreview` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
486
|
+
| `metadata.clearButton` | object | false | n/a | Partial | See Detailed API reference. |
|
|
487
|
+
| `metadata.actionsLayout` | string | false | n/a | Partial | See Detailed API reference. |
|
|
488
|
+
| `metadata.showAlpha` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
489
|
+
| `gradientSettings.showOpacity` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
490
|
+
| `metadata.gradientSettings.showOpacity` | boolean | false | n/a | Partial | See Detailed API reference. |
|
|
491
|
+
| `metadata.gradientSettings.channel` | string | false | n/a | Partial | See Detailed API reference. |
|
|
492
|
+
| `metadata.paletteSettings.preset` | string | false | n/a | Partial | See Detailed API reference. |
|
|
493
|
+
| `metadata.paletteSettings.colors` | array | false | n/a | Partial | See Detailed API reference. |
|
|
494
|
+
| `metadata.paletteSettings.columns` | array | false | n/a | Partial | See Detailed API reference. |
|
|
475
495
|
|
|
476
496
|
## Events reference (obrigatorio)
|
|
477
497
|
|
|
478
|
-
| Event
|
|
479
|
-
|
|
|
480
|
-
| `valueChange`
|
|
481
|
-
| `open`
|
|
482
|
-
| `close`
|
|
483
|
-
| `cancel`
|
|
498
|
+
| Event | Payload | Trigger | Stability | Notes |
|
|
499
|
+
| ------------------ | ------- | ------------- | ------------ | --------------------------------------- |
|
|
500
|
+
| `valueChange` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
501
|
+
| `open` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
502
|
+
| `close` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
503
|
+
| `cancel` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
484
504
|
| `activeViewChange` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
485
505
|
| `activeColorClick` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
486
|
-
| `focusEvent`
|
|
487
|
-
| `blurEvent`
|
|
488
|
-
| `focusChange`
|
|
489
|
-
| `nativeBlur`
|
|
490
|
-
| `nativeChange`
|
|
506
|
+
| `focusEvent` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
507
|
+
| `blurEvent` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
508
|
+
| `focusChange` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
509
|
+
| `nativeBlur` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
510
|
+
| `nativeChange` | unknown | runtime-event | Experimental | Check component/runtime implementation. |
|
|
491
511
|
|
|
492
512
|
## Styling API (obrigatorio quando aplicavel)
|
|
493
513
|
|
|
494
|
-
| Token/Class
|
|
495
|
-
|
|
|
514
|
+
| Token/Class | Scope | Purpose | Notes |
|
|
515
|
+
| --------------------------------- | --------- | ------------------------- | ---------------------------------------- |
|
|
496
516
|
| `metadata.paletteSettings.colors` | component | Styling-related JSON path | Validate against runtime implementation. |
|
|
497
517
|
|
|
498
518
|
## Examples (obrigatorio)
|
|
499
519
|
|
|
500
|
-
| Example
|
|
501
|
-
|
|
|
502
|
-
| `Minimal valid`
|
|
503
|
-
| `Common setup`
|
|
504
|
-
| `Advanced setup`
|
|
505
|
-
| `Enterprise scenario` | governance/legacy/migration context | auditability and compatibility boundaries | Include tenant-specific constraints when applicable.
|
|
520
|
+
| Example | Scenario | Validates | Notes |
|
|
521
|
+
| --------------------- | ----------------------------------- | ----------------------------------------- | ------------------------------------------------------------ |
|
|
522
|
+
| `Minimal valid` | baseline payload | required contract blocks | Extracted from preserved technical reference when available. |
|
|
523
|
+
| `Common setup` | common component usage | standard runtime behavior | Validate against host integration path. |
|
|
524
|
+
| `Advanced setup` | richer config with overrides | precedence and normalization | Requires runtime confirmation for edge cases. |
|
|
525
|
+
| `Enterprise scenario` | governance/legacy/migration context | auditability and compatibility boundaries | Include tenant-specific constraints when applicable. |
|
|
506
526
|
|
|
507
527
|
### Minimal valid
|
|
508
528
|
|
|
@@ -529,10 +549,7 @@ Correcao: persistencia usa `localStorage`; verificar politica corporativa do nav
|
|
|
529
549
|
"label": "Cor do status",
|
|
530
550
|
"controlType": "pdx-color-picker-common",
|
|
531
551
|
"format": "rgba",
|
|
532
|
-
"views": [
|
|
533
|
-
"gradient",
|
|
534
|
-
"palette"
|
|
535
|
-
],
|
|
552
|
+
"views": ["gradient", "palette"],
|
|
536
553
|
"activeView": "palette",
|
|
537
554
|
"preview": true,
|
|
538
555
|
"clearButton": {
|
|
@@ -545,12 +562,7 @@ Correcao: persistencia usa `localStorage`; verificar politica corporativa do nav
|
|
|
545
562
|
"paletteSettings": {
|
|
546
563
|
"preset": "office",
|
|
547
564
|
"columns": 6,
|
|
548
|
-
"colors": [
|
|
549
|
-
"#0057B8",
|
|
550
|
-
"#F28C00",
|
|
551
|
-
"#009739",
|
|
552
|
-
"#E30613"
|
|
553
|
-
]
|
|
565
|
+
"colors": ["#0057B8", "#F28C00", "#009739", "#E30613"]
|
|
554
566
|
},
|
|
555
567
|
"popupSettings": {
|
|
556
568
|
"width": 420
|
|
@@ -576,10 +588,7 @@ Correcao: persistencia usa `localStorage`; verificar politica corporativa do nav
|
|
|
576
588
|
"label": "Cor do status",
|
|
577
589
|
"controlType": "colorPicker",
|
|
578
590
|
"format": "rgba",
|
|
579
|
-
"views": [
|
|
580
|
-
"gradient",
|
|
581
|
-
"palette"
|
|
582
|
-
],
|
|
591
|
+
"views": ["gradient", "palette"],
|
|
583
592
|
"activeView": "palette",
|
|
584
593
|
"preview": true,
|
|
585
594
|
"clearButton": {
|
|
@@ -592,12 +601,7 @@ Correcao: persistencia usa `localStorage`; verificar politica corporativa do nav
|
|
|
592
601
|
"paletteSettings": {
|
|
593
602
|
"preset": "office",
|
|
594
603
|
"columns": 6,
|
|
595
|
-
"colors": [
|
|
596
|
-
"#0057B8",
|
|
597
|
-
"#F28C00",
|
|
598
|
-
"#009739",
|
|
599
|
-
"#E30613"
|
|
600
|
-
]
|
|
604
|
+
"colors": ["#0057B8", "#F28C00", "#009739", "#E30613"]
|
|
601
605
|
},
|
|
602
606
|
"popupSettings": {
|
|
603
607
|
"width": 5
|
|
@@ -625,10 +629,7 @@ Correcao: persistencia usa `localStorage`; verificar politica corporativa do nav
|
|
|
625
629
|
"label": "Cor do status",
|
|
626
630
|
"controlType": "colorPicker",
|
|
627
631
|
"format": "rgba",
|
|
628
|
-
"views": [
|
|
629
|
-
"gradient",
|
|
630
|
-
"palette"
|
|
631
|
-
],
|
|
632
|
+
"views": ["gradient", "palette"],
|
|
632
633
|
"activeView": "palette",
|
|
633
634
|
"preview": true,
|
|
634
635
|
"clearButton": {
|
|
@@ -641,12 +642,7 @@ Correcao: persistencia usa `localStorage`; verificar politica corporativa do nav
|
|
|
641
642
|
"paletteSettings": {
|
|
642
643
|
"preset": "office",
|
|
643
644
|
"columns": 6,
|
|
644
|
-
"colors": [
|
|
645
|
-
"#0057B8",
|
|
646
|
-
"#F28C00",
|
|
647
|
-
"#009739",
|
|
648
|
-
"#E30613"
|
|
649
|
-
]
|
|
645
|
+
"colors": ["#0057B8", "#F28C00", "#009739", "#E30613"]
|
|
650
646
|
},
|
|
651
647
|
"popupSettings": {
|
|
652
648
|
"width": 420
|
|
@@ -666,21 +662,53 @@ Correcao: persistencia usa `localStorage`; verificar politica corporativa do nav
|
|
|
666
662
|
|
|
667
663
|
## Compatibility and migration notes (recomendado)
|
|
668
664
|
|
|
669
|
-
|
|
670
|
-
|
|
665
|
+
### Paleta governada
|
|
666
|
+
|
|
667
|
+
`metadata.governedPaletteRef` referencia uma projeção publicada pelo Praxis Config. A resolução é feita pelo `GovernedColorPaletteService`; a referência prevalece sobre `metadata.paletteSettings.colors` e pode fixar `version`, `etag` e `purposes`. Falha de rede, ETag divergente ou contrato inválido deixam a paleta governada indisponível, sem aceitar silenciosamente uma decisão local diferente.
|
|
668
|
+
|
|
669
|
+
Quando a projeção governada está ativa, a aba de paleta permite buscar localmente por `displayName`, `aliases`, `tokenId`, `semanticRole`, `purposes` e valor CSS. A comparação ignora caixa e acentos, os resultados são organizados visualmente por `semanticRole` e a busca é reiniciada a cada abertura. Paletas publicadas com a mesma `familyKey` aparecem como variantes explícitas, sem inferência por tema ou nome. Essa projeção não altera o payload nem inventa grupos de domínio; selecionar e aplicar um resultado continua preservando a referência CSS publicada. Pesquisas vazias exibem um estado explícito e cores locais/recentes não recebem identidade de token por aproximação.
|
|
670
|
+
|
|
671
|
+
O cabeçalho contextual mostra o nome publicado da paleta, variante, versão e quantidade visível/total, com o ETag no tooltip. A faixa de variantes, busca e contexto permanecem fora da área rolável de resultados, cuja altura é limitada para coleções corporativas maiores. Nomes, aliases e família são consumidos exclusivamente da projeção publicada pelo Praxis Config.
|
|
672
|
+
|
|
673
|
+
```json
|
|
674
|
+
{
|
|
675
|
+
"governedPaletteRef": {
|
|
676
|
+
"paletteKey": "praxis.corporate.main",
|
|
677
|
+
"version": 4,
|
|
678
|
+
"etag": "sha256:published-projection",
|
|
679
|
+
"purposes": ["fill", "state"]
|
|
680
|
+
}
|
|
681
|
+
}
|
|
682
|
+
```
|
|
683
|
+
|
|
684
|
+
| Concern | Affected versions | Migration action | Deadline | Notes |
|
|
685
|
+
| ------------------------------------------- | --------------------------------------- | ----------------------------------------------------------------------- | --------------- | ----------------------------------------- |
|
|
671
686
|
| Legacy 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 |
|
|
672
687
|
|
|
673
688
|
## Known limitations and mismatches (recomendado)
|
|
674
689
|
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
690
|
+
### Edição de precisão e formatos
|
|
691
|
+
|
|
692
|
+
A visão `gradient` oferece HEX de 3/6 dígitos e canais RGB inteiros de 0 a 255 sincronizados com o seletor nativo. Valores inválidos bloqueiam `Aplicar`; cancelar ou fechar descarta o rascunho e restaura os canais. As setas operam os inputs e o slider sem serem capturadas pela navegação do menu.
|
|
693
|
+
|
|
694
|
+
A área expansível de precisão oferece modos HSL/HSV, matiz de 0 a 360 graus e canais percentuais de 0 a 100. O plano bidimensional sempre representa saturação/valor HSV, com arraste limitado aos seus extremos; os campos numéricos fornecem operação equivalente por teclado. Os modos alteram apenas a edição, não o `format` de saída. As cores literais preto/branco dos gradientes e do marcador representam o espaço de cor e o contraste do cursor, não o tema do host. Ao selecionar um token governado, o painel projeta os pares de `contrastEvidence` relacionados ao rascunho, com contraparte, razão, nível AA/AAA e resultado; não recalcula nem substitui a política publicada. Para uma cor livre, o painel calcula somente a razão matemática sRGB contra as superfícies da paleta ativa, identificando explicitamente a prévia como não governada e sem inferir aprovação/reprovação.
|
|
695
|
+
|
|
696
|
+
O slider de matiz (0–360°, passo de 1°) compartilha o estado do canal H, aceita Home/End e setas e mantém saturação, valor/luminosidade e alpha do rascunho. Sua apresentação nativa permite o uso em cores forçadas; os campos numéricos continuam sendo a alternativa ao plano visual. Isso não constitui certificação AXE ou de leitor de tela.
|
|
697
|
+
|
|
698
|
+
`format` continua determinando a saída: `hex` produz seis dígitos e `rgb` não transporta alpha; `rgba` e `hsl` preservam alpha (com saída `hsla` quando necessário). A conversão sRGB usa até três casas decimais e aceita HEX com alpha, RGB(A) e HSL(A) como valores de entrada. Cores CSS adicionais dependem da resolução do navegador; não há promessa de conversão de wide gamut.
|
|
699
|
+
|
|
700
|
+
Selecionar um token mantém a referência e sua opacidade publicada. Editar explicitamente os canais ou o plano cria uma cor literal, sem modificar a decisão governada. O slider de alpha fica desabilitado enquanto o rascunho é um token. O editor de metadata continua usando os mesmos campos `format` e `gradientSettings.showOpacity`: não há novo path de configuração nem nova operação de IA.
|
|
701
|
+
|
|
702
|
+
| Path/Behavior | Observed behavior (runtime) | Desired behavior | Impact | Tracking issue | Target fix |
|
|
703
|
+
| ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------- | ------ | -------------------- | --------------------------- |
|
|
704
|
+
| Precision workspace | HEX/RGB, HSL/HSV, plano HSV e alpha editáveis; tokens governados exibem diagnóstico contextual publicado e cores livres exibem razão matemática contra superfícies governadas, sem decisão de política | Workspace corporativo de precisão, teclado e contraste | High | roadmap color picker | Evolução parcial do runtime |
|
|
705
|
+
| Adaptive mode | `adaptiveMode=true` usa diálogo canônico abaixo de 600 px e menu em desktop, compartilhando o template e o rascunho. O editor expõe o opt-in. Não há troca de overlay durante uma edição aberta. | Evoluir integração com teclado virtual e unificar a família | Medium | roadmap color picker | Próxima evolução da família |
|
|
678
706
|
|
|
679
707
|
## Source references (obrigatorio)
|
|
680
708
|
|
|
681
|
-
| Source type
|
|
682
|
-
|
|
|
683
|
-
| schema-metadata | projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.metadata.ts
|
|
684
|
-
| runtime-code
|
|
685
|
-
| schema-types
|
|
686
|
-
| runtime-code
|
|
709
|
+
| Source type | Path/URL | Why it is source of truth | Last verified (YYYY-MM-DD) | Notes |
|
|
710
|
+
| --------------- | -------------------------------------------------------------------------------------------- | -------------------------------------------------- | -------------------------- | ------------- |
|
|
711
|
+
| schema-metadata | projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.metadata.ts | Primary source of truth for contract and behavior. | 2026-03-06 | verified-path |
|
|
712
|
+
| runtime-code | projects/praxis-dynamic-fields/src/lib/components/color-picker/pdx-color-picker.component.ts | Primary source of truth for contract and behavior. | 2026-03-06 | verified-path |
|
|
713
|
+
| 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 |
|
|
714
|
+
| runtime-code | projects/praxis-dynamic-fields/src/lib/base/simple-base-input.component.ts | Primary source of truth for contract and behavior. | 2026-03-06 | verified-path |
|