@quadrel-enterprise-ui/framework 20.26.0 → 20.26.2

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, isDevMode, QueryList, CUSTOM_ELEMENTS_SCHEMA, provideAppInitializer, TemplateRef } 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';
@@ -8411,10 +8411,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                 }]
         }] });
 
+/**
+ * Focuses its host element once, after the initial view init, when `qdAutofocus` is `true`.
+ *
+ * Init-only by design: the input is read in `ngAfterViewInit` only. A later `false -> true`
+ * change on an already-rendered element is intentionally ignored to avoid stealing focus
+ * mid-interaction (this mirrors the native `autofocus` attribute). An element that appears
+ * later (e.g. via `*ngIf`) still autofocuses, because `ngAfterViewInit` runs when it is created.
+ *
+ * Coordinated app-wide through {@link QdAutofocusService}: only one element may autofocus per
+ * view; the guard is released once the focused element blurs, so a newly opened view can
+ * autofocus again. Using it on more than one active element at a time logs a warning and is
+ * ignored for the surplus elements.
+ */
 class QdAutofocusDirective {
     autofocusService = inject(QdAutofocusService);
     elementRef = inject(ElementRef);
     qdAutofocus = false;
+    _timeoutId;
+    _blurHandler;
     ngAfterViewInit() {
         if (!this.qdAutofocus)
             return;
@@ -8423,14 +8438,24 @@ class QdAutofocusDirective {
             return;
         }
         this.autofocusService.isAutofocusActivated = true;
-        setTimeout(() => {
-            this.elementRef.nativeElement.focus();
-            this.elementRef.nativeElement.addEventListener('blur', () => {
+        this._timeoutId = setTimeout(() => {
+            const element = this.elementRef.nativeElement;
+            if (!element.isConnected) {
                 this.autofocusService.isAutofocusActivated = false;
-            });
+                return;
+            }
+            element.focus();
+            this._blurHandler = () => {
+                this.autofocusService.isAutofocusActivated = false;
+            };
+            element.addEventListener('blur', this._blurHandler, { once: true });
         }, 0);
     }
     ngOnDestroy() {
+        if (this._timeoutId)
+            clearTimeout(this._timeoutId);
+        if (this._blurHandler)
+            this.elementRef.nativeElement.removeEventListener('blur', this._blurHandler);
         this.autofocusService.isAutofocusActivated = false;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdAutofocusDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
@@ -30167,8 +30192,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
 /**
  * **QdPageTabHeader* renders the header of a single tab. It is used quadrel-internally.
  */
-class QdPageTabHeaderComponent extends CdkStepHeader {
-    STEP_STATE = STEP_STATE;
+class QdPageTabHeaderComponent {
     /** State of the given tab. */
     state;
     /** Label of the given tab. */
@@ -30185,24 +30209,21 @@ class QdPageTabHeaderComponent extends CdkStepHeader {
      * A static test ID for integration tests can be set.
      */
     testId;
-    constructor() {
-        const elementRef = inject(ElementRef);
-        super(elementRef);
-    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdPageTabHeaderComponent, isStandalone: true, selector: "qd-page-tab-header", inputs: { state: "state", label: "label", counters: "counters", index: "index", isSelected: "isSelected", isDisabled: "isDisabled", testId: ["data-test-id", "testId"] }, host: { properties: { "attr.data-test-id": "testId", "class.qd-tab-current": "isSelected && !isDisabled", "class.qd-tab-disabled": "isDisabled", "class.qd-tab-done": "state === STEP_STATE.DONE", "class.qd-tab-edit": "state === STEP_STATE.EDIT", "class.qd-tab-error": "state === STEP_STATE.ERROR" } }, usesInheritance: true, ngImport: i0, template: "<span class=\"qd-tab-caption\">\n  {{ label }}\n  <qd-page-tab-header-counters [counters]=\"counters\" [data-test-id]=\"testId + '-counters'\" />\n</span>\n", styles: [":host{position:relative;display:inline-flex;height:2.5rem;padding:.625rem 0;cursor:pointer;color:#757575;font-size:14px;font-weight:400;line-height:18px}:host .qd-tab-caption{font-weight:500;white-space:nowrap}:host:hover,:host.qd-tab-current{color:#069}:host.qd-tab-current .qd-tab-caption{position:relative}:host.qd-tab-current .qd-tab-caption:after{position:absolute;bottom:-.6875rem;left:0;display:inline-block;width:100%;height:.25rem;background-color:#069;content:\"\"}:host.qd-tab-done,:host.qd-tab-edit{color:#171717}:host.qd-tab-error{color:#c70023}:host.qd-tab-disabled{color:#b4b4b4;cursor:default}:host.qd-tab-disabled:hover{color:#b4b4b4}\n"], dependencies: [{ kind: "component", type: QdPageTabHeaderCountersComponent, selector: "qd-page-tab-header-counters", inputs: ["counters", "data-test-id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdPageTabHeaderComponent, isStandalone: true, selector: "qd-page-tab-header", inputs: { state: "state", label: "label", counters: "counters", index: "index", isSelected: "isSelected", isDisabled: "isDisabled", testId: ["data-test-id", "testId"] }, host: { attributes: { "role": "tab" }, properties: { "attr.data-test-id": "testId", "class.qd-tab-current": "isSelected && !isDisabled", "class.qd-tab-disabled": "isDisabled", "class.qd-tab-done": "state === 'done'", "class.qd-tab-edit": "state === 'edit'", "class.qd-tab-error": "state === 'error'" } }, ngImport: i0, template: "<span class=\"qd-tab-caption\">\n  {{ label }}\n  <qd-page-tab-header-counters [counters]=\"counters\" [data-test-id]=\"testId + '-counters'\" />\n</span>\n", styles: [":host{position:relative;display:inline-flex;height:2.5rem;padding:.625rem 0;cursor:pointer;color:#757575;font-size:14px;font-weight:400;line-height:18px}:host .qd-tab-caption{font-weight:500;white-space:nowrap}:host:hover,:host.qd-tab-current{color:#069}:host.qd-tab-current .qd-tab-caption{position:relative}:host.qd-tab-current .qd-tab-caption:after{position:absolute;bottom:-.6875rem;left:0;display:inline-block;width:100%;height:.25rem;background-color:#069;content:\"\"}:host.qd-tab-done,:host.qd-tab-edit{color:#171717}:host.qd-tab-error{color:#c70023}:host.qd-tab-disabled{color:#b4b4b4;cursor:default}:host.qd-tab-disabled:hover{color:#b4b4b4}\n"], dependencies: [{ kind: "component", type: QdPageTabHeaderCountersComponent, selector: "qd-page-tab-header-counters", inputs: ["counters", "data-test-id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'qd-page-tab-header', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[attr.data-test-id]': 'testId',
+                        role: 'tab',
                         '[class.qd-tab-current]': 'isSelected && !isDisabled',
                         '[class.qd-tab-disabled]': 'isDisabled',
-                        '[class.qd-tab-done]': 'state === STEP_STATE.DONE',
-                        '[class.qd-tab-edit]': 'state === STEP_STATE.EDIT',
-                        '[class.qd-tab-error]': 'state === STEP_STATE.ERROR'
+                        '[class.qd-tab-done]': "state === 'done'",
+                        '[class.qd-tab-edit]': "state === 'edit'",
+                        '[class.qd-tab-error]': "state === 'error'"
                     }, standalone: true, imports: [QdPageTabHeaderCountersComponent], template: "<span class=\"qd-tab-caption\">\n  {{ label }}\n  <qd-page-tab-header-counters [counters]=\"counters\" [data-test-id]=\"testId + '-counters'\" />\n</span>\n", styles: [":host{position:relative;display:inline-flex;height:2.5rem;padding:.625rem 0;cursor:pointer;color:#757575;font-size:14px;font-weight:400;line-height:18px}:host .qd-tab-caption{font-weight:500;white-space:nowrap}:host:hover,:host.qd-tab-current{color:#069}:host.qd-tab-current .qd-tab-caption{position:relative}:host.qd-tab-current .qd-tab-caption:after{position:absolute;bottom:-.6875rem;left:0;display:inline-block;width:100%;height:.25rem;background-color:#069;content:\"\"}:host.qd-tab-done,:host.qd-tab-edit{color:#171717}:host.qd-tab-error{color:#c70023}:host.qd-tab-disabled{color:#b4b4b4;cursor:default}:host.qd-tab-disabled:hover{color:#b4b4b4}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { state: [{
+        }], propDecorators: { state: [{
                 type: Input
             }], label: [{
                 type: Input
@@ -30219,13 +30240,112 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                 args: ['data-test-id']
             }] } });
 
+// @ts-strict-ignore
+/**
+ * The **QdPageTab** is a single tab inside the **QdPageTabs** within a **QdPage**.
+ */
+class QdPageTabComponent {
+    _pageTabs = inject(forwardRef(() => QdPageTabsComponent));
+    translate = inject(TranslateService);
+    /**
+     * Configuration of QdPageTabComponent.
+     *
+     * * @note The use of CDK attributes is not permitted. Please configure this component here.
+     */
+    config;
+    /** Form control for this tab. */
+    set tabControl(tabControl) {
+        this.stepControl = tabControl;
+    }
+    get tabControl() {
+        return this.stepControl;
+    }
+    infoBanners;
+    content;
+    stepControl;
+    interacted = false;
+    editable = true;
+    get completed() {
+        if (!this.interacted)
+            return false;
+        const control = this.tabControl;
+        if (!control)
+            return true;
+        return !control.invalid && !control.pending;
+    }
+    get hasError() {
+        return this.interacted && !!this.tabControl?.invalid;
+    }
+    _destroyed$ = new Subject();
+    select() {
+        const index = this._pageTabs.tabs.toArray().indexOf(this);
+        if (index >= 0)
+            this._pageTabs.selectedIndex = index;
+    }
+    ngOnInit() {
+        this.validateLabel();
+        if (this.tabControl)
+            this.initErrorCheck();
+    }
+    ngOnChanges(changes) {
+        ['label', 'errorMessage', 'state']
+            .filter(inputName => !!changes[inputName])
+            .forEach(inputName => this.blockCdkInput(inputName));
+    }
+    ngOnDestroy() {
+        this._destroyed$.complete();
+    }
+    blockCdkInput(inputName) {
+        throw new Error(`Quadrel Framework | QdPageTab - The use of the "${inputName}" attribute is not permitted. Please use QdPageTabConfig instead.`);
+    }
+    validateLabel() {
+        if (!this.config?.label?.i18n)
+            console.error('Quadrel Framework | QdPageTab - Please provide a label for the tab.');
+    }
+    initErrorCheck() {
+        this.tabControl.statusChanges.pipe(takeUntil$1(this._destroyed$)).subscribe(() => {
+            if (this.hasAnyError(this.tabControl)) {
+                this.interacted = true;
+            }
+            this._pageTabs._stateChanged();
+        });
+    }
+    hasAnyError(control) {
+        if (control.errors && control.touched)
+            return true;
+        if (control instanceof FormGroup) {
+            return Object.values(control.controls).some(control => this.hasAnyError(control));
+        }
+        if (control instanceof FormArray) {
+            return control.controls.some(control => this.hasAnyError(control));
+        }
+        return false;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdPageTabComponent, isStandalone: true, selector: "qd-page-tab", inputs: { config: "config", tabControl: "tabControl" }, queries: [{ propertyName: "infoBanners", predicate: QdPageInfoBannerComponent }], viewQueries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template>\n  <div class=\"page-info-banners\">\n    <ng-content select=\"qd-page-info-banner\"></ng-content>\n  </div>\n\n  <ng-content></ng-content>\n</ng-template>\n", styles: [".page-info-banners:has(>qd-page-info-banner:not(.qd-page-info-banner-empty)){padding:1rem 1.25rem .5rem;border-bottom:rgb(213,213,213) solid .0625rem;background-color:#fff}.page-info-banners>qd-page-info-banner:last-child{margin-bottom:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'qd-page-tab', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<ng-template>\n  <div class=\"page-info-banners\">\n    <ng-content select=\"qd-page-info-banner\"></ng-content>\n  </div>\n\n  <ng-content></ng-content>\n</ng-template>\n", styles: [".page-info-banners:has(>qd-page-info-banner:not(.qd-page-info-banner-empty)){padding:1rem 1.25rem .5rem;border-bottom:rgb(213,213,213) solid .0625rem;background-color:#fff}.page-info-banners>qd-page-info-banner:last-child{margin-bottom:0}\n"] }]
+        }], propDecorators: { config: [{
+                type: Input
+            }], tabControl: [{
+                type: Input
+            }], infoBanners: [{
+                type: ContentChildren,
+                args: [QdPageInfoBannerComponent]
+            }], content: [{
+                type: ViewChild,
+                args: [TemplateRef, { static: true }]
+            }] } });
+
 const TAB_PARAM_NAME = 'tab';
 const OWNED_PARAMS = [TAB_PARAM_NAME];
 const FEATURE_LABEL = { name: 'Page Tabs', plural: 'page tabs' };
 /**
  * Per-view adapter that syncs `QdPageTabsComponent` selection with the URL `?tab=` query
  * param via `QdRouterQueryParamHubService`. Reads on activation and selects the matching
- * tab (with fallback for unknown/disabled names), writes on `selectionChange`. Coordination,
+ * tab (with fallback for unknown/disabled names), writes on `tabSelection`. Coordination,
  * ownership, and write batching are delegated to the hub — see its JSDoc for details.
  * Behavior contracts live in `page-tabs-router-connector.service.spec.ts` and
  * `router-query-param-hub.integration.cy.ts`.
@@ -30236,9 +30356,9 @@ const FEATURE_LABEL = { name: 'Page Tabs', plural: 'page tabs' };
  * write pipeline (see commit 57f0a271a).
  *
  * Internal invariant: when the requested tab is unknown or disabled, `selectFallbackTab()`
- * writes the URL explicitly. CdkStepper does not emit `selectionChange` if the fallback is
- * already the selected step, so without the explicit write deep-links like `?tab=phantom`
- * would leave a stale param in the URL.
+ * writes the URL explicitly. `tabSelection` is not emitted if the fallback is already
+ * the selected tab, so without the explicit write deep-links like `?tab=phantom` would
+ * leave a stale param in the URL.
  */
 class QdPageTabsRouterConnectorService {
     _hub = inject(QdRouterQueryParamHubService);
@@ -30287,8 +30407,8 @@ class QdPageTabsRouterConnectorService {
     }
     subscribeToTabChanges() {
         const component = this._connectedComponent;
-        this._writeSubscription = component.selectionChange
-            .pipe(map(event => event.selectedStep?.config?.name), takeUntilDestroyed(this._destroyRef))
+        this._writeSubscription = component.tabSelection
+            .pipe(map(event => event.selectedTab?.config?.name), takeUntilDestroyed(this._destroyRef))
             .subscribe(name => this.writeUrl(name));
     }
     writeUrl(name) {
@@ -30524,10 +30644,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
  * - If an invalid tab name is provided in URL, the first available tab is selected
  * - If no tab parameter is present, the `selectedIndex` or first non-disabled tab is selected
  */
-class QdPageTabsComponent extends CdkStepper {
+class QdPageTabsComponent {
     footerService = inject(QdPageFooterService, { optional: true });
     pageStoreService = inject(QdPageStoreService);
     routerConnector = inject(QdPageTabsRouterConnectorService);
+    _changeDetectorRef = inject(ChangeDetectorRef);
+    destroyRef = inject(DestroyRef);
+    static _idCounter = 0;
+    _id = QdPageTabsComponent._idCounter++;
     get hasPageFooter() {
         return !!this.footerService;
     }
@@ -30540,23 +30664,45 @@ class QdPageTabsComponent extends CdkStepper {
      */
     testId = 'page-tabs';
     tabSelection = new EventEmitter();
+    _tabs;
+    linear = false;
+    _selectedIndex = 0;
     _viewonly;
-    destroyRef = inject(DestroyRef);
     get tabs() {
-        return this.steps;
+        return this._tabs;
     }
     get selected() {
-        return super.selected;
+        return this._tabs?.get(this._selectedIndex);
     }
-    set selected(step) {
-        super.selected = step;
+    set selected(tab) {
+        if (!tab)
+            return;
+        const index = this._tabs?.toArray().indexOf(tab);
+        if (index !== undefined && index >= 0) {
+            this.selectedIndex = index;
+        }
     }
-    constructor() {
-        const _dir = inject(Directionality, { optional: true });
-        const _changeDetectorRef = inject(ChangeDetectorRef);
-        const _elementRef = inject(ElementRef);
-        super(_dir, _changeDetectorRef, _elementRef);
-        this.mapSelectionChangeToTabSelectionOutput();
+    get selectedIndex() {
+        return this._selectedIndex;
+    }
+    set selectedIndex(newIndex) {
+        if (newIndex === this._selectedIndex)
+            return;
+        const prevIndex = this._selectedIndex;
+        const prevTab = this._tabs?.get(prevIndex);
+        if (prevTab?.tabControl) {
+            prevTab.interacted = true;
+        }
+        this._selectedIndex = newIndex;
+        if (this._tabs) {
+            this.tabSelection.emit({
+                selectedIndex: newIndex,
+                previouslySelectedIndex: prevIndex,
+                selectedTab: this._tabs.get(newIndex),
+                previouslySelectedTab: this._tabs.get(prevIndex)
+            });
+        }
+        this._changeDetectorRef.markForCheck();
     }
     ngOnInit() {
         this.linear = false;
@@ -30570,24 +30716,10 @@ class QdPageTabsComponent extends CdkStepper {
             .filter(inputName => !!changes[inputName])
             .forEach(inputName => this.blockCdkInput(inputName));
     }
-    _getIndicatorType(index, state) {
-        if (state)
-            return state;
-        const step = this.steps.get(index);
-        if (!step)
-            return 'number';
-        if (step.hasError)
-            return 'error';
-        if (step.completed)
-            return step.editable ? 'edit' : 'done';
-        return 'number';
-    }
     ngAfterContentInit() {
-        super.ngAfterContentInit();
-        this.tabs.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => this._stateChanged());
+        this._tabs.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => this._stateChanged());
     }
     ngAfterViewInit() {
-        super.ngAfterViewInit();
         setTimeout(() => {
             if (this.config?.connectWithRouter) {
                 this.configureBookmarkableTabs();
@@ -30596,9 +30728,42 @@ class QdPageTabsComponent extends CdkStepper {
             this.initializeTabSelection();
         });
     }
+    _stateChanged() {
+        this._changeDetectorRef.markForCheck();
+    }
+    _getIndicatorType(index) {
+        const tab = this._tabs.get(index);
+        if (!tab)
+            return 'number';
+        if (tab.hasError && !this._viewonly)
+            return 'error';
+        if (tab.completed)
+            return tab.editable ? 'edit' : 'done';
+        return 'number';
+    }
+    _getTabLabelId(i) {
+        return `qd-tabs-${this._id}-label-${i}`;
+    }
+    save() {
+        this.selected?.tabControl?.markAllAsTouched();
+        const tabControlValues = this._tabs.map(tab => tab.tabControl?.value);
+        this.config?.submitButton?.handler?.(tabControlValues);
+    }
+    selectTab(tab) {
+        if (tab.config?.isDisabled)
+            return;
+        tab.select();
+    }
+    isSubmitButtonShown() {
+        return this.config?.submitButton?.isHidden !== true && !this.footerService;
+    }
+    isSubmitButtonDisabled() {
+        return this.config?.submitButton?.isDisabled;
+    }
     initializeTabSelection() {
         if (this.config?.selectedIndex && this.isTabSelectable(this.config.selectedIndex)) {
-            this.selectedIndex = this.config.selectedIndex;
+            this._selectedIndex = this.config.selectedIndex;
+            this._changeDetectorRef.markForCheck();
             return;
         }
         this.selectFirstNotDisabledTab();
@@ -30607,19 +30772,20 @@ class QdPageTabsComponent extends CdkStepper {
         this.routerConnector.connectTabsWithRouter(this).pipe(takeUntilDestroyed(this.destroyRef)).subscribe();
     }
     isTabSelectable(index) {
-        const tab = this.tabs.get(index);
+        const tab = this._tabs.get(index);
         return !!tab && !tab.config.isDisabled;
     }
     /**
      * Selects the first tab that is not disabled.
      */
     selectFirstNotDisabledTab() {
-        this.tabs.some((tab, tabIndex) => {
+        this._tabs.some((tab, tabIndex) => {
             if (!tab.config.isDisabled) {
                 if (this.config) {
                     this.config.selectedIndex = tabIndex;
                 }
-                this.selectedIndex = tabIndex;
+                this._selectedIndex = tabIndex;
+                this._changeDetectorRef.markForCheck();
                 return true;
             }
             else {
@@ -30627,51 +30793,25 @@ class QdPageTabsComponent extends CdkStepper {
             }
         });
     }
-    save() {
-        this.selected?.tabControl?.markAllAsTouched();
-        const tabControlValues = this.tabs.map(tab => tab.tabControl?.value);
-        this.config?.submitButton?.handler?.(tabControlValues);
-    }
-    selectTab(tab) {
-        if (tab.config?.isDisabled)
-            return;
-        tab.select();
-    }
-    isSubmitButtonShown() {
-        return this.config?.submitButton?.isHidden !== true && !this.footerService;
-    }
-    isSubmitButtonDisabled() {
-        return this.config?.submitButton?.isDisabled;
-    }
-    _getTabLabelId(i) {
-        return this._getStepLabelId(i);
-    }
     blockCdkInput(inputName) {
         throw new Error(`Quadrel Framework | QdPageTabs - The use of the "${inputName}" attribute is not permitted. Please use QdPageTabsConfig instead.`);
     }
-    mapSelectionChangeToTabSelectionOutput() {
-        this.selectionChange.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(selectionEvent => {
-            this.tabSelection.emit({
-                selectedIndex: selectionEvent.selectedIndex,
-                previouslySelectedIndex: selectionEvent.previouslySelectedIndex,
-                selectedTab: selectionEvent.selectedStep,
-                previouslySelectedTab: selectionEvent.previouslySelectedStep
-            });
-        });
-    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdPageTabsComponent, isStandalone: true, selector: "qd-page-tabs", inputs: { config: "config", testId: ["data-test-id", "testId"] }, outputs: { tabSelection: "tabSelection" }, host: { properties: { "class.standalone": "!hasPageFooter" }, classAttribute: "qd-tabs" }, providers: [{ provide: CdkStepper, useExisting: QdPageTabsComponent }, QdPageTabsRouterConnectorService], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"qd-tabs-items-container\" [ngClass]=\"{ scrollable: config?.scrollabe }\">\n  <qd-page-tab-header\n    *ngFor=\"let tab of tabs; let i = index\"\n    (click)=\"selectTab(tab)\"\n    [id]=\"_getTabLabelId(i)\"\n    [index]=\"i\"\n    [state]=\"_getIndicatorType(i, tab.state)\"\n    [label]=\"tab.config.label.i18n | translate\"\n    [counters]=\"tab.config.counters\"\n    [isSelected]=\"selectedIndex === i\"\n    [isDisabled]=\"tab.config?.isDisabled\"\n    [data-test-id]=\"testId + '-header' + '-' + i\"\n  >\n  </qd-page-tab-header>\n</div>\n\n<div class=\"tabs-content\">\n  <ng-container *ngIf=\"!selected?.config?.isDisabled\" [ngTemplateOutlet]=\"selected?.content\"></ng-container>\n</div>\n\n<div class=\"qd-tabs-action-area\" *ngIf=\"isSubmitButtonShown()\">\n  <button qdButton (click)=\"save()\" [disabled]=\"isSubmitButtonDisabled()\" [data-test-id]=\"testId + '-submit'\">\n    {{ config?.submitButton?.i18n || \"i18n.qd.tabs.button.submit\" | translate }}\n  </button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host.standalone{height:calc(100% - 50px)}:host .qd-tabs-items-container{display:flex;width:100%;flex-direction:row;flex-wrap:wrap;padding:0 1.25rem;border-bottom:.125rem solid rgb(213,213,213);background-color:#fff;gap:0 .9375rem}@media (max-width: 599.98px){:host .qd-tabs-items-container{padding:0 .9375rem}}@media (max-width: 1279.98px){:host .qd-tabs-items-container.scrollable{flex-wrap:nowrap;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none}}:host .tabs-content{flex:1 1 auto}:host .qd-tabs-action-area{display:flex;width:100%;height:50px;justify-content:flex-end}:host .qd-tabs-action-area button{margin-right:1.25rem}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: QdPageTabHeaderComponent, selector: "qd-page-tab-header", inputs: ["state", "label", "counters", "index", "isSelected", "isDisabled", "data-test-id"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: QdButtonModule }, { kind: "component", type: QdButtonComponent, selector: "button[qdButton], a[qdButton], button[qd-button]", inputs: ["disabled", "color", "icon", "data-test-id", "additionalInfo"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdPageTabsComponent, isStandalone: true, selector: "qd-page-tabs", inputs: { config: "config", testId: ["data-test-id", "testId"] }, outputs: { tabSelection: "tabSelection" }, host: { properties: { "class.standalone": "!footerService" }, classAttribute: "qd-tabs" }, providers: [QdPageTabsRouterConnectorService], queries: [{ propertyName: "_tabs", predicate: i0.forwardRef(() => QdPageTabComponent) }], usesOnChanges: true, ngImport: i0, template: "<div class=\"qd-tabs-items-container\" [ngClass]=\"{ scrollable: config?.scrollabe }\">\n  <qd-page-tab-header\n    *ngFor=\"let tab of tabs; let i = index\"\n    (click)=\"selectTab(tab)\"\n    [id]=\"_getTabLabelId(i)\"\n    [index]=\"i\"\n    [state]=\"_getIndicatorType(i)\"\n    [label]=\"tab.config.label.i18n | translate\"\n    [counters]=\"tab.config.counters\"\n    [isSelected]=\"selectedIndex === i\"\n    [isDisabled]=\"tab.config?.isDisabled\"\n    [data-test-id]=\"testId + '-header' + '-' + i\"\n  >\n  </qd-page-tab-header>\n</div>\n\n<div class=\"tabs-content\">\n  <ng-container *ngIf=\"!selected?.config?.isDisabled\" [ngTemplateOutlet]=\"selected?.content\"></ng-container>\n</div>\n\n<div class=\"qd-tabs-action-area\" *ngIf=\"isSubmitButtonShown()\">\n  <button qdButton (click)=\"save()\" [disabled]=\"isSubmitButtonDisabled()\" [data-test-id]=\"testId + '-submit'\">\n    {{ config?.submitButton?.i18n || \"i18n.qd.tabs.button.submit\" | translate }}\n  </button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host.standalone{height:calc(100% - 50px)}:host .qd-tabs-items-container{display:flex;width:100%;flex-direction:row;flex-wrap:wrap;padding:0 1.25rem;border-bottom:.125rem solid rgb(213,213,213);background-color:#fff;gap:0 .9375rem}@media (max-width: 599.98px){:host .qd-tabs-items-container{padding:0 .9375rem}}@media (max-width: 1279.98px){:host .qd-tabs-items-container.scrollable{flex-wrap:nowrap;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none}}:host .tabs-content{flex:1 1 auto}:host .qd-tabs-action-area{display:flex;width:100%;height:50px;justify-content:flex-end}:host .qd-tabs-action-area button{margin-right:1.25rem}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: QdPageTabHeaderComponent, selector: "qd-page-tab-header", inputs: ["state", "label", "counters", "index", "isSelected", "isDisabled", "data-test-id"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: QdButtonModule }, { kind: "component", type: QdButtonComponent, selector: "button[qdButton], a[qdButton], button[qd-button]", inputs: ["disabled", "color", "icon", "data-test-id", "additionalInfo"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'qd-page-tabs', providers: [{ provide: CdkStepper, useExisting: QdPageTabsComponent }, QdPageTabsRouterConnectorService], changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'qd-tabs', '[class.standalone]': '!hasPageFooter' }, standalone: true, imports: [NgFor, NgIf, NgTemplateOutlet, QdPageTabHeaderComponent, TranslateModule, QdButtonModule, CommonModule], template: "<div class=\"qd-tabs-items-container\" [ngClass]=\"{ scrollable: config?.scrollabe }\">\n  <qd-page-tab-header\n    *ngFor=\"let tab of tabs; let i = index\"\n    (click)=\"selectTab(tab)\"\n    [id]=\"_getTabLabelId(i)\"\n    [index]=\"i\"\n    [state]=\"_getIndicatorType(i, tab.state)\"\n    [label]=\"tab.config.label.i18n | translate\"\n    [counters]=\"tab.config.counters\"\n    [isSelected]=\"selectedIndex === i\"\n    [isDisabled]=\"tab.config?.isDisabled\"\n    [data-test-id]=\"testId + '-header' + '-' + i\"\n  >\n  </qd-page-tab-header>\n</div>\n\n<div class=\"tabs-content\">\n  <ng-container *ngIf=\"!selected?.config?.isDisabled\" [ngTemplateOutlet]=\"selected?.content\"></ng-container>\n</div>\n\n<div class=\"qd-tabs-action-area\" *ngIf=\"isSubmitButtonShown()\">\n  <button qdButton (click)=\"save()\" [disabled]=\"isSubmitButtonDisabled()\" [data-test-id]=\"testId + '-submit'\">\n    {{ config?.submitButton?.i18n || \"i18n.qd.tabs.button.submit\" | translate }}\n  </button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host.standalone{height:calc(100% - 50px)}:host .qd-tabs-items-container{display:flex;width:100%;flex-direction:row;flex-wrap:wrap;padding:0 1.25rem;border-bottom:.125rem solid rgb(213,213,213);background-color:#fff;gap:0 .9375rem}@media (max-width: 599.98px){:host .qd-tabs-items-container{padding:0 .9375rem}}@media (max-width: 1279.98px){:host .qd-tabs-items-container.scrollable{flex-wrap:nowrap;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none}}:host .tabs-content{flex:1 1 auto}:host .qd-tabs-action-area{display:flex;width:100%;height:50px;justify-content:flex-end}:host .qd-tabs-action-area button{margin-right:1.25rem}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { config: [{
+            args: [{ selector: 'qd-page-tabs', providers: [QdPageTabsRouterConnectorService], changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'qd-tabs', '[class.standalone]': '!footerService' }, standalone: true, imports: [NgFor, NgIf, NgTemplateOutlet, QdPageTabHeaderComponent, TranslateModule, QdButtonModule, CommonModule], template: "<div class=\"qd-tabs-items-container\" [ngClass]=\"{ scrollable: config?.scrollabe }\">\n  <qd-page-tab-header\n    *ngFor=\"let tab of tabs; let i = index\"\n    (click)=\"selectTab(tab)\"\n    [id]=\"_getTabLabelId(i)\"\n    [index]=\"i\"\n    [state]=\"_getIndicatorType(i)\"\n    [label]=\"tab.config.label.i18n | translate\"\n    [counters]=\"tab.config.counters\"\n    [isSelected]=\"selectedIndex === i\"\n    [isDisabled]=\"tab.config?.isDisabled\"\n    [data-test-id]=\"testId + '-header' + '-' + i\"\n  >\n  </qd-page-tab-header>\n</div>\n\n<div class=\"tabs-content\">\n  <ng-container *ngIf=\"!selected?.config?.isDisabled\" [ngTemplateOutlet]=\"selected?.content\"></ng-container>\n</div>\n\n<div class=\"qd-tabs-action-area\" *ngIf=\"isSubmitButtonShown()\">\n  <button qdButton (click)=\"save()\" [disabled]=\"isSubmitButtonDisabled()\" [data-test-id]=\"testId + '-submit'\">\n    {{ config?.submitButton?.i18n || \"i18n.qd.tabs.button.submit\" | translate }}\n  </button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host.standalone{height:calc(100% - 50px)}:host .qd-tabs-items-container{display:flex;width:100%;flex-direction:row;flex-wrap:wrap;padding:0 1.25rem;border-bottom:.125rem solid rgb(213,213,213);background-color:#fff;gap:0 .9375rem}@media (max-width: 599.98px){:host .qd-tabs-items-container{padding:0 .9375rem}}@media (max-width: 1279.98px){:host .qd-tabs-items-container.scrollable{flex-wrap:nowrap;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none}}:host .tabs-content{flex:1 1 auto}:host .qd-tabs-action-area{display:flex;width:100%;height:50px;justify-content:flex-end}:host .qd-tabs-action-area button{margin-right:1.25rem}\n"] }]
+        }], propDecorators: { config: [{
                 type: Input
             }], testId: [{
                 type: Input,
                 args: ['data-test-id']
             }], tabSelection: [{
                 type: Output
+            }], _tabs: [{
+                type: ContentChildren,
+                args: [forwardRef(() => QdPageTabComponent)]
             }] } });
 
 class QdPageSubmitActionService {
@@ -34255,93 +34395,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                 }]
         }] });
 
-// @ts-strict-ignore
-/**
- * The **QdPageTab** is a single tab inside the **QdPageTabs** within a **QdPage**.
- */
-class QdPageTabComponent extends CdkStep {
-    translate = inject(TranslateService);
-    /**
-     * Configuration of QdPageTabComponent.
-     *
-     * * @note The use of CDK attributes is not permitted. Please configure this component here.
-     */
-    config;
-    /** Form control for this tab. */
-    set tabControl(tabControl) {
-        this.stepControl = tabControl;
-    }
-    get tabControl() {
-        return this.stepControl;
-    }
-    infoBanners;
-    _destroyed$ = new Subject();
-    constructor() {
-        const tabs = inject(QdPageTabsComponent);
-        const stepperOptions = inject(STEPPER_GLOBAL_OPTIONS, { optional: true });
-        super(tabs, stepperOptions);
-    }
-    ngOnInit() {
-        this.validateLabel();
-        if (this.tabControl)
-            this.initErrorCheck();
-    }
-    ngOnChanges(changes) {
-        super.ngOnChanges();
-        ['label', 'errorMessage', 'state']
-            .filter(inputName => !!changes[inputName])
-            .forEach(inputName => this.blockCdkInput(inputName));
-    }
-    ngOnDestroy() {
-        this._destroyed$.complete();
-    }
-    blockCdkInput(inputName) {
-        throw new Error(`Quadrel Framework | QdPageTab - The use of the "${inputName}" attribute is not permitted. Please use QdPageTabConfig instead.`);
-    }
-    validateLabel() {
-        if (!this.config?.label?.i18n)
-            console.error('Quadrel Framework | QdPageTab - Please provide a label for the tab.');
-    }
-    initErrorCheck() {
-        this.tabControl.statusChanges.pipe(takeUntil$1(this._destroyed$)).subscribe(() => {
-            if (this.hasAnyError(this.tabControl)) {
-                this.interacted = true;
-            }
-        });
-    }
-    hasAnyError(control) {
-        if (control.errors && control.touched)
-            return true;
-        if (control instanceof FormGroup) {
-            return Object.values(control.controls).some(control => this.hasAnyError(control));
-        }
-        if (control instanceof FormArray) {
-            return control.controls.some(control => this.hasAnyError(control));
-        }
-        return false;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdPageTabComponent, isStandalone: true, selector: "qd-page-tab", inputs: { config: "config", tabControl: "tabControl" }, providers: [
-            { provide: CdkStep, useExisting: QdPageTabComponent },
-            { provide: STEPPER_GLOBAL_OPTIONS, useValue: { showError: true } }
-        ], queries: [{ propertyName: "infoBanners", predicate: QdPageInfoBannerComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-template>\n  <div class=\"page-info-banners\">\n    <ng-content select=\"qd-page-info-banner\"></ng-content>\n  </div>\n\n  <ng-content></ng-content>\n</ng-template>\n", styles: [".page-info-banners:has(>qd-page-info-banner:not(.qd-page-info-banner-empty)){padding:1rem 1.25rem .5rem;border-bottom:rgb(213,213,213) solid .0625rem;background-color:#fff}.page-info-banners>qd-page-info-banner:last-child{margin-bottom:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'qd-page-tab', providers: [
-                        { provide: CdkStep, useExisting: QdPageTabComponent },
-                        { provide: STEPPER_GLOBAL_OPTIONS, useValue: { showError: true } }
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true // inherited by CdkStep
-                    , template: "<ng-template>\n  <div class=\"page-info-banners\">\n    <ng-content select=\"qd-page-info-banner\"></ng-content>\n  </div>\n\n  <ng-content></ng-content>\n</ng-template>\n", styles: [".page-info-banners:has(>qd-page-info-banner:not(.qd-page-info-banner-empty)){padding:1rem 1.25rem .5rem;border-bottom:rgb(213,213,213) solid .0625rem;background-color:#fff}.page-info-banners>qd-page-info-banner:last-child{margin-bottom:0}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { config: [{
-                type: Input
-            }], tabControl: [{
-                type: Input
-            }], infoBanners: [{
-                type: ContentChildren,
-                args: [QdPageInfoBannerComponent]
-            }] } });
-
 /**
  * **qdPageTabParameterize** turns the active page tab into the `tab` query parameter
  * (`?tab=<name>`).
@@ -34372,7 +34425,6 @@ class QdPageTabsModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabsModule, declarations: [QdPageTabsAdapterDirective], imports: [CommonModule,
             TranslateModule,
-            CdkStepperModule,
             QdButtonModule,
             QdIconModule,
             QdPageTabsComponent,
@@ -34381,7 +34433,6 @@ class QdPageTabsModule {
             QdPageTabHeaderCountersComponent], exports: [QdPageTabsComponent, QdPageTabComponent, QdPageTabsAdapterDirective] });
     static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabsModule, imports: [CommonModule,
             TranslateModule,
-            CdkStepperModule,
             QdButtonModule,
             QdIconModule,
             QdPageTabsComponent] });
@@ -34392,7 +34443,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                     imports: [
                         CommonModule,
                         TranslateModule,
-                        CdkStepperModule,
                         QdButtonModule,
                         QdIconModule,
                         QdPageTabsComponent,
@@ -35049,5 +35099,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { APP_ENVIRONMENT, AVAILABLE_ICONS, BACKEND_ERROR_CODES, MockLocaleDatePipe, NavigationTileComponent, NavigationTilesComponent, QD_DIALOG_CONFIRMATION_RESOLVER_TOKEN, QD_FILE_MANAGER_TOKEN, QD_FILE_UPLOAD_MANAGER_TOKEN, QD_FORM_OPTIONS_RESOLVER, QD_PAGE_OBJECT_RESOLVER_TOKEN, QD_PAGE_STEP_RESOLVER_TOKEN, QD_POPOVER_TOP_FIRST, QD_SAFE_BOTTOM_OFFSET, QD_TABLE_DATA_RESOLVER_TOKEN, QD_UPLOAD_HTTP_OPTIONS, QdButtonComponent, QdButtonGhostDirective, QdButtonGridComponent, QdButtonLinkDirective, QdButtonModule, QdButtonStackButtonComponent, QdButtonStackComponent, QdCheckboxChipsComponent, QdCheckboxComponent, QdCheckboxesComponent, QdChipComponent, QdChipModule, QdColumnAutoFillDirective, QdColumnBreakBeforeDirective, QdColumnDirective, QdColumnDisableResponsiveColspansDirective, QdColumnFullGridWidthDirective, QdColumnNextInSameRowDirective, QdColumnsDirective, QdColumnsDisableAutoFillDirective, QdColumnsDisableResponsiveColspansDirective, QdColumnsMaxDirective, QdCommentsComponent, QdCommentsModule, QdConnectFormStateToPageDirective, QdConnectorTableContextDirective, QdConnectorTableFilterDirective, QdConnectorTableSearchDirective, QdContactCardComponent, QdContactCardModule, QdContainerPairsCaptionComponent, QdContainerPairsContainerComponent, QdContainerPairsHeaderComponent, QdContainerPairsItemComponent, QdContainerPairsValueComponent, QdContextService, QdCoreModule, QdDatepickerComponent, QdDialogActionComponent, QdDialogAuthSessionEndComponent, QdDialogAuthSessionEndService, QdDialogComponent, QdDialogConfirmationComponent, QdDialogConfirmationErrorDirective, QdDialogConfirmationInfoDirective, QdDialogConfirmationSuccessDirective, QdDialogModule, QdDialogRecordStepperComponent, QdDialogService, QdDialogSize, QdDisabledDirective, QdDropdownComponent, QdFileCollectorComponent, QdFileCollectorModule, QdFileSizePipe$1 as QdFileSizePipe, QdFileUploadComponent, QdFileUploadService, QdFilterComponent, QdFilterFormItemsComponent, QdFilterModule, QdFilterRestParamBuilder, QdFilterService, QdFooterActionType, QdFormArray, QdFormBuilder, QdFormControl, QdFormGroup, QdFormModule, QdGridComponent, QdGridModule, QdHorizontalPairsCaptionComponent, QdHorizontalPairsComponent, QdHorizontalPairsItemComponent, QdHorizontalPairsValueComponent, QdIconButtonComponent, QdIconComponent, QdIconModule, QdImageComponent, QdImageModule, QdIndeterminateProgressBarComponent, QdInputComponent, QdListModule, QdMenuButtonComponent, QdMockBreakpointService, QdMockButtonComponent, QdMockButtonGhostDirective, QdMockButtonGridComponent, QdMockButtonLinkDirective, QdMockButtonModule, QdMockButtonStackButtonComponent, QdMockButtonStackComponent, QdMockCalendarComponent, QdMockCheckboxChipsComponent, QdMockCheckboxComponent, QdMockCheckboxesComponent, QdMockChipComponent, QdMockChipModule, QdMockColumnDirective, QdMockColumnsDirective, QdMockContactCardComponent, QdMockContactCardModule, QdMockContainerPairsCaptionComponent, QdMockContainerPairsContainerComponent, QdMockContainerPairsHeaderComponent, QdMockContainerPairsItemComponent, QdMockContainerPairsValueComponent, QdMockCoreModule, QdMockCounterBadgeComponent, QdMockDatepickerComponent, QdMockDisabledDirective, QdMockDropdownComponent, QdMockFileCollectorComponent, QdMockFileCollectorModule, QdMockFilterCategoryBooleanComponent, QdMockFilterCategoryComponent, QdMockFilterCategoryDateComponent, QdMockFilterCategoryDateRangeComponent, QdMockFilterCategoryFreeTextComponent, QdMockFilterCategorySelectComponent, QdMockFilterComponent, QdMockFilterFormItemsComponent, QdMockFilterItemBooleanComponent, QdMockFilterItemDateComponent, QdMockFilterItemDateRangeComponent, QdMockFilterItemFreeTextComponent, QdMockFilterItemMultiSelectComponent, QdMockFilterItemSingleSelectComponent, QdMockFilterModule, QdMockFilterService, QdMockFormErrorComponent, QdMockFormGroupErrorComponent, QdMockFormHintComponent, QdMockFormLabelComponent, QdMockFormReadonlyComponent, QdMockFormViewonlyComponent, QdMockFormsModule, QdMockGridModule, QdMockIconButtonComponent, QdMockIconComponent, QdMockIconModule, QdMockImageComponent, QdMockImageModule, QdMockIndeterminateProgressBarComponent, QdMockInputComponent, QdMockListModule, QdMockNavigationTileComponent, QdMockNavigationTilesComponent, QdMockNavigationTilesModule, QdMockNotificationComponent, QdMockNotificationContentComponent, QdMockNotificationsComponent, QdMockNotificationsModule, QdMockNotificationsService, QdMockPageComponent, QdMockPageModule, QdMockPercentageProgressBarComponent, QdMockPinCodeComponent, QdMockPlaceHolderModule, QdMockPopoverOnClickDirective, QdMockProgressBarModule, QdMockQdPlaceHolderComponent, QdMockRadioButtonsComponent, QdMockRwdDisabledDirective, QdMockSearchComponent, QdMockSearchModule, QdMockSectionComponent, QdMockSectionModule, QdMockShellComponent, QdMockShellFooterComponent, QdMockShellHeaderBannerComponent, QdMockShellHeaderComponent, QdMockShellHeaderSearchComponent, QdMockShellHeaderWidgetComponent, QdMockShellModule, QdMockShellToolbarComponent, QdMockShellToolbarItemComponent, QdMockStatusIndicatorCaptionComponent, QdMockStatusIndicatorComponent, QdMockStatusIndicatorItemComponent, QdMockStatusIndicatorModule, QdMockStatusPairsCaptionComponent, QdMockStatusPairsComponent, QdMockStatusPairsErrorComponent, QdMockStatusPairsItemComponent, QdMockStatusPairsValueComponent, QdMockSwitchComponent, QdMockSwitchesComponent, QdMockTableComponent, QdMockTableModule, QdMockTextSectionComponent, QdMockTextSectionHeadlineComponent, QdMockTextSectionModule, QdMockTextSectionParagraphComponent, QdMockTextareaComponent, QdMockTileButtonListComponent, QdMockTileComponent, QdMockTileTextListComponent, QdMockTileTextListItemComponent, QdMockTileTitleComponent, QdMockTilesContainerComponent, QdMockTilesContainerTitleComponent, QdMockTilesModule, QdMockTranslatePipe, QdMockVisuallyHiddenDirective, QdMultiInputComponent, QdNavigationTilesModule, QdNotificationComponent, QdNotificationContentComponent, QdNotificationsComponent, QdNotificationsHttpInterceptorService, QdNotificationsModule, QdNotificationsService, QdNotificationsSnackbarListenerDirective, QdNumberInputService, QdPageComponent, QdPageControlPanelComponent, QdPageFooterComponent, QdPageFooterCustomContentDirective, QdPageInfoBannerComponent, QdPageModule, QdPageStepComponent, QdPageStepperAdapterDirective, QdPageStepperComponent, QdPageStepperModule, QdPageStoreService, QdPageTabComponent, QdPageTabsAdapterDirective, QdPageTabsComponent, QdPageTabsModule, QdPanelSectionActionsComponent, QdPanelSectionComponent, QdPanelSectionModule, QdPanelSectionStatusComponent, QdPanelSectionTextParagraphComponent, QdPendingChangesGuardDirective, QdPercentageProgressBarComponent, QdPinCodeComponent, QdPlaceHolderComponent, QdPlaceHolderModule, QdPlaceholderPipe, QdProgressBarModule, QdProjectionGuardComponent, QdPushEventsService, QdQuickEditComponent, QdQuickEditModule, QdRadioButtonsComponent, QdRichtextComponent, QdRouterQueryParamHubService, QdRwdDisabledDirective, QdSearchComponent, QdSearchModule, QdSearchService, QdSectionAdapterDirective, QdSectionComponent, QdSectionModule, QdSectionToolbarComponent, QdShellComponent, QdShellModule, QdSortDirection, QdSpinnerComponent, QdSpinnerModule, QdStatusIndicatorComponent, QdStatusIndicatorModule, QdStatusPairsCaptionComponent, QdStatusPairsComponent, QdStatusPairsErrorComponent, QdStatusPairsItemComponent, QdStatusPairsValueComponent, QdSubgridComponent, QdSwitchComponent, QdSwitchesComponent, QdTableComponent, QdTableModule, QdTableSpringTools, QdTextSectionComponent, QdTextSectionHeadlineComponent, QdTextSectionModule, QdTextSectionParagraphComponent, QdTextareaComponent, QdTileButtonListComponent, QdTileComponent, QdTileTextListComponent, QdTileTextListItemComponent, QdTileTitleComponent, QdTilesComponent, QdTilesModule, QdTilesTitleComponent, QdTooltipAtIntersectionDirective, QdTooltipIconComponent, QdTreeComponent, QdTreeModule, QdTreeRowExpanderService, QdUiMockModule, QdUiModule, QdUploadErrorType, QdValidators, QdViewportAdaptiveDirective, QdVisuallyHiddenDirective, chipColorDefault, createMetadataStream, qdFilterParameterize, qdMergeParams, qdPageTabParameterize, qdPaginationParameterize, qdSearchParameterize, qdSortParameterize, qdTableQueryParameterize, qdWrapParams, quadrelIconNames, updateHtmlLang };
+export { APP_ENVIRONMENT, AVAILABLE_ICONS, BACKEND_ERROR_CODES, MockLocaleDatePipe, NavigationTileComponent, NavigationTilesComponent, QD_DIALOG_CONFIRMATION_RESOLVER_TOKEN, QD_FILE_MANAGER_TOKEN, QD_FILE_UPLOAD_MANAGER_TOKEN, QD_FORM_OPTIONS_RESOLVER, QD_PAGE_OBJECT_RESOLVER_TOKEN, QD_PAGE_STEP_RESOLVER_TOKEN, QD_POPOVER_TOP_FIRST, QD_SAFE_BOTTOM_OFFSET, QD_TABLE_DATA_RESOLVER_TOKEN, QD_UPLOAD_HTTP_OPTIONS, QdButtonComponent, QdButtonGhostDirective, QdButtonGridComponent, QdButtonLinkDirective, QdButtonModule, QdButtonStackButtonComponent, QdButtonStackComponent, QdCheckboxChipsComponent, QdCheckboxComponent, QdCheckboxesComponent, QdChipComponent, QdChipModule, QdColumnAutoFillDirective, QdColumnBreakBeforeDirective, QdColumnDirective, QdColumnDisableResponsiveColspansDirective, QdColumnFullGridWidthDirective, QdColumnNextInSameRowDirective, QdColumnsDirective, QdColumnsDisableAutoFillDirective, QdColumnsDisableResponsiveColspansDirective, QdColumnsMaxDirective, QdCommentsComponent, QdCommentsModule, QdConnectFormStateToPageDirective, QdConnectorTableContextDirective, QdConnectorTableFilterDirective, QdConnectorTableSearchDirective, QdContactCardComponent, QdContactCardModule, QdContainerPairsCaptionComponent, QdContainerPairsContainerComponent, QdContainerPairsHeaderComponent, QdContainerPairsItemComponent, QdContainerPairsValueComponent, QdContextService, QdCoreModule, QdDatepickerComponent, QdDialogActionComponent, QdDialogAuthSessionEndComponent, QdDialogAuthSessionEndService, QdDialogComponent, QdDialogConfirmationComponent, QdDialogConfirmationErrorDirective, QdDialogConfirmationInfoDirective, QdDialogConfirmationSuccessDirective, QdDialogModule, QdDialogRecordStepperComponent, QdDialogService, QdDialogSize, QdDisabledDirective, QdDropdownComponent, QdFileCollectorComponent, QdFileCollectorModule, QdFileSizePipe$1 as QdFileSizePipe, QdFileUploadComponent, QdFileUploadService, QdFilterComponent, QdFilterFormItemsComponent, QdFilterModule, QdFilterRestParamBuilder, QdFilterService, QdFooterActionType, QdFormArray, QdFormBuilder, QdFormControl, QdFormGroup, QdFormModule, QdGridComponent, QdGridModule, QdHorizontalPairsCaptionComponent, QdHorizontalPairsComponent, QdHorizontalPairsItemComponent, QdHorizontalPairsValueComponent, QdIconButtonComponent, QdIconComponent, QdIconModule, QdImageComponent, QdImageModule, QdIndeterminateProgressBarComponent, QdInputComponent, QdListModule, QdMenuButtonComponent, QdMockBreakpointService, QdMockButtonComponent, QdMockButtonGhostDirective, QdMockButtonGridComponent, QdMockButtonLinkDirective, QdMockButtonModule, QdMockButtonStackButtonComponent, QdMockButtonStackComponent, QdMockCalendarComponent, QdMockCheckboxChipsComponent, QdMockCheckboxComponent, QdMockCheckboxesComponent, QdMockChipComponent, QdMockChipModule, QdMockColumnDirective, QdMockColumnsDirective, QdMockContactCardComponent, QdMockContactCardModule, QdMockContainerPairsCaptionComponent, QdMockContainerPairsContainerComponent, QdMockContainerPairsHeaderComponent, QdMockContainerPairsItemComponent, QdMockContainerPairsValueComponent, QdMockCoreModule, QdMockCounterBadgeComponent, QdMockDatepickerComponent, QdMockDisabledDirective, QdMockDropdownComponent, QdMockFileCollectorComponent, QdMockFileCollectorModule, QdMockFilterCategoryBooleanComponent, QdMockFilterCategoryComponent, QdMockFilterCategoryDateComponent, QdMockFilterCategoryDateRangeComponent, QdMockFilterCategoryFreeTextComponent, QdMockFilterCategorySelectComponent, QdMockFilterComponent, QdMockFilterFormItemsComponent, QdMockFilterItemBooleanComponent, QdMockFilterItemDateComponent, QdMockFilterItemDateRangeComponent, QdMockFilterItemFreeTextComponent, QdMockFilterItemMultiSelectComponent, QdMockFilterItemSingleSelectComponent, QdMockFilterModule, QdMockFilterService, QdMockFormErrorComponent, QdMockFormGroupErrorComponent, QdMockFormHintComponent, QdMockFormLabelComponent, QdMockFormReadonlyComponent, QdMockFormViewonlyComponent, QdMockFormsModule, QdMockGridModule, QdMockIconButtonComponent, QdMockIconComponent, QdMockIconModule, QdMockImageComponent, QdMockImageModule, QdMockIndeterminateProgressBarComponent, QdMockInputComponent, QdMockListModule, QdMockNavigationTileComponent, QdMockNavigationTilesComponent, QdMockNavigationTilesModule, QdMockNotificationComponent, QdMockNotificationContentComponent, QdMockNotificationsComponent, QdMockNotificationsModule, QdMockNotificationsService, QdMockPageComponent, QdMockPageModule, QdMockPercentageProgressBarComponent, QdMockPinCodeComponent, QdMockPlaceHolderModule, QdMockPopoverOnClickDirective, QdMockProgressBarModule, QdMockQdPlaceHolderComponent, QdMockRadioButtonsComponent, QdMockRwdDisabledDirective, QdMockSearchComponent, QdMockSearchModule, QdMockSectionComponent, QdMockSectionModule, QdMockShellComponent, QdMockShellFooterComponent, QdMockShellHeaderBannerComponent, QdMockShellHeaderComponent, QdMockShellHeaderSearchComponent, QdMockShellHeaderWidgetComponent, QdMockShellModule, QdMockShellToolbarComponent, QdMockShellToolbarItemComponent, QdMockStatusIndicatorCaptionComponent, QdMockStatusIndicatorComponent, QdMockStatusIndicatorItemComponent, QdMockStatusIndicatorModule, QdMockStatusPairsCaptionComponent, QdMockStatusPairsComponent, QdMockStatusPairsErrorComponent, QdMockStatusPairsItemComponent, QdMockStatusPairsValueComponent, QdMockSwitchComponent, QdMockSwitchesComponent, QdMockTableComponent, QdMockTableModule, QdMockTextSectionComponent, QdMockTextSectionHeadlineComponent, QdMockTextSectionModule, QdMockTextSectionParagraphComponent, QdMockTextareaComponent, QdMockTileButtonListComponent, QdMockTileComponent, QdMockTileTextListComponent, QdMockTileTextListItemComponent, QdMockTileTitleComponent, QdMockTilesContainerComponent, QdMockTilesContainerTitleComponent, QdMockTilesModule, QdMockTranslatePipe, QdMockVisuallyHiddenDirective, QdMultiInputComponent, QdNavigationTilesModule, QdNotificationComponent, QdNotificationContentComponent, QdNotificationsComponent, QdNotificationsHttpInterceptorService, QdNotificationsModule, QdNotificationsService, QdNotificationsSnackbarListenerDirective, QdNumberInputService, QdPageComponent, QdPageControlPanelComponent, QdPageFooterComponent, QdPageFooterCustomContentDirective, QdPageInfoBannerComponent, QdPageModule, QdPageStepComponent, QdPageStepperAdapterDirective, QdPageStepperComponent, QdPageStepperModule, QdPageStoreService, QdPageTabComponent, QdPageTabsAdapterDirective, QdPageTabsComponent, QdPageTabsModule, QdPanelSectionActionsComponent, QdPanelSectionComponent, QdPanelSectionModule, QdPanelSectionStatusComponent, QdPanelSectionTextParagraphComponent, QdPendingChangesGuardDirective, QdPercentageProgressBarComponent, QdPinCodeComponent, QdPlaceHolderComponent, QdPlaceHolderModule, QdPlaceholderPipe, QdProgressBarModule, QdProjectionGuardComponent, QdPushEventsService, QdQuickEditComponent, QdQuickEditModule, QdRadioButtonsComponent, QdRichtextComponent, QdRouterQueryParamHubService, QdRwdDisabledDirective, QdSearchComponent, QdSearchModule, QdSearchService, QdSectionAdapterDirective, QdSectionComponent, QdSectionModule, QdSectionToolbarComponent, QdShellComponent, QdShellModule, QdSortDirection, QdSpinnerComponent, QdSpinnerModule, QdStatusIndicatorComponent, QdStatusIndicatorModule, QdStatusPairsCaptionComponent, QdStatusPairsComponent, QdStatusPairsErrorComponent, QdStatusPairsItemComponent, QdStatusPairsValueComponent, QdSubgridComponent, QdSwitchComponent, QdSwitchesComponent, QdTableComponent, QdTableModule, QdTableSpringTools, QdTextSectionComponent, QdTextSectionHeadlineComponent, QdTextSectionModule, QdTextSectionParagraphComponent, QdTextareaComponent, QdTileButtonListComponent, QdTileComponent, QdTileTextListComponent, QdTileTextListItemComponent, QdTileTitleComponent, QdTilesComponent, QdTilesModule, QdTilesTitleComponent, QdTooltipAtIntersectionDirective, QdTooltipIconComponent, QdTreeComponent, QdTreeModule, QdTreeRowExpanderService, QdUiMockModule, QdUiModule, QdUploadErrorType, QdValidators, QdViewportAdaptiveDirective, QdVisuallyHiddenDirective, WHITELIST_ERROR_CODES, chipColorDefault, createMetadataStream, qdFilterParameterize, qdMergeParams, qdPageTabParameterize, qdPaginationParameterize, qdSearchParameterize, qdSortParameterize, qdTableQueryParameterize, qdWrapParams, quadrelIconNames, updateHtmlLang };
 //# sourceMappingURL=quadrel-enterprise-ui-framework.mjs.map