improve props types

src/effects/TiltShiftPass.ts

@@ -1,15 +1,16 @@
-import { defineComponent, watch } from 'vue'
+import { defineComponent, PropType, watch } from 'vue'
 import { Vector2 } from 'three'
 import { ShaderPass } from 'three/examples/jsm/postprocessing/ShaderPass.js'
 import EffectPass from './EffectPass'
 import TiltShift from '../shaders/TiltShift'
+import { Vector2PropInterface } from '../core/Object3D'
 import { bindProp } from '../tools'
 
 const props = {
   blurRadius: { type: Number, default: 10 },
   gradientRadius: { type: Number, default: 100 },
-  start: { type: Object, default: () => ({ x: 0, y: 100 }) },
+  start: { type: Object as PropType<Vector2PropInterface>, default: () => ({ x: 0, y: 100 }) },
-  end: { type: Object, default: () => ({ x: 10, y: 100 }) },
+  end: { type: Object as PropType<Vector2PropInterface>, default: () => ({ x: 10, y: 100 }) },
 }
 
 interface TiltShiftPassSetupInterface {

src/effects/ZoomBlurPass.ts

@@ -1,13 +1,14 @@
-import { defineComponent } from 'vue'
+import { defineComponent, PropType } from 'vue'
 import { ShaderPass } from 'three/examples/jsm/postprocessing/ShaderPass.js'
 import EffectPass from './EffectPass'
 import ZoomBlur from '../shaders/ZoomBlur'
+import { Vector2PropInterface } from '../core/Object3D'
 import { bindProp } from '../tools'
 
 export default defineComponent({
   extends: EffectPass,
   props: {
-    center: { type: Object, default: () => ({ x: 0.5, y: 0.5 }) },
+    center: { type: Object as PropType<Vector2PropInterface>, default: () => ({ x: 0.5, y: 0.5 }) },
     strength: { type: Number, default: 0.5 },
   },
   created() {

src/lights/DirectionalLight.ts

@@ -1,11 +1,12 @@
-import { defineComponent } from 'vue'
+import { defineComponent, PropType } from 'vue'
 import { DirectionalLight } from 'three'
+import { Vector2PropInterface } from '../core/Object3D'
 import Light from './Light'
 
 export default defineComponent({
   extends: Light,
   props: {
-    target: { type: Object, default: () => ({ x: 0, y: 0, z: 0 }) },
+    target: { type: Object as PropType<Vector2PropInterface>, default: () => ({ x: 0, y: 0, z: 0 }) },
   },
   created() {
     this.initLight(new DirectionalLight(this.color, this.intensity))

src/lights/Light.ts

@@ -1,6 +1,6 @@
 import { DirectionalLight, Light, SpotLight } from 'three'
-import { defineComponent, watch } from 'vue'
+import { defineComponent, PropType, watch } from 'vue'
-import Object3D from '../core/Object3D'
+import Object3D, { Vector2PropInterface } from '../core/Object3D'
 import { bindProp, setFromProp } from '../tools'
 
 export interface LightSetupInterface {
@@ -14,7 +14,7 @@ export default defineComponent({
     color: { type: String, default: '#ffffff' },
     intensity: { type: Number, default: 1 },
     castShadow: { type: Boolean, default: false },
-    shadowMapSize: { type: Object, default: () => ({ x: 512, y: 512 }) },
+    shadowMapSize: { type: Object as PropType<Vector2PropInterface>, default: () => ({ x: 512, y: 512 }) },
     shadowCamera: { type: Object, default: () => ({}) },
   },
   setup(): LightSetupInterface {

src/materials/StandardMaterial.ts

@@ -1,7 +1,8 @@
-import { defineComponent, watch } from 'vue'
+import { defineComponent, PropType, watch } from 'vue'
 import { MeshStandardMaterial } from 'three'
 import { bindProp, bindProps, propsValues } from '../tools'
 import Material, { wireframeProps } from './Material'
+import { Vector2PropInterface } from '../core/Object3D'
 
 const props = {
   aoMapIntensity: { type: Number, default: 1 },
@@ -13,7 +14,7 @@ const props = {
   envMapIntensity: { type: Number, default: 1 },
   lightMapIntensity: { type: Number, default: 1 },
   metalness: { type: Number, default: 0 },
-  normalScale: { type: Object, default: () => ({ x: 1, y: 1 }) },
+  normalScale: { type: Object as PropType<Vector2PropInterface>, default: () => ({ x: 1, y: 1 }) },
   roughness: { type: Number, default: 1 },
   refractionRatio: { type: Number, default: 0.98 },
   flatShading: Boolean,

src/materials/Texture.ts

@@ -2,6 +2,7 @@ import { defineComponent, PropType, watch } from 'vue'
 import { ClampToEdgeWrapping, LinearFilter, LinearMipmapLinearFilter, ShaderMaterial, Texture, TextureLoader, UVMapping } from 'three'
 import { bindProp } from '../tools'
 import { MaterialInjectionKey, MaterialInterface } from './Material'
+import { Vector2PropInterface } from '../core/Object3D'
 
 export interface TexureInterface {
   material?: MaterialInterface
@@ -25,9 +26,9 @@ export default defineComponent({
     wrapT: { type: Number, default: ClampToEdgeWrapping },
     magFilter: { type: Number, default: LinearFilter },
     minFilter: { type: Number, default: LinearMipmapLinearFilter },
-    repeat: { type: Object, default: () => ({ x: 1, y: 1 }) },
+    repeat: { type: Object as PropType<Vector2PropInterface>, default: () => ({ x: 1, y: 1 }) },
     rotation: { type: Number, default: 0 },
-    center: { type: Object, default: () => ({ x: 0, y: 0 }) },
+    center: { type: Object as PropType<Vector2PropInterface>, default: () => ({ x: 0, y: 0 }) },
   },
   setup(): TexureInterface {
     return {}