fumadocs-ui 16.6.1 → 16.6.3

package/css/generated/docs.css

@@ -50,8 +50,6 @@
 @source inline("as");
 @source inline("aside");
 @source inline("auto");
-@source inline("auto-cols-auto");
-@source inline("auto-rows-auto");
 @source inline("available");
 @source inline("backdrop-blur-sm");
 @source inline("backdrop-blur-xs");
@@ -241,7 +239,7 @@
 @source inline("max-h-[50vh]");
 @source inline("max-md:hidden");
 @source inline("max-md:layout:[--fd-header-height:--spacing(14)]");
-@source inline("max-w-[1200px]");
+@source inline("max-w-[1168px]");
 @source inline("max-w-[380px]");
 @source inline("max-w-[900px]");
 @source inline("max-xl:hidden");

package/css/generated/notebook.css

@@ -398,7 +398,6 @@
 @source inline("start-0");
 @source inline("sticky");
 @source inline("still");
-@source inline("string");
 @source inline("stroke");
 @source inline("stroke-current/25");
 @source inline("strokeDasharray");

package/css/generated/shared.css

@@ -66,7 +66,6 @@
 @source inline("absolute");
 @source inline("action");
 @source inline("active");
-@source inline("activeType");
 @source inline("add");
 @source inline("advanced");
 @source inline("after");
@@ -93,6 +92,7 @@
 @source inline("aria-selected");
 @source inline("as");
 @source inline("aside");
+@source inline("assume");
 @source inline("assumes");
 @source inline("async");
 @source inline("at");
@@ -619,6 +619,7 @@
 @source inline("nextIdRef");
 @source inline("nextPage");
 @source inline("node");
+@source inline("nodes");
 @source inline("none");
 @source inline("noopener");
 @source inline("noreferrer");
@@ -991,6 +992,7 @@
 @source inline("type");
 @source inline("typeof");
 @source inline("types");
+@source inline("unchanged");
 @source inline("undefined");
 @source inline("under");
 @source inline("underline");

package/css/lib/shiki.css

@@ -16,11 +16,14 @@
 :is(pre *):is(.shiki *):not(.not-fumadocs-codeblock *) {
   .line& {
     position: relative;
-    min-height: 1lh;
     padding-left: var(--padding-left);
     padding-right: var(--padding-right);
   }
 
+  .line:empty& {
+    height: 1lh;
+  }
+
   .has-focused .line&:not(.focused) {
     filter: blur(2px);
     transition: filter 200ms;

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

@@ -74,9 +74,11 @@ declare function SidebarViewport(props: ScrollAreaProps): react_jsx_runtime0.JSX
 declare function SidebarSeparator(props: ComponentProps<'p'>): react_jsx_runtime0.JSX.Element;
 declare function SidebarItem({
   icon,
+  active,
   children,
   ...props
 }: LinkProps & {
+  active?: boolean;
   icon?: ReactNode;
 }): react_jsx_runtime0.JSX.Element;
 declare function SidebarFolder({
@@ -96,8 +98,11 @@ declare function SidebarFolderTrigger({
 }: CollapsibleTriggerProps): react_jsx_runtime0.JSX.Element;
 declare function SidebarFolderLink({
   children,
+  active,
   ...props
-}: LinkProps): react_jsx_runtime0.JSX.Element;
+}: LinkProps & {
+  active?: boolean;
+}): react_jsx_runtime0.JSX.Element;
 declare function SidebarFolderContent(props: CollapsibleContentProps): react_jsx_runtime0.JSX.Element;
 declare function SidebarTrigger({
   children,

package/dist/components/sidebar/base.js

@@ -1,7 +1,6 @@
 'use client';
 
 import { cn } from "../../utils/cn.js";
-import { isActive } from "../../utils/urls.js";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../ui/collapsible.js";
 import { ScrollArea, ScrollViewport } from "../ui/scroll-area.js";
 import { createContext, use, useEffect, useMemo, useRef, useState } from "react";
@@ -134,11 +133,9 @@ function SidebarSeparator(props) {
 		children: props.children
 	});
 }
-function SidebarItem({ icon, children, ...props }) {
-	const pathname = usePathname();
+function SidebarItem({ icon, active = false, children, ...props }) {
 	const ref = useRef(null);
 	const { prefetch } = useSidebar();
-	const active = props.href !== void 0 && isActive(props.href, pathname, false);
 	useAutoScroll(active, ref);
 	return /* @__PURE__ */ jsxs(Link, {
 		ref,
@@ -190,12 +187,10 @@ function SidebarFolderTrigger({ children, ...props }) {
 		children
 	});
 }
-function SidebarFolderLink({ children, ...props }) {
+function SidebarFolderLink({ children, active = false, ...props }) {
 	const ref = useRef(null);
 	const { open, setOpen, collapsible } = use(FolderContext);
 	const { prefetch } = useSidebar();
-	const pathname = usePathname();
-	const active = props.href !== void 0 && isActive(props.href, pathname, false);
 	useAutoScroll(active, ref);
 	return /* @__PURE__ */ jsxs(Link, {
 		ref,

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

@@ -1,3 +1,6 @@
+'use client';
+
+import { useLinkItemActive } from "../../utils/link-item.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/sidebar/link-item.tsx
@@ -6,6 +9,7 @@ function createLinkItemRenderer({ SidebarFolder, SidebarFolderContent, SidebarFo
 	* Render sidebar items from page tree
 	*/
 	return function SidebarLinkItem({ item, ...props }) {
+		const active = useLinkItemActive(item);
 		if (item.type === "custom") return /* @__PURE__ */ jsx("div", {
 			...props,
 			children: item.children
@@ -14,6 +18,7 @@ function createLinkItemRenderer({ SidebarFolder, SidebarFolderContent, SidebarFo
 			...props,
 			children: [item.url ? /* @__PURE__ */ jsxs(SidebarFolderLink, {
 				href: item.url,
+				active,
 				external: item.external,
 				children: [item.icon, item.text]
 			}) : /* @__PURE__ */ jsxs(SidebarFolderTrigger, { children: [item.icon, item.text] }), /* @__PURE__ */ jsx(SidebarFolderContent, { children: item.items.map((child, i) => /* @__PURE__ */ jsx(SidebarLinkItem, { item: child }, i)) })]
@@ -22,6 +27,7 @@ function createLinkItemRenderer({ SidebarFolder, SidebarFolderContent, SidebarFo
 			href: item.url,
 			icon: item.icon,
 			external: item.external,
+			active,
 			...props,
 			children: item.text
 		});

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

@@ -1,55 +1,69 @@
 import { useTreeContext, useTreePath } from "../../contexts/tree.js";
-import { Fragment, useMemo } from "react";
+import { isActive } from "../../utils/urls.js";
+import { Fragment, createContext, use, useMemo } from "react";
+import { usePathname } from "fumadocs-core/framework";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/sidebar/page-tree.tsx
+const RendererContext = createContext(null);
 function createPageTreeRenderer({ SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarSeparator, SidebarItem }) {
-	function PageTreeFolder({ item, children }) {
-		const path = useTreePath();
-		return /* @__PURE__ */ jsxs(SidebarFolder, {
-			collapsible: item.collapsible,
-			active: path.includes(item),
-			defaultOpen: item.defaultOpen,
-			children: [item.index ? /* @__PURE__ */ jsxs(SidebarFolderLink, {
-				href: item.index.url,
-				external: item.index.external,
-				children: [item.icon, item.name]
-			}) : /* @__PURE__ */ jsxs(SidebarFolderTrigger, { children: [item.icon, item.name] }), /* @__PURE__ */ jsx(SidebarFolderContent, { children })]
+	function renderList(nodes) {
+		return nodes.map((node, i) => /* @__PURE__ */ jsx(PageTreeNode, { node }, i));
+	}
+	function PageTreeNode({ node }) {
+		const { Separator, Item, Folder, pathname } = use(RendererContext);
+		if (node.type === "separator") {
+			if (Separator) return /* @__PURE__ */ jsx(Separator, { item: node });
+			return /* @__PURE__ */ jsxs(SidebarSeparator, { children: [node.icon, node.name] });
+		}
+		if (node.type === "folder") {
+			const path = useTreePath();
+			if (Folder) return /* @__PURE__ */ jsx(Folder, {
+				item: node,
+				children: renderList(node.children)
+			});
+			return /* @__PURE__ */ jsxs(SidebarFolder, {
+				collapsible: node.collapsible,
+				active: path.includes(node),
+				defaultOpen: node.defaultOpen,
+				children: [node.index ? /* @__PURE__ */ jsxs(SidebarFolderLink, {
+					href: node.index.url,
+					active: isActive(node.index.url, pathname),
+					external: node.index.external,
+					children: [node.icon, node.name]
+				}) : /* @__PURE__ */ jsxs(SidebarFolderTrigger, { children: [node.icon, node.name] }), /* @__PURE__ */ jsx(SidebarFolderContent, { children: renderList(node.children) })]
+			});
+		}
+		if (Item) return /* @__PURE__ */ jsx(Item, { item: node });
+		return /* @__PURE__ */ jsx(SidebarItem, {
+			href: node.url,
+			external: node.external,
+			active: isActive(node.url, pathname),
+			icon: node.icon,
+			children: node.name
 		});
 	}
 	/**
 	* Render sidebar items from page tree
 	*/
 	return function SidebarPageTree(components) {
+		const { Folder, Item, Separator } = 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 /* @__PURE__ */ jsx(Separator, { item }, i);
-						return /* @__PURE__ */ jsxs(SidebarSeparator, { children: [item.icon, item.name] }, i);
-					}
-					if (item.type === "folder") return /* @__PURE__ */ jsx(Folder, {
-						item,
-						children: renderSidebarList(item.children)
-					}, i);
-					if (Item) return /* @__PURE__ */ jsx(Item, { item }, item.url);
-					return /* @__PURE__ */ jsx(SidebarItem, {
-						href: item.url,
-						external: item.external,
-						icon: item.icon,
-						children: item.name
-					}, item.url);
-				});
-			}
-			return /* @__PURE__ */ jsx(Fragment, { children: renderSidebarList(root.children) }, root.$id);
-		}, [
-			Folder,
-			Item,
-			Separator,
-			root
-		]);
+		const pathname = usePathname();
+		return /* @__PURE__ */ jsx(RendererContext, {
+			value: useMemo(() => ({
+				Folder,
+				Item,
+				Separator,
+				pathname
+			}), [
+				Folder,
+				Item,
+				Separator,
+				pathname
+			]),
+			children: /* @__PURE__ */ jsx(Fragment, { children: renderList(root.children) }, root.$id)
+		});
 	};
 }
 

package/dist/layouts/docs/client.js

@@ -31,12 +31,12 @@ function LayoutBody({ className, style, children, ...props }) {
 	const { collapsed } = useSidebar();
 	return /* @__PURE__ */ jsx("div", {
 		id: "nd-docs-layout",
-		className: cn("grid transition-[grid-template-columns] overflow-x-clip min-h-(--fd-docs-height) auto-cols-auto auto-rows-auto [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-toc-popover-height:0px] [--fd-sidebar-width:0px] [--fd-toc-width:0px]", className),
+		className: cn("grid transition-[grid-template-columns] overflow-x-clip min-h-(--fd-docs-height) [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-toc-popover-height:0px] [--fd-sidebar-width:0px] [--fd-toc-width:0px]", className),
 		"data-sidebar-collapsed": collapsed,
 		style: {
-			gridTemplate: `"sidebar header toc"
-        "sidebar toc-popover toc"
-        "sidebar main toc" 1fr / minmax(var(--fd-sidebar-col), 1fr) minmax(0, calc(var(--fd-layout-width,97rem) - var(--fd-sidebar-width) - var(--fd-toc-width))) minmax(min-content, 1fr)`,
+			gridTemplate: `"sidebar sidebar header toc toc"
+        "sidebar sidebar toc-popover toc toc"
+        "sidebar sidebar main toc toc" 1fr / minmax(min-content, 1fr) var(--fd-sidebar-col) minmax(0, calc(var(--fd-layout-width,97rem) - var(--fd-sidebar-width) - var(--fd-toc-width))) var(--fd-toc-width) minmax(min-content, 1fr)`,
 			"--fd-docs-row-1": "var(--fd-banner-height, 0px)",
 			"--fd-docs-row-2": "calc(var(--fd-docs-row-1) + var(--fd-header-height))",
 			"--fd-docs-row-3": "calc(var(--fd-docs-row-2) + var(--fd-toc-popover-height))",

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

@@ -150,7 +150,7 @@ function PageFooter({ items, children, className, ...props }) {
 	const pathname = usePathname();
 	const { previous, next } = useMemo(() => {
 		if (items) return items;
-		const idx = footerList.findIndex((item) => isActive(item.url, pathname, false));
+		const idx = footerList.findIndex((item) => isActive(item.url, pathname));
 		if (idx === -1) return {};
 		return {
 			previous: footerList[idx - 1],

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

@@ -37,7 +37,7 @@ function DocsPage({ breadcrumb: { enabled: breadcrumbEnabled = true, component:
 		/* @__PURE__ */ jsxs("article", {
 			id: "nd-page",
 			"data-full": full,
-			className: cn("flex flex-col w-full max-w-[900px] mx-auto [grid-area:main] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14", full ? "max-w-[1200px]" : "xl:layout:[--fd-toc-width:268px]", className),
+			className: cn("flex flex-col w-full max-w-[900px] mx-auto [grid-area:main] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14", full ? "max-w-[1168px]" : "xl:layout:[--fd-toc-width:268px]", className),
 			children: [
 				breadcrumbEnabled && (breadcrumb ?? /* @__PURE__ */ jsx(PageBreadcrumb, { ...breadcrumbProps })),
 				children,

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

@@ -178,7 +178,7 @@ function PageFooter({ items, children, className, ...props }) {
 	const pathname = usePathname();
 	const { previous, next } = useMemo(() => {
 		if (items) return items;
-		const idx = footerList.findIndex((item) => isActive(item.url, pathname, false));
+		const idx = footerList.findIndex((item) => isActive(item.url, pathname));
 		if (idx === -1) return {};
 		return {
 			previous: footerList[idx - 1],

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

@@ -4,7 +4,7 @@ import * as class_variance_authority_types0 from "class-variance-authority/types
 
 //#region src/layouts/home/client.d.ts
 declare const navItemVariants: (props?: ({
-  variant?: "icon" | "button" | "main" | null | undefined;
+  variant?: "button" | "main" | "icon" | null | undefined;
 } & class_variance_authority_types0.ClassProp) | undefined) => string;
 declare function Header({
   nav,

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

@@ -41,6 +41,6 @@ declare function NavbarLinkItem({
   ...props
 }: {
   item: LinkItemType;
-} & HTMLAttributes<HTMLElement>): string | number | bigint | boolean | react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+} & HTMLAttributes<HTMLElement>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime0.JSX.Element | null | undefined;
 //#endregion
 export { LayoutBody, LayoutContext, LayoutContextProvider, LayoutHeader, LayoutHeaderTabs, LayoutInfo, NavbarLinkItem };

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

@@ -150,7 +150,7 @@ function PageFooter({ items, children, className, ...props }) {
 	const pathname = usePathname();
 	const { previous, next } = useMemo(() => {
 		if (items) return items;
-		const idx = footerList.findIndex((item) => isActive(item.url, pathname, false));
+		const idx = footerList.findIndex((item) => isActive(item.url, pathname));
 		if (idx === -1) return {};
 		return {
 			previous: footerList[idx - 1],

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

@@ -1,4 +1,4 @@
-import { ButtonItemType, CustomItemType, IconItemType, LinkItem, LinkItemType, MainItemType, MenuItemType } from "../../utils/link-item.js";
+import { ButtonItemType, CustomItemType, IconItemType, LinkItem, LinkItemType, MainItemType, MenuItemType, useLinkItemActive } from "../../utils/link-item.js";
 import * as react from "react";
 import { ComponentProps, ReactNode } from "react";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
@@ -62,7 +62,7 @@ declare function resolveLinkItems({
 declare function renderTitleNav({
   title,
   url
-}: Partial<NavOptions>, props: ComponentProps<'a'>): string | number | bigint | boolean | react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+}: Partial<NavOptions>, props: ComponentProps<'a'>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime0.JSX.Element | null | undefined;
 declare function useLinkItems({
   githubUrl,
   links
@@ -72,4 +72,4 @@ declare function useLinkItems({
   all: LinkItemType[];
 };
 //#endregion
-export { BaseLayoutProps, ButtonItemType, CustomItemType, IconItemType, LinkItem, LinkItemType, MainItemType, MenuItemType, NavOptions, renderTitleNav, resolveLinkItems, useLinkItems };
+export { BaseLayoutProps, ButtonItemType, CustomItemType, IconItemType, LinkItem, LinkItemType, MainItemType, MenuItemType, NavOptions, renderTitleNav, resolveLinkItems, useLinkItemActive, useLinkItems };

package/dist/style.css

@@ -1092,6 +1092,9 @@
   .max-w-\[900px\] {
     max-width: 900px;
   }
+  .max-w-\[1168px\] {
+    max-width: 1168px;
+  }
   .max-w-\[1200px\] {
     max-width: 1200px;
   }
@@ -2862,10 +2865,12 @@
 :is(pre *):is(.shiki *):not(.not-fumadocs-codeblock *) {
   .line& {
     position: relative;
-    min-height: 1lh;
     padding-left: var(--padding-left);
     padding-right: var(--padding-right);
   }
+  .line:empty& {
+    height: 1lh;
+  }
   .has-focused .line&:not(.focused) {
     filter: blur(2px);
     transition: filter 200ms;

package/dist/utils/link-item.d.ts

@@ -79,7 +79,8 @@ declare function LinkItem({
   item,
   ...props
 }: Omit<ComponentProps<'a'>, 'href'> & {
-  item: WithHref;
+  item: LinkItemType & WithHref;
 }): react_jsx_runtime0.JSX.Element;
+declare function useLinkItemActive(link: LinkItemType): boolean;
 //#endregion
-export { ButtonItemType, CustomItemType, IconItemType, LinkItem, LinkItemType, MainItemType, MenuItemType };
+export { ButtonItemType, CustomItemType, IconItemType, LinkItem, LinkItemType, MainItemType, MenuItemType, useLinkItemActive };

package/dist/utils/link-item.js

@@ -7,9 +7,7 @@ import Link from "fumadocs-core/link";
 
 //#region src/utils/link-item.tsx
 function LinkItem({ ref, item, ...props }) {
-	const pathname = usePathname();
-	const activeType = item.active ?? "url";
-	const active = activeType !== "none" && isActive(item.url, pathname, activeType === "nested-url");
+	const active = useLinkItemActive(item);
 	return /* @__PURE__ */ jsx(Link, {
 		ref,
 		href: item.url,
@@ -19,6 +17,12 @@ function LinkItem({ ref, item, ...props }) {
 		children: props.children
 	});
 }
+function useLinkItemActive(link) {
+	const pathname = usePathname();
+	if (link.type === "custom" || !link.url) return false;
+	if (link.active === "none") return false;
+	return isActive(link.url, pathname, link.active === "nested-url");
+}
 
 //#endregion
-export { LinkItem };
+export { LinkItem, useLinkItemActive };

package/dist/utils/urls.js

@@ -6,7 +6,7 @@ function normalize(urlOrPath) {
 /**
 * @returns if `href` is matching the given pathname
 */
-function isActive(href, pathname, nested = true) {
+function isActive(href, pathname, nested = false) {
 	href = normalize(href);
 	pathname = normalize(pathname);
 	return href === pathname || nested && pathname.startsWith(`${href}/`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-ui",
-  "version": "16.6.1",
+  "version": "16.6.3",
   "description": "The Radix UI version of Fumadocs UI",
   "keywords": [
     "Docs",
@@ -113,14 +113,14 @@
     "@radix-ui/react-slot": "^1.2.4",
     "@radix-ui/react-tabs": "^1.1.13",
     "class-variance-authority": "^0.7.1",
-    "lucide-react": "^0.563.0",
+    "lucide-react": "^0.570.0",
     "motion": "^12.34.0",
     "next-themes": "^0.4.6",
     "react-medium-image-zoom": "^5.4.0",
     "react-remove-scroll": "^2.7.2",
     "rehype-raw": "^7.0.0",
     "scroll-into-view-if-needed": "^3.1.0",
-    "tailwind-merge": "^3.4.0",
+    "tailwind-merge": "^3.4.1",
     "unist-util-visit": "^5.1.0",
     "@fumadocs/tailwind": "0.0.2"
   },
@@ -135,7 +135,7 @@
     "unified": "^11.0.5",
     "@fumadocs/cli": "1.2.4",
     "eslint-config-custom": "0.0.0",
-    "fumadocs-core": "16.6.1",
+    "fumadocs-core": "16.6.3",
     "tsconfig": "0.0.0"
   },
   "peerDependencies": {
@@ -143,7 +143,7 @@
     "next": "16.x.x",
     "react": "^19.2.0",
     "react-dom": "^19.2.0",
-    "fumadocs-core": "16.6.1"
+    "fumadocs-core": "16.6.3"
   },
   "peerDependenciesMeta": {
     "next": {