tangled
alpha
login
or
join now
mokkenstorm.dev
/
openapi-ts
0
fork
atom
fork of hey-api/openapi-ts because I need some additional things
0
fork
atom
overview
issues
pulls
pipelines
docs: add TanStack React Query example
Lubos
2 years ago
50548758
2ee2463a
+2342
-45
25 changed files
expand all
collapse all
unified
split
.changeset
hungry-apples-grab.md
examples
openapi-ts-axios
src
App.css
App.tsx
openapi-ts-fetch
src
App.css
App.tsx
openapi-ts-tanstack-react-query
.gitignore
index.html
openapi-ts.config.ts
package.json
postcss.config.js
src
App.css
App.tsx
client
@tanstack
react-query.gen.ts
index.ts
schemas.gen.ts
services.gen.ts
types.gen.ts
main.tsx
vite-env.d.ts
tailwind.config.js
tsconfig.json
tsconfig.node.json
vite.config.ts
packages
openapi-ts
package.json
pnpm-lock.yaml
+5
.changeset/hungry-apples-grab.md
···
1
1
+
---
2
2
+
'@example/openapi-ts-tanstack-react-query': patch
3
3
+
---
4
4
+
5
5
+
docs: add TanStack React Query example
-15
examples/openapi-ts-axios/src/App.css
···
1
1
@tailwind base;
2
2
@tailwind components;
3
3
@tailwind utilities;
4
4
-
5
5
-
.logo {
6
6
-
height: 4em;
7
7
-
will-change: filter;
8
8
-
transition: filter 300ms;
9
9
-
}
10
10
-
11
11
-
@keyframes logo-spin {
12
12
-
from {
13
13
-
transform: rotate(0deg);
14
14
-
}
15
15
-
to {
16
16
-
transform: rotate(360deg);
17
17
-
}
18
18
-
}
+6
-2
examples/openapi-ts-axios/src/App.tsx
···
147
147
<Container size="1">
148
148
<Section size="1" />
149
149
<Flex align="center">
150
150
-
<a href="https://heyapi.vercel.app/" target="_blank">
150
150
+
<a
151
151
+
className="shrink-0"
152
152
+
href="https://heyapi.vercel.app/"
153
153
+
target="_blank"
154
154
+
>
151
155
<img
152
156
src="https://heyapi.vercel.app/logo.png"
153
153
-
className="logo vanilla"
157
157
+
className="h-16 w-16 transition duration-300 will-change-auto"
154
158
alt="Hey API logo"
155
159
/>
156
160
</a>
-15
examples/openapi-ts-fetch/src/App.css
···
1
1
@tailwind base;
2
2
@tailwind components;
3
3
@tailwind utilities;
4
4
-
5
5
-
.logo {
6
6
-
height: 4em;
7
7
-
will-change: filter;
8
8
-
transition: filter 300ms;
9
9
-
}
10
10
-
11
11
-
@keyframes logo-spin {
12
12
-
from {
13
13
-
transform: rotate(0deg);
14
14
-
}
15
15
-
to {
16
16
-
transform: rotate(360deg);
17
17
-
}
18
18
-
}
+6
-2
examples/openapi-ts-fetch/src/App.tsx
···
147
147
<Container size="1">
148
148
<Section size="1" />
149
149
<Flex align="center">
150
150
-
<a href="https://heyapi.vercel.app/" target="_blank">
150
150
+
<a
151
151
+
className="shrink-0"
152
152
+
href="https://heyapi.vercel.app/"
153
153
+
target="_blank"
154
154
+
>
151
155
<img
152
156
src="https://heyapi.vercel.app/logo.png"
153
153
-
className="logo vanilla"
157
157
+
className="h-16 w-16 transition duration-300 will-change-auto"
154
158
alt="Hey API logo"
155
159
/>
156
160
</a>
+24
examples/openapi-ts-tanstack-react-query/.gitignore
···
1
1
+
# Logs
2
2
+
logs
3
3
+
*.log
4
4
+
npm-debug.log*
5
5
+
yarn-debug.log*
6
6
+
yarn-error.log*
7
7
+
pnpm-debug.log*
8
8
+
lerna-debug.log*
9
9
+
10
10
+
node_modules
11
11
+
dist
12
12
+
dist-ssr
13
13
+
*.local
14
14
+
15
15
+
# Editor directories and files
16
16
+
.vscode/*
17
17
+
!.vscode/extensions.json
18
18
+
.idea
19
19
+
.DS_Store
20
20
+
*.suo
21
21
+
*.ntvs*
22
22
+
*.njsproj
23
23
+
*.sln
24
24
+
*.sw?
+13
examples/openapi-ts-tanstack-react-query/index.html
···
1
1
+
<!doctype html>
2
2
+
<html lang="en">
3
3
+
<head>
4
4
+
<meta charset="UTF-8" />
5
5
+
<!-- <link rel="icon" type="image/svg+xml" href="/vite.svg" /> -->
6
6
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
7
+
<title>Hey API + TanStack React Query Demo</title>
8
8
+
</head>
9
9
+
<body>
10
10
+
<div id="root"></div>
11
11
+
<script type="module" src="/src/main.tsx"></script>
12
12
+
</body>
13
13
+
</html>
+18
examples/openapi-ts-tanstack-react-query/openapi-ts.config.ts
···
1
1
+
import { defineConfig } from '@hey-api/openapi-ts';
2
2
+
3
3
+
export default defineConfig({
4
4
+
client: '@hey-api/client-fetch',
5
5
+
input:
6
6
+
'https://raw.githubusercontent.com/swagger-api/swagger-petstore/master/src/main/resources/openapi.yaml',
7
7
+
// 'https://raw.githubusercontent.com/Redocly/museum-openapi-example/main/openapi.yaml',
8
8
+
// '../../packages/openapi-ts/test/spec/v3.json',
9
9
+
output: {
10
10
+
format: 'prettier',
11
11
+
lint: 'eslint',
12
12
+
path: './src/client',
13
13
+
},
14
14
+
plugins: ['@tanstack/react-query'],
15
15
+
types: {
16
16
+
enums: 'javascript',
17
17
+
},
18
18
+
});
+42
examples/openapi-ts-tanstack-react-query/package.json
···
1
1
+
{
2
2
+
"name": "@example/openapi-ts-tanstack-react-query",
3
3
+
"private": true,
4
4
+
"version": "0.0.1",
5
5
+
"type": "module",
6
6
+
"scripts": {
7
7
+
"build": "tsc && vite build",
8
8
+
"dev": "vite",
9
9
+
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
10
10
+
"openapi-ts": "openapi-ts",
11
11
+
"preview": "vite preview",
12
12
+
"typecheck": "tsc --noEmit"
13
13
+
},
14
14
+
"dependencies": {
15
15
+
"@hey-api/client-fetch": "workspace:*",
16
16
+
"@radix-ui/react-form": "0.1.0",
17
17
+
"@radix-ui/react-icons": "1.3.0",
18
18
+
"@radix-ui/themes": "3.1.1",
19
19
+
"@tanstack/react-query": "5.51.23",
20
20
+
"@tanstack/react-query-devtools": "5.51.23",
21
21
+
"react": "18.3.1",
22
22
+
"react-dom": "18.3.1"
23
23
+
},
24
24
+
"devDependencies": {
25
25
+
"@hey-api/openapi-ts": "workspace:*",
26
26
+
"@tanstack/eslint-plugin-query": "5.51.15",
27
27
+
"@types/react": "18.3.3",
28
28
+
"@types/react-dom": "18.3.0",
29
29
+
"@typescript-eslint/eslint-plugin": "7.15.0",
30
30
+
"@typescript-eslint/parser": "7.15.0",
31
31
+
"@vitejs/plugin-react": "4.3.1",
32
32
+
"autoprefixer": "10.4.19",
33
33
+
"eslint": "9.6.0",
34
34
+
"eslint-plugin-react-hooks": "4.6.2",
35
35
+
"eslint-plugin-react-refresh": "0.4.7",
36
36
+
"postcss": "8.4.39",
37
37
+
"prettier": "3.3.2",
38
38
+
"tailwindcss": "3.4.4",
39
39
+
"typescript": "5.5.3",
40
40
+
"vite": "5.3.3"
41
41
+
}
42
42
+
}
+6
examples/openapi-ts-tanstack-react-query/postcss.config.js
···
1
1
+
export default {
2
2
+
plugins: {
3
3
+
autoprefixer: {},
4
4
+
tailwindcss: {},
5
5
+
},
6
6
+
};
+3
examples/openapi-ts-tanstack-react-query/src/App.css
···
1
1
+
@tailwind base;
2
2
+
@tailwind components;
3
3
+
@tailwind utilities;
+278
examples/openapi-ts-tanstack-react-query/src/App.tsx
···
1
1
+
import './App.css';
2
2
+
3
3
+
import { createClient } from '@hey-api/client-fetch';
4
4
+
import * as Form from '@radix-ui/react-form';
5
5
+
import { DownloadIcon, PlusIcon, ReloadIcon } from '@radix-ui/react-icons';
6
6
+
import {
7
7
+
Avatar,
8
8
+
Box,
9
9
+
Button,
10
10
+
Card,
11
11
+
Container,
12
12
+
Flex,
13
13
+
Heading,
14
14
+
Section,
15
15
+
Text,
16
16
+
TextField,
17
17
+
} from '@radix-ui/themes';
18
18
+
import { useMutation, useQuery } from '@tanstack/react-query';
19
19
+
import { useEffect, useState } from 'react';
20
20
+
21
21
+
import {
22
22
+
addPetMutation,
23
23
+
getPetByIdOptions,
24
24
+
updatePetMutation,
25
25
+
} from './client/@tanstack/react-query.gen';
26
26
+
import { $Pet } from './client/schemas.gen';
27
27
+
import { client } from './client/services.gen';
28
28
+
import type { Pet } from './client/types.gen';
29
29
+
30
30
+
// configure internal service client
31
31
+
client.setConfig({
32
32
+
// set default base url for requests
33
33
+
baseUrl: 'https://petstore3.swagger.io/api/v3',
34
34
+
// set default headers for requests
35
35
+
headers: {
36
36
+
Authorization: 'Bearer <token_from_service_client>',
37
37
+
},
38
38
+
});
39
39
+
40
40
+
const localClient = createClient({
41
41
+
// set default base url for requests made by this client
42
42
+
baseUrl: 'https://petstore3.swagger.io/api/v3',
43
43
+
/**
44
44
+
* Set default headers only for requests made by this client. This is to
45
45
+
* demonstrate local clients and their configuration taking precedence over
46
46
+
* internal service client.
47
47
+
*/
48
48
+
headers: {
49
49
+
Authorization: 'Bearer <token_from_local_client>',
50
50
+
},
51
51
+
});
52
52
+
53
53
+
localClient.interceptors.request.use((request, options) => {
54
54
+
// Middleware is great for adding authorization tokens to requests made to
55
55
+
// protected paths. Headers are set randomly here to allow surfacing the
56
56
+
// default headers, too.
57
57
+
if (
58
58
+
options.url === '/pet/{petId}' &&
59
59
+
options.method === 'GET' &&
60
60
+
Math.random() < 0.5
61
61
+
) {
62
62
+
request.headers.set('Authorization', 'Bearer <token_from_interceptor>');
63
63
+
}
64
64
+
return request;
65
65
+
});
66
66
+
67
67
+
function App() {
68
68
+
const [pet, setPet] = useState<Pet>();
69
69
+
const [petId, setPetId] = useState<number>();
70
70
+
const [isRequiredNameError, setIsRequiredNameError] = useState(false);
71
71
+
72
72
+
const addPet = useMutation({
73
73
+
...addPetMutation,
74
74
+
onError: (error) => {
75
75
+
console.log(error);
76
76
+
setIsRequiredNameError(false);
77
77
+
},
78
78
+
onSuccess: (data) => {
79
79
+
setPet(data);
80
80
+
setIsRequiredNameError(false);
81
81
+
},
82
82
+
});
83
83
+
84
84
+
const updatePet = useMutation({
85
85
+
...updatePetMutation,
86
86
+
onError: (error) => {
87
87
+
console.log(error);
88
88
+
},
89
89
+
onSuccess: (data) => {
90
90
+
setPet(data);
91
91
+
},
92
92
+
});
93
93
+
94
94
+
const { data, error } = useQuery({
95
95
+
...getPetByIdOptions({
96
96
+
client: localClient,
97
97
+
path: {
98
98
+
petId: petId!,
99
99
+
},
100
100
+
}),
101
101
+
enabled: Boolean(petId),
102
102
+
});
103
103
+
104
104
+
const onAddPet = async (formData: FormData) => {
105
105
+
// simple form field validation to demonstrate using schemas
106
106
+
if ($Pet.required.includes('name') && !formData.get('name')) {
107
107
+
setIsRequiredNameError(true);
108
108
+
return;
109
109
+
}
110
110
+
111
111
+
addPet.mutate({
112
112
+
body: {
113
113
+
category: {
114
114
+
id: 0,
115
115
+
name: formData.get('category') as string,
116
116
+
},
117
117
+
id: 0,
118
118
+
name: formData.get('name') as string,
119
119
+
photoUrls: ['string'],
120
120
+
status: 'available',
121
121
+
tags: [
122
122
+
{
123
123
+
id: 0,
124
124
+
name: 'string',
125
125
+
},
126
126
+
],
127
127
+
},
128
128
+
});
129
129
+
};
130
130
+
131
131
+
const onGetPetById = async () => {
132
132
+
// random id 1-10
133
133
+
setPetId(Math.floor(Math.random() * (10 - 1 + 1) + 1));
134
134
+
};
135
135
+
136
136
+
const onUpdatePet = async () => {
137
137
+
updatePet.mutate({
138
138
+
body: {
139
139
+
category: {
140
140
+
id: 0,
141
141
+
name: 'Cats',
142
142
+
},
143
143
+
id: 2,
144
144
+
name: 'Updated Kitty',
145
145
+
photoUrls: ['string'],
146
146
+
status: 'available',
147
147
+
tags: [
148
148
+
{
149
149
+
id: 0,
150
150
+
name: 'string',
151
151
+
},
152
152
+
],
153
153
+
},
154
154
+
// setting headers per request
155
155
+
headers: {
156
156
+
Authorization: 'Bearer <token_from_method>',
157
157
+
},
158
158
+
});
159
159
+
};
160
160
+
161
161
+
useEffect(() => {
162
162
+
if (error) {
163
163
+
console.log(error);
164
164
+
return;
165
165
+
}
166
166
+
setPet(data!);
167
167
+
}, [data, error]);
168
168
+
169
169
+
return (
170
170
+
<Box
171
171
+
style={{ background: 'var(--gray-a2)', borderRadius: 'var(--radius-3)' }}
172
172
+
>
173
173
+
<Container size="1">
174
174
+
<Section size="1" />
175
175
+
<Flex align="center">
176
176
+
<a
177
177
+
className="shrink-0"
178
178
+
href="https://heyapi.vercel.app/"
179
179
+
target="_blank"
180
180
+
>
181
181
+
<img
182
182
+
src="https://heyapi.vercel.app/logo.png"
183
183
+
className="h-16 w-16 transition duration-300 will-change-auto"
184
184
+
alt="Hey API logo"
185
185
+
/>
186
186
+
</a>
187
187
+
<Heading>@hey-api/openapi-ts 🤝 TanStack React Query</Heading>
188
188
+
</Flex>
189
189
+
<Section size="1" />
190
190
+
<Flex direction="column" gapY="2">
191
191
+
<Box maxWidth="240px">
192
192
+
<Card>
193
193
+
<Flex gap="3" align="center">
194
194
+
<Avatar
195
195
+
size="3"
196
196
+
src={pet?.photoUrls[0]}
197
197
+
radius="full"
198
198
+
fallback={pet?.name.slice(0, 1) ?? 'N'}
199
199
+
/>
200
200
+
<Box>
201
201
+
<Text as="div" size="2" weight="bold">
202
202
+
Name: {pet?.name ?? 'N/A'}
203
203
+
</Text>
204
204
+
<Text as="div" size="2" color="gray">
205
205
+
Category: {pet?.category?.name ?? 'N/A'}
206
206
+
</Text>
207
207
+
</Box>
208
208
+
</Flex>
209
209
+
</Card>
210
210
+
</Box>
211
211
+
<Button onClick={onGetPetById}>
212
212
+
<DownloadIcon /> Get Random Pet
213
213
+
</Button>
214
214
+
</Flex>
215
215
+
<Section size="1" />
216
216
+
<Flex direction="column" gapY="2">
217
217
+
<Form.Root
218
218
+
className="w-[260px]"
219
219
+
onSubmit={(event) => {
220
220
+
event.preventDefault();
221
221
+
onAddPet(new FormData(event.currentTarget));
222
222
+
}}
223
223
+
>
224
224
+
<Form.Field className="grid mb-[10px]" name="email">
225
225
+
<div className="flex items-baseline justify-between">
226
226
+
<Form.Label className="text-[15px] font-medium leading-[35px] text-white">
227
227
+
Name
228
228
+
</Form.Label>
229
229
+
{isRequiredNameError && (
230
230
+
<Form.Message className="text-[13px] text-white opacity-[0.8]">
231
231
+
Please enter a name
232
232
+
</Form.Message>
233
233
+
)}
234
234
+
</div>
235
235
+
<Form.Control asChild>
236
236
+
<TextField.Root placeholder="Kitty" name="name" type="text" />
237
237
+
</Form.Control>
238
238
+
</Form.Field>
239
239
+
<Form.Field className="grid mb-[10px]" name="question">
240
240
+
<div className="flex items-baseline justify-between">
241
241
+
<Form.Label className="text-[15px] font-medium leading-[35px] text-white">
242
242
+
Category
243
243
+
</Form.Label>
244
244
+
<Form.Message
245
245
+
className="text-[13px] text-white opacity-[0.8]"
246
246
+
match="valueMissing"
247
247
+
>
248
248
+
Please enter a category
249
249
+
</Form.Message>
250
250
+
</div>
251
251
+
<Form.Control asChild>
252
252
+
<TextField.Root
253
253
+
placeholder="Cats"
254
254
+
name="category"
255
255
+
type="text"
256
256
+
required
257
257
+
/>
258
258
+
</Form.Control>
259
259
+
</Form.Field>
260
260
+
<Flex gapX="2">
261
261
+
<Form.Submit asChild>
262
262
+
<Button type="submit">
263
263
+
<PlusIcon /> Add Pet
264
264
+
</Button>
265
265
+
</Form.Submit>
266
266
+
<Button onClick={onUpdatePet} type="button">
267
267
+
<ReloadIcon /> Update Pet
268
268
+
</Button>
269
269
+
</Flex>
270
270
+
</Form.Root>
271
271
+
</Flex>
272
272
+
<Section size="1" />
273
273
+
</Container>
274
274
+
</Box>
275
275
+
);
276
276
+
}
277
277
+
278
278
+
export default App;
+503
examples/openapi-ts-tanstack-react-query/src/client/@tanstack/react-query.gen.ts
···
1
1
+
// This file is auto-generated by @hey-api/openapi-ts
2
2
+
3
3
+
import type { Options } from '@hey-api/client-fetch';
4
4
+
import {
5
5
+
type DefaultError,
6
6
+
queryOptions,
7
7
+
type UseMutationOptions,
8
8
+
} from '@tanstack/react-query';
9
9
+
10
10
+
import {
11
11
+
addPet,
12
12
+
createUser,
13
13
+
createUsersWithListInput,
14
14
+
deleteOrder,
15
15
+
deletePet,
16
16
+
deleteUser,
17
17
+
findPetsByStatus,
18
18
+
findPetsByTags,
19
19
+
getInventory,
20
20
+
getOrderById,
21
21
+
getPetById,
22
22
+
getUserByName,
23
23
+
loginUser,
24
24
+
logoutUser,
25
25
+
placeOrder,
26
26
+
updatePet,
27
27
+
updatePetWithForm,
28
28
+
updateUser,
29
29
+
uploadFile,
30
30
+
} from '../services.gen';
31
31
+
import type {
32
32
+
AddPetData,
33
33
+
AddPetError,
34
34
+
AddPetResponse,
35
35
+
CreateUserData,
36
36
+
CreateUserError,
37
37
+
CreateUserResponse,
38
38
+
CreateUsersWithListInputData,
39
39
+
CreateUsersWithListInputError,
40
40
+
CreateUsersWithListInputResponse,
41
41
+
DeleteOrderData,
42
42
+
DeletePetData,
43
43
+
DeleteUserData,
44
44
+
FindPetsByStatusData,
45
45
+
FindPetsByTagsData,
46
46
+
GetOrderByIdData,
47
47
+
GetPetByIdData,
48
48
+
GetUserByNameData,
49
49
+
LoginUserData,
50
50
+
PlaceOrderData,
51
51
+
PlaceOrderError,
52
52
+
PlaceOrderResponse,
53
53
+
UpdatePetData,
54
54
+
UpdatePetError,
55
55
+
UpdatePetResponse,
56
56
+
UpdatePetWithFormData,
57
57
+
UpdateUserData,
58
58
+
UpdateUserError,
59
59
+
UpdateUserResponse,
60
60
+
UploadFileData,
61
61
+
UploadFileError,
62
62
+
UploadFileResponse,
63
63
+
} from '../types.gen';
64
64
+
65
65
+
type QueryKey<TOptions extends Options> = [
66
66
+
{
67
67
+
infinite?: boolean;
68
68
+
params: Pick<TOptions, 'body' | 'headers' | 'path' | 'query'>;
69
69
+
scope: string;
70
70
+
},
71
71
+
];
72
72
+
73
73
+
const createQueryKeyParams = <TOptions extends Options>(
74
74
+
options?: TOptions,
75
75
+
): QueryKey<TOptions>[0]['params'] => {
76
76
+
const params: QueryKey<TOptions>[0]['params'] =
77
77
+
{} as QueryKey<TOptions>[0]['params'];
78
78
+
if (options?.body) {
79
79
+
params.body = options.body;
80
80
+
}
81
81
+
if (options?.headers) {
82
82
+
params.headers = options.headers;
83
83
+
}
84
84
+
if (options?.path) {
85
85
+
params.path = options.path;
86
86
+
}
87
87
+
if (options?.query) {
88
88
+
params.query = options.query;
89
89
+
}
90
90
+
return params;
91
91
+
};
92
92
+
93
93
+
export const addPetOptions = (options: Options<AddPetData>) =>
94
94
+
queryOptions({
95
95
+
queryFn: async ({ queryKey }) => {
96
96
+
const { data } = await addPet({
97
97
+
...options,
98
98
+
...queryKey[0].params,
99
99
+
throwOnError: true,
100
100
+
});
101
101
+
return data;
102
102
+
},
103
103
+
queryKey: [
104
104
+
{
105
105
+
params: createQueryKeyParams(options),
106
106
+
scope: 'addPet',
107
107
+
},
108
108
+
],
109
109
+
});
110
110
+
111
111
+
export const addPetMutation: UseMutationOptions<
112
112
+
AddPetResponse,
113
113
+
AddPetError,
114
114
+
Options<AddPetData>
115
115
+
> = {
116
116
+
mutationFn: async (options) => {
117
117
+
const { data } = await addPet({
118
118
+
...options,
119
119
+
throwOnError: true,
120
120
+
});
121
121
+
return data;
122
122
+
},
123
123
+
};
124
124
+
125
125
+
export const updatePetMutation: UseMutationOptions<
126
126
+
UpdatePetResponse,
127
127
+
UpdatePetError,
128
128
+
Options<UpdatePetData>
129
129
+
> = {
130
130
+
mutationFn: async (options) => {
131
131
+
const { data } = await updatePet({
132
132
+
...options,
133
133
+
throwOnError: true,
134
134
+
});
135
135
+
return data;
136
136
+
},
137
137
+
};
138
138
+
139
139
+
export const findPetsByStatusOptions = (
140
140
+
options?: Options<FindPetsByStatusData>,
141
141
+
) =>
142
142
+
queryOptions({
143
143
+
queryFn: async ({ queryKey }) => {
144
144
+
const { data } = await findPetsByStatus({
145
145
+
...options,
146
146
+
...queryKey[0].params,
147
147
+
throwOnError: true,
148
148
+
});
149
149
+
return data;
150
150
+
},
151
151
+
queryKey: [
152
152
+
{
153
153
+
params: createQueryKeyParams(options),
154
154
+
scope: 'findPetsByStatus',
155
155
+
},
156
156
+
],
157
157
+
});
158
158
+
159
159
+
export const findPetsByTagsOptions = (options?: Options<FindPetsByTagsData>) =>
160
160
+
queryOptions({
161
161
+
queryFn: async ({ queryKey }) => {
162
162
+
const { data } = await findPetsByTags({
163
163
+
...options,
164
164
+
...queryKey[0].params,
165
165
+
throwOnError: true,
166
166
+
});
167
167
+
return data;
168
168
+
},
169
169
+
queryKey: [
170
170
+
{
171
171
+
params: createQueryKeyParams(options),
172
172
+
scope: 'findPetsByTags',
173
173
+
},
174
174
+
],
175
175
+
});
176
176
+
177
177
+
export const getPetByIdOptions = (options: Options<GetPetByIdData>) =>
178
178
+
queryOptions({
179
179
+
queryFn: async ({ queryKey }) => {
180
180
+
const { data } = await getPetById({
181
181
+
...options,
182
182
+
...queryKey[0].params,
183
183
+
throwOnError: true,
184
184
+
});
185
185
+
return data;
186
186
+
},
187
187
+
queryKey: [
188
188
+
{
189
189
+
params: createQueryKeyParams(options),
190
190
+
scope: 'getPetById',
191
191
+
},
192
192
+
],
193
193
+
});
194
194
+
195
195
+
export const updatePetWithFormOptions = (
196
196
+
options: Options<UpdatePetWithFormData>,
197
197
+
) =>
198
198
+
queryOptions({
199
199
+
queryFn: async ({ queryKey }) => {
200
200
+
const { data } = await updatePetWithForm({
201
201
+
...options,
202
202
+
...queryKey[0].params,
203
203
+
throwOnError: true,
204
204
+
});
205
205
+
return data;
206
206
+
},
207
207
+
queryKey: [
208
208
+
{
209
209
+
params: createQueryKeyParams(options),
210
210
+
scope: 'updatePetWithForm',
211
211
+
},
212
212
+
],
213
213
+
});
214
214
+
215
215
+
export const updatePetWithFormMutation: UseMutationOptions<
216
216
+
void,
217
217
+
DefaultError,
218
218
+
Options<UpdatePetWithFormData>
219
219
+
> = {
220
220
+
mutationFn: async (options) => {
221
221
+
const { data } = await updatePetWithForm({
222
222
+
...options,
223
223
+
throwOnError: true,
224
224
+
});
225
225
+
return data;
226
226
+
},
227
227
+
};
228
228
+
229
229
+
export const deletePetMutation: UseMutationOptions<
230
230
+
void,
231
231
+
DefaultError,
232
232
+
Options<DeletePetData>
233
233
+
> = {
234
234
+
mutationFn: async (options) => {
235
235
+
const { data } = await deletePet({
236
236
+
...options,
237
237
+
throwOnError: true,
238
238
+
});
239
239
+
return data;
240
240
+
},
241
241
+
};
242
242
+
243
243
+
export const uploadFileOptions = (options: Options<UploadFileData>) =>
244
244
+
queryOptions({
245
245
+
queryFn: async ({ queryKey }) => {
246
246
+
const { data } = await uploadFile({
247
247
+
...options,
248
248
+
...queryKey[0].params,
249
249
+
throwOnError: true,
250
250
+
});
251
251
+
return data;
252
252
+
},
253
253
+
queryKey: [
254
254
+
{
255
255
+
params: createQueryKeyParams(options),
256
256
+
scope: 'uploadFile',
257
257
+
},
258
258
+
],
259
259
+
});
260
260
+
261
261
+
export const uploadFileMutation: UseMutationOptions<
262
262
+
UploadFileResponse,
263
263
+
UploadFileError,
264
264
+
Options<UploadFileData>
265
265
+
> = {
266
266
+
mutationFn: async (options) => {
267
267
+
const { data } = await uploadFile({
268
268
+
...options,
269
269
+
throwOnError: true,
270
270
+
});
271
271
+
return data;
272
272
+
},
273
273
+
};
274
274
+
275
275
+
export const getInventoryOptions = (options?: Options) =>
276
276
+
queryOptions({
277
277
+
queryFn: async ({ queryKey }) => {
278
278
+
const { data } = await getInventory({
279
279
+
...options,
280
280
+
...queryKey[0].params,
281
281
+
throwOnError: true,
282
282
+
});
283
283
+
return data;
284
284
+
},
285
285
+
queryKey: [
286
286
+
{
287
287
+
params: createQueryKeyParams(options),
288
288
+
scope: 'getInventory',
289
289
+
},
290
290
+
],
291
291
+
});
292
292
+
293
293
+
export const placeOrderOptions = (options?: Options<PlaceOrderData>) =>
294
294
+
queryOptions({
295
295
+
queryFn: async ({ queryKey }) => {
296
296
+
const { data } = await placeOrder({
297
297
+
...options,
298
298
+
...queryKey[0].params,
299
299
+
throwOnError: true,
300
300
+
});
301
301
+
return data;
302
302
+
},
303
303
+
queryKey: [
304
304
+
{
305
305
+
params: createQueryKeyParams(options),
306
306
+
scope: 'placeOrder',
307
307
+
},
308
308
+
],
309
309
+
});
310
310
+
311
311
+
export const placeOrderMutation: UseMutationOptions<
312
312
+
PlaceOrderResponse,
313
313
+
PlaceOrderError,
314
314
+
Options<PlaceOrderData>
315
315
+
> = {
316
316
+
mutationFn: async (options) => {
317
317
+
const { data } = await placeOrder({
318
318
+
...options,
319
319
+
throwOnError: true,
320
320
+
});
321
321
+
return data;
322
322
+
},
323
323
+
};
324
324
+
325
325
+
export const getOrderByIdOptions = (options: Options<GetOrderByIdData>) =>
326
326
+
queryOptions({
327
327
+
queryFn: async ({ queryKey }) => {
328
328
+
const { data } = await getOrderById({
329
329
+
...options,
330
330
+
...queryKey[0].params,
331
331
+
throwOnError: true,
332
332
+
});
333
333
+
return data;
334
334
+
},
335
335
+
queryKey: [
336
336
+
{
337
337
+
params: createQueryKeyParams(options),
338
338
+
scope: 'getOrderById',
339
339
+
},
340
340
+
],
341
341
+
});
342
342
+
343
343
+
export const deleteOrderMutation: UseMutationOptions<
344
344
+
void,
345
345
+
DefaultError,
346
346
+
Options<DeleteOrderData>
347
347
+
> = {
348
348
+
mutationFn: async (options) => {
349
349
+
const { data } = await deleteOrder({
350
350
+
...options,
351
351
+
throwOnError: true,
352
352
+
});
353
353
+
return data;
354
354
+
},
355
355
+
};
356
356
+
357
357
+
export const createUserOptions = (options?: Options<CreateUserData>) =>
358
358
+
queryOptions({
359
359
+
queryFn: async ({ queryKey }) => {
360
360
+
const { data } = await createUser({
361
361
+
...options,
362
362
+
...queryKey[0].params,
363
363
+
throwOnError: true,
364
364
+
});
365
365
+
return data;
366
366
+
},
367
367
+
queryKey: [
368
368
+
{
369
369
+
params: createQueryKeyParams(options),
370
370
+
scope: 'createUser',
371
371
+
},
372
372
+
],
373
373
+
});
374
374
+
375
375
+
export const createUserMutation: UseMutationOptions<
376
376
+
CreateUserResponse,
377
377
+
CreateUserError,
378
378
+
Options<CreateUserData>
379
379
+
> = {
380
380
+
mutationFn: async (options) => {
381
381
+
const { data } = await createUser({
382
382
+
...options,
383
383
+
throwOnError: true,
384
384
+
});
385
385
+
return data;
386
386
+
},
387
387
+
};
388
388
+
389
389
+
export const createUsersWithListInputOptions = (
390
390
+
options?: Options<CreateUsersWithListInputData>,
391
391
+
) =>
392
392
+
queryOptions({
393
393
+
queryFn: async ({ queryKey }) => {
394
394
+
const { data } = await createUsersWithListInput({
395
395
+
...options,
396
396
+
...queryKey[0].params,
397
397
+
throwOnError: true,
398
398
+
});
399
399
+
return data;
400
400
+
},
401
401
+
queryKey: [
402
402
+
{
403
403
+
params: createQueryKeyParams(options),
404
404
+
scope: 'createUsersWithListInput',
405
405
+
},
406
406
+
],
407
407
+
});
408
408
+
409
409
+
export const createUsersWithListInputMutation: UseMutationOptions<
410
410
+
CreateUsersWithListInputResponse,
411
411
+
CreateUsersWithListInputError,
412
412
+
Options<CreateUsersWithListInputData>
413
413
+
> = {
414
414
+
mutationFn: async (options) => {
415
415
+
const { data } = await createUsersWithListInput({
416
416
+
...options,
417
417
+
throwOnError: true,
418
418
+
});
419
419
+
return data;
420
420
+
},
421
421
+
};
422
422
+
423
423
+
export const loginUserOptions = (options?: Options<LoginUserData>) =>
424
424
+
queryOptions({
425
425
+
queryFn: async ({ queryKey }) => {
426
426
+
const { data } = await loginUser({
427
427
+
...options,
428
428
+
...queryKey[0].params,
429
429
+
throwOnError: true,
430
430
+
});
431
431
+
return data;
432
432
+
},
433
433
+
queryKey: [
434
434
+
{
435
435
+
params: createQueryKeyParams(options),
436
436
+
scope: 'loginUser',
437
437
+
},
438
438
+
],
439
439
+
});
440
440
+
441
441
+
export const logoutUserOptions = (options?: Options) =>
442
442
+
queryOptions({
443
443
+
queryFn: async ({ queryKey }) => {
444
444
+
const { data } = await logoutUser({
445
445
+
...options,
446
446
+
...queryKey[0].params,
447
447
+
throwOnError: true,
448
448
+
});
449
449
+
return data;
450
450
+
},
451
451
+
queryKey: [
452
452
+
{
453
453
+
params: createQueryKeyParams(options),
454
454
+
scope: 'logoutUser',
455
455
+
},
456
456
+
],
457
457
+
});
458
458
+
459
459
+
export const getUserByNameOptions = (options: Options<GetUserByNameData>) =>
460
460
+
queryOptions({
461
461
+
queryFn: async ({ queryKey }) => {
462
462
+
const { data } = await getUserByName({
463
463
+
...options,
464
464
+
...queryKey[0].params,
465
465
+
throwOnError: true,
466
466
+
});
467
467
+
return data;
468
468
+
},
469
469
+
queryKey: [
470
470
+
{
471
471
+
params: createQueryKeyParams(options),
472
472
+
scope: 'getUserByName',
473
473
+
},
474
474
+
],
475
475
+
});
476
476
+
477
477
+
export const updateUserMutation: UseMutationOptions<
478
478
+
UpdateUserResponse,
479
479
+
UpdateUserError,
480
480
+
Options<UpdateUserData>
481
481
+
> = {
482
482
+
mutationFn: async (options) => {
483
483
+
const { data } = await updateUser({
484
484
+
...options,
485
485
+
throwOnError: true,
486
486
+
});
487
487
+
return data;
488
488
+
},
489
489
+
};
490
490
+
491
491
+
export const deleteUserMutation: UseMutationOptions<
492
492
+
void,
493
493
+
DefaultError,
494
494
+
Options<DeleteUserData>
495
495
+
> = {
496
496
+
mutationFn: async (options) => {
497
497
+
const { data } = await deleteUser({
498
498
+
...options,
499
499
+
throwOnError: true,
500
500
+
});
501
501
+
return data;
502
502
+
},
503
503
+
};
+4
examples/openapi-ts-tanstack-react-query/src/client/index.ts
···
1
1
+
// This file is auto-generated by @hey-api/openapi-ts
2
2
+
export * from './schemas.gen';
3
3
+
export * from './services.gen';
4
4
+
export * from './types.gen';
+244
examples/openapi-ts-tanstack-react-query/src/client/schemas.gen.ts
···
1
1
+
// This file is auto-generated by @hey-api/openapi-ts
2
2
+
3
3
+
export const $Order = {
4
4
+
properties: {
5
5
+
complete: {
6
6
+
type: 'boolean',
7
7
+
},
8
8
+
id: {
9
9
+
example: 10,
10
10
+
format: 'int64',
11
11
+
type: 'integer',
12
12
+
},
13
13
+
petId: {
14
14
+
example: 198772,
15
15
+
format: 'int64',
16
16
+
type: 'integer',
17
17
+
},
18
18
+
quantity: {
19
19
+
example: 7,
20
20
+
format: 'int32',
21
21
+
type: 'integer',
22
22
+
},
23
23
+
shipDate: {
24
24
+
format: 'date-time',
25
25
+
type: 'string',
26
26
+
},
27
27
+
status: {
28
28
+
description: 'Order Status',
29
29
+
enum: ['placed', 'approved', 'delivered'],
30
30
+
example: 'approved',
31
31
+
type: 'string',
32
32
+
},
33
33
+
},
34
34
+
type: 'object',
35
35
+
'x-swagger-router-model': 'io.swagger.petstore.model.Order',
36
36
+
xml: {
37
37
+
name: 'order',
38
38
+
},
39
39
+
} as const;
40
40
+
41
41
+
export const $Customer = {
42
42
+
properties: {
43
43
+
address: {
44
44
+
items: {
45
45
+
$ref: '#/components/schemas/Address',
46
46
+
},
47
47
+
type: 'array',
48
48
+
xml: {
49
49
+
name: 'addresses',
50
50
+
wrapped: true,
51
51
+
},
52
52
+
},
53
53
+
id: {
54
54
+
example: 100000,
55
55
+
format: 'int64',
56
56
+
type: 'integer',
57
57
+
},
58
58
+
username: {
59
59
+
example: 'fehguy',
60
60
+
type: 'string',
61
61
+
},
62
62
+
},
63
63
+
type: 'object',
64
64
+
xml: {
65
65
+
name: 'customer',
66
66
+
},
67
67
+
} as const;
68
68
+
69
69
+
export const $Address = {
70
70
+
properties: {
71
71
+
city: {
72
72
+
example: 'Palo Alto',
73
73
+
type: 'string',
74
74
+
},
75
75
+
state: {
76
76
+
example: 'CA',
77
77
+
type: 'string',
78
78
+
},
79
79
+
street: {
80
80
+
example: '437 Lytton',
81
81
+
type: 'string',
82
82
+
},
83
83
+
zip: {
84
84
+
example: 94301,
85
85
+
type: 'string',
86
86
+
},
87
87
+
},
88
88
+
type: 'object',
89
89
+
xml: {
90
90
+
name: 'address',
91
91
+
},
92
92
+
} as const;
93
93
+
94
94
+
export const $Category = {
95
95
+
properties: {
96
96
+
id: {
97
97
+
example: 1,
98
98
+
format: 'int64',
99
99
+
type: 'integer',
100
100
+
},
101
101
+
name: {
102
102
+
example: 'Dogs',
103
103
+
type: 'string',
104
104
+
},
105
105
+
},
106
106
+
type: 'object',
107
107
+
'x-swagger-router-model': 'io.swagger.petstore.model.Category',
108
108
+
xml: {
109
109
+
name: 'category',
110
110
+
},
111
111
+
} as const;
112
112
+
113
113
+
export const $User = {
114
114
+
properties: {
115
115
+
email: {
116
116
+
example: 'john@email.com',
117
117
+
type: 'string',
118
118
+
},
119
119
+
firstName: {
120
120
+
example: 'John',
121
121
+
type: 'string',
122
122
+
},
123
123
+
id: {
124
124
+
example: 10,
125
125
+
format: 'int64',
126
126
+
type: 'integer',
127
127
+
},
128
128
+
lastName: {
129
129
+
example: 'James',
130
130
+
type: 'string',
131
131
+
},
132
132
+
password: {
133
133
+
example: 12345,
134
134
+
type: 'string',
135
135
+
},
136
136
+
phone: {
137
137
+
example: 12345,
138
138
+
type: 'string',
139
139
+
},
140
140
+
userStatus: {
141
141
+
description: 'User Status',
142
142
+
example: 1,
143
143
+
format: 'int32',
144
144
+
type: 'integer',
145
145
+
},
146
146
+
username: {
147
147
+
example: 'theUser',
148
148
+
type: 'string',
149
149
+
},
150
150
+
},
151
151
+
type: 'object',
152
152
+
'x-swagger-router-model': 'io.swagger.petstore.model.User',
153
153
+
xml: {
154
154
+
name: 'user',
155
155
+
},
156
156
+
} as const;
157
157
+
158
158
+
export const $Tag = {
159
159
+
properties: {
160
160
+
id: {
161
161
+
format: 'int64',
162
162
+
type: 'integer',
163
163
+
},
164
164
+
name: {
165
165
+
type: 'string',
166
166
+
},
167
167
+
},
168
168
+
type: 'object',
169
169
+
'x-swagger-router-model': 'io.swagger.petstore.model.Tag',
170
170
+
xml: {
171
171
+
name: 'tag',
172
172
+
},
173
173
+
} as const;
174
174
+
175
175
+
export const $Pet = {
176
176
+
properties: {
177
177
+
category: {
178
178
+
$ref: '#/components/schemas/Category',
179
179
+
},
180
180
+
id: {
181
181
+
example: 10,
182
182
+
format: 'int64',
183
183
+
type: 'integer',
184
184
+
},
185
185
+
name: {
186
186
+
example: 'doggie',
187
187
+
type: 'string',
188
188
+
},
189
189
+
photoUrls: {
190
190
+
items: {
191
191
+
type: 'string',
192
192
+
xml: {
193
193
+
name: 'photoUrl',
194
194
+
},
195
195
+
},
196
196
+
type: 'array',
197
197
+
xml: {
198
198
+
wrapped: true,
199
199
+
},
200
200
+
},
201
201
+
status: {
202
202
+
description: 'pet status in the store',
203
203
+
enum: ['available', 'pending', 'sold'],
204
204
+
type: 'string',
205
205
+
},
206
206
+
tags: {
207
207
+
items: {
208
208
+
$ref: '#/components/schemas/Tag',
209
209
+
xml: {
210
210
+
name: 'tag',
211
211
+
},
212
212
+
},
213
213
+
type: 'array',
214
214
+
xml: {
215
215
+
wrapped: true,
216
216
+
},
217
217
+
},
218
218
+
},
219
219
+
required: ['name', 'photoUrls'],
220
220
+
type: 'object',
221
221
+
'x-swagger-router-model': 'io.swagger.petstore.model.Pet',
222
222
+
xml: {
223
223
+
name: 'pet',
224
224
+
},
225
225
+
} as const;
226
226
+
227
227
+
export const $ApiResponse = {
228
228
+
properties: {
229
229
+
code: {
230
230
+
format: 'int32',
231
231
+
type: 'integer',
232
232
+
},
233
233
+
message: {
234
234
+
type: 'string',
235
235
+
},
236
236
+
type: {
237
237
+
type: 'string',
238
238
+
},
239
239
+
},
240
240
+
type: 'object',
241
241
+
xml: {
242
242
+
name: '##default',
243
243
+
},
244
244
+
} as const;
+337
examples/openapi-ts-tanstack-react-query/src/client/services.gen.ts
···
1
1
+
// This file is auto-generated by @hey-api/openapi-ts
2
2
+
3
3
+
import {
4
4
+
createClient,
5
5
+
createConfig,
6
6
+
type Options,
7
7
+
} from '@hey-api/client-fetch';
8
8
+
9
9
+
import type {
10
10
+
AddPetData,
11
11
+
AddPetError,
12
12
+
AddPetResponse,
13
13
+
CreateUserData,
14
14
+
CreateUserError,
15
15
+
CreateUserResponse,
16
16
+
CreateUsersWithListInputData,
17
17
+
CreateUsersWithListInputError,
18
18
+
CreateUsersWithListInputResponse,
19
19
+
DeleteOrderData,
20
20
+
DeletePetData,
21
21
+
DeleteUserData,
22
22
+
FindPetsByStatusData,
23
23
+
FindPetsByStatusError,
24
24
+
FindPetsByStatusResponse,
25
25
+
FindPetsByTagsData,
26
26
+
FindPetsByTagsError,
27
27
+
FindPetsByTagsResponse,
28
28
+
GetInventoryError,
29
29
+
GetInventoryResponse,
30
30
+
GetOrderByIdData,
31
31
+
GetOrderByIdError,
32
32
+
GetOrderByIdResponse,
33
33
+
GetPetByIdData,
34
34
+
GetPetByIdError,
35
35
+
GetPetByIdResponse,
36
36
+
GetUserByNameData,
37
37
+
GetUserByNameError,
38
38
+
GetUserByNameResponse,
39
39
+
LoginUserData,
40
40
+
LoginUserError,
41
41
+
LoginUserResponse,
42
42
+
LogoutUserError,
43
43
+
LogoutUserResponse,
44
44
+
PlaceOrderData,
45
45
+
PlaceOrderError,
46
46
+
PlaceOrderResponse,
47
47
+
UpdatePetData,
48
48
+
UpdatePetError,
49
49
+
UpdatePetResponse,
50
50
+
UpdatePetWithFormData,
51
51
+
UpdateUserData,
52
52
+
UpdateUserError,
53
53
+
UpdateUserResponse,
54
54
+
UploadFileData,
55
55
+
UploadFileError,
56
56
+
UploadFileResponse,
57
57
+
} from './types.gen';
58
58
+
59
59
+
export const client = createClient(createConfig());
60
60
+
61
61
+
/**
62
62
+
* Add a new pet to the store
63
63
+
* Add a new pet to the store
64
64
+
*/
65
65
+
export const addPet = <ThrowOnError extends boolean = false>(
66
66
+
options: Options<AddPetData, ThrowOnError>,
67
67
+
) =>
68
68
+
(options?.client ?? client).post<AddPetResponse, AddPetError, ThrowOnError>({
69
69
+
...options,
70
70
+
url: '/pet',
71
71
+
});
72
72
+
73
73
+
/**
74
74
+
* Update an existing pet
75
75
+
* Update an existing pet by Id
76
76
+
*/
77
77
+
export const updatePet = <ThrowOnError extends boolean = false>(
78
78
+
options: Options<UpdatePetData, ThrowOnError>,
79
79
+
) =>
80
80
+
(options?.client ?? client).put<
81
81
+
UpdatePetResponse,
82
82
+
UpdatePetError,
83
83
+
ThrowOnError
84
84
+
>({
85
85
+
...options,
86
86
+
url: '/pet',
87
87
+
});
88
88
+
89
89
+
/**
90
90
+
* Finds Pets by status
91
91
+
* Multiple status values can be provided with comma separated strings
92
92
+
*/
93
93
+
export const findPetsByStatus = <ThrowOnError extends boolean = false>(
94
94
+
options?: Options<FindPetsByStatusData, ThrowOnError>,
95
95
+
) =>
96
96
+
(options?.client ?? client).get<
97
97
+
FindPetsByStatusResponse,
98
98
+
FindPetsByStatusError,
99
99
+
ThrowOnError
100
100
+
>({
101
101
+
...options,
102
102
+
url: '/pet/findByStatus',
103
103
+
});
104
104
+
105
105
+
/**
106
106
+
* Finds Pets by tags
107
107
+
* Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing.
108
108
+
*/
109
109
+
export const findPetsByTags = <ThrowOnError extends boolean = false>(
110
110
+
options?: Options<FindPetsByTagsData, ThrowOnError>,
111
111
+
) =>
112
112
+
(options?.client ?? client).get<
113
113
+
FindPetsByTagsResponse,
114
114
+
FindPetsByTagsError,
115
115
+
ThrowOnError
116
116
+
>({
117
117
+
...options,
118
118
+
url: '/pet/findByTags',
119
119
+
});
120
120
+
121
121
+
/**
122
122
+
* Find pet by ID
123
123
+
* Returns a single pet
124
124
+
*/
125
125
+
export const getPetById = <ThrowOnError extends boolean = false>(
126
126
+
options: Options<GetPetByIdData, ThrowOnError>,
127
127
+
) =>
128
128
+
(options?.client ?? client).get<
129
129
+
GetPetByIdResponse,
130
130
+
GetPetByIdError,
131
131
+
ThrowOnError
132
132
+
>({
133
133
+
...options,
134
134
+
url: '/pet/{petId}',
135
135
+
});
136
136
+
137
137
+
/**
138
138
+
* Updates a pet in the store with form data
139
139
+
*/
140
140
+
export const updatePetWithForm = <ThrowOnError extends boolean = false>(
141
141
+
options: Options<UpdatePetWithFormData, ThrowOnError>,
142
142
+
) =>
143
143
+
(options?.client ?? client).post<void, unknown, ThrowOnError>({
144
144
+
...options,
145
145
+
url: '/pet/{petId}',
146
146
+
});
147
147
+
148
148
+
/**
149
149
+
* Deletes a pet
150
150
+
*/
151
151
+
export const deletePet = <ThrowOnError extends boolean = false>(
152
152
+
options: Options<DeletePetData, ThrowOnError>,
153
153
+
) =>
154
154
+
(options?.client ?? client).delete<void, unknown, ThrowOnError>({
155
155
+
...options,
156
156
+
url: '/pet/{petId}',
157
157
+
});
158
158
+
159
159
+
/**
160
160
+
* uploads an image
161
161
+
*/
162
162
+
export const uploadFile = <ThrowOnError extends boolean = false>(
163
163
+
options: Options<UploadFileData, ThrowOnError>,
164
164
+
) =>
165
165
+
(options?.client ?? client).post<
166
166
+
UploadFileResponse,
167
167
+
UploadFileError,
168
168
+
ThrowOnError
169
169
+
>({
170
170
+
...options,
171
171
+
url: '/pet/{petId}/uploadImage',
172
172
+
});
173
173
+
174
174
+
/**
175
175
+
* Returns pet inventories by status
176
176
+
* Returns a map of status codes to quantities
177
177
+
*/
178
178
+
export const getInventory = <ThrowOnError extends boolean = false>(
179
179
+
options?: Options<unknown, ThrowOnError>,
180
180
+
) =>
181
181
+
(options?.client ?? client).get<
182
182
+
GetInventoryResponse,
183
183
+
GetInventoryError,
184
184
+
ThrowOnError
185
185
+
>({
186
186
+
...options,
187
187
+
url: '/store/inventory',
188
188
+
});
189
189
+
190
190
+
/**
191
191
+
* Place an order for a pet
192
192
+
* Place a new order in the store
193
193
+
*/
194
194
+
export const placeOrder = <ThrowOnError extends boolean = false>(
195
195
+
options?: Options<PlaceOrderData, ThrowOnError>,
196
196
+
) =>
197
197
+
(options?.client ?? client).post<
198
198
+
PlaceOrderResponse,
199
199
+
PlaceOrderError,
200
200
+
ThrowOnError
201
201
+
>({
202
202
+
...options,
203
203
+
url: '/store/order',
204
204
+
});
205
205
+
206
206
+
/**
207
207
+
* Find purchase order by ID
208
208
+
* For valid response try integer IDs with value <= 5 or > 10. Other values will generate exceptions.
209
209
+
*/
210
210
+
export const getOrderById = <ThrowOnError extends boolean = false>(
211
211
+
options: Options<GetOrderByIdData, ThrowOnError>,
212
212
+
) =>
213
213
+
(options?.client ?? client).get<
214
214
+
GetOrderByIdResponse,
215
215
+
GetOrderByIdError,
216
216
+
ThrowOnError
217
217
+
>({
218
218
+
...options,
219
219
+
url: '/store/order/{orderId}',
220
220
+
});
221
221
+
222
222
+
/**
223
223
+
* Delete purchase order by ID
224
224
+
* For valid response try integer IDs with value < 1000. Anything above 1000 or nonintegers will generate API errors
225
225
+
*/
226
226
+
export const deleteOrder = <ThrowOnError extends boolean = false>(
227
227
+
options: Options<DeleteOrderData, ThrowOnError>,
228
228
+
) =>
229
229
+
(options?.client ?? client).delete<void, unknown, ThrowOnError>({
230
230
+
...options,
231
231
+
url: '/store/order/{orderId}',
232
232
+
});
233
233
+
234
234
+
/**
235
235
+
* Create user
236
236
+
* This can only be done by the logged in user.
237
237
+
*/
238
238
+
export const createUser = <ThrowOnError extends boolean = false>(
239
239
+
options?: Options<CreateUserData, ThrowOnError>,
240
240
+
) =>
241
241
+
(options?.client ?? client).post<
242
242
+
CreateUserResponse,
243
243
+
CreateUserError,
244
244
+
ThrowOnError
245
245
+
>({
246
246
+
...options,
247
247
+
url: '/user',
248
248
+
});
249
249
+
250
250
+
/**
251
251
+
* Creates list of users with given input array
252
252
+
* Creates list of users with given input array
253
253
+
*/
254
254
+
export const createUsersWithListInput = <ThrowOnError extends boolean = false>(
255
255
+
options?: Options<CreateUsersWithListInputData, ThrowOnError>,
256
256
+
) =>
257
257
+
(options?.client ?? client).post<
258
258
+
CreateUsersWithListInputResponse,
259
259
+
CreateUsersWithListInputError,
260
260
+
ThrowOnError
261
261
+
>({
262
262
+
...options,
263
263
+
url: '/user/createWithList',
264
264
+
});
265
265
+
266
266
+
/**
267
267
+
* Logs user into the system
268
268
+
*/
269
269
+
export const loginUser = <ThrowOnError extends boolean = false>(
270
270
+
options?: Options<LoginUserData, ThrowOnError>,
271
271
+
) =>
272
272
+
(options?.client ?? client).get<
273
273
+
LoginUserResponse,
274
274
+
LoginUserError,
275
275
+
ThrowOnError
276
276
+
>({
277
277
+
...options,
278
278
+
url: '/user/login',
279
279
+
});
280
280
+
281
281
+
/**
282
282
+
* Logs out current logged in user session
283
283
+
*/
284
284
+
export const logoutUser = <ThrowOnError extends boolean = false>(
285
285
+
options?: Options<unknown, ThrowOnError>,
286
286
+
) =>
287
287
+
(options?.client ?? client).get<
288
288
+
LogoutUserResponse,
289
289
+
LogoutUserError,
290
290
+
ThrowOnError
291
291
+
>({
292
292
+
...options,
293
293
+
url: '/user/logout',
294
294
+
});
295
295
+
296
296
+
/**
297
297
+
* Get user by user name
298
298
+
*/
299
299
+
export const getUserByName = <ThrowOnError extends boolean = false>(
300
300
+
options: Options<GetUserByNameData, ThrowOnError>,
301
301
+
) =>
302
302
+
(options?.client ?? client).get<
303
303
+
GetUserByNameResponse,
304
304
+
GetUserByNameError,
305
305
+
ThrowOnError
306
306
+
>({
307
307
+
...options,
308
308
+
url: '/user/{username}',
309
309
+
});
310
310
+
311
311
+
/**
312
312
+
* Update user
313
313
+
* This can only be done by the logged in user.
314
314
+
*/
315
315
+
export const updateUser = <ThrowOnError extends boolean = false>(
316
316
+
options: Options<UpdateUserData, ThrowOnError>,
317
317
+
) =>
318
318
+
(options?.client ?? client).put<
319
319
+
UpdateUserResponse,
320
320
+
UpdateUserError,
321
321
+
ThrowOnError
322
322
+
>({
323
323
+
...options,
324
324
+
url: '/user/{username}',
325
325
+
});
326
326
+
327
327
+
/**
328
328
+
* Delete user
329
329
+
* This can only be done by the logged in user.
330
330
+
*/
331
331
+
export const deleteUser = <ThrowOnError extends boolean = false>(
332
332
+
options: Options<DeleteUserData, ThrowOnError>,
333
333
+
) =>
334
334
+
(options?.client ?? client).delete<void, unknown, ThrowOnError>({
335
335
+
...options,
336
336
+
url: '/user/{username}',
337
337
+
});
+591
examples/openapi-ts-tanstack-react-query/src/client/types.gen.ts
···
1
1
+
// This file is auto-generated by @hey-api/openapi-ts
2
2
+
3
3
+
export type Order = {
4
4
+
complete?: boolean;
5
5
+
id?: number;
6
6
+
petId?: number;
7
7
+
quantity?: number;
8
8
+
shipDate?: string;
9
9
+
/**
10
10
+
* Order Status
11
11
+
*/
12
12
+
status?: 'placed' | 'approved' | 'delivered';
13
13
+
};
14
14
+
15
15
+
/**
16
16
+
* Order Status
17
17
+
*/
18
18
+
export type status = 'placed' | 'approved' | 'delivered';
19
19
+
20
20
+
/**
21
21
+
* Order Status
22
22
+
*/
23
23
+
export const status = {
24
24
+
APPROVED: 'approved',
25
25
+
DELIVERED: 'delivered',
26
26
+
PLACED: 'placed',
27
27
+
} as const;
28
28
+
29
29
+
export type Customer = {
30
30
+
address?: Array<Address>;
31
31
+
id?: number;
32
32
+
username?: string;
33
33
+
};
34
34
+
35
35
+
export type Address = {
36
36
+
city?: string;
37
37
+
state?: string;
38
38
+
street?: string;
39
39
+
zip?: string;
40
40
+
};
41
41
+
42
42
+
export type Category = {
43
43
+
id?: number;
44
44
+
name?: string;
45
45
+
};
46
46
+
47
47
+
export type User = {
48
48
+
email?: string;
49
49
+
firstName?: string;
50
50
+
id?: number;
51
51
+
lastName?: string;
52
52
+
password?: string;
53
53
+
phone?: string;
54
54
+
/**
55
55
+
* User Status
56
56
+
*/
57
57
+
userStatus?: number;
58
58
+
username?: string;
59
59
+
};
60
60
+
61
61
+
export type Tag = {
62
62
+
id?: number;
63
63
+
name?: string;
64
64
+
};
65
65
+
66
66
+
export type Pet = {
67
67
+
category?: Category;
68
68
+
id?: number;
69
69
+
name: string;
70
70
+
photoUrls: Array<string>;
71
71
+
/**
72
72
+
* pet status in the store
73
73
+
*/
74
74
+
status?: 'available' | 'pending' | 'sold';
75
75
+
tags?: Array<Tag>;
76
76
+
};
77
77
+
78
78
+
/**
79
79
+
* pet status in the store
80
80
+
*/
81
81
+
export type status2 = 'available' | 'pending' | 'sold';
82
82
+
83
83
+
/**
84
84
+
* pet status in the store
85
85
+
*/
86
86
+
export const status2 = {
87
87
+
AVAILABLE: 'available',
88
88
+
PENDING: 'pending',
89
89
+
SOLD: 'sold',
90
90
+
} as const;
91
91
+
92
92
+
export type ApiResponse = {
93
93
+
code?: number;
94
94
+
message?: string;
95
95
+
type?: string;
96
96
+
};
97
97
+
98
98
+
export type AddPetData = {
99
99
+
/**
100
100
+
* Create a new pet in the store
101
101
+
*/
102
102
+
body: Pet;
103
103
+
};
104
104
+
105
105
+
export type AddPetResponse = Pet;
106
106
+
107
107
+
export type AddPetError = unknown;
108
108
+
109
109
+
export type UpdatePetData = {
110
110
+
/**
111
111
+
* Update an existent pet in the store
112
112
+
*/
113
113
+
body: Pet;
114
114
+
};
115
115
+
116
116
+
export type UpdatePetResponse = Pet;
117
117
+
118
118
+
export type UpdatePetError = unknown;
119
119
+
120
120
+
export type FindPetsByStatusData = {
121
121
+
query?: {
122
122
+
/**
123
123
+
* Status values that need to be considered for filter
124
124
+
*/
125
125
+
status?: 'available' | 'pending' | 'sold';
126
126
+
};
127
127
+
};
128
128
+
129
129
+
export type FindPetsByStatusResponse = Array<Pet>;
130
130
+
131
131
+
export type FindPetsByStatusError = unknown;
132
132
+
133
133
+
export type FindPetsByTagsData = {
134
134
+
query?: {
135
135
+
/**
136
136
+
* Tags to filter by
137
137
+
*/
138
138
+
tags?: Array<string>;
139
139
+
};
140
140
+
};
141
141
+
142
142
+
export type FindPetsByTagsResponse = Array<Pet>;
143
143
+
144
144
+
export type FindPetsByTagsError = unknown;
145
145
+
146
146
+
export type GetPetByIdData = {
147
147
+
path: {
148
148
+
/**
149
149
+
* ID of pet to return
150
150
+
*/
151
151
+
petId: number;
152
152
+
};
153
153
+
};
154
154
+
155
155
+
export type GetPetByIdResponse = Pet;
156
156
+
157
157
+
export type GetPetByIdError = unknown;
158
158
+
159
159
+
export type UpdatePetWithFormData = {
160
160
+
path: {
161
161
+
/**
162
162
+
* ID of pet that needs to be updated
163
163
+
*/
164
164
+
petId: number;
165
165
+
};
166
166
+
query?: {
167
167
+
/**
168
168
+
* Name of pet that needs to be updated
169
169
+
*/
170
170
+
name?: string;
171
171
+
/**
172
172
+
* Status of pet that needs to be updated
173
173
+
*/
174
174
+
status?: string;
175
175
+
};
176
176
+
};
177
177
+
178
178
+
export type DeletePetData = {
179
179
+
headers?: {
180
180
+
api_key?: string;
181
181
+
};
182
182
+
path: {
183
183
+
/**
184
184
+
* Pet id to delete
185
185
+
*/
186
186
+
petId: number;
187
187
+
};
188
188
+
};
189
189
+
190
190
+
export type UploadFileData = {
191
191
+
body?: Blob | File;
192
192
+
path: {
193
193
+
/**
194
194
+
* ID of pet to update
195
195
+
*/
196
196
+
petId: number;
197
197
+
};
198
198
+
query?: {
199
199
+
/**
200
200
+
* Additional Metadata
201
201
+
*/
202
202
+
additionalMetadata?: string;
203
203
+
};
204
204
+
};
205
205
+
206
206
+
export type UploadFileResponse = ApiResponse;
207
207
+
208
208
+
export type UploadFileError = unknown;
209
209
+
210
210
+
export type GetInventoryResponse = {
211
211
+
[key: string]: number;
212
212
+
};
213
213
+
214
214
+
export type GetInventoryError = unknown;
215
215
+
216
216
+
export type PlaceOrderData = {
217
217
+
body?: Order;
218
218
+
};
219
219
+
220
220
+
export type PlaceOrderResponse = Order;
221
221
+
222
222
+
export type PlaceOrderError = unknown;
223
223
+
224
224
+
export type GetOrderByIdData = {
225
225
+
path: {
226
226
+
/**
227
227
+
* ID of order that needs to be fetched
228
228
+
*/
229
229
+
orderId: number;
230
230
+
};
231
231
+
};
232
232
+
233
233
+
export type GetOrderByIdResponse = Order;
234
234
+
235
235
+
export type GetOrderByIdError = unknown;
236
236
+
237
237
+
export type DeleteOrderData = {
238
238
+
path: {
239
239
+
/**
240
240
+
* ID of the order that needs to be deleted
241
241
+
*/
242
242
+
orderId: number;
243
243
+
};
244
244
+
};
245
245
+
246
246
+
export type CreateUserData = {
247
247
+
/**
248
248
+
* Created user object
249
249
+
*/
250
250
+
body?: User;
251
251
+
};
252
252
+
253
253
+
export type CreateUserResponse = User;
254
254
+
255
255
+
export type CreateUserError = unknown;
256
256
+
257
257
+
export type CreateUsersWithListInputData = {
258
258
+
body?: Array<User>;
259
259
+
};
260
260
+
261
261
+
export type CreateUsersWithListInputResponse = User | unknown;
262
262
+
263
263
+
export type CreateUsersWithListInputError = unknown;
264
264
+
265
265
+
export type LoginUserData = {
266
266
+
query?: {
267
267
+
/**
268
268
+
* The password for login in clear text
269
269
+
*/
270
270
+
password?: string;
271
271
+
/**
272
272
+
* The user name for login
273
273
+
*/
274
274
+
username?: string;
275
275
+
};
276
276
+
};
277
277
+
278
278
+
export type LoginUserResponse = string;
279
279
+
280
280
+
export type LoginUserError = unknown;
281
281
+
282
282
+
export type LogoutUserResponse = unknown;
283
283
+
284
284
+
export type LogoutUserError = unknown;
285
285
+
286
286
+
export type GetUserByNameData = {
287
287
+
path: {
288
288
+
/**
289
289
+
* The name that needs to be fetched. Use user1 for testing.
290
290
+
*/
291
291
+
username: string;
292
292
+
};
293
293
+
};
294
294
+
295
295
+
export type GetUserByNameResponse = User;
296
296
+
297
297
+
export type GetUserByNameError = unknown;
298
298
+
299
299
+
export type UpdateUserData = {
300
300
+
/**
301
301
+
* Update an existent user in the store
302
302
+
*/
303
303
+
body?: User;
304
304
+
path: {
305
305
+
/**
306
306
+
* name that needs to be updated
307
307
+
*/
308
308
+
username: string;
309
309
+
};
310
310
+
};
311
311
+
312
312
+
export type UpdateUserResponse = unknown;
313
313
+
314
314
+
export type UpdateUserError = unknown;
315
315
+
316
316
+
export type DeleteUserData = {
317
317
+
path: {
318
318
+
/**
319
319
+
* The name that needs to be deleted
320
320
+
*/
321
321
+
username: string;
322
322
+
};
323
323
+
};
324
324
+
325
325
+
export type $OpenApiTs = {
326
326
+
'/pet': {
327
327
+
post: {
328
328
+
req: AddPetData;
329
329
+
res: {
330
330
+
/**
331
331
+
* Successful operation
332
332
+
*/
333
333
+
'200': Pet;
334
334
+
/**
335
335
+
* Invalid input
336
336
+
*/
337
337
+
'405': unknown;
338
338
+
};
339
339
+
};
340
340
+
put: {
341
341
+
req: UpdatePetData;
342
342
+
res: {
343
343
+
/**
344
344
+
* Successful operation
345
345
+
*/
346
346
+
'200': Pet;
347
347
+
/**
348
348
+
* Invalid ID supplied
349
349
+
*/
350
350
+
'400': unknown;
351
351
+
/**
352
352
+
* Pet not found
353
353
+
*/
354
354
+
'404': unknown;
355
355
+
/**
356
356
+
* Validation exception
357
357
+
*/
358
358
+
'405': unknown;
359
359
+
};
360
360
+
};
361
361
+
};
362
362
+
'/pet/findByStatus': {
363
363
+
get: {
364
364
+
req: FindPetsByStatusData;
365
365
+
res: {
366
366
+
/**
367
367
+
* successful operation
368
368
+
*/
369
369
+
'200': Array<Pet>;
370
370
+
/**
371
371
+
* Invalid status value
372
372
+
*/
373
373
+
'400': unknown;
374
374
+
};
375
375
+
};
376
376
+
};
377
377
+
'/pet/findByTags': {
378
378
+
get: {
379
379
+
req: FindPetsByTagsData;
380
380
+
res: {
381
381
+
/**
382
382
+
* successful operation
383
383
+
*/
384
384
+
'200': Array<Pet>;
385
385
+
/**
386
386
+
* Invalid tag value
387
387
+
*/
388
388
+
'400': unknown;
389
389
+
};
390
390
+
};
391
391
+
};
392
392
+
'/pet/{petId}': {
393
393
+
delete: {
394
394
+
req: DeletePetData;
395
395
+
res: {
396
396
+
/**
397
397
+
* Invalid pet value
398
398
+
*/
399
399
+
'400': unknown;
400
400
+
};
401
401
+
};
402
402
+
get: {
403
403
+
req: GetPetByIdData;
404
404
+
res: {
405
405
+
/**
406
406
+
* successful operation
407
407
+
*/
408
408
+
'200': Pet;
409
409
+
/**
410
410
+
* Invalid ID supplied
411
411
+
*/
412
412
+
'400': unknown;
413
413
+
/**
414
414
+
* Pet not found
415
415
+
*/
416
416
+
'404': unknown;
417
417
+
};
418
418
+
};
419
419
+
post: {
420
420
+
req: UpdatePetWithFormData;
421
421
+
res: {
422
422
+
/**
423
423
+
* Invalid input
424
424
+
*/
425
425
+
'405': unknown;
426
426
+
};
427
427
+
};
428
428
+
};
429
429
+
'/pet/{petId}/uploadImage': {
430
430
+
post: {
431
431
+
req: UploadFileData;
432
432
+
res: {
433
433
+
/**
434
434
+
* successful operation
435
435
+
*/
436
436
+
'200': ApiResponse;
437
437
+
};
438
438
+
};
439
439
+
};
440
440
+
'/store/inventory': {
441
441
+
get: {
442
442
+
res: {
443
443
+
/**
444
444
+
* successful operation
445
445
+
*/
446
446
+
'200': {
447
447
+
[key: string]: number;
448
448
+
};
449
449
+
};
450
450
+
};
451
451
+
};
452
452
+
'/store/order': {
453
453
+
post: {
454
454
+
req: PlaceOrderData;
455
455
+
res: {
456
456
+
/**
457
457
+
* successful operation
458
458
+
*/
459
459
+
'200': Order;
460
460
+
/**
461
461
+
* Invalid input
462
462
+
*/
463
463
+
'405': unknown;
464
464
+
};
465
465
+
};
466
466
+
};
467
467
+
'/store/order/{orderId}': {
468
468
+
delete: {
469
469
+
req: DeleteOrderData;
470
470
+
res: {
471
471
+
/**
472
472
+
* Invalid ID supplied
473
473
+
*/
474
474
+
'400': unknown;
475
475
+
/**
476
476
+
* Order not found
477
477
+
*/
478
478
+
'404': unknown;
479
479
+
};
480
480
+
};
481
481
+
get: {
482
482
+
req: GetOrderByIdData;
483
483
+
res: {
484
484
+
/**
485
485
+
* successful operation
486
486
+
*/
487
487
+
'200': Order;
488
488
+
/**
489
489
+
* Invalid ID supplied
490
490
+
*/
491
491
+
'400': unknown;
492
492
+
/**
493
493
+
* Order not found
494
494
+
*/
495
495
+
'404': unknown;
496
496
+
};
497
497
+
};
498
498
+
};
499
499
+
'/user': {
500
500
+
post: {
501
501
+
req: CreateUserData;
502
502
+
res: {
503
503
+
/**
504
504
+
* successful operation
505
505
+
*/
506
506
+
default: User;
507
507
+
};
508
508
+
};
509
509
+
};
510
510
+
'/user/createWithList': {
511
511
+
post: {
512
512
+
req: CreateUsersWithListInputData;
513
513
+
res: {
514
514
+
/**
515
515
+
* Successful operation
516
516
+
*/
517
517
+
'200': User;
518
518
+
/**
519
519
+
* successful operation
520
520
+
*/
521
521
+
default: unknown;
522
522
+
};
523
523
+
};
524
524
+
};
525
525
+
'/user/login': {
526
526
+
get: {
527
527
+
req: LoginUserData;
528
528
+
res: {
529
529
+
/**
530
530
+
* successful operation
531
531
+
*/
532
532
+
'200': string;
533
533
+
/**
534
534
+
* Invalid username/password supplied
535
535
+
*/
536
536
+
'400': unknown;
537
537
+
};
538
538
+
};
539
539
+
};
540
540
+
'/user/logout': {
541
541
+
get: {
542
542
+
res: {
543
543
+
/**
544
544
+
* successful operation
545
545
+
*/
546
546
+
default: unknown;
547
547
+
};
548
548
+
};
549
549
+
};
550
550
+
'/user/{username}': {
551
551
+
delete: {
552
552
+
req: DeleteUserData;
553
553
+
res: {
554
554
+
/**
555
555
+
* Invalid username supplied
556
556
+
*/
557
557
+
'400': unknown;
558
558
+
/**
559
559
+
* User not found
560
560
+
*/
561
561
+
'404': unknown;
562
562
+
};
563
563
+
};
564
564
+
get: {
565
565
+
req: GetUserByNameData;
566
566
+
res: {
567
567
+
/**
568
568
+
* successful operation
569
569
+
*/
570
570
+
'200': User;
571
571
+
/**
572
572
+
* Invalid username supplied
573
573
+
*/
574
574
+
'400': unknown;
575
575
+
/**
576
576
+
* User not found
577
577
+
*/
578
578
+
'404': unknown;
579
579
+
};
580
580
+
};
581
581
+
put: {
582
582
+
req: UpdateUserData;
583
583
+
res: {
584
584
+
/**
585
585
+
* successful operation
586
586
+
*/
587
587
+
default: unknown;
588
588
+
};
589
589
+
};
590
590
+
};
591
591
+
};
+28
examples/openapi-ts-tanstack-react-query/src/main.tsx
···
1
1
+
import '@radix-ui/themes/styles.css';
2
2
+
3
3
+
import { Theme } from '@radix-ui/themes';
4
4
+
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
5
5
+
import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
6
6
+
import React from 'react';
7
7
+
import ReactDOM from 'react-dom/client';
8
8
+
9
9
+
import App from './App.tsx';
10
10
+
11
11
+
const queryClient = new QueryClient({
12
12
+
defaultOptions: {
13
13
+
queries: {
14
14
+
staleTime: 60000,
15
15
+
},
16
16
+
},
17
17
+
});
18
18
+
19
19
+
ReactDOM.createRoot(document.getElementById('root')!).render(
20
20
+
<React.StrictMode>
21
21
+
<QueryClientProvider client={queryClient}>
22
22
+
<Theme appearance="dark">
23
23
+
<App />
24
24
+
</Theme>
25
25
+
<ReactQueryDevtools initialIsOpen={false} />
26
26
+
</QueryClientProvider>
27
27
+
</React.StrictMode>,
28
28
+
);
+1
examples/openapi-ts-tanstack-react-query/src/vite-env.d.ts
···
1
1
+
/// <reference types="vite/client" />
+8
examples/openapi-ts-tanstack-react-query/tailwind.config.js
···
1
1
+
/** @type {import('tailwindcss').Config} */
2
2
+
export default {
3
3
+
content: ['./index.html', './src/**/*.{html,js,ts,jsx,tsx}'],
4
4
+
plugins: [],
5
5
+
theme: {
6
6
+
extend: {},
7
7
+
},
8
8
+
};
+25
examples/openapi-ts-tanstack-react-query/tsconfig.json
···
1
1
+
{
2
2
+
"compilerOptions": {
3
3
+
"target": "ES2020",
4
4
+
"useDefineForClassFields": true,
5
5
+
"lib": ["ES2020", "DOM", "DOM.Iterable"],
6
6
+
"module": "ESNext",
7
7
+
"skipLibCheck": true,
8
8
+
9
9
+
/* Bundler mode */
10
10
+
"moduleResolution": "bundler",
11
11
+
"allowImportingTsExtensions": true,
12
12
+
"resolveJsonModule": true,
13
13
+
"isolatedModules": true,
14
14
+
"noEmit": true,
15
15
+
"jsx": "react-jsx",
16
16
+
17
17
+
/* Linting */
18
18
+
"strict": true,
19
19
+
"noUnusedLocals": true,
20
20
+
"noUnusedParameters": true,
21
21
+
"noFallthroughCasesInSwitch": true
22
22
+
},
23
23
+
"include": ["src"],
24
24
+
"references": [{ "path": "./tsconfig.node.json" }]
25
25
+
}
+11
examples/openapi-ts-tanstack-react-query/tsconfig.node.json
···
1
1
+
{
2
2
+
"compilerOptions": {
3
3
+
"composite": true,
4
4
+
"skipLibCheck": true,
5
5
+
"module": "ESNext",
6
6
+
"moduleResolution": "bundler",
7
7
+
"allowSyntheticDefaultImports": true,
8
8
+
"strict": true
9
9
+
},
10
10
+
"include": ["vite.config.ts"]
11
11
+
}
+7
examples/openapi-ts-tanstack-react-query/vite.config.ts
···
1
1
+
import react from '@vitejs/plugin-react';
2
2
+
import { defineConfig } from 'vite';
3
3
+
4
4
+
// https://vitejs.dev/config/
5
5
+
export default defineConfig({
6
6
+
plugins: [react()],
7
7
+
});
+1
-1
packages/openapi-ts/package.json
···
85
85
"@hey-api/client-fetch": "workspace:*",
86
86
"@rollup/plugin-json": "6.1.0",
87
87
"@rollup/plugin-node-resolve": "15.2.3",
88
88
-
"@tanstack/react-query": "5.51.11",
88
88
+
"@tanstack/react-query": "5.51.23",
89
89
"@types/cross-spawn": "6.0.6",
90
90
"@types/express": "4.17.21",
91
91
"axios": "1.7.3",
+181
-10
pnpm-lock.yaml
···
222
222
specifier: 5.3.3
223
223
version: 5.3.3(@types/node@20.14.10)(less@4.2.0)(sass@1.71.1)(terser@5.31.1)
224
224
225
225
+
examples/openapi-ts-tanstack-react-query:
226
226
+
dependencies:
227
227
+
'@hey-api/client-fetch':
228
228
+
specifier: workspace:*
229
229
+
version: link:../../packages/client-fetch
230
230
+
'@radix-ui/react-form':
231
231
+
specifier: 0.1.0
232
232
+
version: 0.1.0(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
233
233
+
'@radix-ui/react-icons':
234
234
+
specifier: 1.3.0
235
235
+
version: 1.3.0(react@18.3.1)
236
236
+
'@radix-ui/themes':
237
237
+
specifier: 3.1.1
238
238
+
version: 3.1.1(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
239
239
+
'@tanstack/react-query':
240
240
+
specifier: 5.51.23
241
241
+
version: 5.51.23(react@18.3.1)
242
242
+
'@tanstack/react-query-devtools':
243
243
+
specifier: 5.51.23
244
244
+
version: 5.51.23(@tanstack/react-query@5.51.23(react@18.3.1))(react@18.3.1)
245
245
+
react:
246
246
+
specifier: 18.3.1
247
247
+
version: 18.3.1
248
248
+
react-dom:
249
249
+
specifier: 18.3.1
250
250
+
version: 18.3.1(react@18.3.1)
251
251
+
devDependencies:
252
252
+
'@hey-api/openapi-ts':
253
253
+
specifier: workspace:*
254
254
+
version: link:../../packages/openapi-ts
255
255
+
'@tanstack/eslint-plugin-query':
256
256
+
specifier: 5.51.15
257
257
+
version: 5.51.15(eslint@9.6.0)(typescript@5.5.3)
258
258
+
'@types/react':
259
259
+
specifier: 18.3.3
260
260
+
version: 18.3.3
261
261
+
'@types/react-dom':
262
262
+
specifier: 18.3.0
263
263
+
version: 18.3.0
264
264
+
'@typescript-eslint/eslint-plugin':
265
265
+
specifier: 7.15.0
266
266
+
version: 7.15.0(@typescript-eslint/parser@7.15.0(eslint@9.6.0)(typescript@5.5.3))(eslint@9.6.0)(typescript@5.5.3)
267
267
+
'@typescript-eslint/parser':
268
268
+
specifier: 7.15.0
269
269
+
version: 7.15.0(eslint@9.6.0)(typescript@5.5.3)
270
270
+
'@vitejs/plugin-react':
271
271
+
specifier: 4.3.1
272
272
+
version: 4.3.1(vite@5.3.3(@types/node@20.14.10)(less@4.2.0)(sass@1.71.1)(terser@5.31.1))
273
273
+
autoprefixer:
274
274
+
specifier: 10.4.19
275
275
+
version: 10.4.19(postcss@8.4.39)
276
276
+
eslint:
277
277
+
specifier: 9.6.0
278
278
+
version: 9.6.0
279
279
+
eslint-plugin-react-hooks:
280
280
+
specifier: 4.6.2
281
281
+
version: 4.6.2(eslint@9.6.0)
282
282
+
eslint-plugin-react-refresh:
283
283
+
specifier: 0.4.7
284
284
+
version: 0.4.7(eslint@9.6.0)
285
285
+
postcss:
286
286
+
specifier: 8.4.39
287
287
+
version: 8.4.39
288
288
+
prettier:
289
289
+
specifier: 3.3.2
290
290
+
version: 3.3.2
291
291
+
tailwindcss:
292
292
+
specifier: 3.4.4
293
293
+
version: 3.4.4(ts-node@10.9.2(@types/node@20.14.10)(typescript@5.5.3))
294
294
+
typescript:
295
295
+
specifier: 5.5.3
296
296
+
version: 5.5.3
297
297
+
vite:
298
298
+
specifier: 5.3.3
299
299
+
version: 5.3.3(@types/node@20.14.10)(less@4.2.0)(sass@1.71.1)(terser@5.31.1)
300
300
+
225
301
packages/client-axios:
226
302
devDependencies:
227
303
axios:
···
296
372
specifier: 15.2.3
297
373
version: 15.2.3(rollup@4.18.0)
298
374
'@tanstack/react-query':
299
299
-
specifier: 5.51.11
300
300
-
version: 5.51.11(react@18.3.1)
375
375
+
specifier: 5.51.23
376
376
+
version: 5.51.23(react@18.3.1)
301
377
'@types/cross-spawn':
302
378
specifier: 6.0.6
303
379
version: 6.0.6
···
2629
2705
'@stackblitz/sdk@1.11.0':
2630
2706
resolution: {integrity: sha512-DFQGANNkEZRzFk1/rDP6TcFdM82ycHE+zfl9C/M/jXlH68jiqHWHFMQURLELoD8koxvu/eW5uhg94NSAZlYrUQ==}
2631
2707
2632
2632
-
'@tanstack/query-core@5.51.9':
2633
2633
-
resolution: {integrity: sha512-HsAwaY5J19MD18ykZDS3aVVh+bAt0i7m6uQlFC2b77DLV9djo+xEN7MWQAQQTR8IM+7r/zbozTQ7P0xr0bHuew==}
2708
2708
+
'@tanstack/eslint-plugin-query@5.51.15':
2709
2709
+
resolution: {integrity: sha512-btX03EOGvNxTGJDqHMmQwfSt/hp93Z8I4FNBijoyEdDnjGi4jVjpGP7nEi9LaMnHFsylucptVGb6GQngWs07bA==}
2710
2710
+
peerDependencies:
2711
2711
+
eslint: ^8 || ^9
2712
2712
+
2713
2713
+
'@tanstack/query-core@5.51.21':
2714
2714
+
resolution: {integrity: sha512-POQxm42IUp6n89kKWF4IZi18v3fxQWFRolvBA6phNVmA8psdfB1MvDnGacCJdS+EOX12w/CyHM62z//rHmYmvw==}
2634
2715
2635
2635
-
'@tanstack/react-query@5.51.11':
2636
2636
-
resolution: {integrity: sha512-4Kq2x0XpDlpvSnaLG+8pHNH60zEc3mBvb3B2tOMDjcPCi/o+Du3p/9qpPLwJOTliVxxPJAP27fuIhLrsRdCr7A==}
2716
2716
+
'@tanstack/query-devtools@5.51.16':
2717
2717
+
resolution: {integrity: sha512-ajwuq4WnkNCMj/Hy3KR8d3RtZ6PSKc1dD2vs2T408MdjgKzQ3klVoL6zDgVO7X+5jlb5zfgcO3thh4ojPhfIaw==}
2718
2718
+
2719
2719
+
'@tanstack/react-query-devtools@5.51.23':
2720
2720
+
resolution: {integrity: sha512-XpHrdyfUPGULIyJ1K7UvhAcK+KjMJdw4NjmRjryoj3XEgfAU5qU1rz8gIFvGc3gTGT07yIseGo7GEll/ICfJfQ==}
2721
2721
+
peerDependencies:
2722
2722
+
'@tanstack/react-query': ^5.51.23
2723
2723
+
react: ^18 || ^19
2724
2724
+
2725
2725
+
'@tanstack/react-query@5.51.23':
2726
2726
+
resolution: {integrity: sha512-CfJCfX45nnVIZjQBRYYtvVMIsGgWLKLYC4xcUiYEey671n1alvTZoCBaU9B85O8mF/tx9LPyrI04A6Bs2THv4A==}
2637
2727
peerDependencies:
2638
2728
react: ^18.0.0
2639
2729
···
2818
2908
resolution: {integrity: sha512-Q/1yrF/XbxOTvttNVPihxh1b9fxamjEoz2Os/Pe38OHwxC24CyCqXxGTOdpb4lt6HYtqw9HetA/Rf6gDGaMPlw==}
2819
2909
engines: {node: ^18.18.0 || >=20.0.0}
2820
2910
2911
2911
+
'@typescript-eslint/scope-manager@8.0.0-alpha.30':
2912
2912
+
resolution: {integrity: sha512-FGW/iPWGyPFamAVZ60oCAthMqQrqafUGebF8UKuq/ha+e9SVG6YhJoRzurlQXOVf8dHfOhJ0ADMXyFnMc53clg==}
2913
2913
+
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
2914
2914
+
2821
2915
'@typescript-eslint/type-utils@7.15.0':
2822
2916
resolution: {integrity: sha512-SkgriaeV6PDvpA6253PDVep0qCqgbO1IOBiycjnXsszNTVQe5flN5wR5jiczoEoDEnAqYFSFFc9al9BSGVltkg==}
2823
2917
engines: {node: ^18.18.0 || >=20.0.0}
···
2836
2930
resolution: {integrity: sha512-aV1+B1+ySXbQH0pLK0rx66I3IkiZNidYobyfn0WFsdGhSXw+P3YOqeTq5GED458SfB24tg+ux3S+9g118hjlTw==}
2837
2931
engines: {node: ^18.18.0 || >=20.0.0}
2838
2932
2933
2933
+
'@typescript-eslint/types@8.0.0-alpha.30':
2934
2934
+
resolution: {integrity: sha512-4WzLlw27SO9pK9UFj/Hu7WGo8WveT0SEiIpFVsV2WwtQmLps6kouwtVCB8GJPZKJyurhZhcqCoQVQFmpv441Vg==}
2935
2935
+
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
2936
2936
+
2839
2937
'@typescript-eslint/typescript-estree@5.62.0':
2840
2938
resolution: {integrity: sha512-CmcQ6uY7b9y694lKdRB8FEel7JbU/40iSAPomu++SjLMntB+2Leay2LO6i8VnJk58MtE9/nQSFIH6jpyRWyYzA==}
2841
2939
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
···
2854
2952
typescript:
2855
2953
optional: true
2856
2954
2955
2955
+
'@typescript-eslint/typescript-estree@8.0.0-alpha.30':
2956
2956
+
resolution: {integrity: sha512-WSXbc9ZcXI+7yC+6q95u77i8FXz6HOLsw3ST+vMUlFy1lFbXyFL/3e6HDKQCm2Clt0krnoCPiTGvIn+GkYPn4Q==}
2957
2957
+
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
2958
2958
+
peerDependencies:
2959
2959
+
typescript: '*'
2960
2960
+
peerDependenciesMeta:
2961
2961
+
typescript:
2962
2962
+
optional: true
2963
2963
+
2857
2964
'@typescript-eslint/utils@5.62.0':
2858
2965
resolution: {integrity: sha512-n8oxjeb5aIbPFEtmQxQYOLI0i9n5ySBEY/ZEHHZqKQSFnxio1rv6dthascc9dLuwrL0RC5mPCxB7vnAVGAYWAQ==}
2859
2966
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
···
2866
2973
peerDependencies:
2867
2974
eslint: ^8.56.0
2868
2975
2976
2976
+
'@typescript-eslint/utils@8.0.0-alpha.30':
2977
2977
+
resolution: {integrity: sha512-rfhqfLqFyXhHNDwMnHiVGxl/Z2q/3guQ1jLlGQ0hi9Rb7inmwz42crM+NnLPR+2vEnwyw1P/g7fnQgQ3qvFx4g==}
2978
2978
+
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
2979
2979
+
peerDependencies:
2980
2980
+
eslint: ^8.57.0 || ^9.0.0
2981
2981
+
2869
2982
'@typescript-eslint/visitor-keys@5.62.0':
2870
2983
resolution: {integrity: sha512-07ny+LHRzQXepkGg6w0mFY41fVUNBrL2Roj/++7V1txKugfjm/Ci/qSND03r2RhlJhJYMcTn9AhhSSqQp0Ysyw==}
2871
2984
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
···
2873
2986
'@typescript-eslint/visitor-keys@7.15.0':
2874
2987
resolution: {integrity: sha512-Hqgy/ETgpt2L5xueA/zHHIl4fJI2O4XUE9l4+OIfbJIRSnTJb/QscncdqqZzofQegIJugRIF57OJea1khw2SDw==}
2875
2988
engines: {node: ^18.18.0 || >=20.0.0}
2989
2989
+
2990
2990
+
'@typescript-eslint/visitor-keys@8.0.0-alpha.30':
2991
2991
+
resolution: {integrity: sha512-XZuNurZxBqmr6ZIRIwWFq7j5RZd6ZlkId/HZEWyfciK+CWoyOxSF9Pv2VXH9Rlu2ZG2PfbhLz2Veszl4Pfn7yA==}
2992
2992
+
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
2876
2993
2877
2994
'@vitejs/plugin-basic-ssl@1.1.0':
2878
2995
resolution: {integrity: sha512-wO4Dk/rm8u7RNhOf95ZzcEmC9rYOncYgvq4z3duaJrCgjN8BxAnDVyndanfcJZ0O6XZzHz6Q0hTimxTg8Y9g/A==}
···
9303
9420
9304
9421
'@stackblitz/sdk@1.11.0': {}
9305
9422
9306
9306
-
'@tanstack/query-core@5.51.9': {}
9423
9423
+
'@tanstack/eslint-plugin-query@5.51.15(eslint@9.6.0)(typescript@5.5.3)':
9424
9424
+
dependencies:
9425
9425
+
'@typescript-eslint/utils': 8.0.0-alpha.30(eslint@9.6.0)(typescript@5.5.3)
9426
9426
+
eslint: 9.6.0
9427
9427
+
transitivePeerDependencies:
9428
9428
+
- supports-color
9429
9429
+
- typescript
9430
9430
+
9431
9431
+
'@tanstack/query-core@5.51.21': {}
9307
9432
9308
9308
-
'@tanstack/react-query@5.51.11(react@18.3.1)':
9433
9433
+
'@tanstack/query-devtools@5.51.16': {}
9434
9434
+
9435
9435
+
'@tanstack/react-query-devtools@5.51.23(@tanstack/react-query@5.51.23(react@18.3.1))(react@18.3.1)':
9309
9436
dependencies:
9310
9310
-
'@tanstack/query-core': 5.51.9
9437
9437
+
'@tanstack/query-devtools': 5.51.16
9438
9438
+
'@tanstack/react-query': 5.51.23(react@18.3.1)
9439
9439
+
react: 18.3.1
9440
9440
+
9441
9441
+
'@tanstack/react-query@5.51.23(react@18.3.1)':
9442
9442
+
dependencies:
9443
9443
+
'@tanstack/query-core': 5.51.21
9311
9444
react: 18.3.1
9312
9445
9313
9446
'@tootallnate/quickjs-emscripten@0.23.0': {}
···
9531
9664
'@typescript-eslint/types': 7.15.0
9532
9665
'@typescript-eslint/visitor-keys': 7.15.0
9533
9666
9667
9667
+
'@typescript-eslint/scope-manager@8.0.0-alpha.30':
9668
9668
+
dependencies:
9669
9669
+
'@typescript-eslint/types': 8.0.0-alpha.30
9670
9670
+
'@typescript-eslint/visitor-keys': 8.0.0-alpha.30
9671
9671
+
9534
9672
'@typescript-eslint/type-utils@7.15.0(eslint@9.6.0)(typescript@5.5.3)':
9535
9673
dependencies:
9536
9674
'@typescript-eslint/typescript-estree': 7.15.0(typescript@5.5.3)
···
9546
9684
'@typescript-eslint/types@5.62.0': {}
9547
9685
9548
9686
'@typescript-eslint/types@7.15.0': {}
9687
9687
+
9688
9688
+
'@typescript-eslint/types@8.0.0-alpha.30': {}
9549
9689
9550
9690
'@typescript-eslint/typescript-estree@5.62.0(typescript@5.5.3)':
9551
9691
dependencies:
···
9576
9716
transitivePeerDependencies:
9577
9717
- supports-color
9578
9718
9719
9719
+
'@typescript-eslint/typescript-estree@8.0.0-alpha.30(typescript@5.5.3)':
9720
9720
+
dependencies:
9721
9721
+
'@typescript-eslint/types': 8.0.0-alpha.30
9722
9722
+
'@typescript-eslint/visitor-keys': 8.0.0-alpha.30
9723
9723
+
debug: 4.3.5
9724
9724
+
globby: 11.1.0
9725
9725
+
is-glob: 4.0.3
9726
9726
+
minimatch: 9.0.5
9727
9727
+
semver: 7.6.2
9728
9728
+
ts-api-utils: 1.3.0(typescript@5.5.3)
9729
9729
+
optionalDependencies:
9730
9730
+
typescript: 5.5.3
9731
9731
+
transitivePeerDependencies:
9732
9732
+
- supports-color
9733
9733
+
9579
9734
'@typescript-eslint/utils@5.62.0(eslint@9.6.0)(typescript@5.5.3)':
9580
9735
dependencies:
9581
9736
'@eslint-community/eslint-utils': 4.4.0(eslint@9.6.0)
···
9602
9757
- supports-color
9603
9758
- typescript
9604
9759
9760
9760
+
'@typescript-eslint/utils@8.0.0-alpha.30(eslint@9.6.0)(typescript@5.5.3)':
9761
9761
+
dependencies:
9762
9762
+
'@eslint-community/eslint-utils': 4.4.0(eslint@9.6.0)
9763
9763
+
'@typescript-eslint/scope-manager': 8.0.0-alpha.30
9764
9764
+
'@typescript-eslint/types': 8.0.0-alpha.30
9765
9765
+
'@typescript-eslint/typescript-estree': 8.0.0-alpha.30(typescript@5.5.3)
9766
9766
+
eslint: 9.6.0
9767
9767
+
transitivePeerDependencies:
9768
9768
+
- supports-color
9769
9769
+
- typescript
9770
9770
+
9605
9771
'@typescript-eslint/visitor-keys@5.62.0':
9606
9772
dependencies:
9607
9773
'@typescript-eslint/types': 5.62.0
···
9610
9776
'@typescript-eslint/visitor-keys@7.15.0':
9611
9777
dependencies:
9612
9778
'@typescript-eslint/types': 7.15.0
9779
9779
+
eslint-visitor-keys: 3.4.3
9780
9780
+
9781
9781
+
'@typescript-eslint/visitor-keys@8.0.0-alpha.30':
9782
9782
+
dependencies:
9783
9783
+
'@typescript-eslint/types': 8.0.0-alpha.30
9613
9784
eslint-visitor-keys: 3.4.3
9614
9785
9615
9786
'@vitejs/plugin-basic-ssl@1.1.0(vite@5.1.7(@types/node@20.14.10)(less@4.2.0)(sass@1.71.1)(terser@5.29.1))':
···
11499
11670
11500
11671
istanbul-lib-instrument@5.2.1:
11501
11672
dependencies:
11502
11502
-
'@babel/core': 7.24.0
11673
11673
+
'@babel/core': 7.24.7
11503
11674
'@babel/parser': 7.24.7
11504
11675
'@istanbuljs/schema': 0.1.3
11505
11676
istanbul-lib-coverage: 3.2.2