Pref/231219 (#54)

* demo: AutoComplete add Prefix and Suffix

* pref: cargo clippy

* pref: fmt

demo/src/pages/auto_complete/mod.rs

@@ -78,6 +78,42 @@ pub fn AutoCompletePage() -> impl IntoView {
 
                 </DemoCode>
             </Demo>
+            <h2>"Prefix & Suffix"</h2>
+            <Demo>
+                <Space vertical=true>
+                    <AutoComplete value options>
+                        <AutoCompletePrefix slot>
+                            <Icon icon=icondata::Icon::from(icondata::AiIcon::AiUserOutlined)/>
+                        </AutoCompletePrefix>
+                    </AutoComplete>
+                    <AutoComplete value options>
+                        <AutoCompleteSuffix slot>
+                            <Icon icon=icondata::Icon::from(icondata::AiIcon::AiGithubOutlined)/>
+                        </AutoCompleteSuffix>
+                    </AutoComplete>
+                </Space>
+                <DemoCode slot>
+
+                    {highlight_str!(
+                        r#"
+                        <Space vertical=true>
+                            <AutoComplete value options>
+                                <AutoCompletePrefix slot>
+                                    <Icon icon=icondata::Icon::from(icondata::AiIcon::AiUserOutlined)/>
+                                </AutoCompletePrefix>
+                            </AutoComplete>
+                            <AutoComplete value options>
+                                <AutoCompleteSuffix slot>
+                                    <Icon icon=icondata::Icon::from(icondata::AiIcon::AiGithubOutlined)/>
+                                </AutoCompleteSuffix>
+                            </AutoComplete>
+                        </Space>
+                        "#,
+                        "rust"
+                    )}
+
+                </DemoCode>
+            </Demo>
             <h3>"AutoComplete Props"</h3>
             <Table single_column=true>
                 <thead>
@@ -161,6 +197,32 @@ pub fn AutoCompletePage() -> impl IntoView {
                     </tr>
                 </tbody>
             </Table>
+            <h3>"AutoComplete Slots"</h3>
+            <Table single_column=true>
+                <thead>
+                    <tr>
+                        <th>"Name"</th>
+                        <th>"Default"</th>
+                        <th>"Description"</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td>"AutoCompletePrefix"</td>
+                        <td>
+                            <Text code=true>"None"</Text>
+                        </td>
+                        <td>"AutoCompletePrefix content."</td>
+                    </tr>
+                    <tr>
+                        <td>"AutoCompleteSuffix"</td>
+                        <td>
+                            <Text code=true>"None"</Text>
+                        </td>
+                        <td>"AutoCompleteSuffix content."</td>
+                    </tr>
+                </tbody>
+            </Table>
             <h3>"AutoComplete Ref"</h3>
             <Table single_column=true>
                 <thead>

src/alert/mod.rs

@@ -92,7 +92,8 @@ pub fn Alert(
             class=ssr_class
             use:dyn_classes=class
             class:thaw-alert=true
-            style=move || css_vars.get()>
+            style=move || css_vars.get()
+        >
             <Icon icon class="thaw-alert__icon"/>
             <div>
 

src/auto_complete/mod.rs

@@ -129,7 +129,13 @@ pub fn AutoComplete(
     let ssr_class = ssr_class(&class);
     view! {
         <Binder target_ref=auto_complete_ref>
-            <div class=ssr_class use:dyn_classes=class class:thaw-auto-complete=true ref=auto_complete_ref on:keydown=on_keydown>
+            <div
+                class=ssr_class
+                use:dyn_classes=class
+                class:thaw-auto-complete=true
+                ref=auto_complete_ref
+                on:keydown=on_keydown
+            >
                 <Input
                     value
                     placeholder
@@ -141,22 +147,22 @@ pub fn AutoComplete(
                     comp_ref=input_ref
                 >
                     <InputPrefix if_=auto_complete_prefix.is_some() slot>
-                        {
+
-                            if let Some(auto_complete_prefix) = auto_complete_prefix {
+                        {if let Some(auto_complete_prefix) = auto_complete_prefix {
                             Some((auto_complete_prefix.children)())
                         } else {
                             None
-                            }
+                        }}
-                        }
+
                     </InputPrefix>
                     <InputSuffix if_=auto_complete_suffix.is_some() slot>
-                        {
+
-                            if let Some(auto_complete_suffix) = auto_complete_suffix {
+                        {if let Some(auto_complete_suffix) = auto_complete_suffix {
                             Some((auto_complete_suffix.children)())
                         } else {
                             None
-                            }
+                        }}
-                        }
+
                     </InputSuffix>
                 </Input>
             </div>

src/avatar/mod.rs

@@ -37,7 +37,12 @@ pub fn Avatar(
 
     let ssr_class = ssr_class(&class);
     view! {
-        <span class=ssr_class use:dyn_classes=class class:thaw-avatar=true style=move || css_vars.get()>
+        <span
+            class=ssr_class
+            use:dyn_classes=class
+            class:thaw-avatar=true
+            style=move || css_vars.get()
+        >
             {move || {
                 let src = src.get();
                 (!src.is_empty()).then(|| view! { <img src=src/> })

src/input/mod.rs

@@ -131,7 +131,7 @@ pub fn Input(
             class=("thaw-input--invalid", move || invalid.get())
             style=move || css_vars.get()
         >
-            {if let Some(prefix) = input_prefix.map(|prefix| prefix.if_.then(|| prefix)).flatten() {
+            {if let Some(prefix) = input_prefix.and_then(|prefix| prefix.if_.then_some(prefix)) {
                 view! { <div class="thaw-input__prefix">{(prefix.children)()}</div> }.into()
             } else {
                 None
@@ -153,7 +153,7 @@ pub fn Input(
                 ref=input_ref
             />
 
-            {if let Some(suffix) = input_suffix.map(|suffix| suffix.if_.then(|| suffix)).flatten() {
+            {if let Some(suffix) = input_suffix.and_then(|suffix| suffix.if_.then_some(suffix)) {
                 view! { <div class="thaw-input__suffix">{(suffix.children)()}</div> }.into()
             } else {
                 None

src/slider/mod.rs

@@ -111,11 +111,7 @@ pub fn Slider(
     on_cleanup(move || on_mouse_move.remove());
 
     view! {
-        <div
+        <div class="thaw-slider" style=move || css_vars.get() on:click=on_mouse_click>
-            class="thaw-slider"
-            style=move || css_vars.get()
-            on:click=on_mouse_click
-            >
             <div class="thaw-slider-rail" ref=rail_ref>
                 <div
                     class="thaw-slider-rail__fill"
@@ -128,11 +124,8 @@ pub fn Slider(
             <div
                 on:mousedown=on_mouse_down
                 class="thaw-slider-handle"
-                style=move || {
+                style=move || { format!("left: {}%", percentage.get()) }
-                    format!("left: {}%", percentage.get())
+            ></div>
-                }
-            >
-            </div>
         </div>
     }
 }

src/slider/slider_label.rs

@@ -3,11 +3,7 @@ use leptos::*;
 use crate::utils::mount_style;
 
 #[component]
-pub fn SliderLabel(
+pub fn SliderLabel(#[prop(into)] value: MaybeSignal<f64>, children: Children) -> impl IntoView {
-    #[prop(into)] value: MaybeSignal<f64>,
-    children: Children,
-) -> impl IntoView {
-
     mount_style("slider-label", include_str!("./slider_label.css"));
 
     view! {
@@ -15,9 +11,10 @@ pub fn SliderLabel(
             class:thaw-slider-label=true
             style=move || {
                 format!("left: calc(calc({} / var(--thaw-slider-max)) * 100%)", value.get())
-        }>
+            }
+        >
+
             {children()}
         </div>
     }
 }
-

src/utils/dyn_classes.rs

@@ -23,15 +23,13 @@ pub fn dyn_classes(el: HtmlElement<AnyElement>, classes_signal: MaybeSignal<Stri
 }
 
 pub fn ssr_class(class: &MaybeSignal<String>) -> String {
-    let ssr_class;
     cfg_if! {
         if #[cfg(feature = "ssr")] {
             use leptos::SignalGetUntracked;
-            ssr_class = class.get_untracked();
+            class.get_untracked()
         } else {
             let _ = class;
-            ssr_class = String::new();
+            String::new()
+        }
     }
-    };
-    ssr_class
 }