@@ -2,11 +2,12 @@ import type { PlaneProps, Triplet } from '@react-three/cannon'
2
2
import { Physics , useBox , usePlane , useSphere } from '@react-three/cannon'
3
3
import type { MeshPhongMaterialProps } from '@react-three/fiber'
4
4
import { Canvas , useFrame } from '@react-three/fiber'
5
- import niceColors from 'nice-color-palettes'
6
5
import { useMemo , useRef } from 'react'
7
6
import type { InstancedMesh , Mesh } from 'three'
8
7
import { Color } from 'three'
9
8
9
+ import niceColors from '../colors'
10
+
10
11
type OurPlaneProps = Pick < MeshPhongMaterialProps , 'color' > & Pick < PlaneProps , 'position' | 'rotation' >
11
12
12
13
function Plane ( { color, ...props } : OurPlaneProps ) {
@@ -49,7 +50,7 @@ function InstancedSpheres({ number = 100 }) {
49
50
const color = new Color ( )
50
51
for ( let i = 0 ; i < number ; i ++ )
51
52
color
52
- . set ( niceColors [ 17 ] [ Math . floor ( Math . random ( ) * 5 ) ] )
53
+ . set ( niceColors [ Math . floor ( Math . random ( ) * 5 ) ] )
53
54
. convertSRGBToLinear ( )
54
55
. toArray ( array , i * 3 )
55
56
return array
@@ -79,11 +80,11 @@ export default () => (
79
80
/>
80
81
< pointLight position = { [ - 30 , 0 , - 30 ] } intensity = { 0.5 } />
81
82
< Physics gravity = { [ 0 , 0 , - 30 ] } >
82
- < Plane color = { niceColors [ 17 ] [ 4 ] } position = { [ 0 , 0 , 0 ] } rotation = { [ 0 , 0 , 0 ] } />
83
- < Plane color = { niceColors [ 17 ] [ 1 ] } position = { [ - 6 , 0 , 0 ] } rotation = { [ 0 , 0.9 , 0 ] } />
84
- < Plane color = { niceColors [ 17 ] [ 2 ] } position = { [ 6 , 0 , 0 ] } rotation = { [ 0 , - 0.9 , 0 ] } />
85
- < Plane color = { niceColors [ 17 ] [ 3 ] } position = { [ 0 , 6 , 0 ] } rotation = { [ 0.9 , 0 , 0 ] } />
86
- < Plane color = { niceColors [ 17 ] [ 0 ] } position = { [ 0 , - 6 , 0 ] } rotation = { [ - 0.9 , 0 , 0 ] } />
83
+ < Plane color = { niceColors [ 4 ] } position = { [ 0 , 0 , 0 ] } rotation = { [ 0 , 0 , 0 ] } />
84
+ < Plane color = { niceColors [ 1 ] } position = { [ - 6 , 0 , 0 ] } rotation = { [ 0 , 0.9 , 0 ] } />
85
+ < Plane color = { niceColors [ 2 ] } position = { [ 6 , 0 , 0 ] } rotation = { [ 0 , - 0.9 , 0 ] } />
86
+ < Plane color = { niceColors [ 3 ] } position = { [ 0 , 6 , 0 ] } rotation = { [ 0.9 , 0 , 0 ] } />
87
+ < Plane color = { niceColors [ 0 ] } position = { [ 0 , - 6 , 0 ] } rotation = { [ - 0.9 , 0 , 0 ] } />
87
88
< Box />
88
89
< InstancedSpheres number = { 100 } />
89
90
</ Physics >
0 commit comments