@kubb/plugin-msw 3.0.0-alpha.9 → 3.0.0-beta.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kubb/plugin-msw",
-  "version": "3.0.0-alpha.9",
+  "version": "3.0.0-beta.1",
   "description": "Generator swagger",
   "keywords": [
     "typescript",
@@ -40,6 +40,11 @@
       "require": "./dist/components.cjs",
       "default": "./dist/components.cjs"
     },
+    "./generators": {
+      "import": "./dist/generators.js",
+      "require": "./dist/generators.cjs",
+      "default": "./dist/generators.cjs"
+    },
     "./package.json": "./package.json",
     "./*": "./*"
   },
@@ -56,6 +61,9 @@
       ],
       "components": [
         "./dist/components.d.ts"
+      ],
+      "generators": [
+        "./dist/generators.d.ts"
       ]
     }
   },
@@ -66,27 +74,24 @@
     "!/**/__tests__/**"
   ],
   "dependencies": {
-    "@kubb/core": "3.0.0-alpha.9",
-    "@kubb/fs": "3.0.0-alpha.9",
-    "@kubb/oas": "3.0.0-alpha.9",
-    "@kubb/parser-ts": "3.0.0-alpha.9",
-    "@kubb/plugin-faker": "3.0.0-alpha.9",
-    "@kubb/plugin-oas": "3.0.0-alpha.9",
-    "@kubb/plugin-ts": "3.0.0-alpha.9",
-    "@kubb/react": "3.0.0-alpha.9"
+    "@kubb/core": "3.0.0-beta.1",
+    "@kubb/fs": "3.0.0-beta.1",
+    "@kubb/oas": "3.0.0-beta.1",
+    "@kubb/plugin-faker": "3.0.0-beta.1",
+    "@kubb/plugin-oas": "3.0.0-beta.1",
+    "@kubb/plugin-ts": "3.0.0-beta.1",
+    "@kubb/react": "3.0.0-beta.1"
   },
   "devDependencies": {
-    "@types/react": "^18.3.4",
-    "@types/react-dom": "^18.3.0",
+    "@types/react": "^18.3.11",
     "react": "^18.3.1",
-    "tsup": "^8.2.4",
-    "typescript": "^5.5.4",
-    "@kubb/config-biome": "3.0.0-alpha.9",
-    "@kubb/config-ts": "3.0.0-alpha.9",
-    "@kubb/config-tsup": "3.0.0-alpha.9"
+    "tsup": "^8.3.0",
+    "typescript": "^5.6.2",
+    "@kubb/config-ts": "3.0.0-beta.1",
+    "@kubb/config-tsup": "3.0.0-beta.1"
   },
   "peerDependencies": {
-    "@kubb/react": "3.0.0-alpha.9"
+    "@kubb/react": "3.0.0-beta.1"
   },
   "engines": {
     "node": ">=20"

package/src/components/Handlers.tsx

@@ -0,0 +1,19 @@
+import { File } from '@kubb/react'
+import type { ReactNode } from 'react'
+
+type HandlersProps = {
+  /**
+   * Name of the function
+   */
+  name: string
+  // custom
+  handlers: string[]
+}
+
+export function Handlers({ name, handlers }: HandlersProps): ReactNode {
+  return (
+    <File.Source name={name} isIndexable isExportable>
+      {`export const ${name} = ${JSON.stringify(handlers).replaceAll(`"`, '')} as const`}
+    </File.Source>
+  )
+}

package/src/components/Mock.tsx

@@ -1,38 +1,24 @@
-import { URLPath } from '@kubb/core/utils'
-import { File, useApp } from '@kubb/react'
-import { pluginFakerName } from '@kubb/plugin-faker'
-import { useOperation, useOperationManager } from '@kubb/plugin-oas/hooks'
+import { File } from '@kubb/react'
 
 import type { HttpMethod } from '@kubb/oas'
 import type { ReactNode } from 'react'
-import type { FileMeta, PluginMsw } from '../types.ts'
 
-type TemplateProps = {
+type Props = {
   /**
    * Name of the function
    */
   name: string
-  /**
-   * Method of the current operation, see useOperation.
-   */
+  fakerName: string
+  url: string
   method: HttpMethod
-  /**
-   * Path of the mock
-   */
-  path: URLPath
-  /**
-   * Name of the import for the mock(this is a function).
-   * @example createPet
-   */
-  responseName: string
 }
 
-function Template({ name, method, path, responseName }: TemplateProps): ReactNode {
+export function Mock({ name, fakerName, url, method }: Props): ReactNode {
   return (
-    <File.Source name={name} isExportable isIndexable>
+    <File.Source name={name} isIndexable isExportable>
       {`
-  export const ${name} = http.${method}('*${path.toURLPath()}', function handler(info) {
-    return new Response(JSON.stringify(${responseName}()), {
+  export const ${name} = http.${method}('*${url}', function handler(info) {
+    return new Response(JSON.stringify(${fakerName}()), {
       headers: {
         'Content-Type': 'application/json',
       },
@@ -42,67 +28,3 @@ function Template({ name, method, path, responseName }: TemplateProps): ReactNod
     </File.Source>
   )
 }
-
-const defaultTemplates = { default: Template } as const
-
-type Props = {
-  /**
-   * This will make it possible to override the default behaviour.
-   */
-  Template?: React.ComponentType<React.ComponentProps<typeof Template>>
-}
-
-export function Mock({ Template = defaultTemplates.default }: Props): ReactNode {
-  const { pluginManager } = useApp<PluginMsw>()
-  const { getSchemas, getName } = useOperationManager()
-  const operation = useOperation()
-
-  const schemas = getSchemas(operation)
-  const name = getName(operation, { type: 'function' })
-  const responseName = pluginManager.resolveName({
-    pluginKey: [pluginFakerName],
-    name: schemas.response.name,
-    type: 'type',
-  })
-
-  return <Template name={name} responseName={responseName} method={operation.method} path={new URLPath(operation.path)} />
-}
-
-type FileProps = {
-  /**
-   * This will make it possible to override the default behaviour.
-   */
-  templates?: typeof defaultTemplates
-}
-
-Mock.File = function ({ templates = defaultTemplates }: FileProps): ReactNode {
-  const {
-    pluginManager,
-    plugin: {
-      options: { extName },
-    },
-  } = useApp<PluginMsw>()
-  const { getSchemas, getFile } = useOperationManager()
-  const operation = useOperation()
-
-  const schemas = getSchemas(operation)
-  const file = getFile(operation)
-  const fileFaker = getFile(operation, { pluginKey: [pluginFakerName] })
-  const responseName = pluginManager.resolveName({
-    pluginKey: [pluginFakerName],
-    name: schemas.response.name,
-    type: 'function',
-  })
-
-  const Template = templates.default
-
-  return (
-    <File<FileMeta> baseName={file.baseName} path={file.path} meta={file.meta}>
-      <File.Import name={['http']} path={'msw'} />
-      {fileFaker && responseName && <File.Import name={[responseName]} root={file.path} path={fileFaker.path} />}
-      <Mock Template={Template} />
-    </File>
-  )
-}
-
-Mock.templates = defaultTemplates

package/src/components/index.ts

@@ -1,2 +1,2 @@
 export { Mock } from './Mock.tsx'
-export { Operations } from './Operations.tsx'
+export { Handlers } from './Handlers.tsx'

package/src/generators/__snapshots__/createPet.ts

@@ -0,0 +1,9 @@
+import { http } from "msw";
+
+ export const createPets = http.post("*/pets", function handler(info) {
+    return new Response(JSON.stringify(createPetsMutationResponse()), {
+        headers: {
+            "Content-Type": "application/json",
+        },
+    });
+});

package/src/generators/__snapshots__/deletePet.ts

@@ -0,0 +1,9 @@
+import { http } from "msw";
+
+ export const deletePetsPetid = http.delete("*/pets/:petId", function handler(info) {
+    return new Response(JSON.stringify(deletePetsPetidMutationResponse()), {
+        headers: {
+            "Content-Type": "application/json",
+        },
+    });
+});

package/src/generators/__snapshots__/getPets.ts

@@ -0,0 +1,9 @@
+import { http } from "msw";
+
+ export const listPets = http.get("*/pets", function handler(info) {
+    return new Response(JSON.stringify(listPetsQueryResponse()), {
+        headers: {
+            "Content-Type": "application/json",
+        },
+    });
+});

package/src/generators/__snapshots__/handlers.ts

@@ -0,0 +1,3 @@
+import { listPets, createPets, showPetById } from "./findByTags";
+
+ export const handlers = [listPets, createPets, showPetById] as const;

package/src/generators/__snapshots__/showPetById.ts

@@ -0,0 +1,9 @@
+import { http } from "msw";
+
+ export const showPetById = http.get("*/pets/:petId", function handler(info) {
+    return new Response(JSON.stringify(showPetByIdQueryResponse()), {
+        headers: {
+            "Content-Type": "application/json",
+        },
+    });
+});

package/src/generators/handlersGenerator.tsx

@@ -0,0 +1,32 @@
+import { createReactGenerator } from '@kubb/plugin-oas'
+import { useOperationManager } from '@kubb/plugin-oas/hooks'
+import { File, useApp } from '@kubb/react'
+import { Handlers } from '../components/Handlers.tsx'
+import { pluginMswName } from '../plugin.ts'
+import type { PluginMsw } from '../types'
+
+export const handlersGenerator = createReactGenerator<PluginMsw>({
+  name: 'plugin-msw',
+  Operations({ operations }) {
+    const { pluginManager, plugin } = useApp<PluginMsw>()
+    const { getName, getFile } = useOperationManager()
+
+    const file = pluginManager.getFile({ name: 'handlers', extname: '.ts', pluginKey: [pluginMswName] })
+
+    const imports = operations.map((operation) => {
+      const operationFile = getFile(operation, { pluginKey: [pluginMswName] })
+      const operationName = getName(operation, { pluginKey: [pluginMswName], type: 'function' })
+
+      return <File.Import key={operationFile.path} name={[operationName]} root={file.path} path={operationFile.path} />
+    })
+
+    const handlers = operations.map((operation) => getName(operation, { type: 'function', pluginKey: [pluginMswName] }))
+
+    return (
+      <File baseName={file.baseName} path={file.path} meta={file.meta} banner={plugin.options.output?.banner} footer={plugin.options.output?.footer}>
+        {imports}
+        <Handlers name={'handlers'} handlers={handlers} />
+      </File>
+    )
+  },
+})

package/src/generators/index.ts

@@ -0,0 +1,2 @@
+export { mswGenerator } from './mswGenerator.tsx'
+export { handlersGenerator } from './handlersGenerator.tsx'

package/src/generators/mswGenerator.tsx

@@ -0,0 +1,38 @@
+import { URLPath } from '@kubb/core/utils'
+import { pluginFakerName } from '@kubb/plugin-faker'
+import { createReactGenerator } from '@kubb/plugin-oas'
+import { useOperationManager } from '@kubb/plugin-oas/hooks'
+import { File, useApp } from '@kubb/react'
+import { Mock } from '../components'
+import type { PluginMsw } from '../types'
+
+export const mswGenerator = createReactGenerator<PluginMsw>({
+  name: 'msw',
+  Operation({ operation }) {
+    const {
+      plugin: {
+        options: { output },
+      },
+    } = useApp<PluginMsw>()
+    const { getSchemaName, getName, getFile } = useOperationManager()
+
+    const mock = {
+      name: getName(operation, { type: 'function' }),
+      file: getFile(operation),
+    }
+
+    const faker = {
+      name: getSchemaName(operation, 'response', { pluginKey: [pluginFakerName], type: 'function' }),
+      file: getFile(operation, { pluginKey: [pluginFakerName] }),
+    }
+
+    return (
+      <File baseName={mock.file.baseName} path={mock.file.path} meta={mock.file.meta} banner={output?.banner} footer={output?.footer}>
+        <File.Import name={['http']} path={'msw'} />
+        {faker.file && faker.name && <File.Import name={[faker.name]} root={mock.file.path} path={faker.file.path} />}
+
+        <Mock name={mock.name} fakerName={faker.name} method={operation.method} url={new URLPath(operation.path).toURLPath()} />
+      </File>
+    )
+  },
+})

package/src/plugin.ts

@@ -1,45 +1,48 @@
 import path from 'node:path'
 
-import { FileManager, PluginManager, createPlugin } from '@kubb/core'
+import { FileManager, type Group, PluginManager, createPlugin } from '@kubb/core'
 import { camelCase } from '@kubb/core/transformers'
 import { renderTemplate } from '@kubb/core/utils'
-import { pluginOasName } from '@kubb/plugin-oas'
+import { OperationGenerator, pluginOasName } from '@kubb/plugin-oas'
 
 import { pluginFakerName } from '@kubb/plugin-faker'
 import { pluginTsName } from '@kubb/plugin-ts'
 
-import { OperationGenerator } from './OperationGenerator.tsx'
-import { Mock, Operations } from './components/index.ts'
-
 import type { Plugin } from '@kubb/core'
 import type { PluginOas as SwaggerPluginOptions } from '@kubb/plugin-oas'
+import { handlersGenerator, mswGenerator } from './generators'
 import type { PluginMsw } from './types.ts'
 
 export const pluginMswName = 'plugin-msw' satisfies PluginMsw['name']
 
 export const pluginMsw = createPlugin<PluginMsw>((options) => {
-  const { output = { path: 'handlers' }, group, exclude = [], include, override = [], transformers = {}, templates } = options
-  const template = group?.output ? group.output : `${output.path}/{{tag}}Controller`
+  const {
+    output = { path: 'handlers', barrelType: 'named' },
+    group,
+    exclude = [],
+    include,
+    override = [],
+    transformers = {},
+    handlers = false,
+    generators = [mswGenerator, handlers ? handlersGenerator : undefined].filter(Boolean),
+  } = options
 
   return {
     name: pluginMswName,
-    output: {
-      exportType: 'barrelNamed',
-      ...output,
-    },
     options: {
-      extName: output.extName,
-      templates: {
-        operations: Operations.templates,
-        mock: Mock.templates,
-        ...templates,
-      },
+      output,
     },
     pre: [pluginOasName, pluginTsName, pluginFakerName],
     resolvePath(baseName, pathMode, options) {
       const root = path.resolve(this.config.root, this.config.output.path)
       const mode = pathMode ?? FileManager.getMode(path.resolve(root, output.path))
 
+      if (options?.tag && group?.type === 'tag') {
+        const groupName: Group['name'] = group?.name ? group.name : (ctx) => `${ctx.group}Controller`
+
+        return path.resolve(root, output.path, groupName({ group: camelCase(options.tag) }), baseName)
+      }
+
       if (mode === 'single') {
         /**
          * when output is a file then we will always append to the same file(output file), see fileManager.addOrAppend
@@ -48,12 +51,6 @@ export const pluginMsw = createPlugin<PluginMsw>((options) => {
         return path.resolve(root, output.path)
       }
 
-      if (options?.tag && group?.type === 'tag') {
-        const tag = camelCase(options.tag)
-
-        return path.resolve(root, renderTemplate(template, { tag }), baseName)
-      }
-
       return path.resolve(root, output.path, baseName)
     },
     resolveName(name, type) {
@@ -61,6 +58,7 @@ export const pluginMsw = createPlugin<PluginMsw>((options) => {
         suffix: type ? 'handler' : undefined,
         isFile: type === 'file',
       })
+
       if (type) {
         return transformers?.name?.(resolvedName, type) || resolvedName
       }
@@ -85,22 +83,21 @@ export const pluginMsw = createPlugin<PluginMsw>((options) => {
         mode,
       })
 
-      const files = await operationGenerator.build()
+      const files = await operationGenerator.build(...generators)
       await this.addFile(...files)
 
-      if (this.config.output.exportType) {
-        const barrelFiles = await this.fileManager.getBarrelFiles({
-          root,
-          output,
-          files: this.fileManager.files,
-          meta: {
-            pluginKey: this.plugin.key,
-          },
-          logger: this.logger,
-        })
-
-        await this.addFile(...barrelFiles)
-      }
+      const barrelFiles = await this.fileManager.getBarrelFiles({
+        type: output.barrelType ?? 'named',
+        root,
+        output,
+        files: this.fileManager.files,
+        meta: {
+          pluginKey: this.plugin.key,
+        },
+        logger: this.logger,
+      })
+
+      await this.addFile(...barrelFiles)
     },
   }
 })

package/src/types.ts

@@ -1,58 +1,16 @@
-import type { Plugin, PluginFactoryOptions, ResolveNameParams } from '@kubb/core'
-import type * as KubbFile from '@kubb/fs/types'
+import type { Group, Output, PluginFactoryOptions, ResolveNameParams } from '@kubb/core'
 
-import type { Exclude, Include, Override, ResolvePathOptions } from '@kubb/plugin-oas'
-import type { Mock, Operations } from './components/index.ts'
-
-type Templates = {
-  operations?: typeof Operations.templates | false
-  mock?: typeof Mock.templates | false
-}
+import type { Exclude, Generator, Include, Override, ResolvePathOptions } from '@kubb/plugin-oas'
 
 export type Options = {
-  output?: {
-    /**
-     * Relative path to save the MSW mocks.
-     * When output is a file it will save all models inside that file else it will create a file per schema item.
-     * @default 'mocks'
-     */
-    path: string
-    /**
-     * Name to be used for the `export * as {{exportAs}} from './'`
-     */
-    exportAs?: string
-    /**
-     * Add an extension to the generated imports and exports, default it will not use an extension
-     */
-    extName?: KubbFile.Extname
-    /**
-     * Define what needs to exported, here you can also disable the export of barrel files
-     * @default `'barrel'`
-     */
-    exportType?: 'barrel' | 'barrelNamed' | false
-  }
+  /**
+   * @default 'mocks'
+   */
+  output?: Output
   /**
    * Group the MSW mocks based on the provided name.
    */
-  group?: {
-    /**
-     * Tag will group based on the operation tag inside the Swagger file
-     */
-    type: 'tag'
-    /**
-     * Relative path to save the grouped MSW mocks.
-     *
-     * `{{tag}}` will be replaced by the current tagName.
-     * @example `${output}/{{tag}}Controller` => `mocks/PetController`
-     * @default `${output}/{{tag}}Controller`
-     */
-    output?: string
-    /**
-     * Name to be used for the `export * as {{exportAs}} from './`
-     * @default `"{{tag}}Handlers"`
-     */
-    exportAs?: string
-  }
+  group?: Group
   /**
    * Array containing exclude parameters to exclude/skip tags/operations/methods/paths.
    */
@@ -72,18 +30,17 @@ export type Options = {
     name?: (name: ResolveNameParams['name'], type?: ResolveNameParams['type']) => string
   }
   /**
-   * Make it possible to override one of the templates
+   * Create `handlers.ts` file with all handlers grouped by methods.
+   * @default `false`
+   */
+  handlers?: boolean
+  /**
+   * Define some generators next to the msw generators
    */
-  templates?: Partial<Templates>
+  generators?: Array<Generator<PluginMsw>>
 }
 type ResolvedOptions = {
-  extName: KubbFile.Extname | undefined
-  templates: NonNullable<Templates>
-}
-
-export type FileMeta = {
-  pluginKey?: Plugin['key']
-  tag?: string
+  output: Output
 }
 
 export type PluginMsw = PluginFactoryOptions<'plugin-msw', Options, ResolvedOptions, never, ResolvePathOptions>

package/dist/chunk-3KHLTEUD.js

@@ -1,104 +0,0 @@
-// src/components/Mock.tsx
-import { URLPath } from "@kubb/core/utils";
-import { File, useApp } from "@kubb/react";
-import { pluginFakerName } from "@kubb/plugin-faker";
-import { useOperation, useOperationManager } from "@kubb/plugin-oas/hooks";
-import { jsx, jsxs } from "@kubb/react/jsx-runtime";
-function Template({ name, method, path, responseName }) {
-  return /* @__PURE__ */ jsx(File.Source, { name, isExportable: true, isIndexable: true, children: `
-  export const ${name} = http.${method}('*${path.toURLPath()}', function handler(info) {
-    return new Response(JSON.stringify(${responseName}()), {
-      headers: {
-        'Content-Type': 'application/json',
-      },
-    })
-  })
-  ` });
-}
-var defaultTemplates = { default: Template };
-function Mock({ Template: Template3 = defaultTemplates.default }) {
-  const { pluginManager } = useApp();
-  const { getSchemas, getName } = useOperationManager();
-  const operation = useOperation();
-  const schemas = getSchemas(operation);
-  const name = getName(operation, { type: "function" });
-  const responseName = pluginManager.resolveName({
-    pluginKey: [pluginFakerName],
-    name: schemas.response.name,
-    type: "type"
-  });
-  return /* @__PURE__ */ jsx(Template3, { name, responseName, method: operation.method, path: new URLPath(operation.path) });
-}
-Mock.File = function({ templates = defaultTemplates }) {
-  const {
-    pluginManager,
-    plugin: {
-      options: { extName }
-    }
-  } = useApp();
-  const { getSchemas, getFile } = useOperationManager();
-  const operation = useOperation();
-  const schemas = getSchemas(operation);
-  const file = getFile(operation);
-  const fileFaker = getFile(operation, { pluginKey: [pluginFakerName] });
-  const responseName = pluginManager.resolveName({
-    pluginKey: [pluginFakerName],
-    name: schemas.response.name,
-    type: "function"
-  });
-  const Template3 = templates.default;
-  return /* @__PURE__ */ jsxs(File, { baseName: file.baseName, path: file.path, meta: file.meta, children: [
-    /* @__PURE__ */ jsx(File.Import, { name: ["http"], path: "msw" }),
-    fileFaker && responseName && /* @__PURE__ */ jsx(File.Import, { name: [responseName], root: file.path, path: fileFaker.path }),
-    /* @__PURE__ */ jsx(Mock, { Template: Template3 })
-  ] });
-};
-Mock.templates = defaultTemplates;
-
-// src/components/Operations.tsx
-import { useOperationManager as useOperationManager2, useOperations } from "@kubb/plugin-oas/hooks";
-import { File as File2, useApp as useApp2 } from "@kubb/react";
-import { jsx as jsx2, jsxs as jsxs2 } from "@kubb/react/jsx-runtime";
-function Template2({ name, handlers }) {
-  return /* @__PURE__ */ jsx2(File2.Source, { name, isExportable: true, isIndexable: true, children: `export const ${name} = ${JSON.stringify(handlers).replaceAll(`"`, "")} as const` });
-}
-function RootTemplate({ children }) {
-  const {
-    pluginManager,
-    plugin: { key: pluginKey }
-  } = useApp2();
-  const { getName, getFile } = useOperationManager2();
-  const file = pluginManager.getFile({ name: "handlers", extName: ".ts", pluginKey });
-  const operations = useOperations();
-  const imports = operations.map((operation) => {
-    const operationFile = getFile(operation, { pluginKey });
-    const operationName = getName(operation, { pluginKey, type: "function" });
-    return /* @__PURE__ */ jsx2(File2.Import, { name: [operationName], root: file.path, path: operationFile.path }, operationFile.path);
-  }).filter(Boolean);
-  return /* @__PURE__ */ jsxs2(File2, { baseName: file.baseName, path: file.path, meta: file.meta, children: [
-    imports,
-    children
-  ] });
-}
-var defaultTemplates2 = { default: Template2, root: RootTemplate };
-function Operations({ Template: Template3 = defaultTemplates2.default }) {
-  const {
-    plugin: { key: pluginKey }
-  } = useApp2();
-  const operations = useOperations();
-  const { getName } = useOperationManager2();
-  return /* @__PURE__ */ jsx2(Template3, { name: "handlers", handlers: operations.map((operation) => getName(operation, { type: "function", pluginKey })) });
-}
-Operations.File = function(props) {
-  const templates = { ...defaultTemplates2, ...props.templates };
-  const Template3 = templates.default;
-  const RootTemplate2 = templates.root;
-  return /* @__PURE__ */ jsx2(RootTemplate2, { children: /* @__PURE__ */ jsx2(Operations, { Template: Template3 }) });
-};
-Operations.templates = defaultTemplates2;
-
-export {
-  Mock,
-  Operations
-};
-//# sourceMappingURL=chunk-3KHLTEUD.js.map