fumadocs-ui 14.5.4 → 14.5.6

package/dist/components/dialog/search.js

@@ -17,7 +17,7 @@ export function SearchDialog({ open, onOpenChange, footer, links = [], ...props
         content: name,
         url: link,
     })), [links]);
-    return (_jsxs(Dialog, { open: open, onOpenChange: onOpenChange, children: [_jsx(DialogOverlay, { className: "fixed inset-0 z-50 bg-fd-background/50 backdrop-blur-sm data-[state=closed]:animate-fd-fade-out data-[state=open]:animate-fd-fade-in" }), _jsxs(DialogContent, { "aria-describedby": undefined, className: "fixed left-1/2 top-[10vh] z-50 w-[98vw] max-w-screen-sm origin-left -translate-x-1/2 rounded-lg border bg-fd-popover text-fd-popover-foreground shadow-lg data-[state=closed]:animate-fd-dialog-out data-[state=open]:animate-fd-dialog-in", children: [_jsx(DialogTitle, { className: "hidden", children: text.search }), _jsx(SearchInput, { search: props.search, onSearchChange: props.onSearchChange, isLoading: props.isLoading }), _jsx(SearchList, { items: props.results === 'empty' ? defaultItems : props.results, hideResults: props.results === 'empty' && defaultItems.length === 0 }), footer ? (_jsx("div", { className: "mt-auto flex flex-col border-t p-3", children: footer })) : null] })] }));
+    return (_jsxs(Dialog, { open: open, onOpenChange: onOpenChange, children: [_jsx(DialogOverlay, { className: "fixed inset-0 z-50 bg-black/30 backdrop-blur-sm data-[state=closed]:animate-fd-fade-out data-[state=open]:animate-fd-fade-in" }), _jsxs(DialogContent, { "aria-describedby": undefined, className: "fixed left-1/2 top-[10vh] z-50 w-[98vw] max-w-screen-sm origin-left -translate-x-1/2 rounded-lg border bg-fd-popover text-fd-popover-foreground shadow-lg data-[state=closed]:animate-fd-dialog-out data-[state=open]:animate-fd-dialog-in", children: [_jsx(DialogTitle, { className: "hidden", children: text.search }), _jsx(SearchInput, { search: props.search, onSearchChange: props.onSearchChange, isLoading: props.isLoading }), _jsx(SearchList, { items: props.results === 'empty' ? defaultItems : props.results, hideResults: props.results === 'empty' && defaultItems.length === 0 }), footer ? (_jsx("div", { className: "mt-auto flex flex-col border-t p-3", children: footer })) : null] })] }));
 }
 const icons = {
     text: _jsx(Text, { className: "size-4 text-fd-muted-foreground" }),
@@ -92,5 +92,5 @@ function CommandItem({ active, onActiveChange, value, ...props }) {
                     block: 'nearest',
                 });
             }
-        }, [active, value]), type: "button", "aria-selected": active === value, onPointerMove: () => onActiveChange(value), ...props, className: cn('flex min-h-10 select-none flex-row items-center gap-2.5 rounded-lg px-2 text-start text-sm aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-selected:bg-fd-accent aria-selected:text-fd-accent-foreground', props.className), children: props.children }));
+        }, [active, value]), type: "button", "aria-selected": active === value, onPointerMove: () => onActiveChange(value), ...props, className: cn('flex min-h-10 select-none flex-row items-center gap-2.5 rounded-lg px-2 text-start text-sm', active === value && 'bg-fd-accent text-fd-accent-foreground', props.className), children: props.children }));
 }

package/dist/components/layout/root-toggle.d.ts

@@ -1,5 +1,4 @@
 import { type HTMLAttributes, type ReactNode } from 'react';
-import type { PageTree } from 'fumadocs-core/server';
 export interface Option {
     /**
      * Redirect URL of the folder, usually the index page
@@ -9,12 +8,13 @@ export interface Option {
     title: ReactNode;
     description?: ReactNode;
     /**
-     * Detect from page tree nodes
+     * Detect from a list of urls
      */
-    folder?: PageTree.Folder;
+    urls?: string[];
     props?: HTMLAttributes<HTMLElement>;
 }
-export declare function RootToggle({ options, ...props }: {
+export declare function RootToggle({ options, placeholder, ...props }: {
+    placeholder?: ReactNode;
     options: Option[];
 } & HTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=root-toggle.d.ts.map

package/dist/components/layout/root-toggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"root-toggle.d.ts","sourceRoot":"","sources":["../../../src/components/layout/root-toggle.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAqB,MAAM,OAAO,CAAC;AAO/E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAGrD,MAAM,WAAW,MAAM;IACrB;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;OAEG;IACH,MAAM,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC;IAEzB,KAAK,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;CACrC;AAED,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,GAAG,KAAK,EACT,EAAE;IACD,OAAO,EAAE,MAAM,EAAE,CAAC;CACnB,GAAG,cAAc,CAAC,iBAAiB,CAAC,2CAqDpC"}
+{"version":3,"file":"root-toggle.d.ts","sourceRoot":"","sources":["../../../src/components/layout/root-toggle.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAqB,MAAM,OAAO,CAAC;AAQ/E,MAAM,WAAW,MAAM;IACrB;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAEhB,KAAK,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;CACrC;AAED,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,WAAW,EACX,GAAG,KAAK,EACT,EAAE;IACD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,OAAO,EAAE,MAAM,EAAE,CAAC;CACnB,GAAG,cAAc,CAAC,iBAAiB,CAAC,2CAuDpC"}

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

@@ -8,22 +8,21 @@ import { cn } from '../../utils/cn';
 import { isActive } from '../../utils/is-active';
 import { useSidebar } from '../../contexts/sidebar';
 import { Popover, PopoverContent, PopoverTrigger } from '../ui/popover';
-import { useTreePath } from '../../contexts/tree';
-export function RootToggle({ options, ...props }) {
+export function RootToggle({ options, placeholder, ...props }) {
     const [open, setOpen] = useState(false);
     const { closeOnRedirect } = useSidebar();
     const pathname = usePathname();
-    const path = useTreePath();
     const selected = useMemo(() => {
-        return options.findLast((item) => item.folder
-            ? path.includes(item.folder)
+        return options.findLast((item) => item.urls
+            ? item.urls.includes(pathname)
             : isActive(item.url, pathname, true));
-    }, [path, options, pathname]);
+    }, [options, pathname]);
     const onClick = () => {
         closeOnRedirect.current = false;
         setOpen(false);
     };
-    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsxs(PopoverTrigger, { ...props, className: cn('flex flex-row items-center gap-2 rounded-lg px-2 py-1.5 hover:bg-fd-accent/50 hover:text-fd-accent-foreground', props.className), children: [selected ? _jsx(Item, { ...selected }) : null, _jsx(ChevronDown, { className: "me-1.5 size-4 text-fd-muted-foreground" })] }), _jsx(PopoverContent, { className: "w-[var(--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
+    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 rounded-lg px-2 py-1.5 hover:bg-fd-accent/50 hover:text-fd-accent-foreground', props.className), children: [item, _jsx(ChevronDown, { className: "me-1.5 size-4 text-fd-muted-foreground" })] })) : null, _jsx(PopoverContent, { className: "w-[var(--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/toc.d.ts

@@ -1,5 +1,6 @@
 import type { TOCItemType } from 'fumadocs-core/server';
 import { type HTMLAttributes, type ReactNode } from 'react';
+import type { PopoverContentProps, PopoverTriggerProps } from '@radix-ui/react-popover';
 export interface TOCProps {
     /**
      * Custom content in TOC container, before the main TOC
@@ -17,4 +18,9 @@ export declare function TOCItems({ items, isMenu, }: {
     items: TOCItemType[];
     isMenu?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
+export declare const TocPopover: import("react").FC<import("@radix-ui/react-popover").PopoverProps>;
+export declare function TocPopoverTrigger({ items, ...props }: PopoverTriggerProps & {
+    items: TOCItemType[];
+}): import("react/jsx-runtime").JSX.Element;
+export declare function TocPopoverContent(props: PopoverContentProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=toc.d.ts.map

package/dist/components/layout/toc.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toc.d.ts","sourceRoot":"","sources":["../../../src/components/layout/toc.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAU,MAAM,OAAO,CAAC;AAMpE,MAAM,WAAW,QAAQ;IACvB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAoBxD;AAED,wBAAgB,aAAa,4CAQ5B;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,MAAc,GACf,EAAE;IACD,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,2CA6BA"}
+{"version":3,"file":"toc.d.ts","sourceRoot":"","sources":["../../../src/components/layout/toc.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAmB,MAAM,OAAO,CAAC;AAU7E,OAAO,KAAK,EACV,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,yBAAyB,CAAC;AAGjC,MAAM,WAAW,QAAQ;IACvB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAoBxD;AAED,wBAAgB,aAAa,4CAQ5B;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,MAAc,GACf,EAAE;IACD,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,2CA6BA;AAkBD,eAAO,MAAM,UAAU,oEAAU,CAAC;AAElC,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,GAAG;IAAE,KAAK,EAAE,WAAW,EAAE,CAAA;CAAE,2CAyBhD;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,mBAAmB,2CAiB3D"}

package/dist/components/layout/toc.js

@@ -1,11 +1,13 @@
 'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import * as Primitive from 'fumadocs-core/toc';
-import { useRef } from 'react';
+import { useMemo, useRef } from 'react';
 import { cn } from '../../utils/cn';
 import { useI18n } from '../../contexts/i18n';
 import { TocThumb } from '../../components/layout/toc-thumb';
 import { ScrollArea, ScrollViewport } from '../ui/scroll-area';
+import { Popover, PopoverContent, PopoverTrigger, } from '../../components/ui/popover';
+import { ChevronRight, Text } from 'lucide-react';
 export function Toc(props) {
     return (_jsx("div", { ...props, "data-toc": "", className: cn('sticky top-fd-layout-top h-[var(--fd-toc-height)] flex-1 pb-2 pt-12', props.className), style: {
             ...props.style,
@@ -26,3 +28,15 @@ export function TOCItems({ items, isMenu = false, }) {
 function TOCItem({ item }) {
     return (_jsx(Primitive.TOCItem, { href: item.url, className: cn('prose py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary', item.depth <= 2 && 'ps-3.5', item.depth === 3 && 'ps-6', item.depth >= 4 && 'ps-8'), children: item.title }));
 }
+export const TocPopover = Popover;
+export function TocPopoverTrigger({ items, ...props }) {
+    const { text } = useI18n();
+    const active = Primitive.useActiveAnchor();
+    const current = useMemo(() => {
+        return items.find((item) => active === item.url.slice(1))?.title;
+    }, [items, active]);
+    return (_jsxs(PopoverTrigger, { ...props, className: cn('inline-flex items-center gap-2 text-nowrap px-4 py-2 text-start', props.className), children: [_jsx(Text, { className: "size-4 shrink-0" }), text.toc, current ? (_jsxs(_Fragment, { children: [_jsx(ChevronRight, { className: "-mx-1.5 size-4 shrink-0 text-fd-muted-foreground" }), _jsx("span", { className: "truncate text-fd-muted-foreground", children: current })] })) : null] }));
+}
+export function TocPopoverContent(props) {
+    return (_jsx(PopoverContent, { hideWhenDetached: true, alignOffset: 16, align: "start", side: "bottom", "data-toc-popover": "", ...props, className: cn('flex max-h-[var(--radix-popover-content-available-height)] w-[260px] flex-col gap-4 p-3', props.className), children: props.children }));
+}

package/dist/layouts/docs/navbar.js

@@ -9,7 +9,7 @@ import { Menu, X } from 'lucide-react';
 export function Navbar(props) {
     const { open } = useSidebar();
     const { isTransparent } = useNav();
-    return (_jsx("header", { ...props, className: cn('sticky top-[var(--fd-banner-height)] z-30 flex flex-row items-center border-b border-fd-foreground/10 px-4 transition-colors', (!isTransparent || open) && 'bg-fd-background/80 backdrop-blur-lg', props.className), children: props.children }));
+    return (_jsx("header", { ...props, className: cn('sticky top-[var(--fd-banner-height)] z-30 flex flex-row items-center border-b border-fd-foreground/10 px-4 backdrop-blur-lg transition-colors', (!isTransparent || open) && 'bg-fd-background/80', props.className), children: props.children }));
 }
 export function NavbarSidebarTrigger(props) {
     const { open } = useSidebar();

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

@@ -1 +1 @@
-{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/sidebar.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,KAAK,oBAAoB,EAEzB,KAAK,cAAc,EAEnB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AACf,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAU1D,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAInE,OAAO,KAAK,EACV,uBAAuB,EACvB,uBAAuB,EACxB,MAAM,6BAA6B,CAAC;AAGrC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA6BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,YAAY,2CAqDrD;AAED,wBAAgB,OAAO,CAAC,EACtB,gBAAoB,EACpB,QAAe,EACf,KAAK,EACL,GAAG,KAAK,EACT,EAAE,YAAY,GAAG;IAAE,KAAK,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAA;CAAE,2CAuC3D;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAYlE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAYlE;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,eAAe,2CAYrD;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,oBAAoB,CAAC,2CAY3E;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,SAAS,GAAG;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,2CAiBA;AAED,wBAAgB,aAAa,CAAC,EAC5B,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,2CAgBA;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAelE;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,SAAS,2CAiCjD;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAQlE;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAwB/C;AAgBD;;GAEG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACzC,eA0CA"}
+{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/sidebar.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,KAAK,oBAAoB,EAEzB,KAAK,cAAc,EAEnB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AACf,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAU1D,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAInE,OAAO,KAAK,EACV,uBAAuB,EACvB,uBAAuB,EACxB,MAAM,6BAA6B,CAAC;AAGrC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA6BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,YAAY,2CAqDrD;AAED,wBAAgB,OAAO,CAAC,EACtB,gBAAoB,EACpB,QAAe,EACf,KAAK,EACL,GAAG,KAAK,EACT,EAAE,YAAY,GAAG;IAAE,KAAK,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAA;CAAE,2CAuC3D;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAYlE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAYlE;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,eAAe,2CAYrD;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,oBAAoB,CAAC,2CAY3E;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,SAAS,GAAG;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,2CAiBA;AAED,wBAAgB,aAAa,CAAC,EAC5B,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,2CAgBA;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAelE;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,SAAS,2CAkCjD;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAQlE;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAwB/C;AAgBD;;GAEG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACzC,eA0CA"}

package/dist/layouts/docs/sidebar.js

@@ -50,8 +50,8 @@ export function CollapsibleSidebar(props) {
             ? 0
             : 500);
     }, []);
-    return (_jsx(Sidebar, { ...props, onPointerEnter: onEnter, onPointerLeave: onLeave, "data-collapsed": collapsed, className: cn('transition-[flex,margin,opacity,transform]', collapsed &&
-            'md:-me-[var(--fd-sidebar-width)] md:flex-initial md:translate-x-[calc(var(--fd-sidebar-offset)*-1)] rtl:md:translate-x-[var(--fd-sidebar-offset)]', collapsed && hover && 'z-50 md:translate-x-0', collapsed && !hover && 'md:opacity-0', props.className), style: {
+    return (_jsx(Sidebar, { ...props, onPointerEnter: collapsed ? onEnter : undefined, onPointerLeave: collapsed ? onLeave : undefined, "data-collapsed": collapsed, className: cn('md:transition-all', collapsed &&
+            'md:-me-[var(--fd-sidebar-width)] md:translate-x-[calc(var(--fd-sidebar-offset)*-1)] rtl:md:translate-x-[var(--fd-sidebar-offset)]', collapsed && hover && 'z-50 md:translate-x-0', collapsed && !hover && 'md:opacity-0', props.className), style: {
             '--fd-sidebar-offset': 'calc(var(--fd-sidebar-width) - 20px)',
         } }));
 }
@@ -62,7 +62,7 @@ export function Sidebar({ defaultOpenLevel = 0, prefetch = true, inner, ...props
             prefetch,
         };
     }, [defaultOpenLevel, prefetch]);
-    return (_jsx(Context.Provider, { value: context, children: _jsx(Base.SidebarList, { id: "nd-sidebar", blockScrollingWidth: 768, ...props, className: cn('fixed top-fd-layout-top z-30 bg-fd-card text-sm md:sticky md:h-[var(--fd-sidebar-height)] md:flex-1', 'max-md:inset-x-0 max-md:bottom-0 max-md:bg-fd-background/80 max-md:text-[15px] max-md:backdrop-blur-lg max-md:data-[open=false]:invisible', props.className), style: {
+    return (_jsx(Context.Provider, { value: context, children: _jsx(Base.SidebarList, { id: "nd-sidebar", blockScrollingWidth: 768, ...props, className: cn('fixed top-fd-layout-top z-30 bg-fd-card text-sm md:sticky md:h-[var(--fd-sidebar-height)]', 'max-md:inset-x-0 max-md:bottom-0 max-md:bg-fd-background/80 max-md:text-[15px] max-md:backdrop-blur-lg max-md:data-[open=false]:invisible', props.className), style: {
                 ...props.style,
                 '--fd-sidebar-height': 'calc(100dvh - var(--fd-banner-height) - var(--fd-nav-height))',
             }, children: _jsx("div", { ...inner, className: cn('flex size-full max-w-full flex-col pt-2 md:ms-auto md:w-[var(--fd-sidebar-width)] md:border-e md:pt-4', inner?.className), children: props.children }) }) }));
@@ -105,10 +105,13 @@ export function SidebarFolderLink(props) {
     const pathname = usePathname();
     const active = props.href !== undefined && isActive(props.href, pathname, false);
     return (_jsxs(Link, { ...props, "data-active": active, className: cn(itemVariants({ active }), 'w-full pe-3.5 md:pe-1.5', props.className), onClick: (e) => {
-            setOpen((prev) => !active || !prev);
             if (e.target.hasAttribute('data-icon')) {
+                setOpen((prev) => !prev);
                 e.preventDefault();
             }
+            else {
+                setOpen((prev) => !active || !prev);
+            }
         }, prefetch: prefetch, children: [props.children, _jsx(ChevronDown, { "data-icon": true, className: cn('ms-auto transition-transform', !open && '-rotate-90') })] }));
 }
 export function SidebarFolderContent(props) {

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

@@ -1,5 +1,6 @@
 import { type ButtonHTMLAttributes, type HTMLAttributes } from 'react';
 import { type LinkItemType } from '../layouts/links';
+export declare function LayoutBody(props: HTMLAttributes<HTMLElement>): import("react/jsx-runtime").JSX.Element;
 interface LinksMenuProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     items: LinkItemType[];
 }

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

@@ -1 +1 @@
-{"version":3,"file":"docs.client.d.ts","sourceRoot":"","sources":["../../src/layouts/docs.client.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EAEpB,MAAM,OAAO,CAAC;AASf,OAAO,EAAgB,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAalE,UAAU,cAAe,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IACtE,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB;AAED,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,2CAkB5D;AAED,UAAU,aAAc,SAAQ,cAAc,CAAC,WAAW,CAAC;IACzD,IAAI,EAAE,YAAY,CAAC;CACpB;AAED,wBAAgB,QAAQ,CAAC,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,2CAgDzD"}
+{"version":3,"file":"docs.client.d.ts","sourceRoot":"","sources":["../../src/layouts/docs.client.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EAEpB,MAAM,OAAO,CAAC;AASf,OAAO,EAAgB,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAUlE,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAe5D;AAMD,UAAU,cAAe,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IACtE,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB;AAED,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,2CAkB5D;AAED,UAAU,aAAc,SAAQ,cAAc,CAAC,WAAW,CAAC;IACzD,IAAI,EAAE,YAAY,CAAC;CACpB;AAED,wBAAgB,QAAQ,CAAC,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,2CAgDzD"}

package/dist/layouts/docs.client.js

@@ -10,6 +10,12 @@ import { BaseLinkItem } from '../layouts/links';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from '../components/ui/collapsible';
 import { cva } from 'class-variance-authority';
 import { buttonVariants } from '../components/ui/button';
+import { useSidebar } from '../contexts/sidebar';
+export function LayoutBody(props) {
+    const { collapsed } = useSidebar();
+    return (_jsx("main", { ...props, className: cn(!collapsed &&
+            '[&_#nd-page]:max-w-[calc(min(100vw,var(--fd-layout-width))-var(--fd-sidebar-width)-var(--fd-toc-width))]', props.className), children: props.children }));
+}
 const itemVariants = cva('flex flex-row items-center gap-2 rounded-md px-3 py-2.5 text-fd-muted-foreground transition-colors duration-100 [overflow-wrap:anywhere] hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none md:px-2 md:py-1.5 [&_svg]:size-4');
 export function LinksMenu({ items, ...props }) {
     const [open, setOpen] = useState(false);
@@ -23,7 +29,7 @@ export function MenuItem({ item, ...props }) {
     if (item.type === 'custom')
         return (_jsx("div", { ...props, className: cn('grid', props.className), children: item.children }));
     if (item.type === 'menu') {
-        return (_jsxs(Collapsible, { className: "flex flex-col", children: [_jsxs(CollapsibleTrigger, { ...props, className: cn(itemVariants(), 'group/link', props.className), children: [item.icon, item.text, _jsx(ChevronDown, { className: "ms-auto transition-transform group-data-[state=closed]/link:-rotate-90" })] }), _jsx(CollapsibleContent, { children: _jsx("div", { className: "flex flex-col py-2 ps-2", children: item.items.map((child, i) => (_jsx(MenuItem, { item: child }, i))) }) })] }));
+        return (_jsxs(Collapsible, { className: "flex flex-col", children: [_jsxs(CollapsibleTrigger, { ...props, className: cn(itemVariants(), 'group', props.className), children: [item.icon, item.text, _jsx(ChevronDown, { className: "ms-auto transition-transform group-data-[state=closed]:-rotate-90" })] }), _jsx(CollapsibleContent, { children: _jsx("div", { className: "flex flex-col py-2 ps-2", children: item.items.map((child, i) => (_jsx(MenuItem, { item: child }, i))) }) })] }));
     }
     return (_jsxs(BaseLinkItem, { item: item, ...props, className: cn(item.type === 'button'
             ? buttonVariants({

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,EAAE,MAAM,OAAO,CAAC;AAgB5D,OAAO,EACL,KAAK,YAAY,EAGlB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,cAAc,EAAE,KAAK,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAE3E,OAAO,EAAE,KAAK,eAAe,EAAY,MAAM,UAAU,CAAC;AAe1D,OAAO,EAGL,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAE/B,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IAElC,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,wBAAgB,UAAU,CAAC,EACzB,GAAG,EAAE,EACH,OAAO,EAAE,UAAiB,EAC1B,SAAS,EAAE,UAAU,EACrB,eAAe,EACf,GAAG,GAAG,EACF,EACN,OAAO,EAAE,EACP,OAAO,EAAE,cAAqB,EAC9B,WAAkB,EAClB,SAAS,EAAE,cAAc,EACzB,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,aAAa,EACrB,MAAM,EAAE,aAAa,EACrB,UAAU,EAAE,iBAAiB,EAC7B,GAAG,OAAO,EACN,EACN,IAAY,EACZ,GAAG,KAAK,EACT,EAAE,eAAe,GAAG,SAAS,CAmF7B;AA0FD,OAAO,EAAE,cAAc,EAAE,KAAK,UAAU,EAAE,KAAK,YAAY,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,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAgB5D,OAAO,EACL,KAAK,YAAY,EAGlB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,cAAc,EAAE,KAAK,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAE3E,OAAO,EAAE,KAAK,eAAe,EAAY,MAAM,UAAU,CAAC;AAe1D,OAAO,EAGL,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAE/B,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IAElC,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,wBAAgB,UAAU,CAAC,EACzB,GAAG,EAAE,EACH,OAAO,EAAE,UAAiB,EAC1B,SAAS,EAAE,UAAU,EACrB,eAAe,EACf,GAAG,GAAG,EACF,EACN,OAAO,EAAE,EACP,OAAO,EAAE,cAAqB,EAC9B,WAAkB,EAClB,SAAS,EAAE,cAAc,EACzB,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,aAAa,EACrB,MAAM,EAAE,aAAa,EACrB,UAAU,EAAE,iBAAiB,EAC7B,GAAG,OAAO,EACN,EACN,IAAY,EACZ,GAAG,KAAK,EACT,EAAE,eAAe,GAAG,SAAS,CAsF7B;AA0FD,OAAO,EAAE,cAAc,EAAE,KAAK,UAAU,EAAE,KAAK,YAAY,EAAE,CAAC"}

package/dist/layouts/docs.js

@@ -11,7 +11,7 @@ import { getSidebarTabs } from '../utils/get-sidebar-tabs';
 import { RootToggle } from '../components/layout/root-toggle';
 import { getLinks } from './shared';
 import { LanguageToggle, LanguageToggleText, } from '../components/layout/language-toggle';
-import { LinksMenu } from '../layouts/docs.client';
+import { LayoutBody, LinksMenu } from '../layouts/docs.client';
 import { TreeContextProvider } from '../contexts/tree';
 import { NavProvider, Title } from '../components/layout/nav';
 import { ThemeToggle } from '../components/layout/theme-toggle';
@@ -25,9 +25,9 @@ export function DocsLayout({ nav: { enabled: navEnabled = true, component: navRe
     if (props.tree === undefined)
         notFound();
     const tabs = getSidebarTabsFromOptions(tabOptions, props.tree) ?? [];
-    return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsxs(NavProvider, { transparentMode: transparentMode, children: [replaceOrDefault({ enabled: navEnabled, component: navReplace }, _jsxs(Navbar, { id: "nd-subnav", className: "h-14 md:hidden", children: [_jsx(Title, { url: nav.url, title: nav.title }), _jsx("div", { className: "flex flex-1 flex-row items-center gap-1", children: nav.children }), _jsx(SearchOnly, { children: _jsx(SearchToggle, {}) }), _jsx(NavbarSidebarTrigger, { className: "-me-2 md:hidden" })] }), nav), _jsxs("main", { id: "nd-docs-layout", ...props.containerProps, className: cn('flex flex-1 flex-row md:[--fd-sidebar-width:260px] xl:[--fd-toc-width:260px] [&_#nd-toc]:max-xl:hidden [&_#nd-tocnav]:xl:hidden max-xl:[&_article]:mx-0', !navReplace && navEnabled
+    return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsxs(NavProvider, { transparentMode: transparentMode, children: [replaceOrDefault({ enabled: navEnabled, component: navReplace }, _jsxs(Navbar, { id: "nd-subnav", className: "h-14 md:hidden", children: [_jsx(Title, { url: nav.url, title: nav.title }), _jsx("div", { className: "flex flex-1 flex-row items-center gap-1", children: nav.children }), _jsx(SearchOnly, { children: _jsx(SearchToggle, {}) }), _jsx(NavbarSidebarTrigger, { className: "-me-2 md:hidden" })] }), nav), _jsxs(LayoutBody, { id: "nd-docs-layout", ...props.containerProps, className: cn('flex flex-1 flex-row md:[--fd-sidebar-width:260px] xl:[--fd-toc-width:260px] [&_#nd-toc]:max-xl:hidden [&_#nd-tocnav]:xl:hidden max-xl:[&_article]:mx-0', !navReplace && navEnabled
                         ? '[--fd-nav-height:3.5rem] md:[--fd-nav-height:0px]'
-                        : null, props.containerProps?.className), children: [collapsible ? (_jsx(SidebarCollapseTrigger, { className: "fixed bottom-3 start-2 z-40 transition-opacity data-[collapsed=false]:pointer-events-none data-[collapsed=false]:opacity-0 max-md:hidden" })) : null, replaceOrDefault({ enabled: sidebarEnabled, component: sidebarReplace }, _jsxs(Aside, { ...sidebar, children: [_jsxs(SidebarHeader, { children: [_jsx(SidebarHeaderItems, { ...nav, links: links }), sidebarBanner, tabs.length > 0 ? (_jsx(RootToggle, { options: tabs, className: "-mx-2" })) : null, _jsx(SearchOnly, { children: _jsx(LargeSearchToggle, { className: "rounded-lg max-md:hidden" }) })] }), _jsxs(SidebarViewport, { children: [_jsx("div", { className: "px-2 pt-4 empty:hidden md:hidden", children: links
+                        : null, props.containerProps?.className), children: [collapsible ? (_jsx(SidebarCollapseTrigger, { className: "fixed bottom-3 start-2 z-40 transition-opacity data-[collapsed=false]:pointer-events-none data-[collapsed=false]:opacity-0 max-md:hidden" })) : null, replaceOrDefault({ enabled: sidebarEnabled, component: sidebarReplace }, _jsxs(Aside, { ...sidebar, className: "md:flex-1 md:data-[collapsed=true]:flex-initial", children: [_jsxs(SidebarHeader, { children: [_jsx(SidebarHeaderItems, { ...nav, links: links }), sidebarBanner, tabs.length > 0 ? (_jsx(RootToggle, { options: tabs, className: "-mx-2" })) : null, _jsx(SearchOnly, { children: _jsx(LargeSearchToggle, { className: "rounded-lg max-md:hidden" }) })] }), _jsxs(SidebarViewport, { children: [_jsx("div", { className: "px-2 pt-4 empty:hidden md:hidden", children: links
                                                 .filter((v) => v.type !== 'icon')
                                                 .map((item, i) => (_jsx(SidebarLinkItem, { item: item }, i))) }), _jsx("div", { className: "px-2 py-4 md:px-3", children: _jsx(SidebarPageTree, { components: sidebarComponents }) })] }), _jsxs(SidebarFooter, { children: [_jsx(SidebarFooterItems, { sidebarCollapsible: collapsible, i18n: i18n, disableThemeSwitch: props.disableThemeSwitch ?? false, iconItems: links.filter((v) => v.type === 'icon') }), sidebarFooter] })] }), {
                             ...sidebar,

package/dist/layouts/notebook.client.d.ts

@@ -1,3 +1,5 @@
-import type { HTMLAttributes } from 'react';
+import type { ButtonHTMLAttributes, HTMLAttributes } from 'react';
 export declare function LayoutBody(props: HTMLAttributes<HTMLElement>): import("react/jsx-runtime").JSX.Element;
+export declare function SubNavbar(props: HTMLAttributes<HTMLElement>): import("react/jsx-runtime").JSX.Element;
+export declare function NavbarSidebarTrigger(props: ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=notebook.client.d.ts.map

package/dist/layouts/notebook.client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notebook.client.d.ts","sourceRoot":"","sources":["../../src/layouts/notebook.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5C,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAoB5D"}
+{"version":3,"file":"notebook.client.d.ts","sourceRoot":"","sources":["../../src/layouts/notebook.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAOlE,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAkB5D;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CA2B3D;AAED,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAkB/C"}

package/dist/layouts/notebook.client.js

@@ -2,12 +2,31 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from '../utils/cn';
 import { useSidebar } from '../contexts/sidebar';
+import { useNav } from '../components/layout/nav';
+import { SidebarTrigger } from 'fumadocs-core/sidebar';
+import { buttonVariants } from '../components/ui/button';
+import { Menu, X } from 'lucide-react';
 export function LayoutBody(props) {
-    const { collapsed } = useSidebar();
     return (_jsx("main", { id: "nd-docs-layout", ...props, className: cn('flex w-full flex-1 flex-row', props.className), style: {
             ...props.style,
-            '--fd-content-width': collapsed
-                ? '100vw'
-                : 'calc(min(100vw, var(--fd-layout-width)) - var(--fd-sidebar-width))',
+            '--fd-layout-offset': 'max(calc(50vw - var(--fd-layout-width) / 2), 0px)',
+            paddingInlineEnd: 'var(--fd-layout-offset)',
         }, children: props.children }));
 }
+export function SubNavbar(props) {
+    const { open, collapsed } = useSidebar();
+    const { isTransparent } = useNav();
+    return (_jsx("header", { id: "nd-subnav", ...props, className: cn('fixed inset-x-0 top-[var(--fd-banner-height)] z-10 h-14 backdrop-blur-lg transition-colors', (!isTransparent || open) && 'bg-fd-background/80', props.className), style: {
+            paddingInlineStart: collapsed
+                ? 'calc(var(--fd-layout-offset))'
+                : 'calc(var(--fd-layout-offset) + var(--fd-sidebar-width))',
+            paddingInlineEnd: 'var(--fd-layout-offset)',
+        }, children: _jsx("div", { className: "mx-auto flex size-full flex-row items-center border-b border-fd-foreground/10 px-4 md:gap-1.5 lg:px-8", children: props.children }) }));
+}
+export function NavbarSidebarTrigger(props) {
+    const { open } = useSidebar();
+    return (_jsx(SidebarTrigger, { ...props, className: cn(buttonVariants({
+            color: 'ghost',
+            size: 'icon',
+        }), props.className), children: open ? _jsx(X, {}) : _jsx(Menu, {}) }));
+}

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

@@ -1 +1 @@
-{"version":3,"file":"notebook.d.ts","sourceRoot":"","sources":["../../src/layouts/notebook.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACtE,OAAO,EACL,KAAK,eAAe,EAGrB,MAAM,kBAAkB,CAAC;AAgC1B,OAAO,EAGL,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAGrD,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC,CAAC;IAEjE,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,wBAAgB,UAAU,CAAC,EACzB,GAAG,EAAE,EAAE,eAAe,EAAE,GAAG,GAAG,EAAO,EACrC,OAAO,EAAE,EACP,WAAW,EAAE,kBAAyB,EACtC,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,aAAa,EACrB,MAAM,EAAE,aAAa,EACrB,UAAU,EAAE,iBAAiB,EAC7B,GAAG,OAAO,EACN,EACN,IAAY,EACZ,GAAG,KAAK,EACT,EAAE,eAAe,GAAG,SAAS,CAgE7B"}
+{"version":3,"file":"notebook.d.ts","sourceRoot":"","sources":["../../src/layouts/notebook.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACtE,OAAO,EACL,KAAK,eAAe,EAGrB,MAAM,kBAAkB,CAAC;AA+B1B,OAAO,EAGL,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAGrD,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC,CAAC;IAEjE,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,wBAAgB,UAAU,CAAC,EACzB,GAAG,EAAE,EAAE,eAAe,EAAE,GAAG,GAAG,EAAO,EACrC,OAAO,EAAE,EACP,WAAW,EAAE,kBAAyB,EACtC,IAAI,EAAE,UAAU,EAChB,MAAM,EAAE,aAAa,EACrB,MAAM,EAAE,aAAa,EACrB,UAAU,EAAE,iBAAiB,EAC7B,GAAG,OAAO,EACN,EACN,IAAY,EACZ,GAAG,KAAK,EACT,EAAE,eAAe,GAAG,SAAS,CA2D7B"}

package/dist/layouts/notebook.js

@@ -6,7 +6,6 @@ import { notFound } from 'next/navigation';
 import { RootToggle } from '../components/layout/root-toggle';
 import { TreeContextProvider } from '../contexts/tree';
 import { NavProvider, Title } from '../components/layout/nav';
-import { Navbar, NavbarSidebarTrigger } from '../layouts/docs/navbar';
 import { SearchOnly } from '../contexts/search';
 import { LargeSearchToggle, SearchToggle, } from '../components/layout/search-toggle';
 import { cn } from '../utils/cn';
@@ -18,19 +17,17 @@ import { LanguageToggle } from '../components/layout/language-toggle';
 import { ThemeToggle } from '../components/layout/theme-toggle';
 import { Popover, PopoverContent, PopoverTrigger, } from '../components/ui/popover';
 import { getSidebarTabsFromOptions, SidebarLinkItem, } from '../layouts/docs/shared';
-import { LayoutBody } from './notebook.client';
+import { LayoutBody, SubNavbar, NavbarSidebarTrigger } from './notebook.client';
 export function DocsLayout({ nav: { transparentMode, ...nav } = {}, sidebar: { collapsible: sidebarCollapsible = true, tabs: tabOptions, banner: sidebarBanner, footer: sidebarFooter, components: sidebarComponents, ...sidebar } = {}, i18n = false, ...props }) {
     const links = getLinks(props.links ?? [], props.githubUrl);
     const Aside = sidebarCollapsible ? CollapsibleSidebar : Sidebar;
     if (props.tree === undefined)
         notFound();
     const tabs = getSidebarTabsFromOptions(tabOptions, props.tree) ?? [];
-    return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsx(NavProvider, { transparentMode: transparentMode, children: _jsxs(LayoutBody, { ...props.containerProps, className: cn('[--fd-nav-height:3.5rem] md:[--fd-sidebar-width:260px] lg:[--fd-toc-width:260px] [&_#nd-toc]:max-lg:hidden [&_#nd-tocnav]:lg:hidden', props.containerProps?.className), children: [_jsxs(Aside, { ...sidebar, className: cn('md:[--fd-nav-height:0px]', sidebar.className), children: [_jsxs(SidebarHeader, { children: [_jsxs(SidebarHeaderItems, { nav: nav, links: links, children: [nav.children, sidebarCollapsible ? (_jsx(SidebarCollapseTrigger, { className: "ms-auto text-fd-muted-foreground" })) : null] }), sidebarBanner, tabs.length > 0 ? (_jsx(RootToggle, { options: tabs, className: "md:-mx-2" })) : null] }), _jsxs(SidebarViewport, { children: [_jsx("div", { className: "px-4 pt-4 empty:hidden md:px-3 lg:hidden", children: links.map((item, i) => (_jsx(SidebarLinkItem, { item: item }, i))) }), _jsx("div", { className: "p-4 md:px-3", children: _jsx(SidebarPageTree, { components: sidebarComponents }) })] }), _jsx(SidebarFooter, { children: sidebarFooter })] }), _jsxs("div", { className: "w-full min-w-0 max-w-[var(--fd-content-width)] [--fd-nav-height:3.5rem]", children: [_jsx(DocsNavbar, { nav: nav, links: links, i18n: i18n, sidebarCollapsible: sidebarCollapsible }), _jsx("div", { className: "flex flex-row", children: props.children })] }), _jsx("div", { className: "min-w-[var(--fd-sidebar-width)] flex-1", style: {
-                            marginInlineStart: 'calc(var(--fd-sidebar-width) * -1)',
-                        } })] }) }) }));
+    return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsx(NavProvider, { transparentMode: transparentMode, children: _jsxs(LayoutBody, { ...props.containerProps, className: cn('[--fd-nav-height:3.5rem] md:[--fd-sidebar-width:260px] lg:[--fd-toc-width:260px] [&_#nd-page]:mt-[var(--fd-nav-height)] [&_#nd-toc]:max-lg:hidden [&_#nd-tocnav]:lg:hidden', props.containerProps?.className), children: [_jsxs(Aside, { ...sidebar, className: cn('md:ps-[var(--fd-layout-offset)] md:[--fd-nav-height:0px]', sidebar.className), children: [_jsxs(SidebarHeader, { children: [_jsxs(SidebarHeaderItems, { nav: nav, links: links, children: [nav.children, sidebarCollapsible ? (_jsx(SidebarCollapseTrigger, { className: "ms-auto text-fd-muted-foreground" })) : null] }), sidebarBanner, tabs.length > 0 ? (_jsx(RootToggle, { options: tabs, className: "md:-mx-2" })) : null] }), _jsxs(SidebarViewport, { children: [_jsx("div", { className: "px-4 pt-4 empty:hidden md:px-3 lg:hidden", children: links.map((item, i) => (_jsx(SidebarLinkItem, { item: item }, i))) }), _jsx("div", { className: "p-4 md:px-3", children: _jsx(SidebarPageTree, { components: sidebarComponents }) })] }), _jsx(SidebarFooter, { children: sidebarFooter })] }), _jsx(DocsNavbar, { nav: nav, links: links, i18n: i18n, sidebarCollapsible: sidebarCollapsible }), props.children] }) }) }));
 }
 function DocsNavbar({ sidebarCollapsible, links, nav = {}, i18n, }) {
-    return (_jsxs(Navbar, { id: "nd-subnav", className: "h-14 md:gap-1.5", children: [sidebarCollapsible ? (_jsx(SidebarCollapseTrigger, { className: "-ms-1.5 text-fd-muted-foreground data-[collapsed=false]:hidden max-md:hidden" })) : null, _jsx(SearchOnly, { children: _jsx(LargeSearchToggle, { className: "w-full max-w-[240px] rounded-lg max-md:hidden" }) }), _jsx(Title, { url: nav.url, title: nav.title, className: "md:hidden" }), _jsxs("div", { className: "flex flex-1 flex-row items-center gap-6 px-2", children: [links
+    return (_jsxs(SubNavbar, { children: [sidebarCollapsible ? (_jsx(SidebarCollapseTrigger, { className: "-ms-1.5 text-fd-muted-foreground data-[collapsed=false]:hidden max-md:hidden" })) : null, _jsx(SearchOnly, { children: _jsx(LargeSearchToggle, { className: "w-full max-w-[240px] rounded-lg max-md:hidden" }) }), _jsx(Title, { url: nav.url, title: nav.title, className: "md:hidden" }), _jsxs("div", { className: "flex flex-1 flex-row items-center gap-6 px-2", 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 max-lg:hidden" }, i))), nav.children] }), _jsx(SearchOnly, { children: _jsx(SearchToggle, { className: "md:hidden" }) }), _jsx(NavbarSidebarTrigger, { className: "-me-1.5 md:hidden" }), _jsx("div", { className: "flex flex-row items-center empty:hidden max-lg:hidden", children: links
                     .filter((item) => item.type === 'icon')

package/dist/page.client.d.ts

@@ -1,6 +1,5 @@
 import { type HTMLAttributes } from 'react';
 import { type BreadcrumbOptions } from 'fumadocs-core/breadcrumb';
-export declare function PageContainer(props: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
 export declare function PageHeader(props: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
 export declare function LastUpdate(props: {
     date: Date;

package/dist/page.client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"page.client.d.ts","sourceRoot":"","sources":["../src/page.client.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,cAAc,EAIpB,MAAM,OAAO,CAAC;AAWf,OAAO,EACL,KAAK,iBAAiB,EAEvB,MAAM,0BAA0B,CAAC;AAElC,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAsBlE;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAwB/D;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,2CAc/C;AAED,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE;QACN,QAAQ,CAAC,EAAE;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,GAAG,EAAE,MAAM,CAAA;SAAE,CAAC;QACzC,IAAI,CAAC,EAAE;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,GAAG,EAAE,MAAM,CAAA;SAAE,CAAC;KACtC,CAAC;CACH;AAiCD,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,EAAE,WAAW,2CA8C5C;AAED,MAAM,MAAM,eAAe,GAAG,iBAAiB,CAAC;AAEhD,wBAAgB,UAAU,CAAC,OAAO,EAAE,eAAe,kDAiClD"}
+{"version":3,"file":"page.client.d.ts","sourceRoot":"","sources":["../src/page.client.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,cAAc,EAIpB,MAAM,OAAO,CAAC;AAWf,OAAO,EACL,KAAK,iBAAiB,EAEvB,MAAM,0BAA0B,CAAC;AAElC,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAwB/D;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,2CAc/C;AAED,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE;QACN,QAAQ,CAAC,EAAE;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,GAAG,EAAE,MAAM,CAAA;SAAE,CAAC;QACzC,IAAI,CAAC,EAAE;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,GAAG,EAAE,MAAM,CAAA;SAAE,CAAC;KACtC,CAAC;CACH;AAiCD,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,EAAE,WAAW,2CA8C5C;AAED,MAAM,MAAM,eAAe,GAAG,iBAAiB,CAAC;AAEhD,wBAAgB,UAAU,CAAC,OAAO,EAAE,eAAe,kDAiClD"}

package/dist/page.client.js

@@ -11,19 +11,10 @@ import { useSidebar } from './contexts/sidebar';
 import { usePathname } from 'next/navigation';
 import { useNav } from './components/layout/nav';
 import { getBreadcrumbItemsFromPath, } from 'fumadocs-core/breadcrumb';
-export function PageContainer(props) {
-    const { collapsed } = useSidebar();
-    return (_jsx("div", { ...props, className: cn('flex w-full min-w-0 max-w-[var(--fd-page-width)] flex-col md:transition-[max-width]', props.className), style: {
-            ...props.style,
-            '--fd-page-width': collapsed
-                ? '100vw'
-                : 'calc(min(100vw, var(--fd-layout-width)) - var(--fd-sidebar-width) - var(--fd-toc-width))',
-        }, children: props.children }));
-}
 export function PageHeader(props) {
     const { open } = useSidebar();
     const { isTransparent } = useNav();
-    return (_jsx("header", { ...props, className: cn('sticky top-fd-layout-top z-10 flex flex-row items-center border-b border-fd-foreground/10 text-sm transition-colors', !isTransparent && 'bg-fd-background/80 backdrop-blur-md', open && 'opacity-0', props.className), style: {
+    return (_jsx("header", { ...props, className: cn('sticky top-fd-layout-top z-10 flex flex-row items-center border-b border-fd-foreground/10 text-sm backdrop-blur-md transition-colors', !isTransparent && 'bg-fd-background/80', open && 'opacity-0', props.className), style: {
             ...props.style,
             '--fd-toc-top-with-offset': 'calc(4px + var(--fd-banner-height) + var(--fd-nav-height))',
         }, children: props.children }));

package/dist/page.d.ts

@@ -62,9 +62,11 @@ export interface DocsPageProps {
     footer?: Partial<FooterOptions>;
     editOnGithub?: EditOnGitHubOptions;
     lastUpdate?: Date | string | number;
+    container?: HTMLAttributes<HTMLDivElement>;
+    article?: HTMLAttributes<HTMLElement>;
     children: ReactNode;
 }
-export declare function DocsPage({ toc, breadcrumb, full, footer, tableOfContentPopover: { enabled: tocPopoverEnabled, component: tocPopoverReplace, ...tocPopoverOptions }, tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions }, ...props }: DocsPageProps): ReactNode;
+export declare function DocsPage({ toc, full, tableOfContentPopover: { enabled: tocPopoverEnabled, component: tocPopoverReplace, ...tocPopoverOptions }, tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions }, ...props }: DocsPageProps): ReactNode;
 /**
  * Add typography styles
  */

package/dist/page.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../src/page.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../src/page.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAC3E,OAAO,EACL,KAAK,oBAAoB,EAEzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC7E,OAAO,EAAE,KAAK,mBAAmB,EAAkB,MAAM,mBAAmB,CAAC;AAI7E,OAAO,EAEL,KAAK,WAAW,EAIhB,KAAK,eAAe,EACrB,MAAM,eAAe,CAAC;AACvB,OAAO,EAML,KAAK,QAAQ,EACd,MAAM,yBAAyB,CAAC;AAMjC,KAAK,qBAAqB,GAAG,IAAI,CAAC,QAAQ,EAAE,OAAO,GAAG,UAAU,CAAC,GAC/D,IAAI,CAAC,mBAAmB,EAAE,QAAQ,CAAC,GAAG;IACpC,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;CAC5B,CAAC;AAEJ,KAAK,4BAA4B,GAAG,IAAI,CAAC,qBAAqB,EAAE,QAAQ,CAAC,CAAC;AAE1E,UAAU,mBACR,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC1E,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IAEb;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,iBAAkB,SAAQ,eAAe;IACjD,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,SAAS,CAAC;IAErB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,UAAU,aAAc,SAAQ,WAAW;IACzC,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,SAAS,CAAC;CACtB;AAED,MAAM,WAAW,aAAa;IAC5B,GAAG,CAAC,EAAE,eAAe,CAAC;IAEtB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,cAAc,CAAC,EAAE,OAAO,CAAC,qBAAqB,CAAC,CAAC;IAChD,qBAAqB,CAAC,EAAE,OAAO,CAAC,4BAA4B,CAAC,CAAC;IAE9D;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAExC;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IAEhC,YAAY,CAAC,EAAE,mBAAmB,CAAC;IACnC,UAAU,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC;IAEpC,SAAS,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;IAC3C,OAAO,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACtC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,QAAQ,CAAC,EACvB,GAAQ,EACR,IAAY,EACZ,qBAAqB,EAAE,EACrB,OAAO,EAAE,iBAAwB,EACjC,SAAS,EAAE,iBAAiB,EAC5B,GAAG,iBAAiB,EAChB,EACN,cAAc,EAAE,EAEd,OAAO,EAAE,UAAU,EACnB,SAAS,EAAE,UAAU,EACrB,GAAG,UAAU,EACT,EACN,GAAG,KAAK,EACT,EAAE,aAAa,GAAG,SAAS,CAoG3B;AA+BD;;GAEG;AACH,eAAO,MAAM,QAAQ,2HAKnB,CAAC;AAIH,eAAO,MAAM,eAAe,uIAgB1B,CAAC;AAIH,eAAO,MAAM,SAAS,mIAapB,CAAC;AAwBH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,IAAI,EACJ,IAAI,EAAE,UAAU,EAChB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,cAAc,CAAC,GAAG;IAClC,IAAI,EAAE,IAAI,CAAC;IACX,IAAI,EAAE,YAAY,CAAC,YAAY,CAAC,CAAC;IACjC,IAAI,CAAC,EAAE,QAAQ,CAAC,IAAI,CAAC;CACtB,kDAiCA;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,GAAG,SAAS,CAM5E"}

package/dist/page.js

@@ -4,14 +4,13 @@ import { AnchorProvider } from 'fumadocs-core/toc';
 import { Card, Cards } from './components/card';
 import { replaceOrDefault } from './layouts/shared';
 import { cn } from './utils/cn';
-import { Footer, LastUpdate, PageContainer, PageHeader, Breadcrumb, } from './page.client';
-import { Toc, TOCItems } from './components/layout/toc';
-import { TocPopoverTrigger, TocPopover, TocPopoverContent, } from './components/layout/toc-popover';
+import { Footer, LastUpdate, PageHeader, Breadcrumb, } from './page.client';
+import { Toc, TOCItems, TocPopoverTrigger, TocPopover, TocPopoverContent, } from './components/layout/toc';
 import { buttonVariants } from './components/ui/button';
 import { Edit, Text } from 'lucide-react';
 import { I18nLabel } from './contexts/i18n';
 import ClerkTOCItems from './components/layout/toc-clerk';
-export function DocsPage({ toc = [], breadcrumb = {}, full = false, footer = {}, tableOfContentPopover: { enabled: tocPopoverEnabled = true, component: tocPopoverReplace, ...tocPopoverOptions } = {}, tableOfContent: { 
+export function DocsPage({ toc = [], full = false, tableOfContentPopover: { enabled: tocPopoverEnabled = true, component: tocPopoverReplace, ...tocPopoverOptions } = {}, tableOfContent: { 
 // disable TOC on full mode, you can still enable it with `enabled` option.
 enabled: tocEnabled, component: tocReplace, ...tocOptions } = {}, ...props }) {
     tocEnabled ?? (tocEnabled = !full &&
@@ -19,12 +18,12 @@ enabled: tocEnabled, component: tocReplace, ...tocOptions } = {}, ...props }) {
             tocOptions.footer !== undefined ||
             tocOptions.header !== undefined));
     const fullWidth = full && !tocEnabled;
-    return (_jsxs(AnchorProvider, { toc: toc, single: tocOptions.single, children: [_jsxs(PageContainer, { id: "nd-page", style: {
+    return (_jsxs(AnchorProvider, { toc: toc, single: tocOptions.single, children: [_jsxs("div", { id: "nd-page", ...props.container, className: cn('flex w-full min-w-0 flex-col md:transition-[max-width]', props.container?.className), style: {
                     '--fd-toc-width': fullWidth ? '0px' : undefined,
                 }, children: [replaceOrDefault({ enabled: tocPopoverEnabled, component: tocPopoverReplace }, _jsx(PageHeader, { id: "nd-tocnav", children: _jsxs(TocPopover, { children: [_jsx(TocPopoverTrigger, { className: "size-full", items: toc }), _jsxs(TocPopoverContent, { children: [tocPopoverOptions.header, tocPopoverOptions.style === 'clerk' ? (_jsx(ClerkTOCItems, { items: toc, isMenu: true })) : (_jsx(TOCItems, { items: toc, isMenu: true })), tocPopoverOptions.footer] })] }) }), {
                         items: toc,
                         ...tocPopoverOptions,
-                    }), _jsxs("article", { className: cn('mx-auto flex w-full flex-1 flex-col gap-6 px-4 pt-10 md:px-7 md:pt-12', fullWidth ? 'max-w-[1120px]' : 'max-w-[860px]'), children: [replaceOrDefault(breadcrumb, _jsx(Breadcrumb, { includePage: breadcrumb.full, ...breadcrumb })), props.children, _jsx("div", { role: "none", className: "flex-1" }), _jsxs("div", { className: "flex flex-row flex-wrap items-center justify-between gap-4 empty:hidden", children: [props.editOnGithub ? (_jsx(EditOnGitHub, { ...props.editOnGithub })) : null, props.lastUpdate ? (_jsx(LastUpdate, { date: new Date(props.lastUpdate) })) : null] }), replaceOrDefault(footer, _jsx(Footer, { items: footer.items }))] })] }), replaceOrDefault({ enabled: tocEnabled, component: tocReplace }, _jsx(Toc, { id: "nd-toc", children: _jsxs("div", { className: "flex h-full w-[var(--fd-toc-width)] max-w-full flex-col gap-3 pe-2", children: [tocOptions.header, _jsxs("h3", { className: "-ms-0.5 inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground", children: [_jsx(Text, { className: "size-4" }), _jsx(I18nLabel, { label: "toc" })] }), tocOptions.style === 'clerk' ? (_jsx(ClerkTOCItems, { items: toc })) : (_jsx(TOCItems, { items: toc })), tocOptions.footer] }) }), {
+                    }), _jsxs("article", { ...props.article, className: cn('mx-auto flex w-full flex-1 flex-col gap-6 px-4 pt-8 md:pt-12 lg:px-8', fullWidth ? 'max-w-[1120px]' : 'max-w-[860px]', props.article?.className), children: [replaceOrDefault(props.breadcrumb, _jsx(Breadcrumb, { includePage: props.breadcrumb?.full, ...props.breadcrumb })), props.children, _jsx("div", { role: "none", className: "flex-1" }), _jsxs("div", { className: "flex flex-row flex-wrap items-center justify-between gap-4 empty:hidden", children: [props.editOnGithub ? (_jsx(EditOnGitHub, { ...props.editOnGithub })) : null, props.lastUpdate ? (_jsx(LastUpdate, { date: new Date(props.lastUpdate) })) : null] }), replaceOrDefault(props.footer, _jsx(Footer, { items: props.footer?.items }))] })] }), replaceOrDefault({ enabled: tocEnabled, component: tocReplace }, _jsx(Toc, { id: "nd-toc", children: _jsxs("div", { className: "flex h-full w-[var(--fd-toc-width)] max-w-full flex-col gap-3 pe-2", children: [tocOptions.header, _jsxs("h3", { className: "-ms-0.5 inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground", children: [_jsx(Text, { className: "size-4" }), _jsx(I18nLabel, { label: "toc" })] }), tocOptions.style === 'clerk' ? (_jsx(ClerkTOCItems, { items: toc })) : (_jsx(TOCItems, { items: toc })), tocOptions.footer] }) }), {
                 items: toc,
                 ...tocOptions,
             }, _jsx("div", { role: "none", className: "flex-1" }))] }));
@@ -33,7 +32,7 @@ function EditOnGitHub({ owner, repo, sha, path, ...props }) {
     const href = `https://github.com/${owner}/${repo}/blob/${sha}/${path.startsWith('/') ? path.slice(1) : path}`;
     return (_jsxs("a", { href: href, target: "_blank", rel: "noreferrer noopener", ...props, className: cn(buttonVariants({
             color: 'secondary',
-            className: 'gap-1.5 py-1 text-fd-muted-foreground',
+            className: 'gap-1.5 text-fd-muted-foreground',
         }), props.className), children: [_jsx(Edit, { className: "size-3.5" }), _jsx(I18nLabel, { label: "editOnGithub" })] }));
 }
 /**

package/dist/style.css

@@ -105,7 +105,7 @@
   --tw-contain-paint:  ;
   --tw-contain-style:  ;
 }/*
-! tailwindcss v3.4.15 | MIT License | https://tailwindcss.com
+! tailwindcss v3.4.16 | MIT License | https://tailwindcss.com
 *//*
 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
@@ -1302,9 +1302,6 @@ body {
 .min-w-\[220px\] {
   min-width: 220px;
 }
-.min-w-\[var\(--fd-sidebar-width\)\] {
-  min-width: var(--fd-sidebar-width);
-}
 .max-w-\[1120px\] {
   max-width: 1120px;
 }
@@ -1320,12 +1317,6 @@ body {
 .max-w-\[98vw\] {
   max-width: 98vw;
 }
-.max-w-\[var\(--fd-content-width\)\] {
-  max-width: var(--fd-content-width);
-}
-.max-w-\[var\(--fd-page-width\)\] {
-  max-width: var(--fd-page-width);
-}
 .max-w-fd-container {
   max-width: 1400px;
 }
@@ -1521,6 +1512,9 @@ body {
 .bg-\[var\(--shiki-light-bg\)\] {
   background-color: var(--shiki-light-bg);
 }
+.bg-black\/30 {
+  background-color: rgb(0 0 0 / 0.3);
+}
 .bg-fd-accent {
   --tw-bg-opacity: 1;
   background-color: hsl(var(--accent) / var(--tw-bg-opacity, 1));
@@ -1529,9 +1523,6 @@ body {
   --tw-bg-opacity: 1;
   background-color: hsl(var(--background) / var(--tw-bg-opacity, 1));
 }
-.bg-fd-background\/50 {
-  background-color: hsl(var(--background) / 0.5);
-}
 .bg-fd-background\/80 {
   background-color: hsl(var(--background) / 0.8);
 }
@@ -1691,9 +1682,6 @@ body {
 .pt-0 {
   padding-top: 0px;
 }
-.pt-10 {
-  padding-top: 2.5rem;
-}
 .pt-12 {
   padding-top: 3rem;
 }
@@ -1703,6 +1691,9 @@ body {
 .pt-4 {
   padding-top: 1rem;
 }
+.pt-8 {
+  padding-top: 2rem;
+}
 .pt-\[var\(--fd-nav-height\)\] {
   padding-top: var(--fd-nav-height);
 }
@@ -1836,11 +1827,6 @@ body {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }
-.transition-\[flex\2c margin\2c opacity\2c transform\] {
-  transition-property: flex,margin,opacity,transform;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
-}
 .transition-\[width\2c height\] {
   transition-property: width,height;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -2014,24 +2000,6 @@ body {
   opacity: 1;
 }
 
-.aria-disabled\:pointer-events-none[aria-disabled="true"] {
-  pointer-events: none;
-}
-
-.aria-disabled\:opacity-50[aria-disabled="true"] {
-  opacity: 0.5;
-}
-
-.aria-selected\:bg-fd-accent[aria-selected="true"] {
-  --tw-bg-opacity: 1;
-  background-color: hsl(var(--accent) / var(--tw-bg-opacity, 1));
-}
-
-.aria-selected\:text-fd-accent-foreground[aria-selected="true"] {
-  --tw-text-opacity: 1;
-  color: hsl(var(--accent-foreground) / var(--tw-text-opacity, 1));
-}
-
 .data-\[collapsed\=false\]\:pointer-events-none[data-collapsed="false"] {
   pointer-events: none;
 }
@@ -2336,7 +2304,7 @@ body {
   opacity: 0;
 }
 
-.group\/link[data-state="closed"] .group-data-\[state\=closed\]\/link\:-rotate-90 {
+.group[data-state="closed"] .group-data-\[state\=closed\]\:-rotate-90 {
   --tw-rotate: -90deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
@@ -2492,10 +2460,6 @@ body {
     flex: 1 1 0%;
   }
 
-  .md\:flex-initial {
-    flex: 0 1 auto;
-  }
-
   .md\:translate-x-0 {
     --tw-translate-x: 0px;
     transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -2528,11 +2492,6 @@ body {
     padding-right: 0.75rem;
   }
 
-  .md\:px-7 {
-    padding-left: 1.75rem;
-    padding-right: 1.75rem;
-  }
-
   .md\:py-1\.5 {
     padding-top: 0.375rem;
     padding-bottom: 0.375rem;
@@ -2546,6 +2505,10 @@ body {
     padding-inline-start: 0.5rem;
   }
 
+  .md\:ps-\[var\(--fd-layout-offset\)\] {
+    padding-inline-start: var(--fd-layout-offset);
+  }
+
   .md\:pt-12 {
     padding-top: 3rem;
   }
@@ -2564,6 +2527,12 @@ body {
     transition-duration: 150ms;
   }
 
+  .md\:transition-all {
+    transition-property: all;
+    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    transition-duration: 150ms;
+  }
+
   .md\:\[--fd-nav-height\:0px\] {
     --fd-nav-height: 0px;
   }
@@ -2571,6 +2540,10 @@ body {
   .md\:\[--fd-sidebar-width\:260px\] {
     --fd-sidebar-width: 260px;
   }
+
+  .md\:data-\[collapsed\=true\]\:flex-initial[data-collapsed="true"] {
+    flex: 0 1 auto;
+  }
 }
 
 @media (min-width: 1024px) {
@@ -2607,6 +2580,11 @@ body {
     border-width: 1px;
   }
 
+  .lg\:px-8 {
+    padding-left: 2rem;
+    padding-right: 2rem;
+  }
+
   .lg\:\[--fd-toc-width\:260px\] {
     --fd-toc-width: 260px;
   }
@@ -2654,6 +2632,14 @@ body {
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+.\[\&_\#nd-page\]\:mt-\[var\(--fd-nav-height\)\] #nd-page {
+  margin-top: var(--fd-nav-height);
+}
+
+.\[\&_\#nd-page\]\:max-w-\[calc\(min\(100vw\2c var\(--fd-layout-width\)\)-var\(--fd-sidebar-width\)-var\(--fd-toc-width\)\)\] #nd-page {
+  max-width: calc(min(100vw,var(--fd-layout-width)) - var(--fd-sidebar-width) - var(--fd-toc-width));
+}
+
 @media not all and (min-width: 1280px) {
 
   .\[\&_\#nd-toc\]\:max-xl\:hidden #nd-toc {

package/dist/utils/get-sidebar-tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"get-sidebar-tabs.d.ts","sourceRoot":"","sources":["../../src/utils/get-sidebar-tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAE9D,MAAM,WAAW,UAAU;IACzB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,CAAC,MAAM,KAAK,MAAM,GAAG,IAAI,CAAC;CACtE;AAED,wBAAgB,cAAc,CAC5B,QAAQ,EAAE,QAAQ,CAAC,IAAI,EACvB,EAAE,SAAS,EAAE,GAAE,UAAe,GAC7B,MAAM,EAAE,CA0BV"}
+{"version":3,"file":"get-sidebar-tabs.d.ts","sourceRoot":"","sources":["../../src/utils/get-sidebar-tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAE9D,MAAM,WAAW,UAAU;IACzB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,CAAC,MAAM,KAAK,MAAM,GAAG,IAAI,CAAC;CACtE;AAED,wBAAgB,cAAc,CAC5B,QAAQ,EAAE,QAAQ,CAAC,IAAI,EACvB,EAAE,SAAS,EAAE,GAAE,UAAe,GAC7B,MAAM,EAAE,CA8BV"}

package/dist/utils/get-sidebar-tabs.js

@@ -1,24 +1,38 @@
 export function getSidebarTabs(pageTree, { transform } = {}) {
-    const options = [];
-    function traverse(node) {
-        if (node.type === 'folder' && node.root) {
+    function findOptions(node) {
+        const results = [];
+        if (node.root) {
             const index = node.index ?? node.children.at(0);
             if (index?.type === 'page') {
                 const option = {
                     url: index.url,
                     title: node.name,
                     icon: node.icon,
-                    folder: node,
                     description: node.description,
+                    urls: getFolderUrls(node),
                 };
                 const mapped = transform ? transform(option, node) : option;
                 if (mapped)
-                    options.push(mapped);
+                    results.push(mapped);
             }
         }
-        if (node.type === 'folder')
-            node.children.forEach(traverse);
+        for (const child of node.children) {
+            if (child.type === 'folder')
+                results.push(...findOptions(child));
+        }
+        return results;
+    }
+    return findOptions(pageTree);
+}
+function getFolderUrls(folder) {
+    const results = [];
+    if (folder.index)
+        results.push(folder.index.url);
+    for (const child of folder.children) {
+        if (child.type === 'page')
+            results.push(child.url);
+        if (child.type === 'folder')
+            results.push(...getFolderUrls(child));
     }
-    pageTree.children.forEach(traverse);
-    return options;
+    return results;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-ui",
-  "version": "14.5.4",
+  "version": "14.5.6",
   "description": "The framework for building a documentation website in Next.js",
   "keywords": [
     "NextJs",
@@ -61,14 +61,14 @@
     "@radix-ui/react-scroll-area": "^1.2.1",
     "@radix-ui/react-slot": "^1.1.0",
     "@radix-ui/react-tabs": "^1.1.1",
-    "class-variance-authority": "^0.7.0",
+    "class-variance-authority": "^0.7.1",
     "lodash.merge": "^4.6.2",
-    "lucide-react": "^0.460.0",
+    "lucide-react": "^0.465.0",
     "next-themes": "^0.4.3",
     "postcss-selector-parser": "^7.0.0",
     "react-medium-image-zoom": "^5.2.11",
-    "tailwind-merge": "^2.5.4",
-    "fumadocs-core": "14.5.4"
+    "tailwind-merge": "^2.5.5",
+    "fumadocs-core": "14.5.6"
   },
   "devDependencies": {
     "@next/eslint-plugin-next": "^15.0.3",
@@ -79,7 +79,7 @@
     "next": "15.0.3",
     "postcss": "^8.4.49",
     "postcss-cli": "^11.0.0",
-    "tailwindcss": "^3.4.15",
+    "tailwindcss": "^3.4.16",
     "tsc-alias": "^1.8.10",
     "@fumadocs/cli": "0.0.4",
     "eslint-config-custom": "0.0.0",

package/dist/components/layout/toc-popover.d.ts

@@ -1,8 +0,0 @@
-import type { TOCItemType } from 'fumadocs-core/server';
-import type { PopoverContentProps, PopoverTriggerProps } from '@radix-ui/react-popover';
-export declare const TocPopover: import("react").FC<import("@radix-ui/react-popover").PopoverProps>;
-export declare function TocPopoverTrigger({ items, ...props }: PopoverTriggerProps & {
-    items: TOCItemType[];
-}): import("react/jsx-runtime").JSX.Element;
-export declare function TocPopoverContent(props: PopoverContentProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=toc-popover.d.ts.map

package/dist/components/layout/toc-popover.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"toc-popover.d.ts","sourceRoot":"","sources":["../../../src/components/layout/toc-popover.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AASxD,OAAO,KAAK,EACV,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,yBAAyB,CAAC;AAEjC,eAAO,MAAM,UAAU,oEAAU,CAAC;AAElC,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,GAAG;IAAE,KAAK,EAAE,WAAW,EAAE,CAAA;CAAE,2CAyBhD;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,mBAAmB,2CAiB3D"}

package/dist/components/layout/toc-popover.js

@@ -1,20 +0,0 @@
-'use client';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { cn } from '../../utils/cn';
-import { useI18n } from '../../contexts/i18n';
-import * as Primitive from 'fumadocs-core/toc';
-import { ChevronRight, Text } from 'lucide-react';
-import { Popover, PopoverContent, PopoverTrigger, } from '../../components/ui/popover';
-export const TocPopover = Popover;
-export function TocPopoverTrigger({ items, ...props }) {
-    const { text } = useI18n();
-    const active = Primitive.useActiveAnchor();
-    const current = useMemo(() => {
-        return items.find((item) => active === item.url.slice(1))?.title;
-    }, [items, active]);
-    return (_jsxs(PopoverTrigger, { ...props, className: cn('inline-flex items-center gap-2 text-nowrap px-4 py-2 text-start', props.className), children: [_jsx(Text, { className: "size-4 shrink-0" }), text.toc, current ? (_jsxs(_Fragment, { children: [_jsx(ChevronRight, { className: "-mx-1.5 size-4 shrink-0 text-fd-muted-foreground" }), _jsx("span", { className: "truncate text-fd-muted-foreground", children: current })] })) : null] }));
-}
-export function TocPopoverContent(props) {
-    return (_jsx(PopoverContent, { hideWhenDetached: true, alignOffset: 16, align: "start", side: "bottom", "data-toc-popover": "", ...props, className: cn('flex max-h-[var(--radix-popover-content-available-height)] w-[260px] flex-col gap-4 p-3', props.className), children: props.children }));
-}