vike-solid-query 0.0.1-commit-f6af6c4 → 0.0.1-commit-483edf8

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

@@ -1,3 +1,4 @@
+import type { QueryClientConfig } from "@tanstack/solid-query";
 import "vike-solid/config";
 declare const _default: {
     name: string;
@@ -22,3 +23,10 @@ declare const _default: {
     };
 };
 export default _default;
+declare global {
+    namespace Vike {
+        interface Config {
+            queryClientConfig?: QueryClientConfig;
+        }
+    }
+}

package/dist/src/index.d.ts

@@ -1 +1,29 @@
-export { QueryBoundary } from "./QueryBoundary.jsx";
+import { CreateQueryResult } from '@tanstack/solid-query';
+import { JSX } from 'solid-js';
+
+interface QueryBoundaryProps<T = unknown> {
+    query: CreateQueryResult<T, Error>;
+    /**
+     * Triggered when the data is initially loading.
+     */
+    loadingFallback?: JSX.Element;
+    /**
+     * Triggered when fetching is complete, but the returned data was falsey.
+     */
+    notFoundFallback?: JSX.Element;
+    /**
+     * Triggered when the query results in an error.
+     */
+    errorFallback?: JSX.Element | ((err: any, reset: () => void) => JSX.Element);
+    /**
+     * Triggered when fetching is complete, and the returned data is not falsey.
+     */
+    children: (data: Exclude<T, null | false | undefined>) => JSX.Element;
+}
+/**
+ * Convenience wrapper that handles suspense and errors for queries. Makes the results of query.data available to
+ * children (as a render prop) in a type-safe way.
+ */
+declare function QueryBoundary<T>(props: QueryBoundaryProps<T>): JSX.Element;
+
+export { QueryBoundary, type QueryBoundaryProps };

package/dist/src/index.js

@@ -1 +1,66 @@
-export { QueryBoundary } from "./QueryBoundary.jsx";
+import { delegateEvents, createComponent, getNextElement, insert, runHydrationEvents, memo, template } from 'solid-js/web';
+import { ErrorBoundary, Suspense, Switch, Match } from 'solid-js';
+
+var _tmpl$ = /*#__PURE__*/template(`<div><div class=query-boundary-error></div><button>Retry`),
+  _tmpl$2 = /*#__PURE__*/template(`<div>Not Found,`),
+  _tmpl$3 = /*#__PURE__*/template(`<button>Refetch`);
+/**
+ * Convenience wrapper that handles suspense and errors for queries. Makes the results of query.data available to
+ * children (as a render prop) in a type-safe way.
+ */
+function QueryBoundary(props) {
+  return createComponent(ErrorBoundary, {
+    get fallback() {
+      return props.errorFallback ? props.errorFallback : (err, reset) => (() => {
+        var _el$ = getNextElement(_tmpl$),
+          _el$2 = _el$.firstChild,
+          _el$3 = _el$2.nextSibling;
+        insert(_el$2, () => err.toString());
+        _el$3.$$click = async () => {
+          reset();
+          await props.query.refetch();
+        };
+        runHydrationEvents();
+        return _el$;
+      })();
+    },
+    get children() {
+      return createComponent(Suspense, {
+        get fallback() {
+          return props.loadingFallback;
+        },
+        get children() {
+          return createComponent(Switch, {
+            get children() {
+              return [createComponent(Match, {
+                get when() {
+                  return !props.query.isFetching && !props.query.data;
+                },
+                get children() {
+                  return memo(() => !!props.notFoundFallback)() ? props.notFoundFallback : [getNextElement(_tmpl$2), (() => {
+                    var _el$5 = getNextElement(_tmpl$3);
+                    _el$5.$$click = async () => {
+                      await props.query.refetch();
+                    };
+                    runHydrationEvents();
+                    return _el$5;
+                  })()];
+                }
+              }), createComponent(Match, {
+                get when() {
+                  return props.query.data;
+                },
+                get children() {
+                  return props.children(props.query.data);
+                }
+              })];
+            }
+          });
+        }
+      });
+    }
+  });
+}
+delegateEvents(["click"]);
+
+export { QueryBoundary };

package/dist/src/server.js

@@ -0,0 +1,47 @@
+import { createComponent, ssr, ssrHydrationKey, escape } from 'solid-js/web';
+import { ErrorBoundary, Suspense, Switch, Match } from 'solid-js';
+
+var _tmpl$ = ["<div", "><div class=\"query-boundary-error\">", "</div><button>Retry</button></div>"],
+  _tmpl$2 = ["<div", ">Not Found,</div>"],
+  _tmpl$3 = ["<button", ">Refetch</button>"];
+/**
+ * Convenience wrapper that handles suspense and errors for queries. Makes the results of query.data available to
+ * children (as a render prop) in a type-safe way.
+ */
+function QueryBoundary(props) {
+  return createComponent(ErrorBoundary, {
+    get fallback() {
+      return props.errorFallback ? props.errorFallback : (err, reset) => ssr(_tmpl$, ssrHydrationKey(), escape(err.toString()));
+    },
+    get children() {
+      return createComponent(Suspense, {
+        get fallback() {
+          return props.loadingFallback;
+        },
+        get children() {
+          return createComponent(Switch, {
+            get children() {
+              return [createComponent(Match, {
+                get when() {
+                  return !props.query.isFetching && !props.query.data;
+                },
+                get children() {
+                  return props.notFoundFallback ? props.notFoundFallback : [ssr(_tmpl$2, ssrHydrationKey()), ssr(_tmpl$3, ssrHydrationKey())];
+                }
+              }), createComponent(Match, {
+                get when() {
+                  return props.query.data;
+                },
+                get children() {
+                  return props.children(props.query.data);
+                }
+              })];
+            }
+          });
+        }
+      });
+    }
+  });
+}
+
+export { QueryBoundary };

package/package.json

@@ -1,27 +1,41 @@
 {
   "name": "vike-solid-query",
-  "version": "0.0.1-commit-f6af6c4",
+  "version": "0.0.1-commit-483edf8",
   "type": "module",
-  "main": "dist/src/index.js",
-  "typings": "dist/src/index.js",
+  "main": "./dist/src/server.js",
+  "typings": "dist/src/index.d.ts",
+  "module": "./dist/src/server.js",
+  "types": "./dist/src/index.d.ts",
+  "browser": {
+    "./dist/src/server.js": "./dist/src/index.js"
+  },
   "exports": {
-    ".": "./dist/src/index.js",
+    ".": {
+      "browser": "./dist/src/index.js",
+      "node": "./dist/src/server.js",
+      "default": "./dist/src/index.js",
+      "types": "./dist/src/index.d.ts"
+    },
     "./config": "./dist/integration/+config.js",
-    "./__internal/integration/Wrapper": "./dist/integration/index.js"
+    "./__internal/integration/Wrapper": "./dist/integration/Wrapper.jsx"
   },
   "peerDependencies": {
     "@tanstack/solid-query": ">=5.0.0",
     "solid-js": "^1.8.7",
-    "vike-solid": ">=0.7.4"
+    "vike-solid": "0.7.4"
   },
   "devDependencies": {
-    "@brillout/release-me": "^0.4.1",
+    "@brillout/release-me": "^0.4.2",
+    "@rollup/plugin-babel": "^6.0.4",
+    "@rollup/plugin-node-resolve": "^15.2.4",
     "@tanstack/solid-query": "^5.56.2",
     "rimraf": "^6.0.1",
+    "rollup": "^4.22.4",
+    "rollup-plugin-dts": "^6.1.1",
     "solid-js": "^1.8.22",
     "typescript": "^5.6.2",
-    "vike": "^0.4.195",
-    "vike-solid": "^0.7.5"
+    "vike": "^0.4.196",
+    "vike-solid": "0.7.5"
   },
   "typesVersions": {
     "*": {
@@ -34,14 +48,14 @@
     }
   },
   "files": [
-    "dist"
+    "dist/"
   ],
   "repository": "github:vikejs/vike-solid",
   "license": "MIT",
   "scripts": {
-    "dev": "tsc --watch",
+    "dev": "rollup -c rollup.config.js --watch",
     "dev:typecheck": "tsc --noEmit --watch",
-    "build": "rimraf dist/ && tsc",
+    "build": "rollup -c rollup.config.js && tsc",
     "release": "LANG=en_US release-me patch",
     "release:minor": "LANG=en_US release-me minor",
     "release:commit": "LANG=en_US release-me commit"

package/dist/integration/index.d.ts

@@ -1,2 +0,0 @@
-import Wrapper from "./Wrapper.jsx";
-export default Wrapper;

package/dist/integration/index.js

@@ -1,2 +0,0 @@
-import Wrapper from "./Wrapper.jsx";
-export default Wrapper;

package/dist/src/QueryBoundary.d.ts

@@ -1,26 +0,0 @@
-import type { CreateQueryResult } from "@tanstack/solid-query";
-import type { JSX } from "solid-js";
-export interface QueryBoundaryProps<T = unknown> {
-    query: CreateQueryResult<T, Error>;
-    /**
-     * Triggered when the data is initially loading.
-     */
-    loadingFallback?: JSX.Element;
-    /**
-     * Triggered when fetching is complete, but the returned data was falsey.
-     */
-    notFoundFallback?: JSX.Element;
-    /**
-     * Triggered when the query results in an error.
-     */
-    errorFallback?: JSX.Element | ((err: any, reset: () => void) => JSX.Element);
-    /**
-     * Triggered when fetching is complete, and the returned data is not falsey.
-     */
-    children: (data: Exclude<T, null | false | undefined>) => JSX.Element;
-}
-/**
- * Convenience wrapper that handles suspense and errors for queries. Makes the results of query.data available to
- * children (as a render prop) in a type-safe way.
- */
-export declare function QueryBoundary<T>(props: QueryBoundaryProps<T>): JSX.Element;

package/dist/src/QueryBoundary.jsx

@@ -1,37 +0,0 @@
-import { ErrorBoundary, Match, Suspense, Switch } from "solid-js";
-/**
- * Convenience wrapper that handles suspense and errors for queries. Makes the results of query.data available to
- * children (as a render prop) in a type-safe way.
- */
-export function QueryBoundary(props) {
-    return (<ErrorBoundary fallback={props.errorFallback
-            ? props.errorFallback
-            : (err, reset) => (<div>
-                <div class="query-boundary-error">{err.toString()}</div>
-                <button onClick={async () => {
-                    reset();
-                    await props.query.refetch();
-                }}>
-                  Retry
-                </button>
-              </div>)}>
-      <Suspense fallback={props.loadingFallback}>
-        <Switch>
-          <Match when={!props.query.isFetching && !props.query.data}>
-            {props.notFoundFallback ? (props.notFoundFallback) : (<>
-                <div>Not Found,</div>
-                <button onClick={async () => {
-                await props.query.refetch();
-            }}>
-                  Refetch
-                </button>
-              </>)}
-          </Match>
-
-          <Match when={props.query.data}>
-            {props.children(props.query.data)}
-          </Match>
-        </Switch>
-      </Suspense>
-    </ErrorBoundary>);
-}