fix typos in docs (#277)

Shopify · Mar 19, 2022 · 55893c1 · 55893c1
1 parent 2079720
commit 55893c1
Show file tree

Hide file tree

Showing 9 changed files with 12 additions and 12 deletions.
diff --git a/docs/docs/animations/values.md b/docs/docs/animations/values.md
@@ -92,7 +92,7 @@ const Demo = () => {
 ## Value Effect
 
 The `useValueEffect` hook allows you to execute change on value change.
-In the example below we execute a callback on every frame (everytime the clock value changes).
+In the example below we execute a callback on every frame (every time the clock value changes).
 
 ```tsx twoslash
 import React, { useEffect } from "react";

diff --git a/docs/docs/image-svg.md b/docs/docs/image-svg.md
@@ -11,7 +11,7 @@ If the root dimensions are in absolute units, the width/height properties have n
 
 | Name      | Type      |  Description                                                  |
 |:----------|:----------|:--------------------------------------------------------------|
-| svg.      | `SVG` | SVG Image. |
+| svg       | `SVG` | SVG Image. |
 | width?    | `number`  | Width of the destination image. This is used to resolve the initial viewport when the root SVG width is specified in relative units. |
 | height?   | `number`  | Height of the destination image. This is used to resolve the initial viewport when the root SVG height is specified in relative units.                              |
 
@@ -45,7 +45,7 @@ const ImageSVGDemo = () => {
 };
 ```
 
-You can also use an inlined string as SVG (using `Skia.SVG.MakeFromString`:
+You can also use an inlined string as SVG (using `Skia.SVG.MakeFromString`):
 
 ```tsx twoslash
 import React from "react";
@@ -114,7 +114,7 @@ Would need to be rewritten as:
 
 The `opacity` attribute also applies to both the `fill` and `stroke` attributes.
 
-### Font Familly
+### Font Family
 
 When rendering your SVG with Skia, all fonts available in your app are also available to your SVG. However, the way you can set the `font-family` attribute is not flexible.
 This is [a known issue](https://github.com/google/skia/blob/main/modules/svg/src/SkSVGText.cpp#L77) in the SVG Skia module. 

diff --git a/docs/docs/paint/overview.md b/docs/docs/paint/overview.md
@@ -18,7 +18,7 @@ The following properties to the Paint component:
 * [strokeMiter](properties.md#strokeMiter) 
 * [opacity](properties.md#opacity)      
 
-A paint component can additionnaly receive the following components as children:
+A paint component can additionally receive the following components as children:
 * [Shaders](/docs/shaders/overview) 
 * [Image Filters](/docs/image-filters/overview)
 * [Color Filters](/docs/color-filters)

diff --git a/docs/docs/shaders/images.md b/docs/docs/shaders/images.md
@@ -18,7 +18,7 @@ It will use cubic sampling.
 | fm?        | `FilterMode`.  | Can be `linear` or `nearest`. |
 | mm?        | `MipmapMode`   | Can be `none`, `linear` or `nearest`. |
 | fit?       | `Fit`.         | Calculate the transformation matrix to fit the rectangle defined by `fitRect`. See [images](/docs/images). |
-| rect?      | SkRect`        | The destination reactangle to calculate the transformation matrix via the `fit` property. |
+| rect?      | SkRect`        | The destination rectangle to calculate the transformation matrix via the `fit` property. |
 | transform? | `Transforms2d` | see [transformations](/docs/group#transformations). |
 
 ### Example

diff --git a/docs/docs/shaders/perlin-noise.md b/docs/docs/shaders/perlin-noise.md
@@ -17,7 +17,7 @@ Returns a shader with Perlin Fractal Noise.
 | octaves     | `number`         |  |
 | seed        | `number`     | |
 | tileWidth?  | `number`     | if this and `tileHeight` are non-zero, the frequencies will be modified so that the noise will be tileable for the given size. |
-| tileHeigth? | `number`       | if this and `tileWidth` are non-zero, the frequencies will be modified so that the noise will be tileable for the given size. |
+| tileHeight? | `number`       | if this and `tileWidth` are non-zero, the frequencies will be modified so that the noise will be tileable for the given size. |
 
 ### Example
 ```tsx twoslash
@@ -59,7 +59,7 @@ Returns a shader with Perlin Turbulence.
 | octaves     | `number`         |  |
 | seed        | `number`     | |
 | tileWidth?  | `number`     | if this and `tileHeight` are non-zero, the frequencies will be modified so that the noise will be tileable for the given size. |
-| tileHeigth? | `number`       | if this and `tileWidth` are non-zero, the frequencies will be modified so that the noise will be tileable for the given size. |
+| tileHeight? | `number`       | if this and `tileWidth` are non-zero, the frequencies will be modified so that the noise will be tileable for the given size. |
 
 ### Example
 ```tsx twoslash

diff --git a/docs/docs/shapes/fitbox.md b/docs/docs/shapes/fitbox.md
@@ -2,7 +2,7 @@
 id: fitbox
 title: FitBox
 sidebar_label: FitBox
-slug: /shapes/fibox
+slug: /shapes/fitbox
 ---
 
 The `FitBox` component allows you to scale drawings to fit into a destination rectangle automatically.

diff --git a/docs/docs/shapes/path.md b/docs/docs/shapes/path.md
@@ -12,7 +12,7 @@ In Skia, paths are semantically identical to [SVG Paths](https://developer.mozil
 | path      | `IPath` or `string` | Path to draw. Can be a string using the [SVG Path notation](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths#line_commands) or an object created with `Skia.Path.Make()`. |
 | start     | `number` | Trims the start of the path. Value is in the range `[0, 1]` (default is 0). |
 | end       | `number` | Trims the end of the path. Value is in the range `[0, 1]` (default is 1). |
-| stroke    | `StrokeOptions` | Turns this path into the filled equivalent of the stroked path. This will fail if the path is a hairline. `StrokeOptions` describes how the stroked path should look. It contains three properties: `width`, `strokeMiterlimit` and, `precision` |
+| stroke    | `StrokeOptions` | Turns this path into the filled equivalent of the stroked path. This will fail if the path is a hairline. `StrokeOptions` describes how the stroked path should look. It contains three properties: `width`, `strokeMiterLimit` and, `precision` |
 
 ### Using SVG Notation
 

diff --git a/docs/docs/shapes/vertices.md b/docs/docs/shapes/vertices.md
@@ -39,7 +39,7 @@ const VerticesDemo = () => {
           ty="repeat"
         />
       </Paint>
-      {/* Here we specificed colors, the default blendMode is dstOver */}
+      {/* Here we specified colors, the default blendMode is dstOver */}
       <Vertices vertices={vertices} colors={colors} />
       <Group transform={[{ translateX: 128 }]}>
         {/* Here we didn't specify colors, the default blendMode is srcOver */}

diff --git a/docs/docs/text/glyphs.md b/docs/docs/text/glyphs.md
@@ -9,7 +9,7 @@ This component draws a run of glyphs, at corresponding positions, in a given fon
 
 | Name        | Type       |  Description                                                           |
 |:------------|:-----------|:-----------------------------------------------------------------------|
-| glyphs      | `Ghlyph[]` | Glyphs to draw                                                         |
+| glyphs      | `Glyph[]`  | Glyphs to draw                                                         |
 | x?          | `number`.  | x coordinate of the origin of the entire run. Default is 0             |
 | y?          | `number`.  | y coordinate of the origin of the entire run. Default is 0             |
 | font        | `Font`     | Font to use (see [Fonts](/docs/text/fonts))                            |