Fix a bunch of react18 type errors

packages/playground/src/shared/image/index.tsx

@@ -5,7 +5,7 @@
 import {getProject, types} from '@theatre/core'
 import studio from '@theatre/studio'
 import React, {useEffect, useState} from 'react'
-import {render} from 'react-dom/client'
+import ReactDom from 'react-dom/client'
 import styled from 'styled-components'
 
 const project = getProject('Image type playground', {
@@ -66,7 +66,9 @@ const ImageTypeExample: React.FC<{}> = (props) => {
 
 project.ready
   .then(() => {
-    render(<ImageTypeExample />, document.getElementById('root'))
+    ReactDom.createRoot(document.getElementById('root')!).render(
+      <ImageTypeExample />,
+    )
   })
   .catch((err) => {
     console.error(err)

packages/playground/src/shared/theatric/index.tsx

@@ -1,5 +1,5 @@
 import {button, initialize, types, useControls} from 'theatric'
-import {render} from 'react-dom/client'
+import ReactDom from 'react-dom/client'
 import React, {useState} from 'react'
 import state from './state.json'
 
@@ -79,4 +79,4 @@ function App() {
   )
 }
 
-render(<App />, document.getElementById('root'))
+ReactDom.createRoot(document.getElementById('root')!).render(<App />)

packages/playground/src/shared/turtle/index.tsx

@@ -3,7 +3,7 @@
  * can be tweaked and animated.
  */
 import React, {useMemo, useState} from 'react'
-import {render} from 'react-dom/client'
+import ReactDom from 'react-dom/client'
 import {getProject} from '@theatre/core'
 import type {ITurtle} from './turtle'
 import TurtleRenderer from './TurtleRenderer'
@@ -52,4 +52,4 @@ const TurtleExample: React.FC<{}> = (props) => {
   )
 }
 
-render(<TurtleExample />, document.getElementById('root'))
+ReactDom.createRoot(document.getElementById('root')!).render(<TurtleExample />)

packages/r3f/src/extension/components/OrbitControls/index.tsx

@@ -65,7 +65,7 @@ export const OrbitControls = forwardRef<OrbitControlsImpl, OrbitControlsProps>(
         if (onChange) onChange(e)
       }
 
-      controls.connect(explDomElement)
+      controls.connect(explDomElement!)
       controls.addEventListener('change', callback)
 
       if (onStart) controls.addEventListener('start', onStart)