houdini 1.2.27 → 1.2.28

package/build/runtime-cjs/router/server.d.ts

@@ -3,7 +3,7 @@ import { type GraphQLSchema } from 'graphql';
 import { createYoga } from 'graphql-yoga';
 import type { HoudiniClient } from '../client';
 import type { RouterManifest, RouterPageManifest, YogaServerOptions } from './types';
-export declare function _serverHandler<ComponentType = unknown>({ schema, yoga, client, production, manifest, graphqlEndpoint, on_render, }: {
+export declare function _serverHandler<ComponentType = unknown>({ schema, yoga, client, production, manifest, graphqlEndpoint, on_render, componentCache, }: {
     schema?: GraphQLSchema | null;
     yoga?: ReturnType<typeof createYoga> | null;
     client: HoudiniClient;
@@ -11,11 +11,13 @@ export declare function _serverHandler<ComponentType = unknown>({ schema, yoga,
     manifest: RouterManifest<ComponentType> | null;
     assetPrefix: string;
     graphqlEndpoint: string;
+    componentCache: Record<string, any>;
     on_render: (args: {
         url: string;
         match: RouterPageManifest<ComponentType> | null;
         manifest: RouterManifest<unknown>;
         session: App.Session;
+        componentCache: Record<string, any>;
     }) => Response | Promise<Response | undefined> | undefined;
 } & Omit<YogaServerOptions, 'schema'>): (request: Request) => Promise<Response>;
 export declare const serverAdapterFactory: (args: Parameters<typeof _serverHandler>[0]) => ReturnType<typeof createAdapter>;

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

@@ -37,7 +37,8 @@ function _serverHandler({
   production,
   manifest,
   graphqlEndpoint,
-  on_render
+  on_render,
+  componentCache
 }) {
   if (schema && !yoga) {
     yoga = (0, import_graphql_yoga.createYoga)({
@@ -46,6 +47,7 @@ function _serverHandler({
       graphqlEndpoint
     });
   }
+  client.componentCache = componentCache;
   if (schema) {
     client.registerProxy(graphqlEndpoint, async ({ query, variables, session }) => {
       const parsed = (0, import_graphql.parse)(query);
@@ -77,7 +79,8 @@ function _serverHandler({
       url,
       match,
       session: await (0, import_session.get_session)(request.headers, session_keys),
-      manifest
+      manifest,
+      componentCache
     });
     if (rendered) {
       return rendered;

package/build/runtime-cjs/router/session.js

@@ -31,13 +31,16 @@ async function handle_request(args) {
   }
 }
 async function redirect_auth(args) {
-  const { searchParams } = new URL(args.url, `http://${args.headers.get("host")}`);
+  const { searchParams, host } = new URL(args.url, `http://${args.headers.get("host")}`);
   const { redirectTo, ...session } = Object.fromEntries(searchParams.entries());
-  if (redirectTo) {
-    const response = Response.redirect(redirectTo, 302);
-    await set_session(args, response, session);
-    return response;
-  }
+  const response = new Response("ok", {
+    status: 302,
+    headers: {
+      Location: redirectTo ?? "/"
+    }
+  });
+  await set_session(args, response, session);
+  return response;
 }
 const session_cookie_name = "__houdini__";
 async function set_session(req, response, value) {

package/build/runtime-cjs/router/types.d.ts

@@ -16,6 +16,7 @@ export type RouterPageManifest<_ComponentType> = {
             default: QueryArtifact;
         }>;
         loading: boolean;
+        variables: string[];
     }>;
     component: () => Promise<{
         default: (props: any) => _ComponentType;

package/build/runtime-esm/cache/cache.d.ts

@@ -10,8 +10,10 @@ import { InMemorySubscriptions, type FieldSelection } from './subscription';
 export declare class Cache {
     #private;
     _internal_unstable: CacheInternal;
-    constructor({ disabled, ...config }?: ConfigFile & {
+    constructor({ disabled, componentCache, createComponent, ...config }?: ConfigFile & {
         disabled?: boolean;
+        componentCache?: Record<string, any>;
+        createComponent?: (comp: any, prop: Record<string, any>) => any;
     });
     write({ layer: layerID, notifySubscribers, ...args }: {
         data: {
@@ -61,7 +63,9 @@ declare class CacheInternal {
     cache: Cache;
     lifetimes: GarbageCollector;
     staleManager: StaleManager;
-    constructor({ storage, subscriptions, lists, cache, lifetimes, staleManager, disabled, config, }: {
+    componentCache: Record<string, any>;
+    createComponent: (component: any, props: Record<string, any>) => any;
+    constructor({ storage, subscriptions, lists, cache, lifetimes, staleManager, disabled, config, componentCache, createComponent, }: {
         storage: InMemoryStorage;
         subscriptions: InMemorySubscriptions;
         lists: ListManager;
@@ -70,6 +74,8 @@ declare class CacheInternal {
         staleManager: StaleManager;
         disabled: boolean;
         config?: ConfigFile;
+        componentCache?: Record<string, any>;
+        createComponent: undefined | ((component: any, props: Record<string, any>) => any);
     });
     get config(): ConfigFile;
     setConfig(config: ConfigFile): void;
@@ -108,8 +114,9 @@ declare class CacheInternal {
     idFields(type: string): string[];
     computeID(type: string, data: any): string;
     isEmbedded(linkedType: string, value: GraphQLObject): boolean;
-    hydrateNestedList({ fields, variables, linkedList, stepsFromConnection, ignoreMasking, fullCheck, loading, }: {
+    hydrateNestedList({ fields, variables, linkedList, stepsFromConnection, ignoreMasking, fullCheck, loading, nullable, }: {
         fields: SubscriptionSelection;
+        nullable: boolean;
         variables?: {} | null;
         linkedList: NestedList;
         stepsFromConnection: number | null;
@@ -121,6 +128,7 @@ declare class CacheInternal {
         partial: boolean;
         stale: boolean;
         hasData: boolean;
+        cascadeNull: boolean;
     };
     extractNestedListIDs({ value, abstract, recordID, key, linkedType, fields, variables, applyUpdates, specs, layer, forceNotify, }: {
         value: GraphQLValue[];
@@ -144,4 +152,17 @@ export declare function evaluateFragmentVariables(variables: ValueMap, args: Gra
     [k: string]: GraphQLValue;
 };
 export declare const rootID = "_ROOT_";
+export declare function fragmentReference({ component, prop, }: {
+    component: {
+        name: string;
+    };
+    prop: string;
+}): any;
+export declare function defaultComponentField({ cache, component, loading, variables, parent, }: {
+    cache: Cache;
+    component: Required<Required<SubscriptionSelection>['fields'][string]>['component'];
+    loading?: boolean;
+    variables: Record<string, GraphQLValue> | undefined | null;
+    parent: string;
+}): (props: any) => any;
 export {};

package/build/runtime-esm/cache/cache.js

@@ -12,7 +12,12 @@ import { evaluateKey } from "./stuff";
 import { InMemorySubscriptions } from "./subscription";
 class Cache {
   _internal_unstable;
-  constructor({ disabled, ...config } = {}) {
+  constructor({
+    disabled,
+    componentCache,
+    createComponent,
+    ...config
+  } = {}) {
     this._internal_unstable = new CacheInternal({
       cache: this,
       storage: new InMemoryStorage(),
@@ -20,7 +25,9 @@ class Cache {
       lists: new ListManager(this, rootID),
       lifetimes: new GarbageCollector(this),
       staleManager: new StaleManager(this),
-      disabled: disabled ?? typeof globalThis.window === "undefined"
+      disabled: disabled ?? typeof globalThis.window === "undefined",
+      componentCache,
+      createComponent
     });
     if (Object.keys(config).length > 0) {
       this.setConfig(defaultConfigValues(config));
@@ -195,6 +202,8 @@ class CacheInternal {
   cache;
   lifetimes;
   staleManager;
+  componentCache;
+  createComponent;
   constructor({
     storage,
     subscriptions,
@@ -203,7 +212,9 @@ class CacheInternal {
     lifetimes,
     staleManager,
     disabled,
-    config
+    config,
+    componentCache,
+    createComponent
   }) {
     this.storage = storage;
     this.subscriptions = subscriptions;
@@ -212,6 +223,8 @@ class CacheInternal {
     this.lifetimes = lifetimes;
     this.staleManager = staleManager;
     this._config = config;
+    this.componentCache = componentCache ?? {};
+    this.createComponent = createComponent ?? (() => ({}));
     this._disabled = disabled;
     try {
       if (process.env.HOUDINI_TEST === "true") {
@@ -541,7 +554,8 @@ class CacheInternal {
         visible,
         directives,
         loading: fieldLoading,
-        abstractHasRequired
+        abstractHasRequired,
+        component
       }
     ] of Object.entries(targetSelection)) {
       if (!visible && !ignoreMasking && !fullCheck) {
@@ -568,7 +582,13 @@ class CacheInternal {
       if (generateLoading && !fieldLoading) {
         continue;
       }
-      let { value } = this.storage.get(parent, key);
+      const defaultValue = !component ? void 0 : defaultComponentField({
+        cache: this.cache,
+        component,
+        variables,
+        parent
+      });
+      let { value } = this.storage.get(parent, key, defaultValue);
       const dt_field = this.staleManager.getFieldTime(parent, key);
       if (dt_field === null) {
         stale = true;
@@ -615,12 +635,16 @@ class CacheInternal {
           stepsFromConnection: nextStep,
           ignoreMasking: !!ignoreMasking,
           fullCheck,
-          loading: generateLoading
+          loading: generateLoading,
+          nullable: !!nullable
         });
         fieldTarget[attributeName] = listValue.data;
         if (listValue.partial) {
           partial = true;
         }
+        if (listValue.cascadeNull) {
+          cascadeNull = true;
+        }
         if (listValue.stale) {
           stale = true;
         }
@@ -700,16 +724,19 @@ class CacheInternal {
     stepsFromConnection,
     ignoreMasking,
     fullCheck,
-    loading
+    loading,
+    nullable
   }) {
     const result = [];
     let partialData = false;
     let stale = false;
     let hasValues = false;
+    let cascadeNull = false;
     for (const entry of linkedList) {
       if (Array.isArray(entry)) {
         const nestedValue = this.hydrateNestedList({
           fields,
+          nullable,
           variables,
           linkedList: entry,
           stepsFromConnection,
@@ -721,6 +748,9 @@ class CacheInternal {
         if (nestedValue.partial) {
           partialData = true;
         }
+        if (nestedValue.cascadeNull) {
+          cascadeNull = true;
+        }
         continue;
       }
       if (entry === null) {
@@ -741,6 +771,9 @@ class CacheInternal {
         fullCheck,
         loading
       });
+      if (data === null && !nullable) {
+        cascadeNull = true;
+      }
       result.push(data);
       if (partial) {
         partialData = true;
@@ -756,7 +789,8 @@ class CacheInternal {
       data: result,
       partial: partialData,
       stale,
-      hasData: hasValues
+      hasData: hasValues,
+      cascadeNull
     };
   }
   extractNestedListIDs({
@@ -885,8 +919,42 @@ function fragmentVariableValue(value, args) {
   }
 }
 const rootID = "_ROOT_";
+function fragmentReference({
+  component,
+  prop
+}) {
+  return `${component.name}.${prop}`;
+}
+function defaultComponentField({
+  cache,
+  component,
+  loading,
+  variables,
+  parent
+}) {
+  return (props) => {
+    const componentFn = cache._internal_unstable.componentCache[component.key];
+    const args = evaluateFragmentVariables(component.variables ?? {}, variables ?? {});
+    return cache._internal_unstable.createComponent(componentFn, {
+      ...props,
+      [component.prop]: {
+        [fragmentKey]: {
+          loading,
+          values: {
+            [component.fragment]: {
+              variables: args,
+              parent
+            }
+          }
+        }
+      }
+    });
+  };
+}
 export {
   Cache,
+  defaultComponentField,
   evaluateFragmentVariables,
+  fragmentReference,
   rootID
 };

package/build/runtime-esm/cache/storage.d.ts

@@ -16,7 +16,7 @@ export declare class InMemoryStorage {
         from: string;
         to: string;
     }): void;
-    get(id: string, field: string): {
+    get(id: string, field: string, defaultValue?: any): {
         value: GraphQLField;
         kind: 'link' | 'scalar' | 'unknown';
         displayLayers: number[];

package/build/runtime-esm/cache/storage.js

@@ -43,7 +43,7 @@ class InMemoryStorage {
       layer.replaceID(replacement);
     }
   }
-  get(id, field) {
+  get(id, field, defaultValue) {
     const operations = {
       [OperationKind.insert]: {
         [OperationLocation.start]: [],
@@ -54,7 +54,7 @@ class InMemoryStorage {
     const layerIDs = [];
     for (let i = this.data.length - 1; i >= 0; i--) {
       const layer = this.data[i];
-      const [layerValue, kind] = layer.get(id, field);
+      let [layerValue, kind] = layer.get(id, field);
       const layerOperations = layer.getOperations(id, field) || [];
       layer.deletedIDs.forEach((v) => {
         if (layer.operations[v]?.undoDeletesInList?.includes(field)) {
@@ -62,6 +62,12 @@ class InMemoryStorage {
         }
         operations.remove.add(v);
       });
+      if (typeof layerValue === "undefined" && defaultValue) {
+        const targetLayer = this.topLayer;
+        const layerID = targetLayer.id;
+        targetLayer.writeField(id, field, defaultValue);
+        layerValue = defaultValue;
+      }
       if (typeof layerValue === "undefined" && layerOperations.length === 0) {
         if (layer.deletedIDs.size > 0) {
           layerIDs.push(layer.id);
@@ -162,7 +168,14 @@ class InMemoryStorage {
   serialize() {
     return JSON.stringify({
       rank: this.rank,
-      fields: this.topLayer.fields,
+      fields: Object.fromEntries(
+        Object.entries(this.topLayer.fields).map(([id, fieldMap]) => [
+          id,
+          Object.fromEntries(
+            Object.entries(fieldMap).filter(([_, value]) => typeof value !== "function")
+          )
+        ])
+      ),
       links: this.topLayer.links
     });
   }

package/build/runtime-esm/client/index.d.ts

@@ -31,6 +31,7 @@ export declare class HoudiniClient {
         operationName: string;
         session: App.Session | null | undefined;
     }) => Promise<any>>;
+    componentCache: Record<string, any>;
     constructor({ url, fetchParams, plugins, pipeline, throwOnError, }?: HoudiniClientConstructorArgs);
     observe<_Data extends GraphQLObject, _Input extends GraphQLVariables>({ enableCache, fetching, ...rest }: ObserveParams<_Data, DocumentArtifact, _Input>): DocumentStore<_Data, _Input>;
     registerProxy(url: string, handler: (operation: {

package/build/runtime-esm/client/index.js

@@ -17,6 +17,7 @@ class HoudiniClient {
   plugins;
   throwOnError_operations;
   proxies = {};
+  componentCache = {};
   constructor({
     url,
     fetchParams,

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

@@ -3,6 +3,6 @@ import type { CacheTypeDef } from './generated';
 import { Cache } from './public';
 export * from './client';
 export * from './lib';
-export declare function graphql<_Payload>(str: TemplateStringsArray): _Payload;
+export declare function graphql<_Payload, _Result = _Payload>(str: TemplateStringsArray): _Result;
 export declare const cache: Cache<CacheTypeDef>;
 export declare function getCache(): InternalCache;

package/build/runtime-esm/lib/config.d.ts

@@ -110,12 +110,21 @@ export type ConfigFile = {
     /**
      * For now, the cache's imperative API is considered unstable. In order to suppress the warning,
      * you must enable this flag.
+     *
+     * @deprecated set features.imperativeCache instead
      */
     acceptImperativeInstability?: boolean;
     /**
      * Configure the router
      */
     router?: RouterConfig;
+    /**
+     * A collection of flags to opt-into experimental features that might break unexpectedly
+     */
+    features?: {
+        componentFields?: boolean;
+        imperativeCache?: boolean;
+    };
 };
 type RouterConfig = {
     auth?: AuthStrategy;

package/build/runtime-esm/lib/index.d.ts

@@ -7,3 +7,4 @@ export * from './types';
 export * from './store';
 export * from './key';
 export * from './lru';
+export * from './selection';

package/build/runtime-esm/lib/index.js

@@ -7,3 +7,4 @@ export * from "./types";
 export * from "./store";
 export * from "./key";
 export * from "./lru";
+export * from "./selection";

package/build/runtime-esm/lib/types.d.ts

@@ -79,6 +79,7 @@ export type BaseCompiledDocument<_Kind extends ArtifactKinds> = {
     selection: SubscriptionSelection;
     rootType: string;
     input?: InputObject;
+    hasComponents?: boolean;
     refetch?: {
         path: string[];
         method: 'cursor' | 'offset';
@@ -156,12 +157,16 @@ export type SubscriptionSelection = {
         arguments: ValueMap;
         loading?: boolean;
     }>;
+    components?: Record<string, {
+        prop: string;
+        attribute: string;
+    }>;
     fields?: {
         [fieldName: string]: {
             type: string;
+            keyRaw: string;
             nullable?: boolean;
             required?: boolean;
-            keyRaw: string;
             operations?: MutationOperation[];
             list?: {
                 name: string;
@@ -182,6 +187,12 @@ export type SubscriptionSelection = {
             selection?: SubscriptionSelection;
             abstract?: boolean;
             abstractHasRequired?: boolean;
+            component?: {
+                prop: string;
+                key: string;
+                fragment: string;
+                variables: ValueMap | null;
+            };
         };
     };
     abstractFields?: {
@@ -333,6 +344,10 @@ export type ProjectManifest = {
     local_schema: boolean;
     /** Whether or not there is a custom instance of yoga defined */
     local_yoga: boolean;
+    /** Information about componentFields defined in the project */
+    component_fields: Record<string, {
+        filepath: string;
+    }>;
 };
 export type PageManifest = {
     id: string;
@@ -356,4 +371,6 @@ export type QueryManifest = {
     loading: boolean;
     /** The filepath of the unit */
     path: string;
+    /** The list of variables that this query cares about */
+    variables: string[];
 };

package/build/runtime-esm/public/cache.js

@@ -7,9 +7,10 @@ class Cache {
     this._internal_unstable = cache;
   }
   validateInstabilityWarning() {
-    if (!this.config.acceptImperativeInstability) {
+    if (!this.config.acceptImperativeInstability && !this.config.features?.imperativeCache) {
       console.warn(`\u26A0\uFE0F  The imperative cache API is considered unstable and will change in any minor version release
-Please acknowledge this by setting acceptImperativeInstability to true in your config file.`);
+Please acknowledge this by enabling the imperative cache feature flage in your config file.
+For more information: https://houdinigraphql.com/api/cache`);
     }
   }
   get(type, data) {

package/build/runtime-esm/router/server.d.ts

@@ -3,7 +3,7 @@ import { type GraphQLSchema } from 'graphql';
 import { createYoga } from 'graphql-yoga';
 import type { HoudiniClient } from '../client';
 import type { RouterManifest, RouterPageManifest, YogaServerOptions } from './types';
-export declare function _serverHandler<ComponentType = unknown>({ schema, yoga, client, production, manifest, graphqlEndpoint, on_render, }: {
+export declare function _serverHandler<ComponentType = unknown>({ schema, yoga, client, production, manifest, graphqlEndpoint, on_render, componentCache, }: {
     schema?: GraphQLSchema | null;
     yoga?: ReturnType<typeof createYoga> | null;
     client: HoudiniClient;
@@ -11,11 +11,13 @@ export declare function _serverHandler<ComponentType = unknown>({ schema, yoga,
     manifest: RouterManifest<ComponentType> | null;
     assetPrefix: string;
     graphqlEndpoint: string;
+    componentCache: Record<string, any>;
     on_render: (args: {
         url: string;
         match: RouterPageManifest<ComponentType> | null;
         manifest: RouterManifest<unknown>;
         session: App.Session;
+        componentCache: Record<string, any>;
     }) => Response | Promise<Response | undefined> | undefined;
 } & Omit<YogaServerOptions, 'schema'>): (request: Request) => Promise<Response>;
 export declare const serverAdapterFactory: (args: Parameters<typeof _serverHandler>[0]) => ReturnType<typeof createAdapter>;

package/build/runtime-esm/router/server.js

@@ -13,7 +13,8 @@ function _serverHandler({
   production,
   manifest,
   graphqlEndpoint,
-  on_render
+  on_render,
+  componentCache
 }) {
   if (schema && !yoga) {
     yoga = createYoga({
@@ -22,6 +23,7 @@ function _serverHandler({
       graphqlEndpoint
     });
   }
+  client.componentCache = componentCache;
   if (schema) {
     client.registerProxy(graphqlEndpoint, async ({ query, variables, session }) => {
       const parsed = parse(query);
@@ -53,7 +55,8 @@ function _serverHandler({
       url,
       match,
       session: await get_session(request.headers, session_keys),
-      manifest
+      manifest,
+      componentCache
     });
     if (rendered) {
       return rendered;

package/build/runtime-esm/router/session.js

@@ -7,13 +7,16 @@ async function handle_request(args) {
   }
 }
 async function redirect_auth(args) {
-  const { searchParams } = new URL(args.url, `http://${args.headers.get("host")}`);
+  const { searchParams, host } = new URL(args.url, `http://${args.headers.get("host")}`);
   const { redirectTo, ...session } = Object.fromEntries(searchParams.entries());
-  if (redirectTo) {
-    const response = Response.redirect(redirectTo, 302);
-    await set_session(args, response, session);
-    return response;
-  }
+  const response = new Response("ok", {
+    status: 302,
+    headers: {
+      Location: redirectTo ?? "/"
+    }
+  });
+  await set_session(args, response, session);
+  return response;
 }
 const session_cookie_name = "__houdini__";
 async function set_session(req, response, value) {

package/build/runtime-esm/router/types.d.ts

@@ -16,6 +16,7 @@ export type RouterPageManifest<_ComponentType> = {
             default: QueryArtifact;
         }>;
         loading: boolean;
+        variables: string[];
     }>;
     component: () => Promise<{
         default: (props: any) => _ComponentType;