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): thaw

Browse source
This commit is contained in:
luoxiao 2024-07-07 17:10:54 +08:00 • committed by luoxiaozero
parent d90ee99367
commit 41c5a2ea89
20 changed files with 95 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
Cargo.toml
View file

@ -16,5 +16,5 @@ thaw_components = { version = "0.1.1", path = "./thaw_components" }
thaw_macro = { version = "0.1.0", path = "./thaw_macro" }
thaw_utils = { version = "0.0.3", path = "./thaw_utils" }
leptos = { git = "https://github.com/leptos-rs/leptos", branch = "leptos_0.7" }
leptos_meta = { git = "https://github.com/leptos-rs/leptos", branch = "leptos_0.7" }
leptos = { git = "https://github.com/leptos-rs/leptos", rev = "ae0dc13c" }
leptos_meta = { git = "https://github.com/leptos-rs/leptos", rev = "ae0dc13c" }

1
thaw/src/anchor/mod.rs
View file

@ -19,6 +19,7 @@ pub fn Anchor(
let element_ids = RwSignal::new(Vec::<String>::new());
let active_id = RwSignal::new(None::<String>);
let offset_target = send_wrapper::SendWrapper::new(offset_target);
let on_scroll = move || {
element_ids.with(|ids| {
let offset_target_top = if let Some(offset_target) = offset_target.as_ref() {

4
thaw/src/auto_complete/mod.rs
View file

@ -3,7 +3,7 @@ mod auto_complete_option;
pub use auto_complete_option::AutoCompleteOption;
use crate::{ComponentRef, ConfigInjection, Input, InputPrefix, InputRef, InputSuffix};
use leptos::{prelude::*, html};
use leptos::{context::Provider, html, prelude::*};
use thaw_components::{
Binder, CSSTransition, Follower, FollowerPlacement, FollowerWidth, OptionComp,
};
@ -189,7 +189,7 @@ pub fn AutoComplete(
>
<div
class="thaw-config-provider thaw-auto-complete__listbox"
style=move || display.get()
style=move || display.get().unwrap_or_default()
data-thaw-id=config_provider.id().clone()
node_ref=menu_ref
role="listbox"

2
thaw/src/color_picker/mod.rs
View file

@ -148,7 +148,7 @@ pub fn ColorPicker(
<div
class="thaw-config-provider thaw-color-picker-popover"
node_ref=popover_ref
style=move || display.get()
style=move || display.get().unwrap_or_default()
data-thaw-id=config_provider.id().clone()
>

10
thaw/src/combobox/combobox.rs
View file

@ -107,7 +107,7 @@ pub fn Combobox(
>
<input
type="text"
aria-expanded="true"
// aria-expanded="true"
role="combobox"
class="thaw-combobox__input"
prop:value=move || {
@ -122,7 +122,7 @@ pub fn Combobox(
<span
aria-hidden="true"
class="thaw-combobox__clear-icon"
style=move || (!is_show_clear_icon.get()).then(|| "display: none")
style=move || (!is_show_clear_icon.get()).then(|| "display: none").unwrap_or_default()
node_ref=clear_icon_ref
>
<svg fill="currentColor" aria-hidden="true" width="1em" height="1em" viewBox="0 0 20 20">
@ -135,11 +135,11 @@ pub fn Combobox(
}
}
<span
aria-expanded="true"
// aria-expanded="true"
role="button"
aria-label="Open"
class="thaw-combobox__expand-icon"
style=move || is_show_clear_icon.get().then(|| "display: none")
style=move || is_show_clear_icon.get().then(|| "display: none").unwrap_or_default()
>
<svg fill="currentColor" aria-hidden="true" width="1em" height="1em" viewBox="0 0 20 20">
<path d="M15.85 7.65c.2.2.2.5 0 .7l-5.46 5.49a.55.55 0 0 1-.78 0L4.15 8.35a.5.5 0 1 1 .7-.7L10 12.8l5.15-5.16c.2-.2.5-.2.7 0Z" fill="currentColor">
@ -163,7 +163,7 @@ pub fn Combobox(
>
<div
class="thaw-config-provider thaw-combobox__listbox"
style=move || display.get()
style=move || display.get().unwrap_or_default()
data-thaw-id=config_provider.id().clone()
node_ref=listbox_ref
role="listbox"

2
thaw/src/date_picker/panel/mod.rs
View file

@ -73,7 +73,7 @@ pub fn Panel(
<div
class="thaw-config-provider thaw-date-picker-panel"
data-thaw-id=config_provider.id().clone()
style=move || display.get()
style=move || display.get().unwrap_or_default()
node_ref=panel_ref
>

2
thaw/src/dialog/dialog.rs
View file

@ -39,7 +39,7 @@ pub fn Dialog(
>
<div
class="thaw-dialog-surface__backdrop"
style=move || display.get()
style=move || display.get().unwrap_or_default()
on:click=on_mask_click
node_ref=mask_ref
aria-hidden="true"

2
thaw/src/dialog/dialog_surface.rs
View file

@ -20,7 +20,7 @@ pub fn DialogSurface(children: Children) -> impl IntoView {
node_ref=surface_ref
role="dialog"
// aria-modal="true"
style:display=move || display.get().map(|_| "none")
style:display=move || display.get().map(|_| "none").unwrap_or_default()
>
{children()}
</div>

2
thaw/src/drawer/overlay_drawer.rs
View file

@ -73,7 +73,7 @@ pub fn OverlayDrawer(
>
<div
class="thaw-overlay-drawer__backdrop"
style=move || display.get()
style=move || display.get().unwrap_or_default()
on:click=on_mask_click
node_ref=mask_ref
></div>

33
thaw/src/icon/mod.rs
View file

@ -56,8 +56,8 @@ pub fn Icon(
};
icon_style.set(style);
icon_x.set(icon.x.map(|x| x.into_attribute()));
icon_y.set(icon.y.map(|y| y.into_attribute()));
icon_x.set(icon.x.map(|x| x.to_string()));
icon_y.set(icon.y.map(|y| y.to_string()));
let width = match (width.clone(), icon.width) {
(Some(a), _) => a,
@ -71,13 +71,13 @@ pub fn Icon(
};
icon_height.set(Some(height));
icon_view_box.set(icon.view_box.map(|view_box| view_box.into_attribute()));
icon_stroke_linecap.set(icon.stroke_linecap.map(|a| a.into_attribute()));
icon_stroke_linejoin.set(icon.stroke_linejoin.map(|a| a.into_attribute()));
icon_stroke_width.set(icon.stroke_width.map(|a| a.into_attribute()));
icon_stroke.set(icon.stroke.map(|a| a.into_attribute()));
icon_fill.set(Some(icon.fill.unwrap_or("currentColor").into_attribute()));
icon_data.set(Some(icon.data.into_attribute()));
icon_view_box.set(icon.view_box.map(|view_box| view_box.to_string()));
icon_stroke_linecap.set(icon.stroke_linecap.map(|a| a.to_string()));
icon_stroke_linejoin.set(icon.stroke_linejoin.map(|a| a.to_string()));
icon_stroke_width.set(icon.stroke_width.map(|a| a.to_string()));
icon_stroke.set(icon.stroke.map(|a| a.to_string()));
icon_fill.set(Some(icon.fill.unwrap_or("currentColor").to_string()));
icon_data.set(Some(icon.data.to_string()));
});
view! {
@ -100,15 +100,18 @@ pub fn Icon(
}
}
fn take_signal(signal: RwSignal<Option<MaybeSignal<String>>>) -> Option<String> {
fn take_signal(signal: RwSignal<Option<MaybeSignal<String>>>) -> String {
signal.with(|s| match s {
Some(MaybeSignal::Static(value)) => Some(value.clone()),
Some(MaybeSignal::Dynamic(signal)) => Some(signal.get()),
_ => None,
Some(MaybeSignal::Static(value)) => value.clone(),
Some(MaybeSignal::Dynamic(signal)) => signal.get(),
_ => String::new(),
})
}
fn take(signal: RwSignal<Option<Attribute>>) -> Option<Attribute> {
fn take(signal: RwSignal<Option<String>>) -> String {
signal.track();
signal.try_update_untracked(|value| value.take()).flatten()
signal
.try_update_untracked(|value| value.take())
.flatten()
.unwrap_or_default()
}

33
thaw/src/input/mod.rs
View file

@ -1,4 +1,5 @@
use leptos::{ev, html, prelude::*};
use send_wrapper::SendWrapper;
use thaw_utils::{class_list, mount_style, ComponentRef, Model, OptionalProp};
#[derive(Default, Clone)]
@ -37,8 +38,8 @@ pub fn Input(
#[prop(optional, into)] allow_value: Option<Callback<String, bool>>,
#[prop(optional, into)] variant: MaybeSignal<InputVariant>,
#[prop(optional, into)] placeholder: OptionalProp<MaybeSignal<String>>,
#[prop(optional, into)] on_focus: Option<Callback<ev::FocusEvent>>,
#[prop(optional, into)] on_blur: Option<Callback<ev::FocusEvent>>,
#[prop(optional, into)] on_focus: Option<Callback<SendWrapper<ev::FocusEvent>>>,
#[prop(optional, into)] on_blur: Option<Callback<SendWrapper<ev::FocusEvent>>>,
#[prop(optional, into)] disabled: MaybeSignal<bool>,
#[prop(optional, into)] invalid: MaybeSignal<bool>,
#[prop(optional)] input_prefix: Option<InputPrefix>,
@ -50,27 +51,30 @@ pub fn Input(
mount_style("input", include_str!("./input.css"));
let value_trigger = ArcTrigger::new();
let on_input = move |ev| {
let input_value = event_target_value(&ev);
if let Some(allow_value) = allow_value.as_ref() {
if !allow_value.call(input_value.clone()) {
value_trigger.trigger();
return;
let on_input = {
let value_trigger = value_trigger.clone();
move |ev| {
let input_value = event_target_value(&ev);
if let Some(allow_value) = allow_value.as_ref() {
if !allow_value.call(input_value.clone()) {
value_trigger.trigger();
return;
}
}
value.set(input_value);
}
value.set(input_value);
};
let is_focus = RwSignal::new(false);
let on_internal_focus = move |ev| {
is_focus.set(true);
if let Some(on_focus) = on_focus.as_ref() {
on_focus.call(ev);
on_focus.call(SendWrapper::new(ev));
}
};
let on_internal_blur = move |ev| {
is_focus.set(false);
if let Some(on_blur) = on_blur.as_ref() {
on_blur.call(ev);
on_blur.call(SendWrapper::new(ev));
}
};
@ -113,12 +117,15 @@ pub fn Input(
// });
// }
let prefix_if_ = input_prefix.as_ref().map_or(false, |prefix| prefix.if_);
let suffix_if_ = input_suffix.as_ref().map_or(false, |suffix| suffix.if_);
view! {
<span
class=class_list![
"thaw-input",
("thaw-input--prefix", input_prefix.as_ref().map_or(false, |prefix| prefix.if_)),
("thaw-input--suffix", input_suffix.as_ref().map_or(false, |suffix| suffix.if_)),
("thaw-input--prefix", prefix_if_),
("thaw-input--suffix", suffix_if_),
("thaw-input--disabled", move || disabled.get()), ("thaw-input--invalid", move ||
invalid.get()), class.map(| c | move || c.get())
]

2
thaw/src/loading_bar/mod.rs
View file

@ -83,7 +83,7 @@ pub(crate) fn LoadingBar(#[prop(optional)] comp_ref: ComponentRef<LoadingBarRef>
<div
class="thaw-config-provider thaw-loading-bar-container"
data-thaw-id=config_provider.id().clone()
style=move || (!loading.get()).then_some("display: none;")
style=move || (!loading.get()).then_some("display: none;").unwrap_or_default()
>
<div
class="thaw-loading-bar"

2
thaw/src/popover/mod.rs
View file

@ -130,7 +130,7 @@ pub fn Popover(
class
]
data-thaw-id=config_provider.id().clone()
style=move || display.get()
style=move || display.get().unwrap_or_default()
node_ref=popover_ref
on:mouseenter=on_mouse_enter

4
thaw/src/scrollbar/mod.rs
View file

@ -287,7 +287,7 @@ pub fn Scrollbar(
<div class="thaw-scrollbar__track--vertical" node_ref=y_track_ref>
<div
class="thaw-scrollabr__thumb"
style:display=move || (!is_show_y_thumb.get()).then_some("none")
style:display=move || (!is_show_y_thumb.get()).then_some("none").unwrap_or_default()
style:height=move || format!("{}px", y_thumb_height.get())
style:top=move || format!("{}px", y_thumb_top.get())
on:mousedown=on_y_thumb_mousedown
@ -296,7 +296,7 @@ pub fn Scrollbar(
<div class="thaw-scrollbar__track--horizontal" node_ref=x_track_ref>
<div
class="thaw-scrollabr__thumb"
style:display=move || (!is_show_x_thumb.get()).then_some("none")
style:display=move || (!is_show_x_thumb.get()).then_some("none").unwrap_or_default()
style:width=move || format!("{}px", x_thumb_width.get())
style:left=move || format!("{}px", x_thumb_left.get())
on:mousedown=on_x_thumb_mousedown

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

@ -30,25 +30,27 @@ pub fn Space(
SpaceGap::WH(width, height) => format!("{width}px {height}px"),
};
view! {
<div
class=class_list!["thaw-space", class.map(| c | move || c.get())]
style:gap=gap
style:align-items=move || align.get().map(|a| a.as_str())
style:justify-content=move || justify.get().map(|j| j.as_str())
style:flex-direction=if vertical { "column" } else { "row" }
>
children()
{children()
.nodes
.into_iter()
.map(|node| {
view! { <div class="thaw-space__item">{node}</div> }
})
.collect::<Vec<_>>()}
// view! {
// <div
// class=class_list!["thaw-space", class.map(| c | move || c.get())]
// style:gap=gap
// style:align-items=move || align.get().map(|a| a.as_str())
// style:justify-content=move || justify.get().map(|j| j.as_str())
// style:flex-direction=if vertical { "column" } else { "row" }
// >
</div>
}
// // {children()
// // .nodes
// // .into_iter()
// // .map(|node| {
// // view! { <div class="thaw-space__item">{node}</div> }
// // })
// // .collect::<Vec<_>>()}
// </div>
// }
}
#[derive(Clone)]

6
thaw/src/spinner/mod.rs
View file

@ -42,14 +42,14 @@ pub fn Spinner(
mount_style("spinner", include_str!("./spinner.css"));
let id = StoredValue::new(uuid::Uuid::new_v4().to_string());
let spinner_label = label.clone();
let labelledby = move || spinner_label.with(|_| true).map(|_| id.get_value());
// let spinner_label = label.clone();
// let labelledby = move || spinner_label.with(|_| true).map(|_| id.get_value());
view! {
<div
class=class_list!["thaw-spinner", move || format!("thaw-spinner--{}", size.get().as_str()), class]
role="progressbar"
aria-labelledby=labelledby
// aria-labelledby=labelledby
>
<span class="thaw-spinner__spinner">
<span class="thaw-spinner__spinner-tail"></span>

2
thaw/src/tab_list/tab.rs
View file

@ -65,7 +65,7 @@ pub fn Tab(
"thaw-tab", ("thaw-tab--selected", move || selected.get()), class
]
role="tab"
aria-selected=move || if selected.get() { "true" } else { "false" }
// aria-selected=move || if selected.get() { "true" } else { "false" }
node_ref=tab_ref
on:click=on_select
>

8
thaw/src/time_picker/mod.rs
View file

@ -158,7 +158,7 @@ fn Panel(
<div
class="thaw-config-provider thaw-time-picker-panel"
data-thaw-id=config_provider.id().clone()
style=move || display.get()
style=move || display.get().unwrap_or_default()
node_ref=panel_ref
>
<div class="thaw-time-picker-panel__time">
@ -317,10 +317,8 @@ fn PanelTimeItem(
comp_ref: ComponentRef<PanelTimeItemRef>,
) -> impl IntoView {
let item_ref = NodeRef::new();
item_ref.on_load(move |_| {
let item_ref = PanelTimeItemRef { item_ref };
comp_ref.load(item_ref);
});
comp_ref.load(PanelTimeItemRef { item_ref });
view! {
<div
class="thaw-time-picker-panel__time-item"

8
thaw/src/toast/toaster.rs
View file

@ -9,13 +9,13 @@ pub fn Toaster(
#[prop(optional)] position: ToastPosition,
) -> impl IntoView {
mount_style("toaster", include_str!("./toaster.css"));
let toast_list = RwSignal::new(vec![]);
// let toast_list = RwSignal::new(vec![]);
Effect::new(move |_| {
for view in receiver.try_recv() {
toast_list.update(move |list| {
list.push(view);
});
// toast_list.update(move |list| {
// list.push(view.0);
// });
}
});
view! {

9
thaw_utils/src/class_list.rs
View file

@ -140,10 +140,11 @@ impl ClassList {
}
}
impl<'a, R> leptos::tachys::html::class::IntoClass<R> for ClassList
impl<R> leptos::tachys::html::class::IntoClass<R> for ClassList
where
R: DomRenderer,
{
type AsyncOutput = Self;
type State = (R::ClassList, String);
type Cloneable = Self;
type CloneableOwned = Self;
@ -208,6 +209,12 @@ where
fn into_cloneable_owned(self) -> Self::CloneableOwned {
self
}
fn dry_resolve(&mut self) {}
async fn resolve(self) -> Self::AsyncOutput {
self
}
}
pub enum Class {