@pluv/react 0.17.3 → 0.19.0

package/src/createRoomBundle.tsx

@@ -9,38 +9,13 @@ import type {
     WebSocketConnection,
 } from "@pluv/client";
 import { MockedRoom } from "@pluv/client";
-import type {
-    AbstractCrdtDoc,
-    AbstractCrdtDocFactory,
-    AbstractCrdtType,
-    InferCrdtStorageJson,
-} from "@pluv/crdt";
+import type { AbstractCrdtDoc, AbstractCrdtDocFactory, AbstractCrdtType, InferCrdtStorageJson } from "@pluv/crdt";
 import { noop } from "@pluv/crdt";
-import type {
-    IOEventMessage,
-    IOLike,
-    Id,
-    InferIOInput,
-    InferIOOutput,
-    InputZodLike,
-    JsonObject,
-} from "@pluv/types";
+import type { IOEventMessage, IOLike, Id, InferIOInput, InferIOOutput, InputZodLike, JsonObject } from "@pluv/types";
 import fastDeepEqual from "fast-deep-equal";
 import type { Dispatch, FC, ReactNode } from "react";
-import {
-    createContext,
-    memo,
-    useCallback,
-    useContext,
-    useEffect,
-    useState,
-} from "react";
-import {
-    identity,
-    shallowArrayEqual,
-    useRerender,
-    useSyncExternalStoreWithSelector,
-} from "./internal";
+import { createContext, memo, useCallback, useContext, useEffect, useMemo, useState } from "react";
+import { identity, shallowArrayEqual, useRerender, useSyncExternalStoreWithSelector } from "./internal";
 
 export type CreateRoomBundleOptions<
     TIO extends IOLike,
@@ -59,9 +34,7 @@ type BaseRoomProviderProps<
     children?: ReactNode;
     initialStorage?: keyof TStorage extends never ? never : () => TStorage;
     room: string;
-} & (keyof TPresence extends never
-    ? { initialPresence?: never }
-    : { initialPresence: TPresence });
+} & (keyof TPresence extends never ? { initialPresence?: never } : { initialPresence: TPresence });
 
 export type MockedRoomProviderProps<
     TIO extends IOLike,
@@ -88,6 +61,19 @@ export type UpdateMyPresenceAction<TPresence extends JsonObject> =
     | Partial<TPresence>
     | ((oldPresence: TPresence | null) => Partial<TPresence>);
 
+export type BroadcastProxy<TIO extends IOLike> = (<TEvent extends keyof InferIOInput<TIO>>(
+    event: TEvent,
+    data: Id<InferIOInput<TIO>[TEvent]>,
+) => void) & {
+    [event in keyof InferIOInput<TIO>]: (input: Id<InferIOInput<TIO>[event]>) => void;
+};
+
+export type EventProxy<TIO extends IOLike> = {
+    [event in keyof InferIOOutput<TIO>]: {
+        useEvent: (callback: (data: Id<IOEventMessage<TIO, event>>) => void) => void;
+    };
+};
+
 export interface CreateRoomBundle<
     TIO extends IOLike,
     TPresence extends JsonObject,
@@ -97,11 +83,11 @@ export interface CreateRoomBundle<
     MockedRoomProvider: FC<MockedRoomProviderProps<TIO, TPresence, TStorage>>;
     PluvRoomProvider: FC<PluvRoomProviderProps<TIO, TPresence, TStorage>>;
 
+    // proxies
+    event: EventProxy<TIO>;
+
     // hooks
-    useBroadcast: () => <TEvent extends keyof InferIOInput<TIO>>(
-        event: TEvent,
-        data: Id<InferIOInput<TIO>[TEvent]>,
-    ) => void;
+    useBroadcast: () => BroadcastProxy<TIO>;
     useCanRedo: () => boolean;
     useCanUndo: () => boolean;
     useConnection: <T extends unknown = WebSocketConnection>(
@@ -116,10 +102,7 @@ export interface CreateRoomBundle<
     useMyPresence: <T extends unknown = TPresence>(
         selector?: (myPresence: TPresence) => T,
         options?: SubscriptionHookOptions<Id<T> | null>,
-    ) => [
-        myPresence: Id<T>,
-        updateMyPresence: Dispatch<UpdateMyPresenceAction<TPresence>>,
-    ];
+    ) => [myPresence: Id<T>, updateMyPresence: Dispatch<UpdateMyPresenceAction<TPresence>>];
     useMyself: <T extends unknown = UserInfo<TIO, TPresence>>(
         selector?: (myself: Id<UserInfo<TIO, TPresence>>) => T,
         options?: SubscriptionHookOptions<Id<T> | null>,
@@ -127,35 +110,25 @@ export interface CreateRoomBundle<
     useOther: <T extends unknown = UserInfo<TIO, TPresence>>(
         connectionId: string,
         selector?: (other: UserInfo<TIO, TPresence>) => T,
-        options?: SubscriptionHookOptions<Id<T> | null>,
-    ) => Id<T> | null;
-    useOthers: <T extends unknown = UserInfo<TIO, TPresence>>(
-        selector?: (other: readonly Id<UserInfo<TIO, TPresence>>[]) => T[],
-        options?: SubscriptionHookOptions<readonly Id<T>[]>,
-    ) => readonly Id<T>[];
+        options?: SubscriptionHookOptions<T | null>,
+    ) => T | null;
+    useOthers: <T extends unknown = readonly UserInfo<TIO, TPresence>[]>(
+        selector?: (other: readonly Id<UserInfo<TIO, TPresence>>[]) => T,
+        options?: SubscriptionHookOptions<T>,
+    ) => T;
     useRedo: () => () => void;
     useRoom: () => AbstractRoom<TIO, TPresence, TStorage>;
-    useStorage: <
-        TKey extends keyof TStorage,
-        TData extends unknown = InferCrdtStorageJson<TStorage[TKey]>,
-    >(
+    useStorage: <TKey extends keyof TStorage, TData extends unknown = InferCrdtStorageJson<TStorage[TKey]>>(
         key: TKey,
         selector?: (data: InferCrdtStorageJson<TStorage[TKey]>) => TData,
         options?: SubscriptionHookOptions<TData | null>,
     ) => [data: TData | null, sharedType: TStorage[TKey] | null];
-    useTransact: () => (
-        fn: (storage: TStorage) => void,
-        origin?: string,
-    ) => void;
+    useTransact: () => (fn: (storage: TStorage) => void, origin?: string) => void;
     useUndo: () => () => void;
 }
 
-export type InferRoomStorage<
-    TRoomBundle extends CreateRoomBundle<any, any, any>,
-> =
-    TRoomBundle extends CreateRoomBundle<any, any, infer IStorage>
-        ? IStorage
-        : never;
+export type InferRoomStorage<TRoomBundle extends CreateRoomBundle<any, any, any>> =
+    TRoomBundle extends CreateRoomBundle<any, any, infer IStorage> ? IStorage : never;
 
 export const createRoomBundle = <
     TIO extends IOLike,
@@ -165,8 +138,7 @@ export const createRoomBundle = <
     client: PluvClient<TIO>,
     options: CreateRoomBundleOptions<TIO, TPresence, TStorage>,
 ): CreateRoomBundle<TIO, TPresence, TStorage> => {
-    const _initialStorage = (options.initialStorage ??
-        noop.doc()) as AbstractCrdtDocFactory<TStorage>;
+    const _initialStorage = (options.initialStorage ?? noop.doc()) as AbstractCrdtDocFactory<TStorage>;
 
     /**
      * !HACK
@@ -175,59 +147,36 @@ export const createRoomBundle = <
      * @author leedavidcs
      * @date November 11, 2022
      */
-    const PluvRoomContext = createContext<
-        AbstractRoom<TIO, TPresence, TStorage>
-    >(null as any);
+    const PluvRoomContext = createContext<AbstractRoom<TIO, TPresence, TStorage>>(null as any);
 
     const MockedRoomContext = createContext<{
         room: AbstractRoom<TIO, TPresence, TStorage> | null;
     }>({ room: null });
 
-    const MockedRoomProvider = memo<
-        MockedRoomProviderProps<TIO, TPresence, TStorage>
-    >((props) => {
-        const {
-            children,
-            events,
-            initialPresence,
-            initialStorage,
-            room: _room,
-        } = props;
+    const MockedRoomProvider = memo<MockedRoomProviderProps<TIO, TPresence, TStorage>>((props) => {
+        const { children, events, initialPresence, initialStorage, room: _room } = props;
 
         const [room] = useState<MockedRoom<TIO, TPresence, TStorage>>(() => {
             return new MockedRoom<TIO, TPresence, TStorage>(_room, {
                 events,
                 initialPresence,
                 initialStorage:
-                    typeof initialStorage === "function"
-                        ? _initialStorage.getFactory(initialStorage)
-                        : _initialStorage,
+                    typeof initialStorage === "function" ? _initialStorage.getFactory(initialStorage) : _initialStorage,
                 presence: options.presence,
             });
         });
 
         return (
             <MockedRoomContext.Provider value={{ room }}>
-                <PluvRoomContext.Provider value={room}>
-                    {children}
-                </PluvRoomContext.Provider>
+                <PluvRoomContext.Provider value={room}>{children}</PluvRoomContext.Provider>
             </MockedRoomContext.Provider>
         );
     });
 
     MockedRoomProvider.displayName = "MockedRoomProvider";
 
-    const PluvRoomProvider = memo<
-        PluvRoomProviderProps<TIO, TPresence, TStorage>
-    >((props) => {
-        const {
-            children,
-            debug,
-            initialPresence,
-            initialStorage,
-            onAuthorizationFail,
-            room: _room,
-        } = props;
+    const PluvRoomProvider = memo<PluvRoomProviderProps<TIO, TPresence, TStorage>>((props) => {
+        const { children, debug, initialPresence, initialStorage, onAuthorizationFail, room: _room } = props;
 
         const rerender = useRerender();
         const { room: mockedRoom } = useContext(MockedRoomContext);
@@ -238,9 +187,7 @@ export const createRoomBundle = <
                 debug,
                 initialPresence,
                 initialStorage:
-                    typeof initialStorage === "function"
-                        ? _initialStorage.getFactory(initialStorage)
-                        : _initialStorage,
+                    typeof initialStorage === "function" ? _initialStorage.getFactory(initialStorage) : _initialStorage,
                 presence: options.presence,
                 onAuthorizationFail,
             });
@@ -264,50 +211,42 @@ export const createRoomBundle = <
             };
         }, [room]);
 
-        return (
-            <PluvRoomContext.Provider value={mockedRoom ?? room}>
-                {children}
-            </PluvRoomContext.Provider>
-        );
+        return <PluvRoomContext.Provider value={mockedRoom ?? room}>{children}</PluvRoomContext.Provider>;
     });
 
     PluvRoomProvider.displayName = "PluvRoomProvider";
 
     const useRoom = () => useContext(PluvRoomContext);
 
-    const useBroadcast = (): (<TEvent extends keyof InferIOInput<TIO>>(
-        event: TEvent,
-        data: Id<InferIOInput<TIO>[TEvent]>,
-    ) => void) => {
+    const useBroadcast = (): BroadcastProxy<TIO> => {
         const room = useRoom();
 
-        return useCallback(
-            <TEvent extends keyof InferIOInput<TIO>>(
-                event: TEvent,
-                data: Id<InferIOInput<TIO>[TEvent]>,
-            ) => {
+        const broadcast = useCallback(
+            <TEvent extends keyof InferIOInput<TIO>>(event: TEvent, data: Id<InferIOInput<TIO>[TEvent]>) => {
                 room.broadcast(event, data);
             },
             [room],
         );
+
+        return useMemo((): BroadcastProxy<TIO> => {
+            return new Proxy(broadcast, {
+                get(fn, prop) {
+                    return (data: Id<InferIOInput<TIO>[keyof InferIOInput<TIO>]>): void => {
+                        return fn(prop as keyof InferIOInput<TIO>, data);
+                    };
+                },
+            }) as BroadcastProxy<TIO>;
+        }, [broadcast]);
     };
 
     const useCanRedo = (): boolean => {
         const room = useRoom();
 
-        const subscribe = useCallback(
-            (onStoreChange: () => void) => room.storageRoot(onStoreChange),
-            [room],
-        );
+        const subscribe = useCallback((onStoreChange: () => void) => room.storageRoot(onStoreChange), [room]);
 
         const getSnapshot = useCallback((): boolean => room.canRedo(), [room]);
 
-        const canRedo = useSyncExternalStoreWithSelector(
-            subscribe,
-            getSnapshot,
-            getSnapshot,
-            identity,
-        );
+        const canRedo = useSyncExternalStoreWithSelector(subscribe, getSnapshot, getSnapshot, identity);
 
         return canRedo;
     };
@@ -315,21 +254,13 @@ export const createRoomBundle = <
     const useCanUndo = (): boolean => {
         const room = useRoom();
 
-        const subscribe = useCallback(
-            (onStoreChange: () => void) => room.storageRoot(onStoreChange),
-            [room],
-        );
+        const subscribe = useCallback((onStoreChange: () => void) => room.storageRoot(onStoreChange), [room]);
 
         const getSnapshot = useCallback((): boolean => room.canUndo(), [room]);
 
-        const canRedo = useSyncExternalStoreWithSelector(
-            subscribe,
-            getSnapshot,
-            getSnapshot,
-            identity,
-        );
+        const canUndo = useSyncExternalStoreWithSelector(subscribe, getSnapshot, getSnapshot, identity);
 
-        return canRedo;
+        return canUndo;
     };
 
     const useConnection = <T extends unknown = WebSocketConnection>(
@@ -347,10 +278,7 @@ export const createRoomBundle = <
 
         const getSnapshot = room.getConnection;
 
-        const _selector = useCallback(
-            (snapshot: WebSocketConnection) => selector(snapshot) as Id<T>,
-            [selector],
-        );
+        const _selector = useCallback((snapshot: WebSocketConnection) => selector(snapshot) as Id<T>, [selector]);
 
         return useSyncExternalStoreWithSelector(
             subscribe,
@@ -382,6 +310,21 @@ export const createRoomBundle = <
         }, [callback, room, type]);
     };
 
+    const event = new Proxy(
+        {},
+        {
+            get(_, prop) {
+                const useProxyEvent = (
+                    callback: (data: Id<IOEventMessage<TIO, keyof InferIOOutput<TIO>>>) => void,
+                ): void => {
+                    return useEvent(prop as keyof InferIOOutput<TIO>, callback);
+                };
+
+                return { useEvent: useProxyEvent };
+            },
+        },
+    ) as EventProxy<TIO>;
+
     const useMyPresence = <T extends unknown = TPresence>(
         selector = identity as (myPresence: TPresence) => T,
         options?: SubscriptionHookOptions<Id<T> | null>,
@@ -397,10 +340,7 @@ export const createRoomBundle = <
 
         const getSnapshot = room.getMyPresence;
 
-        const _selector = useCallback(
-            (snapshot: TPresence) => selector(snapshot) as Id<T>,
-            [selector],
-        );
+        const _selector = useCallback((snapshot: TPresence) => selector(snapshot) as Id<T>, [selector]);
 
         const myPresence = useSyncExternalStoreWithSelector(
             subscribe,
@@ -410,20 +350,7 @@ export const createRoomBundle = <
             options?.isEqual ?? fastDeepEqual,
         );
 
-        const updateMyPresence: Dispatch<UpdateMyPresenceAction<TPresence>> =
-            useCallback(
-                (value: UpdateMyPresenceAction<TPresence>): void => {
-                    const presence =
-                        typeof value === "function"
-                            ? value(room.getMyPresence())
-                            : value;
-
-                    room.updateMyPresence(presence);
-                },
-                [room],
-            );
-
-        return [myPresence, updateMyPresence];
+        return [myPresence, room.updateMyPresence];
     };
 
     const useMyself = <T extends unknown = UserInfo<TIO, TPresence>>(
@@ -460,8 +387,8 @@ export const createRoomBundle = <
     const useOther = <T extends unknown = UserInfo<TIO, TPresence>>(
         connectionId: string,
         selector = identity as (other: UserInfo<TIO, TPresence>) => T,
-        options?: SubscriptionHookOptions<Id<T> | null>,
-    ): Id<T> | null => {
+        options?: SubscriptionHookOptions<T | null>,
+    ): T | null => {
         const room = useRoom();
 
         const subscribe = useCallback(
@@ -471,14 +398,11 @@ export const createRoomBundle = <
             [room, connectionId],
         );
 
-        const getSnapshot = useCallback(
-            () => room.getOther(connectionId),
-            [room, connectionId],
-        );
+        const getSnapshot = useCallback(() => room.getOther(connectionId), [room, connectionId]);
 
         const _selector = useCallback(
             (snapshot: Id<UserInfo<TIO, TPresence>> | null) => {
-                return !snapshot ? null : (selector(snapshot) as Id<T>);
+                return !snapshot ? null : (selector(snapshot) as T);
             },
             [selector],
         );
@@ -492,12 +416,10 @@ export const createRoomBundle = <
         );
     };
 
-    const useOthers = <T extends unknown = UserInfo<TIO, TPresence>>(
-        selector = identity as (
-            other: readonly Id<UserInfo<TIO, TPresence>>[],
-        ) => T[],
-        options?: SubscriptionHookOptions<readonly Id<T>[]>,
-    ): readonly Id<T>[] => {
+    const useOthers = <T extends unknown = readonly UserInfo<TIO, TPresence>[]>(
+        selector = identity as (other: readonly Id<UserInfo<TIO, TPresence>>[]) => T,
+        options?: SubscriptionHookOptions<T>,
+    ): T => {
         const room = useRoom();
 
         const subscribe = useCallback(
@@ -513,10 +435,23 @@ export const createRoomBundle = <
             subscribe,
             getSnapshot,
             getSnapshot,
-            selector as (
-                other: readonly Id<UserInfo<TIO, TPresence>>[],
-            ) => Id<T>[],
-            options?.isEqual ?? shallowArrayEqual,
+            selector as (other: readonly Id<UserInfo<TIO, TPresence>>[]) => T,
+            options?.isEqual ??
+                ((a, b) => {
+                    /**
+                     * !HACK
+                     * @description Assume the return type will always be an array when this occurs
+                     * and do a shallow comparison instead like how standard React dependency
+                     * arrays work. This is for performance's sake and may lead to bugs if the
+                     * selector doesn't always return an array
+                     * @date June 22, 2024
+                     */
+                    if (Array.isArray(a) && Array.isArray(b) && a.length === b.length) {
+                        return shallowArrayEqual(a, b);
+                    }
+
+                    return fastDeepEqual(a, b);
+                }),
         );
     };
 
@@ -526,14 +461,9 @@ export const createRoomBundle = <
         return room.redo;
     };
 
-    const useStorage = <
-        TKey extends keyof TStorage,
-        TData extends unknown = InferCrdtStorageJson<TStorage[TKey]>,
-    >(
+    const useStorage = <TKey extends keyof TStorage, TData extends unknown = InferCrdtStorageJson<TStorage[TKey]>>(
         key: TKey,
-        selector = identity as (
-            data: InferCrdtStorageJson<TStorage[TKey]>,
-        ) => TData,
+        selector = identity as (data: InferCrdtStorageJson<TStorage[TKey]>) => TData,
         options?: SubscriptionHookOptions<TData | null>,
     ): [data: TData | null, sharedType: TStorage[TKey] | null] => {
         const room = useRoom();
@@ -543,14 +473,9 @@ export const createRoomBundle = <
             rerender();
         });
 
-        const subscribe = useCallback(
-            (onStoreChange: () => void) => room.storage(key, onStoreChange),
-            [key, room],
-        );
+        const subscribe = useCallback((onStoreChange: () => void) => room.storage(key, onStoreChange), [key, room]);
 
-        const getSnapshot = useCallback((): InferCrdtStorageJson<
-            TStorage[TKey]
-        > | null => {
+        const getSnapshot = useCallback((): InferCrdtStorageJson<TStorage[TKey]> | null => {
             return room.getStorage(key)?.toJson();
         }, [key, room]);
 
@@ -591,6 +516,9 @@ export const createRoomBundle = <
         MockedRoomProvider,
         PluvRoomProvider,
 
+        // proxies
+        event,
+
         // hooks
         useBroadcast,
         useCanRedo,

package/src/index.ts

@@ -1,11 +1,6 @@
 export { ConnectionState, createClient } from "@pluv/client";
 export type { AbstractCrdtType, InferCrdtStorageJson } from "@pluv/crdt";
-export type {
-    BaseUser,
-    EventMessage,
-    EventRecord,
-    IOEventMessage,
-} from "@pluv/types";
+export type { BaseUser, EventMessage, EventRecord, IOEventMessage } from "@pluv/types";
 export { createBundle } from "./createBundle";
 export type { CreateBundle, PluvProviderProps } from "./createBundle";
 export type {

package/src/internal/hooks/index.ts

@@ -1,3 +1,3 @@
+export { useNoSsr } from "./useNoSsr";
 export { useRerender } from "./useRerender";
-export { useSyncExternalStore } from "./useSyncExternalStore";
 export { useSyncExternalStoreWithSelector } from "./useSyncExternalStoreWithSelector";

package/src/internal/hooks/useNoSsr.ts

@@ -0,0 +1,18 @@
+import { useCallback, useEffect, useState } from "react";
+
+export type NoSsrFunction = <T = null>(value: T | (() => T), fallback?: T) => T;
+
+export const useNoSsr = (): NoSsrFunction => {
+    const [didMount, setDidMount] = useState<boolean>(false);
+
+    useEffect(() => setDidMount(typeof window !== "undefined"), []);
+
+    const noSsr = useCallback(
+        <T = null>(value: T | (() => T), fallback: T = null as T): T => {
+            return didMount ? (typeof value !== "function" ? value : (value as () => T)()) : fallback;
+        },
+        [didMount],
+    );
+
+    return noSsr;
+};

package/src/internal/hooks/useSyncExternalStoreWithSelector.ts

@@ -1 +1,44 @@
-export { useSyncExternalStoreWithSelector } from "use-sync-external-store/with-selector.js";
+import { useRef, useSyncExternalStore } from "react";
+import { shallowEqual } from "../utils";
+import { useNoSsr } from "./useNoSsr";
+
+export const useSyncExternalStoreWithSelector = <TSnapshot, TSelection>(
+    subscribe: (onStoreChange: () => void) => () => void,
+    getClientSnapshot: () => TSnapshot,
+    getServerSnapshot: undefined | null | (() => TSnapshot),
+    selector: (snapshot: TSnapshot) => TSelection,
+    isEqual?: (a: TSelection, b: TSelection) => boolean,
+): TSelection => {
+    const noSsr = useNoSsr();
+    const cacheRef = useRef<TSelection | null>(null);
+
+    const _getServerSnapshot = getServerSnapshot
+        ? () => {
+              const data = getServerSnapshot();
+
+              return selector(data);
+          }
+        : undefined;
+
+    const _getClientSnapshot = () => {
+        const data = getClientSnapshot();
+        const snapshot = selector(data);
+        const compare = isEqual ?? shallowEqual;
+        const cached = cacheRef.current;
+
+        const isUnchanged = cached === null ? snapshot === null : compare(cached, snapshot);
+
+        /**
+         * !HACK
+         * @description Memoize only the last snapshot so that we can only rerender on changes
+         * @date June 22, 2024
+         */
+        cacheRef.current = isUnchanged ? cached ?? snapshot : snapshot;
+
+        return cacheRef.current;
+    };
+
+    const result = useSyncExternalStore(subscribe, _getClientSnapshot, _getServerSnapshot);
+
+    return typeof window !== "undefined" ? noSsr(result, _getServerSnapshot?.()) : result;
+};

package/src/internal/index.ts

@@ -1,6 +1,2 @@
-export {
-    useRerender,
-    useSyncExternalStore,
-    useSyncExternalStoreWithSelector,
-} from "./hooks";
+export { useRerender, useSyncExternalStore, useSyncExternalStoreWithSelector } from "./hooks";
 export { identity, shallowArrayEqual } from "./utils";

package/src/internal/utils/index.ts

@@ -1,2 +1,3 @@
 export { identity } from "./identity";
 export { shallowArrayEqual } from "./shallowArrayEqual";
+export { shallowEqual } from "./shallowEqual";

package/src/internal/utils/shallowArrayEqual.ts

@@ -1,6 +1,3 @@
-export const shallowArrayEqual = <T extends unknown>(
-    a: readonly T[] | T[],
-    b: readonly T[] | T[]
-): boolean => {
+export const shallowArrayEqual = <T extends unknown>(a: readonly T[] | T[], b: readonly T[] | T[]): boolean => {
     return a.length === b.length && a.every((item, i) => item === b[i]);
 };

package/src/internal/utils/shallowEqual.ts

@@ -0,0 +1 @@
+export const shallowEqual = (a: any, b: any): boolean => a === b;

package/tsconfig.json

@@ -1,5 +1,8 @@
 {
 	"extends": "@pluv/tsconfig/react-library.json",
 	"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
-	"exclude": ["node_modules"]
+	"exclude": ["node_modules"],
+	"compilerOptions": {
+		"lib": ["dom", "esnext"]
+	}
 }

package/src/internal/hooks/useSyncExternalStore.ts

@@ -1,15 +0,0 @@
-import { useSyncExternalStoreWithSelector } from "./useSyncExternalStoreWithSelector";
-import { identity } from "../utils";
-
-export const useSyncExternalStore = <TSnapshot extends unknown>(
-    subscribe: (onStoreChange: () => void) => () => void,
-    getSnapshot: () => TSnapshot,
-    getServerSnapshot: undefined | null | (() => TSnapshot)
-) => {
-    return useSyncExternalStoreWithSelector(
-        subscribe,
-        getSnapshot,
-        getServerSnapshot,
-        identity
-    );
-};