From 0bfac37f530011f815c6238a403443adef06c7df Mon Sep 17 00:00:00 2001 From: Kevin Levron Date: Mon, 26 Apr 2021 18:38:17 +0200 Subject: [PATCH] improve props types --- src/effects/TiltShiftPass.ts | 7 ++++--- src/effects/ZoomBlurPass.ts | 5 +++-- src/lights/DirectionalLight.ts | 5 +++-- src/lights/Light.ts | 6 +++--- src/materials/StandardMaterial.ts | 5 +++-- src/materials/Texture.ts | 5 +++-- 6 files changed, 19 insertions(+), 14 deletions(-) diff --git a/src/effects/TiltShiftPass.ts b/src/effects/TiltShiftPass.ts index cdebe70..5e38226 100644 --- a/src/effects/TiltShiftPass.ts +++ b/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 }) }, - end: { type: Object, default: () => ({ x: 10, y: 100 }) }, + start: { type: Object as PropType, default: () => ({ x: 0, y: 100 }) }, + end: { type: Object as PropType, default: () => ({ x: 10, y: 100 }) }, } interface TiltShiftPassSetupInterface { diff --git a/src/effects/ZoomBlurPass.ts b/src/effects/ZoomBlurPass.ts index 5cef55c..9950418 100644 --- a/src/effects/ZoomBlurPass.ts +++ b/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, default: () => ({ x: 0.5, y: 0.5 }) }, strength: { type: Number, default: 0.5 }, }, created() { diff --git a/src/lights/DirectionalLight.ts b/src/lights/DirectionalLight.ts index 3f026e6..138975b 100644 --- a/src/lights/DirectionalLight.ts +++ b/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, default: () => ({ x: 0, y: 0, z: 0 }) }, }, created() { this.initLight(new DirectionalLight(this.color, this.intensity)) diff --git a/src/lights/Light.ts b/src/lights/Light.ts index e40b9b2..ecf9526 100644 --- a/src/lights/Light.ts +++ b/src/lights/Light.ts @@ -1,6 +1,6 @@ import { DirectionalLight, Light, SpotLight } from 'three' -import { defineComponent, watch } from 'vue' -import Object3D from '../core/Object3D' +import { defineComponent, PropType, watch } from 'vue' +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, default: () => ({ x: 512, y: 512 }) }, shadowCamera: { type: Object, default: () => ({}) }, }, setup(): LightSetupInterface { diff --git a/src/materials/StandardMaterial.ts b/src/materials/StandardMaterial.ts index a01e30b..0a628ac 100644 --- a/src/materials/StandardMaterial.ts +++ b/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, default: () => ({ x: 1, y: 1 }) }, roughness: { type: Number, default: 1 }, refractionRatio: { type: Number, default: 0.98 }, flatShading: Boolean, diff --git a/src/materials/Texture.ts b/src/materials/Texture.ts index 12ae622..feaabea 100644 --- a/src/materials/Texture.ts +++ b/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, default: () => ({ x: 1, y: 1 }) }, rotation: { type: Number, default: 0 }, - center: { type: Object, default: () => ({ x: 0, y: 0 }) }, + center: { type: Object as PropType, default: () => ({ x: 0, y: 0 }) }, }, setup(): TexureInterface { return {}