@clarify-labs/renderer 0.11.2 → 0.11.4

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.
Files changed (56) hide show
  1. package/output/{ClarifyShell-Cn48irqj.cjs → ClarifyShell-Cvb7Nk3A.cjs} +3 -3
  2. package/output/{ClarifyShell-Cn48irqj.cjs.map → ClarifyShell-Cvb7Nk3A.cjs.map} +1 -1
  3. package/output/{ClarifyShell-D_HluctW.js → ClarifyShell-gzlibEm8.js} +3 -3
  4. package/output/{ClarifyShell-D_HluctW.js.map → ClarifyShell-gzlibEm8.js.map} +1 -1
  5. package/output/{MermaidViewer-EZjolX08.cjs → MermaidViewer-CPuTNujY.cjs} +2 -2
  6. package/output/{MermaidViewer-EZjolX08.cjs.map → MermaidViewer-CPuTNujY.cjs.map} +1 -1
  7. package/output/{MermaidViewer-Dby0ylNr.js → MermaidViewer-EVuBmrzA.js} +2 -2
  8. package/output/{MermaidViewer-Dby0ylNr.js.map → MermaidViewer-EVuBmrzA.js.map} +1 -1
  9. package/output/{OpenApiOperation-Cr8TxLjl.js → OpenApiOperation-Ddax6Pen.js} +401 -189
  10. package/output/OpenApiOperation-Ddax6Pen.js.map +1 -0
  11. package/output/{OpenApiOperation-bdALspAY.cjs → OpenApiOperation-QqYCuqve.cjs} +401 -189
  12. package/output/OpenApiOperation-QqYCuqve.cjs.map +1 -0
  13. package/output/{PageActions-BLzCasvB.js → PageActions-BBRz0tJ4.js} +46 -29
  14. package/output/{PageActions-BLzCasvB.js.map → PageActions-BBRz0tJ4.js.map} +1 -1
  15. package/output/{PageActions-Bw9SAHLl.cjs → PageActions-ypH6U0Vc.cjs} +49 -32
  16. package/output/{PageActions-Bw9SAHLl.cjs.map → PageActions-ypH6U0Vc.cjs.map} +1 -1
  17. package/output/{SearchDialog-j_4Y9WY_.cjs → SearchDialog-DCGBhNnW.cjs} +3 -3
  18. package/output/{SearchDialog-j_4Y9WY_.cjs.map → SearchDialog-DCGBhNnW.cjs.map} +1 -1
  19. package/output/{SearchDialog-DWYp1c6c.js → SearchDialog-Df6jknma.js} +3 -3
  20. package/output/{SearchDialog-DWYp1c6c.js.map → SearchDialog-Df6jknma.js.map} +1 -1
  21. package/output/app/PageActions.d.ts +1 -1
  22. package/output/client.cjs +3 -3
  23. package/output/client.js +3 -3
  24. package/output/components/Tabs.d.ts +3 -0
  25. package/output/core/i18n.d.ts +2 -1
  26. package/output/{i18n-L1XX-y6M.cjs → i18n-Ds-f-qlT.cjs} +17 -1
  27. package/output/i18n-Ds-f-qlT.cjs.map +1 -0
  28. package/output/{i18n-DjRcGSuU.js → i18n-LXAq0RIC.js} +17 -1
  29. package/output/i18n-LXAq0RIC.js.map +1 -0
  30. package/output/index.cjs +15 -17
  31. package/output/index.cjs.map +1 -1
  32. package/output/index.d.ts +1 -2
  33. package/output/index.js +16 -17
  34. package/output/index.js.map +1 -1
  35. package/output/mdx/components.d.ts +2 -2
  36. package/output/mdx/primitives.d.ts +2 -0
  37. package/output/openapi/components/ExamplePanels.d.ts +3 -1
  38. package/output/openapi/components/OpenApiAuthDocumentation.d.ts +1 -1
  39. package/output/openapi/components/OpenApiDocumentSection.d.ts +11 -0
  40. package/output/openapi/components/SchemaProperties.d.ts +8 -0
  41. package/output/openapi/components/SchemaSearch.d.ts +20 -0
  42. package/output/openapi/lib/helpers.d.ts +3 -0
  43. package/output/preview.cjs +3 -3
  44. package/output/preview.js +3 -3
  45. package/output/{render-hq20DPxe.cjs → render-BQkaRYoY.cjs} +2 -2
  46. package/output/{render-hq20DPxe.cjs.map → render-BQkaRYoY.cjs.map} +1 -1
  47. package/output/{render-CYQmEacg.js → render-C2rZuVLy.js} +2 -2
  48. package/output/{render-CYQmEacg.js.map → render-C2rZuVLy.js.map} +1 -1
  49. package/output/renderer.css +75 -29
  50. package/output/server.cjs +2 -2
  51. package/output/server.js +2 -2
  52. package/package.json +1 -1
  53. package/output/OpenApiOperation-Cr8TxLjl.js.map +0 -1
  54. package/output/OpenApiOperation-bdALspAY.cjs.map +0 -1
  55. package/output/i18n-DjRcGSuU.js.map +0 -1
  56. package/output/i18n-L1XX-y6M.cjs.map +0 -1
@@ -1,5 +1,5 @@
1
- import { a as useConfig, s as useLocale, t as useBuiltInText } from "./i18n-DjRcGSuU.js";
2
- import { C as isExternalHref, E as copyTextToClipboard, c as lucideIconRegistry, h as useTheme, l as resolveLucideIconName, n as PageTitleActions, o as useSectionStore, s as remToPx, w as localizeHref } from "./PageActions-BLzCasvB.js";
1
+ import { a as useConfig, s as useLocale, t as useBuiltInText } from "./i18n-LXAq0RIC.js";
2
+ import { C as isExternalHref, E as copyTextToClipboard, c as lucideIconRegistry, h as useTheme, l as resolveLucideIconName, o as useSectionStore, s as remToPx, t as PageActions, w as localizeHref } from "./PageActions-BBRz0tJ4.js";
3
3
  import { t as markdownRemarkPlugins } from "./remark-C9iRQM0R.js";
4
4
  import clsx from "clsx";
5
5
  import { Children, Suspense, cloneElement, createContext, createElement, forwardRef, isValidElement, lazy, useContext, useEffect, useId, useLayoutEffect, useRef, useState } from "react";
@@ -253,7 +253,7 @@ function Card(arg0) {
253
253
  }
254
254
  //#endregion
255
255
  //#region source/components/Mermaid.tsx
256
- var MermaidViewer = lazy(() => import("./MermaidViewer-Dby0ylNr.js"));
256
+ var MermaidViewer = lazy(() => import("./MermaidViewer-EVuBmrzA.js"));
257
257
  var mermaidModulePromise;
258
258
  async function loadMermaid() {
259
259
  mermaidModulePromise = mermaidModulePromise ?? import("mermaid").then((module) => module.default);
@@ -1014,7 +1014,7 @@ function TabItem(_props) {
1014
1014
  return null;
1015
1015
  }
1016
1016
  function Tabs(arg0) {
1017
- const { items, children, defaultValue, selectedIndex, onChange, className, listClassName, panelsClassName } = arg0;
1017
+ const { items, children, defaultValue, selectedIndex, onChange, className, spacingClassName = "my-6", listClassName, panelsClassName, actions, variant = "content" } = arg0;
1018
1018
  const childItems = Children.toArray(children).filter((child) => isValidElement(child) && child.type === TabItem).map((child, index) => ({
1019
1019
  id: child.props.value ?? `tab-${index}`,
1020
1020
  label: child.props.title,
@@ -1031,23 +1031,26 @@ function Tabs(arg0) {
1031
1031
  return /* @__PURE__ */ jsxs(TabGroup, {
1032
1032
  selectedIndex: resolvedIndex,
1033
1033
  onChange: handleChange,
1034
- className: clsx("clarify-tabs my-6", className),
1035
- children: [/* @__PURE__ */ jsx(TabList, {
1036
- className: clsx("flex max-w-full items-stretch gap-1 overflow-x-auto border-b border-(--clarify-theme-tokens-colors-border)", listClassName),
1037
- children: resolvedItems.map((item) => /* @__PURE__ */ jsx(Tab, {
1038
- className: ({ selected }) => clsx("clarify-content-tab clarify-ui-tab relative my-1 inline-flex h-9 shrink-0 items-center rounded-(--clarify-theme-tokens-radius-md) px-2.5 transition focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--clarify-theme-tokens-colors-primary)", selected && "clarify-ui-tab-active"),
1034
+ className: clsx("clarify-tabs", spacingClassName, className),
1035
+ children: [/* @__PURE__ */ jsxs(TabList, {
1036
+ className: clsx("flex max-w-full items-stretch overflow-x-auto border-b", variant === "content" ? "gap-1 border-(--clarify-theme-tokens-colors-border)" : "h-10 gap-0 border-(--clarify-code-border) px-3", listClassName),
1037
+ children: [resolvedItems.map((item) => /* @__PURE__ */ jsx(Tab, {
1038
+ className: ({ selected }) => clsx("relative inline-flex shrink-0 items-center px-2.5 transition focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-(--clarify-theme-tokens-colors-primary)", variant === "content" ? "clarify-content-tab clarify-ui-tab my-1 h-9 rounded-(--clarify-theme-tokens-radius-md)" : "text-2xs font-semibold", selected && (variant === "content" ? "clarify-ui-tab-active" : "text-(--clarify-code-text)"), variant === "code" && !selected && "text-(--clarify-code-muted)"),
1039
1039
  children: ({ selected }) => /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", { children: item.label }), selected ? /* @__PURE__ */ jsx(motion.span, {
1040
1040
  layoutId: indicatorLayoutId,
1041
- className: "absolute inset-x-2.5 -bottom-1 h-0.5 rounded-full bg-(--clarify-ui-tab-indicator)",
1041
+ className: clsx("absolute inset-x-2.5 h-0.5 bg-(--clarify-ui-tab-indicator)", variant === "content" ? "-bottom-1 rounded-full" : "-bottom-px"),
1042
1042
  transition: {
1043
1043
  type: "tween",
1044
1044
  duration: .16,
1045
1045
  ease: "easeOut"
1046
1046
  }
1047
1047
  }) : null] })
1048
- }, item.id))
1048
+ }, item.id)), actions ? /* @__PURE__ */ jsx("div", {
1049
+ className: "sticky right-0 ml-auto flex shrink-0 items-center bg-(--clarify-code-background)",
1050
+ children: actions
1051
+ }) : null]
1049
1052
  }), /* @__PURE__ */ jsx(TabPanels, {
1050
- className: clsx("mt-5", panelsClassName),
1053
+ className: panelsClassName ?? "mt-5",
1051
1054
  children: resolvedItems.map((item) => /* @__PURE__ */ jsx(TabPanel, {
1052
1055
  className: "focus:outline-none focus-visible:ring-2 focus-visible:ring-(--clarify-theme-tokens-colors-primary)",
1053
1056
  children: item.panel
@@ -1262,12 +1265,15 @@ var primitives_exports = /* @__PURE__ */ __exportAll({
1262
1265
  });
1263
1266
  function wrapper(arg0) {
1264
1267
  const { children } = arg0;
1265
- return /* @__PURE__ */ jsx("article", {
1266
- className: "clarify-mdx-page flex h-full min-w-0 flex-col pt-14 pb-10",
1267
- children: /* @__PURE__ */ jsx(Prose, {
1268
+ return /* @__PURE__ */ jsxs("article", {
1269
+ className: "clarify-mdx-page relative flex h-full min-w-0 flex-col pt-14 pb-10",
1270
+ children: [/* @__PURE__ */ jsx("div", {
1271
+ className: "clarify-page-actions mb-4 flex justify-end sm:absolute sm:top-14 sm:right-0 sm:mb-0",
1272
+ children: /* @__PURE__ */ jsx(PageActions, {})
1273
+ }), /* @__PURE__ */ jsx(Prose, {
1268
1274
  className: "flex-auto",
1269
1275
  children
1270
- })
1276
+ })]
1271
1277
  });
1272
1278
  }
1273
1279
  function table(arg0) {
@@ -1289,13 +1295,10 @@ function a(arg0) {
1289
1295
  }
1290
1296
  function h1(arg0) {
1291
1297
  const { children, className, ...props } = arg0;
1292
- return /* @__PURE__ */ jsxs("div", {
1293
- className: "clarify-page-title-row flex flex-col gap-4 pb-4 sm:flex-row sm:items-start sm:justify-between",
1294
- children: [/* @__PURE__ */ jsx("h1", {
1295
- className: clsx("clarify-page-title min-w-0 flex-1", className),
1296
- ...props,
1297
- children
1298
- }), /* @__PURE__ */ jsx(PageTitleActions, {})]
1298
+ return /* @__PURE__ */ jsx("h1", {
1299
+ className: clsx("clarify-page-title min-w-0 flex-1", className),
1300
+ ...props,
1301
+ children
1299
1302
  });
1300
1303
  }
1301
1304
  var code = Code;
@@ -1338,9 +1341,9 @@ function Col(arg0) {
1338
1341
  });
1339
1342
  }
1340
1343
  function Properties(arg0) {
1341
- const { children } = arg0;
1344
+ const { children, className, spacingClassName = "my-6" } = arg0;
1342
1345
  return /* @__PURE__ */ jsx("div", {
1343
- className: "clarify-properties my-6",
1346
+ className: clsx("clarify-properties", spacingClassName, className),
1344
1347
  children: /* @__PURE__ */ jsx("ul", {
1345
1348
  role: "list",
1346
1349
  className: "m-0 list-none divide-y divide-(--clarify-theme-tokens-colors-border) p-0",
@@ -1480,6 +1483,57 @@ function resolveRequestSchema(spec, schema) {
1480
1483
  delete ownSchema.allOf;
1481
1484
  return mergeAllOfSchemas(spec, [...allOf, ownSchema]);
1482
1485
  }
1486
+ function fuzzyMatch(value, query) {
1487
+ const candidate = value.toLocaleLowerCase();
1488
+ const needle = query.trim().toLocaleLowerCase();
1489
+ let candidateIndex = 0;
1490
+ for (const character of needle) {
1491
+ candidateIndex = candidate.indexOf(character, candidateIndex);
1492
+ if (candidateIndex === -1) return false;
1493
+ candidateIndex += 1;
1494
+ }
1495
+ return true;
1496
+ }
1497
+ var noExampleMatch = Symbol("no-example-match");
1498
+ function getSchemaSearchText(name, schema) {
1499
+ if (!isRecord$1(schema)) return name;
1500
+ return [
1501
+ name,
1502
+ schema.type,
1503
+ schema.description,
1504
+ schema.pattern,
1505
+ schema.const,
1506
+ schema.default,
1507
+ schema.minimum,
1508
+ schema.maximum,
1509
+ schema.additionalProperties
1510
+ ].filter((value) => typeof value === "string" || typeof value === "number" || typeof value === "boolean").join(" ");
1511
+ }
1512
+ function filterExampleValue(spec, schema, value, query) {
1513
+ const resolved = resolveRequestSchema(spec, schema);
1514
+ if (Array.isArray(value)) {
1515
+ const itemSchema = isRecord$1(resolved) ? resolved.items : void 0;
1516
+ const items = value.map((item) => filterExampleValue(spec, itemSchema, item, query)).filter((item) => item !== noExampleMatch);
1517
+ return items.length > 0 ? items : noExampleMatch;
1518
+ }
1519
+ if (isRecord$1(value)) {
1520
+ const properties = isRecord$1(resolved) && isRecord$1(resolved.properties) ? resolved.properties : {};
1521
+ const filtered = Object.entries(value).flatMap(([name, propertyValue]) => {
1522
+ const propertySchema = properties[name] ?? (isRecord$1(resolved) && isRecord$1(resolved.additionalProperties) ? resolved.additionalProperties : void 0);
1523
+ if (fuzzyMatch(getSchemaSearchText(name, resolveRequestSchema(spec, propertySchema)), query)) return [[name, propertyValue]];
1524
+ const child = filterExampleValue(spec, propertySchema, propertyValue, query);
1525
+ return child === noExampleMatch ? [] : [[name, child]];
1526
+ });
1527
+ return filtered.length > 0 ? Object.fromEntries(filtered) : noExampleMatch;
1528
+ }
1529
+ return fuzzyMatch(getSchemaSearchText("", resolved), query) ? value : noExampleMatch;
1530
+ }
1531
+ function filterExampleBySchema(spec, schema, value, query) {
1532
+ if (!query.trim()) return value;
1533
+ const filtered = filterExampleValue(spec, schema, value, query);
1534
+ if (filtered !== noExampleMatch) return filtered;
1535
+ return Array.isArray(value) ? [] : isRecord$1(value) ? {} : value;
1536
+ }
1483
1537
  function getPathItem$1(spec, path) {
1484
1538
  return resolveObjectRef(spec, spec.paths?.[path]);
1485
1539
  }
@@ -2527,8 +2581,11 @@ function ApiExampleCodeGroup(arg0) {
2527
2581
  function firstExampleKeyForMediaType(requestContents, mediaType, spec) {
2528
2582
  return getExampleEntries(requestContents.find((content) => content.mediaType === mediaType)?.value, spec)[0]?.key ?? "";
2529
2583
  }
2584
+ function isStructuredMediaType(mediaType) {
2585
+ return mediaType.includes("json") || mediaType.includes("yaml") || mediaType.includes("yml");
2586
+ }
2530
2587
  function useRequestExamplesState(arg0) {
2531
- const { spec, path, method, parameters, requestContents, selectedMediaType, onSelectMediaType, selectedServer, serverVariables, auth, operationSource, sharedExampleKey, onSelectExampleKey } = arg0;
2588
+ const { spec, path, method, parameters, requestContents, selectedMediaType, onSelectMediaType, selectedServer, serverVariables, auth, operationSource, sharedExampleKey, onSelectExampleKey, query = "" } = arg0;
2532
2589
  const selectedContent = requestContents.find((content) => content.mediaType === selectedMediaType) ?? requestContents[0];
2533
2590
  const examples = getExampleEntries(selectedContent?.value, spec);
2534
2591
  const [selectedExampleKey, setSelectedExampleKey] = useState(examples[0]?.key ?? "");
@@ -2536,6 +2593,7 @@ function useRequestExamplesState(arg0) {
2536
2593
  const [selectedClientKey, setSelectedClientKey] = useState("curl");
2537
2594
  const currentExampleKey = (sharedExampleKey && examples.some((example) => example.key === sharedExampleKey) ? sharedExampleKey : void 0) ?? selectedExampleKey;
2538
2595
  const selectedExample = examples.find((example) => example.key === currentExampleKey) ?? examples[0];
2596
+ const requestExample = selectedContent && isStructuredMediaType(selectedContent.mediaType) ? filterExampleBySchema(spec, selectedContent.value.schema, selectedExample?.value, query) : selectedExample?.value;
2539
2597
  const codeOptions = buildRequestCodeExamples({
2540
2598
  spec,
2541
2599
  path,
@@ -2545,7 +2603,7 @@ function useRequestExamplesState(arg0) {
2545
2603
  ...selectedContent,
2546
2604
  value: {
2547
2605
  ...selectedContent.value,
2548
- example: selectedExample?.value,
2606
+ example: requestExample,
2549
2607
  examples: void 0
2550
2608
  }
2551
2609
  } : void 0,
@@ -2580,7 +2638,7 @@ function useRequestExamplesState(arg0) {
2580
2638
  };
2581
2639
  }
2582
2640
  function RequestExamplesPanel(arg0) {
2583
- const { spec, path, method, parameters, requestContents, selectedMediaType, onSelectMediaType, selectedServer, serverVariables, auth, operationSource, sharedExampleKey, onSelectExampleKey } = arg0;
2641
+ const { spec, path, method, parameters, requestContents, selectedMediaType, onSelectMediaType, selectedServer, serverVariables, auth, operationSource, sharedExampleKey, onSelectExampleKey, query } = arg0;
2584
2642
  const t = useBuiltInText();
2585
2643
  const state = useRequestExamplesState({
2586
2644
  spec,
@@ -2595,7 +2653,8 @@ function RequestExamplesPanel(arg0) {
2595
2653
  auth,
2596
2654
  operationSource,
2597
2655
  sharedExampleKey,
2598
- onSelectExampleKey
2656
+ onSelectExampleKey,
2657
+ query
2599
2658
  });
2600
2659
  return /* @__PURE__ */ jsx(ApiExampleCodeGroup, {
2601
2660
  title: t("openapi.request"),
@@ -2620,11 +2679,12 @@ function RequestExamplesPanel(arg0) {
2620
2679
  function firstExampleKeyForResponseContent(content, spec) {
2621
2680
  return getExampleEntries(content?.value, spec)[0]?.key ?? "";
2622
2681
  }
2623
- function getResponseExampleBody(content, example) {
2624
- return content ? stringifyExample(example?.value) : "";
2682
+ function getResponseExampleBody(content, example, spec, query = "") {
2683
+ if (!content) return "";
2684
+ return stringifyExample(spec && isStructuredMediaType(content.mediaType) ? filterExampleBySchema(spec, content.value.schema, example?.value, query) : example?.value);
2625
2685
  }
2626
2686
  function useResponseExamplesState(arg0) {
2627
- const { operation, spec, sharedExampleKey, onSelectExampleKey, selectedStatus, onSelectStatus } = arg0;
2687
+ const { operation, spec, sharedExampleKey, onSelectExampleKey, selectedStatus, onSelectStatus, query = "" } = arg0;
2628
2688
  const orderedResponses = [...getResponseEntries(operation, spec)].sort((left, right) => {
2629
2689
  if (left.status === "default") return -1;
2630
2690
  if (right.status === "default") return 1;
@@ -2659,7 +2719,7 @@ function useResponseExamplesState(arg0) {
2659
2719
  selectedContent,
2660
2720
  examples,
2661
2721
  selectedExample,
2662
- responseBody: getResponseExampleBody(selectedContent, selectedExample),
2722
+ responseBody: getResponseExampleBody(selectedContent, selectedExample, spec, query),
2663
2723
  onSelectStatus: (value) => {
2664
2724
  const nextContents = getMediaTypeEntries(orderedResponses.find(({ status }) => status === value)?.response.content, spec);
2665
2725
  if (typeof selectedStatus === "undefined") setInternalSelectedStatus(value);
@@ -2688,7 +2748,7 @@ function useResponseExamplesState(arg0) {
2688
2748
  };
2689
2749
  }
2690
2750
  function ResponseExamplesPanel(arg0) {
2691
- const { operation, spec, title, sharedExampleKey, onSelectExampleKey, selectedStatus, onSelectStatus } = arg0;
2751
+ const { operation, spec, title, sharedExampleKey, onSelectExampleKey, selectedStatus, onSelectStatus, query } = arg0;
2692
2752
  const t = useBuiltInText();
2693
2753
  const state = useResponseExamplesState({
2694
2754
  operation,
@@ -2696,7 +2756,8 @@ function ResponseExamplesPanel(arg0) {
2696
2756
  sharedExampleKey,
2697
2757
  onSelectExampleKey,
2698
2758
  selectedStatus,
2699
- onSelectStatus
2759
+ onSelectStatus,
2760
+ query
2700
2761
  });
2701
2762
  if (!state.selectedContent || !state.responseBody) return null;
2702
2763
  return /* @__PURE__ */ jsx(ApiExampleCodeGroup, {
@@ -2716,6 +2777,28 @@ function ResponseExamplesPanel(arg0) {
2716
2777
  });
2717
2778
  }
2718
2779
  //#endregion
2780
+ //#region source/openapi/components/OpenApiDocumentSection.tsx
2781
+ function OpenApiDocumentSection(props) {
2782
+ const { title, children, action, className, bodyClassName, level = 3 } = props;
2783
+ const heading = level === 3 ? /* @__PURE__ */ jsx("h3", {
2784
+ className: "!m-0 text-sm/6 font-semibold text-(--clarify-theme-tokens-colors-foreground)",
2785
+ children: title
2786
+ }) : /* @__PURE__ */ jsx("h4", {
2787
+ className: "!m-0 text-xs/5 font-semibold text-(--clarify-ui-text-soft)",
2788
+ children: title
2789
+ });
2790
+ return /* @__PURE__ */ jsxs("section", {
2791
+ className: clsx("clarify-openapi-document-section", className),
2792
+ children: [action ? /* @__PURE__ */ jsxs("div", {
2793
+ className: "flex min-w-0 items-center justify-between gap-2",
2794
+ children: [heading, action]
2795
+ }) : heading, /* @__PURE__ */ jsx("div", {
2796
+ className: clsx("mt-2", bodyClassName),
2797
+ children
2798
+ })]
2799
+ });
2800
+ }
2801
+ //#endregion
2719
2802
  //#region source/openapi/components/OpenApiAuthDocumentation.tsx
2720
2803
  function authSchemeType(option, apiKeyLabel) {
2721
2804
  const { scheme } = option;
@@ -2725,73 +2808,73 @@ function authSchemeType(option, apiKeyLabel) {
2725
2808
  if (scheme.type === "openIdConnect") return "OPENID CONNECT";
2726
2809
  return scheme.type?.toUpperCase() || "AUTH";
2727
2810
  }
2728
- function OpenApiAuthDocumentation({ options }) {
2811
+ function OpenApiAuthDocumentation(props) {
2812
+ const { options } = props;
2729
2813
  const t = useBuiltInText();
2730
2814
  if (options.length === 0) return null;
2731
- return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", { children: t("openapi.authentication") }), /* @__PURE__ */ jsx("div", {
2732
- className: "not-prose my-6 border-y border-(--clarify-theme-tokens-colors-border)",
2733
- children: options.map((option, index) => /* @__PURE__ */ jsxs("div", { children: [index > 0 ? /* @__PURE__ */ jsxs("div", {
2734
- className: "flex items-center gap-3 py-1",
2735
- "aria-label": t("openapi.authOr"),
2736
- children: [
2737
- /* @__PURE__ */ jsx("span", { className: "h-px flex-1 bg-(--clarify-theme-tokens-colors-border)" }),
2738
- /* @__PURE__ */ jsx("span", {
2739
- className: "text-2xs font-semibold text-(--clarify-ui-text-faint)",
2740
- children: t("openapi.authOr")
2741
- }),
2742
- /* @__PURE__ */ jsx("span", { className: "h-px flex-1 bg-(--clarify-theme-tokens-colors-border)" })
2743
- ]
2744
- }) : null, option.schemes.length === 0 ? /* @__PURE__ */ jsx("div", {
2745
- className: "py-4 text-sm/6 font-medium text-(--clarify-theme-tokens-colors-foreground)",
2746
- children: t("openapi.authNoAuth")
2747
- }) : /* @__PURE__ */ jsx("div", {
2748
- className: "divide-y divide-(--clarify-theme-tokens-colors-border)",
2749
- children: option.schemes.map((schemeOption, schemeIndex) => {
2750
- const { scheme } = schemeOption;
2751
- const details = [
2752
- scheme.type === "apiKey" && scheme.in && scheme.name ? t("openapi.authLocation", {
2753
- in: scheme.in,
2754
- name: scheme.name
2755
- }) : void 0,
2756
- scheme.type === "http" && scheme.bearerFormat ? t("openapi.authBearerFormat", { format: scheme.bearerFormat }) : void 0,
2757
- scheme.type === "openIdConnect" ? scheme.openIdConnectUrl : void 0,
2758
- schemeOption.scopes.length > 0 ? t("openapi.authScopes", { scopes: schemeOption.scopes.join(", ") }) : void 0
2759
- ].filter((value) => Boolean(value));
2760
- return /* @__PURE__ */ jsxs("div", { children: [schemeIndex > 0 ? /* @__PURE__ */ jsx("div", {
2761
- className: "relative h-0",
2762
- children: /* @__PURE__ */ jsx("span", {
2763
- className: "absolute top-0 left-4 -translate-y-1/2 bg-(--clarify-theme-tokens-colors-background) px-1.5 text-2xs font-semibold text-(--clarify-ui-text-faint)",
2764
- children: t("openapi.authAnd")
2765
- })
2766
- }) : null, /* @__PURE__ */ jsxs("div", {
2767
- className: "py-4",
2768
- children: [
2769
- /* @__PURE__ */ jsxs("div", {
2770
- className: "flex flex-wrap items-center gap-2",
2771
- children: [/* @__PURE__ */ jsx("span", {
2772
- className: "font-mono text-sm/6 font-semibold text-(--clarify-theme-tokens-colors-foreground)",
2773
- children: schemeOption.name
2774
- }), /* @__PURE__ */ jsx("span", {
2775
- className: "rounded bg-(--clarify-ui-subtle-background) px-1.5 py-0.5 text-2xs font-semibold text-(--clarify-ui-text-soft)",
2776
- children: authSchemeType(schemeOption, t("openapi.authApiKey"))
2777
- })]
2778
- }),
2779
- scheme.description ? /* @__PURE__ */ jsx(Markdown, {
2780
- className: "mt-2 text-sm/6 text-(--clarify-ui-text-soft) *:first:mt-0 *:last:mb-0",
2781
- children: scheme.description
2782
- }) : null,
2783
- details.length > 0 ? /* @__PURE__ */ jsx("div", {
2784
- className: "mt-2 flex min-w-0 flex-wrap gap-x-4 gap-y-1 text-xs/5 text-(--clarify-ui-text-faint)",
2785
- children: details.map((detail) => /* @__PURE__ */ jsx("span", {
2786
- className: "min-w-0 break-all font-mono",
2787
- children: detail
2788
- }, detail))
2789
- }) : null
2790
- ]
2791
- })] }, schemeOption.name);
2792
- })
2793
- })] }, option.key))
2794
- })] });
2815
+ const renderOption = (option) => option.schemes.length === 0 ? /* @__PURE__ */ jsx("div", {
2816
+ className: "border-b border-(--clarify-theme-tokens-colors-border) pt-2 pb-4 text-sm/6 font-medium text-(--clarify-theme-tokens-colors-foreground)",
2817
+ children: t("openapi.authNoAuth")
2818
+ }) : /* @__PURE__ */ jsx("div", {
2819
+ className: "divide-y divide-(--clarify-theme-tokens-colors-border) border-b border-(--clarify-theme-tokens-colors-border)",
2820
+ children: option.schemes.map((schemeOption, schemeIndex) => {
2821
+ const { scheme } = schemeOption;
2822
+ const details = [
2823
+ scheme.type === "apiKey" && scheme.in && scheme.name ? t("openapi.authLocation", {
2824
+ in: scheme.in,
2825
+ name: scheme.name
2826
+ }) : void 0,
2827
+ scheme.type === "http" && scheme.bearerFormat ? t("openapi.authBearerFormat", { format: scheme.bearerFormat }) : void 0,
2828
+ scheme.type === "openIdConnect" ? scheme.openIdConnectUrl : void 0,
2829
+ schemeOption.scopes.length > 0 ? t("openapi.authScopes", { scopes: schemeOption.scopes.join(", ") }) : void 0
2830
+ ].filter((value) => Boolean(value));
2831
+ return /* @__PURE__ */ jsxs("div", { children: [schemeIndex > 0 ? /* @__PURE__ */ jsx("div", {
2832
+ className: "relative h-0",
2833
+ children: /* @__PURE__ */ jsx("span", {
2834
+ className: "absolute top-0 left-4 -translate-y-1/2 bg-(--clarify-theme-tokens-colors-background) px-1.5 text-2xs font-semibold text-(--clarify-ui-text-faint)",
2835
+ children: t("openapi.authAnd")
2836
+ })
2837
+ }) : null, /* @__PURE__ */ jsxs("div", {
2838
+ className: "py-4 first:pt-2",
2839
+ children: [
2840
+ /* @__PURE__ */ jsxs("div", {
2841
+ className: "flex flex-wrap items-center gap-2",
2842
+ children: [/* @__PURE__ */ jsx("span", {
2843
+ className: "font-mono text-sm/6 font-semibold text-(--clarify-theme-tokens-colors-foreground)",
2844
+ children: schemeOption.name
2845
+ }), /* @__PURE__ */ jsx("span", {
2846
+ className: "rounded bg-(--clarify-ui-subtle-background) px-1.5 py-0.5 text-2xs font-semibold text-(--clarify-ui-text-soft)",
2847
+ children: authSchemeType(schemeOption, t("openapi.authApiKey"))
2848
+ })]
2849
+ }),
2850
+ scheme.description ? /* @__PURE__ */ jsx(Markdown, {
2851
+ className: "mt-2 text-sm/6 text-(--clarify-ui-text-soft) *:first:mt-0 *:last:mb-0",
2852
+ children: scheme.description
2853
+ }) : null,
2854
+ details.length > 0 ? /* @__PURE__ */ jsx("div", {
2855
+ className: "mt-2 flex min-w-0 flex-wrap gap-x-4 gap-y-1 text-xs/5 text-(--clarify-ui-text-faint)",
2856
+ children: details.map((detail) => /* @__PURE__ */ jsx("span", {
2857
+ className: "min-w-0 break-all font-mono",
2858
+ children: detail
2859
+ }, detail))
2860
+ }) : null
2861
+ ]
2862
+ })] }, schemeOption.name);
2863
+ })
2864
+ });
2865
+ return /* @__PURE__ */ jsx(OpenApiDocumentSection, {
2866
+ title: t("openapi.authentication"),
2867
+ bodyClassName: "not-prose",
2868
+ children: options.length === 1 ? renderOption(options[0]) : /* @__PURE__ */ jsx(Tabs, {
2869
+ items: options.map((option) => ({
2870
+ id: option.key,
2871
+ label: option.label || t("openapi.none"),
2872
+ panel: renderOption(option)
2873
+ })),
2874
+ spacingClassName: "m-0",
2875
+ panelsClassName: "mt-2"
2876
+ })
2877
+ });
2795
2878
  }
2796
2879
  //#endregion
2797
2880
  //#region source/openapi/components/SchemaProperties.tsx
@@ -3018,10 +3101,11 @@ function EnumValueNode(arg0) {
3018
3101
  });
3019
3102
  }
3020
3103
  function SchemaNode(arg0) {
3021
- const { node, depth = 0, defaultExpanded } = arg0;
3104
+ const { node, depth = 0, defaultExpanded, forceExpanded = false } = arg0;
3022
3105
  const t = useBuiltInText();
3023
- const [expanded, setExpanded] = useState(defaultExpanded ?? depth < 1);
3106
+ const [locallyExpanded, setLocallyExpanded] = useState(defaultExpanded ?? depth < 1);
3024
3107
  const hasChildren = node.children.length > 0;
3108
+ const expanded = forceExpanded || locallyExpanded;
3025
3109
  if (node.kind === "enum") return /* @__PURE__ */ jsx(EnumValueNode, {
3026
3110
  node,
3027
3111
  depth
@@ -3061,7 +3145,7 @@ function SchemaNode(arg0) {
3061
3145
  type: "button",
3062
3146
  "aria-label": expanded ? t("openapi.collapse") : t("openapi.expand"),
3063
3147
  "aria-expanded": expanded,
3064
- onClick: () => setExpanded((value) => !value),
3148
+ onClick: () => setLocallyExpanded((value) => !value),
3065
3149
  className: clsx(rowClassName, "cursor-pointer transition hover:bg-(--clarify-ui-hover-background) focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-(--clarify-theme-tokens-colors-primary)"),
3066
3150
  children: content
3067
3151
  }) : /* @__PURE__ */ jsx("div", {
@@ -3069,12 +3153,13 @@ function SchemaNode(arg0) {
3069
3153
  children: content
3070
3154
  }), hasChildren && expanded ? /* @__PURE__ */ jsx(SchemaTree, {
3071
3155
  nodes: node.children,
3072
- depth: depth + 1
3156
+ depth: depth + 1,
3157
+ forceExpanded
3073
3158
  }) : null]
3074
3159
  });
3075
3160
  }
3076
3161
  function SchemaTree(arg0) {
3077
- const { nodes, depth = 0 } = arg0;
3162
+ const { nodes, depth = 0, forceExpanded = false } = arg0;
3078
3163
  if (nodes.length === 0) return null;
3079
3164
  return /* @__PURE__ */ jsx("ul", {
3080
3165
  role: "list",
@@ -3082,34 +3167,68 @@ function SchemaTree(arg0) {
3082
3167
  children: nodes.map((node) => /* @__PURE__ */ jsx(SchemaNode, {
3083
3168
  node,
3084
3169
  depth,
3085
- defaultExpanded: node.defaultExpanded
3170
+ defaultExpanded: node.defaultExpanded,
3171
+ forceExpanded
3086
3172
  }, node.key))
3087
3173
  });
3088
3174
  }
3175
+ function filterSchemaNodes(nodes, query) {
3176
+ if (!query.trim()) return nodes;
3177
+ return nodes.flatMap((node) => {
3178
+ const children = filterSchemaNodes(node.children, query);
3179
+ return fuzzyMatch(getSchemaSearchText(node.name, {
3180
+ type: node.type,
3181
+ description: node.description,
3182
+ pattern: node.details
3183
+ }), query) || children.length > 0 ? [{
3184
+ ...node,
3185
+ children
3186
+ }] : [];
3187
+ });
3188
+ }
3089
3189
  function SchemaProperties(arg0) {
3090
- const { title, schema, spec, defaultExpanded } = arg0;
3190
+ const { title, schema, spec, defaultExpanded, query = "", emptyText } = arg0;
3191
+ const t = useBuiltInText();
3091
3192
  const root = getRootSchemaNode(spec, schema, defaultExpanded);
3092
3193
  if (!root || root.children.length === 0) return null;
3093
- return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", { children: title }), /* @__PURE__ */ jsx("div", {
3094
- className: "clarify-schema-properties not-prose my-6",
3095
- children: /* @__PURE__ */ jsx(SchemaTree, { nodes: root.children })
3096
- })] });
3194
+ const filteredNodes = filterSchemaNodes(root.children, query);
3195
+ const hasQuery = Boolean(query.trim());
3196
+ const resolvedEmptyText = emptyText ?? t("openapi.noBodyProperties");
3197
+ return /* @__PURE__ */ jsx(OpenApiDocumentSection, {
3198
+ title,
3199
+ level: 4,
3200
+ bodyClassName: "clarify-schema-properties not-prose",
3201
+ children: filteredNodes.length > 0 ? /* @__PURE__ */ jsx(SchemaTree, {
3202
+ nodes: filteredNodes,
3203
+ forceExpanded: hasQuery
3204
+ }) : /* @__PURE__ */ jsx("p", {
3205
+ className: "m-0 py-2 text-sm/5 text-(--clarify-ui-text-soft)",
3206
+ children: resolvedEmptyText
3207
+ })
3208
+ });
3097
3209
  }
3098
3210
  function ParameterList(arg0) {
3099
3211
  const t = useBuiltInText();
3100
3212
  const { title, parameters } = arg0;
3101
3213
  if (parameters.length === 0) return null;
3102
- return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", { children: title }), /* @__PURE__ */ jsx(Properties, { children: parameters.map((parameter) => /* @__PURE__ */ jsx(Property, {
3103
- name: parameter.name ?? t("openapi.parameter"),
3104
- type: [schemaToType(parameter.schema), parameter.required ? t("openapi.requiredBadge") : void 0].filter(Boolean).join(", ") || void 0,
3105
- children: parameter.description ? /* @__PURE__ */ jsx(Markdown, {
3106
- className: "*:first:mt-0 *:last:mb-0",
3107
- children: parameter.description
3108
- }) : t("openapi.operationParameter")
3109
- }, `${parameter.in}-${parameter.name}`)) })] });
3214
+ return /* @__PURE__ */ jsx(OpenApiDocumentSection, {
3215
+ title,
3216
+ bodyClassName: "not-prose",
3217
+ children: /* @__PURE__ */ jsx(Properties, {
3218
+ spacingClassName: "m-0",
3219
+ children: parameters.map((parameter) => /* @__PURE__ */ jsx(Property, {
3220
+ name: parameter.name ?? t("openapi.parameter"),
3221
+ type: [schemaToType(parameter.schema), parameter.required ? t("openapi.requiredBadge") : void 0].filter(Boolean).join(", ") || void 0,
3222
+ children: parameter.description ? /* @__PURE__ */ jsx(Markdown, {
3223
+ className: "*:first:mt-0 *:last:mb-0",
3224
+ children: parameter.description
3225
+ }) : t("openapi.operationParameter")
3226
+ }, `${parameter.in}-${parameter.name}`))
3227
+ })
3228
+ });
3110
3229
  }
3111
3230
  function ResponseList(arg0) {
3112
- const { title, operation, spec, selectedStatus, onSelectStatus } = arg0;
3231
+ const { title, operation, spec, selectedStatus, onSelectStatus, query = "", search } = arg0;
3113
3232
  const t = useBuiltInText();
3114
3233
  const orderedResponses = [...getResponseEntries(operation, spec)].sort((left, right) => {
3115
3234
  if (left.status === "default") return -1;
@@ -3146,11 +3265,13 @@ function ResponseList(arg0) {
3146
3265
  }) : `${t("openapi.response")}.`
3147
3266
  }),
3148
3267
  responseSchema && spec ? /* @__PURE__ */ jsx("div", {
3149
- className: "mt-4",
3268
+ className: "mt-6",
3150
3269
  children: /* @__PURE__ */ jsx(SchemaProperties, {
3151
3270
  title: t("openapi.responseBodyProperties"),
3152
3271
  schema: responseSchema,
3153
- spec
3272
+ spec,
3273
+ query,
3274
+ emptyText: t("openapi.noResponseBodyProperties")
3154
3275
  })
3155
3276
  }) : null
3156
3277
  ]
@@ -3158,27 +3279,91 @@ function ResponseList(arg0) {
3158
3279
  };
3159
3280
  if (orderedResponses.length === 1) {
3160
3281
  const [{ status, response }] = orderedResponses;
3161
- return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", { children: title ?? t("openapi.responses") }), renderResponsePanel({
3162
- status,
3163
- response
3164
- })] });
3165
- }
3166
- return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", { children: title ?? t("openapi.responses") }), /* @__PURE__ */ jsx(Tabs, {
3167
- selectedIndex,
3168
- onChange: (index) => {
3169
- onSelectStatus?.(orderedResponses[index]?.status ?? "");
3170
- },
3171
- items: orderedResponses.map(({ status, response }) => ({
3172
- id: status,
3173
- label: status,
3174
- panel: renderResponsePanel({
3282
+ return /* @__PURE__ */ jsxs(OpenApiDocumentSection, {
3283
+ title: title ?? t("openapi.responses"),
3284
+ action: search?.action,
3285
+ children: [search?.open ? search.input : null, renderResponsePanel({
3175
3286
  status,
3176
3287
  response
3288
+ })]
3289
+ });
3290
+ }
3291
+ return /* @__PURE__ */ jsxs(OpenApiDocumentSection, {
3292
+ title: title ?? t("openapi.responses"),
3293
+ action: search?.action,
3294
+ bodyClassName: "not-prose",
3295
+ children: [search?.open ? search.input : null, /* @__PURE__ */ jsx(Tabs, {
3296
+ selectedIndex,
3297
+ onChange: (index) => {
3298
+ onSelectStatus?.(orderedResponses[index]?.status ?? "");
3299
+ },
3300
+ items: orderedResponses.map(({ status, response }) => ({
3301
+ id: status,
3302
+ label: status,
3303
+ panel: renderResponsePanel({
3304
+ status,
3305
+ response
3306
+ })
3307
+ })),
3308
+ spacingClassName: "m-0",
3309
+ panelsClassName: "mt-2"
3310
+ })]
3311
+ });
3312
+ }
3313
+ //#endregion
3314
+ //#region source/openapi/components/SchemaSearch.tsx
3315
+ function useSchemaSearch() {
3316
+ const [open, setOpen] = useState(false);
3317
+ const [query, setQuery] = useState("");
3318
+ return {
3319
+ open,
3320
+ query,
3321
+ onChange: (event) => setQuery(event.target.value),
3322
+ toggle: () => {
3323
+ setOpen((current) => {
3324
+ if (current) setQuery("");
3325
+ return !current;
3326
+ });
3327
+ }
3328
+ };
3329
+ }
3330
+ function SchemaSearchButton(arg0) {
3331
+ const { label, open, onClick } = arg0;
3332
+ return /* @__PURE__ */ jsx("button", {
3333
+ type: "button",
3334
+ "aria-label": label,
3335
+ "aria-pressed": open,
3336
+ onClick,
3337
+ className: clsx("flex size-7 shrink-0 cursor-pointer items-center justify-center rounded-(--clarify-theme-tokens-radius-md) transition focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-(--clarify-theme-tokens-colors-primary)", open ? "bg-(--clarify-ui-hover-background) text-(--clarify-theme-tokens-colors-primary)" : "text-(--clarify-ui-text-faint) hover:bg-(--clarify-ui-hover-background) hover:text-(--clarify-theme-tokens-colors-foreground)"),
3338
+ children: /* @__PURE__ */ jsx(SearchIcon, {
3339
+ className: "size-4",
3340
+ "aria-hidden": "true"
3341
+ })
3342
+ });
3343
+ }
3344
+ function SchemaSearchInput(arg0) {
3345
+ const { label, value, onChange } = arg0;
3346
+ return /* @__PURE__ */ jsxs("label", {
3347
+ className: "not-prose mb-3 flex h-9 items-center gap-2 rounded-(--clarify-theme-tokens-radius-md) border border-(--clarify-theme-tokens-colors-border) bg-(--clarify-theme-tokens-colors-surface) px-3 transition focus-within:border-(--clarify-theme-tokens-colors-primary) focus-within:ring-2 focus-within:ring-(--clarify-theme-tokens-colors-primary)/15",
3348
+ children: [
3349
+ /* @__PURE__ */ jsx(SearchIcon, {
3350
+ className: "size-4 shrink-0 text-(--clarify-ui-text-faint)",
3351
+ "aria-hidden": "true"
3352
+ }),
3353
+ /* @__PURE__ */ jsx("span", {
3354
+ className: "sr-only",
3355
+ children: label
3356
+ }),
3357
+ /* @__PURE__ */ jsx("input", {
3358
+ type: "search",
3359
+ value,
3360
+ onChange,
3361
+ placeholder: label,
3362
+ autoFocus: true,
3363
+ className: "min-w-0 flex-1 bg-transparent text-sm text-(--clarify-theme-tokens-colors-foreground) outline-none placeholder:text-(--clarify-ui-text-faint)"
3177
3364
  })
3178
- })),
3179
- className: "mt-4 mb-6",
3180
- panelsClassName: "mt-5"
3181
- })] });
3365
+ ]
3366
+ });
3182
3367
  }
3183
3368
  //#endregion
3184
3369
  //#region source/openapi/components/EndpointSections.tsx
@@ -3186,6 +3371,7 @@ function EndpointRequest(arg0) {
3186
3371
  const { spec, path, method, operationSource = "path", description, groupedParameters, parameters, requestBody, requestContents, requestSchema, selectedRequestMediaType, onSelectRequestMediaType, selectedServer, serverVariables, authOptions, auth, sharedExampleKey, onSelectExampleKey } = arg0;
3187
3372
  const t = useBuiltInText();
3188
3373
  const hasRequestBody = Boolean(requestBody && requestContents.length > 0);
3374
+ const requestBodySearch = useSchemaSearch();
3189
3375
  const renderDescription = () => {
3190
3376
  if (!description) return null;
3191
3377
  return /* @__PURE__ */ jsx(Markdown, { children: description });
@@ -3195,16 +3381,25 @@ function EndpointRequest(arg0) {
3195
3381
  className: "text-sm/5 text-(--clarify-ui-text-soft)",
3196
3382
  children: t("openapi.requestBodyEmpty")
3197
3383
  });
3198
- return /* @__PURE__ */ jsxs(Fragment$1, { children: [typeof requestBody?.description === "string" ? /* @__PURE__ */ jsx(Markdown, { children: requestBody.description }) : null, /* @__PURE__ */ jsx(SchemaProperties, {
3199
- title: t("openapi.bodyProperties"),
3200
- schema: requestSchema,
3201
- spec
3202
- })] });
3384
+ return /* @__PURE__ */ jsxs(Fragment$1, { children: [
3385
+ requestBodySearch.open ? /* @__PURE__ */ jsx(SchemaSearchInput, {
3386
+ label: t("openapi.searchBodyProperties"),
3387
+ value: requestBodySearch.query,
3388
+ onChange: requestBodySearch.onChange
3389
+ }) : null,
3390
+ typeof requestBody?.description === "string" ? /* @__PURE__ */ jsx(Markdown, { children: requestBody.description }) : null,
3391
+ /* @__PURE__ */ jsx(SchemaProperties, {
3392
+ title: t("openapi.bodyProperties"),
3393
+ schema: requestSchema,
3394
+ spec,
3395
+ query: requestBodySearch.query
3396
+ })
3397
+ ] });
3203
3398
  };
3204
3399
  return /* @__PURE__ */ jsxs(Fragment$1, { children: [renderDescription(), /* @__PURE__ */ jsxs(Row, {
3205
3400
  className: "clarify-openapi-request-workspace relative mt-8 pt-6",
3206
3401
  children: [/* @__PURE__ */ jsx(Col, { children: /* @__PURE__ */ jsxs("div", {
3207
- className: "w-full",
3402
+ className: "flex w-full flex-col gap-6",
3208
3403
  children: [
3209
3404
  /* @__PURE__ */ jsx(OpenApiAuthDocumentation, { options: authOptions }),
3210
3405
  /* @__PURE__ */ jsx(ParameterList, {
@@ -3219,7 +3414,15 @@ function EndpointRequest(arg0) {
3219
3414
  title: t("openapi.headers"),
3220
3415
  parameters: groupedParameters.header
3221
3416
  }),
3222
- /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", { children: t("openapi.requestBody") }), renderRequestBody()] })
3417
+ /* @__PURE__ */ jsx(OpenApiDocumentSection, {
3418
+ title: t("openapi.requestBody"),
3419
+ action: hasRequestBody ? /* @__PURE__ */ jsx(SchemaSearchButton, {
3420
+ label: t("openapi.searchBodyProperties"),
3421
+ open: requestBodySearch.open,
3422
+ onClick: requestBodySearch.toggle
3423
+ }) : null,
3424
+ children: renderRequestBody()
3425
+ })
3223
3426
  ]
3224
3427
  }) }), /* @__PURE__ */ jsx(Col, {
3225
3428
  sticky: true,
@@ -3238,7 +3441,8 @@ function EndpointRequest(arg0) {
3238
3441
  auth,
3239
3442
  operationSource,
3240
3443
  sharedExampleKey,
3241
- onSelectExampleKey
3444
+ onSelectExampleKey,
3445
+ query: requestBodySearch.query
3242
3446
  })
3243
3447
  })
3244
3448
  })]
@@ -3249,6 +3453,7 @@ function EndpointResponse(arg0) {
3249
3453
  const t = useBuiltInText();
3250
3454
  const responseTitle = operationSource === "webhook" ? t("openapi.webhookResponses") : t("openapi.responses");
3251
3455
  const responseExampleTitle = operationSource === "webhook" ? t("openapi.webhookResponse") : t("openapi.response");
3456
+ const responseBodySearch = useSchemaSearch();
3252
3457
  return /* @__PURE__ */ jsx("div", {
3253
3458
  className: "mt-10 pt-6",
3254
3459
  children: /* @__PURE__ */ jsxs(Row, {
@@ -3260,7 +3465,21 @@ function EndpointResponse(arg0) {
3260
3465
  operation,
3261
3466
  spec,
3262
3467
  selectedStatus,
3263
- onSelectStatus
3468
+ onSelectStatus,
3469
+ query: responseBodySearch.query,
3470
+ search: {
3471
+ open: responseBodySearch.open,
3472
+ action: /* @__PURE__ */ jsx(SchemaSearchButton, {
3473
+ label: t("openapi.searchResponseBodyProperties"),
3474
+ open: responseBodySearch.open,
3475
+ onClick: responseBodySearch.toggle
3476
+ }),
3477
+ input: /* @__PURE__ */ jsx(SchemaSearchInput, {
3478
+ label: t("openapi.searchResponseBodyProperties"),
3479
+ value: responseBodySearch.query,
3480
+ onChange: responseBodySearch.onChange
3481
+ })
3482
+ }
3264
3483
  })
3265
3484
  }) }), /* @__PURE__ */ jsx(Col, {
3266
3485
  sticky: true,
@@ -3273,7 +3492,8 @@ function EndpointResponse(arg0) {
3273
3492
  sharedExampleKey,
3274
3493
  onSelectExampleKey,
3275
3494
  selectedStatus,
3276
- onSelectStatus
3495
+ onSelectStatus,
3496
+ query: responseBodySearch.query
3277
3497
  })
3278
3498
  })
3279
3499
  })]
@@ -4299,6 +4519,7 @@ function OpenApiResponseViewer(arg0) {
4299
4519
  const previewAvailable = exchange ? canPreviewResponse(exchange.contentType) : false;
4300
4520
  const selectedBodyMode = bodyModeSelection && bodyModeSelection.exchange === exchange ? bodyModeSelection.mode : "preview";
4301
4521
  const activeBodyMode = previewAvailable ? selectedBodyMode : "raw";
4522
+ const bodyModes = ["preview", "raw"].filter((mode) => mode === "raw" || previewAvailable);
4302
4523
  function downloadBody() {
4303
4524
  if (!exchange) return;
4304
4525
  const url = URL.createObjectURL(exchange.blob);
@@ -4373,48 +4594,37 @@ function OpenApiResponseViewer(arg0) {
4373
4594
  className: "font-mono text-2xs font-normal text-(--clarify-code-faint)",
4374
4595
  children: exchange.contentType || t("openapi.unknownContentType")
4375
4596
  }),
4376
- children: /* @__PURE__ */ jsxs("div", {
4377
- className: "min-h-72",
4378
- children: [/* @__PURE__ */ jsxs("div", {
4379
- className: "flex h-10 items-center justify-between border-b border-(--clarify-code-border) px-3",
4380
- children: [/* @__PURE__ */ jsx("div", {
4381
- role: "tablist",
4382
- className: "flex",
4383
- children: ["preview", "raw"].filter((mode) => mode === "raw" || previewAvailable).map((mode) => /* @__PURE__ */ jsx("button", {
4384
- type: "button",
4385
- role: "tab",
4386
- "aria-selected": activeBodyMode === mode,
4387
- onClick: () => setBodyModeSelection({
4388
- exchange,
4389
- mode
4390
- }),
4391
- className: clsx("border-b-2 px-2.5 py-1 text-2xs font-semibold", activeBodyMode === mode ? "border-(--clarify-theme-tokens-colors-primary) text-(--clarify-code-text)" : "border-transparent text-(--clarify-code-muted)"),
4392
- children: mode === "preview" ? t("openapi.preview") : t("openapi.raw")
4393
- }, mode))
4394
- }), /* @__PURE__ */ jsxs("div", {
4395
- className: "flex",
4396
- children: [/* @__PURE__ */ jsx(CopyButton, { value: exchange.body }), /* @__PURE__ */ jsx("button", {
4397
- type: "button",
4398
- onClick: downloadBody,
4399
- "aria-label": t("openapi.downloadBody"),
4400
- title: t("openapi.downloadBody"),
4401
- className: "grid size-8 shrink-0 place-items-center rounded-(--clarify-theme-tokens-radius-md) text-(--clarify-code-muted) transition hover:bg-(--clarify-code-control-background-hover) hover:text-(--clarify-code-text) focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-(--clarify-theme-tokens-colors-primary)",
4402
- children: /* @__PURE__ */ jsx(DownloadIcon, {
4403
- className: "size-4",
4404
- "aria-hidden": "true"
4405
- })
4406
- })]
4407
- })]
4408
- }), /* @__PURE__ */ jsx("div", {
4409
- className: "p-4",
4410
- children: activeBodyMode === "preview" ? /* @__PURE__ */ jsx(ResponsePreview, { exchange }) : exchange.size ? /* @__PURE__ */ jsx("pre", {
4597
+ children: /* @__PURE__ */ jsx(Tabs, {
4598
+ items: bodyModes.map((mode) => ({
4599
+ id: mode,
4600
+ label: mode === "preview" ? t("openapi.preview") : t("openapi.raw"),
4601
+ panel: mode === "preview" ? /* @__PURE__ */ jsx(ResponsePreview, { exchange }) : exchange.size ? /* @__PURE__ */ jsx("pre", {
4411
4602
  className: "max-h-128 overflow-auto whitespace-pre-wrap wrap-break-word font-mono text-xs/5",
4412
4603
  children: exchange.body
4413
4604
  }) : /* @__PURE__ */ jsx("div", {
4414
4605
  className: "py-8 text-center text-xs text-(--clarify-code-faint)",
4415
4606
  children: t("openapi.responseBodyEmpty")
4416
4607
  })
4417
- })]
4608
+ })),
4609
+ selectedIndex: bodyModes.indexOf(activeBodyMode),
4610
+ onChange: (index) => setBodyModeSelection({
4611
+ exchange,
4612
+ mode: bodyModes[index] ?? "raw"
4613
+ }),
4614
+ spacingClassName: "m-0 min-h-72",
4615
+ panelsClassName: "p-4",
4616
+ variant: "code",
4617
+ actions: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(CopyButton, { value: exchange.body }), /* @__PURE__ */ jsx("button", {
4618
+ type: "button",
4619
+ onClick: downloadBody,
4620
+ "aria-label": t("openapi.downloadBody"),
4621
+ title: t("openapi.downloadBody"),
4622
+ className: "grid size-8 shrink-0 place-items-center rounded-(--clarify-theme-tokens-radius-md) text-(--clarify-code-muted) transition hover:bg-(--clarify-code-control-background-hover) hover:text-(--clarify-code-text) focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-(--clarify-theme-tokens-colors-primary)",
4623
+ children: /* @__PURE__ */ jsx(DownloadIcon, {
4624
+ className: "size-4",
4625
+ "aria-hidden": "true"
4626
+ })
4627
+ })] })
4418
4628
  })
4419
4629
  })
4420
4630
  ]
@@ -5177,7 +5387,8 @@ function ServerVariableControl(arg0) {
5177
5387
  label: option
5178
5388
  })),
5179
5389
  onChange,
5180
- compact
5390
+ compact,
5391
+ buttonClassName: "inline-flex min-h-8 w-full min-w-0 items-center justify-between gap-1 rounded-md border border-(--clarify-theme-tokens-colors-border) bg-(--clarify-theme-tokens-colors-surface) px-2.5 py-1.5 text-xs font-semibold text-(--clarify-theme-tokens-colors-foreground) shadow-xs outline-hidden transition hover:border-(--clarify-ui-text-faint) hover:bg-(--clarify-ui-hover-background) focus:ring-2 focus:ring-inset focus:ring-(--clarify-theme-tokens-colors-primary) data-open:bg-(--clarify-ui-active-background)"
5181
5392
  });
5182
5393
  return /* @__PURE__ */ jsx("input", {
5183
5394
  "aria-label": name,
@@ -5207,7 +5418,8 @@ function ServerPanel(arg0) {
5207
5418
  label: getServerLabel(server, index),
5208
5419
  description: server.description
5209
5420
  })),
5210
- onChange: onSelectServer
5421
+ onChange: onSelectServer,
5422
+ buttonClassName: "inline-flex min-h-8 w-full min-w-0 items-center justify-between gap-1 rounded-md border border-(--clarify-theme-tokens-colors-border) bg-(--clarify-theme-tokens-colors-surface) px-2.5 py-1.5 text-xs font-semibold text-(--clarify-theme-tokens-colors-foreground) shadow-xs outline-hidden transition hover:border-(--clarify-ui-text-faint) hover:bg-(--clarify-ui-hover-background) focus:ring-2 focus:ring-inset focus:ring-(--clarify-theme-tokens-colors-primary) data-open:bg-(--clarify-ui-active-background)"
5211
5423
  })]
5212
5424
  }) : null, variableEntries.length > 0 ? /* @__PURE__ */ jsx("div", {
5213
5425
  className: "grid gap-3 sm:grid-cols-(--clarify-openapi-variable-grid)",
@@ -5357,4 +5569,4 @@ function OpenApiOperation(arg0) {
5357
5569
  //#endregion
5358
5570
  export { Code as A, GridPattern as C, Tag as D, Heading as E, CardGroup as F, Callout as I, Button as L, Pre as M, Mermaid as N, Feedback as O, Card as P, Prose as S, Logo as T, WebFrame as _, ResponseExamplesPanel as a, Step as b, getAuthOptions as c, getOpenApiOperationEntry as d, listOpenApiOperations as f, primitives_exports as g, Markdown as h, RequestExamplesPanel as i, CodeGroup as j, Collapse as k, getServerKey as l, getRequestBody$1 as m, OpenApiOperation as n, authPlaceholder as o, getMediaTypeEntries as p, OpenApiRequestWorkbench as r, defaultServerVariables as s, EndpointIdentity as t, getServers as u, TabItem as v, HeroPattern as w, Steps as x, Tabs as y };
5359
5571
 
5360
- //# sourceMappingURL=OpenApiOperation-Cr8TxLjl.js.map
5572
+ //# sourceMappingURL=OpenApiOperation-Ddax6Pen.js.map