@fumadocs/base-ui 16.2.5

package/dist/components/inline-toc.js

@@ -0,0 +1,10 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronDown } from '@fumadocs/ui/icons';
+import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from './ui/collapsible.js';
+import { cn } from '@fumadocs/ui/cn';
+export function InlineTOC({ items, className, ...props }) {
+    return (_jsxs(Collapsible, { ...props, className: (s) => cn('not-prose rounded-lg border bg-fd-card text-fd-card-foreground', typeof className === 'function' ? className(s) : className), children: [_jsxs(CollapsibleTrigger, { className: "group inline-flex w-full items-center justify-between px-4 py-2.5 font-medium", children: [props.children ?? 'Table of Contents', _jsx(ChevronDown, { className: "size-4 transition-transform duration-200 group-data-[open]:rotate-180" })] }), _jsx(CollapsibleContent, { children: _jsx("div", { className: "flex flex-col p-4 pt-0 text-sm text-fd-muted-foreground", children: items.map((item) => (_jsx("a", { href: item.url, className: "border-s py-1.5 hover:text-fd-accent-foreground", style: {
+                            paddingInlineStart: 12 * Math.max(item.depth - 1, 0),
+                        }, children: item.title }, item.url))) }) })] }));
+}

package/dist/components/sidebar/base.d.ts

@@ -0,0 +1,72 @@
+import { type ComponentProps, type PointerEvent, type ReactNode, type RefObject } from 'react';
+import { type LinkProps } from 'fumadocs-core/link';
+import { type ScrollAreaProps } from '../../components/ui/scroll-area.js';
+import { type CollapsibleContentProps, type CollapsibleTriggerProps } from '../../components/ui/collapsible.js';
+interface SidebarContext {
+    open: boolean;
+    setOpen: React.Dispatch<React.SetStateAction<boolean>>;
+    collapsed: boolean;
+    setCollapsed: React.Dispatch<React.SetStateAction<boolean>>;
+    /**
+     * When set to false, don't close the sidebar when navigate to another page
+     */
+    closeOnRedirect: RefObject<boolean>;
+    defaultOpenLevel: number;
+    prefetch: boolean;
+    mode: Mode;
+}
+export interface SidebarProviderProps {
+    /**
+     * Open folders by default if their level is lower or equal to a specific level
+     * (Starting from 1)
+     *
+     * @defaultValue 0
+     */
+    defaultOpenLevel?: number;
+    /**
+     * Prefetch links
+     *
+     * @defaultValue true
+     */
+    prefetch?: boolean;
+    children?: ReactNode;
+}
+type Mode = 'drawer' | 'full';
+declare const SidebarContext: import("react").Context<SidebarContext | null>;
+export declare function SidebarProvider({ defaultOpenLevel, prefetch, children, }: SidebarProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useSidebar(): SidebarContext;
+export declare function useFolder(): {
+    open: boolean;
+    setOpen: React.Dispatch<React.SetStateAction<boolean>>;
+    depth: number;
+    collapsible: boolean;
+} | null;
+export declare function useFolderDepth(): number;
+export declare function SidebarContent({ children, }: {
+    children: (state: {
+        ref: RefObject<HTMLElement | null>;
+        collapsed: boolean;
+        hovered: boolean;
+        onPointerEnter: (event: PointerEvent) => void;
+        onPointerLeave: (event: PointerEvent) => void;
+    }) => ReactNode;
+}): ReactNode;
+export declare function SidebarDrawerOverlay(props: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element | undefined;
+export declare function SidebarDrawerContent({ className, children, ...props }: ComponentProps<'aside'>): import("react/jsx-runtime").JSX.Element | undefined;
+export declare function SidebarViewport({ className, ...props }: ScrollAreaProps): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarSeparator(props: ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarItem({ icon, children, ...props }: LinkProps & {
+    icon?: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarFolder({ defaultOpen: defaultOpenProp, collapsible, active, children, ...props }: ComponentProps<'div'> & {
+    active?: boolean;
+    defaultOpen?: boolean;
+    collapsible?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarFolderTrigger({ children, ...props }: CollapsibleTriggerProps): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarFolderLink({ children, ...props }: LinkProps): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarFolderContent(props: CollapsibleContentProps): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarTrigger({ children, ...props }: ComponentProps<'button'>): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarCollapseTrigger(props: ComponentProps<'button'>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=base.d.ts.map

package/dist/components/sidebar/base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/base.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AACf,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAG1D,OAAO,EAEL,KAAK,eAAe,EAErB,MAAM,6BAA6B,CAAC;AAErC,OAAO,EAGL,KAAK,uBAAuB,EAE5B,KAAK,uBAAuB,EAC7B,MAAM,6BAA6B,CAAC;AAMrC,UAAU,cAAc;IACtB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACvD,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IAE5D;;OAEG;IACH,eAAe,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IACpC,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,IAAI,CAAC;CACZ;AAED,MAAM,WAAW,oBAAoB;IACnC;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,KAAK,IAAI,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE9B,QAAA,MAAM,cAAc,gDAA6C,CAAC;AASlE,wBAAgB,eAAe,CAAC,EAC9B,gBAAoB,EACpB,QAAe,EACf,QAAQ,GACT,EAAE,oBAAoB,2CAiCtB;AAED,wBAAgB,UAAU,IAAI,cAAc,CAQ3C;AAED,wBAAgB,SAAS;UAvDjB,OAAO;aACJ,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;WAC/C,MAAM;iBACA,OAAO;SAsDrB;AAED,wBAAgB,cAAc,WAE7B;AAED,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,CAAC,KAAK,EAAE;QAChB,GAAG,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;QACnC,SAAS,EAAE,OAAO,CAAC;QACnB,OAAO,EAAE,OAAO,CAAC;QACjB,cAAc,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;QAC9C,cAAc,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;KAC/C,KAAK,SAAS,CAAC;CACjB,aA6CA;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,uDAgBhE;AAED,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,CAAC,uDAmBzB;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAwBvE;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,2CAc1D;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,SAAS,GAAG;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,2CAeA;AAED,wBAAgB,aAAa,CAAC,EAC5B,WAAW,EAAE,eAAe,EAC5B,WAAkB,EAClB,MAAc,EACd,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG;IACzB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,2CA8BA;AAED,wBAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAgBzB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,2CAuClE;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAElE;AAED,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,QAAQ,CAAC,2CAY1B;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,2CAgBrE"}

package/dist/components/sidebar/base.js

@@ -0,0 +1,197 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronDown, ExternalLink } from '@fumadocs/ui/icons';
+import { createContext, use, useEffect, useMemo, useRef, useState, } from 'react';
+import Link from 'fumadocs-core/link';
+import { useOnChange } from 'fumadocs-core/utils/use-on-change';
+import { cn } from '@fumadocs/ui/cn';
+import { ScrollArea, ScrollViewport, } from '../../components/ui/scroll-area.js';
+import { isActive } from '@fumadocs/ui/urls';
+import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from '../../components/ui/collapsible.js';
+import { useMediaQuery } from 'fumadocs-core/utils/use-media-query';
+import scrollIntoView from 'scroll-into-view-if-needed';
+import { usePathname } from 'fumadocs-core/framework';
+import ReactDOM from 'react-dom';
+const SidebarContext = createContext(null);
+const FolderContext = createContext(null);
+export function SidebarProvider({ defaultOpenLevel = 0, prefetch = true, children, }) {
+    const closeOnRedirect = useRef(true);
+    const [open, setOpen] = useState(false);
+    const [collapsed, setCollapsed] = useState(false);
+    const pathname = usePathname();
+    const mode = useMediaQuery('(width < 768px)') ? 'drawer' : 'full';
+    useOnChange(pathname, () => {
+        if (closeOnRedirect.current) {
+            setOpen(false);
+        }
+        closeOnRedirect.current = true;
+    });
+    return (_jsx(SidebarContext, { value: useMemo(() => ({
+            open,
+            setOpen,
+            collapsed,
+            setCollapsed,
+            closeOnRedirect,
+            defaultOpenLevel,
+            prefetch,
+            mode,
+        }), [open, collapsed, defaultOpenLevel, prefetch, mode]), children: children }));
+}
+export function useSidebar() {
+    const ctx = use(SidebarContext);
+    if (!ctx)
+        throw new Error('Missing SidebarContext, make sure you have wrapped the component in <DocsLayout /> and the context is available.');
+    return ctx;
+}
+export function useFolder() {
+    return use(FolderContext);
+}
+export function useFolderDepth() {
+    return use(FolderContext)?.depth ?? 0;
+}
+export function SidebarContent({ children, }) {
+    const { collapsed, mode } = useSidebar();
+    const [hover, setHover] = useState(false);
+    const ref = useRef(null);
+    const timerRef = useRef(0);
+    useOnChange(collapsed, () => {
+        if (collapsed)
+            setHover(false);
+    });
+    if (mode !== 'full')
+        return;
+    function shouldIgnoreHover(e) {
+        const element = ref.current;
+        if (!element)
+            return true;
+        return (!collapsed ||
+            e.pointerType === 'touch' ||
+            element.getAnimations().length > 0);
+    }
+    return children({
+        ref,
+        collapsed,
+        hovered: hover,
+        onPointerEnter(e) {
+            if (shouldIgnoreHover(e))
+                return;
+            window.clearTimeout(timerRef.current);
+            setHover(true);
+        },
+        onPointerLeave(e) {
+            if (shouldIgnoreHover(e))
+                return;
+            window.clearTimeout(timerRef.current);
+            timerRef.current = window.setTimeout(() => setHover(false), 
+            // if mouse is leaving the viewport, add a close delay
+            Math.min(e.clientX, document.body.clientWidth - e.clientX) > 100
+                ? 0
+                : 500);
+        },
+    });
+}
+export function SidebarDrawerOverlay(props) {
+    const { open, setOpen, mode } = useSidebar();
+    const [hidden, setHidden] = useState(!open);
+    if (open && hidden)
+        setHidden(false);
+    if (mode !== 'drawer' || hidden)
+        return;
+    return (_jsx("div", { "data-state": open ? 'open' : 'closed', onClick: () => setOpen(false), onAnimationEnd: () => {
+            if (!open)
+                ReactDOM.flushSync(() => setHidden(true));
+        }, ...props }));
+}
+export function SidebarDrawerContent({ className, children, ...props }) {
+    const { open, mode } = useSidebar();
+    const [hidden, setHidden] = useState(!open);
+    if (open && hidden)
+        setHidden(false);
+    if (mode !== 'drawer')
+        return;
+    return (_jsx("aside", { id: "nd-sidebar-mobile", "data-state": open ? 'open' : 'closed', className: cn(hidden && 'invisible', className), onAnimationEnd: () => {
+            if (!open)
+                ReactDOM.flushSync(() => setHidden(true));
+        }, ...props, children: children }));
+}
+export function SidebarViewport({ className, ...props }) {
+    return (_jsx(ScrollArea, { className: (s) => cn('min-h-0 flex-1', typeof className === 'function' ? className(s) : className), ...props, children: _jsx(ScrollViewport, { className: "p-4 overscroll-contain", style: {
+                maskImage: 'linear-gradient(to bottom, transparent, white 12px, white calc(100% - 12px), transparent)',
+            }, children: props.children }) }));
+}
+export function SidebarSeparator(props) {
+    const depth = useFolderDepth();
+    return (_jsx("p", { ...props, className: cn('inline-flex items-center gap-2 mb-1.5 px-2 mt-6 empty:mb-0', depth === 0 && 'first:mt-0', props.className), children: props.children }));
+}
+export function SidebarItem({ icon, children, ...props }) {
+    const pathname = usePathname();
+    const ref = useRef(null);
+    const { prefetch } = useSidebar();
+    const active = props.href !== undefined && isActive(props.href, pathname, false);
+    useAutoScroll(active, ref);
+    return (_jsxs(Link, { ref: ref, "data-active": active, prefetch: prefetch, ...props, children: [icon ?? (props.external ? _jsx(ExternalLink, {}) : null), children] }));
+}
+export function SidebarFolder({ defaultOpen: defaultOpenProp, collapsible = true, active = false, children, ...props }) {
+    const { defaultOpenLevel } = useSidebar();
+    const depth = useFolderDepth() + 1;
+    const defaultOpen = collapsible === false ||
+        active ||
+        (defaultOpenProp ?? defaultOpenLevel >= depth);
+    const [open, setOpen] = useState(defaultOpen);
+    useOnChange(defaultOpen, (v) => {
+        if (v)
+            setOpen(v);
+    });
+    return (_jsx(Collapsible, { open: open, onOpenChange: setOpen, disabled: !collapsible, ...props, children: _jsx(FolderContext, { value: useMemo(() => ({ open, setOpen, depth, collapsible }), [collapsible, depth, open]), children: children }) }));
+}
+export function SidebarFolderTrigger({ children, ...props }) {
+    const { open, collapsible } = use(FolderContext);
+    if (collapsible) {
+        return (_jsxs(CollapsibleTrigger, { ...props, children: [children, _jsx(ChevronDown, { "data-icon": true, className: cn('ms-auto transition-transform', !open && '-rotate-90') })] }));
+    }
+    return _jsx("div", { ...props, children: children });
+}
+export function SidebarFolderLink({ children, ...props }) {
+    const ref = useRef(null);
+    const { open, setOpen, collapsible } = use(FolderContext);
+    const { prefetch } = useSidebar();
+    const pathname = usePathname();
+    const active = props.href !== undefined && isActive(props.href, pathname, false);
+    useAutoScroll(active, ref);
+    return (_jsxs(Link, { ref: ref, "data-active": active, onClick: (e) => {
+            if (!collapsible)
+                return;
+            if (e.target instanceof Element &&
+                e.target.matches('[data-icon], [data-icon] *')) {
+                setOpen(!open);
+                e.preventDefault();
+            }
+            else {
+                setOpen(active ? !open : true);
+            }
+        }, prefetch: prefetch, ...props, children: [children, collapsible && (_jsx(ChevronDown, { "data-icon": true, className: cn('ms-auto transition-transform', !open && '-rotate-90') }))] }));
+}
+export function SidebarFolderContent(props) {
+    return _jsx(CollapsibleContent, { ...props, children: props.children });
+}
+export function SidebarTrigger({ children, ...props }) {
+    const { setOpen } = useSidebar();
+    return (_jsx("button", { "aria-label": "Open Sidebar", onClick: () => setOpen((prev) => !prev), ...props, children: children }));
+}
+export function SidebarCollapseTrigger(props) {
+    const { collapsed, setCollapsed } = useSidebar();
+    return (_jsx("button", { type: "button", "aria-label": "Collapse Sidebar", "data-collapsed": collapsed, onClick: () => {
+            setCollapsed((prev) => !prev);
+        }, ...props, children: props.children }));
+}
+function useAutoScroll(active, ref) {
+    const { mode } = useSidebar();
+    useEffect(() => {
+        if (active && ref.current) {
+            scrollIntoView(ref.current, {
+                boundary: document.getElementById(mode === 'drawer' ? 'nd-sidebar-mobile' : 'nd-sidebar'),
+                scrollMode: 'if-needed',
+            });
+        }
+    }, [active, mode, ref]);
+}

package/dist/components/sidebar/link-item.d.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes } from 'react';
+import type * as Base from './base.js';
+import type { LinkItemType } from '@fumadocs/ui/link-item';
+type InternalComponents = Pick<typeof Base, 'SidebarFolder' | 'SidebarFolderLink' | 'SidebarFolderContent' | 'SidebarFolderTrigger' | 'SidebarItem'>;
+export declare function createLinkItemRenderer({ SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarItem, }: InternalComponents): ({ item, ...props }: HTMLAttributes<HTMLElement> & {
+    item: Exclude<LinkItemType, {
+        type: "icon";
+    }>;
+}) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=link-item.d.ts.map

package/dist/components/sidebar/link-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-item.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/link-item.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,KAAK,KAAK,IAAI,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAE3D,KAAK,kBAAkB,GAAG,IAAI,CAC5B,OAAO,IAAI,EACT,eAAe,GACf,mBAAmB,GACnB,sBAAsB,GACtB,sBAAsB,GACtB,aAAa,CAChB,CAAC;AAEF,wBAAgB,sBAAsB,CAAC,EACrC,aAAa,EACb,oBAAoB,EACpB,iBAAiB,EACjB,oBAAoB,EACpB,WAAW,GACZ,EAAE,kBAAkB,IAIa,oBAG7B,cAAc,CAAC,WAAW,CAAC,GAAG;IAC/B,IAAI,EAAE,OAAO,CAAC,YAAY,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CAC/C,6CAoCF"}

package/dist/components/sidebar/link-item.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function createLinkItemRenderer({ SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarItem, }) {
+    /**
+     * Render sidebar items from page tree
+     */
+    return function SidebarLinkItem({ item, ...props }) {
+        if (item.type === 'custom')
+            return _jsx("div", { ...props, children: item.children });
+        if (item.type === 'menu')
+            return (_jsxs(SidebarFolder, { ...props, children: [item.url ? (_jsxs(SidebarFolderLink, { href: item.url, external: item.external, children: [item.icon, item.text] })) : (_jsxs(SidebarFolderTrigger, { children: [item.icon, item.text] })), _jsx(SidebarFolderContent, { children: item.items.map((child, i) => (_jsx(SidebarLinkItem, { item: child }, i))) })] }));
+        return (_jsx(SidebarItem, { href: item.url, icon: item.icon, external: item.external, ...props, children: item.text }));
+    };
+}

package/dist/components/sidebar/page-tree.d.ts

@@ -0,0 +1,19 @@
+import { type FC, type ReactNode } from 'react';
+import type * as PageTree from 'fumadocs-core/page-tree';
+import type * as Base from './base.js';
+export interface SidebarPageTreeComponents {
+    Item: FC<{
+        item: PageTree.Item;
+    }>;
+    Folder: FC<{
+        item: PageTree.Folder;
+        children: ReactNode;
+    }>;
+    Separator: FC<{
+        item: PageTree.Separator;
+    }>;
+}
+type InternalComponents = Pick<typeof Base, 'SidebarSeparator' | 'SidebarFolder' | 'SidebarFolderLink' | 'SidebarFolderContent' | 'SidebarFolderTrigger' | 'SidebarItem'>;
+export declare function createPageTreeRenderer({ SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarSeparator, SidebarItem, }: InternalComponents): (components: Partial<SidebarPageTreeComponents>) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=page-tree.d.ts.map

package/dist/components/sidebar/page-tree.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-tree.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/page-tree.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,EAAE,KAAK,SAAS,EAAqB,MAAM,OAAO,CAAC;AACnE,OAAO,KAAK,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACzD,OAAO,KAAK,KAAK,IAAI,MAAM,QAAQ,CAAC;AAEpC,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,EAAE,CAAC;QAAE,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAA;KAAE,CAAC,CAAC;IAClC,MAAM,EAAE,EAAE,CAAC;QAAE,IAAI,EAAE,QAAQ,CAAC,MAAM,CAAC;QAAC,QAAQ,EAAE,SAAS,CAAA;KAAE,CAAC,CAAC;IAC3D,SAAS,EAAE,EAAE,CAAC;QAAE,IAAI,EAAE,QAAQ,CAAC,SAAS,CAAA;KAAE,CAAC,CAAC;CAC7C;AAED,KAAK,kBAAkB,GAAG,IAAI,CAC5B,OAAO,IAAI,EACT,kBAAkB,GAClB,eAAe,GACf,mBAAmB,GACnB,sBAAsB,GACtB,sBAAsB,GACtB,aAAa,CAChB,CAAC;AAEF,wBAAgB,sBAAsB,CAAC,EACrC,aAAa,EACb,oBAAoB,EACpB,iBAAiB,EACjB,oBAAoB,EACpB,gBAAgB,EAChB,WAAW,GACZ,EAAE,kBAAkB,IAuCjB,YAAY,OAAO,CAAC,yBAAyB,CAAC,6CA6CjD"}

package/dist/components/sidebar/page-tree.js

@@ -0,0 +1,34 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { useTreeContext, useTreePath } from '../../contexts/tree.js';
+import { useMemo, Fragment } from 'react';
+export function createPageTreeRenderer({ SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarSeparator, SidebarItem, }) {
+    function PageTreeFolder({ item, children, }) {
+        const path = useTreePath();
+        return (_jsxs(SidebarFolder, { collapsible: item.collapsible, active: path.includes(item), defaultOpen: item.defaultOpen, children: [item.index ? (_jsxs(SidebarFolderLink, { href: item.index.url, external: item.index.external, children: [item.icon, item.name] })) : (_jsxs(SidebarFolderTrigger, { children: [item.icon, item.name] })), _jsx(SidebarFolderContent, { children: children })] }));
+    }
+    /**
+     * Render sidebar items from page tree
+     */
+    return function SidebarPageTree(components) {
+        const { root } = useTreeContext();
+        const { Separator, Item, Folder = PageTreeFolder } = components;
+        return useMemo(() => {
+            function renderSidebarList(items) {
+                return items.map((item, i) => {
+                    if (item.type === 'separator') {
+                        if (Separator)
+                            return _jsx(Separator, { item: item }, i);
+                        return (_jsxs(SidebarSeparator, { children: [item.icon, item.name] }, i));
+                    }
+                    if (item.type === 'folder') {
+                        return (_jsx(Folder, { item: item, children: renderSidebarList(item.children) }, i));
+                    }
+                    if (Item)
+                        return _jsx(Item, { item: item }, item.url);
+                    return (_jsx(SidebarItem, { href: item.url, external: item.external, icon: item.icon, children: item.name }, item.url));
+                });
+            }
+            return (_jsx(Fragment, { children: renderSidebarList(root.children) }, root.$id));
+        }, [Folder, Item, Separator, root]);
+    };
+}

package/dist/components/sidebar/tabs/dropdown.d.ts

@@ -0,0 +1,11 @@
+import { type ComponentProps, type ReactNode } from 'react';
+import type { SidebarTab } from './index.js';
+export interface SidebarTabWithProps extends SidebarTab {
+    props?: ComponentProps<'a'>;
+}
+export declare function SidebarTabsDropdown({ options, placeholder, ...props }: {
+    placeholder?: ReactNode;
+    options: SidebarTabWithProps[];
+} & ComponentProps<'button'>): import("react/jsx-runtime").JSX.Element;
+export declare function isTabActive(tab: SidebarTab, pathname: string): boolean;
+//# sourceMappingURL=dropdown.d.ts.map

package/dist/components/sidebar/tabs/dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/sidebar/tabs/dropdown.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAqB,MAAM,OAAO,CAAC;AAW/E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,GAAG,CAAC;AAEpC,MAAM,WAAW,mBAAoB,SAAQ,UAAU;IACrD,KAAK,CAAC,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC;CAC7B;AAED,wBAAgB,mBAAmB,CAAC,EAClC,OAAO,EACP,WAAW,EACX,GAAG,KAAK,EACT,EAAE;IACD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,OAAO,EAAE,mBAAmB,EAAE,CAAC;CAChC,GAAG,cAAc,CAAC,QAAQ,CAAC,2CAkF3B;AAED,wBAAgB,WAAW,CAAC,GAAG,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,WAI5D"}

package/dist/components/sidebar/tabs/dropdown.js

@@ -0,0 +1,34 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Check, ChevronsUpDown } from '@fumadocs/ui/icons';
+import { useMemo, useState } from 'react';
+import Link from 'fumadocs-core/link';
+import { usePathname } from 'fumadocs-core/framework';
+import { cn } from '@fumadocs/ui/cn';
+import { normalize, isActive } from '@fumadocs/ui/urls';
+import { useSidebar } from '../../../components/sidebar/base.js';
+import { Popover, PopoverContent, PopoverTrigger, } from '../../../components/ui/popover.js';
+export function SidebarTabsDropdown({ options, placeholder, ...props }) {
+    const [open, setOpen] = useState(false);
+    const { closeOnRedirect } = useSidebar();
+    const pathname = usePathname();
+    const selected = useMemo(() => {
+        return options.findLast((item) => isTabActive(item, pathname));
+    }, [options, pathname]);
+    const onClick = () => {
+        closeOnRedirect.current = false;
+        setOpen(false);
+    };
+    const item = selected ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "size-9 shrink-0 empty:hidden md:size-5", children: selected.icon }), _jsxs("div", { children: [_jsx("p", { className: "text-sm font-medium", children: selected.title }), _jsx("p", { className: "text-sm text-fd-muted-foreground empty:hidden md:hidden", children: selected.description })] })] })) : (placeholder);
+    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [item && (_jsxs(PopoverTrigger, { ...props, className: cn('flex items-center gap-2 rounded-lg p-2 border bg-fd-secondary/50 text-start text-fd-secondary-foreground transition-colors hover:bg-fd-accent data-[open]:bg-fd-accent data-[open]:text-fd-accent-foreground', props.className), children: [item, _jsx(ChevronsUpDown, { className: "shrink-0 ms-auto size-4 text-fd-muted-foreground" })] })), _jsx(PopoverContent, { className: "flex flex-col gap-1 w-(--anchor-width) p-1 fd-scroll-container", children: options.map((item) => {
+                    const isActive = selected && item.url === selected.url;
+                    if (!isActive && item.unlisted)
+                        return;
+                    return (_jsxs(Link, { href: item.url, onClick: onClick, ...item.props, className: cn('flex items-center gap-2 rounded-lg p-1.5 hover:bg-fd-accent hover:text-fd-accent-foreground', item.props?.className), children: [_jsx("div", { className: "shrink-0 size-9 md:mt-1 md:mb-auto md:size-5 empty:hidden", children: item.icon }), _jsxs("div", { children: [_jsx("p", { className: "text-sm font-medium", children: item.title }), _jsx("p", { className: "text-[0.8125rem] text-fd-muted-foreground empty:hidden", children: item.description })] }), _jsx(Check, { className: cn('shrink-0 ms-auto size-3.5 text-fd-primary', !isActive && 'invisible') })] }, item.url));
+                }) })] }));
+}
+export function isTabActive(tab, pathname) {
+    if (tab.urls)
+        return tab.urls.has(normalize(pathname));
+    return isActive(tab.url, pathname, true);
+}

package/dist/components/sidebar/tabs/index.d.ts

@@ -0,0 +1,21 @@
+import type * as PageTree from 'fumadocs-core/page-tree';
+import type { ReactNode } from 'react';
+export interface SidebarTab {
+    /**
+     * Redirect URL of the folder, usually the index page
+     */
+    url: string;
+    icon?: ReactNode;
+    title: ReactNode;
+    description?: ReactNode;
+    /**
+     * Detect from a list of urls
+     */
+    urls?: Set<string>;
+    unlisted?: boolean;
+}
+export interface GetSidebarTabsOptions {
+    transform?: (option: SidebarTab, node: PageTree.Folder) => SidebarTab | null;
+}
+export declare function getSidebarTabs(tree: PageTree.Root, { transform }?: GetSidebarTabsOptions): SidebarTab[];
+//# sourceMappingURL=index.d.ts.map

package/dist/components/sidebar/tabs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/sidebar/tabs/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,UAAU;IACzB;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,qBAAqB;IACpC,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,CAAC,MAAM,KAAK,UAAU,GAAG,IAAI,CAAC;CAC9E;AAeD,wBAAgB,cAAc,CAC5B,IAAI,EAAE,QAAQ,CAAC,IAAI,EACnB,EAAE,SAA4B,EAAE,GAAE,qBAA0B,GAC3D,UAAU,EAAE,CAkCd"}

package/dist/components/sidebar/tabs/index.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+const defaultTransform = (option, node) => {
+    if (!node.icon)
+        return option;
+    return {
+        ...option,
+        icon: (_jsx("div", { className: "size-full [&_svg]:size-full max-md:p-1.5 max-md:rounded-md max-md:border max-md:bg-fd-secondary", children: node.icon })),
+    };
+};
+export function getSidebarTabs(tree, { transform = defaultTransform } = {}) {
+    const results = [];
+    function scanOptions(node, unlisted) {
+        if ('root' in node && node.root) {
+            const urls = getFolderUrls(node);
+            if (urls.size > 0) {
+                const option = {
+                    url: urls.values().next().value ?? '',
+                    title: node.name,
+                    icon: node.icon,
+                    unlisted,
+                    description: node.description,
+                    urls,
+                };
+                const mapped = transform ? transform(option, node) : option;
+                if (mapped)
+                    results.push(mapped);
+            }
+        }
+        for (const child of node.children) {
+            if (child.type === 'folder')
+                scanOptions(child, unlisted);
+        }
+    }
+    scanOptions(tree);
+    if (tree.fallback)
+        scanOptions(tree.fallback, true);
+    return results;
+}
+function getFolderUrls(folder, output = new Set()) {
+    if (folder.index)
+        output.add(folder.index.url);
+    for (const child of folder.children) {
+        if (child.type === 'page' && !child.external)
+            output.add(child.url);
+        if (child.type === 'folder')
+            getFolderUrls(child, output);
+    }
+    return output;
+}

package/dist/components/steps.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from 'react';
+export declare function Steps({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function Step({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=steps.d.ts.map

package/dist/components/steps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"steps.d.ts","sourceRoot":"","sources":["../../src/components/steps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAE1D;AAED,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAEzD"}

package/dist/components/steps.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function Steps({ children }) {
+    return _jsx("div", { className: "fd-steps", children: children });
+}
+export function Step({ children }) {
+    return _jsx("div", { className: "fd-step", children: children });
+}

package/dist/components/tabs.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { type ComponentProps, type ReactNode } from 'react';
+import * as Unstyled from './ui/tabs.js';
+export interface TabsProps extends Omit<ComponentProps<typeof Unstyled.Tabs>, 'value' | 'onValueChange'> {
+    /**
+     * Use simple mode instead of advanced usage as documented in https://radix-ui.com/primitives/docs/components/tabs.
+     */
+    items?: string[];
+    /**
+     * Shortcut for `defaultValue` when `items` is provided.
+     *
+     * @defaultValue 0
+     */
+    defaultIndex?: number;
+    /**
+     * Additional label in tabs list when `items` is provided.
+     */
+    label?: ReactNode;
+}
+export declare const TabsList: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").TabsTabProps & React.RefAttributes<Element>, "ref"> & React.RefAttributes<Element>>;
+export declare function Tabs({ ref, className, items, label, defaultIndex, defaultValue, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element;
+export interface TabProps extends Omit<ComponentProps<typeof Unstyled.TabsContent>, 'value'> {
+    /**
+     * Value of tab, detect from index if unspecified.
+     */
+    value?: string;
+}
+export declare function Tab({ value, ...props }: TabProps): import("react/jsx-runtime").JSX.Element;
+export declare function TabsContent({ value, className, ...props }: ComponentProps<typeof Unstyled.TabsContent>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=tabs.d.ts.map

package/dist/components/tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/components/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,QAAQ,MAAM,WAAW,CAAC;AAItC,MAAM,WAAW,SAAU,SAAQ,IAAI,CACrC,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,EACpC,OAAO,GAAG,eAAe,CAC1B;IACC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IAEjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAaD,eAAO,MAAM,QAAQ,kKAcnB,CAAC;AAGH,eAAO,MAAM,WAAW,mJActB,CAAC;AAGH,wBAAgB,IAAI,CAAC,EACnB,GAAG,EACH,SAAS,EACT,KAAK,EACL,KAAK,EACL,YAAgB,EAChB,YAAmE,EACnE,GAAG,KAAK,EACT,EAAE,SAAS,2CAuCX;AAED,MAAM,WAAW,QAAS,SAAQ,IAAI,CACpC,cAAc,CAAC,OAAO,QAAQ,CAAC,WAAW,CAAC,EAC3C,OAAO,CACR;IACC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,2CAgBhD;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,WAAW,CAAC,2CAgB7C"}

package/dist/components/tabs.js

@@ -0,0 +1,64 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { createContext, useContext, useEffect, useId, useMemo, useState, } from 'react';
+import { cn } from '@fumadocs/ui/cn';
+import * as Unstyled from './ui/tabs.js';
+const TabsContext = createContext(null);
+function useTabContext() {
+    const ctx = useContext(TabsContext);
+    if (!ctx)
+        throw new Error('You must wrap your component in <Tabs>');
+    return ctx;
+}
+export const TabsList = React.forwardRef(({ className, ...props }, ref) => (_jsx(Unstyled.TabsList, { ref: ref, ...props, className: (s) => cn('flex gap-3.5 text-fd-secondary-foreground overflow-x-auto px-4 not-prose', typeof className === 'function' ? className(s) : className) })));
+TabsList.displayName = 'TabsList';
+export const TabsTrigger = React.forwardRef(({ className, ...props }, ref) => (_jsx(Unstyled.TabsTrigger, { ref: ref, ...props, className: (s) => cn('inline-flex items-center gap-2 whitespace-nowrap text-fd-muted-foreground border-b border-transparent py-2 text-sm font-medium transition-colors [&_svg]:size-4 hover:text-fd-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[active]:border-fd-primary data-[active]:text-fd-primary', typeof className === 'function' ? className(s) : className) })));
+TabsTrigger.displayName = 'TabsTrigger';
+export function Tabs({ ref, className, items, label, defaultIndex = 0, defaultValue = items ? escapeValue(items[defaultIndex]) : undefined, ...props }) {
+    const [value, setValue] = useState(defaultValue);
+    const collection = useMemo(() => [], []);
+    return (_jsxs(Unstyled.Tabs, { ref: ref, className: (s) => cn('flex flex-col overflow-hidden rounded-xl border bg-fd-secondary my-4', typeof className === 'function' ? className(s) : className), value: value, onValueChange: (v) => {
+            if (items && !items.some((item) => escapeValue(item) === v))
+                return;
+            setValue(v);
+        }, ...props, children: [items && (_jsxs(TabsList, { children: [label && (_jsx("span", { className: "text-sm font-medium my-auto me-auto", children: label })), items.map((item) => (_jsx(TabsTrigger, { value: escapeValue(item), children: item }, item)))] })), _jsx(TabsContext.Provider, { value: useMemo(() => ({ items, collection }), [collection, items]), children: props.children })] }));
+}
+export function Tab({ value, ...props }) {
+    const { items } = useTabContext();
+    const resolved = value ??
+        // eslint-disable-next-line react-hooks/rules-of-hooks -- `value` is not supposed to change
+        items?.at(useCollectionIndex());
+    if (!resolved)
+        throw new Error('Failed to resolve tab `value`, please pass a `value` prop to the Tab component.');
+    return (_jsx(TabsContent, { value: escapeValue(resolved), ...props, children: props.children }));
+}
+export function TabsContent({ value, className, ...props }) {
+    return (_jsx(Unstyled.TabsContent, { value: value, keepMounted: true, className: (s) => cn('p-4 text-[0.9375rem] bg-fd-background rounded-xl outline-none prose-no-margin data-[inactive]:hidden [&>figure:only-child]:-m-4 [&>figure:only-child]:border-none', typeof className === 'function' ? className(s) : className), ...props, children: props.children }));
+}
+/**
+ * Inspired by Headless UI.
+ *
+ * Return the index of children, this is made possible by registering the order of render from children using React context.
+ * This is supposed by work with pre-rendering & pure client-side rendering.
+ */
+function useCollectionIndex() {
+    const key = useId();
+    const { collection } = useTabContext();
+    useEffect(() => {
+        return () => {
+            const idx = collection.indexOf(key);
+            if (idx !== -1)
+                collection.splice(idx, 1);
+        };
+    }, [key, collection]);
+    if (!collection.includes(key))
+        collection.push(key);
+    return collection.indexOf(key);
+}
+/**
+ * only escape whitespaces in values in simple mode
+ */
+function escapeValue(v) {
+    return v.toLowerCase().replace(/\s/, '-');
+}

package/dist/components/toc/clerk.d.ts

@@ -0,0 +1,2 @@
+export * from '@fumadocs/ui/components/toc/clerk';
+//# sourceMappingURL=clerk.d.ts.map