adam/thaw
1
0
Fork 0
mirror of https://github.com/adoyle0/thaw.git synced 2025-03-13 05:59:49 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: Scrollbar adds content_class and content_style prop

Browse source
This commit is contained in:
luoxiao 2024-04-05 23:28:19 +08:00 • committed by luoxiaozero
parent 61e3862a1d
commit a1a301a765
2 changed files with 18 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
demo_markdown/docs/scrollbar/mod.md
View file

@ -28,5 +28,7 @@ view! {
| --- | --- | --- | --- | | --- | --- | --- | --- |
| class | `OptionalProp<MaybeSignal<String>>` | `Default::default()` | Additional classes for the scrollbar element. | | class | `OptionalProp<MaybeSignal<String>>` | `Default::default()` | Additional classes for the scrollbar element. |
| style | `Option<MaybeSignal<String>>` | `Default::default()` | Scrollbar's style. | | style | `Option<MaybeSignal<String>>` | `Default::default()` | Scrollbar's style. |
| content_class | `OptionalProp<MaybeSignal<String>>` | `Default::default()` | Addtional classes for the layout element. |
| content_style | `OptionalProp<MaybeSignal<String>>` | `Default::default()` | Style of scrollable content node. |
| size | `u8` | `8` | Size of scrollbar. | | size | `u8` | `8` | Size of scrollbar. |
| children | `Children` | | Scrollbar's content. | | children | `Children` | | Scrollbar's content. |

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

@ -10,6 +10,8 @@ use thaw_utils::{class_list, mount_style, OptionalProp};
pub fn Scrollbar( pub fn Scrollbar(
#[prop(optional, into)] class: OptionalProp<MaybeSignal<String>>, #[prop(optional, into)] class: OptionalProp<MaybeSignal<String>>,
#[prop(optional, into)] style: Option<MaybeSignal<String>>, #[prop(optional, into)] style: Option<MaybeSignal<String>>,
#[prop(optional, into)] content_class: OptionalProp<MaybeSignal<String>>,
#[prop(optional, into)] content_style: OptionalProp<MaybeSignal<String>>,
#[prop(default = 8)] size: u8, #[prop(default = 8)] size: u8,
children: Children, children: Children,
) -> impl IntoView { ) -> impl IntoView {
@ -54,6 +56,9 @@ pub fn Scrollbar(
if content_width <= 0.0 { if content_width <= 0.0 {
return 0.0; return 0.0;
} }
if content_width <= container_width {
return 0.0;
}
x_track_width * container_width / content_width x_track_width * container_width / content_width
}); });
let x_thumb_left = Memo::new(move |_| { let x_thumb_left = Memo::new(move |_| {
@ -83,6 +88,10 @@ pub fn Scrollbar(
if content_height <= 0.0 { if content_height <= 0.0 {
return 0.0; return 0.0;
} }
if content_height <= container_height {
return 0.0;
}
y_track_height * container_height / content_height y_track_height * container_height / content_height
}); });
let y_thumb_top = Memo::new(move |_| { let y_thumb_top = Memo::new(move |_| {
@ -271,7 +280,13 @@ pub fn Scrollbar(
> >
<div class="thaw-scrollbar__container" ref=container_ref on:scroll=on_scroll> <div class="thaw-scrollbar__container" ref=container_ref on:scroll=on_scroll>
<div class="thaw-scrollbar__content" style="width: fit-content;" ref=content_ref>{children()}</div> <div
class=class_list!["thaw-scrollbar__content", content_class.map(|c| move || c.get())]
style=move || format!("width: fit-content; {}", content_style.as_ref().map_or(String::new(), |s| s.get()))
ref=content_ref
>
{children()}
</div>
</div> </div>
<div class="thaw-scrollbar__track--vertical" ref=y_track_ref> <div class="thaw-scrollbar__track--vertical" ref=y_track_ref>
<div <div