From 14b00f64a7e4e834653068fe8f9f9f7cbdbde018 Mon Sep 17 00:00:00 2001
From: adamelmore <2363879+adamdottv@users.noreply.github.com>
Date: Sun, 25 Jan 2026 12:16:31 -0600
Subject: [PATCH] fix(app): escape should always close dialogs

---
 packages/ui/src/context/dialog.tsx | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

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 (
           <Kobalte
             modal
             open={true}
-            onOpenChange={(open) => {
+            onOpenChange={(open: boolean) => {
               if (open) return
               close()
             }}