@kubb/plugin-vue-query 5.0.0-alpha.8 → 5.0.0-beta.3

package/src/components/QueryKey.tsx

@@ -1,83 +1,92 @@
 import { URLPath } from '@internals/utils'
-import { isOptional, type Operation } from '@kubb/oas'
-import type { OperationSchemas } from '@kubb/plugin-oas'
-import { getPathParams } from '@kubb/plugin-oas/utils'
-import { File, Function, FunctionParams, Type } from '@kubb/react-fabric'
-import type { FabricReactNode } from '@kubb/react-fabric/types'
-import type { PluginVueQuery, Transformer } from '../types'
+import { ast } from '@kubb/core'
+import type { ResolverTs } from '@kubb/plugin-ts'
+import { functionPrinter } from '@kubb/plugin-ts'
+import { File, Function, Type } from '@kubb/renderer-jsx'
+import type { KubbReactNode } from '@kubb/renderer-jsx/types'
+import type { Transformer } from '../types.ts'
+import { buildQueryKeyParams } from '../utils.ts'
 
 type Props = {
   name: string
   typeName: string
-  typeSchemas: OperationSchemas
-  operation: Operation
-  paramsCasing: PluginVueQuery['resolvedOptions']['paramsCasing']
-  pathParamsType: PluginVueQuery['resolvedOptions']['pathParamsType']
+  node: ast.OperationNode
+  tsResolver: ResolverTs
+  paramsCasing: 'camelcase' | undefined
+  pathParamsType: 'object' | 'inline'
   transformer: Transformer | undefined
 }
 
-type GetParamsProps = {
-  paramsCasing: PluginVueQuery['resolvedOptions']['paramsCasing']
-  pathParamsType: PluginVueQuery['resolvedOptions']['pathParamsType']
-  typeSchemas: OperationSchemas
-}
+const declarationPrinter = functionPrinter({ mode: 'declaration' })
+const callPrinter = functionPrinter({ mode: 'call' })
 
-function getParams({ pathParamsType, paramsCasing, typeSchemas }: GetParamsProps) {
-  return FunctionParams.factory({
-    pathParams: {
-      mode: pathParamsType === 'object' ? 'object' : 'inlineSpread',
-      children: getPathParams(typeSchemas.pathParams, {
-        typed: true,
-        casing: paramsCasing,
-        override(item) {
-          return {
-            ...item,
-            type: `MaybeRefOrGetter<${item.type}>`,
-          }
-        },
-      }),
-    },
-    data: typeSchemas.request?.name
-      ? {
-          type: `MaybeRefOrGetter<${typeSchemas.request?.name}>`,
-          optional: isOptional(typeSchemas.request?.schema),
-        }
-      : undefined,
-    params: typeSchemas.queryParams?.name
-      ? {
-          type: `MaybeRefOrGetter<${typeSchemas.queryParams?.name}>`,
-          optional: isOptional(typeSchemas.queryParams?.schema),
-        }
-      : undefined,
+function wrapWithMaybeRefOrGetter(paramsNode: ast.FunctionParametersNode): ast.FunctionParametersNode {
+  const wrappedParams = paramsNode.params.map((param) => {
+    if ('kind' in param && (param as ast.ParameterGroupNode).kind === 'ParameterGroup') {
+      const group = param as ast.ParameterGroupNode
+      return {
+        ...group,
+        properties: group.properties.map((p) => ({
+          ...p,
+          type: p.type ? ast.createParamsType({ variant: 'reference', name: `MaybeRefOrGetter<${printType(p.type)}>` }) : p.type,
+        })),
+      }
+    }
+    const fp = param as ast.FunctionParameterNode
+    return {
+      ...fp,
+      type: fp.type ? ast.createParamsType({ variant: 'reference', name: `MaybeRefOrGetter<${printType(fp.type)}>` }) : fp.type,
+    }
   })
+  return ast.createFunctionParameters({ params: wrappedParams })
+}
+
+function printType(typeNode: ast.ParamsTypeNode | undefined): string {
+  if (!typeNode) return 'unknown'
+  if (typeNode.variant === 'reference') return typeNode.name
+  if (typeNode.variant === 'member') return `${typeNode.base}['${typeNode.key}']`
+  if (typeNode.variant === 'struct') {
+    const parts = typeNode.properties.map((p) => {
+      const typeStr = printType(p.type)
+      const key = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(p.name) ? p.name : JSON.stringify(p.name)
+      return p.optional ? `${key}?: ${typeStr}` : `${key}: ${typeStr}`
+    })
+    return `{ ${parts.join('; ')} }`
+  }
+  return 'unknown'
+}
+
+function getParams(
+  node: ast.OperationNode,
+  options: { pathParamsType: 'object' | 'inline'; paramsCasing: 'camelcase' | undefined; resolver: ResolverTs },
+): ast.FunctionParametersNode {
+  return wrapWithMaybeRefOrGetter(buildQueryKeyParams(node, options))
 }
 
-const getTransformer: Transformer = ({ operation, schemas, casing }) => {
-  const path = new URLPath(operation.path, { casing })
-  const keys = [
-    path.toObject({
-      type: 'path',
-      stringify: true,
-    }),
-    schemas.queryParams?.name ? '...(params ? [params] : [])' : undefined,
-    schemas.request?.name ? '...(data ? [data] : [])' : undefined,
-  ].filter(Boolean)
+const getTransformer: Transformer = ({ node, casing }) => {
+  const path = new URLPath(node.path, { casing })
+  const hasQueryParams = node.parameters.some((p) => p.in === 'query')
+  const hasRequestBody = !!node.requestBody?.content?.[0]?.schema
 
-  return keys
+  return [
+    path.toObject({ type: 'path', stringify: true }),
+    hasQueryParams ? '...(params ? [params] : [])' : undefined,
+    hasRequestBody ? '...(data ? [data] : [])' : undefined,
+  ].filter(Boolean) as string[]
 }
 
-export function QueryKey({ name, typeSchemas, paramsCasing, pathParamsType, operation, typeName, transformer = getTransformer }: Props): FabricReactNode {
-  const params = getParams({ pathParamsType, typeSchemas, paramsCasing })
+export function QueryKey({ name, node, tsResolver, paramsCasing, pathParamsType, typeName, transformer = getTransformer }: Props): KubbReactNode {
+  const paramsNode = getParams(node, { pathParamsType, paramsCasing, resolver: tsResolver })
+  const paramsSignature = declarationPrinter.print(paramsNode) ?? ''
   const keys = transformer({
-    operation,
-    schemas: typeSchemas,
+    node,
     casing: paramsCasing,
   })
 
   return (
     <>
       <File.Source name={name} isExportable isIndexable>
-        <Function.Arrow name={name} export params={params.toConstructor()} singleLine>
+        <Function.Arrow name={name} export params={paramsSignature} singleLine>
           {`[${keys.join(', ')}] as const`}
         </Function.Arrow>
       </File.Source>
@@ -92,3 +101,4 @@ export function QueryKey({ name, typeSchemas, paramsCasing, pathParamsType, oper
 
 QueryKey.getParams = getParams
 QueryKey.getTransformer = getTransformer
+QueryKey.callPrinter = callPrinter

package/src/components/QueryOptions.tsx

@@ -1,179 +1,157 @@
-import { getDefaultValue, isOptional } from '@kubb/oas'
-import { Client } from '@kubb/plugin-client/components'
-import type { OperationSchemas } from '@kubb/plugin-oas'
-import { getPathParams } from '@kubb/plugin-oas/utils'
-import { File, Function, FunctionParams } from '@kubb/react-fabric'
-import type { FabricReactNode } from '@kubb/react-fabric/types'
+import { ast } from '@kubb/core'
+import type { ResolverTs } from '@kubb/plugin-ts'
+import { functionPrinter } from '@kubb/plugin-ts'
+import { File, Function } from '@kubb/renderer-jsx'
+import type { KubbReactNode } from '@kubb/renderer-jsx/types'
 import type { PluginVueQuery } from '../types.ts'
+import { resolveErrorNames } from '../utils.ts'
 import { QueryKey } from './QueryKey.tsx'
 
 type Props = {
   name: string
   clientName: string
   queryKeyName: string
-  typeSchemas: OperationSchemas
+  node: ast.OperationNode
+  tsResolver: ResolverTs
   paramsCasing: PluginVueQuery['resolvedOptions']['paramsCasing']
   paramsType: PluginVueQuery['resolvedOptions']['paramsType']
   pathParamsType: PluginVueQuery['resolvedOptions']['pathParamsType']
   dataReturnType: PluginVueQuery['resolvedOptions']['client']['dataReturnType']
 }
 
-type GetParamsProps = {
-  paramsCasing: PluginVueQuery['resolvedOptions']['paramsCasing']
-  paramsType: PluginVueQuery['resolvedOptions']['paramsType']
-  pathParamsType: PluginVueQuery['resolvedOptions']['pathParamsType']
-  typeSchemas: OperationSchemas
-}
+const declarationPrinter = functionPrinter({ mode: 'declaration' })
+const callPrinter = functionPrinter({ mode: 'call' })
+
+export function getQueryOptionsParams(
+  node: ast.OperationNode,
+  options: {
+    paramsType: PluginVueQuery['resolvedOptions']['paramsType']
+    paramsCasing: PluginVueQuery['resolvedOptions']['paramsCasing']
+    pathParamsType: PluginVueQuery['resolvedOptions']['pathParamsType']
+    resolver: ResolverTs
+  },
+): ast.FunctionParametersNode {
+  const { paramsType, paramsCasing, pathParamsType, resolver } = options
+  const requestName = node.requestBody?.content?.[0]?.schema ? resolver.resolveDataName(node) : undefined
 
-function getParams({ paramsType, paramsCasing, pathParamsType, typeSchemas }: GetParamsProps) {
-  if (paramsType === 'object') {
-    const children = {
-      ...getPathParams(typeSchemas.pathParams, {
-        typed: true,
-        casing: paramsCasing,
-        override(item) {
-          return {
-            ...item,
-            type: `MaybeRefOrGetter<${item.type}>`,
-          }
-        },
+  const baseParams = ast.createOperationParams(node, {
+    paramsType,
+    pathParamsType: paramsType === 'object' ? 'object' : pathParamsType === 'object' ? 'object' : 'inline',
+    paramsCasing,
+    resolver,
+    extraParams: [
+      ast.createFunctionParameter({
+        name: 'config',
+        type: ast.createParamsType({
+          variant: 'reference',
+          name: requestName ? `Partial<RequestConfig<${requestName}>> & { client?: Client }` : 'Partial<RequestConfig> & { client?: Client }',
+        }),
+        default: '{}',
       }),
-      data: typeSchemas.request?.name
-        ? {
-            type: `MaybeRefOrGetter<${typeSchemas.request?.name}>`,
-            optional: isOptional(typeSchemas.request?.schema),
-          }
-        : undefined,
-      params: typeSchemas.queryParams?.name
-        ? {
-            type: `MaybeRefOrGetter<${typeSchemas.queryParams?.name}>`,
-            optional: isOptional(typeSchemas.queryParams?.schema),
-          }
-        : undefined,
-      headers: typeSchemas.headerParams?.name
-        ? {
-            type: `MaybeRefOrGetter<${typeSchemas.queryParams?.name}>`,
-            optional: isOptional(typeSchemas.headerParams?.schema),
-          }
-        : undefined,
+    ],
+  })
+
+  return wrapOperationParamsWithMaybeRef(baseParams)
+}
+
+function wrapOperationParamsWithMaybeRef(paramsNode: ast.FunctionParametersNode): ast.FunctionParametersNode {
+  const wrappedParams = paramsNode.params.map((param) => {
+    if ('kind' in param && (param as ast.ParameterGroupNode).kind === 'ParameterGroup') {
+      const group = param as ast.ParameterGroupNode
+      return {
+        ...group,
+        properties: group.properties.map((p) => ({
+          ...p,
+          type: p.type ? ast.createParamsType({ variant: 'reference', name: `MaybeRefOrGetter<${printType(p.type)}>` }) : p.type,
+        })),
+      }
+    }
+    const fp = param as ast.FunctionParameterNode
+    // Don't wrap 'config' param — it's not reactive
+    if (fp.name === 'config') return fp
+    return {
+      ...fp,
+      type: fp.type ? ast.createParamsType({ variant: 'reference', name: `MaybeRefOrGetter<${printType(fp.type)}>` }) : fp.type,
     }
+  })
+  return ast.createFunctionParameters({ params: wrappedParams })
+}
 
-    // Check if all children are optional or undefined
-    const allChildrenAreOptional = Object.values(children).every((child) => !child || child.optional)
-
-    return FunctionParams.factory({
-      data: {
-        mode: 'object',
-        children,
-        default: allChildrenAreOptional ? '{}' : undefined,
-      },
-      config: {
-        type: typeSchemas.request?.name
-          ? `Partial<RequestConfig<${typeSchemas.request?.name}>> & { client?: Client }`
-          : 'Partial<RequestConfig> & { client?: Client }',
-        default: '{}',
-      },
+function printType(typeNode: ast.ParamsTypeNode | undefined): string {
+  if (!typeNode) return 'unknown'
+  if (typeNode.variant === 'reference') return typeNode.name
+  if (typeNode.variant === 'member') return `${typeNode.base}['${typeNode.key}']`
+  if (typeNode.variant === 'struct') {
+    const parts = typeNode.properties.map((p) => {
+      const typeStr = printType(p.type)
+      const key = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(p.name) ? p.name : JSON.stringify(p.name)
+      return p.optional ? `${key}?: ${typeStr}` : `${key}: ${typeStr}`
     })
+    return `{ ${parts.join('; ')} }`
   }
+  return 'unknown'
+}
 
-  return FunctionParams.factory({
-    pathParams: {
-      mode: pathParamsType === 'object' ? 'object' : 'inlineSpread',
-      children: getPathParams(typeSchemas.pathParams, {
-        typed: true,
-        casing: paramsCasing,
-        override(item) {
-          return {
-            ...item,
-            type: `MaybeRefOrGetter<${item.type}>`,
-          }
-        },
-      }),
-      default: getDefaultValue(typeSchemas.pathParams?.schema),
-    },
-    data: typeSchemas.request?.name
-      ? {
-          type: `MaybeRefOrGetter<${typeSchemas.request?.name}>`,
-          optional: isOptional(typeSchemas.request?.schema),
-        }
-      : undefined,
-    params: typeSchemas.queryParams?.name
-      ? {
-          type: `MaybeRefOrGetter<${typeSchemas.queryParams?.name}>`,
-          optional: isOptional(typeSchemas.queryParams?.schema),
+export function buildEnabledCheck(paramsNode: ast.FunctionParametersNode): string {
+  const required: string[] = []
+  for (const param of paramsNode.params) {
+    if ('kind' in param && (param as ast.ParameterGroupNode).kind === 'ParameterGroup') {
+      const group = param as ast.ParameterGroupNode
+      for (const child of group.properties) {
+        if (!child.optional && child.default === undefined) {
+          required.push(child.name)
         }
-      : undefined,
-    headers: typeSchemas.headerParams?.name
-      ? {
-          type: `MaybeRefOrGetter<${typeSchemas.queryParams?.name}>`,
-          optional: isOptional(typeSchemas.headerParams?.schema),
-        }
-      : undefined,
-    config: {
-      type: typeSchemas.request?.name
-        ? `Partial<RequestConfig<${typeSchemas.request?.name}>> & { client?: Client }`
-        : 'Partial<RequestConfig> & { client?: Client }',
-      default: '{}',
-    },
-  })
+      }
+    } else {
+      const fp = param as ast.FunctionParameterNode
+      if (!fp.optional && fp.default === undefined) {
+        required.push(fp.name)
+      }
+    }
+  }
+  return required.join(' && ')
 }
 
 export function QueryOptions({
   name,
   clientName,
   dataReturnType,
-  typeSchemas,
+  node,
+  tsResolver,
   paramsCasing,
   paramsType,
   pathParamsType,
   queryKeyName,
-}: Props): FabricReactNode {
-  const TData = dataReturnType === 'data' ? typeSchemas.response.name : `ResponseConfig<${typeSchemas.response.name}>`
-  const TError = `ResponseErrorConfig<${typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error'}>`
+}: Props): KubbReactNode {
+  const responseName = tsResolver.resolveResponseName(node)
+  const errorNames = resolveErrorNames(node, tsResolver)
 
-  const params = getParams({ paramsType, paramsCasing, pathParamsType, typeSchemas })
-  const clientParams = Client.getParams({
-    paramsType,
-    paramsCasing,
-    typeSchemas,
-    pathParamsType,
-    isConfigurable: true,
-  })
-  const queryKeyParams = QueryKey.getParams({
-    pathParamsType,
-    typeSchemas,
-    paramsCasing,
-  })
+  const TData = dataReturnType === 'data' ? responseName : `ResponseConfig<${responseName}>`
+  const TError = `ResponseErrorConfig<${errorNames.length > 0 ? errorNames.join(' | ') : 'Error'}>`
 
-  const enabled = Object.entries(queryKeyParams.flatParams)
-    .map(([key, item]) => {
-      // Only include if the parameter exists and is NOT optional
-      // This ensures we only check required parameters
-      return item && !item.optional && !item.default ? key : undefined
-    })
-    .filter(Boolean)
-    .join('&& ')
+  const paramsNode = getQueryOptionsParams(node, { paramsType, paramsCasing, pathParamsType, resolver: tsResolver })
+  const paramsSignature = declarationPrinter.print(paramsNode) ?? ''
+  const rawParamsCall = callPrinter.print(paramsNode) ?? ''
+
+  // Transform: wrap non-config params with toValue(), add signal to config
+  const clientCallStr = rawParamsCall.replace(/\bconfig\b(?=[^,]*$)/, '{ ...config, signal: config.signal ?? signal }')
+
+  const queryKeyParamsNode = QueryKey.getParams(node, { pathParamsType, paramsCasing, resolver: tsResolver })
+  const queryKeyParamsCall = callPrinter.print(queryKeyParamsNode) ?? ''
 
-  const enabledText = enabled ? `enabled: !!(${enabled}),` : ''
+  const enabledSource = buildEnabledCheck(queryKeyParamsNode)
+  const enabledText = enabledSource ? `enabled: () => !!(${enabledSource}),` : ''
 
   return (
     <File.Source name={name} isExportable isIndexable>
-      <Function name={name} export params={params.toConstructor()}>
+      <Function name={name} export params={paramsSignature}>
         {`
-      const queryKey = ${queryKeyName}(${queryKeyParams.toCall()})
-      return queryOptions<${TData}, ${TError}, ${TData}, typeof queryKey>({
-      ${enabledText}
-      queryKey,
-      queryFn: async ({ signal }) => {
-          return ${clientName}(${clientParams.toCall({
-            transformName(name) {
-              if (name === 'config') {
-                return '{ ...config, signal: config.signal ?? signal }'
-              }
-
-              return `toValue(${name})`
-            },
-          })})
+      const queryKey = ${queryKeyName}(${queryKeyParamsCall})
+      return queryOptions<${TData}, ${TError}, ${TData}>({
+       ${enabledText}
+       queryKey,
+       queryFn: async ({ signal }) => {
+          return ${clientName}(${addToValueCalls(clientCallStr)})
        },
       })
 `}
@@ -182,4 +160,34 @@ export function QueryOptions({
   )
 }
 
-QueryOptions.getParams = getParams
+/**
+ * Wraps parameter names with `toValue()` in the client call string,
+ * except for 'config'-related params (which are already plain objects).
+ *
+ * Handles both inline params (`petId, config`) and object shorthand
+ * params (`{ petId }, config`) by expanding to `{ petId: toValue(petId) }`.
+ */
+function addToValueCalls(callStr: string): string {
+  // Step 1: Transform shorthand object params like { petId } → { petId: toValue(petId) }
+  let result = callStr.replace(/\{\s*([\w,\s]+)\s*\}(?=\s*,)/g, (match, inner: string) => {
+    // Only transform simple shorthand (no colons, no spread)
+    if (inner.includes(':') || inner.includes('...')) return match
+    const keys = inner
+      .split(',')
+      .map((k: string) => k.trim())
+      .filter(Boolean)
+    const wrapped = keys.map((k: string) => `${k}: toValue(${k})`).join(', ')
+    return `{ ${wrapped} }`
+  })
+
+  // Step 2: Handle standalone identifiers like `data, params`
+  result = result.replace(/(?<![{.:?])\b(\w+)\b(?=\s*,)/g, (match, name: string) => {
+    if (name === 'config' || name === 'signal' || name === 'undefined') return match
+    if (match.includes('toValue(')) return match
+    return `toValue(${name})`
+  })
+
+  return result
+}
+
+QueryOptions.getParams = getQueryOptionsParams