@progress/kendo-angular-editor 16.5.0-develop.6 → 16.6.0-develop.1

package/esm2020/dialogs/image-dialog.component.mjs

@@ -3,20 +3,19 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Component, Input, ViewChild } from '@angular/core';
-import { FormControl, FormGroup, Validators } from '@angular/forms';
-import { DialogRef, DialogContentBase } from '@progress/kendo-angular-dialog';
+import { FormControl, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import { DialogRef, DialogContentBase, DialogActionsComponent, DialogTitleBarComponent } from '@progress/kendo-angular-dialog';
 import { getNodeFromSelection } from '@progress/kendo-editor-common';
+import { guid } from '@progress/kendo-angular-common';
+import { TextBoxComponent, FormFieldComponent } from '@progress/kendo-angular-inputs';
+import { ButtonComponent } from '@progress/kendo-angular-buttons';
+import { LabelComponent } from '@progress/kendo-angular-label';
 import { safeString } from '../util';
 import { EditorLocalizationService } from '../localization/editor-localization.service';
-import { guid } from '@progress/kendo-angular-common';
-import { TextBoxComponent } from '@progress/kendo-angular-inputs';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-dialog";
 import * as i2 from "../localization/editor-localization.service";
 import * as i3 from "@angular/forms";
-import * as i4 from "@progress/kendo-angular-buttons";
-import * as i5 from "@progress/kendo-angular-inputs";
-import * as i6 from "@progress/kendo-angular-label";
 /**
  * @hidden
  */
@@ -83,7 +82,7 @@ export class ImageDialogComponent extends DialogContentBase {
     }
 }
 ImageDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ImageDialogComponent, deps: [{ token: i1.DialogRef }, { token: i2.EditorLocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-ImageDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ImageDialogComponent, selector: "ng-component", inputs: { editor: "editor" }, viewQueries: [{ propertyName: "srcInput", first: true, predicate: ["srcInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
+ImageDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ImageDialogComponent, isStandalone: true, selector: "ng-component", inputs: { editor: "editor" }, viewQueries: [{ propertyName: "srcInput", first: true, predicate: ["srcInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
         <kendo-dialog-titlebar (close)="onCancelAction()">
             {{ textFor('insertImage') }}
         </kendo-dialog-titlebar>
@@ -145,7 +144,7 @@ ImageDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
                 (click)="onCancelAction()"
             >{{ textFor('dialogCancel') }}</button>
         </kendo-dialog-actions>
-    `, isInline: true, dependencies: [{ kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: i1.DialogTitleBarComponent, selector: "kendo-dialog-titlebar", inputs: ["id", "closeTitle"], outputs: ["close"] }, { kind: "component", type: i1.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: i5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "component", type: i5.FormFieldComponent, selector: "kendo-formfield", inputs: ["showHints", "orientation", "showErrors"] }, { kind: "component", type: i6.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }] });
+    `, isInline: true, dependencies: [{ kind: "component", type: DialogTitleBarComponent, selector: "kendo-dialog-titlebar", inputs: ["id", "closeTitle"], outputs: ["close"] }, { kind: "component", type: FormFieldComponent, selector: "kendo-formfield", inputs: ["showHints", "orientation", "showErrors"] }, { kind: "component", type: LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ImageDialogComponent, decorators: [{
             type: Component,
             args: [{
@@ -211,7 +210,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 (click)="onCancelAction()"
             >{{ textFor('dialogCancel') }}</button>
         </kendo-dialog-actions>
-    `
+    `,
+                    standalone: true,
+                    imports: [DialogTitleBarComponent, FormFieldComponent, LabelComponent, TextBoxComponent, ReactiveFormsModule, DialogActionsComponent, ButtonComponent]
                 }]
         }], ctorParameters: function () { return [{ type: i1.DialogRef }, { type: i2.EditorLocalizationService }]; }, propDecorators: { editor: [{
                 type: Input

package/esm2020/dialogs/insert-table-dialog.component.mjs

@@ -3,14 +3,14 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Component, Input } from '@angular/core';
-import { DialogRef, DialogContentBase } from '@progress/kendo-angular-dialog';
+import { DialogRef, DialogContentBase, DialogActionsComponent, DialogTitleBarComponent } from '@progress/kendo-angular-dialog';
+import { ButtonComponent } from '@progress/kendo-angular-buttons';
 import { EditorLocalizationService } from '../localization/editor-localization.service';
 import { EditorComponent } from '../editor.component';
+import { PopupTableGridComponent } from '../tools/tables/popup-table-grid.component';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-dialog";
 import * as i2 from "../localization/editor-localization.service";
-import * as i3 from "@progress/kendo-angular-buttons";
-import * as i4 from "../tools/tables/popup-table-grid.component";
 /**
  * @hidden
  */
@@ -37,7 +37,7 @@ export class InsertTableDialogComponent extends DialogContentBase {
     }
 }
 InsertTableDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InsertTableDialogComponent, deps: [{ token: i1.DialogRef }, { token: i2.EditorLocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-InsertTableDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: InsertTableDialogComponent, selector: "ng-component", inputs: { editor: "editor" }, usesInheritance: true, ngImport: i0, template: `
+InsertTableDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: InsertTableDialogComponent, isStandalone: true, selector: "ng-component", inputs: { editor: "editor" }, usesInheritance: true, ngImport: i0, template: `
         <kendo-dialog-titlebar (close)="onCancelAction()">
             {{ textFor('insertTable') }}
         </kendo-dialog-titlebar>
@@ -50,7 +50,7 @@ InsertTableDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0
                 (click)="onCancelAction()"
             >{{ textFor('dialogCancel') }}</button>
         </kendo-dialog-actions>
-    `, isInline: true, dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: i1.DialogTitleBarComponent, selector: "kendo-dialog-titlebar", inputs: ["id", "closeTitle"], outputs: ["close"] }, { kind: "component", type: i1.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: i4.PopupTableGridComponent, selector: "kendo-popup-table-grid", outputs: ["cellClick", "tableWizardClick"] }] });
+    `, isInline: true, dependencies: [{ kind: "component", type: DialogTitleBarComponent, selector: "kendo-dialog-titlebar", inputs: ["id", "closeTitle"], outputs: ["close"] }, { kind: "component", type: PopupTableGridComponent, selector: "kendo-popup-table-grid", outputs: ["cellClick", "tableWizardClick"] }, { kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: InsertTableDialogComponent, decorators: [{
             type: Component,
             args: [{
@@ -67,7 +67,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 (click)="onCancelAction()"
             >{{ textFor('dialogCancel') }}</button>
         </kendo-dialog-actions>
-    `
+    `,
+                    standalone: true,
+                    imports: [DialogTitleBarComponent, PopupTableGridComponent, DialogActionsComponent, ButtonComponent]
                 }]
         }], ctorParameters: function () { return [{ type: i1.DialogRef }, { type: i2.EditorLocalizationService }]; }, propDecorators: { editor: [{
                 type: Input

package/esm2020/dialogs/source-dialog.component.mjs

@@ -4,14 +4,13 @@
 *-------------------------------------------------------------------------------------------*/
 import { Component, ViewChild, Input } from '@angular/core';
 // import { EditorService } from '../editor.service';
-import { DialogRef, DialogContentBase } from '@progress/kendo-angular-dialog';
+import { DialogRef, DialogContentBase, DialogActionsComponent, DialogTitleBarComponent } from '@progress/kendo-angular-dialog';
 import { TextAreaComponent } from '@progress/kendo-angular-inputs';
 import { EditorLocalizationService } from '../localization/editor-localization.service';
+import { ButtonComponent } from '@progress/kendo-angular-buttons';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-dialog";
 import * as i2 from "../localization/editor-localization.service";
-import * as i3 from "@progress/kendo-angular-buttons";
-import * as i4 from "@progress/kendo-angular-inputs";
 /**
  * @hidden
  */
@@ -48,7 +47,7 @@ export class SourceDialogComponent extends DialogContentBase {
     }
 }
 SourceDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SourceDialogComponent, deps: [{ token: i1.DialogRef }, { token: i2.EditorLocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-SourceDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SourceDialogComponent, selector: "ng-component", inputs: { editor: "editor" }, viewQueries: [{ propertyName: "textarea", first: true, predicate: ["textarea"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
+SourceDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SourceDialogComponent, isStandalone: true, selector: "ng-component", inputs: { editor: "editor" }, viewQueries: [{ propertyName: "textarea", first: true, predicate: ["textarea"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
         <kendo-dialog-titlebar (close)="onCancelAction()">
             {{ textFor('viewSource') }}
         </kendo-dialog-titlebar>
@@ -71,7 +70,7 @@ SourceDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
                 (click)="onCancelAction()"
             >{{ textFor('dialogCancel') }}</button>
         </kendo-dialog-actions>
-    `, isInline: true, dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: i1.DialogTitleBarComponent, selector: "kendo-dialog-titlebar", inputs: ["id", "closeTitle"], outputs: ["close"] }, { kind: "component", type: i1.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: i4.TextAreaComponent, selector: "kendo-textarea", inputs: ["focusableId", "flow", "inputAttributes", "adornmentsOrientation", "rows", "cols", "maxlength", "tabindex", "tabIndex", "resizable", "size", "rounded", "fillMode", "showPrefixSeparator", "showSuffixSeparator"], outputs: ["focus", "blur", "valueChange"], exportAs: ["kendoTextArea"] }] });
+    `, isInline: true, dependencies: [{ kind: "component", type: DialogTitleBarComponent, selector: "kendo-dialog-titlebar", inputs: ["id", "closeTitle"], outputs: ["close"] }, { kind: "component", type: TextAreaComponent, selector: "kendo-textarea", inputs: ["focusableId", "flow", "inputAttributes", "adornmentsOrientation", "rows", "cols", "maxlength", "tabindex", "tabIndex", "resizable", "size", "rounded", "fillMode", "showPrefixSeparator", "showSuffixSeparator"], outputs: ["focus", "blur", "valueChange"], exportAs: ["kendoTextArea"] }, { kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SourceDialogComponent, decorators: [{
             type: Component,
             args: [{
@@ -98,7 +97,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 (click)="onCancelAction()"
             >{{ textFor('dialogCancel') }}</button>
         </kendo-dialog-actions>
-    `
+    `,
+                    standalone: true,
+                    imports: [DialogTitleBarComponent, TextAreaComponent, DialogActionsComponent, ButtonComponent]
                 }]
         }], ctorParameters: function () { return [{ type: i1.DialogRef }, { type: i2.EditorLocalizationService }]; }, propDecorators: { editor: [{
                 type: Input

package/esm2020/directives.mjs

@@ -0,0 +1,97 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { EditorComponent } from './editor.component';
+import { EditorFormatComponent } from './tools/format/editor-format.component';
+import { EditorFontSizeComponent } from './tools/fontsize/editor-fontsize.component';
+import { EditorFontFamilyComponent } from './tools/fontfamily/editor-fontfamily.component';
+import { EditorColorPickerComponent } from './tools/colorpicker/editor-colorpicker.component';
+import { EditorInsertTableButtonComponent } from './tools/tables/editor-insert-table-button.component';
+import { EditorAlignLeftButtonDirective } from './tools/alignment/editor-align-left-button.directive';
+import { EditorAlignCenterButtonDirective } from './tools/alignment/editor-align-center-button.directive';
+import { EditorAlignRightButtonDirective } from './tools/alignment/editor-align-right-button.directive';
+import { EditorAlignJustifyButtonDirective } from './tools/alignment/editor-align-justify-button.directive';
+import { EditorBlockquoteDirective } from './tools/blockquote/editor-blockquote-button.directive';
+import { EditorRedoButtonDirective } from './tools/history/editor-redo-button.directive';
+import { EditorUndoButtonDirective } from './tools/history/editor-undo-button.directive';
+import { EditorInsertImageButtonDirective } from './tools/image/editor-insert-image-button.directive';
+import { EditorIndentButtonDirective } from './tools/indentation/editor-indent-button.directive';
+import { EditorOutdentButtonDirective } from './tools/indentation/editor-outdent-button.directive';
+import { EditorCreateLinkButtonDirective } from './tools/link/editor-create-link-button.directive';
+import { EditorUnlinkButtonDirective } from './tools/link/editor-unlink-button.directive';
+import { EditorInsertOrderedListButtonDirective } from './tools/list/editor-insert-ordered-list-button.directive';
+import { EditorInsertUnorderedListButtonDirective } from './tools/list/editor-insert-unordered-list-button.directive';
+import { EditorViewSourceButtonDirective } from './tools/source/editor-view-source-button.directive';
+import { EditorBoldButtonDirective } from './tools/typographical-emphasis/editor-bold-button.directive';
+import { EditorItalicButtonDirective } from './tools/typographical-emphasis/editor-italic-button.directive';
+import { EditorUnderlineButtonDirective } from './tools/typographical-emphasis/editor-underline-button.directive';
+import { EditorStrikethroughButtonDirective } from './tools/typographical-emphasis/editor-strikethrough-button.directive';
+import { EditorSubscriptButtonDirective } from './tools/typographical-emphasis/editor-subscript-button.directive';
+import { EditorSuperscriptButtonDirective } from './tools/typographical-emphasis/editor-superscript-button.directive';
+import { EditorInsertFileButtonDirective } from './tools/link/editor-insert-file-button.directive';
+import { EditorForeColorDirective } from './tools/colorpicker/editor-fore-color.directive';
+import { EditorBackColorDirective } from './tools/colorpicker/editor-back-color.directive';
+import { EditorCleanFormattingButtonDirective } from './tools/editor-clean-formatting-button.directive';
+import { EditorAddColumnBeforeButtonDirective } from './tools/tables/editor-add-column-before-button.directive';
+import { EditorAddColumnAfterButtonDirective } from './tools/tables/editor-add-column-after-button.directive';
+import { EditorAddRowBeforeButtonDirective } from './tools/tables/editor-add-row-before-button.directive';
+import { EditorAddRowAfterButtonDirective } from './tools/tables/editor-add-row-after-button.directive';
+import { EditorDeleteColumnButtonDirective } from './tools/tables/editor-delete-column-button.directive';
+import { EditorDeleteRowButtonDirective } from './tools/tables/editor-delete-row-button.directive';
+import { EditorDeleteTableButtonDirective } from './tools/tables/editor-delete-table-button.directive';
+import { CustomMessagesComponent } from './localization/custom-messages.component';
+import { EditorPrintDirective } from './tools/print/editor-print-button.directive';
+import { EditorSelectAllButtonDirective } from './tools/select-all/select-all-button.directive';
+import { EditorSplitCellButtonDirective } from './tools/tables/editor-split-cell-button.directive';
+import { EditorMergeCellsButtonDirective } from './tools/tables/editor-merge-cells-button.directive';
+import { KENDO_TOOLBAR } from '@progress/kendo-angular-toolbar';
+/**
+ * Utility array that contains all `Editor` related components and directives
+ */
+export const KENDO_EDITOR = [
+    EditorComponent,
+    EditorAlignLeftButtonDirective,
+    EditorAlignCenterButtonDirective,
+    EditorAlignRightButtonDirective,
+    EditorAlignJustifyButtonDirective,
+    EditorInsertFileButtonDirective,
+    EditorRedoButtonDirective,
+    EditorUndoButtonDirective,
+    EditorInsertImageButtonDirective,
+    EditorIndentButtonDirective,
+    EditorOutdentButtonDirective,
+    EditorCreateLinkButtonDirective,
+    EditorUnlinkButtonDirective,
+    EditorInsertOrderedListButtonDirective,
+    EditorInsertUnorderedListButtonDirective,
+    EditorViewSourceButtonDirective,
+    EditorBoldButtonDirective,
+    EditorItalicButtonDirective,
+    EditorUnderlineButtonDirective,
+    EditorStrikethroughButtonDirective,
+    EditorSubscriptButtonDirective,
+    EditorSuperscriptButtonDirective,
+    EditorForeColorDirective,
+    EditorBackColorDirective,
+    EditorCleanFormattingButtonDirective,
+    EditorAddColumnBeforeButtonDirective,
+    EditorAddColumnAfterButtonDirective,
+    EditorAddRowBeforeButtonDirective,
+    EditorAddRowAfterButtonDirective,
+    EditorDeleteColumnButtonDirective,
+    EditorDeleteRowButtonDirective,
+    EditorDeleteTableButtonDirective,
+    CustomMessagesComponent,
+    EditorPrintDirective,
+    EditorSelectAllButtonDirective,
+    EditorBlockquoteDirective,
+    EditorFontSizeComponent,
+    EditorFontFamilyComponent,
+    EditorFormatComponent,
+    EditorColorPickerComponent,
+    EditorInsertTableButtonComponent,
+    EditorMergeCellsButtonDirective,
+    EditorSplitCellButtonDirective,
+    ...KENDO_TOOLBAR
+];

package/esm2020/editor.component.mjs

@@ -3,14 +3,16 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Component, HostBinding, ViewChild, ContentChild, ViewContainerRef, Output, ElementRef, EventEmitter, forwardRef, Input, ChangeDetectorRef, NgZone, isDevMode, Renderer2 } from '@angular/core';
+import { NgIf } from '@angular/common';
 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 { ToolBarButtonComponent, ToolBarButtonGroupComponent, ToolBarComponent } from '@progress/kendo-angular-toolbar';
 import { DialogService } from '@progress/kendo-angular-dialog';
-import { guid, hasObservers, isDocumentAvailable, KendoInput, shouldShowValidationUI } from '@progress/kendo-angular-common';
+import { guid, hasObservers, isDocumentAvailable, KendoInput, shouldShowValidationUI, WatermarkOverlayComponent } 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, tableResizing, cspFix } from '@progress/kendo-editor-common';
 import { validatePackage } from '@progress/kendo-licensing';
+import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
 import { packageMetadata } from './package-metadata';
 import { schema } from './config/schema';
 import { editorCommands } from './config/commands';
@@ -19,37 +21,33 @@ import { detectIE, removeEmptyEntries, conditionallyExecute, pipe, isPresent } f
 import { SourceDialogComponent } from './dialogs/source-dialog.component';
 import { ImageDialogComponent } from './dialogs/image-dialog.component';
 import { FileLinkDialogComponent } from './dialogs/file-link-dialog.component';
-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 { EditorInsertImageButtonDirective } from './tools/image/editor-insert-image-button.directive';
+import { EditorUnlinkButtonDirective } from './tools/link/editor-unlink-button.directive';
+import { EditorCreateLinkButtonDirective } from './tools/link/editor-create-link-button.directive';
+import { EditorOutdentButtonDirective } from './tools/indentation/editor-outdent-button.directive';
+import { EditorIndentButtonDirective } from './tools/indentation/editor-indent-button.directive';
+import { EditorInsertOrderedListButtonDirective } from './tools/list/editor-insert-ordered-list-button.directive';
+import { EditorInsertUnorderedListButtonDirective } from './tools/list/editor-insert-unordered-list-button.directive';
+import { EditorAlignJustifyButtonDirective } from './tools/alignment/editor-align-justify-button.directive';
+import { EditorAlignRightButtonDirective } from './tools/alignment/editor-align-right-button.directive';
+import { EditorAlignCenterButtonDirective } from './tools/alignment/editor-align-center-button.directive';
+import { EditorAlignLeftButtonDirective } from './tools/alignment/editor-align-left-button.directive';
+import { EditorFormatComponent } from './tools/format/editor-format.component';
+import { EditorUnderlineButtonDirective } from './tools/typographical-emphasis/editor-underline-button.directive';
+import { EditorItalicButtonDirective } from './tools/typographical-emphasis/editor-italic-button.directive';
+import { EditorBoldButtonDirective } from './tools/typographical-emphasis/editor-bold-button.directive';
+import { LocalizedMessagesDirective } from './localization/localized-messages.directive';
 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 "@angular/common";
-import * as i6 from "@progress/kendo-angular-toolbar";
-import * as i7 from "@progress/kendo-angular-common";
-import * as i8 from "./tools/alignment/editor-align-left-button.directive";
-import * as i9 from "./tools/alignment/editor-align-center-button.directive";
-import * as i10 from "./tools/alignment/editor-align-right-button.directive";
-import * as i11 from "./tools/alignment/editor-align-justify-button.directive";
-import * as i12 from "./tools/image/editor-insert-image-button.directive";
-import * as i13 from "./tools/indentation/editor-indent-button.directive";
-import * as i14 from "./tools/indentation/editor-outdent-button.directive";
-import * as i15 from "./tools/link/editor-create-link-button.directive";
-import * as i16 from "./tools/link/editor-unlink-button.directive";
-import * as i17 from "./tools/list/editor-insert-ordered-list-button.directive";
-import * as i18 from "./tools/list/editor-insert-unordered-list-button.directive";
-import * as i19 from "./tools/typographical-emphasis/editor-bold-button.directive";
-import * as i20 from "./tools/typographical-emphasis/editor-italic-button.directive";
-import * as i21 from "./tools/typographical-emphasis/editor-underline-button.directive";
-import * as i22 from "./localization/localized-messages.directive";
-import * as i23 from "./tools/format/editor-format.component";
 const EMPTY_PARAGRAPH = '<p></p>';
 const defaultPasteCleanupSettings = {
     convertMsLists: false,
@@ -111,23 +109,23 @@ export class EditorComponent {
         this.resizable = false;
         /**
          * Fires each time the value of the Editor is changed upon user interaction&mdash;
-         * for example, when the value is updated through typing in the content area or using some of the Editor tools ([see example]({% slug overview_editor %}#toc-events)).
+         * for example, when the value is updated through typing in the content area or using some of the Editor tools ([see example](slug:events_editor)).
          * When the value of the Editor is programmatically changed through its API (`ngModel`) or form binding (`formControl`),
          * the `valueChange` event is not triggered because it might cause a mix-up with the
          * built-in `valueChange` mechanisms of the `ngModel` or `formControl` bindings.
          */
         this.valueChange = new EventEmitter();
         /**
-         * Fires when the content area of the Editor is focused ([see example]({% slug overview_editor %}#toc-events)).
+         * Fires when the content area of the Editor is focused ([see example](slug:events_editor)).
          */
         this.onFocus = new EventEmitter();
         /**
-         * Fires when the user performs paste in the content area of the Editor ([see example]({% slug overview_editor %}#toc-events)).
+         * Fires when the user performs paste in the content area of the Editor ([see example](slug:events_editor)).
          * The event is preventable. If you cancel it, the Editor content will not change.
          */
         this.paste = new EventEmitter();
         /**
-         * Fires when the content area of the Editor is blurred ([see example]({% slug overview_editor %}#toc-events)).
+         * Fires when the content area of the Editor is blurred ([see example](slug:events_editor)).
          */
         this.onBlur = new EventEmitter();
         this.hostClass = true;
@@ -229,7 +227,7 @@ export class EditorComponent {
         this.subs = zip(this.afterViewInit.asObservable(), this.contentAreaLoaded.asObservable()).subscribe(() => this.initialize());
     }
     /**
-     * Sets the value of the Editor ([see example]({% slug overview_editor %}#toc-basic-usage)).
+     * Sets the value of the Editor ([see example](slug:overview_editor)).
      */
     set value(value) {
         this.changeValue(value);
@@ -800,7 +798,7 @@ export class EditorComponent {
     }
 }
 EditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", 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 }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-EditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: EditorComponent, selector: "kendo-editor", inputs: { value: "value", disabled: "disabled", readonly: "readonly", iframe: "iframe", iframeCss: "iframeCss", 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: [
+EditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: EditorComponent, isStandalone: true, selector: "kendo-editor", inputs: { value: "value", disabled: "disabled", readonly: "readonly", iframe: "iframe", iframeCss: "iframeCss", 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,
@@ -980,7 +978,7 @@ EditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
         <ng-container #dialogsContainer></ng-container>
 
         <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
-    `, isInline: true, dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { kind: "component", type: i6.ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { kind: "component", type: i6.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { kind: "component", type: i7.WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }, { kind: "directive", type: i8.EditorAlignLeftButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignLeftButton]" }, { kind: "directive", type: i9.EditorAlignCenterButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignCenterButton]" }, { kind: "directive", type: i10.EditorAlignRightButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignRightButton]" }, { kind: "directive", type: i11.EditorAlignJustifyButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignJustifyButton]" }, { kind: "directive", type: i12.EditorInsertImageButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertImageButton]" }, { kind: "directive", type: i13.EditorIndentButtonDirective, selector: "kendo-toolbar-button[kendoEditorIndentButton]" }, { kind: "directive", type: i14.EditorOutdentButtonDirective, selector: "kendo-toolbar-button[kendoEditorOutdentButton]" }, { kind: "directive", type: i15.EditorCreateLinkButtonDirective, selector: "kendo-toolbar-button[kendoEditorCreateLinkButton]" }, { kind: "directive", type: i16.EditorUnlinkButtonDirective, selector: "kendo-toolbar-button[kendoEditorUnlinkButton]" }, { kind: "directive", type: i17.EditorInsertOrderedListButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertOrderedListButton]" }, { kind: "directive", type: i18.EditorInsertUnorderedListButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertUnorderedListButton]" }, { kind: "directive", type: i19.EditorBoldButtonDirective, selector: "kendo-toolbar-button[kendoEditorBoldButton]" }, { kind: "directive", type: i20.EditorItalicButtonDirective, selector: "kendo-toolbar-button[kendoEditorItalicButton]" }, { kind: "directive", type: i21.EditorUnderlineButtonDirective, selector: "kendo-toolbar-button[kendoEditorUnderlineButton]" }, { kind: "directive", type: i22.LocalizedMessagesDirective, selector: "[kendoEditorLocalizedMessages]" }, { kind: "component", type: i23.EditorFormatComponent, selector: "kendo-toolbar-dropdownlist[kendoEditorFormat]", inputs: ["data"], outputs: ["valueChange"] }] });
+    `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoEditorLocalizedMessages]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "size", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { kind: "component", type: ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { kind: "component", type: ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "svgIcon", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { kind: "directive", type: EditorBoldButtonDirective, selector: "kendo-toolbar-button[kendoEditorBoldButton]" }, { kind: "directive", type: EditorItalicButtonDirective, selector: "kendo-toolbar-button[kendoEditorItalicButton]" }, { kind: "directive", type: EditorUnderlineButtonDirective, selector: "kendo-toolbar-button[kendoEditorUnderlineButton]" }, { kind: "component", type: EditorFormatComponent, selector: "kendo-toolbar-dropdownlist[kendoEditorFormat]", inputs: ["data"], outputs: ["valueChange"] }, { kind: "directive", type: EditorAlignLeftButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignLeftButton]" }, { kind: "directive", type: EditorAlignCenterButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignCenterButton]" }, { kind: "directive", type: EditorAlignRightButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignRightButton]" }, { kind: "directive", type: EditorAlignJustifyButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignJustifyButton]" }, { kind: "directive", type: EditorInsertUnorderedListButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertUnorderedListButton]" }, { kind: "directive", type: EditorInsertOrderedListButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertOrderedListButton]" }, { kind: "directive", type: EditorIndentButtonDirective, selector: "kendo-toolbar-button[kendoEditorIndentButton]" }, { kind: "directive", type: EditorOutdentButtonDirective, selector: "kendo-toolbar-button[kendoEditorOutdentButton]" }, { kind: "directive", type: EditorCreateLinkButtonDirective, selector: "kendo-toolbar-button[kendoEditorCreateLinkButton]" }, { kind: "directive", type: EditorUnlinkButtonDirective, selector: "kendo-toolbar-button[kendoEditorUnlinkButton]" }, { kind: "directive", type: EditorInsertImageButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertImageButton]" }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: EditorComponent, decorators: [{
             type: Component,
             args: [{
@@ -1166,7 +1164,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
         <ng-container #dialogsContainer></ng-container>
 
         <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
-    `
+    `,
+                    standalone: true,
+                    imports: [LocalizedMessagesDirective, NgIf, ToolBarComponent, ToolBarButtonGroupComponent, ToolBarButtonComponent, EditorBoldButtonDirective, EditorItalicButtonDirective, EditorUnderlineButtonDirective, EditorFormatComponent, EditorAlignLeftButtonDirective, EditorAlignCenterButtonDirective, EditorAlignRightButtonDirective, EditorAlignJustifyButtonDirective, EditorInsertUnorderedListButtonDirective, EditorInsertOrderedListButtonDirective, EditorIndentButtonDirective, EditorOutdentButtonDirective, EditorCreateLinkButtonDirective, EditorUnlinkButtonDirective, EditorInsertImageButtonDirective, WatermarkOverlayComponent]
                 }]
         }], ctorParameters: function () { return [{ type: i1.DialogService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.ElementRef }, { type: i3.ProviderService }, { type: i4.EditorToolsService }, { type: i0.Renderer2 }]; }, propDecorators: { value: [{
                 type: Input