@farming-labs/theme 0.0.62 → 0.0.64

package/dist/ai-search-dialog.mjs

@@ -1,8 +1,8 @@
 "use client";
 
 import { useCallback, useEffect, useRef, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createPortal } from "react-dom";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { highlight } from "sugar-high";
 
 //#region src/ai-search-dialog.tsx

package/dist/docs-command-search.mjs

@@ -3,8 +3,8 @@
 import { useWindowSearchParams } from "./client-location.mjs";
 import { resolveClientLocale, withLangInUrl } from "./i18n.mjs";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createPortal } from "react-dom";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/docs-command-search.tsx
 function cn(...classes) {

package/dist/docs-page-client.mjs

@@ -6,8 +6,9 @@ import { DocsFeedback } from "./docs-feedback.mjs";
 import { resolveClientLocale, withLangInUrl } from "./i18n.mjs";
 import { Children, cloneElement, isValidElement, useEffect, useState } from "react";
 import { DocsBody, DocsPage, EditOnGitHub } from "fumadocs-ui/layouts/docs/page";
+import { createPortal } from "react-dom";
 import { usePathname, useRouter } from "fumadocs-core/framework";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/docs-page-client.tsx
 /**
@@ -89,10 +90,16 @@ function localizeInternalLinks(root, locale) {
 	}
 }
 function injectTitleDecorations(node, { description, belowTitle }) {
-	if (!description && !belowTitle) return node;
+	if (!description && !belowTitle) return {
+		node,
+		inserted: false
+	};
 	let inserted = false;
 	const extras = [description, belowTitle].filter(Boolean);
-	if (extras.length === 0) return node;
+	if (extras.length === 0) return {
+		node,
+		inserted: false
+	};
 	function visit(current) {
 		if (current == null || typeof current === "boolean") return current;
 		if (inserted) return current;
@@ -114,15 +121,26 @@ function injectTitleDecorations(node, { description, belowTitle }) {
 		if (!inserted) return current;
 		return cloneElement(current, void 0, nextChildren);
 	}
-	if (Array.isArray(node)) return node.flatMap((child) => {
-		const next = visit(child);
-		return Array.isArray(next) ? next : [next];
-	});
-	return visit(node);
+	if (Array.isArray(node)) return {
+		node: node.flatMap((child) => {
+			const next = visit(child);
+			return Array.isArray(next) ? next : [next];
+		}),
+		inserted
+	};
+	return {
+		node: visit(node),
+		inserted
+	};
+}
+function TitleDecorations({ description, belowTitle }) {
+	if (!description && !belowTitle) return null;
+	return /* @__PURE__ */ jsxs(Fragment, { children: [description, belowTitle] });
 }
 function DocsPageClient({ tocEnabled, tocStyle = "default", breadcrumbEnabled = true, entry = "docs", locale, copyMarkdown = false, openDocs = false, openDocsProviders, pageActionsPosition = "below-title", pageActionsAlignment = "left", githubUrl, contentDir, githubBranch = "main", githubDirectory, editOnGithubUrl, lastModifiedMap, lastModified: lastModifiedProp, lastUpdatedEnabled = true, lastUpdatedPosition = "footer", llmsTxtEnabled = false, descriptionMap, description, feedbackEnabled = false, feedbackQuestion, feedbackPlaceholder, feedbackPositiveLabel, feedbackNegativeLabel, feedbackSubmitLabel, feedbackOnFeedback, children }) {
 	const fdTocStyle = tocStyle === "directional" ? "clerk" : void 0;
 	const [toc, setToc] = useState([]);
+	const [titlePortalHost, setTitlePortalHost] = useState(null);
 	const pathname = usePathname();
 	const activeLocale = resolveClientLocale(useWindowSearchParams(), locale);
 	const llmsLangParam = activeLocale ? `&lang=${encodeURIComponent(activeLocale)}` : "";
@@ -163,32 +181,59 @@ function DocsPageClient({ tocEnabled, tocStyle = "default", breadcrumbEnabled =
 	const showLastUpdatedBelowTitle = !!lastModified && lastUpdatedPosition === "below-title";
 	const showLastUpdatedInFooter = !!lastModified && lastUpdatedPosition === "footer";
 	const showFooter = !!githubFileUrl || showLastUpdatedInFooter || llmsTxtEnabled;
-	const decoratedChildren = injectTitleDecorations(children, {
-		description: pageDescription ? /* @__PURE__ */ jsx("p", {
-			className: "fd-page-description",
-			children: pageDescription
-		}) : void 0,
-		belowTitle: showLastUpdatedBelowTitle || showActionsBelowTitle ? /* @__PURE__ */ jsxs("div", {
-			className: "fd-below-title-block not-prose",
-			children: [
-				showLastUpdatedBelowTitle && /* @__PURE__ */ jsxs("p", {
-					className: "fd-last-updated-inline",
-					children: ["Last updated ", lastModified]
-				}),
-				/* @__PURE__ */ jsx("hr", { className: "fd-title-separator" }),
-				showActionsBelowTitle && /* @__PURE__ */ jsx("div", {
-					className: "fd-actions-portal",
-					"data-actions-alignment": pageActionsAlignment,
-					children: /* @__PURE__ */ jsx(PageActions, {
-						copyMarkdown,
-						openDocs,
-						providers: openDocsProviders,
-						githubFileUrl
-					})
+	const titleDescription = pageDescription ? /* @__PURE__ */ jsx("p", {
+		className: "fd-page-description",
+		children: pageDescription
+	}) : void 0;
+	const belowTitleBlock = showLastUpdatedBelowTitle || showActionsBelowTitle ? /* @__PURE__ */ jsxs("div", {
+		className: "fd-below-title-block not-prose",
+		children: [
+			showLastUpdatedBelowTitle && /* @__PURE__ */ jsxs("p", {
+				className: "fd-last-updated-inline",
+				children: ["Last updated ", lastModified]
+			}),
+			/* @__PURE__ */ jsx("hr", { className: "fd-title-separator" }),
+			showActionsBelowTitle && /* @__PURE__ */ jsx("div", {
+				className: "fd-actions-portal",
+				"data-actions-alignment": pageActionsAlignment,
+				children: /* @__PURE__ */ jsx(PageActions, {
+					copyMarkdown,
+					openDocs,
+					providers: openDocsProviders,
+					alignment: pageActionsAlignment,
+					githubFileUrl
 				})
-			]
-		}) : void 0
+			})
+		]
+	}) : void 0;
+	const { node: decoratedChildren, inserted: titleDecorationsInserted } = injectTitleDecorations(children, {
+		description: titleDescription,
+		belowTitle: belowTitleBlock
 	});
+	const needsTitleDecorationsPortal = !titleDecorationsInserted && (!!titleDescription || !!belowTitleBlock);
+	useEffect(() => {
+		if (!needsTitleDecorationsPortal) {
+			setTitlePortalHost(null);
+			return;
+		}
+		const title = document.getElementById("nd-page")?.querySelector("h1");
+		if (!title) {
+			setTitlePortalHost(null);
+			return;
+		}
+		const host = document.createElement("div");
+		host.className = "fd-title-decorations-host";
+		title.insertAdjacentElement("afterend", host);
+		setTitlePortalHost(host);
+		return () => {
+			host.remove();
+			setTitlePortalHost(null);
+		};
+	}, [needsTitleDecorationsPortal, pathname]);
+	const titleDecorationsPortal = needsTitleDecorationsPortal && titlePortalHost ? createPortal(/* @__PURE__ */ jsx(TitleDecorations, {
+		description: titleDescription,
+		belowTitle: belowTitleBlock
+	}), titlePortalHost) : null;
 	return /* @__PURE__ */ jsxs(DocsPage, {
 		toc,
 		tableOfContent: {
@@ -208,11 +253,16 @@ function DocsPageClient({ tocEnabled, tocStyle = "default", breadcrumbEnabled =
 			}),
 			showActionsAboveTitle && /* @__PURE__ */ jsx("div", {
 				className: "fd-below-title-block not-prose",
-				children: /* @__PURE__ */ jsx(PageActions, {
-					copyMarkdown,
-					openDocs,
-					providers: openDocsProviders,
-					githubFileUrl
+				children: /* @__PURE__ */ jsx("div", {
+					className: "fd-actions-portal",
+					"data-actions-alignment": pageActionsAlignment,
+					children: /* @__PURE__ */ jsx(PageActions, {
+						copyMarkdown,
+						openDocs,
+						providers: openDocsProviders,
+						alignment: pageActionsAlignment,
+						githubFileUrl
+					})
 				})
 			}),
 			/* @__PURE__ */ jsxs(DocsBody, {
@@ -225,6 +275,7 @@ function DocsPageClient({ tocEnabled, tocStyle = "default", breadcrumbEnabled =
 						style: { flex: 1 },
 						children: decoratedChildren
 					}),
+					titleDecorationsPortal,
 					feedbackEnabled && /* @__PURE__ */ jsx(DocsFeedback, {
 						pathname: normalizedPath,
 						entry,

package/dist/page-actions.d.mts

@@ -11,6 +11,7 @@ interface PageActionsProps {
   copyMarkdown?: boolean;
   openDocs?: boolean;
   providers?: SerializedProvider[];
+  alignment?: "left" | "right";
   /** GitHub file URL (edit view) for the current page. Used when urlTemplate contains {githubUrl}. */
   githubFileUrl?: string | null;
 }
@@ -18,6 +19,7 @@ declare function PageActions({
   copyMarkdown,
   openDocs,
   providers,
+  alignment,
   githubFileUrl
 }: PageActionsProps): react_jsx_runtime0.JSX.Element | null;
 //#endregion

package/dist/page-actions.mjs

@@ -72,7 +72,7 @@ const DEFAULT_PROVIDERS = [{
 	name: "Claude",
 	urlTemplate: "https://claude.ai/new?q=Read+{mdxUrl},+I+want+to+ask+questions+about+it."
 }];
-function PageActions({ copyMarkdown, openDocs, providers, githubFileUrl }) {
+function PageActions({ copyMarkdown, openDocs, providers, alignment = "left", githubFileUrl }) {
 	const [copied, setCopied] = useState(false);
 	const [dropdownOpen, setDropdownOpen] = useState(false);
 	const dropdownRef = useRef(null);
@@ -115,6 +115,7 @@ function PageActions({ copyMarkdown, openDocs, providers, githubFileUrl }) {
 	return /* @__PURE__ */ jsxs("div", {
 		className: "fd-page-actions",
 		"data-page-actions": true,
+		"data-actions-alignment": alignment,
 		children: [copyMarkdown && /* @__PURE__ */ jsxs("button", {
 			type: "button",
 			onClick: handleCopyMarkdown,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@farming-labs/theme",
-  "version": "0.0.62",
+  "version": "0.0.64",
   "description": "Theme package for @farming-labs/docs — layout, provider, MDX components, and styles",
   "keywords": [
     "docs",
@@ -115,7 +115,7 @@
     "tsdown": "^0.20.3",
     "typescript": "^5.9.3",
     "vitest": "^3.2.4",
-    "@farming-labs/docs": "0.0.62"
+    "@farming-labs/docs": "0.0.64"
   },
   "peerDependencies": {
     "@farming-labs/docs": ">=0.0.1",

package/styles/base.css

@@ -252,6 +252,7 @@ figure.shiki:has(figcaption) figcaption {
 
 /* ─── Page Actions (Copy Markdown / Open in …) ────────────────────── */
 
+.fd-page-actions,
 [data-page-actions] {
   display: flex;
   flex-direction: row;
@@ -259,12 +260,17 @@ figure.shiki:has(figcaption) figcaption {
   gap: 0.5rem;
   margin-bottom: 0.75rem;
   margin-top: 0.25rem;
+  width: 100%;
 }
 
+[data-page-actions][data-actions-alignment="right"],
+.fd-page-actions[data-actions-alignment="right"],
 [data-actions-alignment="right"] > [data-page-actions] {
   justify-content: flex-end;
 }
 
+[data-page-actions][data-actions-alignment="left"],
+.fd-page-actions[data-actions-alignment="left"],
 [data-actions-alignment="left"] > [data-page-actions] {
   justify-content: flex-start;
 }