@evolu/react 9.0.1-preview.5 → 9.0.1-preview.6

package/dist/index.d.ts

@@ -7,5 +7,5 @@ export * from "./useOwner.js";
 export * from "./useQueries.js";
 export * from "./useQuery.js";
 export * from "./useQuerySubscription.js";
-export * from "./useWasSsr.js";
+export * from "./useIsSsr.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAE1C,cAAc,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAE1C,cAAc,eAAe,CAAC"}

package/dist/index.js

@@ -8,4 +8,4 @@ export * from "./useQueries.js";
 export * from "./useQuery.js";
 export * from "./useQuerySubscription.js";
 // export * from "./useSyncState.js"; TODO: Update it for the owner-api
-export * from "./useWasSsr.js";
+export * from "./useIsSsr.js";

package/dist/useIsSsr.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Avoiding hydration mismatches.
+ *
+ * @see https://kurtextrem.de/posts/react-uses-hydration
+ */
+export declare const useIsSsr: () => boolean;
+//# sourceMappingURL=useIsSsr.d.ts.map

package/dist/useIsSsr.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsSsr.d.ts","sourceRoot":"","sources":["../src/useIsSsr.ts"],"names":[],"mappings":"AAMA;;;;GAIG;AACH,eAAO,MAAM,QAAQ,QAAO,OAG3B,CAAC"}

package/dist/useIsSsr.js

@@ -0,0 +1,13 @@
+import { constFalse, constTrue } from "@evolu/common";
+import { useSyncExternalStore } from "react";
+// eslint-disable-next-line @typescript-eslint/no-empty-function
+const emptySubscribe = () => () => { };
+/**
+ * Avoiding hydration mismatches.
+ *
+ * @see https://kurtextrem.de/posts/react-uses-hydration
+ */
+export const useIsSsr = () => {
+    // TODO: Consider useDeferredValue(isSSRSync);
+    return useSyncExternalStore(emptySubscribe, constFalse, constTrue);
+};

package/dist/useQueries.js

@@ -1,7 +1,7 @@
 import { use, useRef } from "react";
 import { useEvolu } from "./useEvolu.js";
 import { useQuerySubscription } from "./useQuerySubscription.js";
-import { useWasSsr } from "./useWasSsr.js";
+import { useIsSsr } from "./useIsSsr.js";
 /**
  * The same as {@link useQuery}, but for many queries.
  *
@@ -11,7 +11,7 @@ export const useQueries = (queries, options = {}) => {
     const evolu = useEvolu();
     const once = useRef(options).current.once;
     const allQueries = once ? queries.concat(once) : queries;
-    const wasSSR = useWasSsr();
+    const wasSSR = useIsSsr();
     if (wasSSR) {
         if (!options.promises)
             void evolu.loadQueries(allQueries);

package/dist/useQuery.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useQuery.d.ts","sourceRoot":"","sources":["../src/useQuery.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAO5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,GAAG,EACpC,OAAO,KAAK,CAAC,CAAC,CAAC,EACf,UAAS,OAAO,CAAC;IACf,sCAAsC;IACtC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IAEvB,4EAA4E;IAC5E,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;CACzC,CAAM,KACN,SAAS,CAAC,CAAC,CAUb,CAAC"}
+{"version":3,"file":"useQuery.d.ts","sourceRoot":"","sources":["../src/useQuery.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAO5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,GAAG,EACpC,OAAO,KAAK,CAAC,CAAC,CAAC,EACf,UAAS,OAAO,CAAC;IACf,sCAAsC;IACtC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IAEvB,4EAA4E;IAC5E,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;CACzC,CAAM,KACN,SAAS,CAAC,CAAC,CAWb,CAAC"}

package/dist/useQuery.js

@@ -1,7 +1,7 @@
 import { use } from "react";
 import { useEvolu } from "./useEvolu.js";
 import { useQuerySubscription } from "./useQuerySubscription.js";
-import { useWasSsr } from "./useWasSsr.js";
+import { useIsSsr } from "./useIsSsr.js";
 /**
  * Load and subscribe to the Query, and return an object with `rows` and `row`
  * properties that are automatically updated when data changes.
@@ -33,8 +33,8 @@ import { useWasSsr } from "./useWasSsr.js";
  */
 export const useQuery = (query, options = {}) => {
     const evolu = useEvolu();
-    const wasSSR = useWasSsr();
-    if (wasSSR) {
+    const isSSR = useIsSsr();
+    if (isSSR) {
         if (!options.promise)
             void evolu.loadQuery(query);
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@evolu/react",
-  "version": "9.0.1-preview.5",
+  "version": "9.0.1-preview.6",
   "description": "Evolu for React",
   "keywords": [
     "evolu",
@@ -36,11 +36,11 @@
     "shx": "^0.4.0",
     "typescript": "^5.9.2",
     "vitest": "^4.0.4",
-    "@evolu/common": "6.0.1-preview.20",
+    "@evolu/common": "6.0.1-preview.22",
     "@evolu/tsconfig": "0.0.2"
   },
   "peerDependencies": {
-    "@evolu/common": "^6.0.1-preview.20",
+    "@evolu/common": "^6.0.1-preview.22",
     "react": ">=19"
   },
   "publishConfig": {

package/src/index.ts

@@ -8,4 +8,4 @@ export * from "./useQueries.js";
 export * from "./useQuery.js";
 export * from "./useQuerySubscription.js";
 // export * from "./useSyncState.js"; TODO: Update it for the owner-api
-export * from "./useWasSsr.js";
+export * from "./useIsSsr.js";

package/src/useIsSsr.ts

@@ -0,0 +1,15 @@
+import { constFalse, constTrue } from "@evolu/common";
+import { useSyncExternalStore } from "react";
+
+// eslint-disable-next-line @typescript-eslint/no-empty-function
+const emptySubscribe = () => () => {};
+
+/**
+ * Avoiding hydration mismatches.
+ *
+ * @see https://kurtextrem.de/posts/react-uses-hydration
+ */
+export const useIsSsr = (): boolean => {
+  // TODO: Consider useDeferredValue(isSSRSync);
+  return useSyncExternalStore(emptySubscribe, constFalse, constTrue);
+};

package/src/useQueries.ts

@@ -8,7 +8,7 @@ import { use, useRef } from "react";
 import { useEvolu } from "./useEvolu.js";
 import type { useQuery } from "./useQuery.js";
 import { useQuerySubscription } from "./useQuerySubscription.js";
-import { useWasSsr } from "./useWasSsr.js";
+import { useIsSsr } from "./useIsSsr.js";
 
 /**
  * The same as {@link useQuery}, but for many queries.
@@ -35,7 +35,7 @@ export const useQueries = <
   const evolu = useEvolu();
   const once = useRef(options).current.once;
   const allQueries = once ? queries.concat(once) : queries;
-  const wasSSR = useWasSsr();
+  const wasSSR = useIsSsr();
   if (wasSSR) {
     if (!options.promises) void evolu.loadQueries(allQueries);
   } else {

package/src/useQuery.ts

@@ -3,7 +3,7 @@ import { use } from "react";
 import { useEvolu } from "./useEvolu.js";
 import type { useQueries } from "./useQueries.js";
 import { useQuerySubscription } from "./useQuerySubscription.js";
-import { useWasSsr } from "./useWasSsr.js";
+import { useIsSsr } from "./useIsSsr.js";
 
 /**
  * Load and subscribe to the Query, and return an object with `rows` and `row`
@@ -45,12 +45,13 @@ export const useQuery = <R extends Row>(
   }> = {},
 ): QueryRows<R> => {
   const evolu = useEvolu();
-  const wasSSR = useWasSsr();
+  const isSSR = useIsSsr();
 
-  if (wasSSR) {
+  if (isSSR) {
     if (!options.promise) void evolu.loadQuery(query);
   } else {
     use(options.promise ?? evolu.loadQuery(query));
   }
+
   return useQuerySubscription(query, options);
 };

package/dist/useWasSsr.d.ts

@@ -1,12 +0,0 @@
-/**
- * Unlike the `typeof window === 'undefined'`, this ensures that the server and
- * hydration see the same thing.
- *
- * We use this so people can use Evolu with SSR even though it's not recommended
- * because of layout shift during rendering.
- *
- * @see https://tkdodo.eu/blog/avoiding-hydration-mismatches-with-use-sync-external-store
- * @see https://kurtextrem.de/posts/react-uses-hydration
- */
-export declare const useWasSsr: () => boolean;
-//# sourceMappingURL=useWasSsr.d.ts.map

package/dist/useWasSsr.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useWasSsr.d.ts","sourceRoot":"","sources":["../src/useWasSsr.ts"],"names":[],"mappings":"AAKA;;;;;;;;;GASG;AACH,eAAO,MAAM,SAAS,QAAO,OAO5B,CAAC"}

package/dist/useWasSsr.js

@@ -1,17 +0,0 @@
-import { useRef, useSyncExternalStore } from "react";
-// eslint-disable-next-line @typescript-eslint/no-empty-function
-const emptySubscribe = () => () => { };
-/**
- * Unlike the `typeof window === 'undefined'`, this ensures that the server and
- * hydration see the same thing.
- *
- * We use this so people can use Evolu with SSR even though it's not recommended
- * because of layout shift during rendering.
- *
- * @see https://tkdodo.eu/blog/avoiding-hydration-mismatches-with-use-sync-external-store
- * @see https://kurtextrem.de/posts/react-uses-hydration
- */
-export const useWasSsr = () => {
-    const ref = useRef(false);
-    return useSyncExternalStore(emptySubscribe, () => ref.current, () => (ref.current = true));
-};

package/src/useWasSsr.ts

@@ -1,23 +0,0 @@
-import { useRef, useSyncExternalStore } from "react";
-
-// eslint-disable-next-line @typescript-eslint/no-empty-function
-const emptySubscribe = () => () => {};
-
-/**
- * Unlike the `typeof window === 'undefined'`, this ensures that the server and
- * hydration see the same thing.
- *
- * We use this so people can use Evolu with SSR even though it's not recommended
- * because of layout shift during rendering.
- *
- * @see https://tkdodo.eu/blog/avoiding-hydration-mismatches-with-use-sync-external-store
- * @see https://kurtextrem.de/posts/react-uses-hydration
- */
-export const useWasSsr = (): boolean => {
-  const ref = useRef(false);
-  return useSyncExternalStore(
-    emptySubscribe,
-    () => ref.current,
-    () => (ref.current = true),
-  );
-};