@mozaic-ds/angular 0.24.0-beta.2 → 0.24.0-beta.4

package/adeo/fesm2020/mozaic-ds-angular.mjs

@@ -4,7 +4,7 @@ import * as i1 from '@angular/common';
 import { CommonModule, DOCUMENT } from '@angular/common';
 import * as i2 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, FormsModule, NgControl, FormControlName, FormGroupDirective, ReactiveFormsModule } from '@angular/forms';
-import { fromEvent, shareReplay, BehaviorSubject, Subject, startWith, map, of, tap, catchError, throwError, finalize, first, debounceTime, filter, switchMap, takeUntil, merge, combineLatest, delay as delay$1 } from 'rxjs';
+import { fromEvent, shareReplay, BehaviorSubject, Subject, startWith, map, of, tap, catchError, throwError, finalize, first, debounceTime, filter, switchMap, takeUntil, merge, combineLatest, delay as delay$1, pairwise } from 'rxjs';
 import { trigger, transition, group, query, style, animate } from '@angular/animations';
 import { delay } from 'rxjs/operators';
 import * as i1$1 from '@angular/common/http';
@@ -1231,8 +1231,8 @@ class PaginationComponent {
     ngOnChanges({ numberOfPages, pageTitleMask }) {
         if (this.needRenderPages(this.viewSelect, numberOfPages?.currentValue, numberOfPages?.previousValue, pageTitleMask?.currentValue, pageTitleMask?.previousValue)) {
             this.reinitializeNumberOfPagesAtInvalidValue();
-            this.pages = this.initializePages(this.numberOfPages);
         }
+        this.pages = this.initializePages(this.numberOfPages);
         this.reinitializeCurrentPageAtOverflow();
     }
     get viewSelect() {
@@ -1363,7 +1363,7 @@ class ProgressBarComponent {
         this.size = 'm';
         this.theme = 'default';
         this.percent = 0;
-        this.text = '';
+        this.displayPercentage = false;
     }
     get indicatorWidth() {
         return { width: `${this.percent}%` };
@@ -1371,22 +1371,22 @@ class ProgressBarComponent {
     get hostCssClasses() {
         const sizeClass = `mc-progressbar--${this.size}`;
         const themeClass = `mc-progressbar--${this.theme}`;
-        const textClass = !!this.text ? `mc-progressbar--percent` : '';
+        const textClass = this.displayPercentage ? `mc-progressbar--percent` : '';
         return `mc-progressbar ${sizeClass} ${themeClass} ${textClass}`;
     }
 }
 ProgressBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ProgressBarComponent, selector: "moz-progress-bar", inputs: { size: "size", theme: "theme", percent: "percent", text: "text" }, host: { properties: { "class": "this.hostCssClasses" } }, ngImport: i0, template: "<div\n  class=\"mc-progressbar__indicator\"\n  role=\"progressbar\"\n  [attr.aria-valuenow]=\"percent\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  [ngStyle]=\"indicatorWidth\"\n></div>\n<div *ngIf=\"text\" class=\"mc-progressbar__percentage\">{{ text }}</div>\n", styles: [".mc-progressbar{font-family:Roboto,sans-serif;align-items:center;background-color:#cdd4d8;display:flex;height:.5rem;justify-content:center;position:relative}.mc-progressbar,.mc-progressbar__indicator{border-radius:4px;overflow:hidden}.mc-progressbar__indicator{background-color:#007f8c;height:100%;left:0;position:absolute;transition:width .4s ease;top:0}.mc-progressbar--static .mc-progressbar__indicator{transition:none}.mc-progressbar__percentage{font-size:.875rem;line-height:1.2857142857;font-weight:700;color:#191919;position:relative;z-index:1}.mc-progressbar--half .mc-progressbar__percentage{color:#fff}.mc-progressbar:not(.mc-progressbar--percent) .mc-progressbar__percentage{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;visibility:visible;white-space:nowrap}.mc-progressbar--xs{height:.125rem}.mc-progressbar--xs,.mc-progressbar--xs .mc-progressbar__indicator{border-radius:1px}.mc-progressbar--s{height:.25rem}.mc-progressbar--s,.mc-progressbar--s .mc-progressbar__indicator{border-radius:2px}.mc-progressbar--percent{height:1.5rem}.mc-progressbar--percent,.mc-progressbar--percent .mc-progressbar__indicator{border-radius:12px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+ProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ProgressBarComponent, selector: "moz-progress-bar", inputs: { size: "size", theme: "theme", percent: "percent", displayPercentage: "displayPercentage" }, host: { properties: { "class": "this.hostCssClasses" } }, ngImport: i0, template: "<div\n  class=\"mc-progressbar__indicator\"\n  role=\"progressbar\"\n  [attr.aria-valuenow]=\"percent\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  [ngStyle]=\"indicatorWidth\"\n>\n  <div *ngIf=\"displayPercentage\" class=\"mc-progressbar__percentage\">{{ percent }}%</div>\n</div>\n", styles: [".mc-progressbar{font-family:Roboto,sans-serif;align-items:center;background-color:#cdd4d8;display:flex;height:.5rem;justify-content:center;position:relative}.mc-progressbar,.mc-progressbar__indicator{border-radius:4px;overflow:hidden}.mc-progressbar__indicator{background-color:#007f8c;height:100%;left:0;position:absolute;transition:width .4s ease;top:0}.mc-progressbar--static .mc-progressbar__indicator{transition:none}.mc-progressbar__percentage{font-size:.875rem;line-height:1.2857142857;font-weight:700;color:#191919;position:relative;z-index:1}.mc-progressbar--half .mc-progressbar__percentage{color:#fff}.mc-progressbar:not(.mc-progressbar--percent) .mc-progressbar__percentage{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;visibility:visible;white-space:nowrap}.mc-progressbar--xs{height:.125rem}.mc-progressbar--xs,.mc-progressbar--xs .mc-progressbar__indicator{border-radius:1px}.mc-progressbar--s{height:.25rem}.mc-progressbar--s,.mc-progressbar--s .mc-progressbar__indicator{border-radius:2px}.mc-progressbar--percent{height:1.5rem}.mc-progressbar--percent,.mc-progressbar--percent .mc-progressbar__indicator{border-radius:12px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ProgressBarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'moz-progress-bar', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n  class=\"mc-progressbar__indicator\"\n  role=\"progressbar\"\n  [attr.aria-valuenow]=\"percent\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  [ngStyle]=\"indicatorWidth\"\n></div>\n<div *ngIf=\"text\" class=\"mc-progressbar__percentage\">{{ text }}</div>\n", styles: [".mc-progressbar{font-family:Roboto,sans-serif;align-items:center;background-color:#cdd4d8;display:flex;height:.5rem;justify-content:center;position:relative}.mc-progressbar,.mc-progressbar__indicator{border-radius:4px;overflow:hidden}.mc-progressbar__indicator{background-color:#007f8c;height:100%;left:0;position:absolute;transition:width .4s ease;top:0}.mc-progressbar--static .mc-progressbar__indicator{transition:none}.mc-progressbar__percentage{font-size:.875rem;line-height:1.2857142857;font-weight:700;color:#191919;position:relative;z-index:1}.mc-progressbar--half .mc-progressbar__percentage{color:#fff}.mc-progressbar:not(.mc-progressbar--percent) .mc-progressbar__percentage{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;visibility:visible;white-space:nowrap}.mc-progressbar--xs{height:.125rem}.mc-progressbar--xs,.mc-progressbar--xs .mc-progressbar__indicator{border-radius:1px}.mc-progressbar--s{height:.25rem}.mc-progressbar--s,.mc-progressbar--s .mc-progressbar__indicator{border-radius:2px}.mc-progressbar--percent{height:1.5rem}.mc-progressbar--percent,.mc-progressbar--percent .mc-progressbar__indicator{border-radius:12px}\n"] }]
+            args: [{ selector: 'moz-progress-bar', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n  class=\"mc-progressbar__indicator\"\n  role=\"progressbar\"\n  [attr.aria-valuenow]=\"percent\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  [ngStyle]=\"indicatorWidth\"\n>\n  <div *ngIf=\"displayPercentage\" class=\"mc-progressbar__percentage\">{{ percent }}%</div>\n</div>\n", styles: [".mc-progressbar{font-family:Roboto,sans-serif;align-items:center;background-color:#cdd4d8;display:flex;height:.5rem;justify-content:center;position:relative}.mc-progressbar,.mc-progressbar__indicator{border-radius:4px;overflow:hidden}.mc-progressbar__indicator{background-color:#007f8c;height:100%;left:0;position:absolute;transition:width .4s ease;top:0}.mc-progressbar--static .mc-progressbar__indicator{transition:none}.mc-progressbar__percentage{font-size:.875rem;line-height:1.2857142857;font-weight:700;color:#191919;position:relative;z-index:1}.mc-progressbar--half .mc-progressbar__percentage{color:#fff}.mc-progressbar:not(.mc-progressbar--percent) .mc-progressbar__percentage{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;visibility:visible;white-space:nowrap}.mc-progressbar--xs{height:.125rem}.mc-progressbar--xs,.mc-progressbar--xs .mc-progressbar__indicator{border-radius:1px}.mc-progressbar--s{height:.25rem}.mc-progressbar--s,.mc-progressbar--s .mc-progressbar__indicator{border-radius:2px}.mc-progressbar--percent{height:1.5rem}.mc-progressbar--percent,.mc-progressbar--percent .mc-progressbar__indicator{border-radius:12px}\n"] }]
         }], propDecorators: { size: [{
                 type: Input
             }], theme: [{
                 type: Input
             }], percent: [{
                 type: Input
-            }], text: [{
+            }], displayPercentage: [{
                 type: Input
             }], hostCssClasses: [{
                 type: HostBinding,
@@ -1689,14 +1689,14 @@ class TabsComponent {
     }
 }
 TabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TabsComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$2.Router, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-TabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TabsComponent, selector: "moz-tabs", inputs: { fullWidth: "fullWidth", fullWidthCenter: "fullWidthCenter", hideShadow: "hideShadow", selectTabIndex: "selectTabIndex" }, outputs: { selectedTabChange: "selectedTabChange" }, host: { properties: { "class.mc-tabs": "true", "class.mc-tabs--full": "viewFullWidth", "class.mc-tabs--full-centered": "fullWidthCenter", "class.mc-tab--hide-shadow": "hideShadow" } }, queries: [{ propertyName: "tabs", predicate: TabComponent }], usesOnChanges: true, ngImport: i0, template: "<ng-content select=\"[moz-tab]\"></ng-content>\n", styles: ["@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-Light.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-Light.woff) format(\"woff\");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-Regular.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-Regular.woff) format(\"woff\");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-SemiBold.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-SemiBold.woff) format(\"woff\");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-LightItalic.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-LightItalic.woff) format(\"woff\");font-weight:300;font-style:italic;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-Italic.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-Italic.woff) format(\"woff\");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-SemiBoldItalic.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-SemiBoldItalic.woff) format(\"woff\");font-weight:700;font-style:italic;font-display:swap}.mc-tabs{font-family:Roboto,sans-serif;font-weight:400;background-color:#fff;display:inline-flex;position:relative;width:100%}.mc-tabs:after{background:#b3b3b3;content:\"\";display:block;margin:0 auto;height:1px;width:100%;bottom:0;left:0;position:absolute}@media screen and (min-width: 680px){.mc-tabs{width:auto}}.mc-tabs--no-shadow:after,.mc-tabs--no-divider:after{display:none}@media screen and (max-width: 679px){.mc-tabs:not(.mc-tabs--dropdown):before{bottom:.125rem}}.mc-tabs__nav{list-style:none;margin-left:0;padding-left:0;display:flex;margin-top:0;margin-bottom:0}@media screen and (max-width: 679px){.mc-tabs__nav{overflow:auto hidden;white-space:nowrap}}.mc-tabs__nav,.mc-tabs__select{position:relative}.mc-tabs__link,.mc-tabs__element{font-size:.875rem;line-height:1.2857142857;font-weight:700;align-items:center;background:none;border:none;color:#666;cursor:pointer;display:flex;height:3.5rem;justify-content:center;outline:none;padding-left:.75rem;padding-right:.75rem;position:relative;text-decoration:none}.mc-tabs__link:before,.mc-tabs__element:before{border-radius:2px;box-shadow:0 0 0 0 transparent;content:\"\";display:block;pointer-events:none;position:absolute;inset:0;transition:box-shadow .2s ease;bottom:-.125rem;top:-.125rem}.mc-tabs__link:after,.mc-tabs__element:after{background-color:transparent;bottom:0;content:\"\";height:.25rem;left:1.5rem;position:absolute;right:1.5rem}.mc-tabs__link:hover .mc-tabs__text,.mc-tabs__element:hover .mc-tabs__text{background-color:#eeedea}.mc-tabs__link:active,.mc-tabs__element:active{color:#4d4d4d}.mc-tabs__link:active .mc-tabs__text,.mc-tabs__element:active .mc-tabs__text{background-color:#dddcd5}.mc-tabs__link:focus:before,.mc-tabs__element:focus:before{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-tabs__link--selected,.mc-tabs__element--selected{color:#007f8c}.mc-tabs__link--selected:after,.mc-tabs__element--selected:after{background-color:#007f8c}.mc-tabs__link--selected:hover,.mc-tabs__element--selected:hover,.mc-tabs__link--selected:active,.mc-tabs__element--selected:active{color:#006974}.mc-tabs__link--disabled,.mc-tabs__element--disabled{cursor:not-allowed;background-color:#ccc;pointer-events:none}.mc-tabs__link--disabled,.mc-tabs__link--disabled:hover,.mc-tabs__link--disabled:focus,.mc-tabs__link--disabled:active,.mc-tabs__element--disabled,.mc-tabs__element--disabled:hover,.mc-tabs__element--disabled:focus,.mc-tabs__element--disabled:active{box-shadow:none}.mc-tabs__text{align-items:center;border-radius:.25rem;display:flex;gap:.25rem;justify-content:center;position:relative;padding:.4375rem .75rem;pointer-events:none}.mc-tabs__icon{fill:currentColor;height:1.5rem;width:1.5rem}@media screen and (min-width: 680px){.mc-tabs--full,.mc-tabs--full-centered{width:100%}}.mc-tabs--full-centered{justify-content:center}.mc-tabs--dropdown{padding:1rem;width:auto}.mc-tab--hide-shadow:before{box-shadow:none!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+TabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TabsComponent, selector: "moz-tabs", inputs: { fullWidth: "fullWidth", fullWidthCenter: "fullWidthCenter", hideShadow: "hideShadow", selectTabIndex: "selectTabIndex" }, outputs: { selectedTabChange: "selectedTabChange" }, host: { properties: { "class.mc-tabs": "true", "class.mc-tabs--full": "viewFullWidth", "class.mc-tabs--full-centered": "fullWidthCenter", "class.mc-tabs--no-shadow": "hideShadow" } }, queries: [{ propertyName: "tabs", predicate: TabComponent }], usesOnChanges: true, ngImport: i0, template: "<ng-content select=\"[moz-tab]\"></ng-content>\n", styles: ["@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-Light.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-Light.woff) format(\"woff\");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-Regular.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-Regular.woff) format(\"woff\");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-SemiBold.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-SemiBold.woff) format(\"woff\");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-LightItalic.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-LightItalic.woff) format(\"woff\");font-weight:300;font-style:italic;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-Italic.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-Italic.woff) format(\"woff\");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-SemiBoldItalic.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-SemiBoldItalic.woff) format(\"woff\");font-weight:700;font-style:italic;font-display:swap}.mc-tabs{font-family:Roboto,sans-serif;font-weight:400;background-color:#fff;display:inline-flex;position:relative;width:100%}.mc-tabs:after{background:#b3b3b3;content:\"\";display:block;margin:0 auto;height:1px;width:100%;bottom:0;left:0;position:absolute}@media screen and (min-width: 680px){.mc-tabs{width:auto}}.mc-tabs--no-shadow:after,.mc-tabs--no-divider:after{display:none}@media screen and (max-width: 679px){.mc-tabs:not(.mc-tabs--dropdown):before{bottom:.125rem}}.mc-tabs__nav{list-style:none;margin-left:0;padding-left:0;display:flex;margin-top:0;margin-bottom:0}@media screen and (max-width: 679px){.mc-tabs__nav{overflow:auto hidden;white-space:nowrap}}.mc-tabs__nav,.mc-tabs__select{position:relative}.mc-tabs__link,.mc-tabs__element{font-size:.875rem;line-height:1.2857142857;font-weight:700;align-items:center;background:none;border:none;color:#666;cursor:pointer;display:flex;height:3.5rem;justify-content:center;outline:none;padding-left:.75rem;padding-right:.75rem;position:relative;text-decoration:none}.mc-tabs__link:before,.mc-tabs__element:before{border-radius:2px;box-shadow:0 0 0 0 transparent;content:\"\";display:block;pointer-events:none;position:absolute;inset:0;transition:box-shadow .2s ease;bottom:-.125rem;top:-.125rem}.mc-tabs__link:after,.mc-tabs__element:after{background-color:transparent;bottom:0;content:\"\";height:.25rem;left:1.5rem;position:absolute;right:1.5rem}.mc-tabs__link:hover .mc-tabs__text,.mc-tabs__element:hover .mc-tabs__text{background-color:#eeedea}.mc-tabs__link:active,.mc-tabs__element:active{color:#4d4d4d}.mc-tabs__link:active .mc-tabs__text,.mc-tabs__element:active .mc-tabs__text{background-color:#dddcd5}.mc-tabs__link:focus:before,.mc-tabs__element:focus:before{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-tabs__link--selected,.mc-tabs__element--selected{color:#007f8c}.mc-tabs__link--selected:after,.mc-tabs__element--selected:after{background-color:#007f8c}.mc-tabs__link--selected:hover,.mc-tabs__element--selected:hover,.mc-tabs__link--selected:active,.mc-tabs__element--selected:active{color:#006974}.mc-tabs__link--disabled,.mc-tabs__element--disabled{cursor:not-allowed;background-color:#ccc;pointer-events:none}.mc-tabs__link--disabled,.mc-tabs__link--disabled:hover,.mc-tabs__link--disabled:focus,.mc-tabs__link--disabled:active,.mc-tabs__element--disabled,.mc-tabs__element--disabled:hover,.mc-tabs__element--disabled:focus,.mc-tabs__element--disabled:active{box-shadow:none}.mc-tabs__text{align-items:center;border-radius:.25rem;display:flex;gap:.25rem;justify-content:center;position:relative;padding:.4375rem .75rem;pointer-events:none}.mc-tabs__icon{fill:currentColor;height:1.5rem;width:1.5rem}@media screen and (min-width: 680px){.mc-tabs--full,.mc-tabs--full-centered{width:100%}}.mc-tabs--full-centered{justify-content:center}.mc-tabs--dropdown{padding:1rem;width:auto}.mc-tab--hide-shadow:before{box-shadow:none!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TabsComponent, decorators: [{
             type: Component,
             args: [{ selector: TABS_SELECTOR, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         '[class.mc-tabs]': 'true',
                         '[class.mc-tabs--full]': 'viewFullWidth',
                         '[class.mc-tabs--full-centered]': 'fullWidthCenter',
-                        '[class.mc-tab--hide-shadow]': 'hideShadow',
+                        '[class.mc-tabs--no-shadow]': 'hideShadow',
                     }, template: "<ng-content select=\"[moz-tab]\"></ng-content>\n", styles: ["@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-Light.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-Light.woff) format(\"woff\");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-Regular.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-Regular.woff) format(\"woff\");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-SemiBold.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-SemiBold.woff) format(\"woff\");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-LightItalic.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-LightItalic.woff) format(\"woff\");font-weight:300;font-style:italic;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-Italic.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-Italic.woff) format(\"woff\");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:LeroyMerlin;src:url(/fonts/LeroyMerlinSans-Web-SemiBoldItalic.woff2) format(\"woff2\"),url(/fonts/LeroyMerlinSans-Web-SemiBoldItalic.woff) format(\"woff\");font-weight:700;font-style:italic;font-display:swap}.mc-tabs{font-family:Roboto,sans-serif;font-weight:400;background-color:#fff;display:inline-flex;position:relative;width:100%}.mc-tabs:after{background:#b3b3b3;content:\"\";display:block;margin:0 auto;height:1px;width:100%;bottom:0;left:0;position:absolute}@media screen and (min-width: 680px){.mc-tabs{width:auto}}.mc-tabs--no-shadow:after,.mc-tabs--no-divider:after{display:none}@media screen and (max-width: 679px){.mc-tabs:not(.mc-tabs--dropdown):before{bottom:.125rem}}.mc-tabs__nav{list-style:none;margin-left:0;padding-left:0;display:flex;margin-top:0;margin-bottom:0}@media screen and (max-width: 679px){.mc-tabs__nav{overflow:auto hidden;white-space:nowrap}}.mc-tabs__nav,.mc-tabs__select{position:relative}.mc-tabs__link,.mc-tabs__element{font-size:.875rem;line-height:1.2857142857;font-weight:700;align-items:center;background:none;border:none;color:#666;cursor:pointer;display:flex;height:3.5rem;justify-content:center;outline:none;padding-left:.75rem;padding-right:.75rem;position:relative;text-decoration:none}.mc-tabs__link:before,.mc-tabs__element:before{border-radius:2px;box-shadow:0 0 0 0 transparent;content:\"\";display:block;pointer-events:none;position:absolute;inset:0;transition:box-shadow .2s ease;bottom:-.125rem;top:-.125rem}.mc-tabs__link:after,.mc-tabs__element:after{background-color:transparent;bottom:0;content:\"\";height:.25rem;left:1.5rem;position:absolute;right:1.5rem}.mc-tabs__link:hover .mc-tabs__text,.mc-tabs__element:hover .mc-tabs__text{background-color:#eeedea}.mc-tabs__link:active,.mc-tabs__element:active{color:#4d4d4d}.mc-tabs__link:active .mc-tabs__text,.mc-tabs__element:active .mc-tabs__text{background-color:#dddcd5}.mc-tabs__link:focus:before,.mc-tabs__element:focus:before{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-tabs__link--selected,.mc-tabs__element--selected{color:#007f8c}.mc-tabs__link--selected:after,.mc-tabs__element--selected:after{background-color:#007f8c}.mc-tabs__link--selected:hover,.mc-tabs__element--selected:hover,.mc-tabs__link--selected:active,.mc-tabs__element--selected:active{color:#006974}.mc-tabs__link--disabled,.mc-tabs__element--disabled{cursor:not-allowed;background-color:#ccc;pointer-events:none}.mc-tabs__link--disabled,.mc-tabs__link--disabled:hover,.mc-tabs__link--disabled:focus,.mc-tabs__link--disabled:active,.mc-tabs__element--disabled,.mc-tabs__element--disabled:hover,.mc-tabs__element--disabled:focus,.mc-tabs__element--disabled:active{box-shadow:none}.mc-tabs__text{align-items:center;border-radius:.25rem;display:flex;gap:.25rem;justify-content:center;position:relative;padding:.4375rem .75rem;pointer-events:none}.mc-tabs__icon{fill:currentColor;height:1.5rem;width:1.5rem}@media screen and (min-width: 680px){.mc-tabs--full,.mc-tabs--full-centered{width:100%}}.mc-tabs--full-centered{justify-content:center}.mc-tabs--dropdown{padding:1rem;width:auto}.mc-tab--hide-shadow:before{box-shadow:none!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$2.Router, decorators: [{
                     type: Host
@@ -2461,9 +2461,16 @@ class MozDatatableFooterComponent {
         if (this.totalItems === 1 && this.selectedRowPerPage === 0) {
             return 0;
         }
+        // case nullable
+        if (this.totalItems == null || this.selectedRowPerPage == null) {
+            return 0;
+        }
         return Math.ceil(this.totalItems / this.selectedRowPerPage);
     }
     calculateCountEnd() {
+        if (this.selectedRowPerPage == null) {
+            return 0;
+        }
         const count = this.selectedRowPerPage * this.currentPage;
         if (count > this.totalItems) {
             return this.totalItems;
@@ -2471,6 +2478,9 @@ class MozDatatableFooterComponent {
         return count;
     }
     calculateCountStart() {
+        if (this.selectedRowPerPage == null || this.totalItems == null) {
+            return 0;
+        }
         if (this.selectedRowPerPage === 0 || this.currentPage === 0 || this.totalItems === 0) {
             return 0;
         }
@@ -2478,10 +2488,10 @@ class MozDatatableFooterComponent {
     }
 }
 MozDatatableFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MozDatatableFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MozDatatableFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: MozDatatableFooterComponent, selector: "moz-datatable-footer", inputs: { footerSettings: "footerSettings", isLoading: "isLoading" }, outputs: { rowPerPageChangeEmitter: "rowPerPageChangeEmitter", pageChangeEmitter: "pageChangeEmitter" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"mc-datatable__footer\">\n  <div class=\"mc-datatable__select\">\n    <label for=\"selectRows\" class=\"mc-datatable__select-label\">{{\n      footerSettings?.labels?.rowPerPage || 'Rows per page'\n    }}</label>\n    <select\n      moz-select\n      [disabled]=\"isLoading || false\"\n      id=\"selectRows\"\n      [(ngModel)]=\"selectedRowPerPage\"\n      (change)=\"rowPerPageChangeEmitter.emit(selectedRowPerPage)\"\n      [disabled]=\"calculateNumberOfPage() === 0\"\n    >\n      <option\n        *ngFor=\"let value of footerSettings?.pagination?.rowPerPage?.options\"\n        [ngValue]=\"value\"\n      >\n        {{ value }}\n      </option>\n    </select>\n  </div>\n  <div class=\"mc-datatable__count\" *ngIf=\"!isLoading\">\n    <strong>{{ calculateCountStart() }}-{{ calculateCountEnd() }}</strong> /\n    <strong\n      >{{ footerSettings?.pagination?.totalItems }}\n      {{ footerSettings?.labels?.items || 'Items' }}</strong\n    >\n  </div>\n  <div class=\"mc-datatable__pagination\">\n    <moz-pagination\n      [numberOfPages]=\"isLoading ? 0 : calculateNumberOfPage()\"\n      [(ngModel)]=\"currentPage\"\n      (pageChangeEvent)=\"pageChangeEmitter.emit(currentPage)\"\n      [pageLabel]=\"footerSettings?.labels?.page || 'Page'\"\n      [pageOfLabel]=\"footerSettings?.labels?.of || 'of'\"\n    >\n    </moz-pagination>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PaginationComponent, selector: "moz-pagination", inputs: ["numberOfPages", "light", "pageLabel", "pageOfLabel", "pageTitleMask"], outputs: ["pageChangeEvent"] }, { kind: "component", type: SelectComponent, selector: "select[moz-`select`]", inputs: ["size"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MozDatatableFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: MozDatatableFooterComponent, selector: "moz-datatable-footer", inputs: { footerSettings: "footerSettings", isLoading: "isLoading" }, outputs: { rowPerPageChangeEmitter: "rowPerPageChangeEmitter", pageChangeEmitter: "pageChangeEmitter" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"mc-datatable__footer\">\n  <div class=\"mc-datatable__select\">\n    <label for=\"selectRows\" class=\"mc-datatable__select-label\">{{\n      footerSettings?.labels?.rowPerPage || 'Rows per page'\n    }}</label>\n    <select\n      moz-select\n      id=\"selectRows\"\n      [(ngModel)]=\"selectedRowPerPage\"\n      (change)=\"rowPerPageChangeEmitter.emit(selectedRowPerPage)\"\n      [disabled]=\"calculateNumberOfPage() === 0 || isLoading || false\"\n    >\n      <option\n        *ngFor=\"let value of footerSettings?.pagination?.rowPerPage?.options\"\n        [ngValue]=\"value\"\n      >\n        {{ value }}\n      </option>\n    </select>\n  </div>\n  <div class=\"mc-datatable__count\" *ngIf=\"!isLoading\">\n    <strong>{{ calculateCountStart() }}-{{ calculateCountEnd() }}</strong> /\n    <strong\n      >{{ footerSettings?.pagination?.totalItems || 0 }}\n      {{ footerSettings?.labels?.items || 'Items' }}</strong\n    >\n  </div>\n  <div class=\"mc-datatable__pagination\">\n    <moz-pagination\n      [numberOfPages]=\"isLoading ? 0 : calculateNumberOfPage()\"\n      [(ngModel)]=\"currentPage\"\n      (pageChangeEvent)=\"pageChangeEmitter.emit(currentPage)\"\n      [pageLabel]=\"footerSettings?.labels?.page || 'Page'\"\n      [pageOfLabel]=\"footerSettings?.labels?.of || 'of'\"\n    >\n    </moz-pagination>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PaginationComponent, selector: "moz-pagination", inputs: ["numberOfPages", "light", "pageLabel", "pageOfLabel", "pageTitleMask"], outputs: ["pageChangeEvent"] }, { kind: "component", type: SelectComponent, selector: "select[moz-`select`]", inputs: ["size"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MozDatatableFooterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'moz-datatable-footer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mc-datatable__footer\">\n  <div class=\"mc-datatable__select\">\n    <label for=\"selectRows\" class=\"mc-datatable__select-label\">{{\n      footerSettings?.labels?.rowPerPage || 'Rows per page'\n    }}</label>\n    <select\n      moz-select\n      [disabled]=\"isLoading || false\"\n      id=\"selectRows\"\n      [(ngModel)]=\"selectedRowPerPage\"\n      (change)=\"rowPerPageChangeEmitter.emit(selectedRowPerPage)\"\n      [disabled]=\"calculateNumberOfPage() === 0\"\n    >\n      <option\n        *ngFor=\"let value of footerSettings?.pagination?.rowPerPage?.options\"\n        [ngValue]=\"value\"\n      >\n        {{ value }}\n      </option>\n    </select>\n  </div>\n  <div class=\"mc-datatable__count\" *ngIf=\"!isLoading\">\n    <strong>{{ calculateCountStart() }}-{{ calculateCountEnd() }}</strong> /\n    <strong\n      >{{ footerSettings?.pagination?.totalItems }}\n      {{ footerSettings?.labels?.items || 'Items' }}</strong\n    >\n  </div>\n  <div class=\"mc-datatable__pagination\">\n    <moz-pagination\n      [numberOfPages]=\"isLoading ? 0 : calculateNumberOfPage()\"\n      [(ngModel)]=\"currentPage\"\n      (pageChangeEvent)=\"pageChangeEmitter.emit(currentPage)\"\n      [pageLabel]=\"footerSettings?.labels?.page || 'Page'\"\n      [pageOfLabel]=\"footerSettings?.labels?.of || 'of'\"\n    >\n    </moz-pagination>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'moz-datatable-footer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mc-datatable__footer\">\n  <div class=\"mc-datatable__select\">\n    <label for=\"selectRows\" class=\"mc-datatable__select-label\">{{\n      footerSettings?.labels?.rowPerPage || 'Rows per page'\n    }}</label>\n    <select\n      moz-select\n      id=\"selectRows\"\n      [(ngModel)]=\"selectedRowPerPage\"\n      (change)=\"rowPerPageChangeEmitter.emit(selectedRowPerPage)\"\n      [disabled]=\"calculateNumberOfPage() === 0 || isLoading || false\"\n    >\n      <option\n        *ngFor=\"let value of footerSettings?.pagination?.rowPerPage?.options\"\n        [ngValue]=\"value\"\n      >\n        {{ value }}\n      </option>\n    </select>\n  </div>\n  <div class=\"mc-datatable__count\" *ngIf=\"!isLoading\">\n    <strong>{{ calculateCountStart() }}-{{ calculateCountEnd() }}</strong> /\n    <strong\n      >{{ footerSettings?.pagination?.totalItems || 0 }}\n      {{ footerSettings?.labels?.items || 'Items' }}</strong\n    >\n  </div>\n  <div class=\"mc-datatable__pagination\">\n    <moz-pagination\n      [numberOfPages]=\"isLoading ? 0 : calculateNumberOfPage()\"\n      [(ngModel)]=\"currentPage\"\n      (pageChangeEvent)=\"pageChangeEmitter.emit(currentPage)\"\n      [pageLabel]=\"footerSettings?.labels?.page || 'Page'\"\n      [pageOfLabel]=\"footerSettings?.labels?.of || 'of'\"\n    >\n    </moz-pagination>\n  </div>\n</div>\n" }]
         }], propDecorators: { footerSettings: [{
                 type: Input
             }], isLoading: [{
@@ -2656,12 +2666,22 @@ class MozDatatableComponent {
     getUnhiddenColumns() {
         return this.datatableSettings?.columnDefs.filter((headTitle) => !headTitle.hide) || [];
     }
+    getColumns() {
+        return this.datatableSettings?.isLoading
+            ? ['', '', '', '', '']
+            : this.datatableSettings?.columnDefs;
+    }
+    getFields() {
+        return this.datatableSettings?.isLoading
+            ? ['', '', '', '', '']
+            : this.datatableSettings?.rowData;
+    }
 }
 MozDatatableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MozDatatableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MozDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: MozDatatableComponent, selector: "moz-datatable", inputs: { footerSettings: "footerSettings", selectionSettings: "selectionSettings", datatableSettings: "datatableSettings" }, outputs: { rowClick: "rowClick", sortColumn: "sortColumn", rowSelected: "rowSelected", rowAllSelected: "rowAllSelected", emptyBodyButtonClicked: "emptyBodyButtonClicked", pageChange: "pageChange", rowPerPageChange: "rowPerPageChange" }, queries: [{ propertyName: "expansionContentComponent", first: true, predicate: MozDatatableRowExpansionContentComponent, descendants: true }, { propertyName: "headerCellComponents", predicate: MozDatatableHeaderCellComponent }, { propertyName: "contentCellComponents", predicate: MozDatatableContentCellComponent }], viewQueries: [{ propertyName: "selectionComponent", first: true, predicate: MozDatatableSelectionComponent, descendants: true }, { propertyName: "thSelectionRef", first: true, predicate: ["thSelection"], descendants: true }, { propertyName: "thSubRowRef", first: true, predicate: ["thSubRow"], descendants: true }], ngImport: i0, template: "<div class=\"mc-datatable mc-datatable-height\">\n  <div class=\"mc-datatable__header\">\n    <ng-content select=\"moz-datatable-caption\"></ng-content>\n    <div>\n      <moz-datatable-selection\n        [selectionSettings]=\"selectionSettings\"\n        [paginationEnabled]=\"datatableSettings?.activatePagination\"\n        [rowData]=\"datatableSettings?.rowData\"\n        (updateSelectionAllEmitter)=\"selectionAllRowEvent($event)\"\n      ></moz-datatable-selection>\n    </div>\n  </div>\n  <div class=\"mc-datatable__container mc-datatable-height\">\n    <div class=\"mc-datatable__main mc-datatable-height\">\n      <table class=\"mc-datatable__table\">\n        <thead [ngClass]=\"{ 'fix-header-row': datatableSettings?.fixHeaderRow }\">\n          <tr>\n            <th\n              class=\"mc-datatable__cell-checkbox moz-datatable__th mc-datatable__fix-first-column\"\n              *ngIf=\"\n                datatableSettings?.activateSelection && selectionComponent && selectionSettings\n              \"\n              #thSelection\n            >\n              <moz-checkbox\n                (change)=\"\n                  selectionComponent.onUdpateSelectionAllPageRows($event); selectionRowEvent($event)\n                \"\n                [indeterminate]=\"selectionComponent.isIndeterminate\"\n                [checked]=\"selectionSettings.allSelected && !selectionComponent.isIndeterminate\"\n                [disabled]=\"datatableSettings?.isLoading || false\"\n              >\n              </moz-checkbox>\n            </th>\n            <th\n              *ngIf=\"hasSubRow() && !datatableSettings?.isLoading\"\n              class=\"mc-datatable__fix-first-column\"\n              [style.left.px]=\"getStyleLeftForColumnFixed()\"\n              #thSubRow\n            ></th>\n            <ng-container *ngFor=\"let columnDef of datatableSettings?.columnDefs\">\n              <th\n                class=\"moz-datatable__th\"\n                *ngIf=\"!columnDef.hide\"\n                [ngClass]=\"{\n                  'mc-datatable__fix-first-column':\n                    datatableSettings?.fixFirstColumn &&\n                    getUnhiddenColumns()[0].field === columnDef.field\n                }\"\n                [style.left.px]=\"getLeftValueFixFirstColumn()\"\n              >\n                <div\n                  [mozDatatableSort]=\"columnDef\"\n                  [ngClass]=\"{ header: columnDef.sort }\"\n                  (sortEmitter)=\"sortEvent($event)\"\n                >\n                  <ng-container\n                    *ngIf=\"getCustomHeader(columnDef.field) as customHeader; else defaultHeaderCell\"\n                  >\n                    <ng-container\n                      *ngTemplateOutlet=\"\n                        customHeader;\n                        context: {\n                          $implicit: {\n                            content: columnDef\n                          }\n                        }\n                      \"\n                    ></ng-container>\n                  </ng-container>\n                  <ng-template #defaultHeaderCell>\n                    {{ columnDef.headerName | uppercase }}\n                  </ng-template>\n                </div>\n              </th>\n            </ng-container>\n          </tr>\n        </thead>\n        <tbody>\n          <ng-container *ngIf=\"(datatableSettings?.rowData?.length || 0) > 0; else emptyBody\">\n            <ng-container *ngFor=\"let row of datatableSettings?.rowData; index as i\">\n              <tr class=\"mc-datatable__row-parent\" (click)=\"rowClickEvent($event, row)\">\n                <td\n                  class=\"mc-datatable__fix-first-column\"\n                  *ngIf=\"datatableSettings?.activateSelection && selectionComponent\"\n                >\n                  <ng-container *ngIf=\"datatableSettings?.isLoading; else notLoadingCheckbox\">\n                    <div class=\"skeleton-box mu-mb-100 checkbox-loading\"></div>\n                  </ng-container>\n                  <ng-template #notLoadingCheckbox>\n                    <moz-checkbox\n                      (change)=\"\n                        selectionComponent.onUdpateSelectionRow(row); selectionRowEvent($event)\n                      \"\n                      [(ngModel)]=\"row.selected\"\n                      [checked]=\"row.selected || false\"\n                      [disabled]=\"row.disableSelection || false\"\n                    >\n                    </moz-checkbox>\n                  </ng-template>\n                </td>\n                <ng-container *ngIf=\"hasSubRow() && !datatableSettings?.isLoading\">\n                  <td\n                    *ngIf=\"row['subRow']; else noSubRow\"\n                    class=\"mc-datatable__cell-button mc-datatable__fix-first-column\"\n                    [style.left.px]=\"getStyleLeftForColumnFixed()\"\n                  >\n                    <button\n                      class=\"mc-datatable__expand mc-datatable__btn\"\n                      (click)=\"toggleRowExpansion(i); $event.stopPropagation()\"\n                    >\n                      <span class=\"mc-datatable__btn-icon\">\n                        <ng-container *ngIf=\"!expandedRows[i]; else subrowClosed\">\n                          <moz-icon [iconName]=\"'Navigation_Control_Circle--More_24px'\"></moz-icon>\n                        </ng-container>\n                        <ng-template #subrowClosed>\n                          <moz-icon [iconName]=\"'Navigation_Control_Circle--Less_24px'\"></moz-icon>\n                        </ng-template>\n                      </span>\n                    </button>\n                  </td>\n                  <ng-template #noSubRow\n                    ><td\n                      class=\"mc-datatable__cell-button mc-datatable__fix-first-column\"\n                      [style.left.px]=\"getStyleLeftForColumnFixed()\"\n                    ></td\n                  ></ng-template>\n                </ng-container>\n                <ng-container *ngFor=\"let columnDef of datatableSettings?.columnDefs\">\n                  <td\n                    *ngIf=\"!columnDef.hide\"\n                    [ngClass]=\"{\n                      'mc-datatable__fix-first-column':\n                        datatableSettings?.fixFirstColumn &&\n                        getUnhiddenColumns()[0].field === columnDef.field\n                    }\"\n                    [style.left.px]=\"getLeftValueFixFirstColumn()\"\n                  >\n                    <ng-container *ngIf=\"datatableSettings?.isLoading; else notLoadingCells\">\n                      <div class=\"skeleton-box mu-mb-100 cells-loading\"></div>\n                    </ng-container>\n                    <ng-template #notLoadingCells>\n                      <ng-container\n                        *ngIf=\"\n                          getCustomContent(columnDef.field) as customContent;\n                          else defaultContentCell\n                        \"\n                      >\n                        <ng-container\n                          *ngTemplateOutlet=\"\n                            customContent;\n                            context: {\n                              $implicit: {\n                                row: row,\n                                index: i,\n                                columnDefs: datatableSettings?.columnDefs,\n                                content: row[columnDef.field]\n                              }\n                            }\n                          \"\n                        ></ng-container>\n                      </ng-container>\n                      <ng-template #defaultContentCell>\n                        {{ row[columnDef.field] }}\n                      </ng-template>\n                    </ng-template>\n                  </td>\n                </ng-container>\n              </tr>\n              <ng-container>\n                <tr *ngIf=\"expandedRows[i]\">\n                  <td [attr.colspan]=\"getColspanForExpansionRow()\">\n                    <ng-container\n                      *ngIf=\"getCustomExpansionRowContent() as expansionRowContentComponent\"\n                    >\n                      <ng-container\n                        *ngTemplateOutlet=\"\n                        expansionRowContentComponent;\n                        context: {\n                          $implicit: {\n                            subRowContent: row['subRow'],\n                            index: i,\n                          }\n                        }\n                      \"\n                      ></ng-container>\n                    </ng-container>\n                  </td>\n                </tr>\n              </ng-container>\n            </ng-container>\n          </ng-container>\n          <ng-template #emptyBody>\n            <tr class=\"mc-datatable__empty\">\n              <td colspan=\"5\" class=\"mc-datatable__empty-cell\">\n                <div class=\"mc-datatable__empty-content\">\n                  <div>\n                    <div>\n                      <p>\n                        <strong>\n                          {{\n                            datatableSettings?.labels?.emptyBodyTitle || 'There is no result.'\n                          }}</strong\n                        ><br />\n                        {{\n                          datatableSettings?.labels?.emptyBodyDescription ||\n                            'Please try changing your filters.'\n                        }}\n                      </p>\n                    </div>\n                    <div *ngIf=\"datatableSettings?.activateEmptyBodyButton\">\n                      <button\n                        moz-button\n                        [theme]=\"'neutral'\"\n                        [size]=\"'s'\"\n                        [variation]=\"'bordered'\"\n                        (click)=\"emptyButtonClickEvent()\"\n                      >\n                        <moz-icon\n                          iconName=\"{{\n                            datatableSettings?.icons?.emptyBodyButtonIcon ||\n                              'Navigation_Display_Filter_24px'\n                          }}\"\n                        ></moz-icon>\n                        {{ datatableSettings?.labels?.emptyBodyButtonTitle || 'Change filters' }}\n                      </button>\n                    </div>\n                  </div>\n                </div>\n              </td>\n            </tr></ng-template\n          >\n        </tbody>\n      </table>\n    </div>\n  </div>\n  <moz-datatable-footer\n    *ngIf=\"datatableSettings?.activatePagination\"\n    [footerSettings]=\"footerSettings\"\n    [isLoading]=\"datatableSettings?.isLoading\"\n    (rowPerPageChangeEmitter)=\"rowPerPageChangeEvent($event)\"\n    (pageChangeEmitter)=\"pageChangeEvent($event)\"\n  ></moz-datatable-footer>\n</div>\n", styles: [".mc-datatable{font-family:Roboto,sans-serif;box-sizing:border-box}.mc-datatable *,.mc-datatable :after,.mc-datatable :before{box-sizing:inherit}.mc-datatable__container{border-radius:4px;box-shadow:0 1px 5px #19191933;background-color:#e7e7f0;overflow:hidden}.mc-datatable__main{scrollbar-color:#666666 #e6e6e6;scrollbar-width:thin;overflow:auto}.mc-datatable__main::-webkit-scrollbar{background-color:#e6e6e6;height:.5rem;width:.5rem}.mc-datatable__main::-webkit-scrollbar-track{background:#e6e6e6}.mc-datatable__main::-webkit-scrollbar-thumb{background:#666666}.mc-datatable__table tr,.mc-datatable thead th,.mc-datatable thead td{height:2.9375rem}.mc-datatable__table{border-collapse:collapse;border-spacing:0;caption-side:bottom;width:100%}.mc-datatable__table>thead,.mc-datatable__table>tbody{background-color:#fff}.mc-datatable__table th,.mc-datatable__table td{border-bottom:1px solid #b3b3b3;text-align:left;vertical-align:middle;padding-right:1rem;padding-left:1rem}.mc-datatable thead th,.mc-datatable thead td{font-weight:700;font-size:.75rem;line-height:1.3333333333;color:#393879;text-transform:uppercase}.mc-datatable__head{align-items:center;display:flex;justify-content:space-between}.mc-datatable tbody tr:hover:not(.mc-datatable__empty){background-color:#eaedef}.mc-datatable tbody tr.selected{background-color:#d9f0f3}.mc-datatable tbody th,.mc-datatable tbody td{font-size:.875rem;line-height:1.2857142857;color:#191919}.mc-datatable__row-parent:not(.mc-datatable__row-parent--expanded)+.mc-datatable__row-expandable{height:0}.mc-datatable__row-parent:not(.mc-datatable__row-parent--expanded)+.mc-datatable__row-expandable .mc-datatable__row-inner{overflow:hidden;max-height:0}.mc-datatable__row-parent.mc-datatable__row-parent--expanded+.mc-datatable__row-expandable .mc-datatable__row-inner{max-height:100%}.mc-datatable__row-expandable>td{padding:0;border-bottom:0}.mc-datatable__row-expandable--offset-1 table th:first-child,.mc-datatable__row-expandable--offset-1 table td:first-child{padding-left:4.25rem}.mc-datatable__row-expandable--offset-2 table th:first-child,.mc-datatable__row-expandable--offset-2 table td:first-child{padding-left:7.75rem}.mc-datatable__cell-checkbox{width:3.25rem}.mc-datatable__cell-button{width:3.5rem}.mc-datatable__cell-field{min-width:9.375rem}td.mc-datatable__cell-number{text-align:right}.mc-datatable__empty,.mc-datatable__empty:hover{background-color:#e7e7f0}.mc-datatable__empty-cell{color:#4b4a8c}.mc-datatable__empty-content{font-size:1rem;line-height:1.375;align-items:center;color:#4b4a8c;display:flex;gap:1.5rem;min-height:19.375rem;justify-content:center;text-align:center}.mc-datatable__empty-content strong{font-size:1.125rem;line-height:1.3333333333}.mc-datatable--s .mc-datatable__table tr,.mc-datatable--s .mc-datatable thead th,.mc-datatable--s .mc-datatable thead td{height:2.4375rem}.mc-datatable--l .mc-datatable__table tr,.mc-datatable--l .mc-datatable thead th,.mc-datatable--l .mc-datatable thead td{height:3.4375rem}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky-header .mc-datatable__table>thead{box-shadow:0 4px 20px #19191933;top:0;z-index:2}.mc-datatable--sticky .mc-datatable__table>tbody tr:last-child th,.mc-datatable--sticky .mc-datatable__table>tbody tr:last-child td,.mc-datatable--sticky-header .mc-datatable__table>tbody tr:last-child th,.mc-datatable--sticky-header .mc-datatable__table>tbody tr:last-child td{border-bottom:transparent}.mc-datatable--sticky .mc-datatable__footer,.mc-datatable--sticky-header .mc-datatable__footer{border-top:1px solid #b3b3b3;position:relative;z-index:2}.mc-datatable--sticky .mc-datatable__main{padding-top:2.9375rem;transform:translateZ(0)}.mc-datatable--sticky .mc-datatable__table{scrollbar-color:#666666 #e6e6e6;scrollbar-width:thin;display:block;overflow-y:auto}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar{background-color:#e6e6e6;height:.5rem;width:.5rem}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar-track{background:#e6e6e6}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar-thumb{background:#666666}.mc-datatable--sticky .mc-datatable__table>thead{position:fixed;width:100%}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky .mc-datatable__table>tbody,.mc-datatable--sticky .mc-datatable__table>thead tr,.mc-datatable--sticky .mc-datatable__table>tbody tr,.mc-datatable--sticky .mc-datatable__table>thead th,.mc-datatable--sticky .mc-datatable__table>thead td,.mc-datatable--sticky .mc-datatable__table>tbody th,.mc-datatable--sticky .mc-datatable__table>tbody td{display:flex}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky .mc-datatable__table>tbody,.mc-datatable--sticky .mc-datatable__table>thead tr,.mc-datatable--sticky .mc-datatable__table>tbody tr{width:100%}.mc-datatable--sticky .mc-datatable__table>tbody{flex-direction:column}.mc-datatable--sticky .mc-datatable__table>thead th,.mc-datatable--sticky .mc-datatable__table>thead td,.mc-datatable--sticky .mc-datatable__table>tbody th,.mc-datatable--sticky .mc-datatable__table>tbody td{align-items:center}.mc-datatable--sticky .mc-datatable__table>thead th:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>thead td:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>tbody th:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>tbody td:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button){flex:1}.mc-datatable--sticky .mc-datatable__cell-checkbox,.mc-datatable--sticky .mc-datatable__cell-button,.mc-datatable--sticky .mc-datatable__cell-field,.mc-datatable--sticky .mc-datatable__cell-number{flex-shrink:0}.mc-datatable--sticky .mc-datatable__cell-number{justify-content:flex-end}.mc-datatable--sticky-header .mc-datatable__main{overflow-y:auto}.mc-datatable--sticky-header .mc-datatable__table>thead{position:sticky}.mc-datatable--overflow-visible .mc-datatable__container,.mc-datatable--overflow-visible .mc-datatable__main{overflow:visible}.mc-datatable__btn{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;align-items:center;background-color:transparent;display:flex}.mc-datatable__btn-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-datatable__btn-icon,.mc-datatable__btn svg{width:1.5rem;height:1.5rem}.mc-datatable__sort{font-weight:700;font-size:.75rem;line-height:1.3333333333;color:#393879;text-transform:uppercase;align-items:center;display:flex;height:100%;font-family:inherit;justify-content:space-between;width:100%}.mc-datatable__sort-arrow{align-items:center;display:flex;flex-direction:column;height:1.5rem;justify-content:space-around;margin-left:.5rem;width:1.5rem}.mc-datatable__sort-arrow:after,.mc-datatable__sort-arrow:before{background-color:#cdd4d8;content:\"\";flex-shrink:0;height:.5rem;width:.75rem}.mc-datatable__sort-arrow:before{clip-path:polygon(50% 0%,0% 100%,100% 100%)}.asc .mc-datatable__sort-arrow:before{background-color:#605f9d}.desc .mc-datatable__sort-arrow:before{display:none}.mc-datatable__sort-arrow:after{clip-path:polygon(0 0,100% 0,50% 100%)}.asc .mc-datatable__sort-arrow:after{display:none}.desc .mc-datatable__sort-arrow:after{background-color:#605f9d}.mc-datatable__options{width:1.5rem;height:1.5rem}.mc-datatable__expand .mc-datatable__btn-icon{fill:#007f8c}.mc-datatable .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-datatable__topbar{justify-content:space-between;padding-top:1rem;padding-bottom:1rem}.mc-datatable__topbar,.mc-datatable__topbar-edition,.mc-datatable__topbar-actions{display:flex;gap:1rem}.mc-datatable__topbar-edition,.mc-datatable__topbar-actions{flex-wrap:wrap}.mc-datatable__topbar-edition{flex-shrink:0}.mc-datatable__topbar-actions{align-items:center;justify-content:flex-end;margin-left:auto}.mc-datatable__filters{align-items:center;border-top:1px solid #b0bbc0;display:flex;flex-wrap:wrap;gap:1rem;justify-content:flex-end;padding-top:1rem;padding-bottom:1rem}.mc-datatable__footer{align-items:center;background-color:#fff;display:flex;padding:.75rem 1rem;gap:1rem}@media screen and (max-width: 679px){.mc-datatable__footer{flex-direction:column}}.mc-datatable__select{display:flex;align-items:center;gap:.5rem}.mc-datatable__select-label{font-size:.875rem;line-height:1.2857142857;color:#333;flex-shrink:0}.mc-datatable__count{font-size:.75rem;line-height:1.3333333333;color:#666}.mc-datatable__pagination{margin-left:auto}.mc-datatable__subtable{border-collapse:collapse;border-spacing:0;caption-side:bottom;width:100%;background-color:#e7e7f0}.mc-datatable__subtable th,.mc-datatable__subtable td{border-bottom-color:#a4a3c7}.mc-datatable__subtable thead th,.mc-datatable__subtable thead td{font-size:.75rem;line-height:1.3333333333;color:#1a1a4b}.mc-datatable__subtable tbody th,.mc-datatable__subtable tbody td{color:#1a1a4b}.fix-header-row{position:sticky;top:0;box-shadow:0 1px 5px #22202033;z-index:1}.header{align-items:center;display:flex;height:100%;font-family:inherit;justify-content:space-between;width:100%}.is-sorted-asc:before{background-color:var(--color-datatable-sort-arrow-active, #333333)}.is-sorted-desc:after{background-color:var(--color-datatable-sort-arrow-active, #333333)}.mc-datatable-height{height:100%}.mc-datatable__sort-arrow{cursor:pointer}.mc-datatable__fix-first-column{position:sticky;background-color:#fff;left:0}.skeleton-box{display:inline-block;position:relative;overflow:hidden;background-color:#ccc}.skeleton-box:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(255,255,255,.2) 20%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0));animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.checkbox-loading{width:25px;height:25px}.cells-loading{width:250px;height:25px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ButtonComponent, selector: "button[moz-button]", inputs: ["iconPosition", "onlyIcon", "theme", "variation", "widthBehavior", "size"] }, { kind: "component", type: CheckboxComponent, selector: "moz-checkbox", inputs: ["disabled", "indeterminate", "invalid", "checked"] }, { kind: "component", type: IconComponent, selector: "moz-icon", inputs: ["iconName"] }, { kind: "component", type: MozDatatableFooterComponent, selector: "moz-datatable-footer", inputs: ["footerSettings", "isLoading"], outputs: ["rowPerPageChangeEmitter", "pageChangeEmitter"] }, { kind: "component", type: MozDatatableSelectionComponent, selector: "moz-datatable-selection", inputs: ["selectionSettings", "paginationEnabled", "rowData"], outputs: ["updateSelectionAllEmitter"] }, { kind: "directive", type: MozDatatableSortDirective, selector: "[mozDatatableSort]", inputs: ["mozDatatableSort"], outputs: ["sortEmitter"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }], encapsulation: i0.ViewEncapsulation.None });
+MozDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: MozDatatableComponent, selector: "moz-datatable", inputs: { footerSettings: "footerSettings", selectionSettings: "selectionSettings", datatableSettings: "datatableSettings" }, outputs: { rowClick: "rowClick", sortColumn: "sortColumn", rowSelected: "rowSelected", rowAllSelected: "rowAllSelected", emptyBodyButtonClicked: "emptyBodyButtonClicked", pageChange: "pageChange", rowPerPageChange: "rowPerPageChange" }, queries: [{ propertyName: "expansionContentComponent", first: true, predicate: MozDatatableRowExpansionContentComponent, descendants: true }, { propertyName: "headerCellComponents", predicate: MozDatatableHeaderCellComponent }, { propertyName: "contentCellComponents", predicate: MozDatatableContentCellComponent }], viewQueries: [{ propertyName: "selectionComponent", first: true, predicate: MozDatatableSelectionComponent, descendants: true }, { propertyName: "thSelectionRef", first: true, predicate: ["thSelection"], descendants: true }, { propertyName: "thSubRowRef", first: true, predicate: ["thSubRow"], descendants: true }], ngImport: i0, template: "<div class=\"mc-datatable mc-datatable-height\">\n  <div class=\"mc-datatable__header\">\n    <ng-content select=\"moz-datatable-caption\"></ng-content>\n    <div>\n      <moz-datatable-selection\n        [selectionSettings]=\"selectionSettings\"\n        [paginationEnabled]=\"datatableSettings?.activatePagination\"\n        [rowData]=\"datatableSettings?.rowData\"\n        (updateSelectionAllEmitter)=\"selectionAllRowEvent($event)\"\n      ></moz-datatable-selection>\n    </div>\n  </div>\n  <div class=\"mc-datatable__container mc-datatable-height\">\n    <div class=\"mc-datatable__main mc-datatable-height\">\n      <table class=\"mc-datatable__table\">\n        <thead [ngClass]=\"{ 'fix-header-row': datatableSettings?.fixHeaderRow }\">\n          <tr *ngIf=\"getColumns() && getColumns().length > 0\">\n            <th\n              class=\"mc-datatable__cell-checkbox moz-datatable__th mc-datatable__fix-first-column\"\n              *ngIf=\"\n                datatableSettings?.activateSelection && selectionComponent && selectionSettings\n              \"\n              #thSelection\n            >\n              <moz-checkbox\n                (change)=\"\n                  selectionComponent.onUdpateSelectionAllPageRows($event); selectionRowEvent($event)\n                \"\n                [indeterminate]=\"selectionComponent.isIndeterminate\"\n                [checked]=\"selectionSettings.allSelected && !selectionComponent.isIndeterminate\"\n                [disabled]=\"datatableSettings?.isLoading || false\"\n              >\n              </moz-checkbox>\n            </th>\n            <th\n              *ngIf=\"hasSubRow() && !datatableSettings?.isLoading\"\n              class=\"mc-datatable__fix-first-column\"\n              [style.left.px]=\"getStyleLeftForColumnFixed()\"\n              #thSubRow\n            ></th>\n            <ng-container *ngFor=\"let columnDef of getColumns()\">\n              <th\n                class=\"moz-datatable__th\"\n                *ngIf=\"!columnDef.hide\"\n                [ngClass]=\"{\n                  'mc-datatable__fix-first-column':\n                    datatableSettings?.fixFirstColumn &&\n                    getUnhiddenColumns()[0].field === columnDef.field\n                }\"\n                [style.left.px]=\"getLeftValueFixFirstColumn()\"\n              >\n                <ng-container *ngIf=\"datatableSettings?.isLoading; else notLoadingHeading\">\n                  <div class=\"skeleton-box mu-mb-100 cells-loading\"></div>\n                </ng-container>\n\n                <ng-template #notLoadingHeading>\n                  <div\n                    [mozDatatableSort]=\"columnDef\"\n                    [ngClass]=\"{ header: columnDef.sort }\"\n                    (sortEmitter)=\"sortEvent($event)\"\n                  >\n                    <ng-container\n                      *ngIf=\"\n                        getCustomHeader(columnDef.field) as customHeader;\n                        else defaultHeaderCell\n                      \"\n                    >\n                      <ng-container\n                        *ngTemplateOutlet=\"\n                          customHeader;\n                          context: {\n                            $implicit: {\n                              content: columnDef\n                            }\n                          }\n                        \"\n                      ></ng-container>\n                    </ng-container>\n                    <ng-template #defaultHeaderCell>\n                      {{ columnDef.headerName | uppercase }}\n                    </ng-template>\n                  </div>\n                </ng-template>\n              </th>\n            </ng-container>\n          </tr>\n        </thead>\n        <tbody>\n          <ng-container\n            *ngIf=\"\n              (datatableSettings?.rowData?.length || 0) > 0 || datatableSettings?.isLoading;\n              else emptyBody\n            \"\n          >\n            <ng-container *ngFor=\"let row of getFields(); index as i\">\n              <tr class=\"mc-datatable__row-parent\" (click)=\"rowClickEvent($event, row)\">\n                <td\n                  class=\"mc-datatable__fix-first-column\"\n                  *ngIf=\"datatableSettings?.activateSelection && selectionComponent\"\n                >\n                  <ng-container *ngIf=\"datatableSettings?.isLoading; else notLoadingCheckbox\">\n                    <div class=\"skeleton-box mu-mb-100 checkbox-loading\"></div>\n                  </ng-container>\n                  <ng-template #notLoadingCheckbox>\n                    <moz-checkbox\n                      (change)=\"\n                        selectionComponent.onUdpateSelectionRow(row); selectionRowEvent($event)\n                      \"\n                      [(ngModel)]=\"row.selected\"\n                      [checked]=\"row.selected || false\"\n                      [disabled]=\"row.disableSelection || false\"\n                    >\n                    </moz-checkbox>\n                  </ng-template>\n                </td>\n                <ng-container *ngIf=\"hasSubRow() && !datatableSettings?.isLoading\">\n                  <td\n                    *ngIf=\"row['subRow']; else noSubRow\"\n                    class=\"mc-datatable__cell-button mc-datatable__fix-first-column\"\n                    [style.left.px]=\"getStyleLeftForColumnFixed()\"\n                  >\n                    <button\n                      class=\"mc-datatable__expand mc-datatable__btn\"\n                      (click)=\"toggleRowExpansion(i); $event.stopPropagation()\"\n                    >\n                      <span class=\"mc-datatable__btn-icon\">\n                        <ng-container *ngIf=\"!expandedRows[i]; else subrowClosed\">\n                          <moz-icon [iconName]=\"'Navigation_Control_Circle--More_24px'\"></moz-icon>\n                        </ng-container>\n                        <ng-template #subrowClosed>\n                          <moz-icon [iconName]=\"'Navigation_Control_Circle--Less_24px'\"></moz-icon>\n                        </ng-template>\n                      </span>\n                    </button>\n                  </td>\n                  <ng-template #noSubRow\n                    ><td\n                      class=\"mc-datatable__cell-button mc-datatable__fix-first-column\"\n                      [style.left.px]=\"getStyleLeftForColumnFixed()\"\n                    ></td\n                  ></ng-template>\n                </ng-container>\n                <ng-container *ngFor=\"let columnDef of getColumns()\">\n                  <td\n                    *ngIf=\"!columnDef.hide\"\n                    [ngClass]=\"{\n                      'mc-datatable__fix-first-column':\n                        datatableSettings?.fixFirstColumn &&\n                        getUnhiddenColumns()[0].field === columnDef.field\n                    }\"\n                    [style.left.px]=\"getLeftValueFixFirstColumn()\"\n                  >\n                    <ng-container *ngIf=\"datatableSettings?.isLoading; else notLoadingCells\">\n                      <div class=\"skeleton-box mu-mb-100 cells-loading\"></div>\n                    </ng-container>\n                    <ng-template #notLoadingCells>\n                      <ng-container\n                        *ngIf=\"\n                          getCustomContent(columnDef.field) as customContent;\n                          else defaultContentCell\n                        \"\n                      >\n                        <ng-container\n                          *ngTemplateOutlet=\"\n                            customContent;\n                            context: {\n                              $implicit: {\n                                row: row,\n                                index: i,\n                                columnDefs: datatableSettings?.columnDefs,\n                                content: row[columnDef.field]\n                              }\n                            }\n                          \"\n                        ></ng-container>\n                      </ng-container>\n                      <ng-template #defaultContentCell>\n                        {{ row[columnDef.field] }}\n                      </ng-template>\n                    </ng-template>\n                  </td>\n                </ng-container>\n              </tr>\n              <ng-container>\n                <tr *ngIf=\"expandedRows[i]\">\n                  <td [attr.colspan]=\"getColspanForExpansionRow()\">\n                    <ng-container\n                      *ngIf=\"getCustomExpansionRowContent() as expansionRowContentComponent\"\n                    >\n                      <ng-container\n                        *ngTemplateOutlet=\"\n                        expansionRowContentComponent;\n                        context: {\n                          $implicit: {\n                            subRowContent: row['subRow'],\n                            index: i,\n                          }\n                        }\n                      \"\n                      ></ng-container>\n                    </ng-container>\n                  </td>\n                </tr>\n              </ng-container>\n            </ng-container>\n          </ng-container>\n          <ng-template #emptyBody>\n            <tr class=\"mc-datatable__empty\">\n              <td colspan=\"5\" class=\"mc-datatable__empty-cell\">\n                <div class=\"mc-datatable__empty-content\">\n                  <div>\n                    <div>\n                      <p>\n                        <strong>\n                          {{\n                            datatableSettings?.labels?.emptyBodyTitle || 'There is no result.'\n                          }}</strong\n                        ><br />\n                        {{\n                          datatableSettings?.labels?.emptyBodyDescription ||\n                            'Please try changing your filters.'\n                        }}\n                      </p>\n                    </div>\n                    <div *ngIf=\"datatableSettings?.activateEmptyBodyButton\">\n                      <button\n                        moz-button\n                        [theme]=\"'neutral'\"\n                        [size]=\"'s'\"\n                        [variation]=\"'bordered'\"\n                        (click)=\"emptyButtonClickEvent()\"\n                      >\n                        <moz-icon\n                          iconName=\"{{\n                            datatableSettings?.icons?.emptyBodyButtonIcon ||\n                              'Navigation_Display_Filter_24px'\n                          }}\"\n                        ></moz-icon>\n                        {{ datatableSettings?.labels?.emptyBodyButtonTitle || 'Change filters' }}\n                      </button>\n                    </div>\n                  </div>\n                </div>\n              </td>\n            </tr></ng-template\n          >\n        </tbody>\n      </table>\n    </div>\n    <moz-datatable-footer\n      *ngIf=\"datatableSettings?.activatePagination\"\n      [footerSettings]=\"footerSettings\"\n      [isLoading]=\"datatableSettings?.isLoading\"\n      (rowPerPageChangeEmitter)=\"rowPerPageChangeEvent($event)\"\n      (pageChangeEmitter)=\"pageChangeEvent($event)\"\n    ></moz-datatable-footer>\n  </div>\n</div>\n", styles: [".mc-datatable{font-family:Roboto,sans-serif;box-sizing:border-box}.mc-datatable *,.mc-datatable :after,.mc-datatable :before{box-sizing:inherit}.mc-datatable__container{border-radius:4px;box-shadow:0 1px 5px #19191933;background-color:#e7e7f0;overflow:hidden}.mc-datatable__main{scrollbar-color:#666666 #e6e6e6;scrollbar-width:thin;overflow:auto}.mc-datatable__main::-webkit-scrollbar{background-color:#e6e6e6;height:.5rem;width:.5rem}.mc-datatable__main::-webkit-scrollbar-track{background:#e6e6e6}.mc-datatable__main::-webkit-scrollbar-thumb{background:#666666}.mc-datatable__table tr,.mc-datatable thead th,.mc-datatable thead td{height:2.9375rem}.mc-datatable__table{border-collapse:collapse;border-spacing:0;caption-side:bottom;width:100%}.mc-datatable__table>thead,.mc-datatable__table>tbody{background-color:#fff}.mc-datatable__table th,.mc-datatable__table td{border-bottom:1px solid #b3b3b3;text-align:left;vertical-align:middle;padding-right:1rem;padding-left:1rem}.mc-datatable thead th,.mc-datatable thead td{font-weight:700;font-size:.75rem;line-height:1.3333333333;color:#393879;text-transform:uppercase}.mc-datatable__head{align-items:center;display:flex;justify-content:space-between}.mc-datatable tbody tr:hover:not(.mc-datatable__empty){background-color:#eaedef}.mc-datatable tbody tr.selected{background-color:#d9f0f3}.mc-datatable tbody th,.mc-datatable tbody td{font-size:.875rem;line-height:1.2857142857;color:#191919}.mc-datatable__row-parent:not(.mc-datatable__row-parent--expanded)+.mc-datatable__row-expandable{height:0}.mc-datatable__row-parent:not(.mc-datatable__row-parent--expanded)+.mc-datatable__row-expandable .mc-datatable__row-inner{overflow:hidden;max-height:0}.mc-datatable__row-parent.mc-datatable__row-parent--expanded+.mc-datatable__row-expandable .mc-datatable__row-inner{max-height:100%}.mc-datatable__row-expandable>td{padding:0;border-bottom:0}.mc-datatable__row-expandable--offset-1 table th:first-child,.mc-datatable__row-expandable--offset-1 table td:first-child{padding-left:4.25rem}.mc-datatable__row-expandable--offset-2 table th:first-child,.mc-datatable__row-expandable--offset-2 table td:first-child{padding-left:7.75rem}.mc-datatable__cell-checkbox{width:3.25rem}.mc-datatable__cell-button{width:3.5rem}.mc-datatable__cell-field{min-width:9.375rem}td.mc-datatable__cell-number{text-align:right}.mc-datatable__empty,.mc-datatable__empty:hover{background-color:#e7e7f0}.mc-datatable__empty-cell{color:#4b4a8c}.mc-datatable__empty-content{font-size:1rem;line-height:1.375;align-items:center;color:#4b4a8c;display:flex;gap:1.5rem;min-height:19.375rem;justify-content:center;text-align:center}.mc-datatable__empty-content strong{font-size:1.125rem;line-height:1.3333333333}.mc-datatable--s .mc-datatable__table tr,.mc-datatable--s .mc-datatable thead th,.mc-datatable--s .mc-datatable thead td{height:2.4375rem}.mc-datatable--l .mc-datatable__table tr,.mc-datatable--l .mc-datatable thead th,.mc-datatable--l .mc-datatable thead td{height:3.4375rem}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky-header .mc-datatable__table>thead{box-shadow:0 4px 20px #19191933;top:0;z-index:2}.mc-datatable--sticky .mc-datatable__table>tbody tr:last-child th,.mc-datatable--sticky .mc-datatable__table>tbody tr:last-child td,.mc-datatable--sticky-header .mc-datatable__table>tbody tr:last-child th,.mc-datatable--sticky-header .mc-datatable__table>tbody tr:last-child td{border-bottom:transparent}.mc-datatable--sticky .mc-datatable__footer,.mc-datatable--sticky-header .mc-datatable__footer{border-top:1px solid #b3b3b3;position:relative;z-index:2}.mc-datatable--sticky .mc-datatable__main{padding-top:2.9375rem;transform:translateZ(0)}.mc-datatable--sticky .mc-datatable__table{scrollbar-color:#666666 #e6e6e6;scrollbar-width:thin;display:block;overflow-y:auto}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar{background-color:#e6e6e6;height:.5rem;width:.5rem}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar-track{background:#e6e6e6}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar-thumb{background:#666666}.mc-datatable--sticky .mc-datatable__table>thead{position:fixed;width:100%}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky .mc-datatable__table>tbody,.mc-datatable--sticky .mc-datatable__table>thead tr,.mc-datatable--sticky .mc-datatable__table>tbody tr,.mc-datatable--sticky .mc-datatable__table>thead th,.mc-datatable--sticky .mc-datatable__table>thead td,.mc-datatable--sticky .mc-datatable__table>tbody th,.mc-datatable--sticky .mc-datatable__table>tbody td{display:flex}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky .mc-datatable__table>tbody,.mc-datatable--sticky .mc-datatable__table>thead tr,.mc-datatable--sticky .mc-datatable__table>tbody tr{width:100%}.mc-datatable--sticky .mc-datatable__table>tbody{flex-direction:column}.mc-datatable--sticky .mc-datatable__table>thead th,.mc-datatable--sticky .mc-datatable__table>thead td,.mc-datatable--sticky .mc-datatable__table>tbody th,.mc-datatable--sticky .mc-datatable__table>tbody td{align-items:center}.mc-datatable--sticky .mc-datatable__table>thead th:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>thead td:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>tbody th:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>tbody td:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button){flex:1}.mc-datatable--sticky .mc-datatable__cell-checkbox,.mc-datatable--sticky .mc-datatable__cell-button,.mc-datatable--sticky .mc-datatable__cell-field,.mc-datatable--sticky .mc-datatable__cell-number{flex-shrink:0}.mc-datatable--sticky .mc-datatable__cell-number{justify-content:flex-end}.mc-datatable--sticky-header .mc-datatable__main{overflow-y:auto}.mc-datatable--sticky-header .mc-datatable__table>thead{position:sticky}.mc-datatable--overflow-visible .mc-datatable__container,.mc-datatable--overflow-visible .mc-datatable__main{overflow:visible}.mc-datatable__btn{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;align-items:center;background-color:transparent;display:flex}.mc-datatable__btn-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-datatable__btn-icon,.mc-datatable__btn svg{width:1.5rem;height:1.5rem}.mc-datatable__sort{font-weight:700;font-size:.75rem;line-height:1.3333333333;color:#393879;text-transform:uppercase;align-items:center;display:flex;height:100%;font-family:inherit;justify-content:space-between;width:100%}.mc-datatable__sort-arrow{align-items:center;display:flex;flex-direction:column;height:1.5rem;justify-content:space-around;margin-left:.5rem;width:1.5rem}.mc-datatable__sort-arrow:after,.mc-datatable__sort-arrow:before{background-color:#cdd4d8;content:\"\";flex-shrink:0;height:.5rem;width:.75rem}.mc-datatable__sort-arrow:before{clip-path:polygon(50% 0%,0% 100%,100% 100%)}.asc .mc-datatable__sort-arrow:before{background-color:#605f9d}.desc .mc-datatable__sort-arrow:before{display:none}.mc-datatable__sort-arrow:after{clip-path:polygon(0 0,100% 0,50% 100%)}.asc .mc-datatable__sort-arrow:after{display:none}.desc .mc-datatable__sort-arrow:after{background-color:#605f9d}.mc-datatable__options{width:1.5rem;height:1.5rem}.mc-datatable__expand .mc-datatable__btn-icon{fill:#007f8c}.mc-datatable .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-datatable__topbar{justify-content:space-between;padding-top:1rem;padding-bottom:1rem}.mc-datatable__topbar,.mc-datatable__topbar-edition,.mc-datatable__topbar-actions{display:flex;gap:1rem}.mc-datatable__topbar-edition,.mc-datatable__topbar-actions{flex-wrap:wrap}.mc-datatable__topbar-edition{flex-shrink:0}.mc-datatable__topbar-actions{align-items:center;justify-content:flex-end;margin-left:auto}.mc-datatable__filters{align-items:center;border-top:1px solid #b0bbc0;display:flex;flex-wrap:wrap;gap:1rem;justify-content:flex-end;padding-top:1rem;padding-bottom:1rem}.mc-datatable__footer{align-items:center;background-color:#fff;display:flex;padding:.75rem 1rem;gap:1rem}@media screen and (max-width: 679px){.mc-datatable__footer{flex-direction:column}}.mc-datatable__select{display:flex;align-items:center;gap:.5rem}.mc-datatable__select-label{font-size:.875rem;line-height:1.2857142857;color:#333;flex-shrink:0}.mc-datatable__count{font-size:.75rem;line-height:1.3333333333;color:#666}.mc-datatable__pagination{margin-left:auto}.mc-datatable__subtable{border-collapse:collapse;border-spacing:0;caption-side:bottom;width:100%;background-color:#e7e7f0}.mc-datatable__subtable th,.mc-datatable__subtable td{border-bottom-color:#a4a3c7}.mc-datatable__subtable thead th,.mc-datatable__subtable thead td{font-size:.75rem;line-height:1.3333333333;color:#1a1a4b}.mc-datatable__subtable tbody th,.mc-datatable__subtable tbody td{color:#1a1a4b}.fix-header-row{position:sticky;top:0;box-shadow:0 1px 5px #22202033;z-index:1}.header{align-items:center;display:flex;height:100%;font-family:inherit;justify-content:space-between;width:100%}.is-sorted-asc:before{background-color:var(--color-datatable-sort-arrow-active, #333333)}.is-sorted-desc:after{background-color:var(--color-datatable-sort-arrow-active, #333333)}.mc-datatable-height{height:100%}.mc-datatable__sort-arrow{cursor:pointer}.mc-datatable__fix-first-column{position:sticky;background-color:#fff;left:0}.skeleton-box{display:inline-block;position:relative;overflow:hidden;background-color:#ccc}.skeleton-box:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(255,255,255,.2) 20%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0));animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.checkbox-loading{width:25px;height:25px}.cells-loading{width:250px;height:25px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ButtonComponent, selector: "button[moz-button]", inputs: ["iconPosition", "onlyIcon", "theme", "variation", "widthBehavior", "size"] }, { kind: "component", type: CheckboxComponent, selector: "moz-checkbox", inputs: ["disabled", "indeterminate", "invalid", "checked"] }, { kind: "component", type: IconComponent, selector: "moz-icon", inputs: ["iconName"] }, { kind: "component", type: MozDatatableFooterComponent, selector: "moz-datatable-footer", inputs: ["footerSettings", "isLoading"], outputs: ["rowPerPageChangeEmitter", "pageChangeEmitter"] }, { kind: "component", type: MozDatatableSelectionComponent, selector: "moz-datatable-selection", inputs: ["selectionSettings", "paginationEnabled", "rowData"], outputs: ["updateSelectionAllEmitter"] }, { kind: "directive", type: MozDatatableSortDirective, selector: "[mozDatatableSort]", inputs: ["mozDatatableSort"], outputs: ["sortEmitter"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MozDatatableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'moz-datatable', encapsulation: ViewEncapsulation.None, template: "<div class=\"mc-datatable mc-datatable-height\">\n  <div class=\"mc-datatable__header\">\n    <ng-content select=\"moz-datatable-caption\"></ng-content>\n    <div>\n      <moz-datatable-selection\n        [selectionSettings]=\"selectionSettings\"\n        [paginationEnabled]=\"datatableSettings?.activatePagination\"\n        [rowData]=\"datatableSettings?.rowData\"\n        (updateSelectionAllEmitter)=\"selectionAllRowEvent($event)\"\n      ></moz-datatable-selection>\n    </div>\n  </div>\n  <div class=\"mc-datatable__container mc-datatable-height\">\n    <div class=\"mc-datatable__main mc-datatable-height\">\n      <table class=\"mc-datatable__table\">\n        <thead [ngClass]=\"{ 'fix-header-row': datatableSettings?.fixHeaderRow }\">\n          <tr>\n            <th\n              class=\"mc-datatable__cell-checkbox moz-datatable__th mc-datatable__fix-first-column\"\n              *ngIf=\"\n                datatableSettings?.activateSelection && selectionComponent && selectionSettings\n              \"\n              #thSelection\n            >\n              <moz-checkbox\n                (change)=\"\n                  selectionComponent.onUdpateSelectionAllPageRows($event); selectionRowEvent($event)\n                \"\n                [indeterminate]=\"selectionComponent.isIndeterminate\"\n                [checked]=\"selectionSettings.allSelected && !selectionComponent.isIndeterminate\"\n                [disabled]=\"datatableSettings?.isLoading || false\"\n              >\n              </moz-checkbox>\n            </th>\n            <th\n              *ngIf=\"hasSubRow() && !datatableSettings?.isLoading\"\n              class=\"mc-datatable__fix-first-column\"\n              [style.left.px]=\"getStyleLeftForColumnFixed()\"\n              #thSubRow\n            ></th>\n            <ng-container *ngFor=\"let columnDef of datatableSettings?.columnDefs\">\n              <th\n                class=\"moz-datatable__th\"\n                *ngIf=\"!columnDef.hide\"\n                [ngClass]=\"{\n                  'mc-datatable__fix-first-column':\n                    datatableSettings?.fixFirstColumn &&\n                    getUnhiddenColumns()[0].field === columnDef.field\n                }\"\n                [style.left.px]=\"getLeftValueFixFirstColumn()\"\n              >\n                <div\n                  [mozDatatableSort]=\"columnDef\"\n                  [ngClass]=\"{ header: columnDef.sort }\"\n                  (sortEmitter)=\"sortEvent($event)\"\n                >\n                  <ng-container\n                    *ngIf=\"getCustomHeader(columnDef.field) as customHeader; else defaultHeaderCell\"\n                  >\n                    <ng-container\n                      *ngTemplateOutlet=\"\n                        customHeader;\n                        context: {\n                          $implicit: {\n                            content: columnDef\n                          }\n                        }\n                      \"\n                    ></ng-container>\n                  </ng-container>\n                  <ng-template #defaultHeaderCell>\n                    {{ columnDef.headerName | uppercase }}\n                  </ng-template>\n                </div>\n              </th>\n            </ng-container>\n          </tr>\n        </thead>\n        <tbody>\n          <ng-container *ngIf=\"(datatableSettings?.rowData?.length || 0) > 0; else emptyBody\">\n            <ng-container *ngFor=\"let row of datatableSettings?.rowData; index as i\">\n              <tr class=\"mc-datatable__row-parent\" (click)=\"rowClickEvent($event, row)\">\n                <td\n                  class=\"mc-datatable__fix-first-column\"\n                  *ngIf=\"datatableSettings?.activateSelection && selectionComponent\"\n                >\n                  <ng-container *ngIf=\"datatableSettings?.isLoading; else notLoadingCheckbox\">\n                    <div class=\"skeleton-box mu-mb-100 checkbox-loading\"></div>\n                  </ng-container>\n                  <ng-template #notLoadingCheckbox>\n                    <moz-checkbox\n                      (change)=\"\n                        selectionComponent.onUdpateSelectionRow(row); selectionRowEvent($event)\n                      \"\n                      [(ngModel)]=\"row.selected\"\n                      [checked]=\"row.selected || false\"\n                      [disabled]=\"row.disableSelection || false\"\n                    >\n                    </moz-checkbox>\n                  </ng-template>\n                </td>\n                <ng-container *ngIf=\"hasSubRow() && !datatableSettings?.isLoading\">\n                  <td\n                    *ngIf=\"row['subRow']; else noSubRow\"\n                    class=\"mc-datatable__cell-button mc-datatable__fix-first-column\"\n                    [style.left.px]=\"getStyleLeftForColumnFixed()\"\n                  >\n                    <button\n                      class=\"mc-datatable__expand mc-datatable__btn\"\n                      (click)=\"toggleRowExpansion(i); $event.stopPropagation()\"\n                    >\n                      <span class=\"mc-datatable__btn-icon\">\n                        <ng-container *ngIf=\"!expandedRows[i]; else subrowClosed\">\n                          <moz-icon [iconName]=\"'Navigation_Control_Circle--More_24px'\"></moz-icon>\n                        </ng-container>\n                        <ng-template #subrowClosed>\n                          <moz-icon [iconName]=\"'Navigation_Control_Circle--Less_24px'\"></moz-icon>\n                        </ng-template>\n                      </span>\n                    </button>\n                  </td>\n                  <ng-template #noSubRow\n                    ><td\n                      class=\"mc-datatable__cell-button mc-datatable__fix-first-column\"\n                      [style.left.px]=\"getStyleLeftForColumnFixed()\"\n                    ></td\n                  ></ng-template>\n                </ng-container>\n                <ng-container *ngFor=\"let columnDef of datatableSettings?.columnDefs\">\n                  <td\n                    *ngIf=\"!columnDef.hide\"\n                    [ngClass]=\"{\n                      'mc-datatable__fix-first-column':\n                        datatableSettings?.fixFirstColumn &&\n                        getUnhiddenColumns()[0].field === columnDef.field\n                    }\"\n                    [style.left.px]=\"getLeftValueFixFirstColumn()\"\n                  >\n                    <ng-container *ngIf=\"datatableSettings?.isLoading; else notLoadingCells\">\n                      <div class=\"skeleton-box mu-mb-100 cells-loading\"></div>\n                    </ng-container>\n                    <ng-template #notLoadingCells>\n                      <ng-container\n                        *ngIf=\"\n                          getCustomContent(columnDef.field) as customContent;\n                          else defaultContentCell\n                        \"\n                      >\n                        <ng-container\n                          *ngTemplateOutlet=\"\n                            customContent;\n                            context: {\n                              $implicit: {\n                                row: row,\n                                index: i,\n                                columnDefs: datatableSettings?.columnDefs,\n                                content: row[columnDef.field]\n                              }\n                            }\n                          \"\n                        ></ng-container>\n                      </ng-container>\n                      <ng-template #defaultContentCell>\n                        {{ row[columnDef.field] }}\n                      </ng-template>\n                    </ng-template>\n                  </td>\n                </ng-container>\n              </tr>\n              <ng-container>\n                <tr *ngIf=\"expandedRows[i]\">\n                  <td [attr.colspan]=\"getColspanForExpansionRow()\">\n                    <ng-container\n                      *ngIf=\"getCustomExpansionRowContent() as expansionRowContentComponent\"\n                    >\n                      <ng-container\n                        *ngTemplateOutlet=\"\n                        expansionRowContentComponent;\n                        context: {\n                          $implicit: {\n                            subRowContent: row['subRow'],\n                            index: i,\n                          }\n                        }\n                      \"\n                      ></ng-container>\n                    </ng-container>\n                  </td>\n                </tr>\n              </ng-container>\n            </ng-container>\n          </ng-container>\n          <ng-template #emptyBody>\n            <tr class=\"mc-datatable__empty\">\n              <td colspan=\"5\" class=\"mc-datatable__empty-cell\">\n                <div class=\"mc-datatable__empty-content\">\n                  <div>\n                    <div>\n                      <p>\n                        <strong>\n                          {{\n                            datatableSettings?.labels?.emptyBodyTitle || 'There is no result.'\n                          }}</strong\n                        ><br />\n                        {{\n                          datatableSettings?.labels?.emptyBodyDescription ||\n                            'Please try changing your filters.'\n                        }}\n                      </p>\n                    </div>\n                    <div *ngIf=\"datatableSettings?.activateEmptyBodyButton\">\n                      <button\n                        moz-button\n                        [theme]=\"'neutral'\"\n                        [size]=\"'s'\"\n                        [variation]=\"'bordered'\"\n                        (click)=\"emptyButtonClickEvent()\"\n                      >\n                        <moz-icon\n                          iconName=\"{{\n                            datatableSettings?.icons?.emptyBodyButtonIcon ||\n                              'Navigation_Display_Filter_24px'\n                          }}\"\n                        ></moz-icon>\n                        {{ datatableSettings?.labels?.emptyBodyButtonTitle || 'Change filters' }}\n                      </button>\n                    </div>\n                  </div>\n                </div>\n              </td>\n            </tr></ng-template\n          >\n        </tbody>\n      </table>\n    </div>\n  </div>\n  <moz-datatable-footer\n    *ngIf=\"datatableSettings?.activatePagination\"\n    [footerSettings]=\"footerSettings\"\n    [isLoading]=\"datatableSettings?.isLoading\"\n    (rowPerPageChangeEmitter)=\"rowPerPageChangeEvent($event)\"\n    (pageChangeEmitter)=\"pageChangeEvent($event)\"\n  ></moz-datatable-footer>\n</div>\n", styles: [".mc-datatable{font-family:Roboto,sans-serif;box-sizing:border-box}.mc-datatable *,.mc-datatable :after,.mc-datatable :before{box-sizing:inherit}.mc-datatable__container{border-radius:4px;box-shadow:0 1px 5px #19191933;background-color:#e7e7f0;overflow:hidden}.mc-datatable__main{scrollbar-color:#666666 #e6e6e6;scrollbar-width:thin;overflow:auto}.mc-datatable__main::-webkit-scrollbar{background-color:#e6e6e6;height:.5rem;width:.5rem}.mc-datatable__main::-webkit-scrollbar-track{background:#e6e6e6}.mc-datatable__main::-webkit-scrollbar-thumb{background:#666666}.mc-datatable__table tr,.mc-datatable thead th,.mc-datatable thead td{height:2.9375rem}.mc-datatable__table{border-collapse:collapse;border-spacing:0;caption-side:bottom;width:100%}.mc-datatable__table>thead,.mc-datatable__table>tbody{background-color:#fff}.mc-datatable__table th,.mc-datatable__table td{border-bottom:1px solid #b3b3b3;text-align:left;vertical-align:middle;padding-right:1rem;padding-left:1rem}.mc-datatable thead th,.mc-datatable thead td{font-weight:700;font-size:.75rem;line-height:1.3333333333;color:#393879;text-transform:uppercase}.mc-datatable__head{align-items:center;display:flex;justify-content:space-between}.mc-datatable tbody tr:hover:not(.mc-datatable__empty){background-color:#eaedef}.mc-datatable tbody tr.selected{background-color:#d9f0f3}.mc-datatable tbody th,.mc-datatable tbody td{font-size:.875rem;line-height:1.2857142857;color:#191919}.mc-datatable__row-parent:not(.mc-datatable__row-parent--expanded)+.mc-datatable__row-expandable{height:0}.mc-datatable__row-parent:not(.mc-datatable__row-parent--expanded)+.mc-datatable__row-expandable .mc-datatable__row-inner{overflow:hidden;max-height:0}.mc-datatable__row-parent.mc-datatable__row-parent--expanded+.mc-datatable__row-expandable .mc-datatable__row-inner{max-height:100%}.mc-datatable__row-expandable>td{padding:0;border-bottom:0}.mc-datatable__row-expandable--offset-1 table th:first-child,.mc-datatable__row-expandable--offset-1 table td:first-child{padding-left:4.25rem}.mc-datatable__row-expandable--offset-2 table th:first-child,.mc-datatable__row-expandable--offset-2 table td:first-child{padding-left:7.75rem}.mc-datatable__cell-checkbox{width:3.25rem}.mc-datatable__cell-button{width:3.5rem}.mc-datatable__cell-field{min-width:9.375rem}td.mc-datatable__cell-number{text-align:right}.mc-datatable__empty,.mc-datatable__empty:hover{background-color:#e7e7f0}.mc-datatable__empty-cell{color:#4b4a8c}.mc-datatable__empty-content{font-size:1rem;line-height:1.375;align-items:center;color:#4b4a8c;display:flex;gap:1.5rem;min-height:19.375rem;justify-content:center;text-align:center}.mc-datatable__empty-content strong{font-size:1.125rem;line-height:1.3333333333}.mc-datatable--s .mc-datatable__table tr,.mc-datatable--s .mc-datatable thead th,.mc-datatable--s .mc-datatable thead td{height:2.4375rem}.mc-datatable--l .mc-datatable__table tr,.mc-datatable--l .mc-datatable thead th,.mc-datatable--l .mc-datatable thead td{height:3.4375rem}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky-header .mc-datatable__table>thead{box-shadow:0 4px 20px #19191933;top:0;z-index:2}.mc-datatable--sticky .mc-datatable__table>tbody tr:last-child th,.mc-datatable--sticky .mc-datatable__table>tbody tr:last-child td,.mc-datatable--sticky-header .mc-datatable__table>tbody tr:last-child th,.mc-datatable--sticky-header .mc-datatable__table>tbody tr:last-child td{border-bottom:transparent}.mc-datatable--sticky .mc-datatable__footer,.mc-datatable--sticky-header .mc-datatable__footer{border-top:1px solid #b3b3b3;position:relative;z-index:2}.mc-datatable--sticky .mc-datatable__main{padding-top:2.9375rem;transform:translateZ(0)}.mc-datatable--sticky .mc-datatable__table{scrollbar-color:#666666 #e6e6e6;scrollbar-width:thin;display:block;overflow-y:auto}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar{background-color:#e6e6e6;height:.5rem;width:.5rem}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar-track{background:#e6e6e6}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar-thumb{background:#666666}.mc-datatable--sticky .mc-datatable__table>thead{position:fixed;width:100%}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky .mc-datatable__table>tbody,.mc-datatable--sticky .mc-datatable__table>thead tr,.mc-datatable--sticky .mc-datatable__table>tbody tr,.mc-datatable--sticky .mc-datatable__table>thead th,.mc-datatable--sticky .mc-datatable__table>thead td,.mc-datatable--sticky .mc-datatable__table>tbody th,.mc-datatable--sticky .mc-datatable__table>tbody td{display:flex}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky .mc-datatable__table>tbody,.mc-datatable--sticky .mc-datatable__table>thead tr,.mc-datatable--sticky .mc-datatable__table>tbody tr{width:100%}.mc-datatable--sticky .mc-datatable__table>tbody{flex-direction:column}.mc-datatable--sticky .mc-datatable__table>thead th,.mc-datatable--sticky .mc-datatable__table>thead td,.mc-datatable--sticky .mc-datatable__table>tbody th,.mc-datatable--sticky .mc-datatable__table>tbody td{align-items:center}.mc-datatable--sticky .mc-datatable__table>thead th:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>thead td:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>tbody th:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>tbody td:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button){flex:1}.mc-datatable--sticky .mc-datatable__cell-checkbox,.mc-datatable--sticky .mc-datatable__cell-button,.mc-datatable--sticky .mc-datatable__cell-field,.mc-datatable--sticky .mc-datatable__cell-number{flex-shrink:0}.mc-datatable--sticky .mc-datatable__cell-number{justify-content:flex-end}.mc-datatable--sticky-header .mc-datatable__main{overflow-y:auto}.mc-datatable--sticky-header .mc-datatable__table>thead{position:sticky}.mc-datatable--overflow-visible .mc-datatable__container,.mc-datatable--overflow-visible .mc-datatable__main{overflow:visible}.mc-datatable__btn{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;align-items:center;background-color:transparent;display:flex}.mc-datatable__btn-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-datatable__btn-icon,.mc-datatable__btn svg{width:1.5rem;height:1.5rem}.mc-datatable__sort{font-weight:700;font-size:.75rem;line-height:1.3333333333;color:#393879;text-transform:uppercase;align-items:center;display:flex;height:100%;font-family:inherit;justify-content:space-between;width:100%}.mc-datatable__sort-arrow{align-items:center;display:flex;flex-direction:column;height:1.5rem;justify-content:space-around;margin-left:.5rem;width:1.5rem}.mc-datatable__sort-arrow:after,.mc-datatable__sort-arrow:before{background-color:#cdd4d8;content:\"\";flex-shrink:0;height:.5rem;width:.75rem}.mc-datatable__sort-arrow:before{clip-path:polygon(50% 0%,0% 100%,100% 100%)}.asc .mc-datatable__sort-arrow:before{background-color:#605f9d}.desc .mc-datatable__sort-arrow:before{display:none}.mc-datatable__sort-arrow:after{clip-path:polygon(0 0,100% 0,50% 100%)}.asc .mc-datatable__sort-arrow:after{display:none}.desc .mc-datatable__sort-arrow:after{background-color:#605f9d}.mc-datatable__options{width:1.5rem;height:1.5rem}.mc-datatable__expand .mc-datatable__btn-icon{fill:#007f8c}.mc-datatable .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-datatable__topbar{justify-content:space-between;padding-top:1rem;padding-bottom:1rem}.mc-datatable__topbar,.mc-datatable__topbar-edition,.mc-datatable__topbar-actions{display:flex;gap:1rem}.mc-datatable__topbar-edition,.mc-datatable__topbar-actions{flex-wrap:wrap}.mc-datatable__topbar-edition{flex-shrink:0}.mc-datatable__topbar-actions{align-items:center;justify-content:flex-end;margin-left:auto}.mc-datatable__filters{align-items:center;border-top:1px solid #b0bbc0;display:flex;flex-wrap:wrap;gap:1rem;justify-content:flex-end;padding-top:1rem;padding-bottom:1rem}.mc-datatable__footer{align-items:center;background-color:#fff;display:flex;padding:.75rem 1rem;gap:1rem}@media screen and (max-width: 679px){.mc-datatable__footer{flex-direction:column}}.mc-datatable__select{display:flex;align-items:center;gap:.5rem}.mc-datatable__select-label{font-size:.875rem;line-height:1.2857142857;color:#333;flex-shrink:0}.mc-datatable__count{font-size:.75rem;line-height:1.3333333333;color:#666}.mc-datatable__pagination{margin-left:auto}.mc-datatable__subtable{border-collapse:collapse;border-spacing:0;caption-side:bottom;width:100%;background-color:#e7e7f0}.mc-datatable__subtable th,.mc-datatable__subtable td{border-bottom-color:#a4a3c7}.mc-datatable__subtable thead th,.mc-datatable__subtable thead td{font-size:.75rem;line-height:1.3333333333;color:#1a1a4b}.mc-datatable__subtable tbody th,.mc-datatable__subtable tbody td{color:#1a1a4b}.fix-header-row{position:sticky;top:0;box-shadow:0 1px 5px #22202033;z-index:1}.header{align-items:center;display:flex;height:100%;font-family:inherit;justify-content:space-between;width:100%}.is-sorted-asc:before{background-color:var(--color-datatable-sort-arrow-active, #333333)}.is-sorted-desc:after{background-color:var(--color-datatable-sort-arrow-active, #333333)}.mc-datatable-height{height:100%}.mc-datatable__sort-arrow{cursor:pointer}.mc-datatable__fix-first-column{position:sticky;background-color:#fff;left:0}.skeleton-box{display:inline-block;position:relative;overflow:hidden;background-color:#ccc}.skeleton-box:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(255,255,255,.2) 20%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0));animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.checkbox-loading{width:25px;height:25px}.cells-loading{width:250px;height:25px}\n"] }]
+            args: [{ selector: 'moz-datatable', encapsulation: ViewEncapsulation.None, template: "<div class=\"mc-datatable mc-datatable-height\">\n  <div class=\"mc-datatable__header\">\n    <ng-content select=\"moz-datatable-caption\"></ng-content>\n    <div>\n      <moz-datatable-selection\n        [selectionSettings]=\"selectionSettings\"\n        [paginationEnabled]=\"datatableSettings?.activatePagination\"\n        [rowData]=\"datatableSettings?.rowData\"\n        (updateSelectionAllEmitter)=\"selectionAllRowEvent($event)\"\n      ></moz-datatable-selection>\n    </div>\n  </div>\n  <div class=\"mc-datatable__container mc-datatable-height\">\n    <div class=\"mc-datatable__main mc-datatable-height\">\n      <table class=\"mc-datatable__table\">\n        <thead [ngClass]=\"{ 'fix-header-row': datatableSettings?.fixHeaderRow }\">\n          <tr *ngIf=\"getColumns() && getColumns().length > 0\">\n            <th\n              class=\"mc-datatable__cell-checkbox moz-datatable__th mc-datatable__fix-first-column\"\n              *ngIf=\"\n                datatableSettings?.activateSelection && selectionComponent && selectionSettings\n              \"\n              #thSelection\n            >\n              <moz-checkbox\n                (change)=\"\n                  selectionComponent.onUdpateSelectionAllPageRows($event); selectionRowEvent($event)\n                \"\n                [indeterminate]=\"selectionComponent.isIndeterminate\"\n                [checked]=\"selectionSettings.allSelected && !selectionComponent.isIndeterminate\"\n                [disabled]=\"datatableSettings?.isLoading || false\"\n              >\n              </moz-checkbox>\n            </th>\n            <th\n              *ngIf=\"hasSubRow() && !datatableSettings?.isLoading\"\n              class=\"mc-datatable__fix-first-column\"\n              [style.left.px]=\"getStyleLeftForColumnFixed()\"\n              #thSubRow\n            ></th>\n            <ng-container *ngFor=\"let columnDef of getColumns()\">\n              <th\n                class=\"moz-datatable__th\"\n                *ngIf=\"!columnDef.hide\"\n                [ngClass]=\"{\n                  'mc-datatable__fix-first-column':\n                    datatableSettings?.fixFirstColumn &&\n                    getUnhiddenColumns()[0].field === columnDef.field\n                }\"\n                [style.left.px]=\"getLeftValueFixFirstColumn()\"\n              >\n                <ng-container *ngIf=\"datatableSettings?.isLoading; else notLoadingHeading\">\n                  <div class=\"skeleton-box mu-mb-100 cells-loading\"></div>\n                </ng-container>\n\n                <ng-template #notLoadingHeading>\n                  <div\n                    [mozDatatableSort]=\"columnDef\"\n                    [ngClass]=\"{ header: columnDef.sort }\"\n                    (sortEmitter)=\"sortEvent($event)\"\n                  >\n                    <ng-container\n                      *ngIf=\"\n                        getCustomHeader(columnDef.field) as customHeader;\n                        else defaultHeaderCell\n                      \"\n                    >\n                      <ng-container\n                        *ngTemplateOutlet=\"\n                          customHeader;\n                          context: {\n                            $implicit: {\n                              content: columnDef\n                            }\n                          }\n                        \"\n                      ></ng-container>\n                    </ng-container>\n                    <ng-template #defaultHeaderCell>\n                      {{ columnDef.headerName | uppercase }}\n                    </ng-template>\n                  </div>\n                </ng-template>\n              </th>\n            </ng-container>\n          </tr>\n        </thead>\n        <tbody>\n          <ng-container\n            *ngIf=\"\n              (datatableSettings?.rowData?.length || 0) > 0 || datatableSettings?.isLoading;\n              else emptyBody\n            \"\n          >\n            <ng-container *ngFor=\"let row of getFields(); index as i\">\n              <tr class=\"mc-datatable__row-parent\" (click)=\"rowClickEvent($event, row)\">\n                <td\n                  class=\"mc-datatable__fix-first-column\"\n                  *ngIf=\"datatableSettings?.activateSelection && selectionComponent\"\n                >\n                  <ng-container *ngIf=\"datatableSettings?.isLoading; else notLoadingCheckbox\">\n                    <div class=\"skeleton-box mu-mb-100 checkbox-loading\"></div>\n                  </ng-container>\n                  <ng-template #notLoadingCheckbox>\n                    <moz-checkbox\n                      (change)=\"\n                        selectionComponent.onUdpateSelectionRow(row); selectionRowEvent($event)\n                      \"\n                      [(ngModel)]=\"row.selected\"\n                      [checked]=\"row.selected || false\"\n                      [disabled]=\"row.disableSelection || false\"\n                    >\n                    </moz-checkbox>\n                  </ng-template>\n                </td>\n                <ng-container *ngIf=\"hasSubRow() && !datatableSettings?.isLoading\">\n                  <td\n                    *ngIf=\"row['subRow']; else noSubRow\"\n                    class=\"mc-datatable__cell-button mc-datatable__fix-first-column\"\n                    [style.left.px]=\"getStyleLeftForColumnFixed()\"\n                  >\n                    <button\n                      class=\"mc-datatable__expand mc-datatable__btn\"\n                      (click)=\"toggleRowExpansion(i); $event.stopPropagation()\"\n                    >\n                      <span class=\"mc-datatable__btn-icon\">\n                        <ng-container *ngIf=\"!expandedRows[i]; else subrowClosed\">\n                          <moz-icon [iconName]=\"'Navigation_Control_Circle--More_24px'\"></moz-icon>\n                        </ng-container>\n                        <ng-template #subrowClosed>\n                          <moz-icon [iconName]=\"'Navigation_Control_Circle--Less_24px'\"></moz-icon>\n                        </ng-template>\n                      </span>\n                    </button>\n                  </td>\n                  <ng-template #noSubRow\n                    ><td\n                      class=\"mc-datatable__cell-button mc-datatable__fix-first-column\"\n                      [style.left.px]=\"getStyleLeftForColumnFixed()\"\n                    ></td\n                  ></ng-template>\n                </ng-container>\n                <ng-container *ngFor=\"let columnDef of getColumns()\">\n                  <td\n                    *ngIf=\"!columnDef.hide\"\n                    [ngClass]=\"{\n                      'mc-datatable__fix-first-column':\n                        datatableSettings?.fixFirstColumn &&\n                        getUnhiddenColumns()[0].field === columnDef.field\n                    }\"\n                    [style.left.px]=\"getLeftValueFixFirstColumn()\"\n                  >\n                    <ng-container *ngIf=\"datatableSettings?.isLoading; else notLoadingCells\">\n                      <div class=\"skeleton-box mu-mb-100 cells-loading\"></div>\n                    </ng-container>\n                    <ng-template #notLoadingCells>\n                      <ng-container\n                        *ngIf=\"\n                          getCustomContent(columnDef.field) as customContent;\n                          else defaultContentCell\n                        \"\n                      >\n                        <ng-container\n                          *ngTemplateOutlet=\"\n                            customContent;\n                            context: {\n                              $implicit: {\n                                row: row,\n                                index: i,\n                                columnDefs: datatableSettings?.columnDefs,\n                                content: row[columnDef.field]\n                              }\n                            }\n                          \"\n                        ></ng-container>\n                      </ng-container>\n                      <ng-template #defaultContentCell>\n                        {{ row[columnDef.field] }}\n                      </ng-template>\n                    </ng-template>\n                  </td>\n                </ng-container>\n              </tr>\n              <ng-container>\n                <tr *ngIf=\"expandedRows[i]\">\n                  <td [attr.colspan]=\"getColspanForExpansionRow()\">\n                    <ng-container\n                      *ngIf=\"getCustomExpansionRowContent() as expansionRowContentComponent\"\n                    >\n                      <ng-container\n                        *ngTemplateOutlet=\"\n                        expansionRowContentComponent;\n                        context: {\n                          $implicit: {\n                            subRowContent: row['subRow'],\n                            index: i,\n                          }\n                        }\n                      \"\n                      ></ng-container>\n                    </ng-container>\n                  </td>\n                </tr>\n              </ng-container>\n            </ng-container>\n          </ng-container>\n          <ng-template #emptyBody>\n            <tr class=\"mc-datatable__empty\">\n              <td colspan=\"5\" class=\"mc-datatable__empty-cell\">\n                <div class=\"mc-datatable__empty-content\">\n                  <div>\n                    <div>\n                      <p>\n                        <strong>\n                          {{\n                            datatableSettings?.labels?.emptyBodyTitle || 'There is no result.'\n                          }}</strong\n                        ><br />\n                        {{\n                          datatableSettings?.labels?.emptyBodyDescription ||\n                            'Please try changing your filters.'\n                        }}\n                      </p>\n                    </div>\n                    <div *ngIf=\"datatableSettings?.activateEmptyBodyButton\">\n                      <button\n                        moz-button\n                        [theme]=\"'neutral'\"\n                        [size]=\"'s'\"\n                        [variation]=\"'bordered'\"\n                        (click)=\"emptyButtonClickEvent()\"\n                      >\n                        <moz-icon\n                          iconName=\"{{\n                            datatableSettings?.icons?.emptyBodyButtonIcon ||\n                              'Navigation_Display_Filter_24px'\n                          }}\"\n                        ></moz-icon>\n                        {{ datatableSettings?.labels?.emptyBodyButtonTitle || 'Change filters' }}\n                      </button>\n                    </div>\n                  </div>\n                </div>\n              </td>\n            </tr></ng-template\n          >\n        </tbody>\n      </table>\n    </div>\n    <moz-datatable-footer\n      *ngIf=\"datatableSettings?.activatePagination\"\n      [footerSettings]=\"footerSettings\"\n      [isLoading]=\"datatableSettings?.isLoading\"\n      (rowPerPageChangeEmitter)=\"rowPerPageChangeEvent($event)\"\n      (pageChangeEmitter)=\"pageChangeEvent($event)\"\n    ></moz-datatable-footer>\n  </div>\n</div>\n", styles: [".mc-datatable{font-family:Roboto,sans-serif;box-sizing:border-box}.mc-datatable *,.mc-datatable :after,.mc-datatable :before{box-sizing:inherit}.mc-datatable__container{border-radius:4px;box-shadow:0 1px 5px #19191933;background-color:#e7e7f0;overflow:hidden}.mc-datatable__main{scrollbar-color:#666666 #e6e6e6;scrollbar-width:thin;overflow:auto}.mc-datatable__main::-webkit-scrollbar{background-color:#e6e6e6;height:.5rem;width:.5rem}.mc-datatable__main::-webkit-scrollbar-track{background:#e6e6e6}.mc-datatable__main::-webkit-scrollbar-thumb{background:#666666}.mc-datatable__table tr,.mc-datatable thead th,.mc-datatable thead td{height:2.9375rem}.mc-datatable__table{border-collapse:collapse;border-spacing:0;caption-side:bottom;width:100%}.mc-datatable__table>thead,.mc-datatable__table>tbody{background-color:#fff}.mc-datatable__table th,.mc-datatable__table td{border-bottom:1px solid #b3b3b3;text-align:left;vertical-align:middle;padding-right:1rem;padding-left:1rem}.mc-datatable thead th,.mc-datatable thead td{font-weight:700;font-size:.75rem;line-height:1.3333333333;color:#393879;text-transform:uppercase}.mc-datatable__head{align-items:center;display:flex;justify-content:space-between}.mc-datatable tbody tr:hover:not(.mc-datatable__empty){background-color:#eaedef}.mc-datatable tbody tr.selected{background-color:#d9f0f3}.mc-datatable tbody th,.mc-datatable tbody td{font-size:.875rem;line-height:1.2857142857;color:#191919}.mc-datatable__row-parent:not(.mc-datatable__row-parent--expanded)+.mc-datatable__row-expandable{height:0}.mc-datatable__row-parent:not(.mc-datatable__row-parent--expanded)+.mc-datatable__row-expandable .mc-datatable__row-inner{overflow:hidden;max-height:0}.mc-datatable__row-parent.mc-datatable__row-parent--expanded+.mc-datatable__row-expandable .mc-datatable__row-inner{max-height:100%}.mc-datatable__row-expandable>td{padding:0;border-bottom:0}.mc-datatable__row-expandable--offset-1 table th:first-child,.mc-datatable__row-expandable--offset-1 table td:first-child{padding-left:4.25rem}.mc-datatable__row-expandable--offset-2 table th:first-child,.mc-datatable__row-expandable--offset-2 table td:first-child{padding-left:7.75rem}.mc-datatable__cell-checkbox{width:3.25rem}.mc-datatable__cell-button{width:3.5rem}.mc-datatable__cell-field{min-width:9.375rem}td.mc-datatable__cell-number{text-align:right}.mc-datatable__empty,.mc-datatable__empty:hover{background-color:#e7e7f0}.mc-datatable__empty-cell{color:#4b4a8c}.mc-datatable__empty-content{font-size:1rem;line-height:1.375;align-items:center;color:#4b4a8c;display:flex;gap:1.5rem;min-height:19.375rem;justify-content:center;text-align:center}.mc-datatable__empty-content strong{font-size:1.125rem;line-height:1.3333333333}.mc-datatable--s .mc-datatable__table tr,.mc-datatable--s .mc-datatable thead th,.mc-datatable--s .mc-datatable thead td{height:2.4375rem}.mc-datatable--l .mc-datatable__table tr,.mc-datatable--l .mc-datatable thead th,.mc-datatable--l .mc-datatable thead td{height:3.4375rem}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky-header .mc-datatable__table>thead{box-shadow:0 4px 20px #19191933;top:0;z-index:2}.mc-datatable--sticky .mc-datatable__table>tbody tr:last-child th,.mc-datatable--sticky .mc-datatable__table>tbody tr:last-child td,.mc-datatable--sticky-header .mc-datatable__table>tbody tr:last-child th,.mc-datatable--sticky-header .mc-datatable__table>tbody tr:last-child td{border-bottom:transparent}.mc-datatable--sticky .mc-datatable__footer,.mc-datatable--sticky-header .mc-datatable__footer{border-top:1px solid #b3b3b3;position:relative;z-index:2}.mc-datatable--sticky .mc-datatable__main{padding-top:2.9375rem;transform:translateZ(0)}.mc-datatable--sticky .mc-datatable__table{scrollbar-color:#666666 #e6e6e6;scrollbar-width:thin;display:block;overflow-y:auto}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar{background-color:#e6e6e6;height:.5rem;width:.5rem}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar-track{background:#e6e6e6}.mc-datatable--sticky .mc-datatable__table::-webkit-scrollbar-thumb{background:#666666}.mc-datatable--sticky .mc-datatable__table>thead{position:fixed;width:100%}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky .mc-datatable__table>tbody,.mc-datatable--sticky .mc-datatable__table>thead tr,.mc-datatable--sticky .mc-datatable__table>tbody tr,.mc-datatable--sticky .mc-datatable__table>thead th,.mc-datatable--sticky .mc-datatable__table>thead td,.mc-datatable--sticky .mc-datatable__table>tbody th,.mc-datatable--sticky .mc-datatable__table>tbody td{display:flex}.mc-datatable--sticky .mc-datatable__table>thead,.mc-datatable--sticky .mc-datatable__table>tbody,.mc-datatable--sticky .mc-datatable__table>thead tr,.mc-datatable--sticky .mc-datatable__table>tbody tr{width:100%}.mc-datatable--sticky .mc-datatable__table>tbody{flex-direction:column}.mc-datatable--sticky .mc-datatable__table>thead th,.mc-datatable--sticky .mc-datatable__table>thead td,.mc-datatable--sticky .mc-datatable__table>tbody th,.mc-datatable--sticky .mc-datatable__table>tbody td{align-items:center}.mc-datatable--sticky .mc-datatable__table>thead th:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>thead td:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>tbody th:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button),.mc-datatable--sticky .mc-datatable__table>tbody td:not(.mc-datatable__cell-checkbox):not(.mc-datatable__cell-button){flex:1}.mc-datatable--sticky .mc-datatable__cell-checkbox,.mc-datatable--sticky .mc-datatable__cell-button,.mc-datatable--sticky .mc-datatable__cell-field,.mc-datatable--sticky .mc-datatable__cell-number{flex-shrink:0}.mc-datatable--sticky .mc-datatable__cell-number{justify-content:flex-end}.mc-datatable--sticky-header .mc-datatable__main{overflow-y:auto}.mc-datatable--sticky-header .mc-datatable__table>thead{position:sticky}.mc-datatable--overflow-visible .mc-datatable__container,.mc-datatable--overflow-visible .mc-datatable__main{overflow:visible}.mc-datatable__btn{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;align-items:center;background-color:transparent;display:flex}.mc-datatable__btn-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-datatable__btn-icon,.mc-datatable__btn svg{width:1.5rem;height:1.5rem}.mc-datatable__sort{font-weight:700;font-size:.75rem;line-height:1.3333333333;color:#393879;text-transform:uppercase;align-items:center;display:flex;height:100%;font-family:inherit;justify-content:space-between;width:100%}.mc-datatable__sort-arrow{align-items:center;display:flex;flex-direction:column;height:1.5rem;justify-content:space-around;margin-left:.5rem;width:1.5rem}.mc-datatable__sort-arrow:after,.mc-datatable__sort-arrow:before{background-color:#cdd4d8;content:\"\";flex-shrink:0;height:.5rem;width:.75rem}.mc-datatable__sort-arrow:before{clip-path:polygon(50% 0%,0% 100%,100% 100%)}.asc .mc-datatable__sort-arrow:before{background-color:#605f9d}.desc .mc-datatable__sort-arrow:before{display:none}.mc-datatable__sort-arrow:after{clip-path:polygon(0 0,100% 0,50% 100%)}.asc .mc-datatable__sort-arrow:after{display:none}.desc .mc-datatable__sort-arrow:after{background-color:#605f9d}.mc-datatable__options{width:1.5rem;height:1.5rem}.mc-datatable__expand .mc-datatable__btn-icon{fill:#007f8c}.mc-datatable .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-datatable__topbar{justify-content:space-between;padding-top:1rem;padding-bottom:1rem}.mc-datatable__topbar,.mc-datatable__topbar-edition,.mc-datatable__topbar-actions{display:flex;gap:1rem}.mc-datatable__topbar-edition,.mc-datatable__topbar-actions{flex-wrap:wrap}.mc-datatable__topbar-edition{flex-shrink:0}.mc-datatable__topbar-actions{align-items:center;justify-content:flex-end;margin-left:auto}.mc-datatable__filters{align-items:center;border-top:1px solid #b0bbc0;display:flex;flex-wrap:wrap;gap:1rem;justify-content:flex-end;padding-top:1rem;padding-bottom:1rem}.mc-datatable__footer{align-items:center;background-color:#fff;display:flex;padding:.75rem 1rem;gap:1rem}@media screen and (max-width: 679px){.mc-datatable__footer{flex-direction:column}}.mc-datatable__select{display:flex;align-items:center;gap:.5rem}.mc-datatable__select-label{font-size:.875rem;line-height:1.2857142857;color:#333;flex-shrink:0}.mc-datatable__count{font-size:.75rem;line-height:1.3333333333;color:#666}.mc-datatable__pagination{margin-left:auto}.mc-datatable__subtable{border-collapse:collapse;border-spacing:0;caption-side:bottom;width:100%;background-color:#e7e7f0}.mc-datatable__subtable th,.mc-datatable__subtable td{border-bottom-color:#a4a3c7}.mc-datatable__subtable thead th,.mc-datatable__subtable thead td{font-size:.75rem;line-height:1.3333333333;color:#1a1a4b}.mc-datatable__subtable tbody th,.mc-datatable__subtable tbody td{color:#1a1a4b}.fix-header-row{position:sticky;top:0;box-shadow:0 1px 5px #22202033;z-index:1}.header{align-items:center;display:flex;height:100%;font-family:inherit;justify-content:space-between;width:100%}.is-sorted-asc:before{background-color:var(--color-datatable-sort-arrow-active, #333333)}.is-sorted-desc:after{background-color:var(--color-datatable-sort-arrow-active, #333333)}.mc-datatable-height{height:100%}.mc-datatable__sort-arrow{cursor:pointer}.mc-datatable__fix-first-column{position:sticky;background-color:#fff;left:0}.skeleton-box{display:inline-block;position:relative;overflow:hidden;background-color:#ccc}.skeleton-box:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(255,255,255,.2) 20%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0));animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.checkbox-loading{width:25px;height:25px}.cells-loading{width:250px;height:25px}\n"] }]
         }], propDecorators: { footerSettings: [{
                 type: Input
             }], selectionSettings: [{
@@ -3083,6 +3103,7 @@ class DropdownComponent {
             this.originalListboxParent.appendChild(this.listboxElementRef.nativeElement);
             this.originalListboxParent = null;
         }
+        this.control?.markAsTouched();
     }
     itemsSelectedListboxEvent(listboxItemSelected) {
         this.writeValue(listboxItemSelected);
@@ -3099,6 +3120,7 @@ class DropdownComponent {
             this.writeValue(this.selectedItems);
             this.control?.setValue(this.selectedItems);
             this.control?.markAsDirty();
+            this.control?.markAsTouched();
         }
     }
     getMultiSelectedLabel() {
@@ -3151,6 +3173,7 @@ class DropdownComponent {
         }
         this.control?.setValue(this.selectedItems);
         this.control?.markAsDirty();
+        this.control?.markAsTouched();
         this.cd.detectChanges();
     }
 }
@@ -3161,7 +3184,7 @@ DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", vers
             useExisting: forwardRef(() => DropdownComponent),
             multi: true,
         },
-    ], viewQueries: [{ propertyName: "taglistComponent", first: true, predicate: ["taglist"], descendants: true }, { propertyName: "listboxElementRef", first: true, predicate: ["listbox"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n  class=\"mc-dropdown mc-dropdown--clearable\"\n  [ngClass]=\"{ 'mc-dropdown--multi': multiple }\"\n  [ngStyle]=\"{\n    '--dropdown-tag-width':\n      !showSelectedTags && multiple && getSelectedListboxItems().length > 0 ? '3.5rem' : '',\n    '--dropdown-width': '100%'\n  }\"\n>\n  <div class=\"mc-dropdown__main\">\n    <moz-tag\n      *ngIf=\"!showSelectedTags && multiple && getSelectedListboxItems().length > 0\"\n      class=\"mc-dropdown__tag mc-tag-removable mc-tag-removable--s mc-autocomplete__tag\"\n      type=\"removable\"\n      [size]=\"'s'\"\n      (clickOnRemove)=\"clearFieldEvent()\"\n    >\n      {{ getSelectedListboxItems().length }}</moz-tag\n    >\n\n    <button\n      type=\"button\"\n      id=\"trigger\"\n      class=\"mc-select mc-dropdown__trigger mc-button--{{ size }}\"\n      [ngClass]=\"{\n        'is-open': openState,\n      }\"\n      aria-haspopup=\"listbox\"\n      title=\"Dropdown menu options\"\n      [disabled]=\"disabled\"\n      aria-expanded=\"false\"\n      (click)=\"openListbox()\"\n    >\n      <ng-container *ngIf=\"multiple; else monoSelection\">{{\n        getLabelFromMultipleSelection()\n      }}</ng-container>\n      <ng-template #monoSelection>{{ getLabelFromMonoSelection() }}</ng-template>\n    </button>\n\n    <div class=\"mc-dropdown__tools\">\n      <div class=\"mc-dropdown__loader mc-loader mc-loader--s\" *ngIf=\"loading\">\n        <span class=\"mc-loader__spinner\">\n          <moz-loader class=\"mc-loader__icon\" size=\"s\"></moz-loader>\n        </span>\n      </div>\n      <button\n        class=\"mc-dropdown__clear\"\n        type=\"button\"\n        *ngIf=\"canClearField()\"\n        (click)=\"clearFieldEvent()\"\n      >\n        <moz-icon\n          class=\"mc-dropdown__clear-icon\"\n          [iconName]=\"'Navigation_Control_Tag--Cross_24px'\"\n        ></moz-icon>\n        <span class=\"mc-autocomplete__clear-text\">Clear</span>\n      </button>\n    </div>\n  </div>\n  <moz-listbox\n    *ngIf=\"openState\"\n    #listbox\n    [listboxItems]=\"listboxItems\"\n    [isOpen]=\"openState\"\n    [multiple]=\"multiple\"\n    [selectedItems]=\"selectedItems\"\n    (itemsSelected)=\"itemsSelectedListboxEvent($event)\"\n  ></moz-listbox>\n</div>\n<div class=\"mc-dropdow__taglist\">\n  <moz-taglist\n    #taglist\n    *ngIf=\"showSelectedTags && multiple\"\n    (removeTag)=\"removeTagEvent($event)\"\n    [tagItems]=\"getTagItemsFromSelectedItems()\"\n    [max]=\"maxShowingSelectedTags\"\n    [layerTagsTitle]=\"layerTagsTitle\"\n    [layerTagsIcon]=\"layerTagsIcon\"\n  ></moz-taglist>\n</div>\n", styles: [".mc-select{font-family:Roboto,sans-serif;font-weight:400;box-sizing:border-box;outline:none;-webkit-appearance:none;appearance:none;padding:0;margin:0;box-shadow:none;border:none;font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\");background-color:#fff;background-repeat:no-repeat;background-size:1rem 1rem,1.5rem 1.5rem;border:1px solid #666666;border-radius:4px;color:#191919;transition:border-color .2s ease,box-shadow .2s ease;width:100%}.mc-select[type=number]::-webkit-inner-spin-button,.mc-select[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.mc-select[type=number]{-moz-appearance:textfield}.mc-select[type=search]::-webkit-search-decoration:hover,.mc-select[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-select::-ms-expand{display:none}.mc-select:hover{border-color:#191919}.mc-select:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-select:disabled{background-color:#e6e6e6;border-color:#e6e6e6;color:#666;cursor:not-allowed;opacity:1}.mc-select.is-invalid{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\"),url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiNjNjExMTIiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMTAxMCAxMEExMCAxMCAwIDAwMTIgMnptMCAxOGE4IDggMCAxMTgtOCA4IDggMCAwMS04IDh6Ii8+PHBhdGggZD0iTTEyIDdhMSAxIDAgMDAtMSAxdjQuMzhhMSAxIDAgMDAyIDBWOGExIDEgMCAwMC0xLTF6Ii8+PGNpcmNsZSBjeD0iMTIiIGN5PSIxNiIgcj0iMSIvPjwvc3ZnPg==);border-color:#c61112}.mc-select.is-valid{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\"),url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjNDZhNjEwIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiA0YTggOCAwIDExLTggOCA4IDggMCAwMTgtOG0wLTJhMTAgMTAgMCAxMDEwIDEwQTEwIDEwIDAgMDAxMiAyeiIvPjxwYXRoIGQ9Ik0xMC43MyAxNS43NWExIDEgMCAwMS0uNjgtLjI2bC0zLTIuNzRhMSAxIDAgMDExLjM2LTEuNDdsMi4yNSAyLjA4IDQuMzYtNC40MmExIDEgMCAxMTEuNDIgMS40MWwtNSA1LjFhMSAxIDAgMDEtLjcxLjN6Ii8+PC9zdmc+);border-color:#46a610}.mc-select--s{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}@media screen and (min-width: 680px){.mc-select--s\\@from-m{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1024px){.mc-select--s\\@from-l{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1280px){.mc-select--s\\@from-xl{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1920px){.mc-select--s\\@from-xxl{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}.mc-select--m{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}@media screen and (min-width: 680px){.mc-select--m\\@from-m{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1024px){.mc-select--m\\@from-l{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1280px){.mc-select--m\\@from-xl{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1920px){.mc-select--m\\@from-xxl{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}.mc-listbox{list-style:none;margin-left:0;padding-left:0;background-color:#fff;border:1px solid #666666;border-radius:3px;position:absolute;overflow-y:auto;margin-top:.25rem;margin-bottom:0;max-height:13.8125rem;min-width:auto;opacity:0;visibility:hidden;max-width:var(--listbox-width, auto);width:100%}.mc-listbox.is-open{opacity:1;visibility:visible;z-index:10}.mc-listbox::-webkit-scrollbar{background-color:#e6e6e6;width:.25rem}.mc-listbox::-webkit-scrollbar-thumb{background:#666666}.mc-listbox__item,.mc-listbox__tile{align-items:center;display:flex;gap:.5rem;min-height:3rem;padding-left:.75rem;padding-right:.75rem;position:relative;justify-content:space-between}.mc-listbox__item:not(:last-child),.mc-listbox__tile:not(:last-child){border-bottom:1px solid #b3b3b3}.mc-listbox__item:hover,.mc-listbox__tile:hover{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox__flag,.mc-listbox__icon{width:2rem;height:2rem}.mc-listbox__flag{font-size:1.4375rem;line-height:1.3913043478;text-align:center}.mc-listbox__empty{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-listbox__label{cursor:pointer;margin-right:auto}.mc-listbox__label:after{content:\"\";position:absolute;inset:0;z-index:2}.mc-listbox__input{order:1}.mc-listbox .is-checked,.mc-listbox .is-selected{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right .75rem center;background-size:1.5rem}.mc-listbox .is-focus{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox .is-disabled{cursor:not-allowed;box-shadow:none;background-color:#ccc;color:#666;pointer-events:none}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input:checked+.mc-listbox__label:before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;content:\"\";height:1.5rem;position:absolute;right:.75rem;top:0;transform:translateY(50%);width:1.5rem}.mc-listbox--left{right:0}.mc-loader{color:#007f8c;align-items:center;display:inline-flex;flex-direction:column}.mc-loader .mc-loader__spinner{height:2rem;width:2rem}.mc-loader .mc-loader__path{stroke-width:4}.mc-loader .mc-loader__path{stroke:currentColor}.mc-loader__spinner:not(:only-child){margin-bottom:1rem}.mc-loader__icon{animation:rotate-loader 2s linear infinite;transform-origin:center}.mc-loader__path{fill:none;stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round;animation:animate-dash-loader 2s ease-in-out infinite}.mc-loader__text{font-size:1rem;line-height:1.375;color:currentColor}.mc-loader--s .mc-loader__spinner{height:1.5rem;width:1.5rem}.mc-loader--s .mc-loader__path{stroke-width:4}.mc-loader--l .mc-loader__spinner{height:4rem;width:4rem}.mc-loader--l .mc-loader__path{stroke-width:8}.mc-loader--dark{color:#191919}.mc-loader--dark .mc-loader__path{stroke:currentColor}.mc-loader--light{color:#fff}.mc-loader--light .mc-loader__path{stroke:currentColor}@keyframes rotate-loader{0%{transform:rotate(0)}to{transform:rotate(270deg)}}@keyframes animate-dash-loader{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.mc-dropdown{align-self:start;position:relative;min-width:18rem;max-width:var(--dropdown-width, auto);width:100%}.mc-dropdown__tag,.mc-dropdown__tools{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.mc-dropdown__tag{left:.75rem}.mc-dropdown__trigger{display:block;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.mc-dropdown__trigger.is-open{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23000000' viewBox='0 0 16 16'%3E%3Cpath d='M2 10.5a1 1 0 01.29-.71l5-5a1 1 0 011.42 0l5 5a1 1 0 01-1.42 1.42L8 6.91l-4.29 4.3a1 1 0 01-1.42 0A1 1 0 012 10.5z'/%3E%3C/svg%3E\")}.mc-dropdown__tools{align-items:center;background-color:#fff;display:flex;gap:.5rem;justify-content:flex-end;right:2.5rem}.is-valid+.mc-dropdown__tools,.is-invalid+.mc-dropdown__tools{right:4.5rem}.mc-dropdown__clear{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;box-shadow:0 0 0 0 transparent;transition:box-shadow .15s ease;background:none;border-radius:50%}.mc-dropdown__clear:focus{box-shadow:0 0 0 2px #758992}.mc-dropdown__clear,.mc-dropdown__clear-icon{height:1.5rem;width:1.5rem}.mc-dropdown__clear-icon{fill:#666}.mc-dropdown__clear-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-dropdown--multi .mc-dropdown__trigger{padding-left:calc(.75rem + var(--dropdown-tag-width, 0px))}.mc-button{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;padding:0;color:#fff;background-color:#007f8c;font-family:Roboto,sans-serif;font-weight:700;font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem;cursor:pointer;border-radius:4px;text-align:center;border:2px solid transparent;transition:all ease .2s;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;align-items:stretch;box-sizing:border-box;fill:currentColor}.mc-button:hover{background-color:#006974;color:#fff}.mc-button:active{background-color:#006974}.mc-button:disabled,.mc-button.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button .mc-button__icon:first-child,.mc-button .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-button--s{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s .mc-button__icon:first-child,.mc-button--s .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}@media screen and (min-width: 680px){.mc-button--s\\@from-m{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-m .mc-button__icon:first-child,.mc-button--s\\@from-m .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1024px){.mc-button--s\\@from-l{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-l .mc-button__icon:first-child,.mc-button--s\\@from-l .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1280px){.mc-button--s\\@from-xl{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xl .mc-button__icon:first-child,.mc-button--s\\@from-xl .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1920px){.mc-button--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xxl .mc-button__icon:first-child,.mc-button--s\\@from-xxl .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}.mc-button--m{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m .mc-button__icon:first-child,.mc-button--m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}@media screen and (min-width: 680px){.mc-button--m\\@from-m{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-m .mc-button__icon:first-child,.mc-button--m\\@from-m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1024px){.mc-button--m\\@from-l{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-l .mc-button__icon:first-child,.mc-button--m\\@from-l .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1280px){.mc-button--m\\@from-xl{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl .mc-button__icon:first-child,.mc-button--m\\@from-xl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1920px){.mc-button--m\\@from-xxl{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl .mc-button__icon:first-child,.mc-button--m\\@from-xxl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}.mc-button--l{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l .mc-button__icon{width:2rem;height:2rem}.mc-button--l .mc-button__icon:first-child,.mc-button--l .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}@media screen and (min-width: 680px){.mc-button--l\\@from-m{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-m .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-m .mc-button__icon:first-child,.mc-button--l\\@from-m .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1024px){.mc-button--l\\@from-l{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-l .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-l .mc-button__icon:first-child,.mc-button--l\\@from-l .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1280px){.mc-button--l\\@from-xl{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xl .mc-button__icon:first-child,.mc-button--l\\@from-xl .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1920px){.mc-button--l\\@from-xxl{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xxl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xxl .mc-button__icon:first-child,.mc-button--l\\@from-xxl .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}.mc-button--fit{display:inline-flex;width:auto}@media screen and (min-width: 680px){.mc-button--fit\\@from-m{display:inline-flex;width:auto}}@media screen and (min-width: 1024px){.mc-button--fit\\@from-l{display:inline-flex;width:auto}}@media screen and (min-width: 1280px){.mc-button--fit\\@from-xl{display:inline-flex;width:auto}}@media screen and (min-width: 1920px){.mc-button--fit\\@from-xxl{display:inline-flex;width:auto}}.mc-button--full{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full{width:-webkit-fill-available;width:-moz-available;width:stretch}}@media screen and (min-width: 680px){.mc-button--full\\@from-m{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-m{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1024px){.mc-button--full\\@from-l{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-l{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1280px){.mc-button--full\\@from-xl{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-xl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1920px){.mc-button--full\\@from-xxl{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-xxl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}.mc-button--square{align-items:center;height:0;padding:0}@media screen and (min-width: 1024px){.mc-button--square{padding:0}}.mc-button__icon{flex-shrink:0}.mc-button__icon:last-child{margin-left:.5rem;margin-right:-.25rem}.mc-button__icon:first-child{margin-right:.5rem;margin-left:-.25rem}.mc-button__icon:only-child{margin:0}.mc-button__label{align-items:center;display:flex;pointer-events:none}a.mc-button:disabled,a.mc-button.is-disabled{pointer-events:none}.mc-button--solid-primary-02{background-color:#6a7081}.mc-button--solid-primary-02:hover{background-color:#242938}.mc-button--solid-primary-02:active{background-color:#171b26}.mc-button--solid-primary-02:disabled,.mc-button--solid-primary-02.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--solid-neutral{background-color:#333}.mc-button--solid-neutral:hover{background-color:#191919}.mc-button--solid-neutral:active{background-color:#333}.mc-button--solid-neutral:disabled,.mc-button--solid-neutral.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--solid-danger{background-color:#c61112}.mc-button--solid-danger:hover,.mc-button--solid-danger:active{background-color:#8c0003}.mc-button--solid-danger:disabled,.mc-button--solid-danger.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered{color:#007f8c;border-color:#007f8c;background-color:#fff}.mc-button--bordered:hover{background-color:#d9f0f3;color:#006974}.mc-button--bordered:active{background-color:#91d5db;color:#004e57}.mc-button--bordered:disabled,.mc-button--bordered.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-primary-02{color:#6a7081;border-color:#6a7081;background-color:#fff}.mc-button--bordered-primary-02:hover{background-color:#eeeff1;color:#6a7081}.mc-button--bordered-primary-02:active{background-color:#cfd2d8}.mc-button--bordered-primary-02:disabled,.mc-button--bordered-primary-02.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-neutral{color:#333;border-color:#333;background-color:#fff}.mc-button--bordered-neutral:hover{background-color:#e6e6e6;color:#333}.mc-button--bordered-neutral:active{background-color:#ccc}.mc-button--bordered-neutral:disabled,.mc-button--bordered-neutral.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-danger{color:#c61112;border-color:#c61112;background-color:#fff}.mc-button--bordered-danger:hover{background-color:#fdeaea;color:#8c0003}.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger:disabled,.mc-button--bordered-danger.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-dropdow__taglist{margin-top:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ListboxComponent, selector: "moz-listbox", inputs: ["listboxItems", "multiple", "isOpen", "selectedItems", "customMaxWidth"], outputs: ["itemsSelected"] }, { kind: "component", type: LoaderComponent, selector: "moz-loader", inputs: ["size", "theme", "isOverlay", "text", "hideOverlay"] }, { kind: "component", type: IconComponent, selector: "moz-icon", inputs: ["iconName"] }, { kind: "component", type: TagComponent, selector: "moz-tag, a[moz-tag]", inputs: ["type", "size", "select"], outputs: ["selectChange", "clickOnRemove"] }, { kind: "component", type: TaglistComponent, selector: "moz-taglist", inputs: ["tagItems", "tagSize", "showAllTitle", "showAll", "layerTagsTitle", "layerTagsIcon", "max"], outputs: ["removeTag"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], viewQueries: [{ propertyName: "taglistComponent", first: true, predicate: ["taglist"], descendants: true }, { propertyName: "listboxElementRef", first: true, predicate: ["listbox"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n  class=\"mc-dropdown mc-dropdown--clearable\"\n  [ngClass]=\"{ 'mc-dropdown--multi': multiple }\"\n  [ngStyle]=\"{\n    '--dropdown-tag-width':\n      !showSelectedTags && multiple && getSelectedListboxItems().length > 0 ? '3.5rem' : '',\n    '--dropdown-width': '100%'\n  }\"\n>\n  <div class=\"mc-dropdown__main\">\n    <moz-tag\n      *ngIf=\"!showSelectedTags && multiple && getSelectedListboxItems().length > 0\"\n      class=\"mc-dropdown__tag mc-tag-removable mc-tag-removable--s mc-autocomplete__tag\"\n      type=\"removable\"\n      [size]=\"'s'\"\n      (clickOnRemove)=\"clearFieldEvent()\"\n    >\n      {{ getSelectedListboxItems().length }}</moz-tag\n    >\n\n    <button\n      type=\"button\"\n      id=\"trigger\"\n      class=\"mc-select mc-dropdown__trigger mc-button--{{ size }}\"\n      [ngClass]=\"{\n        'is-open': openState,\n      }\"\n      aria-haspopup=\"listbox\"\n      title=\"Dropdown menu options\"\n      [disabled]=\"disabled\"\n      aria-expanded=\"false\"\n      (click)=\"openListbox()\"\n    >\n      <ng-container *ngIf=\"multiple; else monoSelection\">{{\n        getLabelFromMultipleSelection()\n      }}</ng-container>\n      <ng-template #monoSelection>{{ getLabelFromMonoSelection() }}</ng-template>\n    </button>\n\n    <div class=\"mc-dropdown__tools\">\n      <div class=\"mc-dropdown__loader mc-loader mc-loader--s\" *ngIf=\"loading\">\n        <span class=\"mc-loader__spinner\">\n          <moz-loader class=\"mc-loader__icon\" size=\"s\"></moz-loader>\n        </span>\n      </div>\n      <button\n        class=\"mc-dropdown__clear\"\n        type=\"button\"\n        *ngIf=\"canClearField()\"\n        (click)=\"clearFieldEvent()\"\n      >\n        <moz-icon\n          class=\"mc-dropdown__clear-icon\"\n          [iconName]=\"'Navigation_Control_Tag--Cross_24px'\"\n        ></moz-icon>\n        <span class=\"mc-autocomplete__clear-text\">Clear</span>\n      </button>\n    </div>\n  </div>\n  <moz-listbox\n    *ngIf=\"openState\"\n    #listbox\n    [listboxItems]=\"listboxItems\"\n    [isOpen]=\"openState\"\n    [multiple]=\"multiple\"\n    [selectedItems]=\"selectedItems\"\n    (itemsSelected)=\"itemsSelectedListboxEvent($event)\"\n  ></moz-listbox>\n</div>\n<div class=\"mc-dropdow__taglist\" *ngIf=\"showSelectedTags && multiple\">\n  <moz-taglist\n    #taglist\n    (removeTag)=\"removeTagEvent($event)\"\n    [tagItems]=\"getTagItemsFromSelectedItems()\"\n    [max]=\"maxShowingSelectedTags\"\n    [layerTagsTitle]=\"layerTagsTitle\"\n    [layerTagsIcon]=\"layerTagsIcon\"\n  ></moz-taglist>\n</div>\n", styles: [".mc-select{font-family:Roboto,sans-serif;font-weight:400;box-sizing:border-box;outline:none;-webkit-appearance:none;appearance:none;padding:0;margin:0;box-shadow:none;border:none;font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\");background-color:#fff;background-repeat:no-repeat;background-size:1rem 1rem,1.5rem 1.5rem;border:1px solid #666666;border-radius:4px;color:#191919;transition:border-color .2s ease,box-shadow .2s ease;width:100%}.mc-select[type=number]::-webkit-inner-spin-button,.mc-select[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.mc-select[type=number]{-moz-appearance:textfield}.mc-select[type=search]::-webkit-search-decoration:hover,.mc-select[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-select::-ms-expand{display:none}.mc-select:hover{border-color:#191919}.mc-select:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-select:disabled{background-color:#e6e6e6;border-color:#e6e6e6;color:#666;cursor:not-allowed;opacity:1}.mc-select.is-invalid{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\"),url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiNjNjExMTIiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMTAxMCAxMEExMCAxMCAwIDAwMTIgMnptMCAxOGE4IDggMCAxMTgtOCA4IDggMCAwMS04IDh6Ii8+PHBhdGggZD0iTTEyIDdhMSAxIDAgMDAtMSAxdjQuMzhhMSAxIDAgMDAyIDBWOGExIDEgMCAwMC0xLTF6Ii8+PGNpcmNsZSBjeD0iMTIiIGN5PSIxNiIgcj0iMSIvPjwvc3ZnPg==);border-color:#c61112}.mc-select.is-valid{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\"),url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjNDZhNjEwIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiA0YTggOCAwIDExLTggOCA4IDggMCAwMTgtOG0wLTJhMTAgMTAgMCAxMDEwIDEwQTEwIDEwIDAgMDAxMiAyeiIvPjxwYXRoIGQ9Ik0xMC43MyAxNS43NWExIDEgMCAwMS0uNjgtLjI2bC0zLTIuNzRhMSAxIDAgMDExLjM2LTEuNDdsMi4yNSAyLjA4IDQuMzYtNC40MmExIDEgMCAxMTEuNDIgMS40MWwtNSA1LjFhMSAxIDAgMDEtLjcxLjN6Ii8+PC9zdmc+);border-color:#46a610}.mc-select--s{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}@media screen and (min-width: 680px){.mc-select--s\\@from-m{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1024px){.mc-select--s\\@from-l{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1280px){.mc-select--s\\@from-xl{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1920px){.mc-select--s\\@from-xxl{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}.mc-select--m{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}@media screen and (min-width: 680px){.mc-select--m\\@from-m{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1024px){.mc-select--m\\@from-l{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1280px){.mc-select--m\\@from-xl{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1920px){.mc-select--m\\@from-xxl{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}.mc-listbox{list-style:none;margin-left:0;padding-left:0;background-color:#fff;border:1px solid #666666;border-radius:3px;position:absolute;overflow-y:auto;margin-top:.25rem;margin-bottom:0;max-height:13.8125rem;min-width:auto;opacity:0;visibility:hidden;max-width:var(--listbox-width, auto);width:100%}.mc-listbox.is-open{opacity:1;visibility:visible;z-index:10}.mc-listbox::-webkit-scrollbar{background-color:#e6e6e6;width:.25rem}.mc-listbox::-webkit-scrollbar-thumb{background:#666666}.mc-listbox__item,.mc-listbox__tile{align-items:center;display:flex;gap:.5rem;min-height:3rem;padding-left:.75rem;padding-right:.75rem;position:relative;justify-content:space-between}.mc-listbox__item:not(:last-child),.mc-listbox__tile:not(:last-child){border-bottom:1px solid #b3b3b3}.mc-listbox__item:hover,.mc-listbox__tile:hover{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox__flag,.mc-listbox__icon{width:2rem;height:2rem}.mc-listbox__flag{font-size:1.4375rem;line-height:1.3913043478;text-align:center}.mc-listbox__empty{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-listbox__label{cursor:pointer;margin-right:auto}.mc-listbox__label:after{content:\"\";position:absolute;inset:0;z-index:2}.mc-listbox__input{order:1}.mc-listbox .is-checked,.mc-listbox .is-selected{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right .75rem center;background-size:1.5rem}.mc-listbox .is-focus{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox .is-disabled{cursor:not-allowed;box-shadow:none;background-color:#ccc;color:#666;pointer-events:none}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input:checked+.mc-listbox__label:before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;content:\"\";height:1.5rem;position:absolute;right:.75rem;top:0;transform:translateY(50%);width:1.5rem}.mc-listbox--left{right:0}.mc-loader{color:#007f8c;align-items:center;display:inline-flex;flex-direction:column}.mc-loader .mc-loader__spinner{height:2rem;width:2rem}.mc-loader .mc-loader__path{stroke-width:4}.mc-loader .mc-loader__path{stroke:currentColor}.mc-loader__spinner:not(:only-child){margin-bottom:1rem}.mc-loader__icon{animation:rotate-loader 2s linear infinite;transform-origin:center}.mc-loader__path{fill:none;stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round;animation:animate-dash-loader 2s ease-in-out infinite}.mc-loader__text{font-size:1rem;line-height:1.375;color:currentColor}.mc-loader--s .mc-loader__spinner{height:1.5rem;width:1.5rem}.mc-loader--s .mc-loader__path{stroke-width:4}.mc-loader--l .mc-loader__spinner{height:4rem;width:4rem}.mc-loader--l .mc-loader__path{stroke-width:8}.mc-loader--dark{color:#191919}.mc-loader--dark .mc-loader__path{stroke:currentColor}.mc-loader--light{color:#fff}.mc-loader--light .mc-loader__path{stroke:currentColor}@keyframes rotate-loader{0%{transform:rotate(0)}to{transform:rotate(270deg)}}@keyframes animate-dash-loader{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.mc-dropdown{align-self:start;position:relative;min-width:18rem;max-width:var(--dropdown-width, auto);width:100%}.mc-dropdown__tag,.mc-dropdown__tools{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.mc-dropdown__tag{left:.75rem}.mc-dropdown__trigger{display:block;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.mc-dropdown__trigger.is-open{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23000000' viewBox='0 0 16 16'%3E%3Cpath d='M2 10.5a1 1 0 01.29-.71l5-5a1 1 0 011.42 0l5 5a1 1 0 01-1.42 1.42L8 6.91l-4.29 4.3a1 1 0 01-1.42 0A1 1 0 012 10.5z'/%3E%3C/svg%3E\")}.mc-dropdown__tools{align-items:center;background-color:#fff;display:flex;gap:.5rem;justify-content:flex-end;right:2.5rem}.is-valid+.mc-dropdown__tools,.is-invalid+.mc-dropdown__tools{right:4.5rem}.mc-dropdown__clear{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;box-shadow:0 0 0 0 transparent;transition:box-shadow .15s ease;background:none;border-radius:50%}.mc-dropdown__clear:focus{box-shadow:0 0 0 2px #758992}.mc-dropdown__clear,.mc-dropdown__clear-icon{height:1.5rem;width:1.5rem}.mc-dropdown__clear-icon{fill:#666}.mc-dropdown__clear-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-dropdown--multi .mc-dropdown__trigger{padding-left:calc(.75rem + var(--dropdown-tag-width, 0px))}.mc-button{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;padding:0;color:#fff;background-color:#007f8c;font-family:Roboto,sans-serif;font-weight:700;font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem;cursor:pointer;border-radius:4px;text-align:center;border:2px solid transparent;transition:all ease .2s;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;align-items:stretch;box-sizing:border-box;fill:currentColor}.mc-button:hover{background-color:#006974;color:#fff}.mc-button:active{background-color:#006974}.mc-button:disabled,.mc-button.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button .mc-button__icon:first-child,.mc-button .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-button--s{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s .mc-button__icon:first-child,.mc-button--s .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}@media screen and (min-width: 680px){.mc-button--s\\@from-m{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-m .mc-button__icon:first-child,.mc-button--s\\@from-m .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1024px){.mc-button--s\\@from-l{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-l .mc-button__icon:first-child,.mc-button--s\\@from-l .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1280px){.mc-button--s\\@from-xl{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xl .mc-button__icon:first-child,.mc-button--s\\@from-xl .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1920px){.mc-button--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xxl .mc-button__icon:first-child,.mc-button--s\\@from-xxl .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}.mc-button--m{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m .mc-button__icon:first-child,.mc-button--m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}@media screen and (min-width: 680px){.mc-button--m\\@from-m{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-m .mc-button__icon:first-child,.mc-button--m\\@from-m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1024px){.mc-button--m\\@from-l{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-l .mc-button__icon:first-child,.mc-button--m\\@from-l .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1280px){.mc-button--m\\@from-xl{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl .mc-button__icon:first-child,.mc-button--m\\@from-xl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1920px){.mc-button--m\\@from-xxl{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl .mc-button__icon:first-child,.mc-button--m\\@from-xxl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}.mc-button--l{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l .mc-button__icon{width:2rem;height:2rem}.mc-button--l .mc-button__icon:first-child,.mc-button--l .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}@media screen and (min-width: 680px){.mc-button--l\\@from-m{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-m .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-m .mc-button__icon:first-child,.mc-button--l\\@from-m .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1024px){.mc-button--l\\@from-l{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-l .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-l .mc-button__icon:first-child,.mc-button--l\\@from-l .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1280px){.mc-button--l\\@from-xl{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xl .mc-button__icon:first-child,.mc-button--l\\@from-xl .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1920px){.mc-button--l\\@from-xxl{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xxl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xxl .mc-button__icon:first-child,.mc-button--l\\@from-xxl .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}.mc-button--fit{display:inline-flex;width:auto}@media screen and (min-width: 680px){.mc-button--fit\\@from-m{display:inline-flex;width:auto}}@media screen and (min-width: 1024px){.mc-button--fit\\@from-l{display:inline-flex;width:auto}}@media screen and (min-width: 1280px){.mc-button--fit\\@from-xl{display:inline-flex;width:auto}}@media screen and (min-width: 1920px){.mc-button--fit\\@from-xxl{display:inline-flex;width:auto}}.mc-button--full{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full{width:-webkit-fill-available;width:-moz-available;width:stretch}}@media screen and (min-width: 680px){.mc-button--full\\@from-m{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-m{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1024px){.mc-button--full\\@from-l{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-l{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1280px){.mc-button--full\\@from-xl{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-xl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1920px){.mc-button--full\\@from-xxl{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-xxl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}.mc-button--square{align-items:center;height:0;padding:0}@media screen and (min-width: 1024px){.mc-button--square{padding:0}}.mc-button__icon{flex-shrink:0}.mc-button__icon:last-child{margin-left:.5rem;margin-right:-.25rem}.mc-button__icon:first-child{margin-right:.5rem;margin-left:-.25rem}.mc-button__icon:only-child{margin:0}.mc-button__label{align-items:center;display:flex;pointer-events:none}a.mc-button:disabled,a.mc-button.is-disabled{pointer-events:none}.mc-button--solid-primary-02{background-color:#6a7081}.mc-button--solid-primary-02:hover{background-color:#242938}.mc-button--solid-primary-02:active{background-color:#171b26}.mc-button--solid-primary-02:disabled,.mc-button--solid-primary-02.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--solid-neutral{background-color:#333}.mc-button--solid-neutral:hover{background-color:#191919}.mc-button--solid-neutral:active{background-color:#333}.mc-button--solid-neutral:disabled,.mc-button--solid-neutral.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--solid-danger{background-color:#c61112}.mc-button--solid-danger:hover,.mc-button--solid-danger:active{background-color:#8c0003}.mc-button--solid-danger:disabled,.mc-button--solid-danger.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered{color:#007f8c;border-color:#007f8c;background-color:#fff}.mc-button--bordered:hover{background-color:#d9f0f3;color:#006974}.mc-button--bordered:active{background-color:#91d5db;color:#004e57}.mc-button--bordered:disabled,.mc-button--bordered.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-primary-02{color:#6a7081;border-color:#6a7081;background-color:#fff}.mc-button--bordered-primary-02:hover{background-color:#eeeff1;color:#6a7081}.mc-button--bordered-primary-02:active{background-color:#cfd2d8}.mc-button--bordered-primary-02:disabled,.mc-button--bordered-primary-02.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-neutral{color:#333;border-color:#333;background-color:#fff}.mc-button--bordered-neutral:hover{background-color:#e6e6e6;color:#333}.mc-button--bordered-neutral:active{background-color:#ccc}.mc-button--bordered-neutral:disabled,.mc-button--bordered-neutral.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-danger{color:#c61112;border-color:#c61112;background-color:#fff}.mc-button--bordered-danger:hover{background-color:#fdeaea;color:#8c0003}.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger:disabled,.mc-button--bordered-danger.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-dropdow__taglist{margin-top:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ListboxComponent, selector: "moz-listbox", inputs: ["listboxItems", "multiple", "isOpen", "selectedItems", "customMaxWidth"], outputs: ["itemsSelected"] }, { kind: "component", type: LoaderComponent, selector: "moz-loader", inputs: ["size", "theme", "isOverlay", "text", "hideOverlay"] }, { kind: "component", type: IconComponent, selector: "moz-icon", inputs: ["iconName"] }, { kind: "component", type: TagComponent, selector: "moz-tag, a[moz-tag]", inputs: ["type", "size", "select"], outputs: ["selectChange", "clickOnRemove"] }, { kind: "component", type: TaglistComponent, selector: "moz-taglist", inputs: ["tagItems", "tagSize", "showAllTitle", "showAll", "layerTagsTitle", "layerTagsIcon", "max"], outputs: ["removeTag"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DropdownComponent, decorators: [{
             type: Component,
             args: [{ selector: 'moz-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
@@ -3170,7 +3193,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                             useExisting: forwardRef(() => DropdownComponent),
                             multi: true,
                         },
-                    ], template: "<div\n  class=\"mc-dropdown mc-dropdown--clearable\"\n  [ngClass]=\"{ 'mc-dropdown--multi': multiple }\"\n  [ngStyle]=\"{\n    '--dropdown-tag-width':\n      !showSelectedTags && multiple && getSelectedListboxItems().length > 0 ? '3.5rem' : '',\n    '--dropdown-width': '100%'\n  }\"\n>\n  <div class=\"mc-dropdown__main\">\n    <moz-tag\n      *ngIf=\"!showSelectedTags && multiple && getSelectedListboxItems().length > 0\"\n      class=\"mc-dropdown__tag mc-tag-removable mc-tag-removable--s mc-autocomplete__tag\"\n      type=\"removable\"\n      [size]=\"'s'\"\n      (clickOnRemove)=\"clearFieldEvent()\"\n    >\n      {{ getSelectedListboxItems().length }}</moz-tag\n    >\n\n    <button\n      type=\"button\"\n      id=\"trigger\"\n      class=\"mc-select mc-dropdown__trigger mc-button--{{ size }}\"\n      [ngClass]=\"{\n        'is-open': openState,\n      }\"\n      aria-haspopup=\"listbox\"\n      title=\"Dropdown menu options\"\n      [disabled]=\"disabled\"\n      aria-expanded=\"false\"\n      (click)=\"openListbox()\"\n    >\n      <ng-container *ngIf=\"multiple; else monoSelection\">{{\n        getLabelFromMultipleSelection()\n      }}</ng-container>\n      <ng-template #monoSelection>{{ getLabelFromMonoSelection() }}</ng-template>\n    </button>\n\n    <div class=\"mc-dropdown__tools\">\n      <div class=\"mc-dropdown__loader mc-loader mc-loader--s\" *ngIf=\"loading\">\n        <span class=\"mc-loader__spinner\">\n          <moz-loader class=\"mc-loader__icon\" size=\"s\"></moz-loader>\n        </span>\n      </div>\n      <button\n        class=\"mc-dropdown__clear\"\n        type=\"button\"\n        *ngIf=\"canClearField()\"\n        (click)=\"clearFieldEvent()\"\n      >\n        <moz-icon\n          class=\"mc-dropdown__clear-icon\"\n          [iconName]=\"'Navigation_Control_Tag--Cross_24px'\"\n        ></moz-icon>\n        <span class=\"mc-autocomplete__clear-text\">Clear</span>\n      </button>\n    </div>\n  </div>\n  <moz-listbox\n    *ngIf=\"openState\"\n    #listbox\n    [listboxItems]=\"listboxItems\"\n    [isOpen]=\"openState\"\n    [multiple]=\"multiple\"\n    [selectedItems]=\"selectedItems\"\n    (itemsSelected)=\"itemsSelectedListboxEvent($event)\"\n  ></moz-listbox>\n</div>\n<div class=\"mc-dropdow__taglist\">\n  <moz-taglist\n    #taglist\n    *ngIf=\"showSelectedTags && multiple\"\n    (removeTag)=\"removeTagEvent($event)\"\n    [tagItems]=\"getTagItemsFromSelectedItems()\"\n    [max]=\"maxShowingSelectedTags\"\n    [layerTagsTitle]=\"layerTagsTitle\"\n    [layerTagsIcon]=\"layerTagsIcon\"\n  ></moz-taglist>\n</div>\n", styles: [".mc-select{font-family:Roboto,sans-serif;font-weight:400;box-sizing:border-box;outline:none;-webkit-appearance:none;appearance:none;padding:0;margin:0;box-shadow:none;border:none;font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\");background-color:#fff;background-repeat:no-repeat;background-size:1rem 1rem,1.5rem 1.5rem;border:1px solid #666666;border-radius:4px;color:#191919;transition:border-color .2s ease,box-shadow .2s ease;width:100%}.mc-select[type=number]::-webkit-inner-spin-button,.mc-select[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.mc-select[type=number]{-moz-appearance:textfield}.mc-select[type=search]::-webkit-search-decoration:hover,.mc-select[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-select::-ms-expand{display:none}.mc-select:hover{border-color:#191919}.mc-select:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-select:disabled{background-color:#e6e6e6;border-color:#e6e6e6;color:#666;cursor:not-allowed;opacity:1}.mc-select.is-invalid{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\"),url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiNjNjExMTIiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMTAxMCAxMEExMCAxMCAwIDAwMTIgMnptMCAxOGE4IDggMCAxMTgtOCA4IDggMCAwMS04IDh6Ii8+PHBhdGggZD0iTTEyIDdhMSAxIDAgMDAtMSAxdjQuMzhhMSAxIDAgMDAyIDBWOGExIDEgMCAwMC0xLTF6Ii8+PGNpcmNsZSBjeD0iMTIiIGN5PSIxNiIgcj0iMSIvPjwvc3ZnPg==);border-color:#c61112}.mc-select.is-valid{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\"),url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjNDZhNjEwIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiA0YTggOCAwIDExLTggOCA4IDggMCAwMTgtOG0wLTJhMTAgMTAgMCAxMDEwIDEwQTEwIDEwIDAgMDAxMiAyeiIvPjxwYXRoIGQ9Ik0xMC43MyAxNS43NWExIDEgMCAwMS0uNjgtLjI2bC0zLTIuNzRhMSAxIDAgMDExLjM2LTEuNDdsMi4yNSAyLjA4IDQuMzYtNC40MmExIDEgMCAxMTEuNDIgMS40MWwtNSA1LjFhMSAxIDAgMDEtLjcxLjN6Ii8+PC9zdmc+);border-color:#46a610}.mc-select--s{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}@media screen and (min-width: 680px){.mc-select--s\\@from-m{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1024px){.mc-select--s\\@from-l{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1280px){.mc-select--s\\@from-xl{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1920px){.mc-select--s\\@from-xxl{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}.mc-select--m{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}@media screen and (min-width: 680px){.mc-select--m\\@from-m{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1024px){.mc-select--m\\@from-l{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1280px){.mc-select--m\\@from-xl{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1920px){.mc-select--m\\@from-xxl{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}.mc-listbox{list-style:none;margin-left:0;padding-left:0;background-color:#fff;border:1px solid #666666;border-radius:3px;position:absolute;overflow-y:auto;margin-top:.25rem;margin-bottom:0;max-height:13.8125rem;min-width:auto;opacity:0;visibility:hidden;max-width:var(--listbox-width, auto);width:100%}.mc-listbox.is-open{opacity:1;visibility:visible;z-index:10}.mc-listbox::-webkit-scrollbar{background-color:#e6e6e6;width:.25rem}.mc-listbox::-webkit-scrollbar-thumb{background:#666666}.mc-listbox__item,.mc-listbox__tile{align-items:center;display:flex;gap:.5rem;min-height:3rem;padding-left:.75rem;padding-right:.75rem;position:relative;justify-content:space-between}.mc-listbox__item:not(:last-child),.mc-listbox__tile:not(:last-child){border-bottom:1px solid #b3b3b3}.mc-listbox__item:hover,.mc-listbox__tile:hover{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox__flag,.mc-listbox__icon{width:2rem;height:2rem}.mc-listbox__flag{font-size:1.4375rem;line-height:1.3913043478;text-align:center}.mc-listbox__empty{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-listbox__label{cursor:pointer;margin-right:auto}.mc-listbox__label:after{content:\"\";position:absolute;inset:0;z-index:2}.mc-listbox__input{order:1}.mc-listbox .is-checked,.mc-listbox .is-selected{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right .75rem center;background-size:1.5rem}.mc-listbox .is-focus{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox .is-disabled{cursor:not-allowed;box-shadow:none;background-color:#ccc;color:#666;pointer-events:none}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input:checked+.mc-listbox__label:before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;content:\"\";height:1.5rem;position:absolute;right:.75rem;top:0;transform:translateY(50%);width:1.5rem}.mc-listbox--left{right:0}.mc-loader{color:#007f8c;align-items:center;display:inline-flex;flex-direction:column}.mc-loader .mc-loader__spinner{height:2rem;width:2rem}.mc-loader .mc-loader__path{stroke-width:4}.mc-loader .mc-loader__path{stroke:currentColor}.mc-loader__spinner:not(:only-child){margin-bottom:1rem}.mc-loader__icon{animation:rotate-loader 2s linear infinite;transform-origin:center}.mc-loader__path{fill:none;stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round;animation:animate-dash-loader 2s ease-in-out infinite}.mc-loader__text{font-size:1rem;line-height:1.375;color:currentColor}.mc-loader--s .mc-loader__spinner{height:1.5rem;width:1.5rem}.mc-loader--s .mc-loader__path{stroke-width:4}.mc-loader--l .mc-loader__spinner{height:4rem;width:4rem}.mc-loader--l .mc-loader__path{stroke-width:8}.mc-loader--dark{color:#191919}.mc-loader--dark .mc-loader__path{stroke:currentColor}.mc-loader--light{color:#fff}.mc-loader--light .mc-loader__path{stroke:currentColor}@keyframes rotate-loader{0%{transform:rotate(0)}to{transform:rotate(270deg)}}@keyframes animate-dash-loader{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.mc-dropdown{align-self:start;position:relative;min-width:18rem;max-width:var(--dropdown-width, auto);width:100%}.mc-dropdown__tag,.mc-dropdown__tools{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.mc-dropdown__tag{left:.75rem}.mc-dropdown__trigger{display:block;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.mc-dropdown__trigger.is-open{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23000000' viewBox='0 0 16 16'%3E%3Cpath d='M2 10.5a1 1 0 01.29-.71l5-5a1 1 0 011.42 0l5 5a1 1 0 01-1.42 1.42L8 6.91l-4.29 4.3a1 1 0 01-1.42 0A1 1 0 012 10.5z'/%3E%3C/svg%3E\")}.mc-dropdown__tools{align-items:center;background-color:#fff;display:flex;gap:.5rem;justify-content:flex-end;right:2.5rem}.is-valid+.mc-dropdown__tools,.is-invalid+.mc-dropdown__tools{right:4.5rem}.mc-dropdown__clear{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;box-shadow:0 0 0 0 transparent;transition:box-shadow .15s ease;background:none;border-radius:50%}.mc-dropdown__clear:focus{box-shadow:0 0 0 2px #758992}.mc-dropdown__clear,.mc-dropdown__clear-icon{height:1.5rem;width:1.5rem}.mc-dropdown__clear-icon{fill:#666}.mc-dropdown__clear-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-dropdown--multi .mc-dropdown__trigger{padding-left:calc(.75rem + var(--dropdown-tag-width, 0px))}.mc-button{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;padding:0;color:#fff;background-color:#007f8c;font-family:Roboto,sans-serif;font-weight:700;font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem;cursor:pointer;border-radius:4px;text-align:center;border:2px solid transparent;transition:all ease .2s;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;align-items:stretch;box-sizing:border-box;fill:currentColor}.mc-button:hover{background-color:#006974;color:#fff}.mc-button:active{background-color:#006974}.mc-button:disabled,.mc-button.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button .mc-button__icon:first-child,.mc-button .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-button--s{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s .mc-button__icon:first-child,.mc-button--s .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}@media screen and (min-width: 680px){.mc-button--s\\@from-m{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-m .mc-button__icon:first-child,.mc-button--s\\@from-m .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1024px){.mc-button--s\\@from-l{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-l .mc-button__icon:first-child,.mc-button--s\\@from-l .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1280px){.mc-button--s\\@from-xl{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xl .mc-button__icon:first-child,.mc-button--s\\@from-xl .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1920px){.mc-button--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xxl .mc-button__icon:first-child,.mc-button--s\\@from-xxl .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}.mc-button--m{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m .mc-button__icon:first-child,.mc-button--m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}@media screen and (min-width: 680px){.mc-button--m\\@from-m{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-m .mc-button__icon:first-child,.mc-button--m\\@from-m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1024px){.mc-button--m\\@from-l{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-l .mc-button__icon:first-child,.mc-button--m\\@from-l .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1280px){.mc-button--m\\@from-xl{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl .mc-button__icon:first-child,.mc-button--m\\@from-xl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1920px){.mc-button--m\\@from-xxl{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl .mc-button__icon:first-child,.mc-button--m\\@from-xxl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}.mc-button--l{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l .mc-button__icon{width:2rem;height:2rem}.mc-button--l .mc-button__icon:first-child,.mc-button--l .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}@media screen and (min-width: 680px){.mc-button--l\\@from-m{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-m .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-m .mc-button__icon:first-child,.mc-button--l\\@from-m .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1024px){.mc-button--l\\@from-l{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-l .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-l .mc-button__icon:first-child,.mc-button--l\\@from-l .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1280px){.mc-button--l\\@from-xl{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xl .mc-button__icon:first-child,.mc-button--l\\@from-xl .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1920px){.mc-button--l\\@from-xxl{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xxl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xxl .mc-button__icon:first-child,.mc-button--l\\@from-xxl .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}.mc-button--fit{display:inline-flex;width:auto}@media screen and (min-width: 680px){.mc-button--fit\\@from-m{display:inline-flex;width:auto}}@media screen and (min-width: 1024px){.mc-button--fit\\@from-l{display:inline-flex;width:auto}}@media screen and (min-width: 1280px){.mc-button--fit\\@from-xl{display:inline-flex;width:auto}}@media screen and (min-width: 1920px){.mc-button--fit\\@from-xxl{display:inline-flex;width:auto}}.mc-button--full{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full{width:-webkit-fill-available;width:-moz-available;width:stretch}}@media screen and (min-width: 680px){.mc-button--full\\@from-m{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-m{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1024px){.mc-button--full\\@from-l{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-l{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1280px){.mc-button--full\\@from-xl{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-xl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1920px){.mc-button--full\\@from-xxl{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-xxl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}.mc-button--square{align-items:center;height:0;padding:0}@media screen and (min-width: 1024px){.mc-button--square{padding:0}}.mc-button__icon{flex-shrink:0}.mc-button__icon:last-child{margin-left:.5rem;margin-right:-.25rem}.mc-button__icon:first-child{margin-right:.5rem;margin-left:-.25rem}.mc-button__icon:only-child{margin:0}.mc-button__label{align-items:center;display:flex;pointer-events:none}a.mc-button:disabled,a.mc-button.is-disabled{pointer-events:none}.mc-button--solid-primary-02{background-color:#6a7081}.mc-button--solid-primary-02:hover{background-color:#242938}.mc-button--solid-primary-02:active{background-color:#171b26}.mc-button--solid-primary-02:disabled,.mc-button--solid-primary-02.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--solid-neutral{background-color:#333}.mc-button--solid-neutral:hover{background-color:#191919}.mc-button--solid-neutral:active{background-color:#333}.mc-button--solid-neutral:disabled,.mc-button--solid-neutral.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--solid-danger{background-color:#c61112}.mc-button--solid-danger:hover,.mc-button--solid-danger:active{background-color:#8c0003}.mc-button--solid-danger:disabled,.mc-button--solid-danger.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered{color:#007f8c;border-color:#007f8c;background-color:#fff}.mc-button--bordered:hover{background-color:#d9f0f3;color:#006974}.mc-button--bordered:active{background-color:#91d5db;color:#004e57}.mc-button--bordered:disabled,.mc-button--bordered.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-primary-02{color:#6a7081;border-color:#6a7081;background-color:#fff}.mc-button--bordered-primary-02:hover{background-color:#eeeff1;color:#6a7081}.mc-button--bordered-primary-02:active{background-color:#cfd2d8}.mc-button--bordered-primary-02:disabled,.mc-button--bordered-primary-02.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-neutral{color:#333;border-color:#333;background-color:#fff}.mc-button--bordered-neutral:hover{background-color:#e6e6e6;color:#333}.mc-button--bordered-neutral:active{background-color:#ccc}.mc-button--bordered-neutral:disabled,.mc-button--bordered-neutral.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-danger{color:#c61112;border-color:#c61112;background-color:#fff}.mc-button--bordered-danger:hover{background-color:#fdeaea;color:#8c0003}.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger:disabled,.mc-button--bordered-danger.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-dropdow__taglist{margin-top:1rem}\n"] }]
+                    ], template: "<div\n  class=\"mc-dropdown mc-dropdown--clearable\"\n  [ngClass]=\"{ 'mc-dropdown--multi': multiple }\"\n  [ngStyle]=\"{\n    '--dropdown-tag-width':\n      !showSelectedTags && multiple && getSelectedListboxItems().length > 0 ? '3.5rem' : '',\n    '--dropdown-width': '100%'\n  }\"\n>\n  <div class=\"mc-dropdown__main\">\n    <moz-tag\n      *ngIf=\"!showSelectedTags && multiple && getSelectedListboxItems().length > 0\"\n      class=\"mc-dropdown__tag mc-tag-removable mc-tag-removable--s mc-autocomplete__tag\"\n      type=\"removable\"\n      [size]=\"'s'\"\n      (clickOnRemove)=\"clearFieldEvent()\"\n    >\n      {{ getSelectedListboxItems().length }}</moz-tag\n    >\n\n    <button\n      type=\"button\"\n      id=\"trigger\"\n      class=\"mc-select mc-dropdown__trigger mc-button--{{ size }}\"\n      [ngClass]=\"{\n        'is-open': openState,\n      }\"\n      aria-haspopup=\"listbox\"\n      title=\"Dropdown menu options\"\n      [disabled]=\"disabled\"\n      aria-expanded=\"false\"\n      (click)=\"openListbox()\"\n    >\n      <ng-container *ngIf=\"multiple; else monoSelection\">{{\n        getLabelFromMultipleSelection()\n      }}</ng-container>\n      <ng-template #monoSelection>{{ getLabelFromMonoSelection() }}</ng-template>\n    </button>\n\n    <div class=\"mc-dropdown__tools\">\n      <div class=\"mc-dropdown__loader mc-loader mc-loader--s\" *ngIf=\"loading\">\n        <span class=\"mc-loader__spinner\">\n          <moz-loader class=\"mc-loader__icon\" size=\"s\"></moz-loader>\n        </span>\n      </div>\n      <button\n        class=\"mc-dropdown__clear\"\n        type=\"button\"\n        *ngIf=\"canClearField()\"\n        (click)=\"clearFieldEvent()\"\n      >\n        <moz-icon\n          class=\"mc-dropdown__clear-icon\"\n          [iconName]=\"'Navigation_Control_Tag--Cross_24px'\"\n        ></moz-icon>\n        <span class=\"mc-autocomplete__clear-text\">Clear</span>\n      </button>\n    </div>\n  </div>\n  <moz-listbox\n    *ngIf=\"openState\"\n    #listbox\n    [listboxItems]=\"listboxItems\"\n    [isOpen]=\"openState\"\n    [multiple]=\"multiple\"\n    [selectedItems]=\"selectedItems\"\n    (itemsSelected)=\"itemsSelectedListboxEvent($event)\"\n  ></moz-listbox>\n</div>\n<div class=\"mc-dropdow__taglist\" *ngIf=\"showSelectedTags && multiple\">\n  <moz-taglist\n    #taglist\n    (removeTag)=\"removeTagEvent($event)\"\n    [tagItems]=\"getTagItemsFromSelectedItems()\"\n    [max]=\"maxShowingSelectedTags\"\n    [layerTagsTitle]=\"layerTagsTitle\"\n    [layerTagsIcon]=\"layerTagsIcon\"\n  ></moz-taglist>\n</div>\n", styles: [".mc-select{font-family:Roboto,sans-serif;font-weight:400;box-sizing:border-box;outline:none;-webkit-appearance:none;appearance:none;padding:0;margin:0;box-shadow:none;border:none;font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\");background-color:#fff;background-repeat:no-repeat;background-size:1rem 1rem,1.5rem 1.5rem;border:1px solid #666666;border-radius:4px;color:#191919;transition:border-color .2s ease,box-shadow .2s ease;width:100%}.mc-select[type=number]::-webkit-inner-spin-button,.mc-select[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.mc-select[type=number]{-moz-appearance:textfield}.mc-select[type=search]::-webkit-search-decoration:hover,.mc-select[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-select::-ms-expand{display:none}.mc-select:hover{border-color:#191919}.mc-select:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-select:disabled{background-color:#e6e6e6;border-color:#e6e6e6;color:#666;cursor:not-allowed;opacity:1}.mc-select.is-invalid{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\"),url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiNjNjExMTIiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMTAxMCAxMEExMCAxMCAwIDAwMTIgMnptMCAxOGE4IDggMCAxMTgtOCA4IDggMCAwMS04IDh6Ii8+PHBhdGggZD0iTTEyIDdhMSAxIDAgMDAtMSAxdjQuMzhhMSAxIDAgMDAyIDBWOGExIDEgMCAwMC0xLTF6Ii8+PGNpcmNsZSBjeD0iMTIiIGN5PSIxNiIgcj0iMSIvPjwvc3ZnPg==);border-color:#c61112}.mc-select.is-valid{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23191919' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\"),url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjNDZhNjEwIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiA0YTggOCAwIDExLTggOCA4IDggMCAwMTgtOG0wLTJhMTAgMTAgMCAxMDEwIDEwQTEwIDEwIDAgMDAxMiAyeiIvPjxwYXRoIGQ9Ik0xMC43MyAxNS43NWExIDEgMCAwMS0uNjgtLjI2bC0zLTIuNzRhMSAxIDAgMDExLjM2LTEuNDdsMi4yNSAyLjA4IDQuMzYtNC40MmExIDEgMCAxMTEuNDIgMS40MWwtNSA1LjFhMSAxIDAgMDEtLjcxLjN6Ii8+PC9zdmc+);border-color:#46a610}.mc-select--s{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}@media screen and (min-width: 680px){.mc-select--s\\@from-m{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1024px){.mc-select--s\\@from-l{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1280px){.mc-select--s\\@from-xl{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}@media screen and (min-width: 1920px){.mc-select--s\\@from-xxl{font-size:.875rem;line-height:1.1428571429;background-position:right .5rem center,right 2rem center;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) calc(.5rem - 1px)}}.mc-select--m{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}@media screen and (min-width: 680px){.mc-select--m\\@from-m{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1024px){.mc-select--m\\@from-l{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1280px){.mc-select--m\\@from-xl{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}@media screen and (min-width: 1920px){.mc-select--m\\@from-xxl{font-size:1rem;line-height:1.125;background-position:right 1rem center,right 2.5rem center;padding:calc(.9375rem - 1px) 3rem calc(.9375rem - 1px) calc(.75rem - 1px)}}.mc-listbox{list-style:none;margin-left:0;padding-left:0;background-color:#fff;border:1px solid #666666;border-radius:3px;position:absolute;overflow-y:auto;margin-top:.25rem;margin-bottom:0;max-height:13.8125rem;min-width:auto;opacity:0;visibility:hidden;max-width:var(--listbox-width, auto);width:100%}.mc-listbox.is-open{opacity:1;visibility:visible;z-index:10}.mc-listbox::-webkit-scrollbar{background-color:#e6e6e6;width:.25rem}.mc-listbox::-webkit-scrollbar-thumb{background:#666666}.mc-listbox__item,.mc-listbox__tile{align-items:center;display:flex;gap:.5rem;min-height:3rem;padding-left:.75rem;padding-right:.75rem;position:relative;justify-content:space-between}.mc-listbox__item:not(:last-child),.mc-listbox__tile:not(:last-child){border-bottom:1px solid #b3b3b3}.mc-listbox__item:hover,.mc-listbox__tile:hover{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox__flag,.mc-listbox__icon{width:2rem;height:2rem}.mc-listbox__flag{font-size:1.4375rem;line-height:1.3913043478;text-align:center}.mc-listbox__empty{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-listbox__label{cursor:pointer;margin-right:auto}.mc-listbox__label:after{content:\"\";position:absolute;inset:0;z-index:2}.mc-listbox__input{order:1}.mc-listbox .is-checked,.mc-listbox .is-selected{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right .75rem center;background-size:1.5rem}.mc-listbox .is-focus{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox .is-disabled{cursor:not-allowed;box-shadow:none;background-color:#ccc;color:#666;pointer-events:none}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input:checked+.mc-listbox__label:before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;content:\"\";height:1.5rem;position:absolute;right:.75rem;top:0;transform:translateY(50%);width:1.5rem}.mc-listbox--left{right:0}.mc-loader{color:#007f8c;align-items:center;display:inline-flex;flex-direction:column}.mc-loader .mc-loader__spinner{height:2rem;width:2rem}.mc-loader .mc-loader__path{stroke-width:4}.mc-loader .mc-loader__path{stroke:currentColor}.mc-loader__spinner:not(:only-child){margin-bottom:1rem}.mc-loader__icon{animation:rotate-loader 2s linear infinite;transform-origin:center}.mc-loader__path{fill:none;stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round;animation:animate-dash-loader 2s ease-in-out infinite}.mc-loader__text{font-size:1rem;line-height:1.375;color:currentColor}.mc-loader--s .mc-loader__spinner{height:1.5rem;width:1.5rem}.mc-loader--s .mc-loader__path{stroke-width:4}.mc-loader--l .mc-loader__spinner{height:4rem;width:4rem}.mc-loader--l .mc-loader__path{stroke-width:8}.mc-loader--dark{color:#191919}.mc-loader--dark .mc-loader__path{stroke:currentColor}.mc-loader--light{color:#fff}.mc-loader--light .mc-loader__path{stroke:currentColor}@keyframes rotate-loader{0%{transform:rotate(0)}to{transform:rotate(270deg)}}@keyframes animate-dash-loader{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.mc-dropdown{align-self:start;position:relative;min-width:18rem;max-width:var(--dropdown-width, auto);width:100%}.mc-dropdown__tag,.mc-dropdown__tools{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.mc-dropdown__tag{left:.75rem}.mc-dropdown__trigger{display:block;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.mc-dropdown__trigger.is-open{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' fill='%23000000' viewBox='0 0 16 16'%3E%3Cpath d='M2 10.5a1 1 0 01.29-.71l5-5a1 1 0 011.42 0l5 5a1 1 0 01-1.42 1.42L8 6.91l-4.29 4.3a1 1 0 01-1.42 0A1 1 0 012 10.5z'/%3E%3C/svg%3E\")}.mc-dropdown__tools{align-items:center;background-color:#fff;display:flex;gap:.5rem;justify-content:flex-end;right:2.5rem}.is-valid+.mc-dropdown__tools,.is-invalid+.mc-dropdown__tools{right:4.5rem}.mc-dropdown__clear{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;box-shadow:0 0 0 0 transparent;transition:box-shadow .15s ease;background:none;border-radius:50%}.mc-dropdown__clear:focus{box-shadow:0 0 0 2px #758992}.mc-dropdown__clear,.mc-dropdown__clear-icon{height:1.5rem;width:1.5rem}.mc-dropdown__clear-icon{fill:#666}.mc-dropdown__clear-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-dropdown--multi .mc-dropdown__trigger{padding-left:calc(.75rem + var(--dropdown-tag-width, 0px))}.mc-button{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;padding:0;color:#fff;background-color:#007f8c;font-family:Roboto,sans-serif;font-weight:700;font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem;cursor:pointer;border-radius:4px;text-align:center;border:2px solid transparent;transition:all ease .2s;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;align-items:stretch;box-sizing:border-box;fill:currentColor}.mc-button:hover{background-color:#006974;color:#fff}.mc-button:active{background-color:#006974}.mc-button:disabled,.mc-button.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button .mc-button__icon:first-child,.mc-button .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-button--s{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s .mc-button__icon:first-child,.mc-button--s .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}@media screen and (min-width: 680px){.mc-button--s\\@from-m{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-m .mc-button__icon:first-child,.mc-button--s\\@from-m .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1024px){.mc-button--s\\@from-l{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-l .mc-button__icon:first-child,.mc-button--s\\@from-l .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1280px){.mc-button--s\\@from-xl{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xl .mc-button__icon:first-child,.mc-button--s\\@from-xl .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}@media screen and (min-width: 1920px){.mc-button--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857;padding:.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xxl .mc-button__icon:first-child,.mc-button--s\\@from-xxl .mc-button__icon:last-child{margin-bottom:-.1875rem;margin-top:-.1875rem}.mc-button--s\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}}.mc-button--m{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m .mc-button__icon:first-child,.mc-button--m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}@media screen and (min-width: 680px){.mc-button--m\\@from-m{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-m .mc-button__icon:first-child,.mc-button--m\\@from-m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1024px){.mc-button--m\\@from-l{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-l .mc-button__icon:first-child,.mc-button--m\\@from-l .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1280px){.mc-button--m\\@from-xl{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl .mc-button__icon:first-child,.mc-button--m\\@from-xl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1920px){.mc-button--m\\@from-xxl{font-size:1rem;line-height:1.375;padding:.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl .mc-button__icon:first-child,.mc-button--m\\@from-xxl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}.mc-button--l{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l .mc-button__icon{width:2rem;height:2rem}.mc-button--l .mc-button__icon:first-child,.mc-button--l .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}@media screen and (min-width: 680px){.mc-button--l\\@from-m{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-m .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-m .mc-button__icon:first-child,.mc-button--l\\@from-m .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1024px){.mc-button--l\\@from-l{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-l .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-l .mc-button__icon:first-child,.mc-button--l\\@from-l .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1280px){.mc-button--l\\@from-xl{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xl .mc-button__icon:first-child,.mc-button--l\\@from-xl .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}@media screen and (min-width: 1920px){.mc-button--l\\@from-xxl{font-size:1.125rem;line-height:1.3333333333;padding:.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xxl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xxl .mc-button__icon:first-child,.mc-button--l\\@from-xxl .mc-button__icon:last-child{margin-bottom:-.25rem;margin-top:-.25rem}.mc-button--l\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}}.mc-button--fit{display:inline-flex;width:auto}@media screen and (min-width: 680px){.mc-button--fit\\@from-m{display:inline-flex;width:auto}}@media screen and (min-width: 1024px){.mc-button--fit\\@from-l{display:inline-flex;width:auto}}@media screen and (min-width: 1280px){.mc-button--fit\\@from-xl{display:inline-flex;width:auto}}@media screen and (min-width: 1920px){.mc-button--fit\\@from-xxl{display:inline-flex;width:auto}}.mc-button--full{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full{width:-webkit-fill-available;width:-moz-available;width:stretch}}@media screen and (min-width: 680px){.mc-button--full\\@from-m{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-m{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1024px){.mc-button--full\\@from-l{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-l{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1280px){.mc-button--full\\@from-xl{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-xl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1920px){.mc-button--full\\@from-xxl{display:flex;width:100%}@supports ((width: -webkit-fill-available) or (width: -moz-available) or (width: stretch)){.mc-button--full\\@from-xxl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}.mc-button--square{align-items:center;height:0;padding:0}@media screen and (min-width: 1024px){.mc-button--square{padding:0}}.mc-button__icon{flex-shrink:0}.mc-button__icon:last-child{margin-left:.5rem;margin-right:-.25rem}.mc-button__icon:first-child{margin-right:.5rem;margin-left:-.25rem}.mc-button__icon:only-child{margin:0}.mc-button__label{align-items:center;display:flex;pointer-events:none}a.mc-button:disabled,a.mc-button.is-disabled{pointer-events:none}.mc-button--solid-primary-02{background-color:#6a7081}.mc-button--solid-primary-02:hover{background-color:#242938}.mc-button--solid-primary-02:active{background-color:#171b26}.mc-button--solid-primary-02:disabled,.mc-button--solid-primary-02.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--solid-neutral{background-color:#333}.mc-button--solid-neutral:hover{background-color:#191919}.mc-button--solid-neutral:active{background-color:#333}.mc-button--solid-neutral:disabled,.mc-button--solid-neutral.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--solid-danger{background-color:#c61112}.mc-button--solid-danger:hover,.mc-button--solid-danger:active{background-color:#8c0003}.mc-button--solid-danger:disabled,.mc-button--solid-danger.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered{color:#007f8c;border-color:#007f8c;background-color:#fff}.mc-button--bordered:hover{background-color:#d9f0f3;color:#006974}.mc-button--bordered:active{background-color:#91d5db;color:#004e57}.mc-button--bordered:disabled,.mc-button--bordered.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-primary-02{color:#6a7081;border-color:#6a7081;background-color:#fff}.mc-button--bordered-primary-02:hover{background-color:#eeeff1;color:#6a7081}.mc-button--bordered-primary-02:active{background-color:#cfd2d8}.mc-button--bordered-primary-02:disabled,.mc-button--bordered-primary-02.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-neutral{color:#333;border-color:#333;background-color:#fff}.mc-button--bordered-neutral:hover{background-color:#e6e6e6;color:#333}.mc-button--bordered-neutral:active{background-color:#ccc}.mc-button--bordered-neutral:disabled,.mc-button--bordered-neutral.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-button--bordered-danger{color:#c61112;border-color:#c61112;background-color:#fff}.mc-button--bordered-danger:hover{background-color:#fdeaea;color:#8c0003}.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger:disabled,.mc-button--bordered-danger.is-disabled{background-color:#ccc;border-color:transparent;color:#666;cursor:not-allowed}.mc-dropdow__taglist{margin-top:1rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Injector, decorators: [{
                     type: Inject,
                     args: [Injector]
@@ -3537,6 +3560,7 @@ class AutocompleteComponent {
             this.originalListboxParent = null;
         }
         this.listboxItems = this.initialListboxItems;
+        this.control?.markAsTouched();
     }
     itemsSelectedListboxEvent(listboxItemSelected) {
         if (!this.multiple) {
@@ -3558,6 +3582,7 @@ class AutocompleteComponent {
             this.writeValue(this.selectedItems);
             this.control?.setValue(this.selectedItems);
             this.control?.markAsDirty();
+            this.control?.markAsTouched();
         }
     }
     getMultiSelectedLabel() {
@@ -3602,6 +3627,7 @@ class AutocompleteComponent {
         }
         this.control?.setValue(this.selectedItems);
         this.control?.markAsDirty();
+        this.control?.markAsTouched();
         this.cd.detectChanges();
     }
     searchEvent() {
@@ -3637,7 +3663,7 @@ AutocompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
             useExisting: forwardRef(() => AutocompleteComponent),
             multi: true,
         },
-    ], viewQueries: [{ propertyName: "taglistComponent", first: true, predicate: ["taglist"], descendants: true }, { propertyName: "listboxElementRef", first: true, predicate: ["listbox"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n  id=\"js-autocomplete\"\n  class=\"mc-autocomplete mc-autocomplete--clearable\"\n  [ngClass]=\"{ 'mc-autocomplete--multi': multiple }\"\n  [ngStyle]=\"{\n    '--autocomplete-tag-width':\n      !showSelectedTags && multiple && getSelectedListboxItems().length > 0 ? '3.5rem' : '',\n    '--autocomplete-width': '100%'\n  }\"\n>\n  <div class=\"mc-autocomplete__main\">\n    <moz-tag\n      *ngIf=\"!showSelectedTags && multiple && getSelectedListboxItems().length > 0\"\n      type=\"removable\"\n      class=\"mc-autocomplete__tag mc-tag-removable mc-tag-removable--s\"\n      [size]=\"'s'\"\n      (clickOnRemove)=\"clearFieldEvent()\"\n    >\n      {{ getSelectedListboxItems().length }}</moz-tag\n    >\n\n    <div class=\"mc-left-icon-input\">\n      <moz-icon\n        class=\"mc-left-icon-input__icon\"\n        [iconName]=\"'Navigation_Display_Search_24px'\"\n      ></moz-icon>\n      <input\n        moz-input\n        [type]=\"'text'\"\n        [invalid]=\"invalid\"\n        class=\"mc-left-icon-input__input mc-text-input mc-autocomplete__trigger\"\n        [valid]=\"valid\"\n        [placeholder]=\"placeholder\"\n        [disabled]=\"disabled\"\n        [size]=\"size\"\n        [(ngModel)]=\"search\"\n        (ngModelChange)=\"searchEvent()\"\n        (click)=\"openListbox()\"\n      />\n    </div>\n\n    <div class=\"mc-autocomplete__tools\">\n      <div class=\"mc-autocomplete__loader mc-loader mc-loader--s\" *ngIf=\"loading\">\n        <span class=\"mc-loader__spinner\">\n          <moz-loader class=\"mc-loader__icon\" size=\"s\"></moz-loader>\n        </span>\n      </div>\n      <button\n        class=\"mc-autocomplete__clear\"\n        type=\"button\"\n        *ngIf=\"canClearField()\"\n        (click)=\"clearFieldEvent()\"\n      >\n        <moz-icon\n          class=\"mc-autocomplete__clear-icon\"\n          [iconName]=\"'Navigation_Control_Tag--Cross_24px'\"\n        ></moz-icon\n        ><span class=\"mc-autocomplete__clear-text\">Clear</span>\n      </button>\n    </div>\n  </div>\n  <moz-listbox\n    *ngIf=\"openState\"\n    #listbox\n    [listboxItems]=\"listboxItems\"\n    [isOpen]=\"openState\"\n    [multiple]=\"multiple\"\n    [selectedItems]=\"selectedItems\"\n    (itemsSelected)=\"itemsSelectedListboxEvent($event)\"\n  ></moz-listbox>\n</div>\n<div class=\"mc-autocomplete__error\" *ngIf=\"invalid\">\n  {{ errorContentText }}\n</div>\n<div class=\"mc-autocomplete__taglist\">\n  <moz-taglist\n    #taglist\n    *ngIf=\"showSelectedTags && multiple\"\n    (removeTag)=\"removeTagEvent($event)\"\n    [tagItems]=\"getTagItemsFromSelectedItems()\"\n    [max]=\"maxShowingSelectedTags\"\n    [layerTagsTitle]=\"layerTagsTitle\"\n    [layerTagsIcon]=\"layerTagsIcon\"\n  ></moz-taglist>\n</div>\n", styles: [".mc-left-icon-input{position:relative}.mc-left-icon-input__icon{position:absolute;z-index:1;top:50%;transform:translateY(-50%);fill:#666;pointer-events:none}.mc-left-icon-input .mc-left-icon-input__icon{left:.75rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input .mc-left-icon-input__input{padding-left:2.9375rem}.mc-left-icon-input--s .mc-left-icon-input__icon{left:.5rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input--s .mc-left-icon-input__input{padding-left:2.4375rem}.mc-text-input{font-family:Roboto,sans-serif;font-weight:400;box-sizing:border-box;outline:none;-webkit-appearance:none;appearance:none;padding:0;margin:0;box-shadow:none;border:none;font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem;transition:box-shadow .2s ease;display:block;width:100%;position:relative;border:1px solid #666666;color:#191919;background-color:#fff;border-radius:4px}.mc-text-input[type=number]::-webkit-inner-spin-button,.mc-text-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.mc-text-input[type=number]{-moz-appearance:textfield}.mc-text-input[type=search]::-webkit-search-decoration:hover,.mc-text-input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-text-input::placeholder{font-size:1rem;line-height:1.375}.mc-text-input::placeholder{margin:0;color:#666;opacity:1}.mc-text-input.is-valid,.mc-text-input.is-invalid{background-repeat:no-repeat;background-size:1.5rem 1.5rem;background-position:right .4375rem center;padding-right:2.5rem}.mc-text-input.is-valid{border-color:#46a610;background-image:url(data:image/svg+xml,)}.mc-text-input.is-valid:hover,.mc-text-input.is-valid.is-hover{border-color:#035010}.mc-text-input.is-invalid{border-color:#c61112;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.5rem' width='1.5rem' viewBox='0 0 24 24' fill='%23c61112'%3E%3Cpath d='M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 18a8 8 0 118-8 8 8 0 01-8 8z'/%3E%3Cpath d='M12 7a1 1 0 00-1 1v4.38a1 1 0 002 0V8a1 1 0 00-1-1z'/%3E%3Ccircle cx='12' cy='16' r='1'/%3E%3C/svg%3E\")}.mc-text-input.is-invalid:hover,.mc-text-input.is-invalid.is-hover{border-color:#530000}.mc-text-input:hover{border-color:#191919}.mc-text-input:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-text-input:disabled{background:#e6e6e6;border-color:#e6e6e6;color:#666;cursor:not-allowed}.mc-text-input--s{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s::placeholder{font-size:.875rem;line-height:1.2857142857}@media screen and (min-width: 680px){.mc-text-input--s\\@from-m{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-m::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1024px){.mc-text-input--s\\@from-l{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-l::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1280px){.mc-text-input--s\\@from-xl{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-xl::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1920px){.mc-text-input--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-xxl::placeholder{font-size:.875rem;line-height:1.2857142857}}.mc-text-input--m{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m::placeholder{font-size:1rem;line-height:1.375}@media screen and (min-width: 680px){.mc-text-input--m\\@from-m{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-m::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-text-input--m\\@from-l{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-l::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-text-input--m\\@from-xl{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-xl::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-text-input--m\\@from-xxl{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-xxl::placeholder{font-size:1rem;line-height:1.375}}.mc-listbox{list-style:none;margin-left:0;padding-left:0;background-color:#fff;border:1px solid #666666;border-radius:3px;position:absolute;overflow-y:auto;margin-top:.25rem;margin-bottom:0;max-height:13.8125rem;min-width:auto;opacity:0;visibility:hidden;max-width:var(--listbox-width, auto);width:100%}.mc-listbox.is-open{opacity:1;visibility:visible;z-index:10}.mc-listbox::-webkit-scrollbar{background-color:#e6e6e6;width:.25rem}.mc-listbox::-webkit-scrollbar-thumb{background:#666666}.mc-listbox__item,.mc-listbox__tile{align-items:center;display:flex;gap:.5rem;min-height:3rem;padding-left:.75rem;padding-right:.75rem;position:relative;justify-content:space-between}.mc-listbox__item:not(:last-child),.mc-listbox__tile:not(:last-child){border-bottom:1px solid #b3b3b3}.mc-listbox__item:hover,.mc-listbox__tile:hover{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox__flag,.mc-listbox__icon{width:2rem;height:2rem}.mc-listbox__flag{font-size:1.4375rem;line-height:1.3913043478;text-align:center}.mc-listbox__empty{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-listbox__label{cursor:pointer;margin-right:auto}.mc-listbox__label:after{content:\"\";position:absolute;inset:0;z-index:2}.mc-listbox__input{order:1}.mc-listbox .is-checked,.mc-listbox .is-selected{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right .75rem center;background-size:1.5rem}.mc-listbox .is-focus{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox .is-disabled{cursor:not-allowed;box-shadow:none;background-color:#ccc;color:#666;pointer-events:none}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input:checked+.mc-listbox__label:before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;content:\"\";height:1.5rem;position:absolute;right:.75rem;top:0;transform:translateY(50%);width:1.5rem}.mc-listbox--left{right:0}.mc-loader{color:#007f8c;align-items:center;display:inline-flex;flex-direction:column}.mc-loader .mc-loader__spinner{height:2rem;width:2rem}.mc-loader .mc-loader__path{stroke-width:4}.mc-loader .mc-loader__path{stroke:currentColor}.mc-loader__spinner:not(:only-child){margin-bottom:1rem}.mc-loader__icon{animation:rotate-loader 2s linear infinite;transform-origin:center}.mc-loader__path{fill:none;stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round;animation:animate-dash-loader 2s ease-in-out infinite}.mc-loader__text{font-size:1rem;line-height:1.375;color:currentColor}.mc-loader--s .mc-loader__spinner{height:1.5rem;width:1.5rem}.mc-loader--s .mc-loader__path{stroke-width:4}.mc-loader--l .mc-loader__spinner{height:4rem;width:4rem}.mc-loader--l .mc-loader__path{stroke-width:8}.mc-loader--dark{color:#191919}.mc-loader--dark .mc-loader__path{stroke:currentColor}.mc-loader--light{color:#fff}.mc-loader--light .mc-loader__path{stroke:currentColor}@keyframes rotate-loader{0%{transform:rotate(0)}to{transform:rotate(270deg)}}@keyframes animate-dash-loader{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.mc-autocomplete{align-self:start;position:relative;min-width:18rem;max-width:var(--autocomplete-width, auto);width:100%}.mc-autocomplete__main{position:relative}.mc-autocomplete__tag,.mc-autocomplete__tools{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.mc-autocomplete__tag{left:2.75rem}.mc-autocomplete__trigger{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mc-autocomplete__tools{align-items:center;background-color:#fff;display:flex;gap:.5rem;justify-content:flex-end;right:.75rem}.is-valid+.mc-autocomplete__tools,.is-invalid+.mc-autocomplete__tools{right:2.5rem}.mc-autocomplete__clear{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;box-shadow:0 0 0 0 transparent;transition:box-shadow .15s ease;background:none;border-radius:50%}.mc-autocomplete__clear:focus{box-shadow:0 0 0 2px #758992}.mc-autocomplete__clear,.mc-autocomplete__clear-icon{height:1.5rem;width:1.5rem}.mc-autocomplete__clear-icon{fill:#666}.mc-autocomplete__clear-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-autocomplete__error{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-autocomplete--multi .mc-autocomplete__trigger{padding-left:calc(2.9375rem + var(--autocomplete-tag-width, 0px))}.mc-autocomplete__taglist{margin-top:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: TagComponent, selector: "moz-tag, a[moz-tag]", inputs: ["type", "size", "select"], outputs: ["selectChange", "clickOnRemove"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TaglistComponent, selector: "moz-taglist", inputs: ["tagItems", "tagSize", "showAllTitle", "showAll", "layerTagsTitle", "layerTagsIcon", "max"], outputs: ["removeTag"] }, { kind: "component", type: ListboxComponent, selector: "moz-listbox", inputs: ["listboxItems", "multiple", "isOpen", "selectedItems", "customMaxWidth"], outputs: ["itemsSelected"] }, { kind: "component", type: IconComponent, selector: "moz-icon", inputs: ["iconName"] }, { kind: "component", type: LoaderComponent, selector: "moz-loader", inputs: ["size", "theme", "isOverlay", "text", "hideOverlay"] }, { kind: "component", type: TextInputComponent, selector: "input[moz-input]", inputs: ["size", "invalid", "valid"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], viewQueries: [{ propertyName: "taglistComponent", first: true, predicate: ["taglist"], descendants: true }, { propertyName: "listboxElementRef", first: true, predicate: ["listbox"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n  id=\"js-autocomplete\"\n  class=\"mc-autocomplete mc-autocomplete--clearable\"\n  [ngClass]=\"{ 'mc-autocomplete--multi': multiple }\"\n  [ngStyle]=\"{\n    '--autocomplete-tag-width':\n      !showSelectedTags && multiple && getSelectedListboxItems().length > 0 ? '3.5rem' : '',\n    '--autocomplete-width': '100%'\n  }\"\n>\n  <div class=\"mc-autocomplete__main\">\n    <moz-tag\n      *ngIf=\"!showSelectedTags && multiple && getSelectedListboxItems().length > 0\"\n      type=\"removable\"\n      class=\"mc-autocomplete__tag mc-tag-removable mc-tag-removable--s\"\n      [size]=\"'s'\"\n      (clickOnRemove)=\"clearFieldEvent()\"\n    >\n      {{ getSelectedListboxItems().length }}</moz-tag\n    >\n\n    <div class=\"mc-left-icon-input\">\n      <moz-icon\n        class=\"mc-left-icon-input__icon\"\n        [iconName]=\"'Navigation_Display_Search_24px'\"\n      ></moz-icon>\n      <input\n        moz-input\n        [type]=\"'text'\"\n        [invalid]=\"invalid\"\n        class=\"mc-left-icon-input__input mc-text-input mc-autocomplete__trigger\"\n        [valid]=\"valid\"\n        [placeholder]=\"placeholder\"\n        [disabled]=\"disabled\"\n        [size]=\"size\"\n        [(ngModel)]=\"search\"\n        (ngModelChange)=\"searchEvent()\"\n        (click)=\"openListbox()\"\n      />\n    </div>\n\n    <div class=\"mc-autocomplete__tools\">\n      <div class=\"mc-autocomplete__loader mc-loader mc-loader--s\" *ngIf=\"loading\">\n        <span class=\"mc-loader__spinner\">\n          <moz-loader class=\"mc-loader__icon\" size=\"s\"></moz-loader>\n        </span>\n      </div>\n      <button\n        class=\"mc-autocomplete__clear\"\n        type=\"button\"\n        *ngIf=\"canClearField()\"\n        (click)=\"clearFieldEvent()\"\n      >\n        <moz-icon\n          class=\"mc-autocomplete__clear-icon\"\n          [iconName]=\"'Navigation_Control_Tag--Cross_24px'\"\n        ></moz-icon\n        ><span class=\"mc-autocomplete__clear-text\">Clear</span>\n      </button>\n    </div>\n  </div>\n  <moz-listbox\n    *ngIf=\"openState\"\n    #listbox\n    [listboxItems]=\"listboxItems\"\n    [isOpen]=\"openState\"\n    [multiple]=\"multiple\"\n    [selectedItems]=\"selectedItems\"\n    (itemsSelected)=\"itemsSelectedListboxEvent($event)\"\n  ></moz-listbox>\n</div>\n<div class=\"mc-autocomplete__error\" *ngIf=\"invalid\">\n  {{ errorContentText }}\n</div>\n<div class=\"mc-autocomplete__taglist\" *ngIf=\"showSelectedTags && multiple\">\n  <moz-taglist\n    #taglist\n    (removeTag)=\"removeTagEvent($event)\"\n    [tagItems]=\"getTagItemsFromSelectedItems()\"\n    [max]=\"maxShowingSelectedTags\"\n    [layerTagsTitle]=\"layerTagsTitle\"\n    [layerTagsIcon]=\"layerTagsIcon\"\n  ></moz-taglist>\n</div>\n", styles: [".mc-left-icon-input{position:relative}.mc-left-icon-input__icon{position:absolute;z-index:1;top:50%;transform:translateY(-50%);fill:#666;pointer-events:none}.mc-left-icon-input .mc-left-icon-input__icon{left:.75rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input .mc-left-icon-input__input{padding-left:2.9375rem}.mc-left-icon-input--s .mc-left-icon-input__icon{left:.5rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input--s .mc-left-icon-input__input{padding-left:2.4375rem}.mc-text-input{font-family:Roboto,sans-serif;font-weight:400;box-sizing:border-box;outline:none;-webkit-appearance:none;appearance:none;padding:0;margin:0;box-shadow:none;border:none;font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem;transition:box-shadow .2s ease;display:block;width:100%;position:relative;border:1px solid #666666;color:#191919;background-color:#fff;border-radius:4px}.mc-text-input[type=number]::-webkit-inner-spin-button,.mc-text-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.mc-text-input[type=number]{-moz-appearance:textfield}.mc-text-input[type=search]::-webkit-search-decoration:hover,.mc-text-input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-text-input::placeholder{font-size:1rem;line-height:1.375}.mc-text-input::placeholder{margin:0;color:#666;opacity:1}.mc-text-input.is-valid,.mc-text-input.is-invalid{background-repeat:no-repeat;background-size:1.5rem 1.5rem;background-position:right .4375rem center;padding-right:2.5rem}.mc-text-input.is-valid{border-color:#46a610;background-image:url(data:image/svg+xml,)}.mc-text-input.is-valid:hover,.mc-text-input.is-valid.is-hover{border-color:#035010}.mc-text-input.is-invalid{border-color:#c61112;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.5rem' width='1.5rem' viewBox='0 0 24 24' fill='%23c61112'%3E%3Cpath d='M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 18a8 8 0 118-8 8 8 0 01-8 8z'/%3E%3Cpath d='M12 7a1 1 0 00-1 1v4.38a1 1 0 002 0V8a1 1 0 00-1-1z'/%3E%3Ccircle cx='12' cy='16' r='1'/%3E%3C/svg%3E\")}.mc-text-input.is-invalid:hover,.mc-text-input.is-invalid.is-hover{border-color:#530000}.mc-text-input:hover{border-color:#191919}.mc-text-input:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-text-input:disabled{background:#e6e6e6;border-color:#e6e6e6;color:#666;cursor:not-allowed}.mc-text-input--s{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s::placeholder{font-size:.875rem;line-height:1.2857142857}@media screen and (min-width: 680px){.mc-text-input--s\\@from-m{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-m::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1024px){.mc-text-input--s\\@from-l{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-l::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1280px){.mc-text-input--s\\@from-xl{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-xl::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1920px){.mc-text-input--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-xxl::placeholder{font-size:.875rem;line-height:1.2857142857}}.mc-text-input--m{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m::placeholder{font-size:1rem;line-height:1.375}@media screen and (min-width: 680px){.mc-text-input--m\\@from-m{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-m::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-text-input--m\\@from-l{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-l::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-text-input--m\\@from-xl{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-xl::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-text-input--m\\@from-xxl{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-xxl::placeholder{font-size:1rem;line-height:1.375}}.mc-listbox{list-style:none;margin-left:0;padding-left:0;background-color:#fff;border:1px solid #666666;border-radius:3px;position:absolute;overflow-y:auto;margin-top:.25rem;margin-bottom:0;max-height:13.8125rem;min-width:auto;opacity:0;visibility:hidden;max-width:var(--listbox-width, auto);width:100%}.mc-listbox.is-open{opacity:1;visibility:visible;z-index:10}.mc-listbox::-webkit-scrollbar{background-color:#e6e6e6;width:.25rem}.mc-listbox::-webkit-scrollbar-thumb{background:#666666}.mc-listbox__item,.mc-listbox__tile{align-items:center;display:flex;gap:.5rem;min-height:3rem;padding-left:.75rem;padding-right:.75rem;position:relative;justify-content:space-between}.mc-listbox__item:not(:last-child),.mc-listbox__tile:not(:last-child){border-bottom:1px solid #b3b3b3}.mc-listbox__item:hover,.mc-listbox__tile:hover{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox__flag,.mc-listbox__icon{width:2rem;height:2rem}.mc-listbox__flag{font-size:1.4375rem;line-height:1.3913043478;text-align:center}.mc-listbox__empty{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-listbox__label{cursor:pointer;margin-right:auto}.mc-listbox__label:after{content:\"\";position:absolute;inset:0;z-index:2}.mc-listbox__input{order:1}.mc-listbox .is-checked,.mc-listbox .is-selected{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right .75rem center;background-size:1.5rem}.mc-listbox .is-focus{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox .is-disabled{cursor:not-allowed;box-shadow:none;background-color:#ccc;color:#666;pointer-events:none}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input:checked+.mc-listbox__label:before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;content:\"\";height:1.5rem;position:absolute;right:.75rem;top:0;transform:translateY(50%);width:1.5rem}.mc-listbox--left{right:0}.mc-loader{color:#007f8c;align-items:center;display:inline-flex;flex-direction:column}.mc-loader .mc-loader__spinner{height:2rem;width:2rem}.mc-loader .mc-loader__path{stroke-width:4}.mc-loader .mc-loader__path{stroke:currentColor}.mc-loader__spinner:not(:only-child){margin-bottom:1rem}.mc-loader__icon{animation:rotate-loader 2s linear infinite;transform-origin:center}.mc-loader__path{fill:none;stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round;animation:animate-dash-loader 2s ease-in-out infinite}.mc-loader__text{font-size:1rem;line-height:1.375;color:currentColor}.mc-loader--s .mc-loader__spinner{height:1.5rem;width:1.5rem}.mc-loader--s .mc-loader__path{stroke-width:4}.mc-loader--l .mc-loader__spinner{height:4rem;width:4rem}.mc-loader--l .mc-loader__path{stroke-width:8}.mc-loader--dark{color:#191919}.mc-loader--dark .mc-loader__path{stroke:currentColor}.mc-loader--light{color:#fff}.mc-loader--light .mc-loader__path{stroke:currentColor}@keyframes rotate-loader{0%{transform:rotate(0)}to{transform:rotate(270deg)}}@keyframes animate-dash-loader{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.mc-autocomplete{align-self:start;position:relative;min-width:18rem;max-width:var(--autocomplete-width, auto);width:100%}.mc-autocomplete__main{position:relative}.mc-autocomplete__tag,.mc-autocomplete__tools{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.mc-autocomplete__tag{left:2.75rem}.mc-autocomplete__trigger{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mc-autocomplete__tools{align-items:center;background-color:#fff;display:flex;gap:.5rem;justify-content:flex-end;right:.75rem}.is-valid+.mc-autocomplete__tools,.is-invalid+.mc-autocomplete__tools{right:2.5rem}.mc-autocomplete__clear{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;box-shadow:0 0 0 0 transparent;transition:box-shadow .15s ease;background:none;border-radius:50%}.mc-autocomplete__clear:focus{box-shadow:0 0 0 2px #758992}.mc-autocomplete__clear,.mc-autocomplete__clear-icon{height:1.5rem;width:1.5rem}.mc-autocomplete__clear-icon{fill:#666}.mc-autocomplete__clear-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-autocomplete__error{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-autocomplete--multi .mc-autocomplete__trigger{padding-left:calc(2.9375rem + var(--autocomplete-tag-width, 0px))}.mc-autocomplete__taglist{margin-top:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: TagComponent, selector: "moz-tag, a[moz-tag]", inputs: ["type", "size", "select"], outputs: ["selectChange", "clickOnRemove"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TaglistComponent, selector: "moz-taglist", inputs: ["tagItems", "tagSize", "showAllTitle", "showAll", "layerTagsTitle", "layerTagsIcon", "max"], outputs: ["removeTag"] }, { kind: "component", type: ListboxComponent, selector: "moz-listbox", inputs: ["listboxItems", "multiple", "isOpen", "selectedItems", "customMaxWidth"], outputs: ["itemsSelected"] }, { kind: "component", type: IconComponent, selector: "moz-icon", inputs: ["iconName"] }, { kind: "component", type: LoaderComponent, selector: "moz-loader", inputs: ["size", "theme", "isOverlay", "text", "hideOverlay"] }, { kind: "component", type: TextInputComponent, selector: "input[moz-input]", inputs: ["size", "invalid", "valid"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AutocompleteComponent, decorators: [{
             type: Component,
             args: [{ selector: 'moz-autocomplete', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
@@ -3646,7 +3672,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                             useExisting: forwardRef(() => AutocompleteComponent),
                             multi: true,
                         },
-                    ], template: "<div\n  id=\"js-autocomplete\"\n  class=\"mc-autocomplete mc-autocomplete--clearable\"\n  [ngClass]=\"{ 'mc-autocomplete--multi': multiple }\"\n  [ngStyle]=\"{\n    '--autocomplete-tag-width':\n      !showSelectedTags && multiple && getSelectedListboxItems().length > 0 ? '3.5rem' : '',\n    '--autocomplete-width': '100%'\n  }\"\n>\n  <div class=\"mc-autocomplete__main\">\n    <moz-tag\n      *ngIf=\"!showSelectedTags && multiple && getSelectedListboxItems().length > 0\"\n      type=\"removable\"\n      class=\"mc-autocomplete__tag mc-tag-removable mc-tag-removable--s\"\n      [size]=\"'s'\"\n      (clickOnRemove)=\"clearFieldEvent()\"\n    >\n      {{ getSelectedListboxItems().length }}</moz-tag\n    >\n\n    <div class=\"mc-left-icon-input\">\n      <moz-icon\n        class=\"mc-left-icon-input__icon\"\n        [iconName]=\"'Navigation_Display_Search_24px'\"\n      ></moz-icon>\n      <input\n        moz-input\n        [type]=\"'text'\"\n        [invalid]=\"invalid\"\n        class=\"mc-left-icon-input__input mc-text-input mc-autocomplete__trigger\"\n        [valid]=\"valid\"\n        [placeholder]=\"placeholder\"\n        [disabled]=\"disabled\"\n        [size]=\"size\"\n        [(ngModel)]=\"search\"\n        (ngModelChange)=\"searchEvent()\"\n        (click)=\"openListbox()\"\n      />\n    </div>\n\n    <div class=\"mc-autocomplete__tools\">\n      <div class=\"mc-autocomplete__loader mc-loader mc-loader--s\" *ngIf=\"loading\">\n        <span class=\"mc-loader__spinner\">\n          <moz-loader class=\"mc-loader__icon\" size=\"s\"></moz-loader>\n        </span>\n      </div>\n      <button\n        class=\"mc-autocomplete__clear\"\n        type=\"button\"\n        *ngIf=\"canClearField()\"\n        (click)=\"clearFieldEvent()\"\n      >\n        <moz-icon\n          class=\"mc-autocomplete__clear-icon\"\n          [iconName]=\"'Navigation_Control_Tag--Cross_24px'\"\n        ></moz-icon\n        ><span class=\"mc-autocomplete__clear-text\">Clear</span>\n      </button>\n    </div>\n  </div>\n  <moz-listbox\n    *ngIf=\"openState\"\n    #listbox\n    [listboxItems]=\"listboxItems\"\n    [isOpen]=\"openState\"\n    [multiple]=\"multiple\"\n    [selectedItems]=\"selectedItems\"\n    (itemsSelected)=\"itemsSelectedListboxEvent($event)\"\n  ></moz-listbox>\n</div>\n<div class=\"mc-autocomplete__error\" *ngIf=\"invalid\">\n  {{ errorContentText }}\n</div>\n<div class=\"mc-autocomplete__taglist\">\n  <moz-taglist\n    #taglist\n    *ngIf=\"showSelectedTags && multiple\"\n    (removeTag)=\"removeTagEvent($event)\"\n    [tagItems]=\"getTagItemsFromSelectedItems()\"\n    [max]=\"maxShowingSelectedTags\"\n    [layerTagsTitle]=\"layerTagsTitle\"\n    [layerTagsIcon]=\"layerTagsIcon\"\n  ></moz-taglist>\n</div>\n", styles: [".mc-left-icon-input{position:relative}.mc-left-icon-input__icon{position:absolute;z-index:1;top:50%;transform:translateY(-50%);fill:#666;pointer-events:none}.mc-left-icon-input .mc-left-icon-input__icon{left:.75rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input .mc-left-icon-input__input{padding-left:2.9375rem}.mc-left-icon-input--s .mc-left-icon-input__icon{left:.5rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input--s .mc-left-icon-input__input{padding-left:2.4375rem}.mc-text-input{font-family:Roboto,sans-serif;font-weight:400;box-sizing:border-box;outline:none;-webkit-appearance:none;appearance:none;padding:0;margin:0;box-shadow:none;border:none;font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem;transition:box-shadow .2s ease;display:block;width:100%;position:relative;border:1px solid #666666;color:#191919;background-color:#fff;border-radius:4px}.mc-text-input[type=number]::-webkit-inner-spin-button,.mc-text-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.mc-text-input[type=number]{-moz-appearance:textfield}.mc-text-input[type=search]::-webkit-search-decoration:hover,.mc-text-input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-text-input::placeholder{font-size:1rem;line-height:1.375}.mc-text-input::placeholder{margin:0;color:#666;opacity:1}.mc-text-input.is-valid,.mc-text-input.is-invalid{background-repeat:no-repeat;background-size:1.5rem 1.5rem;background-position:right .4375rem center;padding-right:2.5rem}.mc-text-input.is-valid{border-color:#46a610;background-image:url(data:image/svg+xml,)}.mc-text-input.is-valid:hover,.mc-text-input.is-valid.is-hover{border-color:#035010}.mc-text-input.is-invalid{border-color:#c61112;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.5rem' width='1.5rem' viewBox='0 0 24 24' fill='%23c61112'%3E%3Cpath d='M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 18a8 8 0 118-8 8 8 0 01-8 8z'/%3E%3Cpath d='M12 7a1 1 0 00-1 1v4.38a1 1 0 002 0V8a1 1 0 00-1-1z'/%3E%3Ccircle cx='12' cy='16' r='1'/%3E%3C/svg%3E\")}.mc-text-input.is-invalid:hover,.mc-text-input.is-invalid.is-hover{border-color:#530000}.mc-text-input:hover{border-color:#191919}.mc-text-input:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-text-input:disabled{background:#e6e6e6;border-color:#e6e6e6;color:#666;cursor:not-allowed}.mc-text-input--s{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s::placeholder{font-size:.875rem;line-height:1.2857142857}@media screen and (min-width: 680px){.mc-text-input--s\\@from-m{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-m::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1024px){.mc-text-input--s\\@from-l{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-l::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1280px){.mc-text-input--s\\@from-xl{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-xl::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1920px){.mc-text-input--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-xxl::placeholder{font-size:.875rem;line-height:1.2857142857}}.mc-text-input--m{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m::placeholder{font-size:1rem;line-height:1.375}@media screen and (min-width: 680px){.mc-text-input--m\\@from-m{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-m::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-text-input--m\\@from-l{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-l::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-text-input--m\\@from-xl{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-xl::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-text-input--m\\@from-xxl{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-xxl::placeholder{font-size:1rem;line-height:1.375}}.mc-listbox{list-style:none;margin-left:0;padding-left:0;background-color:#fff;border:1px solid #666666;border-radius:3px;position:absolute;overflow-y:auto;margin-top:.25rem;margin-bottom:0;max-height:13.8125rem;min-width:auto;opacity:0;visibility:hidden;max-width:var(--listbox-width, auto);width:100%}.mc-listbox.is-open{opacity:1;visibility:visible;z-index:10}.mc-listbox::-webkit-scrollbar{background-color:#e6e6e6;width:.25rem}.mc-listbox::-webkit-scrollbar-thumb{background:#666666}.mc-listbox__item,.mc-listbox__tile{align-items:center;display:flex;gap:.5rem;min-height:3rem;padding-left:.75rem;padding-right:.75rem;position:relative;justify-content:space-between}.mc-listbox__item:not(:last-child),.mc-listbox__tile:not(:last-child){border-bottom:1px solid #b3b3b3}.mc-listbox__item:hover,.mc-listbox__tile:hover{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox__flag,.mc-listbox__icon{width:2rem;height:2rem}.mc-listbox__flag{font-size:1.4375rem;line-height:1.3913043478;text-align:center}.mc-listbox__empty{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-listbox__label{cursor:pointer;margin-right:auto}.mc-listbox__label:after{content:\"\";position:absolute;inset:0;z-index:2}.mc-listbox__input{order:1}.mc-listbox .is-checked,.mc-listbox .is-selected{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right .75rem center;background-size:1.5rem}.mc-listbox .is-focus{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox .is-disabled{cursor:not-allowed;box-shadow:none;background-color:#ccc;color:#666;pointer-events:none}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input:checked+.mc-listbox__label:before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;content:\"\";height:1.5rem;position:absolute;right:.75rem;top:0;transform:translateY(50%);width:1.5rem}.mc-listbox--left{right:0}.mc-loader{color:#007f8c;align-items:center;display:inline-flex;flex-direction:column}.mc-loader .mc-loader__spinner{height:2rem;width:2rem}.mc-loader .mc-loader__path{stroke-width:4}.mc-loader .mc-loader__path{stroke:currentColor}.mc-loader__spinner:not(:only-child){margin-bottom:1rem}.mc-loader__icon{animation:rotate-loader 2s linear infinite;transform-origin:center}.mc-loader__path{fill:none;stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round;animation:animate-dash-loader 2s ease-in-out infinite}.mc-loader__text{font-size:1rem;line-height:1.375;color:currentColor}.mc-loader--s .mc-loader__spinner{height:1.5rem;width:1.5rem}.mc-loader--s .mc-loader__path{stroke-width:4}.mc-loader--l .mc-loader__spinner{height:4rem;width:4rem}.mc-loader--l .mc-loader__path{stroke-width:8}.mc-loader--dark{color:#191919}.mc-loader--dark .mc-loader__path{stroke:currentColor}.mc-loader--light{color:#fff}.mc-loader--light .mc-loader__path{stroke:currentColor}@keyframes rotate-loader{0%{transform:rotate(0)}to{transform:rotate(270deg)}}@keyframes animate-dash-loader{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.mc-autocomplete{align-self:start;position:relative;min-width:18rem;max-width:var(--autocomplete-width, auto);width:100%}.mc-autocomplete__main{position:relative}.mc-autocomplete__tag,.mc-autocomplete__tools{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.mc-autocomplete__tag{left:2.75rem}.mc-autocomplete__trigger{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mc-autocomplete__tools{align-items:center;background-color:#fff;display:flex;gap:.5rem;justify-content:flex-end;right:.75rem}.is-valid+.mc-autocomplete__tools,.is-invalid+.mc-autocomplete__tools{right:2.5rem}.mc-autocomplete__clear{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;box-shadow:0 0 0 0 transparent;transition:box-shadow .15s ease;background:none;border-radius:50%}.mc-autocomplete__clear:focus{box-shadow:0 0 0 2px #758992}.mc-autocomplete__clear,.mc-autocomplete__clear-icon{height:1.5rem;width:1.5rem}.mc-autocomplete__clear-icon{fill:#666}.mc-autocomplete__clear-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-autocomplete__error{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-autocomplete--multi .mc-autocomplete__trigger{padding-left:calc(2.9375rem + var(--autocomplete-tag-width, 0px))}.mc-autocomplete__taglist{margin-top:1rem}\n"] }]
+                    ], template: "<div\n  id=\"js-autocomplete\"\n  class=\"mc-autocomplete mc-autocomplete--clearable\"\n  [ngClass]=\"{ 'mc-autocomplete--multi': multiple }\"\n  [ngStyle]=\"{\n    '--autocomplete-tag-width':\n      !showSelectedTags && multiple && getSelectedListboxItems().length > 0 ? '3.5rem' : '',\n    '--autocomplete-width': '100%'\n  }\"\n>\n  <div class=\"mc-autocomplete__main\">\n    <moz-tag\n      *ngIf=\"!showSelectedTags && multiple && getSelectedListboxItems().length > 0\"\n      type=\"removable\"\n      class=\"mc-autocomplete__tag mc-tag-removable mc-tag-removable--s\"\n      [size]=\"'s'\"\n      (clickOnRemove)=\"clearFieldEvent()\"\n    >\n      {{ getSelectedListboxItems().length }}</moz-tag\n    >\n\n    <div class=\"mc-left-icon-input\">\n      <moz-icon\n        class=\"mc-left-icon-input__icon\"\n        [iconName]=\"'Navigation_Display_Search_24px'\"\n      ></moz-icon>\n      <input\n        moz-input\n        [type]=\"'text'\"\n        [invalid]=\"invalid\"\n        class=\"mc-left-icon-input__input mc-text-input mc-autocomplete__trigger\"\n        [valid]=\"valid\"\n        [placeholder]=\"placeholder\"\n        [disabled]=\"disabled\"\n        [size]=\"size\"\n        [(ngModel)]=\"search\"\n        (ngModelChange)=\"searchEvent()\"\n        (click)=\"openListbox()\"\n      />\n    </div>\n\n    <div class=\"mc-autocomplete__tools\">\n      <div class=\"mc-autocomplete__loader mc-loader mc-loader--s\" *ngIf=\"loading\">\n        <span class=\"mc-loader__spinner\">\n          <moz-loader class=\"mc-loader__icon\" size=\"s\"></moz-loader>\n        </span>\n      </div>\n      <button\n        class=\"mc-autocomplete__clear\"\n        type=\"button\"\n        *ngIf=\"canClearField()\"\n        (click)=\"clearFieldEvent()\"\n      >\n        <moz-icon\n          class=\"mc-autocomplete__clear-icon\"\n          [iconName]=\"'Navigation_Control_Tag--Cross_24px'\"\n        ></moz-icon\n        ><span class=\"mc-autocomplete__clear-text\">Clear</span>\n      </button>\n    </div>\n  </div>\n  <moz-listbox\n    *ngIf=\"openState\"\n    #listbox\n    [listboxItems]=\"listboxItems\"\n    [isOpen]=\"openState\"\n    [multiple]=\"multiple\"\n    [selectedItems]=\"selectedItems\"\n    (itemsSelected)=\"itemsSelectedListboxEvent($event)\"\n  ></moz-listbox>\n</div>\n<div class=\"mc-autocomplete__error\" *ngIf=\"invalid\">\n  {{ errorContentText }}\n</div>\n<div class=\"mc-autocomplete__taglist\" *ngIf=\"showSelectedTags && multiple\">\n  <moz-taglist\n    #taglist\n    (removeTag)=\"removeTagEvent($event)\"\n    [tagItems]=\"getTagItemsFromSelectedItems()\"\n    [max]=\"maxShowingSelectedTags\"\n    [layerTagsTitle]=\"layerTagsTitle\"\n    [layerTagsIcon]=\"layerTagsIcon\"\n  ></moz-taglist>\n</div>\n", styles: [".mc-left-icon-input{position:relative}.mc-left-icon-input__icon{position:absolute;z-index:1;top:50%;transform:translateY(-50%);fill:#666;pointer-events:none}.mc-left-icon-input .mc-left-icon-input__icon{left:.75rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input .mc-left-icon-input__input{padding-left:2.9375rem}.mc-left-icon-input--s .mc-left-icon-input__icon{left:.5rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input--s .mc-left-icon-input__input{padding-left:2.4375rem}.mc-text-input{font-family:Roboto,sans-serif;font-weight:400;box-sizing:border-box;outline:none;-webkit-appearance:none;appearance:none;padding:0;margin:0;box-shadow:none;border:none;font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem;transition:box-shadow .2s ease;display:block;width:100%;position:relative;border:1px solid #666666;color:#191919;background-color:#fff;border-radius:4px}.mc-text-input[type=number]::-webkit-inner-spin-button,.mc-text-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.mc-text-input[type=number]{-moz-appearance:textfield}.mc-text-input[type=search]::-webkit-search-decoration:hover,.mc-text-input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-text-input::placeholder{font-size:1rem;line-height:1.375}.mc-text-input::placeholder{margin:0;color:#666;opacity:1}.mc-text-input.is-valid,.mc-text-input.is-invalid{background-repeat:no-repeat;background-size:1.5rem 1.5rem;background-position:right .4375rem center;padding-right:2.5rem}.mc-text-input.is-valid{border-color:#46a610;background-image:url(data:image/svg+xml,)}.mc-text-input.is-valid:hover,.mc-text-input.is-valid.is-hover{border-color:#035010}.mc-text-input.is-invalid{border-color:#c61112;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.5rem' width='1.5rem' viewBox='0 0 24 24' fill='%23c61112'%3E%3Cpath d='M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 18a8 8 0 118-8 8 8 0 01-8 8z'/%3E%3Cpath d='M12 7a1 1 0 00-1 1v4.38a1 1 0 002 0V8a1 1 0 00-1-1z'/%3E%3Ccircle cx='12' cy='16' r='1'/%3E%3C/svg%3E\")}.mc-text-input.is-invalid:hover,.mc-text-input.is-invalid.is-hover{border-color:#530000}.mc-text-input:hover{border-color:#191919}.mc-text-input:focus{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-text-input:disabled{background:#e6e6e6;border-color:#e6e6e6;color:#666;cursor:not-allowed}.mc-text-input--s{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s::placeholder{font-size:.875rem;line-height:1.2857142857}@media screen and (min-width: 680px){.mc-text-input--s\\@from-m{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-m::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1024px){.mc-text-input--s\\@from-l{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-l::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1280px){.mc-text-input--s\\@from-xl{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-xl::placeholder{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1920px){.mc-text-input--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857;min-height:2rem;padding:.375rem .4375rem}.mc-text-input--s\\@from-xxl::placeholder{font-size:.875rem;line-height:1.2857142857}}.mc-text-input--m{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m::placeholder{font-size:1rem;line-height:1.375}@media screen and (min-width: 680px){.mc-text-input--m\\@from-m{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-m::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-text-input--m\\@from-l{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-l::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-text-input--m\\@from-xl{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-xl::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-text-input--m\\@from-xxl{font-size:1rem;line-height:1.375;min-height:3rem;padding:.75rem .6875rem}.mc-text-input--m\\@from-xxl::placeholder{font-size:1rem;line-height:1.375}}.mc-listbox{list-style:none;margin-left:0;padding-left:0;background-color:#fff;border:1px solid #666666;border-radius:3px;position:absolute;overflow-y:auto;margin-top:.25rem;margin-bottom:0;max-height:13.8125rem;min-width:auto;opacity:0;visibility:hidden;max-width:var(--listbox-width, auto);width:100%}.mc-listbox.is-open{opacity:1;visibility:visible;z-index:10}.mc-listbox::-webkit-scrollbar{background-color:#e6e6e6;width:.25rem}.mc-listbox::-webkit-scrollbar-thumb{background:#666666}.mc-listbox__item,.mc-listbox__tile{align-items:center;display:flex;gap:.5rem;min-height:3rem;padding-left:.75rem;padding-right:.75rem;position:relative;justify-content:space-between}.mc-listbox__item:not(:last-child),.mc-listbox__tile:not(:last-child){border-bottom:1px solid #b3b3b3}.mc-listbox__item:hover,.mc-listbox__tile:hover{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox__flag,.mc-listbox__icon{width:2rem;height:2rem}.mc-listbox__flag{font-size:1.4375rem;line-height:1.3913043478;text-align:center}.mc-listbox__empty{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-listbox__label{cursor:pointer;margin-right:auto}.mc-listbox__label:after{content:\"\";position:absolute;inset:0;z-index:2}.mc-listbox__input{order:1}.mc-listbox .is-checked,.mc-listbox .is-selected{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right .75rem center;background-size:1.5rem}.mc-listbox .is-focus{background-color:#e6e6e6;box-shadow:inset 9px 0 0 -7px #191919}.mc-listbox .is-disabled{cursor:not-allowed;box-shadow:none;background-color:#ccc;color:#666;pointer-events:none}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-listbox:not(.mc-listbox--multi) .mc-listbox__input:checked+.mc-listbox__label:before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 18.68a1 1 0 01-.7-.29l-5-5A1 1 0 015.73 12L10 16.27 18.31 8a1 1 0 011.42 1.42l-9 9a1 1 0 01-.73.26z'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;content:\"\";height:1.5rem;position:absolute;right:.75rem;top:0;transform:translateY(50%);width:1.5rem}.mc-listbox--left{right:0}.mc-loader{color:#007f8c;align-items:center;display:inline-flex;flex-direction:column}.mc-loader .mc-loader__spinner{height:2rem;width:2rem}.mc-loader .mc-loader__path{stroke-width:4}.mc-loader .mc-loader__path{stroke:currentColor}.mc-loader__spinner:not(:only-child){margin-bottom:1rem}.mc-loader__icon{animation:rotate-loader 2s linear infinite;transform-origin:center}.mc-loader__path{fill:none;stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round;animation:animate-dash-loader 2s ease-in-out infinite}.mc-loader__text{font-size:1rem;line-height:1.375;color:currentColor}.mc-loader--s .mc-loader__spinner{height:1.5rem;width:1.5rem}.mc-loader--s .mc-loader__path{stroke-width:4}.mc-loader--l .mc-loader__spinner{height:4rem;width:4rem}.mc-loader--l .mc-loader__path{stroke-width:8}.mc-loader--dark{color:#191919}.mc-loader--dark .mc-loader__path{stroke:currentColor}.mc-loader--light{color:#fff}.mc-loader--light .mc-loader__path{stroke:currentColor}@keyframes rotate-loader{0%{transform:rotate(0)}to{transform:rotate(270deg)}}@keyframes animate-dash-loader{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.mc-autocomplete{align-self:start;position:relative;min-width:18rem;max-width:var(--autocomplete-width, auto);width:100%}.mc-autocomplete__main{position:relative}.mc-autocomplete__tag,.mc-autocomplete__tools{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.mc-autocomplete__tag{left:2.75rem}.mc-autocomplete__trigger{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mc-autocomplete__tools{align-items:center;background-color:#fff;display:flex;gap:.5rem;justify-content:flex-end;right:.75rem}.is-valid+.mc-autocomplete__tools,.is-invalid+.mc-autocomplete__tools{right:2.5rem}.mc-autocomplete__clear{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;box-shadow:0 0 0 0 transparent;transition:box-shadow .15s ease;background:none;border-radius:50%}.mc-autocomplete__clear:focus{box-shadow:0 0 0 2px #758992}.mc-autocomplete__clear,.mc-autocomplete__clear-icon{height:1.5rem;width:1.5rem}.mc-autocomplete__clear-icon{fill:#666}.mc-autocomplete__clear-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-autocomplete__error{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-autocomplete--multi .mc-autocomplete__trigger{padding-left:calc(2.9375rem + var(--autocomplete-tag-width, 0px))}.mc-autocomplete__taglist{margin-top:1rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Injector, decorators: [{
                     type: Inject,
                     args: [Injector]
@@ -3988,6 +4014,148 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                 }]
         }] });
 
+var Direction;
+(function (Direction) {
+    Direction["Up"] = "Up";
+    Direction["Down"] = "Down";
+})(Direction || (Direction = {}));
+
+class HeaderComponent {
+    constructor(cdRef, elementRef) {
+        this.cdRef = cdRef;
+        this.elementRef = elementRef;
+        this.title = '';
+        this.subtitle = '';
+        this.badgeType = 'information';
+        this.badgeContent = '';
+        this.size = 'm';
+        this.showShadow = true;
+        this.sticky = false;
+        this.animate = false;
+        this.showBack = false;
+        this.backButtonLabel = 'Back';
+        this.backEvent = new EventEmitter();
+        this.directionChangeEvent = new EventEmitter();
+        this.direction = Direction.Up;
+        this.showTabs = true;
+        this.showBreadcrumb = true;
+    }
+    ngAfterViewInit() {
+        if (this.tabsRef == null ||
+            (this.tabsRef?.nativeElement.children && this.tabsRef?.nativeElement.children.length === 0)) {
+            this.showTabs = false;
+        }
+        if (this.breadcrumbRef == null ||
+            (this.breadcrumbRef?.nativeElement.children &&
+                this.breadcrumbRef?.nativeElement.children.length === 0)) {
+            this.showBreadcrumb = false;
+        }
+        this.scroll();
+        this.cdRef.detectChanges();
+    }
+    onParentScroll(parentElement) {
+        let lastScrollTop = parentElement.scrollTop || 0;
+        const handleScroll = () => {
+            const currentScrollTop = parentElement.scrollTop || 0;
+            if (currentScrollTop > lastScrollTop) {
+                this.direction = Direction.Down;
+            }
+            else {
+                this.direction = Direction.Up;
+            }
+            this.directionChangeEvent.emit(this.direction);
+            lastScrollTop = currentScrollTop;
+            this.cdRef.detectChanges();
+        };
+        parentElement.addEventListener('scroll', handleScroll);
+    }
+    scroll() {
+        if (this.animate && this.sticky) {
+            const parentElement = this.findParentWithScroll(this.elementRef.nativeElement);
+            if (parentElement) {
+                this.onParentScroll(parentElement);
+            }
+            else {
+                fromEvent(window, 'scroll')
+                    .pipe(map(() => window.scrollY), pairwise(), map(([y1, y2]) => {
+                    return y2 < y1 ? Direction.Up : Direction.Down;
+                }))
+                    .subscribe((direction) => {
+                    this.direction = direction;
+                    this.directionChangeEvent.emit(this.direction);
+                    this.cdRef.detectChanges();
+                });
+            }
+        }
+    }
+    findParentWithScroll(element) {
+        if (element.parentElement) {
+            const parent = element.parentElement;
+            const hasOverflow = window.getComputedStyle(parent).overflow;
+            if (hasOverflow === 'auto' || hasOverflow === 'scroll') {
+                return parent;
+            }
+            else {
+                return this.findParentWithScroll(parent);
+            }
+        }
+        return null;
+    }
+    back() {
+        this.backEvent.emit(true);
+    }
+}
+HeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HeaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: HeaderComponent, selector: "moz-header", inputs: { title: "title", subtitle: "subtitle", badgeType: "badgeType", badgeContent: "badgeContent", size: "size", showShadow: "showShadow", sticky: "sticky", animate: "animate", showBack: "showBack", backButtonLabel: "backButtonLabel" }, outputs: { backEvent: "backEvent", directionChangeEvent: "directionChangeEvent" }, viewQueries: [{ propertyName: "tabsRef", first: true, predicate: ["tabsRef"], descendants: true }, { propertyName: "breadcrumbRef", first: true, predicate: ["breadcrumbRef"], descendants: true }], ngImport: i0, template: "<div\n  class=\"mc-header\"\n  [ngClass]=\"[\n    showShadow ? 'mc-header--shadow' : '',\n    sticky ? 'mc-header--sticky' : '',\n    animate ? 'mc-header--animate' : '',\n    animate ? (direction === 'Up' ? 'mc-header--up' : 'mc-header--down') : ''\n  ]\"\n>\n  <div class=\"mc-header__container\">\n    <ng-container ngProjectAs=\"'moz-breadcrumb'\" #breadcrumbRef *ngIf=\"showBreadcrumb && !showBack\">\n      <ng-content select=\"moz-breadcrumb\"></ng-content>\n    </ng-container>\n    <div class=\"mc-header__actions\">\n      <div class=\"mc-header__icons\">\n        <ng-content select=\"[icons]\"></ng-content>\n      </div>\n      <div class=\"mc-header__selector\">\n        <ng-content select=\"[selector]\"></ng-content>\n      </div>\n    </div>\n    <div class=\"mc-header__content\">\n      <div class=\"mc-header__content-main\">\n        <button\n          class=\"mc-header__back\"\n          type=\"button\"\n          *ngIf=\"showBack && !showBreadcrumb\"\n          (click)=\"back()\"\n        >\n          <moz-icon iconName=\"Navigation_Arrow_Back_24px\"></moz-icon>\n          <span class=\"mc-header__back-label\">{{ backButtonLabel }}</span>\n        </button>\n        <h1 class=\"mc-header__title mc-header__title--{{ size }}\">{{ title }}</h1>\n      </div>\n      <div\n        class=\"mc-header__content-aside\"\n        [ngClass]=\"[showBack && !showBreadcrumb ? 'can-navigate' : '']\"\n      >\n        <span class=\"mc-header__subtitle\" *ngIf=\"subtitle\">{{ subtitle }}</span>\n        <div *ngIf=\"badgeContent\" moz-badge [type]=\"badgeType || 'information'\">\n          {{ badgeContent }}\n        </div>\n      </div>\n    </div>\n  </div>\n  <div class=\"mc-header__tabs mc-divider-top mc-divider-top--light\" #tabsRef *ngIf=\"showTabs\">\n    <ng-container ngProjectAs=\"'moz-tabs'\">\n      <ng-content select=\"moz-tabs\"></ng-content>\n    </ng-container>\n  </div>\n</div>\n", styles: [".mc-divider{position:relative}.mc-divider-top{border-top:1px solid #666666}.mc-divider-top--lightest{border-top-color:#fff}.mc-divider-top--light{border-top-color:#b3b3b3}.mc-divider-top--dark{border-top-color:#000}.mc-divider-top--m{border-top-width:.25rem}.mc-divider-top--l{border-top-width:.5rem}.mc-divider-right{border-right:1px solid #666666}.mc-divider-right--lightest{border-right-color:#fff}.mc-divider-right--light{border-right-color:#b3b3b3}.mc-divider-right--dark{border-right-color:#000}.mc-divider-right--m{border-right-width:.25rem}.mc-divider-right--l{border-right-width:.5rem}.mc-divider-bottom{border-bottom:1px solid #666666}.mc-divider-bottom--lightest{border-bottom-color:#fff}.mc-divider-bottom--light{border-bottom-color:#b3b3b3}.mc-divider-bottom--dark{border-bottom-color:#000}.mc-divider-bottom--m{border-bottom-width:.25rem}.mc-divider-bottom--l{border-bottom-width:.5rem}.mc-divider-left{border-left:1px solid #666666}.mc-divider-left--lightest{border-left-color:#fff}.mc-divider-left--light{border-left-color:#b3b3b3}.mc-divider-left--dark{border-left-color:#000}.mc-divider-left--m{border-left-width:.25rem}.mc-divider-left--l{border-left-width:.5rem}.mc-header{font-family:Roboto,sans-serif;font-weight:400;background-color:#fff;z-index:5}.mc-header__container{padding:.5rem 2rem 1rem;display:grid}@media (min-width: 1024px) and (max-width: 1279px){.mc-header__container{padding-left:3rem;padding-right:3rem}}.mc-header__breadcrumb{grid-column:1;grid-row:auto}.mc-header__content{color:#000;grid-column:1;grid-row:auto;padding-top:.5rem}.mc-header__content-main{display:flex;align-items:center;gap:1rem}.mc-header__content-main:not(:only-child){margin-bottom:.25rem}.mc-header__content-aside{display:flex;align-items:flex-start;flex-direction:column;gap:.5rem;padding-bottom:.5rem}.mc-header__content-aside.can-navigate{padding-left:3rem}@media screen and (min-width: 1024px){.mc-header__content-aside{align-items:center;flex-direction:row;gap:1rem;padding-bottom:0}}.mc-header__back{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;align-items:center;background-color:transparent;justify-content:center;color:currentColor;display:flex;height:2rem;width:2rem}.mc-header__back-icon{color:#333;height:1.5rem;width:1.5rem}.mc-header__back-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-header__title{font-size:1.75rem;line-height:1.2857142857;font-weight:700;margin-top:0;margin-bottom:0}.mc-header__title--s{font-size:1.4375rem;line-height:1.3913043478}.mc-header__title--l{font-size:2.125rem;line-height:1.2941176471}.mc-header__title--xl{font-size:2.5625rem;line-height:1.3658536585}.mc-header__subtitle{font-size:1rem;line-height:1.375}.mc-header__actions,.mc-header__icons{display:flex;gap:1.5rem}.mc-header__actions{align-items:flex-end;align-self:flex-start;grid-column:1;grid-row:1;justify-self:end;margin-bottom:.5rem;min-height:2.5rem}@media screen and (min-width: 1024px){.mc-header__actions{grid-column:2;grid-row:1;margin-bottom:0}}.mc-header__selector:not(:only-child){padding-left:1.5625rem;position:relative}.mc-header__selector:not(:only-child):before{background:#b3b3b3;content:\"\";display:block;width:1px;height:100%;position:absolute;top:50%;transform:translateY(-50%);left:0}.mc-header__tabs{padding-left:2rem;padding-right:2rem}@media (min-width: 1024px) and (max-width: 1279px){.mc-header__tabs{padding-left:3rem;padding-right:3rem}}.mc-header--shadow{box-shadow:0 1px 5px #19191933}.mc-header--animate{left:0;position:absolute;right:0;transition:transform ease-out .4s}.mc-header--sticky{position:sticky;top:0}.mc-header--up{transform:translateY(0)}.mc-header--down{transform:translateY(calc(-100% - 5px))}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BadgeComponent, selector: "[moz-badge]", inputs: ["type"] }, { kind: "component", type: IconComponent, selector: "moz-icon", inputs: ["iconName"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'moz-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"mc-header\"\n  [ngClass]=\"[\n    showShadow ? 'mc-header--shadow' : '',\n    sticky ? 'mc-header--sticky' : '',\n    animate ? 'mc-header--animate' : '',\n    animate ? (direction === 'Up' ? 'mc-header--up' : 'mc-header--down') : ''\n  ]\"\n>\n  <div class=\"mc-header__container\">\n    <ng-container ngProjectAs=\"'moz-breadcrumb'\" #breadcrumbRef *ngIf=\"showBreadcrumb && !showBack\">\n      <ng-content select=\"moz-breadcrumb\"></ng-content>\n    </ng-container>\n    <div class=\"mc-header__actions\">\n      <div class=\"mc-header__icons\">\n        <ng-content select=\"[icons]\"></ng-content>\n      </div>\n      <div class=\"mc-header__selector\">\n        <ng-content select=\"[selector]\"></ng-content>\n      </div>\n    </div>\n    <div class=\"mc-header__content\">\n      <div class=\"mc-header__content-main\">\n        <button\n          class=\"mc-header__back\"\n          type=\"button\"\n          *ngIf=\"showBack && !showBreadcrumb\"\n          (click)=\"back()\"\n        >\n          <moz-icon iconName=\"Navigation_Arrow_Back_24px\"></moz-icon>\n          <span class=\"mc-header__back-label\">{{ backButtonLabel }}</span>\n        </button>\n        <h1 class=\"mc-header__title mc-header__title--{{ size }}\">{{ title }}</h1>\n      </div>\n      <div\n        class=\"mc-header__content-aside\"\n        [ngClass]=\"[showBack && !showBreadcrumb ? 'can-navigate' : '']\"\n      >\n        <span class=\"mc-header__subtitle\" *ngIf=\"subtitle\">{{ subtitle }}</span>\n        <div *ngIf=\"badgeContent\" moz-badge [type]=\"badgeType || 'information'\">\n          {{ badgeContent }}\n        </div>\n      </div>\n    </div>\n  </div>\n  <div class=\"mc-header__tabs mc-divider-top mc-divider-top--light\" #tabsRef *ngIf=\"showTabs\">\n    <ng-container ngProjectAs=\"'moz-tabs'\">\n      <ng-content select=\"moz-tabs\"></ng-content>\n    </ng-container>\n  </div>\n</div>\n", styles: [".mc-divider{position:relative}.mc-divider-top{border-top:1px solid #666666}.mc-divider-top--lightest{border-top-color:#fff}.mc-divider-top--light{border-top-color:#b3b3b3}.mc-divider-top--dark{border-top-color:#000}.mc-divider-top--m{border-top-width:.25rem}.mc-divider-top--l{border-top-width:.5rem}.mc-divider-right{border-right:1px solid #666666}.mc-divider-right--lightest{border-right-color:#fff}.mc-divider-right--light{border-right-color:#b3b3b3}.mc-divider-right--dark{border-right-color:#000}.mc-divider-right--m{border-right-width:.25rem}.mc-divider-right--l{border-right-width:.5rem}.mc-divider-bottom{border-bottom:1px solid #666666}.mc-divider-bottom--lightest{border-bottom-color:#fff}.mc-divider-bottom--light{border-bottom-color:#b3b3b3}.mc-divider-bottom--dark{border-bottom-color:#000}.mc-divider-bottom--m{border-bottom-width:.25rem}.mc-divider-bottom--l{border-bottom-width:.5rem}.mc-divider-left{border-left:1px solid #666666}.mc-divider-left--lightest{border-left-color:#fff}.mc-divider-left--light{border-left-color:#b3b3b3}.mc-divider-left--dark{border-left-color:#000}.mc-divider-left--m{border-left-width:.25rem}.mc-divider-left--l{border-left-width:.5rem}.mc-header{font-family:Roboto,sans-serif;font-weight:400;background-color:#fff;z-index:5}.mc-header__container{padding:.5rem 2rem 1rem;display:grid}@media (min-width: 1024px) and (max-width: 1279px){.mc-header__container{padding-left:3rem;padding-right:3rem}}.mc-header__breadcrumb{grid-column:1;grid-row:auto}.mc-header__content{color:#000;grid-column:1;grid-row:auto;padding-top:.5rem}.mc-header__content-main{display:flex;align-items:center;gap:1rem}.mc-header__content-main:not(:only-child){margin-bottom:.25rem}.mc-header__content-aside{display:flex;align-items:flex-start;flex-direction:column;gap:.5rem;padding-bottom:.5rem}.mc-header__content-aside.can-navigate{padding-left:3rem}@media screen and (min-width: 1024px){.mc-header__content-aside{align-items:center;flex-direction:row;gap:1rem;padding-bottom:0}}.mc-header__back{margin:0;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;align-items:center;background-color:transparent;justify-content:center;color:currentColor;display:flex;height:2rem;width:2rem}.mc-header__back-icon{color:#333;height:1.5rem;width:1.5rem}.mc-header__back-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mc-header__title{font-size:1.75rem;line-height:1.2857142857;font-weight:700;margin-top:0;margin-bottom:0}.mc-header__title--s{font-size:1.4375rem;line-height:1.3913043478}.mc-header__title--l{font-size:2.125rem;line-height:1.2941176471}.mc-header__title--xl{font-size:2.5625rem;line-height:1.3658536585}.mc-header__subtitle{font-size:1rem;line-height:1.375}.mc-header__actions,.mc-header__icons{display:flex;gap:1.5rem}.mc-header__actions{align-items:flex-end;align-self:flex-start;grid-column:1;grid-row:1;justify-self:end;margin-bottom:.5rem;min-height:2.5rem}@media screen and (min-width: 1024px){.mc-header__actions{grid-column:2;grid-row:1;margin-bottom:0}}.mc-header__selector:not(:only-child){padding-left:1.5625rem;position:relative}.mc-header__selector:not(:only-child):before{background:#b3b3b3;content:\"\";display:block;width:1px;height:100%;position:absolute;top:50%;transform:translateY(-50%);left:0}.mc-header__tabs{padding-left:2rem;padding-right:2rem}@media (min-width: 1024px) and (max-width: 1279px){.mc-header__tabs{padding-left:3rem;padding-right:3rem}}.mc-header--shadow{box-shadow:0 1px 5px #19191933}.mc-header--animate{left:0;position:absolute;right:0;transition:transform ease-out .4s}.mc-header--sticky{position:sticky;top:0}.mc-header--up{transform:translateY(0)}.mc-header--down{transform:translateY(calc(-100% - 5px))}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { title: [{
+                type: Input
+            }], subtitle: [{
+                type: Input
+            }], badgeType: [{
+                type: Input
+            }], badgeContent: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], showShadow: [{
+                type: Input
+            }], sticky: [{
+                type: Input
+            }], animate: [{
+                type: Input
+            }], showBack: [{
+                type: Input
+            }], backButtonLabel: [{
+                type: Input
+            }], backEvent: [{
+                type: Output
+            }], directionChangeEvent: [{
+                type: Output
+            }], tabsRef: [{
+                type: ViewChild,
+                args: ['tabsRef']
+            }], breadcrumbRef: [{
+                type: ViewChild,
+                args: ['breadcrumbRef']
+            }] } });
+
+class HeaderModule {
+}
+HeaderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+HeaderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: HeaderModule, declarations: [HeaderComponent], imports: [CommonModule, BadgeModule, IconModule], exports: [HeaderComponent] });
+HeaderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HeaderModule, imports: [CommonModule, BadgeModule, IconModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HeaderModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [HeaderComponent],
+                    imports: [CommonModule, BadgeModule, IconModule],
+                    exports: [HeaderComponent],
+                }]
+        }] });
+
 class LinkComponent {
     constructor(routerLinkActive, routerLink) {
         this.routerLinkActive = routerLinkActive;
@@ -4058,6 +4226,7 @@ class BreadcrumbComponent {
         this.items = [];
         this.darkMode = false;
         this.responsive = false;
+        this.noPadding = true;
         this.clickLinkEvent = new EventEmitter();
     }
     getActiveItemIndex() {
@@ -4071,16 +4240,18 @@ class BreadcrumbComponent {
     }
 }
 BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: BreadcrumbComponent, selector: "moz-breadcrumb", inputs: { items: "items", darkMode: "darkMode", responsive: "responsive" }, outputs: { clickLinkEvent: "clickLinkEvent" }, ngImport: i0, template: "<nav\n  class=\"mc-breadcrumb\"\n  [ngClass]=\"[darkMode ? 'mc-breadcrumb--dark' : '', responsive ? 'mc-breadcrumb--responsive' : '']\"\n  aria-label=\"Breadcrumb\"\n>\n  <ul class=\"mc-breadcrumb__container\">\n    <ng-container *ngFor=\"let item of items; let i = index\">\n      <li\n        class=\"mc-breadcrumb__item is-active\"\n        [ngClass]=\"{ 'is-active': responsive && i === getActiveItemIndex() }\"\n        (clickLinkEvent)=\"navigate(item)\"\n      >\n        <moz-link\n          *ngIf=\"!item.href; else withHref\"\n          [size]=\"'s'\"\n          [theme]=\"darkMode ? 'light' : ''\"\n          routerLinkActive\n          [routerLink]=\"item.route\"\n          [active]=\"item.active\"\n          >{{ item.label }}</moz-link\n        >\n        <ng-template #withHref>\n          <moz-link\n            *ngIf=\"!item.href; else withHref\"\n            [size]=\"'s'\"\n            [theme]=\"darkMode ? 'light' : ''\"\n            [href]=\"item.href\"\n            [active]=\"item.active\"\n            >{{ item.label }}</moz-link\n          >\n        </ng-template>\n      </li>\n    </ng-container>\n  </ul>\n</nav>\n", styles: [".mc-link{align-items:center;box-sizing:border-box;cursor:pointer;display:inline-flex;font-size:inherit;justify-content:center;line-height:inherit;text-decoration:underline;transition:color ease .2s;gap:.25rem;color:#000;position:relative;font-size:1rem;line-height:1.375}.mc-link:focus{outline:none}.mc-link:focus:after{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-link:visited{color:#333}.mc-link:hover{color:#666}.mc-link:active{color:#333}.mc-link.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--s{font-size:.875rem;line-height:1.2857142857}@media screen and (min-width: 680px){.mc-link--s\\@from-m{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1024px){.mc-link--s\\@from-l{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1280px){.mc-link--s\\@from-xl{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1920px){.mc-link--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857}}.mc-link--m{font-size:1rem;line-height:1.375}@media screen and (min-width: 680px){.mc-link--m\\@from-m{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-link--m\\@from-l{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-link--m\\@from-xl{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-link--m\\@from-xxl{font-size:1rem;line-height:1.375}}.mc-link:after{border-radius:2px;box-shadow:0 0 0 0 transparent;content:\"\";display:block;pointer-events:none;position:absolute;inset:0;transition:box-shadow .2s ease}.mc-link__icon{display:block;height:1rem;fill:currentColor;flex-shrink:0;width:1rem}.mc-link--light{color:#fff}.mc-link--light:visited{color:#ccc}.mc-link--light:hover{color:#999}.mc-link--light:active{color:#ccc}.mc-link--light.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary{color:#007f8c}.mc-link--primary:visited{color:#006974}.mc-link--primary:hover{color:#004e57}.mc-link--primary:active{color:#006974}.mc-link--primary.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary-02{color:#494f60}.mc-link--primary-02:visited{color:#343b4c}.mc-link--primary-02:hover{color:#171b26}.mc-link--primary-02:active{color:#343b4c}.mc-link--primary-02.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--danger{color:#c61112}.mc-link--danger:visited{color:#8c0003}.mc-link--danger:hover{color:#530000}.mc-link--danger:active{color:#8c0003}.mc-link--danger.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-breadcrumb{font-family:Roboto,sans-serif;font-weight:400;color:#191919;padding:.9375rem 0 .9375rem 1.125rem}@media screen and (min-width: 360px){.mc-breadcrumb{padding-left:1.25rem}}@media screen and (min-width: 390px){.mc-breadcrumb{padding-left:1.375rem}}@media screen and (min-width: 680px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 769px){.mc-breadcrumb{padding-left:2.125rem}}@media screen and (min-width: 1024px){.mc-breadcrumb{padding-left:3rem}}@media screen and (min-width: 1280px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 1440px){.mc-breadcrumb{padding-left:7rem}}@media screen and (min-width: 1680px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 1920px){.mc-breadcrumb{padding-left:2.5rem}}.mc-breadcrumb__container{list-style:none;margin-left:0;padding-left:0;display:flex;flex-wrap:wrap;margin-bottom:0;margin-top:0}.mc-breadcrumb__item{padding-right:.5rem;background-position:left center;background-repeat:no-repeat;background-size:1rem}@media screen and (min-width: 1024px){.mc-breadcrumb__item{flex-shrink:0}}.mc-breadcrumb__item.is-active,.mc-breadcrumb__item:only-child,.mc-breadcrumb__item:not(:first-child){padding-left:1.5rem}.mc-breadcrumb__item:not(:first-child){background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23333333'%3E%3Cpath d='M5.5 14a1 1 0 01-.71-.29 1 1 0 010-1.42L9.09 8l-4.3-4.29a1 1 0 011.42-1.42l5 5a1 1 0 010 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}@media screen and (max-width: 1023px){.mc-breadcrumb__item.is-active,.mc-breadcrumb__item:only-child{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23333333'%3E%3Cpath d='M10.5 14a1 1 0 01-.71-.29l-5-5a1 1 0 010-1.42l5-5a1 1 0 111.42 1.42L6.91 8l4.3 4.29a1 1 0 010 1.42 1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}}.mc-breadcrumb__current,.mc-breadcrumb__current.mc-link{cursor:default;text-decoration:none}.mc-breadcrumb__current,.mc-breadcrumb__current:active,.mc-breadcrumb__current:focus,.mc-breadcrumb__current:hover,.mc-breadcrumb__current:visited,.mc-breadcrumb__current.mc-link,.mc-breadcrumb__current.mc-link:active,.mc-breadcrumb__current.mc-link:focus,.mc-breadcrumb__current.mc-link:hover,.mc-breadcrumb__current.mc-link:visited{color:currentColor}.mc-breadcrumb--dark{background-color:#4d4d4d;color:#fff}.mc-breadcrumb--dark .mc-breadcrumb__item:not(:first-child){background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M5.5 14a1 1 0 01-.71-.29 1 1 0 010-1.42L9.09 8l-4.3-4.29a1 1 0 011.42-1.42l5 5a1 1 0 010 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}@media screen and (max-width: 1023px){.mc-breadcrumb--dark .mc-breadcrumb__item.is-active,.mc-breadcrumb--dark .mc-breadcrumb__item:only-child{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M10.5 14a1 1 0 01-.71-.29l-5-5a1 1 0 010-1.42l5-5a1 1 0 111.42 1.42L6.91 8l4.3 4.29a1 1 0 010 1.42 1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}}@media screen and (max-width: 1023px){.mc-breadcrumb--responsive .mc-breadcrumb__item:not(.is-active){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;visibility:visible;white-space:nowrap}}.mc-breadcrumb--no-padding{padding-left:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LinkComponent, selector: "moz-link", inputs: ["size", "theme", "iconPosition", "disabled", "showIcon", "active", "href"], outputs: ["clickLinkEvent"] }, { kind: "directive", type: i1$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: BreadcrumbComponent, selector: "moz-breadcrumb", inputs: { items: "items", darkMode: "darkMode", responsive: "responsive", noPadding: "noPadding" }, outputs: { clickLinkEvent: "clickLinkEvent" }, ngImport: i0, template: "<nav\n  class=\"mc-breadcrumb\"\n  [ngClass]=\"[\n    darkMode ? 'mc-breadcrumb--dark' : '',\n    responsive ? 'mc-breadcrumb--responsive' : '',\n    noPadding ? 'mc-breadcrumb--no-padding' : ''\n  ]\"\n  aria-label=\"Breadcrumb\"\n>\n  <ul class=\"mc-breadcrumb__container\">\n    <ng-container *ngFor=\"let item of items; let i = index\">\n      <li\n        class=\"mc-breadcrumb__item is-active\"\n        [ngClass]=\"{ 'is-active': responsive && i === getActiveItemIndex() }\"\n        (clickLinkEvent)=\"navigate(item)\"\n      >\n        <moz-link\n          *ngIf=\"!item.href; else withHref\"\n          [size]=\"'s'\"\n          [theme]=\"darkMode ? 'light' : ''\"\n          routerLinkActive\n          [routerLink]=\"item.route\"\n          [active]=\"item.active\"\n          >{{ item.label }}</moz-link\n        >\n        <ng-template #withHref>\n          <moz-link\n            *ngIf=\"!item.href; else withHref\"\n            [size]=\"'s'\"\n            [theme]=\"darkMode ? 'light' : ''\"\n            [href]=\"item.href\"\n            [active]=\"item.active\"\n            >{{ item.label }}</moz-link\n          >\n        </ng-template>\n      </li>\n    </ng-container>\n  </ul>\n</nav>\n", styles: [".mc-link{align-items:center;box-sizing:border-box;cursor:pointer;display:inline-flex;font-size:inherit;justify-content:center;line-height:inherit;text-decoration:underline;transition:color ease .2s;gap:.25rem;color:#000;position:relative;font-size:1rem;line-height:1.375}.mc-link:focus{outline:none}.mc-link:focus:after{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-link:visited{color:#333}.mc-link:hover{color:#666}.mc-link:active{color:#333}.mc-link.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--s{font-size:.875rem;line-height:1.2857142857}@media screen and (min-width: 680px){.mc-link--s\\@from-m{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1024px){.mc-link--s\\@from-l{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1280px){.mc-link--s\\@from-xl{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1920px){.mc-link--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857}}.mc-link--m{font-size:1rem;line-height:1.375}@media screen and (min-width: 680px){.mc-link--m\\@from-m{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-link--m\\@from-l{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-link--m\\@from-xl{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-link--m\\@from-xxl{font-size:1rem;line-height:1.375}}.mc-link:after{border-radius:2px;box-shadow:0 0 0 0 transparent;content:\"\";display:block;pointer-events:none;position:absolute;inset:0;transition:box-shadow .2s ease}.mc-link__icon{display:block;height:1rem;fill:currentColor;flex-shrink:0;width:1rem}.mc-link--light{color:#fff}.mc-link--light:visited{color:#ccc}.mc-link--light:hover{color:#999}.mc-link--light:active{color:#ccc}.mc-link--light.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary{color:#007f8c}.mc-link--primary:visited{color:#006974}.mc-link--primary:hover{color:#004e57}.mc-link--primary:active{color:#006974}.mc-link--primary.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary-02{color:#494f60}.mc-link--primary-02:visited{color:#343b4c}.mc-link--primary-02:hover{color:#171b26}.mc-link--primary-02:active{color:#343b4c}.mc-link--primary-02.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--danger{color:#c61112}.mc-link--danger:visited{color:#8c0003}.mc-link--danger:hover{color:#530000}.mc-link--danger:active{color:#8c0003}.mc-link--danger.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-breadcrumb{font-family:Roboto,sans-serif;font-weight:400;color:#191919;padding:.9375rem 0 .9375rem 1.125rem}@media screen and (min-width: 360px){.mc-breadcrumb{padding-left:1.25rem}}@media screen and (min-width: 390px){.mc-breadcrumb{padding-left:1.375rem}}@media screen and (min-width: 680px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 769px){.mc-breadcrumb{padding-left:2.125rem}}@media screen and (min-width: 1024px){.mc-breadcrumb{padding-left:3rem}}@media screen and (min-width: 1280px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 1440px){.mc-breadcrumb{padding-left:7rem}}@media screen and (min-width: 1680px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 1920px){.mc-breadcrumb{padding-left:2.5rem}}.mc-breadcrumb__container{list-style:none;margin-left:0;padding-left:0;display:flex;flex-wrap:wrap;margin-bottom:0;margin-top:0}.mc-breadcrumb__item{padding-right:.5rem;background-position:left center;background-repeat:no-repeat;background-size:1rem}@media screen and (min-width: 1024px){.mc-breadcrumb__item{flex-shrink:0}}.mc-breadcrumb__item.is-active,.mc-breadcrumb__item:only-child,.mc-breadcrumb__item:not(:first-child){padding-left:1.5rem}.mc-breadcrumb__item:not(:first-child){background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23333333'%3E%3Cpath d='M5.5 14a1 1 0 01-.71-.29 1 1 0 010-1.42L9.09 8l-4.3-4.29a1 1 0 011.42-1.42l5 5a1 1 0 010 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}@media screen and (max-width: 1023px){.mc-breadcrumb__item.is-active,.mc-breadcrumb__item:only-child{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23333333'%3E%3Cpath d='M10.5 14a1 1 0 01-.71-.29l-5-5a1 1 0 010-1.42l5-5a1 1 0 111.42 1.42L6.91 8l4.3 4.29a1 1 0 010 1.42 1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}}.mc-breadcrumb__current,.mc-breadcrumb__current.mc-link{cursor:default;text-decoration:none}.mc-breadcrumb__current,.mc-breadcrumb__current:active,.mc-breadcrumb__current:focus,.mc-breadcrumb__current:hover,.mc-breadcrumb__current:visited,.mc-breadcrumb__current.mc-link,.mc-breadcrumb__current.mc-link:active,.mc-breadcrumb__current.mc-link:focus,.mc-breadcrumb__current.mc-link:hover,.mc-breadcrumb__current.mc-link:visited{color:currentColor}.mc-breadcrumb--dark{background-color:#4d4d4d;color:#fff}.mc-breadcrumb--dark .mc-breadcrumb__item:not(:first-child){background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M5.5 14a1 1 0 01-.71-.29 1 1 0 010-1.42L9.09 8l-4.3-4.29a1 1 0 011.42-1.42l5 5a1 1 0 010 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}@media screen and (max-width: 1023px){.mc-breadcrumb--dark .mc-breadcrumb__item.is-active,.mc-breadcrumb--dark .mc-breadcrumb__item:only-child{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M10.5 14a1 1 0 01-.71-.29l-5-5a1 1 0 010-1.42l5-5a1 1 0 111.42 1.42L6.91 8l4.3 4.29a1 1 0 010 1.42 1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}}@media screen and (max-width: 1023px){.mc-breadcrumb--responsive .mc-breadcrumb__item:not(.is-active){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;visibility:visible;white-space:nowrap}}.mc-breadcrumb--no-padding{padding-left:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LinkComponent, selector: "moz-link", inputs: ["size", "theme", "iconPosition", "disabled", "showIcon", "active", "href"], outputs: ["clickLinkEvent"] }, { kind: "directive", type: i1$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BreadcrumbComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'moz-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav\n  class=\"mc-breadcrumb\"\n  [ngClass]=\"[darkMode ? 'mc-breadcrumb--dark' : '', responsive ? 'mc-breadcrumb--responsive' : '']\"\n  aria-label=\"Breadcrumb\"\n>\n  <ul class=\"mc-breadcrumb__container\">\n    <ng-container *ngFor=\"let item of items; let i = index\">\n      <li\n        class=\"mc-breadcrumb__item is-active\"\n        [ngClass]=\"{ 'is-active': responsive && i === getActiveItemIndex() }\"\n        (clickLinkEvent)=\"navigate(item)\"\n      >\n        <moz-link\n          *ngIf=\"!item.href; else withHref\"\n          [size]=\"'s'\"\n          [theme]=\"darkMode ? 'light' : ''\"\n          routerLinkActive\n          [routerLink]=\"item.route\"\n          [active]=\"item.active\"\n          >{{ item.label }}</moz-link\n        >\n        <ng-template #withHref>\n          <moz-link\n            *ngIf=\"!item.href; else withHref\"\n            [size]=\"'s'\"\n            [theme]=\"darkMode ? 'light' : ''\"\n            [href]=\"item.href\"\n            [active]=\"item.active\"\n            >{{ item.label }}</moz-link\n          >\n        </ng-template>\n      </li>\n    </ng-container>\n  </ul>\n</nav>\n", styles: [".mc-link{align-items:center;box-sizing:border-box;cursor:pointer;display:inline-flex;font-size:inherit;justify-content:center;line-height:inherit;text-decoration:underline;transition:color ease .2s;gap:.25rem;color:#000;position:relative;font-size:1rem;line-height:1.375}.mc-link:focus{outline:none}.mc-link:focus:after{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-link:visited{color:#333}.mc-link:hover{color:#666}.mc-link:active{color:#333}.mc-link.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--s{font-size:.875rem;line-height:1.2857142857}@media screen and (min-width: 680px){.mc-link--s\\@from-m{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1024px){.mc-link--s\\@from-l{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1280px){.mc-link--s\\@from-xl{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1920px){.mc-link--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857}}.mc-link--m{font-size:1rem;line-height:1.375}@media screen and (min-width: 680px){.mc-link--m\\@from-m{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-link--m\\@from-l{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-link--m\\@from-xl{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-link--m\\@from-xxl{font-size:1rem;line-height:1.375}}.mc-link:after{border-radius:2px;box-shadow:0 0 0 0 transparent;content:\"\";display:block;pointer-events:none;position:absolute;inset:0;transition:box-shadow .2s ease}.mc-link__icon{display:block;height:1rem;fill:currentColor;flex-shrink:0;width:1rem}.mc-link--light{color:#fff}.mc-link--light:visited{color:#ccc}.mc-link--light:hover{color:#999}.mc-link--light:active{color:#ccc}.mc-link--light.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary{color:#007f8c}.mc-link--primary:visited{color:#006974}.mc-link--primary:hover{color:#004e57}.mc-link--primary:active{color:#006974}.mc-link--primary.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary-02{color:#494f60}.mc-link--primary-02:visited{color:#343b4c}.mc-link--primary-02:hover{color:#171b26}.mc-link--primary-02:active{color:#343b4c}.mc-link--primary-02.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--danger{color:#c61112}.mc-link--danger:visited{color:#8c0003}.mc-link--danger:hover{color:#530000}.mc-link--danger:active{color:#8c0003}.mc-link--danger.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-breadcrumb{font-family:Roboto,sans-serif;font-weight:400;color:#191919;padding:.9375rem 0 .9375rem 1.125rem}@media screen and (min-width: 360px){.mc-breadcrumb{padding-left:1.25rem}}@media screen and (min-width: 390px){.mc-breadcrumb{padding-left:1.375rem}}@media screen and (min-width: 680px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 769px){.mc-breadcrumb{padding-left:2.125rem}}@media screen and (min-width: 1024px){.mc-breadcrumb{padding-left:3rem}}@media screen and (min-width: 1280px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 1440px){.mc-breadcrumb{padding-left:7rem}}@media screen and (min-width: 1680px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 1920px){.mc-breadcrumb{padding-left:2.5rem}}.mc-breadcrumb__container{list-style:none;margin-left:0;padding-left:0;display:flex;flex-wrap:wrap;margin-bottom:0;margin-top:0}.mc-breadcrumb__item{padding-right:.5rem;background-position:left center;background-repeat:no-repeat;background-size:1rem}@media screen and (min-width: 1024px){.mc-breadcrumb__item{flex-shrink:0}}.mc-breadcrumb__item.is-active,.mc-breadcrumb__item:only-child,.mc-breadcrumb__item:not(:first-child){padding-left:1.5rem}.mc-breadcrumb__item:not(:first-child){background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23333333'%3E%3Cpath d='M5.5 14a1 1 0 01-.71-.29 1 1 0 010-1.42L9.09 8l-4.3-4.29a1 1 0 011.42-1.42l5 5a1 1 0 010 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}@media screen and (max-width: 1023px){.mc-breadcrumb__item.is-active,.mc-breadcrumb__item:only-child{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23333333'%3E%3Cpath d='M10.5 14a1 1 0 01-.71-.29l-5-5a1 1 0 010-1.42l5-5a1 1 0 111.42 1.42L6.91 8l4.3 4.29a1 1 0 010 1.42 1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}}.mc-breadcrumb__current,.mc-breadcrumb__current.mc-link{cursor:default;text-decoration:none}.mc-breadcrumb__current,.mc-breadcrumb__current:active,.mc-breadcrumb__current:focus,.mc-breadcrumb__current:hover,.mc-breadcrumb__current:visited,.mc-breadcrumb__current.mc-link,.mc-breadcrumb__current.mc-link:active,.mc-breadcrumb__current.mc-link:focus,.mc-breadcrumb__current.mc-link:hover,.mc-breadcrumb__current.mc-link:visited{color:currentColor}.mc-breadcrumb--dark{background-color:#4d4d4d;color:#fff}.mc-breadcrumb--dark .mc-breadcrumb__item:not(:first-child){background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M5.5 14a1 1 0 01-.71-.29 1 1 0 010-1.42L9.09 8l-4.3-4.29a1 1 0 011.42-1.42l5 5a1 1 0 010 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}@media screen and (max-width: 1023px){.mc-breadcrumb--dark .mc-breadcrumb__item.is-active,.mc-breadcrumb--dark .mc-breadcrumb__item:only-child{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M10.5 14a1 1 0 01-.71-.29l-5-5a1 1 0 010-1.42l5-5a1 1 0 111.42 1.42L6.91 8l4.3 4.29a1 1 0 010 1.42 1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}}@media screen and (max-width: 1023px){.mc-breadcrumb--responsive .mc-breadcrumb__item:not(.is-active){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;visibility:visible;white-space:nowrap}}.mc-breadcrumb--no-padding{padding-left:0}\n"] }]
+            args: [{ selector: 'moz-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav\n  class=\"mc-breadcrumb\"\n  [ngClass]=\"[\n    darkMode ? 'mc-breadcrumb--dark' : '',\n    responsive ? 'mc-breadcrumb--responsive' : '',\n    noPadding ? 'mc-breadcrumb--no-padding' : ''\n  ]\"\n  aria-label=\"Breadcrumb\"\n>\n  <ul class=\"mc-breadcrumb__container\">\n    <ng-container *ngFor=\"let item of items; let i = index\">\n      <li\n        class=\"mc-breadcrumb__item is-active\"\n        [ngClass]=\"{ 'is-active': responsive && i === getActiveItemIndex() }\"\n        (clickLinkEvent)=\"navigate(item)\"\n      >\n        <moz-link\n          *ngIf=\"!item.href; else withHref\"\n          [size]=\"'s'\"\n          [theme]=\"darkMode ? 'light' : ''\"\n          routerLinkActive\n          [routerLink]=\"item.route\"\n          [active]=\"item.active\"\n          >{{ item.label }}</moz-link\n        >\n        <ng-template #withHref>\n          <moz-link\n            *ngIf=\"!item.href; else withHref\"\n            [size]=\"'s'\"\n            [theme]=\"darkMode ? 'light' : ''\"\n            [href]=\"item.href\"\n            [active]=\"item.active\"\n            >{{ item.label }}</moz-link\n          >\n        </ng-template>\n      </li>\n    </ng-container>\n  </ul>\n</nav>\n", styles: [".mc-link{align-items:center;box-sizing:border-box;cursor:pointer;display:inline-flex;font-size:inherit;justify-content:center;line-height:inherit;text-decoration:underline;transition:color ease .2s;gap:.25rem;color:#000;position:relative;font-size:1rem;line-height:1.375}.mc-link:focus{outline:none}.mc-link:focus:after{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #758992}.mc-link:visited{color:#333}.mc-link:hover{color:#666}.mc-link:active{color:#333}.mc-link.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--s{font-size:.875rem;line-height:1.2857142857}@media screen and (min-width: 680px){.mc-link--s\\@from-m{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1024px){.mc-link--s\\@from-l{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1280px){.mc-link--s\\@from-xl{font-size:.875rem;line-height:1.2857142857}}@media screen and (min-width: 1920px){.mc-link--s\\@from-xxl{font-size:.875rem;line-height:1.2857142857}}.mc-link--m{font-size:1rem;line-height:1.375}@media screen and (min-width: 680px){.mc-link--m\\@from-m{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-link--m\\@from-l{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-link--m\\@from-xl{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-link--m\\@from-xxl{font-size:1rem;line-height:1.375}}.mc-link:after{border-radius:2px;box-shadow:0 0 0 0 transparent;content:\"\";display:block;pointer-events:none;position:absolute;inset:0;transition:box-shadow .2s ease}.mc-link__icon{display:block;height:1rem;fill:currentColor;flex-shrink:0;width:1rem}.mc-link--light{color:#fff}.mc-link--light:visited{color:#ccc}.mc-link--light:hover{color:#999}.mc-link--light:active{color:#ccc}.mc-link--light.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary{color:#007f8c}.mc-link--primary:visited{color:#006974}.mc-link--primary:hover{color:#004e57}.mc-link--primary:active{color:#006974}.mc-link--primary.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary-02{color:#494f60}.mc-link--primary-02:visited{color:#343b4c}.mc-link--primary-02:hover{color:#171b26}.mc-link--primary-02:active{color:#343b4c}.mc-link--primary-02.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--danger{color:#c61112}.mc-link--danger:visited{color:#8c0003}.mc-link--danger:hover{color:#530000}.mc-link--danger:active{color:#8c0003}.mc-link--danger.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-breadcrumb{font-family:Roboto,sans-serif;font-weight:400;color:#191919;padding:.9375rem 0 .9375rem 1.125rem}@media screen and (min-width: 360px){.mc-breadcrumb{padding-left:1.25rem}}@media screen and (min-width: 390px){.mc-breadcrumb{padding-left:1.375rem}}@media screen and (min-width: 680px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 769px){.mc-breadcrumb{padding-left:2.125rem}}@media screen and (min-width: 1024px){.mc-breadcrumb{padding-left:3rem}}@media screen and (min-width: 1280px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 1440px){.mc-breadcrumb{padding-left:7rem}}@media screen and (min-width: 1680px){.mc-breadcrumb{padding-left:2rem}}@media screen and (min-width: 1920px){.mc-breadcrumb{padding-left:2.5rem}}.mc-breadcrumb__container{list-style:none;margin-left:0;padding-left:0;display:flex;flex-wrap:wrap;margin-bottom:0;margin-top:0}.mc-breadcrumb__item{padding-right:.5rem;background-position:left center;background-repeat:no-repeat;background-size:1rem}@media screen and (min-width: 1024px){.mc-breadcrumb__item{flex-shrink:0}}.mc-breadcrumb__item.is-active,.mc-breadcrumb__item:only-child,.mc-breadcrumb__item:not(:first-child){padding-left:1.5rem}.mc-breadcrumb__item:not(:first-child){background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23333333'%3E%3Cpath d='M5.5 14a1 1 0 01-.71-.29 1 1 0 010-1.42L9.09 8l-4.3-4.29a1 1 0 011.42-1.42l5 5a1 1 0 010 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}@media screen and (max-width: 1023px){.mc-breadcrumb__item.is-active,.mc-breadcrumb__item:only-child{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23333333'%3E%3Cpath d='M10.5 14a1 1 0 01-.71-.29l-5-5a1 1 0 010-1.42l5-5a1 1 0 111.42 1.42L6.91 8l4.3 4.29a1 1 0 010 1.42 1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}}.mc-breadcrumb__current,.mc-breadcrumb__current.mc-link{cursor:default;text-decoration:none}.mc-breadcrumb__current,.mc-breadcrumb__current:active,.mc-breadcrumb__current:focus,.mc-breadcrumb__current:hover,.mc-breadcrumb__current:visited,.mc-breadcrumb__current.mc-link,.mc-breadcrumb__current.mc-link:active,.mc-breadcrumb__current.mc-link:focus,.mc-breadcrumb__current.mc-link:hover,.mc-breadcrumb__current.mc-link:visited{color:currentColor}.mc-breadcrumb--dark{background-color:#4d4d4d;color:#fff}.mc-breadcrumb--dark .mc-breadcrumb__item:not(:first-child){background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M5.5 14a1 1 0 01-.71-.29 1 1 0 010-1.42L9.09 8l-4.3-4.29a1 1 0 011.42-1.42l5 5a1 1 0 010 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}@media screen and (max-width: 1023px){.mc-breadcrumb--dark .mc-breadcrumb__item.is-active,.mc-breadcrumb--dark .mc-breadcrumb__item:only-child{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1rem' width='1rem' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M10.5 14a1 1 0 01-.71-.29l-5-5a1 1 0 010-1.42l5-5a1 1 0 111.42 1.42L6.91 8l4.3 4.29a1 1 0 010 1.42 1 1 0 01-.71.29z'/%3E%3C/svg%3E\")}}@media screen and (max-width: 1023px){.mc-breadcrumb--responsive .mc-breadcrumb__item:not(.is-active){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;visibility:visible;white-space:nowrap}}.mc-breadcrumb--no-padding{padding-left:0}\n"] }]
         }], propDecorators: { items: [{
                 type: Input
             }], darkMode: [{
                 type: Input
             }], responsive: [{
                 type: Input
+            }], noPadding: [{
+                type: Input
             }], clickLinkEvent: [{
                 type: Output
             }] } });
@@ -4395,9 +4566,71 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                 }]
         }] });
 
+var KpiIcon;
+(function (KpiIcon) {
+    KpiIcon["Top"] = "Navigation_Arrow_ArrowTopRight_16px";
+    KpiIcon["Bottom"] = "Navigation_Arrow_ArrowBottomRight_16px";
+})(KpiIcon || (KpiIcon = {}));
+
+class KpiComponent {
+    constructor() {
+        this.value = '';
+        this.iconname = KpiIcon.Top;
+        this.iconcolor = '';
+        this.label = '';
+        this.type = '';
+        this.detail = '';
+    }
+    getSize() {
+        let size = 'small';
+        if (this.label && this.label.length > 0 && !this.detail) {
+            size = 'medium';
+        }
+        else if (this.detail && this.detail.length > 0) {
+            size = 'large';
+        }
+        return size;
+    }
+    labelOutsideContent() {
+        return this.label != null && this.label.length > 0 && this.getSize() !== 'large';
+    }
+}
+KpiComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: KpiComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+KpiComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: KpiComponent, selector: "moz-kpi", inputs: { value: "value", iconname: "iconname", iconcolor: "iconcolor", label: "label", type: "type", detail: "detail" }, ngImport: i0, template: "<div class=\"mc-kpi mc-kpi--{{ getSize() }} mc-kpi--{{ type }}\">\n  <span class=\"mc-kpi__label\" *ngIf=\"labelOutsideContent()\">{{ label }}</span>\n  <div class=\"mc-kpi__content\">\n    <div class=\"mc-kpi__main\">\n      <span class=\"mc-kpi__label\" *ngIf=\"!labelOutsideContent()\">{{ label }}</span>\n      <span class=\"mc-kpi__value\">{{ value }}</span>\n    </div>\n    <div class=\"mc-kpi__aside\" *ngIf=\"iconname || detail\">\n      <span class=\"mc-kpi__detail\" *ngIf=\"detail\">{{ detail }}</span>\n      <span class=\"mc-kpi__icon\" *ngIf=\"iconname\"\n        ><moz-icon [iconName]=\"iconname\" [ngStyle]=\"{ fill: iconcolor }\"></moz-icon\n      ></span>\n    </div>\n  </div>\n</div>\n", styles: [".mc-kpi{color:var(--color-kpi-text, #005c91);display:inline-block}.mc-kpi__label{font-size:.875rem;line-height:1.2857142857;display:block}.mc-kpi__content{display:flex}.mc-kpi__main{align-items:center;display:flex;justify-content:center}.mc-kpi__value{font-size:.875rem;line-height:1.2857142857;font-weight:700}.mc-kpi__aside{align-items:center;background-color:#fff;color:#333;display:flex;justify-content:center}.mc-kpi__detail{font-size:.875rem;line-height:1.2857142857}.mc-kpi__icon{display:block;height:1rem;width:1rem}.mc-kpi--small .mc-kpi__content{gap:.5rem}.mc-kpi--small .mc-kpi__main{background-color:var(--color-kpi-background, #daeff7);border:1px solid var(--color-kpi-border, #007bb4);border-radius:4px;overflow:hidden;padding:.1875rem .4375rem}.mc-kpi--small .mc-kpi__aside{background-color:transparent}.mc-kpi--medium .mc-kpi__label{color:#000;margin-bottom:.375rem}.mc-kpi--medium .mc-kpi__content{background-color:var(--color-kpi-background, #daeff7);border:1px solid var(--color-kpi-border, #007bb4);border-radius:4px;overflow:hidden}.mc-kpi--medium .mc-kpi__main{flex-grow:1;padding:.5rem .5rem .5rem .4375rem}.mc-kpi--medium .mc-kpi__value{font-size:1rem;line-height:1.375}.mc-kpi--medium .mc-kpi__aside{padding-left:.75rem;padding-right:.6875rem}.mc-kpi--large{background-color:var(--color-kpi-background, #daeff7);border:1px solid var(--color-kpi-border, #007bb4);border-radius:4px;overflow:hidden}.mc-kpi--large .mc-kpi__content{flex-direction:column;width:100%}.mc-kpi--large .mc-kpi__main{flex-direction:column;padding:1rem .9375rem}.mc-kpi--large .mc-kpi__label{font-size:1rem;line-height:1.375}.mc-kpi--large .mc-kpi__value{font-size:2.125rem;line-height:1.2941176471}.mc-kpi--large .mc-kpi__aside{min-height:2.9375rem;padding-right:.6875rem;padding-left:.6875rem;gap:.75rem}.mc-kpi--warning{--color-kpi-background: #fdf1e8;--color-kpi-border: #c65200;--color-kpi-text: #8c3500}.mc-kpi--danger{--color-kpi-background: #fdeaea;--color-kpi-border: #c61112;--color-kpi-text: #8c0003}.mc-kpi--success{--color-kpi-background: #ebf5de;--color-kpi-border: #188803;--color-kpi-text: #006902}.mc-kpi--neutral{--color-kpi-background: #e6e6e6;--color-kpi-border: #666666;--color-kpi-text: #4d4d4d}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IconComponent, selector: "moz-icon", inputs: ["iconName"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: KpiComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'moz-kpi', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mc-kpi mc-kpi--{{ getSize() }} mc-kpi--{{ type }}\">\n  <span class=\"mc-kpi__label\" *ngIf=\"labelOutsideContent()\">{{ label }}</span>\n  <div class=\"mc-kpi__content\">\n    <div class=\"mc-kpi__main\">\n      <span class=\"mc-kpi__label\" *ngIf=\"!labelOutsideContent()\">{{ label }}</span>\n      <span class=\"mc-kpi__value\">{{ value }}</span>\n    </div>\n    <div class=\"mc-kpi__aside\" *ngIf=\"iconname || detail\">\n      <span class=\"mc-kpi__detail\" *ngIf=\"detail\">{{ detail }}</span>\n      <span class=\"mc-kpi__icon\" *ngIf=\"iconname\"\n        ><moz-icon [iconName]=\"iconname\" [ngStyle]=\"{ fill: iconcolor }\"></moz-icon\n      ></span>\n    </div>\n  </div>\n</div>\n", styles: [".mc-kpi{color:var(--color-kpi-text, #005c91);display:inline-block}.mc-kpi__label{font-size:.875rem;line-height:1.2857142857;display:block}.mc-kpi__content{display:flex}.mc-kpi__main{align-items:center;display:flex;justify-content:center}.mc-kpi__value{font-size:.875rem;line-height:1.2857142857;font-weight:700}.mc-kpi__aside{align-items:center;background-color:#fff;color:#333;display:flex;justify-content:center}.mc-kpi__detail{font-size:.875rem;line-height:1.2857142857}.mc-kpi__icon{display:block;height:1rem;width:1rem}.mc-kpi--small .mc-kpi__content{gap:.5rem}.mc-kpi--small .mc-kpi__main{background-color:var(--color-kpi-background, #daeff7);border:1px solid var(--color-kpi-border, #007bb4);border-radius:4px;overflow:hidden;padding:.1875rem .4375rem}.mc-kpi--small .mc-kpi__aside{background-color:transparent}.mc-kpi--medium .mc-kpi__label{color:#000;margin-bottom:.375rem}.mc-kpi--medium .mc-kpi__content{background-color:var(--color-kpi-background, #daeff7);border:1px solid var(--color-kpi-border, #007bb4);border-radius:4px;overflow:hidden}.mc-kpi--medium .mc-kpi__main{flex-grow:1;padding:.5rem .5rem .5rem .4375rem}.mc-kpi--medium .mc-kpi__value{font-size:1rem;line-height:1.375}.mc-kpi--medium .mc-kpi__aside{padding-left:.75rem;padding-right:.6875rem}.mc-kpi--large{background-color:var(--color-kpi-background, #daeff7);border:1px solid var(--color-kpi-border, #007bb4);border-radius:4px;overflow:hidden}.mc-kpi--large .mc-kpi__content{flex-direction:column;width:100%}.mc-kpi--large .mc-kpi__main{flex-direction:column;padding:1rem .9375rem}.mc-kpi--large .mc-kpi__label{font-size:1rem;line-height:1.375}.mc-kpi--large .mc-kpi__value{font-size:2.125rem;line-height:1.2941176471}.mc-kpi--large .mc-kpi__aside{min-height:2.9375rem;padding-right:.6875rem;padding-left:.6875rem;gap:.75rem}.mc-kpi--warning{--color-kpi-background: #fdf1e8;--color-kpi-border: #c65200;--color-kpi-text: #8c3500}.mc-kpi--danger{--color-kpi-background: #fdeaea;--color-kpi-border: #c61112;--color-kpi-text: #8c0003}.mc-kpi--success{--color-kpi-background: #ebf5de;--color-kpi-border: #188803;--color-kpi-text: #006902}.mc-kpi--neutral{--color-kpi-background: #e6e6e6;--color-kpi-border: #666666;--color-kpi-text: #4d4d4d}\n"] }]
+        }], propDecorators: { value: [{
+                type: Input
+            }], iconname: [{
+                type: Input
+            }], iconcolor: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], detail: [{
+                type: Input
+            }] } });
+
+class KpiModule {
+}
+KpiModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: KpiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+KpiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: KpiModule, declarations: [KpiComponent], imports: [CommonModule, IconModule], exports: [KpiComponent] });
+KpiModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: KpiModule, imports: [CommonModule, IconModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: KpiModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [KpiComponent],
+                    imports: [CommonModule, IconModule],
+                    exports: [KpiComponent],
+                }]
+        }] });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AutocompleteComponent, AutocompleteModule, BadgeComponent, BadgeModule, BreadcrumbComponent, BreadcrumbModule, BuiltItMenuComponent, BuiltItMenuModule, ButtonComponent, ButtonModule, CHECKBOX_CONTROL_VALUE_ACCESSOR, CardComponent, CardModule, CheckboxComponent, CheckboxModule, DIALOG_CONFIG, DIALOG_DATA, DIALOG_REF, DialogComponent, DialogModule, DialogService, DropdownComponent, DropdownModule, FieldComponent, FieldErrorComponent, FieldModule, FileUploaderComponent, FileUploaderModule, HeadingComponent, HeadingModule, IconComponent, IconModule, IconService, InputIconDirective, LAYER_CONFIG, LAYER_DATA, LAYER_REF, LayerComponent, LayerModule, LayerService, LinkComponent, LinkModule, ListboxComponent, ListboxModule, LoaderComponent, LoaderModule, LoaderService, MOZ_INPUT_ICON, MozDatatableCaptionComponent, MozDatatableComponent, MozDatatableContentCellComponent, MozDatatableFooterComponent, MozDatatableHeaderCellComponent, MozDatatableManagementComponent, MozDatatableManagementContentComponent, MozDatatableManagementModule, MozDatatableModule, MozDatatableRowExpansionContentComponent, MozDatatableSelectionComponent, MozDatatableSortDirective, MozDragNDropDirective, NOTIFICATION_CONFIG, NotificationComponent, NotificationConfigFactory, NotificationContainerComponent, NotificationFooterComponent, NotificationMessageComponent, NotificationModule, NotificationService, NotificationTitleComponent, PAGINATION_CONTROL_VALUE_ACCESSOR, PaginationComponent, PaginationModule, PhoneNumberComponent, PhoneNumberModule, ProgressBarComponent, ProgressBarModule, QuantitySelectorComponent, QuantitySelectorModule, SelectComponent, SelectModule, StepComponent, StepperComponent, StepperModule, TOGGLE_CONTROL_VALUE_ACCESSOR, TabComponent, TabsComponent, TabsModule, TagComponent, TagModule, TaglistComponent, TaglistLayerContentComponent, TaglistModule, TextAreaComponent, TextAreaModule, TextInputComponent, TextInputModule, ToggleComponent, ToggleModule, TooltipComponent, TooltipDirective, TooltipModule, UploadedFilesComponent, castBooleanProperty, generateId, getRandomNumber, overwriteStyle };
+export { AutocompleteComponent, AutocompleteModule, BadgeComponent, BadgeModule, BreadcrumbComponent, BreadcrumbModule, BuiltItMenuComponent, BuiltItMenuModule, ButtonComponent, ButtonModule, CHECKBOX_CONTROL_VALUE_ACCESSOR, CardComponent, CardModule, CheckboxComponent, CheckboxModule, DIALOG_CONFIG, DIALOG_DATA, DIALOG_REF, DialogComponent, DialogModule, DialogService, Direction, DropdownComponent, DropdownModule, FieldComponent, FieldErrorComponent, FieldModule, FileUploaderComponent, FileUploaderModule, HeaderComponent, HeaderModule, HeadingComponent, HeadingModule, IconComponent, IconModule, IconService, InputIconDirective, KpiComponent, KpiIcon, KpiModule, LAYER_CONFIG, LAYER_DATA, LAYER_REF, LayerComponent, LayerModule, LayerService, LinkComponent, LinkModule, ListboxComponent, ListboxModule, LoaderComponent, LoaderModule, LoaderService, MOZ_INPUT_ICON, MozDatatableCaptionComponent, MozDatatableComponent, MozDatatableContentCellComponent, MozDatatableFooterComponent, MozDatatableHeaderCellComponent, MozDatatableManagementComponent, MozDatatableManagementContentComponent, MozDatatableManagementModule, MozDatatableModule, MozDatatableRowExpansionContentComponent, MozDatatableSelectionComponent, MozDatatableSortDirective, MozDragNDropDirective, NOTIFICATION_CONFIG, NotificationComponent, NotificationConfigFactory, NotificationContainerComponent, NotificationFooterComponent, NotificationMessageComponent, NotificationModule, NotificationService, NotificationTitleComponent, PAGINATION_CONTROL_VALUE_ACCESSOR, PaginationComponent, PaginationModule, PhoneNumberComponent, PhoneNumberModule, ProgressBarComponent, ProgressBarModule, QuantitySelectorComponent, QuantitySelectorModule, SelectComponent, SelectModule, StepComponent, StepperComponent, StepperModule, TOGGLE_CONTROL_VALUE_ACCESSOR, TabComponent, TabsComponent, TabsModule, TagComponent, TagModule, TaglistComponent, TaglistLayerContentComponent, TaglistModule, TextAreaComponent, TextAreaModule, TextInputComponent, TextInputModule, ToggleComponent, ToggleModule, TooltipComponent, TooltipDirective, TooltipModule, UploadedFilesComponent, castBooleanProperty, generateId, getRandomNumber, overwriteStyle };
 //# sourceMappingURL=mozaic-ds-angular.mjs.map