feat(react-query): add httpClientInjection: 'reactQueryMeta' option

[FR073N]

Hey team, I'd love to get your feedback on this implementation.

Fix #2887

Context

When using client: 'react-query' with httpClient: 'axios', there's no clean way to inject a configured axios instance at runtime. The custom mutator creates a singleton at import time, which blocks NPM package distribution, SSR, and test mocking.

Linked to :

• React Query - Axios Instance Injection via QueryClient Meta #2887
• Using QueryClient defaultOptions.meta to inject Axios instance - Is this a good pattern? TanStack/query#10080

This PR

New option httpClientInjection: 'reactQueryMeta' that leverages React Query's native meta feature:

export default defineConfig({
  petstore: {
    output: {
      client: 'react-query',
      httpClient: 'axios',
      httpClientInjection: 'reactQueryMeta',
    },
    input: { target: './petstore.yaml' },
  },
});

Consumer side:

import axios from 'axios';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { useListPets } from '@my-org/petstore-sdk';

// Consumer configures their own instance
const axiosInstance = axios.create({ baseURL: 'https://api.example.com' });
axiosInstance.interceptors.request.use(addAuthHeader);

// Inject via QueryClient meta
const queryClient = new QueryClient({
  defaultOptions: {
    queries: { meta: { axiosInstance } },
    mutations: { meta: { axiosInstance } },
  },
});

function Pets() {
  // Hook resolves the instance automatically — consumer doesn't pass anything
  const { data } = useListPets();
  return <ul>{data?.map((pet) => <li key={pet.id}>{pet.name}</li>)}</ul>;
}

function App() {
  return (
    <QueryClientProvider client={queryClient}>
      <Pets />
    </QueryClientProvider>
  );
}

Main benefit

With this option, you can build a real SDK from orval-generated code and publish it on NPM. The axios instance is injected by the consumer, not hardcoded in the package. Hooks return Promise<T> instead of Promise<AxiosResponse<T>> for SSR compatibility with dehydrate().

Looking for feedback

If you use orval-generated code with react-query, I'd appreciate your input:

• Does this approach (meta in QueryClient) work for you?
• Returning T instead of AxiosResponse<T> — acceptable?
• Any other injection patterns you'd prefer?

Includes tests, docs, and a complete sample in samples/react-query/queryclient-meta/.

[FR073N]

@melloware Here I created the PR, but as you said we may need inputs to be sure this is acceptable. Thank you.

[melloware]

Yep I would definitely like others input as this one concerns me. I am not against it I just have concerns!

I will ask others to weigh in

[melloware]

looks like merge conflicts