@ptsecurity/mosaic 15.4.0 → 15.5.0

package/fesm2015/ptsecurity-mosaic-file-upload.mjs

@@ -46,9 +46,9 @@ class McFileDropDirective {
         }
     }
 }
-/** @nocollapse */ McFileDropDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFileDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ McFileDropDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.2", type: McFileDropDirective, selector: "[mcFileDrop]", outputs: { filesDropped: "filesDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" }, properties: { "class.dragover": "dragover" } }, exportAs: ["mcFileDrop"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFileDropDirective, decorators: [{
+/** @nocollapse */ McFileDropDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFileDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ McFileDropDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: McFileDropDirective, selector: "[mcFileDrop]", outputs: { filesDropped: "filesDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" }, properties: { "class.dragover": "dragover" } }, exportAs: ["mcFileDrop"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFileDropDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[mcFileDrop]',
@@ -175,9 +175,9 @@ class McMultipleFileUploadComponent {
         return this.acceptedFiles !== '*/*' && this.acceptedFiles.length > 0 ? this.acceptedFiles.includes(fileExt) : true;
     }
 }
-/** @nocollapse */ McMultipleFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McMultipleFileUploadComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ChangeDetectorRef }, { token: MC_FILE_UPLOAD_CONFIGURATION, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ McMultipleFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.2", type: McMultipleFileUploadComponent, selector: "mc-multiple-file-upload", inputs: { accept: "accept", disabled: "disabled", errors: "errors", files: "files", size: "size", inputId: "inputId", customValidation: "customValidation" }, outputs: { fileQueueChanged: "fileQueueChanged" }, host: { classAttribute: "mc-multiple-file-upload" }, queries: [{ propertyName: "customFileIcon", first: true, predicate: ["mcFileIcon"], descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<div class=\"mc-file-upload\"\n     mcFileDrop\n     [class.disabled]=\"disabled\"\n     [class.selected]=\"files && files.length\"\n     [ngClass]=\"size\"\n     (filesDropped)=\"onFileDropped($event)\"\n>\n    <ng-container *ngIf=\"!files.length; else fileOutput\">\n        <div class=\"dropzone\">\n            <ng-container  *ngIf=\"size === 'default' else compactCaption\">\n                <i mc-icon=\"mc-upload-to-cloud_64\"></i>\n                <div class=\"dropzone__text\">\n                    <span class=\"multiple__header\">{{ config.title }}</span>\n                    <div>\n                        <span class=\"multiple__caption\">\n                            {{ config.captionText }}\n                            <label class=\"mc-link\"\n                                   [class.mc-focused]=\"hasFocus\"\n                                   [for]=\"inputId\">\n                            {{ config.browseLink }}\n                        </label>\n                        </span>\n                    </div>\n                </div>\n            </ng-container>\n        </div>\n\n\n    </ng-container>\n    <input #input\n           type=\"file\"\n           class=\"cdk-visually-hidden\"\n           multiple\n           [id]=\"inputId\"\n           [accept]=\"acceptedFiles\"\n           [disabled]=\"disabled\"\n           (change)=\"onFileSelectedViaClick($event)\"\n    >\n</div>\n\n<div class=\"mc-file-upload__info-section\">\n    <mc-hint class=\"mc-file-upload__hint\">\n        <ng-content select=\"[hint]\"></ng-content>\n    </mc-hint>\n\n    <ng-container *ngIf=\"hasErrors\">\n        <mc-hint class=\"mc-file-upload__hint mc-error\"\n                 *ngFor=\"let error of errors\">\n                {{ error }}\n        </mc-hint>\n    </ng-container>\n</div>\n\n<ng-template #fileOutput>\n    <div class=\"file-upload__dropzone\">\n        <div class=\"mc-file-upload__grid\">\n            <div class=\"mc-file-multiple-uploaded__header\">\n                <div class=\"mc-file-multiple-uploaded__header-inner\">\n                    <div [class]=\"'mc-file-upload__' + column.cssClass\" *ngFor=\"let column of columnDefs\">\n                        {{ column.header }}\n                    </div>\n                </div>\n            </div>\n\n            <mc-list-selection [autoSelect]=\"false\" [disabled]=\"disabled\">\n                <mc-list-option\n                    class=\"multiple__uploaded-item\"\n                    [value]=\"file.file.name\"\n                    (keydown.delete)=\"deleteFile(index)\"\n                    (keydown.backspace)=\"deleteFile(index)\"\n                    *ngFor=\"let file of files; let index = index;\">\n                    <div class=\"mc-file-upload__row\" [class.error]=\"file.hasError\">\n                        <div class=\"mc-file-upload__file\">\n                            <ng-container *ngIf=\"{ loading: file.loading | async, progress: file.progress | async } as asyncData\">\n                                <ng-container *ngIf=\"!asyncData.loading\"\n                                              [ngTemplateOutlet]=\"customFileIcon\"\n                                              [ngTemplateOutletContext]=\"{ $implicit: file }\"\n                                >\n                                </ng-container>\n\n                                <mc-progress-spinner\n                                    class=\"pt-nat-file-upload-name-cell__icon\"\n                                    [value]=\"asyncData.progress || 0\"\n                                    *ngIf=\"asyncData.loading\"\n                                ></mc-progress-spinner>\n                            </ng-container>\n\n                            <span class=\"file-item__text\" [mcEllipsisCenter]=\"file.file.name\" [minVisibleLength]=\"10\"></span>\n                        </div>\n                        <div class=\"mc-file-upload__size\">\n                            {{ file.file.size | mcDataSize }}\n                        </div>\n                        <div class=\"mc-file-upload__action\">\n                            <i mc-icon=\"mc-close-circle_16\" (click)=\"deleteFile(index, $event)\"></i>\n                        </div>\n                    </div>\n                </mc-list-option>\n            </mc-list-selection>\n        </div>\n\n        <div class=\"btn-upload\">\n            <div class=\"dropzone\">\n                <i mc-icon=\"mc-upload-to-cloud_24\"></i>\n                <span class=\"dropzone__text multiple__caption\">\n                    {{ config.captionTextWhenSelected }}\n                    <label class=\"mc-link\"\n                           [class.mc-focused]=\"hasFocus\"\n                           [for]=\"inputId\">\n                        {{ config.browseLink }}\n                    </label>\n                </span>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template #compactCaption>\n    <i mc-icon=\"mc-upload-to-cloud_24\"></i>\n    <span class=\"dropzone__text multiple__caption\">\n        {{ config.captionText }}\n        <label class=\"mc-link\"\n               [class.mc-focused]=\"hasFocus\"\n               [for]=\"inputId\">\n        {{ config.browseLink }}\n    </label>\n    </span>\n</ng-template>\n", styles: ["@keyframes mc-progress{0%{background-position:0 0}to{background-position:29px 0}}.mc-progress{position:relative}.mc-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.05) 10px,transparent 10px,transparent 20px,rgba(0,0,0,.05) 20px,rgba(0,0,0,.05) 30px,transparent 30px) repeat;background-size:29px 29px;animation:mc-progress 1s linear infinite}.mc-group{display:flex;flex-direction:row}.mc-group .mc-group_justified>.mc-group-item{width:100%}.mc-group .mc-group-item+.mc-group-item{margin-left:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group{display:flex;flex-direction:column}.mc-vertical-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.mc-vertical-group>.mc-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group .mc-group-item+.mc-group-item{margin-top:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.mc-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative;cursor:pointer}.mc-file-upload .dropzone,.mc-file-upload .file-item{display:flex;align-items:center}.mc-file-upload .dropzone .dropzone__text{margin-left:6px}.mc-file-upload .mc-ellipsis-center{position:relative;display:flex}.mc-file-upload .mc-ellipsis-center .data-text-start{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:pre}.mc-file-upload .mc-ellipsis-center .data-text-end{flex:1 0 auto;overflow:hidden;white-space:pre}\n", "@keyframes mc-progress{0%{background-position:0 0}to{background-position:29px 0}}.mc-progress{position:relative}.mc-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.05) 10px,transparent 10px,transparent 20px,rgba(0,0,0,.05) 20px,rgba(0,0,0,.05) 30px,transparent 30px) repeat;background-size:29px 29px;animation:mc-progress 1s linear infinite}.mc-group{display:flex;flex-direction:row}.mc-group .mc-group_justified>.mc-group-item{width:100%}.mc-group .mc-group-item+.mc-group-item{margin-left:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group{display:flex;flex-direction:column}.mc-vertical-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.mc-vertical-group>.mc-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group .mc-group-item+.mc-group-item{margin-top:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.mc-file-upload{border-radius:var(--mc-file-upload-size-multiple-border-radius, 4px);border-width:var(--mc-file-upload-size-multiple-border-width, 1px);border-style:var(--mc-file-upload-size-multiple-border-style, dashed)}.mc-file-upload.default{min-height:176px;justify-content:center}.mc-file-upload.compact:not(.selected){height:var(--mc-file-upload-size-single-height, 48px);padding-top:var(--mc-file-upload-size-single-vertical-padding, 12px);padding-bottom:var(--mc-file-upload-size-single-vertical-padding, 12px);padding-left:12px}.mc-file-upload .mc-list-option{padding:var(--mc-file-upload-size-multiple-uploaded-item-horizontal-padding, 8px) var(--mc-file-upload-size-multiple-uploaded-item-vertical-padding, 8px)}.mc-file-upload .mc-list-option .mc-icon{margin-right:0}.mc-file-upload .mc-file-upload__grid{min-height:144px}.mc-file-upload .mc-file-multiple-uploaded__header-inner,.mc-file-upload .mc-file-upload__row{display:flex;align-items:center}.mc-file-upload .mc-file-multiple-uploaded__header-inner .mc-file-upload__file,.mc-file-upload .mc-file-upload__row .mc-file-upload__file{width:65%;max-width:65%}.mc-file-upload .mc-file-multiple-uploaded__header-inner .mc-file-upload__size,.mc-file-upload .mc-file-upload__row .mc-file-upload__size{width:64px;min-width:64px;text-align:left;flex-grow:1}.mc-file-upload .mc-file-multiple-uploaded__header-inner .mc-file-upload__file,.mc-file-upload .mc-file-multiple-uploaded__header-inner .mc-file-upload__size,.mc-file-upload .mc-file-multiple-uploaded__header-inner .mc-file-upload__action,.mc-file-upload .mc-file-upload__row .mc-file-upload__file,.mc-file-upload .mc-file-upload__row .mc-file-upload__size,.mc-file-upload .mc-file-upload__row .mc-file-upload__action{padding-left:var(--mc-file-upload-size-multiple-uploaded-item-horizontal-padding, 8px);padding-right:var(--mc-file-upload-size-multiple-uploaded-item-horizontal-padding, 8px)}.mc-file-upload .mc-file-upload__row .mc-file-upload__file{display:flex;align-items:center}.mc-file-upload .mc-file-upload__row .mc-file-upload__file .file-item__text{margin-left:0;width:90%}.mc-file-upload .mc-file-multiple-uploaded__header{border-bottom-width:1px;border-bottom-style:solid}.mc-file-upload .mc-file-multiple-uploaded__header-inner{padding:var(--mc-file-upload-size-multiple-uploaded-item-horizontal-padding, 8px) var(--mc-file-upload-size-multiple-uploaded-item-vertical-padding, 8px);border:2px solid transparent;border-bottom:unset;box-sizing:border-box;height:var(--mc-list-size-item-height, 32px)}.mc-file-upload .btn-upload .dropzone{margin:0;border-top-width:var(--mc-file-upload-size-multiple-border-width, 1px);border-top-style:var(--mc-file-upload-size-multiple-border-style, dashed);padding:4px 12px}.mc-file-upload .file-upload__dropzone{width:100%;height:100%}.mc-hint{display:block}.mc-file-upload__hint{margin-top:var(--mc-form-field-hint-size-margin-top, 4px)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.McProgressSpinner, selector: "mc-progress-spinner", inputs: ["color", "id", "value", "mode", "size"] }, { kind: "component", type: i4.McIcon, selector: "[mc-icon]", inputs: ["color"] }, { kind: "directive", type: i4.McIconCSSStyler, selector: "[mc-icon]" }, { kind: "component", type: i5.McListSelection, selector: "mc-list-selection", inputs: ["disabled", "autoSelect", "noUnselectLast", "horizontal", "tabIndex", "compareWith"], outputs: ["onSelectAll", "onCopy", "selectionChange"], exportAs: ["mcListSelection"] }, { kind: "component", type: i5.McListOption, selector: "mc-list-option", inputs: ["checkboxPosition", "value", "disabled", "showCheckbox", "selected"], exportAs: ["mcListOption"] }, { kind: "directive", type: i6.McHint, selector: "mc-hint", inputs: ["color", "id"] }, { kind: "directive", type: i7.McEllipsisCenterDirective, selector: "[mcEllipsisCenter]", inputs: ["mcEllipsisCenter", "minVisibleLength"] }, { kind: "directive", type: McFileDropDirective, selector: "[mcFileDrop]", outputs: ["filesDropped"], exportAs: ["mcFileDrop"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.McDataSizePipe, name: "mcDataSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McMultipleFileUploadComponent, decorators: [{
+/** @nocollapse */ McMultipleFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McMultipleFileUploadComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ChangeDetectorRef }, { token: MC_FILE_UPLOAD_CONFIGURATION, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ McMultipleFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: McMultipleFileUploadComponent, selector: "mc-multiple-file-upload", inputs: { accept: "accept", disabled: "disabled", errors: "errors", files: "files", size: "size", inputId: "inputId", customValidation: "customValidation" }, outputs: { fileQueueChanged: "fileQueueChanged" }, host: { classAttribute: "mc-multiple-file-upload" }, queries: [{ propertyName: "customFileIcon", first: true, predicate: ["mcFileIcon"], descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<div class=\"mc-file-upload\"\n     mcFileDrop\n     [class.disabled]=\"disabled\"\n     [class.selected]=\"files && files.length\"\n     [ngClass]=\"size\"\n     (filesDropped)=\"onFileDropped($event)\"\n>\n    <ng-container *ngIf=\"!files.length; else fileOutput\">\n        <div class=\"dropzone\">\n            <ng-container  *ngIf=\"size === 'default' else compactCaption\">\n                <i mc-icon=\"mc-upload-to-cloud_64\"></i>\n                <div class=\"dropzone__text\">\n                    <span class=\"multiple__header\">{{ config.title }}</span>\n                    <div>\n                        <span class=\"multiple__caption\">\n                            {{ config.captionText }}\n                            <label class=\"mc-link\"\n                                   [class.mc-focused]=\"hasFocus\"\n                                   [for]=\"inputId\">\n                            {{ config.browseLink }}\n                        </label>\n                        </span>\n                    </div>\n                </div>\n            </ng-container>\n        </div>\n\n\n    </ng-container>\n    <input #input\n           type=\"file\"\n           class=\"cdk-visually-hidden\"\n           multiple\n           [id]=\"inputId\"\n           [accept]=\"acceptedFiles\"\n           [disabled]=\"disabled\"\n           (change)=\"onFileSelectedViaClick($event)\"\n    >\n</div>\n\n<div class=\"mc-file-upload__info-section\">\n    <mc-hint class=\"mc-file-upload__hint\">\n        <ng-content select=\"[hint]\"></ng-content>\n    </mc-hint>\n\n    <ng-container *ngIf=\"hasErrors\">\n        <mc-hint class=\"mc-file-upload__hint mc-error\"\n                 *ngFor=\"let error of errors\">\n                {{ error }}\n        </mc-hint>\n    </ng-container>\n</div>\n\n<ng-template #fileOutput>\n    <div class=\"file-upload__dropzone\">\n        <div class=\"mc-file-upload__grid\">\n            <div class=\"mc-file-multiple-uploaded__header\">\n                <div class=\"mc-file-multiple-uploaded__header-inner\">\n                    <div [class]=\"'mc-file-upload__' + column.cssClass\" *ngFor=\"let column of columnDefs\">\n                        {{ column.header }}\n                    </div>\n                </div>\n            </div>\n\n            <mc-list-selection [autoSelect]=\"false\" [disabled]=\"disabled\">\n                <mc-list-option\n                    class=\"multiple__uploaded-item\"\n                    [value]=\"file.file.name\"\n                    (keydown.delete)=\"deleteFile(index)\"\n                    (keydown.backspace)=\"deleteFile(index)\"\n                    *ngFor=\"let file of files; let index = index;\">\n                    <div class=\"mc-file-upload__row\" [class.error]=\"file.hasError\">\n                        <div class=\"mc-file-upload__file\">\n                            <ng-container *ngIf=\"{ loading: file.loading | async, progress: file.progress | async } as asyncData\">\n                                <ng-container *ngIf=\"!asyncData.loading\"\n                                              [ngTemplateOutlet]=\"customFileIcon\"\n                                              [ngTemplateOutletContext]=\"{ $implicit: file }\"\n                                >\n                                </ng-container>\n\n                                <mc-progress-spinner\n                                    class=\"pt-nat-file-upload-name-cell__icon\"\n                                    [value]=\"asyncData.progress || 0\"\n                                    *ngIf=\"asyncData.loading\"\n                                ></mc-progress-spinner>\n                            </ng-container>\n\n                            <span class=\"file-item__text\" [mcEllipsisCenter]=\"file.file.name\" [minVisibleLength]=\"10\"></span>\n                        </div>\n                        <div class=\"mc-file-upload__size\">\n                            {{ file.file.size | mcDataSize }}\n                        </div>\n                        <div class=\"mc-file-upload__action\">\n                            <i mc-icon=\"mc-close-circle_16\" (click)=\"deleteFile(index, $event)\"></i>\n                        </div>\n                    </div>\n                </mc-list-option>\n            </mc-list-selection>\n        </div>\n\n        <div class=\"btn-upload\">\n            <div class=\"dropzone\">\n                <i mc-icon=\"mc-upload-to-cloud_24\"></i>\n                <span class=\"dropzone__text multiple__caption\">\n                    {{ config.captionTextWhenSelected }}\n                    <label class=\"mc-link\"\n                           [class.mc-focused]=\"hasFocus\"\n                           [for]=\"inputId\">\n                        {{ config.browseLink }}\n                    </label>\n                </span>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template #compactCaption>\n    <i mc-icon=\"mc-upload-to-cloud_24\"></i>\n    <span class=\"dropzone__text multiple__caption\">\n        {{ config.captionText }}\n        <label class=\"mc-link\"\n               [class.mc-focused]=\"hasFocus\"\n               [for]=\"inputId\">\n        {{ config.browseLink }}\n    </label>\n    </span>\n</ng-template>\n", styles: ["@keyframes mc-progress{0%{background-position:0 0}to{background-position:29px 0}}.mc-progress{position:relative}.mc-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.05) 10px,transparent 10px,transparent 20px,rgba(0,0,0,.05) 20px,rgba(0,0,0,.05) 30px,transparent 30px) repeat;background-size:29px 29px;animation:mc-progress 1s linear infinite}.mc-group{display:flex;flex-direction:row}.mc-group .mc-group_justified>.mc-group-item{width:100%}.mc-group .mc-group-item+.mc-group-item{margin-left:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group{display:flex;flex-direction:column}.mc-vertical-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.mc-vertical-group>.mc-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group .mc-group-item+.mc-group-item{margin-top:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.mc-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative;cursor:pointer}.mc-file-upload .dropzone,.mc-file-upload .file-item{display:flex;align-items:center}.mc-file-upload .dropzone .dropzone__text{margin-left:6px}.mc-file-upload .mc-ellipsis-center{position:relative;display:flex}.mc-file-upload .mc-ellipsis-center .data-text-start{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:pre}.mc-file-upload .mc-ellipsis-center .data-text-end{flex:1 0 auto;overflow:hidden;white-space:pre}\n", "@keyframes mc-progress{0%{background-position:0 0}to{background-position:29px 0}}.mc-progress{position:relative}.mc-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.05) 10px,transparent 10px,transparent 20px,rgba(0,0,0,.05) 20px,rgba(0,0,0,.05) 30px,transparent 30px) repeat;background-size:29px 29px;animation:mc-progress 1s linear infinite}.mc-group{display:flex;flex-direction:row}.mc-group .mc-group_justified>.mc-group-item{width:100%}.mc-group .mc-group-item+.mc-group-item{margin-left:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group{display:flex;flex-direction:column}.mc-vertical-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.mc-vertical-group>.mc-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group .mc-group-item+.mc-group-item{margin-top:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.mc-file-upload{border-radius:var(--mc-file-upload-size-multiple-border-radius, 4px);border-width:var(--mc-file-upload-size-multiple-border-width, 1px);border-style:var(--mc-file-upload-size-multiple-border-style, dashed)}.mc-file-upload.default{min-height:176px;justify-content:center}.mc-file-upload.compact:not(.selected){height:var(--mc-file-upload-size-single-height, 48px);padding-top:var(--mc-file-upload-size-single-vertical-padding, 12px);padding-bottom:var(--mc-file-upload-size-single-vertical-padding, 12px);padding-left:12px}.mc-file-upload .mc-list-option{padding:var(--mc-file-upload-size-multiple-uploaded-item-horizontal-padding, 8px) var(--mc-file-upload-size-multiple-uploaded-item-vertical-padding, 8px)}.mc-file-upload .mc-list-option .mc-icon{margin-right:0}.mc-file-upload .mc-file-upload__grid{min-height:144px}.mc-file-upload .mc-file-multiple-uploaded__header-inner,.mc-file-upload .mc-file-upload__row{display:flex;align-items:center}.mc-file-upload .mc-file-multiple-uploaded__header-inner .mc-file-upload__file,.mc-file-upload .mc-file-upload__row .mc-file-upload__file{width:65%;max-width:65%}.mc-file-upload .mc-file-multiple-uploaded__header-inner .mc-file-upload__size,.mc-file-upload .mc-file-upload__row .mc-file-upload__size{width:64px;min-width:64px;text-align:left;flex-grow:1}.mc-file-upload .mc-file-multiple-uploaded__header-inner .mc-file-upload__file,.mc-file-upload .mc-file-multiple-uploaded__header-inner .mc-file-upload__size,.mc-file-upload .mc-file-multiple-uploaded__header-inner .mc-file-upload__action,.mc-file-upload .mc-file-upload__row .mc-file-upload__file,.mc-file-upload .mc-file-upload__row .mc-file-upload__size,.mc-file-upload .mc-file-upload__row .mc-file-upload__action{padding-left:var(--mc-file-upload-size-multiple-uploaded-item-horizontal-padding, 8px);padding-right:var(--mc-file-upload-size-multiple-uploaded-item-horizontal-padding, 8px)}.mc-file-upload .mc-file-upload__row .mc-file-upload__file{display:flex;align-items:center}.mc-file-upload .mc-file-upload__row .mc-file-upload__file .file-item__text{margin-left:0;width:90%}.mc-file-upload .mc-file-multiple-uploaded__header{border-bottom-width:1px;border-bottom-style:solid}.mc-file-upload .mc-file-multiple-uploaded__header-inner{padding:var(--mc-file-upload-size-multiple-uploaded-item-horizontal-padding, 8px) var(--mc-file-upload-size-multiple-uploaded-item-vertical-padding, 8px);border:2px solid transparent;border-bottom:unset;box-sizing:border-box;height:var(--mc-list-size-item-height, 32px)}.mc-file-upload .btn-upload .dropzone{margin:0;border-top-width:var(--mc-file-upload-size-multiple-border-width, 1px);border-top-style:var(--mc-file-upload-size-multiple-border-style, dashed);padding:4px 12px}.mc-file-upload .file-upload__dropzone{width:100%;height:100%}.mc-hint{display:block}.mc-file-upload__hint{margin-top:var(--mc-form-field-hint-size-margin-top, 4px)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.McProgressSpinner, selector: "mc-progress-spinner", inputs: ["color", "id", "value", "mode", "size"] }, { kind: "component", type: i4.McIcon, selector: "[mc-icon]", inputs: ["color"] }, { kind: "directive", type: i4.McIconCSSStyler, selector: "[mc-icon]" }, { kind: "component", type: i5.McListSelection, selector: "mc-list-selection", inputs: ["disabled", "autoSelect", "noUnselectLast", "horizontal", "tabIndex", "compareWith"], outputs: ["onSelectAll", "onCopy", "selectionChange"], exportAs: ["mcListSelection"] }, { kind: "component", type: i5.McListOption, selector: "mc-list-option", inputs: ["checkboxPosition", "value", "disabled", "showCheckbox", "selected"], exportAs: ["mcListOption"] }, { kind: "directive", type: i6.McHint, selector: "mc-hint", inputs: ["color", "id"] }, { kind: "directive", type: i7.McEllipsisCenterDirective, selector: "[mcEllipsisCenter]", inputs: ["mcEllipsisCenter", "minVisibleLength"] }, { kind: "directive", type: McFileDropDirective, selector: "[mcFileDrop]", outputs: ["filesDropped"], exportAs: ["mcFileDrop"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.McDataSizePipe, name: "mcDataSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McMultipleFileUploadComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mc-multiple-file-upload', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'mc-multiple-file-upload'
@@ -299,9 +299,9 @@ class McSingleFileUploadComponent {
         return this.acceptedFiles !== '*/*' && this.acceptedFiles.length > 0 ? this.acceptedFiles.includes(fileExt) : true;
     }
 }
-/** @nocollapse */ McSingleFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McSingleFileUploadComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ChangeDetectorRef }, { token: MC_FILE_UPLOAD_CONFIGURATION, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ McSingleFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.2", type: McSingleFileUploadComponent, selector: "mc-single-file-upload", inputs: { accept: "accept", disabled: "disabled", errors: "errors", files: "files", inputId: "inputId", customValidation: "customValidation" }, outputs: { fileQueueChanged: "fileQueueChanged" }, host: { classAttribute: "mc-single-file-upload" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<div class=\"mc-file-upload\"\n     mcFileDrop\n     [class.disabled]=\"disabled\"\n     [class.mc-error]=\"errors && errors.length\"\n     (filesDropped)=\"onFileDropped($event)\">\n        <div class=\"dropzone\" *ngIf=\"!files.length; else fileOutput\">\n            <i mc-icon=\"mc-upload-to-cloud_24\"></i>\n            <span class=\"dropzone__text\">\n                {{ config.captionText }}\n                <label class=\"mc-link\"\n                       [class.mc-focused]=\"hasFocus\"\n                       [for]=\"inputId\">\n                {{ config.browseLink }}\n                </label>\n            </span>\n        </div>\n    <input #input\n           type=\"file\"\n           class=\"cdk-visually-hidden\"\n           [id]=\"inputId\"\n           [accept]=\"acceptedFiles\"\n           [disabled]=\"disabled\"\n           (change)=\"onFileSelectedViaClick($event)\"\n    >\n</div>\n<mc-hint class=\"mc-file-upload__hint\">\n    <ng-content select=\"[hint]\"></ng-content>\n</mc-hint>\n<ng-container *ngIf=\"errors && errors.length\">\n    <mc-hint class=\"mc-file-upload__hint mc-error\" *ngFor=\"let error of errors\">{{ error }}</mc-hint>\n</ng-container>\n\n\n<ng-template #fileOutput>\n    <div class=\"file-item\" *ngIf=\"files && files.length\">\n        <div class=\"file-item__text-wrapper\">\n            <ng-container *ngIf=\"{ loading: files[0].loading | async, progress: files[0].progress | async} as asyncData\">\n                <ng-container *ngIf=\"!asyncData.loading\">\n                    <ng-content select=\"[mc-icon]\"></ng-content>\n                </ng-container>\n\n                <mc-progress-spinner\n                    [value]=\"asyncData.progress || 0\"\n                    *ngIf=\"asyncData.loading\"\n                ></mc-progress-spinner>\n            </ng-container>\n\n            <div class=\"file-item__text\" [mcEllipsisCenter]=\"files[0].file.name\" [minVisibleLength]=\"10\"></div>\n        </div>\n        <button mc-button\n                class=\"mc-button_transparent\"\n                [disabled]=\"disabled\"\n                (keydown.delete)=\"deleteItem()\"\n                (keydown.backspace)=\"deleteItem()\"\n                (click)=\"deleteItem($event)\">\n            <i mc-icon=\"mc-close-circle_16\"></i>\n        </button>\n    </div>\n</ng-template>\n", styles: ["@keyframes mc-progress{0%{background-position:0 0}to{background-position:29px 0}}.mc-progress{position:relative}.mc-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.05) 10px,transparent 10px,transparent 20px,rgba(0,0,0,.05) 20px,rgba(0,0,0,.05) 30px,transparent 30px) repeat;background-size:29px 29px;animation:mc-progress 1s linear infinite}.mc-group{display:flex;flex-direction:row}.mc-group .mc-group_justified>.mc-group-item{width:100%}.mc-group .mc-group-item+.mc-group-item{margin-left:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group{display:flex;flex-direction:column}.mc-vertical-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.mc-vertical-group>.mc-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group .mc-group-item+.mc-group-item{margin-top:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.mc-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative;cursor:pointer}.mc-file-upload .dropzone,.mc-file-upload .file-item{display:flex;align-items:center}.mc-file-upload .dropzone .dropzone__text{margin-left:6px}.mc-file-upload .mc-ellipsis-center{position:relative;display:flex}.mc-file-upload .mc-ellipsis-center .data-text-start{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:pre}.mc-file-upload .mc-ellipsis-center .data-text-end{flex:1 0 auto;overflow:hidden;white-space:pre}\n", "@keyframes mc-progress{0%{background-position:0 0}to{background-position:29px 0}}.mc-progress{position:relative}.mc-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.05) 10px,transparent 10px,transparent 20px,rgba(0,0,0,.05) 20px,rgba(0,0,0,.05) 30px,transparent 30px) repeat;background-size:29px 29px;animation:mc-progress 1s linear infinite}.mc-group{display:flex;flex-direction:row}.mc-group .mc-group_justified>.mc-group-item{width:100%}.mc-group .mc-group-item+.mc-group-item{margin-left:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group{display:flex;flex-direction:column}.mc-vertical-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.mc-vertical-group>.mc-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group .mc-group-item+.mc-group-item{margin-top:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.mc-file-upload{height:var(--mc-file-upload-size-single-height, 48px);padding-top:var(--mc-file-upload-size-single-vertical-padding, 12px);padding-bottom:var(--mc-file-upload-size-single-vertical-padding, 12px);padding-left:12px;border-radius:var(--mc-file-upload-size-single-border-radius, 4px);border-width:var(--mc-file-upload-size-single-border-width, 1px);border-style:var(--mc-file-upload-size-single-border-style, dashed)}.mc-file-upload .file-item{width:100%}.mc-file-upload .file-item .file-item__text-wrapper{display:flex;align-items:center;width:100%}.mc-file-upload .file-item .file-item__text-wrapper .file-item__text{margin-left:8px;width:120px;flex-grow:1}.mc-hint{display:block}.mc-file-upload__hint{margin-top:var(--mc-form-field-hint-size-margin-top, 4px)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.McProgressSpinner, selector: "mc-progress-spinner", inputs: ["color", "id", "value", "mode", "size"] }, { kind: "component", type: i4.McIcon, selector: "[mc-icon]", inputs: ["color"] }, { kind: "directive", type: i4.McIconCSSStyler, selector: "[mc-icon]" }, { kind: "component", type: i5$1.McButton, selector: "[mc-button]", inputs: ["color", "tabIndex", "disabled"] }, { kind: "directive", type: i5$1.McButtonCssStyler, selector: "[mc-button]" }, { kind: "directive", type: i6.McHint, selector: "mc-hint", inputs: ["color", "id"] }, { kind: "directive", type: i7.McEllipsisCenterDirective, selector: "[mcEllipsisCenter]", inputs: ["mcEllipsisCenter", "minVisibleLength"] }, { kind: "directive", type: McFileDropDirective, selector: "[mcFileDrop]", outputs: ["filesDropped"], exportAs: ["mcFileDrop"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McSingleFileUploadComponent, decorators: [{
+/** @nocollapse */ McSingleFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McSingleFileUploadComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ChangeDetectorRef }, { token: MC_FILE_UPLOAD_CONFIGURATION, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ McSingleFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: McSingleFileUploadComponent, selector: "mc-single-file-upload", inputs: { accept: "accept", disabled: "disabled", errors: "errors", files: "files", inputId: "inputId", customValidation: "customValidation" }, outputs: { fileQueueChanged: "fileQueueChanged" }, host: { classAttribute: "mc-single-file-upload" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<div class=\"mc-file-upload\"\n     mcFileDrop\n     [class.disabled]=\"disabled\"\n     [class.mc-error]=\"errors && errors.length\"\n     (filesDropped)=\"onFileDropped($event)\">\n        <div class=\"dropzone\" *ngIf=\"!files.length; else fileOutput\">\n            <i mc-icon=\"mc-upload-to-cloud_24\"></i>\n            <span class=\"dropzone__text\">\n                {{ config.captionText }}\n                <label class=\"mc-link\"\n                       [class.mc-focused]=\"hasFocus\"\n                       [for]=\"inputId\">\n                {{ config.browseLink }}\n                </label>\n            </span>\n        </div>\n    <input #input\n           type=\"file\"\n           class=\"cdk-visually-hidden\"\n           [id]=\"inputId\"\n           [accept]=\"acceptedFiles\"\n           [disabled]=\"disabled\"\n           (change)=\"onFileSelectedViaClick($event)\"\n    >\n</div>\n<mc-hint class=\"mc-file-upload__hint\">\n    <ng-content select=\"[hint]\"></ng-content>\n</mc-hint>\n<ng-container *ngIf=\"errors && errors.length\">\n    <mc-hint class=\"mc-file-upload__hint mc-error\" *ngFor=\"let error of errors\">{{ error }}</mc-hint>\n</ng-container>\n\n\n<ng-template #fileOutput>\n    <div class=\"file-item\" *ngIf=\"files && files.length\">\n        <div class=\"file-item__text-wrapper\">\n            <ng-container *ngIf=\"{ loading: files[0].loading | async, progress: files[0].progress | async} as asyncData\">\n                <ng-container *ngIf=\"!asyncData.loading\">\n                    <ng-content select=\"[mc-icon]\"></ng-content>\n                </ng-container>\n\n                <mc-progress-spinner\n                    [value]=\"asyncData.progress || 0\"\n                    *ngIf=\"asyncData.loading\"\n                ></mc-progress-spinner>\n            </ng-container>\n\n            <div class=\"file-item__text\" [mcEllipsisCenter]=\"files[0].file.name\" [minVisibleLength]=\"10\"></div>\n        </div>\n        <button mc-button\n                class=\"mc-button_transparent\"\n                [disabled]=\"disabled\"\n                (keydown.delete)=\"deleteItem()\"\n                (keydown.backspace)=\"deleteItem()\"\n                (click)=\"deleteItem($event)\">\n            <i mc-icon=\"mc-close-circle_16\"></i>\n        </button>\n    </div>\n</ng-template>\n", styles: ["@keyframes mc-progress{0%{background-position:0 0}to{background-position:29px 0}}.mc-progress{position:relative}.mc-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.05) 10px,transparent 10px,transparent 20px,rgba(0,0,0,.05) 20px,rgba(0,0,0,.05) 30px,transparent 30px) repeat;background-size:29px 29px;animation:mc-progress 1s linear infinite}.mc-group{display:flex;flex-direction:row}.mc-group .mc-group_justified>.mc-group-item{width:100%}.mc-group .mc-group-item+.mc-group-item{margin-left:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group{display:flex;flex-direction:column}.mc-vertical-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.mc-vertical-group>.mc-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group .mc-group-item+.mc-group-item{margin-top:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.mc-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative;cursor:pointer}.mc-file-upload .dropzone,.mc-file-upload .file-item{display:flex;align-items:center}.mc-file-upload .dropzone .dropzone__text{margin-left:6px}.mc-file-upload .mc-ellipsis-center{position:relative;display:flex}.mc-file-upload .mc-ellipsis-center .data-text-start{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:pre}.mc-file-upload .mc-ellipsis-center .data-text-end{flex:1 0 auto;overflow:hidden;white-space:pre}\n", "@keyframes mc-progress{0%{background-position:0 0}to{background-position:29px 0}}.mc-progress{position:relative}.mc-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.05) 10px,transparent 10px,transparent 20px,rgba(0,0,0,.05) 20px,rgba(0,0,0,.05) 30px,transparent 30px) repeat;background-size:29px 29px;animation:mc-progress 1s linear infinite}.mc-group{display:flex;flex-direction:row}.mc-group .mc-group_justified>.mc-group-item{width:100%}.mc-group .mc-group-item+.mc-group-item{margin-left:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group{display:flex;flex-direction:column}.mc-vertical-group>.mc-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:first-child:not(:last-child)>.mc-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.mc-vertical-group>.mc-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--mc-button-size-border-radius, 4px)}.mc-vertical-group>.mc-group-item:last-child:not(:first-child)>.mc-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child){border-radius:0}.mc-vertical-group>.mc-group-item:not(:first-child):not(:last-child)>.mc-form-field__container{border-radius:0}.mc-vertical-group .mc-group-item+.mc-group-item{margin-top:calc(-1 * var(--mc-button-size-border-width, 1px))}.mc-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.mc-file-upload{height:var(--mc-file-upload-size-single-height, 48px);padding-top:var(--mc-file-upload-size-single-vertical-padding, 12px);padding-bottom:var(--mc-file-upload-size-single-vertical-padding, 12px);padding-left:12px;border-radius:var(--mc-file-upload-size-single-border-radius, 4px);border-width:var(--mc-file-upload-size-single-border-width, 1px);border-style:var(--mc-file-upload-size-single-border-style, dashed)}.mc-file-upload .file-item{width:100%}.mc-file-upload .file-item .file-item__text-wrapper{display:flex;align-items:center;width:100%}.mc-file-upload .file-item .file-item__text-wrapper .file-item__text{margin-left:8px;width:120px;flex-grow:1}.mc-hint{display:block}.mc-file-upload__hint{margin-top:var(--mc-form-field-hint-size-margin-top, 4px)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.McProgressSpinner, selector: "mc-progress-spinner", inputs: ["color", "id", "value", "mode", "size"] }, { kind: "component", type: i4.McIcon, selector: "[mc-icon]", inputs: ["color"] }, { kind: "directive", type: i4.McIconCSSStyler, selector: "[mc-icon]" }, { kind: "component", type: i5$1.McButton, selector: "[mc-button]", inputs: ["color", "tabIndex", "disabled"] }, { kind: "directive", type: i5$1.McButtonCssStyler, selector: "[mc-button]" }, { kind: "directive", type: i6.McHint, selector: "mc-hint", inputs: ["color", "id"] }, { kind: "directive", type: i7.McEllipsisCenterDirective, selector: "[mcEllipsisCenter]", inputs: ["mcEllipsisCenter", "minVisibleLength"] }, { kind: "directive", type: McFileDropDirective, selector: "[mcFileDrop]", outputs: ["filesDropped"], exportAs: ["mcFileDrop"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McSingleFileUploadComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mc-single-file-upload', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'mc-single-file-upload'
@@ -334,8 +334,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImpor
 
 class McFileUploadModule {
 }
-/** @nocollapse */ McFileUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFileUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ McFileUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.2", ngImport: i0, type: McFileUploadModule, declarations: [McFileDropDirective,
+/** @nocollapse */ McFileUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFileUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ McFileUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: McFileUploadModule, declarations: [McFileDropDirective,
         McSingleFileUploadComponent,
         McMultipleFileUploadComponent], imports: [CommonModule,
         McToolTipModule,
@@ -348,7 +348,7 @@ class McFileUploadModule {
         McDataSizeModule], exports: [McSingleFileUploadComponent,
         McMultipleFileUploadComponent,
         McFileDropDirective] });
-/** @nocollapse */ McFileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFileUploadModule, imports: [CommonModule,
+/** @nocollapse */ McFileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFileUploadModule, imports: [CommonModule,
         McToolTipModule,
         McProgressSpinnerModule,
         McIconModule,
@@ -357,7 +357,7 @@ class McFileUploadModule {
         McFormFieldModule,
         McEllipsisCenterModule,
         McDataSizeModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFileUploadModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFileUploadModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2015/ptsecurity-mosaic-form-field.mjs

@@ -18,9 +18,9 @@ class McCleaner {
         this.themePalette = ThemePalette;
     }
 }
-/** @nocollapse */ McCleaner.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McCleaner, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ McCleaner.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.2", type: McCleaner, selector: "mc-cleaner", host: { classAttribute: "mc-cleaner" }, exportAs: ["mcCleaner"], ngImport: i0, template: `<i class="mc-icon_light" mc-icon="mc-close-circle_16" [color]="themePalette.Secondary"></i>`, isInline: true, dependencies: [{ kind: "component", type: i1.McIcon, selector: "[mc-icon]", inputs: ["color"] }, { kind: "directive", type: i1.McIconCSSStyler, selector: "[mc-icon]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McCleaner, decorators: [{
+/** @nocollapse */ McCleaner.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McCleaner, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ McCleaner.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: McCleaner, selector: "mc-cleaner", host: { classAttribute: "mc-cleaner" }, exportAs: ["mcCleaner"], ngImport: i0, template: `<i class="mc-icon_light" mc-icon="mc-close-circle_16" [color]="themePalette.Secondary"></i>`, isInline: true, dependencies: [{ kind: "component", type: i1.McIcon, selector: "[mc-icon]", inputs: ["color"] }, { kind: "directive", type: i1.McIconCSSStyler, selector: "[mc-icon]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McCleaner, decorators: [{
             type: Component,
             args: [{
                     selector: 'mc-cleaner',
@@ -59,9 +59,9 @@ class McHint extends McHintMixinBase {
         this.id = `mc-hint-${nextHintUniqueId++}`;
     }
 }
-/** @nocollapse */ McHint.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McHint, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ McHint.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.2", type: McHint, selector: "mc-hint", inputs: { color: "color", id: "id" }, host: { properties: { "attr.id": "id" }, classAttribute: "mc-hint" }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McHint, decorators: [{
+/** @nocollapse */ McHint.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McHint, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ McHint.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: McHint, selector: "mc-hint", inputs: { color: "color", id: "id" }, host: { properties: { "attr.id": "id" }, classAttribute: "mc-hint" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McHint, decorators: [{
             type: Directive,
             args: [{
                     selector: 'mc-hint',
@@ -166,8 +166,8 @@ class McPasswordHint {
         return this.lastControlValue !== this.formField.control.value;
     }
 }
-/** @nocollapse */ McPasswordHint.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McPasswordHint, deps: [{ token: i0.ChangeDetectorRef }, { token: forwardRef(() => MC_FORM_FIELD) }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ McPasswordHint.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.2", type: McPasswordHint, selector: "mc-password-hint", inputs: { id: "id", rule: "rule", min: "min", max: "max", regex: "regex" }, host: { properties: { "class.mc-password-hint_valid": "checked", "class.mc-password-hint_invalid": "hasError", "attr.id": "id" }, classAttribute: "mc-password-hint" }, ngImport: i0, template: `
+/** @nocollapse */ McPasswordHint.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McPasswordHint, deps: [{ token: i0.ChangeDetectorRef }, { token: forwardRef(() => MC_FORM_FIELD) }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ McPasswordHint.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: McPasswordHint, selector: "mc-password-hint", inputs: { id: "id", rule: "rule", min: "min", max: "max", regex: "regex" }, host: { properties: { "class.mc-password-hint_valid": "checked", "class.mc-password-hint_invalid": "hasError", "attr.id": "id" }, classAttribute: "mc-password-hint" }, ngImport: i0, template: `
         <i *ngIf="!checked" class="mc-password-hint__icon" mc-icon="mc-close-M_16"></i>
         <i *ngIf="checked" class="mc-password-hint__icon" mc-icon="mc-check_16"></i>
 
@@ -175,7 +175,7 @@ class McPasswordHint {
             <ng-content></ng-content>
         </span>
     `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.McIcon, selector: "[mc-icon]", inputs: ["color"] }, { kind: "directive", type: i1.McIconCSSStyler, selector: "[mc-icon]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McPasswordHint, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McPasswordHint, decorators: [{
             type: Component,
             args: [{
                     selector: 'mc-password-hint',
@@ -214,9 +214,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImpor
 
 class McPrefix {
 }
-/** @nocollapse */ McPrefix.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McPrefix, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ McPrefix.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.2", type: McPrefix, selector: "[mcPrefix]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McPrefix, decorators: [{
+/** @nocollapse */ McPrefix.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McPrefix, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ McPrefix.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: McPrefix, selector: "[mcPrefix]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McPrefix, decorators: [{
             type: Directive,
             args: [{
                     selector: '[mcPrefix]'
@@ -248,8 +248,8 @@ class McStepper {
         $event.preventDefault();
     }
 }
-/** @nocollapse */ McStepper.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McStepper, deps: [], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ McStepper.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.2", type: McStepper, selector: "mc-stepper", outputs: { stepUp: "stepUp", stepDown: "stepDown" }, ngImport: i0, template: `
+/** @nocollapse */ McStepper.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McStepper, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ McStepper.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: McStepper, selector: "mc-stepper", outputs: { stepUp: "stepUp", stepDown: "stepDown" }, ngImport: i0, template: `
         <i class="mc mc-icon mc-icon_light mc-secondary mc-stepper-step-up mc-angle-down-L_16"
            (mousedown)="onStepUp($event)">
         </i>
@@ -257,7 +257,7 @@ class McStepper {
            (mousedown)="onStepDown($event)">
         </i>
     `, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McStepper, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McStepper, decorators: [{
             type: Component,
             args: [{
                     selector: 'mc-stepper',
@@ -278,9 +278,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImpor
 
 class McSuffix {
 }
-/** @nocollapse */ McSuffix.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McSuffix, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ McSuffix.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.2", type: McSuffix, selector: "[mcSuffix]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McSuffix, decorators: [{
+/** @nocollapse */ McSuffix.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McSuffix, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ McSuffix.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: McSuffix, selector: "[mcSuffix]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McSuffix, decorators: [{
             type: Directive,
             args: [{
                     selector: '[mcSuffix]'
@@ -450,9 +450,9 @@ class McFormField extends McFormFieldMixinBase {
         }
     }
 }
-/** @nocollapse */ McFormField.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFormField, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ McFormField.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.2", type: McFormField, selector: "mc-form-field", inputs: { color: "color" }, host: { listeners: { "keydown": "onKeyDown($event)", "mouseenter": "onHoverChanged(true)", "mouseleave": "onHoverChanged(false)" }, properties: { "class.mc-form-field_invalid": "control.errorState", "class.mc-form-field_has-prefix": "hasPrefix", "class.mc-form-field_has-suffix": "hasSuffix", "class.mc-form-field_has-cleaner": "canShowCleaner", "class.mc-form-field_has-stepper": "canShowStepper", "class.mc-disabled": "control.disabled", "class.ng-untouched": "shouldForward(\"untouched\")", "class.ng-touched": "shouldForward(\"touched\")", "class.ng-pristine": "shouldForward(\"pristine\")", "class.ng-dirty": "shouldForward(\"dirty\")", "class.ng-valid": "shouldForward(\"valid\")", "class.ng-invalid": "shouldForward(\"invalid\")", "class.ng-pending": "shouldForward(\"pending\")" }, classAttribute: "mc-form-field" }, providers: [{ provide: MC_FORM_FIELD, useExisting: McFormField }], queries: [{ propertyName: "control", first: true, predicate: McFormFieldControl, descendants: true }, { propertyName: "stepper", first: true, predicate: McStepper, descendants: true }, { propertyName: "cleaner", first: true, predicate: McCleaner, descendants: true }, { propertyName: "hint", predicate: McHint }, { propertyName: "passwordHints", predicate: McPasswordHint }, { propertyName: "suffix", predicate: McSuffix }, { propertyName: "prefix", predicate: McPrefix }], viewQueries: [{ propertyName: "connectionContainerRef", first: true, predicate: ["connectionContainer"], descendants: true, static: true }], exportAs: ["mcFormField"], usesInheritance: true, ngImport: i0, template: "<div class=\"mc-form-field__container\" (click)=\"onContainerClick($event)\">\n\n    <div class=\"mc-form-field__prefix\" *ngIf=\"hasPrefix\">\n        <ng-content select=\"[mcPrefix]\"></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__infix\">\n        <ng-content></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__suffix\" *ngIf=\"hasSuffix\">\n        <ng-content select=\"[mcSuffix]\"></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__cleaner\"\n         *ngIf=\"canShowCleaner && !hasSuffix\"\n         (click)=\"clearValue($event)\">\n        <ng-content select=\"mc-cleaner\"></ng-content>\n    </div>\n\n    <ng-content select=\"mc-password-toggle\"></ng-content>\n\n    <ng-content *ngIf=\"canShowStepper\" select=\"mc-stepper\"></ng-content>\n</div>\n\n<div class=\"mc-form-field__hint\">\n    <ng-content select=\"mc-hint, mc-password-hint\"></ng-content>\n</div>\n", styles: [".mc-form{display:flex;flex-direction:column}.mc-form__row{display:flex;flex-direction:row}.mc-form-horizontal .mc-form-row_margin{margin-bottom:var(--mc-forms-size-horizontal-row-margin-bottom, 20px)}.mc-form-horizontal .mc-form__label{padding-top:var(--mc-forms-size-horizontal-label-padding-top, 6px);text-align:start}.mc-form-horizontal .mc-form__control{padding-left:var(--mc-forms-size-horizontal-control-padding-left, 16px)}.mc-form-horizontal .mc-form__legend{margin-top:var(--mc-forms-size-horizontal-legend-margin-top, 32px);margin-bottom:var(--mc-forms-size-horizontal-legend-margin-bottom, 16px)}.mc-form-vertical .mc-form__row{flex-direction:column}.mc-form-vertical .mc-form-row_margin{margin-bottom:var(--mc-forms-size-vertical-row-margin-bottom, 16px)}.mc-form-vertical .mc-form__label{padding-top:var(--mc-forms-size-vertical-label-padding-top, 0);padding-bottom:var(--mc-forms-size-vertical-label-padding-bottom, 4px);text-align:start}.mc-form-vertical .mc-form__control{padding-left:0}.mc-form-vertical .mc-form__legend{margin-top:var(--mc-forms-size-vertical-legend-margin-top, 32px);margin-bottom:var(--mc-forms-size-vertical-legend-margin-bottom, 12px)}.mc-form__fieldset{display:flex;flex-direction:column}.mc-form__fieldset.mc-horizontal{flex-direction:row}.mc-form__fieldset.mc-horizontal .mc-form__row:not(:first-child){padding-left:var(--mc-forms-size-vertical-control-padding-left, 24px)}.mc-form-field{position:relative;display:inline-block;width:100%}.mc-form-field,.mc-form-field .mc-input{border-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-form-field:hover{z-index:1}.mc-form-field.mc-focused{z-index:2}.mc-form-field-type-input-password .mc-input{padding-right:var(--mc-form-field-size-button-width, 32px)}.mc-hint{display:block}.mc-password-hint{display:block;padding-left:calc(16px + var(--mc-form-field-password-hint-size-icon-margin, 4px))}.mc-password-hint .mc-icon{position:absolute;left:0}.mc-form-field__hint>.mc-password-hint{margin-top:var(--mc-form-field-password-hint-size-margin-top, 8px)}.mc-form-field__hint>.mc-hint{margin-top:var(--mc-form-field-hint-size-margin-top, 4px)}.mc-form-field__container{position:relative;border-width:var(--mc-form-field-size-border-width, 1px);border-style:solid;border-color:transparent;border-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-form-field_without-borders .mc-form-field__container{border-color:transparent}.mc-form-field__prefix,.mc-form-field__suffix{position:absolute;top:0;bottom:0;width:32px;display:flex;flex-direction:row;justify-content:center;align-items:center}.mc-form-field__prefix{left:0}.mc-form-field__suffix{right:0}.mc-form-field_has-suffix .mc-input,.mc-form-field_has-cleaner .mc-input,.mc-form-field_has-stepper .mc-input{padding-right:var(--mc-form-field-size-button-width, 32px)}.mc-form-field_has-prefix .mc-input{padding-left:var(--mc-form-field-size-button-width, 32px)}.mc-cleaner{display:flex;width:var(--mc-form-field-size-button-width, 32px);height:100%;cursor:pointer}.mc-cleaner .mc-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.mc-form-field__cleaner .mc-cleaner{position:absolute;top:0;bottom:0;right:0}mc-stepper{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;top:0;bottom:0;right:0;width:var(--mc-form-field-size-button-width, 32px)}mc-stepper .mc-stepper-step-up,mc-stepper .mc-stepper-step-down{cursor:pointer;width:var(--mc-form-field-size-button-width, 32px);text-align:center}mc-stepper .mc-stepper-step-up{transform:scaleY(-1)}\n", ".mc-input{background:transparent;padding:0;margin:0;border:none;outline:none;width:var(--mc-input-size-width, 100%);min-height:calc(var(--mc-form-field-size-height, 32px) - var(--mc-form-field-size-border-width, 1px) * 2);padding:var(--mc-input-size-padding, 0 12px)}.mc-input::-ms-clear{display:none;width:0;height:0}.mc-input::-ms-reveal{display:none;width:0;height:0}.mc-input::-webkit-search-decoration,.mc-input::-webkit-search-cancel-button,.mc-input::-webkit-search-results-button,.mc-input::-webkit-search-results-decoration{display:none}.mc-input{display:inline-block;box-sizing:border-box}input.mc-input[type=number]{-moz-appearance:textfield}input.mc-input[type=number]::-webkit-inner-spin-button,input.mc-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}input.mc-input:invalid{box-shadow:unset}input.mc-input::placeholder{opacity:1}.mc-password-toggle{display:flex;position:absolute;top:-1px;right:-1px;border:1px solid transparent;width:32px;height:32px;align-items:center;justify-content:center;cursor:pointer;border-top-right-radius:var(--mc-form-field-size-border-radius, 4px);border-bottom-right-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-password-toggle::-moz-focus-inner{border:0}.mc-password-toggle:focus{outline:none}\n", ".mc-timepicker{padding-right:calc(var(--mc-timepicker-size-padding-right, 16px) - var(--mc-form-field-size-border-width, 1px))}.mc-form-field-type-timepicker{width:auto}\n", ".mc-form-field-type-datepicker{width:auto}.mc-datepicker{width:var(--mc-datepicker-input-size-width, 130px)}\n", ".mc-textarea{background:transparent;margin:0;border:none;outline:none;resize:none;overflow:auto;width:100%;box-sizing:border-box;padding:var(--mc-textarea-size-padding, 5px 12px)}.mc-textarea{display:inline-block;-webkit-appearance:none;vertical-align:bottom}.mc-textarea:not(.mc-textarea-resizable){box-sizing:border-box;overflow-y:hidden}.mc-textarea.mc-textarea-resizable{resize:vertical;min-height:var(--mc-textarea-size-min-height, 50px)}.mc-textarea:invalid{box-shadow:unset}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFormField, decorators: [{
+/** @nocollapse */ McFormField.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFormField, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ McFormField.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: McFormField, selector: "mc-form-field", inputs: { color: "color" }, host: { listeners: { "keydown": "onKeyDown($event)", "mouseenter": "onHoverChanged(true)", "mouseleave": "onHoverChanged(false)" }, properties: { "class.mc-form-field_invalid": "control.errorState", "class.mc-form-field_has-prefix": "hasPrefix", "class.mc-form-field_has-suffix": "hasSuffix", "class.mc-form-field_has-cleaner": "canShowCleaner", "class.mc-form-field_has-stepper": "canShowStepper", "class.mc-disabled": "control.disabled", "class.ng-untouched": "shouldForward(\"untouched\")", "class.ng-touched": "shouldForward(\"touched\")", "class.ng-pristine": "shouldForward(\"pristine\")", "class.ng-dirty": "shouldForward(\"dirty\")", "class.ng-valid": "shouldForward(\"valid\")", "class.ng-invalid": "shouldForward(\"invalid\")", "class.ng-pending": "shouldForward(\"pending\")" }, classAttribute: "mc-form-field" }, providers: [{ provide: MC_FORM_FIELD, useExisting: McFormField }], queries: [{ propertyName: "control", first: true, predicate: McFormFieldControl, descendants: true }, { propertyName: "stepper", first: true, predicate: McStepper, descendants: true }, { propertyName: "cleaner", first: true, predicate: McCleaner, descendants: true }, { propertyName: "hint", predicate: McHint }, { propertyName: "passwordHints", predicate: McPasswordHint }, { propertyName: "suffix", predicate: McSuffix }, { propertyName: "prefix", predicate: McPrefix }], viewQueries: [{ propertyName: "connectionContainerRef", first: true, predicate: ["connectionContainer"], descendants: true, static: true }], exportAs: ["mcFormField"], usesInheritance: true, ngImport: i0, template: "<div class=\"mc-form-field__container\" (click)=\"onContainerClick($event)\">\n\n    <div class=\"mc-form-field__prefix\" *ngIf=\"hasPrefix\">\n        <ng-content select=\"[mcPrefix]\"></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__infix\">\n        <ng-content></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__suffix\" *ngIf=\"hasSuffix\">\n        <ng-content select=\"[mcSuffix]\"></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__cleaner\"\n         *ngIf=\"canShowCleaner && !hasSuffix\"\n         (click)=\"clearValue($event)\">\n        <ng-content select=\"mc-cleaner\"></ng-content>\n    </div>\n\n    <ng-content select=\"mc-password-toggle\"></ng-content>\n\n    <ng-content *ngIf=\"canShowStepper\" select=\"mc-stepper\"></ng-content>\n</div>\n\n<div class=\"mc-form-field__hint\">\n    <ng-content select=\"mc-hint, mc-password-hint\"></ng-content>\n</div>\n", styles: [".mc-form{display:flex;flex-direction:column}.mc-form__row{display:flex;flex-direction:row}.mc-form-horizontal .mc-form-row_margin{margin-bottom:var(--mc-forms-size-horizontal-row-margin-bottom, 20px)}.mc-form-horizontal .mc-form__label{padding-top:var(--mc-forms-size-horizontal-label-padding-top, 6px);text-align:start}.mc-form-horizontal .mc-form__control{padding-left:var(--mc-forms-size-horizontal-control-padding-left, 16px)}.mc-form-horizontal .mc-form__legend{margin-top:var(--mc-forms-size-horizontal-legend-margin-top, 32px);margin-bottom:var(--mc-forms-size-horizontal-legend-margin-bottom, 16px)}.mc-form-vertical .mc-form__row{flex-direction:column}.mc-form-vertical .mc-form-row_margin{margin-bottom:var(--mc-forms-size-vertical-row-margin-bottom, 16px)}.mc-form-vertical .mc-form__label{padding-top:var(--mc-forms-size-vertical-label-padding-top, 0);padding-bottom:var(--mc-forms-size-vertical-label-padding-bottom, 4px);text-align:start}.mc-form-vertical .mc-form__control{padding-left:0}.mc-form-vertical .mc-form__legend{margin-top:var(--mc-forms-size-vertical-legend-margin-top, 32px);margin-bottom:var(--mc-forms-size-vertical-legend-margin-bottom, 12px)}.mc-form__fieldset{display:flex;flex-direction:column}.mc-form__fieldset.mc-horizontal{flex-direction:row}.mc-form__fieldset.mc-horizontal .mc-form__row:not(:first-child){padding-left:var(--mc-forms-size-vertical-control-padding-left, 24px)}.mc-form-field{position:relative;display:inline-block;width:100%}.mc-form-field,.mc-form-field .mc-input{border-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-form-field:hover{z-index:1}.mc-form-field.mc-focused{z-index:2}.mc-form-field-type-input-password .mc-input{padding-right:var(--mc-form-field-size-button-width, 32px)}.mc-hint{display:block}.mc-password-hint{display:block;padding-left:calc(16px + var(--mc-form-field-password-hint-size-icon-margin, 4px))}.mc-password-hint .mc-icon{position:absolute;left:0}.mc-form-field__hint>.mc-password-hint{margin-top:var(--mc-form-field-password-hint-size-margin-top, 8px)}.mc-form-field__hint>.mc-password-hint:first-child{margin-top:12px}.mc-form-field__hint>.mc-hint{margin-top:var(--mc-form-field-hint-size-margin-top, 4px)}.mc-form-field__container{position:relative;border-width:var(--mc-form-field-size-border-width, 1px);border-style:solid;border-color:transparent;border-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-form-field_without-borders .mc-form-field__container{border-color:transparent}.mc-form-field__prefix,.mc-form-field__suffix{position:absolute;top:0;bottom:0;width:32px;display:flex;flex-direction:row;justify-content:center;align-items:center}.mc-form-field__prefix{left:0}.mc-form-field__suffix{right:0}.mc-form-field_has-suffix .mc-input,.mc-form-field_has-cleaner .mc-input,.mc-form-field_has-stepper .mc-input{padding-right:var(--mc-form-field-size-button-width, 32px)}.mc-form-field_has-prefix .mc-input{padding-left:var(--mc-form-field-size-button-width, 32px)}.mc-cleaner{display:flex;width:var(--mc-form-field-size-button-width, 32px);height:100%;cursor:pointer}.mc-cleaner .mc-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.mc-form-field__cleaner .mc-cleaner{position:absolute;top:0;bottom:0;right:0}mc-stepper{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;top:0;bottom:0;right:0;width:var(--mc-form-field-size-button-width, 32px)}mc-stepper .mc-stepper-step-up,mc-stepper .mc-stepper-step-down{cursor:pointer;width:var(--mc-form-field-size-button-width, 32px);text-align:center}mc-stepper .mc-stepper-step-up{transform:scaleY(-1)}\n", ".mc-input{background:transparent;padding:0;margin:0;border:none;outline:none;width:var(--mc-input-size-width, 100%);min-height:calc(var(--mc-form-field-size-height, 32px) - var(--mc-form-field-size-border-width, 1px) * 2);padding:var(--mc-input-size-padding, 0 12px)}.mc-input::-ms-clear{display:none;width:0;height:0}.mc-input::-ms-reveal{display:none;width:0;height:0}.mc-input::-webkit-search-decoration,.mc-input::-webkit-search-cancel-button,.mc-input::-webkit-search-results-button,.mc-input::-webkit-search-results-decoration{display:none}.mc-input{display:inline-block;box-sizing:border-box}input.mc-input[type=number]{-moz-appearance:textfield}input.mc-input[type=number]::-webkit-inner-spin-button,input.mc-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}input.mc-input:invalid{box-shadow:unset}input.mc-input::placeholder{opacity:1}.mc-password-toggle{display:flex;position:absolute;top:-1px;right:-1px;border:1px solid transparent;width:32px;height:32px;align-items:center;justify-content:center;cursor:pointer;border-top-right-radius:var(--mc-form-field-size-border-radius, 4px);border-bottom-right-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-password-toggle::-moz-focus-inner{border:0}.mc-password-toggle:focus{outline:none}\n", ".mc-timepicker{padding-right:calc(var(--mc-timepicker-size-padding-right, 16px) - var(--mc-form-field-size-border-width, 1px))}.mc-form-field-type-timepicker{width:auto}\n", ".mc-form-field-type-datepicker{width:auto}.mc-datepicker{width:var(--mc-datepicker-input-size-width, 130px)}\n", ".mc-textarea{background:transparent;margin:0;border:none;outline:none;resize:none;overflow:auto;width:100%;box-sizing:border-box;padding:var(--mc-textarea-size-padding, 5px 12px)}.mc-textarea{display:inline-block;-webkit-appearance:none;vertical-align:bottom}.mc-textarea:not(.mc-textarea-resizable){box-sizing:border-box;overflow-y:hidden}.mc-textarea.mc-textarea-resizable{resize:vertical;min-height:var(--mc-textarea-size-min-height, 50px)}.mc-textarea:invalid{box-shadow:unset}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFormField, decorators: [{
             type: Component,
             args: [{ selector: 'mc-form-field', exportAs: 'mcFormField', host: {
                         class: 'mc-form-field',
@@ -472,7 +472,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImpor
                         '(keydown)': 'onKeyDown($event)',
                         '(mouseenter)': 'onHoverChanged(true)',
                         '(mouseleave)': 'onHoverChanged(false)'
-                    }, inputs: ['color'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MC_FORM_FIELD, useExisting: McFormField }], template: "<div class=\"mc-form-field__container\" (click)=\"onContainerClick($event)\">\n\n    <div class=\"mc-form-field__prefix\" *ngIf=\"hasPrefix\">\n        <ng-content select=\"[mcPrefix]\"></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__infix\">\n        <ng-content></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__suffix\" *ngIf=\"hasSuffix\">\n        <ng-content select=\"[mcSuffix]\"></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__cleaner\"\n         *ngIf=\"canShowCleaner && !hasSuffix\"\n         (click)=\"clearValue($event)\">\n        <ng-content select=\"mc-cleaner\"></ng-content>\n    </div>\n\n    <ng-content select=\"mc-password-toggle\"></ng-content>\n\n    <ng-content *ngIf=\"canShowStepper\" select=\"mc-stepper\"></ng-content>\n</div>\n\n<div class=\"mc-form-field__hint\">\n    <ng-content select=\"mc-hint, mc-password-hint\"></ng-content>\n</div>\n", styles: [".mc-form{display:flex;flex-direction:column}.mc-form__row{display:flex;flex-direction:row}.mc-form-horizontal .mc-form-row_margin{margin-bottom:var(--mc-forms-size-horizontal-row-margin-bottom, 20px)}.mc-form-horizontal .mc-form__label{padding-top:var(--mc-forms-size-horizontal-label-padding-top, 6px);text-align:start}.mc-form-horizontal .mc-form__control{padding-left:var(--mc-forms-size-horizontal-control-padding-left, 16px)}.mc-form-horizontal .mc-form__legend{margin-top:var(--mc-forms-size-horizontal-legend-margin-top, 32px);margin-bottom:var(--mc-forms-size-horizontal-legend-margin-bottom, 16px)}.mc-form-vertical .mc-form__row{flex-direction:column}.mc-form-vertical .mc-form-row_margin{margin-bottom:var(--mc-forms-size-vertical-row-margin-bottom, 16px)}.mc-form-vertical .mc-form__label{padding-top:var(--mc-forms-size-vertical-label-padding-top, 0);padding-bottom:var(--mc-forms-size-vertical-label-padding-bottom, 4px);text-align:start}.mc-form-vertical .mc-form__control{padding-left:0}.mc-form-vertical .mc-form__legend{margin-top:var(--mc-forms-size-vertical-legend-margin-top, 32px);margin-bottom:var(--mc-forms-size-vertical-legend-margin-bottom, 12px)}.mc-form__fieldset{display:flex;flex-direction:column}.mc-form__fieldset.mc-horizontal{flex-direction:row}.mc-form__fieldset.mc-horizontal .mc-form__row:not(:first-child){padding-left:var(--mc-forms-size-vertical-control-padding-left, 24px)}.mc-form-field{position:relative;display:inline-block;width:100%}.mc-form-field,.mc-form-field .mc-input{border-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-form-field:hover{z-index:1}.mc-form-field.mc-focused{z-index:2}.mc-form-field-type-input-password .mc-input{padding-right:var(--mc-form-field-size-button-width, 32px)}.mc-hint{display:block}.mc-password-hint{display:block;padding-left:calc(16px + var(--mc-form-field-password-hint-size-icon-margin, 4px))}.mc-password-hint .mc-icon{position:absolute;left:0}.mc-form-field__hint>.mc-password-hint{margin-top:var(--mc-form-field-password-hint-size-margin-top, 8px)}.mc-form-field__hint>.mc-hint{margin-top:var(--mc-form-field-hint-size-margin-top, 4px)}.mc-form-field__container{position:relative;border-width:var(--mc-form-field-size-border-width, 1px);border-style:solid;border-color:transparent;border-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-form-field_without-borders .mc-form-field__container{border-color:transparent}.mc-form-field__prefix,.mc-form-field__suffix{position:absolute;top:0;bottom:0;width:32px;display:flex;flex-direction:row;justify-content:center;align-items:center}.mc-form-field__prefix{left:0}.mc-form-field__suffix{right:0}.mc-form-field_has-suffix .mc-input,.mc-form-field_has-cleaner .mc-input,.mc-form-field_has-stepper .mc-input{padding-right:var(--mc-form-field-size-button-width, 32px)}.mc-form-field_has-prefix .mc-input{padding-left:var(--mc-form-field-size-button-width, 32px)}.mc-cleaner{display:flex;width:var(--mc-form-field-size-button-width, 32px);height:100%;cursor:pointer}.mc-cleaner .mc-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.mc-form-field__cleaner .mc-cleaner{position:absolute;top:0;bottom:0;right:0}mc-stepper{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;top:0;bottom:0;right:0;width:var(--mc-form-field-size-button-width, 32px)}mc-stepper .mc-stepper-step-up,mc-stepper .mc-stepper-step-down{cursor:pointer;width:var(--mc-form-field-size-button-width, 32px);text-align:center}mc-stepper .mc-stepper-step-up{transform:scaleY(-1)}\n", ".mc-input{background:transparent;padding:0;margin:0;border:none;outline:none;width:var(--mc-input-size-width, 100%);min-height:calc(var(--mc-form-field-size-height, 32px) - var(--mc-form-field-size-border-width, 1px) * 2);padding:var(--mc-input-size-padding, 0 12px)}.mc-input::-ms-clear{display:none;width:0;height:0}.mc-input::-ms-reveal{display:none;width:0;height:0}.mc-input::-webkit-search-decoration,.mc-input::-webkit-search-cancel-button,.mc-input::-webkit-search-results-button,.mc-input::-webkit-search-results-decoration{display:none}.mc-input{display:inline-block;box-sizing:border-box}input.mc-input[type=number]{-moz-appearance:textfield}input.mc-input[type=number]::-webkit-inner-spin-button,input.mc-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}input.mc-input:invalid{box-shadow:unset}input.mc-input::placeholder{opacity:1}.mc-password-toggle{display:flex;position:absolute;top:-1px;right:-1px;border:1px solid transparent;width:32px;height:32px;align-items:center;justify-content:center;cursor:pointer;border-top-right-radius:var(--mc-form-field-size-border-radius, 4px);border-bottom-right-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-password-toggle::-moz-focus-inner{border:0}.mc-password-toggle:focus{outline:none}\n", ".mc-timepicker{padding-right:calc(var(--mc-timepicker-size-padding-right, 16px) - var(--mc-form-field-size-border-width, 1px))}.mc-form-field-type-timepicker{width:auto}\n", ".mc-form-field-type-datepicker{width:auto}.mc-datepicker{width:var(--mc-datepicker-input-size-width, 130px)}\n", ".mc-textarea{background:transparent;margin:0;border:none;outline:none;resize:none;overflow:auto;width:100%;box-sizing:border-box;padding:var(--mc-textarea-size-padding, 5px 12px)}.mc-textarea{display:inline-block;-webkit-appearance:none;vertical-align:bottom}.mc-textarea:not(.mc-textarea-resizable){box-sizing:border-box;overflow-y:hidden}.mc-textarea.mc-textarea-resizable{resize:vertical;min-height:var(--mc-textarea-size-min-height, 50px)}.mc-textarea:invalid{box-shadow:unset}\n"] }]
+                    }, inputs: ['color'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MC_FORM_FIELD, useExisting: McFormField }], template: "<div class=\"mc-form-field__container\" (click)=\"onContainerClick($event)\">\n\n    <div class=\"mc-form-field__prefix\" *ngIf=\"hasPrefix\">\n        <ng-content select=\"[mcPrefix]\"></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__infix\">\n        <ng-content></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__suffix\" *ngIf=\"hasSuffix\">\n        <ng-content select=\"[mcSuffix]\"></ng-content>\n    </div>\n\n    <div class=\"mc-form-field__cleaner\"\n         *ngIf=\"canShowCleaner && !hasSuffix\"\n         (click)=\"clearValue($event)\">\n        <ng-content select=\"mc-cleaner\"></ng-content>\n    </div>\n\n    <ng-content select=\"mc-password-toggle\"></ng-content>\n\n    <ng-content *ngIf=\"canShowStepper\" select=\"mc-stepper\"></ng-content>\n</div>\n\n<div class=\"mc-form-field__hint\">\n    <ng-content select=\"mc-hint, mc-password-hint\"></ng-content>\n</div>\n", styles: [".mc-form{display:flex;flex-direction:column}.mc-form__row{display:flex;flex-direction:row}.mc-form-horizontal .mc-form-row_margin{margin-bottom:var(--mc-forms-size-horizontal-row-margin-bottom, 20px)}.mc-form-horizontal .mc-form__label{padding-top:var(--mc-forms-size-horizontal-label-padding-top, 6px);text-align:start}.mc-form-horizontal .mc-form__control{padding-left:var(--mc-forms-size-horizontal-control-padding-left, 16px)}.mc-form-horizontal .mc-form__legend{margin-top:var(--mc-forms-size-horizontal-legend-margin-top, 32px);margin-bottom:var(--mc-forms-size-horizontal-legend-margin-bottom, 16px)}.mc-form-vertical .mc-form__row{flex-direction:column}.mc-form-vertical .mc-form-row_margin{margin-bottom:var(--mc-forms-size-vertical-row-margin-bottom, 16px)}.mc-form-vertical .mc-form__label{padding-top:var(--mc-forms-size-vertical-label-padding-top, 0);padding-bottom:var(--mc-forms-size-vertical-label-padding-bottom, 4px);text-align:start}.mc-form-vertical .mc-form__control{padding-left:0}.mc-form-vertical .mc-form__legend{margin-top:var(--mc-forms-size-vertical-legend-margin-top, 32px);margin-bottom:var(--mc-forms-size-vertical-legend-margin-bottom, 12px)}.mc-form__fieldset{display:flex;flex-direction:column}.mc-form__fieldset.mc-horizontal{flex-direction:row}.mc-form__fieldset.mc-horizontal .mc-form__row:not(:first-child){padding-left:var(--mc-forms-size-vertical-control-padding-left, 24px)}.mc-form-field{position:relative;display:inline-block;width:100%}.mc-form-field,.mc-form-field .mc-input{border-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-form-field:hover{z-index:1}.mc-form-field.mc-focused{z-index:2}.mc-form-field-type-input-password .mc-input{padding-right:var(--mc-form-field-size-button-width, 32px)}.mc-hint{display:block}.mc-password-hint{display:block;padding-left:calc(16px + var(--mc-form-field-password-hint-size-icon-margin, 4px))}.mc-password-hint .mc-icon{position:absolute;left:0}.mc-form-field__hint>.mc-password-hint{margin-top:var(--mc-form-field-password-hint-size-margin-top, 8px)}.mc-form-field__hint>.mc-password-hint:first-child{margin-top:12px}.mc-form-field__hint>.mc-hint{margin-top:var(--mc-form-field-hint-size-margin-top, 4px)}.mc-form-field__container{position:relative;border-width:var(--mc-form-field-size-border-width, 1px);border-style:solid;border-color:transparent;border-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-form-field_without-borders .mc-form-field__container{border-color:transparent}.mc-form-field__prefix,.mc-form-field__suffix{position:absolute;top:0;bottom:0;width:32px;display:flex;flex-direction:row;justify-content:center;align-items:center}.mc-form-field__prefix{left:0}.mc-form-field__suffix{right:0}.mc-form-field_has-suffix .mc-input,.mc-form-field_has-cleaner .mc-input,.mc-form-field_has-stepper .mc-input{padding-right:var(--mc-form-field-size-button-width, 32px)}.mc-form-field_has-prefix .mc-input{padding-left:var(--mc-form-field-size-button-width, 32px)}.mc-cleaner{display:flex;width:var(--mc-form-field-size-button-width, 32px);height:100%;cursor:pointer}.mc-cleaner .mc-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.mc-form-field__cleaner .mc-cleaner{position:absolute;top:0;bottom:0;right:0}mc-stepper{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;top:0;bottom:0;right:0;width:var(--mc-form-field-size-button-width, 32px)}mc-stepper .mc-stepper-step-up,mc-stepper .mc-stepper-step-down{cursor:pointer;width:var(--mc-form-field-size-button-width, 32px);text-align:center}mc-stepper .mc-stepper-step-up{transform:scaleY(-1)}\n", ".mc-input{background:transparent;padding:0;margin:0;border:none;outline:none;width:var(--mc-input-size-width, 100%);min-height:calc(var(--mc-form-field-size-height, 32px) - var(--mc-form-field-size-border-width, 1px) * 2);padding:var(--mc-input-size-padding, 0 12px)}.mc-input::-ms-clear{display:none;width:0;height:0}.mc-input::-ms-reveal{display:none;width:0;height:0}.mc-input::-webkit-search-decoration,.mc-input::-webkit-search-cancel-button,.mc-input::-webkit-search-results-button,.mc-input::-webkit-search-results-decoration{display:none}.mc-input{display:inline-block;box-sizing:border-box}input.mc-input[type=number]{-moz-appearance:textfield}input.mc-input[type=number]::-webkit-inner-spin-button,input.mc-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}input.mc-input:invalid{box-shadow:unset}input.mc-input::placeholder{opacity:1}.mc-password-toggle{display:flex;position:absolute;top:-1px;right:-1px;border:1px solid transparent;width:32px;height:32px;align-items:center;justify-content:center;cursor:pointer;border-top-right-radius:var(--mc-form-field-size-border-radius, 4px);border-bottom-right-radius:var(--mc-form-field-size-border-radius, 4px)}.mc-password-toggle::-moz-focus-inner{border:0}.mc-password-toggle:focus{outline:none}\n", ".mc-timepicker{padding-right:calc(var(--mc-timepicker-size-padding-right, 16px) - var(--mc-form-field-size-border-width, 1px))}.mc-form-field-type-timepicker{width:auto}\n", ".mc-form-field-type-datepicker{width:auto}.mc-datepicker{width:var(--mc-datepicker-input-size-width, 130px)}\n", ".mc-textarea{background:transparent;margin:0;border:none;outline:none;resize:none;overflow:auto;width:100%;box-sizing:border-box;padding:var(--mc-textarea-size-padding, 5px 12px)}.mc-textarea{display:inline-block;-webkit-appearance:none;vertical-align:bottom}.mc-textarea:not(.mc-textarea-resizable){box-sizing:border-box;overflow-y:hidden}.mc-textarea.mc-textarea-resizable{resize:vertical;min-height:var(--mc-textarea-size-min-height, 50px)}.mc-textarea:invalid{box-shadow:unset}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$2.FocusMonitor }]; }, propDecorators: { control: [{
                 type: ContentChild,
                 args: [McFormFieldControl, { static: false }]
@@ -500,9 +500,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImpor
             }] } });
 class McFormFieldWithoutBorders {
 }
-/** @nocollapse */ McFormFieldWithoutBorders.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFormFieldWithoutBorders, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ McFormFieldWithoutBorders.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.2", type: McFormFieldWithoutBorders, selector: "mc-form-field[mcFormFieldWithoutBorders]", host: { classAttribute: "mc-form-field_without-borders" }, exportAs: ["mcFormFieldWithoutBorders"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFormFieldWithoutBorders, decorators: [{
+/** @nocollapse */ McFormFieldWithoutBorders.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFormFieldWithoutBorders, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ McFormFieldWithoutBorders.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: McFormFieldWithoutBorders, selector: "mc-form-field[mcFormFieldWithoutBorders]", host: { classAttribute: "mc-form-field_without-borders" }, exportAs: ["mcFormFieldWithoutBorders"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFormFieldWithoutBorders, decorators: [{
             type: Directive,
             args: [{
                     selector: 'mc-form-field[mcFormFieldWithoutBorders]',
@@ -532,9 +532,9 @@ class McTrim {
         return typeof value === 'string' ? value.trim() : value;
     }
 }
-/** @nocollapse */ McTrim.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McTrim, deps: [{ token: 'no-trim', attribute: true }, { token: i1$3.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ McTrim.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.2", type: McTrim, selector: "[mcInput], [mcTextarea]", host: { classAttribute: "mc-trim" }, exportAs: ["McTrim"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McTrim, decorators: [{
+/** @nocollapse */ McTrim.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McTrim, deps: [{ token: 'no-trim', attribute: true }, { token: i1$3.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ McTrim.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: McTrim, selector: "[mcInput], [mcTextarea]", host: { classAttribute: "mc-trim" }, exportAs: ["McTrim"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McTrim, decorators: [{
             type: Directive,
             args: [{
                     selector: '[mcInput], [mcTextarea]',
@@ -662,9 +662,9 @@ class McValidateDirective {
         });
     }
 }
-/** @nocollapse */ McValidateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McValidateDirective, deps: [{ token: forwardRef(() => McFormFieldControl) }, { token: NG_VALIDATORS, optional: true, self: true }, { token: i1$3.NgControl, optional: true, self: true }, { token: i1$3.NgForm, optional: true }, { token: i1$3.FormGroupDirective, optional: true }, { token: MC_VALIDATION, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
-/** @nocollapse */ McValidateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.2", type: McValidateDirective, selector: "\n        input[mcInput],\n        input[mcInputPassword],\n        input[mcTimepicker],\n        input[mcDatepicker],\n        textarea[mcTextarea],\n        mc-select,\n        mc-tree-select,\n        mc-tag-list\n    ", exportAs: ["McValidate"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McValidateDirective, decorators: [{
+/** @nocollapse */ McValidateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McValidateDirective, deps: [{ token: forwardRef(() => McFormFieldControl) }, { token: NG_VALIDATORS, optional: true, self: true }, { token: i1$3.NgControl, optional: true, self: true }, { token: i1$3.NgForm, optional: true }, { token: i1$3.FormGroupDirective, optional: true }, { token: MC_VALIDATION, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
+/** @nocollapse */ McValidateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: McValidateDirective, selector: "\n        input[mcInput],\n        input[mcInputPassword],\n        input[mcTimepicker],\n        input[mcDatepicker],\n        textarea[mcTextarea],\n        mc-select,\n        mc-tree-select,\n        mc-tag-list\n    ", exportAs: ["McValidate"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McValidateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: `
@@ -708,8 +708,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImpor
 
 class McFormFieldModule {
 }
-/** @nocollapse */ McFormFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ McFormFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.2", ngImport: i0, type: McFormFieldModule, declarations: [McFormField,
+/** @nocollapse */ McFormFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ McFormFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: McFormFieldModule, declarations: [McFormField,
         McFormFieldWithoutBorders,
         McHint,
         McPasswordHint,
@@ -728,8 +728,8 @@ class McFormFieldModule {
         McStepper,
         McValidateDirective,
         McTrim] });
-/** @nocollapse */ McFormFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFormFieldModule, imports: [CommonModule, McIconModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: McFormFieldModule, decorators: [{
+/** @nocollapse */ McFormFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFormFieldModule, imports: [CommonModule, McIconModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: McFormFieldModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [