feat: upgrade leptos and remove MaybeRwSignal

This commit is contained in:
luoxiao 2023-11-09 14:43:30 +08:00
parent 544b0f1b0a
commit 4c16a51d14
20 changed files with 41 additions and 129 deletions

View file

@ -13,8 +13,8 @@ license = "MIT"
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
[dependencies] [dependencies]
leptos = { version = "0.5.1", features = ["csr"] } leptos = { version = "0.5.2", features = ["csr"] }
web-sys = { version = "0.3.62", features = [ web-sys = { version = "0.3.63", features = [
"DomRect", "DomRect",
"File", "File",
"FileList", "FileList",

View file

@ -7,14 +7,14 @@ edition = "2021"
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
[dependencies] [dependencies]
leptos = { version = "0.5.1", features = ["csr"] } leptos = { version = "0.5.2", features = ["csr"] }
thaw = { path = "../" } thaw = { path = "../" }
icondata = { version = "0.1.0", features = [ icondata = { version = "0.1.0", features = [
"AiCloseOutlined", "AiCloseOutlined",
"AiCheckOutlined", "AiCheckOutlined",
"AiGithubOutlined", "AiGithubOutlined",
] } ] }
leptos_router = { version = "0.5.1", features = ["csr"] } leptos_router = { version = "0.5.2", features = ["csr"] }
leptos_devtools = "0.0.1" leptos_devtools = "0.0.1"
prisms = { git = "https://github.com/luoxiaozero/prisms", rev = "16d4d34b93fc20578ebf03137d54ecc7eafa4d4b" } prisms = { git = "https://github.com/luoxiaozero/prisms", rev = "16d4d34b93fc20578ebf03137d54ecc7eafa4d4b" }

View file

@ -1,12 +1,6 @@
mod theme; mod theme;
use crate::{ use crate::{mount_style, teleport::Teleport, use_theme, utils::StoredMaybeSignal, Input, Theme};
mount_style,
teleport::Teleport,
use_theme,
utils::{maybe_rw_signal::MaybeRwSignal, StoredMaybeSignal},
Input, Theme,
};
use leptos::*; use leptos::*;
pub use theme::AutoCompleteTheme; pub use theme::AutoCompleteTheme;
@ -18,7 +12,7 @@ pub struct AutoCompleteOption {
#[component] #[component]
pub fn AutoComplete( pub fn AutoComplete(
#[prop(optional, into)] value: MaybeRwSignal<String>, #[prop(optional, into)] value: RwSignal<String>,
#[prop(optional, into)] placeholder: MaybeSignal<String>, #[prop(optional, into)] placeholder: MaybeSignal<String>,
#[prop(optional, into)] options: MaybeSignal<Vec<AutoCompleteOption>>, #[prop(optional, into)] options: MaybeSignal<Vec<AutoCompleteOption>>,
#[prop(optional, into)] clear_after_select: MaybeSignal<bool>, #[prop(optional, into)] clear_after_select: MaybeSignal<bool>,

View file

@ -1,10 +1,9 @@
use crate::utils::maybe_rw_signal::MaybeRwSignal;
use leptos::*; use leptos::*;
use std::collections::HashSet; use std::collections::HashSet;
#[component] #[component]
pub fn CheckboxGroup( pub fn CheckboxGroup(
#[prop(optional, into)] value: MaybeRwSignal<HashSet<String>>, #[prop(optional, into)] value: RwSignal<HashSet<String>>,
children: Children, children: Children,
) -> impl IntoView { ) -> impl IntoView {
let injection_key = CheckboxGroupInjectionKey::new(value.into()); let injection_key = CheckboxGroupInjectionKey::new(value.into());

View file

@ -1,13 +1,7 @@
mod checkbox_group; mod checkbox_group;
mod checkbox_item; mod checkbox_item;
use crate::{ use crate::{components::*, icon::*, theme::use_theme, utils::mount_style::mount_style, Theme};
components::*,
icon::*,
theme::use_theme,
utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style},
Theme,
};
pub use checkbox_group::CheckboxGroup; pub use checkbox_group::CheckboxGroup;
pub use checkbox_item::CheckboxItem; pub use checkbox_item::CheckboxItem;
use icondata::AiIcon; use icondata::AiIcon;
@ -15,7 +9,7 @@ use leptos::*;
#[component] #[component]
pub fn Checkbox( pub fn Checkbox(
#[prop(optional, into)] value: MaybeRwSignal<bool>, #[prop(optional, into)] value: RwSignal<bool>,
children: Children, children: Children,
) -> impl IntoView { ) -> impl IntoView {
let theme = use_theme(Theme::light); let theme = use_theme(Theme::light);
@ -41,7 +35,7 @@ pub fn Checkbox(
> >
<input class="thaw-checkbox__input" type="checkbox"/> <input class="thaw-checkbox__input" type="checkbox"/>
<div class="thaw-checkbox__dot"> <div class="thaw-checkbox__dot">
<If cond=value.clone_into()> <If cond=value>
<Then slot> <Then slot>
<Icon icon=Icon::from(AiIcon::AiCheckOutlined) style="color: white"/> <Icon icon=Icon::from(AiIcon::AiCheckOutlined) style="color: white"/>
</Then> </Then>

View file

@ -1,16 +1,14 @@
mod color; mod color;
mod theme; mod theme;
use crate::{ use crate::{mount_style, teleport::Teleport, use_theme, Theme};
mount_style, teleport::Teleport, use_theme, utils::maybe_rw_signal::MaybeRwSignal, Theme,
};
pub use color::*; pub use color::*;
use leptos::*; use leptos::*;
use leptos::{leptos_dom::helpers::WindowListenerHandle, wasm_bindgen::__rt::IntoJsResult}; use leptos::{leptos_dom::helpers::WindowListenerHandle, wasm_bindgen::__rt::IntoJsResult};
pub use theme::ColorPickerTheme; pub use theme::ColorPickerTheme;
#[component] #[component]
pub fn ColorPicker(#[prop(optional, into)] value: MaybeRwSignal<RGBA>) -> impl IntoView { pub fn ColorPicker(#[prop(optional, into)] value: RwSignal<RGBA>) -> impl IntoView {
mount_style("color-picker", include_str!("./color-picker.css")); mount_style("color-picker", include_str!("./color-picker.css"));
let theme = use_theme(Theme::light); let theme = use_theme(Theme::light);
let popover_css_vars = create_memo(move |_| { let popover_css_vars = create_memo(move |_| {

View file

@ -2,7 +2,7 @@ mod theme;
use crate::{ use crate::{
theme::{use_theme, Theme}, theme::{use_theme, Theme},
utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style}, utils::mount_style::mount_style,
}; };
use leptos::*; use leptos::*;
pub use theme::InputTheme; pub use theme::InputTheme;
@ -30,7 +30,7 @@ pub struct InputSuffix {
#[component] #[component]
pub fn Input( pub fn Input(
#[prop(optional, into)] value: MaybeRwSignal<String>, #[prop(optional, into)] value: RwSignal<String>,
#[prop(optional, into)] allow_value: Option<Callback<String, bool>>, #[prop(optional, into)] allow_value: Option<Callback<String, bool>>,
#[prop(optional, into)] variant: MaybeSignal<InputVariant>, #[prop(optional, into)] variant: MaybeSignal<InputVariant>,
#[prop(optional, into)] placeholder: MaybeSignal<String>, #[prop(optional, into)] placeholder: MaybeSignal<String>,

View file

@ -1,14 +1,12 @@
use crate::utils::StoredMaybeSignal; use crate::utils::StoredMaybeSignal;
use crate::{ use crate::{AiIcon, Button, ButtonVariant, Icon, Input, InputSuffix};
utils::maybe_rw_signal::MaybeRwSignal, AiIcon, Button, ButtonVariant, Icon, Input, InputSuffix,
};
use leptos::*; use leptos::*;
use std::ops::{Add, Sub}; use std::ops::{Add, Sub};
use std::str::FromStr; use std::str::FromStr;
#[component] #[component]
pub fn InputNumber<T>( pub fn InputNumber<T>(
#[prop(optional, into)] value: MaybeRwSignal<T>, #[prop(optional, into)] value: RwSignal<T>,
#[prop(optional, into)] placeholder: MaybeSignal<String>, #[prop(optional, into)] placeholder: MaybeSignal<String>,
#[prop(into)] step: MaybeSignal<T>, #[prop(into)] step: MaybeSignal<T>,
) -> impl IntoView ) -> impl IntoView

View file

@ -52,7 +52,7 @@ pub(crate) fn LoadingBar(#[prop(optional)] comp_ref: ComponentRef<LoadingBarRef>
.style("transition", "none") .style("transition", "none")
.style("max-width", "0"); .style("max-width", "0");
_ = loading_bar_ref.offset_width(); _ = loading_bar_ref.offset_width();
loading_bar_ref _ = loading_bar_ref
.style("transition", "max-width 4s linear") .style("transition", "max-width 4s linear")
.style("max-width", "80%"); .style("max-width", "80%");
} }
@ -66,7 +66,7 @@ pub(crate) fn LoadingBar(#[prop(optional)] comp_ref: ComponentRef<LoadingBarRef>
}; };
let finish = Callback::new(move |_| { let finish = Callback::new(move |_| {
if let Some(loading_bar_ref) = loading_bar_ref.get_untracked() { if let Some(loading_bar_ref) = loading_bar_ref.get_untracked() {
loading_bar_ref _ = loading_bar_ref
.style("background-color", "var(--thaw-background-color)") .style("background-color", "var(--thaw-background-color)")
.style("transition", "max-width 0.5s linear") .style("transition", "max-width 0.5s linear")
.style("max-width", "100%"); .style("max-width", "100%");
@ -83,7 +83,7 @@ pub(crate) fn LoadingBar(#[prop(optional)] comp_ref: ComponentRef<LoadingBarRef>
.style("max-width", "0"); .style("max-width", "0");
_ = loading_bar_ref.offset_width(); _ = loading_bar_ref.offset_width();
} }
loading_bar_ref _ = loading_bar_ref
.style("background-color", "var(--thaw-background-color-error)") .style("background-color", "var(--thaw-background-color-error)")
.style("transition", "max-width 0.5s linear") .style("transition", "max-width 0.5s linear")
.style("max-width", "100%"); .style("max-width", "100%");

View file

@ -2,17 +2,13 @@ mod menu_group;
mod menu_item; mod menu_item;
mod theme; mod theme;
use crate::utils::maybe_rw_signal::MaybeRwSignal;
use leptos::*; use leptos::*;
pub use menu_group::MenuGroup; pub use menu_group::MenuGroup;
pub use menu_item::*; pub use menu_item::*;
pub use theme::MenuTheme; pub use theme::MenuTheme;
#[component] #[component]
pub fn Menu( pub fn Menu(#[prop(optional, into)] value: RwSignal<String>, children: Children) -> impl IntoView {
#[prop(optional, into)] value: MaybeRwSignal<String>,
children: Children,
) -> impl IntoView {
let menu_injection_key = create_rw_signal(MenuInjectionKey::new(value.get_untracked())); let menu_injection_key = create_rw_signal(MenuInjectionKey::new(value.get_untracked()));
create_effect(move |_| { create_effect(move |_| {
let selected_key = value.get(); let selected_key = value.get();

View file

@ -1,18 +1,14 @@
mod tabbar_item; mod tabbar_item;
mod theme; mod theme;
use crate::{ use crate::{use_theme, utils::mount_style::mount_style, Theme};
use_theme,
utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style},
Theme,
};
use leptos::*; use leptos::*;
pub use tabbar_item::*; pub use tabbar_item::*;
pub use theme::TabbarTheme; pub use theme::TabbarTheme;
#[component] #[component]
pub fn Tabbar( pub fn Tabbar(
#[prop(optional, into)] value: MaybeRwSignal<String>, #[prop(optional, into)] value: RwSignal<String>,
children: Children, children: Children,
) -> impl IntoView { ) -> impl IntoView {
mount_style("tabbar", include_str!("./tabbar.css")); mount_style("tabbar", include_str!("./tabbar.css"));

View file

@ -1,15 +1,8 @@
use crate::{ use crate::{theme::use_theme, utils::mount_style::mount_style, Theme};
theme::use_theme,
utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style},
Theme,
};
use leptos::*; use leptos::*;
#[component] #[component]
pub fn Radio( pub fn Radio(#[prop(optional, into)] value: RwSignal<bool>, children: Children) -> impl IntoView {
#[prop(optional, into)] value: MaybeRwSignal<bool>,
children: Children,
) -> impl IntoView {
let theme = use_theme(Theme::light); let theme = use_theme(Theme::light);
mount_style("radio", include_str!("./radio.css")); mount_style("radio", include_str!("./radio.css"));

View file

@ -1,11 +1,6 @@
mod theme; mod theme;
use crate::{ use crate::{teleport::Teleport, theme::use_theme, utils::mount_style::mount_style, Theme};
teleport::Teleport,
theme::use_theme,
utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style},
Theme,
};
use leptos::wasm_bindgen::__rt::IntoJsResult; use leptos::wasm_bindgen::__rt::IntoJsResult;
use leptos::*; use leptos::*;
use std::hash::Hash; use std::hash::Hash;
@ -19,7 +14,7 @@ pub struct SelectOption<T> {
#[component] #[component]
pub fn Select<T>( pub fn Select<T>(
#[prop(optional, into)] value: MaybeRwSignal<Option<T>>, #[prop(optional, into)] value: RwSignal<Option<T>>,
#[prop(optional, into)] options: MaybeSignal<Vec<SelectOption<T>>>, #[prop(optional, into)] options: MaybeSignal<Vec<SelectOption<T>>>,
) -> impl IntoView ) -> impl IntoView
where where

View file

@ -1,16 +1,12 @@
mod theme; mod theme;
use crate::{ use crate::{theme::use_theme, utils::mount_style::mount_style, Theme};
theme::use_theme,
utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style},
Theme,
};
use leptos::*; use leptos::*;
pub use theme::SliderTheme; pub use theme::SliderTheme;
#[component] #[component]
pub fn Slider( pub fn Slider(
#[prop(optional, into)] value: MaybeRwSignal<f64>, #[prop(optional, into)] value: RwSignal<f64>,
#[prop(default = MaybeSignal::Static(100f64), into)] max: MaybeSignal<f64>, #[prop(default = MaybeSignal::Static(100f64), into)] max: MaybeSignal<f64>,
) -> impl IntoView { ) -> impl IntoView {
mount_style("slider", include_str!("./slider.css")); mount_style("slider", include_str!("./slider.css"));

View file

@ -1,11 +1,11 @@
mod theme; mod theme;
use crate::{mount_style, theme::use_theme, utils::maybe_rw_signal::MaybeRwSignal, Theme}; use crate::{mount_style, theme::use_theme, Theme};
use leptos::*; use leptos::*;
pub use theme::SwitchTheme; pub use theme::SwitchTheme;
#[component] #[component]
pub fn Switch(#[prop(optional, into)] value: MaybeRwSignal<bool>) -> impl IntoView { pub fn Switch(#[prop(optional, into)] value: RwSignal<bool>) -> impl IntoView {
mount_style("switch", include_str!("./switch.css")); mount_style("switch", include_str!("./switch.css"));
let theme = use_theme(Theme::light); let theme = use_theme(Theme::light);
let css_vars = create_memo(move |_| { let css_vars = create_memo(move |_| {

View file

@ -1,24 +1,16 @@
mod tab; mod tab;
use std::ops::Deref;
use crate::{ use crate::{theme::use_theme, utils::mount_style::mount_style, Theme};
theme::use_theme,
utils::{maybe_rw_signal::MaybeRwSignal, mount_style::mount_style},
Theme,
};
use leptos::*; use leptos::*;
pub use tab::*; pub use tab::*;
#[component] #[component]
pub fn Tabs( pub fn Tabs(#[prop(optional, into)] value: RwSignal<String>, children: Children) -> impl IntoView {
#[prop(optional, into)] value: MaybeRwSignal<String>,
children: Children,
) -> impl IntoView {
mount_style("tabs", include_str!("./tabs.css")); mount_style("tabs", include_str!("./tabs.css"));
let tab_options_vec = create_rw_signal(vec![]); let tab_options_vec = create_rw_signal(vec![]);
provide_context(TabsInjectionKey { provide_context(TabsInjectionKey {
active_key: *value.deref(), active_key: value,
tab_options_vec, tab_options_vec,
}); });
let theme = use_theme(Theme::light); let theme = use_theme(Theme::light);

View file

@ -1,44 +0,0 @@
use leptos::RwSignal;
use std::ops::Deref;
pub struct MaybeRwSignal<T: Default + 'static>(RwSignal<T>);
impl<T: Default> MaybeRwSignal<T> {
pub fn clone_into(&self) -> RwSignal<T> {
self.0
}
}
impl<T: Default> Default for MaybeRwSignal<T> {
fn default() -> Self {
Self(RwSignal::new(Default::default()))
}
}
impl<T: Default> Clone for MaybeRwSignal<T> {
fn clone(&self) -> Self {
*self
}
}
impl<T: Default> Copy for MaybeRwSignal<T> {}
impl<T: Default> Deref for MaybeRwSignal<T> {
type Target = RwSignal<T>;
fn deref(&self) -> &Self::Target {
&self.0
}
}
impl<T: Default> From<RwSignal<T>> for MaybeRwSignal<T> {
fn from(value: RwSignal<T>) -> Self {
Self(value)
}
}
impl<T: Default> From<MaybeRwSignal<T>> for RwSignal<T> {
fn from(value: MaybeRwSignal<T>) -> Self {
value.0
}
}

View file

@ -1,10 +1,9 @@
// mod callback; // mod callback;
mod component_ref; mod component_ref;
pub mod maybe_rw_signal;
mod maybe_signal_store;
pub mod mount_style; pub mod mount_style;
pub mod signal; pub mod signal;
mod stored_maybe_signal;
// pub use callback::AsyncCallback; // pub use callback::AsyncCallback;
pub use component_ref::ComponentRef; pub use component_ref::ComponentRef;
pub use maybe_signal_store::*; pub use stored_maybe_signal::*;

View file

@ -37,6 +37,12 @@ pub fn Wave(#[prop(optional)] comp_ref: ComponentRef<WaveRef>) -> impl IntoView
} }
}); });
comp_ref.load(WaveRef { play }); comp_ref.load(WaveRef { play });
on_cleanup(move || {
if let Some(handle) = animation_timeout_handle.get() {
handle.clear();
animation_timeout_handle.set(None);
}
});
view! { view! {
<div <div
class="thaw-wave" class="thaw-wave"