@sebgroup/green-angular 5.7.1 → 5.8.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.
Files changed (27) hide show
  1. package/esm2022/src/v-angular/dropdown/dropdown-list/dropdown-list.component.mjs +19 -7
  2. package/esm2022/src/v-angular/dropdown/dropdown.component.mjs +3 -3
  3. package/esm2022/src/v-angular/dropdown/typeahead/typeahead-dropdown-list/typeahead-dropdown-list.component.mjs +1 -7
  4. package/esm2022/src/v-angular/dropdown/typeahead/typeahead-input/typeahead-input.component.mjs +3 -3
  5. package/esm2022/src/v-angular/toast/toast-message.service.mjs +22 -3
  6. package/esm2022/src/v-angular/toast/toast.component.mjs +3 -3
  7. package/esm2022/src/v-angular/toast/toast.models.mjs +1 -1
  8. package/esm2022/v-angular/dropdown/dropdown-list/dropdown-list.component.mjs +19 -7
  9. package/esm2022/v-angular/dropdown/dropdown.component.mjs +3 -3
  10. package/esm2022/v-angular/dropdown/typeahead/typeahead-dropdown-list/typeahead-dropdown-list.component.mjs +1 -7
  11. package/esm2022/v-angular/dropdown/typeahead/typeahead-input/typeahead-input.component.mjs +3 -3
  12. package/esm2022/v-angular/toast/toast-message.service.mjs +22 -3
  13. package/esm2022/v-angular/toast/toast.component.mjs +3 -3
  14. package/esm2022/v-angular/toast/toast.models.mjs +1 -1
  15. package/fesm2022/sebgroup-green-angular-src-v-angular-dropdown.mjs +22 -16
  16. package/fesm2022/sebgroup-green-angular-src-v-angular-dropdown.mjs.map +1 -1
  17. package/fesm2022/sebgroup-green-angular-src-v-angular-toast.mjs +30 -12
  18. package/fesm2022/sebgroup-green-angular-src-v-angular-toast.mjs.map +1 -1
  19. package/fesm2022/sebgroup-green-angular-v-angular.mjs +52 -28
  20. package/fesm2022/sebgroup-green-angular-v-angular.mjs.map +1 -1
  21. package/package.json +2 -2
  22. package/src/v-angular/dropdown/dropdown-list/dropdown-list.component.d.ts +1 -1
  23. package/src/v-angular/toast/toast-message.service.d.ts +3 -1
  24. package/src/v-angular/toast/toast.models.d.ts +6 -3
  25. package/v-angular/dropdown/dropdown-list/dropdown-list.component.d.ts +1 -1
  26. package/v-angular/toast/toast-message.service.d.ts +3 -1
  27. package/v-angular/toast/toast.models.d.ts +6 -3
@@ -32,7 +32,7 @@ export class ToastComponent {
32
32
  }
33
33
  }
34
34
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToastComponent, deps: [{ token: i1.ToastMessageService }], target: i0.ɵɵFactoryTarget.Component }); }
35
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ToastComponent, selector: "nggv-toast", inputs: { closeButtonAriaLabel: "closeButtonAriaLabel" }, ngImport: i0, template: "<output class=\"messages-container\" aria-live=\"polite\">\n <div\n class=\"message\"\n *ngFor=\"let message of messages\"\n [ngClass]=\"message.type\"\n @toastAnimation\n (mouseenter)=\"onMouseEnter(message)\"\n (mouseleave)=\"onMouseLeave(message)\"\n >\n <div class=\"content\" *transloco=\"let t; read: message.translocoScope\">\n <div class=\"message-type-icon-wrapper\">\n <ng-container *ngIf=\"message.type === 'success'\">\n <i>\n <svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M17.6203 6.60836L9.40014 14.8285L6.37976 11.8081C6.23332 11.6617 5.99588 11.6617 5.84942 11.8081L4.96554 12.692C4.8191 12.8384 4.8191 13.0759 4.96554 13.2223L9.13495 17.3917C9.28138 17.5382 9.51882 17.5382 9.66529 17.3917L19.0344 8.02258C19.1809 7.87614 19.1809 7.63871 19.0344 7.49224L18.1506 6.60836C18.0041 6.46193 17.7667 6.46193 17.6203 6.60836Z\"\n fill=\"white\"\n ></path>\n </svg>\n </i>\n </ng-container>\n <ng-container\n *ngIf=\"message.type === 'error' || message.type === 'warning'\"\n >\n <i>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M18.2857 4H5.71429C4.7675 4 4 4.7675 4 5.71429V18.2857C4 19.2325 4.7675 20 5.71429 20H18.2857C19.2325 20 20 19.2325 20 18.2857V5.71429C20 4.7675 19.2325 4 18.2857 4ZM10.8682 7.42857H13.1318C13.3777 7.42857 13.5731 7.635 13.5597 7.8805L13.2948 12.7376C13.2824 12.9649 13.0945 13.1429 12.8669 13.1429H11.1331C10.9055 13.1429 10.7176 12.9649 10.7052 12.7376L10.4402 7.8805C10.4269 7.635 10.6223 7.42857 10.8682 7.42857ZM12 17.0714C11.0927 17.0714 10.3571 16.3359 10.3571 15.4286C10.3571 14.5213 11.0927 13.7857 12 13.7857C12.9073 13.7857 13.6429 14.5213 13.6429 15.4286C13.6429 16.3359 12.9073 17.0714 12 17.0714Z\"\n fill=\"currentColor\"\n />\n </svg>\n </i>\n </ng-container>\n <ng-container *ngIf=\"message.type === 'information'\">\n <i>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M18.2857 4H5.71429C4.7675 4 4 4.7675 4 5.71429V18.2857C4 19.2325 4.7675 20 5.71429 20H18.2857C19.2325 20 20 19.2325 20 18.2857V5.71429C20 4.7675 19.2325 4 18.2857 4ZM12 7.07143C12.8284 7.07143 13.5 7.743 13.5 8.57143C13.5 9.39986 12.8284 10.0714 12 10.0714C11.1716 10.0714 10.5 9.39986 10.5 8.57143C10.5 7.743 11.1716 7.07143 12 7.07143ZM14 16.1429C14 16.3795 13.8081 16.5714 13.5714 16.5714H10.4286C10.1919 16.5714 10 16.3795 10 16.1429V15.2857C10 15.049 10.1919 14.8571 10.4286 14.8571H10.8571V12.5714H10.4286C10.1919 12.5714 10 12.3795 10 12.1429V11.2857C10 11.049 10.1919 10.8571 10.4286 10.8571H12.7143C12.951 10.8571 13.1429 11.049 13.1429 11.2857V14.8571H13.5714C13.8081 14.8571 14 15.049 14 15.2857V16.1429Z\"\n fill=\"currentColor\"\n />\n </svg>\n </i>\n </ng-container>\n </div>\n <div class=\"text-content\">\n <div>{{ t(message.titleText) }}</div>\n <div *ngIf=\"message.bodyText\" class=\"text-body-content\">\n {{ t(message.bodyText) }}\n </div>\n </div>\n <button\n class=\"close-icon-button\"\n [ngClass]=\"{ information: message.type === 'information' }\"\n (click)=\"removeMessage(message)\"\n [attr.aria-label]=\"closeButtonAriaLabel\"\n >\n <gds-icon-cross-small\n class=\"close-icon\"\n *nggCoreElement\n ></gds-icon-cross-small>\n </button>\n </div>\n </div>\n</output>\n", styles: [":host .messages-container{position:fixed;bottom:1rem;right:1rem;z-index:9999}:host .message{position:relative;font-size:1rem;max-width:22rem;min-width:22rem;min-height:3rem;box-shadow:0 2px 6px #00000026;margin-top:1rem}:host .content{display:flex;height:100%;padding:0;justify-content:space-between}:host .text-content{margin-top:1rem;margin-bottom:1rem;width:100%}:host .text-body-content{padding-top:1.5rem}:host .message-type-icon-wrapper{padding:1rem}:host .message-type-icon-wrapper i{display:block;width:1.25rem;height:1.25rem}:host .close-icon-button{box-sizing:border-box;display:grid;place-content:center;width:2rem;height:2rem;flex-shrink:0;font-size:1rem;line-height:1.5rem;margin:.5rem;background:transparent;border:none;color:inherit;padding:0;cursor:pointer;min-height:32px}:host .close-icon-button:hover{color:#333;border-radius:100%}:host .close-icon-button:not(.information):hover{background-color:#fff}:host .close-icon-button.information:hover{background-color:#dedede}:host .success{background-color:#308800;color:#fff}:host .error{background-color:#d81a1a;color:#fff}:host .warning{background-color:#ffc500;color:#333}:host .information{background-color:#333;color:#e9e9e9}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: i4.NggCoreElementDirective, selector: "[nggCoreElement]" }], animations: [
35
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ToastComponent, selector: "nggv-toast", inputs: { closeButtonAriaLabel: "closeButtonAriaLabel" }, ngImport: i0, template: "<output class=\"messages-container\" aria-live=\"polite\">\n <div\n class=\"message\"\n *ngFor=\"let message of messages\"\n [ngClass]=\"message.type\"\n @toastAnimation\n (mouseenter)=\"onMouseEnter(message)\"\n (mouseleave)=\"onMouseLeave(message)\"\n >\n <div class=\"content\" *transloco=\"let t; read: message.translocoScope\">\n <div class=\"message-type-icon-wrapper\">\n <ng-container *ngIf=\"message.type === 'success'\">\n <i>\n <svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M17.6203 6.60836L9.40014 14.8285L6.37976 11.8081C6.23332 11.6617 5.99588 11.6617 5.84942 11.8081L4.96554 12.692C4.8191 12.8384 4.8191 13.0759 4.96554 13.2223L9.13495 17.3917C9.28138 17.5382 9.51882 17.5382 9.66529 17.3917L19.0344 8.02258C19.1809 7.87614 19.1809 7.63871 19.0344 7.49224L18.1506 6.60836C18.0041 6.46193 17.7667 6.46193 17.6203 6.60836Z\"\n fill=\"white\"\n ></path>\n </svg>\n </i>\n </ng-container>\n <ng-container\n *ngIf=\"message.type === 'error' || message.type === 'warning'\"\n >\n <i>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M18.2857 4H5.71429C4.7675 4 4 4.7675 4 5.71429V18.2857C4 19.2325 4.7675 20 5.71429 20H18.2857C19.2325 20 20 19.2325 20 18.2857V5.71429C20 4.7675 19.2325 4 18.2857 4ZM10.8682 7.42857H13.1318C13.3777 7.42857 13.5731 7.635 13.5597 7.8805L13.2948 12.7376C13.2824 12.9649 13.0945 13.1429 12.8669 13.1429H11.1331C10.9055 13.1429 10.7176 12.9649 10.7052 12.7376L10.4402 7.8805C10.4269 7.635 10.6223 7.42857 10.8682 7.42857ZM12 17.0714C11.0927 17.0714 10.3571 16.3359 10.3571 15.4286C10.3571 14.5213 11.0927 13.7857 12 13.7857C12.9073 13.7857 13.6429 14.5213 13.6429 15.4286C13.6429 16.3359 12.9073 17.0714 12 17.0714Z\"\n fill=\"currentColor\"\n />\n </svg>\n </i>\n </ng-container>\n <ng-container *ngIf=\"message.type === 'information'\">\n <i>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M18.2857 4H5.71429C4.7675 4 4 4.7675 4 5.71429V18.2857C4 19.2325 4.7675 20 5.71429 20H18.2857C19.2325 20 20 19.2325 20 18.2857V5.71429C20 4.7675 19.2325 4 18.2857 4ZM12 7.07143C12.8284 7.07143 13.5 7.743 13.5 8.57143C13.5 9.39986 12.8284 10.0714 12 10.0714C11.1716 10.0714 10.5 9.39986 10.5 8.57143C10.5 7.743 11.1716 7.07143 12 7.07143ZM14 16.1429C14 16.3795 13.8081 16.5714 13.5714 16.5714H10.4286C10.1919 16.5714 10 16.3795 10 16.1429V15.2857C10 15.049 10.1919 14.8571 10.4286 14.8571H10.8571V12.5714H10.4286C10.1919 12.5714 10 12.3795 10 12.1429V11.2857C10 11.049 10.1919 10.8571 10.4286 10.8571H12.7143C12.951 10.8571 13.1429 11.049 13.1429 11.2857V14.8571H13.5714C13.8081 14.8571 14 15.049 14 15.2857V16.1429Z\"\n fill=\"currentColor\"\n />\n </svg>\n </i>\n </ng-container>\n </div>\n <div class=\"text-content\">\n @if (message.template) {\n <ng-template\n [ngTemplateOutlet]=\"message.template\"\n [ngTemplateOutletContext]=\"{ $implicit: message.templateContext }\"\n ></ng-template>\n } @else {\n @if (message.titleText) {\n <div>{{ t(message.titleText) }}</div>\n }\n @if (message.bodyText) {\n <div class=\"text-body-content\">\n {{ t(message.bodyText) }}\n </div>\n }\n }\n </div>\n <button\n class=\"close-icon-button\"\n [ngClass]=\"{ information: message.type === 'information' }\"\n (click)=\"removeMessage(message)\"\n [attr.aria-label]=\"closeButtonAriaLabel\"\n >\n <gds-icon-cross-small\n class=\"close-icon\"\n *nggCoreElement\n ></gds-icon-cross-small>\n </button>\n </div>\n </div>\n</output>\n", styles: [":host .messages-container{position:fixed;bottom:1rem;right:1rem;z-index:9999}:host .message{position:relative;font-size:1rem;max-width:22rem;min-width:22rem;min-height:3rem;box-shadow:0 2px 6px #00000026;margin-top:1rem}:host .content{display:flex;height:100%;padding:0;justify-content:space-between}:host .text-content{margin-top:1rem;margin-bottom:1rem;width:100%}:host .text-body-content{padding-top:1.5rem}:host .message-type-icon-wrapper{padding:1rem}:host .message-type-icon-wrapper i{display:block;width:1.25rem;height:1.25rem}:host .close-icon-button{box-sizing:border-box;display:grid;place-content:center;width:2rem;height:2rem;flex-shrink:0;font-size:1rem;line-height:1.5rem;margin:.5rem;background:transparent;border:none;color:inherit;padding:0;cursor:pointer;min-height:32px}:host .close-icon-button:hover{color:#333;border-radius:100%}:host .close-icon-button:not(.information):hover{background-color:#fff}:host .close-icon-button.information:hover{background-color:#dedede}:host .success{background-color:#308800;color:#fff}:host .error{background-color:#d81a1a;color:#fff}:host .warning{background-color:#ffc500;color:#333}:host .information{background-color:#333;color:#e9e9e9}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: i4.NggCoreElementDirective, selector: "[nggCoreElement]" }], animations: [
36
36
  trigger('toastAnimation', [
37
37
  transition(':enter', [
38
38
  style({ opacity: 0, transform: 'translateY(100%)' }),
@@ -56,8 +56,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
56
56
  animate('300ms ease-out', style({ opacity: 0, transform: 'translateY(100%)' })),
57
57
  ]),
58
58
  ]),
59
- ], template: "<output class=\"messages-container\" aria-live=\"polite\">\n <div\n class=\"message\"\n *ngFor=\"let message of messages\"\n [ngClass]=\"message.type\"\n @toastAnimation\n (mouseenter)=\"onMouseEnter(message)\"\n (mouseleave)=\"onMouseLeave(message)\"\n >\n <div class=\"content\" *transloco=\"let t; read: message.translocoScope\">\n <div class=\"message-type-icon-wrapper\">\n <ng-container *ngIf=\"message.type === 'success'\">\n <i>\n <svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M17.6203 6.60836L9.40014 14.8285L6.37976 11.8081C6.23332 11.6617 5.99588 11.6617 5.84942 11.8081L4.96554 12.692C4.8191 12.8384 4.8191 13.0759 4.96554 13.2223L9.13495 17.3917C9.28138 17.5382 9.51882 17.5382 9.66529 17.3917L19.0344 8.02258C19.1809 7.87614 19.1809 7.63871 19.0344 7.49224L18.1506 6.60836C18.0041 6.46193 17.7667 6.46193 17.6203 6.60836Z\"\n fill=\"white\"\n ></path>\n </svg>\n </i>\n </ng-container>\n <ng-container\n *ngIf=\"message.type === 'error' || message.type === 'warning'\"\n >\n <i>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M18.2857 4H5.71429C4.7675 4 4 4.7675 4 5.71429V18.2857C4 19.2325 4.7675 20 5.71429 20H18.2857C19.2325 20 20 19.2325 20 18.2857V5.71429C20 4.7675 19.2325 4 18.2857 4ZM10.8682 7.42857H13.1318C13.3777 7.42857 13.5731 7.635 13.5597 7.8805L13.2948 12.7376C13.2824 12.9649 13.0945 13.1429 12.8669 13.1429H11.1331C10.9055 13.1429 10.7176 12.9649 10.7052 12.7376L10.4402 7.8805C10.4269 7.635 10.6223 7.42857 10.8682 7.42857ZM12 17.0714C11.0927 17.0714 10.3571 16.3359 10.3571 15.4286C10.3571 14.5213 11.0927 13.7857 12 13.7857C12.9073 13.7857 13.6429 14.5213 13.6429 15.4286C13.6429 16.3359 12.9073 17.0714 12 17.0714Z\"\n fill=\"currentColor\"\n />\n </svg>\n </i>\n </ng-container>\n <ng-container *ngIf=\"message.type === 'information'\">\n <i>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M18.2857 4H5.71429C4.7675 4 4 4.7675 4 5.71429V18.2857C4 19.2325 4.7675 20 5.71429 20H18.2857C19.2325 20 20 19.2325 20 18.2857V5.71429C20 4.7675 19.2325 4 18.2857 4ZM12 7.07143C12.8284 7.07143 13.5 7.743 13.5 8.57143C13.5 9.39986 12.8284 10.0714 12 10.0714C11.1716 10.0714 10.5 9.39986 10.5 8.57143C10.5 7.743 11.1716 7.07143 12 7.07143ZM14 16.1429C14 16.3795 13.8081 16.5714 13.5714 16.5714H10.4286C10.1919 16.5714 10 16.3795 10 16.1429V15.2857C10 15.049 10.1919 14.8571 10.4286 14.8571H10.8571V12.5714H10.4286C10.1919 12.5714 10 12.3795 10 12.1429V11.2857C10 11.049 10.1919 10.8571 10.4286 10.8571H12.7143C12.951 10.8571 13.1429 11.049 13.1429 11.2857V14.8571H13.5714C13.8081 14.8571 14 15.049 14 15.2857V16.1429Z\"\n fill=\"currentColor\"\n />\n </svg>\n </i>\n </ng-container>\n </div>\n <div class=\"text-content\">\n <div>{{ t(message.titleText) }}</div>\n <div *ngIf=\"message.bodyText\" class=\"text-body-content\">\n {{ t(message.bodyText) }}\n </div>\n </div>\n <button\n class=\"close-icon-button\"\n [ngClass]=\"{ information: message.type === 'information' }\"\n (click)=\"removeMessage(message)\"\n [attr.aria-label]=\"closeButtonAriaLabel\"\n >\n <gds-icon-cross-small\n class=\"close-icon\"\n *nggCoreElement\n ></gds-icon-cross-small>\n </button>\n </div>\n </div>\n</output>\n", styles: [":host .messages-container{position:fixed;bottom:1rem;right:1rem;z-index:9999}:host .message{position:relative;font-size:1rem;max-width:22rem;min-width:22rem;min-height:3rem;box-shadow:0 2px 6px #00000026;margin-top:1rem}:host .content{display:flex;height:100%;padding:0;justify-content:space-between}:host .text-content{margin-top:1rem;margin-bottom:1rem;width:100%}:host .text-body-content{padding-top:1.5rem}:host .message-type-icon-wrapper{padding:1rem}:host .message-type-icon-wrapper i{display:block;width:1.25rem;height:1.25rem}:host .close-icon-button{box-sizing:border-box;display:grid;place-content:center;width:2rem;height:2rem;flex-shrink:0;font-size:1rem;line-height:1.5rem;margin:.5rem;background:transparent;border:none;color:inherit;padding:0;cursor:pointer;min-height:32px}:host .close-icon-button:hover{color:#333;border-radius:100%}:host .close-icon-button:not(.information):hover{background-color:#fff}:host .close-icon-button.information:hover{background-color:#dedede}:host .success{background-color:#308800;color:#fff}:host .error{background-color:#d81a1a;color:#fff}:host .warning{background-color:#ffc500;color:#333}:host .information{background-color:#333;color:#e9e9e9}\n"] }]
59
+ ], template: "<output class=\"messages-container\" aria-live=\"polite\">\n <div\n class=\"message\"\n *ngFor=\"let message of messages\"\n [ngClass]=\"message.type\"\n @toastAnimation\n (mouseenter)=\"onMouseEnter(message)\"\n (mouseleave)=\"onMouseLeave(message)\"\n >\n <div class=\"content\" *transloco=\"let t; read: message.translocoScope\">\n <div class=\"message-type-icon-wrapper\">\n <ng-container *ngIf=\"message.type === 'success'\">\n <i>\n <svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M17.6203 6.60836L9.40014 14.8285L6.37976 11.8081C6.23332 11.6617 5.99588 11.6617 5.84942 11.8081L4.96554 12.692C4.8191 12.8384 4.8191 13.0759 4.96554 13.2223L9.13495 17.3917C9.28138 17.5382 9.51882 17.5382 9.66529 17.3917L19.0344 8.02258C19.1809 7.87614 19.1809 7.63871 19.0344 7.49224L18.1506 6.60836C18.0041 6.46193 17.7667 6.46193 17.6203 6.60836Z\"\n fill=\"white\"\n ></path>\n </svg>\n </i>\n </ng-container>\n <ng-container\n *ngIf=\"message.type === 'error' || message.type === 'warning'\"\n >\n <i>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M18.2857 4H5.71429C4.7675 4 4 4.7675 4 5.71429V18.2857C4 19.2325 4.7675 20 5.71429 20H18.2857C19.2325 20 20 19.2325 20 18.2857V5.71429C20 4.7675 19.2325 4 18.2857 4ZM10.8682 7.42857H13.1318C13.3777 7.42857 13.5731 7.635 13.5597 7.8805L13.2948 12.7376C13.2824 12.9649 13.0945 13.1429 12.8669 13.1429H11.1331C10.9055 13.1429 10.7176 12.9649 10.7052 12.7376L10.4402 7.8805C10.4269 7.635 10.6223 7.42857 10.8682 7.42857ZM12 17.0714C11.0927 17.0714 10.3571 16.3359 10.3571 15.4286C10.3571 14.5213 11.0927 13.7857 12 13.7857C12.9073 13.7857 13.6429 14.5213 13.6429 15.4286C13.6429 16.3359 12.9073 17.0714 12 17.0714Z\"\n fill=\"currentColor\"\n />\n </svg>\n </i>\n </ng-container>\n <ng-container *ngIf=\"message.type === 'information'\">\n <i>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M18.2857 4H5.71429C4.7675 4 4 4.7675 4 5.71429V18.2857C4 19.2325 4.7675 20 5.71429 20H18.2857C19.2325 20 20 19.2325 20 18.2857V5.71429C20 4.7675 19.2325 4 18.2857 4ZM12 7.07143C12.8284 7.07143 13.5 7.743 13.5 8.57143C13.5 9.39986 12.8284 10.0714 12 10.0714C11.1716 10.0714 10.5 9.39986 10.5 8.57143C10.5 7.743 11.1716 7.07143 12 7.07143ZM14 16.1429C14 16.3795 13.8081 16.5714 13.5714 16.5714H10.4286C10.1919 16.5714 10 16.3795 10 16.1429V15.2857C10 15.049 10.1919 14.8571 10.4286 14.8571H10.8571V12.5714H10.4286C10.1919 12.5714 10 12.3795 10 12.1429V11.2857C10 11.049 10.1919 10.8571 10.4286 10.8571H12.7143C12.951 10.8571 13.1429 11.049 13.1429 11.2857V14.8571H13.5714C13.8081 14.8571 14 15.049 14 15.2857V16.1429Z\"\n fill=\"currentColor\"\n />\n </svg>\n </i>\n </ng-container>\n </div>\n <div class=\"text-content\">\n @if (message.template) {\n <ng-template\n [ngTemplateOutlet]=\"message.template\"\n [ngTemplateOutletContext]=\"{ $implicit: message.templateContext }\"\n ></ng-template>\n } @else {\n @if (message.titleText) {\n <div>{{ t(message.titleText) }}</div>\n }\n @if (message.bodyText) {\n <div class=\"text-body-content\">\n {{ t(message.bodyText) }}\n </div>\n }\n }\n </div>\n <button\n class=\"close-icon-button\"\n [ngClass]=\"{ information: message.type === 'information' }\"\n (click)=\"removeMessage(message)\"\n [attr.aria-label]=\"closeButtonAriaLabel\"\n >\n <gds-icon-cross-small\n class=\"close-icon\"\n *nggCoreElement\n ></gds-icon-cross-small>\n </button>\n </div>\n </div>\n</output>\n", styles: [":host .messages-container{position:fixed;bottom:1rem;right:1rem;z-index:9999}:host .message{position:relative;font-size:1rem;max-width:22rem;min-width:22rem;min-height:3rem;box-shadow:0 2px 6px #00000026;margin-top:1rem}:host .content{display:flex;height:100%;padding:0;justify-content:space-between}:host .text-content{margin-top:1rem;margin-bottom:1rem;width:100%}:host .text-body-content{padding-top:1.5rem}:host .message-type-icon-wrapper{padding:1rem}:host .message-type-icon-wrapper i{display:block;width:1.25rem;height:1.25rem}:host .close-icon-button{box-sizing:border-box;display:grid;place-content:center;width:2rem;height:2rem;flex-shrink:0;font-size:1rem;line-height:1.5rem;margin:.5rem;background:transparent;border:none;color:inherit;padding:0;cursor:pointer;min-height:32px}:host .close-icon-button:hover{color:#333;border-radius:100%}:host .close-icon-button:not(.information):hover{background-color:#fff}:host .close-icon-button.information:hover{background-color:#dedede}:host .success{background-color:#308800;color:#fff}:host .error{background-color:#d81a1a;color:#fff}:host .warning{background-color:#ffc500;color:#333}:host .information{background-color:#333;color:#e9e9e9}\n"] }]
60
60
  }], ctorParameters: () => [{ type: i1.ToastMessageService }], propDecorators: { closeButtonAriaLabel: [{
61
61
  type: Input
62
62
  }] } });
63
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyL3NyYy92LWFuZ3VsYXIvdG9hc3QvdG9hc3QuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyL3NyYy92LWFuZ3VsYXIvdG9hc3QvdG9hc3QuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsVUFBVSxFQUFFLE9BQU8sRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBQ3pFLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFxQixNQUFNLGVBQWUsQ0FBQTtBQUduRSxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQTtBQUc3RCxPQUFPLDJEQUEyRCxDQUFBOzs7Ozs7QUF3QmxFLE1BQU0sT0FBTyxjQUFjO0lBT3pCLFlBQW9CLG1CQUF3QztRQUF4Qyx3QkFBbUIsR0FBbkIsbUJBQW1CLENBQXFCO1FBRjVELGFBQVEsR0FBbUIsRUFBRSxDQUFBO0lBRWtDLENBQUM7SUFFaEUsUUFBUTtRQUNOLElBQUksQ0FBQyx5QkFBeUIsR0FBRyxJQUFJLENBQUMsbUJBQW1CO2FBQ3RELFdBQVcsRUFBRTthQUNiLFNBQVMsQ0FBQyxDQUFDLFFBQVEsRUFBRSxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsUUFBUSxHQUFHLFFBQVEsQ0FBQyxDQUFDLENBQUE7SUFDeEQsQ0FBQztJQUVELFlBQVksQ0FBQyxPQUFxQjtRQUNoQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsbUJBQW1CLENBQUMsT0FBTyxDQUFDLENBQUE7SUFDdkQsQ0FBQztJQUVELFlBQVksQ0FBQyxPQUFxQjtRQUNoQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsb0JBQW9CLENBQUMsT0FBTyxDQUFDLENBQUE7SUFDeEQsQ0FBQztJQUVELGFBQWEsQ0FBQyxPQUFxQjtRQUNqQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsYUFBYSxDQUFDLE9BQU8sQ0FBQyxDQUFBO0lBQ2pELENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxJQUFJLENBQUMseUJBQXlCLEVBQUUsQ0FBQztZQUNuQyxJQUFJLENBQUMseUJBQXlCLENBQUMsV0FBVyxFQUFFLENBQUE7UUFDOUMsQ0FBQztJQUNILENBQUM7K0dBL0JVLGNBQWM7bUdBQWQsY0FBYyw0R0MvQjNCLDg1SEE4RUEsbzBERGpFYztZQUNWLE9BQU8sQ0FBQyxnQkFBZ0IsRUFBRTtnQkFDeEIsVUFBVSxDQUFDLFFBQVEsRUFBRTtvQkFDbkIsS0FBSyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsRUFBRSxTQUFTLEVBQUUsa0JBQWtCLEVBQUUsQ0FBQztvQkFDcEQsT0FBTyxDQUNMLGVBQWUsRUFDZixLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLFNBQVMsRUFBRSxlQUFlLEVBQUUsQ0FBQyxDQUNsRDtpQkFDRixDQUFDO2dCQUNGLFVBQVUsQ0FBQyxRQUFRLEVBQUU7b0JBQ25CLE9BQU8sQ0FDTCxnQkFBZ0IsRUFDaEIsS0FBSyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsRUFBRSxTQUFTLEVBQUUsa0JBQWtCLEVBQUUsQ0FBQyxDQUNyRDtpQkFDRixDQUFDO2FBQ0gsQ0FBQztTQUNIOzs0RkFFVSxjQUFjO2tCQXRCMUIsU0FBUzsrQkFDRSxZQUFZLGNBR1Y7d0JBQ1YsT0FBTyxDQUFDLGdCQUFnQixFQUFFOzRCQUN4QixVQUFVLENBQUMsUUFBUSxFQUFFO2dDQUNuQixLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLFNBQVMsRUFBRSxrQkFBa0IsRUFBRSxDQUFDO2dDQUNwRCxPQUFPLENBQ0wsZUFBZSxFQUNmLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLGVBQWUsRUFBRSxDQUFDLENBQ2xEOzZCQUNGLENBQUM7NEJBQ0YsVUFBVSxDQUFDLFFBQVEsRUFBRTtnQ0FDbkIsT0FBTyxDQUNMLGdCQUFnQixFQUNoQixLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLFNBQVMsRUFBRSxrQkFBa0IsRUFBRSxDQUFDLENBQ3JEOzZCQUNGLENBQUM7eUJBQ0gsQ0FBQztxQkFDSDt3RkFHUSxvQkFBb0I7c0JBQTVCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBhbmltYXRlLCBzdHlsZSwgdHJhbnNpdGlvbiwgdHJpZ2dlciB9IGZyb20gJ0Bhbmd1bGFyL2FuaW1hdGlvbnMnXG5pbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkRlc3Ryb3ksIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnXG5pbXBvcnQgeyBTdWJzY3JpcHRpb24gfSBmcm9tICdyeGpzJ1xuXG5pbXBvcnQgeyBUb2FzdE1lc3NhZ2VTZXJ2aWNlIH0gZnJvbSAnLi90b2FzdC1tZXNzYWdlLnNlcnZpY2UnXG5pbXBvcnQgeyBUb2FzdE1lc3NhZ2UgfSBmcm9tICcuL3RvYXN0Lm1vZGVscydcblxuaW1wb3J0ICdAc2ViZ3JvdXAvZ3JlZW4tY29yZS9jb21wb25lbnRzL2ljb24vaWNvbnMvY3Jvc3Mtc21hbGwuanMnXG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ25nZ3YtdG9hc3QnLFxuICB0ZW1wbGF0ZVVybDogJy4vdG9hc3QuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi90b2FzdC5jb21wb25lbnQuc2NzcyddLFxuICBhbmltYXRpb25zOiBbXG4gICAgdHJpZ2dlcigndG9hc3RBbmltYXRpb24nLCBbXG4gICAgICB0cmFuc2l0aW9uKCc6ZW50ZXInLCBbXG4gICAgICAgIHN0eWxlKHsgb3BhY2l0eTogMCwgdHJhbnNmb3JtOiAndHJhbnNsYXRlWSgxMDAlKScgfSksXG4gICAgICAgIGFuaW1hdGUoXG4gICAgICAgICAgJzMwMG1zIGVhc2UtaW4nLFxuICAgICAgICAgIHN0eWxlKHsgb3BhY2l0eTogMSwgdHJhbnNmb3JtOiAndHJhbnNsYXRlWSgwKScgfSksXG4gICAgICAgICksXG4gICAgICBdKSxcbiAgICAgIHRyYW5zaXRpb24oJzpsZWF2ZScsIFtcbiAgICAgICAgYW5pbWF0ZShcbiAgICAgICAgICAnMzAwbXMgZWFzZS1vdXQnLFxuICAgICAgICAgIHN0eWxlKHsgb3BhY2l0eTogMCwgdHJhbnNmb3JtOiAndHJhbnNsYXRlWSgxMDAlKScgfSksXG4gICAgICAgICksXG4gICAgICBdKSxcbiAgICBdKSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgVG9hc3RDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uRGVzdHJveSB7XG4gIEBJbnB1dCgpIGNsb3NlQnV0dG9uQXJpYUxhYmVsPzogc3RyaW5nXG5cbiAgcHJpdmF0ZSB0b2FzdE1lc3NhZ2VzU3Vic2NyaXB0aW9uITogU3Vic2NyaXB0aW9uXG5cbiAgbWVzc2FnZXM6IFRvYXN0TWVzc2FnZVtdID0gW11cblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHRvYXN0TWVzc2FnZVNlcnZpY2U6IFRvYXN0TWVzc2FnZVNlcnZpY2UpIHt9XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgdGhpcy50b2FzdE1lc3NhZ2VzU3Vic2NyaXB0aW9uID0gdGhpcy50b2FzdE1lc3NhZ2VTZXJ2aWNlXG4gICAgICAuZ2V0TWVzc2FnZXMoKVxuICAgICAgLnN1YnNjcmliZSgobWVzc2FnZXMpID0+ICh0aGlzLm1lc3NhZ2VzID0gbWVzc2FnZXMpKVxuICB9XG5cbiAgb25Nb3VzZUVudGVyKG1lc3NhZ2U6IFRvYXN0TWVzc2FnZSkge1xuICAgIHRoaXMudG9hc3RNZXNzYWdlU2VydmljZS5wYXVzZU1lc3NhZ2VUaW1lb3V0KG1lc3NhZ2UpXG4gIH1cblxuICBvbk1vdXNlTGVhdmUobWVzc2FnZTogVG9hc3RNZXNzYWdlKSB7XG4gICAgdGhpcy50b2FzdE1lc3NhZ2VTZXJ2aWNlLnJlc3VtZU1lc3NhZ2VUaW1lb3V0KG1lc3NhZ2UpXG4gIH1cblxuICByZW1vdmVNZXNzYWdlKG1lc3NhZ2U6IFRvYXN0TWVzc2FnZSkge1xuICAgIHRoaXMudG9hc3RNZXNzYWdlU2VydmljZS5yZW1vdmVNZXNzYWdlKG1lc3NhZ2UpXG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy50b2FzdE1lc3NhZ2VzU3Vic2NyaXB0aW9uKSB7XG4gICAgICB0aGlzLnRvYXN0TWVzc2FnZXNTdWJzY3JpcHRpb24udW5zdWJzY3JpYmUoKVxuICAgIH1cbiAgfVxufVxuIiwiPG91dHB1dCBjbGFzcz1cIm1lc3NhZ2VzLWNvbnRhaW5lclwiIGFyaWEtbGl2ZT1cInBvbGl0ZVwiPlxuICA8ZGl2XG4gICAgY2xhc3M9XCJtZXNzYWdlXCJcbiAgICAqbmdGb3I9XCJsZXQgbWVzc2FnZSBvZiBtZXNzYWdlc1wiXG4gICAgW25nQ2xhc3NdPVwibWVzc2FnZS50eXBlXCJcbiAgICBAdG9hc3RBbmltYXRpb25cbiAgICAobW91c2VlbnRlcik9XCJvbk1vdXNlRW50ZXIobWVzc2FnZSlcIlxuICAgIChtb3VzZWxlYXZlKT1cIm9uTW91c2VMZWF2ZShtZXNzYWdlKVwiXG4gID5cbiAgICA8ZGl2IGNsYXNzPVwiY29udGVudFwiICp0cmFuc2xvY289XCJsZXQgdDsgcmVhZDogbWVzc2FnZS50cmFuc2xvY29TY29wZVwiPlxuICAgICAgPGRpdiBjbGFzcz1cIm1lc3NhZ2UtdHlwZS1pY29uLXdyYXBwZXJcIj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIm1lc3NhZ2UudHlwZSA9PT0gJ3N1Y2Nlc3MnXCI+XG4gICAgICAgICAgPGk+XG4gICAgICAgICAgICA8c3ZnXG4gICAgICAgICAgICAgIHdpZHRoPVwiMjRcIlxuICAgICAgICAgICAgICBoZWlnaHQ9XCIyNFwiXG4gICAgICAgICAgICAgIHZpZXdCb3g9XCIwIDAgMjQgMjRcIlxuICAgICAgICAgICAgICBmaWxsPVwibm9uZVwiXG4gICAgICAgICAgICAgIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICA8cGF0aFxuICAgICAgICAgICAgICAgIGQ9XCJNMTcuNjIwMyA2LjYwODM2TDkuNDAwMTQgMTQuODI4NUw2LjM3OTc2IDExLjgwODFDNi4yMzMzMiAxMS42NjE3IDUuOTk1ODggMTEuNjYxNyA1Ljg0OTQyIDExLjgwODFMNC45NjU1NCAxMi42OTJDNC44MTkxIDEyLjgzODQgNC44MTkxIDEzLjA3NTkgNC45NjU1NCAxMy4yMjIzTDkuMTM0OTUgMTcuMzkxN0M5LjI4MTM4IDE3LjUzODIgOS41MTg4MiAxNy41MzgyIDkuNjY1MjkgMTcuMzkxN0wxOS4wMzQ0IDguMDIyNThDMTkuMTgwOSA3Ljg3NjE0IDE5LjE4MDkgNy42Mzg3MSAxOS4wMzQ0IDcuNDkyMjRMMTguMTUwNiA2LjYwODM2QzE4LjAwNDEgNi40NjE5MyAxNy43NjY3IDYuNDYxOTMgMTcuNjIwMyA2LjYwODM2WlwiXG4gICAgICAgICAgICAgICAgZmlsbD1cIndoaXRlXCJcbiAgICAgICAgICAgICAgPjwvcGF0aD5cbiAgICAgICAgICAgIDwvc3ZnPlxuICAgICAgICAgIDwvaT5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDxuZy1jb250YWluZXJcbiAgICAgICAgICAqbmdJZj1cIm1lc3NhZ2UudHlwZSA9PT0gJ2Vycm9yJyB8fCBtZXNzYWdlLnR5cGUgPT09ICd3YXJuaW5nJ1wiXG4gICAgICAgID5cbiAgICAgICAgICA8aT5cbiAgICAgICAgICAgIDxzdmdcbiAgICAgICAgICAgICAgdmlld0JveD1cIjAgMCAyNCAyNFwiXG4gICAgICAgICAgICAgIGZpbGw9XCJub25lXCJcbiAgICAgICAgICAgICAgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgIDxwYXRoXG4gICAgICAgICAgICAgICAgZD1cIk0xOC4yODU3IDRINS43MTQyOUM0Ljc2NzUgNCA0IDQuNzY3NSA0IDUuNzE0MjlWMTguMjg1N0M0IDE5LjIzMjUgNC43Njc1IDIwIDUuNzE0MjkgMjBIMTguMjg1N0MxOS4yMzI1IDIwIDIwIDE5LjIzMjUgMjAgMTguMjg1N1Y1LjcxNDI5QzIwIDQuNzY3NSAxOS4yMzI1IDQgMTguMjg1NyA0Wk0xMC44NjgyIDcuNDI4NTdIMTMuMTMxOEMxMy4zNzc3IDcuNDI4NTcgMTMuNTczMSA3LjYzNSAxMy41NTk3IDcuODgwNUwxMy4yOTQ4IDEyLjczNzZDMTMuMjgyNCAxMi45NjQ5IDEzLjA5NDUgMTMuMTQyOSAxMi44NjY5IDEzLjE0MjlIMTEuMTMzMUMxMC45MDU1IDEzLjE0MjkgMTAuNzE3NiAxMi45NjQ5IDEwLjcwNTIgMTIuNzM3NkwxMC40NDAyIDcuODgwNUMxMC40MjY5IDcuNjM1IDEwLjYyMjMgNy40Mjg1NyAxMC44NjgyIDcuNDI4NTdaTTEyIDE3LjA3MTRDMTEuMDkyNyAxNy4wNzE0IDEwLjM1NzEgMTYuMzM1OSAxMC4zNTcxIDE1LjQyODZDMTAuMzU3MSAxNC41MjEzIDExLjA5MjcgMTMuNzg1NyAxMiAxMy43ODU3QzEyLjkwNzMgMTMuNzg1NyAxMy42NDI5IDE0LjUyMTMgMTMuNjQyOSAxNS40Mjg2QzEzLjY0MjkgMTYuMzM1OSAxMi45MDczIDE3LjA3MTQgMTIgMTcuMDcxNFpcIlxuICAgICAgICAgICAgICAgIGZpbGw9XCJjdXJyZW50Q29sb3JcIlxuICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgPC9zdmc+XG4gICAgICAgICAgPC9pPlxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIm1lc3NhZ2UudHlwZSA9PT0gJ2luZm9ybWF0aW9uJ1wiPlxuICAgICAgICAgIDxpPlxuICAgICAgICAgICAgPHN2Z1xuICAgICAgICAgICAgICB2aWV3Qm94PVwiMCAwIDI0IDI0XCJcbiAgICAgICAgICAgICAgZmlsbD1cIm5vbmVcIlxuICAgICAgICAgICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCJcbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgPHBhdGhcbiAgICAgICAgICAgICAgICBkPVwiTTE4LjI4NTcgNEg1LjcxNDI5QzQuNzY3NSA0IDQgNC43Njc1IDQgNS43MTQyOVYxOC4yODU3QzQgMTkuMjMyNSA0Ljc2NzUgMjAgNS43MTQyOSAyMEgxOC4yODU3QzE5LjIzMjUgMjAgMjAgMTkuMjMyNSAyMCAxOC4yODU3VjUuNzE0MjlDMjAgNC43Njc1IDE5LjIzMjUgNCAxOC4yODU3IDRaTTEyIDcuMDcxNDNDMTIuODI4NCA3LjA3MTQzIDEzLjUgNy43NDMgMTMuNSA4LjU3MTQzQzEzLjUgOS4zOTk4NiAxMi44Mjg0IDEwLjA3MTQgMTIgMTAuMDcxNEMxMS4xNzE2IDEwLjA3MTQgMTAuNSA5LjM5OTg2IDEwLjUgOC41NzE0M0MxMC41IDcuNzQzIDExLjE3MTYgNy4wNzE0MyAxMiA3LjA3MTQzWk0xNCAxNi4xNDI5QzE0IDE2LjM3OTUgMTMuODA4MSAxNi41NzE0IDEzLjU3MTQgMTYuNTcxNEgxMC40Mjg2QzEwLjE5MTkgMTYuNTcxNCAxMCAxNi4zNzk1IDEwIDE2LjE0MjlWMTUuMjg1N0MxMCAxNS4wNDkgMTAuMTkxOSAxNC44NTcxIDEwLjQyODYgMTQuODU3MUgxMC44NTcxVjEyLjU3MTRIMTAuNDI4NkMxMC4xOTE5IDEyLjU3MTQgMTAgMTIuMzc5NSAxMCAxMi4xNDI5VjExLjI4NTdDMTAgMTEuMDQ5IDEwLjE5MTkgMTAuODU3MSAxMC40Mjg2IDEwLjg1NzFIMTIuNzE0M0MxMi45NTEgMTAuODU3MSAxMy4xNDI5IDExLjA0OSAxMy4xNDI5IDExLjI4NTdWMTQuODU3MUgxMy41NzE0QzEzLjgwODEgMTQuODU3MSAxNCAxNS4wNDkgMTQgMTUuMjg1N1YxNi4xNDI5WlwiXG4gICAgICAgICAgICAgICAgZmlsbD1cImN1cnJlbnRDb2xvclwiXG4gICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICA8L3N2Zz5cbiAgICAgICAgICA8L2k+XG4gICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwidGV4dC1jb250ZW50XCI+XG4gICAgICAgIDxkaXY+e3sgdChtZXNzYWdlLnRpdGxlVGV4dCkgfX08L2Rpdj5cbiAgICAgICAgPGRpdiAqbmdJZj1cIm1lc3NhZ2UuYm9keVRleHRcIiBjbGFzcz1cInRleHQtYm9keS1jb250ZW50XCI+XG4gICAgICAgICAge3sgdChtZXNzYWdlLmJvZHlUZXh0KSB9fVxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgICAgPGJ1dHRvblxuICAgICAgICBjbGFzcz1cImNsb3NlLWljb24tYnV0dG9uXCJcbiAgICAgICAgW25nQ2xhc3NdPVwieyBpbmZvcm1hdGlvbjogbWVzc2FnZS50eXBlID09PSAnaW5mb3JtYXRpb24nIH1cIlxuICAgICAgICAoY2xpY2spPVwicmVtb3ZlTWVzc2FnZShtZXNzYWdlKVwiXG4gICAgICAgIFthdHRyLmFyaWEtbGFiZWxdPVwiY2xvc2VCdXR0b25BcmlhTGFiZWxcIlxuICAgICAgPlxuICAgICAgICA8Z2RzLWljb24tY3Jvc3Mtc21hbGxcbiAgICAgICAgICBjbGFzcz1cImNsb3NlLWljb25cIlxuICAgICAgICAgICpuZ2dDb3JlRWxlbWVudFxuICAgICAgICA+PC9nZHMtaWNvbi1jcm9zcy1zbWFsbD5cbiAgICAgIDwvYnV0dG9uPlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbjwvb3V0cHV0PlxuIl19
63
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyL3NyYy92LWFuZ3VsYXIvdG9hc3QvdG9hc3QuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyL3NyYy92LWFuZ3VsYXIvdG9hc3QvdG9hc3QuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsVUFBVSxFQUFFLE9BQU8sRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBQ3pFLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFxQixNQUFNLGVBQWUsQ0FBQTtBQUduRSxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQTtBQUc3RCxPQUFPLDJEQUEyRCxDQUFBOzs7Ozs7QUF3QmxFLE1BQU0sT0FBTyxjQUFjO0lBT3pCLFlBQW9CLG1CQUF3QztRQUF4Qyx3QkFBbUIsR0FBbkIsbUJBQW1CLENBQXFCO1FBRjVELGFBQVEsR0FBbUIsRUFBRSxDQUFBO0lBRWtDLENBQUM7SUFFaEUsUUFBUTtRQUNOLElBQUksQ0FBQyx5QkFBeUIsR0FBRyxJQUFJLENBQUMsbUJBQW1CO2FBQ3RELFdBQVcsRUFBRTthQUNiLFNBQVMsQ0FBQyxDQUFDLFFBQVEsRUFBRSxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsUUFBUSxHQUFHLFFBQVEsQ0FBQyxDQUFDLENBQUE7SUFDeEQsQ0FBQztJQUVELFlBQVksQ0FBQyxPQUFxQjtRQUNoQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsbUJBQW1CLENBQUMsT0FBTyxDQUFDLENBQUE7SUFDdkQsQ0FBQztJQUVELFlBQVksQ0FBQyxPQUFxQjtRQUNoQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsb0JBQW9CLENBQUMsT0FBTyxDQUFDLENBQUE7SUFDeEQsQ0FBQztJQUVELGFBQWEsQ0FBQyxPQUFxQjtRQUNqQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsYUFBYSxDQUFDLE9BQU8sQ0FBQyxDQUFBO0lBQ2pELENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxJQUFJLENBQUMseUJBQXlCLEVBQUUsQ0FBQztZQUNuQyxJQUFJLENBQUMseUJBQXlCLENBQUMsV0FBVyxFQUFFLENBQUE7UUFDOUMsQ0FBQztJQUNILENBQUM7K0dBL0JVLGNBQWM7bUdBQWQsY0FBYyw0R0MvQjNCLGd2SUF5RkEsMitERDVFYztZQUNWLE9BQU8sQ0FBQyxnQkFBZ0IsRUFBRTtnQkFDeEIsVUFBVSxDQUFDLFFBQVEsRUFBRTtvQkFDbkIsS0FBSyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsRUFBRSxTQUFTLEVBQUUsa0JBQWtCLEVBQUUsQ0FBQztvQkFDcEQsT0FBTyxDQUNMLGVBQWUsRUFDZixLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLFNBQVMsRUFBRSxlQUFlLEVBQUUsQ0FBQyxDQUNsRDtpQkFDRixDQUFDO2dCQUNGLFVBQVUsQ0FBQyxRQUFRLEVBQUU7b0JBQ25CLE9BQU8sQ0FDTCxnQkFBZ0IsRUFDaEIsS0FBSyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsRUFBRSxTQUFTLEVBQUUsa0JBQWtCLEVBQUUsQ0FBQyxDQUNyRDtpQkFDRixDQUFDO2FBQ0gsQ0FBQztTQUNIOzs0RkFFVSxjQUFjO2tCQXRCMUIsU0FBUzsrQkFDRSxZQUFZLGNBR1Y7d0JBQ1YsT0FBTyxDQUFDLGdCQUFnQixFQUFFOzRCQUN4QixVQUFVLENBQUMsUUFBUSxFQUFFO2dDQUNuQixLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLFNBQVMsRUFBRSxrQkFBa0IsRUFBRSxDQUFDO2dDQUNwRCxPQUFPLENBQ0wsZUFBZSxFQUNmLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLGVBQWUsRUFBRSxDQUFDLENBQ2xEOzZCQUNGLENBQUM7NEJBQ0YsVUFBVSxDQUFDLFFBQVEsRUFBRTtnQ0FDbkIsT0FBTyxDQUNMLGdCQUFnQixFQUNoQixLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLFNBQVMsRUFBRSxrQkFBa0IsRUFBRSxDQUFDLENBQ3JEOzZCQUNGLENBQUM7eUJBQ0gsQ0FBQztxQkFDSDt3RkFHUSxvQkFBb0I7c0JBQTVCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBhbmltYXRlLCBzdHlsZSwgdHJhbnNpdGlvbiwgdHJpZ2dlciB9IGZyb20gJ0Bhbmd1bGFyL2FuaW1hdGlvbnMnXG5pbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkRlc3Ryb3ksIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnXG5pbXBvcnQgeyBTdWJzY3JpcHRpb24gfSBmcm9tICdyeGpzJ1xuXG5pbXBvcnQgeyBUb2FzdE1lc3NhZ2VTZXJ2aWNlIH0gZnJvbSAnLi90b2FzdC1tZXNzYWdlLnNlcnZpY2UnXG5pbXBvcnQgeyBUb2FzdE1lc3NhZ2UgfSBmcm9tICcuL3RvYXN0Lm1vZGVscydcblxuaW1wb3J0ICdAc2ViZ3JvdXAvZ3JlZW4tY29yZS9jb21wb25lbnRzL2ljb24vaWNvbnMvY3Jvc3Mtc21hbGwuanMnXG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ25nZ3YtdG9hc3QnLFxuICB0ZW1wbGF0ZVVybDogJy4vdG9hc3QuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi90b2FzdC5jb21wb25lbnQuc2NzcyddLFxuICBhbmltYXRpb25zOiBbXG4gICAgdHJpZ2dlcigndG9hc3RBbmltYXRpb24nLCBbXG4gICAgICB0cmFuc2l0aW9uKCc6ZW50ZXInLCBbXG4gICAgICAgIHN0eWxlKHsgb3BhY2l0eTogMCwgdHJhbnNmb3JtOiAndHJhbnNsYXRlWSgxMDAlKScgfSksXG4gICAgICAgIGFuaW1hdGUoXG4gICAgICAgICAgJzMwMG1zIGVhc2UtaW4nLFxuICAgICAgICAgIHN0eWxlKHsgb3BhY2l0eTogMSwgdHJhbnNmb3JtOiAndHJhbnNsYXRlWSgwKScgfSksXG4gICAgICAgICksXG4gICAgICBdKSxcbiAgICAgIHRyYW5zaXRpb24oJzpsZWF2ZScsIFtcbiAgICAgICAgYW5pbWF0ZShcbiAgICAgICAgICAnMzAwbXMgZWFzZS1vdXQnLFxuICAgICAgICAgIHN0eWxlKHsgb3BhY2l0eTogMCwgdHJhbnNmb3JtOiAndHJhbnNsYXRlWSgxMDAlKScgfSksXG4gICAgICAgICksXG4gICAgICBdKSxcbiAgICBdKSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgVG9hc3RDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uRGVzdHJveSB7XG4gIEBJbnB1dCgpIGNsb3NlQnV0dG9uQXJpYUxhYmVsPzogc3RyaW5nXG5cbiAgcHJpdmF0ZSB0b2FzdE1lc3NhZ2VzU3Vic2NyaXB0aW9uITogU3Vic2NyaXB0aW9uXG5cbiAgbWVzc2FnZXM6IFRvYXN0TWVzc2FnZVtdID0gW11cblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHRvYXN0TWVzc2FnZVNlcnZpY2U6IFRvYXN0TWVzc2FnZVNlcnZpY2UpIHt9XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgdGhpcy50b2FzdE1lc3NhZ2VzU3Vic2NyaXB0aW9uID0gdGhpcy50b2FzdE1lc3NhZ2VTZXJ2aWNlXG4gICAgICAuZ2V0TWVzc2FnZXMoKVxuICAgICAgLnN1YnNjcmliZSgobWVzc2FnZXMpID0+ICh0aGlzLm1lc3NhZ2VzID0gbWVzc2FnZXMpKVxuICB9XG5cbiAgb25Nb3VzZUVudGVyKG1lc3NhZ2U6IFRvYXN0TWVzc2FnZSkge1xuICAgIHRoaXMudG9hc3RNZXNzYWdlU2VydmljZS5wYXVzZU1lc3NhZ2VUaW1lb3V0KG1lc3NhZ2UpXG4gIH1cblxuICBvbk1vdXNlTGVhdmUobWVzc2FnZTogVG9hc3RNZXNzYWdlKSB7XG4gICAgdGhpcy50b2FzdE1lc3NhZ2VTZXJ2aWNlLnJlc3VtZU1lc3NhZ2VUaW1lb3V0KG1lc3NhZ2UpXG4gIH1cblxuICByZW1vdmVNZXNzYWdlKG1lc3NhZ2U6IFRvYXN0TWVzc2FnZSkge1xuICAgIHRoaXMudG9hc3RNZXNzYWdlU2VydmljZS5yZW1vdmVNZXNzYWdlKG1lc3NhZ2UpXG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy50b2FzdE1lc3NhZ2VzU3Vic2NyaXB0aW9uKSB7XG4gICAgICB0aGlzLnRvYXN0TWVzc2FnZXNTdWJzY3JpcHRpb24udW5zdWJzY3JpYmUoKVxuICAgIH1cbiAgfVxufVxuIiwiPG91dHB1dCBjbGFzcz1cIm1lc3NhZ2VzLWNvbnRhaW5lclwiIGFyaWEtbGl2ZT1cInBvbGl0ZVwiPlxuICA8ZGl2XG4gICAgY2xhc3M9XCJtZXNzYWdlXCJcbiAgICAqbmdGb3I9XCJsZXQgbWVzc2FnZSBvZiBtZXNzYWdlc1wiXG4gICAgW25nQ2xhc3NdPVwibWVzc2FnZS50eXBlXCJcbiAgICBAdG9hc3RBbmltYXRpb25cbiAgICAobW91c2VlbnRlcik9XCJvbk1vdXNlRW50ZXIobWVzc2FnZSlcIlxuICAgIChtb3VzZWxlYXZlKT1cIm9uTW91c2VMZWF2ZShtZXNzYWdlKVwiXG4gID5cbiAgICA8ZGl2IGNsYXNzPVwiY29udGVudFwiICp0cmFuc2xvY289XCJsZXQgdDsgcmVhZDogbWVzc2FnZS50cmFuc2xvY29TY29wZVwiPlxuICAgICAgPGRpdiBjbGFzcz1cIm1lc3NhZ2UtdHlwZS1pY29uLXdyYXBwZXJcIj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIm1lc3NhZ2UudHlwZSA9PT0gJ3N1Y2Nlc3MnXCI+XG4gICAgICAgICAgPGk+XG4gICAgICAgICAgICA8c3ZnXG4gICAgICAgICAgICAgIHdpZHRoPVwiMjRcIlxuICAgICAgICAgICAgICBoZWlnaHQ9XCIyNFwiXG4gICAgICAgICAgICAgIHZpZXdCb3g9XCIwIDAgMjQgMjRcIlxuICAgICAgICAgICAgICBmaWxsPVwibm9uZVwiXG4gICAgICAgICAgICAgIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICA8cGF0aFxuICAgICAgICAgICAgICAgIGQ9XCJNMTcuNjIwMyA2LjYwODM2TDkuNDAwMTQgMTQuODI4NUw2LjM3OTc2IDExLjgwODFDNi4yMzMzMiAxMS42NjE3IDUuOTk1ODggMTEuNjYxNyA1Ljg0OTQyIDExLjgwODFMNC45NjU1NCAxMi42OTJDNC44MTkxIDEyLjgzODQgNC44MTkxIDEzLjA3NTkgNC45NjU1NCAxMy4yMjIzTDkuMTM0OTUgMTcuMzkxN0M5LjI4MTM4IDE3LjUzODIgOS41MTg4MiAxNy41MzgyIDkuNjY1MjkgMTcuMzkxN0wxOS4wMzQ0IDguMDIyNThDMTkuMTgwOSA3Ljg3NjE0IDE5LjE4MDkgNy42Mzg3MSAxOS4wMzQ0IDcuNDkyMjRMMTguMTUwNiA2LjYwODM2QzE4LjAwNDEgNi40NjE5MyAxNy43NjY3IDYuNDYxOTMgMTcuNjIwMyA2LjYwODM2WlwiXG4gICAgICAgICAgICAgICAgZmlsbD1cIndoaXRlXCJcbiAgICAgICAgICAgICAgPjwvcGF0aD5cbiAgICAgICAgICAgIDwvc3ZnPlxuICAgICAgICAgIDwvaT5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDxuZy1jb250YWluZXJcbiAgICAgICAgICAqbmdJZj1cIm1lc3NhZ2UudHlwZSA9PT0gJ2Vycm9yJyB8fCBtZXNzYWdlLnR5cGUgPT09ICd3YXJuaW5nJ1wiXG4gICAgICAgID5cbiAgICAgICAgICA8aT5cbiAgICAgICAgICAgIDxzdmdcbiAgICAgICAgICAgICAgdmlld0JveD1cIjAgMCAyNCAyNFwiXG4gICAgICAgICAgICAgIGZpbGw9XCJub25lXCJcbiAgICAgICAgICAgICAgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgIDxwYXRoXG4gICAgICAgICAgICAgICAgZD1cIk0xOC4yODU3IDRINS43MTQyOUM0Ljc2NzUgNCA0IDQuNzY3NSA0IDUuNzE0MjlWMTguMjg1N0M0IDE5LjIzMjUgNC43Njc1IDIwIDUuNzE0MjkgMjBIMTguMjg1N0MxOS4yMzI1IDIwIDIwIDE5LjIzMjUgMjAgMTguMjg1N1Y1LjcxNDI5QzIwIDQuNzY3NSAxOS4yMzI1IDQgMTguMjg1NyA0Wk0xMC44NjgyIDcuNDI4NTdIMTMuMTMxOEMxMy4zNzc3IDcuNDI4NTcgMTMuNTczMSA3LjYzNSAxMy41NTk3IDcuODgwNUwxMy4yOTQ4IDEyLjczNzZDMTMuMjgyNCAxMi45NjQ5IDEzLjA5NDUgMTMuMTQyOSAxMi44NjY5IDEzLjE0MjlIMTEuMTMzMUMxMC45MDU1IDEzLjE0MjkgMTAuNzE3NiAxMi45NjQ5IDEwLjcwNTIgMTIuNzM3NkwxMC40NDAyIDcuODgwNUMxMC40MjY5IDcuNjM1IDEwLjYyMjMgNy40Mjg1NyAxMC44NjgyIDcuNDI4NTdaTTEyIDE3LjA3MTRDMTEuMDkyNyAxNy4wNzE0IDEwLjM1NzEgMTYuMzM1OSAxMC4zNTcxIDE1LjQyODZDMTAuMzU3MSAxNC41MjEzIDExLjA5MjcgMTMuNzg1NyAxMiAxMy43ODU3QzEyLjkwNzMgMTMuNzg1NyAxMy42NDI5IDE0LjUyMTMgMTMuNjQyOSAxNS40Mjg2QzEzLjY0MjkgMTYuMzM1OSAxMi45MDczIDE3LjA3MTQgMTIgMTcuMDcxNFpcIlxuICAgICAgICAgICAgICAgIGZpbGw9XCJjdXJyZW50Q29sb3JcIlxuICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgPC9zdmc+XG4gICAgICAgICAgPC9pPlxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIm1lc3NhZ2UudHlwZSA9PT0gJ2luZm9ybWF0aW9uJ1wiPlxuICAgICAgICAgIDxpPlxuICAgICAgICAgICAgPHN2Z1xuICAgICAgICAgICAgICB2aWV3Qm94PVwiMCAwIDI0IDI0XCJcbiAgICAgICAgICAgICAgZmlsbD1cIm5vbmVcIlxuICAgICAgICAgICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCJcbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgPHBhdGhcbiAgICAgICAgICAgICAgICBkPVwiTTE4LjI4NTcgNEg1LjcxNDI5QzQuNzY3NSA0IDQgNC43Njc1IDQgNS43MTQyOVYxOC4yODU3QzQgMTkuMjMyNSA0Ljc2NzUgMjAgNS43MTQyOSAyMEgxOC4yODU3QzE5LjIzMjUgMjAgMjAgMTkuMjMyNSAyMCAxOC4yODU3VjUuNzE0MjlDMjAgNC43Njc1IDE5LjIzMjUgNCAxOC4yODU3IDRaTTEyIDcuMDcxNDNDMTIuODI4NCA3LjA3MTQzIDEzLjUgNy43NDMgMTMuNSA4LjU3MTQzQzEzLjUgOS4zOTk4NiAxMi44Mjg0IDEwLjA3MTQgMTIgMTAuMDcxNEMxMS4xNzE2IDEwLjA3MTQgMTAuNSA5LjM5OTg2IDEwLjUgOC41NzE0M0MxMC41IDcuNzQzIDExLjE3MTYgNy4wNzE0MyAxMiA3LjA3MTQzWk0xNCAxNi4xNDI5QzE0IDE2LjM3OTUgMTMuODA4MSAxNi41NzE0IDEzLjU3MTQgMTYuNTcxNEgxMC40Mjg2QzEwLjE5MTkgMTYuNTcxNCAxMCAxNi4zNzk1IDEwIDE2LjE0MjlWMTUuMjg1N0MxMCAxNS4wNDkgMTAuMTkxOSAxNC44NTcxIDEwLjQyODYgMTQuODU3MUgxMC44NTcxVjEyLjU3MTRIMTAuNDI4NkMxMC4xOTE5IDEyLjU3MTQgMTAgMTIuMzc5NSAxMCAxMi4xNDI5VjExLjI4NTdDMTAgMTEuMDQ5IDEwLjE5MTkgMTAuODU3MSAxMC40Mjg2IDEwLjg1NzFIMTIuNzE0M0MxMi45NTEgMTAuODU3MSAxMy4xNDI5IDExLjA0OSAxMy4xNDI5IDExLjI4NTdWMTQuODU3MUgxMy41NzE0QzEzLjgwODEgMTQuODU3MSAxNCAxNS4wNDkgMTQgMTUuMjg1N1YxNi4xNDI5WlwiXG4gICAgICAgICAgICAgICAgZmlsbD1cImN1cnJlbnRDb2xvclwiXG4gICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICA8L3N2Zz5cbiAgICAgICAgICA8L2k+XG4gICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwidGV4dC1jb250ZW50XCI+XG4gICAgICAgIEBpZiAobWVzc2FnZS50ZW1wbGF0ZSkge1xuICAgICAgICAgIDxuZy10ZW1wbGF0ZVxuICAgICAgICAgICAgW25nVGVtcGxhdGVPdXRsZXRdPVwibWVzc2FnZS50ZW1wbGF0ZVwiXG4gICAgICAgICAgICBbbmdUZW1wbGF0ZU91dGxldENvbnRleHRdPVwieyAkaW1wbGljaXQ6IG1lc3NhZ2UudGVtcGxhdGVDb250ZXh0IH1cIlxuICAgICAgICAgID48L25nLXRlbXBsYXRlPlxuICAgICAgICB9IEBlbHNlIHtcbiAgICAgICAgICBAaWYgKG1lc3NhZ2UudGl0bGVUZXh0KSB7XG4gICAgICAgICAgICA8ZGl2Pnt7IHQobWVzc2FnZS50aXRsZVRleHQpIH19PC9kaXY+XG4gICAgICAgICAgfVxuICAgICAgICAgIEBpZiAobWVzc2FnZS5ib2R5VGV4dCkge1xuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInRleHQtYm9keS1jb250ZW50XCI+XG4gICAgICAgICAgICAgIHt7IHQobWVzc2FnZS5ib2R5VGV4dCkgfX1cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgICAgPC9kaXY+XG4gICAgICA8YnV0dG9uXG4gICAgICAgIGNsYXNzPVwiY2xvc2UtaWNvbi1idXR0b25cIlxuICAgICAgICBbbmdDbGFzc109XCJ7IGluZm9ybWF0aW9uOiBtZXNzYWdlLnR5cGUgPT09ICdpbmZvcm1hdGlvbicgfVwiXG4gICAgICAgIChjbGljayk9XCJyZW1vdmVNZXNzYWdlKG1lc3NhZ2UpXCJcbiAgICAgICAgW2F0dHIuYXJpYS1sYWJlbF09XCJjbG9zZUJ1dHRvbkFyaWFMYWJlbFwiXG4gICAgICA+XG4gICAgICAgIDxnZHMtaWNvbi1jcm9zcy1zbWFsbFxuICAgICAgICAgIGNsYXNzPVwiY2xvc2UtaWNvblwiXG4gICAgICAgICAgKm5nZ0NvcmVFbGVtZW50XG4gICAgICAgID48L2dkcy1pY29uLWNyb3NzLXNtYWxsPlxuICAgICAgPC9idXR0b24+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9vdXRwdXQ+XG4iXX0=
@@ -5,4 +5,4 @@ export var MessageType;
5
5
  MessageType["Error"] = "error";
6
6
  MessageType["Warning"] = "warning";
7
7
  })(MessageType || (MessageType = {}));
8
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3QubW9kZWxzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyL3NyYy92LWFuZ3VsYXIvdG9hc3QvdG9hc3QubW9kZWxzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVVBLE1BQU0sQ0FBTixJQUFZLFdBS1g7QUFMRCxXQUFZLFdBQVc7SUFDckIsa0NBQW1CLENBQUE7SUFDbkIsMENBQTJCLENBQUE7SUFDM0IsOEJBQWUsQ0FBQTtJQUNmLGtDQUFtQixDQUFBO0FBQ3JCLENBQUMsRUFMVyxXQUFXLEtBQVgsV0FBVyxRQUt0QiIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBpbnRlcmZhY2UgVG9hc3RNZXNzYWdlIHtcbiAgdHlwZTogTWVzc2FnZVR5cGVcbiAgdHJhbnNsb2NvU2NvcGU6IHN0cmluZ1xuICB0aXRsZVRleHQ6IHN0cmluZ1xuICBib2R5VGV4dD86IHN0cmluZ1xuICB0aW1lb3V0PzogbnVtYmVyXG4gIHRpbWVvdXRJZD86IG51bWJlclxuICB0aW1lb3V0U3RhcnRUaW1lPzogbnVtYmVyXG59XG5cbmV4cG9ydCBlbnVtIE1lc3NhZ2VUeXBlIHtcbiAgU3VjY2VzcyA9ICdzdWNjZXNzJyxcbiAgSW5mb3JtYXRpb24gPSAnaW5mb3JtYXRpb24nLFxuICBFcnJvciA9ICdlcnJvcicsXG4gIFdhcm5pbmcgPSAnd2FybmluZycsXG59XG4iXX0=
8
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3QubW9kZWxzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyL3NyYy92LWFuZ3VsYXIvdG9hc3QvdG9hc3QubW9kZWxzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWNBLE1BQU0sQ0FBTixJQUFZLFdBS1g7QUFMRCxXQUFZLFdBQVc7SUFDckIsa0NBQW1CLENBQUE7SUFDbkIsMENBQTJCLENBQUE7SUFDM0IsOEJBQWUsQ0FBQTtJQUNmLGtDQUFtQixDQUFBO0FBQ3JCLENBQUMsRUFMVyxXQUFXLEtBQVgsV0FBVyxRQUt0QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFRlbXBsYXRlUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSdcblxuZXhwb3J0IGludGVyZmFjZSBUb2FzdE1lc3NhZ2Uge1xuICB0eXBlOiBNZXNzYWdlVHlwZSB8ICdzdWNjZXNzJyB8ICdpbmZvcm1hdGlvbicgfCAnZXJyb3InIHwgJ3dhcm5pbmcnXG4gIHRyYW5zbG9jb1Njb3BlPzogc3RyaW5nXG4gIHRpdGxlVGV4dD86IHN0cmluZ1xuICBib2R5VGV4dD86IHN0cmluZ1xuICB0ZW1wbGF0ZT86IFRlbXBsYXRlUmVmPGFueT5cbiAgdGVtcGxhdGVDb250ZXh0PzogYW55XG4gIHRpbWVvdXQ/OiBudW1iZXJcbiAgdGltZW91dElkPzogbnVtYmVyXG4gIHRpbWVvdXRTdGFydFRpbWU/OiBudW1iZXJcbn1cblxuZXhwb3J0IGVudW0gTWVzc2FnZVR5cGUge1xuICBTdWNjZXNzID0gJ3N1Y2Nlc3MnLFxuICBJbmZvcm1hdGlvbiA9ICdpbmZvcm1hdGlvbicsXG4gIEVycm9yID0gJ2Vycm9yJyxcbiAgV2FybmluZyA9ICd3YXJuaW5nJyxcbn1cbiJdfQ==
@@ -244,6 +244,14 @@ class NggvDropdownListComponent {
244
244
  this.updateState(option, event);
245
245
  }
246
246
  return false;
247
+ case 'Tab': // trigger dropdown to close (for typeahead)
248
+ event.preventDefault();
249
+ event.stopPropagation();
250
+ if (this.expanded) {
251
+ this.setExpanded(false);
252
+ this.closed.emit();
253
+ }
254
+ return false;
247
255
  }
248
256
  return true;
249
257
  }
@@ -269,7 +277,7 @@ class NggvDropdownListComponent {
269
277
  this.activeIndex = 0;
270
278
  option = this._flattenedOptions[this.activeIndex];
271
279
  this.state = option;
272
- this.scrollToResult(option);
280
+ this.scrollToResult(option, true);
273
281
  break;
274
282
  case 'ArrowUp': // Move up one step to the previous option
275
283
  if (this.activeIndex > 0)
@@ -278,7 +286,7 @@ class NggvDropdownListComponent {
278
286
  this.activeIndex = this._flattenedOptions.length - 1;
279
287
  option = this._flattenedOptions[this.activeIndex];
280
288
  this.state = option;
281
- this.scrollToResult(option);
289
+ this.scrollToResult(option, true);
282
290
  break;
283
291
  case 'ArrowDown': // Move down one step to the next option
284
292
  if (this._flattenedOptions.length > this.activeIndex + 1)
@@ -287,13 +295,13 @@ class NggvDropdownListComponent {
287
295
  this.activeIndex = 0;
288
296
  option = this._flattenedOptions[this.activeIndex];
289
297
  this.state = option;
290
- this.scrollToResult(option);
298
+ this.scrollToResult(option, true);
291
299
  break;
292
300
  case 'End': // Move to the last options
293
301
  this.activeIndex = this._flattenedOptions.length - 1;
294
302
  option = this._flattenedOptions[this.activeIndex];
295
303
  this.state = option;
296
- this.scrollToResult(option);
304
+ this.scrollToResult(option, true);
297
305
  break;
298
306
  }
299
307
  }
@@ -313,7 +321,7 @@ class NggvDropdownListComponent {
313
321
  * Scrolls focused result into view with a specified offset.
314
322
  * @param key the result index which to scroll to.
315
323
  */
316
- scrollToResult(option) {
324
+ scrollToResult(option, focusElement) {
317
325
  if (!this.optionRefs || !option)
318
326
  return;
319
327
  const optionRef = this.optionRefs.find((li) => li.nativeElement.id === this.id + '-option-' + option.key);
@@ -327,8 +335,12 @@ class NggvDropdownListComponent {
327
335
  block: 'nearest',
328
336
  });
329
337
  delta -= window.scrollY || document.documentElement.scrollTop;
330
- if (delta)
338
+ if (delta) {
331
339
  window.scrollBy(0, delta > 0 ? -offset : offset);
340
+ }
341
+ if (focusElement) {
342
+ optionRef.nativeElement.focus();
343
+ }
332
344
  }, 0);
333
345
  }
334
346
  }
@@ -561,11 +573,11 @@ class NggvDropdownComponent extends NggvBaseControlValueAccessorComponent {
561
573
  return !('options' in option);
562
574
  }
563
575
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NggvDropdownComponent, deps: [{ token: i1$1.NgControl, optional: true, self: true }, { token: TRANSLOCO_SCOPE, optional: true }, { token: i0.ChangeDetectorRef }, { token: i2.DropdownUtils }], target: i0.ɵɵFactoryTarget.Component }); }
564
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: NggvDropdownComponent, selector: "nggv-dropdown", inputs: { thook: "thook", placeholder: "placeholder", ariaLabel: "ariaLabel", options: "options", scrollOffset: "scrollOffset", allowControlNullishOption: "allowControlNullishOption", textToHighlight: "textToHighlight", selectOnSingleOption: "selectOnSingleOption" }, outputs: { expandedChange: "expandedChange" }, host: { listeners: { "keyup": "onKeyUp($event)" }, properties: { "attr.data-thook": "this.thook" } }, queries: [{ propertyName: "selectedContentTpl", first: true, predicate: ["selectedTpl"], descendants: true, read: TemplateRef }, { propertyName: "optionContentTpl", first: true, predicate: ["optionTpl"], descendants: true, read: TemplateRef }, { propertyName: "groupLabelTpl", first: true, predicate: ["groupLabelTpl"], descendants: true, read: TemplateRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<!-- LABEL -->\n<ng-container *transloco=\"let t; read: scope\">\n <label\n [id]=\"id + '-label'\"\n class=\"gds-field-label hide-if-empty\"\n [attr.for]=\"id + '-toggle'\"\n *ngIf=\"labelContentTpl || basicLabelContentTpl || label\"\n >\n <ng-template\n *ngTemplateOutlet=\"labelContentTpl || basicLabelContentTpl\"\n ></ng-template>\n <ng-template #basicLabelContentTpl>\n <!-- to trigger css:empty if no label was added -->\n <ng-container *ngIf=\"label\">\n {{ label }}\n <span\n *ngIf=\"optional === true || (required !== true && optional !== false)\"\n class=\"gds-field-label--optional\"\n >\n ({{ t('label.optional') }})\n </span>\n </ng-container>\n </ng-template>\n </label>\n\n <!-- DESCRIPTION -->\n <div class=\"description\" *ngIf=\"description\">{{ description }}</div>\n\n <!-- LOCKED INPUT -->\n <ng-container *ngIf=\"locked\">\n <div\n [id]=\"id + '-input'\"\n class=\"nggv-field--locked\"\n [attr.name]=\"name\"\n [attr.value]=\"state\"\n [attr.role]=\"role\"\n [attr.aria-labelledby]=\"id + '-label ' + id + '-input'\"\n >\n <span *ngIf=\"!state\" class=\"unset-state\">-</span>\n <ng-container *ngIf=\"state\">\n <ng-template\n *ngTemplateOutlet=\"\n selectedContentTpl || defaultSelectedContentTpl;\n context: { $implicit: state }\n \"\n >\n </ng-template>\n </ng-container>\n </div>\n </ng-container>\n\n <!-- INPUT -->\n <ng-container *ngIf=\"!locked\">\n <div class=\"gds-input-wrapper\">\n <div #input [id]=\"id + '-input'\" class=\"dropdown\">\n <button\n [id]=\"id + '-toggle'\"\n [disabled]=\"disabled\"\n type=\"button\"\n class=\"nggv-field-dropdown__label toggle\"\n [class.nggv-field--error]=\"invalid\"\n aria-haspopup=\"listbox\"\n [attr.data-thook]=\"thook + '-toggle'\"\n [attr.aria-expanded]=\"expanded\"\n [attr.aria-labelledby]=\"\n ariaLabel ? null : id + '-label ' + id + '-toggle'\n \"\n [attr.aria-label]=\"ariaLabel || null\"\n (click)=\"toggleDropdown()\"\n >\n <span>\n <ng-template\n *ngTemplateOutlet=\"\n selectedContentTpl || defaultSelectedContentTpl;\n context: { $implicit: state }\n \"\n >\n </ng-template>\n </span>\n </button>\n <nggv-dropdown-list\n #dropDownList\n [options]=\"options\"\n [scrollOffset]=\"scrollOffset\"\n [state]=\"state\"\n [expanded]=\"expanded\"\n [optionContentTpl]=\"optionContentTpl\"\n [groupLabelTpl]=\"groupLabelTpl\"\n [textToHighlight]=\"textToHighlight\"\n (closed)=\"setExpanded(false)\"\n (selectedValueChanged)=\"onSelectChange($event)\"\n >\n </nggv-dropdown-list>\n </div>\n <!-- ERRORS -->\n <div class=\"gds-form-item__footer error-wrapper\">\n <span\n class=\"form-info form-info--error\"\n [attr.for]=\"id + '-input'\"\n *ngIf=\"invalid && (error || ngControl?.invalid)\"\n >\n <span class=\"error-icon\">\n <gds-icon-triangle-exclamation\n width=\"16\"\n height=\"16\"\n [solid]=\"true\"\n *nggCoreElement\n ></gds-icon-triangle-exclamation>\n </span>\n <span\n *ngIf=\"error; else errorsRef\"\n [attr.data-thook]=\"thook + '-errorlabel'\"\n >{{ error }}</span\n >\n </span>\n <ng-template #errorsRef>\n <span\n *ngIf=\"firstError as error\"\n [attr.data-thook]=\"thook + '-errorlabel'\"\n >\n {{ t('error.field' + error?.code, error?.params) }}\n </span>\n </ng-template>\n </div>\n <!-- CHILDREN -->\n <ng-content></ng-content>\n </div>\n </ng-container>\n\n <ng-template #defaultSelectedContentTpl let-state>\n <!-- eslint-disable-next-line @angular-eslint/template/eqeqeq -->\n {{ state?.key != null && state?.label ? t(state.label) : placeholder }}\n </ng-template>\n</ng-container>\n", styles: [":host{--sg-border-radius: .25rem;--sg-border-width: 1px;--sg-border-color: #868686;--text-primary-color: #333;--sg-form-control-bg: #fff;--grey-000: hsl(0 0% 100%);--grey-100: hsl(0, 0%, 97%);--grey-200: hsl(0, 0%, 91%);--grey-300: hsl(0, 0%, 87%);--grey-400: hsl(0, 0%, 81%);--grey-500: hsl(0, 0%, 68%);--grey-600: hsl(0, 0%, 53%);--grey-700: hsl(0, 0%, 29%);--grey-800: hsl(0, 0%, 20%);--grey-900: hsl(0, 0%, 10%);--grey-1000: hsl(0 0% 0%);display:flex;flex-direction:column;max-width:100%;position:relative;width:100%;z-index:0;position:initial}:host label{display:block;font-weight:500;line-height:1.25rem;width:100%}:host label+.gds-input-wrapper,:host label+.nggv-field--locked{margin-top:.5rem}:host .description{font-size:.875rem;margin-bottom:.5rem;line-height:1.25rem;width:100%}:host:not(:last-child){margin-bottom:1.5rem}:host .gds-form-item__header{display:flex}:host .gds-form-item__header .form-info{font-weight:400}:host .gds-form-item__header button.icon.small{margin-top:-.5rem;margin-right:-.5rem}:host .gds-form-item__labels{flex:1;margin-bottom:.5rem}:host .gds-form-item__labels .form-info{margin-bottom:0}:host .gds-form-item__labels .form-info a:link:not(.button,[aria-disabled]){color:#0062bc}:host .gds-form-item__labels>*{width:100%;display:block}:host .gds-form-item__expandable-info{overflow:hidden;font-size:.875rem;line-height:1.25rem;transition:height .3s cubic-bezier(.23,1,.32,1)}:host .gds-form-item__expandable-info>div{padding-bottom:.5rem}:host .gds-form-item__backdrop{position:absolute;inset:0;background:var(--gds-ref-pallet-base100);border-radius:2px;z-index:-1;margin:-1rem;opacity:0;transition:all .3s cubic-bezier(.23,1,.32,1);border:1px solid transparent}@media (prefers-reduced-motion: reduce){:host .gds-form-item__backdrop{transition:none}}:host:has([aria-expanded=true]) .gds-form-item__backdrop{opacity:1;border-radius:.25rem;border-color:var(--gds-ref-pallet-base600)}:host .gds-form-item__footer:not(:empty){margin-top:.5rem;display:flex;column-gap:.5rem}:host .gds-form-item__footer:not(:empty)>span,:host .gds-form-item__footer:not(:empty)>.form-info{font-weight:500;line-height:1.125}:host:not(:last-child){margin-bottom:unset}:host .gds-field-label--optional{font-weight:400}:host button{background-color:transparent;border:0;cursor:pointer;font-family:inherit;padding:0;padding:.75rem 1rem;border-radius:var(--sg-border-radius);border:solid var(--sg-border-width) var(--sg-border-color);--border-color: var(--grey-600);--sg-border-color: var(--grey-600);background:var(--sg-form-control-bg);color:var(--text-primary-color);min-height:2.75rem;display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;max-width:100%;font-size:1rem;font-weight:400;line-height:1.125;text-align:left;width:100%}:host button:focus{outline-color:var(--gds-sys-color-focus-outline);outline-style:solid;outline-width:.125rem;outline-offset:.125rem}@media (max-width: 35.98em){:host button{min-width:100%}}:host button>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host button:after{margin-left:.5rem;margin-right:.5rem;border-bottom:solid 2px var(--text-primary-color);border-left:solid 2px var(--text-primary-color);content:\"\";display:block;height:.5rem;width:.5rem;position:relative;top:-.15rem;transform:translate(75%) rotate3d(0,0,1,-45deg) scaleZ(-1);transition:transform .3s ease-in;flex-shrink:0}:host button[aria-expanded=true]:after{transform:translate(75%,6px) rotate3d(0,0,1,-45deg) scale3d(-1,-1,1)}:host button:hover:after{border-color:currentColor}:host button:disabled{--background: var(--grey-500)}:host button span{width:100%;white-space:nowrap;display:block;text-overflow:ellipsis}:host button.small{font-size:.875rem}:host button:hover{background:#e7e7e7}:host button:active{background:inherit;color:inherit;border-color:inherit}:host button:disabled,:host button.disabled{--text-primary-color: var(--grey-600);background:var(--grey-300);color:var(--grey-600);cursor:not-allowed}:host button.nggv-field--error{border-bottom:2px solid #9f000a}:host .gds-form-item__footer .form-info{font-weight:500;font-size:.875rem}:host .gds-form-item__footer .form-info--error{display:flex;align-items:flex-start;gap:.5em;color:#9f000a}:host .gds-form-item__footer .form-info--error .error-icon{align-items:center}:host .dropdown{width:100%;position:relative}:host .dropdown nggv-dropdown-list{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4$1.NggCoreElementDirective, selector: "[nggCoreElement]" }, { kind: "directive", type: i4.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: NggvDropdownListComponent, selector: "nggv-dropdown-list", inputs: ["expanded", "state", "scrollOffset", "optionContentTpl", "groupLabelTpl", "id", "thook", "options", "textToHighlight", "onlyEmitDistinctChanges"], outputs: ["selectedValueChanged", "closed"] }] }); }
576
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: NggvDropdownComponent, selector: "nggv-dropdown", inputs: { thook: "thook", placeholder: "placeholder", ariaLabel: "ariaLabel", options: "options", scrollOffset: "scrollOffset", allowControlNullishOption: "allowControlNullishOption", textToHighlight: "textToHighlight", selectOnSingleOption: "selectOnSingleOption" }, outputs: { expandedChange: "expandedChange" }, host: { listeners: { "keyup": "onKeyUp($event)" }, properties: { "attr.data-thook": "this.thook" } }, queries: [{ propertyName: "selectedContentTpl", first: true, predicate: ["selectedTpl"], descendants: true, read: TemplateRef }, { propertyName: "optionContentTpl", first: true, predicate: ["optionTpl"], descendants: true, read: TemplateRef }, { propertyName: "groupLabelTpl", first: true, predicate: ["groupLabelTpl"], descendants: true, read: TemplateRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<!-- LABEL -->\n<ng-container *transloco=\"let t; read: scope\">\n <label\n [id]=\"id + '-label'\"\n class=\"gds-field-label hide-if-empty\"\n [attr.for]=\"id + '-toggle'\"\n *ngIf=\"labelContentTpl || label\"\n >\n <ng-template\n *ngTemplateOutlet=\"labelContentTpl || basicLabelContentTpl\"\n ></ng-template>\n <ng-template #basicLabelContentTpl>\n <!-- to trigger css:empty if no label was added -->\n <ng-container *ngIf=\"label\">\n {{ label }}\n <span\n *ngIf=\"optional === true || (required !== true && optional !== false)\"\n class=\"gds-field-label--optional\"\n >\n ({{ t('label.optional') }})\n </span>\n </ng-container>\n </ng-template>\n </label>\n\n <!-- DESCRIPTION -->\n <div class=\"description\" *ngIf=\"description\">{{ description }}</div>\n\n <!-- LOCKED INPUT -->\n <ng-container *ngIf=\"locked\">\n <div\n [id]=\"id + '-input'\"\n class=\"nggv-field--locked\"\n [attr.name]=\"name\"\n [attr.value]=\"state\"\n [attr.role]=\"role\"\n [attr.aria-labelledby]=\"id + '-label ' + id + '-input'\"\n >\n <span *ngIf=\"!state\" class=\"unset-state\">-</span>\n <ng-container *ngIf=\"state\">\n <ng-template\n *ngTemplateOutlet=\"\n selectedContentTpl || defaultSelectedContentTpl;\n context: { $implicit: state }\n \"\n >\n </ng-template>\n </ng-container>\n </div>\n </ng-container>\n\n <!-- INPUT -->\n <ng-container *ngIf=\"!locked\">\n <div class=\"gds-input-wrapper\">\n <div #input [id]=\"id + '-input'\" class=\"dropdown\">\n <button\n [id]=\"id + '-toggle'\"\n [disabled]=\"disabled\"\n type=\"button\"\n class=\"nggv-field-dropdown__label toggle\"\n [class.nggv-field--error]=\"invalid\"\n role=\"combobox\"\n aria-owns=\"listbox\"\n aria-haspopup=\"listbox\"\n aria-controls=\"listbox\"\n [attr.data-thook]=\"thook + '-toggle'\"\n [attr.aria-expanded]=\"expanded\"\n [attr.aria-labelledby]=\"\n ariaLabel ? null : id + '-label ' + id + '-toggle'\n \"\n [attr.aria-label]=\"ariaLabel || null\"\n (click)=\"toggleDropdown()\"\n >\n <span>\n <ng-template\n *ngTemplateOutlet=\"\n selectedContentTpl || defaultSelectedContentTpl;\n context: { $implicit: state }\n \"\n >\n </ng-template>\n </span>\n </button>\n <nggv-dropdown-list\n #dropDownList\n [options]=\"options\"\n [scrollOffset]=\"scrollOffset\"\n [state]=\"state\"\n [expanded]=\"expanded\"\n [optionContentTpl]=\"optionContentTpl\"\n [groupLabelTpl]=\"groupLabelTpl\"\n [textToHighlight]=\"textToHighlight\"\n (closed)=\"setExpanded(false)\"\n (selectedValueChanged)=\"onSelectChange($event)\"\n >\n </nggv-dropdown-list>\n </div>\n <!-- ERRORS -->\n <div class=\"gds-form-item__footer error-wrapper\">\n <span\n class=\"form-info form-info--error\"\n [attr.for]=\"id + '-input'\"\n *ngIf=\"invalid && (error || ngControl?.invalid)\"\n >\n <span class=\"error-icon\">\n <gds-icon-triangle-exclamation\n width=\"16\"\n height=\"16\"\n [solid]=\"true\"\n *nggCoreElement\n ></gds-icon-triangle-exclamation>\n </span>\n <span\n *ngIf=\"error; else errorsRef\"\n [attr.data-thook]=\"thook + '-errorlabel'\"\n >{{ error }}</span\n >\n </span>\n <ng-template #errorsRef>\n <span\n *ngIf=\"firstError as error\"\n [attr.data-thook]=\"thook + '-errorlabel'\"\n >\n {{ t('error.field' + error?.code, error?.params) }}\n </span>\n </ng-template>\n </div>\n <!-- CHILDREN -->\n <ng-content></ng-content>\n </div>\n </ng-container>\n\n <ng-template #defaultSelectedContentTpl let-state>\n <!-- eslint-disable-next-line @angular-eslint/template/eqeqeq -->\n {{ state?.key != null && state?.label ? t(state.label) : placeholder }}\n </ng-template>\n</ng-container>\n", styles: [":host{--sg-border-radius: .25rem;--sg-border-width: 1px;--sg-border-color: #868686;--text-primary-color: #333;--sg-form-control-bg: #fff;--grey-000: hsl(0 0% 100%);--grey-100: hsl(0, 0%, 97%);--grey-200: hsl(0, 0%, 91%);--grey-300: hsl(0, 0%, 87%);--grey-400: hsl(0, 0%, 81%);--grey-500: hsl(0, 0%, 68%);--grey-600: hsl(0, 0%, 53%);--grey-700: hsl(0, 0%, 29%);--grey-800: hsl(0, 0%, 20%);--grey-900: hsl(0, 0%, 10%);--grey-1000: hsl(0 0% 0%);display:flex;flex-direction:column;max-width:100%;position:relative;width:100%;z-index:0;position:initial}:host label{display:block;font-weight:500;line-height:1.25rem;width:100%}:host label+.gds-input-wrapper,:host label+.nggv-field--locked{margin-top:.5rem}:host .description{font-size:.875rem;margin-bottom:.5rem;line-height:1.25rem;width:100%}:host:not(:last-child){margin-bottom:1.5rem}:host .gds-form-item__header{display:flex}:host .gds-form-item__header .form-info{font-weight:400}:host .gds-form-item__header button.icon.small{margin-top:-.5rem;margin-right:-.5rem}:host .gds-form-item__labels{flex:1;margin-bottom:.5rem}:host .gds-form-item__labels .form-info{margin-bottom:0}:host .gds-form-item__labels .form-info a:link:not(.button,[aria-disabled]){color:#0062bc}:host .gds-form-item__labels>*{width:100%;display:block}:host .gds-form-item__expandable-info{overflow:hidden;font-size:.875rem;line-height:1.25rem;transition:height .3s cubic-bezier(.23,1,.32,1)}:host .gds-form-item__expandable-info>div{padding-bottom:.5rem}:host .gds-form-item__backdrop{position:absolute;inset:0;background:var(--gds-ref-pallet-base100);border-radius:2px;z-index:-1;margin:-1rem;opacity:0;transition:all .3s cubic-bezier(.23,1,.32,1);border:1px solid transparent}@media (prefers-reduced-motion: reduce){:host .gds-form-item__backdrop{transition:none}}:host:has([aria-expanded=true]) .gds-form-item__backdrop{opacity:1;border-radius:.25rem;border-color:var(--gds-ref-pallet-base600)}:host .gds-form-item__footer:not(:empty){margin-top:.5rem;display:flex;column-gap:.5rem}:host .gds-form-item__footer:not(:empty)>span,:host .gds-form-item__footer:not(:empty)>.form-info{font-weight:500;line-height:1.125}:host:not(:last-child){margin-bottom:unset}:host .gds-field-label--optional{font-weight:400}:host button{background-color:transparent;border:0;cursor:pointer;font-family:inherit;padding:0;padding:.75rem 1rem;border-radius:var(--sg-border-radius);border:solid var(--sg-border-width) var(--sg-border-color);--border-color: var(--grey-600);--sg-border-color: var(--grey-600);background:var(--sg-form-control-bg);color:var(--text-primary-color);min-height:2.75rem;display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;max-width:100%;font-size:1rem;font-weight:400;line-height:1.125;text-align:left;width:100%}:host button:focus{outline-color:var(--gds-sys-color-focus-outline);outline-style:solid;outline-width:.125rem;outline-offset:.125rem}@media (max-width: 35.98em){:host button{min-width:100%}}:host button>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host button:after{margin-left:.5rem;margin-right:.5rem;border-bottom:solid 2px var(--text-primary-color);border-left:solid 2px var(--text-primary-color);content:\"\";display:block;height:.5rem;width:.5rem;position:relative;top:-.15rem;transform:translate(75%) rotate3d(0,0,1,-45deg) scaleZ(-1);transition:transform .3s ease-in;flex-shrink:0}:host button[aria-expanded=true]:after{transform:translate(75%,6px) rotate3d(0,0,1,-45deg) scale3d(-1,-1,1)}:host button:hover:after{border-color:currentColor}:host button:disabled{--background: var(--grey-500)}:host button span{width:100%;white-space:nowrap;display:block;text-overflow:ellipsis}:host button.small{font-size:.875rem}:host button:hover{background:#e7e7e7}:host button:active{background:inherit;color:inherit;border-color:inherit}:host button:disabled,:host button.disabled{--text-primary-color: var(--grey-600);background:var(--grey-300);color:var(--grey-600);cursor:not-allowed}:host button.nggv-field--error{border-bottom:2px solid #9f000a}:host .gds-form-item__footer .form-info{font-weight:500;font-size:.875rem}:host .gds-form-item__footer .form-info--error{display:flex;align-items:flex-start;gap:.5em;color:#9f000a}:host .gds-form-item__footer .form-info--error .error-icon{align-items:center}:host .dropdown{width:100%;position:relative}:host .dropdown nggv-dropdown-list{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4$1.NggCoreElementDirective, selector: "[nggCoreElement]" }, { kind: "directive", type: i4.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: NggvDropdownListComponent, selector: "nggv-dropdown-list", inputs: ["expanded", "state", "scrollOffset", "optionContentTpl", "groupLabelTpl", "id", "thook", "options", "textToHighlight", "onlyEmitDistinctChanges"], outputs: ["selectedValueChanged", "closed"] }] }); }
565
577
  }
566
578
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NggvDropdownComponent, decorators: [{
567
579
  type: Component,
568
- args: [{ selector: 'nggv-dropdown', template: "<!-- LABEL -->\n<ng-container *transloco=\"let t; read: scope\">\n <label\n [id]=\"id + '-label'\"\n class=\"gds-field-label hide-if-empty\"\n [attr.for]=\"id + '-toggle'\"\n *ngIf=\"labelContentTpl || basicLabelContentTpl || label\"\n >\n <ng-template\n *ngTemplateOutlet=\"labelContentTpl || basicLabelContentTpl\"\n ></ng-template>\n <ng-template #basicLabelContentTpl>\n <!-- to trigger css:empty if no label was added -->\n <ng-container *ngIf=\"label\">\n {{ label }}\n <span\n *ngIf=\"optional === true || (required !== true && optional !== false)\"\n class=\"gds-field-label--optional\"\n >\n ({{ t('label.optional') }})\n </span>\n </ng-container>\n </ng-template>\n </label>\n\n <!-- DESCRIPTION -->\n <div class=\"description\" *ngIf=\"description\">{{ description }}</div>\n\n <!-- LOCKED INPUT -->\n <ng-container *ngIf=\"locked\">\n <div\n [id]=\"id + '-input'\"\n class=\"nggv-field--locked\"\n [attr.name]=\"name\"\n [attr.value]=\"state\"\n [attr.role]=\"role\"\n [attr.aria-labelledby]=\"id + '-label ' + id + '-input'\"\n >\n <span *ngIf=\"!state\" class=\"unset-state\">-</span>\n <ng-container *ngIf=\"state\">\n <ng-template\n *ngTemplateOutlet=\"\n selectedContentTpl || defaultSelectedContentTpl;\n context: { $implicit: state }\n \"\n >\n </ng-template>\n </ng-container>\n </div>\n </ng-container>\n\n <!-- INPUT -->\n <ng-container *ngIf=\"!locked\">\n <div class=\"gds-input-wrapper\">\n <div #input [id]=\"id + '-input'\" class=\"dropdown\">\n <button\n [id]=\"id + '-toggle'\"\n [disabled]=\"disabled\"\n type=\"button\"\n class=\"nggv-field-dropdown__label toggle\"\n [class.nggv-field--error]=\"invalid\"\n aria-haspopup=\"listbox\"\n [attr.data-thook]=\"thook + '-toggle'\"\n [attr.aria-expanded]=\"expanded\"\n [attr.aria-labelledby]=\"\n ariaLabel ? null : id + '-label ' + id + '-toggle'\n \"\n [attr.aria-label]=\"ariaLabel || null\"\n (click)=\"toggleDropdown()\"\n >\n <span>\n <ng-template\n *ngTemplateOutlet=\"\n selectedContentTpl || defaultSelectedContentTpl;\n context: { $implicit: state }\n \"\n >\n </ng-template>\n </span>\n </button>\n <nggv-dropdown-list\n #dropDownList\n [options]=\"options\"\n [scrollOffset]=\"scrollOffset\"\n [state]=\"state\"\n [expanded]=\"expanded\"\n [optionContentTpl]=\"optionContentTpl\"\n [groupLabelTpl]=\"groupLabelTpl\"\n [textToHighlight]=\"textToHighlight\"\n (closed)=\"setExpanded(false)\"\n (selectedValueChanged)=\"onSelectChange($event)\"\n >\n </nggv-dropdown-list>\n </div>\n <!-- ERRORS -->\n <div class=\"gds-form-item__footer error-wrapper\">\n <span\n class=\"form-info form-info--error\"\n [attr.for]=\"id + '-input'\"\n *ngIf=\"invalid && (error || ngControl?.invalid)\"\n >\n <span class=\"error-icon\">\n <gds-icon-triangle-exclamation\n width=\"16\"\n height=\"16\"\n [solid]=\"true\"\n *nggCoreElement\n ></gds-icon-triangle-exclamation>\n </span>\n <span\n *ngIf=\"error; else errorsRef\"\n [attr.data-thook]=\"thook + '-errorlabel'\"\n >{{ error }}</span\n >\n </span>\n <ng-template #errorsRef>\n <span\n *ngIf=\"firstError as error\"\n [attr.data-thook]=\"thook + '-errorlabel'\"\n >\n {{ t('error.field' + error?.code, error?.params) }}\n </span>\n </ng-template>\n </div>\n <!-- CHILDREN -->\n <ng-content></ng-content>\n </div>\n </ng-container>\n\n <ng-template #defaultSelectedContentTpl let-state>\n <!-- eslint-disable-next-line @angular-eslint/template/eqeqeq -->\n {{ state?.key != null && state?.label ? t(state.label) : placeholder }}\n </ng-template>\n</ng-container>\n", styles: [":host{--sg-border-radius: .25rem;--sg-border-width: 1px;--sg-border-color: #868686;--text-primary-color: #333;--sg-form-control-bg: #fff;--grey-000: hsl(0 0% 100%);--grey-100: hsl(0, 0%, 97%);--grey-200: hsl(0, 0%, 91%);--grey-300: hsl(0, 0%, 87%);--grey-400: hsl(0, 0%, 81%);--grey-500: hsl(0, 0%, 68%);--grey-600: hsl(0, 0%, 53%);--grey-700: hsl(0, 0%, 29%);--grey-800: hsl(0, 0%, 20%);--grey-900: hsl(0, 0%, 10%);--grey-1000: hsl(0 0% 0%);display:flex;flex-direction:column;max-width:100%;position:relative;width:100%;z-index:0;position:initial}:host label{display:block;font-weight:500;line-height:1.25rem;width:100%}:host label+.gds-input-wrapper,:host label+.nggv-field--locked{margin-top:.5rem}:host .description{font-size:.875rem;margin-bottom:.5rem;line-height:1.25rem;width:100%}:host:not(:last-child){margin-bottom:1.5rem}:host .gds-form-item__header{display:flex}:host .gds-form-item__header .form-info{font-weight:400}:host .gds-form-item__header button.icon.small{margin-top:-.5rem;margin-right:-.5rem}:host .gds-form-item__labels{flex:1;margin-bottom:.5rem}:host .gds-form-item__labels .form-info{margin-bottom:0}:host .gds-form-item__labels .form-info a:link:not(.button,[aria-disabled]){color:#0062bc}:host .gds-form-item__labels>*{width:100%;display:block}:host .gds-form-item__expandable-info{overflow:hidden;font-size:.875rem;line-height:1.25rem;transition:height .3s cubic-bezier(.23,1,.32,1)}:host .gds-form-item__expandable-info>div{padding-bottom:.5rem}:host .gds-form-item__backdrop{position:absolute;inset:0;background:var(--gds-ref-pallet-base100);border-radius:2px;z-index:-1;margin:-1rem;opacity:0;transition:all .3s cubic-bezier(.23,1,.32,1);border:1px solid transparent}@media (prefers-reduced-motion: reduce){:host .gds-form-item__backdrop{transition:none}}:host:has([aria-expanded=true]) .gds-form-item__backdrop{opacity:1;border-radius:.25rem;border-color:var(--gds-ref-pallet-base600)}:host .gds-form-item__footer:not(:empty){margin-top:.5rem;display:flex;column-gap:.5rem}:host .gds-form-item__footer:not(:empty)>span,:host .gds-form-item__footer:not(:empty)>.form-info{font-weight:500;line-height:1.125}:host:not(:last-child){margin-bottom:unset}:host .gds-field-label--optional{font-weight:400}:host button{background-color:transparent;border:0;cursor:pointer;font-family:inherit;padding:0;padding:.75rem 1rem;border-radius:var(--sg-border-radius);border:solid var(--sg-border-width) var(--sg-border-color);--border-color: var(--grey-600);--sg-border-color: var(--grey-600);background:var(--sg-form-control-bg);color:var(--text-primary-color);min-height:2.75rem;display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;max-width:100%;font-size:1rem;font-weight:400;line-height:1.125;text-align:left;width:100%}:host button:focus{outline-color:var(--gds-sys-color-focus-outline);outline-style:solid;outline-width:.125rem;outline-offset:.125rem}@media (max-width: 35.98em){:host button{min-width:100%}}:host button>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host button:after{margin-left:.5rem;margin-right:.5rem;border-bottom:solid 2px var(--text-primary-color);border-left:solid 2px var(--text-primary-color);content:\"\";display:block;height:.5rem;width:.5rem;position:relative;top:-.15rem;transform:translate(75%) rotate3d(0,0,1,-45deg) scaleZ(-1);transition:transform .3s ease-in;flex-shrink:0}:host button[aria-expanded=true]:after{transform:translate(75%,6px) rotate3d(0,0,1,-45deg) scale3d(-1,-1,1)}:host button:hover:after{border-color:currentColor}:host button:disabled{--background: var(--grey-500)}:host button span{width:100%;white-space:nowrap;display:block;text-overflow:ellipsis}:host button.small{font-size:.875rem}:host button:hover{background:#e7e7e7}:host button:active{background:inherit;color:inherit;border-color:inherit}:host button:disabled,:host button.disabled{--text-primary-color: var(--grey-600);background:var(--grey-300);color:var(--grey-600);cursor:not-allowed}:host button.nggv-field--error{border-bottom:2px solid #9f000a}:host .gds-form-item__footer .form-info{font-weight:500;font-size:.875rem}:host .gds-form-item__footer .form-info--error{display:flex;align-items:flex-start;gap:.5em;color:#9f000a}:host .gds-form-item__footer .form-info--error .error-icon{align-items:center}:host .dropdown{width:100%;position:relative}:host .dropdown nggv-dropdown-list{width:100%}\n"] }]
580
+ args: [{ selector: 'nggv-dropdown', template: "<!-- LABEL -->\n<ng-container *transloco=\"let t; read: scope\">\n <label\n [id]=\"id + '-label'\"\n class=\"gds-field-label hide-if-empty\"\n [attr.for]=\"id + '-toggle'\"\n *ngIf=\"labelContentTpl || label\"\n >\n <ng-template\n *ngTemplateOutlet=\"labelContentTpl || basicLabelContentTpl\"\n ></ng-template>\n <ng-template #basicLabelContentTpl>\n <!-- to trigger css:empty if no label was added -->\n <ng-container *ngIf=\"label\">\n {{ label }}\n <span\n *ngIf=\"optional === true || (required !== true && optional !== false)\"\n class=\"gds-field-label--optional\"\n >\n ({{ t('label.optional') }})\n </span>\n </ng-container>\n </ng-template>\n </label>\n\n <!-- DESCRIPTION -->\n <div class=\"description\" *ngIf=\"description\">{{ description }}</div>\n\n <!-- LOCKED INPUT -->\n <ng-container *ngIf=\"locked\">\n <div\n [id]=\"id + '-input'\"\n class=\"nggv-field--locked\"\n [attr.name]=\"name\"\n [attr.value]=\"state\"\n [attr.role]=\"role\"\n [attr.aria-labelledby]=\"id + '-label ' + id + '-input'\"\n >\n <span *ngIf=\"!state\" class=\"unset-state\">-</span>\n <ng-container *ngIf=\"state\">\n <ng-template\n *ngTemplateOutlet=\"\n selectedContentTpl || defaultSelectedContentTpl;\n context: { $implicit: state }\n \"\n >\n </ng-template>\n </ng-container>\n </div>\n </ng-container>\n\n <!-- INPUT -->\n <ng-container *ngIf=\"!locked\">\n <div class=\"gds-input-wrapper\">\n <div #input [id]=\"id + '-input'\" class=\"dropdown\">\n <button\n [id]=\"id + '-toggle'\"\n [disabled]=\"disabled\"\n type=\"button\"\n class=\"nggv-field-dropdown__label toggle\"\n [class.nggv-field--error]=\"invalid\"\n role=\"combobox\"\n aria-owns=\"listbox\"\n aria-haspopup=\"listbox\"\n aria-controls=\"listbox\"\n [attr.data-thook]=\"thook + '-toggle'\"\n [attr.aria-expanded]=\"expanded\"\n [attr.aria-labelledby]=\"\n ariaLabel ? null : id + '-label ' + id + '-toggle'\n \"\n [attr.aria-label]=\"ariaLabel || null\"\n (click)=\"toggleDropdown()\"\n >\n <span>\n <ng-template\n *ngTemplateOutlet=\"\n selectedContentTpl || defaultSelectedContentTpl;\n context: { $implicit: state }\n \"\n >\n </ng-template>\n </span>\n </button>\n <nggv-dropdown-list\n #dropDownList\n [options]=\"options\"\n [scrollOffset]=\"scrollOffset\"\n [state]=\"state\"\n [expanded]=\"expanded\"\n [optionContentTpl]=\"optionContentTpl\"\n [groupLabelTpl]=\"groupLabelTpl\"\n [textToHighlight]=\"textToHighlight\"\n (closed)=\"setExpanded(false)\"\n (selectedValueChanged)=\"onSelectChange($event)\"\n >\n </nggv-dropdown-list>\n </div>\n <!-- ERRORS -->\n <div class=\"gds-form-item__footer error-wrapper\">\n <span\n class=\"form-info form-info--error\"\n [attr.for]=\"id + '-input'\"\n *ngIf=\"invalid && (error || ngControl?.invalid)\"\n >\n <span class=\"error-icon\">\n <gds-icon-triangle-exclamation\n width=\"16\"\n height=\"16\"\n [solid]=\"true\"\n *nggCoreElement\n ></gds-icon-triangle-exclamation>\n </span>\n <span\n *ngIf=\"error; else errorsRef\"\n [attr.data-thook]=\"thook + '-errorlabel'\"\n >{{ error }}</span\n >\n </span>\n <ng-template #errorsRef>\n <span\n *ngIf=\"firstError as error\"\n [attr.data-thook]=\"thook + '-errorlabel'\"\n >\n {{ t('error.field' + error?.code, error?.params) }}\n </span>\n </ng-template>\n </div>\n <!-- CHILDREN -->\n <ng-content></ng-content>\n </div>\n </ng-container>\n\n <ng-template #defaultSelectedContentTpl let-state>\n <!-- eslint-disable-next-line @angular-eslint/template/eqeqeq -->\n {{ state?.key != null && state?.label ? t(state.label) : placeholder }}\n </ng-template>\n</ng-container>\n", styles: [":host{--sg-border-radius: .25rem;--sg-border-width: 1px;--sg-border-color: #868686;--text-primary-color: #333;--sg-form-control-bg: #fff;--grey-000: hsl(0 0% 100%);--grey-100: hsl(0, 0%, 97%);--grey-200: hsl(0, 0%, 91%);--grey-300: hsl(0, 0%, 87%);--grey-400: hsl(0, 0%, 81%);--grey-500: hsl(0, 0%, 68%);--grey-600: hsl(0, 0%, 53%);--grey-700: hsl(0, 0%, 29%);--grey-800: hsl(0, 0%, 20%);--grey-900: hsl(0, 0%, 10%);--grey-1000: hsl(0 0% 0%);display:flex;flex-direction:column;max-width:100%;position:relative;width:100%;z-index:0;position:initial}:host label{display:block;font-weight:500;line-height:1.25rem;width:100%}:host label+.gds-input-wrapper,:host label+.nggv-field--locked{margin-top:.5rem}:host .description{font-size:.875rem;margin-bottom:.5rem;line-height:1.25rem;width:100%}:host:not(:last-child){margin-bottom:1.5rem}:host .gds-form-item__header{display:flex}:host .gds-form-item__header .form-info{font-weight:400}:host .gds-form-item__header button.icon.small{margin-top:-.5rem;margin-right:-.5rem}:host .gds-form-item__labels{flex:1;margin-bottom:.5rem}:host .gds-form-item__labels .form-info{margin-bottom:0}:host .gds-form-item__labels .form-info a:link:not(.button,[aria-disabled]){color:#0062bc}:host .gds-form-item__labels>*{width:100%;display:block}:host .gds-form-item__expandable-info{overflow:hidden;font-size:.875rem;line-height:1.25rem;transition:height .3s cubic-bezier(.23,1,.32,1)}:host .gds-form-item__expandable-info>div{padding-bottom:.5rem}:host .gds-form-item__backdrop{position:absolute;inset:0;background:var(--gds-ref-pallet-base100);border-radius:2px;z-index:-1;margin:-1rem;opacity:0;transition:all .3s cubic-bezier(.23,1,.32,1);border:1px solid transparent}@media (prefers-reduced-motion: reduce){:host .gds-form-item__backdrop{transition:none}}:host:has([aria-expanded=true]) .gds-form-item__backdrop{opacity:1;border-radius:.25rem;border-color:var(--gds-ref-pallet-base600)}:host .gds-form-item__footer:not(:empty){margin-top:.5rem;display:flex;column-gap:.5rem}:host .gds-form-item__footer:not(:empty)>span,:host .gds-form-item__footer:not(:empty)>.form-info{font-weight:500;line-height:1.125}:host:not(:last-child){margin-bottom:unset}:host .gds-field-label--optional{font-weight:400}:host button{background-color:transparent;border:0;cursor:pointer;font-family:inherit;padding:0;padding:.75rem 1rem;border-radius:var(--sg-border-radius);border:solid var(--sg-border-width) var(--sg-border-color);--border-color: var(--grey-600);--sg-border-color: var(--grey-600);background:var(--sg-form-control-bg);color:var(--text-primary-color);min-height:2.75rem;display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;max-width:100%;font-size:1rem;font-weight:400;line-height:1.125;text-align:left;width:100%}:host button:focus{outline-color:var(--gds-sys-color-focus-outline);outline-style:solid;outline-width:.125rem;outline-offset:.125rem}@media (max-width: 35.98em){:host button{min-width:100%}}:host button>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host button:after{margin-left:.5rem;margin-right:.5rem;border-bottom:solid 2px var(--text-primary-color);border-left:solid 2px var(--text-primary-color);content:\"\";display:block;height:.5rem;width:.5rem;position:relative;top:-.15rem;transform:translate(75%) rotate3d(0,0,1,-45deg) scaleZ(-1);transition:transform .3s ease-in;flex-shrink:0}:host button[aria-expanded=true]:after{transform:translate(75%,6px) rotate3d(0,0,1,-45deg) scale3d(-1,-1,1)}:host button:hover:after{border-color:currentColor}:host button:disabled{--background: var(--grey-500)}:host button span{width:100%;white-space:nowrap;display:block;text-overflow:ellipsis}:host button.small{font-size:.875rem}:host button:hover{background:#e7e7e7}:host button:active{background:inherit;color:inherit;border-color:inherit}:host button:disabled,:host button.disabled{--text-primary-color: var(--grey-600);background:var(--grey-300);color:var(--grey-600);cursor:not-allowed}:host button.nggv-field--error{border-bottom:2px solid #9f000a}:host .gds-form-item__footer .form-info{font-weight:500;font-size:.875rem}:host .gds-form-item__footer .form-info--error{display:flex;align-items:flex-start;gap:.5em;color:#9f000a}:host .gds-form-item__footer .form-info--error .error-icon{align-items:center}:host .dropdown{width:100%;position:relative}:host .dropdown nggv-dropdown-list{width:100%}\n"] }]
569
581
  }], ctorParameters: () => [{ type: i1$1.NgControl, decorators: [{
570
582
  type: Self
571
583
  }, {
@@ -663,12 +675,6 @@ class NggvTypeaheadDropdownListComponent extends NggvDropdownListComponent {
663
675
  this.setExpanded(true);
664
676
  this.subscribeToOutsideClickEvent();
665
677
  });
666
- this.hostComponent.nggvBlur
667
- .asObservable()
668
- .pipe(takeUntil(this._destroy$))
669
- .subscribe(() => {
670
- this.setExpanded(false);
671
- });
672
678
  }
673
679
  /**
674
680
  * @internal Formats the selected option to display in the input. Interpolate the returned value
@@ -821,11 +827,11 @@ class NggvTypeaheadInputComponent extends NggvInputComponent {
821
827
  }
822
828
  }
823
829
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NggvTypeaheadInputComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1$1.NgControl, optional: true, self: true }, { token: TRANSLOCO_SCOPE, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
824
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: NggvTypeaheadInputComponent, selector: "nggv-typeahead-input", inputs: { hostComponent: "hostComponent", resultFormatter: "resultFormatter", selectedFormatter: "selectedFormatter" }, host: { listeners: { "keyup": "onKeyUp($event)" } }, usesInheritance: true, ngImport: i0, template: "<ng-container>\n <div\n class=\"input-wrapper\"\n [ngClass]=\"{ expanded: expanded, collapsed: !expanded }\"\n [ngStyle]=\"{ 'height.px': buttonHeight }\"\n (click)=\"$event.stopPropagation()\"\n >\n <!-- INPUT FIELD -->\n <div class=\"input-group\">\n <input\n #input\n [id]=\"id + '-input'\"\n class=\"gds-field\"\n [attr.type]=\"type\"\n [attr.name]=\"name\"\n [attr.required]=\"required\"\n [attr.email]=\"email\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [pattern]=\"pattern\"\n [disabled]=\"disabled\"\n [autocomplete]=\"autocomplete\"\n [autofocus]=\"autofocus\"\n [readOnly]=\"readonly\"\n [attr.role]=\"role\"\n [attr.placeholder]=\"placeholder\"\n [attr.aria-label]=\"description\"\n [value]=\"state\"\n (input)=\"onInput($event)\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n />\n </div>\n </div>\n</ng-container>\n", styles: [":host{position:absolute;top:1px;left:0;width:calc(100% - 2.625em)}:host .input-wrapper{border:none;box-shadow:none}:host .input-wrapper.expanded{display:flex}:host .input-wrapper.expanded .input-group input.gds-field{height:calc(100% - 2px);width:100%;min-height:unset;margin-left:1px;padding-left:1rem;padding-right:1rem;border:none;box-shadow:none}:host .input-wrapper.collapsed{display:none}:host .input-wrapper .input-group{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
830
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: NggvTypeaheadInputComponent, selector: "nggv-typeahead-input", inputs: { hostComponent: "hostComponent", resultFormatter: "resultFormatter", selectedFormatter: "selectedFormatter" }, host: { listeners: { "keyup": "onKeyUp($event)" } }, usesInheritance: true, ngImport: i0, template: "<ng-container>\n <div\n class=\"input-wrapper\"\n [ngClass]=\"{ expanded: expanded, collapsed: !expanded }\"\n [ngStyle]=\"{ 'height.px': buttonHeight }\"\n (click)=\"$event.stopPropagation()\"\n >\n <!-- INPUT FIELD -->\n <div class=\"input-group\">\n <input\n #input\n [id]=\"id + '-input'\"\n class=\"gds-field\"\n [attr.type]=\"type\"\n [attr.name]=\"name\"\n [attr.required]=\"required\"\n [attr.email]=\"email\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [pattern]=\"pattern\"\n [disabled]=\"disabled\"\n [autocomplete]=\"autocomplete\"\n [autofocus]=\"autofocus\"\n [readOnly]=\"readonly\"\n [attr.role]=\"role\"\n [attr.placeholder]=\"placeholder\"\n [attr.aria-label]=\"description\"\n aria-owns=\"listbox\"\n aria-haspopup=\"listbox\"\n aria-controls=\"listbox\"\n [value]=\"state\"\n (input)=\"onInput($event)\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n />\n </div>\n </div>\n</ng-container>\n", styles: [":host{position:absolute;top:1px;left:0;width:calc(100% - 2.625em)}:host .input-wrapper{border:none;box-shadow:none}:host .input-wrapper.expanded{display:flex}:host .input-wrapper.expanded .input-group input.gds-field{height:calc(100% - 2px);width:100%;min-height:unset;margin-left:1px;padding-left:1rem;padding-right:1rem;border:none;box-shadow:none}:host .input-wrapper.collapsed{display:none}:host .input-wrapper .input-group{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
825
831
  }
826
832
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NggvTypeaheadInputComponent, decorators: [{
827
833
  type: Component,
828
- args: [{ selector: 'nggv-typeahead-input', template: "<ng-container>\n <div\n class=\"input-wrapper\"\n [ngClass]=\"{ expanded: expanded, collapsed: !expanded }\"\n [ngStyle]=\"{ 'height.px': buttonHeight }\"\n (click)=\"$event.stopPropagation()\"\n >\n <!-- INPUT FIELD -->\n <div class=\"input-group\">\n <input\n #input\n [id]=\"id + '-input'\"\n class=\"gds-field\"\n [attr.type]=\"type\"\n [attr.name]=\"name\"\n [attr.required]=\"required\"\n [attr.email]=\"email\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [pattern]=\"pattern\"\n [disabled]=\"disabled\"\n [autocomplete]=\"autocomplete\"\n [autofocus]=\"autofocus\"\n [readOnly]=\"readonly\"\n [attr.role]=\"role\"\n [attr.placeholder]=\"placeholder\"\n [attr.aria-label]=\"description\"\n [value]=\"state\"\n (input)=\"onInput($event)\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n />\n </div>\n </div>\n</ng-container>\n", styles: [":host{position:absolute;top:1px;left:0;width:calc(100% - 2.625em)}:host .input-wrapper{border:none;box-shadow:none}:host .input-wrapper.expanded{display:flex}:host .input-wrapper.expanded .input-group input.gds-field{height:calc(100% - 2px);width:100%;min-height:unset;margin-left:1px;padding-left:1rem;padding-right:1rem;border:none;box-shadow:none}:host .input-wrapper.collapsed{display:none}:host .input-wrapper .input-group{width:100%}\n"] }]
834
+ args: [{ selector: 'nggv-typeahead-input', template: "<ng-container>\n <div\n class=\"input-wrapper\"\n [ngClass]=\"{ expanded: expanded, collapsed: !expanded }\"\n [ngStyle]=\"{ 'height.px': buttonHeight }\"\n (click)=\"$event.stopPropagation()\"\n >\n <!-- INPUT FIELD -->\n <div class=\"input-group\">\n <input\n #input\n [id]=\"id + '-input'\"\n class=\"gds-field\"\n [attr.type]=\"type\"\n [attr.name]=\"name\"\n [attr.required]=\"required\"\n [attr.email]=\"email\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [pattern]=\"pattern\"\n [disabled]=\"disabled\"\n [autocomplete]=\"autocomplete\"\n [autofocus]=\"autofocus\"\n [readOnly]=\"readonly\"\n [attr.role]=\"role\"\n [attr.placeholder]=\"placeholder\"\n [attr.aria-label]=\"description\"\n aria-owns=\"listbox\"\n aria-haspopup=\"listbox\"\n aria-controls=\"listbox\"\n [value]=\"state\"\n (input)=\"onInput($event)\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n />\n </div>\n </div>\n</ng-container>\n", styles: [":host{position:absolute;top:1px;left:0;width:calc(100% - 2.625em)}:host .input-wrapper{border:none;box-shadow:none}:host .input-wrapper.expanded{display:flex}:host .input-wrapper.expanded .input-group input.gds-field{height:calc(100% - 2px);width:100%;min-height:unset;margin-left:1px;padding-left:1rem;padding-right:1rem;border:none;box-shadow:none}:host .input-wrapper.collapsed{display:none}:host .input-wrapper .input-group{width:100%}\n"] }]
829
835
  }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1$1.NgControl, decorators: [{
830
836
  type: Self
831
837
  }, {