@mozaic-ds/angular 0.19.0 → 0.19.2

package/fesm2015/mozaic-ds-angular.mjs

@@ -8,7 +8,6 @@ import { fromEvent, shareReplay, BehaviorSubject, Subject, startWith, map, of, t
 import { trigger, transition, group, query, style, animate } from '@angular/animations';
 import { delay } from 'rxjs/operators';
 import * as i1$1 from '@angular/common/http';
-import { BehaviorSubject as BehaviorSubject$1 } from 'rxjs/internal/BehaviorSubject';
 import * as i1$2 from '@angular/router';
 import { RouterLinkActive, RouterLinkWithHref, NavigationEnd } from '@angular/router';
 
@@ -478,15 +477,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
         }] });
 
 const MOZ_INPUT_ICON = new InjectionToken('MozInputIcon');
-class InputIcon {
+class InputIconDirective {
 }
-InputIcon.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: InputIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-InputIcon.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: InputIcon, selector: "[mozInputIcon]", providers: [{ provide: MOZ_INPUT_ICON, useExisting: InputIcon }], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: InputIcon, decorators: [{
+InputIconDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: InputIconDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+InputIconDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: InputIconDirective, selector: "[mozInputIcon]", providers: [{ provide: MOZ_INPUT_ICON, useExisting: InputIconDirective }], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: InputIconDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[mozInputIcon]',
-                    providers: [{ provide: MOZ_INPUT_ICON, useExisting: InputIcon }],
+                    providers: [{ provide: MOZ_INPUT_ICON, useExisting: InputIconDirective }],
                 }]
         }] });
 
@@ -507,7 +506,7 @@ class FieldComponent {
     }
     get hasInputIcon() {
         var _a, _b;
-        return (_a = this.inputIcon) === null || _a === void 0 ? void 0 : _a.changes.pipe(startWith(!!((_b = this.inputIcon) === null || _b === void 0 ? void 0 : _b.length)), map(() => { var _a; return !!((_a = this.inputIcon) === null || _a === void 0 ? void 0 : _a.length); }));
+        return (_a = this.InputIconDirective) === null || _a === void 0 ? void 0 : _a.changes.pipe(startWith(!!((_b = this.InputIconDirective) === null || _b === void 0 ? void 0 : _b.length)), map(() => { var _a; return !!((_a = this.InputIconDirective) === null || _a === void 0 ? void 0 : _a.length); }));
     }
     constructor(cd) {
         this.cd = cd;
@@ -520,7 +519,7 @@ class FieldComponent {
     }
 }
 FieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: FieldComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-FieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: FieldComponent, selector: "moz-field", inputs: { label: "label", requirementText: "requirementText", helpText: "helpText" }, host: { properties: { "class.mc-field": "true" } }, queries: [{ propertyName: "inputIcon", predicate: MOZ_INPUT_ICON, descendants: true }], ngImport: i0, template: "<label class=\"mc-field__label\" *ngIf=\"viewLabel\">\n  {{ label }}\n  <span *ngIf=\"requirementText\" [attr.aria-hidden]=\"requirementText\" class=\"mc-field__requirement\">\n    {{ requirementText }}\n  </span>\n  <span *ngIf=\"helpText\" id=\"helptext\" class=\"mc-field__help\">\n    {{ helpText }}\n  </span>\n</label>\n\n<ng-content></ng-content>\n\n<ng-template #inputIconTemplate>\n  <ng-content select=\"[mozInputIcon]\"></ng-content>\n</ng-template>\n\n<ng-template #inputTemplate>\n  <ng-content select=\"[moz-input]\"></ng-content>\n</ng-template>\n\n<div class=\"mc-left-icon-input\" *ngIf=\"hasInputIcon | async; else withoutIcon\">\n  <ng-container [ngTemplateOutlet]=\"inputIconTemplate\"></ng-container>\n  <ng-container [ngTemplateOutlet]=\"inputTemplate\"></ng-container>\n</div>\n\n<ng-template #withoutIcon>\n  <ng-container [ngTemplateOutlet]=\"inputTemplate\"></ng-container>\n</ng-template>\n\n<ng-content select=\"moz-field-error\"></ng-content>\n", styles: ["@charset \"UTF-8\";.mc-field__label,.mc-field__legend{font-size:.875rem;line-height:1.2857142857;font-weight:400;color:#333}.mc-field__legend{padding-left:0;padding-right:0}.mc-field__requirement,.mc-field__help{font-size:.75rem;line-height:1.3333333333;font-weight:400;color:#666}.mc-field__requirement:before{content:\"\\a0-\\a0\"}.mc-field__help{display:block;margin-top:.125rem}.mc-field .mc-field__input,.mc-field .mc-field__element{margin-top:.5rem}.mc-field__container{margin-top:1rem}@media screen and (min-width: 769px){.mc-field__container--inline{display:flex}}@media screen and (min-width: 769px){.mc-field__container--inline .mc-field__item:not(:last-child){margin-bottom:0;margin-right:1rem}}@media screen and (min-width: 1024px){.mc-field__container--inline .mc-field__item:not(:last-child){margin-right:2rem}}.mc-field__item:not(:last-child){margin-bottom:1rem}.mc-field__error-message{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-field--group{border:none;margin-left:0;margin-right:0;padding:0}.mc-field--group .mc-field__error-message{margin-top:.5rem}.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-field{display:block}.mc-field__label{margin-bottom:.5rem;display:inline-block}.mc-left-icon-input [mozInputIcon]{left:.75rem;top:50%;width:1.5rem;height:1.5rem;position:absolute;z-index:1;transform:translateY(-50%);fill:#666;pointer-events:none}.mc-left-icon-input [moz-input]{padding-left:2.9375rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+FieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: FieldComponent, selector: "moz-field", inputs: { label: "label", requirementText: "requirementText", helpText: "helpText" }, host: { properties: { "class.mc-field": "true" } }, queries: [{ propertyName: "InputIconDirective", predicate: MOZ_INPUT_ICON, descendants: true }], ngImport: i0, template: "<label class=\"mc-field__label\" *ngIf=\"viewLabel\">\n  {{ label }}\n  <span *ngIf=\"requirementText\" [attr.aria-hidden]=\"requirementText\" class=\"mc-field__requirement\">\n    {{ requirementText }}\n  </span>\n  <span *ngIf=\"helpText\" id=\"helptext\" class=\"mc-field__help\">\n    {{ helpText }}\n  </span>\n</label>\n\n<ng-content></ng-content>\n\n<ng-template #inputIconTemplate>\n  <ng-content select=\"[mozInputIcon]\"></ng-content>\n</ng-template>\n\n<ng-template #inputTemplate>\n  <ng-content select=\"[moz-input]\"></ng-content>\n</ng-template>\n\n<div class=\"mc-left-icon-input\" *ngIf=\"hasInputIcon | async; else withoutIcon\">\n  <ng-container [ngTemplateOutlet]=\"inputIconTemplate\"></ng-container>\n  <ng-container [ngTemplateOutlet]=\"inputTemplate\"></ng-container>\n</div>\n\n<ng-template #withoutIcon>\n  <ng-container [ngTemplateOutlet]=\"inputTemplate\"></ng-container>\n</ng-template>\n\n<ng-content select=\"moz-field-error\"></ng-content>\n", styles: ["@charset \"UTF-8\";.mc-field__label,.mc-field__legend{font-size:.875rem;line-height:1.2857142857;font-weight:400;color:#333}.mc-field__legend{padding-left:0;padding-right:0}.mc-field__requirement,.mc-field__help{font-size:.75rem;line-height:1.3333333333;font-weight:400;color:#666}.mc-field__requirement:before{content:\"\\a0-\\a0\"}.mc-field__help{display:block;margin-top:.125rem}.mc-field .mc-field__input,.mc-field .mc-field__element{margin-top:.5rem}.mc-field__container{margin-top:1rem}@media screen and (min-width: 769px){.mc-field__container--inline{display:flex}}@media screen and (min-width: 769px){.mc-field__container--inline .mc-field__item:not(:last-child){margin-bottom:0;margin-right:1rem}}@media screen and (min-width: 1024px){.mc-field__container--inline .mc-field__item:not(:last-child){margin-right:2rem}}.mc-field__item:not(:last-child){margin-bottom:1rem}.mc-field__error-message{font-size:.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:.25rem}.mc-field--group{border:none;margin-left:0;margin-right:0;padding:0}.mc-field--group .mc-field__error-message{margin-top:.5rem}.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-field{display:block}.mc-field__label{margin-bottom:.5rem;display:inline-block}.mc-left-icon-input [mozInputIcon]{left:.75rem;top:50%;width:1.5rem;height:1.5rem;position:absolute;z-index:1;transform:translateY(-50%);fill:#666;pointer-events:none}.mc-left-icon-input [moz-input]{padding-left:2.9375rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: FieldComponent, decorators: [{
             type: Component,
             args: [{ selector: 'moz-field', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
@@ -532,7 +531,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
                 type: Input
             }], helpText: [{
                 type: Input
-            }], inputIcon: [{
+            }], InputIconDirective: [{
                 type: ContentChildren,
                 args: [MOZ_INPUT_ICON, { descendants: true }]
             }] } });
@@ -540,14 +539,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
 class FieldModule {
 }
 FieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: FieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-FieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.3", ngImport: i0, type: FieldModule, declarations: [FieldComponent, FieldErrorComponent, InputIcon], imports: [CommonModule], exports: [FieldComponent, FieldErrorComponent, InputIcon] });
+FieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.3", ngImport: i0, type: FieldModule, declarations: [FieldComponent, FieldErrorComponent, InputIconDirective], imports: [CommonModule], exports: [FieldComponent, FieldErrorComponent, InputIconDirective] });
 FieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: FieldModule, imports: [CommonModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: FieldModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],
-                    declarations: [FieldComponent, FieldErrorComponent, InputIcon],
-                    exports: [FieldComponent, FieldErrorComponent, InputIcon],
+                    declarations: [FieldComponent, FieldErrorComponent, InputIconDirective],
+                    exports: [FieldComponent, FieldErrorComponent, InputIconDirective],
                 }]
         }] });
 
@@ -1038,7 +1037,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
 class NotificationContainerComponent {
     constructor(notificationConfig) {
         this.notificationConfig = notificationConfig;
-        this._notifications = new BehaviorSubject$1([]);
+        this._notifications = new BehaviorSubject([]);
     }
     get notifications() {
         return this._notifications.asObservable();
@@ -1221,7 +1220,7 @@ class PaginationComponent {
         this.smallResolution = 1024;
         const isSmall = this.displayIsSmall().pipe(shareReplay({ refCount: true, bufferSize: 1 }));
         this.initializeIcons(isSmall);
-        this.selectSize = isSmall.pipe(map(this.chooseSelectSize));
+        this.selectSize = isSmall.pipe(map((isSmall) => this.chooseSelectSize(isSmall)));
     }
     ngAfterViewInit() {
         this.reinitializeNumberOfPagesAtInvalidValue();
@@ -1278,7 +1277,7 @@ class PaginationComponent {
         }));
     }
     initializeIcons(isSmall) {
-        const iconSize = isSmall.pipe(map(this.chooseIconSize), shareReplay({ refCount: true, bufferSize: 1 }));
+        const iconSize = isSmall.pipe(map((isSmall) => this.chooseIconSize(isSmall)), shareReplay({ refCount: true, bufferSize: 1 }));
         this.leftIconName = iconSize.pipe(map((iconSize) => `Navigation_Arrow_Arrow--Left_${iconSize}`));
         this.rightIconName = iconSize.pipe(map((iconSize) => `Navigation_Arrow_Arrow--Right_${iconSize}`));
     }
@@ -1590,6 +1589,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
             }] } });
 
 const TAB_SELECTORS = 'a,div,span';
+const TABS_SELECTOR = 'moz-tabs';
 
 class TabsComponent {
     constructor(elementRef, cd, router) {
@@ -1629,6 +1629,7 @@ class TabsComponent {
     }
     initTabIndex(tabs) {
         tabs.forEach((tab, index) => (tab.index = index));
+        this.cd.markForCheck();
     }
     initFirstSelectionTab(tabs) {
         const activeTab = tabs.find((tab) => tab.isActiveTab);
@@ -1669,11 +1670,14 @@ class TabsComponent {
         return combineLatest([eventNavigationEnd, this.afterViewInit]).pipe(delay$1(0));
     }
     getIndexClickedTab() {
-        return fromEvent(this.elementRef.nativeElement, 'click').pipe(map((event) => event.target), map((targetElement) => targetElement.closest(TAB_SELECTORS)), filter((tabElement) => !!tabElement), map((tabElement) => tabElement.getAttribute('tab-index')));
+        return fromEvent(this.elementRef.nativeElement, 'click').pipe(map((event) => event.target), filter(this.filterTabsElement.bind(this)), map((targetElement) => targetElement.closest(TAB_SELECTORS)), filter((tabElement) => !!tabElement), map((tabElement) => tabElement.getAttribute('tab-index')));
     }
     getAllTabEvents(tabs) {
         return merge(this.getTabSelectionEvents(tabs), this.getTabActiveEvents(tabs));
     }
+    filterTabsElement({ nodeName }) {
+        return nodeName.toLowerCase() !== TABS_SELECTOR;
+    }
     selectTab(tabs, clickedTab) {
         tabs.forEach((tab) => (tab.selected = tab === clickedTab));
         this.selectedTabChange.emit(clickedTab);
@@ -1684,7 +1688,7 @@ TabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
 TabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", 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;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{display:inline-flex;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:#333}.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--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}.mc-tabs--full,.mc-tabs--full-centered{width:100%}.mc-tabs--full-centered{justify-content:center}.mc-tabs--dropdown{padding:1rem;width:auto}.mc-tab--hide-shadow:before{box-shadow:none!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: TabsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'moz-tabs', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+            args: [{ selector: TABS_SELECTOR, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         '[class.mc-tabs]': 'true',
                         '[class.mc-tabs--full]': 'viewFullWidth',
                         '[class.mc-tabs--full-centered]': 'fullWidthCenter',
@@ -2028,5 +2032,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { BadgeComponent, BadgeModule, ButtonComponent, ButtonModule, CHECKBOX_CONTROL_VALUE_ACCESSOR, CheckboxComponent, CheckboxModule, DIALOG_CONFIG, DIALOG_DATA, DIALOG_REF, DialogComponent, DialogModule, DialogService, FieldComponent, FieldErrorComponent, FieldModule, IconComponent, IconModule, IconService, InputIcon, LAYER_CONFIG, LAYER_DATA, LAYER_REF, LayerComponent, LayerModule, LayerService, LoaderComponent, LoaderModule, LoaderService, MOZ_INPUT_ICON, NOTIFICATION_CONFIG, NotificationComponent, NotificationConfigFactory, NotificationContainerComponent, NotificationFooterComponent, NotificationMessageComponent, NotificationModule, NotificationService, NotificationTitleComponent, PAGINATION_CONTROL_VALUE_ACCESSOR, PaginationComponent, PaginationModule, ProgressBarComponent, ProgressBarModule, SelectComponent, SelectModule, StepComponent, StepperComponent, StepperModule, TOGGLE_CONTROL_VALUE_ACCESSOR, TabComponent, TabsComponent, TabsModule, TagComponent, TagModule, TextAreaComponent, TextAreaModule, TextInputComponent, TextInputModule, ToggleComponent, ToggleModule, TooltipComponent, TooltipModule, castBooleanProperty, generateId, getRandomNumber, overwriteStyle };
+export { BadgeComponent, BadgeModule, ButtonComponent, ButtonModule, CHECKBOX_CONTROL_VALUE_ACCESSOR, CheckboxComponent, CheckboxModule, DIALOG_CONFIG, DIALOG_DATA, DIALOG_REF, DialogComponent, DialogModule, DialogService, FieldComponent, FieldErrorComponent, FieldModule, IconComponent, IconModule, IconService, InputIconDirective, LAYER_CONFIG, LAYER_DATA, LAYER_REF, LayerComponent, LayerModule, LayerService, LoaderComponent, LoaderModule, LoaderService, MOZ_INPUT_ICON, NOTIFICATION_CONFIG, NotificationComponent, NotificationConfigFactory, NotificationContainerComponent, NotificationFooterComponent, NotificationMessageComponent, NotificationModule, NotificationService, NotificationTitleComponent, PAGINATION_CONTROL_VALUE_ACCESSOR, PaginationComponent, PaginationModule, ProgressBarComponent, ProgressBarModule, SelectComponent, SelectModule, StepComponent, StepperComponent, StepperModule, TOGGLE_CONTROL_VALUE_ACCESSOR, TabComponent, TabsComponent, TabsModule, TagComponent, TagModule, TextAreaComponent, TextAreaModule, TextInputComponent, TextInputModule, ToggleComponent, ToggleModule, TooltipComponent, TooltipModule, castBooleanProperty, generateId, getRandomNumber, overwriteStyle };
 //# sourceMappingURL=mozaic-ds-angular.mjs.map