@livestore/react 0.4.0-dev.0 → 0.4.0-dev.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@livestore/react",
-  "version": "0.4.0-dev.0",
+  "version": "0.4.0-dev.10",
   "type": "module",
   "sideEffects": false,
   "exports": {
@@ -9,25 +9,25 @@
   },
   "dependencies": {
     "@opentelemetry/api": "1.9.0",
-    "@livestore/common": "0.4.0-dev.0",
-    "@livestore/livestore": "0.4.0-dev.0",
-    "@livestore/utils": "0.4.0-dev.0"
+    "@livestore/common": "0.4.0-dev.10",
+    "@livestore/livestore": "0.4.0-dev.10",
+    "@livestore/utils": "0.4.0-dev.10"
   },
   "devDependencies": {
     "@opentelemetry/sdk-trace-base": "^2.0.1",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/react": "^16.3.0",
-    "@types/react": "^19.1.9",
-    "@types/react-dom": "^19.1.7",
+    "@types/react": "19.1.13",
+    "@types/react-dom": "19.1.9",
     "jsdom": "^26.1.0",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
+    "react": "19.1.0",
+    "react-dom": "19.1.0",
     "react-window": "^1.8.11",
-    "typescript": "^5.9.2",
-    "vite": "^7.0.6",
+    "typescript": "5.9.2",
+    "vite": "7.1.7",
     "vitest": "3.2.4",
-    "@livestore/utils-dev": "0.4.0-dev.0",
-    "@livestore/adapter-web": "0.4.0-dev.0"
+    "@livestore/utils-dev": "0.4.0-dev.10",
+    "@livestore/adapter-web": "0.4.0-dev.10"
   },
   "files": [
     "package.json",
@@ -36,7 +36,7 @@
   ],
   "license": "Apache-2.0",
   "peerDependencies": {
-    "react": "^19.0.0"
+    "react": "^19.1.0"
   },
   "publishConfig": {
     "access": "public"

package/src/LiveStoreProvider.test.tsx

@@ -1,4 +1,4 @@
-/** biome-ignore-all lint/a11y: test */
+/** biome-ignore-all lint/a11y: test files need a11y disabled */
 import { makeInMemoryAdapter } from '@livestore/adapter-web'
 import { queryDb, type Store } from '@livestore/livestore'
 import { Schema } from '@livestore/utils/effect'

package/src/LiveStoreProvider.tsx

@@ -9,7 +9,7 @@ import type {
   LiveStoreContext as StoreContext_,
 } from '@livestore/livestore'
 import { createStore, makeShutdownDeferred, StoreInterrupted } from '@livestore/livestore'
-import { errorToString, IS_REACT_NATIVE, LS_DEV } from '@livestore/utils'
+import { errorToString, IS_REACT_NATIVE, LS_DEV, omitUndefineds } from '@livestore/utils'
 import type { OtelTracer } from '@livestore/utils/effect'
 import {
   Cause,
@@ -90,7 +90,7 @@ const defaultRenderShutdown = (cause: IntentionalShutdownCause | StoreInterrupte
   const reason =
     cause._tag === 'LiveStore.StoreInterrupted'
       ? `interrupted due to: ${cause.reason}`
-      : cause._tag === 'LiveStore.SyncError'
+      : cause._tag === 'InvalidPushError' || cause._tag === 'InvalidPullError'
         ? `sync error: ${cause.cause}`
         : cause.reason === 'devtools-import'
           ? 'devtools import'
@@ -124,19 +124,21 @@ export const LiveStoreProvider = ({
   confirmUnsavedChanges = true,
   syncPayload,
   debug,
-}: LiveStoreProviderProps & { children?: React.ReactNode }): React.ReactNode => {
+}: LiveStoreProviderProps & React.PropsWithChildren): React.ReactNode => {
   const storeCtx = useCreateStore({
     storeId,
     schema,
-    otelOptions,
-    boot,
     adapter,
     batchUpdates,
-    disableDevtools,
-    signal,
     confirmUnsavedChanges,
-    syncPayload,
-    debug,
+    ...omitUndefineds({
+      otelOptions,
+      boot,
+      disableDevtools,
+      signal,
+      syncPayload,
+      debug,
+    }),
   })
 
   if (storeCtx.stage === 'error') {
@@ -330,21 +332,23 @@ const useCreateStore = ({
         const store = yield* createStore({
           schema,
           storeId,
-          boot,
           adapter,
-          batchUpdates,
-          disableDevtools,
           shutdownDeferred,
-          context,
-          params,
-          confirmUnsavedChanges,
-          syncPayload,
+          ...omitUndefineds({
+            boot,
+            batchUpdates,
+            disableDevtools,
+            context,
+            params,
+            confirmUnsavedChanges,
+            syncPayload,
+          }),
           onBootStatus: (status) => {
             if (ctxValueRef.current.value.stage === 'running' || ctxValueRef.current.value.stage === 'error') return
             // NOTE sometimes when status come in in rapid succession, only the last value will be rendered by React
             setContextValue(status)
           },
-          debug: { instanceId: debugInstanceId },
+          debug: { ...omitUndefineds({ instanceId: debugInstanceId }) },
         }).pipe(Effect.tapErrorCause((cause) => Deferred.failCause(shutdownDeferred, cause)))
 
         setContextValue({ stage: 'running', store })
@@ -356,7 +360,8 @@ const useCreateStore = ({
       yield* Deferred.await(shutdownDeferred).pipe(
         Effect.tapErrorCause((cause) => Effect.logDebug('[@livestore/livestore/react] shutdown', Cause.pretty(cause))),
         Effect.tap((intentionalShutdown) => shutdownContext(intentionalShutdown)),
-        Effect.catchTag('LiveStore.SyncError', (cause) => shutdownContext(cause)),
+        Effect.catchTag('InvalidPushError', (cause) => shutdownContext(cause)),
+        Effect.catchTag('InvalidPullError', (cause) => shutdownContext(cause)),
         Effect.catchTag('LiveStore.StoreInterrupted', (cause) => shutdownContext(cause)),
         Effect.tapError((error) => Effect.sync(() => setContextValue({ stage: 'error', error }))),
         Effect.tapDefect((defect) => Effect.sync(() => setContextValue({ stage: 'error', error: defect }))),
@@ -366,7 +371,7 @@ const useCreateStore = ({
       Effect.scoped,
       Effect.withSpan('@livestore/react:useCreateStore'),
       LS_DEV ? TaskTracing.withAsyncTaggingTracing((name: string) => (console as any).createTask(name)) : identity,
-      provideOtel({ parentSpanContext: otelOptions?.rootSpanContext, otelTracer: otelOptions?.tracer }),
+      provideOtel(omitUndefineds({ parentSpanContext: otelOptions?.rootSpanContext, otelTracer: otelOptions?.tracer })),
       Effect.tapCauseLogPretty,
       Effect.annotateLogs({ thread: 'window' }),
       Effect.provide(Logger.prettyWithThread('window')),

package/src/__snapshots__/useClientDocument.test.tsx.snap

@@ -47,29 +47,6 @@ exports[`useClientDocument > otel > should update the data based on component ke
     },
     {
       "_name": "LiveStore:commits",
-      "children": [
-        {
-          "_name": "LiveStore:commit",
-          "attributes": {
-            "livestore.eventTags": [
-              "UserInfoSet",
-            ],
-            "livestore.eventsCount": 1,
-          },
-          "children": [
-            {
-              "_name": "livestore.in-memory-db:execute",
-              "attributes": {
-                "sql.query": "
-      INSERT INTO 'UserInfo' (id, value)
-      VALUES (?, ?)
-      ON CONFLICT (id) DO UPDATE SET value = json_set(value, ?, json(?))
-    ",
-              },
-            },
-          ],
-        },
-      ],
     },
     {
       "_name": "LiveStore:queries",
@@ -89,28 +66,6 @@ exports[`useClientDocument > otel > should update the data based on component ke
                 "sql.rowsCount": 0,
               },
             },
-            {
-              "_name": "LiveStore:commit",
-              "attributes": {
-                "livestore.commitLabel": "UserInfo.set:u1",
-                "livestore.eventTags": [
-                  "UserInfoSet",
-                ],
-                "livestore.eventsCount": 1,
-              },
-              "children": [
-                {
-                  "_name": "livestore.in-memory-db:execute",
-                  "attributes": {
-                    "sql.query": "
-      INSERT INTO 'UserInfo' (id, value)
-      VALUES (?, ?)
-      ON CONFLICT (id) DO UPDATE SET value = json_set(json_set(value, ?, json(?)), ?, json(?))
-    ",
-                  },
-                },
-              ],
-            },
             {
               "_name": "db:SELECT * FROM 'UserInfo' WHERE id = ?",
               "attributes": {
@@ -226,6 +181,88 @@ exports[`useClientDocument > otel > should update the data based on component ke
 }
 `;
 
+exports[`useClientDocument > otel > should update the data based on component key strictMode={ strictMode: false } 2`] = `
+[
+  {
+    "_name": "LiveStore:commit",
+    "attributes": {
+      "livestore.commitLabel": "UserInfo.set:u1",
+      "livestore.eventTags": "[
+  "UserInfoSet"
+]",
+      "livestore.eventsCount": 1,
+    },
+    "children": [
+      {
+        "_name": "client-session-sync-processor:push",
+        "attributes": {
+          "batchSize": 1,
+          "eventCounts": "{
+  "UserInfoSet": 1
+}",
+          "mergeResultTag": "advance",
+        },
+        "children": [
+          {
+            "_name": "client-session-sync-processor:materialize-event",
+            "children": [
+              {
+                "_name": "livestore.in-memory-db:execute",
+                "attributes": {
+                  "sql.query": "
+      INSERT INTO 'UserInfo' (id, value)
+      VALUES (?, ?)
+      ON CONFLICT (id) DO UPDATE SET value = json_set(json_set(value, ?, json(?)), ?, json(?))
+    ",
+                },
+              },
+            ],
+          },
+        ],
+      },
+    ],
+  },
+  {
+    "_name": "LiveStore:commit",
+    "attributes": {
+      "livestore.eventTags": "[
+  "UserInfoSet"
+]",
+      "livestore.eventsCount": 1,
+    },
+    "children": [
+      {
+        "_name": "client-session-sync-processor:push",
+        "attributes": {
+          "batchSize": 1,
+          "eventCounts": "{
+  "UserInfoSet": 1
+}",
+          "mergeResultTag": "advance",
+        },
+        "children": [
+          {
+            "_name": "client-session-sync-processor:materialize-event",
+            "children": [
+              {
+                "_name": "livestore.in-memory-db:execute",
+                "attributes": {
+                  "sql.query": "
+      INSERT INTO 'UserInfo' (id, value)
+      VALUES (?, ?)
+      ON CONFLICT (id) DO UPDATE SET value = json_set(value, ?, json(?))
+    ",
+                },
+              },
+            ],
+          },
+        ],
+      },
+    ],
+  },
+]
+`;
+
 exports[`useClientDocument > otel > should update the data based on component key strictMode={ strictMode: true } 1`] = `
 {
   "_name": "createStore",
@@ -273,29 +310,6 @@ exports[`useClientDocument > otel > should update the data based on component ke
     },
     {
       "_name": "LiveStore:commits",
-      "children": [
-        {
-          "_name": "LiveStore:commit",
-          "attributes": {
-            "livestore.eventTags": [
-              "UserInfoSet",
-            ],
-            "livestore.eventsCount": 1,
-          },
-          "children": [
-            {
-              "_name": "livestore.in-memory-db:execute",
-              "attributes": {
-                "sql.query": "
-      INSERT INTO 'UserInfo' (id, value)
-      VALUES (?, ?)
-      ON CONFLICT (id) DO UPDATE SET value = json_set(value, ?, json(?))
-    ",
-              },
-            },
-          ],
-        },
-      ],
     },
     {
       "_name": "LiveStore:queries",
@@ -315,28 +329,6 @@ exports[`useClientDocument > otel > should update the data based on component ke
                 "sql.rowsCount": 0,
               },
             },
-            {
-              "_name": "LiveStore:commit",
-              "attributes": {
-                "livestore.commitLabel": "UserInfo.set:u1",
-                "livestore.eventTags": [
-                  "UserInfoSet",
-                ],
-                "livestore.eventsCount": 1,
-              },
-              "children": [
-                {
-                  "_name": "livestore.in-memory-db:execute",
-                  "attributes": {
-                    "sql.query": "
-      INSERT INTO 'UserInfo' (id, value)
-      VALUES (?, ?)
-      ON CONFLICT (id) DO UPDATE SET value = json_set(json_set(value, ?, json(?)), ?, json(?))
-    ",
-                  },
-                },
-              ],
-            },
             {
               "_name": "db:SELECT * FROM 'UserInfo' WHERE id = ?",
               "attributes": {
@@ -390,6 +382,88 @@ exports[`useClientDocument > otel > should update the data based on component ke
 }
 `;
 
+exports[`useClientDocument > otel > should update the data based on component key strictMode={ strictMode: true } 2`] = `
+[
+  {
+    "_name": "LiveStore:commit",
+    "attributes": {
+      "livestore.commitLabel": "UserInfo.set:u1",
+      "livestore.eventTags": "[
+  "UserInfoSet"
+]",
+      "livestore.eventsCount": 1,
+    },
+    "children": [
+      {
+        "_name": "client-session-sync-processor:push",
+        "attributes": {
+          "batchSize": 1,
+          "eventCounts": "{
+  "UserInfoSet": 1
+}",
+          "mergeResultTag": "advance",
+        },
+        "children": [
+          {
+            "_name": "client-session-sync-processor:materialize-event",
+            "children": [
+              {
+                "_name": "livestore.in-memory-db:execute",
+                "attributes": {
+                  "sql.query": "
+      INSERT INTO 'UserInfo' (id, value)
+      VALUES (?, ?)
+      ON CONFLICT (id) DO UPDATE SET value = json_set(json_set(value, ?, json(?)), ?, json(?))
+    ",
+                },
+              },
+            ],
+          },
+        ],
+      },
+    ],
+  },
+  {
+    "_name": "LiveStore:commit",
+    "attributes": {
+      "livestore.eventTags": "[
+  "UserInfoSet"
+]",
+      "livestore.eventsCount": 1,
+    },
+    "children": [
+      {
+        "_name": "client-session-sync-processor:push",
+        "attributes": {
+          "batchSize": 1,
+          "eventCounts": "{
+  "UserInfoSet": 1
+}",
+          "mergeResultTag": "advance",
+        },
+        "children": [
+          {
+            "_name": "client-session-sync-processor:materialize-event",
+            "children": [
+              {
+                "_name": "livestore.in-memory-db:execute",
+                "attributes": {
+                  "sql.query": "
+      INSERT INTO 'UserInfo' (id, value)
+      VALUES (?, ?)
+      ON CONFLICT (id) DO UPDATE SET value = json_set(value, ?, json(?))
+    ",
+                },
+              },
+            ],
+          },
+        ],
+      },
+    ],
+  },
+]
+`;
+
 exports[`useClientDocument > should update the data based on component key 1`] = `
 {
   "atoms": [
@@ -443,7 +517,7 @@ exports[`useClientDocument > should update the data based on component key 1`] =
       "refreshes": 1,
       "sub": [],
       "super": [
-        "node-5",
+        "node-6",
       ],
     },
     {
@@ -464,10 +538,27 @@ exports[`useClientDocument > should update the data based on component key 1`] =
       "super": [],
     },
     {
-      "_tag": "thunk",
+      "_tag": "ref",
       "id": "node-5",
       "isDestroyed": false,
       "isDirty": false,
+      "label": "tableRef:Kv",
+      "meta": {
+        "liveStoreRefType": "table",
+      },
+      "previousResult": {
+        "_tag": "Some",
+        "value": "null",
+      },
+      "refreshes": 0,
+      "sub": [],
+      "super": [],
+    },
+    {
+      "_tag": "thunk",
+      "id": "node-6",
+      "isDestroyed": false,
+      "isDirty": false,
       "label": "UserInfo.get:u1:results",
       "meta": {
         "liveStoreThunkType": "db.result",
@@ -481,7 +572,7 @@ exports[`useClientDocument > should update the data based on component key 1`] =
         "node-3",
       ],
       "super": [
-        "node-6",
+        "node-7",
       ],
     },
   ],
@@ -489,12 +580,12 @@ exports[`useClientDocument > should update the data based on component key 1`] =
   "effects": [
     {
       "_tag": "effect",
-      "id": "node-6",
+      "id": "node-7",
       "invocations": 1,
       "isDestroyed": false,
       "label": "subscribe:UserInfo.get:u1",
       "sub": [
-        "node-5",
+        "node-6",
       ],
     },
   ],
@@ -554,7 +645,7 @@ exports[`useClientDocument > should update the data based on component key 2`] =
       "refreshes": 2,
       "sub": [],
       "super": [
-        "node-7",
+        "node-8",
       ],
     },
     {
@@ -574,9 +665,26 @@ exports[`useClientDocument > should update the data based on component key 2`] =
       "sub": [],
       "super": [],
     },
+    {
+      "_tag": "ref",
+      "id": "node-5",
+      "isDestroyed": false,
+      "isDirty": false,
+      "label": "tableRef:Kv",
+      "meta": {
+        "liveStoreRefType": "table",
+      },
+      "previousResult": {
+        "_tag": "Some",
+        "value": "null",
+      },
+      "refreshes": 0,
+      "sub": [],
+      "super": [],
+    },
     {
       "_tag": "thunk",
-      "id": "node-7",
+      "id": "node-8",
       "isDestroyed": false,
       "isDirty": false,
       "label": "UserInfo.get:u2:results",
@@ -592,7 +700,7 @@ exports[`useClientDocument > should update the data based on component key 2`] =
         "node-3",
       ],
       "super": [
-        "node-8",
+        "node-9",
       ],
     },
   ],
@@ -600,12 +708,12 @@ exports[`useClientDocument > should update the data based on component key 2`] =
   "effects": [
     {
       "_tag": "effect",
-      "id": "node-8",
+      "id": "node-9",
       "invocations": 1,
       "isDestroyed": false,
       "label": "subscribe:UserInfo.get:u2",
       "sub": [
-        "node-7",
+        "node-8",
       ],
     },
   ],