fix: interop Zustand for CJS (#1550)

src/core/useProgress.tsx

@@ -1,5 +1,9 @@
 import { DefaultLoadingManager } from 'three'
-import create from 'zustand'
+import zustand from 'zustand'
+
+// TODO: upgrade to v4
+// https://github.com/pmndrs/drei/pull/1550
+const create = (zustand as any).default as typeof zustand
 
 type Data = {
   errors: string[]

src/web/KeyboardControls.tsx

@@ -1,7 +1,11 @@
 import * as React from 'react'
-import create, { StoreApi, UseBoundStore } from 'zustand'
+import zustand, { StoreApi, UseBoundStore } from 'zustand'
 import { subscribeWithSelector } from 'zustand/middleware'
 
+// TODO: upgrade to v4
+// https://github.com/pmndrs/drei/pull/1550
+const create = (zustand as any).default as typeof zustand
+
 // These are removed in Zustand v4
 type State = object // unknown
 type StateSelector<T extends State, U> = (state: T) => U

src/web/Select.tsx

@@ -2,7 +2,11 @@ import * as React from 'react'
 import * as THREE from 'three'
 import { SelectionBox } from 'three-stdlib'
 import { useThree } from '@react-three/fiber'
-import shallow from 'zustand/shallow'
+import zustand from 'zustand/shallow'
+
+// TODO: upgrade to v4
+// https://github.com/pmndrs/drei/pull/1550
+const shallow = (zustand as any).default as typeof zustand
 
 const context = React.createContext<THREE.Object3D[]>([])