mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-05-03 10:00:07 -04:00
fix: focus on last active element when dialog closes (#3447)
* fix: focus on last active element when dialog closes * useState instead of ref
This commit is contained in:
parent
793b69e592
commit
c0047269c1
5 changed files with 15 additions and 14 deletions
|
@ -2,6 +2,7 @@ import React, { useState } from "react";
|
|||
import { t } from "../i18n";
|
||||
|
||||
import { Dialog } from "./Dialog";
|
||||
import { useExcalidrawContainer } from "./App";
|
||||
|
||||
export const ErrorDialog = ({
|
||||
message,
|
||||
|
@ -11,6 +12,7 @@ export const ErrorDialog = ({
|
|||
onClose?: () => void;
|
||||
}) => {
|
||||
const [modalIsShown, setModalIsShown] = useState(!!message);
|
||||
const excalidrawContainer = useExcalidrawContainer();
|
||||
|
||||
const handleClose = React.useCallback(() => {
|
||||
setModalIsShown(false);
|
||||
|
@ -18,8 +20,9 @@ export const ErrorDialog = ({
|
|||
if (onClose) {
|
||||
onClose();
|
||||
}
|
||||
document.querySelector<HTMLElement>(".excalidraw-container")?.focus();
|
||||
}, [onClose]);
|
||||
// TODO: Fix the A11y issues so this is never needed since we should always focus on last active element
|
||||
excalidrawContainer?.focus();
|
||||
}, [onClose, excalidrawContainer]);
|
||||
|
||||
return (
|
||||
<>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue