fumadocs-ui 16.8.0 → 16.8.2

package/css/generated/docs.css

@@ -200,6 +200,7 @@
 @source inline("h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))]");
 @source inline("h1");
 @source inline("header");
+@source inline("height");
 @source inline("hidden");
 @source inline("hideIfDisabled");
 @source inline("highlight");
@@ -500,6 +501,7 @@
 @source inline("w-4");
 @source inline("w-[85%]");
 @source inline("w-full");
+@source inline("width");
 @source inline("will");
 @source inline("wrap-anywhere");
 @source inline("xl:hidden");

package/css/generated/flux.css

@@ -161,6 +161,7 @@
 @source inline("h1");
 @source inline("head");
 @source inline("header");
+@source inline("height");
 @source inline("hide");
 @source inline("hideIfDisabled");
 @source inline("highlight");
@@ -424,6 +425,7 @@
 @source inline("w-[calc(100%-var(--removed-body-scroll-bar-size,0px))]");
 @source inline("w-full");
 @source inline("wait");
+@source inline("width");
 @source inline("wrap-anywhere");
 @source inline("xl:layout:[--fd-toc-width:268px]");
 @source inline("xl:pt-14");

package/css/generated/home.css

@@ -34,7 +34,7 @@
 @source inline("context");
 @source inline("createContext");
 @source inline("custom");
-@source inline("customise");
+@source inline("customize");
 @source inline("cva");
 @source inline("data-[active=true]:font-medium");
 @source inline("data-[active=true]:text-fd-primary");

package/css/generated/notebook.css

@@ -215,6 +215,7 @@
 @source inline("has-data-[active=true]:text-fd-primary");
 @source inline("has-data-[collapsed=true]:md:flex");
 @source inline("header");
+@source inline("height");
 @source inline("hidden");
 @source inline("hideIfDisabled");
 @source inline("highlight");
@@ -528,6 +529,7 @@
 @source inline("w-4");
 @source inline("w-[85%]");
 @source inline("w-full");
+@source inline("width");
 @source inline("will");
 @source inline("window");
 @source inline("wrap-anywhere");

package/css/generated/shared.css

@@ -111,6 +111,7 @@
 @source inline("async");
 @source inline("at");
 @source inline("attribute");
+@source inline("auto");
 @source inline("await");
 @source inline("backdrop-blur-lg");
 @source inline("backdrop-blur-xs");
@@ -159,6 +160,7 @@
 @source inline("border-s");
 @source inline("border-t");
 @source inline("border-transparent");
+@source inline("borderBottom");
 @source inline("bottom");
 @source inline("bottom-0");
 @source inline("bottom-1.5");
@@ -230,7 +232,7 @@
 @source inline("current");
 @source inline("currentColor");
 @source inline("custom");
-@source inline("customise");
+@source inline("customize");
 @source inline("cva");
 @source inline("cx");
 @source inline("cy");
@@ -238,6 +240,7 @@
 @source inline("dangerouslySetInnerHTML");
 @source inline("dark");
 @source inline("dark:bg-(--shiki-dark-bg)");
+@source inline("dashed");
 @source inline("data");
 @source inline("data-[active=true]:text-fd-primary");
 @source inline("data-[motion=from-end]:animate-fd-enterFromRight");
@@ -572,13 +575,16 @@
 @source inline("lower");
 @source inline("lowerOffset");
 @source inline("ltr");
+@source inline("lucide");
+@source inline("lucide-book");
+@source inline("lucide-book-icon");
 @source inline("lucide-react");
 @source inline("made");
 @source inline("main");
 @source inline("make");
 @source inline("mapped");
 @source inline("margin");
-@source inline("marginBottom");
+@source inline("marginTop");
 @source inline("mark");
 @source inline("markdownUrl");
 @source inline("marked");
@@ -747,6 +753,7 @@
 @source inline("p-3");
 @source inline("p-4");
 @source inline("padding");
+@source inline("paddingBottom");
 @source inline("paddingInlineStart");
 @source inline("page");
 @source inline("pageUrl");
@@ -942,6 +949,7 @@
 @source inline("simple");
 @source inline("since");
 @source inline("single");
+@source inline("site");
 @source inline("size");
 @source inline("size-1");
 @source inline("size-3");

package/dist/components/banner.d.ts

@@ -20,7 +20,7 @@ declare function Banner({
    */
   variant?: BannerVariant;
   /**
-   * For rainbow variant only, customise the colors
+   * For rainbow variant only, customize the colors
    */
   rainbowColors?: string[];
   /**

package/dist/components/ui/button.d.ts

@@ -5,7 +5,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 declare const buttonVariants: (props?: ({
   variant?: "primary" | "outline" | "ghost" | "secondary" | null | undefined;
   color?: "primary" | "outline" | "ghost" | "secondary" | null | undefined;
-  size?: "icon" | "sm" | "icon-sm" | "icon-xs" | null | undefined;
+  size?: "sm" | "icon" | "icon-sm" | "icon-xs" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 type ButtonProps = VariantProps<typeof buttonVariants>;
 //#endregion

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

@@ -102,7 +102,7 @@ function PageTOCPopoverTrigger({ className, ...props }) {
 		...props,
 		children: [
 			/* @__PURE__ */ jsx(ProgressCircle, {
-				value: (selectedIdx + 1) / Math.max(1, items.length),
+				value: (items.findLastIndex((item) => item.active) + 1) / Math.max(1, items.length),
 				max: 1,
 				className: cn("shrink-0", open && "text-fd-primary")
 			}),
@@ -125,9 +125,9 @@ function clamp(input, min, max) {
 	if (input > max) return max;
 	return input;
 }
-function ProgressCircle({ value, strokeWidth = 2, size = 24, min = 0, max = 100, ...restSvgProps }) {
+function ProgressCircle({ value, strokeWidth = 1.5, size = 18, min = 0, max = 100, style, ...restSvgProps }) {
 	const normalizedValue = clamp(value, min, max);
-	const radius = (size - strokeWidth) / 2;
+	const radius = size / 2 - strokeWidth;
 	const circumference = 2 * Math.PI * radius;
 	const progress = normalizedValue / max * circumference;
 	const circleProps = {
@@ -143,6 +143,11 @@ function ProgressCircle({ value, strokeWidth = 2, size = 24, min = 0, max = 100,
 		"aria-valuenow": normalizedValue,
 		"aria-valuemin": min,
 		"aria-valuemax": max,
+		style: {
+			width: size,
+			height: size,
+			...style
+		},
 		...restSvgProps,
 		children: [/* @__PURE__ */ jsx("circle", {
 			...circleProps,

package/dist/layouts/flux/page/slots/toc.js

@@ -102,7 +102,7 @@ function PageTOCPopoverTrigger({ className, ...props }) {
 		...props,
 		children: [
 			/* @__PURE__ */ jsx(ProgressCircle, {
-				value: (selectedIdx + 1) / Math.max(1, items.length),
+				value: (items.findLastIndex((item) => item.active) + 1) / Math.max(1, items.length),
 				max: 1,
 				className: cn("shrink-0", open && "text-fd-primary")
 			}),
@@ -128,9 +128,9 @@ function clamp(input, min, max) {
 	if (input > max) return max;
 	return input;
 }
-function ProgressCircle({ value, strokeWidth = 2, size = 24, min = 0, max = 100, ...restSvgProps }) {
+function ProgressCircle({ value, strokeWidth = 1.5, size = 18, min = 0, max = 100, style, ...restSvgProps }) {
 	const normalizedValue = clamp(value, min, max);
-	const radius = (size - strokeWidth) / 2;
+	const radius = size / 2 - strokeWidth;
 	const circumference = 2 * Math.PI * radius;
 	const progress = normalizedValue / max * circumference;
 	const circleProps = {
@@ -146,6 +146,11 @@ function ProgressCircle({ value, strokeWidth = 2, size = 24, min = 0, max = 100,
 		"aria-valuenow": normalizedValue,
 		"aria-valuemin": min,
 		"aria-valuemax": max,
+		style: {
+			width: size,
+			height: size,
+			...style
+		},
 		...restSvgProps,
 		children: [/* @__PURE__ */ jsx("circle", {
 			...circleProps,

package/dist/layouts/home/not-found.d.ts

@@ -2,7 +2,7 @@ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/layouts/home/not-found.d.ts
 /**
- * the default not found page content, please make your own if you want to customise it.
+ * the default not found page content, please make your own if you want to customize it.
  */
 declare function DefaultNotFound(): _$react_jsx_runtime0.JSX.Element;
 //#endregion

package/dist/layouts/home/not-found.js

@@ -5,7 +5,7 @@ import Link from "fumadocs-core/link";
 import { HomeIcon } from "lucide-react";
 //#region src/layouts/home/not-found.tsx
 /**
-* the default not found page content, please make your own if you want to customise it.
+* the default not found page content, please make your own if you want to customize it.
 */
 function DefaultNotFound() {
 	return /* @__PURE__ */ jsxs("div", {

package/dist/layouts/home/slots/header.d.ts

@@ -5,7 +5,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 
 //#region src/layouts/home/slots/header.d.ts
 declare const navItemVariants: (props?: ({
-  variant?: "icon" | "main" | "button" | null | undefined;
+  variant?: "icon" | "button" | "main" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 declare function Header(props: ComponentProps<'header'>): string | number | bigint | true | _$react_jsx_runtime0.JSX.Element | Iterable<_$react.ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<_$react.ReactNode> | null | undefined>;
 //#endregion

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

@@ -6,18 +6,17 @@ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import * as PageTree from "fumadocs-core/page-tree";
 
 //#region src/layouts/notebook/index.d.ts
-interface DocsLayoutProps extends BaseLayoutProps {
+interface DocsLayoutProps extends Omit<BaseLayoutProps, 'nav'> {
   tree: PageTree.Root;
   tabs?: LayoutTab[] | GetLayoutTabsOptions | false;
   tabMode?: 'sidebar' | 'navbar';
   sidebar?: SidebarOptions;
-  nav?: Nav;
+  nav?: NavOptions & {
+    mode?: 'top' | 'auto';
+  };
   containerProps?: HTMLAttributes<HTMLDivElement>;
   slots?: Partial<DocsSlots>;
 }
-interface Nav extends NavOptions {
-  mode?: 'top' | 'auto';
-}
 interface SidebarOptions extends SidebarProps, SidebarProviderProps {
   /**
    * @deprecated use layout-level `tabs` option instead.
@@ -36,4 +35,4 @@ declare function DocsLayout({
   ...props
 }: DocsLayoutProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { DocsLayout, DocsLayoutProps, type DocsSlots, useNotebookLayout };
+export { DocsLayout, DocsLayoutProps, type DocsSlots, SidebarOptions, useNotebookLayout };

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

@@ -101,7 +101,7 @@ function PageTOCPopoverTrigger({ className, ...props }) {
 		...props,
 		children: [
 			/* @__PURE__ */ jsx(ProgressCircle, {
-				value: (selectedIdx + 1) / Math.max(1, items.length),
+				value: (items.findLastIndex((item) => item.active) + 1) / Math.max(1, items.length),
 				max: 1,
 				className: cn("shrink-0", open && "text-fd-primary")
 			}),
@@ -124,9 +124,9 @@ function clamp(input, min, max) {
 	if (input > max) return max;
 	return input;
 }
-function ProgressCircle({ value, strokeWidth = 2, size = 24, min = 0, max = 100, ...restSvgProps }) {
+function ProgressCircle({ value, strokeWidth = 1.5, size = 18, min = 0, max = 100, style, ...restSvgProps }) {
 	const normalizedValue = clamp(value, min, max);
-	const radius = (size - strokeWidth) / 2;
+	const radius = size / 2 - strokeWidth;
 	const circumference = 2 * Math.PI * radius;
 	const progress = normalizedValue / max * circumference;
 	const circleProps = {
@@ -142,6 +142,11 @@ function ProgressCircle({ value, strokeWidth = 2, size = 24, min = 0, max = 100,
 		"aria-valuenow": normalizedValue,
 		"aria-valuemin": min,
 		"aria-valuemax": max,
+		style: {
+			width: size,
+			height: size,
+			...style
+		},
 		...restSvgProps,
 		children: [/* @__PURE__ */ jsx("circle", {
 			...circleProps,

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

@@ -41,7 +41,7 @@ interface BaseLayoutProps {
   themeSwitch?: ThemeSwitchOptions;
   searchToggle?: SearchToggleOptions;
   /**
-   * @deprecated this is now optional for i18n setups, you can still customise language switch from `slots`.
+   * @deprecated this is now optional for i18n setups, you can still customize language switch from `slots`.
    */
   i18n?: boolean | I18nConfig;
 }

package/dist/layouts/shared/page-actions.d.ts

@@ -4,7 +4,7 @@ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/layouts/shared/page-actions.d.ts
 /**
- * see https://fumadocs.dev/docs/integrations/llms#page-actions to customise.
+ * see https://fumadocs.dev/docs/integrations/llms#page-actions to customize.
  */
 declare function MarkdownCopyButton({
   markdownUrl,
@@ -16,7 +16,7 @@ declare function MarkdownCopyButton({
   markdownUrl: string;
 }): _$react_jsx_runtime0.JSX.Element;
 /**
- * see https://fumadocs.dev/docs/integrations/llms#page-actions to customise.
+ * see https://fumadocs.dev/docs/integrations/llms#page-actions to customize.
  */
 declare function ViewOptionsPopover({
   markdownUrl,

package/dist/layouts/shared/page-actions.js

@@ -10,7 +10,7 @@ import { Check, ChevronDown, Copy, ExternalLinkIcon, TextIcon } from "lucide-rea
 //#region src/layouts/shared/page-actions.tsx
 const cache = /* @__PURE__ */ new Map();
 /**
-* see https://fumadocs.dev/docs/integrations/llms#page-actions to customise.
+* see https://fumadocs.dev/docs/integrations/llms#page-actions to customize.
 */
 function MarkdownCopyButton({ markdownUrl, ...props }) {
 	const [isLoading, setLoading] = useState(false);
@@ -39,7 +39,7 @@ function MarkdownCopyButton({ markdownUrl, ...props }) {
 	});
 }
 /**
-* see https://fumadocs.dev/docs/integrations/llms#page-actions to customise.
+* see https://fumadocs.dev/docs/integrations/llms#page-actions to customize.
 */
 function ViewOptionsPopover({ markdownUrl, githubUrl, ...props }) {
 	const pathname = usePathname();

package/dist/og.d.ts

@@ -16,6 +16,7 @@ declare function generateOGImage(options: GenerateProps & ImageResponseOptions):
 declare function generate({
   primaryColor,
   primaryTextColor,
+  icon,
   ...props
 }: GenerateProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion

package/dist/og.js

@@ -16,7 +16,25 @@ function generateOGImage(options) {
 		...rest
 	});
 }
-function generate({ primaryColor = "rgba(255,150,255,0.3)", primaryTextColor = "rgb(255,150,255)", ...props }) {
+function generate({ primaryColor = "rgba(255,150,255,0.3)", primaryTextColor = "rgb(255,150,255)", icon = /* @__PURE__ */ jsx("svg", {
+	xmlns: "http://www.w3.org/2000/svg",
+	width: "56",
+	height: "56",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "2",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	className: "lucide lucide-book-icon lucide-book",
+	children: /* @__PURE__ */ jsx("circle", {
+		cx: "12",
+		cy: "12",
+		r: "11",
+		stroke: primaryTextColor,
+		strokeWidth: "2"
+	})
+}), ...props }) {
 	return /* @__PURE__ */ jsxs("div", {
 		style: {
 			display: "flex",
@@ -26,27 +44,9 @@ function generate({ primaryColor = "rgba(255,150,255,0.3)", primaryTextColor = "
 			color: "white",
 			padding: "4rem",
 			backgroundColor: "#0c0c0c",
-			backgroundImage: `linear-gradient(to top right, ${primaryColor}, transparent)`
+			border: `18px ${primaryColor}`
 		},
 		children: [
-			/* @__PURE__ */ jsxs("div", {
-				style: {
-					display: "flex",
-					flexDirection: "row",
-					alignItems: "center",
-					gap: "16px",
-					marginBottom: "12px",
-					color: primaryTextColor
-				},
-				children: [props.icon, /* @__PURE__ */ jsx("p", {
-					style: {
-						fontSize: "56px",
-						fontWeight: 600,
-						margin: 0
-					},
-					children: props.site
-				})]
-			}),
 			/* @__PURE__ */ jsx("p", {
 				style: {
 					fontWeight: 800,
@@ -59,9 +59,30 @@ function generate({ primaryColor = "rgba(255,150,255,0.3)", primaryTextColor = "
 				style: {
 					fontSize: "52px",
 					color: "rgba(240,240,240,0.8)",
-					margin: 0
+					margin: 0,
+					marginTop: "16px",
+					paddingBottom: "28px",
+					borderBottom: `8px dashed ${primaryColor}`
 				},
 				children: props.description
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				style: {
+					display: "flex",
+					flexDirection: "row",
+					alignItems: "center",
+					gap: "20px",
+					marginTop: "auto",
+					color: primaryTextColor
+				},
+				children: [icon, props.site && /* @__PURE__ */ jsx("p", {
+					style: {
+						fontSize: "56px",
+						fontWeight: 600,
+						margin: 0
+					},
+					children: props.site
+				})]
 			})
 		]
 	});

package/dist/provider/base.d.ts

@@ -33,7 +33,7 @@ interface RootProviderProps {
    */
   search?: Partial<SearchOptions>;
   /**
-   * Customise options for `next-themes`
+   * Customize options for `next-themes`
    */
   theme?: ThemeOptions;
   i18n?: Omit<I18nProviderProps, 'children'>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-ui",
-  "version": "16.8.0",
+  "version": "16.8.2",
   "description": "The Radix UI version of Fumadocs UI",
   "keywords": [
     "Docs",
@@ -148,7 +148,7 @@
   },
   "devDependencies": {
     "@tailwindcss/cli": "^4.2.2",
-    "@tsdown/css": "^0.21.8",
+    "@tsdown/css": "^0.21.9",
     "@types/hast": "^3.0.4",
     "@types/mdx": "^2.0.13",
     "@types/node": "^25.6.0",
@@ -157,10 +157,10 @@
     "fuma-cli": "^0.0.5",
     "react-medium-image-zoom": "^5.4.3",
     "tailwindcss": "^4.2.2",
-    "tsdown": "0.21.8",
+    "tsdown": "0.21.9",
     "unified": "^11.0.5",
     "@fumadocs/cli": "1.3.8",
-    "fumadocs-core": "16.8.0",
+    "fumadocs-core": "16.8.2",
     "tsconfig": "0.0.0"
   },
   "peerDependencies": {
@@ -170,7 +170,7 @@
     "next": "16.x.x",
     "react": "^19.2.0",
     "react-dom": "^19.2.0",
-    "fumadocs-core": "16.8.0"
+    "fumadocs-core": "16.8.2"
   },
   "peerDependenciesMeta": {
     "next": {