Highest version of React Three Fiber and Drei for React v17.0.2?

Questions
,
1

A project I am working on is limited to react v17.0.2. As a result, Fiber is at version 7.0.6, and drei is at 7.5.1.

I want to use CameraControls for the project, but that is not in version 7.5.1 drei. What version of drei is this camera controls available, and is it compatible with React 17.0.2? Could my Fiber version also be upgraded to a higher version?

The functionality I want to add is the ability to click a button and smoothly move the orbital camera in and out from the world origin. Is this possible without Camera controls?

2

just copy the files you’re missing into your project. the <CamerControls> is a small convenience component drei/CameraControls.tsx at 06cf1bf85848aa6112a663f5d5abd87b2673a97b · pmndrs/drei · GitHub but you can always use the cc library directly, embed it directly into a component just like drei does.

import * as THREE from 'three'
import { useRef, useEffect } from 'react'
import { extend, useFrame, useThree } from '@react-three/fiber'
import CameraControls from 'camera-controls'

CameraControls.install({ THREE })
extend({ CameraControls })

export function CameraControls(props) {
  const ref = useRef()
  const camera = useThree((state) => state.camera)
  const events = useThree((state) => state.events)
  useFrame((state, delta) => ref.current.update(delta), -1)
  useEffect(() => {
    ref.current.connect(events.connected)
    return () => void ref.current.disconnect()
  }, [ events.connected])
  return <cameraControls args={[camera]} ref={ref} {...props} />
}