refactor: upgrade Zustand to v4 (#75)

package.json

@@ -58,12 +58,12 @@
     "@types/ogl": "npm:ogl-types@^0.0.99",
     "@types/react-reconciler": "^0.26.7",
     "@types/webxr": "^0.5.0",
-    "its-fine": "^1.0.0",
+    "its-fine": "^1.0.5",
     "react-reconciler": "^0.27.0",
     "react-use-measure": "^2.1.1",
     "scheduler": "^0.23.0",
     "suspend-react": "^0.0.8",
-    "zustand": "^3.7.1"
+    "zustand": "^4.1.2"
   },
   "peerDependencies": {
     "expo-gl": ">=11.4",

src/hooks.ts

@@ -1,7 +1,6 @@
 import * as React from 'react'
 import * as OGL from 'ogl'
 import { suspend } from 'suspend-react'
-import type { StateSelector, EqualityChecker } from 'zustand'
 import type { Instance, RootState, RootStore, Subscription } from './types'
 import { classExtends } from './utils'
 
@@ -51,8 +50,8 @@ export function useStore() {
  * Returns the internal OGL state.
  */
 export function useOGL<T = RootState>(
-  selector: StateSelector<RootState, T> = (state) => state as unknown as T,
-  equalityFn?: EqualityChecker<T>,
+  selector: (state: RootState) => T = (state) => state as unknown as T,
+  equalityFn?: <T>(state: T, newState: T) => boolean,
 ) {
   return useStore()(selector, equalityFn)
 }

src/renderer.tsx

@@ -1,7 +1,7 @@
 import * as OGL from 'ogl'
 import * as React from 'react'
 import { ConcurrentRoot } from 'react-reconciler/constants.js'
-import create, { GetState, SetState } from 'zustand'
+import create from 'zustand'
 import { reconciler } from './reconciler'
 import { OGLContext, useStore, useIsomorphicLayoutEffect } from './hooks'
 import { RenderProps, Root, RootState, RootStore, Subscription } from './types'
@@ -29,7 +29,7 @@ export function render(
   let root = roots.get(target)
   if (!root) {
     // Create root store
-    const store = create((set: SetState<RootState>, get: GetState<RootState>) => {
+    const store = create<RootState>((set, get) => {
       // Create renderer
       const renderer =
         config.renderer instanceof OGL.Renderer
@@ -228,7 +228,7 @@ function PortalRoot({ children, target, state }: PortalRootProps): JSX.Element {
   const store = useStore()
   const container = React.useMemo(
     () =>
-      create((set: SetState<RootState>, get: GetState<RootState>) => ({
+      create<RootState>((set, get) => ({
         ...store.getState(),
         set,
         get,

src/types.ts

@@ -1,7 +1,7 @@
 /// <reference types="webxr" />
 import type * as OGL from 'ogl'
 import type * as React from 'react'
-import type { SetState, GetState, UseBoundStore, StoreApi } from 'zustand'
+import type { UseBoundStore, StoreApi } from 'zustand'
 
 type Mutable<P> = { [K in keyof P]: P[K] | Readonly<P[K]> }
 type NonFunctionKeys<P> = { [K in keyof P]-?: P[K] extends Function ? never : K }[keyof P]
@@ -57,8 +57,8 @@ export type Frameloop = 'always' | 'never'
 export type Subscription = (state: RootState, time: number, frame?: XRFrame) => any
 
 export interface RootState {
-  set: SetState<RootState>
-  get: GetState<RootState>
+  set: StoreApi<RootState>['setState']
+  get: StoreApi<RootState>['getState']
   size: Size
   xr: XRManager
   orthographic: boolean
@@ -80,7 +80,7 @@ export interface RootState {
 
 export type Act = <T = any>(cb: () => Promise<T>) => Promise<T>
 
-export type RootStore = UseBoundStore<RootState, StoreApi<RootState>>
+export type RootStore = UseBoundStore<StoreApi<RootState>>
 
 export interface Root {
   render: (element: React.ReactNode) => RootStore

yarn.lock

@@ -4190,10 +4190,10 @@ istanbul-reports@^3.1.3:
     html-escaper "^2.0.0"
     istanbul-lib-report "^3.0.0"
 
-its-fine@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/its-fine/-/its-fine-1.0.0.tgz#e1c17f4420a433c9e96d264330e96a82c6edc33b"
-  integrity sha512-EEVcyr+sR21lxLZg3U84HpY3Mb9aKmGYqxPsIbf/Ea4fO4qpvE/7lX5qtrkuCnljJ9RLMaSaeMq35PeLa+oM0w==
+its-fine@^1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/its-fine/-/its-fine-1.0.5.tgz#dbd8130e021aafe030ca5001085c27ff2a057ab3"
+  integrity sha512-JVqIHuUGRF4mBJWV/o9CS86wU57oWAX+mE2iokFpZ+B1R1tcfRvLZXVFd9tWJgY7gfhBURYyXJs7LcoJl/Af+Q==
   dependencies:
     "@types/react-reconciler" "^0.28.0"
 
@@ -7038,7 +7038,7 @@ url-parse@^1.5.3:
     querystringify "^2.1.1"
     requires-port "^1.0.0"
 
-use-sync-external-store@^1.0.0:
+use-sync-external-store@1.2.0, use-sync-external-store@^1.0.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a"
   integrity sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==
@@ -7348,7 +7348,9 @@ yocto-queue@^0.1.0:
   resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"
   integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==
 
-zustand@^3.7.1:
-  version "3.7.2"
-  resolved "https://registry.yarnpkg.com/zustand/-/zustand-3.7.2.tgz#7b44c4f4a5bfd7a8296a3957b13e1c346f42514d"
-  integrity sha512-PIJDIZKtokhof+9+60cpockVOq05sJzHCriyvaLBmEJixseQ1a5Kdov6fWZfWOu5SK9c+FhH1jU0tntLxRJYMA==
+zustand@^4.1.2:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/zustand/-/zustand-4.1.2.tgz#4912b24741662d8a84ed1cb52198471cb369c4b6"
+  integrity sha512-gcRaKchcxFPbImrBb/BKgujOhHhik9YhVpIeP87ETT7uokEe2Szu7KkuZ9ghjtD+/KKkcrRNktR2AiLXPIbKIQ==
+  dependencies:
+    use-sync-external-store "1.2.0"