OpenAPI: Render Server Selector Only for Multiple Servers (#1065)

* OpenAPI: Hide the server selector when there is only one server or none defined

* OpenAPI: Improve APIInfo position on smaller screens

* docs: Add changeset
This commit is contained in:
Filip Papiernik
2024-11-17 23:06:02 +08:00
committed by GitHub
parent 556d5dc68b
commit c66df64cd7
3 changed files with 11 additions and 4 deletions
+6
View File
@@ -0,0 +1,6 @@
---
'fumadocs-openapi': minor
---
OpenAPI: Display the server selector only when more than one server is defined in the OpenAPI schema
OpenAPI: Improve APIInfo position for better visibility on smaller screens
+3 -2
View File
@@ -76,10 +76,11 @@ export function CopyRouteButton({
export function BaseUrlSelect({ baseUrls }: { baseUrls: string[] }) {
const { baseUrl, setBaseUrl } = useApiContext();
if (baseUrls.length === 0) return null;
if (baseUrls.length <= 1) return null;
return (
<div className="flex flex-row items-center gap-1 px-1">
<div className="flex flex-row items-center gap-1 px-1 mt-2">
<span className="p-0.5 text-xs font-medium text-fd-muted-foreground">
Server
</span>
+2 -2
View File
@@ -41,7 +41,7 @@ export function APIInfo({
return (
<div className={cn('min-w-0 flex-1', className)} {...props}>
<div className="sticky top-[var(--fd-api-info-top)] z-[4] mb-4 border-b border-fd-foreground/10 bg-fd-card/50 px-4 py-1.5 shadow-lg backdrop-blur-lg max-lg:-mx-3 max-md:-mx-4 md:rounded-xl md:border md:px-1.5">
<div className="mb-2 flex flex-row items-center gap-1.5">
<div className="flex flex-row items-center gap-1.5">
<span
className={cn(
badgeVariants({ color: getBadgeColor(method) }),
@@ -68,7 +68,7 @@ export function API({
<div
{...props}
className={cn(
'flex flex-col gap-x-6 gap-y-4 max-lg:[--fd-toc-height:46px] max-md:[--fd-toc-height:36px] xl:flex-row xl:items-start',
'flex flex-col gap-x-6 gap-y-4 max-xl:[--fd-toc-height:46px] max-md:[--fd-toc-height:36px] xl:flex-row xl:items-start',
props.className,
)}
style={