npm - @vyr/three-browser - Versions diffs - 0.0.1 - Mend

@vyr/three-browser 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (102) hide show

package/package.json +25 -0
package/src/common/index.ts +2 -0
package/src/common/provider.ts +14 -0
package/src/common/validate.ts +10 -0
package/src/fragment/GeoMapFragment.vue +129 -0
package/src/fragment/InstancedMeshFragment.vue +29 -0
package/src/fragment/MeshFragment.vue +98 -0
package/src/fragment/ModelFragment.vue +28 -0
package/src/fragment/NodeFragment.vue +93 -0
package/src/fragment/ParticleFragment.vue +147 -0
package/src/fragment/PointsFragment.vue +34 -0
package/src/fragment/SpriteFragment.vue +38 -0
package/src/fragment/TextFragment.vue +98 -0
package/src/fragment/animation/AnimationActionFragment.vue +110 -0
package/src/fragment/geometry/BoxGeometryFragment.vue +44 -0
package/src/fragment/geometry/BufferGeometryFragment.vue +26 -0
package/src/fragment/geometry/CircleGeometryFragment.vue +35 -0
package/src/fragment/geometry/CylinderGeometryFragment.vue +60 -0
package/src/fragment/geometry/ExtrudeGeometryFragment.vue +111 -0
package/src/fragment/geometry/PlaneGeometryFragment.vue +35 -0
package/src/fragment/geometry/RingGeometryFragment.vue +45 -0
package/src/fragment/geometry/SphereGeometryFragment.vue +51 -0
package/src/fragment/geometry/SurfaceGeometryFragment.vue +18 -0
package/src/fragment/geometry/TubeGeometryFragment.vue +65 -0
package/src/fragment/light/AmbientLightFragment.vue +27 -0
package/src/fragment/light/DirectionalLightFragment.vue +86 -0
package/src/fragment/light/HemisphereLightFragment.vue +34 -0
package/src/fragment/light/PointLightFragment.vue +68 -0
package/src/fragment/light/RectAreaLightFragment.vue +48 -0
package/src/fragment/light/SpotLightFragment.vue +96 -0
package/src/fragment/material/MaterialFragment.vue +53 -0
package/src/fragment/material/MeshBasicMaterialFragment.vue +126 -0
package/src/fragment/material/MeshPhongMaterialFragment.vue +263 -0
package/src/fragment/material/MeshStandardMaterialFragment.vue +256 -0
package/src/fragment/material/PointsMaterialFragment.vue +81 -0
package/src/fragment/material/ShaderMaterialFragment.vue +61 -0
package/src/fragment/material/ShadowMaterialFragment.vue +49 -0
package/src/fragment/material/SpriteMaterialFragment.vue +79 -0
package/src/fragment/texture/TextureFragment.vue +131 -0
package/src/index.ts +4 -0
package/src/locale/Language.ts +10 -0
package/src/locale/LanguageProvider.ts +655 -0
package/src/locale/index.ts +2 -0
package/src/option/Animation.ts +17 -0
package/src/option/Geometry.ts +22 -0
package/src/option/Material.ts +42 -0
package/src/option/Mesh.ts +10 -0
package/src/option/Shadow.ts +18 -0
package/src/option/Texture.ts +55 -0
package/src/option/index.ts +6 -0
package/src/service/footer/action/geometry/index.ts +73 -0
package/src/service/footer/action/index.ts +9 -0
package/src/service/footer/action/material/index.ts +70 -0
package/src/service/footer/action/texture/index.ts +63 -0
package/src/service/global/index.ts +1 -0
package/src/service/global/scripts/index.ts +12 -0
package/src/service/index.ts +79 -0
package/src/service/inspector/GeoMapViewer.vue +32 -0
package/src/service/inspector/HTMLConvertViewer.vue +31 -0
package/src/service/inspector/InstanceMeshViewer.vue +33 -0
package/src/service/inspector/MeshViewer.vue +33 -0
package/src/service/inspector/ModelViewer.vue +34 -0
package/src/service/inspector/NodeViewer.vue +30 -0
package/src/service/inspector/ParticleViewer.vue +37 -0
package/src/service/inspector/PerspectiveCameraViewer.vue +62 -0
package/src/service/inspector/PointsViewer.vue +33 -0
package/src/service/inspector/ServiceViewer.vue +92 -0
package/src/service/inspector/SpriteViewer.vue +34 -0
package/src/service/inspector/TextViewer.vue +34 -0
package/src/service/inspector/animation/AnimationActionViewer.vue +31 -0
package/src/service/inspector/geometry/BoxGeometryViewer.vue +32 -0
package/src/service/inspector/geometry/BufferGeometryViewer.vue +33 -0
package/src/service/inspector/geometry/CircleGeometryViewer.vue +32 -0
package/src/service/inspector/geometry/CylinderGeometryViewer.vue +32 -0
package/src/service/inspector/geometry/ExtrudeGeometryViewer.vue +32 -0
package/src/service/inspector/geometry/PlaneGeometryViewer.vue +32 -0
package/src/service/inspector/geometry/RingGeometryViewer.vue +32 -0
package/src/service/inspector/geometry/SphereGeometryViewer.vue +32 -0
package/src/service/inspector/geometry/SurfaceGeometryViewer.vue +32 -0
package/src/service/inspector/geometry/TubeGeometryViewer.vue +32 -0
package/src/service/inspector/index.ts +50 -0
package/src/service/inspector/light/AmbientLightViewer.vue +33 -0
package/src/service/inspector/light/DirectionalLightViewer.vue +33 -0
package/src/service/inspector/light/HemisphereLightViewer.vue +33 -0
package/src/service/inspector/light/PointLightViewer.vue +33 -0
package/src/service/inspector/light/RectAreaLightViewer.vue +33 -0
package/src/service/inspector/light/SpotLightViewer.vue +33 -0
package/src/service/inspector/material/MeshBasicMaterialViewer.vue +34 -0
package/src/service/inspector/material/MeshPhongMaterialViewer.vue +34 -0
package/src/service/inspector/material/MeshStandardMaterialViewer.vue +34 -0
package/src/service/inspector/material/PointsMaterialViewer.vue +33 -0
package/src/service/inspector/material/ShaderMaterialViewer.vue +34 -0
package/src/service/inspector/material/ShadowMaterialViewer.vue +34 -0
package/src/service/inspector/material/SpriteMaterialViewer.vue +34 -0
package/src/service/inspector/texture/TextureViewer.vue +32 -0
package/src/service/sidebar/asset/action/AddAnimationAction.ts +66 -0
package/src/service/sidebar/asset/action/AddLightAction.ts +66 -0
package/src/service/sidebar/asset/action/index.ts +7 -0
package/src/service/sidebar/scene/action/AddAnimationAction.ts +64 -0
package/src/service/sidebar/scene/action/AddLightAction.ts +66 -0
package/src/service/sidebar/scene/action/index.ts +7 -0
package/src/shims-vue.d.ts +10 -0

package/src/fragment/material/MeshPhongMaterialFragment.vue ADDED Viewed

@@ -0,0 +1,263 @@
+<template>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.color')">
+            <vyr-col>
+                <vyr-checked v-model="descriptor.colorWrite"></vyr-checked>
+                <vyr-color-picker v-model="descriptor.color.value" width="all"></vyr-color-picker>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.map')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.map" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="map"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.refractionRatio')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.refractionRatio" :clearable="false" :allow-null="false"
+                    :default-value="0"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.transparent')">
+            <vyr-col>
+                <vyr-checked v-model="descriptor.transparent"></vyr-checked>
+                <vyr-input-number v-model="descriptor.color.opacity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.alphaMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.alphaMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="alphaMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.alphaTest')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.alphaTest" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.envMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.envMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="envMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.combine')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.combine" :data="Material.combineOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.reflectivity')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.reflectivity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.envMapRotation')">
+            <vyr-col :span="8">
+                <vyr-input-number v-model="descriptor.envMapRotation.x" :clearable="false" :allow-null="false"
+                    :default-value="0"></vyr-input-number>
+            </vyr-col>
+            <vyr-col :span="8">
+                <vyr-input-number v-model="descriptor.envMapRotation.y" :clearable="false" :allow-null="false"
+                    :default-value="0"></vyr-input-number>
+            </vyr-col>
+            <vyr-col :span="8">
+                <vyr-input-number v-model="descriptor.envMapRotation.z" :clearable="false" :allow-null="false"
+                    :default-value="0"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.lightMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.lightMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="lightMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.lightMapIntensity')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.lightMapIntensity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.specularMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.specularMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="specularMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.specular')">
+            <vyr-col>
+                <vyr-color-picker v-model="descriptor.specular" width="all"></vyr-color-picker>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.shininess')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.shininess" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.aoMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.aoMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="aoMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.aoMapIntensity')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.aoMapIntensity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.bumpMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.bumpMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="bumpMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.bumpScale')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.bumpScale" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.displacementMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.displacementMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="displacementMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.displacementScale')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.displacementScale" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.displacementBias')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.displacementBias" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.emissive')">
+            <vyr-col>
+                <vyr-color-picker v-model="descriptor.emissive" width="all"></vyr-color-picker>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.emissiveMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.emissiveMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="emissiveMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.emissiveIntensity')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.emissiveIntensity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.normalMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.normalMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="normalMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.normalMapType')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.normalMapType" :data="Material.normalTypeOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.normalScale')">
+            <vyr-col :span="12">
+                <vyr-input-number v-model="descriptor.normalScale.x" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+            <vyr-col :span="12">
+                <vyr-input-number v-model="descriptor.normalScale.y" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.fog')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.fog" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.flatShading')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.flatShading" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.wireframe')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.wireframe" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+</template>
+<script lang="ts" setup>
+import { computed } from 'vue'
+import { DraggableService, runtime } from '@vyr/runtime';
+import { MeshPhongMaterialDescriptor } from '@vyr/three';
+import { VyrInput, VyrRow, VyrCol, VyrLabel, VyrChecked, VyrColorPicker, VyrInputNumber, VyrSelect } from '@vyr/design';
+import { option } from '@vyr/builtin'
+import { language } from '../../locale'
+import { useDescriptor } from '../../common';
+import { Material } from '../../option';
+const draggableService = runtime.get<DraggableService>('draggable')
+const draggable = computed(() => draggableService.get(draggableService.key.inspector))
+const descriptor = useDescriptor<MeshPhongMaterialDescriptor>()
+</script>
+<style lang="less" scoped></style>

package/src/fragment/material/MeshStandardMaterialFragment.vue ADDED Viewed

@@ -0,0 +1,256 @@
+<template>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.color')">
+            <vyr-col>
+                <vyr-checked v-model="descriptor.colorWrite"></vyr-checked>
+                <vyr-color-picker v-model="descriptor.color.value" width="all"></vyr-color-picker>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.map')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.map" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="map"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.transparent')">
+            <vyr-col>
+                <vyr-checked v-model="descriptor.transparent"></vyr-checked>
+                <vyr-input-number v-model="descriptor.color.opacity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.alphaMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.alphaMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="alphaMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.alphaTest')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.alphaTest" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.envMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.envMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="envMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.envMapIntensity')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.envMapIntensity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.envMapRotation')">
+            <vyr-col :span="8">
+                <vyr-input-number v-model="descriptor.envMapRotation.x" :clearable="false" :allow-null="false"
+                    :default-value="0"></vyr-input-number>
+            </vyr-col>
+            <vyr-col :span="8">
+                <vyr-input-number v-model="descriptor.envMapRotation.y" :clearable="false" :allow-null="false"
+                    :default-value="0"></vyr-input-number>
+            </vyr-col>
+            <vyr-col :span="8">
+                <vyr-input-number v-model="descriptor.envMapRotation.z" :clearable="false" :allow-null="false"
+                    :default-value="0"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.lightMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.lightMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="lightMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.lightMapIntensity')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.lightMapIntensity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.aoMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.aoMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="aoMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.aoMapIntensity')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.aoMapIntensity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.bumpMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.bumpMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="bumpMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.bumpScale')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.bumpScale" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.displacementMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.displacementMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="displacementMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.displacementScale')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.displacementScale" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.displacementBias')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.displacementBias" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.emissive')">
+            <vyr-col>
+                <vyr-color-picker v-model="descriptor.emissive" width="all"></vyr-color-picker>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.emissiveMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.emissiveMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="emissiveMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.emissiveIntensity')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.emissiveIntensity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.metalnessMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.metalnessMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="metalnessMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.metalness')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.metalness" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.normalMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.normalMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="normalMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.normalMapType')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.normalMapType" :data="Material.normalTypeOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.normalScale')">
+            <vyr-col :span="12">
+                <vyr-input-number v-model="descriptor.normalScale.x" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+            <vyr-col :span="12">
+                <vyr-input-number v-model="descriptor.normalScale.y" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.roughnessMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.roughnessMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="roughnessMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.roughness')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.roughness" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.fog')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.fog" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.flatShading')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.flatShading" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.wireframe')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.wireframe" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+</template>
+<script lang="ts" setup>
+import { computed } from 'vue'
+import { DraggableService, runtime } from '@vyr/runtime';
+import { MeshStandardMaterialDescriptor } from '@vyr/three';
+import { VyrInput, VyrRow, VyrCol, VyrLabel, VyrChecked, VyrColorPicker, VyrInputNumber, VyrSelect } from '@vyr/design';
+import { option } from '@vyr/builtin'
+import { language } from '../../locale'
+import { useDescriptor } from '../../common';
+import { Material } from '../../option';
+const draggableService = runtime.get<DraggableService>('draggable')
+const draggable = computed(() => draggableService.get(draggableService.key.inspector))
+const descriptor = useDescriptor<MeshStandardMaterialDescriptor>()
+</script>
+<style lang="less" scoped></style>

package/src/fragment/material/PointsMaterialFragment.vue ADDED Viewed

@@ -0,0 +1,81 @@
+<template>
+    <slot></slot>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.color')">
+            <vyr-col>
+                <vyr-checked v-model="descriptor.colorWrite"></vyr-checked>
+                <vyr-color-picker v-model="descriptor.color.value" width="all"></vyr-color-picker>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.map')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.map" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="map"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.transparent')">
+            <vyr-col>
+                <vyr-checked v-model="descriptor.transparent"></vyr-checked>
+                <vyr-input-number v-model="descriptor.color.opacity" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.alphaMap')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.alphaMap" :clearable="true" :draggable="draggable" trigger="blur"
+                    dragkey="alphaMap"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.alphaTest')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.alphaTest" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row v-if="sizable !== false">
+        <vyr-label :label="language.get('inspector.Material.size')">
+            <vyr-col>
+                <vyr-input-number v-model="descriptor.size" :allow-null="false"></vyr-input-number>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.sizeAttenuation')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.sizeAttenuation" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.fog')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.fog" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+</template>
+<script lang="ts" setup>
+import { computed } from 'vue'
+import { DraggableService, runtime } from '@vyr/runtime';
+import { PointsMaterialDescriptor } from '@vyr/three';
+import { VyrInput, VyrRow, VyrCol, VyrLabel, VyrChecked, VyrColorPicker, VyrInputNumber, VyrSelect } from '@vyr/design';
+import { option } from '@vyr/builtin'
+import { language } from '../../locale'
+import { useDescriptor } from '../../common';
+defineProps<{ sizable?: boolean }>()
+const draggableService = runtime.get<DraggableService>('draggable')
+const draggable = computed(() => draggableService.get(draggableService.key.inspector))
+const descriptor = useDescriptor<PointsMaterialDescriptor>()
+</script>
+<style lang="less" scoped></style>

package/src/fragment/material/ShaderMaterialFragment.vue ADDED Viewed

@@ -0,0 +1,61 @@
+<template>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.transparent')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.transparent" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.shader')">
+            <vyr-col>
+                <vyr-input v-model="descriptor.shader" :clearable="true" :draggable="draggable" dragkey="shader"
+                    trigger="blur"></vyr-input>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.lights')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.lights" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.fog')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.fog" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.flatShading')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.flatShading" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+    <vyr-row>
+        <vyr-label :label="language.get('inspector.Material.wireframe')">
+            <vyr-col>
+                <vyr-select v-model="descriptor.wireframe" :data="option.stateOptions"></vyr-select>
+            </vyr-col>
+        </vyr-label>
+    </vyr-row>
+</template>
+<script lang="ts" setup>
+import { computed } from 'vue'
+import { DraggableService, runtime } from '@vyr/runtime';
+import { ShaderMaterialDescriptor } from '@vyr/three';
+import { VyrRow, VyrCol, VyrLabel, VyrInput, VyrSelect } from '@vyr/design';
+import { option } from '@vyr/builtin'
+import { language } from '../../locale'
+import { useDescriptor } from '../../common';
+const draggableService = runtime.get<DraggableService>('draggable')
+const draggable = computed(() => draggableService.get(draggableService.key.inspector))
+const descriptor = useDescriptor<ShaderMaterialDescriptor>()
+</script>
+<style lang="less" scoped></style>