croco-html 0.0.1 → 0.1.1

package/fesm2015/croco-html.js

@@ -1,1634 +0,0 @@
-import * as i0 from '@angular/core';
-import { Injectable, Inject, EventEmitter, Component, ViewChild, Input, Output, ViewEncapsulation, Pipe, NgModule } from '@angular/core';
-import * as i1 from '@angular/common/http';
-import * as i2 from '@angular/material/button';
-import { MatButtonModule } from '@angular/material/button';
-import * as i5$1 from '@angular/forms';
-import { FormGroup, FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import * as i1$1 from '@angular/platform-browser';
-import * as i2$1 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i5 from '@angular/material/form-field';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import * as i5$2 from '@angular/material/input';
-import { MatInputModule } from '@angular/material/input';
-import * as i4 from '@angular/cdk/text-field';
-import * as i1$2 from '@angular/material/button-toggle';
-import { MatButtonToggleModule } from '@angular/material/button-toggle';
-import * as i2$2 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
-import * as i3 from '@ng-select/ng-select';
-import { NgSelectModule } from '@ng-select/ng-select';
-import * as i1$4 from 'ngx-clipboard';
-import * as i2$4 from '@angular/material/snack-bar';
-import { MatSnackBarModule } from '@angular/material/snack-bar';
-import * as i3$2 from '@angular/material/tabs';
-import { MatTabsModule } from '@angular/material/tabs';
-import * as i11 from '@angular/cdk/drag-drop';
-import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
-import * as i1$3 from '@angular/material/progress-spinner';
-import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import * as i2$3 from '@angular/material/card';
-import { MatCardModule } from '@angular/material/card';
-import * as i3$1 from '@angular/material/chips';
-import { MatChipsModule } from '@angular/material/chips';
-import * as i6 from '@angular/material/select';
-import { MatSelectModule } from '@angular/material/select';
-import * as i7 from '@angular/material/core';
-import { MatNativeDateModule } from '@angular/material/core';
-import * as i1$5 from '@angular/material/table';
-import { MatTableModule } from '@angular/material/table';
-import * as i34 from '@angular/material/tooltip';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import * as i35 from '@angular/material/checkbox';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import * as i47 from '@angular/material/autocomplete';
-import { MatAutocompleteModule } from '@angular/material/autocomplete';
-import * as i42 from '@angular/material/datepicker';
-import { MatDatepickerModule } from '@angular/material/datepicker';
-import * as i40 from '@angular/material/dialog';
-import { MatDialogModule } from '@angular/material/dialog';
-import * as i25 from '@angular/material/expansion';
-import { MatExpansionModule } from '@angular/material/expansion';
-import * as i43 from '@angular/material/grid-list';
-import { MatGridListModule } from '@angular/material/grid-list';
-import * as i37 from '@angular/material/list';
-import { MatListModule } from '@angular/material/list';
-import * as i31 from '@angular/material/menu';
-import { MatMenuModule } from '@angular/material/menu';
-import * as i41 from '@angular/material/paginator';
-import { MatPaginatorModule } from '@angular/material/paginator';
-import * as i28 from '@angular/material/progress-bar';
-import { MatProgressBarModule } from '@angular/material/progress-bar';
-import * as i48 from '@angular/material/sidenav';
-import { MatSidenavModule } from '@angular/material/sidenav';
-import * as i44 from '@angular/material/slide-toggle';
-import { MatSlideToggleModule } from '@angular/material/slide-toggle';
-import * as i45 from '@angular/material/tree';
-import { MatTreeModule } from '@angular/material/tree';
-import * as i23 from '@angular/material/badge';
-import { MatBadgeModule } from '@angular/material/badge';
-
-class FileImageTagDataConsts {
-}
-FileImageTagDataConsts.TagName = "file-image";
-FileImageTagDataConsts.FileIdAttrName = "file-id";
-class ImageMethods {
-    static buildUrl(fileId) {
-        return `/FileCopies/Images/Medium/${fileId}.jpg`;
-    }
-    static buildSmallUrl(fileId) {
-        return `/FileCopies/Images/Small/${fileId}.jpg`;
-    }
-    static ExtractImage(elem) {
-        let fileId = +elem.getAttribute(FileImageTagDataConsts.FileIdAttrName);
-        let src = ImageMethods.buildUrl(fileId);
-        return {
-            type: FileImageTagDataConsts.TagName,
-            data: {
-                src,
-                fileId: fileId,
-            }
-        };
-    }
-}
-
-class FileUploadService {
-    constructor(_httpClient, baseUrl) {
-        this._httpClient = _httpClient;
-        this.baseUrl = baseUrl;
-    }
-    postFile(file, createLocalCopiesNow = false) {
-        const formData = new FormData();
-        formData.append(`fileKey1`, file, file.name);
-        return this.postFilesInner(formData, createLocalCopiesNow);
-    }
-    postFiles(files, createLocalCopiesNow = false) {
-        const formData = new FormData();
-        for (let i = 0; i < files.length; i++) {
-            var fileToUpload = files.item(i);
-            formData.append(`fileKey${i}`, fileToUpload, fileToUpload === null || fileToUpload === void 0 ? void 0 : fileToUpload.name);
-        }
-        return this.postFilesInner(formData, createLocalCopiesNow);
-    }
-    postFilesInner(formData, createLocalCopiesNow = false) {
-        let endpoint = this.baseUrl + 'Api/Files/UploadFiles';
-        if (createLocalCopiesNow) {
-            endpoint += '/Now';
-        }
-        return this._httpClient
-            .post(endpoint, formData);
-    }
-}
-FileUploadService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: FileUploadService, deps: [{ token: i1.HttpClient }, { token: 'BASE_URL' }], target: i0.ɵɵFactoryTarget.Injectable });
-FileUploadService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: FileUploadService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: FileUploadService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: ['BASE_URL']
-                }] }]; } });
-
-class UploadFilesBtnComponent {
-    constructor(_fileUploadService) {
-        this._fileUploadService = _fileUploadService;
-        this.extAccepts = "*/*";
-        this.isMultiple = true;
-        this.btnText = "Загрузить файлы";
-        this.createLocalCopiesNow = false;
-        this.hidden = false;
-        this.postFilesStarted = new EventEmitter();
-        this.onFilesUploaded = new EventEmitter();
-    }
-    handleFileInput(files) {
-        this.postFilesStarted.emit({
-            filesCount: files.length,
-            createLocalCopiesNow: this.createLocalCopiesNow
-        });
-        this._fileUploadService.postFiles(files, this.createLocalCopiesNow).subscribe(data => {
-            this.onFilesUploaded.emit(data);
-        });
-    }
-    clickFileInput() {
-        this.fileInput.nativeElement.click();
-    }
-    ngOnInit() {
-    }
-}
-UploadFilesBtnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: UploadFilesBtnComponent, deps: [{ token: FileUploadService }], target: i0.ɵɵFactoryTarget.Component });
-UploadFilesBtnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: UploadFilesBtnComponent, selector: "app-upload-files-btn", inputs: { extAccepts: "extAccepts", isMultiple: "isMultiple", btnText: "btnText", createLocalCopiesNow: "createLocalCopiesNow", hidden: "hidden" }, outputs: { postFilesStarted: "postFilesStarted", onFilesUploaded: "onFilesUploaded" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["filesInput"], descendants: true }], ngImport: i0, template: "<button [hidden]=\"hidden\" mat-raised-button color=\"primary\" (click)=\"filesInput.click()\">{{btnText}}</button>\n<input [hidden]=\"true\" [accept]=\"extAccepts\" [multiple]=\"isMultiple\" type=\"file\" #filesInput (change)=\"handleFileInput($event.target.files)\" />", styles: [""], components: [{ type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: UploadFilesBtnComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'app-upload-files-btn',
-                    templateUrl: './upload-files-btn.component.html',
-                    styleUrls: ['./upload-files-btn.component.css']
-                }]
-        }], ctorParameters: function () { return [{ type: FileUploadService }]; }, propDecorators: { fileInput: [{
-                type: ViewChild,
-                args: ['filesInput']
-            }], extAccepts: [{
-                type: Input
-            }], isMultiple: [{
-                type: Input
-            }], btnText: [{
-                type: Input
-            }], createLocalCopiesNow: [{
-                type: Input
-            }], hidden: [{
-                type: Input
-            }], postFilesStarted: [{
-                type: Output
-            }], onFilesUploaded: [{
-                type: Output
-            }] } });
-
-class AddFilesBtnComponent {
-    constructor() {
-        this.postFilesStarted = new EventEmitter();
-        this.fileIds = [];
-        this.filesTagsReady = new EventEmitter();
-    }
-    postFilesStartedEventHandler(data) {
-        this.postFilesStarted.emit(data);
-    }
-    filesUploadedHandler(data) {
-        this.fileIds = data.responseObject;
-        let fileTags = [];
-        for (let i = 0; i < this.fileIds.length; i++) {
-            let fileTag = {
-                presentOrEdit: true,
-                tagDescription: {
-                    tag: FileImageTagDataConsts.TagName,
-                    displayValue: "Изображение"
-                },
-                attributes: {
-                    [FileImageTagDataConsts.FileIdAttrName]: this.fileIds[i]
-                },
-                innerHtml: ""
-            };
-            fileTags.push(fileTag);
-        }
-        this.filesTagsReady.emit(fileTags);
-    }
-    handleClick() {
-        this.fakeBtn.clickFileInput();
-    }
-    ngOnInit() {
-    }
-}
-AddFilesBtnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: AddFilesBtnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AddFilesBtnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: AddFilesBtnComponent, selector: "croco-add-files-btn", outputs: { postFilesStarted: "postFilesStarted", filesTagsReady: "filesTagsReady" }, viewQueries: [{ propertyName: "fakeBtn", first: true, predicate: ["fakeBtn"], descendants: true }], ngImport: i0, template: "<div [hidden]=\"true\">\n    <app-upload-files-btn #fakeBtn \n        (onFilesUploaded)=\"filesUploadedHandler($event)\" \n        [btnText]=\"'\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u044F'\"\n        [createLocalCopiesNow]=\"true\"\n        (postFilesStarted)=\"postFilesStartedEventHandler($event)\" \n        [extAccepts]=\"'image/*'\"></app-upload-files-btn>\n</div>\n\n<div>\n    <button class=\"w-100\" \n        (click)=\"handleClick()\"\n        mat-stroked-button>\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u044F</button>\n</div>", styles: [""], components: [{ type: UploadFilesBtnComponent, selector: "app-upload-files-btn", inputs: ["extAccepts", "isMultiple", "btnText", "createLocalCopiesNow", "hidden"], outputs: ["postFilesStarted", "onFilesUploaded"] }, { type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: AddFilesBtnComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-add-files-btn',
-                    templateUrl: './add-files-btn.component.html',
-                    styleUrls: ['./add-files-btn.component.css']
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { postFilesStarted: [{
-                type: Output
-            }], fakeBtn: [{
-                type: ViewChild,
-                args: ["fakeBtn"]
-            }], filesTagsReady: [{
-                type: Output
-            }] } });
-
-class ExternalVideoTagDataConsts {
-}
-ExternalVideoTagDataConsts.TagName = "external-video";
-ExternalVideoTagDataConsts.VideoTypeAttrName = "type";
-ExternalVideoTagDataConsts.LinkAttrName = "link";
-class ExternalVideoSupportedTypes {
-}
-ExternalVideoSupportedTypes.Youtube = "youtube";
-class VideoMethods {
-    static ExtractExternalVideoTag(elem) {
-        return {
-            type: ExternalVideoTagDataConsts.TagName,
-            data: {
-                type: elem.getAttribute(ExternalVideoTagDataConsts.VideoTypeAttrName),
-                link: elem.getAttribute(ExternalVideoTagDataConsts.LinkAttrName)
-            }
-        };
-    }
-}
-
-class XmlTagExternalVideoComponent {
-    constructor(_domSanitizer) {
-        this._domSanitizer = _domSanitizer;
-    }
-    getYouTubeId(youtubeLink) {
-        //https://www.youtube.com/watch?v=l3KfbfkxJOU
-        if (youtubeLink.includes("watch?v=")) {
-            var url = new URL(youtubeLink);
-            return url.searchParams.get("v");
-        }
-        //https://youtu.be/jzBneaWSswY
-        let bits = youtubeLink.split('/');
-        return bits[bits.length - 1];
-    }
-    getWidgetLink(youtubeLink) {
-        let id = this.getYouTubeId(youtubeLink);
-        let result = `https://www.youtube.com/embed/${id}?controls=0`;
-        this.widgetUrl = this._domSanitizer.bypassSecurityTrustResourceUrl(result);
-        return result;
-    }
-    ngOnInit() {
-        if (this.data != null) {
-            this.tagData = this.data.data;
-        }
-        let youtubeWidgetLink = this.getWidgetLink(this.tagData.link);
-        this.widgetUrl = this._domSanitizer.bypassSecurityTrustResourceUrl(youtubeWidgetLink);
-    }
-}
-XmlTagExternalVideoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagExternalVideoComponent, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
-XmlTagExternalVideoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: XmlTagExternalVideoComponent, selector: "croco-html-xml-tag-external-video", inputs: { data: "data", tagData: "tagData" }, ngImport: i0, template: "<div class=\"d-flex justify-content-center\">\n    <div *ngIf=\"widgetUrl\" class=\"y-video\">\n        <iframe width=\"100%\" height=\"100%\" [src]=\"widgetUrl\"\n            title=\"YouTube video player\" frameborder=\"0\"\n            allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n            allowfullscreen></iframe>\n    </div>\n</div>", styles: ["@media only screen and (min-width: 769px){.y-video{width:640px;height:360px;margin:0 auto}}@media only screen and (max-width: 768px){.y-video{width:560px;height:315px;margin:0 auto}}\n"], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagExternalVideoComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-xml-tag-external-video',
-                    templateUrl: './xml-tag-external-video.component.html',
-                    styleUrls: ['./xml-tag-external-video.component.css']
-                }]
-        }], ctorParameters: function () { return [{ type: i1$1.DomSanitizer }]; }, propDecorators: { data: [{
-                type: Input
-            }], tagData: [{
-                type: Input
-            }] } });
-
-class ExternalVideoBlockComponent {
-    constructor() {
-        this.onTagUpdated = new EventEmitter();
-        this.myForm = new FormGroup({
-            youtubeLink: new FormControl()
-        });
-        this.defaultLink = "https://youtu.be/jzBneaWSswY";
-        this.data = {
-            youtubeLink: this.defaultLink
-        };
-        this.tagData = {
-            link: this.defaultLink,
-            type: ExternalVideoSupportedTypes.Youtube
-        };
-    }
-    linkChanged() {
-        this.tagData.link = this.data.youtubeLink;
-        this.tag.attributes = this.tagData;
-    }
-    ngOnInit() {
-        this.linkChanged();
-        this.tagData = this.tag.attributes;
-        this.data.youtubeLink = this.tagData.link;
-    }
-}
-ExternalVideoBlockComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ExternalVideoBlockComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ExternalVideoBlockComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: ExternalVideoBlockComponent, selector: "croco-html-external-video-block", inputs: { tag: "tag" }, outputs: { onTagUpdated: "onTagUpdated" }, ngImport: i0, template: "<div *ngIf=\"tag.presentOrEdit\">\n    \n    <div>\n        \u0421\u0441\u044B\u043B\u043A\u0430 \u043D\u0430 YouTube: {{data.youtubeLink}}\n    </div>\n\n    <div style=\"height: 10px;\"></div>\n\n    <croco-html-xml-tag-external-video [tagData]=\"tagData\">\n    </croco-html-xml-tag-external-video>\n</div>\n\n<div *ngIf=\"!tag.presentOrEdit\">\n    <div>\n        <form [formGroup]=\"myForm\">\n            <mat-form-field class=\"w-100\">\n                <input matInput placeholder=\"\u0421\u0441\u044B\u043B\u043A\u0430 \u043D\u0430 YouTube\"\n                    new-autocomplete=\"off\"\n                    autocomplete=\"off\"\n                    formControlName=\"youtubeLink\"\n                    [(ngModel)]=\"data.youtubeLink\"\n                    (ngModelChange)=\"linkChanged()\">\n            </mat-form-field>\n        </form>\n    </div>\n</div>\n\n", styles: [""], components: [{ type: XmlTagExternalVideoComponent, selector: "croco-html-xml-tag-external-video", inputs: ["data", "tagData"] }, { type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { type: i5$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5$1.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ExternalVideoBlockComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-external-video-block',
-                    templateUrl: './external-video-block.component.html',
-                    styleUrls: ['./external-video-block.component.css']
-                }]
-        }], propDecorators: { tag: [{
-                type: Input
-            }], onTagUpdated: [{
-                type: Output
-            }] } });
-
-class HtmlRawEditorComponent {
-    constructor() {
-        this.onTagUpdated = new EventEmitter();
-    }
-    ngOnInit() {
-    }
-}
-HtmlRawEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: HtmlRawEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-HtmlRawEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: HtmlRawEditorComponent, selector: "croco-html-html-raw-editor", inputs: { tag: "tag" }, outputs: { onTagUpdated: "onTagUpdated" }, ngImport: i0, template: "<div *ngIf=\"tag.presentOrEdit\">\n    <div [innerHTML]=\"tag.innerHtml\"></div>\n</div>\n\n<div *ngIf=\"!tag.presentOrEdit\">\n    <div style=\"height: 10px;\">\n    </div>\n    <div>\n        <mat-form-field class=\"w-100\">\n            <textarea matInput cdkTextareaAutosize #autosize=\"cdkTextareaAutosize\"\n                cdkAutosizeMinRows=\"1\"\n                placeholder=\"\u0412\u043D\u0443\u0442\u0440\u0435\u043D\u043D\u044F\u044F \u0440\u0430\u0437\u043C\u0435\u0442\u043A\u0430 \u0442\u0435\u0433\u0430\"\n                [(ngModel)]=\"tag.innerHtml\"></textarea>\n        </mat-form-field>\n    </div>\n</div>\n\n", styles: [""], components: [{ type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { type: i4.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i5$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: HtmlRawEditorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-html-raw-editor',
-                    templateUrl: './html-raw-editor.component.html',
-                    styleUrls: ['./html-raw-editor.component.css']
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { tag: [{
-                type: Input
-            }], onTagUpdated: [{
-                type: Output
-            }] } });
-
-class FilesQueryService {
-    constructor(_httpClient, baseUrl) {
-        this._httpClient = _httpClient;
-        this._baseControllerUrl = baseUrl + 'Api/Files/';
-    }
-    getFilesWithRelations(model) {
-        return this._httpClient.post(this._baseControllerUrl + `GetFiles/WithRelations`, model);
-    }
-    getFiles(model) {
-        return this._httpClient.post(this._baseControllerUrl + `GetFiles`, model);
-    }
-}
-FilesQueryService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: FilesQueryService, deps: [{ token: i1.HttpClient }, { token: 'BASE_URL' }], target: i0.ɵɵFactoryTarget.Injectable });
-FilesQueryService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: FilesQueryService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: FilesQueryService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: ['BASE_URL']
-                }] }]; } });
-
-class FileIdSelectComponent {
-    constructor(fb, _fileService) {
-        this.fb = fb;
-        this._fileService = _fileService;
-        this.labelText = "Поиск файлов";
-        this.loading = false;
-        this.files = [];
-        this.onFileIdChanged = new EventEmitter();
-        this.form = this.fb.group({
-            fileName: '',
-        });
-    }
-    onModelChanged(fileId) {
-        this.onFileIdChanged.emit(fileId);
-    }
-    getSrc(fileId) {
-        return ImageMethods.buildSmallUrl(fileId);
-    }
-    ngOnInit() {
-        this.loadFiles();
-    }
-    loadFiles() {
-        this.loading = true;
-        this._fileService.getFiles({
-            count: 10,
-            offSet: 0,
-            fileName: null,
-            q: this.q
-        }).subscribe(data => {
-            this.files = [...data.list];
-            this.loading = false;
-        });
-    }
-    onSearchChanged(q) {
-        this.q = q.term;
-        this.loadFiles();
-    }
-    ngOnChanges(changes) {
-        this.loadFiles();
-    }
-}
-FileIdSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: FileIdSelectComponent, deps: [{ token: i5$1.FormBuilder }, { token: FilesQueryService }], target: i0.ɵɵFactoryTarget.Component });
-FileIdSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: FileIdSelectComponent, selector: "croco-html-file-id-select", inputs: { labelText: "labelText", fileId: "fileId" }, outputs: { fileId: "fileId", onFileIdChanged: "onFileIdChanged" }, usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n    <div class=\"form-group\">\n        <label for=\"fileName\">{{labelText}}</label>\n        <ng-select [(ngModel)]=\"fileId\" (ngModelChange)=\"onModelChanged($event)\"\n                   [items]=\"files\"\n                   #select\n                   bindLabel=\"fileName\"\n                   (search)=\"onSearchChanged($event)\"\n                   [loading]=\"loading\"\n                   [loadingText]=\"'\u0417\u0430\u0433\u0440\u0443\u0436\u0430\u044E \u0444\u0430\u0439\u043B\u044B'\"\n                   dropdownPosition=\"auto\"\n                   bindValue=\"fileId\"\n                   labelForId=\"fileName\"\n                   placeholder=\"\u0412\u044B\u0431\u0440\u0430\u0442\u044C \u0444\u0430\u0439\u043B\"\n                   [virtualScroll]=\"true\"\n                   formControlName=\"fileName\">\n            <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n                <div>\n                    <img class=\"mx-auto d-block img-fluid\" [src]=\"getSrc(item.fileId)\"/>\n                </div>\n                <div>\n                    <span class=\"h5\">\u0424\u0430\u0439\u043B: </span>\n                    <span class=\"h5\" [ngOptionHighlight]=\"search\"><b>{{item.fileName}}</b></span>\n                </div>\n                <div>\n                    <small>\n                        <span>\n                            \u0418\u0434\u0435\u043D\u0442\u0438\u0444\u0438\u043A\u0430\u0442\u043E\u0440 \u0444\u0430\u0439\u043B\u0430: <b>{{item.fileId}}</b>\n                        </span>\n                    </small>\n                </div>\n            </ng-template>\n        </ng-select>\n    </div>\n</form>\n\n<div>\n    \u0418\u0434\u0435\u043D\u0442\u0438\u0444\u0438\u043A\u0430\u0442\u043E\u0440 \u0444\u0430\u0439\u043B\u0430: {{fileId}}\n</div>\n", styles: [""], components: [{ type: i3.NgSelectComponent, selector: "ng-select", inputs: ["markFirst", "dropdownPosition", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "bufferAmount", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "bindLabel", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "virtualScroll", "openOnEnter", "appendTo", "bindValue", "appearance", "maxSelectedItems", "groupBy", "groupValue", "tabIndex", "typeahead"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }], directives: [{ type: i5$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5$1.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i3.ɵf, selector: "[ng-option-tmp]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: FileIdSelectComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-file-id-select',
-                    templateUrl: './file-id-select.component.html',
-                    styleUrls: ['./file-id-select.component.css']
-                }]
-        }], ctorParameters: function () { return [{ type: i5$1.FormBuilder }, { type: FilesQueryService }]; }, propDecorators: { labelText: [{
-                type: Input
-            }], fileId: [{
-                type: Input
-            }, {
-                type: Output
-            }], onFileIdChanged: [{
-                type: Output
-            }] } });
-
-class ImageEditorComponent {
-    constructor() {
-        this.hasImageError = false;
-        this.searchOrEdit = "search";
-        this.myForm = new FormGroup({
-            fileId: new FormControl()
-        });
-        this.onTagUpdated = new EventEmitter();
-    }
-    onErrorHandler() {
-        this.hasImageError = true;
-    }
-    getSrc() {
-        return ImageMethods.buildUrl(this.tag.attributes[FileImageTagDataConsts.FileIdAttrName]);
-    }
-    hasFileId() {
-        return this.tag.attributes.hasOwnProperty(FileImageTagDataConsts.FileIdAttrName) && !isNaN(this.tag.attributes[FileImageTagDataConsts.FileIdAttrName]);
-    }
-    onFileIdChanged(fileId) {
-        this.tag.attributes[FileImageTagDataConsts.FileIdAttrName] = fileId;
-        this.removeImageError();
-    }
-    removeImageError() {
-        this.hasImageError = false;
-    }
-    ngOnInit() {
-    }
-}
-ImageEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ImageEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ImageEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: ImageEditorComponent, selector: "croco-html-image-editor", inputs: { tag: "tag" }, outputs: { onTagUpdated: "onTagUpdated" }, ngImport: i0, template: "<div>\n    <div style=\"height: 10px;\">\n    </div>\n    \n    <div *ngIf=\"hasImageError\" class=\"error-block\">\n        \u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E \u043F\u043E \u0443\u043A\u0430\u0437\u0430\u043D\u043D\u043E\u043C\u0443 \u0438\u0434\u0435\u043D\u0442\u0438\u0444\u0438\u043A\u0430\u0442\u043E\u0440\u0443, \u0432\u043E\u0437\u043C\u043E\u0436\u043D\u043E \u0444\u0430\u0439\u043B \u043D\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0438\u043B\u0438 \u043E\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u043D\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435.\n    </div>\n\n    <div *ngIf=\"hasFileId() && !hasImageError\">\n        <img class=\"mx-auto d-block img-fluid\" [src]=\"getSrc()\" (error)=\"onErrorHandler()\"/>\n    </div>\n\n    <div *ngIf=\"!hasFileId()\">\n        <h5>[\u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u043D\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043E]</h5>\n    </div>\n</div>\n\n<div *ngIf=\"!tag.presentOrEdit\">\n    <div style=\"height: 10px;\"></div>\n\n    <div style=\"overflow-x:auto;\">\n        <mat-button-toggle-group [(ngModel)]=\"searchOrEdit\">\n            <mat-button-toggle value=\"search\">\n                \u0418\u0441\u043A\u0430\u0442\u044C \u0444\u0430\u0439\u043B <mat-icon>search</mat-icon>\n            </mat-button-toggle>\n            <mat-button-toggle value=\"edit\">\n                \u0423\u043A\u0430\u0437\u0430\u0442\u044C \u043F\u043E \u0438\u0434\u0435\u043D\u0442\u0438\u0444\u0438\u043A\u0430\u0442\u043E\u0440\u0443 <mat-icon>settings</mat-icon>\n            </mat-button-toggle>\n        </mat-button-toggle-group>\n    </div>\n    \n\n    <div style=\"height: 10px;\"></div>\n\n    <div [hidden]=\"searchOrEdit !== 'search'\">\n        <croco-html-file-id-select\n         [labelText]=\"'\u0412\u044B\u0431\u0440\u0430\u0442\u044C \u0444\u0430\u0439\u043B'\"\n         [(fileId)]=\"tag.attributes['file-id']\"\n         (onFileIdChanged)=\"onFileIdChanged($event)\">\n        </croco-html-file-id-select>\n    </div>\n\n    <div [hidden]=\"searchOrEdit !== 'edit'\">\n        <form [formGroup]=\"myForm\">\n            <mat-form-field class=\"w-100\">\n                <input matInput placeholder=\"\u0418\u0434\u0435\u043D\u0442\u0438\u0444\u0438\u043A\u0430\u0442\u043E\u0440 \u0444\u0430\u0439\u043B\u0430\" new-autocomplete=\"off\" autocomplete=\"off\"\n                    formControlName=\"fileId\" \n                    type=\"number\"\n                    [(ngModel)]=\"tag.attributes['file-id']\"\n                    (ngModelChange)=\"removeImageError()\">\n            </mat-form-field>\n        </form>\n    </div>\n</div>", styles: [".error-block{background-color:#f32323;color:#fff;text-align:center;border-radius:10px;padding:10px}\n"], components: [{ type: i1$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-labelledby", "tabIndex", "appearance", "checked", "disabled", "id", "name", "aria-label", "value"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: FileIdSelectComponent, selector: "croco-html-file-id-select", inputs: ["labelText", "fileId"], outputs: ["fileId", "onFileIdChanged"] }, { type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { type: i5$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i5$1.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ImageEditorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-image-editor',
-                    templateUrl: './image-editor.component.html',
-                    styleUrls: ['./image-editor.component.css']
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { tag: [{
-                type: Input
-            }], onTagUpdated: [{
-                type: Output
-            }] } });
-
-class AngularMaterialTableMethods {
-    static getAngularMaterialTableData(columns, rows) {
-        let data = [];
-        for (let rowIndex = 0; rowIndex < rows.length; rowIndex++) {
-            const row = rows[rowIndex];
-            var elem = {};
-            for (let columnIndex = 0; columnIndex < columns.length; columnIndex++) {
-                const column = columns[columnIndex];
-                elem[column] = row.columns[columnIndex].data.text;
-            }
-            data.push(elem);
-        }
-        return {
-            displayedColumns: columns,
-            data: data,
-        };
-    }
-    static checkHeaders(tableData) {
-        if (tableData.header === null) {
-            return {
-                isSucceeded: false,
-                message: "Необходимо указать заголовок таблицы"
-            };
-        }
-        let columns = tableData.header.columns;
-        var uniqueDislayedColumns = columns.filter((v, i, a) => a.indexOf(v) === i);
-        if (uniqueDislayedColumns.length !== columns.length) {
-            return {
-                isSucceeded: false,
-                message: "Ошибка при обработке разметки таблицы. Обнаружены дубликаты заголовков."
-            };
-        }
-        return {
-            isSucceeded: true,
-            message: "Ok"
-        };
-    }
-    static checkAngularMaterialTableData(tableData, checkHeaders = true) {
-        if (checkHeaders) {
-            var checkHeadersResult = this.checkHeaders(tableData);
-            if (!checkHeadersResult.isSucceeded) {
-                return checkHeadersResult;
-            }
-        }
-        let rows = tableData.rows;
-        let columns = tableData.header.columns;
-        for (let i = 0; i < rows.length; i++) {
-            const row = rows[i];
-            if (row.columns.length !== columns.length) {
-                return {
-                    isSucceeded: false,
-                    message: `Ошибка при обработке разметки таблицы. `
-                        + `Количество колонок в каждой строке таблицы должно соотвествовать количеству колонок указанных в заголовке. `
-                        + `В строке таблицы №${i + 1} количество колонок = ${row.columns.length}, а должно быть ${columns.length}.`
-                };
-            }
-        }
-        return {
-            isSucceeded: true,
-            message: "Ok"
-        };
-    }
-}
-
-const TextTag = "text";
-class TextSimpleMethods {
-    static ExtractTextTag(elem) {
-        var _a;
-        var hAlignValue = (_a = elem.getAttribute("h-align")) !== null && _a !== void 0 ? _a : "left";
-        var data = {
-            textTagName: elem.tagName.toLowerCase(),
-            text: elem.innerText.trim().replace('\n\t', ''),
-            html: elem.innerHTML.trim().replace('\n\t', ''),
-            horizontalAlignment: hAlignValue,
-            validationResult: {
-                isSucceeded: true,
-                message: "Ok"
-            }
-        };
-        let result = {
-            type: TextTag,
-            data: data
-        };
-        if (result.data.text === '\n') {
-            result.data.text = '';
-        }
-        if (result.data.html === '\n') {
-            result.data.html = '';
-        }
-        var alignmentVals = ["left", "right", "center"];
-        if (alignmentVals.indexOf(hAlignValue) < 0) {
-            result.data.validationResult = {
-                isSucceeded: false,
-                message: `Недопустимое значение атрибута h-align. Допустимые значения: ${alignmentVals.join(', ')}. `
-                    + 'Данный тег можно не указывать, по-умолчанию будет применено выравнивание слева.'
-            };
-        }
-        var html = result.data.html;
-        var htmlValidation = this.ValidateTextHtml(html);
-        if (!htmlValidation.isSucceeded) {
-            result.data.validationResult = htmlValidation;
-        }
-        return result;
-    }
-    static ValidateTextHtml(html) {
-        var p = document.createElement("p");
-        p.innerHTML = html;
-        for (let i = 0; i < p.children.length; i++) {
-            const element = p.children.item(i);
-            var validationResult = this.ValidateTag(element);
-            if (!validationResult.isSucceeded) {
-                return validationResult;
-            }
-        }
-        return {
-            isSucceeded: true,
-            message: `Ok`
-        };
-    }
-    static ValidateTag(element) {
-        let lowerTag = element.tagName.toLowerCase();
-        if (!this.supportedTags.includes(lowerTag)) {
-            return {
-                isSucceeded: false,
-                message: `Тег <${lowerTag}> не поддерживается внутри тега <text>`
-            };
-        }
-        for (let i = 0; i < element.children.length; i++) {
-            const nElement = element.children.item(i);
-            var innerValidationResult = this.ValidateTag(nElement);
-            if (!innerValidationResult.isSucceeded) {
-                return innerValidationResult;
-            }
-        }
-        return {
-            isSucceeded: true,
-            message: "Ok"
-        };
-    }
-}
-TextSimpleMethods.supportedTags = ["sup", "sub", "strong", "b", "i"];
-
-class BootstrapTableMethods {
-    static BuildTable(data) {
-        let result = `<table class="table table-bordered">`;
-        result += this.BuildHeader(data.header);
-        result += this.BuildBody(data.rows);
-        result += "</table>";
-        return result;
-    }
-    static BuildHeader(data) {
-        if (data === null) {
-            return "";
-        }
-        let result = "<thead>";
-        result += "<tr>";
-        for (let index = 0; index < data.columns.length; index++) {
-            result += `<th>${data.columns[index]}</th>`;
-        }
-        result += "</tr>";
-        result += "</thead>";
-        return result;
-    }
-    static BuildBody(rows) {
-        let result = "<tbody>";
-        for (let i = 0; i < rows.length; i++) {
-            const row = rows[i];
-            result += "<tr>";
-            for (let j = 0; j < row.columns.length; j++) {
-                const col = row.columns[j];
-                result += `<td class="align-middle">${this.BuildInnerTags(col.data.children)}</td>`;
-            }
-            result += "</tr>";
-        }
-        result += "</tbody>";
-        return result;
-    }
-    static BuildInnerTags(tags) {
-        let result = "";
-        for (let i = 0; i < tags.length; i++) {
-            result += this.BuildInnerTag(tags[i]);
-        }
-        return result;
-    }
-    static BuildInnerTag(data) {
-        if (data.type === FileImageTagDataConsts.TagName) {
-            let fileImageTag = data;
-            return `<img src=${fileImageTag.data.src} class="mx-auto d-block img-fluid" />`;
-        }
-        else if (data.type === TextTag) {
-            let simpleTextTag = data;
-            var map = {
-                ["left"]: "text-start",
-                ["center"]: "text-center",
-                ["right"]: "text-end"
-            };
-            if (!simpleTextTag.data.validationResult.isSucceeded) {
-                return `<span>Ошибка в тексте ${simpleTextTag.data.validationResult.message}</span>`;
-            }
-            return `<div class="${map[simpleTextTag.data.horizontalAlignment]}"><span>${simpleTextTag.data.html}</span></div>`;
-        }
-        else {
-            return `<p>Тег ${data.type} не поддерживается</p>`;
-        }
-    }
-}
-
-class TableTypes {
-}
-TableTypes.TableRowColumnData = "table-row-column-data";
-TableTypes.Table = "table";
-TableTypes.TableRowColumn = "table-row-column";
-class TableMethods {
-    static getTableFromHtmlTag(tableTag) {
-        let tableData = {
-            header: TableMethods.getHeader(tableTag),
-            rows: TableMethods.getTableRows(tableTag)
-        };
-        var result = {
-            type: TableTypes.Table,
-            data: tableData,
-            validationResult: this.checkTable(tableData),
-            bootstrapHtml: ""
-        };
-        if (!result.validationResult) {
-            return result;
-        }
-        result.bootstrapHtml = BootstrapTableMethods.BuildTable(result.data);
-        var angularMaterialTableDataCheck = AngularMaterialTableMethods.checkAngularMaterialTableData(tableData);
-        if (!angularMaterialTableDataCheck.isSucceeded) {
-            return Object.assign(Object.assign({}, result), { angularMaterialTableDataCheck });
-        }
-        return Object.assign(Object.assign({}, result), { angularMaterialTableDataCheck, html: tableTag.outerHTML, angularMaterialTableData: AngularMaterialTableMethods.getAngularMaterialTableData(tableData.header.columns, tableData.rows) });
-    }
-    static checkTable(tableData) {
-        let rows = tableData.rows;
-        let prevRowCount = -1;
-        for (let i = 0; i < rows.length; i++) {
-            const row = rows[i];
-            if (row.columns.length !== prevRowCount && prevRowCount != -1) {
-                return {
-                    isSucceeded: false,
-                    message: `Ошибка при обработке разметки таблицы. `
-                        + `Количество колонок в каждой строке таблицы должно соотвествовать друг другу. `
-                        + `В строке таблицы №${i + 1} количество колонок = ${row.columns.length}, а в строке выше ${prevRowCount}.`
-                };
-            }
-            prevRowCount = row.columns.length;
-        }
-        return {
-            isSucceeded: true,
-            message: "Ok"
-        };
-    }
-    static getHeader(tableTag) {
-        let header = tableTag.tHead;
-        if (header === null) {
-            return null;
-        }
-        let tr = header.children.item(0);
-        let headerColumns = [];
-        for (let j = 0; j < tr.children.length; j++) {
-            const jElement = tr.children.item(j);
-            headerColumns.push(jElement.innerHTML);
-        }
-        return {
-            type: "table-header",
-            columns: headerColumns
-        };
-    }
-    static getTableRows(tableTag) {
-        let tBody = tableTag.tBodies.item(0);
-        let rows = [];
-        for (let i = 0; i < tBody.children.length; i++) {
-            const iElement = tBody.children.item(i);
-            let rowColumns = [];
-            for (let j = 0; j < iElement.children.length; j++) {
-                const jElement = iElement.children.item(j);
-                let children = HtmlExtractionMethods.transformHtmlElementToBlocks(jElement);
-                if (children.length === 0) {
-                    var textTag = document.createElement("p");
-                    textTag.innerHTML = jElement.innerHTML;
-                    var textElem = TextSimpleMethods.ExtractTextTag(textTag);
-                    children.push(textElem);
-                }
-                var result = {
-                    type: TableTypes.TableRowColumnData,
-                    data: {
-                        text: jElement.innerHTML,
-                        children
-                    }
-                };
-                rowColumns.push(result);
-            }
-            rows.push({
-                type: TableTypes.TableRowColumn,
-                columns: rowColumns
-            });
-        }
-        return rows;
-    }
-}
-
-class TextMethods {
-    static ExtractRichTextData(elem) {
-        let children = [];
-        for (let i = 0; i < elem.children.length; i++) {
-            const child = elem.children.item(i);
-            if (child.tagName === "text-block".toUpperCase()) {
-                children.push({
-                    type: "text-block",
-                    data: {
-                        text: child.innerHTML
-                    }
-                });
-            }
-            else if (child.tagName === "line-break".toUpperCase()) {
-                children.push({
-                    type: "line-break"
-                });
-            }
-        }
-        return {
-            type: "rich-text",
-            data: {
-                children
-            }
-        };
-    }
-}
-TextMethods.textTags = ["text", "h1", "h2", "h3", "h4", "h5", "h6"];
-
-class HtmlExtractionMethods {
-    static ExtractHeaderTag(elem, tagName) {
-        var data = TextSimpleMethods.ExtractTextTag(elem);
-        data.type = tagName;
-        return data;
-    }
-    static transformHtmlElementToBlocks(element) {
-        var data = [];
-        for (let i = 0; i < element.children.length; i++) {
-            var elem = element.children.item(i);
-            if (!HtmlExtractionMethods.Extractors.hasOwnProperty(elem.tagName)) {
-                data.push({
-                    type: "unsupported-tag",
-                    data: {
-                        tagString: elem.outerHTML
-                    }
-                });
-            }
-            else {
-                var extractor = HtmlExtractionMethods.Extractors[elem.tagName];
-                var result = extractor(elem);
-                data.push(result);
-            }
-        }
-        return data;
-    }
-    static transformHtmlStringToBlocks(value) {
-        if (value === undefined) {
-            return [];
-        }
-        value = value
-            .replace('\n', '')
-            .replace('\t', '');
-        var div = document.createElement("div");
-        div.innerHTML = value;
-        return this.transformHtmlElementToBlocks(div);
-    }
-}
-HtmlExtractionMethods.Extractors = {
-    ["TEXT"]: (elem) => TextSimpleMethods.ExtractTextTag(elem),
-    ["FILE-IMAGE"]: (elem) => ImageMethods.ExtractImage(elem),
-    ["TABLE"]: (elem) => TableMethods.getTableFromHtmlTag(elem),
-    ["RICH-TEXT"]: (elem) => TextMethods.ExtractRichTextData(elem),
-    ["HTML-RAW"]: (elem) => ({
-        type: "html-raw",
-        data: {
-            innerHTML: elem.innerHTML
-        }
-    }),
-    ["H1"]: (elem) => HtmlExtractionMethods.ExtractHeaderTag(elem, "h1"),
-    ["H2"]: (elem) => HtmlExtractionMethods.ExtractHeaderTag(elem, "h2"),
-    ["H3"]: (elem) => HtmlExtractionMethods.ExtractHeaderTag(elem, "h3"),
-    ["H4"]: (elem) => HtmlExtractionMethods.ExtractHeaderTag(elem, "h4"),
-    ["H5"]: (elem) => HtmlExtractionMethods.ExtractHeaderTag(elem, "h5"),
-    ["H6"]: (elem) => HtmlExtractionMethods.ExtractHeaderTag(elem, "h6"),
-    [ExternalVideoTagDataConsts.TagName.toUpperCase()]: (elem) => VideoMethods.ExtractExternalVideoTag(elem)
-};
-
-class HtmlRawTagDataConsts {
-}
-HtmlRawTagDataConsts.TagName = "html-raw";
-
-class BodyTagsExtensions {
-    static getDescription(tagName) {
-        var descriptions = {
-            "text": "Текст",
-            "h1": "Заголовок 1 уровня",
-            "h2": "Заголовок 2 уровня",
-            "h3": "Заголовок 3 уровня",
-            "h4": "Заголовок 4 уровня",
-            "h5": "Заголовок 5 уровня",
-            "h6": "Заголовок 6 уровня",
-            [FileImageTagDataConsts.TagName]: "Изображение",
-            [ExternalVideoTagDataConsts.TagName]: "Внешнее видео YouTube",
-            [HtmlRawTagDataConsts.TagName]: "Html разметка"
-        };
-        return descriptions[tagName];
-    }
-    static toHtml(bodyTags) {
-        let htmls = bodyTags.map(x => {
-            if (TextMethods.textTags.includes(x.tagDescription.tag)) {
-                return `<${x.tagDescription.tag} h-align="${x.attributes['h-align']}">${x.innerHtml}</${x.tagDescription.tag}>`;
-            }
-            if (x.tagDescription.tag === ExternalVideoTagDataConsts.TagName) {
-                return `<${x.tagDescription.tag} type="${x.attributes['type']}" link="${x.attributes['link']}">${x.innerHtml}</${x.tagDescription.tag}>`;
-            }
-            if (x.tagDescription.tag === "html-raw") {
-                return `<${x.tagDescription.tag}>${x.innerHtml}</${x.tagDescription.tag}>`;
-            }
-            return BodyTagsExtensions.imageTagToHtml(x);
-        });
-        let result = "";
-        for (let index = 0; index < htmls.length; index++) {
-            const element = htmls[index];
-            result += element;
-        }
-        return result;
-    }
-    static imageTagToHtml(imageTag) {
-        var attrStr = "";
-        var attrValue = imageTag.attributes[FileImageTagDataConsts.FileIdAttrName];
-        if (imageTag.attributes.hasOwnProperty(FileImageTagDataConsts.FileIdAttrName) && attrValue) {
-            attrStr = `${FileImageTagDataConsts.FileIdAttrName}="${attrValue}"`;
-        }
-        return `<${FileImageTagDataConsts.TagName} ${attrStr}></${FileImageTagDataConsts.TagName}>`;
-    }
-    static getBodyTags(html) {
-        let result = HtmlExtractionMethods.transformHtmlStringToBlocks(html);
-        return result.map(x => BodyTagsExtensions.toBodyTag(x));
-    }
-    static sanitizeInnerHtml(html) {
-        return html.trim().replace('\n\t', '');
-    }
-    static toBodyTag(data) {
-        if (TextMethods.textTags.includes(data.type)) {
-            let textTagData = data.data;
-            return {
-                presentOrEdit: true,
-                tagDescription: {
-                    tag: textTagData.textTagName,
-                    displayValue: BodyTagsExtensions.getDescription(data.type)
-                },
-                attributes: { "h-align": textTagData.horizontalAlignment },
-                innerHtml: BodyTagsExtensions.sanitizeInnerHtml(textTagData.html)
-            };
-        }
-        if (data.type === FileImageTagDataConsts.TagName) {
-            let fileData = data.data;
-            let atts = {};
-            if (fileData.fileId) {
-                atts[FileImageTagDataConsts.FileIdAttrName] = fileData.fileId;
-            }
-            return {
-                presentOrEdit: true,
-                tagDescription: {
-                    tag: FileImageTagDataConsts.TagName,
-                    displayValue: BodyTagsExtensions.getDescription(data.type)
-                },
-                attributes: atts,
-                innerHtml: ""
-            };
-        }
-        if (data.type === ExternalVideoTagDataConsts.TagName) {
-            let fileData = data.data;
-            return {
-                presentOrEdit: true,
-                tagDescription: {
-                    tag: ExternalVideoTagDataConsts.TagName,
-                    displayValue: BodyTagsExtensions.getDescription(data.type)
-                },
-                attributes: fileData,
-                innerHtml: ""
-            };
-        }
-        if (data.type === HtmlRawTagDataConsts.TagName) {
-            return {
-                presentOrEdit: true,
-                tagDescription: {
-                    tag: HtmlRawTagDataConsts.TagName,
-                    displayValue: BodyTagsExtensions.getDescription(data.type)
-                },
-                attributes: {},
-                innerHtml: BodyTagsExtensions.sanitizeInnerHtml(data.data["innerHTML"])
-            };
-        }
-        return {
-            presentOrEdit: true,
-            tagDescription: {
-                tag: "unsupported-tag",
-                displayValue: "Неподдерживаемый тег"
-            },
-            attributes: {},
-            innerHtml: JSON.stringify(data)
-        };
-    }
-}
-
-class XmlExtensions {
-    static formatXml(xml, tab = '\t') {
-        var formatted = '', indent = '';
-        tab = tab || '\t';
-        xml.split(/>\s*</).forEach(function (node) {
-            if (node.match(/^\/\w/))
-                indent = indent.substring(tab.length); // decrease indent by one 'tab'
-            formatted += indent + '<' + node + '>\r\n';
-            if (node.match(/^<?\w[^>]*[^\/]$/))
-                indent += tab; // increase indent
-        });
-        return formatted.substring(1, formatted.length - 3);
-    }
-    static tagsToLower(xml) {
-        xml = this.replaceTagToLower(xml, "Body");
-        xml = this.replaceTagToLower(xml, "Image");
-        xml = this.replaceTagToLower(xml, "Text");
-        return xml;
-    }
-    static replaceTagToLower(xml, tag) {
-        return xml
-            .replace(new RegExp(`<${tag}`, 'g'), `<${tag.toLowerCase()}`)
-            .replace(new RegExp(`</${tag}>`, 'g'), `</${tag.toLowerCase()}>`);
-    }
-}
-
-class TextEditorComponent {
-    constructor() {
-        this.myForm = new FormGroup({
-            "innerHtml": new FormControl()
-        });
-        this.onTagUpdated = new EventEmitter();
-    }
-    ngOnInit() {
-    }
-    getInnerHtml() {
-        return `<${this.tag.tagDescription.tag}>${this.tag.innerHtml}<${this.tag.tagDescription.tag}/>`;
-    }
-}
-TextEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: TextEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TextEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: TextEditorComponent, selector: "croco-html-text-editor", inputs: { tag: "tag" }, outputs: { onTagUpdated: "onTagUpdated" }, ngImport: i0, template: "<div *ngIf=\"tag.presentOrEdit\">\n    <div style=\"height: 10px;\">\n    </div>\n\n    <div style=\"text-align: left;\" *ngIf=\"tag.attributes['h-align'] === 'left'\" [innerHtml]=\"getInnerHtml()\">\n    </div>\n    <div style=\"text-align: right;\" *ngIf=\"tag.attributes['h-align'] === 'right'\" [innerHtml]=\"getInnerHtml()\">\n    </div>\n    <div style=\"text-align: center;\" *ngIf=\"tag.attributes['h-align'] === 'center'\" [innerHtml]=\"getInnerHtml()\">\n    </div>\n</div>\n\n<div *ngIf=\"!tag.presentOrEdit\">\n    <div style=\"overflow-x: auto;\">\n        <mat-button-toggle-group [(ngModel)]=\"tag.attributes['h-align']\">\n            <mat-button-toggle value=\"center\">\n                \u041F\u043E \u0446\u0435\u043D\u0442\u0440\u0443 <mat-icon>format_align_center</mat-icon>\n            </mat-button-toggle>\n            <mat-button-toggle value=\"left\">\n                \u0421\u043B\u0435\u0432\u0430 <mat-icon>format_align_left</mat-icon>\n            </mat-button-toggle>\n            <mat-button-toggle value=\"right\">\n                \u0421\u043F\u0440\u0430\u0432\u0430 <mat-icon> format_align_right</mat-icon>\n            </mat-button-toggle>\n        </mat-button-toggle-group>\n    </div>\n\n    <div style=\"height: 10px;\">\n    </div>\n    <form [formGroup]=\"myForm\">\n        <mat-form-field class=\"w-100\">\n            <textarea matInput cdkTextareaAutosize #autosize=\"cdkTextareaAutosize\"\n                cdkAutosizeMinRows=\"1\"\n                placeholder=\"\u0412\u043D\u0443\u0442\u0440\u0435\u043D\u043D\u044F\u044F \u0440\u0430\u0437\u043C\u0435\u0442\u043A\u0430 \u0442\u0435\u043A\u0441\u0442\u043E\u0432\u043E\u0433\u043E \u0442\u0435\u0433\u0430\"\n                formControlName=\"innerHtml\"\n                [(ngModel)]=\"tag.innerHtml\"></textarea>\n        </mat-form-field>\n    </form>\n</div>", styles: [""], components: [{ type: i1$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-labelledby", "tabIndex", "appearance", "checked", "disabled", "id", "name", "aria-label", "value"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { type: i4.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i5$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5$1.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: TextEditorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-text-editor',
-                    templateUrl: './text-editor.component.html',
-                    styleUrls: ['./text-editor.component.css']
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { tag: [{
-                type: Input
-            }], onTagUpdated: [{
-                type: Output
-            }] } });
-
-class MainEditorBlockComponent {
-    constructor() {
-        this.textTags = TextMethods.textTags;
-        this.onTagSaved = new EventEmitter();
-        this.onTagRemoved = new EventEmitter();
-    }
-    tagUpdatedHandler(tag) {
-    }
-    save() {
-        this.tag.presentOrEdit = true;
-        this.onTagSaved.emit(this.tag);
-    }
-    deleteItem() {
-        this.onTagRemoved.emit(this.tag);
-    }
-    ngOnInit() {
-    }
-}
-MainEditorBlockComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: MainEditorBlockComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MainEditorBlockComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: MainEditorBlockComponent, selector: "croco-html-main-editor-block", inputs: { tag: "tag" }, outputs: { onTagSaved: "onTagSaved", onTagRemoved: "onTagRemoved" }, ngImport: i0, template: "<div>\n  <div>\n    <div *ngIf=\"textTags.includes(tag.tagDescription.tag)\">\n      <croco-html-text-editor (onTagUpdated)=\"tagUpdatedHandler($event)\" [tag]=\"tag\">\n      </croco-html-text-editor>\n    </div>\n\n    <div *ngIf=\"tag.tagDescription.tag === 'file-image'\"> \n      <croco-html-image-editor (onTagUpdated)=\"tagUpdatedHandler($event)\" [tag]=\"tag\">\n      </croco-html-image-editor>\n    </div>\n\n    <div *ngIf=\"tag.tagDescription.tag === 'external-video'\">\n      <croco-html-external-video-block (onTagUpdated)=\"tagUpdatedHandler($event)\" [tag]=\"tag\">\n      </croco-html-external-video-block>\n    </div>\n\n    <div *ngIf=\"tag.tagDescription.tag === 'html-raw'\">\n      <croco-html-html-raw-editor (onTagUpdated)=\"tagUpdatedHandler($event)\" [tag]=\"tag\">\n      </croco-html-html-raw-editor>\n    </div>\n\n  </div>\n\n  <div class=\"d-flex justify-content-between\">\n    <div class=\"d-flex justify-content-end align-self-center\">\n      <div>\n        <button *ngIf=\"tag.presentOrEdit\" (click)=\"tag.presentOrEdit = false\" mat-icon-button>\n          <mat-icon>edit</mat-icon>\n        </button>\n        <button *ngIf=\"!tag.presentOrEdit\" (click)=\"save()\" mat-icon-button>\n          <mat-icon>save</mat-icon>\n        </button>\n        <button (click)=\"deleteItem()\" mat-icon-button color=\"warn\">\n          <mat-icon>delete</mat-icon>\n        </button>\n      </div>\n    </div>\n\n  </div>\n</div>", styles: [""], components: [{ type: TextEditorComponent, selector: "croco-html-text-editor", inputs: ["tag"], outputs: ["onTagUpdated"] }, { type: ImageEditorComponent, selector: "croco-html-image-editor", inputs: ["tag"], outputs: ["onTagUpdated"] }, { type: ExternalVideoBlockComponent, selector: "croco-html-external-video-block", inputs: ["tag"], outputs: ["onTagUpdated"] }, { type: HtmlRawEditorComponent, selector: "croco-html-html-raw-editor", inputs: ["tag"], outputs: ["onTagUpdated"] }, { type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: MainEditorBlockComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-main-editor-block',
-                    templateUrl: './main-editor-block.component.html',
-                    styleUrls: ['./main-editor-block.component.css']
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { tag: [{
-                type: Input
-            }], onTagSaved: [{
-                type: Output
-            }], onTagRemoved: [{
-                type: Output
-            }] } });
-
-class DefaultTags {
-    static getTags(useHtmlRaw) {
-        var result = [...DefaultTags.tags];
-        if (useHtmlRaw) {
-            result.push(DefaultTags.htmlRawTag);
-        }
-        return result;
-    }
-}
-DefaultTags.tags = [
-    { tag: FileImageTagDataConsts.TagName, displayValue: 'Изображение' },
-    { tag: ExternalVideoTagDataConsts.TagName, displayValue: 'Внешнее видео Youtube' },
-    { tag: 'text', displayValue: 'Текст' },
-    { tag: 'h1', displayValue: 'Заголовок 1 уровня' },
-    { tag: 'h2', displayValue: 'Заголовок 2 уровня' },
-    { tag: 'h3', displayValue: 'Заголовок 3 уровня' },
-    { tag: 'h4', displayValue: 'Заголовок 4 уровня' },
-    { tag: 'h5', displayValue: 'Заголовок 5 уровня' },
-    { tag: 'h6', displayValue: 'Заголовок 6 уровня' },
-];
-DefaultTags.htmlRawTag = {
-    tag: HtmlRawTagDataConsts.TagName, displayValue: 'Html разметка'
-};
-class VisualEditorComponent {
-    constructor(_cdref) {
-        this._cdref = _cdref;
-        this.isLoading = false;
-        this.loadingText = "Идёт загрузка";
-        this.showMarkUp = true;
-        this.myForm = new FormGroup({
-            "html": new FormControl(),
-        });
-        this.tags = [];
-        this.useHtmlRaw = false;
-        this.html = "";
-        this.onHtmlChanged = new EventEmitter();
-        this.rendered = new EventEmitter();
-        this.bodyTags = [];
-    }
-    isHtmlSet() {
-        return this.html.startsWith("<body>");
-    }
-    clearHtml() {
-        this.html = "";
-        this.recalculateBodyTags();
-    }
-    getHtml() {
-        this.recalculateHtml();
-        return this.html;
-    }
-    ngAfterViewInit() {
-        this.rendered.emit(true);
-    }
-    ngAfterContentChecked() {
-        this._cdref.detectChanges();
-    }
-    addTag() {
-        let tagDescription = this.tags
-            .find(x => x.tag === this.selectedValue);
-        let attrs = {};
-        let innerHtml = "";
-        if (TextMethods.textTags.includes(tagDescription.tag)) {
-            attrs["h-align"] = "left";
-            innerHtml = "Введите ваш текст";
-        }
-        else if (tagDescription.tag == ExternalVideoTagDataConsts.TagName) {
-            attrs[ExternalVideoTagDataConsts.VideoTypeAttrName] = ExternalVideoSupportedTypes.Youtube;
-            attrs[ExternalVideoTagDataConsts.LinkAttrName] = null;
-        }
-        else {
-            attrs[FileImageTagDataConsts.FileIdAttrName] = null;
-        }
-        this.bodyTags.push({
-            tagDescription,
-            innerHtml,
-            attributes: attrs,
-            presentOrEdit: true
-        });
-        this.recalculateHtml();
-    }
-    postFilesStartedEventHandler(model) {
-        this.loadingText = "Файлы загружаются на сервер";
-        this.isLoading = true;
-    }
-    addTagCustom(tag) {
-        this.bodyTags.push(tag);
-        this.recalculateHtml();
-    }
-    filesTagsReadyHandler(tags) {
-        for (let i = 0; i < tags.length; i++) {
-            this.bodyTags.push(tags[i]);
-        }
-        this.recalculateHtml();
-        this.isLoading = false;
-    }
-    drop(event) {
-        moveItemInArray(this.bodyTags, event.previousIndex, event.currentIndex);
-        this.recalculateHtml();
-    }
-    onTagSavedHandler(tag) {
-        this.recalculateHtml();
-    }
-    onTagRemovedHandler(index) {
-        this.bodyTags.splice(index, 1);
-        this.recalculateHtml();
-    }
-    recalculateHtml() {
-        let result = BodyTagsExtensions.toHtml(this.bodyTags);
-        this.html = XmlExtensions.formatXml("<body>" + result + "</body>");
-        this.onHtmlChanged.emit(this.html);
-    }
-    recalculateBodyTags() {
-        this.bodyTags = BodyTagsExtensions.getBodyTags(this.html);
-    }
-    ngOnInit() {
-        this.recalculateBodyTags();
-        this.tags = DefaultTags.getTags(this.useHtmlRaw);
-        this.selectedValue = this.tags[0].tag;
-    }
-}
-VisualEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: VisualEditorComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-VisualEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: VisualEditorComponent, selector: "croco-visual-editor", inputs: { showMarkUp: "showMarkUp", useHtmlRaw: "useHtmlRaw", html: "html" }, outputs: { html: "html", onHtmlChanged: "onHtmlChanged", rendered: "rendered" }, ngImport: i0, template: "<div *ngIf=\"isLoading\">\n    <div>\n        <mat-spinner style=\"margin:0 auto;\"></mat-spinner>\n        <div style=\"text-align: center;\">{{loadingText}}</div>\n    </div>\n    <div style=\"height: 10px;\"></div>\n</div>\n\n<div [hidden]=\"isLoading\">\n    <div cdkDropList (cdkDropListDropped)=\"drop($event)\">\n        <div *ngFor=\"let tag of bodyTags; let i = index\" cdkDrag>\n            <mat-card>\n                <div class=\"d-flex justify-content-between\">\n                    <div class=\"example-handle\" cdkDragHandle>\n                        <svg width=\"24px\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n                            <path\n                                d=\"M10 9h4V6h3l-5-5-5 5h3v3zm-1 1H6V7l-5 5 5 5v-3h3v-4zm14 2l-5-5v3h-3v4h3v3l5-5zm-9 3h-4v3H7l5 5 5-5h-3v-3z\">\n                            </path>\n                            <path d=\"M0 0h24v24H0z\" fill=\"none\"></path>\n                        </svg>\n                    </div>\n                    <div>\n                        <mat-chip-list aria-label=\"Tag display value\">\n                            <mat-chip color=\"primary\" selected>{{tag.tagDescription.displayValue}}</mat-chip>\n                        </mat-chip-list>\n                    </div>\n                </div>\n    \n                <div style=\"height: 15px;\"></div>\n    \n                <croco-html-main-editor-block [tag]=\"tag\" \n                    (onTagSaved)=\"onTagSavedHandler($event)\"\n                    (onTagRemoved)=\"onTagRemovedHandler(i)\">\n                </croco-html-main-editor-block>\n            </mat-card>\n    \n            <div style=\"height: 10px;\">\n            </div>\n        </div>\n    </div>\n</div>\n\n\n<div [hidden]=\"isLoading\">\n    <mat-card>\n        <div class=\"row d-flex align-items-center\">\n            <div class=\"col-12\">\n                <mat-form-field class=\"w-100\" appearance=\"fill\">\n                    <mat-label>\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0442\u0435\u0433</mat-label>\n                    <mat-select [(ngModel)]=\"selectedValue\">\n                        <mat-option *ngFor=\"let tag of tags\" [value]=\"tag.tag\">\n                            {{tag.displayValue}}\n                        </mat-option>\n                    </mat-select>\n                </mat-form-field>\n            </div>\n            <div class=\"col-12\">\n                <button (click)=\"addTag()\" class=\"w-100\" mat-stroked-button>\n                    \u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0442\u0435\u0433\n                </button>\n            </div>\n        </div>\n    </mat-card>\n\n    <div style=\"height: 10px;\">\n    </div>\n</div>\n\n<div [hidden]=\"isLoading\">\n    <mat-card>\n        <div class=\"row d-flex align-items-center\">\n            <div class=\"col-12\">\n                <croco-add-files-btn \n                    (filesTagsReady)=\"filesTagsReadyHandler($event)\"\n                    (postFilesStarted)=\"postFilesStartedEventHandler($event)\"\n                    class=\"w-100\">\n                </croco-add-files-btn>\n            </div>\n        </div>\n    </mat-card>\n\n    <div style=\"height: 10px;\">\n    </div>\n</div>", styles: [".example-list{width:500px;max-width:100%;border:solid 1px #ccc;min-height:60px;display:block;background:white;border-radius:4px;overflow:hidden}.example-box{padding:20px 10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;cursor:move;background:white;font-size:14px}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], components: [{ type: i1$3.MatSpinner, selector: "mat-spinner", inputs: ["color"] }, { type: i2$3.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i3$1.MatChipList, selector: "mat-chip-list", inputs: ["aria-orientation", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "selectable", "tabIndex", "errorStateMatcher"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: MainEditorBlockComponent, selector: "croco-html-main-editor-block", inputs: ["tag"], outputs: ["onTagSaved", "onTagRemoved"] }, { type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i6.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i7.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: AddFilesBtnComponent, selector: "croco-add-files-btn", outputs: ["postFilesStarted", "filesTagsReady"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i11.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i11.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i3$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i5.MatLabel, selector: "mat-label" }, { type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: VisualEditorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-visual-editor',
-                    templateUrl: './visual-editor.component.html',
-                    styleUrls: ['./visual-editor.component.css']
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { showMarkUp: [{
-                type: Input
-            }], useHtmlRaw: [{
-                type: Input
-            }], html: [{
-                type: Input
-            }, {
-                type: Output
-            }], onHtmlChanged: [{
-                type: Output
-            }], rendered: [{
-                type: Output
-            }] } });
-
-class XmlTagTextViewComponent {
-    constructor() { }
-    ngOnInit() {
-    }
-}
-XmlTagTextViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagTextViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-XmlTagTextViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: XmlTagTextViewComponent, selector: "croco-html-xml-tag-text-view", inputs: { item: "item" }, ngImport: i0, template: "<div *ngIf=\"item.data.validationResult.isSucceeded && item.data.horizontalAlignment === 'left'\" style=\"text-align: left;\">\n    <span *ngIf=\"item.data.html.length === 0 || !item.data.html\">&nbsp;</span>\n    <span *ngIf=\"item.data.html.length > 0\" [innerHtml]=\"item.data.html\"></span>\n</div>\n\n<div *ngIf=\"item.data.validationResult.isSucceeded && item.data.horizontalAlignment === 'right'\" style=\"text-align: right;\">\n    <span *ngIf=\"item.data.html.length === 0 || !item.data.html\">&nbsp;</span>\n    <span *ngIf=\"item.data.html.length > 0\" [innerHtml]=\"item.data.html\"></span>\n</div>\n\n<div *ngIf=\"item.data.validationResult.isSucceeded && item.data.horizontalAlignment === 'center'\" style=\"text-align: center;\">\n    <span *ngIf=\"item.data.html.length === 0 || !item.data.html\">&nbsp;</span>\n    <span *ngIf=\"item.data.html.length > 0\" [innerHtml]=\"item.data.html\"></span>\n</div>\n\n<div *ngIf=\"!item.data.validationResult.isSucceeded\" class=\"red\" style=\"margin-top: 10px;\" >\n    <h4>\u0414\u043E\u043F\u0443\u0449\u0435\u043D\u0430 \u043E\u0448\u0438\u0431\u043A\u0430 \u0432 \u0442\u0435\u0433\u0435 &lt;text&gt;</h4>\n    <span>\n        {{item.data.validationResult.message}}\n    </span>\n</div>", styles: [""], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagTextViewComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-xml-tag-text-view',
-                    templateUrl: './xml-tag-text-view.component.html',
-                    styleUrls: ['./xml-tag-text-view.component.css']
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { item: [{
-                type: Input
-            }] } });
-
-class XmlTagHeaderInnerTextViewComponent {
-    constructor() { }
-    ngOnInit() {
-    }
-}
-XmlTagHeaderInnerTextViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagHeaderInnerTextViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-XmlTagHeaderInnerTextViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: XmlTagHeaderInnerTextViewComponent, selector: "croco-html-xml-tag-header-inner-text-view", inputs: { item: "item" }, ngImport: i0, template: "<h1 *ngIf=\"item.type === 'h1'\" \n    [innerHtml]=\"item.data.html\">\n</h1>\n<h2 *ngIf=\"item.type === 'h2'\" \n    [innerHtml]=\"item.data.html\">\n</h2>\n<h3 *ngIf=\"item.type === 'h3'\" \n    [innerHtml]=\"item.data.html\">\n</h3>\n<h4 *ngIf=\"item.type === 'h4'\" \n    [innerHtml]=\"item.data.html\">\n</h4>\n<h5 *ngIf=\"item.type === 'h5'\" \n    [innerHtml]=\"item.data.html\">\n</h5>\n<h6 *ngIf=\"item.type === 'h6'\" \n    [innerHtml]=\"item.data.html\">\n</h6>", styles: [""], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagHeaderInnerTextViewComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-xml-tag-header-inner-text-view',
-                    templateUrl: './xml-tag-header-inner-text-view.component.html',
-                    styleUrls: ['./xml-tag-header-inner-text-view.component.css']
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { item: [{
-                type: Input
-            }] } });
-
-class XmlTagHeaderTextViewComponent {
-    constructor() { }
-    ngOnInit() {
-    }
-}
-XmlTagHeaderTextViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagHeaderTextViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-XmlTagHeaderTextViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: XmlTagHeaderTextViewComponent, selector: "croco-html-xml-tag-header-text-view", inputs: { item: "item" }, ngImport: i0, template: "<div *ngIf=\"item.data.validationResult.isSucceeded && item.data.horizontalAlignment === 'left'\" style=\"text-align: left;\">\n    <span *ngIf=\"item.data.html.length === 0 || !item.data.html\">&nbsp;</span>\n    <croco-html-xml-tag-header-inner-text-view *ngIf=\"item.data.html.length > 0\"  [item]=\"item\">\n    </croco-html-xml-tag-header-inner-text-view>\n</div>\n\n<div *ngIf=\"item.data.validationResult.isSucceeded && item.data.horizontalAlignment === 'right'\" style=\"text-align: right;\">\n    <span *ngIf=\"item.data.html.length === 0 || !item.data.html\">&nbsp;</span>\n    <croco-html-xml-tag-header-inner-text-view *ngIf=\"item.data.html.length > 0\"  [item]=\"item\">\n    </croco-html-xml-tag-header-inner-text-view>\n</div>\n\n<div *ngIf=\"item.data.validationResult.isSucceeded && item.data.horizontalAlignment === 'center'\" style=\"text-align: center;\">\n    <span *ngIf=\"item.data.html.length === 0 || !item.data.html\">&nbsp;</span>\n\n    <croco-html-xml-tag-header-inner-text-view *ngIf=\"item.data.html.length > 0\"  [item]=\"item\">\n    </croco-html-xml-tag-header-inner-text-view>\n</div>\n\n<div *ngIf=\"!item.data.validationResult.isSucceeded\" class=\"red\" style=\"margin-top: 10px;\" >\n    <h4>\u0414\u043E\u043F\u0443\u0449\u0435\u043D\u0430 \u043E\u0448\u0438\u0431\u043A\u0430 \u0432 \u0442\u0435\u0433\u0435 &lt;text&gt;</h4>\n    <span>\n        {{item.data.validationResult.message}}\n    </span>\n</div>", styles: [""], components: [{ type: XmlTagHeaderInnerTextViewComponent, selector: "croco-html-xml-tag-header-inner-text-view", inputs: ["item"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagHeaderTextViewComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-xml-tag-header-text-view',
-                    templateUrl: './xml-tag-header-text-view.component.html',
-                    styleUrls: ['./xml-tag-header-text-view.component.css']
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { item: [{
-                type: Input
-            }] } });
-
-class XmlTagHtmlViewComponent {
-    constructor() {
-        this.html = "";
-    }
-}
-XmlTagHtmlViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagHtmlViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-XmlTagHtmlViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: XmlTagHtmlViewComponent, selector: "croco-html-xml-tag-html-view", inputs: { html: "html" }, ngImport: i0, template: "<div class=\"col\" [innerHTML]=\"html\">\n    \n</div>", styles: [""] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagHtmlViewComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-xml-tag-html-view',
-                    templateUrl: './xml-tag-html-view.component.html',
-                    styleUrls: ['./xml-tag-html-view.component.css']
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { html: [{
-                type: Input
-            }] } });
-
-class XmlTagViewComponent {
-    constructor() {
-        this.data = [];
-    }
-}
-XmlTagViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-XmlTagViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: XmlTagViewComponent, selector: "croco-html-xml-tag-view", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"\">\n    <div class=\"row\" *ngFor=\"let item of data\">\n        <div *ngIf=\"item.type === 'text'\">\n            <croco-html-xml-tag-text-view [item]=\"item\"></croco-html-xml-tag-text-view>\n        </div>\n        <div *ngIf=\"item.type === 'image'\" class=\"red\" style=\"margin-top: 10px;\" >\n            <h4>\u0414\u0430\u043D\u043D\u044B\u0439 \u0442\u0435\u0433 \u0431\u043E\u043B\u044C\u0448\u0435 \u0431\u043E\u043B\u044C\u0448\u0435 \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044F</h4>\n            <span>\n                \u0412\u043C\u0435\u0442\u043E \u044D\u0442\u043E\u0433\u043E \u043F\u0435\u0440\u0435\u0438\u043C\u0435\u043D\u0443\u0439\u0442\u0435 \u0442\u0435\u0433 image \u043D\u0430 file-image\n            </span>\n        </div>\n        <div *ngIf=\"item.type === 'html-raw'\" [innerHTML]=\"item.data.innerHTML\">\n        </div>\n        <div *ngIf=\"item.type === 'h1' || item.type === 'h2' || item.type === 'h3' || item.type === 'h4' || item.type === 'h5' || item.type === 'h6'\">\n            <croco-html-xml-tag-header-text-view [item]=\"item\"></croco-html-xml-tag-header-text-view>\n        </div>\n        <div *ngIf=\"item.type === 'file-image'\">\n            <img class=\"mx-auto d-block img-fluid\" [src]=\"item.data.src\"/>\n        </div>\n        <div *ngIf=\"item.type === 'table'\">\n    \n            <croco-html-xml-tag-html-view *ngIf=\"item.validationResult.isSucceeded\" [html]=\"item.bootstrapHtml\">\n            </croco-html-xml-tag-html-view>\n             \n            <app-tutor-baseapiresponse-banner \n                *ngIf=\"item.validationResult && !item.validationResult.isSucceeded\" \n                [message]=\"item.validationResult.message\">\n            </app-tutor-baseapiresponse-banner>\n        </div>\n    \n        <div *ngIf=\"item.type === 'rich-text'\">\n            <croco-html-xml-tag-text-view [richTextData]=\"item\"></croco-html-xml-tag-text-view>\n        </div>\n        <div *ngIf=\"item.type === 'external-video'\">\n            <croco-html-xml-tag-external-video [data]=\"item\"></croco-html-xml-tag-external-video>\n        </div>\n        <div *ngIf=\"item.type === 'unsupported-tag'\" class=\"red\" style=\"margin-top: 10px;\" >\n            <h4>\u0414\u0430\u043D\u043D\u044B\u0439 \u0442\u0435\u0433 \u043D\u0435 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044F</h4>\n            <span>\n                {{item.data.tagString}}\n            </span>\n        </div>\n    </div>\n</div>", styles: [".red{background-color:#c94444;color:#fff}\n"], components: [{ type: XmlTagTextViewComponent, selector: "croco-html-xml-tag-text-view", inputs: ["item"] }, { type: XmlTagHeaderTextViewComponent, selector: "croco-html-xml-tag-header-text-view", inputs: ["item"] }, { type: XmlTagHtmlViewComponent, selector: "croco-html-xml-tag-html-view", inputs: ["html"] }, { type: XmlTagExternalVideoComponent, selector: "croco-html-xml-tag-external-video", inputs: ["data", "tagData"] }], directives: [{ type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagViewComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-xml-tag-view',
-                    templateUrl: './xml-tag-view.component.html',
-                    styleUrls: ['./xml-tag-view.component.css'],
-                    encapsulation: ViewEncapsulation.None,
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { data: [{
-                type: Input
-            }] } });
-
-class ToPreviewPipe {
-    transform(value) {
-        return HtmlExtractionMethods.transformHtmlStringToBlocks(value);
-    }
-}
-ToPreviewPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ToPreviewPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-ToPreviewPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ToPreviewPipe, name: "topreview" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ToPreviewPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'topreview'
-                }]
-        }] });
-
-class MainEditorComponent {
-    constructor(_clipboardService, _snackBar, _cdref) {
-        this._clipboardService = _clipboardService;
-        this._snackBar = _snackBar;
-        this._cdref = _cdref;
-        this.visualEditorRendered = false;
-        this.showMarkUp = true;
-        this.useHtmlRaw = false;
-        this.myForm = new FormGroup({
-            "html": new FormControl(),
-        });
-        this.html = "";
-        this.onHtmlChanged = new EventEmitter();
-    }
-    ngAfterContentChecked() {
-        this._cdref.detectChanges();
-    }
-    visualEditorRenderedHandler() {
-        this.visualEditorRendered = true;
-        this.recalculateBodyTags();
-    }
-    onHtmlChangedHandler(html) {
-        this.html = html;
-        this.onHtmlChanged.emit(html);
-    }
-    textAreaModelChangedHandler() {
-        this.recalculateBodyTags();
-        this.onHtmlChangedHandler(this.html);
-    }
-    recalculateBodyTags() {
-        this.visualEditor.html = this.html;
-        this.visualEditor.recalculateBodyTags();
-    }
-    copyMarkUp() {
-        this._snackBar.open("Разметка таблицы скопирована в буфер обмена", "Закрыть", { duration: 1500 });
-        this._clipboardService.copy(this.html);
-    }
-    ngOnInit() {
-    }
-}
-MainEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: MainEditorComponent, deps: [{ token: i1$4.ClipboardService }, { token: i2$4.MatSnackBar }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-MainEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: MainEditorComponent, selector: "croco-html-main-editor", inputs: { showMarkUp: "showMarkUp", useHtmlRaw: "useHtmlRaw", html: "html" }, outputs: { html: "html", onHtmlChanged: "onHtmlChanged" }, viewQueries: [{ propertyName: "visualEditor", first: true, predicate: ["visualEditor"], descendants: true }], ngImport: i0, template: "<mat-tab-group>\n  <mat-tab label=\"\u0412\u0438\u0437\u0443\u0430\u043B\u044C\u043D\u044B\u0439 \u0440\u0435\u0434\u0430\u043A\u0442\u043E\u0440\">\n\n    <div style=\"height: 20px;\"></div>\n\n    <croco-visual-editor #visualEditor\n      [useHtmlRaw]=\"useHtmlRaw\"\n      [html]=\"html\"\n      (onHtmlChanged)=\"onHtmlChangedHandler($event)\"\n      (rendered)=\"visualEditorRenderedHandler()\">\n    </croco-visual-editor>\n\n    <div style=\"height: 20px;\"></div>\n\n  </mat-tab>\n\n  <mat-tab label=\"\u0420\u0430\u0437\u043C\u0435\u0442\u043A\u0430\">\n    <div style=\"height: 10px;\"></div>\n    <form *ngIf=\"visualEditorRendered\" [formGroup]=\"myForm\">\n      <mat-form-field class=\"w-100\">\n        <textarea matInput cdkTextareaAutosize #autosize=\"cdkTextareaAutosize\"\n          cdkAutosizeMinRows=\"1\"\n          placeholder=\"\u0418\u0441\u0445\u043E\u0434\u043D\u044B\u0439 \u043A\u043E\u0434\" formControlName=\"html\" [(ngModel)]=\"html\"\n          (ngModelChange)=\"textAreaModelChangedHandler()\"></textarea>\n      </mat-form-field>\n    </form>\n\n    <button (click)=\"copyMarkUp()\" \n      mat-raised-button color=\"primary\">\n      \u041A\u043E\u043F\u0438\u0440\u043E\u0432\u0430\u0442\u044C \u0440\u0430\u0437\u043C\u0435\u0442\u043A\u0443\n    </button>\n  </mat-tab>\n  <mat-tab label=\"\u0420\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\">\n    <mat-card>\n      <croco-html-xml-tag-view [data]=\"html | topreview\">\n      </croco-html-xml-tag-view>\n    </mat-card>\n  </mat-tab>\n</mat-tab-group>", styles: [".example-list{width:500px;max-width:100%;border:solid 1px #ccc;min-height:60px;display:block;background:white;border-radius:4px;overflow:hidden}.example-box{padding:20px 10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;cursor:move;background:white;font-size:14px}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], components: [{ type: i3$2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { type: i3$2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby"], exportAs: ["matTab"] }, { type: VisualEditorComponent, selector: "croco-visual-editor", inputs: ["showMarkUp", "useHtmlRaw", "html"], outputs: ["html", "onHtmlChanged", "rendered"] }, { type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i2$3.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: XmlTagViewComponent, selector: "croco-html-xml-tag-view", inputs: ["data"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { type: i4.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i5$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5$1.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "topreview": ToPreviewPipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: MainEditorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-main-editor',
-                    templateUrl: './main-editor.component.html',
-                    styleUrls: ['./main-editor.component.css']
-                }]
-        }], ctorParameters: function () { return [{ type: i1$4.ClipboardService }, { type: i2$4.MatSnackBar }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { visualEditor: [{
-                type: ViewChild,
-                args: ["visualEditor"]
-            }], showMarkUp: [{
-                type: Input
-            }], useHtmlRaw: [{
-                type: Input
-            }], html: [{
-                type: Input
-            }, {
-                type: Output
-            }], onHtmlChanged: [{
-                type: Output
-            }] } });
-
-class RichTextToHtmlPipe {
-    transform(value) {
-        let result = "";
-        for (let i = 0; i < value.data.children.length; i++) {
-            const child = value.data.children[i];
-            if (child.type === "text-block") {
-                result += `<span>${child.data.text}</span>`;
-            }
-            else if (child.type === "line-break") {
-                result += "</br>";
-            }
-        }
-        return result;
-    }
-}
-RichTextToHtmlPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: RichTextToHtmlPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-RichTextToHtmlPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: RichTextToHtmlPipe, name: "richTextToHtml" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: RichTextToHtmlPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'richTextToHtml'
-                }]
-        }] });
-
-class XmlTagRichTextViewComponent {
-    constructor() {
-        this.richTextData = null;
-    }
-    ngOnInit() {
-    }
-}
-XmlTagRichTextViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagRichTextViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-XmlTagRichTextViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: XmlTagRichTextViewComponent, selector: "croco-html-xml-tag-rich-text-view", inputs: { richTextData: "richTextData" }, ngImport: i0, template: "<div *ngIf=\"richTextData\" [innerHtml]=\"richTextData | richTextToHtml\">\n</div>", styles: [""], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "richTextToHtml": RichTextToHtmlPipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagRichTextViewComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-xml-tag-rich-text-view',
-                    templateUrl: './xml-tag-rich-text-view.component.html',
-                    styleUrls: ['./xml-tag-rich-text-view.component.css']
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { richTextData: [{
-                type: Input
-            }] } });
-
-class XmlTagTableViewComponent {
-    constructor() {
-        this.displayedColumns = [];
-    }
-}
-XmlTagTableViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagTableViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-XmlTagTableViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: XmlTagTableViewComponent, selector: "croco-html-xml-tag-table-view", inputs: { displayedColumns: "displayedColumns", data: "data" }, ngImport: i0, template: "<table mat-table [dataSource]=\"data\" class=\"mat-elevation-z8 w-100 example-container\">\n    <ng-container [matColumnDef]=\"column\" *ngFor=\"let column of displayedColumns\">\n        <th mat-header-cell *matHeaderCellDef> {{column}} </th>\n        <td mat-cell *matCellDef=\"let element\"> {{element[column]}} </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n</table>", styles: [""], components: [{ type: i1$5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i1$5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i1$5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }], directives: [{ type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i1$5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i1$5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i1$5.MatCellDef, selector: "[matCellDef]" }, { type: i1$5.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i1$5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i1$5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: XmlTagTableViewComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'croco-html-xml-tag-table-view',
-                    templateUrl: './xml-tag-table-view.component.html',
-                    styleUrls: ['./xml-tag-table-view.component.css']
-                }]
-        }], propDecorators: { displayedColumns: [{
-                type: Input
-            }], data: [{
-                type: Input
-            }] } });
-
-class TagToSpanPipe {
-    transform(value) {
-        return value.map(x => (`<b>${x}</b>`)).join(' | ');
-    }
-}
-TagToSpanPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: TagToSpanPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-TagToSpanPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: TagToSpanPipe, name: "tagToSpan" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: TagToSpanPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'tagToSpan'
-                }]
-        }] });
-
-class ToHtmlBodyTagsPipe {
-    transform(value) {
-        return BodyTagsExtensions.getBodyTags(value);
-    }
-}
-ToHtmlBodyTagsPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ToHtmlBodyTagsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-ToHtmlBodyTagsPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ToHtmlBodyTagsPipe, name: "tohtmlbodytags" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: ToHtmlBodyTagsPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'tohtmlbodytags'
-                }]
-        }] });
-
-class TableBuilder {
-    static getTableMarkUp(rows, cols, generateHeaders) {
-        rows = +rows;
-        cols = +cols;
-        let result = "<table>";
-        if (generateHeaders) {
-            result += TableBuilder.getTableHeaderMarkUp(cols);
-        }
-        result += TableBuilder.getTableBodyMarkUp(cols, rows);
-        result += "</table>";
-        return XmlExtensions.formatXml(result);
-    }
-    static getTableHeaderMarkUp(cols) {
-        let result = "<thead><tr>";
-        for (let i = 0; i < cols; i++) {
-            result += `<th>Колонка #${i + 1}</th>`;
-        }
-        result += "</tr></thead>";
-        return result;
-    }
-    static getTableBodyMarkUp(cols, rows) {
-        let result = "<tbody>";
-        for (let row = 0; row < rows; row++) {
-            result += "<tr>";
-            for (let i = 0; i < cols; i++) {
-                result += `<td>Ряд№${row + 1} Колонка #${i + 1}</td>`;
-            }
-            result += "</tr>";
-        }
-        result += "</tbody>";
-        return result;
-    }
-}
-
-const EditorComponents = [
-    MainEditorComponent,
-    FileIdSelectComponent,
-    TextEditorComponent,
-    ExternalVideoBlockComponent,
-    ImageEditorComponent,
-    MainEditorBlockComponent,
-    VisualEditorComponent,
-    AddFilesBtnComponent,
-    HtmlRawEditorComponent,
-];
-const XmlComponents = [
-    XmlTagTableViewComponent,
-    XmlTagViewComponent,
-    XmlTagRichTextViewComponent,
-    XmlTagHtmlViewComponent,
-    XmlTagTextViewComponent,
-    XmlTagHeaderTextViewComponent,
-    XmlTagHeaderInnerTextViewComponent,
-    XmlTagExternalVideoComponent
-];
-const CrocoPipes = [
-    RichTextToHtmlPipe,
-    TagToSpanPipe,
-    ToPreviewPipe,
-    ToHtmlBodyTagsPipe,
-];
-const CrocoHtmlDeclarations = [
-    UploadFilesBtnComponent,
-    ...XmlComponents,
-    ...EditorComponents,
-    ...CrocoPipes
-];
-const MaterialModules = [
-    MatBadgeModule,
-    MatTableModule,
-    MatExpansionModule,
-    MatFormFieldModule,
-    MatSnackBarModule,
-    MatProgressBarModule,
-    MatProgressSpinnerModule,
-    MatTabsModule,
-    MatMenuModule,
-    MatCardModule,
-    MatSelectModule,
-    MatTooltipModule,
-    MatCheckboxModule,
-    MatChipsModule,
-    MatListModule,
-    MatButtonModule,
-    MatInputModule,
-    MatDialogModule,
-    MatPaginatorModule,
-    MatDatepickerModule,
-    MatGridListModule,
-    MatSlideToggleModule,
-    MatTreeModule,
-    MatNativeDateModule,
-    MatAutocompleteModule,
-    MatSidenavModule,
-    MatIconModule,
-    DragDropModule,
-    MatButtonToggleModule
-];
-
-class CrocoHtmlModule {
-}
-CrocoHtmlModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: CrocoHtmlModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-CrocoHtmlModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: CrocoHtmlModule, declarations: [UploadFilesBtnComponent, XmlTagTableViewComponent, XmlTagViewComponent, XmlTagRichTextViewComponent, XmlTagHtmlViewComponent, XmlTagTextViewComponent, XmlTagHeaderTextViewComponent, XmlTagHeaderInnerTextViewComponent, XmlTagExternalVideoComponent, MainEditorComponent, FileIdSelectComponent, TextEditorComponent, ExternalVideoBlockComponent, ImageEditorComponent, MainEditorBlockComponent, VisualEditorComponent, AddFilesBtnComponent, HtmlRawEditorComponent, RichTextToHtmlPipe, TagToSpanPipe, ToPreviewPipe, ToHtmlBodyTagsPipe], imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        NgSelectModule, i23.MatBadgeModule, i1$5.MatTableModule, i25.MatExpansionModule, i5.MatFormFieldModule, i2$4.MatSnackBarModule, i28.MatProgressBarModule, i1$3.MatProgressSpinnerModule, i3$2.MatTabsModule, i31.MatMenuModule, i2$3.MatCardModule, i6.MatSelectModule, i34.MatTooltipModule, i35.MatCheckboxModule, i3$1.MatChipsModule, i37.MatListModule, i2.MatButtonModule, i5$2.MatInputModule, i40.MatDialogModule, i41.MatPaginatorModule, i42.MatDatepickerModule, i43.MatGridListModule, i44.MatSlideToggleModule, i45.MatTreeModule, i7.MatNativeDateModule, i47.MatAutocompleteModule, i48.MatSidenavModule, i2$2.MatIconModule, i11.DragDropModule, i1$2.MatButtonToggleModule], exports: [UploadFilesBtnComponent, XmlTagTableViewComponent, XmlTagViewComponent, XmlTagRichTextViewComponent, XmlTagHtmlViewComponent, XmlTagTextViewComponent, XmlTagHeaderTextViewComponent, XmlTagHeaderInnerTextViewComponent, XmlTagExternalVideoComponent, MainEditorComponent, FileIdSelectComponent, TextEditorComponent, ExternalVideoBlockComponent, ImageEditorComponent, MainEditorBlockComponent, VisualEditorComponent, AddFilesBtnComponent, HtmlRawEditorComponent, RichTextToHtmlPipe, TagToSpanPipe, ToPreviewPipe, ToHtmlBodyTagsPipe] });
-CrocoHtmlModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: CrocoHtmlModule, imports: [[
-            CommonModule,
-            FormsModule,
-            ReactiveFormsModule,
-            NgSelectModule,
-            ...MaterialModules
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: CrocoHtmlModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        ...CrocoHtmlDeclarations
-                    ],
-                    exports: [
-                        ...CrocoHtmlDeclarations,
-                    ],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        NgSelectModule,
-                        ...MaterialModules
-                    ]
-                }]
-        }] });
-
-/*
- * Public API Surface of croco-html
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { AddFilesBtnComponent, AngularMaterialTableMethods, BodyTagsExtensions, BootstrapTableMethods, CrocoHtmlModule, DefaultTags, ExternalVideoBlockComponent, ExternalVideoSupportedTypes, ExternalVideoTagDataConsts, FileIdSelectComponent, FileImageTagDataConsts, HtmlRawEditorComponent, ImageEditorComponent, ImageMethods, MainEditorBlockComponent, MainEditorComponent, RichTextToHtmlPipe, TableBuilder, TableMethods, TableTypes, TagToSpanPipe, TextEditorComponent, TextMethods, TextSimpleMethods, TextTag, ToHtmlBodyTagsPipe, ToPreviewPipe, UploadFilesBtnComponent, VideoMethods, VisualEditorComponent, XmlExtensions, XmlTagExternalVideoComponent, XmlTagHeaderInnerTextViewComponent, XmlTagHeaderTextViewComponent, XmlTagHtmlViewComponent, XmlTagRichTextViewComponent, XmlTagTableViewComponent, XmlTagTextViewComponent, XmlTagViewComponent };
-//# sourceMappingURL=croco-html.js.map