fix: move onKeyDown and onKeyUp from window to Stage

This commit is contained in:
trafficlunar 2025-02-01 17:57:00 +00:00
parent 0692466c76
commit 8dbb0b872a

View file

@ -408,7 +408,7 @@ function Canvas() {
}, [tool, holdingAltRef, scale, mouseCoords, blocks, canvasSize, setSelectionCoords, setSelectedBlock, zoom]); }, [tool, holdingAltRef, scale, mouseCoords, blocks, canvasSize, setSelectionCoords, setSelectedBlock, zoom]);
const onKeyDown = useCallback( const onKeyDown = useCallback(
async (e: KeyboardEvent) => { async (e: React.KeyboardEvent) => {
switch (e.key) { switch (e.key) {
case "Escape": case "Escape":
setSelectionLayerBlocks([]); setSelectionLayerBlocks([]);
@ -518,7 +518,7 @@ function Canvas() {
); );
const onKeyUp = useCallback( const onKeyUp = useCallback(
(e: KeyboardEvent) => { (e: React.KeyboardEvent) => {
switch (e.key) { switch (e.key) {
case " ": // Space case " ": // Space
setDragging(false); setDragging(false);
@ -575,13 +575,9 @@ function Canvas() {
e.preventDefault(); e.preventDefault();
}; };
window.addEventListener("keydown", onKeyDown);
window.addEventListener("keyup", onKeyUp);
window.addEventListener("beforeunload", onBeforeUnload); window.addEventListener("beforeunload", onBeforeUnload);
return () => { return () => {
window.removeEventListener("keydown", onKeyDown);
window.removeEventListener("keyup", onKeyUp);
window.removeEventListener("beforeunload", onBeforeUnload); window.removeEventListener("beforeunload", onBeforeUnload);
}; };
}, [onKeyDown, onKeyUp]); }, [onKeyDown, onKeyUp]);
@ -591,6 +587,9 @@ function Canvas() {
<Stage <Stage
width={stageSize.width} width={stageSize.width}
height={stageSize.height} height={stageSize.height}
tabIndex={0}
onKeyDown={onKeyDown}
onKeyUp={onKeyUp}
onMouseMove={onMouseMove} onMouseMove={onMouseMove}
onMouseDown={onMouseDown} onMouseDown={onMouseDown}
onMouseUp={onMouseUp} onMouseUp={onMouseUp}