vike-react 0.4.6-commit-3a89c35 → 0.4.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -38,7 +38,7 @@ npm install vike-react
38
38
  2. Extend your existing Vike config files with `vike-react`:
39
39
 
40
40
  ```diff
41
- // /pages/+config.h.js
41
+ // /pages/+config.js
42
42
 
43
43
  +import vikeReact from 'vike-react/config'
44
44
  +
package/dist/+config.js CHANGED
@@ -3,7 +3,6 @@ import { ssrEffect } from './renderer/ssrEffect.js';
3
3
  // 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'`
4
4
  import './types/index.js';
5
5
  export default {
6
- // @ts-ignore Remove this ts-ignore once Vike's new version is released.
7
6
  name: 'vike-react',
8
7
  // https://vike.dev/onRenderHtml
9
8
  onRenderHtml: 'import:vike-react/renderer/onRenderHtml:onRenderHtml',
package/dist/index.js CHANGED
@@ -1,3 +1,3 @@
1
1
  // TODO/next-major-release: remove this file/export
2
- console.warn("[vike-react][warning][deprecation] Replace `import vikeReact from 'vike-react'` with `import vikeReact from 'vike-react/config'` (typically in your /pages/+config.h.js)");
2
+ console.warn("[vike-react][warning][deprecation] Replace `import vikeReact from 'vike-react'` with `import vikeReact from 'vike-react/config'` (typically in your /pages/+config.js)");
3
3
  export { default } from './+config.js';
@@ -6,7 +6,7 @@ import { getPageElement } from './getPageElement.js';
6
6
  let root;
7
7
  const onRenderClient = (pageContext) => {
8
8
  const page = getPageElement(pageContext);
9
- const container = document.getElementById('page-view');
9
+ const container = document.getElementById('react-root');
10
10
  if (container.innerHTML !== '' && pageContext.isHydration) {
11
11
  // First render (hydration)
12
12
  root = ReactDOM.hydrateRoot(container, page);
@@ -8,6 +8,7 @@ import { getPageElement } from './getPageElement.js';
8
8
  import { PageContextProvider } from '../hooks/usePageContext.js';
9
9
  import React from 'react';
10
10
  checkVikeVersion();
11
+ addEcosystemStamp();
11
12
  const onRenderHtml = async (pageContext) => {
12
13
  const title = getHeadSetting('title', pageContext);
13
14
  const favicon = getHeadSetting('favicon', pageContext);
@@ -38,7 +39,7 @@ const onRenderHtml = async (pageContext) => {
38
39
  ${faviconTag}
39
40
  </head>
40
41
  <body>
41
- <div id="page-view">${pageView}</div>
42
+ <div id="react-root">${pageView}</div>
42
43
  </body>
43
44
  </html>`;
44
45
  return documentHtml;
@@ -55,3 +56,9 @@ function checkVikeVersion() {
55
56
  }
56
57
  throw new Error('Update Vike to 0.4.147 or above');
57
58
  }
59
+ // Used by:
60
+ // - react-streaming (to improve error messages, see https://github.com/brillout/react-streaming/blob/70c168de1e97b9c4385a4c3002b5013f1e406341/src/utils/isVikeReactApp.ts#L4)
61
+ function addEcosystemStamp() {
62
+ const g = globalThis;
63
+ g._isVikeReactApp = true;
64
+ }
@@ -6,10 +6,24 @@ declare global {
6
6
  Page?: () => React.ReactNode;
7
7
  /** React element rendered and appended into &lt;head>&lt;/head> */
8
8
  Head?: () => React.ReactNode;
9
- /** A component, usually common to several pages, that wraps the root component `Page` */
9
+ /**
10
+ * A component that defines the visual layout of the page common to several pages.
11
+ *
12
+ * Technically: the `<Layou>` component wraps the root component `<Page>`.
13
+ *
14
+ * https://vike.dev/Layout
15
+ */
10
16
  Layout?: (props: {
11
17
  children: React.ReactNode;
12
18
  }) => React.ReactNode;
19
+ /**
20
+ * A component wrapping the the root component `<Page>`.
21
+ *
22
+ * https://vike.dev/Wrapper
23
+ */
24
+ Wrapper?: (props: {
25
+ children: React.ReactNode;
26
+ }) => React.ReactNode;
13
27
  /** &lt;title>${title}&lt;/title> */
14
28
  title?: string;
15
29
  /** &lt;link rel="icon" href="${favicon}" /> */
@@ -21,12 +35,11 @@ declare global {
21
35
  */
22
36
  lang?: string;
23
37
  /**
24
- * If true, render mode is SSR or pre-rendering (aka SSG). In other words, the
25
- * page's HTML will be rendered at build-time or request-time.
26
- * If false, render mode is SPA. In other words, the page will only be
27
- * rendered in the browser.
38
+ * If `true`, the page is rendered twice: on the server-side (to HTML) and on the client-side (hydration).
39
+ *
40
+ * If `false`, the page is rendered only once in the browser.
28
41
  *
29
- * See https://vike.dev/render-modes
42
+ * https://vike.dev/ssr
30
43
  *
31
44
  * @default true
32
45
  *
@@ -44,9 +57,6 @@ declare global {
44
57
  */
45
58
  onAfterRenderClient?: (pageContext: PageContextClient) => void;
46
59
  VikeReactQueryWrapper?: React.ReactNode;
47
- Wrapper?: (props: {
48
- children: React.ReactNode;
49
- }) => React.ReactNode;
50
60
  }
51
61
  }
52
62
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vike-react",
3
- "version": "0.4.6-commit-3a89c35",
3
+ "version": "0.4.7",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",
@@ -27,6 +27,7 @@
27
27
  "vite": "^4.3.8 || ^5.0.10"
28
28
  },
29
29
  "devDependencies": {
30
+ "@biomejs/biome": "^1.6.4",
30
31
  "@brillout/release-me": "^0.1.14",
31
32
  "@types/node": "^20.11.17",
32
33
  "@types/react": "^18.2.55",
@@ -34,10 +35,10 @@
34
35
  "react": "^18.2.0",
35
36
  "react-dom": "^18.2.0",
36
37
  "typescript": "^5.3.3",
37
- "vike": "^0.4.161"
38
+ "vike": "^0.4.168"
38
39
  },
39
40
  "dependencies": {
40
- "react-streaming": "^0.3.22"
41
+ "react-streaming": "^0.3.25"
41
42
  },
42
43
  "typesVersions": {
43
44
  "*": {