Merge remote-tracking branch 'upstream/master' into contributing-md

.github/ISSUE_TEMPLATE/config.yml

@@ -4,4 +4,3 @@ contact_links:
   - name: Ask a question
     url: https://discord.gg/vDwFUmm6mU
     about: Need a quick answer? Join us on the official Discord server.
-

.github/workflows/bench.yml

@@ -6,7 +6,7 @@ jobs:
   bench:
     name: Bench
     runs-on: ubuntu-latest
-    
+
     steps:
       - name: Setup Rust
         uses: actions-rs/toolchain@v1

.github/workflows/build_website.yml

@@ -67,7 +67,7 @@ jobs:
               trunk build --release --dist "$dist_dir" --public-url "/examples/$example"
             )
           done
-          
+
       - name: Build rustdocs
         run: |
           cd packages/sycamore && cargo doc --no-deps --all-features

.github/workflows/js_framework_bench.yml

@@ -64,7 +64,7 @@ jobs:
 
       - name: Configure benchmarks
         run: node ./sycamore/packages/tools/configure_bench.js
-      
+
       - name: Benchmark list
         run: |
           ls ./js-framework-benchmark/frameworks/keyed
@@ -111,13 +111,12 @@ jobs:
           echo "$results"
           mkdir bench-results
           echo "$results" &> bench-results/BENCH_RESULTS.txt
-      
+
       - name: Log PR number
         env:
           PR_NUMBER: ${{ github.event.number }}
         run: echo "$PR_NUMBER" &> bench-results/PR_NUMBER.txt
-
-
+
       - name: Upload bench diff
         uses: actions/upload-artifact@v3
         with:

.github/workflows/post_js_framework_bench.yml

@@ -17,31 +17,31 @@ jobs:
         *Adding new commits will generate a new report*
 
     steps:
-    - name: Download artifact
-      id: download-artifact
-      uses: dawidd6/action-download-artifact@v2
-      with:
-        github_token: ${{ secrets.GITHUB_TOKEN }}
-        workflow: js_framework_bench.yml
-        run_id: ${{ github.event.workflow_run.id }}
-        name: bench-results
-        path: bench-results/
+      - name: Download artifact
+        id: download-artifact
+        uses: dawidd6/action-download-artifact@v2
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          workflow: js_framework_bench.yml
+          run_id: ${{ github.event.workflow_run.id }}
+          name: bench-results
+          path: bench-results/
 
-    - name: Post results
-      uses: actions/github-script@v6
-      with:
-        script: |
-          const fs = require('fs');
-          const path = require('path');
-          const benchResults = fs.readFileSync('bench-results/BENCH_RESULTS.txt', 'utf8');
-          const prNumber = fs.readFileSync('bench-results/PR_NUMBER.txt', 'utf8');
+      - name: Post results
+        uses: actions/github-script@v6
+        with:
+          script: |
+            const fs = require('fs');
+            const path = require('path');
+            const benchResults = fs.readFileSync('bench-results/BENCH_RESULTS.txt', 'utf8');
+            const prNumber = fs.readFileSync('bench-results/PR_NUMBER.txt', 'utf8');
 
-          console.log(benchResults);
-          console.log("PR number", prNumber);
+            console.log(benchResults);
+            console.log("PR number", prNumber);
 
-          github.rest.issues.createComment({
-            issue_number: prNumber,
-            owner: context.repo.owner,
-            repo: context.repo.repo,
-            body: benchResults + process.env.MSG_FOOTER,
-          });
+            github.rest.issues.createComment({
+              issue_number: prNumber,
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              body: benchResults + process.env.MSG_FOOTER,
+            });

CODE_OF_CONDUCT.md

@@ -14,22 +14,22 @@ appearance, race, religion, or sexual identity and orientation.
 Examples of behavior that contributes to creating a positive environment
 include:
 
-* Using welcoming and inclusive language
-* Being respectful of differing viewpoints and experiences
-* Gracefully accepting constructive criticism
-* Focusing on what is best for the community
-* Showing empathy towards other community members
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
 
 Examples of unacceptable behavior by participants include:
 
-* The use of sexualized language or imagery and unwelcome sexual attention or
- advances
-* Trolling, insulting/derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or electronic
- address, without explicit permission
-* Other conduct which could reasonably be considered inappropriate in a
- professional setting
+- The use of sexualized language or imagery and unwelcome sexual attention or
+  advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic
+  address, without explicit permission
+- Other conduct which could reasonably be considered inappropriate in a
+  professional setting
 
 ## Our Responsibilities
 

README.md

@@ -1,107 +1,108 @@
-<div align="center">
-  <img src="https://user-images.githubusercontent.com/37006668/210620713-562cda3d-9eaa-40c6-a22a-e5d9bd11b425.svg" width="200" />
-
-  <h1>Sycamore</h1>
-</div>
-<div align="center">
-
-[![Crates.io](https://img.shields.io/crates/v/sycamore)](https://crates.io/crates/sycamore)
-[![docs.rs](https://img.shields.io/docsrs/sycamore?color=blue&label=docs.rs)](https://docs.rs/sycamore)
-[![GitHub contributors](https://img.shields.io/github/contributors/sycamore-rs/sycamore)](https://github.com/sycamore-rs/sycamore/graphs/contributors)
-[![Discord](https://img.shields.io/discord/820400041332179004?label=discord)](https://discord.gg/vDwFUmm6mU)
-</div>
-
-Sycamore is a _reactive_ library for creating web apps in **Rust** and **WebAssembly**.
-
-```rust
-#[component]
-fn Hello<G: Html>() -> View<G> {
-    view! { 
-        p { "Hello World!" }
-    }
-}
-```
-
-- **Lightning Speed**: Sycamore harnesses the full power of [Rust](https://www.rust-lang.org/) via
-  [WebAssembly](https://webassembly.org/), giving you full control over performance.
-- **Ergonomic and Intuitive**: Write code that feels natural. Everything is built on
-  [reactive primitives](https://sycamore-rs.netlify.app/docs/basics/reactivity) without a cumbersome
-  virtual DOM.
-- **No JavaScript**: Had enough of JavaScript? So have we. Create apps using Sycamore without
-  touching a single line of JS.
-
-## Documentation
-
-Sycamore is extensively documented:
-
-- [Getting Started](https://sycamore-rs.netlify.app/docs/getting_started/installation): How to write
-  your first Sycamore app.
-- [Reactivity](https://sycamore-rs.netlify.app/docs/basics/reactivity): Find out how to use
-  Sycamore's powerful reactive primitives.
-- [API Documentation](https://docs.rs/sycamore): rustdocs for the `sycamore` crate.
-
-**Still have questions?** Don't hesitate to stop by our friendly
-[Discord server](https://discord.gg/vDwFUmm6mU).
-
-## Examples
-
-Sycamore has many examples for your reference in the
-[`examples/`](https://github.com/sycamore-rs/sycamore/tree/master/examples) directory. Be sure to
-check them out!
-
-### Viewing on `sycamore-rs.netlify.app`
-
-All the examples are hosted under `sycamore-rs.netlify.app/examples/<example_name>` with
-`<example_name>` being the name of the example you want to view. For instance, the `todomvc` example
-is hosted on
-[`sycamore-rs.netlify.app/examples/todomvc`](https://sycamore-rs.netlify.app/examples/todomvc).
-
-### Building Locally
-
-All the examples can also be built locally using [Trunk](https://trunkrs.dev). For instance, the
-following command builds and serves the `todomvc` example:
-
-```bash
-cd examples/todomvc
-trunk serve
-```
-
-Now open up `localhost:8080` in your browser to see "Hello World!".
-
-## Perseus
-
-[Perseus](https://github.com/arctic-hen7/perseus) is a fullstack framework built with Sycamore.
-Think [NextJS](https://nextjs.org) or [SvelteKit](https://kit.svelte.dev) but with no JavaScript.
-Everything from backend to frontend is built with pure Rust!
-
-## Alternatives?
-
-Don't think Sycamore is for you? Thankfully, there are plenty of alternatives!
-
-- **[SolidJS](https://github.com/solidjs/solid): A declarative, efficient and flexible JavaScript
-  library for building user interfaces** <br /> Solid is a JavaScript library which greatly inspired
-  Sycamore. Many concepts such as fine-grained reactivity and components as factory functions were
-  borrowed from Solid. If you don't mind working with JavaScript (or TypeScript), go check it out!
-- **[Yew](https://github.com/yewstack/yew): Rust / Wasm framework for building client web apps**
-  <br /> Yew was also a big inspiration for Sycamore. Yew employs a VDOM and has a MVU (Elm)
-  architecture. If you think that's for you, take a look!
-- **[MoonZoon](https://github.com/MoonZoon/MoonZoon): Rust Fullstack Framework** <br /> MoonZoon
-  also champions the no VDOM paradigm and uses [dominator](https://github.com/Pauan/rust-dominator)
-  as its underlying DOM layer. MoonZoon is a fullstack framework making it easier to combine
-  frontend and backend code with minimal boilerplate.
-
-## Contributing
-
-- Report issues on our [issue tracker](https://github.com/sycamore-rs/sycamore/issues).
-- We love Pull Requests! For more information, check out the
-  [section on contributing](https://sycamore-rs.netlify.app/docs/contribute/architecture) in the
-  docs.
-
-Sycamore would not have been possible without the wonderful contributions from the community. Thank
-you!
-
-<a href="https://github.com/sycamore-rs/sycamore/graphs/contributors">
-  <img src="https://contrib.rocks/image?repo=sycamore-rs/sycamore" />
-</a>
-
-Special thanks to [@nate-sys](https://github.com/nate-sys) for designing the Sycamore logo!
+<div align="center">
+  <img src="https://user-images.githubusercontent.com/37006668/210620713-562cda3d-9eaa-40c6-a22a-e5d9bd11b425.svg" width="200" />
+
+  <h1>Sycamore</h1>
+</div>
+<div align="center">
+
+[![Crates.io](https://img.shields.io/crates/v/sycamore)](https://crates.io/crates/sycamore)
+[![docs.rs](https://img.shields.io/docsrs/sycamore?color=blue&label=docs.rs)](https://docs.rs/sycamore)
+[![GitHub contributors](https://img.shields.io/github/contributors/sycamore-rs/sycamore)](https://github.com/sycamore-rs/sycamore/graphs/contributors)
+[![Discord](https://img.shields.io/discord/820400041332179004?label=discord)](https://discord.gg/vDwFUmm6mU)
+
+</div>
+
+Sycamore is a _reactive_ library for creating web apps in **Rust** and **WebAssembly**.
+
+```rust
+#[component]
+fn Hello<G: Html>() -> View<G> {
+    view! {
+        p { "Hello World!" }
+    }
+}
+```
+
+- **Lightning Speed**: Sycamore harnesses the full power of [Rust](https://www.rust-lang.org/) via
+  [WebAssembly](https://webassembly.org/), giving you full control over performance.
+- **Ergonomic and Intuitive**: Write code that feels natural. Everything is built on
+  [reactive primitives](https://sycamore-rs.netlify.app/docs/basics/reactivity) without a cumbersome
+  virtual DOM.
+- **No JavaScript**: Had enough of JavaScript? So have we. Create apps using Sycamore without
+  touching a single line of JS.
+
+## Documentation
+
+Sycamore is extensively documented:
+
+- [Getting Started](https://sycamore-rs.netlify.app/docs/getting_started/installation): How to write
+  your first Sycamore app.
+- [Reactivity](https://sycamore-rs.netlify.app/docs/basics/reactivity): Find out how to use
+  Sycamore's powerful reactive primitives.
+- [API Documentation](https://docs.rs/sycamore): rustdocs for the `sycamore` crate.
+
+**Still have questions?** Don't hesitate to stop by our friendly
+[Discord server](https://discord.gg/vDwFUmm6mU).
+
+## Examples
+
+Sycamore has many examples for your reference in the
+[`examples/`](https://github.com/sycamore-rs/sycamore/tree/master/examples) directory. Be sure to
+check them out!
+
+### Viewing on `sycamore-rs.netlify.app`
+
+All the examples are hosted under `sycamore-rs.netlify.app/examples/<example_name>` with
+`<example_name>` being the name of the example you want to view. For instance, the `todomvc` example
+is hosted on
+[`sycamore-rs.netlify.app/examples/todomvc`](https://sycamore-rs.netlify.app/examples/todomvc).
+
+### Building Locally
+
+All the examples can also be built locally using [Trunk](https://trunkrs.dev). For instance, the
+following command builds and serves the `todomvc` example:
+
+```bash
+cd examples/todomvc
+trunk serve
+```
+
+Now open up `localhost:8080` in your browser to see "Hello World!".
+
+## Perseus
+
+[Perseus](https://github.com/arctic-hen7/perseus) is a fullstack framework built with Sycamore.
+Think [NextJS](https://nextjs.org) or [SvelteKit](https://kit.svelte.dev) but with no JavaScript.
+Everything from backend to frontend is built with pure Rust!
+
+## Alternatives?
+
+Don't think Sycamore is for you? Thankfully, there are plenty of alternatives!
+
+- **[SolidJS](https://github.com/solidjs/solid): A declarative, efficient and flexible JavaScript
+  library for building user interfaces** <br /> Solid is a JavaScript library which greatly inspired
+  Sycamore. Many concepts such as fine-grained reactivity and components as factory functions were
+  borrowed from Solid. If you don't mind working with JavaScript (or TypeScript), go check it out!
+- **[Yew](https://github.com/yewstack/yew): Rust / Wasm framework for building client web apps**
+  <br /> Yew was also a big inspiration for Sycamore. Yew employs a VDOM and has a MVU (Elm)
+  architecture. If you think that's for you, take a look!
+- **[MoonZoon](https://github.com/MoonZoon/MoonZoon): Rust Fullstack Framework** <br /> MoonZoon
+  also champions the no VDOM paradigm and uses [dominator](https://github.com/Pauan/rust-dominator)
+  as its underlying DOM layer. MoonZoon is a fullstack framework making it easier to combine
+  frontend and backend code with minimal boilerplate.
+
+## Contributing
+
+- Report issues on our [issue tracker](https://github.com/sycamore-rs/sycamore/issues).
+- We love Pull Requests! For more information, check out the
+  [section on contributing](https://sycamore-rs.netlify.app/docs/contribute/architecture) in the
+  docs.
+
+Sycamore would not have been possible without the wonderful contributions from the community. Thank
+you!
+
+<a href="https://github.com/sycamore-rs/sycamore/graphs/contributors">
+  <img src="https://contrib.rocks/image?repo=sycamore-rs/sycamore" />
+</a>
+
+Special thanks to [@nate-sys](https://github.com/nate-sys) for designing the Sycamore logo!

docs/next/advanced/attributes_prop.md

@@ -18,7 +18,7 @@ struct Props {
 and then "spread" the attributes onto an HTML element.
 
 ```rust
-view! { 
+view! {
     p(..props.attributes) { "Hello World!" }
 }
 ```
@@ -31,7 +31,7 @@ The user can set attributes by prefixing them with `attr:`. Event handlers or bi
 automatically passed through.
 
 ```rust
-view! { 
+view! {
     AccessibleLabel(attr:class = "bg-neutral-800 rounded", on:click = label_clicked) { "Label 1" }
 }
 ```

docs/next/advanced/contexts.md

@@ -61,7 +61,7 @@ fn ChildComponent<G: Html>() -> View<G> {
 
 let dark_mode = create_signal(DarkMode(false));
 provide_context_ref(dark_mode);
-view! { 
+view! {
     ChildComponent {}
 }
 ```

docs/next/advanced/noderef.md

@@ -9,7 +9,7 @@ using the `ref` property in the `view!` macro.
 ```rust
 let node_ref = create_node_ref();
 
-view! { 
+view! {
     p(ref=node_ref) { "Hello World!" }
 }
 ```