vike-solid-query 0.1.0 → 0.1.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 (7) hide show
  1. package/README.md +9 -9
  2. package/dist/{src/index.d.ts → index.d.ts} +4 -3
  3. package/dist/{src/index.js → index.js} +3 -3
  4. package/dist/integration/{+config.js → config.js} +2 -2
  5. package/package.json +27 -29
  6. /package/dist/integration/{+config.d.ts → config.d.ts} +0 -0
  7. /package/dist/{src/server.js → server.js} +0 -0
package/README.md CHANGED
@@ -8,7 +8,7 @@
8
8
  Enables your Solid components to fetch data using [TanStack Query](https://tanstack.com/query/latest).
9
9
 
10
10
  > [!NOTE]
11
- > You'll also get [progressive rendering](https://vike.dev/streaming#progressive-rendering) and [supports](https://tanstack.com/query/latest/docs/framework/solid/reference/createQuery#usage-with-suspense) for triggering SolidJS Suspense and ErrorBoundary components when the query is in a pending or error state.
11
+ > You'll also get [progressive rendering](https://vike.dev/streaming#progressive-rendering) and [supports](https://tanstack.com/query/latest/docs/framework/solid/reference/useQuery#usage-with-suspense) for triggering SolidJS Suspense and ErrorBoundary components when the query is in a pending or error state.
12
12
 
13
13
  [Installation](#installation)
14
14
  [Basic usage](#basic-usage)
@@ -38,11 +38,11 @@ Enables your Solid components to fetch data using [TanStack Query](https://tanst
38
38
  ## Basic usage
39
39
 
40
40
  ```tsx
41
- import { createQuery } from "@tanstack/solid-query";
41
+ import { useQuery } from "@tanstack/solid-query";
42
42
  import { Suspense } from "solid-js";
43
43
 
44
44
  const Movie = (props: { id }) => {
45
- const query = createQuery(() => ({
45
+ const query = useQuery(() => ({
46
46
  queryKey: ["movies", props.id],
47
47
  queryFn: () =>
48
48
  fetch(`https://brillout.github.io/star-wars/api/films/${props.id}.json`)
@@ -76,7 +76,7 @@ const Movie = (props: { id }) => {
76
76
 
77
77
  **Types :**
78
78
  ```js
79
- query: CreateQueryResult<T, Error>;
79
+ query: UseQueryResult<T, Error>;
80
80
  loadingFallback?: JSX.Element;
81
81
  notFoundFallback?: JSX.Element;
82
82
  errorFallback?: JSX.Element | ((err: any, reset: () => void) => JSX.Element);
@@ -86,11 +86,11 @@ children: (data: Exclude<T, null | false | undefined>) => JSX.Element;
86
86
  ```tsx
87
87
  // Movie.tsx
88
88
 
89
- import { createQuery } from "@tanstack/solid-query";
89
+ import { useQuery } from "@tanstack/solid-query";
90
90
  import { QueryBoundary } from "vike-solid-query";
91
91
 
92
92
  function Movie(props: { id: string }) {
93
- const query = createQuery(() => ({
93
+ const query = useQuery(() => ({
94
94
  queryKey: ["movies", props.id],
95
95
  queryFn: () =>
96
96
  fetch(`https://brillout.github.io/star-wars/api/films/${props.id}.json`)
@@ -130,14 +130,14 @@ function Movie(props: { id: string }) {
130
130
  To set tags such as `<title>` and `<meta name="description">` based on fetched data, you can use [`<Config>`, `<Head>`, and `useConfig()`](https://vike.dev/useConfig).
131
131
 
132
132
  ```tsx
133
- import { createQuery } from "@tanstack/solid-query";
133
+ import { useQuery } from "@tanstack/solid-query";
134
134
  import { Config } from 'vike-solid/Config'
135
135
  import { Head } from 'vike-solid/Head'
136
136
  import { QueryBoundary } from "vike-solid-query";
137
137
  import { For } from "solid-js";
138
138
 
139
139
  function Movies() {
140
- const query = createQuery(() => ({
140
+ const query = useQuery(() => ({
141
141
  queryKey: ["movies"],
142
142
  queryFn: () => fetch('https://star-wars.brillout.com/api/films.json')
143
143
  }));
@@ -186,5 +186,5 @@ export default {
186
186
  ## See also
187
187
 
188
188
  - [Example](https://github.com/vikejs/vike-solid/tree/main/examples/solid-query)
189
- - [TanStack Query > CreateQuery > Usage with Suspense](https://tanstack.com/query/latest/docs/framework/solid/reference/createQuery#usage-with-suspense)
189
+ - [TanStack Query > useQuery > Usage with Suspense](https://tanstack.com/query/latest/docs/framework/solid/reference/useQuery#usage-with-suspense)
190
190
  - [Vike > Data Fetching](https://vike.dev/data-fetching)
package/dist/{src/index.d.ts → index.d.ts} RENAMED
@@ -1,8 +1,8 @@
1
- import { CreateQueryResult } from '@tanstack/solid-query';
1
+ import { UseQueryResult } from '@tanstack/solid-query';
2
2
  import { JSX } from 'solid-js';
3
3
 
4
4
  interface QueryBoundaryProps<T = unknown> {
5
- query: CreateQueryResult<T, Error>;
5
+ query: UseQueryResult<T, Error>;
6
6
  /**
7
7
  * Triggered when the data is initially loading.
8
8
  */
@@ -26,4 +26,5 @@ interface QueryBoundaryProps<T = unknown> {
26
26
  */
27
27
  declare function QueryBoundary<T>(props: QueryBoundaryProps<T>): JSX.Element;
28
28
 
29
- export { QueryBoundary, type QueryBoundaryProps };
29
+ export { QueryBoundary };
30
+ export type { QueryBoundaryProps };
package/dist/{src/index.js → index.js} RENAMED
@@ -1,4 +1,4 @@
1
- import { delegateEvents, createComponent, getNextElement, insert, runHydrationEvents, memo, template } from 'solid-js/web';
1
+ import { delegateEvents, createComponent, getNextElement, memo, template, runHydrationEvents, insert } from 'solid-js/web';
2
2
  import { ErrorBoundary, Suspense, Switch, Match } from 'solid-js';
3
3
 
4
4
  var _tmpl$ = /*#__PURE__*/template(`<div><div class=query-boundary-error></div><button>Retry`),
@@ -11,7 +11,7 @@ var _tmpl$ = /*#__PURE__*/template(`<div><div class=query-boundary-error></div><
11
11
  function QueryBoundary(props) {
12
12
  return createComponent(ErrorBoundary, {
13
13
  get fallback() {
14
- return props.errorFallback ? props.errorFallback : (err, reset) => (() => {
14
+ return memo(() => !!props.errorFallback)() ? props.errorFallback : (err, reset) => (() => {
15
15
  var _el$ = getNextElement(_tmpl$),
16
16
  _el$2 = _el$.firstChild,
17
17
  _el$3 = _el$2.nextSibling;
@@ -34,7 +34,7 @@ function QueryBoundary(props) {
34
34
  get children() {
35
35
  return [createComponent(Match, {
36
36
  get when() {
37
- return !props.query.isFetching && !props.query.data;
37
+ return memo(() => !!!props.query.isFetching)() && !props.query.data;
38
38
  },
39
39
  get children() {
40
40
  return memo(() => !!props.notFoundFallback)() ? props.notFoundFallback : [getNextElement(_tmpl$2), (() => {
package/dist/integration/{+config.js → config.js} RENAMED
@@ -1,4 +1,4 @@
1
- var _config = {
1
+ var config = {
2
2
  name: "vike-solid-query",
3
3
  require: {
4
4
  "vike-solid": ">=0.7.4"
@@ -21,4 +21,4 @@ var _config = {
21
21
  }
22
22
  };
23
23
 
24
- export { _config as default };
24
+ export { config as default };
package/package.json CHANGED
@@ -1,51 +1,48 @@
1
1
  {
2
2
  "name": "vike-solid-query",
3
- "version": "0.1.0",
3
+ "version": "0.1.2",
4
4
  "type": "module",
5
- "main": "./dist/src/server.js",
6
- "typings": "dist/src/index.d.ts",
7
- "module": "./dist/src/server.js",
8
- "types": "./dist/src/index.d.ts",
5
+ "main": "./dist/server.js",
6
+ "typings": "dist/index.d.ts",
7
+ "module": "./dist/server.js",
8
+ "types": "./dist/index.d.ts",
9
9
  "browser": {
10
- "./dist/src/server.js": "./dist/src/index.js"
10
+ "./dist/server.js": "./dist/index.js"
11
11
  },
12
12
  "exports": {
13
13
  ".": {
14
- "browser": "./dist/src/index.js",
15
- "node": "./dist/src/server.js",
16
- "default": "./dist/src/index.js",
17
- "types": "./dist/src/index.d.ts"
14
+ "browser": "./dist/index.js",
15
+ "node": "./dist/server.js",
16
+ "types": "./dist/index.d.ts",
17
+ "default": "./dist/index.js"
18
18
  },
19
- "./config": "./dist/integration/+config.js",
19
+ "./config": "./dist/integration/config.js",
20
20
  "./__internal/integration/Wrapper": {
21
- "solid": "./dist/integration/Wrapper.js",
22
- "import": {
23
- "types": "./dist/integration/Wrapper.d.ts",
24
- "default": "./dist/integration/Wrapper.js"
25
- }
21
+ "types": "./dist/integration/Wrapper.d.ts",
22
+ "default": "./dist/integration/Wrapper.js"
26
23
  }
27
24
  },
28
25
  "peerDependencies": {
29
26
  "@tanstack/solid-query": ">=5.0.0",
30
27
  "solid-js": "^1.8.7",
31
- "vike-solid": "^0.7.6"
28
+ "vike-solid": "^0.7.13"
32
29
  },
33
30
  "devDependencies": {
34
- "@brillout/release-me": "^0.4.2",
35
- "@rollup/plugin-babel": "^6.0.4",
36
- "@rollup/plugin-node-resolve": "^15.2.4",
37
- "@tanstack/solid-query": "^5.56.2",
38
- "rollup": "^4.22.4",
39
- "rollup-plugin-dts": "^6.1.1",
40
- "solid-js": "^1.8.22",
41
- "typescript": "^5.6.2",
42
- "vike": "^0.4.197",
43
- "vike-solid": "0.7.6"
31
+ "@brillout/release-me": "^0.4.8",
32
+ "@rollup/plugin-babel": "^6.1.0",
33
+ "@rollup/plugin-node-resolve": "^16.0.3",
34
+ "@tanstack/solid-query": "^5.90.13",
35
+ "rollup": "^4.53.2",
36
+ "rollup-plugin-dts": "^6.2.3",
37
+ "solid-js": "^1.9.10",
38
+ "typescript": "^5.9.3",
39
+ "vike": "^0.4.246",
40
+ "vike-solid": "0.7.13"
44
41
  },
45
42
  "typesVersions": {
46
43
  "*": {
47
44
  "config": [
48
- "dist/integration/+config.d.ts"
45
+ "dist/integration/config.d.ts"
49
46
  ],
50
47
  "__internal/integration/Wrapper": [
51
48
  "dist/integration/Wrapper.d.ts"
@@ -63,6 +60,7 @@
63
60
  "build": "tsc --noEmit && rollup -c rollup.config.js",
64
61
  "release": "LANG=en_US release-me patch",
65
62
  "release:minor": "LANG=en_US release-me minor",
66
- "release:commit": "LANG=en_US release-me commit"
63
+ "release:commit": "LANG=en_US release-me commit",
64
+ "test:types": "tsc --noEmit"
67
65
  }
68
66
  }
/package/dist/integration/{+config.d.ts → config.d.ts} RENAMED
File without changes
/package/dist/{src/server.js → server.js} RENAMED
File without changes