From 16f4fc045698c39b8922476bc5a76a18a08e3073 Mon Sep 17 00:00:00 2001
From: Floyd Wang <gassnake999@gmail.com>
Date: Tue, 5 Aug 2025 19:10:38 +0800
Subject: [PATCH] drawer: Fix the `overlay_closable` not working (#1113)

---
 crates/story/src/drawer_story.rs |  2 ++
 crates/ui/src/drawer.rs          | 13 +++++++++++--
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/crates/story/src/drawer_story.rs b/crates/story/src/drawer_story.rs
index f758d664..d7c3f106 100644
--- a/crates/story/src/drawer_story.rs
+++ b/crates/story/src/drawer_story.rs
@@ -294,10 +294,12 @@ impl DrawerStory {
         };
 
         let overlay = self.modal_overlay;
+        let overlay_closable = self.overlay_closable;
         let input1 = self.input1.clone();
         let date = self.date.clone();
         window.open_drawer_at(placement, cx, move |this, _, cx| {
             this.overlay(overlay)
+                .overlay_closable(overlay_closable)
                 .size(px(400.))
                 .title("Drawer Title")
                 .gap_4()
diff --git a/crates/ui/src/drawer.rs b/crates/ui/src/drawer.rs
index 6360e069..94bfa891 100644
--- a/crates/ui/src/drawer.rs
+++ b/crates/ui/src/drawer.rs
@@ -34,6 +34,7 @@ pub struct Drawer {
     content: Div,
     margin_top: Pixels,
     overlay: bool,
+    overlay_closable: bool,
 }
 
 impl Drawer {
@@ -48,6 +49,7 @@ impl Drawer {
             content: v_flex().px_4().py_3(),
             margin_top: TITLE_BAR_HEIGHT,
             overlay: true,
+            overlay_closable: true,
             on_close: Rc::new(|_, _, _| {}),
         }
     }
@@ -90,6 +92,12 @@ impl Drawer {
         self
     }
 
+    /// Set whether the drawer should be closable by clicking the overlay, default is `true`.
+    pub fn overlay_closable(mut self, overlay_closable: bool) -> Self {
+        self.overlay_closable = overlay_closable;
+        self
+    }
+
     /// Listen to the close event of the drawer.
     pub fn on_close(
         mut self,
@@ -136,7 +144,7 @@ impl RenderOnce for Drawer {
                     .w(size.width)
                     .h(size.height - titlebar_height)
                     .bg(overlay_color(self.overlay, cx))
-                    .when(self.overlay, |this| {
+                    .when(self.overlay_closable, |this| {
                         this.on_mouse_down(MouseButton::Left, {
                             let on_close = self.on_close.clone();
                             move |_, window, cx| {
@@ -184,7 +192,8 @@ impl RenderOnce for Drawer {
                                 // TitleBar
                                 h_flex()
                                     .justify_between()
-                                    .px_4()
+                                    .pl_4()
+                                    .pr_3()
                                     .py_2()
                                     .w_full()
                                     .font_semibold()