From 82e7655d146c3d92df81f15901f967b4b3169a63 Mon Sep 17 00:00:00 2001 From: Maccesch Date: Thu, 5 Sep 2024 00:54:08 +0100 Subject: [PATCH 1/2] `use_websocket` now returns a signal for the websocket instance --- CHANGELOG.md | 7 +++++++ Cargo.toml | 2 +- src/use_websocket.rs | 20 ++++++++++---------- 3 files changed, 18 insertions(+), 11 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index ab33695..cbe9c4d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,13 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## [0.13.4] - 2024-09-05 + +### Fix ๐Ÿ• + +- `use_websocket` now returns a signal for the websocket instance so the user can actually use it. Before it always + returned `None`. + ## [0.13.3] - 2024-09-02 ### Fix ๐Ÿ• diff --git a/Cargo.toml b/Cargo.toml index 449515f..cc4fd30 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -1,6 +1,6 @@ [package] name = "leptos-use" -version = "0.13.3" +version = "0.13.4" edition = "2021" authors = ["Marc-Stefan Cassola"] categories = ["gui", "web-programming"] diff --git a/src/use_websocket.rs b/src/use_websocket.rs index ea9ce38..25473fc 100644 --- a/src/use_websocket.rs +++ b/src/use_websocket.rs @@ -287,7 +287,7 @@ where let (ready_state, set_ready_state) = create_signal(ConnectionReadyState::Closed); let (message, set_message) = create_signal(None); - let ws_ref: StoredValue> = store_value(None); + let ws_signal = RwSignal::new(None::); let reconnect_timer_ref: StoredValue> = store_value(None); @@ -309,8 +309,8 @@ where if !manually_closed_ref.get_value() && !reconnect_limit.is_exceeded_by(reconnect_times_ref.get_value()) - && ws_ref - .get_value() + && ws_signal + .get_untracked() .map_or(false, |ws: WebSocket| ws.ready_state() != WebSocket::OPEN) { reconnect_timer_ref.set_value( @@ -339,7 +339,7 @@ where Some(Rc::new(move || { reconnect_timer_ref.set_value(None); - if let Some(web_socket) = ws_ref.get_value() { + if let Some(web_socket) = ws_signal.get_untracked() { let _ = web_socket.close(); } @@ -533,7 +533,7 @@ where onclose_closure.forget(); } - ws_ref.set_value(Some(web_socket)); + ws_signal.set(Some(web_socket)); })) }); } @@ -542,7 +542,7 @@ where let send_str = { Box::new(move |data: &str| { if ready_state.get_untracked() == ConnectionReadyState::Open { - if let Some(web_socket) = ws_ref.get_value() { + if let Some(web_socket) = ws_signal.get_untracked() { let _ = web_socket.send_with_str(data); } } @@ -552,7 +552,7 @@ where // Send bytes let send_bytes = move |data: &[u8]| { if ready_state.get_untracked() == ConnectionReadyState::Open { - if let Some(web_socket) = ws_ref.get_value() { + if let Some(web_socket) = ws_signal.get_untracked() { let _ = web_socket.send_with_u8_array(data); } } @@ -590,7 +590,7 @@ where move || { manually_closed_ref.set_value(true); - if let Some(web_socket) = ws_ref.get_value() { + if let Some(web_socket) = ws_signal.get_untracked() { let _ = web_socket.close(); } } @@ -612,7 +612,7 @@ where UseWebSocketReturn { ready_state: ready_state.into(), message: message.into(), - ws: ws_ref.get_value(), + ws: ws_signal.into(), open, close, send, @@ -717,7 +717,7 @@ where /// Latest message received from `WebSocket`. pub message: Signal>, /// The `WebSocket` instance. - pub ws: Option, + pub ws: Signal>, /// Opens the `WebSocket` connection pub open: OpenFn, /// Closes the `WebSocket` connection From 10b1a8a0e869943f997b0b90a20d8cfd42e85bcb Mon Sep 17 00:00:00 2001 From: Maccesch Date: Sun, 15 Sep 2024 20:41:51 +0200 Subject: [PATCH 2/2] added use_textarea_autosize --- .idea/leptos-use.iml | 1 + CHANGELOG.md | 6 + Cargo.toml | 9 +- README.md | 2 +- docs/book/src/SUMMARY.md | 1 + .../book/src/browser/use_textarea_autosize.md | 3 + docs/book/src/demo.css | 4 +- docs/book/src/introduction.md | 2 +- examples/Cargo.toml | 1 + examples/use_textarea_autosize/Cargo.toml | 16 + examples/use_textarea_autosize/README.md | 23 ++ examples/use_textarea_autosize/Trunk.toml | 2 + examples/use_textarea_autosize/index.html | 7 + examples/use_textarea_autosize/input.css | 3 + .../use_textarea_autosize/rust-toolchain.toml | 2 + examples/use_textarea_autosize/src/main.rs | 34 ++ .../use_textarea_autosize/style/output.css | 342 +++++++++++++++++ .../use_textarea_autosize/tailwind.config.js | 15 + src/lib.rs | 4 + src/use_textarea_autosize.rs | 345 ++++++++++++++++++ src/use_user_media.rs | 16 +- 21 files changed, 828 insertions(+), 10 deletions(-) create mode 100644 docs/book/src/browser/use_textarea_autosize.md create mode 100644 examples/use_textarea_autosize/Cargo.toml create mode 100644 examples/use_textarea_autosize/README.md create mode 100644 examples/use_textarea_autosize/Trunk.toml create mode 100644 examples/use_textarea_autosize/index.html create mode 100644 examples/use_textarea_autosize/input.css create mode 100644 examples/use_textarea_autosize/rust-toolchain.toml create mode 100644 examples/use_textarea_autosize/src/main.rs create mode 100644 examples/use_textarea_autosize/style/output.css create mode 100644 examples/use_textarea_autosize/tailwind.config.js create mode 100644 src/use_textarea_autosize.rs diff --git a/.idea/leptos-use.iml b/.idea/leptos-use.iml index 5009c87..97c56da 100644 --- a/.idea/leptos-use.iml +++ b/.idea/leptos-use.iml @@ -85,6 +85,7 @@ + diff --git a/CHANGELOG.md b/CHANGELOG.md index cbe9c4d..c167929 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,12 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## [0.13.5] - 2024-09-15 + +### New Function ๐Ÿš€ + +- `use_textarea_autosize` + ## [0.13.4] - 2024-09-05 ### Fix ๐Ÿ• diff --git a/Cargo.toml b/Cargo.toml index cc4fd30..5d66528 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -1,6 +1,6 @@ [package] name = "leptos-use" -version = "0.13.4" +version = "0.13.5" edition = "2021" authors = ["Marc-Stefan Cassola"] categories = ["gui", "web-programming"] @@ -48,6 +48,7 @@ unic-langid = { version = "0.9", features = ["macros"] } [features] default = [ + "use_textarea_autosize", "use_web_lock", "use_window_size", "is_err", @@ -122,6 +123,12 @@ default = [ "watch_with_options", "whenever" ] +use_textarea_autosize = [ + "use_resize_observer", + "web-sys/CssStyleDeclaration", + "web-sys/HtmlElement", + "web-sys/HtmlTextAreaElement", +] use_web_lock = [ "web-sys/AbortSignal", "web-sys/Lock", diff --git a/README.md b/README.md index c519d8e..013d6a9 100644 --- a/README.md +++ b/README.md @@ -13,7 +13,7 @@ Crates.io SSR Docs & Demos - 86 Functions + 87 Functions


diff --git a/docs/book/src/SUMMARY.md b/docs/book/src/SUMMARY.md index db94782..4f3831f 100644 --- a/docs/book/src/SUMMARY.md +++ b/docs/book/src/SUMMARY.md @@ -51,6 +51,7 @@ - [use_preferred_dark](browser/use_preferred_dark.md) - [use_prefers_reduced_motion](browser/use_prefers_reduced_motion.md) - [use_service_worker](browser/use_service_worker.md) +- [use_textarea_autosize](browser/use_textarea_autosize.md) - [use_user_media](browser/use_user_media.md) - [use_web_lock](browser/use_web_lock.md) - [use_web_notification](browser/use_web_notification.md) diff --git a/docs/book/src/browser/use_textarea_autosize.md b/docs/book/src/browser/use_textarea_autosize.md new file mode 100644 index 0000000..f3d85fd --- /dev/null +++ b/docs/book/src/browser/use_textarea_autosize.md @@ -0,0 +1,3 @@ +# use_textarea_autosize + + diff --git a/docs/book/src/demo.css b/docs/book/src/demo.css index f092756..b93d1f0 100644 --- a/docs/book/src/demo.css +++ b/docs/book/src/demo.css @@ -79,7 +79,8 @@ .demo-container input[type="text"], .demo-container input[type="search"], -.demo-container input[type="number"] { +.demo-container input[type="number"], +.demo-container textarea { display: block; font-size: 90%; padding: .5em 1em .4em; @@ -96,6 +97,7 @@ .demo-container textarea { background: var(--bg); border: 1px solid var(--theme-popup-border); + line-height: 1.5; } .demo-container input[type=range], diff --git a/docs/book/src/introduction.md b/docs/book/src/introduction.md index 25cf3d5..0f35066 100644 --- a/docs/book/src/introduction.md +++ b/docs/book/src/introduction.md @@ -12,6 +12,6 @@ Crates.io SSR Docs & Demos - 86 Functions + 87 Functions

\ No newline at end of file diff --git a/examples/Cargo.toml b/examples/Cargo.toml index aeb73f4..d894aa8 100644 --- a/examples/Cargo.toml +++ b/examples/Cargo.toml @@ -55,6 +55,7 @@ members = [ "use_service_worker", "use_sorted", "use_storage", + "use_textarea_autosize", "use_throttle_fn", "use_timeout_fn", "use_timestamp", diff --git a/examples/use_textarea_autosize/Cargo.toml b/examples/use_textarea_autosize/Cargo.toml new file mode 100644 index 0000000..85cf3d0 --- /dev/null +++ b/examples/use_textarea_autosize/Cargo.toml @@ -0,0 +1,16 @@ +[package] +name = "use_textarea_autosize" +version = "0.1.0" +edition = "2021" + +[dependencies] +leptos = { version = "0.6", features = ["nightly", "csr"] } +console_error_panic_hook = "0.1" +console_log = "1" +log = "0.4" +leptos-use = { path = "../..", features = ["use_textarea_autosize", "docs"] } +web-sys = "0.3" + +[dev-dependencies] +wasm-bindgen = "0.2" +wasm-bindgen-test = "0.3.0" diff --git a/examples/use_textarea_autosize/README.md b/examples/use_textarea_autosize/README.md new file mode 100644 index 0000000..687cd72 --- /dev/null +++ b/examples/use_textarea_autosize/README.md @@ -0,0 +1,23 @@ +A simple example for `use_textarea_autosize`. + +If you don't have it installed already, install [Trunk](https://trunkrs.dev/) and [Tailwind](https://tailwindcss.com/docs/installation) +as well as the nightly toolchain for Rust and the wasm32-unknown-unknown target: + +```bash +cargo install trunk +npm install -D tailwindcss @tailwindcss/forms +rustup toolchain install nightly +rustup target add wasm32-unknown-unknown +``` + +Then, open two terminals. In the first one, run: + +``` +npx tailwindcss -i ./input.css -o ./style/output.css --watch +``` + +In the second one, run: + +```bash +trunk serve --open +``` \ No newline at end of file diff --git a/examples/use_textarea_autosize/Trunk.toml b/examples/use_textarea_autosize/Trunk.toml new file mode 100644 index 0000000..3e4be08 --- /dev/null +++ b/examples/use_textarea_autosize/Trunk.toml @@ -0,0 +1,2 @@ +[build] +public_url = "/demo/" \ No newline at end of file diff --git a/examples/use_textarea_autosize/index.html b/examples/use_textarea_autosize/index.html new file mode 100644 index 0000000..ae249a6 --- /dev/null +++ b/examples/use_textarea_autosize/index.html @@ -0,0 +1,7 @@ + + + + + + + diff --git a/examples/use_textarea_autosize/input.css b/examples/use_textarea_autosize/input.css new file mode 100644 index 0000000..b5c61c9 --- /dev/null +++ b/examples/use_textarea_autosize/input.css @@ -0,0 +1,3 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; diff --git a/examples/use_textarea_autosize/rust-toolchain.toml b/examples/use_textarea_autosize/rust-toolchain.toml new file mode 100644 index 0000000..271800c --- /dev/null +++ b/examples/use_textarea_autosize/rust-toolchain.toml @@ -0,0 +1,2 @@ +[toolchain] +channel = "nightly" \ No newline at end of file diff --git a/examples/use_textarea_autosize/src/main.rs b/examples/use_textarea_autosize/src/main.rs new file mode 100644 index 0000000..54be776 --- /dev/null +++ b/examples/use_textarea_autosize/src/main.rs @@ -0,0 +1,34 @@ +use leptos::*; +use leptos_use::docs::demo_or_body; +use leptos_use::{use_textarea_autosize, UseTextareaAutosizeReturn}; + +#[component] +fn Demo() -> impl IntoView { + let textarea = create_node_ref::(); + + let UseTextareaAutosizeReturn { + content, + set_content, + .. + } = use_textarea_autosize(textarea); + + view! { +
Type, the textarea will grow:
+