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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (110) hide show
  1. package/adeo/assets/tokens/adeo/css/_variables.scss +50 -200
  2. package/adeo/assets/tokens/adeo/js/tokens.js +575 -575
  3. package/adeo/assets/tokens/adeo/js/tokensObject.js +12457 -9652
  4. package/adeo/assets/tokens/adeo/scss/_tokens.scss +240 -239
  5. package/adeo/assets/tokens/bricoman/android/colors.xml +483 -0
  6. package/adeo/assets/tokens/bricoman/android/font_dimens.xml +18 -0
  7. package/adeo/assets/tokens/bricoman/css/_variables.scss +477 -0
  8. package/adeo/assets/tokens/bricoman/css/root.scss +479 -0
  9. package/adeo/assets/tokens/bricoman/ios/StyleDictionaryColor.h +491 -0
  10. package/adeo/assets/tokens/bricoman/ios/StyleDictionaryColor.m +503 -0
  11. package/adeo/assets/tokens/bricoman/ios/StyleDictionaryColor.swift +486 -0
  12. package/adeo/assets/tokens/bricoman/ios/StyleDictionarySize.h +69 -0
  13. package/adeo/assets/tokens/bricoman/ios/StyleDictionarySize.m +70 -0
  14. package/adeo/assets/tokens/bricoman/ios/StyleDictionarySize.swift +71 -0
  15. package/adeo/assets/tokens/bricoman/js/tokens.js +575 -0
  16. package/adeo/assets/tokens/bricoman/js/tokensObject.js +12444 -0
  17. package/adeo/assets/tokens/bricoman/scss/_tokens.scss +1630 -0
  18. package/adeo/components/breadcrumb/breadcrumb.component.d.ts +2 -1
  19. package/adeo/components/datatable/moz-datatable.component.d.ts +2 -0
  20. package/adeo/components/header/header.component.d.ts +33 -0
  21. package/adeo/components/header/header.module.d.ts +10 -0
  22. package/adeo/components/header/index.d.ts +3 -0
  23. package/adeo/components/header/model/header.d.ts +5 -0
  24. package/adeo/components/header/public-api.d.ts +1 -0
  25. package/adeo/components/kpi/index.d.ts +3 -0
  26. package/adeo/components/kpi/kpi.component.d.ts +14 -0
  27. package/adeo/components/kpi/kpi.module.d.ts +9 -0
  28. package/adeo/components/kpi/model/kpi.d.ts +4 -0
  29. package/adeo/components/kpi/public-api.d.ts +1 -0
  30. package/adeo/components/progress-bar/progress-bar.component.d.ts +2 -2
  31. package/adeo/components/public-api.d.ts +2 -0
  32. package/adeo/esm2020/components/autocomplete/autocomplete.component.mjs +6 -3
  33. package/adeo/esm2020/components/breadcrumb/breadcrumb.component.mjs +6 -3
  34. package/adeo/esm2020/components/datatable/components/footer/moz-datatable-footer.component.mjs +13 -3
  35. package/adeo/esm2020/components/datatable/moz-datatable.component.mjs +13 -3
  36. package/adeo/esm2020/components/dropdown/dropdown.component.mjs +6 -3
  37. package/adeo/esm2020/components/header/header.component.mjs +129 -0
  38. package/adeo/esm2020/components/header/header.module.mjs +20 -0
  39. package/adeo/esm2020/components/header/index.mjs +4 -0
  40. package/adeo/esm2020/components/header/model/header.mjs +6 -0
  41. package/adeo/esm2020/components/header/public-api.mjs +2 -0
  42. package/adeo/esm2020/components/kpi/index.mjs +4 -0
  43. package/adeo/esm2020/components/kpi/kpi.component.mjs +47 -0
  44. package/adeo/esm2020/components/kpi/kpi.module.mjs +19 -0
  45. package/adeo/esm2020/components/kpi/model/kpi.mjs +6 -0
  46. package/adeo/esm2020/components/kpi/public-api.mjs +2 -0
  47. package/adeo/esm2020/components/pagination/pagination.component.mjs +2 -2
  48. package/adeo/esm2020/components/progress-bar/progress-bar.component.mjs +6 -6
  49. package/adeo/esm2020/components/public-api.mjs +3 -1
  50. package/adeo/esm2020/components/tabs/tabs.component.mjs +3 -3
  51. package/adeo/fesm2015/mozaic-ds-angular.mjs +262 -24
  52. package/adeo/fesm2015/mozaic-ds-angular.mjs.map +1 -1
  53. package/adeo/fesm2020/mozaic-ds-angular.mjs +253 -20
  54. package/adeo/fesm2020/mozaic-ds-angular.mjs.map +1 -1
  55. package/adeo/package.json +1 -1
  56. package/assets/tokens/adeo/css/_variables.scss +50 -200
  57. package/assets/tokens/adeo/js/tokens.js +575 -575
  58. package/assets/tokens/adeo/js/tokensObject.js +12457 -9652
  59. package/assets/tokens/adeo/scss/_tokens.scss +240 -239
  60. package/assets/tokens/bricoman/android/colors.xml +483 -0
  61. package/assets/tokens/bricoman/android/font_dimens.xml +18 -0
  62. package/assets/tokens/bricoman/css/_variables.scss +477 -0
  63. package/assets/tokens/bricoman/css/root.scss +479 -0
  64. package/assets/tokens/bricoman/ios/StyleDictionaryColor.h +491 -0
  65. package/assets/tokens/bricoman/ios/StyleDictionaryColor.m +503 -0
  66. package/assets/tokens/bricoman/ios/StyleDictionaryColor.swift +486 -0
  67. package/assets/tokens/bricoman/ios/StyleDictionarySize.h +69 -0
  68. package/assets/tokens/bricoman/ios/StyleDictionarySize.m +70 -0
  69. package/assets/tokens/bricoman/ios/StyleDictionarySize.swift +71 -0
  70. package/assets/tokens/bricoman/js/tokens.js +575 -0
  71. package/assets/tokens/bricoman/js/tokensObject.js +12444 -0
  72. package/assets/tokens/bricoman/scss/_tokens.scss +1630 -0
  73. package/components/breadcrumb/breadcrumb.component.d.ts +2 -1
  74. package/components/datatable/moz-datatable.component.d.ts +2 -0
  75. package/components/header/header.component.d.ts +33 -0
  76. package/components/header/header.module.d.ts +10 -0
  77. package/components/header/index.d.ts +3 -0
  78. package/components/header/model/header.d.ts +5 -0
  79. package/components/header/public-api.d.ts +1 -0
  80. package/components/kpi/index.d.ts +3 -0
  81. package/components/kpi/kpi.component.d.ts +14 -0
  82. package/components/kpi/kpi.module.d.ts +9 -0
  83. package/components/kpi/model/kpi.d.ts +4 -0
  84. package/components/kpi/public-api.d.ts +1 -0
  85. package/components/progress-bar/progress-bar.component.d.ts +2 -2
  86. package/components/public-api.d.ts +2 -0
  87. package/esm2020/components/autocomplete/autocomplete.component.mjs +6 -3
  88. package/esm2020/components/breadcrumb/breadcrumb.component.mjs +6 -3
  89. package/esm2020/components/datatable/components/footer/moz-datatable-footer.component.mjs +13 -3
  90. package/esm2020/components/datatable/moz-datatable.component.mjs +13 -3
  91. package/esm2020/components/dropdown/dropdown.component.mjs +6 -3
  92. package/esm2020/components/header/header.component.mjs +129 -0
  93. package/esm2020/components/header/header.module.mjs +20 -0
  94. package/esm2020/components/header/index.mjs +4 -0
  95. package/esm2020/components/header/model/header.mjs +6 -0
  96. package/esm2020/components/header/public-api.mjs +2 -0
  97. package/esm2020/components/kpi/index.mjs +4 -0
  98. package/esm2020/components/kpi/kpi.component.mjs +47 -0
  99. package/esm2020/components/kpi/kpi.module.mjs +19 -0
  100. package/esm2020/components/kpi/model/kpi.mjs +6 -0
  101. package/esm2020/components/kpi/public-api.mjs +2 -0
  102. package/esm2020/components/pagination/pagination.component.mjs +2 -2
  103. package/esm2020/components/progress-bar/progress-bar.component.mjs +6 -6
  104. package/esm2020/components/public-api.mjs +3 -1
  105. package/esm2020/components/tabs/tabs.component.mjs +3 -3
  106. package/fesm2015/mozaic-ds-angular.mjs +262 -24
  107. package/fesm2015/mozaic-ds-angular.mjs.map +1 -1
  108. package/fesm2020/mozaic-ds-angular.mjs +253 -20
  109. package/fesm2020/mozaic-ds-angular.mjs.map +1 -1
  110. package/package.json +1 -1
@@ -4,7 +4,7 @@ import * as i1 from '@angular/common';
4
4
  import { CommonModule, DOCUMENT } from '@angular/common';
5
5
  import * as i2 from '@angular/forms';
6
6
  import { NG_VALUE_ACCESSOR, FormsModule, NgControl, FormControlName, FormGroupDirective, ReactiveFormsModule } from '@angular/forms';
7
- 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';
7
+ 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';
8
8
  import { trigger, transition, group, query, style, animate } from '@angular/animations';
9
9
  import { delay } from 'rxjs/operators';
10
10
  import * as i1$1 from '@angular/common/http';
@@ -1248,8 +1248,8 @@ class PaginationComponent {
1248
1248
  ngOnChanges({ numberOfPages, pageTitleMask }) {
1249
1249
  if (this.needRenderPages(this.viewSelect, numberOfPages === null || numberOfPages === void 0 ? void 0 : numberOfPages.currentValue, numberOfPages === null || numberOfPages === void 0 ? void 0 : numberOfPages.previousValue, pageTitleMask === null || pageTitleMask === void 0 ? void 0 : pageTitleMask.currentValue, pageTitleMask === null || pageTitleMask === void 0 ? void 0 : pageTitleMask.previousValue)) {
1250
1250
  this.reinitializeNumberOfPagesAtInvalidValue();
1251
- this.pages = this.initializePages(this.numberOfPages);
1252
1251
  }
1252
+ this.pages = this.initializePages(this.numberOfPages);
1253
1253
  this.reinitializeCurrentPageAtOverflow();
1254
1254
  }
1255
1255
  get viewSelect() {
@@ -1380,7 +1380,7 @@ class ProgressBarComponent {
1380
1380
  this.size = 'm';
1381
1381
  this.theme = 'default';
1382
1382
  this.percent = 0;
1383
- this.text = '';
1383
+ this.displayPercentage = false;
1384
1384
  }
1385
1385
  get indicatorWidth() {
1386
1386
  return { width: `${this.percent}%` };
@@ -1388,22 +1388,22 @@ class ProgressBarComponent {
1388
1388
  get hostCssClasses() {
1389
1389
  const sizeClass = `mc-progressbar--${this.size}`;
1390
1390
  const themeClass = `mc-progressbar--${this.theme}`;
1391
- const textClass = !!this.text ? `mc-progressbar--percent` : '';
1391
+ const textClass = this.displayPercentage ? `mc-progressbar--percent` : '';
1392
1392
  return `mc-progressbar ${sizeClass} ${themeClass} ${textClass}`;
1393
1393
  }
1394
1394
  }
1395
1395
  ProgressBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1396
- 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:LeroyMerlin,sans-serif;align-items:center;background-color:#ccc;display:flex;height:.5rem;justify-content:center;position:relative}.mc-progressbar,.mc-progressbar__indicator{border-radius:4px;overflow:hidden}.mc-progressbar__indicator{background-color:#188803;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:600;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 });
1396
+ 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:LeroyMerlin,sans-serif;align-items:center;background-color:#ccc;display:flex;height:.5rem;justify-content:center;position:relative}.mc-progressbar,.mc-progressbar__indicator{border-radius:4px;overflow:hidden}.mc-progressbar__indicator{background-color:#188803;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:600;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 });
1397
1397
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ProgressBarComponent, decorators: [{
1398
1398
  type: Component,
1399
- 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:LeroyMerlin,sans-serif;align-items:center;background-color:#ccc;display:flex;height:.5rem;justify-content:center;position:relative}.mc-progressbar,.mc-progressbar__indicator{border-radius:4px;overflow:hidden}.mc-progressbar__indicator{background-color:#188803;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:600;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"] }]
1399
+ 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:LeroyMerlin,sans-serif;align-items:center;background-color:#ccc;display:flex;height:.5rem;justify-content:center;position:relative}.mc-progressbar,.mc-progressbar__indicator{border-radius:4px;overflow:hidden}.mc-progressbar__indicator{background-color:#188803;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:600;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"] }]
1400
1400
  }], propDecorators: { size: [{
1401
1401
  type: Input
1402
1402
  }], theme: [{
1403
1403
  type: Input
1404
1404
  }], percent: [{
1405
1405
  type: Input
1406
- }], text: [{
1406
+ }], displayPercentage: [{
1407
1407
  type: Input
1408
1408
  }], hostCssClasses: [{
1409
1409
  type: HostBinding,
@@ -1713,14 +1713,14 @@ class TabsComponent {
1713
1713
  }
1714
1714
  }
1715
1715
  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 });
1716
- 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:600;font-style:italic;font-display:swap}.mc-tabs{font-family:LeroyMerlin,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:600;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:#eeeff1}.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:#cfd2d8}.mc-tabs__link:focus:before,.mc-tabs__element:focus:before{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #0b96cc}.mc-tabs__link--selected,.mc-tabs__element--selected{color:#000}.mc-tabs__link--selected:after,.mc-tabs__element--selected:after{background-color:#000}.mc-tabs__link--selected:hover,.mc-tabs__element--selected:hover,.mc-tabs__link--selected:active,.mc-tabs__element--selected:active{color:#000}.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 });
1716
+ 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:600;font-style:italic;font-display:swap}.mc-tabs{font-family:LeroyMerlin,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:600;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:#eeeff1}.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:#cfd2d8}.mc-tabs__link:focus:before,.mc-tabs__element:focus:before{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #0b96cc}.mc-tabs__link--selected,.mc-tabs__element--selected{color:#000}.mc-tabs__link--selected:after,.mc-tabs__element--selected:after{background-color:#000}.mc-tabs__link--selected:hover,.mc-tabs__element--selected:hover,.mc-tabs__link--selected:active,.mc-tabs__element--selected:active{color:#000}.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 });
1717
1717
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TabsComponent, decorators: [{
1718
1718
  type: Component,
1719
1719
  args: [{ selector: TABS_SELECTOR, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
1720
1720
  '[class.mc-tabs]': 'true',
1721
1721
  '[class.mc-tabs--full]': 'viewFullWidth',
1722
1722
  '[class.mc-tabs--full-centered]': 'fullWidthCenter',
1723
- '[class.mc-tab--hide-shadow]': 'hideShadow',
1723
+ '[class.mc-tabs--no-shadow]': 'hideShadow',
1724
1724
  }, 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:600;font-style:italic;font-display:swap}.mc-tabs{font-family:LeroyMerlin,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:600;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:#eeeff1}.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:#cfd2d8}.mc-tabs__link:focus:before,.mc-tabs__element:focus:before{box-shadow:0 0 0 .125rem #fff,0 0 0 .25rem #0b96cc}.mc-tabs__link--selected,.mc-tabs__element--selected{color:#000}.mc-tabs__link--selected:after,.mc-tabs__element--selected:after{background-color:#000}.mc-tabs__link--selected:hover,.mc-tabs__element--selected:hover,.mc-tabs__link--selected:active,.mc-tabs__element--selected:active{color:#000}.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"] }]
1725
1725
  }], ctorParameters: function () {
1726
1726
  return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$2.Router, decorators: [{
@@ -2487,9 +2487,16 @@ class MozDatatableFooterComponent {
2487
2487
  if (this.totalItems === 1 && this.selectedRowPerPage === 0) {
2488
2488
  return 0;
2489
2489
  }
2490
+ // case nullable
2491
+ if (this.totalItems == null || this.selectedRowPerPage == null) {
2492
+ return 0;
2493
+ }
2490
2494
  return Math.ceil(this.totalItems / this.selectedRowPerPage);
2491
2495
  }
2492
2496
  calculateCountEnd() {
2497
+ if (this.selectedRowPerPage == null) {
2498
+ return 0;
2499
+ }
2493
2500
  const count = this.selectedRowPerPage * this.currentPage;
2494
2501
  if (count > this.totalItems) {
2495
2502
  return this.totalItems;
@@ -2497,6 +2504,9 @@ class MozDatatableFooterComponent {
2497
2504
  return count;
2498
2505
  }
2499
2506
  calculateCountStart() {
2507
+ if (this.selectedRowPerPage == null || this.totalItems == null) {
2508
+ return 0;
2509
+ }
2500
2510
  if (this.selectedRowPerPage === 0 || this.currentPage === 0 || this.totalItems === 0) {
2501
2511
  return 0;
2502
2512
  }
@@ -2504,10 +2514,10 @@ class MozDatatableFooterComponent {
2504
2514
  }
2505
2515
  }
2506
2516
  MozDatatableFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MozDatatableFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2507
- 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 });
2517
+ 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 });
2508
2518
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MozDatatableFooterComponent, decorators: [{
2509
2519
  type: Component,
2510
- 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" }]
2520
+ 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" }]
2511
2521
  }], propDecorators: { footerSettings: [{
2512
2522
  type: Input
2513
2523
  }], isLoading: [{
@@ -2690,12 +2700,24 @@ class MozDatatableComponent {
2690
2700
  var _a;
2691
2701
  return ((_a = this.datatableSettings) === null || _a === void 0 ? void 0 : _a.columnDefs.filter((headTitle) => !headTitle.hide)) || [];
2692
2702
  }
2703
+ getColumns() {
2704
+ var _a, _b;
2705
+ return ((_a = this.datatableSettings) === null || _a === void 0 ? void 0 : _a.isLoading)
2706
+ ? ['', '', '', '', '']
2707
+ : (_b = this.datatableSettings) === null || _b === void 0 ? void 0 : _b.columnDefs;
2708
+ }
2709
+ getFields() {
2710
+ var _a, _b;
2711
+ return ((_a = this.datatableSettings) === null || _a === void 0 ? void 0 : _a.isLoading)
2712
+ ? ['', '', '', '', '']
2713
+ : (_b = this.datatableSettings) === null || _b === void 0 ? void 0 : _b.rowData;
2714
+ }
2693
2715
  }
2694
2716
  MozDatatableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MozDatatableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2695
- 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:LeroyMerlin,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:#e6e6e6;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:600;font-size:.75rem;line-height:1.3333333333;color:#191919;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:#e6e6e6}.mc-datatable tbody tr.selected{background-color:#ebf5de}.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:#e6e6e6}.mc-datatable__empty-cell{color:#666}.mc-datatable__empty-content{font-size:1rem;line-height:1.375;align-items:center;color:#666;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:600;font-size:.75rem;line-height:1.3333333333;color:#191919;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:#ccc;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:#333}.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:#333}.mc-datatable__options{width:1.5rem;height:1.5rem}.mc-datatable__expand .mc-datatable__btn-icon{fill:#46a610}.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 #b3b3b3;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:#e6e6e6}.mc-datatable__subtable th,.mc-datatable__subtable td{border-bottom-color:#b3b3b3}.mc-datatable__subtable thead th,.mc-datatable__subtable thead td{font-size:.75rem;line-height:1.3333333333;color:#000}.mc-datatable__subtable tbody th,.mc-datatable__subtable tbody td{color:#000}.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 });
2717
+ 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:LeroyMerlin,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:#e6e6e6;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:600;font-size:.75rem;line-height:1.3333333333;color:#191919;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:#e6e6e6}.mc-datatable tbody tr.selected{background-color:#ebf5de}.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:#e6e6e6}.mc-datatable__empty-cell{color:#666}.mc-datatable__empty-content{font-size:1rem;line-height:1.375;align-items:center;color:#666;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:600;font-size:.75rem;line-height:1.3333333333;color:#191919;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:#ccc;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:#333}.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:#333}.mc-datatable__options{width:1.5rem;height:1.5rem}.mc-datatable__expand .mc-datatable__btn-icon{fill:#46a610}.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 #b3b3b3;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:#e6e6e6}.mc-datatable__subtable th,.mc-datatable__subtable td{border-bottom-color:#b3b3b3}.mc-datatable__subtable thead th,.mc-datatable__subtable thead td{font-size:.75rem;line-height:1.3333333333;color:#000}.mc-datatable__subtable tbody th,.mc-datatable__subtable tbody td{color:#000}.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 });
2696
2718
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MozDatatableComponent, decorators: [{
2697
2719
  type: Component,
2698
- 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:LeroyMerlin,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:#e6e6e6;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:600;font-size:.75rem;line-height:1.3333333333;color:#191919;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:#e6e6e6}.mc-datatable tbody tr.selected{background-color:#ebf5de}.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:#e6e6e6}.mc-datatable__empty-cell{color:#666}.mc-datatable__empty-content{font-size:1rem;line-height:1.375;align-items:center;color:#666;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:600;font-size:.75rem;line-height:1.3333333333;color:#191919;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:#ccc;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:#333}.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:#333}.mc-datatable__options{width:1.5rem;height:1.5rem}.mc-datatable__expand .mc-datatable__btn-icon{fill:#46a610}.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 #b3b3b3;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:#e6e6e6}.mc-datatable__subtable th,.mc-datatable__subtable td{border-bottom-color:#b3b3b3}.mc-datatable__subtable thead th,.mc-datatable__subtable thead td{font-size:.75rem;line-height:1.3333333333;color:#000}.mc-datatable__subtable tbody th,.mc-datatable__subtable tbody td{color:#000}.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"] }]
2720
+ 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:LeroyMerlin,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:#e6e6e6;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:600;font-size:.75rem;line-height:1.3333333333;color:#191919;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:#e6e6e6}.mc-datatable tbody tr.selected{background-color:#ebf5de}.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:#e6e6e6}.mc-datatable__empty-cell{color:#666}.mc-datatable__empty-content{font-size:1rem;line-height:1.375;align-items:center;color:#666;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:600;font-size:.75rem;line-height:1.3333333333;color:#191919;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:#ccc;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:#333}.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:#333}.mc-datatable__options{width:1.5rem;height:1.5rem}.mc-datatable__expand .mc-datatable__btn-icon{fill:#46a610}.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 #b3b3b3;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:#e6e6e6}.mc-datatable__subtable th,.mc-datatable__subtable td{border-bottom-color:#b3b3b3}.mc-datatable__subtable thead th,.mc-datatable__subtable thead td{font-size:.75rem;line-height:1.3333333333;color:#000}.mc-datatable__subtable tbody th,.mc-datatable__subtable tbody td{color:#000}.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"] }]
2699
2721
  }], propDecorators: { footerSettings: [{
2700
2722
  type: Input
2701
2723
  }], selectionSettings: [{
@@ -3115,11 +3137,13 @@ class DropdownComponent {
3115
3137
  }
3116
3138
  }
3117
3139
  closeListbox() {
3140
+ var _a;
3118
3141
  this.openState = false;
3119
3142
  if (this.originalListboxParent && this.listboxElementRef) {
3120
3143
  this.originalListboxParent.appendChild(this.listboxElementRef.nativeElement);
3121
3144
  this.originalListboxParent = null;
3122
3145
  }
3146
+ (_a = this.control) === null || _a === void 0 ? void 0 : _a.markAsTouched();
3123
3147
  }
3124
3148
  itemsSelectedListboxEvent(listboxItemSelected) {
3125
3149
  var _a, _b;
@@ -3131,13 +3155,14 @@ class DropdownComponent {
3131
3155
  (_b = this.control) === null || _b === void 0 ? void 0 : _b.markAsDirty();
3132
3156
  }
3133
3157
  clearFieldEvent() {
3134
- var _a, _b;
3158
+ var _a, _b, _c;
3135
3159
  if (!this.disabled) {
3136
3160
  this.selectedItems = undefined;
3137
3161
  this.openState = false;
3138
3162
  this.writeValue(this.selectedItems);
3139
3163
  (_a = this.control) === null || _a === void 0 ? void 0 : _a.setValue(this.selectedItems);
3140
3164
  (_b = this.control) === null || _b === void 0 ? void 0 : _b.markAsDirty();
3165
+ (_c = this.control) === null || _c === void 0 ? void 0 : _c.markAsTouched();
3141
3166
  }
3142
3167
  }
3143
3168
  getMultiSelectedLabel() {
@@ -3184,7 +3209,7 @@ class DropdownComponent {
3184
3209
  return this.selectedItems.map((selectedItem) => ({ id: selectedItem.value, label: selectedItem.label }));
3185
3210
  }
3186
3211
  removeTagEvent($event) {
3187
- var _a, _b;
3212
+ var _a, _b, _c;
3188
3213
  this.writeValue(this.selectedItems.filter((selectedItem) => selectedItem.value !== $event.id));
3189
3214
  this.taglistComponent.updateTaglistLayerConfig(this.getTagItemsFromSelectedItems());
3190
3215
  if (this.getTagItemsFromSelectedItems().length === 0) {
@@ -3192,6 +3217,7 @@ class DropdownComponent {
3192
3217
  }
3193
3218
  (_a = this.control) === null || _a === void 0 ? void 0 : _a.setValue(this.selectedItems);
3194
3219
  (_b = this.control) === null || _b === void 0 ? void 0 : _b.markAsDirty();
3220
+ (_c = this.control) === null || _c === void 0 ? void 0 : _c.markAsTouched();
3195
3221
  this.cd.detectChanges();
3196
3222
  }
3197
3223
  }
@@ -3202,7 +3228,7 @@ DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", vers
3202
3228
  useExisting: forwardRef(() => DropdownComponent),
3203
3229
  multi: true,
3204
3230
  },
3205
- ], 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:LeroyMerlin,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 #0b96cc}.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:#188803;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 #0b96cc}.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:#188803;font-family:LeroyMerlin,sans-serif;font-weight:600;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:#006902;color:#fff}.mc-button:active{background-color:#006902}.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 #0b96cc}.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:#188803;border-color:#188803;background-color:#fff}.mc-button--bordered:hover{background-color:#ebf5de;color:#006902}.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.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 });
3231
+ ], 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:LeroyMerlin,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 #0b96cc}.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:#188803;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 #0b96cc}.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:#188803;font-family:LeroyMerlin,sans-serif;font-weight:600;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:#006902;color:#fff}.mc-button:active{background-color:#006902}.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 #0b96cc}.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:#188803;border-color:#188803;background-color:#fff}.mc-button--bordered:hover{background-color:#ebf5de;color:#006902}.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.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 });
3206
3232
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DropdownComponent, decorators: [{
3207
3233
  type: Component,
3208
3234
  args: [{ selector: 'moz-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
@@ -3211,7 +3237,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
3211
3237
  useExisting: forwardRef(() => DropdownComponent),
3212
3238
  multi: true,
3213
3239
  },
3214
- ], 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:LeroyMerlin,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 #0b96cc}.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:#188803;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 #0b96cc}.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:#188803;font-family:LeroyMerlin,sans-serif;font-weight:600;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:#006902;color:#fff}.mc-button:active{background-color:#006902}.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 #0b96cc}.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:#188803;border-color:#188803;background-color:#fff}.mc-button--bordered:hover{background-color:#ebf5de;color:#006902}.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.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"] }]
3240
+ ], 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:LeroyMerlin,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 #0b96cc}.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:#188803;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 #0b96cc}.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:#188803;font-family:LeroyMerlin,sans-serif;font-weight:600;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:#006902;color:#fff}.mc-button:active{background-color:#006902}.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 #0b96cc}.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:#188803;border-color:#188803;background-color:#fff}.mc-button--bordered:hover{background-color:#ebf5de;color:#006902}.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.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"] }]
3215
3241
  }], ctorParameters: function () {
3216
3242
  return [{ type: i0.Injector, decorators: [{
3217
3243
  type: Inject,
@@ -3577,12 +3603,14 @@ class AutocompleteComponent {
3577
3603
  }
3578
3604
  }
3579
3605
  closeListbox() {
3606
+ var _a;
3580
3607
  this.openState = false;
3581
3608
  if (this.originalListboxParent && this.listboxElementRef) {
3582
3609
  this.originalListboxParent.appendChild(this.listboxElementRef.nativeElement);
3583
3610
  this.originalListboxParent = null;
3584
3611
  }
3585
3612
  this.listboxItems = this.initialListboxItems;
3613
+ (_a = this.control) === null || _a === void 0 ? void 0 : _a.markAsTouched();
3586
3614
  }
3587
3615
  itemsSelectedListboxEvent(listboxItemSelected) {
3588
3616
  var _a, _b;
@@ -3596,7 +3624,7 @@ class AutocompleteComponent {
3596
3624
  (_b = this.control) === null || _b === void 0 ? void 0 : _b.markAsDirty();
3597
3625
  }
3598
3626
  clearFieldEvent() {
3599
- var _a, _b;
3627
+ var _a, _b, _c;
3600
3628
  if (!this.disabled) {
3601
3629
  this.selectedItems = undefined;
3602
3630
  this.openState = false;
@@ -3606,6 +3634,7 @@ class AutocompleteComponent {
3606
3634
  this.writeValue(this.selectedItems);
3607
3635
  (_a = this.control) === null || _a === void 0 ? void 0 : _a.setValue(this.selectedItems);
3608
3636
  (_b = this.control) === null || _b === void 0 ? void 0 : _b.markAsDirty();
3637
+ (_c = this.control) === null || _c === void 0 ? void 0 : _c.markAsTouched();
3609
3638
  }
3610
3639
  }
3611
3640
  getMultiSelectedLabel() {
@@ -3643,7 +3672,7 @@ class AutocompleteComponent {
3643
3672
  return this.selectedItems.map((selectedItem) => ({ id: selectedItem.value, label: selectedItem.label }));
3644
3673
  }
3645
3674
  removeTagEvent($event) {
3646
- var _a, _b;
3675
+ var _a, _b, _c;
3647
3676
  this.writeValue(this.selectedItems.filter((selectedItem) => selectedItem.value !== $event.id));
3648
3677
  this.taglistComponent.updateTaglistLayerConfig(this.getTagItemsFromSelectedItems());
3649
3678
  if (this.getTagItemsFromSelectedItems().length === 0) {
@@ -3651,6 +3680,7 @@ class AutocompleteComponent {
3651
3680
  }
3652
3681
  (_a = this.control) === null || _a === void 0 ? void 0 : _a.setValue(this.selectedItems);
3653
3682
  (_b = this.control) === null || _b === void 0 ? void 0 : _b.markAsDirty();
3683
+ (_c = this.control) === null || _c === void 0 ? void 0 : _c.markAsTouched();
3654
3684
  this.cd.detectChanges();
3655
3685
  }
3656
3686
  searchEvent() {
@@ -3686,7 +3716,7 @@ AutocompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
3686
3716
  useExisting: forwardRef(() => AutocompleteComponent),
3687
3717
  multi: true,
3688
3718
  },
3689
- ], 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:LeroyMerlin,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 #0b96cc}.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:#188803;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 #0b96cc}.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 });
3719
+ ], 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:LeroyMerlin,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 #0b96cc}.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:#188803;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 #0b96cc}.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 });
3690
3720
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AutocompleteComponent, decorators: [{
3691
3721
  type: Component,
3692
3722
  args: [{ selector: 'moz-autocomplete', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
@@ -3695,7 +3725,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
3695
3725
  useExisting: forwardRef(() => AutocompleteComponent),
3696
3726
  multi: true,
3697
3727
  },
3698
- ], 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:LeroyMerlin,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 #0b96cc}.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:#188803;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 #0b96cc}.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"] }]
3728
+ ], 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:LeroyMerlin,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 #0b96cc}.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:#188803;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 #0b96cc}.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"] }]
3699
3729
  }], ctorParameters: function () {
3700
3730
  return [{ type: i0.Injector, decorators: [{
3701
3731
  type: Inject,
@@ -4045,6 +4075,149 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
4045
4075
  }]
4046
4076
  }] });
4047
4077
 
4078
+ var Direction;
4079
+ (function (Direction) {
4080
+ Direction["Up"] = "Up";
4081
+ Direction["Down"] = "Down";
4082
+ })(Direction || (Direction = {}));
4083
+
4084
+ class HeaderComponent {
4085
+ constructor(cdRef, elementRef) {
4086
+ this.cdRef = cdRef;
4087
+ this.elementRef = elementRef;
4088
+ this.title = '';
4089
+ this.subtitle = '';
4090
+ this.badgeType = 'information';
4091
+ this.badgeContent = '';
4092
+ this.size = 'm';
4093
+ this.showShadow = true;
4094
+ this.sticky = false;
4095
+ this.animate = false;
4096
+ this.showBack = false;
4097
+ this.backButtonLabel = 'Back';
4098
+ this.backEvent = new EventEmitter();
4099
+ this.directionChangeEvent = new EventEmitter();
4100
+ this.direction = Direction.Up;
4101
+ this.showTabs = true;
4102
+ this.showBreadcrumb = true;
4103
+ }
4104
+ ngAfterViewInit() {
4105
+ var _a, _b, _c, _d;
4106
+ if (this.tabsRef == null ||
4107
+ (((_a = this.tabsRef) === null || _a === void 0 ? void 0 : _a.nativeElement.children) && ((_b = this.tabsRef) === null || _b === void 0 ? void 0 : _b.nativeElement.children.length) === 0)) {
4108
+ this.showTabs = false;
4109
+ }
4110
+ if (this.breadcrumbRef == null ||
4111
+ (((_c = this.breadcrumbRef) === null || _c === void 0 ? void 0 : _c.nativeElement.children) &&
4112
+ ((_d = this.breadcrumbRef) === null || _d === void 0 ? void 0 : _d.nativeElement.children.length) === 0)) {
4113
+ this.showBreadcrumb = false;
4114
+ }
4115
+ this.scroll();
4116
+ this.cdRef.detectChanges();
4117
+ }
4118
+ onParentScroll(parentElement) {
4119
+ let lastScrollTop = parentElement.scrollTop || 0;
4120
+ const handleScroll = () => {
4121
+ const currentScrollTop = parentElement.scrollTop || 0;
4122
+ if (currentScrollTop > lastScrollTop) {
4123
+ this.direction = Direction.Down;
4124
+ }
4125
+ else {
4126
+ this.direction = Direction.Up;
4127
+ }
4128
+ this.directionChangeEvent.emit(this.direction);
4129
+ lastScrollTop = currentScrollTop;
4130
+ this.cdRef.detectChanges();
4131
+ };
4132
+ parentElement.addEventListener('scroll', handleScroll);
4133
+ }
4134
+ scroll() {
4135
+ if (this.animate && this.sticky) {
4136
+ const parentElement = this.findParentWithScroll(this.elementRef.nativeElement);
4137
+ if (parentElement) {
4138
+ this.onParentScroll(parentElement);
4139
+ }
4140
+ else {
4141
+ fromEvent(window, 'scroll')
4142
+ .pipe(map(() => window.scrollY), pairwise(), map(([y1, y2]) => {
4143
+ return y2 < y1 ? Direction.Up : Direction.Down;
4144
+ }))
4145
+ .subscribe((direction) => {
4146
+ this.direction = direction;
4147
+ this.directionChangeEvent.emit(this.direction);
4148
+ this.cdRef.detectChanges();
4149
+ });
4150
+ }
4151
+ }
4152
+ }
4153
+ findParentWithScroll(element) {
4154
+ if (element.parentElement) {
4155
+ const parent = element.parentElement;
4156
+ const hasOverflow = window.getComputedStyle(parent).overflow;
4157
+ if (hasOverflow === 'auto' || hasOverflow === 'scroll') {
4158
+ return parent;
4159
+ }
4160
+ else {
4161
+ return this.findParentWithScroll(parent);
4162
+ }
4163
+ }
4164
+ return null;
4165
+ }
4166
+ back() {
4167
+ this.backEvent.emit(true);
4168
+ }
4169
+ }
4170
+ 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 });
4171
+ 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:LeroyMerlin,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:600;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 });
4172
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HeaderComponent, decorators: [{
4173
+ type: Component,
4174
+ 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:LeroyMerlin,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:600;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"] }]
4175
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { title: [{
4176
+ type: Input
4177
+ }], subtitle: [{
4178
+ type: Input
4179
+ }], badgeType: [{
4180
+ type: Input
4181
+ }], badgeContent: [{
4182
+ type: Input
4183
+ }], size: [{
4184
+ type: Input
4185
+ }], showShadow: [{
4186
+ type: Input
4187
+ }], sticky: [{
4188
+ type: Input
4189
+ }], animate: [{
4190
+ type: Input
4191
+ }], showBack: [{
4192
+ type: Input
4193
+ }], backButtonLabel: [{
4194
+ type: Input
4195
+ }], backEvent: [{
4196
+ type: Output
4197
+ }], directionChangeEvent: [{
4198
+ type: Output
4199
+ }], tabsRef: [{
4200
+ type: ViewChild,
4201
+ args: ['tabsRef']
4202
+ }], breadcrumbRef: [{
4203
+ type: ViewChild,
4204
+ args: ['breadcrumbRef']
4205
+ }] } });
4206
+
4207
+ class HeaderModule {
4208
+ }
4209
+ HeaderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
4210
+ HeaderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: HeaderModule, declarations: [HeaderComponent], imports: [CommonModule, BadgeModule, IconModule], exports: [HeaderComponent] });
4211
+ HeaderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HeaderModule, imports: [CommonModule, BadgeModule, IconModule] });
4212
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: HeaderModule, decorators: [{
4213
+ type: NgModule,
4214
+ args: [{
4215
+ declarations: [HeaderComponent],
4216
+ imports: [CommonModule, BadgeModule, IconModule],
4217
+ exports: [HeaderComponent],
4218
+ }]
4219
+ }] });
4220
+
4048
4221
  class LinkComponent {
4049
4222
  constructor(routerLinkActive, routerLink) {
4050
4223
  this.routerLinkActive = routerLinkActive;
@@ -4117,6 +4290,7 @@ class BreadcrumbComponent {
4117
4290
  this.items = [];
4118
4291
  this.darkMode = false;
4119
4292
  this.responsive = false;
4293
+ this.noPadding = true;
4120
4294
  this.clickLinkEvent = new EventEmitter();
4121
4295
  }
4122
4296
  getActiveItemIndex() {
@@ -4130,16 +4304,18 @@ class BreadcrumbComponent {
4130
4304
  }
4131
4305
  }
4132
4306
  BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4133
- 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 #0b96cc}.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:#188803}.mc-link--primary:visited{color:#006902}.mc-link--primary:hover{color:#035010}.mc-link--primary:active{color:#006902}.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:LeroyMerlin,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 });
4307
+ 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 #0b96cc}.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:#188803}.mc-link--primary:visited{color:#006902}.mc-link--primary:hover{color:#035010}.mc-link--primary:active{color:#006902}.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:LeroyMerlin,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 });
4134
4308
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BreadcrumbComponent, decorators: [{
4135
4309
  type: Component,
4136
- 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 #0b96cc}.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:#188803}.mc-link--primary:visited{color:#006902}.mc-link--primary:hover{color:#035010}.mc-link--primary:active{color:#006902}.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:LeroyMerlin,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"] }]
4310
+ 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 #0b96cc}.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:#188803}.mc-link--primary:visited{color:#006902}.mc-link--primary:hover{color:#035010}.mc-link--primary:active{color:#006902}.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:LeroyMerlin,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"] }]
4137
4311
  }], propDecorators: { items: [{
4138
4312
  type: Input
4139
4313
  }], darkMode: [{
4140
4314
  type: Input
4141
4315
  }], responsive: [{
4142
4316
  type: Input
4317
+ }], noPadding: [{
4318
+ type: Input
4143
4319
  }], clickLinkEvent: [{
4144
4320
  type: Output
4145
4321
  }] } });
@@ -4454,9 +4630,71 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
4454
4630
  }]
4455
4631
  }] });
4456
4632
 
4633
+ var KpiIcon;
4634
+ (function (KpiIcon) {
4635
+ KpiIcon["Top"] = "Navigation_Arrow_ArrowTopRight_16px";
4636
+ KpiIcon["Bottom"] = "Navigation_Arrow_ArrowBottomRight_16px";
4637
+ })(KpiIcon || (KpiIcon = {}));
4638
+
4639
+ class KpiComponent {
4640
+ constructor() {
4641
+ this.value = '';
4642
+ this.iconname = KpiIcon.Top;
4643
+ this.iconcolor = '';
4644
+ this.label = '';
4645
+ this.type = '';
4646
+ this.detail = '';
4647
+ }
4648
+ getSize() {
4649
+ let size = 'small';
4650
+ if (this.label && this.label.length > 0 && !this.detail) {
4651
+ size = 'medium';
4652
+ }
4653
+ else if (this.detail && this.detail.length > 0) {
4654
+ size = 'large';
4655
+ }
4656
+ return size;
4657
+ }
4658
+ labelOutsideContent() {
4659
+ return this.label != null && this.label.length > 0 && this.getSize() !== 'large';
4660
+ }
4661
+ }
4662
+ KpiComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: KpiComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4663
+ 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:600}.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 });
4664
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: KpiComponent, decorators: [{
4665
+ type: Component,
4666
+ 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:600}.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"] }]
4667
+ }], propDecorators: { value: [{
4668
+ type: Input
4669
+ }], iconname: [{
4670
+ type: Input
4671
+ }], iconcolor: [{
4672
+ type: Input
4673
+ }], label: [{
4674
+ type: Input
4675
+ }], type: [{
4676
+ type: Input
4677
+ }], detail: [{
4678
+ type: Input
4679
+ }] } });
4680
+
4681
+ class KpiModule {
4682
+ }
4683
+ KpiModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: KpiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
4684
+ KpiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: KpiModule, declarations: [KpiComponent], imports: [CommonModule, IconModule], exports: [KpiComponent] });
4685
+ KpiModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: KpiModule, imports: [CommonModule, IconModule] });
4686
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: KpiModule, decorators: [{
4687
+ type: NgModule,
4688
+ args: [{
4689
+ declarations: [KpiComponent],
4690
+ imports: [CommonModule, IconModule],
4691
+ exports: [KpiComponent],
4692
+ }]
4693
+ }] });
4694
+
4457
4695
  /**
4458
4696
  * Generated bundle index. Do not edit.
4459
4697
  */
4460
4698
 
4461
- 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 };
4699
+ 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 };
4462
4700
  //# sourceMappingURL=mozaic-ds-angular.mjs.map