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

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

@@ -1,5 +1,5 @@
-import { QueryClientConfig } from '@tanstack/solid-query';
-
+import type { QueryClientConfig } from "@tanstack/solid-query";
+import "vike-solid/config";
 declare const _default: {
     name: string;
     require: {
@@ -22,7 +22,7 @@ declare const _default: {
         };
     };
 };
-
+export default _default;
 declare global {
     namespace Vike {
         interface Config {
@@ -30,5 +30,3 @@ declare global {
         }
     }
 }
-
-export { _default as default };

package/dist/integration/+config.js

@@ -1,24 +1,23 @@
-var _config = {
-  name: "vike-solid-query",
-  require: {
-    "vike-solid": ">=0.7.3"
-  },
-  Wrapper: "import:vike-solid-query/__internal/integration/Wrapper:default",
-  queryClientConfig: {
-    defaultOptions: {
-      queries: {
-        staleTime: 5000
-      }
-    }
-  },
-  meta: {
+import "vike-solid/config"; // Needed for declaration merging of Config
+export default {
+    name: "vike-solid-query",
+    require: {
+        "vike-solid": ">=0.7.4",
+    },
+    Wrapper: "import:vike-solid-query/__internal/integration/Wrapper:default",
     queryClientConfig: {
-      env: {
-        server: true,
-        client: true
-      }
-    }
-  }
+        defaultOptions: {
+            queries: {
+                staleTime: 5000,
+            },
+        },
+    },
+    meta: {
+        queryClientConfig: {
+            env: {
+                server: true,
+                client: true,
+            },
+        },
+    },
 };
-
-export { _config as default };

package/dist/integration/Wrapper.d.ts

@@ -1,7 +1,4 @@
-import { JSX } from 'solid-js';
-
-declare function Wrapper(props: {
-    children: JSX.Element;
+import type { JSX } from "solid-js";
+export default function Wrapper(props: {
+    children?: JSX.Element;
 }): JSX.Element;
-
-export { Wrapper as default };

package/dist/integration/Wrapper.jsx

@@ -0,0 +1,7 @@
+import { QueryClient, QueryClientProvider } from "@tanstack/solid-query";
+import { usePageContext } from "vike-solid/usePageContext";
+export default function Wrapper(props) {
+    const pageContext = usePageContext();
+    const queryClient = new QueryClient(pageContext.config.queryClientConfig);
+    return <QueryClientProvider client={queryClient}>{props.children}</QueryClientProvider>;
+}

package/dist/src/index.d.ts

@@ -1 +1,29 @@
-export { QueryBoundary } from "./QueryBoundary";
+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";
+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,11 +1,28 @@
 {
   "name": "vike-solid-query",
-  "version": "0.0.1-commit-dc7c4d4",
+  "version": "0.0.1-commit-483edf8",
   "type": "module",
+  "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": {
+    ".": {
+      "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/Wrapper.jsx"
+  },
   "peerDependencies": {
     "@tanstack/solid-query": ">=5.0.0",
     "solid-js": "^1.8.7",
-    "vike-solid": "^0.7.5"
+    "vike-solid": "0.7.4"
   },
   "devDependencies": {
     "@brillout/release-me": "^0.4.2",
@@ -18,14 +35,8 @@
     "solid-js": "^1.8.22",
     "typescript": "^5.6.2",
     "vike": "^0.4.196",
-    "vite": "^5.4.7",
     "vike-solid": "0.7.5"
   },
-  "exports": {
-    ".": "./dist/src/index.js",
-    "./config": "./dist/integration/+config.js",
-    "./__internal/integration/Wrapper": "./dist/integration/Wrapper.js"
-  },
   "typesVersions": {
     "*": {
       "config": [

package/dist/integration/Wrapper.js

@@ -1,16 +0,0 @@
-import { createComponent } from 'solid-js/web';
-import { QueryClient, QueryClientProvider } from '@tanstack/solid-query';
-import { usePageContext } from 'vike-solid/usePageContext';
-
-function Wrapper(props) {
-  const pageContext = usePageContext();
-  const queryClient = new QueryClient(pageContext.config.queryClientConfig);
-  return createComponent(QueryClientProvider, {
-    client: queryClient,
-    get children() {
-      return props.children;
-    }
-  });
-}
-
-export { Wrapper as default };

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>);
-}