ts update fixes

package.json

@@ -85,6 +85,7 @@
     "@typescript-eslint/eslint-plugin": "^5.59.7",
     "@typescript-eslint/parser": "^5.59.5",
     "clean-package": "^2.2.0",
+    "@types/node": "^22.10.2",
     "copyfiles": "^2.4.1",
     "eslint": "^8.40.0",
     "eslint-import-resolver-typescript": "^3.5.5",
@@ -98,8 +99,8 @@
     "rollup-plugin-license": "^3.0.1",
     "three": "https://github.com/repalash/three.js-modded/releases/download/v0.153.1006/package.tgz",
     "tslib": "^2.5.0",
-    "typedoc": "^0.25.7",
-    "typescript": "^5.3.3",
+    "typedoc": "^0.27.5",
+    "typescript": "^5.7.2",
     "typescript-plugin-css-modules": "^5.0.1",
     "vite": "^6.0.5",
     "vite-plugin-dts": "^4.4.0",
@@ -111,7 +112,7 @@
     "@types/webxr": "^0.5.1",
     "@types/wicg-file-system-access": "^2020.9.5",
     "stats.js": "^0.17.0",
-    "ts-browser-helpers": "^0.14.2",
+    "ts-browser-helpers": "^0.15.0",
     "uiconfig.js": "^0.0.12"
   },
   "//": {

plugins/network/src/AWSClientPlugin.ts

@@ -26,7 +26,7 @@ import {AwsClient, AwsV4Signer} from 'aws4fetch'
 @uiFolderContainer('AWS/S3 Client')
 export class AWSClientPlugin extends AViewerPluginSync<'fileUpload'> {
     static readonly PluginType = 'AWSClientPlugin1'
-    uiConfig?: UiObjectConfig
+    declare uiConfig: UiObjectConfig
 
     enabled = true
     private _connected = false

plugins/svg-renderer/src/basic/BasicSVGRenderer.ts

@@ -5,13 +5,13 @@ import {onChange2} from 'ts-browser-helpers'
 @uiFolderContainer('Basic SVG Renderer')
 export class BasicSVGRenderer extends SVGRenderer {
     @uiToggle()
-        autoClear: boolean
+    declare autoClear: boolean
     @uiToggle()
-        sortObjects: boolean
+    declare sortObjects: boolean
     @uiToggle()
-        sortElements: boolean
+    declare sortElements: boolean
     @uiNumber()
-        overdraw: number
+    declare overdraw: number
 
     @uiDropdown(undefined, ['low', 'high'])
     @onChange2(BasicSVGRenderer.prototype._refresh)

src/assetmanager/export/GLTFWriter2.ts

@@ -6,7 +6,7 @@ import {ThreeSerialization} from '../../utils'
 
 export class GLTFWriter2 extends GLTFExporter.Utils.GLTFWriter {
 
-    options: GLTFExporterOptions & {
+    declare options: GLTFExporterOptions & {
         externalImagesInExtras: boolean,
         exporterOptions: GLTFExporter2Options
     }

src/assetmanager/gltf/GLTFViewerConfigExtension.ts

@@ -23,10 +23,11 @@ export class GLTFViewerConfigExtension {
      */
     static async ImportViewerConfig(parser: GLTFParser, viewer: ThreeViewer, resultScenes: Group[], scene?: any): Promise<Partial<ISerializedViewerConfig>> {
         if (!scene) {
-            const scenes = parser.json.scenes || []
+            const scenes = (parser.json.scenes as Group[]) || []
             if (scenes.length !== 1) {
                 for (const scene1 of scenes) {
-                    await this.ImportViewerConfig(parser, viewer, [resultScenes[scenes.indexOf(scene1)]] || resultScenes, scene1)
+                    const i = scenes.indexOf(scene1)
+                    await this.ImportViewerConfig(parser, viewer, i >= 0 ? [resultScenes[i]] : resultScenes, scene1)
                 }
                 return {}
             }

src/assetmanager/gltf/gltfEncyptionHelpers.ts

@@ -19,7 +19,7 @@ export const glbEncryptionProcessor = async(gltf: ArrayBuffer|any, options: GLTF
         console.warn('GLTF Export: encryption key not provided, skipping encryption')
         return gltf
     }
-    const buffer = await aesGcmEncrypt(new Uint8Array(gltf as ArrayBuffer), options.encryptKey)
+    const buffer = await aesGcmEncrypt(new Uint8Array(gltf), options.encryptKey)
     return makeGLBFile(buffer, {
         asset: {
             version: '2.0',

src/core/ITexture.ts

@@ -33,7 +33,7 @@ export interface ITexture extends Texture {
     setDirty?(): void
 
     source: Source & {
-        _sourceImgBuffer?: ArrayBuffer // see KTX2LoadPlugin and serializeTextureInExtras
+        _sourceImgBuffer?: ArrayBuffer|Uint8Array // see KTX2LoadPlugin and serializeTextureInExtras
     }
 
     _appliedMaterials?: Set<IMaterial> // for internal use only. refers to the materials that this texture is applied to

src/core/camera/PerspectiveCamera2.ts

@@ -19,7 +19,7 @@ export class PerspectiveCamera2 extends PerspectiveCamera implements ICamera {
         return this._controls
     }
 
-    @uiInput('Name') name: string
+    @uiInput('Name') declare name: string
 
     @serialize('camControls')
     private _controls?: ICameraControls
@@ -40,17 +40,17 @@ export class PerspectiveCamera2 extends PerspectiveCamera implements ICamera {
 
     @onChange3(PerspectiveCamera2.prototype.setDirty)
     @uiSlider('Field Of View', [1, 180], 0.001)
-    @serialize() fov: number
+    @serialize() declare fov: number
 
     @onChange3(PerspectiveCamera2.prototype.setDirty)
-    @serialize() focus: number
+    @serialize() declare focus: number
 
     @onChange3(PerspectiveCamera2.prototype.setDirty)
     @uiSlider('FoV Zoom', [0.001, 10], 0.001)
-    @serialize() zoom: number
+    @serialize() declare zoom: number
 
     @uiVector('Position', undefined, undefined, (that:PerspectiveCamera2)=>({onChange: ()=>that.setDirty()}))
-    @serialize() readonly position: Vector3
+    @serialize() declare readonly position: Vector3
 
     /**
      * The target position of the camera (where the camera looks at). Also syncs with the controls.target, so it's not required to set that separately.
@@ -488,7 +488,7 @@ export class PerspectiveCamera2 extends PerspectiveCamera implements ICamera {
     @onChange((k: string, v: boolean)=>{
         if (!v) console.warn('Setting camera invisible is not supported', k, v)
     })
-        visible: boolean
+    declare visible: boolean
 
     get isActiveCamera(): boolean {
         return this.isMainCamera
@@ -601,8 +601,8 @@ export class PerspectiveCamera2 extends PerspectiveCamera implements ICamera {
     add: (...object: IObject3D[]) => this
     remove: (...object: IObject3D[]) => this
     dispatchEvent: (event: ICameraEvent) => void
-    parent: IObject3D | null
-    children: IObject3D[]
+    declare parent: IObject3D | null
+    declare children: IObject3D[]
 
     // endregion
 

src/core/light/AmbientLight2.ts

@@ -10,18 +10,18 @@ export class AmbientLight2 extends AmbientLight implements ILight<undefined> {
     assetType = 'light' as const
     setDirty = iLightCommons.setDirty
     refreshUi = iLightCommons.refreshUi
-    uiConfig: UiObjectConfig
+    declare uiConfig: UiObjectConfig
     readonly isAmbientLight2 = true
 
     @uiToggle('Enabled')
     @onChange3('setDirty')
-        visible: boolean
+    declare visible: boolean
 
     @uiColor('Color', (that: AmbientLight2)=>({onChange: ()=>that.setDirty()}))
-        color: Color
+    declare color: Color
     @uiSlider('Intensity', [0, 30], 0.01)
     @onChange3('setDirty')
-        intensity: number
+    declare intensity: number
 
     constructor(color?: ColorRepresentation, intensity?: number) {
         super(color, intensity)
@@ -66,8 +66,8 @@ export class AmbientLight2 extends AmbientLight implements ILight<undefined> {
     clone: (recursive?: boolean) => this
     remove: (...object: IObject3D[]) => this
     dispatchEvent: (event: ILightEvent) => void
-    parent: null
-    children: IObject3D[]
+    declare parent: null
+    declare children: IObject3D[]
 
     // endregion
 

src/core/light/DirectionalLight2.ts

@@ -15,25 +15,25 @@ export class DirectionalLight2<
     assetType = 'light' as const
     setDirty = iLightCommons.setDirty
     refreshUi = iLightCommons.refreshUi
-    uiConfig: UiObjectConfig
+    declare uiConfig: UiObjectConfig
     readonly isDirectionalLight2 = true
 
     @uiToggle('Enabled')
     @onChange3('setDirty')
-        visible: boolean
+    declare visible: boolean
 
     @uiColor('Color', (that: DirectionalLight2)=>({onChange: ()=>that.setDirty()}))
-        color: Color
+    declare color: Color
     @uiSlider('Intensity', [0, 30], 0.01)
     @onChange3('setDirty')
-        intensity: number
+    declare intensity: number
     @uiVector('Position', undefined, undefined, (that: DirectionalLight2)=>({onChange: ()=>that.setDirty()}))
-    readonly position: Vector3
+    declare readonly position: Vector3
     @uiVector('Rotation', undefined, undefined, (that: DirectionalLight2)=>({onChange: ()=>that.setDirty()}))
-    readonly rotation: Euler
+    declare readonly rotation: Euler
     @uiToggle('Cast Shadow')
     @onChange3('setDirty')
-        castShadow: boolean
+    declare castShadow: boolean
 
     constructor(color?: ColorRepresentation, intensity?: number) {
         super(color, intensity)
@@ -80,8 +80,8 @@ export class DirectionalLight2<
     clone: (recursive?: boolean) => this
     remove: (...object: IObject3D[]) => this
     dispatchEvent: (event: ILightEvent) => void
-    parent: null
-    children: IObject3D[]
+    declare parent: null
+    declare children: IObject3D[]
 
     // endregion
 

src/core/light/HemisphereLight2.ts

@@ -10,22 +10,22 @@ export class HemisphereLight2 extends HemisphereLight implements ILight<undefine
     assetType = 'light' as const
     setDirty = iLightCommons.setDirty
     refreshUi = iLightCommons.refreshUi
-    uiConfig: UiObjectConfig
+    declare uiConfig: UiObjectConfig
     readonly isHemisphereLight2 = true
 
     @uiToggle('Enabled')
     @onChange3('setDirty')
-        visible: boolean
+    declare visible: boolean
 
     @uiColor('Sky Color', (that: HemisphereLight2)=>({onChange: ()=>that.setDirty()}))
-        color: Color
+    declare color: Color
     @uiColor('Ground Color', (that: HemisphereLight2)=>({onChange: ()=>that.setDirty()}))
-        groundColor: Color
+    declare groundColor: Color
     @uiSlider('Intensity', [0, 30], 0.01)
     @onChange3('setDirty')
-        intensity: number
+    declare intensity: number
     @uiVector('Position', undefined, undefined, (that: HemisphereLight2)=>({onChange: ()=>that.setDirty()}))
-    readonly position: Vector3
+    declare readonly position: Vector3
 
     constructor(skyColor?: ColorRepresentation, groundColor?: ColorRepresentation, intensity?: number) {
         super(skyColor, groundColor, intensity)
@@ -70,8 +70,8 @@ export class HemisphereLight2 extends HemisphereLight implements ILight<undefine
     clone: (recursive?: boolean) => this
     remove: (...object: IObject3D[]) => this
     dispatchEvent: (event: ILightEvent) => void
-    parent: null
-    children: IObject3D[]
+    declare parent: null
+    declare children: IObject3D[]
 
     // endregion
 

src/core/light/PointLight2.ts

@@ -10,29 +10,29 @@ export class PointLight2 extends PointLight implements ILight<PointLightShadow>
     assetType = 'light' as const
     setDirty = iLightCommons.setDirty
     refreshUi = iLightCommons.refreshUi
-    uiConfig: UiObjectConfig
+    declare uiConfig: UiObjectConfig
     readonly isPointLight2 = true
 
     @uiToggle('Enabled')
     @onChange3('setDirty')
-        visible: boolean
+    declare visible: boolean
 
     @uiColor('Color', (that: PointLight2)=>({onChange: ()=>that.setDirty()}))
-        color: Color
+    declare color: Color
     @uiSlider('Intensity', [0, 30], 0.01)
     @onChange3('setDirty')
-        intensity: number
+    declare intensity: number
     @uiNumber('Distance')
     @onChange3('setDirty')
-        distance: number
+    declare distance: number
     @uiNumber('Decay')
     @onChange3('setDirty')
-        decay: number
+    declare decay: number
     @uiVector('Position', undefined, undefined, (that: PointLight2)=>({onChange: ()=>that.setDirty()}))
-    readonly position: Vector3
+    declare readonly position: Vector3
     @uiToggle('Cast Shadow')
     @onChange3('setDirty')
-        castShadow: boolean
+    declare castShadow: boolean
 
     constructor(color?: ColorRepresentation, intensity?: number, distance?: number, decay?: number) {
         super(color, intensity, distance, decay)
@@ -77,8 +77,8 @@ export class PointLight2 extends PointLight implements ILight<PointLightShadow>
     clone: (recursive?: boolean) => this
     remove: (...object: IObject3D[]) => this
     dispatchEvent: (event: ILightEvent) => void
-    parent: null
-    children: IObject3D[]
+    declare parent: null
+    declare children: IObject3D[]
 
     // endregion
 

src/core/light/RectAreaLight2.ts

@@ -15,22 +15,22 @@ export class RectAreaLight2 extends RectAreaLight implements ILight<undefined> {
 
     @uiToggle('Enabled')
     @onChange3('setDirty')
-        visible: boolean
+    declare visible: boolean
 
     @uiColor('Color', (that: RectAreaLight2)=>({onChange: ()=>that.setDirty()}))
-        color: Color
+    declare color: Color
     @uiSlider('Intensity', [0, 30], 0.01)
     @onChange3('setDirty')
-        intensity: number
+    declare intensity: number
     @uiNumber('Width')
     @onChange3('setDirty')
-        width: number
+    declare width: number
     @uiNumber('Height')
     @onChange3('setDirty')
-        height: number
+    declare height: number
     @uiNumber('Power')
     @onChange3('setDirty')
-        power: number
+    declare power: number
 
 
     constructor(color?: ColorRepresentation, intensity?: number, width?: number, height?: number) {
@@ -75,8 +75,8 @@ export class RectAreaLight2 extends RectAreaLight implements ILight<undefined> {
     clone: (recursive?: boolean) => this
     remove: (...object: IObject3D[]) => this
     dispatchEvent: (event: ILightEvent) => void
-    parent: null
-    children: IObject3D[]
+    declare parent: null
+    declare children: IObject3D[]
 
     // endregion
 

src/core/light/SpotLight2.ts

@@ -15,32 +15,32 @@ export class SpotLight2 extends SpotLight implements ILight<SpotLightShadow> {
 
     @uiToggle('Enabled')
     @onChange3('setDirty')
-        visible: boolean
+    declare visible: boolean
 
     @uiColor('Color', (that: SpotLight2)=>({onChange: ()=>that.setDirty()}))
-        color: Color
+    declare color: Color
     @uiSlider('Intensity', [0, 30], 0.01)
     @onChange3('setDirty')
-        intensity: number
+    declare intensity: number
     @uiSlider('Angle', [0, 2], 0.01)
     @onChange3('setDirty')
-        angle: number
+    declare angle: number
     @uiSlider('Penumbra', [0, 0.9999], 0.01)
     @onChange3('setDirty')
-        penumbra: number
+    declare penumbra: number
     @uiInput('Distance')
     @onChange3('setDirty')
-        distance: number
+    declare distance: number
     @uiInput('Decay')
     @onChange3('setDirty')
-        decay: number
+    declare decay: number
     @uiVector('Position', undefined, undefined, (that: SpotLight2)=>({onChange: ()=>that.setDirty()}))
-    readonly position: Vector3
+    declare readonly position: Vector3
     @uiVector('Rotation', undefined, undefined, (that: SpotLight2)=>({onChange: ()=>that.setDirty()}))
-    readonly rotation: Euler
+    declare readonly rotation: Euler
     @uiToggle('Cast Shadow')
     @onChange3('setDirty')
-        castShadow: boolean
+    declare castShadow: boolean
 
     constructor(color?: ColorRepresentation, intensity?: number, distance?: number,
         angle?: number,
@@ -90,8 +90,8 @@ export class SpotLight2 extends SpotLight implements ILight<SpotLightShadow> {
     clone: (recursive?: boolean) => this
     remove: (...object: IObject3D[]) => this
     dispatchEvent: (event: ILightEvent) => void
-    parent: null
-    children: IObject3D[]
+    declare parent: null
+    declare children: IObject3D[]
 
     // endregion
 

src/core/material/ExtendedShaderMaterial.ts

@@ -22,7 +22,7 @@ export class ExtendedShaderMaterial extends ShaderMaterial2 {
 
     textures: {colorSpace: ColorSpace, id: string}[] = []
 
-    userData: IMaterialUserData
+    declare userData: IMaterialUserData
 
     constructor(parameters: ShaderMaterialParameters, textureIds: string[], isRawShaderMaterial = false) {
         super(parameters, isRawShaderMaterial)

src/core/material/LegacyPhongMaterial.ts

@@ -36,7 +36,7 @@ export class LegacyPhongMaterial extends MeshPhongMaterial<IMaterialEvent, Phong
     public static readonly TYPE = 'LegacyPhongMaterial' // not using .type because it is used by three.js
     assetType = 'material' as const
 
-    userData: IMaterialUserData
+    declare userData: IMaterialUserData
 
     public readonly isLegacyPhongMaterial = true
 

src/core/material/LineMaterial2.ts

@@ -76,18 +76,18 @@ export class LineMaterial2 extends LineMaterial<IMaterialEvent, LineMaterial2Eve
 
     // region UI Config
 
-    @uiInput() name: string
-    @uiColor() color: Color
-    @uiToggle() dashed: boolean
-    @uiNumber() dashScale: number
-    @uiNumber() dashSize: number
-    @uiNumber() dashOffset: number
-    @uiNumber() gapSize: number
-    @uiNumber() linewidth: number
-    @uiVector() resolution: Vector2
-    @uiToggle() alphaToCoverage: boolean
-    @uiToggle() worldUnits: boolean
-    // @uiToggle() fog = true
+    @uiInput() declare name: string
+    @uiColor() declare color: Color
+    @uiToggle() declare dashed: boolean
+    @uiNumber() declare dashScale: number
+    @uiNumber() declare dashSize: number
+    @uiNumber() declare dashOffset: number
+    @uiNumber() declare gapSize: number
+    @uiNumber() declare linewidth: number
+    @uiVector() declare resolution: Vector2
+    @uiToggle() declare alphaToCoverage: boolean
+    @uiToggle() declare worldUnits: boolean
+    // @uiToggle() declare fog = true
 
 
     // todo dispose ui config

src/core/material/PhysicalMaterial.ts

@@ -38,7 +38,7 @@ export class PhysicalMaterial extends MeshPhysicalMaterial<IMaterialEvent, Physi
     public static readonly TYPE = 'PhysicalMaterial' // not using .type because it is used by three.js
     assetType = 'material' as const
 
-    userData: IMaterialUserData
+    declare userData: IMaterialUserData
 
     public readonly isPhysicalMaterial = true
 
@@ -187,7 +187,7 @@ export class PhysicalMaterial extends MeshPhysicalMaterial<IMaterialEvent, Physi
     /**
      * Serializes this material to JSON.
      * @param meta - metadata for serialization
-     * @param _internal - Calls only super.toJSON, does internal three.js serialization and @serialize tags. Set it to true only if you know what you are doing. This is used in Serialization->serializer->material
+     * @param _internal - Calls only super.toJSON, does internal three.js serialization and `@serialize` tags. Set it to true only if you know what you are doing. This is used in Serialization->serializer->material
      */
     toJSON(meta?: SerializationMetaType, _internal = false): any {
         if (_internal) return {

src/core/material/ShaderMaterial2.ts

@@ -39,7 +39,7 @@ export class ShaderMaterial2<E extends IMaterialEvent = IMaterialEvent, ET = IMa
 
     assetType = 'material' as const
 
-    userData: IMaterialUserData
+    declare userData: IMaterialUserData
 
     public readonly isAShaderMaterial = true
 

src/core/material/UnlitLineMaterial.ts

@@ -25,7 +25,7 @@ export class UnlitLineMaterial extends LineBasicMaterial<IMaterialEvent, UnlitLi
     public static readonly TYPE = 'UnlitLineMaterial' // not using .type because it is used by three.js
     assetType = 'material' as const
 
-    userData: IMaterialUserData
+    declare userData: IMaterialUserData
 
     public readonly isUnlitLineMaterial = true
 

src/core/material/UnlitMaterial.ts

@@ -34,7 +34,7 @@ export class UnlitMaterial extends MeshBasicMaterial<IMaterialEvent, UnlitMateri
     public static readonly TYPE = 'UnlitMaterial' // not using .type because it is used by three.js
     assetType = 'material' as const
 
-    userData: IMaterialUserData
+    declare userData: IMaterialUserData
 
     public readonly isUnlitMaterial = true
 
@@ -133,7 +133,7 @@ export class UnlitMaterial extends MeshBasicMaterial<IMaterialEvent, UnlitMateri
     /**
      * Serializes this material to JSON.
      * @param meta - metadata for serialization
-     * @param _internal - Calls only super.toJSON, does internal three.js serialization and @serialize tags. Set it to true only if you know what you are doing. This is used in Serialization->serializer->material
+     * @param _internal - Calls only super.toJSON, does internal three.js serialization and `@serialize` tags. Set it to true only if you know what you are doing. This is used in Serialization->serializer->material
      */
     toJSON(meta?: SerializationMetaType, _internal = false): any {
         if (_internal) return {

src/core/object/Mesh2.ts

@@ -13,9 +13,9 @@ export class Mesh2<
     setDirty = iObjectCommons.setDirty
     refreshUi = iObjectCommons.refreshUi
 
-    material: TMaterial
-    readonly materials: IMaterial[]
-    geometry: TGeometry
+    declare material: TMaterial
+    declare readonly materials: IMaterial[]
+    declare geometry: TGeometry
 
     /**
      * @deprecated use `this` instead
@@ -29,7 +29,7 @@ export class Mesh2<
         iObjectCommons.upgradeObject3D.call(this)
     }
 
-    userData: IObject3DUserData
+    declare userData: IObject3DUserData
 
     // region inherited type fixes
     // re-declaring from IObject3D because: https://github.com/microsoft/TypeScript/issues/16936
@@ -44,8 +44,8 @@ export class Mesh2<
     clone: (recursive?: boolean) => this
     remove: (...object: IObject3D[]) => this
     dispatchEvent: (event: ILightEvent) => void
-    parent: null
-    children: IObject3D[]
+    declare parent: null
+    declare children: IObject3D[]
     dispose: (removeFromParent?: boolean) => void
 
     // endregion

src/core/object/RootScene.ts

@@ -28,7 +28,7 @@ export class RootScene extends Scene<ISceneEvent, ISceneEventTypes> implements I
     readonly isRootScene = true
 
     assetType = 'model' as const
-    uiConfig!: UiObjectConfig
+    declare uiConfig: UiObjectConfig
 
     // private _processors = new ObjectProcessorMap<'environment' | 'background'>()
     // private _sceneObjects: ISceneObject[] = []
@@ -360,7 +360,7 @@ export class RootScene extends Scene<ISceneEvent, ISceneEventTypes> implements I
     refreshScene(event?: Partial<ISceneEvent> & ISceneSetDirtyOptions): this {
         if (event && event.type === 'objectUpdate' && event.object === this) return this // ignore self
         // todo test the isCamera here. this is for animation object plugin
-        if (event?.sceneUpdate === false || event?.refreshScene === false || event.object?.isCamera) return this.setDirty(event) // so that it doesn't trigger frame fade, shadow refresh etc
+        if (event?.sceneUpdate === false || event?.refreshScene === false || event?.object?.isCamera) return this.setDirty(event) // so that it doesn't trigger frame fade, shadow refresh etc
         // console.warn(event)
         this.refreshActiveCameraNearFar()
         this._sceneBounds = this.getBounds(false, true)
@@ -534,8 +534,8 @@ export class RootScene extends Scene<ISceneEvent, ISceneEventTypes> implements I
     clone: (recursive?: boolean) => this
     remove: (...object: IObject3D[]) => this
     dispatchEvent: (event: ISceneEvent) => void
-    parent: null
-    children: IObject3D[]
+    declare parent: null
+    declare children: IObject3D[]
 
     // endregion
 

src/plugins/animation/GLTFAnimationPlugin.ts

@@ -24,7 +24,7 @@ import type {FrameFadePlugin} from '../pipeline/FrameFadePlugin'
 @uiFolderContainer('GLTF Animations')
 export class GLTFAnimationPlugin extends AViewerPluginSync<'checkpointEnd'|'checkpointBegin'|'animationStep'> {
     enabled = true
-    uiConfig!: UiObjectConfig
+    declare uiConfig: UiObjectConfig
 
     static readonly PluginType = 'GLTFAnimation'
     /**

src/plugins/base/BaseGroundPlugin.ts

@@ -243,7 +243,7 @@ export class BaseGroundPlugin<TEvent extends string = ''> extends AViewerPluginS
             this._geometry.attributes.uv2 = (this._geometry.attributes.uv as any as BufferAttribute | InterleavedBufferAttribute).clone()
             this._geometry.attributes.uv2.needsUpdate = true
         }
-        if (this._mesh) this._mesh.geometry = g
+        if (this._mesh) this._mesh.geometry = this._geometry
     }
 
 

src/plugins/import/Rhino3dmLoadPlugin.ts

@@ -12,7 +12,7 @@ import {ThreeViewer} from '../../viewer'
 export class Rhino3dmLoadPlugin extends BaseImporterPlugin implements IUiConfigContainer {
     public static readonly PluginType = 'Rhino3dmLoadPlugin'
     protected _importer = new Importer(Rhino3dmLoader2, ['3dm'], ['model/vnd.3dm', 'model/3dm'], true)
-    uiConfig!: UiObjectConfig
+    declare uiConfig: UiObjectConfig
 
     /**
      * Import materials from the file based on material source and color source. If false, a default material will be used

src/plugins/import/USDZLoadPlugin.ts

@@ -31,7 +31,7 @@ export class USDZLoadPlugin extends BaseImporterPlugin {
                 if (filename) {
                     const zip: Zippable = {}
                     zip[filename] = new Uint8Array(buffer)
-                    buffer = zipSync(zip).buffer
+                    buffer = zipSync(zip).buffer as ArrayBuffer
                 }
             }
             return super.parse(buffer)

src/plugins/interaction/DropzonePlugin.ts

@@ -26,7 +26,7 @@ export interface DropzonePluginOptions {
 @uiFolderContainer('Dropzone')
 export class DropzonePlugin extends AViewerPluginSync<'drop'> {
     static readonly PluginType = 'Dropzone'
-    uiConfig!: UiObjectConfig
+    declare uiConfig: UiObjectConfig
     @uiToggle() @serialize() enabled = true
     private _inputEl?: HTMLInputElement
     private _dropzone?: Dropzone

src/plugins/pipeline/SSAOPlugin.ts

@@ -35,7 +35,7 @@ export class SSAOPlugin
     target?: SSAOPluginTarget
     @uiImage('SSAO Buffer' /* {readOnly: true}*/) texture?: Texture
 
-    @uiConfig() protected _pass?: SSAOPluginPass
+    @uiConfig() declare protected _pass?: SSAOPluginPass
 
     // @onChange2(SSAOPlugin.prototype._createTarget)
     // @uiDropdown('Buffer Type', threeConstMappings.TextureDataType.uiConfig)

src/plugins/ui/ViewerUiConfigPlugin.ts

@@ -15,7 +15,7 @@ export class ViewerUiConfigPlugin extends AViewerPluginSync<''> {
     }
 
     @serialize('viewer')
-    protected _viewer: ThreeViewer | undefined // todo: fix deserialization throwing error
+    declare protected _viewer: ThreeViewer | undefined // todo: fix deserialization throwing error
 
     // toJSON(): any {
     //     return this._viewer?.toJSON() ?? {}

src/postprocessing/ExtendedShaderPass.ts

@@ -9,7 +9,7 @@ import {IShaderPropertiesUpdater} from '../materials'
 export class ExtendedShaderPass extends ShaderPass implements IPass {
     public static readonly DEFAULT_TEX_ID = 'tDiffuse'
 
-    material!: ShaderMaterial2
+    declare material: ShaderMaterial2
     overrideReadBuffer: {texture?: WebGLRenderTarget['texture']}|null = null
 
     readonly isExtendedShaderPass = true

src/postprocessing/GBufferRenderPass.ts

@@ -11,7 +11,7 @@ export class GBufferRenderPass<TP extends IPassID=IPassID, T extends WebGLMultip
 
     @uiToggle('Enabled') enabled = true
 
-    scene?: IScene
+    declare scene?: IScene
     before?: IPassID[]
     after?: IPassID[]
     required?: IPassID[]

src/postprocessing/ScreenPass.ts

@@ -22,7 +22,7 @@ export type TViewerScreenShader = TViewerScreenShaderFrag | ShaderMaterialParame
 
 @uiFolderContainer('Screen Pass')
 export class ScreenPass extends ExtendedShaderPass implements IPipelinePass<'screen'> {
-    uiConfig!: UiObjectConfig
+    declare uiConfig: UiObjectConfig
     readonly passId = 'screen'
     after: IPassID[] = ['render']
     required: IPassID[] = ['render']

src/rendering/RenderManager.ts

@@ -581,10 +581,10 @@ export class RenderManager<TEvent extends BaseEvent = IRenderManagerEvent, TEven
             mimeType = hdr ? 'image/x-exr' : 'image/png'
         }
         if (!hdrFormats.includes(mimeType)) hdr = false
-        let buffer: ArrayBufferLike
+        let buffer: ArrayBuffer
         if (!hdr) {
             const url = this.renderTargetToDataUrl(target, mimeType === 'auto' ? undefined : mimeType, 90, textureIndex)
-            buffer = base64ToArrayBuffer(url.split(',')[1])
+            buffer = base64ToArrayBuffer(url.split(',')[1]) as ArrayBuffer
             mimeType = url.split(';')[0].split(':')[1]
         } else {
             if (mimeType !== 'image/x-exr') {
@@ -592,7 +592,7 @@ export class RenderManager<TEvent extends BaseEvent = IRenderManagerEvent, TEven
                 mimeType = 'image/x-exr'
             }
             const exporter = new EXRExporter2()
-            buffer = exporter.parse(this._renderer, target, {textureIndex})
+            buffer = exporter.parse(this._renderer, target, {textureIndex}).buffer as ArrayBuffer
         }
         const b = new Blob([buffer], {type: mimeType}) as BlobExt
         b.ext = mimeType === 'image/x-exr' ? 'exr' : mimeType.split('/')[1]

src/three/controls/TransformControls2.ts

@@ -11,7 +11,7 @@ export class TransformControls2 extends TransformControls implements IWidget, IO
     setDirty = iObjectCommons.setDirty.bind(this)
     refreshUi = iObjectCommons.refreshUi.bind(this)
 
-    object: IObject3D | undefined
+    declare object: IObject3D | undefined
     private _keyDownListener(event: KeyboardEvent) {
         if (!this.enabled) return
         if (!this.object) return
@@ -132,29 +132,29 @@ export class TransformControls2 extends TransformControls implements IWidget, IO
 
     // region properties
 
-    enabled: boolean
+    declare enabled: boolean
 
     // axis: 'X' | 'Y' | 'Z' | 'E' | 'XY' | 'YZ' | 'XZ' | 'XYZ' | 'XYZE' | null
 
     // onChange not required for before since they fire 'change' event on changed. see TransformControls.js
 
     @uiDropdown('Mode', ['translate', 'rotate', 'scale'].map(label=>({label})))
-        mode: 'translate' | 'rotate' | 'scale'
+    declare mode: 'translate' | 'rotate' | 'scale'
 
-    translationSnap: number | null
-    rotationSnap: number | null
-    scaleSnap: number | null
+    declare translationSnap: number | null
+    declare rotationSnap: number | null
+    declare scaleSnap: number | null
 
     @uiDropdown('Space', ['world', 'local'].map(label=>({label})))
-        space: 'world' | 'local'
+    declare space: 'world' | 'local'
     @uiSlider('Size', [0.1, 10], 0.1)
-        size: number
+    declare size: number
     @uiToggle('Show X')
-        showX: boolean
+    declare showX: boolean
     @uiToggle('Show Y')
-        showY: boolean
+    declare showY: boolean
     @uiToggle('Show Z')
-        showZ: boolean
+    declare showZ: boolean
 
     // dragging: boolean
 
@@ -183,8 +183,8 @@ export class TransformControls2 extends TransformControls implements IWidget, IO
     clone: (recursive?: boolean) => this
     remove: (...object: IObject3D[]) => this
     dispatchEvent: (event: ISceneEvent) => void
-    parent: IObject3D | null
-    children: IObject3D[]
+    declare parent: IObject3D | null
+    declare children: IObject3D[]
 
     // endregion
 }

src/three/widgets/DirectionalLightHelper2.ts

@@ -10,7 +10,7 @@ export class DirectionalLightHelper2 extends ALightHelperWidget {
     color: ColorRepresentation|undefined
     lightPlane: Line2
     targetLine: Line2
-    light: (DirectionalLight&IUiConfigContainer)|undefined
+    declare light: (DirectionalLight&IUiConfigContainer)|undefined
 
     @onChange(DirectionalLightHelper2.prototype.update)
         material: LineMaterial2

src/three/widgets/PointLightHelper2.ts

@@ -9,7 +9,7 @@ import {LineMaterial2} from '../../core'
 export class PointLightHelper2 extends ALightHelperWidget {
     color: ColorRepresentation | undefined
     lightSphere: Wireframe
-    light: (PointLight & IUiConfigContainer) | undefined
+    declare light: (PointLight & IUiConfigContainer) | undefined
     @onChange(PointLightHelper2.prototype.update)
         material: LineMaterial2
     @onChange(PointLightHelper2.prototype.update)

src/three/widgets/SpotLightHelper2.ts

@@ -10,7 +10,7 @@ import {LineMaterial2} from '../../core'
 export class SpotLightHelper2 extends ALightHelperWidget {
     color: ColorRepresentation | undefined
     cone: LineSegments2
-    light: (SpotLight & IUiConfigContainer) | undefined
+    declare light: (SpotLight & IUiConfigContainer) | undefined
     @onChange(SpotLightHelper2.prototype.update)
         material: LineMaterial2
     @onChange(SpotLightHelper2.prototype.update)

src/utils/gltf.ts

@@ -7,7 +7,7 @@ import type {BlobExt} from '../assetmanager'
  * @param paddingByte (Optional)
  * @returns The same buffer if it's already aligned to 4-byte boundary or a new buffer
  */
-function getPaddedArrayBuffer(arrayBuffer: ArrayBuffer, paddingByte = 0): ArrayBuffer {
+function getPaddedArrayBuffer(arrayBuffer: Uint8Array<ArrayBuffer>, paddingByte = 0): ArrayBuffer {
     const paddedLength = getPaddedBufferSize(arrayBuffer.byteLength)
     if (paddedLength !== arrayBuffer.byteLength) {
         const array = new Uint8Array(paddedLength)
@@ -19,7 +19,7 @@ function getPaddedArrayBuffer(arrayBuffer: ArrayBuffer, paddingByte = 0): ArrayB
         }
         return array.buffer
     }
-    return arrayBuffer
+    return arrayBuffer.buffer
 }
 
 
@@ -51,7 +51,7 @@ const GLB_CHUNK_TYPE_JSON = 0x4E4F534A
 const GLB_CHUNK_TYPE_BIN = 0x004E4942
 
 // https://github.com/mrdoob/three.js/blob/4dbd0065f2ec29b89c250d8582f61e9f4792e077/examples/jsm/exporters/GLTFExporter.js#L558
-export function makeGLBFile(buffers: ArrayBuffer, json: any): BlobExt {
+export function makeGLBFile(buffers: Uint8Array<ArrayBuffer>, json: any): BlobExt {
     // Binary chunk.
     const binaryChunk = getPaddedArrayBuffer(buffers)
     const binaryChunkPrefix = new DataView(new ArrayBuffer(GLB_CHUNK_PREFIX_BYTES))
@@ -59,7 +59,8 @@ export function makeGLBFile(buffers: ArrayBuffer, json: any): BlobExt {
     binaryChunkPrefix.setUint32(4, GLB_CHUNK_TYPE_BIN, true)
 
     // JSON chunk.
-    const jsonChunk = getPaddedArrayBuffer(new TextEncoder().encode(JSON.stringify(json || {})).buffer, 0x20)
+    const buffer1 = new TextEncoder().encode(JSON.stringify(json || {})) as Uint8Array<ArrayBuffer>
+    const jsonChunk = getPaddedArrayBuffer(buffer1, 0x20)
     const jsonChunkPrefix = new DataView(new ArrayBuffer(GLB_CHUNK_PREFIX_BYTES))
     jsonChunkPrefix.setUint32(0, jsonChunk.byteLength, true)
     jsonChunkPrefix.setUint32(4, GLB_CHUNK_TYPE_JSON, true)