roosterjs-content-model-plugins 9.44.0 → 9.45.0

package/lib-mjs/tableEdit/editors/features/TableRowColumnSelector.js

@@ -0,0 +1,216 @@
+import { __extends } from "tslib";
+import { createElement } from '../../../pluginUtils/CreateElement/createElement';
+import { DragAndDropHelper } from '../../../pluginUtils/DragAndDrop/DragAndDropHelper';
+import { normalizeRect, parseTableCells } from 'roosterjs-content-model-dom';
+var STABLE_DOWN_ARROW_CURSOR = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij48dGV4dCB4PSI4IiB5PSIxMiIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZm9udC1zaXplPSIxNCIgZmlsbD0iYmxhY2siPiYjMTI5MDk1OzwvdGV4dD48L3N2Zz4=';
+var STABLE_RIGHT_ARROW_CURSOR = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij48dGV4dCB4PSI4IiB5PSIxMiIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZm9udC1zaXplPSIxNCIgZmlsbD0iYmxhY2siIHRyYW5zZm9ybT0icm90YXRlKC05MCA4IDgpIj4mIzEyOTA5NTs8L3RleHQ+PC9zdmc+';
+/**
+ * @internal
+ */
+export function createTableRowColumnSelector(editor, table, isRowSelector, anchorContainer, onTableEditorCreated) {
+    var _a;
+    var doc = editor.getDocument();
+    var zoomScale = editor.getDOMHelper().calculateZoomScale();
+    var containerDiv = doc.createElement('div');
+    containerDiv.style.cssText = 'position: fixed; pointer-events: none;';
+    var cells = isRowSelector
+        ? Array.from(table.rows)
+            .map(function (row) { return row.cells[0]; })
+            .filter(function (cell) { return cell; })
+        : Array.from(((_a = table.rows[0]) === null || _a === void 0 ? void 0 : _a.cells) || []);
+    var handlers = [];
+    cells.forEach(function (cell) {
+        var cellRect = normalizeRect(cell.getBoundingClientRect());
+        if (cellRect) {
+            var createElementData = getInsertElementData(cellRect, isRowSelector);
+            var cellDiv = createElement(createElementData, doc);
+            containerDiv.appendChild(cellDiv);
+            var context = {
+                table: table,
+                zoomScale: zoomScale,
+                editor: editor,
+                div: cellDiv,
+                isRow: isRowSelector,
+            };
+            var handler = new TableRowColumnSelectorHandler(cellDiv, isRowSelector, context, {
+                onDragStart: onDragStart,
+                onDragging: onDragging,
+                onDragEnd: onDragEnd,
+            }, zoomScale, onTableEditorCreated, editor.getEnvironment().isMobileOrTablet);
+            handlers.push(handler);
+        }
+    });
+    (anchorContainer || doc.body).appendChild(containerDiv);
+    var compositeHandler = {
+        dispose: function () {
+            handlers.forEach(function (h) { return h.dispose(); });
+        },
+    };
+    return { div: containerDiv, featureHandler: compositeHandler, node: table };
+}
+var TableRowColumnSelectorHandler = /** @class */ (function (_super) {
+    __extends(TableRowColumnSelectorHandler, _super);
+    function TableRowColumnSelectorHandler(div, isRow, context, handler, zoomScale, onTableEditorCreated, forceMobile) {
+        var _this = _super.call(this, div, context, function () { }, handler, zoomScale, forceMobile) || this;
+        _this.isRow = isRow;
+        _this.disposer = onTableEditorCreated === null || onTableEditorCreated === void 0 ? void 0 : onTableEditorCreated(_this.isRow ? 'TableRowSelector' : 'TableColumnSelector', div);
+        return _this;
+    }
+    TableRowColumnSelectorHandler.prototype.dispose = function () {
+        var _a;
+        (_a = this.disposer) === null || _a === void 0 ? void 0 : _a.call(this);
+        this.disposer = undefined;
+    };
+    return TableRowColumnSelectorHandler;
+}(DragAndDropHelper));
+/**
+ * @internal
+ * Helper function to calculate current row/column index from mouse coordinates during drag
+ */
+function getCurrentIndexFromMouse(table, x, y, isRow) {
+    if (isRow) {
+        for (var i = 0; i < table.rows.length; i++) {
+            var row = table.rows[i];
+            for (var j = 0; j < row.cells.length; j++) {
+                var cell = row.cells[j];
+                var cellRect = normalizeRect(cell.getBoundingClientRect());
+                if (cellRect && y >= cellRect.top && y <= cellRect.bottom) {
+                    return i;
+                }
+            }
+        }
+        return Math.max(0, table.rows.length - 1);
+    }
+    else {
+        if (!table.rows[0]) {
+            return 0;
+        }
+        var firstRow = table.rows[0];
+        for (var i = 0; i < firstRow.cells.length; i++) {
+            var cell = firstRow.cells[i];
+            var cellRect = normalizeRect(cell.getBoundingClientRect());
+            if (cellRect && x >= cellRect.left && x <= cellRect.right) {
+                return i;
+            }
+        }
+        return firstRow.cells.length - 1;
+    }
+}
+/**
+ * @internal
+ * Exported for testing
+ */
+export function onDragStart(context, event) {
+    var table = context.table, editor = context.editor, isRow = context.isRow;
+    editor.setDOMSelection(null);
+    var parsedTable = parseTableCells(table);
+    var startIndex = getCurrentIndexFromMouse(table, event.clientX, event.clientY, isRow);
+    if (isRow) {
+        var columnNumber = parsedTable[startIndex].length - 1;
+        var initialSelection = {
+            type: 'table',
+            table: table,
+            firstRow: startIndex,
+            lastRow: startIndex,
+            firstColumn: 0,
+            lastColumn: columnNumber,
+        };
+        return {
+            cmTable: undefined,
+            initialSelection: initialSelection,
+            parsedTable: parsedTable,
+            startIndex: startIndex,
+        };
+    }
+    else {
+        var rowNumber = parsedTable.length - 1;
+        var initialSelection = {
+            type: 'table',
+            table: table,
+            firstRow: 0,
+            lastRow: rowNumber,
+            firstColumn: startIndex,
+            lastColumn: startIndex,
+        };
+        return {
+            cmTable: undefined,
+            initialSelection: initialSelection,
+            parsedTable: parsedTable,
+            startIndex: startIndex,
+        };
+    }
+}
+/**
+ * @internal
+ * Exported for testing
+ */
+export function onDragging(context, event, initValue) {
+    if (!initValue) {
+        return false;
+    }
+    var table = context.table, editor = context.editor, isRow = context.isRow;
+    var parsedTable = initValue.parsedTable, startIndex = initValue.startIndex;
+    var currentIndex = getCurrentIndexFromMouse(table, event.clientX, event.clientY, isRow);
+    if (isRow) {
+        var columnNumber = parsedTable[startIndex].length - 1;
+        var firstRow = Math.min(startIndex, currentIndex);
+        var lastRow = Math.max(startIndex, currentIndex);
+        editor.setDOMSelection({
+            type: 'table',
+            table: table,
+            firstRow: firstRow,
+            firstColumn: 0,
+            lastRow: lastRow,
+            lastColumn: columnNumber,
+        });
+    }
+    else {
+        var firstColumn = Math.min(startIndex, currentIndex);
+        var lastColumn = Math.max(startIndex, currentIndex);
+        var rowNumber = parsedTable.length - 1;
+        editor.setDOMSelection({
+            type: 'table',
+            table: table,
+            firstRow: 0,
+            firstColumn: firstColumn,
+            lastColumn: lastColumn,
+            lastRow: rowNumber,
+        });
+    }
+    return true;
+}
+/**
+ * @internal
+ * Exported for testing
+ */
+export function onDragEnd(context, event, initValue) {
+    if (!initValue) {
+        return false;
+    }
+    var editor = context.editor;
+    var selection = editor.getDOMSelection();
+    if ((selection === null || selection === void 0 ? void 0 : selection.type) !== 'table') {
+        editor.setDOMSelection(initValue.initialSelection);
+    }
+    return true;
+}
+function getInsertElementData(rect, isRowSelector) {
+    var MIN_DISTANCE_FROM_BOUNDARY = 5;
+    var GAP_FROM_CELL = 5;
+    var cellLength = isRowSelector ? rect.bottom - rect.top : rect.right - rect.left;
+    var maxSelectorSize = Math.max(16, cellLength - MIN_DISTANCE_FROM_BOUNDARY * 2);
+    var SELECTOR_SIZE = cellLength >= 32 ? Math.min(cellLength - 16, maxSelectorSize) : 16;
+    var centerOffset = (cellLength - SELECTOR_SIZE) / 2;
+    var size = isRowSelector
+        ? "width: 5px; height: " + SELECTOR_SIZE + "px; top: " + (rect.top + centerOffset) + "px; left: " + (rect.left - 5 - GAP_FROM_CELL) + "px"
+        : "width: " + SELECTOR_SIZE + "px; height: 5px; top: " + (rect.top - 5 - GAP_FROM_CELL) + "px; left: " + (rect.left + centerOffset) + "px";
+    var cursor = isRowSelector
+        ? "url(\"" + STABLE_RIGHT_ARROW_CURSOR + "\"), auto"
+        : "url(\"" + STABLE_DOWN_ARROW_CURSOR + "\") , auto";
+    var outerDivStyle = "position: fixed; " + size + "; background-color: transparent; cursor: " + cursor + "; pointer-events: auto;";
+    return {
+        tag: 'div',
+        style: outerDivStyle,
+    };
+}
+//# sourceMappingURL=TableRowColumnSelector.js.map

package/lib-mjs/tableEdit/editors/features/TableRowColumnSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRowColumnSelector.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableRowColumnSelector.ts"],"names":[],"mappings":"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","sourcesContent":["import { createElement } from '../../../pluginUtils/CreateElement/createElement';\r\nimport { DragAndDropHelper } from '../../../pluginUtils/DragAndDrop/DragAndDropHelper';\r\nimport { normalizeRect, parseTableCells } from 'roosterjs-content-model-dom';\r\nimport type { CreateElementData } from '../../../pluginUtils/CreateElement/CreateElementData';\r\nimport type { DragAndDropHandler } from '../../../pluginUtils/DragAndDrop/DragAndDropHandler';\r\nimport type { Disposable } from '../../../pluginUtils/Disposable';\r\nimport type { TableEditFeature } from './TableEditFeature';\r\nimport type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';\r\nimport type {\r\n    DOMSelection,\r\n    IEditor,\r\n    ParsedTable,\r\n    ReadonlyContentModelTable,\r\n    Rect,\r\n    TableSelection,\r\n} from 'roosterjs-content-model-types';\r\n\r\nconst STABLE_DOWN_ARROW_CURSOR =\r\n    'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij48dGV4dCB4PSI4IiB5PSIxMiIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZm9udC1zaXplPSIxNCIgZmlsbD0iYmxhY2siPiYjMTI5MDk1OzwvdGV4dD48L3N2Zz4=';\r\n\r\nconst STABLE_RIGHT_ARROW_CURSOR =\r\n    'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij48dGV4dCB4PSI4IiB5PSIxMiIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZm9udC1zaXplPSIxNCIgZmlsbD0iYmxhY2siIHRyYW5zZm9ybT0icm90YXRlKC05MCA4IDgpIj4mIzEyOTA5NTs8L3RleHQ+PC9zdmc+';\r\n\r\n/**\r\n * @internal\r\n */\r\nexport function createTableRowColumnSelector(\r\n    editor: IEditor,\r\n    table: HTMLTableElement,\r\n    isRowSelector: boolean,\r\n    anchorContainer?: HTMLElement,\r\n    onTableEditorCreated?: OnTableEditorCreatedCallback\r\n): TableEditFeature | null {\r\n    const doc = editor.getDocument();\r\n    const zoomScale = editor.getDOMHelper().calculateZoomScale();\r\n\r\n    const containerDiv = doc.createElement('div');\r\n    containerDiv.style.cssText = 'position: fixed; pointer-events: none;';\r\n\r\n    const cells = isRowSelector\r\n        ? Array.from(table.rows)\r\n              .map(row => row.cells[0])\r\n              .filter(cell => cell)\r\n        : Array.from(table.rows[0]?.cells || []);\r\n\r\n    const handlers: TableRowColumnSelectorHandler[] = [];\r\n\r\n    cells.forEach(cell => {\r\n        const cellRect = normalizeRect(cell.getBoundingClientRect());\r\n        if (cellRect) {\r\n            const createElementData = getInsertElementData(cellRect, isRowSelector);\r\n            const cellDiv = createElement(createElementData, doc) as HTMLDivElement;\r\n            containerDiv.appendChild(cellDiv);\r\n\r\n            const context: TableRowColumnSelectorContext = {\r\n                table,\r\n                zoomScale,\r\n                editor,\r\n                div: cellDiv,\r\n                isRow: isRowSelector,\r\n            };\r\n\r\n            const handler = new TableRowColumnSelectorHandler(\r\n                cellDiv,\r\n                isRowSelector,\r\n                context,\r\n                {\r\n                    onDragStart,\r\n                    onDragging,\r\n                    onDragEnd,\r\n                },\r\n                zoomScale,\r\n                onTableEditorCreated,\r\n                editor.getEnvironment().isMobileOrTablet\r\n            );\r\n            handlers.push(handler);\r\n        }\r\n    });\r\n\r\n    (anchorContainer || doc.body).appendChild(containerDiv);\r\n\r\n    const compositeHandler: Disposable = {\r\n        dispose: () => {\r\n            handlers.forEach(h => h.dispose());\r\n        },\r\n    };\r\n\r\n    return { div: containerDiv, featureHandler: compositeHandler, node: table };\r\n}\r\n\r\n/**\r\n * @internal\r\n * Exported for testing\r\n */\r\nexport interface TableRowColumnSelectorContext {\r\n    table: HTMLTableElement;\r\n    zoomScale: number;\r\n    editor: IEditor;\r\n    div: HTMLElement;\r\n    isRow: boolean;\r\n}\r\n\r\n/**\r\n *  @internal\r\n */\r\nexport interface TableRowColumnSelectorInitValue {\r\n    cmTable: ReadonlyContentModelTable | undefined;\r\n    initialSelection: DOMSelection | null;\r\n    parsedTable: ParsedTable;\r\n    startIndex: number;\r\n}\r\n\r\nclass TableRowColumnSelectorHandler\r\n    extends DragAndDropHelper<TableRowColumnSelectorContext, TableRowColumnSelectorInitValue>\r\n    implements Disposable {\r\n    private disposer: undefined | (() => void);\r\n    constructor(\r\n        div: HTMLDivElement,\r\n        private isRow: boolean,\r\n        context: TableRowColumnSelectorContext,\r\n        handler: DragAndDropHandler<TableRowColumnSelectorContext, TableRowColumnSelectorInitValue>,\r\n        zoomScale: number,\r\n        onTableEditorCreated?: OnTableEditorCreatedCallback,\r\n        forceMobile?: boolean | undefined\r\n    ) {\r\n        super(div, context, () => {}, handler, zoomScale, forceMobile);\r\n        this.disposer = onTableEditorCreated?.(\r\n            this.isRow ? 'TableRowSelector' : 'TableColumnSelector',\r\n            div\r\n        );\r\n    }\r\n\r\n    dispose() {\r\n        this.disposer?.();\r\n        this.disposer = undefined;\r\n    }\r\n}\r\n\r\n/**\r\n * @internal\r\n * Helper function to calculate current row/column index from mouse coordinates during drag\r\n */\r\nfunction getCurrentIndexFromMouse(\r\n    table: HTMLTableElement,\r\n    x: number,\r\n    y: number,\r\n    isRow: boolean\r\n): number {\r\n    if (isRow) {\r\n        for (let i = 0; i < table.rows.length; i++) {\r\n            const row = table.rows[i];\r\n\r\n            for (let j = 0; j < row.cells.length; j++) {\r\n                const cell = row.cells[j];\r\n                const cellRect = normalizeRect(cell.getBoundingClientRect());\r\n                if (cellRect && y >= cellRect.top && y <= cellRect.bottom) {\r\n                    return i;\r\n                }\r\n            }\r\n        }\r\n        return Math.max(0, table.rows.length - 1);\r\n    } else {\r\n        if (!table.rows[0]) {\r\n            return 0;\r\n        }\r\n        const firstRow = table.rows[0];\r\n        for (let i = 0; i < firstRow.cells.length; i++) {\r\n            const cell = firstRow.cells[i];\r\n            const cellRect = normalizeRect(cell.getBoundingClientRect());\r\n            if (cellRect && x >= cellRect.left && x <= cellRect.right) {\r\n                return i;\r\n            }\r\n        }\r\n        return firstRow.cells.length - 1;\r\n    }\r\n}\r\n\r\n/**\r\n * @internal\r\n * Exported for testing\r\n */\r\nexport function onDragStart(\r\n    context: TableRowColumnSelectorContext,\r\n    event: MouseEvent\r\n): TableRowColumnSelectorInitValue {\r\n    const { table, editor, isRow } = context;\r\n    editor.setDOMSelection(null);\r\n\r\n    const parsedTable = parseTableCells(table);\r\n\r\n    const startIndex = getCurrentIndexFromMouse(table, event.clientX, event.clientY, isRow);\r\n\r\n    if (isRow) {\r\n        const columnNumber = parsedTable[startIndex].length - 1;\r\n        const initialSelection: TableSelection = {\r\n            type: 'table',\r\n            table,\r\n            firstRow: startIndex,\r\n            lastRow: startIndex,\r\n            firstColumn: 0,\r\n            lastColumn: columnNumber,\r\n        };\r\n\r\n        return {\r\n            cmTable: undefined,\r\n            initialSelection,\r\n\r\n            parsedTable,\r\n            startIndex,\r\n        };\r\n    } else {\r\n        const rowNumber = parsedTable.length - 1;\r\n        const initialSelection: TableSelection = {\r\n            type: 'table',\r\n            table,\r\n            firstRow: 0,\r\n            lastRow: rowNumber,\r\n            firstColumn: startIndex,\r\n            lastColumn: startIndex,\r\n        };\r\n\r\n        return {\r\n            cmTable: undefined,\r\n            initialSelection,\r\n\r\n            parsedTable,\r\n            startIndex,\r\n        };\r\n    }\r\n}\r\n\r\n/**\r\n * @internal\r\n * Exported for testing\r\n */\r\nexport function onDragging(\r\n    context: TableRowColumnSelectorContext,\r\n    event: MouseEvent,\r\n    initValue: TableRowColumnSelectorInitValue | undefined\r\n): boolean {\r\n    if (!initValue) {\r\n        return false;\r\n    }\r\n\r\n    const { table, editor, isRow } = context;\r\n    const { parsedTable, startIndex } = initValue;\r\n\r\n    const currentIndex = getCurrentIndexFromMouse(table, event.clientX, event.clientY, isRow);\r\n\r\n    if (isRow) {\r\n        const columnNumber = parsedTable[startIndex].length - 1;\r\n        const firstRow = Math.min(startIndex, currentIndex);\r\n        const lastRow = Math.max(startIndex, currentIndex);\r\n\r\n        editor.setDOMSelection({\r\n            type: 'table',\r\n            table: table,\r\n            firstRow,\r\n            firstColumn: 0,\r\n            lastRow,\r\n            lastColumn: columnNumber,\r\n        });\r\n    } else {\r\n        const firstColumn = Math.min(startIndex, currentIndex);\r\n        const lastColumn = Math.max(startIndex, currentIndex);\r\n        const rowNumber = parsedTable.length - 1;\r\n\r\n        editor.setDOMSelection({\r\n            type: 'table',\r\n            table: table,\r\n            firstRow: 0,\r\n            firstColumn,\r\n            lastColumn,\r\n            lastRow: rowNumber,\r\n        });\r\n    }\r\n\r\n    return true;\r\n}\r\n\r\n/**\r\n * @internal\r\n * Exported for testing\r\n */\r\nexport function onDragEnd(\r\n    context: TableRowColumnSelectorContext,\r\n    event: MouseEvent,\r\n    initValue: TableRowColumnSelectorInitValue | undefined\r\n): boolean {\r\n    if (!initValue) {\r\n        return false;\r\n    }\r\n\r\n    const { editor } = context;\r\n    const selection = editor.getDOMSelection();\r\n\r\n    if (selection?.type !== 'table') {\r\n        editor.setDOMSelection(initValue.initialSelection);\r\n    }\r\n\r\n    return true;\r\n}\r\n\r\nfunction getInsertElementData(rect: Rect, isRowSelector: boolean): CreateElementData {\r\n    const MIN_DISTANCE_FROM_BOUNDARY = 5;\r\n    const GAP_FROM_CELL = 5;\r\n    const cellLength = isRowSelector ? rect.bottom - rect.top : rect.right - rect.left;\r\n\r\n    const maxSelectorSize = Math.max(16, cellLength - MIN_DISTANCE_FROM_BOUNDARY * 2);\r\n    const SELECTOR_SIZE = cellLength >= 32 ? Math.min(cellLength - 16, maxSelectorSize) : 16;\r\n\r\n    const centerOffset = (cellLength - SELECTOR_SIZE) / 2;\r\n\r\n    const size = isRowSelector\r\n        ? `width: 5px; height: ${SELECTOR_SIZE}px; top: ${rect.top + centerOffset}px; left: ${\r\n              rect.left - 5 - GAP_FROM_CELL\r\n          }px`\r\n        : `width: ${SELECTOR_SIZE}px; height: 5px; top: ${rect.top - 5 - GAP_FROM_CELL}px; left: ${\r\n              rect.left + centerOffset\r\n          }px`;\r\n\r\n    const cursor = isRowSelector\r\n        ? `url(\"${STABLE_RIGHT_ARROW_CURSOR}\"), auto`\r\n        : `url(\"${STABLE_DOWN_ARROW_CURSOR}\") , auto`;\r\n\r\n    const outerDivStyle = `position: fixed; ${size}; background-color: transparent; cursor: ${cursor}; pointer-events: auto;`;\r\n    return {\r\n        tag: 'div',\r\n        style: outerDivStyle,\r\n    };\r\n}\r\n"]}

package/lib-mjs/tableEdit/editors/utils/getTableFromContentModel.d.ts

@@ -1,6 +1,6 @@
-import type { IEditor } from 'roosterjs-content-model-types';
-/**
- * @internal
- * Get ContentModelTable from a table element if it is present in the content model
- */
-export declare function getCMTableFromTable(editor: IEditor, table: HTMLTableElement): import("roosterjs-content-model-types").ContentModelTable | undefined;
+import type { IEditor } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ * Get ContentModelTable from a table element if it is present in the content model
+ */
+export declare function getCMTableFromTable(editor: IEditor, table: HTMLTableElement): import("roosterjs-content-model-types").ContentModelTable | undefined;

package/lib-mjs/tableEdit/editors/utils/getTableFromContentModel.js

@@ -1,16 +1,17 @@
-import { createContentModelDocument, createDomToModelContext } from 'roosterjs-content-model-dom';
-/**
- * @internal
- * Get ContentModelTable from a table element if it is present in the content model
- */
-export function getCMTableFromTable(editor, table) {
-    var model = createContentModelDocument();
-    var context = createDomToModelContext({
-        zoomScale: editor.getDOMHelper().calculateZoomScale(),
-        recalculateTableSize: true,
-    });
-    context.elementProcessors.element(model, table, context);
-    var firstBlock = model.blocks[0];
-    return (firstBlock === null || firstBlock === void 0 ? void 0 : firstBlock.blockType) == 'Table' ? firstBlock : undefined;
-}
+import { createContentModelDocument, createDomToModelContext } from 'roosterjs-content-model-dom';
+/**
+ * @internal
+ * Get ContentModelTable from a table element if it is present in the content model
+ */
+export function getCMTableFromTable(editor, table) {
+    var model = createContentModelDocument();
+    var context = createDomToModelContext({
+        zoomScale: editor.getDOMHelper().calculateZoomScale(),
+        recalculateTableSize: true,
+        allowCacheElement: true, // We need this cache so we can retrieve TD element and update TD width and height when resizing table
+    });
+    context.elementProcessors.element(model, table, context);
+    var firstBlock = model.blocks[0];
+    return (firstBlock === null || firstBlock === void 0 ? void 0 : firstBlock.blockType) == 'Table' ? firstBlock : undefined;
+}
 //# sourceMappingURL=getTableFromContentModel.js.map

package/lib-mjs/tableEdit/editors/utils/getTableFromContentModel.js.map

@@ -1 +1 @@
-{"version":3,"file":"getTableFromContentModel.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/utils/getTableFromContentModel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AAGlG;;;GAGG;AACH,MAAM,UAAU,mBAAmB,CAAC,MAAe,EAAE,KAAuB;IACxE,IAAM,KAAK,GAAG,0BAA0B,EAAE,CAAC;IAC3C,IAAM,OAAO,GAAG,uBAAuB,CAAC;QACpC,SAAS,EAAE,MAAM,CAAC,YAAY,EAAE,CAAC,kBAAkB,EAAE;QACrD,oBAAoB,EAAE,IAAI;KAC7B,CAAC,CAAC;IAEH,OAAO,CAAC,iBAAiB,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;IAEzD,IAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAEnC,OAAO,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,SAAS,KAAI,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC;AACrE,CAAC","sourcesContent":["import { createContentModelDocument, createDomToModelContext } from 'roosterjs-content-model-dom';\nimport type { IEditor } from 'roosterjs-content-model-types';\n\n/**\n * @internal\n * Get ContentModelTable from a table element if it is present in the content model\n */\nexport function getCMTableFromTable(editor: IEditor, table: HTMLTableElement) {\n    const model = createContentModelDocument();\n    const context = createDomToModelContext({\n        zoomScale: editor.getDOMHelper().calculateZoomScale(),\n        recalculateTableSize: true,\n    });\n\n    context.elementProcessors.element(model, table, context);\n\n    const firstBlock = model.blocks[0];\n\n    return firstBlock?.blockType == 'Table' ? firstBlock : undefined;\n}\n"]}
+{"version":3,"file":"getTableFromContentModel.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/utils/getTableFromContentModel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AAGlG;;;GAGG;AACH,MAAM,UAAU,mBAAmB,CAAC,MAAe,EAAE,KAAuB;IACxE,IAAM,KAAK,GAAG,0BAA0B,EAAE,CAAC;IAC3C,IAAM,OAAO,GAAG,uBAAuB,CAAC;QACpC,SAAS,EAAE,MAAM,CAAC,YAAY,EAAE,CAAC,kBAAkB,EAAE;QACrD,oBAAoB,EAAE,IAAI;QAC1B,iBAAiB,EAAE,IAAI,EAAE,sGAAsG;KAClI,CAAC,CAAC;IAEH,OAAO,CAAC,iBAAiB,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;IAEzD,IAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAEnC,OAAO,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,SAAS,KAAI,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC;AACrE,CAAC","sourcesContent":["import { createContentModelDocument, createDomToModelContext } from 'roosterjs-content-model-dom';\r\nimport type { IEditor } from 'roosterjs-content-model-types';\r\n\r\n/**\r\n * @internal\r\n * Get ContentModelTable from a table element if it is present in the content model\r\n */\r\nexport function getCMTableFromTable(editor: IEditor, table: HTMLTableElement) {\r\n    const model = createContentModelDocument();\r\n    const context = createDomToModelContext({\r\n        zoomScale: editor.getDOMHelper().calculateZoomScale(),\r\n        recalculateTableSize: true,\r\n        allowCacheElement: true, // We need this cache so we can retrieve TD element and update TD width and height when resizing table\r\n    });\r\n\r\n    context.elementProcessors.element(model, table, context);\r\n\r\n    const firstBlock = model.blocks[0];\r\n\r\n    return firstBlock?.blockType == 'Table' ? firstBlock : undefined;\r\n}\r\n"]}

package/lib-mjs/touch/TouchPlugin.d.ts

@@ -1,32 +1,32 @@
-import type { EditorPlugin, IEditor, PluginEvent } from 'roosterjs-content-model-types';
-/**
- * Touch plugin to manage touch behaviors
- */
-export declare class TouchPlugin implements EditorPlugin {
-    private editor;
-    private timer;
-    private isDblClicked;
-    private isTouchPenPointerEvent;
-    /**
-     * Create an instance of Touch plugin
-     */
-    constructor();
-    /**
-     * Get a friendly name of  this plugin
-     */
-    getName(): string;
-    /**
-     * Initialize this plugin. This should only be called from Editor
-     * @param editor Editor instance
-     */
-    initialize(editor: IEditor): void;
-    /**
-     * Dispose this plugin
-     */
-    dispose(): void;
-    /**
-     * Handle events triggered from editor
-     * @param event PluginEvent object
-     */
-    onPluginEvent(event: PluginEvent): void;
-}
+import type { EditorPlugin, IEditor, PluginEvent } from 'roosterjs-content-model-types';
+/**
+ * Touch plugin to manage touch behaviors
+ */
+export declare class TouchPlugin implements EditorPlugin {
+    private editor;
+    private timer;
+    private isDblClicked;
+    private isTouchPenPointerEvent;
+    /**
+     * Create an instance of Touch plugin
+     */
+    constructor();
+    /**
+     * Get a friendly name of  this plugin
+     */
+    getName(): string;
+    /**
+     * Initialize this plugin. This should only be called from Editor
+     * @param editor Editor instance
+     */
+    initialize(editor: IEditor): void;
+    /**
+     * Dispose this plugin
+     */
+    dispose(): void;
+    /**
+     * Handle events triggered from editor
+     * @param event PluginEvent object
+     */
+    onPluginEvent(event: PluginEvent): void;
+}