@progress/kendo-angular-editor 3.1.2 → 4.0.0-next.202203161118

package/{dist/es2015 → esm2015}/editor.component.js

@@ -2,14 +2,11 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import * as tslib_1 from "tslib";
-var EditorComponent_1;
-import { Component, HostBinding, ViewChild, ContentChild, ViewContainerRef, Output, ElementRef, EventEmitter, forwardRef, Input, ChangeDetectorRef, NgZone, isDevMode } from '@angular/core';
+import { Component, HostBinding, ViewChild, ContentChild, ViewContainerRef, Output, ElementRef, EventEmitter, forwardRef, Input, isDevMode } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 import { BehaviorSubject, fromEvent, Subject, zip } from 'rxjs';
 import { map, filter, take } from 'rxjs/operators';
 import { ToolBarComponent } from '@progress/kendo-angular-toolbar';
-import { DialogService } from '@progress/kendo-angular-dialog';
 import { hasObservers, isDocumentAvailable, KendoInput } from '@progress/kendo-angular-common';
 import { buildKeymap, buildListKeymap, getHtml, pasteCleanup, sanitize, removeComments, sanitizeClassAttr, sanitizeStyleAttr, removeAttribute, placeholder, EditorView, EditorState, baseKeymap, keymap, history, parseContent, Plugin, PluginKey, TextSelection, Schema, AllSelection, gapCursor, getSelectionText, imageResizing, tableEditing, caretColor } from '@progress/kendo-editor-common';
 import { validatePackage } from '@progress/kendo-licensing';
@@ -25,8 +22,32 @@ import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
 import { EditorLocalizationService } from './localization/editor-localization.service';
 import { defaultStyle, tablesStyles, rtlStyles } from './common/styles';
 import { EditorErrorMessages } from './common/error-messages';
+import { ProviderService } from './common/provider.service';
 import { EditorToolsService } from './tools/tools.service';
 import { EditorPasteEvent } from './preventable-events/paste-event';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-dialog";
+import * as i2 from "@progress/kendo-angular-l10n";
+import * as i3 from "./common/provider.service";
+import * as i4 from "./tools/tools.service";
+import * as i5 from "@progress/kendo-angular-toolbar";
+import * as i6 from "./tools/format/editor-format.component";
+import * as i7 from "./localization/localized-messages.directive";
+import * as i8 from "@angular/common";
+import * as i9 from "./tools/typographical-emphasis/editor-bold-button.directive";
+import * as i10 from "./tools/typographical-emphasis/editor-italic-button.directive";
+import * as i11 from "./tools/typographical-emphasis/editor-underline-button.directive";
+import * as i12 from "./tools/alignment/editor-align-left-button.directive";
+import * as i13 from "./tools/alignment/editor-align-center-button.directive";
+import * as i14 from "./tools/alignment/editor-align-right-button.directive";
+import * as i15 from "./tools/alignment/editor-align-justify-button.directive";
+import * as i16 from "./tools/list/editor-insert-unordered-list-button.directive";
+import * as i17 from "./tools/list/editor-insert-ordered-list-button.directive";
+import * as i18 from "./tools/indentation/editor-indent-button.directive";
+import * as i19 from "./tools/indentation/editor-outdent-button.directive";
+import * as i20 from "./tools/link/editor-create-link-button.directive";
+import * as i21 from "./tools/link/editor-unlink-button.directive";
+import * as i22 from "./tools/image/editor-insert-image-button.directive";
 const EMPTY_PARAGRAPH = '<p></p>';
 const defaultPasteCleanupSettings = {
     convertMsLists: false,
@@ -47,19 +68,19 @@ const getPasteCleanupAttributes = (config) => {
         style: config.removeMsStyles ? sanitizeStyleAttr : undefined,
         class: config.removeMsClasses ? sanitizeClassAttr : undefined
     });
-    return config.removeAttributes.reduce((acc, curr) => (Object.assign({}, acc, { [curr]: removeAttribute })), initial);
+    return config.removeAttributes.reduce((acc, curr) => (Object.assign(Object.assign({}, acc), { [curr]: removeAttribute })), initial);
 };
-const ɵ0 = getPasteCleanupAttributes;
 /**
  * Represents the [Kendo UI Editor component for Angular]({% slug overview_editor %}).
  */
-let EditorComponent = EditorComponent_1 = class EditorComponent {
-    constructor(dialogService, localization, cdr, ngZone, element, toolsService) {
+export class EditorComponent {
+    constructor(dialogService, localization, cdr, ngZone, element, providerService, toolsService) {
         this.dialogService = dialogService;
         this.localization = localization;
         this.cdr = cdr;
         this.ngZone = ngZone;
         this.element = element;
+        this.providerService = providerService;
         this.toolsService = toolsService;
         /**
          * If set to `false`, the Editor will run in style non-encapsulated mode. This means
@@ -139,7 +160,7 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
             }
         };
         this.transformPastedHTML = (dirtyHtml) => {
-            const pasteCleanupSettings = Object.assign({}, defaultPasteCleanupSettings, this.pasteCleanupSettings);
+            const pasteCleanupSettings = Object.assign(Object.assign({}, defaultPasteCleanupSettings), this.pasteCleanupSettings);
             const html = pipe(removeInvalidHTMLIf(pasteCleanupSettings.removeInvalidHTML), removeCommentsIf(pasteCleanupSettings.removeHtmlComments))(dirtyHtml);
             const clean = pasteCleanup(html, {
                 convertMsLists: pasteCleanupSettings.convertMsLists,
@@ -188,6 +209,7 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
             return false;
         };
         validatePackage(packageMetadata);
+        this.providerService.editor = this;
         this.direction = localization.rtl ? 'rtl' : 'ltr';
         // https://stackoverflow.com/questions/56572483/chrome-is-synchronously-handling-iframe-loading-whereas-firefox-handles-it-asyn
         this.subs = zip(this.afterViewInit.asObservable(), this.contentAreaLoaded.asObservable()).subscribe(() => this.initialize());
@@ -766,177 +788,203 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
             }
         });
     }
-};
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [String])
-], EditorComponent.prototype, "value", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [Boolean])
-], EditorComponent.prototype, "disabled", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [Boolean])
-], EditorComponent.prototype, "readonly", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Boolean)
-], EditorComponent.prototype, "iframe", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Object)
-], EditorComponent.prototype, "applyToWord", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Schema),
-    tslib_1.__metadata("design:paramtypes", [Schema])
-], EditorComponent.prototype, "schema", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Function),
-    tslib_1.__metadata("design:paramtypes", [Function])
-], EditorComponent.prototype, "plugins", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [String])
-], EditorComponent.prototype, "placeholder", null);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Object)
-], EditorComponent.prototype, "preserveWhitespace", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Object)
-], EditorComponent.prototype, "pasteCleanupSettings", void 0);
-tslib_1.__decorate([
-    Input(),
-    tslib_1.__metadata("design:type", Object)
-], EditorComponent.prototype, "resizable", void 0);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], EditorComponent.prototype, "valueChange", void 0);
-tslib_1.__decorate([
-    Output('focus'),
-    tslib_1.__metadata("design:type", EventEmitter)
-], EditorComponent.prototype, "onFocus", void 0);
-tslib_1.__decorate([
-    Output(),
-    tslib_1.__metadata("design:type", EventEmitter)
-], EditorComponent.prototype, "paste", void 0);
-tslib_1.__decorate([
-    Output('blur'),
-    tslib_1.__metadata("design:type", EventEmitter)
-], EditorComponent.prototype, "onBlur", void 0);
-tslib_1.__decorate([
-    HostBinding('class.k-editor'),
-    tslib_1.__metadata("design:type", Boolean)
-], EditorComponent.prototype, "hostClass", void 0);
-tslib_1.__decorate([
-    HostBinding('class.k-editor-resizable'),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [])
-], EditorComponent.prototype, "resizableClass", null);
-tslib_1.__decorate([
-    HostBinding('class.k-disabled'),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [])
-], EditorComponent.prototype, "isDisabled", null);
-tslib_1.__decorate([
-    HostBinding('class.k-readonly'),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [])
-], EditorComponent.prototype, "isReadonly", null);
-tslib_1.__decorate([
-    HostBinding('class.k-ie'),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [])
-], EditorComponent.prototype, "isIE", null);
-tslib_1.__decorate([
-    HostBinding('attr.dir'),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [])
-], EditorComponent.prototype, "dir", null);
-tslib_1.__decorate([
-    HostBinding('attr.ariaDisabled'),
-    tslib_1.__metadata("design:type", Boolean),
-    tslib_1.__metadata("design:paramtypes", [])
-], EditorComponent.prototype, "ariaDisabled", null);
-tslib_1.__decorate([
-    HostBinding('style.minWidth'),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [])
-], EditorComponent.prototype, "minWidth", null);
-tslib_1.__decorate([
-    HostBinding('style.maxWidth'),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [])
-], EditorComponent.prototype, "maxWidth", null);
-tslib_1.__decorate([
-    HostBinding('style.minHeight'),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [])
-], EditorComponent.prototype, "minHeight", null);
-tslib_1.__decorate([
-    HostBinding('style.maxHeight'),
-    tslib_1.__metadata("design:type", String),
-    tslib_1.__metadata("design:paramtypes", [])
-], EditorComponent.prototype, "maxHeight", null);
-tslib_1.__decorate([
-    ContentChild(ToolBarComponent, { static: false }),
-    tslib_1.__metadata("design:type", ToolBarComponent)
-], EditorComponent.prototype, "userToolBarComponent", void 0);
-tslib_1.__decorate([
-    ContentChild(ToolBarComponent, { read: ElementRef, static: false }),
-    tslib_1.__metadata("design:type", ElementRef)
-], EditorComponent.prototype, "userToolBarElement", void 0);
-tslib_1.__decorate([
-    ViewChild('dialogsContainer', { read: ViewContainerRef, static: true }),
-    tslib_1.__metadata("design:type", ViewContainerRef)
-], EditorComponent.prototype, "dialogContainer", void 0);
-tslib_1.__decorate([
-    ViewChild('content', { read: ViewContainerRef, static: false }),
-    tslib_1.__metadata("design:type", ViewContainerRef)
-], EditorComponent.prototype, "container", void 0);
-tslib_1.__decorate([
-    ViewChild('defaultToolbar', { read: ElementRef, static: false }),
-    tslib_1.__metadata("design:type", ElementRef)
-], EditorComponent.prototype, "defaultToolbar", void 0);
-tslib_1.__decorate([
-    ViewChild('defaultToolbar', { read: ToolBarComponent, static: false }),
-    tslib_1.__metadata("design:type", ToolBarComponent)
-], EditorComponent.prototype, "defaultToolbarComponent", void 0);
-EditorComponent = EditorComponent_1 = tslib_1.__decorate([
-    Component({
-        selector: 'kendo-editor',
-        providers: [
-            EditorLocalizationService,
-            EditorToolsService,
-            {
-                provide: LocalizationService,
-                useExisting: EditorLocalizationService
-            },
-            {
-                provide: L10N_PREFIX,
-                useValue: 'kendo.editor'
-            },
-            {
-                provide: NG_VALUE_ACCESSOR,
-                useExisting: forwardRef(() => EditorComponent_1),
-                multi: true
-            },
-            {
-                provide: KendoInput,
-                useExisting: forwardRef(() => EditorComponent_1)
-            }
-        ],
-        /* tslint:disable:max-line-length */
-        template: `
+}
+EditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: EditorComponent, deps: [{ token: i1.DialogService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i0.ElementRef }, { token: i3.ProviderService }, { token: i4.EditorToolsService }], target: i0.ɵɵFactoryTarget.Component });
+EditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: EditorComponent, selector: "kendo-editor", inputs: { value: "value", disabled: "disabled", readonly: "readonly", iframe: "iframe", applyToWord: "applyToWord", schema: "schema", plugins: "plugins", placeholder: "placeholder", preserveWhitespace: "preserveWhitespace", pasteCleanupSettings: "pasteCleanupSettings", resizable: "resizable" }, outputs: { valueChange: "valueChange", onFocus: "focus", paste: "paste", onBlur: "blur" }, host: { properties: { "class.k-editor": "this.hostClass", "class.k-editor-resizable": "this.resizableClass", "class.k-disabled": "this.isDisabled", "class.k-readonly": "this.isReadonly", "class.k-ie": "this.isIE", "attr.dir": "this.dir", "attr.ariaDisabled": "this.ariaDisabled", "style.minWidth": "this.minWidth", "style.maxWidth": "this.maxWidth", "style.minHeight": "this.minHeight", "style.maxHeight": "this.maxHeight" } }, providers: [
+        EditorLocalizationService,
+        ProviderService,
+        EditorToolsService,
+        {
+            provide: LocalizationService,
+            useExisting: EditorLocalizationService
+        },
+        {
+            provide: L10N_PREFIX,
+            useValue: 'kendo.editor'
+        },
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: forwardRef(() => EditorComponent),
+            multi: true
+        },
+        {
+            provide: KendoInput,
+            useExisting: forwardRef(() => EditorComponent)
+        }
+    ], queries: [{ propertyName: "userToolBarComponent", first: true, predicate: ToolBarComponent, descendants: true }, { propertyName: "userToolBarElement", first: true, predicate: ToolBarComponent, descendants: true, read: ElementRef }], viewQueries: [{ propertyName: "dialogContainer", first: true, predicate: ["dialogsContainer"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "container", first: true, predicate: ["content"], descendants: true, read: ViewContainerRef }, { propertyName: "defaultToolbar", first: true, predicate: ["defaultToolbar"], descendants: true, read: ElementRef }, { propertyName: "defaultToolbarComponent", first: true, predicate: ["defaultToolbar"], descendants: true, read: ToolBarComponent }], usesOnChanges: true, ngImport: i0, template: `
+        <ng-container
+            kendoEditorLocalizedMessages
+            i18n-alignCenter="kendo.editor.alignCenter|The title of the tool that aligns text in the center."
+            alignCenter="Center text"
+            i18n-alignJustify="kendo.editor.alignJustify|The title of the tool that justifies text both left and right."
+            alignJustify="Justify"
+            i18n-alignLeft="kendo.editor.alignLeft|The title of the tool that aligns text on the left."
+            alignLeft="Align text left"
+            i18n-alignRight="kendo.editor.alignRight|The title of the tool that aligns text on the right."
+            alignRight="Align text right"
+            i18n-backColor="kendo.editor.backColor|The title of the tool that changes the text background color."
+            backColor="Background color"
+            i18n-blockquote="kendo.editor.blockquote|The title of the tool that wraps an element in a blockquote"
+            blockquote="Quotation"
+            i18n-bold="kendo.editor.bold|The title of the tool that makes text bold."
+            bold="Bold"
+            i18n-cleanFormatting="kendo.editor.cleanFormatting|The title of the Clean Formatting tool."
+            cleanFormatting="Clean formatting"
+            i18n-createLink="kendo.editor.createLink|The title of the tool that creates hyperlinks."
+            createLink="Insert link"
+            i18n-dialogApply="kendo.editor.dialogApply|The label of the **Apply** button in all editor dialogs."
+            dialogApply="Apply"
+            i18n-dialogCancel="kendo.editor.dialogCancel|The label of the **Cancel** button in all editor dialogs."
+            dialogCancel="Cancel"
+            i18n-dialogInsert="kendo.editor.dialogInsert|The label of the **Insert** button in all editor dialogs."
+            dialogInsert="Insert"
+            i18n-dialogUpdate="kendo.editor.dialogUpdate|The label of the **Update** button in all editor dialogs."
+            dialogUpdate="Update"
+            i18n-fileText="kendo.editor.fileText|The caption for the file text in the insertFile dialog."
+            fileText="Text"
+            i18n-fileTitle="kendo.editor.fileTitle|The caption for the file Title in the insertFile dialog."
+            fileTitle="Title"
+            i18n-fileWebAddress="kendo.editor.fileWebAddress|The caption for the file URL in the insertFile dialog."
+            fileWebAddress="Web address"
+            i18n-fontFamily="kendo.editor.fontFamily|The title of the tool that changes the text font."
+            fontFamily="Select font family"
+            i18n-fontSize="kendo.editor.fontSize|The title of the tool that changes the text size."
+            fontSize="Select font size"
+            i18n-foreColor="kendo.editor.foreColor|The title of the tool that changes the text color."
+            foreColor="Color"
+            i18n-format="kendo.editor.format|The title of the tool that lets users choose block formats."
+            format="Format"
+            i18n-imageAltText="kendo.editor.imageAltText|The caption for the image alternate text in the insertImage dialog."
+            imageAltText="Alternate text"
+            i18n-imageHeight="kendo.editor.imageHeight|The caption for the image height in the insertImage dialog."
+            imageHeight="Height (px)"
+            i18n-imageWebAddress="kendo.editor.imageWebAddress|The caption for the image URL in the insertImage dialog."
+            imageWebAddress="Web address"
+            i18n-imageWidth="kendo.editor.imageWidth|The caption for the image width in the insertImage dialog."
+            imageWidth="Width (px)"
+            i18n-indent="kendo.editor.indent|The title of the tool that indents the content."
+            indent="Indent"
+            i18n-insertFile="kendo.editor.insertFile|The title of the tool that inserts links to files."
+            insertFile="Insert file"
+            i18n-insertImage="kendo.editor.insertImage|The title of the tool that inserts images."
+            insertImage="Insert image"
+            i18n-insertOrderedList="kendo.editor.insertOrderedList|The title of the tool that inserts an ordered list."
+            insertOrderedList="Insert ordered list"
+            i18n-insertUnorderedList="kendo.editor.insertUnorderedList|The title of the tool that inserts an unordered list."
+            insertUnorderedList="Insert unordered list"
+            i18n-italic="kendo.editor.italic|The title of the tool that makes text italicized."
+            italic="Italic"
+            i18n-linkOpenInNewWindow="kendo.editor.linkOpenInNewWindow|The caption for the checkbox for opening the link in a new window in the createLink dialog."
+            linkOpenInNewWindow="Open link in new window"
+            i18n-linkText="kendo.editor.linkText|The caption for the link text in the createLink dialog."
+            linkText="Text"
+            i18n-linkTitle="kendo.editor.linkTitle|The caption for the link title in the createLink dialog."
+            linkTitle="Title"
+            i18n-linkWebAddress="kendo.editor.linkWebAddress|The caption for the URL in the createLink dialog."
+            linkWebAddress="Web address"
+            i18n-outdent="kendo.editor.outdent|The title of the tool that outdents the content."
+            outdent="Outdent"
+            i18n-print="kendo.editor.print|The title of the print tool."
+            print="Print"
+            i18n-redo="kendo.editor.redo|The title of the tool that undos the last action."
+            redo="Redo"
+            i18n-selectAll="kendo.editor.selectAll|The title of the tool that selects all content."
+            selectAll="Select All"
+            i18n-strikethrough="kendo.editor.strikethrough|The title of the tool that strikes through text."
+            strikethrough="Strikethrough"
+            i18n-subscript="kendo.editor.subscript|The title of the tool that makes text subscript."
+            subscript="Subscript"
+            i18n-superscript="kendo.editor.superscript|The title of the tool that makes text superscript."
+            superscript="Superscript"
+            i18n-underline="kendo.editor.underline|The title of the tool that underlines text."
+            underline="Underline"
+            i18n-unlink="kendo.editor.unlink|The title of the tool that removes hyperlinks."
+            unlink="Remove Link"
+            i18n-undo="kendo.editor.undo|The title of the tool that undos the last action."
+            undo="Undo"
+            i18n-viewSource="kendo.editor.viewSource|The title of the tool that shows the editor value as HTML."
+            viewSource="View source"
+            i18n-insertTable="kendo.editor.insertTable|The title of the tool that inserts table."
+            insertTable="Insert Table"
+            i18n-addColumnBefore="kendo.editor.addColumnBefore|The title of the tool that adds new column before currently selected column."
+            addColumnBefore="Add column before"
+            i18n-addColumnAfter="kendo.editor.addColumnAfter|The title of the tool that adds new column after currently selected column."
+            addColumnAfter="Add column after"
+            i18n-addRowBefore="kendo.editor.addRowBefore|The title of the tool that adds new row before currently selected row."
+            addRowBefore="Add row before"
+            i18n-addRowAfter="kendo.editor.addRowAfter|The title of the tool that adds new row after currently selected row."
+            addRowAfter="Add row after"
+            i18n-deleteColumn="kendo.editor.deleteColumn|The title of the tool that deletes a table column."
+            deleteColumn="Delete column"
+            i18n-deleteRow="kendo.editor.deleteRow|The title of the tool that deletes a table row."
+            deleteRow="Delete row"
+            i18n-deleteTable="kendo.editor.deleteTable|The title of the tool that deletes a table."
+            deleteTable="Delete table"
+        >
+        </ng-container>
+
+        <ng-content select="kendo-toolbar"></ng-content>
+        <kendo-toolbar [overflow]="true" [tabindex]="readonly ? -1 : 0" *ngIf="!userToolBarElement" #defaultToolbar>
+            <kendo-toolbar-buttongroup>
+                <kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>
+                <kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>
+                <kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>
+            </kendo-toolbar-buttongroup>
+            <kendo-toolbar-dropdownlist kendoEditorFormat></kendo-toolbar-dropdownlist>
+            <kendo-toolbar-buttongroup>
+                <kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>
+                <kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>
+                <kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>
+                <kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>
+            </kendo-toolbar-buttongroup>
+            <kendo-toolbar-buttongroup>
+                <kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>
+                <kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>
+                <kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>
+                <kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>
+            </kendo-toolbar-buttongroup>
+            <kendo-toolbar-buttongroup>
+                <kendo-toolbar-button kendoEditorCreateLinkButton></kendo-toolbar-button>
+                <kendo-toolbar-button kendoEditorUnlinkButton></kendo-toolbar-button>
+            </kendo-toolbar-buttongroup>
+            <kendo-toolbar-button kendoEditorInsertImageButton></kendo-toolbar-button>
+        </kendo-toolbar>
+
+        <div *ngIf="!iframe" #content [attr.dir]="direction" class="k-editor-content"></div>
+
+        <div class="k-editor-content" *ngIf="iframe">
+            <iframe #content srcdoc="<!DOCTYPE html>" frameborder="0" class="k-iframe" (load)="iframeOnLoad()"></iframe>
+        </div>
+
+        <ng-container #dialogsContainer></ng-container>
+    `, isInline: true, styles: ["\n            >>> .k-editor-content > .ProseMirror {\n                height: 100%;\n                width: 100%;\n                box-sizing: border-box;\n                outline: none;\n                overflow: auto;\n            }\n\n            .k-iframe {\n                width: 100%;\n                height: 100%;\n                display: block;\n            }\n        "], components: [{ type: i5.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: i5.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i5.ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { type: i6.EditorFormatComponent, selector: "kendo-toolbar-dropdownlist[kendoEditorFormat]", inputs: ["data"], outputs: ["valueChange"] }], directives: [{ type: i7.LocalizedMessagesDirective, selector: "[kendoEditorLocalizedMessages]" }, { type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.EditorBoldButtonDirective, selector: "kendo-toolbar-button[kendoEditorBoldButton]" }, { type: i10.EditorItalicButtonDirective, selector: "kendo-toolbar-button[kendoEditorItalicButton]" }, { type: i11.EditorUnderlineButtonDirective, selector: "kendo-toolbar-button[kendoEditorUnderlineButton]" }, { type: i12.EditorAlignLeftButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignLeftButton]" }, { type: i13.EditorAlignCenterButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignCenterButton]" }, { type: i14.EditorAlignRightButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignRightButton]" }, { type: i15.EditorAlignJustifyButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignJustifyButton]" }, { type: i16.EditorInsertUnorderedListButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertUnorderedListButton]" }, { type: i17.EditorInsertOrderedListButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertOrderedListButton]" }, { type: i18.EditorIndentButtonDirective, selector: "kendo-toolbar-button[kendoEditorIndentButton]" }, { type: i19.EditorOutdentButtonDirective, selector: "kendo-toolbar-button[kendoEditorOutdentButton]" }, { type: i20.EditorCreateLinkButtonDirective, selector: "kendo-toolbar-button[kendoEditorCreateLinkButton]" }, { type: i21.EditorUnlinkButtonDirective, selector: "kendo-toolbar-button[kendoEditorUnlinkButton]" }, { type: i22.EditorInsertImageButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertImageButton]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: EditorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kendo-editor',
+                    providers: [
+                        EditorLocalizationService,
+                        ProviderService,
+                        EditorToolsService,
+                        {
+                            provide: LocalizationService,
+                            useExisting: EditorLocalizationService
+                        },
+                        {
+                            provide: L10N_PREFIX,
+                            useValue: 'kendo.editor'
+                        },
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => EditorComponent),
+                            multi: true
+                        },
+                        {
+                            provide: KendoInput,
+                            useExisting: forwardRef(() => EditorComponent)
+                        }
+                    ],
+                    template: `
         <ng-container
             kendoEditorLocalizedMessages
             i18n-alignCenter="kendo.editor.alignCenter|The title of the tool that aligns text in the center."
@@ -1083,8 +1131,8 @@ EditorComponent = EditorComponent_1 = tslib_1.__decorate([
 
         <ng-container #dialogsContainer></ng-container>
     `,
-        styles: [
-            `
+                    styles: [
+                        `
             >>> .k-editor-content > .ProseMirror {
                 height: 100%;
                 width: 100%;
@@ -1099,14 +1147,89 @@ EditorComponent = EditorComponent_1 = tslib_1.__decorate([
                 display: block;
             }
         `
-        ]
-    }),
-    tslib_1.__metadata("design:paramtypes", [DialogService,
-        LocalizationService,
-        ChangeDetectorRef,
-        NgZone,
-        ElementRef,
-        EditorToolsService])
-], EditorComponent);
-export { EditorComponent };
-export { ɵ0 };
+                    ]
+                }]
+        }], ctorParameters: function () { return [{ type: i1.DialogService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.ElementRef }, { type: i3.ProviderService }, { type: i4.EditorToolsService }]; }, propDecorators: { value: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], iframe: [{
+                type: Input
+            }], applyToWord: [{
+                type: Input
+            }], schema: [{
+                type: Input
+            }], plugins: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], preserveWhitespace: [{
+                type: Input
+            }], pasteCleanupSettings: [{
+                type: Input
+            }], resizable: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }], onFocus: [{
+                type: Output,
+                args: ['focus']
+            }], paste: [{
+                type: Output
+            }], onBlur: [{
+                type: Output,
+                args: ['blur']
+            }], hostClass: [{
+                type: HostBinding,
+                args: ['class.k-editor']
+            }], resizableClass: [{
+                type: HostBinding,
+                args: ['class.k-editor-resizable']
+            }], isDisabled: [{
+                type: HostBinding,
+                args: ['class.k-disabled']
+            }], isReadonly: [{
+                type: HostBinding,
+                args: ['class.k-readonly']
+            }], isIE: [{
+                type: HostBinding,
+                args: ['class.k-ie']
+            }], dir: [{
+                type: HostBinding,
+                args: ['attr.dir']
+            }], ariaDisabled: [{
+                type: HostBinding,
+                args: ['attr.ariaDisabled']
+            }], minWidth: [{
+                type: HostBinding,
+                args: ['style.minWidth']
+            }], maxWidth: [{
+                type: HostBinding,
+                args: ['style.maxWidth']
+            }], minHeight: [{
+                type: HostBinding,
+                args: ['style.minHeight']
+            }], maxHeight: [{
+                type: HostBinding,
+                args: ['style.maxHeight']
+            }], userToolBarComponent: [{
+                type: ContentChild,
+                args: [ToolBarComponent, { static: false }]
+            }], userToolBarElement: [{
+                type: ContentChild,
+                args: [ToolBarComponent, { read: ElementRef, static: false }]
+            }], dialogContainer: [{
+                type: ViewChild,
+                args: ['dialogsContainer', { read: ViewContainerRef, static: true }]
+            }], container: [{
+                type: ViewChild,
+                args: ['content', { read: ViewContainerRef, static: false }]
+            }], defaultToolbar: [{
+                type: ViewChild,
+                args: ['defaultToolbar', { read: ElementRef, static: false }]
+            }], defaultToolbarComponent: [{
+                type: ViewChild,
+                args: ['defaultToolbar', { read: ToolBarComponent, static: false }]
+            }] } });