vike-solid 0.3.0 → 0.3.1

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 (16) hide show
  1. package/README.md +86 -2
  2. package/dist/{renderer/+config.d.ts → +config.d.ts} +2 -3
  3. package/dist/+config.js +3 -3
  4. package/dist/hooks/useData.d.ts +9 -0
  5. package/dist/hooks/usePageContext.d.ts +6 -0
  6. package/dist/main.d.ts +3 -0
  7. package/dist/main.js +4 -0
  8. package/dist/{+onRenderClient.js → onRenderClient.js} +1 -1
  9. package/dist/{+onRenderHtml.js → onRenderHtml.js} +1 -1
  10. package/dist/useData.js +17 -2
  11. package/dist/{PageContextProvider-OTjP33FZ.js → usePageContext-lXmAPn22.js} +2 -14
  12. package/dist/usePageContext.js +2 -2
  13. package/package.json +16 -12
  14. package/dist/components/useData.d.ts +0 -2
  15. package/dist/components/usePageContext.d.ts +0 -2
  16. package/dist/useData-UNVtqljj.d.ts +0 -13
package/README.md CHANGED
@@ -3,6 +3,90 @@
3
3
 
4
4
  # `vike-solid`
5
5
 
6
- SolidJS integration for [Vike](https://github.com/vikejs/vike).
6
+ SolidJS integration for Vike, see [vike.dev/solid](https://vike.dev/solid).
7
7
 
8
- See [examples/](https://github.com/vikejs/vike-solid/tree/main/examples).
8
+ - [Documentation](https://vike.dev)
9
+ - [Examples](https://github.com/vikejs/vike-solid/tree/main/examples)
10
+
11
+ ## Introduction
12
+
13
+ [UI framework Vike extensions](https://vike.dev/extensions) like `vike-solid`:
14
+
15
+ - implement Vike Core [hooks](https://vike.dev/hooks) (e.g. [`onRenderHtml()`](https://vike.dev/onRenderHtml)) on your
16
+ behalf,
17
+ - set Vike Core [settings](https://vike.dev/settings) on your behalf,
18
+ - introduce new hooks for you to implement if needed,
19
+ - introduce new settings for you to set if needed,
20
+ - introduce new components and component hooks.
21
+
22
+ ## Scaffold new app
23
+
24
+ Use [Bati](https://batijs.github.io/) to scaffold a Vike app using `vike-solid`.
25
+
26
+ ## Add to existing app
27
+
28
+ To add `vike-solid` to an existing Vike app:
29
+
30
+ 1. Install the `vike-solid` npm package in your project:
31
+
32
+ ```bash
33
+ npm install vike-solid
34
+ ```
35
+
36
+ 2. Extend your existing Vike config files with `vike-solid`:
37
+
38
+ ```diff
39
+ // /pages/+config.h.js
40
+
41
+ +import vikeSolid from 'vike-solid/config'
42
+ +
43
+ export default {
44
+ // Existing Vike Core settings
45
+ // ...
46
+ +
47
+ + // New setting introduced by vike-solid:
48
+ + title: 'My Vike + Solid App',
49
+ +
50
+ + extends: vikeSolid
51
+ }
52
+ ```
53
+
54
+ ## Hooks
55
+
56
+ `vike-solid` implements the [`onRenderHtml()`](https://vike.dev/onRenderHtml) and
57
+ [`onRenderClient()`](https://vike.dev/onRenderClient) hooks on your behalf, which are essentially the glue code between
58
+ Vike and Solid.
59
+
60
+ ## Settings
61
+
62
+ `vike-solid` sets the following Vike Core settings on your behalf:
63
+
64
+ - [`clientRouting=true`](https://vike.dev/clientRouting): Enable [Client Routing](https://vike.dev/client-routing).
65
+ - [`hydrationCanBeAborted=true`](https://vike.dev/hydrationCanBeAborted): Solid allows the
66
+ [hydration](https://vike.dev/hydration) to be aborted.
67
+
68
+ `vike-solid` introduces the following new settings:
69
+
70
+ - [`Head`](https://vike.dev/head): **Component** Component to be rendered inside the `<head>` tag.
71
+ - [`title`](https://vike.dev/head): **string** `<title>...</title>` tag.
72
+ - [`favicon`](https://vike.dev/head): **string** `<link rel="icon" href="..." />` attribute.
73
+ - [`lang`](https://vike.dev/lang): **string** `<html lang="...">` attribute.
74
+ - [`ssr`](https://vike.dev/ssr): **boolean** Enable/disable Server-Side Rendering
75
+ ([SSR](https://vike.dev/render-modes)).
76
+ - [`stream`](https://vike.dev/stream): **boolean** Enable/disable [HTML streaming](https://vike.dev/streaming).
77
+ - [`Layout`](https://vike.dev/Layout): **Component** Wrapper for your [Page component](https://vike.dev/Page).
78
+
79
+ ## Component hooks
80
+
81
+ `vike-solid` introduces the following new component hooks:
82
+
83
+ - [`useData()`](https://vike.dev/useData): Access the data that is returned by a [`data()` hook](https://vike.dev/data)
84
+ from any component.
85
+ - [`usePageContext()`](https://vike.dev/usePageContext): Access the [`pageContext` object](https://vike.dev/pageContext)
86
+ from any component.
87
+
88
+ ## Components
89
+
90
+ `vike-solid` introduces the following new components:
91
+
92
+ - [`ClientOnly`](https://vike.dev/ClientOnly): Wrapper to render and load a component only on the client-side.
package/dist/{renderer/+config.d.ts → +config.d.ts} RENAMED
@@ -10,7 +10,7 @@ declare global {
10
10
  }
11
11
  }
12
12
 
13
- declare const _default: {
13
+ declare const config: {
14
14
  onRenderHtml: "import:vike-solid/renderer/onRenderHtml:onRenderHtml";
15
15
  onRenderClient: "import:vike-solid/renderer/onRenderClient:onRenderClient";
16
16
  clientRouting: true;
@@ -58,7 +58,6 @@ declare const _default: {
58
58
  };
59
59
  };
60
60
  };
61
-
62
61
  declare global {
63
62
  namespace VikePackages {
64
63
  interface ConfigVikeSolid {
@@ -97,4 +96,4 @@ declare global {
97
96
  }
98
97
  }
99
98
 
100
- export { _default as default };
99
+ export { config };
package/dist/+config.js CHANGED
@@ -25,7 +25,7 @@ const toggleSsrRelatedConfig = ({
25
25
  }
26
26
  };
27
27
  };
28
- var _config = {
28
+ const config = {
29
29
  // https://vike.dev/onRenderHtml
30
30
  onRenderHtml: "import:vike-solid/renderer/onRenderHtml:onRenderHtml",
31
31
  // https://vike.dev/onRenderClient
@@ -78,7 +78,7 @@ var _config = {
78
78
  }
79
79
  };
80
80
 
81
- // We purposely define the ConfigVikeSolid interface in this file: that way we ensure it's always applied whenever the user `import vikeSolid from 'vike-solid'`
81
+ // We purposely define the ConfigVikeSolid interface in this file: that way we ensure it's always applied whenever the user `import vikeSolid from 'vike-solid/config'`
82
82
  // https://vike.dev/pageContext#typescript
83
83
 
84
- export { _config as default };
84
+ export { config };
package/dist/hooks/useData.d.ts ADDED
@@ -0,0 +1,9 @@
1
+ /** Access `pageContext.data` from any SolidJS component
2
+ *
3
+ * See
4
+ * - https://vike.dev/data
5
+ * - https://vike.dev/pageContext-anywhere
6
+ */
7
+ declare function useData<Data>(): Data;
8
+
9
+ export { useData };
package/dist/hooks/usePageContext.d.ts ADDED
@@ -0,0 +1,6 @@
1
+ import * as vike_dist_esm_shared_types from 'vike/dist/esm/shared/types';
2
+
3
+ /** Access the pageContext from any SolidJS component */
4
+ declare function usePageContext(): vike_dist_esm_shared_types.PageContext;
5
+
6
+ export { usePageContext };
package/dist/main.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ export { config } from './+config.js';
2
+ import 'vike/types';
3
+ import 'solid-js';
package/dist/main.js ADDED
@@ -0,0 +1,4 @@
1
+ export { config } from './+config.js';
2
+
3
+ // TODO/next-major-release: remove this file/export
4
+ console.warn("[vike-solid][warning][deprecation] Replace `import vikeVue from 'vike-solid'` with `import vikeSolid from 'vike-solid/config'` (typically in your /pages/+config.h.js)");
package/dist/{+onRenderClient.js → onRenderClient.js} RENAMED
@@ -1,5 +1,5 @@
1
1
  import { createComponent, Dynamic, memo, hydrate, render } from 'solid-js/web';
2
- import { P as PageContextProvider, u as usePageContext } from './PageContextProvider-OTjP33FZ.js';
2
+ import { P as PageContextProvider, u as usePageContext } from './usePageContext-lXmAPn22.js';
3
3
  import { createStore, reconcile } from 'solid-js/store';
4
4
  import 'solid-js';
5
5
 
package/dist/{+onRenderHtml.js → onRenderHtml.js} RENAMED
@@ -1,6 +1,6 @@
1
1
  import { createComponent, Dynamic, renderToString, renderToStream, generateHydrationScript } from 'solid-js/web';
2
2
  import { version, escapeInject, dangerouslySkipEscape, stampPipe } from 'vike/server';
3
- import { P as PageContextProvider, u as usePageContext } from './PageContextProvider-OTjP33FZ.js';
3
+ import { P as PageContextProvider, u as usePageContext } from './usePageContext-lXmAPn22.js';
4
4
  import 'solid-js';
5
5
 
6
6
  function isCallable(thing) {
package/dist/useData.js CHANGED
@@ -1,3 +1,18 @@
1
- export { a as useData } from './PageContextProvider-OTjP33FZ.js';
2
- import 'solid-js/web';
1
+ import { u as usePageContext } from './usePageContext-lXmAPn22.js';
3
2
  import 'solid-js';
3
+ import 'solid-js/web';
4
+
5
+ /** Access `pageContext.data` from any SolidJS component
6
+ *
7
+ * See
8
+ * - https://vike.dev/data
9
+ * - https://vike.dev/pageContext-anywhere
10
+ */
11
+ function useData() {
12
+ const {
13
+ data
14
+ } = usePageContext();
15
+ return data;
16
+ }
17
+
18
+ export { useData };
package/dist/{PageContextProvider-OTjP33FZ.js → usePageContext-lXmAPn22.js} RENAMED
@@ -1,5 +1,5 @@
1
- import { createComponent } from 'solid-js/web';
2
1
  import { createContext, useContext } from 'solid-js';
2
+ import { createComponent } from 'solid-js/web';
3
3
 
4
4
  function getGlobalObject(
5
5
  // We use the filename as key; each `getGlobalObject()` call should live in a unique filename.
@@ -32,17 +32,5 @@ function usePageContext() {
32
32
  if (!pageContext) throw new Error("<PageContextProvider> is needed for being able to use usePageContext()");
33
33
  return pageContext;
34
34
  }
35
- /** Access `pageContext.data` from any SolidJS component
36
- *
37
- * See
38
- * - https://vike.dev/data
39
- * - https://vike.dev/pageContext-anywhere
40
- */
41
- function useData() {
42
- const {
43
- data
44
- } = usePageContext();
45
- return data;
46
- }
47
35
 
48
- export { PageContextProvider as P, useData as a, usePageContext as u };
36
+ export { PageContextProvider as P, usePageContext as u };
package/dist/usePageContext.js CHANGED
@@ -1,3 +1,3 @@
1
- export { u as usePageContext } from './PageContextProvider-OTjP33FZ.js';
2
- import 'solid-js/web';
3
1
  import 'solid-js';
2
+ export { u as usePageContext } from './usePageContext-lXmAPn22.js';
3
+ import 'solid-js/web';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vike-solid",
3
- "version": "0.3.0",
3
+ "version": "0.3.1",
4
4
  "type": "module",
5
5
  "dependencies": {
6
6
  "vite-plugin-solid": "^2.9.1"
@@ -8,11 +8,11 @@
8
8
  "peerDependencies": {
9
9
  "solid-js": "^1.8.7",
10
10
  "vite": "^4.4 || ^5.0.2",
11
- "vike": "^0.4.159"
11
+ "vike": "^0.4.160"
12
12
  },
13
13
  "devDependencies": {
14
- "@babel/core": "^7.23.7",
15
- "@babel/preset-env": "^7.23.8",
14
+ "@babel/core": "^7.23.9",
15
+ "@babel/preset-env": "^7.23.9",
16
16
  "@babel/preset-typescript": "^7.23.3",
17
17
  "@rollup/plugin-babel": "^6.0.4",
18
18
  "@rollup/plugin-node-resolve": "^15.2.3",
@@ -28,18 +28,22 @@
28
28
  "vike": "^0.4.160"
29
29
  },
30
30
  "exports": {
31
- ".": "./dist/+config.js",
31
+ ".": "./dist/main.js",
32
+ "./config": "./dist/+config.js",
32
33
  "./vite": "./dist/vite-plugin-vike-solid.js",
33
34
  "./usePageContext": "./dist/usePageContext.js",
34
35
  "./useData": "./dist/useData.js",
35
36
  "./ClientOnly": "./dist/ClientOnly.js",
36
- "./renderer/onRenderHtml": "./dist/+onRenderHtml.js",
37
- "./renderer/onRenderClient": "./dist/+onRenderClient.js"
37
+ "./renderer/onRenderHtml": "./dist/onRenderHtml.js",
38
+ "./renderer/onRenderClient": "./dist/onRenderClient.js"
38
39
  },
39
40
  "typesVersions": {
40
41
  "*": {
41
42
  ".": [
42
- "dist/renderer/+config.d.ts"
43
+ "dist/main.d.ts"
44
+ ],
45
+ "config": [
46
+ "dist/+config.d.ts"
43
47
  ],
44
48
  "vite": [
45
49
  "dist/vite-plugin-vike-solid.d.ts"
@@ -48,10 +52,10 @@
48
52
  "client.d.ts"
49
53
  ],
50
54
  "usePageContext": [
51
- "dist/components/usePageContext.d.ts"
55
+ "dist/hooks/usePageContext.d.ts"
52
56
  ],
53
57
  "useData": [
54
- "dist/components/useData.d.ts"
58
+ "dist/hooks/useData.d.ts"
55
59
  ],
56
60
  "ClientOnly": [
57
61
  "dist/components/ClientOnly.d.ts"
@@ -63,8 +67,8 @@
63
67
  "client.d.ts"
64
68
  ],
65
69
  "bin": "./cli/entry.js",
66
- "main": "dist/+config.js",
67
- "types": "dist/renderer/+config.d.ts",
70
+ "main": "dist/main.js",
71
+ "types": "dist/main.d.ts",
68
72
  "repository": "github:vikejs/vike-solid",
69
73
  "license": "MIT",
70
74
  "scripts": {
package/dist/components/useData.d.ts DELETED
@@ -1,2 +0,0 @@
1
- export { a as useData } from '../useData-UNVtqljj.js';
2
- import 'vike/types';
package/dist/components/usePageContext.d.ts DELETED
@@ -1,2 +0,0 @@
1
- export { u as usePageContext } from '../useData-UNVtqljj.js';
2
- import 'vike/types';
package/dist/useData-UNVtqljj.d.ts DELETED
@@ -1,13 +0,0 @@
1
- import { PageContext } from 'vike/types';
2
-
3
- /** Access the pageContext from any SolidJS component */
4
- declare function usePageContext(): PageContext;
5
- /** Access `pageContext.data` from any SolidJS component
6
- *
7
- * See
8
- * - https://vike.dev/data
9
- * - https://vike.dev/pageContext-anywhere
10
- */
11
- declare function useData<Data>(): Data;
12
-
13
- export { useData as a, usePageContext as u };