diff --git a/demo/src/pages/tabs/mod.rs b/demo/src/pages/tabs/mod.rs
index 22691a2..8a5e971 100644
--- a/demo/src/pages/tabs/mod.rs
+++ b/demo/src/pages/tabs/mod.rs
@@ -5,12 +5,12 @@ use prisms::highlight_str;
#[component]
pub fn TabsPage() -> impl IntoView {
- let active_key = create_rw_signal("apple");
+ let value = create_rw_signal("apple");
view! {
-
"Tabs"
+ "Tabs2"
-
+
"apple"
@@ -22,8 +22,8 @@ pub fn TabsPage() -> impl IntoView {
slot
html=highlight_str!(
r#"
- let active_key = create_rw_signal("apple");
-
+ let value = create_rw_signal("apple");
+
"apple"
diff --git a/src/input/mod.rs b/src/input/mod.rs
index d02f673..4334dba 100644
--- a/src/input/mod.rs
+++ b/src/input/mod.rs
@@ -2,7 +2,7 @@ mod theme;
use crate::{
theme::{use_theme, Theme},
- utils::mount_style::mount_style,
+ utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style},
};
use leptos::*;
pub use theme::InputTheme;
@@ -25,7 +25,7 @@ impl InputVariant {
#[component]
pub fn Input(
- #[prop(into)] value: RwSignal,
+ #[prop(optional, into)] value: MaybeRwSignal,
#[prop(optional, into)] variant: MaybeSignal,
) -> impl IntoView {
let theme = use_theme(Theme::light);
diff --git a/src/menu/mod.rs b/src/menu/mod.rs
index f69af91..13c5e2b 100644
--- a/src/menu/mod.rs
+++ b/src/menu/mod.rs
@@ -10,12 +10,12 @@ pub use theme::MenuTheme;
#[component]
pub fn Menu(
- #[prop(optional, into)] selected: MaybeRwSignal,
+ #[prop(optional, into)] value: MaybeRwSignal,
children: Children,
) -> impl IntoView {
- let menu_injection_key = create_rw_signal(MenuInjectionKey::new(selected.get_untracked()));
+ let menu_injection_key = create_rw_signal(MenuInjectionKey::new(value.get_untracked()));
create_effect(move |_| {
- let selected_key = selected.get();
+ let selected_key = value.get();
let key = menu_injection_key.get_untracked();
if selected_key != key.value {
menu_injection_key.set(MenuInjectionKey::new(selected_key));
@@ -23,10 +23,10 @@ pub fn Menu(
});
create_effect(move |_| {
- let selected_key = selected.get_untracked();
+ let selected_key = value.get_untracked();
let key = menu_injection_key.get();
if selected_key != key.value {
- selected.set(key.value);
+ value.set(key.value);
}
});
provide_context(menu_injection_key);
diff --git a/src/mobile/tabbar/mod.rs b/src/mobile/tabbar/mod.rs
index 64cb234..1ef3349 100644
--- a/src/mobile/tabbar/mod.rs
+++ b/src/mobile/tabbar/mod.rs
@@ -1,17 +1,20 @@
mod tabbar_item;
-use crate::utils::mount_style::mount_style;
+use crate::utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style};
use leptos::*;
pub use tabbar_item::*;
#[component]
-pub fn Tabbar(#[prop(into)] selected: RwSignal, children: Children) -> impl IntoView {
+pub fn Tabbar(
+ #[prop(optional, into)] value: MaybeRwSignal,
+ children: Children,
+) -> impl IntoView {
mount_style("tabbar", include_str!("./tabbar.css"));
- let tabbar_injection_key = create_rw_signal(TabbarInjectionKey::new(selected.get()));
+ let tabbar_injection_key = create_rw_signal(TabbarInjectionKey::new(value.get()));
create_effect(move |_| {
- let selected_key = selected.get();
+ let selected_key = value.get();
let key = tabbar_injection_key.get_untracked();
if selected_key != key.value {
tabbar_injection_key.set(TabbarInjectionKey::new(selected_key));
@@ -19,10 +22,10 @@ pub fn Tabbar(#[prop(into)] selected: RwSignal, children: Children) -> i
});
create_effect(move |_| {
- let selected_key = selected.get_untracked();
+ let selected_key = value.get_untracked();
let key = tabbar_injection_key.get();
if selected_key != key.value {
- selected.set(key.value);
+ value.set(key.value);
}
});
provide_context(tabbar_injection_key);
diff --git a/src/slider/mod.rs b/src/slider/mod.rs
index 89da2e4..89aa0d3 100644
--- a/src/slider/mod.rs
+++ b/src/slider/mod.rs
@@ -1,10 +1,14 @@
-use crate::{theme::use_theme, utils::mount_style::mount_style, Theme};
+use crate::{
+ theme::use_theme,
+ utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style},
+ Theme,
+};
use leptos::*;
use wasm_bindgen::JsCast;
#[component]
pub fn Slider(
- #[prop(into)] value: RwSignal,
+ #[prop(optional, into)] value: MaybeRwSignal,
#[prop(default = MaybeSignal::Static(100f64), into)] max: MaybeSignal,
) -> impl IntoView {
let theme = use_theme(Theme::light);
diff --git a/src/tabs/mod.rs b/src/tabs/mod.rs
index 6a7abde..b5bd3df 100644
--- a/src/tabs/mod.rs
+++ b/src/tabs/mod.rs
@@ -1,15 +1,24 @@
mod tab;
-use crate::{theme::use_theme, utils::mount_style::mount_style, Theme};
+use std::ops::Deref;
+
+use crate::{
+ theme::use_theme,
+ utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style},
+ Theme,
+};
use leptos::*;
pub use tab::*;
#[component]
-pub fn Tabs(active_key: RwSignal<&'static str>, children: Children) -> impl IntoView {
+pub fn Tabs(
+ #[prop(optional, into)] value: MaybeRwSignal<&'static str>,
+ children: Children,
+) -> impl IntoView {
mount_style("tabs", include_str!("./tabs.css"));
let tab_options_vec = create_rw_signal(vec![]);
provide_context(TabsInjectionKey {
- active_key: active_key.clone(),
+ active_key: value.deref().clone(),
tab_options_vec: tab_options_vec.clone(),
});
let theme = use_theme(Theme::light);
@@ -48,7 +57,7 @@ pub fn Tabs(active_key: RwSignal<&'static str>, children: Children) -> impl Into
let Some(label_list) = label_list_ref.get() else {
return;
};
- if options.key == active_key.get() {
+ if options.key == value.get() {
request_animation_frame(move || {
let list_rect = label_list.get_bounding_client_rect();
let rect = label.get_bounding_client_rect();
@@ -67,10 +76,10 @@ pub fn Tabs(active_key: RwSignal<&'static str>, children: Children) -> impl Into
class="melt-tabs__label"
class=(
"melt-tabs__label--active",
- move || options.key == active_key.get(),
+ move || options.key == value.get(),
)
- on:click=move |_| active_key.set(options.key)
+ on:click=move |_| value.set(options.key)
ref=label_ref
>
{options.label}