import type { IEditor, CreateElementData } from 'roosterjs-editor-types'; /** * @internal * * A table has 6 hot areas to be resized/edited (take LTR example): * * [6] [ ] * +[ 1 ]+--------------------+ * |[ ]| | * [ ] [ ] | * [ ] [ ] | * [2] [3] | * [ ] [ ] | * [ ][ 4 ]| | * +------------------+--------------------+ * | | | * | | | * | | | * +------------------+--------------------+ * [5] * * 1 - Hover area to show insert column button * 2 - Hover area to show insert row button * 3 - Hover area to show vertical resizing bar * 4 - Hover area to show horizontal resizing bar * 5 - Hover area to show whole table resize button * 6 - Hover area to show whole table selector button * * When set a different current table or change current TD, we need to update these areas */ export default class TableEditor { private editor; readonly table: HTMLTableElement; private onChanged; private onShowHelperElement?; private anchorContainer?; private contentDiv?; private horizontalInserter; private verticalInserter; private horizontalResizer; private verticalResizer; private tableResizer; private tableSelector; private isRTL; private start; private end; private isCurrentlyEditing; constructor(editor: IEditor, table: HTMLTableElement, onChanged: () => void, onShowHelperElement?: ((elementData: CreateElementData, helperType: 'CellResizer' | 'TableInserter' | 'TableResizer' | 'TableSelector', tableOrTd: HTMLTableElement | HTMLTableCellElement) => void) | undefined, anchorContainer?: HTMLElement | undefined, contentDiv?: EventTarget | null | undefined); dispose(): void; isEditing(): boolean; isOwnedElement(node: Node): boolean; onMouseMove(x: number, y: number): void; private setEditorFeatures; private setResizingTd; /** * create or remove TableInserter * @param td td to attach to, set this to null to remove inserters (both horizontal and vertical) */ private setInserterTd; private disposeTableResizer; private disposeTableInserter; private disposeCellResizers; private disposeTableSelector; private onFinishEditing; private onStartTableResize; private onStartCellResize; private onStartResize; private onInserted; /** * Public only for testing purposes * @param table the table to select */ onSelect: (table: HTMLTableElement) => void; private getOnMouseOut; }