react-spring-three

This demo is real, click it!

npm install react-spring-three

React-spring for react-three-fiber

``jsx
import { animated, useSpring } from 'react-spring-three'
import { Canvas } from 'react-three-fiber'

function Thing() {
const [active, setActive] = useState(false)
const [hovered, setHover] = useState(false)
const prop = useSpring({
'material-opacity': hovered ? 0.6 : 0.25,
scale: active ? [1.5, 1.5, 1.5] : [1, 1, 1],
rotation: active ? [THREE.Math.degToRad(180), 0, THREE.Math.degToRad(45)] : [0, 0, 0],
})

return (

onClick={e => setActive(!active)}
onHover={e => setHover(true)}
onUnhover={e => setHover(false)}
{...props}>




)
}

ReactDOM.render(


,
document.getElementById('root')
)
``