@ptsecurity/mosaic 13.0.0 → 13.2.0

package/fesm2015/ptsecurity-mosaic-core.mjs

@@ -1,7 +1,7 @@
+import * as i0 from '@angular/core';
+import { Version, InjectionToken, isDevMode, NgModule, Optional, Inject, Directive, Injectable, Pipe, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, EventEmitter, Output, ContentChild, ContentChildren, TemplateRef } from '@angular/core';
 import * as i2$1 from '@angular/cdk/bidi';
 import { BidiModule } from '@angular/cdk/bidi';
-import * as i0 from '@angular/core';
-import { InjectionToken, isDevMode, NgModule, Optional, Inject, Directive, Injectable, Pipe, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, EventEmitter, Output, ContentChild, ContentChildren, TemplateRef } from '@angular/core';
 import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
 import { Subject } from 'rxjs';
 import MessageFormat from '@messageformat/core';
@@ -18,6 +18,8 @@ import { takeUntil, distinctUntilChanged, delay } from 'rxjs/operators';
 import * as i1$1 from '@angular/cdk/a11y';
 import { ComponentPortal } from '@angular/cdk/portal';
 
+const VERSION = new Version('{{VERSION}}');
+
 function isBoolean(val) { return typeof val === 'boolean'; }
 function toBoolean(value) {
     return value != null && `${value}` !== 'false';
@@ -87,10 +89,10 @@ class McCommonModule {
         }
     }
 }
-/** @nocollapse */ /** @nocollapse */ McCommonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McCommonModule, deps: [{ token: MC_SANITY_CHECKS, optional: true }], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ /** @nocollapse */ McCommonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McCommonModule, imports: [BidiModule], exports: [BidiModule] });
-/** @nocollapse */ /** @nocollapse */ McCommonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McCommonModule, imports: [[BidiModule], BidiModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McCommonModule, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McCommonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McCommonModule, deps: [{ token: MC_SANITY_CHECKS, optional: true }], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ /** @nocollapse */ McCommonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McCommonModule, imports: [BidiModule], exports: [BidiModule] });
+/** @nocollapse */ /** @nocollapse */ McCommonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McCommonModule, imports: [[BidiModule], BidiModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McCommonModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [BidiModule],
@@ -205,9 +207,9 @@ function mixinErrorState(base) {
  */
 class McLine {
 }
-/** @nocollapse */ /** @nocollapse */ McLine.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McLine, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ /** @nocollapse */ McLine.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: McLine, selector: "[mc-line], [mcLine]", host: { classAttribute: "mc-line" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McLine, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McLine.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McLine, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ /** @nocollapse */ McLine.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: McLine, selector: "[mc-line], [mcLine]", host: { classAttribute: "mc-line" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McLine, decorators: [{
             type: Directive,
             args: [{
                     selector: '[mc-line], [mcLine]',
@@ -254,10 +256,10 @@ class McLineSetter {
 }
 class McLineModule {
 }
-/** @nocollapse */ /** @nocollapse */ McLineModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McLineModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ /** @nocollapse */ McLineModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McLineModule, declarations: [McLine], exports: [McLine] });
-/** @nocollapse */ /** @nocollapse */ McLineModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McLineModule, imports: [[]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McLineModule, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McLineModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McLineModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ /** @nocollapse */ McLineModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McLineModule, declarations: [McLine], exports: [McLine] });
+/** @nocollapse */ /** @nocollapse */ McLineModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McLineModule, imports: [[]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McLineModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [],
@@ -272,9 +274,9 @@ class ShowOnDirtyErrorStateMatcher {
         return !!(control && control.invalid && (control.dirty || (form && form.submitted)));
     }
 }
-/** @nocollapse */ /** @nocollapse */ ShowOnDirtyErrorStateMatcher.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ShowOnDirtyErrorStateMatcher, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-/** @nocollapse */ /** @nocollapse */ ShowOnDirtyErrorStateMatcher.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ShowOnDirtyErrorStateMatcher });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ShowOnDirtyErrorStateMatcher, decorators: [{
+/** @nocollapse */ /** @nocollapse */ ShowOnDirtyErrorStateMatcher.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: ShowOnDirtyErrorStateMatcher, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+/** @nocollapse */ /** @nocollapse */ ShowOnDirtyErrorStateMatcher.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: ShowOnDirtyErrorStateMatcher });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: ShowOnDirtyErrorStateMatcher, decorators: [{
             type: Injectable
         }] });
 /** Provider that defines how form controls behave with regards to displaying error messages. */
@@ -283,28 +285,39 @@ class ErrorStateMatcher {
         return !!(control && control.invalid && (control.touched || (form && form.submitted)));
     }
 }
-/** @nocollapse */ /** @nocollapse */ ErrorStateMatcher.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ErrorStateMatcher, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-/** @nocollapse */ /** @nocollapse */ ErrorStateMatcher.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ErrorStateMatcher, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ErrorStateMatcher, decorators: [{
+/** @nocollapse */ /** @nocollapse */ ErrorStateMatcher.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: ErrorStateMatcher, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+/** @nocollapse */ /** @nocollapse */ ErrorStateMatcher.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: ErrorStateMatcher, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: ErrorStateMatcher, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
 
+const SECONDS_TEMPLATE$1 = `{
+    SHOW_MILLISECONDS,
+    select,
+        yes{:{SECONDS}{MILLISECONDS}}
+        other{{
+            SHOW_SECONDS,
+            select,
+                yes{:{SECONDS}}
+                other{}
+        }}
+}`;
 const enUS = {
     relativeTemplates: {
         short: {
-            BEFORE_YESTERDAY: '{CURRENT_YEAR, select, yes{{SHORT_DATE}, {TIME}} other{{SHORT_DATE}, {YEAR}}}',
-            YESTERDAY: 'Yesterday, {TIME}',
-            TODAY: 'Today, {TIME}',
-            TOMORROW: 'Tomorrow, {TIME}',
-            AFTER_TOMORROW: '{CURRENT_YEAR, select, yes{{SHORT_DATE}, {TIME}} other{{SHORT_DATE}, {YEAR}}}'
+            BEFORE_YESTERDAY: `{CURRENT_YEAR, select, yes{{SHORT_DATE}, {TIME}} other{{SHORT_DATE}, {YEAR}}}${SECONDS_TEMPLATE$1}`,
+            YESTERDAY: `Yesterday, {TIME}${SECONDS_TEMPLATE$1}`,
+            TODAY: `Today, {TIME}${SECONDS_TEMPLATE$1}`,
+            TOMORROW: `Tomorrow, {TIME}${SECONDS_TEMPLATE$1}`,
+            AFTER_TOMORROW: `{CURRENT_YEAR, select, yes{{SHORT_DATE}, {TIME}} other{{SHORT_DATE}, {YEAR}}}${SECONDS_TEMPLATE$1}`
         },
         long: {
-            BEFORE_YESTERDAY: '{CURRENT_YEAR, select, yes{{DATE}, {TIME}} other{{DATE}, {YEAR}}}',
-            YESTERDAY: 'Yesterday, {TIME}',
-            TODAY: 'Today, {TIME}',
-            TOMORROW: 'Tomorrow, {TIME}',
-            AFTER_TOMORROW: '{CURRENT_YEAR, select, yes{{DATE}, {TIME}} other{{DATE}, {YEAR}}}'
+            BEFORE_YESTERDAY: `{CURRENT_YEAR, select, yes{{DATE}, {TIME}} other{{DATE}, {YEAR}}}${SECONDS_TEMPLATE$1}`,
+            YESTERDAY: `Yesterday, {TIME}${SECONDS_TEMPLATE$1}`,
+            TODAY: `Today, {TIME}${SECONDS_TEMPLATE$1}`,
+            TOMORROW: `Tomorrow, {TIME}${SECONDS_TEMPLATE$1}`,
+            AFTER_TOMORROW: `{CURRENT_YEAR, select, yes{{DATE}, {TIME}} other{{DATE}, {YEAR}}}${SECONDS_TEMPLATE$1}`
         }
     },
     absoluteTemplates: {
@@ -315,12 +328,7 @@ const enUS = {
                 select,
                     yes{{SHORT_DATE}, {TIME}}
                     other{{SHORT_DATE}, {YEAR}, {TIME}}
-            }{
-                SHOW_MILLISECONDS,
-                select,
-                    yes{:{SECONDS}{MILLISECONDS}}
-                    other{}
-            }`
+            }${SECONDS_TEMPLATE$1}`
         },
         long: {
             DATE: '{CURRENT_YEAR, select, yes{{DATE}} other{{DATE}, {YEAR}}}',
@@ -329,12 +337,7 @@ const enUS = {
                 select,
                     yes{{DATE}, {TIME}}
                     other{{DATE}, {YEAR}, {TIME}}
-            }{
-                SHOW_MILLISECONDS,
-                select,
-                    yes{:{SECONDS}{MILLISECONDS}}
-                    other{}
-            }`
+            }${SECONDS_TEMPLATE$1}`
         }
     },
     rangeTemplates: {
@@ -368,22 +371,22 @@ const enUS = {
                                 yes{{SHORT_DATE}, {TIME}}
                                 other{{SHORT_DATE}, {YEAR}, {TIME}}
                         }}
-                }`,
+                }${SECONDS_TEMPLATE$1}`,
                 END_DATETIME: `{
                     SAME_DAY,
                     select,
                         yes{{
                             CURRENT_YEAR,
                             select,
-                                yes{{TIME}, {SHORT_DATE}}
-                                other{{TIME}, {SHORT_DATE}, {YEAR}}
+                                yes{{TIME}${SECONDS_TEMPLATE$1}, {SHORT_DATE}}
+                                other{{TIME}${SECONDS_TEMPLATE$1}, {SHORT_DATE}, {YEAR}}
                         }}
                         other{{
                             CURRENT_YEAR,
                             select,
                                 yes{{SHORT_DATE}, {TIME}}
                                 other{{SHORT_DATE}, {YEAR}, {TIME}}
-                        }}
+                        }${SECONDS_TEMPLATE$1}}
                 }`,
                 DATETIME: `{
                     SAME_DAY,
@@ -421,22 +424,22 @@ const enUS = {
                                 yes{{DATE}, {TIME}}
                                 other{{DATE}, {YEAR}, {TIME}}
                         }}
-                }`,
+                }${SECONDS_TEMPLATE$1}`,
                 END_DATETIME: `{
                     SAME_DAY,
                     select,
                         yes{{
                             CURRENT_YEAR,
                             select,
-                                yes{{TIME}, {DATE}}
-                                other{{TIME}, {DATE}, {YEAR}}
+                                yes{{TIME}${SECONDS_TEMPLATE$1}, {DATE}}
+                                other{{TIME}${SECONDS_TEMPLATE$1}, {DATE}, {YEAR}}
                         }}
                         other{{
                             CURRENT_YEAR,
                             select,
                                 yes{{DATE}, {TIME}}
                                 other{{DATE}, {YEAR}, {TIME}}
-                        }}
+                        }${SECONDS_TEMPLATE$1}}
                 }`,
                 DATETIME: `{
                     SAME_DAY,
@@ -479,7 +482,7 @@ const enUS = {
                                 yes{{DATE}, {TIME}}
                                 other{{DATE}, {YEAR}, {TIME}}
                         }}
-                }`,
+                }${SECONDS_TEMPLATE$1}`,
                 END_DATETIME: `{
                     SAME_DAY,
                     select,
@@ -490,7 +493,7 @@ const enUS = {
                                 yes{{DATE}, {TIME}}
                                 other{{DATE}, {YEAR}, {TIME}}
                         }}
-                }`,
+                }${SECONDS_TEMPLATE$1}`,
                 DATETIME: `{
                     SAME_DAY,
                     select,
@@ -519,13 +522,13 @@ const enUS = {
                     select,
                         yes{{SHORT_DATE}, {TIME}}
                         other{{SHORT_DATE} {YEAR}, {TIME}}
-                }`,
+                }${SECONDS_TEMPLATE$1}`,
                 END_DATETIME: `{
                     CURRENT_YEAR,
                     select,
                         yes{{SHORT_DATE}, {TIME}}
                         other{{SHORT_DATE} {YEAR}, {TIME}}
-                }`,
+                }${SECONDS_TEMPLATE$1}`,
                 DATETIME: `{
                     RANGE_TYPE,
                     select,
@@ -552,13 +555,13 @@ const enUS = {
                     select,
                         yes{{DATE}, {TIME}}
                         other{{DATE} {YEAR}, {TIME}}
-                }`,
+                }${SECONDS_TEMPLATE$1}`,
                 END_DATETIME: `{
                     CURRENT_YEAR,
                     select,
                         yes{{DATE}, {TIME}}
                         other{{DATE} {YEAR}, {TIME}}
-                }`,
+                }${SECONDS_TEMPLATE$1}`,
                 DATETIME: `{
                     RANGE_TYPE,
                     select,
@@ -570,21 +573,32 @@ const enUS = {
     }
 };
 
+const SECONDS_TEMPLATE = `{
+    SHOW_MILLISECONDS,
+    select,
+        yes{:{SECONDS}{MILLISECONDS}}
+        other{{
+            SHOW_SECONDS,
+            select,
+                yes{:{SECONDS}}
+                other{}
+        }}
+}`;
 const ruRU = {
     relativeTemplates: {
         short: {
-            BEFORE_YESTERDAY: '{CURRENT_YEAR, select, yes{{SHORT_DATE}, {TIME}} other{{SHORT_DATE} {YEAR}}}',
-            YESTERDAY: 'Вчера, {TIME}',
-            TODAY: 'Сегодня, {TIME}',
-            TOMORROW: 'Завтра, {TIME}',
-            AFTER_TOMORROW: '{CURRENT_YEAR, select, yes{{SHORT_DATE}, {TIME}} other{{SHORT_DATE} {YEAR}}}'
+            BEFORE_YESTERDAY: `{CURRENT_YEAR, select, yes{{SHORT_DATE}, {TIME}} other{{SHORT_DATE} {YEAR}}}${SECONDS_TEMPLATE}`,
+            YESTERDAY: `Вчера, {TIME}${SECONDS_TEMPLATE}`,
+            TODAY: `Сегодня, {TIME}${SECONDS_TEMPLATE}`,
+            TOMORROW: `Завтра, {TIME}${SECONDS_TEMPLATE}`,
+            AFTER_TOMORROW: `{CURRENT_YEAR, select, yes{{SHORT_DATE}, {TIME}} other{{SHORT_DATE} {YEAR}}}${SECONDS_TEMPLATE}`
         },
         long: {
-            BEFORE_YESTERDAY: '{CURRENT_YEAR, select, yes{{DATE}, {TIME}} other{{DATE} {YEAR}}}',
-            YESTERDAY: 'Вчера, {TIME}',
-            TODAY: 'Сегодня, {TIME}',
-            TOMORROW: 'Завтра, {TIME}',
-            AFTER_TOMORROW: '{CURRENT_YEAR, select, yes{{DATE}, {TIME}} other{{DATE} {YEAR}}}'
+            BEFORE_YESTERDAY: `{CURRENT_YEAR, select, yes{{DATE}, {TIME}} other{{DATE} {YEAR}}}${SECONDS_TEMPLATE}`,
+            YESTERDAY: `Вчера, {TIME}${SECONDS_TEMPLATE}`,
+            TODAY: `Сегодня, {TIME}${SECONDS_TEMPLATE}`,
+            TOMORROW: `Завтра, {TIME}${SECONDS_TEMPLATE}`,
+            AFTER_TOMORROW: `{CURRENT_YEAR, select, yes{{DATE}, {TIME}} other{{DATE} {YEAR}}}${SECONDS_TEMPLATE}`
         }
     },
     absoluteTemplates: {
@@ -595,12 +609,7 @@ const ruRU = {
                 select,
                     yes{{SHORT_DATE}, {TIME}}
                     other{{SHORT_DATE} {YEAR}, {TIME}}
-            }{
-                SHOW_MILLISECONDS,
-                select,
-                    yes{:{SECONDS}{MILLISECONDS}}
-                    other{}
-            }`
+            }${SECONDS_TEMPLATE}`
         },
         long: {
             DATE: '{CURRENT_YEAR, select, yes{{DATE}} other{{DATE} {YEAR}}}',
@@ -609,12 +618,7 @@ const ruRU = {
                 select,
                     yes{{DATE}, {TIME}}
                     other{{DATE} {YEAR}, {TIME}}
-            }{
-                SHOW_MILLISECONDS,
-                select,
-                    yes{:{SECONDS}{MILLISECONDS}}
-                    other{}
-            }`
+            }${SECONDS_TEMPLATE}`
         }
     },
     rangeTemplates: {
@@ -648,22 +652,22 @@ const ruRU = {
                                 yes{{SHORT_DATE}, {TIME}}
                                 other{{SHORT_DATE} {YEAR}, {TIME}}
                         }}
-                }`,
+                }${SECONDS_TEMPLATE}`,
                 END_DATETIME: `{
                     SAME_DAY,
                     select,
                         yes{{
                             CURRENT_YEAR,
                             select,
-                                yes{{TIME}, {SHORT_DATE}}
-                                other{{TIME}, {SHORT_DATE} {YEAR}}
+                                yes{{TIME}${SECONDS_TEMPLATE}, {SHORT_DATE}}
+                                other{{TIME}${SECONDS_TEMPLATE}, {SHORT_DATE} {YEAR}}
                         }}
                         other{{
                             CURRENT_YEAR,
                             select,
                                 yes{{SHORT_DATE}, {TIME}}
                                 other{{SHORT_DATE} {YEAR}, {TIME}}
-                        }}
+                        }${SECONDS_TEMPLATE}}
                 }`,
                 DATETIME: `{
                     SAME_DAY,
@@ -701,22 +705,22 @@ const ruRU = {
                                 yes{{DATE}, {TIME}}
                                 other{{DATE} {YEAR}, {TIME}}
                         }}
-                }`,
+                }${SECONDS_TEMPLATE}`,
                 END_DATETIME: `{
                     SAME_DAY,
                     select,
                         yes{{
                             CURRENT_YEAR,
                             select,
-                                yes{{TIME}, {DATE}}
-                                other{{TIME}, {DATE} {YEAR}}
+                                yes{{TIME}${SECONDS_TEMPLATE}, {DATE}}
+                                other{{TIME}${SECONDS_TEMPLATE}, {DATE} {YEAR}}
                         }}
                         other{{
                             CURRENT_YEAR,
                             select,
                                 yes{{DATE}, {TIME}}
                                 other{{DATE} {YEAR}, {TIME}}
-                        }}
+                        }${SECONDS_TEMPLATE}}
                 }`,
                 DATETIME: `{
                     SAME_DAY,
@@ -759,7 +763,7 @@ const ruRU = {
                                 yes{{DATE}, {TIME}}
                                 other{{DATE} {YEAR}, {TIME}}
                         }}
-                }`,
+                }${SECONDS_TEMPLATE}`,
                 END_DATETIME: `{
                     SAME_DAY,
                     select,
@@ -770,7 +774,7 @@ const ruRU = {
                                 yes{{DATE}, {TIME}}
                                 other{{DATE} {YEAR}, {TIME}}
                         }}
-                }`,
+                }${SECONDS_TEMPLATE}`,
                 DATETIME: `{
                     SAME_DAY,
                     select,
@@ -799,13 +803,13 @@ const ruRU = {
                     select,
                         yes{{SHORT_DATE}, {TIME}}
                         other{{SHORT_DATE} {YEAR}, {TIME}}
-                }`,
+                }${SECONDS_TEMPLATE}`,
                 END_DATETIME: `{
                     CURRENT_YEAR,
                     select,
                         yes{{SHORT_DATE}, {TIME}}
                         other{{SHORT_DATE} {YEAR}, {TIME}}
-                }`,
+                }${SECONDS_TEMPLATE}`,
                 DATETIME: `{
                     RANGE_TYPE,
                     select,
@@ -832,13 +836,13 @@ const ruRU = {
                     select,
                         yes{{DATE}, {TIME}}
                         other{{DATE} {YEAR}, {TIME}}
-                }`,
+                }${SECONDS_TEMPLATE}`,
                 END_DATETIME: `{
                     CURRENT_YEAR,
                     select,
                         yes{{DATE}, {TIME}}
                         other{{DATE} {YEAR}, {TIME}}
-                }`,
+                }${SECONDS_TEMPLATE}`,
                 DATETIME: `{
                     RANGE_TYPE,
                     select,
@@ -867,33 +871,30 @@ class DateFormatter {
      * @param template - template
      * @returns relative date by template
      */
-    relativeDate(date, template) {
+    relativeDate(date, template, seconds = false, milliseconds = false) {
         if (!this.adapter.isDateInstance(date)) {
             throw new Error(this.invalidDateErrorText);
         }
-        const isBeforeYesterday = this.adapter.diffNow(date, 'days') <= -2;
-        const isYesterday = this.adapter.diffNow(date, 'days') <= -1 && this.adapter.diffNow(date, 'days') > -2;
-        const isToday = this.adapter.hasSame(this.adapter.today(), date, 'days');
-        const isTomorrow = this.adapter.diffNow(date, 'days') >= 1 && this.adapter.diffNow(date, 'days') < 2;
-        const isAfterTomorrow = this.adapter.diffNow(date, 'days') > 1;
-        const templateVariables = Object.assign(Object.assign({}, this.adapter.config.variables), template.variables);
-        const variables = this.compileVariables(date, templateVariables);
         let newTemplate;
-        if (isBeforeYesterday) {
+        const templateVariables = Object.assign(Object.assign({}, this.adapter.config.variables), template.variables);
+        if (this.isBeforeYesterday(date)) {
             newTemplate = template.BEFORE_YESTERDAY;
         }
-        else if (isYesterday) {
+        else if (this.isYesterday(date)) {
             newTemplate = template.YESTERDAY;
         }
-        else if (isToday) {
+        else if (this.isToday(date)) {
             newTemplate = template.TODAY;
         }
-        else if (isTomorrow) {
+        else if (this.isTomorrow(date)) {
             newTemplate = template.TOMORROW;
         }
-        else if (isAfterTomorrow) {
+        else if (this.isAfterTomorrow(date)) {
             newTemplate = template.AFTER_TOMORROW;
         }
+        const variables = this.compileVariables(date, templateVariables);
+        variables.SHOW_SECONDS = seconds ? 'yes' : 'no';
+        variables.SHOW_MILLISECONDS = milliseconds ? 'yes' : 'no';
         return this.messageFormat.compile(newTemplate)(variables);
     }
     /**
@@ -910,18 +911,36 @@ class DateFormatter {
     relativeLongDate(date) {
         return this.relativeDate(date, this.config.relativeTemplates.long);
     }
+    /**
+     * @param date - date
+     * @param options - DateTimeOptions
+     * @returns relative date in short format with time
+     */
+    relativeShortDateTime(date, options) {
+        return this.relativeDate(date, this.config.relativeTemplates.short, options === null || options === void 0 ? void 0 : options.seconds, options === null || options === void 0 ? void 0 : options.milliseconds);
+    }
+    /**
+     * @param date - date
+     * @param options - DateTimeOptions
+     * @returns relative date in long format with time
+     */
+    relativeLongDateTime(date, options) {
+        return this.relativeDate(date, this.config.relativeTemplates.long, options === null || options === void 0 ? void 0 : options.seconds, options === null || options === void 0 ? void 0 : options.milliseconds);
+    }
     /**
      * @param date - date
      * @param params - parameters
      * @param datetime - should time be shown as well
+     * @param seconds - should time with seconds be shown as well
      * @param milliseconds - should time with milliseconds be shown as well
      * @returns absolute date in common format
      */
-    absoluteDate(date, params, datetime = false, milliseconds = false) {
+    absoluteDate(date, params, datetime = false, seconds = false, milliseconds = false) {
         if (!this.adapter.isDateInstance(date)) {
             throw new Error(this.invalidDateErrorText);
         }
         const variables = this.compileVariables(date, Object.assign(Object.assign({}, this.adapter.config.variables), params.variables));
+        variables.SHOW_SECONDS = seconds ? 'yes' : 'no';
         variables.SHOW_MILLISECONDS = milliseconds ? 'yes' : 'no';
         const template = datetime ? params.DATETIME : params.DATE;
         return this.messageFormat.compile(template)(variables);
@@ -935,11 +954,11 @@ class DateFormatter {
     }
     /**
      * @param date - date
-     * @param options - AbsoluteDateTimeOptions
+     * @param options - DateTimeOptions
      * @returns absolute date in short format with time
      */
     absoluteShortDateTime(date, options) {
-        return this.absoluteDate(date, this.config.absoluteTemplates.short, true, options === null || options === void 0 ? void 0 : options.milliseconds);
+        return this.absoluteDate(date, this.config.absoluteTemplates.short, true, options === null || options === void 0 ? void 0 : options.seconds, options === null || options === void 0 ? void 0 : options.milliseconds);
     }
     /**
      * @param date - date
@@ -950,11 +969,11 @@ class DateFormatter {
     }
     /**
      * @param date - date
-     * @param options - AbsoluteDateTimeOptions
+     * @param options - DateTimeOptions
      * @returns absolute date in long format with time
      */
     absoluteLongDateTime(date, options) {
-        return this.absoluteDate(date, this.config.absoluteTemplates.long, true, options === null || options === void 0 ? void 0 : options.milliseconds);
+        return this.absoluteDate(date, this.config.absoluteTemplates.long, true, options === null || options === void 0 ? void 0 : options.seconds, options === null || options === void 0 ? void 0 : options.milliseconds);
     }
     /**
      * @param startDate - start date
@@ -982,9 +1001,11 @@ class DateFormatter {
      * @param startDate - start date
      * @param endDate - end date
      * @param template - template
+     * @param seconds - should time with seconds be shown as well
+     * @param milliseconds - should time with milliseconds be shown as well
      * @returns opened date
      */
-    openedRangeDateTime(startDate, endDate, template) {
+    openedRangeDateTime(startDate, endDate, template, seconds = false, milliseconds = false) {
         if (!this.adapter.isDateInstance(startDate) && !this.adapter.isDateInstance(endDate)) {
             throw new Error(this.invalidDateErrorText);
         }
@@ -992,10 +1013,14 @@ class DateFormatter {
         let params = {};
         if (startDate) {
             const startDateVariables = this.compileVariables(startDate, variables);
+            startDateVariables.SHOW_SECONDS = seconds ? 'yes' : 'no';
+            startDateVariables.SHOW_MILLISECONDS = milliseconds ? 'yes' : 'no';
             params = Object.assign(Object.assign({}, variables), { START_DATETIME: this.messageFormat.compile(template.START_DATETIME)(startDateVariables), RANGE_TYPE: 'onlyStart' });
         }
         else if (endDate) {
             const endDateVariables = this.compileVariables(endDate, variables);
+            endDateVariables.SHOW_SECONDS = seconds ? 'yes' : 'no';
+            endDateVariables.SHOW_MILLISECONDS = milliseconds ? 'yes' : 'no';
             params = Object.assign(Object.assign({}, variables), { END_DATETIME: this.messageFormat.compile(template.END_DATETIME)(endDateVariables), RANGE_TYPE: 'onlyEnd' });
         }
         return this.messageFormat.compile(template.DATETIME)(params);
@@ -1028,7 +1053,7 @@ class DateFormatter {
      * @param template - template
      * @returns range date in template format with time
      */
-    rangeDateTime(startDate, endDate, template) {
+    rangeDateTime(startDate, endDate, template, seconds = false, milliseconds = false) {
         if (!this.adapter.isDateInstance(startDate) || !this.adapter.isDateInstance(endDate)) {
             throw new Error(this.invalidDateErrorText);
         }
@@ -1038,9 +1063,13 @@ class DateFormatter {
         const startDateVariables = this.compileVariables(startDate, variables);
         startDateVariables.SAME_MONTH = sameMonth;
         startDateVariables.SAME_DAY = sameDay;
+        startDateVariables.SHOW_SECONDS = seconds ? 'yes' : 'no';
+        startDateVariables.SHOW_MILLISECONDS = milliseconds ? 'yes' : 'no';
         const endDateVariables = this.compileVariables(endDate, variables);
         endDateVariables.SAME_MONTH = sameMonth;
         endDateVariables.SAME_DAY = sameDay;
+        endDateVariables.SHOW_SECONDS = seconds ? 'yes' : 'no';
+        endDateVariables.SHOW_MILLISECONDS = milliseconds ? 'yes' : 'no';
         const bothCurrentYear = startDateVariables.CURRENT_YEAR === 'yes' && endDateVariables.CURRENT_YEAR === 'yes';
         startDateVariables.CURRENT_YEAR = bothCurrentYear ? 'yes' : 'no';
         endDateVariables.CURRENT_YEAR = bothCurrentYear ? 'yes' : 'no';
@@ -1062,14 +1091,15 @@ class DateFormatter {
     /**
      * @param startDate - start date
      * @param endDate - end date
+     * @param options - DateTimeOptions
      * @returns range date in short format with time
      */
-    rangeShortDateTime(startDate, endDate) {
+    rangeShortDateTime(startDate, endDate, options) {
         const rangeTemplates = this.config.rangeTemplates;
         if (startDate && endDate) {
-            return this.rangeDateTime(startDate, endDate, rangeTemplates.closedRange.short);
+            return this.rangeDateTime(startDate, endDate, rangeTemplates.closedRange.short, options === null || options === void 0 ? void 0 : options.seconds, options === null || options === void 0 ? void 0 : options.milliseconds);
         }
-        return this.openedRangeDateTime(startDate, endDate || null, rangeTemplates.openedRange.short);
+        return this.openedRangeDateTime(startDate, endDate || null, rangeTemplates.openedRange.short, options === null || options === void 0 ? void 0 : options.seconds, options === null || options === void 0 ? void 0 : options.milliseconds);
     }
     /**
      * @param startDate - start date
@@ -1086,22 +1116,24 @@ class DateFormatter {
     /**
      * @param startDate - start date
      * @param endDate - end date
+     * @param options - DateTimeOptions
      * @returns range date in long format with time
      */
-    rangeLongDateTime(startDate, endDate) {
+    rangeLongDateTime(startDate, endDate, options) {
         const rangeTemplates = this.config.rangeTemplates;
         if (startDate && endDate) {
-            return this.rangeDateTime(startDate, endDate, rangeTemplates.closedRange.long);
+            return this.rangeDateTime(startDate, endDate, rangeTemplates.closedRange.long, options === null || options === void 0 ? void 0 : options.seconds, options === null || options === void 0 ? void 0 : options.milliseconds);
         }
         return this.openedRangeDateTime(startDate, endDate || null, rangeTemplates.openedRange.long);
     }
     /**
      * @param startDate - start date
      * @param endDate - end date
+     * @param options - DateTimeOptions
      * @returns range middle date with time
      */
-    rangeMiddleDateTime(startDate, endDate) {
-        return this.rangeDateTime(startDate, endDate, this.config.rangeTemplates.closedRange.middle);
+    rangeMiddleDateTime(startDate, endDate, options) {
+        return this.rangeDateTime(startDate, endDate, this.config.rangeTemplates.closedRange.middle, options === null || options === void 0 ? void 0 : options.seconds, options === null || options === void 0 ? void 0 : options.milliseconds);
     }
     compileVariables(date, variables) {
         const compiledVariables = {};
@@ -1116,13 +1148,30 @@ class DateFormatter {
         compiledVariables.CURRENT_YEAR = this.hasSame(date, this.adapter.today(), 'year');
         return compiledVariables;
     }
+    isBeforeYesterday(date) {
+        return this.adapter.daysFromToday(date) <= -2;
+    }
+    isYesterday(date) {
+        const interval = this.adapter.daysFromToday(date);
+        return interval > -2 && interval <= -1;
+    }
+    isToday(date) {
+        return this.adapter.daysFromToday(date) === 0;
+    }
+    isTomorrow(date) {
+        const interval = this.adapter.daysFromToday(date);
+        return interval >= 1 && interval < 2;
+    }
+    isAfterTomorrow(date) {
+        return this.adapter.daysFromToday(date) >= 2;
+    }
     hasSame(startDate, endDate, unit) {
         return this.adapter.hasSame(startDate, endDate, unit) ? 'yes' : 'no';
     }
 }
-/** @nocollapse */ /** @nocollapse */ DateFormatter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DateFormatter, deps: [{ token: i1.DateAdapter }, { token: MC_DATE_LOCALE }], target: i0.ɵɵFactoryTarget.Injectable });
-/** @nocollapse */ /** @nocollapse */ DateFormatter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DateFormatter });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DateFormatter, decorators: [{
+/** @nocollapse */ /** @nocollapse */ DateFormatter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: DateFormatter, deps: [{ token: i1.DateAdapter }, { token: MC_DATE_LOCALE }], target: i0.ɵɵFactoryTarget.Injectable });
+/** @nocollapse */ /** @nocollapse */ DateFormatter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: DateFormatter });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: DateFormatter, decorators: [{
             type: Injectable
         }], ctorParameters: function () {
         return [{ type: i1.DateAdapter }, { type: undefined, decorators: [{
@@ -1212,10 +1261,10 @@ class McDecimalPipe {
         }
     }
 }
-/** @nocollapse */ /** @nocollapse */ McDecimalPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McDecimalPipe, deps: [{ token: MC_LOCALE_ID, optional: true }], target: i0.ɵɵFactoryTarget.Pipe });
-/** @nocollapse */ /** @nocollapse */ McDecimalPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McDecimalPipe, name: "mcNumber" });
-/** @nocollapse */ /** @nocollapse */ McDecimalPipe.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McDecimalPipe, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McDecimalPipe, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McDecimalPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McDecimalPipe, deps: [{ token: MC_LOCALE_ID, optional: true }], target: i0.ɵɵFactoryTarget.Pipe });
+/** @nocollapse */ /** @nocollapse */ McDecimalPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McDecimalPipe, name: "mcNumber" });
+/** @nocollapse */ /** @nocollapse */ McDecimalPipe.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McDecimalPipe, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McDecimalPipe, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }, {
@@ -1232,10 +1281,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
 
 class McFormattersModule {
 }
-/** @nocollapse */ /** @nocollapse */ McFormattersModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McFormattersModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ /** @nocollapse */ McFormattersModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McFormattersModule, declarations: [McDecimalPipe], exports: [McDecimalPipe] });
-/** @nocollapse */ /** @nocollapse */ McFormattersModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McFormattersModule, providers: [DateFormatter] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McFormattersModule, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McFormattersModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McFormattersModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ /** @nocollapse */ McFormattersModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McFormattersModule, declarations: [McDecimalPipe], exports: [McDecimalPipe] });
+/** @nocollapse */ /** @nocollapse */ McFormattersModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McFormattersModule, providers: [DateFormatter] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McFormattersModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [McDecimalPipe],
@@ -1334,19 +1383,19 @@ class McHighlightPipe {
         return value.replace(new RegExp(`(${args})`, 'gi'), '<mark class="mc-highlight">$1</mark>');
     }
 }
-/** @nocollapse */ /** @nocollapse */ McHighlightPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McHighlightPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-/** @nocollapse */ /** @nocollapse */ McHighlightPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McHighlightPipe, name: "mcHighlight" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McHighlightPipe, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McHighlightPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McHighlightPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+/** @nocollapse */ /** @nocollapse */ McHighlightPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McHighlightPipe, name: "mcHighlight" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McHighlightPipe, decorators: [{
             type: Pipe,
             args: [{ name: 'mcHighlight' }]
         }] });
 
 class McHighlightModule {
 }
-/** @nocollapse */ /** @nocollapse */ McHighlightModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McHighlightModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ /** @nocollapse */ McHighlightModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McHighlightModule, declarations: [McHighlightPipe], imports: [CommonModule], exports: [McHighlightPipe] });
-/** @nocollapse */ /** @nocollapse */ McHighlightModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McHighlightModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McHighlightModule, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McHighlightModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McHighlightModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ /** @nocollapse */ McHighlightModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McHighlightModule, declarations: [McHighlightPipe], imports: [CommonModule], exports: [McHighlightPipe] });
+/** @nocollapse */ /** @nocollapse */ McHighlightModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McHighlightModule, imports: [[CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McHighlightModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],
@@ -1740,16 +1789,16 @@ class McPseudoCheckbox {
         this.disabled = false;
     }
 }
-/** @nocollapse */ /** @nocollapse */ McPseudoCheckbox.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McPseudoCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ /** @nocollapse */ McPseudoCheckbox.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: McPseudoCheckbox, selector: "mc-pseudo-checkbox", inputs: { state: "state", disabled: "disabled" }, host: { properties: { "class.mc-indeterminate": "state === \"indeterminate\"", "class.mc-checked": "state === \"checked\"", "class.mc-disabled": "disabled" }, classAttribute: "mc-pseudo-checkbox" }, ngImport: i0, template: "<i class=\"mc-checkbox-checkmark mc mc-check_16\"></i>\n<i class=\"mc-checkbox-mixedmark mc mc-minus_16\"></i>\n", styles: [".mc-pseudo-checkbox{position:relative;display:inline-block;box-sizing:border-box;width:16px;width:var(--mc-checkbox-size-width, 16px);height:16px;height:var(--mc-checkbox-size-width, 16px);border-radius:3px;border-width:1px;border-width:var(--mc-checkbox-size-border-width, 1px);border-style:solid;cursor:pointer;vertical-align:middle;flex-shrink:0}.mc-pseudo-checkbox .mc-checkbox-checkmark,.mc-pseudo-checkbox .mc-checkbox-mixedmark{display:none;position:absolute;top:-1px;top:calc(-1 * var(--mc-checkbox-size-border-width, 1px));left:-1px;left:calc(-1 * var(--mc-checkbox-size-border-width, 1px))}.mc-pseudo-checkbox.mc-pseudo-checkbox-checked,.mc-pseudo-checkbox.mc-pseudo-checkbox-indeterminate{border-color:transparent}.mc-pseudo-checkbox.mc-checked .mc-checkbox-checkmark,.mc-pseudo-checkbox.mc-indeterminate .mc-checkbox-mixedmark{display:inline-block}.mc-pseudo-checkbox.mc-disabled{cursor:default}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McPseudoCheckbox, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McPseudoCheckbox.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McPseudoCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ /** @nocollapse */ McPseudoCheckbox.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: McPseudoCheckbox, selector: "mc-pseudo-checkbox", inputs: { state: "state", disabled: "disabled" }, host: { properties: { "class.mc-indeterminate": "state === \"indeterminate\"", "class.mc-checked": "state === \"checked\"", "class.mc-disabled": "disabled" }, classAttribute: "mc-pseudo-checkbox" }, ngImport: i0, template: "<i class=\"mc-checkbox-checkmark mc mc-check_16\"></i>\n<i class=\"mc-checkbox-mixedmark mc mc-minus_16\"></i>\n", styles: [".mc-pseudo-checkbox{position:relative;display:inline-block;box-sizing:border-box;width:var(--mc-checkbox-size-width, 16px);height:var(--mc-checkbox-size-width, 16px);border-radius:3px;border-width:var(--mc-checkbox-size-border-width, 1px);border-style:solid;cursor:pointer;vertical-align:middle;flex-shrink:0}.mc-pseudo-checkbox .mc-checkbox-checkmark,.mc-pseudo-checkbox .mc-checkbox-mixedmark{display:none;position:absolute;top:calc(-1 * var(--mc-checkbox-size-border-width, 1px));left:calc(-1 * var(--mc-checkbox-size-border-width, 1px))}.mc-pseudo-checkbox.mc-pseudo-checkbox-checked,.mc-pseudo-checkbox.mc-pseudo-checkbox-indeterminate{border-color:transparent}.mc-pseudo-checkbox.mc-checked .mc-checkbox-checkmark,.mc-pseudo-checkbox.mc-indeterminate .mc-checkbox-mixedmark{display:inline-block}.mc-pseudo-checkbox.mc-disabled{cursor:default}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McPseudoCheckbox, decorators: [{
             type: Component,
             args: [{ selector: 'mc-pseudo-checkbox', host: {
                         class: 'mc-pseudo-checkbox',
                         '[class.mc-indeterminate]': 'state === "indeterminate"',
                         '[class.mc-checked]': 'state === "checked"',
                         '[class.mc-disabled]': 'disabled'
-                    }, preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<i class=\"mc-checkbox-checkmark mc mc-check_16\"></i>\n<i class=\"mc-checkbox-mixedmark mc mc-minus_16\"></i>\n", styles: [".mc-pseudo-checkbox{position:relative;display:inline-block;box-sizing:border-box;width:16px;width:var(--mc-checkbox-size-width, 16px);height:16px;height:var(--mc-checkbox-size-width, 16px);border-radius:3px;border-width:1px;border-width:var(--mc-checkbox-size-border-width, 1px);border-style:solid;cursor:pointer;vertical-align:middle;flex-shrink:0}.mc-pseudo-checkbox .mc-checkbox-checkmark,.mc-pseudo-checkbox .mc-checkbox-mixedmark{display:none;position:absolute;top:-1px;top:calc(-1 * var(--mc-checkbox-size-border-width, 1px));left:-1px;left:calc(-1 * var(--mc-checkbox-size-border-width, 1px))}.mc-pseudo-checkbox.mc-pseudo-checkbox-checked,.mc-pseudo-checkbox.mc-pseudo-checkbox-indeterminate{border-color:transparent}.mc-pseudo-checkbox.mc-checked .mc-checkbox-checkmark,.mc-pseudo-checkbox.mc-indeterminate .mc-checkbox-mixedmark{display:inline-block}.mc-pseudo-checkbox.mc-disabled{cursor:default}\n"] }]
+                    }, preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<i class=\"mc-checkbox-checkmark mc mc-check_16\"></i>\n<i class=\"mc-checkbox-mixedmark mc mc-minus_16\"></i>\n", styles: [".mc-pseudo-checkbox{position:relative;display:inline-block;box-sizing:border-box;width:var(--mc-checkbox-size-width, 16px);height:var(--mc-checkbox-size-width, 16px);border-radius:3px;border-width:var(--mc-checkbox-size-border-width, 1px);border-style:solid;cursor:pointer;vertical-align:middle;flex-shrink:0}.mc-pseudo-checkbox .mc-checkbox-checkmark,.mc-pseudo-checkbox .mc-checkbox-mixedmark{display:none;position:absolute;top:calc(-1 * var(--mc-checkbox-size-border-width, 1px));left:calc(-1 * var(--mc-checkbox-size-border-width, 1px))}.mc-pseudo-checkbox.mc-pseudo-checkbox-checked,.mc-pseudo-checkbox.mc-pseudo-checkbox-indeterminate{border-color:transparent}.mc-pseudo-checkbox.mc-checked .mc-checkbox-checkmark,.mc-pseudo-checkbox.mc-indeterminate .mc-checkbox-mixedmark{display:inline-block}.mc-pseudo-checkbox.mc-disabled{cursor:default}\n"] }]
         }], propDecorators: { state: [{
                 type: Input
             }], disabled: [{
@@ -1758,10 +1807,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
 
 class McPseudoCheckboxModule {
 }
-/** @nocollapse */ /** @nocollapse */ McPseudoCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McPseudoCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ /** @nocollapse */ McPseudoCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McPseudoCheckboxModule, declarations: [McPseudoCheckbox], imports: [CommonModule], exports: [McPseudoCheckbox] });
-/** @nocollapse */ /** @nocollapse */ McPseudoCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McPseudoCheckboxModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McPseudoCheckboxModule, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McPseudoCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McPseudoCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ /** @nocollapse */ McPseudoCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McPseudoCheckboxModule, declarations: [McPseudoCheckbox], imports: [CommonModule], exports: [McPseudoCheckbox] });
+/** @nocollapse */ /** @nocollapse */ McPseudoCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McPseudoCheckboxModule, imports: [[CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McPseudoCheckboxModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],
@@ -1803,9 +1852,9 @@ class McMeasureScrollbarService {
         this._scrollBarWidth = width;
     }
 }
-/** @nocollapse */ /** @nocollapse */ McMeasureScrollbarService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McMeasureScrollbarService, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
-/** @nocollapse */ /** @nocollapse */ McMeasureScrollbarService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McMeasureScrollbarService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McMeasureScrollbarService, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McMeasureScrollbarService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McMeasureScrollbarService, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+/** @nocollapse */ /** @nocollapse */ McMeasureScrollbarService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McMeasureScrollbarService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McMeasureScrollbarService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -1833,14 +1882,14 @@ class McOptgroup extends McOptgroupMixinBase {
         this.labelId = `mc-optgroup-label-${uniqueOptgroupIdCounter++}`;
     }
 }
-/** @nocollapse */ /** @nocollapse */ McOptgroup.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McOptgroup, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ /** @nocollapse */ McOptgroup.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: McOptgroup, selector: "mc-optgroup", inputs: { disabled: "disabled", label: "label" }, host: { properties: { "class.mc-disabled": "disabled" }, classAttribute: "mc-optgroup" }, exportAs: ["mcOptgroup"], usesInheritance: true, ngImport: i0, template: "<label class=\"mc-optgroup-label\" [id]=\"labelId\">{{ label }}</label>\n<ng-content select=\"mc-option, mc-list-option, ng-container\"></ng-content>\n", styles: [".mc-optgroup-label{padding-left:17px;padding-left:var(--mc-optgroup-size-padding-left, 17px);-webkit-user-select:none;user-select:none;cursor:default}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McOptgroup, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McOptgroup.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McOptgroup, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ /** @nocollapse */ McOptgroup.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: McOptgroup, selector: "mc-optgroup", inputs: { disabled: "disabled", label: "label" }, host: { properties: { "class.mc-disabled": "disabled" }, classAttribute: "mc-optgroup" }, exportAs: ["mcOptgroup"], usesInheritance: true, ngImport: i0, template: "<label class=\"mc-optgroup-label\" [id]=\"labelId\">{{ label }}</label>\n<ng-content select=\"mc-option, mc-list-option, ng-container\"></ng-content>\n", styles: [".mc-optgroup-label{padding-left:var(--mc-optgroup-size-padding-left, 17px);-webkit-user-select:none;user-select:none;cursor:default}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McOptgroup, decorators: [{
             type: Component,
             args: [{ selector: 'mc-optgroup', exportAs: 'mcOptgroup', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, inputs: ['disabled'], host: {
                         class: 'mc-optgroup',
                         '[class.mc-disabled]': 'disabled'
-                    }, template: "<label class=\"mc-optgroup-label\" [id]=\"labelId\">{{ label }}</label>\n<ng-content select=\"mc-option, mc-list-option, ng-container\"></ng-content>\n", styles: [".mc-optgroup-label{padding-left:17px;padding-left:var(--mc-optgroup-size-padding-left, 17px);-webkit-user-select:none;user-select:none;cursor:default}\n"] }]
+                    }, template: "<label class=\"mc-optgroup-label\" [id]=\"labelId\">{{ label }}</label>\n<ng-content select=\"mc-option, mc-list-option, ng-container\"></ng-content>\n", styles: [".mc-optgroup-label{padding-left:var(--mc-optgroup-size-padding-left, 17px);-webkit-user-select:none;user-select:none;cursor:default}\n"] }]
         }], propDecorators: { label: [{
                 type: Input
             }] } });
@@ -2019,9 +2068,9 @@ class McOption {
         this.onSelectionChange.emit(new McOptionSelectionChange(this, isUserInput));
     }
 }
-/** @nocollapse */ /** @nocollapse */ McOption.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McOption, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: MC_OPTION_PARENT_COMPONENT, optional: true }, { token: McOptgroup, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ /** @nocollapse */ McOption.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: McOption, selector: "mc-option", inputs: { value: "value", showCheckbox: "showCheckbox", disabled: "disabled" }, outputs: { onSelectionChange: "onSelectionChange" }, host: { listeners: { "click": "selectViaInteraction()", "keydown": "handleKeydown($event)" }, properties: { "attr.tabindex": "getTabIndex()", "class.mc-selected": "selected", "class.mc-option-multiple": "multiple", "class.mc-active": "active", "class.mc-disabled": "disabled", "id": "id" }, classAttribute: "mc-option" }, exportAs: ["mcOption"], ngImport: i0, template: "<mc-pseudo-checkbox\n    *ngIf=\"showCheckbox\"\n    [state]=\"selected ? 'checked' : 'unchecked'\"\n    [disabled]=\"disabled\">\n</mc-pseudo-checkbox>\n\n<span class=\"mc-option-text\"><ng-content></ng-content></span>\n\n<div class=\"mc-option-overlay\"></div>\n", styles: [".mc-option{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;position:relative;max-width:100%;height:32px;height:var(--mc-option-size-height, 32px);border:2px solid transparent;border:var(--mc-option-size-border-width, 2px) solid transparent;cursor:pointer;outline:none;padding-left:16px;padding-left:var(--mc-option-size-horizontal-padding, 16px);padding-right:16px;padding-right:var(--mc-option-size-horizontal-padding, 16px);-webkit-tap-highlight-color:transparent}.mc-option.mc-disabled{cursor:default}.mc-option .mc-pseudo-checkbox{margin-right:8px}.mc-option .mc-option-overlay{position:absolute;top:-2px;top:calc(-1 * var(--mc-option-size-border-width, 2px));left:-2px;left:calc(-1 * var(--mc-option-size-border-width, 2px));right:-2px;right:calc(-1 * var(--mc-option-size-border-width, 2px));bottom:-2px;bottom:calc(-1 * var(--mc-option-size-border-width, 2px));pointer-events:none;border-radius:inherit}.mc-option-text{display:inline-block;flex-grow:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"], components: [{ type: McPseudoCheckbox, selector: "mc-pseudo-checkbox", inputs: ["state", "disabled"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McOption, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McOption.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McOption, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: MC_OPTION_PARENT_COMPONENT, optional: true }, { token: McOptgroup, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ /** @nocollapse */ McOption.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: McOption, selector: "mc-option", inputs: { value: "value", showCheckbox: "showCheckbox", disabled: "disabled" }, outputs: { onSelectionChange: "onSelectionChange" }, host: { listeners: { "click": "selectViaInteraction()", "keydown": "handleKeydown($event)" }, properties: { "attr.tabindex": "getTabIndex()", "class.mc-selected": "selected", "class.mc-option-multiple": "multiple", "class.mc-active": "active", "class.mc-disabled": "disabled", "id": "id" }, classAttribute: "mc-option" }, exportAs: ["mcOption"], ngImport: i0, template: "<mc-pseudo-checkbox\n    *ngIf=\"showCheckbox\"\n    [state]=\"selected ? 'checked' : 'unchecked'\"\n    [disabled]=\"disabled\">\n</mc-pseudo-checkbox>\n\n<span class=\"mc-option-text\"><ng-content></ng-content></span>\n\n<div class=\"mc-option-overlay\"></div>\n", styles: [".mc-option{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;position:relative;max-width:100%;height:var(--mc-option-size-height, 32px);border:var(--mc-option-size-border-width, 2px) solid transparent;cursor:pointer;outline:none;padding-left:var(--mc-option-size-horizontal-padding, 16px);padding-right:var(--mc-option-size-horizontal-padding, 16px);-webkit-tap-highlight-color:transparent}.mc-option.mc-disabled{cursor:default}.mc-option .mc-pseudo-checkbox{margin-right:8px}.mc-option .mc-option-overlay{position:absolute;top:calc(-1 * var(--mc-option-size-border-width, 2px));left:calc(-1 * var(--mc-option-size-border-width, 2px));right:calc(-1 * var(--mc-option-size-border-width, 2px));bottom:calc(-1 * var(--mc-option-size-border-width, 2px));pointer-events:none;border-radius:inherit}.mc-option-text{display:inline-block;flex-grow:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"], components: [{ type: McPseudoCheckbox, selector: "mc-pseudo-checkbox", inputs: ["state", "disabled"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McOption, decorators: [{
             type: Component,
             args: [{ selector: 'mc-option', exportAs: 'mcOption', host: {
                         '[attr.tabindex]': 'getTabIndex()',
@@ -2033,7 +2082,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                         '[id]': 'id',
                         '(click)': 'selectViaInteraction()',
                         '(keydown)': 'handleKeydown($event)'
-                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<mc-pseudo-checkbox\n    *ngIf=\"showCheckbox\"\n    [state]=\"selected ? 'checked' : 'unchecked'\"\n    [disabled]=\"disabled\">\n</mc-pseudo-checkbox>\n\n<span class=\"mc-option-text\"><ng-content></ng-content></span>\n\n<div class=\"mc-option-overlay\"></div>\n", styles: [".mc-option{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;position:relative;max-width:100%;height:32px;height:var(--mc-option-size-height, 32px);border:2px solid transparent;border:var(--mc-option-size-border-width, 2px) solid transparent;cursor:pointer;outline:none;padding-left:16px;padding-left:var(--mc-option-size-horizontal-padding, 16px);padding-right:16px;padding-right:var(--mc-option-size-horizontal-padding, 16px);-webkit-tap-highlight-color:transparent}.mc-option.mc-disabled{cursor:default}.mc-option .mc-pseudo-checkbox{margin-right:8px}.mc-option .mc-option-overlay{position:absolute;top:-2px;top:calc(-1 * var(--mc-option-size-border-width, 2px));left:-2px;left:calc(-1 * var(--mc-option-size-border-width, 2px));right:-2px;right:calc(-1 * var(--mc-option-size-border-width, 2px));bottom:-2px;bottom:calc(-1 * var(--mc-option-size-border-width, 2px));pointer-events:none;border-radius:inherit}.mc-option-text{display:inline-block;flex-grow:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"] }]
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<mc-pseudo-checkbox\n    *ngIf=\"showCheckbox\"\n    [state]=\"selected ? 'checked' : 'unchecked'\"\n    [disabled]=\"disabled\">\n</mc-pseudo-checkbox>\n\n<span class=\"mc-option-text\"><ng-content></ng-content></span>\n\n<div class=\"mc-option-overlay\"></div>\n", styles: [".mc-option{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;position:relative;max-width:100%;height:var(--mc-option-size-height, 32px);border:var(--mc-option-size-border-width, 2px) solid transparent;cursor:pointer;outline:none;padding-left:var(--mc-option-size-horizontal-padding, 16px);padding-right:var(--mc-option-size-horizontal-padding, 16px);-webkit-tap-highlight-color:transparent}.mc-option.mc-disabled{cursor:default}.mc-option .mc-pseudo-checkbox{margin-right:8px}.mc-option .mc-option-overlay{position:absolute;top:calc(-1 * var(--mc-option-size-border-width, 2px));left:calc(-1 * var(--mc-option-size-border-width, 2px));right:calc(-1 * var(--mc-option-size-border-width, 2px));bottom:calc(-1 * var(--mc-option-size-border-width, 2px));pointer-events:none;border-radius:inherit}.mc-option-text{display:inline-block;flex-grow:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"] }]
         }], ctorParameters: function () {
         return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                         type: Optional
@@ -2173,14 +2222,14 @@ class McOptionActionComponent extends McOptionActionMixinBase {
         setTimeout(() => this.option.tooltipTrigger.disabled = false);
     }
 }
-/** @nocollapse */ /** @nocollapse */ McOptionActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McOptionActionComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.FocusMonitor }, { token: MC_OPTION_ACTION_PARENT }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ /** @nocollapse */ McOptionActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: McOptionActionComponent, selector: "mc-option-action", inputs: { disabled: "disabled" }, host: { listeners: { "focus": "onFocus($event)", "blur": "onBlur()", "click": "onClick($event)", "keydown": "onKeyDown($event)" }, properties: { "class.mc-expanded": "false", "attr.disabled": "disabled || null", "attr.tabIndex": "-1" }, classAttribute: "mc-option-action" }, queries: [{ propertyName: "customIcon", first: true, predicate: ["customIcon"], descendants: true }], exportAs: ["mcOptionAction"], usesInheritance: true, ngImport: i0, template: `
+/** @nocollapse */ /** @nocollapse */ McOptionActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McOptionActionComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.FocusMonitor }, { token: MC_OPTION_ACTION_PARENT }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ /** @nocollapse */ McOptionActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: McOptionActionComponent, selector: "mc-option-action", inputs: { disabled: "disabled" }, host: { listeners: { "focus": "onFocus($event)", "blur": "onBlur()", "click": "onClick($event)", "keydown": "onKeyDown($event)" }, properties: { "class.mc-expanded": "false", "attr.disabled": "disabled || null", "attr.tabIndex": "-1" }, classAttribute: "mc-option-action" }, queries: [{ propertyName: "customIcon", first: true, predicate: ["customIcon"], descendants: true }], exportAs: ["mcOptionAction"], usesInheritance: true, ngImport: i0, template: `
         <ng-container [ngSwitch]="!!customIcon">
             <i class="mc mc-icon mc-ellipsis_16" *ngSwitchCase="false"></i>
             <ng-content select="[mc-icon]" *ngSwitchCase="true"></ng-content>
         </ng-container>
     `, isInline: true, styles: [".mc-option-action{box-sizing:unset;position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-right:-2px;width:28px;height:100%;cursor:pointer;outline:none;border:2px solid transparent;background:transparent}.mc-option-action[disabled]{cursor:default}\n"], directives: [{ type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McOptionActionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McOptionActionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mc-option-action', exportAs: 'mcOptionAction', template: `
         <ng-container [ngSwitch]="!!customIcon">
@@ -2209,10 +2258,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
 
 class McOptionModule {
 }
-/** @nocollapse */ /** @nocollapse */ McOptionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McOptionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ /** @nocollapse */ McOptionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McOptionModule, declarations: [McOption, McOptgroup, McOptionActionComponent], imports: [CommonModule, McPseudoCheckboxModule], exports: [McOption, McOptgroup, McOptionActionComponent] });
-/** @nocollapse */ /** @nocollapse */ McOptionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McOptionModule, imports: [[CommonModule, McPseudoCheckboxModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McOptionModule, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McOptionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McOptionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ /** @nocollapse */ McOptionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McOptionModule, declarations: [McOption, McOptgroup, McOptionActionComponent], imports: [CommonModule, McPseudoCheckboxModule], exports: [McOption, McOptgroup, McOptionActionComponent] });
+/** @nocollapse */ /** @nocollapse */ McOptionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McOptionModule, imports: [[CommonModule, McPseudoCheckboxModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McOptionModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, McPseudoCheckboxModule],
@@ -2240,9 +2289,9 @@ class McFormElement {
         }
     }
 }
-/** @nocollapse */ /** @nocollapse */ McFormElement.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McFormElement, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ /** @nocollapse */ McFormElement.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: McFormElement, selector: ".mc-form__row, .mc-form__fieldset, .mc-form__legend", host: { properties: { "class.mc-form-row_margin": "margin" } }, queries: [{ propertyName: "elements", predicate: McFormElement }], exportAs: ["mcFormElement"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McFormElement, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McFormElement.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McFormElement, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ /** @nocollapse */ McFormElement.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: McFormElement, selector: ".mc-form__row, .mc-form__fieldset, .mc-form__legend", host: { properties: { "class.mc-form-row_margin": "margin" } }, queries: [{ propertyName: "elements", predicate: McFormElement }], exportAs: ["mcFormElement"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McFormElement, decorators: [{
             type: Directive,
             args: [{
                     selector: '.mc-form__row, .mc-form__fieldset, .mc-form__legend',
@@ -2269,9 +2318,9 @@ class McForm {
         });
     }
 }
-/** @nocollapse */ /** @nocollapse */ McForm.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McForm, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ /** @nocollapse */ McForm.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: McForm, selector: ".mc-form-vertical, .mc-form-horizontal", host: { classAttribute: "mc-form" }, queries: [{ propertyName: "elements", predicate: McFormElement }], exportAs: ["mcForm"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McForm, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McForm.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McForm, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ /** @nocollapse */ McForm.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: McForm, selector: ".mc-form-vertical, .mc-form-horizontal", host: { classAttribute: "mc-form" }, queries: [{ propertyName: "elements", predicate: McFormElement }], exportAs: ["mcForm"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McForm, decorators: [{
             type: Directive,
             args: [{
                     selector: '.mc-form-vertical, .mc-form-horizontal',
@@ -2287,12 +2336,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
 
 class McFormsModule {
 }
-/** @nocollapse */ /** @nocollapse */ McFormsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ /** @nocollapse */ McFormsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McFormsModule, declarations: [McForm,
+/** @nocollapse */ /** @nocollapse */ McFormsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ /** @nocollapse */ McFormsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McFormsModule, declarations: [McForm,
         McFormElement], exports: [McForm,
         McFormElement] });
-/** @nocollapse */ /** @nocollapse */ McFormsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McFormsModule });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McFormsModule, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McFormsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McFormsModule });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McFormsModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [
@@ -2400,6 +2449,9 @@ class McPopUp {
     markForCheck() {
         this.changeDetectorRef.markForCheck();
     }
+    detectChanges() {
+        this.changeDetectorRef.detectChanges();
+    }
     animationStart() {
         this.closeOnInteraction = false;
     }
@@ -2417,13 +2469,12 @@ class McPopUp {
         }
     }
 }
-/** @nocollapse */ /** @nocollapse */ McPopUp.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McPopUp, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ /** @nocollapse */ McPopUp.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: McPopUp, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McPopUp, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McPopUp.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McPopUp, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ /** @nocollapse */ McPopUp.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: McPopUp, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McPopUp, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; } });
 
-const VIEWPORT_MARGIN = 8;
 // tslint:disable-next-line:naming-convention
 class McPopUpTrigger {
     constructor(overlay, elementRef, ngZone, scrollDispatcher, hostView, scrollStrategy, direction) {
@@ -2440,8 +2491,6 @@ class McPopUpTrigger {
         this.placement = PopUpPlacements.Top;
         this.placementPriority = null;
         this.visible = false;
-        // tslint:disable-next-line:naming-convention orthodox-getter-and-setter
-        this._disabled = false;
         this.listeners = new Map();
         this.destroyed = new Subject();
         this.detach = () => {
@@ -2466,11 +2515,7 @@ class McPopUpTrigger {
             });
             this.placementChange.emit(newPlacement);
             this.updateClassMap(newPlacement);
-            if ($event.scrollableViewProperties.isOverlayClipped && this.instance.isVisible()) {
-                // After position changes occur and the overlay is clipped by
-                // a parent scrollable then close the tooltip.
-                this.ngZone.run(() => this.hide());
-            }
+            this.instance.detectChanges();
         };
         this.addEventListener = (listener, event) => {
             this.elementRef.nativeElement.addEventListener(event, listener);
@@ -2567,11 +2612,11 @@ class McPopUpTrigger {
             return this.overlayRef;
         }
         // Create connected position strategy that listens for scroll events to reposition.
-        const strategy = this.overlay.position()
+        const strategy = this.overlay
+            .position()
             .flexibleConnectedTo(this.elementRef)
             .withTransformOriginOn(this.originSelector)
             .withFlexibleDimensions(false)
-            .withViewportMargin(VIEWPORT_MARGIN)
             .withPositions([...EXTENDED_OVERLAY_POSITIONS])
             .withScrollableContainers(this.scrollDispatcher.getAncestorScrollContainers(this.elementRef));
         strategy.positionChanges
@@ -2645,9 +2690,9 @@ class McPopUpTrigger {
         this.listeners.clear();
     }
 }
-/** @nocollapse */ /** @nocollapse */ McPopUpTrigger.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McPopUpTrigger, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ /** @nocollapse */ McPopUpTrigger.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: McPopUpTrigger, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: McPopUpTrigger, decorators: [{
+/** @nocollapse */ /** @nocollapse */ McPopUpTrigger.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McPopUpTrigger, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ /** @nocollapse */ McPopUpTrigger.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: McPopUpTrigger, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: McPopUpTrigger, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i1$2.Overlay }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i1$2.ScrollDispatcher }, { type: i0.ViewContainerRef }, { type: undefined }, { type: i2$1.Directionality }]; } });
 
@@ -2655,5 +2700,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AnimationCurves, BOTTOM_LEFT_POSITION_PRIORITY, BOTTOM_POSITION_PRIORITY, BOTTOM_RIGHT_POSITION_PRIORITY, DEFAULT_MC_LOCALE_ID, DateFormatter, EXTENDED_OVERLAY_POSITIONS, ErrorStateMatcher, LEFT_BOTTOM_POSITION_PRIORITY, LEFT_POSITION_PRIORITY, LEFT_TOP_POSITION_PRIORITY, MC_LABEL_GLOBAL_OPTIONS, MC_LOCALE_ID, MC_OPTION_ACTION_PARENT, MC_OPTION_PARENT_COMPONENT, MC_SANITY_CHECKS, MC_SELECT_SCROLL_STRATEGY, MC_SELECT_SCROLL_STRATEGY_PROVIDER, MC_VALIDATION, McCommonModule, McDecimalPipe, McForm, McFormElement, McFormattersModule, McFormsModule, McHighlightModule, McHighlightPipe, McLine, McLineModule, McLineSetter, McMeasureScrollbarService, McOptgroup, McOptgroupBase, McOptgroupMixinBase, McOption, McOptionActionBase, McOptionActionComponent, McOptionActionMixinBase, McOptionModule, McOptionSelectionChange, McPopUp, McPopUpTrigger, McPseudoCheckbox, McPseudoCheckboxModule, MultipleMode, NUMBER_FORMAT_REGEXP, POSITION_MAP, POSITION_PRIORITY_STRATEGY, POSITION_TO_CSS_MAP, PopUpPlacements, PopUpSizes, PopUpTriggers, PopUpVisibility, RIGHT_BOTTOM_POSITION_PRIORITY, RIGHT_POSITION_PRIORITY, RIGHT_TOP_POSITION_PRIORITY, SELECT_PANEL_INDENT_PADDING_X, SELECT_PANEL_MAX_HEIGHT, SELECT_PANEL_PADDING_X, SELECT_PANEL_VIEWPORT_PADDING, ShowOnDirtyErrorStateMatcher, TOP_LEFT_POSITION_PRIORITY, TOP_POSITION_PRIORITY, TOP_RIGHT_POSITION_PRIORITY, ThemePalette, countGroupLabelsBeforeOption, fadeAnimation, getMcSelectDynamicMultipleError, getMcSelectNonArrayValueError, getMcSelectNonFunctionValueError, getOptionScrollPosition, isBoolean, mcSelectAnimations, mcSelectScrollStrategyProviderFactory, mixinColor, mixinDisabled, mixinErrorState, mixinTabIndex, selectEvents, setMosaicValidation, setMosaicValidationForFormControl, setMosaicValidationForModelControl, toBoolean, validationTooltipHideDelay, validationTooltipShowDelay };
+export { AnimationCurves, BOTTOM_LEFT_POSITION_PRIORITY, BOTTOM_POSITION_PRIORITY, BOTTOM_RIGHT_POSITION_PRIORITY, DEFAULT_MC_LOCALE_ID, DateFormatter, EXTENDED_OVERLAY_POSITIONS, ErrorStateMatcher, LEFT_BOTTOM_POSITION_PRIORITY, LEFT_POSITION_PRIORITY, LEFT_TOP_POSITION_PRIORITY, MC_LABEL_GLOBAL_OPTIONS, MC_LOCALE_ID, MC_OPTION_ACTION_PARENT, MC_OPTION_PARENT_COMPONENT, MC_SANITY_CHECKS, MC_SELECT_SCROLL_STRATEGY, MC_SELECT_SCROLL_STRATEGY_PROVIDER, MC_VALIDATION, McCommonModule, McDecimalPipe, McForm, McFormElement, McFormattersModule, McFormsModule, McHighlightModule, McHighlightPipe, McLine, McLineModule, McLineSetter, McMeasureScrollbarService, McOptgroup, McOptgroupBase, McOptgroupMixinBase, McOption, McOptionActionBase, McOptionActionComponent, McOptionActionMixinBase, McOptionModule, McOptionSelectionChange, McPopUp, McPopUpTrigger, McPseudoCheckbox, McPseudoCheckboxModule, MultipleMode, NUMBER_FORMAT_REGEXP, POSITION_MAP, POSITION_PRIORITY_STRATEGY, POSITION_TO_CSS_MAP, PopUpPlacements, PopUpSizes, PopUpTriggers, PopUpVisibility, RIGHT_BOTTOM_POSITION_PRIORITY, RIGHT_POSITION_PRIORITY, RIGHT_TOP_POSITION_PRIORITY, SELECT_PANEL_INDENT_PADDING_X, SELECT_PANEL_MAX_HEIGHT, SELECT_PANEL_PADDING_X, SELECT_PANEL_VIEWPORT_PADDING, ShowOnDirtyErrorStateMatcher, TOP_LEFT_POSITION_PRIORITY, TOP_POSITION_PRIORITY, TOP_RIGHT_POSITION_PRIORITY, ThemePalette, VERSION, countGroupLabelsBeforeOption, fadeAnimation, getMcSelectDynamicMultipleError, getMcSelectNonArrayValueError, getMcSelectNonFunctionValueError, getOptionScrollPosition, isBoolean, mcSelectAnimations, mcSelectScrollStrategyProviderFactory, mixinColor, mixinDisabled, mixinErrorState, mixinTabIndex, selectEvents, setMosaicValidation, setMosaicValidationForFormControl, setMosaicValidationForModelControl, toBoolean, validationTooltipHideDelay, validationTooltipShowDelay };
 //# sourceMappingURL=ptsecurity-mosaic-core.mjs.map