vike-react 0.4.12 → 0.4.14

package/dist/+config.d.ts

@@ -21,6 +21,7 @@ declare const _default: {
                 server: true;
                 client: true;
             };
+            cumulative: true;
         };
         title: {
             env: {
@@ -66,13 +67,8 @@ declare const _default: {
                 client: true;
             };
         };
-        VikeReactQueryWrapper: {
-            env: {
-                client: true;
-                server: true;
-            };
-        };
         Wrapper: {
+            cumulative: true;
             env: {
                 client: true;
                 server: true;

package/dist/+config.js

@@ -24,7 +24,8 @@ export default {
             env: { server: true }
         },
         Layout: {
-            env: { server: true, client: true }
+            env: { server: true, client: true },
+            cumulative: true
         },
         title: {
             env: { server: true, client: true }
@@ -51,10 +52,8 @@ export default {
         onAfterRenderClient: {
             env: { client: true }
         },
-        VikeReactQueryWrapper: {
-            env: { client: true, server: true }
-        },
         Wrapper: {
+            cumulative: true,
             env: { client: true, server: true }
         },
         // Vike already defines the setting 'name', but we redundantly define it here for older Vike versions (otherwise older Vike versions will complain that 'name` is an unknown config). TODO/eventually: remove this once <=0.4.172 versions become rare (also because we use the `require` setting starting from `0.4.173`).

package/dist/renderer/getPageElement.js

@@ -2,19 +2,19 @@ export { getPageElement };
 import React from 'react';
 import { PageContextProvider } from '../hooks/usePageContext.js';
 function getPageElement(pageContext) {
-    const Layout = pageContext.config.Layout ?? PassThrough;
-    const Wrapper = pageContext.config.Wrapper ?? PassThrough;
-    const VikeReactQueryWrapper = pageContext.config.VikeReactQueryWrapper ?? PassThrough;
     const { Page } = pageContext;
-    let page = (React.createElement(PageContextProvider, { pageContext: pageContext },
-        React.createElement(VikeReactQueryWrapper, { pageContext: pageContext },
-            React.createElement(Wrapper, null,
-                React.createElement(Layout, null, Page ? React.createElement(Page, null) : null)))));
+    let page = Page ? React.createElement(Page, null) : null;
+    [
+        // Inner wrapping
+        ...(pageContext.config.Layout || []),
+        // Outer wrapping
+        ...(pageContext.config.Wrapper || [])
+    ].forEach((Wrapper) => {
+        page = React.createElement(Wrapper, null, page);
+    });
+    page = React.createElement(PageContextProvider, { pageContext: pageContext }, page);
     if (pageContext.config.reactStrictMode !== false) {
         page = React.createElement(React.StrictMode, null, page);
     }
     return page;
 }
-function PassThrough({ children }) {
-    return React.createElement(React.Fragment, null, children);
-}

package/dist/types/Config.d.ts

@@ -1,4 +1,4 @@
-import type { PageContextClient } from 'vike/types';
+import type { ImportString, PageContextClient } from 'vike/types';
 declare global {
     namespace Vike {
         interface Config {
@@ -9,21 +9,17 @@ declare global {
             /**
              * A component that defines the visual layout of the page common to several pages.
              *
-             * Technically: the `<Layou>` component wraps the root component `<Page>`.
+             * Technically: the `<Layout>` component wraps the root component `<Page>`.
              *
              * https://vike.dev/Layout
              */
-            Layout?: (props: {
-                children: React.ReactNode;
-            }) => React.ReactNode;
+            Layout?: Layout;
             /**
              * A component wrapping the the root component `<Page>`.
              *
              * https://vike.dev/Wrapper
              */
-            Wrapper?: (props: {
-                children: React.ReactNode;
-            }) => React.ReactNode;
+            Wrapper?: Wrapper | ImportString;
             /** &lt;title>${title}&lt;/title> */
             title?: string;
             /** &lt;link rel="icon" href="${favicon}" /> */
@@ -80,7 +76,15 @@ declare global {
              * https://vike.dev/onAfterRenderClient
              */
             onAfterRenderClient?: (pageContext: PageContextClient) => void;
-            VikeReactQueryWrapper?: React.ReactNode;
+        }
+        interface ConfigResolved {
+            Wrapper?: Wrapper[];
+            Layout?: Layout[];
         }
     }
 }
+type Wrapper = (props: {
+    children: React.ReactNode;
+}) => React.ReactNode;
+type Layout = Wrapper;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vike-react",
-  "version": "0.4.12",
+  "version": "0.4.14",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",