fumadocs-openapi 5.11.4 → 5.11.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ui/client-client-B0hpK9b7.js +359 -0
- package/dist/ui/{fetcher-DLRl_kVF.js → fetcher-CsyGTBlt.js} +1 -1
- package/dist/ui/{index-client-cz-xNo9A.js → index-client-D_ZwIB_V.js} +97 -3
- package/dist/ui/index.js +2 -2
- package/dist/ui/server-select-client-prQnF0hV.js +101 -0
- package/package.json +9 -9
- package/dist/ui/client-client-Co3JBILS.js +0 -538
|
@@ -0,0 +1,359 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { forwardRef, createElement, useContext, createContext, useState, useRef, useEffect, useMemo } from 'react';
|
|
3
|
+
import { jsx } from 'react/jsx-runtime';
|
|
4
|
+
import { cn, useCopyButton, buttonVariants } from 'fumadocs-ui/components/api';
|
|
5
|
+
import dynamic from 'next/dynamic';
|
|
6
|
+
|
|
7
|
+
/**
|
|
8
|
+
* @license lucide-react v0.471.1 - ISC
|
|
9
|
+
*
|
|
10
|
+
* This source code is licensed under the ISC license.
|
|
11
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
12
|
+
*/ const toKebabCase = (string)=>string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
|
|
13
|
+
const mergeClasses = (...classes)=>classes.filter((className, index, array)=>{
|
|
14
|
+
return Boolean(className) && className.trim() !== "" && array.indexOf(className) === index;
|
|
15
|
+
}).join(" ").trim();
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* @license lucide-react v0.471.1 - ISC
|
|
19
|
+
*
|
|
20
|
+
* This source code is licensed under the ISC license.
|
|
21
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
22
|
+
*/ var defaultAttributes = {
|
|
23
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
24
|
+
width: 24,
|
|
25
|
+
height: 24,
|
|
26
|
+
viewBox: "0 0 24 24",
|
|
27
|
+
fill: "none",
|
|
28
|
+
stroke: "currentColor",
|
|
29
|
+
strokeWidth: 2,
|
|
30
|
+
strokeLinecap: "round",
|
|
31
|
+
strokeLinejoin: "round"
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
const Icon = /*#__PURE__*/ forwardRef(({ color = "currentColor", size = 24, strokeWidth = 2, absoluteStrokeWidth, className = "", children, iconNode, ...rest }, ref)=>{
|
|
35
|
+
return /*#__PURE__*/ createElement("svg", {
|
|
36
|
+
ref,
|
|
37
|
+
...defaultAttributes,
|
|
38
|
+
width: size,
|
|
39
|
+
height: size,
|
|
40
|
+
stroke: color,
|
|
41
|
+
strokeWidth: absoluteStrokeWidth ? Number(strokeWidth) * 24 / Number(size) : strokeWidth,
|
|
42
|
+
className: mergeClasses("lucide", className),
|
|
43
|
+
...rest
|
|
44
|
+
}, [
|
|
45
|
+
...iconNode.map(([tag, attrs])=>/*#__PURE__*/ createElement(tag, attrs)),
|
|
46
|
+
...Array.isArray(children) ? children : [
|
|
47
|
+
children
|
|
48
|
+
]
|
|
49
|
+
]);
|
|
50
|
+
});
|
|
51
|
+
|
|
52
|
+
const createLucideIcon = (iconName, iconNode)=>{
|
|
53
|
+
const Component = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ createElement(Icon, {
|
|
54
|
+
ref,
|
|
55
|
+
iconNode,
|
|
56
|
+
className: mergeClasses(`lucide-${toKebabCase(iconName)}`, className),
|
|
57
|
+
...props
|
|
58
|
+
}));
|
|
59
|
+
Component.displayName = `${iconName}`;
|
|
60
|
+
return Component;
|
|
61
|
+
};
|
|
62
|
+
|
|
63
|
+
const __iconNode$7 = [
|
|
64
|
+
[
|
|
65
|
+
"path",
|
|
66
|
+
{
|
|
67
|
+
d: "M20 6 9 17l-5-5",
|
|
68
|
+
key: "1gmf2c"
|
|
69
|
+
}
|
|
70
|
+
]
|
|
71
|
+
];
|
|
72
|
+
const Check = createLucideIcon("Check", __iconNode$7);
|
|
73
|
+
|
|
74
|
+
const __iconNode$6 = [
|
|
75
|
+
[
|
|
76
|
+
"path",
|
|
77
|
+
{
|
|
78
|
+
d: "m6 9 6 6 6-6",
|
|
79
|
+
key: "qrunsl"
|
|
80
|
+
}
|
|
81
|
+
]
|
|
82
|
+
];
|
|
83
|
+
const ChevronDown = createLucideIcon("ChevronDown", __iconNode$6);
|
|
84
|
+
|
|
85
|
+
const __iconNode$5 = [
|
|
86
|
+
[
|
|
87
|
+
"path",
|
|
88
|
+
{
|
|
89
|
+
d: "m18 15-6-6-6 6",
|
|
90
|
+
key: "153udz"
|
|
91
|
+
}
|
|
92
|
+
]
|
|
93
|
+
];
|
|
94
|
+
const ChevronUp = createLucideIcon("ChevronUp", __iconNode$5);
|
|
95
|
+
|
|
96
|
+
const __iconNode$4 = [
|
|
97
|
+
[
|
|
98
|
+
"circle",
|
|
99
|
+
{
|
|
100
|
+
cx: "12",
|
|
101
|
+
cy: "12",
|
|
102
|
+
r: "10",
|
|
103
|
+
key: "1mglay"
|
|
104
|
+
}
|
|
105
|
+
],
|
|
106
|
+
[
|
|
107
|
+
"path",
|
|
108
|
+
{
|
|
109
|
+
d: "m9 12 2 2 4-4",
|
|
110
|
+
key: "dzmm74"
|
|
111
|
+
}
|
|
112
|
+
]
|
|
113
|
+
];
|
|
114
|
+
const CircleCheck = createLucideIcon("CircleCheck", __iconNode$4);
|
|
115
|
+
|
|
116
|
+
const __iconNode$3 = [
|
|
117
|
+
[
|
|
118
|
+
"circle",
|
|
119
|
+
{
|
|
120
|
+
cx: "12",
|
|
121
|
+
cy: "12",
|
|
122
|
+
r: "10",
|
|
123
|
+
key: "1mglay"
|
|
124
|
+
}
|
|
125
|
+
],
|
|
126
|
+
[
|
|
127
|
+
"path",
|
|
128
|
+
{
|
|
129
|
+
d: "m15 9-6 6",
|
|
130
|
+
key: "1uzhvr"
|
|
131
|
+
}
|
|
132
|
+
],
|
|
133
|
+
[
|
|
134
|
+
"path",
|
|
135
|
+
{
|
|
136
|
+
d: "m9 9 6 6",
|
|
137
|
+
key: "z0biqf"
|
|
138
|
+
}
|
|
139
|
+
]
|
|
140
|
+
];
|
|
141
|
+
const CircleX = createLucideIcon("CircleX", __iconNode$3);
|
|
142
|
+
|
|
143
|
+
const __iconNode$2 = [
|
|
144
|
+
[
|
|
145
|
+
"rect",
|
|
146
|
+
{
|
|
147
|
+
width: "14",
|
|
148
|
+
height: "14",
|
|
149
|
+
x: "8",
|
|
150
|
+
y: "8",
|
|
151
|
+
rx: "2",
|
|
152
|
+
ry: "2",
|
|
153
|
+
key: "17jyea"
|
|
154
|
+
}
|
|
155
|
+
],
|
|
156
|
+
[
|
|
157
|
+
"path",
|
|
158
|
+
{
|
|
159
|
+
d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2",
|
|
160
|
+
key: "zix9uf"
|
|
161
|
+
}
|
|
162
|
+
]
|
|
163
|
+
];
|
|
164
|
+
const Copy = createLucideIcon("Copy", __iconNode$2);
|
|
165
|
+
|
|
166
|
+
const __iconNode$1 = [
|
|
167
|
+
[
|
|
168
|
+
"path",
|
|
169
|
+
{
|
|
170
|
+
d: "M5 12h14",
|
|
171
|
+
key: "1ays0h"
|
|
172
|
+
}
|
|
173
|
+
],
|
|
174
|
+
[
|
|
175
|
+
"path",
|
|
176
|
+
{
|
|
177
|
+
d: "M12 5v14",
|
|
178
|
+
key: "s699le"
|
|
179
|
+
}
|
|
180
|
+
]
|
|
181
|
+
];
|
|
182
|
+
const Plus = createLucideIcon("Plus", __iconNode$1);
|
|
183
|
+
|
|
184
|
+
const __iconNode = [
|
|
185
|
+
[
|
|
186
|
+
"path",
|
|
187
|
+
{
|
|
188
|
+
d: "M3 6h18",
|
|
189
|
+
key: "d0wm0j"
|
|
190
|
+
}
|
|
191
|
+
],
|
|
192
|
+
[
|
|
193
|
+
"path",
|
|
194
|
+
{
|
|
195
|
+
d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6",
|
|
196
|
+
key: "4alrt4"
|
|
197
|
+
}
|
|
198
|
+
],
|
|
199
|
+
[
|
|
200
|
+
"path",
|
|
201
|
+
{
|
|
202
|
+
d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2",
|
|
203
|
+
key: "v07s0e"
|
|
204
|
+
}
|
|
205
|
+
],
|
|
206
|
+
[
|
|
207
|
+
"line",
|
|
208
|
+
{
|
|
209
|
+
x1: "10",
|
|
210
|
+
x2: "10",
|
|
211
|
+
y1: "11",
|
|
212
|
+
y2: "17",
|
|
213
|
+
key: "1uufr5"
|
|
214
|
+
}
|
|
215
|
+
],
|
|
216
|
+
[
|
|
217
|
+
"line",
|
|
218
|
+
{
|
|
219
|
+
x1: "14",
|
|
220
|
+
x2: "14",
|
|
221
|
+
y1: "11",
|
|
222
|
+
y2: "17",
|
|
223
|
+
key: "xtxkd"
|
|
224
|
+
}
|
|
225
|
+
]
|
|
226
|
+
];
|
|
227
|
+
const Trash2 = createLucideIcon("Trash2", __iconNode);
|
|
228
|
+
|
|
229
|
+
const ApiContext = /*#__PURE__*/ createContext(undefined);
|
|
230
|
+
const ServerSelectContext = /*#__PURE__*/ createContext(undefined);
|
|
231
|
+
function useApiContext() {
|
|
232
|
+
const ctx = useContext(ApiContext);
|
|
233
|
+
if (!ctx) throw new Error('Component must be used under <ApiProvider />');
|
|
234
|
+
return ctx;
|
|
235
|
+
}
|
|
236
|
+
function useServerSelectContext() {
|
|
237
|
+
const ctx = useContext(ServerSelectContext);
|
|
238
|
+
if (!ctx) throw new Error('Component must be used under <ApiProvider />');
|
|
239
|
+
return ctx;
|
|
240
|
+
}
|
|
241
|
+
function ApiProvider({ defaultBaseUrl, children, ...props }) {
|
|
242
|
+
const [server, setServer] = useState(()=>{
|
|
243
|
+
const defaultItem = defaultBaseUrl ? props.servers.find((item)=>item.url === defaultBaseUrl) : undefined;
|
|
244
|
+
return defaultItem ? {
|
|
245
|
+
url: defaultItem.url,
|
|
246
|
+
variables: getDefaultValues(defaultItem)
|
|
247
|
+
} : null;
|
|
248
|
+
});
|
|
249
|
+
const serverRef = useRef(server);
|
|
250
|
+
serverRef.current = server;
|
|
251
|
+
useEffect(()=>{
|
|
252
|
+
const cached = localStorage.getItem('apiBaseUrl');
|
|
253
|
+
if (!cached) return;
|
|
254
|
+
try {
|
|
255
|
+
const obj = JSON.parse(cached);
|
|
256
|
+
if (!obj || typeof obj !== 'object') return;
|
|
257
|
+
setServer(obj);
|
|
258
|
+
} catch {
|
|
259
|
+
// ignore
|
|
260
|
+
}
|
|
261
|
+
}, []);
|
|
262
|
+
return /*#__PURE__*/ jsx(ApiContext.Provider, {
|
|
263
|
+
value: useMemo(()=>({
|
|
264
|
+
...props,
|
|
265
|
+
serverRef
|
|
266
|
+
}), [
|
|
267
|
+
props
|
|
268
|
+
]),
|
|
269
|
+
children: /*#__PURE__*/ jsx(ServerSelectContext.Provider, {
|
|
270
|
+
value: useMemo(()=>({
|
|
271
|
+
server,
|
|
272
|
+
setServerVariables (variables) {
|
|
273
|
+
setServer((prev)=>{
|
|
274
|
+
if (!prev) return null;
|
|
275
|
+
const updated = {
|
|
276
|
+
...prev,
|
|
277
|
+
variables
|
|
278
|
+
};
|
|
279
|
+
localStorage.setItem('apiBaseUrl', JSON.stringify(updated));
|
|
280
|
+
return updated;
|
|
281
|
+
});
|
|
282
|
+
},
|
|
283
|
+
setServer (value) {
|
|
284
|
+
const obj = props.servers.find((item)=>item.url === value);
|
|
285
|
+
if (!obj) return;
|
|
286
|
+
const result = {
|
|
287
|
+
url: value,
|
|
288
|
+
variables: getDefaultValues(obj)
|
|
289
|
+
};
|
|
290
|
+
localStorage.setItem('apiBaseUrl', JSON.stringify(result));
|
|
291
|
+
setServer(result);
|
|
292
|
+
}
|
|
293
|
+
}), [
|
|
294
|
+
server,
|
|
295
|
+
props.servers
|
|
296
|
+
]),
|
|
297
|
+
children: children
|
|
298
|
+
})
|
|
299
|
+
});
|
|
300
|
+
}
|
|
301
|
+
function getDefaultValues(server) {
|
|
302
|
+
return Object.fromEntries(Object.entries(server.variables ?? {}).map(([k, v])=>[
|
|
303
|
+
k,
|
|
304
|
+
v.default
|
|
305
|
+
]));
|
|
306
|
+
}
|
|
307
|
+
|
|
308
|
+
function getUrl(url, variables) {
|
|
309
|
+
let out = url;
|
|
310
|
+
for (const [key, value] of Object.entries(variables)){
|
|
311
|
+
out = out.replaceAll(`{${key}}`, value);
|
|
312
|
+
}
|
|
313
|
+
return out;
|
|
314
|
+
}
|
|
315
|
+
|
|
316
|
+
const SchemaContext = /*#__PURE__*/ createContext(undefined);
|
|
317
|
+
function useSchemaContext() {
|
|
318
|
+
const ctx = useContext(SchemaContext);
|
|
319
|
+
if (!ctx) throw new Error('Missing provider');
|
|
320
|
+
return ctx;
|
|
321
|
+
}
|
|
322
|
+
|
|
323
|
+
const APIPlayground = dynamic(()=>import('./index-client-D_ZwIB_V.js').then(function (n) { return n.i; }).then((mod)=>mod.APIPlayground));
|
|
324
|
+
const ServerSelect = dynamic(()=>import('./server-select-client-prQnF0hV.js'));
|
|
325
|
+
function Root({ children, baseUrl, className, shikiOptions, servers, ...props }) {
|
|
326
|
+
return /*#__PURE__*/ jsx("div", {
|
|
327
|
+
className: cn('flex flex-col gap-24 text-sm text-fd-muted-foreground', className),
|
|
328
|
+
...props,
|
|
329
|
+
children: /*#__PURE__*/ jsx(ApiProvider, {
|
|
330
|
+
servers: servers,
|
|
331
|
+
shikiOptions: shikiOptions,
|
|
332
|
+
defaultBaseUrl: baseUrl,
|
|
333
|
+
children: children
|
|
334
|
+
})
|
|
335
|
+
});
|
|
336
|
+
}
|
|
337
|
+
function CopyRouteButton({ className, route, ...props }) {
|
|
338
|
+
const { serverRef } = useApiContext();
|
|
339
|
+
const [checked, onCopy] = useCopyButton(()=>{
|
|
340
|
+
void navigator.clipboard.writeText(`${serverRef.current ? getUrl(serverRef.current.url, serverRef.current.variables) : ''}${route}`);
|
|
341
|
+
});
|
|
342
|
+
return /*#__PURE__*/ jsx("button", {
|
|
343
|
+
type: "button",
|
|
344
|
+
className: cn(buttonVariants({
|
|
345
|
+
color: 'ghost',
|
|
346
|
+
className
|
|
347
|
+
})),
|
|
348
|
+
onClick: onCopy,
|
|
349
|
+
"aria-label": "Copy route path",
|
|
350
|
+
...props,
|
|
351
|
+
children: checked ? /*#__PURE__*/ jsx(Check, {
|
|
352
|
+
className: "size-full"
|
|
353
|
+
}) : /*#__PURE__*/ jsx(Copy, {
|
|
354
|
+
className: "size-full"
|
|
355
|
+
})
|
|
356
|
+
});
|
|
357
|
+
}
|
|
358
|
+
|
|
359
|
+
export { APIPlayground as A, ChevronDown as C, Plus as P, Root as R, SchemaContext as S, Trash2 as T, Check as a, ChevronUp as b, CircleCheck as c, CircleX as d, useApiContext as e, useServerSelectContext as f, getUrl as g, CopyRouteButton as h, ServerSelect as i, useSchemaContext as u };
|
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
|
+
import * as React from 'react';
|
|
3
4
|
import { forwardRef, useId, createContext, useContext, useState, useCallback, useRef, useEffect, useMemo } from 'react';
|
|
4
5
|
import { FormProvider, Controller, useFormContext, useFieldArray, useForm, useWatch } from 'react-hook-form';
|
|
5
6
|
import { Collapsible, CollapsibleTrigger, CollapsibleContent } from 'fumadocs-ui/components/ui/collapsible';
|
|
6
7
|
import { cn, buttonVariants } from 'fumadocs-ui/components/api';
|
|
7
|
-
import {
|
|
8
|
+
import { C as ChevronDown, a as Check, b as ChevronUp, u as useSchemaContext, T as Trash2, P as Plus, c as CircleCheck, d as CircleX, e as useApiContext, S as SchemaContext, g as getUrl } from './client-client-B0hpK9b7.js';
|
|
8
9
|
import { Slot } from '@radix-ui/react-slot';
|
|
9
10
|
import { cva } from 'class-variance-authority';
|
|
10
11
|
import { useOnChange } from 'fumadocs-core/utils/use-on-change';
|
|
12
|
+
import * as SelectPrimitive from '@radix-ui/react-select';
|
|
11
13
|
import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
|
|
12
14
|
|
|
13
15
|
const Form = FormProvider;
|
|
@@ -121,6 +123,98 @@ function getDefaultValues(field, context) {
|
|
|
121
123
|
]));
|
|
122
124
|
}
|
|
123
125
|
|
|
126
|
+
const Select = SelectPrimitive.Root;
|
|
127
|
+
const SelectValue = SelectPrimitive.Value;
|
|
128
|
+
const SelectTrigger = /*#__PURE__*/ forwardRef(({ className, children, ...props }, ref)=>/*#__PURE__*/ jsxs(SelectPrimitive.Trigger, {
|
|
129
|
+
ref: ref,
|
|
130
|
+
className: cn('flex h-10 items-center rounded-md border px-3 py-2 text-start text-sm text-fd-foreground hover:bg-fd-accent focus:outline-none focus:ring-2 focus:ring-fd-ring disabled:cursor-not-allowed disabled:opacity-50', className),
|
|
131
|
+
...props,
|
|
132
|
+
children: [
|
|
133
|
+
children,
|
|
134
|
+
/*#__PURE__*/ jsx(SelectPrimitive.Icon, {
|
|
135
|
+
asChild: true,
|
|
136
|
+
children: /*#__PURE__*/ jsx(ChevronDown, {
|
|
137
|
+
className: "ms-auto size-4 text-fd-muted-foreground"
|
|
138
|
+
})
|
|
139
|
+
})
|
|
140
|
+
]
|
|
141
|
+
}));
|
|
142
|
+
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
143
|
+
const SelectScrollUpButton = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(SelectPrimitive.ScrollUpButton, {
|
|
144
|
+
ref: ref,
|
|
145
|
+
className: cn('flex items-center justify-center py-1', className),
|
|
146
|
+
...props,
|
|
147
|
+
children: /*#__PURE__*/ jsx(ChevronUp, {
|
|
148
|
+
className: "size-4"
|
|
149
|
+
})
|
|
150
|
+
}));
|
|
151
|
+
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
152
|
+
const SelectScrollDownButton = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(SelectPrimitive.ScrollDownButton, {
|
|
153
|
+
ref: ref,
|
|
154
|
+
className: cn('flex items-center justify-center py-1', className),
|
|
155
|
+
...props,
|
|
156
|
+
children: /*#__PURE__*/ jsx(ChevronDown, {
|
|
157
|
+
className: "size-4"
|
|
158
|
+
})
|
|
159
|
+
}));
|
|
160
|
+
SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
|
|
161
|
+
const SelectContent = /*#__PURE__*/ forwardRef(({ className, children, position = 'popper', ...props }, ref)=>/*#__PURE__*/ jsx(SelectPrimitive.Portal, {
|
|
162
|
+
children: /*#__PURE__*/ jsxs(SelectPrimitive.Content, {
|
|
163
|
+
ref: ref,
|
|
164
|
+
className: cn('z-50 overflow-hidden rounded-lg border bg-fd-popover text-fd-popover-foreground shadow-md data-[state=closed]:animate-fd-popover-out data-[state=open]:animate-fd-popover-in', className),
|
|
165
|
+
position: position,
|
|
166
|
+
...props,
|
|
167
|
+
children: [
|
|
168
|
+
/*#__PURE__*/ jsx(SelectScrollUpButton, {}),
|
|
169
|
+
/*#__PURE__*/ jsx(SelectPrimitive.Viewport, {
|
|
170
|
+
className: cn('p-1', position === 'popper' && 'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'),
|
|
171
|
+
children: children
|
|
172
|
+
}),
|
|
173
|
+
/*#__PURE__*/ jsx(SelectScrollDownButton, {})
|
|
174
|
+
]
|
|
175
|
+
})
|
|
176
|
+
}));
|
|
177
|
+
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
178
|
+
const SelectLabel = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(SelectPrimitive.Label, {
|
|
179
|
+
ref: ref,
|
|
180
|
+
className: cn('py-1.5 pe-2 ps-6 text-sm font-semibold', className),
|
|
181
|
+
...props
|
|
182
|
+
}));
|
|
183
|
+
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
|
184
|
+
const SelectItem = /*#__PURE__*/ forwardRef(({ className, children, ...props }, ref)=>/*#__PURE__*/ jsxs(SelectPrimitive.Item, {
|
|
185
|
+
ref: ref,
|
|
186
|
+
className: cn('flex select-none flex-row items-center rounded-md py-1.5 pe-2 ps-6 text-sm outline-none focus:bg-fd-accent focus:text-fd-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', className),
|
|
187
|
+
...props,
|
|
188
|
+
children: [
|
|
189
|
+
/*#__PURE__*/ jsx(SelectPrimitive.ItemIndicator, {
|
|
190
|
+
className: "absolute start-2",
|
|
191
|
+
children: /*#__PURE__*/ jsx(Check, {
|
|
192
|
+
className: "size-4"
|
|
193
|
+
})
|
|
194
|
+
}),
|
|
195
|
+
/*#__PURE__*/ jsx(SelectPrimitive.ItemText, {
|
|
196
|
+
children: children
|
|
197
|
+
})
|
|
198
|
+
]
|
|
199
|
+
}));
|
|
200
|
+
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
201
|
+
const SelectSeparator = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(SelectPrimitive.Separator, {
|
|
202
|
+
ref: ref,
|
|
203
|
+
className: cn('my-1 h-px bg-fd-muted', className),
|
|
204
|
+
...props
|
|
205
|
+
}));
|
|
206
|
+
SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
|
|
207
|
+
|
|
208
|
+
const Input = /*#__PURE__*/ React.forwardRef(({ className, type, ...props }, ref)=>{
|
|
209
|
+
return /*#__PURE__*/ jsx("input", {
|
|
210
|
+
type: type,
|
|
211
|
+
className: cn('flex h-9 w-full rounded-md border bg-transparent px-2 py-1.5 text-sm text-fd-foreground transition-colors placeholder:text-fd-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-fd-ring disabled:cursor-not-allowed disabled:opacity-50', className),
|
|
212
|
+
ref: ref,
|
|
213
|
+
...props
|
|
214
|
+
});
|
|
215
|
+
});
|
|
216
|
+
Input.displayName = 'Input';
|
|
217
|
+
|
|
124
218
|
function renderInner({ field, ...props }) {
|
|
125
219
|
if (field.type === 'object') return /*#__PURE__*/ jsx(ObjectInput, {
|
|
126
220
|
field: field,
|
|
@@ -645,7 +739,7 @@ function APIPlayground({ route, method = 'GET', authorization, path = [], header
|
|
|
645
739
|
}
|
|
646
740
|
});
|
|
647
741
|
const testQuery = useQuery(async (input)=>{
|
|
648
|
-
const fetcher = await import('./fetcher-
|
|
742
|
+
const fetcher = await import('./fetcher-CsyGTBlt.js').then((mod)=>mod.createBrowserFetcher(body, schemas));
|
|
649
743
|
const serverUrl = serverRef.current ? getUrl(serverRef.current.url, serverRef.current.variables) : window.location.origin;
|
|
650
744
|
let url = `${serverUrl}${createPathnameFromInput(route, input.path, input.query)}`;
|
|
651
745
|
if (proxyUrl) {
|
|
@@ -871,4 +965,4 @@ var index = {
|
|
|
871
965
|
APIPlayground: APIPlayground
|
|
872
966
|
};
|
|
873
967
|
|
|
874
|
-
export { index as i, resolve as r };
|
|
968
|
+
export { Input as I, Select as S, SelectTrigger as a, SelectValue as b, SelectContent as c, SelectItem as d, index as i, resolve as r };
|
package/dist/ui/index.js
CHANGED
|
@@ -3,8 +3,8 @@ import { cn } from 'fumadocs-ui/components/api';
|
|
|
3
3
|
import { Fragment } from 'react';
|
|
4
4
|
import { Accordions, Accordion } from 'fumadocs-ui/components/accordion';
|
|
5
5
|
import { cva } from 'class-variance-authority';
|
|
6
|
-
import {
|
|
7
|
-
export { A as APIPlayground, R as Root, u as useSchemaContext } from './client-client-
|
|
6
|
+
import { h as CopyRouteButton, i as ServerSelect } from './client-client-B0hpK9b7.js';
|
|
7
|
+
export { A as APIPlayground, R as Root, u as useSchemaContext } from './client-client-B0hpK9b7.js';
|
|
8
8
|
|
|
9
9
|
const badgeVariants = cva('rounded-xl border px-1.5 py-1 text-xs font-medium leading-[12px]', {
|
|
10
10
|
variants: {
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { e as useApiContext, f as useServerSelectContext, C as ChevronDown } from './client-client-B0hpK9b7.js';
|
|
4
|
+
import { Collapsible, CollapsibleTrigger, CollapsibleContent } from 'fumadocs-ui/components/ui/collapsible';
|
|
5
|
+
import { S as Select, a as SelectTrigger, b as SelectValue, c as SelectContent, d as SelectItem, I as Input } from './index-client-D_ZwIB_V.js';
|
|
6
|
+
|
|
7
|
+
function ServerSelect() {
|
|
8
|
+
const { servers } = useApiContext();
|
|
9
|
+
const { server, setServer, setServerVariables } = useServerSelectContext();
|
|
10
|
+
if (servers.length <= 1) return null;
|
|
11
|
+
const schema = server ? servers.find((item)=>item.url === server.url) : undefined;
|
|
12
|
+
return /*#__PURE__*/ jsxs(Collapsible, {
|
|
13
|
+
className: "-m-2 mt-2",
|
|
14
|
+
children: [
|
|
15
|
+
/*#__PURE__*/ jsxs(CollapsibleTrigger, {
|
|
16
|
+
className: "flex w-full flex-row items-center justify-between p-2 text-xs font-medium text-fd-muted-foreground",
|
|
17
|
+
children: [
|
|
18
|
+
"Configure Server",
|
|
19
|
+
/*#__PURE__*/ jsx(ChevronDown, {
|
|
20
|
+
className: "size-4"
|
|
21
|
+
})
|
|
22
|
+
]
|
|
23
|
+
}),
|
|
24
|
+
/*#__PURE__*/ jsx(CollapsibleContent, {
|
|
25
|
+
children: /*#__PURE__*/ jsxs("div", {
|
|
26
|
+
className: "flex flex-col gap-4 p-2",
|
|
27
|
+
children: [
|
|
28
|
+
/*#__PURE__*/ jsxs(Select, {
|
|
29
|
+
value: server?.url,
|
|
30
|
+
onValueChange: setServer,
|
|
31
|
+
children: [
|
|
32
|
+
/*#__PURE__*/ jsx(SelectTrigger, {
|
|
33
|
+
className: "h-auto break-all",
|
|
34
|
+
children: /*#__PURE__*/ jsx(SelectValue, {})
|
|
35
|
+
}),
|
|
36
|
+
/*#__PURE__*/ jsx(SelectContent, {
|
|
37
|
+
children: servers.map((item)=>/*#__PURE__*/ jsxs(SelectItem, {
|
|
38
|
+
value: item.url,
|
|
39
|
+
children: [
|
|
40
|
+
item.url,
|
|
41
|
+
/*#__PURE__*/ jsx("p", {
|
|
42
|
+
className: "text-start text-xs text-fd-muted-foreground",
|
|
43
|
+
children: item.description
|
|
44
|
+
})
|
|
45
|
+
]
|
|
46
|
+
}, item.url))
|
|
47
|
+
})
|
|
48
|
+
]
|
|
49
|
+
}),
|
|
50
|
+
Object.entries(schema?.variables ?? {}).map(([key, variable])=>{
|
|
51
|
+
if (!server) return;
|
|
52
|
+
const id = `fd_server_select_${key}`;
|
|
53
|
+
return /*#__PURE__*/ jsxs("fieldset", {
|
|
54
|
+
className: "flex flex-col gap-1",
|
|
55
|
+
children: [
|
|
56
|
+
/*#__PURE__*/ jsx("label", {
|
|
57
|
+
className: "font-mono text-xs text-fd-foreground",
|
|
58
|
+
htmlFor: id,
|
|
59
|
+
children: key
|
|
60
|
+
}),
|
|
61
|
+
/*#__PURE__*/ jsx("p", {
|
|
62
|
+
className: "text-xs text-fd-muted-foreground empty:hidden",
|
|
63
|
+
children: variable.description
|
|
64
|
+
}),
|
|
65
|
+
variable.enum ? /*#__PURE__*/ jsxs(Select, {
|
|
66
|
+
value: server.variables[key],
|
|
67
|
+
onValueChange: (v)=>setServerVariables({
|
|
68
|
+
...server?.variables,
|
|
69
|
+
[key]: v
|
|
70
|
+
}),
|
|
71
|
+
children: [
|
|
72
|
+
/*#__PURE__*/ jsx(SelectTrigger, {
|
|
73
|
+
id: id,
|
|
74
|
+
children: /*#__PURE__*/ jsx(SelectValue, {})
|
|
75
|
+
}),
|
|
76
|
+
/*#__PURE__*/ jsx(SelectContent, {
|
|
77
|
+
children: variable.enum.map((value)=>/*#__PURE__*/ jsx(SelectItem, {
|
|
78
|
+
value: value,
|
|
79
|
+
children: value
|
|
80
|
+
}, value))
|
|
81
|
+
})
|
|
82
|
+
]
|
|
83
|
+
}) : /*#__PURE__*/ jsx(Input, {
|
|
84
|
+
id: id,
|
|
85
|
+
value: server.variables[key],
|
|
86
|
+
onChange: (e)=>setServerVariables({
|
|
87
|
+
...server?.variables,
|
|
88
|
+
[key]: e.target.value
|
|
89
|
+
})
|
|
90
|
+
})
|
|
91
|
+
]
|
|
92
|
+
}, key);
|
|
93
|
+
})
|
|
94
|
+
]
|
|
95
|
+
})
|
|
96
|
+
})
|
|
97
|
+
]
|
|
98
|
+
});
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
export { ServerSelect as default };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "fumadocs-openapi",
|
|
3
|
-
"version": "5.11.
|
|
3
|
+
"version": "5.11.5",
|
|
4
4
|
"description": "Generate MDX docs for your OpenAPI spec",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"NextJs",
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
"@fumari/json-schema-to-typescript": "^1.1.2",
|
|
35
35
|
"@radix-ui/react-select": "^2.1.4",
|
|
36
36
|
"@radix-ui/react-slot": "^1.1.1",
|
|
37
|
-
"@scalar/openapi-parser": "0.10.
|
|
37
|
+
"@scalar/openapi-parser": "0.10.3",
|
|
38
38
|
"ajv-draft-04": "^1.0.0",
|
|
39
39
|
"class-variance-authority": "^0.7.1",
|
|
40
40
|
"fast-glob": "^3.3.3",
|
|
@@ -45,18 +45,18 @@
|
|
|
45
45
|
"react-hook-form": "^7.54.2",
|
|
46
46
|
"remark": "^15.0.1",
|
|
47
47
|
"remark-rehype": "^11.1.1",
|
|
48
|
-
"shiki": "^1.
|
|
48
|
+
"shiki": "^1.27.0",
|
|
49
49
|
"xml-js": "^1.6.11",
|
|
50
|
-
"fumadocs-core": "14.7.
|
|
51
|
-
"fumadocs-ui": "14.7.
|
|
50
|
+
"fumadocs-core": "14.7.4",
|
|
51
|
+
"fumadocs-ui": "14.7.4"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
54
|
"@types/js-yaml": "^4.0.9",
|
|
55
|
-
"@types/node": "22.10.
|
|
55
|
+
"@types/node": "22.10.6",
|
|
56
56
|
"@types/openapi-sampler": "^1.0.3",
|
|
57
|
-
"@types/react": "^19.0.
|
|
58
|
-
"bunchee": "^6.
|
|
59
|
-
"lucide-react": "^0.
|
|
57
|
+
"@types/react": "^19.0.7",
|
|
58
|
+
"bunchee": "^6.3.1",
|
|
59
|
+
"lucide-react": "^0.471.1",
|
|
60
60
|
"next": "15.1.4",
|
|
61
61
|
"openapi-types": "^12.1.3",
|
|
62
62
|
"eslint-config-custom": "0.0.0",
|
|
@@ -1,538 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import { forwardRef, createElement, useContext, createContext, useState, useRef, useEffect, useMemo } from 'react';
|
|
4
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
5
|
-
import { cn, useCopyButton, buttonVariants } from 'fumadocs-ui/components/api';
|
|
6
|
-
import dynamic from 'next/dynamic';
|
|
7
|
-
import * as SelectPrimitive from '@radix-ui/react-select';
|
|
8
|
-
import { Collapsible, CollapsibleTrigger, CollapsibleContent } from 'fumadocs-ui/components/ui/collapsible';
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* @license lucide-react v0.469.0 - ISC
|
|
12
|
-
*
|
|
13
|
-
* This source code is licensed under the ISC license.
|
|
14
|
-
* See the LICENSE file in the root directory of this source tree.
|
|
15
|
-
*/ const toKebabCase = (string)=>string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
|
|
16
|
-
const mergeClasses = (...classes)=>classes.filter((className, index, array)=>{
|
|
17
|
-
return Boolean(className) && className.trim() !== "" && array.indexOf(className) === index;
|
|
18
|
-
}).join(" ").trim();
|
|
19
|
-
|
|
20
|
-
/**
|
|
21
|
-
* @license lucide-react v0.469.0 - ISC
|
|
22
|
-
*
|
|
23
|
-
* This source code is licensed under the ISC license.
|
|
24
|
-
* See the LICENSE file in the root directory of this source tree.
|
|
25
|
-
*/ var defaultAttributes = {
|
|
26
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
27
|
-
width: 24,
|
|
28
|
-
height: 24,
|
|
29
|
-
viewBox: "0 0 24 24",
|
|
30
|
-
fill: "none",
|
|
31
|
-
stroke: "currentColor",
|
|
32
|
-
strokeWidth: 2,
|
|
33
|
-
strokeLinecap: "round",
|
|
34
|
-
strokeLinejoin: "round"
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
const Icon = /*#__PURE__*/ forwardRef(({ color = "currentColor", size = 24, strokeWidth = 2, absoluteStrokeWidth, className = "", children, iconNode, ...rest }, ref)=>{
|
|
38
|
-
return /*#__PURE__*/ createElement("svg", {
|
|
39
|
-
ref,
|
|
40
|
-
...defaultAttributes,
|
|
41
|
-
width: size,
|
|
42
|
-
height: size,
|
|
43
|
-
stroke: color,
|
|
44
|
-
strokeWidth: absoluteStrokeWidth ? Number(strokeWidth) * 24 / Number(size) : strokeWidth,
|
|
45
|
-
className: mergeClasses("lucide", className),
|
|
46
|
-
...rest
|
|
47
|
-
}, [
|
|
48
|
-
...iconNode.map(([tag, attrs])=>/*#__PURE__*/ createElement(tag, attrs)),
|
|
49
|
-
...Array.isArray(children) ? children : [
|
|
50
|
-
children
|
|
51
|
-
]
|
|
52
|
-
]);
|
|
53
|
-
});
|
|
54
|
-
|
|
55
|
-
const createLucideIcon = (iconName, iconNode)=>{
|
|
56
|
-
const Component = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ createElement(Icon, {
|
|
57
|
-
ref,
|
|
58
|
-
iconNode,
|
|
59
|
-
className: mergeClasses(`lucide-${toKebabCase(iconName)}`, className),
|
|
60
|
-
...props
|
|
61
|
-
}));
|
|
62
|
-
Component.displayName = `${iconName}`;
|
|
63
|
-
return Component;
|
|
64
|
-
};
|
|
65
|
-
|
|
66
|
-
const Check = createLucideIcon("Check", [
|
|
67
|
-
[
|
|
68
|
-
"path",
|
|
69
|
-
{
|
|
70
|
-
d: "M20 6 9 17l-5-5",
|
|
71
|
-
key: "1gmf2c"
|
|
72
|
-
}
|
|
73
|
-
]
|
|
74
|
-
]);
|
|
75
|
-
|
|
76
|
-
const ChevronDown = createLucideIcon("ChevronDown", [
|
|
77
|
-
[
|
|
78
|
-
"path",
|
|
79
|
-
{
|
|
80
|
-
d: "m6 9 6 6 6-6",
|
|
81
|
-
key: "qrunsl"
|
|
82
|
-
}
|
|
83
|
-
]
|
|
84
|
-
]);
|
|
85
|
-
|
|
86
|
-
const ChevronUp = createLucideIcon("ChevronUp", [
|
|
87
|
-
[
|
|
88
|
-
"path",
|
|
89
|
-
{
|
|
90
|
-
d: "m18 15-6-6-6 6",
|
|
91
|
-
key: "153udz"
|
|
92
|
-
}
|
|
93
|
-
]
|
|
94
|
-
]);
|
|
95
|
-
|
|
96
|
-
const CircleCheck = createLucideIcon("CircleCheck", [
|
|
97
|
-
[
|
|
98
|
-
"circle",
|
|
99
|
-
{
|
|
100
|
-
cx: "12",
|
|
101
|
-
cy: "12",
|
|
102
|
-
r: "10",
|
|
103
|
-
key: "1mglay"
|
|
104
|
-
}
|
|
105
|
-
],
|
|
106
|
-
[
|
|
107
|
-
"path",
|
|
108
|
-
{
|
|
109
|
-
d: "m9 12 2 2 4-4",
|
|
110
|
-
key: "dzmm74"
|
|
111
|
-
}
|
|
112
|
-
]
|
|
113
|
-
]);
|
|
114
|
-
|
|
115
|
-
const CircleX = createLucideIcon("CircleX", [
|
|
116
|
-
[
|
|
117
|
-
"circle",
|
|
118
|
-
{
|
|
119
|
-
cx: "12",
|
|
120
|
-
cy: "12",
|
|
121
|
-
r: "10",
|
|
122
|
-
key: "1mglay"
|
|
123
|
-
}
|
|
124
|
-
],
|
|
125
|
-
[
|
|
126
|
-
"path",
|
|
127
|
-
{
|
|
128
|
-
d: "m15 9-6 6",
|
|
129
|
-
key: "1uzhvr"
|
|
130
|
-
}
|
|
131
|
-
],
|
|
132
|
-
[
|
|
133
|
-
"path",
|
|
134
|
-
{
|
|
135
|
-
d: "m9 9 6 6",
|
|
136
|
-
key: "z0biqf"
|
|
137
|
-
}
|
|
138
|
-
]
|
|
139
|
-
]);
|
|
140
|
-
|
|
141
|
-
const Copy = createLucideIcon("Copy", [
|
|
142
|
-
[
|
|
143
|
-
"rect",
|
|
144
|
-
{
|
|
145
|
-
width: "14",
|
|
146
|
-
height: "14",
|
|
147
|
-
x: "8",
|
|
148
|
-
y: "8",
|
|
149
|
-
rx: "2",
|
|
150
|
-
ry: "2",
|
|
151
|
-
key: "17jyea"
|
|
152
|
-
}
|
|
153
|
-
],
|
|
154
|
-
[
|
|
155
|
-
"path",
|
|
156
|
-
{
|
|
157
|
-
d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2",
|
|
158
|
-
key: "zix9uf"
|
|
159
|
-
}
|
|
160
|
-
]
|
|
161
|
-
]);
|
|
162
|
-
|
|
163
|
-
const Plus = createLucideIcon("Plus", [
|
|
164
|
-
[
|
|
165
|
-
"path",
|
|
166
|
-
{
|
|
167
|
-
d: "M5 12h14",
|
|
168
|
-
key: "1ays0h"
|
|
169
|
-
}
|
|
170
|
-
],
|
|
171
|
-
[
|
|
172
|
-
"path",
|
|
173
|
-
{
|
|
174
|
-
d: "M12 5v14",
|
|
175
|
-
key: "s699le"
|
|
176
|
-
}
|
|
177
|
-
]
|
|
178
|
-
]);
|
|
179
|
-
|
|
180
|
-
const Trash2 = createLucideIcon("Trash2", [
|
|
181
|
-
[
|
|
182
|
-
"path",
|
|
183
|
-
{
|
|
184
|
-
d: "M3 6h18",
|
|
185
|
-
key: "d0wm0j"
|
|
186
|
-
}
|
|
187
|
-
],
|
|
188
|
-
[
|
|
189
|
-
"path",
|
|
190
|
-
{
|
|
191
|
-
d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6",
|
|
192
|
-
key: "4alrt4"
|
|
193
|
-
}
|
|
194
|
-
],
|
|
195
|
-
[
|
|
196
|
-
"path",
|
|
197
|
-
{
|
|
198
|
-
d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2",
|
|
199
|
-
key: "v07s0e"
|
|
200
|
-
}
|
|
201
|
-
],
|
|
202
|
-
[
|
|
203
|
-
"line",
|
|
204
|
-
{
|
|
205
|
-
x1: "10",
|
|
206
|
-
x2: "10",
|
|
207
|
-
y1: "11",
|
|
208
|
-
y2: "17",
|
|
209
|
-
key: "1uufr5"
|
|
210
|
-
}
|
|
211
|
-
],
|
|
212
|
-
[
|
|
213
|
-
"line",
|
|
214
|
-
{
|
|
215
|
-
x1: "14",
|
|
216
|
-
x2: "14",
|
|
217
|
-
y1: "11",
|
|
218
|
-
y2: "17",
|
|
219
|
-
key: "xtxkd"
|
|
220
|
-
}
|
|
221
|
-
]
|
|
222
|
-
]);
|
|
223
|
-
|
|
224
|
-
const ApiContext = /*#__PURE__*/ createContext(undefined);
|
|
225
|
-
const ServerSelectContext = /*#__PURE__*/ createContext(undefined);
|
|
226
|
-
function useApiContext() {
|
|
227
|
-
const ctx = useContext(ApiContext);
|
|
228
|
-
if (!ctx) throw new Error('Component must be used under <ApiProvider />');
|
|
229
|
-
return ctx;
|
|
230
|
-
}
|
|
231
|
-
function useServerSelectContext() {
|
|
232
|
-
const ctx = useContext(ServerSelectContext);
|
|
233
|
-
if (!ctx) throw new Error('Component must be used under <ApiProvider />');
|
|
234
|
-
return ctx;
|
|
235
|
-
}
|
|
236
|
-
function ApiProvider({ defaultBaseUrl, children, ...props }) {
|
|
237
|
-
const [server, setServer] = useState(()=>{
|
|
238
|
-
const defaultItem = defaultBaseUrl ? props.servers.find((item)=>item.url === defaultBaseUrl) : undefined;
|
|
239
|
-
return defaultItem ? {
|
|
240
|
-
url: defaultItem.url,
|
|
241
|
-
variables: getDefaultValues(defaultItem)
|
|
242
|
-
} : null;
|
|
243
|
-
});
|
|
244
|
-
const serverRef = useRef(server);
|
|
245
|
-
serverRef.current = server;
|
|
246
|
-
useEffect(()=>{
|
|
247
|
-
const cached = localStorage.getItem('apiBaseUrl');
|
|
248
|
-
if (!cached) return;
|
|
249
|
-
try {
|
|
250
|
-
const obj = JSON.parse(cached);
|
|
251
|
-
if (!obj || typeof obj !== 'object') return;
|
|
252
|
-
setServer(obj);
|
|
253
|
-
} catch {
|
|
254
|
-
// ignore
|
|
255
|
-
}
|
|
256
|
-
}, []);
|
|
257
|
-
return /*#__PURE__*/ jsx(ApiContext.Provider, {
|
|
258
|
-
value: useMemo(()=>({
|
|
259
|
-
...props,
|
|
260
|
-
serverRef
|
|
261
|
-
}), [
|
|
262
|
-
props
|
|
263
|
-
]),
|
|
264
|
-
children: /*#__PURE__*/ jsx(ServerSelectContext.Provider, {
|
|
265
|
-
value: useMemo(()=>({
|
|
266
|
-
server,
|
|
267
|
-
setServerVariables (variables) {
|
|
268
|
-
setServer((prev)=>{
|
|
269
|
-
if (!prev) return null;
|
|
270
|
-
const updated = {
|
|
271
|
-
...prev,
|
|
272
|
-
variables
|
|
273
|
-
};
|
|
274
|
-
localStorage.setItem('apiBaseUrl', JSON.stringify(updated));
|
|
275
|
-
return updated;
|
|
276
|
-
});
|
|
277
|
-
},
|
|
278
|
-
setServer (value) {
|
|
279
|
-
const obj = props.servers.find((item)=>item.url === value);
|
|
280
|
-
if (!obj) return;
|
|
281
|
-
const result = {
|
|
282
|
-
url: value,
|
|
283
|
-
variables: getDefaultValues(obj)
|
|
284
|
-
};
|
|
285
|
-
localStorage.setItem('apiBaseUrl', JSON.stringify(result));
|
|
286
|
-
setServer(result);
|
|
287
|
-
}
|
|
288
|
-
}), [
|
|
289
|
-
server,
|
|
290
|
-
props.servers
|
|
291
|
-
]),
|
|
292
|
-
children: children
|
|
293
|
-
})
|
|
294
|
-
});
|
|
295
|
-
}
|
|
296
|
-
function getDefaultValues(server) {
|
|
297
|
-
return Object.fromEntries(Object.entries(server.variables ?? {}).map(([k, v])=>[
|
|
298
|
-
k,
|
|
299
|
-
v.default
|
|
300
|
-
]));
|
|
301
|
-
}
|
|
302
|
-
|
|
303
|
-
const Input = /*#__PURE__*/ React.forwardRef(({ className, type, ...props }, ref)=>{
|
|
304
|
-
return /*#__PURE__*/ jsx("input", {
|
|
305
|
-
type: type,
|
|
306
|
-
className: cn('flex h-9 w-full rounded-md border bg-transparent px-2 py-1.5 text-sm text-fd-foreground transition-colors placeholder:text-fd-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-fd-ring disabled:cursor-not-allowed disabled:opacity-50', className),
|
|
307
|
-
ref: ref,
|
|
308
|
-
...props
|
|
309
|
-
});
|
|
310
|
-
});
|
|
311
|
-
Input.displayName = 'Input';
|
|
312
|
-
|
|
313
|
-
const Select = SelectPrimitive.Root;
|
|
314
|
-
const SelectValue = SelectPrimitive.Value;
|
|
315
|
-
const SelectTrigger = /*#__PURE__*/ forwardRef(({ className, children, ...props }, ref)=>/*#__PURE__*/ jsxs(SelectPrimitive.Trigger, {
|
|
316
|
-
ref: ref,
|
|
317
|
-
className: cn('flex h-10 items-center rounded-md border px-3 py-2 text-start text-sm text-fd-foreground hover:bg-fd-accent focus:outline-none focus:ring-2 focus:ring-fd-ring disabled:cursor-not-allowed disabled:opacity-50', className),
|
|
318
|
-
...props,
|
|
319
|
-
children: [
|
|
320
|
-
children,
|
|
321
|
-
/*#__PURE__*/ jsx(SelectPrimitive.Icon, {
|
|
322
|
-
asChild: true,
|
|
323
|
-
children: /*#__PURE__*/ jsx(ChevronDown, {
|
|
324
|
-
className: "ms-auto size-4 text-fd-muted-foreground"
|
|
325
|
-
})
|
|
326
|
-
})
|
|
327
|
-
]
|
|
328
|
-
}));
|
|
329
|
-
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
330
|
-
const SelectScrollUpButton = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(SelectPrimitive.ScrollUpButton, {
|
|
331
|
-
ref: ref,
|
|
332
|
-
className: cn('flex items-center justify-center py-1', className),
|
|
333
|
-
...props,
|
|
334
|
-
children: /*#__PURE__*/ jsx(ChevronUp, {
|
|
335
|
-
className: "size-4"
|
|
336
|
-
})
|
|
337
|
-
}));
|
|
338
|
-
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
339
|
-
const SelectScrollDownButton = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(SelectPrimitive.ScrollDownButton, {
|
|
340
|
-
ref: ref,
|
|
341
|
-
className: cn('flex items-center justify-center py-1', className),
|
|
342
|
-
...props,
|
|
343
|
-
children: /*#__PURE__*/ jsx(ChevronDown, {
|
|
344
|
-
className: "size-4"
|
|
345
|
-
})
|
|
346
|
-
}));
|
|
347
|
-
SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
|
|
348
|
-
const SelectContent = /*#__PURE__*/ forwardRef(({ className, children, position = 'popper', ...props }, ref)=>/*#__PURE__*/ jsx(SelectPrimitive.Portal, {
|
|
349
|
-
children: /*#__PURE__*/ jsxs(SelectPrimitive.Content, {
|
|
350
|
-
ref: ref,
|
|
351
|
-
className: cn('z-50 overflow-hidden rounded-lg border bg-fd-popover text-fd-popover-foreground shadow-md data-[state=closed]:animate-fd-popover-out data-[state=open]:animate-fd-popover-in', className),
|
|
352
|
-
position: position,
|
|
353
|
-
...props,
|
|
354
|
-
children: [
|
|
355
|
-
/*#__PURE__*/ jsx(SelectScrollUpButton, {}),
|
|
356
|
-
/*#__PURE__*/ jsx(SelectPrimitive.Viewport, {
|
|
357
|
-
className: cn('p-1', position === 'popper' && 'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'),
|
|
358
|
-
children: children
|
|
359
|
-
}),
|
|
360
|
-
/*#__PURE__*/ jsx(SelectScrollDownButton, {})
|
|
361
|
-
]
|
|
362
|
-
})
|
|
363
|
-
}));
|
|
364
|
-
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
365
|
-
const SelectLabel = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(SelectPrimitive.Label, {
|
|
366
|
-
ref: ref,
|
|
367
|
-
className: cn('py-1.5 pe-2 ps-6 text-sm font-semibold', className),
|
|
368
|
-
...props
|
|
369
|
-
}));
|
|
370
|
-
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
|
371
|
-
const SelectItem = /*#__PURE__*/ forwardRef(({ className, children, ...props }, ref)=>/*#__PURE__*/ jsxs(SelectPrimitive.Item, {
|
|
372
|
-
ref: ref,
|
|
373
|
-
className: cn('flex select-none flex-row items-center rounded-md py-1.5 pe-2 ps-6 text-sm outline-none focus:bg-fd-accent focus:text-fd-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', className),
|
|
374
|
-
...props,
|
|
375
|
-
children: [
|
|
376
|
-
/*#__PURE__*/ jsx(SelectPrimitive.ItemIndicator, {
|
|
377
|
-
className: "absolute start-2",
|
|
378
|
-
children: /*#__PURE__*/ jsx(Check, {
|
|
379
|
-
className: "size-4"
|
|
380
|
-
})
|
|
381
|
-
}),
|
|
382
|
-
/*#__PURE__*/ jsx(SelectPrimitive.ItemText, {
|
|
383
|
-
children: children
|
|
384
|
-
})
|
|
385
|
-
]
|
|
386
|
-
}));
|
|
387
|
-
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
388
|
-
const SelectSeparator = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(SelectPrimitive.Separator, {
|
|
389
|
-
ref: ref,
|
|
390
|
-
className: cn('my-1 h-px bg-fd-muted', className),
|
|
391
|
-
...props
|
|
392
|
-
}));
|
|
393
|
-
SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
|
|
394
|
-
|
|
395
|
-
function getUrl(url, variables) {
|
|
396
|
-
let out = url;
|
|
397
|
-
for (const [key, value] of Object.entries(variables)){
|
|
398
|
-
out = out.replaceAll(`{${key}}`, value);
|
|
399
|
-
}
|
|
400
|
-
return out;
|
|
401
|
-
}
|
|
402
|
-
|
|
403
|
-
const SchemaContext = /*#__PURE__*/ createContext(undefined);
|
|
404
|
-
function useSchemaContext() {
|
|
405
|
-
const ctx = useContext(SchemaContext);
|
|
406
|
-
if (!ctx) throw new Error('Missing provider');
|
|
407
|
-
return ctx;
|
|
408
|
-
}
|
|
409
|
-
|
|
410
|
-
const APIPlayground = dynamic(()=>import('./index-client-cz-xNo9A.js').then(function (n) { return n.i; }).then((mod)=>mod.APIPlayground));
|
|
411
|
-
function Root({ children, baseUrl, className, shikiOptions, servers, ...props }) {
|
|
412
|
-
return /*#__PURE__*/ jsx("div", {
|
|
413
|
-
className: cn('flex flex-col gap-24 text-sm text-fd-muted-foreground', className),
|
|
414
|
-
...props,
|
|
415
|
-
children: /*#__PURE__*/ jsx(ApiProvider, {
|
|
416
|
-
servers: servers,
|
|
417
|
-
shikiOptions: shikiOptions,
|
|
418
|
-
defaultBaseUrl: baseUrl,
|
|
419
|
-
children: children
|
|
420
|
-
})
|
|
421
|
-
});
|
|
422
|
-
}
|
|
423
|
-
function CopyRouteButton({ className, route, ...props }) {
|
|
424
|
-
const { serverRef } = useApiContext();
|
|
425
|
-
const [checked, onCopy] = useCopyButton(()=>{
|
|
426
|
-
void navigator.clipboard.writeText(`${serverRef.current ? getUrl(serverRef.current.url, serverRef.current.variables) : ''}${route}`);
|
|
427
|
-
});
|
|
428
|
-
return /*#__PURE__*/ jsx("button", {
|
|
429
|
-
type: "button",
|
|
430
|
-
className: cn(buttonVariants({
|
|
431
|
-
color: 'ghost',
|
|
432
|
-
className
|
|
433
|
-
})),
|
|
434
|
-
onClick: onCopy,
|
|
435
|
-
"aria-label": "Copy route path",
|
|
436
|
-
...props,
|
|
437
|
-
children: checked ? /*#__PURE__*/ jsx(Check, {
|
|
438
|
-
className: "size-full"
|
|
439
|
-
}) : /*#__PURE__*/ jsx(Copy, {
|
|
440
|
-
className: "size-full"
|
|
441
|
-
})
|
|
442
|
-
});
|
|
443
|
-
}
|
|
444
|
-
function ServerSelect() {
|
|
445
|
-
const { servers } = useApiContext();
|
|
446
|
-
const { server, setServer, setServerVariables } = useServerSelectContext();
|
|
447
|
-
if (servers.length <= 1) return null;
|
|
448
|
-
const schema = server ? servers.find((item)=>item.url === server.url) : undefined;
|
|
449
|
-
return /*#__PURE__*/ jsxs(Collapsible, {
|
|
450
|
-
className: "-m-2 mt-2",
|
|
451
|
-
children: [
|
|
452
|
-
/*#__PURE__*/ jsxs(CollapsibleTrigger, {
|
|
453
|
-
className: "flex w-full flex-row items-center justify-between p-2 text-xs font-medium text-fd-muted-foreground",
|
|
454
|
-
children: [
|
|
455
|
-
"Configure Server",
|
|
456
|
-
/*#__PURE__*/ jsx(ChevronDown, {
|
|
457
|
-
className: "size-4"
|
|
458
|
-
})
|
|
459
|
-
]
|
|
460
|
-
}),
|
|
461
|
-
/*#__PURE__*/ jsx(CollapsibleContent, {
|
|
462
|
-
children: /*#__PURE__*/ jsxs("div", {
|
|
463
|
-
className: "flex flex-col gap-4 p-2",
|
|
464
|
-
children: [
|
|
465
|
-
/*#__PURE__*/ jsxs(Select, {
|
|
466
|
-
value: server?.url,
|
|
467
|
-
onValueChange: setServer,
|
|
468
|
-
children: [
|
|
469
|
-
/*#__PURE__*/ jsx(SelectTrigger, {
|
|
470
|
-
className: "h-auto break-all",
|
|
471
|
-
children: /*#__PURE__*/ jsx(SelectValue, {})
|
|
472
|
-
}),
|
|
473
|
-
/*#__PURE__*/ jsx(SelectContent, {
|
|
474
|
-
children: servers.map((item)=>/*#__PURE__*/ jsxs(SelectItem, {
|
|
475
|
-
value: item.url,
|
|
476
|
-
children: [
|
|
477
|
-
item.url,
|
|
478
|
-
/*#__PURE__*/ jsx("p", {
|
|
479
|
-
className: "text-start text-xs text-fd-muted-foreground",
|
|
480
|
-
children: item.description
|
|
481
|
-
})
|
|
482
|
-
]
|
|
483
|
-
}, item.url))
|
|
484
|
-
})
|
|
485
|
-
]
|
|
486
|
-
}),
|
|
487
|
-
Object.entries(schema?.variables ?? {}).map(([key, variable])=>{
|
|
488
|
-
if (!server) return;
|
|
489
|
-
const id = `fd_server_select_${key}`;
|
|
490
|
-
return /*#__PURE__*/ jsxs("fieldset", {
|
|
491
|
-
className: "flex flex-col gap-1",
|
|
492
|
-
children: [
|
|
493
|
-
/*#__PURE__*/ jsx("label", {
|
|
494
|
-
className: "font-mono text-xs text-fd-foreground",
|
|
495
|
-
htmlFor: id,
|
|
496
|
-
children: key
|
|
497
|
-
}),
|
|
498
|
-
/*#__PURE__*/ jsx("p", {
|
|
499
|
-
className: "text-xs text-fd-muted-foreground empty:hidden",
|
|
500
|
-
children: variable.description
|
|
501
|
-
}),
|
|
502
|
-
variable.enum ? /*#__PURE__*/ jsxs(Select, {
|
|
503
|
-
value: server.variables[key],
|
|
504
|
-
onValueChange: (v)=>setServerVariables({
|
|
505
|
-
...server?.variables,
|
|
506
|
-
[key]: v
|
|
507
|
-
}),
|
|
508
|
-
children: [
|
|
509
|
-
/*#__PURE__*/ jsx(SelectTrigger, {
|
|
510
|
-
id: id,
|
|
511
|
-
children: /*#__PURE__*/ jsx(SelectValue, {})
|
|
512
|
-
}),
|
|
513
|
-
/*#__PURE__*/ jsx(SelectContent, {
|
|
514
|
-
children: variable.enum.map((value)=>/*#__PURE__*/ jsx(SelectItem, {
|
|
515
|
-
value: value,
|
|
516
|
-
children: value
|
|
517
|
-
}, value))
|
|
518
|
-
})
|
|
519
|
-
]
|
|
520
|
-
}) : /*#__PURE__*/ jsx(Input, {
|
|
521
|
-
id: id,
|
|
522
|
-
value: server.variables[key],
|
|
523
|
-
onChange: (e)=>setServerVariables({
|
|
524
|
-
...server?.variables,
|
|
525
|
-
[key]: e.target.value
|
|
526
|
-
})
|
|
527
|
-
})
|
|
528
|
-
]
|
|
529
|
-
}, key);
|
|
530
|
-
})
|
|
531
|
-
]
|
|
532
|
-
})
|
|
533
|
-
})
|
|
534
|
-
]
|
|
535
|
-
});
|
|
536
|
-
}
|
|
537
|
-
|
|
538
|
-
export { APIPlayground as A, CircleCheck as C, Input as I, Plus as P, Root as R, Select as S, Trash2 as T, SelectTrigger as a, SelectValue as b, SelectContent as c, SelectItem as d, CircleX as e, useApiContext as f, SchemaContext as g, ChevronDown as h, getUrl as i, CopyRouteButton as j, ServerSelect as k, useSchemaContext as u };
|