@threlte/extras
<SoftShadows>
This component is a port of the component <SoftShadows>
from drei.
It injects Percentage-Closer Soft Shadows (PCSS) into Three.js’ shader chunk. Mounting and unmounting this component will lead to all shaders being be re-compiled, although it will only cause overhead if <SoftShadows>
is mounted after the scene has already rendered, if it mounts with everything else in your scene shaders will compile naturally.
<script lang="ts">
import { Canvas } from '@threlte/core'
import { Theatre } from '@threlte/theatre'
import Scene from './Scene.svelte'
import state from './state.json'
</script>
<div>
<Canvas>
<Theatre config={{ state }}>
<Scene />
</Theatre>
</Canvas>
</div>
<style>
div {
height: 100%;
}
</style>
<script lang="ts">
import { types } from '@theatre/core'
import { T, useThrelte } from '@threlte/core'
import { Environment, OrbitControls, Portal, SoftShadows } from '@threlte/extras'
import { SheetObject } from '@threlte/theatre'
import type { DirectionalLightHelper } from 'three'
import Suzanne from './Suzanne.svelte'
const { scene } = useThrelte()
let lightHelper: DirectionalLightHelper
</script>
<T.PerspectiveCamera
makeDefault
position={[0, 10, 20]}
fov={36}
>
<OrbitControls />
</T.PerspectiveCamera>
<Suzanne />
<SheetObject
key="Light"
let:Transform
props={{}}
on:change={() => {
lightHelper?.update()
}}
let:selected
>
<Transform>
<T.DirectionalLight
position={[0, 0, 0]}
castShadow
let:ref
shadow.mapSize.width={1024}
shadow.mapSize.height={1024}
shadow.bias={0.0001}
>
{#if selected}
<Portal object={scene}>
<T.DirectionalLightHelper
bind:ref={lightHelper}
args={[ref]}
/>
</Portal>
{/if}
</T.DirectionalLight>
</Transform>
</SheetObject>
<SheetObject
key="Shadows"
props={{
soft: true,
size: types.number(25, {
range: [0, 100]
}),
focus: types.number(0, {
range: [0, 10]
}),
samples: types.number(10, {
range: [0, 100]
})
}}
let:values
>
{#if values.soft}
<SoftShadows
focus={values.focus}
size={values.size}
samples={values.samples}
/>
{/if}
</SheetObject>
<Environment
path="/hdr/"
files="mpumalanga_veld_puresky_1k.hdr"
/>
<!--
Auto-generated by: https://github.com/threlte/threlte/tree/main/packages/gltf
Command: npx @threlte/gltf@1.0.1 ./Suzanne.glb -t -s
-->
<script lang="ts">
import { T, forwardEventHandlers, type Events, type Props, type Slots } from '@threlte/core'
import { useGltf } from '@threlte/extras'
import { Sequence, Sheet, SheetObject } from '@threlte/theatre'
import type * as THREE from 'three'
import { Group } from 'three'
type $$Props = Props<THREE.Group>
type $$Events = Events<THREE.Group>
type $$Slots = Slots<THREE.Group> & { fallback: {}; error: { error: any } }
export const ref = new Group()
type GLTFResult = {
nodes: {
Suzanne: THREE.Mesh
Icosphere: THREE.Mesh
Cylinder: THREE.Mesh
Floor: THREE.Mesh
}
materials: {
Mat: THREE.MeshStandardMaterial
}
}
const gltf = useGltf<GLTFResult>('/models/Suzanne.glb')
const component = forwardEventHandlers()
</script>
<T
is={ref}
dispose={false}
{...$$restProps}
bind:this={$component}
>
{#await gltf}
<slot name="fallback" />
{:then gltf}
<Sheet name="Suzanne">
<Sequence
autoplay
iterationCount={Infinity}
/>
<SheetObject
key="Suzanne"
let:Transform
>
<Transform>
<T.Mesh
castShadow
receiveShadow
geometry={gltf.nodes.Suzanne.geometry}
material={gltf.materials.Mat}
rotation={[-0.62, 0, 0]}
/>
</Transform>
</SheetObject>
</Sheet>
<Sheet name="Icosphere">
<Sequence
autoplay
iterationCount={Infinity}
/>
<SheetObject
key="Icosphere"
let:Transform
>
<Transform>
<T.Mesh
castShadow
receiveShadow
geometry={gltf.nodes.Icosphere.geometry}
material={gltf.materials.Mat}
rotation={[-0.62, 0.09, 1.4]}
/>
</Transform>
</SheetObject>
</Sheet>
<Sheet name="Cylinder">
<Sequence
autoplay
iterationCount={Infinity}
/>
<SheetObject
key="Cylinder"
let:Transform
>
<Transform>
<T.Mesh
castShadow
receiveShadow
geometry={gltf.nodes.Cylinder.geometry}
material={gltf.materials.Mat}
/>
</Transform>
</SheetObject>
</Sheet>
<T.Mesh
receiveShadow
geometry={gltf.nodes.Floor.geometry}
material={gltf.materials.Mat}
position={[0, -0.1, 0]}
/>
{:catch error}
<slot
name="error"
{error}
/>
{/await}
<slot {ref} />
</T>
{
"sheetsById": {
"Box": {
"staticOverrides": {
"byObject": {
"Box": {
"position": {
"x": -0.8181591173352025,
"y": -1.4641087811500046,
"z": 7.480952349241813
},
"rotation": {
"x": 0,
"y": 61.01858555446879,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"materialColor": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"opacity": 1,
"emissive": {
"r": 0,
"g": 0.00392156862745098,
"b": 0.0196078431372549,
"a": 1
},
"color": {
"r": 1,
"g": 0.14901960784313725,
"b": 0,
"a": 1
},
"floatIntensity": 0,
"roughness": 0.418,
"metalness": 0.6139240506329124,
"html": {
"position": {
"x": 0,
"y": 1.5709407768131078,
"z": 0
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
}
}
}
}
},
"sequence": {
"subUnitsPerUnit": 30,
"length": 10,
"type": "PositionalSequence",
"tracksByObject": {
"Box": {
"trackData": {
"YvCk5XcEbV": {
"type": "BasicKeyframedTrack",
"__debugName": "Box:[\"position\",\"x\"]",
"keyframes": [
{
"id": "N-HL7q-Ho9",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
},
{
"id": "ahiZC37zxQ",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
}
]
},
"h3T8gYQ2jq": {
"type": "BasicKeyframedTrack",
"__debugName": "Box:[\"position\",\"y\"]",
"keyframes": [
{
"id": "6X77NlinAT",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": -1.6574962507555557
},
{
"id": "TG8R5_-OFH",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
}
]
},
"zBvS2eRIjP": {
"type": "BasicKeyframedTrack",
"__debugName": "Box:[\"position\",\"z\"]",
"keyframes": [
{
"id": "7Ajl_XbDvW",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 11.210939599125854
},
{
"id": "NfzY_VZ3Cu",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": -5
}
]
},
"-F5mUmCrYl": {
"type": "BasicKeyframedTrack",
"__debugName": "Box:[\"rotation\",\"x\"]",
"keyframes": [
{
"id": "nRLU6ICRUg",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 7.8
},
{
"id": "oUIdHcq8Tl",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 30.000000000000018
}
]
},
"DYLA79WxJj": {
"type": "BasicKeyframedTrack",
"__debugName": "Box:[\"rotation\",\"y\"]",
"keyframes": [
{
"id": "QgpWXY-6Qx",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 45
},
{
"id": "Wcr083n-Wo",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 45.000000000000014
}
]
},
"rokyYn1NaI": {
"type": "BasicKeyframedTrack",
"__debugName": "Box:[\"rotation\",\"z\"]",
"keyframes": [
{
"id": "Ax8nn_LgQK",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": -1.343808101064193e-16
},
{
"id": "uBwo1LCH7o",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": -2.248991783197472e-15
}
]
},
"oyqS30CwcD": {
"type": "BasicKeyframedTrack",
"__debugName": "Box:[\"scale\",\"x\"]",
"keyframes": [
{
"id": "KOXMS7Sz1B",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
},
{
"id": "d7g8_--OKU",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
}
]
},
"4YS7OyK_HZ": {
"type": "BasicKeyframedTrack",
"__debugName": "Box:[\"scale\",\"y\"]",
"keyframes": [
{
"id": "PtkdA3APZ2",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
},
{
"id": "D5AHPi8oUV",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
}
]
},
"R9eWFmFxi1": {
"type": "BasicKeyframedTrack",
"__debugName": "Box:[\"scale\",\"z\"]",
"keyframes": [
{
"id": "yQe-guL-mV",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
},
{
"id": "HygYq9U4i0",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
}
]
},
"0Y9QeGZLqF": {
"type": "BasicKeyframedTrack",
"__debugName": "Box:[\"floatIntensity\"]",
"keyframes": [
{
"id": "Ax01QHBhxj",
"position": 2.933,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
},
{
"id": "Nnt8mpJ_2F",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 4
}
]
}
},
"trackIdByPropPath": {
"[\"position\",\"x\"]": "YvCk5XcEbV",
"[\"position\",\"y\"]": "h3T8gYQ2jq",
"[\"position\",\"z\"]": "zBvS2eRIjP",
"[\"rotation\",\"x\"]": "-F5mUmCrYl",
"[\"rotation\",\"y\"]": "DYLA79WxJj",
"[\"rotation\",\"z\"]": "rokyYn1NaI",
"[\"scale\",\"x\"]": "oyqS30CwcD",
"[\"scale\",\"y\"]": "4YS7OyK_HZ",
"[\"scale\",\"z\"]": "R9eWFmFxi1",
"[\"floatIntensity\"]": "0Y9QeGZLqF"
}
}
}
}
},
"Scene": {
"staticOverrides": {
"byObject": {
"Directional Light 1": {
"position": {
"x": -0.9184335258502159,
"y": 5.6988319063589845,
"z": 3.9482853627985675
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"intensity": 1.2658227848101258
},
"Directional Light 2": {
"position": {
"x": -8.510737943028529,
"y": -7.578903602798855,
"z": 3.095527250975193
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"intensity": 0.481012658227849,
"color": {
"r": 1,
"g": 1,
"b": 1,
"a": 1
}
},
"Camera": {
"position": {
"x": -1.7035070675335056,
"y": 20.19263058502501,
"z": 2.6529651093808915
},
"rotation": {
"x": -83.76271306815725,
"y": -4.183923582652951,
"z": -33.72496066824407
},
"scale": {
"x": 1,
"y": 1,
"z": 1
}
}
}
},
"sequence": {
"subUnitsPerUnit": 30,
"length": 10,
"type": "PositionalSequence",
"tracksByObject": {
"Camera": {
"trackData": {
"CIKWP9G0pE": {
"type": "BasicKeyframedTrack",
"__debugName": "Camera:[\"fov\"]",
"keyframes": []
},
"KKpe5gFc9N": {
"type": "BasicKeyframedTrack",
"__debugName": "Camera:[\"position\",\"x\"]",
"keyframes": [
{
"id": "5kEcBAOZaT",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.455,
0.03
],
"type": "bezier",
"value": 0
},
{
"id": "SqHYBpJdRN",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
}
]
},
"NVrrrE3jcl": {
"type": "BasicKeyframedTrack",
"__debugName": "Camera:[\"position\",\"y\"]",
"keyframes": [
{
"id": "fjjZRptYi6",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.455,
0.03
],
"type": "bezier",
"value": 16
},
{
"id": "-uNrZ9C3ME",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 10
}
]
},
"pJDfFIuzJQ": {
"type": "BasicKeyframedTrack",
"__debugName": "Camera:[\"position\",\"z\"]",
"keyframes": [
{
"id": "AiP5p7Tu_U",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.455,
0.03
],
"type": "bezier",
"value": 2
},
{
"id": "M2kKSBIMJr",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 19
}
]
},
"ms80Z7GfT_": {
"type": "BasicKeyframedTrack",
"__debugName": "Camera:[\"rotation\",\"x\"]",
"keyframes": [
{
"id": "6YGzQPF1Cm",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.42732063773250667,
0.0387719298245614
],
"type": "bezier",
"value": -81.83482633669205
},
{
"id": "-V7pt--YkS",
"position": 10,
"connectedRight": true,
"handles": [
0.4153542958370239,
0.9637719298245613,
0.5,
0
],
"type": "bezier",
"value": -27.320930507778307
}
]
},
"jBSvsQIhg6": {
"type": "BasicKeyframedTrack",
"__debugName": "Camera:[\"rotation\",\"y\"]",
"keyframes": [
{
"id": "-jzAu-vc41",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.455,
0.03
],
"type": "bezier",
"value": 0
},
{
"id": "EzUfzIab-s",
"position": 10,
"connectedRight": true,
"handles": [
0.515,
0.955,
0.5,
0
],
"type": "bezier",
"value": 0
}
]
},
"C8SbjHlv-E": {
"type": "BasicKeyframedTrack",
"__debugName": "Camera:[\"rotation\",\"z\"]",
"keyframes": [
{
"id": "ZSWvTPoQ-E",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.455,
0.03
],
"type": "bezier",
"value": 0
},
{
"id": "nyMoco_KGB",
"position": 10,
"connectedRight": true,
"handles": [
0.515,
0.955,
0.5,
0
],
"type": "bezier",
"value": 0
}
]
},
"t2VkyIsT2A": {
"type": "BasicKeyframedTrack",
"__debugName": "Camera:[\"scale\",\"x\"]",
"keyframes": [
{
"id": "kUEax7w1Vm",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
},
{
"id": "an1LAZtqGl",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
}
]
},
"V5P-54Ubt6": {
"type": "BasicKeyframedTrack",
"__debugName": "Camera:[\"scale\",\"y\"]",
"keyframes": [
{
"id": "A-9v2tTfh9",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
},
{
"id": "iBcXuc-6GK",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
}
]
},
"6X_tDlnHko": {
"type": "BasicKeyframedTrack",
"__debugName": "Camera:[\"scale\",\"z\"]",
"keyframes": [
{
"id": "U9_A0gvYRD",
"position": 0,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
},
{
"id": "QBXblzXzDp",
"position": 10,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
}
]
}
},
"trackIdByPropPath": {
"[\"fov\"]": "CIKWP9G0pE",
"[\"position\",\"x\"]": "KKpe5gFc9N",
"[\"position\",\"y\"]": "NVrrrE3jcl",
"[\"position\",\"z\"]": "pJDfFIuzJQ",
"[\"rotation\",\"x\"]": "ms80Z7GfT_",
"[\"rotation\",\"y\"]": "jBSvsQIhg6",
"[\"rotation\",\"z\"]": "C8SbjHlv-E",
"[\"scale\",\"x\"]": "t2VkyIsT2A",
"[\"scale\",\"y\"]": "V5P-54Ubt6",
"[\"scale\",\"z\"]": "6X_tDlnHko"
}
}
}
}
},
"Threlte-Composite": {
"staticOverrides": {
"byObject": {
"Box Top": {
"position": {
"x": 0,
"y": 2,
"z": 0
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"metalness": 0,
"roughness": 0.2,
"envMapIntensity": 10
},
"Box Bottom X+": {
"position": {
"x": 2,
"y": 0,
"z": 0
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"roughness": 0.2,
"metalness": 0,
"envMapIntensity": 10
},
"Box Bottom X-": {
"position": {
"x": -2,
"y": 0,
"z": 0
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"emissive": {
"r": 0,
"g": 0.00030352698352941176,
"b": 0.0015176349176470587,
"a": 1
},
"roughness": 0.2,
"metalness": 0,
"envMapIntensity": 1
},
"Box Bottom Z+": {
"position": {
"x": 0,
"y": 0,
"z": 2
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"roughness": 0.2,
"metalness": 0
},
"Box Bottom Z-": {
"position": {
"x": 0,
"y": 0,
"z": -2
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"roughness": 0.2,
"metalness": 0
},
"Composite": {
"rotation": {
"y": 45,
"x": 0,
"z": 0
},
"floatIntensity": 2.7215189873417724,
"rotationIntensity": 0,
"rotationSpeed": 0.17088607594936536,
"floatSpeed": 1.9936708860759493,
"glow": {
"position": {
"x": -0.04425743507387843,
"y": -1.022192353560099,
"z": -5.0821500162005
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1.5,
"y": 1.5,
"z": 2
}
},
"opacity": 0.43670886075949356,
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"position": {
"y": 1
}
},
"Floor": {
"color": {
"r": 0.0196078431372549,
"g": 0.0196078431372549,
"b": 0.0196078431372549,
"a": 1
},
"emissive": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
}
},
"Directional Light 1": {
"intensity": 1,
"position": {
"x": -13.044685116424557,
"y": 10.40484255540645,
"z": 3.7056597804992015
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
}
},
"Directional Light 2": {
"position": {
"x": 7.2444619237008485,
"y": 0.39470578644456733,
"z": -4.513386540591839
},
"rotation": {
"x": 0,
"y": 0,
"z": 0
},
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"color": {
"r": 1,
"g": 1,
"b": 1,
"a": 1
},
"intensity": 0.14833563620218715
},
"Box Middle": {
"scale": {
"x": 1,
"y": 1,
"z": 1
},
"color": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
},
"roughness": 0.2,
"metalness": 0,
"envMapIntensity": 10,
"emissive": {
"r": 0,
"g": 0,
"b": 0,
"a": 1
}
},
"Ambient Light": {
"intensity": 0.16075949367088568,
"color": {
"r": 0.13333333333333333,
"g": 0.03529411764705882,
"b": 0.7254901960784313,
"a": 1
}
},
"Fill Light": {
"intensity": 0.3037974683544304
},
"Glow": {
"position": {
"x": -0.011481084105283028,
"y": -0.9726258441492436,
"z": -4.451709051273078
},
"rotation": {
"x": -22.259350847770644,
"y": 0,
"z": 0
},
"scale": {
"x": 1.3,
"y": 1,
"z": 0.9
},
"opacity": 1,
"color": {
"r": 0.47058823529411764,
"g": 0.2549019607843137,
"b": 1,
"a": 1
},
"opacita": 0.9873417721518987,
"colora": {
"r": 0.25098039215686274,
"g": 0.25882352941176473,
"b": 1,
"a": 1
},
"opacity2": 0,
"color2": {
"r": 0.058823529411764705,
"g": 0.12549019607843137,
"b": 1,
"a": 1
}
}
}
},
"sequence": {
"subUnitsPerUnit": 30,
"length": 20,
"type": "PositionalSequence",
"tracksByObject": {
"Box Bottom X+": {
"trackData": {
"3QmrZS3F5R": {
"type": "BasicKeyframedTrack",
"__debugName": "Box Bottom X+:[\"rotation\",\"x\"]",
"keyframes": [
{
"id": "RToO0iCgGa",
"position": 1.1,
"connectedRight": true,
"handles": [
0.5,
1,
0.215,
0.61
],
"type": "bezier",
"value": 0
},
{
"id": "JAmETQ_iKc",
"position": 8.367,
"connectedRight": true,
"handles": [
0.355,
1,
0.5,
0
],
"type": "bezier",
"value": 0
},
{
"id": "CCgqIu6GTU",
"position": 15.933,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
}
]
},
"X-7zT-bvcz": {
"type": "BasicKeyframedTrack",
"__debugName": "Box Bottom X+:[\"rotation\",\"y\"]",
"keyframes": [
{
"id": "iVGo1q0JO6",
"position": 1.1,
"connectedRight": true,
"handles": [
0.5,
1,
0.215,
0.61
],
"type": "bezier",
"value": 0
},
{
"id": "SWEHErxhXf",
"position": 8.367,
"connectedRight": true,
"handles": [
0.355,
1,
0.5,
0
],
"type": "bezier",
"value": 0
},
{
"id": "sxdaa00wUC",
"position": 15.933,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
}
]
},
"je7FvGImfz": {
"type": "BasicKeyframedTrack",
"__debugName": "Box Bottom X+:[\"rotation\",\"z\"]",
"keyframes": [
{
"id": "k5aH1GGv2K",
"position": 1.1,
"connectedRight": true,
"handles": [
0.5,
1,
0.215,
0.61
],
"type": "bezier",
"value": 0
},
{
"id": "ne9a3CaPQW",
"position": 8.367,
"connectedRight": true,
"handles": [
0.355,
1,
0.5,
0
],
"type": "bezier",
"value": 0
},
{
"id": "_ZqRRZeS02",
"position": 15.933,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
}
]
},
"ei66TPwVPP": {
"type": "BasicKeyframedTrack",
"__debugName": "Box Bottom X+:[\"position\",\"x\"]",
"keyframes": [
{
"id": "x64IuW0AKd",
"position": 1.1,
"connectedRight": true,
"handles": [
0.5,
1,
0.215,
0.61
],
"type": "bezier",
"value": 1.9999999999999996
},
{
"id": "zEK9E4czZx",
"position": 8.367,
"connectedRight": true,
"handles": [
0.355,
1,
0.5,
0
],
"type": "bezier",
"value": 2
},
{
"id": "9AbBvceQRT",
"position": 11.933,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 2
},
{
"id": "xCGuyAl8u1",
"position": 15.933,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 2
}
]
},
"GXsECfczOp": {
"type": "BasicKeyframedTrack",
"__debugName": "Box Bottom X+:[\"position\",\"y\"]",
"keyframes": [
{
"id": "XjJTMCMDBL",
"position": 1.1,
"connectedRight": true,
"handles": [
0.5,
1,
0.215,
0.61
],
"type": "bezier",
"value": 21.934279254408594
},
{
"id": "f3YkiBwdS-",
"position": 8.367,
"connectedRight": true,
"handles": [
0.355,
1,
0.5,
0
],
"type": "bezier",
"value": 0
},
{
"id": "acY9Uj6McO",
"position": 11.933,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
},
{
"id": "Fwnuh6rlg-",
"position": 15.933,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1.2489949921246877
}
]
},
"RlQQB6ps9F": {
"type": "BasicKeyframedTrack",
"__debugName": "Box Bottom X+:[\"position\",\"z\"]",
"keyframes": [
{
"id": "XSczU_K6xJ",
"position": 1.1,
"connectedRight": true,
"handles": [
0.5,
1,
0.215,
0.61
],
"type": "bezier",
"value": 2.465190328815662e-32
},
{
"id": "wICMVOwGpn",
"position": 8.367,
"connectedRight": true,
"handles": [
0.355,
1,
0.5,
0
],
"type": "bezier",
"value": 0
},
{
"id": "GcFNkuovhy",
"position": 11.933,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
},
{
"id": "mzRBW-sl-r",
"position": 15.933,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 0
}
]
},
"AR5HXQM5BM": {
"type": "BasicKeyframedTrack",
"__debugName": "Box Bottom X+:[\"envMapIntensity\"]",
"keyframes": [
{
"id": "OZUrLYGubS",
"position": 0.9,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 1
},
{
"id": "5iDvm0lCfh",
"position": 3,
"connectedRight": true,
"handles": [
0.5,
1,
0.5,
0
],
"type": "bezier",
"value": 10
}
]
}
},
"trackIdByPropPath": {
"[\"rotation\",\"x\"]": "3QmrZS3F5R",
"[\"rotation\",\"y\"]": "X-7zT-bvcz",
"[\"rotation\",\"z\"]": "je7FvGImfz",
"[\"position\",\"x\"]": "ei66TPwVPP",
"[\"position\",\"y\"]": "GXsECfczOp",
"[\"position\",\"z\"]": "RlQQB6ps9F",
"[\"envMapIntensity\"]": "AR5HXQM5BM"
}
},
"Box Top": {
"trackData": {
"QPSmWsrhUd": {
"type": "BasicKeyframedTrack",
"__debugName": "Box Top:[\"position\",\"x\"]",
"keyframes": [
{
"id": "UwDQCND935",
"position": 3.433,
"connectedRight": true,
<