@praxisui/manual-form 9.0.0-beta.9 → 9.0.0-beta.90

package/fesm2022/praxisui-manual-form.mjs

@@ -1,11 +1,11 @@
-import { ensureIds, DynamicFormService, ASYNC_CONFIG_STORAGE, RULE_PROPERTY_SCHEMA, deepMerge, resolveControlTypeAlias, FieldControlType, normalizeControlTypeKey, FormHooksRegistry, ComponentKeyService, FIELD_SELECTOR_REGISTRY_DISABLE_DEFAULTS, DEFAULT_FIELD_SELECTOR_CONTROL_TYPE_MAP, FieldSelectorRegistry, providePraxisI18n, PraxisI18nService, API_URL } from '@praxisui/core';
+import { ensureIds, DynamicFormService, ASYNC_CONFIG_STORAGE, RULE_PROPERTY_SCHEMA, deepMerge, resolveControlTypeAlias, FieldControlType, normalizeControlTypeKey, PraxisIconButtonComponent, FormHooksRegistry, ComponentKeyService, FIELD_SELECTOR_REGISTRY_DISABLE_DEFAULTS, DEFAULT_FIELD_SELECTOR_CONTROL_TYPE_MAP, FieldSelectorRegistry, providePraxisI18n, PraxisI18nService, API_URL, ComponentMetadataRegistry } from '@praxisui/core';
 import * as i0 from '@angular/core';
-import { inject, Optional, Inject, Injectable, input, output, ChangeDetectionStrategy, Component, Input, InjectionToken, isDevMode, EventEmitter, HostListener, ViewChild, Output, ChangeDetectorRef, DestroyRef, PLATFORM_ID, effect, ContentChildren, signal, computed, Directive } from '@angular/core';
+import { inject, Optional, Inject, Injectable, input, output, ChangeDetectionStrategy, Component, Input, InjectionToken, isDevMode, EventEmitter, HostListener, ViewChild, Output, ChangeDetectorRef, DestroyRef, PLATFORM_ID, effect, ContentChildren, signal, computed, Directive, ENVIRONMENT_INITIALIZER } from '@angular/core';
 import { BehaviorSubject, firstValueFrom, debounceTime, fromEvent, of } from 'rxjs';
 import { take } from 'rxjs/operators';
 import { ActivatedRoute } from '@angular/router';
 import { isPlatformBrowser } from '@angular/common';
-import { BaseAiAdapter, shouldRoutePromptToGovernedDecision, AiBackendApiService, PraxisAssistantSessionRegistryService, PraxisAssistantTurnOrchestratorService, createPraxisAssistantViewportLayout, PraxisAiAssistantShellComponent } from '@praxisui/ai';
+import { BaseAiAdapter, withAuthoringScopePolicy, shouldRoutePromptToGovernedDecision, AiBackendApiService, PraxisAssistantSessionRegistryService, PraxisAssistantTurnOrchestratorService, createPraxisAssistantViewportLayout, PraxisAiAssistantShellComponent } from '@praxisui/ai';
 import * as i1 from '@angular/forms';
 import { FormGroupDirective, FormGroup, FormControl, Validators, ReactiveFormsModule, FormControlName, ControlContainer, FormsModule } from '@angular/forms';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
@@ -586,13 +586,15 @@ function generateRulePropertyCapabilities(targetType, properties) {
     properties.forEach((prop) => {
         const valueKind = prop.type === 'object'
             ? 'object'
-            : prop.type === 'enum'
-                ? 'enum'
-                : prop.type === 'boolean'
-                    ? 'boolean'
-                    : prop.type === 'number'
-                        ? 'number'
-                        : 'string';
+            : prop.type === 'array'
+                ? 'array'
+                : prop.type === 'enum'
+                    ? 'enum'
+                    : prop.type === 'boolean'
+                        ? 'boolean'
+                        : prop.type === 'number'
+                            ? 'number'
+                            : 'string';
         const capability = {
             path: `formRules[].effect.properties.${prop.name}`,
             category: 'rules',
@@ -605,7 +607,7 @@ function generateRulePropertyCapabilities(targetType, properties) {
                     : prop.type === 'enum'
                         ? (prop.enumValues?.[0]?.value || 'valor')
                         : 'valor',
-            safetyNotes: prop.type === 'object' ? 'O objeto deve seguir o schema esperado pelo componente alvo.' : undefined,
+            safetyNotes: prop.type === 'object' ? 'O objeto deve seguir o schema esperado pelo componente alvo.' : prop.type === 'array' ? 'A lista deve seguir o schema esperado pelo componente alvo.' : undefined,
         };
         if (prop.enumValues) {
             capability.allowedValues = prop.enumValues.map((ev) => ev.value);
@@ -619,13 +621,15 @@ function generateRulePropertyWhenFalseCapabilities(targetType, properties) {
     properties.forEach((prop) => {
         const valueKind = prop.type === 'object'
             ? 'object'
-            : prop.type === 'enum'
-                ? 'enum'
-                : prop.type === 'boolean'
-                    ? 'boolean'
-                    : prop.type === 'number'
-                        ? 'number'
-                        : 'string';
+            : prop.type === 'array'
+                ? 'array'
+                : prop.type === 'enum'
+                    ? 'enum'
+                    : prop.type === 'boolean'
+                        ? 'boolean'
+                        : prop.type === 'number'
+                            ? 'number'
+                            : 'string';
         const capability = {
             path: `formRules[].effect.propertiesWhenFalse.${prop.name}`,
             category: 'rules',
@@ -638,7 +642,7 @@ function generateRulePropertyWhenFalseCapabilities(targetType, properties) {
                     : prop.type === 'enum'
                         ? (prop.enumValues?.[0]?.value || 'valor')
                         : 'valor',
-            safetyNotes: prop.type === 'object' ? 'O objeto deve seguir o schema esperado pelo componente alvo.' : undefined,
+            safetyNotes: prop.type === 'object' ? 'O objeto deve seguir o schema esperado pelo componente alvo.' : prop.type === 'array' ? 'A lista deve seguir o schema esperado pelo componente alvo.' : undefined,
         };
         if (prop.enumValues) {
             capability.allowedValues = prop.enumValues.map((ev) => ev.value);
@@ -1025,7 +1029,13 @@ const MANUAL_FORM_AI_CAPABILITIES = {
         ...generateRulePropertyWhenFalseCapabilities('action', RULE_PROPERTY_SCHEMA.action),
         ...generateRulePropertyWhenFalseCapabilities('row', RULE_PROPERTY_SCHEMA.row),
         ...generateRulePropertyWhenFalseCapabilities('column', RULE_PROPERTY_SCHEMA.column),
-        { path: 'formRulesState', category: 'rules', valueKind: 'object', description: 'Estado bruto do visual builder.' },
+        {
+            path: 'formRulesState',
+            category: 'metadata',
+            valueKind: 'object',
+            description: 'Estado interno do builder visual de regras, gerado apenas para round-trip do editor.',
+            safetyNotes: 'Read-only/internal. Nao use como alvo de autoria, patch, exemplo ou operacao de IA; gere somente formRules e deixe o editor materializar formRulesState.',
+        },
         { path: 'hooks', category: 'hooks', valueKind: 'object', description: 'Declaracoes de hooks por estagio.' },
         { path: 'hooks.beforeInit', category: 'hooks', valueKind: 'array', description: 'Hooks beforeInit.' },
         { path: 'hooks.beforeInit[]', category: 'hooks', valueKind: 'array', description: 'Hooks beforeInit.' },
@@ -1251,7 +1261,7 @@ class ManualFormAgenticAuthoringTurnFlow {
         if (this.shouldRouteToGovernedDecision(prompt, contextHints)) {
             return this.toGovernedDecisionHandoff(prompt, request);
         }
-        const response = await firstValueFrom(this.aiApi.getPatch({
+        const response = await firstValueFrom(this.aiApi.getPatch(withAuthoringScopePolicy({
             componentId,
             componentType,
             userPrompt: prompt,
@@ -1268,7 +1278,11 @@ class ManualFormAgenticAuthoringTurnFlow {
             ...(runtimeState ? { runtimeState } : {}),
             ...(schemaFields?.length ? { schemaFields } : {}),
             ...(contextHints ? { contextHints } : {}),
-        }));
+        }, {
+            componentId,
+            componentType,
+            componentLabel: this.adapter.componentName || 'formulario',
+        })));
         return this.toTurnResult(this.compileAdapterResponse(response), request);
     }
     async apply(_request) {
@@ -1820,76 +1834,69 @@ class ManualFieldToolbarComponent {
       <button
         #firstAction
         type="button"
+        [praxisIconButton]="'mso:star'"
+        size="dense"
+        [pressed]="isRequired"
         class="toolbar-btn"
-        [attr.aria-pressed]="isRequired ? 'true' : 'false'"
         aria-label="Alternar obrigatorio"
         title="Alternar obrigatorio"
         (click)="toggleRequired.emit()"
-      >
-        <span class="material-symbols-outlined toolbar-icon" [class.toolbar-icon--filled]="isRequired">
-          star
-        </span>
-      </button>
+      ></button>
       <button
         type="button"
+        [praxisIconButton]="isReadOnly ? 'mso:lock' : 'mso:lock_open'"
+        size="dense"
+        [pressed]="isReadOnly"
         class="toolbar-btn"
-        [attr.aria-pressed]="isReadOnly ? 'true' : 'false'"
         aria-label="Alternar somente leitura"
         title="Alternar somente leitura"
         (click)="toggleReadonly.emit()"
-      >
-        <span class="material-symbols-outlined">
-          {{ isReadOnly ? 'lock' : 'lock_open' }}
-        </span>
-      </button>
+      ></button>
       <button
         type="button"
+        [praxisIconButton]="metadata?.hidden ? 'mso:visibility_off' : 'mso:visibility'"
+        size="dense"
+        [pressed]="metadata?.hidden === true"
         class="toolbar-btn"
-        [attr.aria-pressed]="metadata?.hidden ? 'true' : 'false'"
         aria-label="Alternar visibilidade"
         title="Alternar visibilidade"
         (click)="toggleHidden.emit()"
-      >
-        <span class="material-symbols-outlined">
-          {{ metadata?.hidden ? 'visibility_off' : 'visibility' }}
-        </span>
-      </button>
+      ></button>
       <button
         type="button"
+        [praxisIconButton]="metadata?.disabled ? 'mso:toggle_on' : 'mso:toggle_off'"
+        size="dense"
+        [pressed]="metadata?.disabled === true"
         class="toolbar-btn"
-        [attr.aria-pressed]="metadata?.disabled ? 'true' : 'false'"
         aria-label="Alternar desabilitado"
         title="Alternar desabilitado"
         (click)="toggleDisabled.emit()"
-      >
-        <span class="material-symbols-outlined">
-          {{ metadata?.disabled ? 'toggle_on' : 'toggle_off' }}
-        </span>
-      </button>
+      ></button>
       <button
         type="button"
+        [praxisIconButton]="'mso:tune'"
+        size="dense"
+        appearance="filled"
         class="toolbar-btn toolbar-btn--accent"
         aria-label="Configurar campo"
         title="Configurar campo"
         (click)="openEditor.emit()"
-      >
-        <span class="material-symbols-outlined">tune</span>
-      </button>
+      ></button>
       <button
         type="button"
+        [praxisIconButton]="'mso:close'"
+        size="dense"
         class="toolbar-btn toolbar-btn--ghost"
         aria-label="Fechar"
         title="Fechar"
         (click)="requestClose.emit()"
-      >
-        <span class="material-symbols-outlined">close</span>
-      </button>
+      ></button>
     </div>
-  `, isInline: true, styles: [":host{display:block;pointer-events:auto;font-family:inherit}.pdx-manual-field-toolbar{display:inline-flex;align-items:center;gap:6px;padding:6px;border-radius:12px;background:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level3);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.toolbar-btn{appearance:none;border:0;background:transparent;color:var(--md-sys-color-on-surface);display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:10px;cursor:pointer;transition:background-color .12s ease,transform .12s ease}.toolbar-btn:hover{background:var(--md-sys-color-primary-container)}.toolbar-btn:active{transform:scale(.97)}.toolbar-btn:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}.toolbar-btn--accent{background:var(--md-sys-color-primary-container)}.toolbar-btn--ghost{opacity:.7}.material-symbols-outlined{font-size:18px;line-height:18px}.toolbar-icon{font-variation-settings:\"FILL\" 0,\"wght\" 400,\"GRAD\" 0,\"opsz\" 20}.toolbar-icon--filled{font-variation-settings:\"FILL\" 1,\"wght\" 600,\"GRAD\" 0,\"opsz\" 20}\n"] });
+  `, isInline: true, styles: [":host{display:block;pointer-events:auto;font-family:inherit}.pdx-manual-field-toolbar{display:inline-flex;align-items:center;gap:6px;padding:6px;border-radius:12px;background:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level3);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.toolbar-btn{color:var(--md-sys-color-on-surface)}.toolbar-btn--accent{--praxis-icon-button-filled-background: var(--md-sys-color-primary-container);--praxis-icon-button-filled-foreground: var(--md-sys-color-on-primary-container)}.toolbar-btn--ghost{opacity:.7}\n"], dependencies: [{ kind: "component", type: PraxisIconButtonComponent, selector: "button[praxisIconButton]", inputs: ["praxisIconButton", "size", "appearance", "presentation", "pressed", "busy"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ManualFieldToolbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'praxis-manual-field-toolbar', standalone: true, imports: [], template: `
+            args: [{ selector: 'praxis-manual-field-toolbar', standalone: true, imports: [PraxisIconButtonComponent], template: `
     <div
       class="pdx-manual-field-toolbar"
       role="toolbar"
@@ -1898,72 +1905,65 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
       <button
         #firstAction
         type="button"
+        [praxisIconButton]="'mso:star'"
+        size="dense"
+        [pressed]="isRequired"
         class="toolbar-btn"
-        [attr.aria-pressed]="isRequired ? 'true' : 'false'"
         aria-label="Alternar obrigatorio"
         title="Alternar obrigatorio"
         (click)="toggleRequired.emit()"
-      >
-        <span class="material-symbols-outlined toolbar-icon" [class.toolbar-icon--filled]="isRequired">
-          star
-        </span>
-      </button>
+      ></button>
       <button
         type="button"
+        [praxisIconButton]="isReadOnly ? 'mso:lock' : 'mso:lock_open'"
+        size="dense"
+        [pressed]="isReadOnly"
         class="toolbar-btn"
-        [attr.aria-pressed]="isReadOnly ? 'true' : 'false'"
         aria-label="Alternar somente leitura"
         title="Alternar somente leitura"
         (click)="toggleReadonly.emit()"
-      >
-        <span class="material-symbols-outlined">
-          {{ isReadOnly ? 'lock' : 'lock_open' }}
-        </span>
-      </button>
+      ></button>
       <button
         type="button"
+        [praxisIconButton]="metadata?.hidden ? 'mso:visibility_off' : 'mso:visibility'"
+        size="dense"
+        [pressed]="metadata?.hidden === true"
         class="toolbar-btn"
-        [attr.aria-pressed]="metadata?.hidden ? 'true' : 'false'"
         aria-label="Alternar visibilidade"
         title="Alternar visibilidade"
         (click)="toggleHidden.emit()"
-      >
-        <span class="material-symbols-outlined">
-          {{ metadata?.hidden ? 'visibility_off' : 'visibility' }}
-        </span>
-      </button>
+      ></button>
       <button
         type="button"
+        [praxisIconButton]="metadata?.disabled ? 'mso:toggle_on' : 'mso:toggle_off'"
+        size="dense"
+        [pressed]="metadata?.disabled === true"
         class="toolbar-btn"
-        [attr.aria-pressed]="metadata?.disabled ? 'true' : 'false'"
         aria-label="Alternar desabilitado"
         title="Alternar desabilitado"
         (click)="toggleDisabled.emit()"
-      >
-        <span class="material-symbols-outlined">
-          {{ metadata?.disabled ? 'toggle_on' : 'toggle_off' }}
-        </span>
-      </button>
+      ></button>
       <button
         type="button"
+        [praxisIconButton]="'mso:tune'"
+        size="dense"
+        appearance="filled"
         class="toolbar-btn toolbar-btn--accent"
         aria-label="Configurar campo"
         title="Configurar campo"
         (click)="openEditor.emit()"
-      >
-        <span class="material-symbols-outlined">tune</span>
-      </button>
+      ></button>
       <button
         type="button"
+        [praxisIconButton]="'mso:close'"
+        size="dense"
         class="toolbar-btn toolbar-btn--ghost"
         aria-label="Fechar"
         title="Fechar"
         (click)="requestClose.emit()"
-      >
-        <span class="material-symbols-outlined">close</span>
-      </button>
+      ></button>
     </div>
-  `, styles: [":host{display:block;pointer-events:auto;font-family:inherit}.pdx-manual-field-toolbar{display:inline-flex;align-items:center;gap:6px;padding:6px;border-radius:12px;background:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level3);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.toolbar-btn{appearance:none;border:0;background:transparent;color:var(--md-sys-color-on-surface);display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:10px;cursor:pointer;transition:background-color .12s ease,transform .12s ease}.toolbar-btn:hover{background:var(--md-sys-color-primary-container)}.toolbar-btn:active{transform:scale(.97)}.toolbar-btn:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}.toolbar-btn--accent{background:var(--md-sys-color-primary-container)}.toolbar-btn--ghost{opacity:.7}.material-symbols-outlined{font-size:18px;line-height:18px}.toolbar-icon{font-variation-settings:\"FILL\" 0,\"wght\" 400,\"GRAD\" 0,\"opsz\" 20}.toolbar-icon--filled{font-variation-settings:\"FILL\" 1,\"wght\" 600,\"GRAD\" 0,\"opsz\" 20}\n"] }]
+  `, styles: [":host{display:block;pointer-events:auto;font-family:inherit}.pdx-manual-field-toolbar{display:inline-flex;align-items:center;gap:6px;padding:6px;border-radius:12px;background:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level3);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.toolbar-btn{color:var(--md-sys-color-on-surface)}.toolbar-btn--accent{--praxis-icon-button-filled-background: var(--md-sys-color-primary-container);--praxis-icon-button-filled-foreground: var(--md-sys-color-on-primary-container)}.toolbar-btn--ghost{opacity:.7}\n"] }]
         }], propDecorators: { metadata: [{
                 type: Input
             }], toggleRequired: [{
@@ -3359,6 +3359,7 @@ const MANUAL_FORM_EN_US = {
     'praxis.manualForm.editor.actions.customTitle': 'Custom actions',
     'praxis.manualForm.editor.actions.customHelp': 'Create extra buttons with their own event.',
     'praxis.manualForm.editor.actions.addCustom': 'Add action',
+    'praxis.manualForm.editor.actions.removeCustom': 'Remove action',
     'praxis.manualForm.editor.actions.emptyCustom': 'No custom actions registered.',
     'praxis.manualForm.editor.actions.field.visible': 'Visible',
     'praxis.manualForm.editor.actions.field.label': 'Label',
@@ -3446,10 +3447,11 @@ const MANUAL_FORM_EN_US = {
     'praxis.manualForm.editor.rules.apply': 'Apply rules',
     'praxis.manualForm.editor.rules.note': 'Persisted in config; execution depends on the host.',
     'praxis.manualForm.editor.rules.formRulesLabel': 'formRules (JSON)',
-    'praxis.manualForm.editor.rules.formRulesStateLabel': 'formRulesState (JSON)',
-    'praxis.manualForm.editor.rules.formRulesPlaceholder': '[{"id":"rule-1","name":"Required rule","targetType":"field","targets":["field"],"effect":{"condition":"{field} != null","properties":{"required":true}}}]',
+    'praxis.manualForm.editor.rules.formRulesStateLabel': 'Visual editor internal state (formRulesState - JSON)',
+    'praxis.manualForm.editor.rules.formRulesPlaceholder': '[{"id":"rule-1","name":"Required rule","targetType":"field","targets":["field"],"effect":{"condition":{"!==":[{"var":"field"},null]},"properties":{"required":true}}}]',
     'praxis.manualForm.editor.rules.tooltip': 'JSON array with rules (id, targetType, targets, effect).',
-    'praxis.manualForm.editor.rules.stateTooltip': 'Raw state from the visual editor (optional).',
+    'praxis.manualForm.editor.rules.stateTooltip': 'Read-only internal round-trip state for the visual editor; edit formRules instead.',
+    'praxis.manualForm.editor.rules.formRulesStateReadonlyHint': 'Generated by the visual editor for round-trip; edit formRules instead.',
     'praxis.manualForm.editor.cascade.title': 'Field dependencies',
     'praxis.manualForm.editor.cascade.help': 'Configure native cascades based on metadata.',
     'praxis.manualForm.editor.cascade.note': 'Changes update metadata and are saved in the draft.',
@@ -3497,6 +3499,7 @@ const MANUAL_FORM_PT_BR = {
     'praxis.manualForm.editor.actions.customTitle': 'Ações customizadas',
     'praxis.manualForm.editor.actions.customHelp': 'Crie botões extras com eventos próprios.',
     'praxis.manualForm.editor.actions.addCustom': 'Adicionar ação',
+    'praxis.manualForm.editor.actions.removeCustom': 'Remover ação',
     'praxis.manualForm.editor.actions.emptyCustom': 'Nenhuma ação customizada cadastrada.',
     'praxis.manualForm.editor.actions.field.visible': 'Visível',
     'praxis.manualForm.editor.actions.field.label': 'Rótulo (Label)',
@@ -3584,10 +3587,11 @@ const MANUAL_FORM_PT_BR = {
     'praxis.manualForm.editor.rules.apply': 'Aplicar regras',
     'praxis.manualForm.editor.rules.note': 'Persistido no config; a execução depende do host.',
     'praxis.manualForm.editor.rules.formRulesLabel': 'Regras do formulário (formRules - JSON)',
-    'praxis.manualForm.editor.rules.formRulesStateLabel': 'Estado das regras (formRulesState - JSON)',
-    'praxis.manualForm.editor.rules.formRulesPlaceholder': '[{"id":"rule-1","name":"Obrigatoriedade","targetType":"field","targets":["campo"],"effect":{"condition":"{campo} != null","properties":{"required":true}}}]',
+    'praxis.manualForm.editor.rules.formRulesStateLabel': 'Estado interno do editor visual (formRulesState - JSON)',
+    'praxis.manualForm.editor.rules.formRulesPlaceholder': '[{"id":"rule-1","name":"Obrigatoriedade","targetType":"field","targets":["campo"],"effect":{"condition":{"!==":[{"var":"campo"},null]},"properties":{"required":true}}}]',
     'praxis.manualForm.editor.rules.tooltip': 'Array JSON com regras (id, targetType, targets, effect).',
-    'praxis.manualForm.editor.rules.stateTooltip': 'Estado bruto do editor visual (opcional).',
+    'praxis.manualForm.editor.rules.stateTooltip': 'Estado interno somente leitura para round-trip do editor visual; edite formRules.',
+    'praxis.manualForm.editor.rules.formRulesStateReadonlyHint': 'Gerado pelo editor visual para round-trip; edite formRules.',
     'praxis.manualForm.editor.cascade.title': 'Dependências entre campos',
     'praxis.manualForm.editor.cascade.help': 'Configure cascatas nativas baseadas em metadados.',
     'praxis.manualForm.editor.cascade.note': 'As alterações atualizam metadados e são salvas no rascunho (draft).',
@@ -3687,7 +3691,7 @@ class ManualFormConfigEditorComponent {
         return this.tx('editor.hooks.tooltip', `JSON array of hooks for ${stage} (id, priority, timeoutMs, args).`).replace('{{stage}}', stage);
     }
     formRulesPlaceholder() {
-        return this.tx('editor.rules.formRulesPlaceholder', '[{"id":"rule-1","name":"Required rule","targetType":"field","targets":["field"],"effect":{"condition":"{field} != null","properties":{"required":true}}}]');
+        return this.tx('editor.rules.formRulesPlaceholder', '[{"id":"rule-1","name":"Required rule","targetType":"field","targets":["field"],"effect":{"condition":{"!==":[{"var":"field"},null]},"properties":{"required":true}}}]');
     }
     ngOnInit() {
         this.refresh();
@@ -4244,9 +4248,13 @@ class ManualFormConfigEditorComponent {
                     <div class="mf-custom-card">
                       <div class="mf-custom-card__header">
                         <div class="mf-custom-card__title">{{ action.label || action.id }}</div>
-                        <button mat-icon-button type="button" (click)="removeCustomAction(action)">
-                          <mat-icon>delete</mat-icon>
-                        </button>
+                        <button
+                          praxisIconButton="delete"
+                          size="dense"
+                          type="button"
+                          (click)="removeCustomAction(action)"
+                          [attr.aria-label]="tx('editor.actions.removeCustom', 'Remove action') + ': ' + (action.label || action.id)"
+                        ></button>
                       </div>
                       <div class="mf-custom-card__grid">
                         <mat-form-field appearance="outline">
@@ -4692,15 +4700,14 @@ class ManualFormConfigEditorComponent {
                   [placeholder]="hookPlaceholder()"
                 ></textarea>
                   <button
-                    mat-icon-button
+                    praxisIconButton="help_outline"
+                    size="dense"
                     matSuffix
-                    class="help-icon-button"
                     type="button"
                     [matTooltip]="hookTooltip(stage)"
+                    [attr.aria-label]="hookTooltip(stage)"
                     matTooltipPosition="above"
-                  >
-                    <mat-icon>help_outline</mat-icon>
-                  </button>
+                  ></button>
                   @if (hooksErrors[stage]) {
                     <mat-error>{{ hooksErrors[stage] }}</mat-error>
                   }
@@ -4736,15 +4743,14 @@ class ManualFormConfigEditorComponent {
                   [placeholder]="formRulesPlaceholder()"
                 ></textarea>
                 <button
-                  mat-icon-button
+                  praxisIconButton="help_outline"
+                  size="dense"
                   matSuffix
-                  class="help-icon-button"
                   type="button"
                   [matTooltip]="tx('editor.rules.tooltip', 'JSON array with rules (id, targetType, targets, effect).')"
+                  [attr.aria-label]="tx('editor.rules.tooltip', 'JSON array with rules (id, targetType, targets, effect).')"
                   matTooltipPosition="above"
-                >
-                  <mat-icon>help_outline</mat-icon>
-                </button>
+                ></button>
                 @if (formRulesError) {
                   <mat-error>{{ formRulesError }}</mat-error>
                 }
@@ -4755,19 +4761,21 @@ class ManualFormConfigEditorComponent {
                   matInput
                   rows="6"
                   [value]="formRulesStateText"
+                  readonly
+                  aria-readonly="true"
                   (input)="onRulesStateTextChange($any($event.target).value)"
                   placeholder='{"nodes":[],"edges":[]}'
                 ></textarea>
+                <mat-hint>{{ tx('editor.rules.formRulesStateReadonlyHint', 'Generated by the visual editor for round-trip; edit formRules instead.') }}</mat-hint>
                 <button
-                  mat-icon-button
+                  praxisIconButton="help_outline"
+                  size="dense"
                   matSuffix
-                  class="help-icon-button"
                   type="button"
                   [matTooltip]="tx('editor.rules.stateTooltip', 'Raw state from the visual editor (optional).')"
+                  [attr.aria-label]="tx('editor.rules.stateTooltip', 'Raw state from the visual editor (optional).')"
                   matTooltipPosition="above"
-                >
-                  <mat-icon>help_outline</mat-icon>
-                </button>
+                ></button>
                 @if (formRulesStateError) {
                   <mat-error>{{ formRulesStateError }}</mat-error>
                 }
@@ -4800,7 +4808,7 @@ class ManualFormConfigEditorComponent {
         </mat-tab>
       </mat-tab-group>
     </div>
-  `, isInline: true, styles: [".mf-editor{display:grid;gap:16px;padding:16px;color:var(--md-sys-color-on-surface)}.mf-editor__toolbar{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--md-sys-color-outline-variant);border-radius:12px;background:var(--md-sys-color-surface-container)}.mf-editor__title{display:flex;flex-direction:column;gap:2px;font-weight:600}.mf-editor__subtitle{font-weight:400;color:var(--md-sys-color-on-surface-variant)}.mf-editor__toolbar .spacer{flex:1}.mf-tabs{min-height:420px}.mf-tab{display:grid;gap:16px;padding:14px 6px 0}.mf-editor__list{display:grid;gap:8px;overflow-x:auto}.mf-editor__row{display:grid;grid-template-columns:2.2fr 2fr 1fr repeat(4,minmax(90px,.8fr));align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;background:var(--md-sys-color-surface);min-width:720px}.mf-editor__row--head{font-weight:600;color:var(--md-sys-color-on-surface);background:var(--md-sys-color-surface-container)}.mf-editor__filter{display:inline-flex;align-items:center;gap:8px;font-weight:500}.mf-editor__filter input{accent-color:var(--md-sys-color-primary)}.col code{display:inline-block;font-family:inherit;font-size:.85rem;padding:2px 8px;border-radius:6px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant)}.mf-btn{min-height:36px;padding:0 12px;border-radius:8px;border:1px solid var(--md-sys-color-outline);background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface);cursor:pointer;transition:background-color .18s ease,border-color .18s ease,color .18s ease}.mf-btn:hover{background:var(--md-sys-color-surface-container)}.mf-btn:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}.toggle{display:inline-flex;align-items:center;gap:6px;color:var(--md-sys-color-on-surface-variant)}.mf-section{display:grid;gap:12px;padding:16px;border-radius:12px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}.mf-section--full{padding:10px}.mf-section__header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.mf-section__header h3{margin:0;font-size:1.05rem;font-weight:600}.mf-help{margin:6px 0 0;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.mf-note{padding:10px 12px;border-radius:10px;border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface-variant);font-size:.9rem}.help-icon-button{--mdc-icon-button-state-layer-size: 28px;--mdc-icon-button-icon-size: 18px;width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center;margin-right:-4px}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.mat-mdc-form-field-icon-suffix{align-self:center}.mf-actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.mf-action-card,.mf-custom-card,.mf-custom-message-card{display:grid;gap:10px;padding:14px;border-radius:10px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-high)}.mf-action-card__title,.mf-custom-card__title{font-weight:600;color:var(--md-sys-color-on-surface)}.mf-actions-layout{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:center}.mf-toggle-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;align-items:start}.mf-hooks-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.mf-hook-field textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.85rem}.mf-actions-row{display:inline-flex;gap:8px;align-items:center}.mf-actions-row--end{justify-content:flex-end;width:100%}.mf-custom-actions,.mf-custom-messages{display:grid;gap:12px}.mf-custom-card__header{display:flex;align-items:center;justify-content:space-between;gap:8px}.mf-custom-card__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:center}.mf-messages-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.mf-empty{margin:0;color:var(--md-sys-color-on-surface-variant)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i7.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: CascadeManagerTabComponent, selector: "praxis-cascade-manager-tab", inputs: ["fields", "connections"], outputs: ["apply", "cancel"] }] });
+  `, isInline: true, styles: [".mf-editor{display:grid;gap:16px;padding:16px;color:var(--md-sys-color-on-surface)}.mf-editor__toolbar{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--md-sys-color-outline-variant);border-radius:12px;background:var(--md-sys-color-surface-container)}.mf-editor__title{display:flex;flex-direction:column;gap:2px;font-weight:600}.mf-editor__subtitle{font-weight:400;color:var(--md-sys-color-on-surface-variant)}.mf-editor__toolbar .spacer{flex:1}.mf-tabs{min-height:420px}.mf-tab{display:grid;gap:16px;padding:14px 6px 0}.mf-editor__list{display:grid;gap:8px;overflow-x:auto}.mf-editor__row{display:grid;grid-template-columns:2.2fr 2fr 1fr repeat(4,minmax(90px,.8fr));align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;background:var(--md-sys-color-surface);min-width:720px}.mf-editor__row--head{font-weight:600;color:var(--md-sys-color-on-surface);background:var(--md-sys-color-surface-container)}.mf-editor__filter{display:inline-flex;align-items:center;gap:8px;font-weight:500}.mf-editor__filter input{accent-color:var(--md-sys-color-primary)}.col code{display:inline-block;font-family:inherit;font-size:.85rem;padding:2px 8px;border-radius:6px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant)}.mf-btn{min-height:36px;padding:0 12px;border-radius:8px;border:1px solid var(--md-sys-color-outline);background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface);cursor:pointer;transition:background-color .18s ease,border-color .18s ease,color .18s ease}.mf-btn:hover{background:var(--md-sys-color-surface-container)}.mf-btn:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}.toggle{display:inline-flex;align-items:center;gap:6px;color:var(--md-sys-color-on-surface-variant)}.mf-section{display:grid;gap:12px;padding:16px;border-radius:12px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}.mf-section--full{padding:10px}.mf-section__header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.mf-section__header h3{margin:0;font-size:1.05rem;font-weight:600}.mf-help{margin:6px 0 0;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.mf-note{padding:10px 12px;border-radius:10px;border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface-variant);font-size:.9rem}.mf-actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.mf-action-card,.mf-custom-card,.mf-custom-message-card{display:grid;gap:10px;padding:14px;border-radius:10px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-high)}.mf-action-card__title,.mf-custom-card__title{font-weight:600;color:var(--md-sys-color-on-surface)}.mf-actions-layout{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:center}.mf-toggle-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;align-items:start}.mf-hooks-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.mf-hook-field textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.85rem}.mf-actions-row{display:inline-flex;gap:8px;align-items:center}.mf-actions-row--end{justify-content:flex-end;width:100%}.mf-custom-actions,.mf-custom-messages{display:grid;gap:12px}.mf-custom-card__header{display:flex;align-items:center;justify-content:space-between;gap:8px}.mf-custom-card__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:center}.mf-messages-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.mf-empty{margin:0;color:var(--md-sys-color-on-surface-variant)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i7.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: PraxisIconButtonComponent, selector: "button[praxisIconButton]", inputs: ["praxisIconButton", "size", "appearance", "presentation", "pressed", "busy"] }, { kind: "component", type: CascadeManagerTabComponent, selector: "praxis-cascade-manager-tab", inputs: ["fields", "connections"], outputs: ["apply", "cancel"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ManualFormConfigEditorComponent, decorators: [{
             type: Component,
@@ -4814,6 +4822,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                         MatButtonModule,
                         MatIconModule,
                         MatTooltipModule,
+                        PraxisIconButtonComponent,
                         CascadeManagerTabComponent
                     ], providers: [providePraxisManualFormI18n()], template: `
     <div class="mf-editor">
@@ -5038,9 +5047,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                     <div class="mf-custom-card">
                       <div class="mf-custom-card__header">
                         <div class="mf-custom-card__title">{{ action.label || action.id }}</div>
-                        <button mat-icon-button type="button" (click)="removeCustomAction(action)">
-                          <mat-icon>delete</mat-icon>
-                        </button>
+                        <button
+                          praxisIconButton="delete"
+                          size="dense"
+                          type="button"
+                          (click)="removeCustomAction(action)"
+                          [attr.aria-label]="tx('editor.actions.removeCustom', 'Remove action') + ': ' + (action.label || action.id)"
+                        ></button>
                       </div>
                       <div class="mf-custom-card__grid">
                         <mat-form-field appearance="outline">
@@ -5486,15 +5499,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                   [placeholder]="hookPlaceholder()"
                 ></textarea>
                   <button
-                    mat-icon-button
+                    praxisIconButton="help_outline"
+                    size="dense"
                     matSuffix
-                    class="help-icon-button"
                     type="button"
                     [matTooltip]="hookTooltip(stage)"
+                    [attr.aria-label]="hookTooltip(stage)"
                     matTooltipPosition="above"
-                  >
-                    <mat-icon>help_outline</mat-icon>
-                  </button>
+                  ></button>
                   @if (hooksErrors[stage]) {
                     <mat-error>{{ hooksErrors[stage] }}</mat-error>
                   }
@@ -5530,15 +5542,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                   [placeholder]="formRulesPlaceholder()"
                 ></textarea>
                 <button
-                  mat-icon-button
+                  praxisIconButton="help_outline"
+                  size="dense"
                   matSuffix
-                  class="help-icon-button"
                   type="button"
                   [matTooltip]="tx('editor.rules.tooltip', 'JSON array with rules (id, targetType, targets, effect).')"
+                  [attr.aria-label]="tx('editor.rules.tooltip', 'JSON array with rules (id, targetType, targets, effect).')"
                   matTooltipPosition="above"
-                >
-                  <mat-icon>help_outline</mat-icon>
-                </button>
+                ></button>
                 @if (formRulesError) {
                   <mat-error>{{ formRulesError }}</mat-error>
                 }
@@ -5549,19 +5560,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                   matInput
                   rows="6"
                   [value]="formRulesStateText"
+                  readonly
+                  aria-readonly="true"
                   (input)="onRulesStateTextChange($any($event.target).value)"
                   placeholder='{"nodes":[],"edges":[]}'
                 ></textarea>
+                <mat-hint>{{ tx('editor.rules.formRulesStateReadonlyHint', 'Generated by the visual editor for round-trip; edit formRules instead.') }}</mat-hint>
                 <button
-                  mat-icon-button
+                  praxisIconButton="help_outline"
+                  size="dense"
                   matSuffix
-                  class="help-icon-button"
                   type="button"
                   [matTooltip]="tx('editor.rules.stateTooltip', 'Raw state from the visual editor (optional).')"
+                  [attr.aria-label]="tx('editor.rules.stateTooltip', 'Raw state from the visual editor (optional).')"
                   matTooltipPosition="above"
-                >
-                  <mat-icon>help_outline</mat-icon>
-                </button>
+                ></button>
                 @if (formRulesStateError) {
                   <mat-error>{{ formRulesStateError }}</mat-error>
                 }
@@ -5594,7 +5607,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
         </mat-tab>
       </mat-tab-group>
     </div>
-  `, styles: [".mf-editor{display:grid;gap:16px;padding:16px;color:var(--md-sys-color-on-surface)}.mf-editor__toolbar{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--md-sys-color-outline-variant);border-radius:12px;background:var(--md-sys-color-surface-container)}.mf-editor__title{display:flex;flex-direction:column;gap:2px;font-weight:600}.mf-editor__subtitle{font-weight:400;color:var(--md-sys-color-on-surface-variant)}.mf-editor__toolbar .spacer{flex:1}.mf-tabs{min-height:420px}.mf-tab{display:grid;gap:16px;padding:14px 6px 0}.mf-editor__list{display:grid;gap:8px;overflow-x:auto}.mf-editor__row{display:grid;grid-template-columns:2.2fr 2fr 1fr repeat(4,minmax(90px,.8fr));align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;background:var(--md-sys-color-surface);min-width:720px}.mf-editor__row--head{font-weight:600;color:var(--md-sys-color-on-surface);background:var(--md-sys-color-surface-container)}.mf-editor__filter{display:inline-flex;align-items:center;gap:8px;font-weight:500}.mf-editor__filter input{accent-color:var(--md-sys-color-primary)}.col code{display:inline-block;font-family:inherit;font-size:.85rem;padding:2px 8px;border-radius:6px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant)}.mf-btn{min-height:36px;padding:0 12px;border-radius:8px;border:1px solid var(--md-sys-color-outline);background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface);cursor:pointer;transition:background-color .18s ease,border-color .18s ease,color .18s ease}.mf-btn:hover{background:var(--md-sys-color-surface-container)}.mf-btn:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}.toggle{display:inline-flex;align-items:center;gap:6px;color:var(--md-sys-color-on-surface-variant)}.mf-section{display:grid;gap:12px;padding:16px;border-radius:12px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}.mf-section--full{padding:10px}.mf-section__header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.mf-section__header h3{margin:0;font-size:1.05rem;font-weight:600}.mf-help{margin:6px 0 0;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.mf-note{padding:10px 12px;border-radius:10px;border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface-variant);font-size:.9rem}.help-icon-button{--mdc-icon-button-state-layer-size: 28px;--mdc-icon-button-icon-size: 18px;width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center;margin-right:-4px}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.mat-mdc-form-field-icon-suffix{align-self:center}.mf-actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.mf-action-card,.mf-custom-card,.mf-custom-message-card{display:grid;gap:10px;padding:14px;border-radius:10px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-high)}.mf-action-card__title,.mf-custom-card__title{font-weight:600;color:var(--md-sys-color-on-surface)}.mf-actions-layout{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:center}.mf-toggle-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;align-items:start}.mf-hooks-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.mf-hook-field textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.85rem}.mf-actions-row{display:inline-flex;gap:8px;align-items:center}.mf-actions-row--end{justify-content:flex-end;width:100%}.mf-custom-actions,.mf-custom-messages{display:grid;gap:12px}.mf-custom-card__header{display:flex;align-items:center;justify-content:space-between;gap:8px}.mf-custom-card__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:center}.mf-messages-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.mf-empty{margin:0;color:var(--md-sys-color-on-surface-variant)}\n"] }]
+  `, styles: [".mf-editor{display:grid;gap:16px;padding:16px;color:var(--md-sys-color-on-surface)}.mf-editor__toolbar{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--md-sys-color-outline-variant);border-radius:12px;background:var(--md-sys-color-surface-container)}.mf-editor__title{display:flex;flex-direction:column;gap:2px;font-weight:600}.mf-editor__subtitle{font-weight:400;color:var(--md-sys-color-on-surface-variant)}.mf-editor__toolbar .spacer{flex:1}.mf-tabs{min-height:420px}.mf-tab{display:grid;gap:16px;padding:14px 6px 0}.mf-editor__list{display:grid;gap:8px;overflow-x:auto}.mf-editor__row{display:grid;grid-template-columns:2.2fr 2fr 1fr repeat(4,minmax(90px,.8fr));align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;background:var(--md-sys-color-surface);min-width:720px}.mf-editor__row--head{font-weight:600;color:var(--md-sys-color-on-surface);background:var(--md-sys-color-surface-container)}.mf-editor__filter{display:inline-flex;align-items:center;gap:8px;font-weight:500}.mf-editor__filter input{accent-color:var(--md-sys-color-primary)}.col code{display:inline-block;font-family:inherit;font-size:.85rem;padding:2px 8px;border-radius:6px;background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant)}.mf-btn{min-height:36px;padding:0 12px;border-radius:8px;border:1px solid var(--md-sys-color-outline);background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface);cursor:pointer;transition:background-color .18s ease,border-color .18s ease,color .18s ease}.mf-btn:hover{background:var(--md-sys-color-surface-container)}.mf-btn:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}.toggle{display:inline-flex;align-items:center;gap:6px;color:var(--md-sys-color-on-surface-variant)}.mf-section{display:grid;gap:12px;padding:16px;border-radius:12px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}.mf-section--full{padding:10px}.mf-section__header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.mf-section__header h3{margin:0;font-size:1.05rem;font-weight:600}.mf-help{margin:6px 0 0;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.mf-note{padding:10px 12px;border-radius:10px;border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface-variant);font-size:.9rem}.mf-actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.mf-action-card,.mf-custom-card,.mf-custom-message-card{display:grid;gap:10px;padding:14px;border-radius:10px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-high)}.mf-action-card__title,.mf-custom-card__title{font-weight:600;color:var(--md-sys-color-on-surface)}.mf-actions-layout{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:center}.mf-toggle-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;align-items:start}.mf-hooks-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.mf-hook-field textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.85rem}.mf-actions-row{display:inline-flex;gap:8px;align-items:center}.mf-actions-row--end{justify-content:flex-end;width:100%}.mf-custom-actions,.mf-custom-messages{display:grid;gap:12px}.mf-custom-card__header{display:flex;align-items:center;justify-content:space-between;gap:8px}.mf-custom-card__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:center}.mf-messages-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.mf-empty{margin:0;color:var(--md-sys-color-on-surface-variant)}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [SETTINGS_PANEL_DATA]
@@ -6412,6 +6425,28 @@ const PRAXIS_MANUAL_FORM_AUTHORING_MANIFEST = {
     ],
 };
 
+/** Metadata for Praxis Manual Form component */
+const PRAXIS_MANUAL_FORM_COMPONENT_METADATA = {
+    id: 'praxis-manual-form',
+    selector: 'praxis-manual-form',
+    component: ManualFormComponent,
+    friendlyName: 'Praxis Manual Form',
+    description: 'Form builder with manual field selection and layout controls.',
+    tags: ['widget', 'form', 'configurable'],
+    lib: '@praxisui/manual-form',
+};
+/** Provider para auto-registrar metadados do componente Manual Form. */
+function providePraxisManualFormMetadata() {
+    return {
+        provide: ENVIRONMENT_INITIALIZER,
+        multi: true,
+        useFactory: (registry) => () => {
+            registry.register(PRAXIS_MANUAL_FORM_COMPONENT_METADATA);
+        },
+        deps: [ComponentMetadataRegistry],
+    };
+}
+
 /*
  * Public API Surface of praxis-manual-form
  */
@@ -6420,4 +6455,4 @@ const PRAXIS_MANUAL_FORM_AUTHORING_MANIFEST = {
  * Generated bundle index. Do not edit.
  */
 
-export { MANUAL_FORM_AI_CAPABILITIES, MANUAL_FORM_CONSTRUCTOR_TO_CONTROL_TYPE, MANUAL_FORM_SELECTOR_TO_CONTROL_TYPE, ManualFieldDirective, ManualFieldEditorOnDblclickDirective, ManualFieldKeyService, ManualFieldMetadataBridgeService, ManualFormActionsComponent, ManualFormComponent, ManualFormConfigEditorComponent, ManualFormDocExampleComponent, ManualFormDocExampleShowcaseComponent, ManualFormHeaderComponent, ManualFormInstance, ManualFormInstanceFactory, PRAXIS_MANUAL_FORM_AUTHORING_MANIFEST, createManualFormSeed, toFieldMetadataMap };
+export { MANUAL_FORM_AI_CAPABILITIES, MANUAL_FORM_CONSTRUCTOR_TO_CONTROL_TYPE, MANUAL_FORM_SELECTOR_TO_CONTROL_TYPE, ManualFieldDirective, ManualFieldEditorOnDblclickDirective, ManualFieldKeyService, ManualFieldMetadataBridgeService, ManualFormActionsComponent, ManualFormComponent, ManualFormConfigEditorComponent, ManualFormDocExampleComponent, ManualFormDocExampleShowcaseComponent, ManualFormHeaderComponent, ManualFormInstance, ManualFormInstanceFactory, PRAXIS_MANUAL_FORM_AUTHORING_MANIFEST, PRAXIS_MANUAL_FORM_COMPONENT_METADATA, createManualFormSeed, providePraxisManualFormMetadata, toFieldMetadataMap };