chore: replace useLogger with logger utility functions (#964)

- Removed useLogger imports from various composables and directives.
- Introduced logError and logWarning functions from the new logger utility.
- Updated relevant code to utilize the new logging methods for improved clarity and maintainability.

src/composables/index.ts

@@ -3,7 +3,6 @@ import UseTexture from './useTexture/component.vue'
 
 export * from './useCamera/'
 export * from './useLoader'
-export * from './useLogger'
 export * from './useLoop'
 export * from './useRaycaster'
 export * from './useRenderer/'

src/composables/useLoader/index.ts

@@ -1,6 +1,6 @@
 import type { Loader, LoadingManager, Object3D } from 'three'
 import type { TresObject } from '../../types'
-import { useLogger } from '..'
+import { logError } from '../../utils/logger'
 
 export interface TresLoader<T> extends Loader {
   load: (
@@ -72,7 +72,6 @@ export async function useLoader<T>(
   onProgress?: (event: ProgressEvent<EventTarget>) => void,
   cb?: (proto: TresLoader<T>) => void,
 ): Promise<T | T[]> {
-  const { logError } = useLogger()
   const proto = new Loader()
   if (cb) {
     cb(proto)

src/composables/useRenderer/index.ts

@@ -18,7 +18,7 @@ import { revision } from '../../core/revision'
 import { get, merge, set, setPixelRatio } from '../../utils'
 
 import { normalizeColor } from '../../utils/normalize'
-import { useLogger } from '../useLogger'
+import { logError } from '../../utils/logger'
 import { rendererPresets } from './const'
 
 type TransformToMaybeRefOrGetter<T> = {
@@ -155,8 +155,6 @@ export function useRenderer(
 
   const { pixelRatio } = useDevicePixelRatio()
 
-  const { logError } = useLogger()
-
   const getThreeRendererDefaults = () => {
     const plainRenderer = new WebGLRenderer()
 

src/composables/useSeek/index.ts

@@ -1,5 +1,5 @@
 import type { Object3D, Scene } from 'three'
-import { useLogger } from '../useLogger'
+import { logWarning } from '../../utils/logger'
 
 /**
  * Seek composable return type
@@ -21,8 +21,6 @@ export interface UseSeekReturn {
  * @return {*}  {UseSeekReturn}
  */
 export function useSeek(): UseSeekReturn {
-  const { logWarning } = useLogger()
-
   /**
    * Returns a child object of the parent given a property
    *

src/core/nodeOps.ts

@@ -2,14 +2,12 @@ import type { TresContext } from '../composables'
 import type { DisposeType, LocalState, TresInstance, TresObject, TresObject3D, TresPrimitive, WithMathProps } from '../types'
 import { BufferAttribute, Object3D } from 'three'
 import { isRef, type RendererOptions } from 'vue'
-import { useLogger } from '../composables'
 import { attach, deepArrayEqual, doRemoveDeregister, doRemoveDetach, invalidateInstance, isHTMLTag, kebabToCamel, noop, prepareTresInstance, setPrimitiveObject, unboxTresPrimitive } from '../utils'
+import { logError } from '../utils/logger'
 import * as is from '../utils/is'
 import { createRetargetingProxy } from '../utils/primitive/createRetargetingProxy'
 import { catalogue } from './catalogue'
 
-const { logError } = useLogger()
-
 const supportedPointerEvents = [
   'onClick',
   'onContextMenu',

src/directives/vDistanceTo.ts

@@ -1,11 +1,9 @@
 import type { Ref } from 'vue'
 import type { TresObject } from '../types'
 import { ArrowHelper } from 'three'
-import { useLogger } from '../composables'
+import { logWarning } from '../utils/logger'
 import { extractBindingPosition } from '../utils'
 
-const { logWarning } = useLogger()
-
 let arrowHelper: ArrowHelper | null = null
 
 export const vDistanceTo = {

src/directives/vLightHelper.ts

@@ -9,9 +9,7 @@ import {
   SpotLightHelper,
 } from 'three'
 import { RectAreaLightHelper } from 'three-stdlib'
-import { useLogger } from '../composables'
-
-const { logWarning } = useLogger()
+import { logWarning } from '../utils/logger'
 
 type LightHelper = typeof DirectionalLightHelper
   | typeof PointLightHelper

src/utils/index.ts

@@ -6,6 +6,7 @@ import { DoubleSide, MathUtils, MeshBasicMaterial, Scene, Vector3 } from 'three'
 import { HightlightMesh } from '../devtools/highlight'
 import * as is from './is'
 
+export * from './logger'
 export function toSetMethodName(key: string) {
   return `set${key[0].toUpperCase()}${key.slice(1)}`
 }

src/composables/useLogger.ts → src/utils/logger.ts

@@ -1,3 +1,8 @@
+/**
+ * Logger utility for TresJS
+ * @module logger
+ */
+
 /* eslint-disable no-console */
 export const isProd = import.meta.env.MODE === 'production'
 
@@ -5,13 +10,11 @@ const logPrefix = '[TresJS ▲ ■ ●] '
 
 type OneOrMore<T> = { 0: T } & Array<T>
 
-interface LoggerComposition {
-  logError: (...args: OneOrMore<any>) => void
-  logWarning: (...args: OneOrMore<any>) => void
-  logMessage: (name: string, value: any) => void
-}
-
-function logError(...args: OneOrMore<any>) {
+/**
+ * Logs an error message with the TresJS prefix
+ * @param args - Arguments to log
+ */
+export function logError(...args: OneOrMore<any>): void {
   if (typeof args[0] === 'string') {
     // NOTE: Don't break console string substitution
     args[0] = logPrefix + args[0]
@@ -22,7 +25,11 @@ function logError(...args: OneOrMore<any>) {
   console.error(...args)
 }
 
-function logWarning(...args: OneOrMore<any>) {
+/**
+ * Logs a warning message with the TresJS prefix
+ * @param args - Arguments to log
+ */
+export function logWarning(...args: OneOrMore<any>): void {
   if (typeof args[0] === 'string') {
     // NOTE: Don't break console string substitution
     args[0] = logPrefix + args[0]
@@ -33,16 +40,14 @@ function logWarning(...args: OneOrMore<any>) {
   console.warn(...args)
 }
 
-function logMessage(name: string, value: any) {
+/**
+ * Logs a message with the TresJS prefix (only in development mode)
+ * @param name - Name of the message
+ * @param value - Value to log
+ */
+export function logMessage(name: string, value: any): void {
   if (!isProd) {
     console.log(`${logPrefix} - ${name}:`, value)
   }
 }
 /* eslint-enable no-console */
-export function useLogger(): LoggerComposition {
-  return {
-    logError,
-    logWarning,
-    logMessage,
-  }
-}