@lewebsimple/nuxt-graphql 0.5.12 → 0.6.0

package/dist/module.d.mts

@@ -1,5 +1,6 @@
 import * as _nuxt_schema from '@nuxt/schema';
 import { HeadersInput } from '../dist/runtime/shared/lib/headers.js';
+import { CacheConfig } from '../dist/runtime/app/lib/cache.js';
 
 type LocalSchemaDef = {
     type: "local";
@@ -9,56 +10,22 @@ type RemoteSchemaDef = {
     type: "remote";
     endpoint: string;
     headers?: HeadersInput;
+    hooks?: string[];
 };
 type SchemaDef = LocalSchemaDef | RemoteSchemaDef;
 
 interface NuxtGraphQLModuleOptions {
-    /**
-     * Client-side GraphQL configuration (HTTP + cache).
-     */
     client?: {
-        /**
-         * Global cache configuration for queries.
-         */
-        cache?: Partial<GraphQLCacheConfig>;
-        /**
-         * GraphQL documents glob pattern.
-         * Default: "**\/*.gql"
-         */
         documents?: string;
-        /**
-         * Headers forwarded from the SSR request to graphql-request.
-         * Default: ["authorization", "cookie"]
-         */
+        cache?: Partial<CacheConfig>;
         ssrForwardHeaders?: string[];
     };
-    /**
-     * Where to write graphql.config.json.
-     * Resolved from rootDir.
-     * Default: ./graphql.config.json
-     */
-    saveConfig?: string;
-    /**
-     * Where to write the stitched GraphQL SDL.
-     * Resolved from rootDir.
-     * Default: server/graphql/schema.graphql
-     */
-    saveSDL?: string;
-    /**
-     * Server-side GraphQL configuration (Yoga server + execution).
-     */
     server?: {
-        /**
-         * Paths to GraphQL server context factories relative to rootDir.
-         * export default defineGraphQLContext((event: H3Event) => Promise<Record<string, unknown>>)
-         */
         context?: string[];
-        /**
-         * GraphQL schema definition.
-         * Key = schemaName.
-         */
         schema?: Record<string, SchemaDef>;
     };
+    saveConfig?: string;
+    saveSDL?: string;
 }
 declare const _default: _nuxt_schema.NuxtModule<NuxtGraphQLModuleOptions, NuxtGraphQLModuleOptions, false>;
 

package/dist/module.json

@@ -1,7 +1,7 @@
 {
-  "name": "nuxt-graphql",
+  "name": "@lewebsimple/nuxt-graphql",
   "configKey": "graphql",
-  "version": "0.5.12",
+  "version": "0.6.0",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -2,16 +2,17 @@ import { mkdirSync, writeFileSync } from 'node:fs';
 import { relative, resolve, dirname } from 'node:path';
 import { defu } from 'defu';
 import { stitchSchemas } from '@graphql-tools/stitch';
-import { defineNuxtModule, useLogger, createResolver, addTemplate, addServerTemplate, addTypeTemplate, addServerHandler, addPlugin, addImportsDir, addServerImportsDir } from '@nuxt/kit';
+import { addTemplate, addServerTemplate, defineNuxtModule, useLogger, createResolver, addServerHandler, addPlugin, addImportsDir, addServerImportsDir } from '@nuxt/kit';
 import { hash } from 'ohash';
+import { createRequire } from 'node:module';
 import { printSchema, lexicographicSortSchema, buildSchema, getIntrospectionQuery, buildClientSchema, GraphQLSchema, Kind } from 'graphql';
-import { resolveCacheConfig } from '../dist/runtime/shared/lib/cache.js';
 import { loadDocuments } from '@graphql-tools/load';
 import { GraphQLFileLoader } from '@graphql-tools/graphql-file-loader';
 import { codegen } from '@graphql-codegen/core';
 import * as typescriptPlugin from '@graphql-codegen/typescript';
 import * as typescriptOperationsPlugin from '@graphql-codegen/typescript-operations';
 import * as typedDocumentNodePlugin from '@graphql-codegen/typed-document-node';
+import { resolveCacheConfig } from '../dist/runtime/app/lib/cache.js';
 
 const buildCache = /* @__PURE__ */ new Map();
 function getCachedLoader(baseKey, loader) {
@@ -43,21 +44,45 @@ function clearBuildCache(baseKey) {
 const cyan = "\x1B[36m";
 const reset = "\x1B[0m";
 
+const require$1 = createRequire(import.meta.url);
+function splitModule(ts) {
+  const tsCompiler = require$1("typescript");
+  const fileName = "module.ts";
+  const outputs = {};
+  const compilerOptions = {
+    target: tsCompiler.ScriptTarget.ES2020,
+    module: tsCompiler.ModuleKind.ESNext,
+    moduleResolution: tsCompiler.ModuleResolutionKind.NodeNext,
+    declaration: true,
+    importsNotUsedAsValues: tsCompiler.ImportsNotUsedAsValues.Remove,
+    preserveValueImports: false
+  };
+  const host = tsCompiler.createCompilerHost(compilerOptions, true);
+  host.getSourceFile = (name) => name === fileName ? tsCompiler.createSourceFile(fileName, ts, tsCompiler.ScriptTarget.ESNext, true) : void 0;
+  host.readFile = () => ts;
+  host.fileExists = (f) => f === fileName;
+  host.writeFile = (name, content) => {
+    outputs[name] = content;
+  };
+  const program = tsCompiler.createProgram([fileName], compilerOptions, host);
+  program.emit();
+  return {
+    mjs: Object.entries(outputs).find(([n]) => n.endsWith(".js"))?.[1]?.trim() ?? "",
+    dts: Object.entries(outputs).find(([n]) => n.endsWith(".d.ts"))?.[1]?.trim() ?? ""
+  };
+}
+
 function getContextTemplate({ importPaths }) {
   const contextImports = importPaths.map((importPath, index) => `import context${index} from ${JSON.stringify(importPath)};`);
   const contextTypes = ["{}", ...importPaths.map((_, index) => `Awaited<ReturnType<typeof context${index}>>`)];
-  const contextTsArray = ["(event: H3Event) => ({})", ...importPaths.map((_, index) => `context${index}`)];
-  const contextMjsArray = ["(event) => ({})", ...importPaths.map((_, index) => `context${index}`)];
-  const types = `
+  const contextArray = ["(event: H3Event) => ({})", ...importPaths.map((_, index) => `context${index}`)];
+  const ts = `
 import type { H3Event } from "h3";
 ${contextImports.join("\n")}
 
 export type GraphQLContext = ${contextTypes.join(" & ")};
-  `.trim();
-  const ts = `
-${types}
 
-const contextFactories = [${contextTsArray.join(", ")}];
+const contextFactories = [${contextArray.join(", ")}];
 
 export async function createContext(event: H3Event): Promise<GraphQLContext> {
   return Object.assign(
@@ -65,24 +90,7 @@ export async function createContext(event: H3Event): Promise<GraphQLContext> {
     ...await Promise.all(contextFactories.map((factory) => factory(event)))
   )
 }`.trim();
-  const mjs = `
-${contextImports.join("\n")}
-
-const contextFactories = [${contextMjsArray.join(", ")}];
-
-export async function createContext(event) {
-  return Object.assign(
-    {},
-    ...await Promise.all(contextFactories.map((factory) => factory(event)))
-  )
-}
-  `.trim();
-  const dts = `
-${types}
-
-export async function createContext(event: H3Event): Promise<GraphQLContext>;
-  `.trim();
-  return { ts, mjs, dts };
+  return { ts, ...splitModule(ts) };
 }
 
 function getRelativePath(from, to) {
@@ -110,12 +118,10 @@ ${localImports.join("\n")}
 ${remoteImports.join("\n")}
 
 export const schema = stitchSchemas({
-  subschemas: [
-    ${[mergedSchema, ...remoteSchemas].join(",\n    ")}
-  ],
+  subschemas: [${[mergedSchema, ...remoteSchemas].join(", ")}],
 });
   `.trim();
-  return ts;
+  return { ts, ...splitModule(ts) };
 }
 async function loadLocalSchema({ importPath }) {
   const { createJiti } = await import('jiti');
@@ -126,23 +132,21 @@ async function loadLocalSchema({ importPath }) {
   }
   return module.schema;
 }
-function getSchemaSDL(schema) {
-  return printSchema(lexicographicSortSchema(schema));
-}
-function getDefaultSchema() {
-  return buildSchema(`type Query { _empty: String }`);
-}
-
-async function getRemoteSchemaTemplate({ endpoint, loadSchema }) {
+async function getRemoteSchemaTemplate({ endpoint, headers, hooks, loadSchema }) {
+  const hooksImports = hooks.map((hook, index) => `import hook${index} from ${JSON.stringify(hook.importPath)};`);
+  const hooksArray = hooks.map((_, index) => `hook${index}`);
   const schema = await loadSchema();
   const sdl = getSchemaSDL(schema);
-  return `
+  const ts = `
+import type { GraphQLSchema } from "graphql";
 import { buildSchema } from "graphql";
-import { buildHTTPExecutor } from "@graphql-tools/executor-http";
+import { getRemoteExecutor } from "#graphql/runtime/remote-executor";
+${hooksImports.join("\n")}
 
-const executor = buildHTTPExecutor({
+const executor = getRemoteExecutor({
   endpoint: "${endpoint}",
-  fetch: globalThis.fetch,
+  headers: ${JSON.stringify(headers)},
+  hooks: [${hooksArray.join(", ")}],
 });
 
 const sdl = \`${sdl.replace(/`/g, "\\`")}\`;
@@ -151,8 +155,9 @@ const sdl = \`${sdl.replace(/`/g, "\\`")}\`;
 export const schema = {
   schema: buildSchema(sdl),
   executor,
-}
+} as unknown as GraphQLSchema;
   `.trim();
+  return { ts, ...splitModule(ts) };
 }
 async function introspectRemoteSchema({ endpoint }) {
   const response = await fetch(endpoint, {
@@ -179,65 +184,26 @@ function stripSubscriptions(schema) {
     directives: schema.getDirectives()
   });
 }
-
-function renderAppTypesTemplate() {
-  return `
-import type { GraphQLClient } from "graphql-request";
-import type { Client as SSEClient } from "graphql-sse";
-
-declare module "#app/nuxt" {
-  interface NuxtApp {
-    $getGraphQLClient: () => GraphQLClient;
-    $getGraphQLSSEClient: () => SSEClient;
-  }
-}
-
-declare module "#app" {
-  interface NuxtApp {
-    $getGraphQLClient: () => GraphQLClient;
-    $getGraphQLSSEClient: () => SSEClient;
-  }
-}
-
-export {};
-`.trim();
-}
-function renderServerTypesTemplate() {
-  return `
-declare module "h3" {
-  interface H3EventContext {
-    _graphqlInFlightRequestsMap?: Map<string, Promise<unknown>>;
-  }
-}
-
-export {};
-`.trim();
+function getSchemaSDL(schema) {
+  return printSchema(lexicographicSortSchema(schema));
 }
-function renderSharedTypesTemplate() {
-  return `
-import type { DocumentNode } from "graphql";
-
-declare global {
-  type GraphQLCacheConfig = {
-    policy: "no-cache" | "cache-first" | "network-first" | "swr";
-    ttl?: number;
-    keyPrefix: string;
-    keyVersion: string | number;
-  };;
+function getDefaultSchema() {
+  return buildSchema(`type Query { _empty: String }`);
 }
 
-declare module "nuxt/schema" {
-  interface PublicRuntimeConfig {
-    graphql: {
-      cacheConfig: GraphQLCacheConfig;
-      ssrForwardHeaders: string[];
-    };
+function addUniversalTemplate({ filename, getContents, emitTs }) {
+  let modulePath;
+  if (emitTs) {
+    modulePath = addTemplate({ filename: `${filename}.ts`, getContents: async () => (await getContents()).ts, write: true }).dst;
+  } else {
+    modulePath = addTemplate({ filename: `${filename}.mjs`, getContents: async () => (await getContents()).mjs, write: true }).dst;
+    addTemplate({ filename: `${filename}.d.ts`, getContents: async () => (await getContents()).dts });
   }
+  addServerTemplate({ filename: `${filename}.mjs`, getContents: async () => (await getContents()).mjs });
+  return modulePath;
 }
 
-export { };
-`.trim();
-}
+const version = "0.6.0";
 
 async function getDocuments(documentsGlob) {
   try {
@@ -258,7 +224,7 @@ async function getDocuments(documentsGlob) {
 }
 
 async function getOperationsTemplate({ loadSchema, loadDocuments, documentGlob }) {
-  const content = await codegen({
+  const ts = await codegen({
     filename: "operations.ts",
     schema: await loadSchema(),
     documents: await loadDocuments(documentGlob),
@@ -309,7 +275,7 @@ async function getOperationsTemplate({ loadSchema, loadDocuments, documentGlob }
     },
     config: {}
   });
-  return content;
+  return { ts, ...splitModule(ts) };
 }
 
 async function getRegistryTemplate({ loadDocuments, documentGlob }) {
@@ -351,7 +317,7 @@ export type ResultOf<TName extends keyof OperationRegistry> = OperationRegistry[
 export const registry: { [K in keyof OperationRegistry]: { kind: OperationRegistry[K]["kind"]; document: DocumentNode; }; } = {
   ${operations.map(({ name, kind }) => `${name}: { kind: "${kind}", document: ${name}Document },`).join("\n  ")}
 };`.trim();
-  return ts;
+  return { ts, ...splitModule(ts) };
 }
 function collectOperations(documents) {
   const operations = /* @__PURE__ */ new Map();
@@ -373,17 +339,15 @@ function collectOperations(documents) {
   return Array.from(operations.values());
 }
 
-const version = "0.5.12";
-
 const module$1 = defineNuxtModule({
   meta: {
-    name: "nuxt-graphql",
+    name: "@lewebsimple/nuxt-graphql",
     configKey: "graphql"
   },
   defaults: {},
   async setup(options, nuxt) {
     const logger = useLogger("@lewebsimple/nuxt-graphql");
-    logger.info(`Initializing @lewebsimple/nuxt-graphql v${version}`);
+    logger.info(`@lewebsimple/nuxt-graphql v${version} loaded`);
     const { resolve: resolveModule } = createResolver(import.meta.url);
     const { rootDir } = nuxt.options;
     const { resolve: resolveRoot, resolvePath: rawResolveRootPath } = createResolver(rootDir);
@@ -392,22 +356,15 @@ const module$1 = defineNuxtModule({
     }
     const nuxtAliases = {};
     const nitroAliases = {};
+    const emitTs = Boolean(nuxt.options.dev) || Boolean(process.env.NUXT_MODULE_PREPARE);
+    nuxtAliases["#graphql/runtime/remote-executor"] = resolveModule("./runtime/server/lib/remote-executor");
+    nitroAliases["#graphql/runtime/remote-executor"] = resolveModule("./runtime/server/lib/remote-executor");
     const contextInput = {
       importPaths: await Promise.all((options.server?.context || []).map((path) => resolveRootPath(path)))
     };
-    let contextDst;
-    if (nuxt.options.dev || process.env.NUXT_MODULE_PREPARE) {
-      logger.info("Development mode detected: using TypeScript GraphQL context template.");
-      contextDst = addTemplate({ filename: "graphql/context.ts", getContents: () => getContextTemplate(contextInput).ts, write: true }).dst;
-      addServerTemplate({ filename: "graphql/context.mjs", getContents: () => getContextTemplate(contextInput).mjs });
-    } else {
-      logger.info("Production mode detected: using MJS GraphQL context template.");
-      contextDst = addTemplate({ filename: "graphql/context.mjs", getContents: () => getContextTemplate(contextInput).mjs, write: true }).dst;
-      addServerTemplate({ filename: "graphql/context.mjs", getContents: () => getContextTemplate(contextInput).mjs });
-      addTypeTemplate({ filename: "graphql/context.d.ts", getContents: () => getContextTemplate(contextInput).dts });
-    }
-    nuxtAliases["#graphql/context"] = contextDst;
-    nitroAliases["#graphql/context"] = contextDst;
+    const contextPath = addUniversalTemplate({ filename: "graphql/context", getContents: () => getContextTemplate(contextInput), emitTs });
+    nuxtAliases["#graphql/context"] = contextPath;
+    nitroAliases["#graphql/context"] = contextPath;
     const schemaInput = { local: {}, remote: {} };
     const schemaLoaders = {};
     for (const [schemaName, schemaDef] of Object.entries(options.server?.schema || {})) {
@@ -416,27 +373,24 @@ const module$1 = defineNuxtModule({
       }
       if (schemaDef.type === "local") {
         const importPath = await resolveRootPath(schemaDef.path);
+        const loadSchema2 = getCachedLoader(`schema:local:${schemaName}`, async () => await loadLocalSchema({ importPath }));
         schemaInput.local[schemaName] = { importPath };
-        schemaLoaders[schemaName] = getCachedLoader(`schema:local:${schemaName}`, async () => await loadLocalSchema({ importPath }));
+        schemaLoaders[schemaName] = loadSchema2;
       } else if (schemaDef.type === "remote") {
         const { endpoint } = schemaDef;
-        const remoteSchemaInput = {
-          endpoint,
-          loadSchema: getCachedLoader(`schema:remote:${schemaName}`, async () => await introspectRemoteSchema({ endpoint }))
-        };
-        const filename = `graphql/schemas/${schemaName}.ts`;
-        addTemplate({ filename, getContents: async () => await getRemoteSchemaTemplate(remoteSchemaInput), write: true });
-        addServerTemplate({ filename, getContents: async () => await getRemoteSchemaTemplate(remoteSchemaInput) });
+        const loadSchema2 = getCachedLoader(`schema:remote:${schemaName}`, async () => await introspectRemoteSchema({ endpoint }));
+        const hooks = await Promise.all((schemaDef.hooks || []).map(async (hookPath) => ({ importPath: await resolveRootPath(hookPath) })));
+        const remoteSchemaInput = { endpoint, headers: schemaDef.headers || {}, hooks, loadSchema: loadSchema2 };
+        addUniversalTemplate({ filename: `graphql/schemas/${schemaName}`, getContents: () => getRemoteSchemaTemplate(remoteSchemaInput), emitTs });
         schemaInput.remote[schemaName] = { importPath: `./schemas/${schemaName}` };
-        schemaLoaders[schemaName] = remoteSchemaInput.loadSchema;
+        schemaLoaders[schemaName] = loadSchema2;
       } else {
         throw new Error(`Unknown schema type for schema "${schemaName}"`);
       }
     }
-    const schemaDst = addTemplate({ filename: `graphql/schema.ts`, getContents: () => getSchemaTemplate(schemaInput), write: true }).dst;
-    addServerTemplate({ filename: `graphql/schema.ts`, getContents: () => getSchemaTemplate(schemaInput) });
-    nuxtAliases["#graphql/schema"] = schemaDst;
-    nitroAliases["#graphql/schema"] = schemaDst;
+    const schemaPath = addUniversalTemplate({ filename: "graphql/schema", getContents: () => getSchemaTemplate(schemaInput), emitTs });
+    nuxtAliases["#graphql/schema"] = schemaPath;
+    nitroAliases["#graphql/schema"] = schemaPath;
     const sdlPath = resolveRoot(options.saveSDL || "server/graphql/schema.graphql");
     const loadSchema = getCachedLoader("schema:stitched", async () => {
       const subschemas = await Promise.all(Object.values(schemaLoaders).map((loadSchema2) => loadSchema2()));
@@ -444,13 +398,13 @@ const module$1 = defineNuxtModule({
         logger.warn(`No GraphQL schemas defined: using default empty schema.`);
         subschemas.push(getDefaultSchema());
       }
-      const schema = stitchSchemas({
-        subschemas
-      });
-      const sdl = getSchemaSDL(schema);
-      mkdirSync(dirname(sdlPath), { recursive: true });
-      writeFileSync(sdlPath, sdl, { encoding: "utf-8" });
-      logger.info(`Stitched GraphQL SDL saved to: ${cyan}${getRelativePath(rootDir, sdlPath)}${reset}`);
+      const schema = stitchSchemas({ subschemas });
+      if (nuxt.options.dev) {
+        const sdl = getSchemaSDL(schema);
+        mkdirSync(dirname(sdlPath), { recursive: true });
+        writeFileSync(sdlPath, sdl, { encoding: "utf-8" });
+        logger.info(`Stitched GraphQL SDL saved to: ${cyan}${getRelativePath(rootDir, sdlPath)}${reset}`);
+      }
       return schema;
     });
     const loadDocuments = getCachedLoader("documents", async (documentsGlob) => {
@@ -460,38 +414,28 @@ const module$1 = defineNuxtModule({
       }
       return documents;
     });
-    const operationsInput = {
-      loadSchema,
-      loadDocuments,
-      documentGlob: options.client?.documents || "**/*.gql"
-    };
-    const operationsDst = addTemplate({ filename: "graphql/operations.ts", getContents: async () => await getOperationsTemplate(operationsInput), write: true }).dst;
-    addServerTemplate({ filename: "graphql/operations.ts", getContents: async () => await getOperationsTemplate(operationsInput) });
-    nuxtAliases["#graphql/operations"] = operationsDst;
-    nitroAliases["#graphql/operations"] = operationsDst;
-    const registryInput = {
-      loadDocuments,
-      documentGlob: options.client?.documents || "**/*.gql"
-    };
-    const registryDst = addTemplate({ filename: "graphql/registry.ts", getContents: async () => await getRegistryTemplate(registryInput), write: true }).dst;
-    addServerTemplate({ filename: "graphql/registry.ts", getContents: async () => await getRegistryTemplate(registryInput) });
-    nuxtAliases["#graphql/registry"] = registryDst;
-    nitroAliases["#graphql/registry"] = registryDst;
-    const configPath = resolveRoot(options.saveConfig || "graphql.config.json");
-    const config = {
-      schema: getRelativePath(rootDir, sdlPath),
-      documents: options.client?.documents || "**/*.gql"
-    };
-    mkdirSync(dirname(configPath), { recursive: true });
-    writeFileSync(configPath, JSON.stringify(config, null, 2), { encoding: "utf-8" });
-    logger.info(`GraphQL config saved to: ${cyan}${getRelativePath(rootDir, configPath)}${reset}`);
+    const operationsInput = { loadSchema, loadDocuments, documentGlob: options.client?.documents || "**/*.gql" };
+    const operationsPath = addUniversalTemplate({ filename: "graphql/operations", getContents: () => getOperationsTemplate(operationsInput), emitTs });
+    nuxtAliases["#graphql/operations"] = operationsPath;
+    nitroAliases["#graphql/operations"] = operationsPath;
+    const registryInput = { loadDocuments, documentGlob: options.client?.documents || "**/*.gql" };
+    const registryPath = addUniversalTemplate({ filename: "graphql/registry", getContents: () => getRegistryTemplate(registryInput), emitTs });
+    nuxtAliases["#graphql/registry"] = registryPath;
+    nitroAliases["#graphql/registry"] = registryPath;
+    if (nuxt.options.dev) {
+      const configPath = resolveRoot(options.saveConfig || "graphql.config.json");
+      const config = {
+        schema: getRelativePath(rootDir, sdlPath),
+        documents: options.client?.documents || "**/*.gql"
+      };
+      mkdirSync(dirname(configPath), { recursive: true });
+      writeFileSync(configPath, JSON.stringify(config, null, 2), { encoding: "utf-8" });
+      logger.info(`GraphQL config saved to: ${cyan}${getRelativePath(rootDir, configPath)}${reset}`);
+    }
     nuxt.options.alias = defu(nuxt.options.alias, nuxtAliases);
     nuxt.hook("nitro:config", (nitroConfig) => {
       nitroConfig.alias = defu(nitroConfig.alias, nitroAliases);
     });
-    addTypeTemplate({ filename: "types/nuxt-graphql.app.d.ts", getContents: () => renderAppTypesTemplate() }, { nuxt: true });
-    addTypeTemplate({ filename: "types/nuxt-graphql.server.d.ts", getContents: () => renderServerTypesTemplate() }, { nitro: true, node: true });
-    addTypeTemplate({ filename: "types/nuxt-graphql.shared.d.ts", getContents: () => renderSharedTypesTemplate() }, { nuxt: true, nitro: true, node: true });
     nuxt.options.runtimeConfig.public.graphql = defu(nuxt.options.runtimeConfig.public.graphql, {
       cacheConfig: resolveCacheConfig(options.client?.cache),
       ssrForwardHeaders: options.client?.ssrForwardHeaders || ["authorization", "cookie"]
@@ -509,9 +453,10 @@ const module$1 = defineNuxtModule({
     nuxt.hook("listen", (_, { url }) => {
       logger.success(`GraphQL Yoga ready: ${cyan}${url.replace(/\/$/, "")}/api/graphql${reset}`);
     });
-    addPlugin(resolveModule("./runtime/app/plugins/graphql-request"));
+    addPlugin(resolveModule("./runtime/app/plugins/execute-graphql"));
     addPlugin(resolveModule("./runtime/app/plugins/graphql-sse.client"));
     addImportsDir(resolveModule("./runtime/app/composables"));
+    addImportsDir(resolveModule("./runtime/shared/utils"));
     addServerImportsDir(resolveModule("./runtime/server/utils"));
   }
 });

package/dist/runtime/app/composables/useAsyncGraphQLQuery.d.ts

@@ -1,11 +1,11 @@
-import { useAsyncData, type AsyncDataOptions } from "#app";
+import { type AsyncData, type AsyncDataOptions } from "#app";
 import type { QueryName, ResultOf, VariablesOf } from "#graphql/registry";
 import { type MaybeRefOrGetter } from "#imports";
-import { type ExecuteGraphQLHTTPOptions } from "../lib/execute-http.js";
-import type { IsEmptyObject } from "../../shared/lib/utils.js";
-type UseAsyncGraphQLQueryOptions<TName extends QueryName> = ExecuteGraphQLHTTPOptions & {
-    cache?: Partial<GraphQLCacheConfig>;
-} & AsyncDataOptions<ResultOf<TName>>;
+import type { IsEmptyObject } from "../../shared/lib/types.js";
+import { type CacheConfig } from "../lib/cache.js";
+type UseAsyncGraphQLQueryOptions<TName extends QueryName> = AsyncDataOptions<ResultOf<TName>> & {
+    cache?: Partial<CacheConfig>;
+};
 /**
  * Async GraphQL query composable with caching support.
  *
@@ -13,5 +13,5 @@ type UseAsyncGraphQLQueryOptions<TName extends QueryName> = ExecuteGraphQLHTTPOp
  * @param args Operation variables (if any) and optional HTTP headers.
  * @returns Nuxt AsyncData wrapper for the query result.
  */
-export declare function useAsyncGraphQLQuery<TName extends QueryName>(operationName: TName, ...args: IsEmptyObject<VariablesOf<TName>> extends true ? [variables?: MaybeRefOrGetter<VariablesOf<TName>>, options?: UseAsyncGraphQLQueryOptions<TName>] : [variables: MaybeRefOrGetter<VariablesOf<TName>>, options?: UseAsyncGraphQLQueryOptions<TName>]): ReturnType<typeof useAsyncData<ResultOf<TName>>>;
+export declare function useAsyncGraphQLQuery<TName extends QueryName>(operationName: TName, ...args: IsEmptyObject<VariablesOf<TName>> extends true ? [variables?: MaybeRefOrGetter<VariablesOf<TName>>, options?: UseAsyncGraphQLQueryOptions<TName>] : [variables: MaybeRefOrGetter<VariablesOf<TName>>, options?: UseAsyncGraphQLQueryOptions<TName>]): AsyncData<ResultOf<TName> | null, Error | undefined>;
 export {};

package/dist/runtime/app/composables/useAsyncGraphQLQuery.js

@@ -1,14 +1,16 @@
-import { useAsyncData, useNuxtData, useRuntimeConfig } from "#app";
+import { useAsyncData, useNuxtApp, useNuxtData, useRuntimeConfig } from "#app";
 import { computed, toValue } from "#imports";
-import { executeGraphQLHTTP } from "../lib/execute-http.js";
+import { getOperationDocument } from "../../shared/lib/registry.js";
+import { getCacheKeyParts, resolveCacheConfig } from "../lib/cache.js";
 import { getInFlightRequests } from "../lib/in-flight.js";
 import { getPersistedEntry, setPersistedEntry } from "../lib/persisted.js";
-import { getCacheKeyParts, resolveCacheConfig } from "../../shared/lib/cache.js";
 export function useAsyncGraphQLQuery(operationName, ...args) {
+  const { $executeGraphQL } = useNuxtApp();
   const [variables, options] = args;
+  const document = getOperationDocument(operationName);
   const isClient = import.meta.client;
   const { public: { graphql } } = useRuntimeConfig();
-  const { headers, cache, ...asyncDataOptions } = options ?? {};
+  const { cache, ...asyncDataOptions } = options ?? {};
   const cacheConfig = resolveCacheConfig(graphql.cacheConfig, cache);
   const cacheKey = computed(() => getCacheKeyParts(cacheConfig, operationName, toValue(variables)).key);
   const inFlight = getInFlightRequests();
@@ -17,16 +19,18 @@ export function useAsyncGraphQLQuery(operationName, ...args) {
     if (inFlight.has(key)) {
       return inFlight.get(key);
     }
-    const promise = executeGraphQLHTTP(operationName, toValue(variables), { headers }).then((data) => {
+    const promise = $executeGraphQL({ query: document, variables: toValue(variables), operationName }).then((result) => {
+      if (result.error) {
+        throw result.error;
+      }
+      const data = result.data;
       if (isClient && cacheConfig.ttl !== void 0) {
         setPersistedEntry(key, data, cacheConfig.ttl);
       }
       return data;
     });
     inFlight.set(key, promise);
-    promise.finally(() => {
-      inFlight.delete(key);
-    });
+    promise.finally(() => inFlight.delete(key));
     return promise;
   }
   async function asyncDataHandler() {

package/dist/runtime/app/composables/useGraphQLCache.client.d.ts

@@ -1,13 +1,21 @@
 import type { QueryName } from "#graphql/registry";
+import { type CacheConfig } from "../lib/cache.js";
 /**
  * GraphQL cache helper composable.
  *
  * @returns Cache config and invalidation helper.
  */
 export declare function useGraphQLCache(): {
-    readonly cacheConfig: any;
+    readonly cacheConfig: CacheConfig;
     readonly invalidate: (options?: {
         operation: QueryName;
         variables?: unknown;
     }) => Promise<void>;
 };
+declare module "nuxt/schema" {
+    interface PublicRuntimeConfig {
+        graphql: {
+            cacheConfig: CacheConfig;
+        };
+    }
+}

package/dist/runtime/app/composables/useGraphQLCache.client.js

@@ -1,5 +1,5 @@
 import { clearNuxtData, useRuntimeConfig } from "#imports";
-import { getCacheKeyParts } from "../../shared/lib/cache.js";
+import { getCacheKeyParts } from "../lib/cache.js";
 import { deletePersistedByPrefix, deletePersistedEntry } from "../lib/persisted.js";
 export function useGraphQLCache() {
   const { public: { graphql: { cacheConfig } } } = useRuntimeConfig();

package/dist/runtime/app/composables/useGraphQLMutation.d.ts

@@ -1,15 +1,6 @@
 import type { MutationName, ResultOf, VariablesOf } from "#graphql/registry";
-import { type ExecuteGraphQLHTTPOptions } from "../lib/execute-http.js";
-import { type SafeResult } from "../../shared/lib/error.js";
-import type { IsEmptyObject } from "../../shared/lib/utils.js";
-/**
- * GraphQL mutation composable with pending state.
- *
- * @param operationName Operation name from the registry.
- * @param options HTTP options including headers.
- * @returns Mutation helpers and pending ref.
- */
-export declare function useGraphQLMutation<TName extends MutationName>(operationName: TName, options?: ExecuteGraphQLHTTPOptions): {
-    mutate: (...args: IsEmptyObject<VariablesOf<TName>> extends true ? [variables?: VariablesOf<TName>] : [variables: VariablesOf<TName>]) => Promise<SafeResult<ResultOf<TName>>>;
+import type { ExecuteGraphQLResult, IsEmptyObject } from "../../shared/lib/types.js";
+export declare function useGraphQLMutation<TName extends MutationName>(operationName: TName): {
     pending: import("vue").Ref<boolean, boolean>;
+    mutate: (...args: IsEmptyObject<VariablesOf<TName>> extends true ? [variables?: VariablesOf<TName>] : [variables: VariablesOf<TName>]) => Promise<ExecuteGraphQLResult<ResultOf<TName>>>;
 };