@clarify-labs/renderer 0.11.3 → 0.11.4

package/output/{OpenApiOperation-HhSjad7q.cjs → OpenApiOperation-QqYCuqve.cjs}

@@ -1,6 +1,6 @@
 const require_rolldown_runtime = require("./rolldown-runtime-DakpK96I.cjs");
-const require_i18n = require("./i18n-R08i532P.cjs");
-const require_PageActions = require("./PageActions-GVAsO16x.cjs");
+const require_i18n = require("./i18n-Ds-f-qlT.cjs");
+const require_PageActions = require("./PageActions-ypH6U0Vc.cjs");
 const require_remark = require("./remark-DTLbG8PK.cjs");
 let clsx = require("clsx");
 clsx = require_rolldown_runtime.__toESM(clsx, 1);
@@ -245,7 +245,7 @@ function Card(arg0) {
 }
 //#endregion
 //#region source/components/Mermaid.tsx
-var MermaidViewer = (0, react.lazy)(() => Promise.resolve().then(() => require("./MermaidViewer-kbSVqJ_z.cjs")));
+var MermaidViewer = (0, react.lazy)(() => Promise.resolve().then(() => require("./MermaidViewer-CPuTNujY.cjs")));
 var mermaidModulePromise;
 async function loadMermaid() {
 	mermaidModulePromise = mermaidModulePromise ?? import("mermaid").then((module) => module.default);
@@ -1257,12 +1257,15 @@ var primitives_exports = /* @__PURE__ */ require_rolldown_runtime.__exportAll({
 });
 function wrapper(arg0) {
 	const { children } = arg0;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("article", {
-		className: "clarify-mdx-page flex h-full min-w-0 flex-col pt-14 pb-10",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Prose, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("article", {
+		className: "clarify-mdx-page relative flex h-full min-w-0 flex-col pt-14 pb-10",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "clarify-page-actions mb-4 flex justify-end sm:absolute sm:top-14 sm:right-0 sm:mb-0",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PageActions.PageActions, {})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Prose, {
 			className: "flex-auto",
 			children
-		})
+		})]
 	});
 }
 function table(arg0) {
@@ -1284,13 +1287,10 @@ function a(arg0) {
 }
 function h1(arg0) {
 	const { children, className, ...props } = arg0;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "clarify-page-title-row flex flex-col gap-4  pb-4 sm:flex-row sm:items-start sm:justify-between",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
-			className: (0, clsx.default)("clarify-page-title min-w-0 flex-1", className),
-			...props,
-			children
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PageActions.PageTitleActions, {})]
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
+		className: (0, clsx.default)("clarify-page-title min-w-0 flex-1", className),
+		...props,
+		children
 	});
 }
 var code = Code;
@@ -1475,6 +1475,57 @@ function resolveRequestSchema(spec, schema) {
 	delete ownSchema.allOf;
 	return mergeAllOfSchemas(spec, [...allOf, ownSchema]);
 }
+function fuzzyMatch(value, query) {
+	const candidate = value.toLocaleLowerCase();
+	const needle = query.trim().toLocaleLowerCase();
+	let candidateIndex = 0;
+	for (const character of needle) {
+		candidateIndex = candidate.indexOf(character, candidateIndex);
+		if (candidateIndex === -1) return false;
+		candidateIndex += 1;
+	}
+	return true;
+}
+var noExampleMatch = Symbol("no-example-match");
+function getSchemaSearchText(name, schema) {
+	if (!isRecord$1(schema)) return name;
+	return [
+		name,
+		schema.type,
+		schema.description,
+		schema.pattern,
+		schema.const,
+		schema.default,
+		schema.minimum,
+		schema.maximum,
+		schema.additionalProperties
+	].filter((value) => typeof value === "string" || typeof value === "number" || typeof value === "boolean").join(" ");
+}
+function filterExampleValue(spec, schema, value, query) {
+	const resolved = resolveRequestSchema(spec, schema);
+	if (Array.isArray(value)) {
+		const itemSchema = isRecord$1(resolved) ? resolved.items : void 0;
+		const items = value.map((item) => filterExampleValue(spec, itemSchema, item, query)).filter((item) => item !== noExampleMatch);
+		return items.length > 0 ? items : noExampleMatch;
+	}
+	if (isRecord$1(value)) {
+		const properties = isRecord$1(resolved) && isRecord$1(resolved.properties) ? resolved.properties : {};
+		const filtered = Object.entries(value).flatMap(([name, propertyValue]) => {
+			const propertySchema = properties[name] ?? (isRecord$1(resolved) && isRecord$1(resolved.additionalProperties) ? resolved.additionalProperties : void 0);
+			if (fuzzyMatch(getSchemaSearchText(name, resolveRequestSchema(spec, propertySchema)), query)) return [[name, propertyValue]];
+			const child = filterExampleValue(spec, propertySchema, propertyValue, query);
+			return child === noExampleMatch ? [] : [[name, child]];
+		});
+		return filtered.length > 0 ? Object.fromEntries(filtered) : noExampleMatch;
+	}
+	return fuzzyMatch(getSchemaSearchText("", resolved), query) ? value : noExampleMatch;
+}
+function filterExampleBySchema(spec, schema, value, query) {
+	if (!query.trim()) return value;
+	const filtered = filterExampleValue(spec, schema, value, query);
+	if (filtered !== noExampleMatch) return filtered;
+	return Array.isArray(value) ? [] : isRecord$1(value) ? {} : value;
+}
 function getPathItem$1(spec, path) {
 	return resolveObjectRef(spec, spec.paths?.[path]);
 }
@@ -2522,8 +2573,11 @@ function ApiExampleCodeGroup(arg0) {
 function firstExampleKeyForMediaType(requestContents, mediaType, spec) {
 	return getExampleEntries(requestContents.find((content) => content.mediaType === mediaType)?.value, spec)[0]?.key ?? "";
 }
+function isStructuredMediaType(mediaType) {
+	return mediaType.includes("json") || mediaType.includes("yaml") || mediaType.includes("yml");
+}
 function useRequestExamplesState(arg0) {
-	const { spec, path, method, parameters, requestContents, selectedMediaType, onSelectMediaType, selectedServer, serverVariables, auth, operationSource, sharedExampleKey, onSelectExampleKey } = arg0;
+	const { spec, path, method, parameters, requestContents, selectedMediaType, onSelectMediaType, selectedServer, serverVariables, auth, operationSource, sharedExampleKey, onSelectExampleKey, query = "" } = arg0;
 	const selectedContent = requestContents.find((content) => content.mediaType === selectedMediaType) ?? requestContents[0];
 	const examples = getExampleEntries(selectedContent?.value, spec);
 	const [selectedExampleKey, setSelectedExampleKey] = (0, react.useState)(examples[0]?.key ?? "");
@@ -2531,6 +2585,7 @@ function useRequestExamplesState(arg0) {
 	const [selectedClientKey, setSelectedClientKey] = (0, react.useState)("curl");
 	const currentExampleKey = (sharedExampleKey && examples.some((example) => example.key === sharedExampleKey) ? sharedExampleKey : void 0) ?? selectedExampleKey;
 	const selectedExample = examples.find((example) => example.key === currentExampleKey) ?? examples[0];
+	const requestExample = selectedContent && isStructuredMediaType(selectedContent.mediaType) ? filterExampleBySchema(spec, selectedContent.value.schema, selectedExample?.value, query) : selectedExample?.value;
 	const codeOptions = buildRequestCodeExamples({
 		spec,
 		path,
@@ -2540,7 +2595,7 @@ function useRequestExamplesState(arg0) {
 			...selectedContent,
 			value: {
 				...selectedContent.value,
-				example: selectedExample?.value,
+				example: requestExample,
 				examples: void 0
 			}
 		} : void 0,
@@ -2575,7 +2630,7 @@ function useRequestExamplesState(arg0) {
 	};
 }
 function RequestExamplesPanel(arg0) {
-	const { spec, path, method, parameters, requestContents, selectedMediaType, onSelectMediaType, selectedServer, serverVariables, auth, operationSource, sharedExampleKey, onSelectExampleKey } = arg0;
+	const { spec, path, method, parameters, requestContents, selectedMediaType, onSelectMediaType, selectedServer, serverVariables, auth, operationSource, sharedExampleKey, onSelectExampleKey, query } = arg0;
 	const t = require_i18n.useBuiltInText();
 	const state = useRequestExamplesState({
 		spec,
@@ -2590,7 +2645,8 @@ function RequestExamplesPanel(arg0) {
 		auth,
 		operationSource,
 		sharedExampleKey,
-		onSelectExampleKey
+		onSelectExampleKey,
+		query
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ApiExampleCodeGroup, {
 		title: t("openapi.request"),
@@ -2615,11 +2671,12 @@ function RequestExamplesPanel(arg0) {
 function firstExampleKeyForResponseContent(content, spec) {
 	return getExampleEntries(content?.value, spec)[0]?.key ?? "";
 }
-function getResponseExampleBody(content, example) {
-	return content ? stringifyExample(example?.value) : "";
+function getResponseExampleBody(content, example, spec, query = "") {
+	if (!content) return "";
+	return stringifyExample(spec && isStructuredMediaType(content.mediaType) ? filterExampleBySchema(spec, content.value.schema, example?.value, query) : example?.value);
 }
 function useResponseExamplesState(arg0) {
-	const { operation, spec, sharedExampleKey, onSelectExampleKey, selectedStatus, onSelectStatus } = arg0;
+	const { operation, spec, sharedExampleKey, onSelectExampleKey, selectedStatus, onSelectStatus, query = "" } = arg0;
 	const orderedResponses = [...getResponseEntries(operation, spec)].sort((left, right) => {
 		if (left.status === "default") return -1;
 		if (right.status === "default") return 1;
@@ -2654,7 +2711,7 @@ function useResponseExamplesState(arg0) {
 		selectedContent,
 		examples,
 		selectedExample,
-		responseBody: getResponseExampleBody(selectedContent, selectedExample),
+		responseBody: getResponseExampleBody(selectedContent, selectedExample, spec, query),
 		onSelectStatus: (value) => {
 			const nextContents = getMediaTypeEntries(orderedResponses.find(({ status }) => status === value)?.response.content, spec);
 			if (typeof selectedStatus === "undefined") setInternalSelectedStatus(value);
@@ -2683,7 +2740,7 @@ function useResponseExamplesState(arg0) {
 	};
 }
 function ResponseExamplesPanel(arg0) {
-	const { operation, spec, title, sharedExampleKey, onSelectExampleKey, selectedStatus, onSelectStatus } = arg0;
+	const { operation, spec, title, sharedExampleKey, onSelectExampleKey, selectedStatus, onSelectStatus, query } = arg0;
 	const t = require_i18n.useBuiltInText();
 	const state = useResponseExamplesState({
 		operation,
@@ -2691,7 +2748,8 @@ function ResponseExamplesPanel(arg0) {
 		sharedExampleKey,
 		onSelectExampleKey,
 		selectedStatus,
-		onSelectStatus
+		onSelectStatus,
+		query
 	});
 	if (!state.selectedContent || !state.responseBody) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ApiExampleCodeGroup, {
@@ -2713,7 +2771,7 @@ function ResponseExamplesPanel(arg0) {
 //#endregion
 //#region source/openapi/components/OpenApiDocumentSection.tsx
 function OpenApiDocumentSection(props) {
-	const { title, children, className, bodyClassName, level = 3 } = props;
+	const { title, children, action, className, bodyClassName, level = 3 } = props;
 	const heading = level === 3 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
 		className: "!m-0 text-sm/6 font-semibold text-(--clarify-theme-tokens-colors-foreground)",
 		children: title
@@ -2723,7 +2781,10 @@ function OpenApiDocumentSection(props) {
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
 		className: (0, clsx.default)("clarify-openapi-document-section", className),
-		children: [heading, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		children: [action ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex min-w-0 items-center justify-between gap-2",
+			children: [heading, action]
+		}) : heading, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			className: (0, clsx.default)("mt-2", bodyClassName),
 			children
 		})]
@@ -3032,10 +3093,11 @@ function EnumValueNode(arg0) {
 	});
 }
 function SchemaNode(arg0) {
-	const { node, depth = 0, defaultExpanded } = arg0;
+	const { node, depth = 0, defaultExpanded, forceExpanded = false } = arg0;
 	const t = require_i18n.useBuiltInText();
-	const [expanded, setExpanded] = (0, react.useState)(defaultExpanded ?? depth < 1);
+	const [locallyExpanded, setLocallyExpanded] = (0, react.useState)(defaultExpanded ?? depth < 1);
 	const hasChildren = node.children.length > 0;
+	const expanded = forceExpanded || locallyExpanded;
 	if (node.kind === "enum") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EnumValueNode, {
 		node,
 		depth
@@ -3075,7 +3137,7 @@ function SchemaNode(arg0) {
 			type: "button",
 			"aria-label": expanded ? t("openapi.collapse") : t("openapi.expand"),
 			"aria-expanded": expanded,
-			onClick: () => setExpanded((value) => !value),
+			onClick: () => setLocallyExpanded((value) => !value),
 			className: (0, clsx.default)(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)"),
 			children: content
 		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -3083,12 +3145,13 @@ function SchemaNode(arg0) {
 			children: content
 		}), hasChildren && expanded ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaTree, {
 			nodes: node.children,
-			depth: depth + 1
+			depth: depth + 1,
+			forceExpanded
 		}) : null]
 	});
 }
 function SchemaTree(arg0) {
-	const { nodes, depth = 0 } = arg0;
+	const { nodes, depth = 0, forceExpanded = false } = arg0;
 	if (nodes.length === 0) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
 		role: "list",
@@ -3096,19 +3159,44 @@ function SchemaTree(arg0) {
 		children: nodes.map((node) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaNode, {
 			node,
 			depth,
-			defaultExpanded: node.defaultExpanded
+			defaultExpanded: node.defaultExpanded,
+			forceExpanded
 		}, node.key))
 	});
 }
+function filterSchemaNodes(nodes, query) {
+	if (!query.trim()) return nodes;
+	return nodes.flatMap((node) => {
+		const children = filterSchemaNodes(node.children, query);
+		return fuzzyMatch(getSchemaSearchText(node.name, {
+			type: node.type,
+			description: node.description,
+			pattern: node.details
+		}), query) || children.length > 0 ? [{
+			...node,
+			children
+		}] : [];
+	});
+}
 function SchemaProperties(arg0) {
-	const { title, schema, spec, defaultExpanded } = arg0;
+	const { title, schema, spec, defaultExpanded, query = "", emptyText } = arg0;
+	const t = require_i18n.useBuiltInText();
 	const root = getRootSchemaNode(spec, schema, defaultExpanded);
 	if (!root || root.children.length === 0) return null;
+	const filteredNodes = filterSchemaNodes(root.children, query);
+	const hasQuery = Boolean(query.trim());
+	const resolvedEmptyText = emptyText ?? t("openapi.noBodyProperties");
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OpenApiDocumentSection, {
 		title,
 		level: 4,
 		bodyClassName: "clarify-schema-properties not-prose",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaTree, { nodes: root.children })
+		children: filteredNodes.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaTree, {
+			nodes: filteredNodes,
+			forceExpanded: hasQuery
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+			className: "m-0 py-2 text-sm/5 text-(--clarify-ui-text-soft)",
+			children: resolvedEmptyText
+		})
 	});
 }
 function ParameterList(arg0) {
@@ -3132,7 +3220,7 @@ function ParameterList(arg0) {
 	});
 }
 function ResponseList(arg0) {
-	const { title, operation, spec, selectedStatus, onSelectStatus } = arg0;
+	const { title, operation, spec, selectedStatus, onSelectStatus, query = "", search } = arg0;
 	const t = require_i18n.useBuiltInText();
 	const orderedResponses = [...getResponseEntries(operation, spec)].sort((left, right) => {
 		if (left.status === "default") return -1;
@@ -3173,7 +3261,9 @@ function ResponseList(arg0) {
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaProperties, {
 						title: t("openapi.responseBodyProperties"),
 						schema: responseSchema,
-						spec
+						spec,
+						query,
+						emptyText: t("openapi.noResponseBodyProperties")
 					})
 				}) : null
 			]
@@ -3181,18 +3271,20 @@ function ResponseList(arg0) {
 	};
 	if (orderedResponses.length === 1) {
 		const [{ status, response }] = orderedResponses;
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OpenApiDocumentSection, {
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(OpenApiDocumentSection, {
 			title: title ?? t("openapi.responses"),
-			children: renderResponsePanel({
+			action: search?.action,
+			children: [search?.open ? search.input : null, renderResponsePanel({
 				status,
 				response
-			})
+			})]
 		});
 	}
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OpenApiDocumentSection, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(OpenApiDocumentSection, {
 		title: title ?? t("openapi.responses"),
+		action: search?.action,
 		bodyClassName: "not-prose",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Tabs, {
+		children: [search?.open ? search.input : null, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Tabs, {
 			selectedIndex,
 			onChange: (index) => {
 				onSelectStatus?.(orderedResponses[index]?.status ?? "");
@@ -3207,15 +3299,71 @@ function ResponseList(arg0) {
 			})),
 			spacingClassName: "m-0",
 			panelsClassName: "mt-2"
+		})]
+	});
+}
+//#endregion
+//#region source/openapi/components/SchemaSearch.tsx
+function useSchemaSearch() {
+	const [open, setOpen] = (0, react.useState)(false);
+	const [query, setQuery] = (0, react.useState)("");
+	return {
+		open,
+		query,
+		onChange: (event) => setQuery(event.target.value),
+		toggle: () => {
+			setOpen((current) => {
+				if (current) setQuery("");
+				return !current;
+			});
+		}
+	};
+}
+function SchemaSearchButton(arg0) {
+	const { label, open, onClick } = arg0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		"aria-label": label,
+		"aria-pressed": open,
+		onClick,
+		className: (0, clsx.default)("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)"),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.SearchIcon, {
+			className: "size-4",
+			"aria-hidden": "true"
 		})
 	});
 }
+function SchemaSearchInput(arg0) {
+	const { label, value, onChange } = arg0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+		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",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.SearchIcon, {
+				className: "size-4 shrink-0 text-(--clarify-ui-text-faint)",
+				"aria-hidden": "true"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "sr-only",
+				children: label
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				type: "search",
+				value,
+				onChange,
+				placeholder: label,
+				autoFocus: true,
+				className: "min-w-0 flex-1 bg-transparent text-sm text-(--clarify-theme-tokens-colors-foreground) outline-none placeholder:text-(--clarify-ui-text-faint)"
+			})
+		]
+	});
+}
 //#endregion
 //#region source/openapi/components/EndpointSections.tsx
 function EndpointRequest(arg0) {
 	const { spec, path, method, operationSource = "path", description, groupedParameters, parameters, requestBody, requestContents, requestSchema, selectedRequestMediaType, onSelectRequestMediaType, selectedServer, serverVariables, authOptions, auth, sharedExampleKey, onSelectExampleKey } = arg0;
 	const t = require_i18n.useBuiltInText();
 	const hasRequestBody = Boolean(requestBody && requestContents.length > 0);
+	const requestBodySearch = useSchemaSearch();
 	const renderDescription = () => {
 		if (!description) return null;
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Markdown, { children: description });
@@ -3225,11 +3373,20 @@ function EndpointRequest(arg0) {
 			className: "text-sm/5 text-(--clarify-ui-text-soft)",
 			children: t("openapi.requestBodyEmpty")
 		});
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [typeof requestBody?.description === "string" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Markdown, { children: requestBody.description }) : null, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaProperties, {
-			title: t("openapi.bodyProperties"),
-			schema: requestSchema,
-			spec
-		})] });
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+			requestBodySearch.open ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaSearchInput, {
+				label: t("openapi.searchBodyProperties"),
+				value: requestBodySearch.query,
+				onChange: requestBodySearch.onChange
+			}) : null,
+			typeof requestBody?.description === "string" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Markdown, { children: requestBody.description }) : null,
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaProperties, {
+				title: t("openapi.bodyProperties"),
+				schema: requestSchema,
+				spec,
+				query: requestBodySearch.query
+			})
+		] });
 	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [renderDescription(), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Row, {
 		className: "clarify-openapi-request-workspace relative mt-8 pt-6",
@@ -3251,6 +3408,11 @@ function EndpointRequest(arg0) {
 				}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(OpenApiDocumentSection, {
 					title: t("openapi.requestBody"),
+					action: hasRequestBody ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaSearchButton, {
+						label: t("openapi.searchBodyProperties"),
+						open: requestBodySearch.open,
+						onClick: requestBodySearch.toggle
+					}) : null,
 					children: renderRequestBody()
 				})
 			]
@@ -3271,7 +3433,8 @@ function EndpointRequest(arg0) {
 					auth,
 					operationSource,
 					sharedExampleKey,
-					onSelectExampleKey
+					onSelectExampleKey,
+					query: requestBodySearch.query
 				})
 			})
 		})]
@@ -3282,6 +3445,7 @@ function EndpointResponse(arg0) {
 	const t = require_i18n.useBuiltInText();
 	const responseTitle = operationSource === "webhook" ? t("openapi.webhookResponses") : t("openapi.responses");
 	const responseExampleTitle = operationSource === "webhook" ? t("openapi.webhookResponse") : t("openapi.response");
+	const responseBodySearch = useSchemaSearch();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: "mt-10 pt-6",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Row, {
@@ -3293,7 +3457,21 @@ function EndpointResponse(arg0) {
 					operation,
 					spec,
 					selectedStatus,
-					onSelectStatus
+					onSelectStatus,
+					query: responseBodySearch.query,
+					search: {
+						open: responseBodySearch.open,
+						action: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaSearchButton, {
+							label: t("openapi.searchResponseBodyProperties"),
+							open: responseBodySearch.open,
+							onClick: responseBodySearch.toggle
+						}),
+						input: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SchemaSearchInput, {
+							label: t("openapi.searchResponseBodyProperties"),
+							value: responseBodySearch.query,
+							onChange: responseBodySearch.onChange
+						})
+					}
 				})
 			}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Col, {
 				sticky: true,
@@ -3306,7 +3484,8 @@ function EndpointResponse(arg0) {
 						sharedExampleKey,
 						onSelectExampleKey,
 						selectedStatus,
-						onSelectStatus
+						onSelectStatus,
+						query: responseBodySearch.query
 					})
 				})
 			})]
@@ -5603,4 +5782,4 @@ Object.defineProperty(exports, "primitives_exports", {
 	}
 });
 
-//# sourceMappingURL=OpenApiOperation-HhSjad7q.cjs.map
+//# sourceMappingURL=OpenApiOperation-QqYCuqve.cjs.map