diff --git a/demo_markdown/docs/menu/mod.md b/demo_markdown/docs/menu/mod.md index ea2ef07..b8e2768 100644 --- a/demo_markdown/docs/menu/mod.md +++ b/demo_markdown/docs/menu/mod.md @@ -5,8 +5,12 @@ let value = create_rw_signal(String::from("o")); view! { - - + + + + + + } ``` @@ -29,8 +33,9 @@ view! { ### MenuItem Props -| Name | Type | Default | Description | -| ----- | ----------------------------------- | -------------------- | -------------------------------------------- | +| Name | Type | Default | Description | +| --- | --- | --- | --- | | class | `OptionalProp>` | `Default::default()` | Addtional classes for the menu item element. | -| label | `MaybeSignal` | `Default::default()` | The label of the menu item. | -| key | `MaybeSignal` | `Default::default()` | The indentifier of the menu item. | +| label | `MaybeSignal` | `Default::default()` | The label of the menu item. | +| key | `MaybeSignal` | `Default::default()` | The indentifier of the menu item. | +| icon | `OptionalMaybeSignal` | `None` | The icon of the menu item. | diff --git a/thaw/src/menu/menu-item.css b/thaw/src/menu/menu-item.css index 7a8772a..29b9e72 100644 --- a/thaw/src/menu/menu-item.css +++ b/thaw/src/menu/menu-item.css @@ -1,4 +1,6 @@ .thaw-menu-item__content { + display: flex; + align-items: center; margin: 0.3rem 0.4rem; padding: 0.5rem 0.75rem; color: var(--thaw-font-color); diff --git a/thaw/src/menu/menu_item.rs b/thaw/src/menu/menu_item.rs index f72fe16..168a8ca 100644 --- a/thaw/src/menu/menu_item.rs +++ b/thaw/src/menu/menu_item.rs @@ -1,11 +1,13 @@ use super::use_menu; -use crate::{theme::use_theme, Theme}; +use crate::{theme::use_theme, Icon, Theme}; use leptos::*; -use thaw_utils::{class_list, mount_style, OptionalProp}; +use thaw_components::OptionComp; +use thaw_utils::{class_list, mount_style, OptionalMaybeSignal, OptionalProp}; #[component] pub fn MenuItem( #[prop(into)] key: MaybeSignal, + #[prop(optional, into)] icon: OptionalMaybeSignal, #[prop(into)] label: MaybeSignal, #[prop(optional, into)] class: OptionalProp>, ) -> impl IntoView { @@ -46,6 +48,15 @@ pub fn MenuItem( on:click=on_click style=move || css_vars.get() > + { + move || { + view! { + + + + } + } + } {move || label.get()} diff --git a/thaw/src/select/raw.rs b/thaw/src/select/raw.rs index 7099f57..8ed87e4 100644 --- a/thaw/src/select/raw.rs +++ b/thaw/src/select/raw.rs @@ -50,6 +50,10 @@ where }); on_cleanup(move || listener.remove()); } + #[cfg(not(any(feature = "csr", feature = "hydrate")))] + { + let _ = hide_menu; + } let theme = use_theme(Theme::light); let css_vars = create_memo(move |_| {