@contrail/document-table 1.0.1

package/README.md

@@ -0,0 +1 @@
+Supplies common data structures and logic for managing document tables.

package/lib/index.d.ts

@@ -0,0 +1,7 @@
+export * from './table-border-ranges';
+export * from './table-constants';
+export * from './table-copy.service';
+export * from './table-merge.service';
+export * from './table-paste.service';
+export * from './table.service';
+export * from './table-range';

package/lib/index.js

@@ -0,0 +1,23 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./table-border-ranges"), exports);
+__exportStar(require("./table-constants"), exports);
+__exportStar(require("./table-copy.service"), exports);
+__exportStar(require("./table-merge.service"), exports);
+__exportStar(require("./table-paste.service"), exports);
+__exportStar(require("./table.service"), exports);
+__exportStar(require("./table-range"), exports);

package/lib/table-border-ranges.d.ts

@@ -0,0 +1,5 @@
+import { TableRange } from './table-range';
+export type TableBorderType = 'all' | 'outside';
+export declare function tableBorderRanges(range: TableRange, mergedRanges: TableRange[], includeMergeIfFirstCell?: boolean): [TableRange, TableBorderType][];
+export declare function selectedTableBorderRanges(selectedRanges: TableRange[], mergedRanges: TableRange[]): [TableRange, TableBorderType][];
+export declare function mergedTableRanges(range: TableRange, mergedRanges: TableRange[], includeMergeIfFirstCell?: boolean): TableRange[];

package/lib/table-border-ranges.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mergedTableRanges = exports.selectedTableBorderRanges = exports.tableBorderRanges = void 0;
+const table_range_1 = require("./table-range");
+function tableBorderRanges(range, mergedRanges, includeMergeIfFirstCell = false) {
+    const intersectedMergedRanges = mergedRanges.filter((r) => r.intersects(range));
+    const borderRanges = [];
+    if (intersectedMergedRanges.length <= 0) {
+        borderRanges.push([range, 'all']);
+    }
+    else {
+        for (let merge of intersectedMergedRanges) {
+            if (includeMergeIfFirstCell) {
+                if (merge.start().within(range)) {
+                    borderRanges.push([merge, 'outside']);
+                }
+            }
+            else {
+                borderRanges.push([merge, 'outside']);
+            }
+            if (!range.within(merge)) {
+                const otherIntersectedMergedRanges = intersectedMergedRanges.filter((r) => !r.equals(merge));
+                range.difference(merge).forEach((diffRange) => {
+                    borderRanges.push(...tableBorderRanges(diffRange, otherIntersectedMergedRanges, includeMergeIfFirstCell));
+                });
+                break;
+            }
+        }
+    }
+    return borderRanges;
+}
+exports.tableBorderRanges = tableBorderRanges;
+function selectedTableBorderRanges(selectedRanges, mergedRanges) {
+    const selectedBorderRanges = [];
+    for (const range of selectedRanges) {
+        selectedBorderRanges.push(...tableBorderRanges(range, mergedRanges));
+    }
+    return selectedBorderRanges;
+}
+exports.selectedTableBorderRanges = selectedTableBorderRanges;
+function mergedTableRangesRec(range, mergedRanges, includeMergeIfFirstCell = false) {
+    return tableBorderRanges(range, mergedRanges, includeMergeIfFirstCell).map(([range, borderType]) => range);
+}
+function mergedTableRanges(range, mergedRanges, includeMergeIfFirstCell = false) {
+    return (0, table_range_1.uniqueRanges)(mergedTableRangesRec(range, mergedRanges, includeMergeIfFirstCell));
+}
+exports.mergedTableRanges = mergedTableRanges;

package/lib/table-constants.d.ts

@@ -0,0 +1,18 @@
+export declare const TABLE_ROW_MIN_HEIGHT = 28;
+export declare const TABLE_COLUMN_MIN_WIDTH = 28;
+export declare const TABLE_DRAG_HANDLE_WIDTH = 40;
+export declare const TABLE_DRAG_HANDLE_HEIGHT = 20;
+export declare const TABLE_DRAG_HANDLE_PADDING = 40;
+export declare const TABLE_DRAG_HANDLE_RADIUS = 20;
+export declare const TABLE_DRAG_HANDLE_ARROW_X = 3;
+export declare const TABLE_DRAG_HANDLE_ARROW_Y = 4;
+export declare const TABLE_DRAG_HANDLE_ARROW_LENGTH = 7;
+export declare const TABLE_DRAG_HANDLE_ARROW_LINE_WIDTH = 2;
+export declare const TABLE_CELL_WIDTH = 200;
+export declare const TABLE_CELL_HEIGHT = 120;
+export declare const TABLE_TEXT_PADDING = 5;
+export declare const TRANSPARENT_COLOR = "rgba(0,0,0,0)";
+export declare const DEFAULT_TEXT_FONT_FAMILY = "Roboto";
+export declare const DEFAULT_TEXT_FONT_SIZE = 11;
+export declare const TEXT_VALIGN = "top";
+export declare const TEXT_ALIGN = "left";

package/lib/table-constants.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TEXT_ALIGN = exports.TEXT_VALIGN = exports.DEFAULT_TEXT_FONT_SIZE = exports.DEFAULT_TEXT_FONT_FAMILY = exports.TRANSPARENT_COLOR = exports.TABLE_TEXT_PADDING = exports.TABLE_CELL_HEIGHT = exports.TABLE_CELL_WIDTH = exports.TABLE_DRAG_HANDLE_ARROW_LINE_WIDTH = exports.TABLE_DRAG_HANDLE_ARROW_LENGTH = exports.TABLE_DRAG_HANDLE_ARROW_Y = exports.TABLE_DRAG_HANDLE_ARROW_X = exports.TABLE_DRAG_HANDLE_RADIUS = exports.TABLE_DRAG_HANDLE_PADDING = exports.TABLE_DRAG_HANDLE_HEIGHT = exports.TABLE_DRAG_HANDLE_WIDTH = exports.TABLE_COLUMN_MIN_WIDTH = exports.TABLE_ROW_MIN_HEIGHT = void 0;
+exports.TABLE_ROW_MIN_HEIGHT = 28;
+exports.TABLE_COLUMN_MIN_WIDTH = 28;
+exports.TABLE_DRAG_HANDLE_WIDTH = 40;
+exports.TABLE_DRAG_HANDLE_HEIGHT = 20;
+exports.TABLE_DRAG_HANDLE_PADDING = 40;
+exports.TABLE_DRAG_HANDLE_RADIUS = 20;
+exports.TABLE_DRAG_HANDLE_ARROW_X = 3;
+exports.TABLE_DRAG_HANDLE_ARROW_Y = 4;
+exports.TABLE_DRAG_HANDLE_ARROW_LENGTH = 7;
+exports.TABLE_DRAG_HANDLE_ARROW_LINE_WIDTH = 2;
+exports.TABLE_CELL_WIDTH = 200;
+exports.TABLE_CELL_HEIGHT = 120;
+exports.TABLE_TEXT_PADDING = 5;
+exports.TRANSPARENT_COLOR = 'rgba(0,0,0,0)';
+exports.DEFAULT_TEXT_FONT_FAMILY = 'Roboto';
+exports.DEFAULT_TEXT_FONT_SIZE = 11;
+exports.TEXT_VALIGN = 'top';
+exports.TEXT_ALIGN = 'left';

package/lib/table-copy.service.d.ts

@@ -0,0 +1,8 @@
+import { DocumentElement } from '@contrail/documents';
+export declare class TableCopyService {
+    constructor();
+    static copy(tableElement: DocumentElement, childElements: DocumentElement[]): DocumentElement[];
+    static createTableFromCells(element: DocumentElement, rows: DocumentElement[], columns: DocumentElement[], cells: DocumentElement[]): DocumentElement[];
+    static createTableFromCell(cellElement: DocumentElement): DocumentElement[];
+    static createTextFromCell(cellElement: DocumentElement): DocumentElement;
+}

package/lib/table-copy.service.js

@@ -0,0 +1,295 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableCopyService = void 0;
+const documents_1 = require("@contrail/documents");
+const util_1 = require("@contrail/util");
+const nanoid_1 = require("nanoid");
+const table_constants_1 = require("./table-constants");
+const table_service_1 = require("./table.service");
+class TableCopyService {
+    constructor() { }
+    static copy(tableElement, childElements) {
+        const copiedChildElementIds = new Map();
+        const childElementsMap = new Map();
+        childElements.forEach(element => {
+            childElementsMap.set(element.id, element);
+        });
+        const rowIds = [];
+        const columnIds = [];
+        const oldTableElement = util_1.ObjectUtil.cloneDeep(tableElement);
+        delete oldTableElement.id;
+        const newTableElement = documents_1.DocumentElementFactory.createElement('table', oldTableElement);
+        newTableElement.tableId = newTableElement.id;
+        const newChildElements = [];
+        for (let i = 0; i < tableElement.rowIds.length; i++) {
+            const oldId = tableElement.rowIds[i];
+            const oldElement = childElementsMap.get(oldId);
+            if (!oldElement)
+                throw new Error('Invalid table element');
+            const oldElementCopy = util_1.ObjectUtil.cloneDeep(oldElement);
+            delete oldElementCopy.id;
+            delete oldElementCopy.updatedOn;
+            delete oldElementCopy.updatedById;
+            delete oldElementCopy.createdOn;
+            delete oldElementCopy.createdById;
+            oldElementCopy.tableId = newTableElement.id;
+            const newElement = documents_1.DocumentElementFactory.createElement('row', oldElementCopy);
+            copiedChildElementIds.set(oldId, newElement.id);
+            rowIds.push(newElement.id);
+            newChildElements.push(newElement);
+        }
+        for (let i = 0; i < tableElement.columnIds.length; i++) {
+            const oldId = tableElement.columnIds[i];
+            const oldElement = childElementsMap.get(oldId);
+            if (!oldElement)
+                throw new Error('Invalid table element');
+            const oldElementCopy = util_1.ObjectUtil.cloneDeep(oldElement);
+            delete oldElementCopy.id;
+            delete oldElementCopy.updatedOn;
+            delete oldElementCopy.updatedById;
+            delete oldElementCopy.createdOn;
+            delete oldElementCopy.createdById;
+            oldElementCopy.tableId = newTableElement.id;
+            const newElement = documents_1.DocumentElementFactory.createElement('column', oldElementCopy);
+            copiedChildElementIds.set(oldId, newElement.id);
+            columnIds.push(newElement.id);
+            newChildElements.push(newElement);
+        }
+        const cellElements = childElements.filter(e => e.type === 'cell');
+        if (cellElements.length < tableElement.rowIds.length * tableElement.columnIds.length) {
+            for (let i = 0; i < tableElement.rowIds.length; i++) {
+                for (let j = 0; j < tableElement.columnIds.length; j++) {
+                    const rowId = tableElement.rowIds[i];
+                    const columnId = tableElement.columnIds[j];
+                    const cellElement = cellElements.find(e => e.type === 'cell' && e.rowId === rowId && e.columnId === columnId);
+                    if (!cellElement) {
+                        const row = childElements.find(e => e.id === rowId);
+                        const column = childElements.find(e => e.id === columnId);
+                        cellElements.push((0, table_service_1.createCell)({
+                            rowId,
+                            columnId,
+                            tableId: tableElement.id,
+                            size: {
+                                width: column.size.width,
+                                height: row.size.height,
+                            },
+                        }));
+                    }
+                }
+            }
+        }
+        for (let i = 0; i < cellElements.length; i++) {
+            const oldCell = cellElements[i];
+            const newRowId = copiedChildElementIds.get(oldCell.rowId);
+            const newColumnId = copiedChildElementIds.get(oldCell.columnId);
+            if (!newRowId || !newColumnId)
+                throw new Error('Invalid table element');
+            const oldElementCopy = util_1.ObjectUtil.cloneDeep(oldCell);
+            delete oldElementCopy.id;
+            delete oldElementCopy.updatedOn;
+            delete oldElementCopy.updatedById;
+            delete oldElementCopy.createdOn;
+            delete oldElementCopy.createdById;
+            oldElementCopy.tableId = newTableElement.id;
+            oldElementCopy.rowId = newRowId;
+            oldElementCopy.columnId = newColumnId;
+            const newElement = documents_1.DocumentElementFactory.createElement('cell', oldElementCopy);
+            newChildElements.push(newElement);
+        }
+        newTableElement.rowIds = rowIds;
+        newTableElement.columnIds = columnIds;
+        return [newTableElement, ...newChildElements];
+    }
+    static createTableFromCells(element, rows, columns, cells) {
+        const rowElements = [];
+        const rowIds = new Map();
+        const columnElements = [];
+        const columnIds = new Map();
+        const cellElements = [];
+        const existingCellsMap = new Map();
+        const tableId = (0, nanoid_1.nanoid)(16);
+        let width = 0, height = 0;
+        let startRow, endRow, startColumn, endColumn;
+        cells.forEach(cell => {
+            const rowIndex = element.rowIds.indexOf(cell.rowId);
+            const columnIndex = element.columnIds.indexOf(cell.columnId);
+            const isNotSet = startRow == undefined;
+            if (isNotSet || rowIndex < startRow)
+                startRow = rowIndex;
+            if (isNotSet || rowIndex > endRow)
+                endRow = rowIndex;
+            if (isNotSet || columnIndex < startColumn)
+                startColumn = columnIndex;
+            if (isNotSet || columnIndex > endColumn)
+                endColumn = columnIndex;
+            existingCellsMap.set(`${rowIndex}_${columnIndex}`, cell);
+        });
+        const skipRows = Array.from({ length: endRow - startRow + 1 }, (value, index) => startRow + index).filter(i => !Array.from(existingCellsMap.keys()).find(v => v.startsWith(`${i}_`)));
+        const skipColumns = Array.from({ length: endColumn - startColumn + 1 }, (value, index) => startColumn + index).filter(j => !Array.from(existingCellsMap.keys()).find(v => v.endsWith(`_${j}`)));
+        for (let i = startRow; i <= endRow; i++) {
+            if (skipRows.indexOf(i) !== -1)
+                continue;
+            const rowId = (0, nanoid_1.nanoid)(16);
+            const row = {
+                id: rowId,
+                tableId,
+                type: 'row',
+                size: {
+                    width: 1,
+                    height: rows[i].size.height,
+                },
+                style: {
+                    backgroundColor: table_constants_1.TRANSPARENT_COLOR,
+                },
+                position: { x: 0, y: 0 },
+            };
+            height += row.size.height;
+            rowIds.set(i, rowId);
+            rowElements.push(row);
+        }
+        for (let j = startColumn; j <= endColumn; j++) {
+            if (skipColumns.indexOf(j) !== -1)
+                continue;
+            const columnId = (0, nanoid_1.nanoid)(16);
+            const column = {
+                id: columnId,
+                tableId,
+                type: 'column',
+                size: {
+                    width: columns[j].size.width,
+                    height: 1,
+                },
+                style: {
+                    backgroundColor: table_constants_1.TRANSPARENT_COLOR,
+                },
+                position: { x: 0, y: 0 },
+            };
+            width += column.size.width;
+            columnIds.set(j, columnId);
+            columnElements.push(column);
+        }
+        for (let i = startRow; i <= endRow; i++) {
+            if (skipRows.indexOf(i) !== -1)
+                continue;
+            for (let j = startColumn; j <= endColumn; j++) {
+                if (skipColumns.indexOf(j) !== -1)
+                    continue;
+                const cell = existingCellsMap.get(`${i}_${j}`);
+                if (cell) {
+                    const element = (0, table_service_1.createCell)({
+                        rowId: rowIds.get(i),
+                        columnId: columnIds.get(j),
+                        tableId,
+                        text: cell.text,
+                        colspan: cell.colspan,
+                        rowspan: cell.rowspan,
+                        size: {
+                            width: cell.size.width,
+                            height: cell.size.height,
+                        },
+                        style: util_1.ObjectUtil.cloneDeep(cell.style),
+                        position: { x: 0, y: 0 },
+                    });
+                    cellElements.push(element);
+                }
+            }
+        }
+        const tableElement = {
+            type: 'table',
+            id: tableId,
+            position: Object.assign({}, element.position),
+            scale: Object.assign({}, element.scale),
+            size: {
+                width,
+                height,
+            },
+            style: {
+                backgroundColor: table_constants_1.TRANSPARENT_COLOR,
+                border: {
+                    width: 1,
+                    color: '#616161',
+                },
+            },
+            rowIds: Array.from(rowIds.values()),
+            columnIds: Array.from(columnIds.values()),
+        };
+        return [tableElement, ...rowElements, ...columnElements, ...cellElements];
+    }
+    static createTableFromCell(cellElement) {
+        const tableId = (0, nanoid_1.nanoid)(16);
+        const rowId = (0, nanoid_1.nanoid)(16);
+        const row = {
+            id: rowId,
+            tableId,
+            type: 'row',
+            size: {
+                width: 1,
+                height: cellElement.size.height,
+            },
+            style: {
+                backgroundColor: table_constants_1.TRANSPARENT_COLOR,
+            },
+            position: { x: 0, y: 0 },
+        };
+        const columnId = (0, nanoid_1.nanoid)(16);
+        const column = {
+            id: columnId,
+            tableId,
+            type: 'column',
+            size: {
+                width: cellElement.size.width,
+                height: 1,
+            },
+            style: {
+                backgroundColor: table_constants_1.TRANSPARENT_COLOR,
+            },
+            position: { x: 0, y: 0 },
+        };
+        const cell = util_1.ObjectUtil.mergeDeep(util_1.ObjectUtil.cloneDeep(cellElement), {
+            id: (0, nanoid_1.nanoid)(16),
+            type: 'cell',
+            rowId,
+            columnId,
+            tableId,
+            scale: undefined,
+        });
+        const tableElement = {
+            type: 'table',
+            id: tableId,
+            position: Object.assign({}, cellElement.position),
+            scale: Object.assign({}, cellElement.scale),
+            size: Object.assign({}, cellElement.size),
+            style: {
+                backgroundColor: table_constants_1.TRANSPARENT_COLOR,
+                border: {
+                    width: 1,
+                    color: '#616161',
+                },
+            },
+            rowIds: [rowId],
+            columnIds: [columnId],
+        };
+        return [tableElement, row, column, cell];
+    }
+    static createTextFromCell(cellElement) {
+        var _a, _b, _c, _d, _e, _f;
+        const fontFamily = `${(_c = (_b = (_a = cellElement.style) === null || _a === void 0 ? void 0 : _a.font) === null || _b === void 0 ? void 0 : _b.family) !== null && _c !== void 0 ? _c : table_constants_1.DEFAULT_TEXT_FONT_FAMILY}`;
+        const fontSize = `${(_f = (_e = (_d = cellElement.style) === null || _d === void 0 ? void 0 : _d.font) === null || _e === void 0 ? void 0 : _e.size) !== null && _f !== void 0 ? _f : table_constants_1.DEFAULT_TEXT_FONT_SIZE}pt`;
+        const size = table_service_1.TableService.getSize(cellElement.text, `width: ${cellElement.size.width -
+            table_constants_1.TABLE_TEXT_PADDING * 2}px; height: auto; font-family: ${fontFamily}; font-size: ${fontSize};`);
+        const documentElement = {
+            isTextTool: true,
+            text: cellElement.text,
+            position: Object.assign({}, cellElement.position),
+            scale: Object.assign({}, cellElement.scale),
+            size: Object.assign({}, size),
+            style: util_1.ObjectUtil.mergeDeep(util_1.ObjectUtil.cloneDeep(cellElement.style), {
+                border: {
+                    width: 0,
+                },
+            }),
+        };
+        return documents_1.DocumentElementFactory.createTextElement('', documentElement);
+    }
+}
+exports.TableCopyService = TableCopyService;

package/lib/table-merge.service.d.ts

@@ -0,0 +1,11 @@
+import { DocumentElement, DocumentElementChanges } from '@contrail/documents';
+import { TableRange } from './table-range';
+export declare class TableMergeService {
+    constructor();
+    static getMergedRange(tableElement: any, element: DocumentElement): TableRange;
+    static getMergedRanges(tableElement: DocumentElement, childElements: DocumentElement[]): TableRange[];
+    static getMergedCells(cell: DocumentElement, tableElement: DocumentElement, childElements: DocumentElement[]): DocumentElement[];
+    static isValidRangeToMerge(tableElement: DocumentElement, childElements: DocumentElement[], tableRange: TableRange): boolean;
+    static merge(tableElement: DocumentElement, childElements: DocumentElement[], tableRange: TableRange): DocumentElementChanges;
+    static unmerge(tableElement: DocumentElement, childElements: DocumentElement[], tableRange: TableRange): DocumentElementChanges;
+}

package/lib/table-merge.service.js

@@ -0,0 +1,143 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableMergeService = void 0;
+const util_1 = require("@contrail/util");
+const table_service_1 = require("./table.service");
+const table_range_1 = require("./table-range");
+class TableMergeService {
+    constructor() { }
+    static getMergedRange(tableElement, element) {
+        if (element.type === 'cell' && (element.colspan > 1 || element.rowspan > 1)) {
+            const rowIndex = tableElement.rowIds.indexOf(element.rowId);
+            const columnIndex = tableElement.columnIds.indexOf(element.columnId);
+            return new table_range_1.TableRange(rowIndex, rowIndex + (element.rowspan > 1 ? element.rowspan - 1 : 0), columnIndex, columnIndex + (element.colspan > 1 ? element.colspan - 1 : 0));
+        }
+        return null;
+    }
+    static getMergedRanges(tableElement, childElements) {
+        const ranges = [];
+        for (const element of childElements) {
+            const mergedRange = TableMergeService.getMergedRange(tableElement, element);
+            if (mergedRange)
+                ranges.push(mergedRange);
+        }
+        return ranges;
+    }
+    static getMergedCells(cell, tableElement, childElements) {
+        var _a, _b;
+        const mergedCells = [];
+        if (cell.colspan > 1 || cell.rowspan > 1) {
+            const rowIndex = tableElement.rowIds.indexOf(cell.rowId);
+            const columnIndex = tableElement.columnIds.indexOf(cell.columnId);
+            for (let i = rowIndex; i < rowIndex + ((_a = cell.rowspan) !== null && _a !== void 0 ? _a : 1); i++) {
+                const rowId = tableElement.rowIds[i];
+                for (let j = columnIndex; j < columnIndex + ((_b = cell.colspan) !== null && _b !== void 0 ? _b : 1); j++) {
+                    const columnId = tableElement.columnIds[j];
+                    const mergedCell = childElements.find(e => e.type === 'cell' && e.columnId === columnId && e.rowId === rowId);
+                    if (mergedCell) {
+                        mergedCells.push(mergedCell);
+                    }
+                }
+            }
+        }
+        return mergedCells;
+    }
+    static isValidRangeToMerge(tableElement, childElements, tableRange) {
+        if (tableRange.singular())
+            return false;
+        const mergedRanges = TableMergeService.getMergedRanges(tableElement, childElements).filter(range => range.intersects(tableRange) && !range.within(tableRange));
+        return mergedRanges.length === 0;
+    }
+    static merge(tableElement, childElements, tableRange) {
+        if (!this.isValidRangeToMerge(tableElement, childElements, tableRange)) {
+            throw new Error(table_service_1.TABLE_ERROR.INVALID_RANGE_TO_MERGE);
+        }
+        const colspan = tableRange.cols + 1;
+        const rowspan = tableRange.rows + 1;
+        const elementsToUpdate = [];
+        let firstCell;
+        tableRange.each((rowIndex, columnIndex) => {
+            const rowId = tableElement.rowIds[rowIndex];
+            const columnId = tableElement.columnIds[columnIndex];
+            const element = childElements.find(e => e.type === 'cell' && e.columnId === columnId && e.rowId === rowId);
+            if (element) {
+                const elementUndo = util_1.ObjectUtil.cloneDeep(element);
+                element.colspan = 1;
+                element.rowspan = 1;
+                if (tableRange.isStart(rowIndex, columnIndex)) {
+                    firstCell = element;
+                    let width = 0;
+                    tableRange.eachColumn(columnIndex => {
+                        const columnId = tableElement.columnIds[columnIndex];
+                        const column = childElements.find(e => e.type === 'column' && e.id === columnId);
+                        width = width + column.size.width;
+                    });
+                    if (colspan > 1) {
+                        element.colspan = colspan;
+                    }
+                    if (rowspan > 1) {
+                        element.rowspan = rowspan;
+                    }
+                    element.size.width = width;
+                    element.size.height = table_service_1.TableService.getCellSize(element).height;
+                }
+                else {
+                    element.style = util_1.ObjectUtil.mergeDeep(util_1.ObjectUtil.cloneDeep(table_service_1.TableService.DEFAULT_CELL_STYLE), firstCell.style);
+                    table_service_1.TableService.clearCell(element);
+                }
+                elementsToUpdate.push({ change: element, undo: elementUndo });
+            }
+            else {
+                console.error(`Element was not found at row:${rowIndex} and column:${columnIndex}`, tableElement, childElements);
+                throw new Error();
+            }
+        });
+        return { elementsToUpdate };
+    }
+    static unmerge(tableElement, childElements, tableRange) {
+        const mergedRanges = TableMergeService.getMergedRanges(tableElement, childElements);
+        if (!mergedRanges.find(range => range.equals(tableRange)))
+            throw new Error(table_service_1.TABLE_ERROR.INVALID_RANGE_TO_UNMERGE);
+        const tableUndo = Object.assign(Object.assign({}, (0, table_service_1.tableData)(tableElement)), { size: Object.assign({}, tableElement.size) });
+        const elementsToUpdate = [];
+        let firstCell;
+        tableRange.each((rowIndex, columnIndex) => {
+            const rowId = tableElement.rowIds[rowIndex];
+            const columnId = tableElement.columnIds[columnIndex];
+            const element = childElements.find(e => e.type === 'cell' && e.columnId === columnId && e.rowId === rowId);
+            const column = childElements.find(e => e.type === 'column' && e.id === columnId);
+            const row = childElements.find(e => e.type === 'row' && e.id === rowId);
+            if (element && column && row) {
+                const elementUndo = util_1.ObjectUtil.cloneDeep(element);
+                element.colspan = 1;
+                element.rowspan = 1;
+                if (tableRange.isStart(rowIndex, columnIndex)) {
+                    firstCell = element;
+                    element.size.width = column.size.width;
+                    element.size.height = table_service_1.TableService.getCellSize(element).height;
+                    if (element.size.height > row.size.height) {
+                        elementsToUpdate.push(table_service_1.TableService.resizeRow(tableElement, childElements, rowId, element.size.height).elementsToUpdate[1]);
+                    }
+                }
+                else {
+                    element.style = util_1.ObjectUtil.cloneDeep(firstCell.style);
+                }
+                elementsToUpdate.push({ change: element, undo: elementUndo });
+            }
+            else {
+                console.error(`Element was not found at row:${rowIndex} and column:${columnIndex}`, tableElement, childElements);
+                throw new Error();
+            }
+        });
+        return {
+            elementsToUpdate: [
+                {
+                    change: Object.assign(Object.assign({}, (0, table_service_1.tableData)(tableElement)), { size: Object.assign({}, tableElement.size) }),
+                    undo: tableUndo,
+                },
+                ...elementsToUpdate,
+            ],
+        };
+    }
+}
+exports.TableMergeService = TableMergeService;

package/lib/table-paste.service.d.ts

@@ -0,0 +1,8 @@
+import { DocumentElement, DocumentElementChanges } from '@contrail/documents';
+export declare class TablePasteService {
+    private static isDebug;
+    constructor();
+    private static log;
+    private static pasteRowsAndColumns;
+    static pasteTableCells(tableElement: DocumentElement, childElements: DocumentElement[], elementsToPaste: DocumentElement[], targetRow: number, targetColumn: number): DocumentElementChanges;
+}