Make Spinner animation suspendable

This commit is contained in:
2024-03-09 13:04:01 +01:00
parent 46c251ef90
commit 043a721429
2 changed files with 14 additions and 2 deletions

View File

@@ -23,14 +23,21 @@ impl IconShape for _Spinner {
}
}
#[component]
pub fn Spinner(cx: Scope) -> Element {
#[derive(PartialEq, Props)]
pub struct SpinnerProps {
#[props(default = true)]
animate: bool,
}
pub fn Spinner(cx: Scope<SpinnerProps>) -> Element {
cx.render(rsx! {
style { STYLE_SHEET },
div {
class: ClassName::ROOT,
Icon {
class: if cx.props.animate { "" } else { ClassName::PAUSED },
icon: _Spinner,
}
}

View File

@@ -35,5 +35,10 @@ $logo-aspect-ratio: calc($logo-width / $logo-height);
fill: $color-ternary-100;
}
}
&.paused {
animation-play-state: paused;
}
}
}