@quadrel-enterprise-ui/framework 19.8.1 → 19.9.0-beta.104.1

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

@@ -13437,6 +13437,7 @@ class QdMultiInputComponent {
             this.id = v4();
         this.multiInputService.optionsListForView$.pipe(takeUntilDestroyed()).subscribe(list => {
             this.optionsListForView = list;
+            this.changeDetectorRef.markForCheck();
         });
     }
     ngOnInit() {
@@ -13451,10 +13452,18 @@ class QdMultiInputComponent {
             return;
         if (this.formArrayName) {
             const formArray = this.controlContainer.control.get(this.formArrayName);
+            if (!formArray) {
+                console.warn('QD-UI | QdMultiInputComponent - No form control found for the provided [formArrayName]', this.formArrayName);
+                return;
+            }
             // Updating form array programmatically from outside
-            this._subs.add(formArray.valueChanges.subscribe(() => {
-                this.multiInputService.setSelectedItems(this.formArray.value);
-                this.valuesChange.emit(this.formArray.value);
+            this._subs.add(formArray.valueChanges.subscribe(value => {
+                this.multiInputService.setSelectedItems(value);
+                this.valuesChange.emit(value);
+                this.changeDetectorRef.markForCheck();
+            }));
+            this._subs.add(formArray.statusChanges.subscribe(() => {
+                this.changeDetectorRef.markForCheck();
             }));
             if (formArray instanceof QdFormArray) {
                 this.formArray = formArray;
@@ -18140,6 +18149,9 @@ class QdContactCardComponent {
         }
         return this.contactData.phoneNumber;
     }
+    get phoneUrl() {
+        return this.hasPhoneUrl() ? this.contactData.phoneUrl : '';
+    }
     get emailAddress() {
         if (!this.hasEmailAddress()) {
             if (!this.hasPlaceholders)
@@ -18166,6 +18178,9 @@ class QdContactCardComponent {
     hasPhoneNumber() {
         return !!this.contactData.phoneNumber;
     }
+    hasPhoneUrl() {
+        return !!this.contactData.phoneUrl;
+    }
     hasAddress() {
         return !!this.contactData.address;
     }
@@ -18179,11 +18194,11 @@ class QdContactCardComponent {
         return !!this.contactData.emailAddress;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: QdContactCardComponent, deps: [{ token: i1$3.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: QdContactCardComponent, isStandalone: false, selector: "qd-contact-card", inputs: { contactData: "contactData", actions: "actions", hasPlaceholders: "hasPlaceholders", testId: ["data-test-id", "testId"] }, outputs: { emailAddressClicked: "emailAddressClicked" }, ngImport: i0, template: "<qd-contact-card-menu\n  *ngIf=\"actions && actions.length > 0\"\n  [contactData]=\"contactData\"\n  [actions]=\"actions\"\n  [data-test-id]=\"testId + '-menu'\"\n></qd-contact-card-menu>\n<p class=\"contact-function\">\n  {{ contactFunction | translate }} <span *ngIf=\"hasTag()\" class=\"tag\">{{ contactTag | translate }}</span>\n</p>\n<p>\n  <span class=\"title\" [class.placeholder]=\"!hasCompanyName()\">{{ companyName }}</span>\n  <span class=\"subtitle\" [class.placeholder]=\"!hasBusinessPartnerId()\">{{ businessPartnerId }}</span>\n</p>\n<p>\n  <span [class.placeholder]=\"!hasContactPerson()\">{{ firstName }} {{ lastName }}</span>\n  <span [class.placeholder]=\"!hasCareOf()\">{{ careOf }}</span>\n  <span [class.placeholder]=\"!hasStreet()\">{{ street }}</span>\n  <span [class.placeholder]=\"!hasAddress()\">{{ countryCode }}{{ postalCode }} {{ city }}</span>\n</p>\n<p>\n  <span [class.placeholder]=\"!hasPhoneNumber()\">{{ phoneNumber }}</span>\n  <a\n    [class.placeholder]=\"!hasEmailAddress()\"\n    [attr.href]=\"hasEmailAddress() ? 'mailto:' + emailAddress : null\"\n    (click)=\"hasEmailAddress() ? emailAddressClicked.emit($event) : null\"\n  >\n    {{ emailAddress }}\n  </a>\n</p>\n<p *ngIf=\"customFields && customFields.length > 0\">\n  <span *ngFor=\"let customField of customFields\">\n    <label *ngIf=\"customField.label\">\n      <ng-container\n        [ngTemplateOutlet]=\"translate\"\n        [ngTemplateOutletContext]=\"{ translatableOrText: customField.label }\"\n      ></ng-container>\n    </label>\n\n    <ng-container\n      [ngTemplateOutlet]=\"translate\"\n      [ngTemplateOutletContext]=\"{ translatableOrText: customField.value }\"\n    ></ng-container>\n  </span>\n</p>\n\n<ng-template #translate let-translatableOrText=\"translatableOrText\">\n  <ng-container *ngIf=\"translatableOrText.i18n; else plainText\">{{ translatableOrText.i18n | translate }}</ng-container>\n  <ng-template #plainText>{{ translatableOrText }}</ng-template>\n</ng-template>\n", styles: [":host{position:relative;display:inline-block;width:23rem;min-height:15.5625rem;padding:.5625rem 1.4375rem;border:solid .0625rem rgb(213,213,213);margin:0 1.0625rem 1.0625rem 0;background-color:#fff;color:#171717;font-size:.875rem;line-height:1.3125rem;vertical-align:top}:host p{margin:.75rem 0}:host span,:host a{display:block;height:auto}:host span>label{margin-right:.21875rem;color:#757575}:host .contact-function{display:flex;align-items:center;margin:.8125rem 0 .875rem;font-weight:500;line-height:1.125rem}:host .tag{display:inline;padding:.125rem .375rem;border-radius:.625rem;margin-left:.5rem;background-color:#454545;color:#fff;font-size:.625rem;line-height:.8125rem}:host .title{font-size:1.0625rem;font-weight:600}:host .subtitle{font-size:1rem}:host .placeholder{color:#979797;cursor:default;font-style:italic;text-decoration:none}\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: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: QdContactCardMenuComponent, selector: "qd-contact-card-menu", inputs: ["contactData", "actions", "data-test-id"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: QdContactCardComponent, isStandalone: false, selector: "qd-contact-card", inputs: { contactData: "contactData", actions: "actions", hasPlaceholders: "hasPlaceholders", testId: ["data-test-id", "testId"] }, outputs: { emailAddressClicked: "emailAddressClicked" }, ngImport: i0, template: "<qd-contact-card-menu\n  *ngIf=\"actions && actions.length > 0\"\n  [contactData]=\"contactData\"\n  [actions]=\"actions\"\n  [data-test-id]=\"testId + '-menu'\"\n></qd-contact-card-menu>\n<p class=\"contact-function\">\n  {{ contactFunction | translate }} <span *ngIf=\"hasTag()\" class=\"tag\">{{ contactTag | translate }}</span>\n</p>\n<p>\n  <span class=\"title\" [class.placeholder]=\"!hasCompanyName()\">{{ companyName }}</span>\n  <span class=\"subtitle\" [class.placeholder]=\"!hasBusinessPartnerId()\">{{ businessPartnerId }}</span>\n</p>\n<p>\n  <span [class.placeholder]=\"!hasContactPerson()\">{{ firstName }} {{ lastName }}</span>\n  <span [class.placeholder]=\"!hasCareOf()\">{{ careOf }}</span>\n  <span [class.placeholder]=\"!hasStreet()\">{{ street }}</span>\n  <span [class.placeholder]=\"!hasAddress()\">{{ countryCode }}{{ postalCode }} {{ city }}</span>\n</p>\n<p>\n  <span [class.placeholder]=\"!hasPhoneNumber()\">\n    @if (hasPhoneNumber() && hasPhoneUrl()) {\n    <a [attr.href]=\"phoneUrl\">{{ phoneNumber }}</a>\n    } @else if (hasPhoneNumber()) {\n    <a [attr.href]=\"'tel:' + phoneNumber\">{{ phoneNumber }}</a>\n    } @else {\n    {{ phoneNumber }}\n    }\n  </span>\n  <a\n    [class.placeholder]=\"!hasEmailAddress()\"\n    [attr.href]=\"hasEmailAddress() ? 'mailto:' + emailAddress : null\"\n    (click)=\"hasEmailAddress() ? emailAddressClicked.emit($event) : null\"\n  >\n    {{ emailAddress }}\n  </a>\n</p>\n<p *ngIf=\"customFields && customFields.length > 0\">\n  <span *ngFor=\"let customField of customFields\">\n    <label *ngIf=\"customField.label\">\n      <ng-container\n        [ngTemplateOutlet]=\"translate\"\n        [ngTemplateOutletContext]=\"{ translatableOrText: customField.label }\"\n      ></ng-container>\n    </label>\n\n    <ng-container\n      [ngTemplateOutlet]=\"translate\"\n      [ngTemplateOutletContext]=\"{ translatableOrText: customField.value }\"\n    ></ng-container>\n  </span>\n</p>\n\n<ng-template #translate let-translatableOrText=\"translatableOrText\">\n  <ng-container *ngIf=\"translatableOrText.i18n; else plainText\">{{ translatableOrText.i18n | translate }}</ng-container>\n  <ng-template #plainText>{{ translatableOrText }}</ng-template>\n</ng-template>\n", styles: [":host{position:relative;display:inline-block;width:23rem;min-height:15.5625rem;padding:.5625rem 1.4375rem;border:solid .0625rem rgb(213,213,213);margin:0 1.0625rem 1.0625rem 0;background-color:#fff;color:#171717;font-size:.875rem;line-height:1.3125rem;vertical-align:top}:host p{margin:.75rem 0}:host span,:host a{display:block;height:auto}:host span>label{margin-right:.21875rem;color:#757575}:host .contact-function{display:flex;align-items:center;margin:.8125rem 0 .875rem;font-weight:500;line-height:1.125rem}:host .tag{display:inline;padding:.125rem .375rem;border-radius:.625rem;margin-left:.5rem;background-color:#454545;color:#fff;font-size:.625rem;line-height:.8125rem}:host .title{font-size:1.0625rem;font-weight:600}:host .subtitle{font-size:1rem}:host .placeholder{color:#979797;cursor:default;font-style:italic;text-decoration:none}\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: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: QdContactCardMenuComponent, selector: "qd-contact-card-menu", inputs: ["contactData", "actions", "data-test-id"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: QdContactCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'qd-contact-card', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<qd-contact-card-menu\n  *ngIf=\"actions && actions.length > 0\"\n  [contactData]=\"contactData\"\n  [actions]=\"actions\"\n  [data-test-id]=\"testId + '-menu'\"\n></qd-contact-card-menu>\n<p class=\"contact-function\">\n  {{ contactFunction | translate }} <span *ngIf=\"hasTag()\" class=\"tag\">{{ contactTag | translate }}</span>\n</p>\n<p>\n  <span class=\"title\" [class.placeholder]=\"!hasCompanyName()\">{{ companyName }}</span>\n  <span class=\"subtitle\" [class.placeholder]=\"!hasBusinessPartnerId()\">{{ businessPartnerId }}</span>\n</p>\n<p>\n  <span [class.placeholder]=\"!hasContactPerson()\">{{ firstName }} {{ lastName }}</span>\n  <span [class.placeholder]=\"!hasCareOf()\">{{ careOf }}</span>\n  <span [class.placeholder]=\"!hasStreet()\">{{ street }}</span>\n  <span [class.placeholder]=\"!hasAddress()\">{{ countryCode }}{{ postalCode }} {{ city }}</span>\n</p>\n<p>\n  <span [class.placeholder]=\"!hasPhoneNumber()\">{{ phoneNumber }}</span>\n  <a\n    [class.placeholder]=\"!hasEmailAddress()\"\n    [attr.href]=\"hasEmailAddress() ? 'mailto:' + emailAddress : null\"\n    (click)=\"hasEmailAddress() ? emailAddressClicked.emit($event) : null\"\n  >\n    {{ emailAddress }}\n  </a>\n</p>\n<p *ngIf=\"customFields && customFields.length > 0\">\n  <span *ngFor=\"let customField of customFields\">\n    <label *ngIf=\"customField.label\">\n      <ng-container\n        [ngTemplateOutlet]=\"translate\"\n        [ngTemplateOutletContext]=\"{ translatableOrText: customField.label }\"\n      ></ng-container>\n    </label>\n\n    <ng-container\n      [ngTemplateOutlet]=\"translate\"\n      [ngTemplateOutletContext]=\"{ translatableOrText: customField.value }\"\n    ></ng-container>\n  </span>\n</p>\n\n<ng-template #translate let-translatableOrText=\"translatableOrText\">\n  <ng-container *ngIf=\"translatableOrText.i18n; else plainText\">{{ translatableOrText.i18n | translate }}</ng-container>\n  <ng-template #plainText>{{ translatableOrText }}</ng-template>\n</ng-template>\n", styles: [":host{position:relative;display:inline-block;width:23rem;min-height:15.5625rem;padding:.5625rem 1.4375rem;border:solid .0625rem rgb(213,213,213);margin:0 1.0625rem 1.0625rem 0;background-color:#fff;color:#171717;font-size:.875rem;line-height:1.3125rem;vertical-align:top}:host p{margin:.75rem 0}:host span,:host a{display:block;height:auto}:host span>label{margin-right:.21875rem;color:#757575}:host .contact-function{display:flex;align-items:center;margin:.8125rem 0 .875rem;font-weight:500;line-height:1.125rem}:host .tag{display:inline;padding:.125rem .375rem;border-radius:.625rem;margin-left:.5rem;background-color:#454545;color:#fff;font-size:.625rem;line-height:.8125rem}:host .title{font-size:1.0625rem;font-weight:600}:host .subtitle{font-size:1rem}:host .placeholder{color:#979797;cursor:default;font-style:italic;text-decoration:none}\n"] }]
+            args: [{ selector: 'qd-contact-card', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<qd-contact-card-menu\n  *ngIf=\"actions && actions.length > 0\"\n  [contactData]=\"contactData\"\n  [actions]=\"actions\"\n  [data-test-id]=\"testId + '-menu'\"\n></qd-contact-card-menu>\n<p class=\"contact-function\">\n  {{ contactFunction | translate }} <span *ngIf=\"hasTag()\" class=\"tag\">{{ contactTag | translate }}</span>\n</p>\n<p>\n  <span class=\"title\" [class.placeholder]=\"!hasCompanyName()\">{{ companyName }}</span>\n  <span class=\"subtitle\" [class.placeholder]=\"!hasBusinessPartnerId()\">{{ businessPartnerId }}</span>\n</p>\n<p>\n  <span [class.placeholder]=\"!hasContactPerson()\">{{ firstName }} {{ lastName }}</span>\n  <span [class.placeholder]=\"!hasCareOf()\">{{ careOf }}</span>\n  <span [class.placeholder]=\"!hasStreet()\">{{ street }}</span>\n  <span [class.placeholder]=\"!hasAddress()\">{{ countryCode }}{{ postalCode }} {{ city }}</span>\n</p>\n<p>\n  <span [class.placeholder]=\"!hasPhoneNumber()\">\n    @if (hasPhoneNumber() && hasPhoneUrl()) {\n    <a [attr.href]=\"phoneUrl\">{{ phoneNumber }}</a>\n    } @else if (hasPhoneNumber()) {\n    <a [attr.href]=\"'tel:' + phoneNumber\">{{ phoneNumber }}</a>\n    } @else {\n    {{ phoneNumber }}\n    }\n  </span>\n  <a\n    [class.placeholder]=\"!hasEmailAddress()\"\n    [attr.href]=\"hasEmailAddress() ? 'mailto:' + emailAddress : null\"\n    (click)=\"hasEmailAddress() ? emailAddressClicked.emit($event) : null\"\n  >\n    {{ emailAddress }}\n  </a>\n</p>\n<p *ngIf=\"customFields && customFields.length > 0\">\n  <span *ngFor=\"let customField of customFields\">\n    <label *ngIf=\"customField.label\">\n      <ng-container\n        [ngTemplateOutlet]=\"translate\"\n        [ngTemplateOutletContext]=\"{ translatableOrText: customField.label }\"\n      ></ng-container>\n    </label>\n\n    <ng-container\n      [ngTemplateOutlet]=\"translate\"\n      [ngTemplateOutletContext]=\"{ translatableOrText: customField.value }\"\n    ></ng-container>\n  </span>\n</p>\n\n<ng-template #translate let-translatableOrText=\"translatableOrText\">\n  <ng-container *ngIf=\"translatableOrText.i18n; else plainText\">{{ translatableOrText.i18n | translate }}</ng-container>\n  <ng-template #plainText>{{ translatableOrText }}</ng-template>\n</ng-template>\n", styles: [":host{position:relative;display:inline-block;width:23rem;min-height:15.5625rem;padding:.5625rem 1.4375rem;border:solid .0625rem rgb(213,213,213);margin:0 1.0625rem 1.0625rem 0;background-color:#fff;color:#171717;font-size:.875rem;line-height:1.3125rem;vertical-align:top}:host p{margin:.75rem 0}:host span,:host a{display:block;height:auto}:host span>label{margin-right:.21875rem;color:#757575}:host .contact-function{display:flex;align-items:center;margin:.8125rem 0 .875rem;font-weight:500;line-height:1.125rem}:host .tag{display:inline;padding:.125rem .375rem;border-radius:.625rem;margin-left:.5rem;background-color:#454545;color:#fff;font-size:.625rem;line-height:.8125rem}:host .title{font-size:1.0625rem;font-weight:600}:host .subtitle{font-size:1rem}:host .placeholder{color:#979797;cursor:default;font-style:italic;text-decoration:none}\n"] }]
         }], ctorParameters: () => [{ type: i1$3.TranslateService }], propDecorators: { contactData: [{
                 type: Input
             }], actions: [{
@@ -30852,7 +30867,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
             type: Injectable
         }], ctorParameters: () => [{ type: i1$3.TranslateService }, { type: QdShellEportalLanguageService }] });
 
-const DEFAULT_JAVASCRIPT_ASSET_PATH$1 = 'assets/service-navigation-web-component.js?version=14.2.0';
+const DEFAULT_JAVASCRIPT_ASSET_PATH$1 = 'assets/service-navigation-web-component.js?version=15.0.3';
 class QdShellServiceNavigationComponent {
     serviceNavigationService;
     translateService;
@@ -30976,11 +30991,11 @@ class QdShellServiceNavigationComponent {
         updateHtmlLang(language);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: QdShellServiceNavigationComponent, deps: [{ token: QdShellServiceNavigationService }, { token: i1$3.TranslateService }, { token: QdLanguageFromUrlService }, { token: QdShellPamsEnvironmentService }, { token: 'QdAuthenticationService', optional: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: QdShellServiceNavigationComponent, isStandalone: false, selector: "qd-shell-service-navigation", inputs: { config: "config" }, providers: [QdShellServiceNavigationService], viewQueries: [{ propertyName: "serviceNavigation", first: true, predicate: ["serviceNavigation"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ob-service-navigation-web-component\n  *ngIf=\"pamsEnvironment\"\n  #serviceNavigation\n  [languageList]=\"languageListStringified\"\n  [pamsAppId]=\"pamsAppId\"\n  [environment]=\"pamsEnvironment\"\n  (languageChange)=\"handleLanguageChange($event)\"\n  (loginState)=\"handleLoginStatusChange($event)\"\n  (logoutTriggered)=\"handleLogoutTriggered($event)\"\n></ob-service-navigation-web-component>\n", styles: [":host{display:flex;justify-content:end}:host.expanded{visibility:visible}@media (max-width: 599.98px){:host.expanded{visibility:collapse}}@media (max-width: 599.98px){:host{flex-basis:100%;margin-top:1rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: QdShellServiceNavigationComponent, isStandalone: false, selector: "qd-shell-service-navigation", inputs: { config: "config" }, providers: [QdShellServiceNavigationService], viewQueries: [{ propertyName: "serviceNavigation", first: true, predicate: ["serviceNavigation"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ob-service-navigation-web-component\n  *ngIf=\"pamsEnvironment\"\n  #serviceNavigation\n  [languageList]=\"languageListStringified\"\n  [pamsAppId]=\"pamsAppId\"\n  [environment]=\"pamsEnvironment\"\n  (languageChange)=\"handleLanguageChange($event)\"\n  (loginState)=\"handleLoginStatusChange($event)\"\n  (logoutTriggered)=\"handleLogoutTriggered($event)\"\n  [eportalLanguageSynchronization]=\"true\"\n></ob-service-navigation-web-component>\n", styles: [":host{display:flex;justify-content:end}:host.expanded{visibility:visible}@media (max-width: 599.98px){:host.expanded{visibility:collapse}}@media (max-width: 599.98px){:host{flex-basis:100%;margin-top:1rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: QdShellServiceNavigationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'qd-shell-service-navigation', providers: [QdShellServiceNavigationService], standalone: false, template: "<ob-service-navigation-web-component\n  *ngIf=\"pamsEnvironment\"\n  #serviceNavigation\n  [languageList]=\"languageListStringified\"\n  [pamsAppId]=\"pamsAppId\"\n  [environment]=\"pamsEnvironment\"\n  (languageChange)=\"handleLanguageChange($event)\"\n  (loginState)=\"handleLoginStatusChange($event)\"\n  (logoutTriggered)=\"handleLogoutTriggered($event)\"\n></ob-service-navigation-web-component>\n", styles: [":host{display:flex;justify-content:end}:host.expanded{visibility:visible}@media (max-width: 599.98px){:host.expanded{visibility:collapse}}@media (max-width: 599.98px){:host{flex-basis:100%;margin-top:1rem}}\n"] }]
+            args: [{ selector: 'qd-shell-service-navigation', providers: [QdShellServiceNavigationService], standalone: false, template: "<ob-service-navigation-web-component\n  *ngIf=\"pamsEnvironment\"\n  #serviceNavigation\n  [languageList]=\"languageListStringified\"\n  [pamsAppId]=\"pamsAppId\"\n  [environment]=\"pamsEnvironment\"\n  (languageChange)=\"handleLanguageChange($event)\"\n  (loginState)=\"handleLoginStatusChange($event)\"\n  (logoutTriggered)=\"handleLogoutTriggered($event)\"\n  [eportalLanguageSynchronization]=\"true\"\n></ob-service-navigation-web-component>\n", styles: [":host{display:flex;justify-content:end}:host.expanded{visibility:visible}@media (max-width: 599.98px){:host.expanded{visibility:collapse}}@media (max-width: 599.98px){:host{flex-basis:100%;margin-top:1rem}}\n"] }]
         }], ctorParameters: () => [{ type: QdShellServiceNavigationService }, { type: i1$3.TranslateService }, { type: QdLanguageFromUrlService }, { type: QdShellPamsEnvironmentService }, { type: undefined, decorators: [{
                     type: Optional
                 }, {
@@ -33123,9 +33138,7 @@ class QdQuickEditComponent {
     initManualChangeDetectionForControlReset() {
         if (!this.isFormControl)
             return;
-        this.controlContainer.control.valueChanges
-            .pipe(startWith(this.controlContainer.control.value.length), map(() => this.controlContainer.control.value.length), distinctUntilChanged(), tap(() => this.changeDetectorRef.detectChanges()))
-            .subscribe();
+        this.controlContainer.control.valueChanges.pipe(tap(() => this.changeDetectorRef.detectChanges())).subscribe();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: QdQuickEditComponent, deps: [{ token: i1$4.FormBuilder }, { token: QdPageFooterService, optional: true }, { token: QdPageStoreService, optional: true }, { token: QdSectionToolbarActionService, optional: true }, { token: QdEventBrokerService, optional: true }, { token: i0.ChangeDetectorRef }, { token: i1$4.ControlContainer, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: QdQuickEditComponent, isStandalone: false, selector: "qd-quick-edit", inputs: { config: "config", data: "data", testId: ["data-test-id", "testId"] }, outputs: { formGroupChange: "formGroupChange", addNewClicked: "addNewClicked" }, viewQueries: [{ propertyName: "customForDirective", first: true, predicate: QdCustomForDirective, descendants: true }, { propertyName: "focusables", predicate: QdFocusableDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"editable-actions\" *ngIf=\"showStandaloneCreate\">\n  <button\n    qdButton\n    qdButtonGhost\n    icon=\"plus\"\n    (click)=\"createRow()\"\n    [data-test-id]=\"testId + '-button-add-new'\"\n    class=\"create-button-standalone\"\n  >\n    {{ config.standaloneCreateLabel?.i18n ?? \"i18n.qd.quick.edit.createButtonLabel\" | translate }}\n  </button>\n</div>\n\n<div class=\"table\" [formGroup]=\"control\">\n  <div class=\"table-header\" *ngIf=\"!config.canAdd || templateData.length > 0 || config.emptyStateView\">\n    <div class=\"table-row\">\n      <div class=\"table-cell\" *ngFor=\"let header of visibleColumns\">\n        {{ header?.i18n | translate }}\n        <qd-icon\n          *ngIf=\"hasTooltip(header?.tooltip)\"\n          icon=\"circleInfo\"\n          class=\"additional-info\"\n          qdTooltipOnClick\n          [qdTooltipContent]=\"header?.tooltip?.content\"\n        ></qd-icon>\n      </div>\n      <div class=\"table-cell actions-column\" *ngIf=\"hasVisibleActions$ | async\">\n        <button class=\"menu-button\">\n          <qd-icon icon=\"overflowMenuHorizontal\"></qd-icon>\n        </button>\n      </div>\n    </div>\n  </div>\n  <div class=\"table-body\">\n    <div\n      class=\"table-row\"\n      *qdCustomFor=\"let row of templateData; let rowIndex = index; toggler: togglerDrawing\"\n      [formGroupName]=\"rowIndex\"\n    >\n      <ng-container *ngFor=\"let column of visibleColumns\">\n        <div class=\"table-cell\">\n          <qd-dropdown\n            [config]=\"{\n              filter: column.filter,\n              options: column.options,\n              placeholder: column.placeholder,\n              placeholderPrefix: column.placeholderPrefix,\n              viewonly: (viewonly$ | async) === true || !column.isEditable(row, column.name)\n            }\"\n            [data-test-id]=\"column.name + rowIndex\"\n            *ngIf=\"column.type === 'enum'; else otherTypes\"\n            [dense]=\"true\"\n            [formControl]=\"$any(control.controls[rowIndex])?.controls[column.name]\"\n            qdFocusable\n            class=\"dropdown\"\n          >\n          </qd-dropdown>\n\n          <ng-template #otherTypes>\n            <qd-input\n              [data-test-id]=\"column.name + rowIndex\"\n              [formControlName]=\"column.name\"\n              *ngIf=\"column.type !== 'enum' && $any(control.controls[rowIndex])?.controls[column.name]\"\n              [config]=\"{\n                inputType: column.type === 'integer' ? 'number' : 'text',\n                viewonly: (viewonly$ | async) === true || !column.isEditable(row, column.name)\n              }\"\n              qdFocusable\n            ></qd-input>\n          </ng-template>\n        </div>\n      </ng-container>\n      <td\n        *ngIf=\"hasVisibleActions$ | async\"\n        class=\"table-cell actions\"\n        [attr.data-test-id]=\"testId + '-cell-inline-actions'\"\n      >\n        <button\n          type=\"button\"\n          [qdPopoverOnClick]=\"menu\"\n          [qdPopoverCloseStrategy]=\"'onEveryClick'\"\n          [qdPopoverStopPropagation]=\"true\"\n          class=\"menu-button\"\n          data-test=\"secondary-actions-toggler\"\n        >\n          <qd-icon icon=\"overflowMenuHorizontal\"></qd-icon>\n        </button>\n\n        <ng-template #menu>\n          <button\n            *ngFor=\"let secondaryAction of actions$ | async\"\n            class=\"secondary-actions\"\n            [ngClass]=\"{ disabled: secondaryAction.isDisabled }\"\n            (click)=\"handleSecondaryAction(secondaryAction, rowIndex)\"\n          >\n            {{ secondaryAction.label.i18n | translate }}\n          </button>\n          <button\n            *ngIf=\"canAdd && (viewonly$ | async) === false\"\n            class=\"secondary-actions\"\n            (click)=\"removeRow(rowIndex)\"\n          >\n            {{ \"i18n.qd.quick.edit.removeButtonLabel\" | translate }}\n          </button>\n        </ng-template>\n      </td>\n    </div>\n  </div>\n  <div class=\"empty-body\" *ngIf=\"config.emptyStateView && !config.emptyStateView.disabled && templateData.length === 0\">\n    <p>{{ config.emptyStateView.i18n | translate }}</p>\n  </div>\n</div>\n", styles: [".table{display:flex;width:100%;flex-direction:column;margin:1.25rem auto;background-color:#fff;font-size:.875rem}.table ::ng-deep .qd-input-input{margin-bottom:0!important}.table-header .table-row{padding-top:.125rem;padding-bottom:.125rem;background-color:#e5e5e5;font-weight:700}.table-header .table-row .actions-column{flex:0;border-right:none;visibility:hidden}.table-header,.table-body{display:flex;flex-direction:column}.table-row{display:flex;flex-direction:row;padding:.25rem 1rem;border-bottom:.0625rem solid rgb(213,213,213);gap:1rem}.table-row ::ng-deep qd-form-label{display:none!important}.table-row ::ng-deep qd-form-hint .qd-form-hint{display:none}.table-row ::ng-deep qd-input{margin-bottom:0!important}.table-cell{display:flex;height:37px;flex:1;align-items:center;text-align:left}.table-cell:has(.qd-input-error),.table-cell:has(.qd-dropdown-error){height:auto;align-items:flex-start}.table-cell.actions{flex:0}.table-row:last-child{border-bottom:none}.table-cell:last-child{border-right:none}.editable-actions{display:flex;justify-content:flex-end;margin-right:.625rem;gap:.625rem}.menu-button{display:flex;padding:0 .625rem 0 .375rem;background:unset;color:#454545;font-size:2rem;vertical-align:middle}.menu-button:hover,.menu-button:focus{color:#000;outline:0!important}.secondary-actions{display:block;width:100%;min-height:2rem;padding:0 1rem;background:#fff0;font-size:.75rem;text-align:left}.secondary-actions:hover{background-color:#f2f7fa}.secondary-actions.disabled{color:#b4b4b4;cursor:not-allowed}.secondary-actions.disabled:hover{background-color:#fff0}.dropdown{min-width:160px}.empty-body{padding:1.5rem;background:#fff}.empty-body p{margin:0 0 .5rem}.additional-info{align-self:center;margin-left:.25rem;color:#069;cursor:pointer;font-size:1rem;font-weight:400;transform:translateY(.0625rem)}.additional-info:hover,.additional-info:focus,.additional-info:active{color:#14516f}\n"], dependencies: [{ kind: "component", type: QdButtonComponent, selector: "button[qdButton], a[qdButton], button[qd-button]", inputs: ["disabled", "color", "icon", "data-test-id", "additionalInfo"] }, { kind: "directive", type: QdButtonGhostDirective, selector: "button[qdButtonGhost], a[qdButtonGhost]" }, { kind: "directive", type: 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: QdDropdownComponent, selector: "qd-dropdown", inputs: ["value", "id", "formControlName", "config", "data-test-id", "qdPopoverMaxHeight", "dense"], outputs: ["valueChange", "enterClick", "clickHint", "clickReadonly", "clickViewonly"] }, { kind: "component", type: QdInputComponent, selector: "qd-input", inputs: ["formControlName", "value", "config", "isError", "data-test-id"], outputs: ["valueChange", "enterClick", "clickClear", "clickHint", "clickReadonly", "clickViewonly"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$4.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: QdIconComponent, selector: "qd-icon", inputs: ["icon"] }, { kind: "directive", type: QdPopoverOnClickDirective, selector: "[qdPopoverOnClick]", inputs: ["qdPopoverOnClick", "positionStrategy", "qdPopoverCloseStrategy", "qdPopoverDisabled", "qdPopoverStopPropagation", "qdPopoverBackgroundColor", "qdPopoverMaxHeight", "qdPopoverMinWidth", "qdPopoverMaxWidth", "qdPopoverAutoSize", "qdPopoverEnableKeyControl"], outputs: ["opened", "closed"], exportAs: ["qdPopoverOnClick"] }, { kind: "directive", type: QdFocusableDirective, selector: "[qdFocusable]" }, { kind: "directive", type: QdTooltipOnClickDirective, selector: "[qdTooltipOnClick]", inputs: ["qdTooltipContent"] }, { kind: "directive", type: QdCustomForDirective, selector: "[qdCustomFor]", inputs: ["qdCustomForOf", "qdCustomForToggler"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });