mirror of
https://github.com/adoyle0/leptos-use.git
synced 2025-02-02 10:54:15 -05:00
Merge remote-tracking branch 'origin/main' into use_webtransport
# Conflicts: # src/use_scroll.rs
This commit is contained in:
commit
58e6759a76
46 changed files with 271 additions and 262 deletions
11
CHANGELOG.md
11
CHANGELOG.md
|
@ -11,7 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||||
- `signal_debounced`
|
- `signal_debounced`
|
||||||
- `signal_throttled`
|
- `signal_throttled`
|
||||||
|
|
||||||
### Braking Changes 🛠
|
### Breaking Changes 🛠
|
||||||
|
|
||||||
- Leptos version is now 0.5
|
- Leptos version is now 0.5
|
||||||
- No `cx: Scope` params are supported/needed anymore because of the changes in Leptos.
|
- No `cx: Scope` params are supported/needed anymore because of the changes in Leptos.
|
||||||
|
@ -35,6 +35,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||||
|
|
||||||
- Callbacks in options don't require to be cloneable anymore
|
- Callbacks in options don't require to be cloneable anymore
|
||||||
- Callback in `use_raf_fn` doesn't require to be cloneable anymore
|
- Callback in `use_raf_fn` doesn't require to be cloneable anymore
|
||||||
|
- `use_scroll` is now callable on the server
|
||||||
|
|
||||||
### Fixes 🍕
|
### Fixes 🍕
|
||||||
|
|
||||||
|
@ -70,7 +71,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||||
- `is_some`
|
- `is_some`
|
||||||
- `use_raf_fn`
|
- `use_raf_fn`
|
||||||
|
|
||||||
### Braking Changes 🛠
|
### Breaking Changes 🛠
|
||||||
|
|
||||||
- The following functions now accept a `MaybeRwSignal` as their initial/default value which means
|
- The following functions now accept a `MaybeRwSignal` as their initial/default value which means
|
||||||
you can use a synchronized `RwSignal` in those places.
|
you can use a synchronized `RwSignal` in those places.
|
||||||
|
@ -113,7 +114,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||||
|
|
||||||
## [0.4.0] - 2023-07-03
|
## [0.4.0] - 2023-07-03
|
||||||
|
|
||||||
### Braking Changes 🛠
|
### Breaking Changes 🛠
|
||||||
|
|
||||||
- Required `leptos` version is now 0.4
|
- Required `leptos` version is now 0.4
|
||||||
- Following the changes in `leptos` there is no longer a `stable` crate feature required in order to use this library
|
- Following the changes in `leptos` there is no longer a `stable` crate feature required in order to use this library
|
||||||
|
@ -150,7 +151,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||||
|
|
||||||
## [0.3.0] - 2023-06-13
|
## [0.3.0] - 2023-06-13
|
||||||
|
|
||||||
### Braking Changes 🛠
|
### Breaking Changes 🛠
|
||||||
|
|
||||||
- `use_event_listener` no longer returns a `Box<dyn Fn()>` but a `impl Fn() + Clone`
|
- `use_event_listener` no longer returns a `Box<dyn Fn()>` but a `impl Fn() + Clone`
|
||||||
|
|
||||||
|
@ -180,7 +181,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||||
|
|
||||||
## [0.2.0] - 2023-06-11
|
## [0.2.0] - 2023-06-11
|
||||||
|
|
||||||
### Braking Changes
|
### Breaking Changes
|
||||||
|
|
||||||
- `watch` doesn't accept `immediate` as a direct argument anymore. This is only provided by the option variant.
|
- `watch` doesn't accept `immediate` as a direct argument anymore. This is only provided by the option variant.
|
||||||
- `watch` has now variant `watch_with_options` which allows for debouncing and throttling.
|
- `watch` has now variant `watch_with_options` which allows for debouncing and throttling.
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
[package]
|
[package]
|
||||||
name = "leptos-use"
|
name = "leptos-use"
|
||||||
version = "0.7.0-alpha"
|
version = "0.7.0-beta"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
authors = ["Marc-Stefan Cassola"]
|
authors = ["Marc-Stefan Cassola"]
|
||||||
categories = ["gui", "web-programming"]
|
categories = ["gui", "web-programming"]
|
||||||
|
|
|
@ -26,6 +26,7 @@
|
||||||
[![Docs](https://docs.rs/leptos-use/badge.svg)](https://docs.rs/leptos-use/)
|
[![Docs](https://docs.rs/leptos-use/badge.svg)](https://docs.rs/leptos-use/)
|
||||||
[![MIT/Apache 2.0](https://img.shields.io/badge/license-MIT%2FApache-blue.svg)](https://github.com/synphonyte/leptos-use#license)
|
[![MIT/Apache 2.0](https://img.shields.io/badge/license-MIT%2FApache-blue.svg)](https://github.com/synphonyte/leptos-use#license)
|
||||||
[![Build Status](https://github.com/synphonyte/leptos-use/actions/workflows/ci.yml/badge.svg)](https://github.com/synphonyte/leptos-use/actions/workflows/ci.yml)
|
[![Build Status](https://github.com/synphonyte/leptos-use/actions/workflows/ci.yml/badge.svg)](https://github.com/synphonyte/leptos-use/actions/workflows/ci.yml)
|
||||||
|
[![Discord](https://img.shields.io/discord/1031524867910148188?color=%237289DA&label=discord)](https://discord.com/channels/1031524867910148188/1121154537709895783)
|
||||||
|
|
||||||
```rust
|
```rust
|
||||||
use leptos::*;
|
use leptos::*;
|
||||||
|
@ -89,4 +90,4 @@ To scaffold a new function quickly you can run `template/createfn.sh`. It requir
|
||||||
|---------------|---------------------------|
|
|---------------|---------------------------|
|
||||||
| <= 0.3 | 0.3 |
|
| <= 0.3 | 0.3 |
|
||||||
| 0.4, 0.5, 0.6 | 0.4 |
|
| 0.4, 0.5, 0.6 | 0.4 |
|
||||||
| main | 0.5.0-alpha |
|
| main | 0.5.0-alpha/beta |
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -11,16 +11,16 @@ axum = { version = "0.6.4", optional = true }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
cfg-if = "1"
|
cfg-if = "1"
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly"] }
|
||||||
leptos_axum = { version = "0.5.0-alpha2", optional = true }
|
leptos_axum = { version = "0.5.0-beta2", optional = true }
|
||||||
leptos_meta = { version = "0.5.0-alpha2", features = ["nightly"] }
|
leptos_meta = { version = "0.5.0-beta2", features = ["nightly"] }
|
||||||
leptos_router = { version = "0.5.0-alpha2", features = ["nightly"] }
|
leptos_router = { version = "0.5.0-beta2", features = ["nightly"] }
|
||||||
leptos-use = { path = "../..", features = ["storage"] }
|
leptos-use = { path = "../..", features = ["storage"] }
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
simple_logger = "4"
|
simple_logger = "4"
|
||||||
tokio = { version = "1.25.0", optional = true }
|
tokio = { version = "1.25.0", optional = true }
|
||||||
tower = { version = "0.4.13", optional = true }
|
tower = { version = "0.4.13", optional = true }
|
||||||
tower-http = { version = "0.5.0-alpha2", features = ["fs"], optional = true }
|
tower-http = { version = "0.5.0-beta2", features = ["fs"], optional = true }
|
||||||
wasm-bindgen = "=0.2.87"
|
wasm-bindgen = "=0.2.87"
|
||||||
thiserror = "1.0.38"
|
thiserror = "1.0.38"
|
||||||
tracing = { version = "0.1.37", optional = true }
|
tracing = { version = "0.1.37", optional = true }
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -4,7 +4,7 @@ version = "0.1.0"
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|
||||||
[dependencies]
|
[dependencies]
|
||||||
leptos = { version = "0.5.0-alpha2", features = ["nightly", "csr"] }
|
leptos = { version = "0.5.0-beta2", features = ["nightly", "csr"] }
|
||||||
console_error_panic_hook = "0.1"
|
console_error_panic_hook = "0.1"
|
||||||
console_log = "1"
|
console_log = "1"
|
||||||
log = "0.4"
|
log = "0.4"
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
use crate::utils::Pausable;
|
use crate::utils::Pausable;
|
||||||
use default_struct_builder::DefaultBuilder;
|
use default_struct_builder::DefaultBuilder;
|
||||||
use leptos::*;
|
use leptos::*;
|
||||||
use std::cell::RefCell;
|
use std::cell::{Cell, RefCell};
|
||||||
use std::rc::Rc;
|
use std::rc::Rc;
|
||||||
use wasm_bindgen::closure::Closure;
|
use wasm_bindgen::closure::Closure;
|
||||||
use wasm_bindgen::JsCast;
|
use wasm_bindgen::JsCast;
|
||||||
|
@ -47,8 +47,7 @@ pub fn use_raf_fn_with_options(
|
||||||
) -> Pausable<impl Fn() + Clone, impl Fn() + Clone> {
|
) -> Pausable<impl Fn() + Clone, impl Fn() + Clone> {
|
||||||
let UseRafFnOptions { immediate } = options;
|
let UseRafFnOptions { immediate } = options;
|
||||||
|
|
||||||
let previous_frame_timestamp = store_value(0.0_f64);
|
let raf_handle = Rc::new(Cell::new(None::<i32>));
|
||||||
let raf_handle = store_value(None::<i32>);
|
|
||||||
|
|
||||||
let (is_active, set_active) = create_signal(false);
|
let (is_active, set_active) = create_signal(false);
|
||||||
|
|
||||||
|
@ -56,11 +55,12 @@ pub fn use_raf_fn_with_options(
|
||||||
|
|
||||||
let request_next_frame = {
|
let request_next_frame = {
|
||||||
let loop_ref = Rc::clone(&loop_ref);
|
let loop_ref = Rc::clone(&loop_ref);
|
||||||
|
let raf_handle = Rc::clone(&raf_handle);
|
||||||
|
|
||||||
move || {
|
move || {
|
||||||
let loop_ref = Rc::clone(&loop_ref);
|
let loop_ref = Rc::clone(&loop_ref);
|
||||||
|
|
||||||
raf_handle.set_value(
|
raf_handle.set(
|
||||||
window()
|
window()
|
||||||
.request_animation_frame(
|
.request_animation_frame(
|
||||||
Closure::once_into_js(move |timestamp: f64| {
|
Closure::once_into_js(move |timestamp: f64| {
|
||||||
|
@ -76,13 +76,14 @@ pub fn use_raf_fn_with_options(
|
||||||
|
|
||||||
let loop_fn = {
|
let loop_fn = {
|
||||||
let request_next_frame = request_next_frame.clone();
|
let request_next_frame = request_next_frame.clone();
|
||||||
|
let previous_frame_timestamp = Cell::new(0.0_f64);
|
||||||
|
|
||||||
move |timestamp: f64| {
|
move |timestamp: f64| {
|
||||||
if !is_active.get() {
|
if !is_active.get() {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
let prev_timestamp = previous_frame_timestamp.get_value();
|
let prev_timestamp = previous_frame_timestamp.get();
|
||||||
let delta = if prev_timestamp > 0.0 {
|
let delta = if prev_timestamp > 0.0 {
|
||||||
timestamp - prev_timestamp
|
timestamp - prev_timestamp
|
||||||
} else {
|
} else {
|
||||||
|
@ -91,7 +92,7 @@ pub fn use_raf_fn_with_options(
|
||||||
|
|
||||||
callback(UseRafFnCallbackArgs { delta, timestamp });
|
callback(UseRafFnCallbackArgs { delta, timestamp });
|
||||||
|
|
||||||
previous_frame_timestamp.set_value(timestamp);
|
previous_frame_timestamp.set(timestamp);
|
||||||
|
|
||||||
request_next_frame();
|
request_next_frame();
|
||||||
}
|
}
|
||||||
|
@ -109,18 +110,18 @@ pub fn use_raf_fn_with_options(
|
||||||
let pause = move || {
|
let pause = move || {
|
||||||
set_active.set(false);
|
set_active.set(false);
|
||||||
|
|
||||||
let handle = raf_handle.get_value();
|
let handle = raf_handle.get();
|
||||||
if let Some(handle) = handle {
|
if let Some(handle) = handle {
|
||||||
let _ = window().cancel_animation_frame(handle);
|
let _ = window().cancel_animation_frame(handle);
|
||||||
}
|
}
|
||||||
raf_handle.set_value(None);
|
raf_handle.set(None);
|
||||||
};
|
};
|
||||||
|
|
||||||
if immediate {
|
if immediate {
|
||||||
resume();
|
resume();
|
||||||
}
|
}
|
||||||
|
|
||||||
on_cleanup(pause);
|
on_cleanup(pause.clone());
|
||||||
|
|
||||||
Pausable {
|
Pausable {
|
||||||
resume,
|
resume,
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
use crate::core::ElementMaybeSignal;
|
use crate::core::ElementMaybeSignal;
|
||||||
use crate::use_event_listener::use_event_listener_with_options;
|
use crate::use_event_listener::use_event_listener_with_options;
|
||||||
use crate::{use_debounce_fn_with_arg, use_throttle_fn_with_arg_and_options, ThrottleOptions};
|
use crate::{use_debounce_fn_with_arg, use_throttle_fn_with_arg_and_options, ThrottleOptions};
|
||||||
|
use cfg_if::cfg_if;
|
||||||
use default_struct_builder::DefaultBuilder;
|
use default_struct_builder::DefaultBuilder;
|
||||||
use leptos::ev::{scrollend, EventDescriptor};
|
use leptos::ev::scrollend;
|
||||||
use leptos::*;
|
use leptos::*;
|
||||||
use std::borrow::Cow;
|
|
||||||
use std::rc::Rc;
|
use std::rc::Rc;
|
||||||
use wasm_bindgen::JsCast;
|
use wasm_bindgen::JsCast;
|
||||||
|
|
||||||
|
@ -161,7 +161,7 @@ use wasm_bindgen::JsCast;
|
||||||
///
|
///
|
||||||
/// ## Server-Side Rendering
|
/// ## Server-Side Rendering
|
||||||
///
|
///
|
||||||
/// Please refer to ["Functions with Target Elements"](https://leptos-use.rs/server_side_rendering.html#functions-with-target-elements)
|
/// On the server this returns signals that don't change and setters that are noops.
|
||||||
pub fn use_scroll<El, T>(element: El) -> UseScrollReturn
|
pub fn use_scroll<El, T>(element: El) -> UseScrollReturn
|
||||||
where
|
where
|
||||||
El: Clone,
|
El: Clone,
|
||||||
|
@ -182,40 +182,6 @@ where
|
||||||
let (internal_x, set_internal_x) = create_signal(0.0);
|
let (internal_x, set_internal_x) = create_signal(0.0);
|
||||||
let (internal_y, set_internal_y) = create_signal(0.0);
|
let (internal_y, set_internal_y) = create_signal(0.0);
|
||||||
|
|
||||||
let signal = (element).into();
|
|
||||||
let behavior = options.behavior;
|
|
||||||
|
|
||||||
let scroll_to = {
|
|
||||||
let signal = signal.clone();
|
|
||||||
|
|
||||||
move |x: Option<f64>, y: Option<f64>| {
|
|
||||||
let element = signal.get_untracked();
|
|
||||||
|
|
||||||
if let Some(element) = element {
|
|
||||||
let element = element.into();
|
|
||||||
|
|
||||||
let mut scroll_options = web_sys::ScrollToOptions::new();
|
|
||||||
scroll_options.behavior(behavior.get_untracked().into());
|
|
||||||
|
|
||||||
if let Some(x) = x {
|
|
||||||
scroll_options.left(x);
|
|
||||||
}
|
|
||||||
if let Some(y) = y {
|
|
||||||
scroll_options.top(y);
|
|
||||||
}
|
|
||||||
|
|
||||||
element.scroll_to_with_scroll_to_options(&scroll_options);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
let set_x = {
|
|
||||||
let scroll_to = scroll_to.clone();
|
|
||||||
Box::new(move |x| scroll_to(Some(x), None))
|
|
||||||
};
|
|
||||||
|
|
||||||
let set_y = Box::new(move |y| scroll_to(None, Some(y)));
|
|
||||||
|
|
||||||
let (is_scrolling, set_is_scrolling) = create_signal(false);
|
let (is_scrolling, set_is_scrolling) = create_signal(false);
|
||||||
|
|
||||||
let arrived_state = create_rw_signal(Directions {
|
let arrived_state = create_rw_signal(Directions {
|
||||||
|
@ -231,182 +197,222 @@ where
|
||||||
bottom: false,
|
bottom: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
let on_scroll_end = {
|
cfg_if! { if #[cfg(feature = "ssr")] {
|
||||||
let on_stop = Rc::clone(&options.on_stop);
|
let set_x = Box::new(|_| {});
|
||||||
|
let set_y = Box::new(|_| {});
|
||||||
|
let measure = Box::new(|| {});
|
||||||
|
} else {
|
||||||
|
let signal = element.into();
|
||||||
|
let behavior = options.behavior;
|
||||||
|
|
||||||
move |e| {
|
let scroll_to = {
|
||||||
if !is_scrolling.get_untracked() {
|
let signal = signal.clone();
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
set_is_scrolling.set(false);
|
move |x: Option<f64>, y: Option<f64>| {
|
||||||
directions.update(|directions| {
|
let element = signal.get_untracked();
|
||||||
directions.left = false;
|
|
||||||
directions.right = false;
|
|
||||||
directions.top = false;
|
|
||||||
directions.bottom = false;
|
|
||||||
on_stop.clone()(e);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
let throttle = options.throttle;
|
if let Some(element) = element {
|
||||||
|
let element = element.into();
|
||||||
|
|
||||||
let on_scroll_end_debounced =
|
let mut scroll_options = web_sys::ScrollToOptions::new();
|
||||||
use_debounce_fn_with_arg(on_scroll_end.clone(), throttle + options.idle);
|
scroll_options.behavior(behavior.get_untracked().into());
|
||||||
|
|
||||||
let offset = options.offset;
|
if let Some(x) = x {
|
||||||
|
scroll_options.left(x);
|
||||||
|
}
|
||||||
|
if let Some(y) = y {
|
||||||
|
scroll_options.top(y);
|
||||||
|
}
|
||||||
|
|
||||||
let set_arrived_state = move |target: web_sys::Element| {
|
element.scroll_to_with_scroll_to_options(&scroll_options);
|
||||||
let style = window()
|
|
||||||
.get_computed_style(&target)
|
|
||||||
.expect("failed to get computed style");
|
|
||||||
|
|
||||||
if let Some(style) = style {
|
|
||||||
let display = style
|
|
||||||
.get_property_value("display")
|
|
||||||
.expect("failed to get display");
|
|
||||||
let flex_direction = style
|
|
||||||
.get_property_value("flex-direction")
|
|
||||||
.expect("failed to get flex-direction");
|
|
||||||
|
|
||||||
let scroll_left = target.scroll_left() as f64;
|
|
||||||
let scroll_left_abs = scroll_left.abs();
|
|
||||||
|
|
||||||
directions.update(|directions| {
|
|
||||||
directions.left = scroll_left < internal_x.get_untracked();
|
|
||||||
directions.right = scroll_left > internal_x.get_untracked();
|
|
||||||
});
|
|
||||||
|
|
||||||
let left = scroll_left_abs <= offset.left;
|
|
||||||
let right = scroll_left_abs + target.client_width() as f64
|
|
||||||
>= target.scroll_width() as f64 - offset.right - ARRIVED_STATE_THRESHOLD_PIXELS;
|
|
||||||
|
|
||||||
arrived_state.update(|arrived_state| {
|
|
||||||
if display == "flex" && flex_direction == "row-reverse" {
|
|
||||||
arrived_state.left = right;
|
|
||||||
arrived_state.right = left;
|
|
||||||
} else {
|
|
||||||
arrived_state.left = left;
|
|
||||||
arrived_state.right = right;
|
|
||||||
}
|
}
|
||||||
});
|
|
||||||
set_internal_x.set(scroll_left);
|
|
||||||
|
|
||||||
let mut scroll_top = target.scroll_top() as f64;
|
|
||||||
|
|
||||||
// patch for mobile compatibility
|
|
||||||
if target == document().unchecked_into::<web_sys::Element>() && scroll_top == 0.0 {
|
|
||||||
scroll_top = document().body().expect("failed to get body").scroll_top() as f64;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let scroll_top_abs = scroll_top.abs();
|
|
||||||
|
|
||||||
directions.update(|directions| {
|
|
||||||
directions.top = scroll_top < internal_y.get_untracked();
|
|
||||||
directions.bottom = scroll_top > internal_y.get_untracked();
|
|
||||||
});
|
|
||||||
|
|
||||||
let top = scroll_top_abs <= offset.top;
|
|
||||||
let bottom = scroll_top_abs + target.client_height() as f64
|
|
||||||
>= target.scroll_height() as f64 - offset.bottom - ARRIVED_STATE_THRESHOLD_PIXELS;
|
|
||||||
|
|
||||||
// reverse columns and rows behave exactly the other way around,
|
|
||||||
// bottom is treated as top and top is treated as the negative version of bottom
|
|
||||||
arrived_state.update(|arrived_state| {
|
|
||||||
if display == "flex" && flex_direction == "column-reverse" {
|
|
||||||
arrived_state.top = bottom;
|
|
||||||
arrived_state.bottom = top;
|
|
||||||
} else {
|
|
||||||
arrived_state.top = top;
|
|
||||||
arrived_state.bottom = bottom;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
set_internal_y.set(scroll_top);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
let on_scroll_handler = {
|
|
||||||
let on_scroll = Rc::clone(&options.on_scroll);
|
|
||||||
|
|
||||||
move |e: web_sys::Event| {
|
|
||||||
let target: web_sys::Element = event_target(&e);
|
|
||||||
|
|
||||||
set_arrived_state(target);
|
|
||||||
set_is_scrolling.set(true);
|
|
||||||
on_scroll_end_debounced.clone()(e.clone());
|
|
||||||
on_scroll.clone()(e);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
let target = {
|
|
||||||
let signal = signal.clone();
|
|
||||||
|
|
||||||
Signal::derive(move || {
|
|
||||||
let element = signal.get();
|
|
||||||
element.map(|element| element.into().unchecked_into::<web_sys::EventTarget>())
|
|
||||||
})
|
|
||||||
};
|
|
||||||
|
|
||||||
if throttle >= 0.0 {
|
|
||||||
let throttled_scroll_handler = use_throttle_fn_with_arg_and_options(
|
|
||||||
on_scroll_handler.clone(),
|
|
||||||
throttle,
|
|
||||||
ThrottleOptions {
|
|
||||||
trailing: true,
|
|
||||||
leading: false,
|
|
||||||
},
|
|
||||||
);
|
|
||||||
|
|
||||||
let handler = move |e: web_sys::Event| {
|
|
||||||
throttled_scroll_handler.clone()(e);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
let _ = use_event_listener_with_options::<
|
let set_x = {
|
||||||
_,
|
let scroll_to = scroll_to.clone();
|
||||||
Signal<Option<web_sys::EventTarget>>,
|
Box::new(move |x| scroll_to(Some(x), None))
|
||||||
web_sys::EventTarget,
|
};
|
||||||
_,
|
|
||||||
>(
|
|
||||||
target,
|
|
||||||
ev::scroll,
|
|
||||||
handler,
|
|
||||||
options.event_listener_options.clone(),
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
let _ = use_event_listener_with_options::<
|
|
||||||
_,
|
|
||||||
Signal<Option<web_sys::EventTarget>>,
|
|
||||||
web_sys::EventTarget,
|
|
||||||
_,
|
|
||||||
>(
|
|
||||||
target,
|
|
||||||
ev::scroll,
|
|
||||||
on_scroll_handler,
|
|
||||||
options.event_listener_options.clone(),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
let _ = use_event_listener_with_options::<
|
let set_y = Box::new(move |y| scroll_to(None, Some(y)));
|
||||||
_,
|
|
||||||
Signal<Option<web_sys::EventTarget>>,
|
|
||||||
web_sys::EventTarget,
|
|
||||||
_,
|
|
||||||
>(
|
|
||||||
target,
|
|
||||||
scrollend,
|
|
||||||
on_scroll_end,
|
|
||||||
options.event_listener_options,
|
|
||||||
);
|
|
||||||
|
|
||||||
let measure = Box::new(move || {
|
let on_scroll_end = {
|
||||||
let el = signal.get_untracked();
|
let on_stop = Rc::clone(&options.on_stop);
|
||||||
if let Some(el) = el {
|
|
||||||
let el = el.into();
|
move |e| {
|
||||||
set_arrived_state(el);
|
if !is_scrolling.get_untracked() {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
set_is_scrolling.set(false);
|
||||||
|
directions.update(|directions| {
|
||||||
|
directions.left = false;
|
||||||
|
directions.right = false;
|
||||||
|
directions.top = false;
|
||||||
|
directions.bottom = false;
|
||||||
|
on_stop.clone()(e);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
let throttle = options.throttle;
|
||||||
|
|
||||||
|
let on_scroll_end_debounced =
|
||||||
|
use_debounce_fn_with_arg(on_scroll_end.clone(), throttle + options.idle);
|
||||||
|
|
||||||
|
let offset = options.offset;
|
||||||
|
|
||||||
|
let set_arrived_state = move |target: web_sys::Element| {
|
||||||
|
let style = window()
|
||||||
|
.get_computed_style(&target)
|
||||||
|
.expect("failed to get computed style");
|
||||||
|
|
||||||
|
if let Some(style) = style {
|
||||||
|
let display = style
|
||||||
|
.get_property_value("display")
|
||||||
|
.expect("failed to get display");
|
||||||
|
let flex_direction = style
|
||||||
|
.get_property_value("flex-direction")
|
||||||
|
.expect("failed to get flex-direction");
|
||||||
|
|
||||||
|
let scroll_left = target.scroll_left() as f64;
|
||||||
|
let scroll_left_abs = scroll_left.abs();
|
||||||
|
|
||||||
|
directions.update(|directions| {
|
||||||
|
directions.left = scroll_left < internal_x.get_untracked();
|
||||||
|
directions.right = scroll_left > internal_x.get_untracked();
|
||||||
|
});
|
||||||
|
|
||||||
|
let left = scroll_left_abs <= offset.left;
|
||||||
|
let right = scroll_left_abs + target.client_width() as f64
|
||||||
|
>= target.scroll_width() as f64 - offset.right - ARRIVED_STATE_THRESHOLD_PIXELS;
|
||||||
|
|
||||||
|
arrived_state.update(|arrived_state| {
|
||||||
|
if display == "flex" && flex_direction == "row-reverse" {
|
||||||
|
arrived_state.left = right;
|
||||||
|
arrived_state.right = left;
|
||||||
|
} else {
|
||||||
|
arrived_state.left = left;
|
||||||
|
arrived_state.right = right;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
set_internal_x.set(scroll_left);
|
||||||
|
|
||||||
|
let mut scroll_top = target.scroll_top() as f64;
|
||||||
|
|
||||||
|
// patch for mobile compatibility
|
||||||
|
if target == document().unchecked_into::<web_sys::Element>() && scroll_top == 0.0 {
|
||||||
|
scroll_top = document().body().expect("failed to get body").scroll_top() as f64;
|
||||||
|
}
|
||||||
|
|
||||||
|
let scroll_top_abs = scroll_top.abs();
|
||||||
|
|
||||||
|
directions.update(|directions| {
|
||||||
|
directions.top = scroll_top < internal_y.get_untracked();
|
||||||
|
directions.bottom = scroll_top > internal_y.get_untracked();
|
||||||
|
});
|
||||||
|
|
||||||
|
let top = scroll_top_abs <= offset.top;
|
||||||
|
let bottom = scroll_top_abs + target.client_height() as f64
|
||||||
|
>= target.scroll_height() as f64 - offset.bottom - ARRIVED_STATE_THRESHOLD_PIXELS;
|
||||||
|
|
||||||
|
// reverse columns and rows behave exactly the other way around,
|
||||||
|
// bottom is treated as top and top is treated as the negative version of bottom
|
||||||
|
arrived_state.update(|arrived_state| {
|
||||||
|
if display == "flex" && flex_direction == "column-reverse" {
|
||||||
|
arrived_state.top = bottom;
|
||||||
|
arrived_state.bottom = top;
|
||||||
|
} else {
|
||||||
|
arrived_state.top = top;
|
||||||
|
arrived_state.bottom = bottom;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
set_internal_y.set(scroll_top);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
let on_scroll_handler = {
|
||||||
|
let on_scroll = Rc::clone(&options.on_scroll);
|
||||||
|
|
||||||
|
move |e: web_sys::Event| {
|
||||||
|
let target: web_sys::Element = event_target(&e);
|
||||||
|
|
||||||
|
set_arrived_state(target);
|
||||||
|
set_is_scrolling.set(true);
|
||||||
|
on_scroll_end_debounced.clone()(e.clone());
|
||||||
|
on_scroll.clone()(e);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
let target = {
|
||||||
|
let signal = signal.clone();
|
||||||
|
|
||||||
|
Signal::derive(move || {
|
||||||
|
let element = signal.get();
|
||||||
|
element.map(|element| element.into().unchecked_into::<web_sys::EventTarget>())
|
||||||
|
})
|
||||||
|
};
|
||||||
|
|
||||||
|
if throttle >= 0.0 {
|
||||||
|
let throttled_scroll_handler = use_throttle_fn_with_arg_and_options(
|
||||||
|
on_scroll_handler.clone(),
|
||||||
|
throttle,
|
||||||
|
ThrottleOptions {
|
||||||
|
trailing: true,
|
||||||
|
leading: false,
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
let handler = move |e: web_sys::Event| {
|
||||||
|
throttled_scroll_handler.clone()(e);
|
||||||
|
};
|
||||||
|
|
||||||
|
let _ = use_event_listener_with_options::<
|
||||||
|
_,
|
||||||
|
Signal<Option<web_sys::EventTarget>>,
|
||||||
|
web_sys::EventTarget,
|
||||||
|
_,
|
||||||
|
>(
|
||||||
|
target,
|
||||||
|
ev::scroll,
|
||||||
|
handler,
|
||||||
|
options.event_listener_options.clone().unwrap_or_default(),
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
let _ = use_event_listener_with_options::<
|
||||||
|
_,
|
||||||
|
Signal<Option<web_sys::EventTarget>>,
|
||||||
|
web_sys::EventTarget,
|
||||||
|
_,
|
||||||
|
>(
|
||||||
|
target,
|
||||||
|
ev::scroll,
|
||||||
|
on_scroll_handler,
|
||||||
|
options.event_listener_options.clone().unwrap_or_default(),
|
||||||
|
);
|
||||||
}
|
}
|
||||||
});
|
|
||||||
|
let _ = use_event_listener_with_options::<
|
||||||
|
_,
|
||||||
|
Signal<Option<web_sys::EventTarget>>,
|
||||||
|
web_sys::EventTarget,
|
||||||
|
_,
|
||||||
|
>(
|
||||||
|
target,
|
||||||
|
scrollend,
|
||||||
|
on_scroll_end,
|
||||||
|
options.event_listener_options.unwrap_or_default(),
|
||||||
|
);
|
||||||
|
|
||||||
|
let measure = Box::new(move || {
|
||||||
|
let el = signal.get_untracked();
|
||||||
|
if let Some(el) = el {
|
||||||
|
let el = el.into();
|
||||||
|
set_arrived_state(el);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
|
||||||
UseScrollReturn {
|
UseScrollReturn {
|
||||||
x: internal_x.into(),
|
x: internal_x.into(),
|
||||||
|
@ -447,7 +453,8 @@ pub struct UseScrollOptions {
|
||||||
on_stop: Rc<dyn Fn(web_sys::Event)>,
|
on_stop: Rc<dyn Fn(web_sys::Event)>,
|
||||||
|
|
||||||
/// Options passed to the `addEventListener("scroll", ...)` call
|
/// Options passed to the `addEventListener("scroll", ...)` call
|
||||||
event_listener_options: web_sys::AddEventListenerOptions,
|
#[builder(into)]
|
||||||
|
event_listener_options: Option<web_sys::AddEventListenerOptions>,
|
||||||
|
|
||||||
/// When changing the `x` or `y` signals this specifies the scroll behaviour.
|
/// When changing the `x` or `y` signals this specifies the scroll behaviour.
|
||||||
/// Can be `Auto` (= not smooth) or `Smooth`. Defaults to `Auto`.
|
/// Can be `Auto` (= not smooth) or `Smooth`. Defaults to `Auto`.
|
||||||
|
|
|
@ -154,7 +154,6 @@ pub fn use_websocket_with_options(
|
||||||
|
|
||||||
connect_ref.set_value({
|
connect_ref.set_value({
|
||||||
let ws = ws_ref.get_value();
|
let ws = ws_ref.get_value();
|
||||||
let url = url;
|
|
||||||
let unmounted = Rc::clone(&unmounted);
|
let unmounted = Rc::clone(&unmounted);
|
||||||
|
|
||||||
Some(Rc::new(move || {
|
Some(Rc::new(move || {
|
||||||
|
|
Loading…
Add table
Reference in a new issue