diff --git a/packages/lexical-table/src/LexicalTableNode.ts b/packages/lexical-table/src/LexicalTableNode.ts index 838758e2e83..1de74231576 100644 --- a/packages/lexical-table/src/LexicalTableNode.ts +++ b/packages/lexical-table/src/LexicalTableNode.ts @@ -34,7 +34,10 @@ import {PIXEL_VALUE_REG_EXP} from './constants'; import {$isTableCellNode, TableCellNode} from './LexicalTableCellNode'; import {TableDOMCell, TableDOMTable} from './LexicalTableObserver'; import {TableRowNode} from './LexicalTableRowNode'; -import {getTable} from './LexicalTableSelectionHelpers'; +import { + $getNearestTableCellInTableFromDOMNode, + getTable, +} from './LexicalTableSelectionHelpers'; export type SerializedTableNode = Spread< { @@ -270,17 +273,16 @@ export class TableNode extends ElementNode { continue; } - const x = row.findIndex((cell) => { - if (!cell) { - return; + for (let x = 0; x < row.length; x++) { + const cell = row[x]; + if (cell == null) { + continue; } const {elem} = cell; - const cellNode = $getNearestNodeFromDOMNode(elem); - return cellNode === tableCellNode; - }); - - if (x !== -1) { - return {x, y}; + const cellNode = $getNearestTableCellInTableFromDOMNode(this, elem); + if (cellNode !== null && tableCellNode.is(cellNode)) { + return {x, y}; + } } } diff --git a/packages/lexical-table/src/LexicalTableObserver.ts b/packages/lexical-table/src/LexicalTableObserver.ts index 0d148257121..059c471b96d 100644 --- a/packages/lexical-table/src/LexicalTableObserver.ts +++ b/packages/lexical-table/src/LexicalTableObserver.ts @@ -17,7 +17,6 @@ import { $createRangeSelection, $createTextNode, $getEditor, - $getNearestNodeFromDOMNode, $getNodeByKey, $getRoot, $getSelection, @@ -38,7 +37,7 @@ import { type TableSelection, } from './LexicalTableSelection'; import { - $findTableNode, + $getNearestTableCellInTableFromDOMNode, $updateDOMForSelection, getTable, getTableElement, @@ -351,13 +350,15 @@ export class TableObserver { this.focusY = cellY; if (this.isHighlightingCells) { - const focusTableCellNode = $getNearestNodeFromDOMNode(cell.elem); + const focusTableCellNode = $getNearestTableCellInTableFromDOMNode( + tableNode, + cell.elem, + ); if ( this.tableSelection != null && this.anchorCellNodeKey != null && - $isTableCellNode(focusTableCellNode) && - tableNode.is($findTableNode(focusTableCellNode)) + focusTableCellNode !== null ) { this.focusCellNodeKey = focusTableCellNode.getKey(); this.tableSelection = $createTableSelectionFrom( @@ -407,9 +408,13 @@ export class TableObserver { this.anchorX = cell.x; this.anchorY = cell.y; - const anchorTableCellNode = $getNearestNodeFromDOMNode(cell.elem); + const {tableNode} = this.$lookup(); + const anchorTableCellNode = $getNearestTableCellInTableFromDOMNode( + tableNode, + cell.elem, + ); - if ($isTableCellNode(anchorTableCellNode)) { + if (anchorTableCellNode !== null) { const anchorNodeKey = anchorTableCellNode.getKey(); this.tableSelection = this.tableSelection != null diff --git a/packages/lexical-table/src/LexicalTableSelectionHelpers.ts b/packages/lexical-table/src/LexicalTableSelectionHelpers.ts index c6b45d63ffd..7959f1cfd75 100644 --- a/packages/lexical-table/src/LexicalTableSelectionHelpers.ts +++ b/packages/lexical-table/src/LexicalTableSelectionHelpers.ts @@ -15,6 +15,7 @@ import type { } from './LexicalTableSelection'; import type { BaseSelection, + EditorState, ElementFormatType, ElementNode, LexicalCommand, @@ -661,7 +662,10 @@ export function applyTableHandlers( } const tableCellNode = $findCellNode(selection.anchor.getNode()); - if (tableCellNode === null) { + if ( + tableCellNode === null || + !tableNode.is($findTableNode(tableCellNode)) + ) { return false; } @@ -966,13 +970,13 @@ export function applyTableHandlers( domSelection.focusNode, ); const isFocusOutside = - focusNode && !tableNode.is($findTableNode(focusNode)); + focusNode && !tableNode.isParentOf(focusNode); const anchorNode = $getNearestNodeFromDOMNode( domSelection.anchorNode, ); const isAnchorInside = - anchorNode && tableNode.is($findTableNode(anchorNode)); + anchorNode && tableNode.isParentOf(anchorNode); if ( isFocusOutside && @@ -1743,11 +1747,11 @@ function $handleArrowKey( ? selection.getNodes()[selection.getNodes().length - 1] : selection.getNodes()[0]; if (selectedNode) { - const tableCellNode = $findMatchingParent( + const tableCellNode = $findParentTableCellNodeInTable( + tableNode, selectedNode, - $isTableCellNode, ); - if (tableCellNode && tableNode.isParentOf(tableCellNode)) { + if (tableCellNode !== null) { const firstDescendant = tableNode.getFirstDescendant(); const lastDescendant = tableNode.getLastDescendant(); if (!firstDescendant || !lastDescendant) { @@ -2260,3 +2264,14 @@ export function $getObserverCellFromCellNodeOrThrow( tableObserver.table, ); } + +export function $getNearestTableCellInTableFromDOMNode( + tableNode: TableNode, + startingDOM: Node, + editorState?: EditorState, +) { + return $findParentTableCellNodeInTable( + tableNode, + $getNearestNodeFromDOMNode(startingDOM, editorState), + ); +}