@kubb/plugin-solid-query 3.18.3 → 4.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kubb/plugin-solid-query",
-  "version": "3.18.3",
+  "version": "4.0.2",
   "description": "Solid Query hooks generator plugin for Kubb, creating type-safe API client hooks from OpenAPI specifications for Solid.js applications.",
   "keywords": [
     "solid-query",
@@ -61,24 +61,23 @@
     "!/**/__tests__/**"
   ],
   "dependencies": {
-    "remeda": "^2.30.0",
-    "@kubb/core": "3.18.3",
-    "@kubb/oas": "3.18.3",
-    "@kubb/plugin-client": "3.18.3",
-    "@kubb/plugin-oas": "3.18.3",
-    "@kubb/plugin-ts": "3.18.3",
-    "@kubb/plugin-zod": "3.18.3",
-    "@kubb/react": "3.18.3"
+    "remeda": "^2.32.0",
+    "@kubb/core": "4.0.2",
+    "@kubb/oas": "4.0.2",
+    "@kubb/plugin-client": "4.0.2",
+    "@kubb/plugin-oas": "4.0.2",
+    "@kubb/plugin-ts": "4.0.2",
+    "@kubb/plugin-zod": "4.0.2",
+    "@kubb/react": "4.0.2"
   },
   "devDependencies": {
     "@types/react": "^18.3.24",
     "react": "^18.3.1",
     "tsdown": "^0.14.2",
-    "typescript": "^5.9.2",
-    "@kubb/config-ts": "3.18.3"
+    "typescript": "^5.9.2"
   },
   "peerDependencies": {
-    "@kubb/react": "^3.0.0"
+    "@kubb/react": "^4.0.0"
   },
   "engines": {
     "node": ">=20"

package/src/components/Mutation.tsx

@@ -0,0 +1,177 @@
+import { isOptional, type Operation } from '@kubb/oas'
+import { Client } from '@kubb/plugin-client/components'
+import type { OperationSchemas } from '@kubb/plugin-oas'
+import { getComments, getPathParams } from '@kubb/plugin-oas/utils'
+import { File, Function, FunctionParams } from '@kubb/react'
+import type { Params } from '@kubb/react/types'
+import type { ReactNode } from 'react'
+import type { PluginSolidQuery } from '../types.ts'
+import { MutationKey } from './MutationKey.tsx'
+
+type Props = {
+  /**
+   * Name of the function
+   */
+  name: string
+  typeName: string
+  clientName: string
+  mutationKeyName: string
+  typeSchemas: OperationSchemas
+  operation: Operation
+  dataReturnType: PluginSolidQuery['resolvedOptions']['client']['dataReturnType']
+  paramsCasing: PluginSolidQuery['resolvedOptions']['paramsCasing']
+  paramsType: PluginSolidQuery['resolvedOptions']['paramsType']
+  pathParamsType: PluginSolidQuery['resolvedOptions']['pathParamsType']
+}
+
+type GetParamsProps = {
+  paramsCasing: PluginSolidQuery['resolvedOptions']['paramsCasing']
+  pathParamsType: PluginSolidQuery['resolvedOptions']['pathParamsType']
+  dataReturnType: PluginSolidQuery['resolvedOptions']['client']['dataReturnType']
+  typeSchemas: OperationSchemas
+}
+
+function getParams({ paramsCasing, dataReturnType, typeSchemas }: GetParamsProps) {
+  const TData = dataReturnType === 'data' ? typeSchemas.response.name : `ResponseConfig<${typeSchemas.response.name}>`
+  const mutationParams = FunctionParams.factory({
+    ...getPathParams(typeSchemas.pathParams, { typed: true, casing: paramsCasing }),
+    data: typeSchemas.request?.name
+      ? {
+          type: typeSchemas.request?.name,
+          optional: isOptional(typeSchemas.request?.schema),
+        }
+      : undefined,
+    params: typeSchemas.queryParams?.name
+      ? {
+          type: typeSchemas.queryParams?.name,
+          optional: isOptional(typeSchemas.queryParams?.schema),
+        }
+      : undefined,
+    headers: typeSchemas.headerParams?.name
+      ? {
+          type: typeSchemas.headerParams?.name,
+          optional: isOptional(typeSchemas.headerParams?.schema),
+        }
+      : undefined,
+  })
+  const TRequest = mutationParams.toConstructor()
+  const TError = `ResponseErrorConfig<${typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error'}>`
+  const generics = [TData, TError, TRequest ? `{${TRequest}}` : 'void', 'TContext'].join(', ')
+
+  return FunctionParams.factory({
+    options: {
+      type: `
+{
+  mutation?: ReturnType<UseMutationOptions<${generics}>> & { client?: QueryClient },
+  client?: ${typeSchemas.request?.name ? `Partial<RequestConfig<${typeSchemas.request?.name}>> & { client?: typeof fetch }` : 'Partial<RequestConfig> & { client?: typeof fetch }'},
+}
+`,
+      default: '{}',
+    },
+  })
+}
+
+export function Mutation({
+  name,
+  clientName,
+  paramsCasing,
+  paramsType,
+  pathParamsType,
+  dataReturnType,
+  typeSchemas,
+  operation,
+  mutationKeyName,
+}: Props): ReactNode {
+  const mutationKeyParams = MutationKey.getParams({
+    pathParamsType,
+    typeSchemas,
+  })
+
+  const params = getParams({
+    paramsCasing,
+    pathParamsType,
+    dataReturnType,
+    typeSchemas,
+  })
+
+  const clientParams = Client.getParams({
+    paramsCasing,
+    paramsType,
+    typeSchemas,
+    pathParamsType,
+    isConfigurable: true,
+  })
+
+  const mutationParams = FunctionParams.factory({
+    ...getPathParams(typeSchemas.pathParams, { typed: true, casing: paramsCasing }),
+    data: typeSchemas.request?.name
+      ? {
+          type: typeSchemas.request?.name,
+          optional: isOptional(typeSchemas.request?.schema),
+        }
+      : undefined,
+    params: typeSchemas.queryParams?.name
+      ? {
+          type: typeSchemas.queryParams?.name,
+          optional: isOptional(typeSchemas.queryParams?.schema),
+        }
+      : undefined,
+    headers: typeSchemas.headerParams?.name
+      ? {
+          type: typeSchemas.headerParams?.name,
+          optional: isOptional(typeSchemas.headerParams?.schema),
+        }
+      : undefined,
+  })
+
+  const dataParams = FunctionParams.factory({
+    data: {
+      // No use of pathParams because useMutation can only take one argument in object form,
+      // see https://tanstack.com/query/latest/docs/framework/react/reference/useMutation#usemutation
+      mode: 'object',
+      children: Object.entries(mutationParams.params).reduce((acc, [key, value]) => {
+        if (value) {
+          acc[key] = {
+            ...value,
+            type: undefined,
+          }
+        }
+
+        return acc
+      }, {} as Params),
+    },
+  })
+
+  const TRequest = mutationParams.toConstructor()
+  const TData = dataReturnType === 'data' ? typeSchemas.response.name : `ResponseConfig<${typeSchemas.response.name}>`
+  const TError = `ResponseErrorConfig<${typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error'}>`
+  const generics = [TData, TError, TRequest ? `{${TRequest}}` : 'void', 'TContext'].join(', ')
+
+  return (
+    <File.Source name={name} isExportable isIndexable>
+      <Function
+        name={name}
+        export
+        params={params.toConstructor()}
+        JSDoc={{
+          comments: getComments(operation),
+        }}
+        generics={['TContext']}
+      >
+        {`
+        const { mutation = {}, client: config = {} } = options ?? {}
+        const { client: queryClient, ...mutationOptions } = mutation;
+        const mutationKey = mutationOptions.mutationKey ?? ${mutationKeyName}(${mutationKeyParams.toCall()})
+
+        return useMutation<${generics}>(()=> ({
+          mutationFn: async(${dataParams.toConstructor()}) => {
+            return ${clientName}(${clientParams.toCall()})
+          },
+          mutationKey,
+          ...mutationOptions
+        }), queryClient? () => queryClient: undefined)
+    `}
+      </Function>
+    </File.Source>
+  )
+}

package/src/components/MutationKey.tsx

@@ -0,0 +1,54 @@
+import { URLPath } from '@kubb/core/utils'
+import type { Operation } from '@kubb/oas'
+import type { OperationSchemas } from '@kubb/plugin-oas'
+import { File, Function, FunctionParams, Type } from '@kubb/react'
+import type { ReactNode } from 'react'
+import type { PluginSolidQuery, Transformer } from '../types'
+
+type Props = {
+  name: string
+  typeName: string
+  typeSchemas: OperationSchemas
+  operation: Operation
+  paramsCasing: PluginSolidQuery['resolvedOptions']['paramsCasing']
+  pathParamsType: PluginSolidQuery['resolvedOptions']['pathParamsType']
+  transformer: Transformer | undefined
+}
+
+type GetParamsProps = {
+  pathParamsType: PluginSolidQuery['resolvedOptions']['pathParamsType']
+  typeSchemas: OperationSchemas
+}
+
+function getParams({}: GetParamsProps) {
+  return FunctionParams.factory({})
+}
+
+const getTransformer: Transformer = ({ operation, casing }) => {
+  const path = new URLPath(operation.path, { casing })
+
+  return [`{ url: '${path.toURLPath()}' }`]
+}
+
+export function MutationKey({ name, typeSchemas, pathParamsType, paramsCasing, operation, typeName, transformer = getTransformer }: Props): ReactNode {
+  const params = getParams({ pathParamsType, typeSchemas })
+  const keys = transformer({ operation, schemas: typeSchemas, casing: paramsCasing })
+
+  return (
+    <>
+      <File.Source name={name} isExportable isIndexable>
+        <Function.Arrow name={name} export params={params.toConstructor()} singleLine>
+          {`[${keys.join(', ')}] as const`}
+        </Function.Arrow>
+      </File.Source>
+      <File.Source name={typeName} isExportable isIndexable isTypeOnly>
+        <Type name={typeName} export>
+          {`ReturnType<typeof ${name}>`}
+        </Type>
+      </File.Source>
+    </>
+  )
+}
+
+MutationKey.getParams = getParams
+MutationKey.getTransformer = getTransformer

package/src/components/Query.tsx

@@ -165,7 +165,7 @@ export function Query({
        const { client: queryClient, ...queryOptions } = queryConfig
        const queryKey = queryOptions?.queryKey ?? ${queryKeyName}(${queryKeyParams.toCall()})
 
-       const query = createQuery(() => ({
+       const query = useQuery(() => ({
         ...${queryOptions},
         queryKey,
         initialData: null,

package/src/components/index.ts

@@ -1,3 +1,5 @@
+export { Mutation } from './Mutation.tsx'
+export { MutationKey } from './MutationKey.tsx'
 export { Query } from './Query.tsx'
 export { QueryKey } from './QueryKey.tsx'
 export { QueryOptions } from './QueryOptions.tsx'

package/src/generators/__snapshots__/clientDataReturnTypeFull.ts

@@ -5,7 +5,7 @@
 import fetch from '@kubb/plugin-client/clients/axios'
 import type { RequestConfig, ResponseErrorConfig, ResponseConfig } from '@kubb/plugin-client/clients/axios'
 import type { QueryKey, QueryClient, UseBaseQueryOptions, UseQueryResult } from '@tanstack/svelte-query'
-import { queryOptions, createQuery } from '@tanstack/svelte-query'
+import { queryOptions, useQuery } from '@tanstack/svelte-query'
 
 export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: '/pet/findByTags' }, ...(params ? [params] : [])] as const
 
@@ -76,7 +76,7 @@ export function createFindPetsByTags<
   const { client: queryClient, ...queryOptions } = queryConfig
   const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(params)
 
-  const query = createQuery(
+  const query = useQuery(
     () => ({
       ...(findPetsByTagsQueryOptions(headers, params, config) as unknown as UseBaseQueryOptions),
       queryKey,

package/src/generators/__snapshots__/clientGetImportPath.ts

@@ -5,7 +5,7 @@
 import fetch from 'axios'
 import type { QueryKey, QueryClient, UseBaseQueryOptions, UseQueryResult } from '@tanstack/svelte-query'
 import type { RequestConfig, ResponseErrorConfig } from 'axios'
-import { queryOptions, createQuery } from '@tanstack/svelte-query'
+import { queryOptions, useQuery } from '@tanstack/svelte-query'
 
 export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: '/pet/findByTags' }, ...(params ? [params] : [])] as const
 
@@ -71,7 +71,7 @@ export function createFindPetsByTags<
   const { client: queryClient, ...queryOptions } = queryConfig
   const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(params)
 
-  const query = createQuery(
+  const query = useQuery(
     () => ({
       ...(findPetsByTagsQueryOptions(headers, params, config) as unknown as UseBaseQueryOptions),
       queryKey,

package/src/generators/__snapshots__/findByTags.ts

@@ -5,7 +5,7 @@
 import fetch from '@kubb/plugin-client/clients/axios'
 import type { RequestConfig, ResponseErrorConfig } from '@kubb/plugin-client/clients/axios'
 import type { QueryKey, QueryClient, UseBaseQueryOptions, UseQueryResult } from '@tanstack/svelte-query'
-import { queryOptions, createQuery } from '@tanstack/svelte-query'
+import { queryOptions, useQuery } from '@tanstack/svelte-query'
 
 export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: '/pet/findByTags' }, ...(params ? [params] : [])] as const
 
@@ -71,7 +71,7 @@ export function createFindPetsByTags<
   const { client: queryClient, ...queryOptions } = queryConfig
   const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(params)
 
-  const query = createQuery(
+  const query = useQuery(
     () => ({
       ...(findPetsByTagsQueryOptions(headers, params, config) as unknown as UseBaseQueryOptions),
       queryKey,

package/src/generators/__snapshots__/findByTagsObject.ts

@@ -5,7 +5,7 @@
 import fetch from '@kubb/plugin-client/clients/axios'
 import type { RequestConfig, ResponseErrorConfig } from '@kubb/plugin-client/clients/axios'
 import type { QueryKey, QueryClient, UseBaseQueryOptions, UseQueryResult } from '@tanstack/svelte-query'
-import { queryOptions, createQuery } from '@tanstack/svelte-query'
+import { queryOptions, useQuery } from '@tanstack/svelte-query'
 
 export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: '/pet/findByTags' }, ...(params ? [params] : [])] as const
 
@@ -68,7 +68,7 @@ export function createFindPetsByTags<
   const { client: queryClient, ...queryOptions } = queryConfig
   const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(params)
 
-  const query = createQuery(
+  const query = useQuery(
     () => ({
       ...(findPetsByTagsQueryOptions({ headers, params }, config) as unknown as UseBaseQueryOptions),
       queryKey,

package/src/generators/__snapshots__/findByTagsPathParamsObject.ts

@@ -5,7 +5,7 @@
 import fetch from '@kubb/plugin-client/clients/axios'
 import type { RequestConfig, ResponseErrorConfig } from '@kubb/plugin-client/clients/axios'
 import type { QueryKey, QueryClient, UseBaseQueryOptions, UseQueryResult } from '@tanstack/svelte-query'
-import { queryOptions, createQuery } from '@tanstack/svelte-query'
+import { queryOptions, useQuery } from '@tanstack/svelte-query'
 
 export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: '/pet/findByTags' }, ...(params ? [params] : [])] as const
 
@@ -71,7 +71,7 @@ export function createFindPetsByTags<
   const { client: queryClient, ...queryOptions } = queryConfig
   const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(params)
 
-  const query = createQuery(
+  const query = useQuery(
     () => ({
       ...(findPetsByTagsQueryOptions(headers, params, config) as unknown as UseBaseQueryOptions),
       queryKey,

package/src/generators/__snapshots__/findByTagsWithCustomQueryKey.ts

@@ -5,7 +5,7 @@
 import fetch from '@kubb/plugin-client/clients/axios'
 import type { RequestConfig, ResponseErrorConfig } from '@kubb/plugin-client/clients/axios'
 import type { QueryKey, QueryClient, UseBaseQueryOptions, UseQueryResult } from '@tanstack/react-query'
-import { queryOptions, createQuery } from '@tanstack/react-query'
+import { queryOptions, useQuery } from '@tanstack/react-query'
 
 export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => ['test', { url: '/pet/findByTags' }, ...(params ? [params] : [])] as const
 
@@ -71,7 +71,7 @@ export function createFindPetsByTags<
   const { client: queryClient, ...queryOptions } = queryConfig
   const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(params)
 
-  const query = createQuery(
+  const query = useQuery(
     () => ({
       ...(findPetsByTagsQueryOptions(headers, params, config) as unknown as UseBaseQueryOptions),
       queryKey,

package/src/generators/__snapshots__/findByTagsWithZod.ts

@@ -5,7 +5,7 @@
 import fetch from '@kubb/plugin-client/clients/axios'
 import type { RequestConfig, ResponseErrorConfig } from '@kubb/plugin-client/clients/axios'
 import type { QueryKey, QueryClient, UseBaseQueryOptions, UseQueryResult } from '@tanstack/svelte-query'
-import { queryOptions, createQuery } from '@tanstack/svelte-query'
+import { queryOptions, useQuery } from '@tanstack/svelte-query'
 
 export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: '/pet/findByTags' }, ...(params ? [params] : [])] as const
 
@@ -71,7 +71,7 @@ export function createFindPetsByTags<
   const { client: queryClient, ...queryOptions } = queryConfig
   const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(params)
 
-  const query = createQuery(
+  const query = useQuery(
     () => ({
       ...(findPetsByTagsQueryOptions(headers, params, config) as unknown as UseBaseQueryOptions),
       queryKey,

package/src/generators/__snapshots__/postAsQuery.ts

@@ -5,7 +5,7 @@
 import fetch from '@kubb/plugin-client/clients/axios'
 import type { RequestConfig, ResponseErrorConfig } from '@kubb/plugin-client/clients/axios'
 import type { QueryKey, QueryClient, UseBaseQueryOptions, UseQueryResult } from 'custom-query'
-import { queryOptions, createQuery } from 'custom-query'
+import { queryOptions, useQuery } from 'custom-query'
 
 export const updatePetWithFormQueryKey = (
   petId: UpdatePetWithFormPathParams['petId'],
@@ -79,7 +79,7 @@ export function createUpdatePetWithForm<
   const { client: queryClient, ...queryOptions } = queryConfig
   const queryKey = queryOptions?.queryKey ?? updatePetWithFormQueryKey(petId, data, params)
 
-  const query = createQuery(
+  const query = useQuery(
     () => ({
       ...(updatePetWithFormQueryOptions(petId, data, params, config) as unknown as UseBaseQueryOptions),
       queryKey,

package/src/generators/index.ts

@@ -1 +1,2 @@
+export { mutationGenerator } from './mutationGenerator.tsx'
 export { queryGenerator } from './queryGenerator.tsx'

package/src/generators/mutationGenerator.tsx

@@ -0,0 +1,144 @@
+import { pluginClientName } from '@kubb/plugin-client'
+import { Client } from '@kubb/plugin-client/components'
+import { createReactGenerator } from '@kubb/plugin-oas'
+import { useOas, useOperationManager } from '@kubb/plugin-oas/hooks'
+import { getBanner, getFooter } from '@kubb/plugin-oas/utils'
+import { pluginTsName } from '@kubb/plugin-ts'
+import { pluginZodName } from '@kubb/plugin-zod'
+import { File, useApp } from '@kubb/react'
+import { difference } from 'remeda'
+import { Mutation, MutationKey } from '../components'
+import type { PluginSolidQuery } from '../types'
+
+export const mutationGenerator = createReactGenerator<PluginSolidQuery>({
+  name: 'solid-query',
+  Operation({ options, operation }) {
+    const {
+      plugin: {
+        options: { output },
+      },
+      pluginManager,
+    } = useApp<PluginSolidQuery>()
+    const oas = useOas()
+    const { getSchemas, getName, getFile } = useOperationManager()
+
+    const isQuery = !!options.query && options.query?.methods.some((method) => operation.method === method)
+    const isMutation =
+      !isQuery &&
+      difference(options.mutation ? options.mutation.methods : [], options.query ? options.query.methods : []).some((method) => operation.method === method)
+
+    const importPath = options.mutation ? options.mutation.importPath : '@tanstack/solid-query'
+
+    const mutation = {
+      name: getName(operation, { type: 'function', prefix: 'use' }),
+      typeName: getName(operation, { type: 'type' }),
+      file: getFile(operation, { prefix: 'use' }),
+    }
+
+    const type = {
+      file: getFile(operation, { pluginKey: [pluginTsName] }),
+      //todo remove type?
+      schemas: getSchemas(operation, { pluginKey: [pluginTsName], type: 'type' }),
+    }
+
+    const zod = {
+      file: getFile(operation, { pluginKey: [pluginZodName] }),
+      schemas: getSchemas(operation, { pluginKey: [pluginZodName], type: 'function' }),
+    }
+
+    const hasClientPlugin = !!pluginManager.getPluginByKey([pluginClientName])
+    const client = {
+      name: hasClientPlugin
+        ? getName(operation, {
+            type: 'function',
+            pluginKey: [pluginClientName],
+          })
+        : getName(operation, {
+            type: 'function',
+          }),
+      file: getFile(operation, { pluginKey: [pluginClientName] }),
+    }
+
+    const mutationKey = {
+      name: getName(operation, { type: 'const', suffix: 'MutationKey' }),
+      typeName: getName(operation, { type: 'type', suffix: 'MutationKey' }),
+    }
+
+    if (!isMutation) {
+      return null
+    }
+
+    return (
+      <File
+        baseName={mutation.file.baseName}
+        path={mutation.file.path}
+        meta={mutation.file.meta}
+        banner={getBanner({ oas, output, config: pluginManager.config })}
+        footer={getFooter({ oas, output })}
+      >
+        {options.parser === 'zod' && (
+          <File.Import name={[zod.schemas.response.name, zod.schemas.request?.name].filter(Boolean)} root={mutation.file.path} path={zod.file.path} />
+        )}
+        <File.Import name={'fetch'} path={options.client.importPath} />
+        {!!hasClientPlugin && <File.Import name={[client.name]} root={mutation.file.path} path={client.file.path} />}
+        <File.Import name={['RequestConfig', 'ResponseConfig', 'ResponseErrorConfig']} path={options.client.importPath} isTypeOnly />
+        <File.Import
+          name={[
+            type.schemas.request?.name,
+            type.schemas.response.name,
+            type.schemas.pathParams?.name,
+            type.schemas.queryParams?.name,
+            type.schemas.headerParams?.name,
+            ...(type.schemas.statusCodes?.map((item) => item.name) || []),
+          ].filter(Boolean)}
+          root={mutation.file.path}
+          path={type.file.path}
+          isTypeOnly
+        />
+
+        <MutationKey
+          name={mutationKey.name}
+          typeName={mutationKey.typeName}
+          operation={operation}
+          pathParamsType={options.pathParamsType}
+          typeSchemas={type.schemas}
+          paramsCasing={options.paramsCasing}
+          transformer={options.mutationKey}
+        />
+
+        {!hasClientPlugin && (
+          <Client
+            name={client.name}
+            baseURL={options.client.baseURL}
+            operation={operation}
+            typeSchemas={type.schemas}
+            zodSchemas={zod.schemas}
+            dataReturnType={options.client.dataReturnType}
+            paramsCasing={options.paramsCasing}
+            paramsType={options.paramsType}
+            pathParamsType={options.pathParamsType}
+            parser={options.parser}
+          />
+        )}
+        {options.mutation && (
+          <>
+            <File.Import name={['useMutation']} path={importPath} />
+            <File.Import name={['UseMutationOptions', 'QueryClient']} path={importPath} isTypeOnly />
+            <Mutation
+              name={mutation.name}
+              clientName={client.name}
+              typeName={mutation.typeName}
+              typeSchemas={type.schemas}
+              operation={operation}
+              dataReturnType={options.client.dataReturnType}
+              paramsCasing={options.paramsCasing}
+              paramsType={options.paramsType}
+              pathParamsType={options.pathParamsType}
+              mutationKeyName={mutationKey.name}
+            />
+          </>
+        )}
+      </File>
+    )
+  },
+})

package/src/generators/queryGenerator.tsx

@@ -133,7 +133,7 @@ export const queryGenerator = createReactGenerator<PluginSolidQuery>({
         />
         {options.query && (
           <>
-            <File.Import name={['createQuery']} path={importPath} />
+            <File.Import name={['useQuery']} path={importPath} />
             <File.Import name={['QueryKey', 'QueryClient', 'UseBaseQueryOptions', 'UseQueryResult']} path={importPath} isTypeOnly />
             <Query
               name={query.name}

package/src/plugin.ts

@@ -1,16 +1,13 @@
 import path from 'node:path'
-
-import { FileManager, type Group, PluginManager, createPlugin } from '@kubb/core'
+import type { Plugin } from '@kubb/core'
+import { createPlugin, FileManager, type Group, PluginManager } from '@kubb/core'
 import { camelCase, pascalCase } from '@kubb/core/transformers'
+import type { PluginOas } from '@kubb/plugin-oas'
 import { OperationGenerator, pluginOasName } from '@kubb/plugin-oas'
-
 import { pluginTsName } from '@kubb/plugin-ts'
 import { pluginZodName } from '@kubb/plugin-zod'
-
-import type { Plugin } from '@kubb/core'
-import type { PluginOas } from '@kubb/plugin-oas'
-import { QueryKey } from './components'
-import { queryGenerator } from './generators'
+import { MutationKey, QueryKey } from './components'
+import { mutationGenerator, queryGenerator } from './generators'
 import type { PluginSolidQuery } from './types.ts'
 
 export const pluginSolidQueryName = 'plugin-solid-query' satisfies PluginSolidQuery['name']
@@ -27,8 +24,10 @@ export const pluginSolidQuery = createPlugin<PluginSolidQuery>((options) => {
     paramsType = 'inline',
     pathParamsType = paramsType === 'object' ? 'object' : options.pathParamsType || 'inline',
     queryKey = QueryKey.getTransformer,
-    generators = [queryGenerator].filter(Boolean),
+    generators = [queryGenerator, mutationGenerator].filter(Boolean),
+    mutation = {},
     query = {},
+    mutationKey = MutationKey.getTransformer,
     paramsCasing,
     contentType,
   } = options
@@ -52,6 +51,12 @@ export const pluginSolidQuery = createPlugin<PluginSolidQuery>((options) => {
               importPath: '@tanstack/solid-query',
               ...query,
             },
+      mutationKey,
+      mutation: {
+        methods: ['post', 'put', 'patch', 'delete'],
+        importPath: '@tanstack/solid-query',
+        ...mutation,
+      },
       paramsType,
       pathParamsType,
       parser,