Merge pull request #5 from ehammons11/fix-spelling

Author: bbohlender

README.md

@@ -61,7 +61,7 @@ return (
 
 - [What is a timeline?](https://pmndrs.github.io/timeline/getting-started/1-what-is-a-timeline)
 - [Building your First Timeline](https://pmndrs.github.io/timeline/getting-started/2-first-timeline)
-- [Overview over All Functions](https://pmndrs.github.io/timeline/getting-started/3-overview)
+- [Overview of All Functions](https://pmndrs.github.io/timeline/getting-started/3-overview)
 - [Tutorial: Building Complex Timelines using Parallel](https://pmndrs.github.io/timeline/tutorials/5-parallel)
 - [Tutorial: Building Graph Timelines](https://pmndrs.github.io/timeline/tutorials/6-graph)
 - [Tutorial: Use pmndrs/timeline in vanilla three.js](https://pmndrs.github.io/timeline/tutorials/7-vanilla)

docs/getting-started/0-introduction.mdx

@@ -65,5 +65,5 @@ This project is supported by a few companies and individuals building cutting ed
 [ ] record, useRecordedTimeline, ... => allows to bind the timeline progress to any controls (e.g. scrolling); allowing using markers to attach scroll positions (e.g. button center screen) to the time of the timeline  
 [ ] yield* cleanup(() => ...)  
 [ ] add external methods for the graph (set/get state externally)  
-[ ] queue with optional priority sorting and cancelation (configure what happens whith the current timeline when canceled)  
+[ ] queue with optional priority sorting and cancellation (configure what happens with the current timeline when canceled)  
 [ ] timeline visualization and `yield* marker(...)` to appear in the visualization (e.g. log values or complete json objects)

docs/getting-started/1-what-is-a-timeline.mdx

@@ -88,7 +88,7 @@ yield * reusableFadeIn()
 
 ### Running timelines
 
-- **React**: use `useRunTimelinereusableTimeline, deps)`; it wires into `useFrame` and restarts on `deps` change.
+- **React**: use `useRunTimeline(reusableTimeline, deps)`; it wires into `useFrame` and restarts on `deps` change.
 - **Vanilla**: use `runTimeline(reusableTimeline)` to get an update function you call each frame with `deltaSeconds`.
 
 ```ts

docs/tutorials/5-parallel.mdx

@@ -4,7 +4,7 @@ description: Run multiple timelines concurrently and wait for all or race the fi
 nav: 5
 ---
 
-Use `parallel('all' | 'race', ...)` to orchestrate concurrent behaviors. In this example we move two cubes simultaneously and continue only when both finishes.
+Use `parallel('all' | 'race', ...)` to orchestrate concurrent behaviors. In this example we move two cubes simultaneously and continue only when both finish.
 
 > [!NOTE]
 > you can pass conditionally included timelines by using booleans; falsey entries are ignored. On `'race'`, non‑winning timelines are canceled and their cleanups run.

examples/showcase/lamborghini.tsx

@@ -164,7 +164,7 @@ export function Lamborghini(props: any) {
     // ⬇⬇⬇ All this is probably better fixed in Blender ...
     Object.values(nodes).forEach((node: any) => {
       if (node.isMesh) {
-        // Fix glas, normals look messed up in the original, most likely deformed meshes bc of compression :/
+        // Fix glass, normals look messed up in the original, most likely deformed meshes bc of compression :/
         if (node.name.startsWith('glass')) node.geometry.computeVertexNormals()
         // Fix logo, too dark
         if (node.name === 'silver_001_BreakDiscs_0')

packages/react/src/action.tsx

@@ -11,8 +11,8 @@ export function Action({
     () => ({}),
     [],
   )
-  //if we have no dependencies, we re-write the params so that the are available when the action is (re-)started
-  //if we have depdendencies, we re-attach the raw input params when they change
+  //if we have no dependencies, we re-write the params so that they are available when the action is (re-)started
+  //if we have dependencies, we re-attach the raw input params when they change
   if (dependencies == null) {
     for (const key in paramsWithoutDeps) {
       delete paramsWithoutDeps[key as keyof typeof paramsWithoutDeps]

packages/react/src/graph.tsx

@@ -3,7 +3,7 @@ import { RootState } from '@react-three/fiber'
 import { createContext, forwardRef, ReactNode, useContext, useEffect, useImperativeHandle, useMemo } from 'react'
 import { AttachableProvider, useAttachTimeline } from './attachable.js'
 
-const GrapthContext = createContext<GraphTimeline<RootState> | undefined>(undefined)
+const GraphContext = createContext<GraphTimeline<RootState> | undefined>(undefined)
 
 export const Graph = forwardRef<
   GraphTimeline<RootState>,
@@ -14,10 +14,10 @@ export const Graph = forwardRef<
   graph.exitState = exitState
   useAttachTimeline(() => graph.run(), [])
   useImperativeHandle(ref, () => graph, [graph])
-  return <GrapthContext.Provider value={graph}>{children}</GrapthContext.Provider>
+  return <GraphContext.Provider value={graph}>{children}</GraphContext.Provider>
 })
 
-export function GrapthState({
+export function GraphState({
   name,
   transitionTo,
   children,
@@ -28,14 +28,14 @@ export function GrapthState({
   children?: ReactNode
   dependencies?: Array<unknown>
 }) {
-  const graph = useContext(GrapthContext)
+  const graph = useContext(GraphContext)
   if (graph == null) {
-    throw new Error(`GrapthState can only be used inside the Graph component.`)
+    throw new Error(`GraphState can only be used inside the Graph component.`)
   }
   const replacable = useMemo(() => new ReplacableTimeline(), [])
   const transitionsWithoutDeps = useMemo<GraphTimelineStateTransitions<RootState>>(() => ({}), [])
-  //if we have no dependencies, we re-write the transitions so that the are available when the graph state is (re-)started
-  //if we have depdendencies, we re-attach the raw input transitions when they change
+  //if we have no dependencies, we re-write the transitions so that they are available when the graph state is (re-)started
+  //if we have dependencies, we re-attach the raw input transitions when they change
   if (dependencies == null) {
     for (const key in transitionsWithoutDeps) {
       delete transitionsWithoutDeps[key as keyof typeof transitionsWithoutDeps]

packages/timeline/src/ease.ts

@@ -283,7 +283,7 @@ function quaternionToTangentSpace(quaternion: Quaternion, target: Vector3, delta
     return
   }
   const theta = Math.acos(w)
-  //nromalize target and multiply by theta (direction = axis, length = angle)
+  //normalize target and multiply by theta (direction = axis, length = angle)
   target.multiplyScalar(theta / s)
   //cut off very small values to prevent numerical drift when converting quaternions from and to tangent space
 }

packages/timeline/src/replaceable.ts

@@ -15,7 +15,7 @@ export class ReplacableTimeline<T = unknown> {
 
   attach(timeline: ReusableTimeline<T>): void {
     if (this.isAttached) {
-      throw new Error(`cannot attach to a timeline that has a already another timeline attached`)
+      throw new Error(`cannot attach to a timeline that already has another timeline attached`)
     }
     this.isAttached = true
     this.currentTimeline = timeline
@@ -59,7 +59,7 @@ export class ReplacableTimeline<T = unknown> {
         SynchronousAbortSignal.any([restartController.signal, cancelController.signal]),
       )
       this.restartControllers.delete(restartController)
-      //if we arrive at the while condition without beeing aborted, that means the current timeline successfully finished, or the canceController was called
+      //if we arrive at the while condition without being aborted, that means the current timeline successfully finished, or the cancelController was called
     } while (restartController.signal.aborted)
   }
 }

packages/timeline/src/sequential.ts

@@ -8,7 +8,7 @@ export class SequentialTimeline<T = unknown> extends Singleton<T> {
 
   attach(index: number, timeline: ReusableTimeline<T>): void {
     if (this.timelines[index] != null) {
-      throw new Error(`there's already an timeline set at index '${index}'`)
+      throw new Error(`there's already a timeline set at index '${index}'`)
     }
     this.timelines[index] = timeline
   }