@graphql-codegen/typescript-react-query 5.1.0-alpha-20231024141714-d4d2e5e06 → 6.0.0

package/esm/visitor.js

@@ -5,9 +5,9 @@ import { CustomMapperFetcher } from './fetcher-custom-mapper.js';
 import { HardcodedFetchFetcher } from './fetcher-fetch-hardcoded.js';
 import { FetchFetcher } from './fetcher-fetch.js';
 import { GraphQLRequestClientFetcher } from './fetcher-graphql-request.js';
-import { generateInfiniteQueryKeyMaker, generateInfiniteQueryRootKeyMaker, generateMutationKeyMaker, generateQueryKeyMaker, generateQueryRootKeyMaker, } from './variables-generator.js';
 export class ReactQueryVisitor extends ClientSideBaseVisitor {
     constructor(schema, fragments, rawConfig, documents) {
+        const defaultReactQueryVersion = !rawConfig.reactQueryVersion && rawConfig.legacyMode ? 3 : 4;
         super(schema, fragments, rawConfig, {
             documentMode: DocumentMode.string,
             errorType: getConfigValue(rawConfig.errorType, 'unknown'),
@@ -17,26 +17,13 @@ export class ReactQueryVisitor extends ClientSideBaseVisitor {
             exposeMutationKeys: getConfigValue(rawConfig.exposeMutationKeys, false),
             exposeFetcher: getConfigValue(rawConfig.exposeFetcher, false),
             addInfiniteQuery: getConfigValue(rawConfig.addInfiniteQuery, false),
-            legacyMode: getConfigValue(rawConfig.legacyMode, false),
+            addSuspenseQuery: getConfigValue(rawConfig.addSuspenseQuery, false),
+            reactQueryVersion: getConfigValue(rawConfig.reactQueryVersion, defaultReactQueryVersion),
             reactQueryImportFrom: getConfigValue(rawConfig.reactQueryImportFrom, ''),
         });
         this.rawConfig = rawConfig;
         this.reactQueryHookIdentifiersInUse = new Set();
         this.reactQueryOptionsIdentifiersInUse = new Set();
-        this.queryMethodMap = {
-            infiniteQuery: {
-                hook: 'useInfiniteQuery',
-                options: 'UseInfiniteQueryOptions',
-            },
-            query: {
-                hook: 'useQuery',
-                options: 'UseQueryOptions',
-            },
-            mutation: {
-                hook: 'useMutation',
-                options: 'UseMutationOptions',
-            },
-        };
         this._externalImportPrefix = this.config.importOperationTypesFrom
             ? `${this.config.importOperationTypesFrom}.`
             : '';
@@ -73,13 +60,13 @@ export class ReactQueryVisitor extends ClientSideBaseVisitor {
         ];
         const moduleName = this.config.reactQueryImportFrom
             ? this.config.reactQueryImportFrom
-            : this.config.legacyMode
+            : this.config.reactQueryVersion <= 3
                 ? 'react-query'
                 : '@tanstack/react-query';
         return [...baseImports, `import { ${hookAndTypeImports.join(', ')} } from '${moduleName}';`];
     }
     getFetcherImplementation() {
-        return this.fetcher.generateFetcherImplementaion();
+        return this.fetcher.generateFetcherImplementation();
     }
     _getHookSuffix(name, operationType) {
         if (this.config.omitOperationSuffix) {
@@ -102,45 +89,63 @@ export class ReactQueryVisitor extends ClientSideBaseVisitor {
             useTypesPrefix: false,
             useTypesSuffix: false,
         });
+        const generateConfig = {
+            node,
+            documentVariableName,
+            operationResultType,
+            operationVariablesTypes,
+            hasRequiredVariables,
+            operationName,
+        };
         operationResultType = this._externalImportPrefix + operationResultType;
         operationVariablesTypes = this._externalImportPrefix + operationVariablesTypes;
+        const queries = [];
+        const getOutputFromQueries = () => `\n${queries.join('\n\n')}\n`;
         if (operationType === 'Query') {
-            let query = this.fetcher.generateQueryHook(node, documentVariableName, operationName, operationResultType, operationVariablesTypes, hasRequiredVariables);
-            if (this.config.exposeDocument) {
-                query += `\nuse${operationName}.document = ${documentVariableName};\n`;
-            }
-            if (this.config.exposeQueryKeys) {
-                query += `\n${generateQueryKeyMaker(node, operationName, operationVariablesTypes, hasRequiredVariables)};\n`;
-            }
-            if (this.config.exposeQueryRootKeys) {
-                query += `\n${generateQueryRootKeyMaker(node, operationName)}`;
-            }
+            const addQuery = (generateConfig, isSuspense = false) => {
+                const { hook, getKey, rootKey, document } = this.fetcher.generateQueryOutput(generateConfig, isSuspense);
+                queries.push(hook);
+                if (this.config.exposeDocument)
+                    queries.push(document);
+                if (this.config.exposeQueryKeys)
+                    queries.push(getKey);
+                if (this.config.exposeQueryRootKeys)
+                    queries.push(rootKey);
+            };
+            addQuery(generateConfig);
+            if (this.config.addSuspenseQuery)
+                addQuery(generateConfig, true);
             if (this.config.addInfiniteQuery) {
-                query += `\n${this.fetcher.generateInfiniteQueryHook(node, documentVariableName, operationName, operationResultType, operationVariablesTypes, hasRequiredVariables)}\n`;
-                if (this.config.exposeQueryKeys) {
-                    query += `\n${generateInfiniteQueryKeyMaker(node, operationName, operationVariablesTypes, hasRequiredVariables)};\n`;
-                }
-                if (this.config.exposeQueryRootKeys) {
-                    query += `\n${generateInfiniteQueryRootKeyMaker(node, operationName)}`;
+                const addInfiniteQuery = (generateConfig, isSuspense = false) => {
+                    const { hook, getKey, rootKey } = this.fetcher.generateInfiniteQueryOutput(generateConfig, isSuspense);
+                    queries.push(hook);
+                    if (this.config.exposeQueryKeys)
+                        queries.push(getKey);
+                    if (this.config.exposeQueryRootKeys)
+                        queries.push(rootKey);
+                };
+                addInfiniteQuery(generateConfig);
+                if (this.config.addSuspenseQuery) {
+                    addInfiniteQuery(generateConfig, true);
                 }
             }
             // The reason we're looking at the private field of the CustomMapperFetcher to see if it's a react hook
             // is to prevent calling generateFetcherFetch for each query since all the queries won't be able to generate
             // a fetcher field anyways.
             if (this.config.exposeFetcher && !this.fetcher._isReactHook) {
-                query += this.fetcher.generateFetcherFetch(node, documentVariableName, operationName, operationResultType, operationVariablesTypes, hasRequiredVariables);
+                queries.push(this.fetcher.generateFetcherFetch(generateConfig));
             }
-            return query;
+            return getOutputFromQueries();
         }
         if (operationType === 'Mutation') {
-            let query = this.fetcher.generateMutationHook(node, documentVariableName, operationName, operationResultType, operationVariablesTypes, hasRequiredVariables);
-            if (this.config.exposeMutationKeys) {
-                query += generateMutationKeyMaker(node, operationName);
-            }
+            const { hook, getKey } = this.fetcher.generateMutationOutput(generateConfig);
+            queries.push(hook);
+            if (this.config.exposeMutationKeys)
+                queries.push(getKey);
             if (this.config.exposeFetcher && !this.fetcher._isReactHook) {
-                query += this.fetcher.generateFetcherFetch(node, documentVariableName, operationName, operationResultType, operationVariablesTypes, hasRequiredVariables);
+                queries.push(this.fetcher.generateFetcherFetch(generateConfig));
             }
-            return query;
+            return getOutputFromQueries();
         }
         if (operationType === 'Subscription') {
             // eslint-disable-next-line no-console

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@graphql-codegen/typescript-react-query",
-  "version": "5.1.0-alpha-20231024141714-d4d2e5e06",
+  "version": "6.0.0",
   "description": "GraphQL Code Generator plugin for generating a ready-to-use React-Query Hooks based on GraphQL operations",
   "peerDependencies": {
     "graphql": "^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0"

package/typings/config.d.cts

@@ -10,26 +10,12 @@ export type CustomFetch = {
 export type GraphQlRequest = 'graphql-request' | {
     clientImportPath: string;
 };
-/**
- * @description This plugin generates `React-Query` Hooks with TypeScript typings.
- *
- * It extends the basic TypeScript plugins: `@graphql-codegen/typescript`, `@graphql-codegen/typescript-operations` - and thus shares a similar configuration.
- *
- * > **If you are using the `react-query` package instead of the `@tanstack/react-query` package in your project, please set the `legacyMode` option to `true`.**
- *
- */
-export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginConfig, 'documentMode' | 'noGraphQLTag' | 'gqlImport' | 'documentNodeImport' | 'noExport' | 'importOperationTypesFrom' | 'importDocumentNodeExternallyFrom' | 'useTypeImports' | 'legacyMode'> {
+export interface BaseReactQueryPluginConfig {
     /**
-     * @description Customize the fetcher you wish to use in the generated file. React-Query is agnostic to the data-fetching layer, so you should provide it, or use a custom one.
-     *
-     * The following options are available to use:
-     *
-     * - 'fetch' - requires you to specify endpoint and headers on each call, and uses `fetch` to do the actual http call.
-     * - `{ endpoint: string, fetchParams: RequestInit }`: hardcode your endpoint and fetch options into the generated output, using the environment `fetch` method. You can also use `process.env.MY_VAR` as endpoint or header value.
-     * - `file#identifier` - You can use custom fetcher method that should implement the exported `ReactQueryFetcher` interface. Example: `./my-fetcher#myCustomFetcher`.
-     * - `graphql-request`: Will generate each hook with `client` argument, where you should pass your own `GraphQLClient` (created from `graphql-request`).
+     * @default unknown
+     * @description Changes the default "TError" generic type.
      */
-    fetcher?: 'fetch' | HardcodedFetch | GraphQlRequest | CustomFetch;
+    errorType?: string;
     /**
      * @default false
      * @description For each generate query hook adds `document` field with a
@@ -85,21 +71,27 @@ export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginC
      * ```
      */
     exposeFetcher?: boolean;
-    /**
-     * @default unknown
-     * @description Changes the default "TError" generic type.
-     */
-    errorType?: string;
     /**
      * @default false
      * @description Adds an Infinite Query along side the standard one
      */
     addInfiniteQuery?: boolean;
+    /**
+     * @default false
+     * @description Adds a Suspense Query along side the standard one
+     */
+    addSuspenseQuery?: boolean;
     /**
      * @default false
      * @description If true, it imports `react-query` not `@tanstack/react-query`, default is false.
+     * @deprecated Please use `reactQueryVersion` instead.
      */
     legacyMode?: boolean;
+    /**
+     * @default 4
+     * @description The version of react-query to use. Will override the legacyMode option.
+     */
+    reactQueryVersion?: 3 | 4 | 5;
     /**
      * @default empty
      * @description Add custom import for react-query.
@@ -111,3 +103,24 @@ export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginC
      */
     reactQueryImportFrom?: string;
 }
+/**
+ * @description This plugin generates `React-Query` Hooks with TypeScript typings.
+ *
+ * It extends the basic TypeScript plugins: `@graphql-codegen/typescript`, `@graphql-codegen/typescript-operations` - and thus shares a similar configuration.
+ *
+ * > **If you are using the `react-query` package instead of the `@tanstack/react-query` package in your project, please set the `legacyMode` option to `true`.**
+ *
+ */
+export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginConfig, 'documentMode' | 'noGraphQLTag' | 'gqlImport' | 'documentNodeImport' | 'noExport' | 'importOperationTypesFrom' | 'importDocumentNodeExternallyFrom' | 'useTypeImports' | 'legacyMode'>, BaseReactQueryPluginConfig {
+    /**
+     * @description Customize the fetcher you wish to use in the generated file. React-Query is agnostic to the data-fetching layer, so you should provide it, or use a custom one.
+     *
+     * The following options are available to use:
+     *
+     * - 'fetch' - requires you to specify endpoint and headers on each call, and uses `fetch` to do the actual http call.
+     * - `{ endpoint: string, fetchParams: RequestInit }`: hardcode your endpoint and fetch options into the generated output, using the environment `fetch` method. You can also use `process.env.MY_VAR` as endpoint or header value.
+     * - `file#identifier` - You can use custom fetcher method that should implement the exported `ReactQueryFetcher` interface. Example: `./my-fetcher#myCustomFetcher`.
+     * - `graphql-request`: Will generate each hook with `client` argument, where you should pass your own `GraphQLClient` (created from `graphql-request`).
+     */
+    fetcher?: 'fetch' | HardcodedFetch | GraphQlRequest | CustomFetch;
+}

package/typings/config.d.ts

@@ -10,26 +10,12 @@ export type CustomFetch = {
 export type GraphQlRequest = 'graphql-request' | {
     clientImportPath: string;
 };
-/**
- * @description This plugin generates `React-Query` Hooks with TypeScript typings.
- *
- * It extends the basic TypeScript plugins: `@graphql-codegen/typescript`, `@graphql-codegen/typescript-operations` - and thus shares a similar configuration.
- *
- * > **If you are using the `react-query` package instead of the `@tanstack/react-query` package in your project, please set the `legacyMode` option to `true`.**
- *
- */
-export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginConfig, 'documentMode' | 'noGraphQLTag' | 'gqlImport' | 'documentNodeImport' | 'noExport' | 'importOperationTypesFrom' | 'importDocumentNodeExternallyFrom' | 'useTypeImports' | 'legacyMode'> {
+export interface BaseReactQueryPluginConfig {
     /**
-     * @description Customize the fetcher you wish to use in the generated file. React-Query is agnostic to the data-fetching layer, so you should provide it, or use a custom one.
-     *
-     * The following options are available to use:
-     *
-     * - 'fetch' - requires you to specify endpoint and headers on each call, and uses `fetch` to do the actual http call.
-     * - `{ endpoint: string, fetchParams: RequestInit }`: hardcode your endpoint and fetch options into the generated output, using the environment `fetch` method. You can also use `process.env.MY_VAR` as endpoint or header value.
-     * - `file#identifier` - You can use custom fetcher method that should implement the exported `ReactQueryFetcher` interface. Example: `./my-fetcher#myCustomFetcher`.
-     * - `graphql-request`: Will generate each hook with `client` argument, where you should pass your own `GraphQLClient` (created from `graphql-request`).
+     * @default unknown
+     * @description Changes the default "TError" generic type.
      */
-    fetcher?: 'fetch' | HardcodedFetch | GraphQlRequest | CustomFetch;
+    errorType?: string;
     /**
      * @default false
      * @description For each generate query hook adds `document` field with a
@@ -85,21 +71,27 @@ export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginC
      * ```
      */
     exposeFetcher?: boolean;
-    /**
-     * @default unknown
-     * @description Changes the default "TError" generic type.
-     */
-    errorType?: string;
     /**
      * @default false
      * @description Adds an Infinite Query along side the standard one
      */
     addInfiniteQuery?: boolean;
+    /**
+     * @default false
+     * @description Adds a Suspense Query along side the standard one
+     */
+    addSuspenseQuery?: boolean;
     /**
      * @default false
      * @description If true, it imports `react-query` not `@tanstack/react-query`, default is false.
+     * @deprecated Please use `reactQueryVersion` instead.
      */
     legacyMode?: boolean;
+    /**
+     * @default 4
+     * @description The version of react-query to use. Will override the legacyMode option.
+     */
+    reactQueryVersion?: 3 | 4 | 5;
     /**
      * @default empty
      * @description Add custom import for react-query.
@@ -111,3 +103,24 @@ export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginC
      */
     reactQueryImportFrom?: string;
 }
+/**
+ * @description This plugin generates `React-Query` Hooks with TypeScript typings.
+ *
+ * It extends the basic TypeScript plugins: `@graphql-codegen/typescript`, `@graphql-codegen/typescript-operations` - and thus shares a similar configuration.
+ *
+ * > **If you are using the `react-query` package instead of the `@tanstack/react-query` package in your project, please set the `legacyMode` option to `true`.**
+ *
+ */
+export interface ReactQueryRawPluginConfig extends Omit<RawClientSideBasePluginConfig, 'documentMode' | 'noGraphQLTag' | 'gqlImport' | 'documentNodeImport' | 'noExport' | 'importOperationTypesFrom' | 'importDocumentNodeExternallyFrom' | 'useTypeImports' | 'legacyMode'>, BaseReactQueryPluginConfig {
+    /**
+     * @description Customize the fetcher you wish to use in the generated file. React-Query is agnostic to the data-fetching layer, so you should provide it, or use a custom one.
+     *
+     * The following options are available to use:
+     *
+     * - 'fetch' - requires you to specify endpoint and headers on each call, and uses `fetch` to do the actual http call.
+     * - `{ endpoint: string, fetchParams: RequestInit }`: hardcode your endpoint and fetch options into the generated output, using the environment `fetch` method. You can also use `process.env.MY_VAR` as endpoint or header value.
+     * - `file#identifier` - You can use custom fetcher method that should implement the exported `ReactQueryFetcher` interface. Example: `./my-fetcher#myCustomFetcher`.
+     * - `graphql-request`: Will generate each hook with `client` argument, where you should pass your own `GraphQLClient` (created from `graphql-request`).
+     */
+    fetcher?: 'fetch' | HardcodedFetch | GraphQlRequest | CustomFetch;
+}

package/typings/fetcher-custom-mapper.d.cts

@@ -1,16 +1,15 @@
-import { OperationDefinitionNode } from 'graphql';
 import { CustomFetch } from './config.cjs';
-import { FetcherRenderer } from './fetcher.cjs';
+import { FetcherRenderer, type GenerateConfig } from './fetcher.cjs';
 import { ReactQueryVisitor } from './visitor.cjs';
-export declare class CustomMapperFetcher implements FetcherRenderer {
-    private visitor;
+export declare class CustomMapperFetcher extends FetcherRenderer {
+    protected visitor: ReactQueryVisitor;
     private _mapper;
     private _isReactHook;
     constructor(visitor: ReactQueryVisitor, customFetcher: CustomFetch);
     private getFetcherFnName;
-    generateFetcherImplementaion(): string;
-    generateInfiniteQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateMutationHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateFetcherFetch(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
+    generateFetcherImplementation(): string;
+    generateInfiniteQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateMutationHook(config: GenerateConfig): string;
+    generateFetcherFetch(config: GenerateConfig): string;
 }

package/typings/fetcher-custom-mapper.d.ts

@@ -1,16 +1,15 @@
-import { OperationDefinitionNode } from 'graphql';
 import { CustomFetch } from './config.js';
-import { FetcherRenderer } from './fetcher.js';
+import { FetcherRenderer, type GenerateConfig } from './fetcher.js';
 import { ReactQueryVisitor } from './visitor.js';
-export declare class CustomMapperFetcher implements FetcherRenderer {
-    private visitor;
+export declare class CustomMapperFetcher extends FetcherRenderer {
+    protected visitor: ReactQueryVisitor;
     private _mapper;
     private _isReactHook;
     constructor(visitor: ReactQueryVisitor, customFetcher: CustomFetch);
     private getFetcherFnName;
-    generateFetcherImplementaion(): string;
-    generateInfiniteQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateMutationHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateFetcherFetch(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
+    generateFetcherImplementation(): string;
+    generateInfiniteQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateMutationHook(config: GenerateConfig): string;
+    generateFetcherFetch(config: GenerateConfig): string;
 }

package/typings/fetcher-fetch-hardcoded.d.cts

@@ -1,16 +1,15 @@
-import { OperationDefinitionNode } from 'graphql';
 import { HardcodedFetch } from './config.cjs';
-import { FetcherRenderer } from './fetcher.cjs';
+import { FetcherRenderer, type GenerateConfig } from './fetcher.cjs';
 import { ReactQueryVisitor } from './visitor.cjs';
-export declare class HardcodedFetchFetcher implements FetcherRenderer {
-    private visitor;
+export declare class HardcodedFetchFetcher extends FetcherRenderer {
+    protected visitor: ReactQueryVisitor;
     private config;
     constructor(visitor: ReactQueryVisitor, config: HardcodedFetch);
     private getEndpoint;
     private getFetchParams;
-    generateFetcherImplementaion(): string;
-    generateInfiniteQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateMutationHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateFetcherFetch(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
+    generateFetcherImplementation(): string;
+    generateInfiniteQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateMutationHook(config: GenerateConfig): string;
+    generateFetcherFetch(config: GenerateConfig): string;
 }

package/typings/fetcher-fetch-hardcoded.d.ts

@@ -1,16 +1,15 @@
-import { OperationDefinitionNode } from 'graphql';
 import { HardcodedFetch } from './config.js';
-import { FetcherRenderer } from './fetcher.js';
+import { FetcherRenderer, type GenerateConfig } from './fetcher.js';
 import { ReactQueryVisitor } from './visitor.js';
-export declare class HardcodedFetchFetcher implements FetcherRenderer {
-    private visitor;
+export declare class HardcodedFetchFetcher extends FetcherRenderer {
+    protected visitor: ReactQueryVisitor;
     private config;
     constructor(visitor: ReactQueryVisitor, config: HardcodedFetch);
     private getEndpoint;
     private getFetchParams;
-    generateFetcherImplementaion(): string;
-    generateInfiniteQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateMutationHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateFetcherFetch(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
+    generateFetcherImplementation(): string;
+    generateInfiniteQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateMutationHook(config: GenerateConfig): string;
+    generateFetcherFetch(config: GenerateConfig): string;
 }

package/typings/fetcher-fetch.d.cts

@@ -1,12 +1,11 @@
-import { OperationDefinitionNode } from 'graphql';
-import { FetcherRenderer } from './fetcher.cjs';
+import { FetcherRenderer, type GenerateConfig } from './fetcher.cjs';
 import { ReactQueryVisitor } from './visitor.cjs';
-export declare class FetchFetcher implements FetcherRenderer {
-    private visitor;
+export declare class FetchFetcher extends FetcherRenderer {
+    protected visitor: ReactQueryVisitor;
     constructor(visitor: ReactQueryVisitor);
-    generateFetcherImplementaion(): string;
-    generateInfiniteQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateMutationHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateFetcherFetch(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
+    generateFetcherImplementation(): string;
+    generateInfiniteQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateMutationHook(config: GenerateConfig): string;
+    generateFetcherFetch(config: GenerateConfig): string;
 }

package/typings/fetcher-fetch.d.ts

@@ -1,12 +1,11 @@
-import { OperationDefinitionNode } from 'graphql';
-import { FetcherRenderer } from './fetcher.js';
+import { FetcherRenderer, type GenerateConfig } from './fetcher.js';
 import { ReactQueryVisitor } from './visitor.js';
-export declare class FetchFetcher implements FetcherRenderer {
-    private visitor;
+export declare class FetchFetcher extends FetcherRenderer {
+    protected visitor: ReactQueryVisitor;
     constructor(visitor: ReactQueryVisitor);
-    generateFetcherImplementaion(): string;
-    generateInfiniteQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateMutationHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateFetcherFetch(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
+    generateFetcherImplementation(): string;
+    generateInfiniteQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateMutationHook(config: GenerateConfig): string;
+    generateFetcherFetch(config: GenerateConfig): string;
 }

package/typings/fetcher-graphql-request.d.cts

@@ -1,14 +1,13 @@
-import { OperationDefinitionNode } from 'graphql';
 import { GraphQlRequest } from './config.cjs';
-import { FetcherRenderer } from './fetcher.cjs';
+import { FetcherRenderer, type GenerateConfig } from './fetcher.cjs';
 import { ReactQueryVisitor } from './visitor.cjs';
-export declare class GraphQLRequestClientFetcher implements FetcherRenderer {
-    private visitor;
+export declare class GraphQLRequestClientFetcher extends FetcherRenderer {
+    protected visitor: ReactQueryVisitor;
     private clientPath;
     constructor(visitor: ReactQueryVisitor, config: GraphQlRequest);
-    generateFetcherImplementaion(): string;
-    generateInfiniteQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateMutationHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateFetcherFetch(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
+    generateFetcherImplementation(): string;
+    generateInfiniteQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateMutationHook(config: GenerateConfig): string;
+    generateFetcherFetch(config: GenerateConfig): string;
 }

package/typings/fetcher-graphql-request.d.ts

@@ -1,14 +1,13 @@
-import { OperationDefinitionNode } from 'graphql';
 import { GraphQlRequest } from './config.js';
-import { FetcherRenderer } from './fetcher.js';
+import { FetcherRenderer, type GenerateConfig } from './fetcher.js';
 import { ReactQueryVisitor } from './visitor.js';
-export declare class GraphQLRequestClientFetcher implements FetcherRenderer {
-    private visitor;
+export declare class GraphQLRequestClientFetcher extends FetcherRenderer {
+    protected visitor: ReactQueryVisitor;
     private clientPath;
     constructor(visitor: ReactQueryVisitor, config: GraphQlRequest);
-    generateFetcherImplementaion(): string;
-    generateInfiniteQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateQueryHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateMutationHook(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
-    generateFetcherFetch(node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean): string;
+    generateFetcherImplementation(): string;
+    generateInfiniteQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    generateMutationHook(config: GenerateConfig): string;
+    generateFetcherFetch(config: GenerateConfig): string;
 }

package/typings/fetcher.d.cts

@@ -1,8 +1,75 @@
 import { OperationDefinitionNode } from 'graphql';
-export interface FetcherRenderer {
-    generateFetcherImplementaion: () => string;
-    generateQueryHook: (node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean) => string;
-    generateInfiniteQueryHook: (node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean) => string;
-    generateMutationHook: (node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean) => string;
-    generateFetcherFetch: (node: OperationDefinitionNode, documentVariableName: string, operationName: string, operationResultType: string, operationVariablesTypes: string, hasRequiredVariables: boolean) => string;
+import { ReactQueryVisitor } from './visitor.cjs';
+export interface GenerateConfig {
+    node: OperationDefinitionNode;
+    documentVariableName: string;
+    operationName: string;
+    operationResultType: string;
+    operationVariablesTypes: string;
+    hasRequiredVariables: boolean;
 }
+interface GenerateBaseHookConfig {
+    implArguments?: string;
+    implHookOuter?: string;
+    implFetcher: string;
+}
+type ReactQueryMethodMap = {
+    [key: string]: {
+        getHook: (operationName?: string) => string;
+        getOptions: () => string;
+        getOtherTypes?: () => {
+            [key: string]: string;
+        };
+    };
+};
+export declare abstract class FetcherRenderer {
+    protected visitor: ReactQueryVisitor;
+    constructor(visitor: ReactQueryVisitor);
+    abstract generateFetcherImplementation(): string;
+    abstract generateFetcherFetch(config: GenerateConfig): string;
+    protected abstract generateQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    protected abstract generateInfiniteQueryHook(config: GenerateConfig, isSuspense?: boolean): string;
+    protected abstract generateMutationHook(config: GenerateConfig): string;
+    createQueryMethodMap(isSuspense?: boolean): ReactQueryMethodMap;
+    protected generateInfiniteQueryHelper(config: GenerateConfig, isSuspense: boolean): {
+        generateBaseInfiniteQueryHook: (hookConfig: GenerateBaseHookConfig) => string;
+        variables: string;
+        options: string;
+    };
+    protected generateQueryHelper(config: GenerateConfig, isSuspense: boolean): {
+        generateBaseQueryHook: (hookConfig: GenerateBaseHookConfig) => string;
+        variables: string;
+        options: string;
+    };
+    protected generateMutationHelper(config: GenerateConfig): {
+        generateBaseMutationHook: (hookConfig: GenerateBaseHookConfig) => string;
+        variables: string;
+        options: string;
+    };
+    protected generateQueryVariablesSignature({ hasRequiredVariables, operationVariablesTypes, }: GenerateConfig): string;
+    private generateQueryOptionsSignature;
+    private generateInfiniteQueryVariablesSignature;
+    private generateInfiniteQueryOptionsSignature;
+    generateInfiniteQueryKey(config: GenerateConfig, isSuspense: boolean): string;
+    generateInfiniteQueryOutput(config: GenerateConfig, isSuspense?: boolean): {
+        hook: string;
+        getKey: string;
+        rootKey: string;
+    };
+    generateQueryKey(config: GenerateConfig, isSuspense: boolean): string;
+    generateQueryOutput(config: GenerateConfig, isSuspense?: boolean): {
+        hook: string;
+        document: string;
+        getKey: string;
+        rootKey: string;
+    };
+    generateMutationKey({ node }: GenerateConfig): string;
+    generateMutationOutput(config: GenerateConfig): {
+        hook: string;
+        getKey: string;
+    };
+    private generateInfiniteQueryFormattedParameters;
+    private generateQueryFormattedParameters;
+    private generateMutationFormattedParameters;
+}
+export {};