diff --git a/crates/ascend/src/components/button.rs b/crates/ascend/src/components/button.rs index 47ac872..845c75f 100644 --- a/crates/ascend/src/components/button.rs +++ b/crates/ascend/src/components/button.rs @@ -7,11 +7,15 @@ use leptos::prelude::*; pub fn Button( #[prop(into, optional)] icon: MaybeProp, - #[prop(into)] text: Signal, + #[prop(into, optional)] text: MaybeProp, #[prop(optional)] color: Gradient, #[prop(into, optional)] highlight: MaybeProp, + + #[prop(into, optional)] disabled: MaybeProp, + + #[prop(into, optional)] on_click: MaybeProp>, ) -> impl IntoView { let margin = "mx-2 my-1 sm:mx-5 sm:my-2.5"; @@ -26,7 +30,7 @@ pub fn Button( view! {
{icon_view}
} }); - let separator = icon.get().is_some().then(|| { + let separator = (icon.read().is_some() && text.read().is_some()).then(|| { let mut classes = "w-0.5 bg-linear-to-br min-w-0.5".to_string(); classes.push(' '); classes.push_str(color.class_from()); @@ -36,16 +40,34 @@ pub fn Button( view! {
} }); - let text_view = { + let text_view = text.get().map(|text| { let mut classes = "self-center uppercase w-full text-sm sm:text-base md:text-lg font-thin".to_string(); classes.push(' '); classes.push_str(margin); - view! {
{text.get()}
} + view! {
{text}
} + }); + + let class = move || { + let mut classes = vec![]; + if disabled.get().unwrap_or_default() { + classes.extend(["brightness-50"]); + } else { + classes.extend(["cursor-pointer", "hover:brightness-125", "active:brightness-90"]); + } + classes.join(" ") }; + let on_click = move |_| { + if let Some(cb) = on_click.get() { + cb.run(()); + } + }; + + let prop_disabled = move || disabled.get(); + view! { -
-
-
+
+
+ + + +
+ + +
- - - - -
+
{move || ctx.problem.get().map(|problem| view! { })} +
- - - - - - - -
-
+
} } +#[component] +#[tracing::instrument(skip_all)] +fn Transformations() -> impl IntoView { + crate::tracing::on_enter!(); + + let ctx = use_context::().unwrap(); + + let on_left = Callback::new(move |()| { + tracing::info!("left"); + }); + let on_mirror = Callback::new(move |()| { + tracing::info!("mirror"); + }); + let on_right = Callback::new(move |()| { + tracing::info!("right"); + }); + + view! { +
+
+ } +} + #[component] #[tracing::instrument(skip_all)] fn HoldsButton() -> impl IntoView { @@ -231,19 +253,8 @@ fn NextProblemButton() -> impl IntoView { let ctx = use_context::().unwrap(); - let on_click = move |_| ctx.cb_next_problem.run(()); - view! { -
-
-
-
- } + let on_click = Callback::new(move |_| ctx.cb_next_problem.run(())); + view! {