diff --git a/packages/ui/src/context/dialog.tsx b/packages/ui/src/context/dialog.tsx index d45fe6632..a3aafa0c7 100644 --- a/packages/ui/src/context/dialog.tsx +++ b/packages/ui/src/context/dialog.tsx @@ -1,8 +1,10 @@ import { createContext, + createEffect, createRoot, createSignal, getOwner, + onCleanup, type Owner, type ParentProps, runWithOwner, @@ -34,6 +36,20 @@ function init() { setActive(undefined) } + createEffect(() => { + if (!active()) return + + const onKeyDown = (event: KeyboardEvent) => { + if (event.key !== "Escape") return + close() + event.preventDefault() + event.stopPropagation() + } + + window.addEventListener("keydown", onKeyDown, true) + onCleanup(() => window.removeEventListener("keydown", onKeyDown, true)) + }) + const show = (element: DialogElement, owner: Owner, onClose?: () => void) => { close() @@ -41,13 +57,13 @@ function init() { let dispose: (() => void) | undefined const node = runWithOwner(owner, () => - createRoot((d) => { + createRoot((d: () => void) => { dispose = d return ( { + onOpenChange={(open: boolean) => { if (open) return close() }}