roosterjs-content-model-plugins 9.43.0 → 9.45.0

package/lib/tableEdit/editors/features/CellResizer.js

@@ -1,211 +1,247 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.onDraggingVertical = exports.onDraggingHorizontal = exports.onDragStart = exports.createCellResizer = exports.VERTICAL_RESIZER_ID = exports.HORIZONTAL_RESIZER_ID = void 0;
-var tslib_1 = require("tslib");
-var createElement_1 = require("../../../pluginUtils/CreateElement/createElement");
-var DragAndDropHelper_1 = require("../../../pluginUtils/DragAndDrop/DragAndDropHelper");
-var getTableFromContentModel_1 = require("../utils/getTableFromContentModel");
-var roosterjs_content_model_dom_1 = require("roosterjs-content-model-dom");
-var CELL_RESIZER_WIDTH = 4;
-/**
- * @internal
- */
-exports.HORIZONTAL_RESIZER_ID = 'horizontalResizer';
-/**
- * @internal
- */
-exports.VERTICAL_RESIZER_ID = 'verticalResizer';
-/**
- * @internal
- */
-function createCellResizer(editor, td, table, isRTL, isHorizontal, onStart, onEnd, anchorContainer, onTableEditorCreated) {
-    var document = td.ownerDocument;
-    var createElementData = {
-        tag: 'div',
-        style: "position: fixed; cursor: " + (isHorizontal ? 'row' : 'col') + "-resize; user-select: none",
-    };
-    var zoomScale = editor.getDOMHelper().calculateZoomScale();
-    var div = (0, createElement_1.createElement)(createElementData, document);
-    (anchorContainer || document.body).appendChild(div);
-    var context = {
-        editor: editor,
-        td: td,
-        table: table,
-        isRTL: isRTL,
-        zoomScale: zoomScale,
-        onStart: onStart,
-        originalWidth: (0, roosterjs_content_model_dom_1.parseValueWithUnit)(table.style.width),
-    };
-    var setPosition = isHorizontal ? setHorizontalPosition : setVerticalPosition;
-    setPosition(context, div);
-    var handler = {
-        onDragStart: onDragStart,
-        // Horizontal modifies row height, vertical modifies column width
-        onDragging: isHorizontal ? onDraggingHorizontal : onDraggingVertical,
-        onDragEnd: onEnd,
-    };
-    var featureHandler = new CellResizer(div, context, setPosition, handler, zoomScale, editor.getEnvironment().isMobileOrTablet, onTableEditorCreated);
-    return { node: td, div: div, featureHandler: featureHandler };
-}
-exports.createCellResizer = createCellResizer;
-var CellResizer = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(CellResizer, _super);
-    function CellResizer(trigger, context, onSubmit, handler, zoomScale, forceMobile, onTableEditorCreated) {
-        var _this = _super.call(this, trigger, context, onSubmit, handler, zoomScale, forceMobile) || this;
-        _this.disposer = onTableEditorCreated === null || onTableEditorCreated === void 0 ? void 0 : onTableEditorCreated('CellResizer', trigger);
-        return _this;
-    }
-    CellResizer.prototype.dispose = function () {
-        var _a;
-        (_a = this.disposer) === null || _a === void 0 ? void 0 : _a.call(this);
-        this.disposer = undefined;
-        _super.prototype.dispose.call(this);
-    };
-    return CellResizer;
-}(DragAndDropHelper_1.DragAndDropHelper));
-/**
- * @internal
- * Exported for testing
- */
-function onDragStart(context, event) {
-    var td = context.td, onStart = context.onStart;
-    var rect = (0, roosterjs_content_model_dom_1.normalizeRect)(td.getBoundingClientRect());
-    // Get cell coordinates
-    var columnIndex = td.cellIndex;
-    var row = td.parentElement && (0, roosterjs_content_model_dom_1.isElementOfType)(td.parentElement, 'tr') ? td.parentElement : undefined;
-    var rowIndex = row === null || row === void 0 ? void 0 : row.rowIndex;
-    if (rowIndex == undefined) {
-        return {
-            cmTable: undefined,
-            anchorColumn: undefined,
-            anchorRow: undefined,
-            anchorRowHeight: -1,
-            allWidths: [],
-        }; // Just a fallback
-    }
-    var editor = context.editor, table = context.table;
-    // Get Table block in content model
-    var cmTable = (0, getTableFromContentModel_1.getCMTableFromTable)(editor, table);
-    if (rect && cmTable) {
-        onStart();
-        return {
-            cmTable: cmTable,
-            anchorColumn: columnIndex,
-            anchorRow: rowIndex,
-            anchorRowHeight: cmTable.rows[rowIndex].height,
-            allWidths: (0, tslib_1.__spreadArray)([], (0, tslib_1.__read)(cmTable.widths), false),
-        };
-    }
-    else {
-        return {
-            cmTable: cmTable,
-            anchorColumn: undefined,
-            anchorRow: undefined,
-            anchorRowHeight: -1,
-            allWidths: [],
-        }; // Just a fallback
-    }
-}
-exports.onDragStart = onDragStart;
-/**
- * @internal
- * Exported for testing
- */
-function onDraggingHorizontal(context, event, initValue, deltaX, deltaY) {
-    var table = context.table;
-    var cmTable = initValue.cmTable, anchorRow = initValue.anchorRow, anchorRowHeight = initValue.anchorRowHeight;
-    // Assign new widths and heights to the CM table
-    if (cmTable && anchorRow != undefined && cmTable.rows[anchorRow] != undefined) {
-        // Modify the CM Table size
-        (0, roosterjs_content_model_dom_1.mutateBlock)(cmTable).rows[anchorRow].height = (anchorRowHeight !== null && anchorRowHeight !== void 0 ? anchorRowHeight : 0) + deltaY;
-        // Normalize the new height value
-        var newHeight = Math.max(cmTable.rows[anchorRow].height, roosterjs_content_model_dom_1.MIN_ALLOWED_TABLE_CELL_HEIGHT);
-        // Writeback CM Table size changes to DOM Table
-        var tableRow = table.rows[anchorRow];
-        for (var col = 0; col < tableRow.cells.length; col++) {
-            var td = tableRow.cells[col];
-            td.style.height = newHeight + 'px';
-            td.style.boxSizing = 'border-box';
-        }
-        return true;
-    }
-    else {
-        return false;
-    }
-}
-exports.onDraggingHorizontal = onDraggingHorizontal;
-/**
- * @internal
- * Exported for testing
- */
-function onDraggingVertical(context, event, initValue, deltaX) {
-    var table = context.table, isRTL = context.isRTL;
-    var cmTable = initValue.cmTable, anchorColumn = initValue.anchorColumn, allWidths = initValue.allWidths;
-    // Assign new widths and heights to the CM table
-    if (cmTable && anchorColumn != undefined) {
-        var mutableTable = (0, roosterjs_content_model_dom_1.mutateBlock)(cmTable);
-        // Modify the CM Table size
-        var lastColumn = anchorColumn == cmTable.widths.length - 1;
-        var change = deltaX * (isRTL ? -1 : 1);
-        // This is the last column
-        if (lastColumn) {
-            // Only the last column changes
-            // Normalize the new width value
-            var newWidth = Math.max(allWidths[anchorColumn] + change, roosterjs_content_model_dom_1.MIN_ALLOWED_TABLE_CELL_WIDTH);
-            mutableTable.widths[anchorColumn] = newWidth;
-        }
-        else {
-            // Any other two columns
-            var anchorChange = allWidths[anchorColumn] + change;
-            var nextAnchorChange = allWidths[anchorColumn + 1] - change;
-            if (anchorChange < roosterjs_content_model_dom_1.MIN_ALLOWED_TABLE_CELL_WIDTH ||
-                nextAnchorChange < roosterjs_content_model_dom_1.MIN_ALLOWED_TABLE_CELL_WIDTH) {
-                return false;
-            }
-            mutableTable.widths[anchorColumn] = anchorChange;
-            mutableTable.widths[anchorColumn + 1] = nextAnchorChange;
-        }
-        // Writeback CM Table size changes to DOM Table
-        for (var row = 0; row < table.rows.length; row++) {
-            var tableRow = table.rows[row];
-            for (var col = 0; col < tableRow.cells.length; col++) {
-                var td = tableRow.cells[col];
-                td.style.width = cmTable.widths[col] + 'px';
-                td.style.boxSizing = 'border-box';
-            }
-        }
-        if (context.originalWidth > 0) {
-            var newWidth = context.originalWidth + change + 'px';
-            mutableTable.format.width = newWidth;
-            table.style.width = newWidth;
-        }
-        return true;
-    }
-    else {
-        return false;
-    }
-}
-exports.onDraggingVertical = onDraggingVertical;
-function setHorizontalPosition(context, trigger) {
-    var td = context.td;
-    var rect = (0, roosterjs_content_model_dom_1.normalizeRect)(td.getBoundingClientRect());
-    if (rect) {
-        trigger.id = exports.HORIZONTAL_RESIZER_ID;
-        trigger.style.top = rect.bottom - CELL_RESIZER_WIDTH + 'px';
-        trigger.style.left = rect.left + 'px';
-        trigger.style.width = rect.right - rect.left + 'px';
-        trigger.style.height = CELL_RESIZER_WIDTH + 'px';
-    }
-}
-function setVerticalPosition(context, trigger) {
-    var td = context.td, isRTL = context.isRTL;
-    var rect = (0, roosterjs_content_model_dom_1.normalizeRect)(td.getBoundingClientRect());
-    if (rect) {
-        trigger.id = exports.VERTICAL_RESIZER_ID;
-        trigger.style.top = rect.top + 'px';
-        trigger.style.left = (isRTL ? rect.left : rect.right) - CELL_RESIZER_WIDTH + 1 + 'px';
-        trigger.style.width = CELL_RESIZER_WIDTH + 'px';
-        trigger.style.height = rect.bottom - rect.top + 'px';
-    }
-}
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.onDraggingVertical = exports.onDraggingHorizontal = exports.onDragStart = exports.createCellResizer = exports.VERTICAL_RESIZER_ID = exports.HORIZONTAL_RESIZER_ID = void 0;
+var tslib_1 = require("tslib");
+var createElement_1 = require("../../../pluginUtils/CreateElement/createElement");
+var DragAndDropHelper_1 = require("../../../pluginUtils/DragAndDrop/DragAndDropHelper");
+var getTableFromContentModel_1 = require("../utils/getTableFromContentModel");
+var roosterjs_content_model_dom_1 = require("roosterjs-content-model-dom");
+var CELL_RESIZER_WIDTH = 4;
+/**
+ * @internal
+ */
+exports.HORIZONTAL_RESIZER_ID = 'horizontalResizer';
+/**
+ * @internal
+ */
+exports.VERTICAL_RESIZER_ID = 'verticalResizer';
+/**
+ * @internal
+ */
+function createCellResizer(editor, td, table, isRTL, isHorizontal, onStart, onEnd, anchorContainer, onTableEditorCreated) {
+    var document = td.ownerDocument;
+    var createElementData = {
+        tag: 'div',
+        style: "position: fixed; cursor: " + (isHorizontal ? 'row' : 'col') + "-resize; user-select: none",
+    };
+    var zoomScale = editor.getDOMHelper().calculateZoomScale();
+    var div = (0, createElement_1.createElement)(createElementData, document);
+    (anchorContainer || document.body).appendChild(div);
+    var context = {
+        editor: editor,
+        td: td,
+        table: table,
+        isRTL: isRTL,
+        zoomScale: zoomScale,
+        onStart: onStart,
+        originalWidth: (0, roosterjs_content_model_dom_1.parseValueWithUnit)(table.style.width),
+    };
+    var setPosition = isHorizontal ? setHorizontalPosition : setVerticalPosition;
+    setPosition(context, div);
+    var handler = {
+        onDragStart: onDragStart,
+        // Horizontal modifies row height, vertical modifies column width
+        onDragging: isHorizontal ? onDraggingHorizontal : onDraggingVertical,
+        onDragEnd: onEnd,
+    };
+    var featureHandler = new CellResizer(div, context, setPosition, handler, zoomScale, editor.getEnvironment().isMobileOrTablet, onTableEditorCreated);
+    return { node: td, div: div, featureHandler: featureHandler };
+}
+exports.createCellResizer = createCellResizer;
+var CellResizer = /** @class */ (function (_super) {
+    (0, tslib_1.__extends)(CellResizer, _super);
+    function CellResizer(trigger, context, onSubmit, handler, zoomScale, forceMobile, onTableEditorCreated) {
+        var _this = _super.call(this, trigger, context, onSubmit, handler, zoomScale, forceMobile) || this;
+        _this.disposer = onTableEditorCreated === null || onTableEditorCreated === void 0 ? void 0 : onTableEditorCreated('CellResizer', trigger);
+        return _this;
+    }
+    CellResizer.prototype.dispose = function () {
+        var _a;
+        (_a = this.disposer) === null || _a === void 0 ? void 0 : _a.call(this);
+        this.disposer = undefined;
+        _super.prototype.dispose.call(this);
+    };
+    return CellResizer;
+}(DragAndDropHelper_1.DragAndDropHelper));
+/**
+ * @internal
+ * Exported for testing
+ */
+function onDragStart(context, event) {
+    var td = context.td, onStart = context.onStart;
+    var rect = (0, roosterjs_content_model_dom_1.normalizeRect)(td.getBoundingClientRect());
+    // Get cell coordinates
+    var rowIndex;
+    var columnIndex;
+    var nextColumnIndex = -1;
+    var editor = context.editor, table = context.table;
+    // Get Table block in content model
+    var cmTable = (0, getTableFromContentModel_1.getCMTableFromTable)(editor, table);
+    if (rect && cmTable) {
+        for (var r = 0; r < (cmTable === null || cmTable === void 0 ? void 0 : cmTable.rows.length); r++) {
+            for (var c = 0; c < cmTable.rows[r].cells.length; c++) {
+                var cell = cmTable.rows[r].cells[c];
+                if (cell.cachedElement == td) {
+                    // Target cell found, record its position
+                    rowIndex = r;
+                    columnIndex = c;
+                }
+                else if (rowIndex != undefined && columnIndex != undefined) {
+                    // rowIndex and columnIndex are already found, we can find nextColumnIndex now
+                    if (!cell.cachedElement) {
+                        // No cached element means this cell is merged, so this could potentially be the right side of column
+                        // We are trying to find the last merged cell so we can modify its width later
+                        columnIndex = c;
+                    }
+                    else {
+                        // Since we already found the target cell, the first cell with cachedElement after that must be the next column
+                        nextColumnIndex = c;
+                        break;
+                    }
+                }
+            }
+            // As long as rowIndex is found, we can break here, no matter if nextColumnIndex is found or not
+            // because for the last column case, nextColumnIndex will be -1
+            if (rowIndex != undefined) {
+                break;
+            }
+        }
+        onStart();
+        if (rowIndex !== undefined) {
+            return {
+                cmTable: cmTable,
+                anchorColumn: columnIndex,
+                nextColumn: nextColumnIndex,
+                anchorRow: rowIndex,
+                anchorRowHeight: cmTable.rows[rowIndex].height,
+                allWidths: (0, tslib_1.__spreadArray)([], (0, tslib_1.__read)(cmTable.widths), false),
+            };
+        }
+    }
+    return {
+        cmTable: cmTable,
+        anchorColumn: undefined,
+        anchorRow: undefined,
+        anchorRowHeight: -1,
+        allWidths: [],
+        nextColumn: -1,
+    }; // Just a fallback
+}
+exports.onDragStart = onDragStart;
+/**
+ * @internal
+ * Exported for testing
+ */
+function onDraggingHorizontal(context, event, initValue, deltaX, deltaY) {
+    var cmTable = initValue.cmTable, anchorRow = initValue.anchorRow, anchorRowHeight = initValue.anchorRowHeight;
+    // Assign new widths and heights to the CM table
+    if (cmTable && anchorRow != undefined && cmTable.rows[anchorRow] != undefined) {
+        // Modify the CM Table size
+        (0, roosterjs_content_model_dom_1.mutateBlock)(cmTable).rows[anchorRow].height = (anchorRowHeight !== null && anchorRowHeight !== void 0 ? anchorRowHeight : 0) + deltaY;
+        // Normalize the new height value
+        var newHeight = Math.max(cmTable.rows[anchorRow].height, roosterjs_content_model_dom_1.MIN_ALLOWED_TABLE_CELL_HEIGHT);
+        // Writeback CM Table size changes to DOM Table
+        var tableRow = cmTable.rows[anchorRow].cells;
+        for (var col = 0; col < tableRow.length; col++) {
+            var td = tableRow[col].cachedElement;
+            if (td) {
+                td.style.height = newHeight + 'px';
+                td.style.boxSizing = 'border-box';
+            }
+        }
+        return true;
+    }
+    else {
+        return false;
+    }
+}
+exports.onDraggingHorizontal = onDraggingHorizontal;
+/**
+ * @internal
+ * Exported for testing
+ */
+function onDraggingVertical(context, event, initValue, deltaX) {
+    var table = context.table, isRTL = context.isRTL;
+    var cmTable = initValue.cmTable, anchorColumn = initValue.anchorColumn, nextColumn = initValue.nextColumn, allWidths = initValue.allWidths;
+    // Assign new widths and heights to the CM table
+    if (cmTable && anchorColumn != undefined) {
+        var mutableTable = (0, roosterjs_content_model_dom_1.mutateBlock)(cmTable);
+        var change = deltaX * (isRTL ? -1 : 1);
+        // This is the last column
+        if (nextColumn == -1) {
+            // Only the last column changes
+            // Normalize the new width value
+            var newWidth = Math.max(allWidths[anchorColumn] + change, roosterjs_content_model_dom_1.MIN_ALLOWED_TABLE_CELL_WIDTH);
+            mutableTable.widths[anchorColumn] = newWidth;
+        }
+        else {
+            // Any other two columns
+            var anchorChange = allWidths[anchorColumn] + change;
+            var nextAnchorChange = allWidths[nextColumn] - change;
+            if (anchorChange < roosterjs_content_model_dom_1.MIN_ALLOWED_TABLE_CELL_WIDTH ||
+                nextAnchorChange < roosterjs_content_model_dom_1.MIN_ALLOWED_TABLE_CELL_WIDTH) {
+                return false;
+            }
+            mutableTable.widths[anchorColumn] = anchorChange;
+            mutableTable.widths[nextColumn] = nextAnchorChange;
+        }
+        // Write back CM Table size changes to DOM Table
+        for (var row = 0; row < cmTable.rows.length; row++) {
+            var tableRow = cmTable.rows[row].cells;
+            var lastTd = null;
+            var lastWidth = 0;
+            for (var col = 0; col < tableRow.length; col++) {
+                var td = tableRow[col].cachedElement;
+                if (td) {
+                    td.style.boxSizing = 'border-box';
+                    lastTd = td;
+                    lastWidth = cmTable.widths[col];
+                }
+                else if (lastTd && tableRow[col].spanLeft) {
+                    lastWidth += cmTable.widths[col];
+                }
+                else if (tableRow[col].spanAbove) {
+                    // For span above case, we don't need to adjust width, just clear lastTd and lastWidth
+                    lastTd = null;
+                    lastWidth = 0;
+                }
+                if (lastTd) {
+                    lastTd.style.width = lastWidth + 'px';
+                }
+            }
+        }
+        if (context.originalWidth > 0) {
+            var newWidth = context.originalWidth + change + 'px';
+            mutableTable.format.width = newWidth;
+            table.style.width = newWidth;
+        }
+        return true;
+    }
+    else {
+        return false;
+    }
+}
+exports.onDraggingVertical = onDraggingVertical;
+function setHorizontalPosition(context, trigger) {
+    var td = context.td;
+    var rect = (0, roosterjs_content_model_dom_1.normalizeRect)(td.getBoundingClientRect());
+    if (rect) {
+        trigger.id = exports.HORIZONTAL_RESIZER_ID;
+        trigger.style.top = rect.bottom - CELL_RESIZER_WIDTH + 'px';
+        trigger.style.left = rect.left + 'px';
+        trigger.style.width = rect.right - rect.left + 'px';
+        trigger.style.height = CELL_RESIZER_WIDTH + 'px';
+    }
+}
+function setVerticalPosition(context, trigger) {
+    var td = context.td, isRTL = context.isRTL;
+    var rect = (0, roosterjs_content_model_dom_1.normalizeRect)(td.getBoundingClientRect());
+    if (rect) {
+        trigger.id = exports.VERTICAL_RESIZER_ID;
+        trigger.style.top = rect.top + 'px';
+        trigger.style.left = (isRTL ? rect.left : rect.right) - CELL_RESIZER_WIDTH + 1 + 'px';
+        trigger.style.width = CELL_RESIZER_WIDTH + 'px';
+        trigger.style.height = rect.bottom - rect.top + 'px';
+    }
+}
 //# sourceMappingURL=CellResizer.js.map

package/lib/tableEdit/editors/features/CellResizer.js.map

@@ -1 +1 @@
-{"version":3,"file":"CellResizer.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/CellResizer.ts"],"names":[],"mappings":";;;;AAAA,kFAAiF;AACjF,wFAAuF;AACvF,8EAAwE;AAExE,2EAOqC;AAKrC,IAAM,kBAAkB,GAAG,CAAC,CAAC;AAC7B;;GAEG;AACU,QAAA,qBAAqB,GAAG,mBAAmB,CAAC;AACzD;;GAEG;AACU,QAAA,mBAAmB,GAAG,iBAAiB,CAAC;AAErD;;GAEG;AACH,SAAgB,iBAAiB,CAC7B,MAAe,EACf,EAAwB,EACxB,KAAuB,EACvB,KAAc,EACd,YAAqB,EACrB,OAAmB,EACnB,KAAkB,EAClB,eAA6B,EAC7B,oBAAmD;IAEnD,IAAM,QAAQ,GAAG,EAAE,CAAC,aAAa,CAAC;IAClC,IAAM,iBAAiB,GAAG;QACtB,GAAG,EAAE,KAAK;QACV,KAAK,EAAE,+BAA4B,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,gCAA4B;KAC9F,CAAC;IACF,IAAM,SAAS,GAAG,MAAM,CAAC,YAAY,EAAE,CAAC,kBAAkB,EAAE,CAAC;IAE7D,IAAM,GAAG,GAAG,IAAA,6BAAa,EAAC,iBAAiB,EAAE,QAAQ,CAAmB,CAAC;IAEzE,CAAC,eAAe,IAAI,QAAQ,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;IAEpD,IAAM,OAAO,GAAuB;QAChC,MAAM,QAAA;QACN,EAAE,IAAA;QACF,KAAK,OAAA;QACL,KAAK,OAAA;QACL,SAAS,WAAA;QACT,OAAO,SAAA;QACP,aAAa,EAAE,IAAA,gDAAkB,EAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;KACvD,CAAC;IACF,IAAM,WAAW,GAAG,YAAY,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,mBAAmB,CAAC;IAC/E,WAAW,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;IAE1B,IAAM,OAAO,GAAiE;QAC1E,WAAW,aAAA;QACX,iEAAiE;QACjE,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,kBAAkB;QACpE,SAAS,EAAE,KAAK;KACnB,CAAC;IAEF,IAAM,cAAc,GAAG,IAAI,WAAW,CAClC,GAAG,EACH,OAAO,EACP,WAAW,EACX,OAAO,EACP,SAAS,EACT,MAAM,CAAC,cAAc,EAAE,CAAC,gBAAgB,EACxC,oBAAoB,CACvB,CAAC;IAEF,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,GAAG,KAAA,EAAE,cAAc,gBAAA,EAAE,CAAC;AAC7C,CAAC;AApDD,8CAoDC;AAED;IAA0B,4CAA2D;IAGjF,qBACI,OAAoB,EACpB,OAA2B,EAC3B,QAAqE,EACrE,OAAqE,EACrE,SAAiB,EACjB,WAAqB,EACrB,oBAAmD;QAPvD,YASI,kBAAM,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,CAAC,SAErE;QADG,KAAI,CAAC,QAAQ,GAAG,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAG,aAAa,EAAE,OAAO,CAAC,CAAC;;IACnE,CAAC;IAED,6BAAO,GAAP;;QACI,MAAA,IAAI,CAAC,QAAQ,+CAAb,IAAI,CAAa,CAAC;QAClB,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;QAC1B,iBAAM,OAAO,WAAE,CAAC;IACpB,CAAC;IACL,kBAAC;AAAD,CAAC,AArBD,CAA0B,qCAAiB,GAqB1C;AA4BD;;;GAGG;AACH,SAAgB,WAAW,CAAC,OAA2B,EAAE,KAAiB;IAC9D,IAAA,EAAE,GAAc,OAAO,GAArB,EAAE,OAAO,GAAK,OAAO,QAAZ,CAAa;IAChC,IAAM,IAAI,GAAG,IAAA,2CAAa,EAAC,EAAE,CAAC,qBAAqB,EAAE,CAAC,CAAC;IAEvD,uBAAuB;IACvB,IAAM,WAAW,GAAG,EAAE,CAAC,SAAS,CAAC;IACjC,IAAM,GAAG,GACL,EAAE,CAAC,aAAa,IAAI,IAAA,6CAAe,EAAC,EAAE,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC;IAC/F,IAAM,QAAQ,GAAG,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,QAAQ,CAAC;IAE/B,IAAI,QAAQ,IAAI,SAAS,EAAE;QACvB,OAAO;YACH,OAAO,EAAE,SAAS;YAClB,YAAY,EAAE,SAAS;YACvB,SAAS,EAAE,SAAS;YACpB,eAAe,EAAE,CAAC,CAAC;YACnB,SAAS,EAAE,EAAE;SAChB,CAAC,CAAC,kBAAkB;KACxB;IAEO,IAAA,MAAM,GAAY,OAAO,OAAnB,EAAE,KAAK,GAAK,OAAO,MAAZ,CAAa;IAElC,mCAAmC;IACnC,IAAM,OAAO,GAAG,IAAA,8CAAmB,EAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IAEnD,IAAI,IAAI,IAAI,OAAO,EAAE;QACjB,OAAO,EAAE,CAAC;QAEV,OAAO;YACH,OAAO,SAAA;YACP,YAAY,EAAE,WAAW;YACzB,SAAS,EAAE,QAAQ;YACnB,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,MAAM;YAC9C,SAAS,qDAAM,OAAO,CAAC,MAAM,SAAC;SACjC,CAAC;KACL;SAAM;QACH,OAAO;YACH,OAAO,SAAA;YACP,YAAY,EAAE,SAAS;YACvB,SAAS,EAAE,SAAS;YACpB,eAAe,EAAE,CAAC,CAAC;YACnB,SAAS,EAAE,EAAE;SAChB,CAAC,CAAC,kBAAkB;KACxB;AACL,CAAC;AA5CD,kCA4CC;AAED;;;GAGG;AACH,SAAgB,oBAAoB,CAChC,OAA2B,EAC3B,KAAiB,EACjB,SAA+B,EAC/B,MAAc,EACd,MAAc;IAEN,IAAA,KAAK,GAAK,OAAO,MAAZ,CAAa;IAClB,IAAA,OAAO,GAAiC,SAAS,QAA1C,EAAE,SAAS,GAAsB,SAAS,UAA/B,EAAE,eAAe,GAAK,SAAS,gBAAd,CAAe;IAE1D,gDAAgD;IAChD,IAAI,OAAO,IAAI,SAAS,IAAI,SAAS,IAAI,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,SAAS,EAAE;QAC3E,2BAA2B;QAC3B,IAAA,yCAAW,EAAC,OAAO,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,MAAM,GAAG,CAAC,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,CAAC,CAAC,GAAG,MAAM,CAAC;QAE9E,iCAAiC;QACjC,IAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,MAAM,EAAE,2DAA6B,CAAC,CAAC;QAE1F,+CAA+C;QAC/C,IAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QACvC,KAAK,IAAI,GAAG,GAAG,CAAC,EAAE,GAAG,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE;YAClD,IAAM,EAAE,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YAC/B,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC;YACnC,EAAE,CAAC,KAAK,CAAC,SAAS,GAAG,YAAY,CAAC;SACrC;QAED,OAAO,IAAI,CAAC;KACf;SAAM;QACH,OAAO,KAAK,CAAC;KAChB;AACL,CAAC;AA9BD,oDA8BC;AAED;;;GAGG;AACH,SAAgB,kBAAkB,CAC9B,OAA2B,EAC3B,KAAiB,EACjB,SAA+B,EAC/B,MAAc;IAEN,IAAA,KAAK,GAAY,OAAO,MAAnB,EAAE,KAAK,GAAK,OAAO,MAAZ,CAAa;IACzB,IAAA,OAAO,GAA8B,SAAS,QAAvC,EAAE,YAAY,GAAgB,SAAS,aAAzB,EAAE,SAAS,GAAK,SAAS,UAAd,CAAe;IAEvD,gDAAgD;IAChD,IAAI,OAAO,IAAI,YAAY,IAAI,SAAS,EAAE;QACtC,IAAM,YAAY,GAAG,IAAA,yCAAW,EAAC,OAAO,CAAC,CAAC;QAE1C,2BAA2B;QAC3B,IAAM,UAAU,GAAG,YAAY,IAAI,OAAO,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;QAC7D,IAAM,MAAM,GAAG,MAAM,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACzC,0BAA0B;QAC1B,IAAI,UAAU,EAAE;YACZ,+BAA+B;YAC/B,gCAAgC;YAChC,IAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CACrB,SAAS,CAAC,YAAY,CAAC,GAAG,MAAM,EAChC,0DAA4B,CAC/B,CAAC;YACF,YAAY,CAAC,MAAM,CAAC,YAAY,CAAC,GAAG,QAAQ,CAAC;SAChD;aAAM;YACH,wBAAwB;YACxB,IAAM,YAAY,GAAG,SAAS,CAAC,YAAY,CAAC,GAAG,MAAM,CAAC;YACtD,IAAM,gBAAgB,GAAG,SAAS,CAAC,YAAY,GAAG,CAAC,CAAC,GAAG,MAAM,CAAC;YAC9D,IACI,YAAY,GAAG,0DAA4B;gBAC3C,gBAAgB,GAAG,0DAA4B,EACjD;gBACE,OAAO,KAAK,CAAC;aAChB;YACD,YAAY,CAAC,MAAM,CAAC,YAAY,CAAC,GAAG,YAAY,CAAC;YACjD,YAAY,CAAC,MAAM,CAAC,YAAY,GAAG,CAAC,CAAC,GAAG,gBAAgB,CAAC;SAC5D;QAED,+CAA+C;QAC/C,KAAK,IAAI,GAAG,GAAG,CAAC,EAAE,GAAG,GAAG,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE;YAC9C,IAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACjC,KAAK,IAAI,GAAG,GAAG,CAAC,EAAE,GAAG,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE;gBAClD,IAAM,EAAE,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;gBAE/B,EAAE,CAAC,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;gBAC5C,EAAE,CAAC,KAAK,CAAC,SAAS,GAAG,YAAY,CAAC;aACrC;SACJ;QAED,IAAI,OAAO,CAAC,aAAa,GAAG,CAAC,EAAE;YAC3B,IAAM,QAAQ,GAAG,OAAO,CAAC,aAAa,GAAG,MAAM,GAAG,IAAI,CAAC;YAEvD,YAAY,CAAC,MAAM,CAAC,KAAK,GAAG,QAAQ,CAAC;YACrC,KAAK,CAAC,KAAK,CAAC,KAAK,GAAG,QAAQ,CAAC;SAChC;QAED,OAAO,IAAI,CAAC;KACf;SAAM;QACH,OAAO,KAAK,CAAC;KAChB;AACL,CAAC;AA7DD,gDA6DC;AAED,SAAS,qBAAqB,CAAC,OAA2B,EAAE,OAAoB;IACpE,IAAA,EAAE,GAAK,OAAO,GAAZ,CAAa;IACvB,IAAM,IAAI,GAAG,IAAA,2CAAa,EAAC,EAAE,CAAC,qBAAqB,EAAE,CAAC,CAAC;IACvD,IAAI,IAAI,EAAE;QACN,OAAO,CAAC,EAAE,GAAG,6BAAqB,CAAC;QACnC,OAAO,CAAC,KAAK,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,GAAG,kBAAkB,GAAG,IAAI,CAAC;QAC5D,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACtC,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACpD,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,kBAAkB,GAAG,IAAI,CAAC;KACpD;AACL,CAAC;AAED,SAAS,mBAAmB,CAAC,OAA2B,EAAE,OAAoB;IAClE,IAAA,EAAE,GAAY,OAAO,GAAnB,EAAE,KAAK,GAAK,OAAO,MAAZ,CAAa;IAC9B,IAAM,IAAI,GAAG,IAAA,2CAAa,EAAC,EAAE,CAAC,qBAAqB,EAAE,CAAC,CAAC;IACvD,IAAI,IAAI,EAAE;QACN,OAAO,CAAC,EAAE,GAAG,2BAAmB,CAAC;QACjC,OAAO,CAAC,KAAK,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;QACpC,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,kBAAkB,GAAG,CAAC,GAAG,IAAI,CAAC;QACtF,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,kBAAkB,GAAG,IAAI,CAAC;QAChD,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;KACxD;AACL,CAAC","sourcesContent":["import { createElement } from '../../../pluginUtils/CreateElement/createElement';\nimport { DragAndDropHelper } from '../../../pluginUtils/DragAndDrop/DragAndDropHelper';\nimport { getCMTableFromTable } from '../utils/getTableFromContentModel';\nimport type { TableEditFeature } from './TableEditFeature';\nimport {\n    isElementOfType,\n    normalizeRect,\n    MIN_ALLOWED_TABLE_CELL_WIDTH,\n    mutateBlock,\n    MIN_ALLOWED_TABLE_CELL_HEIGHT,\n    parseValueWithUnit,\n} from 'roosterjs-content-model-dom';\nimport type { DragAndDropHandler } from '../../../pluginUtils/DragAndDrop/DragAndDropHandler';\nimport type { IEditor, ReadonlyContentModelTable } from 'roosterjs-content-model-types';\nimport type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';\n\nconst CELL_RESIZER_WIDTH = 4;\n/**\n * @internal\n */\nexport const HORIZONTAL_RESIZER_ID = 'horizontalResizer';\n/**\n * @internal\n */\nexport const VERTICAL_RESIZER_ID = 'verticalResizer';\n\n/**\n * @internal\n */\nexport function createCellResizer(\n    editor: IEditor,\n    td: HTMLTableCellElement,\n    table: HTMLTableElement,\n    isRTL: boolean,\n    isHorizontal: boolean,\n    onStart: () => void,\n    onEnd: () => false,\n    anchorContainer?: HTMLElement,\n    onTableEditorCreated?: OnTableEditorCreatedCallback\n): TableEditFeature | null {\n    const document = td.ownerDocument;\n    const createElementData = {\n        tag: 'div',\n        style: `position: fixed; cursor: ${isHorizontal ? 'row' : 'col'}-resize; user-select: none`,\n    };\n    const zoomScale = editor.getDOMHelper().calculateZoomScale();\n\n    const div = createElement(createElementData, document) as HTMLDivElement;\n\n    (anchorContainer || document.body).appendChild(div);\n\n    const context: CellResizerContext = {\n        editor,\n        td,\n        table,\n        isRTL,\n        zoomScale,\n        onStart,\n        originalWidth: parseValueWithUnit(table.style.width),\n    };\n    const setPosition = isHorizontal ? setHorizontalPosition : setVerticalPosition;\n    setPosition(context, div);\n\n    const handler: DragAndDropHandler<CellResizerContext, CellResizerInitValue> = {\n        onDragStart,\n        // Horizontal modifies row height, vertical modifies column width\n        onDragging: isHorizontal ? onDraggingHorizontal : onDraggingVertical,\n        onDragEnd: onEnd,\n    };\n\n    const featureHandler = new CellResizer(\n        div,\n        context,\n        setPosition,\n        handler,\n        zoomScale,\n        editor.getEnvironment().isMobileOrTablet,\n        onTableEditorCreated\n    );\n\n    return { node: td, div, featureHandler };\n}\n\nclass CellResizer extends DragAndDropHelper<CellResizerContext, CellResizerInitValue> {\n    private disposer: undefined | (() => void);\n\n    constructor(\n        trigger: HTMLElement,\n        context: CellResizerContext,\n        onSubmit: (context: CellResizerContext, trigger: HTMLElement) => void,\n        handler: DragAndDropHandler<CellResizerContext, CellResizerInitValue>,\n        zoomScale: number,\n        forceMobile?: boolean,\n        onTableEditorCreated?: OnTableEditorCreatedCallback\n    ) {\n        super(trigger, context, onSubmit, handler, zoomScale, forceMobile);\n        this.disposer = onTableEditorCreated?.('CellResizer', trigger);\n    }\n\n    dispose(): void {\n        this.disposer?.();\n        this.disposer = undefined;\n        super.dispose();\n    }\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport interface CellResizerContext {\n    editor: IEditor;\n    td: HTMLTableCellElement;\n    table: HTMLTableElement;\n    isRTL: boolean;\n    zoomScale: number;\n    originalWidth: number;\n    onStart: () => void;\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport interface CellResizerInitValue {\n    cmTable: ReadonlyContentModelTable | undefined;\n    anchorColumn: number | undefined;\n    anchorRow: number | undefined;\n    anchorRowHeight: number;\n    allWidths: number[];\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDragStart(context: CellResizerContext, event: MouseEvent): CellResizerInitValue {\n    const { td, onStart } = context;\n    const rect = normalizeRect(td.getBoundingClientRect());\n\n    // Get cell coordinates\n    const columnIndex = td.cellIndex;\n    const row =\n        td.parentElement && isElementOfType(td.parentElement, 'tr') ? td.parentElement : undefined;\n    const rowIndex = row?.rowIndex;\n\n    if (rowIndex == undefined) {\n        return {\n            cmTable: undefined,\n            anchorColumn: undefined,\n            anchorRow: undefined,\n            anchorRowHeight: -1,\n            allWidths: [],\n        }; // Just a fallback\n    }\n\n    const { editor, table } = context;\n\n    // Get Table block in content model\n    const cmTable = getCMTableFromTable(editor, table);\n\n    if (rect && cmTable) {\n        onStart();\n\n        return {\n            cmTable,\n            anchorColumn: columnIndex,\n            anchorRow: rowIndex,\n            anchorRowHeight: cmTable.rows[rowIndex].height,\n            allWidths: [...cmTable.widths],\n        };\n    } else {\n        return {\n            cmTable,\n            anchorColumn: undefined,\n            anchorRow: undefined,\n            anchorRowHeight: -1,\n            allWidths: [],\n        }; // Just a fallback\n    }\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDraggingHorizontal(\n    context: CellResizerContext,\n    event: MouseEvent,\n    initValue: CellResizerInitValue,\n    deltaX: number,\n    deltaY: number\n) {\n    const { table } = context;\n    const { cmTable, anchorRow, anchorRowHeight } = initValue;\n\n    // Assign new widths and heights to the CM table\n    if (cmTable && anchorRow != undefined && cmTable.rows[anchorRow] != undefined) {\n        // Modify the CM Table size\n        mutateBlock(cmTable).rows[anchorRow].height = (anchorRowHeight ?? 0) + deltaY;\n\n        // Normalize the new height value\n        const newHeight = Math.max(cmTable.rows[anchorRow].height, MIN_ALLOWED_TABLE_CELL_HEIGHT);\n\n        // Writeback CM Table size changes to DOM Table\n        const tableRow = table.rows[anchorRow];\n        for (let col = 0; col < tableRow.cells.length; col++) {\n            const td = tableRow.cells[col];\n            td.style.height = newHeight + 'px';\n            td.style.boxSizing = 'border-box';\n        }\n\n        return true;\n    } else {\n        return false;\n    }\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDraggingVertical(\n    context: CellResizerContext,\n    event: MouseEvent,\n    initValue: CellResizerInitValue,\n    deltaX: number\n) {\n    const { table, isRTL } = context;\n    const { cmTable, anchorColumn, allWidths } = initValue;\n\n    // Assign new widths and heights to the CM table\n    if (cmTable && anchorColumn != undefined) {\n        const mutableTable = mutateBlock(cmTable);\n\n        // Modify the CM Table size\n        const lastColumn = anchorColumn == cmTable.widths.length - 1;\n        const change = deltaX * (isRTL ? -1 : 1);\n        // This is the last column\n        if (lastColumn) {\n            // Only the last column changes\n            // Normalize the new width value\n            const newWidth = Math.max(\n                allWidths[anchorColumn] + change,\n                MIN_ALLOWED_TABLE_CELL_WIDTH\n            );\n            mutableTable.widths[anchorColumn] = newWidth;\n        } else {\n            // Any other two columns\n            const anchorChange = allWidths[anchorColumn] + change;\n            const nextAnchorChange = allWidths[anchorColumn + 1] - change;\n            if (\n                anchorChange < MIN_ALLOWED_TABLE_CELL_WIDTH ||\n                nextAnchorChange < MIN_ALLOWED_TABLE_CELL_WIDTH\n            ) {\n                return false;\n            }\n            mutableTable.widths[anchorColumn] = anchorChange;\n            mutableTable.widths[anchorColumn + 1] = nextAnchorChange;\n        }\n\n        // Writeback CM Table size changes to DOM Table\n        for (let row = 0; row < table.rows.length; row++) {\n            const tableRow = table.rows[row];\n            for (let col = 0; col < tableRow.cells.length; col++) {\n                const td = tableRow.cells[col];\n\n                td.style.width = cmTable.widths[col] + 'px';\n                td.style.boxSizing = 'border-box';\n            }\n        }\n\n        if (context.originalWidth > 0) {\n            const newWidth = context.originalWidth + change + 'px';\n\n            mutableTable.format.width = newWidth;\n            table.style.width = newWidth;\n        }\n\n        return true;\n    } else {\n        return false;\n    }\n}\n\nfunction setHorizontalPosition(context: CellResizerContext, trigger: HTMLElement) {\n    const { td } = context;\n    const rect = normalizeRect(td.getBoundingClientRect());\n    if (rect) {\n        trigger.id = HORIZONTAL_RESIZER_ID;\n        trigger.style.top = rect.bottom - CELL_RESIZER_WIDTH + 'px';\n        trigger.style.left = rect.left + 'px';\n        trigger.style.width = rect.right - rect.left + 'px';\n        trigger.style.height = CELL_RESIZER_WIDTH + 'px';\n    }\n}\n\nfunction setVerticalPosition(context: CellResizerContext, trigger: HTMLElement) {\n    const { td, isRTL } = context;\n    const rect = normalizeRect(td.getBoundingClientRect());\n    if (rect) {\n        trigger.id = VERTICAL_RESIZER_ID;\n        trigger.style.top = rect.top + 'px';\n        trigger.style.left = (isRTL ? rect.left : rect.right) - CELL_RESIZER_WIDTH + 1 + 'px';\n        trigger.style.width = CELL_RESIZER_WIDTH + 'px';\n        trigger.style.height = rect.bottom - rect.top + 'px';\n    }\n}\n"]}
+{"version":3,"file":"CellResizer.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/CellResizer.ts"],"names":[],"mappings":"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","sourcesContent":["import { createElement } from '../../../pluginUtils/CreateElement/createElement';\r\nimport { DragAndDropHelper } from '../../../pluginUtils/DragAndDrop/DragAndDropHelper';\r\nimport { getCMTableFromTable } from '../utils/getTableFromContentModel';\r\nimport type { TableEditFeature } from './TableEditFeature';\r\nimport {\r\n    normalizeRect,\r\n    MIN_ALLOWED_TABLE_CELL_WIDTH,\r\n    mutateBlock,\r\n    MIN_ALLOWED_TABLE_CELL_HEIGHT,\r\n    parseValueWithUnit,\r\n} from 'roosterjs-content-model-dom';\r\nimport type { DragAndDropHandler } from '../../../pluginUtils/DragAndDrop/DragAndDropHandler';\r\nimport type { IEditor, ReadonlyContentModelTable } from 'roosterjs-content-model-types';\r\nimport type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';\r\n\r\nconst CELL_RESIZER_WIDTH = 4;\r\n/**\r\n * @internal\r\n */\r\nexport const HORIZONTAL_RESIZER_ID = 'horizontalResizer';\r\n/**\r\n * @internal\r\n */\r\nexport const VERTICAL_RESIZER_ID = 'verticalResizer';\r\n\r\n/**\r\n * @internal\r\n */\r\nexport function createCellResizer(\r\n    editor: IEditor,\r\n    td: HTMLTableCellElement,\r\n    table: HTMLTableElement,\r\n    isRTL: boolean,\r\n    isHorizontal: boolean,\r\n    onStart: () => void,\r\n    onEnd: () => false,\r\n    anchorContainer?: HTMLElement,\r\n    onTableEditorCreated?: OnTableEditorCreatedCallback\r\n): TableEditFeature | null {\r\n    const document = td.ownerDocument;\r\n    const createElementData = {\r\n        tag: 'div',\r\n        style: `position: fixed; cursor: ${isHorizontal ? 'row' : 'col'}-resize; user-select: none`,\r\n    };\r\n    const zoomScale = editor.getDOMHelper().calculateZoomScale();\r\n\r\n    const div = createElement(createElementData, document) as HTMLDivElement;\r\n\r\n    (anchorContainer || document.body).appendChild(div);\r\n\r\n    const context: CellResizerContext = {\r\n        editor,\r\n        td,\r\n        table,\r\n        isRTL,\r\n        zoomScale,\r\n        onStart,\r\n        originalWidth: parseValueWithUnit(table.style.width),\r\n    };\r\n    const setPosition = isHorizontal ? setHorizontalPosition : setVerticalPosition;\r\n    setPosition(context, div);\r\n\r\n    const handler: DragAndDropHandler<CellResizerContext, CellResizerInitValue> = {\r\n        onDragStart,\r\n        // Horizontal modifies row height, vertical modifies column width\r\n        onDragging: isHorizontal ? onDraggingHorizontal : onDraggingVertical,\r\n        onDragEnd: onEnd,\r\n    };\r\n\r\n    const featureHandler = new CellResizer(\r\n        div,\r\n        context,\r\n        setPosition,\r\n        handler,\r\n        zoomScale,\r\n        editor.getEnvironment().isMobileOrTablet,\r\n        onTableEditorCreated\r\n    );\r\n\r\n    return { node: td, div, featureHandler };\r\n}\r\n\r\nclass CellResizer extends DragAndDropHelper<CellResizerContext, CellResizerInitValue> {\r\n    private disposer: undefined | (() => void);\r\n\r\n    constructor(\r\n        trigger: HTMLElement,\r\n        context: CellResizerContext,\r\n        onSubmit: (context: CellResizerContext, trigger: HTMLElement) => void,\r\n        handler: DragAndDropHandler<CellResizerContext, CellResizerInitValue>,\r\n        zoomScale: number,\r\n        forceMobile?: boolean,\r\n        onTableEditorCreated?: OnTableEditorCreatedCallback\r\n    ) {\r\n        super(trigger, context, onSubmit, handler, zoomScale, forceMobile);\r\n        this.disposer = onTableEditorCreated?.('CellResizer', trigger);\r\n    }\r\n\r\n    dispose(): void {\r\n        this.disposer?.();\r\n        this.disposer = undefined;\r\n        super.dispose();\r\n    }\r\n}\r\n\r\n/**\r\n * @internal\r\n * Exported for testing\r\n */\r\nexport interface CellResizerContext {\r\n    editor: IEditor;\r\n    td: HTMLTableCellElement;\r\n    table: HTMLTableElement;\r\n    isRTL: boolean;\r\n    zoomScale: number;\r\n    originalWidth: number;\r\n    onStart: () => void;\r\n}\r\n\r\n/**\r\n * @internal\r\n * Exported for testing\r\n */\r\nexport interface CellResizerInitValue {\r\n    cmTable: ReadonlyContentModelTable | undefined;\r\n    anchorColumn: number | undefined;\r\n    nextColumn: number;\r\n    anchorRow: number | undefined;\r\n    anchorRowHeight: number;\r\n    allWidths: number[];\r\n}\r\n\r\n/**\r\n * @internal\r\n * Exported for testing\r\n */\r\nexport function onDragStart(context: CellResizerContext, event: MouseEvent): CellResizerInitValue {\r\n    const { td, onStart } = context;\r\n    const rect = normalizeRect(td.getBoundingClientRect());\r\n\r\n    // Get cell coordinates\r\n    let rowIndex: number | undefined;\r\n    let columnIndex: number | undefined;\r\n    let nextColumnIndex = -1;\r\n\r\n    const { editor, table } = context;\r\n\r\n    // Get Table block in content model\r\n    const cmTable = getCMTableFromTable(editor, table);\r\n\r\n    if (rect && cmTable) {\r\n        for (let r = 0; r < cmTable?.rows.length; r++) {\r\n            for (let c = 0; c < cmTable.rows[r].cells.length; c++) {\r\n                const cell = cmTable.rows[r].cells[c];\r\n\r\n                if (cell.cachedElement == td) {\r\n                    // Target cell found, record its position\r\n                    rowIndex = r;\r\n                    columnIndex = c;\r\n                } else if (rowIndex != undefined && columnIndex != undefined) {\r\n                    // rowIndex and columnIndex are already found, we can find nextColumnIndex now\r\n                    if (!cell.cachedElement) {\r\n                        // No cached element means this cell is merged, so this could potentially be the right side of column\r\n                        // We are trying to find the last merged cell so we can modify its width later\r\n                        columnIndex = c;\r\n                    } else {\r\n                        // Since we already found the target cell, the first cell with cachedElement after that must be the next column\r\n                        nextColumnIndex = c;\r\n                        break;\r\n                    }\r\n                }\r\n            }\r\n\r\n            // As long as rowIndex is found, we can break here, no matter if nextColumnIndex is found or not\r\n            // because for the last column case, nextColumnIndex will be -1\r\n            if (rowIndex != undefined) {\r\n                break;\r\n            }\r\n        }\r\n\r\n        onStart();\r\n\r\n        if (rowIndex !== undefined) {\r\n            return {\r\n                cmTable,\r\n                anchorColumn: columnIndex,\r\n                nextColumn: nextColumnIndex,\r\n                anchorRow: rowIndex,\r\n                anchorRowHeight: cmTable.rows[rowIndex].height,\r\n                allWidths: [...cmTable.widths],\r\n            };\r\n        }\r\n    }\r\n\r\n    return {\r\n        cmTable,\r\n        anchorColumn: undefined,\r\n        anchorRow: undefined,\r\n        anchorRowHeight: -1,\r\n        allWidths: [],\r\n        nextColumn: -1,\r\n    }; // Just a fallback\r\n}\r\n\r\n/**\r\n * @internal\r\n * Exported for testing\r\n */\r\nexport function onDraggingHorizontal(\r\n    context: CellResizerContext,\r\n    event: MouseEvent,\r\n    initValue: CellResizerInitValue,\r\n    deltaX: number,\r\n    deltaY: number\r\n) {\r\n    const { cmTable, anchorRow, anchorRowHeight } = initValue;\r\n\r\n    // Assign new widths and heights to the CM table\r\n    if (cmTable && anchorRow != undefined && cmTable.rows[anchorRow] != undefined) {\r\n        // Modify the CM Table size\r\n        mutateBlock(cmTable).rows[anchorRow].height = (anchorRowHeight ?? 0) + deltaY;\r\n\r\n        // Normalize the new height value\r\n        const newHeight = Math.max(cmTable.rows[anchorRow].height, MIN_ALLOWED_TABLE_CELL_HEIGHT);\r\n\r\n        // Writeback CM Table size changes to DOM Table\r\n        const tableRow = cmTable.rows[anchorRow].cells;\r\n\r\n        for (let col = 0; col < tableRow.length; col++) {\r\n            const td = tableRow[col].cachedElement;\r\n\r\n            if (td) {\r\n                td.style.height = newHeight + 'px';\r\n                td.style.boxSizing = 'border-box';\r\n            }\r\n        }\r\n\r\n        return true;\r\n    } else {\r\n        return false;\r\n    }\r\n}\r\n\r\n/**\r\n * @internal\r\n * Exported for testing\r\n */\r\nexport function onDraggingVertical(\r\n    context: CellResizerContext,\r\n    event: MouseEvent,\r\n    initValue: CellResizerInitValue,\r\n    deltaX: number\r\n) {\r\n    const { table, isRTL } = context;\r\n    const { cmTable, anchorColumn, nextColumn, allWidths } = initValue;\r\n\r\n    // Assign new widths and heights to the CM table\r\n    if (cmTable && anchorColumn != undefined) {\r\n        const mutableTable = mutateBlock(cmTable);\r\n\r\n        const change = deltaX * (isRTL ? -1 : 1);\r\n        // This is the last column\r\n        if (nextColumn == -1) {\r\n            // Only the last column changes\r\n            // Normalize the new width value\r\n            const newWidth = Math.max(\r\n                allWidths[anchorColumn] + change,\r\n                MIN_ALLOWED_TABLE_CELL_WIDTH\r\n            );\r\n            mutableTable.widths[anchorColumn] = newWidth;\r\n        } else {\r\n            // Any other two columns\r\n            const anchorChange = allWidths[anchorColumn] + change;\r\n            const nextAnchorChange = allWidths[nextColumn] - change;\r\n            if (\r\n                anchorChange < MIN_ALLOWED_TABLE_CELL_WIDTH ||\r\n                nextAnchorChange < MIN_ALLOWED_TABLE_CELL_WIDTH\r\n            ) {\r\n                return false;\r\n            }\r\n\r\n            mutableTable.widths[anchorColumn] = anchorChange;\r\n            mutableTable.widths[nextColumn] = nextAnchorChange;\r\n        }\r\n\r\n        // Write back CM Table size changes to DOM Table\r\n        for (let row = 0; row < cmTable.rows.length; row++) {\r\n            const tableRow = cmTable.rows[row].cells;\r\n            let lastTd: HTMLTableCellElement | null = null;\r\n            let lastWidth = 0;\r\n\r\n            for (let col = 0; col < tableRow.length; col++) {\r\n                const td = tableRow[col].cachedElement;\r\n\r\n                if (td) {\r\n                    td.style.boxSizing = 'border-box';\r\n                    lastTd = td;\r\n                    lastWidth = cmTable.widths[col];\r\n                } else if (lastTd && tableRow[col].spanLeft) {\r\n                    lastWidth += cmTable.widths[col];\r\n                } else if (tableRow[col].spanAbove) {\r\n                    // For span above case, we don't need to adjust width, just clear lastTd and lastWidth\r\n                    lastTd = null;\r\n                    lastWidth = 0;\r\n                }\r\n\r\n                if (lastTd) {\r\n                    lastTd.style.width = lastWidth + 'px';\r\n                }\r\n            }\r\n        }\r\n\r\n        if (context.originalWidth > 0) {\r\n            const newWidth = context.originalWidth + change + 'px';\r\n\r\n            mutableTable.format.width = newWidth;\r\n            table.style.width = newWidth;\r\n        }\r\n\r\n        return true;\r\n    } else {\r\n        return false;\r\n    }\r\n}\r\n\r\nfunction setHorizontalPosition(context: CellResizerContext, trigger: HTMLElement) {\r\n    const { td } = context;\r\n    const rect = normalizeRect(td.getBoundingClientRect());\r\n    if (rect) {\r\n        trigger.id = HORIZONTAL_RESIZER_ID;\r\n        trigger.style.top = rect.bottom - CELL_RESIZER_WIDTH + 'px';\r\n        trigger.style.left = rect.left + 'px';\r\n        trigger.style.width = rect.right - rect.left + 'px';\r\n        trigger.style.height = CELL_RESIZER_WIDTH + 'px';\r\n    }\r\n}\r\n\r\nfunction setVerticalPosition(context: CellResizerContext, trigger: HTMLElement) {\r\n    const { td, isRTL } = context;\r\n    const rect = normalizeRect(td.getBoundingClientRect());\r\n    if (rect) {\r\n        trigger.id = VERTICAL_RESIZER_ID;\r\n        trigger.style.top = rect.top + 'px';\r\n        trigger.style.left = (isRTL ? rect.left : rect.right) - CELL_RESIZER_WIDTH + 1 + 'px';\r\n        trigger.style.width = CELL_RESIZER_WIDTH + 'px';\r\n        trigger.style.height = rect.bottom - rect.top + 'px';\r\n    }\r\n}\r\n"]}

package/lib/tableEdit/editors/features/TableEditFeature.d.ts

@@ -1,13 +1,13 @@
-import type { Disposable } from '../../../pluginUtils/Disposable';
-/**
- * @internal
- */
-export interface TableEditFeature {
-    node: Node;
-    div: HTMLDivElement | null;
-    featureHandler: Disposable | null;
-}
-/**
- * @internal
- */
-export declare function disposeTableEditFeature(feature: TableEditFeature | null): void;
+import type { Disposable } from '../../../pluginUtils/Disposable';
+/**
+ * @internal
+ */
+export interface TableEditFeature {
+    node: Node;
+    div: HTMLDivElement | null;
+    featureHandler: Disposable | null;
+}
+/**
+ * @internal
+ */
+export declare function disposeTableEditFeature(feature: TableEditFeature | null): void;

package/lib/tableEdit/editors/features/TableEditFeature.js

@@ -1,17 +1,17 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.disposeTableEditFeature = void 0;
-/**
- * @internal
- */
-function disposeTableEditFeature(feature) {
-    var _a, _b, _c;
-    if (feature) {
-        (_a = feature.featureHandler) === null || _a === void 0 ? void 0 : _a.dispose();
-        feature.featureHandler = null;
-        (_c = (_b = feature.div) === null || _b === void 0 ? void 0 : _b.parentNode) === null || _c === void 0 ? void 0 : _c.removeChild(feature.div);
-        feature.div = null;
-    }
-}
-exports.disposeTableEditFeature = disposeTableEditFeature;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.disposeTableEditFeature = void 0;
+/**
+ * @internal
+ */
+function disposeTableEditFeature(feature) {
+    var _a, _b, _c;
+    if (feature) {
+        (_a = feature.featureHandler) === null || _a === void 0 ? void 0 : _a.dispose();
+        feature.featureHandler = null;
+        (_c = (_b = feature.div) === null || _b === void 0 ? void 0 : _b.parentNode) === null || _c === void 0 ? void 0 : _c.removeChild(feature.div);
+        feature.div = null;
+    }
+}
+exports.disposeTableEditFeature = disposeTableEditFeature;
 //# sourceMappingURL=TableEditFeature.js.map

package/lib/tableEdit/editors/features/TableEditFeature.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableEditFeature.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableEditFeature.ts"],"names":[],"mappings":";;;AAWA;;GAEG;AACH,SAAgB,uBAAuB,CAAC,OAAgC;;IACpE,IAAI,OAAO,EAAE;QACT,MAAA,OAAO,CAAC,cAAc,0CAAE,OAAO,EAAE,CAAC;QAClC,OAAO,CAAC,cAAc,GAAG,IAAI,CAAC;QAC9B,MAAA,MAAA,OAAO,CAAC,GAAG,0CAAE,UAAU,0CAAE,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;QAClD,OAAO,CAAC,GAAG,GAAG,IAAI,CAAC;KACtB;AACL,CAAC;AAPD,0DAOC","sourcesContent":["import type { Disposable } from '../../../pluginUtils/Disposable';\n\n/**\n * @internal\n */\nexport interface TableEditFeature {\n    node: Node;\n    div: HTMLDivElement | null;\n    featureHandler: Disposable | null;\n}\n\n/**\n * @internal\n */\nexport function disposeTableEditFeature(feature: TableEditFeature | null) {\n    if (feature) {\n        feature.featureHandler?.dispose();\n        feature.featureHandler = null;\n        feature.div?.parentNode?.removeChild(feature.div);\n        feature.div = null;\n    }\n}\n"]}
+{"version":3,"file":"TableEditFeature.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableEditFeature.ts"],"names":[],"mappings":";;;AAWA;;GAEG;AACH,SAAgB,uBAAuB,CAAC,OAAgC;;IACpE,IAAI,OAAO,EAAE;QACT,MAAA,OAAO,CAAC,cAAc,0CAAE,OAAO,EAAE,CAAC;QAClC,OAAO,CAAC,cAAc,GAAG,IAAI,CAAC;QAC9B,MAAA,MAAA,OAAO,CAAC,GAAG,0CAAE,UAAU,0CAAE,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;QAClD,OAAO,CAAC,GAAG,GAAG,IAAI,CAAC;KACtB;AACL,CAAC;AAPD,0DAOC","sourcesContent":["import type { Disposable } from '../../../pluginUtils/Disposable';\r\n\r\n/**\r\n * @internal\r\n */\r\nexport interface TableEditFeature {\r\n    node: Node;\r\n    div: HTMLDivElement | null;\r\n    featureHandler: Disposable | null;\r\n}\r\n\r\n/**\r\n * @internal\r\n */\r\nexport function disposeTableEditFeature(feature: TableEditFeature | null) {\r\n    if (feature) {\r\n        feature.featureHandler?.dispose();\r\n        feature.featureHandler = null;\r\n        feature.div?.parentNode?.removeChild(feature.div);\r\n        feature.div = null;\r\n    }\r\n}\r\n"]}