feat(Sky): add exposure to demo

playground/src/pages/staging/SkyDemo.vue

@@ -2,23 +2,25 @@
 import { shallowRef } from 'vue'
 import { TresCanvas } from '@tresjs/core'
 import { OrbitControls, Sky } from '@tresjs/cientos'
-import { SRGBColorSpace, NoToneMapping } from 'three'
+import { SRGBColorSpace, ACESFilmicToneMapping } from 'three'
 import { TresLeches, useControls } from '@tresjs/leches'
 import '@tresjs/leches/styles'
 
 const gl = {
   clearColor: '#333',
   outputColorSpace: SRGBColorSpace,
-  toneMapping: NoToneMapping,
+  toneMapping: ACESFilmicToneMapping,
+  toneMappingExposure: 1,
 }
 
-const [turbidity, rayleigh, mieCoefficient, mieDirectionalG, elevation, azimuth] = useControls({
+const [turbidity, rayleigh, mieCoefficient, mieDirectionalG, elevation, azimuth, exposure] = useControls({
   turbidity: { value: 3.4, min: 0, max: 20, step: 0.1 },
   rayleigh: { value: 3, min: 0, max: 4, step: 0.1 },
   mieCoefficient: { value: 0.005, min: 0, max: 0.1, step: 0.001 },
   mieDirectionalG: { value: 0.7, min: 0, max: 1, step: 0.1 },
   elevation: { value: 2, min: 0, max: 90, step: 0.1 },
   azimuth: { value: 180, min: 0, max: 360, step: 1 },
+  exposure: { value: 0.5, min: 0, max: 1, step: 0.01 },
 })
 
 const skyRef = shallowRef(null)
@@ -28,6 +30,7 @@ const skyRef = shallowRef(null)
   <TresLeches class="important-fixed important-left-2 important-w-90" />
   <TresCanvas
     v-bind="gl"
+    :tone-mapping-exposure="exposure.value.value"
   >
     <TresPerspectiveCamera :position="[0, 100, 2000]" />
     <Sky