refactor(pinia-colada): migrate queries to defineQueryOptions

.changeset/refactor-pinia-colada-query.md

@@ -0,0 +1,5 @@
+---
+"@hey-api/openapi-ts": patch
+---
+
+refactor(pinia-colada): migrate queries to `defineQueryOptions`

docs/openapi-ts/plugins/pinia-colada.md

@@ -30,7 +30,7 @@ The Pinia Colada plugin for Hey API generates functions and query keys from your
 - Pinia Colada v0 support
 - seamless integration with `@hey-api/openapi-ts` ecosystem
 - create query keys following the best practices
-- type-safe query options and mutation options
+- type-safe query options (using `defineQueryOptions`) and mutation options
 - minimal learning curve thanks to extending the underlying technology
 
 ## Installation
@@ -56,19 +56,9 @@ The Pinia Colada plugin will generate the following artifacts, depending on the
 
 Queries are generated from [query operations](/openapi-ts/configuration/parser#hooks-query-operations). The generated query functions follow the naming convention of SDK functions and by default append `Query`, e.g. `getPetByIdQuery()`.
 
-::: code-group
-
-```ts [example]
-const query = useQuery({
-  ...getPetByIdQuery({
-    path: {
-      petId: 1,
-    },
-  }),
-});
-```
+Each generated function is a [`defineQueryOptions`](https://pinia-colada.esm.dev/api/@pinia/colada/functions/defineQueryOptions.html) factory.
 
-```js [config]
+```js
 export default {
   input: 'hey-api/backend', // sign up at app.heyapi.dev
   output: 'src/client',
@@ -82,10 +72,47 @@ export default {
 };
 ```
 
-:::
-
 You can customize the naming and casing pattern for `queryOptions` functions using the `.name` and `.case` options.
 
+### Usage
+
+No params — pass the function directly to `useQuery`:
+
+```ts
+useQuery(getPetsQuery);
+```
+
+With parameters (constant values), use the two‑argument form:
+
+```ts
+useQuery(getPetByIdQuery, () => ({
+  path: { petId: 1 },
+}));
+```
+
+For reactive parameters, pass the generated function and compute options in the callback:
+
+```ts
+const petId = ref<number | null>(1);
+
+useQuery(getPetByIdQuery, () => ({
+  path: { petId: petId.value },
+}));
+```
+
+To pass `useQuery` [configuration](https://pinia-colada.esm.dev/api/@pinia/colada/interfaces/UseQueryOptions.html#Properties):
+
+```ts
+const petId = ref<number | null>(null);
+
+useQuery(() => ({
+  ...getPetByIdQuery({
+    path: { petId: petId.value as number },
+  }),
+  enabled: () => petId.value != null,
+}));
+```
+
 ## Query Keys
 
 Query keys contain normalized SDK function parameters and additional metadata.

packages/openapi-ts-tests/main/test/__snapshots__/2.0.x/plugins/@pinia/colada/asClass/@pinia/colada.gen.ts

@@ -1,8 +1,8 @@
 // This file is auto-generated by @hey-api/openapi-ts
 
 import { type Options, FooBazService, BarBazService } from '../sdk.gen';
-import type { _JSONValue, UseQueryOptions, UseMutationOptions } from '@pinia/colada';
-import type { GetFooData, GetFooResponse, FooPostData, FooPostResponse, FooPutData, FooPutResponse, GetFooBarData, GetFooBarResponse, FooBarPostData, FooBarPostResponse, FooBarPutData, FooBarPutResponse } from '../types.gen';
+import { type _JSONValue, defineQueryOptions, type UseMutationOptions } from '@pinia/colada';
+import type { GetFooData, FooPostData, FooPostResponse, FooPutData, FooPutResponse, GetFooBarData, FooBarPostData, FooBarPostResponse, FooBarPutData, FooBarPutResponse } from '../types.gen';
 import { client } from '../client.gen';
 
 export type QueryKey<TOptions extends Options> = [
@@ -20,19 +20,19 @@ const createQueryKey = <TOptions extends Options>(id: string, options?: TOptions
 ] => {
     const params: QueryKey<TOptions>[0] = { _id: id, baseUrl: options?.baseUrl || (options?.client ?? client).getConfig().baseUrl } as QueryKey<TOptions>[0];
     if (tags) {
-        params.tags = tags as unknown as undefined;
+        params.tags = tags as unknown as _JSONValue;
     }
     if (options?.body) {
         params.body = options.body;
     }
     if (options?.headers) {
-        params.headers = options.headers as unknown as undefined;
+        params.headers = options.headers as unknown as _JSONValue;
     }
     if (options?.path) {
         params.path = options.path;
     }
     if (options?.query) {
-        params.query = options.query as unknown as undefined;
+        params.query = options.query as unknown as _JSONValue;
     }
     return [
         params
@@ -41,19 +41,13 @@ const createQueryKey = <TOptions extends Options>(id: string, options?: TOptions
 
 export const getFooQueryKey = (options?: Options<GetFooData>) => createQueryKey('getFoo', options);
 
-export const getFooQuery = (options?: Options<GetFooData>): UseQueryOptions<GetFooResponse, Error> => {
-    return {
-        key: getFooQueryKey(options),
-        query: async (context) => {
-            const { data } = await FooBazService.getFoo({
-                ...options,
-                ...context,
-                throwOnError: true
-            });
-            return data;
-        }
-    };
-};
+export const getFooQuery = defineQueryOptions({
+    key: getFooQueryKey(),
+    query: async () => {
+        const { data } = await FooBazService.getFoo({ throwOnError: true });
+        return data;
+    }
+});
 
 export const fooPostMutation = (options?: Partial<Options<FooPostData>>): UseMutationOptions<FooPostResponse, Options<FooPostData>, Error> => {
     return {
@@ -83,19 +77,13 @@ export const fooPutMutation = (options?: Partial<Options<FooPutData>>): UseMutat
 
 export const getFooBarQueryKey = (options?: Options<GetFooBarData>) => createQueryKey('getFooBar', options);
 
-export const getFooBarQuery = (options?: Options<GetFooBarData>): UseQueryOptions<GetFooBarResponse, Error> => {
-    return {
-        key: getFooBarQueryKey(options),
-        query: async (context) => {
-            const { data } = await BarBazService.getFooBar({
-                ...options,
-                ...context,
-                throwOnError: true
-            });
-            return data;
-        }
-    };
-};
+export const getFooBarQuery = defineQueryOptions({
+    key: getFooBarQueryKey(),
+    query: async () => {
+        const { data } = await BarBazService.getFooBar({ throwOnError: true });
+        return data;
+    }
+});
 
 export const fooBarPostMutation = (options?: Partial<Options<FooBarPostData>>): UseMutationOptions<FooBarPostResponse, Options<FooBarPostData>, Error> => {
     return {