@praxisui/dynamic-form 3.0.0-beta.9 → 4.0.0-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -0
- package/fesm2022/praxisui-dynamic-form.mjs +557 -186
- package/index.d.ts +56 -6
- package/package.json +7 -7
|
@@ -2,6 +2,7 @@ import * as i0 from '@angular/core';
|
|
|
2
2
|
import { EventEmitter, HostListener, Output, Input, Component, Optional, Inject, Injectable, inject, ViewChildren, ViewChild, ChangeDetectionStrategy, ENVIRONMENT_INITIALIZER } from '@angular/core';
|
|
3
3
|
import * as i1$1 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
|
+
import * as i2 from '@angular/common/http';
|
|
5
6
|
import { HttpContext } from '@angular/common/http';
|
|
6
7
|
import * as i1$3 from '@angular/forms';
|
|
7
8
|
import { ReactiveFormsModule, FormsModule, FormGroup, Validators } from '@angular/forms';
|
|
@@ -9,20 +10,20 @@ import * as i5 from '@angular/material/icon';
|
|
|
9
10
|
import { MatIconModule } from '@angular/material/icon';
|
|
10
11
|
import * as i4 from '@angular/material/button';
|
|
11
12
|
import { MatButtonModule } from '@angular/material/button';
|
|
12
|
-
import * as
|
|
13
|
+
import * as i16 from '@angular/material/progress-spinner';
|
|
13
14
|
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
14
15
|
import * as i9 from '@angular/material/tooltip';
|
|
15
16
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
16
|
-
import * as i2 from '@angular/material/dialog';
|
|
17
|
+
import * as i2$1 from '@angular/material/dialog';
|
|
17
18
|
import { MatDialogModule, MAT_DIALOG_DATA } from '@angular/material/dialog';
|
|
18
|
-
import * as
|
|
19
|
+
import * as i9$1 from '@angular/material/snack-bar';
|
|
19
20
|
import { MatSnackBarModule } from '@angular/material/snack-bar';
|
|
20
|
-
import * as
|
|
21
|
+
import * as i18 from '@angular/material/badge';
|
|
21
22
|
import { MatBadgeModule } from '@angular/material/badge';
|
|
22
|
-
import { firstValueFrom, BehaviorSubject, Subject, debounceTime as debounceTime$1, takeUntil as takeUntil$1 } from 'rxjs';
|
|
23
|
-
import { take, takeUntil, debounceTime, finalize
|
|
23
|
+
import { firstValueFrom, BehaviorSubject, Subject, throwError, debounceTime as debounceTime$1, takeUntil as takeUntil$1 } from 'rxjs';
|
|
24
|
+
import { map, take, takeUntil, debounceTime, finalize } from 'rxjs/operators';
|
|
24
25
|
import * as i1$2 from '@praxisui/core';
|
|
25
|
-
import { PraxisIconDirective, RULE_PROPERTY_SCHEMA, FIELD_METADATA_CAPABILITIES, deepMerge, createDefaultFormConfig, normalizeFormConfig as normalizeFormConfig$1, ensureIds, ASYNC_CONFIG_STORAGE, migrateFormLayoutRule, LoggerService, createCorporateLoggerConfig, ConsoleLoggerSink, PraxisI18nService, ResourceQuickConnectComponent, mapFieldDefinitionsToMetadata, syncWithServerMetadata, PRAXIS_LOADING_CTX, normalizeControlTypeKey, resolveSpan, resolveOffset, resolveOrder, resolveHidden, buildSchemaId, fetchWithETag, resolveControlTypeAlias, getTextTransformer, MemoryCacheAdapter, LocalStorageCacheAdapter, SchemaMetadataClient, CONNECTION_STORAGE, PRAXIS_LOADING_RENDERER, FORM_HOOKS_PRESETS, DynamicWidgetLoaderDirective, EmptyStateCardComponent, providePraxisI18nConfig, isValidFormConfig, ComponentMetadataRegistry, FieldControlType, GLOBAL_ACTION_CATALOG, GLOBAL_ACTION_SPEC_CATALOG, PRAXIS_GLOBAL_ACTION_CATALOG, getGlobalActionCatalog, SURFACE_OPEN_I18N_NAMESPACE, getGlobalActionUiSchema, SurfaceOpenActionEditorComponent, SURFACE_OPEN_I18N_CONFIG } from '@praxisui/core';
|
|
26
|
+
import { PraxisIconDirective, RULE_PROPERTY_SCHEMA, FIELD_METADATA_CAPABILITIES, deepMerge, createDefaultFormConfig, normalizeFormConfig as normalizeFormConfig$1, ensureIds, ASYNC_CONFIG_STORAGE, migrateFormLayoutRule, LoggerService, createCorporateLoggerConfig, ConsoleLoggerSink, PraxisI18nService, ResourceQuickConnectComponent, composeHeadersWithVersion, buildApiUrl, mapFieldDefinitionsToMetadata, syncWithServerMetadata, PRAXIS_LOADING_CTX, normalizeControlTypeKey, resolveSpan, resolveOffset, resolveOrder, resolveHidden, buildSchemaId, fetchWithETag, resolveControlTypeAlias, getTextTransformer, MemoryCacheAdapter, LocalStorageCacheAdapter, SchemaMetadataClient, CONNECTION_STORAGE, API_URL, PRAXIS_LOADING_RENDERER, FORM_HOOKS_PRESETS, DynamicWidgetLoaderDirective, EmptyStateCardComponent, providePraxisI18nConfig, isValidFormConfig, ComponentMetadataRegistry, FieldControlType, GLOBAL_ACTION_CATALOG, GLOBAL_ACTION_SPEC_CATALOG, PRAXIS_GLOBAL_ACTION_CATALOG, getGlobalActionCatalog, SURFACE_OPEN_I18N_NAMESPACE, getGlobalActionUiSchema, SurfaceOpenActionEditorComponent, SURFACE_OPEN_I18N_CONFIG } from '@praxisui/core';
|
|
26
27
|
import * as i1 from '@praxisui/dynamic-fields';
|
|
27
28
|
import { getControlTypeCatalog, ConfirmDialogComponent, DynamicFieldLoaderDirective } from '@praxisui/dynamic-fields';
|
|
28
29
|
import { BaseAiAdapter, PraxisAiAssistantComponent } from '@praxisui/ai';
|
|
@@ -30,32 +31,32 @@ import * as i6 from '@angular/material/menu';
|
|
|
30
31
|
import { MatMenuModule } from '@angular/material/menu';
|
|
31
32
|
import { produce } from 'immer';
|
|
32
33
|
import { DslParser } from '@praxisui/specification';
|
|
33
|
-
import * as
|
|
34
|
+
import * as i7 from '@praxisui/settings-panel';
|
|
34
35
|
import { SETTINGS_PANEL_DATA, GLOBAL_CONFIG_DYNAMIC_FORM_COMPONENT } from '@praxisui/settings-panel';
|
|
35
|
-
import * as
|
|
36
|
-
import * as i7$
|
|
36
|
+
import * as i12 from '@angular/router';
|
|
37
|
+
import * as i7$3 from '@angular/material/tabs';
|
|
37
38
|
import { MatTabsModule } from '@angular/material/tabs';
|
|
38
|
-
import * as i8
|
|
39
|
+
import * as i8 from '@angular/material/card';
|
|
39
40
|
import { MatCardModule } from '@angular/material/card';
|
|
40
41
|
import * as i4$1 from '@angular/material/form-field';
|
|
41
42
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
42
|
-
import * as i6$
|
|
43
|
+
import * as i6$3 from '@angular/material/select';
|
|
43
44
|
import { MatSelectModule } from '@angular/material/select';
|
|
44
|
-
import * as i7 from '@angular/material/input';
|
|
45
|
+
import * as i7$1 from '@angular/material/input';
|
|
45
46
|
import { MatInputModule } from '@angular/material/input';
|
|
46
|
-
import * as i12 from '@angular/material/checkbox';
|
|
47
|
+
import * as i12$1 from '@angular/material/checkbox';
|
|
47
48
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
48
|
-
import * as i6$
|
|
49
|
+
import * as i6$2 from '@angular/material/slide-toggle';
|
|
49
50
|
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
|
|
50
|
-
import * as i7$
|
|
51
|
+
import * as i7$2 from '@angular/material/button-toggle';
|
|
51
52
|
import { MatButtonToggleModule } from '@angular/material/button-toggle';
|
|
52
53
|
import { FieldType, PraxisVisualBuilder } from '@praxisui/visual-builder';
|
|
53
|
-
import * as i2$
|
|
54
|
+
import * as i2$2 from '@angular/cdk/drag-drop';
|
|
54
55
|
import { DragDropModule, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
|
|
55
56
|
import { ScrollingModule } from '@angular/cdk/scrolling';
|
|
56
|
-
import * as i11
|
|
57
|
+
import * as i11 from '@angular/material/divider';
|
|
57
58
|
import { MatDividerModule } from '@angular/material/divider';
|
|
58
|
-
import * as i6$
|
|
59
|
+
import * as i6$1 from '@angular/material/toolbar';
|
|
59
60
|
import { MatToolbarModule } from '@angular/material/toolbar';
|
|
60
61
|
import * as i3 from '@angular/material/expansion';
|
|
61
62
|
import { MatExpansionModule } from '@angular/material/expansion';
|
|
@@ -313,11 +314,11 @@ class CanvasToolbarComponent {
|
|
|
313
314
|
}, this.closeAnimMs);
|
|
314
315
|
}
|
|
315
316
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: CanvasToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
316
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: CanvasToolbarComponent, isStandalone: true, selector: "praxis-canvas-toolbar", inputs: { selectedElement: "selectedElement" }, outputs: { editMetadata: "editMetadata", delete: "delete", moveUp: "moveUp", moveDown: "moveDown", selectPath: "selectPath", requestClose: "requestClose", toggleReadonly: "toggleReadonly", toggleRequired: "toggleRequired", toggleHidden: "toggleHidden", toggleDisabled: "toggleDisabled" }, host: { listeners: { "document:keydown": "onGlobalKeydown($event)" } }, ngImport: i0, template: "<div class=\"canvas-toolbar-container\" [class.closing]=\"closing\" role=\"toolbar\" aria-label=\"Toolbar de configura\u00E7\u00E3o do canvas\">\n <!-- Bot\u00E3o discreto para fechar a toolbar -->\n <button\n type=\"button\"\n class=\"toolbar-close\"\n mat-icon-button\n (click)=\"triggerClose()\"\n matTooltip=\"Fechar\"\n [matTooltipShowDelay]=\"300\"\n aria-label=\"Fechar toolbar\"\n >\n <mat-icon>close</mat-icon>\n </button>\n <div class=\"toolbar-surface\">\n <!-- Breadcrumb em linha superior, discreto -->\n <div class=\"breadcrumb-row\">\n <div class=\"pfx-breadcrumb\" role=\"navigation\" aria-label=\"Caminho do formul\u00E1rio\">\n @for (part of selectedElement?.path; track part.type + part.name; let i = $index; let isLast = $last) {\n @if (!isLast) {\n <button\n type=\"button\"\n class=\"pfx-bc is-link breadcrumb-link\"\n (click)=\"selectPath.emit(part)\"\n [style.zIndex]=\"(selectedElement?.path?.length ?? 0) - i\"\n [attr.aria-current]=\"null\"\n >\n {{ part.name }}\n </button>\n } @else {\n <span\n class=\"pfx-bc is-active breadcrumb-current\"\n [style.zIndex]=\"(selectedElement?.path?.length ?? 0) - i\"\n aria-current=\"page\"\n >\n {{ part.name }}\n </span>\n }\n }\n </div>\n </div>\n\n <!-- Barra de a\u00E7\u00F5es separada em grupos l\u00F3gicos -->\n <div class=\"actions-row\">\n @if (isSection) {\n <div class=\"action-group group-move\" aria-label=\"Mover\">\n <button type=\"button\" mat-icon-button (click)=\"moveUp.emit()\" matTooltip=\"Mover para cima\" [matTooltipShowDelay]=\"300\" aria-label=\"Mover para cima\">\n <mat-icon>arrow_upward</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"moveDown.emit()\" matTooltip=\"Mover para baixo\" [matTooltipShowDelay]=\"300\" aria-label=\"Mover para baixo\">\n <mat-icon>arrow_downward</mat-icon>\n </button>\n </div>\n }\n\n <!-- Configura\u00E7\u00E3o para qualquer elemento selecionado (se\u00E7\u00E3o/linha/coluna/campo) -->\n @if (selectedLastType && selectedLastType !== 'actions') {\n <div class=\"action-group group-config\" aria-label=\"Configura\u00E7\u00E3o\">\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"editMetadata.emit()\"\n [matTooltip]=\"configTooltip\"\n [matTooltipShowDelay]=\"300\"\n [attr.aria-label]=\"configTooltip\"\n >\n <mat-icon>tune</mat-icon>\n </button>\n </div>\n }\n\n @if (isField) {\n <!-- Visibilidade e estados -->\n <div class=\"action-group group-visibility\" aria-label=\"Visibilidade e estados\">\n <button type=\"button\" mat-icon-button (click)=\"toggleReadonly.emit()\" matTooltip=\"Alternar somente leitura\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar somente leitura\">\n <mat-icon>{{ readonlyIcon }}</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"toggleHidden.emit()\" matTooltip=\"Alternar visibilidade\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar visibilidade\">\n <mat-icon>{{ visibilityIcon }}</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"toggleDisabled.emit()\" matTooltip=\"Alternar desabilitado\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar desabilitado\">\n <mat-icon>{{ disabledIcon }}</mat-icon>\n </button>\n </div>\n\n <!-- Valida\u00E7\u00E3o / Obrigat\u00F3rio -->\n <div class=\"action-group group-validation\" aria-label=\"Valida\u00E7\u00E3o\">\n <button type=\"button\" mat-icon-button (click)=\"toggleRequired.emit()\" matTooltip=\"Alternar obrigat\u00F3rio\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar obrigat\u00F3rio\">\n <mat-icon>{{ requiredIcon }}</mat-icon>\n </button>\n </div>\n }\n\n <!-- A\u00E7\u00E3o destrutiva isolada -->\n <div class=\"action-group group-danger\" aria-label=\"A\u00E7\u00F5es perigosas\">\n <button type=\"button\" mat-icon-button color=\"warn\" (click)=\"delete.emit()\" matTooltip=\"Remover\" [matTooltipShowDelay]=\"300\" aria-label=\"Remover\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block;position:absolute;top:0;left:0;z-index:2001;pointer-events:none;--canvas-primary: var( --md-sys-color-primary, var(--md-sys-color-primary) );--canvas-surface: var( --md-sys-color-surface, var(--md-sys-color-surface) );--canvas-on-surface: var( --md-sys-color-on-surface, var(--md-sys-color-on-surface) );--canvas-error: var( --md-sys-color-error, var(--md-sys-color-error) );--canvas-border-color: var(--pfx-surface-border, var(--md-sys-color-outline-variant));--primary: var(--md-sys-color-primary, var(--md-sys-color-primary, var(--canvas-primary)));--on-primary: var(--md-sys-color-on-primary);--surface: var(--md-sys-color-surface, var(--md-sys-color-surface, var(--canvas-surface)));--surface-variant: var( --md-sys-color-surface-variant, var(--md-sys-color-surface-variant) );--on-surface-variant: var( --md-sys-color-on-surface-variant, var(--md-sys-color-on-surface-variant) );--bc-h: 28px;--bc-aw: 18px;--bc-divider: var(--md-sys-color-outline-variant);--bc-bg: var(--surface-variant);--bc-fg: var(--on-surface-variant);--bc-active-bg: var(--primary);--bc-active-fg: var(--on-primary);--bc-label-inset: 24px;--bc-bg-tone-1: var(--bc-bg);--bc-bg-tone-2: var(--md-sys-color-surface-container-low)}.canvas-toolbar-container{display:grid;grid-template-rows:auto auto;align-items:stretch;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:var(--canvas-on-surface);border-radius:10px;box-shadow:var(--md-sys-elevation-level3);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;pointer-events:all;transform:translateY(-100%);margin-top:-6px;position:relative;overflow:visible;animation:toolbarIn .14s ease-out}.toolbar-surface{display:grid;grid-template-rows:auto auto;border-radius:inherit;overflow:hidden;background:var(--md-sys-color-surface-container-low)}.canvas-toolbar-container.closing{pointer-events:none;animation:toolbarOut .14s ease-in forwards}.toolbar-close{--p-close-size: 36px;--p-close-icon: 20px;position:absolute;top:-18px;right:-18px;z-index:10;width:var(--p-close-size);height:var(--p-close-size);border-radius:999px;display:inline-flex;align-items:center;justify-content:center;pointer-events:auto;background:var(--md-sys-color-surface-container);border:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level1);color:var(--md-sys-color-on-surface);--mdc-icon-button-state-layer-size: calc(var(--p-close-size) + 4px);opacity:0;pointer-events:none;transition:background-color .15s ease,box-shadow .15s ease,transform .06s ease,opacity .12s ease}.canvas-toolbar-container:hover .toolbar-close,.canvas-toolbar-container:focus-within .toolbar-close,.toolbar-close:focus-visible,.canvas-toolbar-container.closing .toolbar-close{opacity:1;pointer-events:auto}.toolbar-close:hover{background:var(--md-sys-color-surface-container-high);box-shadow:var(--md-sys-elevation-level2)}.toolbar-close:active{transform:scale(.98)}.toolbar-close:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}.toolbar-close .mat-icon{width:var(--p-close-icon);height:var(--p-close-icon);font-size:var(--p-close-icon);line-height:var(--p-close-icon)}@supports not ((mask-composite: exclude) or (-webkit-mask-composite: xor)){.canvas-toolbar-container{border:2px solid transparent;background:var(--md-sys-color-surface-container-low);border-color:var(--md-sys-color-primary)}.canvas-toolbar-container:after{display:none}}.canvas-toolbar-container:after{content:\"\";position:absolute;inset:0;border-radius:inherit;padding:2px;background:var(--p-primary-gradient, var(--md-sys-color-primary));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}@keyframes toolbarIn{0%{opacity:0;transform:translateY(calc(-100% - 4px)) scale(.98)}to{opacity:1;transform:translateY(-100%) scale(1)}}@keyframes toolbarOut{0%{opacity:1;transform:translateY(-100%) scale(1)}to{opacity:0;transform:translateY(calc(-100% - 4px)) scale(.98)}}.breadcrumb-row{display:flex;align-items:center;min-height:22px;padding-block:2px;padding-inline:8px calc(8px + var(--bc-aw, 18px));border-bottom:0;background:var(--surface)}.breadcrumb-bar{display:flex;align-items:center;white-space:nowrap}.breadcrumb-separator{display:none}.actions-row{display:flex;align-items:center;padding:4px;gap:6px;background:var(--md-sys-color-surface-container-low)}.action-group{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:6px;background:var(--md-sys-color-surface-container-lowest);border:0}.pfx-breadcrumb{display:flex;align-items:center;white-space:nowrap;font-size:.85rem;line-height:1}.pfx-bc{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:max-content;height:var(--bc-h, 28px);padding-inline:16px 14px;padding-inline-start:calc(var(--bc-label-inset, 24px) + var(--bc-aw, 18px));margin-inline-end:calc(-1 * var(--bc-aw, 18px));--bc-bg-local: var(--bc-bg, var(--surface-variant));background:var(--bc-bg-local);color:var(--bc-fg, var(--on-surface-variant));border:0;border-radius:6px 0 0 6px;box-shadow:none!important;outline:0;background-clip:padding-box;cursor:default}.pfx-bc:after{content:\"\";position:absolute;top:0;bottom:0;right:calc(-1 * var(--bc-aw, 18px));border-top:calc(var(--bc-h, 28px) / 2) solid transparent;border-bottom:calc(var(--bc-h, 28px) / 2) solid transparent;border-left:var(--bc-aw, 18px) solid var(--bc-bg-local);transform:translate(-1px);pointer-events:none}.pfx-bc:before{display:none}.pfx-bc.is-link{cursor:pointer}.pfx-bc.is-link:hover{background:var(--surface)}.pfx-bc.is-link:hover:after{border-left-color:var(--surface)}.pfx-bc.is-active{background:var(--bc-active-bg, var(--primary));color:var(--bc-active-fg, var(--on-primary));cursor:default;font-weight:600;margin-inline-end:0;border-radius:6px 0 0 6px}.pfx-bc.is-active:after{border-left-color:var(--bc-active-bg, var(--primary))}.pfx-bc:focus-visible{box-shadow:0 0 0 2px var(--md-sys-color-primary)}.pfx-bc:first-child{border-top-left-radius:12px;border-bottom-left-radius:12px;padding-inline-start:16px}.pfx-bc:not(.is-active):nth-child(odd){--bc-bg-local: var(--bc-bg-tone-1)}.pfx-bc:not(.is-active):nth-child(2n){--bc-bg-local: var(--bc-bg-tone-2)}[dir=rtl] .pfx-bc{margin-inline-end:0;margin-inline-start:calc(-1 * var(--bc-aw, 18px))}[dir=rtl] .pfx-bc.is-active{margin-inline-start:0}[dir=rtl] .pfx-bc:after{right:auto;left:calc(-1 * var(--bc-aw, 18px));border-left:0;border-right:var(--bc-aw, 18px) solid var(--bc-bg-local);transform:translate(1px)}[dir=rtl] .pfx-bc.is-active:after{border-right-color:var(--bc-active-bg, var(--primary))}[dir=rtl] .pfx-bc:before{right:auto;left:calc(-1px - var(--bc-aw, 18px))}.action-group+.action-group{margin-left:4px}.group-danger{margin-left:8px;background:var(--md-sys-color-error-container);border-color:var(--md-sys-color-error)}.actions-row button{width:32px;height:32px;line-height:32px;display:inline-flex;align-items:center;justify-content:center;color:var(--canvas-on-surface)}.actions-row mat-icon{font-size:18px;width:18px;height:18px;line-height:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
|
|
317
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: CanvasToolbarComponent, isStandalone: true, selector: "praxis-canvas-toolbar", inputs: { selectedElement: "selectedElement" }, outputs: { editMetadata: "editMetadata", delete: "delete", moveUp: "moveUp", moveDown: "moveDown", selectPath: "selectPath", requestClose: "requestClose", toggleReadonly: "toggleReadonly", toggleRequired: "toggleRequired", toggleHidden: "toggleHidden", toggleDisabled: "toggleDisabled" }, host: { listeners: { "document:keydown": "onGlobalKeydown($event)" } }, ngImport: i0, template: "<div class=\"canvas-toolbar-container\" [class.closing]=\"closing\" role=\"toolbar\" aria-label=\"Toolbar de configura\u00E7\u00E3o do canvas\">\n <!-- Bot\u00E3o discreto para fechar a toolbar -->\n <button\n type=\"button\"\n class=\"toolbar-close\"\n mat-icon-button\n (click)=\"triggerClose()\"\n matTooltip=\"Fechar\"\n [matTooltipShowDelay]=\"300\"\n aria-label=\"Fechar toolbar\"\n >\n <mat-icon>close</mat-icon>\n </button>\n <div class=\"toolbar-surface\">\n <!-- Breadcrumb em linha superior, discreto -->\n <div class=\"breadcrumb-row\">\n <div class=\"pfx-breadcrumb\" role=\"navigation\" aria-label=\"Caminho do formul\u00E1rio\">\n @for (part of selectedElement?.path; track part.type + part.name; let i = $index; let isLast = $last) {\n @if (!isLast) {\n <button\n type=\"button\"\n class=\"pfx-bc is-link breadcrumb-link\"\n (click)=\"selectPath.emit(part)\"\n [style.zIndex]=\"(selectedElement?.path?.length ?? 0) - i\"\n [attr.aria-current]=\"null\"\n >\n {{ part.name }}\n </button>\n } @else {\n <span\n class=\"pfx-bc is-active breadcrumb-current\"\n [style.zIndex]=\"(selectedElement?.path?.length ?? 0) - i\"\n aria-current=\"page\"\n >\n {{ part.name }}\n </span>\n }\n }\n </div>\n </div>\n\n <!-- Barra de a\u00E7\u00F5es separada em grupos l\u00F3gicos -->\n <div class=\"actions-row\">\n @if (isSection) {\n <div class=\"action-group group-move\" aria-label=\"Mover\">\n <button type=\"button\" mat-icon-button (click)=\"moveUp.emit()\" matTooltip=\"Mover para cima\" [matTooltipShowDelay]=\"300\" aria-label=\"Mover para cima\">\n <mat-icon>arrow_upward</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"moveDown.emit()\" matTooltip=\"Mover para baixo\" [matTooltipShowDelay]=\"300\" aria-label=\"Mover para baixo\">\n <mat-icon>arrow_downward</mat-icon>\n </button>\n </div>\n }\n\n <!-- Configura\u00E7\u00E3o para qualquer elemento selecionado (se\u00E7\u00E3o/linha/coluna/campo) -->\n @if (selectedLastType && selectedLastType !== 'actions') {\n <div class=\"action-group group-config\" aria-label=\"Configura\u00E7\u00E3o\">\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"editMetadata.emit()\"\n [matTooltip]=\"configTooltip\"\n [matTooltipShowDelay]=\"300\"\n [attr.aria-label]=\"configTooltip\"\n >\n <mat-icon>tune</mat-icon>\n </button>\n </div>\n }\n\n @if (isField) {\n <!-- Visibilidade e estados -->\n <div class=\"action-group group-visibility\" aria-label=\"Visibilidade e estados\">\n <button type=\"button\" mat-icon-button (click)=\"toggleReadonly.emit()\" matTooltip=\"Alternar somente leitura\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar somente leitura\">\n <mat-icon>{{ readonlyIcon }}</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"toggleHidden.emit()\" matTooltip=\"Alternar visibilidade\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar visibilidade\">\n <mat-icon>{{ visibilityIcon }}</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"toggleDisabled.emit()\" matTooltip=\"Alternar desabilitado\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar desabilitado\">\n <mat-icon>{{ disabledIcon }}</mat-icon>\n </button>\n </div>\n\n <!-- Valida\u00E7\u00E3o / Obrigat\u00F3rio -->\n <div class=\"action-group group-validation\" aria-label=\"Valida\u00E7\u00E3o\">\n <button type=\"button\" mat-icon-button (click)=\"toggleRequired.emit()\" matTooltip=\"Alternar obrigat\u00F3rio\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar obrigat\u00F3rio\">\n <mat-icon>{{ requiredIcon }}</mat-icon>\n </button>\n </div>\n }\n\n <!-- A\u00E7\u00E3o destrutiva isolada -->\n <div class=\"action-group group-danger\" aria-label=\"A\u00E7\u00F5es perigosas\">\n <button type=\"button\" mat-icon-button color=\"warn\" (click)=\"delete.emit()\" matTooltip=\"Remover\" [matTooltipShowDelay]=\"300\" aria-label=\"Remover\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block;position:absolute;top:0;left:0;z-index:var(--praxis-layer-authoring-toolbar, 340);pointer-events:none;--canvas-primary: var( --md-sys-color-primary, var(--md-sys-color-primary) );--canvas-surface: var( --md-sys-color-surface, var(--md-sys-color-surface) );--canvas-on-surface: var( --md-sys-color-on-surface, var(--md-sys-color-on-surface) );--canvas-error: var( --md-sys-color-error, var(--md-sys-color-error) );--canvas-border-color: var(--pfx-surface-border, var(--md-sys-color-outline-variant));--primary: var(--md-sys-color-primary, var(--md-sys-color-primary, var(--canvas-primary)));--on-primary: var(--md-sys-color-on-primary);--surface: var(--md-sys-color-surface, var(--md-sys-color-surface, var(--canvas-surface)));--surface-variant: var( --md-sys-color-surface-variant, var(--md-sys-color-surface-variant) );--on-surface-variant: var( --md-sys-color-on-surface-variant, var(--md-sys-color-on-surface-variant) );--bc-h: 28px;--bc-aw: 18px;--bc-divider: var(--md-sys-color-outline-variant);--bc-bg: var(--surface-variant);--bc-fg: var(--on-surface-variant);--bc-active-bg: var(--primary);--bc-active-fg: var(--on-primary);--bc-label-inset: 24px;--bc-bg-tone-1: var(--bc-bg);--bc-bg-tone-2: var(--md-sys-color-surface-container-low)}.canvas-toolbar-container{display:grid;grid-template-rows:auto auto;align-items:stretch;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:var(--canvas-on-surface);border-radius:10px;box-shadow:var(--md-sys-elevation-level3);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;pointer-events:all;transform:translateY(-100%);margin-top:-6px;position:relative;overflow:visible;animation:toolbarIn .14s ease-out}.toolbar-surface{display:grid;grid-template-rows:auto auto;border-radius:inherit;overflow:hidden;background:var(--md-sys-color-surface-container-low)}.canvas-toolbar-container.closing{pointer-events:none;animation:toolbarOut .14s ease-in forwards}.toolbar-close{--p-close-size: 36px;--p-close-icon: 20px;position:absolute;top:-18px;right:-18px;z-index:10;width:var(--p-close-size);height:var(--p-close-size);border-radius:999px;display:inline-flex;align-items:center;justify-content:center;pointer-events:auto;background:var(--md-sys-color-surface-container);border:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level1);color:var(--md-sys-color-on-surface);--mdc-icon-button-state-layer-size: calc(var(--p-close-size) + 4px);opacity:0;pointer-events:none;transition:background-color .15s ease,box-shadow .15s ease,transform .06s ease,opacity .12s ease}.canvas-toolbar-container:hover .toolbar-close,.canvas-toolbar-container:focus-within .toolbar-close,.toolbar-close:focus-visible,.canvas-toolbar-container.closing .toolbar-close{opacity:1;pointer-events:auto}.toolbar-close:hover{background:var(--md-sys-color-surface-container-high);box-shadow:var(--md-sys-elevation-level2)}.toolbar-close:active{transform:scale(.98)}.toolbar-close:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}.toolbar-close .mat-icon{width:var(--p-close-icon);height:var(--p-close-icon);font-size:var(--p-close-icon);line-height:var(--p-close-icon)}@supports not ((mask-composite: exclude) or (-webkit-mask-composite: xor)){.canvas-toolbar-container{border:2px solid transparent;background:var(--md-sys-color-surface-container-low);border-color:var(--md-sys-color-primary)}.canvas-toolbar-container:after{display:none}}.canvas-toolbar-container:after{content:\"\";position:absolute;inset:0;border-radius:inherit;padding:2px;background:var(--p-primary-gradient, var(--md-sys-color-primary));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}@keyframes toolbarIn{0%{opacity:0;transform:translateY(calc(-100% - 4px)) scale(.98)}to{opacity:1;transform:translateY(-100%) scale(1)}}@keyframes toolbarOut{0%{opacity:1;transform:translateY(-100%) scale(1)}to{opacity:0;transform:translateY(calc(-100% - 4px)) scale(.98)}}.breadcrumb-row{display:flex;align-items:center;min-height:22px;padding-block:2px;padding-inline:8px calc(8px + var(--bc-aw, 18px));border-bottom:0;background:var(--surface)}.breadcrumb-bar{display:flex;align-items:center;white-space:nowrap}.breadcrumb-separator{display:none}.actions-row{display:flex;align-items:center;padding:4px;gap:6px;background:var(--md-sys-color-surface-container-low)}.action-group{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:6px;background:var(--md-sys-color-surface-container-lowest);border:0}.pfx-breadcrumb{display:flex;align-items:center;white-space:nowrap;font-size:.85rem;line-height:1}.pfx-bc{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:max-content;height:var(--bc-h, 28px);padding-inline:16px 14px;padding-inline-start:calc(var(--bc-label-inset, 24px) + var(--bc-aw, 18px));margin-inline-end:calc(-1 * var(--bc-aw, 18px));--bc-bg-local: var(--bc-bg, var(--surface-variant));background:var(--bc-bg-local);color:var(--bc-fg, var(--on-surface-variant));border:0;border-radius:6px 0 0 6px;box-shadow:none!important;outline:0;background-clip:padding-box;cursor:default}.pfx-bc:after{content:\"\";position:absolute;top:0;bottom:0;right:calc(-1 * var(--bc-aw, 18px));border-top:calc(var(--bc-h, 28px) / 2) solid transparent;border-bottom:calc(var(--bc-h, 28px) / 2) solid transparent;border-left:var(--bc-aw, 18px) solid var(--bc-bg-local);transform:translate(-1px);pointer-events:none}.pfx-bc:before{display:none}.pfx-bc.is-link{cursor:pointer}.pfx-bc.is-link:hover{background:var(--surface)}.pfx-bc.is-link:hover:after{border-left-color:var(--surface)}.pfx-bc.is-active{background:var(--bc-active-bg, var(--primary));color:var(--bc-active-fg, var(--on-primary));cursor:default;font-weight:600;margin-inline-end:0;border-radius:6px 0 0 6px}.pfx-bc.is-active:after{border-left-color:var(--bc-active-bg, var(--primary))}.pfx-bc:focus-visible{box-shadow:0 0 0 2px var(--md-sys-color-primary)}.pfx-bc:first-child{border-top-left-radius:12px;border-bottom-left-radius:12px;padding-inline-start:16px}.pfx-bc:not(.is-active):nth-child(odd){--bc-bg-local: var(--bc-bg-tone-1)}.pfx-bc:not(.is-active):nth-child(2n){--bc-bg-local: var(--bc-bg-tone-2)}[dir=rtl] .pfx-bc{margin-inline-end:0;margin-inline-start:calc(-1 * var(--bc-aw, 18px))}[dir=rtl] .pfx-bc.is-active{margin-inline-start:0}[dir=rtl] .pfx-bc:after{right:auto;left:calc(-1 * var(--bc-aw, 18px));border-left:0;border-right:var(--bc-aw, 18px) solid var(--bc-bg-local);transform:translate(1px)}[dir=rtl] .pfx-bc.is-active:after{border-right-color:var(--bc-active-bg, var(--primary))}[dir=rtl] .pfx-bc:before{right:auto;left:calc(-1px - var(--bc-aw, 18px))}.action-group+.action-group{margin-left:4px}.group-danger{margin-left:8px;background:var(--md-sys-color-error-container);border-color:var(--md-sys-color-error)}.actions-row button{width:32px;height:32px;line-height:32px;display:inline-flex;align-items:center;justify-content:center;color:var(--canvas-on-surface)}.actions-row mat-icon{font-size:18px;width:18px;height:18px;line-height:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
|
|
317
318
|
}
|
|
318
319
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: CanvasToolbarComponent, decorators: [{
|
|
319
320
|
type: Component,
|
|
320
|
-
args: [{ selector: 'praxis-canvas-toolbar', standalone: true, imports: [CommonModule, MatButtonModule, MatIconModule, MatTooltipModule], template: "<div class=\"canvas-toolbar-container\" [class.closing]=\"closing\" role=\"toolbar\" aria-label=\"Toolbar de configura\u00E7\u00E3o do canvas\">\n <!-- Bot\u00E3o discreto para fechar a toolbar -->\n <button\n type=\"button\"\n class=\"toolbar-close\"\n mat-icon-button\n (click)=\"triggerClose()\"\n matTooltip=\"Fechar\"\n [matTooltipShowDelay]=\"300\"\n aria-label=\"Fechar toolbar\"\n >\n <mat-icon>close</mat-icon>\n </button>\n <div class=\"toolbar-surface\">\n <!-- Breadcrumb em linha superior, discreto -->\n <div class=\"breadcrumb-row\">\n <div class=\"pfx-breadcrumb\" role=\"navigation\" aria-label=\"Caminho do formul\u00E1rio\">\n @for (part of selectedElement?.path; track part.type + part.name; let i = $index; let isLast = $last) {\n @if (!isLast) {\n <button\n type=\"button\"\n class=\"pfx-bc is-link breadcrumb-link\"\n (click)=\"selectPath.emit(part)\"\n [style.zIndex]=\"(selectedElement?.path?.length ?? 0) - i\"\n [attr.aria-current]=\"null\"\n >\n {{ part.name }}\n </button>\n } @else {\n <span\n class=\"pfx-bc is-active breadcrumb-current\"\n [style.zIndex]=\"(selectedElement?.path?.length ?? 0) - i\"\n aria-current=\"page\"\n >\n {{ part.name }}\n </span>\n }\n }\n </div>\n </div>\n\n <!-- Barra de a\u00E7\u00F5es separada em grupos l\u00F3gicos -->\n <div class=\"actions-row\">\n @if (isSection) {\n <div class=\"action-group group-move\" aria-label=\"Mover\">\n <button type=\"button\" mat-icon-button (click)=\"moveUp.emit()\" matTooltip=\"Mover para cima\" [matTooltipShowDelay]=\"300\" aria-label=\"Mover para cima\">\n <mat-icon>arrow_upward</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"moveDown.emit()\" matTooltip=\"Mover para baixo\" [matTooltipShowDelay]=\"300\" aria-label=\"Mover para baixo\">\n <mat-icon>arrow_downward</mat-icon>\n </button>\n </div>\n }\n\n <!-- Configura\u00E7\u00E3o para qualquer elemento selecionado (se\u00E7\u00E3o/linha/coluna/campo) -->\n @if (selectedLastType && selectedLastType !== 'actions') {\n <div class=\"action-group group-config\" aria-label=\"Configura\u00E7\u00E3o\">\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"editMetadata.emit()\"\n [matTooltip]=\"configTooltip\"\n [matTooltipShowDelay]=\"300\"\n [attr.aria-label]=\"configTooltip\"\n >\n <mat-icon>tune</mat-icon>\n </button>\n </div>\n }\n\n @if (isField) {\n <!-- Visibilidade e estados -->\n <div class=\"action-group group-visibility\" aria-label=\"Visibilidade e estados\">\n <button type=\"button\" mat-icon-button (click)=\"toggleReadonly.emit()\" matTooltip=\"Alternar somente leitura\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar somente leitura\">\n <mat-icon>{{ readonlyIcon }}</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"toggleHidden.emit()\" matTooltip=\"Alternar visibilidade\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar visibilidade\">\n <mat-icon>{{ visibilityIcon }}</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"toggleDisabled.emit()\" matTooltip=\"Alternar desabilitado\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar desabilitado\">\n <mat-icon>{{ disabledIcon }}</mat-icon>\n </button>\n </div>\n\n <!-- Valida\u00E7\u00E3o / Obrigat\u00F3rio -->\n <div class=\"action-group group-validation\" aria-label=\"Valida\u00E7\u00E3o\">\n <button type=\"button\" mat-icon-button (click)=\"toggleRequired.emit()\" matTooltip=\"Alternar obrigat\u00F3rio\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar obrigat\u00F3rio\">\n <mat-icon>{{ requiredIcon }}</mat-icon>\n </button>\n </div>\n }\n\n <!-- A\u00E7\u00E3o destrutiva isolada -->\n <div class=\"action-group group-danger\" aria-label=\"A\u00E7\u00F5es perigosas\">\n <button type=\"button\" mat-icon-button color=\"warn\" (click)=\"delete.emit()\" matTooltip=\"Remover\" [matTooltipShowDelay]=\"300\" aria-label=\"Remover\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block;position:absolute;top:0;left:0;z-index:2001;pointer-events:none;--canvas-primary: var( --md-sys-color-primary, var(--md-sys-color-primary) );--canvas-surface: var( --md-sys-color-surface, var(--md-sys-color-surface) );--canvas-on-surface: var( --md-sys-color-on-surface, var(--md-sys-color-on-surface) );--canvas-error: var( --md-sys-color-error, var(--md-sys-color-error) );--canvas-border-color: var(--pfx-surface-border, var(--md-sys-color-outline-variant));--primary: var(--md-sys-color-primary, var(--md-sys-color-primary, var(--canvas-primary)));--on-primary: var(--md-sys-color-on-primary);--surface: var(--md-sys-color-surface, var(--md-sys-color-surface, var(--canvas-surface)));--surface-variant: var( --md-sys-color-surface-variant, var(--md-sys-color-surface-variant) );--on-surface-variant: var( --md-sys-color-on-surface-variant, var(--md-sys-color-on-surface-variant) );--bc-h: 28px;--bc-aw: 18px;--bc-divider: var(--md-sys-color-outline-variant);--bc-bg: var(--surface-variant);--bc-fg: var(--on-surface-variant);--bc-active-bg: var(--primary);--bc-active-fg: var(--on-primary);--bc-label-inset: 24px;--bc-bg-tone-1: var(--bc-bg);--bc-bg-tone-2: var(--md-sys-color-surface-container-low)}.canvas-toolbar-container{display:grid;grid-template-rows:auto auto;align-items:stretch;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:var(--canvas-on-surface);border-radius:10px;box-shadow:var(--md-sys-elevation-level3);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;pointer-events:all;transform:translateY(-100%);margin-top:-6px;position:relative;overflow:visible;animation:toolbarIn .14s ease-out}.toolbar-surface{display:grid;grid-template-rows:auto auto;border-radius:inherit;overflow:hidden;background:var(--md-sys-color-surface-container-low)}.canvas-toolbar-container.closing{pointer-events:none;animation:toolbarOut .14s ease-in forwards}.toolbar-close{--p-close-size: 36px;--p-close-icon: 20px;position:absolute;top:-18px;right:-18px;z-index:10;width:var(--p-close-size);height:var(--p-close-size);border-radius:999px;display:inline-flex;align-items:center;justify-content:center;pointer-events:auto;background:var(--md-sys-color-surface-container);border:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level1);color:var(--md-sys-color-on-surface);--mdc-icon-button-state-layer-size: calc(var(--p-close-size) + 4px);opacity:0;pointer-events:none;transition:background-color .15s ease,box-shadow .15s ease,transform .06s ease,opacity .12s ease}.canvas-toolbar-container:hover .toolbar-close,.canvas-toolbar-container:focus-within .toolbar-close,.toolbar-close:focus-visible,.canvas-toolbar-container.closing .toolbar-close{opacity:1;pointer-events:auto}.toolbar-close:hover{background:var(--md-sys-color-surface-container-high);box-shadow:var(--md-sys-elevation-level2)}.toolbar-close:active{transform:scale(.98)}.toolbar-close:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}.toolbar-close .mat-icon{width:var(--p-close-icon);height:var(--p-close-icon);font-size:var(--p-close-icon);line-height:var(--p-close-icon)}@supports not ((mask-composite: exclude) or (-webkit-mask-composite: xor)){.canvas-toolbar-container{border:2px solid transparent;background:var(--md-sys-color-surface-container-low);border-color:var(--md-sys-color-primary)}.canvas-toolbar-container:after{display:none}}.canvas-toolbar-container:after{content:\"\";position:absolute;inset:0;border-radius:inherit;padding:2px;background:var(--p-primary-gradient, var(--md-sys-color-primary));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}@keyframes toolbarIn{0%{opacity:0;transform:translateY(calc(-100% - 4px)) scale(.98)}to{opacity:1;transform:translateY(-100%) scale(1)}}@keyframes toolbarOut{0%{opacity:1;transform:translateY(-100%) scale(1)}to{opacity:0;transform:translateY(calc(-100% - 4px)) scale(.98)}}.breadcrumb-row{display:flex;align-items:center;min-height:22px;padding-block:2px;padding-inline:8px calc(8px + var(--bc-aw, 18px));border-bottom:0;background:var(--surface)}.breadcrumb-bar{display:flex;align-items:center;white-space:nowrap}.breadcrumb-separator{display:none}.actions-row{display:flex;align-items:center;padding:4px;gap:6px;background:var(--md-sys-color-surface-container-low)}.action-group{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:6px;background:var(--md-sys-color-surface-container-lowest);border:0}.pfx-breadcrumb{display:flex;align-items:center;white-space:nowrap;font-size:.85rem;line-height:1}.pfx-bc{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:max-content;height:var(--bc-h, 28px);padding-inline:16px 14px;padding-inline-start:calc(var(--bc-label-inset, 24px) + var(--bc-aw, 18px));margin-inline-end:calc(-1 * var(--bc-aw, 18px));--bc-bg-local: var(--bc-bg, var(--surface-variant));background:var(--bc-bg-local);color:var(--bc-fg, var(--on-surface-variant));border:0;border-radius:6px 0 0 6px;box-shadow:none!important;outline:0;background-clip:padding-box;cursor:default}.pfx-bc:after{content:\"\";position:absolute;top:0;bottom:0;right:calc(-1 * var(--bc-aw, 18px));border-top:calc(var(--bc-h, 28px) / 2) solid transparent;border-bottom:calc(var(--bc-h, 28px) / 2) solid transparent;border-left:var(--bc-aw, 18px) solid var(--bc-bg-local);transform:translate(-1px);pointer-events:none}.pfx-bc:before{display:none}.pfx-bc.is-link{cursor:pointer}.pfx-bc.is-link:hover{background:var(--surface)}.pfx-bc.is-link:hover:after{border-left-color:var(--surface)}.pfx-bc.is-active{background:var(--bc-active-bg, var(--primary));color:var(--bc-active-fg, var(--on-primary));cursor:default;font-weight:600;margin-inline-end:0;border-radius:6px 0 0 6px}.pfx-bc.is-active:after{border-left-color:var(--bc-active-bg, var(--primary))}.pfx-bc:focus-visible{box-shadow:0 0 0 2px var(--md-sys-color-primary)}.pfx-bc:first-child{border-top-left-radius:12px;border-bottom-left-radius:12px;padding-inline-start:16px}.pfx-bc:not(.is-active):nth-child(odd){--bc-bg-local: var(--bc-bg-tone-1)}.pfx-bc:not(.is-active):nth-child(2n){--bc-bg-local: var(--bc-bg-tone-2)}[dir=rtl] .pfx-bc{margin-inline-end:0;margin-inline-start:calc(-1 * var(--bc-aw, 18px))}[dir=rtl] .pfx-bc.is-active{margin-inline-start:0}[dir=rtl] .pfx-bc:after{right:auto;left:calc(-1 * var(--bc-aw, 18px));border-left:0;border-right:var(--bc-aw, 18px) solid var(--bc-bg-local);transform:translate(1px)}[dir=rtl] .pfx-bc.is-active:after{border-right-color:var(--bc-active-bg, var(--primary))}[dir=rtl] .pfx-bc:before{right:auto;left:calc(-1px - var(--bc-aw, 18px))}.action-group+.action-group{margin-left:4px}.group-danger{margin-left:8px;background:var(--md-sys-color-error-container);border-color:var(--md-sys-color-error)}.actions-row button{width:32px;height:32px;line-height:32px;display:inline-flex;align-items:center;justify-content:center;color:var(--canvas-on-surface)}.actions-row mat-icon{font-size:18px;width:18px;height:18px;line-height:1}\n"] }]
|
|
321
|
+
args: [{ selector: 'praxis-canvas-toolbar', standalone: true, imports: [CommonModule, MatButtonModule, MatIconModule, MatTooltipModule], template: "<div class=\"canvas-toolbar-container\" [class.closing]=\"closing\" role=\"toolbar\" aria-label=\"Toolbar de configura\u00E7\u00E3o do canvas\">\n <!-- Bot\u00E3o discreto para fechar a toolbar -->\n <button\n type=\"button\"\n class=\"toolbar-close\"\n mat-icon-button\n (click)=\"triggerClose()\"\n matTooltip=\"Fechar\"\n [matTooltipShowDelay]=\"300\"\n aria-label=\"Fechar toolbar\"\n >\n <mat-icon>close</mat-icon>\n </button>\n <div class=\"toolbar-surface\">\n <!-- Breadcrumb em linha superior, discreto -->\n <div class=\"breadcrumb-row\">\n <div class=\"pfx-breadcrumb\" role=\"navigation\" aria-label=\"Caminho do formul\u00E1rio\">\n @for (part of selectedElement?.path; track part.type + part.name; let i = $index; let isLast = $last) {\n @if (!isLast) {\n <button\n type=\"button\"\n class=\"pfx-bc is-link breadcrumb-link\"\n (click)=\"selectPath.emit(part)\"\n [style.zIndex]=\"(selectedElement?.path?.length ?? 0) - i\"\n [attr.aria-current]=\"null\"\n >\n {{ part.name }}\n </button>\n } @else {\n <span\n class=\"pfx-bc is-active breadcrumb-current\"\n [style.zIndex]=\"(selectedElement?.path?.length ?? 0) - i\"\n aria-current=\"page\"\n >\n {{ part.name }}\n </span>\n }\n }\n </div>\n </div>\n\n <!-- Barra de a\u00E7\u00F5es separada em grupos l\u00F3gicos -->\n <div class=\"actions-row\">\n @if (isSection) {\n <div class=\"action-group group-move\" aria-label=\"Mover\">\n <button type=\"button\" mat-icon-button (click)=\"moveUp.emit()\" matTooltip=\"Mover para cima\" [matTooltipShowDelay]=\"300\" aria-label=\"Mover para cima\">\n <mat-icon>arrow_upward</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"moveDown.emit()\" matTooltip=\"Mover para baixo\" [matTooltipShowDelay]=\"300\" aria-label=\"Mover para baixo\">\n <mat-icon>arrow_downward</mat-icon>\n </button>\n </div>\n }\n\n <!-- Configura\u00E7\u00E3o para qualquer elemento selecionado (se\u00E7\u00E3o/linha/coluna/campo) -->\n @if (selectedLastType && selectedLastType !== 'actions') {\n <div class=\"action-group group-config\" aria-label=\"Configura\u00E7\u00E3o\">\n <button\n type=\"button\"\n mat-icon-button\n (click)=\"editMetadata.emit()\"\n [matTooltip]=\"configTooltip\"\n [matTooltipShowDelay]=\"300\"\n [attr.aria-label]=\"configTooltip\"\n >\n <mat-icon>tune</mat-icon>\n </button>\n </div>\n }\n\n @if (isField) {\n <!-- Visibilidade e estados -->\n <div class=\"action-group group-visibility\" aria-label=\"Visibilidade e estados\">\n <button type=\"button\" mat-icon-button (click)=\"toggleReadonly.emit()\" matTooltip=\"Alternar somente leitura\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar somente leitura\">\n <mat-icon>{{ readonlyIcon }}</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"toggleHidden.emit()\" matTooltip=\"Alternar visibilidade\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar visibilidade\">\n <mat-icon>{{ visibilityIcon }}</mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"toggleDisabled.emit()\" matTooltip=\"Alternar desabilitado\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar desabilitado\">\n <mat-icon>{{ disabledIcon }}</mat-icon>\n </button>\n </div>\n\n <!-- Valida\u00E7\u00E3o / Obrigat\u00F3rio -->\n <div class=\"action-group group-validation\" aria-label=\"Valida\u00E7\u00E3o\">\n <button type=\"button\" mat-icon-button (click)=\"toggleRequired.emit()\" matTooltip=\"Alternar obrigat\u00F3rio\" [matTooltipShowDelay]=\"300\" aria-label=\"Alternar obrigat\u00F3rio\">\n <mat-icon>{{ requiredIcon }}</mat-icon>\n </button>\n </div>\n }\n\n <!-- A\u00E7\u00E3o destrutiva isolada -->\n <div class=\"action-group group-danger\" aria-label=\"A\u00E7\u00F5es perigosas\">\n <button type=\"button\" mat-icon-button color=\"warn\" (click)=\"delete.emit()\" matTooltip=\"Remover\" [matTooltipShowDelay]=\"300\" aria-label=\"Remover\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block;position:absolute;top:0;left:0;z-index:var(--praxis-layer-authoring-toolbar, 340);pointer-events:none;--canvas-primary: var( --md-sys-color-primary, var(--md-sys-color-primary) );--canvas-surface: var( --md-sys-color-surface, var(--md-sys-color-surface) );--canvas-on-surface: var( --md-sys-color-on-surface, var(--md-sys-color-on-surface) );--canvas-error: var( --md-sys-color-error, var(--md-sys-color-error) );--canvas-border-color: var(--pfx-surface-border, var(--md-sys-color-outline-variant));--primary: var(--md-sys-color-primary, var(--md-sys-color-primary, var(--canvas-primary)));--on-primary: var(--md-sys-color-on-primary);--surface: var(--md-sys-color-surface, var(--md-sys-color-surface, var(--canvas-surface)));--surface-variant: var( --md-sys-color-surface-variant, var(--md-sys-color-surface-variant) );--on-surface-variant: var( --md-sys-color-on-surface-variant, var(--md-sys-color-on-surface-variant) );--bc-h: 28px;--bc-aw: 18px;--bc-divider: var(--md-sys-color-outline-variant);--bc-bg: var(--surface-variant);--bc-fg: var(--on-surface-variant);--bc-active-bg: var(--primary);--bc-active-fg: var(--on-primary);--bc-label-inset: 24px;--bc-bg-tone-1: var(--bc-bg);--bc-bg-tone-2: var(--md-sys-color-surface-container-low)}.canvas-toolbar-container{display:grid;grid-template-rows:auto auto;align-items:stretch;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:var(--canvas-on-surface);border-radius:10px;box-shadow:var(--md-sys-elevation-level3);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;pointer-events:all;transform:translateY(-100%);margin-top:-6px;position:relative;overflow:visible;animation:toolbarIn .14s ease-out}.toolbar-surface{display:grid;grid-template-rows:auto auto;border-radius:inherit;overflow:hidden;background:var(--md-sys-color-surface-container-low)}.canvas-toolbar-container.closing{pointer-events:none;animation:toolbarOut .14s ease-in forwards}.toolbar-close{--p-close-size: 36px;--p-close-icon: 20px;position:absolute;top:-18px;right:-18px;z-index:10;width:var(--p-close-size);height:var(--p-close-size);border-radius:999px;display:inline-flex;align-items:center;justify-content:center;pointer-events:auto;background:var(--md-sys-color-surface-container);border:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level1);color:var(--md-sys-color-on-surface);--mdc-icon-button-state-layer-size: calc(var(--p-close-size) + 4px);opacity:0;pointer-events:none;transition:background-color .15s ease,box-shadow .15s ease,transform .06s ease,opacity .12s ease}.canvas-toolbar-container:hover .toolbar-close,.canvas-toolbar-container:focus-within .toolbar-close,.toolbar-close:focus-visible,.canvas-toolbar-container.closing .toolbar-close{opacity:1;pointer-events:auto}.toolbar-close:hover{background:var(--md-sys-color-surface-container-high);box-shadow:var(--md-sys-elevation-level2)}.toolbar-close:active{transform:scale(.98)}.toolbar-close:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}.toolbar-close .mat-icon{width:var(--p-close-icon);height:var(--p-close-icon);font-size:var(--p-close-icon);line-height:var(--p-close-icon)}@supports not ((mask-composite: exclude) or (-webkit-mask-composite: xor)){.canvas-toolbar-container{border:2px solid transparent;background:var(--md-sys-color-surface-container-low);border-color:var(--md-sys-color-primary)}.canvas-toolbar-container:after{display:none}}.canvas-toolbar-container:after{content:\"\";position:absolute;inset:0;border-radius:inherit;padding:2px;background:var(--p-primary-gradient, var(--md-sys-color-primary));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}@keyframes toolbarIn{0%{opacity:0;transform:translateY(calc(-100% - 4px)) scale(.98)}to{opacity:1;transform:translateY(-100%) scale(1)}}@keyframes toolbarOut{0%{opacity:1;transform:translateY(-100%) scale(1)}to{opacity:0;transform:translateY(calc(-100% - 4px)) scale(.98)}}.breadcrumb-row{display:flex;align-items:center;min-height:22px;padding-block:2px;padding-inline:8px calc(8px + var(--bc-aw, 18px));border-bottom:0;background:var(--surface)}.breadcrumb-bar{display:flex;align-items:center;white-space:nowrap}.breadcrumb-separator{display:none}.actions-row{display:flex;align-items:center;padding:4px;gap:6px;background:var(--md-sys-color-surface-container-low)}.action-group{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:6px;background:var(--md-sys-color-surface-container-lowest);border:0}.pfx-breadcrumb{display:flex;align-items:center;white-space:nowrap;font-size:.85rem;line-height:1}.pfx-bc{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:max-content;height:var(--bc-h, 28px);padding-inline:16px 14px;padding-inline-start:calc(var(--bc-label-inset, 24px) + var(--bc-aw, 18px));margin-inline-end:calc(-1 * var(--bc-aw, 18px));--bc-bg-local: var(--bc-bg, var(--surface-variant));background:var(--bc-bg-local);color:var(--bc-fg, var(--on-surface-variant));border:0;border-radius:6px 0 0 6px;box-shadow:none!important;outline:0;background-clip:padding-box;cursor:default}.pfx-bc:after{content:\"\";position:absolute;top:0;bottom:0;right:calc(-1 * var(--bc-aw, 18px));border-top:calc(var(--bc-h, 28px) / 2) solid transparent;border-bottom:calc(var(--bc-h, 28px) / 2) solid transparent;border-left:var(--bc-aw, 18px) solid var(--bc-bg-local);transform:translate(-1px);pointer-events:none}.pfx-bc:before{display:none}.pfx-bc.is-link{cursor:pointer}.pfx-bc.is-link:hover{background:var(--surface)}.pfx-bc.is-link:hover:after{border-left-color:var(--surface)}.pfx-bc.is-active{background:var(--bc-active-bg, var(--primary));color:var(--bc-active-fg, var(--on-primary));cursor:default;font-weight:600;margin-inline-end:0;border-radius:6px 0 0 6px}.pfx-bc.is-active:after{border-left-color:var(--bc-active-bg, var(--primary))}.pfx-bc:focus-visible{box-shadow:0 0 0 2px var(--md-sys-color-primary)}.pfx-bc:first-child{border-top-left-radius:12px;border-bottom-left-radius:12px;padding-inline-start:16px}.pfx-bc:not(.is-active):nth-child(odd){--bc-bg-local: var(--bc-bg-tone-1)}.pfx-bc:not(.is-active):nth-child(2n){--bc-bg-local: var(--bc-bg-tone-2)}[dir=rtl] .pfx-bc{margin-inline-end:0;margin-inline-start:calc(-1 * var(--bc-aw, 18px))}[dir=rtl] .pfx-bc.is-active{margin-inline-start:0}[dir=rtl] .pfx-bc:after{right:auto;left:calc(-1 * var(--bc-aw, 18px));border-left:0;border-right:var(--bc-aw, 18px) solid var(--bc-bg-local);transform:translate(1px)}[dir=rtl] .pfx-bc.is-active:after{border-right-color:var(--bc-active-bg, var(--primary))}[dir=rtl] .pfx-bc:before{right:auto;left:calc(-1px - var(--bc-aw, 18px))}.action-group+.action-group{margin-left:4px}.group-danger{margin-left:8px;background:var(--md-sys-color-error-container);border-color:var(--md-sys-color-error)}.actions-row button{width:32px;height:32px;line-height:32px;display:inline-flex;align-items:center;justify-content:center;color:var(--canvas-on-surface)}.actions-row mat-icon{font-size:18px;width:18px;height:18px;line-height:1}\n"] }]
|
|
321
322
|
}], propDecorators: { selectedElement: [{
|
|
322
323
|
type: Input
|
|
323
324
|
}], editMetadata: [{
|
|
@@ -4978,6 +4979,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
4978
4979
|
const PRAXIS_DYNAMIC_FORM_FALLBACK_LOGGER = new LoggerService(createCorporateLoggerConfig('dev'), [new ConsoleLoggerSink()]);
|
|
4979
4980
|
class PraxisDynamicForm {
|
|
4980
4981
|
crud;
|
|
4982
|
+
http;
|
|
4981
4983
|
fb;
|
|
4982
4984
|
cdr;
|
|
4983
4985
|
layoutService;
|
|
@@ -4997,6 +4999,8 @@ class PraxisDynamicForm {
|
|
|
4997
4999
|
global;
|
|
4998
5000
|
componentKeys;
|
|
4999
5001
|
loadingOrchestrator;
|
|
5002
|
+
ngZone;
|
|
5003
|
+
apiUrlConfig;
|
|
5000
5004
|
loadingRenderer;
|
|
5001
5005
|
router;
|
|
5002
5006
|
route;
|
|
@@ -5022,6 +5026,18 @@ class PraxisDynamicForm {
|
|
|
5022
5026
|
* 'filter' usa o schema do DTO de filtro (via /schemas/filtered no POST /filter request)
|
|
5023
5027
|
*/
|
|
5024
5028
|
schemaSource = 'resource';
|
|
5029
|
+
/** Canonical schema URL published by the backend surface catalog. */
|
|
5030
|
+
schemaUrl;
|
|
5031
|
+
/** Canonical submit URL published by the backend surface catalog. */
|
|
5032
|
+
submitUrl;
|
|
5033
|
+
/** Canonical submit method published by the backend surface catalog. */
|
|
5034
|
+
submitMethod;
|
|
5035
|
+
/** Canonical response schema URL exposed for runtime diagnostics/follow-up. */
|
|
5036
|
+
responseSchemaUrl;
|
|
5037
|
+
/** API endpoint entry used to resolve relative canonical URLs in detached hosts. */
|
|
5038
|
+
apiEndpointKey;
|
|
5039
|
+
/** Resolved API entry carried by detached hosts when route-scoped API_URL is not inherited. */
|
|
5040
|
+
apiUrlEntry;
|
|
5025
5041
|
/**
|
|
5026
5042
|
* CUSTOMIZAÇÃO DE LAYOUT - NÃO confundir com edição de dados do formulário
|
|
5027
5043
|
*
|
|
@@ -5137,6 +5153,9 @@ class PraxisDynamicForm {
|
|
|
5137
5153
|
lastSchemaMeta;
|
|
5138
5154
|
schemaRootHooks;
|
|
5139
5155
|
destroy$ = new Subject();
|
|
5156
|
+
formValueChangesSubscription = null;
|
|
5157
|
+
formBuildCycleId = 0;
|
|
5158
|
+
suppressedValueChangeBuildId = 0;
|
|
5140
5159
|
sectionHeaderBlobUrlCache = new WeakMap();
|
|
5141
5160
|
sectionHeaderObjectUrls = new Set();
|
|
5142
5161
|
lastCorrelationId;
|
|
@@ -5428,8 +5447,9 @@ class PraxisDynamicForm {
|
|
|
5428
5447
|
// Avoids duplicate standalone bootstrap when the form was already mounted
|
|
5429
5448
|
// programmatically before the first ngOnInit/detectChanges cycle.
|
|
5430
5449
|
hasBuiltFormFromConfig = false;
|
|
5431
|
-
constructor(crud, fb, cdr, layoutService, contextService, rulesService, settingsPanel, dialog, asyncConfigStorage, connectionStorage, dynamicForm, snackBar, canvasState, dynamicLayout, errorMessages, schemaNormalizer, componentMetaRegistry, global, componentKeys, loadingOrchestrator, loadingRenderer, router, route, hooksRegistry, hookPresets, logger) {
|
|
5450
|
+
constructor(crud, http, fb, cdr, layoutService, contextService, rulesService, settingsPanel, dialog, asyncConfigStorage, connectionStorage, dynamicForm, snackBar, canvasState, dynamicLayout, errorMessages, schemaNormalizer, componentMetaRegistry, global, componentKeys, loadingOrchestrator, ngZone, apiUrlConfig, loadingRenderer, router, route, hooksRegistry, hookPresets, logger) {
|
|
5432
5451
|
this.crud = crud;
|
|
5452
|
+
this.http = http;
|
|
5433
5453
|
this.fb = fb;
|
|
5434
5454
|
this.cdr = cdr;
|
|
5435
5455
|
this.layoutService = layoutService;
|
|
@@ -5449,6 +5469,8 @@ class PraxisDynamicForm {
|
|
|
5449
5469
|
this.global = global;
|
|
5450
5470
|
this.componentKeys = componentKeys;
|
|
5451
5471
|
this.loadingOrchestrator = loadingOrchestrator;
|
|
5472
|
+
this.ngZone = ngZone;
|
|
5473
|
+
this.apiUrlConfig = apiUrlConfig;
|
|
5452
5474
|
this.loadingRenderer = loadingRenderer;
|
|
5453
5475
|
this.router = router;
|
|
5454
5476
|
this.route = route;
|
|
@@ -5505,7 +5527,7 @@ class PraxisDynamicForm {
|
|
|
5505
5527
|
if (!decls || decls.length === 0)
|
|
5506
5528
|
return undefined;
|
|
5507
5529
|
const op = stage === 'beforeSubmit' || stage === 'afterSubmit' || stage === 'beforeValidate' || stage === 'afterValidate'
|
|
5508
|
-
?
|
|
5530
|
+
? this.resolveSubmitOperation()
|
|
5509
5531
|
: undefined;
|
|
5510
5532
|
return await this.hooksRegistry.run(stage, {
|
|
5511
5533
|
formGroup: this.form,
|
|
@@ -5520,6 +5542,120 @@ class PraxisDynamicForm {
|
|
|
5520
5542
|
return undefined;
|
|
5521
5543
|
}
|
|
5522
5544
|
}
|
|
5545
|
+
resolveSubmitOperation() {
|
|
5546
|
+
const method = this.normalizeSubmitMethod(this.submitMethod);
|
|
5547
|
+
if (method === 'patch') {
|
|
5548
|
+
return 'patch';
|
|
5549
|
+
}
|
|
5550
|
+
if (method === 'put') {
|
|
5551
|
+
return 'update';
|
|
5552
|
+
}
|
|
5553
|
+
if (method === 'post') {
|
|
5554
|
+
return 'create';
|
|
5555
|
+
}
|
|
5556
|
+
return this.resourceId != null ? 'update' : 'create';
|
|
5557
|
+
}
|
|
5558
|
+
buildSubmitRequest(formData, operation) {
|
|
5559
|
+
const method = this.normalizeSubmitMethod(this.submitMethod);
|
|
5560
|
+
const configuredSubmitUrl = String(this.submitUrl || '').trim();
|
|
5561
|
+
if (!method && !configuredSubmitUrl) {
|
|
5562
|
+
return operation === 'update'
|
|
5563
|
+
? this.crud.update(this.resourceId, formData)
|
|
5564
|
+
: this.crud.create(formData);
|
|
5565
|
+
}
|
|
5566
|
+
if (!method || !configuredSubmitUrl) {
|
|
5567
|
+
return throwError(() => new Error('PraxisDynamicForm requires submitMethod and submitUrl together for canonical submit execution.'));
|
|
5568
|
+
}
|
|
5569
|
+
const resolvedUrl = this.resolveSubmitHref(configuredSubmitUrl);
|
|
5570
|
+
const headers = composeHeadersWithVersion(this.resolveApiEntry());
|
|
5571
|
+
if (method === 'patch') {
|
|
5572
|
+
return this.http
|
|
5573
|
+
.patch(resolvedUrl, formData, { headers })
|
|
5574
|
+
.pipe(map((response) => this.unwrapRestApiResponse(response)));
|
|
5575
|
+
}
|
|
5576
|
+
if (method === 'put') {
|
|
5577
|
+
return this.http
|
|
5578
|
+
.put(resolvedUrl, formData, { headers })
|
|
5579
|
+
.pipe(map((response) => this.unwrapRestApiResponse(response)));
|
|
5580
|
+
}
|
|
5581
|
+
return this.http
|
|
5582
|
+
.post(resolvedUrl, formData, { headers })
|
|
5583
|
+
.pipe(map((response) => this.unwrapRestApiResponse(response)));
|
|
5584
|
+
}
|
|
5585
|
+
normalizeSubmitMethod(value) {
|
|
5586
|
+
const normalized = String(value || '')
|
|
5587
|
+
.trim()
|
|
5588
|
+
.toLowerCase();
|
|
5589
|
+
if (normalized === 'post' || normalized === 'put' || normalized === 'patch') {
|
|
5590
|
+
return normalized;
|
|
5591
|
+
}
|
|
5592
|
+
return null;
|
|
5593
|
+
}
|
|
5594
|
+
resolveSubmitHref(submitUrl) {
|
|
5595
|
+
let resolvedPath = String(submitUrl || '').trim();
|
|
5596
|
+
const entityId = this.resourceId ?? this.pendingEntityId ?? null;
|
|
5597
|
+
if ((resolvedPath.includes('{id}') || resolvedPath.includes(':id')) && entityId == null) {
|
|
5598
|
+
throw new Error('PraxisDynamicForm cannot resolve submitUrl placeholders without a resourceId.');
|
|
5599
|
+
}
|
|
5600
|
+
if (entityId != null) {
|
|
5601
|
+
const encodedId = encodeURIComponent(String(entityId));
|
|
5602
|
+
resolvedPath = resolvedPath.replace(/\{id\}/g, encodedId).replace(/:id\b/g, encodedId);
|
|
5603
|
+
}
|
|
5604
|
+
return this.resolveApiHref(resolvedPath);
|
|
5605
|
+
}
|
|
5606
|
+
resolveApiHref(href) {
|
|
5607
|
+
const normalizedHref = String(href || '').trim();
|
|
5608
|
+
if (!normalizedHref) {
|
|
5609
|
+
return normalizedHref;
|
|
5610
|
+
}
|
|
5611
|
+
if (/^https?:\/\//i.test(normalizedHref)) {
|
|
5612
|
+
return normalizedHref;
|
|
5613
|
+
}
|
|
5614
|
+
const origin = this.resolveApiOrigin();
|
|
5615
|
+
return origin ? new URL(normalizedHref, `${origin}/`).toString() : normalizedHref;
|
|
5616
|
+
}
|
|
5617
|
+
resolveApiOrigin() {
|
|
5618
|
+
const baseUrl = buildApiUrl(this.resolveApiEntry());
|
|
5619
|
+
try {
|
|
5620
|
+
return new URL(baseUrl).origin.replace(/\/+$/, '');
|
|
5621
|
+
}
|
|
5622
|
+
catch {
|
|
5623
|
+
try {
|
|
5624
|
+
const runtimeOrigin = globalThis?.location?.origin;
|
|
5625
|
+
return typeof runtimeOrigin === 'string' ? runtimeOrigin.replace(/\/+$/, '') : '';
|
|
5626
|
+
}
|
|
5627
|
+
catch {
|
|
5628
|
+
return '';
|
|
5629
|
+
}
|
|
5630
|
+
}
|
|
5631
|
+
}
|
|
5632
|
+
resolveApiEntry() {
|
|
5633
|
+
if (this.apiUrlEntry) {
|
|
5634
|
+
return this.apiUrlEntry;
|
|
5635
|
+
}
|
|
5636
|
+
const requestedKey = String(this.apiEndpointKey || '').trim();
|
|
5637
|
+
if (requestedKey) {
|
|
5638
|
+
return (this.apiUrlConfig?.[requestedKey] ||
|
|
5639
|
+
this.apiUrlConfig?.default ||
|
|
5640
|
+
{});
|
|
5641
|
+
}
|
|
5642
|
+
return this.apiUrlConfig?.default || {};
|
|
5643
|
+
}
|
|
5644
|
+
configureCrudRuntime() {
|
|
5645
|
+
if (!this.resourcePath) {
|
|
5646
|
+
return;
|
|
5647
|
+
}
|
|
5648
|
+
this.crud.configure(this.resourcePath, {
|
|
5649
|
+
endpointKey: this.apiEndpointKey ?? undefined,
|
|
5650
|
+
apiUrlEntry: this.apiUrlEntry ?? null,
|
|
5651
|
+
});
|
|
5652
|
+
}
|
|
5653
|
+
unwrapRestApiResponse(response) {
|
|
5654
|
+
if (response && typeof response === 'object' && 'data' in response) {
|
|
5655
|
+
return response.data;
|
|
5656
|
+
}
|
|
5657
|
+
return response;
|
|
5658
|
+
}
|
|
5523
5659
|
resolveStageDeclarations(stage) {
|
|
5524
5660
|
const direct = this.hooks?.[stage] ?? this.config?.hooks?.[stage];
|
|
5525
5661
|
const preset = this.resolvePresetDeclarations(stage);
|
|
@@ -5684,7 +5820,7 @@ class PraxisDynamicForm {
|
|
|
5684
5820
|
// But since we are in ngOnInit, ngOnChanges might have already run.
|
|
5685
5821
|
// We might need to manually trigger configure if resourcePath changed here.
|
|
5686
5822
|
if (this.resourcePath) {
|
|
5687
|
-
this.
|
|
5823
|
+
this.configureCrudRuntime();
|
|
5688
5824
|
this.tryInitializeForm();
|
|
5689
5825
|
}
|
|
5690
5826
|
}
|
|
@@ -5790,7 +5926,7 @@ class PraxisDynamicForm {
|
|
|
5790
5926
|
if (changes['resourcePath'] && this.resourcePath) {
|
|
5791
5927
|
this.debugLog('[PDF] ngOnChanges resourcePath=', this.resourcePath, ' -> configure()');
|
|
5792
5928
|
this.saveConnection('input');
|
|
5793
|
-
this.
|
|
5929
|
+
this.configureCrudRuntime();
|
|
5794
5930
|
// this.loadSchema(); // se houver
|
|
5795
5931
|
if (!this.isInitialized && !this.isLoading && this.formId) {
|
|
5796
5932
|
this.tryInitializeForm();
|
|
@@ -5812,6 +5948,14 @@ class PraxisDynamicForm {
|
|
|
5812
5948
|
this.loadEntity();
|
|
5813
5949
|
}
|
|
5814
5950
|
}
|
|
5951
|
+
if (changes['schemaUrl'] && !changes['schemaUrl'].firstChange) {
|
|
5952
|
+
this.debugLog('[PDF] ngOnChanges schemaUrl=', this.schemaUrl);
|
|
5953
|
+
this.schemaCache = null;
|
|
5954
|
+
this.lastSchemaMeta = undefined;
|
|
5955
|
+
if (this.formId && this.resourcePath && !this.isLoading) {
|
|
5956
|
+
this.retryInitialization();
|
|
5957
|
+
}
|
|
5958
|
+
}
|
|
5815
5959
|
if (changes['config'] || changes['presentationModeGlobal']) {
|
|
5816
5960
|
let shouldRebuildFromExternalConfig = false;
|
|
5817
5961
|
let externalConfigChanged = false;
|
|
@@ -6168,6 +6312,7 @@ class PraxisDynamicForm {
|
|
|
6168
6312
|
const previousState = options.preserveRuntimeState
|
|
6169
6313
|
? this.captureFormRuntimeState()
|
|
6170
6314
|
: null;
|
|
6315
|
+
const buildCycleId = ++this.formBuildCycleId;
|
|
6171
6316
|
this.fieldVisibility = {}; // Reset visibility state
|
|
6172
6317
|
const mountCtx = this.buildLoadingContext('mount', 'Montando interface…', false);
|
|
6173
6318
|
this.beginLoading(mountCtx);
|
|
@@ -6191,9 +6336,16 @@ class PraxisDynamicForm {
|
|
|
6191
6336
|
// Avaliação inicial
|
|
6192
6337
|
this.evaluateAndApplyRules();
|
|
6193
6338
|
}
|
|
6194
|
-
this.
|
|
6195
|
-
|
|
6339
|
+
this.resetFormValueChangesSubscription(buildCycleId);
|
|
6340
|
+
this.formValueChangesSubscription = this.form.valueChanges
|
|
6341
|
+
.pipe(takeUntil(this.destroy$), debounceTime(50))
|
|
6196
6342
|
.subscribe((values) => {
|
|
6343
|
+
if (this.suppressedValueChangeBuildId === buildCycleId) {
|
|
6344
|
+
if (!this.hasInteractiveFormState()) {
|
|
6345
|
+
return;
|
|
6346
|
+
}
|
|
6347
|
+
this.suppressedValueChangeBuildId = 0;
|
|
6348
|
+
}
|
|
6197
6349
|
this.evaluateAndApplyRules();
|
|
6198
6350
|
if (this.isReactiveValidationEnabled()) {
|
|
6199
6351
|
try {
|
|
@@ -6219,6 +6371,7 @@ class PraxisDynamicForm {
|
|
|
6219
6371
|
this.debugLog('[PDF] buildForm:done', {
|
|
6220
6372
|
fields: this.config.fieldMetadata?.length,
|
|
6221
6373
|
});
|
|
6374
|
+
this.scheduleValueChangeBootstrapRelease(buildCycleId);
|
|
6222
6375
|
this.hasBuiltFormFromConfig = true;
|
|
6223
6376
|
}
|
|
6224
6377
|
finally {
|
|
@@ -6229,6 +6382,26 @@ class PraxisDynamicForm {
|
|
|
6229
6382
|
// Setup reactive validation pipeline if enabled
|
|
6230
6383
|
this.setupReactiveValidation();
|
|
6231
6384
|
}
|
|
6385
|
+
resetFormValueChangesSubscription(buildCycleId) {
|
|
6386
|
+
this.formValueChangesSubscription?.unsubscribe();
|
|
6387
|
+
this.formValueChangesSubscription = null;
|
|
6388
|
+
this.suppressedValueChangeBuildId = buildCycleId;
|
|
6389
|
+
}
|
|
6390
|
+
scheduleValueChangeBootstrapRelease(buildCycleId) {
|
|
6391
|
+
queueMicrotask(() => {
|
|
6392
|
+
this.ngZone.onStable.pipe(take(1), takeUntil(this.destroy$)).subscribe(() => {
|
|
6393
|
+
if (this.suppressedValueChangeBuildId === buildCycleId) {
|
|
6394
|
+
this.suppressedValueChangeBuildId = 0;
|
|
6395
|
+
}
|
|
6396
|
+
});
|
|
6397
|
+
});
|
|
6398
|
+
}
|
|
6399
|
+
hasInteractiveFormState() {
|
|
6400
|
+
if (this.form.dirty || this.form.touched) {
|
|
6401
|
+
return true;
|
|
6402
|
+
}
|
|
6403
|
+
return Object.values(this.form.controls || {}).some((control) => control.dirty || control.touched);
|
|
6404
|
+
}
|
|
6232
6405
|
captureFormRuntimeState() {
|
|
6233
6406
|
if (!this.form || !Object.keys(this.form.controls || {}).length) {
|
|
6234
6407
|
return null;
|
|
@@ -7363,8 +7536,7 @@ class PraxisDynamicForm {
|
|
|
7363
7536
|
catch { }
|
|
7364
7537
|
// Snapshot after hooks potentially changed control values
|
|
7365
7538
|
const formData = this.form.getRawValue();
|
|
7366
|
-
|
|
7367
|
-
const operation = this.resourceId != null ? 'update' : 'create';
|
|
7539
|
+
const operation = this.resolveSubmitOperation();
|
|
7368
7540
|
this.formSubmit.emit({
|
|
7369
7541
|
stage: 'before',
|
|
7370
7542
|
formData,
|
|
@@ -7373,9 +7545,7 @@ class PraxisDynamicForm {
|
|
|
7373
7545
|
entityId: this.resourceId ?? undefined,
|
|
7374
7546
|
});
|
|
7375
7547
|
// Extra: pass snapshot to after hooks via extras when relevant
|
|
7376
|
-
const req$ = operation
|
|
7377
|
-
? this.crud.update(this.resourceId, formData)
|
|
7378
|
-
: this.crud.create(formData);
|
|
7548
|
+
const req$ = this.buildSubmitRequest(formData, operation);
|
|
7379
7549
|
// Mensagem de loading configurável durante o submit
|
|
7380
7550
|
try {
|
|
7381
7551
|
const loadingMsg = this.config.messages?.loading?.submit;
|
|
@@ -7560,6 +7730,7 @@ class PraxisDynamicForm {
|
|
|
7560
7730
|
formId: this.formId,
|
|
7561
7731
|
componentKeyId: this.componentKeyId(),
|
|
7562
7732
|
presentationMode: this.presentationModeGlobal === true,
|
|
7733
|
+
runtimeContext: this.buildDynamicFormEditorRuntimeContext(),
|
|
7563
7734
|
},
|
|
7564
7735
|
},
|
|
7565
7736
|
});
|
|
@@ -10565,6 +10736,8 @@ class PraxisDynamicForm {
|
|
|
10565
10736
|
this.cdr.detectChanges();
|
|
10566
10737
|
}
|
|
10567
10738
|
ngOnDestroy() {
|
|
10739
|
+
this.formValueChangesSubscription?.unsubscribe();
|
|
10740
|
+
this.formValueChangesSubscription = null;
|
|
10568
10741
|
this.destroy$.next();
|
|
10569
10742
|
this.destroy$.complete();
|
|
10570
10743
|
this.schemaCache = null;
|
|
@@ -10630,8 +10803,54 @@ class PraxisDynamicForm {
|
|
|
10630
10803
|
this.schemaState.meta?.serverHash ||
|
|
10631
10804
|
this.config?.metadata?.serverHash,
|
|
10632
10805
|
},
|
|
10806
|
+
resolvedContract: this.buildResolvedRuntimeContractForEditor(),
|
|
10633
10807
|
};
|
|
10634
10808
|
}
|
|
10809
|
+
buildResolvedRuntimeContractForEditor() {
|
|
10810
|
+
const explicitSchemaUrl = String(this.schemaUrl || '').trim();
|
|
10811
|
+
const fallbackSchemaUrl = this.readLegacySchemaUrlForEditor();
|
|
10812
|
+
const resolvedSchemaUrl = explicitSchemaUrl
|
|
10813
|
+
? this.resolveApiHref(explicitSchemaUrl)
|
|
10814
|
+
: fallbackSchemaUrl
|
|
10815
|
+
? this.resolveApiHref(fallbackSchemaUrl)
|
|
10816
|
+
: undefined;
|
|
10817
|
+
const schemaSource = explicitSchemaUrl
|
|
10818
|
+
? 'runtime-input'
|
|
10819
|
+
: fallbackSchemaUrl
|
|
10820
|
+
? 'legacy-crud'
|
|
10821
|
+
: undefined;
|
|
10822
|
+
const submitMethod = this.normalizeSubmitMethod(this.submitMethod) || undefined;
|
|
10823
|
+
const configuredSubmitUrl = String(this.submitUrl || '').trim();
|
|
10824
|
+
let resolvedSubmitUrl;
|
|
10825
|
+
if (configuredSubmitUrl) {
|
|
10826
|
+
try {
|
|
10827
|
+
resolvedSubmitUrl = this.resolveSubmitHref(configuredSubmitUrl);
|
|
10828
|
+
}
|
|
10829
|
+
catch {
|
|
10830
|
+
resolvedSubmitUrl = configuredSubmitUrl;
|
|
10831
|
+
}
|
|
10832
|
+
}
|
|
10833
|
+
const submitSource = submitMethod || resolvedSubmitUrl ? 'runtime-input' : undefined;
|
|
10834
|
+
if (!resolvedSchemaUrl && !resolvedSubmitUrl && !submitMethod) {
|
|
10835
|
+
return undefined;
|
|
10836
|
+
}
|
|
10837
|
+
return {
|
|
10838
|
+
schemaUrl: resolvedSchemaUrl,
|
|
10839
|
+
schemaSource,
|
|
10840
|
+
submitUrl: resolvedSubmitUrl,
|
|
10841
|
+
submitMethod,
|
|
10842
|
+
submitSource,
|
|
10843
|
+
};
|
|
10844
|
+
}
|
|
10845
|
+
readLegacySchemaUrlForEditor() {
|
|
10846
|
+
const schemaUrlSource = typeof this.crud.schemaUrl === 'function'
|
|
10847
|
+
? this.crud.schemaUrl()
|
|
10848
|
+
: typeof this.crud.schemaUrl === 'string'
|
|
10849
|
+
? this.crud.schemaUrl
|
|
10850
|
+
: '';
|
|
10851
|
+
const normalized = String(schemaUrlSource || '').trim();
|
|
10852
|
+
return normalized || null;
|
|
10853
|
+
}
|
|
10635
10854
|
captureCurrentContextSnapshot() {
|
|
10636
10855
|
return {
|
|
10637
10856
|
backConfig: this.backConfig ? structuredClone(this.backConfig) : undefined,
|
|
@@ -10875,7 +11094,50 @@ class PraxisDynamicForm {
|
|
|
10875
11094
|
: 'Nenhum detalhe disponÃvel';
|
|
10876
11095
|
alert(`Detalhes técnicos:\n\n${details}\n\nPor favor, compartilhe estas informações com o suporte técnico.`);
|
|
10877
11096
|
}
|
|
11097
|
+
tryBuildExplicitSchemaContext() {
|
|
11098
|
+
const configuredSchemaUrl = String(this.schemaUrl || '').trim();
|
|
11099
|
+
if (!configuredSchemaUrl) {
|
|
11100
|
+
return null;
|
|
11101
|
+
}
|
|
11102
|
+
const resolvedSchemaUrl = this.resolveApiHref(configuredSchemaUrl);
|
|
11103
|
+
let url;
|
|
11104
|
+
try {
|
|
11105
|
+
url = new URL(resolvedSchemaUrl);
|
|
11106
|
+
}
|
|
11107
|
+
catch {
|
|
11108
|
+
const runtimeOrigin = this.resolveApiOrigin();
|
|
11109
|
+
url = new URL(configuredSchemaUrl, runtimeOrigin || 'http://localhost');
|
|
11110
|
+
}
|
|
11111
|
+
const path = url.searchParams.get('path') || '';
|
|
11112
|
+
if (!path) {
|
|
11113
|
+
throw new Error('PraxisDynamicForm schemaUrl must contain a "path" query parameter.');
|
|
11114
|
+
}
|
|
11115
|
+
const operation = (url.searchParams.get('operation') || 'get').toLowerCase();
|
|
11116
|
+
const schemaType = (url.searchParams.get('schemaType') || 'response').toLowerCase();
|
|
11117
|
+
const includeInternalSchemas = (url.searchParams.get('includeInternalSchemas') || 'false').toLowerCase() === 'true';
|
|
11118
|
+
const tenant = url.searchParams.get('tenant') || this.global?.getTenant?.() || undefined;
|
|
11119
|
+
const locale = url.searchParams.get('locale') ||
|
|
11120
|
+
((typeof navigator !== 'undefined' && navigator.language) ? navigator.language : undefined);
|
|
11121
|
+
const origin = /^https?:\/\//i.test(resolvedSchemaUrl) ? url.origin : this.resolveApiOrigin();
|
|
11122
|
+
const baseUrl = origin
|
|
11123
|
+
? new URL(url.pathname, `${origin}/`).toString()
|
|
11124
|
+
: url.pathname;
|
|
11125
|
+
return {
|
|
11126
|
+
path,
|
|
11127
|
+
operation,
|
|
11128
|
+
schemaType,
|
|
11129
|
+
includeInternalSchemas,
|
|
11130
|
+
tenant,
|
|
11131
|
+
locale,
|
|
11132
|
+
baseUrl,
|
|
11133
|
+
apiOrigin: origin || '',
|
|
11134
|
+
};
|
|
11135
|
+
}
|
|
10878
11136
|
buildSchemaContext() {
|
|
11137
|
+
const explicitContext = this.tryBuildExplicitSchemaContext();
|
|
11138
|
+
if (explicitContext) {
|
|
11139
|
+
return explicitContext;
|
|
11140
|
+
}
|
|
10879
11141
|
// HeurÃstica: se schemaSource não for explicitamente 'resource', detectar por formId contendo 'filter'
|
|
10880
11142
|
const inferredFilter = /(^|[-_])filter($|[-_])/i.test(this.formId || '');
|
|
10881
11143
|
const useFilterSchema = this.schemaSource === 'filter' || inferredFilter;
|
|
@@ -11136,8 +11398,8 @@ class PraxisDynamicForm {
|
|
|
11136
11398
|
this.config = normalizeFormConfig$1(this.config);
|
|
11137
11399
|
}
|
|
11138
11400
|
}
|
|
11139
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: PraxisDynamicForm, deps: [{ token: i1$2.GenericCrudService }, { token: i1$3.FormBuilder }, { token: i0.ChangeDetectorRef }, { token: FormLayoutService }, { token: FormContextService }, { token: FormRulesService }, { token:
|
|
11140
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: PraxisDynamicForm, isStandalone: true, selector: "praxis-dynamic-form", inputs: { resourcePath: "resourcePath", resourceId: "resourceId", editorialContext: "editorialContext", mode: "mode", config: "config", schemaSource: "schemaSource", enableCustomization: "enableCustomization", formId: "formId", componentInstanceId: "componentInstanceId", layout: "layout", backConfig: "backConfig", hooks: "hooks", removeEmptyContainersOnSave: "removeEmptyContainersOnSave", reactiveValidation: "reactiveValidation", reactiveValidationDebounceMs: "reactiveValidationDebounceMs", notifyIfOutdated: "notifyIfOutdated", snoozeMs: "snoozeMs", autoOpenSettingsOnOutdated: "autoOpenSettingsOnOutdated", readonlyModeGlobal: "readonlyModeGlobal", disabledModeGlobal: "disabledModeGlobal", presentationModeGlobal: "presentationModeGlobal", visibleGlobal: "visibleGlobal", customEndpoints: "customEndpoints" }, outputs: { formSubmit: "formSubmit", formCancel: "formCancel", formReset: "formReset", configChange: "configChange", formReady: "formReady", valueChange: "valueChange", syncCompleted: "syncCompleted", initializationError: "initializationError", loadingStateChange: "loadingStateChange", enableCustomizationChange: "enableCustomizationChange", customAction: "customAction", actionConfirmation: "actionConfirmation", schemaStatusChange: "schemaStatusChange", fieldRenderError: "fieldRenderError", widgetEvent: "widgetEvent" }, providers: [providePraxisI18nConfig(PRAXIS_DYNAMIC_FORM_I18N_CONFIG)], viewQueries: [{ propertyName: "formHost", first: true, predicate: ["formHost"], descendants: true }, { propertyName: "fieldLoaders", predicate: DynamicFieldLoaderDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isLoading) {\n<!-- Loading State -->\n<div class=\"form-loading\">\n <mat-progress-spinner diameter=\"40\"></mat-progress-spinner>\n <p>Carregando formul\u00E1rio...</p>\n</div>\n} @else if (initializationStatus === 'error') {\n<!-- Error State -->\n<div class=\"form-error\">\n <mat-icon color=\"warn\" [praxisIcon]=\"'error'\"></mat-icon>\n <h3>{{ getErrorTitle() }}</h3>\n <p>{{ currentErrorMessage }}</p>\n @if (isRecoverable) {\n <button mat-stroked-button (click)=\"retryInitialization()\">\n <mat-icon [praxisIcon]=\"'refresh'\"></mat-icon>\n Tentar Novamente\n </button>\n }\n <button mat-button (click)=\"showDetailedError()\" class=\"show-details\">\n Ver Detalhes T\u00E9cnicos\n </button>\n <!-- Permitir corre\u00E7\u00E3o do resourcePath diretamente do estado de erro -->\n <button mat-flat-button color=\"primary\" (click)=\"openQuickConnect()\" class=\"connect-action\">\n <mat-icon [praxisIcon]=\"'bolt'\"></mat-icon>\n Conectar a recurso\n </button>\n</div>\n} @else if (initializationStatus === 'success') {\n<!-- Inline banner for schema change (only when customization is enabled) -->\n@if (shouldShowOutdatedInline()) {\n<div class=\"pfx-form-info-banner\" role=\"status\" aria-live=\"polite\">\n <div class=\"text\">O schema do servidor mudou. Reconciliar agora?</div>\n <div class=\"actions\">\n <button mat-stroked-button color=\"primary\" (click)=\"openConfigEditor()\">\n <mat-icon [praxisIcon]=\"'sync'\"></mat-icon>\n Reconciliar\n </button>\n <button mat-button (click)=\"onSnoozeOutdated()\">Lembrar depois</button>\n <button mat-button (click)=\"onIgnoreOutdated()\">Ignorar</button>\n </div>\n</div>\n}\n\n<!-- Configuration Controls -->\n@if (shouldShowConfigControls && enableCustomization) {\n<div class=\"form-config-controls\">\n <praxis-ai-assistant [adapter]=\"aiAdapter\"></praxis-ai-assistant>\n <button type=\"button\" mat-icon-button (click)=\"openConfigEditor()\" [disabled]=\"isLoading\" class=\"config-button\"\n [matBadge]=\"schemaOutdated ? '!' : ''\" [matBadgeHidden]=\"!schemaOutdated\" matBadgeColor=\"warn\" matBadgeSize=\"small\"\n matBadgePosition=\"above after\"\n [matTooltip]=\"schemaOutdated ? 'Schema do servidor mudou \u2014 Reconciliar' : 'Configurar formul\u00E1rio'\">\n <mat-icon [praxisIcon]=\"'settings'\"></mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"disconnect()\" matTooltip=\"Desconectar da fonte de dados\"\n [disabled]=\"isLoading\">\n <mat-icon [praxisIcon]=\"'link_off'\"></mat-icon>\n </button>\n</div>\n}\n\n<!-- Form Content -->\n@if (!resourcePath && (!config.sections || config.sections.length === 0)) {\n<praxis-empty-state-card icon=\"link\" [title]=\"'Conecte o formul\u00E1rio \u00E0 fonte de dados'\"\n [description]=\"'Informe a rota do recurso da API para gerar automaticamente os campos do formul\u00E1rio.'\"\n [primaryAction]=\"{ label: 'Conectar \u00E0 fonte de dados', icon: 'bolt', action: openQuickConnect.bind(this) }\"></praxis-empty-state-card>\n}\n<form #formHost (ngSubmit)=\"onSubmit()\" [attr.aria-busy]=\"submitting ? 'true' : null\"\n [attr.aria-label]=\"'Formul\u00E1rio ' + (config.metadata?.version || '')\" [class.canvas-mode-enabled]=\"enableCustomization\"\n [class.presentation-mode]=\"effectivePresentation\" [class.readonly-mode]=\"effectiveReadonly\"\n [class.editorial-visual-context]=\"hasEditorialVisualContext()\"\n [class.pfx-mounting]=\"isMounting\" [formGroup]=\"form\"\n [ngClass]=\"{\n 'pres-compact': presentationVars.compact,\n 'pres-label-left': presentationVars.labelPosition === 'left',\n 'pres-label-above': presentationVars.labelPosition === 'above'\n }\" [style.--pfx-pres-label-align]=\"presentationVars.labelAlign\"\n [style.--pfx-pres-label-size]=\"presentationVars.labelSize\"\n [style.--pfx-pres-label-width]=\"presentationVars.labelWidth\"\n [style.--pfx-pres-row-gap]=\"presentationVars.density === 'compact' ? '6px' : (presentationVars.density === 'cozy' ? '8px' : '10px')\"\n [style.--pfx-pres-row-padding]=\"presentationVars.density === 'compact' ? '2px 0' : (presentationVars.density === 'cozy' ? '6px 0' : '8px 0')\"\n [style.--pfx-pres-value-align]=\"presentationVars.valueAlign\"\n [style.--pfx-pres-value-size]=\"presentationVars.valueSize\"\n [style.--pdx-form-mount-duration]=\"getMountDurationVar()\"\n [style.--pdx-form-mount-offset]=\"getMountOffsetVar()\"\n [style.--pdx-form-mount-stagger]=\"getMountStaggerVar()\"\n class=\"praxis-dynamic-form\">\n <praxis-canvas-toolbar (editMetadata)=\"openSelectedElementEditor()\" (selectPath)=\"onSelectPath($event)\"\n (moveUp)=\"onToolbarMove('up')\" (moveDown)=\"onToolbarMove('down')\" (toggleReadonly)=\"onToolbarToggleReadonly()\"\n (toggleRequired)=\"onToolbarToggleRequired()\" (toggleHidden)=\"onToolbarToggleHidden()\"\n (toggleDisabled)=\"onToolbarToggleDisabled()\" (requestClose)=\"onToolbarRequestClose()\"\n *ngIf=\"enableCustomization && selectedElement\" [selectedElement]=\"selectedElement\"\n [style.transform]=\"toolbarTransform\"></praxis-canvas-toolbar>\n\n @if (formBlocksBefore.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before\" data-editorial-placement=\"before\">\n @for (block of formBlocksBefore; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('before', $event)\">\n </ng-container>\n }\n </section>\n }\n\n @if (actionPlacement === 'top' && !(effectivePresentation || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"top\" [actions]=\"config.actions\" [isSubmitting]=\"submitting\"\n [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\" [actionOverrides]=\"actionRuleProps\"\n [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n\n @for (section of config.sections; track (section.id ?? $index); let sectionIndex = $index;\n let last = $last) {\n <div class=\"section-drop-wrapper\" [attr.data-section-id]=\"section.id\">\n @if (isSectionVisible(section)) {\n <div #sectionEl class=\"form-section canvas-element\" data-canvas-type=\"section\" [attr.data-section-id]=\"section.id\"\n [attr.data-section-index]=\"sectionIndex\" (mouseenter)=\"onElementMouseEnter($event, 'section', section, sectionEl)\"\n (mouseleave)=\"onElementMouseLeave($event)\" (click)=\"onElementClick($event, 'section', section, sectionEl)\"\n [class.selected]=\"selectedElement?.domElement === sectionEl\"\n [class.hovered]=\"hoveredElement?.domElement === sectionEl && selectedElement?.domElement !== sectionEl\"\n [attr.data-section-appearance]=\"getSectionAppearance(section) || null\"\n [style.marginBottom.px]=\"!last ? getSectionGapBottom(section) : null\" [ngClass]=\"getSectionClasses(section)\"\n [ngStyle]=\"getSectionStyles(section)\">\n <div\n class=\"section-heading\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\"\n [class.step-appearance]=\"getSectionAppearance(section) === 'step'\"\n >\n <div class=\"section-heading-text\" [matTooltip]=\"getSectionHeaderTooltip(section) || null\"\n [matTooltipDisabled]=\"!getSectionHeaderTooltip(section)\">\n @if (getSectionStepLabel(section)) {\n <div class=\"section-step-label\" [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n {{ getSectionStepLabel(section) }}\n </div>\n }\n @if (getSectionTitle(section)) {\n <h3 class=\"section-title\" [class.title-large]=\"getSectionTitleStyle(section) === 'titleLarge'\"\n [class.title-medium]=\"getSectionTitleStyle(section) === 'titleMedium'\"\n [class.title-small]=\"getSectionTitleStyle(section) === 'titleSmall'\"\n [class.headline-small]=\"getSectionTitleStyle(section) === 'headlineSmall'\"\n [style.marginBottom.px]=\"getSectionTitleGapBottom(section) ?? 20\" [style.color]=\"getSectionTitleColor(section) || null\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\"\n [attr.id]=\"sectionPanelId(section, sectionIndex) + '-title'\">\n @let sectionHeaderVisual = getSectionHeaderVisual(section);\n @let sectionHeaderAvatarSize = getSectionHeaderAvatarSize(section);\n @if (sectionHeaderVisual.kind === 'icon') {\n <mat-icon class=\"section-title-icon\" aria-hidden=\"true\" [praxisIcon]=\"sectionHeaderVisual.icon\"></mat-icon>\n }\n @if (sectionHeaderVisual.kind === 'image') {\n <img class=\"section-title-avatar section-title-avatar-image\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\"\n [src]=\"sectionHeaderVisual.src\" [alt]=\"sectionHeaderVisual.alt\" />\n }\n @if (sectionHeaderVisual.kind === 'initials') {\n <span class=\"section-title-avatar section-title-avatar-text\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\" aria-hidden=\"true\">\n {{ sectionHeaderVisual.text }}\n </span>\n @if (sectionHeaderVisual.ariaLabel) {\n <span class=\"section-title-avatar-sr-only\">{{ sectionHeaderVisual.ariaLabel }}</span>\n }\n }\n @if (sectionHeaderVisual.kind === 'placeholder') {\n <span class=\"section-title-avatar section-title-avatar-placeholder\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\" aria-hidden=\"true\">\n @if (sectionHeaderVisual.icon) {\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"sectionHeaderVisual.icon\"></mat-icon>\n }\n @if (sectionHeaderVisual.text) {\n <span>{{ sectionHeaderVisual.text }}</span>\n }\n </span>\n @if (sectionHeaderVisual.ariaLabel) {\n <span class=\"section-title-avatar-sr-only\">{{ sectionHeaderVisual.ariaLabel }}</span>\n }\n }\n {{ getSectionTitle(section) }}\n @if (enableCustomization) {\n <button type=\"button\" class=\"inline-edit-btn\" mat-icon-button (click)=\"openSectionEditor(section, 'title')\"\n aria-label=\"Editar t\u00EDtulo da se\u00E7\u00E3o\" matTooltip=\"Editar t\u00EDtulo\">\n <mat-icon>edit</mat-icon>\n </button>\n }\n </h3>\n }\n @if (getSectionDescription(section)) {\n <p class=\"section-description\" [class.body-large]=\"getSectionDescriptionStyle(section) === 'bodyLarge'\"\n [class.body-medium]=\"getSectionDescriptionStyle(section) === 'bodyMedium'\"\n [class.body-small]=\"getSectionDescriptionStyle(section) === 'bodySmall'\"\n [style.marginBottom.px]=\"getSectionDescriptionGapBottom(section) ?? 8\" [style.color]=\"getSectionDescriptionColor(section) || null\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n {{ getSectionDescription(section) }}\n @if (enableCustomization) {\n <button type=\"button\" class=\"inline-edit-btn\" mat-icon-button\n (click)=\"openSectionEditor(section, 'description')\" aria-label=\"Editar descri\u00E7\u00E3o da se\u00E7\u00E3o\"\n matTooltip=\"Editar descri\u00E7\u00E3o\">\n <mat-icon>edit</mat-icon>\n </button>\n }\n </p>\n }\n </div>\n @if (getSectionHeaderActions(section).length) {\n <div class=\"section-heading-actions\" [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n @for (action of getSectionHeaderActions(section); track action.id) {\n <button\n type=\"button\"\n class=\"section-heading-action-btn\"\n mat-icon-button\n [color]=\"getSectionHeaderActionColor(action)\"\n [disabled]=\"isSectionHeaderActionDisabled(action)\"\n [matTooltip]=\"getSectionHeaderActionTooltip(action)\"\n [attr.aria-label]=\"action.label\"\n [attr.aria-busy]=\"action.loading ? 'true' : null\"\n [ngClass]=\"getSectionHeaderActionNgClass(action)\"\n [ngStyle]=\"getSectionHeaderActionStyles(action)\"\n (click)=\"onSectionHeaderActionClick(section, action, $event)\"\n >\n @if (action.loading) {\n <mat-progress-spinner diameter=\"16\" mode=\"indeterminate\"></mat-progress-spinner>\n <span class=\"section-heading-action-sr-only\">{{ getSectionHeaderActionLoadingLabel(action) }}</span>\n } @else {\n <mat-icon [praxisIcon]=\"action.icon\"></mat-icon>\n }\n </button>\n }\n </div>\n }\n @if (isSectionCollapsible(section)) {\n <button type=\"button\" class=\"section-collapse-btn\" mat-icon-button\n (click)=\"toggleSectionCollapse($event, section)\" [attr.aria-expanded]=\"!isSectionCollapsed(section)\"\n [attr.aria-controls]=\"sectionPanelId(section, sectionIndex)\"\n [attr.aria-label]=\"isSectionCollapsed(section) ? 'Expandir se\u00E7\u00E3o' : 'Recolher se\u00E7\u00E3o'\">\n <mat-icon [praxisIcon]=\"isSectionCollapsed(section) ? 'expand_more' : 'expand_less'\"></mat-icon>\n </button>\n }\n </div>\n\n <div class=\"section-body\" [class.collapsed]=\"isSectionCollapsed(section)\"\n [attr.id]=\"sectionPanelId(section, sectionIndex)\"\n [attr.aria-labelledby]=\"getSectionTitle(section) ? sectionPanelId(section, sectionIndex) + '-title' : null\">\n @if (!isSectionCollapsed(section)) {\n @for (row of section.rows; track (row.id ?? $index); let rowIndex = $index) {\n @if (isRowVisible(row)) {\n <div class=\"row-drop-wrapper\" [attr.data-section-id]=\"section.id\">\n <div #rowEl class=\"form-row grid-12 canvas-element\" data-canvas-type=\"row\" [attr.data-row-index]=\"rowIndex\"\n [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\" [style.--pfx-grid-gap.px]=\"getRowGap(row)\"\n [style.--pfx-field-gap.px]=\"getRowRowGap(row)\"\n [style.--pfx-mount-index]=\"rowIndex\"\n [style.marginBottom.px]=\"rowIndex < section.rows.length - 1 ? (getRowRowGap(row) ?? null) : null\"\n [ngClass]=\"getRowClasses(row)\" [ngStyle]=\"getRowStyles(row)\"\n (mouseenter)=\"onElementMouseEnter($event, 'row', row, rowEl)\" (mouseleave)=\"onElementMouseLeave($event)\"\n (click)=\"onElementClick($event, 'row', row, rowEl)\" [class.selected]=\"selectedElement?.domElement === rowEl\"\n [class.hovered]=\"hoveredElement?.domElement === rowEl && selectedElement?.domElement !== rowEl\">\n @for (column of row.columns; track (column.id ?? $index); let colIndex = $index) {\n @if (isColumnVisible(column)) {\n <div class=\"column-drop-wrapper\" [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\">\n <div #colEl class=\"form-column canvas-element\" [ngClass]=\"getColumnClasses(column)\"\n [style.padding.px]=\"getColumnPadding(column)\" [style.--pfx-field-gap.px]=\"getRowRowGap(row)\"\n [ngStyle]=\"getColumnStyles(column)\" [attr.data-testid]=\"column.testId || null\"\n [attr.data-row-gap]=\"getRowRowGap(row)\" data-canvas-type=\"column\" [attr.data-column-index]=\"colIndex\"\n [attr.data-row-index]=\"rowIndex\" [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\"\n [attr.data-column-id]=\"column.id\" (mouseenter)=\"onElementMouseEnter($event, 'column', column, colEl)\"\n (mouseleave)=\"onElementMouseLeave($event)\" (click)=\"onElementClick($event, 'column', column, colEl)\"\n [class.selected]=\"selectedElement?.domElement === colEl\"\n [class.hovered]=\"hoveredElement?.domElement === colEl && selectedElement?.domElement !== colEl\">\n <ng-container dynamicFieldLoader [fields]=\"getColumnFields(column)\" [formGroup]=\"form\"\n [readonlyMode]=\"readonlyModeGlobal === null ? null : readonlyModeGlobal\"\n [disabledMode]=\"disabledModeGlobal === null ? null : disabledModeGlobal\"\n [presentationMode]=\"presentationForLoader\" [visible]=\"visibleGlobal === null ? null : visibleGlobal\"\n [canvasMode]=\"enableCustomization\" (canvasMouseEnter)=\"onFieldMouseEnter($event)\"\n (canvasMouseLeave)=\"onFieldMouseLeave($event)\" (canvasClick)=\"onFieldClick($event)\"\n (renderError)=\"onFieldRenderError($event)\">\n </ng-container>\n </div>\n </div>\n } }\n </div>\n </div>\n }\n }\n } @else {\n <div class=\"section-collapsed-placeholder\">\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'unfold_more'\"></mat-icon>\n <span>{{ getSectionCollapsedSummary(section) }}</span>\n </div>\n }\n @if (last && beforeActionsPlacement === 'insideLastSection' && formBlocksBeforeActions.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before-actions\" data-editorial-placement=\"beforeActions\">\n @for (block of formBlocksBeforeActions; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('beforeActions', $event)\">\n </ng-container>\n }\n </section>\n }\n @if (actionPlacement === 'insideLastSection' && last && !(effectivePresentation\n || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"insideLastSection\" [actions]=\"config.actions\"\n [isSubmitting]=\"submitting\" [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\"\n [actionOverrides]=\"actionRuleProps\" [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n </div>\n <!-- Overlay de bloqueio durante submiss\u00E3o -->\n @if (submitting) {\n <div class=\"form-blocking-overlay\" aria-live=\"polite\">\n <mat-progress-spinner diameter=\"40\" color=\"primary\"></mat-progress-spinner>\n <p>{{ config.messages?.loading?.submit || 'Salvando...' }}</p>\n </div>\n }\n </div>\n\n @if (enableCustomization && selectedElement?.domElement === sectionEl) {\n <div class=\"add-section-container\">\n <div class=\"add-section-line\"></div>\n <button mat-fab color=\"primary\" aria-label=\"Adicionar nova se\u00E7\u00E3o\" (click)=\"addNewSectionAfter(sectionIndex)\"\n matTooltip=\"Adicionar nova se\u00E7\u00E3o aqui\">\n <mat-icon [praxisIcon]=\"'add'\"></mat-icon>\n </button>\n <div class=\"add-section-line\"></div>\n </div>\n }\n }\n </div>\n }\n\n @if (beforeActionsPlacement !== 'insideLastSection' && formBlocksBeforeActions.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before-actions\" data-editorial-placement=\"beforeActions\">\n @for (block of formBlocksBeforeActions; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('beforeActions', $event)\">\n </ng-container>\n }\n </section>\n }\n\n @if (actionPlacement === 'afterSections' && !(effectivePresentation || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"afterSections\" [actions]=\"config.actions\" [isSubmitting]=\"submitting\"\n [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\"\n [actionOverrides]=\"actionRuleProps\" [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n\n @if (formBlocksAfter.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-after\" data-editorial-placement=\"after\">\n @for (block of formBlocksAfter; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('after', $event)\">\n </ng-container>\n }\n </section>\n }\n</form>\n@if (!enableCustomization && mode === 'view') {\n<div class=\"ai-floating-assistant\">\n <praxis-ai-assistant [adapter]=\"aiAdapter\"></praxis-ai-assistant>\n</div>\n}\n}\n", styles: ["@charset \"UTF-8\";.span-xs-1{grid-column:span 1}.span-xs-2{grid-column:span 2}.span-xs-3{grid-column:span 3}.span-xs-4{grid-column:span 4}.span-xs-5{grid-column:span 5}.span-xs-6{grid-column:span 6}.span-xs-7{grid-column:span 7}.span-xs-8{grid-column:span 8}.span-xs-9{grid-column:span 9}.span-xs-10{grid-column:span 10}.span-xs-11{grid-column:span 11}.span-xs-12{grid-column:span 12}.offset-xs-0{margin-left:0%}.offset-xs-1{margin-left:calc(1 / 12 * 100%)}.offset-xs-2{margin-left:calc(2 / 12 * 100%)}.offset-xs-3{margin-left:25%}.offset-xs-4{margin-left:calc(4 / 12 * 100%)}.offset-xs-5{margin-left:calc(5 / 12 * 100%)}.offset-xs-6{margin-left:50%}.offset-xs-7{margin-left:calc(7 / 12 * 100%)}.offset-xs-8{margin-left:calc(8 / 12 * 100%)}.offset-xs-9{margin-left:75%}.offset-xs-10{margin-left:calc(10 / 12 * 100%)}.offset-xs-11{margin-left:calc(11 / 12 * 100%)}.order-xs--12{order:-12}.order-xs--11{order:-11}.order-xs--10{order:-10}.order-xs--9{order:-9}.order-xs--8{order:-8}.order-xs--7{order:-7}.order-xs--6{order:-6}.order-xs--5{order:-5}.order-xs--4{order:-4}.order-xs--3{order:-3}.order-xs--2{order:-2}.order-xs--1{order:-1}.order-xs-0{order:0}.order-xs-1{order:1}.order-xs-2{order:2}.order-xs-3{order:3}.order-xs-4{order:4}.order-xs-5{order:5}.order-xs-6{order:6}.order-xs-7{order:7}.order-xs-8{order:8}.order-xs-9{order:9}.order-xs-10{order:10}.order-xs-11{order:11}.order-xs-12{order:12}.hidden-xs{display:none}@media(min-width:600px){.span-sm-1{grid-column:span 1}.span-sm-2{grid-column:span 2}.span-sm-3{grid-column:span 3}.span-sm-4{grid-column:span 4}.span-sm-5{grid-column:span 5}.span-sm-6{grid-column:span 6}.span-sm-7{grid-column:span 7}.span-sm-8{grid-column:span 8}.span-sm-9{grid-column:span 9}.span-sm-10{grid-column:span 10}.span-sm-11{grid-column:span 11}.span-sm-12{grid-column:span 12}.offset-sm-0{margin-left:0%}.offset-sm-1{margin-left:calc(1 / 12 * 100%)}.offset-sm-2{margin-left:calc(2 / 12 * 100%)}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:calc(4 / 12 * 100%)}.offset-sm-5{margin-left:calc(5 / 12 * 100%)}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:calc(7 / 12 * 100%)}.offset-sm-8{margin-left:calc(8 / 12 * 100%)}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:calc(10 / 12 * 100%)}.offset-sm-11{margin-left:calc(11 / 12 * 100%)}.order-sm--12{order:-12}.order-sm--11{order:-11}.order-sm--10{order:-10}.order-sm--9{order:-9}.order-sm--8{order:-8}.order-sm--7{order:-7}.order-sm--6{order:-6}.order-sm--5{order:-5}.order-sm--4{order:-4}.order-sm--3{order:-3}.order-sm--2{order:-2}.order-sm--1{order:-1}.order-sm-0{order:0}.order-sm-1{order:1}.order-sm-2{order:2}.order-sm-3{order:3}.order-sm-4{order:4}.order-sm-5{order:5}.order-sm-6{order:6}.order-sm-7{order:7}.order-sm-8{order:8}.order-sm-9{order:9}.order-sm-10{order:10}.order-sm-11{order:11}.order-sm-12{order:12}.hidden-sm{display:none}}@media(min-width:900px){.span-md-1{grid-column:span 1}.span-md-2{grid-column:span 2}.span-md-3{grid-column:span 3}.span-md-4{grid-column:span 4}.span-md-5{grid-column:span 5}.span-md-6{grid-column:span 6}.span-md-7{grid-column:span 7}.span-md-8{grid-column:span 8}.span-md-9{grid-column:span 9}.span-md-10{grid-column:span 10}.span-md-11{grid-column:span 11}.span-md-12{grid-column:span 12}.offset-md-0{margin-left:0%}.offset-md-1{margin-left:calc(1 / 12 * 100%)}.offset-md-2{margin-left:calc(2 / 12 * 100%)}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:calc(4 / 12 * 100%)}.offset-md-5{margin-left:calc(5 / 12 * 100%)}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:calc(7 / 12 * 100%)}.offset-md-8{margin-left:calc(8 / 12 * 100%)}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:calc(10 / 12 * 100%)}.offset-md-11{margin-left:calc(11 / 12 * 100%)}.order-md--12{order:-12}.order-md--11{order:-11}.order-md--10{order:-10}.order-md--9{order:-9}.order-md--8{order:-8}.order-md--7{order:-7}.order-md--6{order:-6}.order-md--5{order:-5}.order-md--4{order:-4}.order-md--3{order:-3}.order-md--2{order:-2}.order-md--1{order:-1}.order-md-0{order:0}.order-md-1{order:1}.order-md-2{order:2}.order-md-3{order:3}.order-md-4{order:4}.order-md-5{order:5}.order-md-6{order:6}.order-md-7{order:7}.order-md-8{order:8}.order-md-9{order:9}.order-md-10{order:10}.order-md-11{order:11}.order-md-12{order:12}.hidden-md{display:none}}@media(min-width:1200px){.span-lg-1{grid-column:span 1}.span-lg-2{grid-column:span 2}.span-lg-3{grid-column:span 3}.span-lg-4{grid-column:span 4}.span-lg-5{grid-column:span 5}.span-lg-6{grid-column:span 6}.span-lg-7{grid-column:span 7}.span-lg-8{grid-column:span 8}.span-lg-9{grid-column:span 9}.span-lg-10{grid-column:span 10}.span-lg-11{grid-column:span 11}.span-lg-12{grid-column:span 12}.offset-lg-0{margin-left:0%}.offset-lg-1{margin-left:calc(1 / 12 * 100%)}.offset-lg-2{margin-left:calc(2 / 12 * 100%)}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:calc(4 / 12 * 100%)}.offset-lg-5{margin-left:calc(5 / 12 * 100%)}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:calc(7 / 12 * 100%)}.offset-lg-8{margin-left:calc(8 / 12 * 100%)}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:calc(10 / 12 * 100%)}.offset-lg-11{margin-left:calc(11 / 12 * 100%)}.order-lg--12{order:-12}.order-lg--11{order:-11}.order-lg--10{order:-10}.order-lg--9{order:-9}.order-lg--8{order:-8}.order-lg--7{order:-7}.order-lg--6{order:-6}.order-lg--5{order:-5}.order-lg--4{order:-4}.order-lg--3{order:-3}.order-lg--2{order:-2}.order-lg--1{order:-1}.order-lg-0{order:0}.order-lg-1{order:1}.order-lg-2{order:2}.order-lg-3{order:3}.order-lg-4{order:4}.order-lg-5{order:5}.order-lg-6{order:6}.order-lg-7{order:7}.order-lg-8{order:8}.order-lg-9{order:9}.order-lg-10{order:10}.order-lg-11{order:11}.order-lg-12{order:12}.hidden-lg{display:none}}@media(min-width:1536px){.span-xl-1{grid-column:span 1}.span-xl-2{grid-column:span 2}.span-xl-3{grid-column:span 3}.span-xl-4{grid-column:span 4}.span-xl-5{grid-column:span 5}.span-xl-6{grid-column:span 6}.span-xl-7{grid-column:span 7}.span-xl-8{grid-column:span 8}.span-xl-9{grid-column:span 9}.span-xl-10{grid-column:span 10}.span-xl-11{grid-column:span 11}.span-xl-12{grid-column:span 12}.offset-xl-0{margin-left:0%}.offset-xl-1{margin-left:calc(1 / 12 * 100%)}.offset-xl-2{margin-left:calc(2 / 12 * 100%)}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:calc(4 / 12 * 100%)}.offset-xl-5{margin-left:calc(5 / 12 * 100%)}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:calc(7 / 12 * 100%)}.offset-xl-8{margin-left:calc(8 / 12 * 100%)}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:calc(10 / 12 * 100%)}.offset-xl-11{margin-left:calc(11 / 12 * 100%)}.order-xl--12{order:-12}.order-xl--11{order:-11}.order-xl--10{order:-10}.order-xl--9{order:-9}.order-xl--8{order:-8}.order-xl--7{order:-7}.order-xl--6{order:-6}.order-xl--5{order:-5}.order-xl--4{order:-4}.order-xl--3{order:-3}.order-xl--2{order:-2}.order-xl--1{order:-1}.order-xl-0{order:0}.order-xl-1{order:1}.order-xl-2{order:2}.order-xl-3{order:3}.order-xl-4{order:4}.order-xl-5{order:5}.order-xl-6{order:6}.order-xl-7{order:7}.order-xl-8{order:8}.order-xl-9{order:9}.order-xl-10{order:10}.order-xl-11{order:11}.order-xl-12{order:12}.hidden-xl{display:none}}.canvas-mode-enabled{--canvas-hit: 14px}.canvas-mode-enabled .canvas-element{position:relative;z-index:0;border-radius:8px;outline:2px solid transparent;outline-offset:2px;transition:outline-color .2s ease,outline-style .2s ease}.canvas-mode-enabled .canvas-element:before{content:\"\";position:absolute;inset:calc(-1 * var(--canvas-hit));pointer-events:none;border-radius:inherit;background:transparent}.canvas-mode-enabled .canvas-element[data-canvas-type=section]{--outline-color: var(--md-sys-color-primary)}.canvas-mode-enabled .canvas-element[data-canvas-type=row]{--outline-color: var(--md-sys-color-secondary)}.canvas-mode-enabled .canvas-element[data-canvas-type=column],.canvas-mode-enabled .canvas-element[data-canvas-type=field]{--outline-color: var(--md-sys-color-tertiary)}.canvas-mode-enabled .canvas-element[data-canvas-type=actions]{--outline-color: var(--md-sys-color-primary)}.canvas-mode-enabled .canvas-element.hovered:not(.selected){outline-color:var(--outline-color, var(--md-sys-color-primary));outline-style:dashed}.canvas-mode-enabled .canvas-element.selected{outline-color:var(--outline-color, var(--md-sys-color-primary));outline-style:solid;box-shadow:0 0 0 2px var(--outline-color, var(--md-sys-color-primary))}.canvas-mode-enabled .canvas-element.hovered{z-index:1000}.canvas-mode-enabled .canvas-element.selected{z-index:2000}.section-drop-wrapper,.row-drop-wrapper,.column-drop-wrapper{display:contents}.add-section-container{display:flex;align-items:center;justify-content:center;padding:.5rem 0;margin:-.5rem 0;position:relative;z-index:500}.add-section-container .add-section-line{flex-grow:1;height:1px;background:repeating-linear-gradient(90deg,var(--md-sys-color-outline-variant),var(--md-sys-color-outline-variant) 4px,transparent 4px,transparent 8px)}.add-section-container button{margin:0 1rem;transform:scale(.85)}:host{display:block;position:relative}.form-config-controls{position:sticky;top:10px;margin-left:auto;margin-bottom:10px;display:flex;align-items:center;gap:.35rem;z-index:60;background:color-mix(in srgb,var(--md-sys-color-surface) 92%,transparent);padding:6px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 82%,transparent);border-radius:999px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 10px 22px #0f172a14;min-width:0;justify-content:flex-end;pointer-events:none;opacity:.88;transition:opacity .16s ease,box-shadow .16s ease,border-color .16s ease,transform .16s ease}.form-config-controls>*{pointer-events:auto}.praxis-dynamic-form:hover .form-config-controls,.praxis-dynamic-form:focus-within .form-config-controls{opacity:1;border-color:color-mix(in srgb,var(--md-sys-color-primary) 26%,var(--md-sys-color-outline-variant) 74%);box-shadow:0 14px 28px #0f172a1f;transform:translateY(-1px)}.form-config-controls .mat-icon-button{--mdc-icon-button-state-layer-size: 34px;width:34px;height:34px;color:var(--md-sys-color-on-surface-variant);background:color-mix(in srgb,var(--md-sys-color-surface-container-low) 82%,transparent);border:1px solid transparent}.form-config-controls .mat-icon-button:hover{color:var(--md-sys-color-primary);background:var(--md-sys-color-primary-container);border-color:color-mix(in srgb,var(--md-sys-color-primary) 20%,transparent)}.ai-floating-assistant{position:sticky;right:0;bottom:12px;margin-top:14px;margin-left:auto;width:fit-content;z-index:70;pointer-events:none}.ai-floating-assistant praxis-ai-assistant{pointer-events:auto;display:inline-flex}.ai-floating-assistant .ai-trigger-btn{box-shadow:0 12px 28px #0f172a24}.config-button{color:var(--md-sys-color-primary)}.form-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center;color:var(--md-sys-color-on-surface);gap:1rem}.form-loading p{margin:0;font-size:.875rem;opacity:.7}.form-error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center;color:var(--md-sys-color-error);gap:1rem;border:1px solid var(--md-sys-color-error);border-radius:8px;background-color:var(--md-sys-color-error-container);margin:1rem;box-shadow:0 12px 30px #7f1d1d1f}.form-error h3{margin:0;color:var(--md-sys-color-on-error-container)}.form-error p{margin:0;color:var(--md-sys-color-on-error-container);opacity:.8}.form-error button{margin-top:.5rem}.pfx-form-info-banner{margin-bottom:14px;padding:12px 14px;border-radius:16px;border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 18%,var(--md-sys-color-outline-variant) 82%);background:color-mix(in srgb,var(--md-sys-color-primary-container) 24%,var(--md-sys-color-surface) 76%);color:var(--md-sys-color-on-surface);display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.pfx-form-info-banner .text{font-size:.92rem;line-height:1.5;font-weight:600}.pfx-form-info-banner .actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.praxis-dynamic-form{display:flex;flex-direction:column;transition:all .3s ease;position:relative;font-family:inherit;font-size:inherit;color:inherit;--pfx-editorial-form-surface: var( --pfx-form-section-surface, var(--md-sys-color-surface-container) );--pfx-editorial-form-surface-muted: var(--md-sys-color-surface-container-low);--pfx-editorial-form-border: var( --pfx-form-stroke, var(--md-sys-color-outline-variant) );--pfx-editorial-form-text: var(--md-sys-color-on-surface);--pfx-editorial-form-text-muted: var(--md-sys-color-on-surface-variant);--pfx-editorial-form-field-surface: color-mix( in srgb, var(--pfx-editorial-form-surface-muted) 76%, var(--pfx-editorial-form-surface) 24% );--pfx-editorial-form-field-outline: color-mix( in srgb, var(--pfx-editorial-form-border) 88%, transparent );--pfx-editorial-form-accent: var(--md-sys-color-primary);--pfx-editorial-form-accent-text: var(--md-sys-color-on-primary);--pfx-editorial-form-radius: var(--pfx-form-section-radius, 8px);--pfx-editorial-form-field-radius: var(--pfx-form-field-radius, 4px);--pfx-editorial-form-border-width: 1px;--pfx-editorial-form-field-border-width: 1px;--pfx-editorial-form-shadow: none;--pfx-form-shell-surface: color-mix( in srgb, var(--pfx-editorial-form-surface) 36%, transparent );--pfx-form-section-surface-flat: color-mix( in srgb, var(--pfx-editorial-form-surface) 78%, var(--pfx-editorial-form-surface-muted) 22% );--pfx-form-section-divider: color-mix( in srgb, var(--pfx-editorial-form-border) 68%, transparent );--pfx-form-label-strong: color-mix( in srgb, var(--pfx-editorial-form-text) 96%, white 4% );--pfx-form-label-muted: color-mix( in srgb, var(--pfx-editorial-form-text-muted) 92%, var(--pfx-editorial-form-text) 8% );--pfx-form-field-surface-rest: color-mix( in srgb, var(--pfx-editorial-form-field-surface) 82%, var(--pfx-editorial-form-surface) 18% );--pfx-form-field-surface-focus: color-mix( in srgb, var(--pfx-editorial-form-accent) 4%, var(--pfx-form-field-surface-rest) 96% );--pfx-form-field-min-height: 48px;--pfx-form-section-padding: clamp(1.1rem, 1.8vw, 1.5rem);--pfx-form-section-gap: 22px;--pfx-form-footer-surface: color-mix( in srgb, var(--pfx-editorial-form-surface) 70%, var(--pfx-editorial-form-surface-muted) 30% );--pfx-form-footer-border: color-mix( in srgb, var(--pfx-editorial-form-border) 76%, transparent )}.praxis-dynamic-form.editorial-visual-context{font-family:var(--editorial-body-font-family, inherit);font-size:var(--editorial-body-size, 1rem);color:var(--editorial-text-primary, var(--md-sys-color-on-surface));--pfx-editorial-form-surface: var( --editorial-surface-primary, var(--pfx-form-section-surface, var(--md-sys-color-surface-container)) );--pfx-editorial-form-surface-muted: var( --editorial-surface-secondary, var(--md-sys-color-surface-container-low) );--pfx-editorial-form-border: var( --editorial-border-color, var(--pfx-form-stroke, var(--md-sys-color-outline-variant)) );--pfx-editorial-form-text: var( --editorial-text-primary, var(--md-sys-color-on-surface) );--pfx-editorial-form-text-muted: var( --editorial-text-secondary, var(--md-sys-color-on-surface-variant) );--pfx-editorial-form-accent: var( --editorial-cta-primary, var(--editorial-accent, var(--md-sys-color-primary)) );--pfx-editorial-form-accent-text: var( --editorial-cta-primary-text, var(--editorial-accent-contrast, var(--md-sys-color-on-primary)) );--pfx-editorial-form-radius: var(--editorial-card-radius, 18px);--pfx-editorial-form-field-radius: var( --editorial-field-radius, var(--editorial-card-radius, 14px) );--pfx-editorial-form-border-width: var(--editorial-card-border-width, 1px);--pfx-editorial-form-field-border-width: var(--editorial-field-border-width, 1px);--pfx-editorial-form-shadow: var(--editorial-card-shadow, none);--md-sys-color-surface: var( --pfx-editorial-form-surface, var(--md-sys-color-surface) );--md-sys-color-surface-container: var( --pfx-editorial-form-surface, var(--md-sys-color-surface-container) );--md-sys-color-surface-container-low: var( --pfx-editorial-form-surface-muted, var(--md-sys-color-surface-container-low) );--md-sys-color-surface-variant: var( --pfx-editorial-form-field-surface, var(--md-sys-color-surface-variant) );--md-sys-color-outline: var( --pfx-editorial-form-field-outline, var(--md-sys-color-outline) );--md-sys-color-outline-variant: var( --pfx-editorial-form-border, var(--md-sys-color-outline-variant) );--md-sys-color-on-surface: var( --pfx-editorial-form-text, var(--md-sys-color-on-surface) );--md-sys-color-on-surface-variant: var( --pfx-editorial-form-text-muted, var(--md-sys-color-on-surface-variant) );--md-sys-color-primary: var( --pfx-editorial-form-accent, var(--md-sys-color-primary) );--md-sys-color-on-primary: var( --pfx-editorial-form-accent-text, var(--md-sys-color-on-primary) );--md-sys-color-on-surface-rgb: var( --editorial-text-primary-rgb, var(--md-sys-color-on-surface-rgb) );--mat-sys-on-surface: var( --pfx-editorial-form-text, var(--mat-sys-on-surface) );--mat-sys-on-surface-variant: var( --pfx-editorial-form-text-muted, var(--mat-sys-on-surface-variant) );--mat-sys-on-surface-rgb: var( --editorial-text-primary-rgb, var(--mat-sys-on-surface-rgb, var(--md-sys-color-on-surface-rgb)) );color:var(--pfx-editorial-form-text);color-scheme:light}.praxis-dynamic-form.presentation-mode .form-row,.praxis-dynamic-form.readonly-mode .form-row{gap:.5rem;margin-bottom:.5rem}.praxis-dynamic-form.presentation-mode .form-section,.praxis-dynamic-form.readonly-mode .form-section{padding:.75rem .875rem}.praxis-dynamic-form.pres-compact .form-row{gap:.35rem;margin-bottom:.35rem}.praxis-dynamic-form.pres-compact .form-section{padding:.5rem .75rem}.praxis-dynamic-form.pres-label-left .praxis-presentation{display:grid;grid-template-columns:var(--pfx-presentation-label-w, 220px) 1fr;align-items:baseline;column-gap:10px}.praxis-dynamic-form.pres-label-left .praxis-presentation__label{text-align:right;margin-bottom:0}.form-section{border:1px solid var(--pfx-form-section-divider);border-radius:var(--pfx-editorial-form-radius);padding:var(--pfx-form-section-padding);background:var(--pfx-form-section-surface-flat);box-shadow:none;transition:all .2s ease;position:relative}.praxis-dynamic-form.editorial-visual-context .form-section{border:var(--pfx-editorial-form-border-width) solid var(--pfx-editorial-form-border)!important;background:var(--pfx-editorial-form-surface)!important;box-shadow:var(--editorial-card-shadow, none)}.praxis-dynamic-form.editorial-visual-context .form-section.section-appearance-step{background-color:var(--pfx-editorial-form-surface)!important;background-image:linear-gradient(180deg,color-mix(in srgb,var(--editorial-accent, var(--md-sys-color-primary)) 6%,transparent) 0%,transparent 132px)!important;background-repeat:no-repeat!important}.section-drop-wrapper>.form-section{margin-bottom:var(--pfx-section-gap, 20px)}.section-drop-wrapper:last-of-type>.form-section{margin-bottom:0}.praxis-dynamic-form>praxis-form-actions[data-actions-placement=afterSections] .form-actions{margin-top:var(--pfx-actions-gap-top, var(--pfx-section-gap, 20px))}.section-title{margin:0 0 var(--pfx-section-title-mb, 12px) 0;font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));font-size:var(--editorial-step-title-size, 1.12rem);font-weight:700;color:var(--pfx-form-label-strong)}.section-heading{display:flex;align-items:flex-start;gap:12px;margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--pfx-form-section-divider)}.section-heading.align-center{flex-direction:column;align-items:center;text-align:center}.section-heading.align-center .section-heading-text{display:grid;justify-items:center}.section-step-label{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;margin:0 0 8px;border-radius:999px;background:color-mix(in srgb,var(--pfx-editorial-form-accent) 10%,transparent);color:color-mix(in srgb,var(--pfx-editorial-form-accent) 84%,var(--pfx-form-label-strong) 16%);font-size:.72rem;font-weight:800;font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));letter-spacing:.08em;text-transform:uppercase}.section-heading-text{flex:1 1 auto;min-width:0}.section-heading-actions{display:inline-flex;align-items:center;align-self:flex-start;flex-wrap:wrap;gap:4px;margin-left:auto}.section-heading-actions.align-center{align-self:center;margin-left:0}.section-heading-action-btn{color:var(--pfx-form-label-muted)}.section-heading-action-btn .mat-mdc-progress-spinner,.section-heading-action-btn mat-progress-spinner{--mdc-circular-progress-active-indicator-color: currentColor}.section-heading-action-btn.loading{opacity:.72;pointer-events:none}.section-heading-action-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.section-collapse-btn{margin-left:4px;color:var(--pfx-form-label-muted)}.section-title.title-large{font:var(--mdc-typography-title-large, 500 22px/28px system-ui)}.section-title.title-medium{font:var(--mdc-typography-title-medium, 500 16px/24px system-ui)}.section-title.title-small{font:var(--mdc-typography-title-small, 500 14px/20px system-ui)}.section-title.headline-small{font:var(--mdc-typography-headline-small, 600 24px/32px system-ui)}.section-title.title-large,.section-title.title-medium,.section-title.title-small,.section-title.headline-small{font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));font-weight:var(--editorial-title-weight, 600)}.section-description{margin:0;font-family:var(--editorial-body-font-family, inherit);font-size:.93rem;color:var(--pfx-form-label-muted);line-height:1.6}.section-description.body-large{font:var(--mdc-typography-body-large, 400 16px/24px system-ui)}.section-description.body-medium{font:var(--mdc-typography-body-medium, 400 14px/20px system-ui)}.section-description.body-small{font:var(--mdc-typography-body-small, 400 12px/16px system-ui)}.section-description.body-large,.section-description.body-medium,.section-description.body-small{font-family:var(--editorial-body-font-family, inherit);font-weight:var(--editorial-body-weight, 400)}.section-title.align-center,.section-description.align-center,.section-step-label.align-center{text-align:center}.form-section.section-appearance-plain{border-color:transparent;border-radius:0;padding:0;background:transparent}.form-section.section-appearance-plain .section-heading{margin-bottom:14px}.form-section.section-appearance-step{border-radius:var(--pfx-editorial-form-radius);padding:var(--pfx-form-section-padding);background:var(--pfx-form-section-surface-flat);border-color:var(--pfx-form-section-divider);box-shadow:none}.praxis-dynamic-form.editorial-visual-context .form-section.section-appearance-step{border-radius:var(--editorial-card-radius, 20px);box-shadow:none}.form-section.section-appearance-step .section-heading{margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid var(--pfx-form-section-divider)}.form-section.section-appearance-step .section-title{font:var(--mdc-typography-title-large, 700 22px/28px system-ui);color:var(--pfx-form-label-strong);margin-bottom:8px}.form-section.section-appearance-step .section-description{color:var(--pfx-form-label-muted);max-width:60ch}.form-section.section-appearance-step .section-step-label{min-height:24px;padding:0 10px;margin-bottom:10px;box-shadow:none}.form-section.section-appearance-step .section-heading.align-center .section-description{max-width:52ch}.form-section.section-appearance-step .section-body{display:grid;gap:8px;padding-top:0}.form-section.section-appearance-step .form-row{margin-bottom:var(--pfx-field-gap, 1rem)}.form-section.section-appearance-step .form-column{gap:var(--pfx-field-gap, 12px)}.form-section .form-editorial-blocks{display:grid;gap:16px}.form-section .form-editorial-blocks[data-editorial-placement=beforeActions]{margin-top:24px;padding-top:18px;border-top:1px solid var(--pfx-form-section-divider)}.form-section.section-appearance-step .form-editorial-blocks[data-editorial-placement=beforeActions]{gap:18px}.form-section.section-appearance-step .form-editorial-blocks[data-editorial-placement=beforeActions]>*+*{margin-top:2px}.praxis-dynamic-form>praxis-form-actions[data-actions-placement=afterSections] .form-actions{margin-top:18px;padding-top:0}.praxis-dynamic-form>.form-editorial-blocks[data-editorial-placement=after]{margin-top:6px}:host-context(.mdc-theme-dark) .form-section.section-appearance-step,:host-context(.theme-dark) .form-section.section-appearance-step{border-color:color-mix(in srgb,var(--pfx-editorial-form-border) 82%,transparent);box-shadow:none}:host-context(.mdc-theme-dark) .form-section.section-appearance-step .section-title,:host-context(.theme-dark) .form-section.section-appearance-step .section-title{color:color-mix(in srgb,var(--pfx-editorial-form-text) 96%,white)}:host-context(.mdc-theme-dark) .form-section.section-appearance-step .section-description,:host-context(.theme-dark) .form-section.section-appearance-step .section-description{color:color-mix(in srgb,var(--pfx-editorial-form-text-muted) 86%,var(--pfx-editorial-form-text) 14%)}:host-context(.mdc-theme-dark) .section-step-label,:host-context(.theme-dark) .section-step-label{background:color-mix(in srgb,var(--md-sys-color-primary-container) 54%,transparent);color:color-mix(in srgb,var(--md-sys-color-primary) 88%,white)}:host-context(.mdc-theme-dark) .form-section .form-editorial-blocks[data-editorial-placement=beforeActions],:host-context(.theme-dark) .form-section .form-editorial-blocks[data-editorial-placement=beforeActions]{border-top-color:color-mix(in srgb,var(--md-sys-color-outline-variant) 90%,transparent)}.inline-edit-btn{margin-left:6px;vertical-align:middle;--mdc-icon-button-size: 28px;--mdc-icon-button-icon-size: 16px}.inline-edit-btn mat-icon{font-size:16px;width:16px;height:16px}.section-body.collapsed{border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-low);border-radius:6px;padding:8px 10px}.section-collapsed-placeholder{display:flex;align-items:center;gap:8px;color:var(--md-sys-color-on-surface-variant);font-size:.95rem}.section-collapsed-placeholder mat-icon{font-size:20px;width:20px;height:20px}.form-row{display:flex;gap:1.1rem;margin-bottom:var(--pfx-field-gap, 1.1rem);transition:all .2s ease;border-radius:6px;position:relative}.praxis-dynamic-form.pfx-mounting .form-row{opacity:0;transform:translateY(var(--pdx-form-mount-offset, 6px));animation:pdxFormMount var(--pdx-form-mount-duration, .16s) ease-out both;animation-delay:calc(var(--pfx-mount-index, 0) * var(--pdx-form-mount-stagger, 20ms))}@media(prefers-reduced-motion:reduce){.praxis-dynamic-form.pfx-mounting .form-row{animation:none;opacity:1;transform:none}}@keyframes pdxFormMount{to{opacity:1;transform:translateY(0)}}.praxis-dynamic-form .mat-mdc-form-field{width:100%;margin-bottom:var(--pfx-field-gap, 10px);font-family:inherit;--mdc-filled-text-field-container-color: var(--pfx-form-field-surface-rest);--mdc-filled-text-field-focus-active-indicator-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-active-indicator-color: var(--pfx-editorial-form-field-outline);--mdc-filled-text-field-hover-active-indicator-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-focus-label-text-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-label-text-color: var(--pfx-form-label-muted);--mdc-filled-text-field-input-text-color: var(--pfx-editorial-form-text);--mdc-filled-text-field-caret-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-input-text-placeholder-color: color-mix( in srgb, var(--pfx-editorial-form-text-muted) 82%, transparent );--mdc-outlined-text-field-outline-color: var(--pfx-editorial-form-field-outline);--mdc-outlined-text-field-hover-outline-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-focus-outline-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-focus-label-text-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-label-text-color: var(--pfx-form-label-muted);--mdc-outlined-text-field-input-text-color: var(--pfx-editorial-form-text);--mdc-filled-text-field-container-shape: var(--pfx-editorial-form-field-radius);--mdc-outlined-text-field-container-shape: var(--pfx-editorial-form-field-radius);--mdc-filled-text-field-active-indicator-height: var(--pfx-editorial-form-field-border-width);--mdc-filled-text-field-focus-active-indicator-height: var(--pfx-editorial-form-field-border-width);--mdc-outlined-text-field-outline-width: var(--pfx-editorial-form-field-border-width);--mdc-outlined-text-field-focus-outline-width: var(--pfx-editorial-form-field-border-width);--mat-select-enabled-trigger-text-color: var(--pfx-editorial-form-text);--mat-select-enabled-arrow-color: var(--pfx-form-label-muted);--mat-form-field-enabled-select-arrow-color: var(--pfx-form-label-muted);--mat-form-field-focus-select-arrow-color: var(--pfx-editorial-form-accent);--mat-form-field-hover-state-layer-opacity: 0;--mat-form-field-focus-state-layer-opacity: 0}.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field{font-family:var(--editorial-body-font-family, inherit)}.praxis-dynamic-form .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mdc-text-field{background:var(--pfx-form-field-surface-rest);border-radius:var(--pfx-editorial-form-field-radius);min-height:var(--pfx-form-field-min-height);transition:background-color .16s ease,box-shadow .16s ease,border-color .16s ease}.praxis-dynamic-form.editorial-visual-context .mat-mdc-text-field-wrapper,.praxis-dynamic-form.editorial-visual-context .mdc-text-field,.praxis-dynamic-form.editorial-visual-context .mdc-text-field--filled,.praxis-dynamic-form.editorial-visual-context .mdc-text-field--outlined{background-color:var(--pfx-form-field-surface-rest)!important;background:var(--pfx-form-field-surface-rest)!important}.praxis-dynamic-form .mat-mdc-form-field .mdc-floating-label,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-hint,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-error,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-required-marker,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-select-arrow,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-select-placeholder,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-icon-suffix,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-icon-prefix{color:var(--pfx-form-label-muted)}.praxis-dynamic-form .mat-mdc-input-element,.praxis-dynamic-form .mat-mdc-select-value-text,.praxis-dynamic-form .mat-mdc-form-field-infix,.praxis-dynamic-form .mat-mdc-select-min-line{color:var(--pfx-editorial-form-text)}.praxis-dynamic-form .mat-mdc-form-field:hover .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mat-mdc-form-field:hover .mdc-text-field,.praxis-dynamic-form .mat-mdc-form-field.mat-focused .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mat-mdc-form-field.mat-focused .mdc-text-field{background:var(--pfx-form-field-surface-focus)}.praxis-dynamic-form.editorial-visual-context .mat-mdc-input-element,.praxis-dynamic-form.editorial-visual-context .mat-mdc-select-value-text,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field-infix,.praxis-dynamic-form.editorial-visual-context .mat-mdc-select-min-line,.praxis-dynamic-form.editorial-visual-context .mdc-text-field__input{color:var(--pfx-editorial-form-text)!important;-webkit-text-fill-color:var(--pfx-editorial-form-text)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-hint,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-error,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-required-marker,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-select-arrow,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-select-placeholder,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-icon-suffix,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-icon-prefix{color:var(--pfx-editorial-form-text-muted)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mdc-text-field__input::placeholder{color:color-mix(in srgb,var(--pfx-editorial-form-text) 68%,transparent)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-input-element::placeholder,.praxis-dynamic-form.editorial-visual-context textarea.mat-mdc-input-element::placeholder{color:color-mix(in srgb,var(--pfx-editorial-form-text) 58%,transparent)!important}.praxis-dynamic-form .mat-mdc-radio-button,.praxis-dynamic-form .mat-mdc-checkbox,.praxis-dynamic-form .mat-mdc-slide-toggle{--mdc-radio-selected-icon-color: var(--pfx-editorial-form-accent);--mdc-radio-selected-hover-icon-color: var(--pfx-editorial-form-accent);--mdc-radio-selected-focus-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-checkmark-color: var(--pfx-editorial-form-accent-text);--mdc-checkbox-selected-focus-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-hover-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-icon-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-focus-state-layer-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-handle-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-track-color: color-mix(in srgb, var(--pfx-editorial-form-accent) 45%, #fff)}.praxis-dynamic-form [data-field-type=input],.praxis-dynamic-form [data-field-type=textarea],.praxis-dynamic-form [data-field-type=email],.praxis-dynamic-form [data-field-type=password],.praxis-dynamic-form [data-field-type=url],.praxis-dynamic-form [data-field-type=search],.praxis-dynamic-form [data-field-type=phone],.praxis-dynamic-form [data-field-type=numericTextBox],.praxis-dynamic-form [data-field-type=currency],.praxis-dynamic-form [data-field-type=cpfCnpj],.praxis-dynamic-form [data-field-type=date],.praxis-dynamic-form [data-field-type=dateInput],.praxis-dynamic-form [data-field-type=dateRange],.praxis-dynamic-form [data-field-type=dateTimeLocal],.praxis-dynamic-form [data-field-type=time],.praxis-dynamic-form [data-field-type=timePicker],.praxis-dynamic-form [data-field-type=timeRange],.praxis-dynamic-form [data-field-type=month],.praxis-dynamic-form [data-field-type=week],.praxis-dynamic-form [data-field-type=yearInput],.praxis-dynamic-form [data-field-type=select],.praxis-dynamic-form [data-field-type=multi-select],.praxis-dynamic-form [data-field-type=searchable-select],.praxis-dynamic-form [data-field-type=async-select],.praxis-dynamic-form [data-field-type=autocomplete],.praxis-dynamic-form [data-field-type=tree-select],.praxis-dynamic-form [data-field-type=multi-select-tree],.praxis-dynamic-form [data-field-type=priceRange],.praxis-dynamic-form [data-field-type=file-upload]{display:block;width:100%;min-width:0}.praxis-dynamic-form .mat-mdc-form-field-subscript-wrapper{min-height:var(--pfx-subscript-min-h, 22px)}.form-row:last-child{margin-bottom:0}.form-column{display:grid;align-content:start;gap:var(--pfx-field-gap, 10px);flex:1;min-width:0;transition:all .2s ease;border-radius:4px;position:relative}.form-row.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--pfx-grid-gap, 16px)}.align-start{align-self:flex-start}.align-center{align-self:center}.align-end{align-self:flex-end}.align-stretch{align-self:stretch}.form-blocking-overlay{position:absolute;inset:0;background:transparent;color:var(--md-sys-color-on-surface);backdrop-filter:blur(2px) saturate(103%);-webkit-backdrop-filter:blur(2px) saturate(103%);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;z-index:10;pointer-events:all}@media(max-width:768px){.form-row{flex-direction:column;gap:.5rem}.form-section{padding:1rem}.section-heading{gap:10px;margin-bottom:16px;padding-bottom:14px}}.section-title{display:flex;align-items:center;gap:8px}.section-title .section-title-icon{font-size:1.25em;line-height:1}.section-title-avatar{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px));display:inline-flex;align-items:center;justify-content:center;width:var(--_pfx-form-section-avatar-size);height:var(--_pfx-form-section-avatar-size);border-radius:999px;flex:0 0 var(--_pfx-form-section-avatar-size);overflow:hidden}.section-title-avatar.size-sm{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-sm, 24px)}.section-title-avatar.size-md{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px))}.section-title-avatar.size-lg{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-lg, 40px)}.section-title-avatar-image{object-fit:cover;border:1px solid color-mix(in srgb,var(--pfx-form-section-divider) 72%,transparent);background:var(--pfx-form-section-surface-flat)}.section-title-avatar-text,.section-title-avatar-placeholder{background:color-mix(in srgb,var(--pfx-editorial-form-accent) 14%,var(--pfx-form-section-surface-flat));color:color-mix(in srgb,var(--pfx-editorial-form-accent) 82%,var(--pfx-form-label-strong) 18%);font-size:calc(var(--_pfx-form-section-avatar-size) * .41);font-weight:800;letter-spacing:.04em;text-transform:uppercase}.section-title-avatar-placeholder mat-icon{font-size:calc(var(--_pfx-form-section-avatar-size) * .5625);width:calc(var(--_pfx-form-section-avatar-size) * .5625);height:calc(var(--_pfx-form-section-avatar-size) * .5625);line-height:calc(var(--_pfx-form-section-avatar-size) * .5625)}.section-title-avatar-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.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: "directive", type: DynamicWidgetLoaderDirective, selector: "[dynamicWidgetLoader]", inputs: ["dynamicWidgetLoader", "ownerWidgetKey", "context", "strictValidation", "autoWireOutputs"], outputs: ["widgetEvent", "widgetDiagnostic"], exportAs: ["dynamicWidgetLoader"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.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: "component", type: i4.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i15.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i17.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "component", type: CanvasToolbarComponent, selector: "praxis-canvas-toolbar", inputs: ["selectedElement"], outputs: ["editMetadata", "delete", "moveUp", "moveDown", "selectPath", "requestClose", "toggleReadonly", "toggleRequired", "toggleHidden", "toggleDisabled"] }, { kind: "component", type: PraxisFormActionsComponent, selector: "praxis-form-actions", inputs: ["actions", "editorialVisualContext", "isSubmitting", "formIsValid", "submitError", "formId", "actionOverrides"], outputs: ["action"] }, { kind: "component", type: EmptyStateCardComponent, selector: "praxis-empty-state-card", inputs: ["icon", "title", "description", "primaryAction", "secondaryActions", "inline", "tone"] }, { kind: "component", type: PraxisAiAssistantComponent, selector: "praxis-ai-assistant", inputs: ["adapter", "riskPolicy", "allowManualPatchEdit"] }] });
|
|
11401
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: PraxisDynamicForm, deps: [{ token: i1$2.GenericCrudService }, { token: i2.HttpClient }, { token: i1$3.FormBuilder }, { token: i0.ChangeDetectorRef }, { token: FormLayoutService }, { token: FormContextService }, { token: FormRulesService }, { token: i7.SettingsPanelService }, { token: i2$1.MatDialog }, { token: ASYNC_CONFIG_STORAGE }, { token: CONNECTION_STORAGE }, { token: i1$2.DynamicFormService }, { token: i9$1.MatSnackBar }, { token: CanvasStateService }, { token: DynamicFormLayoutService }, { token: i1$2.ErrorMessageService }, { token: i1$2.SchemaNormalizerService }, { token: i1$2.ComponentMetadataRegistry }, { token: i1$2.GlobalConfigService }, { token: i1$2.ComponentKeyService }, { token: i1$2.LoadingOrchestrator }, { token: i0.NgZone }, { token: API_URL }, { token: PRAXIS_LOADING_RENDERER, optional: true }, { token: i12.Router, optional: true }, { token: i12.ActivatedRoute, optional: true }, { token: i1$2.FormHooksRegistry, optional: true }, { token: FORM_HOOKS_PRESETS, optional: true }, { token: i1$2.LoggerService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
11402
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: PraxisDynamicForm, isStandalone: true, selector: "praxis-dynamic-form", inputs: { resourcePath: "resourcePath", resourceId: "resourceId", editorialContext: "editorialContext", mode: "mode", config: "config", schemaSource: "schemaSource", schemaUrl: "schemaUrl", submitUrl: "submitUrl", submitMethod: "submitMethod", responseSchemaUrl: "responseSchemaUrl", apiEndpointKey: "apiEndpointKey", apiUrlEntry: "apiUrlEntry", enableCustomization: "enableCustomization", formId: "formId", componentInstanceId: "componentInstanceId", layout: "layout", backConfig: "backConfig", hooks: "hooks", removeEmptyContainersOnSave: "removeEmptyContainersOnSave", reactiveValidation: "reactiveValidation", reactiveValidationDebounceMs: "reactiveValidationDebounceMs", notifyIfOutdated: "notifyIfOutdated", snoozeMs: "snoozeMs", autoOpenSettingsOnOutdated: "autoOpenSettingsOnOutdated", readonlyModeGlobal: "readonlyModeGlobal", disabledModeGlobal: "disabledModeGlobal", presentationModeGlobal: "presentationModeGlobal", visibleGlobal: "visibleGlobal", customEndpoints: "customEndpoints" }, outputs: { formSubmit: "formSubmit", formCancel: "formCancel", formReset: "formReset", configChange: "configChange", formReady: "formReady", valueChange: "valueChange", syncCompleted: "syncCompleted", initializationError: "initializationError", loadingStateChange: "loadingStateChange", enableCustomizationChange: "enableCustomizationChange", customAction: "customAction", actionConfirmation: "actionConfirmation", schemaStatusChange: "schemaStatusChange", fieldRenderError: "fieldRenderError", widgetEvent: "widgetEvent" }, providers: [providePraxisI18nConfig(PRAXIS_DYNAMIC_FORM_I18N_CONFIG)], viewQueries: [{ propertyName: "formHost", first: true, predicate: ["formHost"], descendants: true }, { propertyName: "fieldLoaders", predicate: DynamicFieldLoaderDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isLoading) {\n<!-- Loading State -->\n<div class=\"form-loading\">\n <mat-progress-spinner diameter=\"40\"></mat-progress-spinner>\n <p>Carregando formul\u00E1rio...</p>\n</div>\n} @else if (initializationStatus === 'error') {\n<!-- Error State -->\n<div class=\"form-error\">\n <mat-icon color=\"warn\" [praxisIcon]=\"'error'\"></mat-icon>\n <h3>{{ getErrorTitle() }}</h3>\n <p>{{ currentErrorMessage }}</p>\n @if (isRecoverable) {\n <button mat-stroked-button (click)=\"retryInitialization()\">\n <mat-icon [praxisIcon]=\"'refresh'\"></mat-icon>\n Tentar Novamente\n </button>\n }\n <button mat-button (click)=\"showDetailedError()\" class=\"show-details\">\n Ver Detalhes T\u00E9cnicos\n </button>\n <!-- Permitir corre\u00E7\u00E3o do resourcePath diretamente do estado de erro -->\n <button mat-flat-button color=\"primary\" (click)=\"openQuickConnect()\" class=\"connect-action\">\n <mat-icon [praxisIcon]=\"'bolt'\"></mat-icon>\n Conectar a recurso\n </button>\n</div>\n} @else if (initializationStatus === 'success') {\n<!-- Inline banner for schema change (only when customization is enabled) -->\n@if (shouldShowOutdatedInline()) {\n<div class=\"pfx-form-info-banner\" role=\"status\" aria-live=\"polite\">\n <div class=\"text\">O schema do servidor mudou. Reconciliar agora?</div>\n <div class=\"actions\">\n <button mat-stroked-button color=\"primary\" (click)=\"openConfigEditor()\">\n <mat-icon [praxisIcon]=\"'sync'\"></mat-icon>\n Reconciliar\n </button>\n <button mat-button (click)=\"onSnoozeOutdated()\">Lembrar depois</button>\n <button mat-button (click)=\"onIgnoreOutdated()\">Ignorar</button>\n </div>\n</div>\n}\n\n<!-- Configuration Controls -->\n@if (shouldShowConfigControls && enableCustomization) {\n<div class=\"form-config-controls\">\n <praxis-ai-assistant [adapter]=\"aiAdapter\"></praxis-ai-assistant>\n <button type=\"button\" mat-icon-button (click)=\"openConfigEditor()\" [disabled]=\"isLoading\" class=\"config-button\"\n [matBadge]=\"schemaOutdated ? '!' : ''\" [matBadgeHidden]=\"!schemaOutdated\" matBadgeColor=\"warn\" matBadgeSize=\"small\"\n matBadgePosition=\"above after\"\n [matTooltip]=\"schemaOutdated ? 'Schema do servidor mudou \u2014 Reconciliar' : 'Configurar formul\u00E1rio'\">\n <mat-icon [praxisIcon]=\"'settings'\"></mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"disconnect()\" matTooltip=\"Desconectar da fonte de dados\"\n [disabled]=\"isLoading\">\n <mat-icon [praxisIcon]=\"'link_off'\"></mat-icon>\n </button>\n</div>\n}\n\n<!-- Form Content -->\n@if (!resourcePath && (!config.sections || config.sections.length === 0)) {\n<praxis-empty-state-card icon=\"link\" [title]=\"'Conecte o formul\u00E1rio \u00E0 fonte de dados'\"\n [description]=\"'Informe a rota do recurso da API para gerar automaticamente os campos do formul\u00E1rio.'\"\n [primaryAction]=\"{ label: 'Conectar \u00E0 fonte de dados', icon: 'bolt', action: openQuickConnect.bind(this) }\"></praxis-empty-state-card>\n}\n<form #formHost (ngSubmit)=\"onSubmit()\" [attr.aria-busy]=\"submitting ? 'true' : null\"\n [attr.aria-label]=\"'Formul\u00E1rio ' + (config.metadata?.version || '')\" [class.canvas-mode-enabled]=\"enableCustomization\"\n [class.presentation-mode]=\"effectivePresentation\" [class.readonly-mode]=\"effectiveReadonly\"\n [class.editorial-visual-context]=\"hasEditorialVisualContext()\"\n [class.pfx-mounting]=\"isMounting\" [formGroup]=\"form\"\n [ngClass]=\"{\n 'pres-compact': presentationVars.compact,\n 'pres-label-left': presentationVars.labelPosition === 'left',\n 'pres-label-above': presentationVars.labelPosition === 'above'\n }\" [style.--pfx-pres-label-align]=\"presentationVars.labelAlign\"\n [style.--pfx-pres-label-size]=\"presentationVars.labelSize\"\n [style.--pfx-pres-label-width]=\"presentationVars.labelWidth\"\n [style.--pfx-pres-row-gap]=\"presentationVars.density === 'compact' ? '6px' : (presentationVars.density === 'cozy' ? '8px' : '10px')\"\n [style.--pfx-pres-row-padding]=\"presentationVars.density === 'compact' ? '2px 0' : (presentationVars.density === 'cozy' ? '6px 0' : '8px 0')\"\n [style.--pfx-pres-value-align]=\"presentationVars.valueAlign\"\n [style.--pfx-pres-value-size]=\"presentationVars.valueSize\"\n [style.--pdx-form-mount-duration]=\"getMountDurationVar()\"\n [style.--pdx-form-mount-offset]=\"getMountOffsetVar()\"\n [style.--pdx-form-mount-stagger]=\"getMountStaggerVar()\"\n class=\"praxis-dynamic-form\">\n <praxis-canvas-toolbar (editMetadata)=\"openSelectedElementEditor()\" (selectPath)=\"onSelectPath($event)\"\n (moveUp)=\"onToolbarMove('up')\" (moveDown)=\"onToolbarMove('down')\" (toggleReadonly)=\"onToolbarToggleReadonly()\"\n (toggleRequired)=\"onToolbarToggleRequired()\" (toggleHidden)=\"onToolbarToggleHidden()\"\n (toggleDisabled)=\"onToolbarToggleDisabled()\" (requestClose)=\"onToolbarRequestClose()\"\n *ngIf=\"enableCustomization && selectedElement\" [selectedElement]=\"selectedElement\"\n [style.transform]=\"toolbarTransform\"></praxis-canvas-toolbar>\n\n @if (formBlocksBefore.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before\" data-editorial-placement=\"before\">\n @for (block of formBlocksBefore; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('before', $event)\">\n </ng-container>\n }\n </section>\n }\n\n @if (actionPlacement === 'top' && !(effectivePresentation || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"top\" [actions]=\"config.actions\" [isSubmitting]=\"submitting\"\n [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\" [actionOverrides]=\"actionRuleProps\"\n [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n\n @for (section of config.sections; track (section.id ?? $index); let sectionIndex = $index;\n let last = $last) {\n <div class=\"section-drop-wrapper\" [attr.data-section-id]=\"section.id\">\n @if (isSectionVisible(section)) {\n <div #sectionEl class=\"form-section canvas-element\" data-canvas-type=\"section\" [attr.data-section-id]=\"section.id\"\n [attr.data-section-index]=\"sectionIndex\" (mouseenter)=\"onElementMouseEnter($event, 'section', section, sectionEl)\"\n (mouseleave)=\"onElementMouseLeave($event)\" (click)=\"onElementClick($event, 'section', section, sectionEl)\"\n [class.selected]=\"selectedElement?.domElement === sectionEl\"\n [class.hovered]=\"hoveredElement?.domElement === sectionEl && selectedElement?.domElement !== sectionEl\"\n [attr.data-section-appearance]=\"getSectionAppearance(section) || null\"\n [style.marginBottom.px]=\"!last ? getSectionGapBottom(section) : null\" [ngClass]=\"getSectionClasses(section)\"\n [ngStyle]=\"getSectionStyles(section)\">\n <div\n class=\"section-heading\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\"\n [class.step-appearance]=\"getSectionAppearance(section) === 'step'\"\n >\n <div class=\"section-heading-text\" [matTooltip]=\"getSectionHeaderTooltip(section) || null\"\n [matTooltipDisabled]=\"!getSectionHeaderTooltip(section)\">\n @if (getSectionStepLabel(section)) {\n <div class=\"section-step-label\" [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n {{ getSectionStepLabel(section) }}\n </div>\n }\n @if (getSectionTitle(section)) {\n <h3 class=\"section-title\" [class.title-large]=\"getSectionTitleStyle(section) === 'titleLarge'\"\n [class.title-medium]=\"getSectionTitleStyle(section) === 'titleMedium'\"\n [class.title-small]=\"getSectionTitleStyle(section) === 'titleSmall'\"\n [class.headline-small]=\"getSectionTitleStyle(section) === 'headlineSmall'\"\n [style.marginBottom.px]=\"getSectionTitleGapBottom(section) ?? 20\" [style.color]=\"getSectionTitleColor(section) || null\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\"\n [attr.id]=\"sectionPanelId(section, sectionIndex) + '-title'\">\n @let sectionHeaderVisual = getSectionHeaderVisual(section);\n @let sectionHeaderAvatarSize = getSectionHeaderAvatarSize(section);\n @if (sectionHeaderVisual.kind === 'icon') {\n <mat-icon class=\"section-title-icon\" aria-hidden=\"true\" [praxisIcon]=\"sectionHeaderVisual.icon\"></mat-icon>\n }\n @if (sectionHeaderVisual.kind === 'image') {\n <img class=\"section-title-avatar section-title-avatar-image\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\"\n [src]=\"sectionHeaderVisual.src\" [alt]=\"sectionHeaderVisual.alt\" />\n }\n @if (sectionHeaderVisual.kind === 'initials') {\n <span class=\"section-title-avatar section-title-avatar-text\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\" aria-hidden=\"true\">\n {{ sectionHeaderVisual.text }}\n </span>\n @if (sectionHeaderVisual.ariaLabel) {\n <span class=\"section-title-avatar-sr-only\">{{ sectionHeaderVisual.ariaLabel }}</span>\n }\n }\n @if (sectionHeaderVisual.kind === 'placeholder') {\n <span class=\"section-title-avatar section-title-avatar-placeholder\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\" aria-hidden=\"true\">\n @if (sectionHeaderVisual.icon) {\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"sectionHeaderVisual.icon\"></mat-icon>\n }\n @if (sectionHeaderVisual.text) {\n <span>{{ sectionHeaderVisual.text }}</span>\n }\n </span>\n @if (sectionHeaderVisual.ariaLabel) {\n <span class=\"section-title-avatar-sr-only\">{{ sectionHeaderVisual.ariaLabel }}</span>\n }\n }\n {{ getSectionTitle(section) }}\n @if (enableCustomization) {\n <button type=\"button\" class=\"inline-edit-btn\" mat-icon-button (click)=\"openSectionEditor(section, 'title')\"\n aria-label=\"Editar t\u00EDtulo da se\u00E7\u00E3o\" matTooltip=\"Editar t\u00EDtulo\">\n <mat-icon>edit</mat-icon>\n </button>\n }\n </h3>\n }\n @if (getSectionDescription(section)) {\n <p class=\"section-description\" [class.body-large]=\"getSectionDescriptionStyle(section) === 'bodyLarge'\"\n [class.body-medium]=\"getSectionDescriptionStyle(section) === 'bodyMedium'\"\n [class.body-small]=\"getSectionDescriptionStyle(section) === 'bodySmall'\"\n [style.marginBottom.px]=\"getSectionDescriptionGapBottom(section) ?? 8\" [style.color]=\"getSectionDescriptionColor(section) || null\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n {{ getSectionDescription(section) }}\n @if (enableCustomization) {\n <button type=\"button\" class=\"inline-edit-btn\" mat-icon-button\n (click)=\"openSectionEditor(section, 'description')\" aria-label=\"Editar descri\u00E7\u00E3o da se\u00E7\u00E3o\"\n matTooltip=\"Editar descri\u00E7\u00E3o\">\n <mat-icon>edit</mat-icon>\n </button>\n }\n </p>\n }\n </div>\n @if (getSectionHeaderActions(section).length) {\n <div class=\"section-heading-actions\" [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n @for (action of getSectionHeaderActions(section); track action.id) {\n <button\n type=\"button\"\n class=\"section-heading-action-btn\"\n mat-icon-button\n [color]=\"getSectionHeaderActionColor(action)\"\n [disabled]=\"isSectionHeaderActionDisabled(action)\"\n [matTooltip]=\"getSectionHeaderActionTooltip(action)\"\n [attr.aria-label]=\"action.label\"\n [attr.aria-busy]=\"action.loading ? 'true' : null\"\n [ngClass]=\"getSectionHeaderActionNgClass(action)\"\n [ngStyle]=\"getSectionHeaderActionStyles(action)\"\n (click)=\"onSectionHeaderActionClick(section, action, $event)\"\n >\n @if (action.loading) {\n <mat-progress-spinner diameter=\"16\" mode=\"indeterminate\"></mat-progress-spinner>\n <span class=\"section-heading-action-sr-only\">{{ getSectionHeaderActionLoadingLabel(action) }}</span>\n } @else {\n <mat-icon [praxisIcon]=\"action.icon\"></mat-icon>\n }\n </button>\n }\n </div>\n }\n @if (isSectionCollapsible(section)) {\n <button type=\"button\" class=\"section-collapse-btn\" mat-icon-button\n (click)=\"toggleSectionCollapse($event, section)\" [attr.aria-expanded]=\"!isSectionCollapsed(section)\"\n [attr.aria-controls]=\"sectionPanelId(section, sectionIndex)\"\n [attr.aria-label]=\"isSectionCollapsed(section) ? 'Expandir se\u00E7\u00E3o' : 'Recolher se\u00E7\u00E3o'\">\n <mat-icon [praxisIcon]=\"isSectionCollapsed(section) ? 'expand_more' : 'expand_less'\"></mat-icon>\n </button>\n }\n </div>\n\n <div class=\"section-body\" [class.collapsed]=\"isSectionCollapsed(section)\"\n [attr.id]=\"sectionPanelId(section, sectionIndex)\"\n [attr.aria-labelledby]=\"getSectionTitle(section) ? sectionPanelId(section, sectionIndex) + '-title' : null\">\n @if (!isSectionCollapsed(section)) {\n @for (row of section.rows; track (row.id ?? $index); let rowIndex = $index) {\n @if (isRowVisible(row)) {\n <div class=\"row-drop-wrapper\" [attr.data-section-id]=\"section.id\">\n <div #rowEl class=\"form-row grid-12 canvas-element\" data-canvas-type=\"row\" [attr.data-row-index]=\"rowIndex\"\n [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\" [style.--pfx-grid-gap.px]=\"getRowGap(row)\"\n [style.--pfx-field-gap.px]=\"getRowRowGap(row)\"\n [style.--pfx-mount-index]=\"rowIndex\"\n [style.marginBottom.px]=\"rowIndex < section.rows.length - 1 ? (getRowRowGap(row) ?? null) : null\"\n [ngClass]=\"getRowClasses(row)\" [ngStyle]=\"getRowStyles(row)\"\n (mouseenter)=\"onElementMouseEnter($event, 'row', row, rowEl)\" (mouseleave)=\"onElementMouseLeave($event)\"\n (click)=\"onElementClick($event, 'row', row, rowEl)\" [class.selected]=\"selectedElement?.domElement === rowEl\"\n [class.hovered]=\"hoveredElement?.domElement === rowEl && selectedElement?.domElement !== rowEl\">\n @for (column of row.columns; track (column.id ?? $index); let colIndex = $index) {\n @if (isColumnVisible(column)) {\n <div class=\"column-drop-wrapper\" [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\">\n <div #colEl class=\"form-column canvas-element\" [ngClass]=\"getColumnClasses(column)\"\n [style.padding.px]=\"getColumnPadding(column)\" [style.--pfx-field-gap.px]=\"getRowRowGap(row)\"\n [ngStyle]=\"getColumnStyles(column)\" [attr.data-testid]=\"column.testId || null\"\n [attr.data-row-gap]=\"getRowRowGap(row)\" data-canvas-type=\"column\" [attr.data-column-index]=\"colIndex\"\n [attr.data-row-index]=\"rowIndex\" [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\"\n [attr.data-column-id]=\"column.id\" (mouseenter)=\"onElementMouseEnter($event, 'column', column, colEl)\"\n (mouseleave)=\"onElementMouseLeave($event)\" (click)=\"onElementClick($event, 'column', column, colEl)\"\n [class.selected]=\"selectedElement?.domElement === colEl\"\n [class.hovered]=\"hoveredElement?.domElement === colEl && selectedElement?.domElement !== colEl\">\n <ng-container dynamicFieldLoader [fields]=\"getColumnFields(column)\" [formGroup]=\"form\"\n [readonlyMode]=\"readonlyModeGlobal === null ? null : readonlyModeGlobal\"\n [disabledMode]=\"disabledModeGlobal === null ? null : disabledModeGlobal\"\n [presentationMode]=\"presentationForLoader\" [visible]=\"visibleGlobal === null ? null : visibleGlobal\"\n [canvasMode]=\"enableCustomization\" (canvasMouseEnter)=\"onFieldMouseEnter($event)\"\n (canvasMouseLeave)=\"onFieldMouseLeave($event)\" (canvasClick)=\"onFieldClick($event)\"\n (renderError)=\"onFieldRenderError($event)\">\n </ng-container>\n </div>\n </div>\n } }\n </div>\n </div>\n }\n }\n } @else {\n <div class=\"section-collapsed-placeholder\">\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'unfold_more'\"></mat-icon>\n <span>{{ getSectionCollapsedSummary(section) }}</span>\n </div>\n }\n @if (last && beforeActionsPlacement === 'insideLastSection' && formBlocksBeforeActions.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before-actions\" data-editorial-placement=\"beforeActions\">\n @for (block of formBlocksBeforeActions; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('beforeActions', $event)\">\n </ng-container>\n }\n </section>\n }\n @if (actionPlacement === 'insideLastSection' && last && !(effectivePresentation\n || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"insideLastSection\" [actions]=\"config.actions\"\n [isSubmitting]=\"submitting\" [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\"\n [actionOverrides]=\"actionRuleProps\" [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n </div>\n <!-- Overlay de bloqueio durante submiss\u00E3o -->\n @if (submitting) {\n <div class=\"form-blocking-overlay\" aria-live=\"polite\">\n <mat-progress-spinner diameter=\"40\" color=\"primary\"></mat-progress-spinner>\n <p>{{ config.messages?.loading?.submit || 'Salvando...' }}</p>\n </div>\n }\n </div>\n\n @if (enableCustomization && selectedElement?.domElement === sectionEl) {\n <div class=\"add-section-container\">\n <div class=\"add-section-line\"></div>\n <button mat-fab color=\"primary\" aria-label=\"Adicionar nova se\u00E7\u00E3o\" (click)=\"addNewSectionAfter(sectionIndex)\"\n matTooltip=\"Adicionar nova se\u00E7\u00E3o aqui\">\n <mat-icon [praxisIcon]=\"'add'\"></mat-icon>\n </button>\n <div class=\"add-section-line\"></div>\n </div>\n }\n }\n </div>\n }\n\n @if (beforeActionsPlacement !== 'insideLastSection' && formBlocksBeforeActions.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before-actions\" data-editorial-placement=\"beforeActions\">\n @for (block of formBlocksBeforeActions; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('beforeActions', $event)\">\n </ng-container>\n }\n </section>\n }\n\n @if (actionPlacement === 'afterSections' && !(effectivePresentation || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"afterSections\" [actions]=\"config.actions\" [isSubmitting]=\"submitting\"\n [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\"\n [actionOverrides]=\"actionRuleProps\" [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n\n @if (formBlocksAfter.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-after\" data-editorial-placement=\"after\">\n @for (block of formBlocksAfter; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('after', $event)\">\n </ng-container>\n }\n </section>\n }\n</form>\n@if (!enableCustomization && mode === 'view') {\n<div class=\"ai-floating-assistant\">\n <praxis-ai-assistant [adapter]=\"aiAdapter\"></praxis-ai-assistant>\n</div>\n}\n}\n", styles: ["@charset \"UTF-8\";.span-xs-1{grid-column:span 1}.span-xs-2{grid-column:span 2}.span-xs-3{grid-column:span 3}.span-xs-4{grid-column:span 4}.span-xs-5{grid-column:span 5}.span-xs-6{grid-column:span 6}.span-xs-7{grid-column:span 7}.span-xs-8{grid-column:span 8}.span-xs-9{grid-column:span 9}.span-xs-10{grid-column:span 10}.span-xs-11{grid-column:span 11}.span-xs-12{grid-column:span 12}.offset-xs-0{margin-left:0%}.offset-xs-1{margin-left:calc(1 / 12 * 100%)}.offset-xs-2{margin-left:calc(2 / 12 * 100%)}.offset-xs-3{margin-left:25%}.offset-xs-4{margin-left:calc(4 / 12 * 100%)}.offset-xs-5{margin-left:calc(5 / 12 * 100%)}.offset-xs-6{margin-left:50%}.offset-xs-7{margin-left:calc(7 / 12 * 100%)}.offset-xs-8{margin-left:calc(8 / 12 * 100%)}.offset-xs-9{margin-left:75%}.offset-xs-10{margin-left:calc(10 / 12 * 100%)}.offset-xs-11{margin-left:calc(11 / 12 * 100%)}.order-xs--12{order:-12}.order-xs--11{order:-11}.order-xs--10{order:-10}.order-xs--9{order:-9}.order-xs--8{order:-8}.order-xs--7{order:-7}.order-xs--6{order:-6}.order-xs--5{order:-5}.order-xs--4{order:-4}.order-xs--3{order:-3}.order-xs--2{order:-2}.order-xs--1{order:-1}.order-xs-0{order:0}.order-xs-1{order:1}.order-xs-2{order:2}.order-xs-3{order:3}.order-xs-4{order:4}.order-xs-5{order:5}.order-xs-6{order:6}.order-xs-7{order:7}.order-xs-8{order:8}.order-xs-9{order:9}.order-xs-10{order:10}.order-xs-11{order:11}.order-xs-12{order:12}.hidden-xs{display:none}@media(min-width:600px){.span-sm-1{grid-column:span 1}.span-sm-2{grid-column:span 2}.span-sm-3{grid-column:span 3}.span-sm-4{grid-column:span 4}.span-sm-5{grid-column:span 5}.span-sm-6{grid-column:span 6}.span-sm-7{grid-column:span 7}.span-sm-8{grid-column:span 8}.span-sm-9{grid-column:span 9}.span-sm-10{grid-column:span 10}.span-sm-11{grid-column:span 11}.span-sm-12{grid-column:span 12}.offset-sm-0{margin-left:0%}.offset-sm-1{margin-left:calc(1 / 12 * 100%)}.offset-sm-2{margin-left:calc(2 / 12 * 100%)}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:calc(4 / 12 * 100%)}.offset-sm-5{margin-left:calc(5 / 12 * 100%)}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:calc(7 / 12 * 100%)}.offset-sm-8{margin-left:calc(8 / 12 * 100%)}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:calc(10 / 12 * 100%)}.offset-sm-11{margin-left:calc(11 / 12 * 100%)}.order-sm--12{order:-12}.order-sm--11{order:-11}.order-sm--10{order:-10}.order-sm--9{order:-9}.order-sm--8{order:-8}.order-sm--7{order:-7}.order-sm--6{order:-6}.order-sm--5{order:-5}.order-sm--4{order:-4}.order-sm--3{order:-3}.order-sm--2{order:-2}.order-sm--1{order:-1}.order-sm-0{order:0}.order-sm-1{order:1}.order-sm-2{order:2}.order-sm-3{order:3}.order-sm-4{order:4}.order-sm-5{order:5}.order-sm-6{order:6}.order-sm-7{order:7}.order-sm-8{order:8}.order-sm-9{order:9}.order-sm-10{order:10}.order-sm-11{order:11}.order-sm-12{order:12}.hidden-sm{display:none}}@media(min-width:900px){.span-md-1{grid-column:span 1}.span-md-2{grid-column:span 2}.span-md-3{grid-column:span 3}.span-md-4{grid-column:span 4}.span-md-5{grid-column:span 5}.span-md-6{grid-column:span 6}.span-md-7{grid-column:span 7}.span-md-8{grid-column:span 8}.span-md-9{grid-column:span 9}.span-md-10{grid-column:span 10}.span-md-11{grid-column:span 11}.span-md-12{grid-column:span 12}.offset-md-0{margin-left:0%}.offset-md-1{margin-left:calc(1 / 12 * 100%)}.offset-md-2{margin-left:calc(2 / 12 * 100%)}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:calc(4 / 12 * 100%)}.offset-md-5{margin-left:calc(5 / 12 * 100%)}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:calc(7 / 12 * 100%)}.offset-md-8{margin-left:calc(8 / 12 * 100%)}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:calc(10 / 12 * 100%)}.offset-md-11{margin-left:calc(11 / 12 * 100%)}.order-md--12{order:-12}.order-md--11{order:-11}.order-md--10{order:-10}.order-md--9{order:-9}.order-md--8{order:-8}.order-md--7{order:-7}.order-md--6{order:-6}.order-md--5{order:-5}.order-md--4{order:-4}.order-md--3{order:-3}.order-md--2{order:-2}.order-md--1{order:-1}.order-md-0{order:0}.order-md-1{order:1}.order-md-2{order:2}.order-md-3{order:3}.order-md-4{order:4}.order-md-5{order:5}.order-md-6{order:6}.order-md-7{order:7}.order-md-8{order:8}.order-md-9{order:9}.order-md-10{order:10}.order-md-11{order:11}.order-md-12{order:12}.hidden-md{display:none}}@media(min-width:1200px){.span-lg-1{grid-column:span 1}.span-lg-2{grid-column:span 2}.span-lg-3{grid-column:span 3}.span-lg-4{grid-column:span 4}.span-lg-5{grid-column:span 5}.span-lg-6{grid-column:span 6}.span-lg-7{grid-column:span 7}.span-lg-8{grid-column:span 8}.span-lg-9{grid-column:span 9}.span-lg-10{grid-column:span 10}.span-lg-11{grid-column:span 11}.span-lg-12{grid-column:span 12}.offset-lg-0{margin-left:0%}.offset-lg-1{margin-left:calc(1 / 12 * 100%)}.offset-lg-2{margin-left:calc(2 / 12 * 100%)}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:calc(4 / 12 * 100%)}.offset-lg-5{margin-left:calc(5 / 12 * 100%)}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:calc(7 / 12 * 100%)}.offset-lg-8{margin-left:calc(8 / 12 * 100%)}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:calc(10 / 12 * 100%)}.offset-lg-11{margin-left:calc(11 / 12 * 100%)}.order-lg--12{order:-12}.order-lg--11{order:-11}.order-lg--10{order:-10}.order-lg--9{order:-9}.order-lg--8{order:-8}.order-lg--7{order:-7}.order-lg--6{order:-6}.order-lg--5{order:-5}.order-lg--4{order:-4}.order-lg--3{order:-3}.order-lg--2{order:-2}.order-lg--1{order:-1}.order-lg-0{order:0}.order-lg-1{order:1}.order-lg-2{order:2}.order-lg-3{order:3}.order-lg-4{order:4}.order-lg-5{order:5}.order-lg-6{order:6}.order-lg-7{order:7}.order-lg-8{order:8}.order-lg-9{order:9}.order-lg-10{order:10}.order-lg-11{order:11}.order-lg-12{order:12}.hidden-lg{display:none}}@media(min-width:1536px){.span-xl-1{grid-column:span 1}.span-xl-2{grid-column:span 2}.span-xl-3{grid-column:span 3}.span-xl-4{grid-column:span 4}.span-xl-5{grid-column:span 5}.span-xl-6{grid-column:span 6}.span-xl-7{grid-column:span 7}.span-xl-8{grid-column:span 8}.span-xl-9{grid-column:span 9}.span-xl-10{grid-column:span 10}.span-xl-11{grid-column:span 11}.span-xl-12{grid-column:span 12}.offset-xl-0{margin-left:0%}.offset-xl-1{margin-left:calc(1 / 12 * 100%)}.offset-xl-2{margin-left:calc(2 / 12 * 100%)}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:calc(4 / 12 * 100%)}.offset-xl-5{margin-left:calc(5 / 12 * 100%)}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:calc(7 / 12 * 100%)}.offset-xl-8{margin-left:calc(8 / 12 * 100%)}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:calc(10 / 12 * 100%)}.offset-xl-11{margin-left:calc(11 / 12 * 100%)}.order-xl--12{order:-12}.order-xl--11{order:-11}.order-xl--10{order:-10}.order-xl--9{order:-9}.order-xl--8{order:-8}.order-xl--7{order:-7}.order-xl--6{order:-6}.order-xl--5{order:-5}.order-xl--4{order:-4}.order-xl--3{order:-3}.order-xl--2{order:-2}.order-xl--1{order:-1}.order-xl-0{order:0}.order-xl-1{order:1}.order-xl-2{order:2}.order-xl-3{order:3}.order-xl-4{order:4}.order-xl-5{order:5}.order-xl-6{order:6}.order-xl-7{order:7}.order-xl-8{order:8}.order-xl-9{order:9}.order-xl-10{order:10}.order-xl-11{order:11}.order-xl-12{order:12}.hidden-xl{display:none}}.canvas-mode-enabled{--canvas-hit: 14px}.canvas-mode-enabled .canvas-element{position:relative;z-index:0;border-radius:8px;outline:2px solid transparent;outline-offset:2px;transition:outline-color .2s ease,outline-style .2s ease}.canvas-mode-enabled .canvas-element:before{content:\"\";position:absolute;inset:calc(-1 * var(--canvas-hit));pointer-events:none;border-radius:inherit;background:transparent}.canvas-mode-enabled .canvas-element[data-canvas-type=section]{--outline-color: var(--md-sys-color-primary)}.canvas-mode-enabled .canvas-element[data-canvas-type=row]{--outline-color: var(--md-sys-color-secondary)}.canvas-mode-enabled .canvas-element[data-canvas-type=column],.canvas-mode-enabled .canvas-element[data-canvas-type=field]{--outline-color: var(--md-sys-color-tertiary)}.canvas-mode-enabled .canvas-element[data-canvas-type=actions]{--outline-color: var(--md-sys-color-primary)}.canvas-mode-enabled .canvas-element.hovered:not(.selected){outline-color:var(--outline-color, var(--md-sys-color-primary));outline-style:dashed}.canvas-mode-enabled .canvas-element.selected{outline-color:var(--outline-color, var(--md-sys-color-primary));outline-style:solid;box-shadow:0 0 0 2px var(--outline-color, var(--md-sys-color-primary))}.canvas-mode-enabled .canvas-element.hovered{z-index:var(--praxis-layer-authoring-hover, 300)}.canvas-mode-enabled .canvas-element.selected{z-index:var(--praxis-layer-authoring-selected, 320)}.section-drop-wrapper,.row-drop-wrapper,.column-drop-wrapper{display:contents}.add-section-container{display:flex;align-items:center;justify-content:center;padding:.5rem 0;margin:-.5rem 0;position:relative;z-index:var(--praxis-layer-authoring-insert, 280)}.add-section-container .add-section-line{flex-grow:1;height:1px;background:repeating-linear-gradient(90deg,var(--md-sys-color-outline-variant),var(--md-sys-color-outline-variant) 4px,transparent 4px,transparent 8px)}.add-section-container button{margin:0 1rem;transform:scale(.85)}:host{display:block;position:relative}.form-config-controls{position:sticky;top:10px;margin-left:auto;margin-bottom:10px;display:flex;align-items:center;gap:.35rem;z-index:60;background:color-mix(in srgb,var(--md-sys-color-surface) 92%,transparent);padding:6px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 82%,transparent);border-radius:999px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 10px 22px #0f172a14;min-width:0;justify-content:flex-end;pointer-events:none;opacity:.88;transition:opacity .16s ease,box-shadow .16s ease,border-color .16s ease,transform .16s ease}.form-config-controls>*{pointer-events:auto}.praxis-dynamic-form:hover .form-config-controls,.praxis-dynamic-form:focus-within .form-config-controls{opacity:1;border-color:color-mix(in srgb,var(--md-sys-color-primary) 26%,var(--md-sys-color-outline-variant) 74%);box-shadow:0 14px 28px #0f172a1f;transform:translateY(-1px)}.form-config-controls .mat-icon-button{--mdc-icon-button-state-layer-size: 34px;width:34px;height:34px;color:var(--md-sys-color-on-surface-variant);background:color-mix(in srgb,var(--md-sys-color-surface-container-low) 82%,transparent);border:1px solid transparent}.form-config-controls .mat-icon-button:hover{color:var(--md-sys-color-primary);background:var(--md-sys-color-primary-container);border-color:color-mix(in srgb,var(--md-sys-color-primary) 20%,transparent)}.ai-floating-assistant{position:sticky;right:0;bottom:12px;margin-top:14px;margin-left:auto;width:fit-content;z-index:70;pointer-events:none}.ai-floating-assistant praxis-ai-assistant{pointer-events:auto;display:inline-flex}.ai-floating-assistant .ai-trigger-btn{box-shadow:0 12px 28px #0f172a24}.config-button{color:var(--md-sys-color-primary)}.form-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center;color:var(--md-sys-color-on-surface);gap:1rem}.form-loading p{margin:0;font-size:.875rem;opacity:.7}.form-error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center;color:var(--md-sys-color-error);gap:1rem;border:1px solid var(--md-sys-color-error);border-radius:8px;background-color:var(--md-sys-color-error-container);margin:1rem;box-shadow:0 12px 30px #7f1d1d1f}.form-error h3{margin:0;color:var(--md-sys-color-on-error-container)}.form-error p{margin:0;color:var(--md-sys-color-on-error-container);opacity:.8}.form-error button{margin-top:.5rem}.pfx-form-info-banner{margin-bottom:14px;padding:12px 14px;border-radius:16px;border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 18%,var(--md-sys-color-outline-variant) 82%);background:color-mix(in srgb,var(--md-sys-color-primary-container) 24%,var(--md-sys-color-surface) 76%);color:var(--md-sys-color-on-surface);display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.pfx-form-info-banner .text{font-size:.92rem;line-height:1.5;font-weight:600}.pfx-form-info-banner .actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.praxis-dynamic-form{display:flex;flex-direction:column;transition:all .3s ease;position:relative;font-family:inherit;font-size:inherit;color:inherit;--pfx-editorial-form-surface: var( --pfx-form-section-surface, var(--md-sys-color-surface-container) );--pfx-editorial-form-surface-muted: var(--md-sys-color-surface-container-low);--pfx-editorial-form-border: var( --pfx-form-stroke, var(--md-sys-color-outline-variant) );--pfx-editorial-form-text: var(--md-sys-color-on-surface);--pfx-editorial-form-text-muted: var(--md-sys-color-on-surface-variant);--pfx-editorial-form-field-surface: color-mix( in srgb, var(--pfx-editorial-form-surface-muted) 76%, var(--pfx-editorial-form-surface) 24% );--pfx-editorial-form-field-outline: color-mix( in srgb, var(--pfx-editorial-form-border) 88%, transparent );--pfx-editorial-form-accent: var(--md-sys-color-primary);--pfx-editorial-form-accent-text: var(--md-sys-color-on-primary);--pfx-editorial-form-radius: var(--pfx-form-section-radius, 8px);--pfx-editorial-form-field-radius: var(--pfx-form-field-radius, 4px);--pfx-editorial-form-border-width: 1px;--pfx-editorial-form-field-border-width: 1px;--pfx-editorial-form-shadow: none;--pfx-form-shell-surface: color-mix( in srgb, var(--pfx-editorial-form-surface) 36%, transparent );--pfx-form-section-surface-flat: color-mix( in srgb, var(--pfx-editorial-form-surface) 78%, var(--pfx-editorial-form-surface-muted) 22% );--pfx-form-section-divider: color-mix( in srgb, var(--pfx-editorial-form-border) 68%, transparent );--pfx-form-label-strong: color-mix( in srgb, var(--pfx-editorial-form-text) 96%, white 4% );--pfx-form-label-muted: color-mix( in srgb, var(--pfx-editorial-form-text-muted) 92%, var(--pfx-editorial-form-text) 8% );--pfx-form-field-surface-rest: color-mix( in srgb, var(--pfx-editorial-form-field-surface) 82%, var(--pfx-editorial-form-surface) 18% );--pfx-form-field-surface-focus: color-mix( in srgb, var(--pfx-editorial-form-accent) 4%, var(--pfx-form-field-surface-rest) 96% );--pfx-form-field-min-height: 48px;--pfx-form-section-padding: clamp(1.1rem, 1.8vw, 1.5rem);--pfx-form-section-gap: 22px;--pfx-form-footer-surface: color-mix( in srgb, var(--pfx-editorial-form-surface) 70%, var(--pfx-editorial-form-surface-muted) 30% );--pfx-form-footer-border: color-mix( in srgb, var(--pfx-editorial-form-border) 76%, transparent )}.praxis-dynamic-form.editorial-visual-context{font-family:var(--editorial-body-font-family, inherit);font-size:var(--editorial-body-size, 1rem);color:var(--editorial-text-primary, var(--md-sys-color-on-surface));--pfx-editorial-form-surface: var( --editorial-surface-primary, var(--pfx-form-section-surface, var(--md-sys-color-surface-container)) );--pfx-editorial-form-surface-muted: var( --editorial-surface-secondary, var(--md-sys-color-surface-container-low) );--pfx-editorial-form-border: var( --editorial-border-color, var(--pfx-form-stroke, var(--md-sys-color-outline-variant)) );--pfx-editorial-form-text: var( --editorial-text-primary, var(--md-sys-color-on-surface) );--pfx-editorial-form-text-muted: var( --editorial-text-secondary, var(--md-sys-color-on-surface-variant) );--pfx-editorial-form-accent: var( --editorial-cta-primary, var(--editorial-accent, var(--md-sys-color-primary)) );--pfx-editorial-form-accent-text: var( --editorial-cta-primary-text, var(--editorial-accent-contrast, var(--md-sys-color-on-primary)) );--pfx-editorial-form-radius: var(--editorial-card-radius, 18px);--pfx-editorial-form-field-radius: var( --editorial-field-radius, var(--editorial-card-radius, 14px) );--pfx-editorial-form-border-width: var(--editorial-card-border-width, 1px);--pfx-editorial-form-field-border-width: var(--editorial-field-border-width, 1px);--pfx-editorial-form-shadow: var(--editorial-card-shadow, none);--md-sys-color-surface: var( --pfx-editorial-form-surface, var(--md-sys-color-surface) );--md-sys-color-surface-container: var( --pfx-editorial-form-surface, var(--md-sys-color-surface-container) );--md-sys-color-surface-container-low: var( --pfx-editorial-form-surface-muted, var(--md-sys-color-surface-container-low) );--md-sys-color-surface-variant: var( --pfx-editorial-form-field-surface, var(--md-sys-color-surface-variant) );--md-sys-color-outline: var( --pfx-editorial-form-field-outline, var(--md-sys-color-outline) );--md-sys-color-outline-variant: var( --pfx-editorial-form-border, var(--md-sys-color-outline-variant) );--md-sys-color-on-surface: var( --pfx-editorial-form-text, var(--md-sys-color-on-surface) );--md-sys-color-on-surface-variant: var( --pfx-editorial-form-text-muted, var(--md-sys-color-on-surface-variant) );--md-sys-color-primary: var( --pfx-editorial-form-accent, var(--md-sys-color-primary) );--md-sys-color-on-primary: var( --pfx-editorial-form-accent-text, var(--md-sys-color-on-primary) );--md-sys-color-on-surface-rgb: var( --editorial-text-primary-rgb, var(--md-sys-color-on-surface-rgb) );--mat-sys-on-surface: var( --pfx-editorial-form-text, var(--mat-sys-on-surface) );--mat-sys-on-surface-variant: var( --pfx-editorial-form-text-muted, var(--mat-sys-on-surface-variant) );--mat-sys-on-surface-rgb: var( --editorial-text-primary-rgb, var(--mat-sys-on-surface-rgb, var(--md-sys-color-on-surface-rgb)) );color:var(--pfx-editorial-form-text);color-scheme:light}.praxis-dynamic-form.presentation-mode .form-row,.praxis-dynamic-form.readonly-mode .form-row{gap:.5rem;margin-bottom:.5rem}.praxis-dynamic-form.presentation-mode .form-section,.praxis-dynamic-form.readonly-mode .form-section{padding:.75rem .875rem}.praxis-dynamic-form.pres-compact .form-row{gap:.35rem;margin-bottom:.35rem}.praxis-dynamic-form.pres-compact .form-section{padding:.5rem .75rem}.praxis-dynamic-form.pres-label-left .praxis-presentation{display:grid;grid-template-columns:var(--pfx-presentation-label-w, 220px) 1fr;align-items:baseline;column-gap:10px}.praxis-dynamic-form.pres-label-left .praxis-presentation__label{text-align:right;margin-bottom:0}.form-section{border:1px solid var(--pfx-form-section-divider);border-radius:var(--pfx-editorial-form-radius);padding:var(--pfx-form-section-padding);background:var(--pfx-form-section-surface-flat);box-shadow:none;transition:all .2s ease;position:relative}.praxis-dynamic-form.editorial-visual-context .form-section{border:var(--pfx-editorial-form-border-width) solid var(--pfx-editorial-form-border)!important;background:var(--pfx-editorial-form-surface)!important;box-shadow:var(--editorial-card-shadow, none)}.praxis-dynamic-form.editorial-visual-context .form-section.section-appearance-step{background-color:var(--pfx-editorial-form-surface)!important;background-image:linear-gradient(180deg,color-mix(in srgb,var(--editorial-accent, var(--md-sys-color-primary)) 6%,transparent) 0%,transparent 132px)!important;background-repeat:no-repeat!important}.section-drop-wrapper>.form-section{margin-bottom:var(--pfx-section-gap, 20px)}.section-drop-wrapper:last-of-type>.form-section{margin-bottom:0}.praxis-dynamic-form>praxis-form-actions[data-actions-placement=afterSections] .form-actions{margin-top:var(--pfx-actions-gap-top, var(--pfx-section-gap, 20px))}.section-title{margin:0 0 var(--pfx-section-title-mb, 12px) 0;font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));font-size:var(--editorial-step-title-size, 1.12rem);font-weight:700;color:var(--pfx-form-label-strong)}.section-heading{display:flex;align-items:flex-start;gap:12px;margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--pfx-form-section-divider)}.section-heading.align-center{flex-direction:column;align-items:center;text-align:center}.section-heading.align-center .section-heading-text{display:grid;justify-items:center}.section-step-label{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;margin:0 0 8px;border-radius:999px;background:color-mix(in srgb,var(--pfx-editorial-form-accent) 10%,transparent);color:color-mix(in srgb,var(--pfx-editorial-form-accent) 84%,var(--pfx-form-label-strong) 16%);font-size:.72rem;font-weight:800;font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));letter-spacing:.08em;text-transform:uppercase}.section-heading-text{flex:1 1 auto;min-width:0}.section-heading-actions{display:inline-flex;align-items:center;align-self:flex-start;flex-wrap:wrap;gap:4px;margin-left:auto}.section-heading-actions.align-center{align-self:center;margin-left:0}.section-heading-action-btn{color:var(--pfx-form-label-muted)}.section-heading-action-btn .mat-mdc-progress-spinner,.section-heading-action-btn mat-progress-spinner{--mdc-circular-progress-active-indicator-color: currentColor}.section-heading-action-btn.loading{opacity:.72;pointer-events:none}.section-heading-action-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.section-collapse-btn{margin-left:4px;color:var(--pfx-form-label-muted)}.section-title.title-large{font:var(--mdc-typography-title-large, 500 22px/28px system-ui)}.section-title.title-medium{font:var(--mdc-typography-title-medium, 500 16px/24px system-ui)}.section-title.title-small{font:var(--mdc-typography-title-small, 500 14px/20px system-ui)}.section-title.headline-small{font:var(--mdc-typography-headline-small, 600 24px/32px system-ui)}.section-title.title-large,.section-title.title-medium,.section-title.title-small,.section-title.headline-small{font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));font-weight:var(--editorial-title-weight, 600)}.section-description{margin:0;font-family:var(--editorial-body-font-family, inherit);font-size:.93rem;color:var(--pfx-form-label-muted);line-height:1.6}.section-description.body-large{font:var(--mdc-typography-body-large, 400 16px/24px system-ui)}.section-description.body-medium{font:var(--mdc-typography-body-medium, 400 14px/20px system-ui)}.section-description.body-small{font:var(--mdc-typography-body-small, 400 12px/16px system-ui)}.section-description.body-large,.section-description.body-medium,.section-description.body-small{font-family:var(--editorial-body-font-family, inherit);font-weight:var(--editorial-body-weight, 400)}.section-title.align-center,.section-description.align-center,.section-step-label.align-center{text-align:center}.form-section.section-appearance-plain{border-color:transparent;border-radius:0;padding:0;background:transparent}.form-section.section-appearance-plain .section-heading{margin-bottom:14px}.form-section.section-appearance-step{border-radius:var(--pfx-editorial-form-radius);padding:var(--pfx-form-section-padding);background:var(--pfx-form-section-surface-flat);border-color:var(--pfx-form-section-divider);box-shadow:none}.praxis-dynamic-form.editorial-visual-context .form-section.section-appearance-step{border-radius:var(--editorial-card-radius, 20px);box-shadow:none}.form-section.section-appearance-step .section-heading{margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid var(--pfx-form-section-divider)}.form-section.section-appearance-step .section-title{font:var(--mdc-typography-title-large, 700 22px/28px system-ui);color:var(--pfx-form-label-strong);margin-bottom:8px}.form-section.section-appearance-step .section-description{color:var(--pfx-form-label-muted);max-width:60ch}.form-section.section-appearance-step .section-step-label{min-height:24px;padding:0 10px;margin-bottom:10px;box-shadow:none}.form-section.section-appearance-step .section-heading.align-center .section-description{max-width:52ch}.form-section.section-appearance-step .section-body{display:grid;gap:8px;padding-top:0}.form-section.section-appearance-step .form-row{margin-bottom:var(--pfx-field-gap, 1rem)}.form-section.section-appearance-step .form-column{gap:var(--pfx-field-gap, 12px)}.form-section .form-editorial-blocks{display:grid;gap:16px}.form-section .form-editorial-blocks[data-editorial-placement=beforeActions]{margin-top:24px;padding-top:18px;border-top:1px solid var(--pfx-form-section-divider)}.form-section.section-appearance-step .form-editorial-blocks[data-editorial-placement=beforeActions]{gap:18px}.form-section.section-appearance-step .form-editorial-blocks[data-editorial-placement=beforeActions]>*+*{margin-top:2px}.praxis-dynamic-form>praxis-form-actions[data-actions-placement=afterSections] .form-actions{margin-top:18px;padding-top:0}.praxis-dynamic-form>.form-editorial-blocks[data-editorial-placement=after]{margin-top:6px}:host-context(.mdc-theme-dark) .form-section.section-appearance-step,:host-context(.theme-dark) .form-section.section-appearance-step{border-color:color-mix(in srgb,var(--pfx-editorial-form-border) 82%,transparent);box-shadow:none}:host-context(.mdc-theme-dark) .form-section.section-appearance-step .section-title,:host-context(.theme-dark) .form-section.section-appearance-step .section-title{color:color-mix(in srgb,var(--pfx-editorial-form-text) 96%,white)}:host-context(.mdc-theme-dark) .form-section.section-appearance-step .section-description,:host-context(.theme-dark) .form-section.section-appearance-step .section-description{color:color-mix(in srgb,var(--pfx-editorial-form-text-muted) 86%,var(--pfx-editorial-form-text) 14%)}:host-context(.mdc-theme-dark) .section-step-label,:host-context(.theme-dark) .section-step-label{background:color-mix(in srgb,var(--md-sys-color-primary-container) 54%,transparent);color:color-mix(in srgb,var(--md-sys-color-primary) 88%,white)}:host-context(.mdc-theme-dark) .form-section .form-editorial-blocks[data-editorial-placement=beforeActions],:host-context(.theme-dark) .form-section .form-editorial-blocks[data-editorial-placement=beforeActions]{border-top-color:color-mix(in srgb,var(--md-sys-color-outline-variant) 90%,transparent)}.inline-edit-btn{margin-left:6px;vertical-align:middle;--mdc-icon-button-size: 28px;--mdc-icon-button-icon-size: 16px}.inline-edit-btn mat-icon{font-size:16px;width:16px;height:16px}.section-body.collapsed{border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-low);border-radius:6px;padding:8px 10px}.section-collapsed-placeholder{display:flex;align-items:center;gap:8px;color:var(--md-sys-color-on-surface-variant);font-size:.95rem}.section-collapsed-placeholder mat-icon{font-size:20px;width:20px;height:20px}.form-row{display:flex;gap:1.1rem;margin-bottom:var(--pfx-field-gap, 1.1rem);transition:all .2s ease;border-radius:6px;position:relative}.praxis-dynamic-form.pfx-mounting .form-row{opacity:0;transform:translateY(var(--pdx-form-mount-offset, 6px));animation:pdxFormMount var(--pdx-form-mount-duration, .16s) ease-out both;animation-delay:calc(var(--pfx-mount-index, 0) * var(--pdx-form-mount-stagger, 20ms))}@media(prefers-reduced-motion:reduce){.praxis-dynamic-form.pfx-mounting .form-row{animation:none;opacity:1;transform:none}}@keyframes pdxFormMount{to{opacity:1;transform:translateY(0)}}.praxis-dynamic-form .mat-mdc-form-field{width:100%;margin-bottom:var(--pfx-field-gap, 10px);font-family:inherit;--mdc-filled-text-field-container-color: var(--pfx-form-field-surface-rest);--mdc-filled-text-field-focus-active-indicator-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-active-indicator-color: var(--pfx-editorial-form-field-outline);--mdc-filled-text-field-hover-active-indicator-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-focus-label-text-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-label-text-color: var(--pfx-form-label-muted);--mdc-filled-text-field-input-text-color: var(--pfx-editorial-form-text);--mdc-filled-text-field-caret-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-input-text-placeholder-color: color-mix( in srgb, var(--pfx-editorial-form-text-muted) 82%, transparent );--mdc-outlined-text-field-outline-color: var(--pfx-editorial-form-field-outline);--mdc-outlined-text-field-hover-outline-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-focus-outline-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-focus-label-text-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-label-text-color: var(--pfx-form-label-muted);--mdc-outlined-text-field-input-text-color: var(--pfx-editorial-form-text);--mdc-filled-text-field-container-shape: var(--pfx-editorial-form-field-radius);--mdc-outlined-text-field-container-shape: var(--pfx-editorial-form-field-radius);--mdc-filled-text-field-active-indicator-height: var(--pfx-editorial-form-field-border-width);--mdc-filled-text-field-focus-active-indicator-height: var(--pfx-editorial-form-field-border-width);--mdc-outlined-text-field-outline-width: var(--pfx-editorial-form-field-border-width);--mdc-outlined-text-field-focus-outline-width: var(--pfx-editorial-form-field-border-width);--mat-select-enabled-trigger-text-color: var(--pfx-editorial-form-text);--mat-select-enabled-arrow-color: var(--pfx-form-label-muted);--mat-form-field-enabled-select-arrow-color: var(--pfx-form-label-muted);--mat-form-field-focus-select-arrow-color: var(--pfx-editorial-form-accent);--mat-form-field-hover-state-layer-opacity: 0;--mat-form-field-focus-state-layer-opacity: 0}.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field{font-family:var(--editorial-body-font-family, inherit)}.praxis-dynamic-form .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mdc-text-field{background:var(--pfx-form-field-surface-rest);border-radius:var(--pfx-editorial-form-field-radius);min-height:var(--pfx-form-field-min-height);transition:background-color .16s ease,box-shadow .16s ease,border-color .16s ease}.praxis-dynamic-form.editorial-visual-context .mat-mdc-text-field-wrapper,.praxis-dynamic-form.editorial-visual-context .mdc-text-field,.praxis-dynamic-form.editorial-visual-context .mdc-text-field--filled,.praxis-dynamic-form.editorial-visual-context .mdc-text-field--outlined{background-color:var(--pfx-form-field-surface-rest)!important;background:var(--pfx-form-field-surface-rest)!important}.praxis-dynamic-form .mat-mdc-form-field .mdc-floating-label,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-hint,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-error,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-required-marker,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-select-arrow,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-select-placeholder,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-icon-suffix,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-icon-prefix{color:var(--pfx-form-label-muted)}.praxis-dynamic-form .mat-mdc-input-element,.praxis-dynamic-form .mat-mdc-select-value-text,.praxis-dynamic-form .mat-mdc-form-field-infix,.praxis-dynamic-form .mat-mdc-select-min-line{color:var(--pfx-editorial-form-text)}.praxis-dynamic-form .mat-mdc-form-field:hover .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mat-mdc-form-field:hover .mdc-text-field,.praxis-dynamic-form .mat-mdc-form-field.mat-focused .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mat-mdc-form-field.mat-focused .mdc-text-field{background:var(--pfx-form-field-surface-focus)}.praxis-dynamic-form.editorial-visual-context .mat-mdc-input-element,.praxis-dynamic-form.editorial-visual-context .mat-mdc-select-value-text,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field-infix,.praxis-dynamic-form.editorial-visual-context .mat-mdc-select-min-line,.praxis-dynamic-form.editorial-visual-context .mdc-text-field__input{color:var(--pfx-editorial-form-text)!important;-webkit-text-fill-color:var(--pfx-editorial-form-text)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-hint,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-error,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-required-marker,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-select-arrow,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-select-placeholder,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-icon-suffix,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-icon-prefix{color:var(--pfx-editorial-form-text-muted)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mdc-text-field__input::placeholder{color:color-mix(in srgb,var(--pfx-editorial-form-text) 68%,transparent)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-input-element::placeholder,.praxis-dynamic-form.editorial-visual-context textarea.mat-mdc-input-element::placeholder{color:color-mix(in srgb,var(--pfx-editorial-form-text) 58%,transparent)!important}.praxis-dynamic-form .mat-mdc-radio-button,.praxis-dynamic-form .mat-mdc-checkbox,.praxis-dynamic-form .mat-mdc-slide-toggle{--mdc-radio-selected-icon-color: var(--pfx-editorial-form-accent);--mdc-radio-selected-hover-icon-color: var(--pfx-editorial-form-accent);--mdc-radio-selected-focus-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-checkmark-color: var(--pfx-editorial-form-accent-text);--mdc-checkbox-selected-focus-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-hover-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-icon-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-focus-state-layer-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-handle-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-track-color: color-mix(in srgb, var(--pfx-editorial-form-accent) 45%, #fff)}.praxis-dynamic-form [data-field-type=input],.praxis-dynamic-form [data-field-type=textarea],.praxis-dynamic-form [data-field-type=email],.praxis-dynamic-form [data-field-type=password],.praxis-dynamic-form [data-field-type=url],.praxis-dynamic-form [data-field-type=search],.praxis-dynamic-form [data-field-type=phone],.praxis-dynamic-form [data-field-type=numericTextBox],.praxis-dynamic-form [data-field-type=currency],.praxis-dynamic-form [data-field-type=cpfCnpj],.praxis-dynamic-form [data-field-type=date],.praxis-dynamic-form [data-field-type=dateInput],.praxis-dynamic-form [data-field-type=dateRange],.praxis-dynamic-form [data-field-type=dateTimeLocal],.praxis-dynamic-form [data-field-type=time],.praxis-dynamic-form [data-field-type=timePicker],.praxis-dynamic-form [data-field-type=timeRange],.praxis-dynamic-form [data-field-type=month],.praxis-dynamic-form [data-field-type=week],.praxis-dynamic-form [data-field-type=yearInput],.praxis-dynamic-form [data-field-type=select],.praxis-dynamic-form [data-field-type=multi-select],.praxis-dynamic-form [data-field-type=searchable-select],.praxis-dynamic-form [data-field-type=async-select],.praxis-dynamic-form [data-field-type=autocomplete],.praxis-dynamic-form [data-field-type=tree-select],.praxis-dynamic-form [data-field-type=multi-select-tree],.praxis-dynamic-form [data-field-type=priceRange],.praxis-dynamic-form [data-field-type=file-upload]{display:block;width:100%;min-width:0}.praxis-dynamic-form .mat-mdc-form-field-subscript-wrapper{min-height:var(--pfx-subscript-min-h, 22px)}.form-row:last-child{margin-bottom:0}.form-column{display:grid;align-content:start;gap:var(--pfx-field-gap, 10px);flex:1;min-width:0;transition:all .2s ease;border-radius:4px;position:relative}.form-row.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--pfx-grid-gap, 16px)}.align-start{align-self:flex-start}.align-center{align-self:center}.align-end{align-self:flex-end}.align-stretch{align-self:stretch}.form-blocking-overlay{position:absolute;inset:0;background:transparent;color:var(--md-sys-color-on-surface);backdrop-filter:blur(2px) saturate(103%);-webkit-backdrop-filter:blur(2px) saturate(103%);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;z-index:10;pointer-events:all}@media(max-width:768px){.form-row{flex-direction:column;gap:.5rem}.form-section{padding:1rem}.section-heading{gap:10px;margin-bottom:16px;padding-bottom:14px}}.section-title{display:flex;align-items:center;gap:8px}.section-title .section-title-icon{font-size:1.25em;line-height:1}.section-title-avatar{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px));display:inline-flex;align-items:center;justify-content:center;width:var(--_pfx-form-section-avatar-size);height:var(--_pfx-form-section-avatar-size);border-radius:999px;flex:0 0 var(--_pfx-form-section-avatar-size);overflow:hidden}.section-title-avatar.size-sm{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-sm, 24px)}.section-title-avatar.size-md{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px))}.section-title-avatar.size-lg{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-lg, 40px)}.section-title-avatar-image{object-fit:cover;border:1px solid color-mix(in srgb,var(--pfx-form-section-divider) 72%,transparent);background:var(--pfx-form-section-surface-flat)}.section-title-avatar-text,.section-title-avatar-placeholder{background:color-mix(in srgb,var(--pfx-editorial-form-accent) 14%,var(--pfx-form-section-surface-flat));color:color-mix(in srgb,var(--pfx-editorial-form-accent) 82%,var(--pfx-form-label-strong) 18%);font-size:calc(var(--_pfx-form-section-avatar-size) * .41);font-weight:800;letter-spacing:.04em;text-transform:uppercase}.section-title-avatar-placeholder mat-icon{font-size:calc(var(--_pfx-form-section-avatar-size) * .5625);width:calc(var(--_pfx-form-section-avatar-size) * .5625);height:calc(var(--_pfx-form-section-avatar-size) * .5625);line-height:calc(var(--_pfx-form-section-avatar-size) * .5625)}.section-title-avatar-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.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: "directive", type: DynamicWidgetLoaderDirective, selector: "[dynamicWidgetLoader]", inputs: ["dynamicWidgetLoader", "ownerWidgetKey", "context", "strictValidation", "autoWireOutputs"], outputs: ["widgetEvent", "widgetDiagnostic"], exportAs: ["dynamicWidgetLoader"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.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: "component", type: i4.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i16.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i18.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "component", type: CanvasToolbarComponent, selector: "praxis-canvas-toolbar", inputs: ["selectedElement"], outputs: ["editMetadata", "delete", "moveUp", "moveDown", "selectPath", "requestClose", "toggleReadonly", "toggleRequired", "toggleHidden", "toggleDisabled"] }, { kind: "component", type: PraxisFormActionsComponent, selector: "praxis-form-actions", inputs: ["actions", "editorialVisualContext", "isSubmitting", "formIsValid", "submitError", "formId", "actionOverrides"], outputs: ["action"] }, { kind: "component", type: EmptyStateCardComponent, selector: "praxis-empty-state-card", inputs: ["icon", "title", "description", "primaryAction", "secondaryActions", "inline", "tone"] }, { kind: "component", type: PraxisAiAssistantComponent, selector: "praxis-ai-assistant", inputs: ["adapter", "riskPolicy", "allowManualPatchEdit"] }] });
|
|
11141
11403
|
}
|
|
11142
11404
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: PraxisDynamicForm, decorators: [{
|
|
11143
11405
|
type: Component,
|
|
@@ -11158,21 +11420,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
11158
11420
|
PraxisFormActionsComponent,
|
|
11159
11421
|
EmptyStateCardComponent,
|
|
11160
11422
|
PraxisAiAssistantComponent,
|
|
11161
|
-
], template: "@if (isLoading) {\n<!-- Loading State -->\n<div class=\"form-loading\">\n <mat-progress-spinner diameter=\"40\"></mat-progress-spinner>\n <p>Carregando formul\u00E1rio...</p>\n</div>\n} @else if (initializationStatus === 'error') {\n<!-- Error State -->\n<div class=\"form-error\">\n <mat-icon color=\"warn\" [praxisIcon]=\"'error'\"></mat-icon>\n <h3>{{ getErrorTitle() }}</h3>\n <p>{{ currentErrorMessage }}</p>\n @if (isRecoverable) {\n <button mat-stroked-button (click)=\"retryInitialization()\">\n <mat-icon [praxisIcon]=\"'refresh'\"></mat-icon>\n Tentar Novamente\n </button>\n }\n <button mat-button (click)=\"showDetailedError()\" class=\"show-details\">\n Ver Detalhes T\u00E9cnicos\n </button>\n <!-- Permitir corre\u00E7\u00E3o do resourcePath diretamente do estado de erro -->\n <button mat-flat-button color=\"primary\" (click)=\"openQuickConnect()\" class=\"connect-action\">\n <mat-icon [praxisIcon]=\"'bolt'\"></mat-icon>\n Conectar a recurso\n </button>\n</div>\n} @else if (initializationStatus === 'success') {\n<!-- Inline banner for schema change (only when customization is enabled) -->\n@if (shouldShowOutdatedInline()) {\n<div class=\"pfx-form-info-banner\" role=\"status\" aria-live=\"polite\">\n <div class=\"text\">O schema do servidor mudou. Reconciliar agora?</div>\n <div class=\"actions\">\n <button mat-stroked-button color=\"primary\" (click)=\"openConfigEditor()\">\n <mat-icon [praxisIcon]=\"'sync'\"></mat-icon>\n Reconciliar\n </button>\n <button mat-button (click)=\"onSnoozeOutdated()\">Lembrar depois</button>\n <button mat-button (click)=\"onIgnoreOutdated()\">Ignorar</button>\n </div>\n</div>\n}\n\n<!-- Configuration Controls -->\n@if (shouldShowConfigControls && enableCustomization) {\n<div class=\"form-config-controls\">\n <praxis-ai-assistant [adapter]=\"aiAdapter\"></praxis-ai-assistant>\n <button type=\"button\" mat-icon-button (click)=\"openConfigEditor()\" [disabled]=\"isLoading\" class=\"config-button\"\n [matBadge]=\"schemaOutdated ? '!' : ''\" [matBadgeHidden]=\"!schemaOutdated\" matBadgeColor=\"warn\" matBadgeSize=\"small\"\n matBadgePosition=\"above after\"\n [matTooltip]=\"schemaOutdated ? 'Schema do servidor mudou \u2014 Reconciliar' : 'Configurar formul\u00E1rio'\">\n <mat-icon [praxisIcon]=\"'settings'\"></mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"disconnect()\" matTooltip=\"Desconectar da fonte de dados\"\n [disabled]=\"isLoading\">\n <mat-icon [praxisIcon]=\"'link_off'\"></mat-icon>\n </button>\n</div>\n}\n\n<!-- Form Content -->\n@if (!resourcePath && (!config.sections || config.sections.length === 0)) {\n<praxis-empty-state-card icon=\"link\" [title]=\"'Conecte o formul\u00E1rio \u00E0 fonte de dados'\"\n [description]=\"'Informe a rota do recurso da API para gerar automaticamente os campos do formul\u00E1rio.'\"\n [primaryAction]=\"{ label: 'Conectar \u00E0 fonte de dados', icon: 'bolt', action: openQuickConnect.bind(this) }\"></praxis-empty-state-card>\n}\n<form #formHost (ngSubmit)=\"onSubmit()\" [attr.aria-busy]=\"submitting ? 'true' : null\"\n [attr.aria-label]=\"'Formul\u00E1rio ' + (config.metadata?.version || '')\" [class.canvas-mode-enabled]=\"enableCustomization\"\n [class.presentation-mode]=\"effectivePresentation\" [class.readonly-mode]=\"effectiveReadonly\"\n [class.editorial-visual-context]=\"hasEditorialVisualContext()\"\n [class.pfx-mounting]=\"isMounting\" [formGroup]=\"form\"\n [ngClass]=\"{\n 'pres-compact': presentationVars.compact,\n 'pres-label-left': presentationVars.labelPosition === 'left',\n 'pres-label-above': presentationVars.labelPosition === 'above'\n }\" [style.--pfx-pres-label-align]=\"presentationVars.labelAlign\"\n [style.--pfx-pres-label-size]=\"presentationVars.labelSize\"\n [style.--pfx-pres-label-width]=\"presentationVars.labelWidth\"\n [style.--pfx-pres-row-gap]=\"presentationVars.density === 'compact' ? '6px' : (presentationVars.density === 'cozy' ? '8px' : '10px')\"\n [style.--pfx-pres-row-padding]=\"presentationVars.density === 'compact' ? '2px 0' : (presentationVars.density === 'cozy' ? '6px 0' : '8px 0')\"\n [style.--pfx-pres-value-align]=\"presentationVars.valueAlign\"\n [style.--pfx-pres-value-size]=\"presentationVars.valueSize\"\n [style.--pdx-form-mount-duration]=\"getMountDurationVar()\"\n [style.--pdx-form-mount-offset]=\"getMountOffsetVar()\"\n [style.--pdx-form-mount-stagger]=\"getMountStaggerVar()\"\n class=\"praxis-dynamic-form\">\n <praxis-canvas-toolbar (editMetadata)=\"openSelectedElementEditor()\" (selectPath)=\"onSelectPath($event)\"\n (moveUp)=\"onToolbarMove('up')\" (moveDown)=\"onToolbarMove('down')\" (toggleReadonly)=\"onToolbarToggleReadonly()\"\n (toggleRequired)=\"onToolbarToggleRequired()\" (toggleHidden)=\"onToolbarToggleHidden()\"\n (toggleDisabled)=\"onToolbarToggleDisabled()\" (requestClose)=\"onToolbarRequestClose()\"\n *ngIf=\"enableCustomization && selectedElement\" [selectedElement]=\"selectedElement\"\n [style.transform]=\"toolbarTransform\"></praxis-canvas-toolbar>\n\n @if (formBlocksBefore.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before\" data-editorial-placement=\"before\">\n @for (block of formBlocksBefore; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('before', $event)\">\n </ng-container>\n }\n </section>\n }\n\n @if (actionPlacement === 'top' && !(effectivePresentation || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"top\" [actions]=\"config.actions\" [isSubmitting]=\"submitting\"\n [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\" [actionOverrides]=\"actionRuleProps\"\n [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n\n @for (section of config.sections; track (section.id ?? $index); let sectionIndex = $index;\n let last = $last) {\n <div class=\"section-drop-wrapper\" [attr.data-section-id]=\"section.id\">\n @if (isSectionVisible(section)) {\n <div #sectionEl class=\"form-section canvas-element\" data-canvas-type=\"section\" [attr.data-section-id]=\"section.id\"\n [attr.data-section-index]=\"sectionIndex\" (mouseenter)=\"onElementMouseEnter($event, 'section', section, sectionEl)\"\n (mouseleave)=\"onElementMouseLeave($event)\" (click)=\"onElementClick($event, 'section', section, sectionEl)\"\n [class.selected]=\"selectedElement?.domElement === sectionEl\"\n [class.hovered]=\"hoveredElement?.domElement === sectionEl && selectedElement?.domElement !== sectionEl\"\n [attr.data-section-appearance]=\"getSectionAppearance(section) || null\"\n [style.marginBottom.px]=\"!last ? getSectionGapBottom(section) : null\" [ngClass]=\"getSectionClasses(section)\"\n [ngStyle]=\"getSectionStyles(section)\">\n <div\n class=\"section-heading\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\"\n [class.step-appearance]=\"getSectionAppearance(section) === 'step'\"\n >\n <div class=\"section-heading-text\" [matTooltip]=\"getSectionHeaderTooltip(section) || null\"\n [matTooltipDisabled]=\"!getSectionHeaderTooltip(section)\">\n @if (getSectionStepLabel(section)) {\n <div class=\"section-step-label\" [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n {{ getSectionStepLabel(section) }}\n </div>\n }\n @if (getSectionTitle(section)) {\n <h3 class=\"section-title\" [class.title-large]=\"getSectionTitleStyle(section) === 'titleLarge'\"\n [class.title-medium]=\"getSectionTitleStyle(section) === 'titleMedium'\"\n [class.title-small]=\"getSectionTitleStyle(section) === 'titleSmall'\"\n [class.headline-small]=\"getSectionTitleStyle(section) === 'headlineSmall'\"\n [style.marginBottom.px]=\"getSectionTitleGapBottom(section) ?? 20\" [style.color]=\"getSectionTitleColor(section) || null\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\"\n [attr.id]=\"sectionPanelId(section, sectionIndex) + '-title'\">\n @let sectionHeaderVisual = getSectionHeaderVisual(section);\n @let sectionHeaderAvatarSize = getSectionHeaderAvatarSize(section);\n @if (sectionHeaderVisual.kind === 'icon') {\n <mat-icon class=\"section-title-icon\" aria-hidden=\"true\" [praxisIcon]=\"sectionHeaderVisual.icon\"></mat-icon>\n }\n @if (sectionHeaderVisual.kind === 'image') {\n <img class=\"section-title-avatar section-title-avatar-image\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\"\n [src]=\"sectionHeaderVisual.src\" [alt]=\"sectionHeaderVisual.alt\" />\n }\n @if (sectionHeaderVisual.kind === 'initials') {\n <span class=\"section-title-avatar section-title-avatar-text\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\" aria-hidden=\"true\">\n {{ sectionHeaderVisual.text }}\n </span>\n @if (sectionHeaderVisual.ariaLabel) {\n <span class=\"section-title-avatar-sr-only\">{{ sectionHeaderVisual.ariaLabel }}</span>\n }\n }\n @if (sectionHeaderVisual.kind === 'placeholder') {\n <span class=\"section-title-avatar section-title-avatar-placeholder\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\" aria-hidden=\"true\">\n @if (sectionHeaderVisual.icon) {\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"sectionHeaderVisual.icon\"></mat-icon>\n }\n @if (sectionHeaderVisual.text) {\n <span>{{ sectionHeaderVisual.text }}</span>\n }\n </span>\n @if (sectionHeaderVisual.ariaLabel) {\n <span class=\"section-title-avatar-sr-only\">{{ sectionHeaderVisual.ariaLabel }}</span>\n }\n }\n {{ getSectionTitle(section) }}\n @if (enableCustomization) {\n <button type=\"button\" class=\"inline-edit-btn\" mat-icon-button (click)=\"openSectionEditor(section, 'title')\"\n aria-label=\"Editar t\u00EDtulo da se\u00E7\u00E3o\" matTooltip=\"Editar t\u00EDtulo\">\n <mat-icon>edit</mat-icon>\n </button>\n }\n </h3>\n }\n @if (getSectionDescription(section)) {\n <p class=\"section-description\" [class.body-large]=\"getSectionDescriptionStyle(section) === 'bodyLarge'\"\n [class.body-medium]=\"getSectionDescriptionStyle(section) === 'bodyMedium'\"\n [class.body-small]=\"getSectionDescriptionStyle(section) === 'bodySmall'\"\n [style.marginBottom.px]=\"getSectionDescriptionGapBottom(section) ?? 8\" [style.color]=\"getSectionDescriptionColor(section) || null\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n {{ getSectionDescription(section) }}\n @if (enableCustomization) {\n <button type=\"button\" class=\"inline-edit-btn\" mat-icon-button\n (click)=\"openSectionEditor(section, 'description')\" aria-label=\"Editar descri\u00E7\u00E3o da se\u00E7\u00E3o\"\n matTooltip=\"Editar descri\u00E7\u00E3o\">\n <mat-icon>edit</mat-icon>\n </button>\n }\n </p>\n }\n </div>\n @if (getSectionHeaderActions(section).length) {\n <div class=\"section-heading-actions\" [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n @for (action of getSectionHeaderActions(section); track action.id) {\n <button\n type=\"button\"\n class=\"section-heading-action-btn\"\n mat-icon-button\n [color]=\"getSectionHeaderActionColor(action)\"\n [disabled]=\"isSectionHeaderActionDisabled(action)\"\n [matTooltip]=\"getSectionHeaderActionTooltip(action)\"\n [attr.aria-label]=\"action.label\"\n [attr.aria-busy]=\"action.loading ? 'true' : null\"\n [ngClass]=\"getSectionHeaderActionNgClass(action)\"\n [ngStyle]=\"getSectionHeaderActionStyles(action)\"\n (click)=\"onSectionHeaderActionClick(section, action, $event)\"\n >\n @if (action.loading) {\n <mat-progress-spinner diameter=\"16\" mode=\"indeterminate\"></mat-progress-spinner>\n <span class=\"section-heading-action-sr-only\">{{ getSectionHeaderActionLoadingLabel(action) }}</span>\n } @else {\n <mat-icon [praxisIcon]=\"action.icon\"></mat-icon>\n }\n </button>\n }\n </div>\n }\n @if (isSectionCollapsible(section)) {\n <button type=\"button\" class=\"section-collapse-btn\" mat-icon-button\n (click)=\"toggleSectionCollapse($event, section)\" [attr.aria-expanded]=\"!isSectionCollapsed(section)\"\n [attr.aria-controls]=\"sectionPanelId(section, sectionIndex)\"\n [attr.aria-label]=\"isSectionCollapsed(section) ? 'Expandir se\u00E7\u00E3o' : 'Recolher se\u00E7\u00E3o'\">\n <mat-icon [praxisIcon]=\"isSectionCollapsed(section) ? 'expand_more' : 'expand_less'\"></mat-icon>\n </button>\n }\n </div>\n\n <div class=\"section-body\" [class.collapsed]=\"isSectionCollapsed(section)\"\n [attr.id]=\"sectionPanelId(section, sectionIndex)\"\n [attr.aria-labelledby]=\"getSectionTitle(section) ? sectionPanelId(section, sectionIndex) + '-title' : null\">\n @if (!isSectionCollapsed(section)) {\n @for (row of section.rows; track (row.id ?? $index); let rowIndex = $index) {\n @if (isRowVisible(row)) {\n <div class=\"row-drop-wrapper\" [attr.data-section-id]=\"section.id\">\n <div #rowEl class=\"form-row grid-12 canvas-element\" data-canvas-type=\"row\" [attr.data-row-index]=\"rowIndex\"\n [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\" [style.--pfx-grid-gap.px]=\"getRowGap(row)\"\n [style.--pfx-field-gap.px]=\"getRowRowGap(row)\"\n [style.--pfx-mount-index]=\"rowIndex\"\n [style.marginBottom.px]=\"rowIndex < section.rows.length - 1 ? (getRowRowGap(row) ?? null) : null\"\n [ngClass]=\"getRowClasses(row)\" [ngStyle]=\"getRowStyles(row)\"\n (mouseenter)=\"onElementMouseEnter($event, 'row', row, rowEl)\" (mouseleave)=\"onElementMouseLeave($event)\"\n (click)=\"onElementClick($event, 'row', row, rowEl)\" [class.selected]=\"selectedElement?.domElement === rowEl\"\n [class.hovered]=\"hoveredElement?.domElement === rowEl && selectedElement?.domElement !== rowEl\">\n @for (column of row.columns; track (column.id ?? $index); let colIndex = $index) {\n @if (isColumnVisible(column)) {\n <div class=\"column-drop-wrapper\" [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\">\n <div #colEl class=\"form-column canvas-element\" [ngClass]=\"getColumnClasses(column)\"\n [style.padding.px]=\"getColumnPadding(column)\" [style.--pfx-field-gap.px]=\"getRowRowGap(row)\"\n [ngStyle]=\"getColumnStyles(column)\" [attr.data-testid]=\"column.testId || null\"\n [attr.data-row-gap]=\"getRowRowGap(row)\" data-canvas-type=\"column\" [attr.data-column-index]=\"colIndex\"\n [attr.data-row-index]=\"rowIndex\" [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\"\n [attr.data-column-id]=\"column.id\" (mouseenter)=\"onElementMouseEnter($event, 'column', column, colEl)\"\n (mouseleave)=\"onElementMouseLeave($event)\" (click)=\"onElementClick($event, 'column', column, colEl)\"\n [class.selected]=\"selectedElement?.domElement === colEl\"\n [class.hovered]=\"hoveredElement?.domElement === colEl && selectedElement?.domElement !== colEl\">\n <ng-container dynamicFieldLoader [fields]=\"getColumnFields(column)\" [formGroup]=\"form\"\n [readonlyMode]=\"readonlyModeGlobal === null ? null : readonlyModeGlobal\"\n [disabledMode]=\"disabledModeGlobal === null ? null : disabledModeGlobal\"\n [presentationMode]=\"presentationForLoader\" [visible]=\"visibleGlobal === null ? null : visibleGlobal\"\n [canvasMode]=\"enableCustomization\" (canvasMouseEnter)=\"onFieldMouseEnter($event)\"\n (canvasMouseLeave)=\"onFieldMouseLeave($event)\" (canvasClick)=\"onFieldClick($event)\"\n (renderError)=\"onFieldRenderError($event)\">\n </ng-container>\n </div>\n </div>\n } }\n </div>\n </div>\n }\n }\n } @else {\n <div class=\"section-collapsed-placeholder\">\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'unfold_more'\"></mat-icon>\n <span>{{ getSectionCollapsedSummary(section) }}</span>\n </div>\n }\n @if (last && beforeActionsPlacement === 'insideLastSection' && formBlocksBeforeActions.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before-actions\" data-editorial-placement=\"beforeActions\">\n @for (block of formBlocksBeforeActions; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('beforeActions', $event)\">\n </ng-container>\n }\n </section>\n }\n @if (actionPlacement === 'insideLastSection' && last && !(effectivePresentation\n || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"insideLastSection\" [actions]=\"config.actions\"\n [isSubmitting]=\"submitting\" [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\"\n [actionOverrides]=\"actionRuleProps\" [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n </div>\n <!-- Overlay de bloqueio durante submiss\u00E3o -->\n @if (submitting) {\n <div class=\"form-blocking-overlay\" aria-live=\"polite\">\n <mat-progress-spinner diameter=\"40\" color=\"primary\"></mat-progress-spinner>\n <p>{{ config.messages?.loading?.submit || 'Salvando...' }}</p>\n </div>\n }\n </div>\n\n @if (enableCustomization && selectedElement?.domElement === sectionEl) {\n <div class=\"add-section-container\">\n <div class=\"add-section-line\"></div>\n <button mat-fab color=\"primary\" aria-label=\"Adicionar nova se\u00E7\u00E3o\" (click)=\"addNewSectionAfter(sectionIndex)\"\n matTooltip=\"Adicionar nova se\u00E7\u00E3o aqui\">\n <mat-icon [praxisIcon]=\"'add'\"></mat-icon>\n </button>\n <div class=\"add-section-line\"></div>\n </div>\n }\n }\n </div>\n }\n\n @if (beforeActionsPlacement !== 'insideLastSection' && formBlocksBeforeActions.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before-actions\" data-editorial-placement=\"beforeActions\">\n @for (block of formBlocksBeforeActions; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('beforeActions', $event)\">\n </ng-container>\n }\n </section>\n }\n\n @if (actionPlacement === 'afterSections' && !(effectivePresentation || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"afterSections\" [actions]=\"config.actions\" [isSubmitting]=\"submitting\"\n [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\"\n [actionOverrides]=\"actionRuleProps\" [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n\n @if (formBlocksAfter.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-after\" data-editorial-placement=\"after\">\n @for (block of formBlocksAfter; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('after', $event)\">\n </ng-container>\n }\n </section>\n }\n</form>\n@if (!enableCustomization && mode === 'view') {\n<div class=\"ai-floating-assistant\">\n <praxis-ai-assistant [adapter]=\"aiAdapter\"></praxis-ai-assistant>\n</div>\n}\n}\n", styles: ["@charset \"UTF-8\";.span-xs-1{grid-column:span 1}.span-xs-2{grid-column:span 2}.span-xs-3{grid-column:span 3}.span-xs-4{grid-column:span 4}.span-xs-5{grid-column:span 5}.span-xs-6{grid-column:span 6}.span-xs-7{grid-column:span 7}.span-xs-8{grid-column:span 8}.span-xs-9{grid-column:span 9}.span-xs-10{grid-column:span 10}.span-xs-11{grid-column:span 11}.span-xs-12{grid-column:span 12}.offset-xs-0{margin-left:0%}.offset-xs-1{margin-left:calc(1 / 12 * 100%)}.offset-xs-2{margin-left:calc(2 / 12 * 100%)}.offset-xs-3{margin-left:25%}.offset-xs-4{margin-left:calc(4 / 12 * 100%)}.offset-xs-5{margin-left:calc(5 / 12 * 100%)}.offset-xs-6{margin-left:50%}.offset-xs-7{margin-left:calc(7 / 12 * 100%)}.offset-xs-8{margin-left:calc(8 / 12 * 100%)}.offset-xs-9{margin-left:75%}.offset-xs-10{margin-left:calc(10 / 12 * 100%)}.offset-xs-11{margin-left:calc(11 / 12 * 100%)}.order-xs--12{order:-12}.order-xs--11{order:-11}.order-xs--10{order:-10}.order-xs--9{order:-9}.order-xs--8{order:-8}.order-xs--7{order:-7}.order-xs--6{order:-6}.order-xs--5{order:-5}.order-xs--4{order:-4}.order-xs--3{order:-3}.order-xs--2{order:-2}.order-xs--1{order:-1}.order-xs-0{order:0}.order-xs-1{order:1}.order-xs-2{order:2}.order-xs-3{order:3}.order-xs-4{order:4}.order-xs-5{order:5}.order-xs-6{order:6}.order-xs-7{order:7}.order-xs-8{order:8}.order-xs-9{order:9}.order-xs-10{order:10}.order-xs-11{order:11}.order-xs-12{order:12}.hidden-xs{display:none}@media(min-width:600px){.span-sm-1{grid-column:span 1}.span-sm-2{grid-column:span 2}.span-sm-3{grid-column:span 3}.span-sm-4{grid-column:span 4}.span-sm-5{grid-column:span 5}.span-sm-6{grid-column:span 6}.span-sm-7{grid-column:span 7}.span-sm-8{grid-column:span 8}.span-sm-9{grid-column:span 9}.span-sm-10{grid-column:span 10}.span-sm-11{grid-column:span 11}.span-sm-12{grid-column:span 12}.offset-sm-0{margin-left:0%}.offset-sm-1{margin-left:calc(1 / 12 * 100%)}.offset-sm-2{margin-left:calc(2 / 12 * 100%)}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:calc(4 / 12 * 100%)}.offset-sm-5{margin-left:calc(5 / 12 * 100%)}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:calc(7 / 12 * 100%)}.offset-sm-8{margin-left:calc(8 / 12 * 100%)}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:calc(10 / 12 * 100%)}.offset-sm-11{margin-left:calc(11 / 12 * 100%)}.order-sm--12{order:-12}.order-sm--11{order:-11}.order-sm--10{order:-10}.order-sm--9{order:-9}.order-sm--8{order:-8}.order-sm--7{order:-7}.order-sm--6{order:-6}.order-sm--5{order:-5}.order-sm--4{order:-4}.order-sm--3{order:-3}.order-sm--2{order:-2}.order-sm--1{order:-1}.order-sm-0{order:0}.order-sm-1{order:1}.order-sm-2{order:2}.order-sm-3{order:3}.order-sm-4{order:4}.order-sm-5{order:5}.order-sm-6{order:6}.order-sm-7{order:7}.order-sm-8{order:8}.order-sm-9{order:9}.order-sm-10{order:10}.order-sm-11{order:11}.order-sm-12{order:12}.hidden-sm{display:none}}@media(min-width:900px){.span-md-1{grid-column:span 1}.span-md-2{grid-column:span 2}.span-md-3{grid-column:span 3}.span-md-4{grid-column:span 4}.span-md-5{grid-column:span 5}.span-md-6{grid-column:span 6}.span-md-7{grid-column:span 7}.span-md-8{grid-column:span 8}.span-md-9{grid-column:span 9}.span-md-10{grid-column:span 10}.span-md-11{grid-column:span 11}.span-md-12{grid-column:span 12}.offset-md-0{margin-left:0%}.offset-md-1{margin-left:calc(1 / 12 * 100%)}.offset-md-2{margin-left:calc(2 / 12 * 100%)}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:calc(4 / 12 * 100%)}.offset-md-5{margin-left:calc(5 / 12 * 100%)}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:calc(7 / 12 * 100%)}.offset-md-8{margin-left:calc(8 / 12 * 100%)}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:calc(10 / 12 * 100%)}.offset-md-11{margin-left:calc(11 / 12 * 100%)}.order-md--12{order:-12}.order-md--11{order:-11}.order-md--10{order:-10}.order-md--9{order:-9}.order-md--8{order:-8}.order-md--7{order:-7}.order-md--6{order:-6}.order-md--5{order:-5}.order-md--4{order:-4}.order-md--3{order:-3}.order-md--2{order:-2}.order-md--1{order:-1}.order-md-0{order:0}.order-md-1{order:1}.order-md-2{order:2}.order-md-3{order:3}.order-md-4{order:4}.order-md-5{order:5}.order-md-6{order:6}.order-md-7{order:7}.order-md-8{order:8}.order-md-9{order:9}.order-md-10{order:10}.order-md-11{order:11}.order-md-12{order:12}.hidden-md{display:none}}@media(min-width:1200px){.span-lg-1{grid-column:span 1}.span-lg-2{grid-column:span 2}.span-lg-3{grid-column:span 3}.span-lg-4{grid-column:span 4}.span-lg-5{grid-column:span 5}.span-lg-6{grid-column:span 6}.span-lg-7{grid-column:span 7}.span-lg-8{grid-column:span 8}.span-lg-9{grid-column:span 9}.span-lg-10{grid-column:span 10}.span-lg-11{grid-column:span 11}.span-lg-12{grid-column:span 12}.offset-lg-0{margin-left:0%}.offset-lg-1{margin-left:calc(1 / 12 * 100%)}.offset-lg-2{margin-left:calc(2 / 12 * 100%)}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:calc(4 / 12 * 100%)}.offset-lg-5{margin-left:calc(5 / 12 * 100%)}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:calc(7 / 12 * 100%)}.offset-lg-8{margin-left:calc(8 / 12 * 100%)}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:calc(10 / 12 * 100%)}.offset-lg-11{margin-left:calc(11 / 12 * 100%)}.order-lg--12{order:-12}.order-lg--11{order:-11}.order-lg--10{order:-10}.order-lg--9{order:-9}.order-lg--8{order:-8}.order-lg--7{order:-7}.order-lg--6{order:-6}.order-lg--5{order:-5}.order-lg--4{order:-4}.order-lg--3{order:-3}.order-lg--2{order:-2}.order-lg--1{order:-1}.order-lg-0{order:0}.order-lg-1{order:1}.order-lg-2{order:2}.order-lg-3{order:3}.order-lg-4{order:4}.order-lg-5{order:5}.order-lg-6{order:6}.order-lg-7{order:7}.order-lg-8{order:8}.order-lg-9{order:9}.order-lg-10{order:10}.order-lg-11{order:11}.order-lg-12{order:12}.hidden-lg{display:none}}@media(min-width:1536px){.span-xl-1{grid-column:span 1}.span-xl-2{grid-column:span 2}.span-xl-3{grid-column:span 3}.span-xl-4{grid-column:span 4}.span-xl-5{grid-column:span 5}.span-xl-6{grid-column:span 6}.span-xl-7{grid-column:span 7}.span-xl-8{grid-column:span 8}.span-xl-9{grid-column:span 9}.span-xl-10{grid-column:span 10}.span-xl-11{grid-column:span 11}.span-xl-12{grid-column:span 12}.offset-xl-0{margin-left:0%}.offset-xl-1{margin-left:calc(1 / 12 * 100%)}.offset-xl-2{margin-left:calc(2 / 12 * 100%)}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:calc(4 / 12 * 100%)}.offset-xl-5{margin-left:calc(5 / 12 * 100%)}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:calc(7 / 12 * 100%)}.offset-xl-8{margin-left:calc(8 / 12 * 100%)}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:calc(10 / 12 * 100%)}.offset-xl-11{margin-left:calc(11 / 12 * 100%)}.order-xl--12{order:-12}.order-xl--11{order:-11}.order-xl--10{order:-10}.order-xl--9{order:-9}.order-xl--8{order:-8}.order-xl--7{order:-7}.order-xl--6{order:-6}.order-xl--5{order:-5}.order-xl--4{order:-4}.order-xl--3{order:-3}.order-xl--2{order:-2}.order-xl--1{order:-1}.order-xl-0{order:0}.order-xl-1{order:1}.order-xl-2{order:2}.order-xl-3{order:3}.order-xl-4{order:4}.order-xl-5{order:5}.order-xl-6{order:6}.order-xl-7{order:7}.order-xl-8{order:8}.order-xl-9{order:9}.order-xl-10{order:10}.order-xl-11{order:11}.order-xl-12{order:12}.hidden-xl{display:none}}.canvas-mode-enabled{--canvas-hit: 14px}.canvas-mode-enabled .canvas-element{position:relative;z-index:0;border-radius:8px;outline:2px solid transparent;outline-offset:2px;transition:outline-color .2s ease,outline-style .2s ease}.canvas-mode-enabled .canvas-element:before{content:\"\";position:absolute;inset:calc(-1 * var(--canvas-hit));pointer-events:none;border-radius:inherit;background:transparent}.canvas-mode-enabled .canvas-element[data-canvas-type=section]{--outline-color: var(--md-sys-color-primary)}.canvas-mode-enabled .canvas-element[data-canvas-type=row]{--outline-color: var(--md-sys-color-secondary)}.canvas-mode-enabled .canvas-element[data-canvas-type=column],.canvas-mode-enabled .canvas-element[data-canvas-type=field]{--outline-color: var(--md-sys-color-tertiary)}.canvas-mode-enabled .canvas-element[data-canvas-type=actions]{--outline-color: var(--md-sys-color-primary)}.canvas-mode-enabled .canvas-element.hovered:not(.selected){outline-color:var(--outline-color, var(--md-sys-color-primary));outline-style:dashed}.canvas-mode-enabled .canvas-element.selected{outline-color:var(--outline-color, var(--md-sys-color-primary));outline-style:solid;box-shadow:0 0 0 2px var(--outline-color, var(--md-sys-color-primary))}.canvas-mode-enabled .canvas-element.hovered{z-index:1000}.canvas-mode-enabled .canvas-element.selected{z-index:2000}.section-drop-wrapper,.row-drop-wrapper,.column-drop-wrapper{display:contents}.add-section-container{display:flex;align-items:center;justify-content:center;padding:.5rem 0;margin:-.5rem 0;position:relative;z-index:500}.add-section-container .add-section-line{flex-grow:1;height:1px;background:repeating-linear-gradient(90deg,var(--md-sys-color-outline-variant),var(--md-sys-color-outline-variant) 4px,transparent 4px,transparent 8px)}.add-section-container button{margin:0 1rem;transform:scale(.85)}:host{display:block;position:relative}.form-config-controls{position:sticky;top:10px;margin-left:auto;margin-bottom:10px;display:flex;align-items:center;gap:.35rem;z-index:60;background:color-mix(in srgb,var(--md-sys-color-surface) 92%,transparent);padding:6px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 82%,transparent);border-radius:999px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 10px 22px #0f172a14;min-width:0;justify-content:flex-end;pointer-events:none;opacity:.88;transition:opacity .16s ease,box-shadow .16s ease,border-color .16s ease,transform .16s ease}.form-config-controls>*{pointer-events:auto}.praxis-dynamic-form:hover .form-config-controls,.praxis-dynamic-form:focus-within .form-config-controls{opacity:1;border-color:color-mix(in srgb,var(--md-sys-color-primary) 26%,var(--md-sys-color-outline-variant) 74%);box-shadow:0 14px 28px #0f172a1f;transform:translateY(-1px)}.form-config-controls .mat-icon-button{--mdc-icon-button-state-layer-size: 34px;width:34px;height:34px;color:var(--md-sys-color-on-surface-variant);background:color-mix(in srgb,var(--md-sys-color-surface-container-low) 82%,transparent);border:1px solid transparent}.form-config-controls .mat-icon-button:hover{color:var(--md-sys-color-primary);background:var(--md-sys-color-primary-container);border-color:color-mix(in srgb,var(--md-sys-color-primary) 20%,transparent)}.ai-floating-assistant{position:sticky;right:0;bottom:12px;margin-top:14px;margin-left:auto;width:fit-content;z-index:70;pointer-events:none}.ai-floating-assistant praxis-ai-assistant{pointer-events:auto;display:inline-flex}.ai-floating-assistant .ai-trigger-btn{box-shadow:0 12px 28px #0f172a24}.config-button{color:var(--md-sys-color-primary)}.form-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center;color:var(--md-sys-color-on-surface);gap:1rem}.form-loading p{margin:0;font-size:.875rem;opacity:.7}.form-error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center;color:var(--md-sys-color-error);gap:1rem;border:1px solid var(--md-sys-color-error);border-radius:8px;background-color:var(--md-sys-color-error-container);margin:1rem;box-shadow:0 12px 30px #7f1d1d1f}.form-error h3{margin:0;color:var(--md-sys-color-on-error-container)}.form-error p{margin:0;color:var(--md-sys-color-on-error-container);opacity:.8}.form-error button{margin-top:.5rem}.pfx-form-info-banner{margin-bottom:14px;padding:12px 14px;border-radius:16px;border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 18%,var(--md-sys-color-outline-variant) 82%);background:color-mix(in srgb,var(--md-sys-color-primary-container) 24%,var(--md-sys-color-surface) 76%);color:var(--md-sys-color-on-surface);display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.pfx-form-info-banner .text{font-size:.92rem;line-height:1.5;font-weight:600}.pfx-form-info-banner .actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.praxis-dynamic-form{display:flex;flex-direction:column;transition:all .3s ease;position:relative;font-family:inherit;font-size:inherit;color:inherit;--pfx-editorial-form-surface: var( --pfx-form-section-surface, var(--md-sys-color-surface-container) );--pfx-editorial-form-surface-muted: var(--md-sys-color-surface-container-low);--pfx-editorial-form-border: var( --pfx-form-stroke, var(--md-sys-color-outline-variant) );--pfx-editorial-form-text: var(--md-sys-color-on-surface);--pfx-editorial-form-text-muted: var(--md-sys-color-on-surface-variant);--pfx-editorial-form-field-surface: color-mix( in srgb, var(--pfx-editorial-form-surface-muted) 76%, var(--pfx-editorial-form-surface) 24% );--pfx-editorial-form-field-outline: color-mix( in srgb, var(--pfx-editorial-form-border) 88%, transparent );--pfx-editorial-form-accent: var(--md-sys-color-primary);--pfx-editorial-form-accent-text: var(--md-sys-color-on-primary);--pfx-editorial-form-radius: var(--pfx-form-section-radius, 8px);--pfx-editorial-form-field-radius: var(--pfx-form-field-radius, 4px);--pfx-editorial-form-border-width: 1px;--pfx-editorial-form-field-border-width: 1px;--pfx-editorial-form-shadow: none;--pfx-form-shell-surface: color-mix( in srgb, var(--pfx-editorial-form-surface) 36%, transparent );--pfx-form-section-surface-flat: color-mix( in srgb, var(--pfx-editorial-form-surface) 78%, var(--pfx-editorial-form-surface-muted) 22% );--pfx-form-section-divider: color-mix( in srgb, var(--pfx-editorial-form-border) 68%, transparent );--pfx-form-label-strong: color-mix( in srgb, var(--pfx-editorial-form-text) 96%, white 4% );--pfx-form-label-muted: color-mix( in srgb, var(--pfx-editorial-form-text-muted) 92%, var(--pfx-editorial-form-text) 8% );--pfx-form-field-surface-rest: color-mix( in srgb, var(--pfx-editorial-form-field-surface) 82%, var(--pfx-editorial-form-surface) 18% );--pfx-form-field-surface-focus: color-mix( in srgb, var(--pfx-editorial-form-accent) 4%, var(--pfx-form-field-surface-rest) 96% );--pfx-form-field-min-height: 48px;--pfx-form-section-padding: clamp(1.1rem, 1.8vw, 1.5rem);--pfx-form-section-gap: 22px;--pfx-form-footer-surface: color-mix( in srgb, var(--pfx-editorial-form-surface) 70%, var(--pfx-editorial-form-surface-muted) 30% );--pfx-form-footer-border: color-mix( in srgb, var(--pfx-editorial-form-border) 76%, transparent )}.praxis-dynamic-form.editorial-visual-context{font-family:var(--editorial-body-font-family, inherit);font-size:var(--editorial-body-size, 1rem);color:var(--editorial-text-primary, var(--md-sys-color-on-surface));--pfx-editorial-form-surface: var( --editorial-surface-primary, var(--pfx-form-section-surface, var(--md-sys-color-surface-container)) );--pfx-editorial-form-surface-muted: var( --editorial-surface-secondary, var(--md-sys-color-surface-container-low) );--pfx-editorial-form-border: var( --editorial-border-color, var(--pfx-form-stroke, var(--md-sys-color-outline-variant)) );--pfx-editorial-form-text: var( --editorial-text-primary, var(--md-sys-color-on-surface) );--pfx-editorial-form-text-muted: var( --editorial-text-secondary, var(--md-sys-color-on-surface-variant) );--pfx-editorial-form-accent: var( --editorial-cta-primary, var(--editorial-accent, var(--md-sys-color-primary)) );--pfx-editorial-form-accent-text: var( --editorial-cta-primary-text, var(--editorial-accent-contrast, var(--md-sys-color-on-primary)) );--pfx-editorial-form-radius: var(--editorial-card-radius, 18px);--pfx-editorial-form-field-radius: var( --editorial-field-radius, var(--editorial-card-radius, 14px) );--pfx-editorial-form-border-width: var(--editorial-card-border-width, 1px);--pfx-editorial-form-field-border-width: var(--editorial-field-border-width, 1px);--pfx-editorial-form-shadow: var(--editorial-card-shadow, none);--md-sys-color-surface: var( --pfx-editorial-form-surface, var(--md-sys-color-surface) );--md-sys-color-surface-container: var( --pfx-editorial-form-surface, var(--md-sys-color-surface-container) );--md-sys-color-surface-container-low: var( --pfx-editorial-form-surface-muted, var(--md-sys-color-surface-container-low) );--md-sys-color-surface-variant: var( --pfx-editorial-form-field-surface, var(--md-sys-color-surface-variant) );--md-sys-color-outline: var( --pfx-editorial-form-field-outline, var(--md-sys-color-outline) );--md-sys-color-outline-variant: var( --pfx-editorial-form-border, var(--md-sys-color-outline-variant) );--md-sys-color-on-surface: var( --pfx-editorial-form-text, var(--md-sys-color-on-surface) );--md-sys-color-on-surface-variant: var( --pfx-editorial-form-text-muted, var(--md-sys-color-on-surface-variant) );--md-sys-color-primary: var( --pfx-editorial-form-accent, var(--md-sys-color-primary) );--md-sys-color-on-primary: var( --pfx-editorial-form-accent-text, var(--md-sys-color-on-primary) );--md-sys-color-on-surface-rgb: var( --editorial-text-primary-rgb, var(--md-sys-color-on-surface-rgb) );--mat-sys-on-surface: var( --pfx-editorial-form-text, var(--mat-sys-on-surface) );--mat-sys-on-surface-variant: var( --pfx-editorial-form-text-muted, var(--mat-sys-on-surface-variant) );--mat-sys-on-surface-rgb: var( --editorial-text-primary-rgb, var(--mat-sys-on-surface-rgb, var(--md-sys-color-on-surface-rgb)) );color:var(--pfx-editorial-form-text);color-scheme:light}.praxis-dynamic-form.presentation-mode .form-row,.praxis-dynamic-form.readonly-mode .form-row{gap:.5rem;margin-bottom:.5rem}.praxis-dynamic-form.presentation-mode .form-section,.praxis-dynamic-form.readonly-mode .form-section{padding:.75rem .875rem}.praxis-dynamic-form.pres-compact .form-row{gap:.35rem;margin-bottom:.35rem}.praxis-dynamic-form.pres-compact .form-section{padding:.5rem .75rem}.praxis-dynamic-form.pres-label-left .praxis-presentation{display:grid;grid-template-columns:var(--pfx-presentation-label-w, 220px) 1fr;align-items:baseline;column-gap:10px}.praxis-dynamic-form.pres-label-left .praxis-presentation__label{text-align:right;margin-bottom:0}.form-section{border:1px solid var(--pfx-form-section-divider);border-radius:var(--pfx-editorial-form-radius);padding:var(--pfx-form-section-padding);background:var(--pfx-form-section-surface-flat);box-shadow:none;transition:all .2s ease;position:relative}.praxis-dynamic-form.editorial-visual-context .form-section{border:var(--pfx-editorial-form-border-width) solid var(--pfx-editorial-form-border)!important;background:var(--pfx-editorial-form-surface)!important;box-shadow:var(--editorial-card-shadow, none)}.praxis-dynamic-form.editorial-visual-context .form-section.section-appearance-step{background-color:var(--pfx-editorial-form-surface)!important;background-image:linear-gradient(180deg,color-mix(in srgb,var(--editorial-accent, var(--md-sys-color-primary)) 6%,transparent) 0%,transparent 132px)!important;background-repeat:no-repeat!important}.section-drop-wrapper>.form-section{margin-bottom:var(--pfx-section-gap, 20px)}.section-drop-wrapper:last-of-type>.form-section{margin-bottom:0}.praxis-dynamic-form>praxis-form-actions[data-actions-placement=afterSections] .form-actions{margin-top:var(--pfx-actions-gap-top, var(--pfx-section-gap, 20px))}.section-title{margin:0 0 var(--pfx-section-title-mb, 12px) 0;font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));font-size:var(--editorial-step-title-size, 1.12rem);font-weight:700;color:var(--pfx-form-label-strong)}.section-heading{display:flex;align-items:flex-start;gap:12px;margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--pfx-form-section-divider)}.section-heading.align-center{flex-direction:column;align-items:center;text-align:center}.section-heading.align-center .section-heading-text{display:grid;justify-items:center}.section-step-label{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;margin:0 0 8px;border-radius:999px;background:color-mix(in srgb,var(--pfx-editorial-form-accent) 10%,transparent);color:color-mix(in srgb,var(--pfx-editorial-form-accent) 84%,var(--pfx-form-label-strong) 16%);font-size:.72rem;font-weight:800;font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));letter-spacing:.08em;text-transform:uppercase}.section-heading-text{flex:1 1 auto;min-width:0}.section-heading-actions{display:inline-flex;align-items:center;align-self:flex-start;flex-wrap:wrap;gap:4px;margin-left:auto}.section-heading-actions.align-center{align-self:center;margin-left:0}.section-heading-action-btn{color:var(--pfx-form-label-muted)}.section-heading-action-btn .mat-mdc-progress-spinner,.section-heading-action-btn mat-progress-spinner{--mdc-circular-progress-active-indicator-color: currentColor}.section-heading-action-btn.loading{opacity:.72;pointer-events:none}.section-heading-action-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.section-collapse-btn{margin-left:4px;color:var(--pfx-form-label-muted)}.section-title.title-large{font:var(--mdc-typography-title-large, 500 22px/28px system-ui)}.section-title.title-medium{font:var(--mdc-typography-title-medium, 500 16px/24px system-ui)}.section-title.title-small{font:var(--mdc-typography-title-small, 500 14px/20px system-ui)}.section-title.headline-small{font:var(--mdc-typography-headline-small, 600 24px/32px system-ui)}.section-title.title-large,.section-title.title-medium,.section-title.title-small,.section-title.headline-small{font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));font-weight:var(--editorial-title-weight, 600)}.section-description{margin:0;font-family:var(--editorial-body-font-family, inherit);font-size:.93rem;color:var(--pfx-form-label-muted);line-height:1.6}.section-description.body-large{font:var(--mdc-typography-body-large, 400 16px/24px system-ui)}.section-description.body-medium{font:var(--mdc-typography-body-medium, 400 14px/20px system-ui)}.section-description.body-small{font:var(--mdc-typography-body-small, 400 12px/16px system-ui)}.section-description.body-large,.section-description.body-medium,.section-description.body-small{font-family:var(--editorial-body-font-family, inherit);font-weight:var(--editorial-body-weight, 400)}.section-title.align-center,.section-description.align-center,.section-step-label.align-center{text-align:center}.form-section.section-appearance-plain{border-color:transparent;border-radius:0;padding:0;background:transparent}.form-section.section-appearance-plain .section-heading{margin-bottom:14px}.form-section.section-appearance-step{border-radius:var(--pfx-editorial-form-radius);padding:var(--pfx-form-section-padding);background:var(--pfx-form-section-surface-flat);border-color:var(--pfx-form-section-divider);box-shadow:none}.praxis-dynamic-form.editorial-visual-context .form-section.section-appearance-step{border-radius:var(--editorial-card-radius, 20px);box-shadow:none}.form-section.section-appearance-step .section-heading{margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid var(--pfx-form-section-divider)}.form-section.section-appearance-step .section-title{font:var(--mdc-typography-title-large, 700 22px/28px system-ui);color:var(--pfx-form-label-strong);margin-bottom:8px}.form-section.section-appearance-step .section-description{color:var(--pfx-form-label-muted);max-width:60ch}.form-section.section-appearance-step .section-step-label{min-height:24px;padding:0 10px;margin-bottom:10px;box-shadow:none}.form-section.section-appearance-step .section-heading.align-center .section-description{max-width:52ch}.form-section.section-appearance-step .section-body{display:grid;gap:8px;padding-top:0}.form-section.section-appearance-step .form-row{margin-bottom:var(--pfx-field-gap, 1rem)}.form-section.section-appearance-step .form-column{gap:var(--pfx-field-gap, 12px)}.form-section .form-editorial-blocks{display:grid;gap:16px}.form-section .form-editorial-blocks[data-editorial-placement=beforeActions]{margin-top:24px;padding-top:18px;border-top:1px solid var(--pfx-form-section-divider)}.form-section.section-appearance-step .form-editorial-blocks[data-editorial-placement=beforeActions]{gap:18px}.form-section.section-appearance-step .form-editorial-blocks[data-editorial-placement=beforeActions]>*+*{margin-top:2px}.praxis-dynamic-form>praxis-form-actions[data-actions-placement=afterSections] .form-actions{margin-top:18px;padding-top:0}.praxis-dynamic-form>.form-editorial-blocks[data-editorial-placement=after]{margin-top:6px}:host-context(.mdc-theme-dark) .form-section.section-appearance-step,:host-context(.theme-dark) .form-section.section-appearance-step{border-color:color-mix(in srgb,var(--pfx-editorial-form-border) 82%,transparent);box-shadow:none}:host-context(.mdc-theme-dark) .form-section.section-appearance-step .section-title,:host-context(.theme-dark) .form-section.section-appearance-step .section-title{color:color-mix(in srgb,var(--pfx-editorial-form-text) 96%,white)}:host-context(.mdc-theme-dark) .form-section.section-appearance-step .section-description,:host-context(.theme-dark) .form-section.section-appearance-step .section-description{color:color-mix(in srgb,var(--pfx-editorial-form-text-muted) 86%,var(--pfx-editorial-form-text) 14%)}:host-context(.mdc-theme-dark) .section-step-label,:host-context(.theme-dark) .section-step-label{background:color-mix(in srgb,var(--md-sys-color-primary-container) 54%,transparent);color:color-mix(in srgb,var(--md-sys-color-primary) 88%,white)}:host-context(.mdc-theme-dark) .form-section .form-editorial-blocks[data-editorial-placement=beforeActions],:host-context(.theme-dark) .form-section .form-editorial-blocks[data-editorial-placement=beforeActions]{border-top-color:color-mix(in srgb,var(--md-sys-color-outline-variant) 90%,transparent)}.inline-edit-btn{margin-left:6px;vertical-align:middle;--mdc-icon-button-size: 28px;--mdc-icon-button-icon-size: 16px}.inline-edit-btn mat-icon{font-size:16px;width:16px;height:16px}.section-body.collapsed{border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-low);border-radius:6px;padding:8px 10px}.section-collapsed-placeholder{display:flex;align-items:center;gap:8px;color:var(--md-sys-color-on-surface-variant);font-size:.95rem}.section-collapsed-placeholder mat-icon{font-size:20px;width:20px;height:20px}.form-row{display:flex;gap:1.1rem;margin-bottom:var(--pfx-field-gap, 1.1rem);transition:all .2s ease;border-radius:6px;position:relative}.praxis-dynamic-form.pfx-mounting .form-row{opacity:0;transform:translateY(var(--pdx-form-mount-offset, 6px));animation:pdxFormMount var(--pdx-form-mount-duration, .16s) ease-out both;animation-delay:calc(var(--pfx-mount-index, 0) * var(--pdx-form-mount-stagger, 20ms))}@media(prefers-reduced-motion:reduce){.praxis-dynamic-form.pfx-mounting .form-row{animation:none;opacity:1;transform:none}}@keyframes pdxFormMount{to{opacity:1;transform:translateY(0)}}.praxis-dynamic-form .mat-mdc-form-field{width:100%;margin-bottom:var(--pfx-field-gap, 10px);font-family:inherit;--mdc-filled-text-field-container-color: var(--pfx-form-field-surface-rest);--mdc-filled-text-field-focus-active-indicator-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-active-indicator-color: var(--pfx-editorial-form-field-outline);--mdc-filled-text-field-hover-active-indicator-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-focus-label-text-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-label-text-color: var(--pfx-form-label-muted);--mdc-filled-text-field-input-text-color: var(--pfx-editorial-form-text);--mdc-filled-text-field-caret-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-input-text-placeholder-color: color-mix( in srgb, var(--pfx-editorial-form-text-muted) 82%, transparent );--mdc-outlined-text-field-outline-color: var(--pfx-editorial-form-field-outline);--mdc-outlined-text-field-hover-outline-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-focus-outline-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-focus-label-text-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-label-text-color: var(--pfx-form-label-muted);--mdc-outlined-text-field-input-text-color: var(--pfx-editorial-form-text);--mdc-filled-text-field-container-shape: var(--pfx-editorial-form-field-radius);--mdc-outlined-text-field-container-shape: var(--pfx-editorial-form-field-radius);--mdc-filled-text-field-active-indicator-height: var(--pfx-editorial-form-field-border-width);--mdc-filled-text-field-focus-active-indicator-height: var(--pfx-editorial-form-field-border-width);--mdc-outlined-text-field-outline-width: var(--pfx-editorial-form-field-border-width);--mdc-outlined-text-field-focus-outline-width: var(--pfx-editorial-form-field-border-width);--mat-select-enabled-trigger-text-color: var(--pfx-editorial-form-text);--mat-select-enabled-arrow-color: var(--pfx-form-label-muted);--mat-form-field-enabled-select-arrow-color: var(--pfx-form-label-muted);--mat-form-field-focus-select-arrow-color: var(--pfx-editorial-form-accent);--mat-form-field-hover-state-layer-opacity: 0;--mat-form-field-focus-state-layer-opacity: 0}.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field{font-family:var(--editorial-body-font-family, inherit)}.praxis-dynamic-form .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mdc-text-field{background:var(--pfx-form-field-surface-rest);border-radius:var(--pfx-editorial-form-field-radius);min-height:var(--pfx-form-field-min-height);transition:background-color .16s ease,box-shadow .16s ease,border-color .16s ease}.praxis-dynamic-form.editorial-visual-context .mat-mdc-text-field-wrapper,.praxis-dynamic-form.editorial-visual-context .mdc-text-field,.praxis-dynamic-form.editorial-visual-context .mdc-text-field--filled,.praxis-dynamic-form.editorial-visual-context .mdc-text-field--outlined{background-color:var(--pfx-form-field-surface-rest)!important;background:var(--pfx-form-field-surface-rest)!important}.praxis-dynamic-form .mat-mdc-form-field .mdc-floating-label,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-hint,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-error,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-required-marker,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-select-arrow,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-select-placeholder,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-icon-suffix,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-icon-prefix{color:var(--pfx-form-label-muted)}.praxis-dynamic-form .mat-mdc-input-element,.praxis-dynamic-form .mat-mdc-select-value-text,.praxis-dynamic-form .mat-mdc-form-field-infix,.praxis-dynamic-form .mat-mdc-select-min-line{color:var(--pfx-editorial-form-text)}.praxis-dynamic-form .mat-mdc-form-field:hover .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mat-mdc-form-field:hover .mdc-text-field,.praxis-dynamic-form .mat-mdc-form-field.mat-focused .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mat-mdc-form-field.mat-focused .mdc-text-field{background:var(--pfx-form-field-surface-focus)}.praxis-dynamic-form.editorial-visual-context .mat-mdc-input-element,.praxis-dynamic-form.editorial-visual-context .mat-mdc-select-value-text,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field-infix,.praxis-dynamic-form.editorial-visual-context .mat-mdc-select-min-line,.praxis-dynamic-form.editorial-visual-context .mdc-text-field__input{color:var(--pfx-editorial-form-text)!important;-webkit-text-fill-color:var(--pfx-editorial-form-text)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-hint,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-error,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-required-marker,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-select-arrow,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-select-placeholder,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-icon-suffix,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-icon-prefix{color:var(--pfx-editorial-form-text-muted)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mdc-text-field__input::placeholder{color:color-mix(in srgb,var(--pfx-editorial-form-text) 68%,transparent)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-input-element::placeholder,.praxis-dynamic-form.editorial-visual-context textarea.mat-mdc-input-element::placeholder{color:color-mix(in srgb,var(--pfx-editorial-form-text) 58%,transparent)!important}.praxis-dynamic-form .mat-mdc-radio-button,.praxis-dynamic-form .mat-mdc-checkbox,.praxis-dynamic-form .mat-mdc-slide-toggle{--mdc-radio-selected-icon-color: var(--pfx-editorial-form-accent);--mdc-radio-selected-hover-icon-color: var(--pfx-editorial-form-accent);--mdc-radio-selected-focus-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-checkmark-color: var(--pfx-editorial-form-accent-text);--mdc-checkbox-selected-focus-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-hover-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-icon-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-focus-state-layer-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-handle-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-track-color: color-mix(in srgb, var(--pfx-editorial-form-accent) 45%, #fff)}.praxis-dynamic-form [data-field-type=input],.praxis-dynamic-form [data-field-type=textarea],.praxis-dynamic-form [data-field-type=email],.praxis-dynamic-form [data-field-type=password],.praxis-dynamic-form [data-field-type=url],.praxis-dynamic-form [data-field-type=search],.praxis-dynamic-form [data-field-type=phone],.praxis-dynamic-form [data-field-type=numericTextBox],.praxis-dynamic-form [data-field-type=currency],.praxis-dynamic-form [data-field-type=cpfCnpj],.praxis-dynamic-form [data-field-type=date],.praxis-dynamic-form [data-field-type=dateInput],.praxis-dynamic-form [data-field-type=dateRange],.praxis-dynamic-form [data-field-type=dateTimeLocal],.praxis-dynamic-form [data-field-type=time],.praxis-dynamic-form [data-field-type=timePicker],.praxis-dynamic-form [data-field-type=timeRange],.praxis-dynamic-form [data-field-type=month],.praxis-dynamic-form [data-field-type=week],.praxis-dynamic-form [data-field-type=yearInput],.praxis-dynamic-form [data-field-type=select],.praxis-dynamic-form [data-field-type=multi-select],.praxis-dynamic-form [data-field-type=searchable-select],.praxis-dynamic-form [data-field-type=async-select],.praxis-dynamic-form [data-field-type=autocomplete],.praxis-dynamic-form [data-field-type=tree-select],.praxis-dynamic-form [data-field-type=multi-select-tree],.praxis-dynamic-form [data-field-type=priceRange],.praxis-dynamic-form [data-field-type=file-upload]{display:block;width:100%;min-width:0}.praxis-dynamic-form .mat-mdc-form-field-subscript-wrapper{min-height:var(--pfx-subscript-min-h, 22px)}.form-row:last-child{margin-bottom:0}.form-column{display:grid;align-content:start;gap:var(--pfx-field-gap, 10px);flex:1;min-width:0;transition:all .2s ease;border-radius:4px;position:relative}.form-row.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--pfx-grid-gap, 16px)}.align-start{align-self:flex-start}.align-center{align-self:center}.align-end{align-self:flex-end}.align-stretch{align-self:stretch}.form-blocking-overlay{position:absolute;inset:0;background:transparent;color:var(--md-sys-color-on-surface);backdrop-filter:blur(2px) saturate(103%);-webkit-backdrop-filter:blur(2px) saturate(103%);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;z-index:10;pointer-events:all}@media(max-width:768px){.form-row{flex-direction:column;gap:.5rem}.form-section{padding:1rem}.section-heading{gap:10px;margin-bottom:16px;padding-bottom:14px}}.section-title{display:flex;align-items:center;gap:8px}.section-title .section-title-icon{font-size:1.25em;line-height:1}.section-title-avatar{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px));display:inline-flex;align-items:center;justify-content:center;width:var(--_pfx-form-section-avatar-size);height:var(--_pfx-form-section-avatar-size);border-radius:999px;flex:0 0 var(--_pfx-form-section-avatar-size);overflow:hidden}.section-title-avatar.size-sm{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-sm, 24px)}.section-title-avatar.size-md{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px))}.section-title-avatar.size-lg{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-lg, 40px)}.section-title-avatar-image{object-fit:cover;border:1px solid color-mix(in srgb,var(--pfx-form-section-divider) 72%,transparent);background:var(--pfx-form-section-surface-flat)}.section-title-avatar-text,.section-title-avatar-placeholder{background:color-mix(in srgb,var(--pfx-editorial-form-accent) 14%,var(--pfx-form-section-surface-flat));color:color-mix(in srgb,var(--pfx-editorial-form-accent) 82%,var(--pfx-form-label-strong) 18%);font-size:calc(var(--_pfx-form-section-avatar-size) * .41);font-weight:800;letter-spacing:.04em;text-transform:uppercase}.section-title-avatar-placeholder mat-icon{font-size:calc(var(--_pfx-form-section-avatar-size) * .5625);width:calc(var(--_pfx-form-section-avatar-size) * .5625);height:calc(var(--_pfx-form-section-avatar-size) * .5625);line-height:calc(var(--_pfx-form-section-avatar-size) * .5625)}.section-title-avatar-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"] }]
|
|
11162
|
-
}], ctorParameters: () => [{ type: i1$2.GenericCrudService }, { type: i1$3.FormBuilder }, { type: i0.ChangeDetectorRef }, { type: FormLayoutService }, { type: FormContextService }, { type: FormRulesService }, { type:
|
|
11423
|
+
], template: "@if (isLoading) {\n<!-- Loading State -->\n<div class=\"form-loading\">\n <mat-progress-spinner diameter=\"40\"></mat-progress-spinner>\n <p>Carregando formul\u00E1rio...</p>\n</div>\n} @else if (initializationStatus === 'error') {\n<!-- Error State -->\n<div class=\"form-error\">\n <mat-icon color=\"warn\" [praxisIcon]=\"'error'\"></mat-icon>\n <h3>{{ getErrorTitle() }}</h3>\n <p>{{ currentErrorMessage }}</p>\n @if (isRecoverable) {\n <button mat-stroked-button (click)=\"retryInitialization()\">\n <mat-icon [praxisIcon]=\"'refresh'\"></mat-icon>\n Tentar Novamente\n </button>\n }\n <button mat-button (click)=\"showDetailedError()\" class=\"show-details\">\n Ver Detalhes T\u00E9cnicos\n </button>\n <!-- Permitir corre\u00E7\u00E3o do resourcePath diretamente do estado de erro -->\n <button mat-flat-button color=\"primary\" (click)=\"openQuickConnect()\" class=\"connect-action\">\n <mat-icon [praxisIcon]=\"'bolt'\"></mat-icon>\n Conectar a recurso\n </button>\n</div>\n} @else if (initializationStatus === 'success') {\n<!-- Inline banner for schema change (only when customization is enabled) -->\n@if (shouldShowOutdatedInline()) {\n<div class=\"pfx-form-info-banner\" role=\"status\" aria-live=\"polite\">\n <div class=\"text\">O schema do servidor mudou. Reconciliar agora?</div>\n <div class=\"actions\">\n <button mat-stroked-button color=\"primary\" (click)=\"openConfigEditor()\">\n <mat-icon [praxisIcon]=\"'sync'\"></mat-icon>\n Reconciliar\n </button>\n <button mat-button (click)=\"onSnoozeOutdated()\">Lembrar depois</button>\n <button mat-button (click)=\"onIgnoreOutdated()\">Ignorar</button>\n </div>\n</div>\n}\n\n<!-- Configuration Controls -->\n@if (shouldShowConfigControls && enableCustomization) {\n<div class=\"form-config-controls\">\n <praxis-ai-assistant [adapter]=\"aiAdapter\"></praxis-ai-assistant>\n <button type=\"button\" mat-icon-button (click)=\"openConfigEditor()\" [disabled]=\"isLoading\" class=\"config-button\"\n [matBadge]=\"schemaOutdated ? '!' : ''\" [matBadgeHidden]=\"!schemaOutdated\" matBadgeColor=\"warn\" matBadgeSize=\"small\"\n matBadgePosition=\"above after\"\n [matTooltip]=\"schemaOutdated ? 'Schema do servidor mudou \u2014 Reconciliar' : 'Configurar formul\u00E1rio'\">\n <mat-icon [praxisIcon]=\"'settings'\"></mat-icon>\n </button>\n <button type=\"button\" mat-icon-button (click)=\"disconnect()\" matTooltip=\"Desconectar da fonte de dados\"\n [disabled]=\"isLoading\">\n <mat-icon [praxisIcon]=\"'link_off'\"></mat-icon>\n </button>\n</div>\n}\n\n<!-- Form Content -->\n@if (!resourcePath && (!config.sections || config.sections.length === 0)) {\n<praxis-empty-state-card icon=\"link\" [title]=\"'Conecte o formul\u00E1rio \u00E0 fonte de dados'\"\n [description]=\"'Informe a rota do recurso da API para gerar automaticamente os campos do formul\u00E1rio.'\"\n [primaryAction]=\"{ label: 'Conectar \u00E0 fonte de dados', icon: 'bolt', action: openQuickConnect.bind(this) }\"></praxis-empty-state-card>\n}\n<form #formHost (ngSubmit)=\"onSubmit()\" [attr.aria-busy]=\"submitting ? 'true' : null\"\n [attr.aria-label]=\"'Formul\u00E1rio ' + (config.metadata?.version || '')\" [class.canvas-mode-enabled]=\"enableCustomization\"\n [class.presentation-mode]=\"effectivePresentation\" [class.readonly-mode]=\"effectiveReadonly\"\n [class.editorial-visual-context]=\"hasEditorialVisualContext()\"\n [class.pfx-mounting]=\"isMounting\" [formGroup]=\"form\"\n [ngClass]=\"{\n 'pres-compact': presentationVars.compact,\n 'pres-label-left': presentationVars.labelPosition === 'left',\n 'pres-label-above': presentationVars.labelPosition === 'above'\n }\" [style.--pfx-pres-label-align]=\"presentationVars.labelAlign\"\n [style.--pfx-pres-label-size]=\"presentationVars.labelSize\"\n [style.--pfx-pres-label-width]=\"presentationVars.labelWidth\"\n [style.--pfx-pres-row-gap]=\"presentationVars.density === 'compact' ? '6px' : (presentationVars.density === 'cozy' ? '8px' : '10px')\"\n [style.--pfx-pres-row-padding]=\"presentationVars.density === 'compact' ? '2px 0' : (presentationVars.density === 'cozy' ? '6px 0' : '8px 0')\"\n [style.--pfx-pres-value-align]=\"presentationVars.valueAlign\"\n [style.--pfx-pres-value-size]=\"presentationVars.valueSize\"\n [style.--pdx-form-mount-duration]=\"getMountDurationVar()\"\n [style.--pdx-form-mount-offset]=\"getMountOffsetVar()\"\n [style.--pdx-form-mount-stagger]=\"getMountStaggerVar()\"\n class=\"praxis-dynamic-form\">\n <praxis-canvas-toolbar (editMetadata)=\"openSelectedElementEditor()\" (selectPath)=\"onSelectPath($event)\"\n (moveUp)=\"onToolbarMove('up')\" (moveDown)=\"onToolbarMove('down')\" (toggleReadonly)=\"onToolbarToggleReadonly()\"\n (toggleRequired)=\"onToolbarToggleRequired()\" (toggleHidden)=\"onToolbarToggleHidden()\"\n (toggleDisabled)=\"onToolbarToggleDisabled()\" (requestClose)=\"onToolbarRequestClose()\"\n *ngIf=\"enableCustomization && selectedElement\" [selectedElement]=\"selectedElement\"\n [style.transform]=\"toolbarTransform\"></praxis-canvas-toolbar>\n\n @if (formBlocksBefore.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before\" data-editorial-placement=\"before\">\n @for (block of formBlocksBefore; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('before', $event)\">\n </ng-container>\n }\n </section>\n }\n\n @if (actionPlacement === 'top' && !(effectivePresentation || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"top\" [actions]=\"config.actions\" [isSubmitting]=\"submitting\"\n [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\" [actionOverrides]=\"actionRuleProps\"\n [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n\n @for (section of config.sections; track (section.id ?? $index); let sectionIndex = $index;\n let last = $last) {\n <div class=\"section-drop-wrapper\" [attr.data-section-id]=\"section.id\">\n @if (isSectionVisible(section)) {\n <div #sectionEl class=\"form-section canvas-element\" data-canvas-type=\"section\" [attr.data-section-id]=\"section.id\"\n [attr.data-section-index]=\"sectionIndex\" (mouseenter)=\"onElementMouseEnter($event, 'section', section, sectionEl)\"\n (mouseleave)=\"onElementMouseLeave($event)\" (click)=\"onElementClick($event, 'section', section, sectionEl)\"\n [class.selected]=\"selectedElement?.domElement === sectionEl\"\n [class.hovered]=\"hoveredElement?.domElement === sectionEl && selectedElement?.domElement !== sectionEl\"\n [attr.data-section-appearance]=\"getSectionAppearance(section) || null\"\n [style.marginBottom.px]=\"!last ? getSectionGapBottom(section) : null\" [ngClass]=\"getSectionClasses(section)\"\n [ngStyle]=\"getSectionStyles(section)\">\n <div\n class=\"section-heading\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\"\n [class.step-appearance]=\"getSectionAppearance(section) === 'step'\"\n >\n <div class=\"section-heading-text\" [matTooltip]=\"getSectionHeaderTooltip(section) || null\"\n [matTooltipDisabled]=\"!getSectionHeaderTooltip(section)\">\n @if (getSectionStepLabel(section)) {\n <div class=\"section-step-label\" [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n {{ getSectionStepLabel(section) }}\n </div>\n }\n @if (getSectionTitle(section)) {\n <h3 class=\"section-title\" [class.title-large]=\"getSectionTitleStyle(section) === 'titleLarge'\"\n [class.title-medium]=\"getSectionTitleStyle(section) === 'titleMedium'\"\n [class.title-small]=\"getSectionTitleStyle(section) === 'titleSmall'\"\n [class.headline-small]=\"getSectionTitleStyle(section) === 'headlineSmall'\"\n [style.marginBottom.px]=\"getSectionTitleGapBottom(section) ?? 20\" [style.color]=\"getSectionTitleColor(section) || null\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\"\n [attr.id]=\"sectionPanelId(section, sectionIndex) + '-title'\">\n @let sectionHeaderVisual = getSectionHeaderVisual(section);\n @let sectionHeaderAvatarSize = getSectionHeaderAvatarSize(section);\n @if (sectionHeaderVisual.kind === 'icon') {\n <mat-icon class=\"section-title-icon\" aria-hidden=\"true\" [praxisIcon]=\"sectionHeaderVisual.icon\"></mat-icon>\n }\n @if (sectionHeaderVisual.kind === 'image') {\n <img class=\"section-title-avatar section-title-avatar-image\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\"\n [src]=\"sectionHeaderVisual.src\" [alt]=\"sectionHeaderVisual.alt\" />\n }\n @if (sectionHeaderVisual.kind === 'initials') {\n <span class=\"section-title-avatar section-title-avatar-text\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\" aria-hidden=\"true\">\n {{ sectionHeaderVisual.text }}\n </span>\n @if (sectionHeaderVisual.ariaLabel) {\n <span class=\"section-title-avatar-sr-only\">{{ sectionHeaderVisual.ariaLabel }}</span>\n }\n }\n @if (sectionHeaderVisual.kind === 'placeholder') {\n <span class=\"section-title-avatar section-title-avatar-placeholder\" [class.size-sm]=\"sectionHeaderAvatarSize === 'sm'\"\n [class.size-md]=\"sectionHeaderAvatarSize === 'md'\" [class.size-lg]=\"sectionHeaderAvatarSize === 'lg'\" aria-hidden=\"true\">\n @if (sectionHeaderVisual.icon) {\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"sectionHeaderVisual.icon\"></mat-icon>\n }\n @if (sectionHeaderVisual.text) {\n <span>{{ sectionHeaderVisual.text }}</span>\n }\n </span>\n @if (sectionHeaderVisual.ariaLabel) {\n <span class=\"section-title-avatar-sr-only\">{{ sectionHeaderVisual.ariaLabel }}</span>\n }\n }\n {{ getSectionTitle(section) }}\n @if (enableCustomization) {\n <button type=\"button\" class=\"inline-edit-btn\" mat-icon-button (click)=\"openSectionEditor(section, 'title')\"\n aria-label=\"Editar t\u00EDtulo da se\u00E7\u00E3o\" matTooltip=\"Editar t\u00EDtulo\">\n <mat-icon>edit</mat-icon>\n </button>\n }\n </h3>\n }\n @if (getSectionDescription(section)) {\n <p class=\"section-description\" [class.body-large]=\"getSectionDescriptionStyle(section) === 'bodyLarge'\"\n [class.body-medium]=\"getSectionDescriptionStyle(section) === 'bodyMedium'\"\n [class.body-small]=\"getSectionDescriptionStyle(section) === 'bodySmall'\"\n [style.marginBottom.px]=\"getSectionDescriptionGapBottom(section) ?? 8\" [style.color]=\"getSectionDescriptionColor(section) || null\"\n [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n {{ getSectionDescription(section) }}\n @if (enableCustomization) {\n <button type=\"button\" class=\"inline-edit-btn\" mat-icon-button\n (click)=\"openSectionEditor(section, 'description')\" aria-label=\"Editar descri\u00E7\u00E3o da se\u00E7\u00E3o\"\n matTooltip=\"Editar descri\u00E7\u00E3o\">\n <mat-icon>edit</mat-icon>\n </button>\n }\n </p>\n }\n </div>\n @if (getSectionHeaderActions(section).length) {\n <div class=\"section-heading-actions\" [class.align-center]=\"getSectionHeaderAlign(section) === 'center'\">\n @for (action of getSectionHeaderActions(section); track action.id) {\n <button\n type=\"button\"\n class=\"section-heading-action-btn\"\n mat-icon-button\n [color]=\"getSectionHeaderActionColor(action)\"\n [disabled]=\"isSectionHeaderActionDisabled(action)\"\n [matTooltip]=\"getSectionHeaderActionTooltip(action)\"\n [attr.aria-label]=\"action.label\"\n [attr.aria-busy]=\"action.loading ? 'true' : null\"\n [ngClass]=\"getSectionHeaderActionNgClass(action)\"\n [ngStyle]=\"getSectionHeaderActionStyles(action)\"\n (click)=\"onSectionHeaderActionClick(section, action, $event)\"\n >\n @if (action.loading) {\n <mat-progress-spinner diameter=\"16\" mode=\"indeterminate\"></mat-progress-spinner>\n <span class=\"section-heading-action-sr-only\">{{ getSectionHeaderActionLoadingLabel(action) }}</span>\n } @else {\n <mat-icon [praxisIcon]=\"action.icon\"></mat-icon>\n }\n </button>\n }\n </div>\n }\n @if (isSectionCollapsible(section)) {\n <button type=\"button\" class=\"section-collapse-btn\" mat-icon-button\n (click)=\"toggleSectionCollapse($event, section)\" [attr.aria-expanded]=\"!isSectionCollapsed(section)\"\n [attr.aria-controls]=\"sectionPanelId(section, sectionIndex)\"\n [attr.aria-label]=\"isSectionCollapsed(section) ? 'Expandir se\u00E7\u00E3o' : 'Recolher se\u00E7\u00E3o'\">\n <mat-icon [praxisIcon]=\"isSectionCollapsed(section) ? 'expand_more' : 'expand_less'\"></mat-icon>\n </button>\n }\n </div>\n\n <div class=\"section-body\" [class.collapsed]=\"isSectionCollapsed(section)\"\n [attr.id]=\"sectionPanelId(section, sectionIndex)\"\n [attr.aria-labelledby]=\"getSectionTitle(section) ? sectionPanelId(section, sectionIndex) + '-title' : null\">\n @if (!isSectionCollapsed(section)) {\n @for (row of section.rows; track (row.id ?? $index); let rowIndex = $index) {\n @if (isRowVisible(row)) {\n <div class=\"row-drop-wrapper\" [attr.data-section-id]=\"section.id\">\n <div #rowEl class=\"form-row grid-12 canvas-element\" data-canvas-type=\"row\" [attr.data-row-index]=\"rowIndex\"\n [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\" [style.--pfx-grid-gap.px]=\"getRowGap(row)\"\n [style.--pfx-field-gap.px]=\"getRowRowGap(row)\"\n [style.--pfx-mount-index]=\"rowIndex\"\n [style.marginBottom.px]=\"rowIndex < section.rows.length - 1 ? (getRowRowGap(row) ?? null) : null\"\n [ngClass]=\"getRowClasses(row)\" [ngStyle]=\"getRowStyles(row)\"\n (mouseenter)=\"onElementMouseEnter($event, 'row', row, rowEl)\" (mouseleave)=\"onElementMouseLeave($event)\"\n (click)=\"onElementClick($event, 'row', row, rowEl)\" [class.selected]=\"selectedElement?.domElement === rowEl\"\n [class.hovered]=\"hoveredElement?.domElement === rowEl && selectedElement?.domElement !== rowEl\">\n @for (column of row.columns; track (column.id ?? $index); let colIndex = $index) {\n @if (isColumnVisible(column)) {\n <div class=\"column-drop-wrapper\" [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\">\n <div #colEl class=\"form-column canvas-element\" [ngClass]=\"getColumnClasses(column)\"\n [style.padding.px]=\"getColumnPadding(column)\" [style.--pfx-field-gap.px]=\"getRowRowGap(row)\"\n [ngStyle]=\"getColumnStyles(column)\" [attr.data-testid]=\"column.testId || null\"\n [attr.data-row-gap]=\"getRowRowGap(row)\" data-canvas-type=\"column\" [attr.data-column-index]=\"colIndex\"\n [attr.data-row-index]=\"rowIndex\" [attr.data-section-id]=\"section.id\" [attr.data-row-id]=\"row.id\"\n [attr.data-column-id]=\"column.id\" (mouseenter)=\"onElementMouseEnter($event, 'column', column, colEl)\"\n (mouseleave)=\"onElementMouseLeave($event)\" (click)=\"onElementClick($event, 'column', column, colEl)\"\n [class.selected]=\"selectedElement?.domElement === colEl\"\n [class.hovered]=\"hoveredElement?.domElement === colEl && selectedElement?.domElement !== colEl\">\n <ng-container dynamicFieldLoader [fields]=\"getColumnFields(column)\" [formGroup]=\"form\"\n [readonlyMode]=\"readonlyModeGlobal === null ? null : readonlyModeGlobal\"\n [disabledMode]=\"disabledModeGlobal === null ? null : disabledModeGlobal\"\n [presentationMode]=\"presentationForLoader\" [visible]=\"visibleGlobal === null ? null : visibleGlobal\"\n [canvasMode]=\"enableCustomization\" (canvasMouseEnter)=\"onFieldMouseEnter($event)\"\n (canvasMouseLeave)=\"onFieldMouseLeave($event)\" (canvasClick)=\"onFieldClick($event)\"\n (renderError)=\"onFieldRenderError($event)\">\n </ng-container>\n </div>\n </div>\n } }\n </div>\n </div>\n }\n }\n } @else {\n <div class=\"section-collapsed-placeholder\">\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'unfold_more'\"></mat-icon>\n <span>{{ getSectionCollapsedSummary(section) }}</span>\n </div>\n }\n @if (last && beforeActionsPlacement === 'insideLastSection' && formBlocksBeforeActions.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before-actions\" data-editorial-placement=\"beforeActions\">\n @for (block of formBlocksBeforeActions; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('beforeActions', $event)\">\n </ng-container>\n }\n </section>\n }\n @if (actionPlacement === 'insideLastSection' && last && !(effectivePresentation\n || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"insideLastSection\" [actions]=\"config.actions\"\n [isSubmitting]=\"submitting\" [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\"\n [actionOverrides]=\"actionRuleProps\" [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n </div>\n <!-- Overlay de bloqueio durante submiss\u00E3o -->\n @if (submitting) {\n <div class=\"form-blocking-overlay\" aria-live=\"polite\">\n <mat-progress-spinner diameter=\"40\" color=\"primary\"></mat-progress-spinner>\n <p>{{ config.messages?.loading?.submit || 'Salvando...' }}</p>\n </div>\n }\n </div>\n\n @if (enableCustomization && selectedElement?.domElement === sectionEl) {\n <div class=\"add-section-container\">\n <div class=\"add-section-line\"></div>\n <button mat-fab color=\"primary\" aria-label=\"Adicionar nova se\u00E7\u00E3o\" (click)=\"addNewSectionAfter(sectionIndex)\"\n matTooltip=\"Adicionar nova se\u00E7\u00E3o aqui\">\n <mat-icon [praxisIcon]=\"'add'\"></mat-icon>\n </button>\n <div class=\"add-section-line\"></div>\n </div>\n }\n }\n </div>\n }\n\n @if (beforeActionsPlacement !== 'insideLastSection' && formBlocksBeforeActions.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-before-actions\" data-editorial-placement=\"beforeActions\">\n @for (block of formBlocksBeforeActions; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('beforeActions', $event)\">\n </ng-container>\n }\n </section>\n }\n\n @if (actionPlacement === 'afterSections' && !(effectivePresentation || effectiveReadonly)) {\n <praxis-form-actions data-actions-placement=\"afterSections\" [actions]=\"config.actions\" [isSubmitting]=\"submitting\"\n [formIsValid]=\"form.valid\" [submitError]=\"submitError\" [formId]=\"formId\"\n [actionOverrides]=\"actionRuleProps\" [editorialVisualContext]=\"hasEditorialVisualContext()\"\n (action)=\"onFormAction($event)\"></praxis-form-actions>\n }\n\n @if (formBlocksAfter.length) {\n <section class=\"form-editorial-blocks form-editorial-blocks-after\" data-editorial-placement=\"after\">\n @for (block of formBlocksAfter; track (block.id ?? $index)) {\n <ng-container\n [dynamicWidgetLoader]=\"block\"\n [context]=\"getEditorialWidgetContext()\"\n [strictValidation]=\"true\"\n [autoWireOutputs]=\"true\"\n (widgetEvent)=\"onEditorialWidgetEvent('after', $event)\">\n </ng-container>\n }\n </section>\n }\n</form>\n@if (!enableCustomization && mode === 'view') {\n<div class=\"ai-floating-assistant\">\n <praxis-ai-assistant [adapter]=\"aiAdapter\"></praxis-ai-assistant>\n</div>\n}\n}\n", styles: ["@charset \"UTF-8\";.span-xs-1{grid-column:span 1}.span-xs-2{grid-column:span 2}.span-xs-3{grid-column:span 3}.span-xs-4{grid-column:span 4}.span-xs-5{grid-column:span 5}.span-xs-6{grid-column:span 6}.span-xs-7{grid-column:span 7}.span-xs-8{grid-column:span 8}.span-xs-9{grid-column:span 9}.span-xs-10{grid-column:span 10}.span-xs-11{grid-column:span 11}.span-xs-12{grid-column:span 12}.offset-xs-0{margin-left:0%}.offset-xs-1{margin-left:calc(1 / 12 * 100%)}.offset-xs-2{margin-left:calc(2 / 12 * 100%)}.offset-xs-3{margin-left:25%}.offset-xs-4{margin-left:calc(4 / 12 * 100%)}.offset-xs-5{margin-left:calc(5 / 12 * 100%)}.offset-xs-6{margin-left:50%}.offset-xs-7{margin-left:calc(7 / 12 * 100%)}.offset-xs-8{margin-left:calc(8 / 12 * 100%)}.offset-xs-9{margin-left:75%}.offset-xs-10{margin-left:calc(10 / 12 * 100%)}.offset-xs-11{margin-left:calc(11 / 12 * 100%)}.order-xs--12{order:-12}.order-xs--11{order:-11}.order-xs--10{order:-10}.order-xs--9{order:-9}.order-xs--8{order:-8}.order-xs--7{order:-7}.order-xs--6{order:-6}.order-xs--5{order:-5}.order-xs--4{order:-4}.order-xs--3{order:-3}.order-xs--2{order:-2}.order-xs--1{order:-1}.order-xs-0{order:0}.order-xs-1{order:1}.order-xs-2{order:2}.order-xs-3{order:3}.order-xs-4{order:4}.order-xs-5{order:5}.order-xs-6{order:6}.order-xs-7{order:7}.order-xs-8{order:8}.order-xs-9{order:9}.order-xs-10{order:10}.order-xs-11{order:11}.order-xs-12{order:12}.hidden-xs{display:none}@media(min-width:600px){.span-sm-1{grid-column:span 1}.span-sm-2{grid-column:span 2}.span-sm-3{grid-column:span 3}.span-sm-4{grid-column:span 4}.span-sm-5{grid-column:span 5}.span-sm-6{grid-column:span 6}.span-sm-7{grid-column:span 7}.span-sm-8{grid-column:span 8}.span-sm-9{grid-column:span 9}.span-sm-10{grid-column:span 10}.span-sm-11{grid-column:span 11}.span-sm-12{grid-column:span 12}.offset-sm-0{margin-left:0%}.offset-sm-1{margin-left:calc(1 / 12 * 100%)}.offset-sm-2{margin-left:calc(2 / 12 * 100%)}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:calc(4 / 12 * 100%)}.offset-sm-5{margin-left:calc(5 / 12 * 100%)}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:calc(7 / 12 * 100%)}.offset-sm-8{margin-left:calc(8 / 12 * 100%)}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:calc(10 / 12 * 100%)}.offset-sm-11{margin-left:calc(11 / 12 * 100%)}.order-sm--12{order:-12}.order-sm--11{order:-11}.order-sm--10{order:-10}.order-sm--9{order:-9}.order-sm--8{order:-8}.order-sm--7{order:-7}.order-sm--6{order:-6}.order-sm--5{order:-5}.order-sm--4{order:-4}.order-sm--3{order:-3}.order-sm--2{order:-2}.order-sm--1{order:-1}.order-sm-0{order:0}.order-sm-1{order:1}.order-sm-2{order:2}.order-sm-3{order:3}.order-sm-4{order:4}.order-sm-5{order:5}.order-sm-6{order:6}.order-sm-7{order:7}.order-sm-8{order:8}.order-sm-9{order:9}.order-sm-10{order:10}.order-sm-11{order:11}.order-sm-12{order:12}.hidden-sm{display:none}}@media(min-width:900px){.span-md-1{grid-column:span 1}.span-md-2{grid-column:span 2}.span-md-3{grid-column:span 3}.span-md-4{grid-column:span 4}.span-md-5{grid-column:span 5}.span-md-6{grid-column:span 6}.span-md-7{grid-column:span 7}.span-md-8{grid-column:span 8}.span-md-9{grid-column:span 9}.span-md-10{grid-column:span 10}.span-md-11{grid-column:span 11}.span-md-12{grid-column:span 12}.offset-md-0{margin-left:0%}.offset-md-1{margin-left:calc(1 / 12 * 100%)}.offset-md-2{margin-left:calc(2 / 12 * 100%)}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:calc(4 / 12 * 100%)}.offset-md-5{margin-left:calc(5 / 12 * 100%)}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:calc(7 / 12 * 100%)}.offset-md-8{margin-left:calc(8 / 12 * 100%)}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:calc(10 / 12 * 100%)}.offset-md-11{margin-left:calc(11 / 12 * 100%)}.order-md--12{order:-12}.order-md--11{order:-11}.order-md--10{order:-10}.order-md--9{order:-9}.order-md--8{order:-8}.order-md--7{order:-7}.order-md--6{order:-6}.order-md--5{order:-5}.order-md--4{order:-4}.order-md--3{order:-3}.order-md--2{order:-2}.order-md--1{order:-1}.order-md-0{order:0}.order-md-1{order:1}.order-md-2{order:2}.order-md-3{order:3}.order-md-4{order:4}.order-md-5{order:5}.order-md-6{order:6}.order-md-7{order:7}.order-md-8{order:8}.order-md-9{order:9}.order-md-10{order:10}.order-md-11{order:11}.order-md-12{order:12}.hidden-md{display:none}}@media(min-width:1200px){.span-lg-1{grid-column:span 1}.span-lg-2{grid-column:span 2}.span-lg-3{grid-column:span 3}.span-lg-4{grid-column:span 4}.span-lg-5{grid-column:span 5}.span-lg-6{grid-column:span 6}.span-lg-7{grid-column:span 7}.span-lg-8{grid-column:span 8}.span-lg-9{grid-column:span 9}.span-lg-10{grid-column:span 10}.span-lg-11{grid-column:span 11}.span-lg-12{grid-column:span 12}.offset-lg-0{margin-left:0%}.offset-lg-1{margin-left:calc(1 / 12 * 100%)}.offset-lg-2{margin-left:calc(2 / 12 * 100%)}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:calc(4 / 12 * 100%)}.offset-lg-5{margin-left:calc(5 / 12 * 100%)}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:calc(7 / 12 * 100%)}.offset-lg-8{margin-left:calc(8 / 12 * 100%)}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:calc(10 / 12 * 100%)}.offset-lg-11{margin-left:calc(11 / 12 * 100%)}.order-lg--12{order:-12}.order-lg--11{order:-11}.order-lg--10{order:-10}.order-lg--9{order:-9}.order-lg--8{order:-8}.order-lg--7{order:-7}.order-lg--6{order:-6}.order-lg--5{order:-5}.order-lg--4{order:-4}.order-lg--3{order:-3}.order-lg--2{order:-2}.order-lg--1{order:-1}.order-lg-0{order:0}.order-lg-1{order:1}.order-lg-2{order:2}.order-lg-3{order:3}.order-lg-4{order:4}.order-lg-5{order:5}.order-lg-6{order:6}.order-lg-7{order:7}.order-lg-8{order:8}.order-lg-9{order:9}.order-lg-10{order:10}.order-lg-11{order:11}.order-lg-12{order:12}.hidden-lg{display:none}}@media(min-width:1536px){.span-xl-1{grid-column:span 1}.span-xl-2{grid-column:span 2}.span-xl-3{grid-column:span 3}.span-xl-4{grid-column:span 4}.span-xl-5{grid-column:span 5}.span-xl-6{grid-column:span 6}.span-xl-7{grid-column:span 7}.span-xl-8{grid-column:span 8}.span-xl-9{grid-column:span 9}.span-xl-10{grid-column:span 10}.span-xl-11{grid-column:span 11}.span-xl-12{grid-column:span 12}.offset-xl-0{margin-left:0%}.offset-xl-1{margin-left:calc(1 / 12 * 100%)}.offset-xl-2{margin-left:calc(2 / 12 * 100%)}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:calc(4 / 12 * 100%)}.offset-xl-5{margin-left:calc(5 / 12 * 100%)}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:calc(7 / 12 * 100%)}.offset-xl-8{margin-left:calc(8 / 12 * 100%)}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:calc(10 / 12 * 100%)}.offset-xl-11{margin-left:calc(11 / 12 * 100%)}.order-xl--12{order:-12}.order-xl--11{order:-11}.order-xl--10{order:-10}.order-xl--9{order:-9}.order-xl--8{order:-8}.order-xl--7{order:-7}.order-xl--6{order:-6}.order-xl--5{order:-5}.order-xl--4{order:-4}.order-xl--3{order:-3}.order-xl--2{order:-2}.order-xl--1{order:-1}.order-xl-0{order:0}.order-xl-1{order:1}.order-xl-2{order:2}.order-xl-3{order:3}.order-xl-4{order:4}.order-xl-5{order:5}.order-xl-6{order:6}.order-xl-7{order:7}.order-xl-8{order:8}.order-xl-9{order:9}.order-xl-10{order:10}.order-xl-11{order:11}.order-xl-12{order:12}.hidden-xl{display:none}}.canvas-mode-enabled{--canvas-hit: 14px}.canvas-mode-enabled .canvas-element{position:relative;z-index:0;border-radius:8px;outline:2px solid transparent;outline-offset:2px;transition:outline-color .2s ease,outline-style .2s ease}.canvas-mode-enabled .canvas-element:before{content:\"\";position:absolute;inset:calc(-1 * var(--canvas-hit));pointer-events:none;border-radius:inherit;background:transparent}.canvas-mode-enabled .canvas-element[data-canvas-type=section]{--outline-color: var(--md-sys-color-primary)}.canvas-mode-enabled .canvas-element[data-canvas-type=row]{--outline-color: var(--md-sys-color-secondary)}.canvas-mode-enabled .canvas-element[data-canvas-type=column],.canvas-mode-enabled .canvas-element[data-canvas-type=field]{--outline-color: var(--md-sys-color-tertiary)}.canvas-mode-enabled .canvas-element[data-canvas-type=actions]{--outline-color: var(--md-sys-color-primary)}.canvas-mode-enabled .canvas-element.hovered:not(.selected){outline-color:var(--outline-color, var(--md-sys-color-primary));outline-style:dashed}.canvas-mode-enabled .canvas-element.selected{outline-color:var(--outline-color, var(--md-sys-color-primary));outline-style:solid;box-shadow:0 0 0 2px var(--outline-color, var(--md-sys-color-primary))}.canvas-mode-enabled .canvas-element.hovered{z-index:var(--praxis-layer-authoring-hover, 300)}.canvas-mode-enabled .canvas-element.selected{z-index:var(--praxis-layer-authoring-selected, 320)}.section-drop-wrapper,.row-drop-wrapper,.column-drop-wrapper{display:contents}.add-section-container{display:flex;align-items:center;justify-content:center;padding:.5rem 0;margin:-.5rem 0;position:relative;z-index:var(--praxis-layer-authoring-insert, 280)}.add-section-container .add-section-line{flex-grow:1;height:1px;background:repeating-linear-gradient(90deg,var(--md-sys-color-outline-variant),var(--md-sys-color-outline-variant) 4px,transparent 4px,transparent 8px)}.add-section-container button{margin:0 1rem;transform:scale(.85)}:host{display:block;position:relative}.form-config-controls{position:sticky;top:10px;margin-left:auto;margin-bottom:10px;display:flex;align-items:center;gap:.35rem;z-index:60;background:color-mix(in srgb,var(--md-sys-color-surface) 92%,transparent);padding:6px;border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 82%,transparent);border-radius:999px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 10px 22px #0f172a14;min-width:0;justify-content:flex-end;pointer-events:none;opacity:.88;transition:opacity .16s ease,box-shadow .16s ease,border-color .16s ease,transform .16s ease}.form-config-controls>*{pointer-events:auto}.praxis-dynamic-form:hover .form-config-controls,.praxis-dynamic-form:focus-within .form-config-controls{opacity:1;border-color:color-mix(in srgb,var(--md-sys-color-primary) 26%,var(--md-sys-color-outline-variant) 74%);box-shadow:0 14px 28px #0f172a1f;transform:translateY(-1px)}.form-config-controls .mat-icon-button{--mdc-icon-button-state-layer-size: 34px;width:34px;height:34px;color:var(--md-sys-color-on-surface-variant);background:color-mix(in srgb,var(--md-sys-color-surface-container-low) 82%,transparent);border:1px solid transparent}.form-config-controls .mat-icon-button:hover{color:var(--md-sys-color-primary);background:var(--md-sys-color-primary-container);border-color:color-mix(in srgb,var(--md-sys-color-primary) 20%,transparent)}.ai-floating-assistant{position:sticky;right:0;bottom:12px;margin-top:14px;margin-left:auto;width:fit-content;z-index:70;pointer-events:none}.ai-floating-assistant praxis-ai-assistant{pointer-events:auto;display:inline-flex}.ai-floating-assistant .ai-trigger-btn{box-shadow:0 12px 28px #0f172a24}.config-button{color:var(--md-sys-color-primary)}.form-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center;color:var(--md-sys-color-on-surface);gap:1rem}.form-loading p{margin:0;font-size:.875rem;opacity:.7}.form-error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;text-align:center;color:var(--md-sys-color-error);gap:1rem;border:1px solid var(--md-sys-color-error);border-radius:8px;background-color:var(--md-sys-color-error-container);margin:1rem;box-shadow:0 12px 30px #7f1d1d1f}.form-error h3{margin:0;color:var(--md-sys-color-on-error-container)}.form-error p{margin:0;color:var(--md-sys-color-on-error-container);opacity:.8}.form-error button{margin-top:.5rem}.pfx-form-info-banner{margin-bottom:14px;padding:12px 14px;border-radius:16px;border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 18%,var(--md-sys-color-outline-variant) 82%);background:color-mix(in srgb,var(--md-sys-color-primary-container) 24%,var(--md-sys-color-surface) 76%);color:var(--md-sys-color-on-surface);display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.pfx-form-info-banner .text{font-size:.92rem;line-height:1.5;font-weight:600}.pfx-form-info-banner .actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.praxis-dynamic-form{display:flex;flex-direction:column;transition:all .3s ease;position:relative;font-family:inherit;font-size:inherit;color:inherit;--pfx-editorial-form-surface: var( --pfx-form-section-surface, var(--md-sys-color-surface-container) );--pfx-editorial-form-surface-muted: var(--md-sys-color-surface-container-low);--pfx-editorial-form-border: var( --pfx-form-stroke, var(--md-sys-color-outline-variant) );--pfx-editorial-form-text: var(--md-sys-color-on-surface);--pfx-editorial-form-text-muted: var(--md-sys-color-on-surface-variant);--pfx-editorial-form-field-surface: color-mix( in srgb, var(--pfx-editorial-form-surface-muted) 76%, var(--pfx-editorial-form-surface) 24% );--pfx-editorial-form-field-outline: color-mix( in srgb, var(--pfx-editorial-form-border) 88%, transparent );--pfx-editorial-form-accent: var(--md-sys-color-primary);--pfx-editorial-form-accent-text: var(--md-sys-color-on-primary);--pfx-editorial-form-radius: var(--pfx-form-section-radius, 8px);--pfx-editorial-form-field-radius: var(--pfx-form-field-radius, 4px);--pfx-editorial-form-border-width: 1px;--pfx-editorial-form-field-border-width: 1px;--pfx-editorial-form-shadow: none;--pfx-form-shell-surface: color-mix( in srgb, var(--pfx-editorial-form-surface) 36%, transparent );--pfx-form-section-surface-flat: color-mix( in srgb, var(--pfx-editorial-form-surface) 78%, var(--pfx-editorial-form-surface-muted) 22% );--pfx-form-section-divider: color-mix( in srgb, var(--pfx-editorial-form-border) 68%, transparent );--pfx-form-label-strong: color-mix( in srgb, var(--pfx-editorial-form-text) 96%, white 4% );--pfx-form-label-muted: color-mix( in srgb, var(--pfx-editorial-form-text-muted) 92%, var(--pfx-editorial-form-text) 8% );--pfx-form-field-surface-rest: color-mix( in srgb, var(--pfx-editorial-form-field-surface) 82%, var(--pfx-editorial-form-surface) 18% );--pfx-form-field-surface-focus: color-mix( in srgb, var(--pfx-editorial-form-accent) 4%, var(--pfx-form-field-surface-rest) 96% );--pfx-form-field-min-height: 48px;--pfx-form-section-padding: clamp(1.1rem, 1.8vw, 1.5rem);--pfx-form-section-gap: 22px;--pfx-form-footer-surface: color-mix( in srgb, var(--pfx-editorial-form-surface) 70%, var(--pfx-editorial-form-surface-muted) 30% );--pfx-form-footer-border: color-mix( in srgb, var(--pfx-editorial-form-border) 76%, transparent )}.praxis-dynamic-form.editorial-visual-context{font-family:var(--editorial-body-font-family, inherit);font-size:var(--editorial-body-size, 1rem);color:var(--editorial-text-primary, var(--md-sys-color-on-surface));--pfx-editorial-form-surface: var( --editorial-surface-primary, var(--pfx-form-section-surface, var(--md-sys-color-surface-container)) );--pfx-editorial-form-surface-muted: var( --editorial-surface-secondary, var(--md-sys-color-surface-container-low) );--pfx-editorial-form-border: var( --editorial-border-color, var(--pfx-form-stroke, var(--md-sys-color-outline-variant)) );--pfx-editorial-form-text: var( --editorial-text-primary, var(--md-sys-color-on-surface) );--pfx-editorial-form-text-muted: var( --editorial-text-secondary, var(--md-sys-color-on-surface-variant) );--pfx-editorial-form-accent: var( --editorial-cta-primary, var(--editorial-accent, var(--md-sys-color-primary)) );--pfx-editorial-form-accent-text: var( --editorial-cta-primary-text, var(--editorial-accent-contrast, var(--md-sys-color-on-primary)) );--pfx-editorial-form-radius: var(--editorial-card-radius, 18px);--pfx-editorial-form-field-radius: var( --editorial-field-radius, var(--editorial-card-radius, 14px) );--pfx-editorial-form-border-width: var(--editorial-card-border-width, 1px);--pfx-editorial-form-field-border-width: var(--editorial-field-border-width, 1px);--pfx-editorial-form-shadow: var(--editorial-card-shadow, none);--md-sys-color-surface: var( --pfx-editorial-form-surface, var(--md-sys-color-surface) );--md-sys-color-surface-container: var( --pfx-editorial-form-surface, var(--md-sys-color-surface-container) );--md-sys-color-surface-container-low: var( --pfx-editorial-form-surface-muted, var(--md-sys-color-surface-container-low) );--md-sys-color-surface-variant: var( --pfx-editorial-form-field-surface, var(--md-sys-color-surface-variant) );--md-sys-color-outline: var( --pfx-editorial-form-field-outline, var(--md-sys-color-outline) );--md-sys-color-outline-variant: var( --pfx-editorial-form-border, var(--md-sys-color-outline-variant) );--md-sys-color-on-surface: var( --pfx-editorial-form-text, var(--md-sys-color-on-surface) );--md-sys-color-on-surface-variant: var( --pfx-editorial-form-text-muted, var(--md-sys-color-on-surface-variant) );--md-sys-color-primary: var( --pfx-editorial-form-accent, var(--md-sys-color-primary) );--md-sys-color-on-primary: var( --pfx-editorial-form-accent-text, var(--md-sys-color-on-primary) );--md-sys-color-on-surface-rgb: var( --editorial-text-primary-rgb, var(--md-sys-color-on-surface-rgb) );--mat-sys-on-surface: var( --pfx-editorial-form-text, var(--mat-sys-on-surface) );--mat-sys-on-surface-variant: var( --pfx-editorial-form-text-muted, var(--mat-sys-on-surface-variant) );--mat-sys-on-surface-rgb: var( --editorial-text-primary-rgb, var(--mat-sys-on-surface-rgb, var(--md-sys-color-on-surface-rgb)) );color:var(--pfx-editorial-form-text);color-scheme:light}.praxis-dynamic-form.presentation-mode .form-row,.praxis-dynamic-form.readonly-mode .form-row{gap:.5rem;margin-bottom:.5rem}.praxis-dynamic-form.presentation-mode .form-section,.praxis-dynamic-form.readonly-mode .form-section{padding:.75rem .875rem}.praxis-dynamic-form.pres-compact .form-row{gap:.35rem;margin-bottom:.35rem}.praxis-dynamic-form.pres-compact .form-section{padding:.5rem .75rem}.praxis-dynamic-form.pres-label-left .praxis-presentation{display:grid;grid-template-columns:var(--pfx-presentation-label-w, 220px) 1fr;align-items:baseline;column-gap:10px}.praxis-dynamic-form.pres-label-left .praxis-presentation__label{text-align:right;margin-bottom:0}.form-section{border:1px solid var(--pfx-form-section-divider);border-radius:var(--pfx-editorial-form-radius);padding:var(--pfx-form-section-padding);background:var(--pfx-form-section-surface-flat);box-shadow:none;transition:all .2s ease;position:relative}.praxis-dynamic-form.editorial-visual-context .form-section{border:var(--pfx-editorial-form-border-width) solid var(--pfx-editorial-form-border)!important;background:var(--pfx-editorial-form-surface)!important;box-shadow:var(--editorial-card-shadow, none)}.praxis-dynamic-form.editorial-visual-context .form-section.section-appearance-step{background-color:var(--pfx-editorial-form-surface)!important;background-image:linear-gradient(180deg,color-mix(in srgb,var(--editorial-accent, var(--md-sys-color-primary)) 6%,transparent) 0%,transparent 132px)!important;background-repeat:no-repeat!important}.section-drop-wrapper>.form-section{margin-bottom:var(--pfx-section-gap, 20px)}.section-drop-wrapper:last-of-type>.form-section{margin-bottom:0}.praxis-dynamic-form>praxis-form-actions[data-actions-placement=afterSections] .form-actions{margin-top:var(--pfx-actions-gap-top, var(--pfx-section-gap, 20px))}.section-title{margin:0 0 var(--pfx-section-title-mb, 12px) 0;font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));font-size:var(--editorial-step-title-size, 1.12rem);font-weight:700;color:var(--pfx-form-label-strong)}.section-heading{display:flex;align-items:flex-start;gap:12px;margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--pfx-form-section-divider)}.section-heading.align-center{flex-direction:column;align-items:center;text-align:center}.section-heading.align-center .section-heading-text{display:grid;justify-items:center}.section-step-label{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;margin:0 0 8px;border-radius:999px;background:color-mix(in srgb,var(--pfx-editorial-form-accent) 10%,transparent);color:color-mix(in srgb,var(--pfx-editorial-form-accent) 84%,var(--pfx-form-label-strong) 16%);font-size:.72rem;font-weight:800;font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));letter-spacing:.08em;text-transform:uppercase}.section-heading-text{flex:1 1 auto;min-width:0}.section-heading-actions{display:inline-flex;align-items:center;align-self:flex-start;flex-wrap:wrap;gap:4px;margin-left:auto}.section-heading-actions.align-center{align-self:center;margin-left:0}.section-heading-action-btn{color:var(--pfx-form-label-muted)}.section-heading-action-btn .mat-mdc-progress-spinner,.section-heading-action-btn mat-progress-spinner{--mdc-circular-progress-active-indicator-color: currentColor}.section-heading-action-btn.loading{opacity:.72;pointer-events:none}.section-heading-action-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.section-collapse-btn{margin-left:4px;color:var(--pfx-form-label-muted)}.section-title.title-large{font:var(--mdc-typography-title-large, 500 22px/28px system-ui)}.section-title.title-medium{font:var(--mdc-typography-title-medium, 500 16px/24px system-ui)}.section-title.title-small{font:var(--mdc-typography-title-small, 500 14px/20px system-ui)}.section-title.headline-small{font:var(--mdc-typography-headline-small, 600 24px/32px system-ui)}.section-title.title-large,.section-title.title-medium,.section-title.title-small,.section-title.headline-small{font-family:var(--editorial-title-font-family, var(--editorial-body-font-family, inherit));font-weight:var(--editorial-title-weight, 600)}.section-description{margin:0;font-family:var(--editorial-body-font-family, inherit);font-size:.93rem;color:var(--pfx-form-label-muted);line-height:1.6}.section-description.body-large{font:var(--mdc-typography-body-large, 400 16px/24px system-ui)}.section-description.body-medium{font:var(--mdc-typography-body-medium, 400 14px/20px system-ui)}.section-description.body-small{font:var(--mdc-typography-body-small, 400 12px/16px system-ui)}.section-description.body-large,.section-description.body-medium,.section-description.body-small{font-family:var(--editorial-body-font-family, inherit);font-weight:var(--editorial-body-weight, 400)}.section-title.align-center,.section-description.align-center,.section-step-label.align-center{text-align:center}.form-section.section-appearance-plain{border-color:transparent;border-radius:0;padding:0;background:transparent}.form-section.section-appearance-plain .section-heading{margin-bottom:14px}.form-section.section-appearance-step{border-radius:var(--pfx-editorial-form-radius);padding:var(--pfx-form-section-padding);background:var(--pfx-form-section-surface-flat);border-color:var(--pfx-form-section-divider);box-shadow:none}.praxis-dynamic-form.editorial-visual-context .form-section.section-appearance-step{border-radius:var(--editorial-card-radius, 20px);box-shadow:none}.form-section.section-appearance-step .section-heading{margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid var(--pfx-form-section-divider)}.form-section.section-appearance-step .section-title{font:var(--mdc-typography-title-large, 700 22px/28px system-ui);color:var(--pfx-form-label-strong);margin-bottom:8px}.form-section.section-appearance-step .section-description{color:var(--pfx-form-label-muted);max-width:60ch}.form-section.section-appearance-step .section-step-label{min-height:24px;padding:0 10px;margin-bottom:10px;box-shadow:none}.form-section.section-appearance-step .section-heading.align-center .section-description{max-width:52ch}.form-section.section-appearance-step .section-body{display:grid;gap:8px;padding-top:0}.form-section.section-appearance-step .form-row{margin-bottom:var(--pfx-field-gap, 1rem)}.form-section.section-appearance-step .form-column{gap:var(--pfx-field-gap, 12px)}.form-section .form-editorial-blocks{display:grid;gap:16px}.form-section .form-editorial-blocks[data-editorial-placement=beforeActions]{margin-top:24px;padding-top:18px;border-top:1px solid var(--pfx-form-section-divider)}.form-section.section-appearance-step .form-editorial-blocks[data-editorial-placement=beforeActions]{gap:18px}.form-section.section-appearance-step .form-editorial-blocks[data-editorial-placement=beforeActions]>*+*{margin-top:2px}.praxis-dynamic-form>praxis-form-actions[data-actions-placement=afterSections] .form-actions{margin-top:18px;padding-top:0}.praxis-dynamic-form>.form-editorial-blocks[data-editorial-placement=after]{margin-top:6px}:host-context(.mdc-theme-dark) .form-section.section-appearance-step,:host-context(.theme-dark) .form-section.section-appearance-step{border-color:color-mix(in srgb,var(--pfx-editorial-form-border) 82%,transparent);box-shadow:none}:host-context(.mdc-theme-dark) .form-section.section-appearance-step .section-title,:host-context(.theme-dark) .form-section.section-appearance-step .section-title{color:color-mix(in srgb,var(--pfx-editorial-form-text) 96%,white)}:host-context(.mdc-theme-dark) .form-section.section-appearance-step .section-description,:host-context(.theme-dark) .form-section.section-appearance-step .section-description{color:color-mix(in srgb,var(--pfx-editorial-form-text-muted) 86%,var(--pfx-editorial-form-text) 14%)}:host-context(.mdc-theme-dark) .section-step-label,:host-context(.theme-dark) .section-step-label{background:color-mix(in srgb,var(--md-sys-color-primary-container) 54%,transparent);color:color-mix(in srgb,var(--md-sys-color-primary) 88%,white)}:host-context(.mdc-theme-dark) .form-section .form-editorial-blocks[data-editorial-placement=beforeActions],:host-context(.theme-dark) .form-section .form-editorial-blocks[data-editorial-placement=beforeActions]{border-top-color:color-mix(in srgb,var(--md-sys-color-outline-variant) 90%,transparent)}.inline-edit-btn{margin-left:6px;vertical-align:middle;--mdc-icon-button-size: 28px;--mdc-icon-button-icon-size: 16px}.inline-edit-btn mat-icon{font-size:16px;width:16px;height:16px}.section-body.collapsed{border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-low);border-radius:6px;padding:8px 10px}.section-collapsed-placeholder{display:flex;align-items:center;gap:8px;color:var(--md-sys-color-on-surface-variant);font-size:.95rem}.section-collapsed-placeholder mat-icon{font-size:20px;width:20px;height:20px}.form-row{display:flex;gap:1.1rem;margin-bottom:var(--pfx-field-gap, 1.1rem);transition:all .2s ease;border-radius:6px;position:relative}.praxis-dynamic-form.pfx-mounting .form-row{opacity:0;transform:translateY(var(--pdx-form-mount-offset, 6px));animation:pdxFormMount var(--pdx-form-mount-duration, .16s) ease-out both;animation-delay:calc(var(--pfx-mount-index, 0) * var(--pdx-form-mount-stagger, 20ms))}@media(prefers-reduced-motion:reduce){.praxis-dynamic-form.pfx-mounting .form-row{animation:none;opacity:1;transform:none}}@keyframes pdxFormMount{to{opacity:1;transform:translateY(0)}}.praxis-dynamic-form .mat-mdc-form-field{width:100%;margin-bottom:var(--pfx-field-gap, 10px);font-family:inherit;--mdc-filled-text-field-container-color: var(--pfx-form-field-surface-rest);--mdc-filled-text-field-focus-active-indicator-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-active-indicator-color: var(--pfx-editorial-form-field-outline);--mdc-filled-text-field-hover-active-indicator-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-focus-label-text-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-label-text-color: var(--pfx-form-label-muted);--mdc-filled-text-field-input-text-color: var(--pfx-editorial-form-text);--mdc-filled-text-field-caret-color: var(--pfx-editorial-form-accent);--mdc-filled-text-field-input-text-placeholder-color: color-mix( in srgb, var(--pfx-editorial-form-text-muted) 82%, transparent );--mdc-outlined-text-field-outline-color: var(--pfx-editorial-form-field-outline);--mdc-outlined-text-field-hover-outline-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-focus-outline-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-focus-label-text-color: var(--pfx-editorial-form-accent);--mdc-outlined-text-field-label-text-color: var(--pfx-form-label-muted);--mdc-outlined-text-field-input-text-color: var(--pfx-editorial-form-text);--mdc-filled-text-field-container-shape: var(--pfx-editorial-form-field-radius);--mdc-outlined-text-field-container-shape: var(--pfx-editorial-form-field-radius);--mdc-filled-text-field-active-indicator-height: var(--pfx-editorial-form-field-border-width);--mdc-filled-text-field-focus-active-indicator-height: var(--pfx-editorial-form-field-border-width);--mdc-outlined-text-field-outline-width: var(--pfx-editorial-form-field-border-width);--mdc-outlined-text-field-focus-outline-width: var(--pfx-editorial-form-field-border-width);--mat-select-enabled-trigger-text-color: var(--pfx-editorial-form-text);--mat-select-enabled-arrow-color: var(--pfx-form-label-muted);--mat-form-field-enabled-select-arrow-color: var(--pfx-form-label-muted);--mat-form-field-focus-select-arrow-color: var(--pfx-editorial-form-accent);--mat-form-field-hover-state-layer-opacity: 0;--mat-form-field-focus-state-layer-opacity: 0}.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field{font-family:var(--editorial-body-font-family, inherit)}.praxis-dynamic-form .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mdc-text-field{background:var(--pfx-form-field-surface-rest);border-radius:var(--pfx-editorial-form-field-radius);min-height:var(--pfx-form-field-min-height);transition:background-color .16s ease,box-shadow .16s ease,border-color .16s ease}.praxis-dynamic-form.editorial-visual-context .mat-mdc-text-field-wrapper,.praxis-dynamic-form.editorial-visual-context .mdc-text-field,.praxis-dynamic-form.editorial-visual-context .mdc-text-field--filled,.praxis-dynamic-form.editorial-visual-context .mdc-text-field--outlined{background-color:var(--pfx-form-field-surface-rest)!important;background:var(--pfx-form-field-surface-rest)!important}.praxis-dynamic-form .mat-mdc-form-field .mdc-floating-label,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-hint,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-error,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-required-marker,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-select-arrow,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-select-placeholder,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-icon-suffix,.praxis-dynamic-form .mat-mdc-form-field .mat-mdc-form-field-icon-prefix{color:var(--pfx-form-label-muted)}.praxis-dynamic-form .mat-mdc-input-element,.praxis-dynamic-form .mat-mdc-select-value-text,.praxis-dynamic-form .mat-mdc-form-field-infix,.praxis-dynamic-form .mat-mdc-select-min-line{color:var(--pfx-editorial-form-text)}.praxis-dynamic-form .mat-mdc-form-field:hover .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mat-mdc-form-field:hover .mdc-text-field,.praxis-dynamic-form .mat-mdc-form-field.mat-focused .mat-mdc-text-field-wrapper,.praxis-dynamic-form .mat-mdc-form-field.mat-focused .mdc-text-field{background:var(--pfx-form-field-surface-focus)}.praxis-dynamic-form.editorial-visual-context .mat-mdc-input-element,.praxis-dynamic-form.editorial-visual-context .mat-mdc-select-value-text,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field-infix,.praxis-dynamic-form.editorial-visual-context .mat-mdc-select-min-line,.praxis-dynamic-form.editorial-visual-context .mdc-text-field__input{color:var(--pfx-editorial-form-text)!important;-webkit-text-fill-color:var(--pfx-editorial-form-text)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-hint,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-error,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-required-marker,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-select-arrow,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-select-placeholder,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-icon-suffix,.praxis-dynamic-form.editorial-visual-context .mat-mdc-form-field .mat-mdc-form-field-icon-prefix{color:var(--pfx-editorial-form-text-muted)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mdc-floating-label,.praxis-dynamic-form.editorial-visual-context .mdc-text-field__input::placeholder{color:color-mix(in srgb,var(--pfx-editorial-form-text) 68%,transparent)!important}.praxis-dynamic-form.editorial-visual-context .mat-mdc-input-element::placeholder,.praxis-dynamic-form.editorial-visual-context textarea.mat-mdc-input-element::placeholder{color:color-mix(in srgb,var(--pfx-editorial-form-text) 58%,transparent)!important}.praxis-dynamic-form .mat-mdc-radio-button,.praxis-dynamic-form .mat-mdc-checkbox,.praxis-dynamic-form .mat-mdc-slide-toggle{--mdc-radio-selected-icon-color: var(--pfx-editorial-form-accent);--mdc-radio-selected-hover-icon-color: var(--pfx-editorial-form-accent);--mdc-radio-selected-focus-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-checkmark-color: var(--pfx-editorial-form-accent-text);--mdc-checkbox-selected-focus-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-hover-icon-color: var(--pfx-editorial-form-accent);--mdc-checkbox-selected-icon-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-focus-state-layer-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-handle-color: var(--pfx-editorial-form-accent);--mdc-switch-selected-track-color: color-mix(in srgb, var(--pfx-editorial-form-accent) 45%, #fff)}.praxis-dynamic-form [data-field-type=input],.praxis-dynamic-form [data-field-type=textarea],.praxis-dynamic-form [data-field-type=email],.praxis-dynamic-form [data-field-type=password],.praxis-dynamic-form [data-field-type=url],.praxis-dynamic-form [data-field-type=search],.praxis-dynamic-form [data-field-type=phone],.praxis-dynamic-form [data-field-type=numericTextBox],.praxis-dynamic-form [data-field-type=currency],.praxis-dynamic-form [data-field-type=cpfCnpj],.praxis-dynamic-form [data-field-type=date],.praxis-dynamic-form [data-field-type=dateInput],.praxis-dynamic-form [data-field-type=dateRange],.praxis-dynamic-form [data-field-type=dateTimeLocal],.praxis-dynamic-form [data-field-type=time],.praxis-dynamic-form [data-field-type=timePicker],.praxis-dynamic-form [data-field-type=timeRange],.praxis-dynamic-form [data-field-type=month],.praxis-dynamic-form [data-field-type=week],.praxis-dynamic-form [data-field-type=yearInput],.praxis-dynamic-form [data-field-type=select],.praxis-dynamic-form [data-field-type=multi-select],.praxis-dynamic-form [data-field-type=searchable-select],.praxis-dynamic-form [data-field-type=async-select],.praxis-dynamic-form [data-field-type=autocomplete],.praxis-dynamic-form [data-field-type=tree-select],.praxis-dynamic-form [data-field-type=multi-select-tree],.praxis-dynamic-form [data-field-type=priceRange],.praxis-dynamic-form [data-field-type=file-upload]{display:block;width:100%;min-width:0}.praxis-dynamic-form .mat-mdc-form-field-subscript-wrapper{min-height:var(--pfx-subscript-min-h, 22px)}.form-row:last-child{margin-bottom:0}.form-column{display:grid;align-content:start;gap:var(--pfx-field-gap, 10px);flex:1;min-width:0;transition:all .2s ease;border-radius:4px;position:relative}.form-row.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--pfx-grid-gap, 16px)}.align-start{align-self:flex-start}.align-center{align-self:center}.align-end{align-self:flex-end}.align-stretch{align-self:stretch}.form-blocking-overlay{position:absolute;inset:0;background:transparent;color:var(--md-sys-color-on-surface);backdrop-filter:blur(2px) saturate(103%);-webkit-backdrop-filter:blur(2px) saturate(103%);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;z-index:10;pointer-events:all}@media(max-width:768px){.form-row{flex-direction:column;gap:.5rem}.form-section{padding:1rem}.section-heading{gap:10px;margin-bottom:16px;padding-bottom:14px}}.section-title{display:flex;align-items:center;gap:8px}.section-title .section-title-icon{font-size:1.25em;line-height:1}.section-title-avatar{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px));display:inline-flex;align-items:center;justify-content:center;width:var(--_pfx-form-section-avatar-size);height:var(--_pfx-form-section-avatar-size);border-radius:999px;flex:0 0 var(--_pfx-form-section-avatar-size);overflow:hidden}.section-title-avatar.size-sm{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-sm, 24px)}.section-title-avatar.size-md{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px))}.section-title-avatar.size-lg{--_pfx-form-section-avatar-size: var(--pfx-form-section-avatar-size-lg, 40px)}.section-title-avatar-image{object-fit:cover;border:1px solid color-mix(in srgb,var(--pfx-form-section-divider) 72%,transparent);background:var(--pfx-form-section-surface-flat)}.section-title-avatar-text,.section-title-avatar-placeholder{background:color-mix(in srgb,var(--pfx-editorial-form-accent) 14%,var(--pfx-form-section-surface-flat));color:color-mix(in srgb,var(--pfx-editorial-form-accent) 82%,var(--pfx-form-label-strong) 18%);font-size:calc(var(--_pfx-form-section-avatar-size) * .41);font-weight:800;letter-spacing:.04em;text-transform:uppercase}.section-title-avatar-placeholder mat-icon{font-size:calc(var(--_pfx-form-section-avatar-size) * .5625);width:calc(var(--_pfx-form-section-avatar-size) * .5625);height:calc(var(--_pfx-form-section-avatar-size) * .5625);line-height:calc(var(--_pfx-form-section-avatar-size) * .5625)}.section-title-avatar-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"] }]
|
|
11424
|
+
}], ctorParameters: () => [{ type: i1$2.GenericCrudService }, { type: i2.HttpClient }, { type: i1$3.FormBuilder }, { type: i0.ChangeDetectorRef }, { type: FormLayoutService }, { type: FormContextService }, { type: FormRulesService }, { type: i7.SettingsPanelService }, { type: i2$1.MatDialog }, { type: undefined, decorators: [{
|
|
11163
11425
|
type: Inject,
|
|
11164
11426
|
args: [ASYNC_CONFIG_STORAGE]
|
|
11165
11427
|
}] }, { type: undefined, decorators: [{
|
|
11166
11428
|
type: Inject,
|
|
11167
11429
|
args: [CONNECTION_STORAGE]
|
|
11168
|
-
}] }, { type: i1$2.DynamicFormService }, { type:
|
|
11430
|
+
}] }, { type: i1$2.DynamicFormService }, { type: i9$1.MatSnackBar }, { type: CanvasStateService }, { type: DynamicFormLayoutService }, { type: i1$2.ErrorMessageService }, { type: i1$2.SchemaNormalizerService }, { type: i1$2.ComponentMetadataRegistry }, { type: i1$2.GlobalConfigService }, { type: i1$2.ComponentKeyService }, { type: i1$2.LoadingOrchestrator }, { type: i0.NgZone }, { type: undefined, decorators: [{
|
|
11431
|
+
type: Inject,
|
|
11432
|
+
args: [API_URL]
|
|
11433
|
+
}] }, { type: undefined, decorators: [{
|
|
11169
11434
|
type: Optional
|
|
11170
11435
|
}, {
|
|
11171
11436
|
type: Inject,
|
|
11172
11437
|
args: [PRAXIS_LOADING_RENDERER]
|
|
11173
|
-
}] }, { type:
|
|
11438
|
+
}] }, { type: i12.Router, decorators: [{
|
|
11174
11439
|
type: Optional
|
|
11175
|
-
}] }, { type:
|
|
11440
|
+
}] }, { type: i12.ActivatedRoute, decorators: [{
|
|
11176
11441
|
type: Optional
|
|
11177
11442
|
}] }, { type: i1$2.FormHooksRegistry, decorators: [{
|
|
11178
11443
|
type: Optional
|
|
@@ -11195,6 +11460,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
11195
11460
|
type: Input
|
|
11196
11461
|
}], schemaSource: [{
|
|
11197
11462
|
type: Input
|
|
11463
|
+
}], schemaUrl: [{
|
|
11464
|
+
type: Input
|
|
11465
|
+
}], submitUrl: [{
|
|
11466
|
+
type: Input
|
|
11467
|
+
}], submitMethod: [{
|
|
11468
|
+
type: Input
|
|
11469
|
+
}], responseSchemaUrl: [{
|
|
11470
|
+
type: Input
|
|
11471
|
+
}], apiEndpointKey: [{
|
|
11472
|
+
type: Input
|
|
11473
|
+
}], apiUrlEntry: [{
|
|
11474
|
+
type: Input
|
|
11198
11475
|
}], enableCustomization: [{
|
|
11199
11476
|
type: Input
|
|
11200
11477
|
}], formId: [{
|
|
@@ -11655,7 +11932,7 @@ class JsonConfigEditorComponent {
|
|
|
11655
11932
|
</div>
|
|
11656
11933
|
</div>
|
|
11657
11934
|
</div>
|
|
11658
|
-
`, isInline: true, styles: [".json-config-editor{display:flex;flex-direction:column;height:100%}.educational-card{margin-bottom:24px;background-color:var(--md-sys-color-surface-container-low);border-left:4px solid var(--md-sys-color-primary)}.educational-card .mat-mdc-card-header{padding-bottom:8px}.card-icon{background-color:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container);font-size:20px;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.educational-card .mat-mdc-card-title{font-size:1.1rem;font-weight:500;color:var(--md-sys-color-on-surface)}.educational-card .mat-mdc-card-content{color:var(--md-sys-color-on-surface-variant);line-height:1.5}.json-editor-section{flex:1;display:flex;flex-direction:column}.json-editor-toolbar{display:flex;gap:12px;margin-bottom:16px;padding:12px;background-color:var(--md-sys-color-surface-container-low);border-radius:8px;border:1px solid var(--md-sys-color-outline-variant)}.spacer{flex:1}.json-textarea-field{width:100%;flex:1}.badges{display:flex;gap:8px;margin-top:8px}.badge{padding:2px 8px;border-radius:999px;font-size:12px;border:1px solid var(--md-sys-color-outline-variant)}.badge.ok{background:var(--md-sys-color-primary-container)}.badge.err{background:var(--md-sys-color-error-container)}.badge.warn{background:var(--md-sys-color-secondary-container)}.json-textarea{font-family:Monaco,Menlo,Ubuntu Mono,Consolas,monospace!important;font-size:13px!important;line-height:1.4!important;height:100%!important;min-height:300px!important;white-space:pre!important;overflow-wrap:normal!important;overflow-x:auto!important;resize:none!important}.valid-hint{color:var(--md-sys-color-primary)!important}.diagnostics-panel{margin-top:12px;padding:12px;border-radius:8px;border:1px solid var(--md-sys-color-outline-variant);background-color:var(--md-sys-color-surface-container-low);display:grid;gap:8px}.diagnostics-title{font-weight:600;color:var(--md-sys-color-on-surface)}.diagnostic-item{display:grid;gap:2px;padding-left:10px;border-left:3px solid var(--md-sys-color-outline);color:var(--md-sys-color-on-surface-variant)}.diagnostic-item--error{border-left-color:var(--md-sys-color-error)}.diagnostic-item--warning{border-left-color:var(--md-sys-color-tertiary)}.diagnostic-item--info{border-left-color:var(--md-sys-color-primary)}.diagnostic-item code{font-size:12px}@media(max-width:768px){.json-editor-toolbar{flex-direction:column;gap:8px}.json-textarea{font-size:12px!important;min-height:300px!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { 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: "ngmodule", type: MatCardModule }, { kind: "component", type: i8
|
|
11935
|
+
`, isInline: true, styles: [".json-config-editor{display:flex;flex-direction:column;height:100%}.educational-card{margin-bottom:24px;background-color:var(--md-sys-color-surface-container-low);border-left:4px solid var(--md-sys-color-primary)}.educational-card .mat-mdc-card-header{padding-bottom:8px}.card-icon{background-color:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container);font-size:20px;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.educational-card .mat-mdc-card-title{font-size:1.1rem;font-weight:500;color:var(--md-sys-color-on-surface)}.educational-card .mat-mdc-card-content{color:var(--md-sys-color-on-surface-variant);line-height:1.5}.json-editor-section{flex:1;display:flex;flex-direction:column}.json-editor-toolbar{display:flex;gap:12px;margin-bottom:16px;padding:12px;background-color:var(--md-sys-color-surface-container-low);border-radius:8px;border:1px solid var(--md-sys-color-outline-variant)}.spacer{flex:1}.json-textarea-field{width:100%;flex:1}.badges{display:flex;gap:8px;margin-top:8px}.badge{padding:2px 8px;border-radius:999px;font-size:12px;border:1px solid var(--md-sys-color-outline-variant)}.badge.ok{background:var(--md-sys-color-primary-container)}.badge.err{background:var(--md-sys-color-error-container)}.badge.warn{background:var(--md-sys-color-secondary-container)}.json-textarea{font-family:Monaco,Menlo,Ubuntu Mono,Consolas,monospace!important;font-size:13px!important;line-height:1.4!important;height:100%!important;min-height:300px!important;white-space:pre!important;overflow-wrap:normal!important;overflow-x:auto!important;resize:none!important}.valid-hint{color:var(--md-sys-color-primary)!important}.diagnostics-panel{margin-top:12px;padding:12px;border-radius:8px;border:1px solid var(--md-sys-color-outline-variant);background-color:var(--md-sys-color-surface-container-low);display:grid;gap:8px}.diagnostics-title{font-weight:600;color:var(--md-sys-color-on-surface)}.diagnostic-item{display:grid;gap:2px;padding-left:10px;border-left:3px solid var(--md-sys-color-outline);color:var(--md-sys-color-on-surface-variant)}.diagnostic-item--error{border-left-color:var(--md-sys-color-error)}.diagnostic-item--warning{border-left-color:var(--md-sys-color-tertiary)}.diagnostic-item--info{border-left-color:var(--md-sys-color-primary)}.diagnostic-item code{font-size:12px}@media(max-width:768px){.json-editor-toolbar{flex-direction:column;gap:8px}.json-textarea{font-size:12px!important;min-height:300px!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7$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: "ngmodule", type: MatCardModule }, { kind: "component", type: i8.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i8.MatCardAvatar, selector: "[mat-card-avatar], [matCardAvatar]" }, { kind: "directive", type: i8.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i8.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i8.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "pipe", type: i1$1.UpperCasePipe, name: "uppercase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
11659
11936
|
}
|
|
11660
11937
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: JsonConfigEditorComponent, decorators: [{
|
|
11661
11938
|
type: Component,
|
|
@@ -11924,7 +12201,7 @@ class FieldConfiguratorComponent {
|
|
|
11924
12201
|
<span class="field-type-label">{{ typeLabel }}</span>
|
|
11925
12202
|
</div>
|
|
11926
12203
|
</div>
|
|
11927
|
-
`, isInline: true, styles: [":host{--pdx-surface: var(--md-sys-color-surface);--pdx-surface-variant: var(--md-sys-color-surface-container);--pdx-outline: var(--md-sys-color-outline-variant);--pdx-cat-text: var(--md-sys-color-primary);--pdx-cat-select: var(--md-sys-color-secondary);--pdx-cat-number: var(--md-sys-color-tertiary);--pdx-cat-datetime: var(--md-sys-color-primary);--pdx-cat-boolean: var(--md-sys-color-secondary);--pdx-cat-slider: var(--md-sys-color-tertiary);--pdx-cat-file: var(--md-sys-color-primary);--pdx-cat-color: var(--md-sys-color-secondary);--pdx-cat-id: var(--md-sys-color-secondary)}.field-item{display:grid;grid-template-columns:24px 24px 1fr;grid-auto-rows:min-content;column-gap:6px;row-gap:2px;padding:6px 8px;border:1px solid var(--pdx-outline);border-radius:4px;background:var(--pdx-surface-variant);cursor:grab;border-left-width:4px;border-left-style:solid;border-left-color:var(--pdx-outline)}.field-item.cdk-drag-dragging{cursor:grabbing}.drag-handle,.field-icon{font-size:20px;line-height:1;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;align-self:start;grid-row:1 / span 2}.drag-handle{cursor:grab;grid-column:1}.field-icon{grid-column:2}.field-item.cdk-drag-preview{box-shadow:var(--md-sys-elevation-level2);border:1px solid var(--pdx-cat-text);background:var(--pdx-surface-variant)}.field-item.cdk-drag-placeholder{opacity:.5}.field-texts{display:flex;flex-direction:column;grid-column:3;grid-row:1 / span 2;line-height:1.2}.field-label{line-height:24px}.field-type-label{font-size:12px;color:var(--md-sys-color-on-surface-variant)}.field-item.text-type{border-left-color:var(--pdx-cat-text)}.field-item.text-type .field-icon{color:var(--pdx-cat-text)}.field-item.date-type{border-left-color:var(--pdx-cat-datetime)}.field-item.date-type .field-icon{color:var(--pdx-cat-datetime)}.field-item.numeric-type{border-left-color:var(--pdx-cat-number)}.field-item.numeric-type .field-icon{color:var(--pdx-cat-number)}.field-item.select-type{border-left-color:var(--pdx-cat-select)}.field-item.select-type .field-icon{color:var(--pdx-cat-select)}.field-item.boolean-type{border-left-color:var(--pdx-cat-boolean)}.field-item.boolean-type .field-icon{color:var(--pdx-cat-boolean)}.field-item.slider-type{border-left-color:var(--pdx-cat-slider)}.field-item.slider-type .field-icon{color:var(--pdx-cat-slider)}.field-item.file-type{border-left-color:var(--pdx-cat-file)}.field-item.file-type .field-icon{color:var(--pdx-cat-file)}.field-item.color-type{border-left-color:var(--pdx-cat-color)}.field-item.color-type .field-icon{color:var(--pdx-cat-color)}.field-item.id-type{border-left-color:var(--pdx-cat-id)}.field-item.id-type .field-icon{color:var(--pdx-cat-id)}.field-item.unknown-type{border-left-color:var(--md-sys-color-outline)}.field-item.unknown-type .field-icon{color:var(--md-sys-color-outline)}.field-item.ft-input{border-left-color:var(--pdx-cat-text)}.field-item.ft-input .field-icon{color:var(--pdx-cat-text)}.field-item.ft-textarea{border-left-color:var(--pdx-cat-text)}.field-item.ft-textarea .field-icon{color:var(--pdx-cat-text)}.field-item.ft-email{border-left-color:var(--pdx-cat-select)}.field-item.ft-email .field-icon{color:var(--pdx-cat-select)}.field-item.ft-password{border-left-color:var(--pdx-cat-number)}.field-item.ft-password .field-icon{color:var(--pdx-cat-number)}.field-item.ft-url{border-left-color:var(--pdx-cat-text)}.field-item.ft-url .field-icon{color:var(--pdx-cat-text)}.field-item.ft-search{border-left-color:var(--pdx-cat-select)}.field-item.ft-search .field-icon{color:var(--pdx-cat-select)}.field-item.ft-phone{border-left-color:var(--pdx-cat-select)}.field-item.ft-phone .field-icon{color:var(--pdx-cat-select)}.field-item.ft-chip-input{border-left-color:var(--pdx-cat-select)}.field-item.ft-chip-input .field-icon{color:var(--pdx-cat-select)}.field-item.ft-numeric-text-box{border-left-color:var(--pdx-cat-number)}.field-item.ft-numeric-text-box .field-icon{color:var(--pdx-cat-number)}.field-item.ft-currency{border-left-color:var(--pdx-cat-number)}.field-item.ft-currency .field-icon{color:var(--pdx-cat-number)}.field-item.ft-year{border-left-color:var(--pdx-cat-number)}.field-item.ft-year .field-icon{color:var(--pdx-cat-number)}.field-item.ft-cpf-cnpj{border-left-color:var(--pdx-cat-id)}.field-item.ft-cpf-cnpj .field-icon{color:var(--pdx-cat-id)}.field-item.ft-select{border-left-color:var(--pdx-cat-select)}.field-item.ft-select .field-icon{color:var(--pdx-cat-select)}.field-item.ft-multi-select{border-left-color:var(--pdx-cat-select)}.field-item.ft-multi-select .field-icon{color:var(--pdx-cat-select)}.field-item.ft-auto-complete{border-left-color:var(--pdx-cat-select)}.field-item.ft-auto-complete .field-icon{color:var(--pdx-cat-select)}.field-item.ft-selection-list{border-left-color:var(--pdx-cat-select)}.field-item.ft-selection-list .field-icon{color:var(--pdx-cat-select)}.field-item.ft-tree-select{border-left-color:var(--pdx-cat-select)}.field-item.ft-tree-select .field-icon{color:var(--pdx-cat-select)}.field-item.ft-multi-select-tree{border-left-color:var(--pdx-cat-select)}.field-item.ft-multi-select-tree .field-icon{color:var(--pdx-cat-select)}.field-item.ft-transfer-list{border-left-color:var(--pdx-cat-text)}.field-item.ft-transfer-list .field-icon{color:var(--pdx-cat-text)}.field-item.ft-date-input{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-date-input .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-date{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-date .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-date-range{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-date-range .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-date-time-local{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-date-time-local .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-time{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-time .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-time-picker{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-time-picker .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-time-range{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-time-range .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-month{border-left-color:var(--pdx-cat-select)}.field-item.ft-month .field-icon{color:var(--pdx-cat-select)}.field-item.ft-week{border-left-color:var(--pdx-cat-select)}.field-item.ft-week .field-icon{color:var(--pdx-cat-select)}.field-item.ft-checkbox{border-left-color:var(--pdx-cat-boolean)}.field-item.ft-checkbox .field-icon{color:var(--pdx-cat-boolean)}.field-item.ft-radio{border-left-color:var(--pdx-cat-boolean)}.field-item.ft-radio .field-icon{color:var(--pdx-cat-boolean)}.field-item.ft-toggle{border-left-color:var(--pdx-cat-boolean)}.field-item.ft-toggle .field-icon{color:var(--pdx-cat-boolean)}.field-item.ft-slider{border-left-color:var(--pdx-cat-slider)}.field-item.ft-slider .field-icon{color:var(--pdx-cat-slider)}.field-item.ft-range-slider{border-left-color:var(--pdx-cat-slider)}.field-item.ft-range-slider .field-icon{color:var(--pdx-cat-slider)}.field-item.ft-color{border-left-color:var(--pdx-cat-color)}.field-item.ft-color .field-icon{color:var(--pdx-cat-color)}.field-item.ft-color-picker{border-left-color:var(--pdx-cat-color)}.field-item.ft-color-picker .field-icon{color:var(--pdx-cat-color)}.field-item.ft-upload{border-left-color:var(--pdx-cat-file)}.field-item.ft-upload .field-icon{color:var(--pdx-cat-file)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$
|
|
12204
|
+
`, isInline: true, styles: [":host{--pdx-surface: var(--md-sys-color-surface);--pdx-surface-variant: var(--md-sys-color-surface-container);--pdx-outline: var(--md-sys-color-outline-variant);--pdx-cat-text: var(--md-sys-color-primary);--pdx-cat-select: var(--md-sys-color-secondary);--pdx-cat-number: var(--md-sys-color-tertiary);--pdx-cat-datetime: var(--md-sys-color-primary);--pdx-cat-boolean: var(--md-sys-color-secondary);--pdx-cat-slider: var(--md-sys-color-tertiary);--pdx-cat-file: var(--md-sys-color-primary);--pdx-cat-color: var(--md-sys-color-secondary);--pdx-cat-id: var(--md-sys-color-secondary)}.field-item{display:grid;grid-template-columns:24px 24px 1fr;grid-auto-rows:min-content;column-gap:6px;row-gap:2px;padding:6px 8px;border:1px solid var(--pdx-outline);border-radius:4px;background:var(--pdx-surface-variant);cursor:grab;border-left-width:4px;border-left-style:solid;border-left-color:var(--pdx-outline)}.field-item.cdk-drag-dragging{cursor:grabbing}.drag-handle,.field-icon{font-size:20px;line-height:1;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;align-self:start;grid-row:1 / span 2}.drag-handle{cursor:grab;grid-column:1}.field-icon{grid-column:2}.field-item.cdk-drag-preview{box-shadow:var(--md-sys-elevation-level2);border:1px solid var(--pdx-cat-text);background:var(--pdx-surface-variant)}.field-item.cdk-drag-placeholder{opacity:.5}.field-texts{display:flex;flex-direction:column;grid-column:3;grid-row:1 / span 2;line-height:1.2}.field-label{line-height:24px}.field-type-label{font-size:12px;color:var(--md-sys-color-on-surface-variant)}.field-item.text-type{border-left-color:var(--pdx-cat-text)}.field-item.text-type .field-icon{color:var(--pdx-cat-text)}.field-item.date-type{border-left-color:var(--pdx-cat-datetime)}.field-item.date-type .field-icon{color:var(--pdx-cat-datetime)}.field-item.numeric-type{border-left-color:var(--pdx-cat-number)}.field-item.numeric-type .field-icon{color:var(--pdx-cat-number)}.field-item.select-type{border-left-color:var(--pdx-cat-select)}.field-item.select-type .field-icon{color:var(--pdx-cat-select)}.field-item.boolean-type{border-left-color:var(--pdx-cat-boolean)}.field-item.boolean-type .field-icon{color:var(--pdx-cat-boolean)}.field-item.slider-type{border-left-color:var(--pdx-cat-slider)}.field-item.slider-type .field-icon{color:var(--pdx-cat-slider)}.field-item.file-type{border-left-color:var(--pdx-cat-file)}.field-item.file-type .field-icon{color:var(--pdx-cat-file)}.field-item.color-type{border-left-color:var(--pdx-cat-color)}.field-item.color-type .field-icon{color:var(--pdx-cat-color)}.field-item.id-type{border-left-color:var(--pdx-cat-id)}.field-item.id-type .field-icon{color:var(--pdx-cat-id)}.field-item.unknown-type{border-left-color:var(--md-sys-color-outline)}.field-item.unknown-type .field-icon{color:var(--md-sys-color-outline)}.field-item.ft-input{border-left-color:var(--pdx-cat-text)}.field-item.ft-input .field-icon{color:var(--pdx-cat-text)}.field-item.ft-textarea{border-left-color:var(--pdx-cat-text)}.field-item.ft-textarea .field-icon{color:var(--pdx-cat-text)}.field-item.ft-email{border-left-color:var(--pdx-cat-select)}.field-item.ft-email .field-icon{color:var(--pdx-cat-select)}.field-item.ft-password{border-left-color:var(--pdx-cat-number)}.field-item.ft-password .field-icon{color:var(--pdx-cat-number)}.field-item.ft-url{border-left-color:var(--pdx-cat-text)}.field-item.ft-url .field-icon{color:var(--pdx-cat-text)}.field-item.ft-search{border-left-color:var(--pdx-cat-select)}.field-item.ft-search .field-icon{color:var(--pdx-cat-select)}.field-item.ft-phone{border-left-color:var(--pdx-cat-select)}.field-item.ft-phone .field-icon{color:var(--pdx-cat-select)}.field-item.ft-chip-input{border-left-color:var(--pdx-cat-select)}.field-item.ft-chip-input .field-icon{color:var(--pdx-cat-select)}.field-item.ft-numeric-text-box{border-left-color:var(--pdx-cat-number)}.field-item.ft-numeric-text-box .field-icon{color:var(--pdx-cat-number)}.field-item.ft-currency{border-left-color:var(--pdx-cat-number)}.field-item.ft-currency .field-icon{color:var(--pdx-cat-number)}.field-item.ft-year{border-left-color:var(--pdx-cat-number)}.field-item.ft-year .field-icon{color:var(--pdx-cat-number)}.field-item.ft-cpf-cnpj{border-left-color:var(--pdx-cat-id)}.field-item.ft-cpf-cnpj .field-icon{color:var(--pdx-cat-id)}.field-item.ft-select{border-left-color:var(--pdx-cat-select)}.field-item.ft-select .field-icon{color:var(--pdx-cat-select)}.field-item.ft-multi-select{border-left-color:var(--pdx-cat-select)}.field-item.ft-multi-select .field-icon{color:var(--pdx-cat-select)}.field-item.ft-auto-complete{border-left-color:var(--pdx-cat-select)}.field-item.ft-auto-complete .field-icon{color:var(--pdx-cat-select)}.field-item.ft-selection-list{border-left-color:var(--pdx-cat-select)}.field-item.ft-selection-list .field-icon{color:var(--pdx-cat-select)}.field-item.ft-tree-select{border-left-color:var(--pdx-cat-select)}.field-item.ft-tree-select .field-icon{color:var(--pdx-cat-select)}.field-item.ft-multi-select-tree{border-left-color:var(--pdx-cat-select)}.field-item.ft-multi-select-tree .field-icon{color:var(--pdx-cat-select)}.field-item.ft-transfer-list{border-left-color:var(--pdx-cat-text)}.field-item.ft-transfer-list .field-icon{color:var(--pdx-cat-text)}.field-item.ft-date-input{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-date-input .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-date{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-date .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-date-range{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-date-range .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-date-time-local{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-date-time-local .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-time{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-time .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-time-picker{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-time-picker .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-time-range{border-left-color:var(--pdx-cat-datetime)}.field-item.ft-time-range .field-icon{color:var(--pdx-cat-datetime)}.field-item.ft-month{border-left-color:var(--pdx-cat-select)}.field-item.ft-month .field-icon{color:var(--pdx-cat-select)}.field-item.ft-week{border-left-color:var(--pdx-cat-select)}.field-item.ft-week .field-icon{color:var(--pdx-cat-select)}.field-item.ft-checkbox{border-left-color:var(--pdx-cat-boolean)}.field-item.ft-checkbox .field-icon{color:var(--pdx-cat-boolean)}.field-item.ft-radio{border-left-color:var(--pdx-cat-boolean)}.field-item.ft-radio .field-icon{color:var(--pdx-cat-boolean)}.field-item.ft-toggle{border-left-color:var(--pdx-cat-boolean)}.field-item.ft-toggle .field-icon{color:var(--pdx-cat-boolean)}.field-item.ft-slider{border-left-color:var(--pdx-cat-slider)}.field-item.ft-slider .field-icon{color:var(--pdx-cat-slider)}.field-item.ft-range-slider{border-left-color:var(--pdx-cat-slider)}.field-item.ft-range-slider .field-icon{color:var(--pdx-cat-slider)}.field-item.ft-color{border-left-color:var(--pdx-cat-color)}.field-item.ft-color .field-icon{color:var(--pdx-cat-color)}.field-item.ft-color-picker{border-left-color:var(--pdx-cat-color)}.field-item.ft-color-picker .field-icon{color:var(--pdx-cat-color)}.field-item.ft-upload{border-left-color:var(--pdx-cat-file)}.field-item.ft-upload .field-icon{color:var(--pdx-cat-file)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$2.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
|
|
11928
12205
|
}
|
|
11929
12206
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: FieldConfiguratorComponent, decorators: [{
|
|
11930
12207
|
type: Component,
|
|
@@ -12340,7 +12617,7 @@ class RowConfiguratorComponent {
|
|
|
12340
12617
|
return null;
|
|
12341
12618
|
}
|
|
12342
12619
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: RowConfiguratorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
12343
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: RowConfiguratorComponent, isStandalone: true, selector: "praxis-row-configurator", inputs: { row: "row", fieldMetadata: "fieldMetadata", sectionIndex: "sectionIndex", rowIndex: "rowIndex", isLastRow: "isLastRow", selected: "selected", availableFieldsListId: "availableFieldsListId", connectedDropListIds: "connectedDropListIds", gapGlobal: "gapGlobal" }, outputs: { rowChange: "rowChange", remove: "remove", applyRowGapAll: "applyRowGapAll", fieldDrop: "fieldDrop", select: "select" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"row-meta\" *ngIf=\"row\">\n <div class=\"bp-toggle\" role=\"group\" aria-label=\"Breakpoint de visualiza\u00E7\u00E3o\">\n <button\n *ngFor=\"let bp of breakpoints\"\n type=\"button\"\n mat-stroked-button\n class=\"bp-toggle__btn\"\n [class.active]=\"previewBreakpoint === bp\"\n (click)=\"previewBreakpoint = bp\"\n >\n {{ bp }}\n </button>\n </div>\n <div class=\"gap-controls\">\n <div class=\"gap-chip\" *ngIf=\"hasMultipleColumns()\" matTooltip=\"Gap entre colunas (px)\"\n aria-label=\"Gap entre colunas\">\n <span class=\"chip-title\">Colunas</span>\n <button mat-icon-button class=\"gap-chip__btn\" (click)=\"adjustRowGapDelta('gap', -2)\"\n aria-label=\"Reduzir gap de colunas\">\n <mat-icon>remove</mat-icon>\n </button>\n <input class=\"gap-chip__input\" type=\"number\" min=\"0\" [ngModel]=\"row.gap ?? gapGlobal\"\n (ngModelChange)=\"updateRowGap('gap', $event)\" aria-label=\"Valor do gap entre colunas\" />\n <span class=\"gap-chip__suffix\">px</span>\n <button mat-icon-button class=\"gap-chip__btn\" (click)=\"adjustRowGapDelta('gap', 2)\"\n aria-label=\"Aumentar gap de colunas\">\n <mat-icon>add</mat-icon>\n </button>\n </div>\n <div class=\"gap-chip\" matTooltip=\"Gap abaixo da linha (px)\" aria-label=\"Gap abaixo da linha\">\n <span class=\"chip-title\">Linha</span>\n <button mat-icon-button class=\"gap-chip__btn\" (click)=\"adjustRowGapDelta('rowGap', -2)\"\n aria-label=\"Reduzir espa\u00E7o entre campos da linha\" matTooltip=\"Reduz o espa\u00E7o entre campos desta linha\">\n <mat-icon>remove</mat-icon>\n </button>\n <input class=\"gap-chip__input\" type=\"number\" min=\"0\" [ngModel]=\"row.rowGap ?? 0\"\n (ngModelChange)=\"updateRowGap('rowGap', $event)\" aria-label=\"Espa\u00E7o entre campos desta linha\" />\n <span class=\"gap-chip__suffix\">px</span>\n <button mat-icon-button class=\"gap-chip__btn\" (click)=\"adjustRowGapDelta('rowGap', 2)\"\n aria-label=\"Aumentar espa\u00E7o entre campos da linha\" matTooltip=\"Aumenta o espa\u00E7o entre campos desta linha\">\n <mat-icon>add</mat-icon>\n </button>\n <button mat-icon-button class=\"gap-chip__btn\" [matMenuTriggerFor]=\"rowGapMenu\"\n matTooltip=\"Mais op\u00E7\u00F5es para aplicar este espa\u00E7o\" aria-label=\"Mais op\u00E7\u00F5es de aplica\u00E7\u00E3o\">\n <mat-icon>done_all</mat-icon>\n </button>\n <mat-menu #rowGapMenu=\"matMenu\">\n <button mat-menu-item (click)=\"applyRowGapToAll()\">\n <mat-icon>done_all</mat-icon>\n <span>Aplicar em todas as linhas da se\u00E7\u00E3o</span>\n </button>\n <button mat-menu-item (click)=\"clearRowGap()\">\n <mat-icon>undo</mat-icon>\n <span>Voltar ao padr\u00E3o</span>\n </button>\n </mat-menu>\n </div>\n <div class=\"gap-pill\" aria-label=\"Resumo de espa\u00E7amentos\">\n Campos: {{ (row.rowGap ?? 'padr\u00E3o') }}px \u00B7 Colunas: {{ (row.gap ?? gapGlobal) }}px\n </div>\n <div class=\"row-actions-meta\">\n <button mat-icon-button [matMenuTriggerFor]=\"rowMenu\" (click)=\"openRowMenu()\" matTooltip=\"Op\u00E7\u00F5es da linha\">\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #rowMenu=\"matMenu\" (closed)=\"onMenuClosed()\">\n <ng-container *ngIf=\"menuContext?.type === 'column'; else rowMenuContent\">\n <button mat-menu-item (click)=\"toggleHidden(menuContext!.columnIndex!)\">\n <mat-icon>{{ getHiddenFor(row.columns[menuContext!.columnIndex!]) ? 'visibility' : 'visibility_off'\n }}</mat-icon>\n <span>{{ getHiddenFor(row.columns[menuContext!.columnIndex!]) ? 'Mostrar neste breakpoint' : 'Ocultar neste\n breakpoint' }}</span>\n </button>\n <button mat-menu-item (click)=\"removeColumn(menuContext!.columnIndex!)\">\n <mat-icon color=\"warn\">delete</mat-icon>\n <span>Remover coluna</span>\n </button>\n </ng-container>\n <ng-template #rowMenuContent>\n <div mat-menu-item disabled>Presets de colunas</div>\n <button mat-menu-item (click)=\"applyPreset([12])\"><mat-icon>view_column</mat-icon><span>1/1</span></button>\n <button mat-menu-item (click)=\"applyPreset([6,6])\"><mat-icon>view_column</mat-icon><span>1/2 \u2014\n 1/2</span></button>\n <button mat-menu-item (click)=\"applyPreset([4,8])\"><mat-icon>view_column</mat-icon><span>1/3 \u2014\n 2/3</span></button>\n <button mat-menu-item (click)=\"applyPreset([8,4])\"><mat-icon>view_column</mat-icon><span>2/3 \u2014\n 1/3</span></button>\n <button mat-menu-item (click)=\"applyPreset([4,4,4])\"><mat-icon>view_column</mat-icon><span>1/3 \u2014 1/3 \u2014\n 1/3</span></button>\n <button mat-menu-item (click)=\"applyPreset([3,3,3,3])\"><mat-icon>view_column</mat-icon><span>1/4 \u2014 1/4 \u2014 1/4 \u2014\n 1/4</span></button>\n <button mat-menu-item (click)=\"addColumn()\"><mat-icon>add</mat-icon><span>Adicionar coluna</span></button>\n <button mat-menu-item (click)=\"removeRow()\"><mat-icon>delete</mat-icon><span>Remover linha</span></button>\n </ng-template>\n </mat-menu>\n </div>\n </div>\n <div class=\"span-warning\" *ngIf=\"getSpanTotal(previewBreakpoint) !== 12\">\n <mat-icon color=\"warn\">warning</mat-icon>\n Soma de spans = {{ getSpanTotal(previewBreakpoint) }} (ideal: 12)\n </div>\n</div>\n\n<div class=\"row-container\" [style.marginBottom.px]=\"!isLastRow ? (row.rowGap || null) : null\">\n <ng-container *ngIf=\"row.columns.length > 0; else emptyRow\">\n <div class=\"row grid-12\" cdkDropListGroup (click)=\"selectRow()\" [class.selected]=\"isRowSelected()\" tabindex=\"0\"\n role=\"button\" [attr.aria-label]=\"'Linha ' + (rowIndex + 1)\" [attr.aria-selected]=\"isRowSelected()\"\n [style.--pfx-grid-gap.px]=\"row.gap || null\" [style.--px-row-field-gap.px]=\"row.rowGap ?? null\">\n <div class=\"row-label\" aria-hidden=\"true\">Linha {{ rowIndex + 1 }}</div>\n <div *ngFor=\"let column of row.columns; let i = index\" class=\"column\" [id]=\"getColumnId(i)\" cdkDropList\n [cdkDropListData]=\"column.fields\" [cdkDropListConnectedTo]=\"connectedColumns(i)\"\n (cdkDropListDropped)=\"drop($event)\" (cdkDropListEntered)=\"onDropEnter(i)\" (cdkDropListExited)=\"onDropExit(i)\"\n (click)=\"selectColumn(i, $event)\" [class.drop-active]=\"activeDropIndex === i\"\n [class.selected]=\"isColumnSelected(i)\" [ngClass]=\"getColumnClassList(column)\"\n [style.grid-column]=\"'span ' + getSpanFor(column)\" tabindex=\"0\" role=\"button\"\n [attr.aria-label]=\"'Coluna ' + (i + 1) + ' de Linha ' + (rowIndex + 1) + '; Largura ' + getSpanFor(column)\"\n [attr.aria-selected]=\"isColumnSelected(i)\">\n <div class=\"column-header\">\n <div class=\"column-status-pill\" [matMenuTriggerFor]=\"columnSettingsMenu\"\n matTooltip=\"Clique para ajustar largura e offset\" [class.active]=\"isColumnSelected(i)\">\n <span class=\"status-bp\">{{ previewBreakpoint }}</span>\n <span class=\"status-divider\">\u00B7</span>\n <span class=\"status-span\">\n <mat-icon>view_column</mat-icon>\n {{ getSpanFor(column) }}/12\n </span>\n <span class=\"status-divider\">\u00B7</span>\n <span class=\"status-offset\">\n off {{ getOffsetFor(column) }}\n </span>\n <span class=\"status-hidden\" *ngIf=\"getHiddenFor(column)\">\n <mat-icon>visibility_off</mat-icon>\n </span>\n </div>\n\n <div class=\"column-actions\">\n <button mat-icon-button class=\"action-btn\" [matMenuTriggerFor]=\"columnOverflowMenu\"\n (click)=\"$event.stopPropagation()\" matTooltip=\"Op\u00E7\u00F5es da coluna\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </div>\n </div>\n\n <mat-menu #columnSettingsMenu=\"matMenu\" class=\"column-settings-popover\">\n <div class=\"popover-content\" (click)=\"$event.stopPropagation()\">\n <div class=\"control-group\" *ngIf=\"getSuggestedSpan(i) as suggested\">\n <button mat-flat-button color=\"primary\" (click)=\"setSpan(i, suggested)\"\n matTooltip=\"Ajustar largura para completar 12 colunas\">\n <mat-icon>auto_fix_high</mat-icon>\n Ajustar para {{ suggested }} (Total 12)\n </button>\n </div>\n <div class=\"control-group\">\n <label>Largura ({{ previewBreakpoint }})</label>\n <div class=\"control-row\">\n <button mat-icon-button (click)=\"adjustSpan(i, -1)\"><mat-icon>remove</mat-icon></button>\n <span class=\"value-display\">{{ getSpanFor(column) }} / 12</span>\n <button mat-icon-button (click)=\"adjustSpan(i, 1)\"><mat-icon>add</mat-icon></button>\n </div>\n </div>\n <div class=\"control-group\">\n <label>Offset ({{ previewBreakpoint }})</label>\n <div class=\"control-row\">\n <button mat-icon-button (click)=\"adjustOffset(i, -1)\"><mat-icon>chevron_left</mat-icon></button>\n <span class=\"value-display\">{{ getOffsetFor(column) }}</span>\n <button mat-icon-button (click)=\"adjustOffset(i, 1)\"><mat-icon>chevron_right</mat-icon></button>\n </div>\n </div>\n <div class=\"control-group\">\n <button mat-stroked-button (click)=\"toggleHidden(i)\" [color]=\"getHiddenFor(column) ? 'warn' : ''\">\n <mat-icon>{{ getHiddenFor(column) ? 'visibility' : 'visibility_off' }}</mat-icon>\n {{ getHiddenFor(column) ? 'Mostrar' : 'Ocultar' }}\n </button>\n </div>\n </div>\n </mat-menu>\n\n <mat-menu #columnOverflowMenu=\"matMenu\">\n <button mat-menu-item (click)=\"openColumnConfig(i)\" matTooltip=\"Abrir painel de configura\u00E7\u00E3o completa\">\n <mat-icon>tune</mat-icon>\n <span>Configurar coluna</span>\n </button>\n <mat-divider></mat-divider>\n <button mat-menu-item (click)=\"moveColumn(i, -1)\" [disabled]=\"i === 0\"\n matTooltip=\"Mover coluna para a esquerda\">\n <mat-icon>arrow_back</mat-icon>\n <span>Mover para esquerda</span>\n </button>\n <button mat-menu-item (click)=\"moveColumn(i, 1)\" [disabled]=\"i === row.columns.length - 1\"\n matTooltip=\"Mover coluna para a direita\">\n <mat-icon>arrow_forward</mat-icon>\n <span>Mover para direita</span>\n </button>\n\n <button mat-menu-item (click)=\"clearColumn(i)\" [disabled]=\"column.fields.length === 0\"\n matTooltip=\"Remover todos os campos desta coluna\">\n <mat-icon>backspace</mat-icon>\n <span>Limpar conte\u00FAdo</span>\n </button>\n <mat-divider></mat-divider>\n <button mat-menu-item (click)=\"removeColumn(i)\" matTooltip=\"Excluir esta coluna\">\n <mat-icon color=\"warn\">delete</mat-icon>\n <span>Remover coluna</span>\n </button>\n </mat-menu>\n <div class=\"column-content\">\n <div class=\"hidden-overlay\" *ngIf=\"getHiddenFor(column)\">\n <mat-icon aria-hidden=\"true\">visibility_off</mat-icon>\n <span>Oculta em {{ previewBreakpoint }}</span>\n </div>\n <ng-container *ngIf=\"column.fields.length > 0; else emptyColumn\">\n <div *ngFor=\"let fieldName of column.fields\" (click)=\"selectField(fieldName, $event)\"\n [class.selected]=\"isFieldSelected(fieldName)\">\n <praxis-field-configurator [field]=\"getFieldByName(fieldName)\"></praxis-field-configurator>\n </div>\n </ng-container>\n <ng-template #emptyColumn>\n <div class=\"column-placeholder\">\n <span>Coluna vazia \u2014 solte um campo ou remova.</span>\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n </ng-container>\n <ng-template #emptyRow>\n <div class=\"row-empty-placeholder\">\n <span>Linha vazia \u2014 crie colunas ou remova.</span>\n <div class=\"row-placeholder-actions\">\n <button mat-stroked-button (click)=\"addColumn()\" matTooltip=\"Adicionar coluna\">\n <mat-icon>add</mat-icon> Adicionar coluna\n </button>\n <button mat-stroked-button color=\"warn\" (click)=\"removeRow()\" matTooltip=\"Remover linha\">\n <mat-icon>delete</mat-icon> Remover linha\n </button>\n </div>\n </div>\n </ng-template>\n</div>\n", styles: [".row-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}.bp-toggle{display:inline-flex;gap:4px;align-items:center}.bp-toggle__btn{min-width:34px;height:30px;line-height:30px;padding:0 8px;text-transform:uppercase}.bp-toggle__btn.active{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.gap-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.gap-chip{display:inline-flex;align-items:center;gap:2px;padding:0 4px;height:32px;border-radius:8px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-variant)}.gap-chip__btn{width:24px;height:24px;line-height:24px;min-width:0;padding:0;--mdc-icon-button-size: 24px;--mdc-icon-button-state-layer-size: 24px}.gap-chip .mat-mdc-button-touch-target{width:24px;height:24px}.gap-chip mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.gap-chip__input{width:42px;border:none;background:transparent;color:var(--md-sys-color-on-surface);font:var(--mdc-typography-body-medium, 600 13px/18px system-ui);text-align:center;outline:none;-moz-appearance:textfield}.gap-chip__input::-webkit-outer-spin-button,.gap-chip__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.gap-chip__suffix{color:var(--md-sys-color-on-surface-variant);font:var(--mdc-typography-label-medium, 500 12px/16px system-ui)}.gap-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:12px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface-variant);font:var(--mdc-typography-label-medium, 500 12px/16px system-ui)}.chip-title{font:var(--mdc-typography-label-medium, 600 12px/16px system-ui);color:var(--md-sys-color-on-surface-variant);text-transform:uppercase;letter-spacing:.03em}.span-warning{display:inline-flex;align-items:center;gap:6px;color:var(--md-sys-color-on-error);background:var(--md-sys-color-error-container);border:1px solid var(--md-sys-color-error);border-radius:6px;padding:4px 8px}.row-container{position:relative;display:flex;align-items:stretch}.row{display:flex;flex-grow:1;position:relative;padding-right:0;border-radius:6px;transition:box-shadow .2s ease;gap:var(--pfx-grid-gap, 12px)}.row:focus{outline:none;box-shadow:0 0 0 2px var(--md-sys-color-primary)}.row:focus-visible{box-shadow:0 0 0 2px var(--md-sys-color-primary)}.row.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--pfx-grid-gap, 16px)}.row.selected{box-shadow:0 0 0 2px var(--md-sys-color-primary)}.row-label{position:absolute;left:-4px;top:-10px;transform:translateY(-100%);background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface-variant);border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;padding:2px 6px;font-size:11px;opacity:0;transition:opacity .15s ease;pointer-events:none}.row:hover .row-label,.row.selected .row-label{opacity:1}.row-actions-meta{margin-left:auto}.column{position:relative;flex:1;display:flex;flex-direction:column;border:1px dashed var(--md-sys-color-outline-variant);margin:0;background:var(--md-sys-color-surface-container);transition:background-color .2s ease,border-color .2s ease;border-radius:8px;overflow:hidden}.column-header{display:flex;align-items:center;justify-content:space-between;padding:4px 8px;background:var(--md-sys-color-surface-variant);border-bottom:1px solid var(--md-sys-color-outline-variant);min-height:36px}.column-content{flex:1;display:grid;align-content:start;gap:var(--px-row-field-gap, 6px);padding:8px}.column-status-pill{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border-radius:12px;background:var(--md-sys-color-surface);border:1px solid var(--md-sys-color-outline-variant);cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none}.column-status-pill:hover,.column-status-pill.active{background:var(--md-sys-color-surface-variant);border-color:var(--md-sys-color-outline)}.status-bp{font-weight:700;text-transform:uppercase;font-size:11px;color:var(--md-sys-color-primary)}.status-divider{color:var(--md-sys-color-outline-variant)}.status-span,.status-offset{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--md-sys-color-on-surface)}.status-span mat-icon{font-size:14px;width:14px;height:14px}.status-hidden{color:var(--md-sys-color-error);display:flex;align-items:center}.status-hidden mat-icon{font-size:14px;width:14px;height:14px}.column-actions{display:flex;align-items:center;opacity:0;transition:opacity .2s ease}.column:hover .column-actions,.column.selected .column-actions,.column-actions:focus-within{opacity:1}.action-btn{width:24px;height:24px;line-height:24px;padding:0}.action-btn mat-icon{font-size:18px;width:18px;height:18px;line-height:18px}.popover-content{padding:12px;display:flex;flex-direction:column;gap:12px;min-width:200px}.control-group{display:flex;flex-direction:column;gap:4px}.control-group label{font-size:11px;color:var(--md-sys-color-on-surface-variant);text-transform:uppercase;font-weight:600}.control-row{display:flex;align-items:center;justify-content:space-between;background:var(--md-sys-color-surface-container-high);border-radius:8px;padding:2px}.value-display{font-weight:600;font-size:13px}.row.grid-12 .column{flex:unset}.column>div{margin:0}.column:focus{outline:none;box-shadow:0 0 0 2px var(--md-sys-color-primary)}.column:focus-visible{box-shadow:0 0 0 2px var(--md-sys-color-primary)}.column.drop-active{border-color:var(--md-sys-color-primary);background:var(--md-sys-color-surface-variant)}.column.selected{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px var(--md-sys-color-primary)}.column.cdk-drop-list-receiving{animation:columnHighlight .3s ease-in-out}@keyframes columnHighlight{0%{box-shadow:0 0 0 2px var(--md-sys-color-primary)}to{box-shadow:none}}.field-selected-highlight.selected .field-item,.selected>.field-item{border-color:var(--md-sys-color-primary)!important;box-shadow:0 0 0 2px var(--md-sys-color-primary)}.row-empty-placeholder{flex:1;border:1px dashed var(--md-sys-color-outline-variant);margin:0;padding:16px;text-align:center;color:var(--md-sys-color-on-surface-variant);background:var(--md-sys-color-surface-container)}.row-placeholder-actions{margin-top:8px;display:flex;gap:8px;justify-content:center}.hidden-overlay{position:absolute;inset:0;background:var(--md-sys-color-surface-container-low);border:1px dashed var(--md-sys-color-outline);display:flex;align-items:center;justify-content:center;gap:6px;color:var(--md-sys-color-on-surface-variant);z-index:2;pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "component", type: FieldConfiguratorComponent, selector: "praxis-field-configurator", inputs: ["field"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i6.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: i6.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.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: MatDividerModule }, { kind: "component", type: i11$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }] });
|
|
12620
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: RowConfiguratorComponent, isStandalone: true, selector: "praxis-row-configurator", inputs: { row: "row", fieldMetadata: "fieldMetadata", sectionIndex: "sectionIndex", rowIndex: "rowIndex", isLastRow: "isLastRow", selected: "selected", availableFieldsListId: "availableFieldsListId", connectedDropListIds: "connectedDropListIds", gapGlobal: "gapGlobal" }, outputs: { rowChange: "rowChange", remove: "remove", applyRowGapAll: "applyRowGapAll", fieldDrop: "fieldDrop", select: "select" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"row-meta\" *ngIf=\"row\">\n <div class=\"bp-toggle\" role=\"group\" aria-label=\"Breakpoint de visualiza\u00E7\u00E3o\">\n <button\n *ngFor=\"let bp of breakpoints\"\n type=\"button\"\n mat-stroked-button\n class=\"bp-toggle__btn\"\n [class.active]=\"previewBreakpoint === bp\"\n (click)=\"previewBreakpoint = bp\"\n >\n {{ bp }}\n </button>\n </div>\n <div class=\"gap-controls\">\n <div class=\"gap-chip\" *ngIf=\"hasMultipleColumns()\" matTooltip=\"Gap entre colunas (px)\"\n aria-label=\"Gap entre colunas\">\n <span class=\"chip-title\">Colunas</span>\n <button mat-icon-button class=\"gap-chip__btn\" (click)=\"adjustRowGapDelta('gap', -2)\"\n aria-label=\"Reduzir gap de colunas\">\n <mat-icon>remove</mat-icon>\n </button>\n <input class=\"gap-chip__input\" type=\"number\" min=\"0\" [ngModel]=\"row.gap ?? gapGlobal\"\n (ngModelChange)=\"updateRowGap('gap', $event)\" aria-label=\"Valor do gap entre colunas\" />\n <span class=\"gap-chip__suffix\">px</span>\n <button mat-icon-button class=\"gap-chip__btn\" (click)=\"adjustRowGapDelta('gap', 2)\"\n aria-label=\"Aumentar gap de colunas\">\n <mat-icon>add</mat-icon>\n </button>\n </div>\n <div class=\"gap-chip\" matTooltip=\"Gap abaixo da linha (px)\" aria-label=\"Gap abaixo da linha\">\n <span class=\"chip-title\">Linha</span>\n <button mat-icon-button class=\"gap-chip__btn\" (click)=\"adjustRowGapDelta('rowGap', -2)\"\n aria-label=\"Reduzir espa\u00E7o entre campos da linha\" matTooltip=\"Reduz o espa\u00E7o entre campos desta linha\">\n <mat-icon>remove</mat-icon>\n </button>\n <input class=\"gap-chip__input\" type=\"number\" min=\"0\" [ngModel]=\"row.rowGap ?? 0\"\n (ngModelChange)=\"updateRowGap('rowGap', $event)\" aria-label=\"Espa\u00E7o entre campos desta linha\" />\n <span class=\"gap-chip__suffix\">px</span>\n <button mat-icon-button class=\"gap-chip__btn\" (click)=\"adjustRowGapDelta('rowGap', 2)\"\n aria-label=\"Aumentar espa\u00E7o entre campos da linha\" matTooltip=\"Aumenta o espa\u00E7o entre campos desta linha\">\n <mat-icon>add</mat-icon>\n </button>\n <button mat-icon-button class=\"gap-chip__btn\" [matMenuTriggerFor]=\"rowGapMenu\"\n matTooltip=\"Mais op\u00E7\u00F5es para aplicar este espa\u00E7o\" aria-label=\"Mais op\u00E7\u00F5es de aplica\u00E7\u00E3o\">\n <mat-icon>done_all</mat-icon>\n </button>\n <mat-menu #rowGapMenu=\"matMenu\">\n <button mat-menu-item (click)=\"applyRowGapToAll()\">\n <mat-icon>done_all</mat-icon>\n <span>Aplicar em todas as linhas da se\u00E7\u00E3o</span>\n </button>\n <button mat-menu-item (click)=\"clearRowGap()\">\n <mat-icon>undo</mat-icon>\n <span>Voltar ao padr\u00E3o</span>\n </button>\n </mat-menu>\n </div>\n <div class=\"gap-pill\" aria-label=\"Resumo de espa\u00E7amentos\">\n Campos: {{ (row.rowGap ?? 'padr\u00E3o') }}px \u00B7 Colunas: {{ (row.gap ?? gapGlobal) }}px\n </div>\n <div class=\"row-actions-meta\">\n <button mat-icon-button [matMenuTriggerFor]=\"rowMenu\" (click)=\"openRowMenu()\" matTooltip=\"Op\u00E7\u00F5es da linha\">\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #rowMenu=\"matMenu\" (closed)=\"onMenuClosed()\">\n <ng-container *ngIf=\"menuContext?.type === 'column'; else rowMenuContent\">\n <button mat-menu-item (click)=\"toggleHidden(menuContext!.columnIndex!)\">\n <mat-icon>{{ getHiddenFor(row.columns[menuContext!.columnIndex!]) ? 'visibility' : 'visibility_off'\n }}</mat-icon>\n <span>{{ getHiddenFor(row.columns[menuContext!.columnIndex!]) ? 'Mostrar neste breakpoint' : 'Ocultar neste\n breakpoint' }}</span>\n </button>\n <button mat-menu-item (click)=\"removeColumn(menuContext!.columnIndex!)\">\n <mat-icon color=\"warn\">delete</mat-icon>\n <span>Remover coluna</span>\n </button>\n </ng-container>\n <ng-template #rowMenuContent>\n <div mat-menu-item disabled>Presets de colunas</div>\n <button mat-menu-item (click)=\"applyPreset([12])\"><mat-icon>view_column</mat-icon><span>1/1</span></button>\n <button mat-menu-item (click)=\"applyPreset([6,6])\"><mat-icon>view_column</mat-icon><span>1/2 \u2014\n 1/2</span></button>\n <button mat-menu-item (click)=\"applyPreset([4,8])\"><mat-icon>view_column</mat-icon><span>1/3 \u2014\n 2/3</span></button>\n <button mat-menu-item (click)=\"applyPreset([8,4])\"><mat-icon>view_column</mat-icon><span>2/3 \u2014\n 1/3</span></button>\n <button mat-menu-item (click)=\"applyPreset([4,4,4])\"><mat-icon>view_column</mat-icon><span>1/3 \u2014 1/3 \u2014\n 1/3</span></button>\n <button mat-menu-item (click)=\"applyPreset([3,3,3,3])\"><mat-icon>view_column</mat-icon><span>1/4 \u2014 1/4 \u2014 1/4 \u2014\n 1/4</span></button>\n <button mat-menu-item (click)=\"addColumn()\"><mat-icon>add</mat-icon><span>Adicionar coluna</span></button>\n <button mat-menu-item (click)=\"removeRow()\"><mat-icon>delete</mat-icon><span>Remover linha</span></button>\n </ng-template>\n </mat-menu>\n </div>\n </div>\n <div class=\"span-warning\" *ngIf=\"getSpanTotal(previewBreakpoint) !== 12\">\n <mat-icon color=\"warn\">warning</mat-icon>\n Soma de spans = {{ getSpanTotal(previewBreakpoint) }} (ideal: 12)\n </div>\n</div>\n\n<div class=\"row-container\" [style.marginBottom.px]=\"!isLastRow ? (row.rowGap || null) : null\">\n <ng-container *ngIf=\"row.columns.length > 0; else emptyRow\">\n <div class=\"row grid-12\" cdkDropListGroup (click)=\"selectRow()\" [class.selected]=\"isRowSelected()\" tabindex=\"0\"\n role=\"button\" [attr.aria-label]=\"'Linha ' + (rowIndex + 1)\" [attr.aria-selected]=\"isRowSelected()\"\n [style.--pfx-grid-gap.px]=\"row.gap || null\" [style.--px-row-field-gap.px]=\"row.rowGap ?? null\">\n <div class=\"row-label\" aria-hidden=\"true\">Linha {{ rowIndex + 1 }}</div>\n <div *ngFor=\"let column of row.columns; let i = index\" class=\"column\" [id]=\"getColumnId(i)\" cdkDropList\n [cdkDropListData]=\"column.fields\" [cdkDropListConnectedTo]=\"connectedColumns(i)\"\n (cdkDropListDropped)=\"drop($event)\" (cdkDropListEntered)=\"onDropEnter(i)\" (cdkDropListExited)=\"onDropExit(i)\"\n (click)=\"selectColumn(i, $event)\" [class.drop-active]=\"activeDropIndex === i\"\n [class.selected]=\"isColumnSelected(i)\" [ngClass]=\"getColumnClassList(column)\"\n [style.grid-column]=\"'span ' + getSpanFor(column)\" tabindex=\"0\" role=\"button\"\n [attr.aria-label]=\"'Coluna ' + (i + 1) + ' de Linha ' + (rowIndex + 1) + '; Largura ' + getSpanFor(column)\"\n [attr.aria-selected]=\"isColumnSelected(i)\">\n <div class=\"column-header\">\n <div class=\"column-status-pill\" [matMenuTriggerFor]=\"columnSettingsMenu\"\n matTooltip=\"Clique para ajustar largura e offset\" [class.active]=\"isColumnSelected(i)\">\n <span class=\"status-bp\">{{ previewBreakpoint }}</span>\n <span class=\"status-divider\">\u00B7</span>\n <span class=\"status-span\">\n <mat-icon>view_column</mat-icon>\n {{ getSpanFor(column) }}/12\n </span>\n <span class=\"status-divider\">\u00B7</span>\n <span class=\"status-offset\">\n off {{ getOffsetFor(column) }}\n </span>\n <span class=\"status-hidden\" *ngIf=\"getHiddenFor(column)\">\n <mat-icon>visibility_off</mat-icon>\n </span>\n </div>\n\n <div class=\"column-actions\">\n <button mat-icon-button class=\"action-btn\" [matMenuTriggerFor]=\"columnOverflowMenu\"\n (click)=\"$event.stopPropagation()\" matTooltip=\"Op\u00E7\u00F5es da coluna\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </div>\n </div>\n\n <mat-menu #columnSettingsMenu=\"matMenu\" class=\"column-settings-popover\">\n <div class=\"popover-content\" (click)=\"$event.stopPropagation()\">\n <div class=\"control-group\" *ngIf=\"getSuggestedSpan(i) as suggested\">\n <button mat-flat-button color=\"primary\" (click)=\"setSpan(i, suggested)\"\n matTooltip=\"Ajustar largura para completar 12 colunas\">\n <mat-icon>auto_fix_high</mat-icon>\n Ajustar para {{ suggested }} (Total 12)\n </button>\n </div>\n <div class=\"control-group\">\n <label>Largura ({{ previewBreakpoint }})</label>\n <div class=\"control-row\">\n <button mat-icon-button (click)=\"adjustSpan(i, -1)\"><mat-icon>remove</mat-icon></button>\n <span class=\"value-display\">{{ getSpanFor(column) }} / 12</span>\n <button mat-icon-button (click)=\"adjustSpan(i, 1)\"><mat-icon>add</mat-icon></button>\n </div>\n </div>\n <div class=\"control-group\">\n <label>Offset ({{ previewBreakpoint }})</label>\n <div class=\"control-row\">\n <button mat-icon-button (click)=\"adjustOffset(i, -1)\"><mat-icon>chevron_left</mat-icon></button>\n <span class=\"value-display\">{{ getOffsetFor(column) }}</span>\n <button mat-icon-button (click)=\"adjustOffset(i, 1)\"><mat-icon>chevron_right</mat-icon></button>\n </div>\n </div>\n <div class=\"control-group\">\n <button mat-stroked-button (click)=\"toggleHidden(i)\" [color]=\"getHiddenFor(column) ? 'warn' : ''\">\n <mat-icon>{{ getHiddenFor(column) ? 'visibility' : 'visibility_off' }}</mat-icon>\n {{ getHiddenFor(column) ? 'Mostrar' : 'Ocultar' }}\n </button>\n </div>\n </div>\n </mat-menu>\n\n <mat-menu #columnOverflowMenu=\"matMenu\">\n <button mat-menu-item (click)=\"openColumnConfig(i)\" matTooltip=\"Abrir painel de configura\u00E7\u00E3o completa\">\n <mat-icon>tune</mat-icon>\n <span>Configurar coluna</span>\n </button>\n <mat-divider></mat-divider>\n <button mat-menu-item (click)=\"moveColumn(i, -1)\" [disabled]=\"i === 0\"\n matTooltip=\"Mover coluna para a esquerda\">\n <mat-icon>arrow_back</mat-icon>\n <span>Mover para esquerda</span>\n </button>\n <button mat-menu-item (click)=\"moveColumn(i, 1)\" [disabled]=\"i === row.columns.length - 1\"\n matTooltip=\"Mover coluna para a direita\">\n <mat-icon>arrow_forward</mat-icon>\n <span>Mover para direita</span>\n </button>\n\n <button mat-menu-item (click)=\"clearColumn(i)\" [disabled]=\"column.fields.length === 0\"\n matTooltip=\"Remover todos os campos desta coluna\">\n <mat-icon>backspace</mat-icon>\n <span>Limpar conte\u00FAdo</span>\n </button>\n <mat-divider></mat-divider>\n <button mat-menu-item (click)=\"removeColumn(i)\" matTooltip=\"Excluir esta coluna\">\n <mat-icon color=\"warn\">delete</mat-icon>\n <span>Remover coluna</span>\n </button>\n </mat-menu>\n <div class=\"column-content\">\n <div class=\"hidden-overlay\" *ngIf=\"getHiddenFor(column)\">\n <mat-icon aria-hidden=\"true\">visibility_off</mat-icon>\n <span>Oculta em {{ previewBreakpoint }}</span>\n </div>\n <ng-container *ngIf=\"column.fields.length > 0; else emptyColumn\">\n <div *ngFor=\"let fieldName of column.fields\" (click)=\"selectField(fieldName, $event)\"\n [class.selected]=\"isFieldSelected(fieldName)\">\n <praxis-field-configurator [field]=\"getFieldByName(fieldName)\"></praxis-field-configurator>\n </div>\n </ng-container>\n <ng-template #emptyColumn>\n <div class=\"column-placeholder\">\n <span>Coluna vazia \u2014 solte um campo ou remova.</span>\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n </ng-container>\n <ng-template #emptyRow>\n <div class=\"row-empty-placeholder\">\n <span>Linha vazia \u2014 crie colunas ou remova.</span>\n <div class=\"row-placeholder-actions\">\n <button mat-stroked-button (click)=\"addColumn()\" matTooltip=\"Adicionar coluna\">\n <mat-icon>add</mat-icon> Adicionar coluna\n </button>\n <button mat-stroked-button color=\"warn\" (click)=\"removeRow()\" matTooltip=\"Remover linha\">\n <mat-icon>delete</mat-icon> Remover linha\n </button>\n </div>\n </div>\n </ng-template>\n</div>\n", styles: [".row-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}.bp-toggle{display:inline-flex;gap:4px;align-items:center}.bp-toggle__btn{min-width:34px;height:30px;line-height:30px;padding:0 8px;text-transform:uppercase}.bp-toggle__btn.active{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.gap-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.gap-chip{display:inline-flex;align-items:center;gap:2px;padding:0 4px;height:32px;border-radius:8px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-variant)}.gap-chip__btn{width:24px;height:24px;line-height:24px;min-width:0;padding:0;--mdc-icon-button-size: 24px;--mdc-icon-button-state-layer-size: 24px}.gap-chip .mat-mdc-button-touch-target{width:24px;height:24px}.gap-chip mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.gap-chip__input{width:42px;border:none;background:transparent;color:var(--md-sys-color-on-surface);font:var(--mdc-typography-body-medium, 600 13px/18px system-ui);text-align:center;outline:none;-moz-appearance:textfield}.gap-chip__input::-webkit-outer-spin-button,.gap-chip__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.gap-chip__suffix{color:var(--md-sys-color-on-surface-variant);font:var(--mdc-typography-label-medium, 500 12px/16px system-ui)}.gap-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:12px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface-variant);font:var(--mdc-typography-label-medium, 500 12px/16px system-ui)}.chip-title{font:var(--mdc-typography-label-medium, 600 12px/16px system-ui);color:var(--md-sys-color-on-surface-variant);text-transform:uppercase;letter-spacing:.03em}.span-warning{display:inline-flex;align-items:center;gap:6px;color:var(--md-sys-color-on-error);background:var(--md-sys-color-error-container);border:1px solid var(--md-sys-color-error);border-radius:6px;padding:4px 8px}.row-container{position:relative;display:flex;align-items:stretch}.row{display:flex;flex-grow:1;position:relative;padding-right:0;border-radius:6px;transition:box-shadow .2s ease;gap:var(--pfx-grid-gap, 12px)}.row:focus{outline:none;box-shadow:0 0 0 2px var(--md-sys-color-primary)}.row:focus-visible{box-shadow:0 0 0 2px var(--md-sys-color-primary)}.row.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--pfx-grid-gap, 16px)}.row.selected{box-shadow:0 0 0 2px var(--md-sys-color-primary)}.row-label{position:absolute;left:-4px;top:-10px;transform:translateY(-100%);background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface-variant);border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;padding:2px 6px;font-size:11px;opacity:0;transition:opacity .15s ease;pointer-events:none}.row:hover .row-label,.row.selected .row-label{opacity:1}.row-actions-meta{margin-left:auto}.column{position:relative;flex:1;display:flex;flex-direction:column;border:1px dashed var(--md-sys-color-outline-variant);margin:0;background:var(--md-sys-color-surface-container);transition:background-color .2s ease,border-color .2s ease;border-radius:8px;overflow:hidden}.column-header{display:flex;align-items:center;justify-content:space-between;padding:4px 8px;background:var(--md-sys-color-surface-variant);border-bottom:1px solid var(--md-sys-color-outline-variant);min-height:36px}.column-content{flex:1;display:grid;align-content:start;gap:var(--px-row-field-gap, 6px);padding:8px}.column-status-pill{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border-radius:12px;background:var(--md-sys-color-surface);border:1px solid var(--md-sys-color-outline-variant);cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none}.column-status-pill:hover,.column-status-pill.active{background:var(--md-sys-color-surface-variant);border-color:var(--md-sys-color-outline)}.status-bp{font-weight:700;text-transform:uppercase;font-size:11px;color:var(--md-sys-color-primary)}.status-divider{color:var(--md-sys-color-outline-variant)}.status-span,.status-offset{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--md-sys-color-on-surface)}.status-span mat-icon{font-size:14px;width:14px;height:14px}.status-hidden{color:var(--md-sys-color-error);display:flex;align-items:center}.status-hidden mat-icon{font-size:14px;width:14px;height:14px}.column-actions{display:flex;align-items:center;opacity:0;transition:opacity .2s ease}.column:hover .column-actions,.column.selected .column-actions,.column-actions:focus-within{opacity:1}.action-btn{width:24px;height:24px;line-height:24px;padding:0}.action-btn mat-icon{font-size:18px;width:18px;height:18px;line-height:18px}.popover-content{padding:12px;display:flex;flex-direction:column;gap:12px;min-width:200px}.control-group{display:flex;flex-direction:column;gap:4px}.control-group label{font-size:11px;color:var(--md-sys-color-on-surface-variant);text-transform:uppercase;font-weight:600}.control-row{display:flex;align-items:center;justify-content:space-between;background:var(--md-sys-color-surface-container-high);border-radius:8px;padding:2px}.value-display{font-weight:600;font-size:13px}.row.grid-12 .column{flex:unset}.column>div{margin:0}.column:focus{outline:none;box-shadow:0 0 0 2px var(--md-sys-color-primary)}.column:focus-visible{box-shadow:0 0 0 2px var(--md-sys-color-primary)}.column.drop-active{border-color:var(--md-sys-color-primary);background:var(--md-sys-color-surface-variant)}.column.selected{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px var(--md-sys-color-primary)}.column.cdk-drop-list-receiving{animation:columnHighlight .3s ease-in-out}@keyframes columnHighlight{0%{box-shadow:0 0 0 2px var(--md-sys-color-primary)}to{box-shadow:none}}.field-selected-highlight.selected .field-item,.selected>.field-item{border-color:var(--md-sys-color-primary)!important;box-shadow:0 0 0 2px var(--md-sys-color-primary)}.row-empty-placeholder{flex:1;border:1px dashed var(--md-sys-color-outline-variant);margin:0;padding:16px;text-align:center;color:var(--md-sys-color-on-surface-variant);background:var(--md-sys-color-surface-container)}.row-placeholder-actions{margin-top:8px;display:flex;gap:8px;justify-content:center}.hidden-overlay{position:absolute;inset:0;background:var(--md-sys-color-surface-container-low);border:1px dashed var(--md-sys-color-outline);display:flex;align-items:center;justify-content:center;gap:6px;color:var(--md-sys-color-on-surface-variant);z-index:2;pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$2.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "component", type: FieldConfiguratorComponent, selector: "praxis-field-configurator", inputs: ["field"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i6.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: i6.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.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: MatDividerModule }, { kind: "component", type: i11.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }] });
|
|
12344
12621
|
}
|
|
12345
12622
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: RowConfiguratorComponent, decorators: [{
|
|
12346
12623
|
type: Component,
|
|
@@ -12526,7 +12803,7 @@ class SectionPresetPickerComponent {
|
|
|
12526
12803
|
close() {
|
|
12527
12804
|
this.ref.close(null);
|
|
12528
12805
|
}
|
|
12529
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SectionPresetPickerComponent, deps: [{ token: SectionPresetRegistry }, { token: i2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
12806
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SectionPresetPickerComponent, deps: [{ token: SectionPresetRegistry }, { token: i2$1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
12530
12807
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: SectionPresetPickerComponent, isStandalone: true, selector: "praxis-section-preset-picker", ngImport: i0, template: `
|
|
12531
12808
|
<div class="picker">
|
|
12532
12809
|
<h2 mat-dialog-title class="dialog-title">Presets de Seção</h2>
|
|
@@ -12548,7 +12825,7 @@ class SectionPresetPickerComponent {
|
|
|
12548
12825
|
</button>
|
|
12549
12826
|
</div>
|
|
12550
12827
|
</div>
|
|
12551
|
-
`, isInline: true, styles: [".picker{padding:12px;width:520px;color:var(--md-sys-color-on-surface)}.dialog-title{margin:4px 0 8px;font-weight:600;color:var(--md-sys-color-on-surface)}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:8px 0 12px}.preset-btn{display:flex;align-items:center;gap:10px;border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;padding:12px;background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface);transition:background .12s ease,border-color .12s ease,transform .12s ease,box-shadow .12s ease;text-align:left}.preset-btn mat-icon{color:var(--md-sys-color-primary)}.preset-btn .name{font-weight:600;letter-spacing:.2px}.preset-btn:hover{background:var(--md-sys-color-primary-container);border-color:var(--md-sys-color-primary);transform:translateY(-1px);box-shadow:var(--md-sys-elevation-level2);cursor:pointer}.preset-btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--md-sys-color-primary)}.actions{display:flex;justify-content:flex-end;margin-top:8px;padding-top:8px;border-top:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { 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: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
|
|
12828
|
+
`, isInline: true, styles: [".picker{padding:12px;width:520px;color:var(--md-sys-color-on-surface)}.dialog-title{margin:4px 0 8px;font-weight:600;color:var(--md-sys-color-on-surface)}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:8px 0 12px}.preset-btn{display:flex;align-items:center;gap:10px;border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;padding:12px;background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface);transition:background .12s ease,border-color .12s ease,transform .12s ease,box-shadow .12s ease;text-align:left}.preset-btn mat-icon{color:var(--md-sys-color-primary)}.preset-btn .name{font-weight:600;letter-spacing:.2px}.preset-btn:hover{background:var(--md-sys-color-primary-container);border-color:var(--md-sys-color-primary);transform:translateY(-1px);box-shadow:var(--md-sys-elevation-level2);cursor:pointer}.preset-btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--md-sys-color-primary)}.actions{display:flex;justify-content:flex-end;margin-top:8px;padding-top:8px;border-top:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { 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: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
|
|
12552
12829
|
}
|
|
12553
12830
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SectionPresetPickerComponent, decorators: [{
|
|
12554
12831
|
type: Component,
|
|
@@ -12574,7 +12851,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
12574
12851
|
</div>
|
|
12575
12852
|
</div>
|
|
12576
12853
|
`, styles: [".picker{padding:12px;width:520px;color:var(--md-sys-color-on-surface)}.dialog-title{margin:4px 0 8px;font-weight:600;color:var(--md-sys-color-on-surface)}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:8px 0 12px}.preset-btn{display:flex;align-items:center;gap:10px;border:1px solid var(--md-sys-color-outline-variant);border-radius:10px;padding:12px;background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface);transition:background .12s ease,border-color .12s ease,transform .12s ease,box-shadow .12s ease;text-align:left}.preset-btn mat-icon{color:var(--md-sys-color-primary)}.preset-btn .name{font-weight:600;letter-spacing:.2px}.preset-btn:hover{background:var(--md-sys-color-primary-container);border-color:var(--md-sys-color-primary);transform:translateY(-1px);box-shadow:var(--md-sys-elevation-level2);cursor:pointer}.preset-btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--md-sys-color-primary)}.actions{display:flex;justify-content:flex-end;margin-top:8px;padding-top:8px;border-top:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}\n"] }]
|
|
12577
|
-
}], ctorParameters: () => [{ type: SectionPresetRegistry }, { type: i2.MatDialogRef }, { type: undefined, decorators: [{
|
|
12854
|
+
}], ctorParameters: () => [{ type: SectionPresetRegistry }, { type: i2$1.MatDialogRef }, { type: undefined, decorators: [{
|
|
12578
12855
|
type: Inject,
|
|
12579
12856
|
args: [MAT_DIALOG_DATA]
|
|
12580
12857
|
}] }] });
|
|
@@ -12887,8 +13164,8 @@ class SectionConfiguratorComponent {
|
|
|
12887
13164
|
};
|
|
12888
13165
|
this.applyStyleToAll.emit(patch);
|
|
12889
13166
|
}
|
|
12890
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SectionConfiguratorComponent, deps: [{ token: i2.MatDialog }, { token: SectionPresetRegistry }, { token:
|
|
12891
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: SectionConfiguratorComponent, isStandalone: true, selector: "praxis-section-configurator", inputs: { section: "section", sectionIndex: "sectionIndex", allSections: "allSections", fieldMetadata: "fieldMetadata", selected: "selected", availableFieldsListId: "availableFieldsListId", columnDropListIds: "columnDropListIds", gapGlobal: "gapGlobal" }, outputs: { sectionChange: "sectionChange", applyStyleToAll: "applyStyleToAll", remove: "remove", select: "select", fieldDrop: "fieldDrop" }, ngImport: i0, template: "<mat-card\n class=\"section-card\"\n cdkDrag\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n [class.hovered]=\"isHovered\"\n [class.selected]=\"isThisSectionSelected()\"\n [class.collapsed]=\"isCollapsed\"\n (click)=\"onSelectSection()\"\n tabindex=\"0\"\n role=\"button\"\n [attr.aria-label]=\"'Se\u00E7\u00E3o ' + (sectionIndex + 1)\"\n [attr.aria-selected]=\"isThisSectionSelected()\"\n>\n <mat-card-header class=\"section-header\">\n <mat-card-title class=\"title-wrapper\">\n <div class=\"section-heading\">\n @let headerPreview = getSectionHeaderPreview();\n @let headerAvatarSize = getSectionHeaderAvatarSize();\n @if (headerPreview.kind === 'icon') {\n <mat-icon class=\"section-heading__icon\" aria-hidden=\"true\" [praxisIcon]=\"headerPreview.icon\"></mat-icon>\n }\n @if (headerPreview.kind === 'initials') {\n <span class=\"section-heading__avatar section-heading__avatar--text\" [class.size-sm]=\"headerAvatarSize === 'sm'\"\n [class.size-md]=\"headerAvatarSize === 'md'\" [class.size-lg]=\"headerAvatarSize === 'lg'\"\n [matTooltip]=\"headerPreview.tooltip || ''\" [matTooltipDisabled]=\"!headerPreview.tooltip\">\n {{ headerPreview.text }}\n </span>\n }\n @if (headerPreview.kind === 'placeholder') {\n <span class=\"section-heading__avatar section-heading__avatar--placeholder\" [class.size-sm]=\"headerAvatarSize === 'sm'\"\n [class.size-md]=\"headerAvatarSize === 'md'\" [class.size-lg]=\"headerAvatarSize === 'lg'\"\n [matTooltip]=\"headerPreview.tooltip || ''\" [matTooltipDisabled]=\"!headerPreview.tooltip\">\n @if (headerPreview.icon) {\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"headerPreview.icon\"></mat-icon>\n }\n </span>\n }\n <div class=\"section-heading__text\">\n <span class=\"section-name\">{{ section.title || 'Sem t\u00EDtulo' }}</span>\n <span class=\"section-desc\" *ngIf=\"section.description\">{{ section.description }}</span>\n </div>\n </div>\n <button\n mat-icon-button\n type=\"button\"\n color=\"primary\"\n class=\"section-editor-trigger\"\n (click)=\"openAdvancedEditor($event)\"\n matTooltip=\"Para editar o t\u00EDtulo, use o editor completo da se\u00E7\u00E3o\"\n aria-label=\"Abrir editor da se\u00E7\u00E3o\"\n >\n <mat-icon>open_in_new</mat-icon>\n </button>\n </mat-card-title>\n <div class=\"section-header-actions\">\n <button\n mat-icon-button\n class=\"section-collapse-btn\"\n type=\"button\"\n (click)=\"toggleCollapsed($event)\"\n [attr.aria-expanded]=\"!isCollapsed\"\n [attr.aria-label]=\"isCollapsed ? 'Expandir se\u00E7\u00E3o' : 'Colapsar se\u00E7\u00E3o'\"\n [matTooltip]=\"isCollapsed ? 'Expandir se\u00E7\u00E3o' : 'Colapsar se\u00E7\u00E3o'\"\n >\n <mat-icon>{{ isCollapsed ? 'unfold_more' : 'unfold_less' }}</mat-icon>\n </button>\n <button\n mat-icon-button\n class=\"section-menu-btn\"\n [matMenuTriggerFor]=\"sectionMenu\"\n aria-label=\"Mais a\u00E7\u00F5es da se\u00E7\u00E3o\"\n matTooltip=\"Mais a\u00E7\u00F5es\"\n >\n <mat-icon [praxisIcon]=\"'more_vert'\"></mat-icon>\n </button>\n </div>\n <mat-menu #sectionMenu=\"matMenu\">\n <button mat-menu-item (click)=\"openSectionPresets()\">\n <mat-icon [praxisIcon]=\"'view_quilt'\"></mat-icon>\n <span>Presets de se\u00E7\u00E3o\u2026</span>\n </button>\n <button mat-menu-item (click)=\"applyCurrentStyleToAll()\">\n <mat-icon [praxisIcon]=\"'format_paint'\"></mat-icon>\n <span>Aplicar estilo desta se\u00E7\u00E3o a todas</span>\n </button>\n <mat-divider></mat-divider>\n <button mat-menu-item *ngIf=\"section.description == null\" (click)=\"section.description = ''; onSectionUpdated()\">\n <mat-icon [praxisIcon]=\"'note_add'\"></mat-icon>\n <span>Adicionar descri\u00E7\u00E3o</span>\n </button>\n <button mat-menu-item *ngIf=\"section.description != null\" (click)=\"section.description = undefined; onSectionUpdated()\">\n <mat-icon [praxisIcon]=\"'backspace'\"></mat-icon>\n <span>Remover descri\u00E7\u00E3o</span>\n </button>\n <mat-divider></mat-divider>\n <button mat-menu-item (click)=\"onRemoveSection()\">\n <mat-icon [praxisIcon]=\"'delete'\"></mat-icon>\n <span>Remover se\u00E7\u00E3o</span>\n </button>\n </mat-menu>\n </mat-card-header>\n <mat-card-content [attr.aria-hidden]=\"isCollapsed\">\n <ng-container *ngIf=\"isThisSectionSelected(); else linhasTitle\">\n <div class=\"section-breadcrumbs\" (click)=\"$event.stopPropagation()\">\n <button\n type=\"button\"\n class=\"crumb as-button\"\n data-crumb=\"layout\"\n [attr.aria-label]=\"'Voltar ao Layout'\"\n disabled\n >\n Layout\n </button>\n <span class=\"sep\">\u203A</span>\n <button\n type=\"button\"\n class=\"crumb as-button crumb-section\"\n data-crumb=\"section\"\n (click)=\"onSelectSectionFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Selecionar Se\u00E7\u00E3o ' + (sectionIndex + 1)\"\n >\n Se\u00E7\u00E3o {{ sectionIndex + 1 }}\n </button>\n <ng-container *ngIf=\"selected?.rowIndex != null\">\n <span class=\"sep\">\u203A</span>\n <button\n type=\"button\"\n class=\"crumb as-button crumb-row\"\n data-crumb=\"row\"\n (click)=\"onSelectRowFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Selecionar Linha ' + (selected!.rowIndex! + 1)\"\n >\n Linha {{ selected!.rowIndex! + 1 }}\n </button>\n </ng-container>\n <ng-container *ngIf=\"selected?.columnIndex != null\">\n <span class=\"sep\">\u203A</span>\n <button\n type=\"button\"\n class=\"crumb as-button crumb-column\"\n data-crumb=\"column\"\n (click)=\"onSelectColumnFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Selecionar Coluna ' + (selected!.columnIndex! + 1)\"\n >\n Coluna {{ selected!.columnIndex! + 1 }}\n </button>\n </ng-container>\n <ng-container *ngIf=\"selected?.fieldName\">\n <span class=\"sep\">\u203A</span>\n <span class=\"crumb active\">{{ selected!.fieldName }}</span>\n </ng-container>\n <button\n *ngIf=\"selected\"\n type=\"button\"\n class=\"crumb as-button crumb-clear\"\n data-crumb=\"clear\"\n (click)=\"onClearSelectionFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Limpar sele\u00E7\u00E3o'\"\n >\n Limpar\n </button>\n </div>\n </ng-container>\n <ng-template #linhasTitle>\n <h5>Linhas</h5>\n </ng-template>\n <div\n class=\"row-list\"\n cdkDropList\n [cdkDropListData]=\"section.rows\"\n (cdkDropListDropped)=\"dropRow($event)\"\n >\n <praxis-row-configurator\n *ngFor=\"let row of section.rows; let i = index\"\n class=\"row-item\"\n [row]=\"row\"\n [fieldMetadata]=\"fieldMetadata\"\n [sectionIndex]=\"sectionIndex\"\n [rowIndex]=\"i\"\n [isLastRow]=\"i === section.rows.length - 1\"\n [selected]=\"selected\"\n [availableFieldsListId]=\"availableFieldsListId\"\n [connectedDropListIds]=\"columnDropListIds\"\n [gapGlobal]=\"gapGlobal\"\n (rowChange)=\"onRowUpdated(i, $event)\"\n (applyRowGapAll)=\"onApplyRowGapAll($event)\"\n (remove)=\"removeRow(i)\"\n (select)=\"select.emit($event)\"\n (fieldDrop)=\"onFieldDrop($event, i)\"\n cdkDrag\n ></praxis-row-configurator>\n </div>\n <div class=\"section-actions\" aria-label=\"A\u00E7\u00F5es da se\u00E7\u00E3o\">\n <button\n class=\"fab-add-row\"\n mat-fab\n color=\"primary\"\n (click)=\"addRow()\"\n matTooltip=\"Adicionar linha\"\n aria-label=\"Adicionar linha\"\n >\n <mat-icon>add</mat-icon>\n </button>\n </div>\n </mat-card-content>\n</mat-card>\n", styles: ["@charset \"UTF-8\";.section-card{background:var(--md-sys-color-surface, var(--sicoob-bg-elev-1));margin-bottom:16px;transition:border-color .2s ease;border:1px solid transparent}.section-card.hovered{border-color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-card.selected{border-color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)));box-shadow:0 0 0 2px var(--md-sys-color-primary)}.section-card:focus-visible{outline:2px solid var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)));outline-offset:2px}.section-card .mat-mdc-card-content{padding-bottom:var(--px-editor-section-gap, 16px)}.section-breadcrumbs{font-size:12px;color:var(--md-sys-color-on-surface-variant);margin:4px 0 8px;display:flex;align-items:center;gap:6px}.section-breadcrumbs .as-button{background:transparent;border:none;padding:0 2px;color:inherit;font:inherit;cursor:pointer;border-radius:4px}.section-breadcrumbs .as-button:hover{color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-breadcrumbs .as-button:focus-visible{outline:2px solid var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)));outline-offset:2px}.section-breadcrumbs .crumb-clear{margin-left:6px;opacity:.85}.section-breadcrumbs .crumb.active{color:var(--md-sys-color-on-surface);font-weight:600}.section-breadcrumbs .sep{opacity:.6}.section-header{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:56px}.title-wrapper{display:flex;align-items:center;gap:8px;width:100%;min-width:0;flex:1 1 auto}.section-heading{display:flex;align-items:center;gap:10px;min-width:0}.section-heading__icon{color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-heading__avatar{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px));display:inline-flex;align-items:center;justify-content:center;width:var(--_pfx-layout-section-avatar-size);height:var(--_pfx-layout-section-avatar-size);border-radius:999px;flex:0 0 var(--_pfx-layout-section-avatar-size);overflow:hidden}.section-heading__avatar.size-sm{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-sm, 24px)}.section-heading__avatar.size-md{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px))}.section-heading__avatar.size-lg{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-lg, 40px)}.section-heading__avatar--text,.section-heading__avatar--placeholder{background:color-mix(in srgb,var(--pfx-editorial-form-accent, var(--md-sys-color-primary, var(--sicoob-primary-default))) 14%,var(--pfx-form-section-surface-flat, var(--md-sys-color-surface, var(--sicoob-bg-elev-1))));color:color-mix(in srgb,var(--pfx-editorial-form-accent, var(--md-sys-color-primary, var(--sicoob-primary-default))) 82%,var(--pfx-form-label-strong, var(--md-sys-color-on-surface, var(--sicoob-text-default))) 18%);font-size:calc(var(--_pfx-layout-section-avatar-size) * .41);font-weight:800;letter-spacing:.04em;text-transform:uppercase}.section-heading__avatar--placeholder mat-icon{font-size:calc(var(--_pfx-layout-section-avatar-size) * .5625);width:calc(var(--_pfx-layout-section-avatar-size) * .5625);height:calc(var(--_pfx-layout-section-avatar-size) * .5625);line-height:calc(var(--_pfx-layout-section-avatar-size) * .5625)}.section-heading__text{display:flex;flex-direction:column;align-items:flex-start;min-width:0}.section-heading .section-name{font-weight:600;color:var(--md-sys-color-on-surface);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.section-heading .section-desc{font-size:12px;color:var(--md-sys-color-on-surface-variant);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.section-editor-trigger{margin-left:auto}.section-header-actions{display:inline-flex;align-items:center;gap:4px;flex-shrink:0}.section-header-actions .mat-mdc-icon-button{width:36px;height:36px;padding:6px}.add-row-button{margin-top:8px}.row-item{animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}.section-card:hover{border-color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-card.collapsed .mat-mdc-card-content{display:none}:host ::ng-deep .section-card .mat-mdc-card-header{padding:8px 12px}:host ::ng-deep .section-card .mat-mdc-card-title{margin:0}:host ::ng-deep .section-card .mat-mdc-card-content{padding:0 12px 12px}.section-actions{position:relative;margin-top:12px;padding-top:16px;border-top:1px solid var(--md-sys-color-outline-variant, var(--md-sys-color-outline-variant, var(--sicoob-stroke-medium)));min-height:28px}.row-list{border-top:1px solid var(--px-editor-separator-color, var(--md-sys-color-outline-variant));padding-top:12px;margin-top:8px}.fab-add-row{position:absolute;top:-15px;left:50%;transform:translate(-50%,calc(-50% - var(--pfx-divider-w, 1px)));z-index:2;--pfx-fab-size: var(--pfx-fab-size-row, 32px);--pfx-fab-icon: var(--pfx-fab-icon-row, 18px);width:var(--pfx-fab-size);height:var(--pfx-fab-size);border-radius:50%}.fab-add-row.mat-mdc-fab{width:var(--pfx-fab-size);height:var(--pfx-fab-size);padding:0}.fab-add-row .mat-mdc-button-touch-target,.fab-add-row .mat-mdc-button-persistent-ripple,.fab-add-row .mat-mdc-button-ripple{width:var(--pfx-fab-size);height:var(--pfx-fab-size)}.fab-add-row mat-icon{font-size:var(--pfx-fab-icon);width:var(--pfx-fab-icon);height:var(--pfx-fab-icon)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: RowConfiguratorComponent, selector: "praxis-row-configurator", inputs: ["row", "fieldMetadata", "sectionIndex", "rowIndex", "isLastRow", "selected", "availableFieldsListId", "connectedDropListIds", "gapGlobal"], outputs: ["rowChange", "remove", "applyRowGapAll", "fieldDrop", "select"] }, { 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: "component", type: i4.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i8$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i8$1.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i8$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i8$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i6.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: i6.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.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: MatDividerModule }, { kind: "component", type: i11$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }] });
|
|
13167
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SectionConfiguratorComponent, deps: [{ token: i2$1.MatDialog }, { token: SectionPresetRegistry }, { token: i7.SettingsPanelService }], target: i0.ɵɵFactoryTarget.Component });
|
|
13168
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: SectionConfiguratorComponent, isStandalone: true, selector: "praxis-section-configurator", inputs: { section: "section", sectionIndex: "sectionIndex", allSections: "allSections", fieldMetadata: "fieldMetadata", selected: "selected", availableFieldsListId: "availableFieldsListId", columnDropListIds: "columnDropListIds", gapGlobal: "gapGlobal" }, outputs: { sectionChange: "sectionChange", applyStyleToAll: "applyStyleToAll", remove: "remove", select: "select", fieldDrop: "fieldDrop" }, ngImport: i0, template: "<mat-card\n class=\"section-card\"\n cdkDrag\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n [class.hovered]=\"isHovered\"\n [class.selected]=\"isThisSectionSelected()\"\n [class.collapsed]=\"isCollapsed\"\n (click)=\"onSelectSection()\"\n tabindex=\"0\"\n role=\"button\"\n [attr.aria-label]=\"'Se\u00E7\u00E3o ' + (sectionIndex + 1)\"\n [attr.aria-selected]=\"isThisSectionSelected()\"\n>\n <mat-card-header class=\"section-header\">\n <mat-card-title class=\"title-wrapper\">\n <div class=\"section-heading\">\n @let headerPreview = getSectionHeaderPreview();\n @let headerAvatarSize = getSectionHeaderAvatarSize();\n @if (headerPreview.kind === 'icon') {\n <mat-icon class=\"section-heading__icon\" aria-hidden=\"true\" [praxisIcon]=\"headerPreview.icon\"></mat-icon>\n }\n @if (headerPreview.kind === 'initials') {\n <span class=\"section-heading__avatar section-heading__avatar--text\" [class.size-sm]=\"headerAvatarSize === 'sm'\"\n [class.size-md]=\"headerAvatarSize === 'md'\" [class.size-lg]=\"headerAvatarSize === 'lg'\"\n [matTooltip]=\"headerPreview.tooltip || ''\" [matTooltipDisabled]=\"!headerPreview.tooltip\">\n {{ headerPreview.text }}\n </span>\n }\n @if (headerPreview.kind === 'placeholder') {\n <span class=\"section-heading__avatar section-heading__avatar--placeholder\" [class.size-sm]=\"headerAvatarSize === 'sm'\"\n [class.size-md]=\"headerAvatarSize === 'md'\" [class.size-lg]=\"headerAvatarSize === 'lg'\"\n [matTooltip]=\"headerPreview.tooltip || ''\" [matTooltipDisabled]=\"!headerPreview.tooltip\">\n @if (headerPreview.icon) {\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"headerPreview.icon\"></mat-icon>\n }\n </span>\n }\n <div class=\"section-heading__text\">\n <span class=\"section-name\">{{ section.title || 'Sem t\u00EDtulo' }}</span>\n <span class=\"section-desc\" *ngIf=\"section.description\">{{ section.description }}</span>\n </div>\n </div>\n <button\n mat-icon-button\n type=\"button\"\n color=\"primary\"\n class=\"section-editor-trigger\"\n (click)=\"openAdvancedEditor($event)\"\n matTooltip=\"Para editar o t\u00EDtulo, use o editor completo da se\u00E7\u00E3o\"\n aria-label=\"Abrir editor da se\u00E7\u00E3o\"\n >\n <mat-icon>open_in_new</mat-icon>\n </button>\n </mat-card-title>\n <div class=\"section-header-actions\">\n <button\n mat-icon-button\n class=\"section-collapse-btn\"\n type=\"button\"\n (click)=\"toggleCollapsed($event)\"\n [attr.aria-expanded]=\"!isCollapsed\"\n [attr.aria-label]=\"isCollapsed ? 'Expandir se\u00E7\u00E3o' : 'Colapsar se\u00E7\u00E3o'\"\n [matTooltip]=\"isCollapsed ? 'Expandir se\u00E7\u00E3o' : 'Colapsar se\u00E7\u00E3o'\"\n >\n <mat-icon>{{ isCollapsed ? 'unfold_more' : 'unfold_less' }}</mat-icon>\n </button>\n <button\n mat-icon-button\n class=\"section-menu-btn\"\n [matMenuTriggerFor]=\"sectionMenu\"\n aria-label=\"Mais a\u00E7\u00F5es da se\u00E7\u00E3o\"\n matTooltip=\"Mais a\u00E7\u00F5es\"\n >\n <mat-icon [praxisIcon]=\"'more_vert'\"></mat-icon>\n </button>\n </div>\n <mat-menu #sectionMenu=\"matMenu\">\n <button mat-menu-item (click)=\"openSectionPresets()\">\n <mat-icon [praxisIcon]=\"'view_quilt'\"></mat-icon>\n <span>Presets de se\u00E7\u00E3o\u2026</span>\n </button>\n <button mat-menu-item (click)=\"applyCurrentStyleToAll()\">\n <mat-icon [praxisIcon]=\"'format_paint'\"></mat-icon>\n <span>Aplicar estilo desta se\u00E7\u00E3o a todas</span>\n </button>\n <mat-divider></mat-divider>\n <button mat-menu-item *ngIf=\"section.description == null\" (click)=\"section.description = ''; onSectionUpdated()\">\n <mat-icon [praxisIcon]=\"'note_add'\"></mat-icon>\n <span>Adicionar descri\u00E7\u00E3o</span>\n </button>\n <button mat-menu-item *ngIf=\"section.description != null\" (click)=\"section.description = undefined; onSectionUpdated()\">\n <mat-icon [praxisIcon]=\"'backspace'\"></mat-icon>\n <span>Remover descri\u00E7\u00E3o</span>\n </button>\n <mat-divider></mat-divider>\n <button mat-menu-item (click)=\"onRemoveSection()\">\n <mat-icon [praxisIcon]=\"'delete'\"></mat-icon>\n <span>Remover se\u00E7\u00E3o</span>\n </button>\n </mat-menu>\n </mat-card-header>\n <mat-card-content [attr.aria-hidden]=\"isCollapsed\">\n <ng-container *ngIf=\"isThisSectionSelected(); else linhasTitle\">\n <div class=\"section-breadcrumbs\" (click)=\"$event.stopPropagation()\">\n <button\n type=\"button\"\n class=\"crumb as-button\"\n data-crumb=\"layout\"\n [attr.aria-label]=\"'Voltar ao Layout'\"\n disabled\n >\n Layout\n </button>\n <span class=\"sep\">\u203A</span>\n <button\n type=\"button\"\n class=\"crumb as-button crumb-section\"\n data-crumb=\"section\"\n (click)=\"onSelectSectionFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Selecionar Se\u00E7\u00E3o ' + (sectionIndex + 1)\"\n >\n Se\u00E7\u00E3o {{ sectionIndex + 1 }}\n </button>\n <ng-container *ngIf=\"selected?.rowIndex != null\">\n <span class=\"sep\">\u203A</span>\n <button\n type=\"button\"\n class=\"crumb as-button crumb-row\"\n data-crumb=\"row\"\n (click)=\"onSelectRowFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Selecionar Linha ' + (selected!.rowIndex! + 1)\"\n >\n Linha {{ selected!.rowIndex! + 1 }}\n </button>\n </ng-container>\n <ng-container *ngIf=\"selected?.columnIndex != null\">\n <span class=\"sep\">\u203A</span>\n <button\n type=\"button\"\n class=\"crumb as-button crumb-column\"\n data-crumb=\"column\"\n (click)=\"onSelectColumnFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Selecionar Coluna ' + (selected!.columnIndex! + 1)\"\n >\n Coluna {{ selected!.columnIndex! + 1 }}\n </button>\n </ng-container>\n <ng-container *ngIf=\"selected?.fieldName\">\n <span class=\"sep\">\u203A</span>\n <span class=\"crumb active\">{{ selected!.fieldName }}</span>\n </ng-container>\n <button\n *ngIf=\"selected\"\n type=\"button\"\n class=\"crumb as-button crumb-clear\"\n data-crumb=\"clear\"\n (click)=\"onClearSelectionFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Limpar sele\u00E7\u00E3o'\"\n >\n Limpar\n </button>\n </div>\n </ng-container>\n <ng-template #linhasTitle>\n <h5>Linhas</h5>\n </ng-template>\n <div\n class=\"row-list\"\n cdkDropList\n [cdkDropListData]=\"section.rows\"\n (cdkDropListDropped)=\"dropRow($event)\"\n >\n <praxis-row-configurator\n *ngFor=\"let row of section.rows; let i = index\"\n class=\"row-item\"\n [row]=\"row\"\n [fieldMetadata]=\"fieldMetadata\"\n [sectionIndex]=\"sectionIndex\"\n [rowIndex]=\"i\"\n [isLastRow]=\"i === section.rows.length - 1\"\n [selected]=\"selected\"\n [availableFieldsListId]=\"availableFieldsListId\"\n [connectedDropListIds]=\"columnDropListIds\"\n [gapGlobal]=\"gapGlobal\"\n (rowChange)=\"onRowUpdated(i, $event)\"\n (applyRowGapAll)=\"onApplyRowGapAll($event)\"\n (remove)=\"removeRow(i)\"\n (select)=\"select.emit($event)\"\n (fieldDrop)=\"onFieldDrop($event, i)\"\n cdkDrag\n ></praxis-row-configurator>\n </div>\n <div class=\"section-actions\" aria-label=\"A\u00E7\u00F5es da se\u00E7\u00E3o\">\n <button\n class=\"fab-add-row\"\n mat-fab\n color=\"primary\"\n (click)=\"addRow()\"\n matTooltip=\"Adicionar linha\"\n aria-label=\"Adicionar linha\"\n >\n <mat-icon>add</mat-icon>\n </button>\n </div>\n </mat-card-content>\n</mat-card>\n", styles: ["@charset \"UTF-8\";.section-card{background:var(--md-sys-color-surface, var(--sicoob-bg-elev-1));margin-bottom:16px;transition:border-color .2s ease;border:1px solid transparent}.section-card.hovered{border-color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-card.selected{border-color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)));box-shadow:0 0 0 2px var(--md-sys-color-primary)}.section-card:focus-visible{outline:2px solid var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)));outline-offset:2px}.section-card .mat-mdc-card-content{padding-bottom:var(--px-editor-section-gap, 16px)}.section-breadcrumbs{font-size:12px;color:var(--md-sys-color-on-surface-variant);margin:4px 0 8px;display:flex;align-items:center;gap:6px}.section-breadcrumbs .as-button{background:transparent;border:none;padding:0 2px;color:inherit;font:inherit;cursor:pointer;border-radius:4px}.section-breadcrumbs .as-button:hover{color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-breadcrumbs .as-button:focus-visible{outline:2px solid var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)));outline-offset:2px}.section-breadcrumbs .crumb-clear{margin-left:6px;opacity:.85}.section-breadcrumbs .crumb.active{color:var(--md-sys-color-on-surface);font-weight:600}.section-breadcrumbs .sep{opacity:.6}.section-header{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:56px}.title-wrapper{display:flex;align-items:center;gap:8px;width:100%;min-width:0;flex:1 1 auto}.section-heading{display:flex;align-items:center;gap:10px;min-width:0}.section-heading__icon{color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-heading__avatar{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px));display:inline-flex;align-items:center;justify-content:center;width:var(--_pfx-layout-section-avatar-size);height:var(--_pfx-layout-section-avatar-size);border-radius:999px;flex:0 0 var(--_pfx-layout-section-avatar-size);overflow:hidden}.section-heading__avatar.size-sm{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-sm, 24px)}.section-heading__avatar.size-md{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px))}.section-heading__avatar.size-lg{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-lg, 40px)}.section-heading__avatar--text,.section-heading__avatar--placeholder{background:color-mix(in srgb,var(--pfx-editorial-form-accent, var(--md-sys-color-primary, var(--sicoob-primary-default))) 14%,var(--pfx-form-section-surface-flat, var(--md-sys-color-surface, var(--sicoob-bg-elev-1))));color:color-mix(in srgb,var(--pfx-editorial-form-accent, var(--md-sys-color-primary, var(--sicoob-primary-default))) 82%,var(--pfx-form-label-strong, var(--md-sys-color-on-surface, var(--sicoob-text-default))) 18%);font-size:calc(var(--_pfx-layout-section-avatar-size) * .41);font-weight:800;letter-spacing:.04em;text-transform:uppercase}.section-heading__avatar--placeholder mat-icon{font-size:calc(var(--_pfx-layout-section-avatar-size) * .5625);width:calc(var(--_pfx-layout-section-avatar-size) * .5625);height:calc(var(--_pfx-layout-section-avatar-size) * .5625);line-height:calc(var(--_pfx-layout-section-avatar-size) * .5625)}.section-heading__text{display:flex;flex-direction:column;align-items:flex-start;min-width:0}.section-heading .section-name{font-weight:600;color:var(--md-sys-color-on-surface);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.section-heading .section-desc{font-size:12px;color:var(--md-sys-color-on-surface-variant);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.section-editor-trigger{margin-left:auto}.section-header-actions{display:inline-flex;align-items:center;gap:4px;flex-shrink:0}.section-header-actions .mat-mdc-icon-button{width:36px;height:36px;padding:6px}.add-row-button{margin-top:8px}.row-item{animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}.section-card:hover{border-color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-card.collapsed .mat-mdc-card-content{display:none}:host ::ng-deep .section-card .mat-mdc-card-header{padding:8px 12px}:host ::ng-deep .section-card .mat-mdc-card-title{margin:0}:host ::ng-deep .section-card .mat-mdc-card-content{padding:0 12px 12px}.section-actions{position:relative;margin-top:12px;padding-top:16px;border-top:1px solid var(--md-sys-color-outline-variant, var(--md-sys-color-outline-variant, var(--sicoob-stroke-medium)));min-height:28px}.row-list{border-top:1px solid var(--px-editor-separator-color, var(--md-sys-color-outline-variant));padding-top:12px;margin-top:8px}.fab-add-row{position:absolute;top:-15px;left:50%;transform:translate(-50%,calc(-50% - var(--pfx-divider-w, 1px)));z-index:2;--pfx-fab-size: var(--pfx-fab-size-row, 32px);--pfx-fab-icon: var(--pfx-fab-icon-row, 18px);width:var(--pfx-fab-size);height:var(--pfx-fab-size);border-radius:50%}.fab-add-row.mat-mdc-fab{width:var(--pfx-fab-size);height:var(--pfx-fab-size);padding:0}.fab-add-row .mat-mdc-button-touch-target,.fab-add-row .mat-mdc-button-persistent-ripple,.fab-add-row .mat-mdc-button-ripple{width:var(--pfx-fab-size);height:var(--pfx-fab-size)}.fab-add-row mat-icon{font-size:var(--pfx-fab-icon);width:var(--pfx-fab-icon);height:var(--pfx-fab-icon)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: RowConfiguratorComponent, selector: "praxis-row-configurator", inputs: ["row", "fieldMetadata", "sectionIndex", "rowIndex", "isLastRow", "selected", "availableFieldsListId", "connectedDropListIds", "gapGlobal"], outputs: ["rowChange", "remove", "applyRowGapAll", "fieldDrop", "select"] }, { 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: "component", type: i4.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i8.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i8.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i8.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i8.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i6.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: i6.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.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: MatDividerModule }, { kind: "component", type: i11.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }] });
|
|
12892
13169
|
}
|
|
12893
13170
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SectionConfiguratorComponent, decorators: [{
|
|
12894
13171
|
type: Component,
|
|
@@ -12905,7 +13182,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
12905
13182
|
MatMenuModule,
|
|
12906
13183
|
MatDividerModule,
|
|
12907
13184
|
], template: "<mat-card\n class=\"section-card\"\n cdkDrag\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n [class.hovered]=\"isHovered\"\n [class.selected]=\"isThisSectionSelected()\"\n [class.collapsed]=\"isCollapsed\"\n (click)=\"onSelectSection()\"\n tabindex=\"0\"\n role=\"button\"\n [attr.aria-label]=\"'Se\u00E7\u00E3o ' + (sectionIndex + 1)\"\n [attr.aria-selected]=\"isThisSectionSelected()\"\n>\n <mat-card-header class=\"section-header\">\n <mat-card-title class=\"title-wrapper\">\n <div class=\"section-heading\">\n @let headerPreview = getSectionHeaderPreview();\n @let headerAvatarSize = getSectionHeaderAvatarSize();\n @if (headerPreview.kind === 'icon') {\n <mat-icon class=\"section-heading__icon\" aria-hidden=\"true\" [praxisIcon]=\"headerPreview.icon\"></mat-icon>\n }\n @if (headerPreview.kind === 'initials') {\n <span class=\"section-heading__avatar section-heading__avatar--text\" [class.size-sm]=\"headerAvatarSize === 'sm'\"\n [class.size-md]=\"headerAvatarSize === 'md'\" [class.size-lg]=\"headerAvatarSize === 'lg'\"\n [matTooltip]=\"headerPreview.tooltip || ''\" [matTooltipDisabled]=\"!headerPreview.tooltip\">\n {{ headerPreview.text }}\n </span>\n }\n @if (headerPreview.kind === 'placeholder') {\n <span class=\"section-heading__avatar section-heading__avatar--placeholder\" [class.size-sm]=\"headerAvatarSize === 'sm'\"\n [class.size-md]=\"headerAvatarSize === 'md'\" [class.size-lg]=\"headerAvatarSize === 'lg'\"\n [matTooltip]=\"headerPreview.tooltip || ''\" [matTooltipDisabled]=\"!headerPreview.tooltip\">\n @if (headerPreview.icon) {\n <mat-icon aria-hidden=\"true\" [praxisIcon]=\"headerPreview.icon\"></mat-icon>\n }\n </span>\n }\n <div class=\"section-heading__text\">\n <span class=\"section-name\">{{ section.title || 'Sem t\u00EDtulo' }}</span>\n <span class=\"section-desc\" *ngIf=\"section.description\">{{ section.description }}</span>\n </div>\n </div>\n <button\n mat-icon-button\n type=\"button\"\n color=\"primary\"\n class=\"section-editor-trigger\"\n (click)=\"openAdvancedEditor($event)\"\n matTooltip=\"Para editar o t\u00EDtulo, use o editor completo da se\u00E7\u00E3o\"\n aria-label=\"Abrir editor da se\u00E7\u00E3o\"\n >\n <mat-icon>open_in_new</mat-icon>\n </button>\n </mat-card-title>\n <div class=\"section-header-actions\">\n <button\n mat-icon-button\n class=\"section-collapse-btn\"\n type=\"button\"\n (click)=\"toggleCollapsed($event)\"\n [attr.aria-expanded]=\"!isCollapsed\"\n [attr.aria-label]=\"isCollapsed ? 'Expandir se\u00E7\u00E3o' : 'Colapsar se\u00E7\u00E3o'\"\n [matTooltip]=\"isCollapsed ? 'Expandir se\u00E7\u00E3o' : 'Colapsar se\u00E7\u00E3o'\"\n >\n <mat-icon>{{ isCollapsed ? 'unfold_more' : 'unfold_less' }}</mat-icon>\n </button>\n <button\n mat-icon-button\n class=\"section-menu-btn\"\n [matMenuTriggerFor]=\"sectionMenu\"\n aria-label=\"Mais a\u00E7\u00F5es da se\u00E7\u00E3o\"\n matTooltip=\"Mais a\u00E7\u00F5es\"\n >\n <mat-icon [praxisIcon]=\"'more_vert'\"></mat-icon>\n </button>\n </div>\n <mat-menu #sectionMenu=\"matMenu\">\n <button mat-menu-item (click)=\"openSectionPresets()\">\n <mat-icon [praxisIcon]=\"'view_quilt'\"></mat-icon>\n <span>Presets de se\u00E7\u00E3o\u2026</span>\n </button>\n <button mat-menu-item (click)=\"applyCurrentStyleToAll()\">\n <mat-icon [praxisIcon]=\"'format_paint'\"></mat-icon>\n <span>Aplicar estilo desta se\u00E7\u00E3o a todas</span>\n </button>\n <mat-divider></mat-divider>\n <button mat-menu-item *ngIf=\"section.description == null\" (click)=\"section.description = ''; onSectionUpdated()\">\n <mat-icon [praxisIcon]=\"'note_add'\"></mat-icon>\n <span>Adicionar descri\u00E7\u00E3o</span>\n </button>\n <button mat-menu-item *ngIf=\"section.description != null\" (click)=\"section.description = undefined; onSectionUpdated()\">\n <mat-icon [praxisIcon]=\"'backspace'\"></mat-icon>\n <span>Remover descri\u00E7\u00E3o</span>\n </button>\n <mat-divider></mat-divider>\n <button mat-menu-item (click)=\"onRemoveSection()\">\n <mat-icon [praxisIcon]=\"'delete'\"></mat-icon>\n <span>Remover se\u00E7\u00E3o</span>\n </button>\n </mat-menu>\n </mat-card-header>\n <mat-card-content [attr.aria-hidden]=\"isCollapsed\">\n <ng-container *ngIf=\"isThisSectionSelected(); else linhasTitle\">\n <div class=\"section-breadcrumbs\" (click)=\"$event.stopPropagation()\">\n <button\n type=\"button\"\n class=\"crumb as-button\"\n data-crumb=\"layout\"\n [attr.aria-label]=\"'Voltar ao Layout'\"\n disabled\n >\n Layout\n </button>\n <span class=\"sep\">\u203A</span>\n <button\n type=\"button\"\n class=\"crumb as-button crumb-section\"\n data-crumb=\"section\"\n (click)=\"onSelectSectionFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Selecionar Se\u00E7\u00E3o ' + (sectionIndex + 1)\"\n >\n Se\u00E7\u00E3o {{ sectionIndex + 1 }}\n </button>\n <ng-container *ngIf=\"selected?.rowIndex != null\">\n <span class=\"sep\">\u203A</span>\n <button\n type=\"button\"\n class=\"crumb as-button crumb-row\"\n data-crumb=\"row\"\n (click)=\"onSelectRowFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Selecionar Linha ' + (selected!.rowIndex! + 1)\"\n >\n Linha {{ selected!.rowIndex! + 1 }}\n </button>\n </ng-container>\n <ng-container *ngIf=\"selected?.columnIndex != null\">\n <span class=\"sep\">\u203A</span>\n <button\n type=\"button\"\n class=\"crumb as-button crumb-column\"\n data-crumb=\"column\"\n (click)=\"onSelectColumnFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Selecionar Coluna ' + (selected!.columnIndex! + 1)\"\n >\n Coluna {{ selected!.columnIndex! + 1 }}\n </button>\n </ng-container>\n <ng-container *ngIf=\"selected?.fieldName\">\n <span class=\"sep\">\u203A</span>\n <span class=\"crumb active\">{{ selected!.fieldName }}</span>\n </ng-container>\n <button\n *ngIf=\"selected\"\n type=\"button\"\n class=\"crumb as-button crumb-clear\"\n data-crumb=\"clear\"\n (click)=\"onClearSelectionFromBreadcrumb($event)\"\n [attr.aria-label]=\"'Limpar sele\u00E7\u00E3o'\"\n >\n Limpar\n </button>\n </div>\n </ng-container>\n <ng-template #linhasTitle>\n <h5>Linhas</h5>\n </ng-template>\n <div\n class=\"row-list\"\n cdkDropList\n [cdkDropListData]=\"section.rows\"\n (cdkDropListDropped)=\"dropRow($event)\"\n >\n <praxis-row-configurator\n *ngFor=\"let row of section.rows; let i = index\"\n class=\"row-item\"\n [row]=\"row\"\n [fieldMetadata]=\"fieldMetadata\"\n [sectionIndex]=\"sectionIndex\"\n [rowIndex]=\"i\"\n [isLastRow]=\"i === section.rows.length - 1\"\n [selected]=\"selected\"\n [availableFieldsListId]=\"availableFieldsListId\"\n [connectedDropListIds]=\"columnDropListIds\"\n [gapGlobal]=\"gapGlobal\"\n (rowChange)=\"onRowUpdated(i, $event)\"\n (applyRowGapAll)=\"onApplyRowGapAll($event)\"\n (remove)=\"removeRow(i)\"\n (select)=\"select.emit($event)\"\n (fieldDrop)=\"onFieldDrop($event, i)\"\n cdkDrag\n ></praxis-row-configurator>\n </div>\n <div class=\"section-actions\" aria-label=\"A\u00E7\u00F5es da se\u00E7\u00E3o\">\n <button\n class=\"fab-add-row\"\n mat-fab\n color=\"primary\"\n (click)=\"addRow()\"\n matTooltip=\"Adicionar linha\"\n aria-label=\"Adicionar linha\"\n >\n <mat-icon>add</mat-icon>\n </button>\n </div>\n </mat-card-content>\n</mat-card>\n", styles: ["@charset \"UTF-8\";.section-card{background:var(--md-sys-color-surface, var(--sicoob-bg-elev-1));margin-bottom:16px;transition:border-color .2s ease;border:1px solid transparent}.section-card.hovered{border-color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-card.selected{border-color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)));box-shadow:0 0 0 2px var(--md-sys-color-primary)}.section-card:focus-visible{outline:2px solid var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)));outline-offset:2px}.section-card .mat-mdc-card-content{padding-bottom:var(--px-editor-section-gap, 16px)}.section-breadcrumbs{font-size:12px;color:var(--md-sys-color-on-surface-variant);margin:4px 0 8px;display:flex;align-items:center;gap:6px}.section-breadcrumbs .as-button{background:transparent;border:none;padding:0 2px;color:inherit;font:inherit;cursor:pointer;border-radius:4px}.section-breadcrumbs .as-button:hover{color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-breadcrumbs .as-button:focus-visible{outline:2px solid var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)));outline-offset:2px}.section-breadcrumbs .crumb-clear{margin-left:6px;opacity:.85}.section-breadcrumbs .crumb.active{color:var(--md-sys-color-on-surface);font-weight:600}.section-breadcrumbs .sep{opacity:.6}.section-header{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:56px}.title-wrapper{display:flex;align-items:center;gap:8px;width:100%;min-width:0;flex:1 1 auto}.section-heading{display:flex;align-items:center;gap:10px;min-width:0}.section-heading__icon{color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-heading__avatar{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px));display:inline-flex;align-items:center;justify-content:center;width:var(--_pfx-layout-section-avatar-size);height:var(--_pfx-layout-section-avatar-size);border-radius:999px;flex:0 0 var(--_pfx-layout-section-avatar-size);overflow:hidden}.section-heading__avatar.size-sm{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-sm, 24px)}.section-heading__avatar.size-md{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-md, var(--pfx-form-section-avatar-size, 32px))}.section-heading__avatar.size-lg{--_pfx-layout-section-avatar-size: var(--pfx-form-section-avatar-size-lg, 40px)}.section-heading__avatar--text,.section-heading__avatar--placeholder{background:color-mix(in srgb,var(--pfx-editorial-form-accent, var(--md-sys-color-primary, var(--sicoob-primary-default))) 14%,var(--pfx-form-section-surface-flat, var(--md-sys-color-surface, var(--sicoob-bg-elev-1))));color:color-mix(in srgb,var(--pfx-editorial-form-accent, var(--md-sys-color-primary, var(--sicoob-primary-default))) 82%,var(--pfx-form-label-strong, var(--md-sys-color-on-surface, var(--sicoob-text-default))) 18%);font-size:calc(var(--_pfx-layout-section-avatar-size) * .41);font-weight:800;letter-spacing:.04em;text-transform:uppercase}.section-heading__avatar--placeholder mat-icon{font-size:calc(var(--_pfx-layout-section-avatar-size) * .5625);width:calc(var(--_pfx-layout-section-avatar-size) * .5625);height:calc(var(--_pfx-layout-section-avatar-size) * .5625);line-height:calc(var(--_pfx-layout-section-avatar-size) * .5625)}.section-heading__text{display:flex;flex-direction:column;align-items:flex-start;min-width:0}.section-heading .section-name{font-weight:600;color:var(--md-sys-color-on-surface);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.section-heading .section-desc{font-size:12px;color:var(--md-sys-color-on-surface-variant);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.section-editor-trigger{margin-left:auto}.section-header-actions{display:inline-flex;align-items:center;gap:4px;flex-shrink:0}.section-header-actions .mat-mdc-icon-button{width:36px;height:36px;padding:6px}.add-row-button{margin-top:8px}.row-item{animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}.section-card:hover{border-color:var(--md-sys-color-primary, var(--md-sys-color-primary, var(--sicoob-primary-default)))}.section-card.collapsed .mat-mdc-card-content{display:none}:host ::ng-deep .section-card .mat-mdc-card-header{padding:8px 12px}:host ::ng-deep .section-card .mat-mdc-card-title{margin:0}:host ::ng-deep .section-card .mat-mdc-card-content{padding:0 12px 12px}.section-actions{position:relative;margin-top:12px;padding-top:16px;border-top:1px solid var(--md-sys-color-outline-variant, var(--md-sys-color-outline-variant, var(--sicoob-stroke-medium)));min-height:28px}.row-list{border-top:1px solid var(--px-editor-separator-color, var(--md-sys-color-outline-variant));padding-top:12px;margin-top:8px}.fab-add-row{position:absolute;top:-15px;left:50%;transform:translate(-50%,calc(-50% - var(--pfx-divider-w, 1px)));z-index:2;--pfx-fab-size: var(--pfx-fab-size-row, 32px);--pfx-fab-icon: var(--pfx-fab-icon-row, 18px);width:var(--pfx-fab-size);height:var(--pfx-fab-size);border-radius:50%}.fab-add-row.mat-mdc-fab{width:var(--pfx-fab-size);height:var(--pfx-fab-size);padding:0}.fab-add-row .mat-mdc-button-touch-target,.fab-add-row .mat-mdc-button-persistent-ripple,.fab-add-row .mat-mdc-button-ripple{width:var(--pfx-fab-size);height:var(--pfx-fab-size)}.fab-add-row mat-icon{font-size:var(--pfx-fab-icon);width:var(--pfx-fab-icon);height:var(--pfx-fab-icon)}\n"] }]
|
|
12908
|
-
}], ctorParameters: () => [{ type: i2.MatDialog }, { type: SectionPresetRegistry }, { type:
|
|
13185
|
+
}], ctorParameters: () => [{ type: i2$1.MatDialog }, { type: SectionPresetRegistry }, { type: i7.SettingsPanelService }], propDecorators: { section: [{
|
|
12909
13186
|
type: Input
|
|
12910
13187
|
}], sectionIndex: [{
|
|
12911
13188
|
type: Input
|
|
@@ -13353,7 +13630,7 @@ class LayoutEditorComponent {
|
|
|
13353
13630
|
</div>
|
|
13354
13631
|
</div>
|
|
13355
13632
|
</div>
|
|
13356
|
-
`, isInline: true, styles: [".layout-editor-wrapper{display:flex;flex-wrap:wrap;gap:16px}.layout-editor-wrapper.no-available-fields{gap:0}.editor-toolbar{position:sticky;top:0;z-index:3;display:flex;gap:16px;align-items:center;min-height:56px;background:var(--md-sys-color-surface-container);border-bottom:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level1, var(--md-sys-elevation-level1));padding:0 12px;margin:0 0 var(--px-editor-section-gap, 16px) 0}.editor-toolbar .title-block{display:flex;flex-direction:column;justify-content:center;gap:2px}.editor-toolbar .toolbar-title{font:var(--mdc-typography-title-small, 600 15px/20px system-ui);color:var(--md-sys-color-on-surface)}.editor-toolbar .toolbar-subtitle{font:var(--mdc-typography-body-small, 400 12px/16px system-ui);color:var(--md-sys-color-on-surface-variant)}.editor-toolbar .spacer{flex:1 1 auto}.editor-toolbar .toolbar-group{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.editor-toolbar .gap-group{align-items:center}.editor-toolbar .group-label{font:var(--mdc-typography-label-medium, 500 12px/16px system-ui);color:var(--md-sys-color-on-surface-variant)}.editor-toolbar .gap-group{align-items:center;gap:10px}.editor-toolbar .density-control{display:flex;align-items:center;gap:8px}.editor-toolbar .density-label{font:var(--mdc-typography-label-medium, 500 12px/16px system-ui);opacity:.9}.editor-toolbar .density-toggle .mat-button-toggle-button,.toggle-icons-group .mat-button-toggle-button{height:32px}.toggle-icons-group .mat-icon{font-size:20px;width:20px;height:20px;line-height:20px}.gap-chip{display:inline-flex;align-items:center;gap:2px;padding:0 4px;height:32px;border-radius:8px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-variant)}.gap-chip__btn{width:24px;height:24px;line-height:24px;min-width:0;padding:0;--mdc-icon-button-size: 24px;--mdc-icon-button-state-layer-size: 24px}.gap-chip .mat-mdc-button-touch-target{width:24px;height:24px}.gap-chip mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.gap-chip__input{width:42px;border:none;background:transparent;color:var(--md-sys-color-on-surface);font:var(--mdc-typography-body-medium, 600 13px/18px system-ui);text-align:center;outline:none;-moz-appearance:textfield}.gap-chip__input::-webkit-outer-spin-button,.gap-chip__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.gap-chip__suffix{color:var(--md-sys-color-on-surface-variant);font:var(--mdc-typography-label-medium, 500 12px/16px system-ui)}.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:12px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface-variant);font-size:12px}.pill.subtle{background:transparent;color:var(--md-sys-color-on-surface-variant);padding-left:0}.available-fields{width:250px;border:1px solid var(--md-sys-color-outline-variant);border-radius:12px;padding:10px;background:var(--md-sys-color-surface)}.collapse-toggle{float:right}.available-fields__hint{display:block;margin-bottom:8px;color:var(--md-sys-color-on-surface-variant);font-size:12px}.no-fields-chip{position:absolute;top:8px;right:8px;padding:4px 8px;border:1px dashed var(--md-sys-color-outline);border-radius:16px;color:var(--md-sys-color-outline);font-size:12px;background:var(--md-sys-color-surface);pointer-events:none}.layout-canvas{flex-grow:1;overflow:visible;max-height:none;position:relative}.field-list{min-height:100px}.section-list{display:flex;flex-direction:column;gap:var(--pfx-section-gap, 20px)}.add-section-container{position:relative;padding-top:16px;margin-top:12px;border-top:1px solid var(--md-sys-color-outline-variant);min-height:28px}.fab-add-section{position:absolute;top:-30px;left:50%;transform:translate(-50%,calc(-50% - var(--pfx-divider-w, 1px)));z-index:2;--pfx-fab-size: var(--pfx-fab-size-section, 32px);--pfx-fab-icon: var(--pfx-fab-icon-section, 18px);width:var(--pfx-fab-size);height:var(--pfx-fab-size);border-radius:50%}.fab-add-section mat-icon{font-size:var(--pfx-fab-icon);width:var(--pfx-fab-icon);height:var(--pfx-fab-icon)}.fab-add-section.mat-mdc-fab{width:var(--pfx-fab-size);height:var(--pfx-fab-size);padding:0}.fab-add-section .mat-mdc-button-touch-target,.fab-add-section .mat-mdc-button-persistent-ripple,.fab-add-section .mat-mdc-button-ripple{width:var(--pfx-fab-size);height:var(--pfx-fab-size)}.cdk-drag-placeholder{opacity:.3;transition:opacity .2s ease}:host ::ng-deep .mdc-text-field--filled{--mdc-filled-text-field-container-color: var(--md-sys-color-surface-container)}:host ::ng-deep .mdc-text-field__input::placeholder{color:var(--md-sys-color-on-surface-variant)!important;opacity:.95}:host ::ng-deep .mat-mdc-form-field-subscript-wrapper,:host ::ng-deep .mat-mdc-hint{color:var(--md-sys-color-on-surface-variant)!important}:host ::ng-deep .mdc-text-field--disabled .mdc-text-field__input,:host ::ng-deep .mat-mdc-select-disabled .mat-mdc-select-value{color:var(--md-sys-color-on-surface-variant)!important}:host ::ng-deep .mat-button-toggle-checked{background:var(--md-sys-color-primary-container)!important;color:var(--md-sys-color-on-primary-container)!important}:host{--px-editor-section-gap: 16px;--pfx-grid-gap: 12px;--pfx-section-gap: var(--px-editor-section-gap)}@media(min-width:960px){:host{--px-editor-section-gap: 20px;--pfx-grid-gap: 16px}}@media(min-width:1280px){:host{--px-editor-section-gap: 24px;--pfx-grid-gap: 20px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "component", type: SectionConfiguratorComponent, selector: "praxis-section-configurator", inputs: ["section", "sectionIndex", "allSections", "fieldMetadata", "selected", "availableFieldsListId", "columnDropListIds", "gapGlobal"], outputs: ["sectionChange", "applyStyleToAll", "remove", "select", "fieldDrop"] }, { kind: "component", type: FieldConfiguratorComponent, selector: "praxis-field-configurator", inputs: ["field"] }, { 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: "component", type: i4.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i6$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i7$1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i7$1.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
13633
|
+
`, isInline: true, styles: [".layout-editor-wrapper{display:flex;flex-wrap:wrap;gap:16px}.layout-editor-wrapper.no-available-fields{gap:0}.editor-toolbar{position:sticky;top:0;z-index:3;display:flex;gap:16px;align-items:center;min-height:56px;background:var(--md-sys-color-surface-container);border-bottom:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level1, var(--md-sys-elevation-level1));padding:0 12px;margin:0 0 var(--px-editor-section-gap, 16px) 0}.editor-toolbar .title-block{display:flex;flex-direction:column;justify-content:center;gap:2px}.editor-toolbar .toolbar-title{font:var(--mdc-typography-title-small, 600 15px/20px system-ui);color:var(--md-sys-color-on-surface)}.editor-toolbar .toolbar-subtitle{font:var(--mdc-typography-body-small, 400 12px/16px system-ui);color:var(--md-sys-color-on-surface-variant)}.editor-toolbar .spacer{flex:1 1 auto}.editor-toolbar .toolbar-group{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.editor-toolbar .gap-group{align-items:center}.editor-toolbar .group-label{font:var(--mdc-typography-label-medium, 500 12px/16px system-ui);color:var(--md-sys-color-on-surface-variant)}.editor-toolbar .gap-group{align-items:center;gap:10px}.editor-toolbar .density-control{display:flex;align-items:center;gap:8px}.editor-toolbar .density-label{font:var(--mdc-typography-label-medium, 500 12px/16px system-ui);opacity:.9}.editor-toolbar .density-toggle,.editor-toolbar .toggle-icons-group{border:1px solid var(--md-sys-color-outline-variant);border-radius:999px;overflow:hidden;background:var(--md-sys-color-surface-container-low)}.editor-toolbar .density-toggle .mat-button-toggle,.editor-toolbar .toggle-icons-group .mat-button-toggle{background:var(--md-sys-color-surface-container-low);color:var(--md-sys-color-on-surface-variant)}.editor-toolbar .density-toggle .mat-button-toggle+.mat-button-toggle,.editor-toolbar .toggle-icons-group .mat-button-toggle+.mat-button-toggle{border-left:1px solid var(--md-sys-color-outline-variant)}.editor-toolbar .density-toggle .mat-button-toggle-button,.toggle-icons-group .mat-button-toggle-button{height:32px}.editor-toolbar .density-toggle .mat-icon,.toggle-icons-group .mat-icon{font-size:20px;width:20px;height:20px;line-height:20px}.editor-toolbar .density-toggle .mat-icon,.editor-toolbar .toggle-icons-group .mat-icon{color:inherit}.gap-chip{display:inline-flex;align-items:center;gap:2px;padding:0 4px;height:32px;border-radius:8px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-variant)}.gap-chip__btn{width:24px;height:24px;line-height:24px;min-width:0;padding:0;--mdc-icon-button-size: 24px;--mdc-icon-button-state-layer-size: 24px}.gap-chip .mat-mdc-button-touch-target{width:24px;height:24px}.gap-chip mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.gap-chip__input{width:42px;border:none;background:transparent;color:var(--md-sys-color-on-surface);font:var(--mdc-typography-body-medium, 600 13px/18px system-ui);text-align:center;outline:none;-moz-appearance:textfield}.gap-chip__input::-webkit-outer-spin-button,.gap-chip__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.gap-chip__suffix{color:var(--md-sys-color-on-surface-variant);font:var(--mdc-typography-label-medium, 500 12px/16px system-ui)}.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:12px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface-variant);font-size:12px}.pill.subtle{background:transparent;color:var(--md-sys-color-on-surface-variant);padding-left:0}.available-fields{width:250px;border:1px solid var(--md-sys-color-outline-variant);border-radius:12px;padding:10px;background:var(--md-sys-color-surface)}.collapse-toggle{float:right}.available-fields__hint{display:block;margin-bottom:8px;color:var(--md-sys-color-on-surface-variant);font-size:12px}.no-fields-chip{position:absolute;top:8px;right:8px;padding:4px 8px;border:1px dashed var(--md-sys-color-outline);border-radius:16px;color:var(--md-sys-color-outline);font-size:12px;background:var(--md-sys-color-surface);pointer-events:none}.layout-canvas{flex-grow:1;overflow:visible;max-height:none;position:relative}.field-list{min-height:100px}.section-list{display:flex;flex-direction:column;gap:var(--pfx-section-gap, 20px)}.add-section-container{position:relative;padding-top:16px;margin-top:12px;border-top:1px solid var(--md-sys-color-outline-variant);min-height:28px}.fab-add-section{position:absolute;top:-30px;left:50%;transform:translate(-50%,calc(-50% - var(--pfx-divider-w, 1px)));z-index:2;--pfx-fab-size: var(--pfx-fab-size-section, 32px);--pfx-fab-icon: var(--pfx-fab-icon-section, 18px);width:var(--pfx-fab-size);height:var(--pfx-fab-size);border-radius:50%}.fab-add-section mat-icon{font-size:var(--pfx-fab-icon);width:var(--pfx-fab-icon);height:var(--pfx-fab-icon)}.fab-add-section.mat-mdc-fab{width:var(--pfx-fab-size);height:var(--pfx-fab-size);padding:0}.fab-add-section .mat-mdc-button-touch-target,.fab-add-section .mat-mdc-button-persistent-ripple,.fab-add-section .mat-mdc-button-ripple{width:var(--pfx-fab-size);height:var(--pfx-fab-size)}.cdk-drag-placeholder{opacity:.3;transition:opacity .2s ease}:host ::ng-deep .mdc-text-field--filled{--mdc-filled-text-field-container-color: var(--md-sys-color-surface-container)}:host ::ng-deep .mdc-text-field__input::placeholder{color:var(--md-sys-color-on-surface-variant)!important;opacity:.95}:host ::ng-deep .mat-mdc-form-field-subscript-wrapper,:host ::ng-deep .mat-mdc-hint{color:var(--md-sys-color-on-surface-variant)!important}:host ::ng-deep .mdc-text-field--disabled .mdc-text-field__input,:host ::ng-deep .mat-mdc-select-disabled .mat-mdc-select-value{color:var(--md-sys-color-on-surface-variant)!important}:host ::ng-deep .mat-button-toggle-checked{background:var(--md-sys-color-primary-container)!important;color:var(--md-sys-color-on-primary-container)!important}:host ::ng-deep .editor-toolbar .mat-button-toggle-appearance-standard{color:var(--md-sys-color-on-surface-variant)}:host ::ng-deep .editor-toolbar .mat-button-toggle-appearance-standard:hover{background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface)}:host ::ng-deep .editor-toolbar .mat-button-toggle-checked:hover{background:var(--md-sys-color-primary-container)!important;color:var(--md-sys-color-on-primary-container)!important}:host{--px-editor-section-gap: 16px;--pfx-grid-gap: 12px;--pfx-section-gap: var(--px-editor-section-gap)}@media(min-width:960px){:host{--px-editor-section-gap: 20px;--pfx-grid-gap: 16px}}@media(min-width:1280px){:host{--px-editor-section-gap: 24px;--pfx-grid-gap: 20px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$2.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i2$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "component", type: SectionConfiguratorComponent, selector: "praxis-section-configurator", inputs: ["section", "sectionIndex", "allSections", "fieldMetadata", "selected", "availableFieldsListId", "columnDropListIds", "gapGlobal"], outputs: ["sectionChange", "applyStyleToAll", "remove", "select", "fieldDrop"] }, { kind: "component", type: FieldConfiguratorComponent, selector: "praxis-field-configurator", inputs: ["field"] }, { 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: "component", type: i4.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i6$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i7$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i7$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
13357
13634
|
}
|
|
13358
13635
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: LayoutEditorComponent, decorators: [{
|
|
13359
13636
|
type: Component,
|
|
@@ -13527,7 +13804,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
13527
13804
|
</div>
|
|
13528
13805
|
</div>
|
|
13529
13806
|
</div>
|
|
13530
|
-
`, styles: [".layout-editor-wrapper{display:flex;flex-wrap:wrap;gap:16px}.layout-editor-wrapper.no-available-fields{gap:0}.editor-toolbar{position:sticky;top:0;z-index:3;display:flex;gap:16px;align-items:center;min-height:56px;background:var(--md-sys-color-surface-container);border-bottom:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level1, var(--md-sys-elevation-level1));padding:0 12px;margin:0 0 var(--px-editor-section-gap, 16px) 0}.editor-toolbar .title-block{display:flex;flex-direction:column;justify-content:center;gap:2px}.editor-toolbar .toolbar-title{font:var(--mdc-typography-title-small, 600 15px/20px system-ui);color:var(--md-sys-color-on-surface)}.editor-toolbar .toolbar-subtitle{font:var(--mdc-typography-body-small, 400 12px/16px system-ui);color:var(--md-sys-color-on-surface-variant)}.editor-toolbar .spacer{flex:1 1 auto}.editor-toolbar .toolbar-group{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.editor-toolbar .gap-group{align-items:center}.editor-toolbar .group-label{font:var(--mdc-typography-label-medium, 500 12px/16px system-ui);color:var(--md-sys-color-on-surface-variant)}.editor-toolbar .gap-group{align-items:center;gap:10px}.editor-toolbar .density-control{display:flex;align-items:center;gap:8px}.editor-toolbar .density-label{font:var(--mdc-typography-label-medium, 500 12px/16px system-ui);opacity:.9}.editor-toolbar .density-toggle .mat-button-toggle-button,.toggle-icons-group .mat-button-toggle-button{height:32px}.toggle-icons-group .mat-icon{font-size:20px;width:20px;height:20px;line-height:20px}.gap-chip{display:inline-flex;align-items:center;gap:2px;padding:0 4px;height:32px;border-radius:8px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-variant)}.gap-chip__btn{width:24px;height:24px;line-height:24px;min-width:0;padding:0;--mdc-icon-button-size: 24px;--mdc-icon-button-state-layer-size: 24px}.gap-chip .mat-mdc-button-touch-target{width:24px;height:24px}.gap-chip mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.gap-chip__input{width:42px;border:none;background:transparent;color:var(--md-sys-color-on-surface);font:var(--mdc-typography-body-medium, 600 13px/18px system-ui);text-align:center;outline:none;-moz-appearance:textfield}.gap-chip__input::-webkit-outer-spin-button,.gap-chip__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.gap-chip__suffix{color:var(--md-sys-color-on-surface-variant);font:var(--mdc-typography-label-medium, 500 12px/16px system-ui)}.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:12px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface-variant);font-size:12px}.pill.subtle{background:transparent;color:var(--md-sys-color-on-surface-variant);padding-left:0}.available-fields{width:250px;border:1px solid var(--md-sys-color-outline-variant);border-radius:12px;padding:10px;background:var(--md-sys-color-surface)}.collapse-toggle{float:right}.available-fields__hint{display:block;margin-bottom:8px;color:var(--md-sys-color-on-surface-variant);font-size:12px}.no-fields-chip{position:absolute;top:8px;right:8px;padding:4px 8px;border:1px dashed var(--md-sys-color-outline);border-radius:16px;color:var(--md-sys-color-outline);font-size:12px;background:var(--md-sys-color-surface);pointer-events:none}.layout-canvas{flex-grow:1;overflow:visible;max-height:none;position:relative}.field-list{min-height:100px}.section-list{display:flex;flex-direction:column;gap:var(--pfx-section-gap, 20px)}.add-section-container{position:relative;padding-top:16px;margin-top:12px;border-top:1px solid var(--md-sys-color-outline-variant);min-height:28px}.fab-add-section{position:absolute;top:-30px;left:50%;transform:translate(-50%,calc(-50% - var(--pfx-divider-w, 1px)));z-index:2;--pfx-fab-size: var(--pfx-fab-size-section, 32px);--pfx-fab-icon: var(--pfx-fab-icon-section, 18px);width:var(--pfx-fab-size);height:var(--pfx-fab-size);border-radius:50%}.fab-add-section mat-icon{font-size:var(--pfx-fab-icon);width:var(--pfx-fab-icon);height:var(--pfx-fab-icon)}.fab-add-section.mat-mdc-fab{width:var(--pfx-fab-size);height:var(--pfx-fab-size);padding:0}.fab-add-section .mat-mdc-button-touch-target,.fab-add-section .mat-mdc-button-persistent-ripple,.fab-add-section .mat-mdc-button-ripple{width:var(--pfx-fab-size);height:var(--pfx-fab-size)}.cdk-drag-placeholder{opacity:.3;transition:opacity .2s ease}:host ::ng-deep .mdc-text-field--filled{--mdc-filled-text-field-container-color: var(--md-sys-color-surface-container)}:host ::ng-deep .mdc-text-field__input::placeholder{color:var(--md-sys-color-on-surface-variant)!important;opacity:.95}:host ::ng-deep .mat-mdc-form-field-subscript-wrapper,:host ::ng-deep .mat-mdc-hint{color:var(--md-sys-color-on-surface-variant)!important}:host ::ng-deep .mdc-text-field--disabled .mdc-text-field__input,:host ::ng-deep .mat-mdc-select-disabled .mat-mdc-select-value{color:var(--md-sys-color-on-surface-variant)!important}:host ::ng-deep .mat-button-toggle-checked{background:var(--md-sys-color-primary-container)!important;color:var(--md-sys-color-on-primary-container)!important}:host{--px-editor-section-gap: 16px;--pfx-grid-gap: 12px;--pfx-section-gap: var(--px-editor-section-gap)}@media(min-width:960px){:host{--px-editor-section-gap: 20px;--pfx-grid-gap: 16px}}@media(min-width:1280px){:host{--px-editor-section-gap: 24px;--pfx-grid-gap: 20px}}\n"] }]
|
|
13807
|
+
`, styles: [".layout-editor-wrapper{display:flex;flex-wrap:wrap;gap:16px}.layout-editor-wrapper.no-available-fields{gap:0}.editor-toolbar{position:sticky;top:0;z-index:3;display:flex;gap:16px;align-items:center;min-height:56px;background:var(--md-sys-color-surface-container);border-bottom:1px solid var(--md-sys-color-outline-variant);box-shadow:var(--md-sys-elevation-level1, var(--md-sys-elevation-level1));padding:0 12px;margin:0 0 var(--px-editor-section-gap, 16px) 0}.editor-toolbar .title-block{display:flex;flex-direction:column;justify-content:center;gap:2px}.editor-toolbar .toolbar-title{font:var(--mdc-typography-title-small, 600 15px/20px system-ui);color:var(--md-sys-color-on-surface)}.editor-toolbar .toolbar-subtitle{font:var(--mdc-typography-body-small, 400 12px/16px system-ui);color:var(--md-sys-color-on-surface-variant)}.editor-toolbar .spacer{flex:1 1 auto}.editor-toolbar .toolbar-group{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.editor-toolbar .gap-group{align-items:center}.editor-toolbar .group-label{font:var(--mdc-typography-label-medium, 500 12px/16px system-ui);color:var(--md-sys-color-on-surface-variant)}.editor-toolbar .gap-group{align-items:center;gap:10px}.editor-toolbar .density-control{display:flex;align-items:center;gap:8px}.editor-toolbar .density-label{font:var(--mdc-typography-label-medium, 500 12px/16px system-ui);opacity:.9}.editor-toolbar .density-toggle,.editor-toolbar .toggle-icons-group{border:1px solid var(--md-sys-color-outline-variant);border-radius:999px;overflow:hidden;background:var(--md-sys-color-surface-container-low)}.editor-toolbar .density-toggle .mat-button-toggle,.editor-toolbar .toggle-icons-group .mat-button-toggle{background:var(--md-sys-color-surface-container-low);color:var(--md-sys-color-on-surface-variant)}.editor-toolbar .density-toggle .mat-button-toggle+.mat-button-toggle,.editor-toolbar .toggle-icons-group .mat-button-toggle+.mat-button-toggle{border-left:1px solid var(--md-sys-color-outline-variant)}.editor-toolbar .density-toggle .mat-button-toggle-button,.toggle-icons-group .mat-button-toggle-button{height:32px}.editor-toolbar .density-toggle .mat-icon,.toggle-icons-group .mat-icon{font-size:20px;width:20px;height:20px;line-height:20px}.editor-toolbar .density-toggle .mat-icon,.editor-toolbar .toggle-icons-group .mat-icon{color:inherit}.gap-chip{display:inline-flex;align-items:center;gap:2px;padding:0 4px;height:32px;border-radius:8px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-variant)}.gap-chip__btn{width:24px;height:24px;line-height:24px;min-width:0;padding:0;--mdc-icon-button-size: 24px;--mdc-icon-button-state-layer-size: 24px}.gap-chip .mat-mdc-button-touch-target{width:24px;height:24px}.gap-chip mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.gap-chip__input{width:42px;border:none;background:transparent;color:var(--md-sys-color-on-surface);font:var(--mdc-typography-body-medium, 600 13px/18px system-ui);text-align:center;outline:none;-moz-appearance:textfield}.gap-chip__input::-webkit-outer-spin-button,.gap-chip__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.gap-chip__suffix{color:var(--md-sys-color-on-surface-variant);font:var(--mdc-typography-label-medium, 500 12px/16px system-ui)}.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:12px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface-variant);font-size:12px}.pill.subtle{background:transparent;color:var(--md-sys-color-on-surface-variant);padding-left:0}.available-fields{width:250px;border:1px solid var(--md-sys-color-outline-variant);border-radius:12px;padding:10px;background:var(--md-sys-color-surface)}.collapse-toggle{float:right}.available-fields__hint{display:block;margin-bottom:8px;color:var(--md-sys-color-on-surface-variant);font-size:12px}.no-fields-chip{position:absolute;top:8px;right:8px;padding:4px 8px;border:1px dashed var(--md-sys-color-outline);border-radius:16px;color:var(--md-sys-color-outline);font-size:12px;background:var(--md-sys-color-surface);pointer-events:none}.layout-canvas{flex-grow:1;overflow:visible;max-height:none;position:relative}.field-list{min-height:100px}.section-list{display:flex;flex-direction:column;gap:var(--pfx-section-gap, 20px)}.add-section-container{position:relative;padding-top:16px;margin-top:12px;border-top:1px solid var(--md-sys-color-outline-variant);min-height:28px}.fab-add-section{position:absolute;top:-30px;left:50%;transform:translate(-50%,calc(-50% - var(--pfx-divider-w, 1px)));z-index:2;--pfx-fab-size: var(--pfx-fab-size-section, 32px);--pfx-fab-icon: var(--pfx-fab-icon-section, 18px);width:var(--pfx-fab-size);height:var(--pfx-fab-size);border-radius:50%}.fab-add-section mat-icon{font-size:var(--pfx-fab-icon);width:var(--pfx-fab-icon);height:var(--pfx-fab-icon)}.fab-add-section.mat-mdc-fab{width:var(--pfx-fab-size);height:var(--pfx-fab-size);padding:0}.fab-add-section .mat-mdc-button-touch-target,.fab-add-section .mat-mdc-button-persistent-ripple,.fab-add-section .mat-mdc-button-ripple{width:var(--pfx-fab-size);height:var(--pfx-fab-size)}.cdk-drag-placeholder{opacity:.3;transition:opacity .2s ease}:host ::ng-deep .mdc-text-field--filled{--mdc-filled-text-field-container-color: var(--md-sys-color-surface-container)}:host ::ng-deep .mdc-text-field__input::placeholder{color:var(--md-sys-color-on-surface-variant)!important;opacity:.95}:host ::ng-deep .mat-mdc-form-field-subscript-wrapper,:host ::ng-deep .mat-mdc-hint{color:var(--md-sys-color-on-surface-variant)!important}:host ::ng-deep .mdc-text-field--disabled .mdc-text-field__input,:host ::ng-deep .mat-mdc-select-disabled .mat-mdc-select-value{color:var(--md-sys-color-on-surface-variant)!important}:host ::ng-deep .mat-button-toggle-checked{background:var(--md-sys-color-primary-container)!important;color:var(--md-sys-color-on-primary-container)!important}:host ::ng-deep .editor-toolbar .mat-button-toggle-appearance-standard{color:var(--md-sys-color-on-surface-variant)}:host ::ng-deep .editor-toolbar .mat-button-toggle-appearance-standard:hover{background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface)}:host ::ng-deep .editor-toolbar .mat-button-toggle-checked:hover{background:var(--md-sys-color-primary-container)!important;color:var(--md-sys-color-on-primary-container)!important}:host{--px-editor-section-gap: 16px;--pfx-grid-gap: 12px;--pfx-section-gap: var(--px-editor-section-gap)}@media(min-width:960px){:host{--px-editor-section-gap: 20px;--pfx-grid-gap: 16px}}@media(min-width:1280px){:host{--px-editor-section-gap: 24px;--pfx-grid-gap: 20px}}\n"] }]
|
|
13531
13808
|
}], propDecorators: { config: [{
|
|
13532
13809
|
type: Input
|
|
13533
13810
|
}], configChange: [{
|
|
@@ -13690,7 +13967,7 @@ class BehaviorEditorComponent {
|
|
|
13690
13967
|
Resetar animação para padrão
|
|
13691
13968
|
</button>
|
|
13692
13969
|
</div>
|
|
13693
|
-
`, isInline: true, styles: [".behavior-editor-form{display:flex;flex-direction:column;gap:16px}.section-title{margin:6px 0 0;font-size:.95rem;font-weight:600}.behavior-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.warn-hint{color:var(--md-sys-color-error, #b42318)}@media(max-width:900px){.behavior-grid{grid-template-columns:1fr}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { 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: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6$
|
|
13970
|
+
`, isInline: true, styles: [".behavior-editor-form{display:flex;flex-direction:column;gap:16px}.section-title{margin:6px 0 0;font-size:.95rem;font-weight:600}.behavior-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.warn-hint{color:var(--md-sys-color-error, #b42318)}@media(max-width:900px){.behavior-grid{grid-template-columns:1fr}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7$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: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i11.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }] });
|
|
13694
13971
|
}
|
|
13695
13972
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: BehaviorEditorComponent, decorators: [{
|
|
13696
13973
|
type: Component,
|
|
@@ -13819,19 +14096,19 @@ const ACTIONS_EDITOR_I18N_CONFIG = {
|
|
|
13819
14096
|
namespaces: {
|
|
13820
14097
|
[ACTIONS_EDITOR_I18N_NAMESPACE]: {
|
|
13821
14098
|
'pt-BR': {
|
|
13822
|
-
'global.title': '
|
|
14099
|
+
'global.title': 'Configuração da ação global',
|
|
13823
14100
|
'global.section.essential': 'Essencial',
|
|
13824
|
-
'global.section.dialogOptional': '
|
|
13825
|
-
'global.validation.validJson': 'Informe um JSON
|
|
13826
|
-
'tabs.defaultButtons': '
|
|
13827
|
-
'tabs.customButtons': '
|
|
14101
|
+
'global.section.dialogOptional': 'Diálogo (opcional)',
|
|
14102
|
+
'global.validation.validJson': 'Informe um JSON válido.',
|
|
14103
|
+
'tabs.defaultButtons': 'Botões padrão',
|
|
14104
|
+
'tabs.customButtons': 'Botões customizados',
|
|
13828
14105
|
'tabs.layout': 'Layout',
|
|
13829
|
-
'default.submit.title': '
|
|
13830
|
-
'default.cancel.title': '
|
|
13831
|
-
'default.reset.title': '
|
|
13832
|
-
'field.visible': '
|
|
13833
|
-
'field.label': 'Label',
|
|
13834
|
-
'field.icon': '
|
|
14106
|
+
'default.submit.title': 'Botão de submeter (submit)',
|
|
14107
|
+
'default.cancel.title': 'Botão de cancelar (cancel)',
|
|
14108
|
+
'default.reset.title': 'Botão de limpar (reset)',
|
|
14109
|
+
'field.visible': 'Visível',
|
|
14110
|
+
'field.label': 'Rótulo (Label)',
|
|
14111
|
+
'field.icon': 'Ícone',
|
|
13835
14112
|
'field.variant': 'Variante',
|
|
13836
14113
|
'field.color': 'Cor',
|
|
13837
14114
|
'field.shortcut': 'Atalho de teclado',
|
|
@@ -13842,59 +14119,59 @@ const ACTIONS_EDITOR_I18N_CONFIG = {
|
|
|
13842
14119
|
'variant.stroked': 'Contornado (stroked)',
|
|
13843
14120
|
'variant.flat': 'Plano (flat)',
|
|
13844
14121
|
'variant.fab': 'Flutuante (fab)',
|
|
13845
|
-
'custom.addButton': 'Adicionar
|
|
13846
|
-
'custom.defaultTitle': 'Novo
|
|
13847
|
-
'custom.id': 'ID da
|
|
13848
|
-
'custom.action': '
|
|
13849
|
-
'custom.globalGroup': '
|
|
14122
|
+
'custom.addButton': 'Adicionar botão',
|
|
14123
|
+
'custom.defaultTitle': 'Novo botão customizado',
|
|
14124
|
+
'custom.id': 'ID da ação',
|
|
14125
|
+
'custom.action': 'Ação',
|
|
14126
|
+
'custom.globalGroup': 'Ações globais',
|
|
13850
14127
|
'custom.action.custom': 'Customizada',
|
|
13851
|
-
'custom.action.help': '
|
|
14128
|
+
'custom.action.help': 'Ações globais exigem executor no app (ActionResolver). Customizadas só emitem evento. Cor e posição afetam o botão.',
|
|
13852
14129
|
'custom.action.customPlaceholder': 'Ex.: custom_action, navigate, delete',
|
|
13853
|
-
'custom.parameter': '
|
|
13854
|
-
'custom.parameterRequired': '
|
|
13855
|
-
'custom.buttonColor': 'Cor do
|
|
13856
|
-
'custom.remove': 'Remover este
|
|
13857
|
-
'layout.placement': '
|
|
13858
|
-
'layout.placement.insideLastSection': 'Dentro da
|
|
13859
|
-
'layout.placement.afterSections': '
|
|
13860
|
-
'layout.placement.top': 'Antes das
|
|
13861
|
-
'layout.gapTop': '
|
|
13862
|
-
'layout.gapTop.placeholder': '(
|
|
13863
|
-
'layout.alignment': 'Alinhamento dos
|
|
14130
|
+
'custom.parameter': 'Parâmetro',
|
|
14131
|
+
'custom.parameterRequired': 'Parâmetro obrigatório.',
|
|
14132
|
+
'custom.buttonColor': 'Cor do botão',
|
|
14133
|
+
'custom.remove': 'Remover este botão',
|
|
14134
|
+
'layout.placement': 'Posição estrutural',
|
|
14135
|
+
'layout.placement.insideLastSection': 'Dentro da última seção',
|
|
14136
|
+
'layout.placement.afterSections': 'Após as seções',
|
|
14137
|
+
'layout.placement.top': 'Antes das seções',
|
|
14138
|
+
'layout.gapTop': 'Espaço acima (px)',
|
|
14139
|
+
'layout.gapTop.placeholder': '(padrão)',
|
|
14140
|
+
'layout.alignment': 'Alinhamento dos botões',
|
|
13864
14141
|
'layout.alignment.left': 'Esquerda',
|
|
13865
14142
|
'layout.alignment.center': 'Centro',
|
|
13866
14143
|
'layout.alignment.right': 'Direita',
|
|
13867
14144
|
'layout.alignment.justified': 'Justificado',
|
|
13868
14145
|
'layout.alignment.split': 'Separado',
|
|
13869
|
-
'layout.orientation': '
|
|
14146
|
+
'layout.orientation': 'Orientação',
|
|
13870
14147
|
'layout.orientation.horizontal': 'Horizontal',
|
|
13871
14148
|
'layout.orientation.vertical': 'Vertical',
|
|
13872
|
-
'layout.spacing': '
|
|
14149
|
+
'layout.spacing': 'Espaçamento',
|
|
13873
14150
|
'layout.spacing.compact': 'Compacto',
|
|
13874
14151
|
'layout.spacing.normal': 'Normal',
|
|
13875
|
-
'layout.spacing.spacious': '
|
|
14152
|
+
'layout.spacing.spacious': 'Espaçado',
|
|
13876
14153
|
'layout.divider': 'Exibir divisor superior',
|
|
13877
14154
|
'layout.containerClassName': 'Classe do container',
|
|
13878
14155
|
'layout.containerStyles': 'Estilos do container (JSON)',
|
|
13879
|
-
'layout.sticky': 'Barra de
|
|
13880
|
-
'layout.mobile.title': '
|
|
14156
|
+
'layout.sticky': 'Barra de ações fixa (sticky)',
|
|
14157
|
+
'layout.mobile.title': 'Configurações mobile',
|
|
13881
14158
|
'layout.mobile.collapse': 'Colapsar em menu no mobile',
|
|
13882
14159
|
'layout.mobile.alignment': 'Alinhamento (mobile)',
|
|
13883
|
-
'layout.mobile.orientation': '
|
|
13884
|
-
'layout.mobile.default': '
|
|
14160
|
+
'layout.mobile.orientation': 'Orientação (mobile)',
|
|
14161
|
+
'layout.mobile.default': 'Padrão',
|
|
13885
14162
|
'globalAction.payload.label': 'Payload (JSON opcional)',
|
|
13886
|
-
'globalAction.payload.hint': 'Use JSON quando a
|
|
14163
|
+
'globalAction.payload.hint': 'Use JSON quando a ação global do app exigir payload estruturado.',
|
|
13887
14164
|
'custom.variant': 'Variante',
|
|
13888
14165
|
'custom.size': 'Tamanho',
|
|
13889
14166
|
'custom.size.small': 'Pequeno',
|
|
13890
14167
|
'custom.size.medium': 'Médio',
|
|
13891
14168
|
'custom.size.large': 'Grande',
|
|
13892
|
-
'custom.tooltip': 'Tooltip',
|
|
13893
|
-
'custom.shortcut': 'Atalho de
|
|
14169
|
+
'custom.tooltip': 'Dica (Tooltip)',
|
|
14170
|
+
'custom.shortcut': 'Atalho de teclado',
|
|
13894
14171
|
'custom.shortcut.placeholder': 'Ex.: ctrl+shift+a',
|
|
13895
14172
|
'custom.className': 'Classe CSS',
|
|
13896
14173
|
'custom.disabled': 'Desabilitado',
|
|
13897
|
-
'custom.loading': 'Loading',
|
|
14174
|
+
'custom.loading': 'Carregando (Loading)',
|
|
13898
14175
|
'custom.style': 'Estilos do botão (JSON)',
|
|
13899
14176
|
'custom.style.placeholder': '{"borderRadius":"999px"}',
|
|
13900
14177
|
'custom.order.moveUp': 'Mover "{{label}}" para cima',
|
|
@@ -15770,7 +16047,7 @@ let ActionsEditorComponent$1 = class ActionsEditorComponent {
|
|
|
15770
16047
|
</div>
|
|
15771
16048
|
</mat-tab>
|
|
15772
16049
|
</mat-tab-group>
|
|
15773
|
-
`, isInline: true, styles: [".editor-container{padding:16px;display:flex;flex-direction:column;gap:16px}.action-fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;align-items:center}.action-global-fields{grid-column:1 / -1;padding:12px 14px;border:1px dashed var(--md-sys-color-outline-variant, rgba(255, 255, 255, .12));border-radius:10px;background:var(--md-sys-color-surface-container-low)}.action-global-title{font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant, #9aa0a6);margin-bottom:10px}.action-global-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px 16px}.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;vertical-align:middle}.help-icon-button mat-icon{font-size:18px;line-height:18px;width:18px;height:18px}.action-global-fields .mat-mdc-form-field-icon-suffix{align-self:center}.action-section-title{width:100%;margin:10px 0 2px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant, #9aa0a6)}.add-button{margin-bottom:16px;align-self:flex-start}.custom-action-panel-shell{display:grid;gap:8px}.custom-action-panel-toolbar{display:flex;justify-content:flex-end}.custom-action-order-controls{display:inline-flex;align-items:center;gap:4px;justify-content:flex-end}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6$
|
|
16050
|
+
`, isInline: true, styles: [".editor-container{padding:16px;display:flex;flex-direction:column;gap:16px}.action-fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;align-items:center}.action-global-fields{grid-column:1 / -1;padding:12px 14px;border:1px dashed var(--md-sys-color-outline-variant, rgba(255, 255, 255, .12));border-radius:10px;background:var(--md-sys-color-surface-container-low)}.action-global-title{font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant, #9aa0a6);margin-bottom:10px}.action-global-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px 16px}.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;vertical-align:middle}.help-icon-button mat-icon{font-size:18px;line-height:18px;width:18px;height:18px}.action-global-fields .mat-mdc-form-field-icon-suffix{align-self:center}.action-section-title{width:100%;margin:10px 0 2px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant, #9aa0a6)}.add-button{margin-bottom:16px;align-self:flex-start}.custom-action-panel-shell{display:grid;gap:8px}.custom-action-panel-toolbar{display:flex;justify-content:flex-end}.custom-action-order-controls{display:inline-flex;align-items:center;gap:4px;justify-content:flex-end}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7$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: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i6$3.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: i6$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i6$3.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i7$3.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i7$3.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i3.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i3.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i3.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.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: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: SurfaceOpenActionEditorComponent, selector: "praxis-surface-open-action-editor", inputs: ["value", "hostKind"], outputs: ["valueChange"] }] });
|
|
15774
16051
|
};
|
|
15775
16052
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: ActionsEditorComponent$1, decorators: [{
|
|
15776
16053
|
type: Component,
|
|
@@ -16872,7 +17149,7 @@ class MessagesEditorComponent {
|
|
|
16872
17149
|
</mat-expansion-panel>
|
|
16873
17150
|
</mat-accordion>
|
|
16874
17151
|
</div>
|
|
16875
|
-
`, isInline: true, styles: [".messages-editor-container{display:flex;flex-direction:column;gap:16px}.messages-editor-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}.custom-action-messages{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--md-sys-color-outline-variant)}.custom-action-messages h5{display:flex;align-items:center;gap:8px;margin-bottom:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { 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: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i3.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i3.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i3.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
17152
|
+
`, isInline: true, styles: [".messages-editor-container{display:flex;flex-direction:column;gap:16px}.messages-editor-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}.custom-action-messages{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--md-sys-color-outline-variant)}.custom-action-messages h5{display:flex;align-items:center;gap:8px;margin-bottom:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7$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: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i3.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i3.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i3.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
16876
17153
|
}
|
|
16877
17154
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: MessagesEditorComponent, decorators: [{
|
|
16878
17155
|
type: Component,
|
|
@@ -17275,7 +17552,7 @@ class HooksEditorComponent {
|
|
|
17275
17552
|
</mat-expansion-panel>
|
|
17276
17553
|
</mat-accordion>
|
|
17277
17554
|
</div>
|
|
17278
|
-
`, isInline: true, styles: [".hooks-editor{display:block}.hook-item{padding:8px;border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;margin-bottom:12px}.row{display:flex;gap:12px;align-items:center}.grow{flex:1}.w120{width:120px}.w140{width:140px}.w220{width:220px}.args-field{width:100%}.panel-actions{display:flex;gap:12px;margin-top:8px}.quick-add{display:flex;align-items:center;gap:8px;margin:8px 0;flex-wrap:wrap}.empty{opacity:.7;font-style:italic;padding:8px 0}.move-row{margin-top:8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i3.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i3.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i3.MatExpansionPanelDescription, selector: "mat-panel-description" }, { 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: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { 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: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6$
|
|
17555
|
+
`, isInline: true, styles: [".hooks-editor{display:block}.hook-item{padding:8px;border:1px solid var(--md-sys-color-outline-variant);border-radius:8px;margin-bottom:12px}.row{display:flex;gap:12px;align-items:center}.grow{flex:1}.w120{width:120px}.w140{width:140px}.w220{width:220px}.args-field{width:100%}.panel-actions{display:flex;gap:12px;margin-top:8px}.quick-add{display:flex;align-items:center;gap:8px;margin:8px 0;flex-wrap:wrap}.empty{opacity:.7;font-style:italic;padding:8px 0}.move-row{margin-top:8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i3.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i3.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i3.MatExpansionPanelDescription, selector: "mat-panel-description" }, { 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: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7$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: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i6$3.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: i6$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
17279
17556
|
}
|
|
17280
17557
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: HooksEditorComponent, decorators: [{
|
|
17281
17558
|
type: Component,
|
|
@@ -17774,6 +18051,8 @@ class PraxisDynamicFormConfigEditor {
|
|
|
17774
18051
|
initialConfig;
|
|
17775
18052
|
initialDocument;
|
|
17776
18053
|
openedWithCanonicalDocument;
|
|
18054
|
+
runtimeContext;
|
|
18055
|
+
runtimeContract;
|
|
17777
18056
|
backConfig;
|
|
17778
18057
|
includeBackConfigBlock = false;
|
|
17779
18058
|
formId;
|
|
@@ -17849,6 +18128,8 @@ class PraxisDynamicFormConfigEditor {
|
|
|
17849
18128
|
data?.kind === 'praxis.dynamic-form.editor';
|
|
17850
18129
|
const initialDocument = parseLegacyOrDynamicFormDocument(data?.document ?? injectedData);
|
|
17851
18130
|
this.initialDocument = initialDocument;
|
|
18131
|
+
this.runtimeContext = data?.runtimeContext;
|
|
18132
|
+
this.runtimeContract = this.normalizeResolvedRuntimeContract(this.runtimeContext?.resolvedContract);
|
|
17852
18133
|
const formCfg = initialDocument.config;
|
|
17853
18134
|
this.backConfig = initialDocument.contextSnapshot?.backConfig;
|
|
17854
18135
|
this.includeBackConfigBlock = Object.prototype.hasOwnProperty.call(initialDocument.contextSnapshot || {}, 'backConfig');
|
|
@@ -18093,6 +18374,19 @@ class PraxisDynamicFormConfigEditor {
|
|
|
18093
18374
|
isBackConfigBlockPersisted() {
|
|
18094
18375
|
return this.includeBackConfigBlock;
|
|
18095
18376
|
}
|
|
18377
|
+
hasResolvedRuntimeContract() {
|
|
18378
|
+
return !!this.runtimeContract;
|
|
18379
|
+
}
|
|
18380
|
+
describeRuntimeSource(source) {
|
|
18381
|
+
switch (source) {
|
|
18382
|
+
case 'runtime-input':
|
|
18383
|
+
return 'runtime input';
|
|
18384
|
+
case 'legacy-crud':
|
|
18385
|
+
return 'legacy CRUD fallback';
|
|
18386
|
+
default:
|
|
18387
|
+
return '—';
|
|
18388
|
+
}
|
|
18389
|
+
}
|
|
18096
18390
|
onInputModeChange() {
|
|
18097
18391
|
this.includeBindingsBlock = true;
|
|
18098
18392
|
this.updateDirtyState('input-mode-change');
|
|
@@ -18432,6 +18726,28 @@ class PraxisDynamicFormConfigEditor {
|
|
|
18432
18726
|
contextSnapshot,
|
|
18433
18727
|
});
|
|
18434
18728
|
}
|
|
18729
|
+
normalizeResolvedRuntimeContract(contract) {
|
|
18730
|
+
if (!contract) {
|
|
18731
|
+
return undefined;
|
|
18732
|
+
}
|
|
18733
|
+
const schemaUrl = String(contract.schemaUrl || '').trim();
|
|
18734
|
+
const submitUrl = String(contract.submitUrl || '').trim();
|
|
18735
|
+
const submitMethod = contract.submitMethod === 'post' ||
|
|
18736
|
+
contract.submitMethod === 'put' ||
|
|
18737
|
+
contract.submitMethod === 'patch'
|
|
18738
|
+
? contract.submitMethod
|
|
18739
|
+
: undefined;
|
|
18740
|
+
if (!schemaUrl && !submitUrl && !submitMethod) {
|
|
18741
|
+
return undefined;
|
|
18742
|
+
}
|
|
18743
|
+
return {
|
|
18744
|
+
schemaUrl: schemaUrl || undefined,
|
|
18745
|
+
schemaSource: contract.schemaSource,
|
|
18746
|
+
submitUrl: submitUrl || undefined,
|
|
18747
|
+
submitMethod,
|
|
18748
|
+
submitSource: contract.submitSource,
|
|
18749
|
+
};
|
|
18750
|
+
}
|
|
18435
18751
|
createBackConfigState(snapshot) {
|
|
18436
18752
|
return (structuredClone(snapshot) ||
|
|
18437
18753
|
{ returnTo: '', confirmOnDirty: true });
|
|
@@ -18477,8 +18793,8 @@ class PraxisDynamicFormConfigEditor {
|
|
|
18477
18793
|
toBackConfigSnapshot() {
|
|
18478
18794
|
return structuredClone(this.backConfig || { returnTo: '', confirmOnDirty: true });
|
|
18479
18795
|
}
|
|
18480
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: PraxisDynamicFormConfigEditor, deps: [{ token: ASYNC_CONFIG_STORAGE }, { token: FormConfigService }, { token:
|
|
18481
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: PraxisDynamicFormConfigEditor, isStandalone: true, selector: "praxis-dynamic-form-config-editor", providers: [FormConfigService], viewQueries: [{ propertyName: "jsonEditor", first: true, predicate: JsonConfigEditorComponent, descendants: true }], ngImport: i0, template: "<mat-tab-group class=\"config-tabs\" data-testid=\"dynamic-form-config-editor-tabs\">\n <mat-tab label=\"Geral\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-geral\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Dados do formul\u00E1rio</h3>\n <p class=\"text-caption\">Defina o modo de dados e o contexto de edi\u00E7\u00E3o.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Modo de dados</mat-label>\n <mat-select [(ngModel)]=\"inputMode\" (ngModelChange)=\"onInputModeChange()\">\n <mat-option value=\"create\">create</mat-option>\n <mat-option value=\"edit\">edit</mat-option>\n <mat-option value=\"view\">view</mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isBindingsBlockPersisted()\">\n <strong>Bindings</strong>\n <span *ngIf=\"isBindingsBlockPersisted(); else bindingsMissing\">`bindings.mode` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #bindingsMissing>Bloco ausente no documento can\u00F4nico. O valor exibido \u00E9 fallback visual e n\u00E3o ser\u00E1 salvo at\u00E9 voc\u00EA editar este campo.</ng-template>\n </div>\n <div class=\"section-help\">\n <span class=\"section-help__label\">Entenda:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'O mode controla o fluxo (create/edit/view). enableCustomization s\u00F3 libera edi\u00E7\u00E3o do layout e n\u00E3o altera o mode.'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Verifica\u00E7\u00E3o de Schema\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-schema\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Valida\u00E7\u00E3o de schema</h3>\n <p class=\"text-caption\">Controle avisos quando o schema do servidor mudar.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Notificar quando desatualizado</mat-label>\n <mat-select [(ngModel)]=\"schemaPrefs.notifyIfOutdated\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-notify')\">\n <mat-option value=\"both\">Banner + Snackbar</mat-option>\n <mat-option value=\"inline\">Somente Banner</mat-option>\n <mat-option value=\"snackbar\">Somente Snackbar</mat-option>\n <mat-option value=\"none\">Nenhum</mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Intervalo de sil\u00EAncio (ms)</mat-label>\n <input matInput type=\"number\" [(ngModel)]=\"schemaPrefs.snoozeMs\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-snooze')\" />\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-slide-toggle [(ngModel)]=\"schemaPrefs.autoOpenSettingsOnOutdated\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-auto-open')\">Abrir configura\u00E7\u00F5es\n automaticamente</mat-slide-toggle>\n </div>\n <div class=\"form-row\" *ngIf=\"serverMeta\">\n <div class=\"meta-card\">\n <div class=\"meta-row\">\n <span>Server hash</span>\n <strong>{{ serverMeta.serverHash || '\u2014' }}</strong>\n </div>\n <div class=\"meta-row\">\n <span>\u00DAltima verifica\u00E7\u00E3o</span>\n <strong>{{ serverMeta.lastVerifiedAt || '\u2014' }}</strong>\n </div>\n </div>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isSchemaPrefsBlockPersisted()\">\n <strong>Schema Prefs</strong>\n <span *ngIf=\"isSchemaPrefsBlockPersisted(); else schemaPrefsMissing\">`contextSnapshot.schemaPrefs` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #schemaPrefsMissing>Bloco ausente no documento can\u00F4nico. Os controles exibem fallback visual e n\u00E3o ser\u00E3o salvos at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Layout\">\n <div class=\"tab-content tab-content--full\" data-testid=\"config-tab-panel-layout\">\n <div class=\"section-header section-header--compact\">\n <div>\n <h3>Layout do formul\u00E1rio</h3>\n <p class=\"text-caption\">Organize se\u00E7\u00F5es, linhas e campos com drag & drop.</p>\n </div>\n </div>\n <div class=\"section-body section-body--flex\">\n <praxis-layout-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"\n (select)=\"onLayoutSelect($event)\"></praxis-layout-editor>\n </div>\n </div>\n </mat-tab>\n <mat-tab label=\"Hooks\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-hooks\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Hooks de ciclo de vida</h3>\n <p class=\"text-caption\">Automatize a\u00E7\u00F5es nos eventos do formul\u00E1rio.</p>\n </div>\n </div>\n <praxis-hooks-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-hooks-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab *ngIf=\"isPresentationMode\" label=\"Modo Apresenta\u00E7\u00E3o\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-presentation\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Modo Apresenta\u00E7\u00E3o</h3>\n <p class=\"text-caption\">Configura\u00E7\u00F5es de exibi\u00E7\u00E3o aplicadas somente ao modo apresenta\u00E7\u00E3o.</p>\n </div>\n </div>\n\n <div class=\"presentation-layout\">\n <div class=\"presentation-controls\">\n <div class=\"block-status control-span\" [class.block-status--implicit]=\"!isPresentationBlockPersisted()\">\n <strong>Presentation</strong>\n <span *ngIf=\"isPresentationBlockPersisted(); else presentationMissing\">`contextSnapshot.presentation` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #presentationMissing>Bloco ausente no documento can\u00F4nico. A pr\u00E9-visualiza\u00E7\u00E3o usa fallback local e n\u00E3o ser\u00E1 salva at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n <div class=\"control\">\n <label class=\"control__label\">Posi\u00E7\u00E3o do r\u00F3tulo</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.labelPosition\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-position')\" aria-label=\"Posi\u00E7\u00E3o do r\u00F3tulo\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"above\">\n <mat-icon>view_stream</mat-icon>\n <span class=\"sr-only\">Acima</span>\n </mat-button-toggle>\n <mat-button-toggle value=\"left\">\n <mat-icon>view_column</mat-icon>\n <span class=\"sr-only\">\u00C0 esquerda</span>\n </mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Densidade</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.density\" (ngModelChange)=\"onPresentationPrefsChange('presentation-density')\" aria-label=\"Densidade\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"comfortable\">Confort\u00E1vel</mat-button-toggle>\n <mat-button-toggle value=\"cozy\">Intermedi\u00E1ria</mat-button-toggle>\n <mat-button-toggle value=\"compact\">Compacta</mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Alinhamento do r\u00F3tulo</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.labelAlign\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-align')\" aria-label=\"Alinhamento do r\u00F3tulo\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"start\"><mat-icon>format_align_left</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"center\"><mat-icon>format_align_center</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"end\"><mat-icon>format_align_right</mat-icon></mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Alinhamento do valor</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.valueAlign\" (ngModelChange)=\"onPresentationPrefsChange('presentation-value-align')\" aria-label=\"Alinhamento do valor\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"start\"><mat-icon>format_align_left</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"center\"><mat-icon>format_align_center</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"end\"><mat-icon>format_align_right</mat-icon></mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Tamanho do r\u00F3tulo</mat-label>\n <input matInput type=\"number\" min=\"10\" [(ngModel)]=\"presentationPrefs.labelFontSize\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-font-size')\"\n placeholder=\"ex.: 12\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Tamanho do valor</mat-label>\n <input matInput type=\"number\" min=\"10\" [(ngModel)]=\"presentationPrefs.valueFontSize\" (ngModelChange)=\"onPresentationPrefsChange('presentation-value-font-size')\"\n placeholder=\"ex.: 16\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Largura do r\u00F3tulo (label \u00E0 esquerda)</mat-label>\n <input matInput type=\"number\" min=\"60\" [(ngModel)]=\"presentationPrefs.labelWidth\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-width')\"\n placeholder=\"ex.: 140\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control control--inline\">\n <mat-slide-toggle [(ngModel)]=\"presentationPrefs.compact\" (ngModelChange)=\"onPresentationPrefsChange('presentation-compact')\">\n Modo compacto\n </mat-slide-toggle>\n <mat-checkbox [(ngModel)]=\"truncatePreview\">\n Truncar valores\n </mat-checkbox>\n </div>\n </div>\n\n <div class=\"presentation-preview\">\n <h4>Pr\u00E9\u2011visualiza\u00E7\u00E3o</h4>\n <div class=\"preview-card\">\n <div class=\"praxis-dynamic-form presentation-mode\" [ngClass]=\"{\n 'pres-compact': !!presentationPrefs.compact,\n 'pres-label-left': presentationPrefs.labelPosition === 'left',\n 'pres-label-above': presentationPrefs.labelPosition === 'above',\n 'pres-density-compact': presentationPrefs.density === 'compact',\n 'pres-density-cozy': presentationPrefs.density === 'cozy'\n }\" [style.--pfx-pres-label-size]=\"(presentationPrefs.labelFontSize || 12) + 'px'\"\n [style.--pfx-pres-value-size]=\"(presentationPrefs.valueFontSize || 16) + 'px'\"\n [style.--pfx-pres-label-width]=\"(presentationPrefs.labelWidth || 140) + 'px'\"\n [style.--pfx-pres-label-align]=\"presentationPrefs.labelAlign || 'start'\"\n [style.--pfx-pres-value-align]=\"presentationPrefs.valueAlign || 'start'\">\n <div class=\"preview-row\" *ngFor=\"let item of previewItems\">\n <span class=\"praxis-presentation__label\">{{ item.label }}</span>\n <span class=\"praxis-presentation__value\" [title]=\"truncatePreview ? item.value : null\"\n [style.maxWidth]=\"truncatePreview ? '280px' : null\"\n [style.overflow]=\"truncatePreview ? 'hidden' : null\"\n [style.textOverflow]=\"truncatePreview ? 'ellipsis' : null\"\n [style.whiteSpace]=\"truncatePreview ? 'nowrap' : 'normal'\">\n {{ item.value }}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"section-help\">\n <span class=\"section-help__label\">Entenda:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'Ajustes aplicam somente ao Modo Apresenta\u00E7\u00E3o e s\u00E3o salvos por formul\u00E1rio (via CSS/Classes).'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Comportamento\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-comportamento\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Comportamento</h3>\n <p class=\"text-caption\">Ajuste valida\u00E7\u00F5es e respostas do formul\u00E1rio.</p>\n </div>\n </div>\n <praxis-behavior-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-behavior-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Dicas e Tooltips\">\n <div class=\"tab-content tab-content--dense\" data-testid=\"config-tab-panel-hints\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Dicas dos modos</h3>\n <p class=\"text-caption\">Personalize textos de apoio para modos de dados e estados de UI.</p>\n </div>\n </div>\n <p class=\"text-caption\">Personalize os textos usados como tooltip/hint para modos de dados e modos globais de\n UI.</p>\n\n <div class=\"grid-2-cols grid-2-cols--compact\">\n <section>\n <h4>Modos de dados</h4>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Criar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.create\"\n (ngModelChange)=\"updateDirtyState('hints-data-create')\" placeholder=\"Ex.: Preencha os campos obrigat\u00F3rios.\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Editar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.edit\"\n (ngModelChange)=\"updateDirtyState('hints-data-edit')\" placeholder=\"Ex.: Revise os dados antes de salvar.\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Visualizar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.view\"\n (ngModelChange)=\"updateDirtyState('hints-data-view')\" placeholder=\"Ex.: Visualiza\u00E7\u00E3o somente leitura.\" />\n </mat-form-field>\n </section>\n\n <section>\n <h4>Modos de UI</h4>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Apresenta\u00E7\u00E3o</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.presentation\"\n (ngModelChange)=\"updateDirtyState('hints-ui-presentation')\" placeholder=\"Ex.: Modo compacto para leitura r\u00E1pida.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Leitura (readonly)</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.readonly\"\n (ngModelChange)=\"updateDirtyState('hints-ui-readonly')\" placeholder=\"Ex.: Campos bloqueados para edi\u00E7\u00E3o.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Desabilitado</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.disabled\"\n (ngModelChange)=\"updateDirtyState('hints-ui-disabled')\" placeholder=\"Ex.: Fun\u00E7\u00E3o indispon\u00EDvel no momento.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Vis\u00EDvel</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.visible\"\n (ngModelChange)=\"updateDirtyState('hints-ui-visible')\" placeholder=\"Ex.: Campo exibido conforme permiss\u00F5es.\"></textarea>\n </mat-form-field>\n </section>\n </div>\n\n <div class=\"actions-row\">\n <button mat-stroked-button color=\"primary\" type=\"button\" (click)=\"restoreHintsDefaults()\">\n <mat-icon>restore</mat-icon>\n Restaurar padr\u00F5es\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"A\u00E7\u00F5es\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-acoes\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>A\u00E7\u00F5es do formul\u00E1rio</h3>\n <p class=\"text-caption\">Configure bot\u00F5es padr\u00E3o e a\u00E7\u00F5es customizadas.</p>\n </div>\n </div>\n <praxis-actions-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-actions-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Regras\">\n <div class=\"tab-content visual-builder-content\" data-testid=\"config-tab-panel-regras\">\n <div class=\"builder-header\">\n <div>\n <h3>Regras visuais</h3>\n <p class=\"text-caption\">Defina visibilidade, estilos e rea\u00E7\u00F5es baseadas em condi\u00E7\u00F5es.</p>\n </div>\n </div>\n <praxis-visual-builder [config]=\"ruleBuilderConfig\" [initialRules]=\"ruleBuilderState\"\n (rulesChanged)=\"onRulesChanged($event)\"></praxis-visual-builder>\n </div>\n </mat-tab>\n <mat-tab label=\"Cascatas\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-cascatas\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Depend\u00EAncias entre campos</h3>\n <p class=\"text-caption\">Configure cascatas e carregamento entre campos.</p>\n </div>\n </div>\n <praxis-cascade-manager-tab [fields]=\"editedConfig.fieldMetadata || []\"\n (apply)=\"onCascadeApply($event)\"></praxis-cascade-manager-tab>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Mensagens\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-mensagens\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Mensagens e feedback</h3>\n <p class=\"text-caption\">Padronize textos de sucesso, erro e confirma\u00E7\u00F5es.</p>\n </div>\n </div>\n <praxis-messages-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-messages-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Navega\u00E7\u00E3o\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-navegacao\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Navega\u00E7\u00E3o de retorno</h3>\n <p class=\"text-caption\">Defina o comportamento do bot\u00E3o Voltar em fluxos CRUD.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Rota de retorno</mat-label>\n <input matInput id=\"returnTo\" [(ngModel)]=\"backConfig!.returnTo\" (ngModelChange)=\"onBackConfigChange()\" placeholder=\"/funcionarios\" />\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-slide-toggle [(ngModel)]=\"backConfig!.confirmOnDirty\" (ngModelChange)=\"onBackConfigChange()\">\n Confirmar ao sair com altera\u00E7\u00F5es\n </mat-slide-toggle>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isBackConfigBlockPersisted()\">\n <strong>Back Config</strong>\n <span *ngIf=\"isBackConfigBlockPersisted(); else backConfigMissing\">`contextSnapshot.backConfig` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #backConfigMissing>Bloco ausente no documento can\u00F4nico. Os valores exibidos s\u00E3o fallback visual e n\u00E3o ser\u00E3o salvos at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n </div>\n <div class=\"section-help\">\n <span class=\"section-help__label\">Observa\u00E7\u00E3o:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'Afeta o fluxo de navega\u00E7\u00E3o do CRUD e pode ser sobreposto por metadados do recurso.'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"JSON\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-json\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Configura\u00E7\u00E3o JSON</h3>\n <p class=\"text-caption\">Edi\u00E7\u00E3o avan\u00E7ada do documento can\u00F4nico de autoria do formul\u00E1rio.</p>\n </div>\n </div>\n <form-json-config-editor [document]=\"jsonDocument\" (documentChange)=\"onJsonConfigChange($event)\"\n (validationChange)=\"onJsonValidationChange($event)\" (editorEvent)=\"onJsonEditorEvent($event)\">\n </form-json-config-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{display:block;height:100%}.config-tabs{height:100%}::ng-deep .mat-mdc-tab-group.config-tabs{display:flex;flex-direction:column}::ng-deep .mat-mdc-tab-group.config-tabs .mat-mdc-tab-body-wrapper{flex:1;min-height:0}::ng-deep .mat-mdc-tab-group.config-tabs .mat-mdc-tab-body-content{height:100%;overflow:auto;display:flex;flex-direction:column;padding:0!important}.tab-content{padding:16px 20px 20px;flex:1}.form-row{display:block;margin-bottom:12px}.form-grid{display:grid;gap:12px}.section-help{display:inline-flex;align-items:center;gap:8px;color:var(--md-sys-color-on-surface-variant);font-size:12px}.section-help__label{font-weight:500}.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}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.grid-2-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.grid-2-cols--compact{gap:12px}.w-100{width:100%}.visual-builder-content{padding:0!important;height:100%;overflow:hidden;display:flex;flex-direction:column}.visual-builder-content>praxis-visual-builder{flex:1;min-height:0}.json-field{width:100%}.presentation-layout{display:flex;gap:20px;align-items:flex-start}.presentation-controls{flex:1 1 60%;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 18px}.control{display:flex;flex-direction:column}.control-span{grid-column:1/-1}.block-status{grid-column:1/-1;display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--md-sys-color-primary-container) 35%,transparent);color:var(--md-sys-color-on-surface);font-size:12px;line-height:1.45}.block-status strong{min-width:112px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant)}.block-status--implicit{background:color-mix(in srgb,var(--md-sys-color-surface-variant) 42%,transparent);border:1px dashed var(--md-sys-color-outline)}.control__label{font-size:12px;color:var(--md-sys-color-on-surface-variant);margin-bottom:6px}.toggle-group{width:100%}.control--inline{grid-column:1/-1;display:flex;gap:16px;align-items:center}.presentation-preview{flex:0 0 360px;position:sticky;top:16px}.preview-card{border:1px solid var(--md-sys-color-outline);border-radius:12px;padding:14px;background:var(--md-sys-color-surface-container)}.preview-row{display:flex;gap:8px;padding:6px 0;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.preview-row:last-child{border-bottom:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.presentation-preview .praxis-presentation__label{color:var(--md-sys-color-on-surface-variant)}.presentation-preview .praxis-presentation__value{color:var(--md-sys-color-on-surface)}.presentation-preview .presentation-mode.pres-density-cozy .preview-row{padding:6px 0}.presentation-preview .presentation-mode.pres-density-compact .preview-row,.presentation-preview .presentation-mode.pres-compact .preview-row{padding:2px 0}.presentation-preview .presentation-mode.pres-label-left .preview-row{display:grid;grid-template-columns:var(--pfx-pres-label-width, 140px) 1fr;align-items:baseline;column-gap:10px}.presentation-preview .presentation-mode.pres-label-left .praxis-presentation__label{margin:0;text-align:var(--pfx-pres-label-align, start)}.presentation-preview .presentation-mode .praxis-presentation__value{text-align:var(--pfx-pres-value-align, start)}.presentation-preview h4{margin:0 0 8px;color:var(--md-sys-color-on-surface);font-size:1rem}.section-card{border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);box-shadow:var(--md-sys-elevation-level1, none)}.section-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.tab-content--dense{padding:12px 16px 16px}.tab-content--dense .section-header,.tab-content--dense .form-row{margin-bottom:8px}.section-header h3{margin:0;font-size:1.05rem;color:var(--md-sys-color-on-surface)}.text-caption{margin:6px 0 0;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.section-header--compact{margin-bottom:8px}.section-body{display:block}.section-body--flex{flex:1;min-height:0;display:flex;flex-direction:column}.builder-header{padding:12px 16px;border-bottom:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}.builder-header h3{margin:0;font-size:1rem;color:var(--md-sys-color-on-surface)}.hint{margin:8px 0 0;padding:10px 12px;border-radius:10px;border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface-variant)}.meta-card{display:grid;gap:6px;padding:10px 12px;border-radius:10px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface)}.meta-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.meta-row strong{color:var(--md-sys-color-on-surface);font-weight:600}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i7$2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i7$2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i8$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i8$1.MatCardContent, selector: "mat-card-content" }, { 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: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i6$4.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: i6$4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { 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: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i12.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: MatSlideToggleModule }, { kind: "component", type: i6$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i7$1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i7$1.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: JsonConfigEditorComponent, selector: "form-json-config-editor", inputs: ["config", "document"], outputs: ["configChange", "documentChange", "validationChange", "editorEvent"] }, { kind: "component", type: LayoutEditorComponent, selector: "praxis-layout-editor", inputs: ["config"], outputs: ["configChange", "select"] }, { kind: "component", type: BehaviorEditorComponent, selector: "praxis-behavior-editor", inputs: ["config"], outputs: ["configChange"] }, { kind: "component", type: ActionsEditorComponent$1, selector: "praxis-actions-editor", inputs: ["config"], outputs: ["configChange"] }, { kind: "component", type: MessagesEditorComponent, selector: "praxis-messages-editor", inputs: ["config"], outputs: ["configChange"] }, { kind: "component", type: HooksEditorComponent, selector: "praxis-hooks-editor", inputs: ["config"], outputs: ["configChange"] }, { kind: "component", type: PraxisVisualBuilder, selector: "praxis-visual-builder", inputs: ["config", "initialRules"], outputs: ["rulesChanged", "exportRequested", "importRequested"] }, { kind: "component", type: CascadeManagerTabComponent, selector: "praxis-cascade-manager-tab", inputs: ["fields", "connections"], outputs: ["apply", "cancel"] }] });
|
|
18796
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: PraxisDynamicFormConfigEditor, deps: [{ token: ASYNC_CONFIG_STORAGE }, { token: FormConfigService }, { token: i7.SettingsPanelService }, { token: i0.ChangeDetectorRef }, { token: SETTINGS_PANEL_DATA, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
18797
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: PraxisDynamicFormConfigEditor, isStandalone: true, selector: "praxis-dynamic-form-config-editor", providers: [FormConfigService], viewQueries: [{ propertyName: "jsonEditor", first: true, predicate: JsonConfigEditorComponent, descendants: true }], ngImport: i0, template: "<mat-tab-group class=\"config-tabs\" data-testid=\"dynamic-form-config-editor-tabs\">\n <mat-tab label=\"Geral\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-geral\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Dados do formul\u00E1rio</h3>\n <p class=\"text-caption\">Defina o modo de dados e o contexto de edi\u00E7\u00E3o.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Modo de dados</mat-label>\n <mat-select [(ngModel)]=\"inputMode\" (ngModelChange)=\"onInputModeChange()\">\n <mat-option value=\"create\">create</mat-option>\n <mat-option value=\"edit\">edit</mat-option>\n <mat-option value=\"view\">view</mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isBindingsBlockPersisted()\">\n <strong>Bindings</strong>\n <span *ngIf=\"isBindingsBlockPersisted(); else bindingsMissing\">`bindings.mode` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #bindingsMissing>Bloco ausente no documento can\u00F4nico. O valor exibido \u00E9 fallback visual e n\u00E3o ser\u00E1 salvo at\u00E9 voc\u00EA editar este campo.</ng-template>\n </div>\n <div class=\"section-help\">\n <span class=\"section-help__label\">Entenda:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'O mode controla o fluxo (create/edit/view). enableCustomization s\u00F3 libera edi\u00E7\u00E3o do layout e n\u00E3o altera o mode.'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n\n <mat-card\n class=\"section-card\"\n *ngIf=\"hasResolvedRuntimeContract()\"\n data-testid=\"config-tab-runtime-contract\"\n >\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Contrato Runtime Resolvido</h3>\n <p class=\"text-caption\">\n Visualiza\u00E7\u00E3o somente leitura do contrato backend resolvido pelo host atual.\n </p>\n </div>\n </div>\n <div class=\"block-status block-status--readonly\">\n <strong>Runtime</strong>\n <span>\n Esses valores v\u00EAm do host/runtime atual e n\u00E3o s\u00E3o persistidos em\n <code>bindings</code> nem em <code>contextSnapshot</code>.\n </span>\n </div>\n <div class=\"runtime-contract-grid\">\n <div class=\"runtime-contract-field\">\n <span class=\"runtime-contract-label\">Schema URL</span>\n <code class=\"runtime-contract-code\">{{ runtimeContract?.schemaUrl || '\u2014' }}</code>\n </div>\n <div class=\"runtime-contract-field\">\n <span class=\"runtime-contract-label\">Origem do schema</span>\n <strong>{{ describeRuntimeSource(runtimeContract?.schemaSource) }}</strong>\n </div>\n <div class=\"runtime-contract-field\">\n <span class=\"runtime-contract-label\">Submit method</span>\n <strong>{{ runtimeContract?.submitMethod || '\u2014' }}</strong>\n </div>\n <div class=\"runtime-contract-field\">\n <span class=\"runtime-contract-label\">Submit URL</span>\n <code class=\"runtime-contract-code\">{{ runtimeContract?.submitUrl || '\u2014' }}</code>\n </div>\n <div class=\"runtime-contract-field\">\n <span class=\"runtime-contract-label\">Origem do submit</span>\n <strong>{{ describeRuntimeSource(runtimeContract?.submitSource) }}</strong>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Verifica\u00E7\u00E3o de Schema\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-schema\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Valida\u00E7\u00E3o de schema</h3>\n <p class=\"text-caption\">Controle avisos quando o schema do servidor mudar.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Notificar quando desatualizado</mat-label>\n <mat-select [(ngModel)]=\"schemaPrefs.notifyIfOutdated\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-notify')\">\n <mat-option value=\"both\">Banner + Snackbar</mat-option>\n <mat-option value=\"inline\">Somente Banner</mat-option>\n <mat-option value=\"snackbar\">Somente Snackbar</mat-option>\n <mat-option value=\"none\">Nenhum</mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Intervalo de sil\u00EAncio (ms)</mat-label>\n <input matInput type=\"number\" [(ngModel)]=\"schemaPrefs.snoozeMs\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-snooze')\" />\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-slide-toggle [(ngModel)]=\"schemaPrefs.autoOpenSettingsOnOutdated\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-auto-open')\">Abrir configura\u00E7\u00F5es\n automaticamente</mat-slide-toggle>\n </div>\n <div class=\"form-row\" *ngIf=\"serverMeta\">\n <div class=\"meta-card\">\n <div class=\"meta-row\">\n <span>Server hash</span>\n <strong>{{ serverMeta.serverHash || '\u2014' }}</strong>\n </div>\n <div class=\"meta-row\">\n <span>\u00DAltima verifica\u00E7\u00E3o</span>\n <strong>{{ serverMeta.lastVerifiedAt || '\u2014' }}</strong>\n </div>\n </div>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isSchemaPrefsBlockPersisted()\">\n <strong>Schema Prefs</strong>\n <span *ngIf=\"isSchemaPrefsBlockPersisted(); else schemaPrefsMissing\">`contextSnapshot.schemaPrefs` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #schemaPrefsMissing>Bloco ausente no documento can\u00F4nico. Os controles exibem fallback visual e n\u00E3o ser\u00E3o salvos at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Layout\">\n <div class=\"tab-content tab-content--full\" data-testid=\"config-tab-panel-layout\">\n <div class=\"section-header section-header--compact\">\n <div>\n <h3>Layout do formul\u00E1rio</h3>\n <p class=\"text-caption\">Organize se\u00E7\u00F5es, linhas e campos com drag & drop.</p>\n </div>\n </div>\n <div class=\"section-body section-body--flex\">\n <praxis-layout-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"\n (select)=\"onLayoutSelect($event)\"></praxis-layout-editor>\n </div>\n </div>\n </mat-tab>\n <mat-tab label=\"Hooks\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-hooks\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Hooks de ciclo de vida</h3>\n <p class=\"text-caption\">Automatize a\u00E7\u00F5es nos eventos do formul\u00E1rio.</p>\n </div>\n </div>\n <praxis-hooks-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-hooks-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab *ngIf=\"isPresentationMode\" label=\"Modo Apresenta\u00E7\u00E3o\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-presentation\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Modo Apresenta\u00E7\u00E3o</h3>\n <p class=\"text-caption\">Configura\u00E7\u00F5es de exibi\u00E7\u00E3o aplicadas somente ao modo apresenta\u00E7\u00E3o.</p>\n </div>\n </div>\n\n <div class=\"presentation-layout\">\n <div class=\"presentation-controls\">\n <div class=\"block-status control-span\" [class.block-status--implicit]=\"!isPresentationBlockPersisted()\">\n <strong>Presentation</strong>\n <span *ngIf=\"isPresentationBlockPersisted(); else presentationMissing\">`contextSnapshot.presentation` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #presentationMissing>Bloco ausente no documento can\u00F4nico. A pr\u00E9-visualiza\u00E7\u00E3o usa fallback local e n\u00E3o ser\u00E1 salva at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n <div class=\"control\">\n <label class=\"control__label\">Posi\u00E7\u00E3o do r\u00F3tulo</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.labelPosition\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-position')\" aria-label=\"Posi\u00E7\u00E3o do r\u00F3tulo\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"above\">\n <mat-icon>view_stream</mat-icon>\n <span class=\"sr-only\">Acima</span>\n </mat-button-toggle>\n <mat-button-toggle value=\"left\">\n <mat-icon>view_column</mat-icon>\n <span class=\"sr-only\">\u00C0 esquerda</span>\n </mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Densidade</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.density\" (ngModelChange)=\"onPresentationPrefsChange('presentation-density')\" aria-label=\"Densidade\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"comfortable\">Confort\u00E1vel</mat-button-toggle>\n <mat-button-toggle value=\"cozy\">Intermedi\u00E1ria</mat-button-toggle>\n <mat-button-toggle value=\"compact\">Compacta</mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Alinhamento do r\u00F3tulo</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.labelAlign\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-align')\" aria-label=\"Alinhamento do r\u00F3tulo\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"start\"><mat-icon>format_align_left</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"center\"><mat-icon>format_align_center</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"end\"><mat-icon>format_align_right</mat-icon></mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Alinhamento do valor</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.valueAlign\" (ngModelChange)=\"onPresentationPrefsChange('presentation-value-align')\" aria-label=\"Alinhamento do valor\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"start\"><mat-icon>format_align_left</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"center\"><mat-icon>format_align_center</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"end\"><mat-icon>format_align_right</mat-icon></mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Tamanho do r\u00F3tulo</mat-label>\n <input matInput type=\"number\" min=\"10\" [(ngModel)]=\"presentationPrefs.labelFontSize\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-font-size')\"\n placeholder=\"ex.: 12\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Tamanho do valor</mat-label>\n <input matInput type=\"number\" min=\"10\" [(ngModel)]=\"presentationPrefs.valueFontSize\" (ngModelChange)=\"onPresentationPrefsChange('presentation-value-font-size')\"\n placeholder=\"ex.: 16\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Largura do r\u00F3tulo (label \u00E0 esquerda)</mat-label>\n <input matInput type=\"number\" min=\"60\" [(ngModel)]=\"presentationPrefs.labelWidth\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-width')\"\n placeholder=\"ex.: 140\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control control--inline\">\n <mat-slide-toggle [(ngModel)]=\"presentationPrefs.compact\" (ngModelChange)=\"onPresentationPrefsChange('presentation-compact')\">\n Modo compacto\n </mat-slide-toggle>\n <mat-checkbox [(ngModel)]=\"truncatePreview\">\n Truncar valores\n </mat-checkbox>\n </div>\n </div>\n\n <div class=\"presentation-preview\">\n <h4>Pr\u00E9\u2011visualiza\u00E7\u00E3o</h4>\n <div class=\"preview-card\">\n <div class=\"praxis-dynamic-form presentation-mode\" [ngClass]=\"{\n 'pres-compact': !!presentationPrefs.compact,\n 'pres-label-left': presentationPrefs.labelPosition === 'left',\n 'pres-label-above': presentationPrefs.labelPosition === 'above',\n 'pres-density-compact': presentationPrefs.density === 'compact',\n 'pres-density-cozy': presentationPrefs.density === 'cozy'\n }\" [style.--pfx-pres-label-size]=\"(presentationPrefs.labelFontSize || 12) + 'px'\"\n [style.--pfx-pres-value-size]=\"(presentationPrefs.valueFontSize || 16) + 'px'\"\n [style.--pfx-pres-label-width]=\"(presentationPrefs.labelWidth || 140) + 'px'\"\n [style.--pfx-pres-label-align]=\"presentationPrefs.labelAlign || 'start'\"\n [style.--pfx-pres-value-align]=\"presentationPrefs.valueAlign || 'start'\">\n <div class=\"preview-row\" *ngFor=\"let item of previewItems\">\n <span class=\"praxis-presentation__label\">{{ item.label }}</span>\n <span class=\"praxis-presentation__value\" [title]=\"truncatePreview ? item.value : null\"\n [style.maxWidth]=\"truncatePreview ? '280px' : null\"\n [style.overflow]=\"truncatePreview ? 'hidden' : null\"\n [style.textOverflow]=\"truncatePreview ? 'ellipsis' : null\"\n [style.whiteSpace]=\"truncatePreview ? 'nowrap' : 'normal'\">\n {{ item.value }}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"section-help\">\n <span class=\"section-help__label\">Entenda:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'Ajustes aplicam somente ao Modo Apresenta\u00E7\u00E3o e s\u00E3o salvos por formul\u00E1rio (via CSS/Classes).'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Comportamento\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-comportamento\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Comportamento</h3>\n <p class=\"text-caption\">Ajuste valida\u00E7\u00F5es e respostas do formul\u00E1rio.</p>\n </div>\n </div>\n <praxis-behavior-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-behavior-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Dicas e Tooltips\">\n <div class=\"tab-content tab-content--dense\" data-testid=\"config-tab-panel-hints\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Dicas dos modos</h3>\n <p class=\"text-caption\">Personalize textos de apoio para modos de dados e estados de UI.</p>\n </div>\n </div>\n <p class=\"text-caption\">Personalize os textos usados como tooltip/hint para modos de dados e modos globais de\n UI.</p>\n\n <div class=\"grid-2-cols grid-2-cols--compact\">\n <section>\n <h4>Modos de dados</h4>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Criar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.create\"\n (ngModelChange)=\"updateDirtyState('hints-data-create')\" placeholder=\"Ex.: Preencha os campos obrigat\u00F3rios.\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Editar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.edit\"\n (ngModelChange)=\"updateDirtyState('hints-data-edit')\" placeholder=\"Ex.: Revise os dados antes de salvar.\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Visualizar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.view\"\n (ngModelChange)=\"updateDirtyState('hints-data-view')\" placeholder=\"Ex.: Visualiza\u00E7\u00E3o somente leitura.\" />\n </mat-form-field>\n </section>\n\n <section>\n <h4>Modos de UI</h4>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Apresenta\u00E7\u00E3o</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.presentation\"\n (ngModelChange)=\"updateDirtyState('hints-ui-presentation')\" placeholder=\"Ex.: Modo compacto para leitura r\u00E1pida.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Leitura (readonly)</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.readonly\"\n (ngModelChange)=\"updateDirtyState('hints-ui-readonly')\" placeholder=\"Ex.: Campos bloqueados para edi\u00E7\u00E3o.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Desabilitado</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.disabled\"\n (ngModelChange)=\"updateDirtyState('hints-ui-disabled')\" placeholder=\"Ex.: Fun\u00E7\u00E3o indispon\u00EDvel no momento.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Vis\u00EDvel</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.visible\"\n (ngModelChange)=\"updateDirtyState('hints-ui-visible')\" placeholder=\"Ex.: Campo exibido conforme permiss\u00F5es.\"></textarea>\n </mat-form-field>\n </section>\n </div>\n\n <div class=\"actions-row\">\n <button mat-stroked-button color=\"primary\" type=\"button\" (click)=\"restoreHintsDefaults()\">\n <mat-icon>restore</mat-icon>\n Restaurar padr\u00F5es\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"A\u00E7\u00F5es\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-acoes\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>A\u00E7\u00F5es do formul\u00E1rio</h3>\n <p class=\"text-caption\">Configure bot\u00F5es padr\u00E3o e a\u00E7\u00F5es customizadas.</p>\n </div>\n </div>\n <praxis-actions-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-actions-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Regras\">\n <div class=\"tab-content visual-builder-content\" data-testid=\"config-tab-panel-regras\">\n <div class=\"builder-header\">\n <div>\n <h3>Regras visuais</h3>\n <p class=\"text-caption\">Defina visibilidade, estilos e rea\u00E7\u00F5es baseadas em condi\u00E7\u00F5es.</p>\n </div>\n </div>\n <praxis-visual-builder [config]=\"ruleBuilderConfig\" [initialRules]=\"ruleBuilderState\"\n (rulesChanged)=\"onRulesChanged($event)\"></praxis-visual-builder>\n </div>\n </mat-tab>\n <mat-tab label=\"Cascatas\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-cascatas\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Depend\u00EAncias entre campos</h3>\n <p class=\"text-caption\">Configure cascatas e carregamento entre campos.</p>\n </div>\n </div>\n <praxis-cascade-manager-tab [fields]=\"editedConfig.fieldMetadata || []\"\n (apply)=\"onCascadeApply($event)\"></praxis-cascade-manager-tab>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Mensagens\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-mensagens\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Mensagens e feedback</h3>\n <p class=\"text-caption\">Padronize textos de sucesso, erro e confirma\u00E7\u00F5es.</p>\n </div>\n </div>\n <praxis-messages-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-messages-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Navega\u00E7\u00E3o\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-navegacao\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Navega\u00E7\u00E3o de retorno</h3>\n <p class=\"text-caption\">Defina o comportamento do bot\u00E3o Voltar em fluxos CRUD.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Rota de retorno</mat-label>\n <input matInput id=\"returnTo\" [(ngModel)]=\"backConfig!.returnTo\" (ngModelChange)=\"onBackConfigChange()\" placeholder=\"/funcionarios\" />\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-slide-toggle [(ngModel)]=\"backConfig!.confirmOnDirty\" (ngModelChange)=\"onBackConfigChange()\">\n Confirmar ao sair com altera\u00E7\u00F5es\n </mat-slide-toggle>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isBackConfigBlockPersisted()\">\n <strong>Back Config</strong>\n <span *ngIf=\"isBackConfigBlockPersisted(); else backConfigMissing\">`contextSnapshot.backConfig` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #backConfigMissing>Bloco ausente no documento can\u00F4nico. Os valores exibidos s\u00E3o fallback visual e n\u00E3o ser\u00E3o salvos at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n </div>\n <div class=\"section-help\">\n <span class=\"section-help__label\">Observa\u00E7\u00E3o:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'Afeta o fluxo de navega\u00E7\u00E3o do CRUD e pode ser sobreposto por metadados do recurso.'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"JSON\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-json\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Configura\u00E7\u00E3o JSON</h3>\n <p class=\"text-caption\">Edi\u00E7\u00E3o avan\u00E7ada do documento can\u00F4nico de autoria do formul\u00E1rio.</p>\n </div>\n </div>\n <form-json-config-editor [document]=\"jsonDocument\" (documentChange)=\"onJsonConfigChange($event)\"\n (validationChange)=\"onJsonValidationChange($event)\" (editorEvent)=\"onJsonEditorEvent($event)\">\n </form-json-config-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{display:block;height:100%}.config-tabs{height:100%}::ng-deep .mat-mdc-tab-group.config-tabs{display:flex;flex-direction:column}::ng-deep .mat-mdc-tab-group.config-tabs .mat-mdc-tab-body-wrapper{flex:1;min-height:0}::ng-deep .mat-mdc-tab-group.config-tabs .mat-mdc-tab-body-content{height:100%;overflow:auto;display:flex;flex-direction:column;padding:0!important}.tab-content{padding:16px 20px 20px;flex:1}.form-row{display:block;margin-bottom:12px}.form-grid{display:grid;gap:12px}.section-help{display:inline-flex;align-items:center;gap:8px;color:var(--md-sys-color-on-surface-variant);font-size:12px}.section-help__label{font-weight:500}.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}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.grid-2-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.grid-2-cols--compact{gap:12px}.w-100{width:100%}.visual-builder-content{padding:0!important;height:100%;overflow:hidden;display:flex;flex-direction:column}.visual-builder-content>praxis-visual-builder{flex:1;min-height:0}.json-field{width:100%}.presentation-layout{display:flex;gap:20px;align-items:flex-start}.presentation-controls{flex:1 1 60%;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 18px}.control{display:flex;flex-direction:column}.control-span{grid-column:1/-1}.block-status{grid-column:1/-1;display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--md-sys-color-primary-container) 35%,transparent);color:var(--md-sys-color-on-surface);font-size:12px;line-height:1.45}.block-status strong{min-width:112px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant)}.block-status--implicit{background:color-mix(in srgb,var(--md-sys-color-surface-variant) 42%,transparent);border:1px dashed var(--md-sys-color-outline)}.block-status--readonly{margin-bottom:12px}.block-status code{font-family:var(--md-ref-typeface-mono, \"Courier New\", monospace);font-size:11px}.control__label{font-size:12px;color:var(--md-sys-color-on-surface-variant);margin-bottom:6px}.toggle-group{width:100%}.control--inline{grid-column:1/-1;display:flex;gap:16px;align-items:center}.presentation-preview{flex:0 0 360px;position:sticky;top:16px}.preview-card{border:1px solid var(--md-sys-color-outline);border-radius:12px;padding:14px;background:var(--md-sys-color-surface-container)}.preview-row{display:flex;gap:8px;padding:6px 0;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.preview-row:last-child{border-bottom:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.presentation-preview .praxis-presentation__label{color:var(--md-sys-color-on-surface-variant)}.presentation-preview .praxis-presentation__value{color:var(--md-sys-color-on-surface)}.presentation-preview .presentation-mode.pres-density-cozy .preview-row{padding:6px 0}.presentation-preview .presentation-mode.pres-density-compact .preview-row,.presentation-preview .presentation-mode.pres-compact .preview-row{padding:2px 0}.presentation-preview .presentation-mode.pres-label-left .preview-row{display:grid;grid-template-columns:var(--pfx-pres-label-width, 140px) 1fr;align-items:baseline;column-gap:10px}.presentation-preview .presentation-mode.pres-label-left .praxis-presentation__label{margin:0;text-align:var(--pfx-pres-label-align, start)}.presentation-preview .presentation-mode .praxis-presentation__value{text-align:var(--pfx-pres-value-align, start)}.presentation-preview h4{margin:0 0 8px;color:var(--md-sys-color-on-surface);font-size:1rem}.section-card{border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);box-shadow:var(--md-sys-elevation-level1, none)}.section-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.tab-content--dense{padding:12px 16px 16px}.tab-content--dense .section-header,.tab-content--dense .form-row{margin-bottom:8px}.section-header h3{margin:0;font-size:1.05rem;color:var(--md-sys-color-on-surface)}.text-caption{margin:6px 0 0;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.section-header--compact{margin-bottom:8px}.section-body{display:block}.section-body--flex{flex:1;min-height:0;display:flex;flex-direction:column}.builder-header{padding:12px 16px;border-bottom:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}.builder-header h3{margin:0;font-size:1rem;color:var(--md-sys-color-on-surface)}.hint{margin:8px 0 0;padding:10px 12px;border-radius:10px;border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface-variant)}.meta-card{display:grid;gap:6px;padding:10px 12px;border-radius:10px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface)}.meta-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.meta-row strong{color:var(--md-sys-color-on-surface);font-weight:600}.runtime-contract-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.runtime-contract-field{display:grid;gap:6px;padding:12px;border-radius:10px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}.runtime-contract-label{font-size:12px;color:var(--md-sys-color-on-surface-variant)}.runtime-contract-code{display:block;font-family:var(--md-ref-typeface-mono, \"Courier New\", monospace);font-size:12px;line-height:1.45;color:var(--md-sys-color-on-surface);word-break:break-word;white-space:normal}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i7$3.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i7$3.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i8.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i8.MatCardContent, selector: "mat-card-content" }, { 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: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i6$3.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: i6$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7$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: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i12$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: MatSlideToggleModule }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i7$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i7$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: JsonConfigEditorComponent, selector: "form-json-config-editor", inputs: ["config", "document"], outputs: ["configChange", "documentChange", "validationChange", "editorEvent"] }, { kind: "component", type: LayoutEditorComponent, selector: "praxis-layout-editor", inputs: ["config"], outputs: ["configChange", "select"] }, { kind: "component", type: BehaviorEditorComponent, selector: "praxis-behavior-editor", inputs: ["config"], outputs: ["configChange"] }, { kind: "component", type: ActionsEditorComponent$1, selector: "praxis-actions-editor", inputs: ["config"], outputs: ["configChange"] }, { kind: "component", type: MessagesEditorComponent, selector: "praxis-messages-editor", inputs: ["config"], outputs: ["configChange"] }, { kind: "component", type: HooksEditorComponent, selector: "praxis-hooks-editor", inputs: ["config"], outputs: ["configChange"] }, { kind: "component", type: PraxisVisualBuilder, selector: "praxis-visual-builder", inputs: ["config", "initialRules"], outputs: ["rulesChanged", "exportRequested", "importRequested"] }, { kind: "component", type: CascadeManagerTabComponent, selector: "praxis-cascade-manager-tab", inputs: ["fields", "connections"], outputs: ["apply", "cancel"] }] });
|
|
18482
18798
|
}
|
|
18483
18799
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: PraxisDynamicFormConfigEditor, decorators: [{
|
|
18484
18800
|
type: Component,
|
|
@@ -18504,11 +18820,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
18504
18820
|
HooksEditorComponent,
|
|
18505
18821
|
PraxisVisualBuilder,
|
|
18506
18822
|
CascadeManagerTabComponent,
|
|
18507
|
-
], providers: [FormConfigService], template: "<mat-tab-group class=\"config-tabs\" data-testid=\"dynamic-form-config-editor-tabs\">\n <mat-tab label=\"Geral\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-geral\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Dados do formul\u00E1rio</h3>\n <p class=\"text-caption\">Defina o modo de dados e o contexto de edi\u00E7\u00E3o.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Modo de dados</mat-label>\n <mat-select [(ngModel)]=\"inputMode\" (ngModelChange)=\"onInputModeChange()\">\n <mat-option value=\"create\">create</mat-option>\n <mat-option value=\"edit\">edit</mat-option>\n <mat-option value=\"view\">view</mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isBindingsBlockPersisted()\">\n <strong>Bindings</strong>\n <span *ngIf=\"isBindingsBlockPersisted(); else bindingsMissing\">`bindings.mode` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #bindingsMissing>Bloco ausente no documento can\u00F4nico. O valor exibido \u00E9 fallback visual e n\u00E3o ser\u00E1 salvo at\u00E9 voc\u00EA editar este campo.</ng-template>\n </div>\n <div class=\"section-help\">\n <span class=\"section-help__label\">Entenda:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'O mode controla o fluxo (create/edit/view). enableCustomization s\u00F3 libera edi\u00E7\u00E3o do layout e n\u00E3o altera o mode.'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Verifica\u00E7\u00E3o de Schema\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-schema\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Valida\u00E7\u00E3o de schema</h3>\n <p class=\"text-caption\">Controle avisos quando o schema do servidor mudar.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Notificar quando desatualizado</mat-label>\n <mat-select [(ngModel)]=\"schemaPrefs.notifyIfOutdated\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-notify')\">\n <mat-option value=\"both\">Banner + Snackbar</mat-option>\n <mat-option value=\"inline\">Somente Banner</mat-option>\n <mat-option value=\"snackbar\">Somente Snackbar</mat-option>\n <mat-option value=\"none\">Nenhum</mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Intervalo de sil\u00EAncio (ms)</mat-label>\n <input matInput type=\"number\" [(ngModel)]=\"schemaPrefs.snoozeMs\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-snooze')\" />\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-slide-toggle [(ngModel)]=\"schemaPrefs.autoOpenSettingsOnOutdated\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-auto-open')\">Abrir configura\u00E7\u00F5es\n automaticamente</mat-slide-toggle>\n </div>\n <div class=\"form-row\" *ngIf=\"serverMeta\">\n <div class=\"meta-card\">\n <div class=\"meta-row\">\n <span>Server hash</span>\n <strong>{{ serverMeta.serverHash || '\u2014' }}</strong>\n </div>\n <div class=\"meta-row\">\n <span>\u00DAltima verifica\u00E7\u00E3o</span>\n <strong>{{ serverMeta.lastVerifiedAt || '\u2014' }}</strong>\n </div>\n </div>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isSchemaPrefsBlockPersisted()\">\n <strong>Schema Prefs</strong>\n <span *ngIf=\"isSchemaPrefsBlockPersisted(); else schemaPrefsMissing\">`contextSnapshot.schemaPrefs` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #schemaPrefsMissing>Bloco ausente no documento can\u00F4nico. Os controles exibem fallback visual e n\u00E3o ser\u00E3o salvos at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Layout\">\n <div class=\"tab-content tab-content--full\" data-testid=\"config-tab-panel-layout\">\n <div class=\"section-header section-header--compact\">\n <div>\n <h3>Layout do formul\u00E1rio</h3>\n <p class=\"text-caption\">Organize se\u00E7\u00F5es, linhas e campos com drag & drop.</p>\n </div>\n </div>\n <div class=\"section-body section-body--flex\">\n <praxis-layout-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"\n (select)=\"onLayoutSelect($event)\"></praxis-layout-editor>\n </div>\n </div>\n </mat-tab>\n <mat-tab label=\"Hooks\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-hooks\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Hooks de ciclo de vida</h3>\n <p class=\"text-caption\">Automatize a\u00E7\u00F5es nos eventos do formul\u00E1rio.</p>\n </div>\n </div>\n <praxis-hooks-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-hooks-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab *ngIf=\"isPresentationMode\" label=\"Modo Apresenta\u00E7\u00E3o\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-presentation\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Modo Apresenta\u00E7\u00E3o</h3>\n <p class=\"text-caption\">Configura\u00E7\u00F5es de exibi\u00E7\u00E3o aplicadas somente ao modo apresenta\u00E7\u00E3o.</p>\n </div>\n </div>\n\n <div class=\"presentation-layout\">\n <div class=\"presentation-controls\">\n <div class=\"block-status control-span\" [class.block-status--implicit]=\"!isPresentationBlockPersisted()\">\n <strong>Presentation</strong>\n <span *ngIf=\"isPresentationBlockPersisted(); else presentationMissing\">`contextSnapshot.presentation` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #presentationMissing>Bloco ausente no documento can\u00F4nico. A pr\u00E9-visualiza\u00E7\u00E3o usa fallback local e n\u00E3o ser\u00E1 salva at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n <div class=\"control\">\n <label class=\"control__label\">Posi\u00E7\u00E3o do r\u00F3tulo</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.labelPosition\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-position')\" aria-label=\"Posi\u00E7\u00E3o do r\u00F3tulo\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"above\">\n <mat-icon>view_stream</mat-icon>\n <span class=\"sr-only\">Acima</span>\n </mat-button-toggle>\n <mat-button-toggle value=\"left\">\n <mat-icon>view_column</mat-icon>\n <span class=\"sr-only\">\u00C0 esquerda</span>\n </mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Densidade</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.density\" (ngModelChange)=\"onPresentationPrefsChange('presentation-density')\" aria-label=\"Densidade\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"comfortable\">Confort\u00E1vel</mat-button-toggle>\n <mat-button-toggle value=\"cozy\">Intermedi\u00E1ria</mat-button-toggle>\n <mat-button-toggle value=\"compact\">Compacta</mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Alinhamento do r\u00F3tulo</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.labelAlign\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-align')\" aria-label=\"Alinhamento do r\u00F3tulo\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"start\"><mat-icon>format_align_left</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"center\"><mat-icon>format_align_center</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"end\"><mat-icon>format_align_right</mat-icon></mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Alinhamento do valor</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.valueAlign\" (ngModelChange)=\"onPresentationPrefsChange('presentation-value-align')\" aria-label=\"Alinhamento do valor\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"start\"><mat-icon>format_align_left</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"center\"><mat-icon>format_align_center</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"end\"><mat-icon>format_align_right</mat-icon></mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Tamanho do r\u00F3tulo</mat-label>\n <input matInput type=\"number\" min=\"10\" [(ngModel)]=\"presentationPrefs.labelFontSize\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-font-size')\"\n placeholder=\"ex.: 12\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Tamanho do valor</mat-label>\n <input matInput type=\"number\" min=\"10\" [(ngModel)]=\"presentationPrefs.valueFontSize\" (ngModelChange)=\"onPresentationPrefsChange('presentation-value-font-size')\"\n placeholder=\"ex.: 16\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Largura do r\u00F3tulo (label \u00E0 esquerda)</mat-label>\n <input matInput type=\"number\" min=\"60\" [(ngModel)]=\"presentationPrefs.labelWidth\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-width')\"\n placeholder=\"ex.: 140\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control control--inline\">\n <mat-slide-toggle [(ngModel)]=\"presentationPrefs.compact\" (ngModelChange)=\"onPresentationPrefsChange('presentation-compact')\">\n Modo compacto\n </mat-slide-toggle>\n <mat-checkbox [(ngModel)]=\"truncatePreview\">\n Truncar valores\n </mat-checkbox>\n </div>\n </div>\n\n <div class=\"presentation-preview\">\n <h4>Pr\u00E9\u2011visualiza\u00E7\u00E3o</h4>\n <div class=\"preview-card\">\n <div class=\"praxis-dynamic-form presentation-mode\" [ngClass]=\"{\n 'pres-compact': !!presentationPrefs.compact,\n 'pres-label-left': presentationPrefs.labelPosition === 'left',\n 'pres-label-above': presentationPrefs.labelPosition === 'above',\n 'pres-density-compact': presentationPrefs.density === 'compact',\n 'pres-density-cozy': presentationPrefs.density === 'cozy'\n }\" [style.--pfx-pres-label-size]=\"(presentationPrefs.labelFontSize || 12) + 'px'\"\n [style.--pfx-pres-value-size]=\"(presentationPrefs.valueFontSize || 16) + 'px'\"\n [style.--pfx-pres-label-width]=\"(presentationPrefs.labelWidth || 140) + 'px'\"\n [style.--pfx-pres-label-align]=\"presentationPrefs.labelAlign || 'start'\"\n [style.--pfx-pres-value-align]=\"presentationPrefs.valueAlign || 'start'\">\n <div class=\"preview-row\" *ngFor=\"let item of previewItems\">\n <span class=\"praxis-presentation__label\">{{ item.label }}</span>\n <span class=\"praxis-presentation__value\" [title]=\"truncatePreview ? item.value : null\"\n [style.maxWidth]=\"truncatePreview ? '280px' : null\"\n [style.overflow]=\"truncatePreview ? 'hidden' : null\"\n [style.textOverflow]=\"truncatePreview ? 'ellipsis' : null\"\n [style.whiteSpace]=\"truncatePreview ? 'nowrap' : 'normal'\">\n {{ item.value }}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"section-help\">\n <span class=\"section-help__label\">Entenda:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'Ajustes aplicam somente ao Modo Apresenta\u00E7\u00E3o e s\u00E3o salvos por formul\u00E1rio (via CSS/Classes).'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Comportamento\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-comportamento\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Comportamento</h3>\n <p class=\"text-caption\">Ajuste valida\u00E7\u00F5es e respostas do formul\u00E1rio.</p>\n </div>\n </div>\n <praxis-behavior-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-behavior-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Dicas e Tooltips\">\n <div class=\"tab-content tab-content--dense\" data-testid=\"config-tab-panel-hints\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Dicas dos modos</h3>\n <p class=\"text-caption\">Personalize textos de apoio para modos de dados e estados de UI.</p>\n </div>\n </div>\n <p class=\"text-caption\">Personalize os textos usados como tooltip/hint para modos de dados e modos globais de\n UI.</p>\n\n <div class=\"grid-2-cols grid-2-cols--compact\">\n <section>\n <h4>Modos de dados</h4>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Criar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.create\"\n (ngModelChange)=\"updateDirtyState('hints-data-create')\" placeholder=\"Ex.: Preencha os campos obrigat\u00F3rios.\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Editar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.edit\"\n (ngModelChange)=\"updateDirtyState('hints-data-edit')\" placeholder=\"Ex.: Revise os dados antes de salvar.\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Visualizar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.view\"\n (ngModelChange)=\"updateDirtyState('hints-data-view')\" placeholder=\"Ex.: Visualiza\u00E7\u00E3o somente leitura.\" />\n </mat-form-field>\n </section>\n\n <section>\n <h4>Modos de UI</h4>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Apresenta\u00E7\u00E3o</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.presentation\"\n (ngModelChange)=\"updateDirtyState('hints-ui-presentation')\" placeholder=\"Ex.: Modo compacto para leitura r\u00E1pida.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Leitura (readonly)</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.readonly\"\n (ngModelChange)=\"updateDirtyState('hints-ui-readonly')\" placeholder=\"Ex.: Campos bloqueados para edi\u00E7\u00E3o.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Desabilitado</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.disabled\"\n (ngModelChange)=\"updateDirtyState('hints-ui-disabled')\" placeholder=\"Ex.: Fun\u00E7\u00E3o indispon\u00EDvel no momento.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Vis\u00EDvel</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.visible\"\n (ngModelChange)=\"updateDirtyState('hints-ui-visible')\" placeholder=\"Ex.: Campo exibido conforme permiss\u00F5es.\"></textarea>\n </mat-form-field>\n </section>\n </div>\n\n <div class=\"actions-row\">\n <button mat-stroked-button color=\"primary\" type=\"button\" (click)=\"restoreHintsDefaults()\">\n <mat-icon>restore</mat-icon>\n Restaurar padr\u00F5es\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"A\u00E7\u00F5es\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-acoes\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>A\u00E7\u00F5es do formul\u00E1rio</h3>\n <p class=\"text-caption\">Configure bot\u00F5es padr\u00E3o e a\u00E7\u00F5es customizadas.</p>\n </div>\n </div>\n <praxis-actions-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-actions-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Regras\">\n <div class=\"tab-content visual-builder-content\" data-testid=\"config-tab-panel-regras\">\n <div class=\"builder-header\">\n <div>\n <h3>Regras visuais</h3>\n <p class=\"text-caption\">Defina visibilidade, estilos e rea\u00E7\u00F5es baseadas em condi\u00E7\u00F5es.</p>\n </div>\n </div>\n <praxis-visual-builder [config]=\"ruleBuilderConfig\" [initialRules]=\"ruleBuilderState\"\n (rulesChanged)=\"onRulesChanged($event)\"></praxis-visual-builder>\n </div>\n </mat-tab>\n <mat-tab label=\"Cascatas\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-cascatas\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Depend\u00EAncias entre campos</h3>\n <p class=\"text-caption\">Configure cascatas e carregamento entre campos.</p>\n </div>\n </div>\n <praxis-cascade-manager-tab [fields]=\"editedConfig.fieldMetadata || []\"\n (apply)=\"onCascadeApply($event)\"></praxis-cascade-manager-tab>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Mensagens\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-mensagens\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Mensagens e feedback</h3>\n <p class=\"text-caption\">Padronize textos de sucesso, erro e confirma\u00E7\u00F5es.</p>\n </div>\n </div>\n <praxis-messages-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-messages-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Navega\u00E7\u00E3o\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-navegacao\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Navega\u00E7\u00E3o de retorno</h3>\n <p class=\"text-caption\">Defina o comportamento do bot\u00E3o Voltar em fluxos CRUD.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Rota de retorno</mat-label>\n <input matInput id=\"returnTo\" [(ngModel)]=\"backConfig!.returnTo\" (ngModelChange)=\"onBackConfigChange()\" placeholder=\"/funcionarios\" />\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-slide-toggle [(ngModel)]=\"backConfig!.confirmOnDirty\" (ngModelChange)=\"onBackConfigChange()\">\n Confirmar ao sair com altera\u00E7\u00F5es\n </mat-slide-toggle>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isBackConfigBlockPersisted()\">\n <strong>Back Config</strong>\n <span *ngIf=\"isBackConfigBlockPersisted(); else backConfigMissing\">`contextSnapshot.backConfig` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #backConfigMissing>Bloco ausente no documento can\u00F4nico. Os valores exibidos s\u00E3o fallback visual e n\u00E3o ser\u00E3o salvos at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n </div>\n <div class=\"section-help\">\n <span class=\"section-help__label\">Observa\u00E7\u00E3o:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'Afeta o fluxo de navega\u00E7\u00E3o do CRUD e pode ser sobreposto por metadados do recurso.'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"JSON\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-json\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Configura\u00E7\u00E3o JSON</h3>\n <p class=\"text-caption\">Edi\u00E7\u00E3o avan\u00E7ada do documento can\u00F4nico de autoria do formul\u00E1rio.</p>\n </div>\n </div>\n <form-json-config-editor [document]=\"jsonDocument\" (documentChange)=\"onJsonConfigChange($event)\"\n (validationChange)=\"onJsonValidationChange($event)\" (editorEvent)=\"onJsonEditorEvent($event)\">\n </form-json-config-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{display:block;height:100%}.config-tabs{height:100%}::ng-deep .mat-mdc-tab-group.config-tabs{display:flex;flex-direction:column}::ng-deep .mat-mdc-tab-group.config-tabs .mat-mdc-tab-body-wrapper{flex:1;min-height:0}::ng-deep .mat-mdc-tab-group.config-tabs .mat-mdc-tab-body-content{height:100%;overflow:auto;display:flex;flex-direction:column;padding:0!important}.tab-content{padding:16px 20px 20px;flex:1}.form-row{display:block;margin-bottom:12px}.form-grid{display:grid;gap:12px}.section-help{display:inline-flex;align-items:center;gap:8px;color:var(--md-sys-color-on-surface-variant);font-size:12px}.section-help__label{font-weight:500}.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}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.grid-2-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.grid-2-cols--compact{gap:12px}.w-100{width:100%}.visual-builder-content{padding:0!important;height:100%;overflow:hidden;display:flex;flex-direction:column}.visual-builder-content>praxis-visual-builder{flex:1;min-height:0}.json-field{width:100%}.presentation-layout{display:flex;gap:20px;align-items:flex-start}.presentation-controls{flex:1 1 60%;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 18px}.control{display:flex;flex-direction:column}.control-span{grid-column:1/-1}.block-status{grid-column:1/-1;display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--md-sys-color-primary-container) 35%,transparent);color:var(--md-sys-color-on-surface);font-size:12px;line-height:1.45}.block-status strong{min-width:112px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant)}.block-status--implicit{background:color-mix(in srgb,var(--md-sys-color-surface-variant) 42%,transparent);border:1px dashed var(--md-sys-color-outline)}.control__label{font-size:12px;color:var(--md-sys-color-on-surface-variant);margin-bottom:6px}.toggle-group{width:100%}.control--inline{grid-column:1/-1;display:flex;gap:16px;align-items:center}.presentation-preview{flex:0 0 360px;position:sticky;top:16px}.preview-card{border:1px solid var(--md-sys-color-outline);border-radius:12px;padding:14px;background:var(--md-sys-color-surface-container)}.preview-row{display:flex;gap:8px;padding:6px 0;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.preview-row:last-child{border-bottom:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.presentation-preview .praxis-presentation__label{color:var(--md-sys-color-on-surface-variant)}.presentation-preview .praxis-presentation__value{color:var(--md-sys-color-on-surface)}.presentation-preview .presentation-mode.pres-density-cozy .preview-row{padding:6px 0}.presentation-preview .presentation-mode.pres-density-compact .preview-row,.presentation-preview .presentation-mode.pres-compact .preview-row{padding:2px 0}.presentation-preview .presentation-mode.pres-label-left .preview-row{display:grid;grid-template-columns:var(--pfx-pres-label-width, 140px) 1fr;align-items:baseline;column-gap:10px}.presentation-preview .presentation-mode.pres-label-left .praxis-presentation__label{margin:0;text-align:var(--pfx-pres-label-align, start)}.presentation-preview .presentation-mode .praxis-presentation__value{text-align:var(--pfx-pres-value-align, start)}.presentation-preview h4{margin:0 0 8px;color:var(--md-sys-color-on-surface);font-size:1rem}.section-card{border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);box-shadow:var(--md-sys-elevation-level1, none)}.section-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.tab-content--dense{padding:12px 16px 16px}.tab-content--dense .section-header,.tab-content--dense .form-row{margin-bottom:8px}.section-header h3{margin:0;font-size:1.05rem;color:var(--md-sys-color-on-surface)}.text-caption{margin:6px 0 0;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.section-header--compact{margin-bottom:8px}.section-body{display:block}.section-body--flex{flex:1;min-height:0;display:flex;flex-direction:column}.builder-header{padding:12px 16px;border-bottom:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}.builder-header h3{margin:0;font-size:1rem;color:var(--md-sys-color-on-surface)}.hint{margin:8px 0 0;padding:10px 12px;border-radius:10px;border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface-variant)}.meta-card{display:grid;gap:6px;padding:10px 12px;border-radius:10px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface)}.meta-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.meta-row strong{color:var(--md-sys-color-on-surface);font-weight:600}\n"] }]
|
|
18823
|
+
], providers: [FormConfigService], template: "<mat-tab-group class=\"config-tabs\" data-testid=\"dynamic-form-config-editor-tabs\">\n <mat-tab label=\"Geral\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-geral\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Dados do formul\u00E1rio</h3>\n <p class=\"text-caption\">Defina o modo de dados e o contexto de edi\u00E7\u00E3o.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Modo de dados</mat-label>\n <mat-select [(ngModel)]=\"inputMode\" (ngModelChange)=\"onInputModeChange()\">\n <mat-option value=\"create\">create</mat-option>\n <mat-option value=\"edit\">edit</mat-option>\n <mat-option value=\"view\">view</mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isBindingsBlockPersisted()\">\n <strong>Bindings</strong>\n <span *ngIf=\"isBindingsBlockPersisted(); else bindingsMissing\">`bindings.mode` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #bindingsMissing>Bloco ausente no documento can\u00F4nico. O valor exibido \u00E9 fallback visual e n\u00E3o ser\u00E1 salvo at\u00E9 voc\u00EA editar este campo.</ng-template>\n </div>\n <div class=\"section-help\">\n <span class=\"section-help__label\">Entenda:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'O mode controla o fluxo (create/edit/view). enableCustomization s\u00F3 libera edi\u00E7\u00E3o do layout e n\u00E3o altera o mode.'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n\n <mat-card\n class=\"section-card\"\n *ngIf=\"hasResolvedRuntimeContract()\"\n data-testid=\"config-tab-runtime-contract\"\n >\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Contrato Runtime Resolvido</h3>\n <p class=\"text-caption\">\n Visualiza\u00E7\u00E3o somente leitura do contrato backend resolvido pelo host atual.\n </p>\n </div>\n </div>\n <div class=\"block-status block-status--readonly\">\n <strong>Runtime</strong>\n <span>\n Esses valores v\u00EAm do host/runtime atual e n\u00E3o s\u00E3o persistidos em\n <code>bindings</code> nem em <code>contextSnapshot</code>.\n </span>\n </div>\n <div class=\"runtime-contract-grid\">\n <div class=\"runtime-contract-field\">\n <span class=\"runtime-contract-label\">Schema URL</span>\n <code class=\"runtime-contract-code\">{{ runtimeContract?.schemaUrl || '\u2014' }}</code>\n </div>\n <div class=\"runtime-contract-field\">\n <span class=\"runtime-contract-label\">Origem do schema</span>\n <strong>{{ describeRuntimeSource(runtimeContract?.schemaSource) }}</strong>\n </div>\n <div class=\"runtime-contract-field\">\n <span class=\"runtime-contract-label\">Submit method</span>\n <strong>{{ runtimeContract?.submitMethod || '\u2014' }}</strong>\n </div>\n <div class=\"runtime-contract-field\">\n <span class=\"runtime-contract-label\">Submit URL</span>\n <code class=\"runtime-contract-code\">{{ runtimeContract?.submitUrl || '\u2014' }}</code>\n </div>\n <div class=\"runtime-contract-field\">\n <span class=\"runtime-contract-label\">Origem do submit</span>\n <strong>{{ describeRuntimeSource(runtimeContract?.submitSource) }}</strong>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Verifica\u00E7\u00E3o de Schema\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-schema\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Valida\u00E7\u00E3o de schema</h3>\n <p class=\"text-caption\">Controle avisos quando o schema do servidor mudar.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Notificar quando desatualizado</mat-label>\n <mat-select [(ngModel)]=\"schemaPrefs.notifyIfOutdated\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-notify')\">\n <mat-option value=\"both\">Banner + Snackbar</mat-option>\n <mat-option value=\"inline\">Somente Banner</mat-option>\n <mat-option value=\"snackbar\">Somente Snackbar</mat-option>\n <mat-option value=\"none\">Nenhum</mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Intervalo de sil\u00EAncio (ms)</mat-label>\n <input matInput type=\"number\" [(ngModel)]=\"schemaPrefs.snoozeMs\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-snooze')\" />\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-slide-toggle [(ngModel)]=\"schemaPrefs.autoOpenSettingsOnOutdated\" (ngModelChange)=\"onSchemaPrefsChange('schema-prefs-auto-open')\">Abrir configura\u00E7\u00F5es\n automaticamente</mat-slide-toggle>\n </div>\n <div class=\"form-row\" *ngIf=\"serverMeta\">\n <div class=\"meta-card\">\n <div class=\"meta-row\">\n <span>Server hash</span>\n <strong>{{ serverMeta.serverHash || '\u2014' }}</strong>\n </div>\n <div class=\"meta-row\">\n <span>\u00DAltima verifica\u00E7\u00E3o</span>\n <strong>{{ serverMeta.lastVerifiedAt || '\u2014' }}</strong>\n </div>\n </div>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isSchemaPrefsBlockPersisted()\">\n <strong>Schema Prefs</strong>\n <span *ngIf=\"isSchemaPrefsBlockPersisted(); else schemaPrefsMissing\">`contextSnapshot.schemaPrefs` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #schemaPrefsMissing>Bloco ausente no documento can\u00F4nico. Os controles exibem fallback visual e n\u00E3o ser\u00E3o salvos at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Layout\">\n <div class=\"tab-content tab-content--full\" data-testid=\"config-tab-panel-layout\">\n <div class=\"section-header section-header--compact\">\n <div>\n <h3>Layout do formul\u00E1rio</h3>\n <p class=\"text-caption\">Organize se\u00E7\u00F5es, linhas e campos com drag & drop.</p>\n </div>\n </div>\n <div class=\"section-body section-body--flex\">\n <praxis-layout-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"\n (select)=\"onLayoutSelect($event)\"></praxis-layout-editor>\n </div>\n </div>\n </mat-tab>\n <mat-tab label=\"Hooks\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-hooks\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Hooks de ciclo de vida</h3>\n <p class=\"text-caption\">Automatize a\u00E7\u00F5es nos eventos do formul\u00E1rio.</p>\n </div>\n </div>\n <praxis-hooks-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-hooks-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab *ngIf=\"isPresentationMode\" label=\"Modo Apresenta\u00E7\u00E3o\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-presentation\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Modo Apresenta\u00E7\u00E3o</h3>\n <p class=\"text-caption\">Configura\u00E7\u00F5es de exibi\u00E7\u00E3o aplicadas somente ao modo apresenta\u00E7\u00E3o.</p>\n </div>\n </div>\n\n <div class=\"presentation-layout\">\n <div class=\"presentation-controls\">\n <div class=\"block-status control-span\" [class.block-status--implicit]=\"!isPresentationBlockPersisted()\">\n <strong>Presentation</strong>\n <span *ngIf=\"isPresentationBlockPersisted(); else presentationMissing\">`contextSnapshot.presentation` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #presentationMissing>Bloco ausente no documento can\u00F4nico. A pr\u00E9-visualiza\u00E7\u00E3o usa fallback local e n\u00E3o ser\u00E1 salva at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n <div class=\"control\">\n <label class=\"control__label\">Posi\u00E7\u00E3o do r\u00F3tulo</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.labelPosition\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-position')\" aria-label=\"Posi\u00E7\u00E3o do r\u00F3tulo\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"above\">\n <mat-icon>view_stream</mat-icon>\n <span class=\"sr-only\">Acima</span>\n </mat-button-toggle>\n <mat-button-toggle value=\"left\">\n <mat-icon>view_column</mat-icon>\n <span class=\"sr-only\">\u00C0 esquerda</span>\n </mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Densidade</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.density\" (ngModelChange)=\"onPresentationPrefsChange('presentation-density')\" aria-label=\"Densidade\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"comfortable\">Confort\u00E1vel</mat-button-toggle>\n <mat-button-toggle value=\"cozy\">Intermedi\u00E1ria</mat-button-toggle>\n <mat-button-toggle value=\"compact\">Compacta</mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Alinhamento do r\u00F3tulo</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.labelAlign\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-align')\" aria-label=\"Alinhamento do r\u00F3tulo\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"start\"><mat-icon>format_align_left</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"center\"><mat-icon>format_align_center</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"end\"><mat-icon>format_align_right</mat-icon></mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <label class=\"control__label\">Alinhamento do valor</label>\n <mat-button-toggle-group [(ngModel)]=\"presentationPrefs.valueAlign\" (ngModelChange)=\"onPresentationPrefsChange('presentation-value-align')\" aria-label=\"Alinhamento do valor\"\n class=\"toggle-group\">\n <mat-button-toggle value=\"start\"><mat-icon>format_align_left</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"center\"><mat-icon>format_align_center</mat-icon></mat-button-toggle>\n <mat-button-toggle value=\"end\"><mat-icon>format_align_right</mat-icon></mat-button-toggle>\n </mat-button-toggle-group>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Tamanho do r\u00F3tulo</mat-label>\n <input matInput type=\"number\" min=\"10\" [(ngModel)]=\"presentationPrefs.labelFontSize\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-font-size')\"\n placeholder=\"ex.: 12\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Tamanho do valor</mat-label>\n <input matInput type=\"number\" min=\"10\" [(ngModel)]=\"presentationPrefs.valueFontSize\" (ngModelChange)=\"onPresentationPrefsChange('presentation-value-font-size')\"\n placeholder=\"ex.: 16\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Largura do r\u00F3tulo (label \u00E0 esquerda)</mat-label>\n <input matInput type=\"number\" min=\"60\" [(ngModel)]=\"presentationPrefs.labelWidth\" (ngModelChange)=\"onPresentationPrefsChange('presentation-label-width')\"\n placeholder=\"ex.: 140\" />\n <span matSuffix>px</span>\n </mat-form-field>\n </div>\n\n <div class=\"control control--inline\">\n <mat-slide-toggle [(ngModel)]=\"presentationPrefs.compact\" (ngModelChange)=\"onPresentationPrefsChange('presentation-compact')\">\n Modo compacto\n </mat-slide-toggle>\n <mat-checkbox [(ngModel)]=\"truncatePreview\">\n Truncar valores\n </mat-checkbox>\n </div>\n </div>\n\n <div class=\"presentation-preview\">\n <h4>Pr\u00E9\u2011visualiza\u00E7\u00E3o</h4>\n <div class=\"preview-card\">\n <div class=\"praxis-dynamic-form presentation-mode\" [ngClass]=\"{\n 'pres-compact': !!presentationPrefs.compact,\n 'pres-label-left': presentationPrefs.labelPosition === 'left',\n 'pres-label-above': presentationPrefs.labelPosition === 'above',\n 'pres-density-compact': presentationPrefs.density === 'compact',\n 'pres-density-cozy': presentationPrefs.density === 'cozy'\n }\" [style.--pfx-pres-label-size]=\"(presentationPrefs.labelFontSize || 12) + 'px'\"\n [style.--pfx-pres-value-size]=\"(presentationPrefs.valueFontSize || 16) + 'px'\"\n [style.--pfx-pres-label-width]=\"(presentationPrefs.labelWidth || 140) + 'px'\"\n [style.--pfx-pres-label-align]=\"presentationPrefs.labelAlign || 'start'\"\n [style.--pfx-pres-value-align]=\"presentationPrefs.valueAlign || 'start'\">\n <div class=\"preview-row\" *ngFor=\"let item of previewItems\">\n <span class=\"praxis-presentation__label\">{{ item.label }}</span>\n <span class=\"praxis-presentation__value\" [title]=\"truncatePreview ? item.value : null\"\n [style.maxWidth]=\"truncatePreview ? '280px' : null\"\n [style.overflow]=\"truncatePreview ? 'hidden' : null\"\n [style.textOverflow]=\"truncatePreview ? 'ellipsis' : null\"\n [style.whiteSpace]=\"truncatePreview ? 'nowrap' : 'normal'\">\n {{ item.value }}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"section-help\">\n <span class=\"section-help__label\">Entenda:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'Ajustes aplicam somente ao Modo Apresenta\u00E7\u00E3o e s\u00E3o salvos por formul\u00E1rio (via CSS/Classes).'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Comportamento\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-comportamento\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Comportamento</h3>\n <p class=\"text-caption\">Ajuste valida\u00E7\u00F5es e respostas do formul\u00E1rio.</p>\n </div>\n </div>\n <praxis-behavior-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-behavior-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Dicas e Tooltips\">\n <div class=\"tab-content tab-content--dense\" data-testid=\"config-tab-panel-hints\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Dicas dos modos</h3>\n <p class=\"text-caption\">Personalize textos de apoio para modos de dados e estados de UI.</p>\n </div>\n </div>\n <p class=\"text-caption\">Personalize os textos usados como tooltip/hint para modos de dados e modos globais de\n UI.</p>\n\n <div class=\"grid-2-cols grid-2-cols--compact\">\n <section>\n <h4>Modos de dados</h4>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Criar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.create\"\n (ngModelChange)=\"updateDirtyState('hints-data-create')\" placeholder=\"Ex.: Preencha os campos obrigat\u00F3rios.\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Editar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.edit\"\n (ngModelChange)=\"updateDirtyState('hints-data-edit')\" placeholder=\"Ex.: Revise os dados antes de salvar.\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Visualizar</mat-label>\n <input matInput [(ngModel)]=\"editedConfig.hints!.dataModes.view\"\n (ngModelChange)=\"updateDirtyState('hints-data-view')\" placeholder=\"Ex.: Visualiza\u00E7\u00E3o somente leitura.\" />\n </mat-form-field>\n </section>\n\n <section>\n <h4>Modos de UI</h4>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Apresenta\u00E7\u00E3o</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.presentation\"\n (ngModelChange)=\"updateDirtyState('hints-ui-presentation')\" placeholder=\"Ex.: Modo compacto para leitura r\u00E1pida.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Leitura (readonly)</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.readonly\"\n (ngModelChange)=\"updateDirtyState('hints-ui-readonly')\" placeholder=\"Ex.: Campos bloqueados para edi\u00E7\u00E3o.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Desabilitado</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.disabled\"\n (ngModelChange)=\"updateDirtyState('hints-ui-disabled')\" placeholder=\"Ex.: Fun\u00E7\u00E3o indispon\u00EDvel no momento.\"></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Vis\u00EDvel</mat-label>\n <textarea matInput rows=\"2\" [(ngModel)]=\"editedConfig.hints!.uiModes.visible\"\n (ngModelChange)=\"updateDirtyState('hints-ui-visible')\" placeholder=\"Ex.: Campo exibido conforme permiss\u00F5es.\"></textarea>\n </mat-form-field>\n </section>\n </div>\n\n <div class=\"actions-row\">\n <button mat-stroked-button color=\"primary\" type=\"button\" (click)=\"restoreHintsDefaults()\">\n <mat-icon>restore</mat-icon>\n Restaurar padr\u00F5es\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"A\u00E7\u00F5es\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-acoes\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>A\u00E7\u00F5es do formul\u00E1rio</h3>\n <p class=\"text-caption\">Configure bot\u00F5es padr\u00E3o e a\u00E7\u00F5es customizadas.</p>\n </div>\n </div>\n <praxis-actions-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-actions-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Regras\">\n <div class=\"tab-content visual-builder-content\" data-testid=\"config-tab-panel-regras\">\n <div class=\"builder-header\">\n <div>\n <h3>Regras visuais</h3>\n <p class=\"text-caption\">Defina visibilidade, estilos e rea\u00E7\u00F5es baseadas em condi\u00E7\u00F5es.</p>\n </div>\n </div>\n <praxis-visual-builder [config]=\"ruleBuilderConfig\" [initialRules]=\"ruleBuilderState\"\n (rulesChanged)=\"onRulesChanged($event)\"></praxis-visual-builder>\n </div>\n </mat-tab>\n <mat-tab label=\"Cascatas\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-cascatas\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Depend\u00EAncias entre campos</h3>\n <p class=\"text-caption\">Configure cascatas e carregamento entre campos.</p>\n </div>\n </div>\n <praxis-cascade-manager-tab [fields]=\"editedConfig.fieldMetadata || []\"\n (apply)=\"onCascadeApply($event)\"></praxis-cascade-manager-tab>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Mensagens\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-mensagens\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Mensagens e feedback</h3>\n <p class=\"text-caption\">Padronize textos de sucesso, erro e confirma\u00E7\u00F5es.</p>\n </div>\n </div>\n <praxis-messages-editor [config]=\"editedConfig\" (configChange)=\"onConfigChange($event)\"></praxis-messages-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"Navega\u00E7\u00E3o\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-navegacao\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Navega\u00E7\u00E3o de retorno</h3>\n <p class=\"text-caption\">Defina o comportamento do bot\u00E3o Voltar em fluxos CRUD.</p>\n </div>\n </div>\n <div class=\"form-grid\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"fill\" class=\"w-100\">\n <mat-label>Rota de retorno</mat-label>\n <input matInput id=\"returnTo\" [(ngModel)]=\"backConfig!.returnTo\" (ngModelChange)=\"onBackConfigChange()\" placeholder=\"/funcionarios\" />\n </mat-form-field>\n </div>\n <div class=\"form-row\">\n <mat-slide-toggle [(ngModel)]=\"backConfig!.confirmOnDirty\" (ngModelChange)=\"onBackConfigChange()\">\n Confirmar ao sair com altera\u00E7\u00F5es\n </mat-slide-toggle>\n </div>\n <div class=\"block-status\" [class.block-status--implicit]=\"!isBackConfigBlockPersisted()\">\n <strong>Back Config</strong>\n <span *ngIf=\"isBackConfigBlockPersisted(); else backConfigMissing\">`contextSnapshot.backConfig` ser\u00E1 persistido no documento can\u00F4nico.</span>\n <ng-template #backConfigMissing>Bloco ausente no documento can\u00F4nico. Os valores exibidos s\u00E3o fallback visual e n\u00E3o ser\u00E3o salvos at\u00E9 voc\u00EA editar.</ng-template>\n </div>\n </div>\n <div class=\"section-help\">\n <span class=\"section-help__label\">Observa\u00E7\u00E3o:</span>\n <button\n mat-icon-button\n class=\"help-icon-button\"\n type=\"button\"\n [matTooltip]=\"'Afeta o fluxo de navega\u00E7\u00E3o do CRUD e pode ser sobreposto por metadados do recurso.'\"\n matTooltipPosition=\"above\"\n >\n <mat-icon>help_outline</mat-icon>\n </button>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n <mat-tab label=\"JSON\">\n <div class=\"tab-content\" data-testid=\"config-tab-panel-json\">\n <mat-card class=\"section-card\">\n <mat-card-content>\n <div class=\"section-header\">\n <div>\n <h3>Configura\u00E7\u00E3o JSON</h3>\n <p class=\"text-caption\">Edi\u00E7\u00E3o avan\u00E7ada do documento can\u00F4nico de autoria do formul\u00E1rio.</p>\n </div>\n </div>\n <form-json-config-editor [document]=\"jsonDocument\" (documentChange)=\"onJsonConfigChange($event)\"\n (validationChange)=\"onJsonValidationChange($event)\" (editorEvent)=\"onJsonEditorEvent($event)\">\n </form-json-config-editor>\n </mat-card-content>\n </mat-card>\n </div>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{display:block;height:100%}.config-tabs{height:100%}::ng-deep .mat-mdc-tab-group.config-tabs{display:flex;flex-direction:column}::ng-deep .mat-mdc-tab-group.config-tabs .mat-mdc-tab-body-wrapper{flex:1;min-height:0}::ng-deep .mat-mdc-tab-group.config-tabs .mat-mdc-tab-body-content{height:100%;overflow:auto;display:flex;flex-direction:column;padding:0!important}.tab-content{padding:16px 20px 20px;flex:1}.form-row{display:block;margin-bottom:12px}.form-grid{display:grid;gap:12px}.section-help{display:inline-flex;align-items:center;gap:8px;color:var(--md-sys-color-on-surface-variant);font-size:12px}.section-help__label{font-weight:500}.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}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.grid-2-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.grid-2-cols--compact{gap:12px}.w-100{width:100%}.visual-builder-content{padding:0!important;height:100%;overflow:hidden;display:flex;flex-direction:column}.visual-builder-content>praxis-visual-builder{flex:1;min-height:0}.json-field{width:100%}.presentation-layout{display:flex;gap:20px;align-items:flex-start}.presentation-controls{flex:1 1 60%;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 18px}.control{display:flex;flex-direction:column}.control-span{grid-column:1/-1}.block-status{grid-column:1/-1;display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--md-sys-color-primary-container) 35%,transparent);color:var(--md-sys-color-on-surface);font-size:12px;line-height:1.45}.block-status strong{min-width:112px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant)}.block-status--implicit{background:color-mix(in srgb,var(--md-sys-color-surface-variant) 42%,transparent);border:1px dashed var(--md-sys-color-outline)}.block-status--readonly{margin-bottom:12px}.block-status code{font-family:var(--md-ref-typeface-mono, \"Courier New\", monospace);font-size:11px}.control__label{font-size:12px;color:var(--md-sys-color-on-surface-variant);margin-bottom:6px}.toggle-group{width:100%}.control--inline{grid-column:1/-1;display:flex;gap:16px;align-items:center}.presentation-preview{flex:0 0 360px;position:sticky;top:16px}.preview-card{border:1px solid var(--md-sys-color-outline);border-radius:12px;padding:14px;background:var(--md-sys-color-surface-container)}.preview-row{display:flex;gap:8px;padding:6px 0;border-bottom:1px dashed var(--md-sys-color-outline-variant)}.preview-row:last-child{border-bottom:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.presentation-preview .praxis-presentation__label{color:var(--md-sys-color-on-surface-variant)}.presentation-preview .praxis-presentation__value{color:var(--md-sys-color-on-surface)}.presentation-preview .presentation-mode.pres-density-cozy .preview-row{padding:6px 0}.presentation-preview .presentation-mode.pres-density-compact .preview-row,.presentation-preview .presentation-mode.pres-compact .preview-row{padding:2px 0}.presentation-preview .presentation-mode.pres-label-left .preview-row{display:grid;grid-template-columns:var(--pfx-pres-label-width, 140px) 1fr;align-items:baseline;column-gap:10px}.presentation-preview .presentation-mode.pres-label-left .praxis-presentation__label{margin:0;text-align:var(--pfx-pres-label-align, start)}.presentation-preview .presentation-mode .praxis-presentation__value{text-align:var(--pfx-pres-value-align, start)}.presentation-preview h4{margin:0 0 8px;color:var(--md-sys-color-on-surface);font-size:1rem}.section-card{border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);box-shadow:var(--md-sys-elevation-level1, none)}.section-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.tab-content--dense{padding:12px 16px 16px}.tab-content--dense .section-header,.tab-content--dense .form-row{margin-bottom:8px}.section-header h3{margin:0;font-size:1.05rem;color:var(--md-sys-color-on-surface)}.text-caption{margin:6px 0 0;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.section-header--compact{margin-bottom:8px}.section-body{display:block}.section-body--flex{flex:1;min-height:0;display:flex;flex-direction:column}.builder-header{padding:12px 16px;border-bottom:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}.builder-header h3{margin:0;font-size:1rem;color:var(--md-sys-color-on-surface)}.hint{margin:8px 0 0;padding:10px 12px;border-radius:10px;border:1px dashed var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container);color:var(--md-sys-color-on-surface-variant)}.meta-card{display:grid;gap:6px;padding:10px 12px;border-radius:10px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface)}.meta-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.9rem;color:var(--md-sys-color-on-surface-variant)}.meta-row strong{color:var(--md-sys-color-on-surface);font-weight:600}.runtime-contract-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.runtime-contract-field{display:grid;gap:6px;padding:12px;border-radius:10px;border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface)}.runtime-contract-label{font-size:12px;color:var(--md-sys-color-on-surface-variant)}.runtime-contract-code{display:block;font-family:var(--md-ref-typeface-mono, \"Courier New\", monospace);font-size:12px;line-height:1.45;color:var(--md-sys-color-on-surface);word-break:break-word;white-space:normal}\n"] }]
|
|
18508
18824
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
18509
18825
|
type: Inject,
|
|
18510
18826
|
args: [ASYNC_CONFIG_STORAGE]
|
|
18511
|
-
}] }, { type: FormConfigService }, { type:
|
|
18827
|
+
}] }, { type: FormConfigService }, { type: i7.SettingsPanelService }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
|
|
18512
18828
|
type: Optional
|
|
18513
18829
|
}, {
|
|
18514
18830
|
type: Inject,
|
|
@@ -18652,8 +18968,8 @@ class PraxisFilterForm {
|
|
|
18652
18968
|
const fields = this.config.fieldMetadata || [];
|
|
18653
18969
|
const previous = this.form.getRawValue?.() || {};
|
|
18654
18970
|
this.form = this.dynamicForm.createFormGroupFromMetadata(fields);
|
|
18655
|
-
// Preserve previous values
|
|
18656
|
-
this.form.patchValue(previous);
|
|
18971
|
+
// Preserve previous values only for fields that did not declare a new explicit seed.
|
|
18972
|
+
this.form.patchValue(this.buildRestorableValues(fields, previous));
|
|
18657
18973
|
this.formReady.emit({ formGroup: this.form });
|
|
18658
18974
|
// Emitir estado inicial de validade e assinar mudanças
|
|
18659
18975
|
this.validityChange.emit(this.form.valid);
|
|
@@ -18664,6 +18980,24 @@ class PraxisFilterForm {
|
|
|
18664
18980
|
this.valueChange.emit({ formData: val || {} });
|
|
18665
18981
|
});
|
|
18666
18982
|
}
|
|
18983
|
+
buildRestorableValues(fields, previous) {
|
|
18984
|
+
return fields.reduce((acc, field) => {
|
|
18985
|
+
if (!this.form.contains(field.name)) {
|
|
18986
|
+
return acc;
|
|
18987
|
+
}
|
|
18988
|
+
if (this.hasExplicitDefaultValue(field)) {
|
|
18989
|
+
return acc;
|
|
18990
|
+
}
|
|
18991
|
+
if (!(field.name in previous)) {
|
|
18992
|
+
return acc;
|
|
18993
|
+
}
|
|
18994
|
+
acc[field.name] = previous[field.name];
|
|
18995
|
+
return acc;
|
|
18996
|
+
}, {});
|
|
18997
|
+
}
|
|
18998
|
+
hasExplicitDefaultValue(field) {
|
|
18999
|
+
return Object.prototype.hasOwnProperty.call(field, 'defaultValue');
|
|
19000
|
+
}
|
|
18667
19001
|
onFormSubmit() {
|
|
18668
19002
|
this.submit.emit({ formData: this.form.getRawValue() });
|
|
18669
19003
|
}
|
|
@@ -18855,70 +19189,76 @@ const PRAXIS_DYNAMIC_FORM_COMPONENT_METADATA = {
|
|
|
18855
19189
|
// issues in some bundlers (ensures the symbol is initialized when registered)
|
|
18856
19190
|
component: undefined,
|
|
18857
19191
|
friendlyName: 'Praxis Dynamic Form',
|
|
18858
|
-
description: '
|
|
19192
|
+
description: 'Formulario dinamico com layout por secoes/linhas/colunas e campos renderizados por metadados.',
|
|
18859
19193
|
icon: 'dynamic_form',
|
|
18860
19194
|
inputs: [
|
|
18861
19195
|
{ name: 'resourcePath', type: 'string', label: 'Recurso', description: 'Recurso base para CRUD/schemas' },
|
|
18862
19196
|
{ name: 'resourceId', type: 'string | number', label: 'ID do Registro', description: 'Identificador do registro' },
|
|
18863
19197
|
{ name: 'editorialContext', type: 'Record<string, unknown> | null', label: 'Contexto editorial', description: 'Contexto compartilhado usado para resolver bindings dos blocos editoriais hospedados no form' },
|
|
18864
|
-
{ name: 'mode', type: "'create' | 'edit' | 'view'", default: 'create', label: 'Modo', description: 'Modo do
|
|
19198
|
+
{ name: 'mode', type: "'create' | 'edit' | 'view'", default: 'create', label: 'Modo', description: 'Modo do formulario' },
|
|
18865
19199
|
{
|
|
18866
19200
|
name: 'config',
|
|
18867
19201
|
type: 'FormConfig',
|
|
18868
|
-
label: '
|
|
18869
|
-
description: '
|
|
19202
|
+
label: 'Configuracao',
|
|
19203
|
+
description: 'Configuracao completa do formulario (layout, metadados, acoes, regras e headers de secao com `sectionHeader` para icone/avatar dinamico e `headerActions` para acoes contextuais).',
|
|
18870
19204
|
},
|
|
18871
19205
|
{ name: 'schemaSource', type: "'resource' | 'filter'", default: 'resource', description: 'Fonte do schema de campos' },
|
|
18872
|
-
{ name: '
|
|
18873
|
-
{ name: '
|
|
18874
|
-
{ name: '
|
|
19206
|
+
{ name: 'schemaUrl', type: 'string | null', description: 'Schema canonico explicito publicado pelo backend (ex.: surfaces/capabilities)' },
|
|
19207
|
+
{ name: 'apiEndpointKey', type: 'ApiEndpoint | string | null', description: 'Endpoint canonico usado para resolver schemaUrl e submitUrl relativos em hosts destacados' },
|
|
19208
|
+
{ name: 'apiUrlEntry', type: 'ApiUrlEntry | null', description: 'Entrada de API ja resolvida para hosts destacados que nao herdam o provider de API_URL da rota atual' },
|
|
19209
|
+
{ name: 'submitUrl', type: 'string | null', description: 'URL canonica de submit publicada pelo backend para forms orientados a surface' },
|
|
19210
|
+
{ name: 'submitMethod', type: "'post' | 'put' | 'patch' | null", description: 'Metodo HTTP canonico do submit quando a surface publica operacao explicita' },
|
|
19211
|
+
{ name: 'responseSchemaUrl', type: 'string | null', description: 'Schema de resposta publicado pelo backend para inspecao diagnostica e follow-up de runtime' },
|
|
19212
|
+
{ name: 'enableCustomization', type: 'boolean', default: false, description: 'Habilita modo de customizacao do layout (canvas)' },
|
|
19213
|
+
{ name: 'formId', type: 'string', description: 'Chave para persistencia local da configuracao' },
|
|
19214
|
+
{ name: 'componentInstanceId', type: 'string', description: 'Identificador estavel para instancias multiplas do formulario' },
|
|
18875
19215
|
{ name: 'layout', type: 'FormLayout', description: 'Layout opcional em vez do gerado' },
|
|
18876
|
-
{ name: 'backConfig', type: 'BackConfig', description: '
|
|
18877
|
-
{ name: 'hooks', type: 'FormHooksLayout', description: '
|
|
18878
|
-
{ name: 'removeEmptyContainersOnSave', type: 'boolean', default: false, description: 'Remove containers vazios ao salvar
|
|
19216
|
+
{ name: 'backConfig', type: 'BackConfig', description: 'Configuracao de navegacao/voltar (host CRUD)' },
|
|
19217
|
+
{ name: 'hooks', type: 'FormHooksLayout', description: 'Declaracoes de hooks de ciclo de vida do formulario' },
|
|
19218
|
+
{ name: 'removeEmptyContainersOnSave', type: 'boolean', default: false, description: 'Remove containers vazios ao salvar configuracao' },
|
|
18879
19219
|
{ name: 'reactiveValidation', type: 'boolean | null', default: null, description: 'Ativa afterValidate reativo em valueChanges' },
|
|
18880
|
-
{ name: 'reactiveValidationDebounceMs', type: 'number | null', default: null, description: 'Debounce (ms) para
|
|
18881
|
-
{ name: 'notifyIfOutdated', type: "'inline' | 'snackbar' | 'both' | 'none'", default: 'both', description: 'Canal de
|
|
18882
|
-
{ name: 'snoozeMs', type: 'number', default: '86400000', description: '
|
|
18883
|
-
{ name: 'autoOpenSettingsOnOutdated', type: 'boolean', default: false, description: 'Abre editor automaticamente quando schema
|
|
19220
|
+
{ name: 'reactiveValidationDebounceMs', type: 'number | null', default: null, description: 'Debounce (ms) para validacao reativa' },
|
|
19221
|
+
{ name: 'notifyIfOutdated', type: "'inline' | 'snackbar' | 'both' | 'none'", default: 'both', description: 'Canal de notificacao para schema desatualizado' },
|
|
19222
|
+
{ name: 'snoozeMs', type: 'number', default: '86400000', description: 'Duracao do snooze para alertas (ms)' },
|
|
19223
|
+
{ name: 'autoOpenSettingsOnOutdated', type: 'boolean', default: false, description: 'Abre editor automaticamente quando schema esta desatualizado' },
|
|
18884
19224
|
{ name: 'readonlyModeGlobal', type: 'boolean | null', description: 'Trava global para campos em modo somente-leitura' },
|
|
18885
19225
|
{ name: 'disabledModeGlobal', type: 'boolean | null', description: 'Trava global para desabilitar campos' },
|
|
18886
|
-
{ name: 'presentationModeGlobal', type: 'boolean | null', description: 'Modo de
|
|
19226
|
+
{ name: 'presentationModeGlobal', type: 'boolean | null', description: 'Modo de apresentacao (sem edicao)' },
|
|
18887
19227
|
{ name: 'visibleGlobal', type: 'boolean | null', description: 'Visibilidade global' },
|
|
18888
|
-
{ name: 'customEndpoints', type: 'EndpointConfig', description: 'Endpoints customizados para
|
|
19228
|
+
{ name: 'customEndpoints', type: 'EndpointConfig', description: 'Endpoints customizados para operacoes CRUD' },
|
|
18889
19229
|
],
|
|
18890
19230
|
outputs: [
|
|
18891
|
-
{ name: 'formSubmit', type: 'FormSubmitEvent', label: 'Submit', description: 'Emite ao submeter o
|
|
19231
|
+
{ name: 'formSubmit', type: 'FormSubmitEvent', label: 'Submit', description: 'Emite ao submeter o formulario' },
|
|
18892
19232
|
{ name: 'formCancel', type: 'void', description: 'Emite ao cancelar' },
|
|
18893
19233
|
{ name: 'formReset', type: 'void', description: 'Emite ao resetar' },
|
|
18894
|
-
{ name: 'configChange', type: 'FormConfig', label: '
|
|
18895
|
-
{ name: 'formReady', type: 'FormReadyEvent', label: 'Form pronto', description: 'Emite quando o
|
|
19234
|
+
{ name: 'configChange', type: 'FormConfig', label: 'Configuracao alterada', description: 'Emite quando a configuracao do formulario muda' },
|
|
19235
|
+
{ name: 'formReady', type: 'FormReadyEvent', label: 'Form pronto', description: 'Emite quando o formulario esta pronto' },
|
|
18896
19236
|
{ name: 'valueChange', type: 'FormValueChangeEvent', label: 'Valor alterado', description: 'Emite quando valores mudam' },
|
|
18897
|
-
{ name: 'syncCompleted', type: 'SyncResult', description: 'Emite quando a
|
|
18898
|
-
{ name: 'initializationError', type: 'FormInitializationError', description: 'Emite erro de
|
|
18899
|
-
{ name: 'enableCustomizationChange', type: 'boolean', label: '
|
|
18900
|
-
{ name: 'customAction', type: 'FormCustomActionEvent', description: 'Emite quando uma
|
|
18901
|
-
{ name: 'actionConfirmation', type: 'FormActionConfirmationEvent', description: 'Resultado de
|
|
19237
|
+
{ name: 'syncCompleted', type: 'SyncResult', description: 'Emite quando a sincronizacao com metadados do servidor completa' },
|
|
19238
|
+
{ name: 'initializationError', type: 'FormInitializationError', description: 'Emite erro de inicializacao com contexto' },
|
|
19239
|
+
{ name: 'enableCustomizationChange', type: 'boolean', label: 'Customizacao (toggle)', description: 'Emite quando o modo de customizacao de layout muda' },
|
|
19240
|
+
{ name: 'customAction', type: 'FormCustomActionEvent', description: 'Emite quando uma acao customizada e executada' },
|
|
19241
|
+
{ name: 'actionConfirmation', type: 'FormActionConfirmationEvent', description: 'Resultado de confirmacoes de acoes' },
|
|
18902
19242
|
{ name: 'schemaStatusChange', type: '{ outdated: boolean; serverHash?: string; lastVerifiedAt?: string; formId?: string }', description: 'Emite quando o status do schema muda' },
|
|
18903
|
-
{ name: 'widgetEvent', type: '{ placement: "before" | "beforeActions" | "after"; sourceId: string; output?: string; payload?: any }', label: 'Evento editorial', description: 'Reemite eventos dos widgets editoriais hospedados antes, antes das
|
|
19243
|
+
{ name: 'widgetEvent', type: '{ placement: "before" | "beforeActions" | "after"; sourceId: string; output?: string; payload?: any }', label: 'Evento editorial', description: 'Reemite eventos dos widgets editoriais hospedados antes, antes das acoes ou depois do formulario' },
|
|
18904
19244
|
],
|
|
18905
19245
|
actions: [
|
|
18906
19246
|
{
|
|
18907
19247
|
id: 'submit',
|
|
18908
19248
|
label: 'Enviar',
|
|
18909
19249
|
icon: 'send',
|
|
18910
|
-
description: 'Emite evento ao submeter o
|
|
19250
|
+
description: 'Emite evento ao submeter o formulario',
|
|
18911
19251
|
emit: 'formSubmit',
|
|
18912
19252
|
payloadSchema: {
|
|
18913
19253
|
type: 'object',
|
|
18914
19254
|
properties: {
|
|
18915
19255
|
stage: { type: 'string', description: 'Etapa do submit' },
|
|
18916
|
-
formData: { type: 'object', description: 'Dados do
|
|
18917
|
-
isValid: { type: 'boolean', description: 'Validade do
|
|
18918
|
-
operation: { type: 'string', description: '
|
|
19256
|
+
formData: { type: 'object', description: 'Dados do formulario' },
|
|
19257
|
+
isValid: { type: 'boolean', description: 'Validade do formulario' },
|
|
19258
|
+
operation: { type: 'string', description: 'Operacao executada (create, update ou patch)' },
|
|
18919
19259
|
},
|
|
18920
19260
|
required: ['stage', 'formData', 'isValid', 'operation'],
|
|
18921
|
-
example: { stage: 'after', formData: {}, isValid: true, operation: '
|
|
19261
|
+
example: { stage: 'after', formData: {}, isValid: true, operation: 'patch' },
|
|
18922
19262
|
},
|
|
18923
19263
|
scope: 'toolbar',
|
|
18924
19264
|
},
|
|
@@ -18926,7 +19266,7 @@ const PRAXIS_DYNAMIC_FORM_COMPONENT_METADATA = {
|
|
|
18926
19266
|
id: 'cancel',
|
|
18927
19267
|
label: 'Cancelar',
|
|
18928
19268
|
icon: 'close',
|
|
18929
|
-
description: 'Emite evento ao cancelar o
|
|
19269
|
+
description: 'Emite evento ao cancelar o formulario',
|
|
18930
19270
|
emit: 'formCancel',
|
|
18931
19271
|
scope: 'toolbar',
|
|
18932
19272
|
},
|
|
@@ -18934,24 +19274,24 @@ const PRAXIS_DYNAMIC_FORM_COMPONENT_METADATA = {
|
|
|
18934
19274
|
id: 'reset',
|
|
18935
19275
|
label: 'Limpar',
|
|
18936
19276
|
icon: 'restart_alt',
|
|
18937
|
-
description: 'Emite evento ao resetar o
|
|
19277
|
+
description: 'Emite evento ao resetar o formulario',
|
|
18938
19278
|
emit: 'formReset',
|
|
18939
19279
|
scope: 'toolbar',
|
|
18940
19280
|
},
|
|
18941
19281
|
{
|
|
18942
19282
|
id: 'custom-action',
|
|
18943
|
-
label: '
|
|
19283
|
+
label: 'Acao customizada',
|
|
18944
19284
|
icon: 'bolt',
|
|
18945
|
-
description: 'Emite evento de
|
|
19285
|
+
description: 'Emite evento de acao customizada',
|
|
18946
19286
|
emit: 'customAction',
|
|
18947
19287
|
payloadSchema: {
|
|
18948
19288
|
type: 'object',
|
|
18949
19289
|
properties: {
|
|
18950
|
-
actionId: { type: 'string', description: 'ID da
|
|
18951
|
-
formData: { type: 'object', description: 'Dados do
|
|
18952
|
-
isValid: { type: 'boolean', description: 'Validade do
|
|
18953
|
-
source: { type: 'string', description: 'Origem da
|
|
18954
|
-
sectionId: { type: 'string', description: 'ID da
|
|
19290
|
+
actionId: { type: 'string', description: 'ID da acao customizada' },
|
|
19291
|
+
formData: { type: 'object', description: 'Dados do formulario' },
|
|
19292
|
+
isValid: { type: 'boolean', description: 'Validade do formulario' },
|
|
19293
|
+
source: { type: 'string', description: 'Origem da acao' },
|
|
19294
|
+
sectionId: { type: 'string', description: 'ID da secao quando a acao veio do header de uma secao' },
|
|
18955
19295
|
},
|
|
18956
19296
|
required: ['actionId', 'formData', 'isValid', 'source'],
|
|
18957
19297
|
example: { actionId: 'help', formData: {}, isValid: true, source: 'section-header', sectionId: 'identification' },
|
|
@@ -19041,12 +19381,12 @@ const SECTION_EDITOR_I18N_CONFIG = {
|
|
|
19041
19381
|
namespaces: {
|
|
19042
19382
|
[SECTION_EDITOR_I18N_NAMESPACE]: {
|
|
19043
19383
|
'pt-BR': {
|
|
19044
|
-
'dynamicForm.sectionEditor.tabs.header': '
|
|
19384
|
+
'dynamicForm.sectionEditor.tabs.header': 'Cabeçalho',
|
|
19045
19385
|
'dynamicForm.sectionEditor.tabs.avatar': 'Avatar',
|
|
19046
|
-
'dynamicForm.sectionEditor.tabs.organization': '
|
|
19047
|
-
'dynamicForm.sectionEditor.header.tip.identity': 'Configure
|
|
19048
|
-
'dynamicForm.sectionEditor.header.tip.modes': 'O
|
|
19049
|
-
'dynamicForm.sectionEditor.header.tip.emptyState': 'Em fluxos de
|
|
19386
|
+
'dynamicForm.sectionEditor.tabs.organization': 'Organização',
|
|
19387
|
+
'dynamicForm.sectionEditor.header.tip.identity': 'Configure título, descrição e a identidade visual exibida no topo da seção.',
|
|
19388
|
+
'dynamicForm.sectionEditor.header.tip.modes': 'O cabeçalho pode usar ícone estático, foto vinda de um campo do formulário ou iniciais derivadas de um campo textual.',
|
|
19389
|
+
'dynamicForm.sectionEditor.header.tip.emptyState': 'Em fluxos de inclusão, defina o comportamento de vazio para evitar um cabeçalho sem referência visual antes do preenchimento.',
|
|
19050
19390
|
'dynamicForm.sectionEditor.header.presets.title': 'Presets rápidos',
|
|
19051
19391
|
'dynamicForm.sectionEditor.header.presets.default': 'Padrão',
|
|
19052
19392
|
'dynamicForm.sectionEditor.header.presets.simple': 'Simples',
|
|
@@ -19057,12 +19397,12 @@ const SECTION_EDITOR_I18N_CONFIG = {
|
|
|
19057
19397
|
'dynamicForm.sectionEditor.header.fields.titleColor': 'Cor do título',
|
|
19058
19398
|
'dynamicForm.sectionEditor.header.fields.descriptionColor': 'Cor da descrição',
|
|
19059
19399
|
'dynamicForm.sectionEditor.header.fields.customColor': 'Cor personalizada (CSS)',
|
|
19060
|
-
'dynamicForm.sectionEditor.header.fields.titleGapBottom': '
|
|
19061
|
-
'dynamicForm.sectionEditor.header.fields.descriptionGapBottom': '
|
|
19062
|
-
'dynamicForm.sectionEditor.header.fields.gapBottom': '
|
|
19400
|
+
'dynamicForm.sectionEditor.header.fields.titleGapBottom': 'Espaço abaixo do título (px)',
|
|
19401
|
+
'dynamicForm.sectionEditor.header.fields.descriptionGapBottom': 'Espaço abaixo da descrição (px)',
|
|
19402
|
+
'dynamicForm.sectionEditor.header.fields.gapBottom': 'Espaço abaixo da seção (px)',
|
|
19063
19403
|
'dynamicForm.sectionEditor.header.fields.collapsible': 'Colapsável',
|
|
19064
19404
|
'dynamicForm.sectionEditor.header.fields.collapsed': 'Iniciar recolhida',
|
|
19065
|
-
'dynamicForm.sectionEditor.header.fields.headerTooltip': 'Tooltip do cabeçalho',
|
|
19405
|
+
'dynamicForm.sectionEditor.header.fields.headerTooltip': 'Dica (Tooltip) do cabeçalho',
|
|
19066
19406
|
'dynamicForm.sectionEditor.header.placeholders.description': 'Resumo curto do conteúdo da seção',
|
|
19067
19407
|
'dynamicForm.sectionEditor.header.placeholders.customColor': 'ex.: #3366ff ou rgb(...)',
|
|
19068
19408
|
'dynamicForm.sectionEditor.header.placeholders.headerTooltip': 'Dica ao passar o mouse no título',
|
|
@@ -19073,7 +19413,7 @@ const SECTION_EDITOR_I18N_CONFIG = {
|
|
|
19073
19413
|
'dynamicForm.sectionEditor.header.options.descriptionColor.primary': 'Primária',
|
|
19074
19414
|
'dynamicForm.sectionEditor.header.options.descriptionColor.secondary': 'Secundária',
|
|
19075
19415
|
'headerActions.title': 'Ações do cabeçalho',
|
|
19076
|
-
'headerActions.description': 'Adicione ícones acionáveis no canto direito do cabeçalho da seção para
|
|
19416
|
+
'headerActions.description': 'Adicione ícones acionáveis no canto direito do cabeçalho da seção para recursos contextuais como ajuda, atualização ou detalhamento (drill-down).',
|
|
19077
19417
|
'headerActions.add': 'Adicionar ação',
|
|
19078
19418
|
'headerActions.empty': 'Nenhuma ação configurada para este cabeçalho.',
|
|
19079
19419
|
'headerActions.item': 'Ação {{index}}',
|
|
@@ -19085,80 +19425,80 @@ const SECTION_EDITOR_I18N_CONFIG = {
|
|
|
19085
19425
|
'headerActions.sections.behavior': 'Comportamento',
|
|
19086
19426
|
'headerActions.sections.behaviorDescription': 'Escolha se a ação é livre ou vinculada ao catálogo global do app e configure o que será emitido.',
|
|
19087
19427
|
'headerActions.sections.state': 'Estado',
|
|
19088
|
-
'headerActions.sections.stateDescription': 'Controle visibilidade, indisponibilidade e estado de
|
|
19428
|
+
'headerActions.sections.stateDescription': 'Controle visibilidade, indisponibilidade e estado de carregamento sem remover a ação do contrato.',
|
|
19089
19429
|
'headerActions.sections.appearanceAdvanced': 'Aparência avançada',
|
|
19090
|
-
'headerActions.sections.appearanceAdvancedDescription': 'Use apenas quando precisar refinar a apresentação do botão no
|
|
19430
|
+
'headerActions.sections.appearanceAdvancedDescription': 'Use apenas quando precisar refinar a apresentação do botão no cabeçalho com cor, classe ou estilos adicionais.',
|
|
19091
19431
|
'headerActions.callout.globalTitle': 'Ação global do app',
|
|
19092
19432
|
'headerActions.preview.title': 'Prévia',
|
|
19093
19433
|
'headerActions.preview.defaultLabel': 'Prévia da ação',
|
|
19094
|
-
'headerActions.preview.labelFallback': '
|
|
19434
|
+
'headerActions.preview.labelFallback': 'Rótulo acessível da ação',
|
|
19095
19435
|
'headerActions.preview.caption': 'A prévia reflete cor e estilos extras do botão iconográfico.',
|
|
19096
19436
|
'headerActions.presets.title': 'Presets visuais',
|
|
19097
19437
|
'headerActions.presets.default': 'Padrão',
|
|
19098
|
-
'headerActions.presets.softPill': 'Pill
|
|
19099
|
-
'headerActions.presets.primaryPill': 'Pill
|
|
19100
|
-
'headerActions.presets.criticalPill': 'Pill
|
|
19438
|
+
'headerActions.presets.softPill': 'Pílula (Pill) discreta',
|
|
19439
|
+
'headerActions.presets.primaryPill': 'Pílula (Pill) primária',
|
|
19440
|
+
'headerActions.presets.criticalPill': 'Pílula (Pill) crítica',
|
|
19101
19441
|
'headerActions.fields.id': 'ID',
|
|
19102
|
-
'headerActions.fields.label': '
|
|
19442
|
+
'headerActions.fields.label': 'Rótulo acessível',
|
|
19103
19443
|
'headerActions.fields.icon': 'Ícone',
|
|
19104
19444
|
'headerActions.actions.pickIcon': 'Escolher ícone da ação',
|
|
19105
19445
|
'headerActions.actions.clearIcon': 'Limpar ícone da ação',
|
|
19106
19446
|
'headerActions.actions.iconHelp': 'Use Material Symbols ou ícones Praxis já registrados no host.',
|
|
19107
19447
|
'headerActions.fields.action': 'Ação',
|
|
19108
|
-
'headerActions.fields.customAction': '
|
|
19448
|
+
'headerActions.fields.customAction': 'Ação customizada',
|
|
19109
19449
|
'headerActions.fields.actionParam': 'Parâmetro',
|
|
19110
|
-
'headerActions.fields.tooltip': 'Tooltip',
|
|
19450
|
+
'headerActions.fields.tooltip': 'Dica (Tooltip)',
|
|
19111
19451
|
'headerActions.fields.color': 'Cor',
|
|
19112
19452
|
'headerActions.fields.color.default': 'Padrão',
|
|
19113
|
-
'headerActions.fields.color.basic': '
|
|
19453
|
+
'headerActions.fields.color.basic': 'Básica',
|
|
19114
19454
|
'headerActions.fields.color.primary': 'Primária',
|
|
19115
|
-
'headerActions.fields.color.accent': 'Accent',
|
|
19116
|
-
'headerActions.fields.color.warn': 'Warn',
|
|
19455
|
+
'headerActions.fields.color.accent': 'Destaque (Accent)',
|
|
19456
|
+
'headerActions.fields.color.warn': 'Aviso (Warn)',
|
|
19117
19457
|
'headerActions.fields.visible': 'Visível',
|
|
19118
19458
|
'headerActions.fields.disabled': 'Desabilitada',
|
|
19119
|
-
'headerActions.fields.loading': 'Loading',
|
|
19459
|
+
'headerActions.fields.loading': 'Carregando (Loading)',
|
|
19120
19460
|
'headerActions.fields.className': 'Classe CSS',
|
|
19121
19461
|
'headerActions.fields.style': 'Estilo (JSON)',
|
|
19122
19462
|
'headerActions.validation.invalidJson': 'JSON inválido.',
|
|
19123
19463
|
'headerActions.validation.objectJson': 'Informe um objeto JSON válido.',
|
|
19124
|
-
'headerActions.placeholders.id': 'ex.:
|
|
19464
|
+
'headerActions.placeholders.id': 'ex.: ajuda',
|
|
19125
19465
|
'headerActions.placeholders.label': 'ex.: Ajuda da seção',
|
|
19126
19466
|
'headerActions.placeholders.icon': 'ex.: help_outline',
|
|
19127
19467
|
'headerActions.placeholders.action': 'Opcional. Se vazio, usa o ID',
|
|
19128
19468
|
'headerActions.options.action.custom': 'Customizada',
|
|
19129
19469
|
'headerActions.options.action.globalGroup': 'Ações globais',
|
|
19130
|
-
'headerActions.help.actionResolver': 'Ações globais exigem executor no app (ActionResolver).
|
|
19470
|
+
'headerActions.help.actionResolver': 'Ações globais exigem um executor no app (ActionResolver). Ações customizadas só emitem evento neste output.',
|
|
19131
19471
|
'headerActions.hints.actionParam': 'Use JSON quando a ação global exigir payload estruturado.',
|
|
19132
19472
|
'headerActions.validation.parameterRequired': 'Parâmetro obrigatório.',
|
|
19133
|
-
'headerActions.placeholders.tooltip': 'Opcional. Se vazio, usa
|
|
19473
|
+
'headerActions.placeholders.tooltip': 'Opcional. Se vazio, usa o rótulo',
|
|
19134
19474
|
'headerActions.placeholders.className': 'ex.: section-help-action',
|
|
19135
19475
|
'headerActions.placeholders.style': '{"marginLeft":"4px"}',
|
|
19136
|
-
'dynamicForm.sectionEditor.header.fields.baseIcon': '
|
|
19137
|
-
'dynamicForm.sectionEditor.header.fields.titleStyle': 'Fonte do
|
|
19138
|
-
'dynamicForm.sectionEditor.header.fields.descriptionStyle': 'Fonte da
|
|
19139
|
-
'dynamicForm.sectionEditor.header.fields.stepLabel': '
|
|
19140
|
-
'dynamicForm.sectionEditor.header.fields.headerAlign': 'Alinhamento do
|
|
19476
|
+
'dynamicForm.sectionEditor.header.fields.baseIcon': 'Ícone base da seção',
|
|
19477
|
+
'dynamicForm.sectionEditor.header.fields.titleStyle': 'Fonte do título',
|
|
19478
|
+
'dynamicForm.sectionEditor.header.fields.descriptionStyle': 'Fonte da descrição',
|
|
19479
|
+
'dynamicForm.sectionEditor.header.fields.stepLabel': 'Rótulo do passo',
|
|
19480
|
+
'dynamicForm.sectionEditor.header.fields.headerAlign': 'Alinhamento do cabeçalho',
|
|
19141
19481
|
'dynamicForm.sectionEditor.header.fields.className': 'Classe CSS',
|
|
19142
|
-
'dynamicForm.sectionEditor.header.fields.testId': '
|
|
19482
|
+
'dynamicForm.sectionEditor.header.fields.testId': 'ID de Teste',
|
|
19143
19483
|
'dynamicForm.sectionEditor.header.placeholders.baseIcon': 'ex.: info, settings, person',
|
|
19144
|
-
'dynamicForm.sectionEditor.header.actions.pickIcon': 'Escolher
|
|
19145
|
-
'dynamicForm.sectionEditor.header.actions.clearIcon': 'Limpar
|
|
19146
|
-
'dynamicForm.sectionEditor.header.actions.iconHelp': 'Material Icons (
|
|
19147
|
-
'dynamicForm.sectionEditor.header.options.appearance.card': 'Card',
|
|
19148
|
-
'dynamicForm.sectionEditor.header.options.appearance.plain': 'Plain',
|
|
19149
|
-
'dynamicForm.sectionEditor.header.options.appearance.step': 'Step',
|
|
19150
|
-
'dynamicForm.sectionEditor.header.options.titleStyle.titleLarge': '
|
|
19151
|
-
'dynamicForm.sectionEditor.header.options.titleStyle.titleMedium': '
|
|
19152
|
-
'dynamicForm.sectionEditor.header.options.titleStyle.titleSmall': '
|
|
19484
|
+
'dynamicForm.sectionEditor.header.actions.pickIcon': 'Escolher ícone',
|
|
19485
|
+
'dynamicForm.sectionEditor.header.actions.clearIcon': 'Limpar ícone',
|
|
19486
|
+
'dynamicForm.sectionEditor.header.actions.iconHelp': 'Material Icons (ligaduras)',
|
|
19487
|
+
'dynamicForm.sectionEditor.header.options.appearance.card': 'Cartão (Card)',
|
|
19488
|
+
'dynamicForm.sectionEditor.header.options.appearance.plain': 'Simples (Plain)',
|
|
19489
|
+
'dynamicForm.sectionEditor.header.options.appearance.step': 'Passo (Step)',
|
|
19490
|
+
'dynamicForm.sectionEditor.header.options.titleStyle.titleLarge': 'Título grande',
|
|
19491
|
+
'dynamicForm.sectionEditor.header.options.titleStyle.titleMedium': 'Título médio',
|
|
19492
|
+
'dynamicForm.sectionEditor.header.options.titleStyle.titleSmall': 'Título pequeno',
|
|
19153
19493
|
'dynamicForm.sectionEditor.header.options.titleStyle.headlineSmall': 'Headline',
|
|
19154
19494
|
'dynamicForm.sectionEditor.header.options.descriptionStyle.bodyLarge': 'Corpo grande',
|
|
19155
|
-
'dynamicForm.sectionEditor.header.options.descriptionStyle.bodyMedium': 'Corpo
|
|
19495
|
+
'dynamicForm.sectionEditor.header.options.descriptionStyle.bodyMedium': 'Corpo médio',
|
|
19156
19496
|
'dynamicForm.sectionEditor.header.options.descriptionStyle.bodySmall': 'Corpo pequeno',
|
|
19157
19497
|
'dynamicForm.sectionEditor.header.options.headerAlign.start': 'Esquerda',
|
|
19158
19498
|
'dynamicForm.sectionEditor.header.options.headerAlign.center': 'Centro',
|
|
19159
|
-
'dynamicForm.sectionEditor.header.options.titleColor.surfaceVariant': '
|
|
19160
|
-
'dynamicForm.sectionEditor.header.options.descriptionColor.onSurface': '
|
|
19161
|
-
'dynamicForm.sectionEditor.organization.tip': 'Controle ordem e visibilidade
|
|
19499
|
+
'dynamicForm.sectionEditor.header.options.titleColor.surfaceVariant': 'Variação na superfície',
|
|
19500
|
+
'dynamicForm.sectionEditor.header.options.descriptionColor.onSurface': 'Na superfície',
|
|
19501
|
+
'dynamicForm.sectionEditor.organization.tip': 'Controle a ordem e visibilidade básica da seção.',
|
|
19162
19502
|
'dynamicForm.sectionEditor.organization.fields.order': 'Ordem',
|
|
19163
19503
|
'dynamicForm.sectionEditor.organization.fields.hidden': 'Ocultar em {{bp}}',
|
|
19164
19504
|
},
|
|
@@ -20587,7 +20927,7 @@ class SectionEditorComponent {
|
|
|
20587
20927
|
</mat-tab>
|
|
20588
20928
|
</mat-tab-group>
|
|
20589
20929
|
</div>
|
|
20590
|
-
`, isInline: true, styles: [".editor-container{padding:16px}.preset-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}.preset-title{font-weight:600;color:var(--md-sys-color-on-surface-variant)}.bp-group{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.inline-section-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}.inline-section-title{font-size:14px;font-weight:700;color:var(--md-sys-color-on-surface)}.inline-section-description{margin:4px 0 0;font-size:12px;line-height:1.5;color:var(--md-sys-color-on-surface-variant);max-width:72ch}.empty-inline-state{margin:0;font-size:12px;color:var(--md-sys-color-on-surface-variant)}.header-actions-list{display:flex;flex-direction:column;gap:12px}.header-action-card{border:1px solid var(--md-sys-color-outline-variant);border-radius:14px;padding:12px;background:color-mix(in srgb,var(--md-sys-color-surface-container-low) 82%,white 18%)}.header-action-section{display:flex;flex-direction:column;gap:4px}.header-action-section-title{font-size:12px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant)}.header-action-section-description{margin:0;font-size:12px;line-height:1.5;color:var(--md-sys-color-on-surface-variant)}.header-action-section-description.advanced{margin:0 0 10px}.header-action-callout{border-radius:10px;padding:10px 12px;background:color-mix(in srgb,var(--md-sys-color-primary) 8%,white);border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 14%,transparent)}.header-action-callout-title{font-size:12px;font-weight:700;margin:0 0 4px;color:var(--md-sys-color-on-surface)}.header-action-callout-text{margin:0;font-size:12px;line-height:1.5;color:var(--md-sys-color-on-surface-variant)}.header-action-preview{border-radius:10px;padding:10px 12px;background:var(--md-sys-color-surface-container-lowest);border:1px solid var(--md-sys-color-outline-variant);margin-bottom:12px}.header-action-preview-title{font-size:12px;font-weight:700;margin-bottom:8px;color:var(--md-sys-color-on-surface-variant)}.header-action-preview-body{display:flex;align-items:center;gap:12px}.header-action-preview-button{border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 70%,transparent);background:var(--md-sys-color-surface-container)}.header-action-preview-meta{display:flex;flex-direction:column;gap:4px}.header-action-preview-label{font-size:13px;font-weight:600;color:var(--md-sys-color-on-surface)}.header-action-preview-caption{font-size:12px;line-height:1.5;color:var(--md-sys-color-on-surface-variant)}.header-action-style-presets{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.header-action-style-presets-title{font-size:12px;font-weight:700;color:var(--md-sys-color-on-surface-variant)}.header-action-style-presets-buttons{display:flex;flex-wrap:wrap;gap:8px}.header-action-advanced{border-top:1px dashed var(--md-sys-color-outline-variant);padding-top:12px}.header-action-advanced summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--md-sys-color-on-surface);list-style:none}.header-action-advanced summary::-webkit-details-marker{display:none}.header-action-advanced summary:before{content:\"\\25b8\";display:inline-block;margin-right:8px;color:var(--md-sys-color-on-surface-variant)}.header-action-advanced[open] summary:before{content:\"\\25be\"}.header-action-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.header-action-title{font-size:13px;font-weight:700;color:var(--md-sys-color-on-surface)}.header-action-toolbar-buttons{display:inline-flex;align-items:center;gap:4px}.stack{display:flex;flex-direction:column;gap:12px}.row-1{display:grid;gap:10px}.row-2,.row-3{display:grid;gap:10px;align-items:start}.row-2{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.row-3{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}mat-form-field{width:100%;margin-bottom:12px}.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;vertical-align:middle}.help-icon-button mat-icon{font-size:18px;line-height:18px;width:18px;height:18px}.avatar-guidance{border-radius:12px;padding:12px 14px;background:color-mix(in srgb,var(--md-sys-color-primary) 6%,white);border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 14%,transparent)}.avatar-guidance p{margin:0 0 6px;font-size:12px;line-height:1.5;color:var(--md-sys-color-on-surface-variant)}.avatar-guidance p:last-child{margin-bottom:0}.tips p{margin:0 0 6px;font-size:13px;color:var(--md-sys-color-on-surface-variant)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i7$2.MatTabContent, selector: "[matTabContent]" }, { kind: "component", type: i7$2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i7$2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: 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: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i11$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i6$4.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: i6$4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i6$4.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "component", type: SurfaceOpenActionEditorComponent, selector: "praxis-surface-open-action-editor", inputs: ["value", "hostKind"], outputs: ["valueChange"] }] });
|
|
20930
|
+
`, isInline: true, styles: [".editor-container{padding:16px}.preset-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}.preset-title{font-weight:600;color:var(--md-sys-color-on-surface-variant)}.bp-group{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.inline-section-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}.inline-section-title{font-size:14px;font-weight:700;color:var(--md-sys-color-on-surface)}.inline-section-description{margin:4px 0 0;font-size:12px;line-height:1.5;color:var(--md-sys-color-on-surface-variant);max-width:72ch}.empty-inline-state{margin:0;font-size:12px;color:var(--md-sys-color-on-surface-variant)}.header-actions-list{display:flex;flex-direction:column;gap:12px}.header-action-card{border:1px solid var(--md-sys-color-outline-variant);border-radius:14px;padding:12px;background:color-mix(in srgb,var(--md-sys-color-surface-container-low) 82%,white 18%)}.header-action-section{display:flex;flex-direction:column;gap:4px}.header-action-section-title{font-size:12px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant)}.header-action-section-description{margin:0;font-size:12px;line-height:1.5;color:var(--md-sys-color-on-surface-variant)}.header-action-section-description.advanced{margin:0 0 10px}.header-action-callout{border-radius:10px;padding:10px 12px;background:color-mix(in srgb,var(--md-sys-color-primary) 8%,white);border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 14%,transparent)}.header-action-callout-title{font-size:12px;font-weight:700;margin:0 0 4px;color:var(--md-sys-color-on-surface)}.header-action-callout-text{margin:0;font-size:12px;line-height:1.5;color:var(--md-sys-color-on-surface-variant)}.header-action-preview{border-radius:10px;padding:10px 12px;background:var(--md-sys-color-surface-container-lowest);border:1px solid var(--md-sys-color-outline-variant);margin-bottom:12px}.header-action-preview-title{font-size:12px;font-weight:700;margin-bottom:8px;color:var(--md-sys-color-on-surface-variant)}.header-action-preview-body{display:flex;align-items:center;gap:12px}.header-action-preview-button{border:1px solid color-mix(in srgb,var(--md-sys-color-outline-variant) 70%,transparent);background:var(--md-sys-color-surface-container)}.header-action-preview-meta{display:flex;flex-direction:column;gap:4px}.header-action-preview-label{font-size:13px;font-weight:600;color:var(--md-sys-color-on-surface)}.header-action-preview-caption{font-size:12px;line-height:1.5;color:var(--md-sys-color-on-surface-variant)}.header-action-style-presets{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.header-action-style-presets-title{font-size:12px;font-weight:700;color:var(--md-sys-color-on-surface-variant)}.header-action-style-presets-buttons{display:flex;flex-wrap:wrap;gap:8px}.header-action-advanced{border-top:1px dashed var(--md-sys-color-outline-variant);padding-top:12px}.header-action-advanced summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--md-sys-color-on-surface);list-style:none}.header-action-advanced summary::-webkit-details-marker{display:none}.header-action-advanced summary:before{content:\"\\25b8\";display:inline-block;margin-right:8px;color:var(--md-sys-color-on-surface-variant)}.header-action-advanced[open] summary:before{content:\"\\25be\"}.header-action-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.header-action-title{font-size:13px;font-weight:700;color:var(--md-sys-color-on-surface)}.header-action-toolbar-buttons{display:inline-flex;align-items:center;gap:4px}.stack{display:flex;flex-direction:column;gap:12px}.row-1{display:grid;gap:10px}.row-2,.row-3{display:grid;gap:10px;align-items:start}.row-2{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.row-3{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}mat-form-field{width:100%;margin-bottom:12px}.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;vertical-align:middle}.help-icon-button mat-icon{font-size:18px;line-height:18px;width:18px;height:18px}.avatar-guidance{border-radius:12px;padding:12px 14px;background:color-mix(in srgb,var(--md-sys-color-primary) 6%,white);border:1px solid color-mix(in srgb,var(--md-sys-color-primary) 14%,transparent)}.avatar-guidance p{margin:0 0 6px;font-size:12px;line-height:1.5;color:var(--md-sys-color-on-surface-variant)}.avatar-guidance p:last-child{margin-bottom:0}.tips p{margin:0 0 6px;font-size:13px;color:var(--md-sys-color-on-surface-variant)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7$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: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i7$3.MatTabContent, selector: "[matTabContent]" }, { kind: "component", type: i7$3.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i7$3.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: 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: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i11.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i6$3.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: i6$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i6$3.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "component", type: SurfaceOpenActionEditorComponent, selector: "praxis-surface-open-action-editor", inputs: ["value", "hostKind"], outputs: ["valueChange"] }] });
|
|
20591
20931
|
}
|
|
20592
20932
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: SectionEditorComponent, decorators: [{
|
|
20593
20933
|
type: Component,
|
|
@@ -21535,7 +21875,7 @@ class RowEditorComponent {
|
|
|
21535
21875
|
</mat-tab>
|
|
21536
21876
|
</mat-tab-group>
|
|
21537
21877
|
</div>
|
|
21538
|
-
`, isInline: true, styles: [":host{display:block;width:100%}.editor-container{padding:16px;width:100%}.header{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.state-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:10px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface);font-size:12px}.bp-group{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.preset-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}.preset-group{display:flex;flex-wrap:wrap;gap:6px}.preset-title,.preset-subtitle{font-weight:600;color:var(--md-sys-color-on-surface-variant)}mat-form-field{width:100%}.presets,.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.controls-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.hide-toggle{margin-left:8px}.hint{font-size:12px;color:var(--md-sys-color-on-surface-variant)}.advanced-form{display:grid;gap:12px}.row-editor-tabs{margin-top:6px;width:100%}:host ::ng-deep .row-editor-tabs .mat-mdc-tab-header{background:var(--md-sys-color-surface);border-bottom:1px solid var(--md-sys-color-outline-variant)}:host ::ng-deep .row-editor-tabs .mdc-tab__text-label{color:var(--md-sys-color-on-surface)}:host ::ng-deep .row-editor-tabs .mat-mdc-tab-body-wrapper{min-height:240px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i7$
|
|
21878
|
+
`, isInline: true, styles: [":host{display:block;width:100%}.editor-container{padding:16px;width:100%}.header{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.state-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:10px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface);font-size:12px}.bp-group{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.preset-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}.preset-group{display:flex;flex-wrap:wrap;gap:6px}.preset-title,.preset-subtitle{font-weight:600;color:var(--md-sys-color-on-surface-variant)}mat-form-field{width:100%}.presets,.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.controls-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.hide-toggle{margin-left:8px}.hint{font-size:12px;color:var(--md-sys-color-on-surface-variant)}.advanced-form{display:grid;gap:12px}.row-editor-tabs{margin-top:6px;width:100%}:host ::ng-deep .row-editor-tabs .mat-mdc-tab-header{background:var(--md-sys-color-surface);border-bottom:1px solid var(--md-sys-color-outline-variant)}:host ::ng-deep .row-editor-tabs .mdc-tab__text-label{color:var(--md-sys-color-on-surface)}:host ::ng-deep .row-editor-tabs .mat-mdc-tab-body-wrapper{min-height:240px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i7$3.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i7$3.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7$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: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: 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: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i7$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i7$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
|
|
21539
21879
|
}
|
|
21540
21880
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: RowEditorComponent, decorators: [{
|
|
21541
21881
|
type: Component,
|
|
@@ -22071,7 +22411,7 @@ class ColumnEditorComponent {
|
|
|
22071
22411
|
</mat-tab>
|
|
22072
22412
|
</mat-tab-group>
|
|
22073
22413
|
</div>
|
|
22074
|
-
`, isInline: true, styles: [".editor-container{padding:16px}.header{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}.state-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:10px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface);font-size:12px}.layout-form{display:flex;flex-direction:column;gap:12px}mat-tab-group{margin-top:6px}.preset-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.preset-group{display:flex;flex-wrap:wrap;gap:6px}.preset-title{font-weight:600;color:var(--md-sys-color-on-surface-variant)}.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.toolbar-title{font-weight:600;color:var(--md-sys-color-on-surface-variant)}.bp-toggle{display:inline-flex;gap:4px}.bp-toggle__btn{min-width:34px;height:30px;line-height:30px;padding:0 8px;text-transform:uppercase}.bp-toggle__btn.active{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.span-summary,.offset-summary{background:var(--md-sys-color-surface-variant);padding:4px 8px;border-radius:8px;font-size:12px}.hidden-pill{background:var(--md-sys-color-error-container);color:var(--md-sys-color-on-error-container);border:1px dashed var(--md-sys-color-error);padding:4px 8px;border-radius:8px;font-size:12px}.controls-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:start}.control-block{display:flex;flex-direction:column;gap:6px}.number-stepper{display:inline-flex;align-items:center;gap:4px}.number-stepper input{width:80px}.control-help{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--md-sys-color-on-surface-variant)}.control-help__label{font-weight:500}.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}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.hidden-toggle{justify-content:center}.copy-row{display:flex;gap:8px;flex-wrap:wrap}mat-form-field{width:100%}.fields-list{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.field-chip{padding:4px 8px;border-radius:10px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface);font-size:12px}.behavior-pane{display:flex;flex-direction:column;gap:12px}.visibility-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px}.style-form{display:grid;gap:12px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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: "ngmodule", type: MatSelectModule }, { kind: "component", type: i6$
|
|
22414
|
+
`, isInline: true, styles: [".editor-container{padding:16px}.header{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}.state-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:10px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface);font-size:12px}.layout-form{display:flex;flex-direction:column;gap:12px}mat-tab-group{margin-top:6px}.preset-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.preset-group{display:flex;flex-wrap:wrap;gap:6px}.preset-title{font-weight:600;color:var(--md-sys-color-on-surface-variant)}.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.toolbar-title{font-weight:600;color:var(--md-sys-color-on-surface-variant)}.bp-toggle{display:inline-flex;gap:4px}.bp-toggle__btn{min-width:34px;height:30px;line-height:30px;padding:0 8px;text-transform:uppercase}.bp-toggle__btn.active{background:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.span-summary,.offset-summary{background:var(--md-sys-color-surface-variant);padding:4px 8px;border-radius:8px;font-size:12px}.hidden-pill{background:var(--md-sys-color-error-container);color:var(--md-sys-color-on-error-container);border:1px dashed var(--md-sys-color-error);padding:4px 8px;border-radius:8px;font-size:12px}.controls-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-items:start}.control-block{display:flex;flex-direction:column;gap:6px}.number-stepper{display:inline-flex;align-items:center;gap:4px}.number-stepper input{width:80px}.control-help{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--md-sys-color-on-surface-variant)}.control-help__label{font-weight:500}.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}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.hidden-toggle{justify-content:center}.copy-row{display:flex;gap:8px;flex-wrap:wrap}mat-form-field{width:100%}.fields-list{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.field-chip{padding:4px 8px;border-radius:10px;background:var(--md-sys-color-surface-variant);color:var(--md-sys-color-on-surface);font-size:12px}.behavior-pane{display:flex;flex-direction:column;gap:12px}.visibility-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px}.style-form{display:grid;gap:12px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.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$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7$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: "ngmodule", type: MatSelectModule }, { kind: "component", type: i6$3.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: i6$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i7$3.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i7$3.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: 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: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
22075
22415
|
}
|
|
22076
22416
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: ColumnEditorComponent, decorators: [{
|
|
22077
22417
|
type: Component,
|
|
@@ -22383,6 +22723,37 @@ const FORM_COMPONENT_AI_CAPABILITIES = {
|
|
|
22383
22723
|
allowedValues: ENUMS.schemaSource,
|
|
22384
22724
|
description: 'Fonte de schema para construcao automatica (resource/filter).',
|
|
22385
22725
|
},
|
|
22726
|
+
{
|
|
22727
|
+
path: 'inputs.schemaUrl',
|
|
22728
|
+
category: 'inputs',
|
|
22729
|
+
valueKind: 'string',
|
|
22730
|
+
description: 'Schema canonico explicito publicado pelo backend para hosts que seguem surfaces/actions/capabilities.',
|
|
22731
|
+
},
|
|
22732
|
+
{
|
|
22733
|
+
path: 'inputs.apiEndpointKey',
|
|
22734
|
+
category: 'inputs',
|
|
22735
|
+
valueKind: 'string',
|
|
22736
|
+
description: 'Endpoint canonico usado para resolver schemaUrl e submitUrl relativos em hosts destacados.',
|
|
22737
|
+
},
|
|
22738
|
+
{
|
|
22739
|
+
path: 'inputs.submitUrl',
|
|
22740
|
+
category: 'inputs',
|
|
22741
|
+
valueKind: 'string',
|
|
22742
|
+
description: 'Endpoint canonico de submit publicado por surface/action.',
|
|
22743
|
+
},
|
|
22744
|
+
{
|
|
22745
|
+
path: 'inputs.submitMethod',
|
|
22746
|
+
category: 'inputs',
|
|
22747
|
+
valueKind: 'enum',
|
|
22748
|
+
allowedValues: ['post', 'put', 'patch'],
|
|
22749
|
+
description: 'Metodo HTTP canonico para o submit quando o backend publica operacao explicita.',
|
|
22750
|
+
},
|
|
22751
|
+
{
|
|
22752
|
+
path: 'inputs.responseSchemaUrl',
|
|
22753
|
+
category: 'inputs',
|
|
22754
|
+
valueKind: 'string',
|
|
22755
|
+
description: 'Schema de resposta publicado pelo backend para inspeção diagnostica/read-only do host.',
|
|
22756
|
+
},
|
|
22386
22757
|
{
|
|
22387
22758
|
path: 'inputs.enableCustomization',
|
|
22388
22759
|
category: 'inputs',
|