@quadrel-enterprise-ui/framework 20.23.0 → 20.23.1-beta.196.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
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
|
|
2
|
+
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';
|
|
3
3
|
import { Dialog, DialogRef, DialogModule } from '@angular/cdk/dialog';
|
|
4
4
|
import * as i1 from '@angular/common';
|
|
5
5
|
import { CommonModule, NgFor, NgIf, NgClass, NgTemplateOutlet, AsyncPipe } from '@angular/common';
|
|
@@ -3126,14 +3126,15 @@ class QdMockCheckboxComponent {
|
|
|
3126
3126
|
value;
|
|
3127
3127
|
disabled = false;
|
|
3128
3128
|
testId = 'checkbox';
|
|
3129
|
+
valueChange = new EventEmitter();
|
|
3129
3130
|
get dataTestId() {
|
|
3130
3131
|
return this.testId;
|
|
3131
3132
|
}
|
|
3132
|
-
handleClick(
|
|
3133
|
-
|
|
3133
|
+
handleClick() {
|
|
3134
|
+
this.valueChange.emit(this.value);
|
|
3134
3135
|
}
|
|
3135
3136
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdMockCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3136
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdMockCheckboxComponent, isStandalone: false, selector: "qd-checkbox", inputs: { inputData: "inputData", value: "value", disabled: "disabled", testId: ["data-test-id", "testId"] }, host: { properties: { "attr.data-test-id": "this.dataTestId" } }, ngImport: i0, template: 'inputData: {{inputData | json}}, value: {{value}}, disabled: {{disabled | json}}', isInline: true, dependencies: [{ kind: "pipe", type: i1.JsonPipe, name: "json" }] });
|
|
3137
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdMockCheckboxComponent, isStandalone: false, selector: "qd-checkbox", inputs: { inputData: "inputData", value: "value", disabled: "disabled", testId: ["data-test-id", "testId"] }, outputs: { valueChange: "valueChange" }, host: { listeners: { "click": "handleClick()" }, properties: { "attr.data-test-id": "this.dataTestId" } }, ngImport: i0, template: 'inputData: {{inputData | json}}, value: {{value}}, disabled: {{disabled | json}}', isInline: true, dependencies: [{ kind: "pipe", type: i1.JsonPipe, name: "json" }] });
|
|
3137
3138
|
}
|
|
3138
3139
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdMockCheckboxComponent, decorators: [{
|
|
3139
3140
|
type: Component,
|
|
@@ -3151,9 +3152,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
3151
3152
|
}], testId: [{
|
|
3152
3153
|
type: Input,
|
|
3153
3154
|
args: ['data-test-id']
|
|
3155
|
+
}], valueChange: [{
|
|
3156
|
+
type: Output
|
|
3154
3157
|
}], dataTestId: [{
|
|
3155
3158
|
type: HostBinding,
|
|
3156
3159
|
args: ['attr.data-test-id']
|
|
3160
|
+
}], handleClick: [{
|
|
3161
|
+
type: HostListener,
|
|
3162
|
+
args: ['click']
|
|
3157
3163
|
}] } });
|
|
3158
3164
|
|
|
3159
3165
|
// @ts-strict-ignore
|
|
@@ -9675,7 +9681,7 @@ class QdCheckboxesComponent {
|
|
|
9675
9681
|
},
|
|
9676
9682
|
QdCheckboxesService,
|
|
9677
9683
|
QdFormsActionEmitterService
|
|
9678
|
-
], viewQueries: [{ propertyName: "checkboxes", predicate: QdCheckboxComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<qd-form-label\n [label]=\"label\"\n [readonly]=\"readonly\"\n [viewonly]=\"viewonly\"\n [control]=\"control\"\n [tooltip]=\"config?.tooltip\"\n [data-test-id]=\"testId\"\n [isDisabled]=\"isLabelDisabled\"\n></qd-form-label>\n\n<div class=\"qd-checkboxes__input-section\" *ngIf=\"!readonly && !viewonly\">\n <qd-filter-form-items\n *ngIf=\"filter\"\n (filterValueChange)=\"changeValue($event)\"\n [data-test-id]=\"testId + '-filter-form'\"\n ></qd-filter-form-items>\n\n <div class=\"qd-checkboxes__checkbox-section\">\n <qd-checkbox\n *ngFor=\"let checkbox of checkboxesListForView\"\n [inputData]=\"checkbox\"\n [
|
|
9684
|
+
], viewQueries: [{ propertyName: "checkboxes", predicate: QdCheckboxComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<qd-form-label\n [label]=\"label\"\n [readonly]=\"readonly\"\n [viewonly]=\"viewonly\"\n [control]=\"control\"\n [tooltip]=\"config?.tooltip\"\n [data-test-id]=\"testId\"\n [isDisabled]=\"isLabelDisabled\"\n></qd-form-label>\n\n<div class=\"qd-checkboxes__input-section\" *ngIf=\"!readonly && !viewonly\">\n <qd-filter-form-items\n *ngIf=\"filter\"\n (filterValueChange)=\"changeValue($event)\"\n [data-test-id]=\"testId + '-filter-form'\"\n ></qd-filter-form-items>\n\n <div class=\"qd-checkboxes__checkbox-section\">\n <qd-checkbox\n *ngFor=\"let checkbox of checkboxesListForView\"\n [inputData]=\"checkbox\"\n [value]=\"checkboxesValues[checkbox.index]\"\n [disabled]=\"checkbox.disabled || disabled\"\n (valueChange)=\"handleClick(checkbox)\"\n [data-test-id]=\"testId + '-checkbox-' + checkbox.index\"\n ></qd-checkbox>\n </div>\n</div>\n\n<qd-form-hint\n *ngIf=\"!readonly && !viewonly && (hint || hasError)\"\n [hint]=\"hint\"\n [control]=\"control\"\n [hasError]=\"hasError\"\n [hintAction]=\"hintAction\"\n [data-test-id]=\"testId\"\n></qd-form-hint>\n\n<qd-form-readonly\n *ngIf=\"readonly\"\n [values]=\"selectedValuesTranslated\"\n [readonlyAction]=\"readonlyAction\"\n [data-test-id]=\"testId\"\n></qd-form-readonly>\n\n<qd-form-viewonly\n *ngIf=\"viewonly\"\n [values]=\"selectedValuesTranslated\"\n [viewonlyAction]=\"viewonlyAction\"\n [data-test-id]=\"testId\"\n></qd-form-viewonly>\n", styles: [".qd-checkboxes{display:block;margin-bottom:.75rem}@media (max-width: 959.98px){.qd-checkboxes{height:initial}}.qd-checkboxes .qd-checkboxes__input-section{display:block;flex-direction:column;margin-bottom:.3125rem}.qd-checkboxes .qd-checkboxes__checkbox-section{display:flex;min-height:2.25rem;flex-direction:row}@media (max-width: 959.98px){.qd-checkboxes .qd-checkboxes__checkbox-section{height:initial;flex-direction:column}}.qd-checkboxes.qd-checkboxes-vertical .qd-checkboxes__checkbox-section{display:flex;flex-direction:column}.qd-checkboxes.qd-checkboxes-vertical .qd-checkboxes__checkbox-section .qd-checkbox:not(:last-child){margin-bottom:.5rem}.qd-checkboxes.qd-checkboxes-disabled{pointer-events:none}.qd-checkboxes-readonly .qd-checkboxes__input-section{font-size:.875rem;line-height:2.25rem}.qd-checkboxes--readonly-action .qd-checkboxes__input-section{color:#069;cursor:pointer}.qd-checkboxes--readonly-action .qd-checkboxes__input-section:hover,.qd-checkboxes--readonly-action .qd-checkboxes__input-section:active,.qd-checkboxes--readonly-action .qd-checkboxes__input-section:focus{text-decoration:underline}.qd-checkboxes-viewonly .qd-checkboxes__input-section{font-size:.875rem;line-height:2.25rem}.qd-checkboxes--viewonly-action .qd-checkboxes__input-section{color:#069;cursor:pointer}.qd-checkboxes--viewonly-action .qd-checkboxes__input-section:hover,.qd-checkboxes--viewonly-action .qd-checkboxes__input-section:active,.qd-checkboxes--viewonly-action .qd-checkboxes__input-section:focus{text-decoration:underline}\n"], dependencies: [{ 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: QdCheckboxComponent, selector: "qd-checkbox", inputs: ["inputData", "value", "data-test-id", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: QdFilterFormItemsComponent, selector: "qd-filter-form-items", inputs: ["inputFilterValue", "data-test-id"], outputs: ["filterValueChange"] }, { kind: "component", type: QdFormHintComponent, selector: "qd-form-hint", inputs: ["hint", "control", "hasError", "hintAction", "data-test-id"] }, { kind: "component", type: QdFormLabelComponent, selector: "qd-form-label", inputs: ["label", "isDisabled", "readonly", "viewonly", "control", "tooltip", "data-test-id"] }, { kind: "component", type: QdFormReadonlyComponent, selector: "qd-form-readonly", inputs: ["values", "readonlyAction", "data-test-id"] }, { kind: "component", type: QdFormViewonlyComponent, selector: "qd-form-viewonly", inputs: ["values", "viewonlyAction", "data-test-id"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
9679
9685
|
}
|
|
9680
9686
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdCheckboxesComponent, decorators: [{
|
|
9681
9687
|
type: Component,
|
|
@@ -9687,7 +9693,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
9687
9693
|
},
|
|
9688
9694
|
QdCheckboxesService,
|
|
9689
9695
|
QdFormsActionEmitterService
|
|
9690
|
-
], encapsulation: ViewEncapsulation.None, host: { class: 'qd-checkboxes' }, standalone: false, template: "<qd-form-label\n [label]=\"label\"\n [readonly]=\"readonly\"\n [viewonly]=\"viewonly\"\n [control]=\"control\"\n [tooltip]=\"config?.tooltip\"\n [data-test-id]=\"testId\"\n [isDisabled]=\"isLabelDisabled\"\n></qd-form-label>\n\n<div class=\"qd-checkboxes__input-section\" *ngIf=\"!readonly && !viewonly\">\n <qd-filter-form-items\n *ngIf=\"filter\"\n (filterValueChange)=\"changeValue($event)\"\n [data-test-id]=\"testId + '-filter-form'\"\n ></qd-filter-form-items>\n\n <div class=\"qd-checkboxes__checkbox-section\">\n <qd-checkbox\n *ngFor=\"let checkbox of checkboxesListForView\"\n [inputData]=\"checkbox\"\n [
|
|
9696
|
+
], encapsulation: ViewEncapsulation.None, host: { class: 'qd-checkboxes' }, standalone: false, template: "<qd-form-label\n [label]=\"label\"\n [readonly]=\"readonly\"\n [viewonly]=\"viewonly\"\n [control]=\"control\"\n [tooltip]=\"config?.tooltip\"\n [data-test-id]=\"testId\"\n [isDisabled]=\"isLabelDisabled\"\n></qd-form-label>\n\n<div class=\"qd-checkboxes__input-section\" *ngIf=\"!readonly && !viewonly\">\n <qd-filter-form-items\n *ngIf=\"filter\"\n (filterValueChange)=\"changeValue($event)\"\n [data-test-id]=\"testId + '-filter-form'\"\n ></qd-filter-form-items>\n\n <div class=\"qd-checkboxes__checkbox-section\">\n <qd-checkbox\n *ngFor=\"let checkbox of checkboxesListForView\"\n [inputData]=\"checkbox\"\n [value]=\"checkboxesValues[checkbox.index]\"\n [disabled]=\"checkbox.disabled || disabled\"\n (valueChange)=\"handleClick(checkbox)\"\n [data-test-id]=\"testId + '-checkbox-' + checkbox.index\"\n ></qd-checkbox>\n </div>\n</div>\n\n<qd-form-hint\n *ngIf=\"!readonly && !viewonly && (hint || hasError)\"\n [hint]=\"hint\"\n [control]=\"control\"\n [hasError]=\"hasError\"\n [hintAction]=\"hintAction\"\n [data-test-id]=\"testId\"\n></qd-form-hint>\n\n<qd-form-readonly\n *ngIf=\"readonly\"\n [values]=\"selectedValuesTranslated\"\n [readonlyAction]=\"readonlyAction\"\n [data-test-id]=\"testId\"\n></qd-form-readonly>\n\n<qd-form-viewonly\n *ngIf=\"viewonly\"\n [values]=\"selectedValuesTranslated\"\n [viewonlyAction]=\"viewonlyAction\"\n [data-test-id]=\"testId\"\n></qd-form-viewonly>\n", styles: [".qd-checkboxes{display:block;margin-bottom:.75rem}@media (max-width: 959.98px){.qd-checkboxes{height:initial}}.qd-checkboxes .qd-checkboxes__input-section{display:block;flex-direction:column;margin-bottom:.3125rem}.qd-checkboxes .qd-checkboxes__checkbox-section{display:flex;min-height:2.25rem;flex-direction:row}@media (max-width: 959.98px){.qd-checkboxes .qd-checkboxes__checkbox-section{height:initial;flex-direction:column}}.qd-checkboxes.qd-checkboxes-vertical .qd-checkboxes__checkbox-section{display:flex;flex-direction:column}.qd-checkboxes.qd-checkboxes-vertical .qd-checkboxes__checkbox-section .qd-checkbox:not(:last-child){margin-bottom:.5rem}.qd-checkboxes.qd-checkboxes-disabled{pointer-events:none}.qd-checkboxes-readonly .qd-checkboxes__input-section{font-size:.875rem;line-height:2.25rem}.qd-checkboxes--readonly-action .qd-checkboxes__input-section{color:#069;cursor:pointer}.qd-checkboxes--readonly-action .qd-checkboxes__input-section:hover,.qd-checkboxes--readonly-action .qd-checkboxes__input-section:active,.qd-checkboxes--readonly-action .qd-checkboxes__input-section:focus{text-decoration:underline}.qd-checkboxes-viewonly .qd-checkboxes__input-section{font-size:.875rem;line-height:2.25rem}.qd-checkboxes--viewonly-action .qd-checkboxes__input-section{color:#069;cursor:pointer}.qd-checkboxes--viewonly-action .qd-checkboxes__input-section:hover,.qd-checkboxes--viewonly-action .qd-checkboxes__input-section:active,.qd-checkboxes--viewonly-action .qd-checkboxes__input-section:focus{text-decoration:underline}\n"] }]
|
|
9691
9697
|
}], ctorParameters: () => [], propDecorators: { formControlName: [{
|
|
9692
9698
|
type: Input
|
|
9693
9699
|
}], values: [{
|
|
@@ -12202,7 +12208,6 @@ class QdDatepickerComponent {
|
|
|
12202
12208
|
readonlyAction = false;
|
|
12203
12209
|
viewonlyAction = false;
|
|
12204
12210
|
language = DEFAULT_LANGUAGE;
|
|
12205
|
-
qdPopoverOnClick;
|
|
12206
12211
|
control;
|
|
12207
12212
|
timePicker;
|
|
12208
12213
|
_disabledDatesValidator;
|
|
@@ -14707,6 +14712,12 @@ class QdPinCodeComponent {
|
|
|
14707
14712
|
_subs = new Subscription();
|
|
14708
14713
|
_onChange = () => { };
|
|
14709
14714
|
_onTouch = () => { };
|
|
14715
|
+
get firstEmptyIndex() {
|
|
14716
|
+
return this.pinCodeService.firstEmpty;
|
|
14717
|
+
}
|
|
14718
|
+
get joinedValues() {
|
|
14719
|
+
return this.pinCodeService.joinedValues;
|
|
14720
|
+
}
|
|
14710
14721
|
get errors() {
|
|
14711
14722
|
return this.control ? this.control.errors : [];
|
|
14712
14723
|
}
|
|
@@ -14958,7 +14969,7 @@ class QdPinCodeComponent {
|
|
|
14958
14969
|
},
|
|
14959
14970
|
QdPinCodeService,
|
|
14960
14971
|
QdFormsActionEmitterService
|
|
14961
|
-
], viewQueries: [{ propertyName: "inputsList", predicate: ["input"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<qd-form-label\n [label]=\"label\"\n [readonly]=\"readonly\"\n [viewonly]=\"viewonly\"\n [control]=\"control\"\n [tooltip]=\"config?.tooltip\"\n [data-test-id]=\"testId\"\n></qd-form-label>\n\n<ng-container *ngFor=\"let i of iterable(codeLength); let index = index; let last = last\">\n <input\n #input\n *ngIf=\"!readonly && !viewonly\"\n [ngClass]=\"'qd-pin-code__input qd-pin-code--input-' + index + (last ? ' qd-pin-code__input--last' : '')\"\n [attr.data-test-id]=\"testId + '-input-' + index\"\n [type]=\"codeHidden ? 'password' : inputType\"\n [tabindex]=\"
|
|
14972
|
+
], viewQueries: [{ propertyName: "inputsList", predicate: ["input"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<qd-form-label\n [label]=\"label\"\n [readonly]=\"readonly\"\n [viewonly]=\"viewonly\"\n [control]=\"control\"\n [tooltip]=\"config?.tooltip\"\n [data-test-id]=\"testId\"\n></qd-form-label>\n\n<ng-container *ngFor=\"let i of iterable(codeLength); let index = index; let last = last\">\n <input\n #input\n *ngIf=\"!readonly && !viewonly\"\n [ngClass]=\"'qd-pin-code__input qd-pin-code--input-' + index + (last ? ' qd-pin-code__input--last' : '')\"\n [attr.data-test-id]=\"testId + '-input-' + index\"\n [type]=\"codeHidden ? 'password' : inputType\"\n [tabindex]=\"firstEmptyIndex === index ? 0 : -1\"\n (click)=\"handleCLick($event)\"\n (keydown.backspace)=\"handleDelete($event)\"\n (keydown.delete)=\"handleDelete($event)\"\n (keydown.enter)=\"handleComplete()\"\n (keypress)=\"handleInput($event)\"\n (blur)=\"handleBlur(index)\"\n [disabled]=\"disabled\"\n autocomplete=\"off\"\n />\n</ng-container>\n\n<qd-form-hint\n *ngIf=\"!readonly && !viewonly && (hint || hasError)\"\n [hint]=\"hint\"\n [control]=\"control\"\n [hasError]=\"hasError\"\n [hintAction]=\"hintAction\"\n [data-test-id]=\"testId\"\n></qd-form-hint>\n\n<qd-form-readonly\n *ngIf=\"readonly\"\n [values]=\"[joinedValues]\"\n [readonlyAction]=\"readonlyAction\"\n [data-test-id]=\"testId\"\n></qd-form-readonly>\n\n<qd-form-viewonly\n *ngIf=\"viewonly\"\n [values]=\"[joinedValues]\"\n [viewonlyAction]=\"viewonlyAction\"\n [data-test-id]=\"testId\"\n></qd-form-viewonly>\n", styles: [":host{display:block;height:4.5rem;margin-bottom:.75rem}:host .qd-pin-code__input{width:1.875rem;height:2.25rem;border:.0625rem solid rgb(180,180,180);margin-right:.75rem;margin-bottom:.375rem;caret-color:#fff0;cursor:default;font-size:1.5rem;font-weight:500;text-align:center}:host .qd-pin-code__input--last{margin-right:0}:host .qd-pin-code__input:focus{border-width:.125rem;border-color:#069}:host .qd-pin-code__input:active{border-width:.0625rem;border-color:#b4b4b4}:host .qd-pin-code__input:focus-visible{outline:none}:host.qd-pin-code--error .qd-pin-code__input{border-color:#c70023}:host.qd-pin-code--error .qd-pin-code__input:focus{border-width:.125rem}:host.qd-pin-code--error .qd-pin-code__input:active{border-width:.0625rem}\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: QdFormHintComponent, selector: "qd-form-hint", inputs: ["hint", "control", "hasError", "hintAction", "data-test-id"] }, { kind: "component", type: QdFormLabelComponent, selector: "qd-form-label", inputs: ["label", "isDisabled", "readonly", "viewonly", "control", "tooltip", "data-test-id"] }, { kind: "component", type: QdFormReadonlyComponent, selector: "qd-form-readonly", inputs: ["values", "readonlyAction", "data-test-id"] }, { kind: "component", type: QdFormViewonlyComponent, selector: "qd-form-viewonly", inputs: ["values", "viewonlyAction", "data-test-id"] }] });
|
|
14962
14973
|
}
|
|
14963
14974
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPinCodeComponent, decorators: [{
|
|
14964
14975
|
type: Component,
|
|
@@ -14970,7 +14981,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
14970
14981
|
},
|
|
14971
14982
|
QdPinCodeService,
|
|
14972
14983
|
QdFormsActionEmitterService
|
|
14973
|
-
], host: { class: 'qd-pin-code' }, standalone: false, template: "<qd-form-label\n [label]=\"label\"\n [readonly]=\"readonly\"\n [viewonly]=\"viewonly\"\n [control]=\"control\"\n [tooltip]=\"config?.tooltip\"\n [data-test-id]=\"testId\"\n></qd-form-label>\n\n<ng-container *ngFor=\"let i of iterable(codeLength); let index = index; let last = last\">\n <input\n #input\n *ngIf=\"!readonly && !viewonly\"\n [ngClass]=\"'qd-pin-code__input qd-pin-code--input-' + index + (last ? ' qd-pin-code__input--last' : '')\"\n [attr.data-test-id]=\"testId + '-input-' + index\"\n [type]=\"codeHidden ? 'password' : inputType\"\n [tabindex]=\"
|
|
14984
|
+
], host: { class: 'qd-pin-code' }, standalone: false, template: "<qd-form-label\n [label]=\"label\"\n [readonly]=\"readonly\"\n [viewonly]=\"viewonly\"\n [control]=\"control\"\n [tooltip]=\"config?.tooltip\"\n [data-test-id]=\"testId\"\n></qd-form-label>\n\n<ng-container *ngFor=\"let i of iterable(codeLength); let index = index; let last = last\">\n <input\n #input\n *ngIf=\"!readonly && !viewonly\"\n [ngClass]=\"'qd-pin-code__input qd-pin-code--input-' + index + (last ? ' qd-pin-code__input--last' : '')\"\n [attr.data-test-id]=\"testId + '-input-' + index\"\n [type]=\"codeHidden ? 'password' : inputType\"\n [tabindex]=\"firstEmptyIndex === index ? 0 : -1\"\n (click)=\"handleCLick($event)\"\n (keydown.backspace)=\"handleDelete($event)\"\n (keydown.delete)=\"handleDelete($event)\"\n (keydown.enter)=\"handleComplete()\"\n (keypress)=\"handleInput($event)\"\n (blur)=\"handleBlur(index)\"\n [disabled]=\"disabled\"\n autocomplete=\"off\"\n />\n</ng-container>\n\n<qd-form-hint\n *ngIf=\"!readonly && !viewonly && (hint || hasError)\"\n [hint]=\"hint\"\n [control]=\"control\"\n [hasError]=\"hasError\"\n [hintAction]=\"hintAction\"\n [data-test-id]=\"testId\"\n></qd-form-hint>\n\n<qd-form-readonly\n *ngIf=\"readonly\"\n [values]=\"[joinedValues]\"\n [readonlyAction]=\"readonlyAction\"\n [data-test-id]=\"testId\"\n></qd-form-readonly>\n\n<qd-form-viewonly\n *ngIf=\"viewonly\"\n [values]=\"[joinedValues]\"\n [viewonlyAction]=\"viewonlyAction\"\n [data-test-id]=\"testId\"\n></qd-form-viewonly>\n", styles: [":host{display:block;height:4.5rem;margin-bottom:.75rem}:host .qd-pin-code__input{width:1.875rem;height:2.25rem;border:.0625rem solid rgb(180,180,180);margin-right:.75rem;margin-bottom:.375rem;caret-color:#fff0;cursor:default;font-size:1.5rem;font-weight:500;text-align:center}:host .qd-pin-code__input--last{margin-right:0}:host .qd-pin-code__input:focus{border-width:.125rem;border-color:#069}:host .qd-pin-code__input:active{border-width:.0625rem;border-color:#b4b4b4}:host .qd-pin-code__input:focus-visible{outline:none}:host.qd-pin-code--error .qd-pin-code__input{border-color:#c70023}:host.qd-pin-code--error .qd-pin-code__input:focus{border-width:.125rem}:host.qd-pin-code--error .qd-pin-code__input:active{border-width:.0625rem}\n"] }]
|
|
14974
14985
|
}], propDecorators: { formControlName: [{
|
|
14975
14986
|
type: Input
|
|
14976
14987
|
}], value: [{
|
|
@@ -29803,6 +29814,9 @@ class QdPageStepperComponent extends CdkStepper {
|
|
|
29803
29814
|
allStepsValid$;
|
|
29804
29815
|
_destroyed$ = new Subject();
|
|
29805
29816
|
isGoingToNextStep = false;
|
|
29817
|
+
get hasPageFooter() {
|
|
29818
|
+
return !!this.footerService;
|
|
29819
|
+
}
|
|
29806
29820
|
constructor() {
|
|
29807
29821
|
const _dir = inject(Directionality, { optional: true });
|
|
29808
29822
|
const _changeDetectorRef = inject(ChangeDetectorRef);
|
|
@@ -30021,11 +30035,11 @@ class QdPageStepperComponent extends CdkStepper {
|
|
|
30021
30035
|
throw new Error(`Quadrel Framework | QdPageStepper - The "${inputName}" attribute is not allowed. Please use QdPageStepperConfig instead.`);
|
|
30022
30036
|
}
|
|
30023
30037
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
30024
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdPageStepperComponent, isStandalone: true, selector: "qd-page-stepper", inputs: { config: "config", testId: ["data-test-id", "testId"] }, outputs: { submitted: "submitted" }, host: { properties: { "class.standalone": "!
|
|
30038
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: QdPageStepperComponent, isStandalone: true, selector: "qd-page-stepper", inputs: { config: "config", testId: ["data-test-id", "testId"] }, outputs: { submitted: "submitted" }, host: { properties: { "class.standalone": "!hasPageFooter" }, classAttribute: "qd-stepper" }, providers: [{ provide: CdkStepper, useExisting: QdPageStepperComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"qd-stepper-items-container\" *ngIf=\"steps.length > 1\">\n <qd-page-step-header\n *ngFor=\"let step of steps; let i = index\"\n (click)=\"handleClickHeader(step, i)\"\n [id]=\"_getStepLabelId(i)\"\n [ngClass]=\"'qd-step'\"\n [index]=\"i\"\n [state]=\"_getIndicatorType(i, step.state)\"\n [label]=\"step.config.label.i18n | translate\"\n [selected]=\"selectedIndex === i\"\n [active]=\"step.completed || selectedIndex === i || !linear\"\n [optional]=\"step.optional\"\n [locked]=\"!step.editable && i < selectedIndex\"\n >\n </qd-page-step-header>\n</div>\n\n<div class=\"stepper-content\">\n <ng-container [ngTemplateOutlet]=\"selected?.content\"></ng-container>\n</div>\n\n<div class=\"qd-stepper-action-area\" *ngIf=\"!hasPageFooter\">\n <button qdButton qdButtonGhost (click)=\"cancel()\" [data-test-id]=\"testId + '-cancel'\">\n {{ config?.cancel?.i18n || \"i18n.qd.stepper.cancel\" | translate }}\n </button>\n\n <button\n *ngIf=\"showPreviousButton(selectedIndex)\"\n qdButton\n qdButtonGhost\n (click)=\"previousStep()\"\n [data-test-id]=\"testId + '-previous'\"\n >\n {{ config?.previous?.i18n || \"i18n.qd.stepper.previous\" | translate }}\n </button>\n\n <button\n *ngIf=\"showNextButton(selectedIndex)\"\n qdButton\n [disabled]=\"(selectedStepValid$ | async) === false\"\n (click)=\"nextStep()\"\n [data-test-id]=\"testId + '-next'\"\n >\n {{ config?.next?.i18n || \"i18n.qd.stepper.next\" | translate }}\n </button>\n\n <button\n *ngIf=\"showSubmitButton(selectedIndex)\"\n qdButton\n (click)=\"submit()\"\n [disabled]=\"(allStepsValid$ | async) === false\"\n [data-test-id]=\"testId + '-submit'\"\n >\n {{ config?.submit?.i18n || \"i18n.qd.stepper.submit\" | translate }}\n </button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host.standalone{height:calc(100% - 50px)}:host .qd-stepper-items-container{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;padding:0 1.25rem;border-bottom:.125rem solid rgb(213,213,213);background-color:#fff;gap:0 .625rem}@media (max-width: 599.98px){:host .qd-stepper-items-container{padding:0 .9375rem}}:host .stepper-content{flex:1 1 auto}:host .qd-stepper-action-area{display:flex;width:100%;height:3.125rem;justify-content:flex-end}:host .qd-stepper-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: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: QdPageStepHeaderComponent, selector: "qd-page-step-header", inputs: ["state", "label", "index", "selected", "active", "optional", "locked"] }, { 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: "directive", type: QdButtonGhostDirective, selector: "button[qdButtonGhost], a[qdButtonGhost]" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
30025
30039
|
}
|
|
30026
30040
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageStepperComponent, decorators: [{
|
|
30027
30041
|
type: Component,
|
|
30028
|
-
args: [{ selector: 'qd-page-stepper', providers: [{ provide: CdkStepper, useExisting: QdPageStepperComponent }], changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'qd-stepper', '[class.standalone]': '!
|
|
30042
|
+
args: [{ selector: 'qd-page-stepper', providers: [{ provide: CdkStepper, useExisting: QdPageStepperComponent }], changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'qd-stepper', '[class.standalone]': '!hasPageFooter' }, standalone: true, imports: [
|
|
30029
30043
|
NgFor,
|
|
30030
30044
|
NgIf,
|
|
30031
30045
|
NgClass,
|
|
@@ -30034,7 +30048,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
30034
30048
|
QdPageStepHeaderComponent,
|
|
30035
30049
|
TranslateModule,
|
|
30036
30050
|
QdButtonModule
|
|
30037
|
-
], template: "<div class=\"qd-stepper-items-container\" *ngIf=\"steps.length > 1\">\n <qd-page-step-header\n *ngFor=\"let step of steps; let i = index\"\n (click)=\"handleClickHeader(step, i)\"\n [id]=\"_getStepLabelId(i)\"\n [ngClass]=\"'qd-step'\"\n [index]=\"i\"\n [state]=\"_getIndicatorType(i, step.state)\"\n [label]=\"step.config.label.i18n | translate\"\n [selected]=\"selectedIndex === i\"\n [active]=\"step.completed || selectedIndex === i || !linear\"\n [optional]=\"step.optional\"\n [locked]=\"!step.editable && i < selectedIndex\"\n >\n </qd-page-step-header>\n</div>\n\n<div class=\"stepper-content\">\n <ng-container [ngTemplateOutlet]=\"selected?.content\"></ng-container>\n</div>\n\n<div class=\"qd-stepper-action-area\" *ngIf=\"!
|
|
30051
|
+
], template: "<div class=\"qd-stepper-items-container\" *ngIf=\"steps.length > 1\">\n <qd-page-step-header\n *ngFor=\"let step of steps; let i = index\"\n (click)=\"handleClickHeader(step, i)\"\n [id]=\"_getStepLabelId(i)\"\n [ngClass]=\"'qd-step'\"\n [index]=\"i\"\n [state]=\"_getIndicatorType(i, step.state)\"\n [label]=\"step.config.label.i18n | translate\"\n [selected]=\"selectedIndex === i\"\n [active]=\"step.completed || selectedIndex === i || !linear\"\n [optional]=\"step.optional\"\n [locked]=\"!step.editable && i < selectedIndex\"\n >\n </qd-page-step-header>\n</div>\n\n<div class=\"stepper-content\">\n <ng-container [ngTemplateOutlet]=\"selected?.content\"></ng-container>\n</div>\n\n<div class=\"qd-stepper-action-area\" *ngIf=\"!hasPageFooter\">\n <button qdButton qdButtonGhost (click)=\"cancel()\" [data-test-id]=\"testId + '-cancel'\">\n {{ config?.cancel?.i18n || \"i18n.qd.stepper.cancel\" | translate }}\n </button>\n\n <button\n *ngIf=\"showPreviousButton(selectedIndex)\"\n qdButton\n qdButtonGhost\n (click)=\"previousStep()\"\n [data-test-id]=\"testId + '-previous'\"\n >\n {{ config?.previous?.i18n || \"i18n.qd.stepper.previous\" | translate }}\n </button>\n\n <button\n *ngIf=\"showNextButton(selectedIndex)\"\n qdButton\n [disabled]=\"(selectedStepValid$ | async) === false\"\n (click)=\"nextStep()\"\n [data-test-id]=\"testId + '-next'\"\n >\n {{ config?.next?.i18n || \"i18n.qd.stepper.next\" | translate }}\n </button>\n\n <button\n *ngIf=\"showSubmitButton(selectedIndex)\"\n qdButton\n (click)=\"submit()\"\n [disabled]=\"(allStepsValid$ | async) === false\"\n [data-test-id]=\"testId + '-submit'\"\n >\n {{ config?.submit?.i18n || \"i18n.qd.stepper.submit\" | translate }}\n </button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host.standalone{height:calc(100% - 50px)}:host .qd-stepper-items-container{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;padding:0 1.25rem;border-bottom:.125rem solid rgb(213,213,213);background-color:#fff;gap:0 .625rem}@media (max-width: 599.98px){:host .qd-stepper-items-container{padding:0 .9375rem}}:host .stepper-content{flex:1 1 auto}:host .qd-stepper-action-area{display:flex;width:100%;height:3.125rem;justify-content:flex-end}:host .qd-stepper-action-area button{margin-right:1.25rem}\n"] }]
|
|
30038
30052
|
}], ctorParameters: () => [], propDecorators: { config: [{
|
|
30039
30053
|
type: Input
|
|
30040
30054
|
}], testId: [{
|
|
@@ -30139,8 +30153,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
30139
30153
|
/**
|
|
30140
30154
|
* **QdPageTabHeader* renders the header of a single tab. It is used quadrel-internally.
|
|
30141
30155
|
*/
|
|
30142
|
-
class QdPageTabHeaderComponent
|
|
30143
|
-
STEP_STATE = STEP_STATE;
|
|
30156
|
+
class QdPageTabHeaderComponent {
|
|
30144
30157
|
/** State of the given tab. */
|
|
30145
30158
|
state;
|
|
30146
30159
|
/** Label of the given tab. */
|
|
@@ -30157,24 +30170,21 @@ class QdPageTabHeaderComponent extends CdkStepHeader {
|
|
|
30157
30170
|
* A static test ID for integration tests can be set.
|
|
30158
30171
|
*/
|
|
30159
30172
|
testId;
|
|
30160
|
-
constructor() {
|
|
30161
|
-
const elementRef = inject(ElementRef);
|
|
30162
|
-
super(elementRef);
|
|
30163
|
-
}
|
|
30164
30173
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
30165
|
-
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 ===
|
|
30174
|
+
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 });
|
|
30166
30175
|
}
|
|
30167
30176
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabHeaderComponent, decorators: [{
|
|
30168
30177
|
type: Component,
|
|
30169
30178
|
args: [{ selector: 'qd-page-tab-header', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
30170
30179
|
'[attr.data-test-id]': 'testId',
|
|
30180
|
+
role: 'tab',
|
|
30171
30181
|
'[class.qd-tab-current]': 'isSelected && !isDisabled',
|
|
30172
30182
|
'[class.qd-tab-disabled]': 'isDisabled',
|
|
30173
|
-
'[class.qd-tab-done]':
|
|
30174
|
-
'[class.qd-tab-edit]':
|
|
30175
|
-
'[class.qd-tab-error]':
|
|
30183
|
+
'[class.qd-tab-done]': "state === 'done'",
|
|
30184
|
+
'[class.qd-tab-edit]': "state === 'edit'",
|
|
30185
|
+
'[class.qd-tab-error]': "state === 'error'"
|
|
30176
30186
|
}, 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"] }]
|
|
30177
|
-
}],
|
|
30187
|
+
}], propDecorators: { state: [{
|
|
30178
30188
|
type: Input
|
|
30179
30189
|
}], label: [{
|
|
30180
30190
|
type: Input
|
|
@@ -30191,6 +30201,105 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
30191
30201
|
args: ['data-test-id']
|
|
30192
30202
|
}] } });
|
|
30193
30203
|
|
|
30204
|
+
// @ts-strict-ignore
|
|
30205
|
+
/**
|
|
30206
|
+
* The **QdPageTab** is a single tab inside the **QdPageTabs** within a **QdPage**.
|
|
30207
|
+
*/
|
|
30208
|
+
class QdPageTabComponent {
|
|
30209
|
+
_pageTabs = inject(forwardRef(() => QdPageTabsComponent));
|
|
30210
|
+
translate = inject(TranslateService);
|
|
30211
|
+
/**
|
|
30212
|
+
* Configuration of QdPageTabComponent.
|
|
30213
|
+
*
|
|
30214
|
+
* * @note The use of CDK attributes is not permitted. Please configure this component here.
|
|
30215
|
+
*/
|
|
30216
|
+
config;
|
|
30217
|
+
/** Form control for this tab. */
|
|
30218
|
+
set tabControl(tabControl) {
|
|
30219
|
+
this.stepControl = tabControl;
|
|
30220
|
+
}
|
|
30221
|
+
get tabControl() {
|
|
30222
|
+
return this.stepControl;
|
|
30223
|
+
}
|
|
30224
|
+
infoBanners;
|
|
30225
|
+
content;
|
|
30226
|
+
stepControl;
|
|
30227
|
+
interacted = false;
|
|
30228
|
+
editable = true;
|
|
30229
|
+
get completed() {
|
|
30230
|
+
if (!this.interacted)
|
|
30231
|
+
return false;
|
|
30232
|
+
const control = this.tabControl;
|
|
30233
|
+
if (!control)
|
|
30234
|
+
return true;
|
|
30235
|
+
return !control.invalid && !control.pending;
|
|
30236
|
+
}
|
|
30237
|
+
get hasError() {
|
|
30238
|
+
return this.interacted && !!this.tabControl?.invalid;
|
|
30239
|
+
}
|
|
30240
|
+
_destroyed$ = new Subject();
|
|
30241
|
+
select() {
|
|
30242
|
+
const index = this._pageTabs.tabs.toArray().indexOf(this);
|
|
30243
|
+
if (index >= 0)
|
|
30244
|
+
this._pageTabs.selectedIndex = index;
|
|
30245
|
+
}
|
|
30246
|
+
ngOnInit() {
|
|
30247
|
+
this.validateLabel();
|
|
30248
|
+
if (this.tabControl)
|
|
30249
|
+
this.initErrorCheck();
|
|
30250
|
+
}
|
|
30251
|
+
ngOnChanges(changes) {
|
|
30252
|
+
['label', 'errorMessage', 'state']
|
|
30253
|
+
.filter(inputName => !!changes[inputName])
|
|
30254
|
+
.forEach(inputName => this.blockCdkInput(inputName));
|
|
30255
|
+
}
|
|
30256
|
+
ngOnDestroy() {
|
|
30257
|
+
this._destroyed$.complete();
|
|
30258
|
+
}
|
|
30259
|
+
blockCdkInput(inputName) {
|
|
30260
|
+
throw new Error(`Quadrel Framework | QdPageTab - The use of the "${inputName}" attribute is not permitted. Please use QdPageTabConfig instead.`);
|
|
30261
|
+
}
|
|
30262
|
+
validateLabel() {
|
|
30263
|
+
if (!this.config?.label?.i18n)
|
|
30264
|
+
console.error('Quadrel Framework | QdPageTab - Please provide a label for the tab.');
|
|
30265
|
+
}
|
|
30266
|
+
initErrorCheck() {
|
|
30267
|
+
this.tabControl.statusChanges.pipe(takeUntil$1(this._destroyed$)).subscribe(() => {
|
|
30268
|
+
if (this.hasAnyError(this.tabControl)) {
|
|
30269
|
+
this.interacted = true;
|
|
30270
|
+
}
|
|
30271
|
+
this._pageTabs._stateChanged();
|
|
30272
|
+
});
|
|
30273
|
+
}
|
|
30274
|
+
hasAnyError(control) {
|
|
30275
|
+
if (control.errors && control.touched)
|
|
30276
|
+
return true;
|
|
30277
|
+
if (control instanceof FormGroup) {
|
|
30278
|
+
return Object.values(control.controls).some(control => this.hasAnyError(control));
|
|
30279
|
+
}
|
|
30280
|
+
if (control instanceof FormArray) {
|
|
30281
|
+
return control.controls.some(control => this.hasAnyError(control));
|
|
30282
|
+
}
|
|
30283
|
+
return false;
|
|
30284
|
+
}
|
|
30285
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
30286
|
+
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 });
|
|
30287
|
+
}
|
|
30288
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabComponent, decorators: [{
|
|
30289
|
+
type: Component,
|
|
30290
|
+
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"] }]
|
|
30291
|
+
}], propDecorators: { config: [{
|
|
30292
|
+
type: Input
|
|
30293
|
+
}], tabControl: [{
|
|
30294
|
+
type: Input
|
|
30295
|
+
}], infoBanners: [{
|
|
30296
|
+
type: ContentChildren,
|
|
30297
|
+
args: [QdPageInfoBannerComponent]
|
|
30298
|
+
}], content: [{
|
|
30299
|
+
type: ViewChild,
|
|
30300
|
+
args: [TemplateRef, { static: true }]
|
|
30301
|
+
}] } });
|
|
30302
|
+
|
|
30194
30303
|
const TAB_PARAM_NAME = 'tab';
|
|
30195
30304
|
const OWNED_PARAMS = [TAB_PARAM_NAME];
|
|
30196
30305
|
const FEATURE_LABEL = { name: 'Page Tabs', plural: 'page tabs' };
|
|
@@ -30208,9 +30317,9 @@ const FEATURE_LABEL = { name: 'Page Tabs', plural: 'page tabs' };
|
|
|
30208
30317
|
* write pipeline (see commit 57f0a271a).
|
|
30209
30318
|
*
|
|
30210
30319
|
* Internal invariant: when the requested tab is unknown or disabled, `selectFallbackTab()`
|
|
30211
|
-
* writes the URL explicitly.
|
|
30212
|
-
*
|
|
30213
|
-
*
|
|
30320
|
+
* writes the URL explicitly. `selectionChange` is not emitted if the fallback is already
|
|
30321
|
+
* the selected tab, so without the explicit write deep-links like `?tab=phantom` would
|
|
30322
|
+
* leave a stale param in the URL.
|
|
30214
30323
|
*/
|
|
30215
30324
|
class QdPageTabsRouterConnectorService {
|
|
30216
30325
|
_hub = inject(QdRouterQueryParamHubService);
|
|
@@ -30260,7 +30369,7 @@ class QdPageTabsRouterConnectorService {
|
|
|
30260
30369
|
subscribeToTabChanges() {
|
|
30261
30370
|
const component = this._connectedComponent;
|
|
30262
30371
|
this._writeSubscription = component.selectionChange
|
|
30263
|
-
.pipe(map(event => event.
|
|
30372
|
+
.pipe(map(event => event.selectedTab?.config?.name), takeUntilDestroyed(this._destroyRef))
|
|
30264
30373
|
.subscribe(name => this.writeUrl(name));
|
|
30265
30374
|
}
|
|
30266
30375
|
writeUrl(name) {
|
|
@@ -30496,10 +30605,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
30496
30605
|
* - If an invalid tab name is provided in URL, the first available tab is selected
|
|
30497
30606
|
* - If no tab parameter is present, the `selectedIndex` or first non-disabled tab is selected
|
|
30498
30607
|
*/
|
|
30499
|
-
class QdPageTabsComponent
|
|
30608
|
+
class QdPageTabsComponent {
|
|
30500
30609
|
footerService = inject(QdPageFooterService, { optional: true });
|
|
30501
30610
|
pageStoreService = inject(QdPageStoreService);
|
|
30502
30611
|
routerConnector = inject(QdPageTabsRouterConnectorService);
|
|
30612
|
+
_changeDetectorRef = inject(ChangeDetectorRef);
|
|
30613
|
+
destroyRef = inject(DestroyRef);
|
|
30614
|
+
static _idCounter = 0;
|
|
30615
|
+
_id = QdPageTabsComponent._idCounter++;
|
|
30616
|
+
get hasPageFooter() {
|
|
30617
|
+
return !!this.footerService;
|
|
30618
|
+
}
|
|
30503
30619
|
/**
|
|
30504
30620
|
* Configuration of QdPageTabs.
|
|
30505
30621
|
*/
|
|
@@ -30509,23 +30625,46 @@ class QdPageTabsComponent extends CdkStepper {
|
|
|
30509
30625
|
*/
|
|
30510
30626
|
testId = 'page-tabs';
|
|
30511
30627
|
tabSelection = new EventEmitter();
|
|
30628
|
+
selectionChange = new EventEmitter();
|
|
30629
|
+
_tabs;
|
|
30630
|
+
linear = false;
|
|
30631
|
+
_selectedIndex = 0;
|
|
30512
30632
|
_viewonly;
|
|
30513
|
-
destroyRef = inject(DestroyRef);
|
|
30514
30633
|
get tabs() {
|
|
30515
|
-
return this.
|
|
30634
|
+
return this._tabs;
|
|
30516
30635
|
}
|
|
30517
30636
|
get selected() {
|
|
30518
|
-
return
|
|
30637
|
+
return this._tabs?.get(this._selectedIndex);
|
|
30519
30638
|
}
|
|
30520
|
-
set selected(
|
|
30521
|
-
|
|
30639
|
+
set selected(tab) {
|
|
30640
|
+
if (!tab)
|
|
30641
|
+
return;
|
|
30642
|
+
const index = this._tabs?.toArray().indexOf(tab);
|
|
30643
|
+
if (index !== undefined && index >= 0) {
|
|
30644
|
+
this.selectedIndex = index;
|
|
30645
|
+
}
|
|
30522
30646
|
}
|
|
30523
|
-
|
|
30524
|
-
|
|
30525
|
-
|
|
30526
|
-
|
|
30527
|
-
|
|
30528
|
-
|
|
30647
|
+
get selectedIndex() {
|
|
30648
|
+
return this._selectedIndex;
|
|
30649
|
+
}
|
|
30650
|
+
set selectedIndex(newIndex) {
|
|
30651
|
+
if (newIndex === this._selectedIndex)
|
|
30652
|
+
return;
|
|
30653
|
+
const prevIndex = this._selectedIndex;
|
|
30654
|
+
const prevTab = this._tabs?.get(prevIndex);
|
|
30655
|
+
if (prevTab?.tabControl) {
|
|
30656
|
+
prevTab.interacted = true;
|
|
30657
|
+
}
|
|
30658
|
+
this._selectedIndex = newIndex;
|
|
30659
|
+
if (this._tabs) {
|
|
30660
|
+
this.selectionChange.emit({
|
|
30661
|
+
selectedIndex: newIndex,
|
|
30662
|
+
previouslySelectedIndex: prevIndex,
|
|
30663
|
+
selectedTab: this._tabs.get(newIndex),
|
|
30664
|
+
previouslySelectedTab: this._tabs.get(prevIndex)
|
|
30665
|
+
});
|
|
30666
|
+
}
|
|
30667
|
+
this._changeDetectorRef.markForCheck();
|
|
30529
30668
|
}
|
|
30530
30669
|
ngOnInit() {
|
|
30531
30670
|
this.linear = false;
|
|
@@ -30533,30 +30672,19 @@ class QdPageTabsComponent extends CdkStepper {
|
|
|
30533
30672
|
this._viewonly = v;
|
|
30534
30673
|
this._stateChanged();
|
|
30535
30674
|
});
|
|
30675
|
+
this.selectionChange.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(event => {
|
|
30676
|
+
this.tabSelection.emit(event);
|
|
30677
|
+
});
|
|
30536
30678
|
}
|
|
30537
30679
|
ngOnChanges(changes) {
|
|
30538
30680
|
['linear', 'selectedIndex', 'selected', 'orientation']
|
|
30539
30681
|
.filter(inputName => !!changes[inputName])
|
|
30540
30682
|
.forEach(inputName => this.blockCdkInput(inputName));
|
|
30541
30683
|
}
|
|
30542
|
-
_getIndicatorType(index, state) {
|
|
30543
|
-
if (state)
|
|
30544
|
-
return state;
|
|
30545
|
-
const step = this.steps.get(index);
|
|
30546
|
-
if (!step)
|
|
30547
|
-
return 'number';
|
|
30548
|
-
if (step.hasError)
|
|
30549
|
-
return 'error';
|
|
30550
|
-
if (step.completed)
|
|
30551
|
-
return step.editable ? 'edit' : 'done';
|
|
30552
|
-
return 'number';
|
|
30553
|
-
}
|
|
30554
30684
|
ngAfterContentInit() {
|
|
30555
|
-
|
|
30556
|
-
this.tabs.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => this._stateChanged());
|
|
30685
|
+
this._tabs.changes.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => this._stateChanged());
|
|
30557
30686
|
}
|
|
30558
30687
|
ngAfterViewInit() {
|
|
30559
|
-
super.ngAfterViewInit();
|
|
30560
30688
|
setTimeout(() => {
|
|
30561
30689
|
if (this.config?.connectWithRouter) {
|
|
30562
30690
|
this.configureBookmarkableTabs();
|
|
@@ -30565,9 +30693,42 @@ class QdPageTabsComponent extends CdkStepper {
|
|
|
30565
30693
|
this.initializeTabSelection();
|
|
30566
30694
|
});
|
|
30567
30695
|
}
|
|
30696
|
+
_stateChanged() {
|
|
30697
|
+
this._changeDetectorRef.markForCheck();
|
|
30698
|
+
}
|
|
30699
|
+
_getIndicatorType(index) {
|
|
30700
|
+
const tab = this._tabs.get(index);
|
|
30701
|
+
if (!tab)
|
|
30702
|
+
return 'number';
|
|
30703
|
+
if (tab.hasError && !this._viewonly)
|
|
30704
|
+
return 'error';
|
|
30705
|
+
if (tab.completed)
|
|
30706
|
+
return tab.editable ? 'edit' : 'done';
|
|
30707
|
+
return 'number';
|
|
30708
|
+
}
|
|
30709
|
+
_getTabLabelId(i) {
|
|
30710
|
+
return `qd-tabs-${this._id}-label-${i}`;
|
|
30711
|
+
}
|
|
30712
|
+
save() {
|
|
30713
|
+
this.selected?.tabControl?.markAllAsTouched();
|
|
30714
|
+
const tabControlValues = this._tabs.map(tab => tab.tabControl?.value);
|
|
30715
|
+
this.config?.submitButton?.handler?.(tabControlValues);
|
|
30716
|
+
}
|
|
30717
|
+
selectTab(tab) {
|
|
30718
|
+
if (tab.config?.isDisabled)
|
|
30719
|
+
return;
|
|
30720
|
+
tab.select();
|
|
30721
|
+
}
|
|
30722
|
+
isSubmitButtonShown() {
|
|
30723
|
+
return this.config?.submitButton?.isHidden !== true && !this.footerService;
|
|
30724
|
+
}
|
|
30725
|
+
isSubmitButtonDisabled() {
|
|
30726
|
+
return this.config?.submitButton?.isDisabled;
|
|
30727
|
+
}
|
|
30568
30728
|
initializeTabSelection() {
|
|
30569
30729
|
if (this.config?.selectedIndex && this.isTabSelectable(this.config.selectedIndex)) {
|
|
30570
|
-
this.
|
|
30730
|
+
this._selectedIndex = this.config.selectedIndex;
|
|
30731
|
+
this._changeDetectorRef.markForCheck();
|
|
30571
30732
|
return;
|
|
30572
30733
|
}
|
|
30573
30734
|
this.selectFirstNotDisabledTab();
|
|
@@ -30576,19 +30737,20 @@ class QdPageTabsComponent extends CdkStepper {
|
|
|
30576
30737
|
this.routerConnector.connectTabsWithRouter(this).pipe(takeUntilDestroyed(this.destroyRef)).subscribe();
|
|
30577
30738
|
}
|
|
30578
30739
|
isTabSelectable(index) {
|
|
30579
|
-
const tab = this.
|
|
30740
|
+
const tab = this._tabs.get(index);
|
|
30580
30741
|
return !!tab && !tab.config.isDisabled;
|
|
30581
30742
|
}
|
|
30582
30743
|
/**
|
|
30583
30744
|
* Selects the first tab that is not disabled.
|
|
30584
30745
|
*/
|
|
30585
30746
|
selectFirstNotDisabledTab() {
|
|
30586
|
-
this.
|
|
30747
|
+
this._tabs.some((tab, tabIndex) => {
|
|
30587
30748
|
if (!tab.config.isDisabled) {
|
|
30588
30749
|
if (this.config) {
|
|
30589
30750
|
this.config.selectedIndex = tabIndex;
|
|
30590
30751
|
}
|
|
30591
|
-
this.
|
|
30752
|
+
this._selectedIndex = tabIndex;
|
|
30753
|
+
this._changeDetectorRef.markForCheck();
|
|
30592
30754
|
return true;
|
|
30593
30755
|
}
|
|
30594
30756
|
else {
|
|
@@ -30596,51 +30758,25 @@ class QdPageTabsComponent extends CdkStepper {
|
|
|
30596
30758
|
}
|
|
30597
30759
|
});
|
|
30598
30760
|
}
|
|
30599
|
-
save() {
|
|
30600
|
-
this.selected?.tabControl?.markAllAsTouched();
|
|
30601
|
-
const tabControlValues = this.tabs.map(tab => tab.tabControl?.value);
|
|
30602
|
-
this.config?.submitButton?.handler?.(tabControlValues);
|
|
30603
|
-
}
|
|
30604
|
-
selectTab(tab) {
|
|
30605
|
-
if (tab.config?.isDisabled)
|
|
30606
|
-
return;
|
|
30607
|
-
tab.select();
|
|
30608
|
-
}
|
|
30609
|
-
isSubmitButtonShown() {
|
|
30610
|
-
return this.config?.submitButton?.isHidden !== true && !this.footerService;
|
|
30611
|
-
}
|
|
30612
|
-
isSubmitButtonDisabled() {
|
|
30613
|
-
return this.config?.submitButton?.isDisabled;
|
|
30614
|
-
}
|
|
30615
|
-
_getTabLabelId(i) {
|
|
30616
|
-
return this._getStepLabelId(i);
|
|
30617
|
-
}
|
|
30618
30761
|
blockCdkInput(inputName) {
|
|
30619
30762
|
throw new Error(`Quadrel Framework | QdPageTabs - The use of the "${inputName}" attribute is not permitted. Please use QdPageTabsConfig instead.`);
|
|
30620
30763
|
}
|
|
30621
|
-
mapSelectionChangeToTabSelectionOutput() {
|
|
30622
|
-
this.selectionChange.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(selectionEvent => {
|
|
30623
|
-
this.tabSelection.emit({
|
|
30624
|
-
selectedIndex: selectionEvent.selectedIndex,
|
|
30625
|
-
previouslySelectedIndex: selectionEvent.previouslySelectedIndex,
|
|
30626
|
-
selectedTab: selectionEvent.selectedStep,
|
|
30627
|
-
previouslySelectedTab: selectionEvent.previouslySelectedStep
|
|
30628
|
-
});
|
|
30629
|
-
});
|
|
30630
|
-
}
|
|
30631
30764
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
30632
|
-
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: [{
|
|
30765
|
+
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 });
|
|
30633
30766
|
}
|
|
30634
30767
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabsComponent, decorators: [{
|
|
30635
30768
|
type: Component,
|
|
30636
|
-
args: [{ selector: 'qd-page-tabs', providers: [
|
|
30637
|
-
}],
|
|
30769
|
+
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"] }]
|
|
30770
|
+
}], propDecorators: { config: [{
|
|
30638
30771
|
type: Input
|
|
30639
30772
|
}], testId: [{
|
|
30640
30773
|
type: Input,
|
|
30641
30774
|
args: ['data-test-id']
|
|
30642
30775
|
}], tabSelection: [{
|
|
30643
30776
|
type: Output
|
|
30777
|
+
}], _tabs: [{
|
|
30778
|
+
type: ContentChildren,
|
|
30779
|
+
args: [forwardRef(() => QdPageTabComponent)]
|
|
30644
30780
|
}] } });
|
|
30645
30781
|
|
|
30646
30782
|
class QdPageSubmitActionService {
|
|
@@ -33621,6 +33757,9 @@ class QdShellComponent {
|
|
|
33621
33757
|
*/
|
|
33622
33758
|
shellHeaderComponent;
|
|
33623
33759
|
commentsComponent;
|
|
33760
|
+
get isCommentsDisplayed() {
|
|
33761
|
+
return this.shellHeaderComponent?.isCommentsDisplayed ?? false;
|
|
33762
|
+
}
|
|
33624
33763
|
hasNavigation$;
|
|
33625
33764
|
isNavigationPinned$;
|
|
33626
33765
|
isNavigationRolledOver$;
|
|
@@ -33693,7 +33832,7 @@ class QdShellComponent {
|
|
|
33693
33832
|
QdShellLeftService,
|
|
33694
33833
|
QdShellRightService,
|
|
33695
33834
|
{ provide: 'rwdLayout', useValue: { hasLegacyLayout: false } }
|
|
33696
|
-
], queries: [{ propertyName: "commentsComponent", predicate: QdCommentsComponent }], viewQueries: [{ propertyName: "shellHeaderComponent", first: true, predicate: QdShellHeaderComponent, descendants: true }], ngImport: i0, template: "<div\n [ngClass]=\"{\n 'qd-shell': true,\n 'has-navigation': hasNavigation$ | async,\n 'left-pinned': isNavigationPinned$ | async,\n 'left-rolled-over': isNavigationRolledOver$ | async,\n 'shell-right-open': isShellRightOpen$ | async,\n 'shell-right-pinned': isShellRightPinned$ | async\n }\"\n>\n <header\n qd-shell-header\n [config]=\"config\"\n [isMinimized]=\"(isMinimized$ | async) ?? true\"\n [isCommentsUsed]=\"commentsComponent.length > 0\"\n [hasComments]=\"commentsComponent.get(0)?.hasComments$ | async\"\n ></header>\n\n <aside\n qd-shell-left\n *ngIf=\"hasNavigation$ | async\"\n [ngClass]=\"{ pinned: isNavigationPinned$ | async, 'rolled-over': isNavigationRolledOver$ | async }\"\n >\n <qd-shell-navigation [config]=\"config.navigation\"></qd-shell-navigation>\n </aside>\n\n <main [ngClass]=\"{ faded: isFaded$ | async }\">\n <router-outlet (activate)=\"handleRouterOutletActivation($event)\"></router-outlet>\n </main>\n\n <aside\n qd-shell-right\n *ngIf=\"isShellRightOpen$ | async\"\n [config]=\"config\"\n [ngClass]=\"{\n pinned: isShellRightPinned$ | async\n }\"\n >\n <!-- TODO: Remove in v17! -->\n <ng-container *ngIf=\"commentsComponent.length > 0 &&
|
|
33835
|
+
], queries: [{ propertyName: "commentsComponent", predicate: QdCommentsComponent }], viewQueries: [{ propertyName: "shellHeaderComponent", first: true, predicate: QdShellHeaderComponent, descendants: true }], ngImport: i0, template: "<div\n [ngClass]=\"{\n 'qd-shell': true,\n 'has-navigation': hasNavigation$ | async,\n 'left-pinned': isNavigationPinned$ | async,\n 'left-rolled-over': isNavigationRolledOver$ | async,\n 'shell-right-open': isShellRightOpen$ | async,\n 'shell-right-pinned': isShellRightPinned$ | async\n }\"\n>\n <header\n qd-shell-header\n [config]=\"config\"\n [isMinimized]=\"(isMinimized$ | async) ?? true\"\n [isCommentsUsed]=\"commentsComponent.length > 0\"\n [hasComments]=\"commentsComponent.get(0)?.hasComments$ | async\"\n ></header>\n\n <aside\n qd-shell-left\n *ngIf=\"hasNavigation$ | async\"\n [ngClass]=\"{ pinned: isNavigationPinned$ | async, 'rolled-over': isNavigationRolledOver$ | async }\"\n >\n <qd-shell-navigation [config]=\"config.navigation\"></qd-shell-navigation>\n </aside>\n\n <main [ngClass]=\"{ faded: isFaded$ | async }\">\n <router-outlet (activate)=\"handleRouterOutletActivation($event)\"></router-outlet>\n </main>\n\n <aside\n qd-shell-right\n *ngIf=\"isShellRightOpen$ | async\"\n [config]=\"config\"\n [ngClass]=\"{\n pinned: isShellRightPinned$ | async\n }\"\n >\n <!-- TODO: Remove in v17! -->\n <ng-container *ngIf=\"commentsComponent.length > 0 && isCommentsDisplayed\"\n ><ng-content select=\"qd-comments\"></ng-content\n ></ng-container>\n\n <qd-shell-notifications *ngIf=\"!isCommentsDisplayed\"></qd-shell-notifications>\n </aside>\n\n <footer\n qd-shell-footer\n [copyrightInfo]=\"config.copyrightInfo\"\n [isSticky]=\"config.isFooterSticky\"\n *ngIf=\"isHome$ | async\"\n ></footer>\n</div>\n", styles: [":host{display:block}:host .qd-shell{display:grid;min-height:100vh;background-color:#efefef;grid-template-areas:\"header\" \"main\" \"footer\";grid-template-rows:auto 1fr auto}:host .qd-shell.has-navigation{grid-template-areas:\"header header\" \"aside-left main\" \"footer footer\";grid-template-columns:3rem 1fr;transition:grid-template-columns .3s linear}:host .qd-shell.has-navigation.shell-right-open{grid-template-areas:\"header header header\" \"aside-left main aside-right\" \"footer footer footer\";grid-template-columns:3rem 1fr 0}:host .qd-shell.has-navigation.shell-right-open.shell-right-pinned{grid-template-columns:3rem 1fr 0}:host .qd-shell.has-navigation.shell-right-open.shell-right-pinned main{margin-right:18.75rem}:host .qd-shell.has-navigation.left-pinned{grid-template-columns:18.75rem 1fr}:host .qd-shell.has-navigation.left-pinned.shell-right-open{grid-template-columns:18.75rem 1fr 0}:host .qd-shell.has-navigation.left-pinned.shell-right-open.shell-right-pinned{grid-template-columns:18.75rem 1fr 0}:host .qd-shell.has-navigation.left-pinned.shell-right-open.shell-right-pinned main{margin-right:18.75rem}:host .qd-shell:not(.has-navigation).shell-right-open{grid-template-areas:\"header header\" \"main aside-right\" \"footer footer\";grid-template-columns:1fr 0}:host .qd-shell:not(.has-navigation).shell-right-open.shell-right-pinned{grid-template-columns:1fr 0}:host .qd-shell:not(.has-navigation).shell-right-open.shell-right-pinned main{margin-right:18.75rem}:host .qd-shell ::ng-deep qd-container:not(:last-of-type){border-bottom:rgb(213,213,213) solid .0625rem}:host main{position:relative}:host main.faded:after{position:absolute;z-index:1400;background:#000;content:\"\";inset:0;opacity:.5}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: QdShellFooterComponent, selector: "[qd-shell-footer]", inputs: ["copyrightInfo", "isSticky"] }, { kind: "component", type: QdShellHeaderComponent, selector: "[qd-shell-header]", inputs: ["config", "isMinimized", "isCommentsUsed", "hasComments"], outputs: ["menuIconChange"] }, { kind: "component", type: QdShellLeftComponent, selector: "[qd-shell-left]", inputs: ["navigationTemplateRef"] }, { kind: "component", type: QdShellRightComponent, selector: "[qd-shell-right]", inputs: ["config"] }, { kind: "component", type: QdShellNotificationsComponent, selector: "qd-shell-notifications" }, { kind: "component", type: QdShellNavigationComponent, selector: "qd-shell-navigation", inputs: ["config"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
|
|
33697
33836
|
}
|
|
33698
33837
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdShellComponent, decorators: [{
|
|
33699
33838
|
type: Component,
|
|
@@ -33702,7 +33841,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
33702
33841
|
QdShellLeftService,
|
|
33703
33842
|
QdShellRightService,
|
|
33704
33843
|
{ provide: 'rwdLayout', useValue: { hasLegacyLayout: false } }
|
|
33705
|
-
], standalone: false, template: "<div\n [ngClass]=\"{\n 'qd-shell': true,\n 'has-navigation': hasNavigation$ | async,\n 'left-pinned': isNavigationPinned$ | async,\n 'left-rolled-over': isNavigationRolledOver$ | async,\n 'shell-right-open': isShellRightOpen$ | async,\n 'shell-right-pinned': isShellRightPinned$ | async\n }\"\n>\n <header\n qd-shell-header\n [config]=\"config\"\n [isMinimized]=\"(isMinimized$ | async) ?? true\"\n [isCommentsUsed]=\"commentsComponent.length > 0\"\n [hasComments]=\"commentsComponent.get(0)?.hasComments$ | async\"\n ></header>\n\n <aside\n qd-shell-left\n *ngIf=\"hasNavigation$ | async\"\n [ngClass]=\"{ pinned: isNavigationPinned$ | async, 'rolled-over': isNavigationRolledOver$ | async }\"\n >\n <qd-shell-navigation [config]=\"config.navigation\"></qd-shell-navigation>\n </aside>\n\n <main [ngClass]=\"{ faded: isFaded$ | async }\">\n <router-outlet (activate)=\"handleRouterOutletActivation($event)\"></router-outlet>\n </main>\n\n <aside\n qd-shell-right\n *ngIf=\"isShellRightOpen$ | async\"\n [config]=\"config\"\n [ngClass]=\"{\n pinned: isShellRightPinned$ | async\n }\"\n >\n <!-- TODO: Remove in v17! -->\n <ng-container *ngIf=\"commentsComponent.length > 0 &&
|
|
33844
|
+
], standalone: false, template: "<div\n [ngClass]=\"{\n 'qd-shell': true,\n 'has-navigation': hasNavigation$ | async,\n 'left-pinned': isNavigationPinned$ | async,\n 'left-rolled-over': isNavigationRolledOver$ | async,\n 'shell-right-open': isShellRightOpen$ | async,\n 'shell-right-pinned': isShellRightPinned$ | async\n }\"\n>\n <header\n qd-shell-header\n [config]=\"config\"\n [isMinimized]=\"(isMinimized$ | async) ?? true\"\n [isCommentsUsed]=\"commentsComponent.length > 0\"\n [hasComments]=\"commentsComponent.get(0)?.hasComments$ | async\"\n ></header>\n\n <aside\n qd-shell-left\n *ngIf=\"hasNavigation$ | async\"\n [ngClass]=\"{ pinned: isNavigationPinned$ | async, 'rolled-over': isNavigationRolledOver$ | async }\"\n >\n <qd-shell-navigation [config]=\"config.navigation\"></qd-shell-navigation>\n </aside>\n\n <main [ngClass]=\"{ faded: isFaded$ | async }\">\n <router-outlet (activate)=\"handleRouterOutletActivation($event)\"></router-outlet>\n </main>\n\n <aside\n qd-shell-right\n *ngIf=\"isShellRightOpen$ | async\"\n [config]=\"config\"\n [ngClass]=\"{\n pinned: isShellRightPinned$ | async\n }\"\n >\n <!-- TODO: Remove in v17! -->\n <ng-container *ngIf=\"commentsComponent.length > 0 && isCommentsDisplayed\"\n ><ng-content select=\"qd-comments\"></ng-content\n ></ng-container>\n\n <qd-shell-notifications *ngIf=\"!isCommentsDisplayed\"></qd-shell-notifications>\n </aside>\n\n <footer\n qd-shell-footer\n [copyrightInfo]=\"config.copyrightInfo\"\n [isSticky]=\"config.isFooterSticky\"\n *ngIf=\"isHome$ | async\"\n ></footer>\n</div>\n", styles: [":host{display:block}:host .qd-shell{display:grid;min-height:100vh;background-color:#efefef;grid-template-areas:\"header\" \"main\" \"footer\";grid-template-rows:auto 1fr auto}:host .qd-shell.has-navigation{grid-template-areas:\"header header\" \"aside-left main\" \"footer footer\";grid-template-columns:3rem 1fr;transition:grid-template-columns .3s linear}:host .qd-shell.has-navigation.shell-right-open{grid-template-areas:\"header header header\" \"aside-left main aside-right\" \"footer footer footer\";grid-template-columns:3rem 1fr 0}:host .qd-shell.has-navigation.shell-right-open.shell-right-pinned{grid-template-columns:3rem 1fr 0}:host .qd-shell.has-navigation.shell-right-open.shell-right-pinned main{margin-right:18.75rem}:host .qd-shell.has-navigation.left-pinned{grid-template-columns:18.75rem 1fr}:host .qd-shell.has-navigation.left-pinned.shell-right-open{grid-template-columns:18.75rem 1fr 0}:host .qd-shell.has-navigation.left-pinned.shell-right-open.shell-right-pinned{grid-template-columns:18.75rem 1fr 0}:host .qd-shell.has-navigation.left-pinned.shell-right-open.shell-right-pinned main{margin-right:18.75rem}:host .qd-shell:not(.has-navigation).shell-right-open{grid-template-areas:\"header header\" \"main aside-right\" \"footer footer\";grid-template-columns:1fr 0}:host .qd-shell:not(.has-navigation).shell-right-open.shell-right-pinned{grid-template-columns:1fr 0}:host .qd-shell:not(.has-navigation).shell-right-open.shell-right-pinned main{margin-right:18.75rem}:host .qd-shell ::ng-deep qd-container:not(:last-of-type){border-bottom:rgb(213,213,213) solid .0625rem}:host main{position:relative}:host main.faded:after{position:absolute;z-index:1400;background:#000;content:\"\";inset:0;opacity:.5}\n"] }]
|
|
33706
33845
|
}], ctorParameters: () => [], propDecorators: { config: [{
|
|
33707
33846
|
type: Input
|
|
33708
33847
|
}], searchQueryStringOutput: [{
|
|
@@ -34221,92 +34360,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
34221
34360
|
}]
|
|
34222
34361
|
}] });
|
|
34223
34362
|
|
|
34224
|
-
|
|
34225
|
-
|
|
34226
|
-
|
|
34227
|
-
|
|
34228
|
-
|
|
34229
|
-
|
|
34230
|
-
/**
|
|
34231
|
-
* Configuration of QdPageTabComponent.
|
|
34232
|
-
*
|
|
34233
|
-
* * @note The use of CDK attributes is not permitted. Please configure this component here.
|
|
34234
|
-
*/
|
|
34235
|
-
config;
|
|
34236
|
-
/** Form control for this tab. */
|
|
34237
|
-
set tabControl(tabControl) {
|
|
34238
|
-
this.stepControl = tabControl;
|
|
34239
|
-
}
|
|
34240
|
-
get tabControl() {
|
|
34241
|
-
return this.stepControl;
|
|
34242
|
-
}
|
|
34243
|
-
infoBanners;
|
|
34244
|
-
_destroyed$ = new Subject();
|
|
34245
|
-
constructor() {
|
|
34246
|
-
const tabs = inject(QdPageTabsComponent);
|
|
34247
|
-
const stepperOptions = inject(STEPPER_GLOBAL_OPTIONS, { optional: true });
|
|
34248
|
-
super(tabs, stepperOptions);
|
|
34249
|
-
}
|
|
34250
|
-
ngOnInit() {
|
|
34251
|
-
this.validateLabel();
|
|
34252
|
-
if (this.tabControl)
|
|
34253
|
-
this.initErrorCheck();
|
|
34254
|
-
}
|
|
34255
|
-
ngOnChanges(changes) {
|
|
34256
|
-
super.ngOnChanges();
|
|
34257
|
-
['label', 'errorMessage', 'state']
|
|
34258
|
-
.filter(inputName => !!changes[inputName])
|
|
34259
|
-
.forEach(inputName => this.blockCdkInput(inputName));
|
|
34260
|
-
}
|
|
34261
|
-
ngOnDestroy() {
|
|
34262
|
-
this._destroyed$.complete();
|
|
34263
|
-
}
|
|
34264
|
-
blockCdkInput(inputName) {
|
|
34265
|
-
throw new Error(`Quadrel Framework | QdPageTab - The use of the "${inputName}" attribute is not permitted. Please use QdPageTabConfig instead.`);
|
|
34266
|
-
}
|
|
34267
|
-
validateLabel() {
|
|
34268
|
-
if (!this.config?.label?.i18n)
|
|
34269
|
-
console.error('Quadrel Framework | QdPageTab - Please provide a label for the tab.');
|
|
34270
|
-
}
|
|
34271
|
-
initErrorCheck() {
|
|
34272
|
-
this.tabControl.statusChanges.pipe(takeUntil$1(this._destroyed$)).subscribe(() => {
|
|
34273
|
-
if (this.hasAnyError(this.tabControl)) {
|
|
34274
|
-
this.interacted = true;
|
|
34275
|
-
}
|
|
34276
|
-
});
|
|
34277
|
-
}
|
|
34278
|
-
hasAnyError(control) {
|
|
34279
|
-
if (control.errors && control.touched)
|
|
34280
|
-
return true;
|
|
34281
|
-
if (control instanceof FormGroup) {
|
|
34282
|
-
return Object.values(control.controls).some(control => this.hasAnyError(control));
|
|
34283
|
-
}
|
|
34284
|
-
if (control instanceof FormArray) {
|
|
34285
|
-
return control.controls.some(control => this.hasAnyError(control));
|
|
34286
|
-
}
|
|
34287
|
-
return false;
|
|
34288
|
-
}
|
|
34289
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
34290
|
-
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: [
|
|
34291
|
-
{ provide: CdkStep, useExisting: QdPageTabComponent },
|
|
34292
|
-
{ provide: STEPPER_GLOBAL_OPTIONS, useValue: { showError: true } }
|
|
34293
|
-
], 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 });
|
|
34294
|
-
}
|
|
34295
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabComponent, decorators: [{
|
|
34296
|
-
type: Component,
|
|
34297
|
-
args: [{ selector: 'qd-page-tab', providers: [
|
|
34298
|
-
{ provide: CdkStep, useExisting: QdPageTabComponent },
|
|
34299
|
-
{ provide: STEPPER_GLOBAL_OPTIONS, useValue: { showError: true } }
|
|
34300
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true // inherited by CdkStep
|
|
34301
|
-
, 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"] }]
|
|
34302
|
-
}], ctorParameters: () => [], propDecorators: { config: [{
|
|
34303
|
-
type: Input
|
|
34304
|
-
}], tabControl: [{
|
|
34305
|
-
type: Input
|
|
34306
|
-
}], infoBanners: [{
|
|
34307
|
-
type: ContentChildren,
|
|
34308
|
-
args: [QdPageInfoBannerComponent]
|
|
34309
|
-
}] } });
|
|
34363
|
+
const QD_TAB_STATE = {
|
|
34364
|
+
NUMBER: 'number',
|
|
34365
|
+
ERROR: 'error',
|
|
34366
|
+
DONE: 'done',
|
|
34367
|
+
EDIT: 'edit'
|
|
34368
|
+
};
|
|
34310
34369
|
|
|
34311
34370
|
/**
|
|
34312
34371
|
* **qdPageTabParameterize** turns the active page tab into the `tab` query parameter
|
|
@@ -34338,7 +34397,6 @@ class QdPageTabsModule {
|
|
|
34338
34397
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
34339
34398
|
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabsModule, declarations: [QdPageTabsAdapterDirective], imports: [CommonModule,
|
|
34340
34399
|
TranslateModule,
|
|
34341
|
-
CdkStepperModule,
|
|
34342
34400
|
QdButtonModule,
|
|
34343
34401
|
QdIconModule,
|
|
34344
34402
|
QdPageTabsComponent,
|
|
@@ -34347,7 +34405,6 @@ class QdPageTabsModule {
|
|
|
34347
34405
|
QdPageTabHeaderCountersComponent], exports: [QdPageTabsComponent, QdPageTabComponent, QdPageTabsAdapterDirective] });
|
|
34348
34406
|
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: QdPageTabsModule, imports: [CommonModule,
|
|
34349
34407
|
TranslateModule,
|
|
34350
|
-
CdkStepperModule,
|
|
34351
34408
|
QdButtonModule,
|
|
34352
34409
|
QdIconModule,
|
|
34353
34410
|
QdPageTabsComponent] });
|
|
@@ -34358,7 +34415,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
34358
34415
|
imports: [
|
|
34359
34416
|
CommonModule,
|
|
34360
34417
|
TranslateModule,
|
|
34361
|
-
CdkStepperModule,
|
|
34362
34418
|
QdButtonModule,
|
|
34363
34419
|
QdIconModule,
|
|
34364
34420
|
QdPageTabsComponent,
|
|
@@ -35015,5 +35071,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
|
|
|
35015
35071
|
* Generated bundle index. Do not edit.
|
|
35016
35072
|
*/
|
|
35017
35073
|
|
|
35018
|
-
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, updateHtmlLang };
|
|
35074
|
+
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_TAB_STATE, 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, updateHtmlLang };
|
|
35019
35075
|
//# sourceMappingURL=quadrel-enterprise-ui-framework.mjs.map
|