fix most typos, add crate-ci/typos to CI (#2653)

* fix most typos, add crate-ci/typos to CI

---------

Co-authored-by: Jonathan Kelley <jkelleyrtp@gmail.com>

.github/workflows/main.yml

@@ -118,6 +118,14 @@ jobs:
           save-if: ${{ github.ref == 'refs/heads/main' }}
       - run: cargo fmt --all -- --check
   
+  typos:
+    if: github.event.pull_request.draft == false
+    name: Check for typos
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Check for typos
+        uses: crate-ci/typos@master
   clippy:
     if: github.event.pull_request.draft == false
     name: Clippy

_typos.toml

@@ -0,0 +1,10 @@
+[default.extend-words]
+# https://ratatui.rs/
+ratatui = "ratatui"
+# lits is short for literals
+lits = "lits"
+# https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/seeked_event
+seeked = "seeked"
+
+[files]
+extend-exclude = ["translations/*", "CHANGELOG.md", "*.js"]

examples/PWA-example/public/sw.js

@@ -137,7 +137,7 @@ self.addEventListener("fetch", function (event) {
              - You should also consider the origin. It's easier to decide what
                "unavailable" means for requests against your origins than for requests
                against a third party, such as an ad provider.
-             - Generate a Response programmaticaly, as shown below, and return that.
+             - Generate a Response programmatically, as shown below, and return that.
           */
 
           //console.log('WORKER: fetch request failed in both cache and network.');

examples/counters.rs

@@ -12,7 +12,7 @@ fn app() -> Element {
     // Store the counters in a signal
     let mut counters = use_signal(|| vec![0, 0, 0]);
 
-    // Whenver the counters change, sum them up
+    // Whenever the counters change, sum them up
     let sum = use_memo(move || counters.read().iter().copied().sum::<i32>());
 
     rsx! {

examples/crm.rs

@@ -7,7 +7,7 @@
 //! in a way that works across pages.
 //!
 //! We implement a number of important details here too, like focusing inputs, handling form submits, navigating the router,
-//! platform-specific configuration, and importing 3rd party CSS libaries.
+//! platform-specific configuration, and importing 3rd party CSS libraries.
 
 use dioxus::prelude::*;
 

examples/flat_router.rs

@@ -1,5 +1,5 @@
 //! This example shows how to use the `Router` component to create a simple navigation system.
-//! The more complex router example uses all of the router features, while this simple exmaple showcases
+//! The more complex router example uses all of the router features, while this simple example showcases
 //! just the `Layout` and `Route` features.
 //!
 //! Layouts let you wrap chunks of your app with a component. This is useful for things like a footers, heeaders, etc.

examples/form.rs

@@ -37,7 +37,7 @@ fn app() -> Element {
 
                     // On desktop/liveview, the form will not navigate the page - the expectation is that you handle
                     // The form event.
-                    // Howver, if your form doesn't have a submit handler, it might navigate the page depending on the webview.
+                    // However, if your form doesn't have a submit handler, it might navigate the page depending on the webview.
                     // We suggest always attaching a submit handler to the form.
                     onsubmit: move |ev| {
                         println!("Submit event: {:#?}", ev);

examples/future.rs

@@ -1,6 +1,6 @@
 //! A simple example that shows how to use the use_future hook to run a background task.
 //!
-//! use_future won't return a value, analagous to use_effect.
+//! use_future won't return a value, analogous to use_effect.
 //! If you want to return a value from a future, use use_resource instead.
 
 use dioxus::prelude::*;

examples/multiwindow.rs

@@ -1,6 +1,6 @@
 //! Multiwindow example
 //!
-//! This exmaple shows how to implement a simple multiwindow application using dioxus.
+//! This example shows how to implement a simple multiwindow application using dioxus.
 //! This works by spawning a new window when the user clicks a button. We have to build a new virtualdom which has its
 //! own context, root elements, etc.
 

examples/openid_connect_demo/Dioxus.toml

@@ -3,7 +3,7 @@
 # dioxus project name
 name = "OpenID Connect authentication demo"
 
-# default platfrom
+# default platform
 # you can also use `dioxus serve/build --platform XXX` to use other platform
 # value: web | desktop
 default_platform = "web"

examples/optional_props.rs

@@ -31,7 +31,7 @@ fn app() -> Element {
             e: "asd".to_string(),
         }
 
-        // `b` and `e` are ommitted
+        // `b` and `e` are omitted
         Button {
             a: "asd".to_string(),
             c: "asd".to_string(),

examples/rsx_usage.rs

@@ -261,7 +261,7 @@ mod baller {
     }
 }
 
-/// Documention for this component is visible within the rsx macro
+/// Documentation for this component is visible within the rsx macro
 #[component]
 pub fn Taller(
     /// Fields are documented and accessible in rsx!

examples/signals.rs

@@ -1,6 +1,6 @@
 //! A simple example demonstrating how to use signals to modify state from several different places.
 //!
-//! This simlpe example implements a counter that can be incremented, decremented, and paused. It also demonstrates
+//! This simple example implements a counter that can be incremented, decremented, and paused. It also demonstrates
 //! that background tasks in use_futures can modify the value as well.
 //!
 //! Most signals implement Into<ReadOnlySignal<T>>, making ReadOnlySignal a good default type when building new

examples/web_component.rs

@@ -14,14 +14,14 @@ fn app() -> Element {
     rsx! {
         div {
             h1 { "Web Components" }
-            CoolWebComponet { my_prop: "Hello, world!".to_string() }
+            CoolWebComponent { my_prop: "Hello, world!".to_string() }
         }
     }
 }
 
 /// A web-component wrapped with a strongly typed interface using a component
 #[component]
-fn CoolWebComponet(my_prop: String) -> Element {
+fn CoolWebComponent(my_prop: String) -> Element {
     rsx! {
         // rsx! takes a webcomponent as long as its tag name is separated with dashes
         web-component {

packages/autofmt/tests/samples/staged.rsx

@@ -3,9 +3,9 @@ rsx! {
 
     div { "hi" }
 
-    div { class: "helo", "hi" }
+    div { class: "hello", "hi" }
 
-    div { class: "helo", glass: "123", "hi" }
+    div { class: "hello", glass: "123", "hi" }
 
     div { {some_expr} }
     div {

packages/autofmt/tests/wrong/multiexpr-4sp.rsx

@@ -1,4 +1,4 @@
-fn ItWroks() {
+fn ItWorks() {
     rsx! {
         div { class: "flex flex-wrap items-center dark:text-white py-16 border-t font-light",
             {left}

packages/autofmt/tests/wrong/multiexpr-4sp.wrong.rsx

@@ -1,4 +1,4 @@
-fn ItWroks() {
+fn ItWorks() {
     rsx! {
         div { class: "flex flex-wrap items-center dark:text-white py-16 border-t font-light", {left}, {right} }
     }

packages/autofmt/tests/wrong/multiexpr-tab.rsx

@@ -1,4 +1,4 @@
-fn ItWroks() {
+fn ItWorks() {
 	rsx! {
 		div { class: "flex flex-wrap items-center dark:text-white py-16 border-t font-light",
 			{left}

packages/autofmt/tests/wrong/multiexpr-tab.wrong.rsx

@@ -1,4 +1,4 @@
-fn ItWroks() {
+fn ItWorks() {
 	rsx! {
 		div { class: "flex flex-wrap items-center dark:text-white py-16 border-t font-light", {left}, {right} }
 	}

packages/cli/Cargo.toml

@@ -105,7 +105,7 @@ crossterm = { version = "0.27.0", features = ["event-stream"] }
 ansi-to-tui = "=5.0.0-rc.1"
 ansi-to-html = "0.2.1"
 
-# on maco, we need to specify the vendored feature on ssl when cross compiling
+# on macos, we need to specify the vendored feature on ssl when cross compiling
 # [target.'cfg(target_os = "macos")'.dependencies]
 # openssl = { version = "0.10", features = ["vendored"] }
 

packages/cli/assets/dioxus.toml

@@ -3,7 +3,7 @@
 # dioxus project name
 name = "{{project-name}}"
 
-# default platfrom
+# default platform
 # you can also use `dx serve/build --platform XXX` to use other platform
 # value: web | desktop
 default_platform = "{{default-platform}}"

packages/cli/src/cli/link.rs

@@ -18,7 +18,7 @@ impl LinkCommand {
             return Ok(());
         };
 
-        // Parse object files, deserialize JSON, & create a file to propogate JSON.
+        // Parse object files, deserialize JSON, & create a file to propagate JSON.
         let json = manganis_cli_support::get_json_from_object_files(object_files);
         let parsed = serde_json::to_string(&json).unwrap();
 

packages/cli/src/error.rs

@@ -6,7 +6,7 @@ pub type Result<T, E = Error> = std::result::Result<T, E>;
 
 #[derive(ThisError, Debug)]
 pub enum Error {
-    /// Used when errors need to propogate but are too unique to be typed
+    /// Used when errors need to propagate but are too unique to be typed
     #[error("{0}")]
     Unique(String),
 

packages/cli/src/serve/proxy.rs

@@ -176,7 +176,7 @@ mod test {
                 .unwrap();
         });
 
-        // Expose *just* the fileystem web server's address
+        // Expose *just* the filesystem web server's address
         server_handle_handle.listening().await.unwrap().to_string()
     }
 

packages/cli/src/serve/server.rs

@@ -471,7 +471,7 @@ fn no_cache(
     let mut response = response.into_response();
 
     // If there's a 404 and we're supposed to index on 404, upgrade that failed request to the index.html
-    // We migth want to isnert a header here saying we *did* that but oh well
+    // We might want to isnert a header here saying we *did* that but oh well
     if response.status() == StatusCode::NOT_FOUND && index_on_404 {
         let body = Body::from(std::fs::read_to_string(out_dir.join("index.html")).unwrap());
 

packages/cli/src/serve/watcher.rs

@@ -248,7 +248,7 @@ impl Watcher {
     }
 
     /// Ensure the changes we've received from the queue are actually legit changes to either assets or
-    /// rust code. We don't care about changes otherwise, unless we get a signle elsewhere to do a full rebuild
+    /// rust code. We don't care about changes otherwise, unless we get a signal elsewhere to do a full rebuild
     pub fn pending_changes(&mut self) -> bool {
         !self.queued_events.is_empty()
     }

packages/cli/src/tools.rs

@@ -217,7 +217,7 @@ impl Tool {
                 "windows" => tool_path.join(&dir_name).join(self.name()).join(".exe"),
                 _ => tool_path.join(&dir_name).join(self.name()),
             };
-            // Manualy creating tool directory because we directly download the binary via Github
+            // Manually creating tool directory because we directly download the binary via Github
             std::fs::create_dir(tool_path.join(dir_name))?;
 
             let mut final_file = std::fs::File::create(&bin_path)?;

packages/core-macro/src/component.rs

@@ -40,7 +40,7 @@ impl ToTokens for ComponentBody {
             // No props declared, so we don't need to generate a props struct
             true => quote! {},
 
-            // Props declared, so we generate a props struct and thatn also attach the doc attributes to it
+            // Props declared, so we generate a props struct and then also attach the doc attributes to it
             false => {
                 let doc = format!("Properties for the [`{}`] component.", &comp_fn.sig.ident);
                 let props_struct = self.props_struct();

packages/core/README.md

@@ -40,7 +40,7 @@ If you are just starting, check out the Guides first.
 
 ## Understanding the implementation
 
-`dioxus-core` is designed to be a lightweight crate that. It exposes a number of flexible primitives without being deeply concerned about the intracices of state management itself. We proivde a number of useful abstractions built on these primitives in the `dioxus-hooks` crate as well as the `dioxus-signals` crate.
+`dioxus-core` is designed to be a lightweight crate that. It exposes a number of flexible primitives without being deeply concerned about the intracices of state management itself. We provide a number of useful abstractions built on these primitives in the `dioxus-hooks` crate as well as the `dioxus-signals` crate.
 
 The important abstractions to understand are:
 

packages/core/src/arena.rs

@@ -92,25 +92,25 @@ impl VirtualDom {
 }
 
 impl ElementPath {
-    pub(crate) fn is_decendant(&self, small: &[u8]) -> bool {
+    pub(crate) fn is_descendant(&self, small: &[u8]) -> bool {
         small.len() <= self.path.len() && small == &self.path[..small.len()]
     }
 }
 
 #[test]
-fn is_decendant() {
+fn is_descendant() {
     let event_path = ElementPath {
         path: &[1, 2, 3, 4, 5],
     };
 
-    assert!(event_path.is_decendant(&[1, 2, 3, 4, 5]));
+    assert!(event_path.is_descendant(&[1, 2, 3, 4, 5]));
-    assert!(event_path.is_decendant(&[1, 2, 3, 4]));
+    assert!(event_path.is_descendant(&[1, 2, 3, 4]));
-    assert!(event_path.is_decendant(&[1, 2, 3]));
+    assert!(event_path.is_descendant(&[1, 2, 3]));
-    assert!(event_path.is_decendant(&[1, 2]));
+    assert!(event_path.is_descendant(&[1, 2]));
-    assert!(event_path.is_decendant(&[1]));
+    assert!(event_path.is_descendant(&[1]));
 
-    assert!(!event_path.is_decendant(&[1, 2, 3, 4, 5, 6]));
+    assert!(!event_path.is_descendant(&[1, 2, 3, 4, 5, 6]));
-    assert!(!event_path.is_decendant(&[2, 3, 4]));
+    assert!(!event_path.is_descendant(&[2, 3, 4]));
 }
 
 impl PartialEq<&[u8]> for ElementPath {

packages/core/src/mutations.rs

@@ -344,7 +344,7 @@ impl Mutations {
     /// Rewrites IDs to just be "template", so you can compare the mutations
     ///
     /// Used really only for testing
-    pub fn santize(mut self) -> Self {
+    pub fn sanitize(mut self) -> Self {
         for edit in self.edits.iter_mut() {
             if let Mutation::LoadTemplate { name, .. } = edit {
                 *name = "template"

packages/core/src/nodes.rs

@@ -193,7 +193,7 @@ impl Drop for VNode {
         // FIXME:
         // TODO:
         //
-        // We have to add this drop *here* becase we can't add a drop impl to AttributeValue and
+        // We have to add this drop *here* because we can't add a drop impl to AttributeValue and
         // keep semver compatibility. Adding a drop impl means you can't destructure the value, which
         // we need to do for enums.
         //
@@ -546,7 +546,7 @@ impl TemplateNode {
 
 /// A node created at runtime
 ///
-/// This node's index in the DynamicNode list on VNode should match its repsective `Dynamic` index
+/// This node's index in the DynamicNode list on VNode should match its respective `Dynamic` index
 #[derive(Debug)]
 pub enum DynamicNode {
     /// A component node
@@ -761,7 +761,7 @@ pub struct Attribute {
 impl Attribute {
     /// Create a new [`Attribute`] from a name, value, namespace, and volatile bool
     ///
-    /// "Volatile" referes to whether or not Dioxus should always override the value. This helps prevent the UI in
+    /// "Volatile" refers to whether or not Dioxus should always override the value. This helps prevent the UI in
     /// some renderers stay in sync with the VirtualDom's understanding of the world
     pub fn new(
         name: &'static str,
@@ -1145,8 +1145,8 @@ pub trait HasAttributes {
 
 #[cfg(debug_assertions)]
 pub(crate) fn sort_bfo(paths: &[&'static [u8]]) -> Vec<(usize, &'static [u8])> {
-    let mut with_indecies = paths.iter().copied().enumerate().collect::<Vec<_>>();
+    let mut with_indices = paths.iter().copied().enumerate().collect::<Vec<_>>();
-    with_indecies.sort_by(|(_, a), (_, b)| {
+    with_indices.sort_by(|(_, a), (_, b)| {
         let mut a = a.iter();
         let mut b = b.iter();
         loop {
@@ -1163,7 +1163,7 @@ pub(crate) fn sort_bfo(paths: &[&'static [u8]]) -> Vec<(usize, &'static [u8])> {
             }
         }
     });
-    with_indecies
+    with_indices
 }
 
 #[test]

packages/core/src/reactive_context.rs

@@ -162,7 +162,7 @@ impl ReactiveContext {
     /// # use futures_util::StreamExt;
     /// fn use_simplified_memo(mut closure: impl FnMut() -> i32 + 'static) -> Signal<i32> {
     ///     use_hook(|| {
-    ///         // Create a new reactive context and channel that will recieve a value every time a value the reactive context subscribes to changes
+    ///         // Create a new reactive context and channel that will receive a value every time a value the reactive context subscribes to changes
     ///         let (reactive_context, mut changed) = ReactiveContext::new();
     ///         // Compute the value of the memo inside the reactive context. This will subscribe the reactive context to any values you read inside the closure
     ///         let value = reactive_context.reset_and_run_in(&mut closure);

packages/core/src/scopes.rs

@@ -6,7 +6,7 @@ use std::{cell::Ref, rc::Rc};
 
 /// A component's unique identifier.
 ///
-/// `ScopeId` is a `usize` that acts a key for the internal slab of Scopes. This means that the key is not unqiue across
+/// `ScopeId` is a `usize` that acts a key for the internal slab of Scopes. This means that the key is not unique across
 /// time. We do try and guarantee that between calls to `wait_for_work`, no ScopeIds will be recycled in order to give
 /// time for any logic that relies on these IDs to properly update.
 #[cfg_attr(feature = "serialize", derive(serde::Serialize, serde::Deserialize))]

packages/core/src/virtual_dom.rs

@@ -887,7 +887,7 @@ impl VirtualDom {
 
                 for attr in attrs.iter() {
                     // Remove the "on" prefix if it exists, TODO, we should remove this and settle on one
-                    if attr.name.get(2..) == Some(name) && target_path.is_decendant(this_path) {
+                    if attr.name.get(2..) == Some(name) && target_path.is_descendant(this_path) {
                         listeners.push(&attr.value);
 
                         // Break if this is the exact target element.

packages/core/tests/attr_cleanup.rs

@@ -21,7 +21,7 @@ fn attrs_cycle() {
     });
 
     assert_eq!(
-        dom.rebuild_to_vec().santize().edits,
+        dom.rebuild_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(1,) },
             AppendChildren { m: 1, id: ElementId(0) },
@@ -30,7 +30,7 @@ fn attrs_cycle() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(2,) },
             AssignId { path: &[0,], id: ElementId(3,) },
@@ -42,7 +42,7 @@ fn attrs_cycle() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(1) },
             ReplaceWith { id: ElementId(2), m: 1 }
@@ -51,7 +51,7 @@ fn attrs_cycle() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(2) },
             AssignId { path: &[0], id: ElementId(3) },
@@ -74,7 +74,7 @@ fn attrs_cycle() {
     // we take the node taken by attributes since we reused it
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(1) },
             ReplaceWith { id: ElementId(2), m: 1 }

packages/core/tests/boolattrs.rs

@@ -6,7 +6,7 @@ fn bool_test() {
     let mut app = VirtualDom::new(|| rsx!(div { hidden: false }));
 
     assert_eq!(
-        app.rebuild_to_vec().santize().edits,
+        app.rebuild_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(1) },
             SetAttribute {

packages/core/tests/bubble_error.rs

@@ -19,7 +19,7 @@ fn bubbles_error() {
     let mut dom = VirtualDom::new(app);
 
     {
-        let _edits = dom.rebuild_to_vec().santize();
+        let _edits = dom.rebuild_to_vec().sanitize();
     }
 
     dom.mark_dirty(ScopeId::APP);

packages/core/tests/context_api.rs

@@ -20,7 +20,7 @@ fn state_shares() {
 
     let mut dom = VirtualDom::new(app);
     assert_eq!(
-        dom.rebuild_to_vec().santize().edits,
+        dom.rebuild_to_vec().sanitize().edits,
         [
             CreateTextNode { value: "Value is 0".to_string(), id: ElementId(1,) },
             AppendChildren { m: 1, id: ElementId(0) },
@@ -41,7 +41,7 @@ fn state_shares() {
 
     dom.mark_dirty(ScopeId(ScopeId::APP.0 + 2));
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [SetText { value: "Value is 2".to_string(), id: ElementId(1,) },]
     );
 
@@ -49,7 +49,7 @@ fn state_shares() {
     dom.mark_dirty(ScopeId(ScopeId::APP.0 + 2));
     let edits = dom.render_immediate_to_vec();
     assert_eq!(
-        edits.santize().edits,
+        edits.sanitize().edits,
         [SetText { value: "Value is 3".to_string(), id: ElementId(1,) },]
     );
 }

packages/core/tests/create_dom.rs

@@ -17,7 +17,7 @@ fn test_original_diff() {
         }
     });
 
-    let edits = dom.rebuild_to_vec().santize();
+    let edits = dom.rebuild_to_vec().sanitize();
 
     assert_eq!(
         edits.edits,
@@ -46,7 +46,7 @@ fn create() {
         }
     });
 
-    let _edits = dom.rebuild_to_vec().santize();
+    let _edits = dom.rebuild_to_vec().sanitize();
 
     // todo: we don't test template mutations anymore since the templates are passed along
 
@@ -77,7 +77,7 @@ fn create() {
 fn create_list() {
     let mut dom = VirtualDom::new(|| rsx! {{(0..3).map(|f| rsx!( div { "hello" } ))}});
 
-    let _edits = dom.rebuild_to_vec().santize();
+    let _edits = dom.rebuild_to_vec().sanitize();
 
     // note: we dont test template edits anymore
     // assert_eq!(
@@ -103,7 +103,7 @@ fn create_simple() {
         }
     });
 
-    let edits = dom.rebuild_to_vec().santize();
+    let edits = dom.rebuild_to_vec().sanitize();
 
     // note: we dont test template edits anymore
     // assert_eq!(
@@ -142,7 +142,7 @@ fn create_components() {
         }
     }
 
-    let _edits = dom.rebuild_to_vec().santize();
+    let _edits = dom.rebuild_to_vec().sanitize();
 
     // todo: test this
 }
@@ -161,7 +161,7 @@ fn anchors() {
     });
 
     // note that the template under "false" doesn't show up since it's not loaded
-    let edits = dom.rebuild_to_vec().santize();
+    let edits = dom.rebuild_to_vec().sanitize();
 
     // note: we dont test template edits anymore
     // assert_eq!(

packages/core/tests/create_element.rs

@@ -12,10 +12,10 @@ fn multiroot() {
     });
 
     // note: we dont test template edits anymore
-    let _templates = dom.rebuild_to_vec().santize().templates;
+    let _templates = dom.rebuild_to_vec().sanitize().templates;
 
     // assert_eq!(
-    //     dom.rebuild_to_vec().santize().templates,
+    //     dom.rebuild_to_vec().sanitize().templates,
     //     [
     //         CreateElement { name: "div" },
     //         CreateStaticText { value: "Hello a" },

packages/core/tests/create_lists.rs

@@ -25,7 +25,7 @@ fn app() -> Element {
 fn list_renders() {
     let mut dom = VirtualDom::new(app);
 
-    let edits = dom.rebuild_to_vec().santize();
+    let edits = dom.rebuild_to_vec().sanitize();
 
     // note: we dont test template edits anymore
     // assert_eq!(

packages/core/tests/create_passthru.rs

@@ -21,7 +21,7 @@ fn nested_passthru_creates() {
     }
 
     let mut dom = VirtualDom::new(app);
-    let edits = dom.rebuild_to_vec().santize();
+    let edits = dom.rebuild_to_vec().sanitize();
 
     assert_eq!(
         edits.edits,
@@ -60,7 +60,7 @@ fn nested_passthru_creates_add() {
     let mut dom = VirtualDom::new(app);
 
     assert_eq!(
-        dom.rebuild_to_vec().santize().edits,
+        dom.rebuild_to_vec().sanitize().edits,
         [
             // load 1
             LoadTemplate { name: "template", index: 0, id: ElementId(1) },
@@ -85,7 +85,7 @@ fn dynamic_node_as_root() {
     }
 
     let mut dom = VirtualDom::new(app);
-    let edits = dom.rebuild_to_vec().santize();
+    let edits = dom.rebuild_to_vec().sanitize();
 
     // Since the roots were all dynamic, they should not cause any template muations
     assert!(edits.templates.is_empty());

packages/core/tests/cycle.rs

@@ -11,7 +11,7 @@ fn cycling_elements() {
     });
 
     {
-        let edits = dom.rebuild_to_vec().santize();
+        let edits = dom.rebuild_to_vec().sanitize();
         assert_eq!(
             edits.edits,
             [
@@ -23,7 +23,7 @@ fn cycling_elements() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(2,) },
             ReplaceWith { id: ElementId(1,), m: 1 },
@@ -33,7 +33,7 @@ fn cycling_elements() {
     // notice that the IDs cycle back to ElementId(1), preserving a minimal memory footprint
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(1,) },
             ReplaceWith { id: ElementId(2,), m: 1 },
@@ -42,7 +42,7 @@ fn cycling_elements() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(2,) },
             ReplaceWith { id: ElementId(1,), m: 1 },

packages/core/tests/diff_component.rs

@@ -62,7 +62,7 @@ fn component_swap() {
 
     let mut dom = VirtualDom::new(app);
     {
-        let edits = dom.rebuild_to_vec().santize();
+        let edits = dom.rebuild_to_vec().sanitize();
         assert_eq!(
             edits.edits,
             [
@@ -79,7 +79,7 @@ fn component_swap() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(6) },
             ReplaceWith { id: ElementId(5), m: 1 }
@@ -88,7 +88,7 @@ fn component_swap() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(5) },
             ReplaceWith { id: ElementId(6), m: 1 }
@@ -97,7 +97,7 @@ fn component_swap() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(6) },
             ReplaceWith { id: ElementId(5), m: 1 }

packages/core/tests/diff_element.rs

@@ -48,7 +48,7 @@ fn element_swap() {
 
     vdom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        vdom.render_immediate_to_vec().santize().edits,
+        vdom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(2,) },
             ReplaceWith { id: ElementId(1,), m: 1 },
@@ -57,7 +57,7 @@ fn element_swap() {
 
     vdom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        vdom.render_immediate_to_vec().santize().edits,
+        vdom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(1,) },
             ReplaceWith { id: ElementId(2,), m: 1 },
@@ -66,7 +66,7 @@ fn element_swap() {
 
     vdom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        vdom.render_immediate_to_vec().santize().edits,
+        vdom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(2,) },
             ReplaceWith { id: ElementId(1,), m: 1 },
@@ -75,7 +75,7 @@ fn element_swap() {
 
     vdom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        vdom.render_immediate_to_vec().santize().edits,
+        vdom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(1,) },
             ReplaceWith { id: ElementId(2,), m: 1 },
@@ -128,7 +128,7 @@ fn attribute_diff() {
 
     vdom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        vdom.render_immediate_to_vec().santize().edits,
+        vdom.render_immediate_to_vec().sanitize().edits,
         [
             SetAttribute {
                 name: "b",
@@ -147,7 +147,7 @@ fn attribute_diff() {
 
     vdom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        vdom.render_immediate_to_vec().santize().edits,
+        vdom.render_immediate_to_vec().sanitize().edits,
         [
             SetAttribute { name: "a", value: AttributeValue::None, id: ElementId(1,), ns: None },
             SetAttribute { name: "b", value: AttributeValue::None, id: ElementId(1,), ns: None },
@@ -168,7 +168,7 @@ fn attribute_diff() {
 
     vdom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        vdom.render_immediate_to_vec().santize().edits,
+        vdom.render_immediate_to_vec().sanitize().edits,
         [
             SetAttribute { name: "c", value: AttributeValue::None, id: ElementId(1,), ns: None },
             SetAttribute {
@@ -196,7 +196,7 @@ fn diff_empty() {
     vdom.rebuild(&mut NoOpMutations);
 
     vdom.mark_dirty(ScopeId::APP);
-    let edits = vdom.render_immediate_to_vec().santize().edits;
+    let edits = vdom.render_immediate_to_vec().sanitize().edits;
 
     assert_eq!(
         edits,

packages/core/tests/diff_keyed_list.rs

@@ -22,7 +22,7 @@ fn keyed_diffing_out_of_order() {
 
     {
         assert_eq!(
-            dom.rebuild_to_vec().santize().edits,
+            dom.rebuild_to_vec().sanitize().edits,
             [
                 LoadTemplate { name: "template", index: 0, id: ElementId(1,) },
                 LoadTemplate { name: "template", index: 0, id: ElementId(2,) },
@@ -101,7 +101,7 @@ fn keyed_diffing_out_of_order_adds_3() {
     );
 }
 
-/// Should result in moves onl
+/// Should result in moves only
 #[test]
 fn keyed_diffing_out_of_order_adds_4() {
     let mut dom = VirtualDom::new(|| {
@@ -127,7 +127,7 @@ fn keyed_diffing_out_of_order_adds_4() {
     );
 }
 
-/// Should result in moves onl
+/// Should result in moves only
 #[test]
 fn keyed_diffing_out_of_order_adds_5() {
     let mut dom = VirtualDom::new(|| {
@@ -152,7 +152,7 @@ fn keyed_diffing_out_of_order_adds_5() {
     );
 }
 
-/// Should result in moves onl
+/// Should result in moves only
 #[test]
 fn keyed_diffing_additions() {
     let mut dom = VirtualDom::new(|| {
@@ -169,7 +169,7 @@ fn keyed_diffing_additions() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(6) },
             LoadTemplate { name: "template", index: 0, id: ElementId(7) },
@@ -194,7 +194,7 @@ fn keyed_diffing_additions_and_moves_on_ends() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             // create 11, 12
             LoadTemplate { name: "template", index: 0, id: ElementId(5) },
@@ -224,7 +224,7 @@ fn keyed_diffing_additions_and_moves_in_middle() {
     // LIS: 4, 5, 6
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             // create 5, 6
             LoadTemplate { name: "template", index: 0, id: ElementId(5) },
@@ -258,7 +258,7 @@ fn controlled_keyed_diffing_out_of_order() {
     // LIS: 5, 6
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             // remove 7
             Remove { id: ElementId(4,) },
@@ -291,7 +291,7 @@ fn controlled_keyed_diffing_out_of_order_max_test() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             Remove { id: ElementId(5,) },
             LoadTemplate { name: "template", index: 0, id: ElementId(5) },
@@ -320,7 +320,7 @@ fn remove_list() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             Remove { id: ElementId(5) },
             Remove { id: ElementId(4) },
@@ -345,7 +345,7 @@ fn no_common_keys() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(4) },
             LoadTemplate { name: "template", index: 0, id: ElementId(5) },

packages/core/tests/diff_unkeyed_list.rs

@@ -18,7 +18,7 @@ fn list_creates_one_by_one() {
 
     // load the div and then assign the empty fragment as a placeholder
     assert_eq!(
-        dom.rebuild_to_vec().santize().edits,
+        dom.rebuild_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(1,) },
             AssignId { path: &[0], id: ElementId(2,) },
@@ -29,7 +29,7 @@ fn list_creates_one_by_one() {
     // Rendering the first item should replace the placeholder with an element
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(3,) },
             HydrateText { path: &[0], value: "0".to_string(), id: ElementId(4,) },
@@ -40,7 +40,7 @@ fn list_creates_one_by_one() {
     // Rendering the next item should insert after the previous
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(2,) },
             HydrateText { path: &[0], value: "1".to_string(), id: ElementId(5,) },
@@ -51,7 +51,7 @@ fn list_creates_one_by_one() {
     // ... and again!
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(6,) },
             HydrateText { path: &[0], value: "2".to_string(), id: ElementId(7,) },
@@ -62,7 +62,7 @@ fn list_creates_one_by_one() {
     // once more
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(8,) },
             HydrateText { path: &[0], value: "3".to_string(), id: ElementId(9,) },
@@ -87,7 +87,7 @@ fn removes_one_by_one() {
 
     // load the div and then assign the empty fragment as a placeholder
     assert_eq!(
-        dom.rebuild_to_vec().santize().edits,
+        dom.rebuild_to_vec().sanitize().edits,
         [
             // The container
             LoadTemplate { name: "template", index: 0, id: ElementId(1) },
@@ -109,14 +109,14 @@ fn removes_one_by_one() {
     // Rendering the first item should replace the placeholder with an element
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [Remove { id: ElementId(6) }]
     );
 
     // Remove div(2)
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [Remove { id: ElementId(4) }]
     );
 
@@ -124,7 +124,7 @@ fn removes_one_by_one() {
     // todo: this should just be a remove with no placeholder
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             CreatePlaceholder { id: ElementId(4) },
             ReplaceWith { id: ElementId(2), m: 1 }
@@ -135,7 +135,7 @@ fn removes_one_by_one() {
     // todo: this should actually be append to, but replace placeholder is fine for now
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(2) },
             HydrateText { path: &[0], value: "0".to_string(), id: ElementId(6) },
@@ -162,7 +162,7 @@ fn list_shrink_multiroot() {
     });
 
     assert_eq!(
-        dom.rebuild_to_vec().santize().edits,
+        dom.rebuild_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(1,) },
             AssignId { path: &[0,], id: ElementId(2,) },
@@ -172,7 +172,7 @@ fn list_shrink_multiroot() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(3) },
             HydrateText { path: &[0], value: "0".to_string(), id: ElementId(4) },
@@ -184,7 +184,7 @@ fn list_shrink_multiroot() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(2) },
             HydrateText { path: &[0], value: "1".to_string(), id: ElementId(7) },
@@ -196,7 +196,7 @@ fn list_shrink_multiroot() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(10) },
             HydrateText { path: &[0], value: "2".to_string(), id: ElementId(11) },
@@ -224,7 +224,7 @@ fn removes_one_by_one_multiroot() {
 
     // load the div and then assign the empty fragment as a placeholder
     assert_eq!(
-        dom.rebuild_to_vec().santize().edits,
+        dom.rebuild_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(1) },
             //
@@ -251,19 +251,19 @@ fn removes_one_by_one_multiroot() {
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [Remove { id: ElementId(10) }, Remove { id: ElementId(12) }]
     );
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [Remove { id: ElementId(6) }, Remove { id: ElementId(8) }]
     );
 
     dom.mark_dirty(ScopeId::APP);
     assert_eq!(
-        dom.render_immediate_to_vec().santize().edits,
+        dom.render_immediate_to_vec().sanitize().edits,
         [
             CreatePlaceholder { id: ElementId(8) },
             Remove { id: ElementId(2) },
@@ -318,7 +318,7 @@ fn remove_many() {
     });
 
     {
-        let edits = dom.rebuild_to_vec().santize();
+        let edits = dom.rebuild_to_vec().sanitize();
         assert!(edits.templates.is_empty());
         assert_eq!(
             edits.edits,
@@ -331,7 +331,7 @@ fn remove_many() {
 
     {
         dom.mark_dirty(ScopeId::APP);
-        let edits = dom.render_immediate_to_vec().santize();
+        let edits = dom.render_immediate_to_vec().sanitize();
         assert_eq!(
             edits.edits,
             [
@@ -344,7 +344,7 @@ fn remove_many() {
 
     {
         dom.mark_dirty(ScopeId::APP);
-        let edits = dom.render_immediate_to_vec().santize();
+        let edits = dom.render_immediate_to_vec().sanitize();
         assert_eq!(
             edits.edits,
             [
@@ -363,7 +363,7 @@ fn remove_many() {
 
     {
         dom.mark_dirty(ScopeId::APP);
-        let edits = dom.render_immediate_to_vec().santize();
+        let edits = dom.render_immediate_to_vec().sanitize();
         assert_eq!(
             edits.edits,
             [
@@ -379,7 +379,7 @@ fn remove_many() {
 
     {
         dom.mark_dirty(ScopeId::APP);
-        let edits = dom.render_immediate_to_vec().santize();
+        let edits = dom.render_immediate_to_vec().sanitize();
         assert_eq!(
             edits.edits,
             [

packages/core/tests/kitchen_sink.rs

@@ -33,7 +33,7 @@ fn basic_syntax_is_a_template() -> Element {
 #[test]
 fn dual_stream() {
     let mut dom = VirtualDom::new(basic_syntax_is_a_template);
-    let edits = dom.rebuild_to_vec().santize();
+    let edits = dom.rebuild_to_vec().sanitize();
 
     use Mutation::*;
     assert_eq!(edits.edits, {

packages/core/tests/lifecycle.rs

@@ -30,7 +30,7 @@ fn manual_diffing() {
     *value.lock().unwrap() = "goodbye";
 
     assert_eq!(
-        dom.rebuild_to_vec().santize().edits,
+        dom.rebuild_to_vec().sanitize().edits,
         [
             LoadTemplate { name: "template", index: 0, id: ElementId(3) },
             HydrateText { path: &[0], value: "goodbye".to_string(), id: ElementId(4) },

packages/desktop/headless_tests/events.rs

@@ -26,7 +26,7 @@ fn app() -> Element {
     });
 
     if expected != 0 && received == expected {
-        println!("all events recieved");
+        println!("all events received");
         desktop_context.close();
     }
 

packages/desktop/src/desktop_context.rs

@@ -205,7 +205,7 @@ impl DesktopService {
     }
 
     /// Create a wry event handler that listens for wry events.
-    /// This event handler is scoped to the currently active window and will only recieve events that are either global or related to the current window.
+    /// This event handler is scoped to the currently active window and will only receive events that are either global or related to the current window.
     ///
     /// The id this function returns can be used to remove the event handler with [`DesktopContext::remove_wry_event_handler`]
     pub fn create_wry_event_handler(

packages/desktop/src/shortcut.rs

@@ -158,11 +158,11 @@ impl IntoAccelerator for &str {
     }
 }
 
-pub trait IntoModifersState {
+pub trait IntoModifiersState {
     fn into_modifiers_state(self) -> Modifiers;
 }
 
-impl IntoModifersState for ModifiersState {
+impl IntoModifiersState for ModifiersState {
     fn into_modifiers_state(self) -> Modifiers {
         let mut modifiers = Modifiers::default();
         if self.shift_key() {
@@ -182,7 +182,7 @@ impl IntoModifersState for ModifiersState {
     }
 }
 
-impl IntoModifersState for Modifiers {
+impl IntoModifiersState for Modifiers {
     fn into_modifiers_state(self) -> Modifiers {
         self
     }
@@ -295,7 +295,7 @@ impl IntoKeyCode for dioxus_html::KeyCode {
             dioxus_html::KeyCode::GraveAccent => Code::Backquote,
             dioxus_html::KeyCode::OpenBracket => Code::BracketLeft,
             dioxus_html::KeyCode::BackSlash => Code::Backslash,
-            dioxus_html::KeyCode::CloseBraket => Code::BracketRight,
+            dioxus_html::KeyCode::CloseBracket => Code::BracketRight,
             dioxus_html::KeyCode::SingleQuote => Code::Quote,
             key => panic!("Failed to convert {:?} to tao::keyboard::KeyCode, try using tao::keyboard::KeyCode directly", key),
         }

packages/dioxus-lib/README.md

@@ -5,7 +5,7 @@
   </p>
 </div>
 
-> This crate implements dioxus-lib which is a renderer-free version of Dioxus. This crate is intended to be used by library authors who need a stable core verison of dioxus withuot pulling in renderer-related dependencies on accident.
+> This crate implements dioxus-lib which is a renderer-free version of Dioxus. This crate is intended to be used by library authors who need a stable core version of dioxus withuot pulling in renderer-related dependencies on accident.
 
 # Resources
 

packages/fullstack/examples/axum-auth/src/auth.rs

@@ -81,7 +81,7 @@ impl User {
             .await
             .ok()?;
 
-        //lets just get all the tokens the user can use, we will only use the full permissions if modifing them.
+        //lets just get all the tokens the user can use, we will only use the full permissions if modifying them.
         let sql_user_perms = sqlx::query_as::<_, SqlPermissionTokens>(
             "SELECT token FROM user_permissions WHERE user_id = $1;",
         )

packages/hooks/src/use_coroutine.rs

@@ -96,7 +96,7 @@ where
 }
 
 /// Get a handle to a coroutine higher in the tree
-/// Analagous to use_context_provider and use_context,
+/// Analogous to use_context_provider and use_context,
 /// but used for coroutines specifically
 /// See the docs for [`use_coroutine`] for more details.
 #[doc = include_str!("../docs/rules_of_hooks.md")]

packages/hot-reload/README.md

@@ -1,4 +1,4 @@
-# `dioxus-hot-reload`: Hot Reloading Utilites for Dioxus
+# `dioxus-hot-reload`: Hot Reloading Utilities for Dioxus
 
 [![Crates.io][crates-badge]][crates-url]
 [![MIT licensed][mit-badge]][mit-url]
@@ -68,7 +68,7 @@ rsx! {
 
 ## Usage
 
-> This crate implements hot reloading for native compilation targets not WASM. For hot relaoding with the web renderer, see the [dioxus-cli](https://github.com/DioxusLabs/dioxus/tree/master/packages/cli) project.
+> This crate implements hot reloading for native compilation targets not WASM. For hot reloading with the web renderer, see the [dioxus-cli](https://github.com/DioxusLabs/dioxus/tree/master/packages/cli) project.
 
 Add this to the top of your main function on any renderer that supports hot reloading to start the hot reloading server:
 

packages/html/src/attribute_groups.rs

@@ -4,7 +4,7 @@ use dioxus_core::prelude::IntoAttributeValue;
 use dioxus_core::HasAttributes;
 use dioxus_html_internal_macro::impl_extension_attributes;
 
-use crate::AttributeDiscription;
+use crate::AttributeDescription;
 
 #[cfg(feature = "hot-reload-context")]
 macro_rules! mod_method_mapping {
@@ -161,7 +161,7 @@ macro_rules! mod_methods {
         ///     }
         /// };
         /// ```
-        pub const $name: AttributeDiscription = mod_methods! { $name $(: $js_name)? $(in $ns)?; };
+        pub const $name: AttributeDescription = mod_methods! { $name $(: $js_name)? $(in $ns)?; };
     };
 
     (
@@ -192,7 +192,7 @@ macro_rules! mod_methods {
         $(
             #[doc(alias = $js_name)]
         )?
-        pub const $name: AttributeDiscription = mod_methods! { $name $(: $js_name)? $(in $ns)?; };
+        pub const $name: AttributeDescription = mod_methods! { $name $(: $js_name)? $(in $ns)?; };
     };
 
     // Rename the incoming ident and apply a custom namespace
@@ -1530,8 +1530,8 @@ mod_methods! {
     /// <https://developer.mozilla.org/en-US/docs/Web/CSS/voice-stress>
     voice_stress: "voice-stress" in "style";
 
-    /// <https://developer.mozilla.org/en-US/docs/Web/CSS/voice-volumn>
+    /// <https://developer.mozilla.org/en-US/docs/Web/CSS/voice-volume>
-    voice_volumn: "voice-volumn" in "style";
+    voice_volume: "voice-volume" in "style";
 
     /// <https://developer.mozilla.org/en-US/docs/Web/CSS/volume>
     volume in "style";

packages/html/src/elements.rs

@@ -9,7 +9,7 @@ use dioxus_rsx::HotReloadingContext;
 #[cfg(feature = "hot-reload-context")]
 use crate::{map_global_attributes, map_svg_attributes};
 
-pub type AttributeDiscription = (&'static str, Option<&'static str>, bool);
+pub type AttributeDescription = (&'static str, Option<&'static str>, bool);
 
 macro_rules! impl_attribute {
     (
@@ -38,7 +38,7 @@ macro_rules! impl_attribute {
         ///     }
         /// };
         /// ```
-        pub const $fil: AttributeDiscription = (stringify!($fil), None, false);
+        pub const $fil: AttributeDescription = (stringify!($fil), None, false);
     };
 
     (
@@ -67,7 +67,7 @@ macro_rules! impl_attribute {
         ///     }
         /// };
         /// ```
-        pub const $fil: AttributeDiscription = ($name, None, false);
+        pub const $fil: AttributeDescription = ($name, None, false);
     };
 
     (
@@ -96,7 +96,7 @@ macro_rules! impl_attribute {
         ///     }
         /// };
         /// ```
-        pub const $fil: AttributeDiscription = (stringify!($fil), None, true);
+        pub const $fil: AttributeDescription = (stringify!($fil), None, true);
     };
 
     (
@@ -125,7 +125,7 @@ macro_rules! impl_attribute {
         ///     }
         /// };
         /// ```
-        pub const $fil: AttributeDiscription = (stringify!($fil), Some($ns), false)
+        pub const $fil: AttributeDescription = (stringify!($fil), Some($ns), false)
     };
 
     (
@@ -154,7 +154,7 @@ macro_rules! impl_attribute {
         ///     }
         /// };
         /// ```
-        pub const $fil: AttributeDiscription = (stringify!($fil), Some($ns), true)
+        pub const $fil: AttributeDescription = (stringify!($fil), Some($ns), true)
     };
 }
 
@@ -621,7 +621,7 @@ macro_rules! builder_constructors {
 //
 // Does not include obsolete elements.
 //
-// This namespace represents a collection of modern HTML-5 compatiable elements.
+// This namespace represents a collection of modern HTML-5 compatible elements.
 //
 // This list does not include obsolete, deprecated, experimental, or poorly supported elements.
 builder_constructors! {

packages/html/src/events/keyboard.rs

@@ -622,7 +622,7 @@ pub enum KeyCode {
     // numpad period (chrome), = 194
     OpenBracket = 219,
     BackSlash = 220,
-    CloseBraket = 221,
+    CloseBracket = 221,
     SingleQuote = 222,
     // `, = 223
     // left or right ⌘ key (firefox), = 224
@@ -742,7 +742,7 @@ impl KeyCode {
             192 => GraveAccent,
             219 => OpenBracket,
             220 => BackSlash,
-            221 => CloseBraket,
+            221 => CloseBracket,
             222 => SingleQuote,
             _ => Unknown,
         }

packages/interpreter/Cargo.toml

@@ -3,7 +3,7 @@ name = "dioxus-interpreter-js"
 version = { workspace = true }
 edition = "2021"
 authors = ["Jonathan Kelley"]
-description = "JS Intepreter for Dioxus - a concurrent renderer-agnostic Virtual DOM for interactive user experiences"
+description = "JS Interpreter for Dioxus - a concurrent renderer-agnostic Virtual DOM for interactive user experiences"
 license = "MIT OR Apache-2.0"
 repository = "https://github.com/DioxusLabs/dioxus/"
 homepage = "https://dioxuslabs.com"

packages/interpreter/src/js/hash.txt

@@ -1 +1 @@
-[6449103750905854967, 12029349297046688094, 14626980229647476238, 8716623267269178440, 5336385715226370016, 14456089431355876478, 3589298972260118311, 5052021921702764563, 2745859031945642653, 5638004933879392817]
+[6449103750905854967, 12029349297046688094, 13069001215487072322, 8716623267269178440, 5336385715226370016, 14456089431355876478, 17683787366271106808, 5052021921702764563, 16478152596505612522, 5638004933879392817]

packages/interpreter/src/ts/form.ts

@@ -5,7 +5,7 @@ type FormValues = {
   values: { [key: string]: FormDataEntryValue[] };
 }
 
-export function retriveValues(event: Event, target: HTMLElement): FormValues {
+export function retrieveValues(event: Event, target: HTMLElement): FormValues {
   let contents: FormValues = {
     values: {}
   };
@@ -47,7 +47,7 @@ export function retrieveFormValues(form: HTMLFormElement): FormValues {
   };
 }
 
-export function retriveSelectValue(target: HTMLSelectElement): string[] {
+export function retrieveSelectValue(target: HTMLSelectElement): string[] {
   // there might be multiple...
   let options = target.selectedOptions;
   let values = [];

packages/interpreter/src/ts/native.ts

@@ -7,7 +7,7 @@ import { BaseInterpreter, NodeId } from "./core";
 import { SerializedEvent, serializeEvent } from "./serialize";
 
 // okay so, we've got this JSChannel thing from sledgehammer, implicitly imported into our scope
-// we want to extend it, and it technically extends base intepreter. To make typescript happy,
+// we want to extend it, and it technically extends base interpreter. To make typescript happy,
 // we're going to bind the JSChannel_ object to the JSChannel object, and then extend it
 var JSChannel_: typeof BaseInterpreter;
 
@@ -209,7 +209,7 @@ export class NativeInterpreter extends JSChannel_ {
     // Liveview will still need to use this
     this.preventDefaults(event, target);
 
-    // liveview does not have syncronous event handling, so we need to send the event to the host
+    // liveview does not have synchronous event handling, so we need to send the event to the host
     if (this.liveview) {
       // Okay, so the user might've requested some files to be read
       if (

packages/interpreter/src/ts/serialize.ts

@@ -1,6 +1,6 @@
-// Handle serialization of the event data across the IPC boundarytype SerialziedEvent = {};
+// Handle serialization of the event data across the IPC boundarytype SerializedEvent = {};
 
-import { retriveSelectValue, retriveValues } from "./form";
+import { retrieveSelectValue, retrieveValues } from "./form";
 
 export type AppTouchEvent = TouchEvent;
 
@@ -10,29 +10,66 @@ export type SerializedEvent = {
   [key: string]: any;
 };
 
-export function serializeEvent(event: Event, target: EventTarget): SerializedEvent {
+export function serializeEvent(
+  event: Event,
+  target: EventTarget
+): SerializedEvent {
   let contents = {};
 
   // merge the object into the contents
   let extend = (obj: any) => (contents = { ...contents, ...obj });
 
-  if (event instanceof WheelEvent) { extend(serializeWheelEvent(event)) };
+  if (event instanceof WheelEvent) {
-  if (event instanceof MouseEvent) { extend(serializeMouseEvent(event)) }
+    extend(serializeWheelEvent(event));
-  if (event instanceof KeyboardEvent) { extend(serializeKeyboardEvent(event)) }
+  }
+  if (event instanceof MouseEvent) {
+    extend(serializeMouseEvent(event));
+  }
+  if (event instanceof KeyboardEvent) {
+    extend(serializeKeyboardEvent(event));
+  }
 
-  if (event instanceof InputEvent) { extend(serializeInputEvent(event, target)) }
+  if (event instanceof InputEvent) {
-  if (event instanceof PointerEvent) { extend(serializePointerEvent(event)) }
+    extend(serializeInputEvent(event, target));
-  if (event instanceof AnimationEvent) { extend(serializeAnimationEvent(event)) }
+  }
-  if (event instanceof TransitionEvent) { extend({ property_name: event.propertyName, elapsed_time: event.elapsedTime, pseudo_element: event.pseudoElement, }) }
+  if (event instanceof PointerEvent) {
-  if (event instanceof CompositionEvent) { extend({ data: event.data, }) }
+    extend(serializePointerEvent(event));
-  if (event instanceof DragEvent) { extend(serializeDragEvent(event)) }
+  }
-  if (event instanceof FocusEvent) { extend({}) }
+  if (event instanceof AnimationEvent) {
-  if (event instanceof ClipboardEvent) { extend({}) }
+    extend(serializeAnimationEvent(event));
+  }
+  if (event instanceof TransitionEvent) {
+    extend({
+      property_name: event.propertyName,
+      elapsed_time: event.elapsedTime,
+      pseudo_element: event.pseudoElement,
+    });
+  }
+  if (event instanceof CompositionEvent) {
+    extend({ data: event.data });
+  }
+  if (event instanceof DragEvent) {
+    extend(serializeDragEvent(event));
+  }
+  if (event instanceof FocusEvent) {
+    extend({});
+  }
+  if (event instanceof ClipboardEvent) {
+    extend({});
+  }
 
   // safari is quirky and doesn't have TouchEvent
-  if (typeof TouchEvent !== 'undefined' && event instanceof TouchEvent) { extend(serializeTouchEvent(event)); }
+  if (typeof TouchEvent !== "undefined" && event instanceof TouchEvent) {
+    extend(serializeTouchEvent(event));
+  }
 
-  if (event.type === "submit" || event.type === "reset" || event.type === "click" || event.type === "change" || event.type === "input") {
+  if (
+    event.type === "submit" ||
+    event.type === "reset" ||
+    event.type === "click" ||
+    event.type === "change" ||
+    event.type === "input"
+  ) {
     extend(serializeInputEvent(event as InputEvent, target));
   }
 
@@ -59,12 +96,15 @@ export function serializeEvent(event: Event, target: EventTarget): SerializedEve
   return contents;
 }
 
-function serializeInputEvent(event: InputEvent, target: EventTarget): SerializedEvent {
+function serializeInputEvent(
+  event: InputEvent,
+  target: EventTarget
+): SerializedEvent {
   let contents: SerializedEvent = {};
 
   // Attempt to retrieve the values from the form
   if (target instanceof HTMLElement) {
-    let values = retriveValues(event, target);
+    let values = retrieveValues(event, target);
     contents.values = values.values;
     contents.valid = values.valid;
   }
@@ -87,7 +127,7 @@ function serializeInputEvent(event: InputEvent, target: EventTarget): Serialized
   }
 
   if (event.target instanceof HTMLSelectElement) {
-    contents.value = retriveSelectValue(event.target).join(",");
+    contents.value = retrieveSelectValue(event.target).join(",");
   }
 
   // Ensure the serializer isn't quirky
@@ -95,12 +135,9 @@ function serializeInputEvent(event: InputEvent, target: EventTarget): Serialized
     contents.value = "";
   }
 
-
   return contents;
 }
 
-
-
 function serializeWheelEvent(event: WheelEvent): SerializedEvent {
   return {
     delta_x: event.deltaX,

packages/liveview/src/eval.rs

@@ -23,7 +23,7 @@ impl Document for LiveviewDocument {
     }
 }
 
-/// Reprents a liveview-target's JavaScript evaluator.
+/// Represents a liveview-target's JavaScript evaluator.
 pub(crate) struct LiveviewEvaluator {
     query: Query<serde_json::Value>,
 }

packages/router-macro/src/route_tree.rs

@@ -470,7 +470,7 @@ impl<'a> RouteTreeSegmentData<'a> {
 
 fn print_route_segment<'a, I: Iterator<Item = (usize, &'a RouteSegment)>>(
     mut s: std::iter::Peekable<I>,
-    sucess_tokens: TokenStream,
+    success_tokens: TokenStream,
     error_enum_name: &Ident,
     enum_variant: &Ident,
     variant_parse_error: &Ident,
@@ -478,7 +478,7 @@ fn print_route_segment<'a, I: Iterator<Item = (usize, &'a RouteSegment)>>(
     if let Some((i, route)) = s.next() {
         let children = print_route_segment(
             s,
-            sucess_tokens,
+            success_tokens,
             error_enum_name,
             enum_variant,
             variant_parse_error,
@@ -493,7 +493,7 @@ fn print_route_segment<'a, I: Iterator<Item = (usize, &'a RouteSegment)>>(
         )
     } else {
         quote! {
-            #sucess_tokens
+            #success_tokens
         }
     }
 }

packages/rsx-rosetta/README.md

@@ -27,9 +27,9 @@ However, it's NOT HTML. This is done since HTML is verbose and you'd need a dedi
 
 RSX is simple... It's similar enough to regular Rust code to trick most IDEs into automatically providing support for things like block selections, folding, highlighting, etc.
 
-To accomodate the transition from HTML to RSX, you might need to translate some existing code.
+To accommodate the transition from HTML to RSX, you might need to translate some existing code.
 
-This library provids a central AST that can accept a number of inputs:
+This library provides a central AST that can accept a number of inputs:
 
 - HTML
 - Syn (todo)

packages/rsx/src/component.rs

@@ -4,7 +4,7 @@
 //! diagnostics. This was refactored from a straightforward parser to this validation approach so
 //! that we can emit errors as diagnostics instead of returning results.
 //!
-//! Using this approach we can provide *much* better errors as well as partial expansion whereever
+//! Using this approach we can provide *much* better errors as well as partial expansion wherever
 //! possible.
 //!
 //! It does lead to the code actually being larger than it was before, but it should be much easier

packages/rsx/src/element.rs

@@ -598,7 +598,7 @@ fn merging_weird_fails() {
 }
 
 #[test]
-fn diagnositcs() {
+fn diagnostics() {
     let input = quote::quote! {
         p {
             class: "foo bar"

packages/rsx/src/ifmt.rs

@@ -13,7 +13,7 @@ use syn::{
 ///
 /// This wraps LitStr with some extra goodies like inline expressions and hot-reloading.
 /// Originally this was intended to provide named inline string interpolation but eventually Rust
-/// actualy shipped this!
+/// actually shipped this!
 #[derive(Debug, PartialEq, Eq, Clone, Hash)]
 pub struct IfmtInput {
     pub source: LitStr,

packages/rsx/src/rsx_block.rs

@@ -25,7 +25,7 @@ use syn::{
 ///  children
 /// }
 ///
-/// Does not make any guarnatees about the contents of the block - this is meant to be verified by the
+/// Does not make any guarantees about the contents of the block - this is meant to be verified by the
 /// element/component impls themselves.
 ///
 /// The name of the block is expected to be parsed by the parent parser. It will accept items out of
@@ -381,7 +381,7 @@ mod tests {
     /// Some tests of partial expansion to give better autocomplete
     #[test]
     fn partial_cases() {
-        let with_hander = quote! {
+        let with_handler = quote! {
             {
                 onclick: move |_| {
                     some.
@@ -389,7 +389,7 @@ mod tests {
             }
         };
 
-        let _block: RsxBlock = syn::parse2(with_hander).unwrap();
+        let _block: RsxBlock = syn::parse2(with_handler).unwrap();
     }
 
     /// Ensure the hotreload scoring algorithm works as expected

packages/rsx/src/scoring.rs

@@ -92,7 +92,7 @@ fn score_attr_value(old_attr: &AttributeValue, new_attr: &AttributeValue) -> usi
         //       right now going from float to int or vice versa will cause a full rebuild
         //       which can get confusing. if we can figure out a way to hotreload this, that'd be great
         (AttrLiteral(left), AttrLiteral(right)) => {
-            // We assign perfect matches for token resuse, to minimize churn on the renderer
+            // We assign perfect matches for token reuse, to minimize churn on the renderer
             match (&left.value, &right.value) {
                 // Quick shortcut if there's no change
                 (Fmted(old), Fmted(new)) if old == new => usize::MAX,
@@ -127,7 +127,7 @@ fn score_attr_value(old_attr: &AttributeValue, new_attr: &AttributeValue) -> usi
             score_attr_value(value_a, value_b)
         }
 
-        // todo: we should try and score recrusively if we can - templates need to propagate up their
+        // todo: we should try and score recursively if we can - templates need to propagate up their
         // scores. That would lead to a time complexity explosion but can be helpful in some cases.
         //
         // If it's expression-type things, we give a perfect score if they match completely

packages/rsx/src/template_body.rs

@@ -3,7 +3,7 @@
 //! The `Callbody` is the contents of the rsx! macro - this contains all the information about every
 //! node that rsx! directly knows about. For loops, if statements, etc.
 //!
-//! However, thre are multiple *templates* inside a callbody - due to how core clones templates and
+//! However, there are multiple *templates* inside a callbody - due to how core clones templates and
 //! just generally rationalize the concept of a template, nested bodies like for loops and if statements
 //! and component children are all templates, contained within the same Callbody.
 //!

packages/rsx/tests/hotreload_pattern.rs

@@ -194,13 +194,13 @@ fn invalid_cases() {
                 span { "asasddasdasd" }
 
                 // this is a new dynamic node, and thus can't be hot reloaded
-                // Eventualy we might be able to do a format like this, but not right now
+                // Eventually we might be able to do a format like this, but not right now
                 span { "123 {item}" }
             }
         }
     };
 
-    let new_invlaid_added = quote! {
+    let new_invalid_added = quote! {
         div {
             for item in vec![1, 2, 3] {
                 div { "asasddasdasd" }
@@ -225,7 +225,7 @@ fn invalid_cases() {
     let new_valid_removed: CallBody = syn::parse2(new_valid_removed).unwrap();
     let new_invalid_new_dynamic_internal: CallBody =
         syn::parse2(new_invalid_new_dynamic_internal).unwrap();
-    let new_invlaid_added: CallBody = syn::parse2(new_invlaid_added).unwrap();
+    let new_invalid_added: CallBody = syn::parse2(new_invalid_added).unwrap();
 
     assert!(hotreload_callbody::<Mock>(&old, &new_invalid, location).is_none());
     assert!(
@@ -244,7 +244,7 @@ fn invalid_cases() {
     assert_eq!(template.node_paths, &[&[], &[0u8, 0] as &[u8]]);
 
     // Adding a new dynamic node should not be hot reloadable
-    let added = hotreload_callbody::<Mock>(&old, &new_invlaid_added, location);
+    let added = hotreload_callbody::<Mock>(&old, &new_invalid_added, location);
     assert!(added.is_none());
 }
 

packages/ssr/tests/bool_attr.rs

@@ -1,7 +1,7 @@
 use dioxus::prelude::*;
 
 #[test]
-fn static_boolean_attributs() {
+fn static_boolean_attributes() {
     fn app() -> Element {
         rsx! {
             div { hidden: "false" }
@@ -19,7 +19,7 @@ fn static_boolean_attributs() {
 }
 
 #[test]
-fn dynamic_boolean_attributs() {
+fn dynamic_boolean_attributes() {
     fn app() -> Element {
         rsx! {
             div { hidden: false }

packages/static-generation/src/config.rs

@@ -2,7 +2,7 @@
 
 use std::path::PathBuf;
 
-/// Settings for a staticly generated site that may be hydrated in the browser
+/// Settings for a statically generated site that may be hydrated in the browser
 pub struct Config {
     #[cfg(feature = "server")]
     pub(crate) output_dir: PathBuf,

packages/web/NOTES.md

@@ -2,7 +2,7 @@
 // ## RequestAnimationFrame and RequestIdleCallback
 // ------------------------------------------------
 // React implements "jank free rendering" by deliberately not blocking the browser's main thread. For large diffs, long
-// running work, and integration with things like React-Three-Fiber, it's extremeley important to avoid blocking the
+// running work, and integration with things like React-Three-Fiber, it's extremely important to avoid blocking the
 // main thread.
 //
 // React solves this problem by breaking up the rendering process into a "diff" phase and a "render" phase. In Dioxus,

packages/web/ric_raf/README.md

@@ -1,3 +1,3 @@
-requestIdleCallback and requestAnimationFrame implemenation
+requestIdleCallback and requestAnimationFrame implementation
 
 These currently actually slow down our DOM patching and thus are temporarily removed. Technically we can schedule around rIC and rAF but choose not to.

packages/web/src/cfg.rs

@@ -29,7 +29,7 @@ impl Config {
     #[cfg(feature = "hydrate")]
     /// Enable SSR hydration
     ///
-    /// This enables Dioxus to pick up work from a pre-renderd HTML file. Hydration will completely skip over any async
+    /// This enables Dioxus to pick up work from a pre-rendered HTML file. Hydration will completely skip over any async
     /// work and suspended nodes.
     ///
     /// Dioxus will load up all the elements with the `dio_el` data attribute into memory when the page is loaded.

packages/web/src/lib.rs

@@ -215,7 +215,7 @@ pub async fn run(virtual_dom: VirtualDom, web_config: Config) -> ! {
         //
         // 1. wait for the browser to give us "idle" time
         // 2. During idle time, diff the dom
-        // 3. Stop diffing if the deadline is exceded
+        // 3. Stop diffing if the deadline is exceeded
         // 4. Wait for the animation frame to patch the dom
 
         // wait for the mainthread to schedule us in