fumadocs-ui 15.2.8 → 15.2.9

package/css/preset.css

@@ -40,10 +40,8 @@
 
 @utility fd-steps {
   counter-reset: step;
-  border-left-width: 1px;
-  margin-left: 1rem;
-  padding-left: 1.75rem;
   position: relative;
+  @apply pl-6 ml-2 border-l sm:ml-4 sm:pl-7;
 }
 
 @utility fd-step {
@@ -52,16 +50,13 @@
     color: var(--color-fd-secondary-foreground);
     content: counter(step);
     counter-increment: step;
-    border-radius: 9999px;
     justify-content: center;
     align-items: center;
-    width: 2rem;
-    height: 2rem;
     font-size: 0.875rem;
     line-height: 1.25rem;
     display: flex;
     position: absolute;
-    left: -1rem;
+    @apply size-8 -start-4 rounded-full;
   }
 }
 

package/css/shadcn.css

@@ -0,0 +1,18 @@
+@theme {
+  --color-fd-background: var(--background);
+  --color-fd-foreground: var(--foreground);
+  --color-fd-muted: var(--muted);
+  --color-fd-muted-foreground: var(--muted-foreground);
+  --color-fd-popover: var(--popover);
+  --color-fd-popover-foreground: var(--popover-foreground);
+  --color-fd-card: var(--card);
+  --color-fd-card-foreground: var(--card-foreground);
+  --color-fd-border: var(--border);
+  --color-fd-primary: var(--primary);
+  --color-fd-primary-foreground: var(--primary-foreground);
+  --color-fd-secondary: var(--secondary);
+  --color-fd-secondary-foreground: var(--secondary-foreground);
+  --color-fd-accent: var(--accent);
+  --color-fd-accent-foreground: var(--accent-foreground);
+  --color-fd-ring: var(--ring);
+}

package/dist/components/callout.js

@@ -20,6 +20,6 @@ export const Callout = forwardRef(({ className, children, title, type = 'info',
                     info: _jsx(Info, { className: "size-5 fill-blue-500 text-fd-card" }),
                     warn: (_jsx(AlertTriangle, { className: "size-5 fill-orange-500 text-fd-card" })),
                     error: _jsx(CircleX, { className: "size-5 fill-red-500 text-fd-card" }),
-                }[type], _jsxs("div", { className: "min-w-0 flex-1", children: [title ? _jsx("p", { className: "not-prose mb-2 font-medium", children: title }) : null, _jsx("div", { className: "text-fd-muted-foreground prose-no-margin", children: children })] })] }));
+                }[type], _jsxs("div", { className: "min-w-0 flex-1", children: [title ? _jsx("p", { className: "font-medium !my-0", children: title }) : null, _jsx("div", { className: "text-fd-muted-foreground prose-no-margin mt-2 empty:hidden", children: children })] })] }));
 });
 Callout.displayName = 'Callout';

package/dist/components/codeblock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"codeblock.d.ts","sourceRoot":"","sources":["../../src/components/codeblock.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,SAAS,EAIf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AAE3E,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,WAAW,CAAC,GAAG;IACzD;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,aAAa,CAAC,EAAE,uBAAuB,CAAC;CACzC,CAAC;AAEF,eAAO,MAAM,GAAG,2HAYf,CAAC;AAIF,eAAO,MAAM,SAAS;IAxCpB;;;;OAIG;WACI,SAAS;IAEhB;;;;OAIG;gBACS,OAAO;IAEnB;;;;OAIG;qBACc,OAAO;oBAER,uBAAuB;+CAkGxC,CAAC"}
+{"version":3,"file":"codeblock.d.ts","sourceRoot":"","sources":["../../src/components/codeblock.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGL,KAAK,cAAc,EACnB,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AAE3E,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,WAAW,CAAC,GAAG;IACzD;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,aAAa,CAAC,EAAE,uBAAuB,CAAC;CACzC,CAAC;AAEF,eAAO,MAAM,GAAG,2HAYf,CAAC;AAIF,eAAO,MAAM,SAAS;IAxCpB;;;;OAIG;WACI,SAAS;IAEhB;;;;OAIG;gBACS,OAAO;IAEnB;;;;OAIG;qBACc,OAAO;oBAER,uBAAuB;+CAkGxC,CAAC"}

package/dist/components/codeblock.js

@@ -22,7 +22,7 @@ export const CodeBlock = forwardRef(({ title, allowCopy = true, keepBackground =
         });
         void navigator.clipboard.writeText(clone.textContent ?? '');
     }, []);
-    return (_jsxs("figure", { ref: ref, ...props, className: cn('not-prose group fd-codeblock relative my-6 overflow-hidden rounded-lg border bg-fd-secondary/50 text-sm', keepBackground && 'bg-(--shiki-light-bg) dark:bg-(--shiki-dark-bg)', props.className), children: [title ? (_jsxs("div", { className: "flex flex-row items-center gap-2 border-b bg-fd-muted px-4 py-1.5", children: [icon ? (_jsx("div", { className: "text-fd-muted-foreground [&_svg]:size-3.5", dangerouslySetInnerHTML: typeof icon === 'string'
+    return (_jsxs("figure", { ref: ref, ...props, className: cn('not-prose group fd-codeblock relative my-4 overflow-hidden rounded-lg border bg-fd-secondary/50 text-sm', keepBackground && 'bg-(--shiki-light-bg) dark:bg-(--shiki-dark-bg)', props.className), children: [title ? (_jsxs("div", { className: "flex items-center gap-2 border-b bg-fd-muted px-4 py-1.5", children: [icon ? (_jsx("div", { className: "text-fd-muted-foreground [&_svg]:size-3.5", dangerouslySetInnerHTML: typeof icon === 'string'
                             ? {
                                 __html: icon,
                             }

package/dist/components/layout/root-toggle.js

@@ -22,7 +22,7 @@ export function RootToggle({ options, placeholder, ...props }) {
         setOpen(false);
     };
     const item = selected ? _jsx(Item, { ...selected }) : placeholder;
-    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [item ? (_jsxs(PopoverTrigger, { ...props, className: cn('flex flex-row items-center gap-2.5 rounded-lg ps-2 pe-4 py-1.5 hover:text-fd-accent-foreground', props.className), children: [item, _jsx(ChevronsUpDown, { className: "size-4 text-fd-muted-foreground" })] })) : null, _jsx(PopoverContent, { className: "w-(--radix-popover-trigger-width) overflow-hidden p-0", children: options.map((item) => (_jsx(Link, { href: item.url, onClick: onClick, ...item.props, className: cn('flex w-full flex-row items-center gap-2 px-2 py-1.5', selected === item
+    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [item ? (_jsxs(PopoverTrigger, { ...props, className: cn('flex items-center gap-2.5 rounded-lg pe-2 hover:text-fd-accent-foreground', props.className), children: [item, _jsx(ChevronsUpDown, { className: "size-4 text-fd-muted-foreground" })] })) : null, _jsx(PopoverContent, { className: "w-(--radix-popover-trigger-width) overflow-hidden p-0", children: options.map((item) => (_jsx(Link, { href: item.url, onClick: onClick, ...item.props, className: cn('flex w-full flex-row items-center gap-2 px-2 py-1.5', selected === item
                         ? 'bg-fd-accent text-fd-accent-foreground'
                         : 'hover:bg-fd-accent/50', item.props?.className), children: _jsx(Item, { ...item }) }, item.url))) })] }));
 }

package/dist/components/layout/sidebar.js

@@ -70,7 +70,7 @@ export function Sidebar({ defaultOpenLevel = 0, prefetch = true, inner, ...props
             }, children: _jsx("div", { ...inner, className: cn('flex size-full max-w-full flex-col pt-2 md:ms-auto md:w-(--fd-sidebar-width) md:border-e md:pt-4', inner?.className), children: props.children }) }) }));
 }
 export function SidebarHeader(props) {
-    return (_jsx("div", { ...props, className: cn('flex flex-col gap-2 px-4 empty:hidden', props.className), children: props.children }));
+    return (_jsx("div", { ...props, className: cn('flex flex-col gap-3 px-4 empty:hidden', props.className), children: props.children }));
 }
 export function SidebarFooter(props) {
     return (_jsx("div", { ...props, className: cn('flex flex-col border-t px-4 py-3 empty:hidden', props.className), children: props.children }));

package/dist/layouts/docs.d.ts

@@ -1,6 +1,6 @@
 import type { PageTree } from 'fumadocs-core/server';
-import { type ReactNode, type HTMLAttributes } from 'react';
-import { type LinkItemType, type IconItemType } from '../layouts/links.js';
+import { type HTMLAttributes, type ReactNode } from 'react';
+import { type IconItemType, type LinkItemType } from '../layouts/links.js';
 import { type BaseLayoutProps } from './shared.js';
 import { CollapsibleControl, Navbar, NavbarSidebarTrigger } from '../layouts/docs-client.js';
 import { type SidebarOptions } from '../layouts/docs/shared.js';

package/dist/layouts/docs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"docs.d.ts","sourceRoot":"","sources":["../../src/layouts/docs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,cAAc,EAAW,MAAM,OAAO,CAAC;AAcrE,OAAO,EACL,KAAK,YAAY,EAEjB,KAAK,YAAY,EAClB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,KAAK,eAAe,EAAY,MAAM,UAAU,CAAC;AAK1D,OAAO,EACL,kBAAkB,EAClB,MAAM,EACN,oBAAoB,EACrB,MAAM,uBAAuB,CAAC;AAO/B,OAAO,EAIL,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAQ/B,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,GAAG;QAClC,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,SAAS,CAAC,EAAE,SAAS,CAAC;KACvB,CAAC;IAEF;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,wBAAgB,UAAU,CAAC,EACzB,GAAG,EAAE,EAAE,eAAe,EAAE,GAAG,GAAG,EAAO,EACrC,YAAY,EACZ,kBAA0B,EAC1B,WAA8C,EAC9C,OAAO,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,OAAO,EAAO,EAC9C,IAAY,EACZ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,GAAG,SAAS,CAoG7B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,WAAkB,EAClB,UAAU,EACV,GAAG,EACH,KAAU,EACV,MAAM,EACN,MAAM,EACN,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,GAAG;IAChC,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,GAAG,CAAC,EAAE,SAAS,CAAC;CACjB,2CA2CA;AAED,wBAAgB,uBAAuB,CAAC,EACtC,IAAI,EACJ,WAAW,EACX,KAAU,GACX,EAAE;IACD,IAAI,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC/B,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,WAAW,CAAC,EAAE,eAAe,CAAC,aAAa,CAAC,CAAC;CAC9C,kDAiCA;AAED,OAAO,EAAE,kBAAkB,EAAE,MAAM,EAAE,oBAAoB,EAAE,KAAK,YAAY,EAAE,CAAC;AAC/E,OAAO,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAC"}
+{"version":3,"file":"docs.d.ts","sourceRoot":"","sources":["../../src/layouts/docs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAW,MAAM,OAAO,CAAC;AAcrE,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,YAAY,EAClB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,KAAK,eAAe,EAAY,MAAM,UAAU,CAAC;AAK1D,OAAO,EACL,kBAAkB,EAClB,MAAM,EACN,oBAAoB,EACrB,MAAM,uBAAuB,CAAC;AAO/B,OAAO,EAIL,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAQ/B,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,GAAG;QAClC,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,SAAS,CAAC,EAAE,SAAS,CAAC;KACvB,CAAC;IAEF;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,wBAAgB,UAAU,CAAC,EACzB,GAAG,EAAE,EAAE,eAAe,EAAE,GAAG,GAAG,EAAO,EACrC,YAAY,EACZ,kBAA0B,EAC1B,WAA8C,EAC9C,OAAO,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,OAAO,EAAO,EAC9C,IAAY,EACZ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,GAAG,SAAS,CAkG7B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,WAAkB,EAClB,UAAU,EACV,GAAG,EACH,KAAU,EACV,MAAM,EACN,MAAM,EACN,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,GAAG;IAChC,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,GAAG,CAAC,EAAE,SAAS,CAAC;CACjB,2CA2CA;AAED,wBAAgB,uBAAuB,CAAC,EACtC,IAAI,EACJ,WAAW,EACX,KAAU,GACX,EAAE;IACD,IAAI,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC/B,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,WAAW,CAAC,EAAE,eAAe,CAAC,aAAa,CAAC,CAAC;CAC9C,kDAiCA;AAED,OAAO,EAAE,kBAAkB,EAAE,MAAM,EAAE,oBAAoB,EAAE,KAAK,YAAY,EAAE,CAAC;AAC/E,OAAO,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAC"}

package/dist/layouts/docs.js

@@ -3,7 +3,7 @@ import { useMemo } from 'react';
 import { Languages, SidebarIcon } from 'lucide-react';
 import { cn } from '../utils/cn.js';
 import { buttonVariants } from '../components/ui/button.js';
-import { CollapsibleSidebar, Sidebar, SidebarFooter, SidebarHeader, SidebarCollapseTrigger, SidebarViewport, SidebarPageTree, } from '../components/layout/sidebar.js';
+import { CollapsibleSidebar, Sidebar, SidebarCollapseTrigger, SidebarFooter, SidebarHeader, SidebarPageTree, SidebarViewport, } from '../components/layout/sidebar.js';
 import { slot, slots } from '../layouts/shared.js';
 import { BaseLinkItem, } from '../layouts/links.js';
 import { RootToggle } from '../components/layout/root-toggle.js';
@@ -14,7 +14,7 @@ import { TreeContextProvider } from '../contexts/tree.js';
 import { ThemeToggle } from '../components/layout/theme-toggle.js';
 import { LargeSearchToggle, SearchToggle, } from '../components/layout/search-toggle.js';
 import { getSidebarTabsFromOptions, layoutVariables, SidebarLinkItem, } from '../layouts/docs/shared.js';
-import { StylesProvider, NavProvider, } from '../contexts/layout.js';
+import { NavProvider, StylesProvider, } from '../contexts/layout.js';
 import Link from 'fumadocs-core/link';
 export function DocsLayout({ nav: { transparentMode, ...nav } = {}, searchToggle, disableThemeSwitch = false, themeSwitch = { enabled: !disableThemeSwitch }, sidebar: { tabs: tabOptions, ...sidebar } = {}, i18n = false, children, ...props }) {
     const tabs = useMemo(() => getSidebarTabsFromOptions(tabOptions, props.tree) ?? [], [tabOptions, props.tree]);
@@ -29,14 +29,14 @@ export function DocsLayout({ nav: { transparentMode, ...nav } = {}, searchToggle
     return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsxs(NavProvider, { transparentMode: transparentMode, children: [slot(nav, _jsxs(Navbar, { className: "md:hidden", children: [_jsx(Link, { href: nav.url ?? '/', className: "inline-flex items-center gap-2.5 font-semibold", children: nav.title }), _jsx("div", { className: "flex flex-1 flex-row items-center gap-1", children: nav.children }), slots('sm', searchToggle, _jsx(SearchToggle, { hideIfDisabled: true })), _jsx(NavbarSidebarTrigger, { className: "-me-2 md:hidden" })] })), _jsxs("main", { id: "nd-docs-layout", ...props.containerProps, className: cn('flex flex-1 flex-row pe-(--fd-layout-offset)', variables, props.containerProps?.className), style: {
                         ...layoutVariables,
                         ...props.containerProps?.style,
-                    }, children: [slot(sidebar, _jsx(DocsLayoutSidebar, { ...sidebar, links: links, nav: _jsxs(_Fragment, { children: [_jsx(Link, { href: nav.url ?? '/', className: "inline-flex text-[15px] items-center gap-2.5 font-medium", children: nav.title }), nav.children] }), banner: _jsxs(_Fragment, { children: [tabs.length > 0 ? (_jsx(RootToggle, { options: tabs, className: "-mx-2" })) : null, slots('lg', searchToggle, _jsx(LargeSearchToggle, { hideIfDisabled: true, className: "rounded-lg max-md:hidden" })), sidebar.banner] }), footer: _jsxs(_Fragment, { children: [_jsx(DocsLayoutSidebarFooter, { links: links.filter((item) => item.type === 'icon'), i18n: i18n, themeSwitch: themeSwitch }), sidebar.footer] }) })), _jsx(StylesProvider, { ...pageStyles, children: children })] })] }) }));
+                    }, children: [slot(sidebar, _jsx(DocsLayoutSidebar, { ...sidebar, links: links, nav: _jsxs(_Fragment, { children: [_jsx(Link, { href: nav.url ?? '/', className: "inline-flex text-[15px] items-center gap-2.5 font-medium", children: nav.title }), nav.children] }), banner: _jsxs(_Fragment, { children: [tabs.length > 0 ? _jsx(RootToggle, { options: tabs }) : null, slots('lg', searchToggle, _jsx(LargeSearchToggle, { hideIfDisabled: true, className: "rounded-lg max-md:hidden" })), sidebar.banner] }), footer: _jsxs(_Fragment, { children: [_jsx(DocsLayoutSidebarFooter, { links: links.filter((item) => item.type === 'icon'), i18n: i18n, themeSwitch: themeSwitch }), sidebar.footer] }) })), _jsx(StylesProvider, { ...pageStyles, children: children })] })] }) }));
 }
 export function DocsLayoutSidebar({ collapsible = true, components, nav, links = [], footer, banner, ...props }) {
     const Aside = collapsible ? CollapsibleSidebar : Sidebar;
-    return (_jsxs(_Fragment, { children: [collapsible ? _jsx(CollapsibleControl, {}) : null, _jsxs(Aside, { ...props, className: cn('md:ps-(--fd-layout-offset)', props.className), children: [_jsxs(SidebarHeader, { children: [_jsxs("div", { className: "flex flex-row pt-1 max-md:hidden", children: [nav, collapsible && (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
+    return (_jsxs(_Fragment, { children: [collapsible ? _jsx(CollapsibleControl, {}) : null, _jsxs(Aside, { ...props, className: cn('md:ps-(--fd-layout-offset)', props.className), children: [_jsxs(SidebarHeader, { children: [_jsxs("div", { className: "flex flex-row py-1.5 max-md:hidden", children: [nav, collapsible && (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
                                             color: 'ghost',
                                             size: 'icon-sm',
-                                        }), 'ms-auto mb-auto text-fd-muted-foreground max-md:hidden'), children: _jsx(SidebarIcon, {}) }))] }), banner] }), _jsxs(SidebarViewport, { children: [_jsx("div", { className: "mb-4 empty:hidden", children: links
+                                        }), 'ms-auto mb-auto -my-1.5 text-fd-muted-foreground max-md:hidden'), children: _jsx(SidebarIcon, {}) }))] }), banner] }), _jsxs(SidebarViewport, { children: [_jsx("div", { className: "mb-4 empty:hidden", children: links
                                     .filter((v) => v.type !== 'icon')
                                     .map((item, i) => (_jsx(SidebarLinkItem, { item: item }, i))) }), _jsx(SidebarPageTree, { components: components })] }), _jsx(SidebarFooter, { children: footer })] })] }));
 }

package/dist/layouts/notebook.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment, useMemo } from 'react';
 import { getLinks, slot, slots } from '../layouts/shared.js';
-import { CollapsibleSidebar, Sidebar, SidebarCollapseTrigger, SidebarFooter, SidebarHeader, SidebarViewport, SidebarPageTree, } from '../components/layout/sidebar.js';
+import { CollapsibleSidebar, Sidebar, SidebarCollapseTrigger, SidebarFooter, SidebarHeader, SidebarPageTree, SidebarViewport, } from '../components/layout/sidebar.js';
 import { TreeContextProvider } from '../contexts/tree.js';
 import { cn } from '../utils/cn.js';
 import { buttonVariants } from '../components/ui/button.js';
@@ -12,7 +12,7 @@ import { ThemeToggle } from '../components/layout/theme-toggle.js';
 import { Popover, PopoverContent, PopoverTrigger, } from '../components/ui/popover.js';
 import { getSidebarTabsFromOptions, layoutVariables, SidebarLinkItem, } from '../layouts/docs/shared.js';
 import { LayoutTab, LayoutTabs, Navbar, NavbarSidebarTrigger, SidebarLayoutTab, } from './notebook-client.js';
-import { StylesProvider, NavProvider, } from '../contexts/layout.js';
+import { NavProvider, StylesProvider, } from '../contexts/layout.js';
 import { RootToggle } from '../components/layout/root-toggle.js';
 import Link from 'fumadocs-core/link';
 import { LargeSearchToggle, SearchToggle, } from '../components/layout/search-toggle.js';
@@ -37,7 +37,7 @@ export function DocsLayout({ tabMode = 'sidebar', nav: { transparentMode, ...nav
                         }, children: [_jsxs(SidebarHeader, { children: [navMode === 'auto' && (_jsxs("div", { className: "flex flex-row justify-between max-md:hidden", children: [_jsx(Link, { href: nav.url ?? '/', className: "inline-flex items-center gap-2.5 font-medium", children: nav.title }), _jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
                                                     color: 'ghost',
                                                     size: 'icon-sm',
-                                                }), 'text-fd-muted-foreground mb-auto'), children: _jsx(SidebarIcon, {}) })] })), nav.children, sidebarBanner, tabMode === 'sidebar' && tabs.length > 0 ? (_jsx(RootToggle, { options: tabs, className: "-mx-2" })) : null] }), _jsxs(SidebarViewport, { children: [tabMode === 'navbar' &&
+                                                }), 'text-fd-muted-foreground mb-auto'), children: _jsx(SidebarIcon, {}) })] })), nav.children, sidebarBanner, tabMode === 'sidebar' && tabs.length > 0 ? (_jsx(RootToggle, { options: tabs })) : null] }), _jsxs(SidebarViewport, { children: [tabMode === 'navbar' &&
                                         tabs.map((tab, i) => (_jsx(SidebarLayoutTab, { item: tab, className: cn('lg:hidden', i === tabs.length - 1 && 'mb-4') }, tab.url))), links.map((item, i) => (_jsx(SidebarLinkItem, { item: item, className: cn('lg:hidden', i === links.length - 1 && 'mb-4') }, i))), _jsx(SidebarPageTree, { components: sidebarComponents })] }), _jsxs(SidebarFooter, { className: cn('flex flex-row items-center', !sidebarFooter && 'md:hidden'), children: [i18n ? (_jsx(LanguageToggle, { className: "me-auto md:hidden", children: _jsx(Languages, { className: "size-5 text-fd-muted-foreground" }) })) : null, slot(themeSwitch, _jsx(ThemeToggle, { className: "md:hidden", mode: themeSwitch?.mode ?? 'light-dark-system' })), sidebarFooter] })] }), _jsx(DocsNavbar, { mode: nav.mode, nav: _jsx(Link, { href: nav.url ?? '/', className: cn('inline-flex items-center gap-2.5 font-semibold', navMode === 'auto' && 'md:hidden'), children: nav.title }), links: links, i18n: i18n, sidebarCollapsible: sidebarCollapsible, searchToggle: searchToggle, tabs: tabMode == 'navbar' ? tabs : [], children: nav.children }), _jsx(StylesProvider, { ...pageStyles, children: props.children })] }) }) }));
 }
 function DocsNavbar({ mode: navMode = 'auto', nav, sidebarCollapsible = false, links, themeSwitch, searchToggle, i18n = false, tabs, children, }) {
@@ -46,7 +46,7 @@ function DocsNavbar({ mode: navMode = 'auto', nav, sidebarCollapsible = false, l
                                     size: 'icon-sm',
                                 }), 'text-fd-muted-foreground -ms-1.5 me-2 data-[collapsed=false]:hidden max-md:hidden'), children: _jsx(SidebarIcon, {}) })) : null, nav] }), slots('lg', searchToggle, _jsx(LargeSearchToggle, { hideIfDisabled: true, className: cn('w-full my-auto rounded-xl max-md:hidden', navMode === 'top' ? 'max-w-sm px-2' : 'max-w-[240px]') })), _jsxs("div", { className: "flex flex-1 flex-row items-center justify-end", children: [_jsx("div", { className: "flex flex-row items-center gap-6 px-4 empty:hidden max-lg:hidden", children: links
                                     .filter((item) => item.type !== 'icon')
-                                    .map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: "text-sm text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground" }, i))) }), children, slots('sm', searchToggle, _jsx(SearchToggle, { hideIfDisabled: true, className: "md:hidden" })), _jsx(NavbarSidebarTrigger, { className: "md:hidden" }), links
+                                    .map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: "text-sm text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground" }, i))) }), children, slots('sm', searchToggle, _jsx(SearchToggle, { hideIfDisabled: true, className: "md:hidden" })), _jsx(NavbarSidebarTrigger, { className: "-me-1.5 md:hidden" }), links
                                 .filter((item) => item.type === 'icon')
                                 .map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({ size: 'icon-sm', color: 'ghost' }), 'text-fd-muted-foreground max-lg:hidden'), "aria-label": item.label, children: item.icon }, i))), i18n ? (_jsx(LanguageToggle, { className: "max-md:hidden", children: _jsx(Languages, { className: "size-4.5 text-fd-muted-foreground" }) })) : null, slot(themeSwitch, _jsx(ThemeToggle, { className: "ms-2 max-md:hidden", mode: themeSwitch?.mode ?? 'light-dark-system' })), sidebarCollapsible && navMode === 'top' ? (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
                                     color: 'secondary',

package/dist/mdx.server.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mdx.server.d.ts","sourceRoot":"","sources":["../src/mdx.server.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC7E,OAAO,KAAK,EAAE,cAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,oBAAoB,MAAM,OAAO,CAAC;AAEzC;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAChC,MAAM,EAAE,YAAY,CAAC,YAAY,CAAC,EAClC,IAAI,EAAE,IAAI,EACV,YAAY,GAAE,EAAE,CAAC,cAAc,CAAC,GAAG,CAAC,CAA0B,GAC7D,EAAE,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAUzB;AAED,OAAO,EAAE,oBAAoB,IAAI,OAAO,EAAE,CAAC"}
+{"version":3,"file":"mdx.server.d.ts","sourceRoot":"","sources":["../src/mdx.server.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC7E,OAAO,KAAK,EAAE,cAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,oBAAoB,MAAM,OAAO,CAAC;AAEzC;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAChC,MAAM,EAAE,YAAY,CAAC,YAAY,CAAC,EAClC,IAAI,EAAE,IAAI,EACV,YAAY,GAAE,EAAE,CAAC,cAAc,CAAC,GAAG,CAAC,CAA0B,GAC7D,EAAE,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAezB;AAED,OAAO,EAAE,oBAAoB,IAAI,OAAO,EAAE,CAAC"}

package/dist/mdx.server.js

@@ -12,8 +12,11 @@ export function createRelativeLink(source, page, OverrideLink = defaultMdxCompon
         // resolve relative href
         if (href && href.startsWith('.')) {
             const target = source.getPageByHref(href, { dir: page.file.dirname });
-            if (target)
-                href = target.page.url;
+            if (target) {
+                href = target.hash
+                    ? `${target.page.url}#${target.hash}`
+                    : target.page.url;
+            }
         }
         return _jsx(OverrideLink, { href: href, ...props });
     };

package/dist/style.css

@@ -244,24 +244,31 @@
       color: var(--color-fd-secondary-foreground);
       content: counter(step);
       counter-increment: step;
-      border-radius: 9999px;
       justify-content: center;
       align-items: center;
-      width: 2rem;
-      height: 2rem;
       font-size: 0.875rem;
       line-height: 1.25rem;
       display: flex;
       position: absolute;
-      left: -1rem;
+      inset-inline-start: calc(var(--spacing) * -4);
+      width: calc(var(--spacing) * 8);
+      height: calc(var(--spacing) * 8);
+      border-radius: calc(infinity * 1px);
     }
   }
   .fd-steps {
     counter-reset: step;
-    border-left-width: 1px;
-    margin-left: 1rem;
-    padding-left: 1.75rem;
     position: relative;
+    margin-left: calc(var(--spacing) * 2);
+    border-left-style: var(--tw-border-style);
+    border-left-width: 1px;
+    padding-left: calc(var(--spacing) * 6);
+    @media (width >= 40rem) {
+      margin-left: calc(var(--spacing) * 4);
+    }
+    @media (width >= 40rem) {
+      padding-left: calc(var(--spacing) * 7);
+    }
   }
   .absolute {
     position: absolute;
@@ -396,6 +403,9 @@
   .\!my-0 {
     margin-block: calc(var(--spacing) * 0) !important;
   }
+  .-my-1\.5 {
+    margin-block: calc(var(--spacing) * -1.5);
+  }
   .my-0 {
     margin-block: calc(var(--spacing) * 0);
   }
@@ -816,6 +826,9 @@
   .mt-\(--fd-top\) {
     margin-top: var(--fd-top);
   }
+  .mt-2 {
+    margin-top: calc(var(--spacing) * 2);
+  }
   .mt-6 {
     margin-top: calc(var(--spacing) * 6);
   }
@@ -1398,15 +1411,15 @@
   .pe-\(--fd-layout-offset\) {
     padding-inline-end: var(--fd-layout-offset);
   }
+  .pe-2 {
+    padding-inline-end: calc(var(--spacing) * 2);
+  }
   .pe-4 {
     padding-inline-end: calc(var(--spacing) * 4);
   }
   .pt-0 {
     padding-top: calc(var(--spacing) * 0);
   }
-  .pt-1 {
-    padding-top: calc(var(--spacing) * 1);
-  }
   .pt-2 {
     padding-top: calc(var(--spacing) * 2);
   }
@@ -2411,6 +2424,11 @@
     flex-direction: column;
   }
 }
+@property --tw-border-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}
 @property --tw-translate-x {
   syntax: "*";
   inherits: false;
@@ -2466,11 +2484,6 @@
   inherits: false;
   initial-value: 0;
 }
-@property --tw-border-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}
 @property --tw-font-weight {
   syntax: "*";
   inherits: false;
@@ -2796,6 +2809,7 @@
 @layer properties {
   @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
     *, ::before, ::after, ::backdrop {
+      --tw-border-style: solid;
       --tw-translate-x: 0;
       --tw-translate-y: 0;
       --tw-translate-z: 0;
@@ -2808,7 +2822,6 @@
       --tw-skew-x: initial;
       --tw-skew-y: initial;
       --tw-divide-y-reverse: 0;
-      --tw-border-style: solid;
       --tw-font-weight: initial;
       --tw-shadow: 0 0 #0000;
       --tw-shadow-color: initial;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-ui",
-  "version": "15.2.8",
+  "version": "15.2.9",
   "description": "The framework for building a documentation website in Next.js",
   "keywords": [
     "NextJs",
@@ -84,7 +84,7 @@
     "postcss-selector-parser": "^7.1.0",
     "react-medium-image-zoom": "^5.2.14",
     "tailwind-merge": "^3.2.0",
-    "fumadocs-core": "15.2.8"
+    "fumadocs-core": "15.2.9"
   },
   "devDependencies": {
     "@next/eslint-plugin-next": "^15.3.1",
@@ -96,8 +96,8 @@
     "tailwindcss": "^4.1.4",
     "tsc-alias": "^1.8.15",
     "@fumadocs/cli": "0.1.1",
-    "fumadocs-core": "15.2.8",
     "eslint-config-custom": "0.0.0",
+    "fumadocs-core": "15.2.9",
     "tsconfig": "0.0.0"
   },
   "peerDependencies": {