fumandocs-ui 0.0.0-stage → 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Xiao Hanyu (https://xiaohanyu.me)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,43 @@
-# Temporary Holding Version
+# fumandocs-ui
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Mantine UI for [Fumadocs](https://fumadocs.dev): docs layout, page primitives,
+provider, search, and MDX components — no Tailwind CSS.
+
+## Install
+
+```bash
+pnpm add fumandocs-ui @mantine/core @mantine/hooks fumadocs-core fumadocs-mdx
+```
+
+Import from **`fumandocs-ui/...`**. Upstream Fumadocs docs use the name
+`fumadocs-ui`; swap the package name for the subpaths we support (see the
+Fumandocs site export-compatibility page).
+
+## Root layout (Next.js)
+
+```tsx
+import "@mantine/core/styles.css";
+import "fumandocs-ui/style.css";
+import { ColorSchemeScript } from "@mantine/core";
+import { RootProvider } from "fumandocs-ui/provider/next";
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en" suppressHydrationWarning>
+      <head>
+        <ColorSchemeScript defaultColorScheme="auto" />
+      </head>
+      <body>
+        <RootProvider>{children}</RootProvider>
+      </body>
+    </html>
+  );
+}
+```
+
+See the Fumandocs monorepo `apps/www` for a full site (`pnpm dev:site` from the
+root).

package/dist/components/callout.d.ts

@@ -0,0 +1,20 @@
+import { PaperProps } from "@mantine/core";
+import { ReactNode } from "react";
+//#region src/components/callout.d.ts
+type CalloutType = 'info' | 'warn' | 'warning' | 'error' | 'success' | 'idea';
+interface CalloutContainerProps extends Omit<PaperProps, 'title'> {
+  type?: CalloutType;
+  title?: ReactNode;
+  icon?: ReactNode;
+  children?: ReactNode;
+}
+declare function Callout({ title, children, type, icon, ...props }: CalloutContainerProps): import("react").JSX.Element;
+declare function CalloutContainer(props: CalloutContainerProps): import("react").JSX.Element;
+declare function CalloutTitle({ children }: {
+  children?: ReactNode;
+}): import("react").JSX.Element;
+declare function CalloutDescription({ children }: {
+  children?: ReactNode;
+}): import("react").JSX.Element;
+//#endregion
+export { Callout, CalloutContainer, CalloutContainerProps, CalloutDescription, CalloutTitle, CalloutType };

package/dist/components/callout.js

@@ -0,0 +1,101 @@
+import callout_module_default from "./callout.module.js";
+import { Box, Paper, Text } from "@mantine/core";
+import { CheckCircleIcon, InfoIcon, LightbulbIcon, WarningIcon, XCircleIcon } from "@phosphor-icons/react/ssr";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/callout.tsx
+/**
+* MIT License
+*
+* Copyright (c) 2026 Xiao Hanyu (https://xiaohanyu.me)
+*
+* Permission is hereby granted, free of charge, to any person obtaining a copy
+* of this software and associated documentation files (the "Software"), to deal
+* in the Software without restriction, including without limitation the rights
+* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+* copies of the Software, and to permit persons to whom the Software is
+* furnished to do so, subject to the following conditions:
+*
+* The above copyright notice and this permission notice shall be included in all
+* copies or substantial portions of the Software.
+*
+* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+* SOFTWARE.
+*
+*/
+function normalizeType(type) {
+	return type === "warn" ? "warning" : type;
+}
+const defaultIcons = {
+	info: /* @__PURE__ */ jsx(InfoIcon, {
+		size: 14,
+		"aria-hidden": true
+	}),
+	warning: /* @__PURE__ */ jsx(WarningIcon, {
+		size: 14,
+		"aria-hidden": true
+	}),
+	error: /* @__PURE__ */ jsx(XCircleIcon, {
+		size: 14,
+		"aria-hidden": true
+	}),
+	success: /* @__PURE__ */ jsx(CheckCircleIcon, {
+		size: 14,
+		"aria-hidden": true
+	}),
+	idea: /* @__PURE__ */ jsx(LightbulbIcon, {
+		size: 14,
+		"aria-hidden": true
+	})
+};
+function Callout({ title, children, type = "info", icon, ...props }) {
+	const resolved = normalizeType(type);
+	const iconEl = /* @__PURE__ */ jsx("span", {
+		className: callout_module_default.icon,
+		"aria-hidden": true,
+		children: icon ?? defaultIcons[resolved]
+	});
+	return /* @__PURE__ */ jsxs(Paper, {
+		withBorder: true,
+		radius: "xs",
+		...props,
+		"data-type": resolved,
+		className: [callout_module_default.root, props.className].filter(Boolean).join(" "),
+		children: [/* @__PURE__ */ jsx("span", {
+			className: callout_module_default.bar,
+			"aria-hidden": true
+		}), title ? /* @__PURE__ */ jsxs(Box, {
+			className: callout_module_default.content,
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: callout_module_default.header,
+				children: [iconEl, /* @__PURE__ */ jsx(CalloutTitle, { children: title })]
+			}), /* @__PURE__ */ jsx(CalloutDescription, { children })]
+		}) : /* @__PURE__ */ jsxs(Fragment, { children: [iconEl, /* @__PURE__ */ jsx(Box, {
+			className: callout_module_default.content,
+			children: /* @__PURE__ */ jsx(CalloutDescription, { children })
+		})] })]
+	});
+}
+function CalloutContainer(props) {
+	return /* @__PURE__ */ jsx(Callout, { ...props });
+}
+function CalloutTitle({ children }) {
+	return /* @__PURE__ */ jsx(Text, {
+		fw: 500,
+		size: "sm",
+		className: callout_module_default.title,
+		children
+	});
+}
+function CalloutDescription({ children }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: callout_module_default.description,
+		children
+	});
+}
+//#endregion
+export { Callout, CalloutContainer, CalloutDescription, CalloutTitle };

package/dist/components/callout.module.js

@@ -0,0 +1,12 @@
+//#region src/components/callout.module.css
+var callout_module_default = {
+	"bar": "B98Wza_bar",
+	"content": "B98Wza_content",
+	"description": "B98Wza_description",
+	"header": "B98Wza_header",
+	"icon": "B98Wza_icon",
+	"root": "B98Wza_root",
+	"title": "B98Wza_title"
+};
+//#endregion
+export { callout_module_default as default };

package/dist/components/card.d.ts

@@ -0,0 +1,14 @@
+import { SimpleGridProps } from "@mantine/core";
+import { HTMLAttributes, ReactNode } from "react";
+//#region src/components/card.d.ts
+declare function Cards(props: SimpleGridProps): import("react").JSX.Element;
+interface CardProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
+  title: ReactNode;
+  description?: ReactNode;
+  icon?: ReactNode;
+  href?: string;
+  external?: boolean;
+}
+declare function Card({ title, description, icon, href, external, children, ...props }: CardProps): import("react").JSX.Element;
+//#endregion
+export { Card, CardProps, Cards };

package/dist/components/card.js

@@ -0,0 +1,85 @@
+import card_module_default from "./card.module.js";
+import { Card as Card$1, SimpleGrid, Text, ThemeIcon } from "@mantine/core";
+import Link from "fumadocs-core/link";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/card.tsx
+/**
+* MIT License
+*
+* Copyright (c) 2026 Xiao Hanyu (https://xiaohanyu.me)
+*
+* Permission is hereby granted, free of charge, to any person obtaining a copy
+* of this software and associated documentation files (the "Software"), to deal
+* in the Software without restriction, including without limitation the rights
+* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+* copies of the Software, and to permit persons to whom the Software is
+* furnished to do so, subject to the following conditions:
+*
+* The above copyright notice and this permission notice shall be included in all
+* copies or substantial portions of the Software.
+*
+* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+* SOFTWARE.
+*
+*/
+function Cards(props) {
+	return /* @__PURE__ */ jsx(SimpleGrid, {
+		cols: {
+			base: 1,
+			sm: 2
+		},
+		spacing: 16,
+		...props
+	});
+}
+function Card({ title, description, icon, href, external, children, ...props }) {
+	const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+		icon && /* @__PURE__ */ jsx(ThemeIcon, {
+			variant: "default",
+			radius: "md",
+			mb: "sm",
+			className: card_module_default.icon,
+			children: icon
+		}),
+		/* @__PURE__ */ jsx(Text, {
+			fw: 500,
+			size: "sm",
+			children: title
+		}),
+		description && /* @__PURE__ */ jsx(Text, {
+			size: "sm",
+			mt: 4,
+			children: description
+		}),
+		children && /* @__PURE__ */ jsx("div", {
+			className: card_module_default.content,
+			children
+		})
+	] });
+	if (href) return /* @__PURE__ */ jsx(Card$1, {
+		component: Link,
+		href,
+		external,
+		withBorder: true,
+		padding: "md",
+		radius: "xs",
+		className: card_module_default.root,
+		...props,
+		children: content
+	});
+	return /* @__PURE__ */ jsx(Card$1, {
+		withBorder: true,
+		padding: "md",
+		radius: "xs",
+		className: card_module_default.root,
+		...props,
+		children: content
+	});
+}
+//#endregion
+export { Card, Cards };

package/dist/components/card.module.js

@@ -0,0 +1,8 @@
+//#region src/components/card.module.css
+var card_module_default = {
+	"content": "AW5OGG_content",
+	"icon": "AW5OGG_icon",
+	"root": "AW5OGG_root"
+};
+//#endregion
+export { card_module_default as default };

package/dist/components/codeblock.d.ts

@@ -0,0 +1,22 @@
+import { Tabs } from "@mantine/core";
+import { ComponentProps, HTMLAttributes, ReactNode } from "react";
+//#region src/components/codeblock.d.ts
+interface CodeBlockProps extends Omit<ComponentProps<'figure'>, 'title'> {
+  title?: ReactNode;
+  icon?: ReactNode;
+  allowCopy?: boolean | 'true' | 'false';
+  viewportProps?: HTMLAttributes<HTMLDivElement>;
+  keepBackground?: boolean;
+}
+declare function Pre(props: ComponentProps<'pre'>): import("react").JSX.Element;
+declare function CodeBlock({ title, icon, allowCopy, viewportProps, children, ...props }: CodeBlockProps): import("react").JSX.Element;
+interface CodeBlockTabsProps extends Omit<ComponentProps<typeof Tabs>, 'groupId' | 'persist'> {
+  groupId?: string;
+  persist?: boolean;
+}
+declare function CodeBlockTabs({ className, groupId, persist, ...props }: CodeBlockTabsProps): import("react").JSX.Element;
+declare function CodeBlockTabsList(props: ComponentProps<typeof Tabs.List>): import("react").JSX.Element;
+declare function CodeBlockTabsTrigger(props: ComponentProps<typeof Tabs.Tab>): import("react").JSX.Element;
+declare function CodeBlockTab(props: ComponentProps<typeof Tabs.Panel>): import("react").JSX.Element;
+//#endregion
+export { CodeBlock, CodeBlockProps, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsProps, CodeBlockTabsTrigger, Pre };

package/dist/components/codeblock.js

@@ -0,0 +1,94 @@
+"use client";
+import codeblock_module_default from "./codeblock.module.js";
+import { ActionIcon, Group, Paper, Tabs, Text } from "@mantine/core";
+import { CheckIcon, CopyIcon } from "@phosphor-icons/react/ssr";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useRef, useState } from "react";
+//#region src/components/codeblock.tsx
+/**
+* MIT License
+*
+* Copyright (c) 2026 Xiao Hanyu (https://xiaohanyu.me)
+*
+* Permission is hereby granted, free of charge, to any person obtaining a copy
+* of this software and associated documentation files (the "Software"), to deal
+* in the Software without restriction, including without limitation the rights
+* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+* copies of the Software, and to permit persons to whom the Software is
+* furnished to do so, subject to the following conditions:
+*
+* The above copyright notice and this permission notice shall be included in all
+* copies or substantial portions of the Software.
+*
+* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+* SOFTWARE.
+*
+*/
+function Pre(props) {
+	return /* @__PURE__ */ jsx("pre", { ...props });
+}
+function CodeBlock({ title, icon, allowCopy = true, viewportProps, children, ...props }) {
+	const ref = useRef(null);
+	const [copied, setCopied] = useState(false);
+	const copy = async () => {
+		const content = ref.current?.querySelector("pre")?.textContent ?? ref.current?.textContent ?? "";
+		await navigator.clipboard.writeText(content);
+		setCopied(true);
+		window.setTimeout(() => setCopied(false), 1500);
+	};
+	return /* @__PURE__ */ jsxs(Paper, {
+		component: "figure",
+		withBorder: true,
+		radius: "xs",
+		...props,
+		className: [codeblock_module_default.root, props.className].filter(Boolean).join(" "),
+		children: [(title || icon) && /* @__PURE__ */ jsxs(Group, {
+			className: codeblock_module_default.header,
+			gap: "xs",
+			children: [icon, /* @__PURE__ */ jsx(Text, {
+				component: "figcaption",
+				size: "sm",
+				fw: 500,
+				children: title
+			})]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: codeblock_module_default.body,
+			children: [/* @__PURE__ */ jsx("div", {
+				ref,
+				...viewportProps,
+				className: [codeblock_module_default.viewport, viewportProps?.className].filter(Boolean).join(" "),
+				children
+			}), allowCopy !== false && allowCopy !== "false" && /* @__PURE__ */ jsx(ActionIcon, {
+				onClick: copy,
+				variant: "subtle",
+				color: "gray",
+				className: codeblock_module_default.copyButton,
+				"aria-label": "Copy code",
+				children: copied ? /* @__PURE__ */ jsx(CheckIcon, { size: 14 }) : /* @__PURE__ */ jsx(CopyIcon, { size: 14 })
+			})]
+		})]
+	});
+}
+function CodeBlockTabs({ className, groupId, persist, ...props }) {
+	return /* @__PURE__ */ jsx(Tabs, {
+		keepMounted: false,
+		...props,
+		className: [codeblock_module_default.codeTabs, className].filter(Boolean).join(" ")
+	});
+}
+function CodeBlockTabsList(props) {
+	return /* @__PURE__ */ jsx(Tabs.List, { ...props });
+}
+function CodeBlockTabsTrigger(props) {
+	return /* @__PURE__ */ jsx(Tabs.Tab, { ...props });
+}
+function CodeBlockTab(props) {
+	return /* @__PURE__ */ jsx(Tabs.Panel, { ...props });
+}
+//#endregion
+export { CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, Pre };

package/dist/components/codeblock.module.js

@@ -0,0 +1,11 @@
+//#region src/components/codeblock.module.css
+var codeblock_module_default = {
+	"body": "_3213aW_body",
+	"codeTabs": "_3213aW_codeTabs",
+	"copyButton": "_3213aW_copyButton",
+	"header": "_3213aW_header",
+	"root": "_3213aW_root",
+	"viewport": "_3213aW_viewport"
+};
+//#endregion
+export { codeblock_module_default as default };

package/dist/components/heading.d.ts

@@ -0,0 +1,9 @@
+import { ComponentPropsWithoutRef } from "react";
+//#region src/components/heading.d.ts
+type HeadingTag = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+type HeadingProps<T extends HeadingTag = 'h2'> = Omit<ComponentPropsWithoutRef<T>, 'as'> & {
+  as?: T;
+};
+declare function Heading<T extends HeadingTag = 'h2'>({ as, children, ...props }: HeadingProps<T>): import("react").JSX.Element;
+//#endregion
+export { Heading, HeadingProps };

package/dist/components/heading.js

@@ -0,0 +1,55 @@
+"use client";
+import heading_module_default from "./heading.module.js";
+import { ActionIcon } from "@mantine/core";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/heading.tsx
+/**
+* MIT License
+*
+* Copyright (c) 2026 Xiao Hanyu (https://xiaohanyu.me)
+*
+* Permission is hereby granted, free of charge, to any person obtaining a copy
+* of this software and associated documentation files (the "Software"), to deal
+* in the Software without restriction, including without limitation the rights
+* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+* copies of the Software, and to permit persons to whom the Software is
+* furnished to do so, subject to the following conditions:
+*
+* The above copyright notice and this permission notice shall be included in all
+* copies or substantial portions of the Software.
+*
+* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+* SOFTWARE.
+*
+*/
+function Heading({ as, children, ...props }) {
+	const Element = as ?? "h2";
+	if (!props.id) return /* @__PURE__ */ jsx(Element, {
+		...props,
+		children
+	});
+	return /* @__PURE__ */ jsxs(Element, {
+		...props,
+		className: [heading_module_default.root, props.className].filter(Boolean).join(" "),
+		children: [/* @__PURE__ */ jsx("a", {
+			href: `#${props.id}`,
+			children
+		}), /* @__PURE__ */ jsx(ActionIcon, {
+			component: "a",
+			href: `#${props.id}`,
+			variant: "subtle",
+			color: "gray",
+			size: "sm",
+			"aria-label": "Link to this heading",
+			className: heading_module_default.anchor,
+			children: "#"
+		})]
+	});
+}
+//#endregion
+export { Heading };

package/dist/components/heading.module.js

@@ -0,0 +1,7 @@
+//#region src/components/heading.module.css
+var heading_module_default = {
+	"anchor": "WqEc9W_anchor",
+	"root": "WqEc9W_root"
+};
+//#endregion
+export { heading_module_default as default };

package/dist/components/toc.d.ts

@@ -0,0 +1,14 @@
+import { ComponentProps } from "react";
+import * as Primitive from "fumadocs-core/toc";
+//#region src/components/toc.d.ts
+interface TOCRailProps extends ComponentProps<'div'> {
+  items: Primitive.TOCItemType[];
+  thumbBox?: boolean;
+}
+declare function TOCRail({ items, thumbBox, className, children, ...props }: TOCRailProps): import("react").JSX.Element;
+declare function TOCRailItem({ item, items, ...props }: Primitive.TOCItemProps & {
+  item: Primitive.TOCItemType;
+  items: Primitive.TOCItemType[];
+}): import("react").JSX.Element;
+//#endregion
+export { TOCRail, TOCRailItem, TOCRailProps };