From e66c347e6997b9ff87defb52c3b7d362ee10edea Mon Sep 17 00:00:00 2001
From: Sander Moolin <sandermoolin@gmail.com>
Date: Mon, 22 Mar 2021 09:30:25 -0400
Subject: [PATCH] update cameras to extend base component and render slot

---
 src/core/Camera.js             | 11 +++++++++++
 src/core/OrthographicCamera.js |  3 ++-
 src/core/PerspectiveCamera.js  |  3 ++-
 3 files changed, 15 insertions(+), 2 deletions(-)
 create mode 100644 src/core/Camera.js

diff --git a/src/core/Camera.js b/src/core/Camera.js
new file mode 100644
index 0000000..659af02
--- /dev/null
+++ b/src/core/Camera.js
@@ -0,0 +1,11 @@
+// import Object3D from '../core/Object3D.js';
+
+export default {
+  // TODO: eventually extend Object3D, for now: error 'injection "scene" not found'
+  // because camera is a sibling of scene in Trois
+  // extends: Object3D,
+  inject: ['three'],
+  render() {
+    return this.$slots.default ? this.$slots.default() : [];
+  },
+}
\ No newline at end of file
diff --git a/src/core/OrthographicCamera.js b/src/core/OrthographicCamera.js
index 14dc5e2..f221491 100644
--- a/src/core/OrthographicCamera.js
+++ b/src/core/OrthographicCamera.js
@@ -1,8 +1,10 @@
 import { OrthographicCamera } from 'three';
 import { watch } from 'vue';
 import { bindProp } from '../tools.js';
+import Camera from './Camera.js';
 
 export default {
+  extends: Camera,
   name: 'OrthographicCamera',
   inject: ['three'],
   props: {
@@ -28,6 +30,5 @@ export default {
 
     this.three.camera = this.camera;
   },
-  render() { return []; },
   __hmrId: 'OrthographicCamera',
 };
diff --git a/src/core/PerspectiveCamera.js b/src/core/PerspectiveCamera.js
index 7ba8e6c..0c818fa 100644
--- a/src/core/PerspectiveCamera.js
+++ b/src/core/PerspectiveCamera.js
@@ -1,8 +1,10 @@
 import { PerspectiveCamera } from 'three';
 import { watch } from 'vue';
 import { bindProp } from '../tools.js';
+import Camera from './Camera.js';
 
 export default {
+  extends: Camera,
   name: 'PerspectiveCamera',
   inject: ['three'],
   props: {
@@ -29,6 +31,5 @@ export default {
 
     this.three.camera = this.camera;
   },
-  render() { return []; },
   __hmrId: 'PerspectiveCamera',
 };