refactor: more semantic graphics internals

packages/graphics/container.js

@@ -9,7 +9,7 @@ export class Container extends Renderable {
     this._children = [];
     this._childrenIndexes = new Map();
     this._isDirty = false;
-    this.internal = PIXI ? new PIXI.Container() : undefined;
+    this.container = PIXI ? new PIXI.Container() : undefined;
   }
 
   addChild(child) {
@@ -17,7 +17,7 @@ export class Container extends Renderable {
     this.isDirty = true;
     const index = this._children.push(child) - 1;
     this._childrenIndexes.set(child, index);
-    this.internal.addChild(child.internal);
+    this.container.addChild(child.internal);
   }
 
   get children() {
@@ -31,6 +31,10 @@ export class Container extends Renderable {
     super.destroy();
   }
 
+  get internal() {
+    return this.container;
+  }
+
   get isDirty() {
     return this._isDirty;
   }
@@ -48,7 +52,7 @@ export class Container extends Renderable {
       return;
     }
     this._children.splice(index, 1);
-    this.internal.removeChild(child.internal);
+    this.container.removeChild(child.internal);
   }
   removeChild(child) {
     this._removeChild(child);
@@ -90,7 +94,7 @@ export class Container extends Renderable {
       const rIndex = this._childrenIndexes.get(r);
       return lIndex - rIndex;
     });
-    this.internal.children = this._children.map((child) => {
+    this.container.children = this._children.map((child) => {
       return child.internal;
     });
   }

packages/graphics/primitives.js

@@ -15,29 +15,29 @@ export class Primitives extends Renderable {
 
   constructor() {
     super();
-    this.internal = new PIXI.Graphics();
+    this.primitives = new PIXI.Graphics();
   }
 
   clear() {
-    this.internal.clear();
+    this.primitives.clear();
   }
 
   drawCircle(position, radius, lineStyle, fillStyle) {
     this._wrapStyle('drawCircle', '3rd', lineStyle, fillStyle, () => {
-      this.internal.drawCircle(position[0], position[1], radius);
+      this.primitives.drawCircle(position[0], position[1], radius);
     });
   }
 
   drawLine(p1, p2, lineStyle, fillStyle) {
     this._wrapStyle('drawLine', '3rd', lineStyle, fillStyle, () => {
-      this.internal.moveTo(p1[0], p1[1]);
-      this.internal.lineTo(p2[0], p2[1]);
+      this.primitives.moveTo(p1[0], p1[1]);
+      this.primitives.lineTo(p2[0], p2[1]);
     });
   }
 
   drawRectangle(rectangle, lineStyle, fillStyle) {
     this._wrapStyle('drawLine', '2nd', lineStyle, fillStyle, () => {
-      this.internal.drawRect(
+      this.primitives.drawRect(
         rectangle[0],
         rectangle[1],
         rectangle[2],
@@ -46,6 +46,10 @@ export class Primitives extends Renderable {
     });
   }
 
+  get internal() {
+    return this.primitives;
+  }
+
   _wrapStyle(method, where, lineStyle, fillStyle, fn) {
     if (!lineStyle) {
       throw new TypeError(
@@ -54,13 +58,13 @@ export class Primitives extends Renderable {
     }
     if (fillStyle) {
       const {color} = fillStyle;
-      this.internal.beginFill(color.toInteger(), color.alpha)
+      this.primitives.beginFill(color.toInteger(), color.alpha)
     }
     const {color, thickness} = lineStyle;
-    this.internal.lineStyle(thickness, color.toInteger(), color.alpha)
+    this.primitives.lineStyle(thickness, color.toInteger(), color.alpha)
     fn();
     if (fillStyle) {
-      this.internal.endFill();
+      this.primitives.endFill();
     }
   }
 

packages/graphics/sprite.js

@@ -7,7 +7,11 @@ export class Sprite extends Renderable {
   constructor(image) {
     super();
     this._image = image;
-    this.internal = new PIXI.Sprite(image.texture);
+    this.sprite = new PIXI.Sprite(image.texture);
+  }
+
+  get internal() {
+    return this.sprite;
   }
 
   get image() {