@fumadocs/api-docs 0.0.3 → 0.1.0

package/css/generated/shared.css

@@ -1 +1 @@
-@source inline("!isDefined *:data-[collapsible=true]:order-last *:min-w-0 --min-height --radix-popover-content-available-width -mx-3 -translate-x-1/2 -translate-y-1/2 @container @default @fuma-translate/react @fumari/stf @md:grid-cols-2 @param @radix-ui/react-accordion @radix-ui/react-dialog @radix-ui/react-select [&_svg]:size-3.5 a absolute accordion actual additionalProperties again ajv aliasName allOf always an anchor anchorIdStartsWith anchorSegments and animate-spin any anyFields anyOf applicable aria-label array as asSchema autoIds avoid backdrop-blur-sm be behavior bg-black/30 bg-fd-background/50 bg-fd-muted bg-fd-popover bg-fd-primary bg-fd-secondary binary block blocks body boolean border border-b border-fd-primary/20 border-t both button buttonVariants catch children class-variance-authority className client clientHeight closed cn code col-span-full collapsible collisionPadding color const content createContext ctx current currentValue cva dark:text-yellow-400 data-[disabled]:opacity-50 data-[disabled]:pointer-events-none data-[state=closed]:animate-fd-accordion-up data-[state=closed]:animate-fd-dialog-out data-[state=closed]:animate-fd-fade-out data-[state=open]:animate-fd-accordion-down data-[state=open]:animate-fd-dialog-in data-[state=open]:animate-fd-fade-in data-[state=open]:text-fd-accent-foreground data-collapsible data-object-search-input data-placeholder:text-fd-muted-foreground dataEngine decoded default defaultCode defaultValue deferredValue define delete deprecated depth dereference dereferenceShallow dereferenced description disabled:cursor-not-allowed disabled:opacity-50 display displayName div doc docRoot duplicated duration-200 dynamic element else empty empty:hidden end end-2 engine ensure enum example examples exclusiveMax exclusiveMin export extends fallback false fd-scroll-container field fieldData fieldLabelVariants fieldName fields file files filtered first first:border-t-0 firstItemRef fixed flex flex-1 flex-col flex-col-reverse flex-row flex-wrap focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-fd-ring focus-within:[&_svg]:text-fd-primary focus-within:ring-2 focus-within:ring-fd-ring focus:bg-fd-accent focus:outline-none focus:ring focus:ring-fd-ring focus:text-fd-accent-foreground font-medium font-mono font-semibold for format forwardRef from function gap-0.5 gap-1 gap-1.5 gap-2 gap-4 generate generateDefault generated ghost grid grid-cols-1 group-data-[state=open]/accordion:rotate-90 group/accordion h-10 h-9 h-[240px] h-px hash hidden hiddenProperties highlighted hook hover:bg-fd-accent hover:text-fd-accent-foreground hover:underline htmlFor i icon-sm icon-xs id idx if ignore import in in-popover include index indexItemMatch info infoTags initial inline-flex inlines input inset-0 instanceof integer interface invalid is isDefined isDuplicated isDynamic isLazy isNumber isRequired it item itemId items items-center j json justify-center key kind label labelVariants lang last:border-b-0 lazy leading-none left-1/2 length let line-through list-disc list-inside lucide-react marker:text-fd-muted-foreground matching max max-h-[460px] max-w-(--radix-popover-content-available-width) max-w-full max-w-lg mb-auto md me-auto members merge mergeAllOf mergeRefs min min-h-(--min-height,200px) min-w-0 ms-auto mt-2 multiple must mx-1 my-1 my-2 my-2! name namespace nested never new next node not-prose note null number object objectSearchOverrides objects of omit onChange onClick onKeyDown onOpenAutoFocus onOpenChange onScrollEnd onValueChange oneOf only opacity-80 open opts or order-last out outline outline-none overflow-hidden overflow-x-auto overflow-y-hidden overview p-1 p-1.5 p-2 p-4 param parentItem parentPathIndex part path pathIndex pathName pattern patternProperties pb-0 pe-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70 placeholder placeholder:text-fd-muted-foreground playground popover popoverRef position prev preventScroll primitive prop properties property props prose-no-margin ps-1 ps-2 ps-3 ps-6 pt-0 px px-2 px-3 px-4 py-0 py-1 py-1.5 py-2 py-4 quiet range raw rawRef rawSearch re-triggering react read readOnly ref refs remove removeItem render renderCodeblock renderMarkdown renderTypeInfoTrigger represents required resize-none resolver return role root rootId rotate-90 rounded-lg rounded-md rounded-sm rounded-xl s-highlight same sample satisfies schema schemaPropKeys schemaToString scroll scroll-m-20 scrollTop search secondary section segments select-none selected selectedType sep setError setInfo setNextName setPath setSearch setShow setValue shadow-lg shadow-md shadow-sm show showExample showSelect shrink-0 simplified single size size-3.5 size-4 skipNonRequired skipReadOnly slotType sm sm:flex-row sm:gap-2 sm:justify-end sm:text-start smooth stable states status step stf sticky store strict string stringifyFieldKey such svg t tab tabDepth tabValues tags target text text-[0.8125rem] text-center text-end text-fd-foreground text-fd-muted-foreground text-fd-muted-foreground/70 text-fd-popover-foreground text-fd-primary text-fd-primary-foreground text-fd-secondary-foreground text-lg text-orange-400 text-red-400 text-red-400/80 text-sm text-start text-xs text-yellow-600 that the tiem to toolbar top top-0 top-1/2 top-10 top-2 tracking-tight transition-colors transition-transform translations trigger true truncate try type typeName typeVariants typeof types undefined underline union unionField unknown updateInfo updated url use useAnchorId useCopyButton useFieldValue useMemo useNamespace useObject useRef useState useTranslations validateFormats validateSchema value valueSchema values variant variants w-0 w-[600px] w-fit w-full will with wrap-break-word write writeOnly x-playground-lazy z-20 z-50");
+@source inline("!isDefined *:data-[collapsible=true]:order-last *:min-w-0 --anchor-width --available-height --available-width --collapsible-panel-height --min-height --transform-origin -mx-3 -translate-x-1/2 -translate-y-1/2 @container @default @fuma-translate/react @fumari/stf @md:grid-cols-2 @param [&[hidden]:not([hidden='until-found'])]:hidden [&_svg]:size-3.5 a absolute accordion actual additionalProperties again ajv aliasName align allOf always an anchor anchorIdStartsWith anchorSegments and animate-spin any anyFields anyOf applicable aria-label array as asSchema autoIds avoid backdrop-blur-lg backdrop-blur-sm be behavior bg-black/30 bg-fd-background/50 bg-fd-muted bg-fd-popover bg-fd-popover/60 bg-fd-primary bg-fd-secondary binary block blocks body boolean border border-b border-fd-primary/20 border-t both bottom button buttonVariants catch center children class-variance-authority className client clientHeight closed cn code col-span-full collapsible color const content createContext ctx current currentValue cva dark:text-yellow-400 data-[closed]:animate-fd-popover-out data-[disabled]:opacity-50 data-[disabled]:pointer-events-none data-[ending-style]:animate-fd-accordion-up data-[highlighted]:bg-fd-accent data-[highlighted]:text-fd-accent-foreground data-[open]:animate-fd-popover-in data-[popup-open]:text-fd-accent-foreground data-[starting-style]:animate-fd-accordion-down data-closed:animate-fd-dialog-out data-closed:animate-fd-fade-out data-collapsible data-ending-style:h-0 data-ending-style:opacity-0 data-object-search-input data-open:animate-fd-dialog-in data-open:animate-fd-fade-in data-placeholder:text-fd-muted-foreground data-starting-style:h-0 data-starting-style:opacity-0 dataEngine decoded default defaultCode defaultValue deferredValue define delete deprecated depth dereference dereferenceShallow dereferenced description disabled:cursor-not-allowed disabled:opacity-50 display div doc docRoot duplicated duration-200 dynamic element else empty empty:hidden end end-2 engine ensure enum example examples exclusiveMax exclusiveMin export extends fallback false fd-scroll-container field fieldData fieldLabelVariants fieldName fields file files filtered first first:border-t-0 firstItemRef fixed flex flex-1 flex-col flex-col-reverse flex-row flex-wrap focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-fd-ring focus-within:[&_svg]:text-fd-primary focus-within:ring-2 focus-within:ring-fd-ring focus:outline-none focus:ring focus:ring-fd-ring font-medium font-mono font-semibold for format from function gap-0.5 gap-1 gap-1.5 gap-2 gap-4 generate generateDefault generated ghost grid grid-cols-1 group-data-[panel-open]/accordion:rotate-90 group/accordion h-(--collapsible-panel-height) h-10 h-9 h-[240px] h-px hash hidden hiddenProperties highlighted hook hover:bg-fd-accent hover:text-fd-accent-foreground hover:underline htmlFor i icon-sm icon-xs id idx if ignore import in in-popover include index indexItemMatch info infoTags initial inline-flex inlines input inset-0 instanceof integer interface invalid is isDefined isDuplicated isDynamic isLazy isNumber isRequired it item itemId items items-center j json justify-center key kind label labelVariants lang last:border-b-0 lazy leading-none left-1/2 length let line-through list-disc list-inside lucide-react marker:text-fd-muted-foreground matching max max-h-(--available-height) max-h-[460px] max-w-(--available-width) max-w-[98vw] max-w-full max-w-lg mb-auto md me-auto members merge mergeAllOf mergeRefs min min-h-(--min-height,200px) min-w-(--anchor-width) min-w-0 min-w-[240px] ms-auto mt-2 multiple must mx-1 my-1 my-2 my-2! name namespace nested never new next node not-prose note null number object objectSearchOverrides objects of omit onChange onClick onKeyDown onOpenChange onScrollEnd onValueChange oneOf only opacity-80 open opts or order-last origin-(--transform-origin) out outline outline-none overflow-hidden overflow-x-auto overflow-y-auto overflow-y-hidden overview p-1 p-1.5 p-2 p-4 param parentItem parentPathIndex part path pathIndex pathName pattern patternProperties pb-0 pe-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70 placeholder placeholder:text-fd-muted-foreground playground popover popoverRef prev preventScroll primitive prop properties property props prose-no-margin ps-1 ps-2 ps-3 ps-6 pt-0 px px-2 px-3 px-4 py-0 py-1 py-1.5 py-2 py-4 querySelector quiet range raw rawRef rawSearch re-triggering react read readOnly ref refs remove removeItem render renderCodeblock renderMarkdown renderTypeInfoTrigger represents required resize-none resolver return role root rootId rotate-90 rounded-lg rounded-md rounded-sm rounded-xl s-highlight same sample satisfies schema schemaPropKeys schemaToString scroll scroll-m-20 scrollTop search secondary section segments select-none selected selectedType sep setError setInfo setNextName setPath setSearch setShow setValue shadow-lg shadow-md shadow-sm show showExample showSelect shrink-0 side sideOffset simplified single size size-3.5 size-4 skipNonRequired skipReadOnly slotType sm sm:flex-row sm:gap-2 sm:justify-end sm:text-start smooth stable start states status step stf sticky store strict string stringifyFieldKey such svg t tab tabDepth tabValues tags target text text-[0.8125rem] text-center text-end text-fd-foreground text-fd-muted-foreground text-fd-muted-foreground/70 text-fd-popover-foreground text-fd-primary text-fd-primary-foreground text-fd-secondary-foreground text-lg text-orange-400 text-red-400 text-red-400/80 text-sm text-start text-xs text-yellow-600 that the tiem to toolbar top top-0 top-1/2 top-10 top-2 tracking-tight transition-[height,opacity] transition-colors transition-transform translations trigger true truncate try type typeName typeVariants typeof types undefined underline union unionField unknown updateInfo updated url use useAnchorId useCopyButton useFieldValue useMemo useNamespace useObject useRef useState useTranslations v validateFormats validateSchema value valueSchema values variant variants w-0 w-[600px] w-fit w-full will with wrap-break-word write writeOnly x-playground-lazy z-20 z-50");

package/dist/components/accordion.d.ts

@@ -1,22 +1,25 @@
 import { ComponentProps } from "react";
-import * as Primitive from "@radix-ui/react-accordion";
+import { Accordion } from "@base-ui/react/accordion";
 
 //#region src/components/accordion.d.ts
 declare function Accordions({
   type,
   defaultValue,
   ...props
-}: Omit<ComponentProps<typeof Primitive.Root>, 'value' | 'onValueChange'>): import("react").JSX.Element;
+}: Omit<ComponentProps<typeof Accordion.Root>, 'value' | 'defaultValue' | 'onValueChange'> & {
+  type?: 'single' | 'multiple';
+  defaultValue?: string | string[];
+}): import("react").JSX.Element;
 declare function AccordionItem({
   value,
   className,
   anchorSegments,
   ...props
-}: ComponentProps<typeof Primitive.Item> & {
+}: ComponentProps<typeof Accordion.Item> & {
   /** define the accordion as an anchor section */anchorSegments?: string[];
 }): import("react").JSX.Element;
-declare function AccordionContent(props: ComponentProps<typeof Primitive.Content>): import("react").JSX.Element;
-declare function AccordionHeader(props: ComponentProps<typeof Primitive.Header>): import("react").JSX.Element;
-declare function AccordionTrigger(props: ComponentProps<typeof Primitive.Trigger>): import("react").JSX.Element;
+declare function AccordionContent(props: ComponentProps<typeof Accordion.Panel>): import("react").JSX.Element;
+declare function AccordionHeader(props: ComponentProps<typeof Accordion.Header>): import("react").JSX.Element;
+declare function AccordionTrigger(props: ComponentProps<typeof Accordion.Trigger>): import("react").JSX.Element;
 //#endregion
 export { AccordionContent, AccordionHeader, AccordionItem, AccordionTrigger, Accordions };

package/dist/components/accordion.js

@@ -4,19 +4,23 @@ import { AnchorSection, useAnchorId } from "../auto-anchor/client.js";
 import { cn } from "../utils/cn.js";
 import { createContext, use, useEffect, useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import * as Primitive from "@radix-ui/react-accordion";
+import { Accordion } from "@base-ui/react/accordion";
 import { ChevronRight } from "lucide-react";
 //#region src/components/accordion.tsx
 const Context = createContext(null);
-function Accordions({ type, defaultValue, ...props }) {
-	const [value, setValue] = useState(() => type === "multiple" ? defaultValue ?? [] : defaultValue ?? "");
+function Accordions({ type = "single", defaultValue, ...props }) {
+	const [value, setValue] = useState(() => {
+		if (Array.isArray(defaultValue)) return defaultValue;
+		if (defaultValue) return [defaultValue];
+		return [];
+	});
 	return /* @__PURE__ */ jsx(Context, {
 		value: useMemo(() => ({
 			type,
 			setValue
 		}), [type]),
-		children: /* @__PURE__ */ jsx(Primitive.Root, {
-			type,
+		children: /* @__PURE__ */ jsx(Accordion.Root, {
+			multiple: type === "multiple",
 			value,
 			onValueChange: setValue,
 			...props
@@ -27,13 +31,13 @@ function AccordionItem({ value, className, anchorSegments, ...props }) {
 	const ctx = use(Context);
 	const id = useAnchorId(anchorSegments ?? false);
 	useEffect(() => {
-		if (id && anchorIdStartsWith(window.location.hash.slice(1), id)) ctx.setValue(ctx.type === "single" ? value : [value]);
+		if (id && anchorIdStartsWith(window.location.hash.slice(1), id)) ctx.setValue([value]);
 	}, [
 		value,
 		id,
 		ctx
 	]);
-	const content = /* @__PURE__ */ jsx(Primitive.Item, {
+	const content = /* @__PURE__ */ jsx(Accordion.Item, {
 		value,
 		className: cn("scroll-m-20 border-b last:border-b-0", className),
 		...props
@@ -44,23 +48,23 @@ function AccordionItem({ value, className, anchorSegments, ...props }) {
 	}) : content;
 }
 function AccordionContent(props) {
-	return /* @__PURE__ */ jsx(Primitive.Content, {
+	return /* @__PURE__ */ jsx(Accordion.Panel, {
 		...props,
-		className: cn("overflow-hidden data-[state=closed]:animate-fd-accordion-up data-[state=open]:animate-fd-accordion-down", props.className)
+		className: cn("overflow-hidden data-[ending-style]:animate-fd-accordion-up data-[starting-style]:animate-fd-accordion-down", props.className)
 	});
 }
 function AccordionHeader(props) {
-	return /* @__PURE__ */ jsx(Primitive.Header, {
+	return /* @__PURE__ */ jsx(Accordion.Header, {
 		...props,
 		className: cn("not-prose flex text-fd-foreground font-medium", props.className),
 		children: props.children
 	});
 }
 function AccordionTrigger(props) {
-	return /* @__PURE__ */ jsxs(Primitive.Trigger, {
+	return /* @__PURE__ */ jsxs(Accordion.Trigger, {
 		...props,
 		className: cn("flex flex-1 items-center gap-1 text-start group/accordion py-2 focus-visible:outline-none", props.className),
-		children: [/* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 text-fd-muted-foreground shrink-0 transition-transform group-data-[state=open]/accordion:rotate-90" }), props.children]
+		children: [/* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 text-fd-muted-foreground shrink-0 transition-transform group-data-[panel-open]/accordion:rotate-90" }), props.children]
 	});
 }
 //#endregion

package/dist/components/collapsible.d.ts

@@ -0,0 +1,16 @@
+import { ComponentProps } from "react";
+import { Collapsible as Collapsible$1 } from "@base-ui/react/collapsible";
+
+//#region src/components/collapsible.d.ts
+declare const Collapsible: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").CollapsibleRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare const CollapsibleTrigger: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").CollapsibleTriggerProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+declare function CollapsibleContent({
+  children,
+  className,
+  ...props
+}: ComponentProps<typeof Collapsible$1.Panel>): import("react").JSX.Element;
+type CollapsibleProps = Collapsible$1.Root.Props;
+type CollapsibleContentProps = Collapsible$1.Panel.Props;
+type CollapsibleTriggerProps = Collapsible$1.Trigger.Props;
+//#endregion
+export { Collapsible, CollapsibleContent, CollapsibleContentProps, CollapsibleProps, CollapsibleTrigger, CollapsibleTriggerProps };

package/dist/components/collapsible.js

@@ -0,0 +1,16 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { jsx } from "react/jsx-runtime";
+import { Collapsible as Collapsible$1 } from "@base-ui/react/collapsible";
+//#region src/components/collapsible.tsx
+const Collapsible = Collapsible$1.Root;
+const CollapsibleTrigger = Collapsible$1.Trigger;
+function CollapsibleContent({ children, className, ...props }) {
+	return /* @__PURE__ */ jsx(Collapsible$1.Panel, {
+		...props,
+		className: (s) => cn("overflow-hidden [&[hidden]:not([hidden='until-found'])]:hidden h-(--collapsible-panel-height) transition-[height,opacity] data-starting-style:opacity-0 data-starting-style:h-0 data-ending-style:h-0 data-ending-style:opacity-0", typeof className === "function" ? className(s) : className),
+		children
+	});
+}
+//#endregion
+export { Collapsible, CollapsibleContent, CollapsibleTrigger };

package/dist/components/dialog.d.ts

@@ -1,22 +1,22 @@
 import { ComponentProps } from "react";
-import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
 
 //#region src/components/dialog.d.ts
-declare const Dialog: import("react").FC<DialogPrimitive.DialogProps>;
-declare const DialogTrigger: import("react").ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-declare const DialogPortal: import("react").FC<DialogPrimitive.DialogPortalProps>;
-declare const DialogClose: import("react").ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
+declare const Dialog: typeof Dialog$1.Root;
+declare const DialogTrigger: Dialog$1.Trigger;
+declare const DialogPortal: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").AlertDialogPortalProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare const DialogClose: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").AlertDialogCloseProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
 declare function DialogOverlay({
   className,
   ref,
   ...props
-}: ComponentProps<typeof DialogPrimitive.Overlay>): import("react").JSX.Element;
+}: ComponentProps<typeof Dialog$1.Backdrop>): import("react").JSX.Element;
 declare function DialogContent({
   className,
   children,
   ref,
   ...props
-}: ComponentProps<typeof DialogPrimitive.Content>): import("react").JSX.Element;
+}: ComponentProps<typeof Dialog$1.Popup>): import("react").JSX.Element;
 declare function DialogHeader({
   className,
   ...props
@@ -29,11 +29,11 @@ declare function DialogTitle({
   className,
   ref,
   ...props
-}: ComponentProps<typeof DialogPrimitive.Title>): import("react").JSX.Element;
+}: ComponentProps<typeof Dialog$1.Title>): import("react").JSX.Element;
 declare function DialogDescription({
   className,
   ref,
   ...props
-}: ComponentProps<typeof DialogPrimitive.Description>): import("react").JSX.Element;
+}: ComponentProps<typeof Dialog$1.Description>): import("react").JSX.Element;
 //#endregion
 export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };

package/dist/components/dialog.js

@@ -2,26 +2,26 @@
 import { cn } from "../utils/cn.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { X } from "lucide-react";
-import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
 import { buttonVariants } from "fumadocs-ui/components/ui/button";
 //#region src/components/dialog.tsx
-const Dialog = DialogPrimitive.Root;
-const DialogTrigger = DialogPrimitive.Trigger;
-const DialogPortal = DialogPrimitive.Portal;
-const DialogClose = DialogPrimitive.Close;
+const Dialog = Dialog$1.Root;
+const DialogTrigger = Dialog$1.Trigger;
+const DialogPortal = Dialog$1.Portal;
+const DialogClose = Dialog$1.Close;
 function DialogOverlay({ className, ref, ...props }) {
-	return /* @__PURE__ */ jsx(DialogPrimitive.Overlay, {
+	return /* @__PURE__ */ jsx(Dialog$1.Backdrop, {
 		ref,
-		className: cn("fixed inset-0 z-50 bg-black/30 backdrop-blur-sm data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out", className),
+		className: cn("fixed inset-0 z-50 bg-black/30 backdrop-blur-sm data-open:animate-fd-fade-in data-closed:animate-fd-fade-out", className),
 		...props
 	});
 }
 function DialogContent({ className, children, ref, ...props }) {
-	return /* @__PURE__ */ jsxs(DialogPortal, { children: [/* @__PURE__ */ jsx(DialogOverlay, {}), /* @__PURE__ */ jsxs(DialogPrimitive.Content, {
+	return /* @__PURE__ */ jsxs(DialogPortal, { children: [/* @__PURE__ */ jsx(DialogOverlay, {}), /* @__PURE__ */ jsxs(Dialog$1.Popup, {
 		ref,
-		className: cn("fixed left-1/2 top-1/2 z-50 flex flex-col gap-4 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-fd-popover p-4 shadow-lg rounded-xl duration-200 data-[state=open]:animate-fd-dialog-in data-[state=closed]:animate-fd-dialog-out focus-visible:outline-none", className),
+		className: cn("fixed left-1/2 top-1/2 z-50 flex flex-col gap-4 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-fd-popover p-4 shadow-lg rounded-xl duration-200 data-open:animate-fd-dialog-in data-closed:animate-fd-dialog-out focus-visible:outline-none", className),
 		...props,
-		children: [children, /* @__PURE__ */ jsx(DialogPrimitive.Close, {
+		children: [children, /* @__PURE__ */ jsx(Dialog$1.Close, {
 			"aria-label": "Close",
 			className: cn(buttonVariants({
 				size: "icon-sm",
@@ -44,14 +44,14 @@ function DialogFooter({ className, ...props }) {
 	});
 }
 function DialogTitle({ className, ref, ...props }) {
-	return /* @__PURE__ */ jsx(DialogPrimitive.Title, {
+	return /* @__PURE__ */ jsx(Dialog$1.Title, {
 		ref,
 		className: cn("text-lg font-semibold leading-none tracking-tight", className),
 		...props
 	});
 }
 function DialogDescription({ className, ref, ...props }) {
-	return /* @__PURE__ */ jsx(DialogPrimitive.Description, {
+	return /* @__PURE__ */ jsx(Dialog$1.Description, {
 		ref,
 		className: cn("text-sm text-fd-muted-foreground", className),
 		...props

package/dist/components/input.d.ts

@@ -1,8 +1,13 @@
-import * as React$1 from "react";
+import * as React from "react";
 
 //#region src/components/input.d.ts
-type InputProps = React$1.InputHTMLAttributes<HTMLInputElement>;
+type InputProps = React.ComponentProps<'input'>;
 declare const labelVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
-declare const Input: React$1.ForwardRefExoticComponent<InputProps & React$1.RefAttributes<HTMLInputElement>>;
+declare function Input({
+  className,
+  type,
+  ref,
+  ...props
+}: InputProps): React.JSX.Element;
 //#endregion
 export { Input, InputProps, labelVariants };

package/dist/components/input.js

@@ -1,17 +1,16 @@
 import { cn } from "../utils/cn.js";
-import * as React$1 from "react";
+import "react";
 import { jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 //#region src/components/input.tsx
 const labelVariants = cva("text-xs font-medium text-fd-foreground peer-disabled:cursor-not-allowed peer-disabled:opacity-70");
-const Input = React$1.forwardRef(({ className, type, ...props }, ref) => {
+function Input({ className, type, ref, ...props }) {
 	return /* @__PURE__ */ jsx("input", {
 		type,
 		className: cn("flex h-9 w-full rounded-md border bg-fd-secondary px-2 py-1.5 text-[0.8125rem] text-fd-secondary-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),
 		ref,
 		...props
 	});
-});
-Input.displayName = "Input";
+}
 //#endregion
 export { Input, labelVariants };

package/dist/components/playground/inputs.js

@@ -43,7 +43,7 @@ function ObjectInput({ field: _field, fieldName, ...props }) {
 		children: [
 			isLazy && hiddenProperties.length > 0 && /* @__PURE__ */ jsxs(Select, {
 				value: "",
-				onValueChange: onAppend,
+				onValueChange: (v) => v !== null && onAppend(v),
 				children: [/* @__PURE__ */ jsx(SelectTrigger, {
 					className: "col-span-full",
 					children: /* @__PURE__ */ jsx(SelectValue, { placeholder: t("Show Property") })
@@ -160,50 +160,62 @@ function FieldInput({ field, fieldName, isRequired, ...props }) {
 	})] });
 	if (field.enum && field.enum.length > 0) {
 		const idx = field.enum.indexOf(value);
+		const items = [...field.enum.map((item, i) => ({
+			value: String(i),
+			label: typeof item === "string" ? item : JSON.stringify(item, null, 2)
+		})), ...!isRequired ? [{
+			value: "-1",
+			label: /* @__PURE__ */ jsx("span", {
+				className: "text-fd-muted-foreground",
+				children: t("Unset")
+			})
+		}] : []];
 		return /* @__PURE__ */ jsxs(Select, {
+			items,
 			value: idx === -1 && isRequired ? "" : String(idx),
 			onValueChange: (v) => setValue(field.enum[Number(v)]),
 			children: [/* @__PURE__ */ jsx(SelectTrigger, {
 				id,
 				...props,
 				children: /* @__PURE__ */ jsx(SelectValue, { placeholder: t("Select") })
-			}), /* @__PURE__ */ jsxs(SelectContent, { children: [field.enum.map((item, i) => /* @__PURE__ */ jsx(SelectItem, {
-				value: String(i),
-				children: typeof item === "string" ? item : JSON.stringify(item, null, 2)
-			}, i)), !isRequired && /* @__PURE__ */ jsx(SelectItem, {
-				value: "-1",
-				children: /* @__PURE__ */ jsx("span", {
-					className: "text-fd-muted-foreground",
-					children: t("Unset")
-				})
-			})] })]
+			}), /* @__PURE__ */ jsx(SelectContent, { children: items.map((item) => /* @__PURE__ */ jsx(SelectItem, {
+				value: item.value,
+				children: item.label
+			}, item.value)) })]
 		});
 	}
-	if (field.type === "boolean") return /* @__PURE__ */ jsxs(Select, {
-		value: String(value),
-		onValueChange: (value) => setValue(value === "undefined" ? void 0 : value === "true"),
-		children: [/* @__PURE__ */ jsx(SelectTrigger, {
-			id,
-			...props,
-			children: /* @__PURE__ */ jsx(SelectValue, {})
-		}), /* @__PURE__ */ jsxs(SelectContent, { children: [
-			/* @__PURE__ */ jsx(SelectItem, {
+	if (field.type === "boolean") {
+		const items = [
+			{
 				value: "true",
-				children: "True"
-			}),
-			/* @__PURE__ */ jsx(SelectItem, {
+				label: "True"
+			},
+			{
 				value: "false",
-				children: "False"
-			}),
-			!isRequired && /* @__PURE__ */ jsx(SelectItem, {
+				label: "False"
+			},
+			...!isRequired ? [{
 				value: "undefined",
-				children: /* @__PURE__ */ jsx("span", {
+				label: /* @__PURE__ */ jsx("span", {
 					className: "text-fd-muted-foreground",
 					children: t("Unset")
 				})
-			})
-		] })]
-	});
+			}] : []
+		];
+		return /* @__PURE__ */ jsxs(Select, {
+			items,
+			value: value === void 0 && isRequired ? "" : String(value),
+			onValueChange: (value) => setValue(value === "undefined" ? void 0 : value === "true"),
+			children: [/* @__PURE__ */ jsx(SelectTrigger, {
+				id,
+				...props,
+				children: /* @__PURE__ */ jsx(SelectValue, {})
+			}), /* @__PURE__ */ jsx(SelectContent, { children: items.map((item) => /* @__PURE__ */ jsx(SelectItem, {
+				value: item.value,
+				children: item.label
+			}, item.value)) })]
+		});
+	}
 	const isNumber = field.type === "integer" || field.type === "number";
 	return /* @__PURE__ */ jsx(Input, {
 		id,

package/dist/components/popover.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import { Popover as Popover$1 } from "@base-ui/react/popover";
+
+//#region src/components/popover.d.ts
+declare const Popover: typeof Popover$1.Root;
+declare const PopoverTrigger: Popover$1.Trigger;
+declare function PopoverContent({
+  className,
+  align,
+  sideOffset,
+  ...props
+}: React.ComponentProps<typeof Popover$1.Popup> & Pick<Popover$1.Positioner.Props, 'sideOffset' | 'align'>): React.JSX.Element;
+declare const PopoverClose: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").PopoverCloseProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+//#endregion
+export { Popover, PopoverClose, PopoverContent, PopoverTrigger };

package/dist/components/popover.js

@@ -0,0 +1,23 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { Popover as Popover$1 } from "@base-ui/react/popover";
+//#region src/components/popover.tsx
+const Popover = Popover$1.Root;
+const PopoverTrigger = Popover$1.Trigger;
+function PopoverContent({ className, align = "center", sideOffset = 4, ...props }) {
+	return /* @__PURE__ */ jsx(Popover$1.Portal, { children: /* @__PURE__ */ jsx(Popover$1.Positioner, {
+		align,
+		side: "bottom",
+		sideOffset,
+		className: "z-50",
+		children: /* @__PURE__ */ jsx(Popover$1.Popup, {
+			className: (s) => cn("z-50 origin-(--transform-origin) overflow-y-auto max-h-(--available-height) min-w-[240px] max-w-[98vw] rounded-xl border bg-fd-popover/60 backdrop-blur-lg p-2 text-sm text-fd-popover-foreground shadow-lg focus-visible:outline-none data-[closed]:animate-fd-popover-out data-[open]:animate-fd-popover-in", typeof className === "function" ? className(s) : className),
+			...props
+		})
+	}) });
+}
+const PopoverClose = Popover$1.Close;
+//#endregion
+export { Popover, PopoverClose, PopoverContent, PopoverTrigger };

package/dist/components/schema/client.js

@@ -1,6 +1,7 @@
 "use client";
 import { useAnchorId } from "../../auto-anchor/client.js";
 import { cn } from "../../utils/cn.js";
+import { Popover, PopoverContent, PopoverTrigger } from "../popover.js";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../select.js";
 import { mergeRefs } from "../../utils/merge-refs.js";
 import { Fragment, Suspense, createContext, use, useCallback, useDeferredValue, useEffect, useMemo, useRef, useState } from "react";
@@ -9,10 +10,9 @@ import { CheckIcon, FilterIcon, LinkIcon } from "lucide-react";
 import { buttonVariants } from "fumadocs-ui/components/ui/button";
 import { cva } from "class-variance-authority";
 import { useTranslations } from "@fuma-translate/react";
-import { Popover, PopoverContent, PopoverTrigger } from "fumadocs-ui/components/ui/popover";
 import { useCopyButton } from "fumadocs-ui/utils/use-copy-button";
 //#region src/components/schema/client.tsx
-const typeVariants = cva("text-sm text-start text-fd-muted-foreground font-mono", { variants: { variant: { trigger: "underline hover:text-fd-accent-foreground data-[state=open]:text-fd-accent-foreground" } } });
+const typeVariants = cva("text-sm text-start text-fd-muted-foreground font-mono", { variants: { variant: { trigger: "underline hover:text-fd-accent-foreground data-[popup-open]:text-fd-accent-foreground" } } });
 const Context = createContext(null);
 function useStates() {
 	return use(Context);
@@ -68,17 +68,10 @@ function SchemaUI({ name, required = false, as = "property", generated }) {
 					children
 				}), /* @__PURE__ */ jsx(PopoverContent, {
 					ref: popoverRef,
-					collisionPadding: 10,
-					className: "w-[600px] max-w-(--radix-popover-content-available-width) min-h-(--min-height,200px) fd-scroll-container max-h-[460px] px-3 pt-0",
+					className: "w-[600px] max-w-(--available-width) min-h-(--min-height,200px) fd-scroll-container max-h-[460px] px-3 pt-0",
 					onScrollEnd: (e) => {
 						path.at(-1).scrollTop = e.target.scrollTop;
 					},
-					onOpenAutoFocus: (e) => {
-						const input = e.target.querySelector("input[data-object-search-input]");
-						if (!(input instanceof HTMLInputElement)) return;
-						input.focus({ preventScroll: true });
-						e.preventDefault();
-					},
 					children: /* @__PURE__ */ jsx(SchemaUIPopover, {})
 				})]
 			})
@@ -195,8 +188,10 @@ function PathItemBody({ pathIndex, asSchema, tabDepth = 0, objectSearchOverrides
 			value: item.$type
 		}));
 		return /* @__PURE__ */ jsxs(Select, {
+			items,
 			value,
 			onValueChange: (v) => {
+				if (!v) return;
 				const next = [...path];
 				(next[pathIndex].tabValues ??= []).splice(tabDepth, 1, v);
 				setPath(next);
@@ -210,7 +205,7 @@ function PathItemBody({ pathIndex, asSchema, tabDepth = 0, objectSearchOverrides
 					}),
 					/* @__PURE__ */ jsx(SelectTrigger, {
 						className: "not-prose w-fit min-w-0 mb-auto *:min-w-0",
-						children: /* @__PURE__ */ jsx(SelectValue, { children: items.find((item) => item.value === value)?.label })
+						children: /* @__PURE__ */ jsx(SelectValue, {})
 					}),
 					/* @__PURE__ */ jsx(SelectContent, { children: items.map(({ label, value }) => /* @__PURE__ */ jsx(SelectItem, {
 						value,
@@ -322,7 +317,11 @@ function BlockTag({ label, children }) {
 function SchemaUIPopover() {
 	const states = useStates();
 	const { path, setPath } = states;
-	return /* @__PURE__ */ jsxs(Context, {
+	const ref = useRef(null);
+	useEffect(() => {
+		ref.current?.querySelector("input[data-object-search-input]")?.focus({ preventScroll: true });
+	}, [path]);
+	return /* @__PURE__ */ jsx(Context, {
 		value: useMemo(() => ({
 			...states,
 			renderTypeInfoTrigger: ({ $ref, pathName, children }) => /* @__PURE__ */ jsx("button", {
@@ -338,26 +337,29 @@ function SchemaUIPopover() {
 			setPath,
 			path
 		]),
-		children: [/* @__PURE__ */ jsx("div", {
-			className: "sticky top-0 -mx-3 flex overflow-x-auto overflow-y-hidden items-center text-sm font-medium font-mono bg-fd-secondary text-fd-secondary-foreground px-3 h-10 border-b z-20",
-			children: path.map((item, i) => {
-				if (i === 0) return;
-				const isDuplicated = path.some((other, j) => j !== i && other.$ref === item.$ref);
-				let text;
-				const indexItemMatch = /^\[(\w+): (\w+)]$/.exec(item.name);
-				if (indexItemMatch) text = `[${indexItemMatch[1]}]`;
-				else if (i > 1) text = `.${item.name}`;
-				else text = item.name;
-				return /* @__PURE__ */ jsx("button", {
-					onClick: () => setPath(path.slice(0, i + 1)),
-					className: cn("hover:underline hover:text-fd-accent-foreground", isDuplicated && "text-orange-400"),
-					children: text
-				}, i);
-			})
-		}), /* @__PURE__ */ jsx(PathItemBody, {
-			pathIndex: path.length - 1,
-			objectSearchOverrides: { variant: "in-popover" }
-		})]
+		children: /* @__PURE__ */ jsxs("div", {
+			ref,
+			children: [/* @__PURE__ */ jsx("div", {
+				className: "sticky top-0 -mx-3 flex overflow-x-auto overflow-y-hidden items-center text-sm font-medium font-mono bg-fd-secondary text-fd-secondary-foreground px-3 h-10 border-b z-20",
+				children: path.map((item, i) => {
+					if (i === 0) return;
+					const isDuplicated = path.some((other, j) => j !== i && other.$ref === item.$ref);
+					let text;
+					const indexItemMatch = /^\[(\w+): (\w+)]$/.exec(item.name);
+					if (indexItemMatch) text = `[${indexItemMatch[1]}]`;
+					else if (i > 1) text = `.${item.name}`;
+					else text = item.name;
+					return /* @__PURE__ */ jsx("button", {
+						onClick: () => setPath(path.slice(0, i + 1)),
+						className: cn("hover:underline hover:text-fd-accent-foreground", isDuplicated && "text-orange-400"),
+						children: text
+					}, i);
+				})
+			}), /* @__PURE__ */ jsx(PathItemBody, {
+				pathIndex: path.length - 1,
+				objectSearchOverrides: { variant: "in-popover" }
+			})]
+		})
 	});
 }
 function TypeInfoTrigger({ pathName, $ref, children }) {

package/dist/components/select-tab.js

@@ -37,15 +37,13 @@ function SelectTab({ value, anchorSegments, ...props }) {
 function SelectTabTrigger({ items, className, placeholder, ...props }) {
 	const { value, setValue } = use(Context);
 	return /* @__PURE__ */ jsxs(Select, {
-		value: value ?? "",
+		items,
+		value,
 		onValueChange: setValue,
 		children: [/* @__PURE__ */ jsx(SelectTrigger, {
 			className: cn("not-prose w-fit min-w-0 *:min-w-0", className),
 			...props,
-			children: /* @__PURE__ */ jsx(SelectValue, {
-				placeholder,
-				children: value && items.find((item) => item.value === value)?.label
-			})
+			children: /* @__PURE__ */ jsx(SelectValue, { placeholder })
 		}), /* @__PURE__ */ jsx(SelectContent, { children: items.map(({ label, value }) => /* @__PURE__ */ jsx(SelectItem, {
 			value,
 			children: label