fumadocs-ui 12.4.2 → 12.5.0

package/dist/components/dialog/search.d.ts

@@ -1,5 +1,5 @@
 import { SortedResult } from 'fumadocs-core/search/shared';
-import { ReactNode } from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
 
 type SearchLink = [name: string, href: string];
 interface SharedProps {
@@ -10,15 +10,26 @@ interface SharedProps {
      */
     links?: SearchLink[];
 }
-interface SearchDialogProps extends SharedProps, Omit<SearchContentProps, 'defaultItems'> {
+interface SearchDialogProps extends SharedProps, Omit<SearchContentProps, 'items'> {
+    results: SortedResult[] | 'empty';
     footer?: ReactNode;
 }
 interface SearchContentProps {
     search: string;
     onSearchChange: (v: string) => void;
-    results: SortedResult[] | 'empty';
-    defaultItems?: SortedResult[];
+    items: SortedResult[];
+    hideResults?: boolean;
 }
 declare function SearchDialog({ open, onOpenChange, footer, links, ...props }: SearchDialogProps): React.ReactElement;
+interface TagItem {
+    name: string;
+    value: string;
+}
+interface TagsListProps extends HTMLAttributes<HTMLDivElement> {
+    tag?: string;
+    onTagChange: (tag: string) => void;
+    items: TagItem[];
+}
+declare function TagsList({ tag, onTagChange, items, ...props }: TagsListProps): ReactNode;
 
-export { SearchDialog, type SearchLink, type SharedProps };
+export { SearchDialog, type SearchLink, type SharedProps, type TagItem, TagsList, type TagsListProps };

package/dist/components/dialog/search.js

@@ -1,12 +1,15 @@
 import {
-  SearchDialog
-} from "../../chunk-BZ53GHJX.js";
-import "../../chunk-3F57TIUQ.js";
+  SearchDialog,
+  TagsList
+} from "../../chunk-INUQLSIT.js";
 import "../../chunk-ET4TW6M5.js";
+import "../../chunk-YXSAWF3G.js";
 import "../../chunk-HLGNIWUN.js";
-import "../../chunk-VUIQ7ZYI.js";
+import "../../chunk-V7IGWU5C.js";
+import "../../chunk-YSCK5YFO.js";
 import "../../chunk-TK3TM3MR.js";
 import "../../chunk-MLKGABMK.js";
 export {
-  SearchDialog
+  SearchDialog,
+  TagsList
 };

package/dist/components/files.d.ts

@@ -7,6 +7,7 @@ interface FileProps extends HTMLAttributes<HTMLDivElement> {
 }
 interface FolderProps extends HTMLAttributes<HTMLDivElement> {
     name: string;
+    disabled?: boolean;
     /**
      * Open folder by default
      *

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

@@ -9,7 +9,7 @@ import {
 } from "../../chunk-HLGNIWUN.js";
 import {
   buttonVariants
-} from "../../chunk-VUIQ7ZYI.js";
+} from "../../chunk-YSCK5YFO.js";
 import {
   twMerge
 } from "../../chunk-TK3TM3MR.js";

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

@@ -7,6 +7,10 @@ import {
 import {
   isActive
 } from "../../chunk-IIDV3RNQ.js";
+import {
+  useSidebar
+} from "../../chunk-YXSAWF3G.js";
+import "../../chunk-V7IGWU5C.js";
 import {
   twMerge
 } from "../../chunk-TK3TM3MR.js";
@@ -14,7 +18,7 @@ import "../../chunk-MLKGABMK.js";
 
 // src/components/layout/root-toggle.tsx
 import { ChevronDown } from "lucide-react";
-import { useState } from "react";
+import { useCallback, useState } from "react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -22,8 +26,13 @@ function RootToggle({
   options
 }) {
   const [open, setOpen] = useState(false);
+  const { closeOnRedirect } = useSidebar();
   const pathname = usePathname();
   const selected = options.find((item) => isActive(item.url, pathname, true)) ?? options[0];
+  const onClick = useCallback(() => {
+    closeOnRedirect.current = false;
+    setOpen(false);
+  }, [closeOnRedirect]);
   return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, 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 }),
@@ -33,9 +42,7 @@ function RootToggle({
       Link,
       {
         href: item.url,
-        onClick: () => {
-          setOpen(false);
-        },
+        onClick,
         className: twMerge(
           "flex w-full flex-row gap-2 p-2",
           selected === item ? "bg-accent text-accent-foreground" : "hover:bg-accent/50"

package/dist/components/roll-button.js

@@ -5,7 +5,7 @@ import {
 import "../chunk-IIDV3RNQ.js";
 import {
   buttonVariants
-} from "../chunk-VUIQ7ZYI.js";
+} from "../chunk-YSCK5YFO.js";
 import {
   twMerge
 } from "../chunk-TK3TM3MR.js";

package/dist/components/tabs.d.ts

@@ -1,7 +1,6 @@
 import * as TabsPrimitive from '@radix-ui/react-tabs';
-import { TabsContentProps } from '@radix-ui/react-tabs';
+import { TabsProps as TabsProps$1, TabsContentProps } from '@radix-ui/react-tabs';
 import * as React$1 from 'react';
-import { ReactNode } from 'react';
 
 declare const Tabs$1: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 declare const TabsList: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
@@ -15,7 +14,7 @@ declare namespace tabs {
   export { Tabs$1 as Tabs, tabs_TabsContent as TabsContent, tabs_TabsList as TabsList, tabs_TabsTrigger as TabsTrigger };
 }
 
-interface TabsProps {
+interface TabsProps extends TabsProps$1 {
     /**
      * Identifier for Sharing value of tabs
      */
@@ -29,9 +28,8 @@ interface TabsProps {
      */
     defaultIndex?: number;
     items?: string[];
-    children: ReactNode;
 }
-declare function Tabs({ id, items, persist, defaultIndex, children, }: TabsProps): React.ReactElement;
+declare function Tabs({ id, items, persist, defaultIndex, ...props }: TabsProps): React.ReactElement;
 declare function Tab({ value, className, ...props }: TabsContentProps): React.ReactElement;
 
 export { tabs as Primitive, Tab, Tabs, type TabsProps };

package/dist/components/tabs.js

@@ -3,7 +3,7 @@ import {
   Tab,
   Tabs,
   tabs_exports
-} from "../chunk-NUPTR2L5.js";
+} from "../chunk-QZBW7643.js";
 import "../chunk-TK3TM3MR.js";
 import "../chunk-MLKGABMK.js";
 export {

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

@@ -1,13 +1,12 @@
-import { S as SidebarProps, a as SharedNavProps } from './layout-ZAteQVYk.js';
-export { L as LinksMenu, b as Sidebar } from './layout-ZAteQVYk.js';
+import { S as SharedNavProps } from './layout.shared-GQuo9xqE.js';
+export { a as LinksMenu } from './layout.shared-GQuo9xqE.js';
+export { a as Sidebar } from './sidebar-C7MbvaPk.js';
 export { T as TreeContextProvider } from './tree-CrKzI9Nz.js';
 import { ButtonHTMLAttributes } from 'react';
 import 'fumadocs-core/server';
 
-declare function DynamicSidebar(props: SidebarProps): React.ReactElement;
-
 declare function ThemeToggle({ className, ...props }: ButtonHTMLAttributes<HTMLButtonElement>): React.ReactElement;
 
 declare function SubNav({ title, url, transparentMode, children, enableSearch, }: SharedNavProps): React.ReactElement;
 
-export { DynamicSidebar, SubNav, ThemeToggle };
+export { SubNav, ThemeToggle };

package/dist/docs-layout.client.js

@@ -0,0 +1,83 @@
+"use client";
+import {
+  NavBox,
+  ThemeToggle,
+  Title
+} from "./chunk-ZMEQF77D.js";
+import {
+  Sidebar
+} from "./chunk-CIVJB4ZT.js";
+import {
+  LinksMenu,
+  SearchToggle
+} from "./chunk-AAS47F5B.js";
+import "./chunk-VYTHQTZE.js";
+import "./chunk-GHKJ6EFT.js";
+import {
+  TreeContextProvider
+} from "./chunk-R3M2OC5U.js";
+import "./chunk-IIDV3RNQ.js";
+import {
+  useSearchContext
+} from "./chunk-ET4TW6M5.js";
+import {
+  useSidebar
+} from "./chunk-YXSAWF3G.js";
+import "./chunk-HLGNIWUN.js";
+import "./chunk-V7IGWU5C.js";
+import "./chunk-7XPZOMJ2.js";
+import {
+  buttonVariants
+} from "./chunk-YSCK5YFO.js";
+import {
+  twMerge
+} from "./chunk-TK3TM3MR.js";
+import "./chunk-MLKGABMK.js";
+
+// src/docs-layout.client.tsx
+import { SidebarTrigger } from "fumadocs-core/sidebar";
+import { Menu, X } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function SubNav({
+  title,
+  url,
+  transparentMode,
+  children,
+  enableSearch = true
+}) {
+  const { open } = useSidebar();
+  const { enabled } = useSearchContext();
+  return /* @__PURE__ */ jsxs(
+    NavBox,
+    {
+      id: "nd-subnav",
+      className: "flex h-14 flex-row items-center px-4 md:hidden",
+      transparentMode,
+      children: [
+        /* @__PURE__ */ jsx(Title, { url, title }),
+        /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-row items-center", children }),
+        enabled && enableSearch ? /* @__PURE__ */ jsx(SearchToggle, {}) : null,
+        /* @__PURE__ */ jsx(
+          SidebarTrigger,
+          {
+            className: twMerge(
+              buttonVariants({
+                color: "ghost",
+                size: "icon",
+                className: "-me-2"
+              })
+            ),
+            children: open ? /* @__PURE__ */ jsx(X, {}) : /* @__PURE__ */ jsx(Menu, {})
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  LinksMenu,
+  Sidebar,
+  SubNav,
+  ThemeToggle,
+  TreeContextProvider
+};

package/dist/dynamic-sidebar-DCHFPBYF.js

@@ -0,0 +1,123 @@
+"use client";
+import {
+  Sidebar
+} from "./chunk-CIVJB4ZT.js";
+import "./chunk-AAS47F5B.js";
+import "./chunk-VYTHQTZE.js";
+import "./chunk-GHKJ6EFT.js";
+import "./chunk-R3M2OC5U.js";
+import "./chunk-IIDV3RNQ.js";
+import "./chunk-ET4TW6M5.js";
+import {
+  useSidebar
+} from "./chunk-YXSAWF3G.js";
+import "./chunk-HLGNIWUN.js";
+import "./chunk-V7IGWU5C.js";
+import "./chunk-7XPZOMJ2.js";
+import {
+  buttonVariants
+} from "./chunk-YSCK5YFO.js";
+import {
+  twMerge
+} from "./chunk-TK3TM3MR.js";
+import "./chunk-MLKGABMK.js";
+
+// src/components/layout/dynamic-sidebar.tsx
+import { useCallback, useRef, useState } from "react";
+import { SidebarIcon } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function DynamicSidebar(props) {
+  const { collapsed, setCollapsed } = useSidebar();
+  const [hover, setHover] = useState(false);
+  const timerRef = useRef(0);
+  const closeTimeRef = useRef(0);
+  const onCollapse = useCallback(() => {
+    setCollapsed((v) => !v);
+    setHover(false);
+    closeTimeRef.current = Date.now() + 150;
+  }, [setCollapsed]);
+  const onEnter = useCallback((e) => {
+    if (e.pointerType === "touch" || closeTimeRef.current > Date.now()) return;
+    window.clearTimeout(timerRef.current);
+    setHover(true);
+  }, []);
+  const onLeave = useCallback((e) => {
+    if (e.pointerType === "touch") return;
+    window.clearTimeout(timerRef.current);
+    timerRef.current = window.setTimeout(
+      () => {
+        setHover(false);
+        closeTimeRef.current = Date.now() + 150;
+      },
+      Math.min(e.clientX, document.body.clientWidth - e.clientX) > 100 ? 0 : 500
+    );
+  }, []);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    collapsed ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "fixed inset-y-0 start-0 w-6 max-md:hidden xl:w-[50px]",
+        onPointerEnter: onEnter,
+        onPointerLeave: onLeave
+      }
+    ) : null,
+    collapsed ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        "aria-label": "Collapse Sidebar",
+        className: twMerge(
+          buttonVariants({
+            color: "secondary",
+            size: "icon",
+            className: "fixed start-4 bottom-2 z-10 max-md:hidden"
+          })
+        ),
+        onClick: onCollapse,
+        children: /* @__PURE__ */ jsx(SidebarIcon, {})
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(
+      Sidebar,
+      {
+        ...props,
+        aside: {
+          "data-collapse": collapsed,
+          "data-hover": hover,
+          onPointerEnter: onEnter,
+          onPointerLeave: onLeave,
+          "aria-hidden": Boolean(collapsed && !hover),
+          className: twMerge(
+            "md:transition-[transform,margin]",
+            collapsed && [
+              "md:top-1 md:mr-[-240px] md:h-[calc(100dvh-4px)] md:animate-sidebar-collapse md:rounded-xl md:border md:shadow-md xl:mr-[-260px]",
+              hover ? "md:translate-x-1 rtl:md:-translate-x-1" : "md:-translate-x-full rtl:md:translate-x-full"
+            ]
+          )
+        },
+        footer: /* @__PURE__ */ jsxs(Fragment, { children: [
+          props.footer,
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Collapse Sidebar",
+              className: twMerge(
+                buttonVariants({
+                  color: "ghost",
+                  size: "icon",
+                  className: "max-md:hidden"
+                })
+              ),
+              onClick: onCollapse,
+              children: /* @__PURE__ */ jsx(SidebarIcon, {})
+            }
+          )
+        ] })
+      }
+    )
+  ] });
+}
+export {
+  DynamicSidebar
+};

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

@@ -1,5 +1,4 @@
-import { a as SharedNavProps, c as LinkItemType } from './layout-ZAteQVYk.js';
-import 'fumadocs-core/server';
+import { S as SharedNavProps, L as LinkItemType } from './layout.shared-GQuo9xqE.js';
 import 'react';
 
 declare function Nav({ title, url, items, transparentMode, enableSearch, children, }: SharedNavProps & {

package/dist/{layout.client.js → home-layout.client.js}

@@ -1,13 +1,15 @@
 "use client";
 import {
-  LargeSearchToggle,
-  LinkItem,
-  LinksMenu,
   NavBox,
-  SearchToggle,
   ThemeToggle,
   Title
-} from "./chunk-NZA3MCPM.js";
+} from "./chunk-ZMEQF77D.js";
+import {
+  LargeSearchToggle,
+  LinkItem,
+  LinksMenu,
+  SearchToggle
+} from "./chunk-AAS47F5B.js";
 import "./chunk-GHKJ6EFT.js";
 import {
   isSecondary
@@ -18,16 +20,17 @@ import {
 import {
   useI18n
 } from "./chunk-HLGNIWUN.js";
+import "./chunk-V7IGWU5C.js";
 import "./chunk-7XPZOMJ2.js";
 import {
   buttonVariants
-} from "./chunk-VUIQ7ZYI.js";
+} from "./chunk-YSCK5YFO.js";
 import {
   twMerge
 } from "./chunk-TK3TM3MR.js";
 import "./chunk-MLKGABMK.js";
 
-// src/layout.client.tsx
+// src/home-layout.client.tsx
 import { MoreVertical } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 function Nav({

package/dist/home-layout.d.ts

@@ -0,0 +1,7 @@
+import { B as BaseLayoutProps } from './layout.shared-GQuo9xqE.js';
+import 'react';
+
+type HomeLayoutProps = BaseLayoutProps;
+declare function HomeLayout({ nav, links, githubUrl, children, }: BaseLayoutProps): React.ReactElement;
+
+export { HomeLayout, type HomeLayoutProps };

package/dist/home-layout.js

@@ -0,0 +1,29 @@
+import { Nav } from "./home-layout.client"
+import {
+  getLinks
+} from "./chunk-FMI5QZTV.js";
+import {
+  replaceOrDefault
+} from "./chunk-IIDV3RNQ.js";
+import "./chunk-MLKGABMK.js";
+
+// src/home-layout.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function HomeLayout({
+  nav = {},
+  links = [],
+  githubUrl,
+  children
+}) {
+  const finalLinks = getLinks(links, githubUrl);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    replaceOrDefault(
+      nav,
+      /* @__PURE__ */ jsx(Nav, { items: finalLinks, ...nav, children: nav.children })
+    ),
+    children
+  ] });
+}
+export {
+  HomeLayout
+};

package/dist/layout.d.ts

@@ -1,3 +1,29 @@
-import 'fumadocs-core/server';
-import 'react';
-export { B as BaseLayoutProps, e as DocsLayout, D as DocsLayoutProps, d as Layout, c as LinkItemType, a as SharedNavProps } from './layout-ZAteQVYk.js';
+import { PageTree } from 'fumadocs-core/server';
+import { HTMLAttributes, ReactNode } from 'react';
+import { S as SidebarProps } from './sidebar-C7MbvaPk.js';
+import { B as BaseLayoutProps } from './layout.shared-GQuo9xqE.js';
+export { L as LinkItemType } from './layout.shared-GQuo9xqE.js';
+
+interface SidebarOptions extends Omit<SidebarProps, 'items'> {
+    enabled: boolean;
+    component: ReactNode;
+    collapsible: boolean;
+}
+interface DocsLayoutProps extends BaseLayoutProps {
+    tree: PageTree.Root;
+    sidebar?: Partial<SidebarOptions>;
+    containerProps?: HTMLAttributes<HTMLDivElement>;
+    /**
+     * Enable Language Switch
+     *
+     * @defaultValue false
+     */
+    i18n?: boolean;
+}
+/**
+ * @deprecated Use `HomeLayout` from `fumadocs-ui/home-layout` instead
+ */
+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 { BaseLayoutProps, DocsLayout, type DocsLayoutProps, Layout };

package/dist/layout.js

@@ -1,21 +1,20 @@
-import {
-  LanguageToggle,
-} from "./components/layout/language-toggle"
 import {
   TreeContextProvider,
-  DynamicSidebar,
   SubNav,
   LinksMenu,
   Sidebar,
   ThemeToggle,
-} from "./docs.client"
-import { Nav } from "./layout.client"
+} from "./docs-layout.client"
+import { Nav } from "./home-layout.client"
+import {
+  getLinks
+} from "./chunk-FMI5QZTV.js";
 import {
   replaceOrDefault
 } from "./chunk-IIDV3RNQ.js";
 import {
   buttonVariants
-} from "./chunk-VUIQ7ZYI.js";
+} from "./chunk-YSCK5YFO.js";
 import {
   twMerge
 } from "./chunk-TK3TM3MR.js";
@@ -24,7 +23,18 @@ import "./chunk-MLKGABMK.js";
 // src/layout.tsx
 import Link from "next/link";
 import { MoreHorizontal } from "lucide-react";
+import dynamic from "next/dynamic";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var LanguageToggle = dynamic(
+  () => import("./components/layout/language-toggle.js").then(
+    (mod) => mod.LanguageToggle
+  )
+);
+var DynamicSidebar = dynamic(
+  () => import("./dynamic-sidebar-DCHFPBYF.js").then(
+    (mod) => mod.DynamicSidebar
+  )
+);
 function Layout({
   nav = {},
   links = [],
@@ -120,21 +130,6 @@ function DocsLayout({
     )
   ] });
 }
-function getLinks(links, githubUrl) {
-  let result = links ?? [];
-  if (githubUrl)
-    result = [
-      ...result,
-      {
-        type: "secondary",
-        url: githubUrl,
-        text: "Github",
-        icon: /* @__PURE__ */ jsx("svg", { role: "img", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" }) }),
-        external: true
-      }
-    ];
-  return result;
-}
 export {
   DocsLayout,
   Layout