npm - @praxisui/metadata-editor - Versions diffs - 8.0.0-beta.9 → 8.0.0-beta.91 - Mend

@praxisui/metadata-editor 8.0.0-beta.9 → 8.0.0-beta.91

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.

Files changed (4) hide show

package/README.md +35 -0
package/fesm2022/praxisui-metadata-editor.mjs +2727 -660
package/package.json +15 -6
package/{index.d.ts → types/praxisui-metadata-editor.d.ts} +14 -2

package/fesm2022/praxisui-metadata-editor.mjs CHANGED Viewed

@@ -1,19 +1,19 @@
 import * as i0 from '@angular/core';
 import { Injectable, inject, Component, Input, ViewEncapsulation, EventEmitter, DestroyRef, Output, signal, ENVIRONMENT_INITIALIZER } from '@angular/core';
-import * as i3 from '@angular/forms';
-import { FormControl, FormGroup, ReactiveFormsModule, FormsModule } from '@angular/forms';
-import * as i3$1 from '@angular/common';
+import * as i1 from '@angular/forms';
+import { FormControl, FormGroup, ReactiveFormsModule, FormArray, FormBuilder, FormsModule } from '@angular/forms';
+import * as i3 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { DynamicFieldLoaderDirective } from '@praxisui/dynamic-fields';
 import * as i2$1 from '@praxisui/core';
-import { FieldControlType, PraxisIconDirective, INLINE_FILTER_CONTROL_TYPES, resolveInlineFilterControlType, normalizeControlTypeToken, ComponentMetadataRegistry } from '@praxisui/core';
+import { FieldControlType, PraxisIconDirective, providePraxisI18n, PraxisI18nService, INLINE_FILTER_CONTROL_TYPES, resolveInlineFilterControlType, normalizeControlTypeToken, ComponentMetadataRegistry } from '@praxisui/core';
 import * as i5 from '@angular/material/expansion';
 import { MatExpansionModule } from '@angular/material/expansion';
 import * as i6 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
-import * as i5$1 from '@angular/material/button';
+import * as i4 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
-import * as i1 from '@angular/material/dialog';
+import * as i1$1 from '@angular/material/dialog';
 import { MatDialogRef, MatDialogModule } from '@angular/material/dialog';
 import * as i8 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
@@ -22,19 +22,19 @@ import { MatListModule } from '@angular/material/list';
 import { SETTINGS_PANEL_DATA } from '@praxisui/settings-panel';
 import { BehaviorSubject } from 'rxjs';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
-import * as i7 from '@angular/material/input';
+import * as i6$1 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
 import { MatChipsModule } from '@angular/material/chips';
 import { MatDividerModule } from '@angular/material/divider';
-import * as i8$1 from '@angular/material/select';
+import * as i7 from '@angular/material/select';
 import { MatSelectModule } from '@angular/material/select';
-import * as i9 from '@angular/material/checkbox';
+import * as i8$1 from '@angular/material/checkbox';
 import { MatCheckboxModule } from '@angular/material/checkbox';
-import * as i11 from '@angular/material/menu';
+import * as i10 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
-import * as i12 from '@angular/material/autocomplete';
+import * as i11 from '@angular/material/autocomplete';
 import { MatAutocompleteModule } from '@angular/material/autocomplete';
-import * as i13 from '@angular/cdk/scrolling';
+import * as i12 from '@angular/cdk/scrolling';
 import { ScrollingModule } from '@angular/cdk/scrolling';
 class ConfigRegistryService {
@@ -51,10 +51,10 @@ class ConfigRegistryService {
             count: props.length,
         }));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: ConfigRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: ConfigRegistryService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ConfigRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ConfigRegistryService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: ConfigRegistryService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ConfigRegistryService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -69,10 +69,10 @@ class ContextValidatorRegistryService {
     get(controlType) {
         return this.map.get(controlType) ?? [];
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: ContextValidatorRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: ContextValidatorRegistryService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ContextValidatorRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ContextValidatorRegistryService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: ContextValidatorRegistryService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ContextValidatorRegistryService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -182,10 +182,10 @@ class SchemaNormalizerService {
     getByPath(obj, path) {
         return path.split('.').reduce((acc, key) => (acc == null ? acc : acc[key]), obj);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SchemaNormalizerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SchemaNormalizerService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: SchemaNormalizerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: SchemaNormalizerService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SchemaNormalizerService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: SchemaNormalizerService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -276,13 +276,13 @@ class DynamicFormFactoryService {
         }
         return result;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: DynamicFormFactoryService, deps: [{ token: i3.FormBuilder }, { token: ContextValidatorRegistryService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: DynamicFormFactoryService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DynamicFormFactoryService, deps: [{ token: i1.FormBuilder }, { token: ContextValidatorRegistryService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DynamicFormFactoryService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: DynamicFormFactoryService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DynamicFormFactoryService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i3.FormBuilder }, { type: ContextValidatorRegistryService }] });
+        }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: ContextValidatorRegistryService }] });
 class EditorComponentRegistryService {
     registry = new Map();
@@ -305,10 +305,10 @@ class EditorComponentRegistryService {
     isRegistered(editorType) {
         return this.registry.has(editorType);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: EditorComponentRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: EditorComponentRegistryService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EditorComponentRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EditorComponentRegistryService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: EditorComponentRegistryService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EditorComponentRegistryService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -349,8 +349,8 @@ class RegexHelpDialogComponent {
     choose(pattern) {
         this.dialogRef.close(pattern);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: RegexHelpDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: RegexHelpDialogComponent, isStandalone: true, selector: "praxis-regex-help-dialog", ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: RegexHelpDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: RegexHelpDialogComponent, isStandalone: true, selector: "praxis-regex-help-dialog", ngImport: i0, template: `
     <h2 mat-dialog-title>Modelos de Expressões Regulares</h2>
     <div mat-dialog-content>
       <p>Selecione um dos modelos abaixo para preencher o campo ou use como base:</p>
@@ -371,14 +371,14 @@ class RegexHelpDialogComponent {
     <div mat-dialog-actions>
       <button class="mat-mdc-button mdc-button" mat-dialog-close>Fechar</button>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i2.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2.MatListItemLine, selector: "[matListItemLine]" }, { kind: "directive", type: i2.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "ngmodule", type: MatButtonModule }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i2.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2.MatListItemLine, selector: "[matListItemLine]" }, { kind: "directive", type: i2.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "ngmodule", type: MatButtonModule }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: RegexHelpDialogComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: RegexHelpDialogComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'praxis-regex-help-dialog',
                     standalone: true,
-                    imports: [CommonModule, MatDialogModule, MatListModule, MatButtonModule],
+                    imports: [MatDialogModule, MatListModule, MatButtonModule],
                     template: `
     <h2 mat-dialog-title>Modelos de Expressões Regulares</h2>
     <div mat-dialog-content>
@@ -530,6 +530,7 @@ class DynamicEditorRendererComponent {
         const order = [
             'geral',
             'apresent',
+            'display',
             'valida',
             'formato',
             'comport',
@@ -594,7 +595,7 @@ class DynamicEditorRendererComponent {
             .replace(/[ñ]/g, 'n');
         if (normalized.includes('geral'))
             return 'widgets';
-        if (normalized.includes('apresent'))
+        if (normalized.includes('apresent') || normalized.includes('display'))
             return 'slideshow';
         if (normalized.includes('dados') || normalized.includes('opcoes'))
             return 'list_alt';
@@ -683,79 +684,87 @@ class DynamicEditorRendererComponent {
             this.form?.markAsDirty();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: DynamicEditorRendererComponent, deps: [{ token: i1.MatDialog }, { token: i2$1.IconPickerService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: DynamicEditorRendererComponent, isStandalone: true, selector: "praxis-dynamic-editor-renderer", inputs: { properties: "properties", form: "form" }, usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DynamicEditorRendererComponent, deps: [{ token: i1$1.MatDialog }, { token: i2$1.IconPickerService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: DynamicEditorRendererComponent, isStandalone: true, selector: "praxis-dynamic-editor-renderer", inputs: { properties: "properties", form: "form" }, usesOnChanges: true, ngImport: i0, template: `
     <ng-template #item let-field="field" let-index="index" let-content="content">
       <div class="editor-item" [attr.data-control-type]="field.controlType">
         <ng-container [ngTemplateOutlet]="content"></ng-container>
         <div class="actions-container">
           <!-- Botão de ajuda para regex -->
-          <button
-            *ngIf="field.name === 'pattern'"
-            type="button"
-            mat-icon-button
-            class="regex-help-btn decorator-btn"
-            (click)="openRegexHelp()"
-            aria-label="Exemplos de regex"
-            matTooltip="Exemplos de regex"
-          >
-            <mat-icon [praxisIcon]="'search'"></mat-icon>
-          </button>
+          @if (field.name === 'pattern') {
+            <button
+              type="button"
+              mat-icon-button
+              class="regex-help-btn decorator-btn"
+              (click)="openRegexHelp()"
+              aria-label="Exemplos de regex"
+              matTooltip="Exemplos de regex"
+              >
+              <mat-icon [praxisIcon]="'search'"></mat-icon>
+            </button>
+          }
           <!-- Botão para escolher ícone (prefix/suffix) -->
-          <button
-            *ngIf="isIconField(field.name)"
-            type="button"
-            mat-icon-button
-            class="icon-picker-btn decorator-btn"
-            (click)="openIconPicker(field.name)"
-            aria-label="Escolher ícone"
-            matTooltip="Escolher ícone"
-          >
-            <mat-icon [praxisIcon]="'apps'"></mat-icon>
-          </button>
+          @if (isIconField(field.name)) {
+            <button
+              type="button"
+              mat-icon-button
+              class="icon-picker-btn decorator-btn"
+              (click)="openIconPicker(field.name)"
+              aria-label="Escolher ícone"
+              matTooltip="Escolher ícone"
+              >
+              <mat-icon [praxisIcon]="'apps'"></mat-icon>
+            </button>
+          }
           <!-- Botão de ajuda (fallback quando suffix não é aplicado) -->
-          <button
-            *ngIf="field.hint && !useHelpSuffix(field)"
-            type="button"
-            mat-icon-button
-            class="hint-btn decorator-btn"
-            [class.has-icon-picker]="isIconField(field.name)"
-            [matTooltip]="field.hint"
-            aria-label="Ajuda"
-          >
-            <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
-          </button>
+          @if (field.hint && !useHelpSuffix(field)) {
+            <button
+              type="button"
+              mat-icon-button
+              class="hint-btn decorator-btn"
+              [class.has-icon-picker]="isIconField(field.name)"
+              [matTooltip]="field.hint"
+              aria-label="Ajuda"
+              >
+              <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
+            </button>
+          }
         </div>
       </div>
     </ng-template>
     <div class="editor-surface">
       <mat-accordion class="section-accordion" multi>
-        <mat-expansion-panel class="section-card" *ngFor="let g of groupOrder">
-          <mat-expansion-panel-header class="section-header">
-            <mat-panel-title>
-              <span class="section-title">
-                <mat-icon class="section-icon" [praxisIcon]="groupIcon(g)"></mat-icon>
-                {{ g }}
-              </span>
-            </mat-panel-title>
-          </mat-expansion-panel-header>
-          <div *ngFor="let row of groupRows[g]" class="editor-row" [ngClass]="rowClass(row)">
-            <ng-container *ngIf="ready"
-              dynamicFieldLoader
-              [fields]="row"
-              [formGroup]="form"
-              [itemTemplate]="item">
-            </ng-container>
-          </div>
-        </mat-expansion-panel>
+        @for (g of groupOrder; track g) {
+          <mat-expansion-panel class="section-card">
+            <mat-expansion-panel-header class="section-header">
+              <mat-panel-title>
+                <span class="section-title">
+                  <mat-icon class="section-icon" [praxisIcon]="groupIcon(g)"></mat-icon>
+                  {{ g }}
+                </span>
+              </mat-panel-title>
+            </mat-expansion-panel-header>
+            @for (row of groupRows[g]; track row) {
+              <div class="editor-row" [ngClass]="rowClass(row)">
+                @if (ready) {
+                  <ng-container
+                    dynamicFieldLoader
+                    [fields]="row"
+                    [formGroup]="form"
+                    [itemTemplate]="item">
+                  </ng-container>
+                }
+              </div>
+            }
+          </mat-expansion-panel>
+        }
       </mat-accordion>
     </div>
-  `, isInline: true, styles: [":host{display:block}.editor-surface{padding:8px 0 2px;border-radius:12px;background:transparent}.section-accordion{display:block}.section-card{margin:6px 0 8px;border-radius:12px;border:1px solid var(--md-sys-color-outline-variant);overflow:hidden}.section-card.mat-expanded{border-color:var(--md-sys-color-primary);box-shadow:0 2px 10px #0000000d}.section-card .mat-expansion-panel-body{background:var(--md-sys-color-surface-container-low)}.section-header{background:var(--md-sys-color-surface-container-low);border-bottom:1px solid var(--md-sys-color-outline-variant, var(--sicoob-stroke-medium));padding:2px 8px;min-height:32px;display:flex;align-items:center;color:var(--md-sys-color-on-surface)}.section-header .mat-expansion-panel-header-title,.section-header .mat-expansion-panel-header-description{display:flex;align-items:center;color:var(--md-sys-color-on-surface)}.section-title{display:inline-flex;align-items:center;gap:6px;font-weight:600;letter-spacing:.2px;color:var(--md-sys-color-on-surface);font-size:.9rem;line-height:1.2}.section-icon{color:var(--md-sys-color-primary, var(--md-sys-color-primary, #3f51b5));opacity:.9}.editor-row{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:8px}.editor-row>praxis-field-shell{flex:1 1 100%;min-width:280px}.editor-row praxis-field-shell .mat-mdc-form-field{width:100%;margin-bottom:8px}.editor-row.row-inline>praxis-field-shell{flex:0 0 auto}.editor-row.row-2>praxis-field-shell{flex:1 1 calc(50% - 12px);min-width:260px}.editor-row.row-3>praxis-field-shell{flex:1 1 calc(33.333% - 12px);min-width:220px}.editor-row>praxis-field-shell[data-field-name=controlType],.editor-row>praxis-field-shell[data-field-name=label],.editor-row>praxis-field-shell[data-field-name=placeholder]{flex:1 1 calc(50% - 12px);min-width:300px}praxis-field-shell[data-field-name=label] .mdc-floating-label,praxis-field-shell[data-field-name=placeholder] .mdc-floating-label{font-weight:600}.editor-row>praxis-field-shell[data-field-name=prefix],.editor-row>praxis-field-shell[data-field-name=suffix]{flex:0 0 200px;min-width:160px}.editor-row>praxis-field-shell[data-field-name=prefixIcon],.editor-row>praxis-field-shell[data-field-name=suffixIcon],.editor-row>praxis-field-shell[data-field-name=prefixIconColor],.editor-row>praxis-field-shell[data-field-name=suffixIconColor]{flex:1 1 auto;min-width:160px}.editor-item{display:flex;align-items:flex-start;gap:4px}.editor-item>ng-container,.editor-item>praxis-field-shell{flex:1;min-width:0}.actions-container{display:flex;align-items:center;gap:0;margin-top:12px;flex-shrink:0}.decorator-btn{position:static;color:var(--md-sys-color-primary, #3f51b5);opacity:.6;transform:scale(.8);width:32px;height:32px;line-height:32px;padding:0}.decorator-btn:hover{opacity:1}.icon-picker-btn,.hint-btn,.hint-btn.has-icon-picker{right:auto}.editor-row .mat-mdc-form-field-subscript-wrapper mat-hint{display:none!important}.editor-row .mat-mdc-form-field-subscript-wrapper mat-error{display:block!important}praxis-field-shell[data-field-name=showCharCount] .mdc-switch{transform:scale(1.05)}praxis-field-shell[data-field-name=showCharCount] .mat-mdc-slide-toggle{font-weight:600}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-hint{display:flex;align-items:center;gap:8px;background:var(--md-sys-color-tertiary-container);border:1px solid var(--md-sys-color-tertiary);color:var(--md-sys-color-on-tertiary-container);padding:8px 10px;border-radius:6px;line-height:1.3;white-space:normal}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-hint:before{content:\"\\26a0\\fe0f\";display:inline-block}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-subscript-wrapper{margin-top:6px;margin-bottom:10px;min-height:auto}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field{margin-bottom:16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: DynamicFieldLoaderDirective, selector: "[dynamicFieldLoader]", inputs: ["fields", "formGroup", "enableExternalControlBinding", "itemTemplate", "debugTrace", "debugTraceLabel", "readonlyMode", "disabledMode", "presentationMode", "visible", "canvasMode"], outputs: ["componentsCreated", "fieldCreated", "fieldDestroyed", "renderError", "canvasMouseEnter", "canvasMouseLeave", "canvasClick"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i5.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i5.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i5.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i5.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5$1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }], encapsulation: i0.ViewEncapsulation.None });
+    `, isInline: true, styles: [":host{display:block}.editor-surface{padding:8px 0 2px;border-radius:12px;background:transparent}.section-accordion{display:block}.section-card{margin:6px 0 8px;border-radius:12px;border:1px solid var(--md-sys-color-outline-variant);overflow:hidden}.section-card.mat-expanded{border-color:var(--md-sys-color-primary);box-shadow:0 2px 10px #0000000d}.section-card .mat-expansion-panel-body{background:var(--md-sys-color-surface-container-low)}.section-header{background:var(--md-sys-color-surface-container-low);border-bottom:1px solid var(--md-sys-color-outline-variant, var(--sicoob-stroke-medium));padding:2px 8px;min-height:32px;display:flex;align-items:center;color:var(--md-sys-color-on-surface)}.section-header .mat-expansion-panel-header-title,.section-header .mat-expansion-panel-header-description{display:flex;align-items:center;color:var(--md-sys-color-on-surface)}.section-title{display:inline-flex;align-items:center;gap:6px;font-weight:600;letter-spacing:.2px;color:var(--md-sys-color-on-surface);font-size:.9rem;line-height:1.2}.section-icon{color:var(--md-sys-color-primary, var(--md-sys-color-primary, #3f51b5));opacity:.9}.editor-row{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:8px}.editor-row>praxis-field-shell{flex:1 1 100%;min-width:280px}.editor-row praxis-field-shell .mat-mdc-form-field{width:100%;margin-bottom:8px}.editor-row.row-inline>praxis-field-shell{flex:0 0 auto}.editor-row.row-2>praxis-field-shell{flex:1 1 calc(50% - 12px);min-width:260px}.editor-row.row-3>praxis-field-shell{flex:1 1 calc(33.333% - 12px);min-width:220px}.editor-row>praxis-field-shell[data-field-name=controlType],.editor-row>praxis-field-shell[data-field-name=label],.editor-row>praxis-field-shell[data-field-name=placeholder]{flex:1 1 calc(50% - 12px);min-width:300px}praxis-field-shell[data-field-name=label] .mdc-floating-label,praxis-field-shell[data-field-name=placeholder] .mdc-floating-label{font-weight:600}.editor-row>praxis-field-shell[data-field-name=prefix],.editor-row>praxis-field-shell[data-field-name=suffix]{flex:0 0 200px;min-width:160px}.editor-row>praxis-field-shell[data-field-name=prefixIcon],.editor-row>praxis-field-shell[data-field-name=suffixIcon],.editor-row>praxis-field-shell[data-field-name=prefixIconColor],.editor-row>praxis-field-shell[data-field-name=suffixIconColor]{flex:1 1 auto;min-width:160px}.editor-item{display:flex;align-items:flex-start;gap:4px}.editor-item>ng-container,.editor-item>praxis-field-shell{flex:1;min-width:0}.actions-container{display:flex;align-items:center;gap:0;margin-top:12px;flex-shrink:0}.decorator-btn{position:static;color:var(--md-sys-color-primary, #3f51b5);opacity:.6;transform:scale(.8);width:32px;height:32px;line-height:32px;padding:0}.decorator-btn:hover{opacity:1}.icon-picker-btn,.hint-btn,.hint-btn.has-icon-picker{right:auto}.editor-row .mat-mdc-form-field-subscript-wrapper mat-hint{display:none!important}.editor-row .mat-mdc-form-field-subscript-wrapper mat-error{display:block!important}praxis-field-shell[data-field-name=showCharCount] .mdc-switch{transform:scale(1.05)}praxis-field-shell[data-field-name=showCharCount] .mat-mdc-slide-toggle{font-weight:600}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-hint{display:flex;align-items:center;gap:8px;background:var(--md-sys-color-tertiary-container);border:1px solid var(--md-sys-color-tertiary);color:var(--md-sys-color-on-tertiary-container);padding:8px 10px;border-radius:6px;line-height:1.3;white-space:normal}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-hint:before{content:\"\\26a0\\fe0f\";display:inline-block}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-subscript-wrapper{margin-top:6px;margin-bottom:10px;min-height:auto}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field{margin-bottom:16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: DynamicFieldLoaderDirective, selector: "[dynamicFieldLoader]", inputs: ["fields", "formGroup", "enableExternalControlBinding", "itemTemplate", "debugTrace", "debugTraceLabel", "readonlyMode", "disabledMode", "presentationMode", "visible", "canvasMode"], outputs: ["componentsCreated", "fieldCreated", "fieldDestroyed", "renderError", "canvasMouseEnter", "canvasMouseLeave", "canvasClick", "canvasFocus"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i5.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i5.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i5.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i5.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: DynamicEditorRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DynamicEditorRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'praxis-dynamic-editor-renderer', standalone: true, imports: [
                         CommonModule,
@@ -771,78 +780,915 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
     <ng-template #item let-field="field" let-index="index" let-content="content">
       <div class="editor-item" [attr.data-control-type]="field.controlType">
         <ng-container [ngTemplateOutlet]="content"></ng-container>
         <div class="actions-container">
           <!-- Botão de ajuda para regex -->
-          <button
-            *ngIf="field.name === 'pattern'"
-            type="button"
-            mat-icon-button
-            class="regex-help-btn decorator-btn"
-            (click)="openRegexHelp()"
-            aria-label="Exemplos de regex"
-            matTooltip="Exemplos de regex"
-          >
-            <mat-icon [praxisIcon]="'search'"></mat-icon>
-          </button>
+          @if (field.name === 'pattern') {
+            <button
+              type="button"
+              mat-icon-button
+              class="regex-help-btn decorator-btn"
+              (click)="openRegexHelp()"
+              aria-label="Exemplos de regex"
+              matTooltip="Exemplos de regex"
+              >
+              <mat-icon [praxisIcon]="'search'"></mat-icon>
+            </button>
+          }
           <!-- Botão para escolher ícone (prefix/suffix) -->
-          <button
-            *ngIf="isIconField(field.name)"
-            type="button"
-            mat-icon-button
-            class="icon-picker-btn decorator-btn"
-            (click)="openIconPicker(field.name)"
-            aria-label="Escolher ícone"
-            matTooltip="Escolher ícone"
-          >
-            <mat-icon [praxisIcon]="'apps'"></mat-icon>
-          </button>
+          @if (isIconField(field.name)) {
+            <button
+              type="button"
+              mat-icon-button
+              class="icon-picker-btn decorator-btn"
+              (click)="openIconPicker(field.name)"
+              aria-label="Escolher ícone"
+              matTooltip="Escolher ícone"
+              >
+              <mat-icon [praxisIcon]="'apps'"></mat-icon>
+            </button>
+          }
           <!-- Botão de ajuda (fallback quando suffix não é aplicado) -->
-          <button
-            *ngIf="field.hint && !useHelpSuffix(field)"
-            type="button"
-            mat-icon-button
-            class="hint-btn decorator-btn"
-            [class.has-icon-picker]="isIconField(field.name)"
-            [matTooltip]="field.hint"
-            aria-label="Ajuda"
-          >
-            <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
-          </button>
+          @if (field.hint && !useHelpSuffix(field)) {
+            <button
+              type="button"
+              mat-icon-button
+              class="hint-btn decorator-btn"
+              [class.has-icon-picker]="isIconField(field.name)"
+              [matTooltip]="field.hint"
+              aria-label="Ajuda"
+              >
+              <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
+            </button>
+          }
         </div>
       </div>
     </ng-template>
     <div class="editor-surface">
       <mat-accordion class="section-accordion" multi>
-        <mat-expansion-panel class="section-card" *ngFor="let g of groupOrder">
-          <mat-expansion-panel-header class="section-header">
-            <mat-panel-title>
-              <span class="section-title">
-                <mat-icon class="section-icon" [praxisIcon]="groupIcon(g)"></mat-icon>
-                {{ g }}
-              </span>
-            </mat-panel-title>
-          </mat-expansion-panel-header>
-          <div *ngFor="let row of groupRows[g]" class="editor-row" [ngClass]="rowClass(row)">
-            <ng-container *ngIf="ready"
-              dynamicFieldLoader
-              [fields]="row"
-              [formGroup]="form"
-              [itemTemplate]="item">
-            </ng-container>
-          </div>
-        </mat-expansion-panel>
+        @for (g of groupOrder; track g) {
+          <mat-expansion-panel class="section-card">
+            <mat-expansion-panel-header class="section-header">
+              <mat-panel-title>
+                <span class="section-title">
+                  <mat-icon class="section-icon" [praxisIcon]="groupIcon(g)"></mat-icon>
+                  {{ g }}
+                </span>
+              </mat-panel-title>
+            </mat-expansion-panel-header>
+            @for (row of groupRows[g]; track row) {
+              <div class="editor-row" [ngClass]="rowClass(row)">
+                @if (ready) {
+                  <ng-container
+                    dynamicFieldLoader
+                    [fields]="row"
+                    [formGroup]="form"
+                    [itemTemplate]="item">
+                  </ng-container>
+                }
+              </div>
+            }
+          </mat-expansion-panel>
+        }
       </mat-accordion>
     </div>
-  `, styles: [":host{display:block}.editor-surface{padding:8px 0 2px;border-radius:12px;background:transparent}.section-accordion{display:block}.section-card{margin:6px 0 8px;border-radius:12px;border:1px solid var(--md-sys-color-outline-variant);overflow:hidden}.section-card.mat-expanded{border-color:var(--md-sys-color-primary);box-shadow:0 2px 10px #0000000d}.section-card .mat-expansion-panel-body{background:var(--md-sys-color-surface-container-low)}.section-header{background:var(--md-sys-color-surface-container-low);border-bottom:1px solid var(--md-sys-color-outline-variant, var(--sicoob-stroke-medium));padding:2px 8px;min-height:32px;display:flex;align-items:center;color:var(--md-sys-color-on-surface)}.section-header .mat-expansion-panel-header-title,.section-header .mat-expansion-panel-header-description{display:flex;align-items:center;color:var(--md-sys-color-on-surface)}.section-title{display:inline-flex;align-items:center;gap:6px;font-weight:600;letter-spacing:.2px;color:var(--md-sys-color-on-surface);font-size:.9rem;line-height:1.2}.section-icon{color:var(--md-sys-color-primary, var(--md-sys-color-primary, #3f51b5));opacity:.9}.editor-row{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:8px}.editor-row>praxis-field-shell{flex:1 1 100%;min-width:280px}.editor-row praxis-field-shell .mat-mdc-form-field{width:100%;margin-bottom:8px}.editor-row.row-inline>praxis-field-shell{flex:0 0 auto}.editor-row.row-2>praxis-field-shell{flex:1 1 calc(50% - 12px);min-width:260px}.editor-row.row-3>praxis-field-shell{flex:1 1 calc(33.333% - 12px);min-width:220px}.editor-row>praxis-field-shell[data-field-name=controlType],.editor-row>praxis-field-shell[data-field-name=label],.editor-row>praxis-field-shell[data-field-name=placeholder]{flex:1 1 calc(50% - 12px);min-width:300px}praxis-field-shell[data-field-name=label] .mdc-floating-label,praxis-field-shell[data-field-name=placeholder] .mdc-floating-label{font-weight:600}.editor-row>praxis-field-shell[data-field-name=prefix],.editor-row>praxis-field-shell[data-field-name=suffix]{flex:0 0 200px;min-width:160px}.editor-row>praxis-field-shell[data-field-name=prefixIcon],.editor-row>praxis-field-shell[data-field-name=suffixIcon],.editor-row>praxis-field-shell[data-field-name=prefixIconColor],.editor-row>praxis-field-shell[data-field-name=suffixIconColor]{flex:1 1 auto;min-width:160px}.editor-item{display:flex;align-items:flex-start;gap:4px}.editor-item>ng-container,.editor-item>praxis-field-shell{flex:1;min-width:0}.actions-container{display:flex;align-items:center;gap:0;margin-top:12px;flex-shrink:0}.decorator-btn{position:static;color:var(--md-sys-color-primary, #3f51b5);opacity:.6;transform:scale(.8);width:32px;height:32px;line-height:32px;padding:0}.decorator-btn:hover{opacity:1}.icon-picker-btn,.hint-btn,.hint-btn.has-icon-picker{right:auto}.editor-row .mat-mdc-form-field-subscript-wrapper mat-hint{display:none!important}.editor-row .mat-mdc-form-field-subscript-wrapper mat-error{display:block!important}praxis-field-shell[data-field-name=showCharCount] .mdc-switch{transform:scale(1.05)}praxis-field-shell[data-field-name=showCharCount] .mat-mdc-slide-toggle{font-weight:600}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-hint{display:flex;align-items:center;gap:8px;background:var(--md-sys-color-tertiary-container);border:1px solid var(--md-sys-color-tertiary);color:var(--md-sys-color-on-tertiary-container);padding:8px 10px;border-radius:6px;line-height:1.3;white-space:normal}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-hint:before{content:\"\\26a0\\fe0f\";display:inline-block}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-subscript-wrapper{margin-top:6px;margin-bottom:10px;min-height:auto}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field{margin-bottom:16px}\n"] }]
-        }], ctorParameters: () => [{ type: i1.MatDialog }, { type: i2$1.IconPickerService }], propDecorators: { properties: [{
+    `, styles: [":host{display:block}.editor-surface{padding:8px 0 2px;border-radius:12px;background:transparent}.section-accordion{display:block}.section-card{margin:6px 0 8px;border-radius:12px;border:1px solid var(--md-sys-color-outline-variant);overflow:hidden}.section-card.mat-expanded{border-color:var(--md-sys-color-primary);box-shadow:0 2px 10px #0000000d}.section-card .mat-expansion-panel-body{background:var(--md-sys-color-surface-container-low)}.section-header{background:var(--md-sys-color-surface-container-low);border-bottom:1px solid var(--md-sys-color-outline-variant, var(--sicoob-stroke-medium));padding:2px 8px;min-height:32px;display:flex;align-items:center;color:var(--md-sys-color-on-surface)}.section-header .mat-expansion-panel-header-title,.section-header .mat-expansion-panel-header-description{display:flex;align-items:center;color:var(--md-sys-color-on-surface)}.section-title{display:inline-flex;align-items:center;gap:6px;font-weight:600;letter-spacing:.2px;color:var(--md-sys-color-on-surface);font-size:.9rem;line-height:1.2}.section-icon{color:var(--md-sys-color-primary, var(--md-sys-color-primary, #3f51b5));opacity:.9}.editor-row{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:8px}.editor-row>praxis-field-shell{flex:1 1 100%;min-width:280px}.editor-row praxis-field-shell .mat-mdc-form-field{width:100%;margin-bottom:8px}.editor-row.row-inline>praxis-field-shell{flex:0 0 auto}.editor-row.row-2>praxis-field-shell{flex:1 1 calc(50% - 12px);min-width:260px}.editor-row.row-3>praxis-field-shell{flex:1 1 calc(33.333% - 12px);min-width:220px}.editor-row>praxis-field-shell[data-field-name=controlType],.editor-row>praxis-field-shell[data-field-name=label],.editor-row>praxis-field-shell[data-field-name=placeholder]{flex:1 1 calc(50% - 12px);min-width:300px}praxis-field-shell[data-field-name=label] .mdc-floating-label,praxis-field-shell[data-field-name=placeholder] .mdc-floating-label{font-weight:600}.editor-row>praxis-field-shell[data-field-name=prefix],.editor-row>praxis-field-shell[data-field-name=suffix]{flex:0 0 200px;min-width:160px}.editor-row>praxis-field-shell[data-field-name=prefixIcon],.editor-row>praxis-field-shell[data-field-name=suffixIcon],.editor-row>praxis-field-shell[data-field-name=prefixIconColor],.editor-row>praxis-field-shell[data-field-name=suffixIconColor]{flex:1 1 auto;min-width:160px}.editor-item{display:flex;align-items:flex-start;gap:4px}.editor-item>ng-container,.editor-item>praxis-field-shell{flex:1;min-width:0}.actions-container{display:flex;align-items:center;gap:0;margin-top:12px;flex-shrink:0}.decorator-btn{position:static;color:var(--md-sys-color-primary, #3f51b5);opacity:.6;transform:scale(.8);width:32px;height:32px;line-height:32px;padding:0}.decorator-btn:hover{opacity:1}.icon-picker-btn,.hint-btn,.hint-btn.has-icon-picker{right:auto}.editor-row .mat-mdc-form-field-subscript-wrapper mat-hint{display:none!important}.editor-row .mat-mdc-form-field-subscript-wrapper mat-error{display:block!important}praxis-field-shell[data-field-name=showCharCount] .mdc-switch{transform:scale(1.05)}praxis-field-shell[data-field-name=showCharCount] .mat-mdc-slide-toggle{font-weight:600}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-hint{display:flex;align-items:center;gap:8px;background:var(--md-sys-color-tertiary-container);border:1px solid var(--md-sys-color-tertiary);color:var(--md-sys-color-on-tertiary-container);padding:8px 10px;border-radius:6px;line-height:1.3;white-space:normal}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-hint:before{content:\"\\26a0\\fe0f\";display:inline-block}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field-subscript-wrapper{margin-top:6px;margin-bottom:10px;min-height:auto}praxis-field-shell[data-field-name=controlType] .mat-mdc-form-field{margin-bottom:16px}\n"] }]
+        }], ctorParameters: () => [{ type: i1$1.MatDialog }, { type: i2$1.IconPickerService }], propDecorators: { properties: [{
                 type: Input
             }], form: [{
                 type: Input
             }] } });
+const METADATA_EDITOR_EN_US = {
+    'praxis.metadataEditor.arrayFields.section': 'Collection subfields',
+    'praxis.metadataEditor.arrayFields.title': 'Subfields',
+    'praxis.metadataEditor.arrayFields.add': 'Add subfield',
+    'praxis.metadataEditor.arrayFields.duplicateNames': 'There are duplicate names: {{names}}',
+    'praxis.metadataEditor.arrayFields.empty': 'No local subfields configured.',
+    'praxis.metadataEditor.arrayFields.name': 'Name',
+    'praxis.metadataEditor.arrayFields.nameRequired': 'Enter the subfield name.',
+    'praxis.metadataEditor.arrayFields.nameDuplicated': 'This name is already used in the collection.',
+    'praxis.metadataEditor.arrayFields.label': 'Label',
+    'praxis.metadataEditor.arrayFields.controlType': 'Control',
+    'praxis.metadataEditor.arrayFields.required': 'Required',
+    'praxis.metadataEditor.arrayFields.moveUp': 'Move up',
+    'praxis.metadataEditor.arrayFields.moveDown': 'Move down',
+    'praxis.metadataEditor.arrayFields.duplicate': 'Duplicate',
+    'praxis.metadataEditor.arrayFields.remove': 'Remove',
+    'praxis.metadataEditor.arrayFields.removeBlocked': 'Remove references before deleting: {{references}}',
+    'praxis.metadataEditor.arrayFields.refOnly': 'The item schema comes from itemSchemaRef; create local subfields only when you need an override.',
+    'praxis.metadataEditor.arrayFields.overrideLocal': 'There is an itemSchemaRef and local subfields; local subfields work as an explicit override.',
+    'praxis.metadataEditor.arrayFields.imported': 'Subfields imported. Review them before applying or saving.',
+    'praxis.metadataEditor.arrayFields.localOnly': 'Local subfields will be saved in array.itemSchema.fields.',
+    'praxis.metadataEditor.arrayFields.control.input': 'Text',
+    'praxis.metadataEditor.arrayFields.control.textarea': 'Long text',
+    'praxis.metadataEditor.arrayFields.control.numeric': 'Number',
+    'praxis.metadataEditor.arrayFields.control.currency': 'Currency',
+    'praxis.metadataEditor.arrayFields.control.email': 'Email',
+    'praxis.metadataEditor.arrayFields.control.phone': 'Phone',
+    'praxis.metadataEditor.arrayFields.control.select': 'Select',
+    'praxis.metadataEditor.arrayFields.control.entityLookup': 'Entity lookup',
+    'praxis.metadataEditor.arrayFields.control.toggle': 'Toggle',
+    'praxis.metadataEditor.arrayFields.control.date': 'Date',
+};
+const METADATA_EDITOR_PT_BR = {
+    'praxis.metadataEditor.arrayFields.section': 'Subcampos da cole\u00e7\u00e3o',
+    'praxis.metadataEditor.arrayFields.title': 'Subcampos',
+    'praxis.metadataEditor.arrayFields.add': 'Adicionar subcampo',
+    'praxis.metadataEditor.arrayFields.duplicateNames': 'Existem nomes duplicados: {{names}}',
+    'praxis.metadataEditor.arrayFields.empty': 'Nenhum subcampo local configurado.',
+    'praxis.metadataEditor.arrayFields.name': 'Nome',
+    'praxis.metadataEditor.arrayFields.nameRequired': 'Informe o nome do subcampo.',
+    'praxis.metadataEditor.arrayFields.nameDuplicated': 'Este nome j\u00e1 est\u00e1 em uso na cole\u00e7\u00e3o.',
+    'praxis.metadataEditor.arrayFields.label': 'Label',
+    'praxis.metadataEditor.arrayFields.controlType': 'Controle',
+    'praxis.metadataEditor.arrayFields.required': 'Obrigat\u00f3rio',
+    'praxis.metadataEditor.arrayFields.moveUp': 'Subir',
+    'praxis.metadataEditor.arrayFields.moveDown': 'Descer',
+    'praxis.metadataEditor.arrayFields.duplicate': 'Duplicar',
+    'praxis.metadataEditor.arrayFields.remove': 'Remover',
+    'praxis.metadataEditor.arrayFields.removeBlocked': 'Remova as refer\u00eancias antes de excluir: {{references}}',
+    'praxis.metadataEditor.arrayFields.refOnly': 'O schema do item vem do itemSchemaRef; crie subcampos locais apenas quando precisar de override.',
+    'praxis.metadataEditor.arrayFields.overrideLocal': 'H\u00e1 um itemSchemaRef e subcampos locais; os subcampos locais funcionam como override expl\u00edcito.',
+    'praxis.metadataEditor.arrayFields.imported': 'Subcampos importados. Revise antes de aplicar ou salvar.',
+    'praxis.metadataEditor.arrayFields.localOnly': 'Subcampos locais ser\u00e3o salvos em array.itemSchema.fields.',
+    'praxis.metadataEditor.arrayFields.control.input': 'Texto',
+    'praxis.metadataEditor.arrayFields.control.textarea': 'Texto longo',
+    'praxis.metadataEditor.arrayFields.control.numeric': 'N\u00famero',
+    'praxis.metadataEditor.arrayFields.control.currency': 'Moeda',
+    'praxis.metadataEditor.arrayFields.control.email': 'E-mail',
+    'praxis.metadataEditor.arrayFields.control.phone': 'Telefone',
+    'praxis.metadataEditor.arrayFields.control.select': 'Sele\u00e7\u00e3o',
+    'praxis.metadataEditor.arrayFields.control.entityLookup': 'Busca de entidade',
+    'praxis.metadataEditor.arrayFields.control.toggle': 'Liga/desliga',
+    'praxis.metadataEditor.arrayFields.control.date': 'Data',
+};
+function createPraxisMetadataEditorI18nConfig(options = {}) {
+    const dictionaries = {
+        'pt-BR': {
+            ...METADATA_EDITOR_PT_BR,
+            ...(options.dictionaries?.['pt-BR'] ?? {}),
+        },
+        'en-US': {
+            ...METADATA_EDITOR_EN_US,
+            ...(options.dictionaries?.['en-US'] ?? {}),
+        },
+    };
+    for (const [locale, dictionary] of Object.entries(options.dictionaries ?? {})) {
+        if (locale === 'pt-BR' || locale === 'en-US') {
+            continue;
+        }
+        dictionaries[locale] = {
+            ...(dictionaries[locale] ?? {}),
+            ...dictionary,
+        };
+    }
+    return {
+        locale: options.locale,
+        fallbackLocale: options.fallbackLocale ?? 'pt-BR',
+        dictionaries,
+    };
+}
+const METADATA_EDITOR_I18N_CONFIG = createPraxisMetadataEditorI18nConfig();
+function providePraxisMetadataEditorI18n(options = {}) {
+    return providePraxisI18n(createPraxisMetadataEditorI18nConfig(options));
+}
+function resolvePraxisMetadataEditorText(i18n, key, fallback) {
+    const namespacedKey = key.startsWith('praxis.metadataEditor.')
+        ? key
+        : `praxis.metadataEditor.${key}`;
+    return i18n.t(namespacedKey, undefined, fallback) || fallback;
+}
+class ArrayItemSchemaFieldsEditorComponent {
+    static nextInstanceId = 0;
+    control = null;
+    arrayControl = null;
+    formArray = new FormArray([]);
+    form = new FormGroup({ fields: this.formArray });
+    controlTypeOptions = [
+        FieldControlType.INPUT,
+        FieldControlType.TEXTAREA,
+        FieldControlType.NUMERIC_TEXT_BOX,
+        FieldControlType.CURRENCY_INPUT,
+        FieldControlType.EMAIL_INPUT,
+        FieldControlType.PHONE,
+        FieldControlType.SELECT,
+        FieldControlType.ENTITY_LOOKUP,
+        FieldControlType.TOGGLE,
+        FieldControlType.DATE_INPUT,
+    ];
+    schemaSourceState = 'local-only';
+    duplicateNames = [];
+    fb = inject(FormBuilder);
+    i18n = inject(PraxisI18nService);
+    instanceId = ++ArrayItemSchemaFieldsEditorComponent.nextInstanceId;
+    externalSubscription;
+    internalSubscription;
+    originalNames = [];
+    importedFieldsFingerprint = null;
+    hydrating = false;
+    get rows() {
+        return this.formArray.controls;
+    }
+    ngOnChanges(changes) {
+        if (changes['control']) {
+            this.externalSubscription?.unsubscribe();
+            this.hydrateFromControl();
+            this.externalSubscription = this.control?.valueChanges.subscribe(() => {
+                if (!this.hydrating) {
+                    this.hydrateFromControl();
+                }
+            });
+        }
+        if (changes['arrayControl'] || changes['control']) {
+            this.updateSchemaSourceState();
+        }
+    }
+    ngOnDestroy() {
+        this.externalSubscription?.unsubscribe();
+        this.internalSubscription?.unsubscribe();
+    }
+    text(key, fallback, fallbackWithParams, params) {
+        return this.i18n.t(key, params, fallbackWithParams ?? fallback);
+    }
+    controlTypeLabel(controlType) {
+        const labels = {
+            [FieldControlType.INPUT]: this.text('praxis.metadataEditor.arrayFields.control.input', 'Texto'),
+            [FieldControlType.TEXTAREA]: this.text('praxis.metadataEditor.arrayFields.control.textarea', 'Texto longo'),
+            [FieldControlType.NUMERIC_TEXT_BOX]: this.text('praxis.metadataEditor.arrayFields.control.numeric', 'N\u00famero'),
+            [FieldControlType.CURRENCY_INPUT]: this.text('praxis.metadataEditor.arrayFields.control.currency', 'Moeda'),
+            [FieldControlType.EMAIL_INPUT]: this.text('praxis.metadataEditor.arrayFields.control.email', 'E-mail'),
+            [FieldControlType.PHONE]: this.text('praxis.metadataEditor.arrayFields.control.phone', 'Telefone'),
+            [FieldControlType.SELECT]: this.text('praxis.metadataEditor.arrayFields.control.select', 'Sele\u00e7\u00e3o'),
+            [FieldControlType.ENTITY_LOOKUP]: this.text('praxis.metadataEditor.arrayFields.control.entityLookup', 'Busca de entidade'),
+            [FieldControlType.TOGGLE]: this.text('praxis.metadataEditor.arrayFields.control.toggle', 'Liga/desliga'),
+            [FieldControlType.DATE_INPUT]: this.text('praxis.metadataEditor.arrayFields.control.date', 'Data'),
+        };
+        return labels[controlType] ?? controlType;
+    }
+    addField(seed = {}) {
+        const fieldName = seed.name || this.nextAvailableName();
+        this.formArray.push(this.createRow({
+            ...seed,
+            name: fieldName,
+            label: seed.label || fieldName,
+            controlType: seed.controlType || FieldControlType.INPUT,
+            required: seed.required ?? false,
+        }));
+        this.originalNames.push(fieldName);
+        this.syncToControl();
+    }
+    duplicateField(index) {
+        const current = this.rowValue(index);
+        if (!current)
+            return;
+        const nextName = this.nextAvailableName(`${current.name || 'field'}Copy`);
+        this.addField({
+            ...current,
+            name: nextName,
+            label: nextName,
+        });
+    }
+    removeField(index) {
+        const name = String(this.formArray.at(index)?.get('name')?.value || '').trim();
+        if (this.isReferenced(name)) {
+            return;
+        }
+        this.formArray.removeAt(index);
+        this.originalNames.splice(index, 1);
+        this.syncToControl();
+    }
+    moveField(index, delta) {
+        const target = index + delta;
+        if (target < 0 || target >= this.formArray.length)
+            return;
+        const row = this.formArray.at(index);
+        this.formArray.removeAt(index);
+        this.formArray.insert(target, row);
+        const [originalName] = this.originalNames.splice(index, 1);
+        this.originalNames.splice(target, 0, originalName);
+        this.syncToControl();
+    }
+    onNameBlur(index) {
+        const previous = this.originalNames[index];
+        const next = String(this.formArray.at(index)?.get('name')?.value || '').trim();
+        if (previous && !next && this.isReferenced(previous)) {
+            this.formArray.at(index)?.get('name')?.setValue(previous, { emitEvent: false });
+            this.syncToControl();
+            return;
+        }
+        if (previous && next && previous !== next) {
+            this.renameReferences(previous, next);
+            this.originalNames[index] = next;
+        }
+        this.syncToControl();
+    }
+    importFieldsFromJson(raw) {
+        try {
+            const parsed = JSON.parse(String(raw || '').trim());
+            if (!Array.isArray(parsed) ||
+                parsed.some((entry) => !this.isImportableField(entry))) {
+                return false;
+            }
+            this.replaceRows(parsed);
+            this.schemaSourceState = 'imported';
+            this.importedFieldsFingerprint = this.fieldsFingerprint();
+            this.syncToControl();
+            return true;
+        }
+        catch {
+            return false;
+        }
+    }
+    isImportableField(value) {
+        if (!value || typeof value !== 'object' || Array.isArray(value)) {
+            return false;
+        }
+        const raw = value;
+        return typeof raw.name === 'string' && raw.name.trim().length > 0;
+    }
+    isNameDuplicated(index) {
+        const name = String(this.formArray.at(index)?.get('name')?.value || '').trim();
+        return !!name && this.duplicateNames.includes(name);
+    }
+    isNameInvalid(index) {
+        const control = this.formArray.at(index)?.get('name');
+        return !!control?.invalid;
+    }
+    nameErrorId(index) {
+        return `praxis-array-field-name-error-${this.instanceId}-${index}`;
+    }
+    nameErrorDescribedBy(index) {
+        return this.nameErrorMessage(index) ? this.nameErrorId(index) : null;
+    }
+    nameErrorMessage(index) {
+        const control = this.formArray.at(index)?.get('name');
+        if (!control?.errors) {
+            return '';
+        }
+        if (control.errors['arrayFieldNameRequired']) {
+            return this.text('praxis.metadataEditor.arrayFields.nameRequired', 'Informe o nome do subcampo.');
+        }
+        if (control.errors['arrayFieldNameDuplicated']) {
+            return this.text('praxis.metadataEditor.arrayFields.nameDuplicated', 'Este nome j\u00e1 est\u00e1 em uso na cole\u00e7\u00e3o.');
+        }
+        return '';
+    }
+    isReferenced(fieldName) {
+        return this.referencedBy(fieldName).length > 0;
+    }
+    removeTitle(fieldName) {
+        const references = this.referencedBy(fieldName);
+        if (!references.length) {
+            return '';
+        }
+        return this.text('praxis.metadataEditor.arrayFields.removeBlocked', undefined, 'Remova as refer\u00eancias antes de excluir: {{references}}', { references: references.join(', ') });
+    }
+    schemaStateDescription() {
+        switch (this.schemaSourceState) {
+            case 'ref-only':
+                return this.text('praxis.metadataEditor.arrayFields.refOnly', 'O schema do item vem do itemSchemaRef; crie subcampos locais apenas quando precisar de override.');
+            case 'override-local':
+                return this.text('praxis.metadataEditor.arrayFields.overrideLocal', 'H\u00e1 um itemSchemaRef e subcampos locais; os subcampos locais funcionam como override expl\u00edcito.');
+            case 'imported':
+                return this.text('praxis.metadataEditor.arrayFields.imported', 'Subcampos importados. Revise antes de aplicar ou salvar.');
+            default:
+                return this.text('praxis.metadataEditor.arrayFields.localOnly', 'Subcampos locais ser\u00e3o salvos em array.itemSchema.fields.');
+        }
+    }
+    hydrateFromControl() {
+        const fields = this.normalizeFields(this.control?.value);
+        this.replaceRows(fields, false);
+        this.updateSchemaSourceState();
+    }
+    replaceRows(fields, emit = true) {
+        this.hydrating = true;
+        this.internalSubscription?.unsubscribe();
+        while (this.formArray.length) {
+            this.formArray.removeAt(0, { emitEvent: false });
+        }
+        this.originalNames = [];
+        for (const field of fields) {
+            const normalized = this.normalizeField(field);
+            this.formArray.push(this.createRow(normalized), { emitEvent: false });
+            this.originalNames.push(normalized.name);
+        }
+        this.internalSubscription = this.formArray.valueChanges.subscribe(() => this.syncToControl());
+        this.hydrating = false;
+        this.updateFieldListValidity();
+        if (emit) {
+            this.syncToControl();
+        }
+    }
+    createRow(field) {
+        return this.fb.group({
+            name: [field.name || ''],
+            label: [field.label || field.name || ''],
+            controlType: [field.controlType || FieldControlType.INPUT],
+            required: [!!field.required],
+            metadata: [this.clonePlainObject(field)],
+        });
+    }
+    rowValue(index) {
+        const row = this.formArray.at(index);
+        return row ? this.normalizeField(row.getRawValue()) : null;
+    }
+    syncToControl() {
+        if (this.hydrating || !this.control)
+            return;
+        const normalizedRows = this.formArray.controls.map((row) => this.normalizeField(row.getRawValue()));
+        this.updateDuplicateNames(normalizedRows);
+        const fields = normalizedRows.filter((field) => field.name);
+        this.hydrating = true;
+        this.control.setValue(fields, { emitEvent: true });
+        this.control.markAsDirty();
+        this.control.markAsTouched();
+        this.hydrating = false;
+        this.updateFieldListValidity(normalizedRows);
+        this.updateSchemaSourceState();
+    }
+    normalizeFields(value) {
+        if (Array.isArray(value)) {
+            return value;
+        }
+        if (typeof value === 'string' && value.trim()) {
+            try {
+                const parsed = JSON.parse(value);
+                return Array.isArray(parsed) ? parsed : [];
+            }
+            catch {
+                return [];
+            }
+        }
+        return [];
+    }
+    normalizeField(value) {
+        const raw = (value && typeof value === 'object' ? value : {});
+        const base = raw.metadata && typeof raw.metadata === 'object' && !Array.isArray(raw.metadata)
+            ? this.clonePlainObject(raw.metadata)
+            : this.clonePlainObject(raw);
+        const name = String(raw.name ?? base.name ?? '').trim();
+        return {
+            ...base,
+            name,
+            label: String(raw.label ?? base.label ?? name ?? '').trim(),
+            controlType: raw.controlType || base.controlType || FieldControlType.INPUT,
+            required: raw.required === true,
+        };
+    }
+    nextAvailableName(prefix = 'campo') {
+        const existing = new Set(this.formArray.controls
+            .map((row) => String(row.get('name')?.value || '').trim())
+            .filter(Boolean));
+        let index = 1;
+        let candidate = prefix;
+        while (existing.has(candidate)) {
+            index += 1;
+            candidate = `${prefix}${index}`;
+        }
+        return candidate;
+    }
+    updateDuplicateNames(fields) {
+        const source = fields ?? this.formArray.controls.map((row) => this.normalizeField(row.getRawValue()));
+        const seen = new Set();
+        const duplicated = new Set();
+        for (const field of source) {
+            const name = String(field.name || '').trim();
+            if (!name)
+                continue;
+            if (seen.has(name)) {
+                duplicated.add(name);
+            }
+            seen.add(name);
+        }
+        this.duplicateNames = Array.from(duplicated);
+    }
+    updateFieldListValidity(fields = this.formArray.controls.map((row) => this.normalizeField(row.getRawValue()))) {
+        this.updateDuplicateNames(fields);
+        const duplicateSet = new Set(this.duplicateNames);
+        const hasRequiredNameError = fields.some((field) => !String(field.name || '').trim());
+        const hasDuplicateNameError = duplicateSet.size > 0;
+        this.formArray.controls.forEach((row) => {
+            const nameControl = row.get('name');
+            const name = String(nameControl?.value || '').trim();
+            this.setControlError(nameControl, 'arrayFieldNameRequired', !name);
+            this.setControlError(nameControl, 'arrayFieldNameDuplicated', !!name && duplicateSet.has(name));
+        });
+        const errorPayload = hasDuplicateNameError ? { names: this.duplicateNames } : null;
+        this.setControlError(this.control, 'arrayFieldNameRequired', hasRequiredNameError);
+        this.setControlError(this.control, 'arrayFieldNameDuplicated', errorPayload);
+        this.setControlError(this.formArray, 'arrayFieldNameRequired', hasRequiredNameError);
+        this.setControlError(this.formArray, 'arrayFieldNameDuplicated', errorPayload);
+    }
+    setControlError(control, key, value) {
+        if (!control)
+            return;
+        const errors = { ...(control.errors || {}) };
+        const hasError = value !== null && value !== undefined && value !== false;
+        if (hasError) {
+            errors[key] = value === true ? true : value;
+        }
+        else {
+            delete errors[key];
+        }
+        control.setErrors(Object.keys(errors).length ? errors : null);
+    }
+    updateSchemaSourceState() {
+        const rawArray = this.arrayValue();
+        const hasRef = typeof rawArray.itemSchemaRef === 'string' && rawArray.itemSchemaRef.trim().length > 0;
+        const hasFields = this.formArray.length > 0;
+        if (this.schemaSourceState === 'imported' &&
+            hasFields &&
+            this.importedFieldsFingerprint === this.fieldsFingerprint()) {
+            return;
+        }
+        if (this.schemaSourceState === 'imported') {
+            this.importedFieldsFingerprint = null;
+        }
+        this.schemaSourceState = hasRef && hasFields ? 'override-local' : hasRef ? 'ref-only' : 'local-only';
+    }
+    arrayValue() {
+        const value = this.arrayControl?.value;
+        return value && typeof value === 'object' ? value : {};
+    }
+    referencedBy(fieldName) {
+        const name = String(fieldName || '').trim();
+        if (!name)
+            return [];
+        const array = this.arrayValue();
+        const references = [];
+        if (array.itemIdentityField === name)
+            references.push('itemIdentityField');
+        if (this.uniqueByFields(array.collectionValidation?.uniqueBy).includes(name)) {
+            references.push('collectionValidation.uniqueBy');
+        }
+        if (array.collectionValidation?.exactlyOne?.field === name) {
+            references.push('collectionValidation.exactlyOne.field');
+        }
+        if (array.collectionValidation?.atLeastOne?.field === name) {
+            references.push('collectionValidation.atLeastOne.field');
+        }
+        if (typeof array.itemTitleTemplate === 'string' && this.templateReferencesField(array.itemTitleTemplate, name)) {
+            references.push('itemTitleTemplate');
+        }
+        return references;
+    }
+    renameReferences(previous, next) {
+        if (!this.arrayControl || !previous || !next)
+            return;
+        const array = { ...this.arrayValue() };
+        if (array.itemIdentityField === previous)
+            array.itemIdentityField = next;
+        const collectionValidation = array.collectionValidation && typeof array.collectionValidation === 'object'
+            ? { ...array.collectionValidation }
+            : undefined;
+        if (collectionValidation) {
+            if (Array.isArray(collectionValidation.uniqueBy)) {
+                collectionValidation.uniqueBy = collectionValidation.uniqueBy.map((entry) => entry === previous ? next : entry);
+            }
+            else if (typeof collectionValidation.uniqueBy === 'string') {
+                collectionValidation.uniqueBy = this.replaceUniqueByField(collectionValidation.uniqueBy, previous, next);
+            }
+            if (collectionValidation.exactlyOne?.field === previous) {
+                collectionValidation.exactlyOne = { ...collectionValidation.exactlyOne, field: next };
+            }
+            if (collectionValidation.atLeastOne?.field === previous) {
+                collectionValidation.atLeastOne = { ...collectionValidation.atLeastOne, field: next };
+            }
+            array.collectionValidation = collectionValidation;
+        }
+        if (typeof array.itemTitleTemplate === 'string') {
+            array.itemTitleTemplate = array.itemTitleTemplate.replace(new RegExp(`{{\\s*${this.escapeRegExp(previous)}\\s*}}`, 'g'), `{{${next}}}`);
+        }
+        this.arrayControl.patchValue(array);
+        this.arrayControl.markAsDirty();
+    }
+    uniqueByFields(value) {
+        if (Array.isArray(value)) {
+            return value.map((entry) => String(entry || '').trim()).filter(Boolean);
+        }
+        if (typeof value !== 'string') {
+            return [];
+        }
+        const trimmed = value.trim();
+        if (!trimmed) {
+            return [];
+        }
+        try {
+            const parsed = JSON.parse(trimmed);
+            if (Array.isArray(parsed)) {
+                return parsed.map((entry) => String(entry || '').trim()).filter(Boolean);
+            }
+        }
+        catch { }
+        return trimmed
+            .split(/\r?\n|,/)
+            .map((entry) => entry.trim())
+            .filter(Boolean);
+    }
+    replaceUniqueByField(value, previous, next) {
+        const trimmed = value.trim();
+        if (!trimmed) {
+            return value;
+        }
+        try {
+            const parsed = JSON.parse(trimmed);
+            if (Array.isArray(parsed)) {
+                return JSON.stringify(parsed.map((entry) => String(entry || '').trim() === previous ? next : entry));
+            }
+        }
+        catch { }
+        return value
+            .split(/(\r?\n|,)/)
+            .map((entry) => entry.trim() === previous ? next : entry)
+            .join('');
+    }
+    templateReferencesField(template, fieldName) {
+        return new RegExp(`{{\\s*${this.escapeRegExp(fieldName)}\\s*}}`).test(template);
+    }
+    clonePlainObject(value) {
+        return this.cloneMetadataValue(value, new WeakMap());
+    }
+    cloneMetadataValue(value, seen) {
+        if (!value || typeof value !== 'object') {
+            return value;
+        }
+        if (seen.has(value)) {
+            return seen.get(value);
+        }
+        if (value instanceof Date) {
+            return new Date(value.getTime());
+        }
+        if (value instanceof RegExp) {
+            return new RegExp(value.source, value.flags);
+        }
+        if (Array.isArray(value)) {
+            const clone = [];
+            seen.set(value, clone);
+            clone.push(...value.map((entry) => this.cloneMetadataValue(entry, seen)));
+            return clone;
+        }
+        if (value instanceof Map) {
+            const clone = new Map();
+            seen.set(value, clone);
+            value.forEach((entry, key) => {
+                clone.set(this.cloneMetadataValue(key, seen), this.cloneMetadataValue(entry, seen));
+            });
+            return clone;
+        }
+        if (value instanceof Set) {
+            const clone = new Set();
+            seen.set(value, clone);
+            value.forEach((entry) => clone.add(this.cloneMetadataValue(entry, seen)));
+            return clone;
+        }
+        const prototype = Object.getPrototypeOf(value);
+        if (prototype !== Object.prototype && prototype !== null) {
+            return value;
+        }
+        const clone = {};
+        seen.set(value, clone);
+        for (const [key, entry] of Object.entries(value)) {
+            clone[key] = this.cloneMetadataValue(entry, seen);
+        }
+        return clone;
+    }
+    fieldsFingerprint() {
+        return JSON.stringify(this.formArray.controls.map((row) => this.normalizeField(row.getRawValue())));
+    }
+    escapeRegExp(value) {
+        return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ArrayItemSchemaFieldsEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: ArrayItemSchemaFieldsEditorComponent, isStandalone: true, selector: "praxis-array-item-schema-fields-editor", inputs: { control: "control", arrayControl: "arrayControl" }, providers: [providePraxisMetadataEditorI18n()], usesOnChanges: true, ngImport: i0, template: `
+    <section
+      class="array-fields-editor"
+      [attr.data-schema-source]="schemaSourceState"
+      [attr.aria-label]="text('praxis.metadataEditor.arrayFields.section', 'Subcampos da cole\u00e7\u00e3o')"
+      >
+      <header class="array-fields-editor__header">
+        <div>
+          <h3>{{ text('praxis.metadataEditor.arrayFields.title', 'Subcampos') }}</h3>
+          <p>
+            {{ schemaStateDescription() }}
+          </p>
+        </div>
+        <button type="button" class="array-fields-editor__primary" (click)="addField()">
+          {{ text('praxis.metadataEditor.arrayFields.add', 'Adicionar subcampo') }}
+        </button>
+      </header>
+      @if (duplicateNames.length) {
+        <div
+          class="array-fields-editor__warning"
+          role="alert"
+          >
+          {{
+          text(
+          'praxis.metadataEditor.arrayFields.duplicateNames',
+          undefined,
+          'Existem nomes duplicados: {{names}}',
+          { names: duplicateNames.join(', ') }
+          )
+          }}
+        </div>
+      }
+      @if (formArray.length === 0) {
+        <div
+          class="array-fields-editor__empty"
+          >
+          {{ text('praxis.metadataEditor.arrayFields.empty', 'Nenhum subcampo local configurado.') }}
+        </div>
+      }
+      <div class="array-fields-editor__list" [formGroup]="form">
+        @for (row of rows; track row; let i = $index) {
+          <div
+            class="array-fields-editor__row"
+            [formGroup]="row"
+            >
+            <label>
+              <span>{{ text('praxis.metadataEditor.arrayFields.name', 'Nome') }}</span>
+              <input
+                type="text"
+                formControlName="name"
+                (blur)="onNameBlur(i)"
+                [attr.aria-invalid]="isNameInvalid(i) ? 'true' : null"
+                [attr.aria-describedby]="nameErrorDescribedBy(i)"
+                />
+              @if (nameErrorMessage(i); as nameError) {
+                <span
+                  class="array-fields-editor__field-error"
+                  [id]="nameErrorId(i)"
+                  >
+                  {{ nameError }}
+                </span>
+              }
+            </label>
+            <label>
+              <span>{{ text('praxis.metadataEditor.arrayFields.label', 'Label') }}</span>
+              <input type="text" formControlName="label" />
+            </label>
+            <label>
+              <span>{{ text('praxis.metadataEditor.arrayFields.controlType', 'Controle') }}</span>
+              <select formControlName="controlType">
+                @for (option of controlTypeOptions; track option) {
+                  <option [value]="option">
+                    {{ controlTypeLabel(option) }}
+                  </option>
+                }
+              </select>
+            </label>
+            <label class="array-fields-editor__check">
+              <input type="checkbox" formControlName="required" />
+              <span>{{ text('praxis.metadataEditor.arrayFields.required', 'Obrigat\u00f3rio') }}</span>
+            </label>
+            <div class="array-fields-editor__actions">
+              <button type="button" (click)="moveField(i, -1)" [disabled]="i === 0">
+                {{ text('praxis.metadataEditor.arrayFields.moveUp', 'Subir') }}
+              </button>
+              <button type="button" (click)="moveField(i, 1)" [disabled]="i === formArray.length - 1">
+                {{ text('praxis.metadataEditor.arrayFields.moveDown', 'Descer') }}
+              </button>
+              <button type="button" (click)="duplicateField(i)">
+                {{ text('praxis.metadataEditor.arrayFields.duplicate', 'Duplicar') }}
+              </button>
+              <button
+                type="button"
+                (click)="removeField(i)"
+                [disabled]="isReferenced(row.get('name')?.value)"
+                [title]="removeTitle(row.get('name')?.value)"
+                >
+                {{ text('praxis.metadataEditor.arrayFields.remove', 'Remover') }}
+              </button>
+            </div>
+          </div>
+        }
+      </div>
+    </section>
+    `, isInline: true, styles: [":host{display:block}.array-fields-editor{display:block;margin:10px 0 2px;padding:12px;border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;background:var(--md-sys-color-surface-container-low);color:var(--md-sys-color-on-surface)}.array-fields-editor__header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.array-fields-editor__header h3{margin:0 0 4px;font-size:1rem;line-height:1.25}.array-fields-editor__header p,.array-fields-editor__empty{margin:0;color:var(--md-sys-color-on-surface-variant);font-size:.875rem;line-height:1.35}.array-fields-editor__primary,.array-fields-editor button{border:1px solid var(--md-sys-color-outline-variant);border-radius:6px;background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface);cursor:pointer;min-height:32px;padding:5px 10px}.array-fields-editor__primary{border-color:var(--md-sys-color-primary);color:var(--md-sys-color-primary);font-weight:600;white-space:nowrap}.array-fields-editor button:disabled{cursor:not-allowed;opacity:.55}.array-fields-editor__warning{margin:8px 0 12px;padding:8px 10px;border:1px solid var(--md-sys-color-error);border-radius:6px;color:var(--md-sys-color-error);background:var(--md-sys-color-error-container)}.array-fields-editor__list{display:grid;gap:10px}.array-fields-editor__row{display:grid;grid-template-columns:minmax(140px,1fr) minmax(160px,1.2fr) minmax(140px,.9fr) auto;gap:10px;align-items:end;padding:10px;border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;background:var(--md-sys-color-surface)}.array-fields-editor label{display:grid;gap:4px;font-size:.8rem;font-weight:600}.array-fields-editor input[type=text],.array-fields-editor select{box-sizing:border-box;width:100%;min-height:34px;border:1px solid var(--md-sys-color-outline-variant);border-radius:6px;background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface);padding:5px 8px}.array-fields-editor input[aria-invalid=true]{border-color:var(--md-sys-color-error)}.array-fields-editor__field-error{color:var(--md-sys-color-error);font-size:.75rem;font-weight:500;line-height:1.3}.array-fields-editor__check{display:flex!important;align-items:center;gap:6px;min-height:34px}.array-fields-editor__actions{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:6px}@media(max-width:720px){.array-fields-editor__header,.array-fields-editor__row{display:grid;grid-template-columns:1fr}.array-fields-editor__primary{width:100%}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ArrayItemSchemaFieldsEditorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'praxis-array-item-schema-fields-editor', standalone: true, imports: [ReactiveFormsModule], providers: [providePraxisMetadataEditorI18n()], template: `
+    <section
+      class="array-fields-editor"
+      [attr.data-schema-source]="schemaSourceState"
+      [attr.aria-label]="text('praxis.metadataEditor.arrayFields.section', 'Subcampos da cole\u00e7\u00e3o')"
+      >
+      <header class="array-fields-editor__header">
+        <div>
+          <h3>{{ text('praxis.metadataEditor.arrayFields.title', 'Subcampos') }}</h3>
+          <p>
+            {{ schemaStateDescription() }}
+          </p>
+        </div>
+        <button type="button" class="array-fields-editor__primary" (click)="addField()">
+          {{ text('praxis.metadataEditor.arrayFields.add', 'Adicionar subcampo') }}
+        </button>
+      </header>
+      @if (duplicateNames.length) {
+        <div
+          class="array-fields-editor__warning"
+          role="alert"
+          >
+          {{
+          text(
+          'praxis.metadataEditor.arrayFields.duplicateNames',
+          undefined,
+          'Existem nomes duplicados: {{names}}',
+          { names: duplicateNames.join(', ') }
+          )
+          }}
+        </div>
+      }
+      @if (formArray.length === 0) {
+        <div
+          class="array-fields-editor__empty"
+          >
+          {{ text('praxis.metadataEditor.arrayFields.empty', 'Nenhum subcampo local configurado.') }}
+        </div>
+      }
+      <div class="array-fields-editor__list" [formGroup]="form">
+        @for (row of rows; track row; let i = $index) {
+          <div
+            class="array-fields-editor__row"
+            [formGroup]="row"
+            >
+            <label>
+              <span>{{ text('praxis.metadataEditor.arrayFields.name', 'Nome') }}</span>
+              <input
+                type="text"
+                formControlName="name"
+                (blur)="onNameBlur(i)"
+                [attr.aria-invalid]="isNameInvalid(i) ? 'true' : null"
+                [attr.aria-describedby]="nameErrorDescribedBy(i)"
+                />
+              @if (nameErrorMessage(i); as nameError) {
+                <span
+                  class="array-fields-editor__field-error"
+                  [id]="nameErrorId(i)"
+                  >
+                  {{ nameError }}
+                </span>
+              }
+            </label>
+            <label>
+              <span>{{ text('praxis.metadataEditor.arrayFields.label', 'Label') }}</span>
+              <input type="text" formControlName="label" />
+            </label>
+            <label>
+              <span>{{ text('praxis.metadataEditor.arrayFields.controlType', 'Controle') }}</span>
+              <select formControlName="controlType">
+                @for (option of controlTypeOptions; track option) {
+                  <option [value]="option">
+                    {{ controlTypeLabel(option) }}
+                  </option>
+                }
+              </select>
+            </label>
+            <label class="array-fields-editor__check">
+              <input type="checkbox" formControlName="required" />
+              <span>{{ text('praxis.metadataEditor.arrayFields.required', 'Obrigat\u00f3rio') }}</span>
+            </label>
+            <div class="array-fields-editor__actions">
+              <button type="button" (click)="moveField(i, -1)" [disabled]="i === 0">
+                {{ text('praxis.metadataEditor.arrayFields.moveUp', 'Subir') }}
+              </button>
+              <button type="button" (click)="moveField(i, 1)" [disabled]="i === formArray.length - 1">
+                {{ text('praxis.metadataEditor.arrayFields.moveDown', 'Descer') }}
+              </button>
+              <button type="button" (click)="duplicateField(i)">
+                {{ text('praxis.metadataEditor.arrayFields.duplicate', 'Duplicar') }}
+              </button>
+              <button
+                type="button"
+                (click)="removeField(i)"
+                [disabled]="isReferenced(row.get('name')?.value)"
+                [title]="removeTitle(row.get('name')?.value)"
+                >
+                {{ text('praxis.metadataEditor.arrayFields.remove', 'Remover') }}
+              </button>
+            </div>
+          </div>
+        }
+      </div>
+    </section>
+    `, styles: [":host{display:block}.array-fields-editor{display:block;margin:10px 0 2px;padding:12px;border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;background:var(--md-sys-color-surface-container-low);color:var(--md-sys-color-on-surface)}.array-fields-editor__header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.array-fields-editor__header h3{margin:0 0 4px;font-size:1rem;line-height:1.25}.array-fields-editor__header p,.array-fields-editor__empty{margin:0;color:var(--md-sys-color-on-surface-variant);font-size:.875rem;line-height:1.35}.array-fields-editor__primary,.array-fields-editor button{border:1px solid var(--md-sys-color-outline-variant);border-radius:6px;background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface);cursor:pointer;min-height:32px;padding:5px 10px}.array-fields-editor__primary{border-color:var(--md-sys-color-primary);color:var(--md-sys-color-primary);font-weight:600;white-space:nowrap}.array-fields-editor button:disabled{cursor:not-allowed;opacity:.55}.array-fields-editor__warning{margin:8px 0 12px;padding:8px 10px;border:1px solid var(--md-sys-color-error);border-radius:6px;color:var(--md-sys-color-error);background:var(--md-sys-color-error-container)}.array-fields-editor__list{display:grid;gap:10px}.array-fields-editor__row{display:grid;grid-template-columns:minmax(140px,1fr) minmax(160px,1.2fr) minmax(140px,.9fr) auto;gap:10px;align-items:end;padding:10px;border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;background:var(--md-sys-color-surface)}.array-fields-editor label{display:grid;gap:4px;font-size:.8rem;font-weight:600}.array-fields-editor input[type=text],.array-fields-editor select{box-sizing:border-box;width:100%;min-height:34px;border:1px solid var(--md-sys-color-outline-variant);border-radius:6px;background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface);padding:5px 8px}.array-fields-editor input[aria-invalid=true]{border-color:var(--md-sys-color-error)}.array-fields-editor__field-error{color:var(--md-sys-color-error);font-size:.75rem;font-weight:500;line-height:1.3}.array-fields-editor__check{display:flex!important;align-items:center;gap:6px;min-height:34px}.array-fields-editor__actions{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:6px}@media(max-width:720px){.array-fields-editor__header,.array-fields-editor__row{display:grid;grid-template-columns:1fr}.array-fields-editor__primary{width:100%}}\n"] }]
+        }], propDecorators: { control: [{
+                type: Input
+            }], arrayControl: [{
+                type: Input
+            }] } });
 const inputProperties = [
     // Geral
     { name: 'label', label: 'Label', editorType: 'text', placeholder: 'Rótulo do campo', group: 'Geral' },
@@ -1105,7 +1951,7 @@ const arrayProperties = [
     { name: 'array.collectionValidation.atLeastOne.field', label: 'Pelo menos um: campo', editorType: 'text', group: 'Validacao' },
     { name: 'array.collectionValidation.atLeastOne.value', label: 'Pelo menos um: valor tipado', editorType: 'text', group: 'Validacao', hint: 'Use true/false, numero ou texto. Ex.: true, 1, ACTIVE.' },
     { name: 'array.collectionValidation.atLeastOne.message', label: 'Mensagem: pelo menos um', editorType: 'text', group: 'Validacao' },
-    { name: 'array.itemSchema.fields', label: 'Subcampos (JSON)', editorType: 'textarea', group: 'Subcampos', hint: 'Lista FieldMetadata[] usada quando nao houver itemSchemaRef resolvido.' },
+    { name: 'array.itemSchema.fields', label: 'Subcampos', editorType: 'field-list', group: 'Subcampos', hint: 'Lista FieldMetadata[] usada quando nao houver itemSchemaRef resolvido.' },
     { name: 'required', label: 'Obrigatorio', editorType: 'checkbox', group: 'Validacao' },
 ];
@@ -1278,8 +2124,39 @@ function cloneProperty$7(prop) {
             : prop.options,
     };
 }
+function cloneEntityLookupBaseProperty(prop) {
+    const cloned = cloneProperty$7(prop);
+    if (cloned.name === 'multiple') {
+        return {
+            ...cloned,
+            group: 'Selecao em colecao',
+            hint: 'Ativa selecao governada de varias entidades no mesmo campo.',
+        };
+    }
+    if (cloned.name === 'maxSelections') {
+        return {
+            ...cloned,
+            group: 'Selecao em colecao',
+            hint: 'Limite maximo de entidades selecionadas quando multiple=true.',
+        };
+    }
+    return cloned;
+}
 const entityLookupProperties = [
-    ...selectProperties.map((prop) => cloneProperty$7(prop)),
+    ...selectProperties.map((prop) => cloneEntityLookupBaseProperty(prop)),
+    {
+        name: 'payloadMode',
+        label: 'Modo do payload',
+        editorType: 'select',
+        group: 'Selecao em colecao',
+        options: [
+            { value: 'id', text: 'id' },
+            { value: 'entityRef', text: 'entityRef' },
+            { value: 'ids', text: 'ids' },
+            { value: 'entityRefs', text: 'entityRefs' },
+        ],
+        hint: 'Define o shape salvo no payload. O runtime resolve combinacoes invalidas conforme multiple.',
+    },
     {
         name: 'optionSource.key',
         label: 'Option source key',
@@ -1379,6 +2256,261 @@ const entityLookupProperties = [
         group: 'Exibicao de entidade',
         hint: 'Campo opcional com mensagem de bloqueio quando selectable=false.',
     },
+    {
+        name: 'optionSource.display.preset',
+        label: 'Preset canonico',
+        editorType: 'select',
+        group: 'Display canonico',
+        options: [
+            { value: 'compact', text: 'compact' },
+            { value: 'rich', text: 'rich' },
+            { value: 'directory', text: 'directory' },
+            { value: 'status', text: 'status' },
+            { value: 'reference', text: 'reference' },
+            { value: 'hierarchical', text: 'hierarchical' },
+        ],
+        hint: 'Intencao visual da entidade. Use directory para pessoas/equipes, reference para codigo + descricao e status quando o estado operacional for central.',
+    },
+    {
+        name: 'optionSource.display.usage',
+        label: 'Uso preferencial',
+        editorType: 'select',
+        group: 'Display canonico',
+        options: [
+            { value: 'form', text: 'form' },
+            { value: 'filter', text: 'filter' },
+            { value: 'table-cell', text: 'table-cell' },
+            { value: 'dashboard', text: 'dashboard' },
+            { value: 'wizard', text: 'wizard' },
+            { value: 'review', text: 'review' },
+        ],
+        hint: 'Contexto principal de uso desta option-source sem amarrar a regra a um componente especifico.',
+    },
+    {
+        name: 'optionSource.display.density',
+        label: 'Densidade',
+        editorType: 'select',
+        group: 'Display canonico',
+        options: [
+            { value: 'compact', text: 'compact' },
+            { value: 'comfortable', text: 'comfortable' },
+            { value: 'rich', text: 'rich' },
+        ],
+        hint: 'Densidade preferencial para runtimes. Filtros costumam usar compact; formularios, comfortable; revisoes, rich.',
+    },
+    {
+        name: 'optionSource.display.selectedLayout',
+        label: 'Layout selecionado canonico',
+        editorType: 'select',
+        group: 'Display canonico',
+        options: [
+            { value: 'card', text: 'card' },
+            { value: 'inline', text: 'inline' },
+            { value: 'compact', text: 'compact' },
+            { value: 'token', text: 'token' },
+        ],
+        hint: 'Layout preferencial do valor selecionado publicado pela option-source.',
+    },
+    {
+        name: 'optionSource.display.resultLayout',
+        label: 'Layout de resultados canonico',
+        editorType: 'select',
+        group: 'Display canonico',
+        options: [
+            { value: 'list', text: 'list' },
+            { value: 'denseList', text: 'denseList' },
+            { value: 'table', text: 'table' },
+            { value: 'card', text: 'card' },
+        ],
+        hint: 'Layout preferencial da lista de resultados publicado pela option-source.',
+    },
+    {
+        name: 'optionSource.display.primaryPropertyPath',
+        label: 'Campo primario',
+        editorType: 'text',
+        group: 'Display canonico',
+        hint: 'Campo semantico usado como titulo principal quando diferente de labelPropertyPath.',
+    },
+    {
+        name: 'optionSource.display.fields',
+        label: 'Campos ricos',
+        editorType: 'textarea',
+        group: 'Display canonico',
+        hint: 'JSON array de subinformacoes ricas. Ex.: [{ "key": "role", "propertyPath": "cargo.nome", "label": "Cargo", "icon": "work", "presentation": "text", "tone": "neutral" }, { "key": "department", "propertyPath": "departamento.nome", "label": "Departamento", "icon": "groups", "presentation": "chip", "tone": "info" }].',
+    },
+    {
+        name: 'optionSource.display.secondaryPropertyPaths',
+        label: 'Campos secundarios canonicos',
+        editorType: 'textarea',
+        group: 'Display canonico',
+        hint: 'JSON array ou uma linha por campo usado como subtitulo. Ex.: cargo.nome, departamento.nome.',
+    },
+    {
+        name: 'optionSource.display.badgePropertyPaths',
+        label: 'Campos de badges canonicos',
+        editorType: 'textarea',
+        group: 'Display canonico',
+        hint: 'JSON array ou uma linha por campo materializado como badge/chip.',
+    },
+    {
+        name: 'optionSource.display.avatarPropertyPath',
+        label: 'Campo de avatar',
+        editorType: 'text',
+        group: 'Display canonico',
+        hint: 'Campo usado para avatar/imagem; quando ausente, o runtime pode usar iniciais.',
+    },
+    {
+        name: 'optionSource.display.showAvatar',
+        label: 'Display: avatar',
+        editorType: 'checkbox',
+        group: 'Display canonico',
+    },
+    {
+        name: 'optionSource.display.showCode',
+        label: 'Display: codigo',
+        editorType: 'checkbox',
+        group: 'Display canonico',
+    },
+    {
+        name: 'optionSource.display.showDescription',
+        label: 'Display: descricao',
+        editorType: 'checkbox',
+        group: 'Display canonico',
+    },
+    {
+        name: 'optionSource.display.showStatus',
+        label: 'Display: status',
+        editorType: 'checkbox',
+        group: 'Display canonico',
+    },
+    {
+        name: 'optionSource.display.showBadges',
+        label: 'Display: badges',
+        editorType: 'checkbox',
+        group: 'Display canonico',
+    },
+    {
+        name: 'optionSource.display.showDisabledReason',
+        label: 'Display: motivo bloqueado',
+        editorType: 'checkbox',
+        group: 'Display canonico',
+    },
+    {
+        name: 'optionSource.display.showResultCount',
+        label: 'Display: contador de resultados',
+        editorType: 'checkbox',
+        group: 'Display canonico',
+    },
+    {
+        name: 'optionSource.display.statusToneMap',
+        label: 'Mapa canonico de tons',
+        editorType: 'textarea',
+        group: 'Display canonico',
+        hint: 'JSON object. Ex.: { "ACTIVE": "success", "BLOCKED": "danger" }.',
+    },
+    {
+        name: 'optionSource.display.badgeKeys',
+        label: 'Chaves canonicas de badges',
+        editorType: 'textarea',
+        group: 'Display canonico',
+        hint: 'JSON array ou uma linha por chave complementar de badge.',
+    },
+    {
+        name: 'optionSource.display.maxVisibleBadges',
+        label: 'Maximo canonico de badges',
+        editorType: 'number',
+        group: 'Display canonico',
+        hint: 'Limite preferencial de badges antes de overflow.',
+    },
+    {
+        name: 'selectedLayout',
+        label: 'Layout selecionado',
+        editorType: 'select',
+        group: 'Exibicao de entidade',
+        options: [
+            { value: 'card', text: 'card' },
+            { value: 'inline', text: 'inline' },
+            { value: 'compact', text: 'compact' },
+            { value: 'token', text: 'token' },
+        ],
+        hint: 'Layout do item selecionado no trigger ou card principal.',
+    },
+    {
+        name: 'resultLayout',
+        label: 'Layout dos resultados',
+        editorType: 'select',
+        group: 'Exibicao de entidade',
+        options: [
+            { value: 'list', text: 'list' },
+            { value: 'denseList', text: 'denseList' },
+            { value: 'table', text: 'table' },
+            { value: 'card', text: 'card' },
+        ],
+        hint: 'Layout principal usado na lista inline e no dialog.',
+    },
+    {
+        name: 'showCode',
+        label: 'Mostrar codigo',
+        editorType: 'checkbox',
+        group: 'Exibicao de entidade',
+    },
+    {
+        name: 'showDescription',
+        label: 'Mostrar descricao',
+        editorType: 'checkbox',
+        group: 'Exibicao de entidade',
+    },
+    {
+        name: 'showStatus',
+        label: 'Mostrar status',
+        editorType: 'checkbox',
+        group: 'Exibicao de entidade',
+    },
+    {
+        name: 'showAvatar',
+        label: 'Mostrar avatar',
+        editorType: 'checkbox',
+        group: 'Exibicao de entidade',
+    },
+    {
+        name: 'showBadges',
+        label: 'Mostrar badges',
+        editorType: 'checkbox',
+        group: 'Exibicao de entidade',
+    },
+    {
+        name: 'showDisabledReason',
+        label: 'Mostrar motivo bloqueado',
+        editorType: 'checkbox',
+        group: 'Exibicao de entidade',
+    },
+    {
+        name: 'showResultCount',
+        label: 'Mostrar contador de resultados',
+        editorType: 'checkbox',
+        group: 'Exibicao de entidade',
+    },
+    {
+        name: 'statusToneMap',
+        label: 'Mapa de tons de status',
+        editorType: 'textarea',
+        group: 'Exibicao de entidade',
+        hint: 'JSON object. Ex.: { \"ACTIVE\": \"success\", \"BLOCKED\": \"danger\" }.',
+    },
+    {
+        name: 'badgeKeys',
+        label: 'Chaves de badges',
+        editorType: 'textarea',
+        group: 'Exibicao de entidade',
+        hint: 'JSON array ou uma linha por chave complementar de badge.',
+    },
+    {
+        name: 'maxVisibleBadges',
+        label: 'Maximo de badges visiveis',
+        editorType: 'number',
+        group: 'Exibicao de entidade',
+        hint: 'Limita a quantidade de badges visiveis antes do overflow.',
+    },
     {
         name: 'optionSource.searchPropertyPaths',
         label: 'Campos de busca',
@@ -1413,6 +2545,48 @@ const entityLookupProperties = [
         defaultValue: true,
         hint: 'Mantem entidades ja selecionadas visiveis durante busca paginada.',
     },
+    {
+        name: 'optionSource.filtering.availableFilters',
+        label: 'Filtros disponiveis',
+        editorType: 'textarea',
+        group: 'Busca',
+        hint: 'JSON array de filtros estruturados. Ex.: [{ \"field\": \"status\", \"type\": \"enum\", \"operators\": [\"in\"] }].',
+    },
+    {
+        name: 'optionSource.filtering.defaultFilters',
+        label: 'Filtros padrao',
+        editorType: 'textarea',
+        group: 'Busca',
+        hint: 'JSON object. Ex.: { \"status\": [\"ACTIVE\"] }.',
+    },
+    {
+        name: 'optionSource.filtering.sortOptions',
+        label: 'Ordenacoes disponiveis',
+        editorType: 'textarea',
+        group: 'Busca',
+        hint: 'JSON array. Ex.: [{ \"key\": \"code:asc\", \"field\": \"code\", \"direction\": \"asc\", \"label\": \"Codigo\" }].',
+    },
+    {
+        name: 'optionSource.filtering.defaultSort',
+        label: 'Ordenacao padrao',
+        editorType: 'text',
+        group: 'Busca',
+        hint: 'Chave default do sort declarada em sortOptions.',
+    },
+    {
+        name: 'optionSource.filtering.quickFilterFields',
+        label: 'Campos de filtro rapido',
+        editorType: 'textarea',
+        group: 'Busca',
+        hint: 'JSON array ou uma linha por campo rapido no toolbar do lookup.',
+    },
+    {
+        name: 'optionSource.filtering.searchPlaceholder',
+        label: 'Placeholder canonico de busca',
+        editorType: 'text',
+        group: 'Busca',
+        hint: 'Fallback do optionSource.filtering quando o campo nao sobrescreve searchPlaceholder.',
+    },
     {
         name: 'optionSource.dependsOn',
         label: 'Dependencias',
@@ -1558,11 +2732,226 @@ const entityLookupProperties = [
         editorType: 'select',
         group: 'Navegacao',
         options: [
-            { value: 'route', text: 'Rota' },
+            { value: 'samePage', text: 'samePage' },
+            { value: 'newTab', text: 'newTab' },
+            { value: 'drawer', text: 'Drawer' },
+            { value: 'modal', text: 'Modal' },
+        ],
+    },
+    {
+        name: 'optionSource.detail.kind',
+        label: 'Tipo de detalhe',
+        editorType: 'select',
+        group: 'Navegacao',
+        options: [
+            { value: 'surface', text: 'surface' },
+            { value: 'route', text: 'route' },
+            { value: 'href', text: 'href' },
+        ],
+        hint: 'Use surface como contrato canonico de plataforma; route/href ficam como fallback legado.',
+    },
+    {
+        name: 'optionSource.detail.surfaceId',
+        label: 'Surface de detalhe',
+        editorType: 'text',
+        group: 'Navegacao',
+        hint: 'Id da surface item-level preferida. Ex.: view, detail.',
+    },
+    {
+        name: 'optionSource.detail.presentation',
+        label: 'Apresentacao da surface',
+        editorType: 'select',
+        group: 'Navegacao',
+        options: [
             { value: 'drawer', text: 'Drawer' },
-            { value: 'dialog', text: 'Dialog' },
-            { value: 'external', text: 'Externo' },
+            { value: 'modal', text: 'Modal' },
         ],
+        hint: 'Como o runtime deve materializar a surface de detalhe.',
+    },
+    {
+        name: 'optionSource.detail.preferredWidget',
+        label: 'Widget preferido',
+        editorType: 'text',
+        group: 'Navegacao',
+        hint: 'Hint semantico para autoria/discovery. Ex.: praxis-dynamic-form.',
+    },
+    {
+        name: 'optionSource.detail.mode',
+        label: 'Modo da surface',
+        editorType: 'select',
+        group: 'Navegacao',
+        options: [
+            { value: 'view', text: 'view' },
+            { value: 'edit', text: 'edit' },
+            { value: 'create', text: 'create' },
+        ],
+        hint: 'Modo semantico da surface de detalhe.',
+    },
+    {
+        name: 'optionSource.create.hrefTemplate',
+        label: 'Template create href',
+        editorType: 'text',
+        group: 'Navegacao',
+        hint: 'Template opcional de criacao publicado pelo optionSource.',
+    },
+    {
+        name: 'optionSource.create.routeTemplate',
+        label: 'Template create route',
+        editorType: 'text',
+        group: 'Navegacao',
+        hint: 'Rota opcional de criacao, por exemplo /suppliers/new.',
+    },
+    {
+        name: 'optionSource.create.openMode',
+        label: 'Modo de create',
+        editorType: 'select',
+        group: 'Navegacao',
+        options: [
+            { value: 'samePage', text: 'samePage' },
+            { value: 'newTab', text: 'newTab' },
+            { value: 'drawer', text: 'Drawer' },
+            { value: 'modal', text: 'Modal' },
+        ],
+    },
+    {
+        name: 'dialog.enabled',
+        label: 'Dialog habilitado',
+        editorType: 'checkbox',
+        group: 'Dialogo avancado',
+    },
+    {
+        name: 'dialog.title',
+        label: 'Titulo do dialog',
+        editorType: 'text',
+        group: 'Dialogo avancado',
+    },
+    {
+        name: 'dialog.size',
+        label: 'Tamanho do dialog',
+        editorType: 'select',
+        group: 'Dialogo avancado',
+        options: [
+            { value: 'sm', text: 'sm' },
+            { value: 'md', text: 'md' },
+            { value: 'lg', text: 'lg' },
+            { value: 'xl', text: 'xl' },
+            { value: 'full', text: 'full' },
+        ],
+    },
+    {
+        name: 'dialog.previewPanel',
+        label: 'Preview panel',
+        editorType: 'checkbox',
+        group: 'Dialogo avancado',
+    },
+    {
+        name: 'dialog.allowColumnChooser',
+        label: 'Permitir seletor de colunas',
+        editorType: 'checkbox',
+        group: 'Dialogo avancado',
+    },
+    {
+        name: 'dialog.allowSavedViews',
+        label: 'Permitir views salvas',
+        editorType: 'checkbox',
+        group: 'Dialogo avancado',
+    },
+    {
+        name: 'dialog.resultColumns',
+        label: 'Colunas do resultado',
+        editorType: 'textarea',
+        group: 'Dialogo avancado',
+        hint: 'JSON array. Ex.: [{ \"field\": \"code\", \"label\": \"Codigo\", \"kind\": \"code\", \"width\": \"140px\" }].',
+    },
+    {
+        name: 'dialog.openActionLabel',
+        label: 'Label abrir dialog',
+        editorType: 'text',
+        group: 'Dialogo avancado',
+    },
+    {
+        name: 'dialog.applyActionLabel',
+        label: 'Label aplicar dialog',
+        editorType: 'text',
+        group: 'Dialogo avancado',
+    },
+    {
+        name: 'dialog.cancelActionLabel',
+        label: 'Label cancelar dialog',
+        editorType: 'text',
+        group: 'Dialogo avancado',
+    },
+    {
+        name: 'detailActionLabel',
+        label: 'Label detalhe',
+        editorType: 'text',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'changeActionLabel',
+        label: 'Label trocar',
+        editorType: 'text',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'copyCodeActionLabel',
+        label: 'Label copiar codigo',
+        editorType: 'text',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'copyIdActionLabel',
+        label: 'Label copiar ID',
+        editorType: 'text',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'createActionLabel',
+        label: 'Label criar',
+        editorType: 'text',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'clearActionLabel',
+        label: 'Label limpar',
+        editorType: 'text',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'actions.showDetail',
+        label: 'Acao: detalhe',
+        editorType: 'checkbox',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'actions.showChange',
+        label: 'Acao: trocar',
+        editorType: 'checkbox',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'actions.showCopyCode',
+        label: 'Acao: copiar codigo',
+        editorType: 'checkbox',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'actions.showCopyId',
+        label: 'Acao: copiar ID',
+        editorType: 'checkbox',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'actions.showCreate',
+        label: 'Acao: criar',
+        editorType: 'checkbox',
+        group: 'Acoes do lookup',
+    },
+    {
+        name: 'actions.showClear',
+        label: 'Acao: limpar',
+        editorType: 'checkbox',
+        group: 'Acoes do lookup',
     },
 ];
@@ -3485,6 +4874,18 @@ const sliderProperties = [
     // Formato/Comportamento
     { name: 'step', label: 'Step', editorType: 'number', group: 'Formato/Comportamento', hint: 'Incremento entre valores (ex.: 1, 0.5). Combine com min/max.' },
     { name: 'thumbLabel', label: 'Thumb label', editorType: 'checkbox', group: 'Formato/Comportamento', hint: 'Exibe valor sobre o thumb ao arrastar.' },
+    { name: 'valueLabelDisplay', label: 'Value label', editorType: 'select', group: 'Formato/Comportamento', options: [
+            { value: 'off', text: 'Desligado' },
+            { value: 'auto', text: 'Ao interagir' },
+            { value: 'on', text: 'Sempre visivel' },
+        ], hint: 'Controla quando o valor aparece no thumb.' },
+    { name: 'valueLabelFormat', label: 'Formato do valor', editorType: 'select', group: 'Formato/Comportamento', options: [
+            { value: 'number', text: 'Numero' },
+            { value: 'percent', text: 'Percentual' },
+            { value: 'currency', text: 'Moeda' },
+            { value: 'compact', text: 'Compacto' },
+            { value: 'storage', text: 'Armazenamento' },
+        ], hint: 'Formatter declarativo para labels e aria-valuetext.' },
     { name: 'vertical', label: 'Vertical', editorType: 'checkbox', group: 'Formato/Comportamento', row: 'fmt.flags', inline: true, hint: 'Altera para eixo Y.' },
     { name: 'invert', label: 'Inverter', editorType: 'checkbox', group: 'Formato/Comportamento', row: 'fmt.flags', inline: true, hint: 'Inverte direção (direita→esquerda).' },
     { name: 'showTicks', label: 'Ticks', editorType: 'select', group: 'Formato/Comportamento', options: [
@@ -3492,6 +4893,26 @@ const sliderProperties = [
             { value: true, text: 'Com ticks' },
             { value: 'auto', text: 'Auto' },
         ], hint: 'Marcas na trilha; auto calcula com base no step.' },
+    { name: 'marks', label: 'Marcadores (JSON)', editorType: 'textarea', group: 'Formato/Comportamento', hint: 'Array JSON. Ex.: [{"value":0,"label":"Baixo"},{"value":100,"label":"Alto","tone":"danger"}].' },
+    { name: 'semanticBands', label: 'Bandas semanticas (JSON)', editorType: 'textarea', group: 'Formato/Comportamento', hint: 'Array JSON. Ex.: [{"start":0,"end":40,"label":"Saudavel","tone":"success"}].' },
+    { name: 'distribution', label: 'Distribuicao (JSON)', editorType: 'textarea', group: 'Formato/Comportamento', hint: 'Array JSON ou config de histograma compacto. Ex.: {"colorMode":"gradient","bins":[4,8,16,12,6]}.' },
+    { name: 'track', label: 'Track', editorType: 'select', group: 'Formato/Comportamento', options: [
+            { value: 'normal', text: 'Normal' },
+            { value: 'inverted', text: 'Invertido' },
+            { value: 'none', text: 'Sem track ativo' },
+        ], hint: 'Apresentacao visual do track.' },
+    { name: 'size', label: 'Tamanho', editorType: 'select', group: 'Formato/Comportamento', options: [
+            { value: 'small', text: 'Pequeno' },
+            { value: 'medium', text: 'Medio' },
+            { value: 'large', text: 'Grande' },
+        ], hint: 'Densidade visual do slider.' },
+    { name: 'scale', label: 'Escala', editorType: 'select', group: 'Formato/Comportamento', options: [
+            { value: 'linear', text: 'Linear' },
+            { value: 'percent', text: 'Percentual' },
+            { value: 'log', text: 'Logaritmica' },
+            { value: 'pow2', text: 'Potencia 2' },
+        ], hint: 'Escala declarativa para dominios nao lineares.' },
+    { name: 'shiftStep', label: 'Shift step', editorType: 'number', group: 'Formato/Comportamento', hint: 'Incremento acelerado para teclado.' },
     { name: 'discrete', label: 'Discreto', editorType: 'checkbox', group: 'Formato/Comportamento', hint: 'Exibe ticks/labels fixos para valores discretos.' },
     // Validação
     { name: 'min', label: 'Mínimo', editorType: 'number', group: 'Validação', row: 'val.minmax', inline: true },
@@ -3531,11 +4952,44 @@ const rangeSliderProperties = [
         ], hint: 'Escolha faixa para dois marcadores.' },
     { name: 'step', label: 'Step', editorType: 'number', group: 'Formato/Comportamento', hint: 'Incremento entre valores (ex.: 1, 0.5). Combine com min/max.' },
     { name: 'thumbLabel', label: 'Thumb label', editorType: 'checkbox', group: 'Formato/Comportamento', hint: 'Exibe o valor sobre o thumb ao arrastar.' },
+    { name: 'valueLabelDisplay', label: 'Value label', editorType: 'select', group: 'Formato/Comportamento', options: [
+            { value: 'off', text: 'Desligado' },
+            { value: 'auto', text: 'Ao interagir' },
+            { value: 'on', text: 'Sempre visivel' },
+        ], hint: 'Controla quando o valor aparece no thumb.' },
+    { name: 'valueLabelFormat', label: 'Formato do valor', editorType: 'select', group: 'Formato/Comportamento', options: [
+            { value: 'number', text: 'Numero' },
+            { value: 'percent', text: 'Percentual' },
+            { value: 'currency', text: 'Moeda' },
+            { value: 'compact', text: 'Compacto' },
+            { value: 'storage', text: 'Armazenamento' },
+        ], hint: 'Formatter declarativo para labels e aria-valuetext.' },
     { name: 'showTicks', label: 'Ticks', editorType: 'select', group: 'Formato/Comportamento', options: [
             { value: false, text: 'Sem ticks' },
             { value: true, text: 'Com ticks' },
             { value: 'auto', text: 'Auto' },
         ], hint: 'Marcas na trilha; auto calcula com base no step.' },
+    { name: 'marks', label: 'Marcadores (JSON)', editorType: 'textarea', group: 'Formato/Comportamento', hint: 'Array JSON. Ex.: [{"value":0,"label":"Min"},{"value":100,"label":"Max","tone":"danger"}].' },
+    { name: 'semanticBands', label: 'Bandas semanticas (JSON)', editorType: 'textarea', group: 'Formato/Comportamento', hint: 'Array JSON. Ex.: [{"start":0,"end":40,"label":"Baixo","tone":"success"}].' },
+    { name: 'distribution', label: 'Distribuicao (JSON)', editorType: 'textarea', group: 'Formato/Comportamento', hint: 'Array JSON ou config de histograma compacto. Ex.: {"colorMode":"gradient","bins":[4,8,16,12,6]}.' },
+    { name: 'track', label: 'Track', editorType: 'select', group: 'Formato/Comportamento', options: [
+            { value: 'normal', text: 'Normal' },
+            { value: 'inverted', text: 'Invertido' },
+            { value: 'none', text: 'Sem track ativo' },
+        ], hint: 'Apresentacao visual do track.' },
+    { name: 'size', label: 'Tamanho', editorType: 'select', group: 'Formato/Comportamento', options: [
+            { value: 'small', text: 'Pequeno' },
+            { value: 'medium', text: 'Medio' },
+            { value: 'large', text: 'Grande' },
+        ], hint: 'Densidade visual do slider.' },
+    { name: 'scale', label: 'Escala', editorType: 'select', group: 'Formato/Comportamento', options: [
+            { value: 'linear', text: 'Linear' },
+            { value: 'percent', text: 'Percentual' },
+            { value: 'log', text: 'Logaritmica' },
+            { value: 'pow2', text: 'Potencia 2' },
+        ], hint: 'Escala declarativa para dominios nao lineares.' },
+    { name: 'shiftStep', label: 'Shift step', editorType: 'number', group: 'Formato/Comportamento', hint: 'Incremento acelerado para teclado.' },
+    { name: 'disableThumbSwap', label: 'Bloquear troca dos thumbs', editorType: 'checkbox', group: 'Formato/Comportamento', hint: 'Mantem start/end sem permitir inversao visual no modo range.' },
     { name: 'discrete', label: 'Discreto', editorType: 'checkbox', group: 'Formato/Comportamento', hint: 'Mostra valor fixo por tick; use com showTicks.' },
     { name: 'readonly', label: 'Somente leitura', editorType: 'checkbox', group: 'Formato/Comportamento', row: 'comp.state', inline: true, hint: 'Mantém o valor renderizado sem permitir ajuste do slider.' },
     { name: 'disabled', label: 'Desabilitado', editorType: 'checkbox', group: 'Formato/Comportamento', row: 'comp.state', inline: true, hint: 'Desativa arraste, foco e presets rápidos.' },
@@ -5678,6 +7132,7 @@ const INLINE_FILTER_EDITOR_PROPERTIES_BY_CONTROL_TYPE = Object.freeze({
     [INLINE_FILTER_CONTROL_TYPES.AUTOCOMPLETE]: selectProperties,
     [INLINE_FILTER_CONTROL_TYPES.MULTI_SELECT]: selectProperties,
     [INLINE_FILTER_CONTROL_TYPES.INPUT]: inputProperties,
+    [INLINE_FILTER_CONTROL_TYPES.PHONE]: inputProperties,
     [INLINE_FILTER_CONTROL_TYPES.TOGGLE]: toggleProperties,
     [INLINE_FILTER_CONTROL_TYPES.RANGE]: rangeSliderProperties,
     [INLINE_FILTER_CONTROL_TYPES.PERIOD_RANGE]: rangeSliderProperties,
@@ -5717,6 +7172,7 @@ class FieldMetadataEditorComponent {
     cancel = new EventEmitter();
     form;
     normalizedProps = [];
+    renderedProps = [];
     initialSnapshot = null;
     baselineReady = false;
     // Lista de tipos suportados no editor (curada para os tipos com config disponível)
@@ -6179,6 +7635,7 @@ class FieldMetadataEditorComponent {
             }
         }
         catch { }
+        this.renderedProps = this.buildRenderedProps(this.normalizedProps);
         // Register contextual validators for INPUT/TEXTAREA (minLength <= maxLength)
         if (this.controlType === FieldControlType.INPUT ||
             this.controlType === FieldControlType.TEXTAREA) {
@@ -6393,6 +7850,9 @@ class FieldMetadataEditorComponent {
         });
     }
     apply() {
+        if (!this.canEmitSettingsValue()) {
+            return;
+        }
         const raw = this.factory.extractPatch(this.form);
         const patch = this.buildDeltaPatch(raw, this.initialSnapshot);
         this.normalizeKnownTextareaPatchValues(patch);
@@ -6420,6 +7880,9 @@ class FieldMetadataEditorComponent {
     }
     // Settings Panel value provider API
     getSettingsValue() {
+        if (!this.canEmitSettingsValue()) {
+            return {};
+        }
         const raw = this.factory.extractPatch(this.form);
         const patch = this.buildDeltaPatch(raw, this.initialSnapshot);
         this.normalizeKnownTextareaPatchValues(patch);
@@ -6524,17 +7987,38 @@ class FieldMetadataEditorComponent {
     }
     normalizeEntityLookupPatchValues(patch) {
         const optionSource = patch?.optionSource;
-        if (!optionSource || typeof optionSource !== 'object') {
-            return;
+        if (optionSource && typeof optionSource === 'object') {
+            this.normalizeStringListProperty(optionSource, 'descriptionPropertyPaths');
+            this.normalizeStringListProperty(optionSource, 'searchPropertyPaths');
+            this.normalizeStringListProperty(optionSource, 'dependsOn');
+            this.normalizeJsonObjectProperty(optionSource, 'dependencyFilterMap');
+            this.normalizeJsonObjectProperty(optionSource, 'create');
+            const selectionPolicy = optionSource.selectionPolicy;
+            if (selectionPolicy && typeof selectionPolicy === 'object') {
+                this.normalizeStringListProperty(selectionPolicy, 'allowedStatuses');
+                this.normalizeStringListProperty(selectionPolicy, 'blockedStatuses');
+            }
+            const filtering = optionSource.filtering;
+            if (filtering && typeof filtering === 'object') {
+                this.normalizeJsonArrayProperty(filtering, 'availableFilters');
+                this.normalizeJsonObjectProperty(filtering, 'defaultFilters');
+                this.normalizeJsonArrayProperty(filtering, 'sortOptions');
+                this.normalizeStringListProperty(filtering, 'quickFilterFields');
+            }
+            const display = optionSource.display;
+            if (display && typeof display === 'object') {
+                this.normalizeJsonArrayProperty(display, 'fields');
+                this.normalizeStringListProperty(display, 'secondaryPropertyPaths');
+                this.normalizeStringListProperty(display, 'badgePropertyPaths');
+                this.normalizeStringListProperty(display, 'badgeKeys');
+                this.normalizeJsonObjectProperty(display, 'statusToneMap');
+            }
         }
-        this.normalizeStringListProperty(optionSource, 'descriptionPropertyPaths');
-        this.normalizeStringListProperty(optionSource, 'searchPropertyPaths');
-        this.normalizeStringListProperty(optionSource, 'dependsOn');
-        this.normalizeJsonObjectProperty(optionSource, 'dependencyFilterMap');
-        const selectionPolicy = optionSource.selectionPolicy;
-        if (selectionPolicy && typeof selectionPolicy === 'object') {
-            this.normalizeStringListProperty(selectionPolicy, 'allowedStatuses');
-            this.normalizeStringListProperty(selectionPolicy, 'blockedStatuses');
+        this.normalizeStringListProperty(patch, 'badgeKeys');
+        this.normalizeJsonObjectProperty(patch, 'statusToneMap');
+        const dialog = patch?.dialog;
+        if (dialog && typeof dialog === 'object') {
+            this.normalizeJsonArrayProperty(dialog, 'resultColumns');
         }
     }
     normalizeStringListProperty(target, key) {
@@ -6555,6 +8039,15 @@ class FieldMetadataEditorComponent {
             target[key] = parsed;
         }
     }
+    normalizeJsonArrayProperty(target, key) {
+        if (!target || typeof target !== 'object' || typeof target[key] !== 'string') {
+            return;
+        }
+        const parsed = this.parseArrayTextarea(target[key]);
+        if (parsed) {
+            target[key] = parsed;
+        }
+    }
     normalizeArrayPatchValues(patch) {
         const arrayPatch = patch?.array;
         if (!arrayPatch || typeof arrayPatch !== 'object') {
@@ -6663,7 +8156,11 @@ class FieldMetadataEditorComponent {
         }
     }
     reset() {
-        this.form.reset(this.factory.extractPatch(this.form));
+        const snapshot = this.cloneSnapshot(this.initialSnapshot ?? this.form.getRawValue());
+        this.form.reset(snapshot);
+        this.form.markAsPristine();
+        this.form.markAsUntouched();
+        this.form.updateValueAndValidity({ emitEvent: true });
         this.isDirty$.next(false);
     }
     onControlTypeChange(next) {
@@ -6681,30 +8178,167 @@ class FieldMetadataEditorComponent {
         const missingSharedProps = fieldSubmitProperties.filter((prop) => !propNames.has(prop.name));
         return missingSharedProps.length ? [...props, ...missingSharedProps] : props;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: FieldMetadataEditorComponent, deps: [{ token: ConfigRegistryService }, { token: SchemaNormalizerService }, { token: DynamicFormFactoryService }, { token: ContextValidatorRegistryService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: FieldMetadataEditorComponent, isStandalone: true, selector: "praxis-field-metadata-editor", inputs: { controlType: "controlType", seed: "seed" }, outputs: { applied: "applied", cancel: "cancel" }, ngImport: i0, template: `
-    <div class="p-3" *ngIf="form">
-      <praxis-dynamic-editor-renderer
-        [properties]="normalizedProps"
-        [form]="form"
-      ></praxis-dynamic-editor-renderer>
-    </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: DynamicEditorRendererComponent, selector: "praxis-dynamic-editor-renderer", inputs: ["properties", "form"] }] });
+    get isArrayEditor() {
+        return this.controlType === FieldControlType.ARRAY_INPUT;
+    }
+    buildRenderedProps(props) {
+        if (!this.isArrayEditor) {
+            return props;
+        }
+        return (props || []).filter((prop) => prop?.name !== 'array.itemSchema.fields');
+    }
+    cloneSnapshot(value) {
+        return this.cloneMetadataValue(value, new WeakMap());
+    }
+    cloneMetadataValue(value, seen) {
+        if (!value || typeof value !== 'object') {
+            return value;
+        }
+        if (seen.has(value)) {
+            return seen.get(value);
+        }
+        if (value instanceof Date) {
+            return new Date(value.getTime());
+        }
+        if (value instanceof RegExp) {
+            return new RegExp(value.source, value.flags);
+        }
+        if (Array.isArray(value)) {
+            const clone = [];
+            seen.set(value, clone);
+            clone.push(...value.map((entry) => this.cloneMetadataValue(entry, seen)));
+            return clone;
+        }
+        if (value instanceof Map) {
+            const clone = new Map();
+            seen.set(value, clone);
+            value.forEach((entry, key) => {
+                clone.set(this.cloneMetadataValue(key, seen), this.cloneMetadataValue(entry, seen));
+            });
+            return clone;
+        }
+        if (value instanceof Set) {
+            const clone = new Set();
+            seen.set(value, clone);
+            value.forEach((entry) => clone.add(this.cloneMetadataValue(entry, seen)));
+            return clone;
+        }
+        const prototype = Object.getPrototypeOf(value);
+        if (prototype !== Object.prototype && prototype !== null) {
+            return value;
+        }
+        const clone = {};
+        seen.set(value, clone);
+        for (const [key, entry] of Object.entries(value)) {
+            clone[key] = this.cloneMetadataValue(entry, seen);
+        }
+        return clone;
+    }
+    canEmitSettingsValue() {
+        this.validateArrayItemSchemaFields();
+        this.form.updateValueAndValidity({ emitEvent: true });
+        const valid = this.form.valid;
+        this.isValid$.next(valid);
+        if (!valid) {
+            this.form.markAllAsTouched();
+        }
+        return valid;
+    }
+    validateArrayItemSchemaFields() {
+        if (!this.isArrayEditor) {
+            return;
+        }
+        const control = this.form.get('array.itemSchema.fields');
+        if (!control) {
+            return;
+        }
+        const value = control.value;
+        const fields = Array.isArray(value)
+            ? value
+            : typeof value === 'string' && value.trim()
+                ? this.parseArrayItemFields(value)
+                : [];
+        const seen = new Set();
+        const duplicated = new Set();
+        let hasEmptyName = false;
+        for (const field of fields) {
+            const name = String(field?.name || '').trim();
+            if (!name) {
+                hasEmptyName = true;
+                continue;
+            }
+            if (seen.has(name)) {
+                duplicated.add(name);
+            }
+            seen.add(name);
+        }
+        this.setControlError(control, 'arrayFieldNameRequired', hasEmptyName);
+        this.setControlError(control, 'arrayFieldNameDuplicated', duplicated.size ? { names: Array.from(duplicated) } : null);
+    }
+    parseArrayItemFields(value) {
+        try {
+            const parsed = JSON.parse(value);
+            return Array.isArray(parsed) ? parsed : [];
+        }
+        catch {
+            return [];
+        }
+    }
+    setControlError(control, key, value) {
+        const errors = { ...(control.errors || {}) };
+        const hasError = value !== null && value !== undefined && value !== false;
+        if (hasError) {
+            errors[key] = value === true ? true : value;
+        }
+        else {
+            delete errors[key];
+        }
+        control.setErrors(Object.keys(errors).length ? errors : null);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: FieldMetadataEditorComponent, deps: [{ token: ConfigRegistryService }, { token: SchemaNormalizerService }, { token: DynamicFormFactoryService }, { token: ContextValidatorRegistryService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: FieldMetadataEditorComponent, isStandalone: true, selector: "praxis-field-metadata-editor", inputs: { controlType: "controlType", seed: "seed" }, outputs: { applied: "applied", cancel: "cancel" }, ngImport: i0, template: `
+    @if (form) {
+      <div class="p-3">
+        <praxis-dynamic-editor-renderer
+          [properties]="renderedProps"
+          [form]="form"
+        ></praxis-dynamic-editor-renderer>
+        @if (isArrayEditor) {
+          <praxis-array-item-schema-fields-editor
+            [control]="form.get('array.itemSchema.fields')"
+            [arrayControl]="form.get('array')"
+          ></praxis-array-item-schema-fields-editor>
+        }
+      </div>
+    }
+    `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: DynamicEditorRendererComponent, selector: "praxis-dynamic-editor-renderer", inputs: ["properties", "form"] }, { kind: "component", type: ArrayItemSchemaFieldsEditorComponent, selector: "praxis-array-item-schema-fields-editor", inputs: ["control", "arrayControl"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: FieldMetadataEditorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: FieldMetadataEditorComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'praxis-field-metadata-editor',
                     standalone: true,
-                    imports: [CommonModule, ReactiveFormsModule, DynamicEditorRendererComponent],
+                    imports: [
+                        ReactiveFormsModule,
+                        DynamicEditorRendererComponent,
+                        ArrayItemSchemaFieldsEditorComponent
+                    ],
                     template: `
-    <div class="p-3" *ngIf="form">
-      <praxis-dynamic-editor-renderer
-        [properties]="normalizedProps"
-        [form]="form"
-      ></praxis-dynamic-editor-renderer>
-    </div>
-  `,
+    @if (form) {
+      <div class="p-3">
+        <praxis-dynamic-editor-renderer
+          [properties]="renderedProps"
+          [form]="form"
+        ></praxis-dynamic-editor-renderer>
+        @if (isArrayEditor) {
+          <praxis-array-item-schema-fields-editor
+            [control]="form.get('array.itemSchema.fields')"
+            [arrayControl]="form.get('array')"
+          ></praxis-array-item-schema-fields-editor>
+        }
+      </div>
+    }
+    `,
                 }]
         }], ctorParameters: () => [{ type: ConfigRegistryService }, { type: SchemaNormalizerService }, { type: DynamicFormFactoryService }, { type: ContextValidatorRegistryService }], propDecorators: { controlType: [{
                 type: Input
@@ -6771,10 +8405,10 @@ class CascadeRulesService {
             dependencyValuePath: rule.dependencyValuePath || inferredValueKey || 'id',
         };
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: CascadeRulesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: CascadeRulesService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: CascadeRulesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: CascadeRulesService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: CascadeRulesService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: CascadeRulesService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -6788,10 +8422,10 @@ class CascadeManagerTabComponent {
     searchTerm = '';
     searchTimer = null;
     searchValue = '';
-    rules = signal(new Map(), ...(ngDevMode ? [{ debugName: "rules" }] : []));
-    selectedFieldSig = signal(null, ...(ngDevMode ? [{ debugName: "selectedFieldSig" }] : []));
+    rules = signal(new Map(), ...(ngDevMode ? [{ debugName: "rules" }] : /* istanbul ignore next */ []));
+    selectedFieldSig = signal(null, ...(ngDevMode ? [{ debugName: "selectedFieldSig" }] : /* istanbul ignore next */ []));
     // Inline editor state (MVP)
-    editing = signal(false, ...(ngDevMode ? [{ debugName: "editing" }] : []));
+    editing = signal(false, ...(ngDevMode ? [{ debugName: "editing" }] : /* istanbul ignore next */ []));
     editDepList = [];
     editEnable = true;
     editReset = false;
@@ -7143,8 +8777,8 @@ class CascadeManagerTabComponent {
         }
         return [...new Set(suggestions)];
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: CascadeManagerTabComponent, deps: [{ token: CascadeRulesService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: CascadeManagerTabComponent, isStandalone: true, selector: "praxis-cascade-manager-tab", inputs: { fields: "fields", connections: "connections" }, outputs: { apply: "apply", cancel: "cancel" }, usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: CascadeManagerTabComponent, deps: [{ token: CascadeRulesService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: CascadeManagerTabComponent, isStandalone: true, selector: "praxis-cascade-manager-tab", inputs: { fields: "fields", connections: "connections" }, outputs: { apply: "apply", cancel: "cancel" }, usesOnChanges: true, ngImport: i0, template: `
     <div class="cm-root">
       <!-- Left: Fields list -->
       <div class="cm-left">
@@ -7152,276 +8786,301 @@ class CascadeManagerTabComponent {
           <mat-label>Buscar campos</mat-label>
           <input matInput [ngModel]="searchTerm" (ngModelChange)="onSearchChange($event)">
         </mat-form-field>
-        <ng-container *ngIf="fields.length <= 50; else vscroll">
+        @if (fields.length <= 50) {
           <div>
-            <div *ngFor="let f of filteredFields()" (click)="selectField(f.name)" class="field-item" [class.selected]="f.name===selectedField()" tabindex="0" (keydown)="onFieldKeydown($event, f.name)">
-              <div>
-                <div>{{ labelFor(f.name) }}</div>
-                <small style="opacity:.7">{{ f.name }}</small>
-              </div>
-              <div class="rule-badges" *ngIf="hasRule(f.name)">
-                <span class="rule-badge b-active" *ngIf="isCascadeEnabled(f.name)">Ativo</span>
-                <span class="rule-badge b-manual" *ngIf="loadOnChange(f.name)==='manual'">Manual</span>
-                <span class="rule-badge b-immediate" *ngIf="loadOnChange(f.name)==='immediate'">Immediate</span>
+            @for (f of filteredFields(); track f) {
+              <div (click)="selectField(f.name)" class="field-item" [class.selected]="f.name===selectedField()" tabindex="0" (keydown)="onFieldKeydown($event, f.name)">
+                <div>
+                  <div>{{ labelFor(f.name) }}</div>
+                  <small style="opacity:.7">{{ f.name }}</small>
+                </div>
+                @if (hasRule(f.name)) {
+                  <div class="rule-badges">
+                    @if (isCascadeEnabled(f.name)) {
+                      <span class="rule-badge b-active">Ativo</span>
+                    }
+                    @if (loadOnChange(f.name)==='manual') {
+                      <span class="rule-badge b-manual">Manual</span>
+                    }
+                    @if (loadOnChange(f.name)==='immediate') {
+                      <span class="rule-badge b-immediate">Immediate</span>
+                    }
+                  </div>
+                }
               </div>
-            </div>
+            }
           </div>
-        </ng-container>
-        <ng-template #vscroll>
+        } @else {
           <cdk-virtual-scroll-viewport itemSize="44" style="height: calc(100vh - 240px)">
             <div *cdkVirtualFor="let f of filteredFields()" (click)="selectField(f.name)" class="field-item" [class.selected]="f.name===selectedField()" tabindex="0" (keydown)="onFieldKeydown($event, f.name)">
               <div>
                 <div>{{ labelFor(f.name) }}</div>
                 <small style="opacity:.7">{{ f.name }}</small>
               </div>
-              <div class="rule-badges" *ngIf="hasRule(f.name)">
-                <span class="rule-badge b-active" *ngIf="isCascadeEnabled(f.name)">Ativo</span>
-                <span class="rule-badge b-manual" *ngIf="loadOnChange(f.name)==='manual'">Manual</span>
-                <span class="rule-badge b-immediate" *ngIf="loadOnChange(f.name)==='immediate'">Immediate</span>
-              </div>
+              @if (hasRule(f.name)) {
+                <div class="rule-badges">
+                  @if (isCascadeEnabled(f.name)) {
+                    <span class="rule-badge b-active">Ativo</span>
+                  }
+                  @if (loadOnChange(f.name)==='manual') {
+                    <span class="rule-badge b-manual">Manual</span>
+                  }
+                  @if (loadOnChange(f.name)==='immediate') {
+                    <span class="rule-badge b-immediate">Immediate</span>
+                  }
+                </div>
+              }
             </div>
           </cdk-virtual-scroll-viewport>
-        </ng-template>
+        }
       </div>
       <!-- Right: Rules for selected field -->
-      <div class="cm-right" *ngIf="selectedField() as sel">
-        <div class="cm-header">
-          <div>
-            <h3 style="margin:0">{{ labelFor(sel) }}</h3>
-            <div style="opacity:.7">{{ sel }}</div>
-          </div>
-          <div>
-            <button mat-stroked-button color="primary" (click)="exportRules()" style="margin-right:8px">Exportar</button>
-            <button mat-stroked-button (click)="toggleImport()" style="margin-right:8px">Importar</button>
-            <button mat-flat-button color="primary" [matMenuTriggerFor]="addMenu" [disabled]="editing()">Adicionar</button>
-            <mat-menu #addMenu="matMenu">
-              <button mat-menu-item (click)="startEdit(sel)"><mat-icon [praxisIcon]="'add'"></mat-icon><span>Em branco</span></button>
-              <button mat-menu-item (click)="startTemplate(sel, 'rota-destino')" [disabled]="!hasField('rotaId') || !hasField('destinoReqId')"><mat-icon [praxisIcon]="'bolt'"></mat-icon><span>Rota → Destino (id)</span></button>
-              <button mat-menu-item (click)="startTemplate(sel, 'rota-destino-propriedade')" [disabled]="!hasField('rotaId') || !hasField('destinoReqId')"><mat-icon [praxisIcon]="'bolt'"></mat-icon><span>Rota + Destino → Propriedade (ids)</span></button>
-            </mat-menu>
-          </div>
-        </div>
-        <!-- Conflict banner (connections) -->
-        <div class="banner" *ngIf="hasConflict(sel)">
-          <mat-icon [praxisIcon]="'link_off'"></mat-icon>
-          <div>
-            Connections atualizam este campo (filterCriteria). Considere desativar a cascata nativa ou usar ‘manual’.
-          </div>
-          <span class="spacer"></span>
-          <button mat-stroked-button color="primary" (click)="quickSet(sel,'disable')">Desativar</button>
-          <button mat-stroked-button color="accent" (click)="quickSet(sel,'manual')">Definir manual</button>
-        </div>
-        <div *ngIf="importMode" class="import-panel">
-          <div style="display:flex; gap:8px; align-items:center; margin-bottom:8px"><mat-icon [praxisIcon]="'upload'"></mat-icon><strong>Importar regras (JSON)</strong></div>
-          <textarea matInput rows="6" class="full" [(ngModel)]="importJson" placeholder='{ "campo": { "dependencyFields": ["dep"], ... } }'></textarea>
-          <div style="display:flex; gap:8px; justify-content:flex-end; padding-top:8px">
-            <button mat-stroked-button (click)="toggleImport()">Cancelar</button>
-            <button mat-flat-button color="primary" (click)="applyImport()">Aplicar</button>
-          </div>
-        </div>
-        <div *ngIf="!ruleFor(sel)">
-          <div class="rules-empty">Nenhuma cascata configurada. Clique em “Adicionar” para montar a dependência.</div>
-        </div>
-        <div *ngIf="ruleFor(sel) as rule">
-          <div class="rule-row">
+      @if (selectedField(); as sel) {
+        <div class="cm-right">
+          <div class="cm-header">
             <div>
-              <div><strong>Dependentes:</strong> {{ rule.dependencyFields.join(', ') || '—' }}</div>
-              <div style="opacity:.7">Load on change: {{ rule.dependencyLoadOnChange || 'respectLoadOn' }} | Merge: {{ rule.dependencyMergeStrategy || 'merge' }}</div>
+              <h3 style="margin:0">{{ labelFor(sel) }}</h3>
+              <div style="opacity:.7">{{ sel }}</div>
             </div>
-            <div class="rule-actions">
-              <button mat-icon-button matTooltip="Editar" (click)="startEdit(sel)"><mat-icon [praxisIcon]="'edit'"></mat-icon></button>
-              <button mat-icon-button matTooltip="Duplicar" disabled><mat-icon [praxisIcon]="'content_copy'"></mat-icon></button>
-              <button mat-icon-button matTooltip="Remover" (click)="remove(sel)"><mat-icon [praxisIcon]="'delete'"></mat-icon></button>
+            <div>
+              <button mat-stroked-button color="primary" (click)="exportRules()" style="margin-right:8px">Exportar</button>
+              <button mat-stroked-button (click)="toggleImport()" style="margin-right:8px">Importar</button>
+              <button mat-flat-button color="primary" [matMenuTriggerFor]="addMenu" [disabled]="editing()">Adicionar</button>
+              <mat-menu #addMenu="matMenu">
+                <button mat-menu-item (click)="startEdit(sel)"><mat-icon [praxisIcon]="'add'"></mat-icon><span>Em branco</span></button>
+                <button mat-menu-item (click)="startTemplate(sel, 'rota-destino')" [disabled]="!hasField('rotaId') || !hasField('destinoReqId')"><mat-icon [praxisIcon]="'bolt'"></mat-icon><span>Rota → Destino (id)</span></button>
+                <button mat-menu-item (click)="startTemplate(sel, 'rota-destino-propriedade')" [disabled]="!hasField('rotaId') || !hasField('destinoReqId')"><mat-icon [praxisIcon]="'bolt'"></mat-icon><span>Rota + Destino → Propriedade (ids)</span></button>
+              </mat-menu>
             </div>
           </div>
-        </div>
-        <!-- Editor com seções (sem acordeão duplo) -->
-        <div class="panel-surface">
-          <div class="panel-header" style="padding: 12px 16px; border-bottom: 1px solid var(--md-sys-color-outline-variant);">
-            <mat-icon [praxisIcon]="'rule'"></mat-icon>
+          <!-- Conflict banner (connections) -->
+          @if (hasConflict(sel)) {
+            <div class="banner">
+              <mat-icon [praxisIcon]="'link_off'"></mat-icon>
+              <div>
+                Connections atualizam este campo (filterCriteria). Considere desativar a cascata nativa ou usar ‘manual’.
+              </div>
+              <span class="spacer"></span>
+              <button mat-stroked-button color="primary" (click)="quickSet(sel,'disable')">Desativar</button>
+              <button mat-stroked-button color="accent" (click)="quickSet(sel,'manual')">Definir manual</button>
+            </div>
+          }
+          @if (importMode) {
+            <div class="import-panel">
+              <div style="display:flex; gap:8px; align-items:center; margin-bottom:8px"><mat-icon [praxisIcon]="'upload'"></mat-icon><strong>Importar regras (JSON)</strong></div>
+              <textarea matInput rows="6" class="full" [(ngModel)]="importJson" placeholder='{ "campo": { "dependencyFields": ["dep"], ... } }'></textarea>
+              <div style="display:flex; gap:8px; justify-content:flex-end; padding-top:8px">
+                <button mat-stroked-button (click)="toggleImport()">Cancelar</button>
+                <button mat-flat-button color="primary" (click)="applyImport()">Aplicar</button>
+              </div>
+            </div>
+          }
+          @if (!ruleFor(sel)) {
             <div>
-              <div>Cascata do campo</div>
-              <small style="color: var(--md-sys-color-on-surface-variant);">Defina dependentes, quando recarregar e como mapear filtros</small>
+              <div class="rules-empty">Nenhuma cascata configurada. Clique em “Adicionar” para montar a dependência.</div>
             </div>
-          </div>
-          <div class="panel-stack">
-            <!-- Básico -->
-            <mat-expansion-panel [expanded]="true" class="stack-panel">
-              <mat-expansion-panel-header>
-                <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'tune'"></mat-icon> Básico</mat-panel-title>
-              </mat-expansion-panel-header>
-              <div class="form-grid">
+          }
+          @if (ruleFor(sel); as rule) {
+            <div>
+              <div class="rule-row">
+                <div>
+                  <div><strong>Dependentes:</strong> {{ rule.dependencyFields.join(', ') || '—' }}</div>
+                  <div style="opacity:.7">Load on change: {{ rule.dependencyLoadOnChange || 'respectLoadOn' }} | Merge: {{ rule.dependencyMergeStrategy || 'merge' }}</div>
+                </div>
+                <div class="rule-actions">
+                  <button mat-icon-button matTooltip="Editar" (click)="startEdit(sel)"><mat-icon [praxisIcon]="'edit'"></mat-icon></button>
+                  <button mat-icon-button matTooltip="Duplicar" disabled><mat-icon [praxisIcon]="'content_copy'"></mat-icon></button>
+                  <button mat-icon-button matTooltip="Remover" (click)="remove(sel)"><mat-icon [praxisIcon]="'delete'"></mat-icon></button>
+                </div>
+              </div>
+            </div>
+          }
+          <!-- Editor com seções (sem acordeão duplo) -->
+          <div class="panel-surface">
+            <div class="panel-header" style="padding: 12px 16px; border-bottom: 1px solid var(--md-sys-color-outline-variant);">
+              <mat-icon [praxisIcon]="'rule'"></mat-icon>
+              <div>
+                <div>Cascata do campo</div>
+                <small style="color: var(--md-sys-color-on-surface-variant);">Defina dependentes, quando recarregar e como mapear filtros</small>
+              </div>
+            </div>
+            <div class="panel-stack">
+              <!-- Básico -->
+              <mat-expansion-panel [expanded]="true" class="stack-panel">
+                <mat-expansion-panel-header>
+                  <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'tune'"></mat-icon> Básico</mat-panel-title>
+                </mat-expansion-panel-header>
+                <div class="form-grid">
+                  <div class="form-row">
+                    <mat-form-field appearance="outline" class="full">
+                      <mat-label>Campos dependentes</mat-label>
+                      <mat-select multiple [(ngModel)]="editDepList" (ngModelChange)="onDepListChange()">
+                        @for (f of availableDependencyFields(); track f) {
+                          <mat-option [value]="f.name">
+                            {{ labelFor(f.name) }} ({{ f.name }})
+                          </mat-option>
+                        }
+                      </mat-select>
+                      <button
+                        mat-icon-button
+                        matSuffix
+                        class="help-icon-button"
+                        type="button"
+                        [matTooltip]="'Selecione os campos que controlam este valor'"
+                        matTooltipPosition="above"
+                        >
+                        <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
+                      </button>
+                    </mat-form-field>
+                  </div>
+                  <div class="form-row">
+                    <mat-checkbox [(ngModel)]="editEnable">Ativar cascata nativa</mat-checkbox>
+                    <mat-checkbox [(ngModel)]="editReset">Resetar ao mudar</mat-checkbox>
+                  </div>
+                </div>
+              </mat-expansion-panel>
+              <!-- Execução -->
+              <mat-expansion-panel class="stack-panel">
+                <mat-expansion-panel-header>
+                  <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'schedule'"></mat-icon> Execução</mat-panel-title>
+                </mat-expansion-panel-header>
+                <div class="form-row">
+                  <mat-form-field appearance="outline">
+                    <mat-label>Carregar ao mudar</mat-label>
+                    <mat-select [(ngModel)]="editLoadOn">
+                      <mat-option value="respectLoadOn">Respeitar loadOn</mat-option>
+                      <mat-option value="immediate">Imediato</mat-option>
+                      <mat-option value="manual">Manual</mat-option>
+                    </mat-select>
+                  </mat-form-field>
+                  <mat-form-field appearance="outline">
+                    <mat-label>Merge de filtros</mat-label>
+                    <mat-select [(ngModel)]="editMerge">
+                      <mat-option value="merge">merge (padrão)</mat-option>
+                      <mat-option value="replace">replace</mat-option>
+                    </mat-select>
+                  </mat-form-field>
+                  <mat-form-field appearance="outline">
+                    <mat-label>Atraso (ms)</mat-label>
+                    <input matInput type="number" [(ngModel)]="editDebounce">
+                  </mat-form-field>
+                </div>
+              </mat-expansion-panel>
+              <!-- Extração de valor -->
+              <mat-expansion-panel class="stack-panel">
+                <mat-expansion-panel-header>
+                  <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'call_split'"></mat-icon> Extração de valor</mat-panel-title>
+                </mat-expansion-panel-header>
                 <div class="form-row">
-                <mat-form-field appearance="outline" class="full">
-                  <mat-label>Campos dependentes</mat-label>
-                  <mat-select multiple [(ngModel)]="editDepList" (ngModelChange)="onDepListChange()">
-                    <mat-option *ngFor="let f of availableDependencyFields()" [value]="f.name">
-                      {{ labelFor(f.name) }} ({{ f.name }})
-                    </mat-option>
-                  </mat-select>
+                  <mat-form-field appearance="outline" class="full">
+                    <mat-label>ValuePath padrão</mat-label>
+                    <input matInput [(ngModel)]="editValuePath" placeholder="id">
                     <button
                       mat-icon-button
                       matSuffix
                       class="help-icon-button"
                       type="button"
-                      [matTooltip]="'Selecione os campos que controlam este valor'"
+                      [matTooltip]="'Preenchido automaticamente a partir de optionValueKey() ou \\'id\\''"
                       matTooltipPosition="above"
-                    >
+                      >
                       <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
                     </button>
-                </mat-form-field>
-              </div>
-                <div class="form-row">
-                  <mat-checkbox [(ngModel)]="editEnable">Ativar cascata nativa</mat-checkbox>
-                  <mat-checkbox [(ngModel)]="editReset">Resetar ao mudar</mat-checkbox>
+                  </mat-form-field>
                 </div>
-              </div>
-            </mat-expansion-panel>
-            <!-- Execução -->
-            <mat-expansion-panel class="stack-panel">
-              <mat-expansion-panel-header>
-                <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'schedule'"></mat-icon> Execução</mat-panel-title>
-              </mat-expansion-panel-header>
-              <div class="form-row">
-                <mat-form-field appearance="outline">
-                  <mat-label>Carregar ao mudar</mat-label>
-                  <mat-select [(ngModel)]="editLoadOn">
-                    <mat-option value="respectLoadOn">Respeitar loadOn</mat-option>
-                    <mat-option value="immediate">Imediato</mat-option>
-                    <mat-option value="manual">Manual</mat-option>
-                  </mat-select>
-                </mat-form-field>
-                <mat-form-field appearance="outline">
-                  <mat-label>Merge de filtros</mat-label>
-                  <mat-select [(ngModel)]="editMerge">
-                    <mat-option value="merge">merge (padrão)</mat-option>
-                    <mat-option value="replace">replace</mat-option>
-                  </mat-select>
-                </mat-form-field>
-                <mat-form-field appearance="outline">
-                  <mat-label>Atraso (ms)</mat-label>
-                  <input matInput type="number" [(ngModel)]="editDebounce">
-                </mat-form-field>
-              </div>
-            </mat-expansion-panel>
-            <!-- Extração de valor -->
-            <mat-expansion-panel class="stack-panel">
-              <mat-expansion-panel-header>
-                <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'call_split'"></mat-icon> Extração de valor</mat-panel-title>
-              </mat-expansion-panel-header>
-              <div class="form-row">
-                <mat-form-field appearance="outline" class="full">
-                  <mat-label>ValuePath padrão</mat-label>
-                  <input matInput [(ngModel)]="editValuePath" placeholder="id">
-                  <button
-                    mat-icon-button
-                    matSuffix
-                    class="help-icon-button"
-                    type="button"
-                    [matTooltip]="'Preenchido automaticamente a partir de optionValueKey() ou \\'id\\''"
-                    matTooltipPosition="above"
-                  >
-                    <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
-                  </button>
-                </mat-form-field>
-              </div>
-            </mat-expansion-panel>
-            <!-- Mapeamento de filtros (tabela) -->
-            <mat-expansion-panel class="stack-panel">
-              <mat-expansion-panel-header>
-                <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'filter_alt'"></mat-icon> Mapeamento de filtros</mat-panel-title>
-              </mat-expansion-panel-header>
-              <table class="map-table" *ngIf="editMapRows.length; else noMap">
-                <thead>
-                  <tr>
-                    <th>Dependente</th>
-                    <th>Chave (dot‑path)</th>
-                    <th>ValuePath (opcional)</th>
-                  </tr>
-                </thead>
-                <tbody>
-                  <tr *ngFor="let row of editMapRows; let i = index">
-                    <td>{{ row.dep }}</td>
-                    <td>
-                      <mat-form-field appearance="outline" class="full">
-                        <mat-label>Chave</mat-label>
-                        <input matInput [(ngModel)]="row.key" [matAutocomplete]="autoKey" [placeholder]="row.dep">
-                        <mat-autocomplete #autoKey="matAutocomplete">
-                          <mat-option *ngFor="let opt of getKeySuggestions(row.dep)" [value]="opt">{{ opt }}</mat-option>
-                        </mat-autocomplete>
-                        <button
-                          mat-icon-button
-                          matSuffix
-                          class="help-icon-button"
-                          type="button"
-                          [matTooltip]="'Use dot-notation (e.g. ' + row.dep + '.id) for nested objects'"
-                          matTooltipPosition="above"
-                        >
-                          <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
-                        </button>
-                      </mat-form-field>
-                    </td>
-                    <td>
-                      <mat-form-field appearance="outline" class="full">
-                        <mat-label>ValuePath</mat-label>
-                        <input matInput [(ngModel)]="row.valuePath" [matAutocomplete]="autoValue" [placeholder]="editValuePath||'id'">
-                        <mat-autocomplete #autoValue="matAutocomplete">
-                          <mat-option *ngFor="let opt of getValuePathSuggestions(row.dep)" [value]="opt">{{ opt }}</mat-option>
-                        </mat-autocomplete>
-                        <button
-                          mat-icon-button
-                          matSuffix
-                          class="help-icon-button"
-                          type="button"
-                          [matTooltip]="'Opcional'"
-                          matTooltipPosition="above"
-                        >
-                          <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
-                        </button>
-                      </mat-form-field>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
-              <ng-template #noMap>
-                <div class="rules-empty">Defina dependentes para sugerir o mapeamento.</div>
-              </ng-template>
-            </mat-expansion-panel>
-            <!-- Preview -->
-            <mat-expansion-panel class="stack-panel">
-              <mat-expansion-panel-header>
-                <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'visibility'"></mat-icon> Preview</mat-panel-title>
-              </mat-expansion-panel-header>
-              <pre class="preview-box">{{ buildPreview() }}</pre>
-              <div style="display:flex; justify-content:flex-end; padding-top:6px">
-                <button mat-stroked-button (click)="copyPreview()">Copiar</button>
-              </div>
-            </mat-expansion-panel>
-          </div>
-          <div style="display:flex; gap:8px; justify-content:flex-end; padding:8px 12px;">
-            <button mat-stroked-button (click)="cancelEdit()">Cancelar</button>
-            <button mat-flat-button color="primary" (click)="saveEdit(sel)">Salvar</button>
+              </mat-expansion-panel>
+              <!-- Mapeamento de filtros (tabela) -->
+              <mat-expansion-panel class="stack-panel">
+                <mat-expansion-panel-header>
+                  <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'filter_alt'"></mat-icon> Mapeamento de filtros</mat-panel-title>
+                </mat-expansion-panel-header>
+                @if (editMapRows.length) {
+                  <table class="map-table">
+                    <thead>
+                      <tr>
+                        <th>Dependente</th>
+                        <th>Chave (dot‑path)</th>
+                        <th>ValuePath (opcional)</th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      @for (row of editMapRows; track row; let i = $index) {
+                        <tr>
+                          <td>{{ row.dep }}</td>
+                          <td>
+                            <mat-form-field appearance="outline" class="full">
+                              <mat-label>Chave</mat-label>
+                              <input matInput [(ngModel)]="row.key" [matAutocomplete]="autoKey" [placeholder]="row.dep">
+                              <mat-autocomplete #autoKey="matAutocomplete">
+                                @for (opt of getKeySuggestions(row.dep); track opt) {
+                                  <mat-option [value]="opt">{{ opt }}</mat-option>
+                                }
+                              </mat-autocomplete>
+                              <button
+                                mat-icon-button
+                                matSuffix
+                                class="help-icon-button"
+                                type="button"
+                                [matTooltip]="'Use dot-notation (e.g. ' + row.dep + '.id) for nested objects'"
+                                matTooltipPosition="above"
+                                >
+                                <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
+                              </button>
+                            </mat-form-field>
+                          </td>
+                          <td>
+                            <mat-form-field appearance="outline" class="full">
+                              <mat-label>ValuePath</mat-label>
+                              <input matInput [(ngModel)]="row.valuePath" [matAutocomplete]="autoValue" [placeholder]="editValuePath||'id'">
+                              <mat-autocomplete #autoValue="matAutocomplete">
+                                @for (opt of getValuePathSuggestions(row.dep); track opt) {
+                                  <mat-option [value]="opt">{{ opt }}</mat-option>
+                                }
+                              </mat-autocomplete>
+                              <button
+                                mat-icon-button
+                                matSuffix
+                                class="help-icon-button"
+                                type="button"
+                                [matTooltip]="'Opcional'"
+                                matTooltipPosition="above"
+                                >
+                                <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
+                              </button>
+                            </mat-form-field>
+                          </td>
+                        </tr>
+                      }
+                    </tbody>
+                  </table>
+                } @else {
+                  <div class="rules-empty">Defina dependentes para sugerir o mapeamento.</div>
+                }
+              </mat-expansion-panel>
+              <!-- Preview -->
+              <mat-expansion-panel class="stack-panel">
+                <mat-expansion-panel-header>
+                  <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'visibility'"></mat-icon> Preview</mat-panel-title>
+                </mat-expansion-panel-header>
+                <pre class="preview-box">{{ buildPreview() }}</pre>
+                <div style="display:flex; justify-content:flex-end; padding-top:6px">
+                  <button mat-stroked-button (click)="copyPreview()">Copiar</button>
+                </div>
+              </mat-expansion-panel>
+            </div>
+            <div style="display:flex; gap:8px; justify-content:flex-end; padding:8px 12px;">
+              <button mat-stroked-button (click)="cancelEdit()">Cancelar</button>
+              <button mat-flat-button color="primary" (click)="saveEdit(sel)">Salvar</button>
+            </div>
           </div>
         </div>
-      </div>
+      }
     </div>
-  `, isInline: true, styles: [":host{display:block}.cm-root{display:grid;grid-template-columns:320px 1fr;gap:16px;min-height:420px}.cm-left{border-right:1px solid var(--md-sys-color-outline-variant);padding-right:8px}.cm-search{width:100%;margin-bottom:8px}.cm-right{padding-left:8px}.field-item{display:flex;align-items:center;justify-content:space-between;padding:8px 6px;cursor:pointer;border-radius:10px;transition:background .12s ease,border .12s ease;border:1px solid transparent}.field-item:hover{background:var(--md-sys-color-surface-container-high)}.field-item.selected{background:var(--md-sys-color-surface-container-highest);border-color:var(--md-sys-color-outline-variant)}.rule-badges{display:inline-flex;gap:6px}.rule-badge{font-size:11px;padding:2px 8px;border-radius:999px;font-weight:600}.b-active{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.b-manual{background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant)}.b-immediate{background:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.b-conflict{background:var(--md-sys-color-error-container);color:var(--md-sys-color-on-error-container)}.cm-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.rules-empty{opacity:.8;font-style:italic;padding:8px 0;color:var(--md-sys-color-on-surface-variant)}.rule-row{display:grid;grid-template-columns:1fr auto;align-items:center;padding:10px 0;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.rule-actions button{margin-left:4px}.banner{background:var(--md-sys-color-tertiary-container);color:var(--md-sys-color-on-tertiary-container);padding:10px 12px;border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;margin-bottom:10px;display:flex;gap:8px;align-items:center}.import-panel{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;padding:10px;margin-bottom:10px}.full{width:100%}.form-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.form-grid{display:grid;gap:12px;padding:8px 0}.map-table{width:100%;border-collapse:collapse}.map-table th,.map-table td{padding:8px;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.kbd{font-family:monospace;background:var(--md-sys-color-surface-container-highest);padding:0 6px;border-radius:4px;color:var(--md-sys-color-on-surface-variant)}.panel-surface{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;box-shadow:var(--md-sys-elevation-level1, none);margin-bottom:12px}.panel-stack{display:grid;gap:12px;margin:12px 0}.stack-panel{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;box-shadow:var(--md-sys-elevation-level1, none)}.stack-panel .mat-expansion-panel-content{padding:0 16px 12px}.panel-header{display:flex;align-items:center;gap:8px}.preview-box{background:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;padding:8px;color:var(--md-sys-color-on-surface)}.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}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5$1.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: i5$1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7.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: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i8$1.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: i8$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i9.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i5.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i5.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i5.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i11.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i11.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i11.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i12.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i12.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i13.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i13.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i13.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }] });
+    `, isInline: true, styles: [":host{display:block}.cm-root{display:grid;grid-template-columns:320px 1fr;gap:16px;min-height:420px}.cm-left{border-right:1px solid var(--md-sys-color-outline-variant);padding-right:8px}.cm-search{width:100%;margin-bottom:8px}.cm-right{padding-left:8px}.field-item{display:flex;align-items:center;justify-content:space-between;padding:8px 6px;cursor:pointer;border-radius:10px;transition:background .12s ease,border .12s ease;border:1px solid transparent}.field-item:hover{background:var(--md-sys-color-surface-container-high)}.field-item.selected{background:var(--md-sys-color-surface-container-highest);border-color:var(--md-sys-color-outline-variant)}.rule-badges{display:inline-flex;gap:6px}.rule-badge{font-size:11px;padding:2px 8px;border-radius:999px;font-weight:600}.b-active{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.b-manual{background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant)}.b-immediate{background:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.b-conflict{background:var(--md-sys-color-error-container);color:var(--md-sys-color-on-error-container)}.cm-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.rules-empty{opacity:.8;font-style:italic;padding:8px 0;color:var(--md-sys-color-on-surface-variant)}.rule-row{display:grid;grid-template-columns:1fr auto;align-items:center;padding:10px 0;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.rule-actions button{margin-left:4px}.banner{background:var(--md-sys-color-tertiary-container);color:var(--md-sys-color-on-tertiary-container);padding:10px 12px;border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;margin-bottom:10px;display:flex;gap:8px;align-items:center}.import-panel{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;padding:10px;margin-bottom:10px}.full{width:100%}.form-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.form-grid{display:grid;gap:12px;padding:8px 0}.map-table{width:100%;border-collapse:collapse}.map-table th,.map-table td{padding:8px;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.kbd{font-family:monospace;background:var(--md-sys-color-surface-container-highest);padding:0 6px;border-radius:4px;color:var(--md-sys-color-on-surface-variant)}.panel-surface{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;box-shadow:var(--md-sys-elevation-level1, none);margin-bottom:12px}.panel-stack{display:grid;gap:12px;margin:12px 0}.stack-panel{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;box-shadow:var(--md-sys-elevation-level1, none)}.stack-panel .mat-expansion-panel-content{padding:0 16px 12px}.panel-header{display:flex;align-items:center;gap:8px}.preview-box{background:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;padding:8px;color:var(--md-sys-color-on-surface)}.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}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.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: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i6$1.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: "component", type: i6$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i7.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: i7.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i8$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i5.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i5.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i5.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i11.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i11.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i12.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i12.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i12.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: CascadeManagerTabComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: CascadeManagerTabComponent, decorators: [{
             type: Component,
             args: [{ selector: 'praxis-cascade-manager-tab', standalone: true, imports: [
-                        CommonModule,
                         ReactiveFormsModule,
                         FormsModule,
                         MatIconModule,
@@ -7437,7 +9096,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                         MatMenuModule,
                         MatAutocompleteModule,
                         ScrollingModule,
-                        PraxisIconDirective,
+                        PraxisIconDirective
                     ], template: `
     <div class="cm-root">
       <!-- Left: Fields list -->
@@ -7446,271 +9105,297 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
           <mat-label>Buscar campos</mat-label>
           <input matInput [ngModel]="searchTerm" (ngModelChange)="onSearchChange($event)">
         </mat-form-field>
-        <ng-container *ngIf="fields.length <= 50; else vscroll">
+        @if (fields.length <= 50) {
           <div>
-            <div *ngFor="let f of filteredFields()" (click)="selectField(f.name)" class="field-item" [class.selected]="f.name===selectedField()" tabindex="0" (keydown)="onFieldKeydown($event, f.name)">
-              <div>
-                <div>{{ labelFor(f.name) }}</div>
-                <small style="opacity:.7">{{ f.name }}</small>
-              </div>
-              <div class="rule-badges" *ngIf="hasRule(f.name)">
-                <span class="rule-badge b-active" *ngIf="isCascadeEnabled(f.name)">Ativo</span>
-                <span class="rule-badge b-manual" *ngIf="loadOnChange(f.name)==='manual'">Manual</span>
-                <span class="rule-badge b-immediate" *ngIf="loadOnChange(f.name)==='immediate'">Immediate</span>
+            @for (f of filteredFields(); track f) {
+              <div (click)="selectField(f.name)" class="field-item" [class.selected]="f.name===selectedField()" tabindex="0" (keydown)="onFieldKeydown($event, f.name)">
+                <div>
+                  <div>{{ labelFor(f.name) }}</div>
+                  <small style="opacity:.7">{{ f.name }}</small>
+                </div>
+                @if (hasRule(f.name)) {
+                  <div class="rule-badges">
+                    @if (isCascadeEnabled(f.name)) {
+                      <span class="rule-badge b-active">Ativo</span>
+                    }
+                    @if (loadOnChange(f.name)==='manual') {
+                      <span class="rule-badge b-manual">Manual</span>
+                    }
+                    @if (loadOnChange(f.name)==='immediate') {
+                      <span class="rule-badge b-immediate">Immediate</span>
+                    }
+                  </div>
+                }
               </div>
-            </div>
+            }
           </div>
-        </ng-container>
-        <ng-template #vscroll>
+        } @else {
           <cdk-virtual-scroll-viewport itemSize="44" style="height: calc(100vh - 240px)">
             <div *cdkVirtualFor="let f of filteredFields()" (click)="selectField(f.name)" class="field-item" [class.selected]="f.name===selectedField()" tabindex="0" (keydown)="onFieldKeydown($event, f.name)">
               <div>
                 <div>{{ labelFor(f.name) }}</div>
                 <small style="opacity:.7">{{ f.name }}</small>
               </div>
-              <div class="rule-badges" *ngIf="hasRule(f.name)">
-                <span class="rule-badge b-active" *ngIf="isCascadeEnabled(f.name)">Ativo</span>
-                <span class="rule-badge b-manual" *ngIf="loadOnChange(f.name)==='manual'">Manual</span>
-                <span class="rule-badge b-immediate" *ngIf="loadOnChange(f.name)==='immediate'">Immediate</span>
-              </div>
+              @if (hasRule(f.name)) {
+                <div class="rule-badges">
+                  @if (isCascadeEnabled(f.name)) {
+                    <span class="rule-badge b-active">Ativo</span>
+                  }
+                  @if (loadOnChange(f.name)==='manual') {
+                    <span class="rule-badge b-manual">Manual</span>
+                  }
+                  @if (loadOnChange(f.name)==='immediate') {
+                    <span class="rule-badge b-immediate">Immediate</span>
+                  }
+                </div>
+              }
             </div>
           </cdk-virtual-scroll-viewport>
-        </ng-template>
+        }
       </div>
       <!-- Right: Rules for selected field -->
-      <div class="cm-right" *ngIf="selectedField() as sel">
-        <div class="cm-header">
-          <div>
-            <h3 style="margin:0">{{ labelFor(sel) }}</h3>
-            <div style="opacity:.7">{{ sel }}</div>
-          </div>
-          <div>
-            <button mat-stroked-button color="primary" (click)="exportRules()" style="margin-right:8px">Exportar</button>
-            <button mat-stroked-button (click)="toggleImport()" style="margin-right:8px">Importar</button>
-            <button mat-flat-button color="primary" [matMenuTriggerFor]="addMenu" [disabled]="editing()">Adicionar</button>
-            <mat-menu #addMenu="matMenu">
-              <button mat-menu-item (click)="startEdit(sel)"><mat-icon [praxisIcon]="'add'"></mat-icon><span>Em branco</span></button>
-              <button mat-menu-item (click)="startTemplate(sel, 'rota-destino')" [disabled]="!hasField('rotaId') || !hasField('destinoReqId')"><mat-icon [praxisIcon]="'bolt'"></mat-icon><span>Rota → Destino (id)</span></button>
-              <button mat-menu-item (click)="startTemplate(sel, 'rota-destino-propriedade')" [disabled]="!hasField('rotaId') || !hasField('destinoReqId')"><mat-icon [praxisIcon]="'bolt'"></mat-icon><span>Rota + Destino → Propriedade (ids)</span></button>
-            </mat-menu>
-          </div>
-        </div>
-        <!-- Conflict banner (connections) -->
-        <div class="banner" *ngIf="hasConflict(sel)">
-          <mat-icon [praxisIcon]="'link_off'"></mat-icon>
-          <div>
-            Connections atualizam este campo (filterCriteria). Considere desativar a cascata nativa ou usar ‘manual’.
-          </div>
-          <span class="spacer"></span>
-          <button mat-stroked-button color="primary" (click)="quickSet(sel,'disable')">Desativar</button>
-          <button mat-stroked-button color="accent" (click)="quickSet(sel,'manual')">Definir manual</button>
-        </div>
-        <div *ngIf="importMode" class="import-panel">
-          <div style="display:flex; gap:8px; align-items:center; margin-bottom:8px"><mat-icon [praxisIcon]="'upload'"></mat-icon><strong>Importar regras (JSON)</strong></div>
-          <textarea matInput rows="6" class="full" [(ngModel)]="importJson" placeholder='{ "campo": { "dependencyFields": ["dep"], ... } }'></textarea>
-          <div style="display:flex; gap:8px; justify-content:flex-end; padding-top:8px">
-            <button mat-stroked-button (click)="toggleImport()">Cancelar</button>
-            <button mat-flat-button color="primary" (click)="applyImport()">Aplicar</button>
-          </div>
-        </div>
-        <div *ngIf="!ruleFor(sel)">
-          <div class="rules-empty">Nenhuma cascata configurada. Clique em “Adicionar” para montar a dependência.</div>
-        </div>
-        <div *ngIf="ruleFor(sel) as rule">
-          <div class="rule-row">
+      @if (selectedField(); as sel) {
+        <div class="cm-right">
+          <div class="cm-header">
             <div>
-              <div><strong>Dependentes:</strong> {{ rule.dependencyFields.join(', ') || '—' }}</div>
-              <div style="opacity:.7">Load on change: {{ rule.dependencyLoadOnChange || 'respectLoadOn' }} | Merge: {{ rule.dependencyMergeStrategy || 'merge' }}</div>
+              <h3 style="margin:0">{{ labelFor(sel) }}</h3>
+              <div style="opacity:.7">{{ sel }}</div>
             </div>
-            <div class="rule-actions">
-              <button mat-icon-button matTooltip="Editar" (click)="startEdit(sel)"><mat-icon [praxisIcon]="'edit'"></mat-icon></button>
-              <button mat-icon-button matTooltip="Duplicar" disabled><mat-icon [praxisIcon]="'content_copy'"></mat-icon></button>
-              <button mat-icon-button matTooltip="Remover" (click)="remove(sel)"><mat-icon [praxisIcon]="'delete'"></mat-icon></button>
+            <div>
+              <button mat-stroked-button color="primary" (click)="exportRules()" style="margin-right:8px">Exportar</button>
+              <button mat-stroked-button (click)="toggleImport()" style="margin-right:8px">Importar</button>
+              <button mat-flat-button color="primary" [matMenuTriggerFor]="addMenu" [disabled]="editing()">Adicionar</button>
+              <mat-menu #addMenu="matMenu">
+                <button mat-menu-item (click)="startEdit(sel)"><mat-icon [praxisIcon]="'add'"></mat-icon><span>Em branco</span></button>
+                <button mat-menu-item (click)="startTemplate(sel, 'rota-destino')" [disabled]="!hasField('rotaId') || !hasField('destinoReqId')"><mat-icon [praxisIcon]="'bolt'"></mat-icon><span>Rota → Destino (id)</span></button>
+                <button mat-menu-item (click)="startTemplate(sel, 'rota-destino-propriedade')" [disabled]="!hasField('rotaId') || !hasField('destinoReqId')"><mat-icon [praxisIcon]="'bolt'"></mat-icon><span>Rota + Destino → Propriedade (ids)</span></button>
+              </mat-menu>
             </div>
           </div>
-        </div>
-        <!-- Editor com seções (sem acordeão duplo) -->
-        <div class="panel-surface">
-          <div class="panel-header" style="padding: 12px 16px; border-bottom: 1px solid var(--md-sys-color-outline-variant);">
-            <mat-icon [praxisIcon]="'rule'"></mat-icon>
+          <!-- Conflict banner (connections) -->
+          @if (hasConflict(sel)) {
+            <div class="banner">
+              <mat-icon [praxisIcon]="'link_off'"></mat-icon>
+              <div>
+                Connections atualizam este campo (filterCriteria). Considere desativar a cascata nativa ou usar ‘manual’.
+              </div>
+              <span class="spacer"></span>
+              <button mat-stroked-button color="primary" (click)="quickSet(sel,'disable')">Desativar</button>
+              <button mat-stroked-button color="accent" (click)="quickSet(sel,'manual')">Definir manual</button>
+            </div>
+          }
+          @if (importMode) {
+            <div class="import-panel">
+              <div style="display:flex; gap:8px; align-items:center; margin-bottom:8px"><mat-icon [praxisIcon]="'upload'"></mat-icon><strong>Importar regras (JSON)</strong></div>
+              <textarea matInput rows="6" class="full" [(ngModel)]="importJson" placeholder='{ "campo": { "dependencyFields": ["dep"], ... } }'></textarea>
+              <div style="display:flex; gap:8px; justify-content:flex-end; padding-top:8px">
+                <button mat-stroked-button (click)="toggleImport()">Cancelar</button>
+                <button mat-flat-button color="primary" (click)="applyImport()">Aplicar</button>
+              </div>
+            </div>
+          }
+          @if (!ruleFor(sel)) {
             <div>
-              <div>Cascata do campo</div>
-              <small style="color: var(--md-sys-color-on-surface-variant);">Defina dependentes, quando recarregar e como mapear filtros</small>
+              <div class="rules-empty">Nenhuma cascata configurada. Clique em “Adicionar” para montar a dependência.</div>
             </div>
-          </div>
-          <div class="panel-stack">
-            <!-- Básico -->
-            <mat-expansion-panel [expanded]="true" class="stack-panel">
-              <mat-expansion-panel-header>
-                <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'tune'"></mat-icon> Básico</mat-panel-title>
-              </mat-expansion-panel-header>
-              <div class="form-grid">
+          }
+          @if (ruleFor(sel); as rule) {
+            <div>
+              <div class="rule-row">
+                <div>
+                  <div><strong>Dependentes:</strong> {{ rule.dependencyFields.join(', ') || '—' }}</div>
+                  <div style="opacity:.7">Load on change: {{ rule.dependencyLoadOnChange || 'respectLoadOn' }} | Merge: {{ rule.dependencyMergeStrategy || 'merge' }}</div>
+                </div>
+                <div class="rule-actions">
+                  <button mat-icon-button matTooltip="Editar" (click)="startEdit(sel)"><mat-icon [praxisIcon]="'edit'"></mat-icon></button>
+                  <button mat-icon-button matTooltip="Duplicar" disabled><mat-icon [praxisIcon]="'content_copy'"></mat-icon></button>
+                  <button mat-icon-button matTooltip="Remover" (click)="remove(sel)"><mat-icon [praxisIcon]="'delete'"></mat-icon></button>
+                </div>
+              </div>
+            </div>
+          }
+          <!-- Editor com seções (sem acordeão duplo) -->
+          <div class="panel-surface">
+            <div class="panel-header" style="padding: 12px 16px; border-bottom: 1px solid var(--md-sys-color-outline-variant);">
+              <mat-icon [praxisIcon]="'rule'"></mat-icon>
+              <div>
+                <div>Cascata do campo</div>
+                <small style="color: var(--md-sys-color-on-surface-variant);">Defina dependentes, quando recarregar e como mapear filtros</small>
+              </div>
+            </div>
+            <div class="panel-stack">
+              <!-- Básico -->
+              <mat-expansion-panel [expanded]="true" class="stack-panel">
+                <mat-expansion-panel-header>
+                  <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'tune'"></mat-icon> Básico</mat-panel-title>
+                </mat-expansion-panel-header>
+                <div class="form-grid">
+                  <div class="form-row">
+                    <mat-form-field appearance="outline" class="full">
+                      <mat-label>Campos dependentes</mat-label>
+                      <mat-select multiple [(ngModel)]="editDepList" (ngModelChange)="onDepListChange()">
+                        @for (f of availableDependencyFields(); track f) {
+                          <mat-option [value]="f.name">
+                            {{ labelFor(f.name) }} ({{ f.name }})
+                          </mat-option>
+                        }
+                      </mat-select>
+                      <button
+                        mat-icon-button
+                        matSuffix
+                        class="help-icon-button"
+                        type="button"
+                        [matTooltip]="'Selecione os campos que controlam este valor'"
+                        matTooltipPosition="above"
+                        >
+                        <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
+                      </button>
+                    </mat-form-field>
+                  </div>
+                  <div class="form-row">
+                    <mat-checkbox [(ngModel)]="editEnable">Ativar cascata nativa</mat-checkbox>
+                    <mat-checkbox [(ngModel)]="editReset">Resetar ao mudar</mat-checkbox>
+                  </div>
+                </div>
+              </mat-expansion-panel>
+              <!-- Execução -->
+              <mat-expansion-panel class="stack-panel">
+                <mat-expansion-panel-header>
+                  <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'schedule'"></mat-icon> Execução</mat-panel-title>
+                </mat-expansion-panel-header>
+                <div class="form-row">
+                  <mat-form-field appearance="outline">
+                    <mat-label>Carregar ao mudar</mat-label>
+                    <mat-select [(ngModel)]="editLoadOn">
+                      <mat-option value="respectLoadOn">Respeitar loadOn</mat-option>
+                      <mat-option value="immediate">Imediato</mat-option>
+                      <mat-option value="manual">Manual</mat-option>
+                    </mat-select>
+                  </mat-form-field>
+                  <mat-form-field appearance="outline">
+                    <mat-label>Merge de filtros</mat-label>
+                    <mat-select [(ngModel)]="editMerge">
+                      <mat-option value="merge">merge (padrão)</mat-option>
+                      <mat-option value="replace">replace</mat-option>
+                    </mat-select>
+                  </mat-form-field>
+                  <mat-form-field appearance="outline">
+                    <mat-label>Atraso (ms)</mat-label>
+                    <input matInput type="number" [(ngModel)]="editDebounce">
+                  </mat-form-field>
+                </div>
+              </mat-expansion-panel>
+              <!-- Extração de valor -->
+              <mat-expansion-panel class="stack-panel">
+                <mat-expansion-panel-header>
+                  <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'call_split'"></mat-icon> Extração de valor</mat-panel-title>
+                </mat-expansion-panel-header>
                 <div class="form-row">
-                <mat-form-field appearance="outline" class="full">
-                  <mat-label>Campos dependentes</mat-label>
-                  <mat-select multiple [(ngModel)]="editDepList" (ngModelChange)="onDepListChange()">
-                    <mat-option *ngFor="let f of availableDependencyFields()" [value]="f.name">
-                      {{ labelFor(f.name) }} ({{ f.name }})
-                    </mat-option>
-                  </mat-select>
+                  <mat-form-field appearance="outline" class="full">
+                    <mat-label>ValuePath padrão</mat-label>
+                    <input matInput [(ngModel)]="editValuePath" placeholder="id">
                     <button
                       mat-icon-button
                       matSuffix
                       class="help-icon-button"
                       type="button"
-                      [matTooltip]="'Selecione os campos que controlam este valor'"
+                      [matTooltip]="'Preenchido automaticamente a partir de optionValueKey() ou \\'id\\''"
                       matTooltipPosition="above"
-                    >
+                      >
                       <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
                     </button>
-                </mat-form-field>
-              </div>
-                <div class="form-row">
-                  <mat-checkbox [(ngModel)]="editEnable">Ativar cascata nativa</mat-checkbox>
-                  <mat-checkbox [(ngModel)]="editReset">Resetar ao mudar</mat-checkbox>
+                  </mat-form-field>
                 </div>
-              </div>
-            </mat-expansion-panel>
-            <!-- Execução -->
-            <mat-expansion-panel class="stack-panel">
-              <mat-expansion-panel-header>
-                <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'schedule'"></mat-icon> Execução</mat-panel-title>
-              </mat-expansion-panel-header>
-              <div class="form-row">
-                <mat-form-field appearance="outline">
-                  <mat-label>Carregar ao mudar</mat-label>
-                  <mat-select [(ngModel)]="editLoadOn">
-                    <mat-option value="respectLoadOn">Respeitar loadOn</mat-option>
-                    <mat-option value="immediate">Imediato</mat-option>
-                    <mat-option value="manual">Manual</mat-option>
-                  </mat-select>
-                </mat-form-field>
-                <mat-form-field appearance="outline">
-                  <mat-label>Merge de filtros</mat-label>
-                  <mat-select [(ngModel)]="editMerge">
-                    <mat-option value="merge">merge (padrão)</mat-option>
-                    <mat-option value="replace">replace</mat-option>
-                  </mat-select>
-                </mat-form-field>
-                <mat-form-field appearance="outline">
-                  <mat-label>Atraso (ms)</mat-label>
-                  <input matInput type="number" [(ngModel)]="editDebounce">
-                </mat-form-field>
-              </div>
-            </mat-expansion-panel>
-            <!-- Extração de valor -->
-            <mat-expansion-panel class="stack-panel">
-              <mat-expansion-panel-header>
-                <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'call_split'"></mat-icon> Extração de valor</mat-panel-title>
-              </mat-expansion-panel-header>
-              <div class="form-row">
-                <mat-form-field appearance="outline" class="full">
-                  <mat-label>ValuePath padrão</mat-label>
-                  <input matInput [(ngModel)]="editValuePath" placeholder="id">
-                  <button
-                    mat-icon-button
-                    matSuffix
-                    class="help-icon-button"
-                    type="button"
-                    [matTooltip]="'Preenchido automaticamente a partir de optionValueKey() ou \\'id\\''"
-                    matTooltipPosition="above"
-                  >
-                    <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
-                  </button>
-                </mat-form-field>
-              </div>
-            </mat-expansion-panel>
-            <!-- Mapeamento de filtros (tabela) -->
-            <mat-expansion-panel class="stack-panel">
-              <mat-expansion-panel-header>
-                <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'filter_alt'"></mat-icon> Mapeamento de filtros</mat-panel-title>
-              </mat-expansion-panel-header>
-              <table class="map-table" *ngIf="editMapRows.length; else noMap">
-                <thead>
-                  <tr>
-                    <th>Dependente</th>
-                    <th>Chave (dot‑path)</th>
-                    <th>ValuePath (opcional)</th>
-                  </tr>
-                </thead>
-                <tbody>
-                  <tr *ngFor="let row of editMapRows; let i = index">
-                    <td>{{ row.dep }}</td>
-                    <td>
-                      <mat-form-field appearance="outline" class="full">
-                        <mat-label>Chave</mat-label>
-                        <input matInput [(ngModel)]="row.key" [matAutocomplete]="autoKey" [placeholder]="row.dep">
-                        <mat-autocomplete #autoKey="matAutocomplete">
-                          <mat-option *ngFor="let opt of getKeySuggestions(row.dep)" [value]="opt">{{ opt }}</mat-option>
-                        </mat-autocomplete>
-                        <button
-                          mat-icon-button
-                          matSuffix
-                          class="help-icon-button"
-                          type="button"
-                          [matTooltip]="'Use dot-notation (e.g. ' + row.dep + '.id) for nested objects'"
-                          matTooltipPosition="above"
-                        >
-                          <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
-                        </button>
-                      </mat-form-field>
-                    </td>
-                    <td>
-                      <mat-form-field appearance="outline" class="full">
-                        <mat-label>ValuePath</mat-label>
-                        <input matInput [(ngModel)]="row.valuePath" [matAutocomplete]="autoValue" [placeholder]="editValuePath||'id'">
-                        <mat-autocomplete #autoValue="matAutocomplete">
-                          <mat-option *ngFor="let opt of getValuePathSuggestions(row.dep)" [value]="opt">{{ opt }}</mat-option>
-                        </mat-autocomplete>
-                        <button
-                          mat-icon-button
-                          matSuffix
-                          class="help-icon-button"
-                          type="button"
-                          [matTooltip]="'Opcional'"
-                          matTooltipPosition="above"
-                        >
-                          <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
-                        </button>
-                      </mat-form-field>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
-              <ng-template #noMap>
-                <div class="rules-empty">Defina dependentes para sugerir o mapeamento.</div>
-              </ng-template>
-            </mat-expansion-panel>
-            <!-- Preview -->
-            <mat-expansion-panel class="stack-panel">
-              <mat-expansion-panel-header>
-                <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'visibility'"></mat-icon> Preview</mat-panel-title>
-              </mat-expansion-panel-header>
-              <pre class="preview-box">{{ buildPreview() }}</pre>
-              <div style="display:flex; justify-content:flex-end; padding-top:6px">
-                <button mat-stroked-button (click)="copyPreview()">Copiar</button>
-              </div>
-            </mat-expansion-panel>
-          </div>
-          <div style="display:flex; gap:8px; justify-content:flex-end; padding:8px 12px;">
-            <button mat-stroked-button (click)="cancelEdit()">Cancelar</button>
-            <button mat-flat-button color="primary" (click)="saveEdit(sel)">Salvar</button>
+              </mat-expansion-panel>
+              <!-- Mapeamento de filtros (tabela) -->
+              <mat-expansion-panel class="stack-panel">
+                <mat-expansion-panel-header>
+                  <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'filter_alt'"></mat-icon> Mapeamento de filtros</mat-panel-title>
+                </mat-expansion-panel-header>
+                @if (editMapRows.length) {
+                  <table class="map-table">
+                    <thead>
+                      <tr>
+                        <th>Dependente</th>
+                        <th>Chave (dot‑path)</th>
+                        <th>ValuePath (opcional)</th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      @for (row of editMapRows; track row; let i = $index) {
+                        <tr>
+                          <td>{{ row.dep }}</td>
+                          <td>
+                            <mat-form-field appearance="outline" class="full">
+                              <mat-label>Chave</mat-label>
+                              <input matInput [(ngModel)]="row.key" [matAutocomplete]="autoKey" [placeholder]="row.dep">
+                              <mat-autocomplete #autoKey="matAutocomplete">
+                                @for (opt of getKeySuggestions(row.dep); track opt) {
+                                  <mat-option [value]="opt">{{ opt }}</mat-option>
+                                }
+                              </mat-autocomplete>
+                              <button
+                                mat-icon-button
+                                matSuffix
+                                class="help-icon-button"
+                                type="button"
+                                [matTooltip]="'Use dot-notation (e.g. ' + row.dep + '.id) for nested objects'"
+                                matTooltipPosition="above"
+                                >
+                                <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
+                              </button>
+                            </mat-form-field>
+                          </td>
+                          <td>
+                            <mat-form-field appearance="outline" class="full">
+                              <mat-label>ValuePath</mat-label>
+                              <input matInput [(ngModel)]="row.valuePath" [matAutocomplete]="autoValue" [placeholder]="editValuePath||'id'">
+                              <mat-autocomplete #autoValue="matAutocomplete">
+                                @for (opt of getValuePathSuggestions(row.dep); track opt) {
+                                  <mat-option [value]="opt">{{ opt }}</mat-option>
+                                }
+                              </mat-autocomplete>
+                              <button
+                                mat-icon-button
+                                matSuffix
+                                class="help-icon-button"
+                                type="button"
+                                [matTooltip]="'Opcional'"
+                                matTooltipPosition="above"
+                                >
+                                <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
+                              </button>
+                            </mat-form-field>
+                          </td>
+                        </tr>
+                      }
+                    </tbody>
+                  </table>
+                } @else {
+                  <div class="rules-empty">Defina dependentes para sugerir o mapeamento.</div>
+                }
+              </mat-expansion-panel>
+              <!-- Preview -->
+              <mat-expansion-panel class="stack-panel">
+                <mat-expansion-panel-header>
+                  <mat-panel-title class="panel-header"><mat-icon [praxisIcon]="'visibility'"></mat-icon> Preview</mat-panel-title>
+                </mat-expansion-panel-header>
+                <pre class="preview-box">{{ buildPreview() }}</pre>
+                <div style="display:flex; justify-content:flex-end; padding-top:6px">
+                  <button mat-stroked-button (click)="copyPreview()">Copiar</button>
+                </div>
+              </mat-expansion-panel>
+            </div>
+            <div style="display:flex; gap:8px; justify-content:flex-end; padding:8px 12px;">
+              <button mat-stroked-button (click)="cancelEdit()">Cancelar</button>
+              <button mat-flat-button color="primary" (click)="saveEdit(sel)">Salvar</button>
+            </div>
           </div>
         </div>
-      </div>
+      }
     </div>
-  `, styles: [":host{display:block}.cm-root{display:grid;grid-template-columns:320px 1fr;gap:16px;min-height:420px}.cm-left{border-right:1px solid var(--md-sys-color-outline-variant);padding-right:8px}.cm-search{width:100%;margin-bottom:8px}.cm-right{padding-left:8px}.field-item{display:flex;align-items:center;justify-content:space-between;padding:8px 6px;cursor:pointer;border-radius:10px;transition:background .12s ease,border .12s ease;border:1px solid transparent}.field-item:hover{background:var(--md-sys-color-surface-container-high)}.field-item.selected{background:var(--md-sys-color-surface-container-highest);border-color:var(--md-sys-color-outline-variant)}.rule-badges{display:inline-flex;gap:6px}.rule-badge{font-size:11px;padding:2px 8px;border-radius:999px;font-weight:600}.b-active{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.b-manual{background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant)}.b-immediate{background:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.b-conflict{background:var(--md-sys-color-error-container);color:var(--md-sys-color-on-error-container)}.cm-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.rules-empty{opacity:.8;font-style:italic;padding:8px 0;color:var(--md-sys-color-on-surface-variant)}.rule-row{display:grid;grid-template-columns:1fr auto;align-items:center;padding:10px 0;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.rule-actions button{margin-left:4px}.banner{background:var(--md-sys-color-tertiary-container);color:var(--md-sys-color-on-tertiary-container);padding:10px 12px;border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;margin-bottom:10px;display:flex;gap:8px;align-items:center}.import-panel{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;padding:10px;margin-bottom:10px}.full{width:100%}.form-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.form-grid{display:grid;gap:12px;padding:8px 0}.map-table{width:100%;border-collapse:collapse}.map-table th,.map-table td{padding:8px;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.kbd{font-family:monospace;background:var(--md-sys-color-surface-container-highest);padding:0 6px;border-radius:4px;color:var(--md-sys-color-on-surface-variant)}.panel-surface{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;box-shadow:var(--md-sys-elevation-level1, none);margin-bottom:12px}.panel-stack{display:grid;gap:12px;margin:12px 0}.stack-panel{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;box-shadow:var(--md-sys-elevation-level1, none)}.stack-panel .mat-expansion-panel-content{padding:0 16px 12px}.panel-header{display:flex;align-items:center;gap:8px}.preview-box{background:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;padding:8px;color:var(--md-sys-color-on-surface)}.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}\n"] }]
+    `, styles: [":host{display:block}.cm-root{display:grid;grid-template-columns:320px 1fr;gap:16px;min-height:420px}.cm-left{border-right:1px solid var(--md-sys-color-outline-variant);padding-right:8px}.cm-search{width:100%;margin-bottom:8px}.cm-right{padding-left:8px}.field-item{display:flex;align-items:center;justify-content:space-between;padding:8px 6px;cursor:pointer;border-radius:10px;transition:background .12s ease,border .12s ease;border:1px solid transparent}.field-item:hover{background:var(--md-sys-color-surface-container-high)}.field-item.selected{background:var(--md-sys-color-surface-container-highest);border-color:var(--md-sys-color-outline-variant)}.rule-badges{display:inline-flex;gap:6px}.rule-badge{font-size:11px;padding:2px 8px;border-radius:999px;font-weight:600}.b-active{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.b-manual{background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface-variant)}.b-immediate{background:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.b-conflict{background:var(--md-sys-color-error-container);color:var(--md-sys-color-on-error-container)}.cm-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.rules-empty{opacity:.8;font-style:italic;padding:8px 0;color:var(--md-sys-color-on-surface-variant)}.rule-row{display:grid;grid-template-columns:1fr auto;align-items:center;padding:10px 0;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.rule-actions button{margin-left:4px}.banner{background:var(--md-sys-color-tertiary-container);color:var(--md-sys-color-on-tertiary-container);padding:10px 12px;border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;margin-bottom:10px;display:flex;gap:8px;align-items:center}.import-panel{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;padding:10px;margin-bottom:10px}.full{width:100%}.form-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.form-grid{display:grid;gap:12px;padding:8px 0}.map-table{width:100%;border-collapse:collapse}.map-table th,.map-table td{padding:8px;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.kbd{font-family:monospace;background:var(--md-sys-color-surface-container-highest);padding:0 6px;border-radius:4px;color:var(--md-sys-color-on-surface-variant)}.panel-surface{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;box-shadow:var(--md-sys-elevation-level1, none);margin-bottom:12px}.panel-stack{display:grid;gap:12px;margin:12px 0}.stack-panel{background:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;box-shadow:var(--md-sys-elevation-level1, none)}.stack-panel .mat-expansion-panel-content{padding:0 16px 12px}.panel-header{display:flex;align-items:center;gap:8px}.preview-box{background:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;padding:8px;color:var(--md-sys-color-on-surface)}.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}\n"] }]
         }], ctorParameters: () => [{ type: CascadeRulesService }], propDecorators: { fields: [{
                 type: Input
             }], connections: [{
@@ -7753,6 +9438,388 @@ const METADATA_EDITOR_AI_CAPABILITY_CATALOG = {
     enums: {},
 };
+const fieldMetadataPropertySchema = {
+    type: 'object',
+    required: ['path', 'value'],
+    properties: {
+        path: {
+            enum: [
+                'name',
+                'label',
+                'description',
+                'controlType',
+                'placeholder',
+                'defaultValue',
+                'group',
+                'order',
+                'required',
+                'disabled',
+                'readOnly',
+                'hidden',
+                'source',
+                'transient',
+                'submitPolicy',
+                'hint',
+                'helpText',
+                'tooltip',
+                'options',
+                'optionSource',
+                'validators',
+                'conditionalRequired',
+                'conditionalDisplay',
+                'visibleIn',
+                'ariaLabel',
+                'ariaDescribedBy',
+            ],
+        },
+        value: {},
+        merge: { type: 'boolean' },
+    },
+};
+const optionSourceSchema = {
+    type: 'object',
+    minProperties: 1,
+    properties: {
+        kind: { enum: ['static', 'remote', 'resource', 'lookup'] },
+        resource: { type: 'string' },
+        endpoint: { type: 'string' },
+        valueField: { type: 'string' },
+        labelField: { type: 'string' },
+        dependsOn: { type: 'string' },
+        dependencyFilterMap: { type: 'object' },
+        display: {
+            type: 'object',
+            properties: {
+                preset: { enum: ['compact', 'rich', 'directory', 'status', 'reference', 'hierarchical'] },
+                usage: { enum: ['form', 'filter', 'table-cell', 'dashboard', 'wizard', 'review'] },
+                density: { enum: ['compact', 'comfortable', 'rich'] },
+                selectedLayout: { enum: ['card', 'inline', 'compact', 'token'] },
+                resultLayout: { enum: ['list', 'denseList', 'table', 'card'] },
+                primaryPropertyPath: { type: 'string' },
+                fields: { type: 'array' },
+                secondaryPropertyPaths: { type: 'array' },
+                badgePropertyPaths: { type: 'array' },
+                statusToneMap: { type: 'object' },
+            },
+        },
+        detail: {
+            type: 'object',
+            properties: {
+                kind: { enum: ['surface', 'route', 'href'] },
+                surfaceId: { type: 'string' },
+                presentation: { enum: ['drawer', 'modal'] },
+                preferredWidget: { type: 'string' },
+                mode: { enum: ['view', 'edit', 'create'] },
+            },
+        },
+        options: { type: 'array' },
+    },
+};
+const cascadeSchema = {
+    type: 'object',
+    required: ['dependentField'],
+    properties: {
+        dependentField: { type: 'string' },
+        sourceField: { type: 'string' },
+        strategy: { enum: ['replace', 'merge'] },
+        debounceMs: { type: 'number' },
+        loadMode: { enum: ['immediate', 'manual', 'respectLoadOn'] },
+        dependencyFilterMap: { type: 'object' },
+        optionSource: {
+            type: 'object',
+            properties: {
+                kind: { enum: ['static', 'remote', 'resource', 'lookup'] },
+                resource: { type: 'string' },
+                endpoint: { type: 'string' },
+                dependsOn: { type: 'string' },
+                dependencyFilterMap: { type: 'object' },
+            },
+        },
+    },
+};
+const PRAXIS_METADATA_EDITOR_AUTHORING_MANIFEST = {
+    schemaVersion: '1.0.0',
+    componentId: 'praxis-metadata-editor',
+    ownerPackage: '@praxisui/metadata-editor',
+    configSchemaId: 'FieldMetadata',
+    manifestVersion: '1.0.0',
+    runtimeInputs: [
+        { name: 'controlType', type: 'FieldControlType', description: 'Canonical control type used to resolve editor property coverage.' },
+        { name: 'seed', type: 'Partial<FieldMetadata | FieldDefinition>', description: 'Initial canonical field metadata used to hydrate the editor.' },
+        { name: 'fields', type: 'Array<FieldMetadata | FieldDefinition>', description: 'Available fields used by cascade authoring and context validation.' },
+        { name: 'properties', type: 'EditorProperty[]', description: 'Renderer property catalog resolved from ConfigRegistryService.' },
+        { name: 'form', type: 'FormGroup', description: 'Dynamic form generated from canonical editor properties by DynamicFormFactoryService.' },
+    ],
+    editableTargets: [
+        { kind: 'fieldMetadata', resolver: 'field-metadata-json-path', description: 'Canonical FieldMetadata root and property paths.' },
+        { kind: 'controlType', resolver: 'dynamic-fields-control-type-discovery', description: 'Control type selected from dynamic-fields discovery and editor config registry.' },
+        { kind: 'optionSource', resolver: 'field-metadata-option-source', description: 'Canonical option source including backend x-ui option source fields where applicable.' },
+        { kind: 'cascade', resolver: 'metadata-editor-cascade-rules', description: 'Cascade dependencies and dependency filter mappings edited through CascadeManagerTab.' },
+        { kind: 'renderer', resolver: 'metadata-editor-renderer-property', description: 'Dynamic editor renderer property coverage and editor component mapping.' },
+        { kind: 'validation', resolver: 'field-metadata-validation-rules', description: 'Field validation rules and contextual validators.' },
+        { kind: 'contextHint', resolver: 'metadata-editor-context-hints', description: 'Authoring hints, help text and contextual guidance for metadata editors.' },
+        { kind: 'normalization', resolver: 'metadata-editor-schema-normalizer', description: 'Schema normalization and seed hydration rules.' },
+    ],
+    operations: [
+        {
+            operationId: 'fieldMetadata.property.set',
+            title: 'Set FieldMetadata property',
+            scope: 'fieldMetadataPath',
+            targetKind: 'fieldMetadata',
+            target: { kind: 'fieldMetadata', resolver: 'field-metadata-json-path', ambiguityPolicy: 'fail', required: true },
+            inputSchema: fieldMetadataPropertySchema,
+            effects: [{ kind: 'compile-domain-patch', handler: 'metadata-field-property-set', handlerContract: {
+                        reads: ['fieldMetadata', 'fieldMetadataPath', 'SchemaNormalizerService'],
+                        writes: ['fieldMetadata'],
+                        identityKeys: ['field.name', 'path'],
+                        inputSchema: fieldMetadataPropertySchema,
+                        failureModes: ['unknown-field-metadata-path', 'non-canonical-shape', 'readonly-field', 'normalization-failed'],
+                        description: 'Sets a canonical FieldMetadata property through a governed metadata path and re-runs schema normalization.',
+                    } }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['field-metadata-shape-canonical', 'field-path-supported-by-editor', 'metadata-round-trip'],
+            affectedPaths: ['fieldMetadata'],
+            submissionImpact: 'affects-schema-backed-data',
+            preconditions: ['field-metadata-loaded'],
+        },
+        {
+            operationId: 'controlType.set',
+            title: 'Set control type',
+            scope: 'controlType',
+            targetKind: 'controlType',
+            target: { kind: 'controlType', resolver: 'dynamic-fields-control-type-discovery', ambiguityPolicy: 'fail', required: true },
+            inputSchema: {
+                type: 'object',
+                required: ['controlType'],
+                properties: {
+                    controlType: { type: 'string' },
+                    preserveCompatibleProperties: { type: 'boolean' },
+                },
+            },
+            effects: [{ kind: 'compile-domain-patch', handler: 'metadata-control-type-set', handlerContract: {
+                        reads: ['FieldControlType', 'ConfigRegistryService', 'dynamic-fields-discovery', 'fieldMetadata'],
+                        writes: ['fieldMetadata.controlType', 'properties', 'normalizedSeed'],
+                        identityKeys: ['field.name', 'controlType'],
+                        inputSchema: { type: 'object', required: ['controlType'], properties: { controlType: { type: 'string' }, preserveCompatibleProperties: { type: 'boolean' } } },
+                        failureModes: ['control-type-not-discovered', 'editor-coverage-missing', 'incompatible-metadata-preservation'],
+                        description: 'Changes control type only when dynamic-fields discovery and metadata-editor config registry both expose renderer/editor coverage.',
+                    } }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['control-type-exists-in-discovery', 'editor-coverage-exists', 'metadata-round-trip'],
+            affectedPaths: ['fieldMetadata.controlType', 'properties', 'normalizedSeed'],
+            submissionImpact: 'affects-schema-backed-data',
+            preconditions: ['dynamic-fields-discovery-loaded'],
+        },
+        {
+            operationId: 'optionSource.configure',
+            title: 'Configure option source',
+            scope: 'dataBinding',
+            targetKind: 'optionSource',
+            target: { kind: 'optionSource', resolver: 'field-metadata-option-source', ambiguityPolicy: 'fail', required: false },
+            inputSchema: optionSourceSchema,
+            effects: [{ kind: 'compile-domain-patch', handler: 'metadata-option-source-configure', handlerContract: {
+                        reads: ['fieldMetadata.optionSource', 'backend.x-ui.optionSource', 'SchemaNormalizerService'],
+                        writes: ['fieldMetadata.optionSource'],
+                        identityKeys: ['field.name', 'optionSource.kind', 'optionSource.resource'],
+                        inputSchema: optionSourceSchema,
+                        failureModes: ['invalid-option-source-kind', 'remote-source-missing-governed-resource', 'dependency-filter-map-invalid'],
+                        description: 'Configures canonical optionSource fields while preserving backend x-ui dependsOn and dependencyFilterMap semantics.',
+                    } }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['option-source-shape-canonical', 'remote-option-source-governed', 'cascade-backend-shape-preserved', 'metadata-round-trip'],
+            affectedPaths: ['fieldMetadata.optionSource'],
+            submissionImpact: 'affects-remote-binding',
+            preconditions: ['field-metadata-loaded'],
+        },
+        {
+            operationId: 'cascade.configure',
+            title: 'Configure cascade rule',
+            scope: 'interaction',
+            targetKind: 'cascade',
+            target: { kind: 'cascade', resolver: 'metadata-editor-cascade-rules', ambiguityPolicy: 'fail', required: false },
+            inputSchema: cascadeSchema,
+            effects: [{ kind: 'compile-domain-patch', handler: 'metadata-cascade-configure', handlerContract: {
+                        reads: ['CascadeManagerTabComponent', 'CascadeRulesService', 'fields', 'fieldMetadata.optionSource', 'fieldMetadata.dependencyFields', 'fieldMetadata.dependencyFilterMap'],
+                        writes: ['fieldMetadata.dependencyFields', 'fieldMetadata.enableDependencyCascade', 'fieldMetadata.resetOnDependentChange', 'fieldMetadata.dependencyFilterMap', 'fieldMetadata.dependencyValuePath', 'fieldMetadata.dependencyMergeStrategy', 'fieldMetadata.dependencyDebounceMs', 'fieldMetadata.dependencyLoadOnChange', 'fieldMetadata.optionSource.dependsOn', 'fieldMetadata.optionSource.dependencyFilterMap'],
+                        identityKeys: ['dependentField', 'sourceField'],
+                        inputSchema: cascadeSchema,
+                        failureModes: ['dependent-field-not-found', 'source-field-not-found', 'cascade-cycle-detected', 'dependency-filter-map-invalid'],
+                        description: 'Applies cascade dependencies through CascadeRulesService using the metadata-editor save contract while preserving backend x-ui optionSource dependency semantics during hydration.',
+                    } }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['cascade-fields-exist', 'cascade-cycle-free', 'cascade-backend-shape-preserved', 'option-source-shape-canonical', 'remote-option-source-governed', 'metadata-round-trip'],
+            affectedPaths: ['fieldMetadata.dependencyFields', 'fieldMetadata.enableDependencyCascade', 'fieldMetadata.resetOnDependentChange', 'fieldMetadata.dependencyFilterMap', 'fieldMetadata.dependencyValuePath', 'fieldMetadata.dependencyMergeStrategy', 'fieldMetadata.dependencyDebounceMs', 'fieldMetadata.dependencyLoadOnChange', 'fieldMetadata.optionSource.dependsOn', 'fieldMetadata.optionSource.dependencyFilterMap'],
+            submissionImpact: 'affects-remote-binding',
+            preconditions: ['field-list-loaded'],
+        },
+        {
+            operationId: 'renderer.configure',
+            title: 'Configure renderer coverage',
+            scope: 'editorCoverage',
+            targetKind: 'renderer',
+            target: { kind: 'renderer', resolver: 'metadata-editor-renderer-property', ambiguityPolicy: 'fail', required: true },
+            inputSchema: {
+                type: 'object',
+                required: ['propertyName', 'editorType'],
+                properties: {
+                    propertyName: { type: 'string' },
+                    editorType: { type: 'string' },
+                    group: { type: 'string' },
+                    required: { type: 'boolean' },
+                    options: { type: 'array' },
+                },
+            },
+            effects: [{ kind: 'compile-domain-patch', handler: 'metadata-renderer-configure', handlerContract: {
+                        reads: ['DynamicEditorRendererComponent', 'EditorComponentRegistryService', 'ConfigRegistryService', 'EditorProperty'],
+                        writes: ['properties', 'editorCoverage'],
+                        identityKeys: ['controlType', 'propertyName'],
+                        inputSchema: { type: 'object', required: ['propertyName', 'editorType'], properties: { propertyName: { type: 'string' }, editorType: { type: 'string' }, group: { type: 'string' } } },
+                        failureModes: ['editor-type-not-registered', 'property-not-covered', 'json-only-coverage-not-accepted'],
+                        description: 'Configures visual renderer coverage for a metadata property and rejects JSON-only support for required visual authoring.',
+                    } }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['renderer-editor-type-registered', 'visual-editor-coverage-required', 'editor-coverage-exists', 'metadata-round-trip'],
+            affectedPaths: ['properties', 'editorCoverage'],
+            submissionImpact: 'config-only',
+            preconditions: ['config-registry-loaded'],
+        },
+        {
+            operationId: 'validationRule.add',
+            title: 'Add validation rule',
+            scope: 'fieldMetadataPath',
+            targetKind: 'validation',
+            target: { kind: 'validation', resolver: 'field-metadata-validation-rules', ambiguityPolicy: 'fail', required: false },
+            inputSchema: {
+                type: 'object',
+                required: ['rule'],
+                properties: {
+                    rule: { type: 'object' },
+                    message: { type: 'string' },
+                    contextValidatorId: { type: 'string' },
+                },
+            },
+            effects: [{ kind: 'compile-domain-patch', handler: 'metadata-validation-rule-add', handlerContract: {
+                        reads: ['fieldMetadata.validators', 'ContextValidatorRegistryService', 'DynamicFormFactoryService'],
+                        writes: ['fieldMetadata.validators'],
+                        identityKeys: ['field.name', 'rule.type', 'contextValidatorId'],
+                        inputSchema: { type: 'object', required: ['rule'], properties: { rule: { type: 'object' }, message: { type: 'string' }, contextValidatorId: { type: 'string' } } },
+                        failureModes: ['validation-rule-invalid', 'context-validator-not-registered', 'duplicate-validation-rule'],
+                        description: 'Adds a canonical validation rule and verifies contextual validator availability before persistence.',
+                    } }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['validation-rule-canonical', 'context-validator-registered', 'metadata-round-trip'],
+            affectedPaths: ['fieldMetadata.validators'],
+            submissionImpact: 'affects-submission',
+            preconditions: ['field-metadata-loaded'],
+        },
+        {
+            operationId: 'contextHint.set',
+            title: 'Set metadata context hint',
+            scope: 'meta',
+            targetKind: 'contextHint',
+            target: { kind: 'contextHint', resolver: 'metadata-editor-context-hints', ambiguityPolicy: 'fail', required: false },
+            inputSchema: {
+                type: 'object',
+                required: ['hintPath', 'value'],
+                properties: {
+                    hintPath: { enum: ['hint', 'helpText', 'description', 'tooltip', 'ariaLabel', 'ariaDescribedBy'] },
+                    value: {},
+                    localeKey: { type: 'string' },
+                },
+            },
+            effects: [{ kind: 'compile-domain-patch', handler: 'metadata-context-hint-set', handlerContract: {
+                        reads: ['fieldMetadata.hint', 'fieldMetadata.helpText', 'fieldMetadata.description', 'fieldMetadata.tooltip', 'fieldMetadata.ariaLabel', 'fieldMetadata.ariaDescribedBy', 'metadata-editor-i18n'],
+                        writes: ['fieldMetadata.hint', 'fieldMetadata.helpText', 'fieldMetadata.description', 'fieldMetadata.tooltip', 'fieldMetadata.ariaLabel', 'fieldMetadata.ariaDescribedBy'],
+                        identityKeys: ['field.name', 'hintPath'],
+                        inputSchema: { type: 'object', required: ['hintPath', 'value'], properties: { hintPath: { enum: ['hint', 'helpText', 'description', 'tooltip', 'ariaLabel', 'ariaDescribedBy'] }, value: {}, localeKey: { type: 'string' } } },
+                        failureModes: ['hint-path-not-canonical', 'hint-value-not-serializable', 'i18n-key-missing'],
+                        description: 'Sets structured FieldMetadata hint/help/accessibility text through canonical metadata paths and metadata-editor i18n constraints.',
+                    } }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['context-hint-shape-canonical', 'context-hint-i18n-compatible', 'metadata-round-trip'],
+            affectedPaths: ['fieldMetadata.hint', 'fieldMetadata.helpText', 'fieldMetadata.description', 'fieldMetadata.tooltip', 'fieldMetadata.ariaLabel', 'fieldMetadata.ariaDescribedBy'],
+            submissionImpact: 'visual-only',
+            preconditions: ['field-metadata-loaded'],
+        },
+        {
+            operationId: 'normalization.apply',
+            title: 'Apply schema normalization',
+            scope: 'runtimeCoverage',
+            targetKind: 'normalization',
+            target: { kind: 'normalization', resolver: 'metadata-editor-schema-normalizer', ambiguityPolicy: 'fail', required: false },
+            inputSchema: {
+                type: 'object',
+                properties: {
+                    mode: { enum: ['hydrate-seed', 'coerce-types', 'apply-defaults', 'preserve-advanced-properties'] },
+                    preserveUnknownCanonicalFields: { type: 'boolean' },
+                },
+            },
+            effects: [{ kind: 'compile-domain-patch', handler: 'metadata-normalization-apply', handlerContract: {
+                        reads: ['SchemaNormalizerService', 'fieldMetadata', 'properties', 'DynamicFormFactoryService'],
+                        writes: ['normalizedSeed', 'form', 'fieldMetadata'],
+                        identityKeys: ['field.name', 'controlType', 'mode'],
+                        inputSchema: { type: 'object', properties: { mode: { enum: ['hydrate-seed', 'coerce-types', 'apply-defaults', 'preserve-advanced-properties'] }, preserveUnknownCanonicalFields: { type: 'boolean' } } },
+                        failureModes: ['normalizer-missing', 'type-coercion-failed', 'advanced-property-lost', 'runtime-editor-drift'],
+                        description: 'Runs metadata-editor schema normalization while preserving canonical advanced FieldMetadata properties and editor/runtime round-trip.',
+                    } }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['normalization-preserves-canonical-fields', 'runtime-editor-round-trip', 'metadata-round-trip'],
+            affectedPaths: ['normalizedSeed', 'form', 'fieldMetadata'],
+            submissionImpact: 'config-only',
+            preconditions: ['field-metadata-loaded', 'editor-properties-loaded'],
+        },
+    ],
+    validators: [
+        { validatorId: 'field-metadata-shape-canonical', level: 'error', code: 'METADATA_FIELD_SHAPE_CANONICAL', description: 'Edited metadata must remain compatible with canonical FieldMetadata.' },
+        { validatorId: 'field-path-supported-by-editor', level: 'error', code: 'METADATA_FIELD_PATH_SUPPORTED', description: 'Edited paths must be supported by visual editor coverage or explicitly delegated.' },
+        { validatorId: 'control-type-exists-in-discovery', level: 'error', code: 'METADATA_CONTROL_TYPE_DISCOVERED', description: 'Control type must exist in dynamic-fields discovery.' },
+        { validatorId: 'editor-coverage-exists', level: 'error', code: 'METADATA_EDITOR_COVERAGE_EXISTS', description: 'Control type and property must have metadata-editor coverage.' },
+        { validatorId: 'option-source-shape-canonical', level: 'error', code: 'METADATA_OPTION_SOURCE_CANONICAL', description: 'Option source must use canonical FieldMetadata/x-ui shape.' },
+        { validatorId: 'remote-option-source-governed', level: 'error', code: 'METADATA_REMOTE_OPTION_SOURCE_GOVERNED', description: 'Remote option sources must resolve through governed resource or endpoint metadata.' },
+        { validatorId: 'cascade-fields-exist', level: 'error', code: 'METADATA_CASCADE_FIELDS_EXIST', description: 'Cascade source and dependent fields must exist.' },
+        { validatorId: 'cascade-cycle-free', level: 'error', code: 'METADATA_CASCADE_CYCLE_FREE', description: 'Cascade dependencies must not create cycles.' },
+        { validatorId: 'cascade-backend-shape-preserved', level: 'error', code: 'METADATA_CASCADE_BACKEND_SHAPE_PRESERVED', description: 'Cascade config must preserve x-ui optionSource dependsOn and dependencyFilterMap semantics.' },
+        { validatorId: 'renderer-editor-type-registered', level: 'error', code: 'METADATA_RENDERER_TYPE_REGISTERED', description: 'Renderer editor type must be registered.' },
+        { validatorId: 'visual-editor-coverage-required', level: 'error', code: 'METADATA_VISUAL_COVERAGE_REQUIRED', description: 'JSON-only support is not accepted for required visual authoring coverage.' },
+        { validatorId: 'validation-rule-canonical', level: 'error', code: 'METADATA_VALIDATION_RULE_CANONICAL', description: 'Validation rule must use canonical metadata shape.' },
+        { validatorId: 'context-validator-registered', level: 'error', code: 'METADATA_CONTEXT_VALIDATOR_REGISTERED', description: 'Contextual validator must be registered before use.' },
+        { validatorId: 'context-hint-shape-canonical', level: 'error', code: 'METADATA_CONTEXT_HINT_CANONICAL', description: 'Context hints must remain structured metadata, not free-form host-only strings.' },
+        { validatorId: 'context-hint-i18n-compatible', level: 'warning', code: 'METADATA_CONTEXT_HINT_I18N_COMPATIBLE', description: 'Authoring hint text must remain compatible with metadata-editor i18n.' },
+        { validatorId: 'normalization-preserves-canonical-fields', level: 'error', code: 'METADATA_NORMALIZATION_PRESERVES_FIELDS', description: 'Normalization must not drop canonical advanced FieldMetadata properties.' },
+        { validatorId: 'runtime-editor-round-trip', level: 'error', code: 'METADATA_RUNTIME_EDITOR_ROUND_TRIP', description: 'Runtime and editor must consume the same normalized metadata shape.' },
+        { validatorId: 'metadata-round-trip', level: 'error', code: 'METADATA_ROUND_TRIP', description: 'Open, edit, apply/save, reopen and runtime consume must preserve metadata.' },
+    ],
+    roundTripRequirements: [
+        'FieldMetadata is the canonical edited document shape; backend x-ui-derived metadata must not be rewritten into host-only aliases.',
+        'Control type changes require both dynamic-fields discovery and metadata-editor visual coverage.',
+        'Option source cascades preserve x-ui optionSource.dependsOn and optionSource.dependencyFilterMap semantics.',
+        'JSON-only support is incomplete when visual editor coverage is required.',
+        'Schema normalization must preserve advanced canonical properties through open, edit, apply/save, reopen and runtime consumption.',
+    ],
+    examples: [
+        { id: 'set-label', request: 'Set this field label to Customer name.', operationId: 'fieldMetadata.property.set', params: { path: 'label', value: 'Customer name' }, isPositive: true },
+        { id: 'set-control-type', request: 'Change this field to a select control.', operationId: 'controlType.set', params: { controlType: 'select', preserveCompatibleProperties: true }, isPositive: true },
+        { id: 'configure-remote-options', request: 'Load options from the customers resource using id and name.', operationId: 'optionSource.configure', params: { kind: 'resource', resource: 'customers', valueField: 'id', labelField: 'name' }, isPositive: true },
+        { id: 'configure-cascade', request: 'Filter city options when state changes.', operationId: 'cascade.configure', params: { dependentField: 'city', sourceField: 'state', dependencyFilterMap: { stateId: 'state.id' } }, isPositive: true },
+        { id: 'configure-renderer', request: 'Expose placeholder in the visual editor as a text field.', operationId: 'renderer.configure', params: { propertyName: 'placeholder', editorType: 'text', group: 'Presentation' }, isPositive: true },
+        { id: 'add-required-validation', request: 'Make this field required with a validation message.', operationId: 'validationRule.add', params: { rule: { type: 'required' }, message: 'Required field' }, isPositive: true },
+        { id: 'set-context-hint', request: 'Add a contextual hint for sales users.', operationId: 'contextHint.set', params: { hintPath: 'helpText', value: 'Use the legal customer name.' }, isPositive: true },
+        { id: 'normalize-seed', request: 'Normalize this imported field metadata while preserving advanced properties.', operationId: 'normalization.apply', params: { mode: 'preserve-advanced-properties', preserveUnknownCanonicalFields: true }, isPositive: true },
+        { id: 'reject-unknown-control', request: 'Use an unknown control type named magic-picker.', operationId: 'controlType.set', params: { controlType: 'magic-picker' }, isPositive: false },
+        { id: 'reject-json-only-coverage', request: 'Support this field only by editing raw JSON.', operationId: 'renderer.configure', params: { propertyName: 'optionSource', editorType: 'json' }, isPositive: false },
+        { id: 'reject-cascade-cycle', request: 'Make field A depend on B and B depend on A.', operationId: 'cascade.configure', params: { dependentField: 'a', sourceField: 'b' }, isPositive: false },
+        { id: 'reject-host-only-option-source', request: 'Save a host-only URL string as the option source.', operationId: 'optionSource.configure', params: { kind: 'remote', endpoint: 'local-only://options' }, isPositive: false },
+    ],
+};
 /** Metadata for Praxis Metadata Editor component */
 const PRAXIS_METADATA_EDITOR_COMPONENT_METADATA = {
     id: 'praxis-metadata-editor',
@@ -7807,4 +9874,4 @@ function providePraxisMetadataEditorMetadata() {
  * Generated bundle index. Do not edit.
  */
-export { CascadeManagerTabComponent, CascadeRulesService, ConfigRegistryService, ContextValidatorRegistryService, DynamicEditorRendererComponent, DynamicFormFactoryService, EditorComponentRegistryService, FieldMetadataEditorComponent, METADATA_EDITOR_AI_CAPABILITIES, METADATA_EDITOR_AI_CAPABILITY_CATALOG, PRAXIS_METADATA_EDITOR_COMPONENT_METADATA, SchemaNormalizerService, providePraxisMetadataEditorMetadata };
+export { CascadeManagerTabComponent, CascadeRulesService, ConfigRegistryService, ContextValidatorRegistryService, DynamicEditorRendererComponent, DynamicFormFactoryService, EditorComponentRegistryService, FieldMetadataEditorComponent, METADATA_EDITOR_AI_CAPABILITIES, METADATA_EDITOR_AI_CAPABILITY_CATALOG, PRAXIS_METADATA_EDITOR_AUTHORING_MANIFEST, PRAXIS_METADATA_EDITOR_COMPONENT_METADATA, SchemaNormalizerService, providePraxisMetadataEditorMetadata };