adam/thaw
1
0
Fork 0
mirror of https://github.com/adoyle0/thaw.git synced 2025-01-22 22:09:22 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(lepots-v0.7): demo Guide page

Browse source
This commit is contained in:
luoxiao 2024-07-08 00:04:07 +08:00 • committed by luoxiaozero
parent 74be938fbc
commit 5188f95704
11 changed files with 230 additions and 221 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

132
demo/src/app.rs
View file

@ -2,7 +2,7 @@ use crate::pages::*;
use leptos::{prelude::*, reactive_graph::wrappers::write::SignalSetter};
use leptos_meta::provide_meta_context;
use leptos_router::{
components::{Route, Router, Routes},
components::{ParentRoute, Route, Router, Routes},
StaticSegment,
};
// use leptos_use::{
@ -20,7 +20,7 @@ pub fn App() -> impl IntoView {
provide_meta_context();
view! {
<Router set_is_routing>
<Router set_is_routing>
<TheProvider>
<TheRouter is_routing/>
</TheProvider>
@ -30,75 +30,75 @@ pub fn App() -> impl IntoView {
#[component]
fn TheRouter(is_routing: RwSignal<bool>) -> impl IntoView {
// let loading_bar = use_loading_bar();
// _ = is_routing.watch(move |is_routing| {
// if *is_routing {
// loading_bar.start();
// } else {
// loading_bar.finish();
// }
// });
let loading_bar = use_loading_bar();
_ = is_routing.watch(move |is_routing| {
if *is_routing {
loading_bar.start();
} else {
loading_bar.finish();
}
});
view! {
<Routes fallback=|| "404">
<Route path=StaticSegment("") view=Home/>
// <Route path="/guide" view=ComponentsPage>
// <Route path="/installation" view=InstallationMdPage/>
// <Route path="/usage" view=UsageMdPage/>
// <Route path="/server-sider-rendering" view=ServerSiderRenderingMdPage/>
// <Route path="/development/guide" view=DevelopmentGuideMdPage/>
// <Route path="/development/components" view=DevelopmentComponentsMdPage/>
// </Route>
// <Route path="/components" view=ComponentsPage>
<ParentRoute path=StaticSegment("guide") view=ComponentsPage>
<Route path=StaticSegment("installation") view=InstallationMdPage/>
<Route path=StaticSegment("usage") view=UsageMdPage/>
<Route path=StaticSegment("server-sider-rendering") view=ServerSiderRenderingMdPage/>
<Route path=(StaticSegment("development"), StaticSegment("guide")) view=DevelopmentGuideMdPage/>
<Route path=(StaticSegment("development"), StaticSegment("components")) view=DevelopmentComponentsMdPage/>
</ParentRoute>
<ParentRoute path=StaticSegment("components") view=ComponentsPage>
// // <Route path="/tabbar" view=TabbarPage/>
// // <Route path="/nav-bar" view=NavBarPage/>
// // <Route path="/toast" view=ToastPage/>
// <Route path="/accordion" view=AccordionMdPage/>
// <Route path="/anchor" view=AnchorMdPage/>
// <Route path="/auto-complete" view=AutoCompleteMdPage/>
// <Route path="/avatar" view=AvatarMdPage/>
// <Route path="/back-top" view=BackTopMdPage/>
// <Route path="/badge" view=BadgeMdPage/>
// <Route path="/breadcrumb" view=BreadcrumbMdPage/>
// <Route path="/button" view=ButtonMdPage/>
// <Route path="/calendar" view=CalendarMdPage/>
// <Route path="/card" view=CardMdPage/>
// <Route path="/checkbox" view=CheckboxMdPage/>
// <Route path="/color-picker" view=ColorPickerMdPage/>
// <Route path="/combobox" view=ComboboxMdPage/>
// <Route path="/config-provider" view=ConfigProviderMdPage/>
// <Route path="/date-picker" view=DatePickerMdPage/>
// <Route path="/dialog" view=DialogMdPage/>
// <Route path="/divider" view=DividerMdPage/>
// <Route path="/drawer" view=DrawerMdPage/>
// <Route path="/grid" view=GridMdPage/>
// <Route path="/icon" view=IconMdPage/>
// <Route path="/image" view=ImageMdPage/>
// <Route path="/input" view=InputMdPage/>
// <Route path="/layout" view=LayoutMdPage/>
// <Route path="/loading-bar" view=LoadingBarMdPage/>
// // <Route path="/message" view=MessageMdPage/>
// <Route path="/message-bar" view=MessageBarMdPage/>
// <Route path="/popover" view=PopoverMdPage/>
// <Route path="/progress-bar" view=ProgressBarMdPage/>
// <Route path="/radio" view=RadioMdPage/>
// <Route path="/scrollbar" view=ScrollbarMdPage/>
// // <Route path="/select" view=SelectMdPage/>
// <Route path="/skeleton" view=SkeletonMdPage/>
// <Route path="/slider" view=SliderMdPage/>
// <Route path="/space" view=SpaceMdPage/>
// <Route path="/spin-button" view=SpinButtonMdPage/>
// <Route path="/spinner" view=SpinnerMdPage/>
// <Route path="/switch" view=SwitchMdPage/>
// <Route path="/tab-list" view=TabListMdPage/>
// <Route path="/table" view=TableMdPage/>
// <Route path="/tag" view=TagMdPage/>
// <Route path="/text" view=TextMdPage/>
// <Route path="/textarea" view=TextareaMdPage/>
// <Route path="/time-picker" view=TimePickerMdPage/>
// <Route path="/toast" view=ToastMdPage />
// <Route path="/upload" view=UploadMdPage/>
// </Route>
// <Route path=StaticSegment("accordion") view=AccordionMdPage/>
// <Route path=StaticSegment("anchor") view=AnchorMdPage/>
// <Route path=StaticSegment("auto-complete") view=AutoCompleteMdPage/>
// <Route path=StaticSegment("avatar") view=AvatarMdPage/>
// <Route path=StaticSegment("back-top") view=BackTopMdPage/>
// <Route path=StaticSegment("badge") view=BadgeMdPage/>
// <Route path=StaticSegment("breadcrumb") view=BreadcrumbMdPage/>
<Route path=StaticSegment("button") view=ButtonMdPage/>
<Route path=StaticSegment("calendar") view=CalendarMdPage/>
<Route path=StaticSegment("card") view=CardMdPage/>
<Route path=StaticSegment("checkbox") view=CheckboxMdPage/>
<Route path=StaticSegment("color-picker") view=ColorPickerMdPage/>
<Route path=StaticSegment("combobox") view=ComboboxMdPage/>
<Route path=StaticSegment("config-provider") view=ConfigProviderMdPage/>
<Route path=StaticSegment("date-picker") view=DatePickerMdPage/>
<Route path=StaticSegment("dialog") view=DialogMdPage/>
<Route path=StaticSegment("divider") view=DividerMdPage/>
<Route path=StaticSegment("drawer") view=DrawerMdPage/>
<Route path=StaticSegment("grid") view=GridMdPage/>
// <Route path=StaticSegment("icon") view=IconMdPage/>
// <Route path=StaticSegment("image") view=ImageMdPage/>
// <Route path=StaticSegment("input") view=InputMdPage/>
// <Route path=StaticSegment("layout") view=LayoutMdPage/>
// <Route path=StaticSegment("loading-bar") view=LoadingBarMdPage/>
// <Route path="/message" view=MessageMdPage/>
// <Route path=StaticSegment("message-bar") view=MessageBarMdPage/>
// <Route path=StaticSegment("popover") view=PopoverMdPage/>
// <Route path=StaticSegment("progress-bar") view=ProgressBarMdPage/>
// <Route path=StaticSegment("radio") view=RadioMdPage/>
// <Route path=StaticSegment("scrollbar") view=ScrollbarMdPage/>
// // <Route path="/select" view=SelectMdPage/>
// <Route path=StaticSegment("skeleton") view=SkeletonMdPage/>
// <Route path=StaticSegment("slider") view=SliderMdPage/>
// <Route path=StaticSegment("space") view=SpaceMdPage/>
// <Route path=StaticSegment("spin-button") view=SpinButtonMdPage/>
// <Route path=StaticSegment("spinner") view=SpinnerMdPage/>
// <Route path=StaticSegment("switch") view=SwitchMdPage/>
// <Route path=StaticSegment("tab-list") view=TabListMdPage/>
// <Route path=StaticSegment("table") view=TableMdPage/>
// <Route path=StaticSegment("tag") view=TagMdPage/>
// <Route path=StaticSegment("text") view=TextMdPage/>
// <Route path=StaticSegment("textarea") view=TextareaMdPage/>
// <Route path=StaticSegment("time-picker") view=TimePickerMdPage/>
// <Route path=StaticSegment("toast") view=ToastMdPage />
// <Route path=StaticSegment("upload") view=UploadMdPage/>
</ParentRoute>
// <Route path="/mobile/tabbar" view=TabbarDemoPage/>
// <Route path="/mobile/nav-bar" view=NavBarDemoPage/>
// <Route path="/mobile/toast" view=ToastDemoPage/>
@ -114,9 +114,9 @@ fn TheProvider(children: Children) -> impl IntoView {
view! {
<ConfigProvider>
// <ToasterProvider>
// <LoadingBarProvider>
<LoadingBarProvider>
{children()}
// </LoadingBarProvider>
</LoadingBarProvider>
// </ToasterProvider>
</ConfigProvider>
}

195
demo/src/components/site_header.rs
View file

@ -7,26 +7,26 @@ use thaw::*;
#[component]
pub fn SiteHeader() -> impl IntoView {
let theme = Theme::use_rw_theme();
let theme_name = Memo::new(move |_| {
theme.with(|theme| {
if theme.name == *"light" {
"Dark".to_string()
} else {
"Light".to_string()
}
})
});
// let (_, write_theme, _) = use_local_storage::<String, FromToStringCodec>("theme");
let change_theme = Callback::new(move |_| {
if theme_name.get_untracked() == "Light" {
theme.set(Theme::light());
// write_theme.set("light".to_string());
} else {
theme.set(Theme::dark());
// write_theme.set("dark".to_string());
}
});
// let theme = Theme::use_rw_theme();
// let theme_name = Memo::new(move |_| {
// theme.with(|theme| {
// if theme.name == *"light" {
// "Dark".to_string()
// } else {
// "Light".to_string()
// }
// })
// });
// // let (_, write_theme, _) = use_local_storage::<String, FromToStringCodec>("theme");
// let change_theme = Callback::new(move |_| {
// if theme_name.get_untracked() == "Light" {
// theme.set(Theme::light());
// // write_theme.set("light".to_string());
// } else {
// theme.set(Theme::dark());
// // write_theme.set("dark".to_string());
// }
// });
let search_value = RwSignal::new(String::new());
let search_all_options = StoredValue::new(gen_search_all_options());
@ -130,85 +130,86 @@ pub fn SiteHeader() -> impl IntoView {
}
"
</Style>
<LayoutHeader class="demo-header">
<Space on:click=move |_| {
let navigate = use_navigate();
navigate("/", Default::default());
}>
<img src="/logo.svg" style="width: 36px"/>
<div class="demo-name">"Thaw UI"</div>
</Space>
<Space>
<AutoComplete
value=search_value
placeholder="Type '/' to search"
clear_after_select=true
blur_after_select=true
on_select=on_search_select
comp_ref=auto_complete_ref
>
<For each=move || search_options.get() key=|option| option.label.clone() let:option>
<AutoCompleteOption key=option.value>{option.label}</AutoCompleteOption>
</For>
<AutoCompletePrefix slot>
<Icon
icon=icondata::AiSearchOutlined
style="font-size: 18px; color: var(--thaw-placeholder-color);"
/>
</AutoCompletePrefix>
</AutoComplete>
<Popover
placement=PopoverPlacement::BottomEnd
class="demo-header__menu-popover-mobile"
>
<PopoverTrigger slot class="demo-header__menu-mobile">
<Button
appearance=ButtonAppearance::Subtle
icon=icondata::AiUnorderedListOutlined
attr:style="font-size: 22px; padding: 0px 6px;"
/>
</PopoverTrigger>
<div style="height: 70vh; overflow: auto;">// <Menu value=menu_value>
// <MenuItem key=theme_name label=theme_name />
// <MenuItem key="github" label="Github" />
// {
// use crate::pages::{gen_guide_menu_data, gen_menu_data};
// vec![
// gen_guide_menu_data().into_view(),
// gen_menu_data().into_view(),
// ]
// }
// </Menu>
</div>
</Popover>
<Space class="demo-header__right-btn" align=SpaceAlign::Center>
<Button
appearance=ButtonAppearance::Subtle
on_click=Callback::new(move |_| change_theme.call(()))
>
{move || theme_name.get()}
</Button>
<SwitchVersion/>
<Button
appearance=ButtonAppearance::Subtle
icon=icondata::BiDiscordAlt
attr:style="font-size: 22px; padding: 0px 6px;"
on_click=move |_| {
_ = window().open_with_url("https://discord.gg/YPxuprzu6M");
}
/>
<LayoutHeader attr:class="demo-header">
"123"
// <Space on:click=move |_| {
// let navigate = use_navigate();
// navigate("/", Default::default());
// }>
// <img src="/logo.svg" style="width: 36px"/>
// <div class="demo-name">"Thaw UI"</div>
// </Space>
// <Space>
// <AutoComplete
// value=search_value
// placeholder="Type '/' to search"
// clear_after_select=true
// blur_after_select=true
// on_select=on_search_select
// comp_ref=auto_complete_ref
// >
// <For each=move || search_options.get() key=|option| option.label.clone() let:option>
// <AutoCompleteOption key=option.value>{option.label}</AutoCompleteOption>
// </For>
// <AutoCompletePrefix slot>
// <Icon
// icon=icondata::AiSearchOutlined
// style="font-size: 18px; color: var(--thaw-placeholder-color);"
// />
// </AutoCompletePrefix>
// </AutoComplete>
// <Popover
// placement=PopoverPlacement::BottomEnd
// class="demo-header__menu-popover-mobile"
// >
// <PopoverTrigger slot class="demo-header__menu-mobile">
// <Button
// appearance=ButtonAppearance::Subtle
// icon=icondata::AiUnorderedListOutlined
// attr:style="font-size: 22px; padding: 0px 6px;"
// />
// </PopoverTrigger>
// <div style="height: 70vh; overflow: auto;">// <Menu value=menu_value>
// // <MenuItem key=theme_name label=theme_name />
// // <MenuItem key="github" label="Github" />
// // {
// // use crate::pages::{gen_guide_menu_data, gen_menu_data};
// // vec![
// // gen_guide_menu_data().into_view(),
// // gen_menu_data().into_view(),
// // ]
// // }
// // </Menu>
// </div>
// </Popover>
// <Space class="demo-header__right-btn" align=SpaceAlign::Center>
// <Button
// appearance=ButtonAppearance::Subtle
// on_click=Callback::new(move |_| change_theme.call(()))
// >
// {move || theme_name.get()}
// </Button>
// <SwitchVersion/>
// <Button
// appearance=ButtonAppearance::Subtle
// icon=icondata::BiDiscordAlt
// attr:style="font-size: 22px; padding: 0px 6px;"
// on_click=move |_| {
// _ = window().open_with_url("https://discord.gg/YPxuprzu6M");
// }
// />
<Button
appearance=ButtonAppearance::Subtle
icon=icondata::AiGithubOutlined
attr:style="font-size: 22px; padding: 0px 6px;"
on_click=move |_| {
_ = window().open_with_url("http://github.com/thaw-ui/thaw");
}
/>
// <Button
// appearance=ButtonAppearance::Subtle
// icon=icondata::AiGithubOutlined
// attr:style="font-size: 22px; padding: 0px 6px;"
// on_click=move |_| {
// _ = window().open_with_url("http://github.com/thaw-ui/thaw");
// }
// />
</Space>
</Space>
// </Space>
// </Space>
</LayoutHeader>
}

2
demo/src/lib.rs
View file

@ -1,5 +1,5 @@
mod app;
// mod components;
mod components;
mod pages;
pub use app::App;

2
demo/src/main.rs
View file

@ -1,5 +1,5 @@
mod app;
// mod components;
mod components;
mod pages;
use app::App;

4
demo/src/pages/components.rs
View file

@ -61,7 +61,7 @@ pub fn ComponentsPage() -> impl IntoView {
gen_menu_data().into_iter().map(|data| {
let MenuGroupOption { label, children } = data;
view! {
<Caption1Strong attr:style="margin-inline-start: 10px; margin-top: 10px; display: inline-block">
<Caption1Strong style="margin-inline-start: 10px; margin-top: 10px; display: inline-block">
{label}
</Caption1Strong>
{
@ -77,7 +77,7 @@ pub fn ComponentsPage() -> impl IntoView {
}
</NavDrawer>
</div>
<Layout content_style="padding: 8px 12px 28px; display: flex;" class="doc-content">
<Layout content_style="padding: 8px 12px 28px; display: flex;" attr:class="doc-content">
<Outlet/>
</Layout>
</Layout>

8
demo/src/pages/mod.rs
View file

@ -1,14 +1,14 @@
// mod components;
mod components;
mod home;
// mod markdown;
mod markdown;
// mod mobile;
// mod nav_bar;
// mod tabbar;
// mod toast;
// pub use components::*;
pub use components::*;
pub use home::*;
// pub use markdown::*;
pub use markdown::*;
// pub use mobile::*;
// pub use nav_bar::*;
// pub use tabbar::*;

12
demo_markdown/docs/space/mod.md
View file

@ -45,18 +45,18 @@ view! {
view! {
<Space vertical=true>
<Space align=SpaceAlign::Start>
<Button style="height: 60px">"Start"</Button>
<Button style="height: 40px">"Start"</Button>
<Button attr:style="height: 60px">"Start"</Button>
<Button attr:style="height: 40px">"Start"</Button>
<Button>"Start"</Button>
</Space>
<Space align=SpaceAlign::Center>
<Button style="height: 60px">"Center"</Button>
<Button style="height: 40px">"Center"</Button>
<Button attr:style="height: 60px">"Center"</Button>
<Button attr:style="height: 40px">"Center"</Button>
<Button>"Center"</Button>
</Space>
<Space align=SpaceAlign::End>
<Button style="height: 60px">"End"</Button>
<Button style="height: 40px">"End"</Button>
<Button attr:style="height: 60px">"End"</Button>
<Button attr:style="height: 40px">"End"</Button>
<Button>"End"</Button>
</Space>
</Space>

40
demo_markdown/src/lib.rs
View file

@ -54,26 +54,26 @@ pub fn include_md(_token_stream: proc_macro::TokenStream) -> proc_macro::TokenSt
"LayoutMdPage" => "../docs/layout/mod.md",
"LoadingBarMdPage" => "../docs/loading_bar/mod.md",
// "MessageMdPage" => "../docs/message/mod.md",
"MessageBarMdPage" => "../docs/message_bar/mod.md",
"PopoverMdPage" => "../docs/popover/mod.md",
"ProgressBarMdPage" => "../docs/progress_bar/mod.md",
"RadioMdPage" => "../docs/radio/mod.md",
"ScrollbarMdPage" => "../docs/scrollbar/mod.md",
// "SelectMdPage" => "../docs/select/mod.md",
"SkeletonMdPage" => "../docs/skeleton/mod.md",
"SliderMdPage" => "../docs/slider/mod.md",
"SpaceMdPage" => "../docs/space/mod.md",
"SpinButtonMdPage" => "../docs/spin_button/mod.md",
"SpinnerMdPage" => "../docs/spinner/mod.md",
"SwitchMdPage" => "../docs/switch/mod.md",
"TabListMdPage" => "../docs/tab_list/mod.md",
"TableMdPage" => "../docs/table/mod.md",
"TagMdPage" => "../docs/tag/mod.md",
"TextareaMdPage" => "../docs/textarea/mod.md",
"TimePickerMdPage" => "../docs/time_picker/mod.md",
"TextMdPage" => "../docs/text/mod.md",
"ToastMdPage" => "../docs/toast/mod.md",
"UploadMdPage" => "../docs/upload/mod.md"
"MessageBarMdPage" => "../docs/message_bar/mod.md"
// "PopoverMdPage" => "../docs/popover/mod.md",
// "ProgressBarMdPage" => "../docs/progress_bar/mod.md",
// "RadioMdPage" => "../docs/radio/mod.md",
// "ScrollbarMdPage" => "../docs/scrollbar/mod.md",
// // "SelectMdPage" => "../docs/select/mod.md",
// "SkeletonMdPage" => "../docs/skeleton/mod.md",
// "SliderMdPage" => "../docs/slider/mod.md",
// "SpaceMdPage" => "../docs/space/mod.md",
// "SpinButtonMdPage" => "../docs/spin_button/mod.md",
// "SpinnerMdPage" => "../docs/spinner/mod.md",
// "SwitchMdPage" => "../docs/switch/mod.md",
// "TabListMdPage" => "../docs/tab_list/mod.md",
// "TableMdPage" => "../docs/table/mod.md",
// "TagMdPage" => "../docs/tag/mod.md",
// "TextareaMdPage" => "../docs/textarea/mod.md",
// "TimePickerMdPage" => "../docs/time_picker/mod.md",
// "TextMdPage" => "../docs/text/mod.md",
// "ToastMdPage" => "../docs/toast/mod.md",
// "UploadMdPage" => "../docs/upload/mod.md"
};
let mut fn_list = vec![];

5
thaw/src/tag/mod.rs
View file

@ -1,6 +1,7 @@
use crate::Icon;
use leptos::{ev, prelude::*};
use thaw_utils::{class_list, mount_style, OptionalProp};
use send_wrapper::SendWrapper;
#[derive(Clone, Copy, Default, PartialEq, Eq, Hash)]
pub enum TagVariant {
@ -16,7 +17,7 @@ pub fn Tag(
#[prop(optional, into)] variant: MaybeSignal<TagVariant>,
#[prop(optional, into)] class: OptionalProp<MaybeSignal<String>>,
#[prop(optional, into)] closable: MaybeSignal<bool>,
#[prop(optional, into)] on_close: Option<Callback<ev::MouseEvent>>,
#[prop(optional, into)] on_close: Option<Callback<SendWrapper<ev::MouseEvent>>>,
children: Children,
) -> impl IntoView {
mount_style("tag", include_str!("./tag.css"));
@ -25,7 +26,7 @@ pub fn Tag(
let Some(callback) = on_close.as_ref() else {
return;
};
callback.call(event);
callback.call(SendWrapper::new(event));
};
view! {

36
thaw/src/text/mod.rs
View file

@ -4,6 +4,7 @@ use thaw_utils::{class_list, mount_style};
#[component]
pub fn Caption1(
#[prop(optional, into)] class: MaybeProp<String>,
#[prop(optional, into)] style: MaybeProp<String>,
#[prop(optional)] tag: TextTag,
children: Children,
) -> impl IntoView {
@ -11,13 +12,14 @@ pub fn Caption1(
Signal::derive(move || format!("thaw-caption-1 {}", class.get().unwrap_or_default()));
view! {
<Text tag children class/>
<Text tag children class style/>
}
}
#[component]
pub fn Caption1Strong(
#[prop(optional, into)] class: MaybeProp<String>,
#[prop(optional, into)] style: MaybeProp<String>,
#[prop(optional)] tag: TextTag,
children: Children,
) -> impl IntoView {
@ -26,26 +28,28 @@ pub fn Caption1Strong(
});
view! {
<Text tag children class/>
<Text tag children class style/>
}
}
#[component]
pub fn Body1(
#[prop(optional, into)] class: MaybeProp<String>,
#[prop(optional, into)] style: MaybeProp<String>,
#[prop(optional)] tag: TextTag,
children: Children,
) -> impl IntoView {
let class = Signal::derive(move || format!("thaw-body-1 {}", class.get().unwrap_or_default()));
view! {
<Text tag children class/>
<Text tag children class style/>
}
}
#[component]
pub fn Text(
#[prop(optional, into)] class: MaybeProp<String>,
#[prop(optional, into)] style: MaybeProp<String>,
#[prop(optional)] tag: TextTag,
#[prop(optional)] code: bool,
children: Children,
@ -54,79 +58,79 @@ pub fn Text(
match tag {
TextTag::B => view! {
<b class=class_list!["thaw-text", class]>
<b class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</b>
}
.into_any(),
TextTag::Em => view! {
<em class=class_list!["thaw-text", class]>
<em class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</em>
}
.into_any(),
TextTag::H1 => view! {
<h1 class=class_list!["thaw-text", class]>
<h1 class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</h1>
}
.into_any(),
TextTag::H2 => view! {
<h2 class=class_list!["thaw-text", class]>
<h2 class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</h2>
}
.into_any(),
TextTag::H3 => view! {
<h3 class=class_list!["thaw-text", class]>
<h3 class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</h3>
}
.into_any(),
TextTag::H4 => view! {
<h4 class=class_list!["thaw-text", class]>
<h4 class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</h4>
}
.into_any(),
TextTag::H5 => view! {
<h5 class=class_list!["thaw-text", class]>
<h5 class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</h5>
}
.into_any(),
TextTag::H6 => view! {
<h6 class=class_list!["thaw-text", class]>
<h6 class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</h6>
}
.into_any(),
TextTag::I => view! {
<i class=class_list!["thaw-text", class]>
<i class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</i>
}
.into_any(),
TextTag::P => view! {
<p class=class_list!["thaw-text", class]>
<p class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</p>
}
.into_any(),
TextTag::Pre => view! {
<pre class=class_list!["thaw-text", class]>
<pre class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</pre>
}
.into_any(),
TextTag::Span => view! {
<span class=class_list!["thaw-text", class]>
<span class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</span>
}
.into_any(),
TextTag::Strong => view! {
<strong class=class_list!["thaw-text", class]>
<strong class=class_list!["thaw-text", class] style=move || style.get().unwrap_or_default()>
{children()}
</strong>
}

15
thaw_components/src/teleport/mod.rs
View file

@ -58,12 +58,15 @@ pub fn Teleport(
let owner = Owner::current().unwrap();
Effect::new(move |_| {
if immediate.get() {
mount_fn.update_value(|mount_fn| {
if let Some(f) = mount_fn.take() {
owner.with(|| {
f();
});
}
let Some(f) = mount_fn
.try_update_value(|mount_fn| mount_fn.take())
.flatten()
else {
return;
};
owner.with(|| {
f();
});
}
});