fumadocs-openapi 10.3.8 → 10.3.10

package/css/generated/shared.css

@@ -1,4 +1,4 @@
-@source inline("!isRequired");
+@source inline("!isDefined");
 @source inline("*:min-w-0");
 @source inline("--fd-docs-row-1");
 @source inline("--initial-height");
@@ -59,7 +59,6 @@
 @source inline("assume");
 @source inline("async");
 @source inline("at");
-@source inline("attachedData");
 @source inline("auth-specific");
 @source inline("authCodeCallback");
 @source inline("authNode");
@@ -246,7 +245,8 @@
 @source inline("fetch");
 @source inline("fetcher");
 @source inline("field");
-@source inline("field-info");
+@source inline("fieldData");
+@source inline("fieldLabelVariants");
 @source inline("fieldName");
 @source inline("fields");
 @source inline("file");
@@ -366,7 +366,6 @@
 @source inline("infoTags");
 @source inline("initAuthValues");
 @source inline("initial");
-@source inline("initialInfo");
 @source inline("initialPath");
 @source inline("inline-flex");
 @source inline("input");
@@ -379,6 +378,7 @@
 @source inline("interface");
 @source inline("intersection");
 @source inline("is");
+@source inline("isDefined");
 @source inline("isDuplicated");
 @source inline("isDynamic");
 @source inline("isLoading");
@@ -878,8 +878,8 @@
 @source inline("useApiClientModal");
 @source inline("useApiContext");
 @source inline("useCopyButton");
-@source inline("useDataEngine");
 @source inline("useExampleRequests");
+@source inline("useFieldValue");
 @source inline("useForm");
 @source inline("useMemo");
 @source inline("useObject");

package/dist/playground/components/inputs.js

@@ -9,18 +9,13 @@ import { FormatFlags, schemaToString } from "../../utils/schema-to-string.js";
 import { useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { ChevronRight, Plus, Trash2, X } from "lucide-react";
+import { cva } from "class-variance-authority";
 import { buttonVariants } from "fumadocs-ui/components/ui/button";
 import { useArray, useDataEngine, useFieldValue, useObject } from "@fumari/stf";
 import { stringifyFieldKey } from "@fumari/stf/lib/utils";
 
 //#region src/playground/components/inputs.tsx
-function FieldLabel(props) {
-	return /* @__PURE__ */ jsx("label", {
-		...props,
-		className: cn("w-full inline-flex items-center gap-0.5", props.className),
-		children: props.children
-	});
-}
+const fieldLabelVariants = cva("w-full inline-flex items-center gap-0.5");
 function FieldLabelType(props) {
 	return /* @__PURE__ */ jsx("code", {
 		...props,
@@ -115,23 +110,10 @@ function JsonInput({ fieldName }) {
 	});
 }
 function FieldInput({ field, fieldName, isRequired, ...props }) {
-	const engine = useDataEngine();
 	const [value, setValue] = useFieldValue(fieldName);
 	const id = stringifyFieldKey(fieldName);
 	if (field.type === "null") return;
-	function renderUnset(children) {
-		return /* @__PURE__ */ jsxs("div", {
-			...props,
-			className: cn("flex flex-row gap-2", props.className),
-			children: [children, value !== void 0 && !isRequired && /* @__PURE__ */ jsx("button", {
-				type: "button",
-				onClick: () => engine.delete(fieldName),
-				className: "text-fd-muted-foreground",
-				children: /* @__PURE__ */ jsx(X, { className: "size-4" })
-			})]
-		});
-	}
-	if (field.type === "string" && field.format === "binary") return renderUnset(/* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("label", {
+	if (field.type === "string" && field.format === "binary") return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("label", {
 		htmlFor: id,
 		className: cn(buttonVariants({
 			color: "secondary",
@@ -156,7 +138,7 @@ function FieldInput({ field, fieldName, isRequired, ...props }) {
 			setValue(e.target.files.item(0));
 		},
 		hidden: true
-	})] }));
+	})] });
 	if (field.enum && field.enum.length > 0) {
 		const idx = field.enum.indexOf(value);
 		return /* @__PURE__ */ jsxs(Select, {
@@ -198,7 +180,7 @@ function FieldInput({ field, fieldName, isRequired, ...props }) {
 		] })]
 	});
 	const isNumber = field.type === "integer" || field.type === "number";
-	return renderUnset(/* @__PURE__ */ jsx(Input, {
+	return /* @__PURE__ */ jsx(Input, {
 		id,
 		placeholder: "Enter value",
 		type: isNumber ? "number" : "text",
@@ -208,7 +190,7 @@ function FieldInput({ field, fieldName, isRequired, ...props }) {
 			if (isNumber) setValue(Number.isNaN(e.target.valueAsNumber) ? void 0 : e.target.valueAsNumber);
 			else if (!isNumber) setValue(e.target.value);
 		}
-	}));
+	});
 }
 function FieldSet({ field: _field, fieldName, toolbar, name, isRequired, depth = 0, slotType, collapsible = true, ...props }) {
 	const { readOnly, writeOnly } = useSchemaScope();
@@ -217,9 +199,13 @@ function FieldSet({ field: _field, fieldName, toolbar, name, isRequired, depth =
 	const { info, updateInfo } = useFieldInfo(fieldName, field);
 	const id = stringifyFieldKey(fieldName);
 	const dataEngine = useDataEngine();
+	const [isDefined] = useFieldValue(fieldName, { compute(currentValue) {
+		return currentValue !== void 0;
+	} });
 	if (_field === false) return;
 	if (field.readOnly && !readOnly) return;
 	if (field.writeOnly && !writeOnly) return;
+	if (collapsible && !isDefined && show) setShow(false);
 	function renderLabelTrigger(schema = field) {
 		if (!collapsible) return renderLabelName();
 		return /* @__PURE__ */ jsxs("button", {
@@ -248,6 +234,14 @@ function FieldSet({ field: _field, fieldName, toolbar, name, isRequired, depth =
 			})]
 		});
 	}
+	function renderUnsetButton() {
+		return /* @__PURE__ */ jsx("button", {
+			type: "button",
+			onClick: () => dataEngine.delete(fieldName),
+			className: "text-fd-muted-foreground hover:text-fd-accent-foreground",
+			children: /* @__PURE__ */ jsx(X, { className: "size-3.5" })
+		});
+	}
 	if (info.unionField && field[info.unionField]) {
 		const union = field[info.unionField];
 		const showSelect = union.length > 1;
@@ -305,12 +299,13 @@ function FieldSet({ field: _field, fieldName, toolbar, name, isRequired, depth =
 		return /* @__PURE__ */ jsxs("fieldset", {
 			...props,
 			className: cn("flex flex-col gap-1.5 col-span-full @container", props.className),
-			children: [/* @__PURE__ */ jsxs(FieldLabel, {
-				htmlFor: id,
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: fieldLabelVariants(),
 				children: [
 					renderLabelTrigger(schema),
 					slotType ?? /* @__PURE__ */ jsx(FieldLabelType, { children: schemaToString(field) }),
-					toolbar
+					toolbar,
+					!isRequired && isDefined && renderUnsetButton()
 				]
 			}), show && /* @__PURE__ */ jsx(ObjectInput, {
 				field: schema,
@@ -322,12 +317,13 @@ function FieldSet({ field: _field, fieldName, toolbar, name, isRequired, depth =
 	if (field.type === "array") return /* @__PURE__ */ jsxs("fieldset", {
 		...props,
 		className: cn("flex flex-col gap-1.5 col-span-full", props.className),
-		children: [/* @__PURE__ */ jsxs(FieldLabel, {
-			htmlFor: id,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: fieldLabelVariants(),
 			children: [
 				renderLabelTrigger(),
 				slotType ?? /* @__PURE__ */ jsx(FieldLabelType, { children: schemaToString(field) }),
-				toolbar
+				toolbar,
+				!isRequired && isDefined && renderUnsetButton()
 			]
 		}), show && /* @__PURE__ */ jsx(ArrayInput, {
 			fieldName,
@@ -338,12 +334,14 @@ function FieldSet({ field: _field, fieldName, toolbar, name, isRequired, depth =
 	return /* @__PURE__ */ jsxs("fieldset", {
 		...props,
 		className: cn("flex flex-col gap-1.5", props.className),
-		children: [/* @__PURE__ */ jsxs(FieldLabel, {
+		children: [/* @__PURE__ */ jsxs("label", {
+			className: fieldLabelVariants(),
 			htmlFor: id,
 			children: [
 				renderLabelName(),
 				slotType ?? /* @__PURE__ */ jsx(FieldLabelType, { children: schemaToString(field) }),
-				toolbar
+				toolbar,
+				!isRequired && isDefined && renderUnsetButton()
 			]
 		}), /* @__PURE__ */ jsx(FieldInput, {
 			field,

package/dist/playground/components/server-select.js

@@ -118,7 +118,8 @@ function Field({ fieldName, variable }) {
 	return /* @__PURE__ */ jsx(Input, {
 		id: fieldName,
 		value,
-		onChange: (e) => setValue(e.target.value)
+		onChange: (e) => setValue(e.target.value),
+		placeholder: "Enter Value"
 	});
 }
 

package/dist/playground/index.d.ts

@@ -21,6 +21,6 @@ declare function APIPlayground({
   path,
   method,
   ctx
-}: APIPlaygroundProps): Promise<string | number | bigint | boolean | react_jsx_runtime0.JSX.Element | Iterable<react.ReactNode> | null | undefined>;
+}: APIPlaygroundProps): Promise<string | number | bigint | boolean | Iterable<react.ReactNode> | react_jsx_runtime0.JSX.Element | null | undefined>;
 //#endregion
 export { APIPlayground, APIPlaygroundProps, ParameterField, SecurityEntry };

package/dist/playground/schema.js

@@ -1,9 +1,10 @@
 import { getDefaultValue } from "./get-default-values.js";
 import { mergeAllOf } from "../utils/merge-schema.js";
-import { createContext, use, useMemo, useState } from "react";
+import { createContext, use, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 import { Ajv2020 } from "ajv/dist/2020";
-import { useDataEngine } from "@fumari/stf";
+import { useDataEngine, useFieldValue } from "@fumari/stf";
+import { stringifyFieldKey } from "@fumari/stf/lib/utils";
 
 //#region src/playground/schema.tsx
 const SchemaContext = createContext(void 0);
@@ -53,11 +54,8 @@ function useSchemaScope() {
 function useFieldInfo(fieldName, schema) {
 	const { ajv } = use(SchemaContext);
 	const engine = useDataEngine();
-	const attachedData = engine.attachedData("field-info");
-	const [info, setInfo] = useState(() => {
+	const [info, setInfo] = useFieldValue([], { stf: engine.namespace(`field-info:${stringifyFieldKey(fieldName)}`, () => {
 		const value = engine.get(fieldName);
-		const initialInfo = attachedData.get(fieldName);
-		if (initialInfo) return initialInfo;
 		const out = { oneOf: -1 };
 		const union = getUnion(schema);
 		if (union) {
@@ -80,11 +78,10 @@ function useFieldInfo(fieldName, schema) {
 			if (typeof merged !== "boolean") out.intersection = { merged };
 		}
 		return out;
-	});
-	attachedData.set(fieldName, info);
+	}) });
 	return {
 		info,
-		updateInfo: (value) => {
+		updateInfo(value) {
 			const updated = {
 				...info,
 				...value

package/dist/ui/operation/index.js

@@ -95,7 +95,7 @@ async function Operation({ type = "operation", path, method, ctx, showTitle, sho
 		if (!params || params.length === 0) return;
 		return /* @__PURE__ */ jsxs(Fragment, { children: [ctx.renderHeading(headingLevel, title), /* @__PURE__ */ jsx("div", {
 			className: "flex flex-col",
-			children: params.map((param) => /* @__PURE__ */ jsx(Schema, {
+			children: params.map((param) => param.schema != null && /* @__PURE__ */ jsx(Schema, {
 				client: {
 					name: param.name,
 					required: param.required

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-openapi",
-  "version": "10.3.8",
+  "version": "10.3.10",
   "description": "Generate MDX docs for your OpenAPI spec",
   "keywords": [
     "Docs",
@@ -77,7 +77,7 @@
     "remark-rehype": "^11.1.2",
     "tailwind-merge": "^3.4.1",
     "xml-js": "^1.6.11",
-    "@fumari/stf": "^0.0.3"
+    "@fumari/stf": "1.0.0"
   },
   "devDependencies": {
     "@scalar/api-client-react": "^1.3.96",