diff --git a/v3/src/components/text/text-tile.tsx b/v3/src/components/text/text-tile.tsx index e004994fe..d552eef48 100644 --- a/v3/src/components/text/text-tile.tsx +++ b/v3/src/components/text/text-tile.tsx @@ -29,14 +29,21 @@ export const TextTile = observer(function TextTile({ tile }: ITileBaseProps) { }, [initialValue]) useEffect(() => { - return tile && mstReaction( + let animationFrame: number + const disposer = tile && mstReaction( () => isTileSelected() && tile?.transitionComplete, isSelected => { // RAF to delay focus request until after model processing completes - isSelected && requestAnimationFrame(() => ReactEditor.focus(editor)) + if (isSelected) { + animationFrame = requestAnimationFrame(() => ReactEditor.focus(editor)) + } }, { name: "FocusEditorOnTileSelect" }, tile ) + return () => { + if (animationFrame) cancelAnimationFrame(animationFrame) + disposer?.() + } }, [editor, isTileSelected, tile]) const textTileRef = useRef(null)