fix: use sync store (#48)

packages/react-native/src/useBridge.ts

@@ -1,5 +1,5 @@
 import type { Bridge, BridgeStore, ExtractStore } from "@webview-bridge/types";
-import { useSyncExternalStore } from "use-sync-external-store/shim/index.js";
+import { useSyncExternalStoreWithSelector } from "use-sync-external-store/with-selector.js";
 
 export function useBridge<T extends Bridge>(
   store: BridgeStore<T>,
@@ -11,12 +11,16 @@ export function useBridge<
   V,
 >(store: BridgeStore<T>, selector?: (state: U) => V): V;
 
-export function useBridge<
-  T extends Bridge,
-  U extends ExtractStore<BridgeStore<T>>,
-  V,
->(store: BridgeStore<T>, selector?: (state: U) => V): V {
-  const getSnapshot = () =>
-    selector?.(store.getState() as U) ?? store.getState();
-  return useSyncExternalStore(store.subscribe, getSnapshot) as V;
+export function useBridge<T extends Bridge, U>(
+  store: BridgeStore<T>,
+  selector?: (state: T) => U,
+): U {
+  const $selector = selector ?? ((state: T) => state as unknown as U);
+
+  return useSyncExternalStoreWithSelector(
+    store.subscribe,
+    store.getState,
+    store.getState,
+    $selector,
+  );
 }

packages/react/src/useBridge.ts

@@ -1,14 +1,26 @@
-import type { Bridge, BridgeStore } from "@webview-bridge/web";
+import type { Bridge, BridgeStore, ExtractStore } from "@webview-bridge/web";
 import { useSyncExternalStoreWithSelector } from "use-sync-external-store/with-selector.js";
 
-export const useBridge = <T extends Bridge, U>(
+export function useBridge<T extends Bridge>(
+  store: Omit<BridgeStore<T>, "setState">,
+): ExtractStore<BridgeStore<T>>;
+
+export function useBridge<
+  T extends Bridge,
+  U extends ExtractStore<BridgeStore<T>>,
+  V,
+>(store: Omit<BridgeStore<T>, "setState">, selector?: (state: U) => V): V;
+
+export function useBridge<T extends Bridge, U>(
   store: Omit<BridgeStore<T>, "setState">,
   selector?: (state: T) => U,
-): U => {
+): U {
+  const $selector = selector ?? ((state: T) => state as unknown as U);
+
   return useSyncExternalStoreWithSelector(
     store.subscribe,
     store.getState,
     store.getState,
-    selector ?? ((state: T) => state as unknown as U),
+    $selector,
   );
-};
+}