fumadocs-ui 16.1.0 → 16.2.1

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

@@ -0,0 +1,119 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment, useEffect, useEffectEvent, createContext, useMemo, useRef, useState, use, } from 'react';
+import { ChevronDown, ChevronLeft, ChevronRight } from '../../../icons.js';
+import Link from 'fumadocs-core/link';
+import { cn } from '../../../utils/cn.js';
+import { useI18n } from '../../../contexts/i18n.js';
+import { useTreeContext, useTreePath } from '../../../contexts/tree.js';
+import { usePathname } from 'fumadocs-core/framework';
+import { getBreadcrumbItemsFromPath, } from 'fumadocs-core/breadcrumb';
+import { isActive } from '../../../utils/is-active.js';
+import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from '../../../components/ui/collapsible.js';
+import { useTOCItems } from '../../../components/toc/index.js';
+import { useActiveAnchor } from 'fumadocs-core/toc';
+import { LayoutContext } from '../client.js';
+import { useFooterItems } from '../../../utils/use-footer-items.js';
+const TocPopoverContext = createContext(null);
+export function PageTOCPopover({ className, children, ...rest }) {
+    const ref = useRef(null);
+    const [open, setOpen] = useState(false);
+    const { isNavTransparent } = use(LayoutContext);
+    const onClick = useEffectEvent((e) => {
+        if (!open)
+            return;
+        if (ref.current && !ref.current.contains(e.target))
+            setOpen(false);
+    });
+    useEffect(() => {
+        window.addEventListener('click', onClick);
+        return () => {
+            window.removeEventListener('click', onClick);
+        };
+    }, []);
+    return (_jsx(TocPopoverContext, { value: useMemo(() => ({
+            open,
+            setOpen,
+        }), [setOpen, open]), children: _jsx(Collapsible, { open: open, onOpenChange: setOpen, "data-toc-popover": "", className: cn('sticky top-(--fd-docs-row-2) z-10 [grid-area:toc-popover] h-(--fd-toc-popover-height) xl:hidden max-xl:layout:[--fd-toc-popover-height:--spacing(10)]', className), ...rest, children: _jsx("header", { ref: ref, className: cn('border-b backdrop-blur-sm transition-colors', (!isNavTransparent || open) && 'bg-fd-background/80', open && 'shadow-lg'), children: children }) }) }));
+}
+export function PageTOCPopoverTrigger({ className, ...props }) {
+    const { text } = useI18n();
+    const { open } = use(TocPopoverContext);
+    const items = useTOCItems();
+    const active = useActiveAnchor();
+    const selected = useMemo(() => items.findIndex((item) => active === item.url.slice(1)), [items, active]);
+    const path = useTreePath().at(-1);
+    const showItem = selected !== -1 && !open;
+    return (_jsxs(CollapsibleTrigger, { className: cn('flex w-full h-10 items-center text-sm text-fd-muted-foreground gap-2.5 px-4 py-2.5 text-start focus-visible:outline-none [&_svg]:size-4 md:px-6', className), "data-toc-popover-trigger": "", ...props, children: [_jsx(ProgressCircle, { value: (selected + 1) / Math.max(1, items.length), max: 1, className: cn('shrink-0', open && 'text-fd-primary') }), _jsxs("span", { className: "grid flex-1 *:my-auto *:row-start-1 *:col-start-1", children: [_jsx("span", { className: cn('truncate transition-all', open && 'text-fd-foreground', showItem && 'opacity-0 -translate-y-full pointer-events-none'), children: path?.name ?? text.toc }), _jsx("span", { className: cn('truncate transition-all', !showItem && 'opacity-0 translate-y-full pointer-events-none'), children: items[selected]?.title })] }), _jsx(ChevronDown, { className: cn('shrink-0 transition-transform mx-0.5', open && 'rotate-180') })] }));
+}
+function clamp(input, min, max) {
+    if (input < min)
+        return min;
+    if (input > max)
+        return max;
+    return input;
+}
+function ProgressCircle({ value, strokeWidth = 2, size = 24, min = 0, max = 100, ...restSvgProps }) {
+    const normalizedValue = clamp(value, min, max);
+    const radius = (size - strokeWidth) / 2;
+    const circumference = 2 * Math.PI * radius;
+    const progress = (normalizedValue / max) * circumference;
+    const circleProps = {
+        cx: size / 2,
+        cy: size / 2,
+        r: radius,
+        fill: 'none',
+        strokeWidth,
+    };
+    return (_jsxs("svg", { role: "progressbar", viewBox: `0 0 ${size} ${size}`, "aria-valuenow": normalizedValue, "aria-valuemin": min, "aria-valuemax": max, ...restSvgProps, children: [_jsx("circle", { ...circleProps, className: "stroke-current/25" }), _jsx("circle", { ...circleProps, stroke: "currentColor", strokeDasharray: circumference, strokeDashoffset: circumference - progress, strokeLinecap: "round", transform: `rotate(-90 ${size / 2} ${size / 2})`, className: "transition-all" })] }));
+}
+export function PageTOCPopoverContent(props) {
+    return (_jsx(CollapsibleContent, { "data-toc-popover-content": "", ...props, className: cn('flex flex-col px-4 max-h-[50vh] md:px-6', props.className), children: props.children }));
+}
+export function PageLastUpdate({ date: value, ...props }) {
+    const { text } = useI18n();
+    const [date, setDate] = useState('');
+    useEffect(() => {
+        // to the timezone of client
+        setDate(value.toLocaleDateString());
+    }, [value]);
+    return (_jsxs("p", { ...props, className: cn('text-sm text-fd-muted-foreground', props.className), children: [text.lastUpdate, " ", date] }));
+}
+export function PageFooter({ items, ...props }) {
+    const footerList = useFooterItems();
+    const pathname = usePathname();
+    const { previous, next } = useMemo(() => {
+        if (items)
+            return items;
+        const idx = footerList.findIndex((item) => isActive(item.url, pathname, false));
+        if (idx === -1)
+            return {};
+        return {
+            previous: footerList[idx - 1],
+            next: footerList[idx + 1],
+        };
+    }, [footerList, items, pathname]);
+    return (_jsxs("div", { ...props, className: cn('@container grid gap-4', previous && next ? 'grid-cols-2' : 'grid-cols-1', props.className), children: [previous ? _jsx(FooterItem, { item: previous, index: 0 }) : null, next ? _jsx(FooterItem, { item: next, index: 1 }) : null] }));
+}
+function FooterItem({ item, index }) {
+    const { text } = useI18n();
+    const Icon = index === 0 ? ChevronLeft : ChevronRight;
+    return (_jsxs(Link, { href: item.url, className: cn('flex flex-col gap-2 rounded-lg border p-4 text-sm transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground @max-lg:col-span-full', index === 1 && 'text-end'), children: [_jsxs("div", { className: cn('inline-flex items-center gap-1.5 font-medium', index === 1 && 'flex-row-reverse'), children: [_jsx(Icon, { className: "-mx-1 size-4 shrink-0 rtl:rotate-180" }), _jsx("p", { children: item.name })] }), _jsx("p", { className: "text-fd-muted-foreground truncate", children: item.description ?? (index === 0 ? text.previousPage : text.nextPage) })] }));
+}
+export function PageBreadcrumb({ includeRoot, includeSeparator, includePage, ...props }) {
+    const path = useTreePath();
+    const { root } = useTreeContext();
+    const items = useMemo(() => {
+        return getBreadcrumbItemsFromPath(root, path, {
+            includePage,
+            includeSeparator,
+            includeRoot,
+        });
+    }, [includePage, includeRoot, includeSeparator, path, root]);
+    if (items.length === 0)
+        return null;
+    return (_jsx("div", { ...props, className: cn('flex items-center gap-1.5 text-sm text-fd-muted-foreground', props.className), children: items.map((item, i) => {
+            const className = cn('truncate', i === items.length - 1 && 'text-fd-primary font-medium');
+            return (_jsxs(Fragment, { children: [i !== 0 && _jsx(ChevronRight, { className: "size-3.5 shrink-0" }), item.url ? (_jsx(Link, { href: item.url, className: cn(className, 'transition-opacity hover:opacity-80'), children: item.name })) : (_jsx("span", { className: className, children: item.name }))] }, i));
+        }) }));
+}

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

@@ -0,0 +1,58 @@
+import type { ComponentProps, ReactNode } from 'react';
+import { type BreadcrumbProps, type FooterProps } from './client.js';
+import type { AnchorProviderProps, TOCItemType } from 'fumadocs-core/toc';
+interface BreadcrumbOptions extends BreadcrumbProps {
+    enabled: boolean;
+    component: ReactNode;
+}
+interface FooterOptions extends FooterProps {
+    enabled: boolean;
+    component: ReactNode;
+}
+export interface DocsPageProps {
+    toc?: TOCItemType[];
+    tableOfContent?: Partial<TableOfContentOptions>;
+    tableOfContentPopover?: Partial<TableOfContentPopoverOptions>;
+    /**
+     * Extend the page to fill all available space
+     *
+     * @defaultValue false
+     */
+    full?: boolean;
+    /**
+     * Replace or disable breadcrumb
+     */
+    breadcrumb?: Partial<BreadcrumbOptions>;
+    /**
+     * Footer navigation, you can disable it by passing `false`
+     */
+    footer?: Partial<FooterOptions>;
+    children?: ReactNode;
+}
+type TableOfContentOptions = Pick<AnchorProviderProps, 'single'> & {
+    /**
+     * Custom content in TOC container, before the main TOC
+     */
+    header?: ReactNode;
+    /**
+     * Custom content in TOC container, after the main TOC
+     */
+    footer?: ReactNode;
+    enabled: boolean;
+    component: ReactNode;
+    /**
+     * @defaultValue 'normal'
+     */
+    style?: 'normal' | 'clerk';
+};
+type TableOfContentPopoverOptions = Omit<TableOfContentOptions, 'single'>;
+export declare function DocsPage({ breadcrumb: { enabled: breadcrumbEnabled, component: breadcrumb, ...breadcrumbProps }, footer, full, tableOfContentPopover: { enabled: tocPopoverEnabled, component: tocPopover, ...tocPopoverOptions }, tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions }, toc, children, }: DocsPageProps): ReactNode;
+export declare function EditOnGitHub(props: ComponentProps<'a'>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Add typography styles
+ */
+export declare function DocsBody({ children, className, ...props }: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export declare function DocsDescription({ children, className, ...props }: ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element | null;
+export declare function DocsTitle({ children, className, ...props }: ComponentProps<'h1'>): import("react/jsx-runtime").JSX.Element;
+export { PageLastUpdate, PageBreadcrumb } from './client.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/layouts/notebook/page/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvD,OAAO,EACL,KAAK,eAAe,EACpB,KAAK,WAAW,EAMjB,MAAM,UAAU,CAAC;AAClB,OAAO,KAAK,EAAE,mBAAmB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAK1E,UAAU,iBAAkB,SAAQ,eAAe;IACjD,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,SAAS,CAAC;CACtB;AAED,UAAU,aAAc,SAAQ,WAAW;IACzC,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,SAAS,CAAC;CACtB;AAED,MAAM,WAAW,aAAa;IAC5B,GAAG,CAAC,EAAE,WAAW,EAAE,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC,qBAAqB,CAAC,CAAC;IAChD,qBAAqB,CAAC,EAAE,OAAO,CAAC,4BAA4B,CAAC,CAAC;IAE9D;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAExC;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IAEhC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,KAAK,qBAAqB,GAAG,IAAI,CAAC,mBAAmB,EAAE,QAAQ,CAAC,GAAG;IACjE;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;CAC5B,CAAC;AAEF,KAAK,4BAA4B,GAAG,IAAI,CAAC,qBAAqB,EAAE,QAAQ,CAAC,CAAC;AAE1E,wBAAgB,QAAQ,CAAC,EACvB,UAAU,EAAE,EACV,OAAO,EAAE,iBAAwB,EACjC,SAAS,EAAE,UAAU,EACrB,GAAG,eAAe,EACd,EACN,MAAW,EACX,IAAY,EACZ,qBAAqB,EAAE,EACrB,OAAO,EAAE,iBAAiB,EAC1B,SAAS,EAAE,UAAU,EACrB,GAAG,iBAAiB,EAChB,EACN,cAAc,EAAE,EACd,OAAO,EAAE,UAAU,EACnB,SAAS,EAAE,UAAU,EACrB,GAAG,UAAU,EACT,EACN,GAAQ,EACR,QAAQ,GACT,EAAE,aAAa,aAkFf;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,2CAuBtD;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,2CAMvB;AAED,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,GAAG,CAAC,kDAYrB;AAED,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,IAAI,CAAC,2CAMtB;AAED,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC"}

package/dist/layouts/notebook/page/index.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { cn } from '../../../utils/cn.js';
+import { buttonVariants } from '../../../components/ui/button.js';
+import { Edit, Text } from '../../../icons.js';
+import { I18nLabel } from '../../../contexts/i18n.js';
+import { PageBreadcrumb, PageFooter, PageTOCPopover, PageTOCPopoverContent, PageTOCPopoverTrigger, } from './client.js';
+import * as TocDefault from '../../../components/toc/default.js';
+import * as TocClerk from '../../../components/toc/clerk.js';
+import { TOCProvider, TOCScrollArea } from '../../../components/toc/index.js';
+export function DocsPage({ breadcrumb: { enabled: breadcrumbEnabled = true, component: breadcrumb, ...breadcrumbProps } = {}, footer = {}, full = false, tableOfContentPopover: { enabled: tocPopoverEnabled, component: tocPopover, ...tocPopoverOptions } = {}, tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions } = {}, toc = [], children, }) {
+    // disable TOC on full mode, you can still enable it with `enabled` option.
+    tocEnabled ?? (tocEnabled = !full &&
+        (toc.length > 0 ||
+            tocOptions.footer !== undefined ||
+            tocOptions.header !== undefined));
+    tocPopoverEnabled ?? (tocPopoverEnabled = toc.length > 0 ||
+        tocPopoverOptions.header !== undefined ||
+        tocPopoverOptions.footer !== undefined);
+    let wrapper = (children) => children;
+    if (tocEnabled || tocPopoverEnabled) {
+        wrapper = (children) => (_jsx(TOCProvider, { single: tocOptions.single, toc: toc, children: children }));
+    }
+    return wrapper(_jsxs(_Fragment, { children: [tocPopoverEnabled &&
+                (tocPopover ?? (_jsxs(PageTOCPopover, { children: [_jsx(PageTOCPopoverTrigger, {}), _jsxs(PageTOCPopoverContent, { children: [tocPopoverOptions.header, _jsx(TOCScrollArea, { children: tocPopoverOptions.style === 'clerk' ? (_jsx(TocClerk.TOCItems, {})) : (_jsx(TocDefault.TOCItems, {})) }), tocPopoverOptions.footer] })] }))), _jsxs("article", { id: "nd-page", "data-full": full, className: cn('flex flex-col [grid-area:main] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14 *:max-w-[900px]', full && '*:max-w-[1285px]'), children: [breadcrumbEnabled &&
+                        (breadcrumb ?? _jsx(PageBreadcrumb, { ...breadcrumbProps })), children, footer.enabled !== false &&
+                        (footer.component ?? _jsx(PageFooter, { items: footer.items }))] }), tocEnabled &&
+                (tocReplace ?? (_jsxs("div", { id: "nd-toc", className: "sticky top-(--fd-docs-row-3) [grid-area:toc] h-[calc(var(--fd-docs-height)-var(--fd-docs-row-3))] flex flex-col w-(--fd-toc-width) pt-12 pe-4 pb-2 xl:layout:[--fd-toc-width:268px] max-xl:hidden", children: [tocOptions.header, _jsxs("h3", { id: "toc-title", className: "inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground", children: [_jsx(Text, { className: "size-4" }), _jsx(I18nLabel, { label: "toc" })] }), _jsx(TOCScrollArea, { children: tocOptions.style === 'clerk' ? (_jsx(TocClerk.TOCItems, {})) : (_jsx(TocDefault.TOCItems, {})) }), tocOptions.footer] })))] }));
+}
+export function EditOnGitHub(props) {
+    return (_jsx("a", { target: "_blank", rel: "noreferrer noopener", ...props, className: cn(buttonVariants({
+            color: 'secondary',
+            size: 'sm',
+            className: 'gap-1.5 not-prose',
+        }), props.className), children: props.children ?? (_jsxs(_Fragment, { children: [_jsx(Edit, { className: "size-3.5" }), _jsx(I18nLabel, { label: "editOnGithub" })] })) }));
+}
+/**
+ * Add typography styles
+ */
+export function DocsBody({ children, className, ...props }) {
+    return (_jsx("div", { ...props, className: cn('prose flex-1', className), children: children }));
+}
+export function DocsDescription({ children, className, ...props }) {
+    // Don't render if no description provided
+    if (children === undefined)
+        return null;
+    return (_jsx("p", { ...props, className: cn('mb-8 text-lg text-fd-muted-foreground', className), children: children }));
+}
+export function DocsTitle({ children, className, ...props }) {
+    return (_jsx("h1", { ...props, className: cn('text-[1.75em] font-semibold', className), children: children }));
+}
+export { PageLastUpdate, PageBreadcrumb } from './client.js';

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

@@ -0,0 +1,17 @@
+import * as Base from '../../components/sidebar/base.js';
+import { type ComponentProps } from 'react';
+export declare const Sidebar: typeof Base.SidebarProvider, SidebarFolder: typeof Base.SidebarFolder, SidebarCollapseTrigger: typeof Base.SidebarCollapseTrigger, SidebarViewport: typeof Base.SidebarViewport, SidebarTrigger: typeof Base.SidebarTrigger;
+export declare function SidebarContent({ ref: refProp, className, children, ...props }: ComponentProps<'aside'>): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarDrawer({ children, className, ...props }: ComponentProps<typeof Base.SidebarDrawerContent>): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarSeparator({ className, style, children, ...props }: ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarItem({ className, style, children, ...props }: ComponentProps<typeof Base.SidebarItem>): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarFolderTrigger({ className, style, ...props }: ComponentProps<typeof Base.SidebarFolderTrigger>): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarFolderLink({ className, style, ...props }: ComponentProps<typeof Base.SidebarFolderLink>): import("react/jsx-runtime").JSX.Element;
+export declare function SidebarFolderContent({ className, children, ...props }: ComponentProps<typeof Base.SidebarFolderContent>): import("react/jsx-runtime").JSX.Element;
+export declare const SidebarPageTree: (components: Partial<import("../../components/sidebar/page-tree.js").SidebarPageTreeComponents>) => import("react/jsx-runtime").JSX.Element;
+export declare const SidebarLinkItem: ({ item, ...props }: import("react").HTMLAttributes<HTMLElement> & {
+    item: Exclude<import("../shared/index.js").LinkItemType, {
+        type: "icon";
+    }>;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=sidebar.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../src/layouts/notebook/sidebar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,IAAI,MAAM,2BAA2B,CAAC;AAElD,OAAO,EAAE,KAAK,cAAc,EAAe,MAAM,OAAO,CAAC;AAyBzD,eAAO,MACY,OAAO,+BACxB,aAAa,6BACb,sBAAsB,sCACtB,eAAe,+BACf,cAAc,4BACR,CAAC;AAET,wBAAgB,cAAc,CAAC,EAC7B,GAAG,EAAE,OAAO,EACZ,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,CAAC,2CAgDzB;AAED,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,oBAAoB,CAAC,2CAelD;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,GAAG,CAAC,2CAerB;AAED,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,WAAW,CAAC,2CAkBzC;AAED,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,oBAAoB,CAAC,2CAelD;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,iBAAiB,CAAC,2CAmB/C;AAED,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,oBAAoB,CAAC,2CAgBlD;AACD,eAAO,MAAM,eAAe,sIAO1B,CAAC;AAEH,eAAO,MAAM,eAAe;;;;6CAM1B,CAAC"}

package/dist/layouts/notebook/sidebar.js

@@ -0,0 +1,90 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import * as Base from '../../components/sidebar/base.js';
+import { cn } from '../../utils/cn.js';
+import { use, useRef } from 'react';
+import { cva } from 'class-variance-authority';
+import { LayoutContext } from './client.js';
+import { createPageTreeRenderer } from '../../components/sidebar/page-tree.js';
+import { createLinkItemRenderer } from '../../components/sidebar/link-item.js';
+import { mergeRefs } from '../../utils/merge-refs.js';
+const itemVariants = cva('relative flex flex-row items-center gap-2 rounded-lg p-2 text-start text-fd-muted-foreground wrap-anywhere transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none [&_svg]:size-4 [&_svg]:shrink-0', {
+    variants: {
+        variant: {
+            link: 'data-[active=true]:bg-fd-primary/10 data-[active=true]:text-fd-primary data-[active=true]:hover:transition-colors',
+        },
+        highlight: {
+            true: "data-[active=true]:before:content-[''] data-[active=true]:before:bg-fd-primary data-[active=true]:before:absolute data-[active=true]:before:w-px data-[active=true]:before:inset-y-2.5 data-[active=true]:before:start-2.5",
+        },
+    },
+});
+function getItemOffset(depth) {
+    return `calc(${2 + 3 * depth} * var(--spacing))`;
+}
+export const { SidebarProvider: Sidebar, SidebarFolder, SidebarCollapseTrigger, SidebarViewport, SidebarTrigger, } = Base;
+export function SidebarContent({ ref: refProp, className, children, ...props }) {
+    const { navMode } = use(LayoutContext);
+    const ref = useRef(null);
+    return (_jsx(Base.SidebarContent, { children: ({ collapsed, hovered, ref: asideRef, ...rest }) => (_jsxs("div", { "data-sidebar-placeholder": "", className: cn('sticky z-20 [grid-area:sidebar] pointer-events-none *:pointer-events-auto md:layout:[--fd-sidebar-width:268px] max-md:hidden', navMode === 'auto'
+                ? 'top-(--fd-docs-row-1) h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))]'
+                : 'top-(--fd-docs-row-2) h-[calc(var(--fd-docs-height)-var(--fd-docs-row-2))]'), children: [collapsed && (_jsx("div", { className: "absolute start-0 inset-y-0 w-4", ...rest })), _jsx("aside", { id: "nd-sidebar", ref: mergeRefs(ref, refProp, asideRef), "data-collapsed": collapsed, "data-hovered": collapsed && hovered, className: cn('absolute flex flex-col w-full start-0 inset-y-0 items-end text-sm duration-250 *:w-(--fd-sidebar-width)', navMode === 'auto' && 'bg-fd-card border-e', collapsed && [
+                        'inset-y-2 rounded-xl bg-fd-card transition-transform border w-(--fd-sidebar-width)',
+                        hovered
+                            ? 'shadow-lg translate-x-2 rtl:-translate-x-2'
+                            : '-translate-x-(--fd-sidebar-width) rtl:translate-x-full',
+                    ], ref.current &&
+                        (ref.current.getAttribute('data-collapsed') === 'true') !==
+                            collapsed &&
+                        'transition-[width,inset-block,translate,background-color]', className), ...props, ...rest, children: children })] })) }));
+}
+export function SidebarDrawer({ children, className, ...props }) {
+    return (_jsxs(_Fragment, { children: [_jsx(Base.SidebarDrawerOverlay, { className: "fixed z-40 inset-0 backdrop-blur-xs data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out" }), _jsx(Base.SidebarDrawerContent, { className: cn('fixed text-[0.9375rem] flex flex-col shadow-lg border-s end-0 inset-y-0 w-[85%] max-w-[380px] z-40 bg-fd-background data-[state=open]:animate-fd-sidebar-in data-[state=closed]:animate-fd-sidebar-out', className), ...props, children: children })] }));
+}
+export function SidebarSeparator({ className, style, children, ...props }) {
+    const depth = Base.useFolderDepth();
+    return (_jsx(Base.SidebarSeparator, { className: cn('[&_svg]:size-4 [&_svg]:shrink-0', className), style: {
+            paddingInlineStart: getItemOffset(depth),
+            ...style,
+        }, ...props, children: children }));
+}
+export function SidebarItem({ className, style, children, ...props }) {
+    const depth = Base.useFolderDepth();
+    return (_jsx(Base.SidebarItem, { className: cn(itemVariants({ variant: 'link', highlight: depth >= 1 }), className), style: {
+            paddingInlineStart: getItemOffset(depth),
+            ...style,
+        }, ...props, children: children }));
+}
+export function SidebarFolderTrigger({ className, style, ...props }) {
+    const depth = Base.useFolderDepth();
+    return (_jsx(Base.SidebarFolderTrigger, { className: cn(itemVariants(), 'w-full', className), style: {
+            paddingInlineStart: getItemOffset(depth - 1),
+            ...style,
+        }, ...props, children: props.children }));
+}
+export function SidebarFolderLink({ className, style, ...props }) {
+    const depth = Base.useFolderDepth();
+    return (_jsx(Base.SidebarFolderLink, { className: cn(itemVariants({ variant: 'link', highlight: depth > 1 }), 'w-full', className), style: {
+            paddingInlineStart: getItemOffset(depth - 1),
+            ...style,
+        }, ...props, children: props.children }));
+}
+export function SidebarFolderContent({ className, children, ...props }) {
+    const depth = Base.useFolderDepth();
+    return (_jsx(Base.SidebarFolderContent, { className: cn('relative', depth === 1 &&
+            "before:content-[''] before:absolute before:w-px before:inset-y-1 before:bg-fd-border before:start-2.5", className), ...props, children: children }));
+}
+export const SidebarPageTree = createPageTreeRenderer({
+    SidebarFolder,
+    SidebarFolderContent,
+    SidebarFolderLink,
+    SidebarFolderTrigger,
+    SidebarItem,
+    SidebarSeparator,
+});
+export const SidebarLinkItem = createLinkItemRenderer({
+    SidebarFolder,
+    SidebarFolderContent,
+    SidebarFolderLink,
+    SidebarFolderTrigger,
+    SidebarItem,
+});

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

@@ -1,7 +1,7 @@
-import type { HTMLAttributes, ReactNode } from 'react';
-import type { NavProviderProps } from '../../contexts/layout.js';
+import type { ReactNode } from 'react';
 import type { I18nConfig } from 'fumadocs-core/i18n';
-export interface NavOptions extends NavProviderProps {
+import type { LinkItemType } from './link-item.js';
+export interface NavOptions {
     enabled: boolean;
     component: ReactNode;
     title?: ReactNode;
@@ -10,6 +10,12 @@ export interface NavOptions extends NavProviderProps {
      * @defaultValue '/'
      */
     url?: string;
+    /**
+     * Use transparent background
+     *
+     * @defaultValue none
+     */
+    transparentMode?: 'always' | 'top' | 'none';
     children?: ReactNode;
 }
 export interface BaseLayoutProps {
@@ -42,81 +48,9 @@ export interface BaseLayoutProps {
     nav?: Partial<NavOptions>;
     children?: ReactNode;
 }
-interface BaseItem {
-    /**
-     * Restrict where the item is displayed
-     *
-     * @defaultValue 'all'
-     */
-    on?: 'menu' | 'nav' | 'all';
-}
-export interface BaseLinkType extends BaseItem {
-    url: string;
-    /**
-     * When the item is marked as active
-     *
-     * @defaultValue 'url'
-     */
-    active?: 'url' | 'nested-url' | 'none';
-    external?: boolean;
-}
-export interface MainItemType extends BaseLinkType {
-    type?: 'main';
-    icon?: ReactNode;
-    text: ReactNode;
-    description?: ReactNode;
-}
-export interface IconItemType extends BaseLinkType {
-    type: 'icon';
-    /**
-     * `aria-label` of icon button
-     */
-    label?: string;
-    icon: ReactNode;
-    text: ReactNode;
-    /**
-     * @defaultValue true
-     */
-    secondary?: boolean;
-}
-export interface ButtonItemType extends BaseLinkType {
-    type: 'button';
-    icon?: ReactNode;
-    text: ReactNode;
-    /**
-     * @defaultValue false
-     */
-    secondary?: boolean;
-}
-export interface MenuItemType extends Partial<BaseLinkType> {
-    type: 'menu';
-    icon?: ReactNode;
-    text: ReactNode;
-    items: ((MainItemType & {
-        /**
-         * Options when displayed on navigation menu
-         */
-        menu?: HTMLAttributes<HTMLElement> & {
-            banner?: ReactNode;
-        };
-    }) | CustomItemType)[];
-    /**
-     * @defaultValue false
-     */
-    secondary?: boolean;
-}
-export interface CustomItemType extends BaseItem {
-    type: 'custom';
-    /**
-     * @defaultValue false
-     */
-    secondary?: boolean;
-    children: ReactNode;
-}
-export type LinkItemType = MainItemType | IconItemType | ButtonItemType | MenuItemType | CustomItemType;
 /**
- * Get Links Items with shortcuts
+ * Get link items with shortcuts
  */
-export declare function getLinks(links?: LinkItemType[], githubUrl?: string): LinkItemType[];
-export { BaseLinkItem } from './client.js';
+export declare function resolveLinkItems({ links, githubUrl, }: Pick<BaseLayoutProps, 'links' | 'githubUrl'>): LinkItemType[];
+export type * from './link-item.js';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layouts/shared/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layouts/shared/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,SAAS,CAAC;IAErB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;OAIG;IACH,eAAe,CAAC,EAAE,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;IAE5C,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,MAAM,WAAW,eAAe;IAC9B,WAAW,CAAC,EAAE;QACZ,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,SAAS,CAAC,EAAE,SAAS,CAAC;QACtB,IAAI,CAAC,EAAE,YAAY,GAAG,mBAAmB,CAAC;KAC3C,CAAC;IAEF,YAAY,CAAC,EAAE,OAAO,CAAC;QACrB,OAAO,EAAE,OAAO,CAAC;QACjB,UAAU,EAAE,OAAO,CAAC;YAClB,EAAE,EAAE,SAAS,CAAC;YACd,EAAE,EAAE,SAAS,CAAC;SACf,CAAC,CAAC;KACJ,CAAC,CAAC;IAEH;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IAE5B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB;;OAEG;IACH,GAAG,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAE1B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,KAAU,EACV,SAAS,GACV,EAAE,IAAI,CAAC,eAAe,EAAE,OAAO,GAAG,WAAW,CAAC,GAAG,YAAY,EAAE,CAkB/D;AAED,mBAAmB,aAAa,CAAC"}

package/dist/layouts/shared/index.js

@@ -1,21 +1,17 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
- * Get Links Items with shortcuts
+ * Get link items with shortcuts
  */
-export function getLinks(links = [], githubUrl) {
-    let result = links ?? [];
+export function resolveLinkItems({ links = [], githubUrl, }) {
+    const result = [...links];
     if (githubUrl)
-        result = [
-            ...result,
-            {
-                type: 'icon',
-                url: githubUrl,
-                text: 'Github',
-                label: 'GitHub',
-                icon: (_jsx("svg", { role: "img", viewBox: "0 0 24 24", fill: "currentColor", children: _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,
-            },
-        ];
+        result.push({
+            type: 'icon',
+            url: githubUrl,
+            text: 'Github',
+            label: 'GitHub',
+            icon: (_jsx("svg", { role: "img", viewBox: "0 0 24 24", fill: "currentColor", children: _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 { BaseLinkItem } from './client.js';

package/dist/layouts/shared/language-toggle.d.ts

@@ -0,0 +1,5 @@
+import type { ComponentProps } from 'react';
+export type LanguageSelectProps = ComponentProps<'button'>;
+export declare function LanguageToggle(props: LanguageSelectProps): React.ReactElement;
+export declare function LanguageToggleText(props: ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=language-toggle.d.ts.map

package/dist/layouts/shared/language-toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"language-toggle.d.ts","sourceRoot":"","sources":["../../../src/layouts/shared/language-toggle.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAU5C,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,QAAQ,CAAC,CAAC;AAE3D,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,KAAK,CAAC,YAAY,CA2C7E;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,2CAO/D"}

package/dist/layouts/shared/link-item.d.ts

@@ -0,0 +1,78 @@
+import type { ComponentProps, ReactNode } from 'react';
+interface Filterable {
+    /**
+     * Restrict where the item is displayed
+     *
+     * @defaultValue 'all'
+     */
+    on?: 'menu' | 'nav' | 'all';
+}
+interface WithHref {
+    url: string;
+    /**
+     * When the item is marked as active
+     *
+     * @defaultValue 'url'
+     */
+    active?: 'url' | 'nested-url' | 'none';
+    external?: boolean;
+}
+export interface MainItemType extends WithHref, Filterable {
+    type?: 'main';
+    icon?: ReactNode;
+    text: ReactNode;
+    description?: ReactNode;
+}
+export interface IconItemType extends WithHref, Filterable {
+    type: 'icon';
+    /**
+     * `aria-label` of icon button
+     */
+    label?: string;
+    icon: ReactNode;
+    text: ReactNode;
+    /**
+     * @defaultValue true
+     */
+    secondary?: boolean;
+}
+export interface ButtonItemType extends WithHref, Filterable {
+    type: 'button';
+    icon?: ReactNode;
+    text: ReactNode;
+    /**
+     * @defaultValue false
+     */
+    secondary?: boolean;
+}
+export interface MenuItemType extends Partial<WithHref>, Filterable {
+    type: 'menu';
+    icon?: ReactNode;
+    text: ReactNode;
+    items: ((MainItemType & {
+        /**
+         * Options when displayed on navigation menu
+         */
+        menu?: ComponentProps<'a'> & {
+            banner?: ReactNode;
+        };
+    }) | CustomItemType)[];
+    /**
+     * @defaultValue false
+     */
+    secondary?: boolean;
+}
+export interface CustomItemType extends Filterable {
+    type: 'custom';
+    /**
+     * @defaultValue false
+     */
+    secondary?: boolean;
+    children: ReactNode;
+}
+export type LinkItemType = MainItemType | IconItemType | ButtonItemType | MenuItemType | CustomItemType;
+export declare function LinkItem({ ref, item, ...props }: Omit<ComponentProps<'a'>, 'href'> & {
+    item: WithHref;
+}): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=link-item.d.ts.map

package/dist/layouts/shared/link-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-item.d.ts","sourceRoot":"","sources":["../../../src/layouts/shared/link-item.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvD,UAAU,UAAU;IAClB;;;;OAIG;IACH,EAAE,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,KAAK,CAAC;CAC7B;AAED,UAAU,QAAQ;IAChB,GAAG,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,MAAM,CAAC,EAAE,KAAK,GAAG,YAAY,GAAG,MAAM,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,YAAa,SAAQ,QAAQ,EAAE,UAAU;IACxD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,EAAE,SAAS,CAAC;IAChB,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AAED,MAAM,WAAW,YAAa,SAAQ,QAAQ,EAAE,UAAU;IACxD,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,SAAS,CAAC;IAChB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,cAAe,SAAQ,QAAQ,EAAE,UAAU;IAC1D,IAAI,EAAE,QAAQ,CAAC;IACf,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,EAAE,SAAS,CAAC;IAChB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,YAAa,SAAQ,OAAO,CAAC,QAAQ,CAAC,EAAE,UAAU;IACjE,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,EAAE,SAAS,CAAC;IAEhB,KAAK,EAAE,CACH,CAAC,YAAY,GAAG;QACd;;WAEG;QACH,IAAI,CAAC,EAAE,cAAc,CAAC,GAAG,CAAC,GAAG;YAC3B,MAAM,CAAC,EAAE,SAAS,CAAC;SACpB,CAAC;KACH,CAAC,GACF,cAAc,CACjB,EAAE,CAAC;IAEJ;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,cAAe,SAAQ,UAAU;IAChD,IAAI,EAAE,QAAQ,CAAC;IACf;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,MAAM,YAAY,GACpB,YAAY,GACZ,YAAY,GACZ,cAAc,GACd,YAAY,GACZ,cAAc,CAAC;AAEnB,wBAAgB,QAAQ,CAAC,EACvB,GAAG,EACH,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC,GAAG;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,2CAkBxD"}

package/dist/layouts/shared/{client.js → link-item.js}

@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { usePathname } from 'fumadocs-core/framework';
 import { isActive } from '../../utils/is-active.js';
 import Link from 'fumadocs-core/link';
-export function BaseLinkItem({ ref, item, ...props }) {
+export function LinkItem({ ref, item, ...props }) {
     const pathname = usePathname();
     const activeType = item.active ?? 'url';
     const active = activeType !== 'none' &&

package/dist/layouts/shared/search-toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-toggle.d.ts","sourceRoot":"","sources":["../../../src/layouts/shared/search-toggle.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAK5C,OAAO,EAAE,KAAK,WAAW,EAAkB,MAAM,wBAAwB,CAAC;AAE1E,UAAU,iBACR,SAAQ,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,EAC7C,WAAW;IACb,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,wBAAgB,YAAY,CAAC,EAC3B,cAAc,EACd,IAAgB,EAChB,KAAe,EACf,GAAG,KAAK,EACT,EAAE,iBAAiB,kDAuBnB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,cAAc,EACd,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,QAAQ,CAAC,GAAG;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,kDA6BA"}

package/dist/{components/layout → layouts/shared}/theme-toggle.d.ts

@@ -1,5 +1,5 @@
-import { type HTMLAttributes } from 'react';
-export declare function ThemeToggle({ className, mode, ...props }: HTMLAttributes<HTMLElement> & {
+import { ComponentProps } from 'react';
+export declare function ThemeToggle({ className, mode, ...props }: ComponentProps<'div'> & {
     mode?: 'light-dark' | 'light-dark-system';
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=theme-toggle.d.ts.map

package/dist/layouts/shared/theme-toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-toggle.d.ts","sourceRoot":"","sources":["../../../src/layouts/shared/theme-toggle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAuB,MAAM,OAAO,CAAC;AAqB5D,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,IAAmB,EACnB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG;IACzB,IAAI,CAAC,EAAE,YAAY,GAAG,mBAAmB,CAAC;CAC3C,2CAsDA"}