cumulative wrapper

examples/zustand/package.json

@@ -13,7 +13,7 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "typescript": "^5.3.3",
-    "vike": "^0.4.151",
+    "vike": "^0.4.168",
     "vike-react": "workspace:*",
     "vike-react-zustand": "workspace:*",
     "vite": "^5.0.10",

packages/vike-react-zustand/package.json

@@ -7,7 +7,7 @@
   "exports": {
     ".": "./dist/index.js",
     "./config": "./dist/renderer/+config.js",
-    "./renderer/VikeReactZustandWrapper": "./dist/renderer/VikeReactZustandWrapper.js",
+    "./renderer/Wrapper": "./dist/renderer/Wrapper.js",
     "./plugin": "./dist/plugin.js"
   },
   "scripts": {
@@ -36,8 +36,8 @@
     "react-dom": "^18.2.0",
     "rimraf": "^5.0.5",
     "typescript": "^5.3.3",
-    "vike": "^0.4.151",
-    "vike-react": "^0.3.8",
+    "vike": "^0.4.160",
+    "vike-react": "^0.4.4",
     "vite": "^5.0.10",
     "zustand": "^4.4.7"
   },
@@ -49,8 +49,8 @@
       "config": [
         "dist/renderer/+config.d.ts"
       ],
-      "renderer/VikeReactZustandWrapper": [
-        "dist/renderer/VikeReactZustandWrapper.d.ts"
+      "renderer/Wrapper": [
+        "dist/renderer/Wrapper.d.ts"
       ],
       "plugin": [
         "dist/plugin.d.ts"

packages/vike-react-zustand/src/renderer/+config.ts

@@ -1,6 +1,6 @@
 export default {
   // @ts-ignore Remove this ts-ignore once Vike's new version is released.
   name: 'vike-react-zustand',
-  VikeReactZustandWrapper: 'import:vike-react-zustand/renderer/VikeReactZustandWrapper:default',
+  Wrapper: 'import:vike-react-zustand/renderer/Wrapper:default',
   passToClient: ['_vikeReactZustand']
 }

packages/vike-react-zustand/src/renderer/VikeReactZustandWrapper.tsx → packages/vike-react-zustand/src/renderer/Wrapper.tsx

@@ -1,21 +1,17 @@
+import { cloneDeep, mergeWith } from 'lodash-es'
 import React, { ReactNode, useMemo } from 'react'
-import type { PageContext } from 'vike/types'
-import { getReactStoreContext, initializers_get, setPageContext } from './context.js'
-import { assert, removeFunctionsAndUndefined } from '../utils.js'
+import { usePageContext } from 'vike-react/usePageContext'
 import { create as createZustand } from 'zustand'
 import { devtools } from 'zustand/middleware'
-import { cloneDeep, mergeWith } from 'lodash-es'
+import { assert, removeFunctionsAndUndefined } from '../utils.js'
+import { getReactStoreContext, initializers_get, setPageContext } from './context.js'
 
 // Trick to make import.meta.env.SSR work direclty on Node.js (without Vite)
 // @ts-expect-error
 import.meta.env ??= { SSR: true }
 
-type VikeReactZustandWrapperProps = {
-  pageContext: PageContext
-  children: ReactNode
-}
-
-export default function VikeReactZustandWrapper({ pageContext, children }: VikeReactZustandWrapperProps) {
+export default function Wrapper({ children }: { children: ReactNode }) {
+  const pageContext = usePageContext()
   const initializers = initializers_get()
   const stores = useMemo(
     () =>