vike-react 0.4.2 → 0.4.3

package/dist/+config.d.ts

@@ -0,0 +1,64 @@
+export { config };
+import { ssrEffect } from './renderer/ssrEffect.js';
+import './types/index.js';
+declare const config: {
+    onRenderHtml: "import:vike-react/renderer/onRenderHtml:onRenderHtml";
+    onRenderClient: "import:vike-react/renderer/onRenderClient:onRenderClient";
+    passToClient: string[];
+    clientRouting: true;
+    hydrationCanBeAborted: true;
+    meta: {
+        Head: {
+            env: {
+                server: true;
+            };
+        };
+        Layout: {
+            env: {
+                server: true;
+                client: true;
+            };
+        };
+        title: {
+            env: {
+                server: true;
+                client: true;
+            };
+        };
+        favicon: {
+            env: {
+                server: true;
+                client: true;
+            };
+        };
+        lang: {
+            env: {
+                server: true;
+                client: true;
+            };
+        };
+        ssr: {
+            env: {
+                config: true;
+            };
+            effect: typeof ssrEffect;
+        };
+        stream: {
+            env: {
+                server: true;
+            };
+        };
+        VikeReactQueryWrapper: {
+            env: {
+                client: true;
+                server: true;
+            };
+        };
+        Wrapper: {
+            env: {
+                client: true;
+                server: true;
+            };
+        };
+    };
+};

package/dist/{renderer/+config.js → +config.js}

@@ -1,24 +1,9 @@
-// Depending on the value of `config.meta.ssr`, set other config options' `env`
-// accordingly.
-// See https://vike.dev/meta#:~:text=Modifying%20the%20environment%20of%20existing%20hooks
-const toggleSsrRelatedConfig = ({ configDefinedAt, configValue }) => {
-    if (typeof configValue !== 'boolean') {
-        throw new Error(`${configDefinedAt} should be a boolean`);
-    }
-    return {
-        meta: {
-            // When the SSR flag is false, we want to render the page only in the
-            // browser. We achieve this by then making the `Page` implementation
-            // accessible only in the client's renderer.
-            Page: {
-                env: configValue
-                    ? { server: true, client: true } // default
-                    : { client: true }
-            }
-        }
-    };
-};
-export default {
+export { config };
+import { isNotFalse } from './utils/isNotFalse.js';
+import { ssrEffect } from './renderer/ssrEffect.js';
+// This is required to make TypeScript load the global interfaces such as Vike.PageContext so that they're always loaded: we can assume that the user always imports this file over `import vikeReact from 'vike-react/config'`
+import './types/index.js';
+const config = {
     // https://vike.dev/onRenderHtml
     onRenderHtml: 'import:vike-react/renderer/onRenderHtml:onRenderHtml',
     // https://vike.dev/onRenderClient
@@ -49,7 +34,7 @@ export default {
         },
         ssr: {
             env: { config: true },
-            effect: toggleSsrRelatedConfig
+            effect: ssrEffect
         },
         stream: {
             env: { server: true }
@@ -62,6 +47,3 @@ export default {
         }
     }
 };
-function isNotFalse(val) {
-    return val !== false;
-}

package/dist/hooks/useData.d.ts

@@ -0,0 +1,2 @@
+export { useData };
+declare function useData<Data>(): Data;

package/dist/hooks/useData.js

@@ -0,0 +1,6 @@
+export { useData };
+import { usePageContext } from './usePageContext.js';
+function useData() {
+    const { data } = usePageContext();
+    return data;
+}

package/dist/{renderer/PageContextProvider.d.ts → hooks/usePageContext.d.ts}

@@ -1,6 +1,5 @@
-export { PageContextProvider };
 export { usePageContext };
-export { useData };
+export { PageContextProvider };
 import React from 'react';
 import type { PageContext } from 'vike/types';
 declare function PageContextProvider({ pageContext, children }: {
@@ -9,4 +8,3 @@ declare function PageContextProvider({ pageContext, children }: {
 }): React.JSX.Element;
 /** Access the pageContext from any React component */
 declare function usePageContext(): PageContext;
-declare function useData<Data>(): Data;

package/dist/{renderer/PageContextProvider.js → hooks/usePageContext.js}

@@ -1,9 +1,8 @@
-export { PageContextProvider };
 export { usePageContext };
-export { useData };
+export { PageContextProvider };
 import React, { useContext } from 'react';
-import { getGlobalObject } from './utils/getGlobalObject.js';
-import { assert } from './utils/assert.js';
+import { getGlobalObject } from '../utils/getGlobalObject.js';
+import { assert } from '../utils/assert.js';
 const globalObject = getGlobalObject('PageContextProvider.ts', {
     reactContext: React.createContext(undefined)
 });
@@ -22,7 +21,3 @@ function usePageContext() {
     assert(pageContext);
     return pageContext;
 }
-function useData() {
-    const { data } = usePageContext();
-    return data;
-}

package/dist/index.d.ts

@@ -0,0 +1 @@
+export { config } from './+config.js';

package/dist/index.js

@@ -0,0 +1,3 @@
+// TODO/next-major-release: remove this file/export
+console.warn("[vike-react][warning][deprecation] Replace `import vikeReact from 'vike-react'` with `import vikeReact from 'vike-react/config'");
+export { config } from './+config.js';

package/dist/renderer/getHeadSetting.js

@@ -1,5 +1,5 @@
 export { getHeadSetting };
-import { isCallable } from './utils/isCallable.js';
+import { isCallable } from '../utils/isCallable.js';
 function getHeadSetting(headSetting, pageContext) {
     const config = pageContext.configEntries[headSetting]?.[0];
     if (!config)

package/dist/renderer/getPageElement.js

@@ -1,6 +1,6 @@
 export { getPageElement };
 import React from 'react';
-import { PageContextProvider } from './PageContextProvider.js';
+import { PageContextProvider } from '../hooks/usePageContext.js';
 function getPageElement(pageContext) {
     const Layout = pageContext.config.Layout ?? PassThrough;
     const Wrapper = pageContext.config.Wrapper ?? PassThrough;

package/dist/renderer/onRenderHtml.js

@@ -5,7 +5,7 @@ import { renderToStream } from 'react-streaming/server';
 import { escapeInject, dangerouslySkipEscape, version } from 'vike/server';
 import { getHeadSetting } from './getHeadSetting.js';
 import { getPageElement } from './getPageElement.js';
-import { PageContextProvider } from './PageContextProvider.js';
+import { PageContextProvider } from '../hooks/usePageContext.js';
 import React from 'react';
 checkVikeVersion();
 const onRenderHtml = async (pageContext) => {
@@ -40,7 +40,6 @@ const onRenderHtml = async (pageContext) => {
       <body>
         <div id="page-view">${pageView}</div>
       </body>
-      <!-- built with https://github.com/vikejs/vike-react -->
     </html>`;
     return documentHtml;
 };

package/dist/renderer/ssrEffect.d.ts

@@ -0,0 +1,3 @@
+export { ssrEffect };
+import type { ConfigEffect } from 'vike/types';
+declare function ssrEffect({ configDefinedAt, configValue }: Parameters<ConfigEffect>[0]): ReturnType<ConfigEffect>;

package/dist/renderer/ssrEffect.js

@@ -0,0 +1,19 @@
+export { ssrEffect };
+function ssrEffect({ configDefinedAt, configValue }) {
+    if (typeof configValue !== 'boolean')
+        throw new Error(`${configDefinedAt} should be a boolean`);
+    return {
+        meta: {
+            Page: {
+                env: {
+                    // Always load `Page` on the client-side.
+                    client: true,
+                    // When the SSR flag is false, we want to render the page only on the client-side.
+                    // We achieve this by loading `Page` only on the client-side: when onRenderHtml()
+                    // gets a `Page` value that is undefined it skip server-side rendering.
+                    server: configValue !== false
+                }
+            }
+        }
+    };
+}

package/dist/types/Config.d.ts

@@ -0,0 +1,46 @@
+declare global {
+    namespace VikePackages {
+        interface ConfigVikeReact {
+            /** The page's root React component */
+            Page?: () => React.ReactNode;
+            /** React element rendered and appended into <head></head> */
+            Head?: () => React.ReactNode;
+            /** A component, usually common to several pages, that wraps the root component `Page` */
+            Layout?: (props: {
+                children: React.ReactNode;
+            }) => React.ReactNode;
+            /** <title>${title}</title> */
+            title?: string;
+            /** <link rel="icon" href="${favicon}" /> */
+            favicon?: string;
+            /** <html lang="${lang}">
+             *
+             *  @default 'en'
+             *
+             */
+            lang?: string;
+            /**
+             * If true, render mode is SSR or pre-rendering (aka SSG). In other words, the
+             * page's HTML will be rendered at build-time or request-time.
+             * If false, render mode is SPA. In other words, the page will only be
+             * rendered in the browser.
+             *
+             * See https://vike.dev/render-modes
+             *
+             * @default true
+             *
+             */
+            ssr?: boolean;
+            /**
+             * Whether to stream the page's HTML. Requires Server-Side Rendering (`ssr: true`).
+             *
+             * @default false
+             *
+             */
+            stream?: boolean;
+            VikeReactQueryWrapper?: React.ReactNode;
+            Wrapper?: () => React.ReactNode;
+        }
+    }
+}
+export {};

package/dist/types/Config.js

@@ -0,0 +1 @@
+export {};

package/dist/types/PageContext.d.ts

@@ -0,0 +1,9 @@
+declare global {
+    namespace Vike {
+        interface PageContext {
+            Page?: () => React.ReactNode;
+            userAgent?: string;
+        }
+    }
+}
+export {};

package/dist/types/PageContext.js

@@ -0,0 +1 @@
+export {};

package/dist/types/index.d.ts

@@ -0,0 +1,2 @@
+import './PageContext.js';
+import './Config.js';

package/dist/types/index.js

@@ -0,0 +1,2 @@
+import './PageContext.js';
+import './Config.js';

package/dist/{renderer/utils → utils}/getGlobalObject.d.ts

@@ -1,4 +1 @@
 export declare function getGlobalObject<T extends Record<string, unknown> = never>(key: `${string}.ts`, defaultValue: T): T;
-declare global {
-    var __vite_plugin_ssr: undefined | Record<string, Record<string, unknown>>;
-}

package/dist/utils/getGlobalObject.js

@@ -0,0 +1,9 @@
+export function getGlobalObject(
+// We use the filename as key; each `getGlobalObject()` call should live inside a file with a unique filename.
+key, defaultValue) {
+    // @ts-ignore
+    const globalObjectsAll = (globalThis[projectKey] = globalThis[projectKey] || {});
+    const globalObject = (globalObjectsAll[key] = globalObjectsAll[key] || defaultValue);
+    return globalObject;
+}
+const projectKey = '_vike_react';

package/dist/utils/isNotFalse.d.ts

@@ -0,0 +1 @@
+export declare function isNotFalse<T>(val: T | false): val is T;

package/dist/utils/isNotFalse.js

@@ -0,0 +1,3 @@
+export function isNotFalse(val) {
+    return val !== false;
+}

package/package.json

@@ -1,16 +1,17 @@
 {
   "name": "vike-react",
-  "version": "0.4.2",
+  "version": "0.4.3",
   "type": "module",
-  "main": "./dist/renderer/+config.js",
-  "types": "./dist/renderer/+config.d.ts",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
   "exports": {
-    ".": "./dist/renderer/+config.js",
+    "./useData": "./dist/hooks/useData.js",
+    "./usePageContext": "./dist/hooks/usePageContext.js",
+    "./ClientOnly": "./dist/components/ClientOnly.js",
+    ".": "./dist/index.js",
+    "./config": "./dist/+config.js",
     "./renderer/onRenderHtml": "./dist/renderer/onRenderHtml.js",
-    "./renderer/onRenderClient": "./dist/renderer/onRenderClient.js",
-    "./usePageContext": "./dist/components/usePageContext.js",
-    "./useData": "./dist/components/useData.js",
-    "./ClientOnly": "./dist/components/ClientOnly.js"
+    "./renderer/onRenderClient": "./dist/renderer/onRenderClient.js"
   },
   "scripts": {
     "dev": "tsc --watch",
@@ -22,7 +23,7 @@
   "peerDependencies": {
     "react": "18.x.x",
     "react-dom": "18.x.x",
-    "vike": "^0.4.159",
+    "vike": "^0.4.160",
     "vite": "^4.3.8 || ^5.0.10"
   },
   "devDependencies": {
@@ -33,21 +34,27 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "typescript": "^5.3.3",
-    "vike": "^0.4.159"
+    "vike": "^0.4.160"
   },
   "dependencies": {
     "react-streaming": "^0.3.19"
   },
   "typesVersions": {
     "*": {
-      ".": [
-        "./dist/renderer/+config.d.ts"
+      "useData": [
+        "./dist/hooks/useData.d.ts"
       ],
       "usePageContext": [
-        "./dist/components/usePageContext.d.ts"
+        "./dist/hooks/usePageContext.d.ts"
       ],
-      "useData": [
-        "./dist/components/useData.d.ts"
+      "ClientOnly": [
+        "./dist/components/ClientOnly.d.ts"
+      ],
+      ".": [
+        "./dist/index.d.ts"
+      ],
+      "config": [
+        "./dist/+config.d.ts"
       ],
       "renderer/onRenderHtml": [
         "./dist/renderer/onRenderHtml.d.ts"
@@ -58,8 +65,7 @@
     }
   },
   "files": [
-    "dist/",
-    "types.d.ts"
+    "dist/"
   ],
   "repository": "github:vikejs/vike-react",
   "license": "MIT"

package/dist/components/useData.d.ts

@@ -1 +0,0 @@
-export { useData } from '../renderer/PageContextProvider.js';

package/dist/components/useData.js

@@ -1 +0,0 @@
-export { useData } from '../renderer/PageContextProvider.js';

package/dist/components/usePageContext.d.ts

@@ -1 +0,0 @@
-export { usePageContext } from '../renderer/PageContextProvider.js';

package/dist/components/usePageContext.js

@@ -1 +0,0 @@
-export { usePageContext } from '../renderer/PageContextProvider.js';

package/dist/renderer/+config.d.ts

@@ -1,107 +0,0 @@
-import type { ConfigEffect } from 'vike/types';
-declare const _default: {
-    onRenderHtml: "import:vike-react/renderer/onRenderHtml:onRenderHtml";
-    onRenderClient: "import:vike-react/renderer/onRenderClient:onRenderClient";
-    passToClient: string[];
-    clientRouting: true;
-    hydrationCanBeAborted: true;
-    meta: {
-        Head: {
-            env: {
-                server: true;
-            };
-        };
-        Layout: {
-            env: {
-                server: true;
-                client: true;
-            };
-        };
-        title: {
-            env: {
-                server: true;
-                client: true;
-            };
-        };
-        favicon: {
-            env: {
-                server: true;
-                client: true;
-            };
-        };
-        lang: {
-            env: {
-                server: true;
-                client: true;
-            };
-        };
-        ssr: {
-            env: {
-                config: true;
-            };
-            effect: ConfigEffect;
-        };
-        stream: {
-            env: {
-                server: true;
-            };
-        };
-        VikeReactQueryWrapper: {
-            env: {
-                client: true;
-                server: true;
-            };
-        };
-        Wrapper: {
-            env: {
-                client: true;
-                server: true;
-            };
-        };
-    };
-};
-export default _default;
-import type { Component } from './types.d.ts';
-declare global {
-    namespace VikePackages {
-        interface ConfigVikeReact {
-            /** The page's root React component */
-            Page?: Component;
-            /** React element rendered and appended into <head></head> */
-            Head?: Component;
-            /** A component, usually common to several pages, that wraps the root component `Page` */
-            Layout?: Component;
-            /** <title>${title}</title> */
-            title?: string;
-            /** <link rel="icon" href="${favicon}" /> */
-            favicon?: string;
-            /** <html lang="${lang}">
-             *
-             *  @default 'en'
-             *
-             */
-            lang?: string;
-            /**
-             * If true, render mode is SSR or pre-rendering (aka SSG). In other words, the
-             * page's HTML will be rendered at build-time or request-time.
-             * If false, render mode is SPA. In other words, the page will only be
-             * rendered in the browser.
-             *
-             * See https://vike.dev/render-modes
-             *
-             * @default true
-             *
-             */
-            ssr?: boolean;
-            /**
-             * Whether to stream the page's HTML. Requires Server-Side Rendering (`ssr: true`).
-             *
-             * @default false
-             *
-             */
-            stream?: boolean;
-            VikeReactQueryWrapper?: Component;
-            Wrapper?: Component;
-        }
-    }
-}

package/dist/renderer/utils/getGlobalObject.js

@@ -1,7 +0,0 @@
-export function getGlobalObject(
-// We use the filename as key; each `getGlobalObject()` call should live in a unique filename.
-key, defaultValue) {
-    const allGlobalObjects = (globalThis.__vite_plugin_ssr = globalThis.__vite_plugin_ssr || {});
-    const globalObject = (allGlobalObjects[key] = allGlobalObjects[key] || defaultValue);
-    return globalObject;
-}