@praxisui/dynamic-form 9.0.0-beta.7 → 9.0.0-beta.70
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 +190 -2
- package/ai/component-registry.json +14320 -0
- package/docs/dynamic-form-visual-builder-parity-audit.md +268 -0
- package/docs/schema-driven-layout-materialization-rfc.md +497 -0
- package/fesm2022/praxisui-dynamic-form.mjs +4391 -764
- package/package.json +13 -9
- package/src/lib/config-editor/praxis-dynamic-form-config-editor.json-api.md +8 -6
- package/src/lib/praxis-dynamic-form.json-api.md +35 -5
- package/types/praxisui-dynamic-form.d.ts +150 -29
package/README.md
CHANGED
|
@@ -26,7 +26,7 @@ npm i @praxisui/dynamic-form@latest
|
|
|
26
26
|
Peer dependencies:
|
|
27
27
|
|
|
28
28
|
- `@angular/common`, `@angular/core`, `@angular/forms`, `@angular/cdk`, `@angular/material`, `@angular/router` `^21.0.0`
|
|
29
|
-
- `@praxisui/ai`, `@praxisui/core`, `@praxisui/dynamic-fields`, `@praxisui/metadata-editor`, `@praxisui/rich-content`, `@praxisui/settings-panel`, `@praxisui/visual-builder` `^9.0.0-beta.
|
|
29
|
+
- `@praxisui/ai`, `@praxisui/core`, `@praxisui/dynamic-fields`, `@praxisui/metadata-editor`, `@praxisui/rich-content`, `@praxisui/settings-panel`, `@praxisui/visual-builder` `^9.0.0-beta.12`
|
|
30
30
|
- `rxjs` `^7.8.0`
|
|
31
31
|
|
|
32
32
|
## Minimum Local Runtime
|
|
@@ -101,6 +101,130 @@ For schema-driven backend surfaces, prefer explicit `schemaUrl`, `submitUrl`, an
|
|
|
101
101
|
|
|
102
102
|
When using resource, schema, read, or submit flows, the host must provide the effective API/CRUD service wiring for that scope.
|
|
103
103
|
|
|
104
|
+
Schema-driven layout materialization is opt-in through `layoutPolicy`. Use it when the backend
|
|
105
|
+
schema already publishes enough `x-ui` metadata for the runtime to build the layout without
|
|
106
|
+
local `FormConfig.sections`.
|
|
107
|
+
|
|
108
|
+
```html
|
|
109
|
+
<praxis-dynamic-form
|
|
110
|
+
formId="employee-detail"
|
|
111
|
+
mode="view"
|
|
112
|
+
schemaUrl="/schemas/filtered?path=/api/employees/{id}&operation=get&schemaType=response"
|
|
113
|
+
[initialValue]="employee"
|
|
114
|
+
[layoutPolicy]="{
|
|
115
|
+
source: 'schema',
|
|
116
|
+
intent: 'detail',
|
|
117
|
+
preset: 'compactPresentation',
|
|
118
|
+
lifecycle: 'live',
|
|
119
|
+
persistence: 'transient',
|
|
120
|
+
schemaOperation: 'detail',
|
|
121
|
+
schemaType: 'response'
|
|
122
|
+
}">
|
|
123
|
+
</praxis-dynamic-form>
|
|
124
|
+
```
|
|
125
|
+
|
|
126
|
+
For create/edit command forms, the policy must point at a request schema, normally through an
|
|
127
|
+
explicit `schemaUrl` containing `schemaType=request` and `operation=post|put|patch`. If the
|
|
128
|
+
declared `schemaUrl` conflicts with `layoutPolicy.schemaType` or `layoutPolicy.schemaOperation`,
|
|
129
|
+
the runtime fails initialization instead of rendering a form from the wrong business contract.
|
|
130
|
+
|
|
131
|
+
`layoutPolicy.source = "schema"` ignores authored or persisted `sections`, but preserves
|
|
132
|
+
non-layout host/persisted concerns such as `actions`, `api`, `messages`, rules, hooks and rich
|
|
133
|
+
blocks. Host-provided non-layout config has precedence over persisted config.
|
|
134
|
+
|
|
135
|
+
When `mode="view"` and the host does not provide `presentationModeGlobal`, a schema policy with
|
|
136
|
+
`intent: "detail"` or `preset: "compactPresentation"` also enables presentation rendering. Hosts
|
|
137
|
+
that need traditional disabled controls for the same schema can pass `[presentationModeGlobal]="false"`.
|
|
138
|
+
For compact detail screens, explicit schema `x-ui.width` values are honored as 12-column spans so
|
|
139
|
+
fieldsets can render multiple read-only fields per row. Fields without an explicit width remain
|
|
140
|
+
full-width to preserve existing layouts. Generated compact sections also receive semantic header
|
|
141
|
+
icons derived from their group role, while field icons continue to come from existing schema
|
|
142
|
+
metadata.
|
|
143
|
+
In runtime rendering, compact detail containers are kept visible only when at least one referenced
|
|
144
|
+
field can actually be materialized after metadata visibility, `visible=false`, `hidden=true` and
|
|
145
|
+
field-rule overrides are applied. Boolean detail fields are valid presentation content, including
|
|
146
|
+
`false` values; marker/flag groups should render their boolean values, not collapse them as empty
|
|
147
|
+
strings. If a section has no materialized fields, the runtime hides the section instead of leaving
|
|
148
|
+
an orphan title.
|
|
149
|
+
When a migrated detail surface needs the summary density to win over generic schema widths, set
|
|
150
|
+
`detailSummary.widthPrecedence: "summary"` together with `columns` or `responsiveColumns`. The
|
|
151
|
+
default is `"schema"`, so existing forms keep honoring `x-ui.width` unless the summary policy
|
|
152
|
+
explicitly opts into overriding it for the compact read-only surface.
|
|
153
|
+
Use `"summary"` for curated operational summaries. If a field contains long narrative text,
|
|
154
|
+
legal content, observations, or values that require scan width, keep schema precedence for that
|
|
155
|
+
surface or exclude the field from the compact summary and expose it in a secondary detail group.
|
|
156
|
+
|
|
157
|
+
For fields published by the backend schema, server DTO metadata remains authoritative for semantic presentation data such as `label`, `hint`, `helpText`, `tooltip`, `tooltipOnHover`, and icon metadata. Local `FormConfig` should customize layout, grouping, transient fields, actions, and host-specific behavior, but it should not redefine DTO-owned field semantics.
|
|
158
|
+
|
|
159
|
+
Field-level access metadata follows the same authority boundary. When the backend publishes `x-ui.fieldAccess`, `@praxisui/core` preserves it in `FieldMetadata.fieldAccess` and `@praxisui/dynamic-form` can materialize it as hidden or read-only UX when the host supplies explicit `FormConfig.metadata.fieldAccessAuthorities` or enterprise runtime `authorities`. The runtime does not infer field authorities from `capabilities`; backend filtering and submit validation remain the security boundary.
|
|
160
|
+
|
|
161
|
+
Dense operational forms should keep DTO `hint`/`helpText` intact and use `FormConfig.helpPresentation` to choose the visual policy. For drawers or command forms, prefer `display: "auto"` with `preferPopoverForControls` for controls such as `toggle`, `checkbox`, and `select`; validation errors remain inline regardless of this policy. Field-level `helpDisplay` is still authoritative when present, including `helpDisplay: "auto"` for DTOs that need a local threshold.
|
|
162
|
+
|
|
163
|
+
Example backend-owned `x-ui` metadata:
|
|
164
|
+
|
|
165
|
+
```json
|
|
166
|
+
{
|
|
167
|
+
"type": "object",
|
|
168
|
+
"properties": {
|
|
169
|
+
"frequencyType": {
|
|
170
|
+
"type": "string",
|
|
171
|
+
"x-ui": {
|
|
172
|
+
"label": "Frequency type",
|
|
173
|
+
"controlType": "async-select",
|
|
174
|
+
"helpText": "Select the operational class used by payroll and timekeeping rules.",
|
|
175
|
+
"tooltip": "Backend-owned DTO semantics; local FormConfig cannot override it.",
|
|
176
|
+
"tooltipOnHover": true,
|
|
177
|
+
"icon": "calendar_month",
|
|
178
|
+
"iconPosition": "start",
|
|
179
|
+
"iconColor": "primary",
|
|
180
|
+
"endpoint": "/api/frequency-types/options/filter",
|
|
181
|
+
"filterField": "name",
|
|
182
|
+
"sortField": "name",
|
|
183
|
+
"sortOrder": "asc",
|
|
184
|
+
"optionsPageSize": 20
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
```
|
|
190
|
+
|
|
191
|
+
In that flow, local `FormConfig` may place `frequencyType` in sections, rows, tabs, custom actions, or corporate-only local fields. It should not persist competing `label`, `helpText`, `tooltip`, or icon metadata for `frequencyType`, because the next schema reconciliation will restore the backend DTO semantics.
|
|
192
|
+
|
|
193
|
+
### ErgonX migration baseline
|
|
194
|
+
|
|
195
|
+
For ErgonX-style migrations, use schema-driven layout as the preferred target once the DTO/schema is semantically ready. Treat local `FormConfig.sections` as a temporary bridge, not as the standard for hundreds of screens.
|
|
196
|
+
|
|
197
|
+
Recommended defaults:
|
|
198
|
+
|
|
199
|
+
- detail/read-only: `layoutPolicy.source = "schema"`, `intent = "detail"`, `preset = "compactPresentation"`, `persistence = "transient"` and a response schema;
|
|
200
|
+
- create/edit: `layoutPolicy.source = "schema"`, `intent = "command"`, `preset = "groupedCommand"`, `persistence = "transient"` and a request schema;
|
|
201
|
+
- dense command drawers: `helpPresentation.display = "auto"` with popover preference for select, checkbox, toggle, date and numeric controls;
|
|
202
|
+
- operational input-heavy forms: `fieldIconPolicy = "presentation-only"` unless the icon is part of the actual affordance.
|
|
203
|
+
|
|
204
|
+
Schema-driven command forms do not need to declare empty manual sections. Keep host config focused on behavior, messages, actions and field metadata that is genuinely local:
|
|
205
|
+
|
|
206
|
+
```ts
|
|
207
|
+
const commandConfig: FormConfig = {
|
|
208
|
+
metadata: { source: 'schema' },
|
|
209
|
+
behavior: {
|
|
210
|
+
disableMountAnimation: true,
|
|
211
|
+
focusFirstError: true,
|
|
212
|
+
scrollToErrors: true,
|
|
213
|
+
},
|
|
214
|
+
messages: {
|
|
215
|
+
submitSuccess: 'Registro salvo.',
|
|
216
|
+
submitError: 'Não foi possível salvar o registro.',
|
|
217
|
+
},
|
|
218
|
+
};
|
|
219
|
+
```
|
|
220
|
+
|
|
221
|
+
Pair this config with an explicit schema source, such as `[schemaUrl]`,
|
|
222
|
+
`[submitUrl]`, `[submitMethod]` and, in detached hosts, `[apiEndpointKey]` or
|
|
223
|
+
`[apiUrlEntry]`. A sectionless config is valid only when the schema/runtime
|
|
224
|
+
source is the canonical owner of field grouping and controls.
|
|
225
|
+
|
|
226
|
+
Do not use Angular config to fix weak DTO semantics. Missing grouping, vague `helpText`, generic labels, raw coded values, wrong control types or absent option metadata should return to backend DTO/schema hardening. The detailed migration checklist lives in `docs/schema-driven-layout-materialization-rfc.md`.
|
|
227
|
+
|
|
104
228
|
## Runtime Inputs And Outputs
|
|
105
229
|
|
|
106
230
|
Common inputs:
|
|
@@ -112,7 +236,7 @@ Common inputs:
|
|
|
112
236
|
- `apiEndpointKey`, `apiUrlEntry`
|
|
113
237
|
- `actions`, `layout`, `backConfig`, `hooks`
|
|
114
238
|
- `enableCustomization`
|
|
115
|
-
- `readonlyModeGlobal`, `disabledModeGlobal`, `presentationModeGlobal`, `visibleGlobal`
|
|
239
|
+
- `readonlyModeGlobal`, `disabledModeGlobal`, `presentationModeGlobal`, `fieldIconPolicy`, `visibleGlobal`
|
|
116
240
|
- `notifyIfOutdated`, `snoozeMs`, `autoOpenSettingsOnOutdated`
|
|
117
241
|
- `domainRules`
|
|
118
242
|
- `editorialContext`
|
|
@@ -169,10 +293,70 @@ Do not model backend DTO fields as local/transient fields. If a field belongs to
|
|
|
169
293
|
- `kind: "field"` references `fieldMetadata[].name`.
|
|
170
294
|
- `kind: "richContent"` hosts a `RichContentDocument` and does not enter `fieldMetadata`, `formData`, or HTTP payloads.
|
|
171
295
|
- `formRules` govern visibility, required state, values, labels, styles, and other whitelisted runtime properties.
|
|
296
|
+
- `formRulesState` is internal visual-builder state. LLMs and external tools should not write it directly.
|
|
172
297
|
- `formCommandRules` are used for governed side effects such as global actions.
|
|
173
298
|
|
|
174
299
|
Presentation formatting of field values is resolved by `@praxisui/dynamic-fields` from field metadata such as `valuePresentation`.
|
|
175
300
|
|
|
301
|
+
### Compact Presentation Preset
|
|
302
|
+
|
|
303
|
+
For dense enterprise read-only screens, `DynamicFormLayoutService.generateFormConfigFromMetadata`
|
|
304
|
+
can materialize a compact presentation layout directly from governed field metadata:
|
|
305
|
+
|
|
306
|
+
```ts
|
|
307
|
+
const config = layout.generateFormConfigFromMetadata(fields, {
|
|
308
|
+
layoutPreset: 'compactPresentation',
|
|
309
|
+
presentationRoleMap: {
|
|
310
|
+
Identificacao: 'core-attributes',
|
|
311
|
+
Regras: 'technical-scope',
|
|
312
|
+
Marcadores: 'behavior-flags',
|
|
313
|
+
},
|
|
314
|
+
});
|
|
315
|
+
```
|
|
316
|
+
|
|
317
|
+
The preset keeps field semantics in `FieldMetadata`, creates compact rows from field width/data
|
|
318
|
+
type, derives semantic section header icons from group roles, marks generated sections with
|
|
319
|
+
`className: "pdx-presentation-section ..."`, and annotates
|
|
320
|
+
metadata with `generatedLayoutPreset: "compactPresentation"` and `presentationDensity: "compact"`.
|
|
321
|
+
Boolean fields are displayed through the canonical `valuePresentation: { type: "boolean" }` path,
|
|
322
|
+
so DTO-normalized booleans and legacy display values such as `S/N` are formatted by
|
|
323
|
+
`@praxisui/dynamic-fields`.
|
|
324
|
+
|
|
325
|
+
When a compact read-only screen needs operational signals, use `formBlocksBefore` with a short
|
|
326
|
+
`RichContentDocument` strip such as `metric` and `progress` nodes. Keep those blocks visual-only:
|
|
327
|
+
they must not duplicate DTO fields in `fieldMetadata`, enter `formData`, or push the first business
|
|
328
|
+
field below the useful viewport. Larger guidance cards, timelines, and stat groups belong in a
|
|
329
|
+
dedicated row, side context, or a separate rich-content demonstration tab rather than the compact
|
|
330
|
+
detail header.
|
|
331
|
+
|
|
332
|
+
The runtime exposes host-themeable CSS variables for this mode:
|
|
333
|
+
|
|
334
|
+
- `--pdx-presentation-label-width`
|
|
335
|
+
- `--pdx-presentation-label-size`
|
|
336
|
+
- `--pdx-presentation-value-size`
|
|
337
|
+
- `--pdx-presentation-row-gap`
|
|
338
|
+
- `--pdx-presentation-section-gap`
|
|
339
|
+
- `--pdx-presentation-flag-height`
|
|
340
|
+
- `--pdx-presentation-flag-padding`
|
|
341
|
+
- `--pdx-presentation-flag-radius`
|
|
342
|
+
- `--pdx-presentation-flag-font-size`
|
|
343
|
+
|
|
344
|
+
Use this preset for read/detail surfaces. Do not use it to replace backend DTO documentation,
|
|
345
|
+
business validation, or editable command forms. In table/detail workbenches, keep the table
|
|
346
|
+
selection and the detail `initialValue` synchronized in the host; the compact form only renders
|
|
347
|
+
the selected DTO state.
|
|
348
|
+
|
|
349
|
+
## LLM-Safe Authoring Subset
|
|
350
|
+
|
|
351
|
+
For AI-generated or tool-generated configuration, prefer canonical `FormConfig` JSON and keep edits reviewable:
|
|
352
|
+
|
|
353
|
+
- Write rule suggestions to `formRules[]` with `metadata: { origin: "llm", reviewStatus: "pending" }`.
|
|
354
|
+
- Do not write `formRulesState`; the editor may derive it after human review when the rule is visually representable.
|
|
355
|
+
- Treat simple field comparisons, scalar literals, field-to-field comparisons, and `and`/`or` groups as the stable visual round-trip subset.
|
|
356
|
+
- Treat advanced JsonLogic such as `!`, `xor`, `implies`, `between`, `notIn`, custom functions, context operands, and computed expressions as runtime-supported JSON-only unless a focused visual round-trip test exists.
|
|
357
|
+
- Use only properties allowed by the target rule schema. Unsupported or sanitized properties appear in rule diagnostics and should be fixed before publication.
|
|
358
|
+
- Keep side effects in `formCommandRules` with structured `globalAction: { actionId, payload }`; do not encode commands inside `formRules[].effect.properties`.
|
|
359
|
+
|
|
176
360
|
## Visual Editor
|
|
177
361
|
|
|
178
362
|
Use `PraxisDynamicFormConfigEditor` directly or enable customization on the runtime.
|
|
@@ -192,6 +376,8 @@ dialog.open(PraxisDynamicFormConfigEditor, {
|
|
|
192
376
|
|
|
193
377
|
The editor preserves the same `FormConfig` contract used by the runtime. Field type names, descriptions, and icons come from the dynamic-fields editorial metadata chain, not from a local map inside Dynamic Form.
|
|
194
378
|
|
|
379
|
+
Runtime-only rules remain valid JSON when they pass diagnostics, but they may open in JSON review instead of the visual rule builder until their condition and effect shape are covered by the visual-safe subset.
|
|
380
|
+
|
|
195
381
|
## AI Authoring
|
|
196
382
|
|
|
197
383
|
`PRAXIS_DYNAMIC_FORM_AUTHORING_MANIFEST` declares executable operations for governed edits to:
|
|
@@ -205,6 +391,8 @@ The editor preserves the same `FormConfig` contract used by the runtime. Field t
|
|
|
205
391
|
|
|
206
392
|
The manifest is meant to keep AI-generated patches compatible with the visual editor and the runtime `FormConfig` contract.
|
|
207
393
|
|
|
394
|
+
Rule operations in the manifest write `formRules[]`, require pending review metadata, and intentionally avoid `formRulesState`. A valid JsonLogic condition is not automatically a visual round-trip guarantee; LLMs should use the safe subset above unless the operation explicitly targets a JSON-only/runtime-only path.
|
|
395
|
+
|
|
208
396
|
## Public API
|
|
209
397
|
|
|
210
398
|
Main exports:
|