fix(core): added raw values to state rather than RefImp

packages/tres/src/core/useInstanceCreator/index.ts

@@ -161,12 +161,9 @@ export function useInstanceCreator(prefix: string) {
             name,
             setup(_props, { slots, attrs, ...ctx }) {
               const { state } = useTres()
-              const { scene: fallback } = useScene()
               const { onLoop } = useRenderLoop()
-              const scene = inject('local-scene', fallback)
-              const { raycaster: raycasterFallback } = useRaycaster()
-              const raycaster = state.raycaster || raycasterFallback /* 
-              const currentInstance = inject<Ref>('currentInstance') */
+              const scene = state.scene
+              const raycaster = state.raycaster
               const { pushCamera } = useCamera()
 
               let instance = createInstance(threeObj, attrs, slots)
@@ -178,15 +175,15 @@ export function useInstanceCreator(prefix: string) {
 
               // If the instance is a valid Object3D, add it to the scene
               if (instance.isObject3D) {
-                scene?.value.add(instance)
+                scene?.add(instance)
               }
 
               let prevInstance: TresEvent | null = null
               let currentInstance: TresEvent | null = null
               if (instance.isMesh) {
                 onLoop(() => {
-                  if (instance && raycaster?.value) {
-                    const intersects = raycaster?.value.intersectObjects(scene.value.children)
+                  if (instance && raycaster && scene?.children) {
+                    const intersects = raycaster.intersectObjects(scene?.children)
 
                     if (intersects.length > 0) {
                       currentInstance = intersects[0]
@@ -216,13 +213,13 @@ export function useInstanceCreator(prefix: string) {
                 })
               }
 
-              if (scene?.value && instance.isFog) {
-                scene.value.fog = instance as unknown as FogBase
+              if (scene && instance.isFog) {
+                scene.fog = instance as unknown as FogBase
               }
 
               if (import.meta.hot) {
                 import.meta.hot.on('vite:beforeUpdate', () => {
-                  scene.value.remove(instance)
+                  scene?.remove(instance)
                 })
 
                 import.meta.hot.on('vite:afterUpdate', () => {
@@ -230,7 +227,7 @@ export function useInstanceCreator(prefix: string) {
                   processProps(attrs, instance)
 
                   if (instance.isObject3D) {
-                    scene?.value.add(instance)
+                    scene?.add(instance)
                   }
                 })
               }

packages/tres/src/core/useRaycaster/index.ts

@@ -8,7 +8,7 @@ const currentInstance = ref(null)
 
 export function useRaycaster() {
   const { setState } = useTres()
-  setState('raycaster', raycaster)
+  setState('raycaster', raycaster.value)
   setState('pointer', pointer)
   setState('currentInstance', currentInstance)
 

packages/tres/src/core/useScene/component.ts

@@ -1,9 +1,6 @@
-import { useCamera } from '/@/core/'
-import type { Renderer } from 'three'
 import { defineComponent, inject, provide, Ref } from 'vue'
-import { useRenderLoop } from '../useRenderLoop'
-import { useScene } from './'
-import { useRaycaster } from '../useRaycaster'
+import type { Renderer } from 'three'
+import { useCamera, useTres, useRenderLoop, useScene, useRaycaster } from '/@/core/'
 
 /**
  * Vue component for rendering a Tres component.
@@ -11,6 +8,7 @@ import { useRaycaster } from '../useRaycaster'
 export const Scene = defineComponent({
   name: 'Scene',
   setup(_props, { slots }) {
+    const { setState } = useTres()
     const { scene } = useScene()
     const renderer = inject<Ref<Renderer>>('renderer')
     const { activeCamera } = useCamera()
@@ -18,6 +16,7 @@ export const Scene = defineComponent({
     const { onLoop } = useRenderLoop()
 
     provide('local-scene', scene)
+    setState('scene', scene.value)
 
     onLoop(() => {
       raycaster.value.setFromCamera(pointer.value, activeCamera.value)