vike-react 0.6.0 → 0.6.2

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.
Files changed (9) hide show
  1. package/dist/integration/Loading.css +10 -0
  2. package/dist/integration/Loading.d.ts +1 -0
  3. package/dist/integration/Loading.js +1 -0
  4. package/dist/integration/onRenderClient.d.ts +0 -1
  5. package/dist/integration/onRenderClient.js +0 -1
  6. package/dist/integration/onRenderHtml.js +16 -7
  7. package/dist/utils/callCumulativeHooks.d.ts +2 -1
  8. package/package.json +3 -3
  9. package/dist/integration/styles.css +0 -6
package/dist/integration/Loading.css ADDED
@@ -0,0 +1,10 @@
1
+ /*
2
+ This CSS is loaded for all vike-react users, even if they don't use the <Loading> component because it's imported not directly but over depednency injection, see:
3
+ https://github.com/vikejs/vike/discussions/2340
4
+ */
5
+
6
+ @keyframes vike-react-shine {
7
+ to {
8
+ background-position-x: -200%;
9
+ }
10
+ }
package/dist/integration/Loading.d.ts CHANGED
@@ -3,4 +3,5 @@ declare const _default: {
3
3
  };
4
4
  export default _default;
5
5
  import React from 'react';
6
+ import './Loading.css';
6
7
  declare function LoadingComponent(): React.JSX.Element;
package/dist/integration/Loading.js CHANGED
@@ -2,6 +2,7 @@ export default {
2
2
  component: LoadingComponent,
3
3
  };
4
4
  import React from 'react';
5
+ import './Loading.css';
5
6
  function LoadingComponent() {
6
7
  return (React.createElement("div", { style: {
7
8
  width: '100%',
package/dist/integration/onRenderClient.d.ts CHANGED
@@ -1,4 +1,3 @@
1
1
  export { onRenderClient };
2
2
  import type { OnRenderClientAsync } from 'vike/types';
3
- import './styles.css';
4
3
  declare const onRenderClient: OnRenderClientAsync;
package/dist/integration/onRenderClient.js CHANGED
@@ -3,7 +3,6 @@ export { onRenderClient };
3
3
  import ReactDOM from 'react-dom/client';
4
4
  import { getHeadSetting } from './getHeadSetting.js';
5
5
  import { getPageElement } from './getPageElement.js';
6
- import './styles.css';
7
6
  import { callCumulativeHooks } from '../utils/callCumulativeHooks.js';
8
7
  import { applyHeadSettings } from './applyHeadSettings.js';
9
8
  import { resolveReactOptions } from './resolveReactOptions.js';
package/dist/integration/onRenderHtml.js CHANGED
@@ -9,16 +9,29 @@ import { getHeadSetting } from './getHeadSetting.js';
9
9
  import { getPageElement } from './getPageElement.js';
10
10
  import { isReactElement } from '../utils/isReactElement.js';
11
11
  import { getTagAttributesString } from '../utils/getTagAttributesString.js';
12
+ import { assert } from '../utils/assert.js';
12
13
  import { callCumulativeHooks } from '../utils/callCumulativeHooks.js';
13
14
  import { resolveReactOptions } from './resolveReactOptions.js';
14
15
  addEcosystemStamp();
15
16
  const onRenderHtml = async (pageContext) => {
16
- const pageHtml = await getPageHtml(pageContext);
17
+ await renderPageToHtml(pageContext);
17
18
  const headHtml = getHeadHtml(pageContext);
18
19
  const { bodyHtmlBegin, bodyHtmlEnd } = await getBodyHtmlBoundary(pageContext);
19
20
  const { htmlAttributesString, bodyAttributesString } = getTagAttributes(pageContext);
20
21
  // Not needed on the client-side, thus we remove it to save KBs sent to the client
21
22
  delete pageContext._configFromHook;
23
+ // pageContext.{pageHtmlString,pageHtmlStream} is set by renderPageToHtml() and can be overridden by user at onAfterRenderHtml()
24
+ let pageHtmlStringOrStream =
25
+ // Set to empty string if SSR is disabled
26
+ '';
27
+ if (pageContext.pageHtmlString) {
28
+ assert(pageContext.pageHtmlStream === undefined);
29
+ pageHtmlStringOrStream = dangerouslySkipEscape(pageContext.pageHtmlString);
30
+ }
31
+ if (pageContext.pageHtmlStream) {
32
+ assert(pageContext.pageHtmlString === undefined);
33
+ pageHtmlStringOrStream = pageContext.pageHtmlStream;
34
+ }
22
35
  return escapeInject `<!DOCTYPE html>
23
36
  <html${dangerouslySkipEscape(htmlAttributesString)}>
24
37
  <head>
@@ -27,24 +40,22 @@ const onRenderHtml = async (pageContext) => {
27
40
  </head>
28
41
  <body${dangerouslySkipEscape(bodyAttributesString)}>
29
42
  ${bodyHtmlBegin}
30
- <div id="root">${pageHtml}</div>
43
+ <div id="root">${pageHtmlStringOrStream}</div>
31
44
  ${bodyHtmlEnd}
32
45
  </body>
33
46
  </html>`;
34
47
  };
35
- async function getPageHtml(pageContext) {
48
+ async function renderPageToHtml(pageContext) {
36
49
  if (pageContext.Page)
37
50
  pageContext.page = getPageElement(pageContext).page;
38
51
  // https://github.com/vikejs/vike-react/issues/87#issuecomment-2488742744
39
52
  await callCumulativeHooks(pageContext.config.onBeforeRenderHtml, pageContext);
40
53
  const { renderToStringOptions } = resolveReactOptions(pageContext);
41
- let pageHtml = '';
42
54
  if (pageContext.page) {
43
55
  const { stream, streamIsRequired } = pageContext.config;
44
56
  if (!stream && !streamIsRequired) {
45
57
  const pageHtmlString = renderToString(pageContext.page, renderToStringOptions);
46
58
  pageContext.pageHtmlString = pageHtmlString;
47
- pageHtml = dangerouslySkipEscape(pageHtmlString);
48
59
  }
49
60
  else {
50
61
  const pageHtmlStream = await renderToStream(pageContext.page, {
@@ -56,12 +67,10 @@ async function getPageHtml(pageContext) {
56
67
  disable: stream === false ? true : undefined,
57
68
  });
58
69
  pageContext.pageHtmlStream = pageHtmlStream;
59
- pageHtml = pageHtmlStream;
60
70
  }
61
71
  }
62
72
  // https://github.com/vikejs/vike/discussions/1804#discussioncomment-10394481
63
73
  await callCumulativeHooks(pageContext.config.onAfterRenderHtml, pageContext);
64
- return pageHtml;
65
74
  }
66
75
  function getHeadHtml(pageContext) {
67
76
  pageContext._headAlreadySet = true;
package/dist/utils/callCumulativeHooks.d.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export { callCumulativeHooks };
2
- declare function callCumulativeHooks<T>(values: undefined | T[], pageContext: Record<string, any>): Promise<(undefined | null | Exclude<T, Function>)[]>;
2
+ import type { PageContext } from 'vike/types';
3
+ declare function callCumulativeHooks<T>(values: undefined | T[], pageContext: PageContext): Promise<(undefined | null | Exclude<T, Function>)[]>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vike-react",
3
- "version": "0.6.0",
3
+ "version": "0.6.2",
4
4
  "repository": "https://github.com/vikejs/vike-react",
5
5
  "type": "module",
6
6
  "exports": {
@@ -45,7 +45,7 @@
45
45
  "rimraf": "^5.0.5",
46
46
  "typescript": "^5.7.3",
47
47
  "vike": "^0.4.223",
48
- "vite": "^6.1.0"
48
+ "vite": "^6.2.5"
49
49
  },
50
50
  "typesVersions": {
51
51
  "*": {
@@ -96,7 +96,7 @@
96
96
  "scripts": {
97
97
  "dev": "tsc --watch",
98
98
  "build": "rimraf dist/ && tsc && pnpm run build:css",
99
- "build:css": "cp src/integration/styles.css dist/integration/styles.css",
99
+ "build:css": "cp src/integration/Loading.css dist/integration/Loading.css",
100
100
  "release": "release-me patch",
101
101
  "release:minor": "release-me minor",
102
102
  "release:commit": "release-me commit"
package/dist/integration/styles.css DELETED
@@ -1,6 +0,0 @@
1
- /* For integration/Loading.tsx */
2
- @keyframes vike-react-shine {
3
- to {
4
- background-position-x: -200%;
5
- }
6
- }