fumadocs-ui 12.1.1 → 12.1.3

package/dist/components/api.js

@@ -1,14 +1,20 @@
 "use client";
 import {
-  buttonVariants
-} from "../chunk-H5USAX5W.js";
+  Tab,
+  Tabs
+} from "../chunk-NUPTR2L5.js";
+import {
+  Accordion,
+  Accordions
+} from "../chunk-MXPAPA74.js";
+import "../chunk-2KMKNVSN.js";
+import "../chunk-H5USAX5W.js";
 import {
   twMerge
 } from "../chunk-TK3TM3MR.js";
 import "../chunk-MLKGABMK.js";
 
 // src/components/api.tsx
-import { useState } from "react";
 import { cva } from "class-variance-authority";
 import { jsx, jsxs } from "react/jsx-runtime";
 function Root({
@@ -89,42 +95,51 @@ function APIExample({
   className,
   ...props
 }) {
-  const [isOpen, setIsOpen] = useState(false);
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       className: twMerge("sticky top-6 h-fit xl:w-2/5 xl:min-w-[400px]", className),
       ...props,
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center gap-4 xl:hidden", children: [
-          /* @__PURE__ */ jsx("div", { className: "h-px flex-1 bg-border" }),
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: twMerge(
-                buttonVariants({
-                  color: "secondary",
-                  size: "lg"
-                })
-              ),
-              onClick: () => {
-                setIsOpen((v) => !v);
-              },
-              children: "More Details"
-            }
-          ),
-          /* @__PURE__ */ jsx("div", { className: "h-px flex-1 bg-border" })
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: twMerge(!isOpen && "max-xl:hidden"), children })
-      ]
+      children
     }
   );
 }
+var Responses = Tabs;
+var Response = Tab;
+var Requests = Tabs;
+var Request = Tab;
+function ResponseTypes(props) {
+  return /* @__PURE__ */ jsx(
+    Accordions,
+    {
+      type: "single",
+      className: "!-m-4 border-none pt-2",
+      defaultValue: "Response",
+      children: props.children
+    }
+  );
+}
+function ExampleResponse(props) {
+  return /* @__PURE__ */ jsx(Accordion, { title: "Response", children: props.children });
+}
+function TypeScriptResponse(props) {
+  return /* @__PURE__ */ jsx(Accordion, { title: "Typescript", children: props.children });
+}
+function ObjectCollapsible(props) {
+  return /* @__PURE__ */ jsx(Accordions, { type: "single", children: /* @__PURE__ */ jsx(Accordion, { title: "Object Type", children: props.children }) });
+}
 export {
   API,
   APIExample,
   APIInfo,
+  ExampleResponse,
+  ObjectCollapsible,
   Property,
-  Root
+  Request,
+  Requests,
+  Response,
+  ResponseTypes,
+  Responses,
+  Root,
+  TypeScriptResponse
 };

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

@@ -1,9 +1,9 @@
 "use client";
 import {
   SearchDialog
-} from "../../chunk-45QF3XKA.js";
+} from "../../chunk-BHP6OUWK.js";
 import "../../chunk-3F57TIUQ.js";
-import "../../chunk-FSPYEOFC.js";
+import "../../chunk-ET4TW6M5.js";
 import "../../chunk-HLGNIWUN.js";
 import "../../chunk-H5USAX5W.js";
 import "../../chunk-TK3TM3MR.js";

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

@@ -1,9 +1,9 @@
 "use client";
 import {
   SearchDialog
-} from "../../chunk-45QF3XKA.js";
+} from "../../chunk-BHP6OUWK.js";
 import "../../chunk-3F57TIUQ.js";
-import "../../chunk-FSPYEOFC.js";
+import "../../chunk-ET4TW6M5.js";
 import {
   useI18n
 } from "../../chunk-HLGNIWUN.js";

package/dist/components/dialog/search.js

@@ -1,8 +1,8 @@
 import {
   SearchDialog
-} from "../../chunk-45QF3XKA.js";
+} from "../../chunk-BHP6OUWK.js";
 import "../../chunk-3F57TIUQ.js";
-import "../../chunk-FSPYEOFC.js";
+import "../../chunk-ET4TW6M5.js";
 import "../../chunk-HLGNIWUN.js";
 import "../../chunk-H5USAX5W.js";
 import "../../chunk-TK3TM3MR.js";

package/dist/components/tabs.js

@@ -1,163 +1,13 @@
 "use client";
 import {
-  twMerge
-} from "../chunk-TK3TM3MR.js";
-import {
-  __export
-} from "../chunk-MLKGABMK.js";
-
-// src/components/tabs.tsx
-import {
-  useEffect,
-  useMemo,
-  useState,
-  useCallback
-} from "react";
-
-// src/components/ui/tabs.tsx
-var tabs_exports = {};
-__export(tabs_exports, {
-  Tabs: () => Tabs,
-  TabsContent: () => TabsContent,
-  TabsList: () => TabsList,
-  TabsTrigger: () => TabsTrigger
-});
-import * as TabsPrimitive from "@radix-ui/react-tabs";
-import * as React from "react";
-import { jsx } from "react/jsx-runtime";
-var Tabs = React.forwardRef((props, ref) => {
-  return /* @__PURE__ */ jsx(
-    TabsPrimitive.Root,
-    {
-      ref,
-      ...props,
-      className: twMerge(
-        "flex flex-col overflow-hidden rounded-xl border bg-card",
-        props.className
-      )
-    }
-  );
-});
-Tabs.displayName = "Tabs";
-var TabsList = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(
-  TabsPrimitive.List,
-  {
-    ref,
-    ...props,
-    className: twMerge(
-      "flex flex-row items-end gap-4 overflow-x-auto bg-secondary px-4 text-muted-foreground",
-      props.className
-    )
-  }
-));
-TabsList.displayName = "TabsList";
-var TabsTrigger = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(
-  TabsPrimitive.Trigger,
-  {
-    ref,
-    ...props,
-    className: twMerge(
-      "whitespace-nowrap border-b border-transparent py-2 text-sm font-medium transition-colors hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-primary data-[state=active]:text-primary",
-      props.className
-    )
-  }
-));
-TabsTrigger.displayName = "TabsTrigger";
-var TabsContent = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(
-  TabsPrimitive.Content,
-  {
-    ref,
-    ...props,
-    className: twMerge("p-4", props.className)
-  }
-));
-TabsContent.displayName = "TabsContent";
-
-// src/components/tabs.tsx
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-var listeners = /* @__PURE__ */ new Map();
-function addChangeListener(id, listener) {
-  const list = listeners.get(id) ?? [];
-  list.push(listener);
-  listeners.set(id, list);
-}
-function removeChangeListener(id, listener) {
-  const list = listeners.get(id) ?? [];
-  listeners.set(
-    id,
-    list.filter((item) => item !== listener)
-  );
-}
-function update(id, v, persist) {
-  listeners.get(id)?.forEach((item) => {
-    item(v);
-  });
-  if (persist) localStorage.setItem(id, v);
-  else sessionStorage.setItem(id, v);
-}
-function Tabs2({
-  id,
-  items = [],
-  persist = false,
-  defaultIndex = 0,
-  children
-}) {
-  const values = useMemo(() => items.map((item) => toValue(item)), [items]);
-  const [value, setValue] = useState(values[defaultIndex]);
-  useEffect(() => {
-    if (!id) return;
-    const onUpdate = (v) => {
-      if (values.includes(v)) setValue(v);
-    };
-    const previous = persist ? localStorage.getItem(id) : sessionStorage.getItem(id);
-    if (previous) onUpdate(previous);
-    addChangeListener(id, onUpdate);
-    return () => {
-      removeChangeListener(id, onUpdate);
-    };
-  }, [id, persist, values]);
-  const onValueChange = useCallback((v) => {
-    if (id) {
-      update(id, v, persist);
-    } else {
-      setValue(v);
-    }
-  }, []);
-  return /* @__PURE__ */ jsxs(
-    Tabs,
-    {
-      value,
-      onValueChange,
-      className: "my-4",
-      children: [
-        /* @__PURE__ */ jsx2(TabsList, { children: values.map((v, i) => /* @__PURE__ */ jsx2(TabsTrigger, { value: v, children: items[i] }, v)) }),
-        children
-      ]
-    }
-  );
-}
-function toValue(v) {
-  return v.toLowerCase().replace(/\s/, "-");
-}
-function Tab({
-  value,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx2(
-    TabsContent,
-    {
-      value: toValue(value),
-      className: twMerge(
-        "prose-no-margin [&>figure:only-child]:-m-4 [&>figure:only-child]:rounded-none [&>figure:only-child]:border-none",
-        className
-      ),
-      ...props
-    }
-  );
-}
+  Tab,
+  Tabs,
+  tabs_exports
+} from "../chunk-NUPTR2L5.js";
+import "../chunk-TK3TM3MR.js";
+import "../chunk-MLKGABMK.js";
 export {
   tabs_exports as Primitive,
   Tab,
-  Tabs2 as Tabs
+  Tabs
 };

package/dist/docs.client.d.ts

@@ -1,5 +1,5 @@
-import { L as LinkItemType, S as SidebarProps, N as NavProps } from './layout.client-BzAmSQXB.js';
-export { a as Sidebar } from './layout.client-BzAmSQXB.js';
+import { L as LinkItemType, S as SidebarProps, a as SharedNavProps } from './layout-DAwDgfTa.js';
+export { b as Sidebar } from './layout-DAwDgfTa.js';
 export { T as TreeContextProvider } from './tree-CrKzI9Nz.js';
 import { ButtonHTMLAttributes } from 'react';
 import 'fumadocs-core/server';
@@ -14,6 +14,6 @@ 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;
+declare function SubNav({ title, url, transparentMode, children, enableSearch, }: SharedNavProps): React.ReactElement;
 
 export { DynamicSidebar, LinksMenu, SubNav, ThemeToggle };

package/dist/docs.client.js

@@ -3,9 +3,11 @@ import {
   LargeSearchToggle,
   LinkItem,
   LinksMenu,
+  NavBox,
   SearchToggle,
-  ThemeToggle
-} from "./chunk-YJDZJ4BG.js";
+  ThemeToggle,
+  Title
+} from "./chunk-IOZPSMRL.js";
 import {
   ScrollArea,
   ScrollViewport
@@ -24,7 +26,7 @@ import {
 } from "./chunk-3F57TIUQ.js";
 import {
   useSearchContext
-} from "./chunk-FSPYEOFC.js";
+} from "./chunk-ET4TW6M5.js";
 import "./chunk-HLGNIWUN.js";
 import {
   Collapsible,
@@ -40,7 +42,6 @@ import {
 import "./chunk-MLKGABMK.js";
 
 // src/docs.client.tsx
-import Link2 from "next/link";
 import { SidebarTrigger } from "fumadocs-core/sidebar";
 import { Menu, X } from "lucide-react";
 
@@ -268,12 +269,14 @@ function DynamicSidebar(props) {
   const { collapsed, setCollapsed } = useSidebar();
   const [hover, setHover] = useState2(false);
   const timerRef = useRef(0);
+  const hoverTimeRef = useRef(0);
   const onCollapse = useCallback2(() => {
     setCollapsed((v) => !v);
     setHover(false);
+    hoverTimeRef.current = Date.now() + 500;
   }, [setCollapsed]);
-  const onHover = useCallback2((e) => {
-    if (e.pointerType === "touch") return;
+  const onEnter = useCallback2((e) => {
+    if (e.pointerType === "touch" || hoverTimeRef.current > Date.now()) return;
     window.clearTimeout(timerRef.current);
     setHover(true);
   }, []);
@@ -288,8 +291,8 @@ function DynamicSidebar(props) {
     collapsed ? /* @__PURE__ */ jsx2(
       "div",
       {
-        className: "fixed inset-y-0 start-0 w-4 max-md:hidden xl:static xl:w-[260px]",
-        onPointerEnter: onHover,
+        className: "fixed inset-y-0 start-0 w-4 max-md:hidden 2xl:w-[180px]",
+        onPointerEnter: onEnter,
         onPointerLeave: onLeave
       }
     ) : null,
@@ -316,7 +319,7 @@ function DynamicSidebar(props) {
         aside: {
           "data-collapse": collapsed,
           "data-hover": hover,
-          onPointerEnter: onHover,
+          onPointerEnter: onEnter,
           onPointerLeave: onLeave,
           "aria-hidden": Boolean(collapsed && !hover),
           className: twMerge(
@@ -352,19 +355,21 @@ function DynamicSidebar(props) {
 import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 function SubNav({
   title,
-  url = "/",
+  url,
+  transparentMode,
   children,
   enableSearch = true
 }) {
   const { open } = useSidebar();
   const { enabled } = useSearchContext();
   return /* @__PURE__ */ jsxs3(
-    "nav",
+    NavBox,
     {
       id: "nd-subnav",
-      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",
+      className: "flex flex-row items-center px-4 md:hidden",
+      transparentMode,
       children: [
-        /* @__PURE__ */ jsx3(Link2, { href: url, className: "inline-flex items-center gap-3 font-semibold", children: title }),
+        /* @__PURE__ */ jsx3(Title, { url, title }),
         children,
         enabled && enableSearch ? /* @__PURE__ */ jsx3(SearchToggle, { className: "ms-auto" }) : null,
         /* @__PURE__ */ jsx3(

package/dist/{layout.client-BzAmSQXB.d.ts → layout-DAwDgfTa.d.ts}

@@ -1,29 +1,21 @@
-import { ReactNode, HTMLAttributes } from 'react';
 import { PageTree } from 'fumadocs-core/server';
+import { ReactNode, HTMLAttributes } from 'react';
 
-interface NavProps {
+interface NavBoxProps {
+    /**
+     * When to use transparent navbar
+     * @defaultValue none
+     */
+    transparentMode?: 'always' | 'top' | 'none';
+}
+interface TitleProps {
     title?: ReactNode;
     /**
      * Redirect url of title
      * @defaultValue '/'
      */
     url?: string;
-    /**
-     * Show/hide search toggle
-     *
-     * Note: Enable/disable search from root provider instead
-     */
-    enableSearch?: boolean;
-    /**
-     * When to use transparent navbar
-     * @defaultValue none
-     */
-    transparentMode?: 'always' | 'top' | 'none';
-    children?: ReactNode;
 }
-declare function Nav({ title, url, items, transparentMode, enableSearch, children, }: NavProps & {
-    items: LinkItemType[];
-}): React.ReactElement;
 
 interface SidebarProps {
     items: LinkItemType[];
@@ -87,10 +79,19 @@ type LinkItemType = {
     text: string;
     external?: boolean;
 };
-interface NavOptions extends Omit<NavProps, 'items'> {
+interface NavOptions extends SharedNavProps {
     enabled: boolean;
     component: ReactNode;
 }
+interface SharedNavProps extends TitleProps, NavBoxProps {
+    /**
+     * Show/hide search toggle
+     *
+     * Note: Enable/disable search from root provider instead
+     */
+    enableSearch?: boolean;
+    children?: ReactNode;
+}
 interface SidebarOptions extends Omit<SidebarProps, 'items'> {
     enabled: boolean;
     component: ReactNode;
@@ -122,4 +123,4 @@ interface DocsLayoutProps extends BaseLayoutProps {
 declare function Layout({ nav, links, githubUrl, children, }: BaseLayoutProps): React.ReactElement;
 declare function DocsLayout({ nav, githubUrl, sidebar: { enabled: sidebarEnabled, collapsible, component: sidebarReplace, ...sidebar }, links, containerProps, tree, i18n, children, }: DocsLayoutProps): React.ReactElement;
 
-export { type BaseLayoutProps as B, type DocsLayoutProps as D, type LinkItemType as L, type NavProps as N, type SidebarProps as S, Sidebar as a, Layout as b, DocsLayout as c, Nav as d };
+export { type BaseLayoutProps as B, type DocsLayoutProps as D, type LinkItemType as L, type SidebarProps as S, type SharedNavProps as a, Sidebar as b, Layout as c, DocsLayout as d };

package/dist/layout.client.d.ts

@@ -1,3 +1,9 @@
-export { d as Nav } from './layout.client-BzAmSQXB.js';
-import 'react';
+import { a as SharedNavProps, L as LinkItemType } from './layout-DAwDgfTa.js';
 import 'fumadocs-core/server';
+import 'react';
+
+declare function Nav({ title, url, items, transparentMode, enableSearch, children, }: SharedNavProps & {
+    items: LinkItemType[];
+}): React.ReactElement;
+
+export { Nav };

package/dist/layout.client.js

@@ -3,100 +3,69 @@ import {
   LargeSearchToggle,
   LinkItem,
   LinksMenu,
+  NavBox,
   SearchToggle,
-  ThemeToggle
-} from "./chunk-YJDZJ4BG.js";
+  ThemeToggle,
+  Title
+} from "./chunk-IOZPSMRL.js";
 import "./chunk-GHKJ6EFT.js";
 import "./chunk-AN2Y6MA2.js";
 import {
   useSearchContext
-} from "./chunk-FSPYEOFC.js";
+} from "./chunk-ET4TW6M5.js";
 import {
   useI18n
 } from "./chunk-HLGNIWUN.js";
 import "./chunk-7XPZOMJ2.js";
 import "./chunk-H5USAX5W.js";
-import {
-  twMerge
-} from "./chunk-TK3TM3MR.js";
+import "./chunk-TK3TM3MR.js";
 import "./chunk-MLKGABMK.js";
 
-// src/components/layout/nav.tsx
-import Link from "fumadocs-core/link";
-import { useEffect, useState } from "react";
+// src/layout.client.tsx
 import { MoreVertical } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 function Nav({
-  title = "My App",
-  url = "/",
+  title,
+  url,
   items,
-  transparentMode = "none",
+  transparentMode,
   enableSearch = true,
   children
 }) {
   const search = useSearchContext();
-  const [transparent, setTransparent] = useState(transparentMode !== "none");
   const { text } = useI18n();
-  useEffect(() => {
-    if (transparentMode !== "top") return;
-    const listener = () => {
-      setTransparent(window.scrollY < 10);
-    };
-    listener();
-    window.addEventListener("scroll", listener);
-    return () => {
-      window.removeEventListener("scroll", listener);
-    };
-  }, [transparentMode]);
-  return /* @__PURE__ */ jsx(
-    "header",
-    {
-      id: "nd-nav",
-      className: twMerge(
-        "sticky top-0 z-50 h-16 border-b transition-colors",
-        transparent ? "border-transparent" : "border-foreground/10 bg-background/80 backdrop-blur-md"
-      ),
-      children: /* @__PURE__ */ jsxs("nav", { className: "mx-auto flex size-full max-w-container flex-row items-center gap-6 px-4", children: [
-        /* @__PURE__ */ jsx(
-          Link,
-          {
-            href: url,
-            className: "inline-flex items-center gap-2.5 font-semibold",
-            children: title
-          }
-        ),
-        children,
-        items.filter((item) => item.type !== "secondary").map((item, i) => /* @__PURE__ */ jsx(
-          LinkItem,
-          {
-            item,
-            className: "-mx-2 text-sm max-lg:hidden"
-          },
-          i
-        )),
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-row items-center justify-end md:gap-2", children: [
-          enableSearch && search.enabled ? /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(SearchToggle, { className: "md:hidden" }),
-            /* @__PURE__ */ jsx(LargeSearchToggle, { className: "w-full max-w-[240px] max-md:hidden" })
-          ] }) : null,
-          /* @__PURE__ */ jsx(ThemeToggle, { className: "max-lg:hidden" }),
-          /* @__PURE__ */ jsx(
-            LinksMenu,
-            {
-              items,
-              className: "lg:hidden",
-              footer: /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center justify-between px-2 py-1", children: [
-                /* @__PURE__ */ jsx("p", { className: "font-medium text-muted-foreground", children: text.chooseTheme }),
-                /* @__PURE__ */ jsx(ThemeToggle, {})
-              ] }),
-              children: /* @__PURE__ */ jsx(MoreVertical, {})
-            }
-          ),
-          items.filter((item) => item.type === "secondary").map((item, i) => /* @__PURE__ */ jsx(LinkItem, { item, className: "max-lg:hidden" }, i))
-        ] })
-      ] })
-    }
-  );
+  return /* @__PURE__ */ jsx(NavBox, { id: "nd-nav", transparentMode, children: /* @__PURE__ */ jsxs("nav", { className: "mx-auto flex size-full max-w-container flex-row items-center gap-6 px-4", children: [
+    /* @__PURE__ */ jsx(Title, { title, url }),
+    children,
+    items.filter((item) => item.type !== "secondary").map((item, i) => /* @__PURE__ */ jsx(
+      LinkItem,
+      {
+        item,
+        className: "-mx-2 text-sm max-lg:hidden"
+      },
+      i
+    )),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-row items-center justify-end md:gap-2", children: [
+      enableSearch && search.enabled ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(SearchToggle, { className: "md:hidden" }),
+        /* @__PURE__ */ jsx(LargeSearchToggle, { className: "w-full max-w-[240px] max-md:hidden" })
+      ] }) : null,
+      /* @__PURE__ */ jsx(ThemeToggle, { className: "max-lg:hidden" }),
+      items.filter((item) => item.type === "secondary").map((item, i) => /* @__PURE__ */ jsx(LinkItem, { item, className: "max-lg:hidden" }, i)),
+      /* @__PURE__ */ jsx(
+        LinksMenu,
+        {
+          items,
+          className: "lg:hidden",
+          footer: /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center justify-between px-2 pt-2", children: [
+            /* @__PURE__ */ jsx("p", { className: "font-medium text-muted-foreground", children: text.chooseTheme }),
+            /* @__PURE__ */ jsx(ThemeToggle, {})
+          ] }),
+          children: /* @__PURE__ */ jsx(MoreVertical, {})
+        }
+      )
+    ] })
+  ] }) });
 }
 export {
   Nav

package/dist/layout.d.ts

@@ -1,3 +1,3 @@
 import 'fumadocs-core/server';
 import 'react';
-export { B as BaseLayoutProps, c as DocsLayout, D as DocsLayoutProps, b as Layout, L as LinkItemType } from './layout.client-BzAmSQXB.js';
+export { B as BaseLayoutProps, d as DocsLayout, D as DocsLayoutProps, c as Layout, L as LinkItemType, a as SharedNavProps } from './layout-DAwDgfTa.js';

package/dist/layout.js

@@ -53,7 +53,7 @@ function DocsLayout({
   children
 }) {
   const finalLinks = getLinks(links, githubUrl);
-  const Aside = sidebarEnabled && collapsible ? DynamicSidebar : Sidebar;
+  const Aside = collapsible ? DynamicSidebar : Sidebar;
   return /* @__PURE__ */ jsxs(TreeContextProvider, { tree, children: [
     replaceOrDefault(nav, /* @__PURE__ */ jsx(SubNav, { ...nav })),
     /* @__PURE__ */ jsxs(

package/dist/page.client.d.ts

@@ -1,6 +1,6 @@
 import { TOCItemType } from 'fumadocs-core/server';
 import * as Primitive from 'fumadocs-core/toc-internal';
-import { ReactNode, ReactElement } from 'react';
+import { ReactNode, ReactElement, ButtonHTMLAttributes } from 'react';
 import { BreadcrumbOptions } from 'fumadocs-core/breadcrumb';
 
 interface TOCProps {
@@ -16,7 +16,7 @@ interface TOCProps {
 }
 declare const TocProvider: typeof Primitive.AnchorProvider;
 declare function Toc({ items, header, footer }: TOCProps): ReactElement;
-declare function SubToc({ items, header, footer }: TOCProps): ReactElement;
+declare function SubToc({ items, header, footer, ...props }: TOCProps & ButtonHTMLAttributes<HTMLButtonElement>): ReactElement;
 
 interface BreadcrumbProps extends Omit<BreadcrumbOptions, 'includePage'> {
     /**