@kubb/plugin-ts 5.0.0-alpha.1 → 5.0.0-alpha.11

package/src/components/v2/Type.tsx

@@ -0,0 +1,59 @@
+import { collect } from '@kubb/ast'
+import type { EnumSchemaNode, SchemaNode } from '@kubb/ast/types'
+import { safePrint } from '@kubb/fabric-core/parsers/typescript'
+import { File } from '@kubb/react-fabric'
+import type { FabricReactNode } from '@kubb/react-fabric/types'
+import { printerTs } from '../../printer.ts'
+import type { PluginTs } from '../../types.ts'
+import { Enum, getEnumNames } from './Enum.tsx'
+
+type Props = {
+  name: string
+  typedName: string
+  node: SchemaNode
+  optionalType: PluginTs['resolvedOptions']['optionalType']
+  arrayType: PluginTs['resolvedOptions']['arrayType']
+  enumType: PluginTs['resolvedOptions']['enumType']
+  enumKeyCasing: PluginTs['resolvedOptions']['enumKeyCasing']
+  syntaxType: PluginTs['resolvedOptions']['syntaxType']
+  description?: string
+  keysToOmit?: string[]
+}
+
+export function Type({ name, typedName, node, keysToOmit, optionalType, arrayType, syntaxType, enumType, enumKeyCasing, description }: Props): FabricReactNode {
+  const resolvedDescription = description || node?.description
+  const enumSchemaNodes = collect<EnumSchemaNode>(node, {
+    schema(n): EnumSchemaNode | undefined {
+      if (n.type === 'enum' && n.name) return n as EnumSchemaNode
+    },
+  })
+
+  const printer = printerTs({ optionalType, arrayType, enumType, typeName: name, syntaxType, description: resolvedDescription, keysToOmit })
+  const typeNode = printer.print(node)
+
+  if (!typeNode) {
+    return
+  }
+
+  const enums = [...new Map(enumSchemaNodes.map((n) => [n.name, n])).values()].map((node) => {
+    return {
+      node,
+      ...getEnumNames(node, enumType),
+    }
+  })
+
+  // Skip enum exports when using inlineLiteral
+  const shouldExportEnums = enumType !== 'inlineLiteral'
+  const shouldExportType = enumType === 'inlineLiteral' || enums.every((item) => item.typeName !== name)
+
+  return (
+    <>
+      {shouldExportEnums && enums.map(({ node }) => <Enum node={node} enumType={enumType} enumKeyCasing={enumKeyCasing} />)}
+      {shouldExportType && (
+        <File.Source name={typedName} isTypeOnly isExportable isIndexable>
+          {safePrint(typeNode)}
+        </File.Source>
+      )}
+    </>
+  )
+}

package/src/constants.ts

@@ -0,0 +1,29 @@
+import type { PluginTs } from './types.ts'
+
+type OptionalType = PluginTs['resolvedOptions']['optionalType']
+type EnumType = PluginTs['resolvedOptions']['enumType']
+
+/**
+ * `optionalType` values that cause a property's type to include `| undefined`.
+ */
+export const OPTIONAL_ADDS_UNDEFINED = new Set<OptionalType>(['undefined', 'questionTokenAndUndefined'] as const)
+
+/**
+ * `optionalType` values that render the property key with a `?` token.
+ */
+export const OPTIONAL_ADDS_QUESTION_TOKEN = new Set<OptionalType>(['questionToken', 'questionTokenAndUndefined'] as const)
+
+/**
+ * `enumType` values that append a `Key` suffix to the generated enum type alias.
+ */
+export const ENUM_TYPES_WITH_KEY_SUFFIX = new Set<EnumType>(['asConst', 'asPascalConst'] as const)
+
+/**
+ * `enumType` values that require a runtime value declaration (object, enum, or literal).
+ */
+export const ENUM_TYPES_WITH_RUNTIME_VALUE = new Set<EnumType | undefined>(['enum', 'asConst', 'asPascalConst', 'constEnum', 'literal', undefined] as const)
+
+/**
+ * `enumType` values whose type declaration is type-only (no runtime value emitted for the type alias).
+ */
+export const ENUM_TYPES_WITH_TYPE_ONLY = new Set<EnumType | undefined>(['asConst', 'asPascalConst', 'literal', undefined] as const)

package/src/factory.ts

@@ -15,6 +15,8 @@ export const modifiers = {
 
 export const syntaxKind = {
   union: SyntaxKind.UnionType as 192,
+  literalType: SyntaxKind.LiteralType,
+  stringLiteral: SyntaxKind.StringLiteral,
 } as const
 
 export function getUnknownType(unknownType: 'any' | 'unknown' | 'void' | undefined) {
@@ -660,43 +662,39 @@ export const keywordTypeNodes = {
  * Converts a path like '/pet/{petId}/uploadImage' to a template literal type
  * like `/pet/${string}/uploadImage`
  */
+/**
+ * Converts an OAS-style path (e.g. `/pets/{petId}`) or an Express-style path
+ * (e.g. `/pets/:petId`) to a TypeScript template literal type
+ * like `` `/pets/${string}` ``.
+ */
 export function createUrlTemplateType(path: string): ts.TypeNode {
-  // If no parameters, return literal string type
-  if (!path.includes('{')) {
-    return factory.createLiteralTypeNode(factory.createStringLiteral(path))
-  }
+  // normalized Express `:param` → OAS `{param}` so a single regex handles both.
+  const normalized = path.replace(/:([^/]+)/g, '{$1}')
 
-  // Split path by parameter placeholders, e.g. '/pet/{petId}/upload' -> ['/pet/', 'petId', '/upload']
-  const segments = path.split(/(\{[^}]+\})/)
+  if (!normalized.includes('{')) {
+    return factory.createLiteralTypeNode(factory.createStringLiteral(normalized))
+  }
 
-  // Separate static parts from parameter placeholders
+  const segments = normalized.split(/(\{[^}]+\})/)
   const parts: string[] = []
   const parameterIndices: number[] = []
 
   segments.forEach((segment) => {
     if (segment.startsWith('{') && segment.endsWith('}')) {
-      // This is a parameter placeholder
       parameterIndices.push(parts.length)
-      parts.push(segment) // Will be replaced with ${string}
+      parts.push(segment)
     } else if (segment) {
-      // This is a static part
       parts.push(segment)
     }
   })
 
-  // Build template literal type
-  // Template literal structure: head + templateSpans[]
-  // For '/pet/{petId}/upload': head = '/pet/', spans = [{ type: string, literal: '/upload' }]
-
   const head = ts.factory.createTemplateHead(parts[0] || '')
   const templateSpans: ts.TemplateLiteralTypeSpan[] = []
 
   parameterIndices.forEach((paramIndex, i) => {
     const isLast = i === parameterIndices.length - 1
     const nextPart = parts[paramIndex + 1] || ''
-
     const literal = isLast ? ts.factory.createTemplateTail(nextPart) : ts.factory.createTemplateMiddle(nextPart)
-
     templateSpans.push(ts.factory.createTemplateLiteralTypeSpan(keywordTypeNodes.string, literal))
   })
 

package/src/generators/index.ts

@@ -1 +1,2 @@
 export { typeGenerator } from './typeGenerator.tsx'
+export { typeGenerator as typeGeneratorV2 } from './v2/typeGenerator.tsx'

package/src/generators/typeGenerator.tsx

@@ -1,6 +1,6 @@
 import { pascalCase } from '@internals/utils'
-import type { PluginManager } from '@kubb/core'
-import { useMode, usePluginManager } from '@kubb/core/hooks'
+import type { PluginDriver } from '@kubb/core'
+import { useMode, usePluginDriver } from '@kubb/core/hooks'
 import { safePrint } from '@kubb/fabric-core/parsers/typescript'
 import type { Operation } from '@kubb/oas'
 import { isKeyword, type OperationSchemas, type OperationSchema as OperationSchemaType, SchemaGenerator, schemaKeywords } from '@kubb/plugin-oas'
@@ -15,15 +15,15 @@ import { createUrlTemplateType, getUnknownType, keywordTypeNodes } from '../fact
 import { pluginTsName } from '../plugin.ts'
 import type { PluginTs } from '../types'
 
-function printCombinedSchema({ name, schemas, pluginManager }: { name: string; schemas: OperationSchemas; pluginManager: PluginManager }): string {
+function printCombinedSchema({ name, schemas, driver }: { name: string; schemas: OperationSchemas; driver: PluginDriver }): string {
   const properties: Record<string, ts.TypeNode> = {}
 
   if (schemas.response) {
     properties['response'] = factory.createUnionDeclaration({
       nodes: schemas.responses.map((res) => {
-        const identifier = pluginManager.resolveName({
+        const identifier = driver.resolveName({
           name: res.name,
-          pluginKey: [pluginTsName],
+          pluginName: pluginTsName,
           type: 'function',
         })
 
@@ -33,36 +33,36 @@ function printCombinedSchema({ name, schemas, pluginManager }: { name: string; s
   }
 
   if (schemas.request) {
-    const identifier = pluginManager.resolveName({
+    const identifier = driver.resolveName({
       name: schemas.request.name,
-      pluginKey: [pluginTsName],
+      pluginName: pluginTsName,
       type: 'function',
     })
     properties['request'] = factory.createTypeReferenceNode(factory.createIdentifier(identifier), undefined)
   }
 
   if (schemas.pathParams) {
-    const identifier = pluginManager.resolveName({
+    const identifier = driver.resolveName({
       name: schemas.pathParams.name,
-      pluginKey: [pluginTsName],
+      pluginName: pluginTsName,
       type: 'function',
     })
     properties['pathParams'] = factory.createTypeReferenceNode(factory.createIdentifier(identifier), undefined)
   }
 
   if (schemas.queryParams) {
-    const identifier = pluginManager.resolveName({
+    const identifier = driver.resolveName({
       name: schemas.queryParams.name,
-      pluginKey: [pluginTsName],
+      pluginName: pluginTsName,
       type: 'function',
     })
     properties['queryParams'] = factory.createTypeReferenceNode(factory.createIdentifier(identifier), undefined)
   }
 
   if (schemas.headerParams) {
-    const identifier = pluginManager.resolveName({
+    const identifier = driver.resolveName({
       name: schemas.headerParams.name,
-      pluginKey: [pluginTsName],
+      pluginName: pluginTsName,
       type: 'function',
     })
     properties['headerParams'] = factory.createTypeReferenceNode(factory.createIdentifier(identifier), undefined)
@@ -71,9 +71,9 @@ function printCombinedSchema({ name, schemas, pluginManager }: { name: string; s
   if (schemas.errors) {
     properties['errors'] = factory.createUnionDeclaration({
       nodes: schemas.errors.map((error) => {
-        const identifier = pluginManager.resolveName({
+        const identifier = driver.resolveName({
           name: error.name,
-          pluginKey: [pluginTsName],
+          pluginName: pluginTsName,
           type: 'function',
         })
 
@@ -109,16 +109,16 @@ function printRequestSchema({
   baseName,
   operation,
   schemas,
-  pluginManager,
+  driver,
 }: {
   baseName: string
   operation: Operation
   schemas: OperationSchemas
-  pluginManager: PluginManager
+  driver: PluginDriver
 }): string {
-  const name = pluginManager.resolveName({
+  const name = driver.resolveName({
     name: `${baseName} Request`,
-    pluginKey: [pluginTsName],
+    pluginName: pluginTsName,
     type: 'type',
   })
 
@@ -128,9 +128,9 @@ function printRequestSchema({
   const dataRequestProperties: ts.PropertySignature[] = []
 
   if (schemas.request) {
-    const identifier = pluginManager.resolveName({
+    const identifier = driver.resolveName({
       name: schemas.request.name,
-      pluginKey: [pluginTsName],
+      pluginName: pluginTsName,
       type: 'type',
     })
     dataRequestProperties.push(
@@ -152,9 +152,9 @@ function printRequestSchema({
 
   // Add pathParams property
   if (schemas.pathParams) {
-    const identifier = pluginManager.resolveName({
+    const identifier = driver.resolveName({
       name: schemas.pathParams.name,
-      pluginKey: [pluginTsName],
+      pluginName: pluginTsName,
       type: 'type',
     })
     dataRequestProperties.push(
@@ -175,9 +175,9 @@ function printRequestSchema({
 
   // Add queryParams property
   if (schemas.queryParams) {
-    const identifier = pluginManager.resolveName({
+    const identifier = driver.resolveName({
       name: schemas.queryParams.name,
-      pluginKey: [pluginTsName],
+      pluginName: pluginTsName,
       type: 'type',
     })
     dataRequestProperties.push(
@@ -199,9 +199,9 @@ function printRequestSchema({
 
   // Add headerParams property
   if (schemas.headerParams) {
-    const identifier = pluginManager.resolveName({
+    const identifier = driver.resolveName({
       name: schemas.headerParams.name,
-      pluginKey: [pluginTsName],
+      pluginName: pluginTsName,
       type: 'type',
     })
     dataRequestProperties.push(
@@ -243,28 +243,28 @@ function printRequestSchema({
 function printResponseSchema({
   baseName,
   schemas,
-  pluginManager,
+  driver,
   unknownType,
 }: {
   baseName: string
   schemas: OperationSchemas
-  pluginManager: PluginManager
+  driver: PluginDriver
   unknownType: PluginTs['resolvedOptions']['unknownType']
 }): string {
   const results: string[] = []
 
-  const name = pluginManager.resolveName({
+  const name = driver.resolveName({
     name: `${baseName} ResponseData`,
-    pluginKey: [pluginTsName],
+    pluginName: pluginTsName,
     type: 'type',
   })
 
   // Generate Responses type (mapping status codes to response types)
   if (schemas.responses && schemas.responses.length > 0) {
     const responsesProperties: ts.PropertySignature[] = schemas.responses.map((res) => {
-      const identifier = pluginManager.resolveName({
+      const identifier = driver.resolveName({
         name: res.name,
-        pluginKey: [pluginTsName],
+        pluginName: pluginTsName,
         type: 'type',
       })
 
@@ -309,23 +309,22 @@ function printResponseSchema({
   return results.join('\n\n')
 }
 
-export const typeGenerator = createReactGenerator<PluginTs, '1'>({
+export const typeGenerator = createReactGenerator<PluginTs>({
   name: 'typescript',
-  version: '1',
   Operation({ operation, generator, plugin }) {
     const {
       options,
-      options: { mapper, enumType, enumKeyCasing, syntaxType, optionalType, arrayType, unknownType, paramsCasing },
+      options: { enumType, enumKeyCasing, syntaxType, optionalType, arrayType, unknownType, paramsCasing },
     } = plugin
 
     const mode = useMode()
-    const pluginManager = usePluginManager()
+    const driver = usePluginDriver()
 
     const oas = useOas()
     const { getSchemas, getFile, getName, getGroup } = useOperationManager(generator)
     const schemaManager = useSchemaManager()
 
-    const name = getName(operation, { type: 'type', pluginKey: [pluginTsName] })
+    const name = getName(operation, { type: 'type', pluginName: pluginTsName })
 
     const file = getFile(operation)
     const schemas = getSchemas(operation)
@@ -334,7 +333,7 @@ export const typeGenerator = createReactGenerator<PluginTs, '1'>({
       oas,
       events: generator.context.events,
       plugin,
-      pluginManager,
+      driver,
       mode,
       override: options.override,
     })
@@ -370,7 +369,6 @@ export const typeGenerator = createReactGenerator<PluginTs, '1'>({
             description={description}
             tree={tree}
             schema={transformedSchema}
-            mapper={mapper}
             enumType={enumType}
             enumKeyCasing={enumKeyCasing}
             optionalType={optionalType}
@@ -385,6 +383,7 @@ export const typeGenerator = createReactGenerator<PluginTs, '1'>({
     const responseName = schemaManager.getName(schemas.response.name, {
       type: 'type',
     })
+
     const combinedSchemaName = operation.method === 'get' ? `${name}Query` : `${name}Mutation`
 
     return (
@@ -392,7 +391,7 @@ export const typeGenerator = createReactGenerator<PluginTs, '1'>({
         baseName={file.baseName}
         path={file.path}
         meta={file.meta}
-        banner={getBanner({ oas, output: plugin.options.output, config: pluginManager.config })}
+        banner={getBanner({ oas, output: plugin.options.output, config: driver.config })}
         footer={getFooter({ oas, output: plugin.options.output })}
       >
         {operationSchemas.map(mapOperationSchema)}
@@ -400,15 +399,15 @@ export const typeGenerator = createReactGenerator<PluginTs, '1'>({
         {generator.context.UNSTABLE_NAMING ? (
           <>
             <File.Source name={`${name}Request`} isExportable isIndexable isTypeOnly>
-              {printRequestSchema({ baseName: name, operation, schemas, pluginManager })}
+              {printRequestSchema({ baseName: name, operation, schemas, driver })}
             </File.Source>
             <File.Source name={responseName} isExportable isIndexable isTypeOnly>
-              {printResponseSchema({ baseName: name, schemas, pluginManager, unknownType })}
+              {printResponseSchema({ baseName: name, schemas, driver, unknownType })}
             </File.Source>
           </>
         ) : (
           <File.Source name={combinedSchemaName} isExportable isIndexable isTypeOnly>
-            {printCombinedSchema({ name: combinedSchemaName, schemas, pluginManager })}
+            {printCombinedSchema({ name: combinedSchemaName, schemas, driver })}
           </File.Source>
         )}
       </File>
@@ -416,12 +415,12 @@ export const typeGenerator = createReactGenerator<PluginTs, '1'>({
   },
   Schema({ schema, plugin }) {
     const {
-      options: { mapper, enumType, enumKeyCasing, syntaxType, optionalType, arrayType, output },
+      options: { enumType, enumKeyCasing, syntaxType, optionalType, arrayType, output },
     } = plugin
     const mode = useMode()
 
     const oas = useOas()
-    const pluginManager = usePluginManager()
+    const driver = usePluginDriver()
 
     const { getName, getFile } = useSchemaManager()
     const imports = getImports(schema.tree)
@@ -444,7 +443,7 @@ export const typeGenerator = createReactGenerator<PluginTs, '1'>({
         baseName={type.file.baseName}
         path={type.file.path}
         meta={type.file.meta}
-        banner={getBanner({ oas, output, config: pluginManager.config })}
+        banner={getBanner({ oas, output, config: driver.config })}
         footer={getFooter({ oas, output })}
       >
         {mode === 'split' &&
@@ -457,7 +456,6 @@ export const typeGenerator = createReactGenerator<PluginTs, '1'>({
           description={schema.value.description}
           tree={schema.tree}
           schema={schema.value}
-          mapper={mapper}
           enumType={enumType}
           enumKeyCasing={enumKeyCasing}
           optionalType={optionalType}

package/src/generators/v2/typeGenerator.tsx

@@ -0,0 +1,167 @@
+import { applyParamsCasing } from '@kubb/ast'
+import type { SchemaNode } from '@kubb/ast/types'
+import { defineGenerator } from '@kubb/core'
+import { useKubb } from '@kubb/core/hooks'
+import { File } from '@kubb/react-fabric'
+import { Type } from '../../components/v2/Type.tsx'
+import { ENUM_TYPES_WITH_KEY_SUFFIX } from '../../constants.ts'
+import { resolverTs } from '../../resolverTs.ts'
+import type { PluginTs } from '../../types'
+import { buildDataSchemaNode, buildResponsesSchemaNode, buildResponseUnionSchemaNode } from './utils.ts'
+
+export const typeGenerator = defineGenerator<PluginTs>({
+  name: 'typescript',
+  type: 'react',
+  Operation({ node, adapter, options }) {
+    const { enumType, enumKeyCasing, optionalType, arrayType, syntaxType, paramsCasing, group } = options
+    const { mode, getFile, resolveName, resolveBanner, resolveFooter } = useKubb<PluginTs>()
+
+    const file = getFile({
+      name: node.operationId,
+      extname: '.ts',
+      mode,
+      options: {
+        group: group ? (group.type === 'tag' ? { tag: node.tags[0] } : { path: node.path }) : undefined,
+      },
+    })
+    const params = applyParamsCasing(node.parameters, paramsCasing)
+
+    function renderSchemaType({
+      node: schemaNode,
+      name,
+      typedName,
+      description,
+    }: {
+      node: SchemaNode | null
+      name: string
+      typedName: string
+      description?: string
+    }) {
+      if (!schemaNode) {
+        return null
+      }
+
+      const imports = adapter.getImports(schemaNode, (schemaName) => ({
+        name: resolveName({ name: schemaName, type: 'type' }),
+        path: getFile({ name: schemaName, extname: '.ts', mode }).path,
+      }))
+
+      return (
+        <>
+          {mode === 'split' &&
+            imports.map((imp) => <File.Import key={[name, imp.path, imp.isTypeOnly].join('-')} root={file.path} path={imp.path} name={imp.name} isTypeOnly />)}
+          <Type
+            name={name}
+            typedName={typedName}
+            node={schemaNode}
+            description={description}
+            enumType={enumType}
+            enumKeyCasing={enumKeyCasing}
+            optionalType={optionalType}
+            arrayType={arrayType}
+            syntaxType={syntaxType}
+          />
+        </>
+      )
+    }
+
+    const paramTypes = params.map((param) =>
+      renderSchemaType({
+        node: param.schema,
+        name: resolverTs.resolveParamName(node, param),
+        typedName: resolverTs.resolveParamTypedName(node, param),
+      }),
+    )
+
+    const responseTypes = node.responses.map((res) =>
+      renderSchemaType({
+        node: res.schema,
+        name: resolverTs.resolveResponseStatusName(node, res.statusCode),
+        typedName: resolverTs.resolveResponseStatusTypedName(node, res.statusCode),
+        description: res.description,
+      }),
+    )
+
+    const requestType = node.requestBody
+      ? renderSchemaType({
+          node: node.requestBody,
+          name: resolverTs.resolveDataName(node),
+          typedName: resolverTs.resolveDataTypedName(node),
+          description: node.requestBody.description,
+        })
+      : null
+
+    const dataType = renderSchemaType({
+      node: buildDataSchemaNode({ node: { ...node, parameters: params }, resolveName }),
+      name: resolverTs.resolveRequestConfigName(node),
+      typedName: resolverTs.resolveRequestConfigTypedName(node),
+    })
+
+    const responsesType = renderSchemaType({
+      node: buildResponsesSchemaNode({ node, resolveName }),
+      name: resolverTs.resolveResponsesName(node),
+      typedName: resolverTs.resolveResponsesTypedName(node),
+    })
+
+    const responseType = renderSchemaType({
+      node: buildResponseUnionSchemaNode({ node, resolveName }),
+      name: resolverTs.resolveResponseName(node),
+      typedName: resolverTs.resolveResponseTypedName(node),
+      description: 'Union of all possible responses',
+    })
+
+    return (
+      <File baseName={file.baseName} path={file.path} meta={file.meta} banner={resolveBanner()} footer={resolveFooter()}>
+        {paramTypes}
+        {responseTypes}
+        {requestType}
+        {dataType}
+        {responsesType}
+        {responseType}
+      </File>
+    )
+  },
+  Schema({ node, adapter, options }) {
+    const { enumType, enumKeyCasing, syntaxType, optionalType, arrayType } = options
+    const { mode, resolveName, getFile, resolveBanner, resolveFooter } = useKubb<PluginTs>()
+
+    if (!node.name) {
+      return
+    }
+
+    const imports = adapter.getImports(node, (schemaName) => ({
+      name: resolveName({ name: schemaName, type: 'type' }),
+      path: getFile({ name: schemaName, extname: '.ts', mode }).path,
+    }))
+
+    const isEnumSchema = node.type === 'enum'
+
+    const typedName =
+      ENUM_TYPES_WITH_KEY_SUFFIX.has(enumType) && isEnumSchema ? resolverTs.resolveEnumKeyTypedName(node) : resolverTs.resolveTypedName(node.name)
+
+    const type = {
+      name: resolverTs.resolveName(node.name),
+      typedName,
+      file: getFile({ name: node.name, extname: '.ts', mode }),
+    } as const
+
+    return (
+      <File baseName={type.file.baseName} path={type.file.path} meta={type.file.meta} banner={resolveBanner()} footer={resolveFooter()}>
+        {mode === 'split' &&
+          imports.map((imp) => (
+            <File.Import key={[node.name, imp.path, imp.isTypeOnly].join('-')} root={type.file.path} path={imp.path} name={imp.name} isTypeOnly />
+          ))}
+        <Type
+          name={type.name}
+          typedName={type.typedName}
+          node={node}
+          enumType={enumType}
+          enumKeyCasing={enumKeyCasing}
+          optionalType={optionalType}
+          arrayType={arrayType}
+          syntaxType={syntaxType}
+        />
+      </File>
+    )
+  },
+})