chore: clean up fetch client API

examples/openapi-ts-fetch/src/App.tsx

···
   baseUrl: 'https://api.fake-museum-example.com/v1.1',
 });
 
+const localClient = createClient({
+  baseUrl: 'https://api.fake-museum-example.com/v2',
+  global: false,
+});
+
+localClient.interceptors.request.use((request, options) => {
+  console.log(options);
+  return request;
+});
+
 function App() {
   // const [pet, setPet] = useState<Awaited<ReturnType<typeof getPetById>>['data']>();
 
   const onGetSpecialEvent = async () => {
     const { data, error } = await getSpecialEvent({
+      client: localClient,
       path: {
         eventId: 'dad4bce8-f5cb-4078-a211-995864315e39',
       },
···
   };
 
   const onBuyMuseumTickets = () => {
-    // @ts-ignore
     buyMuseumTickets({
-      body: '',
+      body: {
+        email: '',
+        ticketDate: '',
+        ticketType: 'event',
+      },
     });
   };
 

examples/openapi-ts-fetch/src/client/services.gen.ts

···
  * Get upcoming museum operating hours.
  */
 export const getMuseumHours = (options?: Options<GetMuseumHoursData>) =>
-  client.get<GetMuseumHoursResponse2, GetMuseumHoursError>({
-    ...options,
-    url: '/museum-hours',
-  });
+  (options?.client ?? client).get<GetMuseumHoursResponse2, GetMuseumHoursError>(
+    {
+      ...options,
+      url: '/museum-hours',
+    },
+  );
 
 /**
  * Create special events
  * Creates a new special event for the museum.
  */
 export const createSpecialEvent = (options: Options<CreateSpecialEventData>) =>
-  client.post<CreateSpecialEventResponse, CreateSpecialEventError>({
+  (options?.client ?? client).post<
+    CreateSpecialEventResponse,
+    CreateSpecialEventError
+  >({
     ...options,
     url: '/special-events',
   });
···
  * Return a list of upcoming special events at the museum.
  */
 export const listSpecialEvents = (options?: Options<ListSpecialEventsData>) =>
-  client.get<ListSpecialEventsResponse2, ListSpecialEventsError>({
+  (options?.client ?? client).get<
+    ListSpecialEventsResponse2,
+    ListSpecialEventsError
+  >({
     ...options,
     url: '/special-events',
   });
···
  * Get details about a special event.
  */
 export const getSpecialEvent = (options: Options<GetSpecialEventData>) =>
-  client.get<GetSpecialEventResponse, GetSpecialEventError>({
+  (options?.client ?? client).get<
+    GetSpecialEventResponse,
+    GetSpecialEventError
+  >({
     ...options,
     url: '/special-events/{eventId}',
   });
···
  * Update the details of a special event.
  */
 export const updateSpecialEvent = (options: Options<UpdateSpecialEventData>) =>
-  client.patch<UpdateSpecialEventResponse, UpdateSpecialEventError>({
+  (options?.client ?? client).patch<
+    UpdateSpecialEventResponse,
+    UpdateSpecialEventError
+  >({
     ...options,
     url: '/special-events/{eventId}',
   });
···
  * Delete a special event from the collection. Allows museum to cancel planned events.
  */
 export const deleteSpecialEvent = (options: Options<DeleteSpecialEventData>) =>
-  client.delete<DeleteSpecialEventResponse, DeleteSpecialEventError>({
+  (options?.client ?? client).delete<
+    DeleteSpecialEventResponse,
+    DeleteSpecialEventError
+  >({
     ...options,
     url: '/special-events/{eventId}',
   });
···
  * Purchase museum tickets for general entry or special events.
  */
 export const buyMuseumTickets = (options: Options<BuyMuseumTicketsData>) =>
-  client.post<BuyMuseumTicketsResponse2, BuyMuseumTicketsError>({
+  (options?.client ?? client).post<
+    BuyMuseumTicketsResponse2,
+    BuyMuseumTicketsError
+  >({
     ...options,
     url: '/tickets',
   });
···
  * Return an image of your ticket with scannable QR code. Used for event entry.
  */
 export const getTicketCode = (options: Options<GetTicketCodeData>) =>
-  client.get<GetTicketCodeResponse2, GetTicketCodeError>({
+  (options?.client ?? client).get<GetTicketCodeResponse2, GetTicketCodeError>({
     ...options,
     url: '/tickets/{ticketId}/qr',
   });

packages/client-fetch/src/index.ts

···
-import type { Config, Req, RequestResult } from './types';
+import type { Config, FetchClient, FinalRequestOptions } from './types';
 import {
   createDefaultConfig,
   createInterceptors,
···
 //   }
 // };
 
-type Options = Omit<Req, 'method'>;
-
-type ReqInit = Omit<RequestInit, 'headers'> & {
+type ReqInit = Omit<RequestInit, 'body' | 'headers'> & {
+  body?: any;
   headers: ReturnType<typeof mergeHeaders>;
 };
-
-type Opts = Req &
-  Config & {
-    headers: ReturnType<typeof mergeHeaders>;
-  };
 
 let globalConfig = createDefaultConfig();
 
-const globalInterceptors = createInterceptors<Request, Response, Opts>();
+const globalInterceptors = createInterceptors<
+  Request,
+  Response,
+  FinalRequestOptions
+>();
 
-export const createClient = (config: Partial<Config>) => {
+export const createClient = (config: Config): FetchClient => {
   const defaultConfig = createDefaultConfig();
   const _config = { ...defaultConfig, ...config };
 
-  if (_config.baseUrl.endsWith('/')) {
+  if (_config.baseUrl?.endsWith('/')) {
     _config.baseUrl = _config.baseUrl.substring(0, _config.baseUrl.length - 1);
   }
   _config.headers = mergeHeaders(defaultConfig.headers, _config.headers);
···
 
   const interceptors = _config.global
     ? globalInterceptors
-    : createInterceptors<Request, Response, Opts>();
+    : createInterceptors<Request, Response, FinalRequestOptions>();
 
-  const request = async <Data = unknown, Error = unknown>(
-    options: Req,
-  ): RequestResult<Data, Error> => {
+  // @ts-ignore
+  const request: FetchClient['request'] = async (options) => {
     const config = getConfig();
 
-    const opts: Opts = {
+    const opts: FinalRequestOptions = {
       ...config,
       ...options,
       headers: mergeHeaders(config.headers, options.headers),
     };
+    if (opts.body && opts.bodySerializer) {
+      opts.body = opts.bodySerializer(opts.body);
+    }
 
     const url = getUrl({
-      baseUrl: opts.baseUrl,
+      baseUrl: opts.baseUrl ?? '',
       path: opts.path,
       query: opts.query,
       querySerializer:
···
       redirect: 'follow',
       ...opts,
     };
-    if (opts.body) {
-      requestInit.body = opts.bodySerializer(opts.body);
-    }
     // remove Content-Type if serialized body is FormData; browser will correctly set Content-Type and boundary expression
     if (requestInit.body instanceof FormData) {
       requestInit.headers.delete('Content-Type');
···
       request = await fn(request, opts);
     }
 
-    const _fetch = opts.fetch;
+    const _fetch = opts.fetch!;
     let response = await _fetch(request);
 
     for (const fn of interceptors.response._fns) {
···
     ) {
       if (response.ok) {
         return {
-          // @ts-ignore
           data: {},
           ...result,
         };
       }
       return {
-        // @ts-ignore
         error: {},
         ...result,
       };
···
     if (response.ok) {
       if (opts.parseAs === 'stream') {
         return {
-          // @ts-ignore
           data: response.body,
           ...result,
         };
       }
       return {
-        data: await response[opts.parseAs](),
+        data: await response[opts.parseAs ?? 'json'](),
         ...result,
       };
     }
···
       // noop
     }
     return {
-      // @ts-ignore
       error,
       ...result,
     };
   };
 
-  type Interceptors = {
-    [P in keyof typeof interceptors]: Pick<
-      (typeof interceptors)[P],
-      'eject' | 'use'
-    >;
-  };
-
-  const client = {
-    connect: <Data = unknown, Error = unknown>(options: Options) =>
-      request<Data, Error>({ ...options, method: 'CONNECT' }),
-    delete: <Data = unknown, Error = unknown>(options: Options) =>
-      request<Data, Error>({ ...options, method: 'DELETE' }),
-    get: <Data = unknown, Error = unknown>(options: Options) =>
-      request<Data, Error>({ ...options, method: 'GET' }),
+  return {
+    connect: (options) => request({ ...options, method: 'CONNECT' }),
+    delete: (options) => request({ ...options, method: 'DELETE' }),
+    get: (options) => request({ ...options, method: 'GET' }),
     getConfig,
-    head: <Data = unknown, Error = unknown>(options: Options) =>
-      request<Data, Error>({ ...options, method: 'HEAD' }),
-    interceptors: interceptors as Interceptors,
-    options: <Data = unknown, Error = unknown>(options: Options) =>
-      request<Data, Error>({ ...options, method: 'OPTIONS' }),
-    patch: <Data = unknown, Error = unknown>(options: Options) =>
-      request<Data, Error>({ ...options, method: 'PATCH' }),
-    post: <Data = unknown, Error = unknown>(options: Options) =>
-      request<Data, Error>({ ...options, method: 'POST' }),
-    put: <Data = unknown, Error = unknown>(options: Options) =>
-      request<Data, Error>({ ...options, method: 'PUT' }),
+    head: (options) => request({ ...options, method: 'HEAD' }),
+    interceptors,
+    options: (options) => request({ ...options, method: 'OPTIONS' }),
+    patch: (options) => request({ ...options, method: 'PATCH' }),
+    post: (options) => request({ ...options, method: 'POST' }),
+    put: (options) => request({ ...options, method: 'PUT' }),
     request,
-    trace: <Data = unknown, Error = unknown>(options: Options) =>
-      request<Data, Error>({ ...options, method: 'TRACE' }),
+    trace: (options) => request({ ...options, method: 'TRACE' }),
   };
-  return client;
 };
 
 export const client = createClient(globalConfig);

packages/client-fetch/src/types.ts

···
 import type {
   BodySerializer,
-  FetchOptions,
+  Middleware,
   QuerySerializer,
   QuerySerializerOptions,
 } from './utils';
 
-type ApiRequestOptions = {
-  readonly body?: any;
-  readonly cookies?: Record<string, unknown>;
-  readonly errors?: Record<number, string>;
-  readonly formData?: Record<string, unknown>;
-  readonly headers?: Record<string, unknown>;
-  readonly mediaType?: string;
-  readonly method:
+type OmitKey<T, K> = Pick<T, Exclude<keyof T, K>>;
+
+export interface Config
+  extends Omit<RequestInit, 'body' | 'headers' | 'method'> {
+  /**
+   * Base URL for all requests made by this client.
+   * @default ''
+   */
+  baseUrl?: string;
+  /**
+   * Any body that you want to add to your request.
+   *
+   * {@link https://developer.mozilla.org/docs/Web/API/fetch#body}
+   */
+  body?: RequestInit['body'] | Record<string, unknown>;
+  /**
+   * A function for serializing request body parameter. By default,
+   * {@link JSON.stringify()} will be used.
+   */
+  bodySerializer?: BodySerializer;
+  /**
+   * Fetch API implementation. You can use this option to provide a custom
+   * fetch instance.
+   * @default globalThis.fetch
+   */
+  fetch?: (request: Request) => ReturnType<typeof fetch>;
+  /**
+   * By default, options passed to this call will be applied to the global
+   * client instance. Set to false to create a local client instance.
+   * @default true
+   */
+  global?: boolean;
+  /**
+   * An object containing any HTTP headers that you want to pre-populate your
+   * `Headers` object with.
+   *
+   * {@link https://developer.mozilla.org/docs/Web/API/Headers/Headers#init See more}
+   */
+  headers?:
+    | RequestInit['headers']
+    | Record<
+        string,
+        | string
+        | number
+        | boolean
+        | (string | number | boolean)[]
+        | null
+        | undefined
+      >;
+  /**
+   * The request method.
+   *
+   * {@link https://developer.mozilla.org/docs/Web/API/fetch#method See more}
+   */
+  method?:
     | 'CONNECT'
     | 'DELETE'
     | 'GET'
···
     | 'POST'
     | 'PUT'
     | 'TRACE';
-  readonly path?: Record<string, unknown>;
-  readonly query?: Record<string, unknown>;
-  readonly responseHeader?: string;
-  readonly url: string;
-};
-
-interface FetchConfig extends FetchOptions {
   /**
-   * custom fetch
-   * @default globalThis.fetch
+   * Return the response data parsed in a specified format. Any of the
+   * {@link Body} methods are allowed. By default, {@link Body.json()} will be
+   * used. Select `stream` if you don't want to parse response data.
+   * @default 'json'
    */
-  fetch: (request: Request) => ReturnType<typeof fetch>;
+  parseAs?: Exclude<keyof Body, 'body' | 'bodyUsed'> | 'stream';
+  /**
+   * A function for serializing request query parameters. By default, arrays
+   * will be exploded in form style, objects will be exploded in deepObject
+   * style, and reserved characters are percent-encoded.
+   *
+   * {@link https://swagger.io/docs/specification/serialization/#query View examples}
+   */
+  querySerializer?: QuerySerializer | QuerySerializerOptions;
 }
 
-interface BodyType<T = unknown> {
-  arrayBuffer: Awaited<ReturnType<Response['arrayBuffer']>>;
-  blob: Awaited<ReturnType<Response['blob']>>;
-  json: T;
-  stream: Response['body'];
-  text: Awaited<ReturnType<Response['text']>>;
+interface RequestOptions extends Omit<Config, 'global'> {
+  path?: Record<string, unknown>;
+  query?: Record<string, unknown>;
+  url: string;
 }
 
-interface RequestResponse<Data = unknown, Error = unknown> {
+type RequestResult<Data = unknown, Error = unknown> = Promise<{
   error?: Error;
   data?: Data;
   request: Request;
   response: Response;
+}>;
+
+type MethodFn = <Data = unknown, Error = unknown>(
+  options: RequestOptions,
+) => RequestResult<Data, Error>;
+type RequestFn = <Data = unknown, Error = unknown>(
+  options: RequestOptions & Pick<Required<RequestOptions>, 'method'>,
+) => RequestResult<Data, Error>;
+
+interface Client<Request = unknown, Response = unknown, Options = unknown> {
+  connect: MethodFn;
+  delete: MethodFn;
+  get: MethodFn;
+  getConfig: () => Config;
+  head: MethodFn;
+  interceptors: Middleware<Request, Response, Options>;
+  options: MethodFn;
+  patch: MethodFn;
+  post: MethodFn;
+  put: MethodFn;
+  request: RequestFn;
+  trace: MethodFn;
 }
 
-export type RequestResult<Data = unknown, Error = unknown> = Promise<
-  RequestResponse<Data, Error>
->;
+export type FinalRequestOptions = RequestOptions &
+  Config & {
+    headers: Headers;
+  };
 
-export interface Config extends FetchConfig {
-  /**
-   * Base URL...
-   * @default ''
-   */
-  baseUrl: string;
-  /**
-   * Body serializer...
-   */
-  bodySerializer: BodySerializer<unknown>;
-  /**
-   * Global??
-   * @default true
-   */
-  global: boolean;
-  /**
-   * Parse as...
-   * @default 'json'
-   */
-  parseAs: keyof BodyType;
+export type FetchClient = Client<Request, Response, FinalRequestOptions>;
+
+type OptionsBase = Omit<RequestOptions, 'url'> & {
   /**
-   * Query serializer...
+   * You can provide a client instance returned by `createClient()` instead of
+   * individual options. This might be also useful if you want to implement a
+   * custom client.
    */
-  querySerializer: QuerySerializer<unknown> | QuerySerializerOptions;
-}
+  client?: FetchClient;
+};
 
-export interface Req
-  extends Omit<ApiRequestOptions, 'headers'>,
-    Omit<Partial<Config>, 'body' | 'method'> {}
-
-export type Options<T = unknown> = Omit<Req, 'method' | 'url'> & T;
+export type Options<T = unknown> = T extends { body: any }
+  ? OmitKey<OptionsBase, 'body'> & T
+  : OptionsBase & T;

packages/client-fetch/src/utils.ts

···
 type ObjectStyle = 'form' | 'deepObject';
 type ObjectSeparatorStyle = ObjectStyle | MatrixStyle;
 
-export interface FetchOptions extends Omit<RequestInit, 'headers'> {
-  /**
-   * Headers...
-   */
-  headers?: HeadersOptions;
-}
+export type QuerySerializer = (query: Record<string, unknown>) => string;
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-export type QuerySerializer<T = unknown> = (
-  query: Record<string, unknown>,
-) => string;
-
-// type BodySerializer<T> = (body: OperationRequestBodyContent<T>) => any;
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-export type BodySerializer<T> = (body: any) => any;
+export type BodySerializer = (body: any) => any;
 
 interface SerializerOptions<T> {
   /**
···
   value: string;
 }
 
-export type HeadersOptions =
-  | HeadersInit
-  | Record<
-      string,
-      | string
-      | number
-      | boolean
-      | (string | number | boolean)[]
-      | null
-      | undefined
-    >;
-
 export interface QuerySerializerOptions {
   allowReserved?: boolean;
   array?: SerializerOptions<ArrayStyle>;
   object?: SerializerOptions<ObjectStyle>;
 }
 
-export function serializePrimitiveParam({
+function serializePrimitiveParam({
   allowReserved,
   name,
   value,
···
   }
 };
 
-export function serializeArrayParam({
+function serializeArrayParam({
   allowReserved,
   explode,
   name,
···
   return style === 'label' || style === 'matrix' ? separator + final : final;
 }
 
-export const serializeObjectParam = ({
+const serializeObjectParam = ({
   allowReserved,
   explode,
   name,
···
   return style === 'label' || style === 'matrix' ? separator + final : final;
 };
 
-export function defaultPathSerializer({ path, url: _url }: PathSerializer) {
+function defaultPathSerializer({ path, url: _url }: PathSerializer) {
   let url = _url;
   const matches = _url.match(PATH_PARAM_RE);
   if (matches) {
···
   return url;
 }
 
-export const mergeHeaders = (...headers: Array<HeadersOptions | undefined>) => {
-  const finalHeaders = new Headers();
+export const mergeHeaders = (
+  ...headers: Array<Required<Config>['headers'] | undefined>
+) => {
+  const mergedHeaders = new Headers();
   for (const header of headers) {
     if (!header || typeof header !== 'object') {
       continue;
···
 
     for (const [key, value] of iterator) {
       if (value === null) {
-        finalHeaders.delete(key);
+        mergedHeaders.delete(key);
       } else if (Array.isArray(value)) {
         for (const v of value) {
-          finalHeaders.append(key, v as string);
+          mergedHeaders.append(key, v as string);
         }
       } else if (value !== undefined) {
-        finalHeaders.set(key, value as string);
+        mergedHeaders.set(key, value as string);
       }
     }
   }
-  return finalHeaders;
+  return mergedHeaders;
 };
 
 type ReqInterceptor<Req, Options> = (
···
   }
 }
 
+// `createInterceptors()` response, meant for external use as it does not
+// expose internals
+export interface Middleware<Req, Res, Options> {
+  request: Pick<Interceptors<ReqInterceptor<Req, Options>>, 'eject' | 'use'>;
+  response: Pick<
+    Interceptors<ResInterceptor<Res, Req, Options>>,
+    'eject' | 'use'
+  >;
+}
+
+// do not add `Middleware` as return type so we can use _fns internally
 export const createInterceptors = <Req, Res, Options>() => ({
   request: new Interceptors<ReqInterceptor<Req, Options>>(),
   response: new Interceptors<ResInterceptor<Res, Req, Options>>(),

packages/openapi-ts/src/utils/enum.ts

···
  * 3: Add '_' where the string transitions from lowercase to uppercase
  * 4: Transform the whole string to uppercase
  *
- * Javascript identifier regexp pattern retrieved from https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#identifiers
+ * Javascript identifier regexp pattern retrieved from https://developer.mozilla.org/docs/Web/JavaScript/Reference/Lexical_grammar#identifiers
  */
 export const enumKey = (value?: string | number, customName?: string) => {
   if (customName) {

packages/openapi-ts/src/utils/write/services.ts

···
     return [
       compiler.return.functionCall({
         args: [options],
-        name: `client.${operation.method.toLocaleLowerCase()}`,
+        name: `(options?.client ?? client).${operation.method.toLocaleLowerCase()}`,
         types:
           errorType && responseType
             ? [responseType, errorType]