flo-bit.dev
[READ-ONLY] Mirror of https://github.com/flo-bit/room. tiny 3d rooms saved locally or in your bluesky account, svelte/threlte
flo-bit.dev/room/
2.4 kB
91 lines
1<!--
2Auto-generated by: https://github.com/threlte/threlte/tree/main/packages/gltf
3Command: npx @threlte/gltf@3.0.0 static/models/kenney-furniture-kit/chairDesk.glb -t -s
4-->
5
6<script lang="ts">
7 import type * as THREE from 'three'
8
9 import type { Snippet } from 'svelte'
10 import { T, type Props } from '@threlte/core'
11 import { useGltf } from '@threlte/extras'
12 import { base } from '$app/paths';
13
14 let {
15 fallback,
16 error,
17 children,
18 ref = $bindable(),
19 colors,
20 opacity,
21 ...props
22 }: Props<THREE.Group> & {
23 ref?: THREE.Group
24 children?: Snippet<[{ ref: THREE.Group }]>
25 fallback?: Snippet
26 error?: Snippet<[{ error: Error }]>;
27 colors?: (number | string)[];
28 opacity?: number;
29 } = $props();
30
31 type GLTFResult = {
32 nodes: {
33 ['chairDesk(Clone)']: THREE.Mesh
34 Mesh_chair: THREE.Mesh
35 Mesh_chair_1: THREE.Mesh
36 }
37 materials: {
38 metalMedium: THREE.MeshStandardMaterial
39 carpet: THREE.MeshStandardMaterial
40 }
41 }
42
43 const gltf = useGltf<GLTFResult>(base + '/models/kenney-furniture-kit/chairDesk.glb');
44</script>
45
46<T.Group
47 bind:ref
48 dispose={false}
49 {...props}
50>
51 {#await gltf}
52 {@render fallback?.()}
53 {:then gltf}
54 <T.Mesh
55 castShadow
56 receiveShadow
57 geometry={gltf.nodes['chairDesk(Clone)'].geometry}
58 material={gltf.materials.metalMedium.clone()}
59 material.color={colors?.[0] ?? gltf.materials.metalMedium.color}
60 material.opacity={opacity ?? gltf.materials.metalMedium.opacity}
61 material.transparent={opacity !== undefined}
62 position={[-0.16, 0.0, 0.16]}
63
64 >
65 <T.Group position={[0.17, 0.19, -0.16]}>
66 <T.Mesh
67 castShadow
68 receiveShadow
69 geometry={gltf.nodes.Mesh_chair.geometry}
70 material={gltf.materials.carpet.clone()}
71 material.color={colors?.[1] ?? gltf.materials.carpet.color}
72 material.opacity={opacity ?? gltf.materials.carpet.opacity}
73 material.transparent={opacity !== undefined}
74 />
75 <T.Mesh
76 castShadow
77 receiveShadow
78 geometry={gltf.nodes.Mesh_chair_1.geometry}
79 material={gltf.materials.metalMedium.clone()}
80 material.color={colors?.[0] ?? gltf.materials.metalMedium.color}
81 material.opacity={opacity ?? gltf.materials.metalMedium.opacity}
82 material.transparent={opacity !== undefined}
83 />
84 </T.Group>
85 </T.Mesh>
86 {:catch err}
87 {@render error?.({ error: err })}
88 {/await}
89
90 {@render children?.({ ref })}
91</T.Group>