fumadocs-ui 12.0.0 → 12.0.2

package/dist/{chunk-7EMVRXMS.js → chunk-45374JLF.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-FSPYEOFC.js";
 import {
   useI18n
-} from "./chunk-CRYPD6UZ.js";
+} from "./chunk-HLGNIWUN.js";
 import {
   buttonVariants
 } from "./chunk-7GZKFBAP.js";

package/dist/{chunk-IOHAG6BY.js → chunk-5CZEA2KX.js}

@@ -17,7 +17,7 @@ function Heading({
       LinkIcon,
       {
         "aria-label": "Link to section",
-        className: "ml-2 inline size-4 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100"
+        className: "ms-2 inline size-4 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100"
       }
     )
   ] }) : props.children });

package/dist/{chunk-XXVXIK4M.js → chunk-E5OQ6FBQ.js}

@@ -48,7 +48,7 @@ var CodeBlock = forwardRef(
           title ? /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center gap-2 border-b bg-muted px-4 py-1.5", children: [
             /* @__PURE__ */ jsx("div", { className: "text-muted-foreground [&_svg]:size-3.5", children: icon }),
             /* @__PURE__ */ jsx("figcaption", { className: "flex-1 truncate text-muted-foreground", children: title }),
-            allowCopy ? /* @__PURE__ */ jsx(CopyButton, { className: "-mr-2", onCopy }) : null
+            allowCopy ? /* @__PURE__ */ jsx(CopyButton, { className: "-me-2", onCopy }) : null
           ] }) : allowCopy && /* @__PURE__ */ jsx(
             CopyButton,
             {

package/dist/{chunk-CRYPD6UZ.js → chunk-HLGNIWUN.js}

@@ -5,6 +5,7 @@ var I18nContext = createContext({
     search: "Search",
     searchNoResult: "No results found",
     toc: "On this page",
+    tocNoHeadings: "No Headings",
     lastUpdate: "Last updated on",
     chooseLanguage: "Choose a language",
     nextPage: "Next",

package/dist/{chunk-JQW5DMD2.js → chunk-KOSWCGKQ.js}

@@ -11,7 +11,7 @@ import {
 } from "./chunk-FSPYEOFC.js";
 import {
   useI18n
-} from "./chunk-CRYPD6UZ.js";
+} from "./chunk-HLGNIWUN.js";
 import {
   Collapsible,
   CollapsibleContent,
@@ -73,60 +73,23 @@ function LargeSearchToggle(props) {
   );
 }
 
-// src/components/layout/theme-toggle.tsx
-import { cva } from "class-variance-authority";
-import { Moon, Sun } from "lucide-react";
-import { useTheme } from "next-themes";
-import { useCallback as useCallback2 } from "react";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var buttonVariants2 = cva("size-7 rounded-full p-1.5 text-muted-foreground", {
-  variants: {
-    dark: {
-      true: "dark:bg-accent dark:text-accent-foreground",
-      false: "bg-accent text-accent-foreground dark:bg-transparent dark:text-muted-foreground"
-    }
-  }
-});
-function ThemeToggle({
-  className,
-  ...props
-}) {
-  const { setTheme, resolvedTheme } = useTheme();
-  const onToggle = useCallback2(() => {
-    setTheme(resolvedTheme === "dark" ? "light" : "dark");
-  }, [setTheme, resolvedTheme]);
-  return /* @__PURE__ */ jsxs2(
-    "button",
-    {
-      type: "button",
-      className: twMerge(
-        "inline-flex items-center rounded-full border p-0.5",
-        className
-      ),
-      "aria-label": "Toggle Theme",
-      onClick: onToggle,
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx2(Sun, { className: twMerge(buttonVariants2({ dark: false })) }),
-        /* @__PURE__ */ jsx2(Moon, { className: twMerge(buttonVariants2({ dark: true })) })
-      ]
-    }
-  );
-}
+// src/components/layout/links-menu.tsx
+import { useEffect, useState } from "react";
+import { usePathname as usePathname2 } from "next/navigation";
 
-// src/components/link-item.tsx
+// src/components/layout/link-item.tsx
 import Link from "fumadocs-core/link";
 import { ChevronDown } from "lucide-react";
 import { usePathname } from "next/navigation";
-import { cva as cva2 } from "class-variance-authority";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-var linkItemVariants = cva2(
-  "inline-flex items-center gap-1.5 rounded-lg p-2 text-muted-foreground transition-colors [&_svg]:size-4",
+import { cva } from "class-variance-authority";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var linkItemVariants = cva(
+  "inline-flex items-center gap-1.5 rounded-lg p-2 text-muted-foreground transition-colors data-[state=open]:bg-accent [&_svg]:size-4",
   {
     variants: {
       active: {
         true: "bg-accent text-accent-foreground",
-        false: "hover:bg-accent"
+        false: "hover:bg-accent hover:transition-none"
       }
     },
     defaultVariants: {
@@ -142,27 +105,24 @@ function LinkItem({
 }) {
   const pathname = usePathname();
   if (item.type === "menu" && on === "nav") {
-    return /* @__PURE__ */ jsxs3(Popover, { children: [
-      /* @__PURE__ */ jsxs3(
+    return /* @__PURE__ */ jsxs2(Popover, { children: [
+      /* @__PURE__ */ jsxs2(
         PopoverTrigger,
         {
-          className: twMerge(
-            linkItemVariants({ className }),
-            "data-[state=open]:bg-accent"
-          ),
+          className: twMerge(linkItemVariants({ className })),
           ...props,
           children: [
             item.text,
-            /* @__PURE__ */ jsx3(ChevronDown, { className: "ml-auto size-4" })
+            /* @__PURE__ */ jsx2(ChevronDown, { className: "ms-auto size-4" })
           ]
         }
       ),
-      /* @__PURE__ */ jsx3(PopoverContent, { className: "flex flex-col", children: item.items.map((child, i) => /* @__PURE__ */ jsx3(LinkItem, { item: child, on: "menu" }, i)) })
+      /* @__PURE__ */ jsx2(PopoverContent, { className: "flex flex-col", children: item.items.map((child, i) => /* @__PURE__ */ jsx2(LinkItem, { item: child, on: "menu" }, i)) })
     ] });
   }
   if (item.type === "menu") {
-    return /* @__PURE__ */ jsxs3(Collapsible, { className: "flex flex-col", children: [
-      /* @__PURE__ */ jsxs3(
+    return /* @__PURE__ */ jsxs2(Collapsible, { className: "flex flex-col", children: [
+      /* @__PURE__ */ jsxs2(
         CollapsibleTrigger,
         {
           className: twMerge(linkItemVariants({ className }), "group/link"),
@@ -170,17 +130,17 @@ function LinkItem({
           children: [
             item.icon,
             item.text,
-            /* @__PURE__ */ jsx3(ChevronDown, { className: "ml-auto size-4 group-data-[state=closed]/link:-rotate-90" })
+            /* @__PURE__ */ jsx2(ChevronDown, { className: "ms-auto size-4 group-data-[state=closed]/link:-rotate-90" })
           ]
         }
       ),
-      /* @__PURE__ */ jsx3(CollapsibleContent, { children: /* @__PURE__ */ jsx3("div", { className: "flex flex-col py-1 ps-4", children: item.items.map((child, i) => /* @__PURE__ */ jsx3(LinkItem, { item: child, on: "menu" }, i)) }) })
+      /* @__PURE__ */ jsx2(CollapsibleContent, { children: /* @__PURE__ */ jsx2("div", { className: "flex flex-col py-1 ps-4", children: item.items.map((child, i) => /* @__PURE__ */ jsx2(LinkItem, { item: child, on: "menu" }, i)) }) })
     ] });
   }
   const activeType = item.active ?? "url";
   const active = activeType !== "none" ? isActive(item.url, pathname, activeType === "nested-url") : false;
   if (item.type === "secondary" && on === "nav") {
-    return /* @__PURE__ */ jsx3(
+    return /* @__PURE__ */ jsx2(
       Link,
       {
         "aria-label": item.text,
@@ -198,7 +158,7 @@ function LinkItem({
       }
     );
   }
-  return /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsxs2(
     Link,
     {
       href: item.url,
@@ -218,9 +178,84 @@ function LinkItem({
   );
 }
 
+// src/components/layout/links-menu.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function LinksMenu({
+  items,
+  footer,
+  ...props
+}) {
+  const [open, setOpen] = useState(false);
+  const pathname = usePathname2();
+  useEffect(() => {
+    setOpen(false);
+  }, [pathname]);
+  return /* @__PURE__ */ jsxs3(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx3(
+      PopoverTrigger,
+      {
+        ...props,
+        className: twMerge(
+          buttonVariants({
+            size: "icon",
+            color: "ghost",
+            className: props.className
+          })
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs3(PopoverContent, { className: "flex flex-col", children: [
+      items.map((item, i) => /* @__PURE__ */ jsx3(LinkItem, { item, on: "menu" }, i)),
+      footer
+    ] })
+  ] });
+}
+
+// src/components/layout/theme-toggle.tsx
+import { cva as cva2 } from "class-variance-authority";
+import { Moon, Sun } from "lucide-react";
+import { useTheme } from "next-themes";
+import { useCallback as useCallback2 } from "react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var buttonVariants2 = cva2("size-7 rounded-full p-1.5 text-muted-foreground", {
+  variants: {
+    dark: {
+      true: "dark:bg-accent dark:text-accent-foreground",
+      false: "bg-accent text-accent-foreground dark:bg-transparent dark:text-muted-foreground"
+    }
+  }
+});
+function ThemeToggle({
+  className,
+  ...props
+}) {
+  const { setTheme, resolvedTheme } = useTheme();
+  const onToggle = useCallback2(() => {
+    setTheme(resolvedTheme === "dark" ? "light" : "dark");
+  }, [setTheme, resolvedTheme]);
+  return /* @__PURE__ */ jsxs4(
+    "button",
+    {
+      type: "button",
+      className: twMerge(
+        "inline-flex items-center rounded-full border p-0.5",
+        className
+      ),
+      "aria-label": "Toggle Theme",
+      onClick: onToggle,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx4(Sun, { className: twMerge(buttonVariants2({ dark: false })) }),
+        /* @__PURE__ */ jsx4(Moon, { className: twMerge(buttonVariants2({ dark: true })) })
+      ]
+    }
+  );
+}
+
 export {
   SearchToggle,
   LargeSearchToggle,
   LinkItem,
+  LinksMenu,
   ThemeToggle
 };

package/dist/components/accordion.js

@@ -73,7 +73,7 @@ var Accordion = forwardRef(({ title, className, id, children, ...props }, ref) =
             ]
           }
         ),
-        /* @__PURE__ */ jsx(AccordionPrimitive.Content, { className: "overflow-hidden data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down", children: /* @__PURE__ */ jsx("div", { className: "ml-2 p-4 pt-0 prose-no-margin", children }) })
+        /* @__PURE__ */ jsx(AccordionPrimitive.Content, { className: "overflow-hidden data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down", children: /* @__PURE__ */ jsx("div", { className: "ms-2 p-4 pt-0 prose-no-margin", children }) })
       ]
     }
   );
@@ -92,7 +92,7 @@ function CopyButton({ id }) {
       className: twMerge(
         buttonVariants({
           color: "ghost",
-          className: "text-muted-foreground mr-2"
+          className: "text-muted-foreground me-2"
         })
       ),
       onClick,

package/dist/components/api.js

@@ -79,7 +79,7 @@ function Property({
       /* @__PURE__ */ jsx("code", { children: name }),
       required ? /* @__PURE__ */ jsx("div", { className: twMerge(badgeVariants({ color: "red" })), children: "Required" }) : null,
       deprecated ? /* @__PURE__ */ jsx("div", { className: twMerge(badgeVariants({ color: "yellow" })), children: "Deprecated" }) : null,
-      /* @__PURE__ */ jsx("span", { className: "ml-auto font-mono text-[13px] text-muted-foreground", children: type })
+      /* @__PURE__ */ jsx("span", { className: "ms-auto font-mono text-[13px] text-muted-foreground", children: type })
     ] }),
     children
   ] });

package/dist/components/callout.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { HTMLAttributes, ReactNode } from 'react';
 
-declare const Callout: React.ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "title" | "type" | "icon"> & {
+declare const Callout: React.ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "title" | "icon" | "type"> & {
     title?: ReactNode;
     /**
      * @defaultValue info

package/dist/components/codeblock.js

@@ -2,7 +2,7 @@
 import {
   CodeBlock,
   Pre
-} from "../chunk-XXVXIK4M.js";
+} from "../chunk-E5OQ6FBQ.js";
 import "../chunk-VYTHQTZE.js";
 import "../chunk-2KMKNVSN.js";
 import "../chunk-7GZKFBAP.js";

package/dist/components/dialog/search-algolia.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   SearchDialog
-} from "../../chunk-7EMVRXMS.js";
+} from "../../chunk-45374JLF.js";
 import "../../chunk-3F57TIUQ.js";
 import "../../chunk-FSPYEOFC.js";
-import "../../chunk-CRYPD6UZ.js";
+import "../../chunk-HLGNIWUN.js";
 import "../../chunk-7GZKFBAP.js";
 import "../../chunk-TK3TM3MR.js";
 import "../../chunk-MLKGABMK.js";

package/dist/components/dialog/search-default.js

@@ -1,12 +1,12 @@
 "use client";
 import {
   SearchDialog
-} from "../../chunk-7EMVRXMS.js";
+} from "../../chunk-45374JLF.js";
 import "../../chunk-3F57TIUQ.js";
 import "../../chunk-FSPYEOFC.js";
 import {
   useI18n
-} from "../../chunk-CRYPD6UZ.js";
+} from "../../chunk-HLGNIWUN.js";
 import "../../chunk-7GZKFBAP.js";
 import "../../chunk-TK3TM3MR.js";
 import "../../chunk-MLKGABMK.js";

package/dist/components/dialog/search.js

@@ -1,9 +1,9 @@
 import {
   SearchDialog
-} from "../../chunk-7EMVRXMS.js";
+} from "../../chunk-45374JLF.js";
 import "../../chunk-3F57TIUQ.js";
 import "../../chunk-FSPYEOFC.js";
-import "../../chunk-CRYPD6UZ.js";
+import "../../chunk-HLGNIWUN.js";
 import "../../chunk-7GZKFBAP.js";
 import "../../chunk-TK3TM3MR.js";
 import "../../chunk-MLKGABMK.js";

package/dist/components/files.js

@@ -52,7 +52,7 @@ function Folder({
       open ? /* @__PURE__ */ jsx(FolderOpen, {}) : /* @__PURE__ */ jsx(FolderIcon, {}),
       name
     ] }),
-    /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx("div", { className: "ml-2 flex flex-col border-l pl-2", children: props.children }) })
+    /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx("div", { className: "ms-2 flex flex-col border-l pl-2", children: props.children }) })
   ] });
 }
 export {

package/dist/components/heading.js

@@ -1,6 +1,6 @@
 import {
   Heading
-} from "../chunk-IOHAG6BY.js";
+} from "../chunk-5CZEA2KX.js";
 import "../chunk-TK3TM3MR.js";
 import "../chunk-MLKGABMK.js";
 export {

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

@@ -6,7 +6,7 @@ import {
 } from "../../chunk-UBVEKNRF.js";
 import {
   useI18n
-} from "../../chunk-CRYPD6UZ.js";
+} from "../../chunk-HLGNIWUN.js";
 import {
   buttonVariants
 } from "../../chunk-7GZKFBAP.js";

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

@@ -25,9 +25,9 @@ function RootToggle({
   const pathname = usePathname();
   const selected = options.find((item) => isActive(item.url, pathname, true)) ?? options[0];
   return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsxs(PopoverTrigger, { className: "-mx-2 flex flex-row items-center gap-2 rounded-lg p-2 hover:bg-muted", children: [
+    /* @__PURE__ */ jsxs(PopoverTrigger, { className: "-mx-2 flex flex-row items-center gap-2.5 rounded-lg p-2 hover:bg-muted", children: [
       /* @__PURE__ */ jsx(Item, { ...selected }),
-      /* @__PURE__ */ jsx(ChevronDown, { className: "size-4 text-muted-foreground" })
+      /* @__PURE__ */ jsx(ChevronDown, { className: "me-1.5 size-4 text-muted-foreground" })
     ] }),
     /* @__PURE__ */ jsx(PopoverContent, { className: "w-[var(--radix-popover-trigger-width)] overflow-hidden p-0", children: options.map((item) => /* @__PURE__ */ jsx(
       Link,

package/dist/components/roll-button.d.ts

@@ -2,7 +2,7 @@ interface RollButtonProps {
     /**
      * Percentage of scroll position to display the roll button
      *
-     * @defaultValue 0.2
+     * @defaultValue 0.1
      */
     percentage?: number;
 }

package/dist/components/roll-button.js

@@ -1,4 +1,8 @@
 "use client";
+import {
+  useTreeContext
+} from "../chunk-34Z7WODD.js";
+import "../chunk-AN2Y6MA2.js";
 import {
   buttonVariants
 } from "../chunk-7GZKFBAP.js";
@@ -9,12 +13,19 @@ import "../chunk-MLKGABMK.js";
 
 // src/components/roll-button.tsx
 import { ChevronUp } from "lucide-react";
-import { useEffect, useState } from "react";
-import { jsx } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { usePathname } from "next/navigation";
+import { jsx, jsxs } from "react/jsx-runtime";
 function RollButton({
-  percentage = 0.2
+  percentage = 0.1
 }) {
   const [show, setShow] = useState(false);
+  const { navigation } = useTreeContext();
+  const pathname = usePathname();
+  const current = useMemo(
+    () => navigation.find((item) => item.url === pathname),
+    [pathname, navigation]
+  );
   useEffect(() => {
     const listener = () => {
       const element = document.scrollingElement;
@@ -27,7 +38,7 @@ function RollButton({
       window.removeEventListener("scroll", listener);
     };
   }, [percentage]);
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(
     "button",
     {
       type: "button",
@@ -35,18 +46,20 @@ function RollButton({
       className: twMerge(
         buttonVariants({
           color: "secondary",
-          size: "icon",
-          className: "fixed bottom-8 p-3 right-8 z-50 shadow-md rounded-full transition-all"
+          className: "fixed top-16 [&_svg]:size-4 gap-1 left-1/2 translate-x-[-50%] z-10 shadow-md rounded-full transition-all md:top-4"
         }),
         !show && "translate-y-20 opacity-0"
       ),
-      onClick: () => {
+      onClick: useCallback(() => {
         document.scrollingElement?.scrollTo({
           top: 0,
           behavior: "smooth"
         });
-      },
-      children: /* @__PURE__ */ jsx(ChevronUp, {})
+      }, []),
+      children: [
+        current?.icon ?? /* @__PURE__ */ jsx(ChevronUp, {}),
+        current?.name
+      ]
     }
   );
 }

package/dist/docs.client.d.ts

@@ -1,13 +1,19 @@
-import { S as SidebarProps, N as NavProps } from './layout.client-Duq0TTke.js';
+import { L as LinkItemType, S as SidebarProps, N as NavProps } from './layout.client-Duq0TTke.js';
 export { a as Sidebar } from './layout.client-Duq0TTke.js';
 export { T as TreeContextProvider } from './tree-CrKzI9Nz.js';
 import { ButtonHTMLAttributes } from 'react';
 import 'fumadocs-core/server';
 
+interface LinksMenuProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    items: LinkItemType[];
+    footer?: React.ReactNode;
+}
+declare function LinksMenu({ items, footer, ...props }: LinksMenuProps): React.ReactElement;
+
 declare function DynamicSidebar(props: SidebarProps): React.ReactElement;
 
 declare function ThemeToggle({ className, ...props }: ButtonHTMLAttributes<HTMLButtonElement>): React.ReactElement;
 
 declare function SubNav({ title, url, children, enableSearch, }: NavProps): React.ReactElement;
 
-export { DynamicSidebar, SubNav, ThemeToggle };
+export { DynamicSidebar, LinksMenu, SubNav, ThemeToggle };

package/dist/docs.client.js

@@ -2,18 +2,19 @@
 import {
   LargeSearchToggle,
   LinkItem,
+  LinksMenu,
   SearchToggle,
   ThemeToggle
-} from "./chunk-JQW5DMD2.js";
-import {
-  TreeContextProvider,
-  useTreeContext
-} from "./chunk-34Z7WODD.js";
+} from "./chunk-KOSWCGKQ.js";
 import {
   ScrollArea,
   ScrollViewport
 } from "./chunk-VYTHQTZE.js";
 import "./chunk-UBVEKNRF.js";
+import {
+  TreeContextProvider,
+  useTreeContext
+} from "./chunk-34Z7WODD.js";
 import {
   hasActive,
   isActive
@@ -24,7 +25,7 @@ import {
 import {
   useSearchContext
 } from "./chunk-FSPYEOFC.js";
-import "./chunk-CRYPD6UZ.js";
+import "./chunk-HLGNIWUN.js";
 import {
   Collapsible,
   CollapsibleContent,
@@ -112,7 +113,7 @@ function Sidebar({
           {
             ...bannerProps,
             className: twMerge(
-              "flex flex-col gap-2 border-b px-4 py-2 md:p-3 md:pt-10",
+              "flex flex-col gap-2 px-4 pt-2 md:px-3 md:pt-6",
               bannerProps?.className
             ),
             children: [
@@ -121,13 +122,13 @@ function Sidebar({
             ]
           }
         ),
-        /* @__PURE__ */ jsx(ViewportContent, { children: items.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: items.map((item, i) => /* @__PURE__ */ jsx(LinkItem, { item, on: "menu" }, i)) }) }),
+        /* @__PURE__ */ jsx(ViewportContent, { children: items.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-col md:hidden", children: items.map((item, i) => /* @__PURE__ */ jsx(LinkItem, { item, on: "menu" }, i)) }) }),
         /* @__PURE__ */ jsx(
           "div",
           {
             ...footerProps,
             className: twMerge(
-              "flex flex-row items-center border-t px-4 py-2 md:px-3",
+              "flex flex-row items-center border-t px-4 py-1 md:px-3",
               footerProps?.className
             ),
             children: footer
@@ -141,10 +142,18 @@ function ViewportContent({
   children
 }) {
   const { root } = useTreeContext();
-  return /* @__PURE__ */ jsx(ScrollArea, { className: "flex-1", children: /* @__PURE__ */ jsx(ScrollViewport, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-8 p-4 pb-10 md:px-3", children: [
-    children,
-    /* @__PURE__ */ jsx(NodeList, { items: root.children })
-  ] }) }) });
+  return /* @__PURE__ */ jsx(ScrollArea, { className: "flex-1", children: /* @__PURE__ */ jsx(
+    ScrollViewport,
+    {
+      style: {
+        maskImage: "linear-gradient(to bottom, transparent 2px, white 24px, white calc(100% - 24px), transparent calc(100% - 2px))"
+      },
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-8 px-4 py-6 md:px-3", children: [
+        children,
+        /* @__PURE__ */ jsx(NodeList, { items: root.children })
+      ] })
+    }
+  ) });
 }
 function NodeList({
   items,
@@ -365,11 +374,11 @@ function SubNav({
     "nav",
     {
       id: "nd-subnav",
-      className: "sticky top-0 z-40 flex h-16 w-full flex-row items-center border-b bg-background/50 px-4 backdrop-blur-md md:hidden [&_svg]:size-5",
+      className: "sticky top-0 z-40 flex h-16 w-full flex-row items-center border-b bg-background/80 px-4 backdrop-blur-md md:hidden [&_svg]:size-5",
       children: [
         /* @__PURE__ */ jsx3(Link2, { href: url, className: "inline-flex items-center gap-3 font-semibold", children: title }),
         children,
-        enabled && enableSearch ? /* @__PURE__ */ jsx3(SearchToggle, { className: "ml-auto" }) : null,
+        enabled && enableSearch ? /* @__PURE__ */ jsx3(SearchToggle, { className: "ms-auto" }) : null,
         /* @__PURE__ */ jsx3(
           SidebarTrigger,
           {
@@ -377,7 +386,7 @@ function SubNav({
               buttonVariants({
                 color: "ghost",
                 size: "icon",
-                className: (!enabled || !enableSearch) && "ml-auto"
+                className: (!enabled || !enableSearch) && "ms-auto"
               })
             ),
             children: open ? /* @__PURE__ */ jsx3(X, {}) : /* @__PURE__ */ jsx3(Menu, {})
@@ -389,6 +398,7 @@ function SubNav({
 }
 export {
   DynamicSidebar,
+  LinksMenu,
   Sidebar,
   SubNav,
   ThemeToggle,

package/dist/{i18n-CE8z-AAs.d.ts → i18n-DSnJuWoW.d.ts}

@@ -2,6 +2,7 @@ interface Translations {
     search: string;
     searchNoResult: string;
     toc: string;
+    tocNoHeadings: string;
     lastUpdate: string;
     chooseLanguage: string;
     nextPage: string;

package/dist/i18n.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
-import { N as NamedTranslation } from './i18n-CE8z-AAs.js';
-export { T as Translations } from './i18n-CE8z-AAs.js';
+import { N as NamedTranslation } from './i18n-DSnJuWoW.js';
+export { T as Translations } from './i18n-DSnJuWoW.js';
 
 interface I18nProviderProps {
     /**

package/dist/i18n.js

@@ -2,7 +2,7 @@
 import {
   I18nContext,
   useI18n
-} from "./chunk-CRYPD6UZ.js";
+} from "./chunk-HLGNIWUN.js";
 import "./chunk-MLKGABMK.js";
 
 // src/i18n.tsx