@livestore/react 0.4.0-dev.9 → 0.5.0-dev.0

package/package.json

@@ -1,45 +1,78 @@
 {
   "name": "@livestore/react",
-  "version": "0.4.0-dev.9",
+  "version": "0.5.0-dev.0",
+  "license": "Apache-2.0",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/livestorejs/livestore.git"
+  },
+  "files": [
+    "dist",
+    "package.json",
+    "src"
+  ],
   "type": "module",
   "sideEffects": false,
   "exports": {
     ".": "./dist/mod.js",
     "./experimental": "./dist/experimental/mod.js"
   },
+  "publishConfig": {
+    "access": "public"
+  },
   "dependencies": {
     "@opentelemetry/api": "1.9.0",
-    "@livestore/common": "0.4.0-dev.9",
-    "@livestore/livestore": "0.4.0-dev.9",
-    "@livestore/utils": "0.4.0-dev.9"
+    "@livestore/framework-toolkit": "^0.5.0-dev.0",
+    "@livestore/livestore": "^0.5.0-dev.0",
+    "@livestore/utils": "^0.5.0-dev.0",
+    "@livestore/common": "^0.5.0-dev.0"
   },
   "devDependencies": {
-    "@opentelemetry/sdk-trace-base": "^2.0.1",
-    "@testing-library/dom": "^10.4.1",
-    "@testing-library/react": "^16.3.0",
-    "@types/react": "19.1.13",
-    "@types/react-dom": "19.1.9",
-    "jsdom": "^26.1.0",
-    "react": "19.1.1",
-    "react-dom": "19.1.1",
-    "react-window": "^1.8.11",
-    "typescript": "5.9.2",
-    "vite": "7.1.7",
-    "vitest": "3.2.4",
-    "@livestore/utils-dev": "0.4.0-dev.9",
-    "@livestore/adapter-web": "0.4.0-dev.9"
+    "@opentelemetry/sdk-trace-base": "2.2.0",
+    "@testing-library/dom": "10.4.1",
+    "@testing-library/react": "16.3.1",
+    "@types/react": "19.2.7",
+    "@types/react-dom": "19.2.3",
+    "@types/react-window": "1.8.8",
+    "jsdom": "26.1.0",
+    "react": "19.2.3",
+    "react-dom": "19.2.3",
+    "react-window": "1.8.11",
+    "typescript": "6.0.3",
+    "vite": "7.3.1",
+    "vitest": "4.1.9",
+    "@livestore/utils-dev": "^0.5.0-dev.0",
+    "@livestore/adapter-web": "^0.5.0-dev.0"
   },
-  "files": [
-    "package.json",
-    "src",
-    "dist"
-  ],
-  "license": "Apache-2.0",
   "peerDependencies": {
-    "react": "^19.1.1"
+    "@effect/opentelemetry": "^4.0.0-rc.111",
+    "@effect/platform-browser": "^4.0.0-rc.111",
+    "@effect/platform-bun": "^4.0.0-rc.111",
+    "@effect/platform-node": "^4.0.0-rc.111",
+    "@effect/platform-node-shared": "^4.0.0-rc.111",
+    "@effect/vitest": "^4.0.0-rc.111",
+    "@opentelemetry/api": "^1.9.0",
+    "@opentelemetry/resources": "^2.2.0",
+    "@standard-schema/spec": "^1.1.0",
+    "effect": "^4.0.0-rc.111",
+    "react": "^19.0.0"
   },
-  "publishConfig": {
-    "access": "public"
+  "$genie": {
+    "source": "package.json.genie.ts",
+    "warning": "DO NOT EDIT - changes will be overwritten",
+    "workspaceClosureDirs": [
+      "packages/@livestore/adapter-web",
+      "packages/@livestore/common",
+      "packages/@livestore/common-cf",
+      "packages/@livestore/framework-toolkit",
+      "packages/@livestore/livestore",
+      "packages/@livestore/react",
+      "packages/@livestore/sqlite-wasm",
+      "packages/@livestore/utils",
+      "packages/@livestore/utils-dev",
+      "packages/@livestore/wa-sqlite",
+      "packages/@livestore/webmesh"
+    ]
   },
   "scripts": {
     "build": "tsc",

package/src/StoreRegistryContext.tsx

@@ -0,0 +1,70 @@
+import * as React from 'react'
+
+import type { StoreRegistry } from '@livestore/livestore'
+
+export const StoreRegistryContext = React.createContext<StoreRegistry | undefined>(undefined)
+
+export type StoreRegistryProviderProps = {
+  storeRegistry: StoreRegistry
+  children: React.ReactNode
+}
+
+/**
+ * React context provider that makes a {@link StoreRegistry} available to descendant components.
+ *
+ * Wrap your application (or a subtree) with this provider to enable {@link useStore} and
+ * {@link useStoreRegistry} hooks within that tree.
+ *
+ * @example
+ * ```tsx
+ * import { StoreRegistry } from '@livestore/livestore'
+ * import { StoreRegistryProvider } from '@livestore/react'
+ * import { unstable_batchedUpdates as batchUpdates } from 'react-dom'
+ *
+ * const storeRegistry = new StoreRegistry({
+ *   defaultOptions: { batchUpdates }
+ * })
+ *
+ * function App() {
+ *   return (
+ *     <StoreRegistryProvider storeRegistry={storeRegistry}>
+ *       <MyComponent />
+ *     </StoreRegistryProvider>
+ *   )
+ * }
+ * ```
+ */
+export const StoreRegistryProvider = ({ storeRegistry, children }: StoreRegistryProviderProps): React.JSX.Element => {
+  return <StoreRegistryContext value={storeRegistry}>{children}</StoreRegistryContext>
+}
+
+/**
+ * Hook to access the {@link StoreRegistry} from context. Useful for advanced operations like preloading.
+ *
+ * @param override - Optional registry to use instead of the context value.
+ *   When provided, skips context lookup entirely.
+ * @returns The registry provided by the nearest {@link StoreRegistryProvider} ancestor, or the `override` if provided.
+ * @throws Error if called outside a {@link StoreRegistryProvider} and no override is provided
+ *
+ * @example
+ * ```tsx
+ * function PreloadButton({ issueId }: { issueId: string }) {
+ *   const storeRegistry = useStoreRegistry()
+ *
+ *   const handleMouseEnter = () => {
+ *     storeRegistry.preload(issueStoreOptions(issueId))
+ *   }
+ *
+ *   return <button onMouseEnter={handleMouseEnter}>View Issue</button>
+ * }
+ * ```
+ */
+export const useStoreRegistry = (override?: StoreRegistry) => {
+  if (override !== undefined) return override
+
+  const storeRegistry = React.use(StoreRegistryContext)
+
+  if (storeRegistry == null) throw new Error('useStoreRegistry() must be used within <StoreRegistryProvider>')
+
+  return storeRegistry
+}

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

@@ -8,6 +8,9 @@ exports[`useClientDocument > otel > should update the data based on component ke
     "storeId": "default",
   },
   "children": [
+    {
+      "_name": "makeClientSessionSyncProcessor",
+    },
     {
       "_name": "livestore.in-memory-db:execute",
       "attributes": {
@@ -21,29 +24,25 @@ exports[`useClientDocument > otel > should update the data based on component ke
       },
     },
     {
-      "_name": "@livestore/common:LeaderSyncProcessor:push",
-      "attributes": {
-        "batch": "undefined",
-        "batchSize": 1,
-      },
-    },
-    {
-      "_name": "@livestore/common:LeaderSyncProcessor:push",
-      "attributes": {
-        "batch": "undefined",
-        "batchSize": 1,
-      },
-    },
-    {
-      "_name": "client-session-sync-processor:pull",
-      "attributes": {
-        "code.stacktrace": "<STACKTRACE>",
-        "span.label": "⚠︎ Interrupted",
-        "status.interrupted": true,
-      },
-    },
-    {
-      "_name": "LiveStore:sync",
+      "_name": "client-session-sync-processor:boot",
+      "children": [
+        {
+          "_name": "client-session-sync-processor:pull",
+          "attributes": {
+            "span.label": "⚠︎ Interrupted",
+            "status.interrupted": true,
+          },
+        },
+        {
+          "_name": "@livestore/common:LeaderSyncProcessor:push",
+          "attributes": {
+            "batch": "undefined",
+            "batchSize": 1,
+            "span.label": "⚠︎ Interrupted",
+            "status.interrupted": true,
+          },
+        },
+      ],
     },
     {
       "_name": "LiveStore:commits",
@@ -194,14 +193,10 @@ exports[`useClientDocument > otel > should update the data based on component ke
     },
     "children": [
       {
-        "_name": "client-session-sync-processor:push",
-        "attributes": {
-          "batchSize": 1,
-          "eventCounts": "{
-  "UserInfoSet": 1
-}",
-          "mergeResultTag": "advance",
-        },
+        "_name": "client-session-sync-processor:encode-events",
+      },
+      {
+        "_name": "client-session-sync-processor:materialize-events",
         "children": [
           {
             "_name": "client-session-sync-processor:materialize-event",
@@ -216,10 +211,33 @@ exports[`useClientDocument > otel > should update the data based on component ke
     ",
                 },
               },
+              {
+                "_name": "@livestore/common:execSql",
+                "attributes": {
+                  "bindValueKeys": "[
+  "$id",
+  "$seqNumGlobal",
+  "$seqNumClient",
+  "$seqNumRebaseGeneration"
+]",
+                  "span.label": "INSERT OR REPLACE INTO __livestore_state_head (id, seqNumGlobal, seqNumClient, seqNumRebaseGeneration) VALUES ($id, $seqNumGlobal, $seqNumClient, $seqNumRebaseGeneration)",
+                  "sql": "INSERT OR REPLACE INTO __livestore_state_head (id, seqNumGlobal, seqNumClient, seqNumRebaseGeneration) VALUES ($id, $seqNumGlobal, $seqNumClient, $seqNumRebaseGeneration)",
+                },
+              },
             ],
           },
         ],
       },
+      {
+        "_name": "client-session-sync-processor:push",
+        "attributes": {
+          "batchSize": 1,
+          "eventCounts": "{
+  "UserInfoSet": 1
+}",
+          "mergeResultTag": "advance",
+        },
+      },
     ],
   },
   {
@@ -232,14 +250,10 @@ exports[`useClientDocument > otel > should update the data based on component ke
     },
     "children": [
       {
-        "_name": "client-session-sync-processor:push",
-        "attributes": {
-          "batchSize": 1,
-          "eventCounts": "{
-  "UserInfoSet": 1
-}",
-          "mergeResultTag": "advance",
-        },
+        "_name": "client-session-sync-processor:encode-events",
+      },
+      {
+        "_name": "client-session-sync-processor:materialize-events",
         "children": [
           {
             "_name": "client-session-sync-processor:materialize-event",
@@ -254,10 +268,33 @@ exports[`useClientDocument > otel > should update the data based on component ke
     ",
                 },
               },
+              {
+                "_name": "@livestore/common:execSql",
+                "attributes": {
+                  "bindValueKeys": "[
+  "$id",
+  "$seqNumGlobal",
+  "$seqNumClient",
+  "$seqNumRebaseGeneration"
+]",
+                  "span.label": "INSERT OR REPLACE INTO __livestore_state_head (id, seqNumGlobal, seqNumClient, seqNumRebaseGeneration) VALUES ($id, $seqNumGlobal, $seqNumClient, $seqNumRebaseGeneration)",
+                  "sql": "INSERT OR REPLACE INTO __livestore_state_head (id, seqNumGlobal, seqNumClient, seqNumRebaseGeneration) VALUES ($id, $seqNumGlobal, $seqNumClient, $seqNumRebaseGeneration)",
+                },
+              },
             ],
           },
         ],
       },
+      {
+        "_name": "client-session-sync-processor:push",
+        "attributes": {
+          "batchSize": 1,
+          "eventCounts": "{
+  "UserInfoSet": 1
+}",
+          "mergeResultTag": "advance",
+        },
+      },
     ],
   },
 ]
@@ -271,6 +308,9 @@ exports[`useClientDocument > otel > should update the data based on component ke
     "storeId": "default",
   },
   "children": [
+    {
+      "_name": "makeClientSessionSyncProcessor",
+    },
     {
       "_name": "livestore.in-memory-db:execute",
       "attributes": {
@@ -284,29 +324,25 @@ exports[`useClientDocument > otel > should update the data based on component ke
       },
     },
     {
-      "_name": "@livestore/common:LeaderSyncProcessor:push",
-      "attributes": {
-        "batch": "undefined",
-        "batchSize": 1,
-      },
-    },
-    {
-      "_name": "@livestore/common:LeaderSyncProcessor:push",
-      "attributes": {
-        "batch": "undefined",
-        "batchSize": 1,
-      },
-    },
-    {
-      "_name": "client-session-sync-processor:pull",
-      "attributes": {
-        "code.stacktrace": "<STACKTRACE>",
-        "span.label": "⚠︎ Interrupted",
-        "status.interrupted": true,
-      },
-    },
-    {
-      "_name": "LiveStore:sync",
+      "_name": "client-session-sync-processor:boot",
+      "children": [
+        {
+          "_name": "client-session-sync-processor:pull",
+          "attributes": {
+            "span.label": "⚠︎ Interrupted",
+            "status.interrupted": true,
+          },
+        },
+        {
+          "_name": "@livestore/common:LeaderSyncProcessor:push",
+          "attributes": {
+            "batch": "undefined",
+            "batchSize": 1,
+            "span.label": "⚠︎ Interrupted",
+            "status.interrupted": true,
+          },
+        },
+      ],
     },
     {
       "_name": "LiveStore:commits",
@@ -395,14 +431,10 @@ exports[`useClientDocument > otel > should update the data based on component ke
     },
     "children": [
       {
-        "_name": "client-session-sync-processor:push",
-        "attributes": {
-          "batchSize": 1,
-          "eventCounts": "{
-  "UserInfoSet": 1
-}",
-          "mergeResultTag": "advance",
-        },
+        "_name": "client-session-sync-processor:encode-events",
+      },
+      {
+        "_name": "client-session-sync-processor:materialize-events",
         "children": [
           {
             "_name": "client-session-sync-processor:materialize-event",
@@ -417,10 +449,33 @@ exports[`useClientDocument > otel > should update the data based on component ke
     ",
                 },
               },
+              {
+                "_name": "@livestore/common:execSql",
+                "attributes": {
+                  "bindValueKeys": "[
+  "$id",
+  "$seqNumGlobal",
+  "$seqNumClient",
+  "$seqNumRebaseGeneration"
+]",
+                  "span.label": "INSERT OR REPLACE INTO __livestore_state_head (id, seqNumGlobal, seqNumClient, seqNumRebaseGeneration) VALUES ($id, $seqNumGlobal, $seqNumClient, $seqNumRebaseGeneration)",
+                  "sql": "INSERT OR REPLACE INTO __livestore_state_head (id, seqNumGlobal, seqNumClient, seqNumRebaseGeneration) VALUES ($id, $seqNumGlobal, $seqNumClient, $seqNumRebaseGeneration)",
+                },
+              },
             ],
           },
         ],
       },
+      {
+        "_name": "client-session-sync-processor:push",
+        "attributes": {
+          "batchSize": 1,
+          "eventCounts": "{
+  "UserInfoSet": 1
+}",
+          "mergeResultTag": "advance",
+        },
+      },
     ],
   },
   {
@@ -433,14 +488,10 @@ exports[`useClientDocument > otel > should update the data based on component ke
     },
     "children": [
       {
-        "_name": "client-session-sync-processor:push",
-        "attributes": {
-          "batchSize": 1,
-          "eventCounts": "{
-  "UserInfoSet": 1
-}",
-          "mergeResultTag": "advance",
-        },
+        "_name": "client-session-sync-processor:encode-events",
+      },
+      {
+        "_name": "client-session-sync-processor:materialize-events",
         "children": [
           {
             "_name": "client-session-sync-processor:materialize-event",
@@ -455,10 +506,33 @@ exports[`useClientDocument > otel > should update the data based on component ke
     ",
                 },
               },
+              {
+                "_name": "@livestore/common:execSql",
+                "attributes": {
+                  "bindValueKeys": "[
+  "$id",
+  "$seqNumGlobal",
+  "$seqNumClient",
+  "$seqNumRebaseGeneration"
+]",
+                  "span.label": "INSERT OR REPLACE INTO __livestore_state_head (id, seqNumGlobal, seqNumClient, seqNumRebaseGeneration) VALUES ($id, $seqNumGlobal, $seqNumClient, $seqNumRebaseGeneration)",
+                  "sql": "INSERT OR REPLACE INTO __livestore_state_head (id, seqNumGlobal, seqNumClient, seqNumRebaseGeneration) VALUES ($id, $seqNumGlobal, $seqNumClient, $seqNumRebaseGeneration)",
+                },
+              },
             ],
           },
         ],
       },
+      {
+        "_name": "client-session-sync-processor:push",
+        "attributes": {
+          "batchSize": 1,
+          "eventCounts": "{
+  "UserInfoSet": 1
+}",
+          "mergeResultTag": "advance",
+        },
+      },
     ],
   },
 ]

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

@@ -101,7 +101,7 @@ exports[`useQuery (strictMode={ strictMode: false }) > filtered dependency query
       },
       "previousResult": {
         "_tag": "Some",
-        "value": "{"query":"SELECT * FROM 'todos' WHERE id = ?","bindValues":["t1"],"queriedTables":{}}",
+        "value": "{"query":"SELECT * FROM 'todos' WHERE \\"id\\" = ?","bindValues":["t1"],"queriedTables":{}}",
       },
       "recomputations": 1,
       "sub": [
@@ -158,7 +158,7 @@ exports[`useQuery (strictMode={ strictMode: false }) > filtered dependency query
       "id": "node-9",
       "invocations": 1,
       "isDestroyed": false,
-      "label": "subscribe:SELECT * FROM 'todos' WHERE id = ?",
+      "label": "subscribe:SELECT * FROM 'todos' WHERE "id" = ?",
       "sub": [
         "node-7",
       ],
@@ -268,7 +268,7 @@ exports[`useQuery (strictMode={ strictMode: false }) > filtered dependency query
       },
       "previousResult": {
         "_tag": "Some",
-        "value": "{"query":"SELECT * FROM 'todos' WHERE id = ?","bindValues":["t1"],"queriedTables":{}}",
+        "value": "{"query":"SELECT * FROM 'todos' WHERE \\"id\\" = ?","bindValues":["t1"],"queriedTables":{}}",
       },
       "recomputations": 1,
       "sub": [
@@ -325,7 +325,7 @@ exports[`useQuery (strictMode={ strictMode: false }) > filtered dependency query
       "id": "node-9",
       "invocations": 2,
       "isDestroyed": false,
-      "label": "subscribe:SELECT * FROM 'todos' WHERE id = ?",
+      "label": "subscribe:SELECT * FROM 'todos' WHERE "id" = ?",
       "sub": [
         "node-7",
       ],
@@ -435,7 +435,7 @@ exports[`useQuery (strictMode={ strictMode: false }) > filtered dependency query
       },
       "previousResult": {
         "_tag": "Some",
-        "value": "{"query":"SELECT * FROM 'todos' WHERE id = ?","bindValues":["t2"],"queriedTables":{}}",
+        "value": "{"query":"SELECT * FROM 'todos' WHERE \\"id\\" = ?","bindValues":["t2"],"queriedTables":{}}",
       },
       "recomputations": 2,
       "sub": [
@@ -492,7 +492,7 @@ exports[`useQuery (strictMode={ strictMode: false }) > filtered dependency query
       "id": "node-9",
       "invocations": 3,
       "isDestroyed": false,
-      "label": "subscribe:SELECT * FROM 'todos' WHERE id = ?",
+      "label": "subscribe:SELECT * FROM 'todos' WHERE "id" = ?",
       "sub": [
         "node-7",
       ],
@@ -1242,7 +1242,7 @@ exports[`useQuery (strictMode={ strictMode: true }) > filtered dependency query
       },
       "previousResult": {
         "_tag": "Some",
-        "value": "{"query":"SELECT * FROM 'todos' WHERE id = ?","bindValues":["t1"],"queriedTables":{}}",
+        "value": "{"query":"SELECT * FROM 'todos' WHERE \\"id\\" = ?","bindValues":["t1"],"queriedTables":{}}",
       },
       "recomputations": 1,
       "sub": [
@@ -1299,7 +1299,7 @@ exports[`useQuery (strictMode={ strictMode: true }) > filtered dependency query
       "id": "node-9",
       "invocations": 1,
       "isDestroyed": false,
-      "label": "subscribe:SELECT * FROM 'todos' WHERE id = ?",
+      "label": "subscribe:SELECT * FROM 'todos' WHERE "id" = ?",
       "sub": [
         "node-7",
       ],
@@ -1409,7 +1409,7 @@ exports[`useQuery (strictMode={ strictMode: true }) > filtered dependency query
       },
       "previousResult": {
         "_tag": "Some",
-        "value": "{"query":"SELECT * FROM 'todos' WHERE id = ?","bindValues":["t1"],"queriedTables":{}}",
+        "value": "{"query":"SELECT * FROM 'todos' WHERE \\"id\\" = ?","bindValues":["t1"],"queriedTables":{}}",
       },
       "recomputations": 1,
       "sub": [
@@ -1466,7 +1466,7 @@ exports[`useQuery (strictMode={ strictMode: true }) > filtered dependency query
       "id": "node-9",
       "invocations": 2,
       "isDestroyed": false,
-      "label": "subscribe:SELECT * FROM 'todos' WHERE id = ?",
+      "label": "subscribe:SELECT * FROM 'todos' WHERE "id" = ?",
       "sub": [
         "node-7",
       ],
@@ -1576,7 +1576,7 @@ exports[`useQuery (strictMode={ strictMode: true }) > filtered dependency query
       },
       "previousResult": {
         "_tag": "Some",
-        "value": "{"query":"SELECT * FROM 'todos' WHERE id = ?","bindValues":["t2"],"queriedTables":{}}",
+        "value": "{"query":"SELECT * FROM 'todos' WHERE \\"id\\" = ?","bindValues":["t2"],"queriedTables":{}}",
       },
       "recomputations": 2,
       "sub": [
@@ -1633,7 +1633,7 @@ exports[`useQuery (strictMode={ strictMode: true }) > filtered dependency query
       "id": "node-9",
       "invocations": 3,
       "isDestroyed": false,
-      "label": "subscribe:SELECT * FROM 'todos' WHERE id = ?",
+      "label": "subscribe:SELECT * FROM 'todos' WHERE "id" = ?",
       "sub": [
         "node-7",
       ],