houdini-react 1.2.8 → 1.2.10

package/build/runtime/index.d.ts

@@ -7,8 +7,8 @@ import { PendingCache } from './routing/components/Router';
 import { SuspenseCache } from './routing/lib/cache';
 export * from './hooks';
 export * from './routing';
-export declare function Router({ cache, intialURL, artifact_cache, component_cache, data_cache, pending_cache, last_variables, loaded_queries, loaded_artifacts, session, }: {
-    intialURL: string;
+export declare function Router({ cache, initialURL, artifact_cache, component_cache, data_cache, pending_cache, last_variables, loaded_queries, loaded_artifacts, session, assetPrefix, }: {
+    initialURL: string;
     cache: Cache;
     loaded_queries?: Record<string, {
         data: GraphQLObject;
@@ -16,6 +16,7 @@ export declare function Router({ cache, intialURL, artifact_cache, component_cac
     }>;
     loaded_artifacts?: Record<string, QueryArtifact>;
     session?: App.Session;
+    assetPrefix: string;
 } & RouterCache): JSX.Element;
 type RouterCache = {
     artifact_cache: SuspenseCache<QueryArtifact>;
@@ -24,8 +25,10 @@ type RouterCache = {
     last_variables: LRUCache<GraphQLVariables>;
     pending_cache: PendingCache;
 };
-export declare function router_cache({ pending_queries, artifacts, components, }?: {
+export declare function router_cache({ pending_queries, artifacts, components, initialData, initialArtifacts, }?: {
     pending_queries?: string[];
     artifacts?: Record<string, QueryArtifact>;
     components?: Record<string, (props: any) => React.ReactElement>;
+    initialData?: Record<string, DocumentStore<GraphQLObject, GraphQLVariables>>;
+    initialArtifacts?: Record<string, QueryArtifact>;
 }): RouterCache;

package/build/runtime/routing/components/Router.d.ts

@@ -5,22 +5,22 @@ import { GraphQLObject, GraphQLVariables } from '$houdini/runtime/lib/types';
 import { QueryArtifact } from '$houdini/runtime/lib/types';
 import React from 'react';
 import { SuspenseCache } from '../lib/cache';
-import type { NavigationContext, RouterManifest } from '../lib/types';
+import type { RouterManifest } from '../lib/types';
 /**
  * Router is the top level entry point for the filesystem-based router.
  * It is responsible for loading various page sources (including API fetches) and
  * then rendering when appropriate.
  */
-export declare function Router({ manifest, intialURL, loaded_queries, loaded_artifacts, }: {
+export declare function Router({ manifest, initialURL, loaded_queries, loaded_artifacts, assetPrefix, }: {
     manifest: RouterManifest;
-    intialURL?: string;
+    initialURL?: string;
     loaded_queries?: Record<string, {
         data: GraphQLObject;
         variables: GraphQLVariables;
     }>;
     loaded_artifacts?: Record<string, QueryArtifact>;
+    assetPrefix: string;
 }): JSX.Element;
-export declare function useNavigationContext(): NavigationContext;
 export declare function RouterContextProvider({ children, client, cache, artifact_cache, component_cache, data_cache, pending_cache, last_variables, session: ssrSession, }: {
     children: React.ReactElement;
     client: HoudiniClient;

package/build/runtime/routing/components/index.d.ts

@@ -1,2 +1 @@
-export { Link } from './Link';
 export { Router, RouterContextProvider, useClient, updateLocalSession } from './Router';

package/build/runtime/routing/lib/cache.d.ts

@@ -1,5 +1,5 @@
 import { LRUCache } from '$houdini/runtime/lib/lru';
-export declare function suspense_cache<T>(): SuspenseCache<T>;
+export declare function suspense_cache<T>(initialData?: Record<string, T>): SuspenseCache<T>;
 export declare class SuspenseCache<_Data> extends LRUCache<_Data> {
     #private;
     get(key: string): _Data;

package/build/runtime/routing/lib/types.d.ts

@@ -17,7 +17,3 @@ export type RouterPageManifest = {
         default: (props: any) => React.ReactElement;
     }>;
 };
-export type NavigationContext = {
-    currentRoute: string;
-    goto: (route: string) => void;
-};

package/build/runtime/server/compat.d.ts

@@ -0,0 +1,7 @@
+import type { Config } from 'houdini';
+import type { Connect } from 'vite';
+import type { Server } from '.';
+export declare function dev_server({ server, config }: {
+    server: Connect.Server;
+    config: Config;
+}): Server;

package/build/runtime/server/index.d.ts

@@ -0,0 +1,17 @@
+import type { Config } from 'houdini';
+export declare function configure_server({ server, config }: {
+    server: Server;
+    config: Config;
+}): void;
+export type Server = {
+    use(fn: ServerMiddleware): void;
+};
+export type ServerMiddleware = (req: IncomingRequest, res: ServerResponse, next: () => void) => void;
+export type IncomingRequest = {
+    url?: string;
+    headers: Headers;
+};
+export type ServerResponse = {
+    redirect(url: string, status?: number): void;
+    set_header(name: string, value: string): void;
+};

package/build/runtime/server/session.d.ts

@@ -0,0 +1,3 @@
+import type { ServerResponse } from '.';
+export declare function set_session(res: ServerResponse, value: App.Session): void;
+export declare function get_session(req: Headers, secrets: string[]): App.Session;

package/build/runtime-cjs/index.d.ts

@@ -7,8 +7,8 @@ import { PendingCache } from './routing/components/Router';
 import { SuspenseCache } from './routing/lib/cache';
 export * from './hooks';
 export * from './routing';
-export declare function Router({ cache, intialURL, artifact_cache, component_cache, data_cache, pending_cache, last_variables, loaded_queries, loaded_artifacts, session, }: {
-    intialURL: string;
+export declare function Router({ cache, initialURL, artifact_cache, component_cache, data_cache, pending_cache, last_variables, loaded_queries, loaded_artifacts, session, assetPrefix, }: {
+    initialURL: string;
     cache: Cache;
     loaded_queries?: Record<string, {
         data: GraphQLObject;
@@ -16,6 +16,7 @@ export declare function Router({ cache, intialURL, artifact_cache, component_cac
     }>;
     loaded_artifacts?: Record<string, QueryArtifact>;
     session?: App.Session;
+    assetPrefix: string;
 } & RouterCache): JSX.Element;
 type RouterCache = {
     artifact_cache: SuspenseCache<QueryArtifact>;
@@ -24,8 +25,10 @@ type RouterCache = {
     last_variables: LRUCache<GraphQLVariables>;
     pending_cache: PendingCache;
 };
-export declare function router_cache({ pending_queries, artifacts, components, }?: {
+export declare function router_cache({ pending_queries, artifacts, components, initialData, initialArtifacts, }?: {
     pending_queries?: string[];
     artifacts?: Record<string, QueryArtifact>;
     components?: Record<string, (props: any) => React.ReactElement>;
+    initialData?: Record<string, DocumentStore<GraphQLObject, GraphQLVariables>>;
+    initialArtifacts?: Record<string, QueryArtifact>;
 }): RouterCache;

package/build/runtime-cjs/index.js

@@ -29,7 +29,7 @@ __export(runtime_exports, {
   router_cache: () => router_cache
 });
 module.exports = __toCommonJS(runtime_exports);
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_client2 = __toESM(require("./client"));
 var import_manifest = __toESM(require("./manifest"));
 var import_routing = require("./routing");
@@ -38,7 +38,7 @@ __reExport(runtime_exports, require("./hooks"), module.exports);
 __reExport(runtime_exports, require("./routing"), module.exports);
 function Router({
   cache,
-  intialURL,
+  initialURL,
   artifact_cache,
   component_cache,
   data_cache,
@@ -46,9 +46,10 @@ function Router({
   last_variables,
   loaded_queries,
   loaded_artifacts,
-  session
+  session,
+  assetPrefix
 }) {
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_routing.RouterContextProvider,
     {
       client: import_client2.default,
@@ -58,28 +59,31 @@ function Router({
       data_cache,
       pending_cache,
       last_variables,
-      session
-    },
-    /* @__PURE__ */ import_react.default.createElement(
-      import_routing.Router,
-      {
-        intialURL,
-        manifest: import_manifest.default,
-        loaded_queries,
-        loaded_artifacts
-      }
-    )
+      session,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_routing.Router,
+        {
+          initialURL,
+          manifest: import_manifest.default,
+          loaded_queries,
+          loaded_artifacts,
+          assetPrefix
+        }
+      )
+    }
   );
 }
 function router_cache({
   pending_queries = [],
   artifacts = {},
-  components = {}
+  components = {},
+  initialData = {},
+  initialArtifacts = {}
 } = {}) {
   const result = {
-    artifact_cache: (0, import_cache.suspense_cache)(),
+    artifact_cache: (0, import_cache.suspense_cache)(initialArtifacts),
     component_cache: (0, import_cache.suspense_cache)(),
-    data_cache: (0, import_cache.suspense_cache)(),
+    data_cache: (0, import_cache.suspense_cache)(initialData),
     pending_cache: (0, import_cache.suspense_cache)(),
     last_variables: (0, import_cache.suspense_cache)()
   };

package/build/runtime-cjs/routing/components/Router.d.ts

@@ -5,22 +5,22 @@ import { GraphQLObject, GraphQLVariables } from '$houdini/runtime/lib/types';
 import { QueryArtifact } from '$houdini/runtime/lib/types';
 import React from 'react';
 import { SuspenseCache } from '../lib/cache';
-import type { NavigationContext, RouterManifest } from '../lib/types';
+import type { RouterManifest } from '../lib/types';
 /**
  * Router is the top level entry point for the filesystem-based router.
  * It is responsible for loading various page sources (including API fetches) and
  * then rendering when appropriate.
  */
-export declare function Router({ manifest, intialURL, loaded_queries, loaded_artifacts, }: {
+export declare function Router({ manifest, initialURL, loaded_queries, loaded_artifacts, assetPrefix, }: {
     manifest: RouterManifest;
-    intialURL?: string;
+    initialURL?: string;
     loaded_queries?: Record<string, {
         data: GraphQLObject;
         variables: GraphQLVariables;
     }>;
     loaded_artifacts?: Record<string, QueryArtifact>;
+    assetPrefix: string;
 }): JSX.Element;
-export declare function useNavigationContext(): NavigationContext;
 export declare function RouterContextProvider({ children, client, cache, artifact_cache, component_cache, data_cache, pending_cache, last_variables, session: ssrSession, }: {
     children: React.ReactElement;
     client: HoudiniClient;

package/build/runtime-cjs/routing/components/Router.js

@@ -30,42 +30,40 @@ __export(Router_exports, {
   useCache: () => useCache,
   useClient: () => useClient,
   useCurrentVariables: () => useCurrentVariables,
-  useNavigationContext: () => useNavigationContext,
   useQueryResult: () => useQueryResult,
   useRouterContext: () => useRouterContext,
   useSession: () => useSession
 });
 module.exports = __toCommonJS(Router_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_deepEquals = require("$houdini/runtime/lib/deepEquals");
 var import_react = __toESM(require("react"));
 var import_react_streaming = require("react-streaming");
 var import_useDocumentStore = require("../../hooks/useDocumentStore");
 var import_match = require("../lib/match");
-const NavContext = import_react.default.createContext({
-  currentRoute: "/",
-  goto: () => {
-    throw new Error("NOT FOUND");
-  }
-});
 function Router({
   manifest,
-  intialURL,
+  initialURL,
   loaded_queries,
-  loaded_artifacts
+  loaded_artifacts,
+  assetPrefix
 }) {
   const [current, setCurrent] = import_react.default.useState(() => {
-    return intialURL || window.location.pathname;
+    return initialURL || window.location.pathname;
   });
   const [page, variables] = (0, import_match.find_match)(manifest, current);
-  useLoadPage({ page, variables, loaded_queries, loaded_artifacts });
+  usePageData({ page, variables, loaded_queries, loaded_artifacts, assetPrefix });
   const { component_cache } = useRouterContext();
   const PageComponent = component_cache.get(page.id);
   import_react.default.useEffect(() => {
-    if (window.location.pathname !== current) {
+    if (globalThis.window && window.location.pathname !== current) {
       window.history.pushState({}, "", current);
     }
   }, [current]);
   import_react.default.useEffect(() => {
+    if (!globalThis.window) {
+      return;
+    }
     const onChange = (evt) => {
       setCurrent(window.location.pathname);
     };
@@ -74,22 +72,15 @@ function Router({
       window.removeEventListener("popstate", onChange);
     };
   }, []);
-  return /* @__PURE__ */ import_react.default.createElement(
-    NavContext.Provider,
-    {
-      value: {
-        currentRoute: current,
-        goto: setCurrent
-      }
-    },
-    /* @__PURE__ */ import_react.default.createElement(VariableContext.Provider, { value: variables }, /* @__PURE__ */ import_react.default.createElement(PageComponent, { url: current }))
-  );
+  useAnchorIntercept({ goto: setCurrent });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(VariableContext.Provider, { value: variables, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PageComponent, { url: current }) });
 }
-function useLoadPage({
+function usePageData({
   page,
   variables,
   loaded_queries,
-  loaded_artifacts
+  loaded_artifacts,
+  assetPrefix
 }) {
   const {
     client,
@@ -131,17 +122,38 @@ function useLoadPage({
 						<script>
 							window.__houdini__cache__?.hydrate(${cache.serialize()}, window.__houdini__hydration__layer)
 
-							if (window.__houdini__nav_caches__?.pending_cache.has("${artifact.name}")) {
+							const artifactName = "${artifact.name}"
+							const value = ${JSON.stringify(observer.state.data)}
+
+							// if the data is pending, we need to resolve it
+							if (window.__houdini__nav_caches__?.data_cache.has(artifactName)) {
 								// before we resolve the pending signals,
 								// fill the data cache with values we got on the server
 								const new_store = window.__houdini__client__.observe({
-									artifact: window.__houdini__nav_caches__.artifact_cache.get("${artifact.name}"),
+									artifact: window.__houdini__nav_caches__.artifact_cache.get(artifactName),
 									cache: window.__houdini__cache__,
-									initialValue: ${JSON.stringify(observer.state.data)}
+									initialValue: value
 								})
 
-								window.__houdini__nav_caches__.data_cache.set("${artifact.name}", new_store)
+								window.__houdini__nav_caches__?.data_cache.set(artifactName, new_store)
+							}
+
 
+							// if there are no data caches available we need to populate the pending one instead
+							if (!window.__houdini__nav_caches__) {
+								if (!window.__houdini__pending_data__) {
+									window.__houdini__pending_data__ = {}
+								}
+
+								if (!window.__houdini__pending_artifacts__) {
+									window.__houdini__pending_artifacts__ = {}
+								}
+
+								window.__houdini__pending_data__[artifactName] = value
+								window.__houdini__pending_artifacts__[artifactName] = ${JSON.stringify(artifact)}
+							}
+
+							if (window.__houdini__nav_caches__?.pending_cache.has(artifactName)) {
 								// we're pushing this store onto the client, it should be initialized
 								new_store.send({
 									setup: true,
@@ -149,8 +161,8 @@ function useLoadPage({
 								})
 
 								// notify anyone waiting on the pending cache
-								window.__houdini__nav_caches__.pending_cache.get("${artifact.name}").resolve()
-								window.__houdini__nav_caches__.pending_cache.delete("${artifact.name}")
+								window.__houdini__nav_caches__.pending_cache.get(artifactName).resolve()
+								window.__houdini__nav_caches__.pending_cache.delete(artifactName)
 							}
 						<\/script>
 					`);
@@ -182,7 +194,7 @@ function useLoadPage({
         loaded_artifacts[artifact.name] = artifact;
       }
       stream?.injectToStream(`
-					<script type="module" src="@@houdini/artifact/${artifact.name}.js" async=""><\/script>
+					<script type="module" src="${assetPrefix}/artifacts/${artifact.name}.js" async=""><\/script>
 				`);
       load_query({ id: artifact.name, artifact });
     }).catch((err) => {
@@ -203,9 +215,6 @@ function useLoadPage({
     });
   }
 }
-function useNavigationContext() {
-  return import_react.default.useContext(NavContext);
-}
 function RouterContextProvider({
   children,
   client,
@@ -227,7 +236,7 @@ function RouterContextProvider({
       window.removeEventListener("_houdini_session_", handleNewSession);
     };
   }, []);
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     Context.Provider,
     {
       value: {
@@ -239,9 +248,9 @@ function RouterContextProvider({
         pending_cache,
         last_variables,
         session
-      }
-    },
-    children
+      },
+      children
+    }
   );
 }
 const Context = import_react.default.createContext(null);
@@ -281,6 +290,28 @@ function useQueryResult(name) {
   });
   return [data, observer];
 }
+function useAnchorIntercept({ goto }) {
+  const [pending, startTransition] = import_react.default.useTransition();
+  import_react.default.useEffect(() => {
+    let onClick = (e) => {
+      let link = e.target?.closest("a");
+      if (link && link instanceof HTMLAnchorElement && link.href && (!link.target || link.target === "_self") && link.origin === location.origin && !link.hasAttribute("download") && e.button === 0 && !e.metaKey && !e.ctrlKey && !e.altKey && !e.shiftKey && !e.defaultPrevented) {
+        const target = link.attributes.getNamedItem("href")?.value;
+        if (!target || !target.startsWith("/")) {
+          return;
+        }
+        e.preventDefault();
+        startTransition(() => {
+          goto(target);
+        });
+      }
+    };
+    document.addEventListener("click", onClick);
+    return () => {
+      document.removeEventListener("click", onClick);
+    };
+  }, []);
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Router,
@@ -289,7 +320,6 @@ function useQueryResult(name) {
   useCache,
   useClient,
   useCurrentVariables,
-  useNavigationContext,
   useQueryResult,
   useRouterContext,
   useSession

package/build/runtime-cjs/routing/components/index.d.ts

@@ -1,2 +1 @@
-export { Link } from './Link';
 export { Router, RouterContextProvider, useClient, updateLocalSession } from './Router';

package/build/runtime-cjs/routing/components/index.js

@@ -18,18 +18,15 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var components_exports = {};
 __export(components_exports, {
-  Link: () => import_Link.Link,
   Router: () => import_Router.Router,
   RouterContextProvider: () => import_Router.RouterContextProvider,
   updateLocalSession: () => import_Router.updateLocalSession,
   useClient: () => import_Router.useClient
 });
 module.exports = __toCommonJS(components_exports);
-var import_Link = require("./Link");
 var import_Router = require("./Router");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  Link,
   Router,
   RouterContextProvider,
   updateLocalSession,

package/build/runtime-cjs/routing/lib/cache.d.ts

@@ -1,5 +1,5 @@
 import { LRUCache } from '$houdini/runtime/lib/lru';
-export declare function suspense_cache<T>(): SuspenseCache<T>;
+export declare function suspense_cache<T>(initialData?: Record<string, T>): SuspenseCache<T>;
 export declare class SuspenseCache<_Data> extends LRUCache<_Data> {
     #private;
     get(key: string): _Data;

package/build/runtime-cjs/routing/lib/cache.js

@@ -23,8 +23,12 @@ __export(cache_exports, {
 });
 module.exports = __toCommonJS(cache_exports);
 var import_lru = require("$houdini/runtime/lib/lru");
-function suspense_cache() {
-  return new SuspenseCache();
+function suspense_cache(initialData) {
+  const cache = new SuspenseCache();
+  for (const [key, value] of Object.entries(initialData ?? {})) {
+    cache.set(key, value);
+  }
+  return cache;
 }
 class SuspenseCache extends import_lru.LRUCache {
   #callbacks = /* @__PURE__ */ new Map();

package/build/runtime-cjs/routing/lib/types.d.ts

@@ -17,7 +17,3 @@ export type RouterPageManifest = {
         default: (props: any) => React.ReactElement;
     }>;
 };
-export type NavigationContext = {
-    currentRoute: string;
-    goto: (route: string) => void;
-};

package/build/runtime-cjs/server/compat.js

@@ -0,0 +1,52 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var compat_exports = {};
+__export(compat_exports, {
+  dev_server: () => dev_server
+});
+module.exports = __toCommonJS(compat_exports);
+function dev_server({ server, config }) {
+  return {
+    use(fn) {
+      server.use((req, res, next) => {
+        fn(
+          {
+            url: req.url,
+            headers: new Headers(req.headers)
+          },
+          {
+            ...res,
+            redirect(url, status = 307) {
+              res.statusCode = status;
+              res.setHeader("location", url);
+              res.setHeader("content-length", "0");
+              return res.end();
+            },
+            set_header: res.setHeader.bind(res)
+          },
+          next
+        );
+      });
+    }
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  dev_server
+});

package/build/runtime-cjs/server/index.js

@@ -0,0 +1,54 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var server_exports = {};
+__export(server_exports, {
+  configure_server: () => configure_server
+});
+module.exports = __toCommonJS(server_exports);
+var import_config = require("../../plugin/config");
+var import_session = require("./session");
+function configure_server({ server, config }) {
+  server.use(server_handler({ config }));
+}
+function server_handler({ config }) {
+  const plugin_config = (0, import_config.plugin_config)(config);
+  return (req, res, next) => {
+    if (!req.url) {
+      next();
+      return;
+    }
+    if (plugin_config.auth && "redirect" in plugin_config.auth && req.url.startsWith(plugin_config.auth.redirect)) {
+      return redirect_auth(req, res, next);
+    }
+    next();
+  };
+}
+const redirect_auth = (req, res, next) => {
+  const { searchParams } = new URL(req.url, `http://${req.headers.get("host")}`);
+  const { redirectTo, ...session } = Object.fromEntries(searchParams.entries());
+  (0, import_session.set_session)(res, session);
+  if (redirectTo) {
+    return res.redirect(redirectTo);
+  }
+  next();
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  configure_server
+});