feat(core): usage of window global variable for extendability on other pkgs

packages/tres/src/App.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 /* import { Color } from 'three' */
-import { useTweakPane, OrbitControls } from '../../cientos/src'
+import { useTweakPane, OrbitControls, TransformControls } from '../../cientos/src'
 /* import TestSphere from '/@/components/TestSphere.vue' */
 import Text3D from '/@/components/Text3D.vue'
 /* import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'

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

@@ -1,5 +1,5 @@
 import { useInstanceCreator } from '/@/core'
-import { App, ref, Component, Ref } from 'vue'
+import { App, ref, Component, Ref, provide } from 'vue'
 import * as THREE from 'three'
 import { TresCatalogue } from '/@/types'
 
@@ -8,20 +8,26 @@ const catalogue: Ref<TresCatalogue> = ref({ ...THREE })
 delete catalogue.value.Scene
 
 let localApp: App
-
 export function useCatalogue(app?: App, prefix = 'Tres') {
   if (!localApp && app) {
     localApp = app
   }
   const { createComponentInstances } = useInstanceCreator(prefix)
 
+  provide('catalogue', catalogue)
+
   const extend = (objects: any) => {
     catalogue.value = Object.assign(catalogue.value, objects)
     const components = createComponentInstances(ref(objects))
 
-    components.forEach(([key, cmp]) => {
-      localApp.component(key as string, cmp as Component)
-    })
+    if (localApp) {
+      components.forEach(([key, cmp]) => {
+        // If the component is not already registered, register it
+        if (!localApp._context.components[key as string]) {
+          localApp.component(key as string, cmp as Component)
+        }
+      })
+    }
   }
 
   return {

packages/tres/src/env.d.ts

@@ -8,3 +8,14 @@ declare module '*.vue' {
 }
 
 declare module '*.glsl' {}
+
+declare global {
+  // Define the window interface, with type annotations for the properties and methods of the window object
+  interface Window {
+    // Define the location property, with a type of Location
+    __TRES__: {
+      app: App
+      version: string
+    }
+  }
+}

packages/tres/src/index.ts

@@ -1,10 +1,10 @@
-import { App, Component, watchEffect } from 'vue'
+import { App, Component } from 'vue'
 import { TresCanvas } from '/@/core/useRenderer/component'
 import { Scene } from '/@/core/useScene/component'
 import { useCatalogue, useInstanceCreator } from '/@/core'
 export * from '/@/core'
 export * from './keys'
-
+import { version } from '../package.json'
 export interface TresOptions {
   prefix?: string
   extends?: Record<string, unknown>
@@ -29,9 +29,10 @@ const plugin: TresPlugin = {
       app.component(key as string, cmp as Component)
     })
 
-    watchEffect(() => {
-      console.log({ catalogue })
-    })
+    window.__TRES__ = {
+      app,
+      version,
+    }
   },
 }