From e7b0f9a2660755b2e52b0e5a2438f6a0822693e8 Mon Sep 17 00:00:00 2001
From: Robert Long <robert@robertlong.me>
Date: Thu, 25 Jun 2020 10:43:33 -0700
Subject: [PATCH 1/7] Update Docs for New Component Schemas

---
 site/docs/manual/Architecture.md    | 343 ++++++++++++++--------------
 site/docs/manual/Getting-started.md |  61 +++--
 2 files changed, 209 insertions(+), 195 deletions(-)

diff --git a/site/docs/manual/Architecture.md b/site/docs/manual/Architecture.md
index 8a9ffc84..94213689 100644
--- a/site/docs/manual/Architecture.md
+++ b/site/docs/manual/Architecture.md
@@ -50,34 +50,77 @@ world = new World();
 
 ## Components
 A `Component` ([API Reference](/api/classes/component)) is an object that can store data but should have not behaviour (As that should be handled by systems). There is not a mandatory way to define a component.
-It could just be a function:
+
+To create a component you must extend the `Component` class and define a schema:
 ```javascript
-function ComponentA() {
-  this.number = 10;
-  this.string = "Hello";
+import { Component, Types } from 'ecsy';
+
+class ComponentA extends Component {}
+
+ComponentA.schema = {
+  number: { type: Types.Number, default: 10 },
+  string: { type: Types.String, default: "Hello" }
 }
 ```
 
-The recommended way is using ES6 classes and extending the `Component` class:
+The schema is used to set the default values of a component. ECSY also uses it to implement the default `.copy()`, `.clone()`, and `.reset()` methods. Schemas can also be used for tooling and serialization, something we plan on covering in the future.
+
+Each property in a schema represents a property on the component:
+
+```javascript
+const component = new ComponentA();
+console.log(component.number === 10); // true
+```
+
+The `type` field must be set for each property. Each type has a default value as well as `.copy()` and `.clone()` functions.
+
+ECSY comes with a few primitive types:
+- `Types.Number`: Defaults to `0`.
+- `Types.Boolean`: Defaults to `false`.
+- `Types.String`: Defaults to `""`.
+- `Types.Object`: Defaults to `undefined`. Copies by value, not a deep clone.
+- `Types.JSON`: Defaults to `null`. Copies/clones via `JSON.parse(JSON.stringify(src))`, this is somewhat expensive but sometimes useful.
+- `Types.Array`: Defaults to `[]`. Copies/clones each item by value.
+
+You can also define your own types with `createType()`[API Reference](/api#createType).
+
 ```javascript
-import { Component } from 'ecsy';
+import { createType, copyCopyable, cloneClonable } from "ecsy";
 
-class ComponentA extends Component {
+class Vector2 {
   constructor() {
-    super();
-    this.number = 10;
-    this.string = "Hello";
+    this.x = 0;
+    this.y = 0;
+  }
+
+  set(x, y) {
+    this.x = x;
+    this.y = y;
+    return this;
+  }
+
+  copy(source) {
+    this.x = source.x;
+    this.y = source.y;
+    return this;
+  }
+
+  clone() {
+    return new Vector2().set(this.x, this.y);
   }
 }
-```
 
-It is also recommended to implement the following functions on every component class:
-- `copy(src)`: Copy the values from the `src` component.
-- `reset()`: Reset the component's attributes to their default values.
+export const Vector2Type = createType({
+  name: "Vector2",
+  default: new Vector2(),
+  copy: copyCopyable,
+  clone: cloneClonable
+});
+```
 
 ### Tag Components
 
-Some components don't store data and are used just as tags. In these cases it is recommended to extends `TagComponent` ([API Reference](/api/classes/tagcomponent) so the engine could, eventually, optimize the usage of this component.
+Some components don't store data and are used just as tags. In these cases it is recommended to extend `TagComponent` ([API Reference](/api/classes/tagcomponent) so the engine could, eventually, optimize the usage of this component.
 
 ```javascript
 class Enemy extends TagComponent {}
@@ -90,11 +133,11 @@ entity.addComponent(Enemy);
 Components could be made of multiple attributes, but sometimes they just contain a single attribute.
 In these cases using the attribute's name to match the component's name may seem handy:
 ```javascript
-class Acceleration {
-  constructor() {
-    this.acceleration = 0.1;
-  }
-}
+class Acceleration extends Component {}
+
+Acceleration.schema = {
+  acceleration: { type: Types.Number, default: 0.1 }
+};
 ```
 
 But when accessing the value it seems redundant to use two `acceleration` references:
@@ -105,11 +148,11 @@ let acceleration = entity.getComponent(Acceleration).acceleration;
 
 We suggest to use `value` as the attribute name for these components as:
 ```javascript
-class Acceleration {
-  constructor() {
-    this.value = 0.1;
-  }
-}
+class Acceleration extends Component {}
+
+Acceleration.schema = {
+  value: { type: Types.Number, default: 0.1 }
+};
 
 let acceleration = entity.getComponent(Acceleration).value;
 ```
@@ -119,7 +162,7 @@ Eventually we could end up adding some syntactic sugar for these type of compone
 let acceleration = entity.getComponentValue(Acceleration);
 ```
 
-### Components pooling
+### Component pooling
 
 Usually an ECSY application will involve adding and removing components in real time. Allocating resources in a performance sensitive application is considered a bad pattern because the garbage collector will get called often and may impact performance.
 In order to minimize it, ECSY includes pooling for components.
@@ -130,35 +173,111 @@ entity.addComponent(ComponentA)
 the engine will try to reuse a `ComponentA` instance, from the pool of components previously created, and it won't allocate a new one instead.
 When releasing that component, by calling `entity.removeComponent(ComponentA)`, it will get returned to the pool, ready to be used by another entity.
 
-ECSY should know how to reset a component to its original state, that's why it's highly recommended that components implements a `reset` method to get the benefits from pooling.
+ECSY should know how to reset a component to its original state, if your component has the proper schema defined, ECSY will do this for you.
+
+#### Custom Components
+
+Sometimes it's not possible to define a component with a schema. If you still want to get the benefits of object pooling you can override some of the methods on the `Component` class.
 
 ```javascript
-// Example of components with `reset` methods implemented
+class ColorArray extends Component {
+  constructor(props) {
+    // Pass false to disable using the schema for default values.
+    super(false);
 
-class List extends Component {
-  constructor() {
+    // Set your own default values instead
     this.value = [];
   }
 
+  copy(src) {
+    this.value.length = src.value.length;
+
+    for (let i = 0; i < src.value.length; i++) {
+      const srcColor = src.value[i];
+      const destColor = this.value[i];
+
+      destColor.r = srcColor.r;
+      destColor.g = srcColor.g;
+      destColor.b = srcColor.b;
+    }
+  }
+
+  /**
+   * We don't need to override clone in this case.
+   * clone() {
+   *  return new this.constructor().copy(this);
+   * }
+   **/
+
   reset() {
-    this.value.length = 0;
+    this.value.forEach(color => {
+      color.r = 0;
+      color.g = 0;
+      color.b = 0;
+    });
   }
 }
+```
 
-class Position extends Component {
-  constructor() {
-    this.reset();
+In extreme cases, you may experience performance bottlenecks due to the default implementation of the `Component` class. If you experience this, you can override that specific component with your own faster implementation.
+
+#### Disable Component Pooling
+
+In other cases you may want to disable component pooling altogether. Some components can't be copied or cloned properly.
+
+In this case you can disable component pooling when you first register a component:
+
+```javascript
+class AudioListener extends Component {
+  constructor(props) {
+    super(false);
+    this.listener = props.listener;
+  }
+
+  clone() {
+    throw new Error("unimplemented");
+  }
+
+  copy() {
+    throw new Error("unimplemented");
   }
 
   reset() {
-    this.x = 0;
-    this.y = 0;
-    this.z = 0;
+    throw new Error("unimplemented");
   }
 }
+
+// Pass false to registerComponent to disable component pooling
+world.registerComponent(AudioListener, false);
 ```
 
-It is possible to use the helper function `createComponentClass` to ease the creation of components as it will implement the `reset` and `copy` functions automatically.
+#### Custom Component Pooling
+
+Additionally, you can implement your own component pool or configure component pool settings by passing an instance of `ObjectPool` as the second argument to `registerComponent`
+
+```javascript
+import { ObjectPool } from 'ecsy';
+
+// Register MyComponent with an ObjectPool that has 1000 initial instances of MyComponent
+world.registerComponent(MyComponent, new ObjectPool(MyComponent, 1000));
+
+// Use your own custom ObjectPool implementation
+class MyObjectPool extends ObjectPool {
+  acquire() {
+    // Your implementation
+  }
+
+  release(item) {
+    // Your implementation
+  }
+
+  expand(count) {
+    // Your implementation
+  }
+}
+
+world.registerComponent(MyComponent, new MyObjectPool(MyComponent, 1000));
+```
 
 ### System State Components
 
@@ -167,18 +286,17 @@ They can be used to detect when an entity has been added or removed from a query
 
 SSC can be defined by extending `SystemStateComponent` [API Reference](/api/classes/systemstatecomponent) instead of `Component`. Once the SSC is defined, it can be used as any other component.
 ```javascript
-class StateComponentGeometry extends SystemStateComponent {
-  constructor() {
-    super();
-    this.meshReference = null;
-  }
-}
+class StateComponentGeometry extends SystemStateComponent {}
 
-class Geometry {
-  constructor() {
-    this.primitive = "box";
-  }
-}
+StateComponentGeometry.schema = {
+  meshReference: { type: Types.Object }
+};
+
+class Geometry extends Component {}
+
+Geometry.schema = {
+  primitive: { type: Types.String, default: "box" }
+};
 ```
 
 In this example `StateComponentGeometry` is used to store the mesh resources created as defined in the `Geometry` component.
@@ -222,122 +340,6 @@ MySystem.queries = {
 };
 ```
 
-## Create component helper
-Creating a component and implementing its `reset` function can be a repetitive task specially when we are working with simple data types.
-At the same time it could lead to side effects errors, specially when pooling components, if there is some bug on one of the components' `reset` function for example.
-In order to ease this task, it is possible to use a helper function called `createComponentClass(schema, className)` which takes a JSON schema with the definition of the component and generate the class, automatically implementing the `reset`, `copy` and `clear` functions.
-
-The JSON defines the number of the attributes of the components, its default value and type.
-
-```javascript
-var ExampleComponent = createComponentClass({
-  number:  { default: 0.5 },
-  string:  { default: "foo" },
-  bool:    { default: true },
-  array:   { default: [1, 2, 3] },
-  vector3: { default: new Vector3(4, 5, 6), type: CustomTypes.Vector3 }
-}, "ExampleComponent");
-```
-
-Basic types (number, boolean, string and arrays) are inferred by the default value. It is possible to use custom type defined by `createType` (explained in the next section).
-The second parameter for `createComponentClass` is the class name for the component. The name is not mandatory but is strongly recommended as it will ease debugging and tracing.
-
-The previous example will create a `ExampleComponent` component that is ready to add to entities, as if it were created manually:
-```javascript
-entity.addComponent(ExampleComponent);
-```
-
-In fact the equivalent of that code could be something like:
-```javascript
-class ExampleComponent extends Component {
-  constructor() {
-    super();
-    this.reset();
-  }
-
-  clear() {
-    this.number = 0;
-    this.string = "";
-    this.bool = false;
-    this.array.length = 0;
-    this.vector3.set(0, 0, 0);
-  }
-
-  copy(src) {
-    this.number = src.number;
-    this.string = src.string;
-    this.bool = src.bool;
-    this.array = src.array.splice();;
-    this.vector3.copy(src.vector3);
-  }
-
-  reset() {
-    this.number = 0.5;
-    this.string = "foo";
-    this.bool = true;
-    this.array = [1, 2, 3];
-    this.vector3 = new Vector3(4, 5, 6);
-  }
-}
-```
-
-Even using such a simple example, without complex data types, is easy to understand that implementing all the functions `clear`, `copy` and `reset` could lead to small bugs that could have unexpected side effects that should not be present when using the `createComponentClass`.
-
-It is important to note that when defining an schema every attribute must have a known type, if no data type is provided for complex types, `createComponentClass` will not implement `clear`, `copy` and `reset` and it will just return the component class with the attributes defined.
-
-### Data types
-
-It is possible to use custom types, to be used in the schema definition when calling `createComponentClass`, by defining them with `createType`:
-
-```javascript
-createType({
-  baseType: T,
-  create: defaultValue => {},
-  reset (src, key, defaultValue) => {},
-  clear: (src, key) => {},
-})
-```
-
-Where:
-- `create(defaultValue)`: Return a value of type `baseType` using a default value.
-- `reset(src, key, defaultValue)`: Reset the `key` attribute on the object `src` with the default value.
-- `clear(src, key)`: Clear the `key` attribute on the object `src`.
-- `copy(src, dst, key)`: Copy the `key` attribute from the object `src` to the object `src`.
-
-Type definition for basic standard types are [already defined](https://github.com/MozillaReality/ecsy/blob/dev/src/StandardTypes.js) in the library: `number`, `boolean`, `string` and `array`.
-
-The following code implements a custom type for a `Vector3` imported from an external library:
-
-```javascript
-  var CustomVector3 = createType({
-    baseType: Vector3,
-    create: defaultValue => {
-      var v = new Vector3(0, 0, 0);
-      if (typeof defaultValue !== "undefined") {
-        v.copy(defaultValue);
-      }
-      return v;
-    },
-    reset: (src, key, defaultValue) => {
-      if (typeof defaultValue !== "undefined") {
-        src[key].copy(defaultValue);
-      } else {
-        src[key].set(0, 0, 0);
-      }
-    },
-    clear: (src, key) => {
-      src[key].set(0, 0, 0);
-    }
-  });
-```
-
-As the type for `Vector3` has been already defined, it is possible to use it to define a component:
-```javascript
-let ExampleComponent = createComponentClass({
-  vector3: { default: new Vector3(4, 5, 6), type: CustomVector3 }
-}, "ExampleComponent");
-```
-
 ## Entities
 An entity is an object that has a unique ID. Its purpose is to group components together. [API Reference](/api/classes/entity).
 
@@ -700,12 +702,11 @@ When a component or an entity is removed, one `to be removed` flag is activated
 // Component to identify a wolf
 class Wolf extends TagComponent {}
 
-// Component to store how long is sleeping the wolf
-class Sleeping extends Component {
-  constructor() {
-    super();
-    this.startSleepingTime = 0;
-  }
+// Component to store how long the wolf is sleeping 
+class Sleeping extends Component {}
+
+Sleeping.schema = {
+  startSleepingTime: { type: Types.Number }
 }
 
 // This system will wake up sleeping wolves randomly
diff --git a/site/docs/manual/Getting-started.md b/site/docs/manual/Getting-started.md
index ad7add32..41730815 100644
--- a/site/docs/manual/Getting-started.md
+++ b/site/docs/manual/Getting-started.md
@@ -28,19 +28,28 @@ world = new World();
 ## Creating components
 Components are just objects that hold data. We can use any way to define them, for example using ES6 class syntax (recommended):
 ```javascript
-class Acceleration {
-  constructor() {
-    this.value = 0.1;
-  }
-}
+class Acceleration extends Component {}
 
-class Position {
-  constructor() {
-    this.x = 0;
-    this.y = 0;
-    this.z = 0;
-  }
-}
+Acceleration.schema = {
+  value: { type: Types.Number, default: 0.1 }
+};
+
+class Position extends Component {}
+
+Position.schema = {
+  x: { type: Types.Number },
+  y: { type: Types.Number },
+  z: { type: Types.Number }
+};
+
+```
+
+Then we need to register components with the world to use them.
+
+```javascript
+  world
+    .registerComponent(Acceleration)
+    .registerComponent(Position);
 ```
 
 [More info on how to create components](/manual/Architecture?id=components).
@@ -188,19 +197,23 @@ import { World, System } from 'ecsy';
 
 let world = new World();
 
-class Acceleration {
-  constructor() {
-    this.value = 0.1;
-  }
-}
+class Acceleration extends Component {}
 
-class Position {
-  constructor() {
-    this.x = 0;
-    this.y = 0;
-    this.z = 0;
-  }
-}
+Acceleration.schema = {
+  value: { type: Types.Number, default: 0.1 }
+};
+
+class Position extends Component {}
+
+Position.schema = {
+  x: { type: Types.Number },
+  y: { type: Types.Number },
+  z: { type: Types.Number }
+};
+
+world
+  .registerComponent(Acceleration)
+  .registerComponent(Position);
 
 class PositionLogSystem extends System {
   init() {}

From a60b106bfedb58e7974ef0b421a236cb53fccea7 Mon Sep 17 00:00:00 2001
From: Robert Long <robert@robertlong.me>
Date: Thu, 25 Jun 2020 10:51:37 -0700
Subject: [PATCH 2/7] Update README.md

---
 README.md | 42 ++++++++++++++++++++++++------------------
 1 file changed, 24 insertions(+), 18 deletions(-)

diff --git a/README.md b/README.md
index cce39e5c..1583017f 100644
--- a/README.md
+++ b/README.md
@@ -61,7 +61,7 @@ npm install --save ecsy
     </style>
     
     <script type="module">
-      import { World, System, TagComponent } from "https://ecsy.io/build/ecsy.module.js";
+      import { World, System, Component, TagComponent, Types } from "https://ecsy.io/build/ecsy.module.js";
 
       const NUM_ELEMENTS = 50;
       const SPEED_MULTIPLIER = 0.3;
@@ -79,25 +79,27 @@ npm install --save ecsy
       //----------------------
       
       // Velocity component
-      class Velocity {
-        constructor() {
-          this.x = this.y = 0;
-        }
-      }
+      class Velocity extends Component {}
+
+      Velocity.schema = {
+        x: { type: Types.Number },
+        y: { type: Types.Number }
+      };
 
       // Position component
-      class Position {
-        constructor() {
-          this.x = this.y = 0;
-        }
-      }
+      class Position extends Component {}
+
+      Position.schema = {
+        x: { type: Types.Number },
+        y: { type: Types.Number }
+      };
       
       // Shape component
-      class Shape {
-        constructor() {
-          this.primitive = 'box';
-        }
-      }
+      class Shape extends Component {}
+
+      Shape.schema = {
+        primitive: { type: Types.String, default: 'box' }
+      };
       
       // Renderable component
       class Renderable extends TagComponent {}
@@ -178,9 +180,13 @@ npm install --save ecsy
         renderables: { components: [Renderable, Shape] }
       }
       
-      // Create world and register the systems on it
+      // Create world and register the components and systems on it
       var world = new World();
       world
+        .registerComponent(Velocity)
+        .registerComponent(Position)
+        .registerComponent(Shape)
+        .registerComponent(Renderable)
         .registerSystem(MovableSystem)
         .registerSystem(RendererSystem);
 
@@ -236,7 +242,7 @@ npm install --save ecsy
   </body>
 </html>
 ```
-[Try it on glitch](https://glitch.com/~ecsy-boxes-and-circles)
+[Try it on glitch](https://glitch.com/~ecsy-0-3-0-boxes-and-circles)
 
 
 You can also include the hosted javascript directly on your HTML:

From 571701654f35f6a73aee2d7c1fe38aad41bc793e Mon Sep 17 00:00:00 2001
From: Robert Long <robert@robertlong.me>
Date: Fri, 26 Jun 2020 10:58:38 -0700
Subject: [PATCH 3/7] Export Entity as _Entity in typescript defs

---
 src/index.d.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/index.d.ts b/src/index.d.ts
index 026e62e5..0b45a586 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -1,6 +1,6 @@
 export * from "./World";
 export * from "./System";
-export * from "./Entity";
+export { Entity as _Entity } from "./Entity";
 export * from "./Component";
 export * from "./TagComponent";
 export * from "./SystemStateComponent";

From e4082cc687eafbc275de077e2090d2e79c67387c Mon Sep 17 00:00:00 2001
From: Robert Long <robert@robertlong.me>
Date: Fri, 26 Jun 2020 11:09:58 -0700
Subject: [PATCH 4/7] Export _Entity and Entity types

---
 src/index.d.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/index.d.ts b/src/index.d.ts
index 0b45a586..9ece5c07 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -1,8 +1,10 @@
+import { Entity } from "./Entity";
 export * from "./World";
 export * from "./System";
-export { Entity as _Entity } from "./Entity";
+export *from "./Entity";
 export * from "./Component";
 export * from "./TagComponent";
 export * from "./SystemStateComponent";
 export * from "./Types";
+export const _Entity: Entity;
 export as namespace ecsy;

From 21153e6ad66232242c22705bb58d5d0fc1e89abc Mon Sep 17 00:00:00 2001
From: Robert Long <robert@robertlong.me>
Date: Fri, 26 Jun 2020 11:18:05 -0700
Subject: [PATCH 5/7] Try another export for _Entity

---
 src/index.d.ts | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/index.d.ts b/src/index.d.ts
index 9ece5c07..51b40c70 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -1,10 +1,9 @@
-import { Entity } from "./Entity";
 export * from "./World";
 export * from "./System";
-export *from "./Entity";
+export * from "./Entity";
+export { Entity as _Entity } from "./Entity";
 export * from "./Component";
 export * from "./TagComponent";
 export * from "./SystemStateComponent";
 export * from "./Types";
-export const _Entity: Entity;
 export as namespace ecsy;

From cc01b20cf6e3afab7cd3d02804381972a126333a Mon Sep 17 00:00:00 2001
From: Robert Long <robert@robertlong.me>
Date: Fri, 26 Jun 2020 12:50:01 -0700
Subject: [PATCH 6/7] Add Architecture docs edits

---
 site/docs/manual/Architecture.md | 26 +++++++++++++++++++++++---
 1 file changed, 23 insertions(+), 3 deletions(-)

diff --git a/site/docs/manual/Architecture.md b/site/docs/manual/Architecture.md
index 94213689..65421625 100644
--- a/site/docs/manual/Architecture.md
+++ b/site/docs/manual/Architecture.md
@@ -63,7 +63,7 @@ ComponentA.schema = {
 }
 ```
 
-The schema is used to set the default values of a component. ECSY also uses it to implement the default `.copy()`, `.clone()`, and `.reset()` methods. Schemas can also be used for tooling and serialization, something we plan on covering in the future.
+The schema is used to set the default values of a component. ECSY also uses it to implement the default `.copy()`, `.clone()`, and `.reset()` methods. Setting the initial values of a component, and resetting them via `.reset()` are necessary for pooling. When you define a schema, you get this for free! Schemas can also be used for tooling and serialization, something we plan on covering in the future.
 
 Each property in a schema represents a property on the component:
 
@@ -177,10 +177,14 @@ ECSY should know how to reset a component to its original state, if your compone
 
 #### Custom Components
 
-Sometimes it's not possible to define a component with a schema. If you still want to get the benefits of object pooling you can override some of the methods on the `Component` class.
+Sometimes it's not possible to define a component with a schema. If you still want to get the benefits of object pooling or redefine how `.copy()` or `.clone()` work, you can override any or all of the methods on the `Component` class.
 
 ```javascript
 class ColorArray extends Component {
+  /**
+   * The constructor should set the initial values for a component.
+   * Override this method to set your own initial values.
+   **/
   constructor(props) {
     // Pass false to disable using the schema for default values.
     super(false);
@@ -189,6 +193,11 @@ class ColorArray extends Component {
     this.value = [];
   }
 
+  /**
+   * The copy method is used when copying properties from one component to another.
+   * Copy is used when copying/cloning entities/components, it is not used in component pooling.
+   * You can re-implement this method to increase performance or deal with complex data structures.
+   **/
   copy(src) {
     this.value.length = src.value.length;
 
@@ -200,15 +209,26 @@ class ColorArray extends Component {
       destColor.g = srcColor.g;
       destColor.b = srcColor.b;
     }
+
+    return this;
   }
 
   /**
-   * We don't need to override clone in this case.
+   * Clone returns a new, identical instance of a component.
+   * We don't need to override clone in this case. However, if you needed to pass an argument
+   * to the constructor, you could override clone to do so.
+   * 
    * clone() {
    *  return new this.constructor().copy(this);
    * }
    **/
 
+  /**
+   * The reset method is used to reset the component back to it's initial state.
+   * It's used in component pools when a component is disposed. It can be called fairly often so it is a common method
+   * to optimize when you are adding/removing a lot of this type of component. You'll want to avoid memory allocation
+   * as much as possible in the reset method. Try to reuse existing data structures whenever possible.
+   **/
   reset() {
     this.value.forEach(color => {
       color.r = 0;

From 78ff4484e7fd24a333a7845e0daced5d0a705abe Mon Sep 17 00:00:00 2001
From: Robert Long <robert@robertlong.me>
Date: Fri, 26 Jun 2020 14:03:10 -0700
Subject: [PATCH 7/7] Types.Object -> Types.Ref

---
 site/docs/manual/Architecture.md              |  4 +--
 .../ball-example/babylon/components.mjs       |  2 +-
 .../ball-example/three/components.mjs         |  2 +-
 site/examples/canvas/components.js            |  2 +-
 src/Types.d.ts                                |  2 +-
 src/Types.js                                  |  4 +--
 test/unit/Component.test.js                   | 33 +++++++++----------
 7 files changed, 23 insertions(+), 26 deletions(-)

diff --git a/site/docs/manual/Architecture.md b/site/docs/manual/Architecture.md
index 65421625..7a0625e4 100644
--- a/site/docs/manual/Architecture.md
+++ b/site/docs/manual/Architecture.md
@@ -78,7 +78,7 @@ ECSY comes with a few primitive types:
 - `Types.Number`: Defaults to `0`.
 - `Types.Boolean`: Defaults to `false`.
 - `Types.String`: Defaults to `""`.
-- `Types.Object`: Defaults to `undefined`. Copies by value, not a deep clone.
+- `Types.Ref`: Defaults to `undefined`. Copies by reference, not a deep clone.
 - `Types.JSON`: Defaults to `null`. Copies/clones via `JSON.parse(JSON.stringify(src))`, this is somewhat expensive but sometimes useful.
 - `Types.Array`: Defaults to `[]`. Copies/clones each item by value.
 
@@ -309,7 +309,7 @@ SSC can be defined by extending `SystemStateComponent` [API Reference](/api/clas
 class StateComponentGeometry extends SystemStateComponent {}
 
 StateComponentGeometry.schema = {
-  meshReference: { type: Types.Object }
+  meshReference: { type: Types.Ref }
 };
 
 class Geometry extends Component {}
diff --git a/site/examples/ball-example/babylon/components.mjs b/site/examples/ball-example/babylon/components.mjs
index a883f44a..4381c314 100644
--- a/site/examples/ball-example/babylon/components.mjs
+++ b/site/examples/ball-example/babylon/components.mjs
@@ -14,7 +14,7 @@ PulsatingScale.schema = {
 export class Object3D extends Component {}
 
 Object3D.schema = {
-  object: { type: Types.Object }
+  object: { type: Types.Ref }
 };
 
 export class Timeout extends Component {}
diff --git a/site/examples/ball-example/three/components.mjs b/site/examples/ball-example/three/components.mjs
index e48f6292..62a6475a 100644
--- a/site/examples/ball-example/three/components.mjs
+++ b/site/examples/ball-example/three/components.mjs
@@ -14,7 +14,7 @@ PulsatingScale.schema = {
 export class Object3D extends Component {}
 
 Object3D.schema = {
-  object: { type: Types.Object }
+  object: { type: Types.Ref }
 };
 
 export class Timeout extends Component {}
diff --git a/site/examples/canvas/components.js b/site/examples/canvas/components.js
index 86ad6778..a80379ea 100644
--- a/site/examples/canvas/components.js
+++ b/site/examples/canvas/components.js
@@ -20,7 +20,7 @@ Circle.schema = {
 export class CanvasContext extends Component {}
 
 CanvasContext.schema = {
-  ctx: { type: Types.Object },
+  ctx: { type: Types.Ref },
   width: { type: Types.Number },
   height: { type: Types.Number }
 };
diff --git a/src/Types.d.ts b/src/Types.d.ts
index 1213a8ed..65daa5f0 100644
--- a/src/Types.d.ts
+++ b/src/Types.d.ts
@@ -19,7 +19,7 @@ export interface PropTypes {
   Boolean: PropType<boolean>;
   String: PropType<string>;
   Array: PropType<Array<any>>;
-  Object: PropType<any>;
+  Ref: PropType<any>;
   JSON: PropType<any>;
 }
 
diff --git a/src/Types.js b/src/Types.js
index 35f55f85..a75a93e9 100644
--- a/src/Types.js
+++ b/src/Types.js
@@ -77,8 +77,8 @@ export const Types = {
     clone: cloneArray
   }),
 
-  Object: createType({
-    name: "Object",
+  Ref: createType({
+    name: "Ref",
     default: undefined,
     copy: copyValue,
     clone: cloneValue
diff --git a/test/unit/Component.test.js b/test/unit/Component.test.js
index 238971e4..2f1628db 100644
--- a/test/unit/Component.test.js
+++ b/test/unit/Component.test.js
@@ -23,15 +23,15 @@ TestComponent.schema = {
   string: { type: Types.String },
   number: { type: Types.Number },
   boolean: { type: Types.Boolean },
-  object: { type: Types.Object },
+  ref: { type: Types.Ref },
   json: { type: Types.JSON },
   vector3: { type: CustomTypes.Vector3 },
   stringWithDefault: { type: Types.String, default: "test" },
   numberWithDefault: { type: Types.Number, default: 3 },
   booleanWithDefault: { type: Types.Boolean, default: true },
-  objectWithDefault: {
-    type: Types.Object,
-    default: { value: "test object" }
+  refWithDefault: {
+    type: Types.Ref,
+    default: { value: "test ref" }
   },
   jsonWithDefault: { type: Types.JSON, default: { value: "test json" } },
   vector3WithDefault: {
@@ -46,17 +46,14 @@ test("default values", t => {
   t.is(component.string, "");
   t.is(component.number, 0);
   t.is(component.boolean, false);
-  t.is(component.object, undefined);
+  t.is(component.ref, undefined);
   t.is(component.json, null);
   t.true(new Vector3().equals(component.vector3));
   t.is(component.stringWithDefault, "test");
   t.is(component.numberWithDefault, 3);
   t.is(component.booleanWithDefault, true);
-  t.deepEqual(component.objectWithDefault, { value: "test object" });
-  t.is(
-    component.objectWithDefault,
-    TestComponent.schema.objectWithDefault.default
-  );
+  t.deepEqual(component.refWithDefault, { value: "test ref" });
+  t.is(component.refWithDefault, TestComponent.schema.refWithDefault.default);
   t.deepEqual(component.jsonWithDefault, { value: "test json" });
   t.not(
     component.jsonWithDefault,
@@ -70,13 +67,13 @@ test("copy component", t => {
   srcComponent.string = "abc";
   srcComponent.number = 1;
   srcComponent.boolean = true;
-  srcComponent.object = { value: "test 1" };
+  srcComponent.ref = { value: "test 1" };
   srcComponent.json = { value: "test 2" };
   srcComponent.vector3.set(4, 5, 6);
   srcComponent.stringWithDefault = "test 3";
   srcComponent.numberWithDefault = 2;
   srcComponent.booleanWithDefault = false;
-  srcComponent.objectWithDefault = { value: "test 4" };
+  srcComponent.refWithDefault = { value: "test 4" };
   srcComponent.jsonWithDefault = { value: "test 5" };
   srcComponent.vector3WithDefault.set(7, 8, 9);
 
@@ -86,13 +83,13 @@ test("copy component", t => {
   t.is(destComponent.string, "abc");
   t.is(destComponent.number, 1);
   t.is(destComponent.boolean, true);
-  t.is(destComponent.object.value, "test 1");
+  t.is(destComponent.ref.value, "test 1");
   t.is(destComponent.json.value, "test 2");
   t.true(new Vector3(4, 5, 6).equals(destComponent.vector3));
   t.is(destComponent.stringWithDefault, "test 3");
   t.is(destComponent.numberWithDefault, 2);
   t.is(destComponent.booleanWithDefault, false);
-  t.is(destComponent.objectWithDefault.value, "test 4");
+  t.is(destComponent.refWithDefault.value, "test 4");
   t.is(destComponent.jsonWithDefault.value, "test 5");
   t.true(new Vector3(7, 8, 9).equals(destComponent.vector3WithDefault));
 });
@@ -102,13 +99,13 @@ test("clone component", t => {
   srcComponent.string = "abc";
   srcComponent.number = 1;
   srcComponent.boolean = true;
-  srcComponent.object = { value: "test 1" };
+  srcComponent.ref = { value: "test 1" };
   srcComponent.json = { value: "test 2" };
   srcComponent.vector3.set(4, 5, 6);
   srcComponent.stringWithDefault = "test 3";
   srcComponent.numberWithDefault = 2;
   srcComponent.booleanWithDefault = false;
-  srcComponent.objectWithDefault = { value: "test 4" };
+  srcComponent.refWithDefault = { value: "test 4" };
   srcComponent.jsonWithDefault = { value: "test 5" };
   srcComponent.vector3WithDefault.set(7, 8, 9);
 
@@ -117,13 +114,13 @@ test("clone component", t => {
   t.is(destComponent.string, "abc");
   t.is(destComponent.number, 1);
   t.is(destComponent.boolean, true);
-  t.is(destComponent.object.value, "test 1");
+  t.is(destComponent.ref.value, "test 1");
   t.is(destComponent.json.value, "test 2");
   t.true(new Vector3(4, 5, 6).equals(destComponent.vector3));
   t.is(destComponent.stringWithDefault, "test 3");
   t.is(destComponent.numberWithDefault, 2);
   t.is(destComponent.booleanWithDefault, false);
-  t.is(destComponent.objectWithDefault.value, "test 4");
+  t.is(destComponent.refWithDefault.value, "test 4");
   t.is(destComponent.jsonWithDefault.value, "test 5");
   t.true(new Vector3(7, 8, 9).equals(destComponent.vector3WithDefault));
 });