thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

fix: dropdowns should close on tab key (#4351)

Browse Source
This commit is contained in:
Aaryan Khandelwal 2024-05-03 15:39:14 +05:30 committed by GitHub
parent 1b55411919
commit 8cf4260219
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 10 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
web/hooks/use-dropdown-key-down.tsx
View File

@ -9,23 +9,25 @@ type TUseDropdownKeyDown = {
}; };
export const useDropdownKeyDown: TUseDropdownKeyDown = (onEnterKeyDown, onEscKeyDown, stopPropagation = true) => { export const useDropdownKeyDown: TUseDropdownKeyDown = (onEnterKeyDown, onEscKeyDown, stopPropagation = true) => {
const stopEventPropagation = (event: React.KeyboardEvent<HTMLElement>) => { const stopEventPropagation = useCallback(
if (stopPropagation) { (event: React.KeyboardEvent<HTMLElement>) => {
event.stopPropagation(); if (stopPropagation) {
event.preventDefault(); event.stopPropagation();
} event.preventDefault();
}; }
},
[stopPropagation]
);
const handleKeyDown = useCallback( const handleKeyDown = useCallback(
(event: React.KeyboardEvent<HTMLElement>) => { (event: React.KeyboardEvent<HTMLElement>) => {
if (event.key === "Enter") { if (event.key === "Enter") {
stopEventPropagation(event); stopEventPropagation(event);
onEnterKeyDown(); onEnterKeyDown();
} else if (event.key === "Escape") { } else if (event.key === "Escape") {
stopEventPropagation(event); stopEventPropagation(event);
onEscKeyDown(); onEscKeyDown();
} } else if (event.key === "Tab") onEscKeyDown();
}, },
[onEnterKeyDown, onEscKeyDown, stopEventPropagation] [onEnterKeyDown, onEscKeyDown, stopEventPropagation]
); );