xstefen/OpenCut
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: improve keyboard event handling in timeline component

Browse Source
This commit is contained in:
Maze Winther
2025-07-09 23:25:08 +02:00
parent 6ba1021149
commit b6aa8e10d6
1 changed files with 22 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
apps/web/src/components/editor/timeline.tsx
View File

@ -139,6 +139,22 @@ export function Timeline() {
// Keyboard event for deleting selected elements
useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
// Don't trigger when typing in input fields or textareas
if (
e.target instanceof HTMLInputElement ||
e.target instanceof HTMLTextAreaElement
) {
return;
}
// Only trigger when timeline is focused or mouse is over timeline
if (
!isInTimeline &&
!timelineRef.current?.contains(document.activeElement)
) {
return;
}
if (
(e.key === "Delete" || e.key === "Backspace") &&
selectedElements.length > 0
@ -151,7 +167,12 @@ export function Timeline() {
};
window.addEventListener("keydown", handleKeyDown);
return () => window.removeEventListener("keydown", handleKeyDown);
}, [selectedElements, removeElementFromTrack, clearSelectedElements]);
}, [
selectedElements,
removeElementFromTrack,
clearSelectedElements,
isInTimeline,
]);
// Keyboard event for undo (Cmd+Z)
useEffect(() => {