@fumadocs/base-ui 16.7.0 → 16.7.2

package/dist/layouts/docs/page/slots/toc-popover.js

@@ -1,141 +0,0 @@
-"use client";
-import { useI18n } from "../../../../contexts/i18n.js";
-import { cn } from "../../../../utils/cn.js";
-import { TOCScrollArea, useTOCItems } from "../../../../components/toc/index.js";
-import { TOCItems } from "../../../../components/toc/default.js";
-import { TOCItems as TOCItems$1 } from "../../../../components/toc/clerk.js";
-import { useTreePath } from "../../../../contexts/tree.js";
-import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../../../../components/ui/collapsible.js";
-import { useDocsLayout } from "../../client.js";
-import { createContext, use, useEffect, useEffectEvent, useMemo, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { ChevronDown } from "lucide-react";
-import { useActiveAnchor } from "fumadocs-core/toc";
-//#region src/layouts/docs/page/slots/toc-popover.tsx
-const TocPopoverContext = createContext(null);
-function TOCPopover({ container, trigger, content, header, footer, style }) {
-	return /* @__PURE__ */ jsxs(PageTOCPopover, {
-		...container,
-		children: [/* @__PURE__ */ jsx(PageTOCPopoverTrigger, { ...trigger }), /* @__PURE__ */ jsxs(PageTOCPopoverContent, {
-			...content,
-			children: [
-				header,
-				/* @__PURE__ */ jsx(TOCScrollArea, { children: style === "clerk" ? /* @__PURE__ */ jsx(TOCItems$1, {}) : /* @__PURE__ */ jsx(TOCItems, {}) }),
-				footer
-			]
-		})]
-	});
-}
-function PageTOCPopover({ className, children, ...rest }) {
-	const ref = useRef(null);
-	const [open, setOpen] = useState(false);
-	const { isNavTransparent } = useDocsLayout();
-	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 /* @__PURE__ */ jsx(TocPopoverContext, {
-		value: useMemo(() => ({
-			open,
-			setOpen
-		}), [setOpen, open]),
-		children: /* @__PURE__ */ jsx(Collapsible, {
-			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: /* @__PURE__ */ jsx("header", {
-				ref,
-				className: cn("border-b backdrop-blur-sm transition-colors", (!isNavTransparent || open) && "bg-fd-background/80", open && "shadow-lg"),
-				children
-			})
-		})
-	});
-}
-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 /* @__PURE__ */ 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: [
-			/* @__PURE__ */ jsx(ProgressCircle, {
-				value: (selected + 1) / Math.max(1, items.length),
-				max: 1,
-				className: cn("shrink-0", open && "text-fd-primary")
-			}),
-			/* @__PURE__ */ jsxs("span", {
-				className: "grid flex-1 *:my-auto *:row-start-1 *:col-start-1",
-				children: [/* @__PURE__ */ jsx("span", {
-					className: cn("truncate transition-[opacity,translate,color]", open && "text-fd-foreground", showItem && "opacity-0 -translate-y-full pointer-events-none"),
-					children: path?.name ?? text.toc
-				}), /* @__PURE__ */ jsx("span", {
-					className: cn("truncate transition-[opacity,translate]", !showItem && "opacity-0 translate-y-full pointer-events-none"),
-					children: items[selected]?.title
-				})]
-			}),
-			/* @__PURE__ */ 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 /* @__PURE__ */ jsxs("svg", {
-		role: "progressbar",
-		viewBox: `0 0 ${size} ${size}`,
-		"aria-valuenow": normalizedValue,
-		"aria-valuemin": min,
-		"aria-valuemax": max,
-		...restSvgProps,
-		children: [/* @__PURE__ */ jsx("circle", {
-			...circleProps,
-			className: "stroke-current/25"
-		}), /* @__PURE__ */ jsx("circle", {
-			...circleProps,
-			stroke: "currentColor",
-			strokeDasharray: circumference,
-			strokeDashoffset: circumference - progress,
-			strokeLinecap: "round",
-			transform: `rotate(-90 ${size / 2} ${size / 2})`,
-			className: "transition-all"
-		})]
-	});
-}
-function PageTOCPopoverContent(props) {
-	return /* @__PURE__ */ 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
-	});
-}
-//#endregion
-export { TOCPopover };

package/dist/layouts/flux/page/client.d.ts

@@ -1,82 +0,0 @@
-import { TOCProviderProps } from "../../../components/toc/index.js";
-import { TOCProps } from "./slots/toc.js";
-import { FooterProps } from "./slots/footer.js";
-import { BreadcrumbProps } from "./slots/breadcrumb.js";
-import { ComponentProps, FC, ReactNode } from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-import { TOCItemType } from "fumadocs-core/toc";
-
-//#region src/layouts/flux/page/client.d.ts
-interface DocsPageSlots {
-  toc?: FC<TOCProps>;
-  container?: FC<ComponentProps<'article'>>;
-  tocProvider?: FC<TOCProviderProps>;
-  footer?: FC<FooterProps>;
-  breadcrumb?: FC<BreadcrumbProps>;
-}
-interface DocsPageProps extends ComponentProps<'article'> {
-  toc?: TOCItemType[];
-  /**
-   * Extend the page to fill all available space
-   *
-   * @defaultValue false
-   */
-  full?: boolean;
-  children?: ReactNode;
-  slots?: DocsPageSlots;
-  footer?: FooterOptions;
-  breadcrumb?: BreadcrumbOptions;
-  tableOfContent?: TableOfContentOptions;
-}
-interface TableOfContentOptions extends Pick<TOCProviderProps, 'single'>, TOCProps {
-  enabled?: boolean;
-  /**
-   * @deprecated use `slots.toc` instead.
-   */
-  component?: ReactNode;
-}
-interface BreadcrumbOptions extends BreadcrumbProps {
-  enabled?: boolean;
-  /**
-   * @deprecated use `slots.breadcrumb` instead.
-   */
-  component?: ReactNode;
-}
-interface FooterOptions extends FooterProps {
-  enabled?: boolean;
-  /**
-   * @deprecated use `slots.footer` instead.
-   */
-  component?: ReactNode;
-}
-interface PageSlotsProps extends Pick<DocsPageProps, 'full' | 'footer' | 'breadcrumb'> {
-  tableOfContent: TOCProps & {
-    component?: ReactNode;
-  };
-}
-declare function useDocsPage(): {
-  props: PageSlotsProps;
-  slots: DocsPageSlots;
-};
-declare function DocsPage({
-  tableOfContent: {
-    enabled: tocEnabled,
-    single,
-    ...tocProps
-  },
-  footer,
-  breadcrumb,
-  full,
-  toc,
-  slots: defaultSlots,
-  children,
-  ...containerProps
-}: DocsPageProps): react_jsx_runtime0.JSX.Element;
-declare function PageLastUpdate({
-  date: value,
-  ...props
-}: Omit<ComponentProps<'p'>, 'children'> & {
-  date: Date;
-}): react_jsx_runtime0.JSX.Element;
-//#endregion
-export { DocsPage, DocsPageProps, DocsPageSlots, PageLastUpdate, useDocsPage };

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

@@ -1,94 +0,0 @@
-"use client";
-import { useI18n } from "../../../contexts/i18n.js";
-import { cn } from "../../../utils/cn.js";
-import { TOCProvider } from "../../../components/toc/index.js";
-import { TOC } from "./slots/toc.js";
-import { Footer } from "./slots/footer.js";
-import { Breadcrumb } from "./slots/breadcrumb.js";
-import { Container } from "./slots/container.js";
-import { createContext, use, useEffect, useState } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-//#region src/layouts/flux/page/client.tsx
-const PageContext = createContext(null);
-function useDocsPage() {
-	const context = use(PageContext);
-	if (!context) throw new Error("Please use page components under <DocsPage /> (`fumadocs-ui/layouts/flux/page`).");
-	return context;
-}
-function DocsPage({ tableOfContent: { enabled: tocEnabled, single = false, ...tocProps } = {}, footer = {}, breadcrumb = {}, full = false, toc = [], slots: defaultSlots = {}, children, ...containerProps }) {
-	tocEnabled ??= Boolean(toc.length > 0 || tocProps.header || tocProps.footer);
-	const slots = {
-		breadcrumb: breadcrumb.enabled !== false ? defaultSlots.breadcrumb ?? InlineBreadcrumb : void 0,
-		footer: footer.enabled !== false ? defaultSlots.footer ?? InlineFooter : void 0,
-		toc: tocEnabled ? defaultSlots.toc ?? InlineTOC : void 0,
-		tocProvider: defaultSlots.tocProvider ?? TOCProvider,
-		container: defaultSlots.container ?? Container
-	};
-	let content = /* @__PURE__ */ jsxs(Fragment$1, { children: [slots.toc && /* @__PURE__ */ jsx(slots.toc, {}), slots.container && /* @__PURE__ */ jsxs(slots.container, {
-		...containerProps,
-		children: [
-			slots.breadcrumb && /* @__PURE__ */ jsx(slots.breadcrumb, {}),
-			children,
-			slots.footer && /* @__PURE__ */ jsx(slots.footer, {})
-		]
-	})] });
-	if (slots.tocProvider) content = /* @__PURE__ */ jsx(slots.tocProvider, {
-		single,
-		toc: tocEnabled ? toc : [],
-		children: content
-	});
-	return /* @__PURE__ */ jsx(PageContext, {
-		value: {
-			props: {
-				full,
-				tableOfContent: tocProps,
-				footer,
-				breadcrumb
-			},
-			slots
-		},
-		children: content
-	});
-}
-function InlineBreadcrumb(props) {
-	const { component, enabled: _, ...rest } = useDocsPage().props.breadcrumb ?? {};
-	if (component) return component;
-	return /* @__PURE__ */ jsx(Breadcrumb, {
-		...props,
-		...rest
-	});
-}
-function InlineFooter(props) {
-	const { component, enabled: _, ...rest } = useDocsPage().props.footer ?? {};
-	if (component) return component;
-	return /* @__PURE__ */ jsx(Footer, {
-		...props,
-		...rest
-	});
-}
-function InlineTOC(props) {
-	const { tableOfContent } = useDocsPage().props;
-	if (tableOfContent.component) return tableOfContent.component;
-	return /* @__PURE__ */ jsx(TOC, {
-		...props,
-		...tableOfContent
-	});
-}
-function PageLastUpdate({ date: value, ...props }) {
-	const { text } = useI18n();
-	const [date, setDate] = useState("");
-	useEffect(() => {
-		setDate(value.toLocaleDateString());
-	}, [value]);
-	return /* @__PURE__ */ jsxs("p", {
-		...props,
-		className: cn("text-sm text-fd-muted-foreground", props.className),
-		children: [
-			text.lastUpdate,
-			" ",
-			date
-		]
-	});
-}
-//#endregion
-export { DocsPage, PageLastUpdate, useDocsPage };

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

@@ -1,98 +0,0 @@
-import { TOCProviderProps } from "../../../components/toc/index.js";
-import { TOCProps } from "./slots/toc.js";
-import { TOCPopoverProps } from "./slots/toc-popover.js";
-import { FooterProps } from "./slots/footer.js";
-import { BreadcrumbProps } from "./slots/breadcrumb.js";
-import { ComponentProps, FC, ReactNode } from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-import { TOCItemType } from "fumadocs-core/toc";
-
-//#region src/layouts/notebook/page/client.d.ts
-interface DocsPageSlots {
-  toc?: FC<TOCProps>;
-  container?: FC<ComponentProps<'article'>>;
-  tocPopover?: FC<TOCPopoverProps>;
-  tocProvider?: FC<TOCProviderProps>;
-  footer?: FC<FooterProps>;
-  breadcrumb?: FC<BreadcrumbProps>;
-}
-interface DocsPageProps extends ComponentProps<'article'> {
-  toc?: TOCItemType[];
-  /**
-   * Extend the page to fill all available space
-   *
-   * @defaultValue false
-   */
-  full?: boolean;
-  slots?: DocsPageSlots;
-  footer?: FooterOptions;
-  breadcrumb?: BreadcrumbOptions;
-  tableOfContent?: TableOfContentOptions;
-  tableOfContentPopover?: TableOfContentPopoverOptions;
-}
-interface BreadcrumbOptions extends BreadcrumbProps {
-  enabled?: boolean;
-  /**
-   * @deprecated use `slots.breadcrumb` instead.
-   */
-  component?: ReactNode;
-}
-interface FooterOptions extends FooterProps {
-  enabled?: boolean;
-  /**
-   * @deprecated use `slots.footer` instead.
-   */
-  component?: ReactNode;
-}
-interface TableOfContentOptions extends Pick<TOCProviderProps, 'single'>, TOCProps {
-  enabled?: boolean;
-  /**
-   * @deprecated use `slots.toc` instead.
-   */
-  component?: ReactNode;
-}
-interface TableOfContentPopoverOptions extends TOCPopoverProps {
-  enabled?: boolean;
-  /**
-   * @deprecated use `slots.tocPopover` instead.
-   */
-  component?: ReactNode;
-}
-interface PageSlotsProps extends Pick<DocsPageProps, 'full' | 'breadcrumb' | 'footer'> {
-  tableOfContent: TOCProps & {
-    component?: ReactNode;
-  };
-  tableOfContentPopover: TOCPopoverProps & {
-    component?: ReactNode;
-  };
-}
-declare function useDocsPage(): {
-  props: PageSlotsProps;
-  slots: DocsPageSlots;
-};
-declare function DocsPage({
-  tableOfContent: {
-    enabled: tocEnabled,
-    single,
-    ...tocProps
-  },
-  tableOfContentPopover: {
-    enabled: tocPopoverEnabled,
-    ...tocPopoverProps
-  },
-  footer,
-  breadcrumb,
-  full,
-  toc,
-  slots: defaultSlots,
-  children,
-  ...containerProps
-}: DocsPageProps): react_jsx_runtime0.JSX.Element;
-declare function PageLastUpdate({
-  date: value,
-  ...props
-}: Omit<ComponentProps<'p'>, 'children'> & {
-  date: Date;
-}): react_jsx_runtime0.JSX.Element;
-//#endregion
-export { DocsPage, DocsPageProps, DocsPageSlots, PageLastUpdate, useDocsPage };

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

@@ -1,110 +0,0 @@
-"use client";
-import { useI18n } from "../../../contexts/i18n.js";
-import { cn } from "../../../utils/cn.js";
-import { TOCProvider } from "../../../components/toc/index.js";
-import { TOC } from "./slots/toc.js";
-import { TOCPopover } from "./slots/toc-popover.js";
-import { Footer } from "./slots/footer.js";
-import { Breadcrumb } from "./slots/breadcrumb.js";
-import { Container } from "./slots/container.js";
-import { createContext, use, useEffect, useState } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-//#region src/layouts/notebook/page/client.tsx
-const PageContext = createContext(null);
-function useDocsPage() {
-	const context = use(PageContext);
-	if (!context) throw new Error("Please use page components under <DocsPage /> (`fumadocs-ui/layouts/notebook/page`).");
-	return context;
-}
-function DocsPage({ tableOfContent: { enabled: tocEnabled, single = false, ...tocProps } = {}, tableOfContentPopover: { enabled: tocPopoverEnabled, ...tocPopoverProps } = {}, footer = {}, breadcrumb = {}, full = false, toc = [], slots: defaultSlots = {}, children, ...containerProps }) {
-	tocEnabled ??= Boolean(!full && (toc.length > 0 || tocProps.footer || tocProps.header));
-	tocPopoverEnabled ??= Boolean(toc.length > 0 || tocPopoverProps.header || tocPopoverProps.footer);
-	const slots = {
-		breadcrumb: breadcrumb.enabled !== false ? defaultSlots.breadcrumb ?? InlineBreadcrumb : void 0,
-		footer: footer.enabled !== false ? defaultSlots.footer ?? InlineFooter : void 0,
-		toc: tocEnabled ? defaultSlots.toc ?? InlineTOC : void 0,
-		tocPopover: tocPopoverEnabled ? defaultSlots.tocPopover ?? InlineTOCPopover : void 0,
-		tocProvider: defaultSlots.tocProvider ?? TOCProvider,
-		container: defaultSlots.container ?? Container
-	};
-	let content = /* @__PURE__ */ jsxs(Fragment$1, { children: [
-		slots.tocPopover && /* @__PURE__ */ jsx(slots.tocPopover, {}),
-		slots.container && /* @__PURE__ */ jsxs(slots.container, {
-			...containerProps,
-			children: [
-				slots.breadcrumb && /* @__PURE__ */ jsx(slots.breadcrumb, {}),
-				children,
-				slots.footer && /* @__PURE__ */ jsx(slots.footer, {})
-			]
-		}),
-		slots.toc && /* @__PURE__ */ jsx(slots.toc, {})
-	] });
-	if (slots.tocProvider) content = /* @__PURE__ */ jsx(slots.tocProvider, {
-		single,
-		toc: tocEnabled || tocPopoverEnabled ? toc : [],
-		children: content
-	});
-	return /* @__PURE__ */ jsx(PageContext, {
-		value: {
-			props: {
-				full,
-				tableOfContent: tocProps,
-				tableOfContentPopover: tocPopoverProps,
-				footer,
-				breadcrumb
-			},
-			slots
-		},
-		children: content
-	});
-}
-function InlineBreadcrumb(props) {
-	const { component, enabled: _, ...rest } = useDocsPage().props.breadcrumb ?? {};
-	if (component) return component;
-	return /* @__PURE__ */ jsx(Breadcrumb, {
-		...props,
-		...rest
-	});
-}
-function InlineFooter(props) {
-	const { component, enabled: _, ...rest } = useDocsPage().props.footer ?? {};
-	if (component) return component;
-	return /* @__PURE__ */ jsx(Footer, {
-		...props,
-		...rest
-	});
-}
-function InlineTOCPopover(props) {
-	const { tableOfContentPopover } = useDocsPage().props;
-	if (tableOfContentPopover.component) return tableOfContentPopover.component;
-	return /* @__PURE__ */ jsx(TOCPopover, {
-		...props,
-		...tableOfContentPopover
-	});
-}
-function InlineTOC(props) {
-	const { tableOfContent } = useDocsPage().props;
-	if (tableOfContent.component) return tableOfContent.component;
-	return /* @__PURE__ */ jsx(TOC, {
-		...props,
-		...tableOfContent
-	});
-}
-function PageLastUpdate({ date: value, ...props }) {
-	const { text } = useI18n();
-	const [date, setDate] = useState("");
-	useEffect(() => {
-		setDate(value.toLocaleDateString());
-	}, [value]);
-	return /* @__PURE__ */ jsxs("p", {
-		...props,
-		className: cn("text-sm text-fd-muted-foreground", props.className),
-		children: [
-			text.lastUpdate,
-			" ",
-			date
-		]
-	});
-}
-//#endregion
-export { DocsPage, PageLastUpdate, useDocsPage };

package/dist/layouts/notebook/page/slots/toc-popover.d.ts

@@ -1,31 +0,0 @@
-import { ComponentProps, ReactNode } from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
-//#region src/layouts/notebook/page/slots/toc-popover.d.ts
-interface TOCPopoverProps {
-  container?: ComponentProps<'div'>;
-  trigger?: ComponentProps<'button'>;
-  content?: ComponentProps<'div'>;
-  /**
-   * Custom content in TOC container, before the main TOC
-   */
-  header?: ReactNode;
-  /**
-   * Custom content in TOC container, after the main TOC
-   */
-  footer?: ReactNode;
-  /**
-   * @defaultValue 'normal'
-   */
-  style?: 'normal' | 'clerk';
-}
-declare function TOCPopover({
-  container,
-  trigger,
-  content,
-  header,
-  footer,
-  style
-}: TOCPopoverProps): react_jsx_runtime0.JSX.Element;
-//#endregion
-export { TOCPopover, TOCPopoverProps };