roosterjs-content-model-plugins 9.4.0 → 9.5.0

package/lib-amd/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":"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","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    normalizeTable,\n} from 'roosterjs-content-model-dom';\nimport type { DragAndDropHandler } from '../../../pluginUtils/DragAndDrop/DragAndDropHandler';\nimport type { ContentModelTable, IEditor } from 'roosterjs-content-model-types';\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): 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: DragAndDropContext = { editor, td, table, isRTL, zoomScale, onStart };\n    const setPosition = isHorizontal ? setHorizontalPosition : setVerticalPosition;\n    setPosition(context, div);\n\n    const handler: DragAndDropHandler<DragAndDropContext, DragAndDropInitValue> = {\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 DragAndDropHelper<DragAndDropContext, DragAndDropInitValue>(\n        div,\n        context,\n        setPosition,\n        handler,\n        zoomScale,\n        editor.getEnvironment().isMobileOrTablet\n    );\n\n    return { node: td, div, featureHandler };\n}\n\ninterface DragAndDropContext {\n    editor: IEditor;\n    td: HTMLTableCellElement;\n    table: HTMLTableElement;\n    isRTL: boolean;\n    zoomScale: number;\n    onStart: () => void;\n}\n\ninterface DragAndDropInitValue {\n    cmTable: ContentModelTable | undefined;\n    anchorColumn: number | undefined;\n    anchorRow: number | undefined;\n    anchorRowHeight: number;\n    allWidths: number[];\n}\n\nfunction onDragStart(context: DragAndDropContext, event: MouseEvent): DragAndDropInitValue {\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\nfunction onDraggingHorizontal(\n    context: DragAndDropContext,\n    event: MouseEvent,\n    initValue: DragAndDropInitValue,\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) {\n        // Modify the CM Table size\n        cmTable.rows[anchorRow].height = (anchorRowHeight ?? 0) + deltaY;\n\n        // Normalize the table\n        normalizeTable(cmTable);\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 = cmTable.rows[anchorRow].height + 'px';\n        }\n\n        return true;\n    } else {\n        return false;\n    }\n}\n\nfunction onDraggingVertical(\n    context: DragAndDropContext,\n    event: MouseEvent,\n    initValue: DragAndDropInitValue,\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        // 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            cmTable.widths[anchorColumn] = allWidths[anchorColumn] + change;\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            cmTable.widths[anchorColumn] = anchorChange;\n            cmTable.widths[anchorColumn + 1] = nextAnchorChange;\n        }\n\n        // Normalize the table\n        normalizeTable(cmTable);\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                tableRow.cells[col].style.width = cmTable.widths[col] + 'px';\n            }\n        }\n\n        return true;\n    } else {\n        return false;\n    }\n}\n\nfunction setHorizontalPosition(context: DragAndDropContext, 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: DragAndDropContext, 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';\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} from 'roosterjs-content-model-dom';\nimport type { DragAndDropHandler } from '../../../pluginUtils/DragAndDrop/DragAndDropHandler';\nimport type { IEditor, ReadonlyContentModelTable } from 'roosterjs-content-model-types';\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): 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 = { editor, td, table, isRTL, zoomScale, onStart };\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 DragAndDropHelper<CellResizerContext, CellResizerInitValue>(\n        div,\n        context,\n        setPosition,\n        handler,\n        zoomScale,\n        editor.getEnvironment().isMobileOrTablet\n    );\n\n    return { node: td, div, featureHandler };\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    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        }\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                tableRow.cells[col].style.width = cmTable.widths[col] + 'px';\n            }\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"]}

package/lib-amd/tableEdit/editors/features/TableInserter.d.ts

@@ -1,5 +1,6 @@
 import type { TableEditFeature } from './TableEditFeature';
 import type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';
+import type { Disposable } from '../../../pluginUtils/Disposable';
 import type { IEditor } from 'roosterjs-content-model-types';
 /**
  * @internal
@@ -13,3 +14,19 @@ export declare const VERTICAL_INSERTER_ID = "verticalInserter";
  * @internal
  */
 export declare function createTableInserter(editor: IEditor, td: HTMLTableCellElement, table: HTMLTableElement, isRTL: boolean, isHorizontal: boolean, onInsert: () => void, anchorContainer?: HTMLElement, onTableEditorCreated?: OnTableEditorCreatedCallback): TableEditFeature | null;
+/**
+ * @internal
+ * Exported for test only
+ */
+export declare class TableInsertHandler implements Disposable {
+    private div;
+    private td;
+    private table;
+    private isHorizontal;
+    private editor;
+    private onInsert;
+    private disposer;
+    constructor(div: HTMLDivElement, td: HTMLTableCellElement, table: HTMLTableElement, isHorizontal: boolean, editor: IEditor, onInsert: () => void, onTableEditorCreated?: OnTableEditorCreatedCallback);
+    dispose(): void;
+    private insertTd;
+}

package/lib-amd/tableEdit/editors/features/TableInserter.js

@@ -1,7 +1,7 @@
 define(["require", "exports", "../../../pluginUtils/CreateElement/createElement", "../../../pluginUtils/Rect/getIntersectedRect", "roosterjs-content-model-dom", "roosterjs-content-model-api"], function (require, exports, createElement_1, getIntersectedRect_1, roosterjs_content_model_dom_1, roosterjs_content_model_api_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.createTableInserter = exports.VERTICAL_INSERTER_ID = exports.HORIZONTAL_INSERTER_ID = void 0;
+    exports.TableInsertHandler = exports.createTableInserter = exports.VERTICAL_INSERTER_ID = exports.HORIZONTAL_INSERTER_ID = void 0;
     var INSERTER_COLOR = '#4A4A4A';
     var INSERTER_COLOR_DARK_MODE = 'white';
     var INSERTER_SIDE_LENGTH = 12;
@@ -49,6 +49,10 @@ define(["require", "exports", "../../../pluginUtils/CreateElement/createElement"
         return null;
     }
     exports.createTableInserter = createTableInserter;
+    /**
+     * @internal
+     * Exported for test only
+     */
     var TableInsertHandler = /** @class */ (function () {
         function TableInsertHandler(div, td, table, isHorizontal, editor, onInsert, onTableEditorCreated) {
             var _this = this;
@@ -95,6 +99,7 @@ define(["require", "exports", "../../../pluginUtils/CreateElement/createElement"
         };
         return TableInsertHandler;
     }());
+    exports.TableInsertHandler = TableInsertHandler;
     function getInsertElementData(isHorizontal, isDark, isRTL, backgroundColor) {
         var inserterColor = isDark ? INSERTER_COLOR_DARK_MODE : INSERTER_COLOR;
         var outerDivStyle = "position: fixed; width: " + INSERTER_SIDE_LENGTH + "px; height: " + INSERTER_SIDE_LENGTH + "px; font-size: 16px; color: black; line-height: 8px; vertical-align: middle; text-align: center; cursor: pointer; border: solid " + INSERTER_BORDER_SIZE + "px " + inserterColor + "; border-radius: 50%; background-color: " + backgroundColor;

package/lib-amd/tableEdit/editors/features/TableInserter.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableInserter.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableInserter.ts"],"names":[],"mappings":"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","sourcesContent":["import { createElement } from '../../../pluginUtils/CreateElement/createElement';\nimport { getIntersectedRect } from '../../../pluginUtils/Rect/getIntersectedRect';\nimport { isElementOfType, normalizeRect } from 'roosterjs-content-model-dom';\nimport type { TableEditFeature } from './TableEditFeature';\nimport type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';\nimport {\n    formatTableWithContentModel,\n    insertTableColumn,\n    insertTableRow,\n} from 'roosterjs-content-model-api';\nimport type { CreateElementData } from '../../../pluginUtils/CreateElement/CreateElementData';\nimport type { Disposable } from '../../../pluginUtils/Disposable';\nimport type { IEditor } from 'roosterjs-content-model-types';\n\nconst INSERTER_COLOR = '#4A4A4A';\nconst INSERTER_COLOR_DARK_MODE = 'white';\nconst INSERTER_SIDE_LENGTH = 12;\nconst INSERTER_BORDER_SIZE = 1;\n/**\n * @internal\n */\nexport const HORIZONTAL_INSERTER_ID = 'horizontalInserter';\n/**\n * @internal\n */\nexport const VERTICAL_INSERTER_ID = 'verticalInserter';\n\n/**\n * @internal\n */\nexport function createTableInserter(\n    editor: IEditor,\n    td: HTMLTableCellElement,\n    table: HTMLTableElement,\n    isRTL: boolean,\n    isHorizontal: boolean,\n    onInsert: () => void,\n    anchorContainer?: HTMLElement,\n    onTableEditorCreated?: OnTableEditorCreatedCallback\n): TableEditFeature | null {\n    const tdRect = normalizeRect(td.getBoundingClientRect());\n    const viewPort = editor.getVisibleViewport();\n    const tableRect = table && viewPort ? getIntersectedRect([table], [viewPort]) : null;\n\n    // set inserter position\n    if (tdRect && tableRect) {\n        const document = td.ownerDocument;\n        const createElementData = getInsertElementData(\n            isHorizontal,\n            editor.isDarkMode(),\n            isRTL,\n            editor.getDOMHelper().getDomStyle('backgroundColor') || 'white'\n        );\n\n        const div = createElement(createElementData, document) as HTMLDivElement;\n\n        if (isHorizontal) {\n            // tableRect.left/right is used because the Inserter is always intended to be on the side\n            div.id = HORIZONTAL_INSERTER_ID;\n            div.style.left = `${\n                isRTL\n                    ? tableRect.right\n                    : tableRect.left - (INSERTER_SIDE_LENGTH - 1 + 2 * INSERTER_BORDER_SIZE)\n            }px`;\n            div.style.top = `${tdRect.bottom - 8}px`;\n            (div.firstChild as HTMLElement).style.width = `${tableRect.right - tableRect.left}px`;\n        } else {\n            div.id = VERTICAL_INSERTER_ID;\n            div.style.left = `${isRTL ? tdRect.left - 8 : tdRect.right - 8}px`;\n            // tableRect.top is used because the Inserter is always intended to be on top\n            div.style.top = `${\n                tableRect.top - (INSERTER_SIDE_LENGTH - 1 + 2 * INSERTER_BORDER_SIZE)\n            }px`;\n            (div.firstChild as HTMLElement).style.height = `${tableRect.bottom - tableRect.top}px`;\n        }\n\n        (anchorContainer || document.body).appendChild(div);\n\n        const handler = new TableInsertHandler(\n            div,\n            td,\n            table,\n            isHorizontal,\n            editor,\n            onInsert,\n            onTableEditorCreated\n        );\n\n        return { div, featureHandler: handler, node: td };\n    }\n\n    return null;\n}\n\nclass TableInsertHandler implements Disposable {\n    private disposer: undefined | (() => void);\n    constructor(\n        private div: HTMLDivElement,\n        private td: HTMLTableCellElement,\n        private table: HTMLTableElement,\n        private isHorizontal: boolean,\n        private editor: IEditor,\n        private onInsert: () => void,\n        onTableEditorCreated?: OnTableEditorCreatedCallback\n    ) {\n        this.div.addEventListener('click', this.insertTd);\n        this.disposer = onTableEditorCreated?.(\n            isHorizontal ? 'HorizontalTableInserter' : 'VerticalTableInserter',\n            div\n        );\n    }\n\n    dispose() {\n        this.div.removeEventListener('click', this.insertTd);\n        this.disposer?.();\n        this.disposer = undefined;\n    }\n\n    private insertTd = () => {\n        // Get cell coordinates\n        const columnIndex = this.td.cellIndex;\n        const row =\n            this.td.parentElement && isElementOfType(this.td.parentElement, 'tr')\n                ? this.td.parentElement\n                : undefined;\n        const rowIndex = row && row.rowIndex;\n\n        if (row?.cells == undefined || rowIndex == undefined) {\n            return;\n        }\n\n        // Insert row or column\n        formatTableWithContentModel(\n            this.editor,\n            'editTablePlugin',\n            tableModel => {\n                this.isHorizontal\n                    ? insertTableRow(tableModel, 'insertBelow')\n                    : insertTableColumn(tableModel, 'insertRight');\n            }, // Select cell to make insertion\n            {\n                type: 'table',\n                firstColumn: columnIndex,\n                firstRow: rowIndex,\n                lastColumn: columnIndex,\n                lastRow: rowIndex,\n                table: this.table,\n            }\n        );\n\n        this.onInsert();\n    };\n}\n\nfunction getInsertElementData(\n    isHorizontal: boolean,\n    isDark: boolean,\n    isRTL: boolean,\n    backgroundColor: string\n): CreateElementData {\n    const inserterColor = isDark ? INSERTER_COLOR_DARK_MODE : INSERTER_COLOR;\n    const outerDivStyle = `position: fixed; width: ${INSERTER_SIDE_LENGTH}px; height: ${INSERTER_SIDE_LENGTH}px; font-size: 16px; color: black; line-height: 8px; vertical-align: middle; text-align: center; cursor: pointer; border: solid ${INSERTER_BORDER_SIZE}px ${inserterColor}; border-radius: 50%; background-color: ${backgroundColor}`;\n    const leftOrRight = isRTL ? 'right' : 'left';\n    const childBaseStyles = `position: absolute; box-sizing: border-box; background-color: ${backgroundColor};`;\n    const childInfo: CreateElementData = {\n        tag: 'div',\n        style:\n            childBaseStyles +\n            (isHorizontal\n                ? `${leftOrRight}: 12px; top: 5px; height: 3px; border-top: 1px solid ${inserterColor}; border-bottom: 1px solid ${inserterColor}; border-right: 1px solid ${inserterColor}; border-left: 0px;`\n                : `left: 5px; top: 12px; width: 3px; border-left: 1px solid ${inserterColor}; border-right: 1px solid ${inserterColor}; border-bottom: 1px solid ${inserterColor}; border-top: 0px;`),\n    };\n\n    return {\n        tag: 'div',\n        style: outerDivStyle,\n        children: [childInfo, '+'],\n    };\n}\n"]}
+{"version":3,"file":"TableInserter.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableInserter.ts"],"names":[],"mappings":"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","sourcesContent":["import { createElement } from '../../../pluginUtils/CreateElement/createElement';\nimport { getIntersectedRect } from '../../../pluginUtils/Rect/getIntersectedRect';\nimport { isElementOfType, normalizeRect } from 'roosterjs-content-model-dom';\nimport type { TableEditFeature } from './TableEditFeature';\nimport type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';\nimport {\n    formatTableWithContentModel,\n    insertTableColumn,\n    insertTableRow,\n} from 'roosterjs-content-model-api';\nimport type { CreateElementData } from '../../../pluginUtils/CreateElement/CreateElementData';\nimport type { Disposable } from '../../../pluginUtils/Disposable';\nimport type { IEditor } from 'roosterjs-content-model-types';\n\nconst INSERTER_COLOR = '#4A4A4A';\nconst INSERTER_COLOR_DARK_MODE = 'white';\nconst INSERTER_SIDE_LENGTH = 12;\nconst INSERTER_BORDER_SIZE = 1;\n/**\n * @internal\n */\nexport const HORIZONTAL_INSERTER_ID = 'horizontalInserter';\n/**\n * @internal\n */\nexport const VERTICAL_INSERTER_ID = 'verticalInserter';\n\n/**\n * @internal\n */\nexport function createTableInserter(\n    editor: IEditor,\n    td: HTMLTableCellElement,\n    table: HTMLTableElement,\n    isRTL: boolean,\n    isHorizontal: boolean,\n    onInsert: () => void,\n    anchorContainer?: HTMLElement,\n    onTableEditorCreated?: OnTableEditorCreatedCallback\n): TableEditFeature | null {\n    const tdRect = normalizeRect(td.getBoundingClientRect());\n    const viewPort = editor.getVisibleViewport();\n    const tableRect = table && viewPort ? getIntersectedRect([table], [viewPort]) : null;\n\n    // set inserter position\n    if (tdRect && tableRect) {\n        const document = td.ownerDocument;\n        const createElementData = getInsertElementData(\n            isHorizontal,\n            editor.isDarkMode(),\n            isRTL,\n            editor.getDOMHelper().getDomStyle('backgroundColor') || 'white'\n        );\n\n        const div = createElement(createElementData, document) as HTMLDivElement;\n\n        if (isHorizontal) {\n            // tableRect.left/right is used because the Inserter is always intended to be on the side\n            div.id = HORIZONTAL_INSERTER_ID;\n            div.style.left = `${\n                isRTL\n                    ? tableRect.right\n                    : tableRect.left - (INSERTER_SIDE_LENGTH - 1 + 2 * INSERTER_BORDER_SIZE)\n            }px`;\n            div.style.top = `${tdRect.bottom - 8}px`;\n            (div.firstChild as HTMLElement).style.width = `${tableRect.right - tableRect.left}px`;\n        } else {\n            div.id = VERTICAL_INSERTER_ID;\n            div.style.left = `${isRTL ? tdRect.left - 8 : tdRect.right - 8}px`;\n            // tableRect.top is used because the Inserter is always intended to be on top\n            div.style.top = `${\n                tableRect.top - (INSERTER_SIDE_LENGTH - 1 + 2 * INSERTER_BORDER_SIZE)\n            }px`;\n            (div.firstChild as HTMLElement).style.height = `${tableRect.bottom - tableRect.top}px`;\n        }\n\n        (anchorContainer || document.body).appendChild(div);\n\n        const handler = new TableInsertHandler(\n            div,\n            td,\n            table,\n            isHorizontal,\n            editor,\n            onInsert,\n            onTableEditorCreated\n        );\n\n        return { div, featureHandler: handler, node: td };\n    }\n\n    return null;\n}\n\n/**\n * @internal\n * Exported for test only\n */\nexport class TableInsertHandler implements Disposable {\n    private disposer: undefined | (() => void);\n    constructor(\n        private div: HTMLDivElement,\n        private td: HTMLTableCellElement,\n        private table: HTMLTableElement,\n        private isHorizontal: boolean,\n        private editor: IEditor,\n        private onInsert: () => void,\n        onTableEditorCreated?: OnTableEditorCreatedCallback\n    ) {\n        this.div.addEventListener('click', this.insertTd);\n        this.disposer = onTableEditorCreated?.(\n            isHorizontal ? 'HorizontalTableInserter' : 'VerticalTableInserter',\n            div\n        );\n    }\n\n    dispose() {\n        this.div.removeEventListener('click', this.insertTd);\n        this.disposer?.();\n        this.disposer = undefined;\n    }\n\n    private insertTd = () => {\n        // Get cell coordinates\n        const columnIndex = this.td.cellIndex;\n        const row =\n            this.td.parentElement && isElementOfType(this.td.parentElement, 'tr')\n                ? this.td.parentElement\n                : undefined;\n        const rowIndex = row && row.rowIndex;\n\n        if (row?.cells == undefined || rowIndex == undefined) {\n            return;\n        }\n\n        // Insert row or column\n        formatTableWithContentModel(\n            this.editor,\n            'editTablePlugin',\n            tableModel => {\n                this.isHorizontal\n                    ? insertTableRow(tableModel, 'insertBelow')\n                    : insertTableColumn(tableModel, 'insertRight');\n            }, // Select cell to make insertion\n            {\n                type: 'table',\n                firstColumn: columnIndex,\n                firstRow: rowIndex,\n                lastColumn: columnIndex,\n                lastRow: rowIndex,\n                table: this.table,\n            }\n        );\n\n        this.onInsert();\n    };\n}\n\nfunction getInsertElementData(\n    isHorizontal: boolean,\n    isDark: boolean,\n    isRTL: boolean,\n    backgroundColor: string\n): CreateElementData {\n    const inserterColor = isDark ? INSERTER_COLOR_DARK_MODE : INSERTER_COLOR;\n    const outerDivStyle = `position: fixed; width: ${INSERTER_SIDE_LENGTH}px; height: ${INSERTER_SIDE_LENGTH}px; font-size: 16px; color: black; line-height: 8px; vertical-align: middle; text-align: center; cursor: pointer; border: solid ${INSERTER_BORDER_SIZE}px ${inserterColor}; border-radius: 50%; background-color: ${backgroundColor}`;\n    const leftOrRight = isRTL ? 'right' : 'left';\n    const childBaseStyles = `position: absolute; box-sizing: border-box; background-color: ${backgroundColor};`;\n    const childInfo: CreateElementData = {\n        tag: 'div',\n        style:\n            childBaseStyles +\n            (isHorizontal\n                ? `${leftOrRight}: 12px; top: 5px; height: 3px; border-top: 1px solid ${inserterColor}; border-bottom: 1px solid ${inserterColor}; border-right: 1px solid ${inserterColor}; border-left: 0px;`\n                : `left: 5px; top: 12px; width: 3px; border-left: 1px solid ${inserterColor}; border-right: 1px solid ${inserterColor}; border-bottom: 1px solid ${inserterColor}; border-top: 0px;`),\n    };\n\n    return {\n        tag: 'div',\n        style: outerDivStyle,\n        children: [childInfo, '+'],\n    };\n}\n"]}

package/lib-amd/tableEdit/editors/features/TableMover.d.ts

@@ -1,6 +1,6 @@
 import type { TableEditFeature } from './TableEditFeature';
 import type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';
-import type { ContentModelTable, DOMSelection, IEditor, Rect } from 'roosterjs-content-model-types';
+import type { DOMSelection, IEditor, ReadonlyContentModelTable, Rect } from 'roosterjs-content-model-types';
 /**
  * @internal
  */
@@ -32,7 +32,7 @@ export interface TableMoverContext {
  * Exported for testing
  */
 export interface TableMoverInitValue {
-    cmTable: ContentModelTable | undefined;
+    cmTable: ReadonlyContentModelTable | undefined;
     initialSelection: DOMSelection | null;
     tableRect: HTMLDivElement;
 }

package/lib-amd/tableEdit/editors/features/TableMover.js

@@ -204,13 +204,13 @@ define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/creat
                     var _b = (0, tslib_1.__read)((0, roosterjs_content_model_dom_1.getFirstSelectedTable)(model), 2), oldTable = _b[0], path = _b[1];
                     if (oldTable) {
                         var index = path[0].blocks.indexOf(oldTable);
-                        path[0].blocks.splice(index, 1);
+                        (0, roosterjs_content_model_dom_1.mutateBlock)(path[0]).blocks.splice(index, 1);
                     }
                     if (ip && (initValue === null || initValue === void 0 ? void 0 : initValue.cmTable)) {
                         // Insert new table
                         var doc = (0, roosterjs_content_model_dom_1.createContentModelDocument)();
-                        doc.blocks.push(initValue.cmTable);
-                        insertionSuccess_1 = !!(0, roosterjs_content_model_dom_1.mergeModel)(model, doc, context, {
+                        doc.blocks.push((0, roosterjs_content_model_dom_1.mutateBlock)(initValue.cmTable));
+                        insertionSuccess_1 = !!(0, roosterjs_content_model_dom_1.mergeModel)(model, (0, roosterjs_content_model_dom_1.cloneModel)(doc), context, {
                             mergeFormat: 'none',
                             insertPosition: ip,
                         });
@@ -223,7 +223,7 @@ define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/creat
                                 var markerParagraph = FirstCell === null || FirstCell === void 0 ? void 0 : FirstCell.blocks[0];
                                 if ((markerParagraph === null || markerParagraph === void 0 ? void 0 : markerParagraph.blockType) == 'Paragraph') {
                                     var marker = (0, roosterjs_content_model_dom_1.createSelectionMarker)(model.format);
-                                    markerParagraph.segments.unshift(marker);
+                                    (0, roosterjs_content_model_dom_1.mutateBlock)(markerParagraph).segments.unshift(marker);
                                     (0, roosterjs_content_model_dom_1.setParagraphNotImplicit)(markerParagraph);
                                     (0, roosterjs_content_model_dom_1.setSelection)(FirstCell, marker);
                                 }

package/lib-amd/tableEdit/editors/features/TableMover.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableMover.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableMover.ts"],"names":[],"mappings":"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","sourcesContent":["import { createElement } from '../../../pluginUtils/CreateElement/createElement';\nimport { DragAndDropHelper } from '../../../pluginUtils/DragAndDrop/DragAndDropHelper';\nimport { formatInsertPointWithContentModel } from 'roosterjs-content-model-api';\nimport { getCMTableFromTable } from '../utils/getTableFromContentModel';\nimport type { TableEditFeature } from './TableEditFeature';\nimport type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';\nimport type { DragAndDropHandler } from '../../../pluginUtils/DragAndDrop/DragAndDropHandler';\nimport {\n    createContentModelDocument,\n    createSelectionMarker,\n    getFirstSelectedTable,\n    isNodeOfType,\n    mergeModel,\n    normalizeRect,\n    setParagraphNotImplicit,\n    setSelection,\n} from 'roosterjs-content-model-dom';\nimport type {\n    ContentModelTable,\n    DOMInsertPoint,\n    DOMSelection,\n    IEditor,\n    Rect,\n} from 'roosterjs-content-model-types';\n\nconst TABLE_MOVER_LENGTH = 12;\n/**\n * @internal\n */\nexport const TABLE_MOVER_ID = '_Table_Mover';\nconst TABLE_MOVER_STYLE_KEY = '_TableMoverCursorStyle';\n\n/**\n * @internal\n * Allows user to move table to another position\n * Contains the function to select whole table\n */\nexport function createTableMover(\n    table: HTMLTableElement,\n    editor: IEditor,\n    isRTL: boolean,\n    onFinishDragging: (table: HTMLTableElement) => void,\n    onStart: () => void,\n    onEnd: () => void,\n    contentDiv?: EventTarget | null,\n    anchorContainer?: HTMLElement,\n    onTableEditorCreated?: OnTableEditorCreatedCallback,\n    disableMovement?: boolean\n): TableEditFeature | null {\n    const rect = normalizeRect(table.getBoundingClientRect());\n\n    if (!isTableTopVisible(editor, rect, contentDiv as Node)) {\n        return null;\n    }\n\n    const zoomScale = editor.getDOMHelper().calculateZoomScale();\n    const document = table.ownerDocument;\n    const createElementData = {\n        tag: 'div',\n        style: 'position: fixed; cursor: move; user-select: none; border: 1px solid #808080',\n    };\n\n    const div = createElement(createElementData, document) as HTMLDivElement;\n\n    div.id = TABLE_MOVER_ID;\n    div.style.width = `${TABLE_MOVER_LENGTH}px`;\n    div.style.height = `${TABLE_MOVER_LENGTH}px`;\n\n    (anchorContainer || document.body).appendChild(div);\n\n    const context: TableMoverContext = {\n        table,\n        zoomScale,\n        rect,\n        isRTL,\n        editor,\n        div,\n        onFinishDragging,\n        onStart,\n        onEnd,\n        disableMovement,\n    };\n\n    setDivPosition(context, div);\n\n    const featureHandler = new TableMoverFeature(\n        div,\n        context,\n        () => {},\n        disableMovement\n            ? { onDragEnd }\n            : {\n                  onDragStart,\n                  onDragging,\n                  onDragEnd,\n              },\n        context.zoomScale,\n        onTableEditorCreated,\n        editor.getEnvironment().isMobileOrTablet\n    );\n\n    return { node: table, div, featureHandler };\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport interface TableMoverContext {\n    table: HTMLTableElement;\n    zoomScale: number;\n    rect: Rect | null;\n    isRTL: boolean;\n    editor: IEditor;\n    div: HTMLElement;\n    onFinishDragging: (table: HTMLTableElement) => void;\n    onStart: () => void;\n    onEnd: () => void;\n    disableMovement?: boolean;\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport interface TableMoverInitValue {\n    cmTable: ContentModelTable | undefined;\n    initialSelection: DOMSelection | null;\n    tableRect: HTMLDivElement;\n}\n\nclass TableMoverFeature extends DragAndDropHelper<TableMoverContext, TableMoverInitValue> {\n    private disposer: undefined | (() => void);\n\n    constructor(\n        div: HTMLElement,\n        context: TableMoverContext,\n        onSubmit: (\n            context: TableMoverContext,\n            trigger: HTMLElement,\n            container?: HTMLElement\n        ) => void,\n        handler: DragAndDropHandler<TableMoverContext, TableMoverInitValue>,\n        zoomScale: number,\n        onTableEditorCreated?: OnTableEditorCreatedCallback,\n        forceMobile?: boolean | undefined\n    ) {\n        super(div, context, onSubmit, handler, zoomScale, forceMobile);\n        this.disposer = onTableEditorCreated?.('TableMover', div);\n    }\n\n    dispose(): void {\n        this.disposer?.();\n        this.disposer = undefined;\n        super.dispose();\n    }\n}\n\nfunction setDivPosition(context: TableMoverContext, trigger: HTMLElement) {\n    const { rect } = context;\n    if (rect) {\n        trigger.style.top = `${rect.top - TABLE_MOVER_LENGTH}px`;\n        trigger.style.left = `${rect.left - TABLE_MOVER_LENGTH - 2}px`;\n    }\n}\n\nfunction isTableTopVisible(editor: IEditor, rect: Rect | null, contentDiv?: Node | null): boolean {\n    const visibleViewport = editor.getVisibleViewport();\n    if (isNodeOfType(contentDiv, 'ELEMENT_NODE') && visibleViewport && rect) {\n        const containerRect = normalizeRect(contentDiv.getBoundingClientRect());\n\n        return !!containerRect && containerRect.top <= rect.top && visibleViewport.top <= rect.top;\n    }\n\n    return true;\n}\n\nfunction setTableMoverCursor(editor: IEditor, state: boolean, type?: 'move' | 'copy') {\n    editor?.setEditorStyle(TABLE_MOVER_STYLE_KEY, state ? 'cursor: ' + type ?? 'move' : null);\n}\n\n// Get insertion point from coordinate.\nfunction getNodePositionFromEvent(editor: IEditor, x: number, y: number): DOMInsertPoint | null {\n    const doc = editor.getDocument();\n    const domHelper = editor.getDOMHelper();\n\n    if (doc.caretRangeFromPoint) {\n        // Chrome, Edge, Safari, Opera\n        const range = doc.caretRangeFromPoint(x, y);\n        if (range && domHelper.isNodeInEditor(range.startContainer)) {\n            return { node: range.startContainer, offset: range.startOffset };\n        }\n    }\n\n    if ('caretPositionFromPoint' in doc) {\n        // Firefox\n        const pos = (doc as any).caretPositionFromPoint(x, y);\n        if (pos && domHelper.isNodeInEditor(pos.offsetNode)) {\n            return { node: pos.offsetNode, offset: pos.offset };\n        }\n    }\n\n    if (doc.elementFromPoint) {\n        // Fallback\n        const element = doc.elementFromPoint(x, y);\n        if (element && domHelper.isNodeInEditor(element)) {\n            return { node: element, offset: 0 };\n        }\n    }\n\n    return null;\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDragStart(context: TableMoverContext): TableMoverInitValue {\n    context.onStart();\n\n    const { editor, table, div } = context;\n\n    setTableMoverCursor(editor, true, 'move');\n\n    // Create table outline rectangle\n    const trect = table.getBoundingClientRect();\n    const createElementData = {\n        tag: 'div',\n        style: 'position: fixed; user-select: none; border: 1px solid #808080',\n    };\n    const tableRect = createElement(createElementData, document) as HTMLDivElement;\n    tableRect.style.width = `${trect.width}px`;\n    tableRect.style.height = `${trect.height}px`;\n    tableRect.style.top = `${trect.top}px`;\n    tableRect.style.left = `${trect.left}px`;\n    div.parentNode?.appendChild(tableRect);\n\n    // Get drag start selection\n    const initialSelection = editor.getDOMSelection();\n\n    // Get Table block in content model\n    const cmTable = getCMTableFromTable(editor, table);\n\n    return {\n        cmTable,\n        initialSelection,\n        tableRect,\n    };\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDragging(\n    context: TableMoverContext,\n    event: MouseEvent,\n    initValue: TableMoverInitValue\n) {\n    const { tableRect } = initValue;\n    const { editor } = context;\n\n    // Move table outline rectangle\n    tableRect.style.top = `${event.clientY + TABLE_MOVER_LENGTH}px`;\n    tableRect.style.left = `${event.clientX + TABLE_MOVER_LENGTH}px`;\n\n    const pos = getNodePositionFromEvent(editor, event.clientX, event.clientY);\n    if (pos) {\n        const range = editor.getDocument().createRange();\n        range.setStart(pos.node, pos.offset);\n        range.collapse(true);\n\n        editor.setDOMSelection({ type: 'range', range, isReverted: false });\n        return true;\n    }\n    return false;\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDragEnd(\n    context: TableMoverContext,\n    event: MouseEvent,\n    initValue: TableMoverInitValue | undefined\n) {\n    const { editor, table, onFinishDragging: selectWholeTable, disableMovement } = context;\n    const element = event.target;\n\n    // Remove table outline rectangle\n    initValue?.tableRect.remove();\n\n    // Reset cursor\n    setTableMoverCursor(editor, false);\n\n    if (element == context.div) {\n        // Table mover was only clicked, select whole table\n        selectWholeTable(table);\n        context.onEnd();\n        return true;\n    } else {\n        // Check if table was dragged on itself, element is not in editor, or movement is disabled\n        if (\n            table.contains(element as Node) ||\n            !editor.getDOMHelper().isNodeInEditor(element as Node) ||\n            disableMovement\n        ) {\n            editor.setDOMSelection(initValue?.initialSelection ?? null);\n            context.onEnd();\n            return false;\n        }\n\n        let insertionSuccess: boolean = false;\n\n        // Get position to insert table\n        const insertPosition = getNodePositionFromEvent(editor, event.clientX, event.clientY);\n        if (insertPosition) {\n            // Move table to new position\n            formatInsertPointWithContentModel(\n                editor,\n                insertPosition,\n                (model, context, ip) => {\n                    // Remove old table\n                    const [oldTable, path] = getFirstSelectedTable(model);\n                    if (oldTable) {\n                        const index = path[0].blocks.indexOf(oldTable);\n                        path[0].blocks.splice(index, 1);\n                    }\n\n                    if (ip && initValue?.cmTable) {\n                        // Insert new table\n                        const doc = createContentModelDocument();\n                        doc.blocks.push(initValue.cmTable);\n                        insertionSuccess = !!mergeModel(model, doc, context, {\n                            mergeFormat: 'none',\n                            insertPosition: ip,\n                        });\n\n                        if (insertionSuccess) {\n                            // After mergeModel, the new table should be selected\n                            const finalTable = getFirstSelectedTable(model)[0] ?? initValue.cmTable;\n                            if (finalTable) {\n                                // Add selection marker to the first cell of the table\n                                const FirstCell = finalTable.rows[0].cells[0];\n                                const markerParagraph = FirstCell?.blocks[0];\n                                if (markerParagraph?.blockType == 'Paragraph') {\n                                    const marker = createSelectionMarker(model.format);\n\n                                    markerParagraph.segments.unshift(marker);\n                                    setParagraphNotImplicit(markerParagraph);\n                                    setSelection(FirstCell, marker);\n                                }\n                            }\n                        }\n                        return insertionSuccess;\n                    }\n                },\n                {\n                    // Select first cell of the old table\n                    selectionOverride: {\n                        type: 'table',\n                        firstColumn: 0,\n                        firstRow: 0,\n                        lastColumn: 0,\n                        lastRow: 0,\n                        table: table,\n                    },\n                    apiName: 'TableMover',\n                }\n            );\n        } else {\n            // No movement, restore initial selection\n            editor.setDOMSelection(initValue?.initialSelection ?? null);\n        }\n        context.onEnd();\n        return insertionSuccess;\n    }\n}\n"]}
+{"version":3,"file":"TableMover.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableMover.ts"],"names":[],"mappings":"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","sourcesContent":["import { createElement } from '../../../pluginUtils/CreateElement/createElement';\nimport { DragAndDropHelper } from '../../../pluginUtils/DragAndDrop/DragAndDropHelper';\nimport { formatInsertPointWithContentModel } from 'roosterjs-content-model-api';\nimport { getCMTableFromTable } from '../utils/getTableFromContentModel';\nimport type { TableEditFeature } from './TableEditFeature';\nimport type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';\nimport type { DragAndDropHandler } from '../../../pluginUtils/DragAndDrop/DragAndDropHandler';\nimport {\n    cloneModel,\n    createContentModelDocument,\n    createSelectionMarker,\n    getFirstSelectedTable,\n    isNodeOfType,\n    mergeModel,\n    mutateBlock,\n    normalizeRect,\n    setParagraphNotImplicit,\n    setSelection,\n} from 'roosterjs-content-model-dom';\nimport type {\n    DOMInsertPoint,\n    DOMSelection,\n    IEditor,\n    ReadonlyContentModelTable,\n    Rect,\n    ShallowMutableContentModelDocument,\n} from 'roosterjs-content-model-types';\n\nconst TABLE_MOVER_LENGTH = 12;\n/**\n * @internal\n */\nexport const TABLE_MOVER_ID = '_Table_Mover';\nconst TABLE_MOVER_STYLE_KEY = '_TableMoverCursorStyle';\n\n/**\n * @internal\n * Allows user to move table to another position\n * Contains the function to select whole table\n */\nexport function createTableMover(\n    table: HTMLTableElement,\n    editor: IEditor,\n    isRTL: boolean,\n    onFinishDragging: (table: HTMLTableElement) => void,\n    onStart: () => void,\n    onEnd: () => void,\n    contentDiv?: EventTarget | null,\n    anchorContainer?: HTMLElement,\n    onTableEditorCreated?: OnTableEditorCreatedCallback,\n    disableMovement?: boolean\n): TableEditFeature | null {\n    const rect = normalizeRect(table.getBoundingClientRect());\n\n    if (!isTableTopVisible(editor, rect, contentDiv as Node)) {\n        return null;\n    }\n\n    const zoomScale = editor.getDOMHelper().calculateZoomScale();\n    const document = table.ownerDocument;\n    const createElementData = {\n        tag: 'div',\n        style: 'position: fixed; cursor: move; user-select: none; border: 1px solid #808080',\n    };\n\n    const div = createElement(createElementData, document) as HTMLDivElement;\n\n    div.id = TABLE_MOVER_ID;\n    div.style.width = `${TABLE_MOVER_LENGTH}px`;\n    div.style.height = `${TABLE_MOVER_LENGTH}px`;\n\n    (anchorContainer || document.body).appendChild(div);\n\n    const context: TableMoverContext = {\n        table,\n        zoomScale,\n        rect,\n        isRTL,\n        editor,\n        div,\n        onFinishDragging,\n        onStart,\n        onEnd,\n        disableMovement,\n    };\n\n    setDivPosition(context, div);\n\n    const featureHandler = new TableMoverFeature(\n        div,\n        context,\n        () => {},\n        disableMovement\n            ? { onDragEnd }\n            : {\n                  onDragStart,\n                  onDragging,\n                  onDragEnd,\n              },\n        context.zoomScale,\n        onTableEditorCreated,\n        editor.getEnvironment().isMobileOrTablet\n    );\n\n    return { node: table, div, featureHandler };\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport interface TableMoverContext {\n    table: HTMLTableElement;\n    zoomScale: number;\n    rect: Rect | null;\n    isRTL: boolean;\n    editor: IEditor;\n    div: HTMLElement;\n    onFinishDragging: (table: HTMLTableElement) => void;\n    onStart: () => void;\n    onEnd: () => void;\n    disableMovement?: boolean;\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport interface TableMoverInitValue {\n    cmTable: ReadonlyContentModelTable | undefined;\n    initialSelection: DOMSelection | null;\n    tableRect: HTMLDivElement;\n}\n\nclass TableMoverFeature extends DragAndDropHelper<TableMoverContext, TableMoverInitValue> {\n    private disposer: undefined | (() => void);\n\n    constructor(\n        div: HTMLElement,\n        context: TableMoverContext,\n        onSubmit: (\n            context: TableMoverContext,\n            trigger: HTMLElement,\n            container?: HTMLElement\n        ) => void,\n        handler: DragAndDropHandler<TableMoverContext, TableMoverInitValue>,\n        zoomScale: number,\n        onTableEditorCreated?: OnTableEditorCreatedCallback,\n        forceMobile?: boolean | undefined\n    ) {\n        super(div, context, onSubmit, handler, zoomScale, forceMobile);\n        this.disposer = onTableEditorCreated?.('TableMover', div);\n    }\n\n    dispose(): void {\n        this.disposer?.();\n        this.disposer = undefined;\n        super.dispose();\n    }\n}\n\nfunction setDivPosition(context: TableMoverContext, trigger: HTMLElement) {\n    const { rect } = context;\n    if (rect) {\n        trigger.style.top = `${rect.top - TABLE_MOVER_LENGTH}px`;\n        trigger.style.left = `${rect.left - TABLE_MOVER_LENGTH - 2}px`;\n    }\n}\n\nfunction isTableTopVisible(editor: IEditor, rect: Rect | null, contentDiv?: Node | null): boolean {\n    const visibleViewport = editor.getVisibleViewport();\n    if (isNodeOfType(contentDiv, 'ELEMENT_NODE') && visibleViewport && rect) {\n        const containerRect = normalizeRect(contentDiv.getBoundingClientRect());\n\n        return !!containerRect && containerRect.top <= rect.top && visibleViewport.top <= rect.top;\n    }\n\n    return true;\n}\n\nfunction setTableMoverCursor(editor: IEditor, state: boolean, type?: 'move' | 'copy') {\n    editor?.setEditorStyle(TABLE_MOVER_STYLE_KEY, state ? 'cursor: ' + type ?? 'move' : null);\n}\n\n// Get insertion point from coordinate.\nfunction getNodePositionFromEvent(editor: IEditor, x: number, y: number): DOMInsertPoint | null {\n    const doc = editor.getDocument();\n    const domHelper = editor.getDOMHelper();\n\n    if (doc.caretRangeFromPoint) {\n        // Chrome, Edge, Safari, Opera\n        const range = doc.caretRangeFromPoint(x, y);\n        if (range && domHelper.isNodeInEditor(range.startContainer)) {\n            return { node: range.startContainer, offset: range.startOffset };\n        }\n    }\n\n    if ('caretPositionFromPoint' in doc) {\n        // Firefox\n        const pos = (doc as any).caretPositionFromPoint(x, y);\n        if (pos && domHelper.isNodeInEditor(pos.offsetNode)) {\n            return { node: pos.offsetNode, offset: pos.offset };\n        }\n    }\n\n    if (doc.elementFromPoint) {\n        // Fallback\n        const element = doc.elementFromPoint(x, y);\n        if (element && domHelper.isNodeInEditor(element)) {\n            return { node: element, offset: 0 };\n        }\n    }\n\n    return null;\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDragStart(context: TableMoverContext): TableMoverInitValue {\n    context.onStart();\n\n    const { editor, table, div } = context;\n\n    setTableMoverCursor(editor, true, 'move');\n\n    // Create table outline rectangle\n    const trect = table.getBoundingClientRect();\n    const createElementData = {\n        tag: 'div',\n        style: 'position: fixed; user-select: none; border: 1px solid #808080',\n    };\n    const tableRect = createElement(createElementData, document) as HTMLDivElement;\n    tableRect.style.width = `${trect.width}px`;\n    tableRect.style.height = `${trect.height}px`;\n    tableRect.style.top = `${trect.top}px`;\n    tableRect.style.left = `${trect.left}px`;\n    div.parentNode?.appendChild(tableRect);\n\n    // Get drag start selection\n    const initialSelection = editor.getDOMSelection();\n\n    // Get Table block in content model\n    const cmTable = getCMTableFromTable(editor, table);\n\n    return {\n        cmTable,\n        initialSelection,\n        tableRect,\n    };\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDragging(\n    context: TableMoverContext,\n    event: MouseEvent,\n    initValue: TableMoverInitValue\n) {\n    const { tableRect } = initValue;\n    const { editor } = context;\n\n    // Move table outline rectangle\n    tableRect.style.top = `${event.clientY + TABLE_MOVER_LENGTH}px`;\n    tableRect.style.left = `${event.clientX + TABLE_MOVER_LENGTH}px`;\n\n    const pos = getNodePositionFromEvent(editor, event.clientX, event.clientY);\n    if (pos) {\n        const range = editor.getDocument().createRange();\n        range.setStart(pos.node, pos.offset);\n        range.collapse(true);\n\n        editor.setDOMSelection({ type: 'range', range, isReverted: false });\n        return true;\n    }\n    return false;\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDragEnd(\n    context: TableMoverContext,\n    event: MouseEvent,\n    initValue: TableMoverInitValue | undefined\n) {\n    const { editor, table, onFinishDragging: selectWholeTable, disableMovement } = context;\n    const element = event.target;\n\n    // Remove table outline rectangle\n    initValue?.tableRect.remove();\n\n    // Reset cursor\n    setTableMoverCursor(editor, false);\n\n    if (element == context.div) {\n        // Table mover was only clicked, select whole table\n        selectWholeTable(table);\n        context.onEnd();\n        return true;\n    } else {\n        // Check if table was dragged on itself, element is not in editor, or movement is disabled\n        if (\n            table.contains(element as Node) ||\n            !editor.getDOMHelper().isNodeInEditor(element as Node) ||\n            disableMovement\n        ) {\n            editor.setDOMSelection(initValue?.initialSelection ?? null);\n            context.onEnd();\n            return false;\n        }\n\n        let insertionSuccess: boolean = false;\n\n        // Get position to insert table\n        const insertPosition = getNodePositionFromEvent(editor, event.clientX, event.clientY);\n        if (insertPosition) {\n            // Move table to new position\n            formatInsertPointWithContentModel(\n                editor,\n                insertPosition,\n                (model, context, ip) => {\n                    // Remove old table\n                    const [oldTable, path] = getFirstSelectedTable(model);\n                    if (oldTable) {\n                        const index = path[0].blocks.indexOf(oldTable);\n                        mutateBlock(path[0]).blocks.splice(index, 1);\n                    }\n\n                    if (ip && initValue?.cmTable) {\n                        // Insert new table\n                        const doc: ShallowMutableContentModelDocument = createContentModelDocument();\n                        doc.blocks.push(mutateBlock(initValue.cmTable));\n                        insertionSuccess = !!mergeModel(model, cloneModel(doc), context, {\n                            mergeFormat: 'none',\n                            insertPosition: ip,\n                        });\n\n                        if (insertionSuccess) {\n                            // After mergeModel, the new table should be selected\n                            const finalTable = getFirstSelectedTable(model)[0] ?? initValue.cmTable;\n                            if (finalTable) {\n                                // Add selection marker to the first cell of the table\n                                const FirstCell = finalTable.rows[0].cells[0];\n                                const markerParagraph = FirstCell?.blocks[0];\n                                if (markerParagraph?.blockType == 'Paragraph') {\n                                    const marker = createSelectionMarker(model.format);\n\n                                    mutateBlock(markerParagraph).segments.unshift(marker);\n                                    setParagraphNotImplicit(markerParagraph);\n                                    setSelection(FirstCell, marker);\n                                }\n                            }\n                        }\n                        return insertionSuccess;\n                    }\n                },\n                {\n                    // Select first cell of the old table\n                    selectionOverride: {\n                        type: 'table',\n                        firstColumn: 0,\n                        firstRow: 0,\n                        lastColumn: 0,\n                        lastRow: 0,\n                        table: table,\n                    },\n                    apiName: 'TableMover',\n                }\n            );\n        } else {\n            // No movement, restore initial selection\n            editor.setDOMSelection(initValue?.initialSelection ?? null);\n        }\n        context.onEnd();\n        return insertionSuccess;\n    }\n}\n"]}

package/lib-amd/tableEdit/editors/features/TableResizer.d.ts

@@ -1,6 +1,6 @@
 import type { TableEditFeature } from './TableEditFeature';
 import type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';
-import type { IEditor } from 'roosterjs-content-model-types';
+import type { IEditor, ReadonlyContentModelTable } from 'roosterjs-content-model-types';
 /**
  * @internal
  */
@@ -9,3 +9,42 @@ export declare const TABLE_RESIZER_ID = "_Table_Resizer";
  * @internal
  */
 export declare function createTableResizer(table: HTMLTableElement, editor: IEditor, isRTL: boolean, onStart: () => void, onEnd: () => false, contentDiv?: EventTarget | null, anchorContainer?: HTMLElement, onTableEditorCreated?: OnTableEditorCreatedCallback): TableEditFeature | null;
+/**
+ * @internal
+ * Exported for testing
+ */
+export interface TableResizerContext {
+    table: HTMLTableElement;
+    isRTL: boolean;
+    zoomScale: number;
+    onStart: () => void;
+    onEnd: () => false;
+    div: HTMLDivElement;
+    editor: IEditor;
+    contentDiv?: EventTarget | null;
+}
+/**
+ * @internal
+ * Exported for testing
+ */
+export interface TableResizerInitValue {
+    originalRect: DOMRect;
+    originalHeights: number[];
+    originalWidths: number[];
+    cmTable: ReadonlyContentModelTable | undefined;
+}
+/**
+ * @internal
+ * Exported for testing
+ */
+export declare function onDragStart(context: TableResizerContext, event: MouseEvent): TableResizerInitValue;
+/**
+ * @internal
+ * Exported for testing
+ */
+export declare function onDragging(context: TableResizerContext, event: MouseEvent, initValue: TableResizerInitValue, deltaX: number, deltaY: number): boolean;
+/**
+ * @internal
+ * Exported for testing
+ */
+export declare function onDragEnd(context: TableResizerContext, event: MouseEvent, initValue: TableResizerInitValue | undefined): boolean;

package/lib-amd/tableEdit/editors/features/TableResizer.js

@@ -1,7 +1,7 @@
 define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/createElement", "../../../pluginUtils/DragAndDrop/DragAndDropHelper", "../utils/getTableFromContentModel", "roosterjs-content-model-dom"], function (require, exports, tslib_1, createElement_1, DragAndDropHelper_1, getTableFromContentModel_1, roosterjs_content_model_dom_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.createTableResizer = exports.TABLE_RESIZER_ID = void 0;
+    exports.onDragEnd = exports.onDragging = exports.onDragStart = exports.createTableResizer = exports.TABLE_RESIZER_ID = void 0;
     var TABLE_RESIZER_LENGTH = 12;
     /**
      * @internal
@@ -61,6 +61,10 @@ define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/creat
         };
         return TableResizer;
     }(DragAndDropHelper_1.DragAndDropHelper));
+    /**
+     * @internal
+     * Exported for testing
+     */
     function onDragStart(context, event) {
         context.onStart();
         var editor = context.editor, table = context.table;
@@ -82,6 +86,11 @@ define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/creat
             originalWidths: widths !== null && widths !== void 0 ? widths : [],
         };
     }
+    exports.onDragStart = onDragStart;
+    /**
+     * @internal
+     * Exported for testing
+     */
     function onDragging(context, event, initValue, deltaX, deltaY) {
         var _a, _b;
         var isRTL = context.isRTL, zoomScale = context.zoomScale, table = context.table;
@@ -96,22 +105,21 @@ define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/creat
         table.style.setProperty('height', null);
         // Assign new widths and heights to the CM table
         if (cmTable && cmTable.rows && (shouldResizeX || shouldResizeY)) {
+            var mutableTable = (0, roosterjs_content_model_dom_1.mutateBlock)(cmTable);
             // Modify the CM Table size
             for (var i = 0; i < cmTable.rows.length; i++) {
                 for (var j = 0; j < cmTable.rows[i].cells.length; j++) {
                     var cell = cmTable.rows[i].cells[j];
                     if (cell) {
                         if (shouldResizeX && i == 0) {
-                            cmTable.widths[j] = ((_a = originalWidths[j]) !== null && _a !== void 0 ? _a : 0) * ratioX;
+                            mutableTable.widths[j] = ((_a = originalWidths[j]) !== null && _a !== void 0 ? _a : 0) * ratioX;
                         }
                         if (shouldResizeY && j == 0) {
-                            cmTable.rows[i].height = ((_b = originalHeights[i]) !== null && _b !== void 0 ? _b : 0) * ratioY;
+                            mutableTable.rows[i].height = ((_b = originalHeights[i]) !== null && _b !== void 0 ? _b : 0) * ratioY;
                         }
                     }
                 }
             }
-            // Normalize the table
-            (0, roosterjs_content_model_dom_1.normalizeTable)(cmTable);
             // Writeback CM Table size changes to DOM Table
             for (var row = 0; row < table.rows.length; row++) {
                 var tableRow = table.rows[row];
@@ -119,10 +127,14 @@ define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/creat
                     // Skip empty row
                     continue;
                 }
+                // Normalize the new height value
+                var newHeight = Math.max(cmTable.rows[row].height, roosterjs_content_model_dom_1.MIN_ALLOWED_TABLE_CELL_HEIGHT);
                 for (var col = 0; col < tableRow.cells.length; col++) {
                     var td = tableRow.cells[col];
-                    td.style.width = cmTable.widths[col] + 'px';
-                    td.style.height = cmTable.rows[row].height + 'px';
+                    // Normalize the new width value
+                    var newWidth = Math.max(cmTable.widths[col], roosterjs_content_model_dom_1.MIN_ALLOWED_TABLE_CELL_HEIGHT);
+                    td.style.width = newWidth + 'px';
+                    td.style.height = newHeight + 'px';
                 }
             }
             return true;
@@ -131,6 +143,11 @@ define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/creat
             return false;
         }
     }
+    exports.onDragging = onDragging;
+    /**
+     * @internal
+     * Exported for testing
+     */
     function onDragEnd(context, event, initValue) {
         if (context.editor.isDisposed()) {
             return false;
@@ -142,6 +159,7 @@ define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/creat
         context.onEnd();
         return false;
     }
+    exports.onDragEnd = onDragEnd;
     function setDivPosition(context, trigger) {
         var table = context.table, isRTL = context.isRTL;
         var rect = (0, roosterjs_content_model_dom_1.normalizeRect)(table.getBoundingClientRect());

package/lib-amd/tableEdit/editors/features/TableResizer.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableResizer.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableResizer.ts"],"names":[],"mappings":"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","sourcesContent":["import { createElement } from '../../../pluginUtils/CreateElement/createElement';\nimport { DragAndDropHelper } from '../../../pluginUtils/DragAndDrop/DragAndDropHelper';\nimport { getCMTableFromTable } from '../utils/getTableFromContentModel';\nimport { isNodeOfType, normalizeRect, normalizeTable } from 'roosterjs-content-model-dom';\nimport type { TableEditFeature } from './TableEditFeature';\nimport type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';\nimport type { ContentModelTable, IEditor, Rect } from 'roosterjs-content-model-types';\nimport type { DragAndDropHandler } from '../../../pluginUtils/DragAndDrop/DragAndDropHandler';\n\nconst TABLE_RESIZER_LENGTH = 12;\n/**\n * @internal\n */\nexport const TABLE_RESIZER_ID = '_Table_Resizer';\n\n/**\n * @internal\n */\nexport function createTableResizer(\n    table: HTMLTableElement,\n    editor: IEditor,\n    isRTL: boolean,\n    onStart: () => void,\n    onEnd: () => false,\n    contentDiv?: EventTarget | null,\n    anchorContainer?: HTMLElement,\n    onTableEditorCreated?: OnTableEditorCreatedCallback\n): TableEditFeature | null {\n    const rect = normalizeRect(table.getBoundingClientRect());\n\n    if (!isTableBottomVisible(editor, rect, contentDiv as Node)) {\n        return null;\n    }\n\n    const document = table.ownerDocument;\n    const zoomScale = editor.getDOMHelper().calculateZoomScale();\n    const createElementData = {\n        tag: 'div',\n        style: `position: fixed; cursor: ${\n            isRTL ? 'ne' : 'nw'\n        }-resize; user-select: none; border: 1px solid #808080`,\n    };\n\n    const div = createElement(createElementData, document) as HTMLDivElement;\n\n    div.id = TABLE_RESIZER_ID;\n    div.style.width = `${TABLE_RESIZER_LENGTH}px`;\n    div.style.height = `${TABLE_RESIZER_LENGTH}px`;\n\n    (anchorContainer || document.body).appendChild(div);\n\n    const context: DragAndDropContext = {\n        isRTL,\n        table,\n        zoomScale,\n        onStart,\n        onEnd,\n        div,\n        editor,\n        contentDiv,\n    };\n\n    setDivPosition(context, div);\n\n    const featureHandler = new TableResizer(\n        div,\n        context,\n        hideResizer, // Resizer is hidden while dragging only\n        {\n            onDragStart,\n            onDragging,\n            onDragEnd,\n        },\n        zoomScale,\n        editor.getEnvironment().isMobileOrTablet,\n        onTableEditorCreated\n    );\n\n    return { node: table, div, featureHandler };\n}\n\nclass TableResizer extends DragAndDropHelper<DragAndDropContext, DragAndDropInitValue> {\n    private disposer: undefined | (() => void);\n\n    constructor(\n        trigger: HTMLElement,\n        context: DragAndDropContext,\n        onSubmit: (context: DragAndDropContext, trigger: HTMLElement) => void,\n        handler: DragAndDropHandler<DragAndDropContext, DragAndDropInitValue>,\n        zoomScale: number,\n        forceMobile?: boolean,\n        onTableEditorCreated?: OnTableEditorCreatedCallback\n    ) {\n        super(trigger, context, onSubmit, handler, zoomScale, forceMobile);\n        this.disposer = onTableEditorCreated?.('TableResizer', trigger);\n    }\n\n    dispose(): void {\n        this.disposer?.();\n        this.disposer = undefined;\n        super.dispose();\n    }\n}\n\ninterface DragAndDropContext {\n    table: HTMLTableElement;\n    isRTL: boolean;\n    zoomScale: number;\n    onStart: () => void;\n    onEnd: () => false;\n    div: HTMLDivElement;\n    editor: IEditor;\n    contentDiv?: EventTarget | null;\n}\n\ninterface DragAndDropInitValue {\n    originalRect: DOMRect;\n    originalHeights: number[];\n    originalWidths: number[];\n    cmTable: ContentModelTable | undefined;\n}\n\nfunction onDragStart(context: DragAndDropContext, event: MouseEvent) {\n    context.onStart();\n\n    const { editor, table } = context;\n\n    // Get Table block in content model\n    const cmTable = getCMTableFromTable(editor, table);\n\n    // Save original widths and heights\n    const heights: number[] = [];\n    cmTable?.rows.forEach(row => {\n        heights.push(row.height);\n    });\n    const widths: number[] = [];\n    cmTable?.widths.forEach(width => {\n        widths.push(width);\n    });\n\n    return {\n        originalRect: table.getBoundingClientRect(),\n        cmTable,\n        originalHeights: heights ?? [],\n        originalWidths: widths ?? [],\n    };\n}\n\nfunction onDragging(\n    context: DragAndDropContext,\n    event: MouseEvent,\n    initValue: DragAndDropInitValue,\n    deltaX: number,\n    deltaY: number\n) {\n    const { isRTL, zoomScale, table } = context;\n    const { originalRect, originalHeights, originalWidths, cmTable } = initValue;\n\n    const ratioX = 1.0 + (deltaX / originalRect.width) * zoomScale * (isRTL ? -1 : 1);\n    const ratioY = 1.0 + (deltaY / originalRect.height) * zoomScale;\n    const shouldResizeX = Math.abs(ratioX - 1.0) > 1e-3;\n    const shouldResizeY = Math.abs(ratioY - 1.0) > 1e-3;\n\n    // If the width of some external table is fixed, we need to make it resizable\n    table.style.setProperty('width', null);\n    // If the height of some external table is fixed, we need to make it resizable\n    table.style.setProperty('height', null);\n\n    // Assign new widths and heights to the CM table\n    if (cmTable && cmTable.rows && (shouldResizeX || shouldResizeY)) {\n        // Modify the CM Table size\n        for (let i = 0; i < cmTable.rows.length; i++) {\n            for (let j = 0; j < cmTable.rows[i].cells.length; j++) {\n                const cell = cmTable.rows[i].cells[j];\n                if (cell) {\n                    if (shouldResizeX && i == 0) {\n                        cmTable.widths[j] = (originalWidths[j] ?? 0) * ratioX;\n                    }\n                    if (shouldResizeY && j == 0) {\n                        cmTable.rows[i].height = (originalHeights[i] ?? 0) * ratioY;\n                    }\n                }\n            }\n        }\n\n        // Normalize the table\n        normalizeTable(cmTable);\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\n            if (tableRow.cells.length == 0) {\n                // Skip empty row\n                continue;\n            }\n\n            for (let col = 0; col < tableRow.cells.length; col++) {\n                const td = tableRow.cells[col];\n                td.style.width = cmTable.widths[col] + 'px';\n                td.style.height = cmTable.rows[row].height + 'px';\n            }\n        }\n        return true;\n    } else {\n        return false;\n    }\n}\n\nfunction onDragEnd(\n    context: DragAndDropContext,\n    event: MouseEvent,\n    initValue: DragAndDropInitValue | undefined\n) {\n    if (context.editor.isDisposed()) {\n        return false;\n    }\n    if (\n        isTableBottomVisible(\n            context.editor,\n            normalizeRect(context.table.getBoundingClientRect()),\n            context.contentDiv as Node\n        )\n    ) {\n        context.div.style.visibility = 'visible';\n        setDivPosition(context, context.div);\n    }\n    context.onEnd();\n    return false;\n}\n\nfunction setDivPosition(context: DragAndDropContext, trigger: HTMLElement) {\n    const { table, isRTL } = context;\n    const rect = normalizeRect(table.getBoundingClientRect());\n\n    if (rect) {\n        trigger.style.top = `${rect.bottom}px`;\n        trigger.style.left = isRTL\n            ? `${rect.left - TABLE_RESIZER_LENGTH - 2}px`\n            : `${rect.right}px`;\n    }\n}\n\nfunction hideResizer(context: DragAndDropContext, trigger: HTMLElement) {\n    trigger.style.visibility = 'hidden';\n}\n\nfunction isTableBottomVisible(\n    editor: IEditor,\n    rect: Rect | null,\n    contentDiv?: Node | null\n): boolean {\n    const visibleViewport = editor.getVisibleViewport();\n    if (isNodeOfType(contentDiv, 'ELEMENT_NODE') && visibleViewport && rect) {\n        const containerRect = normalizeRect(contentDiv.getBoundingClientRect());\n\n        return (\n            !!containerRect &&\n            containerRect.bottom >= rect.bottom &&\n            visibleViewport.bottom >= rect.bottom\n        );\n    }\n\n    return true;\n}\n"]}
+{"version":3,"file":"TableResizer.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableResizer.ts"],"names":[],"mappings":"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","sourcesContent":["import { createElement } from '../../../pluginUtils/CreateElement/createElement';\nimport { DragAndDropHelper } from '../../../pluginUtils/DragAndDrop/DragAndDropHelper';\nimport { getCMTableFromTable } from '../utils/getTableFromContentModel';\nimport {\n    MIN_ALLOWED_TABLE_CELL_HEIGHT,\n    isNodeOfType,\n    mutateBlock,\n    normalizeRect,\n} from 'roosterjs-content-model-dom';\nimport type { TableEditFeature } from './TableEditFeature';\nimport type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';\nimport type { IEditor, ReadonlyContentModelTable, Rect } from 'roosterjs-content-model-types';\nimport type { DragAndDropHandler } from '../../../pluginUtils/DragAndDrop/DragAndDropHandler';\n\nconst TABLE_RESIZER_LENGTH = 12;\n/**\n * @internal\n */\nexport const TABLE_RESIZER_ID = '_Table_Resizer';\n\n/**\n * @internal\n */\nexport function createTableResizer(\n    table: HTMLTableElement,\n    editor: IEditor,\n    isRTL: boolean,\n    onStart: () => void,\n    onEnd: () => false,\n    contentDiv?: EventTarget | null,\n    anchorContainer?: HTMLElement,\n    onTableEditorCreated?: OnTableEditorCreatedCallback\n): TableEditFeature | null {\n    const rect = normalizeRect(table.getBoundingClientRect());\n\n    if (!isTableBottomVisible(editor, rect, contentDiv as Node)) {\n        return null;\n    }\n\n    const document = table.ownerDocument;\n    const zoomScale = editor.getDOMHelper().calculateZoomScale();\n    const createElementData = {\n        tag: 'div',\n        style: `position: fixed; cursor: ${\n            isRTL ? 'ne' : 'nw'\n        }-resize; user-select: none; border: 1px solid #808080`,\n    };\n\n    const div = createElement(createElementData, document) as HTMLDivElement;\n\n    div.id = TABLE_RESIZER_ID;\n    div.style.width = `${TABLE_RESIZER_LENGTH}px`;\n    div.style.height = `${TABLE_RESIZER_LENGTH}px`;\n\n    (anchorContainer || document.body).appendChild(div);\n\n    const context: TableResizerContext = {\n        isRTL,\n        table,\n        zoomScale,\n        onStart,\n        onEnd,\n        div,\n        editor,\n        contentDiv,\n    };\n\n    setDivPosition(context, div);\n\n    const featureHandler = new TableResizer(\n        div,\n        context,\n        hideResizer, // Resizer is hidden while dragging only\n        {\n            onDragStart,\n            onDragging,\n            onDragEnd,\n        },\n        zoomScale,\n        editor.getEnvironment().isMobileOrTablet,\n        onTableEditorCreated\n    );\n\n    return { node: table, div, featureHandler };\n}\n\nclass TableResizer extends DragAndDropHelper<TableResizerContext, TableResizerInitValue> {\n    private disposer: undefined | (() => void);\n\n    constructor(\n        trigger: HTMLElement,\n        context: TableResizerContext,\n        onSubmit: (context: TableResizerContext, trigger: HTMLElement) => void,\n        handler: DragAndDropHandler<TableResizerContext, TableResizerInitValue>,\n        zoomScale: number,\n        forceMobile?: boolean,\n        onTableEditorCreated?: OnTableEditorCreatedCallback\n    ) {\n        super(trigger, context, onSubmit, handler, zoomScale, forceMobile);\n        this.disposer = onTableEditorCreated?.('TableResizer', 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 TableResizerContext {\n    table: HTMLTableElement;\n    isRTL: boolean;\n    zoomScale: number;\n    onStart: () => void;\n    onEnd: () => false;\n    div: HTMLDivElement;\n    editor: IEditor;\n    contentDiv?: EventTarget | null;\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport interface TableResizerInitValue {\n    originalRect: DOMRect;\n    originalHeights: number[];\n    originalWidths: number[];\n    cmTable: ReadonlyContentModelTable | undefined;\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDragStart(\n    context: TableResizerContext,\n    event: MouseEvent\n): TableResizerInitValue {\n    context.onStart();\n\n    const { editor, table } = context;\n\n    // Get Table block in content model\n    const cmTable = getCMTableFromTable(editor, table);\n\n    // Save original widths and heights\n    const heights: number[] = [];\n    cmTable?.rows.forEach(row => {\n        heights.push(row.height);\n    });\n    const widths: number[] = [];\n    cmTable?.widths.forEach(width => {\n        widths.push(width);\n    });\n\n    return {\n        originalRect: table.getBoundingClientRect(),\n        cmTable,\n        originalHeights: heights ?? [],\n        originalWidths: widths ?? [],\n    };\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDragging(\n    context: TableResizerContext,\n    event: MouseEvent,\n    initValue: TableResizerInitValue,\n    deltaX: number,\n    deltaY: number\n) {\n    const { isRTL, zoomScale, table } = context;\n    const { originalRect, originalHeights, originalWidths, cmTable } = initValue;\n\n    const ratioX = 1.0 + (deltaX / originalRect.width) * zoomScale * (isRTL ? -1 : 1);\n    const ratioY = 1.0 + (deltaY / originalRect.height) * zoomScale;\n    const shouldResizeX = Math.abs(ratioX - 1.0) > 1e-3;\n    const shouldResizeY = Math.abs(ratioY - 1.0) > 1e-3;\n\n    // If the width of some external table is fixed, we need to make it resizable\n    table.style.setProperty('width', null);\n    // If the height of some external table is fixed, we need to make it resizable\n    table.style.setProperty('height', null);\n\n    // Assign new widths and heights to the CM table\n    if (cmTable && cmTable.rows && (shouldResizeX || shouldResizeY)) {\n        const mutableTable = mutateBlock(cmTable);\n\n        // Modify the CM Table size\n        for (let i = 0; i < cmTable.rows.length; i++) {\n            for (let j = 0; j < cmTable.rows[i].cells.length; j++) {\n                const cell = cmTable.rows[i].cells[j];\n                if (cell) {\n                    if (shouldResizeX && i == 0) {\n                        mutableTable.widths[j] = (originalWidths[j] ?? 0) * ratioX;\n                    }\n                    if (shouldResizeY && j == 0) {\n                        mutableTable.rows[i].height = (originalHeights[i] ?? 0) * ratioY;\n                    }\n                }\n            }\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\n            if (tableRow.cells.length == 0) {\n                // Skip empty row\n                continue;\n            }\n\n            // Normalize the new height value\n            const newHeight = Math.max(cmTable.rows[row].height, MIN_ALLOWED_TABLE_CELL_HEIGHT);\n\n            for (let col = 0; col < tableRow.cells.length; col++) {\n                const td = tableRow.cells[col];\n\n                // Normalize the new width value\n                const newWidth = Math.max(cmTable.widths[col], MIN_ALLOWED_TABLE_CELL_HEIGHT);\n\n                td.style.width = newWidth + 'px';\n                td.style.height = newHeight + 'px';\n            }\n        }\n        return true;\n    } else {\n        return false;\n    }\n}\n\n/**\n * @internal\n * Exported for testing\n */\nexport function onDragEnd(\n    context: TableResizerContext,\n    event: MouseEvent,\n    initValue: TableResizerInitValue | undefined\n) {\n    if (context.editor.isDisposed()) {\n        return false;\n    }\n    if (\n        isTableBottomVisible(\n            context.editor,\n            normalizeRect(context.table.getBoundingClientRect()),\n            context.contentDiv as Node\n        )\n    ) {\n        context.div.style.visibility = 'visible';\n        setDivPosition(context, context.div);\n    }\n    context.onEnd();\n    return false;\n}\n\nfunction setDivPosition(context: TableResizerContext, trigger: HTMLElement) {\n    const { table, isRTL } = context;\n    const rect = normalizeRect(table.getBoundingClientRect());\n\n    if (rect) {\n        trigger.style.top = `${rect.bottom}px`;\n        trigger.style.left = isRTL\n            ? `${rect.left - TABLE_RESIZER_LENGTH - 2}px`\n            : `${rect.right}px`;\n    }\n}\n\nfunction hideResizer(context: TableResizerContext, trigger: HTMLElement) {\n    trigger.style.visibility = 'hidden';\n}\n\nfunction isTableBottomVisible(\n    editor: IEditor,\n    rect: Rect | null,\n    contentDiv?: Node | null\n): boolean {\n    const visibleViewport = editor.getVisibleViewport();\n    if (isNodeOfType(contentDiv, 'ELEMENT_NODE') && visibleViewport && rect) {\n        const containerRect = normalizeRect(contentDiv.getBoundingClientRect());\n\n        return (\n            !!containerRect &&\n            containerRect.bottom >= rect.bottom &&\n            visibleViewport.bottom >= rect.bottom\n        );\n    }\n\n    return true;\n}\n"]}

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

@@ -1,6 +1,6 @@
-import type { ContentModelTable, IEditor } from 'roosterjs-content-model-types';
+import type { IEditor, ReadonlyContentModelTable } 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): ContentModelTable | undefined;
+export declare function getCMTableFromTable(editor: IEditor, table: HTMLTableElement): ReadonlyContentModelTable | undefined;

package/lib-amd/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":";;;;IAGA;;;OAGG;IACH,SAAgB,mBAAmB,CAAC,MAAe,EAAE,KAAuB;QACxE,IAAI,OAAsC,CAAC;QAE3C,MAAM,CAAC,kBAAkB,CACrB,UAAA,KAAK;;YACD,KAAA,oBAAY,IAAA,mDAAqB,EAAC,KAAK,CAAC,IAAA,EAAvC,OAAO,QAAA,CAAiC;YACzC,OAAO,KAAK,CAAC;QACjB,CAAC,EACD;YACI,iBAAiB,EAAE;gBACf,IAAI,EAAE,OAAO;gBACb,WAAW,EAAE,CAAC;gBACd,QAAQ,EAAE,CAAC;gBACX,UAAU,EAAE,CAAC;gBACb,OAAO,EAAE,CAAC;gBACV,KAAK,EAAE,KAAK;aACf;SACJ,CACJ,CAAC;QAEF,OAAO,OAAO,CAAC;IACnB,CAAC;IArBD,kDAqBC","sourcesContent":["import { getFirstSelectedTable } from 'roosterjs-content-model-dom';\nimport type { ContentModelTable, 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    let cmTable: ContentModelTable | undefined;\n\n    editor.formatContentModel(\n        model => {\n            [cmTable] = getFirstSelectedTable(model);\n            return false;\n        },\n        {\n            selectionOverride: {\n                type: 'table',\n                firstColumn: 0,\n                firstRow: 0,\n                lastColumn: 0,\n                lastRow: 0,\n                table: table,\n            },\n        }\n    );\n\n    return cmTable;\n}\n"]}
+{"version":3,"file":"getTableFromContentModel.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/utils/getTableFromContentModel.ts"],"names":[],"mappings":";;;;IAGA;;;OAGG;IACH,SAAgB,mBAAmB,CAAC,MAAe,EAAE,KAAuB;QACxE,IAAI,OAA8C,CAAC;QAEnD,MAAM,CAAC,kBAAkB,CACrB,UAAA,KAAK;;YACD,KAAA,oBAAY,IAAA,mDAAqB,EAAC,KAAK,CAAC,IAAA,EAAvC,OAAO,QAAA,CAAiC;YACzC,OAAO,KAAK,CAAC;QACjB,CAAC,EACD;YACI,iBAAiB,EAAE;gBACf,IAAI,EAAE,OAAO;gBACb,WAAW,EAAE,CAAC;gBACd,QAAQ,EAAE,CAAC;gBACX,UAAU,EAAE,CAAC;gBACb,OAAO,EAAE,CAAC;gBACV,KAAK,EAAE,KAAK;aACf;SACJ,CACJ,CAAC;QAEF,OAAO,OAAO,CAAC;IACnB,CAAC;IArBD,kDAqBC","sourcesContent":["import { getFirstSelectedTable } from 'roosterjs-content-model-dom';\nimport type { IEditor, ReadonlyContentModelTable } 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    let cmTable: ReadonlyContentModelTable | undefined;\n\n    editor.formatContentModel(\n        model => {\n            [cmTable] = getFirstSelectedTable(model);\n            return false;\n        },\n        {\n            selectionOverride: {\n                type: 'table',\n                firstColumn: 0,\n                firstRow: 0,\n                lastColumn: 0,\n                lastRow: 0,\n                table: table,\n            },\n        }\n    );\n\n    return cmTable;\n}\n"]}

package/lib-mjs/autoFormat/hyphen/transformHyphen.d.ts

@@ -1,5 +1,5 @@
-import type { ContentModelParagraph, ContentModelText, FormatContentModelContext } from 'roosterjs-content-model-types';
+import type { ContentModelText, FormatContentModelContext, ShallowMutableContentModelParagraph } from 'roosterjs-content-model-types';
 /**
  * @internal
  */
-export declare function transformHyphen(previousSegment: ContentModelText, paragraph: ContentModelParagraph, context: FormatContentModelContext): boolean;
+export declare function transformHyphen(previousSegment: ContentModelText, paragraph: ShallowMutableContentModelParagraph, context: FormatContentModelContext): boolean;

package/lib-mjs/autoFormat/hyphen/transformHyphen.js.map

@@ -1 +1 @@
-{"version":3,"file":"transformHyphen.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/autoFormat/hyphen/transformHyphen.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AAOtE;;GAEG;AACH,MAAM,UAAU,eAAe,CAC3B,eAAiC,EACjC,SAAgC,EAChC,OAAkC;IAElC,IAAM,QAAQ,GAAG,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACjD,IAAM,MAAM,GAAG,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;IAC7C,IAAI,MAAM,KAAK,IAAI,EAAE;QACjB,IAAM,SAAS,GAAG,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QACzD,IAAM,WAAW,GAAG,gBAAgB,CAAC,eAAe,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,GAAG,CAAC,CAAC,CAAC;QAE3F,WAAW,CAAC,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;QACvD,OAAO,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAClC,OAAO,IAAI,CAAC;KACf;SAAM;QACH,IAAM,IAAI,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC;QAC5B,IAAM,SAAS,GAAG,IAAI,IAAI,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,CAAC,IAAI,CAAC,IAAG,CAAC,CAAC,CAAC;QACnD,IAAI,SAAS,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE;YACnC,IAAM,SAAS,GAAG,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;YACrD,IAAM,WAAW,GAAG,gBAAgB,CAChC,eAAe,EACf,SAAS,EACT,SAAS,EACT,SAAS,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,CAC9B,CAAC;YAEF,IAAM,UAAU,GAAG,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC;YAC3C,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,GAAG,IAAI,WAAW,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,KAAK,GAAG,EAAE;gBACzE,WAAW,CAAC,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;gBACvD,OAAO,CAAC,kBAAkB,GAAG,IAAI,CAAC;gBAClC,OAAO,IAAI,CAAC;aACf;SACJ;KACJ;IACD,OAAO,KAAK,CAAC;AACjB,CAAC","sourcesContent":["import { splitTextSegment } from '../../pluginUtils/splitTextSegment';\nimport type {\n    ContentModelParagraph,\n    ContentModelText,\n    FormatContentModelContext,\n} from 'roosterjs-content-model-types';\n\n/**\n * @internal\n */\nexport function transformHyphen(\n    previousSegment: ContentModelText,\n    paragraph: ContentModelParagraph,\n    context: FormatContentModelContext\n): boolean {\n    const segments = previousSegment.text.split(' ');\n    const dashes = segments[segments.length - 2];\n    if (dashes === '--') {\n        const textIndex = previousSegment.text.lastIndexOf('--');\n        const textSegment = splitTextSegment(previousSegment, paragraph, textIndex, textIndex + 2);\n\n        textSegment.text = textSegment.text.replace('--', '—');\n        context.canUndoByBackspace = true;\n        return true;\n    } else {\n        const text = segments.pop();\n        const hasDashes = text && text?.indexOf('--') > -1;\n        if (hasDashes && text.trim() !== '--') {\n            const textIndex = previousSegment.text.indexOf(text);\n            const textSegment = splitTextSegment(\n                previousSegment,\n                paragraph,\n                textIndex,\n                textIndex + text.length - 1\n            );\n\n            const textLength = textSegment.text.length;\n            if (textSegment.text[0] !== '-' && textSegment.text[textLength - 1] !== '-') {\n                textSegment.text = textSegment.text.replace('--', '—');\n                context.canUndoByBackspace = true;\n                return true;\n            }\n        }\n    }\n    return false;\n}\n"]}
+{"version":3,"file":"transformHyphen.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/autoFormat/hyphen/transformHyphen.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AAOtE;;GAEG;AACH,MAAM,UAAU,eAAe,CAC3B,eAAiC,EACjC,SAA8C,EAC9C,OAAkC;IAElC,IAAM,QAAQ,GAAG,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACjD,IAAM,MAAM,GAAG,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;IAC7C,IAAI,MAAM,KAAK,IAAI,EAAE;QACjB,IAAM,SAAS,GAAG,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QACzD,IAAM,WAAW,GAAG,gBAAgB,CAAC,eAAe,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,GAAG,CAAC,CAAC,CAAC;QAE3F,WAAW,CAAC,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;QACvD,OAAO,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAClC,OAAO,IAAI,CAAC;KACf;SAAM;QACH,IAAM,IAAI,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC;QAC5B,IAAM,SAAS,GAAG,IAAI,IAAI,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,CAAC,IAAI,CAAC,IAAG,CAAC,CAAC,CAAC;QACnD,IAAI,SAAS,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE;YACnC,IAAM,SAAS,GAAG,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;YACrD,IAAM,WAAW,GAAG,gBAAgB,CAChC,eAAe,EACf,SAAS,EACT,SAAS,EACT,SAAS,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,CAC9B,CAAC;YAEF,IAAM,UAAU,GAAG,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC;YAC3C,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,GAAG,IAAI,WAAW,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,KAAK,GAAG,EAAE;gBACzE,WAAW,CAAC,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;gBACvD,OAAO,CAAC,kBAAkB,GAAG,IAAI,CAAC;gBAClC,OAAO,IAAI,CAAC;aACf;SACJ;KACJ;IACD,OAAO,KAAK,CAAC;AACjB,CAAC","sourcesContent":["import { splitTextSegment } from '../../pluginUtils/splitTextSegment';\nimport type {\n    ContentModelText,\n    FormatContentModelContext,\n    ShallowMutableContentModelParagraph,\n} from 'roosterjs-content-model-types';\n\n/**\n * @internal\n */\nexport function transformHyphen(\n    previousSegment: ContentModelText,\n    paragraph: ShallowMutableContentModelParagraph,\n    context: FormatContentModelContext\n): boolean {\n    const segments = previousSegment.text.split(' ');\n    const dashes = segments[segments.length - 2];\n    if (dashes === '--') {\n        const textIndex = previousSegment.text.lastIndexOf('--');\n        const textSegment = splitTextSegment(previousSegment, paragraph, textIndex, textIndex + 2);\n\n        textSegment.text = textSegment.text.replace('--', '—');\n        context.canUndoByBackspace = true;\n        return true;\n    } else {\n        const text = segments.pop();\n        const hasDashes = text && text?.indexOf('--') > -1;\n        if (hasDashes && text.trim() !== '--') {\n            const textIndex = previousSegment.text.indexOf(text);\n            const textSegment = splitTextSegment(\n                previousSegment,\n                paragraph,\n                textIndex,\n                textIndex + text.length - 1\n            );\n\n            const textLength = textSegment.text.length;\n            if (textSegment.text[0] !== '-' && textSegment.text[textLength - 1] !== '-') {\n                textSegment.text = textSegment.text.replace('--', '—');\n                context.canUndoByBackspace = true;\n                return true;\n            }\n        }\n    }\n    return false;\n}\n"]}