smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: focus traps inside popovers (#5317)

Browse source
This commit is contained in:
David Luzar 2022-06-23 17:33:50 +02:00 • committed by GitHub
parent 50bc7e099a
commit af31e9dcc2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 54 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/components/ColorPicker.tsx
View file

@ -129,19 +129,7 @@ const Picker = ({
const handleKeyDown = (event: React.KeyboardEvent) => {
let handled = false;
if (event.key === KEYS.TAB) {
handled = true;
const { activeElement } = document;
if (event.shiftKey) {
if (activeElement === firstItem.current) {
colorInput.current?.focus();
event.preventDefault();
}
} else if (activeElement === colorInput.current) {
firstItem.current?.focus();
event.preventDefault();
}
} else if (isArrowKey(event.key)) {
if (isArrowKey(event.key)) {
handled = true;
const { activeElement } = document;
const isRTL = getLanguage().rtl;
@ -272,7 +260,8 @@ const Picker = ({
gallery.current = el;
}
}}
tabIndex={0}
// to allow focusing by clicking but not by tabbing
tabIndex={-1}
>
<div className="color-picker-content--default">
{renderColors(colors)}