feat(lepots-v0.7): thaw_components

thaw/Cargo.toml

@@ -13,7 +13,7 @@ license = "MIT"
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
 [dependencies]
-leptos = { version = "0.6.10" }
+leptos = { workspace = true }
 thaw_components = { workspace = true }
 thaw_macro = { workspace = true }
 thaw_utils = { workspace = true }

thaw/src/accordion/accordion_item.rs

@@ -1,5 +1,5 @@
 use crate::AccordionInjection;
-use leptos::*;
+use leptos::{prelude::*, html};
 use thaw_components::CSSTransition;
 use thaw_utils::{mount_style, StoredMaybeSignal};
 
@@ -43,7 +43,7 @@ pub fn AccordionItem(
             <div class="thaw-accordion-header">
                 <button
                     class="thaw-accordion-header__button"
-                    aria-expanded=move || is_show_panel.get().to_string()
+                    // aria_expanded=move || is_show_panel.get().to_string() #TODO
                     type="button"
                     on:click=on_click
                 >
@@ -58,8 +58,8 @@ pub fn AccordionItem(
             >
                 <div
                     class="thaw-accordion-panel"
-                    ref=panel_ref
-                    style=move || display.get()
+                    node_ref=panel_ref
+                    style=move || display.get().map(|d| d.to_string())
                 >
                     {children()}
                 </div>

thaw/src/accordion/mod.rs

@@ -2,7 +2,7 @@ mod accordion_item;
 
 pub use accordion_item::*;
 
-use leptos::*;
+use leptos::{context::Provider, prelude::*};
 use std::collections::HashSet;
 use thaw_utils::Model;
 

thaw_components/src/binder/mod.rs

@@ -185,7 +185,7 @@ fn FollowerContainer<E>(
     children: Children,
 ) -> impl IntoView
 where
-    E: ElementType,
+    E: ElementType + 'static,
     E::Output: JsCast + Clone + Deref<Target = web_sys::Element> + 'static,
 {
     let content_ref = NodeRef::<html::Div>::new();
@@ -239,11 +239,14 @@ where
             return;
         }
         if show.get() {
-            request_animation_frame(move || {
-                sync_position.call(());
+            request_animation_frame({
+                let sync_position = sync_position.clone();
+                move || {
+                    sync_position.call(());
+                }
             });
-            add_scroll_listener.call(sync_position);
-            add_resize_listener.call(sync_position);
+            add_scroll_listener.call(sync_position.clone());
+            add_resize_listener.call(sync_position.clone());
         } else {
             remove_scroll_listener.call(());
             remove_resize_listener.call(());
@@ -261,5 +264,5 @@ where
         )
     });
 
-    view! { <Teleport element=children immediate=show/> }
+    view! { <Teleport element=children.into_any() immediate=show/> }
 }

thaw_components/src/css_transition/mod.rs

@@ -1,5 +1,6 @@
 use leptos::{ev, html::ElementType, prelude::*};
 use std::{ops::Deref, time::Duration};
+use tachys::view::any_view::AnyView;
 use thaw_utils::{add_event_listener, EventListenerHandle, NextFrame};
 use web_sys::wasm_bindgen::JsCast;
 
@@ -22,9 +23,9 @@ pub fn CSSTransition<E, CF, IV>(
 ) -> impl IntoView
 where
     E: ElementType + 'static,
-    E::Output: JsCast + Clone + Deref<Target = web_sys::Element> + 'static,
-    CF: FnOnce(ReadSignal<Option<&'static str>>) -> IV + 'static,
-    IV: IntoView,
+    E::Output: JsCast + Clone + Deref<Target = web_sys::HtmlElement> + 'static,
+    CF: FnOnce(ReadSignal<Option<&'static str>>) -> IV + Send + 'static,
+    IV: IntoView + 'static,
 {
     let display = RwSignal::new((!show.get_untracked()).then_some("display: none;"));
 
@@ -92,13 +93,13 @@ where
                     }
                 };
                 let handle = match types {
-                    AnimationTypes::Transition => {
-                        add_event_listener(el.deref().clone(), ev::transitionend, move |_| {
-                            event_listener()
-                        })
-                    }
+                    AnimationTypes::Transition => add_event_listener(
+                        el.deref().clone().into(),
+                        ev::transitionend,
+                        move |_| event_listener(),
+                    ),
                     AnimationTypes::Animation => {
-                        add_event_listener(el.deref().clone(), ev::animationend, move |_| {
+                        add_event_listener(el.deref().clone().into(), ev::animationend, move |_| {
                             event_listener()
                         })
                     }

thaw_components/src/focus_trap/mod.rs

@@ -32,6 +32,7 @@ pub fn FocusTrap(
         Effect::new(move |prev| {
             let is_active = active.get();
             if is_active && !prev.unwrap_or(false) {
+                let on_esc = on_esc.clone();
                 let handle = window_event_listener(ev::keydown, move |e| {
                     if &e.code() == "Escape" {
                         if is_current_active() {

thaw_components/src/teleport/mod.rs

@@ -1,5 +1,5 @@
 use cfg_if::cfg_if;
-use leptos::{html::{AnyElement, HtmlElement}, prelude::*};
+use leptos::prelude::*;
 use tachys::view::any_view::AnyView;
 
 /// https://github.com/solidjs/solid/blob/main/packages/solid/web/src/index.ts#L56
@@ -7,7 +7,7 @@ use tachys::view::any_view::AnyView;
 pub fn Teleport(
     #[prop(default = true.into(), into)] immediate: MaybeSignal<bool>,
     #[prop(into, optional)] mount: Option<web_sys::Element>,
-    #[prop(optional, into)] element: Option<HtmlElement<AnyElement>>,
+    #[prop(optional, into)] element: Option<AnyView<Dom>>,
     #[prop(optional)] children: Option<Children>,
 ) -> impl IntoView {
     cfg_if! { if #[cfg(all(target_arch = "wasm32", any(feature = "csr", feature = "hydrate")))] {