Extract GraphiQL server to @shopify/cli-kit

[gonzaloriestra]

WHY are these changes introduced?

This prepares the GraphiQL server for reuse outside @shopify/app.

WHAT is this pull request doing?

Moves the GraphiQL server, templates, utilities, and assets into @shopify/cli-kit, updates app dev to import them from cli-kit, and keeps bundled asset resolution working.

How to test your changes?

Open GraphiQL from shopify app dev

Checklist

• I've considered possible cross-platform impacts (Mac, Linux, Windows)
• I've considered possible documentation changes
• I've considered analytics changes to measure impact
• The change is user-facing — I've identified the correct bump type (patch for bug fixes · minor for new features · major for breaking changes) and added a changeset with pnpm changeset add

[gonzaloriestra]

• Make GraphiQL server auth-agnostic #7380 : 2 dependent PRs (#7381 , #7382 )
• Extract GraphiQL server to @shopify/cli-kit #7379 👈 (View in Graphite)
• main

This stack of pull requests is managed by Graphite. Learn more about stacking.

[github-actions]

This PR seems inactive. If it's still relevant, please add a comment saying so. Otherwise, take no action.
→ If there's no activity within a week, then a bot will automatically close this.
Thanks for helping to improve Shopify's dev tooling and experience.

[github-actions]

Differences in type declarations

We detected differences in the type declarations generated by Typescript for this branch compared to the baseline ('main' branch). Please, review them to ensure they are backward-compatible. Here are some important things to keep in mind:

• Some seemingly private modules might be re-exported through public modules.
• If the branch is behind main you might see odd diffs, rebase main into this branch.

New type declarations

packages/cli-kit/dist/public/node/graphiql/server.d.ts

import { Server } from 'http';
import { Writable } from 'stream';
/**
 * Derives a deterministic GraphiQL authentication key from the app's API secret and store FQDN.
 * The key is stable across dev server restarts (so browser tabs survive restarts)
 * but is not guessable without the app secret.
 *
 * @param apiSecret - The Partners app's client secret used as the HMAC key.
 * @param storeFqdn - The myshopify.com domain the GraphiQL session targets.
 * @returns A 64-character hex string suitable for use as the `?key=` query param.
 */
export declare function deriveGraphiQLKey(apiSecret: string, storeFqdn: string): string;
/**
 * Resolves the GraphiQL authentication key. Uses the explicitly provided key
 * if non-empty, otherwise derives one deterministically from the app secret.
 *
 * @param providedKey - An explicit key supplied by the caller; takes precedence when non-empty.
 * @param apiSecret - The Partners app's client secret, used to derive a stable key as a fallback.
 * @param storeFqdn - The myshopify.com domain the GraphiQL session targets.
 * @returns The resolved key.
 */
export declare function resolveGraphiQLKey(providedKey: string | undefined, apiSecret: string, storeFqdn: string): string;
interface SetupGraphiQLServerOptions {
    stdout: Writable;
    port: number;
    appName: string;
    appUrl: string;
    apiKey: string;
    apiSecret: string;
    key?: string;
    storeFqdn: string;
}
/**
 * Starts a local HTTP server that hosts the GraphiQL UI and proxies requests to the
 * Admin API for the configured store. The server uses the OAuth `client_credentials`
 * grant with the supplied `apiKey` / `apiSecret` to mint and refresh access tokens
 * on the fly.
 *
 * @param options - Configuration for the server, including the target store, the
 * Partners app credentials, and the local port to bind to.
 * @returns The underlying Node `http.Server` instance, already listening on `options.port`.
 */
export declare function setupGraphiQLServer(options: SetupGraphiQLServerOptions): Server;
export {};

packages/cli-kit/dist/public/node/graphiql/utilities.d.ts

/**
 * Filters request headers to extract only custom headers that are safe to forward.
 * Blocked headers and non-string values are excluded.
 *
 * @param headers - The raw incoming request headers.
 * @returns The subset of headers that are safe to forward to the Admin API.
 */
export declare function filterCustomHeaders(headers: {
    [key: string]: string | string[] | undefined;
}): {
    [key: string]: string;
};

packages/cli-kit/dist/public/node/graphiql/templates/graphiql.d.ts

export declare const defaultQuery: string;
interface GraphiQLTemplateOptions {
    apiVersion: string;
    apiVersions: string[];
    appName: string;
    appUrl: string;
    key: string;
    storeFqdn: string;
}
export declare function graphiqlTemplate({ apiVersion, apiVersions, appName, appUrl, key, storeFqdn, }: GraphiQLTemplateOptions): string;
export {};

packages/cli-kit/dist/public/node/graphiql/templates/unauthorized.d.ts

export declare const unauthorizedTemplate: string;

Existing type declarations

We found no diffs with existing type declarations