@progress/kendo-angular-editor 3.0.0-dev.202112211443 → 3.0.0

package/dist/fesm5/index.js

@@ -10,14 +10,14 @@ import { take, map, filter, concatMap, takeUntil } from 'rxjs/operators';
 import { ToolBarComponent, ToolBarToolComponent, ToolBarButtonComponent, ToolBarModule } from '@progress/kendo-angular-toolbar';
 import { DialogRef, DialogContentBase, DialogService, DialogModule } from '@progress/kendo-angular-dialog';
 import { isDocumentAvailable, guid, PreventableEvent, KendoInput, hasObservers, Keys } from '@progress/kendo-angular-common';
-import { nodes, Schema, marks, SelectionRange, TextSelection, Fragment, Slice, Selection, NodeSelection, insertNode, expandToWordWrap, toggleInlineFormat, bold, cleanFormatting, applyLink, applyInlineStyle, insertText, italic, strikethrough, subscript, superscript, underline, removeLink, link, selectAll, isAligned, alignCenterRules, alignBlocks, alignRemoveRules, alignJustifyRules, alignLeftRules, alignRightRules, formatBlockElements, getHtml, indent, insertImage, toggleOrderedList, toggleUnorderedList, outdent, redo, setHtml, undo, hasMark, activeNode, canIndentAsListItem, canBeIndented, indentRules, hasNode, canOutdentAsListItem, outdentRules, getActiveMarks, expandSelection, addColumnBefore, addColumnAfter, addRowBefore, addRowAfter, deleteRow, deleteColumn, mergeCells, splitCell, deleteTable, getNodeFromSelection, getMark, getSelectionText, parseContent, Plugin, PluginKey, history, keymap, buildListKeymap, buildKeymap, baseKeymap, gapCursor, imageResizing, placeholder, EditorState, EditorView, pasteCleanup, AllSelection, removeComments, sanitize, removeAttribute, sanitizeStyleAttr, sanitizeClassAttr } from '@progress/kendo-editor-common';
+import { nodes, Schema, marks, createTable, insertNode, expandToWordWrap, toggleInlineFormat, bold, cleanFormatting, applyLink, applyInlineStyle, insertText, italic, strikethrough, subscript, superscript, underline, removeLink, link, selectAll, isAligned, alignCenterRules, alignBlocks, alignRemoveRules, alignJustifyRules, alignLeftRules, alignRightRules, formatBlockElements, getHtml, indent, insertImage, toggleOrderedList, toggleUnorderedList, outdent, redo, setHtml, undo, blockquote, addColumnBefore, addColumnAfter, addRowBefore, addRowAfter, deleteRow, deleteColumn, mergeCells, splitCell, deleteTable, hasMark, activeNode, canIndentAsListItem, canBeIndented, indentRules, hasNode, canOutdentAsListItem, outdentRules, isIndented, getActiveMarks, expandSelection, getNodeFromSelection, getMark, getSelectionText, TextSelection, parseContent, Plugin, PluginKey, history, keymap, buildListKeymap, buildKeymap, baseKeymap, gapCursor, imageResizing, tableEditing, placeholder, EditorState, EditorView, pasteCleanup, AllSelection, removeComments, sanitize, removeAttribute, sanitizeStyleAttr, sanitizeClassAttr } from '@progress/kendo-editor-common';
 export { Schema, EditorState, Plugin, PluginKey, Transaction, EditorView, Decoration, DecorationSet, NodeType, Node, MarkType, Mark, InputRule, inputRules, wrappingInputRule, textblockTypeInputRule, keymap, baseKeymap, history, dropCursor, gapCursor, tableNodes, getSelectionText } from '@progress/kendo-editor-common';
 import { validatePackage } from '@progress/kendo-licensing';
 import { L10N_PREFIX, RTL, MessageService, LocalizationService, ComponentMessages } from '@progress/kendo-angular-l10n';
 import { CommonModule } from '@angular/common';
 import { DropDownListComponent, DropDownsModule } from '@progress/kendo-angular-dropdowns';
 import { ButtonModule } from '@progress/kendo-angular-buttons';
-import { ColorPickerComponent, ColorPickerModule, NumericTextBoxModule, TextBoxModule } from '@progress/kendo-angular-inputs';
+import { ColorPickerComponent, ColorPickerModule, NumericTextBoxModule, CheckBoxModule, TextBoxModule } from '@progress/kendo-angular-inputs';
 import { PopupService } from '@progress/kendo-angular-popup';
 
 /**
@@ -27,7 +27,7 @@ var packageMetadata = {
     name: '@progress/kendo-angular-editor',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1640097479,
+    publishDate: 1642604521,
     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'
 };
@@ -70,1598 +70,84 @@ var getAttributes = function (dom) {
 /**
  * @hidden
  */
-var serializeDOMAttrs = function (el) {
-    return Array.from(el.attributes)
-        .reduce(function (acc, curr) {
-        var _a;
-        return Object.assign({}, acc, (_a = {}, _a[curr.name] = curr.value, _a));
-    }, {});
-};
-/**
- * @hidden
- */
-var commonAttributes = function () {
-    return __assign({}, createDefaultAttributes(['class', 'id', 'style']));
-};
-/**
- * @hidden
- */
-var createDefaultAttributes = function (attrs) {
-    if (attrs === void 0) { attrs = []; }
-    return __assign({}, attrs.reduce(function (acc, curr) {
-        var _a;
-        return (__assign({}, acc, (_a = {}, _a[curr] = { default: null }, _a)));
-    }, {}));
-};
-/**
- * @hidden
- */
-var hole = 0;
-/**
- * @hidden
- */
-var isSchemaNode = function (schemaNodeName) { return function (node) { return node.type.name === schemaNodeName; }; };
-/**
- * @hidden
- */
-var isTable = isSchemaNode('table');
-/**
- * @hidden
- */
-var isTableBody = isSchemaNode('table_body');
-/**
- * @hidden
- */
-var isTableHead = isSchemaNode('table_head');
-/**
- * @hidden
- */
-var isTableFoot = isSchemaNode('table_foot');
-/**
- * @hidden
- */
-var isTableRow = isSchemaNode('table_row');
-/**
- * @hidden
- */
-var isTableCell = isSchemaNode('table_cell');
-/**
- * @hidden
- */
-var isTableHeaderCell = isSchemaNode('table_header');
-
-var createSemanticNode = function (tagName) { return ({
-    // Uncaught SyntaxError: Mixing inline and block content (in content expression '(block | inline)*')
-    // content: '(block | inline)*',
-    content: 'block*',
-    group: 'block',
-    attrs: __assign({}, commonAttributes()),
-    parseDOM: [{
-            tag: tagName,
-            getAttrs: getAttributes
-        }],
-    toDOM: function (node) { return hasAttrs(node.attrs) ? [tagName, getAttrs(node.attrs), hole] : [tagName, hole]; }
-}); };
-/**
- * @hidden
- */
-var semanticTagNames = ['article', 'main', 'nav', 'header', 'footer', 'aside', 'section'];
-var ɵ1 = function (acc, curr) {
-    var _a;
-    return Object.assign(acc, (_a = {}, _a[curr] = createSemanticNode(curr), _a));
-};
-/**
- * @hidden
- */
-var semanticNodes = semanticTagNames.reduce(ɵ1, {});
-
-/**
- * @hidden
- */
-function outerWidth(element) {
-    var width = element.offsetWidth;
-    var style = getComputedStyle(element);
-    width += parseFloat(style.marginLeft) || 0 + parseFloat(style.marginRight) || 0;
-    return width;
-}
-/**
- * @hidden
- */
-var removeEntries = function (obj, predicate) {
-    return Object.keys(obj)
-        .filter(function (key) { return predicate(key); })
-        .reduce(function (acc, curr) {
-        var _a;
-        return Object.assign(acc, (_a = {}, _a[curr] = obj[curr], _a));
-    }, {});
-};
-/**
- * @hidden
- */
-var removeEmptyEntries = function (obj) {
-    var predicate = function (key) { return obj[key] !== null && obj[key] !== undefined && obj[key] !== ''; };
-    return removeEntries(obj, predicate);
-};
-/**
- * @hidden
- */
-var isNullOrUndefined = function (value) { return value === undefined || value === null; };
-/**
- * @hidden
- */
-var isPresent = function (value) { return !isNullOrUndefined(value); };
-/**
- * @hidden
- */
-var detectIE = function () {
-    if (!isDocumentAvailable()) {
-        return false;
-    }
-    var ua = window.navigator.userAgent;
-    var msie = ua.indexOf('MSIE ');
-    var trident = ua.indexOf('Trident/');
-    return msie > 0 || trident > 0;
-};
-/**
- * @hidden
- */
-var safeString = function (value) { return (isNullOrUndefined(value) ? '' : value.toString()); };
-/**
- * @hidden
- */
-var first = function (arr) { return arr[0]; };
-/**
- * @hidden
- */
-var last = function (arr) { return arr[arr.length - 1]; };
-/**
- * @hidden
- */
-var split = function (splitter) { return function (value) { return value.split(splitter); }; };
-/**
- * @hidden
- */
-var trim = function (value) { return value.trim(); };
-/**
- * @hidden
- */
-var filter$1 = function (predicate) { return function (arr) { return arr.filter(predicate); }; };
-/**
- * @hidden
- */
-var getUniqueStyleValues = function (style, cssStyle) {
-    if (style.hasNodesWithoutMarks) {
-        return '';
-    }
-    var uniqueMarkValues = style.marks
-        .filter(function (m) { return m.type.name === 'style'; })
-        .map(function (m) { return m.attrs.style; })
-        .map(safeString)
-        .map(split(';'))
-        .map(filter$1(function (m) { return m.includes(cssStyle); }))
-        // guards against empty array
-        .map(function (cssStyleValues) { return (cssStyleValues.length !== 0 ? cssStyleValues : [cssStyle + ": INVALID"]); })
-        .map(first)
-        .map(split(':'))
-        .map(last)
-        .map(trim)
-        .reduce(function (acc, curr) { return (acc.indexOf(curr) > -1 ? acc : acc.concat([curr])); }, []);
-    if (uniqueMarkValues.indexOf('INVALID') > -1 || uniqueMarkValues.length !== 1) {
-        return '';
-    }
-    return uniqueMarkValues[0];
-};
-/**
- * @hidden
- */
-var conditionallyExecute = function (fn) { return function (condition) { return function (param) { return (condition ? fn(param) : param); }; }; };
-/**
- * @hidden
- */
-var pipe = function () {
-    var fns = [];
-    for (var _i = 0; _i < arguments.length; _i++) {
-        fns[_i] = arguments[_i];
-    }
-    return function (x) { return fns.reduce(function (y, f) { return f(y); }, x); };
-};
-
-var setCellAttrs = function (nodeAttributes) {
-    var attrs = __assign({}, nodeAttributes);
-    if (nodeAttributes.colspan !== 1) {
-        attrs.colspan = nodeAttributes.colspan;
-    }
-    else {
-        attrs.colspan = null;
-    }
-    if (nodeAttributes.rowspan !== 1) {
-        attrs.rowspan = nodeAttributes.rowspan;
-    }
-    else {
-        attrs.rowspan = null;
-    }
-    return removeEmptyEntries(attrs);
-};
-var ɵ1$1 = function (node) { return ['table', removeEmptyEntries(node.attrs), 0]; }, ɵ2 = function (node) { return ['tr', removeEmptyEntries(node.attrs), 0]; }, ɵ3 = function (node) { return ['td', setCellAttrs(node.attrs), 0]; }, ɵ4 = function (node) { return ['th', setCellAttrs(node.attrs), 0]; }, ɵ5 = function (node) { return ['tbody', removeEmptyEntries(node.attrs), 0]; }, ɵ6 = function (node) { return ['tfoot', removeEmptyEntries(node.attrs), 0]; }, ɵ7 = function (node) { return ['thead', removeEmptyEntries(node.attrs), 0]; }, ɵ8 = function (node) { return ['col', removeEmptyEntries(node.attrs)]; }, ɵ9 = function (node) { return ['colgroup', removeEmptyEntries(node.attrs), 0]; };
-/**
- * @hidden
- */
-var tableNodes = {
-    // all table node names must start with table - this is needed for the commands to work properly
-    table: {
-        attrs: __assign({}, commonAttributes(), createDefaultAttributes(['cellspacing', 'cellpadding'])),
-        content: '(table_body | table_head | table_foot | table_colgroup)+',
-        tableRole: 'table',
-        isolating: true,
-        group: 'block',
-        parseDOM: [
-            {
-                getAttrs: serializeDOMAttrs,
-                tag: 'table'
-            }
-        ],
-        toDOM: ɵ1$1
-    },
-    table_row: {
-        content: '(table_cell | table_header)*',
-        attrs: __assign({}, commonAttributes()),
-        tableRole: 'row',
-        parseDOM: [
-            {
-                getAttrs: serializeDOMAttrs,
-                tag: 'tr'
-            }
-        ],
-        toDOM: ɵ2
-    },
-    table_cell: {
-        content: 'block+',
-        attrs: __assign({}, commonAttributes(), createDefaultAttributes(['headers']), { 
-            // this is needed for the commands
-            colspan: { default: 1 }, rowspan: { default: 1 } }),
-        tableRole: 'cell',
-        isolating: true,
-        parseDOM: [
-            {
-                getAttrs: serializeDOMAttrs,
-                tag: 'td'
-            }
-        ],
-        toDOM: ɵ3
-    },
-    table_header: {
-        content: 'block+',
-        attrs: __assign({}, commonAttributes(), createDefaultAttributes(['headers', 'abbr', 'scope']), { colspan: { default: 1 }, rowspan: { default: 1 } }),
-        tableRole: 'header_cell',
-        isolating: true,
-        parseDOM: [
-            {
-                getAttrs: serializeDOMAttrs,
-                tag: 'th'
-            }
-        ],
-        toDOM: ɵ4
-    },
-    table_body: {
-        attrs: __assign({}, commonAttributes()),
-        content: 'table_row+',
-        isolating: true,
-        parseDOM: [
-            {
-                getAttrs: serializeDOMAttrs,
-                tag: 'tbody'
-            }
-        ],
-        toDOM: ɵ5
-    },
-    table_foot: {
-        attrs: __assign({}, commonAttributes()),
-        content: 'table_row+',
-        isolating: true,
-        parseDOM: [
-            {
-                getAttrs: serializeDOMAttrs,
-                tag: 'tfoot'
-            }
-        ],
-        toDOM: ɵ6
-    },
-    table_head: {
-        attrs: __assign({}, commonAttributes()),
-        content: 'table_row+',
-        isolating: true,
-        parseDOM: [
-            {
-                getAttrs: serializeDOMAttrs,
-                tag: 'thead'
-            }
-        ],
-        toDOM: ɵ7
-    },
-    table_col: {
-        attrs: __assign({}, commonAttributes(), createDefaultAttributes(['span'])),
-        selectable: false,
-        atom: true,
-        parseDOM: [
-            {
-                getAttrs: serializeDOMAttrs,
-                tag: 'col'
-            }
-        ],
-        toDOM: ɵ8
-    },
-    table_colgroup: {
-        attrs: __assign({}, commonAttributes(), createDefaultAttributes(['span'])),
-        content: 'table_col*',
-        selectable: false,
-        parseDOM: [
-            {
-                getAttrs: serializeDOMAttrs,
-                tag: 'colgroup'
-            }
-        ],
-        toDOM: ɵ9
-    }
-};
-
-/**
- * @hidden
- */
-var marks$1 = marks;
-var nodes$1 = Object.assign(nodes, tableNodes, semanticNodes);
-/**
- * @hidden
- */
-var schema = new Schema({
-    marks: marks$1,
-    nodes: __assign({}, nodes$1, { blockquote: __assign({}, nodes$1.blockquote, { content: 'inline*' }) })
-});
-
-// Because working with row and column-spanning cells is not quite
-// trivial, this code builds up a descriptive structure for a given
-// table node. The structures are cached with the (persistent) table
-// nodes as key, so that they only have to be recomputed when the
-// content of the table changes.
-//
-// This does mean that they have to store table-relative, not
-// document-relative positions. So code that uses them will typically
-// compute the start position of the table and offset positions passed
-// to or gotten from this structure by that amount.
-var readFromCache;
-var addToCache;
-// Prefer using a weak map to cache table maps. Fall back on a
-// fixed-size cache if that's not supported.
-if (typeof WeakMap !== 'undefined') {
-    var cache_1 = new WeakMap();
-    readFromCache = function (key) { return cache_1.get(key); };
-    addToCache = function (key, value) {
-        cache_1.set(key, value);
-        return value;
-    };
-}
-else {
-    var cache_2 = [];
-    var cacheSize_1 = 10;
-    var cachePos_1 = 0;
-    readFromCache = function (key) {
-        for (var i = 0; i < cache_2.length; i += 2) {
-            if (cache_2[i] === key) {
-                return cache_2[i + 1];
-            }
-        }
-    };
-    addToCache = function (key, value) {
-        if (cachePos_1 === cacheSize_1) {
-            cachePos_1 = 0;
-        }
-        cache_2[cachePos_1++] = key;
-        return (cache_2[cachePos_1++] = value);
-    };
-}
-var findWidth = function (table) {
-    var width = -1;
-    var hasRowSpan = false;
-    for (var row = 0; row < table.childCount; row++) {
-        var rowNode = table.child(row);
-        var rowWidth = 0;
-        if (hasRowSpan) {
-            for (var j = 0; j < row; j++) {
-                var prevRow = table.child(j);
-                for (var i = 0; i < prevRow.childCount; i++) {
-                    var cell = prevRow.child(i);
-                    if (j + cell.attrs.rowspan > row) {
-                        rowWidth += cell.attrs.colspan;
-                    }
-                }
-            }
-        }
-        // check if the cell spans accross multiple columns
-        for (var i = 0; i < rowNode.childCount; i++) {
-            var cell = rowNode.child(i);
-            rowWidth += cell.attrs.colspan;
-            if (cell.attrs.rowspan > 1) {
-                hasRowSpan = true;
-            }
-        }
-        if (width === -1) {
-            width = rowWidth;
-        }
-        else if (width !== rowWidth) {
-            width = Math.max(width, rowWidth);
-        }
-    }
-    return width;
-};
-var freshColWidth = function (attrs) {
-    if (attrs.colwidth) {
-        return attrs.colwidth.slice();
-    }
-    var result = [];
-    for (var i = 0; i < attrs.colspan; i++) {
-        result.push(0);
-    }
-    return result;
-};
-var findBadColWidths = function (map$$1, colWidths, table) {
-    if (!map$$1.problems) {
-        map$$1.problems = [];
-    }
-    for (var i = 0, seen = {}; i < map$$1.map.length; i++) {
-        var pos = map$$1.map[i];
-        if (seen[pos]) {
-            continue;
-        }
-        seen[pos] = true;
-        var node = table.nodeAt(pos);
-        var updated = null;
-        for (var j = 0; j < node.attrs.colspan; j++) {
-            var col = (i + j) % map$$1.width;
-            var colWidth = colWidths[col * 2];
-            if (colWidth != null && (!node.attrs.colwidth || node.attrs.colwidth[j] !== colWidth)) {
-                (updated || (updated = freshColWidth(node.attrs)))[j] = colWidth;
-            }
-        }
-        if (updated) {
-            map$$1.problems.unshift({ type: 'colwidth mismatch', pos: pos, colwidth: updated });
-        }
-    }
-};
-// Compute a table map.
-var computeMap = function (tableNode) {
-    if (!isTable(tableNode) && !isTableBody(tableNode) && !isTableHead(tableNode) && !isTableFoot(tableNode)) {
-        throw new RangeError('Not a table node: ' + tableNode.type.name);
-    }
-    var width = findWidth(tableNode);
-    var height = tableNode.childCount;
-    var map$$1 = [];
-    var mapPos = 0;
-    var problems = null;
-    var colWidths = [];
-    for (var i = 0, e = width * height; i < e; i++) {
-        map$$1[i] = 0;
-    }
-    for (var row = 0, pos = 0; row < height; row++) {
-        var rowNode = tableNode.child(row);
-        pos++;
-        for (var i = 0;; i++) {
-            while (mapPos < map$$1.length && map$$1[mapPos] !== 0) {
-                mapPos++;
-            }
-            if (i === rowNode.childCount) {
-                break;
-            }
-            var cellNode = rowNode.child(i);
-            var _a = cellNode.attrs, colspan = _a.colspan, rowspan = _a.rowspan, colwidth = _a.colwidth;
-            for (var h = 0; h < rowspan; h++) {
-                if (h + row >= height) {
-                    (problems || (problems = [])).push({ type: 'overlong_rowspan', pos: pos, n: rowspan - h });
-                    break;
-                }
-                var start = mapPos + h * width;
-                for (var w = 0; w < colspan; w++) {
-                    if (map$$1[start + w] === 0) {
-                        map$$1[start + w] = pos;
-                    }
-                    else {
-                        (problems || (problems = [])).push({ type: 'collision', row: row, pos: pos, n: colspan - w });
-                    }
-                    var colW = colwidth && colwidth[w];
-                    if (colW) {
-                        var widthIndex = ((start + w) % width) * 2, prev = colWidths[widthIndex];
-                        if (prev == null || (prev !== colW && colWidths[widthIndex + 1] === 1)) {
-                            colWidths[widthIndex] = colW;
-                            colWidths[widthIndex + 1] = 1;
-                        }
-                        else if (prev === colW) {
-                            colWidths[widthIndex + 1]++;
-                        }
-                    }
-                }
-            }
-            mapPos += colspan;
-            pos += cellNode.nodeSize;
-        }
-        var expectedPos = (row + 1) * width;
-        var missing = 0;
-        while (mapPos < expectedPos) {
-            if (map$$1[mapPos++] === 0) {
-                missing++;
-            }
-        }
-        if (missing) {
-            (problems || (problems = [])).push({ type: 'missing', row: row, n: missing });
-        }
-        pos++;
-    }
-    var tableMap = new TableMap(width, height, map$$1, problems);
-    var badWidths = false;
-    // For columns that have defined widths, but whose widths disagree
-    // between rows, fix up the cells whose width doesn't match the
-    // computed one.
-    for (var i = 0; !badWidths && i < colWidths.length; i += 2) {
-        if (colWidths[i] != null && colWidths[i + 1] < height) {
-            badWidths = true;
-        }
-    }
-    if (badWidths) {
-        findBadColWidths(tableMap, colWidths, tableNode);
-    }
-    return tableMap;
-};
-/**
- * @hidden
- */
-var Rect = /** @class */ (function () {
-    function Rect(left, top, right, bottom) {
-        this.left = left;
-        this.top = top;
-        this.right = right;
-        this.bottom = bottom;
-    }
-    return Rect;
-}());
-/**
- * @hidden
- */
-var TableMap = /** @class */ (function () {
-    function TableMap(width, height, map$$1, problems) {
-        // :: number The width of the table
-        this.width = width;
-        // :: number The table's height
-        this.height = height;
-        // :: [number] A width * height array with the start position of
-        // the cell covering that part of the table in each slot
-        this.map = map$$1;
-        // An optional array of problems (cell overlap or non-rectangular
-        // shape) for the table, used by the table normalizer.
-        this.problems = problems;
-    }
-    // :: (Node) → TableMap
-    // Find the table map for the given table node.
-    TableMap.get = function (table) {
-        return readFromCache(table) || addToCache(table, computeMap(table));
-    };
-    // :: (number) → Rect
-    // Find the dimensions of the cell at the given position.
-    TableMap.prototype.findCell = function (pos) {
-        for (var i = 0; i < this.map.length; i++) {
-            var curPos = this.map[i];
-            if (curPos !== pos) {
-                continue;
-            }
-            var left = i % this.width;
-            var top_1 = Math.floor(i / this.width);
-            var right = left + 1;
-            var bottom = top_1 + 1;
-            for (var j = 1; right < this.width && this.map[i + j] === curPos; j++) {
-                right++;
-            }
-            for (var j = 1; bottom < this.height && this.map[i + this.width * j] === curPos; j++) {
-                bottom++;
-            }
-            return new Rect(left, top_1, right, bottom);
-        }
-        throw new RangeError('No cell with offset ' + pos + ' found');
-    };
-    // :: (number) → number
-    // Find the left side of the cell at the given position.
-    TableMap.prototype.colCount = function (pos) {
-        for (var i = 0; i < this.map.length; i++) {
-            if (this.map[i] === pos) {
-                return i % this.width;
-            }
-        }
-        throw new RangeError('No cell with offset ' + pos + ' found');
-    };
-    // :: (number, string, number) → ?number
-    // Find the next cell in the given direction, starting from the cell
-    // at `pos`, if any.
-    TableMap.prototype.nextCell = function (pos, axis, dir) {
-        var _a = this.findCell(pos), left = _a.left, right = _a.right, top = _a.top, bottom = _a.bottom;
-        if (axis === 'horiz') {
-            if (dir < 0 ? left === 0 : right === this.width) {
-                return null;
-            }
-            return this.map[top * this.width + (dir < 0 ? left - 1 : right)];
-        }
-        else {
-            if (dir < 0 ? top === 0 : bottom === this.height) {
-                return null;
-            }
-            return this.map[left + this.width * (dir < 0 ? top - 1 : bottom)];
-        }
-    };
-    // :: (number, number) → Rect
-    // Get the rectangle spanning the two given cells.
-    TableMap.prototype.rectBetween = function (a, b) {
-        var _a = this.findCell(a), leftA = _a.left, rightA = _a.right, topA = _a.top, bottomA = _a.bottom;
-        var _b = this.findCell(b), leftB = _b.left, rightB = _b.right, topB = _b.top, bottomB = _b.bottom;
-        return new Rect(Math.min(leftA, leftB), Math.min(topA, topB), Math.max(rightA, rightB), Math.max(bottomA, bottomB));
-    };
-    // :: (Rect) → [number]
-    // Return the position of all cells that have the top left corner in
-    // the given rectangle.
-    TableMap.prototype.cellsInRect = function (rect) {
-        var result = [];
-        var seen = {};
-        for (var row = rect.top; row < rect.bottom; row++) {
-            for (var col = rect.left; col < rect.right; col++) {
-                var index = row * this.width + col, pos = this.map[index];
-                if (seen[pos]) {
-                    continue;
-                }
-                seen[pos] = true;
-                if ((col !== rect.left || !col || this.map[index - 1] !== pos) &&
-                    (row !== rect.top || !row || this.map[index - this.width] !== pos)) {
-                    result.push(pos);
-                }
-            }
-        }
-        return result;
-    };
-    // :: (number, number, Node) → number
-    // Return the position at which the cell at the given row and column
-    // starts, or would start, if a cell started there.
-    TableMap.prototype.positionAt = function (row, col, table) {
-        for (var i = 0, rowStart = 0;; i++) {
-            var rowEnd = rowStart + table.child(i).nodeSize;
-            if (i === row) {
-                var index = col + row * this.width, rowEndIndex = (row + 1) * this.width;
-                // Skip past cells from previous rows (via rowspan)
-                while (index < rowEndIndex && this.map[index] < rowStart) {
-                    index++;
-                }
-                return index === rowEndIndex ? rowEnd - 1 : this.map[index];
-            }
-            rowStart = rowEnd;
-        }
-    };
-    return TableMap;
-}());
-
-/**
- * @hidden
- */
-// ::- A [`Selection`](http://prosemirror.net/docs/ref/#state.Selection)
-// subclass that represents a cell selection spanning part of a table.
-// With the plugin enabled, these will be created when the user
-// selects across cells, and will be drawn by giving selected cells a
-// `selectedCell` CSS class.
-var CellSelection = /** @class */ (function (_super) {
-    __extends(CellSelection, _super);
-    // :: (ResolvedPos, ?ResolvedPos)
-    // A table selection is identified by its anchor and head cells. The
-    // positions given to this constructor should point _before_ two
-    // cells in the same table. They may be the same, to select a single
-    // cell.
-    function CellSelection($anchorCell, $headCell) {
-        if ($headCell === void 0) { $headCell = $anchorCell; }
-        var _this = this;
-        var table = $anchorCell.node(-1), map$$1 = TableMap.get(table), start = $anchorCell.start(-1);
-        var rect = map$$1.rectBetween($anchorCell.pos - start, $headCell.pos - start);
-        var doc = $anchorCell.node(0);
-        var cells = map$$1.cellsInRect(rect).filter(function (p) { return p !== $headCell.pos - start; });
-        // Make the head cell the first range, so that it counts as the
-        // primary part of the selection
-        cells.unshift($headCell.pos - start);
-        var ranges = cells.map(function (pos) {
-            var cell = table.nodeAt(pos), from = pos + start + 1;
-            return new SelectionRange(doc.resolve(from), doc.resolve(from + cell.content.size));
-        });
-        _this = _super.call(this, ranges[0].$from, ranges[0].$to, ranges) || this;
-        // :: ResolvedPos
-        // A resolved position pointing _in front of_ the anchor cell (the one
-        // that doesn't move when extending the selection).
-        _this.$anchorCell = $anchorCell;
-        // :: ResolvedPos
-        // A resolved position pointing in front of the head cell (the one
-        // moves when extending the selection).
-        _this.$headCell = $headCell;
-        return _this;
-    }
-    // :: (ResolvedPos, ?ResolvedPos) → CellSelection
-    // Returns the smallest column selection that covers the given anchor
-    // and head cell.
-    CellSelection.colSelection = function ($anchorCell, $headCell) {
-        if ($headCell === void 0) { $headCell = $anchorCell; }
-        var map$$1 = TableMap.get($anchorCell.node(-1));
-        var start = $anchorCell.start(-1);
-        var anchorRect = map$$1.findCell($anchorCell.pos - start);
-        var headRect = map$$1.findCell($headCell.pos - start);
-        var doc = $anchorCell.node(0);
-        if (anchorRect.top <= headRect.top) {
-            if (anchorRect.top > 0) {
-                $anchorCell = doc.resolve(start + map$$1.map[anchorRect.left]);
-            }
-            if (headRect.bottom < map$$1.height) {
-                $headCell = doc.resolve(start + map$$1.map[map$$1.width * (map$$1.height - 1) + headRect.right - 1]);
-            }
-        }
-        else {
-            if (headRect.top > 0) {
-                $headCell = doc.resolve(start + map$$1.map[headRect.left]);
-            }
-            if (anchorRect.bottom < map$$1.height) {
-                $anchorCell = doc.resolve(start + map$$1.map[map$$1.width * (map$$1.height - 1) + anchorRect.right - 1]);
-            }
-        }
-        return new CellSelection($anchorCell, $headCell);
-    };
-    // :: (ResolvedPos, ?ResolvedPos) → CellSelection
-    // Returns the smallest row selection that covers the given anchor
-    // and head cell.
-    CellSelection.rowSelection = function ($anchorCell, $headCell) {
-        if ($headCell === void 0) { $headCell = $anchorCell; }
-        var map$$1 = TableMap.get($anchorCell.node(-1));
-        var start = $anchorCell.start(-1);
-        var anchorRect = map$$1.findCell($anchorCell.pos - start);
-        var headRect = map$$1.findCell($headCell.pos - start);
-        var doc = $anchorCell.node(0);
-        if (anchorRect.left <= headRect.left) {
-            if (anchorRect.left > 0) {
-                $anchorCell = doc.resolve(start + map$$1.map[anchorRect.top * map$$1.width]);
-            }
-            if (headRect.right < map$$1.width) {
-                $headCell = doc.resolve(start + map$$1.map[map$$1.width * (headRect.top + 1) - 1]);
-            }
-        }
-        else {
-            if (headRect.left > 0) {
-                $headCell = doc.resolve(start + map$$1.map[headRect.top * map$$1.width]);
-            }
-            if (anchorRect.right < map$$1.width) {
-                $anchorCell = doc.resolve(start + map$$1.map[map$$1.width * (anchorRect.top + 1) - 1]);
-            }
-        }
-        return new CellSelection($anchorCell, $headCell);
-    };
-    CellSelection.fromJSON = function (doc, json) {
-        return new CellSelection(doc.resolve(json.anchor), doc.resolve(json.head));
-    };
-    // :: (Node, number, ?number) → CellSelection
-    CellSelection.create = function (doc, anchorCell, headCell) {
-        if (headCell === void 0) { headCell = anchorCell; }
-        return new CellSelection(doc.resolve(anchorCell), doc.resolve(headCell));
-    };
-    CellSelection.prototype.map = function (doc, mapping) {
-        var $anchorCell = doc.resolve(mapping.map(this.$anchorCell.pos));
-        var $headCell = doc.resolve(mapping.map(this.$headCell.pos));
-        if (pointsAtCell($anchorCell) && pointsAtCell($headCell) && inSameTable($anchorCell, $headCell)) {
-            var tableChanged = this.$anchorCell.node(-1) !== $anchorCell.node(-1);
-            if (tableChanged && this.isRowSelection()) {
-                return CellSelection.rowSelection($anchorCell, $headCell);
-            }
-            else {
-                if (tableChanged && this.isColSelection()) {
-                    return CellSelection.colSelection($anchorCell, $headCell);
-                }
-                else {
-                    return new CellSelection($anchorCell, $headCell);
-                }
-            }
-        }
-        return TextSelection.between($anchorCell, $headCell);
-    };
-    // :: () → Slice
-    // Returns a rectangular slice of table rows containing the selected
-    // cells.
-    CellSelection.prototype.content = function () {
-        var table = this.$anchorCell.node(-1), map$$1 = TableMap.get(table), start = this.$anchorCell.start(-1);
-        var rect = map$$1.rectBetween(this.$anchorCell.pos - start, this.$headCell.pos - start);
-        var seen = {}, rows = [];
-        for (var row = rect.top; row < rect.bottom; row++) {
-            var rowContent = [];
-            for (var index = row * map$$1.width + rect.left, col = rect.left; col < rect.right; col++, index++) {
-                var pos = map$$1.map[index];
-                if (!seen[pos]) {
-                    seen[pos] = true;
-                    var cellRect = map$$1.findCell(pos), cell = table.nodeAt(pos);
-                    var extraLeft = rect.left - cellRect.left, extraRight = cellRect.right - rect.right;
-                    if (extraLeft > 0 || extraRight > 0) {
-                        var attrs = cell.attrs;
-                        if (extraLeft > 0) {
-                            attrs = removeColSpan(attrs, 0, extraLeft);
-                        }
-                        if (extraRight > 0) {
-                            attrs = removeColSpan(attrs, attrs.colspan - extraRight, extraRight);
-                        }
-                        if (cellRect.left < rect.left) {
-                            cell = cell.type.createAndFill(attrs);
-                        }
-                        else {
-                            cell = cell.type.create(attrs, cell.content);
-                        }
-                    }
-                    if (cellRect.top < rect.top || cellRect.bottom > rect.bottom) {
-                        var attrs = setAttr(cell.attrs, 'rowspan', Math.min(cellRect.bottom, rect.bottom) - Math.max(cellRect.top, rect.top));
-                        if (cellRect.top < rect.top) {
-                            cell = cell.type.createAndFill(attrs);
-                        }
-                        else {
-                            cell = cell.type.create(attrs, cell.content);
-                        }
-                    }
-                    rowContent.push(cell);
-                }
-            }
-            rows.push(table.child(row).copy(Fragment.from(rowContent)));
-        }
-        var fragment = this.isColSelection() && this.isRowSelection() ? table : rows;
-        return new Slice(Fragment.from(fragment), 1, 1);
-    };
-    CellSelection.prototype.replace = function (tr, content) {
-        if (content === void 0) { content = Slice.empty; }
-        var mapFrom = tr.steps.length;
-        var ranges = this.ranges;
-        for (var i = 0; i < ranges.length; i++) {
-            var _a = ranges[i], $from = _a.$from, $to = _a.$to;
-            var mapping = tr.mapping.slice(mapFrom);
-            tr.replace(mapping.map($from.pos), mapping.map($to.pos), i ? Slice.empty : content);
-        }
-        var sel = Selection.findFrom(tr.doc.resolve(tr.mapping.slice(mapFrom).map(this.to)), -1);
-        if (sel) {
-            tr.setSelection(sel);
-        }
-    };
-    CellSelection.prototype.replaceWith = function (tr, node) {
-        this.replace(tr, new Slice(Fragment.from(node), 0, 0));
-    };
-    CellSelection.prototype.forEachCell = function (f) {
-        var table = this.$anchorCell.node(-1);
-        var map$$1 = TableMap.get(table);
-        var start = this.$anchorCell.start(-1);
-        var cells = map$$1.cellsInRect(map$$1.rectBetween(this.$anchorCell.pos - start, this.$headCell.pos - start));
-        for (var i = 0; i < cells.length; i++) {
-            f(table.nodeAt(cells[i]), start + cells[i]);
-        }
-    };
-    // :: () → bool
-    // True if this selection goes all the way from the top to the
-    // bottom of the table.
-    CellSelection.prototype.isColSelection = function () {
-        var anchorTop = this.$anchorCell.index(-1), headTop = this.$headCell.index(-1);
-        if (Math.min(anchorTop, headTop) > 0) {
-            return false;
-        }
-        var anchorBot = anchorTop + this.$anchorCell.nodeAfter.attrs.rowspan;
-        var headBot = headTop + this.$headCell.nodeAfter.attrs.rowspan;
-        return Math.max(anchorBot, headBot) === this.$headCell.node(-1).childCount;
-    };
-    // :: () → bool
-    // True if this selection goes all the way from the left to the
-    // right of the table.
-    CellSelection.prototype.isRowSelection = function () {
-        var map$$1 = TableMap.get(this.$anchorCell.node(-1));
-        var start = this.$anchorCell.start(-1);
-        var anchorLeft = map$$1.colCount(this.$anchorCell.pos - start);
-        var headLeft = map$$1.colCount(this.$headCell.pos - start);
-        if (Math.min(anchorLeft, headLeft) > 0) {
-            return false;
-        }
-        var anchorRight = anchorLeft + this.$anchorCell.nodeAfter.attrs.colspan;
-        var headRight = headLeft + this.$headCell.nodeAfter.attrs.colspan;
-        return Math.max(anchorRight, headRight) === map$$1.width;
-    };
-    CellSelection.prototype.eq = function (other) {
-        return (other instanceof CellSelection && other.$anchorCell.pos === this.$anchorCell.pos && other.$headCell.pos === this.$headCell.pos);
-    };
-    CellSelection.prototype.toJSON = function () {
-        return { type: 'cell', anchor: this.$anchorCell.pos, head: this.$headCell.pos };
-    };
-    CellSelection.prototype.getBookmark = function () {
-        return new CellBookmark(this.$anchorCell.pos, this.$headCell.pos);
-    };
-    return CellSelection;
-}(Selection));
-CellSelection.prototype.visible = false;
-Selection.jsonID('table_cell', CellSelection);
-var CellBookmark = /** @class */ (function () {
-    function CellBookmark(anchor, head) {
-        this.anchor = anchor;
-        this.head = head;
-    }
-    CellBookmark.prototype.map = function (mapping) {
-        return new CellBookmark(mapping.map(this.anchor), mapping.map(this.head));
-    };
-    CellBookmark.prototype.resolve = function (doc) {
-        var $anchorCell = doc.resolve(this.anchor), $headCell = doc.resolve(this.head);
-        if ($anchorCell.parent.type.spec.tableRole === 'row' &&
-            $headCell.parent.type.spec.tableRole === 'row' &&
-            $anchorCell.index() < $anchorCell.parent.childCount &&
-            $headCell.index() < $headCell.parent.childCount &&
-            inSameTable($anchorCell, $headCell)) {
-            return new CellSelection($anchorCell, $headCell);
-        }
-        else {
-            return Selection.near($headCell, 1);
-        }
-    };
-    return CellBookmark;
-}());
-
-/**
- * @hidden
- */
-var findParentNodeClosestToPos = function ($pos, predicate) {
-    for (var i = $pos.depth; i > 0; i--) {
-        var node = $pos.node(i);
-        if (predicate(node)) {
-            return {
-                start: $pos.start(i),
-                pos: i > 0 ? $pos.before(i) : 0,
-                depth: i,
-                node: node
-            };
-        }
-    }
-};
-/**
- * @hidden
- */
-var createTable = function (nodes$$1, rows, columns) {
-    var table = nodes$$1.table, table_body = nodes$$1.table_body, table_row = nodes$$1.table_row, table_cell = nodes$$1.table_cell;
-    var tableRows = [];
-    var cells;
-    for (var r = 0; r < rows + 1; r++) {
-        cells = [];
-        for (var c = 0; c < columns + 1; c++) {
-            cells.push(table_cell.createAndFill());
-        }
-        tableRows.push(table_row.createAndFill(undefined, cells));
-    }
-    var body = table_body.createAndFill(undefined, tableRows);
-    return table.createAndFill(undefined, body);
-};
-/**
- * @hidden
- */
-var isInTable = function (state) {
-    var $head = state.selection.$head;
-    for (var d = $head.depth; d > 0; d--) {
-        if (isTableRow($head.node(d))) {
-            return true;
-        }
-    }
-    return false;
-};
-/**
- * @hidden
- */
-var setAttr = function (attrs, name, value) {
-    var result = {};
-    // tslint:disable-next-line
-    for (var prop in attrs) {
-        result[prop] = attrs[prop];
-    }
-    result[name] = value;
-    return result;
-};
-var cellNear = function ($pos) {
-    for (var after = $pos.nodeAfter, pos = $pos.pos; after; after = after.firstChild, pos++) {
-        var role = after.type.spec.tableRole;
-        if (role === 'cell' || role === 'header_cell') {
-            return $pos.doc.resolve(pos);
-        }
-    }
-    for (var before = $pos.nodeBefore, pos = $pos.pos; before; before = before.lastChild, pos--) {
-        var role = before.type.spec.tableRole;
-        if (role === 'cell' || role === 'header_cell') {
-            return $pos.doc.resolve(pos - before.nodeSize);
-        }
-    }
-};
-var cellAround = function ($pos) {
-    for (var d = $pos.depth - 1; d > 0; d--) {
-        if (isTableRow($pos.node(d))) {
-            return $pos.node(0).resolve($pos.before(d + 1));
-        }
-    }
-    return null;
-};
-var selectionCell = function (sel) {
-    if (sel instanceof CellSelection && sel.$anchorCell) {
-        return sel.$anchorCell.pos > sel.$headCell.pos ? sel.$anchorCell : sel.$headCell;
-    }
-    else if (sel instanceof NodeSelection && sel.node && isTableCell(sel.node)) {
-        return sel.$anchor;
-    }
-    return cellAround(sel.$head) || cellNear(sel.$head);
-};
-/**
- * @hidden
- */
-// Helper to get the selected rectangle in a table, if any. Adds table
-// map, table node, and table start offset to the object for
-// convenience.
-var selectedRect = function (sel) {
-    // create arr of rect for each table section
-    // there has to be a rect for thead, tbody and tfoot(if each exists)
-    // and NOT for colgroups
-    var $pos = selectionCell(sel);
-    var table = $pos.node(-1);
-    var tableStart = $pos.start(-1);
-    var map$$1 = TableMap.get(table);
-    var rect = sel instanceof CellSelection
-        ? map$$1.rectBetween(sel.$anchorCell.pos - tableStart, sel.$headCell.pos - tableStart)
-        : map$$1.findCell($pos.pos - tableStart);
-    rect.tableStart = tableStart;
-    rect.map = map$$1;
-    rect.table = table;
-    return rect;
-};
-/**
- * @hidden
- */
-// this has to be removed since the schema should not have roles inside NodeSpec.
-var tableNodeTypes = function (schema) {
-    var result = schema.cached.tableNodeTypes;
-    if (!result) {
-        result = schema.cached.tableNodeTypes = {};
-        // tslint:disable-next-line
-        for (var name_1 in schema.nodes) {
-            var type = schema.nodes[name_1];
-            var role = type.spec.tableRole;
-            if (role) {
-                result[role] = type;
-            }
-        }
-    }
-    return result;
-};
-/**
- * @hidden
- */
-var rowIsHeader = function (map$$1, table, row) {
-    var headerCell = tableNodeTypes(table.type.schema).header_cell;
-    for (var col = 0; col < map$$1.width; col++) {
-        if (table.nodeAt(map$$1.map[col + row * map$$1.width]).type !== headerCell) {
-            return false;
-        }
-    }
-    return true;
-};
-/**
- * @hidden
- */
-var addColSpan = function (attrs, pos, n) {
-    if (n === void 0) { n = 1; }
-    var result = setAttr(attrs, 'colspan', attrs.colspan + n);
-    if (result.colwidth) {
-        result.colwidth = result.colwidth.slice();
-        for (var i = 0; i < n; i++) {
-            result.colwidth.splice(pos, 0, 0);
-        }
-    }
-    return result;
-};
-/**
- * @hidden
- */
-var removeColSpan = function (attrs, pos, n) {
-    if (n === void 0) { n = 1; }
-    var result = setAttr(attrs, 'colspan', attrs.colspan - n);
-    if (result.colwidth) {
-        result.colwidth = result.colwidth.slice();
-        result.colwidth.splice(pos, n);
-        if (!result.colwidth.some(function (w) { return w > 0; })) {
-            result.colwidth = null;
-        }
-    }
-    return result;
-};
-/**
- * @hidden
- */
-var isCellEmpty = function (cell) {
-    var c = cell.content;
-    return c.childCount === 1 && c.firstChild.isTextblock && c.firstChild.childCount === 0;
-};
-var cellWrapping = function ($pos) {
-    for (var d = $pos.depth; d > 0; d--) {
-        // Sometimes the cell can be in the same depth.
-        var role = $pos.node(d).type.spec.tableRole;
-        if (role === 'cell' || role === 'header_cell') {
-            return $pos.node(d);
-        }
-    }
-    return null;
-};
-/**
- * @hidden
- */
-// Split a selected cell, whose rowpan or colspan is greater than one,
-// into smaller cells with the cell type (th, td) returned by getType function.
-var splitCellWithType = function (getCellType) {
-    return function (state, dispatch) {
-        var sel = state.selection;
-        var cellNode;
-        var cellPos;
-        if (!(sel instanceof CellSelection)) {
-            cellNode = cellWrapping(sel.$from);
-            if (!cellNode) {
-                return false;
-            }
-            cellPos = cellAround(sel.$from).pos;
-        }
-        else {
-            if (sel.$anchorCell.pos !== sel.$headCell.pos) {
-                return false;
-            }
-            cellNode = sel.$anchorCell.nodeAfter;
-            cellPos = sel.$anchorCell.pos;
-        }
-        if (cellNode.attrs.colspan === 1 && cellNode.attrs.rowspan === 1) {
-            return false;
-        }
-        if (dispatch) {
-            var baseAttrs = cellNode.attrs;
-            var attrs = [];
-            var colwidth = baseAttrs.colwidth;
-            if (baseAttrs.rowspan > 1) {
-                baseAttrs = setAttr(baseAttrs, 'rowspan', 1);
-            }
-            if (baseAttrs.colspan > 1) {
-                baseAttrs = setAttr(baseAttrs, 'colspan', 1);
-            }
-            var rect = selectedRect(state);
-            var tr = state.tr;
-            for (var i = 0; i < rect.right - rect.left; i++) {
-                attrs.push(colwidth ? setAttr(baseAttrs, 'colwidth', colwidth && colwidth[i] ? [colwidth[i]] : null) : baseAttrs);
-            }
-            var lastCell = void 0;
-            for (var row = rect.top; row < rect.bottom; row++) {
-                var pos = rect.map.positionAt(row, rect.left, rect.table);
-                if (row === rect.top) {
-                    pos += cellNode.nodeSize;
-                }
-                for (var col = rect.left, i = 0; col < rect.right; col++, i++) {
-                    if (col === rect.left && row === rect.top) {
-                        continue;
-                    }
-                    tr.insert((lastCell = tr.mapping.map(pos + rect.tableStart, 1)), getCellType({ node: cellNode, row: row, col: col }).createAndFill(attrs[i]));
-                }
-            }
-            tr.setNodeMarkup(cellPos, getCellType({ node: cellNode, row: rect.top, col: rect.left }), attrs[0]);
-            if (sel instanceof CellSelection) {
-                tr.setSelection(new CellSelection(tr.doc.resolve(sel.$anchorCell.pos), lastCell && tr.doc.resolve(lastCell)));
-            }
-            dispatch(tr);
-        }
-        return true;
-    };
-};
-/**
- * @hidden
- */
-var pointsAtCell = function ($pos) {
-    return isTableRow($pos.parent) && $pos.nodeAfter;
-};
-/**
- * @hidden
- */
-var inSameTable = function ($a, $b) {
-    return $a.depth === $b.depth && $a.pos >= $b.start(-1) && $a.pos <= $b.end(-1);
-};
-/**
- * @hidden
- */
-var cellsOverlapRectangle = function (_a, rect) {
-    var width = _a.width, height = _a.height, map$$1 = _a.map;
-    var indexTop = rect.top * width + rect.left;
-    var indexLeft = indexTop;
-    var indexBottom = (rect.bottom - 1) * width + rect.left;
-    var indexRight = indexTop + (rect.right - rect.left - 1);
-    for (var i = rect.top; i < rect.bottom; i++) {
-        if ((rect.left > 0 && map$$1[indexLeft] === map$$1[indexLeft - 1]) || (rect.right < width && map$$1[indexRight] === map$$1[indexRight + 1])) {
-            return true;
-        }
-        indexLeft += width;
-        indexRight += width;
-    }
-    for (var i = rect.left; i < rect.right; i++) {
-        if ((rect.top > 0 && map$$1[indexTop] === map$$1[indexTop - width]) ||
-            (rect.bottom < height && map$$1[indexBottom] === map$$1[indexBottom + width])) {
-            return true;
-        }
-        indexTop++;
-        indexBottom++;
-    }
-    return false;
-};
-
-/**
- * @hidden
- */
-var insertTable = function (attrs) { return function (state, dispatch) {
-    var newTable = createTable(state.schema.nodes, attrs.rows, attrs.cols);
-    if (newTable) {
-        insertNode(newTable, true)(state, dispatch);
-    }
-}; };
-var addTableGroupColumn = function (tr, _a, col, mainTable, requiredGroup, doc) {
-    var left = _a.left, right = _a.right;
-    var refColumn = col > 0 ? -1 : 0;
-    // not sure if this should be deleted
-    // if (columnIsHeader(map, table, col + refColumn)) {
-    //     refColumn = col === 0 || col === map.width ? null : 0;
-    // }
-    var rect;
-    mainTable.node.descendants(function (tableChildNode, offset) {
-        if (requiredGroup(tableChildNode)) {
-            var i_1 = -1;
-            tableChildNode.firstChild.descendants(function (childNode, pos) {
-                if (isTableCell(childNode) || isTableHeaderCell(childNode)) {
-                    i_1 = i_1 + 1;
-                    if (i_1 === right || i_1 === left) {
-                        var selection = new Selection(doc.resolve(pos + offset + mainTable.start), doc.resolve(pos + offset + mainTable.start));
-                        rect = selectedRect(selection);
-                    }
-                }
-            });
-        }
-    });
-    // Do nothing if thead, tfoot or tbody is missing
-    if (!rect) {
-        return tr;
-    }
-    for (var row = 0; row < rect.map.height; row++) {
-        var index = row * rect.map.width + col;
-        // If this position falls inside a col-spanning cell
-        if (col > 0 && col < rect.map.width && rect.map.map[index - 1] === rect.map.map[index]) {
-            var pos = rect.map.map[index];
-            var cell = rect.table.nodeAt(pos);
-            tr.setNodeMarkup(tr.mapping.map(rect.tableStart + pos), null, addColSpan(cell.attrs, col - rect.map.colCount(pos)));
-            // Skip ahead if rowspan > 1
-            row += cell.attrs.rowspan - 1;
-        }
-        else {
-            var type = rect.table.nodeAt(rect.map.map[index + refColumn]).type;
-            var pos = rect.map.positionAt(row, col, rect.table);
-            tr.insert(tr.mapping.map(rect.tableStart + pos), type.createAndFill());
-        }
-    }
-    return tr;
-};
-var removeTableGroupColumn = function (tr, _a, mainTable, requiredGroup, doc) {
-    var right = _a.right, left = _a.left;
-    var rect;
-    mainTable.node.descendants(function (tableChildNode, offset) {
-        if (requiredGroup(tableChildNode)) {
-            var i_2 = -1;
-            tableChildNode.firstChild.descendants(function (childNode, pos) {
-                if (isTableCell(childNode) || isTableHeaderCell(childNode)) {
-                    i_2 = i_2 + 1;
-                    if (i_2 >= left && i_2 < right) {
-                        var resolvedPos = doc.resolve(pos + offset + mainTable.start + childNode.nodeSize);
-                        var selection = new Selection(resolvedPos, resolvedPos);
-                        rect = selectedRect(selection);
-                    }
-                }
-            });
-        }
-    });
-    // Do nothing if thead, tfoot or tbody is missing
-    if (!rect) {
-        return;
-    }
-    for (var i = rect.right - 1;; i--) {
-        removeColumn(tr, rect, i);
-        if (i === rect.left) {
-            break;
-        }
-        rect.table = rect.tableStart ? tr.doc.nodeAt(rect.tableStart - 1) : tr.doc;
-        rect.map = TableMap.get(rect.table);
-    }
-    return;
-};
-var removeColumn = function (tr, _a, col) {
-    var map$$1 = _a.map, table = _a.table, tableStart = _a.tableStart;
-    for (var row = 0; row < map$$1.height;) {
-        var index = row * map$$1.width + col;
-        var pos = map$$1.map[index];
-        var cell = table.nodeAt(pos);
-        // If this is part of a col-spanning cell
-        if ((col > 0 && map$$1.map[index - 1] === pos) || (col < map$$1.width - 1 && map$$1.map[index + 1] === pos)) {
-            tr.setNodeMarkup(tr.mapping.map(tableStart + pos), null, removeColSpan(cell.attrs, col - map$$1.colCount(pos)));
-        }
-        else {
-            var start = tr.mapping.map(tableStart + pos);
-            tr.delete(start, start + cell.nodeSize);
-        }
-        row += cell.attrs.rowspan;
-    }
-};
-/**
- * @hidden
- */
-// Command to add a column before the column with the selection.
-var addColumnBefore$1 = function (state, dispatch) {
-    if (!isInTable(state)) {
-        return false;
-    }
-    if (dispatch) {
-        var rect = selectedRect(state.selection);
-        var mainTable = findParentNodeClosestToPos(state.selection.$anchor, isTable);
-        var tHeadTr = addTableGroupColumn(state.tr, rect, rect.left, mainTable, isTableHead, state.doc);
-        var tBodyTr = addTableGroupColumn(tHeadTr, rect, rect.left, mainTable, isTableBody, state.doc);
-        var tFootTr = addTableGroupColumn(tBodyTr, rect, rect.left, mainTable, isTableFoot, state.doc);
-        dispatch(tFootTr);
-    }
-    return true;
-};
-/**
- * @hidden
- */
-// Command to add a column after the column with the selection.
-var addColumnAfter$1 = function (state, dispatch) {
-    if (!isInTable(state)) {
-        return false;
-    }
-    if (dispatch) {
-        var rect = selectedRect(state.selection);
-        var mainTable = findParentNodeClosestToPos(state.selection.$anchor, isTable);
-        var theadTr = addTableGroupColumn(state.tr, rect, rect.right, mainTable, isTableHead, state.doc);
-        var tBodyTr = addTableGroupColumn(theadTr, rect, rect.right, mainTable, isTableBody, state.doc);
-        var tFootTr = addTableGroupColumn(tBodyTr, rect, rect.right, mainTable, isTableFoot, state.doc);
-        dispatch(tFootTr);
-    }
-    return true;
-};
-var addRow = function (tr, _a, row) {
-    var map$$1 = _a.map, tableStart = _a.tableStart, table = _a.table;
-    var rowPos = tableStart;
-    for (var i = 0; i < row; i++) {
-        rowPos += table.child(i).nodeSize;
-    }
-    var cells = [];
-    var refRow = row > 0 ? -1 : 0;
-    if (rowIsHeader(map$$1, table, row + refRow)) {
-        refRow = row === 0 || row === map$$1.height ? null : 0;
-    }
-    for (var col = 0, index = map$$1.width * row; col < map$$1.width; col++, index++) {
-        // Covered by a rowspan cell
-        if (row > 0 && row < map$$1.height && map$$1.map[index] === map$$1.map[index - map$$1.width]) {
-            var pos = map$$1.map[index];
-            var attrs = table.nodeAt(pos).attrs;
-            tr.setNodeMarkup(tableStart + pos, null, setAttr(attrs, 'rowspan', attrs.rowspan + 1));
-            col += attrs.colspan - 1;
-        }
-        else {
-            var type = refRow == null ? tableNodeTypes(table.type.schema).cell : table.nodeAt(map$$1.map[index + refRow * map$$1.width]).type;
-            cells.push(type.createAndFill());
-        }
-    }
-    tr.insert(rowPos, tableNodeTypes(table.type.schema).row.create(null, cells));
-    return tr;
+var commonAttributes = function () {
+    return __assign({}, createDefaultAttributes(['class', 'id', 'style']));
 };
 /**
  * @hidden
  */
-// Add a table row before the selection.
-var addRowBefore$1 = function (state, dispatch) {
-    if (!isInTable(state)) {
-        return false;
-    }
-    if (dispatch) {
-        var rect = selectedRect(state.selection);
-        dispatch(addRow(state.tr, rect, rect.top));
-    }
-    return true;
+var createDefaultAttributes = function (attrs) {
+    if (attrs === void 0) { attrs = []; }
+    return __assign({}, attrs.reduce(function (acc, curr) {
+        var _a;
+        return (__assign({}, acc, (_a = {}, _a[curr] = { default: null }, _a)));
+    }, {}));
 };
 /**
  * @hidden
  */
-// Add a table row after the selection.
-var addRowAfter$1 = function (state, dispatch) {
-    if (!isInTable(state)) {
-        return false;
-    }
-    if (dispatch) {
-        var rect = selectedRect(state.selection);
-        dispatch(addRow(state.tr, rect, rect.bottom));
-    }
-    return true;
-};
+var hole = 0;
+
+var createSemanticNode = function (tagName) { return ({
+    // Uncaught SyntaxError: Mixing inline and block content (in content expression '(block | inline)*')
+    // content: '(block | inline)*',
+    content: 'block*',
+    group: 'block',
+    attrs: __assign({}, commonAttributes()),
+    parseDOM: [{
+            tag: tagName,
+            getAttrs: getAttributes
+        }],
+    toDOM: function (node) { return hasAttrs(node.attrs) ? [tagName, getAttrs(node.attrs), hole] : [tagName, hole]; }
+}); };
 /**
  * @hidden
  */
-// Command function that removes the selected columns from a table.
-var deleteColumn$1 = function (state, dispatch) {
-    if (!isInTable(state)) {
-        return false;
-    }
-    if (dispatch) {
-        var rect = selectedRect(state.selection);
-        // if only one column left - delete the whole table
-        if (rect.left === 0 && rect.right === rect.map.width) {
-            return deleteTable$1(state, dispatch);
-        }
-        var mainTable = findParentNodeClosestToPos(state.selection.$anchor, isTable);
-        var tr = state.tr;
-        removeTableGroupColumn(tr, rect, mainTable, isTableFoot, tr.doc);
-        removeTableGroupColumn(tr, rect, mainTable, isTableBody, tr.doc);
-        removeTableGroupColumn(tr, rect, mainTable, isTableHead, tr.doc);
-        dispatch(tr);
-    }
-    return true;
-};
-var removeRow = function (tr, _a, row) {
-    var map$$1 = _a.map, table = _a.table, tableStart = _a.tableStart;
-    var rowPos = 0;
-    for (var i = 0; i < row; i++) {
-        rowPos += table.child(i).nodeSize;
-    }
-    var nextRow = rowPos + table.child(row).nodeSize;
-    var mapFrom = tr.mapping.maps.length;
-    tr.delete(rowPos + tableStart, nextRow + tableStart);
-    for (var col = 0, index = row * map$$1.width; col < map$$1.width; col++, index++) {
-        var pos = map$$1.map[index];
-        if (row > 0 && pos === map$$1.map[index - map$$1.width]) {
-            // If this cell starts in the row above, simply reduce its rowspan
-            var attrs = table.nodeAt(pos).attrs;
-            tr.setNodeMarkup(tr.mapping.slice(mapFrom).map(pos + tableStart), null, setAttr(attrs, 'rowspan', attrs.rowspan - 1));
-            col += attrs.colspan - 1;
-        }
-        else if (row < map$$1.width && pos === map$$1.map[index + map$$1.width]) {
-            // Else, if it continues in the row below, it has to be moved down
-            var cell = table.nodeAt(pos);
-            var copy = cell.type.create(setAttr(cell.attrs, 'rowspan', cell.attrs.rowspan - 1), cell.content);
-            var newPos = map$$1.positionAt(row + 1, col, table);
-            tr.insert(tr.mapping.slice(mapFrom).map(tableStart + newPos), copy);
-            col += cell.attrs.colspan - 1;
-        }
-    }
+var semanticTagNames = ['article', 'main', 'nav', 'header', 'footer', 'aside', 'section'];
+var ɵ1 = function (acc, curr) {
+    var _a;
+    return Object.assign(acc, (_a = {}, _a[curr] = createSemanticNode(curr), _a));
 };
 /**
  * @hidden
  */
-// Remove the selected rows from a table.
-var deleteRow$1 = function (state, dispatch) {
-    if (!isInTable(state)) {
-        return false;
-    }
-    if (dispatch) {
-        var rect_1 = selectedRect(state.selection);
-        var tr = state.tr;
-        if (rect_1.top === 0 && rect_1.bottom === rect_1.map.height) {
-            var mainTable = findParentNodeClosestToPos(state.selection.$anchor, isTable);
-            if (mainTable.node.childCount === 1) {
-                deleteTable$1(state, dispatch);
-            }
-            else {
-                deleteTableElement(function (n) { return n.type.name === rect_1.table.type.name; })(state, dispatch);
-            }
-            return true;
-        }
-        for (var i = rect_1.bottom - 1;; i--) {
-            removeRow(tr, rect_1, i);
-            if (i === rect_1.top) {
-                break;
-            }
-            rect_1.table = rect_1.tableStart ? tr.doc.nodeAt(rect_1.tableStart - 1) : tr.doc;
-            rect_1.map = TableMap.get(rect_1.table);
-        }
-        dispatch(tr);
-    }
-    return true;
-};
+var semanticNodes = semanticTagNames.reduce(ɵ1, {});
+
 /**
  * @hidden
  */
-// Merge the selected cells into a single cell. Only available when
-// the selected cells' outline forms a rectangle.
-var mergeCells$1 = function (state, dispatch) {
-    var sel = state.selection;
-    if (!(sel instanceof CellSelection) || sel.$anchorCell.pos === sel.$headCell.pos) {
-        return false;
-    }
-    var rect = selectedRect(state.selection);
-    var map$$1 = rect.map;
-    if (cellsOverlapRectangle(map$$1, rect)) {
-        return false;
-    }
-    if (dispatch) {
-        var tr = state.tr;
-        var seen = {};
-        var content = Fragment.empty;
-        var mergedPos = void 0;
-        var mergedCell = void 0;
-        for (var row = rect.top; row < rect.bottom; row++) {
-            for (var col = rect.left; col < rect.right; col++) {
-                var cellPos = map$$1.map[row * map$$1.width + col], cell = rect.table.nodeAt(cellPos);
-                if (seen[cellPos]) {
-                    continue;
-                }
-                seen[cellPos] = true;
-                if (mergedPos === null) {
-                    mergedPos = cellPos;
-                    mergedCell = cell;
-                }
-                else {
-                    if (!isCellEmpty(cell)) {
-                        content = content.append(cell.content);
-                    }
-                    var mapped = tr.mapping.map(cellPos + rect.tableStart);
-                    tr.delete(mapped, mapped + cell.nodeSize);
-                }
-            }
-        }
-        tr.setNodeMarkup(mergedPos + rect.tableStart, null, setAttr(addColSpan(mergedCell.attrs, mergedCell.attrs.colspan, rect.right - rect.left - mergedCell.attrs.colspan), 'rowspan', rect.bottom - rect.top));
-        if (content.size) {
-            var end = mergedPos + 1 + mergedCell.content.size;
-            var start = isCellEmpty(mergedCell) ? mergedPos + 1 : end;
-            tr.replaceWith(start + rect.tableStart, end + rect.tableStart, content);
-        }
-        tr.setSelection(new CellSelection(tr.doc.resolve(mergedPos + rect.tableStart)));
-        dispatch(tr);
-    }
-    return true;
-};
+var marks$1 = marks;
+var nodes$1 = Object.assign(nodes, semanticNodes);
 /**
  * @hidden
  */
-// Split a selected cell, whose rowpan or colspan is greater than one,
-// into smaller cells. Use the first cell type for the new cells.
-var splitCell$1 = function (state, dispatch) {
-    var nodeTypes = tableNodeTypes(state.schema);
-    return splitCellWithType(function (_a) {
-        var node = _a.node;
-        return nodeTypes[node.type.spec.tableRole];
-    })(state, dispatch);
-};
-var deleteTableElement = function (selector) { return function (state, dispatch) {
-    var $pos = state.selection.$anchor;
-    for (var d = $pos.depth; d > 0; d--) {
-        var node = $pos.node(d);
-        if (selector(node)) {
-            if (dispatch) {
-                var tr = state.tr;
-                tr.delete($pos.before(d), $pos.after(d)).scrollIntoView();
-                dispatch(tr);
-            }
-            return true;
-        }
-    }
-    return false;
-}; };
+var schema = new Schema({
+    marks: marks$1,
+    nodes: nodes$1
+});
+
 /**
  * @hidden
  */
-// Deletes the table around the selection, if any.
-var deleteTable$1 = deleteTableElement(isTable);
+var insertTable = function (attrs) { return function (state, dispatch) {
+    var newTable = createTable(state.schema.nodes, attrs.rows, attrs.cols);
+    if (newTable) {
+        insertNode(newTable, true)(state, dispatch);
+    }
+}; };
 
 var alignRemove = function (state, dispatch) { return alignBlocks(alignRemoveRules)(state, dispatch); };
-var ɵ1$5 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __assign({}, bold, { applyToWord: applyToWord })); }, ɵ2$4 = function (options) { return cleanFormatting(options); }, ɵ3$4 = function (attrs) { return expandToWordWrap(applyLink, { mark: 'link', attrs: attrs.value, applyToWord: attrs.applyToWord }); }, ɵ4$2 = function (attrs) { return expandToWordWrap(applyInlineStyle, { style: 'font-family', value: attrs.value, applyToWord: attrs.applyToWord }); }, ɵ5$2 = function (attrs) { return expandToWordWrap(applyInlineStyle, { style: 'font-size', value: attrs.value + 'px', applyToWord: attrs.applyToWord }); }, ɵ6$1 = function (attrs) { return expandToWordWrap(applyLink, { mark: 'link', attrs: attrs, applyToWord: attrs.applyToWord }); }, ɵ7$1 = function (text) { return insertText(text); }, ɵ8$1 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __assign({}, italic, { applyToWord: applyToWord })); }, ɵ9$1 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __assign({}, strikethrough, { applyToWord: applyToWord })); }, ɵ10 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __assign({}, subscript, { applyToWord: applyToWord })); }, ɵ11 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __assign({}, superscript, { applyToWord: applyToWord })); }, ɵ12 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __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 ɵ1$1 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __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, __assign({}, italic, { applyToWord: applyToWord })); }, ɵ9 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __assign({}, strikethrough, { applyToWord: applyToWord })); }, ɵ10 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __assign({}, subscript, { applyToWord: applyToWord })); }, ɵ11 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __assign({}, superscript, { applyToWord: applyToWord })); }, ɵ12 = function (applyToWord) { return expandToWordWrap(toggleInlineFormat, __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$5,
-    cleanFormatting: ɵ2$4,
-    createLink: ɵ3$4,
-    fontFamily: ɵ4$2,
-    fontSize: ɵ5$2,
-    insertFile: ɵ6$1,
-    insertText: ɵ7$1,
-    italic: ɵ8$1,
-    strikethrough: ɵ9$1,
+    bold: ɵ1$1,
+    cleanFormatting: ɵ2,
+    createLink: ɵ3,
+    fontFamily: ɵ4,
+    fontSize: ɵ5,
+    insertFile: ɵ6,
+    insertText: ɵ7,
+    italic: ɵ8,
+    strikethrough: ɵ9,
     subscript: ɵ10,
     superscript: ɵ11,
     underline: ɵ12,
@@ -1673,7 +159,7 @@ var inlineCommand = {
 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);
-}, ɵ30 = function () { return undo; };
+}, ɵ30 = function () { return undo; }, ɵ31 = function () { return blockquote; };
 var blockCommand = {
     alignCenter: ɵ17,
     alignJustify: ɵ18,
@@ -1690,20 +176,21 @@ var blockCommand = {
     outdent: ɵ27,
     redo: ɵ28,
     setHTML: ɵ29,
-    undo: ɵ30
+    undo: ɵ30,
+    blockquote: ɵ31
 };
-var ɵ31 = function (attr) { return insertTable(attr); }, ɵ32 = function () { return addColumnBefore$1; }, ɵ33 = function () { return addColumnAfter$1; }, ɵ34 = function () { return addRowBefore$1; }, ɵ35 = function () { return addRowAfter$1; }, ɵ36 = function () { return deleteRow$1; }, ɵ37 = function () { return deleteColumn$1; }, ɵ38 = function () { return mergeCells$1; }, ɵ39 = function () { return splitCell$1; }, ɵ40 = function () { return deleteTable$1; };
+var ɵ32 = function (attr) { return insertTable(attr); }, ɵ33 = function () { return addColumnBefore; }, ɵ34 = function () { return addColumnAfter; }, ɵ35 = function () { return addRowBefore; }, ɵ36 = function () { return addRowAfter; }, ɵ37 = function () { return deleteRow; }, ɵ38 = function () { return deleteColumn; }, ɵ39 = function () { return mergeCells; }, ɵ40 = function () { return splitCell; }, ɵ41 = function () { return deleteTable; };
 var tableCommand = {
-    insertTable: ɵ31,
-    addColumnBefore: ɵ32,
-    addColumnAfter: ɵ33,
-    addRowBefore: ɵ34,
-    addRowAfter: ɵ35,
-    deleteRow: ɵ36,
-    deleteColumn: ɵ37,
-    mergeCells: ɵ38,
-    splitCell: ɵ39,
-    deleteTable: ɵ40
+    insertTable: ɵ32,
+    addColumnBefore: ɵ33,
+    addColumnAfter: ɵ34,
+    addRowBefore: ɵ35,
+    addRowAfter: ɵ36,
+    deleteRow: ɵ37,
+    deleteColumn: ɵ38,
+    mergeCells: ɵ39,
+    splitCell: ɵ40,
+    deleteTable: ɵ41
 };
 /**
  * @hidden
@@ -1742,6 +229,10 @@ var getToolbarState = function (state, options) { return ({
         selected: activeNode(state),
         disabled: false
     },
+    blockquote: {
+        selected: false,
+        disabled: !blockquote(state)
+    },
     indent: {
         selected: false,
         disabled: !(canIndentAsListItem(state, state.schema.nodes.list_item) || canBeIndented(state, indentRules))
@@ -1764,7 +255,11 @@ var getToolbarState = function (state, options) { return ({
     },
     outdent: {
         selected: false,
-        disabled: !(canOutdentAsListItem(state, outdentRules) || canBeIndented(state, outdentRules))
+        get disabled() {
+            return !(hasNode(state, state.schema.nodes.blockquote) ||
+                canOutdentAsListItem(state, outdentRules) ||
+                isIndented(state, outdentRules.nodes));
+        }
     },
     redo: {
         selected: false,
@@ -1890,6 +385,7 @@ var initialToolBarState = {
     format: { selected: { text: 'Format', tag: null }, disabled: false },
     style: { selected: { marks: [], hasNodesWithoutMarks: false }, disabled: false },
     cleanFormatting: { selected: false, disabled: true },
+    blockquote: { selected: false, disabled: false },
     //indent
     indent: { selected: false, disabled: false },
     outdent: { selected: false, disabled: false },
@@ -1942,6 +438,7 @@ var disabledToolBarState = {
     format: { selected: { text: 'Format', tag: null }, disabled: true },
     style: { selected: { marks: [], hasNodesWithoutMarks: false }, disabled: true },
     cleanFormatting: { selected: false, disabled: true },
+    blockquote: { selected: false, disabled: true },
     //indent
     indent: { selected: false, disabled: true },
     outdent: { selected: false, disabled: true },
@@ -1975,6 +472,117 @@ var disabledToolBarState = {
     selectAll: { selected: false, disabled: true }
 };
 
+/**
+ * @hidden
+ */
+function outerWidth(element) {
+    var width = element.offsetWidth;
+    var style = getComputedStyle(element);
+    width += parseFloat(style.marginLeft) || 0 + parseFloat(style.marginRight) || 0;
+    return width;
+}
+/**
+ * @hidden
+ */
+var removeEntries = function (obj, predicate) {
+    return Object.keys(obj)
+        .filter(function (key) { return predicate(key); })
+        .reduce(function (acc, curr) {
+        var _a;
+        return Object.assign(acc, (_a = {}, _a[curr] = obj[curr], _a));
+    }, {});
+};
+/**
+ * @hidden
+ */
+var removeEmptyEntries = function (obj) {
+    var predicate = function (key) { return obj[key] !== null && obj[key] !== undefined && obj[key] !== ''; };
+    return removeEntries(obj, predicate);
+};
+/**
+ * @hidden
+ */
+var isNullOrUndefined = function (value) { return value === undefined || value === null; };
+/**
+ * @hidden
+ */
+var isPresent = function (value) { return !isNullOrUndefined(value); };
+/**
+ * @hidden
+ */
+var detectIE = function () {
+    if (!isDocumentAvailable()) {
+        return false;
+    }
+    var ua = window.navigator.userAgent;
+    var msie = ua.indexOf('MSIE ');
+    var trident = ua.indexOf('Trident/');
+    return msie > 0 || trident > 0;
+};
+/**
+ * @hidden
+ */
+var safeString = function (value) { return (isNullOrUndefined(value) ? '' : value.toString()); };
+/**
+ * @hidden
+ */
+var first = function (arr) { return arr[0]; };
+/**
+ * @hidden
+ */
+var last = function (arr) { return arr[arr.length - 1]; };
+/**
+ * @hidden
+ */
+var split = function (splitter) { return function (value) { return value.split(splitter); }; };
+/**
+ * @hidden
+ */
+var trim = function (value) { return value.trim(); };
+/**
+ * @hidden
+ */
+var filter$1 = function (predicate) { return function (arr) { return arr.filter(predicate); }; };
+/**
+ * @hidden
+ */
+var getUniqueStyleValues = function (style, cssStyle) {
+    if (style.hasNodesWithoutMarks) {
+        return '';
+    }
+    var uniqueMarkValues = style.marks
+        .filter(function (m) { return m.type.name === 'style'; })
+        .map(function (m) { return m.attrs.style; })
+        .map(safeString)
+        .map(split(';'))
+        .map(filter$1(function (m) { return m.includes(cssStyle); }))
+        // guards against empty array
+        .map(function (cssStyleValues) { return (cssStyleValues.length !== 0 ? cssStyleValues : [cssStyle + ": INVALID"]); })
+        .map(first)
+        .map(split(':'))
+        .map(last)
+        .map(trim)
+        .reduce(function (acc, curr) { return (acc.indexOf(curr) > -1 ? acc : acc.concat([curr])); }, []);
+    if (uniqueMarkValues.indexOf('INVALID') > -1 || uniqueMarkValues.length !== 1) {
+        return '';
+    }
+    return uniqueMarkValues[0];
+};
+/**
+ * @hidden
+ */
+var conditionallyExecute = function (fn) { return function (condition) { return function (param) { return (condition ? fn(param) : param); }; }; };
+/**
+ * @hidden
+ */
+var pipe = function () {
+    var fns = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        fns[_i] = arguments[_i];
+    }
+    return function (x) { return fns.reduce(function (y, f) { return f(y); }, x); };
+};
+
 /**
  * @hidden
  */
@@ -2137,7 +745,7 @@ var ImageDialogComponent = /** @class */ (function (_super) {
     ], ImageDialogComponent.prototype, "srcInput", void 0);
     ImageDialogComponent = __decorate([
         Component({
-            template: "\n        <kendo-dialog-titlebar (close)=\"onCancelAction()\">\n            {{ textFor('insertImage') }}\n        </kendo-dialog-titlebar>\n        <div class=\"k-editor-dialog\">\n            <div class=\"k-editor-dialog k-popup-edit-form k-window-content k-content\">\n                <div class=\"k-edit-form-container k-window-content\">\n                    <div class=\"k-edit-label\">\n                        <label [for]=\"srcInputId\">{{ textFor('imageWebAddress') }}</label>\n                    </div>\n                    <div class=\"k-edit-field\">\n                        <input [id]=\"srcInputId\" #srcInput [formControl]=\"src\" type=\"text\" class=\"k-textbox\" />\n                    </div>\n                    <div class=\"k-edit-label\">\n                        <label [for]=\"altTextInputId\">{{ textFor('imageAltText') }}</label>\n                    </div>\n                    <div class=\"k-edit-field\">\n                        <input [id]=\"altTextInputId\" [formControl]=\"alt\" type=\"text\" class=\"k-textbox\" />\n                    </div>\n                    <div class=\"k-edit-label\">\n                        <label [for]=\"widthInputId\">{{ textFor('imageWidth') }}</label>\n                    </div>\n                    <div class=\"k-edit-field\">\n                        <input [id]=\"widthInputId\" [formControl]=\"width\" type=\"text\" class=\"k-textbox\" />\n                    </div>\n                    <div class=\"k-edit-label\">\n                        <label [for]=\"heightInputId\">{{ textFor('imageHeight') }}</label>\n                    </div>\n                    <div class=\"k-edit-field\">\n                        <input [id]=\"heightInputId\" [formControl]=\"height\" type=\"text\" class=\"k-textbox\" />\n                    </div>\n                </div>\n            </div>\n        </div>\n        <kendo-dialog-actions>\n            <button kendoButton (click)=\"onCancelAction()\">{{ textFor('dialogCancel') }}</button>\n            <button kendoButton [disabled]=\"imageData.invalid\"\n                    (click)=\"onConfirmAction()\" [primary]=\"true\">{{ textFor('dialogInsert') }}</button>\n        </kendo-dialog-actions>\n    "
+            template: "\n        <kendo-dialog-titlebar (close)=\"onCancelAction()\">\n            {{ textFor('insertImage') }}\n        </kendo-dialog-titlebar>\n        <div class=\"k-editor-dialog\">\n            <div class=\"k-editor-dialog k-popup-edit-form k-window-content k-content\">\n                <div class=\"k-edit-form-container k-window-content\">\n                    <div class=\"k-edit-label\">\n                        <label [for]=\"srcInputId\">{{ textFor('imageWebAddress') }}</label>\n                    </div>\n                    <div class=\"k-edit-field\">\n                        <input [id]=\"srcInputId\" #srcInput [formControl]=\"src\" type=\"text\" class=\"k-textbox k-input k-rounded-md\" />\n                    </div>\n                    <div class=\"k-edit-label\">\n                        <label [for]=\"altTextInputId\">{{ textFor('imageAltText') }}</label>\n                    </div>\n                    <div class=\"k-edit-field\">\n                        <input [id]=\"altTextInputId\" [formControl]=\"alt\" type=\"text\" class=\"k-textbox k-input k-rounded-md\" />\n                    </div>\n                    <div class=\"k-edit-label\">\n                        <label [for]=\"widthInputId\">{{ textFor('imageWidth') }}</label>\n                    </div>\n                    <div class=\"k-edit-field\">\n                        <input [id]=\"widthInputId\" [formControl]=\"width\" type=\"text\" class=\"k-textbox k-input k-rounded-md\" />\n                    </div>\n                    <div class=\"k-edit-label\">\n                        <label [for]=\"heightInputId\">{{ textFor('imageHeight') }}</label>\n                    </div>\n                    <div class=\"k-edit-field\">\n                        <input [id]=\"heightInputId\" [formControl]=\"height\" type=\"text\" class=\"k-textbox k-input k-rounded-md\" />\n                    </div>\n                </div>\n            </div>\n        </div>\n        <kendo-dialog-actions>\n            <button kendoButton (click)=\"onCancelAction()\">{{ textFor('dialogCancel') }}</button>\n            <button kendoButton [disabled]=\"imageData.invalid\"\n                    (click)=\"onConfirmAction()\" [primary]=\"true\">{{ textFor('dialogInsert') }}</button>\n        </kendo-dialog-actions>\n    "
         }),
         __metadata("design:paramtypes", [DialogRef,
             EditorLocalizationService])
@@ -2253,7 +861,7 @@ var FileLinkDialogComponent = /** @class */ (function (_super) {
     ], FileLinkDialogComponent.prototype, "hrefInput", void 0);
     FileLinkDialogComponent = __decorate([
         Component({
-            template: "\n        <kendo-dialog-titlebar (close)=\"onCancelAction()\">\n            {{ titleText }}\n        </kendo-dialog-titlebar>\n        <div class=\"k-editor-dialog\">\n            <div class=\"k-editor-dialog k-popup-edit-form k-window-content k-content\">\n                <div class=\"k-edit-form-container k-window-content\">\n                    <form novalidate [formGroup]=\"linkForm\">\n                        <div class=\"k-edit-label\">\n                            <label (click)=\"hrefInput.focus()\">{{ textForWithPrefix('WebAddress') }}</label>\n                        </div>\n                        <div class=\"k-edit-field\">\n                            <input #hrefInput formControlName=\"href\" type=\"text\" class=\"k-textbox\" />\n                        </div>\n\n                        <div class=\"k-edit-label\">\n                            <label (click)=\"textInput.focus()\">{{ textForWithPrefix('Text') }}</label>\n                        </div>\n                        <div class=\"k-edit-field\">\n                            <input #textInput formControlName=\"text\" type=\"text\" class=\"k-textbox\" />\n                        </div>\n\n                        <div class=\"k-edit-label\">\n                            <label (click)=\"titleInput.focus()\">{{ textForWithPrefix('Title') }}</label>\n                        </div>\n                        <div class=\"k-edit-field\">\n                            <input #titleInput formControlName=\"title\" type=\"text\" class=\"k-textbox\" />\n                        </div>\n                        <ng-container *ngIf=\"command === 'createLink'\">\n                            <div class=\"k-edit-label\"></div>\n                            <div class=\"k-edit-field\">\n                                <input type=\"checkbox\" id=\"k-target-blank\" class=\"k-checkbox\" formControlName=\"target\" />\n                                <label class=\"k-checkbox-label\" for=\"k-target-blank\">{{ textForWithPrefix('OpenInNewWindow') }}</label>\n                            </div>\n                        </ng-container>\n                    </form>\n                </div>\n            </div>\n        </div>\n        <kendo-dialog-actions>\n            <button kendoButton (click)=\"onCancelAction()\">{{ textFor('dialogCancel') }}</button>\n            <button kendoButton [disabled]=\"linkForm.invalid\" (click)=\"onConfirmAction()\" [primary]=\"true\">\n                {{ textFor('dialogInsert') }}\n            </button>\n        </kendo-dialog-actions>\n    "
+            template: "\n        <kendo-dialog-titlebar (close)=\"onCancelAction()\">\n            {{ titleText }}\n        </kendo-dialog-titlebar>\n        <div class=\"k-editor-dialog\">\n            <div class=\"k-editor-dialog k-popup-edit-form k-window-content k-content\">\n                <div class=\"k-edit-form-container k-window-content\">\n                    <form novalidate [formGroup]=\"linkForm\">\n                        <div class=\"k-edit-label\">\n                            <label (click)=\"hrefInput.focus()\">{{ textForWithPrefix('WebAddress') }}</label>\n                        </div>\n                        <div class=\"k-edit-field\">\n                            <input #hrefInput formControlName=\"href\" type=\"text\" class=\"k-textbox k-input k-rounded-md\" />\n                        </div>\n\n                        <div class=\"k-edit-label\">\n                            <label (click)=\"textInput.focus()\">{{ textForWithPrefix('Text') }}</label>\n                        </div>\n                        <div class=\"k-edit-field\">\n                            <input #textInput formControlName=\"text\" type=\"text\" class=\"k-textbox k-input k-rounded-md\" />\n                        </div>\n\n                        <div class=\"k-edit-label\">\n                            <label (click)=\"titleInput.focus()\">{{ textForWithPrefix('Title') }}</label>\n                        </div>\n                        <div class=\"k-edit-field\">\n                            <input #titleInput formControlName=\"title\" type=\"text\" class=\"k-textbox k-input k-rounded-md\" />\n                        </div>\n                        <ng-container *ngIf=\"command === 'createLink'\">\n                            <div class=\"k-edit-label\"></div>\n                            <div class=\"k-edit-field\">\n                                <input type=\"checkbox\" id=\"k-target-blank\" kendoCheckBox formControlName=\"target\" />\n                                <label class=\"k-checkbox-label\" for=\"k-target-blank\">{{ textForWithPrefix('OpenInNewWindow') }}</label>\n                            </div>\n                        </ng-container>\n                    </form>\n                </div>\n            </div>\n        </div>\n        <kendo-dialog-actions>\n            <button kendoButton (click)=\"onCancelAction()\">{{ textFor('dialogCancel') }}</button>\n            <button kendoButton [disabled]=\"linkForm.invalid\" (click)=\"onConfirmAction()\" [primary]=\"true\">\n                {{ textFor('dialogInsert') }}\n            </button>\n        </kendo-dialog-actions>\n    "
         }),
         __metadata("design:paramtypes", [DialogRef, EditorLocalizationService])
     ], FileLinkDialogComponent);
@@ -2273,7 +881,7 @@ var tablesStyles = "\n  .ProseMirror .tableWrapper {\n    overflow-x: auto;\n
  */
 var rtlStyles = 'body { direction: rtl }';
 
-var ɵ0$6 = function (arg) { return "plugins must be a function, but received " + JSON.stringify(arg) + "."; }, ɵ1$6 = function (arg) { return "pastedContent must be a function, but received " + JSON.stringify(arg) + "."; };
+var ɵ0$2 = function (arg) { return "plugins must be a function, but received " + JSON.stringify(arg) + "."; }, ɵ1$2 = function (arg) { return "pastedContent must be a function, but received " + JSON.stringify(arg) + "."; };
 /* tslint:disable:variable-name */
 /**
  * @hidden
@@ -2281,10 +889,10 @@ var ɵ0$6 = function (arg) { return "plugins must be a function, but received "
 var EditorErrorMessages = {
     schemaType: 'Expected value of type Schema. See http://www.telerik.com/kendo-angular-ui/components/editor/schema/',
     setSchemaOnce: 'The Schema cannot be changed dynamically. See http://www.telerik.com/kendo-angular-ui/components/editor/schema/',
-    pluginsCallbackType: ɵ0$6,
-    pastedContentCallbackType: ɵ1$6,
+    pluginsCallbackType: ɵ0$2,
+    pastedContentCallbackType: ɵ1$2,
     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 https://www.telerik.com/kendo-angular-ui/components/editor/plugins/#toc-custom-plugins/',
     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/'
 };
 
@@ -2418,6 +1026,9 @@ var EditorComponent = /** @class */ (function () {
         this.contentAreaLoaded = new Subject();
         this.dispatchTransaction = function (tr) {
             var docChanged = tr.docChanged;
+            if (_this.disabled || (_this.readonly && docChanged)) {
+                return;
+            }
             if (docChanged) {
                 var doc = tr.doc;
                 var html_1 = getHtml({ doc: doc });
@@ -2794,7 +1405,7 @@ var EditorComponent = /** @class */ (function () {
      * @param {any} attr - Optional parameters for the command. Apart from the following list,
      * the parameters do not expect specific attributes when you call them:
      * - `format` - Accepts an object with the `tag` property.
-     * The supported tags are `p`, `blockquote`, and any of the `h1` to `h6` heading tags.
+     * The supported tags are `p` and any of the `h1` to `h6` heading tags.
      * - `createLink` - Accepts an object with the `href`, `title`, and `target` properties. The `href` property is mandatory.
      * - `setHTML` - Accepts a `string` parameter.
      * - `insertTable` - Accepts an object with the `rows` and `cols` properties. The number values are zero based.
@@ -3006,16 +1617,13 @@ var EditorComponent = /** @class */ (function () {
                     }
                 }); }
             }),
-            new Plugin({
-                key: new PluginKey('editor-filter-disabled-state'),
-                filterTransaction: function () { return !_this.disabled || _this.inForm; }
-            }),
             history(),
             keymap(buildListKeymap(currentSchema)),
             keymap(buildKeymap(currentSchema, { applyToWord: this.applyToWord })),
             keymap(baseKeymap),
             gapCursor(),
-            imageResizing()
+            imageResizing(),
+            tableEditing()
         ];
         if (this.placeholder) {
             defaultPlugins.push(placeholder(this.placeholder));
@@ -3054,7 +1662,7 @@ var EditorComponent = /** @class */ (function () {
             this.subs.add(fromEvent(containerElement, 'focusin')
                 .subscribe(function () {
                 if (_this.readonly) {
-                    contentAreaClasslist_1.add('k-state-focused');
+                    contentAreaClasslist_1.add('k-focus');
                 }
                 if (!_this.focusChangedProgrammatically || _this.shouldEmitFocus) {
                     _this.ngZone.run(function () { return _this.onFocus.emit(); });
@@ -3064,7 +1672,7 @@ var EditorComponent = /** @class */ (function () {
             this.subs.add(fromEvent(containerElement, 'focusout')
                 .subscribe(function () {
                 if (_this.readonly) {
-                    contentAreaClasslist_1.remove('k-state-focused');
+                    contentAreaClasslist_1.remove('k-focus');
                 }
                 if (!_this.focusChangedProgrammatically) {
                     _this.ngZone.run(function () { return _this.onBlur.emit(); });
@@ -3211,7 +1819,7 @@ var EditorComponent = /** @class */ (function () {
         __metadata("design:paramtypes", [])
     ], EditorComponent.prototype, "resizableClass", null);
     __decorate([
-        HostBinding('class.k-state-disabled'),
+        HostBinding('class.k-disabled'),
         __metadata("design:type", Boolean),
         __metadata("design:paramtypes", [])
     ], EditorComponent.prototype, "isDisabled", null);
@@ -3304,7 +1912,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-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 srcdoc=\"<!DOCTYPE html>\" 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-blockquote=\"kendo.editor.blockquote|The title of the tool that wraps an element in a blockquote\"\n            blockquote=\"Quotation\"\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 srcdoc=\"<!DOCTYPE html>\" 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        "
             ]
@@ -3376,7 +1984,7 @@ var FormatDropDownListComponent = /** @class */ (function () {
         Component({
             // tslint:disable-next-line:no-forward-ref
             selector: 'kendo-editor-format-dropdownlist',
-            template: "\n        <kendo-dropdownlist\n            #element\n            kendoEditorDropDownTool\n            [defaultItem]=\"defaultItem\"\n            [textField]=\"'text'\"\n            [valueField]=\"'tag'\"\n            [data]=\"data\"\n            [(value)]=\"value\"\n            [valuePrimitive]=\"true\"\n            [itemDisabled]=\"itemDisabled\"\n            [attr.title]=\"title\"\n            [disabled]=\"disabled\"\n            [tabindex]=\"tabindex\"\n            (valueChange)=\"onValueChange($event)\"\n        >\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n                <ng-container [ngSwitch]=\"dataItem.tag\">\n                    <span *ngSwitchCase=\"'h1'\" style=\"display: block; font-size: 2em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'h2'\" style=\"display: block; font-size: 1.5em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'h3'\" style=\"display: block; font-size: 1.17em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'h4'\" style=\"display: block; font-size: 1em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'h5'\" style=\"display: block; font-size: .83em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'h6'\" style=\"display: block; font-size: .67em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'p'\" style=\"display: block; margin-left: 0;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'blockquote'\" style=\"display: block; margin-left: 0;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchDefault>{{ dataItem.text }}</span>\n                </ng-container>\n            </ng-template>\n        </kendo-dropdownlist>\n    "
+            template: "\n        <kendo-dropdownlist\n            #element\n            kendoEditorDropDownTool\n            [defaultItem]=\"defaultItem\"\n            [textField]=\"'text'\"\n            [valueField]=\"'tag'\"\n            [data]=\"data\"\n            [(value)]=\"value\"\n            [valuePrimitive]=\"true\"\n            [itemDisabled]=\"itemDisabled\"\n            [attr.title]=\"title\"\n            [disabled]=\"disabled\"\n            [tabindex]=\"tabindex\"\n            (valueChange)=\"onValueChange($event)\"\n        >\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n                <ng-container [ngSwitch]=\"dataItem.tag\">\n                    <span *ngSwitchCase=\"'h1'\" style=\"display: block; font-size: 2em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'h2'\" style=\"display: block; font-size: 1.5em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'h3'\" style=\"display: block; font-size: 1.17em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'h4'\" style=\"display: block; font-size: 1em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'h5'\" style=\"display: block; font-size: .83em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'h6'\" style=\"display: block; font-size: .67em; margin-left: 0; font-weight: bold;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchCase=\"'p'\" style=\"display: block; margin-left: 0;\">\n                        {{ dataItem.text }}\n                    </span>\n\n                    <span *ngSwitchDefault>{{ dataItem.text }}</span>\n                </ng-container>\n            </ng-template>\n        </kendo-dropdownlist>\n    "
         })
     ], FormatDropDownListComponent);
     return FormatDropDownListComponent;
@@ -3488,7 +2096,7 @@ var ColorPickerDialogComponent = /** @class */ (function (_super) {
     ], ColorPickerDialogComponent.prototype, "colorPicker", void 0);
     ColorPickerDialogComponent = __decorate([
         Component({
-            template: "\n        <kendo-dialog-titlebar (close)=\"onCancelAction()\">\n            {{ textFor(editorCommand) }}\n        </kendo-dialog-titlebar>\n        <div class=\"k-editor-dialog\">\n            <div class=\"k-editor-dialog k-popup-edit-form k-window-content k-content\">\n                <div class=\"k-edit-form-container k-window-content\" style=\"text-align: center;\">\n                    <kendo-colorpicker\n                        #colorpicker\n                        [view]=\"view\"\n                        [format]=\"'hex'\"\n                        [attr.title]=\"title\"\n                        [icon]=\"icon\"\n                        [(value)]=\"value\"\n                        [paletteSettings]=\"paletteSettings\"\n                        (activeColorClick)=\"handleActiveColorClick($event)\"\n                    >\n                    </kendo-colorpicker>\n                </div>\n            </div>\n        </div>\n        <kendo-dialog-actions>\n            <button kendoButton (click)=\"onCancelAction()\">{{ textFor('dialogCancel') }}</button>\n            <button kendoButton\n                    (click)=\"onConfirmAction()\" [primary]=\"true\">{{ textFor('dialogApply') }}</button>\n        </kendo-dialog-actions>\n    "
+            template: "\n        <kendo-dialog-titlebar (close)=\"onCancelAction()\">\n            {{ textFor(editorCommand) }}\n        </kendo-dialog-titlebar>\n        <div class=\"k-editor-dialog\">\n            <div class=\"k-editor-dialog k-popup-edit-form k-window-content k-content\">\n                <div class=\"k-edit-form-container k-window-content\" style=\"text-align: center;\">\n                    <kendo-colorpicker\n                        #colorpicker\n                        [views]=\"['palette']\"\n                        [format]=\"'hex'\"\n                        [attr.title]=\"title\"\n                        [icon]=\"icon\"\n                        [(value)]=\"value\"\n                        [paletteSettings]=\"paletteSettings\"\n                        (activeColorClick)=\"handleActiveColorClick($event)\"\n                    >\n                    </kendo-colorpicker>\n                </div>\n            </div>\n        </div>\n        <kendo-dialog-actions>\n            <button kendoButton (click)=\"onCancelAction()\">{{ textFor('dialogCancel') }}</button>\n            <button kendoButton\n                    (click)=\"onConfirmAction()\" [primary]=\"true\">{{ textFor('dialogApply') }}</button>\n        </kendo-dialog-actions>\n    "
         }),
         __metadata("design:paramtypes", [DialogRef,
             EditorLocalizationService])
@@ -3681,7 +2289,6 @@ var EditorFormatComponent = /** @class */ (function (_super) {
         _this.valueChange = new EventEmitter();
         _this._data = [
             { text: 'Paragraph', tag: 'p' },
-            { text: 'Quotation', tag: 'blockquote' },
             { text: 'Heading 1', tag: 'h1' },
             { text: 'Heading 2', tag: 'h2' },
             { text: 'Heading 3', tag: 'h3' },
@@ -4370,14 +2977,26 @@ var EditorColorPickerComponent = /** @class */ (function (_super) {
          */
         _this.disabled = false;
         /**
-         * Specifies whether the ColorPicker will render a gradient, palette or combo view.
+         * Specifies whether the ColorPicker will render a gradient, palette, or both in its popup.
          *
-         * @default 'palette'
+         * @default ['palette']
          */
-        _this.view = 'palette';
+        _this.views = ['palette'];
         return _this;
     }
     EditorColorPickerComponent_1 = EditorColorPickerComponent;
+    Object.defineProperty(EditorColorPickerComponent.prototype, "view", {
+        /**
+         * @hidden
+         *
+         * For backward compatibility with configurations using the deprecated "view" input.
+         */
+        set: function (view) {
+            this.views = [view];
+        },
+        enumerable: true,
+        configurable: true
+    });
     Object.defineProperty(EditorColorPickerComponent.prototype, "title", {
         /**
          * @hidden
@@ -4459,7 +3078,7 @@ var EditorColorPickerComponent = /** @class */ (function (_super) {
             editorCommand: this.editorCommand,
             paletteSettings: this.paletteSettings,
             icon: this.icon,
-            view: this.view
+            views: this.views
         });
     };
     /**
@@ -4510,8 +3129,13 @@ var EditorColorPickerComponent = /** @class */ (function (_super) {
     ], EditorColorPickerComponent.prototype, "disabled", void 0);
     __decorate([
         Input(),
-        __metadata("design:type", String)
-    ], EditorColorPickerComponent.prototype, "view", void 0);
+        __metadata("design:type", Array)
+    ], EditorColorPickerComponent.prototype, "views", void 0);
+    __decorate([
+        Input(),
+        __metadata("design:type", String),
+        __metadata("design:paramtypes", [String])
+    ], EditorColorPickerComponent.prototype, "view", null);
     __decorate([
         ViewChild('toolbarTemplate', { static: true }),
         __metadata("design:type", TemplateRef)
@@ -4536,7 +3160,7 @@ var EditorColorPickerComponent = /** @class */ (function (_super) {
         Component({
             providers: [{ provide: ToolBarToolComponent, useExisting: forwardRef(function () { return EditorColorPickerComponent_1; }) }],
             selector: 'kendo-toolbar-colorpicker',
-            template: "\n        <ng-template #toolbarTemplate>\n            <kendo-colorpicker\n                #colorpicker\n                [view]=\"view\"\n                [format]=\"'hex'\"\n                [attr.title]=\"title\"\n                [icon]=\"icon\"\n                [value]=\"value\"\n                [paletteSettings]=\"paletteSettings\"\n                [disabled]=\"disabled\"\n                [tabindex]=\"tabindex\"\n                (valueChange)=\"handleValueChange($event)\"\n                (activeColorClick)=\"handleActiveColorClick($event)\"\n                (open)=\"onOpen(colorpicker)\"\n                (close)=\"onClose(colorpicker)\"\n            >\n            </kendo-colorpicker>\n        </ng-template>\n        <ng-template #popupTemplate>\n            <button\n                tabindex=\"-1\"\n                type=\"button\"\n                kendoButton\n                #colorPickerButton\n                class=\"k-overflow-button\"\n                [icon]=\"icon\"\n                [attr.title]=\"title\"\n                [disabled]=\"disabled\"\n                [tabindex]=\"tabindex\"\n                (click)=\"openDialog()\"\n            >\n                {{ title }}\n            </button>\n        </ng-template>\n    "
+            template: "\n        <ng-template #toolbarTemplate>\n            <kendo-colorpicker\n                #colorpicker\n                [views]=\"['palette']\"\n                [format]=\"'hex'\"\n                [attr.title]=\"title\"\n                [icon]=\"icon\"\n                [value]=\"value\"\n                [paletteSettings]=\"paletteSettings\"\n                [disabled]=\"disabled\"\n                [tabindex]=\"tabindex\"\n                (valueChange)=\"handleValueChange($event)\"\n                (activeColorClick)=\"handleActiveColorClick($event)\"\n                (open)=\"onOpen(colorpicker)\"\n                (close)=\"onClose(colorpicker)\"\n            >\n            </kendo-colorpicker>\n        </ng-template>\n        <ng-template #popupTemplate>\n            <button\n                tabindex=\"-1\"\n                type=\"button\"\n                kendoButton\n                #colorPickerButton\n                class=\"k-overflow-button\"\n                [icon]=\"icon\"\n                [attr.title]=\"title\"\n                [disabled]=\"disabled\"\n                [tabindex]=\"tabindex\"\n                (click)=\"openDialog()\"\n            >\n                {{ title }}\n            </button>\n        </ng-template>\n    "
         }),
         __param(0, Host()),
         __metadata("design:paramtypes", [EditorComponent,
@@ -4790,7 +3414,7 @@ var PopupTableGridComponent = /** @class */ (function () {
     PopupTableGridComponent = __decorate([
         Component({
             selector: 'kendo-popup-table-grid',
-            template: "\n        <div style=\"border-color: inherit;\" (mouseleave)=\"resetState()\" (click)=\"insertTable()\">\n            <span *ngFor=\"let i of cells\"\n                class=\"k-ct-cell\"\n                [class.k-state-selected]=\"selected(i)\"\n                [class.k-state-disabled]=\"!selected(i)\"\n                (mouseenter)=\"setState(i)\">\n            </span>\n        </div>\n        <div class=\"k-status\" unselectable=\"on\">{{ message }}</div>\n        <!-- uncomment when TableWizard is completed\n        <div class=\"k-editor-toolbar\" unselectable=\"on\">\n            <button type=\"button\" kendoButton class=\"k-tool\" [icon]=\"'table-wizard'\" (click)=\"openTableWizard()\" title=\"Table Wizard\">Table Wizard</button>\n        </div>\n        -->\n    "
+            template: "\n        <div style=\"border-color: inherit;\" (mouseleave)=\"resetState()\" (click)=\"insertTable()\">\n            <span *ngFor=\"let i of cells\"\n                class=\"k-ct-cell\"\n                [class.k-selected]=\"selected(i)\"\n                [class.k-disabled]=\"!selected(i)\"\n                (mouseenter)=\"setState(i)\">\n            </span>\n        </div>\n        <div class=\"k-status\" unselectable=\"on\">{{ message }}</div>\n        <!-- uncomment when TableWizard is completed\n        <div class=\"k-editor-toolbar\" unselectable=\"on\">\n            <button type=\"button\" kendoButton class=\"k-tool\" [icon]=\"'table-wizard'\" (click)=\"openTableWizard()\" title=\"Table Wizard\">Table Wizard</button>\n        </div>\n        -->\n    "
         })
     ], PopupTableGridComponent);
     return PopupTableGridComponent;
@@ -4805,6 +3429,7 @@ var commandIcons = {
     alignLeft: 'align-left',
     alignRight: 'align-right',
     backColor: 'background',
+    blockquote: 'blockquote',
     bold: 'bold',
     cleanFormatting: 'clear-css',
     createLink: 'link-horizontal',
@@ -5056,6 +3681,43 @@ var EditorAlignJustifyButtonDirective = /** @class */ (function (_super) {
     return EditorAlignJustifyButtonDirective;
 }(EditorCommandButton));
 
+/**
+ * A directive which configures an existing `ToolBarButtonComponent` as an Editor Blockquote tool
+ * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
+ * The directive will predefine the `icon` and `click` event handlers of the button.
+ *
+ * @example
+ * ```ts-no-run
+ * <kendo-toolbar-button kendoEditorBlockquoteButton></kendo-toolbar-button>
+ * ```
+ *
+ * The following example demonstrates how to change the default icon that is applied by the directive.
+ *
+ * @example
+ * ```ts-no-run
+ * <kendo-toolbar-button kendoEditorBlockquoteButton icon="blogger"></kendo-toolbar-button>
+ * ```
+ */
+var EditorBlockquoteDirective = /** @class */ (function (_super) {
+    __extends(EditorBlockquoteDirective, _super);
+    function EditorBlockquoteDirective(button, editor, localization, toolsService) {
+        var _this = _super.call(this, 'blockquote', button, editor, localization, toolsService) || this;
+        _this.editor = editor;
+        return _this;
+    }
+    EditorBlockquoteDirective = __decorate([
+        Directive({
+            selector: 'kendo-toolbar-button[kendoEditorBlockquoteButton]'
+        }),
+        __param(1, Host()),
+        __metadata("design:paramtypes", [ToolBarButtonComponent,
+            EditorComponent,
+            EditorLocalizationService,
+            EditorToolsService])
+    ], EditorBlockquoteDirective);
+    return EditorBlockquoteDirective;
+}(EditorCommandButton));
+
 /**
  * A directive which configures an existing `ToolBarButtonComponent` as an Editor Redo tool
  * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
@@ -6050,6 +4712,10 @@ var Messages = /** @class */ (function (_super) {
         Input(),
         __metadata("design:type", String)
     ], Messages.prototype, "backColor", void 0);
+    __decorate([
+        Input(),
+        __metadata("design:type", String)
+    ], Messages.prototype, "blockquote", void 0);
     __decorate([
         Input(),
         __metadata("design:type", String)
@@ -6485,7 +5151,9 @@ var COMPONENT_DIRECTIVES = [
     // print
     EditorPrintDirective,
     // select all
-    EditorSelectAllButtonDirective
+    EditorSelectAllButtonDirective,
+    // blockquote
+    EditorBlockquoteDirective
 ];
 var TOOLBAR_TOOLS = [
     EditorFontSizeComponent,
@@ -6590,6 +5258,7 @@ var EditorModule = /** @class */ (function () {
                 DialogModule,
                 DropDownsModule,
                 NumericTextBoxModule,
+                CheckBoxModule,
                 ToolBarModule,
                 TextBoxModule
             ]
@@ -6602,4 +5271,4 @@ var EditorModule = /** @class */ (function () {
  * Generated bundle index. Do not edit.
  */
 
-export { ColorPickerDialogComponent, FileLinkDialogComponent, FontFamilyDialogComponent, FontSizeDialogComponent, FormatDialogComponent, ImageDialogComponent, InsertTableDialogComponent, SourceDialogComponent, CustomMessagesComponent, EditorLocalizationService, LocalizedMessagesDirective, Messages, EditorAlignCenterButtonDirective, EditorAlignJustifyButtonDirective, EditorAlignLeftButtonDirective, EditorAlignRightButtonDirective, EditorBackColorDirective, EditorColorPickerComponent, EditorForeColorDirective, EditorCleanFormattingButtonDirective, FontFamilyDropDownListComponent, EditorFontFamilyComponent, FontSizeDropDownListComponent, EditorFontSizeComponent, FormatDropDownListComponent, EditorFormatComponent, EditorRedoButtonDirective, EditorUndoButtonDirective, EditorInsertImageButtonDirective, EditorIndentButtonDirective, EditorOutdentButtonDirective, EditorCreateLinkButtonDirective, EditorInsertFileButtonDirective, EditorUnlinkButtonDirective, EditorInsertOrderedListButtonDirective, EditorInsertUnorderedListButtonDirective, EditorPrintDirective, EditorSelectAllButtonDirective, DropDownToolDirective, EditorCommandBase, EditorCommandButton, EditorCommandDialog, EditorViewSourceButtonDirective, EditorAddColumnAfterButtonDirective, EditorAddColumnBeforeButtonDirective, EditorAddRowAfterButtonDirective, EditorAddRowBeforeButtonDirective, EditorDeleteColumnButtonDirective, EditorDeleteRowButtonDirective, EditorDeleteTableButtonDirective, EditorInsertTableButtonComponent, EditorMergeCellsButtonDirective, EditorSplitCellButtonDirective, PopupTableGridComponent, EditorToolsService, EditorBoldButtonDirective, EditorItalicButtonDirective, EditorStrikethroughButtonDirective, EditorSubscriptButtonDirective, EditorSuperscriptButtonDirective, EditorUnderlineButtonDirective, EditorComponent, EditorModule, schema, EditorPasteEvent };
+export { semanticNodes, semanticTagNames, ColorPickerDialogComponent, FileLinkDialogComponent, FontFamilyDialogComponent, FontSizeDialogComponent, FormatDialogComponent, ImageDialogComponent, InsertTableDialogComponent, SourceDialogComponent, CustomMessagesComponent, EditorLocalizationService, LocalizedMessagesDirective, Messages, EditorAlignCenterButtonDirective, EditorAlignJustifyButtonDirective, EditorAlignLeftButtonDirective, EditorAlignRightButtonDirective, EditorBlockquoteDirective, EditorBackColorDirective, EditorColorPickerComponent, EditorForeColorDirective, EditorCleanFormattingButtonDirective, FontFamilyDropDownListComponent, EditorFontFamilyComponent, FontSizeDropDownListComponent, EditorFontSizeComponent, FormatDropDownListComponent, EditorFormatComponent, EditorRedoButtonDirective, EditorUndoButtonDirective, EditorInsertImageButtonDirective, EditorIndentButtonDirective, EditorOutdentButtonDirective, EditorCreateLinkButtonDirective, EditorInsertFileButtonDirective, EditorUnlinkButtonDirective, EditorInsertOrderedListButtonDirective, EditorInsertUnorderedListButtonDirective, EditorPrintDirective, EditorSelectAllButtonDirective, DropDownToolDirective, EditorCommandBase, EditorCommandButton, EditorCommandDialog, EditorViewSourceButtonDirective, EditorAddColumnAfterButtonDirective, EditorAddColumnBeforeButtonDirective, EditorAddRowAfterButtonDirective, EditorAddRowBeforeButtonDirective, EditorDeleteColumnButtonDirective, EditorDeleteRowButtonDirective, EditorDeleteTableButtonDirective, EditorInsertTableButtonComponent, EditorMergeCellsButtonDirective, EditorSplitCellButtonDirective, PopupTableGridComponent, EditorToolsService, EditorBoldButtonDirective, EditorItalicButtonDirective, EditorStrikethroughButtonDirective, EditorSubscriptButtonDirective, EditorSuperscriptButtonDirective, EditorUnderlineButtonDirective, EditorComponent, EditorModule, schema, EditorPasteEvent };