From c43091de7689edb7df43d709a7054f034c82e983 Mon Sep 17 00:00:00 2001
From: luoxiao <luoxiaozero@163.com>
Date: Wed, 12 Apr 2023 21:15:38 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:=20modal=20add=20close=20icon?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Cargo.toml                       | 1 +
 examples/basic/src/demo_modal.rs | 2 +-
 src/modal/mod.rs                 | 3 ++-
 3 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/Cargo.toml b/Cargo.toml
index 4a78b94..0cc0886 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -17,6 +17,7 @@ leptos = { version = "0.2.4", features = ["stable"] }
 stylers = "0.3.1"
 web-sys = "0.3.61"
 leptos_dom = { version = "0.2.4" }
+leptos-icons = { git = "https://github.com/Carlosted/leptos-icons.git", features = ["AiCloseOutlined"] }
 
 [workspace]
 members = ["examples/basic"]
diff --git a/examples/basic/src/demo_modal.rs b/examples/basic/src/demo_modal.rs
index ed85ae6..cd19b9c 100644
--- a/examples/basic/src/demo_modal.rs
+++ b/examples/basic/src/demo_modal.rs
@@ -11,7 +11,7 @@ pub fn DemoModal(cx: Scope) -> impl IntoView {
         <Button on:click=move |_| set_open.update(move |value| *value = !*value)>
             "open modal"
         </Button>
-        <Modal title="" open=open on_cancel=on_cancel>
+        <Modal title="标题" open=open on_cancel=on_cancel>
             "sd"
         </Modal>
     }
diff --git a/src/modal/mod.rs b/src/modal/mod.rs
index cff89ad..ab7b313 100644
--- a/src/modal/mod.rs
+++ b/src/modal/mod.rs
@@ -3,6 +3,7 @@ use crate::teleport::*;
 use crate::utils::mount_style::mount_style;
 use leptos::*;
 use stylers::style_sheet_str;
+use leptos_icons::*;
 
 #[component]
 pub fn Modal(
@@ -30,7 +31,7 @@ pub fn Modal(
             cx,
             <>
                 <span style="cursor: pointer;" on:click=move |_| if let Some(on_cancel) = &on_cancel { on_cancel.set(())}>
-                    { "x" }
+                    <LeptosIcon icon=AiIcon::AiCloseOutlined/>
                 </span>
             </>
         }