fix #9 again

package.json

@@ -1,6 +1,6 @@
 {
   "name": "troisjs",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "scripts": {
     "dev": "vite",
     "build": "vite build",

src/core/Group.js

@@ -1,28 +1,30 @@
 import { Group } from 'three';
-import { inject } from 'vue';
 import useBindProp from '../use/useBindProp.js';
 
 export default {
-  inject: ['three', 'scene'],
+  inject: {
+    three: 'three',
+    scene: 'scene',
+    group: { default: null },
+  },
   props: {
     position: Object,
     rotation: Object,
     scale: Object,
   },
-  setup(props) {
-    const parent = inject('group', inject('scene'));
-    const group = new Group();
-    useBindProp(props, 'position', group.position);
-    useBindProp(props, 'rotation', group.rotation);
-    useBindProp(props, 'scale', group.scale);
-    return { parent, group };
-  },
   provide() {
     return {
       group: this.group,
     };
   },
   created() {
+    this.parent = this.group ? this.group : this.scene;
+
+    this.group = new Group();
+    useBindProp(this, 'position', this.group.position);
+    useBindProp(this, 'rotation', this.group.rotation);
+    useBindProp(this, 'scale', this.group.scale);
+
     this.parent.add(this.group);
   },
   unmounted() {

src/meshes/InstancedMesh.js

@@ -1,9 +1,13 @@
 import { InstancedMesh } from 'three';
-import { inject, watch } from 'vue';
+import { watch } from 'vue';
 import useBindProp from '../use/useBindProp.js';
 
 export default {
-  inject: ['three', 'scene'],
+  inject: {
+    three: 'three',
+    scene: 'scene',
+    group: { default: null },
+  },
   props: {
     materialId: String,
     count: Number,
@@ -11,15 +15,14 @@ export default {
     castShadow: Boolean,
     receiveShadow: Boolean,
   },
-  setup() {
-    const parent = inject('group', inject('scene'));
-    return { parent };
-  },
   provide() {
     return {
       mesh: this,
     };
   },
+  created() {
+    this.parent = this.group ? this.group : this.scene;
+  },
   beforeMount() {
     if (!this.$slots.default) {
       console.error('Missing Geometry');

src/meshes/Sprite.js

@@ -1,18 +1,20 @@
 import { Sprite, SpriteMaterial, TextureLoader } from 'three';
-import { inject } from 'vue';
 import useBindProp from '../use/useBindProp.js';
 
 export default {
   emits: ['ready', 'loaded'],
-  inject: ['three', 'scene'],
+  inject: {
+    three: 'three',
+    scene: 'scene',
+    group: { default: null },
+  },
   props: {
     src: String,
     position: Object,
     scale: Object,
   },
-  setup() {
+  created() {
-    const parent = inject('group', inject('scene'));
+    this.parent = this.group ? this.group : this.scene;
-    return { parent };
   },
   mounted() {
     this.texture = new TextureLoader().load(this.src, this.onLoaded);