roosterjs-content-model-plugins 9.1.0 → 9.3.0

package/lib-amd/tableEdit/editors/TableEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableEditor.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/TableEditor.ts"],"names":[],"mappings":"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","sourcesContent":["import { createCellResizer } from './features/CellResizer';\nimport { createTableInserter } from './features/TableInserter';\nimport { createTableMover } from './features/TableMover';\nimport { createTableResizer } from './features/TableResizer';\nimport { disposeTableEditFeature } from './features/TableEditFeature';\nimport { isNodeOfType, normalizeRect } from 'roosterjs-content-model-dom';\nimport type { TableEditFeature } from './features/TableEditFeature';\nimport type { IEditor, TableSelection } from 'roosterjs-content-model-types';\n\nconst INSERTER_HOVER_OFFSET = 6;\nconst enum TOP_OR_SIDE {\n    top = 0,\n    side = 1,\n}\n/**\n * @internal\n *\n * A table has 6 hot areas to be resized/edited (take LTR example):\n *\n *   [6]  [                ]\n *       +[      1         ]+--------------------+\n *       |[                ]|                    |\n *      [ ]               [ ]                    |\n *      [ ]               [ ]                    |\n *      [2]               [3]                    |\n *      [ ]               [ ]                    |\n *      [ ][       4       ]|                    |\n *       +------------------+--------------------+\n *       |                  |                    |\n *       |                  |                    |\n *       |                  |                    |\n *       +------------------+--------------------+\n *                                                [5]\n *\n * 1 - Hover area to show insert column button\n * 2 - Hover area to show insert row button\n * 3 - Hover area to show vertical resizing bar\n * 4 - Hover area to show horizontal resizing bar\n * 5 - Hover area to show whole table resize handle\n * 6 - Hover area to show whole table mover handle\n *\n * When set a different current table or change current TD, we need to update these areas\n */\nexport class TableEditor {\n    // 1, 2 - Insert a column or a row\n    private horizontalInserter: TableEditFeature | null = null;\n    private verticalInserter: TableEditFeature | null = null;\n\n    // 3, 4 - Resize a column or a row from a cell\n    private horizontalResizer: TableEditFeature | null = null;\n    private verticalResizer: TableEditFeature | null = null;\n\n    // 5 - Resize whole table\n    private tableResizer: TableEditFeature | null = null;\n\n    // 6 - Move as well as select whole table\n    private tableMover: TableEditFeature | null = null;\n\n    private isRTL: boolean;\n    private range: Range | null = null;\n    private isCurrentlyEditing: boolean;\n\n    constructor(\n        private editor: IEditor,\n        public readonly table: HTMLTableElement,\n        private onChanged: () => void,\n        private anchorContainer?: HTMLElement,\n        private contentDiv?: EventTarget | null\n    ) {\n        this.isRTL = editor.getDocument().defaultView?.getComputedStyle(table).direction == 'rtl';\n        this.setEditorFeatures();\n        this.isCurrentlyEditing = false;\n    }\n\n    dispose() {\n        this.disposeTableResizer();\n        this.disposeCellResizers();\n        this.disposeTableInserter();\n        this.disposeTableMover();\n    }\n\n    isEditing(): boolean {\n        return this.isCurrentlyEditing;\n    }\n\n    isOwnedElement(node: Node) {\n        return [\n            this.tableResizer,\n            this.tableMover,\n            this.horizontalInserter,\n            this.verticalInserter,\n            this.horizontalResizer,\n            this.verticalResizer,\n        ]\n            .filter(feature => !!feature?.div)\n            .some(feature => feature?.div == node);\n    }\n\n    onMouseMove(x: number, y: number) {\n        // Get whole table rect\n        const tableRect = normalizeRect(this.table.getBoundingClientRect());\n\n        //console.log('>>>tableRect', tableRect);\n        if (!tableRect) {\n            return;\n        }\n\n        // Determine if cursor is on top or side\n        const topOrSide =\n            y <= tableRect.top + INSERTER_HOVER_OFFSET\n                ? TOP_OR_SIDE.top\n                : this.isRTL\n                ? x >= tableRect.right - INSERTER_HOVER_OFFSET\n                    ? TOP_OR_SIDE.side\n                    : undefined\n                : x <= tableRect.left + INSERTER_HOVER_OFFSET\n                ? TOP_OR_SIDE.side\n                : undefined;\n        const topOrSideBinary = topOrSide ? 1 : 0;\n\n        // i is row index, j is column index\n        for (let i = 0; i < this.table.rows.length; i++) {\n            const tr = this.table.rows[i];\n            let j = 0;\n            for (; j < tr.cells.length; j++) {\n                const td = tr.cells[j];\n                const tdRect = normalizeRect(td.getBoundingClientRect());\n\n                if (!tdRect || !tableRect) {\n                    continue;\n                }\n\n                // Determine the cell the cursor is in range of\n                // Offset is only used for first row and column\n                const lessThanBottom = y <= tdRect.bottom;\n                const lessThanRight = this.isRTL\n                    ? x <= tdRect.right + INSERTER_HOVER_OFFSET * topOrSideBinary\n                    : x <= tdRect.right;\n                const moreThanLeft = this.isRTL\n                    ? x >= tdRect.left\n                    : x >= tdRect.left - INSERTER_HOVER_OFFSET * topOrSideBinary;\n\n                if (lessThanBottom && lessThanRight && moreThanLeft) {\n                    if (i === 0 && topOrSide == TOP_OR_SIDE.top) {\n                        const center = (tdRect.left + tdRect.right) / 2;\n                        const isOnRightHalf = this.isRTL ? x < center : x > center;\n                        this.setInserterTd(\n                            isOnRightHalf ? td : tr.cells[j - 1],\n                            false /*isHorizontal*/\n                        );\n                    } else if (j === 0 && topOrSide == TOP_OR_SIDE.side) {\n                        const tdAbove = this.table.rows[i - 1]?.cells[0];\n                        const tdAboveRect = tdAbove\n                            ? normalizeRect(tdAbove.getBoundingClientRect())\n                            : null;\n\n                        const isTdNotAboveMerged = !tdAboveRect\n                            ? null\n                            : this.isRTL\n                            ? tdAboveRect.right === tdRect.right\n                            : tdAboveRect.left === tdRect.left;\n\n                        this.setInserterTd(\n                            y < (tdRect.top + tdRect.bottom) / 2 && isTdNotAboveMerged\n                                ? tdAbove\n                                : td,\n                            true /*isHorizontal*/\n                        );\n                    } else {\n                        this.setInserterTd(null);\n                    }\n\n                    this.setResizingTd(td);\n\n                    //Cell found\n                    break;\n                }\n            }\n\n            if (j < tr.cells.length) {\n                break;\n            }\n        }\n\n        // Create Mover and Resizer\n        this.setEditorFeatures();\n    }\n\n    private setEditorFeatures() {\n        if (!this.tableMover) {\n            this.tableMover = createTableMover(\n                this.table,\n                this.editor,\n                this.isRTL,\n                this.onSelect,\n                this.getOnMouseOut,\n                this.contentDiv,\n                this.anchorContainer\n            );\n        }\n\n        if (!this.tableResizer) {\n            this.tableResizer = createTableResizer(\n                this.table,\n                this.editor,\n                this.isRTL,\n                this.onStartTableResize,\n                this.onFinishEditing,\n                this.contentDiv,\n                this.anchorContainer\n            );\n        }\n    }\n\n    private setResizingTd(td: HTMLTableCellElement) {\n        if (this.horizontalResizer && this.horizontalResizer.node != td) {\n            this.disposeCellResizers();\n        }\n\n        if (!this.horizontalResizer && td) {\n            this.horizontalResizer = createCellResizer(\n                this.editor,\n                td,\n                this.table,\n                this.isRTL,\n                true /*isHorizontal*/,\n                this.onStartCellResize,\n                this.onFinishEditing,\n                this.anchorContainer\n            );\n            this.verticalResizer = createCellResizer(\n                this.editor,\n                td,\n                this.table,\n                this.isRTL,\n                false /*isHorizontal*/,\n                this.onStartCellResize,\n                this.onFinishEditing,\n                this.anchorContainer\n            );\n        }\n    }\n\n    /**\n     * create or remove TableInserter\n     * @param td td to attach to, set this to null to remove inserters (both horizontal and vertical)\n     */\n    private setInserterTd(td: HTMLTableCellElement | null, isHorizontal?: boolean) {\n        const inserter = isHorizontal ? this.horizontalInserter : this.verticalInserter;\n        if (td === null || (inserter && inserter.node != td)) {\n            this.disposeTableInserter();\n        }\n\n        if (!this.horizontalInserter && !this.verticalInserter && td) {\n            const newInserter = createTableInserter(\n                this.editor,\n                td,\n                this.table,\n                this.isRTL,\n                !!isHorizontal,\n                this.onInserted,\n                this.getOnMouseOut,\n                this.anchorContainer\n            );\n            if (isHorizontal) {\n                this.horizontalInserter = newInserter;\n            } else {\n                this.verticalInserter = newInserter;\n            }\n        }\n    }\n\n    private disposeTableResizer() {\n        if (this.tableResizer) {\n            disposeTableEditFeature(this.tableResizer);\n            this.tableResizer = null;\n        }\n    }\n\n    private disposeTableInserter() {\n        if (this.horizontalInserter) {\n            disposeTableEditFeature(this.horizontalInserter);\n            this.horizontalInserter = null;\n        }\n        if (this.verticalInserter) {\n            disposeTableEditFeature(this.verticalInserter);\n            this.verticalInserter = null;\n        }\n    }\n\n    private disposeCellResizers() {\n        if (this.horizontalResizer) {\n            disposeTableEditFeature(this.horizontalResizer);\n            this.horizontalResizer = null;\n        }\n        if (this.verticalResizer) {\n            disposeTableEditFeature(this.verticalResizer);\n            this.verticalResizer = null;\n        }\n    }\n\n    private disposeTableMover() {\n        if (this.tableMover) {\n            disposeTableEditFeature(this.tableMover);\n            this.tableMover = null;\n        }\n    }\n\n    private onFinishEditing = (): false => {\n        this.editor.focus();\n\n        if (this.range) {\n            this.editor.setDOMSelection({ type: 'range', range: this.range, isReverted: false });\n        }\n\n        this.editor.takeSnapshot(); // Pass in an empty callback to make sure ContentChangedEvent is triggered\n        this.onChanged();\n        this.isCurrentlyEditing = false;\n\n        return false;\n    };\n\n    private onStartTableResize = () => {\n        this.isCurrentlyEditing = true;\n        this.onStartResize();\n    };\n\n    private onStartCellResize = () => {\n        this.isCurrentlyEditing = true;\n        this.disposeTableResizer();\n        this.onStartResize();\n    };\n\n    private onStartResize() {\n        this.isCurrentlyEditing = true;\n        const range = this.editor.getDOMSelection();\n\n        if (range && range.type == 'range') {\n            this.range = range.range;\n        }\n\n        this.editor.takeSnapshot();\n    }\n\n    private onInserted = () => {\n        this.disposeTableResizer();\n        this.onFinishEditing();\n    };\n\n    /**\n     * Public only for testing purposes\n     * @param table the table to select\n     */\n    public onSelect = (table: HTMLTableElement) => {\n        this.editor.focus();\n\n        if (table) {\n            const selection: TableSelection = {\n                table: table,\n                firstRow: 0,\n                firstColumn: 0,\n                lastRow: table.rows.length - 1,\n                lastColumn: table.rows[table.rows.length - 1].cells.length - 1,\n                type: 'table',\n            };\n\n            this.editor.setDOMSelection(selection);\n        }\n    };\n\n    private getOnMouseOut = (feature: HTMLElement) => {\n        return (ev: MouseEvent) => {\n            if (\n                feature &&\n                ev.relatedTarget != feature &&\n                isNodeOfType(this.contentDiv as Node, 'ELEMENT_NODE') &&\n                isNodeOfType(ev.relatedTarget as Node, 'ELEMENT_NODE') &&\n                !(this.contentDiv == ev.relatedTarget)\n            ) {\n                this.dispose();\n            }\n        };\n    };\n}\n"]}
+{"version":3,"file":"TableEditor.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/TableEditor.ts"],"names":[],"mappings":"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","sourcesContent":["import { createCellResizer } from './features/CellResizer';\nimport { createTableInserter } from './features/TableInserter';\nimport { createTableMover } from './features/TableMover';\nimport { createTableResizer } from './features/TableResizer';\nimport { disposeTableEditFeature } from './features/TableEditFeature';\nimport { isNodeOfType, normalizeRect, parseTableCells } from 'roosterjs-content-model-dom';\nimport type { OnTableEditorCreatedCallback } from '../OnTableEditorCreatedCallback';\nimport type { TableEditFeature } from './features/TableEditFeature';\nimport type { IEditor, TableSelection } from 'roosterjs-content-model-types';\nimport type { TableEditFeatureName } from './features/TableEditFeatureName';\n\nconst INSERTER_HOVER_OFFSET = 6;\nconst enum TOP_OR_SIDE {\n    top = 0,\n    side = 1,\n}\n/**\n * @internal\n *\n * A table has 6 hot areas to be resized/edited (take LTR example):\n *\n *   [6]  [                ]\n *       +[      1         ]+--------------------+\n *       |[                ]|                    |\n *      [ ]               [ ]                    |\n *      [ ]               [ ]                    |\n *      [2]               [3]                    |\n *      [ ]               [ ]                    |\n *      [ ][       4       ]|                    |\n *       +------------------+--------------------+\n *       |                  |                    |\n *       |                  |                    |\n *       |                  |                    |\n *       +------------------+--------------------+\n *                                                [5]\n *\n * 1 - Hover area to show insert column button\n * 2 - Hover area to show insert row button\n * 3 - Hover area to show vertical resizing bar\n * 4 - Hover area to show horizontal resizing bar\n * 5 - Hover area to show whole table resize handle\n * 6 - Hover area to show whole table mover handle\n *\n * When set a different current table or change current TD, we need to update these areas\n */\nexport class TableEditor {\n    // 1, 2 - Insert a column or a row\n    private horizontalInserter: TableEditFeature | null = null;\n    private verticalInserter: TableEditFeature | null = null;\n\n    // 3, 4 - Resize a column or a row from a cell\n    private horizontalResizer: TableEditFeature | null = null;\n    private verticalResizer: TableEditFeature | null = null;\n\n    // 5 - Resize whole table\n    private tableResizer: TableEditFeature | null = null;\n\n    // 6 - Move as well as select whole table\n    private tableMover: TableEditFeature | null = null;\n\n    private isRTL: boolean;\n    private range: Range | null = null;\n    private isCurrentlyEditing: boolean;\n\n    constructor(\n        private editor: IEditor,\n        public readonly table: HTMLTableElement,\n        private onChanged: () => void,\n        private anchorContainer?: HTMLElement,\n        private contentDiv?: EventTarget | null,\n        private onTableEditorCreated?: OnTableEditorCreatedCallback,\n        private disableFeatures?: TableEditFeatureName[]\n    ) {\n        this.isRTL = editor.getDocument().defaultView?.getComputedStyle(table).direction == 'rtl';\n        this.setEditorFeatures();\n        this.isCurrentlyEditing = false;\n    }\n\n    dispose() {\n        this.disposeTableResizer();\n        this.disposeCellResizers();\n        this.disposeTableInserter();\n        this.disposeTableMover();\n    }\n\n    isEditing(): boolean {\n        return this.isCurrentlyEditing;\n    }\n\n    isOwnedElement(node: Node) {\n        return [\n            this.tableResizer,\n            this.tableMover,\n            this.horizontalInserter,\n            this.verticalInserter,\n            this.horizontalResizer,\n            this.verticalResizer,\n        ]\n            .filter(feature => !!feature?.div)\n            .some(feature => feature?.div == node);\n    }\n\n    onMouseMove(x: number, y: number) {\n        // Get whole table rect\n        const tableRect = normalizeRect(this.table.getBoundingClientRect());\n\n        if (!tableRect) {\n            return;\n        }\n\n        // Determine if cursor is on top or side\n        const topOrSide =\n            y <= tableRect.top + INSERTER_HOVER_OFFSET\n                ? TOP_OR_SIDE.top\n                : this.isRTL\n                ? x >= tableRect.right - INSERTER_HOVER_OFFSET\n                    ? TOP_OR_SIDE.side\n                    : undefined\n                : x <= tableRect.left + INSERTER_HOVER_OFFSET\n                ? TOP_OR_SIDE.side\n                : undefined;\n        const topOrSideBinary = topOrSide ? 1 : 0;\n\n        // i is row index, j is column index\n        for (let i = 0; i < this.table.rows.length; i++) {\n            const tr = this.table.rows[i];\n            let j = 0;\n            for (; j < tr.cells.length; j++) {\n                const td = tr.cells[j];\n                const tdRect = normalizeRect(td.getBoundingClientRect());\n\n                if (!tdRect || !tableRect) {\n                    continue;\n                }\n\n                // Determine the cell the cursor is in range of\n                // Offset is only used for first row and column\n                const lessThanBottom = y <= tdRect.bottom;\n                const lessThanRight = this.isRTL\n                    ? x <= tdRect.right + INSERTER_HOVER_OFFSET * topOrSideBinary\n                    : x <= tdRect.right;\n                const moreThanLeft = this.isRTL\n                    ? x >= tdRect.left\n                    : x >= tdRect.left - INSERTER_HOVER_OFFSET * topOrSideBinary;\n\n                if (lessThanBottom && lessThanRight && moreThanLeft) {\n                    if (i === 0 && topOrSide == TOP_OR_SIDE.top) {\n                        const center = (tdRect.left + tdRect.right) / 2;\n                        const isOnRightHalf = this.isRTL ? x < center : x > center;\n                        !this.isFeatureDisabled('VerticalTableInserter') &&\n                            this.setInserterTd(\n                                isOnRightHalf ? td : tr.cells[j - 1],\n                                false /*isHorizontal*/\n                            );\n                    } else if (j === 0 && topOrSide == TOP_OR_SIDE.side) {\n                        const tdAbove = this.table.rows[i - 1]?.cells[0];\n                        const tdAboveRect = tdAbove\n                            ? normalizeRect(tdAbove.getBoundingClientRect())\n                            : null;\n\n                        const isTdNotAboveMerged = !tdAboveRect\n                            ? null\n                            : this.isRTL\n                            ? tdAboveRect.right === tdRect.right\n                            : tdAboveRect.left === tdRect.left;\n\n                        !this.isFeatureDisabled('HorizontalTableInserter') &&\n                            this.setInserterTd(\n                                y < (tdRect.top + tdRect.bottom) / 2 && isTdNotAboveMerged\n                                    ? tdAbove\n                                    : td,\n                                true /*isHorizontal*/\n                            );\n                    } else {\n                        this.setInserterTd(null);\n                    }\n\n                    !this.isFeatureDisabled('CellResizer') && this.setResizingTd(td);\n\n                    //Cell found\n                    break;\n                }\n            }\n\n            if (j < tr.cells.length) {\n                break;\n            }\n        }\n\n        // Create Mover and Resizer\n        this.setEditorFeatures();\n    }\n\n    private setEditorFeatures() {\n        const disableSelector = this.isFeatureDisabled('TableSelector');\n        const disableMovement = this.isFeatureDisabled('TableMover');\n        if (!this.tableMover && !(disableSelector && disableMovement)) {\n            this.tableMover = createTableMover(\n                this.table,\n                this.editor,\n                this.isRTL,\n                disableSelector ? () => {} : this.onSelect,\n                this.onStartTableMove,\n                this.onEndTableMove,\n                this.contentDiv,\n                this.anchorContainer,\n                this.onEditorCreated,\n                disableMovement\n            );\n        }\n\n        if (!this.tableResizer && !this.isFeatureDisabled('TableResizer')) {\n            this.tableResizer = createTableResizer(\n                this.table,\n                this.editor,\n                this.isRTL,\n                this.onStartTableResize,\n                this.onFinishEditing,\n                this.contentDiv,\n                this.anchorContainer,\n                this.onTableEditorCreated\n            );\n        }\n    }\n\n    private onEditorCreated = (featureType: TableEditFeatureName, element: HTMLElement) => {\n        const disposer = this.onTableEditorCreated?.(featureType, element);\n        const onMouseOut = element && this.getOnMouseOut(element);\n        if (onMouseOut) {\n            element.addEventListener('mouseout', onMouseOut);\n        }\n\n        return () => {\n            disposer?.();\n            if (onMouseOut) {\n                element.removeEventListener('mouseout', onMouseOut);\n            }\n        };\n    };\n\n    private setResizingTd(td: HTMLTableCellElement) {\n        if (this.horizontalResizer && this.horizontalResizer.node != td) {\n            this.disposeCellResizers();\n        }\n\n        if (!this.horizontalResizer && td) {\n            this.horizontalResizer = createCellResizer(\n                this.editor,\n                td,\n                this.table,\n                this.isRTL,\n                true /*isHorizontal*/,\n                this.onStartCellResize,\n                this.onFinishEditing,\n                this.anchorContainer\n            );\n            this.verticalResizer = createCellResizer(\n                this.editor,\n                td,\n                this.table,\n                this.isRTL,\n                false /*isHorizontal*/,\n                this.onStartCellResize,\n                this.onFinishEditing,\n                this.anchorContainer\n            );\n        }\n    }\n\n    /**\n     * create or remove TableInserter\n     * @param td td to attach to, set this to null to remove inserters (both horizontal and vertical)\n     */\n    private setInserterTd(td: HTMLTableCellElement | null, isHorizontal?: boolean) {\n        const inserter = isHorizontal ? this.horizontalInserter : this.verticalInserter;\n        if (td === null || (inserter && inserter.node != td)) {\n            this.disposeTableInserter();\n        }\n\n        if (!this.horizontalInserter && !this.verticalInserter && td) {\n            const newInserter = createTableInserter(\n                this.editor,\n                td,\n                this.table,\n                this.isRTL,\n                !!isHorizontal,\n                this.onInserted,\n                this.anchorContainer,\n                this.onEditorCreated\n            );\n            if (isHorizontal) {\n                this.horizontalInserter = newInserter;\n            } else {\n                this.verticalInserter = newInserter;\n            }\n        }\n    }\n\n    private disposeTableResizer() {\n        if (this.tableResizer) {\n            disposeTableEditFeature(this.tableResizer);\n            this.tableResizer = null;\n        }\n    }\n\n    private disposeTableInserter() {\n        if (this.horizontalInserter) {\n            disposeTableEditFeature(this.horizontalInserter);\n            this.horizontalInserter = null;\n        }\n        if (this.verticalInserter) {\n            disposeTableEditFeature(this.verticalInserter);\n            this.verticalInserter = null;\n        }\n    }\n\n    private disposeCellResizers() {\n        if (this.horizontalResizer) {\n            disposeTableEditFeature(this.horizontalResizer);\n            this.horizontalResizer = null;\n        }\n        if (this.verticalResizer) {\n            disposeTableEditFeature(this.verticalResizer);\n            this.verticalResizer = null;\n        }\n    }\n\n    private disposeTableMover() {\n        if (this.tableMover) {\n            disposeTableEditFeature(this.tableMover);\n            this.tableMover = null;\n        }\n    }\n\n    private onFinishEditing = (): false => {\n        this.editor.focus();\n\n        if (this.range) {\n            this.editor.setDOMSelection({ type: 'range', range: this.range, isReverted: false });\n        }\n\n        this.editor.takeSnapshot(); // Pass in an empty callback to make sure ContentChangedEvent is triggered\n        this.onChanged();\n        this.isCurrentlyEditing = false;\n\n        return false;\n    };\n\n    private onStartTableResize = () => {\n        this.isCurrentlyEditing = true;\n        this.onStartResize();\n    };\n\n    private onStartCellResize = () => {\n        this.isCurrentlyEditing = true;\n        this.disposeTableResizer();\n        this.onStartResize();\n    };\n\n    private onStartTableMove = () => {\n        this.isCurrentlyEditing = true;\n        this.disposeTableResizer();\n        this.disposeTableInserter();\n        this.disposeCellResizers();\n    };\n\n    private onStartResize() {\n        this.isCurrentlyEditing = true;\n        const range = this.editor.getDOMSelection();\n\n        if (range && range.type == 'range') {\n            this.range = range.range;\n        }\n\n        this.editor.takeSnapshot();\n    }\n\n    private onEndTableMove = () => {\n        this.disposeTableMover();\n        return this.onFinishEditing();\n    };\n\n    private onInserted = () => {\n        this.disposeTableResizer();\n        this.onFinishEditing();\n    };\n\n    /**\n     * Public only for testing purposes\n     * @param table the table to select\n     */\n    public onSelect = (table: HTMLTableElement) => {\n        this.editor.focus();\n\n        if (table) {\n            const parsedTable = parseTableCells(table);\n            const selection: TableSelection = {\n                table: table,\n                firstRow: 0,\n                firstColumn: 0,\n                lastRow: parsedTable.length - 1,\n                lastColumn: (parsedTable[0]?.length ?? 0) - 1,\n                type: 'table',\n            };\n\n            this.editor.setDOMSelection(selection);\n        }\n    };\n\n    private getOnMouseOut = (feature: HTMLElement) => {\n        return (ev: MouseEvent) => {\n            if (\n                feature &&\n                ev.relatedTarget != feature &&\n                isNodeOfType(this.contentDiv as Node, 'ELEMENT_NODE') &&\n                isNodeOfType(ev.relatedTarget as Node, 'ELEMENT_NODE') &&\n                !(this.contentDiv == ev.relatedTarget) &&\n                !this.isEditing()\n            ) {\n                this.dispose();\n            }\n        };\n    };\n\n    private isFeatureDisabled(feature: TableEditFeatureName) {\n        return this.disableFeatures?.includes(feature);\n    }\n}\n"]}

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

@@ -1,5 +1,13 @@
-import type { IEditor } from 'roosterjs-content-model-types';
 import type { TableEditFeature } from './TableEditFeature';
+import type { IEditor } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ */
+export declare const HORIZONTAL_RESIZER_ID = "horizontalResizer";
+/**
+ * @internal
+ */
+export declare const VERTICAL_RESIZER_ID = "verticalResizer";
 /**
  * @internal
  */

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

@@ -1,8 +1,16 @@
 define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/createElement", "../../../pluginUtils/DragAndDrop/DragAndDropHelper", "roosterjs-content-model-dom"], function (require, exports, tslib_1, createElement_1, DragAndDropHelper_1, roosterjs_content_model_dom_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.createCellResizer = void 0;
+    exports.createCellResizer = exports.VERTICAL_RESIZER_ID = exports.HORIZONTAL_RESIZER_ID = void 0;
     var CELL_RESIZER_WIDTH = 4;
+    /**
+     * @internal
+     */
+    exports.HORIZONTAL_RESIZER_ID = 'horizontalResizer';
+    /**
+     * @internal
+     */
+    exports.VERTICAL_RESIZER_ID = 'verticalResizer';
     /**
      * @internal
      */
@@ -144,7 +152,7 @@ define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/creat
         var td = context.td;
         var rect = (0, roosterjs_content_model_dom_1.normalizeRect)(td.getBoundingClientRect());
         if (rect) {
-            trigger.id = 'horizontalResizer';
+            trigger.id = exports.HORIZONTAL_RESIZER_ID;
             trigger.style.top = rect.bottom - CELL_RESIZER_WIDTH + 'px';
             trigger.style.left = rect.left + 'px';
             trigger.style.width = rect.right - rect.left + 'px';
@@ -155,7 +163,7 @@ define(["require", "exports", "tslib", "../../../pluginUtils/CreateElement/creat
         var td = context.td, isRTL = context.isRTL;
         var rect = (0, roosterjs_content_model_dom_1.normalizeRect)(td.getBoundingClientRect());
         if (rect) {
-            trigger.id = 'verticalResizer';
+            trigger.id = exports.VERTICAL_RESIZER_ID;
             trigger.style.top = rect.top + 'px';
             trigger.style.left = (isRTL ? rect.left : rect.right) - CELL_RESIZER_WIDTH + 1 + 'px';
             trigger.style.width = CELL_RESIZER_WIDTH + 'px';

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 {\n    isElementOfType,\n    normalizeRect,\n    getFirstSelectedTable,\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';\nimport type { TableEditFeature } from './TableEditFeature';\n\nconst CELL_RESIZER_WIDTH = 4;\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 current selection\n    const selection = editor.getDOMSelection();\n\n    // Select first cell of the table\n    editor.setDOMSelection({\n        type: 'table',\n        firstColumn: 0,\n        firstRow: 0,\n        lastColumn: 0,\n        lastRow: 0,\n        table: table,\n    });\n\n    // Get the table content model\n    const cmTable = getFirstSelectedTable(editor.getContentModelCopy('disconnected'))[0];\n\n    // Restore selection\n    editor.setDOMSelection(selection);\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 = 'horizontalResizer';\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 = 'verticalResizer';\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 type { TableEditFeature } from './TableEditFeature';\nimport {\n    isElementOfType,\n    normalizeRect,\n    getFirstSelectedTable,\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 current selection\n    const selection = editor.getDOMSelection();\n\n    // Select first cell of the table\n    editor.setDOMSelection({\n        type: 'table',\n        firstColumn: 0,\n        firstRow: 0,\n        lastColumn: 0,\n        lastRow: 0,\n        table: table,\n    });\n\n    // Get the table content model\n    const cmTable = getFirstSelectedTable(editor.getContentModelCopy('disconnected'))[0];\n\n    // Restore selection\n    editor.setDOMSelection(selection);\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"]}

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

@@ -10,4 +10,4 @@ export interface TableEditFeature {
 /**
  * @internal
  */
-export declare function disposeTableEditFeature(resizer: TableEditFeature | null): void;
+export declare function disposeTableEditFeature(feature: TableEditFeature | null): void;

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

@@ -5,13 +5,13 @@ define(["require", "exports"], function (require, exports) {
     /**
      * @internal
      */
-    function disposeTableEditFeature(resizer) {
+    function disposeTableEditFeature(feature) {
         var _a, _b, _c;
-        if (resizer) {
-            (_b = (_a = resizer.div) === null || _a === void 0 ? void 0 : _a.parentNode) === null || _b === void 0 ? void 0 : _b.removeChild(resizer.div);
-            resizer.div = null;
-            (_c = resizer.featureHandler) === null || _c === void 0 ? void 0 : _c.dispose();
-            resizer.featureHandler = null;
+        if (feature) {
+            (_a = feature.featureHandler) === null || _a === void 0 ? void 0 : _a.dispose();
+            feature.featureHandler = null;
+            (_c = (_b = feature.div) === null || _b === void 0 ? void 0 : _b.parentNode) === null || _c === void 0 ? void 0 : _c.removeChild(feature.div);
+            feature.div = null;
         }
     }
     exports.disposeTableEditFeature = disposeTableEditFeature;

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

@@ -1 +1 @@
-{"version":3,"file":"TableEditFeature.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableEditFeature.ts"],"names":[],"mappings":";;;;IAWA;;OAEG;IACH,SAAgB,uBAAuB,CAAC,OAAgC;;QACpE,IAAI,OAAO,EAAE;YACT,MAAA,MAAA,OAAO,CAAC,GAAG,0CAAE,UAAU,0CAAE,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;YAClD,OAAO,CAAC,GAAG,GAAG,IAAI,CAAC;YACnB,MAAA,OAAO,CAAC,cAAc,0CAAE,OAAO,EAAE,CAAC;YAClC,OAAO,CAAC,cAAc,GAAG,IAAI,CAAC;SACjC;IACL,CAAC;IAPD,0DAOC","sourcesContent":["import type { Disposable } from '../../../pluginUtils/Disposable';\n\n/**\n * @internal\n */\nexport interface TableEditFeature {\n    node: Node;\n    div: HTMLDivElement | null;\n    featureHandler: Disposable | null;\n}\n\n/**\n * @internal\n */\nexport function disposeTableEditFeature(resizer: TableEditFeature | null) {\n    if (resizer) {\n        resizer.div?.parentNode?.removeChild(resizer.div);\n        resizer.div = null;\n        resizer.featureHandler?.dispose();\n        resizer.featureHandler = null;\n    }\n}\n"]}
+{"version":3,"file":"TableEditFeature.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableEditFeature.ts"],"names":[],"mappings":";;;;IAWA;;OAEG;IACH,SAAgB,uBAAuB,CAAC,OAAgC;;QACpE,IAAI,OAAO,EAAE;YACT,MAAA,OAAO,CAAC,cAAc,0CAAE,OAAO,EAAE,CAAC;YAClC,OAAO,CAAC,cAAc,GAAG,IAAI,CAAC;YAC9B,MAAA,MAAA,OAAO,CAAC,GAAG,0CAAE,UAAU,0CAAE,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;YAClD,OAAO,CAAC,GAAG,GAAG,IAAI,CAAC;SACtB;IACL,CAAC;IAPD,0DAOC","sourcesContent":["import type { Disposable } from '../../../pluginUtils/Disposable';\n\n/**\n * @internal\n */\nexport interface TableEditFeature {\n    node: Node;\n    div: HTMLDivElement | null;\n    featureHandler: Disposable | null;\n}\n\n/**\n * @internal\n */\nexport function disposeTableEditFeature(feature: TableEditFeature | null) {\n    if (feature) {\n        feature.featureHandler?.dispose();\n        feature.featureHandler = null;\n        feature.div?.parentNode?.removeChild(feature.div);\n        feature.div = null;\n    }\n}\n"]}

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

@@ -0,0 +1,4 @@
+/**
+ * Names of table edit features
+ */
+export declare type TableEditFeatureName = 'HorizontalTableInserter' | 'VerticalTableInserter' | 'TableMover' | 'TableResizer' | 'TableSelector' | 'CellResizer';

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

@@ -0,0 +1,5 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});
+//# sourceMappingURL=TableEditFeatureName.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TableEditFeatureName.js","sourceRoot":"","sources":["../../../../../../packages/roosterjs-content-model-plugins/lib/tableEdit/editors/features/TableEditFeatureName.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Names of table edit features\n */\nexport type TableEditFeatureName =\n    | 'HorizontalTableInserter'\n    | 'VerticalTableInserter'\n    | 'TableMover'\n    | 'TableResizer'\n    | 'TableSelector'\n    | 'CellResizer';\n"]}

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

@@ -1,6 +1,15 @@
 import type { TableEditFeature } from './TableEditFeature';
+import type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';
 import type { IEditor } from 'roosterjs-content-model-types';
 /**
  * @internal
  */
-export declare function createTableInserter(editor: IEditor, td: HTMLTableCellElement, table: HTMLTableElement, isRTL: boolean, isHorizontal: boolean, onInsert: () => void, getOnMouseOut: (feature: HTMLElement) => (ev: MouseEvent) => void, anchorContainer?: HTMLElement): TableEditFeature | null;
+export declare const HORIZONTAL_INSERTER_ID = "horizontalInserter";
+/**
+ * @internal
+ */
+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;

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 = void 0;
+    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;
@@ -9,7 +9,15 @@ define(["require", "exports", "../../../pluginUtils/CreateElement/createElement"
     /**
      * @internal
      */
-    function createTableInserter(editor, td, table, isRTL, isHorizontal, onInsert, getOnMouseOut, anchorContainer) {
+    exports.HORIZONTAL_INSERTER_ID = 'horizontalInserter';
+    /**
+     * @internal
+     */
+    exports.VERTICAL_INSERTER_ID = 'verticalInserter';
+    /**
+     * @internal
+     */
+    function createTableInserter(editor, td, table, isRTL, isHorizontal, onInsert, anchorContainer, onTableEditorCreated) {
         var tdRect = (0, roosterjs_content_model_dom_1.normalizeRect)(td.getBoundingClientRect());
         var viewPort = editor.getVisibleViewport();
         var tableRect = table && viewPort ? (0, getIntersectedRect_1.getIntersectedRect)([table], [viewPort]) : null;
@@ -20,7 +28,7 @@ define(["require", "exports", "../../../pluginUtils/CreateElement/createElement"
             var div = (0, createElement_1.createElement)(createElementData, document_1);
             if (isHorizontal) {
                 // tableRect.left/right is used because the Inserter is always intended to be on the side
-                div.id = 'horizontalInserter';
+                div.id = exports.HORIZONTAL_INSERTER_ID;
                 div.style.left = (isRTL
                     ? tableRect.right
                     : tableRect.left - (INSERTER_SIDE_LENGTH - 1 + 2 * INSERTER_BORDER_SIZE)) + "px";
@@ -28,21 +36,21 @@ define(["require", "exports", "../../../pluginUtils/CreateElement/createElement"
                 div.firstChild.style.width = tableRect.right - tableRect.left + "px";
             }
             else {
-                div.id = 'verticalInserter';
+                div.id = exports.VERTICAL_INSERTER_ID;
                 div.style.left = (isRTL ? tdRect.left - 8 : tdRect.right - 8) + "px";
                 // tableRect.top is used because the Inserter is always intended to be on top
                 div.style.top = tableRect.top - (INSERTER_SIDE_LENGTH - 1 + 2 * INSERTER_BORDER_SIZE) + "px";
                 div.firstChild.style.height = tableRect.bottom - tableRect.top + "px";
             }
             (anchorContainer || document_1.body).appendChild(div);
-            var handler = new TableInsertHandler(div, td, table, isHorizontal, editor, onInsert, getOnMouseOut);
+            var handler = new TableInsertHandler(div, td, table, isHorizontal, editor, onInsert, onTableEditorCreated);
             return { div: div, featureHandler: handler, node: td };
         }
         return null;
     }
     exports.createTableInserter = createTableInserter;
     var TableInsertHandler = /** @class */ (function () {
-        function TableInsertHandler(div, td, table, isHorizontal, editor, onInsert, getOnMouseOut) {
+        function TableInsertHandler(div, td, table, isHorizontal, editor, onInsert, onTableEditorCreated) {
             var _this = this;
             this.div = div;
             this.td = td;
@@ -77,15 +85,13 @@ define(["require", "exports", "../../../pluginUtils/CreateElement/createElement"
                 _this.onInsert();
             };
             this.div.addEventListener('click', this.insertTd);
-            this.onMouseOutEvent = getOnMouseOut(div);
-            this.div.addEventListener('mouseout', this.onMouseOutEvent);
+            this.disposer = onTableEditorCreated === null || onTableEditorCreated === void 0 ? void 0 : onTableEditorCreated(isHorizontal ? 'HorizontalTableInserter' : 'VerticalTableInserter', div);
         }
         TableInsertHandler.prototype.dispose = function () {
+            var _a;
             this.div.removeEventListener('click', this.insertTd);
-            if (this.onMouseOutEvent) {
-                this.div.removeEventListener('mouseout', this.onMouseOutEvent);
-            }
-            this.onMouseOutEvent = null;
+            (_a = this.disposer) === null || _a === void 0 ? void 0 : _a.call(this);
+            this.disposer = undefined;
         };
         return TableInsertHandler;
     }());

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 {\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 { TableEditFeature } from './TableEditFeature';\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/**\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    getOnMouseOut: (feature: HTMLElement) => (ev: MouseEvent) => void,\n    anchorContainer?: HTMLElement\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 = 'horizontalInserter';\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 = 'verticalInserter';\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            getOnMouseOut\n        );\n\n        return { div, featureHandler: handler, node: td };\n    }\n\n    return null;\n}\n\nclass TableInsertHandler implements Disposable {\n    private onMouseOutEvent: null | ((ev: MouseEvent) => 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        getOnMouseOut: (feature: HTMLElement) => (ev: MouseEvent) => void\n    ) {\n        this.div.addEventListener('click', this.insertTd);\n        this.onMouseOutEvent = getOnMouseOut(div);\n        this.div.addEventListener('mouseout', this.onMouseOutEvent);\n    }\n\n    dispose() {\n        this.div.removeEventListener('click', this.insertTd);\n\n        if (this.onMouseOutEvent) {\n            this.div.removeEventListener('mouseout', this.onMouseOutEvent);\n        }\n\n        this.onMouseOutEvent = null;\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\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"]}

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

@@ -1,8 +1,53 @@
-import type { IEditor } from 'roosterjs-content-model-types';
 import type { TableEditFeature } from './TableEditFeature';
+import type { OnTableEditorCreatedCallback } from '../../OnTableEditorCreatedCallback';
+import type { ContentModelTable, DOMSelection, IEditor, Rect } from 'roosterjs-content-model-types';
 /**
  * @internal
+ */
+export declare const TABLE_MOVER_ID = "_Table_Mover";
+/**
+ * @internal
+ * Allows user to move table to another position
  * Contains the function to select whole table
- * Moving behavior not implemented yet
  */
-export declare function createTableMover(table: HTMLTableElement, editor: IEditor, isRTL: boolean, onFinishDragging: (table: HTMLTableElement) => void, getOnMouseOut: (feature: HTMLElement) => (ev: MouseEvent) => void, contentDiv?: EventTarget | null, anchorContainer?: HTMLElement): TableEditFeature | null;
+export declare function createTableMover(table: HTMLTableElement, editor: IEditor, isRTL: boolean, onFinishDragging: (table: HTMLTableElement) => void, onStart: () => void, onEnd: () => void, contentDiv?: EventTarget | null, anchorContainer?: HTMLElement, onTableEditorCreated?: OnTableEditorCreatedCallback, disableMovement?: boolean): TableEditFeature | null;
+/**
+ * @internal
+ * Exported for testing
+ */
+export interface TableMoverContext {
+    table: HTMLTableElement;
+    zoomScale: number;
+    rect: Rect | null;
+    isRTL: boolean;
+    editor: IEditor;
+    div: HTMLElement;
+    onFinishDragging: (table: HTMLTableElement) => void;
+    onStart: () => void;
+    onEnd: () => void;
+    disableMovement?: boolean;
+}
+/**
+ * @internal
+ * Exported for testing
+ */
+export interface TableMoverInitValue {
+    cmTable: ContentModelTable | undefined;
+    initialSelection: DOMSelection | null;
+    tableRect: HTMLDivElement;
+}
+/**
+ * @internal
+ * Exported for testing
+ */
+export declare function onDragStart(context: TableMoverContext): TableMoverInitValue;
+/**
+ * @internal
+ * Exported for testing
+ */
+export declare function onDragging(context: TableMoverContext, event: MouseEvent, initValue: TableMoverInitValue): boolean;
+/**
+ * @internal
+ * Exported for testing
+ */
+export declare function onDragEnd(context: TableMoverContext, event: MouseEvent, initValue: TableMoverInitValue | undefined): boolean;