@vx-oss/docs-react 1.0.3 → 1.0.5

package/dist/layouts/home/slots/header.js

@@ -1,239 +1 @@
-"use client";
-import { cn } from "../../../utils/cn.js";
-import { buttonVariants } from "../../../components/ui/button.js";
-import { LinkItem } from "../../shared/client.js";
-import "../../shared/index.js";
-import { useIsScrollTop } from "../../../utils/use-is-scroll-top.js";
-import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport } from "../../../components/ui/navigation-menu.js";
-import { useHomeLayout } from "../index.js";
-import Link from "@vx-oss/docs-core/link";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { ChevronDown, Languages } from "lucide-react";
-import { cva } from "class-variance-authority";
-import { Fragment as Fragment$1, useState } from "react";
-import { useTranslations } from "@fuma-translate/react";
-//#region src/layouts/home/slots/header.tsx
-const navItemVariants = cva("[&_svg]:size-4", {
-	variants: { variant: {
-		main: "inline-flex items-center gap-1 p-2 text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground data-[active=true]:text-fd-primary",
-		button: buttonVariants({
-			color: "secondary",
-			className: "gap-1.5"
-		}),
-		icon: buttonVariants({
-			color: "ghost",
-			size: "icon"
-		})
-	} },
-	defaultVariants: { variant: "main" }
-});
-function Header(props) {
-	const { navItems, menuItems, slots, props: { nav } } = useHomeLayout();
-	const t = useTranslations({ note: "mobile menu" });
-	if (nav?.component) return nav.component;
-	return /* @__PURE__ */ jsxs(HeaderNavigationMenu, {
-		transparentMode: nav?.transparentMode,
-		...props,
-		children: [
-			slots.navTitle && /* @__PURE__ */ jsx(slots.navTitle, { className: "inline-flex items-center gap-2.5 font-semibold" }),
-			nav?.children,
-			/* @__PURE__ */ jsx("ul", {
-				className: "flex flex-row items-center gap-2 px-6 max-sm:hidden",
-				children: navItems.filter((item) => !isSecondary(item)).map((item, i) => /* @__PURE__ */ jsx(NavigationMenuLinkItem, {
-					item,
-					className: "text-sm"
-				}, i))
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "flex flex-row items-center justify-end gap-1.5 flex-1 max-lg:hidden",
-				children: [
-					slots.searchTrigger && /* @__PURE__ */ jsx(slots.searchTrigger.full, {
-						hideIfDisabled: true,
-						className: "w-full rounded-full ps-2.5 max-w-[240px]"
-					}),
-					slots.themeSwitch && /* @__PURE__ */ jsx(slots.themeSwitch, {}),
-					slots.languageSelect && /* @__PURE__ */ jsx(slots.languageSelect.root, { children: /* @__PURE__ */ jsx(Languages, { className: "size-5" }) }),
-					/* @__PURE__ */ jsx("ul", {
-						className: "flex flex-row gap-2 items-center empty:hidden",
-						children: navItems.filter(isSecondary).map((item, i) => /* @__PURE__ */ jsx(NavigationMenuLinkItem, {
-							className: cn(item.type === "icon" && "-mx-1 first:ms-0 last:me-0"),
-							item
-						}, i))
-					})
-				]
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "flex flex-row items-center ms-auto -me-1.5 lg:hidden",
-				children: [slots.searchTrigger && /* @__PURE__ */ jsx(slots.searchTrigger.sm, {
-					hideIfDisabled: true,
-					className: "p-2"
-				}), /* @__PURE__ */ jsx(NavigationMenuItem, {
-					asChild: true,
-					children: /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(NavigationMenuTrigger, {
-						"aria-label": t("Toggle Menu", { note: "aria-label" }),
-						className: cn(buttonVariants({
-							size: "icon",
-							color: "ghost",
-							className: "group [&_svg]:size-5.5"
-						})),
-						onPointerMove: nav?.enableHoverToOpen ? void 0 : (e) => e.preventDefault(),
-						children: /* @__PURE__ */ jsx(ChevronDown, { className: "transition-transform duration-300 group-data-[state=open]:rotate-180" })
-					}), /* @__PURE__ */ jsxs(NavigationMenuContent, {
-						className: "flex flex-col p-4 sm:flex-row sm:items-center sm:justify-end",
-						children: [menuItems.filter((item) => !isSecondary(item)).map((item, i) => /* @__PURE__ */ jsx(MobileNavigationMenuLinkItem, {
-							item,
-							className: "sm:hidden"
-						}, i)), /* @__PURE__ */ jsxs("div", {
-							className: "-ms-1.5 flex flex-row items-center gap-2 max-sm:mt-2",
-							children: [
-								menuItems.filter(isSecondary).map((item, i) => /* @__PURE__ */ jsx(MobileNavigationMenuLinkItem, {
-									item,
-									className: cn(item.type === "icon" && "-mx-1 first:ms-0")
-								}, i)),
-								/* @__PURE__ */ jsx("div", {
-									role: "separator",
-									className: "flex-1"
-								}),
-								slots.languageSelect && /* @__PURE__ */ jsxs(slots.languageSelect.root, { children: [
-									/* @__PURE__ */ jsx(Languages, { className: "size-5" }),
-									slots.languageSelect.text && /* @__PURE__ */ jsx(slots.languageSelect.text, {}),
-									/* @__PURE__ */ jsx(ChevronDown, { className: "size-3 text-fd-muted-foreground" })
-								] }),
-								slots.themeSwitch && /* @__PURE__ */ jsx(slots.themeSwitch, {})
-							]
-						})]
-					})] })
-				})]
-			})
-		]
-	});
-}
-function isSecondary(item) {
-	if ("secondary" in item && item.secondary != null) return item.secondary;
-	return item.type === "icon";
-}
-function HeaderNavigationMenu({ transparentMode = "none", ...props }) {
-	const [value, setValue] = useState("");
-	const isTop = useIsScrollTop({ enabled: transparentMode === "top" }) ?? true;
-	const isTransparent = transparentMode === "top" ? isTop : transparentMode === "always";
-	return /* @__PURE__ */ jsx(NavigationMenu, {
-		value,
-		onValueChange: setValue,
-		asChild: true,
-		children: /* @__PURE__ */ jsx("header", {
-			id: "nd-nav",
-			...props,
-			className: cn("sticky h-14 top-0 z-40", props.className),
-			children: /* @__PURE__ */ jsxs("div", {
-				className: cn("backdrop-blur-lg border-b transition-colors *:mx-auto *:max-w-(--fd-layout-width)", value.length > 0 && "max-lg:shadow-lg max-lg:rounded-b-2xl", (!isTransparent || value.length > 0) && "bg-fd-background/80"),
-				children: [/* @__PURE__ */ jsx(NavigationMenuList, {
-					className: "flex h-14 w-full items-center px-4",
-					asChild: true,
-					children: /* @__PURE__ */ jsx("nav", { children: props.children })
-				}), /* @__PURE__ */ jsx(NavigationMenuViewport, {})]
-			})
-		})
-	});
-}
-function NavigationMenuLinkItem({ item, ...props }) {
-	if (item.type === "custom") return item.children;
-	if (item.type === "menu") {
-		const children = item.items.map((child, j) => {
-			if (child.type === "custom") return /* @__PURE__ */ jsx(Fragment$1, { children: child.children }, j);
-			const { banner = child.icon ? /* @__PURE__ */ jsx("div", {
-				className: "w-fit rounded-md border bg-fd-muted p-1 [&_svg]:size-4",
-				children: child.icon
-			}) : null, ...rest } = child.menu ?? {};
-			return /* @__PURE__ */ jsx(NavigationMenuLink, {
-				asChild: true,
-				children: /* @__PURE__ */ jsx(Link, {
-					href: child.url,
-					external: child.external,
-					...rest,
-					className: cn("flex flex-col gap-2 rounded-lg border bg-fd-card p-3 transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground", rest.className),
-					children: rest.children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
-						banner,
-						/* @__PURE__ */ jsx("p", {
-							className: "text-base font-medium",
-							children: child.text
-						}),
-						/* @__PURE__ */ jsx("p", {
-							className: "text-sm text-fd-muted-foreground empty:hidden",
-							children: child.description
-						})
-					] })
-				})
-			}, `${j}-${child.url}`);
-		});
-		return /* @__PURE__ */ jsxs(NavigationMenuItem, {
-			...props,
-			children: [/* @__PURE__ */ jsx(NavigationMenuTrigger, {
-				className: cn(navItemVariants(), "rounded-md"),
-				children: item.url ? /* @__PURE__ */ jsx(Link, {
-					href: item.url,
-					external: item.external,
-					children: item.text
-				}) : item.text
-			}), /* @__PURE__ */ jsx(NavigationMenuContent, {
-				className: "grid grid-cols-1 gap-2 p-4 md:grid-cols-2 lg:grid-cols-3",
-				children
-			})]
-		});
-	}
-	return /* @__PURE__ */ jsx(NavigationMenuItem, {
-		...props,
-		children: /* @__PURE__ */ jsx(NavigationMenuLink, {
-			asChild: true,
-			children: /* @__PURE__ */ jsx(LinkItem, {
-				item,
-				"aria-label": item.type === "icon" ? item.label : void 0,
-				className: cn(navItemVariants({ variant: item.type })),
-				children: item.type === "icon" ? item.icon : item.text
-			})
-		})
-	});
-}
-function MobileNavigationMenuLinkItem({ item, ...props }) {
-	if (item.type === "custom") return /* @__PURE__ */ jsx("div", {
-		className: cn("grid", props.className),
-		children: item.children
-	});
-	if (item.type === "menu") {
-		const header = /* @__PURE__ */ jsxs(Fragment, { children: [item.icon, item.text] });
-		return /* @__PURE__ */ jsxs("div", {
-			className: cn("mb-4 flex flex-col", props.className),
-			children: [/* @__PURE__ */ jsx("p", {
-				className: "mb-1 text-sm text-fd-muted-foreground",
-				children: item.url ? /* @__PURE__ */ jsx(NavigationMenuLink, {
-					asChild: true,
-					children: /* @__PURE__ */ jsx(Link, {
-						href: item.url,
-						external: item.external,
-						children: header
-					})
-				}) : header
-			}), item.items.map((child, i) => /* @__PURE__ */ jsx(MobileNavigationMenuLinkItem, { item: child }, i))]
-		});
-	}
-	return /* @__PURE__ */ jsx(NavigationMenuLink, {
-		asChild: true,
-		children: /* @__PURE__ */ jsxs(LinkItem, {
-			item,
-			className: cn({
-				main: "inline-flex items-center gap-2 py-1.5 transition-colors hover:text-fd-popover-foreground/50 data-[active=true]:font-medium data-[active=true]:text-fd-primary [&_svg]:size-4",
-				icon: buttonVariants({
-					size: "icon",
-					color: "ghost"
-				}),
-				button: buttonVariants({
-					color: "secondary",
-					className: "gap-1.5 [&_svg]:size-4"
-				})
-			}[item.type ?? "main"], props.className),
-			"aria-label": item.type === "icon" ? item.label : void 0,
-			children: [item.icon, item.type === "icon" ? void 0 : item.text]
-		})
-	});
-}
-//#endregion
-export { Header, navItemVariants };
+export * from '@vx-oss/docs-vezham-ui/layouts/home/slots/header';

package/dist/layouts/notebook/index.js

@@ -1,23 +1 @@
-import { getLayoutTabs } from "../shared/index.js";
-import { LayoutBody, useNotebookLayout } from "./client.js";
-import { jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
-//#region src/layouts/notebook/index.tsx
-function DocsLayout({ tree, tabMode = "sidebar", sidebar: { tabs: defaultTabs, ...sidebarProps } = {}, children, tabs = defaultTabs, ...props }) {
-	const resolvedTabs = useMemo(() => {
-		if (Array.isArray(tabs)) return tabs;
-		if (typeof tabs === "object") return getLayoutTabs(tree, tabs);
-		if (tabs !== false) return getLayoutTabs(tree);
-		return [];
-	}, [tabs, tree]);
-	return /* @__PURE__ */ jsx(LayoutBody, {
-		tree,
-		tabs: resolvedTabs,
-		tabMode,
-		sidebar: sidebarProps,
-		...props,
-		children
-	});
-}
-//#endregion
-export { DocsLayout, useNotebookLayout };
+export * from '@vx-oss/docs-vezham-ui/layouts/notebook';

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

@@ -1,124 +1 @@
-"use client";
-import { __exportAll } from "../../../_virtual/_rolldown/runtime.js";
-import { cn } from "../../../utils/cn.js";
-import { buttonVariants } from "../../../components/ui/button.js";
-import { MarkdownCopyButton, ViewOptionsPopover } from "../../shared/page-actions.js";
-import { TOC, TOCPopover, TOCProvider } from "./slots/toc.js";
-import { Footer } from "./slots/footer.js";
-import { Breadcrumb } from "./slots/breadcrumb.js";
-import { Container } from "./slots/container.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Edit } from "lucide-react";
-import { createContext, use, useEffect, useState } from "react";
-import { useTranslations } from "@fuma-translate/react";
-//#region src/layouts/notebook/page/index.tsx
-var page_exports = /* @__PURE__ */ __exportAll({
-	DocsBody: () => DocsBody,
-	DocsDescription: () => DocsDescription,
-	DocsPage: () => DocsPage,
-	DocsTitle: () => DocsTitle,
-	EditOnGitHub: () => EditOnGitHub,
-	MarkdownCopyButton: () => MarkdownCopyButton,
-	PageBreadcrumb: () => Breadcrumb,
-	PageFooter: () => Footer,
-	PageLastUpdate: () => PageLastUpdate,
-	ViewOptionsPopover: () => ViewOptionsPopover,
-	useDocsPage: () => useDocsPage
-});
-const PageContext = createContext(null);
-function useDocsPage() {
-	const context = use(PageContext);
-	if (!context) throw new Error("Please use page components under <DocsPage /> (`@vx-oss/docs-react/layouts/notebook/page`).");
-	return context;
-}
-function DocsPage({ full = false, tableOfContent: { enabled: tocEnabled = !full, single, ...tocProps } = {}, tableOfContentPopover: { enabled: tocPopoverEnabled, ...tocPopoverProps } = {}, breadcrumb: { enabled: breadcrumbEnabled = true, ...breadcrumb } = {}, footer: { enabled: footerEnabled = true, ...footer } = {}, toc = [], slots: defaultSlots = {}, children, ...containerProps }) {
-	tocPopoverEnabled ??= Boolean(toc.length > 0 || tocPopoverProps.header || tocPopoverProps.footer);
-	const slots = {
-		breadcrumb: defaultSlots.breadcrumb ?? Breadcrumb,
-		footer: defaultSlots.footer ?? Footer,
-		toc: defaultSlots.toc ?? {
-			provider: TOCProvider,
-			main: TOC,
-			popover: TOCPopover
-		},
-		container: defaultSlots.container ?? Container
-	};
-	return /* @__PURE__ */ jsx(PageContext, {
-		value: {
-			full,
-			slots
-		},
-		children: /* @__PURE__ */ jsxs(slots.toc.provider, {
-			single,
-			toc: tocEnabled || tocPopoverEnabled ? toc : [],
-			children: [
-				tocPopoverEnabled && (tocPopoverProps.component ?? /* @__PURE__ */ jsx(slots.toc.popover, { ...tocPopoverProps })),
-				/* @__PURE__ */ jsxs(slots.container, {
-					...containerProps,
-					children: [
-						breadcrumbEnabled && (breadcrumb.component ?? /* @__PURE__ */ jsx(slots.breadcrumb, { ...breadcrumb })),
-						children,
-						footerEnabled && (footer.component ?? /* @__PURE__ */ jsx(slots.footer, { ...footer }))
-					]
-				}),
-				tocEnabled && (tocProps.component ?? /* @__PURE__ */ jsx(slots.toc.main, { ...tocProps }))
-			]
-		})
-	});
-}
-function EditOnGitHub(props) {
-	const t = useTranslations({ note: "edit page" });
-	return /* @__PURE__ */ jsx("a", {
-		target: "_blank",
-		rel: "noreferrer noopener",
-		...props,
-		className: cn(buttonVariants({
-			color: "secondary",
-			size: "sm"
-		}), "gap-1.5 not-prose", props.className),
-		children: props.children ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Edit, { className: "size-3.5" }), t("Edit on GitHub")] })
-	});
-}
-/**
-* Add typography styles
-*/
-function DocsBody({ children, className, ...props }) {
-	return /* @__PURE__ */ jsx("div", {
-		...props,
-		className: cn("prose flex-1", className),
-		children
-	});
-}
-function DocsDescription({ children, className, ...props }) {
-	if (children === void 0) return null;
-	return /* @__PURE__ */ jsx("p", {
-		...props,
-		className: cn("mb-8 text-lg text-fd-muted-foreground", className),
-		children
-	});
-}
-function DocsTitle({ children, className, ...props }) {
-	return /* @__PURE__ */ jsx("h1", {
-		...props,
-		className: cn("text-[1.75em] font-semibold", className),
-		children
-	});
-}
-function PageLastUpdate({ date: value, ...props }) {
-	const t = useTranslations({ note: "page footer" });
-	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: [
-			t("Last updated on"),
-			" ",
-			date
-		]
-	});
-}
-//#endregion
-export { DocsBody, DocsDescription, DocsPage, DocsTitle, EditOnGitHub, MarkdownCopyButton, Breadcrumb as PageBreadcrumb, Footer as PageFooter, PageLastUpdate, ViewOptionsPopover, page_exports, useDocsPage };
+export * from '@vx-oss/docs-vezham-ui/layouts/notebook/page';

package/dist/layouts/notebook/page/slots/breadcrumb.js

@@ -1,44 +1 @@
-"use client";
-import { cn } from "../../../../utils/cn.js";
-import { useTreeContext, useTreePath } from "../../../../contexts/tree.js";
-import Link from "@vx-oss/docs-core/link";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { ChevronRight } from "lucide-react";
-import { Fragment as Fragment$1, useMemo } from "react";
-import { getBreadcrumbItemsFromPath } from "@vx-oss/docs-core/breadcrumb";
-//#region src/layouts/notebook/page/slots/breadcrumb.tsx
-function Breadcrumb({ 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 /* @__PURE__ */ 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 /* @__PURE__ */ jsxs(Fragment$1, { children: [i !== 0 && /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 shrink-0" }), item.url ? /* @__PURE__ */ jsx(Link, {
-				href: item.url,
-				className: cn(className, "transition-opacity hover:opacity-80"),
-				children: item.name
-			}) : /* @__PURE__ */ jsx("span", {
-				className,
-				children: item.name
-			})] }, i);
-		})
-	});
-}
-//#endregion
-export { Breadcrumb };
+export * from '@vx-oss/docs-vezham-ui/layouts/notebook/page/slots/breadcrumb';

package/dist/layouts/notebook/page/slots/container.js

@@ -1,22 +1 @@
-"use client";
-import { cn } from "../../../../utils/cn.js";
-import { useDocsPage } from "../index.js";
-import { jsx } from "react/jsx-runtime";
-//#region src/layouts/notebook/page/slots/container.tsx
-function Container(props) {
-	const { full } = useDocsPage();
-	return /* @__PURE__ */ jsx("main", {
-		className: "grid [grid-area:main]",
-		"data-layout-main": "",
-		children: /* @__PURE__ */ jsx("article", {
-			id: "nd-page",
-			"data-layout-content": "",
-			"data-full": full,
-			...props,
-			className: cn("flex flex-col min-w-0 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]", props.className),
-			children: props.children
-		})
-	});
-}
-//#endregion
-export { Container };
+export * from '@vx-oss/docs-vezham-ui/layouts/notebook/page/slots/container';

package/dist/layouts/notebook/page/slots/footer.js

@@ -1,56 +1 @@
-"use client";
-import { cn } from "../../../../utils/cn.js";
-import { isActive } from "../../../../utils/urls.js";
-import { useFooterItems } from "../../../../utils/use-footer-items.js";
-import Link from "@vx-oss/docs-core/link";
-import { usePathname } from "@vx-oss/docs-core/framework";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { ChevronLeft, ChevronRight } from "lucide-react";
-import { useMemo } from "react";
-import { useTranslations } from "@fuma-translate/react";
-//#region src/layouts/notebook/page/slots/footer.tsx
-function Footer({ items, children, className, ...props }) {
-	const footerList = useFooterItems();
-	const pathname = usePathname();
-	const { previous, next } = useMemo(() => {
-		if (items) return items;
-		const idx = footerList.findIndex((item) => isActive(item.url, pathname));
-		if (idx === -1) return {};
-		return {
-			previous: footerList[idx - 1],
-			next: footerList[idx + 1]
-		};
-	}, [
-		footerList,
-		items,
-		pathname
-	]);
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
-		className: cn("@container grid gap-4", previous && next ? "grid-cols-2" : "grid-cols-1", className),
-		...props,
-		children: [previous && /* @__PURE__ */ jsx(FooterItem, {
-			item: previous,
-			index: 0
-		}), next && /* @__PURE__ */ jsx(FooterItem, {
-			item: next,
-			index: 1
-		})]
-	}), children] });
-}
-function FooterItem({ item, index }) {
-	const t = useTranslations({ note: "pagination" });
-	const Icon = index === 0 ? ChevronLeft : ChevronRight;
-	return /* @__PURE__ */ 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: [/* @__PURE__ */ jsxs("div", {
-			className: cn("inline-flex items-center gap-1.5 font-medium", index === 1 && "flex-row-reverse"),
-			children: [/* @__PURE__ */ jsx(Icon, { className: "-mx-1 size-4 shrink-0 rtl:rotate-180" }), /* @__PURE__ */ jsx("p", { children: item.name })]
-		}), /* @__PURE__ */ jsx("p", {
-			className: "text-fd-muted-foreground truncate",
-			children: item.description ?? (index === 0 ? t("Previous Page") : t("Next Page"))
-		})]
-	});
-}
-//#endregion
-export { Footer };
+export * from '@vx-oss/docs-vezham-ui/layouts/notebook/page/slots/footer';