feat(cientos): docs for cientos

packages/cientos/src/core/useAnimations.ts

@@ -2,6 +2,15 @@ import { AnimationAction, AnimationClip, AnimationMixer, Object3D, Scene } from
 import { useRenderLoop } from '@tresjs/core'
 import { ref, Ref, shallowReactive } from 'vue'
 
+/**
+ * Creates an AnimationMixer and returns it.
+ *
+ * @export
+ * @template T
+ * @param {T[]} animations
+ * @param {(Scene | Ref<Object3D | undefined | null>)} [modelRef]
+ * @return {*}
+ */
 export function useAnimations<T extends AnimationClip>(
   animations: T[],
   modelRef?: Scene | Ref<Object3D | undefined | null>,

packages/cientos/src/core/useCientos.ts

@@ -1,6 +1,12 @@
 import { useTres } from '@tresjs/core'
 import { inject } from 'vue'
 
+/**
+ * Allows to use and extend the state of the core package.
+ *
+ * @export
+ * @return {*}
+ */
 export function useCientos() {
   const extend =
     inject<(objects: any) => void>('extend') ||

packages/cientos/src/core/useEnvironment/const.ts

@@ -1,11 +1,42 @@
 import { TextureEncoding } from 'three'
 
 export type EnvironmentOptions = {
+  /**
+   * If true, the environment will be set as the scene's background.
+   *
+   * @type {boolean}
+   */
   background?: boolean
+  /**
+   * The blur radius of the environment.
+   *
+   * @type {number}
+   */
   blur?: number
+  /**
+   * The files to load. If a string is provided, it will be loaded as an equirectangular texture.
+   * If an array is provided, it will be loaded as a cube texture.
+   *
+   * @type {(string | string[])}
+   */
   files?: string | string[]
+  /**
+   * The path to the files.
+   *
+   * @type {string}
+   */
   path?: string
+  /**
+   * The preset to use. If provided, the files and path props will be ignored.
+   *
+   * @type {EnvironmentPresetsType}
+   */
   preset?: EnvironmentPresetsType
+  /**
+   * The encoding of the environment.
+   *
+   * @type {TextureEncoding}
+   */
   encoding?: TextureEncoding
 }
 

packages/cientos/src/core/useEnvironment/index.ts

@@ -12,6 +12,20 @@ import { RGBELoader } from 'three-stdlib'
 import { useCientos } from '../useCientos'
 import { EnvironmentOptions, environmentPresets } from './const'
 
+/**
+ * Component that loads an environment map and sets it as the scene's background and environment.
+ *
+ * @export
+ * @param {Partial<EnvironmentOptions>} {
+ *   files = ['/px.png', '/nx.png', '/py.png', '/ny.png', '/pz.png', '/nz.png'],
+ *   blur = 0,
+ *   background = false,
+ *   path = undefined,
+ *   preset = undefined,
+ *   encoding = undefined,
+ * }
+ * @return {*}  {(Promise<Texture | CubeTexture>)}
+ */
 export async function useEnvironment({
   files = ['/px.png', '/nx.png', '/py.png', '/ny.png', '/pz.png', '/nz.png'],
   blur = 0,

packages/cientos/src/core/useFBX/component.ts

@@ -6,6 +6,9 @@ import { useCientos } from '../useCientos'
 export const FBXModel = defineComponent({
   name: 'FBXModel',
   props: {
+    /*
+     * The path to the FBX file.
+     */
     path: {
       type: String,
       required: true,

packages/cientos/src/core/useFBX/index.ts

@@ -2,6 +2,13 @@ import { FBXLoader } from 'three-stdlib'
 import { useLoader } from '@tresjs/core'
 import { Object3D } from 'three'
 
+/**
+ * Loads an FBX file and returns a THREE.Object3D.
+ *
+ * @export
+ * @param {(string | string[])} path
+ * @return {*}  {Promise<Object3D>}
+ */
 export async function useFBX(path: string | string[]): Promise<Object3D> {
   return (await useLoader(FBXLoader, path)) as unknown as Object3D
 }

packages/cientos/src/core/useGLTF/component.ts

@@ -5,8 +5,20 @@ import { useCientos } from '../useCientos'
 export const GLTFModel = defineComponent({
   name: 'GLTFModel',
   props: {
+    /**
+     * The path to the GLTF file.
+     *
+     */
     path: String,
+    /**
+     * Whether to use Draco compression.
+     *
+     */
     draco: Boolean,
+    /**
+     * The path to the Draco decoder.
+     *
+     */
     decoderPath: String,
   },
 

packages/cientos/src/core/useGLTF/index.ts

@@ -3,7 +3,19 @@ import { useLoader } from '@tresjs/core'
 import { Object3D } from 'three'
 
 export interface GLTFLoaderOptions {
+  /**
+   * Whether to use Draco compression.
+   *
+   * @type {boolean}
+   * @memberof GLTFLoaderOptions
+   */
   draco?: boolean
+  /**
+   * The path to the Draco decoder.
+   *
+   * @type {string}
+   * @memberof GLTFLoaderOptions
+   */
   decoderPath?: string
 }
 
@@ -16,6 +28,13 @@ export interface GLTFResult {
 
 let dracoLoader: DRACOLoader | null = null
 
+/**
+ * Sets the extensions for the GLTFLoader.
+ *
+ * @param {GLTFLoaderOptions} options
+ * @param {(loader: GLTFLoader) => void} [extendLoader]
+ * @return {*}
+ */
 function setExtensions(options: GLTFLoaderOptions, extendLoader?: (loader: GLTFLoader) => void) {
   return (loader: GLTFLoader) => {
     if (extendLoader) {
@@ -30,6 +49,18 @@ function setExtensions(options: GLTFLoaderOptions, extendLoader?: (loader: GLTFL
     }
   }
 }
+
+/**
+ * Loads a GLTF file and returns a THREE.Object3D.
+ *
+ * @export
+ * @param {(string | string[])} path
+ * @param {GLTFLoaderOptions} [options={
+ *     draco: false,
+ *   }]
+ * @param {(loader: GLTFLoader) => void} [extendLoader]
+ * @return {*}  {Promise<GLTFResult>}
+ */
 export async function useGLTF(
   path: string | string[],
   options: GLTFLoaderOptions = {

packages/cientos/src/core/useTweakPane/index.ts

@@ -7,7 +7,13 @@ type TweakPane = Pane & { addBlade(blade: any): void }
 let pane: TweakPane
 let fpsGraph: any
 
-export const useTweakPane = (selector = 'tres-container') => {
+export /**
+ * Creates a TweakPane instance and returns it.
+ *
+ * @param {string} [selector='tres-container']
+ * @return {*}
+ */
+const useTweakPane = (selector = 'tres-container') => {
   if (!pane) {
     pane = new Pane({
       container: (document.querySelector(selector) as HTMLElement) || undefined,
@@ -20,6 +26,10 @@ export const useTweakPane = (selector = 'tres-container') => {
     })
   }
 
+  /**
+   * Disposes the TweakPane instance.
+   *
+   */
   function disposeTweakPane() {
     if (pane) {
       pane.dispose()

packages/cientos/src/utils/index.ts

@@ -1,4 +1,13 @@
-// Update the function signature to explicitly specify the type of the props parameter
+/**
+ * Update the function signature to explicitly specify the type of the props parameter
+ *
+ * @export
+ * @template T
+ * @template K
+ * @param {T} obj
+ * @param {K[]} props
+ * @return {*}  {Pick<T, K>}
+ */
 export function pick<T extends object, K extends keyof T>(obj: T, props: K[]): Pick<T, K> {
   const pickedProperties = {} as Pick<T, K>
   for (const prop of props) {
@@ -9,6 +18,14 @@ export function pick<T extends object, K extends keyof T>(obj: T, props: K[]): P
   return pickedProperties
 }
 
+/**
+ * Check if the object has a setter for the given property
+ *
+ * @export
+ * @param {*} obj
+ * @param {string} prop
+ * @return {*}  {boolean}
+ */
 export function hasSetter(obj: any, prop: string): boolean {
   const setterName = `set${prop[0].toUpperCase()}${prop.slice(1)}`
   return obj[setterName] !== undefined