@isograph/react 0.3.0 → 0.3.1

package/dist/react/useImperativeReference.js

@@ -2,16 +2,15 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useImperativeReference = useImperativeReference;
 const react_disposable_state_1 = require("@isograph/react-disposable-state");
-const IsographEnvironmentProvider_1 = require("./IsographEnvironmentProvider");
 const IsographEnvironment_1 = require("../core/IsographEnvironment");
 const makeNetworkRequest_1 = require("../core/makeNetworkRequest");
 const PromiseWrapper_1 = require("../core/PromiseWrapper");
-// TODO rename this to useImperativelyLoadedEntrypoint
+const IsographEnvironmentProvider_1 = require("./IsographEnvironmentProvider");
 function useImperativeReference(entrypoint) {
     const { state, setState } = (0, react_disposable_state_1.useUpdatableDisposableState)();
     const environment = (0, IsographEnvironmentProvider_1.useIsographEnvironment)();
     return {
-        fragmentReference: state,
+        fragmentReference: state !== react_disposable_state_1.UNASSIGNED_STATE ? state : null,
         loadFragmentReference: (variables, fetchOptions) => {
             const [networkRequest, disposeNetworkRequest] = (0, makeNetworkRequest_1.maybeMakeNetworkRequest)(environment, entrypoint, variables, fetchOptions);
             setState([

package/dist/react/useLazyReference.d.ts

@@ -1,10 +1,7 @@
-import { FragmentReference, ExtractParameters } from '../core/FragmentReference';
-import { IsographEntrypoint } from '../core/entrypoint';
-import { FetchOptions } from '../core/check';
-export declare function useLazyReference<TReadFromStore extends {
-    parameters: object;
-    data: object;
-}, TClientFieldValue>(entrypoint: IsographEntrypoint<TReadFromStore, TClientFieldValue>, variables: ExtractParameters<TReadFromStore>, fetchOptions?: FetchOptions): {
+import { FetchOptions, type RequiredFetchOptions } from '../core/check';
+import { IsographEntrypoint, type NormalizationAst, type NormalizationAstLoader } from '../core/entrypoint';
+import { ExtractParameters, FragmentReference, type UnknownTReadFromStore } from '../core/FragmentReference';
+export declare function useLazyReference<TReadFromStore extends UnknownTReadFromStore, TClientFieldValue, TNormalizationAst extends NormalizationAst | NormalizationAstLoader>(entrypoint: IsographEntrypoint<TReadFromStore, TClientFieldValue, TNormalizationAst>, variables: ExtractParameters<TReadFromStore>, ...[fetchOptions]: TNormalizationAst extends NormalizationAstLoader ? [fetchOptions: RequiredFetchOptions<TClientFieldValue>] : [fetchOptions?: FetchOptions<TClientFieldValue>]): NormalizationAst | NormalizationAstLoader extends TNormalizationAst ? unknown : {
     fragmentReference: FragmentReference<TReadFromStore, TClientFieldValue>;
 };
 //# sourceMappingURL=useLazyReference.d.ts.map

package/dist/react/useLazyReference.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useLazyReference.d.ts","sourceRoot":"","sources":["../../src/react/useLazyReference.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EAClB,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAIxD,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,wBAAgB,gBAAgB,CAC9B,cAAc,SAAS;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,EAC3D,iBAAiB,EAEjB,UAAU,EAAE,kBAAkB,CAAC,cAAc,EAAE,iBAAiB,CAAC,EACjE,SAAS,EAAE,iBAAiB,CAAC,cAAc,CAAC,EAC5C,YAAY,CAAC,EAAE,YAAY,GAC1B;IACD,iBAAiB,EAAE,iBAAiB,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;CACzE,CAqBA"}
+{"version":3,"file":"useLazyReference.d.ts","sourceRoot":"","sources":["../../src/react/useLazyReference.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,KAAK,oBAAoB,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,EACL,kBAAkB,EAClB,KAAK,gBAAgB,EACrB,KAAK,sBAAsB,EAC5B,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,KAAK,qBAAqB,EAC3B,MAAM,2BAA2B,CAAC;AAInC,wBAAgB,gBAAgB,CAC9B,cAAc,SAAS,qBAAqB,EAC5C,iBAAiB,EACjB,iBAAiB,SAAS,gBAAgB,GAAG,sBAAsB,EAEnE,UAAU,EAAE,kBAAkB,CAC5B,cAAc,EACd,iBAAiB,EACjB,iBAAiB,CAClB,EACD,SAAS,EAAE,iBAAiB,CAAC,cAAc,CAAC,EAC5C,GAAG,CAAC,YAAY,CAAC,EAAE,iBAAiB,SAAS,sBAAsB,GAC/D,CAAC,YAAY,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,GACvD,CAAC,YAAY,CAAC,EAAE,YAAY,CAAC,iBAAiB,CAAC,CAAC,GACnD,gBAAgB,GAAG,sBAAsB,SAAS,iBAAiB,GAClE,OAAO,GACP;IACE,iBAAiB,EAAE,iBAAiB,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;CACzE,CAqBJ"}

package/dist/react/useLazyReference.js

@@ -1,21 +1,42 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useLazyReference = useLazyReference;
-const IsographEnvironmentProvider_1 = require("./IsographEnvironmentProvider");
-const cache_1 = require("../core/cache");
 const react_disposable_state_1 = require("@isograph/react-disposable-state");
+const cache_1 = require("../core/cache");
 const logging_1 = require("../core/logging");
-function useLazyReference(entrypoint, variables, fetchOptions) {
+const IsographEnvironmentProvider_1 = require("./IsographEnvironmentProvider");
+function useLazyReference(entrypoint, variables, ...[fetchOptions]) {
     const environment = (0, IsographEnvironmentProvider_1.useIsographEnvironment)();
     if ((entrypoint === null || entrypoint === void 0 ? void 0 : entrypoint.kind) !== 'Entrypoint') {
         // TODO have a separate error logger
-        (0, logging_1.logMessage)(environment, {
+        (0, logging_1.logMessage)(environment, () => ({
             kind: 'NonEntrypointReceived',
             entrypoint,
-        });
+        }));
     }
     const cache = (0, cache_1.getOrCreateCacheForArtifact)(environment, entrypoint, variables, fetchOptions);
     return {
         fragmentReference: (0, react_disposable_state_1.useLazyDisposableState)(cache).state,
     };
 }
+// @ts-ignore
+function tsTests() {
+    let withAst;
+    let withAstLoader;
+    let withAstOrLoader;
+    useLazyReference(withAst, {});
+    useLazyReference(withAst, {}, { shouldFetch: 'Yes' });
+    useLazyReference(withAst, {}, { shouldFetch: 'IfNecessary' });
+    // @ts-expect-error if there's no ast, require `shouldFetch` to be specified
+    useLazyReference(withAstLoader, {});
+    useLazyReference(withAstLoader, {}, { shouldFetch: 'Yes' });
+    // @ts-expect-error if there's no ast, `shouldFetch` can't be `IfNecessary`
+    useLazyReference(withAstLoader, {}, { shouldFetch: 'IfNecessary' });
+    // if the type is unknown there can be no ast so we should use the same rules
+    // but because of TS bugs with inference we just return unknown
+    // @ts-expect-error this returns unknown which doesn't satisfy the constraint
+    useLazyReference(withAstOrLoader, {});
+    // @ts-expect-error this returns unknown which doesn't satisfy the constraint
+    useLazyReference(withAstOrLoader, {}, { shouldFetch: 'Yes' });
+    useLazyReference(withAstOrLoader, {}, { shouldFetch: 'IfNecessary' });
+}

package/dist/react/useReadAndSubscribe.d.ts

@@ -1,17 +1,11 @@
-import { FragmentReference, ExtractData } from '../core/FragmentReference';
+import { ExtractData, FragmentReference, type UnknownTReadFromStore } from '../core/FragmentReference';
 import { NetworkRequestReaderOptions, WithEncounteredRecords } from '../core/read';
 import type { ReaderAst } from '../core/reader';
 /**
  * Read the data from a fragment reference and subscribe to updates.
  */
-export declare function useReadAndSubscribe<TReadFromStore extends {
-    parameters: object;
-    data: object;
-}>(fragmentReference: FragmentReference<TReadFromStore, any>, networkRequestOptions: NetworkRequestReaderOptions, readerAst: ReaderAst<TReadFromStore>): ExtractData<TReadFromStore>;
-export declare function useSubscribeToMultiple<TReadFromStore extends {
-    parameters: object;
-    data: object;
-}>(items: ReadonlyArray<{
+export declare function useReadAndSubscribe<TReadFromStore extends UnknownTReadFromStore>(fragmentReference: FragmentReference<TReadFromStore, any>, networkRequestOptions: NetworkRequestReaderOptions, readerAst: ReaderAst<TReadFromStore>): ExtractData<TReadFromStore>;
+export declare function useSubscribeToMultiple<TReadFromStore extends UnknownTReadFromStore>(items: ReadonlyArray<{
     records: WithEncounteredRecords<TReadFromStore>;
     callback: (updatedRecords: WithEncounteredRecords<TReadFromStore>) => void;
     fragmentReference: FragmentReference<TReadFromStore, any>;

package/dist/react/useReadAndSubscribe.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useReadAndSubscribe.d.ts","sourceRoot":"","sources":["../../src/react/useReadAndSubscribe.ts"],"names":[],"mappings":"AACA,OAAO,EACL,iBAAiB,EAEjB,WAAW,EACZ,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACL,2BAA2B,EAE3B,sBAAsB,EACvB,MAAM,cAAc,CAAC;AAItB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAEhD;;GAEG;AACH,wBAAgB,mBAAmB,CACjC,cAAc,SAAS;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,EAE3D,iBAAiB,EAAE,iBAAiB,CAAC,cAAc,EAAE,GAAG,CAAC,EACzD,qBAAqB,EAAE,2BAA2B,EAClD,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,GACnC,WAAW,CAAC,cAAc,CAAC,CAY7B;AAED,wBAAgB,sBAAsB,CACpC,cAAc,SAAS;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,EAE3D,KAAK,EAAE,aAAa,CAAC;IACnB,OAAO,EAAE,sBAAsB,CAAC,cAAc,CAAC,CAAC;IAChD,QAAQ,EAAE,CAAC,cAAc,EAAE,sBAAsB,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC3E,iBAAiB,EAAE,iBAAiB,CAAC,cAAc,EAAE,GAAG,CAAC,CAAC;IAC1D,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;CACtC,CAAC,QAiCH"}
+{"version":3,"file":"useReadAndSubscribe.d.ts","sourceRoot":"","sources":["../../src/react/useReadAndSubscribe.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,WAAW,EACX,iBAAiB,EAEjB,KAAK,qBAAqB,EAC3B,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EACL,2BAA2B,EAE3B,sBAAsB,EACvB,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAIhD;;GAEG;AACH,wBAAgB,mBAAmB,CACjC,cAAc,SAAS,qBAAqB,EAE5C,iBAAiB,EAAE,iBAAiB,CAAC,cAAc,EAAE,GAAG,CAAC,EACzD,qBAAqB,EAAE,2BAA2B,EAClD,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,GACnC,WAAW,CAAC,cAAc,CAAC,CAY7B;AAED,wBAAgB,sBAAsB,CACpC,cAAc,SAAS,qBAAqB,EAE5C,KAAK,EAAE,aAAa,CAAC;IACnB,OAAO,EAAE,sBAAsB,CAAC,cAAc,CAAC,CAAC;IAChD,QAAQ,EAAE,CAAC,cAAc,EAAE,sBAAsB,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC3E,iBAAiB,EAAE,iBAAiB,CAAC,cAAc,EAAE,GAAG,CAAC,CAAC;IAC1D,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;CACtC,CAAC,QAuCH"}

package/dist/react/useReadAndSubscribe.js

@@ -3,11 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useReadAndSubscribe = useReadAndSubscribe;
 exports.useSubscribeToMultiple = useSubscribeToMultiple;
 const react_1 = require("react");
+const cache_1 = require("../core/cache");
 const FragmentReference_1 = require("../core/FragmentReference");
+const PromiseWrapper_1 = require("../core/PromiseWrapper");
 const read_1 = require("../core/read");
-const useRerenderOnChange_1 = require("./useRerenderOnChange");
 const IsographEnvironmentProvider_1 = require("./IsographEnvironmentProvider");
-const cache_1 = require("../core/cache");
+const useRerenderOnChange_1 = require("./useRerenderOnChange");
 /**
  * Read the data from a fragment reference and subscribe to updates.
  */
@@ -34,7 +35,10 @@ function useSubscribeToMultiple(items) {
     // TODO find out
     [
         items
-            .map(({ fragmentReference }) => (0, FragmentReference_1.stableIdForFragmentReference)(fragmentReference))
+            .map(({ fragmentReference }) => {
+            const readerWithRefetchQueries = (0, PromiseWrapper_1.readPromise)(fragmentReference.readerWithRefetchQueries);
+            (0, FragmentReference_1.stableIdForFragmentReference)(fragmentReference, readerWithRefetchQueries.readerArtifact.fieldName);
+        })
             .join('.'),
     ]);
 }

package/dist/react/useRerenderOnChange.d.ts

@@ -1,5 +1,5 @@
-import { WithEncounteredRecords } from '../core/read';
 import { FragmentReference } from '../core/FragmentReference';
+import { WithEncounteredRecords } from '../core/read';
 import type { ReaderAst } from '../core/reader';
 export declare function useRerenderOnChange<TReadFromStore extends {
     parameters: object;

package/dist/react/useRerenderOnChange.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useRerenderOnChange.d.ts","sourceRoot":"","sources":["../../src/react/useRerenderOnChange.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAIhD,wBAAgB,mBAAmB,CACjC,cAAc,SAAS;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,EAE3D,yBAAyB,EAAE,sBAAsB,CAAC,cAAc,CAAC,EACjE,iBAAiB,EAAE,iBAAiB,CAAC,GAAG,EAAE,GAAG,CAAC,EAC9C,4BAA4B,EAAE,CAC5B,IAAI,EAAE,sBAAsB,CAAC,cAAc,CAAC,KACzC,IAAI,EACT,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,QAoBrC"}
+{"version":3,"file":"useRerenderOnChange.d.ts","sourceRoot":"","sources":["../../src/react/useRerenderOnChange.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AACtD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAKhD,wBAAgB,mBAAmB,CACjC,cAAc,SAAS;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,EAE3D,yBAAyB,EAAE,sBAAsB,CAAC,cAAc,CAAC,EACjE,iBAAiB,EAAE,iBAAiB,CAAC,GAAG,EAAE,GAAG,CAAC,EAC9C,4BAA4B,EAAE,CAC5B,IAAI,EAAE,sBAAsB,CAAC,cAAc,CAAC,KACzC,IAAI,EACT,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,QAoBrC"}

package/dist/react/useResult.d.ts

@@ -1,9 +1,6 @@
-import { FragmentReference } from '../core/FragmentReference';
-import { NetworkRequestReaderOptions } from '../core/read';
+import { FragmentReference, type UnknownTReadFromStore } from '../core/FragmentReference';
 import { PromiseWrapper } from '../core/PromiseWrapper';
-export declare function useResult<TReadFromStore extends {
-    parameters: object;
-    data: object;
-}, TClientFieldValue>(fragmentReference: FragmentReference<TReadFromStore, TClientFieldValue>, partialNetworkRequestOptions?: Partial<NetworkRequestReaderOptions> | void): TClientFieldValue;
+import { NetworkRequestReaderOptions } from '../core/read';
+export declare function useResult<TReadFromStore extends UnknownTReadFromStore, TClientFieldValue>(fragmentReference: FragmentReference<TReadFromStore, TClientFieldValue>, partialNetworkRequestOptions?: Partial<NetworkRequestReaderOptions> | void): TClientFieldValue;
 export declare function maybeUnwrapNetworkRequest(networkRequest: PromiseWrapper<void, any>, networkRequestOptions: NetworkRequestReaderOptions): void;
 //# sourceMappingURL=useResult.d.ts.map

package/dist/react/useResult.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useResult.d.ts","sourceRoot":"","sources":["../../src/react/useResult.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAG9D,OAAO,EAEL,2BAA2B,EAC5B,MAAM,cAAc,CAAC;AACtB,OAAO,EAEL,cAAc,EAEf,MAAM,wBAAwB,CAAC;AAEhC,wBAAgB,SAAS,CACvB,cAAc,SAAS;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,EAC3D,iBAAiB,EAEjB,iBAAiB,EAAE,iBAAiB,CAAC,cAAc,EAAE,iBAAiB,CAAC,EACvE,4BAA4B,CAAC,EAAE,OAAO,CAAC,2BAA2B,CAAC,GAAG,IAAI,GACzE,iBAAiB,CAqCnB;AAED,wBAAgB,yBAAyB,CACvC,cAAc,EAAE,cAAc,CAAC,IAAI,EAAE,GAAG,CAAC,EACzC,qBAAqB,EAAE,2BAA2B,QAWnD"}
+{"version":3,"file":"useResult.d.ts","sourceRoot":"","sources":["../../src/react/useResult.ts"],"names":[],"mappings":"AACA,OAAO,EACL,iBAAiB,EACjB,KAAK,qBAAqB,EAC3B,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAEL,cAAc,EAEf,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAEL,2BAA2B,EAC5B,MAAM,cAAc,CAAC;AAKtB,wBAAgB,SAAS,CACvB,cAAc,SAAS,qBAAqB,EAC5C,iBAAiB,EAEjB,iBAAiB,EAAE,iBAAiB,CAAC,cAAc,EAAE,iBAAiB,CAAC,EACvE,4BAA4B,CAAC,EAAE,OAAO,CAAC,2BAA2B,CAAC,GAAG,IAAI,GACzE,iBAAiB,CA8CnB;AAED,wBAAgB,yBAAyB,CACvC,cAAc,EAAE,cAAc,CAAC,IAAI,EAAE,GAAG,CAAC,EACzC,qBAAqB,EAAE,2BAA2B,QAWnD"}

package/dist/react/useResult.js

@@ -2,11 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useResult = useResult;
 exports.maybeUnwrapNetworkRequest = maybeUnwrapNetworkRequest;
-const IsographEnvironmentProvider_1 = require("../react/IsographEnvironmentProvider");
 const componentCache_1 = require("../core/componentCache");
-const useReadAndSubscribe_1 = require("./useReadAndSubscribe");
-const read_1 = require("../core/read");
 const PromiseWrapper_1 = require("../core/PromiseWrapper");
+const read_1 = require("../core/read");
+const startUpdate_1 = require("../core/startUpdate");
+const IsographEnvironmentProvider_1 = require("../react/IsographEnvironmentProvider");
+const useReadAndSubscribe_1 = require("./useReadAndSubscribe");
 function useResult(fragmentReference, partialNetworkRequestOptions) {
     const environment = (0, IsographEnvironmentProvider_1.useIsographEnvironment)();
     const networkRequestOptions = (0, read_1.getNetworkRequestOptionsWithDefaults)(partialNetworkRequestOptions);
@@ -15,14 +16,15 @@ function useResult(fragmentReference, partialNetworkRequestOptions) {
     switch (readerWithRefetchQueries.readerArtifact.kind) {
         case 'ComponentReaderArtifact': {
             // @ts-expect-error
-            return (0, componentCache_1.getOrCreateCachedComponent)(environment, readerWithRefetchQueries.readerArtifact.componentName, fragmentReference, networkRequestOptions);
+            return (0, componentCache_1.getOrCreateCachedComponent)(environment, readerWithRefetchQueries.readerArtifact.fieldName, fragmentReference, networkRequestOptions);
         }
         case 'EagerReaderArtifact': {
             const data = (0, useReadAndSubscribe_1.useReadAndSubscribe)(fragmentReference, networkRequestOptions, readerWithRefetchQueries.readerArtifact.readerAst);
-            const param = {
-                data: data,
-                parameters: fragmentReference.variables,
-            };
+            const param = Object.assign({ data: data, parameters: fragmentReference.variables }, (readerWithRefetchQueries.readerArtifact.hasUpdatable
+                ? {
+                    startUpdate: (0, startUpdate_1.getOrCreateCachedStartUpdate)(environment, fragmentReference, readerWithRefetchQueries.readerArtifact.fieldName),
+                }
+                : undefined));
             return readerWithRefetchQueries.readerArtifact.resolver(param);
         }
     }

package/isograph.config.json

@@ -1,4 +1,5 @@
 {
+  "$schema": "../isograph-compiler/isograph-config-schema.json",
   "project_root": "./src/tests",
   "schema": "./schema.graphql",
   "options": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@isograph/react",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "description": "Use Isograph with React",
   "homepage": "https://isograph.dev",
   "main": "dist/index.js",
@@ -8,15 +8,16 @@
   "author": "Isograph Labs",
   "license": "MIT",
   "scripts": {
-    "compile": "rm -rf dist/* && tsc -p tsconfig.pkg.json",
+    "compile-typescript": "rm -rf dist/* && tsc -p tsconfig.pkg.json",
     "compile-watch": "tsc -p tsconfig.pkg.json --watch",
     "test": "vitest run",
     "test-watch": "vitest watch",
     "coverage": "vitest run --coverage",
-    "prepack": "pnpm run test && pnpm run compile",
+    "prepack": "pnpm run test && pnpm run compile-typescript",
     "tsc": "tsc",
-    "iso": "../../target/debug/isograph_cli --config ./isograph.config.json",
-    "iso-watch": "../../target/debug/isograph_cli --config ./isograph.config.json --watch"
+    "tsc-force": "tsc --build --clean && tsc --build --force",
+    "iso": "cross-env ../../target/debug/isograph_cli --config ./isograph.config.json",
+    "iso-watch": "cross-env ../../target/debug/isograph_cli --config ./isograph.config.json --watch"
   },
   "dependencies": {
     "@isograph/disposable-types": "*",
@@ -24,7 +25,7 @@
     "@isograph/reference-counted-pointer": "*"
   },
   "peerDependencies": {
-    "react": "18.3.1"
+    "react": "^18.0.0 || ^19.0.0"
   },
   "devDependencies": {
     "@babel/preset-typescript": "^7.24.7",

package/src/core/FragmentReference.ts

@@ -1,12 +1,28 @@
-import { type Link } from './IsographEnvironment';
 import { ReaderWithRefetchQueries } from '../core/entrypoint';
+import { stableCopy } from './cache';
+import { type Link } from './IsographEnvironment';
 import { PromiseWrapper } from './PromiseWrapper';
+import type { StartUpdate } from './reader';
 
 // TODO type this better
-export type VariableValue = string | number | boolean | null | object;
+export type VariableValue =
+  | string
+  | number
+  | boolean
+  | null
+  | {
+      readonly [index: string]: VariableValue;
+    }
+  | VariableValue[];
 
 export type Variables = { readonly [index: string]: VariableValue };
 
+export type UnknownTReadFromStore = {
+  parameters: object;
+  data: object;
+  startUpdate?: StartUpdate<object>;
+};
+
 export type ExtractData<T> = T extends {
   data: infer D extends object;
 }
@@ -19,8 +35,14 @@ export type ExtractParameters<T> = T extends {
   ? P
   : Variables;
 
+export type ExtractStartUpdate<
+  T extends {
+    startUpdate?: StartUpdate<object>;
+  },
+> = T['startUpdate'];
+
 export type FragmentReference<
-  TReadFromStore extends { parameters: object; data: object },
+  TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
 > = {
   readonly kind: 'FragmentReference';
@@ -32,18 +54,11 @@ export type FragmentReference<
   readonly networkRequest: PromiseWrapper<void, any>;
 };
 
+export type StableIdForFragmentReference = string;
+
 export function stableIdForFragmentReference(
   fragmentReference: FragmentReference<any, any>,
-): string {
-  return `${fragmentReference.root.__typename}/${fragmentReference.root.__link}/TODO_FRAGMENT_NAME/${serializeVariables(fragmentReference.variables ?? {})}`;
-}
-
-function serializeVariables(variables: Variables) {
-  let s = '';
-  const keys = Object.keys(variables);
-  keys.sort();
-  for (const key of keys) {
-    s += `${key}:${variables[key]},`;
-  }
-  return s;
+  fieldName: string,
+): StableIdForFragmentReference {
+  return `${fragmentReference.root.__typename}/${fragmentReference.root.__link}/${fieldName}/${JSON.stringify(stableCopy(fragmentReference.variables))}`;
 }

package/src/core/IsographEnvironment.ts

@@ -1,57 +1,61 @@
 import { ParentCache } from '@isograph/react-disposable-state';
-import { RetainedQuery } from './garbageCollection';
-import { WithEncounteredRecords } from './read';
-import { FragmentReference, Variables } from './FragmentReference';
-import { PromiseWrapper, wrapPromise } from './PromiseWrapper';
 import { IsographEntrypoint } from './entrypoint';
-import type { ReaderAst } from './reader';
+import {
+  FragmentReference,
+  Variables,
+  type StableIdForFragmentReference,
+  type UnknownTReadFromStore,
+} from './FragmentReference';
+import { RetainedQuery } from './garbageCollection';
 import { LogFunction, WrappedLogFunction } from './logging';
+import { PromiseWrapper, wrapPromise } from './PromiseWrapper';
+import { WithEncounteredRecords } from './read';
+import type { ReaderAst, StartUpdate } from './reader';
 
 export type ComponentOrFieldName = string;
 export type StringifiedArgs = string;
-type ComponentCache = {
-  [key: DataId]: {
-    [key: ComponentOrFieldName]: { [key: StringifiedArgs]: React.FC<any> };
-  };
-};
 
-export type FragmentSubscription<
-  TReadFromStore extends { parameters: object; data: object },
-> = {
-  readonly kind: 'FragmentSubscription';
-  readonly callback: (
-    newEncounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>,
-  ) => void;
-  /** The value read out from the previous call to readButDoNotEvaluate */
-  readonly encounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>;
-  readonly fragmentReference: FragmentReference<TReadFromStore, any>;
-  readonly readerAst: ReaderAst<TReadFromStore>;
+export type FieldCache<T> = {
+  [key: StableIdForFragmentReference]: T;
 };
 
-type AnyChangesToRecordSubscription = {
+export type FragmentSubscription<TReadFromStore extends UnknownTReadFromStore> =
+  {
+    readonly kind: 'FragmentSubscription';
+    readonly callback: (
+      newEncounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>,
+    ) => void;
+    /** The value read out from the previous call to readButDoNotEvaluate */
+    readonly encounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>;
+    readonly fragmentReference: FragmentReference<TReadFromStore, any>;
+    readonly readerAst: ReaderAst<TReadFromStore>;
+  };
+
+export type AnyChangesToRecordSubscription = {
   readonly kind: 'AnyChangesToRecord';
   readonly callback: () => void;
   readonly recordLink: Link;
 };
 
-type AnyRecordSubscription = {
+export type AnyRecordSubscription = {
   readonly kind: 'AnyRecords';
   readonly callback: () => void;
 };
 
-type Subscription =
-  | FragmentSubscription<{ parameters: object; data: object }>
+export type Subscription =
+  | FragmentSubscription<any>
   | AnyChangesToRecordSubscription
   | AnyRecordSubscription;
-type Subscriptions = Set<Subscription>;
+export type Subscriptions = Set<Subscription>;
 // Should this be a map?
-type CacheMap<T> = { [index: string]: ParentCache<T> };
+export type CacheMap<T> = { [index: string]: ParentCache<T> };
 
 export type IsographEnvironment = {
   readonly store: IsographStore;
   readonly networkFunction: IsographNetworkFunction;
   readonly missingFieldHandler: MissingFieldHandler | null;
-  readonly componentCache: ComponentCache;
+  readonly componentCache: FieldCache<React.FC<any>>;
+  readonly eagerReaderCache: FieldCache<StartUpdate<any> | undefined>;
   readonly subscriptions: Subscriptions;
   // N.B. this must be <any, any>, but all *usages* of this should go through
   // a function that adds type parameters.
@@ -59,7 +63,7 @@ export type IsographEnvironment = {
   // TODO make this a CacheMap and add GC
   readonly entrypointArtifactCache: Map<
     string,
-    PromiseWrapper<IsographEntrypoint<any, any>>
+    PromiseWrapper<IsographEntrypoint<any, any, any>>
   >;
   readonly retainedQueries: Set<RetainedQuery>;
   readonly gcBuffer: Array<RetainedQuery>;
@@ -127,11 +131,15 @@ export function createIsographEnvironment(
   missingFieldHandler?: MissingFieldHandler | null,
   logFunction?: LogFunction | null,
 ): IsographEnvironment {
+  logFunction?.({
+    kind: 'EnvironmentCreated',
+  });
   return {
     store,
     networkFunction,
     missingFieldHandler: missingFieldHandler ?? null,
     componentCache: {},
+    eagerReaderCache: {},
     subscriptions: new Set(),
     fragmentCache: {},
     entrypointArtifactCache: new Map(),
@@ -180,8 +188,8 @@ export function getLink(maybeLink: DataTypeValue): Link | null {
 export function getOrLoadIsographArtifact(
   environment: IsographEnvironment,
   key: string,
-  loader: () => Promise<IsographEntrypoint<any, any>>,
-): PromiseWrapper<IsographEntrypoint<any, any>> {
+  loader: () => Promise<IsographEntrypoint<any, any, any>>,
+): PromiseWrapper<IsographEntrypoint<any, any, any>> {
   const value = environment.entrypointArtifactCache.get(key);
   if (value != null) {
     return value;

package/src/core/PromiseWrapper.ts

@@ -1,9 +1,9 @@
 export type AnyError = any;
 
-const NOT_SET: Symbol = Symbol('NOT_SET');
-type NotSet = typeof NOT_SET;
+export const NOT_SET: Symbol = Symbol('NOT_SET');
+export type NotSet = typeof NOT_SET;
 
-type Result<T, E> =
+export type Result<T, E> =
   | {
       kind: 'Ok';
       value: T;

package/src/core/areEqualWithDeepComparison.ts

@@ -1,4 +1,6 @@
+import type { Link } from './IsographEnvironment';
 import type { ReaderAst, ReaderLinkedField, ReaderScalarField } from './reader';
+
 export function mergeUsingReaderAst(
   field: ReaderScalarField | ReaderLinkedField,
   oldItem: unknown,
@@ -96,6 +98,24 @@ export function mergeObjectsUsingReaderAst(
         }
         break;
       }
+      case 'Link': {
+        const key = field.alias;
+        // @ts-expect-error
+        const oldValue: Link = oldItemObject[key];
+        // @ts-expect-error
+        const newValue: Link = newItemObject[key];
+
+        if (
+          oldValue.__link !== newValue.__link ||
+          oldValue.__typename !== newValue.__typename
+        ) {
+          canRecycle = false;
+        } else {
+          // @ts-expect-error
+          newItemObject[key] = oldValue;
+        }
+        break;
+      }
       case 'ImperativelyLoadedField':
       case 'LoadablySelectedField':
         break;