orbital_base_components/motion/
collapse_transition.rs

1#[allow(deprecated)]
2use leptos::prelude::*;
3
4use crate::{overlay::css_transition::OrbitalCSSTransition, WebSysCallback};
5
6/// Height collapse animation for expandable panels (tree subtrees, accordions).
7///
8/// **Deprecated:** prefer [`orbital_motion::OrbitalPresence`] with [`orbital_motion::PresenceMotion::collapse`].
9#[deprecated(
10    since = "0.1.0",
11    note = "use orbital_motion::OrbitalPresence with PresenceMotion::collapse instead"
12)]
13#[component]
14pub fn BaseCollapseTransition<T>(
15    #[prop(into)] show: Signal<bool>,
16    #[prop(optional, into)] motion_name: MaybeProp<String>,
17    children: TypedChildren<T>,
18) -> impl IntoView
19where
20    T: AddAnyAttr + IntoView + Send + 'static,
21{
22    let on_enter = WebSysCallback::new(|el: web_sys::HtmlElement| {
23        let style = el.style();
24        let memorized_height = el.offset_height();
25        let _ = style.set_property("max-height", "0");
26        let _ = el.offset_width();
27        let _ = style.set_property("transition", "");
28        let _ = style.set_property("max-height", &format!("{memorized_height}px"));
29        let _ = el.offset_width();
30    });
31
32    let on_after_enter = WebSysCallback::new(|el: web_sys::HtmlElement| {
33        let _ = el.style().set_property("max-height", "");
34    });
35
36    let on_before_leave = WebSysCallback::new(|el: web_sys::HtmlElement| {
37        let _ = el
38            .style()
39            .set_property("max-height", &format!("{}px", el.offset_height()));
40        let _ = el.offset_width();
41    });
42
43    let on_leave = WebSysCallback::new(|el: web_sys::HtmlElement| {
44        let _ = el.style().set_property("max-height", "0");
45        let _ = el.offset_width();
46    });
47
48    let on_after_leave = WebSysCallback::new(|el: web_sys::HtmlElement| {
49        let _ = el.style().set_property("max-height", "");
50    });
51
52    view! {
53        <OrbitalCSSTransition
54            show=show
55            name=Signal::derive(move || {
56                motion_name
57                    .get()
58                    .unwrap_or_else(|| "orbital-motion-collapse".to_string())
59            })
60            on_enter=on_enter
61            on_after_enter=on_after_enter
62            on_before_leave=on_before_leave
63            on_leave=on_leave
64            on_after_leave=on_after_leave
65        >
66            {children.into_inner()().into_inner()}
67        </OrbitalCSSTransition>
68    }
69}
orbital_base_components/motion/collapse_transition.rs

orbital_base_components/motion/
collapse_transition.rs
