@kubb/plugin-client 5.0.0-alpha.9 → 5.0.0-beta.4

package/package.json

@@ -1,34 +1,67 @@
 {
   "name": "@kubb/plugin-client",
-  "version": "5.0.0-alpha.9",
+  "version": "5.0.0-beta.4",
   "description": "API client generator plugin for Kubb, creating type-safe HTTP clients (Axios, Fetch) from OpenAPI specifications for making API requests.",
   "keywords": [
     "api-client",
-    "http-client",
-    "sdk-generator",
     "axios",
-    "fetch",
-    "rest-api",
-    "typescript",
-    "type-safety",
-    "type-safe",
-    "openapi",
-    "swagger",
-    "oas",
     "code-generator",
     "codegen",
+    "fetch",
+    "http-client",
+    "kubb",
+    "oas",
+    "openapi",
     "plugins",
-    "kubb"
+    "rest-api",
+    "sdk-generator",
+    "swagger",
+    "type-safe",
+    "type-safety",
+    "typescript"
   ],
+  "license": "MIT",
+  "author": "stijnvanhulle",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/kubb-labs/kubb.git",
+    "url": "git+https://github.com/kubb-labs/plugins.git",
     "directory": "packages/plugin-client"
   },
-  "license": "MIT",
-  "author": "stijnvanhulle",
-  "sideEffects": false,
+  "files": [
+    "src",
+    "dist",
+    "templates",
+    "extension.yaml",
+    "*.d.ts",
+    "*.d.cts",
+    "!/**/**.test.**",
+    "!/**/__tests__/**",
+    "!/**/__snapshots__/**"
+  ],
   "type": "module",
+  "sideEffects": false,
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "typesVersions": {
+    "*": {
+      "clients/axios": [
+        "./dist/clients/axios.d.ts"
+      ],
+      "clients/fetch": [
+        "./dist/clients/fetch.d.ts"
+      ],
+      "templates/config.source": [
+        "./dist/templates/config.source.d.ts"
+      ],
+      "templates/clients/axios.source": [
+        "./dist/templates/clients/axios.source.d.ts"
+      ],
+      "templates/clients/fetch.source": [
+        "./dist/templates/clients/fetch.source.d.ts"
+      ]
+    }
+  },
   "exports": {
     ".": {
       "import": "./dist/index.js",
@@ -42,14 +75,6 @@
       "import": "./dist/clients/fetch.js",
       "require": "./dist/clients/fetch.cjs"
     },
-    "./components": {
-      "import": "./dist/components.js",
-      "require": "./dist/components.cjs"
-    },
-    "./generators": {
-      "import": "./dist/generators.js",
-      "require": "./dist/generators.cjs"
-    },
     "./templates/clients/axios.source": {
       "import": "./dist/templates/clients/axios.source.js",
       "require": "./dist/templates/clients/axios.source.cjs"
@@ -64,65 +89,22 @@
     },
     "./package.json": "./package.json"
   },
-  "types": "./dist/index.d.ts",
-  "typesVersions": {
-    "*": {
-      "components": [
-        "./dist/components.d.ts"
-      ],
-      "generators": [
-        "./dist/generators.d.ts"
-      ],
-      "clients/axios": [
-        "./dist/clients/axios.d.ts"
-      ],
-      "clients/fetch": [
-        "./dist/clients/fetch.d.ts"
-      ],
-      "templates/config.source": [
-        "./dist/templates/config.source.d.ts"
-      ],
-      "templates/clients/axios.source": [
-        "./dist/templates/clients/axios.source.d.ts"
-      ],
-      "templates/clients/fetch.source": [
-        "./dist/templates/clients/fetch.source.d.ts"
-      ]
-    }
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
   },
-  "files": [
-    "src",
-    "dist",
-    "templates",
-    "*.d.ts",
-    "*.d.cts",
-    "!/**/**.test.**",
-    "!/**/__tests__/**",
-    "!/**/__snapshots__/**"
-  ],
-  "size-limit": [
-    {
-      "path": "./dist/*.js",
-      "limit": "510 KiB",
-      "gzip": true
-    }
-  ],
   "dependencies": {
-    "@kubb/fabric-core": "0.14.0",
-    "@kubb/react-fabric": "0.14.0",
-    "@kubb/core": "5.0.0-alpha.9",
-    "@kubb/oas": "5.0.0-alpha.9",
-    "@kubb/plugin-oas": "5.0.0-alpha.9",
-    "@kubb/plugin-ts": "5.0.0-alpha.9",
-    "@kubb/plugin-zod": "5.0.0-alpha.9"
+    "@kubb/core": "5.0.0-beta.4",
+    "@kubb/renderer-jsx": "5.0.0-beta.4",
+    "@kubb/plugin-ts": "5.0.0-beta.4",
+    "@kubb/plugin-zod": "5.0.0-beta.4"
   },
   "devDependencies": {
-    "axios": "^1.13.6",
+    "axios": "^1.15.2",
     "@internals/utils": "0.0.0"
   },
   "peerDependencies": {
-    "@kubb/fabric-core": "0.14.0",
-    "@kubb/react-fabric": "0.14.0",
+    "@kubb/renderer-jsx": "5.0.0-beta.4",
     "axios": "^1.7.2"
   },
   "peerDependenciesMeta": {
@@ -130,20 +112,21 @@
       "optional": true
     }
   },
+  "size-limit": [
+    {
+      "path": "./dist/*.js",
+      "limit": "510 KiB",
+      "gzip": true
+    }
+  ],
   "engines": {
     "node": ">=22"
   },
-  "publishConfig": {
-    "access": "public",
-    "registry": "https://registry.npmjs.org/"
-  },
-  "main": "./dist/index.cjs",
-  "module": "./dist/index.js",
   "scripts": {
     "build": "tsdown && size-limit",
     "clean": "npx rimraf ./dist",
-    "lint": "bun biome lint .",
-    "lint:fix": "bun biome lint --fix --unsafe .",
+    "lint": "oxlint .",
+    "lint:fix": "oxlint --fix .",
     "release": "pnpm publish --no-git-check",
     "release:canary": "bash ../../.github/canary.sh && node ../../scripts/build.js canary && pnpm publish --no-git-check",
     "start": "tsdown --watch",

package/src/clients/axios.ts

@@ -32,7 +32,10 @@ export type ResponseConfig<TData = unknown> = {
 
 export type ResponseErrorConfig<TError = unknown> = AxiosError<TError>
 
-export type Client = <TResponseData, _TError = unknown, TRequestData = unknown>(config: RequestConfig<TRequestData>) => Promise<ResponseConfig<TResponseData>>
+export type Client = <TResponseData, _TError = unknown, TRequestData = unknown>(
+  config: RequestConfig<TRequestData>,
+  request?: unknown,
+) => Promise<ResponseConfig<TResponseData>>
 
 let _config: Partial<RequestConfig> = {
   baseURL: typeof AXIOS_BASE !== 'undefined' ? AXIOS_BASE : undefined,
@@ -63,6 +66,7 @@ export const axiosInstance = axios.create(getConfig())
 
 export const client = async <TResponseData, TError = unknown, TRequestData = unknown>(
   config: RequestConfig<TRequestData>,
+  _request?: unknown,
 ): Promise<ResponseConfig<TResponseData>> => {
   return axiosInstance.request<TResponseData, ResponseConfig<TResponseData>>(mergeConfig(getConfig(), config)).catch((e: AxiosError<TError>) => {
     throw e

package/src/clients/fetch.ts

@@ -52,10 +52,14 @@ export const mergeConfig = <T extends RequestConfig>(...configs: Array<Partial<T
 
 export type ResponseErrorConfig<TError = unknown> = TError
 
-export type Client = <TResponseData, _TError = unknown, TRequestData = unknown>(config: RequestConfig<TRequestData>) => Promise<ResponseConfig<TResponseData>>
+export type Client = <TResponseData, _TError = unknown, TRequestData = unknown>(
+  config: RequestConfig<TRequestData>,
+  request?: unknown,
+) => Promise<ResponseConfig<TResponseData>>
 
 export const client = async <TResponseData, _TError = unknown, RequestData = unknown>(
   paramsConfig: RequestConfig<RequestData>,
+  _request?: unknown,
 ): Promise<ResponseConfig<TResponseData>> => {
   const normalizedParams = new URLSearchParams()
 

package/src/components/ClassClient.tsx

@@ -1,40 +1,40 @@
 import { buildJSDoc, URLPath } from '@internals/utils'
-import type { Operation } from '@kubb/oas'
-import type { OperationSchemas } from '@kubb/plugin-oas'
-import { getComments } from '@kubb/plugin-oas/utils'
-import { File, FunctionParams } from '@kubb/react-fabric'
-import type { FabricReactNode } from '@kubb/react-fabric/types'
+import type { ast } from '@kubb/core'
+import type { ResolverTs } from '@kubb/plugin-ts'
+import { functionPrinter } from '@kubb/plugin-ts'
+import type { ResolverZod } from '@kubb/plugin-zod'
+import { File } from '@kubb/renderer-jsx'
+import type { KubbReactNode } from '@kubb/renderer-jsx/types'
 import type { PluginClient } from '../types.ts'
-
+import { buildClassClientParams, buildFormDataLine, buildGenerics, buildHeaders, buildRequestDataLine, buildReturnStatement, getComments } from '../utils.ts'
 import { Client } from './Client.tsx'
 
+type OperationData = {
+  node: ast.OperationNode
+  name: string
+  tsResolver: ResolverTs
+  zodResolver?: ResolverZod
+}
+
 type Props = {
-  /**
-   * Name of the class
-   */
   name: string
   isExportable?: boolean
   isIndexable?: boolean
-  operations: Array<{
-    operation: Operation
-    name: string
-    typeSchemas: OperationSchemas
-    zodSchemas: OperationSchemas | undefined
-  }>
+  operations: Array<OperationData>
   baseURL: string | undefined
   dataReturnType: PluginClient['resolvedOptions']['dataReturnType']
   paramsCasing: PluginClient['resolvedOptions']['paramsCasing']
   paramsType: PluginClient['resolvedOptions']['pathParamsType']
   pathParamsType: PluginClient['resolvedOptions']['pathParamsType']
   parser: PluginClient['resolvedOptions']['parser'] | undefined
-  children?: FabricReactNode
+  children?: KubbReactNode
 }
 
 type GenerateMethodProps = {
-  operation: Operation
+  node: ast.OperationNode
   name: string
-  typeSchemas: OperationSchemas
-  zodSchemas: OperationSchemas | undefined
+  tsResolver: ResolverTs
+  zodResolver?: ResolverZod
   baseURL: string | undefined
   dataReturnType: PluginClient['resolvedOptions']['dataReturnType']
   parser: PluginClient['resolvedOptions']['parser'] | undefined
@@ -43,115 +43,13 @@ type GenerateMethodProps = {
   pathParamsType: PluginClient['resolvedOptions']['pathParamsType']
 }
 
-function buildHeaders(contentType: string, hasHeaderParams: boolean): Array<string> {
-  return [
-    contentType !== 'application/json' && contentType !== 'multipart/form-data' ? `'Content-Type': '${contentType}'` : undefined,
-    hasHeaderParams ? '...headers' : undefined,
-  ].filter(Boolean) as Array<string>
-}
-
-function buildGenerics(typeSchemas: OperationSchemas): Array<string> {
-  const TError = `ResponseErrorConfig<${typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error'}>`
-  return [typeSchemas.response.name, TError, typeSchemas.request?.name || 'unknown'].filter(Boolean)
-}
-
-function buildClientParams({
-  operation,
-  path,
-  baseURL,
-  typeSchemas,
-  isFormData,
-  headers,
-}: {
-  operation: Operation
-  path: URLPath
-  baseURL: string | undefined
-  typeSchemas: OperationSchemas
-  isFormData: boolean
-  headers: Array<string>
-}) {
-  return FunctionParams.factory({
-    config: {
-      mode: 'object',
-      children: {
-        requestConfig: {
-          mode: 'inlineSpread',
-        },
-        method: {
-          value: JSON.stringify(operation.method.toUpperCase()),
-        },
-        url: {
-          value: path.template,
-        },
-        baseURL: baseURL
-          ? {
-              value: JSON.stringify(baseURL),
-            }
-          : undefined,
-        params: typeSchemas.queryParams?.name ? {} : undefined,
-        data: typeSchemas.request?.name
-          ? {
-              value: isFormData ? 'formData as FormData' : 'requestData',
-            }
-          : undefined,
-        headers: headers.length
-          ? {
-              value: `{ ${headers.join(', ')}, ...requestConfig.headers }`,
-            }
-          : undefined,
-      },
-    },
-  })
-}
-
-function buildRequestDataLine({
-  parser,
-  zodSchemas,
-  typeSchemas,
-}: {
-  parser: PluginClient['resolvedOptions']['parser'] | undefined
-  zodSchemas: OperationSchemas | undefined
-  typeSchemas: OperationSchemas
-}): string {
-  if (parser === 'zod' && zodSchemas?.request?.name) {
-    return `const requestData = ${zodSchemas.request.name}.parse(data)`
-  }
-  if (typeSchemas?.request?.name) {
-    return 'const requestData = data'
-  }
-  return ''
-}
-
-function buildFormDataLine(isFormData: boolean, hasRequest: boolean): string {
-  return isFormData && hasRequest ? 'const formData = buildFormData(requestData)' : ''
-}
-
-function buildReturnStatement({
-  dataReturnType,
-  parser,
-  zodSchemas,
-}: {
-  dataReturnType: PluginClient['resolvedOptions']['dataReturnType']
-  parser: PluginClient['resolvedOptions']['parser'] | undefined
-  zodSchemas: OperationSchemas | undefined
-}): string {
-  if (dataReturnType === 'full' && parser === 'zod' && zodSchemas) {
-    return `return {...res, data: ${zodSchemas.response.name}.parse(res.data)}`
-  }
-  if (dataReturnType === 'data' && parser === 'zod' && zodSchemas) {
-    return `return ${zodSchemas.response.name}.parse(res.data)`
-  }
-  if (dataReturnType === 'full' && parser === 'client') {
-    return 'return res'
-  }
-  return 'return res.data'
-}
+const declarationPrinter = functionPrinter({ mode: 'declaration' })
 
 function generateMethod({
-  operation,
+  node,
   name,
-  typeSchemas,
-  zodSchemas,
+  tsResolver,
+  zodResolver,
   baseURL,
   dataReturnType,
   parser,
@@ -159,18 +57,23 @@ function generateMethod({
   paramsCasing,
   pathParamsType,
 }: GenerateMethodProps): string {
-  const path = new URLPath(operation.path, { casing: paramsCasing })
-  const contentType = operation.getContentType()
+  const path = new URLPath(node.path, { casing: paramsCasing })
+  const contentType = node.requestBody?.content?.[0]?.contentType ?? 'application/json'
   const isFormData = contentType === 'multipart/form-data'
-  const headers = buildHeaders(contentType, !!typeSchemas.headerParams?.name)
-  const generics = buildGenerics(typeSchemas)
-  const params = ClassClient.getParams({ paramsType, paramsCasing, pathParamsType, typeSchemas, isConfigurable: true })
-  const clientParams = buildClientParams({ operation, path, baseURL, typeSchemas, isFormData, headers })
-  const jsdoc = buildJSDoc(getComments(operation))
-
-  const requestDataLine = buildRequestDataLine({ parser, zodSchemas, typeSchemas })
-  const formDataLine = buildFormDataLine(isFormData, !!typeSchemas?.request?.name)
-  const returnStatement = buildReturnStatement({ dataReturnType, parser, zodSchemas })
+  const headerParamsName =
+    node.parameters.filter((p) => p.in === 'header').length > 0
+      ? tsResolver.resolveHeaderParamsName(node, node.parameters.filter((p) => p.in === 'header')[0]!)
+      : undefined
+  const headers = buildHeaders(contentType, !!headerParamsName)
+  const generics = buildGenerics(node, tsResolver)
+  const paramsNode = ClassClient.getParams({ paramsType, paramsCasing, pathParamsType, node, tsResolver, isConfigurable: true })
+  const paramsSignature = declarationPrinter.print(paramsNode) ?? ''
+  const clientParams = buildClassClientParams({ node, path, baseURL, tsResolver, isFormData, headers })
+  const jsdoc = buildJSDoc(getComments(node))
+
+  const requestDataLine = buildRequestDataLine({ parser, node, zodResolver })
+  const formDataLine = buildFormDataLine(isFormData, !!node.requestBody?.content?.[0]?.schema)
+  const returnStatement = buildReturnStatement({ dataReturnType, parser, node, zodResolver })
 
   const methodBody = [
     'const { client: request = fetch, ...requestConfig } = mergeConfig(this.#config, config)',
@@ -184,7 +87,7 @@ function generateMethod({
     .map((line) => `    ${line}`)
     .join('\n')
 
-  return `${jsdoc}async ${name}(${params.toConstructor()}) {\n${methodBody}\n  }`
+  return `${jsdoc}async ${name}(${paramsSignature}) {\n${methodBody}\n  }`
 }
 
 export function ClassClient({
@@ -199,13 +102,13 @@ export function ClassClient({
   paramsCasing,
   pathParamsType,
   children,
-}: Props): FabricReactNode {
-  const methods = operations.map(({ operation, name: methodName, typeSchemas, zodSchemas }) =>
+}: Props): KubbReactNode {
+  const methods = operations.map(({ node, name: methodName, tsResolver, zodResolver }) =>
     generateMethod({
-      operation,
+      node,
       name: methodName,
-      typeSchemas,
-      zodSchemas,
+      tsResolver,
+      zodResolver,
       baseURL,
       dataReturnType,
       parser,