@progress/kendo-angular-editor 2.5.0-dev.202111161123 → 2.5.0-dev.202111291334

package/dist/es/common/error-messages.js

@@ -12,6 +12,7 @@ export var EditorErrorMessages = {
     setSchemaOnce: 'The Schema cannot be changed dynamically. See http://www.telerik.com/kendo-angular-ui/components/editor/schema/',
     pluginsCallbackType: ɵ0,
     setPluginsOnce: 'The plugins cannot be changed dynamically. See http://www.telerik.com/kendo-angular-ui/components/editor/plugins/',
-    setPlaceHolderOnce: 'The placeholder cannot be changed dynamically. See http://www.telerik.com/kendo-angular-ui/components/editor/placeholder/'
+    setPlaceHolderOnce: 'The placeholder cannot be changed dynamically. See http://www.telerik.com/kendo-angular-ui/components/editor/placeholder/',
+    printTool: 'The Print tool and functionality are supported only in iframe mode. See https://www.telerik.com/kendo-angular-ui-develop/components/editor/api/EditorPrintButtonDirective/'
 };
 export { ɵ0 };

package/dist/es/config/command-icons.js

@@ -10,9 +10,11 @@ export var commandIcons = {
     alignJustify: 'align-justify',
     alignLeft: 'align-left',
     alignRight: 'align-right',
+    backColor: 'background',
     bold: 'bold',
     cleanFormatting: 'clear-css',
     createLink: 'link-horizontal',
+    foreColor: 'foreground-color',
     indent: 'indent-increase',
     insertFile: 'file-add',
     insertImage: 'image',
@@ -20,7 +22,9 @@ export var commandIcons = {
     insertUnorderedList: 'list-unordered',
     italic: 'italic',
     outdent: 'indent-decrease',
+    print: 'print',
     redo: 'redo',
+    selectAll: 'select-all',
     strikethrough: 'strikethrough',
     subscript: 'sub-script',
     superscript: 'sup-script',
@@ -28,8 +32,6 @@ export var commandIcons = {
     undo: 'undo',
     unlink: 'unlink-horizontal',
     viewSource: 'html',
-    foreColor: 'foreground-color',
-    backColor: 'background',
     //table
     insertTable: 'table-insert',
     addColumnBefore: 'table-column-insert-left',

package/dist/es/config/commands.js

@@ -5,11 +5,11 @@
 import * as tslib_1 from "tslib";
 import { alignBlocks, alignLeftRules, alignCenterRules, alignRightRules, alignJustifyRules, alignRemoveRules, indent, outdent, setHtml, getHtml, insertImage, insertText, applyLink, removeLink, expandToWordWrap, 
 //marks
-bold, italic, underline, strikethrough, subscript, superscript, link, toggleInlineFormat, applyInlineStyle, formatBlockElements, toggleOrderedList, toggleUnorderedList, isAligned, undo, redo, cleanFormatting } from '@progress/kendo-editor-common';
+bold, italic, underline, strikethrough, subscript, superscript, link, toggleInlineFormat, applyInlineStyle, formatBlockElements, toggleOrderedList, toggleUnorderedList, isAligned, undo, redo, cleanFormatting, selectAll } from '@progress/kendo-editor-common';
 import { insertTable, deleteTable, addColumnBefore, addColumnAfter, addRowBefore, addRowAfter, deleteRow, deleteColumn, mergeCells, splitCell } from './table-commands';
 var alignRemove = function (state, dispatch) { return alignBlocks(alignRemoveRules)(state, dispatch); };
 var ɵ0 = alignRemove;
-var ɵ1 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, bold, { applyToWord: applyToWord })); }, ɵ2 = function (options) { return cleanFormatting(options); }, ɵ3 = function (attrs) { return expandToWordWrap(applyLink, { mark: 'link', attrs: attrs.value, applyToWord: attrs.applyToWord }); }, ɵ4 = function (attrs) { return expandToWordWrap(applyInlineStyle, { style: 'font-family', value: attrs.value, applyToWord: attrs.applyToWord }); }, ɵ5 = function (attrs) { return expandToWordWrap(applyInlineStyle, { style: 'font-size', value: attrs.value + 'px', applyToWord: attrs.applyToWord }); }, ɵ6 = function (attrs) { return expandToWordWrap(applyLink, { mark: 'link', attrs: attrs, applyToWord: attrs.applyToWord }); }, ɵ7 = function (text) { return insertText(text); }, ɵ8 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, italic, { applyToWord: applyToWord })); }, ɵ9 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, strikethrough, { applyToWord: applyToWord })); }, ɵ10 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, subscript, { applyToWord: applyToWord })); }, ɵ11 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, superscript, { applyToWord: applyToWord })); }, ɵ12 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, underline, { applyToWord: applyToWord })); }, ɵ13 = function () { return removeLink(link); }, ɵ14 = function (attrs) { return expandToWordWrap(applyInlineStyle, { style: 'color', value: attrs.value, applyToWord: attrs.applyToWord }); }, ɵ15 = function (attrs) { return expandToWordWrap(applyInlineStyle, { style: 'background-color', value: attrs.value, applyToWord: attrs.applyToWord }); };
+var ɵ1 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, bold, { applyToWord: applyToWord })); }, ɵ2 = function (options) { return cleanFormatting(options); }, ɵ3 = function (attrs) { return expandToWordWrap(applyLink, { mark: 'link', attrs: attrs.value, applyToWord: attrs.applyToWord }); }, ɵ4 = function (attrs) { return expandToWordWrap(applyInlineStyle, { style: 'font-family', value: attrs.value, applyToWord: attrs.applyToWord }); }, ɵ5 = function (attrs) { return expandToWordWrap(applyInlineStyle, { style: 'font-size', value: attrs.value + 'px', applyToWord: attrs.applyToWord }); }, ɵ6 = function (attrs) { return expandToWordWrap(applyLink, { mark: 'link', attrs: attrs, applyToWord: attrs.applyToWord }); }, ɵ7 = function (text) { return insertText(text); }, ɵ8 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, italic, { applyToWord: applyToWord })); }, ɵ9 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, strikethrough, { applyToWord: applyToWord })); }, ɵ10 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, subscript, { applyToWord: applyToWord })); }, ɵ11 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, superscript, { applyToWord: applyToWord })); }, ɵ12 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, tslib_1.__assign({}, underline, { applyToWord: applyToWord })); }, ɵ13 = function () { return removeLink(link); }, ɵ14 = function (attrs) { return expandToWordWrap(applyInlineStyle, { style: 'color', value: attrs.value, applyToWord: attrs.applyToWord }); }, ɵ15 = function (attrs) { return expandToWordWrap(applyInlineStyle, { style: 'background-color', value: attrs.value, applyToWord: attrs.applyToWord }); }, ɵ16 = function () { return function (state, dispatch) { return selectAll(state, dispatch); }; };
 var inlineCommand = {
     bold: ɵ1,
     cleanFormatting: ɵ2,
@@ -25,45 +25,46 @@ var inlineCommand = {
     underline: ɵ12,
     unlink: ɵ13,
     foreColor: ɵ14,
-    backColor: ɵ15
+    backColor: ɵ15,
+    selectAll: ɵ16
 };
-var ɵ16 = function () { return function (state, dispatch) { return isAligned(state, alignCenterRules) ? alignRemove(state, dispatch) : alignBlocks(alignCenterRules)(state, dispatch); }; }, ɵ17 = function () { return function (state, dispatch) { return isAligned(state, alignJustifyRules) ? alignRemove(state, dispatch) : alignBlocks(alignJustifyRules)(state, dispatch); }; }, ɵ18 = function () { return function (state, dispatch) { return isAligned(state, alignLeftRules) ? alignRemove(state, dispatch) : alignBlocks(alignLeftRules)(state, dispatch); }; }, ɵ19 = function () { return function (state, dispatch) { return isAligned(state, alignRightRules) ? alignRemove(state, dispatch) : alignBlocks(alignRightRules)(state, dispatch); }; }, ɵ20 = function (formatAttr) { return formatBlockElements(formatAttr.tag); }, ɵ21 = function () { return getHtml; }, ɵ22 = function () { return indent; }, ɵ23 = function (attrs) { return insertImage(attrs); }, ɵ24 = function () { return toggleOrderedList; }, ɵ25 = function () { return toggleUnorderedList; }, ɵ26 = function () { return outdent; }, ɵ27 = function () { return redo; }, ɵ28 = function (_a) {
+var ɵ17 = function () { return function (state, dispatch) { return isAligned(state, alignCenterRules) ? alignRemove(state, dispatch) : alignBlocks(alignCenterRules)(state, dispatch); }; }, ɵ18 = function () { return function (state, dispatch) { return isAligned(state, alignJustifyRules) ? alignRemove(state, dispatch) : alignBlocks(alignJustifyRules)(state, dispatch); }; }, ɵ19 = function () { return function (state, dispatch) { return isAligned(state, alignLeftRules) ? alignRemove(state, dispatch) : alignBlocks(alignLeftRules)(state, dispatch); }; }, ɵ20 = function () { return function (state, dispatch) { return isAligned(state, alignRightRules) ? alignRemove(state, dispatch) : alignBlocks(alignRightRules)(state, dispatch); }; }, ɵ21 = function (formatAttr) { return formatBlockElements(formatAttr.tag); }, ɵ22 = function () { return getHtml; }, ɵ23 = function () { return indent; }, ɵ24 = function (attrs) { return insertImage(attrs); }, ɵ25 = function () { return toggleOrderedList; }, ɵ26 = function () { return toggleUnorderedList; }, ɵ27 = function () { return outdent; }, ɵ28 = function () { return redo; }, ɵ29 = function (_a) {
     var content = _a.content, parseOptions = _a.parseOptions;
     return setHtml(content, 'setHTML', parseOptions);
-}, ɵ29 = function () { return undo; };
+}, ɵ30 = function () { return undo; };
 var blockCommand = {
-    alignCenter: ɵ16,
-    alignJustify: ɵ17,
-    alignLeft: ɵ18,
-    alignRight: ɵ19,
-    format: ɵ20,
-    getHTML: ɵ21,
-    indent: ɵ22,
-    insertImage: ɵ23,
+    alignCenter: ɵ17,
+    alignJustify: ɵ18,
+    alignLeft: ɵ19,
+    alignRight: ɵ20,
+    format: ɵ21,
+    getHTML: ɵ22,
+    indent: ɵ23,
+    insertImage: ɵ24,
     // think about changing the command name.
-    insertOrderedList: ɵ24,
+    insertOrderedList: ɵ25,
     // think about changing the command name.
-    insertUnorderedList: ɵ25,
-    outdent: ɵ26,
-    redo: ɵ27,
-    setHTML: ɵ28,
-    undo: ɵ29
+    insertUnorderedList: ɵ26,
+    outdent: ɵ27,
+    redo: ɵ28,
+    setHTML: ɵ29,
+    undo: ɵ30
 };
-var ɵ30 = function (attr) { return insertTable(attr); }, ɵ31 = function () { return addColumnBefore; }, ɵ32 = function () { return addColumnAfter; }, ɵ33 = function () { return addRowBefore; }, ɵ34 = function () { return addRowAfter; }, ɵ35 = function () { return deleteRow; }, ɵ36 = function () { return deleteColumn; }, ɵ37 = function () { return mergeCells; }, ɵ38 = function () { return splitCell; }, ɵ39 = function () { return deleteTable; };
+var ɵ31 = function (attr) { return insertTable(attr); }, ɵ32 = function () { return addColumnBefore; }, ɵ33 = function () { return addColumnAfter; }, ɵ34 = function () { return addRowBefore; }, ɵ35 = function () { return addRowAfter; }, ɵ36 = function () { return deleteRow; }, ɵ37 = function () { return deleteColumn; }, ɵ38 = function () { return mergeCells; }, ɵ39 = function () { return splitCell; }, ɵ40 = function () { return deleteTable; };
 var tableCommand = {
-    insertTable: ɵ30,
-    addColumnBefore: ɵ31,
-    addColumnAfter: ɵ32,
-    addRowBefore: ɵ33,
-    addRowAfter: ɵ34,
-    deleteRow: ɵ35,
-    deleteColumn: ɵ36,
-    mergeCells: ɵ37,
-    splitCell: ɵ38,
-    deleteTable: ɵ39
+    insertTable: ɵ31,
+    addColumnBefore: ɵ32,
+    addColumnAfter: ɵ33,
+    addRowBefore: ɵ34,
+    addRowAfter: ɵ35,
+    deleteRow: ɵ36,
+    deleteColumn: ɵ37,
+    mergeCells: ɵ38,
+    splitCell: ɵ39,
+    deleteTable: ɵ40
 };
 /**
  * @hidden
  */
 export var editorCommands = Object.assign({}, inlineCommand, blockCommand, tableCommand);
-export { ɵ0, ɵ1, ɵ2, ɵ3, ɵ4, ɵ5, ɵ6, ɵ7, ɵ8, ɵ9, ɵ10, ɵ11, ɵ12, ɵ13, ɵ14, ɵ15, ɵ16, ɵ17, ɵ18, ɵ19, ɵ20, ɵ21, ɵ22, ɵ23, ɵ24, ɵ25, ɵ26, ɵ27, ɵ28, ɵ29, ɵ30, ɵ31, ɵ32, ɵ33, ɵ34, ɵ35, ɵ36, ɵ37, ɵ38, ɵ39 };
+export { ɵ0, ɵ1, ɵ2, ɵ3, ɵ4, ɵ5, ɵ6, ɵ7, ɵ8, ɵ9, ɵ10, ɵ11, ɵ12, ɵ13, ɵ14, ɵ15, ɵ16, ɵ17, ɵ18, ɵ19, ɵ20, ɵ21, ɵ22, ɵ23, ɵ24, ɵ25, ɵ26, ɵ27, ɵ28, ɵ29, ɵ30, ɵ31, ɵ32, ɵ33, ɵ34, ɵ35, ɵ36, ɵ37, ɵ38, ɵ39, ɵ40 };

package/dist/es/editor-toolbar-state.js

@@ -64,6 +64,10 @@ export var getToolbarState = function (state, options) { return ({
         selected: false,
         disabled: !redo(state)
     },
+    selectAll: {
+        selected: false,
+        disabled: false
+    },
     strikethrough: {
         selected: hasMark(state, strikethrough),
         disabled: false
@@ -113,6 +117,12 @@ export var getToolbarState = function (state, options) { return ({
         selected: false,
         disabled: false
     },
+    // print
+    print: {
+        selected: false,
+        disabled: false
+    },
+    // table
     insertTable: {
         selected: false,
         disabled: false
@@ -185,6 +195,8 @@ export var initialToolBarState = {
     //history
     redo: { selected: false, disabled: true },
     undo: { selected: false, disabled: true },
+    // print
+    print: { selected: false, disabled: false },
     //dialogs
     createLink: { selected: false, disabled: true },
     insertFile: { selected: false, disabled: true },
@@ -200,7 +212,9 @@ export var initialToolBarState = {
     deleteColumn: { selected: false, disabled: true },
     mergeCells: { selected: false, disabled: true },
     splitCell: { selected: false, disabled: true },
-    deleteTable: { selected: false, disabled: true }
+    deleteTable: { selected: false, disabled: true },
+    // select all
+    selectAll: { selected: false, disabled: false }
 };
 /**
  * @hidden
@@ -233,6 +247,8 @@ export var disabledToolBarState = {
     //history
     redo: { selected: false, disabled: true },
     undo: { selected: false, disabled: true },
+    // print
+    print: { selected: false, disabled: true },
     //dialogs
     createLink: { selected: false, disabled: true },
     insertFile: { selected: false, disabled: true },
@@ -248,5 +264,7 @@ export var disabledToolBarState = {
     deleteColumn: { selected: false, disabled: true },
     mergeCells: { selected: false, disabled: true },
     splitCell: { selected: false, disabled: true },
-    deleteTable: { selected: false, disabled: true }
+    deleteTable: { selected: false, disabled: true },
+    // select all
+    selectAll: { selected: false, disabled: true }
 };

package/dist/es/editor.component.js

@@ -24,6 +24,7 @@ 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 { EditorToolsService } from './tools/tools.service';
 var EMPTY_PARAGRAPH = '<p></p>';
 var defaultPasteCleanupSettings = {
     convertMsLists: false,
@@ -54,16 +55,18 @@ var ɵ0 = getPasteCleanupAttributes;
  * Represents the [Kendo UI Editor component for Angular]({% slug overview_editor %}).
  */
 var EditorComponent = /** @class */ (function () {
-    function EditorComponent(dialogService, localization, cdr, ngZone, element) {
+    function EditorComponent(dialogService, localization, cdr, ngZone, element, toolsService) {
         var _this = this;
         this.dialogService = dialogService;
         this.localization = localization;
         this.cdr = cdr;
         this.ngZone = ngZone;
         this.element = element;
+        this.toolsService = toolsService;
         /**
          * If set to `false`, the Editor will run in style non-encapsulated mode. This means
          * that the styles of the page will be persisted in the Editor and its content will be affected by them.
+         * @default true
          */
         this.iframe = true;
         /**
@@ -407,6 +410,7 @@ var EditorComponent = /** @class */ (function () {
             var rtl = _a.rtl;
             _this.direction = rtl ? 'rtl' : 'ltr';
         }));
+        this.subs.add(this.toolsService.needsCheck.subscribe(function () { return _this.cdr.markForCheck(); }));
     };
     EditorComponent.prototype.ngAfterViewInit = function () {
         this.afterViewInit.next();
@@ -560,7 +564,6 @@ var EditorComponent = /** @class */ (function () {
      * Manually focus the Editor.
      */
     EditorComponent.prototype.focus = function () {
-        // this.focusChangedProgrammatically = true;
         this.focusChangedProgrammatically = true;
         this._view.focus();
         this.focusChangedProgrammatically = false;
@@ -732,8 +735,9 @@ var EditorComponent = /** @class */ (function () {
                 if (_this.readonly) {
                     contentAreaClasslist_1.add('k-state-focused');
                 }
-                if (!_this.focusChangedProgrammatically) {
+                if (!_this.focusChangedProgrammatically || _this.shouldEmitFocus) {
                     _this.ngZone.run(function () { return _this.onFocus.emit(); });
+                    _this.shouldEmitFocus = false;
                 }
             }));
             this.subs.add(fromEvent(containerElement, 'focusout')
@@ -959,6 +963,7 @@ var EditorComponent = /** @class */ (function () {
             selector: 'kendo-editor',
             providers: [
                 EditorLocalizationService,
+                EditorToolsService,
                 {
                     provide: LocalizationService,
                     useExisting: EditorLocalizationService
@@ -978,7 +983,7 @@ var EditorComponent = /** @class */ (function () {
                 }
             ],
             /* tslint:disable:max-line-length */
-            template: "\n        <ng-container\n            kendoEditorLocalizedMessages\n            i18n-alignCenter=\"kendo.editor.alignCenter|The title of the tool that aligns text in the center.\"\n            alignCenter=\"Center text\"\n            i18n-alignJustify=\"kendo.editor.alignJustify|The title of the tool that justifies text both left and right.\"\n            alignJustify=\"Justify\"\n            i18n-alignLeft=\"kendo.editor.alignLeft|The title of the tool that aligns text on the left.\"\n            alignLeft=\"Align text left\"\n            i18n-alignRight=\"kendo.editor.alignRight|The title of the tool that aligns text on the right.\"\n            alignRight=\"Align text right\"\n            i18n-backColor=\"kendo.editor.backColor|The title of the tool that changes the text background color.\"\n            backColor=\"Background color\"\n            i18n-bold=\"kendo.editor.bold|The title of the tool that makes text bold.\"\n            bold=\"Bold\"\n            i18n-cleanFormatting=\"kendo.editor.cleanFormatting|The title of the Clean Formatting tool.\"\n            cleanFormatting=\"Clean formatting\"\n            i18n-createLink=\"kendo.editor.createLink|The title of the tool that creates hyperlinks.\"\n            createLink=\"Insert link\"\n            i18n-dialogApply=\"kendo.editor.dialogApply|The label of the **Apply** button in all editor dialogs.\"\n            dialogApply=\"Apply\"\n            i18n-dialogCancel=\"kendo.editor.dialogCancel|The label of the **Cancel** button in all editor dialogs.\"\n            dialogCancel=\"Cancel\"\n            i18n-dialogInsert=\"kendo.editor.dialogInsert|The label of the **Insert** button in all editor dialogs.\"\n            dialogInsert=\"Insert\"\n            i18n-dialogUpdate=\"kendo.editor.dialogUpdate|The label of the **Update** button in all editor dialogs.\"\n            dialogUpdate=\"Update\"\n            i18n-fileText=\"kendo.editor.fileText|The caption for the file text in the insertFile dialog.\"\n            fileText=\"Text\"\n            i18n-fileTitle=\"kendo.editor.fileTitle|The caption for the file Title in the insertFile dialog.\"\n            fileTitle=\"Title\"\n            i18n-fileWebAddress=\"kendo.editor.fileWebAddress|The caption for the file URL in the insertFile dialog.\"\n            fileWebAddress=\"Web address\"\n            i18n-fontFamily=\"kendo.editor.fontFamily|The title of the tool that changes the text font.\"\n            fontFamily=\"Select font family\"\n            i18n-fontSize=\"kendo.editor.fontSize|The title of the tool that changes the text size.\"\n            fontSize=\"Select font size\"\n            i18n-foreColor=\"kendo.editor.foreColor|The title of the tool that changes the text color.\"\n            foreColor=\"Color\"\n            i18n-format=\"kendo.editor.format|The title of the tool that lets users choose block formats.\"\n            format=\"Format\"\n            i18n-imageAltText=\"kendo.editor.imageAltText|The caption for the image alternate text in the insertImage dialog.\"\n            imageAltText=\"Alternate text\"\n            i18n-imageHeight=\"kendo.editor.imageHeight|The caption for the image height in the insertImage dialog.\"\n            imageHeight=\"Height (px)\"\n            i18n-imageWebAddress=\"kendo.editor.imageWebAddress|The caption for the image URL in the insertImage dialog.\"\n            imageWebAddress=\"Web address\"\n            i18n-imageWidth=\"kendo.editor.imageWidth|The caption for the image width in the insertImage dialog.\"\n            imageWidth=\"Width (px)\"\n            i18n-indent=\"kendo.editor.indent|The title of the tool that indents the content.\"\n            indent=\"Indent\"\n            i18n-insertFile=\"kendo.editor.insertFile|The title of the tool that inserts links to files.\"\n            insertFile=\"Insert file\"\n            i18n-insertImage=\"kendo.editor.insertImage|The title of the tool that inserts images.\"\n            insertImage=\"Insert image\"\n            i18n-insertOrderedList=\"kendo.editor.insertOrderedList|The title of the tool that inserts an ordered list.\"\n            insertOrderedList=\"Insert ordered list\"\n            i18n-insertUnorderedList=\"kendo.editor.insertUnorderedList|The title of the tool that inserts an unordered list.\"\n            insertUnorderedList=\"Insert unordered list\"\n            i18n-italic=\"kendo.editor.italic|The title of the tool that makes text italicized.\"\n            italic=\"Italic\"\n            i18n-linkOpenInNewWindow=\"kendo.editor.linkOpenInNewWindow|The caption for the checkbox for opening the link in a new window in the createLink dialog.\"\n            linkOpenInNewWindow=\"Open link in new window\"\n            i18n-linkText=\"kendo.editor.linkText|The caption for the link text in the createLink dialog.\"\n            linkText=\"Text\"\n            i18n-linkTitle=\"kendo.editor.linkTitle|The caption for the link title in the createLink dialog.\"\n            linkTitle=\"Title\"\n            i18n-linkWebAddress=\"kendo.editor.linkWebAddress|The caption for the URL in the createLink dialog.\"\n            linkWebAddress=\"Web address\"\n            i18n-outdent=\"kendo.editor.outdent|The title of the tool that outdents the content.\"\n            outdent=\"Outdent\"\n            i18n-redo=\"kendo.editor.redo|The title of the tool that undos the last action.\"\n            redo=\"Redo\"\n            i18n-strikethrough=\"kendo.editor.strikethrough|The title of the tool that strikes through text.\"\n            strikethrough=\"Strikethrough\"\n            i18n-subscript=\"kendo.editor.subscript|The title of the tool that makes text subscript.\"\n            subscript=\"Subscript\"\n            i18n-superscript=\"kendo.editor.superscript|The title of the tool that makes text superscript.\"\n            superscript=\"Superscript\"\n            i18n-underline=\"kendo.editor.underline|The title of the tool that underlines text.\"\n            underline=\"Underline\"\n            i18n-unlink=\"kendo.editor.unlink|The title of the tool that removes hyperlinks.\"\n            unlink=\"Remove Link\"\n            i18n-undo=\"kendo.editor.undo|The title of the tool that undos the last action.\"\n            undo=\"Undo\"\n            i18n-viewSource=\"kendo.editor.viewSource|The title of the tool that shows the editor value as HTML.\"\n            viewSource=\"View source\"\n            i18n-insertTable=\"kendo.editor.insertTable|The title of the tool that inserts table.\"\n            insertTable=\"Insert Table\"\n            i18n-addColumnBefore=\"kendo.editor.addColumnBefore|The title of the tool that adds new column before currently selected column.\"\n            addColumnBefore=\"Add column before\"\n            i18n-addColumnAfter=\"kendo.editor.addColumnAfter|The title of the tool that adds new column after currently selected column.\"\n            addColumnAfter=\"Add column after\"\n            i18n-addRowBefore=\"kendo.editor.addRowBefore|The title of the tool that adds new row before currently selected row.\"\n            addRowBefore=\"Add row before\"\n            i18n-addRowAfter=\"kendo.editor.addRowAfter|The title of the tool that adds new row after currently selected row.\"\n            addRowAfter=\"Add row after\"\n            i18n-deleteColumn=\"kendo.editor.deleteColumn|The title of the tool that deletes a table column.\"\n            deleteColumn=\"Delete column\"\n            i18n-deleteRow=\"kendo.editor.deleteRow|The title of the tool that deletes a table row.\"\n            deleteRow=\"Delete row\"\n            i18n-deleteTable=\"kendo.editor.deleteTable|The title of the tool that deletes a table.\"\n            deleteTable=\"Delete table\"\n        >\n        </ng-container>\n\n        <ng-content select=\"kendo-toolbar\"></ng-content>\n        <kendo-toolbar [overflow]=\"true\" [tabindex]=\"readonly ? -1 : 0\" *ngIf=\"!userToolBarElement\" #defaultToolbar>\n            <kendo-toolbar-buttongroup>\n                <kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>\n            </kendo-toolbar-buttongroup>\n            <kendo-toolbar-dropdownlist kendoEditorFormat></kendo-toolbar-dropdownlist>\n            <kendo-toolbar-buttongroup>\n                <kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>\n            </kendo-toolbar-buttongroup>\n            <kendo-toolbar-buttongroup>\n                <kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>\n            </kendo-toolbar-buttongroup>\n            <kendo-toolbar-buttongroup>\n                <kendo-toolbar-button kendoEditorCreateLinkButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorUnlinkButton></kendo-toolbar-button>\n            </kendo-toolbar-buttongroup>\n            <kendo-toolbar-button kendoEditorInsertImageButton></kendo-toolbar-button>\n        </kendo-toolbar>\n\n        <div *ngIf=\"!iframe\" #content [attr.dir]=\"direction\" class=\"k-editor-content\"></div>\n\n        <div class=\"k-editor-content\" *ngIf=\"iframe\">\n            <iframe #content frameborder=\"0\" class=\"k-iframe\" (load)=\"iframeOnLoad()\"></iframe>\n        </div>\n\n        <ng-container #dialogsContainer></ng-container>\n    ",
+            template: "\n        <ng-container\n            kendoEditorLocalizedMessages\n            i18n-alignCenter=\"kendo.editor.alignCenter|The title of the tool that aligns text in the center.\"\n            alignCenter=\"Center text\"\n            i18n-alignJustify=\"kendo.editor.alignJustify|The title of the tool that justifies text both left and right.\"\n            alignJustify=\"Justify\"\n            i18n-alignLeft=\"kendo.editor.alignLeft|The title of the tool that aligns text on the left.\"\n            alignLeft=\"Align text left\"\n            i18n-alignRight=\"kendo.editor.alignRight|The title of the tool that aligns text on the right.\"\n            alignRight=\"Align text right\"\n            i18n-backColor=\"kendo.editor.backColor|The title of the tool that changes the text background color.\"\n            backColor=\"Background color\"\n            i18n-bold=\"kendo.editor.bold|The title of the tool that makes text bold.\"\n            bold=\"Bold\"\n            i18n-cleanFormatting=\"kendo.editor.cleanFormatting|The title of the Clean Formatting tool.\"\n            cleanFormatting=\"Clean formatting\"\n            i18n-createLink=\"kendo.editor.createLink|The title of the tool that creates hyperlinks.\"\n            createLink=\"Insert link\"\n            i18n-dialogApply=\"kendo.editor.dialogApply|The label of the **Apply** button in all editor dialogs.\"\n            dialogApply=\"Apply\"\n            i18n-dialogCancel=\"kendo.editor.dialogCancel|The label of the **Cancel** button in all editor dialogs.\"\n            dialogCancel=\"Cancel\"\n            i18n-dialogInsert=\"kendo.editor.dialogInsert|The label of the **Insert** button in all editor dialogs.\"\n            dialogInsert=\"Insert\"\n            i18n-dialogUpdate=\"kendo.editor.dialogUpdate|The label of the **Update** button in all editor dialogs.\"\n            dialogUpdate=\"Update\"\n            i18n-fileText=\"kendo.editor.fileText|The caption for the file text in the insertFile dialog.\"\n            fileText=\"Text\"\n            i18n-fileTitle=\"kendo.editor.fileTitle|The caption for the file Title in the insertFile dialog.\"\n            fileTitle=\"Title\"\n            i18n-fileWebAddress=\"kendo.editor.fileWebAddress|The caption for the file URL in the insertFile dialog.\"\n            fileWebAddress=\"Web address\"\n            i18n-fontFamily=\"kendo.editor.fontFamily|The title of the tool that changes the text font.\"\n            fontFamily=\"Select font family\"\n            i18n-fontSize=\"kendo.editor.fontSize|The title of the tool that changes the text size.\"\n            fontSize=\"Select font size\"\n            i18n-foreColor=\"kendo.editor.foreColor|The title of the tool that changes the text color.\"\n            foreColor=\"Color\"\n            i18n-format=\"kendo.editor.format|The title of the tool that lets users choose block formats.\"\n            format=\"Format\"\n            i18n-imageAltText=\"kendo.editor.imageAltText|The caption for the image alternate text in the insertImage dialog.\"\n            imageAltText=\"Alternate text\"\n            i18n-imageHeight=\"kendo.editor.imageHeight|The caption for the image height in the insertImage dialog.\"\n            imageHeight=\"Height (px)\"\n            i18n-imageWebAddress=\"kendo.editor.imageWebAddress|The caption for the image URL in the insertImage dialog.\"\n            imageWebAddress=\"Web address\"\n            i18n-imageWidth=\"kendo.editor.imageWidth|The caption for the image width in the insertImage dialog.\"\n            imageWidth=\"Width (px)\"\n            i18n-indent=\"kendo.editor.indent|The title of the tool that indents the content.\"\n            indent=\"Indent\"\n            i18n-insertFile=\"kendo.editor.insertFile|The title of the tool that inserts links to files.\"\n            insertFile=\"Insert file\"\n            i18n-insertImage=\"kendo.editor.insertImage|The title of the tool that inserts images.\"\n            insertImage=\"Insert image\"\n            i18n-insertOrderedList=\"kendo.editor.insertOrderedList|The title of the tool that inserts an ordered list.\"\n            insertOrderedList=\"Insert ordered list\"\n            i18n-insertUnorderedList=\"kendo.editor.insertUnorderedList|The title of the tool that inserts an unordered list.\"\n            insertUnorderedList=\"Insert unordered list\"\n            i18n-italic=\"kendo.editor.italic|The title of the tool that makes text italicized.\"\n            italic=\"Italic\"\n            i18n-linkOpenInNewWindow=\"kendo.editor.linkOpenInNewWindow|The caption for the checkbox for opening the link in a new window in the createLink dialog.\"\n            linkOpenInNewWindow=\"Open link in new window\"\n            i18n-linkText=\"kendo.editor.linkText|The caption for the link text in the createLink dialog.\"\n            linkText=\"Text\"\n            i18n-linkTitle=\"kendo.editor.linkTitle|The caption for the link title in the createLink dialog.\"\n            linkTitle=\"Title\"\n            i18n-linkWebAddress=\"kendo.editor.linkWebAddress|The caption for the URL in the createLink dialog.\"\n            linkWebAddress=\"Web address\"\n            i18n-outdent=\"kendo.editor.outdent|The title of the tool that outdents the content.\"\n            outdent=\"Outdent\"\n            i18n-print=\"kendo.editor.print|The title of the print tool.\"\n            print=\"Print\"\n            i18n-redo=\"kendo.editor.redo|The title of the tool that undos the last action.\"\n            redo=\"Redo\"\n            i18n-selectAll=\"kendo.editor.selectAll|The title of the tool that selects all content.\"\n            selectAll=\"Select All\"\n            i18n-strikethrough=\"kendo.editor.strikethrough|The title of the tool that strikes through text.\"\n            strikethrough=\"Strikethrough\"\n            i18n-subscript=\"kendo.editor.subscript|The title of the tool that makes text subscript.\"\n            subscript=\"Subscript\"\n            i18n-superscript=\"kendo.editor.superscript|The title of the tool that makes text superscript.\"\n            superscript=\"Superscript\"\n            i18n-underline=\"kendo.editor.underline|The title of the tool that underlines text.\"\n            underline=\"Underline\"\n            i18n-unlink=\"kendo.editor.unlink|The title of the tool that removes hyperlinks.\"\n            unlink=\"Remove Link\"\n            i18n-undo=\"kendo.editor.undo|The title of the tool that undos the last action.\"\n            undo=\"Undo\"\n            i18n-viewSource=\"kendo.editor.viewSource|The title of the tool that shows the editor value as HTML.\"\n            viewSource=\"View source\"\n            i18n-insertTable=\"kendo.editor.insertTable|The title of the tool that inserts table.\"\n            insertTable=\"Insert Table\"\n            i18n-addColumnBefore=\"kendo.editor.addColumnBefore|The title of the tool that adds new column before currently selected column.\"\n            addColumnBefore=\"Add column before\"\n            i18n-addColumnAfter=\"kendo.editor.addColumnAfter|The title of the tool that adds new column after currently selected column.\"\n            addColumnAfter=\"Add column after\"\n            i18n-addRowBefore=\"kendo.editor.addRowBefore|The title of the tool that adds new row before currently selected row.\"\n            addRowBefore=\"Add row before\"\n            i18n-addRowAfter=\"kendo.editor.addRowAfter|The title of the tool that adds new row after currently selected row.\"\n            addRowAfter=\"Add row after\"\n            i18n-deleteColumn=\"kendo.editor.deleteColumn|The title of the tool that deletes a table column.\"\n            deleteColumn=\"Delete column\"\n            i18n-deleteRow=\"kendo.editor.deleteRow|The title of the tool that deletes a table row.\"\n            deleteRow=\"Delete row\"\n            i18n-deleteTable=\"kendo.editor.deleteTable|The title of the tool that deletes a table.\"\n            deleteTable=\"Delete table\"\n        >\n        </ng-container>\n\n        <ng-content select=\"kendo-toolbar\"></ng-content>\n        <kendo-toolbar [overflow]=\"true\" [tabindex]=\"readonly ? -1 : 0\" *ngIf=\"!userToolBarElement\" #defaultToolbar>\n            <kendo-toolbar-buttongroup>\n                <kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>\n            </kendo-toolbar-buttongroup>\n            <kendo-toolbar-dropdownlist kendoEditorFormat></kendo-toolbar-dropdownlist>\n            <kendo-toolbar-buttongroup>\n                <kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>\n            </kendo-toolbar-buttongroup>\n            <kendo-toolbar-buttongroup>\n                <kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>\n            </kendo-toolbar-buttongroup>\n            <kendo-toolbar-buttongroup>\n                <kendo-toolbar-button kendoEditorCreateLinkButton></kendo-toolbar-button>\n                <kendo-toolbar-button kendoEditorUnlinkButton></kendo-toolbar-button>\n            </kendo-toolbar-buttongroup>\n            <kendo-toolbar-button kendoEditorInsertImageButton></kendo-toolbar-button>\n        </kendo-toolbar>\n\n        <div *ngIf=\"!iframe\" #content [attr.dir]=\"direction\" class=\"k-editor-content\"></div>\n\n        <div class=\"k-editor-content\" *ngIf=\"iframe\">\n            <iframe #content frameborder=\"0\" class=\"k-iframe\" (load)=\"iframeOnLoad()\"></iframe>\n        </div>\n\n        <ng-container #dialogsContainer></ng-container>\n    ",
             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        "
             ]
@@ -987,7 +992,8 @@ var EditorComponent = /** @class */ (function () {
             LocalizationService,
             ChangeDetectorRef,
             NgZone,
-            ElementRef])
+            ElementRef,
+            EditorToolsService])
     ], EditorComponent);
     return EditorComponent;
 }());

package/dist/es/editor.module.js

@@ -66,6 +66,8 @@ import { FontFamilyDropDownListComponent } from './tools/fontfamily/editor-fontf
 import { FontSizeDropDownListComponent } from './tools/fontsize/editor-fontsize-dropdownlist.component';
 import { FontSizeDialogComponent } from './dialogs/font-size-dialog.component';
 import { DropDownToolDirective } from './tools/shared/dropdown-tool.directive';
+import { EditorPrintDirective } from './tools/print/editor-print-button.directive';
+import { EditorSelectAllButtonDirective } from './tools/select-all/select-all-button.directive';
 var COMPONENT_DIRECTIVES = [
     //alignment
     EditorAlignLeftButtonDirective,
@@ -117,7 +119,11 @@ var COMPONENT_DIRECTIVES = [
     CustomMessagesComponent,
     LocalizedMessagesDirective,
     // dropdown tools
-    DropDownToolDirective
+    DropDownToolDirective,
+    // print
+    EditorPrintDirective,
+    // select all
+    EditorSelectAllButtonDirective
 ];
 var TOOLBAR_TOOLS = [
     EditorFontSizeComponent,

package/dist/es/index.js

@@ -42,6 +42,8 @@ export { EditorInsertFileButtonDirective } from './tools/link/editor-insert-file
 export { EditorUnlinkButtonDirective } from './tools/link/editor-unlink-button.directive';
 export { EditorInsertOrderedListButtonDirective } from './tools/list/editor-insert-ordered-list-button.directive';
 export { EditorInsertUnorderedListButtonDirective } from './tools/list/editor-insert-unordered-list-button.directive';
+export { EditorPrintDirective } from './tools/print/editor-print-button.directive';
+export { EditorSelectAllButtonDirective } from './tools/select-all/select-all-button.directive';
 export { DropDownToolDirective } from './tools/shared/dropdown-tool.directive';
 export { EditorCommandBase } from './tools/shared/editor-command-base';
 export { EditorCommandButton } from './tools/shared/editor-command-button';
@@ -58,6 +60,7 @@ export { EditorInsertTableButtonComponent } from './tools/tables/editor-insert-t
 export { EditorMergeCellsButtonDirective } from './tools/tables/editor-merge-cells-button.directive';
 export { EditorSplitCellButtonDirective } from './tools/tables/editor-split-cell-button.directive';
 export { PopupTableGridComponent } from './tools/tables/popup-table-grid.component';
+export { EditorToolsService } from './tools/tools.service';
 export { EditorBoldButtonDirective } from './tools/typographical-emphasis/editor-bold-button.directive';
 export { EditorItalicButtonDirective } from './tools/typographical-emphasis/editor-italic-button.directive';
 export { EditorStrikethroughButtonDirective } from './tools/typographical-emphasis/editor-strikethrough-button.directive';

package/dist/es/localization/messages.js

@@ -89,10 +89,18 @@ var Messages = /** @class */ (function (_super) {
         Input(),
         tslib_1.__metadata("design:type", String)
     ], Messages.prototype, "outdent", void 0);
+    tslib_1.__decorate([
+        Input(),
+        tslib_1.__metadata("design:type", String)
+    ], Messages.prototype, "print", void 0);
     tslib_1.__decorate([
         Input(),
         tslib_1.__metadata("design:type", String)
     ], Messages.prototype, "redo", void 0);
+    tslib_1.__decorate([
+        Input(),
+        tslib_1.__metadata("design:type", String)
+    ], Messages.prototype, "selectAll", void 0);
     tslib_1.__decorate([
         Input(),
         tslib_1.__metadata("design:type", String)

package/dist/es/package-metadata.js

@@ -9,7 +9,7 @@ export var packageMetadata = {
     name: '@progress/kendo-angular-editor',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1637061495,
+    publishDate: 1638192544,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/dist/es/tools/alignment/editor-align-center-button.directive.js

@@ -8,6 +8,7 @@ import { ToolBarButtonComponent } from '@progress/kendo-angular-toolbar';
 import { EditorComponent } from '../../editor.component';
 import { EditorCommandButton } from '../shared/editor-command-button';
 import { EditorLocalizationService } from '../../localization/editor-localization.service';
+import { EditorToolsService } from '../tools.service';
 /**
  * A directive which configures an existing `ToolBarButtonComponent` as an Editor AlignCenter tool
  * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
@@ -28,8 +29,8 @@ import { EditorLocalizationService } from '../../localization/editor-localizatio
  */
 var EditorAlignCenterButtonDirective = /** @class */ (function (_super) {
     tslib_1.__extends(EditorAlignCenterButtonDirective, _super);
-    function EditorAlignCenterButtonDirective(button, editor, localization) {
-        return _super.call(this, 'alignCenter', button, editor, localization) || this;
+    function EditorAlignCenterButtonDirective(button, editor, localization, toolsService) {
+        return _super.call(this, 'alignCenter', button, editor, localization, toolsService) || this;
     }
     EditorAlignCenterButtonDirective = tslib_1.__decorate([
         Directive({
@@ -38,7 +39,8 @@ var EditorAlignCenterButtonDirective = /** @class */ (function (_super) {
         tslib_1.__param(1, Host()),
         tslib_1.__metadata("design:paramtypes", [ToolBarButtonComponent,
             EditorComponent,
-            EditorLocalizationService])
+            EditorLocalizationService,
+            EditorToolsService])
     ], EditorAlignCenterButtonDirective);
     return EditorAlignCenterButtonDirective;
 }(EditorCommandButton));

package/dist/es/tools/alignment/editor-align-justify-button.directive.js

@@ -8,6 +8,7 @@ import { ToolBarButtonComponent } from '@progress/kendo-angular-toolbar';
 import { EditorComponent } from '../../editor.component';
 import { EditorCommandButton } from '../shared/editor-command-button';
 import { EditorLocalizationService } from '../../localization/editor-localization.service';
+import { EditorToolsService } from '../tools.service';
 /**
  * A directive which configures an existing `ToolBarButtonComponent` as an Editor AlignJustify tool
  * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
@@ -28,8 +29,8 @@ import { EditorLocalizationService } from '../../localization/editor-localizatio
  */
 var EditorAlignJustifyButtonDirective = /** @class */ (function (_super) {
     tslib_1.__extends(EditorAlignJustifyButtonDirective, _super);
-    function EditorAlignJustifyButtonDirective(button, editor, localization) {
-        return _super.call(this, 'alignJustify', button, editor, localization) || this;
+    function EditorAlignJustifyButtonDirective(button, editor, localization, toolsService) {
+        return _super.call(this, 'alignJustify', button, editor, localization, toolsService) || this;
     }
     EditorAlignJustifyButtonDirective = tslib_1.__decorate([
         Directive({
@@ -38,7 +39,8 @@ var EditorAlignJustifyButtonDirective = /** @class */ (function (_super) {
         tslib_1.__param(1, Host()),
         tslib_1.__metadata("design:paramtypes", [ToolBarButtonComponent,
             EditorComponent,
-            EditorLocalizationService])
+            EditorLocalizationService,
+            EditorToolsService])
     ], EditorAlignJustifyButtonDirective);
     return EditorAlignJustifyButtonDirective;
 }(EditorCommandButton));

package/dist/es/tools/alignment/editor-align-left-button.directive.js

@@ -8,6 +8,7 @@ import { ToolBarButtonComponent } from '@progress/kendo-angular-toolbar';
 import { EditorComponent } from '../../editor.component';
 import { EditorCommandButton } from '../shared/editor-command-button';
 import { EditorLocalizationService } from '../../localization/editor-localization.service';
+import { EditorToolsService } from '../tools.service';
 /**
  * A directive which configures an existing `ToolBarButtonComponent` as an Editor AlignLeft tool
  * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
@@ -28,8 +29,8 @@ import { EditorLocalizationService } from '../../localization/editor-localizatio
  */
 var EditorAlignLeftButtonDirective = /** @class */ (function (_super) {
     tslib_1.__extends(EditorAlignLeftButtonDirective, _super);
-    function EditorAlignLeftButtonDirective(button, editor, localization) {
-        return _super.call(this, 'alignLeft', button, editor, localization) || this;
+    function EditorAlignLeftButtonDirective(button, editor, localization, toolsService) {
+        return _super.call(this, 'alignLeft', button, editor, localization, toolsService) || this;
     }
     EditorAlignLeftButtonDirective = tslib_1.__decorate([
         Directive({
@@ -38,7 +39,8 @@ var EditorAlignLeftButtonDirective = /** @class */ (function (_super) {
         tslib_1.__param(1, Host()),
         tslib_1.__metadata("design:paramtypes", [ToolBarButtonComponent,
             EditorComponent,
-            EditorLocalizationService])
+            EditorLocalizationService,
+            EditorToolsService])
     ], EditorAlignLeftButtonDirective);
     return EditorAlignLeftButtonDirective;
 }(EditorCommandButton));

package/dist/es/tools/alignment/editor-align-right-button.directive.js

@@ -8,6 +8,7 @@ import { ToolBarButtonComponent } from '@progress/kendo-angular-toolbar';
 import { EditorComponent } from '../../editor.component';
 import { EditorCommandButton } from '../shared/editor-command-button';
 import { EditorLocalizationService } from '../../localization/editor-localization.service';
+import { EditorToolsService } from '../tools.service';
 /**
  * A directive which configures an existing `ToolBarButtonComponent` as an Editor AlignRight tool
  * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
@@ -28,8 +29,8 @@ import { EditorLocalizationService } from '../../localization/editor-localizatio
  */
 var EditorAlignRightButtonDirective = /** @class */ (function (_super) {
     tslib_1.__extends(EditorAlignRightButtonDirective, _super);
-    function EditorAlignRightButtonDirective(button, editor, localization) {
-        return _super.call(this, 'alignRight', button, editor, localization) || this;
+    function EditorAlignRightButtonDirective(button, editor, localization, toolsService) {
+        return _super.call(this, 'alignRight', button, editor, localization, toolsService) || this;
     }
     EditorAlignRightButtonDirective = tslib_1.__decorate([
         Directive({
@@ -38,7 +39,8 @@ var EditorAlignRightButtonDirective = /** @class */ (function (_super) {
         tslib_1.__param(1, Host()),
         tslib_1.__metadata("design:paramtypes", [ToolBarButtonComponent,
             EditorComponent,
-            EditorLocalizationService])
+            EditorLocalizationService,
+            EditorToolsService])
     ], EditorAlignRightButtonDirective);
     return EditorAlignRightButtonDirective;
 }(EditorCommandButton));

package/dist/es/tools/editor-clean-formatting-button.directive.js

@@ -8,6 +8,7 @@ import { ToolBarButtonComponent } from '@progress/kendo-angular-toolbar';
 import { EditorComponent } from '../editor.component';
 import { EditorCommandButton } from './shared/editor-command-button';
 import { EditorLocalizationService } from '../localization/editor-localization.service';
+import { EditorToolsService } from './tools.service';
 /**
  * A directive which configures an existing `ToolBarButtonComponent` as an Editor Clean Formatting tool
  * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
@@ -27,8 +28,8 @@ import { EditorLocalizationService } from '../localization/editor-localization.s
  */
 var EditorCleanFormattingButtonDirective = /** @class */ (function (_super) {
     tslib_1.__extends(EditorCleanFormattingButtonDirective, _super);
-    function EditorCleanFormattingButtonDirective(button, editor, localization) {
-        return _super.call(this, 'cleanFormatting', button, editor, localization) || this;
+    function EditorCleanFormattingButtonDirective(button, editor, localization, toolsService) {
+        return _super.call(this, 'cleanFormatting', button, editor, localization, toolsService) || this;
     }
     EditorCleanFormattingButtonDirective = tslib_1.__decorate([
         Directive({
@@ -37,7 +38,8 @@ var EditorCleanFormattingButtonDirective = /** @class */ (function (_super) {
         tslib_1.__param(1, Host()),
         tslib_1.__metadata("design:paramtypes", [ToolBarButtonComponent,
             EditorComponent,
-            EditorLocalizationService])
+            EditorLocalizationService,
+            EditorToolsService])
     ], EditorCleanFormattingButtonDirective);
     return EditorCleanFormattingButtonDirective;
 }(EditorCommandButton));

package/dist/es/tools/fontfamily/editor-fontfamily.component.js

@@ -11,6 +11,7 @@ import { EditorLocalizationService } from '../../localization/editor-localizatio
 import { DialogService } from '@progress/kendo-angular-dialog';
 import { FontFamilyDialogComponent } from '../../dialogs/font-family-dialog.component';
 import { FontFamilyDropDownListComponent } from './editor-fontfamily-dropdownlist.component';
+import { EditorToolsService } from '../tools.service';
 /**
  * A component which configures an existing `DropDownListComponent` as an Editor tool
  * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
@@ -24,11 +25,12 @@ import { FontFamilyDropDownListComponent } from './editor-fontfamily-dropdownlis
  */
 var EditorFontFamilyComponent = /** @class */ (function (_super) {
     tslib_1.__extends(EditorFontFamilyComponent, _super);
-    function EditorFontFamilyComponent(editor, dialogService, localization) {
+    function EditorFontFamilyComponent(editor, dialogService, localization, toolsService) {
         var _this = _super.call(this) || this;
         _this.editor = editor;
         _this.dialogService = dialogService;
         _this.localization = localization;
+        _this.toolsService = toolsService;
         _this.disabled = false;
         _this.tabindex = -1;
         /**
@@ -77,7 +79,10 @@ var EditorFontFamilyComponent = /** @class */ (function (_super) {
                 return itemArgs.dataItem.fontName === null;
             }
         };
-        setTimeout(function () { return (_this.defaultItem = { text: _this.title, fontName: null }); });
+        setTimeout(function () {
+            _this.defaultItem = { text: _this.title, fontName: null };
+            _this.toolsService.needsCheck.next();
+        });
         this.subs = this.editor.stateChange.subscribe(function (_a) {
             var style = _a.style;
             _this.value = getUniqueStyleValues(style.selected, 'font-family') || null;
@@ -198,7 +203,8 @@ var EditorFontFamilyComponent = /** @class */ (function (_super) {
         tslib_1.__param(0, Host()),
         tslib_1.__metadata("design:paramtypes", [EditorComponent,
             DialogService,
-            EditorLocalizationService])
+            EditorLocalizationService,
+            EditorToolsService])
     ], EditorFontFamilyComponent);
     return EditorFontFamilyComponent;
 }(ToolBarToolComponent));