feat: upgrade leptos

Cargo.toml

@@ -13,10 +13,10 @@ license = "MIT"
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
 [dependencies]
-leptos = { version = "0.5.0-rc2",  features = ["csr"] }
+leptos = { version = "0.5.0",  features = ["csr"] }
 stylers = "0.3.2"
 web-sys = { version = "0.3.62", features = ["DomRect"] }
-leptos_dom = { version = "0.5.0-rc2" }
+leptos_dom = { version = "0.5.0" }
 wasm-bindgen = "0.2.85"
 icondata = { version = "0.0.7", features = [
     "AiCloseOutlined",

gh-pages/Cargo.toml

@@ -6,13 +6,13 @@ edition = "2021"
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
 [dependencies]
-leptos = { version = "0.5.0-rc2", features = ["csr"] }
+leptos = { version = "0.5.0", features = ["csr"] }
 melt-ui = { path = "../" }
 icondata = { version = "0.0.7", features = [
     "AiCloseOutlined",
     "AiCheckOutlined",
 ] }
-leptos_router = { version = "0.5.0-rc2", features = ["csr"] }
+leptos_router = { version = "0.5.0", features = ["csr"] }
 indoc = "2.0.1"
 regex = "1.8.2"
 leptos_devtools = "0.0.1"

src/button/mod.rs

@@ -86,10 +86,10 @@ pub fn Button(
             class=("melt-button--round", move || round.get())
             style=move || format!("{}{}", css_vars.get(), style.get())
             >
-                <OptionComp value=icon bind:icon>
+                <OptionComp value=icon let:icon>
                     <Icon icon=icon style=icon_style/>
                 </OptionComp>
-                <OptionComp value=children bind:children>
+                <OptionComp value=children let:children>
                     { children() }
                 </OptionComp>
         </button>

src/card/mod.rs

@@ -43,14 +43,14 @@ pub fn Card(
                     <Then slot>
                         <div class="melt-card__header">
                             <div class="melt-card__header-content">
-                                <OptionComp value=header.clone() bind:header>
+                                <OptionComp value=header.clone() let:header>
                                     <Fallback slot>
                                         { title.get() }
                                     </Fallback>
                                     { (header.children)() }
                                 </OptionComp>
                             </div>
-                            <OptionComp value=header_extra.clone() bind:header_extra>
+                            <OptionComp value=header_extra.clone() let:header_extra>
                                 <div class="melt-card__header-extra">
                                     { (header_extra.children)() }
                                 </div>
@@ -61,7 +61,7 @@ pub fn Card(
             <div class="melt-card__content">
                 { children() }
             </div>
-            <OptionComp value=card_footer bind:footer>
+            <OptionComp value=card_footer let:footer>
                 <If cond=footer.if_ >
                     <Then slot>
                         <div class="melt-card__footer">

src/menu/menu_item.rs

@@ -22,7 +22,10 @@ pub fn MenuItem(
         css_vars.push_str(&format!("--font-color-active: {font_color};"));
         css_vars.push_str(&format!("--font-color: {};", theme.menu.color));
         css_vars.push_str(&format!("--bg-color: {font_color}1a;"));
-        css_vars.push_str(&format!("--bg-color-hover: {};", theme.menu.item_color_hover));
+        css_vars.push_str(&format!(
+            "--bg-color-hover: {};",
+            theme.menu.item_color_hover
+        ));
         css_vars
     });
     view! { class=class_name,

src/mobile/tabbar/tabbar_item.rs

@@ -29,7 +29,7 @@ pub fn TabbarItem(
 
     view! { class=class_name,
         <div class="melt-tabbar-item" class=("melt-tabbar-item--selected", move || tabbar.get().value == name.get()) on:click=onclick_select style=move || css_vars.get()>
-            <OptionComp value=icon bind:icon>
+            <OptionComp value=icon let:icon>
                 <Icon icon=icon width="22px" height="22px" class="melt-tabbar-item__icon"/>
             </OptionComp>
             <div class="melt-tabbar-item__content">

src/modal/mod.rs

@@ -39,7 +39,7 @@ pub fn Modal(
                         </CardHeaderExtra>
                         { children() }
                         <CardFooter slot if_=modal_footer.is_some()>
-                            <OptionComp value=modal_footer.as_ref() bind:footer>
+                            <OptionComp value=modal_footer.as_ref() let:footer>
                                 { (footer.children)() }
                             </OptionComp>
                         </CardFooter>

src/select/mod.rs

@@ -90,7 +90,7 @@ where
                 <For
                     each=move || options.get()
                     key=move |item| item.value.clone()
-                    view=move | item| {
+                    children=move | item| {
                         let item = store_value( item);
                         let onclick = move |_| {
                             let SelectOption { value: item_value, label: _ } = item.get_value();

src/tabs/mod.rs

@@ -36,7 +36,7 @@ pub fn Tabs(active_key: RwSignal<&'static str>, children: Children) -> impl Into
     view! {  class=class_name,
         <div class="melt-tabs" style=move || css_vars.get()>
             <div class="melt-tabs__label-list" ref=label_list_ref>
-                <For each=move || tab_options_vec.get() key=move |v| v.key.clone() view=move | options| {
+                <For each=move || tab_options_vec.get() key=move |v| v.key.clone() children=move | options| {
                     let label_ref = create_node_ref::<html::Span>();
                     create_effect( move |_| {
                         let Some(label) = label_ref.get() else {