@dangl/angular-material-shared 1.2.1-beta0003 → 1.2.1-beta0013

package/tinymce-assets/plugins/table/plugin.js

@@ -4,7 +4,7 @@
  * For LGPL see License.txt in the project root for license information.
  * For commercial licenses see https://www.tiny.cloud/
  *
- * Version: 5.9.0 (2021-08-26)
+ * Version: 5.10.0 (2021-10-11)
  */
 (function () {
     'use strict';
@@ -537,6 +537,10 @@
     var isEmpty$1 = function (s) {
       return !isNotEmpty(s);
     };
+    var toFloat = function (value) {
+      var num = parseFloat(value);
+      return isNaN(num) ? Optional.none() : Optional.some(num);
+    };
 
     var normalVersionRegex = /.*?version\/\ ?([0-9]+)\.([0-9]+).*/;
     var checkContains = function (target) {
@@ -1076,6 +1080,9 @@
     var parent = function (element) {
       return Optional.from(element.dom.parentNode).map(SugarElement.fromDom);
     };
+    var parentElement = function (element) {
+      return Optional.from(element.dom.parentElement).map(SugarElement.fromDom);
+    };
     var parents = function (element, isRoot) {
       var stop = isFunction(isRoot) ? isRoot : never;
       var dom = element.dom;
@@ -1092,9 +1099,6 @@
       }
       return ret;
     };
-    var offsetParent = function (element) {
-      return Optional.from(element.dom.offsetParent).map(SugarElement.fromDom);
-    };
     var prevSibling = function (element) {
       return Optional.from(element.dom.previousSibling).map(SugarElement.fromDom);
     };
@@ -1288,6 +1292,15 @@
         rawSet(dom, k, v);
       });
     };
+    var setOptions = function (element, attrs) {
+      each$1(attrs, function (v, k) {
+        v.fold(function () {
+          remove$7(element, k);
+        }, function (value) {
+          rawSet(element.dom, k, value);
+        });
+      });
+    };
     var get$b = function (element, key) {
       var v = element.dom.getAttribute(key);
       return v === null ? undefined : v;
@@ -1406,8 +1419,12 @@
     var getSpan = function (cell, type) {
       return getAttrValue(cell, type, 1);
     };
-    var hasColspan = function (cell) {
-      return getSpan(cell, 'colspan') > 1;
+    var hasColspan = function (cellOrCol) {
+      if (isTag('col')(cellOrCol)) {
+        return getAttrValue(cellOrCol, 'span', 1) > 1;
+      } else {
+        return getSpan(cellOrCol, 'colspan') > 1;
+      }
     };
     var hasRowspan = function (cell) {
       return getSpan(cell, 'rowspan') > 1;
@@ -1503,7 +1520,7 @@
     var fromTable$1 = function (table) {
       var rows = rows$1(table);
       var columnGroups$1 = columnGroups(table);
-      var elems = __spreadArray(__spreadArray([], columnGroups$1), rows);
+      var elems = __spreadArray(__spreadArray([], columnGroups$1, true), rows, true);
       return fromRowsOrColGroups(elems, getParentSection);
     };
     var fromPastedRows = function (elems, section) {
@@ -1614,8 +1631,6 @@
     var generate$1 = function (list) {
       var access = {};
       var cells = [];
-      var columns = {};
-      var colgroups = [];
       var tableOpt = head(list).map(function (rowData) {
         return rowData.element;
       }).bind(table);
@@ -1623,35 +1638,46 @@
       var maxRows = 0;
       var maxColumns = 0;
       var rowCount = 0;
-      each$2(list, function (rowData) {
-        if (rowData.section === 'colgroup') {
-          columns = generateColumns(rowData);
-          colgroups = [colgroup(rowData.element, values(columns))];
-        } else {
-          var currentRow_1 = [];
-          each$2(rowData.cells, function (rowCell) {
-            var start = 0;
-            while (access[key(rowCount, start)] !== undefined) {
-              start++;
-            }
-            var isLocked = hasNonNullableKey(lockedColumns, start.toString());
-            var current = extended(rowCell.element, rowCell.rowspan, rowCell.colspan, rowCount, start, isLocked);
-            for (var occupiedColumnPosition = 0; occupiedColumnPosition < rowCell.colspan; occupiedColumnPosition++) {
-              for (var occupiedRowPosition = 0; occupiedRowPosition < rowCell.rowspan; occupiedRowPosition++) {
-                var rowPosition = rowCount + occupiedRowPosition;
-                var columnPosition = start + occupiedColumnPosition;
-                var newpos = key(rowPosition, columnPosition);
-                access[newpos] = current;
-                maxColumns = Math.max(maxColumns, columnPosition + 1);
-              }
+      var _a = partition(list, function (rowData) {
+          return rowData.section === 'colgroup';
+        }), colgroupRows = _a.pass, rows = _a.fail;
+      each$2(rows, function (rowData) {
+        var currentRow = [];
+        each$2(rowData.cells, function (rowCell) {
+          var start = 0;
+          while (access[key(rowCount, start)] !== undefined) {
+            start++;
+          }
+          var isLocked = hasNonNullableKey(lockedColumns, start.toString());
+          var current = extended(rowCell.element, rowCell.rowspan, rowCell.colspan, rowCount, start, isLocked);
+          for (var occupiedColumnPosition = 0; occupiedColumnPosition < rowCell.colspan; occupiedColumnPosition++) {
+            for (var occupiedRowPosition = 0; occupiedRowPosition < rowCell.rowspan; occupiedRowPosition++) {
+              var rowPosition = rowCount + occupiedRowPosition;
+              var columnPosition = start + occupiedColumnPosition;
+              var newpos = key(rowPosition, columnPosition);
+              access[newpos] = current;
+              maxColumns = Math.max(maxColumns, columnPosition + 1);
             }
-            currentRow_1.push(current);
-          });
-          maxRows++;
-          cells.push(rowdetail(rowData.element, currentRow_1, rowData.section));
-          rowCount++;
-        }
+          }
+          currentRow.push(current);
+        });
+        maxRows++;
+        cells.push(rowdetail(rowData.element, currentRow, rowData.section));
+        rowCount++;
       });
+      var _b = last$2(colgroupRows).map(function (rowData) {
+          var columns = generateColumns(rowData);
+          var colgroup$1 = colgroup(rowData.element, values(columns));
+          return {
+            colgroups: [colgroup$1],
+            columns: columns
+          };
+        }).getOrThunk(function () {
+          return {
+            colgroups: [],
+            columns: {}
+          };
+        }), columns = _b.columns, colgroups = _b.colgroups;
       var grid$1 = grid(maxRows, maxColumns);
       return {
         grid: grid$1,
@@ -2406,6 +2432,46 @@
       };
     };
 
+    var needManualCalc = function () {
+      var browser = detect$3().browser;
+      return browser.isIE() || browser.isEdge();
+    };
+    var toNumber = function (px, fallback) {
+      return toFloat(px).getOr(fallback);
+    };
+    var getProp = function (element, name, fallback) {
+      return toNumber(get$a(element, name), fallback);
+    };
+    var getBoxSizing = function (element) {
+      return get$a(element, 'box-sizing');
+    };
+    var calcContentBoxSize = function (element, size, upper, lower) {
+      var paddingUpper = getProp(element, 'padding-' + upper, 0);
+      var paddingLower = getProp(element, 'padding-' + lower, 0);
+      var borderUpper = getProp(element, 'border-' + upper + '-width', 0);
+      var borderLower = getProp(element, 'border-' + lower + '-width', 0);
+      return size - paddingUpper - paddingLower - borderUpper - borderLower;
+    };
+    var getCalculatedHeight = function (element, boxSizing) {
+      var dom = element.dom;
+      var height = dom.getBoundingClientRect().height || dom.offsetHeight;
+      return boxSizing === 'border-box' ? height : calcContentBoxSize(element, height, 'top', 'bottom');
+    };
+    var getCalculatedWidth = function (element, boxSizing) {
+      var dom = element.dom;
+      var width = dom.getBoundingClientRect().width || dom.offsetWidth;
+      return boxSizing === 'border-box' ? width : calcContentBoxSize(element, width, 'left', 'right');
+    };
+    var getHeight$1 = function (element) {
+      return needManualCalc() ? getCalculatedHeight(element, getBoxSizing(element)) : getProp(element, 'height', element.dom.offsetHeight);
+    };
+    var getWidth = function (element) {
+      return needManualCalc() ? getCalculatedWidth(element, getBoxSizing(element)) : getProp(element, 'width', element.dom.offsetWidth);
+    };
+    var getInnerWidth = function (element) {
+      return getCalculatedWidth(element, 'content-box');
+    };
+
     var api$1 = Dimension('width', function (element) {
       return element.dom.offsetWidth;
     });
@@ -2415,6 +2481,8 @@
     var getOuter$2 = function (element) {
       return api$1.getOuter(element);
     };
+    var getInner = getInnerWidth;
+    var getRuntime$1 = getWidth;
 
     var columns = function (warehouse, isValidCell) {
       if (isValidCell === void 0) {
@@ -2537,6 +2605,7 @@
     var getOuter$1 = function (element) {
       return api.getOuter(element);
     };
+    var getRuntime = getHeight$1;
 
     var r = function (left, top) {
       var translate = function (x, y) {
@@ -2744,57 +2813,14 @@
       });
     };
 
-    var needManualCalc = function () {
-      var browser = detect$3().browser;
-      return browser.isIE() || browser.isEdge();
-    };
-    var toNumber = function (px, fallback) {
-      var num = parseFloat(px);
-      return isNaN(num) ? fallback : num;
-    };
-    var getProp = function (elm, name, fallback) {
-      return toNumber(get$a(elm, name), fallback);
-    };
-    var getCalculatedHeight = function (cell) {
-      var height = cell.dom.getBoundingClientRect().height;
-      var boxSizing = get$a(cell, 'box-sizing');
-      if (boxSizing === 'border-box') {
-        return height;
-      } else {
-        var paddingTop = getProp(cell, 'padding-top', 0);
-        var paddingBottom = getProp(cell, 'padding-bottom', 0);
-        var borderTop = getProp(cell, 'border-top-width', 0);
-        var borderBottom = getProp(cell, 'border-bottom-width', 0);
-        var borders = borderTop + borderBottom;
-        return height - paddingTop - paddingBottom - borders;
-      }
-    };
-    var getCalculatedWidth = function (cell) {
-      var width = cell.dom.getBoundingClientRect().width;
-      var boxSizing = get$a(cell, 'box-sizing');
-      if (boxSizing === 'border-box') {
-        return width;
-      } else {
-        var paddingLeft = getProp(cell, 'padding-left', 0);
-        var paddingRight = getProp(cell, 'padding-right', 0);
-        var borderLeft = getProp(cell, 'border-left-width', 0);
-        var borderRight = getProp(cell, 'border-right-width', 0);
-        var borders = borderLeft + borderRight;
-        return width - paddingLeft - paddingRight - borders;
-      }
-    };
-    var getHeight$1 = function (cell) {
-      return needManualCalc() ? getCalculatedHeight(cell) : getProp(cell, 'height', get$7(cell));
-    };
-    var getWidth = function (cell) {
-      return needManualCalc() ? getCalculatedWidth(cell) : getProp(cell, 'width', get$8(cell));
-    };
-
     var rPercentageBasedSizeRegex = /(\d+(\.\d+)?)%/;
     var rPixelBasedSizeRegex = /(\d+(\.\d+)?)px|em/;
-    var getPercentSize = function (elm, getter) {
-      var relativeParent = offsetParent(elm).getOr(getBody$1(owner(elm)));
-      return getter(elm) / getter(relativeParent) * 100;
+    var isCol$2 = isTag('col');
+    var getPercentSize = function (elm, outerGetter, innerGetter) {
+      var relativeParent = parentElement(elm).getOrThunk(function () {
+        return getBody$1(owner(elm));
+      });
+      return outerGetter(elm) / innerGetter(relativeParent) * 100;
     };
     var setPixelWidth = function (cell, amount) {
       set$1(cell, 'width', amount + 'px');
@@ -2806,9 +2832,7 @@
       set$1(cell, 'height', amount + 'px');
     };
     var getHeightValue = function (cell) {
-      return getRaw$2(cell, 'height').getOrThunk(function () {
-        return getHeight$1(cell) + 'px';
-      });
+      return getRuntime(cell) + 'px';
     };
     var convert = function (cell, number, getter, setter) {
       var newSize = table(cell).map(function (table) {
@@ -2819,7 +2843,7 @@
       return newSize;
     };
     var normalizePixelSize = function (value, cell, getter, setter) {
-      var number = parseInt(value, 10);
+      var number = parseFloat(value);
       return endsWith(value, '%') && name(cell) !== 'table' ? convert(cell, number, getter, setter) : number;
     };
     var getTotalHeight = function (cell) {
@@ -2834,57 +2858,24 @@
       var span = getSpan(cell, type);
       return v / span;
     };
-    var getRawWidth$1 = function (element) {
-      var cssWidth = getRaw$2(element, 'width');
-      return cssWidth.fold(function () {
-        return Optional.from(get$b(element, 'width'));
-      }, function (width) {
-        return Optional.some(width);
+    var getRaw$1 = function (element, prop) {
+      return getRaw$2(element, prop).orThunk(function () {
+        return getOpt(element, prop).map(function (val) {
+          return val + 'px';
+        });
       });
     };
-    var normalizePercentageWidth = function (cellWidth, tableSize) {
-      return cellWidth / tableSize.pixelWidth() * 100;
-    };
-    var choosePercentageSize = function (element, width, tableSize) {
-      var percentMatch = rPercentageBasedSizeRegex.exec(width);
-      if (percentMatch !== null) {
-        return parseFloat(percentMatch[1]);
-      } else {
-        var intWidth = getWidth(element);
-        return normalizePercentageWidth(intWidth, tableSize);
-      }
-    };
-    var getPercentageWidth = function (cell, tableSize) {
-      var width = getRawWidth$1(cell);
-      return width.fold(function () {
-        var intWidth = get$8(cell);
-        return normalizePercentageWidth(intWidth, tableSize);
-      }, function (w) {
-        return choosePercentageSize(cell, w, tableSize);
-      });
+    var getRawWidth$1 = function (element) {
+      return getRaw$1(element, 'width');
     };
-    var normalizePixelWidth = function (cellWidth, tableSize) {
-      return cellWidth / 100 * tableSize.pixelWidth();
+    var getRawHeight = function (element) {
+      return getRaw$1(element, 'height');
     };
-    var choosePixelSize = function (element, width, tableSize) {
-      var pixelMatch = rPixelBasedSizeRegex.exec(width);
-      if (pixelMatch !== null) {
-        return parseInt(pixelMatch[1], 10);
-      }
-      var percentMatch = rPercentageBasedSizeRegex.exec(width);
-      if (percentMatch !== null) {
-        var floatWidth = parseFloat(percentMatch[1]);
-        return normalizePixelWidth(floatWidth, tableSize);
-      }
-      return getWidth(element);
+    var getPercentageWidth = function (cell) {
+      return getPercentSize(cell, get$8, getInner);
     };
-    var getPixelWidth$1 = function (cell, tableSize) {
-      var width = getRawWidth$1(cell);
-      return width.fold(function () {
-        return getWidth(cell);
-      }, function (w) {
-        return choosePixelSize(cell, w, tableSize);
-      });
+    var getPixelWidth$1 = function (cell) {
+      return isCol$2(cell) ? get$8(cell) : getRuntime$1(cell);
     };
     var getHeight = function (cell) {
       return get$6(cell, 'rowspan', getTotalHeight);
@@ -2905,8 +2896,8 @@
     var getPixelTableWidth = function (table) {
       return get$8(table) + 'px';
     };
-    var getPercentTableWidth$1 = function (table) {
-      return getPercentSize(table, get$8) + '%';
+    var getPercentTableWidth = function (table) {
+      return getPercentSize(table, get$8, getInner) + '%';
     };
     var isPercentSizing$1 = function (table) {
       return getRawWidth$1(table).exists(function (size) {
@@ -2922,33 +2913,27 @@
       return getRawWidth$1(table).isNone();
     };
     var percentageBasedSizeRegex = constant(rPercentageBasedSizeRegex);
-    var pixelBasedSizeRegex = constant(rPixelBasedSizeRegex);
 
     var isCol$1 = isTag('col');
-    var getRaw$1 = function (cell, property, getter) {
-      return getRaw$2(cell, property).getOrThunk(function () {
-        return getter(cell) + 'px';
+    var getRawW = function (cell) {
+      return getRawWidth$1(cell).getOrThunk(function () {
+        return getPixelWidth$1(cell) + 'px';
       });
     };
-    var getRawW = function (cell, tableSize) {
-      var fallback = function (e) {
-        return isCol$1(e) ? get$8(e) : getPixelWidth$1(e, tableSize);
-      };
-      return getRaw$1(cell, 'width', fallback);
-    };
     var getRawH = function (cell) {
-      return getRaw$1(cell, 'height', getHeight);
+      return getRawHeight(cell).getOrThunk(function () {
+        return getHeight(cell) + 'px';
+      });
     };
     var justCols = function (warehouse) {
       return map$1(Warehouse.justColumns(warehouse), function (column) {
         return Optional.from(column.element);
       });
     };
-    var hasRawStyle = function (cell, prop) {
-      return getRaw$2(cell, prop).isSome();
-    };
     var isValidColumn = function (cell) {
-      return !isCol$1(cell) || hasRawStyle(cell, 'width');
+      var browser = detect$3().browser;
+      var supportsColWidths = browser.isChrome() || browser.isFirefox();
+      return isCol$1(cell) ? supportsColWidths : true;
     };
     var getDimension = function (cellOpt, index, backups, filter, getter, fallback) {
       return cellOpt.filter(filter).fold(function () {
@@ -2957,10 +2942,8 @@
         return getter(cell);
       });
     };
-    var getWidthFrom = function (warehouse, table, getWidth, fallback, tableSize) {
-      var columnCells = columns(warehouse, function (cell) {
-        return hasRawStyle(cell, 'width');
-      });
+    var getWidthFrom = function (warehouse, table, getWidth, fallback) {
+      var columnCells = columns(warehouse);
       var columns$1 = Warehouse.hasColumns(warehouse) ? justCols(warehouse) : columnCells;
       var backups = [Optional.some(width.edge(table))].concat(map$1(width.positions(columnCells, table), function (pos) {
         return pos.map(function (p) {
@@ -2971,7 +2954,7 @@
       return map$1(columns$1, function (cellOption, c) {
         return getDimension(cellOption, c, backups, colFilter, function (column) {
           if (isValidColumn(column)) {
-            return getWidth(column, tableSize);
+            return getWidth(column);
           } else {
             var cell = bindFrom(columnCells[c], identity);
             return getDimension(cell, c, backups, colFilter, function (cell) {
@@ -2986,8 +2969,8 @@
         return d + 'px';
       }).getOr('');
     };
-    var getRawWidths = function (warehouse, table, tableSize) {
-      return getWidthFrom(warehouse, table, getRawW, getDeduced, tableSize);
+    var getRawWidths = function (warehouse, table) {
+      return getWidthFrom(warehouse, table, getRawW, getDeduced);
     };
     var getPercentageWidths = function (warehouse, table, tableSize) {
       return getWidthFrom(warehouse, table, getPercentageWidth, function (deduced) {
@@ -2996,12 +2979,12 @@
         }, function (cellWidth) {
           return cellWidth / tableSize.pixelWidth() * 100;
         });
-      }, tableSize);
+      });
     };
     var getPixelWidths = function (warehouse, table, tableSize) {
       return getWidthFrom(warehouse, table, getPixelWidth$1, function (deduced) {
         return deduced.getOrThunk(tableSize.minCellWidth);
-      }, tableSize);
+      });
     };
     var getHeightFrom = function (warehouse, table, direction, getHeight, fallback) {
       var rows$1 = rows(warehouse);
@@ -3023,24 +3006,17 @@
       return getHeightFrom(warehouse, table, direction, getRawH, getDeduced);
     };
 
-    var Cell = function (initial) {
-      var value = initial;
-      var get = function () {
-        return value;
-      };
-      var set = function (v) {
-        value = v;
-      };
-      return {
-        get: get,
-        set: set
+    var widthLookup = function (table, getter) {
+      return function () {
+        if (inBody(table)) {
+          return getter(table);
+        } else {
+          return parseFloat(getRaw$2(table, 'width').getOr('0'));
+        }
       };
     };
-
     var noneSize = function (table) {
-      var getWidth = function () {
-        return get$8(table);
-      };
+      var getWidth = widthLookup(table, get$8);
       var zero = constant(0);
       var getWidths = function (warehouse, tableSize) {
         return getPixelWidths(warehouse, table, tableSize);
@@ -3058,32 +3034,32 @@
         label: 'none'
       };
     };
-    var percentageSize = function (initialWidth, table) {
-      var floatWidth = Cell(parseFloat(initialWidth));
-      var pixelWidth = Cell(get$8(table));
+    var percentageSize = function (table) {
+      var getFloatWidth = widthLookup(table, function (elem) {
+        return parseFloat(getPercentTableWidth(elem));
+      });
+      var getWidth = widthLookup(table, get$8);
       var getCellDelta = function (delta) {
-        return delta / pixelWidth.get() * 100;
+        return delta / getWidth() * 100;
       };
       var singleColumnWidth = function (w, _delta) {
         return [100 - w];
       };
       var minCellWidth = function () {
-        return minWidth() / pixelWidth.get() * 100;
+        return minWidth() / getWidth() * 100;
       };
       var adjustTableWidth = function (delta) {
-        var currentWidth = floatWidth.get();
+        var currentWidth = getFloatWidth();
         var change = delta / 100 * currentWidth;
         var newWidth = currentWidth + change;
         setPercentageWidth(table, newWidth);
-        floatWidth.set(newWidth);
-        pixelWidth.set(get$8(table));
       };
       var getWidths = function (warehouse, tableSize) {
         return getPercentageWidths(warehouse, table, tableSize);
       };
       return {
-        width: floatWidth.get,
-        pixelWidth: pixelWidth.get,
+        width: getFloatWidth,
+        pixelWidth: getWidth,
         getWidths: getWidths,
         getCellDelta: getCellDelta,
         singleColumnWidth: singleColumnWidth,
@@ -3094,9 +3070,8 @@
         label: 'percent'
       };
     };
-    var pixelSize = function (initialWidth, table) {
-      var width = Cell(initialWidth);
-      var getWidth = width.get;
+    var pixelSize = function (table) {
+      var getWidth = widthLookup(table, get$8);
       var getCellDelta = identity;
       var singleColumnWidth = function (w, delta) {
         var newNext = Math.max(minWidth(), w + delta);
@@ -3105,7 +3080,6 @@
       var adjustTableWidth = function (delta) {
         var newWidth = getWidth() + delta;
         setPixelWidth(table, newWidth);
-        width.set(newWidth);
       };
       var getWidths = function (warehouse, tableSize) {
         return getPixelWidths(warehouse, table, tableSize);
@@ -3126,15 +3100,10 @@
     var chooseSize = function (element, width) {
       var percentMatch = percentageBasedSizeRegex().exec(width);
       if (percentMatch !== null) {
-        return percentageSize(percentMatch[1], element);
-      }
-      var pixelMatch = pixelBasedSizeRegex().exec(width);
-      if (pixelMatch !== null) {
-        var intWidth = parseInt(pixelMatch[1], 10);
-        return pixelSize(intWidth, element);
+        return percentageSize(element);
+      } else {
+        return pixelSize(element);
       }
-      var fallbackWidth = get$8(element);
-      return pixelSize(fallbackWidth, element);
     };
     var getTableSize = function (table) {
       var width = getRawWidth$1(table);
@@ -3431,6 +3400,7 @@
         row: createRow$1(doc),
         cell: newCell,
         replace: replace$1,
+        colGap: createCol(doc),
         gap: createCell(doc)
       };
     };
@@ -3441,6 +3411,7 @@
         row: createRow$1(doc),
         cell: createCell(doc),
         replace: pasteReplace,
+        colGap: createCol(doc),
         gap: createCell(doc)
       };
     };
@@ -3455,55 +3426,6 @@
       return map$1(nodes, SugarElement.fromDom);
     };
 
-    var fireNewRow = function (editor, row) {
-      return editor.fire('newrow', { node: row });
-    };
-    var fireNewCell = function (editor, cell) {
-      return editor.fire('newcell', { node: cell });
-    };
-    var fireObjectResizeStart = function (editor, target, width, height, origin) {
-      editor.fire('ObjectResizeStart', {
-        target: target,
-        width: width,
-        height: height,
-        origin: origin
-      });
-    };
-    var fireObjectResized = function (editor, target, width, height, origin) {
-      editor.fire('ObjectResized', {
-        target: target,
-        width: width,
-        height: height,
-        origin: origin
-      });
-    };
-    var fireTableSelectionChange = function (editor, cells, start, finish, otherCells) {
-      editor.fire('TableSelectionChange', {
-        cells: cells,
-        start: start,
-        finish: finish,
-        otherCells: otherCells
-      });
-    };
-    var fireTableSelectionClear = function (editor) {
-      editor.fire('TableSelectionClear');
-    };
-    var fireTableModified = function (editor, table, data) {
-      editor.fire('TableModified', __assign(__assign({}, data), { table: table }));
-    };
-    var styleModified = {
-      structure: false,
-      style: true
-    };
-    var structureModified = {
-      structure: true,
-      style: false
-    };
-    var styleAndStructureModified = {
-      structure: true,
-      style: true
-    };
-
     var getNodeName = function (elm) {
       return elm.nodeName.toLowerCase();
     };
@@ -3682,7 +3604,7 @@
         return element.dom.innerText;
       }).join('');
     };
-    var registerEvents = function (editor, selections, actions, cellSelection) {
+    var registerEvents = function (editor, selections, actions) {
       editor.on('BeforeGetContent', function (e) {
         var multiCellContext = function (cells) {
           e.preventDefault();
@@ -3708,11 +3630,8 @@
                 var doc = SugarElement.fromDom(editor.getDoc());
                 var generators = paste$1(doc);
                 var targets = paste(cell, elements[0], generators);
-                actions.pasteCells(table, targets).each(function (data) {
-                  editor.selection.setRng(data.rng);
+                actions.pasteCells(table, targets).each(function () {
                   editor.focus();
-                  cellSelection.clear(table);
-                  fireTableModified(editor, table.dom, data.effect);
                 });
               }
             });
@@ -4221,7 +4140,7 @@
     var getUnit = function (newSize) {
       return validate(newSize).fold(constant('px'), constant('px'), constant('%'));
     };
-    var redistribute = function (table, optWidth, optHeight, tableSize) {
+    var redistribute = function (table, optWidth, optHeight) {
       var warehouse = Warehouse.fromTable(table);
       var rows = warehouse.all;
       var cells = Warehouse.justCells(warehouse);
@@ -4229,7 +4148,7 @@
       optWidth.each(function (newWidth) {
         var widthUnit = getUnit(newWidth);
         var totalWidth = get$8(table);
-        var oldWidths = getRawWidths(warehouse, table, tableSize);
+        var oldWidths = getRawWidths(warehouse, table);
         var nuWidths = redistribute$1(oldWidths, totalWidth, newWidth);
         if (Warehouse.hasColumns(warehouse)) {
           redistributeToColumns(nuWidths, columns, widthUnit);
@@ -4250,7 +4169,6 @@
     var isPercentSizing = isPercentSizing$1;
     var isPixelSizing = isPixelSizing$1;
     var isNoneSizing = isNoneSizing$1;
-    var getPercentTableWidth = getPercentTableWidth$1;
 
     var getGridSize = function (table) {
       var warehouse = Warehouse.fromTable(table);
@@ -5097,6 +5015,55 @@
     };
     var TableResize = { create: create$3 };
 
+    var fireNewRow = function (editor, row) {
+      return editor.fire('newrow', { node: row });
+    };
+    var fireNewCell = function (editor, cell) {
+      return editor.fire('newcell', { node: cell });
+    };
+    var fireObjectResizeStart = function (editor, target, width, height, origin) {
+      editor.fire('ObjectResizeStart', {
+        target: target,
+        width: width,
+        height: height,
+        origin: origin
+      });
+    };
+    var fireObjectResized = function (editor, target, width, height, origin) {
+      editor.fire('ObjectResized', {
+        target: target,
+        width: width,
+        height: height,
+        origin: origin
+      });
+    };
+    var fireTableSelectionChange = function (editor, cells, start, finish, otherCells) {
+      editor.fire('TableSelectionChange', {
+        cells: cells,
+        start: start,
+        finish: finish,
+        otherCells: otherCells
+      });
+    };
+    var fireTableSelectionClear = function (editor) {
+      editor.fire('TableSelectionClear');
+    };
+    var fireTableModified = function (editor, table, data) {
+      editor.fire('TableModified', __assign(__assign({}, data), { table: table }));
+    };
+    var styleModified = {
+      structure: false,
+      style: true
+    };
+    var structureModified = {
+      structure: true,
+      style: false
+    };
+    var styleAndStructureModified = {
+      structure: true,
+      style: true
+    };
+
     var defaultTableToolbar = 'tableprops tabledelete | tableinsertrowbefore tableinsertrowafter tabledeleterow | tableinsertcolbefore tableinsertcolafter tabledeletecol';
     var defaultStyles = {
       'border-collapse': 'collapse',
@@ -5127,9 +5094,12 @@
       };
     });
     var determineDefaultStyles = function (editor) {
+      var _a;
       if (isPixelsForced(editor)) {
-        var editorWidth = editor.getBody().offsetWidth;
-        return __assign(__assign({}, defaultStyles), { width: editorWidth + 'px' });
+        var dom = editor.dom;
+        var parentBlock = (_a = dom.getParent(editor.selection.getStart(), dom.isBlock)) !== null && _a !== void 0 ? _a : editor.getBody();
+        var contentWidth = getInner(SugarElement.fromDom(parentBlock));
+        return __assign(__assign({}, defaultStyles), { width: contentWidth + 'px' });
       } else if (isResponsiveForced(editor)) {
         return filter$1(defaultStyles, function (_value, key) {
           return key !== 'width';
@@ -5260,12 +5230,9 @@
 
     var get$4 = function (editor, table) {
       if (isPercentagesForced(editor)) {
-        var width = getRawWidth(editor, table.dom).filter(isPercentage$1).getOrThunk(function () {
-          return getPercentTableWidth(table);
-        });
-        return TableSize.percentageSize(width, table);
+        return TableSize.percentageSize(table);
       } else if (isPixelsForced(editor)) {
-        return TableSize.pixelSize(get$8(table), table);
+        return TableSize.pixelSize(table);
       } else {
         return TableSize.getTableSize(table);
       }
@@ -5274,14 +5241,14 @@
     var cleanupLegacyAttributes = function (element) {
       remove$7(element, 'width');
     };
-    var convertToPercentSize = function (table, tableSize) {
-      var newWidth = getPercentTableWidth$1(table);
-      redistribute(table, Optional.some(newWidth), Optional.none(), tableSize);
+    var convertToPercentSize = function (table) {
+      var newWidth = getPercentTableWidth(table);
+      redistribute(table, Optional.some(newWidth), Optional.none());
       cleanupLegacyAttributes(table);
     };
-    var convertToPixelSize = function (table, tableSize) {
+    var convertToPixelSize = function (table) {
       var newWidth = getPixelTableWidth(table);
-      redistribute(table, Optional.some(newWidth), Optional.none(), tableSize);
+      redistribute(table, Optional.some(newWidth), Optional.none());
       cleanupLegacyAttributes(table);
     };
     var convertToNoneSize = function (table) {
@@ -5295,14 +5262,8 @@
       cleanupLegacyAttributes(table);
     };
 
-    var enforcePercentage = function (editor, table) {
-      var tableSizing = get$4(editor, table);
-      convertToPercentSize(table, tableSizing);
-    };
-    var enforcePixels = function (editor, table) {
-      var tableSizing = get$4(editor, table);
-      convertToPixelSize(table, tableSizing);
-    };
+    var enforcePercentage = convertToPercentSize;
+    var enforcePixels = convertToPixelSize;
     var enforceNone = convertToNoneSize;
     var syncPixels = function (table) {
       var warehouse = Warehouse.fromTable(table);
@@ -5368,7 +5329,7 @@
       var afterCornerResize = function (table, origin, width) {
         var isRightEdgeResize = endsWith(origin, 'e');
         if (startRawW === '') {
-          enforcePercentage(editor, table);
+          enforcePercentage(table);
         }
         if (width !== startW && startRawW !== '') {
           set$1(table, 'width', startRawW);
@@ -5429,12 +5390,12 @@
             editor.dom.addClass(clone, 'mce-' + getColumnResizingBehaviour(editor) + '-columns');
           });
           if (!isPixelSizing(table) && isPixelsForced(editor)) {
-            enforcePixels(editor, table);
+            enforcePixels(table);
           } else if (!isPercentSizing(table) && isPercentagesForced(editor)) {
-            enforcePercentage(editor, table);
+            enforcePercentage(table);
           }
           if (isNoneSizing(table) && startsWith(e.origin, barResizerPrefix)) {
-            enforcePercentage(editor, table);
+            enforcePercentage(table);
           }
           startW = e.width;
           startRawW = isResponsiveForced(editor) ? '' : getRawWidth(editor, targetElm).getOr('');
@@ -5521,7 +5482,12 @@
       }
     };
 
-    var isTableHeaderCell = isTag('th');
+    var isHeaderCell = isTag('th');
+    var isHeaderCells = function (cells) {
+      return forall(cells, function (cell) {
+        return isHeaderCell(cell.element);
+      });
+    };
     var getRowHeaderType = function (isHeaderRow, isHeaderCells) {
       if (isHeaderRow && isHeaderCells) {
         return 'sectionCells';
@@ -5547,7 +5513,7 @@
     };
     var findCommonCellType = function (cells) {
       var headerCells = filter$2(cells, function (cell) {
-        return isTableHeaderCell(cell.element);
+        return isHeaderCell(cell.element);
       });
       if (headerCells.length === 0) {
         return Optional.some('td');
@@ -5775,13 +5741,13 @@
       return index.getOr(xs.length);
     };
     var subgrid = function (grid, row, column, comparator) {
-      var restOfRow = getRow(grid, row).cells.slice(column);
-      var endColIndex = findDiff(restOfRow, comparator);
-      var restOfColumn = getColumn(grid, column).slice(row);
-      var endRowIndex = findDiff(restOfColumn, comparator);
+      var gridRow = getRow(grid, row);
+      var isColRow = gridRow.section === 'colgroup';
+      var colspan = findDiff(gridRow.cells.slice(column), comparator);
+      var rowspan = isColRow ? 1 : findDiff(getColumn(grid.slice(row), column), comparator);
       return {
-        colspan: endColIndex,
-        rowspan: endRowIndex
+        colspan: colspan,
+        rowspan: rowspan
       };
     };
 
@@ -5812,10 +5778,16 @@
     var toGrid = function (warehouse, generators, isNew) {
       var grid = [];
       each$2(warehouse.colgroups, function (colgroup) {
-        var cols = map$1(colgroup.columns, function (column) {
-          return elementnew(column.element, isNew, false);
-        });
-        grid.push(rowcells(colgroup.element, cols, 'colgroup', isNew));
+        var colgroupCols = [];
+        for (var columnIndex = 0; columnIndex < warehouse.grid.columns; columnIndex++) {
+          var element = Warehouse.getColumnAt(warehouse, columnIndex).map(function (column) {
+            return elementnew(column.element, isNew, false);
+          }).getOrThunk(function () {
+            return elementnew(generators.colGap(), true, false);
+          });
+          colgroupCols.push(element);
+        }
+        grid.push(rowcells(colgroup.element, colgroupCols, 'colgroup', isNew));
       });
       for (var rowIndex = 0; rowIndex < warehouse.grid.rows; rowIndex++) {
         var rowCells = [];
@@ -6346,51 +6318,125 @@
       return cols.concat(rows.slice(0, start)).concat(rows.slice(finish + 1));
     };
 
+    var notInStartRow = function (grid, rowIndex, colIndex, comparator) {
+      return getCellElement(grid[rowIndex], colIndex) !== undefined && (rowIndex > 0 && comparator(getCellElement(grid[rowIndex - 1], colIndex), getCellElement(grid[rowIndex], colIndex)));
+    };
+    var notInStartColumn = function (row, index, comparator) {
+      return index > 0 && comparator(getCellElement(row, index - 1), getCellElement(row, index));
+    };
+    var isDuplicatedCell = function (grid, rowIndex, colIndex, comparator) {
+      return notInStartRow(grid, rowIndex, colIndex, comparator) || notInStartColumn(grid[rowIndex], colIndex, comparator);
+    };
+    var rowReplacerPredicate = function (targetRow, columnHeaders) {
+      var entireTableIsHeader = forall(columnHeaders, identity) && isHeaderCells(targetRow.cells);
+      return entireTableIsHeader ? always : function (cell, _rowIndex, colIndex) {
+        var type = name(cell.element);
+        return !(type === 'th' && columnHeaders[colIndex]);
+      };
+    };
+    var columnReplacePredicate = function (targetColumn, rowHeaders) {
+      var entireTableIsHeader = forall(rowHeaders, identity) && isHeaderCells(targetColumn);
+      return entireTableIsHeader ? always : function (cell, rowIndex, _colIndex) {
+        var type = name(cell.element);
+        return !(type === 'th' && rowHeaders[rowIndex]);
+      };
+    };
+    var determineScope = function (applyScope, element, newScope, isInHeader) {
+      var hasSpan = function (scope) {
+        return scope === 'row' ? hasRowspan(element) : hasColspan(element);
+      };
+      var getScope = function (scope) {
+        return hasSpan(scope) ? scope + 'group' : scope;
+      };
+      if (applyScope) {
+        return isHeaderCell(element) ? getScope(newScope) : null;
+      } else if (isInHeader && isHeaderCell(element)) {
+        var oppositeScope = newScope === 'row' ? 'col' : 'row';
+        return getScope(oppositeScope);
+      } else {
+        return null;
+      }
+    };
+    var rowScopeGenerator = function (applyScope, columnHeaders) {
+      return function (cell, rowIndex, columnIndex) {
+        return Optional.some(determineScope(applyScope, cell.element, 'col', columnHeaders[columnIndex]));
+      };
+    };
+    var columnScopeGenerator = function (applyScope, rowHeaders) {
+      return function (cell, rowIndex) {
+        return Optional.some(determineScope(applyScope, cell.element, 'row', rowHeaders[rowIndex]));
+      };
+    };
     var replace = function (cell, comparator, substitute) {
       return elementnew(substitute(cell.element, comparator), true, cell.isLocked);
     };
-    var replaceIn = function (grid, targets, comparator, substitute, replacer) {
+    var replaceIn = function (grid, targets, comparator, substitute, replacer, genScope, shouldReplace) {
       var isTarget = function (cell) {
         return exists(targets, function (target) {
           return comparator(cell.element, target.element);
         });
       };
-      return map$1(grid, function (row) {
-        return mapCells(row, function (cell) {
-          return isTarget(cell) ? replacer(cell, comparator, substitute) : cell;
+      return map$1(grid, function (row, rowIndex) {
+        return mapCells(row, function (cell, colIndex) {
+          if (isTarget(cell)) {
+            var newCell_1 = shouldReplace(cell, rowIndex, colIndex) ? replacer(cell, comparator, substitute) : cell;
+            genScope(newCell_1, rowIndex, colIndex).each(function (scope) {
+              setOptions(newCell_1.element, { scope: Optional.from(scope) });
+            });
+            return newCell_1;
+          } else {
+            return cell;
+          }
         });
       });
     };
-    var notStartRow = function (grid, rowIndex, colIndex, comparator) {
-      return getCellElement(grid[rowIndex], colIndex) !== undefined && (rowIndex > 0 && comparator(getCellElement(grid[rowIndex - 1], colIndex), getCellElement(grid[rowIndex], colIndex)));
+    var getColumnCells = function (rows, columnIndex, comparator) {
+      return bind$2(rows, function (row, i) {
+        return isDuplicatedCell(rows, i, columnIndex, comparator) ? [] : [getCell(row, columnIndex)];
+      });
     };
-    var notStartColumn = function (row, index, comparator) {
-      return index > 0 && comparator(getCellElement(row, index - 1), getCellElement(row, index));
+    var getRowCells = function (rows, rowIndex, comparator) {
+      var targetRow = rows[rowIndex];
+      return bind$2(targetRow.cells, function (item, i) {
+        return isDuplicatedCell(rows, rowIndex, i, comparator) ? [] : [item];
+      });
     };
-    var replaceColumn = function (grid, index, comparator, substitution) {
+    var replaceColumns = function (grid, indexes, applyScope, comparator, substitution) {
       var rows = extractGridDetails(grid).rows;
-      var targets = bind$2(rows, function (row, i) {
-        var alreadyAdded = notStartRow(rows, i, index, comparator) || notStartColumn(row, index, comparator);
-        return alreadyAdded ? [] : [getCell(row, index)];
+      var targets = bind$2(indexes, function (index) {
+        return getColumnCells(rows, index, comparator);
+      });
+      var rowHeaders = map$1(grid, function (row) {
+        return isHeaderCells(row.cells);
       });
-      return replaceIn(grid, targets, comparator, substitution, replace);
+      var shouldReplaceCell = columnReplacePredicate(targets, rowHeaders);
+      var scopeGenerator = columnScopeGenerator(applyScope, rowHeaders);
+      return replaceIn(grid, targets, comparator, substitution, replace, scopeGenerator, shouldReplaceCell);
     };
-    var replaceRow = function (grid, index, section, comparator, substitution, tableSection) {
+    var replaceRows = function (grid, indexes, section, applyScope, comparator, substitution, tableSection) {
       var _a = extractGridDetails(grid), cols = _a.cols, rows = _a.rows;
-      var targetRow = rows[index];
-      var targets = bind$2(targetRow.cells, function (item, i) {
-        var alreadyAdded = notStartRow(rows, index, i, comparator) || notStartColumn(targetRow, i, comparator);
-        return alreadyAdded ? [] : [item];
+      var targetRow = rows[indexes[0]];
+      var targets = bind$2(indexes, function (index) {
+        return getRowCells(rows, index, comparator);
+      });
+      var columnHeaders = map$1(targetRow.cells, function (_cell, index) {
+        return isHeaderCells(getColumnCells(rows, index, comparator));
+      });
+      var newRows = __spreadArray([], rows, true);
+      each$2(indexes, function (index) {
+        newRows[index] = tableSection.transformRow(rows[index], section);
       });
-      var newRows = __spreadArray([], rows);
-      newRows[index] = tableSection.transformRow(targetRow, section);
-      return replaceIn(cols.concat(newRows), targets, comparator, substitution, tableSection.transformCell);
+      var newGrid = cols.concat(newRows);
+      var shouldReplaceCell = rowReplacerPredicate(targetRow, columnHeaders);
+      var scopeGenerator = rowScopeGenerator(applyScope, columnHeaders);
+      return replaceIn(newGrid, targets, comparator, substitution, tableSection.transformCell, scopeGenerator, shouldReplaceCell);
     };
-    var replaceCell = function (grid, rowIndex, columnIndex, comparator, substitution) {
+    var replaceCells = function (grid, details, comparator, substitution) {
       var rows = extractGridDetails(grid).rows;
-      var targetRow = rows[rowIndex];
-      var targetCell = getCell(targetRow, columnIndex);
-      return replaceIn(grid, [targetCell], comparator, substitution, replace);
+      var targetCells = map$1(details, function (detail) {
+        return getCell(rows[detail.row], detail.column);
+      });
+      return replaceIn(grid, targetCells, comparator, substitution, replace, Optional.none, always);
     };
 
     var uniqueColumns = function (details) {
@@ -6451,7 +6497,7 @@
       };
       return { getOrInit: getOrInit };
     };
-    var transform = function (tag, scope) {
+    var transform = function (tag) {
       return function (generators) {
         var list = [];
         var find = function (element, comparator) {
@@ -6460,7 +6506,7 @@
           });
         };
         var makeNew = function (element) {
-          var attrs = isUndefined(scope) ? {} : { scope: scope };
+          var attrs = tag === 'td' ? { scope: null } : {};
           var cell = generators.replace(element, tag, attrs);
           list.push({
             item: element,
@@ -6745,48 +6791,42 @@
       return bundle(newGrid, details[0].row, targetIndex);
     };
     var opMakeColumnsHeader = function (initialGrid, details, comparator, genWrappers) {
-      var replacer = function (currentGrid, column) {
-        return replaceColumn(currentGrid, column.column, comparator, genWrappers.replaceOrInit);
-      };
       var columns = uniqueColumns(details);
-      var newGrid = foldl(columns, replacer, initialGrid);
+      var columnIndexes = map$1(columns, function (detail) {
+        return detail.column;
+      });
+      var newGrid = replaceColumns(initialGrid, columnIndexes, true, comparator, genWrappers.replaceOrInit);
       return bundle(newGrid, details[0].row, details[0].column);
     };
     var opMakeCellsHeader = function (initialGrid, details, comparator, genWrappers) {
-      var replacer = function (currentGrid, detail) {
-        return replaceCell(currentGrid, detail.row, detail.column, comparator, genWrappers.replaceOrInit);
-      };
-      var newGrid = foldl(details, replacer, initialGrid);
+      var newGrid = replaceCells(initialGrid, details, comparator, genWrappers.replaceOrInit);
       return bundle(newGrid, details[0].row, details[0].column);
     };
     var opUnmakeColumnsHeader = function (initialGrid, details, comparator, genWrappers) {
-      var replacer = function (currentGrid, column) {
-        return replaceColumn(currentGrid, column.column, comparator, genWrappers.replaceOrInit);
-      };
       var columns = uniqueColumns(details);
-      var newGrid = foldl(columns, replacer, initialGrid);
+      var columnIndexes = map$1(columns, function (detail) {
+        return detail.column;
+      });
+      var newGrid = replaceColumns(initialGrid, columnIndexes, false, comparator, genWrappers.replaceOrInit);
       return bundle(newGrid, details[0].row, details[0].column);
     };
     var opUnmakeCellsHeader = function (initialGrid, details, comparator, genWrappers) {
-      var replacer = function (currentGrid, detail) {
-        return replaceCell(currentGrid, detail.row, detail.column, comparator, genWrappers.replaceOrInit);
-      };
-      var newGrid = foldl(details, replacer, initialGrid);
+      var newGrid = replaceCells(initialGrid, details, comparator, genWrappers.replaceOrInit);
       return bundle(newGrid, details[0].row, details[0].column);
     };
-    var makeRowsSection = function (section) {
+    var makeRowsSection = function (section, applyScope) {
       return function (initialGrid, details, comparator, genWrappers, tableSection) {
-        var replacer = function (currentGrid, detail) {
-          return replaceRow(currentGrid, detail.row, section, comparator, genWrappers.replaceOrInit, tableSection);
-        };
         var rows = uniqueRows(details);
-        var newGrid = foldl(rows, replacer, initialGrid);
+        var rowIndexes = map$1(rows, function (detail) {
+          return detail.row;
+        });
+        var newGrid = replaceRows(initialGrid, rowIndexes, section, applyScope, comparator, genWrappers.replaceOrInit, tableSection);
         return bundle(newGrid, details[0].row, details[0].column);
       };
     };
-    var opMakeRowsHeader = makeRowsSection('thead');
-    var opMakeRowsBody = makeRowsSection('tbody');
-    var opMakeRowsFooter = makeRowsSection('tfoot');
+    var opMakeRowsHeader = makeRowsSection('thead', true);
+    var opMakeRowsBody = makeRowsSection('tbody', false);
+    var opMakeRowsFooter = makeRowsSection('tfoot', false);
     var opEraseColumns = function (grid, extractDetail, _comparator, _genWrappers) {
       var columns = uniqueColumns(extractDetail.details);
       var newGrid = deleteColumnsAt(grid, map$1(columns, function (column) {
@@ -6950,19 +6990,21 @@
         });
       };
     };
+    var headerCellGenerator = Generators.transform('th');
+    var bodyCellGenerator = Generators.transform('td');
     var insertRowsBefore = run(opInsertRowsBefore, onCells, noop, noop, Generators.modification);
     var insertRowsAfter = run(opInsertRowsAfter, onCells, noop, noop, Generators.modification);
     var insertColumnsBefore = run(opInsertColumnsBefore, insertColumnsExtractor(true), adjustAndRedistributeWidths, noop, Generators.modification);
     var insertColumnsAfter = run(opInsertColumnsAfter, insertColumnsExtractor(false), adjustAndRedistributeWidths, noop, Generators.modification);
     var eraseColumns = run(opEraseColumns, eraseColumnsExtractor, adjustAndRedistributeWidths, prune, Generators.modification);
     var eraseRows = run(opEraseRows, onCells, noop, prune, Generators.modification);
-    var makeColumnsHeader = run(opMakeColumnsHeader, onUnlockedCells, noop, noop, Generators.transform('th', 'row'));
-    var unmakeColumnsHeader = run(opUnmakeColumnsHeader, onUnlockedCells, noop, noop, Generators.transform('td', null));
-    var makeRowsHeader = run(opMakeRowsHeader, onUnlockedCells, noop, noop, Generators.transform('th', 'col'));
-    var makeRowsBody = run(opMakeRowsBody, onUnlockedCells, noop, noop, Generators.transform('td', null));
-    var makeRowsFooter = run(opMakeRowsFooter, onUnlockedCells, noop, noop, Generators.transform('td', null));
-    var makeCellsHeader = run(opMakeCellsHeader, onUnlockedCells, noop, noop, Generators.transform('th'));
-    var unmakeCellsHeader = run(opUnmakeCellsHeader, onUnlockedCells, noop, noop, Generators.transform('td'));
+    var makeColumnsHeader = run(opMakeColumnsHeader, onUnlockedCells, noop, noop, headerCellGenerator);
+    var unmakeColumnsHeader = run(opUnmakeColumnsHeader, onUnlockedCells, noop, noop, bodyCellGenerator);
+    var makeRowsHeader = run(opMakeRowsHeader, onUnlockedCells, noop, noop, headerCellGenerator);
+    var makeRowsBody = run(opMakeRowsBody, onUnlockedCells, noop, noop, bodyCellGenerator);
+    var makeRowsFooter = run(opMakeRowsFooter, onUnlockedCells, noop, noop, bodyCellGenerator);
+    var makeCellsHeader = run(opMakeCellsHeader, onUnlockedCells, noop, noop, headerCellGenerator);
+    var unmakeCellsHeader = run(opUnmakeCellsHeader, onUnlockedCells, noop, noop, bodyCellGenerator);
     var mergeCells = run(opMergeCells, onUnlockedMergable, resize, noop, Generators.merging);
     var unmergeCells = run(opUnmergeCells, onUnlockedUnmergable, resize, noop, Generators.merging);
     var pasteCells = run(opPasteCells, onPaste, resize, noop, Generators.modification);
@@ -6974,7 +7016,7 @@
     var getCellsType = opGetCellsType;
     var getRowsType = opGetRowsType;
 
-    var TableActions = function (editor, lazyWire) {
+    var TableActions = function (editor, cellSelection, lazyWire) {
       var isTableBody = function (editor) {
         return name(getBody(editor)) === 'table';
       };
@@ -6998,8 +7040,32 @@
           return TableSection.getTableSectionType(table, 'section');
         }
       };
+      var setSelectionFromAction = function (table, result) {
+        return result.cursor.fold(function () {
+          var cells = cells$1(table);
+          return head(cells).filter(inBody).map(function (firstCell) {
+            cellSelection.clear(table);
+            var rng = editor.dom.createRng();
+            rng.selectNode(firstCell.dom);
+            editor.selection.setRng(rng);
+            set$2(firstCell, 'data-mce-selected', '1');
+            return rng;
+          });
+        }, function (cell) {
+          var des = freefallRtl(cell);
+          var rng = editor.dom.createRng();
+          rng.setStart(des.element.dom, des.offset);
+          rng.setEnd(des.element.dom, des.offset);
+          editor.selection.setRng(rng);
+          cellSelection.clear(table);
+          return Optional.some(rng);
+        });
+      };
       var execute = function (operation, guard, mutate, lazyWire, effect) {
-        return function (table, target) {
+        return function (table, target, noEvents) {
+          if (noEvents === void 0) {
+            noEvents = false;
+          }
           removeDataStyle(table);
           var wire = lazyWire();
           var doc = SugarElement.fromDom(editor.getDoc());
@@ -7016,11 +7082,14 @@
             each$2(result.newCells, function (cell) {
               fireNewCell(editor, cell.dom);
             });
-            return result.cursor.map(function (cell) {
-              var des = freefallRtl(cell);
-              var rng = editor.dom.createRng();
-              rng.setStart(des.element.dom, des.offset);
-              rng.setEnd(des.element.dom, des.offset);
+            var range = setSelectionFromAction(table, result);
+            if (inBody(table)) {
+              removeDataStyle(table);
+              if (!noEvents) {
+                fireTableModified(editor, table.dom, effect);
+              }
+            }
+            return range.map(function (rng) {
               return {
                 rng: rng,
                 effect: effect
@@ -7195,11 +7264,11 @@
       });
       return descendant(getBody(editor), 'table[data-mce-id="__mce"]').map(function (table) {
         if (isPixelsForced(editor)) {
-          enforcePixels(editor, table);
+          enforcePixels(table);
         } else if (isResponsiveForced(editor)) {
           enforceNone(table);
         } else if (isPercentagesForced(editor) || isPercentage(defaultStyles.width)) {
-          enforcePercentage(editor, table);
+          enforcePercentage(table);
         }
         removeDataStyle(table);
         remove$7(table, 'data-mce-id');
@@ -7313,7 +7382,7 @@
         var maxColRange = lastSelectedCell.column + lastSelectedCell.colspan;
         var fakeColGroups = generateColGroup(house, minColRange, maxColRange);
         var fakeRows = generateRows(house, minColRange, maxColRange);
-        return __spreadArray(__spreadArray([], fakeColGroups), fakeRows);
+        return __spreadArray(__spreadArray([], fakeColGroups, true), fakeRows, true);
       });
     };
 
@@ -7472,6 +7541,20 @@
       });
     };
 
+    var Cell = function (initial) {
+      var value = initial;
+      var get = function () {
+        return value;
+      };
+      var set = function (v) {
+        value = v;
+      };
+      return {
+        get: get,
+        set: set
+      };
+    };
+
     var singleton = function (doRevoke) {
       var subject = Cell(Optional.none());
       var revoke = function () {
@@ -8561,9 +8644,9 @@
           if (!isForcedSizing) {
             table(cellOrCaption, isRoot).each(function (table) {
               if (sizing === 'relative' && !isPercentSizing(table)) {
-                enforcePercentage(editor, table);
+                enforcePercentage(table);
               } else if (sizing === 'fixed' && !isPixelSizing(table)) {
-                enforcePixels(editor, table);
+                enforcePixels(table);
               } else if (sizing === 'responsive' && !isNoneSizing(table)) {
                 enforceNone(table);
               }
@@ -8622,19 +8705,8 @@
           });
         });
       };
-      var postExecute = function (table, noEvents) {
-        if (noEvents === void 0) {
-          noEvents = false;
-        }
-        return function (data) {
-          editor.selection.setRng(data.rng);
-          editor.focus();
-          cellSelection.clear(table);
-          removeDataStyle(table);
-          if (!noEvents) {
-            fireTableModified(editor, table.dom, data.effect);
-          }
-        };
+      var postExecute = function (_data) {
+        editor.focus();
       };
       var actOnSelection = function (execute, noEvents) {
         if (noEvents === void 0) {
@@ -8642,7 +8714,7 @@
         }
         return performActionOnSelection(function (table, startCell) {
           var targets = forMenu(selections, table, startCell);
-          execute(table, targets).each(postExecute(table, noEvents));
+          execute(table, targets, noEvents).each(postExecute);
         });
       };
       var copyRowSelection = function () {
@@ -8666,7 +8738,7 @@
           performActionOnSelection(function (table, startCell) {
             var generators = paste$1(SugarElement.fromDom(editor.getDoc()));
             var targets = pasteRows(selections, startCell, clonedRows, generators);
-            execute(table, targets).each(postExecute(table));
+            execute(table, targets).each(postExecute);
           });
         });
       };
@@ -10367,6 +10439,9 @@
         var keycode = realEvent.which;
         var shiftKey = realEvent.shiftKey === true;
         var handler = retrieve$1(container, annotations.selectedSelector).fold(function () {
+          if (isNavigation(keycode) && !shiftKey) {
+            annotations.clearBeforeUpdate(container);
+          }
           if (isDown(keycode) && shiftKey) {
             return curry(select, bridge, container, isRoot, down, finish, start, annotations.selectRange);
           } else if (isUp(keycode) && shiftKey) {
@@ -10410,7 +10485,7 @@
               rc(0, +1),
               rc(+1, 0)
             ]);
-          } else if (isNavigation(keycode) && shiftKey === false) {
+          } else if (isNavigation(keycode) && !shiftKey) {
             return clearToNavigate;
           } else {
             return Optional.none;
@@ -10423,7 +10498,7 @@
           var realEvent = event.raw;
           var keycode = realEvent.which;
           var shiftKey = realEvent.shiftKey === true;
-          if (shiftKey === false) {
+          if (!shiftKey) {
             return Optional.none();
           }
           if (isNavigation(keycode)) {
@@ -10508,7 +10583,7 @@
         onClear();
       };
       var clearBeforeUpdate = function (container) {
-        var sels = descendants(container, ephemera.selectedSelector);
+        var sels = descendants(container, ephemera.selectedSelector + ',' + ephemera.firstSelectedSelector + ',' + ephemera.lastSelectedSelector);
         each$2(sels, removeSelectionAttributes);
       };
       var selectRange = function (container, cells, start, finish) {
@@ -11402,11 +11477,11 @@
       var selectionTargets = getSelectionTargets(editor, selections);
       var resizeHandler = getResizeHandler(editor);
       var cellSelection = CellSelection(editor, resizeHandler.lazyResize, selectionTargets);
-      var actions = TableActions(editor, resizeHandler.lazyWire);
+      var actions = TableActions(editor, cellSelection, resizeHandler.lazyWire);
       var clipboard = Clipboard();
       registerCommands(editor, actions, cellSelection, selections, clipboard);
       registerQueryCommands(editor, actions, selections);
-      registerEvents(editor, selections, actions, cellSelection);
+      registerEvents(editor, selections, actions);
       addMenuItems(editor, selections, selectionTargets, clipboard);
       addButtons(editor, selections, selectionTargets, clipboard);
       addToolbars(editor);