Merge branch 'main' into leptos-0.7

# Conflicts: # CHANGELOG.md # Cargo.toml # src/use_user_media.rs # src/use_websocket.rs
Synphonyte · Sep 15, 2024 · 406b7b2 · 406b7b2
2 parents 68fd2d7 + 10b1a8a
commit 406b7b2
Show file tree

Hide file tree

Showing 22 changed files with 846 additions and 21 deletions.
diff --git a/.idea/leptos-use.iml b/.idea/leptos-use.iml
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -22,6 +22,19 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 Ported everything to Leptos 0.7
 Some example don't run yet.
 
+## [0.13.5] - 2024-09-15
+
+### New Function 🚀
+
+- `use_textarea_autosize`
+
+## [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
@@ -27,8 +27,8 @@ http0_2 = { version = "0.2", optional = true, package = "http" }
 js-sys = "0.3"
 lazy_static = "1"
 leptos = "0.7.0-beta5"
-leptos_axum = { optional = true, version = "0.7.0-beta5" }
-leptos_actix = { optional = true, version = "0.7.0-beta5" }
+leptos_axum = { version = "0.7.0-beta5", optional = true, }
+leptos_actix = { version = "0.7.0-beta5", optional = true }
 leptos-spin = { version = "0.2", optional = true }
 num = { version = "0.4", optional = true }
 paste = "1"
@@ -54,6 +54,7 @@ unic-langid = { version = "0.9", features = ["macros"] }
 
 [features]
 default = [
+    "use_textarea_autosize",
     "use_web_lock",
     "use_window_size",
     "is_err",
@@ -128,6 +129,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
@@ -13,7 +13,7 @@
     <a href="https://crates.io/crates/leptos-use"><img src="https://img.shields.io/crates/v/leptos-use.svg?label=&color=%232C1275" alt="Crates.io"/></a>
     <a href="https://leptos-use.rs/server_side_rendering.html"><img src="https://img.shields.io/badge/-SSR-%236a214b" alt="SSR"></a> 
     <a href="https://leptos-use.rs"><img src="https://img.shields.io/badge/-docs%20%26%20demos-%239A233F" alt="Docs & Demos"></a> 
-    <a href="https://leptos-use.rs"><img src="https://img.shields.io/badge/-86%20functions-%23EF3939" alt="86 Functions" /></a>
+    <a href="https://leptos-use.rs"><img src="https://img.shields.io/badge/-87%20functions-%23EF3939" alt="87 Functions" /></a>
 </p>
 
 <br/>

diff --git 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
@@ -0,0 +1,3 @@
+# use_textarea_autosize
+
+<!-- cmdrun python3 ../extract_doc_comment.py use_textarea_autosize use_textarea_autosize -->
diff --git 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
@@ -12,6 +12,6 @@
     <a href="https://crates.io/crates/leptos-use"><img src="https://img.shields.io/crates/v/leptos-use.svg?label=&color=%232C1275" alt="Crates.io"/></a>
     <a href="https://leptos-use.rs/server_side_rendering.html"><img src="https://img.shields.io/badge/-SSR-%236a214b" alt="SSR"></a> 
     <a href="./get_started.html"><img src="https://img.shields.io/badge/-docs%20%26%20demos-%239A233F" alt="Docs & Demos"></a> 
-    <a href="./functions.html"><img src="https://img.shields.io/badge/-86%20functions-%23EF3939" alt="86 Functions" /></a>
+    <a href="./functions.html"><img src="https://img.shields.io/badge/-87%20functions-%23EF3939" alt="87 Functions" /></a>
 </p>
 </div>
diff --git a/examples/Cargo.toml b/examples/Cargo.toml
@@ -52,6 +52,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
@@ -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
@@ -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
+```
diff --git a/examples/use_textarea_autosize/Trunk.toml b/examples/use_textarea_autosize/Trunk.toml
@@ -0,0 +1,2 @@
+[build]
+public_url = "/demo/"
diff --git a/examples/use_textarea_autosize/index.html b/examples/use_textarea_autosize/index.html
@@ -0,0 +1,7 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <link data-trunk rel="css" href="style/output.css">
+  </head>
+  <body></body>
+</html>
diff --git a/examples/use_textarea_autosize/input.css 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
@@ -0,0 +1,2 @@
+[toolchain]
+channel = "nightly"
diff --git a/examples/use_textarea_autosize/src/main.rs 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::<html::Textarea>();
+
+    let UseTextareaAutosizeReturn {
+        content,
+        set_content,
+        ..
+    } = use_textarea_autosize(textarea);
+
+    view! {
+        <div class="mb-4">Type, the textarea will grow:</div>
+        <textarea
+            value=content
+            on:input=move |evt| set_content.set(event_target_value(&evt))
+            node_ref=textarea
+            class="resize-none box-border"
+            placeholder="What's on your mind?"
+        />
+    }
+}
+
+fn main() {
+    _ = console_log::init_with_level(log::Level::Debug);
+    console_error_panic_hook::set_once();
+
+    mount_to(demo_or_body(), || {
+        view! { <Demo /> }
+    })
+}