@quadrel-enterprise-ui/framework 20.27.3-beta.234.1 → 20.27.4

package/fesm2022/quadrel-enterprise-ui-framework.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, ElementRef, Directive, InjectionToken, HostBinding, Input, ViewEncapsulation, Component, Injectable, Injector, HostListener, ChangeDetectionStrategy, ChangeDetectorRef, ViewChild, NgModule, EventEmitter, Output, Renderer2, Pipe, ViewContainerRef, NO_ERRORS_SCHEMA, DestroyRef, SecurityContext, NgZone, ViewChildren, forwardRef, ContentChildren, ContentChild, afterNextRender, isDevMode, QueryList, TemplateRef, CUSTOM_ELEMENTS_SCHEMA, provideAppInitializer } from '@angular/core';
+import { inject, ElementRef, Directive, InjectionToken, HostBinding, Input, ViewEncapsulation, Component, Injectable, Injector, HostListener, ChangeDetectionStrategy, ChangeDetectorRef, ViewChild, NgModule, EventEmitter, Output, Renderer2, Pipe, ViewContainerRef, NO_ERRORS_SCHEMA, DestroyRef, SecurityContext, NgZone, ViewChildren, forwardRef, ContentChildren, ContentChild, isDevMode, QueryList, TemplateRef, CUSTOM_ELEMENTS_SCHEMA, provideAppInitializer } from '@angular/core';
 import { Dialog, DialogRef, DialogModule } from '@angular/cdk/dialog';
 import * as i1 from '@angular/common';
 import { CommonModule, NgFor, NgIf, NgClass, NgTemplateOutlet, AsyncPipe } from '@angular/common';
@@ -1550,11 +1550,11 @@ class QdDialogComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdDialogComponent, isStandalone: false, selector: "qd-dialog", host: { properties: { "class.full-width": "isFullWidth", "class.has-sections": "this.hasSectionsClass" } }, providers: [QdDialogComponent], viewQueries: [{ propertyName: "body", first: true, predicate: ["body"], descendants: true }, { propertyName: "infoBanners", first: true, predicate: ["banners"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"!isFullWidth\" class=\"dialog-header\">\n  <div class=\"title-container\">\n    {{ config?.title?.i18n | translate }}\n  </div>\n  <button\n    *ngIf=\"!config?.hideCloseHeaderButton\"\n    qdIconButton\n    class=\"close\"\n    color=\"secondary\"\n    tabindex=\"-1\"\n    (click)=\"close()\"\n    data-test-id=\"dialog-close-button\"\n  >\n    <qd-icon icon=\"timesLargeLight\"></qd-icon>\n  </button>\n</div>\n\n<button\n  *ngIf=\"!config?.hideCloseHeaderButton && isFullWidth\"\n  qdIconButton\n  class=\"close\"\n  color=\"secondary\"\n  tabindex=\"-1\"\n  (click)=\"close()\"\n  data-test-id=\"dialog-close-button\"\n>\n  <qd-icon icon=\"timesLargeLight\"></qd-icon>\n</button>\n\n<div class=\"wrapper-body\">\n  <div [class.has-dialog-info-banners]=\"hasInfoBanner\" #banners>\n    <ng-content select=\"qd-page-info-banner\"></ng-content>\n  </div>\n  <div class=\"body\" [class.full-width]=\"isFullWidth\" #body>\n    <ng-content></ng-content>\n  </div>\n</div>\n\n<div class=\"qd-dialog-actions\">\n  <button\n    *ngIf=\"config.cancel\"\n    qdButton\n    qdButtonGhost\n    color=\"secondary\"\n    (click)=\"close()\"\n    data-test-id=\"dialog-cancel-button\"\n  >\n    {{ config?.cancel?.label?.i18n ?? \"i18n.qd.dialog.action.cancel\" | translate }}\n  </button>\n  <button *ngIf=\"config.primary\" qdButton (click)=\"primaryActionClicked()\" data-test-id=\"dialog-primary-button\">\n    {{ config?.primary?.label?.i18n ?? \"i18n.qd.dialog.action.primary\" | translate }}\n  </button>\n  <ng-content select=\"qd-dialog-action\"></ng-content>\n</div>\n", styles: ["qd-dialog{display:flex;width:100%;height:100%;flex-direction:column;background:#efefef}qd-dialog.full-width{position:relative;width:calc(100% - 3rem)!important;height:calc(100% - 3rem)!important;margin:1.5rem}qd-dialog.full-width .close{position:absolute;z-index:9999;top:1.25rem;right:1rem;color:#454545;cursor:pointer}.dialog-header{display:flex;height:3.125rem;flex-direction:row;align-items:center;justify-content:space-between;padding:.5rem 1.5rem;border-bottom:2px solid rgb(213,213,213);background:#fff}.dialog-header .title-container{display:block;color:#171717;font-weight:500}.dialog-header .close{cursor:pointer}.wrapper-body{overflow:auto;flex:1;background:#efefef}.wrapper-body .has-dialog-info-banners{padding:1rem 1.25rem .5rem;border-bottom:rgb(213,213,213) solid .0625rem;background-color:#fff}.wrapper-body .has-dialog-info-banners qd-page-info-banner:last-child{margin-bottom:0}.wrapper-body .body.full-width{height:100%}.wrapper-body .body:not(.full-width){max-height:80vh;padding:1rem 1.5rem}.wrapper-body .body:not(.full-width) qd-section{padding-right:1.5rem;padding-left:1.5rem}.wrapper-body .body:not(.full-width) qd-text-section{margin-right:0;margin-left:0}qd-dialog.has-sections .wrapper-body .body:not(.full-width){padding:0}.qd-dialog-actions{display:flex;justify-content:flex-end;padding:.5rem 1.5rem;border-top:2px solid rgb(213,213,213);background:#efefef;column-gap:.625rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: QdButtonComponent, selector: "button[qdButton], a[qdButton], button[qd-button]", inputs: ["disabled", "color", "icon", "data-test-id", "additionalInfo"] }, { kind: "directive", type: QdButtonGhostDirective, selector: "button[qdButtonGhost], a[qdButtonGhost]" }, { kind: "component", type: QdIconButtonComponent, selector: "button[qdIconButton], a[qdIconButton], button[qd-icon-button]", inputs: ["color", "data-test-id"] }, { kind: "component", type: QdIconComponent, selector: "qd-icon", inputs: ["icon", "status"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdDialogComponent, isStandalone: false, selector: "qd-dialog", host: { properties: { "class.full-width": "isFullWidth", "class.has-sections": "this.hasSectionsClass" } }, providers: [QdDialogComponent], viewQueries: [{ propertyName: "body", first: true, predicate: ["body"], descendants: true }, { propertyName: "infoBanners", first: true, predicate: ["banners"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"!isFullWidth\" class=\"dialog-header\">\n  <div class=\"title-container\">\n    {{ config?.title?.i18n | translate }}\n  </div>\n  <button\n    *ngIf=\"!config?.hideCloseHeaderButton\"\n    qdIconButton\n    class=\"close\"\n    color=\"secondary\"\n    tabindex=\"-1\"\n    (click)=\"close()\"\n  >\n    <qd-icon icon=\"timesLargeLight\"></qd-icon>\n  </button>\n</div>\n\n<button\n  *ngIf=\"!config?.hideCloseHeaderButton && isFullWidth\"\n  qdIconButton\n  class=\"close\"\n  color=\"secondary\"\n  tabindex=\"-1\"\n  (click)=\"close()\"\n>\n  <qd-icon icon=\"timesLargeLight\"></qd-icon>\n</button>\n\n<div class=\"wrapper-body\">\n  <div [class.has-dialog-info-banners]=\"hasInfoBanner\" #banners>\n    <ng-content select=\"qd-page-info-banner\"></ng-content>\n  </div>\n  <div class=\"body\" [class.full-width]=\"isFullWidth\" #body>\n    <ng-content></ng-content>\n  </div>\n</div>\n\n<div class=\"qd-dialog-actions\">\n  <button *ngIf=\"config.cancel\" qdButton qdButtonGhost color=\"secondary\" (click)=\"close()\">\n    {{ config?.cancel?.label?.i18n ?? \"i18n.qd.dialog.action.cancel\" | translate }}\n  </button>\n  <button *ngIf=\"config.primary\" qdButton (click)=\"primaryActionClicked()\">\n    {{ config?.primary?.label?.i18n ?? \"i18n.qd.dialog.action.primary\" | translate }}\n  </button>\n  <ng-content select=\"qd-dialog-action\"></ng-content>\n</div>\n", styles: ["qd-dialog{display:flex;width:100%;height:100%;flex-direction:column;background:#efefef}qd-dialog.full-width{position:relative;width:calc(100% - 3rem)!important;height:calc(100% - 3rem)!important;margin:1.5rem}qd-dialog.full-width .close{position:absolute;z-index:9999;top:1.25rem;right:1rem;color:#454545;cursor:pointer}.dialog-header{display:flex;height:3.125rem;flex-direction:row;align-items:center;justify-content:space-between;padding:.5rem 1.5rem;border-bottom:2px solid rgb(213,213,213);background:#fff}.dialog-header .title-container{display:block;color:#171717;font-weight:500}.dialog-header .close{cursor:pointer}.wrapper-body{overflow:auto;flex:1;background:#efefef}.wrapper-body .has-dialog-info-banners{padding:1rem 1.25rem .5rem;border-bottom:rgb(213,213,213) solid .0625rem;background-color:#fff}.wrapper-body .has-dialog-info-banners qd-page-info-banner:last-child{margin-bottom:0}.wrapper-body .body.full-width{height:100%}.wrapper-body .body:not(.full-width){max-height:80vh;padding:1rem 1.5rem}.wrapper-body .body:not(.full-width) qd-section{padding-right:1.5rem;padding-left:1.5rem}.wrapper-body .body:not(.full-width) qd-text-section{margin-right:0;margin-left:0}qd-dialog.has-sections .wrapper-body .body:not(.full-width){padding:0}.qd-dialog-actions{display:flex;justify-content:flex-end;padding:.5rem 1.5rem;border-top:2px solid rgb(213,213,213);background:#efefef;column-gap:.625rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: QdButtonComponent, selector: "button[qdButton], a[qdButton], button[qd-button]", inputs: ["disabled", "color", "icon", "data-test-id", "additionalInfo"] }, { kind: "directive", type: QdButtonGhostDirective, selector: "button[qdButtonGhost], a[qdButtonGhost]" }, { kind: "component", type: QdIconButtonComponent, selector: "button[qdIconButton], a[qdIconButton], button[qd-icon-button]", inputs: ["color", "data-test-id"] }, { kind: "component", type: QdIconComponent, selector: "qd-icon", inputs: ["icon", "status"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'qd-dialog', host: { '[class.full-width]': 'isFullWidth' }, encapsulation: ViewEncapsulation.None, providers: [QdDialogComponent], standalone: false, template: "<div *ngIf=\"!isFullWidth\" class=\"dialog-header\">\n  <div class=\"title-container\">\n    {{ config?.title?.i18n | translate }}\n  </div>\n  <button\n    *ngIf=\"!config?.hideCloseHeaderButton\"\n    qdIconButton\n    class=\"close\"\n    color=\"secondary\"\n    tabindex=\"-1\"\n    (click)=\"close()\"\n    data-test-id=\"dialog-close-button\"\n  >\n    <qd-icon icon=\"timesLargeLight\"></qd-icon>\n  </button>\n</div>\n\n<button\n  *ngIf=\"!config?.hideCloseHeaderButton && isFullWidth\"\n  qdIconButton\n  class=\"close\"\n  color=\"secondary\"\n  tabindex=\"-1\"\n  (click)=\"close()\"\n  data-test-id=\"dialog-close-button\"\n>\n  <qd-icon icon=\"timesLargeLight\"></qd-icon>\n</button>\n\n<div class=\"wrapper-body\">\n  <div [class.has-dialog-info-banners]=\"hasInfoBanner\" #banners>\n    <ng-content select=\"qd-page-info-banner\"></ng-content>\n  </div>\n  <div class=\"body\" [class.full-width]=\"isFullWidth\" #body>\n    <ng-content></ng-content>\n  </div>\n</div>\n\n<div class=\"qd-dialog-actions\">\n  <button\n    *ngIf=\"config.cancel\"\n    qdButton\n    qdButtonGhost\n    color=\"secondary\"\n    (click)=\"close()\"\n    data-test-id=\"dialog-cancel-button\"\n  >\n    {{ config?.cancel?.label?.i18n ?? \"i18n.qd.dialog.action.cancel\" | translate }}\n  </button>\n  <button *ngIf=\"config.primary\" qdButton (click)=\"primaryActionClicked()\" data-test-id=\"dialog-primary-button\">\n    {{ config?.primary?.label?.i18n ?? \"i18n.qd.dialog.action.primary\" | translate }}\n  </button>\n  <ng-content select=\"qd-dialog-action\"></ng-content>\n</div>\n", styles: ["qd-dialog{display:flex;width:100%;height:100%;flex-direction:column;background:#efefef}qd-dialog.full-width{position:relative;width:calc(100% - 3rem)!important;height:calc(100% - 3rem)!important;margin:1.5rem}qd-dialog.full-width .close{position:absolute;z-index:9999;top:1.25rem;right:1rem;color:#454545;cursor:pointer}.dialog-header{display:flex;height:3.125rem;flex-direction:row;align-items:center;justify-content:space-between;padding:.5rem 1.5rem;border-bottom:2px solid rgb(213,213,213);background:#fff}.dialog-header .title-container{display:block;color:#171717;font-weight:500}.dialog-header .close{cursor:pointer}.wrapper-body{overflow:auto;flex:1;background:#efefef}.wrapper-body .has-dialog-info-banners{padding:1rem 1.25rem .5rem;border-bottom:rgb(213,213,213) solid .0625rem;background-color:#fff}.wrapper-body .has-dialog-info-banners qd-page-info-banner:last-child{margin-bottom:0}.wrapper-body .body.full-width{height:100%}.wrapper-body .body:not(.full-width){max-height:80vh;padding:1rem 1.5rem}.wrapper-body .body:not(.full-width) qd-section{padding-right:1.5rem;padding-left:1.5rem}.wrapper-body .body:not(.full-width) qd-text-section{margin-right:0;margin-left:0}qd-dialog.has-sections .wrapper-body .body:not(.full-width){padding:0}.qd-dialog-actions{display:flex;justify-content:flex-end;padding:.5rem 1.5rem;border-top:2px solid rgb(213,213,213);background:#efefef;column-gap:.625rem}\n"] }]
+            args: [{ selector: 'qd-dialog', host: { '[class.full-width]': 'isFullWidth' }, encapsulation: ViewEncapsulation.None, providers: [QdDialogComponent], standalone: false, template: "<div *ngIf=\"!isFullWidth\" class=\"dialog-header\">\n  <div class=\"title-container\">\n    {{ config?.title?.i18n | translate }}\n  </div>\n  <button\n    *ngIf=\"!config?.hideCloseHeaderButton\"\n    qdIconButton\n    class=\"close\"\n    color=\"secondary\"\n    tabindex=\"-1\"\n    (click)=\"close()\"\n  >\n    <qd-icon icon=\"timesLargeLight\"></qd-icon>\n  </button>\n</div>\n\n<button\n  *ngIf=\"!config?.hideCloseHeaderButton && isFullWidth\"\n  qdIconButton\n  class=\"close\"\n  color=\"secondary\"\n  tabindex=\"-1\"\n  (click)=\"close()\"\n>\n  <qd-icon icon=\"timesLargeLight\"></qd-icon>\n</button>\n\n<div class=\"wrapper-body\">\n  <div [class.has-dialog-info-banners]=\"hasInfoBanner\" #banners>\n    <ng-content select=\"qd-page-info-banner\"></ng-content>\n  </div>\n  <div class=\"body\" [class.full-width]=\"isFullWidth\" #body>\n    <ng-content></ng-content>\n  </div>\n</div>\n\n<div class=\"qd-dialog-actions\">\n  <button *ngIf=\"config.cancel\" qdButton qdButtonGhost color=\"secondary\" (click)=\"close()\">\n    {{ config?.cancel?.label?.i18n ?? \"i18n.qd.dialog.action.cancel\" | translate }}\n  </button>\n  <button *ngIf=\"config.primary\" qdButton (click)=\"primaryActionClicked()\">\n    {{ config?.primary?.label?.i18n ?? \"i18n.qd.dialog.action.primary\" | translate }}\n  </button>\n  <ng-content select=\"qd-dialog-action\"></ng-content>\n</div>\n", styles: ["qd-dialog{display:flex;width:100%;height:100%;flex-direction:column;background:#efefef}qd-dialog.full-width{position:relative;width:calc(100% - 3rem)!important;height:calc(100% - 3rem)!important;margin:1.5rem}qd-dialog.full-width .close{position:absolute;z-index:9999;top:1.25rem;right:1rem;color:#454545;cursor:pointer}.dialog-header{display:flex;height:3.125rem;flex-direction:row;align-items:center;justify-content:space-between;padding:.5rem 1.5rem;border-bottom:2px solid rgb(213,213,213);background:#fff}.dialog-header .title-container{display:block;color:#171717;font-weight:500}.dialog-header .close{cursor:pointer}.wrapper-body{overflow:auto;flex:1;background:#efefef}.wrapper-body .has-dialog-info-banners{padding:1rem 1.25rem .5rem;border-bottom:rgb(213,213,213) solid .0625rem;background-color:#fff}.wrapper-body .has-dialog-info-banners qd-page-info-banner:last-child{margin-bottom:0}.wrapper-body .body.full-width{height:100%}.wrapper-body .body:not(.full-width){max-height:80vh;padding:1rem 1.5rem}.wrapper-body .body:not(.full-width) qd-section{padding-right:1.5rem;padding-left:1.5rem}.wrapper-body .body:not(.full-width) qd-text-section{margin-right:0;margin-left:0}qd-dialog.has-sections .wrapper-body .body:not(.full-width){padding:0}.qd-dialog-actions{display:flex;justify-content:flex-end;padding:.5rem 1.5rem;border-top:2px solid rgb(213,213,213);background:#efefef;column-gap:.625rem}\n"] }]
         }], propDecorators: { body: [{
                 type: ViewChild,
                 args: ['body']
@@ -28995,8 +28995,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
 
 class QdPageCommitActionExecutor {
     static execute(action, values, context) {
-        const { formGroupManager, navigationInterceptor, destroyed$, onAfterSnapshot, scheduleFrameworkRebuildStop } = context;
-        const captured = formGroupManager.createCurrentValuesSnapshot();
+        const { formGroupManager, navigationInterceptor, destroyed$, onAfterSnapshot } = context;
+        const captured = formGroupManager.captureFormValues();
         let result$;
         navigationInterceptor.executeWithBypass(() => {
             const handlerResult = action.handler(values);
@@ -29004,9 +29004,7 @@ class QdPageCommitActionExecutor {
                 result$ = handlerResult;
         });
         const applySuccess = () => {
-            formGroupManager.updateSavedSnapshotFromValues(captured);
-            formGroupManager.startAdoptingFrameworkRebuild();
-            scheduleFrameworkRebuildStop?.();
+            formGroupManager.setFormGroupsSnapshot(captured);
             navigationInterceptor.executeWithBypass(() => {
                 try {
                     onAfterSnapshot?.();
@@ -29050,170 +29048,136 @@ class QdPageCommitActionExecutor {
 }
 
 /**
- * Central tracker for all reactive forms on a single QdPage.
- *
- * Its main job is to answer one question: **has the user changed anything since the last save?**
- * The page uses that answer to warn before leaving with unsaved changes.
- *
- * #### What it does
- * - **Registry** — holds every form of the page and gives access to it.
- * - **Change detection** — keeps a snapshot of the saved values and compares the live form against it.
- * - **Restore** — resets the forms back to the snapshot when the user discards changes.
- * - **Validity** — reports whether all forms are valid and can cancel in-flight async validators.
- *
- * #### Adopting framework rebuilds
- * After a save, the consumer often rebuilds the form itself — a `FormArray` cleared and pushed
- * again, or a control replaced via `setControl`. A plain value compare would wrongly read that as a
- * user edit. To prevent that:
- *
- * - **What it does** — right after each save or snapshot write, the framework briefly *adopts its
- *   own rebuild* (`startAdoptingFrameworkRebuild`) and folds those control replacements into the
- *   snapshot, so they count as already saved.
- * - **Why it is needed** — otherwise a rebuilt value (text `"99"` becoming number `99`) would look
- *   like an unsaved change.
- * - **When it ends** — the page stops adopting once the rebuild has rendered
- *   (`stopAdoptingFrameworkRebuild`).
- * - **User edits stay unsaved** — they always happen after that window, so they are still reported.
- *
- * #### Notes
- * - Snapshots store only **raw values** (`getRawValue()`), never control instances — cheap to keep and compare.
- * - Restoring a `FormArray` adjusts its length and resets its contents; it never replaces the array instance.
- * - No structural information is stored in the snapshot, only data.
+ * The QdFormGroupManagerService provides centralized registration, snapshotting, and value tracking
+ * for multiple Angular `FormGroup` instances. It supports efficient state restoration, including dynamic
+ * resizing of embedded `FormArray` controls, while avoiding any structural cloning in snapshots.
+ *
+ * #### Purpose:
+ * This service is useful when managing multiple reactive forms that must be:
+ * - Observed for changes
+ * - Checked for validity
+ * - Compared against a previous state (snapshot)
+ * - Reset to a previous state, including dynamic form arrays
+ *
+ * #### Value Snapshot
+ * Snapshots store only **raw values** (via `getRawValue()`), not any control instances.
+ * This allows for minimal memory usage and easy comparison using deep equality checks.
+ *
+ * #### Smart FormArray Reset
+ * When restoring a `FormArray`, the service ensures that the number and structure of controls
+ * matches the snapshot values. Controls are cloned dynamically from an existing prototype.
+ * If a `FormArray` was emptied (e.g. via `removeAt()`), a minimal control structure is inferred
+ * from the snapshot data.
+ *
+ * #### Example Usage:
+ *
+ * **Register a FormGroup**
+ * ```ts
+ * service.setFormGroup('userForm', formGroup);
+ * ```
+ *
+ * **Take a Snapshot**
+ * ```ts
+ * service.takeFormGroupsSnapshot();
+ * ```
+ *
+ * **Detect Changes**
+ * ```ts
+ * service.$hasValuesChanged().subscribe(changed => {
+ *   if (changed) {
+ *     console.log('Form data has changed');
+ *   }
+ * });
+ * ```
+ *
+ * **Restore from Snapshot**
+ * ```ts
+ * service.restoreFormGroupsFromSnapshot();
+ * ```
+ *
+ * **Check if All Forms Are Valid**
+ * ```ts
+ * service.$areFormGroupsValid().subscribe(valid => {
+ *   if (valid) {
+ *     console.log('All forms valid!');
+ *   }
+ * });
+ * ```
+ *
+ * #### Notes:
+ * - FormArrays are not replaced during restore. Their length is adjusted and their content reset.
+ * - Control cloning is recursive and structure-preserving.
+ * - No structural information is stored in the snapshot; only data.
  */
 class QdFormGroupManagerService {
     _formGroups = new Map();
     _formGroupsSnapshot = new Map();
-    _knownControlInstances = new Map();
-    _isAdoptingFrameworkRebuild = false;
-    _frameworkRebuildSub;
     _formGroupsChanged$ = new BehaviorSubject(undefined);
-    _keysInInitialBuildup = new Set();
-    /**
-     * Registers a form under a key so the manager can track it.
-     *
-     * On first registration it also seeds the saved snapshot from the current values, so a freshly
-     * registered form counts as unchanged until the user actually edits it.
-     */
     setFormGroup(key, formGroup) {
         this._formGroups.set(key, formGroup);
-        if (!this._formGroupsSnapshot.has(key)) {
-            this._formGroupsSnapshot.set(key, formGroup.getRawValue());
-            this.rememberControlInstances(key, formGroup);
-            this._keysInInitialBuildup.add(key);
-        }
         this._formGroupsChanged$.next();
     }
-    /**
-     * Returns the form registered under the given key, or `undefined` if none is registered.
-     */
     getFormGroup(key) {
         return this._formGroups.get(key);
     }
-    /**
-     * Returns all registered forms, keyed by their registration key.
-     */
     getAllFormGroups() {
         return this._formGroups;
     }
-    /**
-     * Returns `true` if at least one form is registered.
-     */
+    tryRemoveFormGroup(key) {
+        this._formGroups.delete(key);
+        this._formGroupsChanged$.next();
+    }
     hasFormGroups() {
         return this._formGroups.size > 0;
     }
-    /**
-     * Returns `true` if no form is registered under the given key yet.
-     */
-    isFormGroupKeyUnique(key) {
-        return !this._formGroups.has(key);
-    }
-    /**
-     * Returns the current `.value` of every registered form, keyed by registration key.
-     *
-     * Uses Angular's `.value`, so disabled controls are omitted. Use the snapshot methods when you
-     * need the raw values including disabled controls.
-     */
     getAllValues() {
         const allValues = {};
         this._formGroups.forEach((formGroup, key) => (allValues[key] = formGroup.value));
         return allValues;
     }
-    /**
-     * Unregisters the form under the given key and drops its instance tracking.
-     *
-     * Does nothing if no form is registered for the key.
-     */
-    tryRemoveFormGroup(key) {
-        this._formGroups.delete(key);
-        this._knownControlInstances.delete(key);
-        this._keysInInitialBuildup.delete(key);
-        this._formGroupsChanged$.next();
+    isFormGroupKeyUnique(key) {
+        return !this._formGroups.has(key);
     }
-    /**
-     * Ends the initial-buildup phase for a key and fixes its baseline from the form as it is now.
-     *
-     * During that phase the key never counts as changed, so a form filled right after registration
-     * (e.g. by an `effect`) is not flagged as unsaved. This stores the current values as the baseline,
-     * so later edits are measured against the filled form.
-     *
-     * Does nothing if the key is not in its initial-buildup phase.
-     */
-    endInitialBuildup(key) {
-        if (!this._keysInInitialBuildup.delete(key))
-            return;
-        const formGroup = this._formGroups.get(key);
-        if (formGroup) {
-            this._formGroupsSnapshot.set(key, formGroup.getRawValue());
-            this.rememberControlInstances(key, formGroup);
-        }
-        this._formGroupsChanged$.next();
+    $areFormGroupsValid() {
+        return this._formGroupsChanged$.pipe(observeOn(queueScheduler), switchMap$1(() => {
+            if (!this.hasFormGroups())
+                return of(false);
+            const obs = Array.from(this._formGroups.values()).map(fg => fg.statusChanges.pipe(startWith(fg.status), map(() => this.areFormGroupsValid(fg))));
+            return combineLatest(obs).pipe(map(valids => valids.every(Boolean)));
+        }));
     }
-    /**
-     * Emits whether any registered form differs from its saved snapshot — i.e. whether the user has
-     * unsaved changes.
-     *
-     * Framework-driven rebuilds are folded into the snapshot first while the framework is adopting
-     * them (see the class docs), so they are not reported as changes.
-     */
     $hasValuesChanged() {
-        return this._formGroupsChanged$.pipe(observeOn(queueScheduler), switchMap$1(() => this.anyRegisteredFormChanged$()));
+        return this._formGroupsChanged$.pipe(observeOn(queueScheduler), switchMap$1(() => {
+            if (!this.hasFormGroups())
+                return of(false);
+            const obs = Array.from(this._formGroups.entries()).map(([key, fg]) => fg.valueChanges.pipe(startWith(fg.getRawValue()), map(() => {
+                const currentValues = fg.getRawValue();
+                const snapshot = this._formGroupsSnapshot.get(key);
+                return snapshot ? !isEqual$1(currentValues, snapshot) : true;
+            })));
+            return combineLatest(obs).pipe(map(changes => changes.some(Boolean)));
+        }));
     }
-    /**
-     * Overwrites the saved snapshot with the **current** form values — for a **synchronous** save
-     * that is already finished.
-     *
-     * - Stores each form's raw values (`getRawValue`) as the new saved snapshot.
-     * - Takes them **directly, without a deep copy** — synchronous means no edits can slip in
-     *   between, so the cheap path is safe (only the async path needs the copy).
-     * - Afterwards the current state counts as saved; later edits are measured against it.
-     *
-     * For an **asynchronous** save, use `createCurrentValuesSnapshot()` + `updateSavedSnapshotFromValues()`.
-     */
-    updateSavedSnapshotFromCurrentValues() {
-        this._formGroups.forEach((fg, key) => {
-            this._formGroupsSnapshot.set(key, fg.getRawValue());
-            this.rememberControlInstances(key, fg);
-        });
+    takeFormGroupsSnapshot() {
+        this._formGroups.forEach((fg, key) => this._formGroupsSnapshot.set(key, fg.getRawValue()));
     }
     /**
-     * Creates an independent snapshot of the **current** form values and returns it — for the
-     * **click moment** of an **asynchronous** save.
+     * Captures a deep-cloned snapshot of all current form values without mutating internal state.
      *
-     * - Deep-copies each form's raw values (`structuredClone`), detached from the live form.
-     * - Writes **nothing** internally — the saved snapshot stays unchanged.
-     * - Freezes the click-time state: later edits (while the backend runs) do not change the copy.
-     * - Hand the result to `updateSavedSnapshotFromValues()` once the save succeeds.
+     * Used by framework orchestration code that needs to remember the "at click time" state of a form
+     * so the snapshot can later be set to exactly those values — even if the user edits the form
+     * while an async commit action is pending.
      *
      * Throws if any form value is not structured-cloneable (functions, symbols, DOM nodes).
      */
-    createCurrentValuesSnapshot() {
+    captureFormValues() {
         const captured = new Map();
         this._formGroups.forEach((fg, key) => {
             try {
                 captured.set(key, structuredClone(fg.getRawValue()));
             }
             catch (err) {
-                throw new Error(`Quadrel Framework | QdFormGroupManager - createCurrentValuesSnapshot() failed for group "${key}". ` +
+                throw new Error(`Quadrel Framework | QdFormGroupManager - captureFormValues() failed for group "${key}". ` +
                     `Form values must be structured-cloneable. Non-cloneable values like functions, ` +
                     `symbols, or DOM nodes are not supported. Original error: ${String(err)}`);
             }
@@ -29221,27 +29185,15 @@ class QdFormGroupManagerService {
         return captured;
     }
     /**
-     * Overwrites the saved snapshot with the **given** snapshot — on **success** of an
-     * **asynchronous** save, using the snapshot taken earlier by `createCurrentValuesSnapshot()`.
-     *
-     * - Stores the passed snapshot as the new saved state.
-     * - Uses the click-time snapshot, **not** the current form — so edits the user made while the
-     *   backend was running stay correctly marked as unsaved.
-     */
-    updateSavedSnapshotFromValues(snapshot) {
-        snapshot.forEach((values, key) => {
-            this._formGroupsSnapshot.set(key, values);
-            const formGroup = this._formGroups.get(key);
-            if (formGroup)
-                this.rememberControlInstances(key, formGroup);
-        });
-    }
-    /**
-     * Resets every registered form back to its saved snapshot — used when the user discards changes.
+     * Replaces the internal saved snapshot with the provided values.
      *
-     * FormArrays are resized to match the snapshot length; pending async validators are cancelled
-     * afterwards so no stale validation result survives the restore.
+     * Intended to be paired with `captureFormValues()` so that the snapshot can be set to the
+     * values present when a commit action was initiated — independent of whether the user edited
+     * the form in the meantime.
      */
+    setFormGroupsSnapshot(values) {
+        values.forEach((snapshot, key) => this._formGroupsSnapshot.set(key, snapshot));
+    }
     restoreFormGroupsFromSnapshot() {
         this._formGroups.forEach((fg, key) => {
             const snapshot = this._formGroupsSnapshot.get(key);
@@ -29252,171 +29204,68 @@ class QdFormGroupManagerService {
         this.cancelPendingAsyncValidation();
     }
     /**
-     * Starts adopting framework rebuilds into the snapshot. While active, a framework-driven control
-     * replacement (a `setControl` on a leaf or a whole `FormArray` rebuilt via clear/push) is folded
-     * into the saved snapshot, so it is not reported as an unsaved change.
+     * Cancels any in-flight async validators on all registered form groups.
      *
-     * User edits never fall in this short window, so they stay dirty. The framework starts it after a
-     * successful commit and after every snapshot write; the page stops it deterministically once the
-     * rebuild has rendered.
-     */
-    startAdoptingFrameworkRebuild() {
-        this._isAdoptingFrameworkRebuild = true;
-        this._frameworkRebuildSub?.unsubscribe();
-        const valueStreams = Array.from(this._formGroups.values()).map(fg => fg.valueChanges);
-        if (valueStreams.length)
-            this._frameworkRebuildSub = merge(...valueStreams).subscribe(() => this.adoptFrameworkRebuild());
-        this.adoptFrameworkRebuild();
-    }
-    /**
-     * Stops adopting framework rebuilds. After this, control replacements count as user edits again.
-     *
-     * The page calls this once the framework rebuild has rendered (via `afterNextRender`).
-     */
-    stopAdoptingFrameworkRebuild() {
-        this._isAdoptingFrameworkRebuild = false;
-        this._frameworkRebuildSub?.unsubscribe();
-    }
-    /**
-     * Emits whether every registered form is currently valid.
-     *
-     * A disabled control without validators is treated as valid.
-     */
-    $areFormGroupsValid() {
-        return this._formGroupsChanged$.pipe(observeOn(queueScheduler), switchMap$1(() => {
-            if (!this.hasFormGroups())
-                return of(false);
-            const obs = Array.from(this._formGroups.values()).map(fg => fg.statusChanges.pipe(startWith(fg.status), map(() => this.areFormGroupsValid(fg))));
-            return combineLatest(obs).pipe(map(valids => valids.every(Boolean)));
-        }));
-    }
-    /**
-     * Cancels every in-flight (PENDING) async validator across all registered forms, so no stale
-     * validation result can land after a restore or a commit.
-     *
-     * The async validators themselves are kept — only the pending run is dropped. Each phase runs
-     * over **all** pending controls before the next starts (detach → re-evaluate sync-only, no
-     * cascade → re-attach), so validity is never recomputed while a run is still settling.
+     * 1. Collect all PENDING controls and their async validators
+     * 2. Clear all async validators, then update validity (sync-only, no cascade)
+     * 3. Re-attach async validators for future use
      */
     cancelPendingAsyncValidation() {
         this._formGroups.forEach(fg => {
             const pendingControls = this.collectPendingControls(fg);
             if (pendingControls.length === 0)
                 return;
-            pendingControls.forEach(({ control }) => control.clearAsyncValidators());
-            pendingControls.forEach(({ control }) => control.updateValueAndValidity({ onlySelf: true }));
-            pendingControls.forEach(({ control, asyncValidator }) => control.setAsyncValidators(asyncValidator));
-        });
-    }
-    anyRegisteredFormChanged$() {
-        if (!this.hasFormGroups())
-            return of(false);
-        const perForm = Array.from(this._formGroups.entries()).map(([key, fg]) => fg.valueChanges.pipe(startWith(null), map(() => this.hasFormChanged(key, fg))));
-        return combineLatest(perForm).pipe(map(flags => flags.some(Boolean)));
-    }
-    hasFormChanged(key, fg) {
-        if (this._keysInInitialBuildup.has(key))
-            return false;
-        const snapshot = this._formGroupsSnapshot.get(key);
-        if (snapshot)
-            this.adoptRebuildInGroup(key, fg, snapshot);
-        return snapshot ? !isEqual$1(fg.getRawValue(), snapshot) : true;
-    }
-    adoptFrameworkRebuild() {
-        this._formGroups.forEach((fg, key) => {
-            const snapshot = this._formGroupsSnapshot.get(key);
-            if (snapshot)
-                this.adoptRebuildInGroup(key, fg, snapshot);
+            for (const { control } of pendingControls) {
+                control.clearAsyncValidators();
+            }
+            for (const { control } of pendingControls) {
+                control.updateValueAndValidity({ onlySelf: true });
+            }
+            for (const { control, asyncValidator } of pendingControls) {
+                control.setAsyncValidators(asyncValidator);
+            }
         });
     }
-    adoptRebuildInGroup(key, formGroup, snapshot) {
-        const tracked = this._knownControlInstances.get(key) ?? new Map();
-        this.adoptRebuiltControls(formGroup, snapshot, tracked, '');
-        this._knownControlInstances.set(key, tracked);
-    }
-    adoptRebuiltControls(group, snapshot, tracked, prefix) {
-        Object.entries(group.controls).forEach(([name, control]) => {
-            const path = prefix ? `${prefix}.${name}` : name;
-            const isNewKey = !(name in snapshot);
-            if (control instanceof FormArray)
-                this.adoptRebuiltList(control, snapshot, name, isNewKey);
-            else if (control instanceof FormGroup)
-                this.adoptRebuiltGroup(control, snapshot, name, isNewKey, tracked, path);
-            else
-                this.adoptRebuiltField(control, snapshot, name, isNewKey, tracked.get(path));
-            tracked.set(path, control);
+    restoreFormGroup(fg, snapshot) {
+        Object.entries(fg.controls).forEach(([ctrlKey, ctrl]) => {
+            const newValue = snapshot[ctrlKey];
+            if (ctrl instanceof FormArray && Array.isArray(newValue)) {
+                this.resetFormArrayToValues(ctrl, newValue);
+            }
+            else if (ctrl instanceof FormGroup && newValue && typeof newValue === 'object') {
+                this.restoreFormGroup(ctrl, newValue);
+            }
+            else {
+                ctrl.reset(newValue);
+            }
         });
     }
-    adoptRebuiltList(control, snapshot, name, isNewKey) {
-        if (isNewKey) {
-            this.adoptNewPristineControl(control, snapshot, name);
-            return;
+    collectPendingControls(control) {
+        const result = [];
+        if (control instanceof FormGroup) {
+            Object.values(control.controls).forEach(c => result.push(...this.collectPendingControls(c)));
         }
-        if (!this.isAdoptableArrayRebuild(control, snapshot, name))
-            return;
-        const snapshotArray = snapshot[name];
-        const currentArray = control.getRawValue();
-        if (currentArray.length === snapshotArray.length && !isEqual$1(currentArray, snapshotArray))
-            snapshot[name] = currentArray;
-    }
-    adoptRebuiltGroup(group, snapshot, name, isNewKey, tracked, path) {
-        if (isNewKey)
-            this.adoptNewPristineControl(group, snapshot, name);
-        const nested = snapshot[name];
-        if (this.isPlainObject(nested))
-            this.adoptRebuiltControls(group, nested, tracked, path);
-    }
-    adoptRebuiltField(control, snapshot, name, isNewKey, known) {
-        if (isNewKey)
-            this.adoptNewPristineControl(control, snapshot, name);
-        else if (this.isReplacedPristineControl(control, known))
-            snapshot[name] = control.getRawValue();
-    }
-    adoptNewPristineControl(control, snapshot, name) {
-        if (control.pristine)
-            snapshot[name] = control.getRawValue();
-    }
-    isAdoptableArrayRebuild(control, snapshot, name) {
-        return this._isAdoptingFrameworkRebuild && control.pristine && Array.isArray(snapshot[name]);
-    }
-    isReplacedPristineControl(control, known) {
-        return this._isAdoptingFrameworkRebuild && !!known && known !== control && control.pristine;
-    }
-    rememberControlInstances(key, formGroup) {
-        const tracked = new Map();
-        this.collectControlInstances(formGroup, tracked, '');
-        this._knownControlInstances.set(key, tracked);
-    }
-    collectControlInstances(group, tracked, prefix) {
-        Object.entries(group.controls).forEach(([name, control]) => {
-            const path = prefix ? `${prefix}.${name}` : name;
-            tracked.set(path, control);
-            if (control instanceof FormGroup)
-                this.collectControlInstances(control, tracked, path);
-        });
-    }
-    restoreFormGroup(fg, snapshot) {
-        Object.entries(fg.controls).forEach(([ctrlKey, ctrl]) => this.restoreControl(ctrl, snapshot[ctrlKey]));
-    }
-    restoreControl(ctrl, newValue) {
-        if (ctrl instanceof FormArray && Array.isArray(newValue))
-            this.resetFormArrayToValues(ctrl, newValue);
-        else if (ctrl instanceof FormGroup && this.isPlainObject(newValue))
-            this.restoreFormGroup(ctrl, newValue);
-        else
-            ctrl.reset(newValue);
-    }
-    isPlainObject(value) {
-        return !!value && typeof value === 'object';
+        else if (control instanceof FormArray) {
+            control.controls.forEach(c => result.push(...this.collectPendingControls(c)));
+        }
+        if (control.status === 'PENDING') {
+            result.push({ control, asyncValidator: control.asyncValidator });
+        }
+        return result;
     }
     resetFormArrayToValues(array, newValues) {
         if (!Array.isArray(newValues))
             return;
-        if (array.length === 0 && newValues.length === 0)
+        const oldLen = array.length;
+        const newLen = newValues.length;
+        if (oldLen === 0 && newLen === 0)
             return;
-        if (array.length === 0)
+        if (oldLen === 0 && newLen > 0)
             return this.initFormArrayFromValues(array, newValues);
-        this.resizeFormArray(array, newValues.length);
+        while (array.length < newLen)
+            array.push(this.deepCloneControl(array.at(0)));
+        while (array.length > newLen)
+            array.removeAt(array.length - 1);
         array.reset(newValues);
     }
     initFormArrayFromValues(array, values) {
@@ -29432,12 +29281,6 @@ class QdFormGroupManagerService {
         }
         array.reset(values);
     }
-    resizeFormArray(array, length) {
-        while (array.length < length)
-            array.push(this.deepCloneControl(array.at(0)));
-        while (array.length > length)
-            array.removeAt(array.length - 1);
-    }
     deepCloneControl(control) {
         if (control instanceof FormControl)
             return new FormControl(undefined, control.validator, control.asyncValidator);
@@ -29455,19 +29298,6 @@ class QdFormGroupManagerService {
     areFormGroupsValid(fg) {
         return Object.values(fg.controls).every(c => (c.disabled && !c.validator && !c.asyncValidator ? true : c.valid));
     }
-    collectPendingControls(control) {
-        const result = this.childControlsOf(control).flatMap(child => this.collectPendingControls(child));
-        if (control.status === 'PENDING')
-            result.push({ control, asyncValidator: control.asyncValidator });
-        return result;
-    }
-    childControlsOf(control) {
-        if (control instanceof FormGroup)
-            return Object.values(control.controls);
-        if (control instanceof FormArray)
-            return control.controls;
-        return [];
-    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdFormGroupManagerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdFormGroupManagerService });
 }
@@ -29496,7 +29326,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
  * - The page switches to view mode via `deactivate()`.
  *
  * The service has no concept of "pending actions" or bypass windows. Framework actions update the
- * saved snapshot directly via `QdFormGroupManagerService.updateSavedSnapshotFromValues(...)`; cancel-discard
+ * saved snapshot directly via `QdFormGroupManagerService.setFormGroupsSnapshot(...)`; cancel-discard
  * flows reset the form to the saved snapshot via `restoreFormGroupsFromSnapshot()`. Either way, the
  * interceptor only observes the resulting form state — there is no time window where a bypass is active.
  */
@@ -29646,7 +29476,6 @@ class QdPageObjectHeaderComponent {
     confirmationDialogService = inject(QdConfirmationDialogOpenerService);
     contextService = inject(QdContextService);
     resolverTriggerService = inject(QdResolverTriggerService);
-    injector = inject(Injector);
     pageStoreService = inject(QdPageStoreService);
     config;
     hasNavigation = false;
@@ -29767,7 +29596,7 @@ class QdPageObjectHeaderComponent {
             this.setupResolverTrigger();
         this.updateCustomActions();
         this.subscribeToMetadataStream();
-        this.formGroupManagerService.updateSavedSnapshotFromCurrentValues();
+        this.formGroupManagerService.takeFormGroupsSnapshot();
         this.initContexts();
     }
     ngOnChanges(changes) {
@@ -29792,7 +29621,7 @@ class QdPageObjectHeaderComponent {
         return this.config.headerFacets != null;
     }
     edit() {
-        this.formGroupManagerService.updateSavedSnapshotFromCurrentValues();
+        this.formGroupManagerService.takeFormGroupsSnapshot();
         this.pageStoreService.toggleViewonly(false);
         if (this.editButton?.handler)
             this.editButton.handler();
@@ -29822,8 +29651,7 @@ class QdPageObjectHeaderComponent {
             onAfterSnapshot: () => {
                 this.formGroupManagerService.cancelPendingAsyncValidation();
                 this.pageStoreService.toggleViewonly(true);
-            },
-            scheduleFrameworkRebuildStop: () => afterNextRender(() => this.formGroupManagerService.stopAdoptingFrameworkRebuild(), { injector: this.injector })
+            }
         });
     }
     changeContext(context, selection, event) {
@@ -29851,11 +29679,13 @@ class QdPageObjectHeaderComponent {
             .pipe(takeUntil(this._destroyed$), filter(shouldTrigger => shouldTrigger), tap(() => this._isLoadingSubject.next(true)), switchMap(() => this.pageObjectResolver.resolve()), tap(objectData => {
             this._pageObjectDataSubject.next({ ...objectData, ...this._pendingMetadata });
             this._pendingMetadata = {};
-        }), tap(() => this._isLoadingSubject.next(false)), tap(() => this.formGroupManagerService.updateSavedSnapshotFromCurrentValues()))
+        }), tap(() => this._isLoadingSubject.next(false)), tap(() => this.formGroupManagerService.takeFormGroupsSnapshot()))
             .subscribe();
     }
     initContexts() {
-        this.contexts$ = this.contextService.contexts$.pipe(map(contexts => contexts.filter(context => context.selection || this.config.pageType === 'overview')), map(contexts => contexts.map(({ selection, context }) => ({
+        this.contexts$ = this.contextService.contexts$.pipe(map(contexts => this.config.hideContexts
+            ? []
+            : contexts.filter(context => context.selection || this.config.pageType === 'overview')), map(contexts => contexts.map(({ selection, context }) => ({
             label: context.label.i18n,
             value: Array.isArray(selection?.value)
                 ? selection?.value.filter(item => item !== null && item !== undefined)
@@ -29941,11 +29771,11 @@ class QdPageObjectHeaderComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageObjectHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdPageObjectHeaderComponent, isStandalone: false, selector: "qd-page-object-header", inputs: { config: "config", hasNavigation: "hasNavigation", testId: ["data-test-id", "testId"] }, host: { listeners: { "click": "toggleFacets()" }, properties: { "style.borderBottom": "borderBottomStyle", "class.in-dialog": "this.isInDialog" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"loading-overlay\" *ngIf=\"isLoading$ | async\"><qd-spinner></qd-spinner></div>\n\n<div class=\"object-header-top\">\n  <header class=\"object-header-title\">{{ config.title.i18n | translate }}</header>\n  <div class=\"object-header-toolbar\">\n    <button class=\"button-icon\" data-test-id=\"archive-button\">\n      <qd-icon\n        *ngIf=\"showArchive$ | async\"\n        (click)=\"archiveButton?.handler()\"\n        class=\"header-action-icon\"\n        [icon]=\"'resultNew'\"\n      ></qd-icon>\n    </button>\n\n    <button class=\"button-icon\" data-test-id=\"delete-button\">\n      <qd-icon\n        class=\"header-action-icon\"\n        *ngIf=\"showDelete$ | async\"\n        (click)=\"deleteButton?.handler()\"\n        [icon]=\"'trash'\"\n      ></qd-icon>\n    </button>\n\n    <button *ngIf=\"showEdit$ | async\" qdButton (click)=\"edit()\" data-test-id=\"edit-button\">\n      {{ editButton?.label?.i18n || \"i18n.qd.page.header.edit\" | translate }}\n    </button>\n\n    <button *ngIf=\"showCancel$ | async\" qdButton qdButtonGhost (click)=\"cancel()\" data-test-id=\"cancel-button\">\n      {{ cancelButton.label?.i18n || \"i18n.qd.page.header.cancel\" | translate }}\n    </button>\n\n    <button\n      *ngIf=\"showSave$ | async\"\n      qdButton\n      (click)=\"save()\"\n      data-test-id=\"save-button\"\n      [disabled]=\"($canSave | async) === false\"\n    >\n      {{ saveButton.label?.i18n || \"i18n.qd.page.header.save\" | translate }}\n    </button>\n\n    <ng-container *ngIf=\"customActions$ | async as customActions\">\n      <ng-container *ngIf=\"!adaptiveMode; else adaptive\">\n        <button\n          [qdMenuButton]=\"customActions\"\n          [autoSize]=\"false\"\n          [data-test-id]=\"'page-'\"\n          *ngIf=\"customActions.actions.length > 1; else singleButton\"\n          data-test-id=\"custom-button\"\n        >\n          {{ config?.customActionsLabel?.i18n || \"i18n.qd.page.header.actions\" | translate }}\n        </button>\n\n        <ng-template #singleButton>\n          <ng-container *ngIf=\"(customActions$ | async).actions[0] as singleAction\">\n            <button\n              qdButton\n              *ngIf=\"singleAction.handler && !singleAction.isHidden\"\n              [disabled]=\"singleAction.isDisabled\"\n              (click)=\"singleAction.handler()\"\n              data-test-id=\"custom-button\"\n            >\n              {{ singleAction.label?.i18n | translate }}\n            </button>\n          </ng-container>\n        </ng-template>\n      </ng-container>\n\n      <ng-template #adaptive>\n        <button\n          *ngIf=\"(customActions$ | async)?.actions.length >= 1\"\n          type=\"button\"\n          class=\"adaptive-menu-button\"\n          [qdPopoverOnClick]=\"menu\"\n          [qdPopoverCloseStrategy]=\"'onEveryClick'\"\n          [qdPopoverStopPropagation]=\"true\"\n          [qdPopoverMinWidth]=\"160\"\n        >\n          <qd-icon icon=\"overflowMenuVertical\"></qd-icon>\n        </button>\n\n        <ng-template #menu>\n          <button\n            *ngFor=\"let action of customActions.actions; let i = index\"\n            class=\"adaptive-menu-entry\"\n            type=\"button\"\n            [disabled]=\"action.isDisabled\"\n            (click)=\"action.handler()\"\n          >\n            {{ action.label.i18n | translate }}\n          </button>\n        </ng-template>\n      </ng-template>\n    </ng-container>\n  </div>\n</div>\n\n<div class=\"object-header-facets\" [ngClass]=\"{ amongThemselves: adaptiveMode && !facetsCollapsed }\">\n  <ng-container *ngIf=\"pageObjectData$ | async as data\">\n    <div\n      class=\"object-header-facet\"\n      *ngFor=\"let facet of headerFacets | slice : 0 : (adaptiveMode && facetsCollapsed ? 2 : headerFacets?.length ?? 0)\"\n      [attr.data-test-id]=\"testId + '-facet-' + facet.name\"\n    >\n      <div class=\"facet-label\">{{ facet.label.i18n | translate }}</div>\n      <qd-dynamic-facet class=\"dynamic-facet\" [facet]=\"facet\" [data]=\"data\"></qd-dynamic-facet>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"!config.hideContexts && contexts$ | async as contexts\">\n    <div\n      class=\"object-header-facet\"\n      *ngFor=\"\n        let context of contexts\n          | slice : 0 : (adaptiveMode && facetsCollapsed ? 2 - (headerFacets?.length ?? 0) : contexts?.length);\n        let index = index;\n        let first = first\n      \"\n      [ngClass]=\"{ hasDivider: headerFacets && first, adaptiveFirst: headerFacets && adaptiveMode && first }\"\n    >\n      <div class=\"facet-label\">{{ context.label | translate }}</div>\n\n      <span *ngIf=\"context.value.length === 0\" class=\"no-selected-context\">{{\n        \"i18n.qd.page.context.noSelectionPlaceholder\" | translate\n      }}</span>\n\n      <span *ngIf=\"context.value.length !== 0\">\n        <qd-chip state=\"none\" [close]=\"isContextSelectable\" (closeClickEmitter)=\"clearContext(context.context)\">\n          <ng-container *ngFor=\"let val of context.value; let last = last\">\n            {{ val.label.i18n | translate }}<span *ngIf=\"!last\">, </span>\n          </ng-container>\n        </qd-chip>\n      </span>\n\n      <span *ngIf=\"isContextSelectable && (!facetsCollapsed || !adaptiveMode)\" class=\"select-button\">\n        <button\n          qdButton\n          qdButtonLink\n          type=\"button\"\n          (click)=\"changeContext(context.context, context.selection, $event)\"\n          [data-test-id]=\"'object-header-select-context-' + context.context.id\"\n        >\n          {{\n            context.value.length !== 0\n              ? (\"i18n.qd.page.context.button.change\" | translate)\n              : (\"i18n.qd.page.context.button.select\" | translate)\n          }}\n        </button>\n      </span>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"contexts$ | async as togglerContexts\">\n    <span class=\"facets-toggler\" *ngIf=\"adaptiveMode && headerFacets?.length + togglerContexts.length > 2\">\n      <span *ngIf=\"facetsCollapsed\">+{{ headerFacets.length + togglerContexts.length - 2 }}</span>\n      <button qdIconButton [data-test-id]=\"'toggle-button'\">\n        <qd-icon [icon]=\"facetsCollapsed ? 'ctrlDown' : 'ctrlTop'\"></qd-icon>\n      </button>\n    </span>\n  </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;justify-content:space-between;padding:1.25rem;border-bottom:.125rem solid rgb(213,213,213);background:#fff;gap:1.25rem}@media (max-width: 599.98px){:host{padding:1.25rem .9375rem}}:host .object-header-top{display:flex;align-items:flex-start;justify-content:space-between}:host .object-header-top .object-header-title{padding:2px;color:#171717;font-size:1.3125rem;font-weight:500}:host .object-header-top .object-header-toolbar{display:flex;align-items:center;column-gap:.5rem}:host .object-header-top .object-header-toolbar .button-icon{background:none}:host .object-header-top .object-header-toolbar .button-icon+.button-icon{margin-left:-.5rem}:host .object-header-top .object-header-toolbar .header-action-icon{color:#14516f;cursor:pointer;font-size:1.5rem}:host.in-dialog .object-header-toolbar{padding-right:2.5rem}:host .object-header-facets{position:relative;display:flex;flex-wrap:wrap;font-size:1.125rem;gap:1.25rem}:host .object-header-facets .object-header-facet{display:flex;min-width:3.75rem;flex-direction:column}:host .object-header-facets .object-header-facet.hasDivider{padding-left:1.25rem;border-left:.0625rem solid rgb(117,117,117)}:host .object-header-facets .object-header-facet.adaptiveFirst{padding-top:1.25rem}:host .object-header-facets .object-header-facet .facet-label{display:block;margin-bottom:0;color:#757575;font-size:.875rem;padding-bottom:.375rem;font-weight:500}:host .object-header-facets .facets-toggler{position:absolute;top:0;right:0;display:flex;align-items:center;padding-right:.3125rem;font-size:.625rem;line-height:.625rem}:host .object-header-facets.amongThemselves{display:grid}:host .object-header-facets.amongThemselves .object-header-facet.hasDivider{padding-left:0;border-top:.0625rem solid rgb(117,117,117);border-left:none}.loading-overlay{position:absolute;z-index:10000;inset:0;display:flex;align-items:center;justify-content:center;background-color:#0003}.no-selected-context{height:1.625rem;color:#979797;font-size:.875rem;line-height:1.625rem}.select-button{margin-top:.25rem}.adaptive-menu-button{display:flex;background:unset;color:#454545;font-size:2rem}.adaptive-menu-button:hover,.adaptive-menu-button:focus{color:#000}.adaptive-menu-entry{display:block;overflow:hidden;width:100%;min-height:2.25rem;padding:0 1rem;background:#fff0;text-align:left;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: QdButtonComponent, selector: "button[qdButton], a[qdButton], button[qd-button]", inputs: ["disabled", "color", "icon", "data-test-id", "additionalInfo"] }, { kind: "directive", type: QdButtonGhostDirective, selector: "button[qdButtonGhost], a[qdButtonGhost]" }, { kind: "directive", type: QdButtonLinkDirective, selector: "button[qdButtonLink], a[qdButtonLink], button[qd-button-link]" }, { kind: "component", type: QdIconButtonComponent, selector: "button[qdIconButton], a[qdIconButton], button[qd-icon-button]", inputs: ["color", "data-test-id"] }, { kind: "component", type: QdMenuButtonComponent, selector: "button[qdMenuButton], a[qdMenuButton]", inputs: ["qdMenuButton", "data-test-id", "autoSize"] }, { kind: "component", type: QdChipComponent, selector: "qd-chip", inputs: ["state", "close", "data", "data-test-id"], outputs: ["closeClickEmitter"] }, { kind: "component", type: QdIconComponent, selector: "qd-icon", inputs: ["icon", "status"] }, { kind: "component", type: QdSpinnerComponent, selector: "qd-spinner" }, { kind: "directive", type: QdPopoverOnClickDirective, selector: "[qdPopoverOnClick]", inputs: ["qdPopoverOnClick", "qdPopoverPlacement", "qdPopoverOffsetX", "qdPopoverOffsetY", "qdPopoverCloseStrategy", "qdPopoverDisabled", "qdPopoverStopPropagation", "qdPopoverBackgroundColor", "qdPopoverMaxHeight", "qdPopoverMinWidth", "qdPopoverMaxWidth", "qdPopoverAutoSize", "qdPopoverEnableKeyControl", "qdPopoverFlipIntoViewport"], outputs: ["opened", "closed"], exportAs: ["qdPopoverOnClick"] }, { kind: "component", type: QdDynamicFacetComponent, selector: "qd-dynamic-facet", inputs: ["facet", "data"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdPageObjectHeaderComponent, isStandalone: false, selector: "qd-page-object-header", inputs: { config: "config", hasNavigation: "hasNavigation", testId: ["data-test-id", "testId"] }, host: { listeners: { "click": "toggleFacets()" }, properties: { "style.borderBottom": "borderBottomStyle", "class.in-dialog": "this.isInDialog" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"loading-overlay\" *ngIf=\"isLoading$ | async\"><qd-spinner></qd-spinner></div>\n\n<div class=\"object-header-top\">\n  <header class=\"object-header-title\">{{ config.title.i18n | translate }}</header>\n  <div class=\"object-header-toolbar\">\n    <button class=\"button-icon\" data-test-id=\"archive-button\">\n      <qd-icon\n        *ngIf=\"showArchive$ | async\"\n        (click)=\"archiveButton?.handler()\"\n        class=\"header-action-icon\"\n        [icon]=\"'resultNew'\"\n      ></qd-icon>\n    </button>\n\n    <button class=\"button-icon\" data-test-id=\"delete-button\">\n      <qd-icon\n        class=\"header-action-icon\"\n        *ngIf=\"showDelete$ | async\"\n        (click)=\"deleteButton?.handler()\"\n        [icon]=\"'trash'\"\n      ></qd-icon>\n    </button>\n\n    <button *ngIf=\"showEdit$ | async\" qdButton (click)=\"edit()\" data-test-id=\"edit-button\">\n      {{ editButton?.label?.i18n || \"i18n.qd.page.header.edit\" | translate }}\n    </button>\n\n    <button *ngIf=\"showCancel$ | async\" qdButton qdButtonGhost (click)=\"cancel()\" data-test-id=\"cancel-button\">\n      {{ cancelButton.label?.i18n || \"i18n.qd.page.header.cancel\" | translate }}\n    </button>\n\n    <button\n      *ngIf=\"showSave$ | async\"\n      qdButton\n      (click)=\"save()\"\n      data-test-id=\"save-button\"\n      [disabled]=\"($canSave | async) === false\"\n    >\n      {{ saveButton.label?.i18n || \"i18n.qd.page.header.save\" | translate }}\n    </button>\n\n    <ng-container *ngIf=\"customActions$ | async as customActions\">\n      <ng-container *ngIf=\"!adaptiveMode; else adaptive\">\n        <button\n          [qdMenuButton]=\"customActions\"\n          [autoSize]=\"false\"\n          [data-test-id]=\"'page-'\"\n          *ngIf=\"customActions.actions.length > 1; else singleButton\"\n          data-test-id=\"custom-button\"\n        >\n          {{ config?.customActionsLabel?.i18n || \"i18n.qd.page.header.actions\" | translate }}\n        </button>\n\n        <ng-template #singleButton>\n          <ng-container *ngIf=\"(customActions$ | async).actions[0] as singleAction\">\n            <button\n              qdButton\n              *ngIf=\"singleAction.handler && !singleAction.isHidden\"\n              [disabled]=\"singleAction.isDisabled\"\n              (click)=\"singleAction.handler()\"\n              data-test-id=\"custom-button\"\n            >\n              {{ singleAction.label?.i18n | translate }}\n            </button>\n          </ng-container>\n        </ng-template>\n      </ng-container>\n\n      <ng-template #adaptive>\n        <button\n          *ngIf=\"(customActions$ | async)?.actions.length >= 1\"\n          type=\"button\"\n          class=\"adaptive-menu-button\"\n          [qdPopoverOnClick]=\"menu\"\n          [qdPopoverCloseStrategy]=\"'onEveryClick'\"\n          [qdPopoverStopPropagation]=\"true\"\n          [qdPopoverMinWidth]=\"160\"\n        >\n          <qd-icon icon=\"overflowMenuVertical\"></qd-icon>\n        </button>\n\n        <ng-template #menu>\n          <button\n            *ngFor=\"let action of customActions.actions; let i = index\"\n            class=\"adaptive-menu-entry\"\n            type=\"button\"\n            [disabled]=\"action.isDisabled\"\n            (click)=\"action.handler()\"\n          >\n            {{ action.label.i18n | translate }}\n          </button>\n        </ng-template>\n      </ng-template>\n    </ng-container>\n  </div>\n</div>\n\n<div class=\"object-header-facets\" [ngClass]=\"{ amongThemselves: adaptiveMode && !facetsCollapsed }\">\n  <ng-container *ngIf=\"pageObjectData$ | async as data\">\n    <div\n      class=\"object-header-facet\"\n      *ngFor=\"let facet of headerFacets | slice : 0 : (adaptiveMode && facetsCollapsed ? 2 : headerFacets?.length ?? 0)\"\n      [attr.data-test-id]=\"testId + '-facet-' + facet.name\"\n    >\n      <div class=\"facet-label\">{{ facet.label.i18n | translate }}</div>\n      <qd-dynamic-facet class=\"dynamic-facet\" [facet]=\"facet\" [data]=\"data\"></qd-dynamic-facet>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"!config.hideContexts && contexts$ | async as contexts\">\n    <div\n      class=\"object-header-facet\"\n      *ngFor=\"\n        let context of contexts\n          | slice : 0 : (adaptiveMode && facetsCollapsed ? 2 - (headerFacets?.length ?? 0) : contexts?.length);\n        let index = index;\n        let first = first\n      \"\n      [ngClass]=\"{ hasDivider: headerFacets && first, adaptiveFirst: headerFacets && adaptiveMode && first }\"\n    >\n      <div class=\"facet-label\">{{ context.label | translate }}</div>\n\n      <span *ngIf=\"context.value.length === 0\" class=\"no-selected-context\">{{\n        \"i18n.qd.page.context.noSelectionPlaceholder\" | translate\n      }}</span>\n\n      <span *ngIf=\"context.value.length !== 0\">\n        <qd-chip state=\"none\" [close]=\"isContextSelectable\" (closeClickEmitter)=\"clearContext(context.context)\">\n          <ng-container *ngFor=\"let val of context.value; let last = last\">\n            {{ val.label.i18n | translate }}<span *ngIf=\"!last\">, </span>\n          </ng-container>\n        </qd-chip>\n      </span>\n\n      <span *ngIf=\"isContextSelectable && (!facetsCollapsed || !adaptiveMode)\" class=\"select-button\">\n        <button\n          qdButton\n          qdButtonLink\n          type=\"button\"\n          (click)=\"changeContext(context.context, context.selection, $event)\"\n          [data-test-id]=\"'object-header-select-context-' + context.context.id\"\n        >\n          {{\n            context.value.length !== 0\n              ? (\"i18n.qd.page.context.button.change\" | translate)\n              : (\"i18n.qd.page.context.button.select\" | translate)\n          }}\n        </button>\n      </span>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"contexts$ | async as togglerContexts\">\n    <span\n      class=\"facets-toggler\"\n      [attr.data-test-id]=\"testId + '-facets-toggler'\"\n      *ngIf=\"adaptiveMode && headerFacets?.length + togglerContexts.length > 2\"\n    >\n      <span *ngIf=\"facetsCollapsed\">+{{ headerFacets.length + togglerContexts.length - 2 }}</span>\n      <button qdIconButton [data-test-id]=\"'toggle-button'\">\n        <qd-icon [icon]=\"facetsCollapsed ? 'ctrlDown' : 'ctrlTop'\"></qd-icon>\n      </button>\n    </span>\n  </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;justify-content:space-between;padding:1.25rem;border-bottom:.125rem solid rgb(213,213,213);background:#fff;gap:1.25rem}@media (max-width: 599.98px){:host{padding:1.25rem .9375rem}}:host .object-header-top{display:flex;align-items:flex-start;justify-content:space-between}:host .object-header-top .object-header-title{padding:2px;color:#171717;font-size:1.3125rem;font-weight:500}:host .object-header-top .object-header-toolbar{display:flex;align-items:center;column-gap:.5rem}:host .object-header-top .object-header-toolbar .button-icon{background:none}:host .object-header-top .object-header-toolbar .button-icon+.button-icon{margin-left:-.5rem}:host .object-header-top .object-header-toolbar .header-action-icon{color:#14516f;cursor:pointer;font-size:1.5rem}:host.in-dialog .object-header-toolbar{padding-right:2.5rem}:host .object-header-facets{position:relative;display:flex;flex-wrap:wrap;font-size:1.125rem;gap:1.25rem}:host .object-header-facets .object-header-facet{display:flex;min-width:3.75rem;flex-direction:column}:host .object-header-facets .object-header-facet.hasDivider{padding-left:1.25rem;border-left:.0625rem solid rgb(117,117,117)}:host .object-header-facets .object-header-facet.adaptiveFirst{padding-top:1.25rem}:host .object-header-facets .object-header-facet .facet-label{display:block;margin-bottom:0;color:#757575;font-size:.875rem;padding-bottom:.375rem;font-weight:500}:host .object-header-facets .facets-toggler{position:absolute;top:0;right:0;display:flex;align-items:center;padding-right:.3125rem;font-size:.625rem;line-height:.625rem}:host .object-header-facets.amongThemselves{display:grid}:host .object-header-facets.amongThemselves .object-header-facet.hasDivider{padding-left:0;border-top:.0625rem solid rgb(117,117,117);border-left:none}.loading-overlay{position:absolute;z-index:10000;inset:0;display:flex;align-items:center;justify-content:center;background-color:#0003}.no-selected-context{height:1.625rem;color:#979797;font-size:.875rem;line-height:1.625rem}.select-button{margin-top:.25rem}.adaptive-menu-button{display:flex;background:unset;color:#454545;font-size:2rem}.adaptive-menu-button:hover,.adaptive-menu-button:focus{color:#000}.adaptive-menu-entry{display:block;overflow:hidden;width:100%;min-height:2.25rem;padding:0 1rem;background:#fff0;text-align:left;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: QdButtonComponent, selector: "button[qdButton], a[qdButton], button[qd-button]", inputs: ["disabled", "color", "icon", "data-test-id", "additionalInfo"] }, { kind: "directive", type: QdButtonGhostDirective, selector: "button[qdButtonGhost], a[qdButtonGhost]" }, { kind: "directive", type: QdButtonLinkDirective, selector: "button[qdButtonLink], a[qdButtonLink], button[qd-button-link]" }, { kind: "component", type: QdIconButtonComponent, selector: "button[qdIconButton], a[qdIconButton], button[qd-icon-button]", inputs: ["color", "data-test-id"] }, { kind: "component", type: QdMenuButtonComponent, selector: "button[qdMenuButton], a[qdMenuButton]", inputs: ["qdMenuButton", "data-test-id", "autoSize"] }, { kind: "component", type: QdChipComponent, selector: "qd-chip", inputs: ["state", "close", "data", "data-test-id"], outputs: ["closeClickEmitter"] }, { kind: "component", type: QdIconComponent, selector: "qd-icon", inputs: ["icon", "status"] }, { kind: "component", type: QdSpinnerComponent, selector: "qd-spinner" }, { kind: "directive", type: QdPopoverOnClickDirective, selector: "[qdPopoverOnClick]", inputs: ["qdPopoverOnClick", "qdPopoverPlacement", "qdPopoverOffsetX", "qdPopoverOffsetY", "qdPopoverCloseStrategy", "qdPopoverDisabled", "qdPopoverStopPropagation", "qdPopoverBackgroundColor", "qdPopoverMaxHeight", "qdPopoverMinWidth", "qdPopoverMaxWidth", "qdPopoverAutoSize", "qdPopoverEnableKeyControl", "qdPopoverFlipIntoViewport"], outputs: ["opened", "closed"], exportAs: ["qdPopoverOnClick"] }, { kind: "component", type: QdDynamicFacetComponent, selector: "qd-dynamic-facet", inputs: ["facet", "data"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageObjectHeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'qd-page-object-header', changeDetection: ChangeDetectionStrategy.OnPush, host: { '[style.borderBottom]': 'borderBottomStyle' }, standalone: false, template: "<div class=\"loading-overlay\" *ngIf=\"isLoading$ | async\"><qd-spinner></qd-spinner></div>\n\n<div class=\"object-header-top\">\n  <header class=\"object-header-title\">{{ config.title.i18n | translate }}</header>\n  <div class=\"object-header-toolbar\">\n    <button class=\"button-icon\" data-test-id=\"archive-button\">\n      <qd-icon\n        *ngIf=\"showArchive$ | async\"\n        (click)=\"archiveButton?.handler()\"\n        class=\"header-action-icon\"\n        [icon]=\"'resultNew'\"\n      ></qd-icon>\n    </button>\n\n    <button class=\"button-icon\" data-test-id=\"delete-button\">\n      <qd-icon\n        class=\"header-action-icon\"\n        *ngIf=\"showDelete$ | async\"\n        (click)=\"deleteButton?.handler()\"\n        [icon]=\"'trash'\"\n      ></qd-icon>\n    </button>\n\n    <button *ngIf=\"showEdit$ | async\" qdButton (click)=\"edit()\" data-test-id=\"edit-button\">\n      {{ editButton?.label?.i18n || \"i18n.qd.page.header.edit\" | translate }}\n    </button>\n\n    <button *ngIf=\"showCancel$ | async\" qdButton qdButtonGhost (click)=\"cancel()\" data-test-id=\"cancel-button\">\n      {{ cancelButton.label?.i18n || \"i18n.qd.page.header.cancel\" | translate }}\n    </button>\n\n    <button\n      *ngIf=\"showSave$ | async\"\n      qdButton\n      (click)=\"save()\"\n      data-test-id=\"save-button\"\n      [disabled]=\"($canSave | async) === false\"\n    >\n      {{ saveButton.label?.i18n || \"i18n.qd.page.header.save\" | translate }}\n    </button>\n\n    <ng-container *ngIf=\"customActions$ | async as customActions\">\n      <ng-container *ngIf=\"!adaptiveMode; else adaptive\">\n        <button\n          [qdMenuButton]=\"customActions\"\n          [autoSize]=\"false\"\n          [data-test-id]=\"'page-'\"\n          *ngIf=\"customActions.actions.length > 1; else singleButton\"\n          data-test-id=\"custom-button\"\n        >\n          {{ config?.customActionsLabel?.i18n || \"i18n.qd.page.header.actions\" | translate }}\n        </button>\n\n        <ng-template #singleButton>\n          <ng-container *ngIf=\"(customActions$ | async).actions[0] as singleAction\">\n            <button\n              qdButton\n              *ngIf=\"singleAction.handler && !singleAction.isHidden\"\n              [disabled]=\"singleAction.isDisabled\"\n              (click)=\"singleAction.handler()\"\n              data-test-id=\"custom-button\"\n            >\n              {{ singleAction.label?.i18n | translate }}\n            </button>\n          </ng-container>\n        </ng-template>\n      </ng-container>\n\n      <ng-template #adaptive>\n        <button\n          *ngIf=\"(customActions$ | async)?.actions.length >= 1\"\n          type=\"button\"\n          class=\"adaptive-menu-button\"\n          [qdPopoverOnClick]=\"menu\"\n          [qdPopoverCloseStrategy]=\"'onEveryClick'\"\n          [qdPopoverStopPropagation]=\"true\"\n          [qdPopoverMinWidth]=\"160\"\n        >\n          <qd-icon icon=\"overflowMenuVertical\"></qd-icon>\n        </button>\n\n        <ng-template #menu>\n          <button\n            *ngFor=\"let action of customActions.actions; let i = index\"\n            class=\"adaptive-menu-entry\"\n            type=\"button\"\n            [disabled]=\"action.isDisabled\"\n            (click)=\"action.handler()\"\n          >\n            {{ action.label.i18n | translate }}\n          </button>\n        </ng-template>\n      </ng-template>\n    </ng-container>\n  </div>\n</div>\n\n<div class=\"object-header-facets\" [ngClass]=\"{ amongThemselves: adaptiveMode && !facetsCollapsed }\">\n  <ng-container *ngIf=\"pageObjectData$ | async as data\">\n    <div\n      class=\"object-header-facet\"\n      *ngFor=\"let facet of headerFacets | slice : 0 : (adaptiveMode && facetsCollapsed ? 2 : headerFacets?.length ?? 0)\"\n      [attr.data-test-id]=\"testId + '-facet-' + facet.name\"\n    >\n      <div class=\"facet-label\">{{ facet.label.i18n | translate }}</div>\n      <qd-dynamic-facet class=\"dynamic-facet\" [facet]=\"facet\" [data]=\"data\"></qd-dynamic-facet>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"!config.hideContexts && contexts$ | async as contexts\">\n    <div\n      class=\"object-header-facet\"\n      *ngFor=\"\n        let context of contexts\n          | slice : 0 : (adaptiveMode && facetsCollapsed ? 2 - (headerFacets?.length ?? 0) : contexts?.length);\n        let index = index;\n        let first = first\n      \"\n      [ngClass]=\"{ hasDivider: headerFacets && first, adaptiveFirst: headerFacets && adaptiveMode && first }\"\n    >\n      <div class=\"facet-label\">{{ context.label | translate }}</div>\n\n      <span *ngIf=\"context.value.length === 0\" class=\"no-selected-context\">{{\n        \"i18n.qd.page.context.noSelectionPlaceholder\" | translate\n      }}</span>\n\n      <span *ngIf=\"context.value.length !== 0\">\n        <qd-chip state=\"none\" [close]=\"isContextSelectable\" (closeClickEmitter)=\"clearContext(context.context)\">\n          <ng-container *ngFor=\"let val of context.value; let last = last\">\n            {{ val.label.i18n | translate }}<span *ngIf=\"!last\">, </span>\n          </ng-container>\n        </qd-chip>\n      </span>\n\n      <span *ngIf=\"isContextSelectable && (!facetsCollapsed || !adaptiveMode)\" class=\"select-button\">\n        <button\n          qdButton\n          qdButtonLink\n          type=\"button\"\n          (click)=\"changeContext(context.context, context.selection, $event)\"\n          [data-test-id]=\"'object-header-select-context-' + context.context.id\"\n        >\n          {{\n            context.value.length !== 0\n              ? (\"i18n.qd.page.context.button.change\" | translate)\n              : (\"i18n.qd.page.context.button.select\" | translate)\n          }}\n        </button>\n      </span>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"contexts$ | async as togglerContexts\">\n    <span class=\"facets-toggler\" *ngIf=\"adaptiveMode && headerFacets?.length + togglerContexts.length > 2\">\n      <span *ngIf=\"facetsCollapsed\">+{{ headerFacets.length + togglerContexts.length - 2 }}</span>\n      <button qdIconButton [data-test-id]=\"'toggle-button'\">\n        <qd-icon [icon]=\"facetsCollapsed ? 'ctrlDown' : 'ctrlTop'\"></qd-icon>\n      </button>\n    </span>\n  </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;justify-content:space-between;padding:1.25rem;border-bottom:.125rem solid rgb(213,213,213);background:#fff;gap:1.25rem}@media (max-width: 599.98px){:host{padding:1.25rem .9375rem}}:host .object-header-top{display:flex;align-items:flex-start;justify-content:space-between}:host .object-header-top .object-header-title{padding:2px;color:#171717;font-size:1.3125rem;font-weight:500}:host .object-header-top .object-header-toolbar{display:flex;align-items:center;column-gap:.5rem}:host .object-header-top .object-header-toolbar .button-icon{background:none}:host .object-header-top .object-header-toolbar .button-icon+.button-icon{margin-left:-.5rem}:host .object-header-top .object-header-toolbar .header-action-icon{color:#14516f;cursor:pointer;font-size:1.5rem}:host.in-dialog .object-header-toolbar{padding-right:2.5rem}:host .object-header-facets{position:relative;display:flex;flex-wrap:wrap;font-size:1.125rem;gap:1.25rem}:host .object-header-facets .object-header-facet{display:flex;min-width:3.75rem;flex-direction:column}:host .object-header-facets .object-header-facet.hasDivider{padding-left:1.25rem;border-left:.0625rem solid rgb(117,117,117)}:host .object-header-facets .object-header-facet.adaptiveFirst{padding-top:1.25rem}:host .object-header-facets .object-header-facet .facet-label{display:block;margin-bottom:0;color:#757575;font-size:.875rem;padding-bottom:.375rem;font-weight:500}:host .object-header-facets .facets-toggler{position:absolute;top:0;right:0;display:flex;align-items:center;padding-right:.3125rem;font-size:.625rem;line-height:.625rem}:host .object-header-facets.amongThemselves{display:grid}:host .object-header-facets.amongThemselves .object-header-facet.hasDivider{padding-left:0;border-top:.0625rem solid rgb(117,117,117);border-left:none}.loading-overlay{position:absolute;z-index:10000;inset:0;display:flex;align-items:center;justify-content:center;background-color:#0003}.no-selected-context{height:1.625rem;color:#979797;font-size:.875rem;line-height:1.625rem}.select-button{margin-top:.25rem}.adaptive-menu-button{display:flex;background:unset;color:#454545;font-size:2rem}.adaptive-menu-button:hover,.adaptive-menu-button:focus{color:#000}.adaptive-menu-entry{display:block;overflow:hidden;width:100%;min-height:2.25rem;padding:0 1rem;background:#fff0;text-align:left;text-overflow:ellipsis;white-space:nowrap}\n"] }]
+            args: [{ selector: 'qd-page-object-header', changeDetection: ChangeDetectionStrategy.OnPush, host: { '[style.borderBottom]': 'borderBottomStyle' }, standalone: false, template: "<div class=\"loading-overlay\" *ngIf=\"isLoading$ | async\"><qd-spinner></qd-spinner></div>\n\n<div class=\"object-header-top\">\n  <header class=\"object-header-title\">{{ config.title.i18n | translate }}</header>\n  <div class=\"object-header-toolbar\">\n    <button class=\"button-icon\" data-test-id=\"archive-button\">\n      <qd-icon\n        *ngIf=\"showArchive$ | async\"\n        (click)=\"archiveButton?.handler()\"\n        class=\"header-action-icon\"\n        [icon]=\"'resultNew'\"\n      ></qd-icon>\n    </button>\n\n    <button class=\"button-icon\" data-test-id=\"delete-button\">\n      <qd-icon\n        class=\"header-action-icon\"\n        *ngIf=\"showDelete$ | async\"\n        (click)=\"deleteButton?.handler()\"\n        [icon]=\"'trash'\"\n      ></qd-icon>\n    </button>\n\n    <button *ngIf=\"showEdit$ | async\" qdButton (click)=\"edit()\" data-test-id=\"edit-button\">\n      {{ editButton?.label?.i18n || \"i18n.qd.page.header.edit\" | translate }}\n    </button>\n\n    <button *ngIf=\"showCancel$ | async\" qdButton qdButtonGhost (click)=\"cancel()\" data-test-id=\"cancel-button\">\n      {{ cancelButton.label?.i18n || \"i18n.qd.page.header.cancel\" | translate }}\n    </button>\n\n    <button\n      *ngIf=\"showSave$ | async\"\n      qdButton\n      (click)=\"save()\"\n      data-test-id=\"save-button\"\n      [disabled]=\"($canSave | async) === false\"\n    >\n      {{ saveButton.label?.i18n || \"i18n.qd.page.header.save\" | translate }}\n    </button>\n\n    <ng-container *ngIf=\"customActions$ | async as customActions\">\n      <ng-container *ngIf=\"!adaptiveMode; else adaptive\">\n        <button\n          [qdMenuButton]=\"customActions\"\n          [autoSize]=\"false\"\n          [data-test-id]=\"'page-'\"\n          *ngIf=\"customActions.actions.length > 1; else singleButton\"\n          data-test-id=\"custom-button\"\n        >\n          {{ config?.customActionsLabel?.i18n || \"i18n.qd.page.header.actions\" | translate }}\n        </button>\n\n        <ng-template #singleButton>\n          <ng-container *ngIf=\"(customActions$ | async).actions[0] as singleAction\">\n            <button\n              qdButton\n              *ngIf=\"singleAction.handler && !singleAction.isHidden\"\n              [disabled]=\"singleAction.isDisabled\"\n              (click)=\"singleAction.handler()\"\n              data-test-id=\"custom-button\"\n            >\n              {{ singleAction.label?.i18n | translate }}\n            </button>\n          </ng-container>\n        </ng-template>\n      </ng-container>\n\n      <ng-template #adaptive>\n        <button\n          *ngIf=\"(customActions$ | async)?.actions.length >= 1\"\n          type=\"button\"\n          class=\"adaptive-menu-button\"\n          [qdPopoverOnClick]=\"menu\"\n          [qdPopoverCloseStrategy]=\"'onEveryClick'\"\n          [qdPopoverStopPropagation]=\"true\"\n          [qdPopoverMinWidth]=\"160\"\n        >\n          <qd-icon icon=\"overflowMenuVertical\"></qd-icon>\n        </button>\n\n        <ng-template #menu>\n          <button\n            *ngFor=\"let action of customActions.actions; let i = index\"\n            class=\"adaptive-menu-entry\"\n            type=\"button\"\n            [disabled]=\"action.isDisabled\"\n            (click)=\"action.handler()\"\n          >\n            {{ action.label.i18n | translate }}\n          </button>\n        </ng-template>\n      </ng-template>\n    </ng-container>\n  </div>\n</div>\n\n<div class=\"object-header-facets\" [ngClass]=\"{ amongThemselves: adaptiveMode && !facetsCollapsed }\">\n  <ng-container *ngIf=\"pageObjectData$ | async as data\">\n    <div\n      class=\"object-header-facet\"\n      *ngFor=\"let facet of headerFacets | slice : 0 : (adaptiveMode && facetsCollapsed ? 2 : headerFacets?.length ?? 0)\"\n      [attr.data-test-id]=\"testId + '-facet-' + facet.name\"\n    >\n      <div class=\"facet-label\">{{ facet.label.i18n | translate }}</div>\n      <qd-dynamic-facet class=\"dynamic-facet\" [facet]=\"facet\" [data]=\"data\"></qd-dynamic-facet>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"!config.hideContexts && contexts$ | async as contexts\">\n    <div\n      class=\"object-header-facet\"\n      *ngFor=\"\n        let context of contexts\n          | slice : 0 : (adaptiveMode && facetsCollapsed ? 2 - (headerFacets?.length ?? 0) : contexts?.length);\n        let index = index;\n        let first = first\n      \"\n      [ngClass]=\"{ hasDivider: headerFacets && first, adaptiveFirst: headerFacets && adaptiveMode && first }\"\n    >\n      <div class=\"facet-label\">{{ context.label | translate }}</div>\n\n      <span *ngIf=\"context.value.length === 0\" class=\"no-selected-context\">{{\n        \"i18n.qd.page.context.noSelectionPlaceholder\" | translate\n      }}</span>\n\n      <span *ngIf=\"context.value.length !== 0\">\n        <qd-chip state=\"none\" [close]=\"isContextSelectable\" (closeClickEmitter)=\"clearContext(context.context)\">\n          <ng-container *ngFor=\"let val of context.value; let last = last\">\n            {{ val.label.i18n | translate }}<span *ngIf=\"!last\">, </span>\n          </ng-container>\n        </qd-chip>\n      </span>\n\n      <span *ngIf=\"isContextSelectable && (!facetsCollapsed || !adaptiveMode)\" class=\"select-button\">\n        <button\n          qdButton\n          qdButtonLink\n          type=\"button\"\n          (click)=\"changeContext(context.context, context.selection, $event)\"\n          [data-test-id]=\"'object-header-select-context-' + context.context.id\"\n        >\n          {{\n            context.value.length !== 0\n              ? (\"i18n.qd.page.context.button.change\" | translate)\n              : (\"i18n.qd.page.context.button.select\" | translate)\n          }}\n        </button>\n      </span>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"contexts$ | async as togglerContexts\">\n    <span\n      class=\"facets-toggler\"\n      [attr.data-test-id]=\"testId + '-facets-toggler'\"\n      *ngIf=\"adaptiveMode && headerFacets?.length + togglerContexts.length > 2\"\n    >\n      <span *ngIf=\"facetsCollapsed\">+{{ headerFacets.length + togglerContexts.length - 2 }}</span>\n      <button qdIconButton [data-test-id]=\"'toggle-button'\">\n        <qd-icon [icon]=\"facetsCollapsed ? 'ctrlDown' : 'ctrlTop'\"></qd-icon>\n      </button>\n    </span>\n  </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;justify-content:space-between;padding:1.25rem;border-bottom:.125rem solid rgb(213,213,213);background:#fff;gap:1.25rem}@media (max-width: 599.98px){:host{padding:1.25rem .9375rem}}:host .object-header-top{display:flex;align-items:flex-start;justify-content:space-between}:host .object-header-top .object-header-title{padding:2px;color:#171717;font-size:1.3125rem;font-weight:500}:host .object-header-top .object-header-toolbar{display:flex;align-items:center;column-gap:.5rem}:host .object-header-top .object-header-toolbar .button-icon{background:none}:host .object-header-top .object-header-toolbar .button-icon+.button-icon{margin-left:-.5rem}:host .object-header-top .object-header-toolbar .header-action-icon{color:#14516f;cursor:pointer;font-size:1.5rem}:host.in-dialog .object-header-toolbar{padding-right:2.5rem}:host .object-header-facets{position:relative;display:flex;flex-wrap:wrap;font-size:1.125rem;gap:1.25rem}:host .object-header-facets .object-header-facet{display:flex;min-width:3.75rem;flex-direction:column}:host .object-header-facets .object-header-facet.hasDivider{padding-left:1.25rem;border-left:.0625rem solid rgb(117,117,117)}:host .object-header-facets .object-header-facet.adaptiveFirst{padding-top:1.25rem}:host .object-header-facets .object-header-facet .facet-label{display:block;margin-bottom:0;color:#757575;font-size:.875rem;padding-bottom:.375rem;font-weight:500}:host .object-header-facets .facets-toggler{position:absolute;top:0;right:0;display:flex;align-items:center;padding-right:.3125rem;font-size:.625rem;line-height:.625rem}:host .object-header-facets.amongThemselves{display:grid}:host .object-header-facets.amongThemselves .object-header-facet.hasDivider{padding-left:0;border-top:.0625rem solid rgb(117,117,117);border-left:none}.loading-overlay{position:absolute;z-index:10000;inset:0;display:flex;align-items:center;justify-content:center;background-color:#0003}.no-selected-context{height:1.625rem;color:#979797;font-size:.875rem;line-height:1.625rem}.select-button{margin-top:.25rem}.adaptive-menu-button{display:flex;background:unset;color:#454545;font-size:2rem}.adaptive-menu-button:hover,.adaptive-menu-button:focus{color:#000}.adaptive-menu-entry{display:block;overflow:hidden;width:100%;min-height:2.25rem;padding:0 1rem;background:#fff0;text-align:left;text-overflow:ellipsis;white-space:nowrap}\n"] }]
         }], ctorParameters: () => [], propDecorators: { config: [{
                 type: Input,
                 args: [{ required: true }]
@@ -31627,7 +31457,6 @@ class QdPageComponent {
     bottomOffset$ = inject(QD_SAFE_BOTTOM_OFFSET, { optional: true });
     dialogRef = inject(DialogRef, { optional: true });
     navigationInterceptor = inject(QdPageNavigationInterceptorService);
-    injector = inject(Injector);
     confirmationDialogService = inject(QdConfirmationDialogOpenerService);
     /**
      * This property defines the configuration for the QdPage component, including the page type,
@@ -31824,10 +31653,7 @@ class QdPageComponent {
             QdPageCommitActionExecutor.execute(action, values, {
                 formGroupManager: this.formGroupManagerService,
                 navigationInterceptor: this.navigationInterceptor,
-                destroyed$: this._destroyed$,
-                scheduleFrameworkRebuildStop: () => afterNextRender(() => this.formGroupManagerService.stopAdoptingFrameworkRebuild(), {
-                    injector: this.injector
-                })
+                destroyed$: this._destroyed$
             });
         };
     }
@@ -31939,10 +31765,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
  * - Snapshots store only raw values and are taken by the page/header workflow (e.g. on init, edit, save). The confirmation dialog may restore all registered form groups from the snapshot.
  * - FormArrays are restored with dynamic resizing (length is aligned to snapshot before values are reset).
  *
- * ### **Filling a form right after connecting it**
- * - You can fill a connected form right after registration — e.g. an `effect` that adds controls or pushes `FormArray` rows. This first fill is the form's starting point, not a user change.
- * - So loading data into a fresh form never triggers a false "unsaved changes" prompt. Only later edits count.
- *
  * ### **Page-Dialog (FullWidth) – Unsaved-Changes Close Contract**
  * - When a QdPage is embedded in a full-width page dialog, the directive’s registered form groups are also used to guard dialog closing.
  * - The page dialog can only close (e.g. via ESC or backdrop) if no unsaved changes are detected ($hasValuesChanged() is false).
@@ -31955,10 +31777,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
  * ```html
  * <qd-page [config]="pageConfig">
  *   <qd-section [config]="sectionConfig">
- *     <qd-grid
- *        qdConnectFormStateToPage="myFormGroup"
- *        [formGroup]="myFormGroup">
- *          My Section
+ *     <qd-grid [formGroup]="myFormGroup" qdConnectFormStateToPage="myFormGroup">
+ *       My Section
  *     </qd-grid>
  *   </qd-section>
  * </qd-page>
@@ -31978,36 +31798,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
 class QdConnectFormStateToPageDirective {
     formGroupManagerService = inject(QdFormGroupManagerService, { optional: true });
     formGroupDirective = inject(FormGroupDirective, { host: true, optional: true });
-    closeInitialBuildupHandle;
     /**
      * This key is used to manage and track the form state within the page. It has to be unique for each FormGroup Connector. Use the property name of the FormGroup in your component.
      */
     qdConnectFormStateToPage;
     ngOnInit() {
+        if (!this.isValid())
+            return;
         const formGroup = this.formGroupDirective?.control;
-        if (!formGroup) {
+        if (formGroup && this.qdConnectFormStateToPage) {
+            this.formGroupManagerService.setFormGroup(this.qdConnectFormStateToPage, formGroup);
+        }
+    }
+    ngOnDestroy() {
+        this.formGroupManagerService?.tryRemoveFormGroup(this.qdConnectFormStateToPage);
+    }
+    isValid() {
+        const hasFormGroup = this.formGroupDirective?.control;
+        if (!hasFormGroup) {
             console.error('Quadrel Framework | QdConnectFormStateToPage - Either a [formGroup] binding or <qd-quick-edit> with a FormGroup is required.');
-            return;
+            return false;
         }
         if (!this.formGroupManagerService) {
             console.error('Quadrel Framework | QdConnectFormStateToPage - The connector must be used within <qd-page>.');
-            return;
+            return false;
         }
         if (!this.formGroupManagerService.isFormGroupKeyUnique(this.qdConnectFormStateToPage)) {
             console.error(`Quadrel Framework | QdConnectFormStateToPage - The FormGroup key "${this.qdConnectFormStateToPage}" is not unique.`);
-            return;
+            return false;
         }
-        this.formGroupManagerService.setFormGroup(this.qdConnectFormStateToPage, formGroup);
-        this.scheduleInitialBaseline(this.formGroupManagerService);
-    }
-    ngOnDestroy() {
-        if (this.closeInitialBuildupHandle)
-            clearTimeout(this.closeInitialBuildupHandle);
-        this.formGroupManagerService?.tryRemoveFormGroup(this.qdConnectFormStateToPage);
-    }
-    scheduleInitialBaseline(manager) {
-        const key = this.qdConnectFormStateToPage;
-        this.closeInitialBuildupHandle = setTimeout(() => manager.endInitialBuildup(key));
+        return true;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdConnectFormStateToPageDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.18", type: QdConnectFormStateToPageDirective, isStandalone: false, selector: "[qdConnectFormStateToPage]", inputs: { qdConnectFormStateToPage: "qdConnectFormStateToPage" }, ngImport: i0 });