@farming-labs/theme 0.0.9 → 0.0.11

package/dist/code-block-copy-wrapper.d.mts

@@ -0,0 +1,13 @@
+import * as React$1 from "react";
+import { CodeBlockCopyData } from "@farming-labs/docs";
+
+//#region src/code-block-copy-wrapper.d.ts
+type PreProps = React$1.ComponentPropsWithoutRef<"pre">;
+/**
+ * Creates a wrapper around the default MDX `pre` component that calls
+ * `onCopyClick` when the user clicks the code block's copy button.
+ * The actual copy-to-clipboard is still done by the default component.
+ */
+declare function createPreWithCopyCallback(DefaultPre: React$1.ComponentType<PreProps> | "pre", onCopyClick?: (data: CodeBlockCopyData) => void): React$1.ComponentType<PreProps>;
+//#endregion
+export { createPreWithCopyCallback };

package/dist/code-block-copy-wrapper.mjs

@@ -0,0 +1,50 @@
+"use client";
+
+import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/code-block-copy-wrapper.tsx
+/**
+* Creates a wrapper around the default MDX `pre` component that calls
+* `onCopyClick` when the user clicks the code block's copy button.
+* The actual copy-to-clipboard is still done by the default component.
+*/
+function createPreWithCopyCallback(DefaultPre, onCopyClick) {
+	if (!onCopyClick) return typeof DefaultPre === "string" ? DefaultPre : DefaultPre;
+	function PreWithCopyCallback(props) {
+		const ref = React$1.useRef(null);
+		React$1.useEffect(() => {
+			const wrapper = ref.current;
+			if (!wrapper) return;
+			const figure = wrapper.closest("figure");
+			if (!figure) return;
+			const handleClick = (e) => {
+				if (!e.target.closest?.("button")) return;
+				const code = figure.querySelector("pre")?.querySelector("code");
+				if (!code) return;
+				const content = code.textContent ?? "";
+				const url = typeof window !== "undefined" ? window.location.href : "";
+				const language = code.getAttribute("data-language") ?? figure.getAttribute("data-language") ?? void 0;
+				onCopyClick({
+					title: figure.querySelector("[data-title]")?.textContent?.trim() ?? figure.querySelector(".fd-codeblock-title-text")?.textContent?.trim() ?? void 0,
+					content,
+					url,
+					language
+				});
+			};
+			figure.addEventListener("click", handleClick, true);
+			return () => figure.removeEventListener("click", handleClick, true);
+		}, [onCopyClick]);
+		const Pre = DefaultPre;
+		return /* @__PURE__ */ jsx("div", {
+			ref,
+			"data-fd-copy-wrapper": true,
+			style: { display: "contents" },
+			children: typeof Pre === "string" ? /* @__PURE__ */ jsx("pre", { ...props }) : /* @__PURE__ */ jsx(Pre, { ...props })
+		});
+	}
+	return PreWithCopyCallback;
+}
+
+//#endregion
+export { createPreWithCopyCallback };

package/dist/docs-layout.d.mts

@@ -1,6 +1,6 @@
 import { ReactNode } from "react";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
-import { DocsConfig } from "@farming-labs/docs";
+import { DocsConfig, PageFrontmatter } from "@farming-labs/docs";
 
 //#region src/docs-layout.d.ts
 /**
@@ -16,23 +16,19 @@ import { DocsConfig } from "@farming-labs/docs";
  */
 declare function createDocsMetadata(config: DocsConfig): Record<string, unknown>;
 /**
- * Generate page-level metadata with dynamic OG images.
+ * Generate page-level metadata with dynamic or static OG/twitter.
+ * When the page has `openGraph` or `twitter` in frontmatter, those are used (static OG).
+ * Otherwise uses `ogImage` or the config dynamic endpoint.
  *
  * Usage in a docs page or [[...slug]] route:
  * ```ts
  * export function generateMetadata({ params }) {
  *   const page = getPage(params.slug);
- *   return createPageMetadata(docsConfig, {
- *     title: page.data.title,
- *     description: page.data.description,
- *   });
+ *   return createPageMetadata(docsConfig, page.data);
  * }
  * ```
  */
-declare function createPageMetadata(config: DocsConfig, page: {
-  title: string;
-  description?: string;
-}): Record<string, unknown>;
+declare function createPageMetadata(config: DocsConfig, page: Pick<PageFrontmatter, "title" | "description" | "ogImage" | "openGraph" | "twitter">, baseUrl?: string): Record<string, unknown>;
 declare function createDocsLayout(config: DocsConfig): ({
   children
 }: {

package/dist/docs-layout.mjs

@@ -8,6 +8,7 @@ import fs from "node:fs";
 import path from "node:path";
 import matter from "gray-matter";
 import { DocsLayout } from "fumadocs-ui/layouts/docs";
+import { buildPageOpenGraph, buildPageTwitter } from "@farming-labs/docs";
 
 //#region src/docs-layout.tsx
 /** Resolve a frontmatter `icon` string to a ReactNode via the icon registry. */
@@ -231,42 +232,28 @@ function createDocsMetadata(config) {
 	return result;
 }
 /**
-* Generate page-level metadata with dynamic OG images.
+* Generate page-level metadata with dynamic or static OG/twitter.
+* When the page has `openGraph` or `twitter` in frontmatter, those are used (static OG).
+* Otherwise uses `ogImage` or the config dynamic endpoint.
 *
 * Usage in a docs page or [[...slug]] route:
 * ```ts
 * export function generateMetadata({ params }) {
 *   const page = getPage(params.slug);
-*   return createPageMetadata(docsConfig, {
-*     title: page.data.title,
-*     description: page.data.description,
-*   });
+*   return createPageMetadata(docsConfig, page.data);
 * }
 * ```
 */
-function createPageMetadata(config, page) {
-	const og = config.og;
+function createPageMetadata(config, page, baseUrl) {
 	const result = {
 		title: page.title,
 		...page.description ? { description: page.description } : {}
 	};
-	if (og?.enabled !== false && og?.endpoint) {
-		const ogUrl = `${og.endpoint}?title=${encodeURIComponent(page.title)}${page.description ? `&description=${encodeURIComponent(page.description)}` : ""}`;
-		result.openGraph = {
-			title: page.title,
-			description: page.description,
-			images: [{
-				url: ogUrl,
-				width: 1200,
-				height: 630
-			}]
-		};
-		result.twitter = {
-			card: "summary_large_image",
-			title: page.title,
-			description: page.description,
-			images: [ogUrl]
-		};
+	if (config.og?.enabled !== false) {
+		const openGraph = buildPageOpenGraph(page, config.og, baseUrl);
+		if (openGraph) result.openGraph = openGraph;
+		const twitter = buildPageTwitter(page, config.og, baseUrl);
+		if (twitter) result.twitter = twitter;
 	}
 	return result;
 }

package/dist/index.d.mts

@@ -5,8 +5,8 @@ import { DocsPageClient } from "./docs-page-client.mjs";
 import { RootProvider } from "./provider.mjs";
 import { PageActions } from "./page-actions.mjs";
 import { DocsLayout } from "fumadocs-ui/layouts/docs";
-import { DocsBody, DocsPage } from "fumadocs-ui/layouts/docs/page";
 import { AIConfig, BreadcrumbConfig, CopyMarkdownConfig, DocsConfig, DocsMetadata, DocsNav, DocsTheme, FontStyle, OGConfig, OpenDocsConfig, OpenDocsProvider, PageActionsConfig, PageFrontmatter, SidebarConfig, ThemeToggleConfig, TypographyConfig, UIConfig, createTheme, deepMerge, defineDocs, extendTheme } from "@farming-labs/docs";
+import { DocsBody, DocsPage } from "fumadocs-ui/layouts/docs/page";
 import { Tab, Tabs } from "fumadocs-ui/components/tabs";
 import { CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, Pre } from "fumadocs-ui/components/codeblock";
 export { type AIConfig, type BreadcrumbConfig, CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, type CopyMarkdownConfig, DocsBody, DocsCommandSearch, type DocsConfig, DocsLayout, type DocsMetadata, type DocsNav, DocsPage, DocsPageClient, type DocsTheme, type FontStyle, DefaultUIDefaults as FumadocsUIDefaults, type OGConfig, type OpenDocsConfig, type OpenDocsProvider, PageActions, type PageActionsConfig, type PageFrontmatter, Pre, RootProvider, type SidebarConfig, Tab, Tabs, type ThemeToggleConfig, type TypographyConfig, type UIConfig, createDocsLayout, createDocsMetadata, createPageMetadata, createTheme, deepMerge, defineDocs, extendTheme, fumadocs };

package/dist/index.mjs

@@ -5,8 +5,8 @@ import { createDocsLayout, createDocsMetadata, createPageMetadata } from "./docs
 import { RootProvider } from "./provider.mjs";
 import { DefaultUIDefaults, fumadocs } from "./default/index.mjs";
 import { DocsLayout } from "fumadocs-ui/layouts/docs";
-import { DocsBody, DocsPage } from "fumadocs-ui/layouts/docs/page";
 import { createTheme, deepMerge, defineDocs, extendTheme } from "@farming-labs/docs";
+import { DocsBody, DocsPage } from "fumadocs-ui/layouts/docs/page";
 import { Tab, Tabs } from "fumadocs-ui/components/tabs";
 import { CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, Pre } from "fumadocs-ui/components/codeblock";
 

package/dist/mdx.d.mts

@@ -1,6 +1,7 @@
 import { MDXImg } from "./mdx-img.mjs";
-import * as react from "react";
+import React from "react";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { CodeBlockCopyData } from "@farming-labs/docs";
 import { Tab, Tabs } from "fumadocs-ui/components/tabs";
 import * as fumadocs_ui_components_codeblock0 from "fumadocs-ui/components/codeblock";
 import defaultMdxComponents from "fumadocs-ui/mdx";
@@ -16,22 +17,26 @@ declare const extendedMdxComponents: {
   CodeBlockTabs: typeof fumadocs_ui_components_codeblock0.CodeBlockTabs;
   CodeBlockTabsList: typeof fumadocs_ui_components_codeblock0.CodeBlockTabsList;
   CodeBlockTabsTrigger: typeof fumadocs_ui_components_codeblock0.CodeBlockTabsTrigger;
-  pre: (props: react.HTMLAttributes<HTMLPreElement>) => react_jsx_runtime0.JSX.Element;
+  pre: (props: React.HTMLAttributes<HTMLPreElement>) => react_jsx_runtime0.JSX.Element;
   Card: typeof fumadocs_ui_components_card0.Card;
   Cards: typeof fumadocs_ui_components_card0.Cards;
-  a: react.FC<react.AnchorHTMLAttributes<HTMLAnchorElement>>;
-  h1: (props: react.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
-  h2: (props: react.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
-  h3: (props: react.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
-  h4: (props: react.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
-  h5: (props: react.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
-  h6: (props: react.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
-  table: (props: react.TableHTMLAttributes<HTMLTableElement>) => react_jsx_runtime0.JSX.Element;
+  a: React.FC<React.AnchorHTMLAttributes<HTMLAnchorElement>>;
+  h1: (props: React.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
+  h2: (props: React.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
+  h3: (props: React.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
+  h4: (props: React.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
+  h5: (props: React.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
+  h6: (props: React.HTMLAttributes<HTMLHeadingElement>) => react_jsx_runtime0.JSX.Element;
+  table: (props: React.TableHTMLAttributes<HTMLTableElement>) => react_jsx_runtime0.JSX.Element;
   Callout: typeof fumadocs_ui_components_callout0.Callout;
   CalloutContainer: typeof fumadocs_ui_components_callout0.CalloutContainer;
   CalloutTitle: typeof fumadocs_ui_components_callout0.CalloutTitle;
   CalloutDescription: typeof fumadocs_ui_components_callout0.CalloutDescription;
 };
-declare function getMDXComponents<T extends Record<string, unknown> = Record<string, unknown>>(overrides?: T): typeof extendedMdxComponents & T;
+interface GetMDXComponentsOptions {
+  /** Called when the user clicks the copy button on a code block (in addition to the default copy). */
+  onCopyClick?: (data: CodeBlockCopyData) => void;
+}
+declare function getMDXComponents<T extends Record<string, unknown> = Record<string, unknown>>(overrides?: T, options?: GetMDXComponentsOptions): typeof extendedMdxComponents & T;
 //#endregion
-export { Tab, Tabs, defaultMdxComponents, extendedMdxComponents, getMDXComponents };
+export { GetMDXComponentsOptions, Tab, Tabs, defaultMdxComponents, extendedMdxComponents, getMDXComponents };

package/dist/mdx.mjs

@@ -1,30 +1,25 @@
+import { createPreWithCopyCallback } from "./code-block-copy-wrapper.mjs";
 import { MDXImg } from "./mdx-img.mjs";
 import { Tab, Tabs } from "fumadocs-ui/components/tabs";
 import defaultMdxComponents from "fumadocs-ui/mdx";
 
 //#region src/mdx.ts
-/**
-* Re-export fumadocs-ui MDX components.
-*
-* Includes all default MDX components (headings, code blocks, callouts, cards)
-* plus Tabs/Tab for tabbed content and InstallTabs for package manager tabs.
-* Overrides `img` so that ![alt](url) in markdown works without width/height
-* (uses Next Image with unoptimized + default dimensions for external URLs).
-*
-* Usage in mdx-components.tsx:
-*   import { getMDXComponents } from "@farming-labs/theme/mdx";
-*/
 const extendedMdxComponents = {
 	...defaultMdxComponents,
 	img: MDXImg,
 	Tab,
 	Tabs
 };
-function getMDXComponents(overrides) {
-	return {
+function getMDXComponents(overrides, options) {
+	const base = {
 		...extendedMdxComponents,
 		...overrides
 	};
+	if (options?.onCopyClick) {
+		const DefaultPre = defaultMdxComponents.pre;
+		if (DefaultPre) base.pre = createPreWithCopyCallback(DefaultPre, options.onCopyClick);
+	}
+	return base;
 }
 
 //#endregion

package/package.json

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