fumadocs-ui 16.4.1 → 16.4.2

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

@@ -1,23 +1,47 @@
-import { type ComponentProps, type HTMLAttributes, type ReactNode } from 'react';
-import { type LinkItemType } from '@fumadocs/ui/link-item';
-import { type SidebarTabWithProps } from '../../components/sidebar/tabs/dropdown.js';
-export declare const LayoutContext: import("react").Context<(LayoutInfo & {
-    isNavTransparent: boolean;
+import { SidebarTabWithProps } from "../../components/sidebar/tabs/dropdown.js";
+import * as react_jsx_runtime136 from "react/jsx-runtime";
+import * as react20 from "react";
+import { ComponentProps, HTMLAttributes, ReactNode } from "react";
+import { LinkItemType } from "@fumadocs/ui/link-item";
+
+//#region src/layouts/notebook/client.d.ts
+declare const LayoutContext: react20.Context<(LayoutInfo & {
+  isNavTransparent: boolean;
 }) | null>;
-export interface LayoutInfo {
-    tabMode: 'sidebar' | 'navbar';
-    navMode: 'top' | 'auto';
+interface LayoutInfo {
+  tabMode: 'sidebar' | 'navbar';
+  navMode: 'top' | 'auto';
 }
-export declare function LayoutContextProvider({ navTransparentMode, navMode, tabMode, children, }: LayoutInfo & {
-    navTransparentMode?: 'always' | 'top' | 'none';
-    children: ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
-export declare function LayoutHeader(props: ComponentProps<'header'>): import("react/jsx-runtime").JSX.Element;
-export declare function LayoutBody({ className, style, children, ...props }: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
-export declare function LayoutHeaderTabs({ options, className, ...props }: ComponentProps<'div'> & {
-    options: SidebarTabWithProps[];
-}): import("react/jsx-runtime").JSX.Element;
-export declare function NavbarLinkItem({ item, className, ...props }: {
-    item: LinkItemType;
-} & HTMLAttributes<HTMLElement>): string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+declare function LayoutContextProvider({
+  navTransparentMode,
+  navMode,
+  tabMode,
+  children
+}: LayoutInfo & {
+  navTransparentMode?: 'always' | 'top' | 'none';
+  children: ReactNode;
+}): react_jsx_runtime136.JSX.Element;
+declare function LayoutHeader(props: ComponentProps<'header'>): react_jsx_runtime136.JSX.Element;
+declare function LayoutBody({
+  className,
+  style,
+  children,
+  ...props
+}: ComponentProps<'div'>): react_jsx_runtime136.JSX.Element;
+declare function LayoutHeaderTabs({
+  options,
+  className,
+  ...props
+}: ComponentProps<'div'> & {
+  options: SidebarTabWithProps[];
+}): react_jsx_runtime136.JSX.Element;
+declare function NavbarLinkItem({
+  item,
+  className,
+  ...props
+}: {
+  item: LinkItemType;
+} & HTMLAttributes<HTMLElement>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react20.ReactPortal | react20.ReactElement<unknown, string | react20.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime136.JSX.Element | null | undefined;
+//#endregion
+export { LayoutBody, LayoutContext, LayoutContextProvider, LayoutHeader, LayoutHeaderTabs, LayoutInfo, NavbarLinkItem };
 //# sourceMappingURL=client.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../../src/layouts/notebook/client.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,cAAc,EAGnB,KAAK,cAAc,EAEnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAMf,OAAO,EAEL,KAAK,YAAY,EAElB,MAAM,wBAAwB,CAAC;AAMhC,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,oCAAoC,CAAC;AAE5C,eAAO,MAAM,aAAa;sBAEF,OAAO;UAGxB,CAAC;AAER,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC9B,OAAO,EAAE,KAAK,GAAG,MAAM,CAAC;CACzB;AAED,wBAAgB,qBAAqB,CAAC,EACpC,kBAA2B,EAC3B,OAAO,EACP,OAAO,EACP,QAAQ,GACT,EAAE,UAAU,GAAG;IACd,kBAAkB,CAAC,EAAE,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;IAC/C,QAAQ,EAAE,SAAS,CAAC;CACrB,2CAoBA;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,2CAS3D;AAED,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,2CAqCvB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG;IACzB,OAAO,EAAE,mBAAmB,EAAE,CAAC;CAChC,2CAmCA;AAED,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EACJ,SAAS,EACT,GAAG,KAAK,EACT,EAAE;IAAE,IAAI,EAAE,YAAY,CAAA;CAAE,GAAG,cAAc,CAAC,WAAW,CAAC,2UAmBtD"}
+{"version":3,"file":"client.d.ts","names":[],"sources":["../../../src/layouts/notebook/client.tsx"],"sourcesContent":[],"mappings":";;;;;;;cAuBa,eAAa,OAAA,CAAA,SAAA;;;UAOT,UAAA;EAPJ,OAAA,EAAA,SAKN,GAAA,QALmB;EAOT,OAAA,EAAA,KAAU,GAAA,MAAA;AAK3B;AACE,iBADc,qBAAA,CACd;EAAA,kBAAA;EAAA,OAAA;EAAA,OAAA;EAAA;CAAA,EAIC,UAJD,GAAA;EACA,kBAAA,CAAA,EAAA,QAAA,GAAA,KAAA,GAAA,MAAA;EACA,QAAA,EAIU,SAJV;CACA,CAAA,EAID,oBAAA,CAAA,GAAA,CAAA,OAJC;AACC,iBAuBa,YAAA,CAvBb,KAAA,EAuBiC,cAvBjC,CAAA,QAAA,CAAA,CAAA,EAuByD,oBAAA,CAAA,GAAA,CAAA,OAvBzD;AAES,iBAgCI,UAAA,CAhCJ;EAAA,SAAA;EAAA,KAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAgCyD,cAhCzD,CAAA,KAAA,CAAA,CAAA,EAgC8E,oBAAA,CAAA,GAAA,CAAA,OAhC9E;AACX,iBAoEe,gBAAA,CApEf;EAAA,OAAA;EAAA,SAAA;EAAA,GAAA;AAoBD,CApBC,EAwEE,cAxEF,CAAA,KAAA,CAAA,GAAA;EAAA,OAAA,EAyEU,mBAzEV,EAAA;AAoBD,CAAA,CAAA,EAsDC,oBAAA,CAAA,GAAA,CAAA,OAtDmC;AAWpB,iBA2EA,cAAA,CA3EU;EAAA,IAAA;EAAA,SAAA;EAAA,GAAA;AAAc,CAAd,EAAA;EAAG,IAAA,EA+ElB,YA/EkB;CAAW,GA+EZ,cA/EY,CA+EG,WA/EH,CAAA,CAAA,EAAA,MAAA,GAAA,MAAA,GAAA,MAAA,GAAA,OAAA,GA+Ee,QA/Ef,CA+Ee,SA/Ef,CAAA,GA+Ee,OA/Ef,CAAA,MAAA,GAAA,MAAA,GAAA,MAAA,GAAA,OAAA,GA+Ee,OAAA,CAAA,WAAA,GAAA,OAAA,CAAA,YA/Ef,CAAA,OAAA,EAAA,MAAA,GA+Ee,OAAA,CAAA,qBA/Ef,CAAA,GAAA,CAAA,CAAA,GA+Ee,QA/Ef,CA+Ee,SA/Ef,CAAA,GAAA,IAAA,GAAA,SAAA,CAAA,GA+Ee,oBAAA,CAAA,GAAA,CAAA,OAAA,GA/Ef,IAAA,GAAA,SAAA"}

package/dist/layouts/notebook/client.js

@@ -1,104 +1,159 @@
 'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from '@fumadocs/ui/cn';
-import { createContext, Fragment, use, useMemo, useRef, useState, } from 'react';
-import { useSidebar } from '../../components/sidebar/base.js';
-import { ChevronDown } from '@fumadocs/ui/icons';
-import Link from 'fumadocs-core/link';
-import { usePathname } from 'fumadocs-core/framework';
-import { useIsScrollTop } from '@fumadocs/ui/hooks/use-is-scroll-top';
-import { LinkItem, } from '@fumadocs/ui/link-item';
-import { Popover, PopoverContent, PopoverTrigger, } from '../../components/ui/popover.js';
-import { isTabActive, } from '../../components/sidebar/tabs/dropdown.js';
-export const LayoutContext = createContext(null);
-export function LayoutContextProvider({ navTransparentMode = 'none', navMode, tabMode, children, }) {
-    const isTop = useIsScrollTop({ enabled: navTransparentMode === 'top' }) ?? true;
-    const isNavTransparent = navTransparentMode === 'top' ? isTop : navTransparentMode === 'always';
-    return (_jsx(LayoutContext, { value: useMemo(() => ({
-            isNavTransparent,
-            navMode,
-            tabMode,
-        }), [isNavTransparent, navMode, tabMode]), children: children }));
+
+import { useSidebar } from "../../components/sidebar/base.js";
+import { Popover, PopoverContent, PopoverTrigger } from "../../components/ui/popover.js";
+import { isTabActive } from "../../components/sidebar/tabs/dropdown.js";
+import Link from "fumadocs-core/link";
+import { usePathname } from "fumadocs-core/framework";
+import { cn } from "@fumadocs/ui/cn";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ChevronDown } from "lucide-react";
+import { Fragment as Fragment$1, createContext, use, useMemo, useRef, useState } from "react";
+import { useIsScrollTop } from "@fumadocs/ui/hooks/use-is-scroll-top";
+import { LinkItem } from "@fumadocs/ui/link-item";
+
+//#region src/layouts/notebook/client.tsx
+const LayoutContext = createContext(null);
+function LayoutContextProvider({ navTransparentMode = "none", navMode, tabMode, children }) {
+	const isTop = useIsScrollTop({ enabled: navTransparentMode === "top" }) ?? true;
+	const isNavTransparent = navTransparentMode === "top" ? isTop : navTransparentMode === "always";
+	return /* @__PURE__ */ jsx(LayoutContext, {
+		value: useMemo(() => ({
+			isNavTransparent,
+			navMode,
+			tabMode
+		}), [
+			isNavTransparent,
+			navMode,
+			tabMode
+		]),
+		children
+	});
 }
-export function LayoutHeader(props) {
-    const { open } = useSidebar();
-    const { isNavTransparent } = use(LayoutContext);
-    return (_jsx("header", { "data-transparent": isNavTransparent && !open, ...props, children: props.children }));
+function LayoutHeader(props) {
+	const { open } = useSidebar();
+	const { isNavTransparent } = use(LayoutContext);
+	return /* @__PURE__ */ jsx("header", {
+		"data-transparent": isNavTransparent && !open,
+		...props,
+		children: props.children
+	});
 }
-export function LayoutBody({ className, style, children, ...props }) {
-    const { navMode } = use(LayoutContext);
-    const { collapsed } = useSidebar();
-    const pageCol = 'calc(var(--fd-layout-width,97rem) - var(--fd-sidebar-col) - var(--fd-toc-width))';
-    return (_jsx("div", { id: "nd-notebook-layout", className: cn('grid overflow-x-clip min-h-(--fd-docs-height) transition-[grid-template-columns] auto-cols-auto auto-rows-auto [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-toc-popover-height:0px] [--fd-sidebar-width:0px] [--fd-toc-width:0px]', className), style: {
-            gridTemplate: navMode === 'top'
-                ? `". header header header ."
+function LayoutBody({ className, style, children, ...props }) {
+	const { navMode } = use(LayoutContext);
+	const { collapsed } = useSidebar();
+	const pageCol = "calc(var(--fd-layout-width,97rem) - var(--fd-sidebar-col) - var(--fd-toc-width))";
+	return /* @__PURE__ */ jsx("div", {
+		id: "nd-notebook-layout",
+		className: cn("grid overflow-x-clip min-h-(--fd-docs-height) transition-[grid-template-columns] auto-cols-auto auto-rows-auto [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-toc-popover-height:0px] [--fd-sidebar-width:0px] [--fd-toc-width:0px]", className),
+		style: {
+			gridTemplate: navMode === "top" ? `". header header header ."
         "sidebar sidebar toc-popover toc-popover ."
-        "sidebar sidebar main toc ." 1fr / minmax(min-content, 1fr) var(--fd-sidebar-col) minmax(0, ${pageCol}) var(--fd-toc-width) minmax(min-content, 1fr)`
-                : `"sidebar sidebar header header ."
+        "sidebar sidebar main toc ." 1fr / minmax(min-content, 1fr) var(--fd-sidebar-col) minmax(0, ${pageCol}) var(--fd-toc-width) minmax(min-content, 1fr)` : `"sidebar sidebar header header ."
         "sidebar sidebar toc-popover toc-popover ."
         "sidebar sidebar main toc ." 1fr / minmax(min-content, 1fr) var(--fd-sidebar-col) minmax(0, ${pageCol}) var(--fd-toc-width) minmax(min-content, 1fr)`,
-            '--fd-docs-row-1': 'var(--fd-banner-height, 0px)',
-            '--fd-docs-row-2': 'calc(var(--fd-docs-row-1) + var(--fd-header-height))',
-            '--fd-docs-row-3': 'calc(var(--fd-docs-row-2) + var(--fd-toc-popover-height))',
-            '--fd-sidebar-col': collapsed ? '0px' : 'var(--fd-sidebar-width)',
-            ...style,
-        }, ...props, children: children }));
+			"--fd-docs-row-1": "var(--fd-banner-height, 0px)",
+			"--fd-docs-row-2": "calc(var(--fd-docs-row-1) + var(--fd-header-height))",
+			"--fd-docs-row-3": "calc(var(--fd-docs-row-2) + var(--fd-toc-popover-height))",
+			"--fd-sidebar-col": collapsed ? "0px" : "var(--fd-sidebar-width)",
+			...style
+		},
+		...props,
+		children
+	});
 }
-export function LayoutHeaderTabs({ options, className, ...props }) {
-    const pathname = usePathname();
-    const selectedIdx = useMemo(() => {
-        return options.findLastIndex((option) => isTabActive(option, pathname));
-    }, [options, pathname]);
-    return (_jsx("div", { className: cn('flex flex-row items-end gap-6', className), ...props, children: options.map((option, i) => {
-            const { title, url, unlisted, props: { className, ...rest } = {}, } = option;
-            const isSelected = selectedIdx === i;
-            return (_jsx(Link, { href: url, className: cn('inline-flex border-b-2 border-transparent transition-colors items-center pb-1.5 font-medium gap-2 text-fd-muted-foreground text-sm text-nowrap hover:text-fd-accent-foreground', unlisted && !isSelected && 'hidden', isSelected && 'border-fd-primary text-fd-primary', className), ...rest, children: title }, i));
-        }) }));
+function LayoutHeaderTabs({ options, className, ...props }) {
+	const pathname = usePathname();
+	const selectedIdx = useMemo(() => {
+		return options.findLastIndex((option) => isTabActive(option, pathname));
+	}, [options, pathname]);
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("flex flex-row items-end gap-6", className),
+		...props,
+		children: options.map((option, i) => {
+			const { title, url, unlisted, props: { className: className$1, ...rest } = {} } = option;
+			const isSelected = selectedIdx === i;
+			return /* @__PURE__ */ jsx(Link, {
+				href: url,
+				className: cn("inline-flex border-b-2 border-transparent transition-colors items-center pb-1.5 font-medium gap-2 text-fd-muted-foreground text-sm text-nowrap hover:text-fd-accent-foreground", unlisted && !isSelected && "hidden", isSelected && "border-fd-primary text-fd-primary", className$1),
+				...rest,
+				children: title
+			}, i);
+		})
+	});
 }
-export function NavbarLinkItem({ item, className, ...props }) {
-    if (item.type === 'custom')
-        return item.children;
-    if (item.type === 'menu') {
-        return _jsx(NavbarLinkItemMenu, { item: item, className: className, ...props });
-    }
-    return (_jsx(LinkItem, { item: item, className: cn('text-sm text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground data-[active=true]:text-fd-primary', className), ...props, children: item.text }));
+function NavbarLinkItem({ item, className, ...props }) {
+	if (item.type === "custom") return item.children;
+	if (item.type === "menu") return /* @__PURE__ */ jsx(NavbarLinkItemMenu, {
+		item,
+		className,
+		...props
+	});
+	return /* @__PURE__ */ jsx(LinkItem, {
+		item,
+		className: cn("text-sm text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground data-[active=true]:text-fd-primary", className),
+		...props,
+		children: item.text
+	});
 }
 function NavbarLinkItemMenu({ item, hoverDelay = 50, className, ...props }) {
-    const [open, setOpen] = useState(false);
-    const timeoutRef = useRef(null);
-    const freezeUntil = useRef(null);
-    const delaySetOpen = (value) => {
-        if (timeoutRef.current) {
-            clearTimeout(timeoutRef.current);
-            timeoutRef.current = null;
-        }
-        timeoutRef.current = window.setTimeout(() => {
-            setOpen(value);
-            freezeUntil.current = Date.now() + 300;
-        }, hoverDelay);
-    };
-    const onPointerEnter = (e) => {
-        if (e.pointerType === 'touch')
-            return;
-        delaySetOpen(true);
-    };
-    const onPointerLeave = (e) => {
-        if (e.pointerType === 'touch')
-            return;
-        delaySetOpen(false);
-    };
-    function isTouchDevice() {
-        return 'ontouchstart' in window || navigator.maxTouchPoints > 0;
-    }
-    return (_jsxs(Popover, { open: open, onOpenChange: (value) => {
-            if (freezeUntil.current === null || Date.now() >= freezeUntil.current)
-                setOpen(value);
-        }, children: [_jsxs(PopoverTrigger, { className: cn('inline-flex items-center gap-1.5 p-1 text-sm text-fd-muted-foreground transition-colors has-data-[active=true]:text-fd-primary data-[state=open]:text-fd-accent-foreground focus-visible:outline-none', className), onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, ...props, children: [item.url ? (_jsx(LinkItem, { item: item, children: item.text })) : (item.text), _jsx(ChevronDown, { className: "size-3" })] }), _jsx(PopoverContent, { className: "flex flex-col p-1 text-fd-muted-foreground text-start", onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, children: item.items.map((child, i) => {
-                    if (child.type === 'custom')
-                        return _jsx(Fragment, { children: child.children }, i);
-                    return (_jsxs(LinkItem, { item: child, className: "inline-flex items-center gap-2 rounded-md p-2 transition-colors hover:bg-fd-accent hover:text-fd-accent-foreground data-[active=true]:text-fd-primary [&_svg]:size-4", onClick: () => {
-                            if (isTouchDevice())
-                                setOpen(false);
-                        }, children: [child.icon, child.text] }, i));
-                }) })] }));
+	const [open, setOpen] = useState(false);
+	const timeoutRef = useRef(null);
+	const freezeUntil = useRef(null);
+	const delaySetOpen = (value) => {
+		if (timeoutRef.current) {
+			clearTimeout(timeoutRef.current);
+			timeoutRef.current = null;
+		}
+		timeoutRef.current = window.setTimeout(() => {
+			setOpen(value);
+			freezeUntil.current = Date.now() + 300;
+		}, hoverDelay);
+	};
+	const onPointerEnter = (e) => {
+		if (e.pointerType === "touch") return;
+		delaySetOpen(true);
+	};
+	const onPointerLeave = (e) => {
+		if (e.pointerType === "touch") return;
+		delaySetOpen(false);
+	};
+	function isTouchDevice() {
+		return "ontouchstart" in window || navigator.maxTouchPoints > 0;
+	}
+	return /* @__PURE__ */ jsxs(Popover, {
+		open,
+		onOpenChange: (value) => {
+			if (freezeUntil.current === null || Date.now() >= freezeUntil.current) setOpen(value);
+		},
+		children: [/* @__PURE__ */ jsxs(PopoverTrigger, {
+			className: cn("inline-flex items-center gap-1.5 p-1 text-sm text-fd-muted-foreground transition-colors has-data-[active=true]:text-fd-primary data-[state=open]:text-fd-accent-foreground focus-visible:outline-none", className),
+			onPointerEnter,
+			onPointerLeave,
+			...props,
+			children: [item.url ? /* @__PURE__ */ jsx(LinkItem, {
+				item,
+				children: item.text
+			}) : item.text, /* @__PURE__ */ jsx(ChevronDown, { className: "size-3" })]
+		}), /* @__PURE__ */ jsx(PopoverContent, {
+			className: "flex flex-col p-1 text-fd-muted-foreground text-start",
+			onPointerEnter,
+			onPointerLeave,
+			children: item.items.map((child, i) => {
+				if (child.type === "custom") return /* @__PURE__ */ jsx(Fragment$1, { children: child.children }, i);
+				return /* @__PURE__ */ jsxs(LinkItem, {
+					item: child,
+					className: "inline-flex items-center gap-2 rounded-md p-2 transition-colors hover:bg-fd-accent hover:text-fd-accent-foreground data-[active=true]:text-fd-primary [&_svg]:size-4",
+					onClick: () => {
+						if (isTouchDevice()) setOpen(false);
+					},
+					children: [child.icon, child.text]
+				}, i);
+			})
+		})]
+	});
 }
+
+//#endregion
+export { LayoutBody, LayoutContext, LayoutContextProvider, LayoutHeader, LayoutHeaderTabs, NavbarLinkItem };
+//# sourceMappingURL=client.js.map

package/dist/layouts/notebook/client.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.js","names":["className","Fragment"],"sources":["../../../src/layouts/notebook/client.tsx"],"sourcesContent":["'use client';\nimport { cn } from '@fumadocs/ui/cn';\nimport {\n  type ComponentProps,\n  createContext,\n  Fragment,\n  type HTMLAttributes,\n  type PointerEvent,\n  type ReactNode,\n  use,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { useSidebar } from '@/components/sidebar/base';\nimport { ChevronDown } from 'lucide-react';\nimport Link from 'fumadocs-core/link';\nimport { usePathname } from 'fumadocs-core/framework';\nimport { useIsScrollTop } from '@fumadocs/ui/hooks/use-is-scroll-top';\nimport { LinkItem, type LinkItemType, type MenuItemType } from '@fumadocs/ui/link-item';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\nimport { isTabActive, type SidebarTabWithProps } from '@/components/sidebar/tabs/dropdown';\n\nexport const LayoutContext = createContext<\n  | (LayoutInfo & {\n      isNavTransparent: boolean;\n    })\n  | null\n>(null);\n\nexport interface LayoutInfo {\n  tabMode: 'sidebar' | 'navbar';\n  navMode: 'top' | 'auto';\n}\n\nexport function LayoutContextProvider({\n  navTransparentMode = 'none',\n  navMode,\n  tabMode,\n  children,\n}: LayoutInfo & {\n  navTransparentMode?: 'always' | 'top' | 'none';\n  children: ReactNode;\n}) {\n  const isTop = useIsScrollTop({ enabled: navTransparentMode === 'top' }) ?? true;\n  const isNavTransparent = navTransparentMode === 'top' ? isTop : navTransparentMode === 'always';\n\n  return (\n    <LayoutContext\n      value={useMemo(\n        () => ({\n          isNavTransparent,\n          navMode,\n          tabMode,\n        }),\n        [isNavTransparent, navMode, tabMode],\n      )}\n    >\n      {children}\n    </LayoutContext>\n  );\n}\n\nexport function LayoutHeader(props: ComponentProps<'header'>) {\n  const { open } = useSidebar();\n  const { isNavTransparent } = use(LayoutContext)!;\n\n  return (\n    <header data-transparent={isNavTransparent && !open} {...props}>\n      {props.children}\n    </header>\n  );\n}\n\nexport function LayoutBody({ className, style, children, ...props }: ComponentProps<'div'>) {\n  const { navMode } = use(LayoutContext)!;\n  const { collapsed } = useSidebar();\n  const pageCol =\n    'calc(var(--fd-layout-width,97rem) - var(--fd-sidebar-col) - var(--fd-toc-width))';\n\n  return (\n    <div\n      id=\"nd-notebook-layout\"\n      className={cn(\n        'grid overflow-x-clip min-h-(--fd-docs-height) transition-[grid-template-columns] auto-cols-auto auto-rows-auto [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-toc-popover-height:0px] [--fd-sidebar-width:0px] [--fd-toc-width:0px]',\n        className,\n      )}\n      style={\n        {\n          gridTemplate:\n            navMode === 'top'\n              ? `\". header header header .\"\n        \"sidebar sidebar toc-popover toc-popover .\"\n        \"sidebar sidebar main toc .\" 1fr / minmax(min-content, 1fr) var(--fd-sidebar-col) minmax(0, ${pageCol}) var(--fd-toc-width) minmax(min-content, 1fr)`\n              : `\"sidebar sidebar header header .\"\n        \"sidebar sidebar toc-popover toc-popover .\"\n        \"sidebar sidebar main toc .\" 1fr / minmax(min-content, 1fr) var(--fd-sidebar-col) minmax(0, ${pageCol}) var(--fd-toc-width) minmax(min-content, 1fr)`,\n          '--fd-docs-row-1': 'var(--fd-banner-height, 0px)',\n          '--fd-docs-row-2': 'calc(var(--fd-docs-row-1) + var(--fd-header-height))',\n          '--fd-docs-row-3': 'calc(var(--fd-docs-row-2) + var(--fd-toc-popover-height))',\n          '--fd-sidebar-col': collapsed ? '0px' : 'var(--fd-sidebar-width)',\n          ...style,\n        } as object\n      }\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport function LayoutHeaderTabs({\n  options,\n  className,\n  ...props\n}: ComponentProps<'div'> & {\n  options: SidebarTabWithProps[];\n}) {\n  const pathname = usePathname();\n  const selectedIdx = useMemo(() => {\n    return options.findLastIndex((option) => isTabActive(option, pathname));\n  }, [options, pathname]);\n\n  return (\n    <div className={cn('flex flex-row items-end gap-6', className)} {...props}>\n      {options.map((option, i) => {\n        const { title, url, unlisted, props: { className, ...rest } = {} } = option;\n        const isSelected = selectedIdx === i;\n\n        return (\n          <Link\n            key={i}\n            href={url}\n            className={cn(\n              'inline-flex border-b-2 border-transparent transition-colors items-center pb-1.5 font-medium gap-2 text-fd-muted-foreground text-sm text-nowrap hover:text-fd-accent-foreground',\n              unlisted && !isSelected && 'hidden',\n              isSelected && 'border-fd-primary text-fd-primary',\n              className,\n            )}\n            {...rest}\n          >\n            {title}\n          </Link>\n        );\n      })}\n    </div>\n  );\n}\n\nexport function NavbarLinkItem({\n  item,\n  className,\n  ...props\n}: { item: LinkItemType } & HTMLAttributes<HTMLElement>) {\n  if (item.type === 'custom') return item.children;\n\n  if (item.type === 'menu') {\n    return <NavbarLinkItemMenu item={item} className={className} {...props} />;\n  }\n\n  return (\n    <LinkItem\n      item={item}\n      className={cn(\n        'text-sm text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground data-[active=true]:text-fd-primary',\n        className,\n      )}\n      {...props}\n    >\n      {item.text}\n    </LinkItem>\n  );\n}\n\nfunction NavbarLinkItemMenu({\n  item,\n  hoverDelay = 50,\n  className,\n  ...props\n}: { item: MenuItemType; hoverDelay?: number } & HTMLAttributes<HTMLElement>) {\n  const [open, setOpen] = useState(false);\n  const timeoutRef = useRef<number>(null);\n  const freezeUntil = useRef<number>(null);\n\n  const delaySetOpen = (value: boolean) => {\n    if (timeoutRef.current) {\n      clearTimeout(timeoutRef.current);\n      timeoutRef.current = null;\n    }\n\n    timeoutRef.current = window.setTimeout(() => {\n      setOpen(value);\n      freezeUntil.current = Date.now() + 300;\n    }, hoverDelay);\n  };\n  const onPointerEnter = (e: PointerEvent) => {\n    if (e.pointerType === 'touch') return;\n    delaySetOpen(true);\n  };\n  const onPointerLeave = (e: PointerEvent) => {\n    if (e.pointerType === 'touch') return;\n    delaySetOpen(false);\n  };\n  function isTouchDevice() {\n    return 'ontouchstart' in window || navigator.maxTouchPoints > 0;\n  }\n\n  return (\n    <Popover\n      open={open}\n      onOpenChange={(value) => {\n        if (freezeUntil.current === null || Date.now() >= freezeUntil.current) setOpen(value);\n      }}\n    >\n      <PopoverTrigger\n        className={cn(\n          'inline-flex items-center gap-1.5 p-1 text-sm text-fd-muted-foreground transition-colors has-data-[active=true]:text-fd-primary data-[state=open]:text-fd-accent-foreground focus-visible:outline-none',\n          className,\n        )}\n        onPointerEnter={onPointerEnter}\n        onPointerLeave={onPointerLeave}\n        {...props}\n      >\n        {item.url ? <LinkItem item={item as { url: string }}>{item.text}</LinkItem> : item.text}\n        <ChevronDown className=\"size-3\" />\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"flex flex-col p-1 text-fd-muted-foreground text-start\"\n        onPointerEnter={onPointerEnter}\n        onPointerLeave={onPointerLeave}\n      >\n        {item.items.map((child, i) => {\n          if (child.type === 'custom') return <Fragment key={i}>{child.children}</Fragment>;\n\n          return (\n            <LinkItem\n              key={i}\n              item={child}\n              className=\"inline-flex items-center gap-2 rounded-md p-2 transition-colors hover:bg-fd-accent hover:text-fd-accent-foreground data-[active=true]:text-fd-primary [&_svg]:size-4\"\n              onClick={() => {\n                if (isTouchDevice()) setOpen(false);\n              }}\n            >\n              {child.icon}\n              {child.text}\n            </LinkItem>\n          );\n        })}\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":"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"}

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

@@ -1,34 +1,38 @@
-import { type ComponentProps, type FC, type HTMLAttributes, type ReactNode } from 'react';
-import { type BaseLayoutProps } from '../../layouts/shared/index.js';
-import { Sidebar } from './sidebar.js';
-import type * as PageTree from 'fumadocs-core/page-tree';
-import type { SidebarPageTreeComponents } from '../../components/sidebar/page-tree.js';
-import { type GetSidebarTabsOptions } from '../../components/sidebar/tabs/index.js';
-import { type SidebarTabWithProps } from '../../components/sidebar/tabs/dropdown.js';
-export interface DocsLayoutProps extends BaseLayoutProps {
-    tree: PageTree.Root;
-    tabMode?: 'sidebar' | 'navbar';
-    nav?: BaseLayoutProps['nav'] & {
-        mode?: 'top' | 'auto';
-    };
-    sidebar?: SidebarOptions;
-    containerProps?: HTMLAttributes<HTMLDivElement>;
+import { SidebarPageTreeComponents } from "../../components/sidebar/page-tree.js";
+import { GetSidebarTabsOptions } from "../../components/sidebar/tabs/index.js";
+import { SidebarTabWithProps } from "../../components/sidebar/tabs/dropdown.js";
+import { BaseLayoutProps } from "../shared/index.js";
+import { Sidebar } from "./sidebar.js";
+import * as react_jsx_runtime135 from "react/jsx-runtime";
+import { ComponentProps, FC, HTMLAttributes, ReactNode } from "react";
+import * as PageTree from "fumadocs-core/page-tree";
+
+//#region src/layouts/notebook/index.d.ts
+interface DocsLayoutProps extends BaseLayoutProps {
+  tree: PageTree.Root;
+  tabMode?: 'sidebar' | 'navbar';
+  nav?: BaseLayoutProps['nav'] & {
+    mode?: 'top' | 'auto';
+  };
+  sidebar?: SidebarOptions;
+  containerProps?: HTMLAttributes<HTMLDivElement>;
 }
 interface SidebarOptions extends ComponentProps<'aside'>, Pick<ComponentProps<typeof Sidebar>, 'defaultOpenLevel' | 'prefetch'> {
-    components?: Partial<SidebarPageTreeComponents>;
-    /**
-     * Root Toggle options
-     */
-    tabs?: SidebarTabWithProps[] | GetSidebarTabsOptions | false;
-    banner?: ReactNode | FC<ComponentProps<'div'>>;
-    footer?: ReactNode | FC<ComponentProps<'div'>>;
-    /**
-     * Support collapsing the sidebar on desktop mode
-     *
-     * @defaultValue true
-     */
-    collapsible?: boolean;
+  components?: Partial<SidebarPageTreeComponents>;
+  /**
+   * Root Toggle options
+   */
+  tabs?: SidebarTabWithProps[] | GetSidebarTabsOptions | false;
+  banner?: ReactNode | FC<ComponentProps<'div'>>;
+  footer?: ReactNode | FC<ComponentProps<'div'>>;
+  /**
+   * Support collapsing the sidebar on desktop mode
+   *
+   * @defaultValue true
+   */
+  collapsible?: boolean;
 }
-export declare function DocsLayout(props: DocsLayoutProps): import("react/jsx-runtime").JSX.Element;
-export {};
+declare function DocsLayout(props: DocsLayoutProps): react_jsx_runtime135.JSX.Element;
+//#endregion
+export { DocsLayout, DocsLayoutProps };
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layouts/notebook/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,EAAE,EACP,KAAK,cAAc,EACnB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AACf,OAAO,EACL,KAAK,eAAe,EAGrB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EACL,OAAO,EAQR,MAAM,WAAW,CAAC;AAOnB,OAAO,KAAK,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AAazD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAChF,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,oCAAoC,CAAC;AAE5C,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAE/B,GAAG,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG;QAC7B,IAAI,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;KACvB,CAAC;IAEF,OAAO,CAAC,EAAE,cAAc,CAAC;IAEzB,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,UAAU,cACR,SACE,cAAc,CAAC,OAAO,CAAC,EACvB,IAAI,CAAC,cAAc,CAAC,OAAO,OAAO,CAAC,EAAE,kBAAkB,GAAG,UAAU,CAAC;IACvE,UAAU,CAAC,EAAE,OAAO,CAAC,yBAAyB,CAAC,CAAC;IAEhD;;OAEG;IACH,IAAI,CAAC,EAAE,mBAAmB,EAAE,GAAG,qBAAqB,GAAG,KAAK,CAAC;IAE7D,MAAM,CAAC,EAAE,SAAS,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC;IAC/C,MAAM,CAAC,EAAE,SAAS,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC;IAE/C;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAsNhD"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/layouts/notebook/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;UAgCiB,eAAA,SAAwB;QACjC,QAAA,CAAS;;EADA,GAAA,CAAA,EAIT,eAJyB,CAAA,KAAA,CAAA,GAAA;IACzB,IAAS,CAAA,EAAA,KAAA,GAAA,MAAA;EAGT,CAAA;EAII,OAAA,CAAA,EAAA,cAAA;EAEsB,cAAA,CAAA,EAAf,cAAe,CAAA,cAAA,CAAA;;UAGxB,cAAA,SAEN,cAfqC,CAAA,OAAA,CAAA,EAgBrC,IAhBqC,CAgBhC,cAhBgC,CAAA,OAgBV,OAhBU,CAAA,EAAA,kBAAA,GAAA,UAAA,CAAA,CAAA;EAAe,UAAA,CAAA,EAiBzC,OAjByC,CAiBjC,yBAjBiC,CAAA;EAa9C;;;EAIa,IAAA,CAAA,EAKd,mBALc,EAAA,GAKU,qBALV,GAAA,KAAA;EAAR,MAAA,CAAA,EAOJ,SAPI,GAOQ,EAPR,CAOW,cAPX,CAAA,KAAA,CAAA,CAAA;EAKN,MAAA,CAAA,EAGE,SAHF,GAGc,EAHd,CAGiB,cAHjB,CAAA,KAAA,CAAA,CAAA;EAAwB;;;;;EAGP,WAAA,CAAA,EAAA,OAAA;;AAVtB,iBAoBY,UAAA,CApBZ,KAAA,EAoB8B,eApB9B,CAAA,EAoB6C,oBAAA,CAAA,GAAA,CAAA,OApB7C"}