@kubb/plugin-svelte-query 0.0.0-canary-20241104172400

package/dist/types-B9W9aYra.d.ts

@@ -0,0 +1,365 @@
+import { PluginFactoryOptions, Output, Group, ResolveNameParams } from '@kubb/core';
+import { HttpMethod, Operation } from '@kubb/oas';
+import { ResolvePathOptions, Exclude, Include, Override, Generator, OperationSchemas } from '@kubb/plugin-oas';
+
+type Options$2 = {
+    /**
+     * Specify the export location for the files and define the behavior of the output
+     * @default { path: 'clients', barrelType: 'named' }
+     */
+    output?: Output;
+    /**
+     * Group the clients based on the provided name.
+     */
+    group?: Group;
+    /**
+     * Array containing exclude parameters to exclude/skip tags/operations/methods/paths.
+     */
+    exclude?: Array<Exclude>;
+    /**
+     * Array containing include parameters to include tags/operations/methods/paths.
+     */
+    include?: Array<Include>;
+    /**
+     * Array containing override parameters to override `options` based on tags/operations/methods/paths.
+     */
+    override?: Array<Override<ResolvedOptions$2>>;
+    /**
+     * Create `operations.ts` file with all operations grouped by methods.
+     * @default false
+     */
+    operations?: boolean;
+    /**
+     * Path to the client import path that will be used to do the API calls.
+     * It will be used as `import client from '${client.importPath}'`.
+     * It allows both relative and absolute path but be aware that we will not change the path.
+     * @default '@kubb/plugin-client/client'
+     */
+    importPath?: string;
+    /**
+     * Allows you to set a custom base url for all generated calls.
+     */
+    baseURL?: string;
+    /**
+     * ReturnType that will be used when calling the client.
+     * - 'data' will return ResponseConfig[data].
+     * - 'full' will return ResponseConfig.
+     * @default 'data'
+     */
+    dataReturnType?: 'data' | 'full';
+    /**
+     * How to pass your params
+     * - 'object' will return the params and pathParams as an object.
+     * - 'inline' will return the params as comma separated params.
+     * @default 'inline'
+     */
+    paramsType?: 'object' | 'inline';
+    /**
+     * How to pass your pathParams.
+     * - 'object' will return the pathParams as an object.
+     * - 'inline' will return the pathParams as comma separated params.
+     * @default 'inline'
+     */
+    pathParamsType?: 'object' | 'inline';
+    /**
+     * Which parser can be used before returning the data
+     * - 'zod'  will use `@kubb/plugin-zod` to parse the data.
+     * @default 'client'
+     */
+    parser?: 'client' | 'zod';
+    transformers?: {
+        /**
+         * Customize the names based on the type that is provided by the plugin.
+         */
+        name?: (name: ResolveNameParams['name'], type?: ResolveNameParams['type']) => string;
+    };
+    /**
+     * Define some generators next to the client generators
+     */
+    generators?: Array<Generator<PluginClient>>;
+};
+type ResolvedOptions$2 = {
+    output: Output;
+    group?: Options$2['group'];
+    baseURL: string | undefined;
+    parser: NonNullable<Options$2['parser']>;
+    importPath: NonNullable<Options$2['importPath']>;
+    dataReturnType: NonNullable<Options$2['dataReturnType']>;
+    pathParamsType: NonNullable<Options$2['pathParamsType']>;
+    paramsType: NonNullable<Options$2['paramsType']>;
+};
+type PluginClient = PluginFactoryOptions<'plugin-client', Options$2, ResolvedOptions$2, never, ResolvePathOptions>;
+
+type TransformerProps$1 = {
+    operation: Operation;
+    schemas: OperationSchemas;
+};
+type Transformer$1 = (props: TransformerProps$1) => unknown[];
+type Suspense = object;
+/**
+ * Customize the queryKey
+ */
+type QueryKey$1 = Transformer$1;
+/**
+ * Customize the mutationKey
+ */
+type MutationKey$1 = Transformer$1;
+type Query$1 = {
+    /**
+     * Define which HttpMethods can be used for queries
+     * @default ['get']
+     */
+    methods: Array<HttpMethod>;
+    /**
+     * Path to the useQuery that will be used to do the useQuery functionality.
+     * It will be used as `import { useQuery } from '${importPath}'`.
+     * It allows both relative and absolute path.
+     * the path will be applied as is, so relative path should be based on the file being generated.
+     * @default '@tanstack/react-query'
+     */
+    importPath?: string;
+};
+type Mutation$1 = {
+    /**
+     * Define which HttpMethods can be used for mutations
+     * @default ['post', 'put', 'delete']
+     */
+    methods: Array<HttpMethod>;
+    /**
+     * Path to the useQuery that will be used to do the useQuery functionality.
+     * It will be used as `import { useQuery } from '${importPath}'`.
+     * It allows both relative and absolute path.
+     * the path will be applied as is, so relative path should be based on the file being generated.
+     * @default '@tanstack/react-query'
+     */
+    importPath?: string;
+};
+type Infinite = {
+    /**
+     * Specify the params key used for `pageParam`.
+     * @default 'id'
+     */
+    queryParam: string;
+    /**
+     * Which field of the data will be used, set it to undefined when no cursor is known.
+     */
+    cursorParam?: string | undefined;
+    /**
+     * The initial value, the value of the first page.
+     * @default 0
+     */
+    initialPageParam: unknown;
+};
+type Options$1 = {
+    /**
+     * Specify the export location for the files and define the behavior of the output
+     * @default { path: 'hooks', barrelType: 'named' }
+     */
+    output?: Output;
+    /**
+     * Group the @tanstack/query hooks based on the provided name.
+     */
+    group?: Group;
+    client?: Pick<PluginClient['options'], 'dataReturnType' | 'importPath' | 'baseURL'>;
+    /**
+     * Array containing exclude parameters to exclude/skip tags/operations/methods/paths.
+     */
+    exclude?: Array<Exclude>;
+    /**
+     * Array containing include parameters to include tags/operations/methods/paths.
+     */
+    include?: Array<Include>;
+    /**
+     * Array containing override parameters to override `options` based on tags/operations/methods/paths.
+     */
+    override?: Array<Override<ResolvedOptions$1>>;
+    /**
+     * How to pass your params
+     * - 'object' will return the params and pathParams as an object.
+     * - 'inline' will return the params as comma separated params.
+     * @default 'inline'
+     */
+    paramsType?: 'object' | 'inline';
+    /**
+     * How to pass your pathParams.
+     * - 'object' will return the pathParams as an object.
+     * - 'inline' will return the pathParams as comma separated params.
+     * @default 'inline'
+     */
+    pathParamsType?: PluginClient['options']['pathParamsType'];
+    /**
+     * When set, an infiniteQuery hooks will be added.
+     */
+    infinite?: Partial<Infinite> | false;
+    /**
+     * When set, a suspenseQuery hooks will be added.
+     */
+    suspense?: Partial<Suspense> | false;
+    queryKey?: QueryKey$1;
+    /**
+     * Override some useQuery behaviours.
+     */
+    query?: Partial<Query$1> | false;
+    mutationKey?: MutationKey$1;
+    /**
+     * Override some useMutation behaviours.
+     */
+    mutation?: Partial<Mutation$1> | false;
+    /**
+     * Which parser should be used before returning the data to `@tanstack/query`.
+     * `'zod'` will use `@kubb/plugin-zod` to parse the data.
+     */
+    parser?: PluginClient['options']['parser'];
+    transformers?: {
+        /**
+         * Customize the names based on the type that is provided by the plugin.
+         */
+        name?: (name: ResolveNameParams['name'], type?: ResolveNameParams['type']) => string;
+    };
+    /**
+     * Define some generators next to the react-query generators
+     */
+    generators?: Array<Generator<PluginReactQuery>>;
+};
+type ResolvedOptions$1 = {
+    output: Output;
+    client: Required<Omit<NonNullable<PluginReactQuery['options']['client']>, 'baseURL'>> & {
+        baseURL?: string;
+    };
+    parser: Required<NonNullable<Options$1['parser']>>;
+    pathParamsType: NonNullable<Options$1['pathParamsType']>;
+    paramsType: NonNullable<Options$1['paramsType']>;
+    /**
+     * Only used of infinite
+     */
+    infinite: NonNullable<Infinite> | false;
+    suspense: Suspense | false;
+    queryKey: QueryKey$1 | undefined;
+    query: NonNullable<Required<Query$1>> | false;
+    mutationKey: MutationKey$1 | undefined;
+    mutation: NonNullable<Required<Mutation$1>> | false;
+};
+type PluginReactQuery = PluginFactoryOptions<'plugin-react-query', Options$1, ResolvedOptions$1, never, ResolvePathOptions>;
+
+type TransformerProps = {
+    operation: Operation;
+    schemas: OperationSchemas;
+};
+type Transformer = (props: TransformerProps) => unknown[];
+/**
+ * Customize the queryKey
+ */
+type QueryKey = Transformer;
+/**
+ * Customize the mutationKey
+ */
+type MutationKey = Transformer;
+type Query = {
+    /**
+     * Define which HttpMethods can be used for queries
+     * @default ['get']
+     */
+    methods: Array<HttpMethod>;
+    /**
+     * Path to the useQuery that will be used to do the useQuery functionality.
+     * It will be used as `import { useQuery } from '${importPath}'`.
+     * It allows both relative and absolute path.
+     * the path will be applied as is, so relative path should be based on the file being generated.
+     * @default '@tanstack/svelte-query'
+     */
+    importPath?: string;
+};
+type Mutation = {
+    /**
+     * Define which HttpMethods can be used for mutations
+     * @default ['post', 'put', 'delete']
+     */
+    methods: Array<HttpMethod>;
+    /**
+     * Path to the useQuery that will be used to do the useQuery functionality.
+     * It will be used as `import { useQuery } from '${importPath}'`.
+     * It allows both relative and absolute path.
+     * the path will be applied as is, so relative path should be based on the file being generated.
+     * @default '@tanstack/svelte-query'
+     */
+    importPath?: string;
+};
+type Options = {
+    /**
+     * Specify the export location for the files and define the behavior of the output
+     * @default { path: 'hooks', barrelType: 'named' }
+     */
+    output?: Output;
+    /**
+     * Group the @tanstack/query hooks based on the provided name.
+     */
+    group?: Group;
+    client?: Pick<PluginClient['options'], 'dataReturnType' | 'importPath' | 'baseURL'>;
+    /**
+     * Array containing exclude parameters to exclude/skip tags/operations/methods/paths.
+     */
+    exclude?: Array<Exclude>;
+    /**
+     * Array containing include parameters to include tags/operations/methods/paths.
+     */
+    include?: Array<Include>;
+    /**
+     * Array containing override parameters to override `options` based on tags/operations/methods/paths.
+     */
+    override?: Array<Override<ResolvedOptions>>;
+    /**
+     * How to pass your params
+     * - 'object' will return the params and pathParams as an object.
+     * - 'inline' will return the params as comma separated params.
+     * @default 'inline'
+     */
+    paramsType?: 'object' | 'inline';
+    /**
+     * How to pass your pathParams.
+     * - 'object' will return the pathParams as an object.
+     * - 'inline' will return the pathParams as comma separated params.
+     * @default 'inline'
+     */
+    pathParamsType?: PluginClient['options']['pathParamsType'];
+    queryKey?: QueryKey;
+    /**
+     * Override some useQuery behaviours.
+     */
+    query?: Partial<Query> | false;
+    mutationKey?: MutationKey;
+    /**
+     * Override some useMutation behaviours.
+     */
+    mutation?: Mutation | false;
+    /**
+     * Which parser should be used before returning the data to `@tanstack/query`.
+     * `'zod'` will use `@kubb/plugin-zod` to parse the data.
+     */
+    parser?: PluginClient['options']['parser'];
+    transformers?: {
+        /**
+         * Customize the names based on the type that is provided by the plugin.
+         */
+        name?: (name: ResolveNameParams['name'], type?: ResolveNameParams['type']) => string;
+    };
+    /**
+     * Define some generators next to the svelte-query generators
+     */
+    generators?: Array<Generator<PluginSvelteQuery>>;
+};
+type ResolvedOptions = {
+    output: Output;
+    client: Required<Omit<NonNullable<PluginReactQuery['options']['client']>, 'baseURL'>> & {
+        baseURL?: string;
+    };
+    parser: Required<NonNullable<Options['parser']>>;
+    paramsType: NonNullable<Options['paramsType']>;
+    pathParamsType: NonNullable<Options['pathParamsType']>;
+    queryKey: QueryKey | undefined;
+    query: NonNullable<Required<Query>> | false;
+    mutationKey: MutationKey | undefined;
+    mutation: NonNullable<Required<Mutation>> | false;
+};
+type PluginSvelteQuery = PluginFactoryOptions<'plugin-svelte-query', Options, ResolvedOptions, never, ResolvePathOptions>;
+
+export type { Options as O, PluginSvelteQuery as P, Transformer as T };

package/package.json

@@ -0,0 +1,102 @@
+{
+  "name": "@kubb/plugin-svelte-query",
+  "version": "0.0.0-canary-20241104172400",
+  "description": "Generator svelte-query hooks",
+  "keywords": [
+    "faker",
+    "faker.js",
+    "msw",
+    "mock",
+    "mocking",
+    "plugins",
+    "kubb",
+    "codegen",
+    "swagger",
+    "openapi"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/kubb-labs/kubb.git",
+    "directory": "packages/plugin-svelte-query"
+  },
+  "license": "MIT",
+  "author": "Stijn Van Hulle <stijn@stijnvanhulle.be",
+  "sideEffects": false,
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs",
+      "default": "./dist/index.cjs"
+    },
+    "./generators": {
+      "import": "./dist/generators.js",
+      "require": "./dist/generators.cjs",
+      "default": "./dist/generators.cjs"
+    },
+    "./components": {
+      "import": "./dist/components.js",
+      "require": "./dist/components.cjs",
+      "default": "./dist/components.cjs"
+    },
+    "./package.json": "./package.json",
+    "./*": "./*"
+  },
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "./dist/index.d.ts",
+  "typesVersions": {
+    "*": {
+      "components": [
+        "./dist/components.d.ts"
+      ],
+      "generators": [
+        "./dist/generators.d.ts"
+      ]
+    }
+  },
+  "files": [
+    "src",
+    "dist",
+    "!/**/**.test.**",
+    "!/**/__tests__/**"
+  ],
+  "dependencies": {
+    "@kubb/core": "0.0.0-canary-20241104172400",
+    "@kubb/fs": "0.0.0-canary-20241104172400",
+    "@kubb/oas": "0.0.0-canary-20241104172400",
+    "@kubb/plugin-oas": "0.0.0-canary-20241104172400",
+    "@kubb/plugin-ts": "0.0.0-canary-20241104172400",
+    "@kubb/plugin-zod": "0.0.0-canary-20241104172400",
+    "@kubb/react": "0.0.0-canary-20241104172400"
+  },
+  "devDependencies": {
+    "@types/react": "^18.3.12",
+    "react": "^18.3.1",
+    "tsup": "^8.3.5",
+    "typescript": "^5.6.3",
+    "@kubb/config-ts": "0.0.0-canary-20241104172400",
+    "@kubb/config-tsup": "0.0.0-canary-20241104172400"
+  },
+  "peerDependencies": {
+    "@kubb/react": "0.0.0-canary-20241104172400"
+  },
+  "engines": {
+    "node": ">=20"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "scripts": {
+    "build": "tsup",
+    "clean": "npx rimraf ./dist",
+    "lint": "bun biome lint .",
+    "lint:fix": "bun biome lint --apply-unsafe .",
+    "release": "pnpm publish --no-git-check",
+    "release:canary": "bash ../../.github/canary.sh && node ../../scripts/build.js canary && pnpm publish --no-git-check",
+    "start": "tsup --watch",
+    "test": "vitest --passWithNoTests",
+    "typecheck": "tsc -p ./tsconfig.json --noEmit --emitDeclarationOnly false"
+  }
+}

package/src/components/Mutation.tsx

@@ -0,0 +1,158 @@
+import { File, Function, FunctionParams } from '@kubb/react'
+
+import { type Operation, isOptional } 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 type { Params } from '@kubb/react/types'
+import type { ReactNode } from 'react'
+import type { PluginSvelteQuery } 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
+  paramsType: PluginSvelteQuery['resolvedOptions']['paramsType']
+  dataReturnType: PluginSvelteQuery['resolvedOptions']['client']['dataReturnType']
+  pathParamsType: PluginSvelteQuery['resolvedOptions']['pathParamsType']
+}
+
+type GetParamsProps = {
+  pathParamsType: PluginSvelteQuery['resolvedOptions']['pathParamsType']
+  dataReturnType: PluginSvelteQuery['resolvedOptions']['client']['dataReturnType']
+  typeSchemas: OperationSchemas
+}
+
+function getParams({ dataReturnType, typeSchemas }: GetParamsProps) {
+  const TData = dataReturnType === 'data' ? typeSchemas.response.name : `ResponseConfig<${typeSchemas.response.name}>`
+  const mutationParams = FunctionParams.factory({
+    ...getPathParams(typeSchemas.pathParams, { typed: true }),
+    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({ valueAsType: true })
+
+  return FunctionParams.factory({
+    options: {
+      type: `
+{
+  mutation?: CreateMutationOptions<${[TData, typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error', TRequest ? `{${TRequest}}` : undefined].filter(Boolean).join(', ')}>,
+  client?: ${typeSchemas.request?.name ? `Partial<RequestConfig<${typeSchemas.request?.name}>>` : 'Partial<RequestConfig>'},
+}
+`,
+      default: '{}',
+    },
+  })
+}
+
+export function Mutation({ name, clientName, paramsType, pathParamsType, dataReturnType, typeSchemas, operation, mutationKeyName }: Props): ReactNode {
+  const mutationKeyParams = MutationKey.getParams({
+    pathParamsType,
+    typeSchemas,
+  })
+
+  const params = getParams({
+    pathParamsType,
+    dataReturnType,
+    typeSchemas,
+  })
+
+  const clientParams = Client.getParams({
+    paramsType,
+    typeSchemas,
+    pathParamsType,
+  })
+  const mutationParams = FunctionParams.factory({
+    ...getPathParams(typeSchemas.pathParams, { typed: true }),
+    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({ valueAsType: true })
+  const TData = dataReturnType === 'data' ? typeSchemas.response.name : `ResponseConfig<${typeSchemas.response.name}>`
+  const generics = [TData, typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error', TRequest ? `{${TRequest}}` : undefined]
+    .filter(Boolean)
+    .join(', ')
+
+  return (
+    <File.Source name={name} isExportable isIndexable>
+      <Function
+        name={name}
+        export
+        params={params.toConstructor()}
+        JSDoc={{
+          comments: getComments(operation),
+        }}
+      >
+        {`
+        const { mutation: mutationOptions, client: config = {} } = options ?? {}
+        const mutationKey = mutationOptions?.mutationKey ?? ${mutationKeyName}(${mutationKeyParams.toCall()})
+
+        return createMutation<${generics}>({
+          mutationFn: async(${dataParams.toConstructor()}) => {
+            return ${clientName}(${clientParams.toCall()})
+          },
+          mutationKey,
+          ...mutationOptions
+        })
+    `}
+      </Function>
+    </File.Source>
+  )
+}

package/src/components/MutationKey.tsx

@@ -0,0 +1,54 @@
+import { URLPath } from '@kubb/core/utils'
+import { File, Function, FunctionParams, Type } from '@kubb/react'
+
+import type { Operation } from '@kubb/oas'
+import type { OperationSchemas } from '@kubb/plugin-oas'
+import type { ReactNode } from 'react'
+import type { PluginSvelteQuery, Transformer } from '../types'
+
+type Props = {
+  name: string
+  typeName: string
+  typeSchemas: OperationSchemas
+  operation: Operation
+  pathParamsType: PluginSvelteQuery['resolvedOptions']['pathParamsType']
+  transformer: Transformer | undefined
+}
+
+type GetParamsProps = {
+  pathParamsType: PluginSvelteQuery['resolvedOptions']['pathParamsType']
+  typeSchemas: OperationSchemas
+}
+
+function getParams({}: GetParamsProps) {
+  return FunctionParams.factory({})
+}
+
+const getTransformer: Transformer = ({ operation }) => {
+  const path = new URLPath(operation.path)
+
+  return [JSON.stringify({ url: path.path })].filter(Boolean)
+}
+
+export function MutationKey({ name, typeSchemas, pathParamsType, operation, typeName, transformer = getTransformer }: Props): ReactNode {
+  const params = getParams({ pathParamsType, typeSchemas })
+  const keys = transformer({ operation, schemas: typeSchemas })
+
+  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