From 03671583cdd376cbce3a86df545db7c1f65062f6 Mon Sep 17 00:00:00 2001
From: hypercross <helios.tnak@gmail.com>
Date: Wed, 8 Jul 2026 00:35:01 +0800
Subject: [PATCH] feat: allow closing dialogs by clicking backdrop

---
 src/components/journal/CreateSessionDialog.tsx | 10 ++++++++--
 src/components/journal/InviteDialog.tsx        | 10 ++++++++--
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/components/journal/CreateSessionDialog.tsx b/src/components/journal/CreateSessionDialog.tsx
index a37f2aa..0ce847a 100644
--- a/src/components/journal/CreateSessionDialog.tsx
+++ b/src/components/journal/CreateSessionDialog.tsx
@@ -25,8 +25,14 @@ export const CreateSessionDialog: Component<CreateSessionDialogProps> = (
 
   return (
     <Show when={props.open}>
-      <div class="absolute inset-0 z-50 flex items-center justify-center bg-black/20">
-        <div class="bg-white rounded-lg border border-gray-200 shadow-xl w-[260px] p-4 space-y-3">
+      <div
+        class="absolute inset-0 z-50 flex items-center justify-center bg-black/20"
+        onClick={props.onClose}
+      >
+        <div
+          class="bg-white rounded-lg border border-gray-200 shadow-xl w-[280px] p-4 space-y-3"
+          onClick={(e) => e.stopPropagation()}
+        >
           <div class="flex items-center justify-between">
             <h3 class="text-sm font-semibold text-gray-800">新建会话</h3>
             <button
diff --git a/src/components/journal/InviteDialog.tsx b/src/components/journal/InviteDialog.tsx
index 6f4ff94..1d79427 100644
--- a/src/components/journal/InviteDialog.tsx
+++ b/src/components/journal/InviteDialog.tsx
@@ -37,8 +37,14 @@ export const InviteDialog: Component<InviteDialogProps> = (props) => {
   };
 
   return (
-    <div class="absolute inset-0 z-50 flex items-center justify-center bg-black/20">
-      <div class="bg-white rounded-lg border border-gray-200 shadow-xl w-[280px] p-4 space-y-3">
+    <div
+      class="absolute inset-0 z-50 flex items-center justify-center bg-black/20"
+      onClick={props.onClose}
+    >
+      <div
+        class="bg-white rounded-lg border border-gray-200 shadow-xl w-[280px] p-4 space-y-3"
+        onClick={(e) => e.stopPropagation()}
+      >
         <div class="flex items-center justify-between">
           <h3 class="text-sm font-semibold text-gray-800">邀请玩家</h3>
           <button