Fix typos in the docs (#1927)

Co-authored-by: mundry <mundry@users.noreply.github.com>

packages/docs/src/en/directives/bind.md

@@ -50,7 +50,7 @@ In cases like these, if you prefer a less verbose syntax you can use JavaScript'
 
 ```html
 <div :class="show ? '' : 'hidden'">
-<!-- Is equivalant to: -->
+<!-- Is equivalent to: -->
 <div :class="show || 'hidden'">
 ```
 
@@ -58,7 +58,7 @@ The inverse is also available to you. Suppose instead of `open`, we use a variab
 
 ```html
 <div :class="closed ? 'hidden' : ''">
-<!-- Is equivalant to: -->
+<!-- Is equivalent to: -->
 <div :class="closed && 'hidden'">
 ```
 
@@ -73,7 +73,7 @@ Alpine offers an additional syntax for toggling classes if you prefer. By passin
 
 This technique offers a unique advantage to other methods. When using object-syntax, Alpine will NOT preserve original classes applied to an element's `class` attribute.
 
-For example, if you wanted to apply the "hidden" class to an element before Alpine loads, AND use Alpine to toggle its existance you can only achieve that behavior using object-syntax:
+For example, if you wanted to apply the "hidden" class to an element before Alpine loads, AND use Alpine to toggle its existence you can only achieve that behavior using object-syntax:
 
 ```html
 <div class="hidden" :class="{ 'hidden': ! show }">

packages/docs/src/en/directives/cloak.md

@@ -7,7 +7,7 @@ title: cloak
 
 Sometimes, when you're using AlpineJS for a part of your template, there is a "blip" where you might see your uninitialized template after the page loads, but before Alpine loads.
 
-`x-cloak` addresses this scenerio by hiding the element it's attached to until Alpine is fully loaded on the page.
+`x-cloak` addresses this scenario by hiding the element it's attached to until Alpine is fully loaded on the page.
 
 For `x-cloak` to work however, you must add the following CSS to the page.
 

packages/docs/src/en/directives/model.md

@@ -300,7 +300,7 @@ This is handy for things like real-time form-validation where you might not want
 <a name="number"></a>
 ### `.number`
 
-By default, any data stored in a property via `x-model` is stored as a string. To force Alpine to store the value as a JavaScript number, add the `.number` modifer.
+By default, any data stored in a property via `x-model` is stored as a string. To force Alpine to store the value as a JavaScript number, add the `.number` modifier.
 
 ```html
 <input type="text" x-model.number="age">

packages/docs/src/en/directives/on.md

@@ -263,7 +263,7 @@ By adding `.camel` in the above example, Alpine is now listening for `customEven
 <a name="passive"></a>
 ### .passive
 
-Browsers optimize scrolling on pages to be fast and smooth even when JavaScript is being executed on the page. However, improperly implemented touch and wheel listeners can block this optimization and cause poor site performace.
+Browsers optimize scrolling on pages to be fast and smooth even when JavaScript is being executed on the page. However, improperly implemented touch and wheel listeners can block this optimization and cause poor site performance.
 
 If you are listening for touch events, it's important to add `.passive` to your listeners to not block scroll performance.
 

packages/docs/src/en/directives/transition.md

@@ -54,7 +54,7 @@ You can configure the duration you want for a transition with the `.duration` mo
 
 The above `<div>` will transition for 500 milliseconds when entering, and 250 milliseconds when leaving.
 
-This difference in duration generally desireable default. If you wish to customize the durations specifically for entering and leaving, you can do that like so:
+This difference in duration generally desirable default. If you wish to customize the durations specifically for entering and leaving, you can do that like so:
 
 ```html
 <div ...
@@ -102,7 +102,7 @@ The `.scale` modifier also offers the ability to configure its scale values AND
 
 The above snippet will scale the element up and down by 80%.
 
-Again, you may customize these values seperately for enter and leaving transitions like so:
+Again, you may customize these values separately for enter and leaving transitions like so:
 
 ```html
 <div ...

packages/docs/src/en/essentials/lifecycle.md

@@ -62,7 +62,7 @@ Now, this expression will be called right away, and re-called every time `open`
 The two main behavioral differences with this approach are:
 
 1. The provided code will be run right away AND when data changes (`$watch` is "lazy" -- won't run until the first data change)
-2. No knowledge of the previous value. (The callback provided to `$watch` recieves both the new value AND the old one)
+2. No knowledge of the previous value. (The callback provided to `$watch` receives both the new value AND the old one)
 
 [→ Read more about x-effect](/directives/effect)
 

packages/docs/src/en/essentials/templating.md

@@ -168,7 +168,7 @@ Let's take a look at each of these approaches:
 <a name="transition-helpers"></a>
 ### Transition helpers
 
-Let's say you wanted to make the duration of the transition longer, you can manually specificy that using the `.duration` modifier like so:
+Let's say you wanted to make the duration of the transition longer, you can manually specify that using the `.duration` modifier like so:
 
 ```html
 <div x-show="open" x-transition.duration.500ms>

packages/docs/src/en/globals/alpine-store.md

@@ -57,7 +57,7 @@ You can also modify properties within the store and everything that depends on t
 <button x-data @click="$store.darkMode.toggle()">Toggle Dark Mode</button>
 ```
 
-Additionally, you can access a store externally using `Alpine.store()` by ommiting the second parameter like so:
+Additionally, you can access a store externally using `Alpine.store()` by omitting the second parameter like so:
 
 ```html
 <script>

packages/docs/src/en/plugins/persist.md

@@ -78,7 +78,7 @@ You can try this for yourself by incrementing the "count" in the above example,
 <a name="how-it-works"></a>
 ## How does it work?
 
-If a value is wrapped in `$persist`, on initialization Alpine will register it's own watcher for that value. Now everytime that value changes for any reason, Alpine will store the new value in [localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage).
+If a value is wrapped in `$persist`, on initialization Alpine will register its own watcher for that value. Now everytime that value changes for any reason, Alpine will store the new value in [localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage).
 
 Now when a page is reloaded, Alpine will check localStorage (using the name of the property as the key) for a value. If it finds one, it will set the property value from localStorage immediately.
 

packages/docs/src/en/start-here.md

@@ -5,7 +5,7 @@ title: Start Here
 
 # Start Here
 
-Create a blank HTML file somewhere on you computer with a name like: `i-love-alpine.html`
+Create a blank HTML file somewhere on your computer with a name like: `i-love-alpine.html`
 
 Using a text editor, fill the file with these contents:
 
@@ -225,7 +225,7 @@ Now there's quite a bit happening here, so let's go through this snippet piece b
 <a name="multi-line-formatting"></a>
 ### Multi line formatting
 
-The first thing I'd like to point out is that `x-data` now has a lot more going on in it than before. To make it easier to write and read, we've split it up into multiple lines in our HTML. This is completely optional and we'll talk more in a bit about how to avoid this problem alltogether, but for now, we'll keep all of this JavaScript directly in the HTML.
+The first thing I'd like to point out is that `x-data` now has a lot more going on in it than before. To make it easier to write and read, we've split it up into multiple lines in our HTML. This is completely optional and we'll talk more in a bit about how to avoid this problem altogether, but for now, we'll keep all of this JavaScript directly in the HTML.
 
 <a name="binding-to-inputs"></a>
 ### Binding to inputs

packages/docs/src/en/upgrade-guide.md

@@ -54,7 +54,7 @@ Upgrading from Alpine V2 to V3 should be fairly painless. In many cases, NOTHING
 </div>
 ```
 
-For a smoother upgrade experience, you can optionally replace all instances of `$el` with a custom magic called `$root`, then add the following code to your site to mimmick the behavior:
+For a smoother upgrade experience, you can optionally replace all instances of `$el` with a custom magic called `$root`, then add the following code to your site to mimic the behavior:
 
 ```html
 <script>