import { cn } from "../../utils/cn.mjs";
import { Link } from "../Link/Link.mjs";
import { H1, H2, H3, H4, H5, H6 } from "../Headers/index.mjs";
import { CodeProvider } from "../IDE/CodeContext.mjs";
import { Code } from "../IDE/Code.mjs";
import { TabProvider } from "../Tab/TabContext.mjs";
import { Tab } from "../Tab/Tab.mjs";
import { Table } from "../Table/Table.mjs";
import { jsx } from "react/jsx-runtime";
import { renderMarkdown } from "react-intlayer";

//#region src/components/MarkDownRender/MarkDownRender.tsx
const getIntlayerMarkdownOptions = (isDarkMode) => ({ components: {
	h1: (props) => /* @__PURE__ */ jsx(H1, {
		isClickable: true,
		...props
	}),
	h2: (props) => /* @__PURE__ */ jsx(H2, {
		isClickable: true,
		className: "mt-16",
		...props
	}),
	h3: (props) => /* @__PURE__ */ jsx(H3, {
		isClickable: true,
		className: "mt-5",
		...props
	}),
	h4: (props) => /* @__PURE__ */ jsx(H4, {
		isClickable: true,
		className: "mt-3",
		...props
	}),
	h5: (props) => /* @__PURE__ */ jsx(H5, {
		isClickable: true,
		className: "mt-3",
		...props
	}),
	h6: (props) => /* @__PURE__ */ jsx(H6, {
		isClickable: true,
		className: "mt-3",
		...props
	}),
	code: ({ className, children, ...rest }) => {
		const content = String(children ?? "").replace(/\n$/, "");
		if (!!!className) return /* @__PURE__ */ jsx("strong", {
			className: "rounded bg-card/60 box-decoration-clone px-1 py-0.5 font-mono text-sm",
			children: content
		});
		const language = className?.replace(/lang(?:uage)?-/, "") || "plaintext";
		return /* @__PURE__ */ jsx(Code, {
			...rest,
			language,
			fileName: rest.title,
			showHeader: true,
			isDarkMode,
			children: content
		});
	},
	blockquote: ({ className, ...props }) => /* @__PURE__ */ jsx("blockquote", {
		className: cn("mt-5 gap-3 border-card border-l-4 pl-5 text-neutral", className),
		...props
	}),
	ul: ({ className, ...props }) => /* @__PURE__ */ jsx("ul", {
		className: cn("mt-5 flex list-disc flex-col gap-3 pl-5", className),
		...props
	}),
	ol: ({ className, ...props }) => /* @__PURE__ */ jsx("ol", {
		className: cn("mt-5 flex list-decimal flex-col gap-3 pl-5", className),
		...props
	}),
	img: ({ className, ...props }) => /* @__PURE__ */ jsx("img", {
		...props,
		alt: props.alt ?? "",
		loading: "lazy",
		className: cn("max-h-[80vh] max-w-full rounded-md", className),
		src: `${props.src}?raw=true`
	}),
	a: (props) => /* @__PURE__ */ jsx(Link, {
		isExternalLink: props.href?.startsWith("http"),
		underlined: true,
		...props,
		color: "neutral"
	}),
	pre: (props) => props.children,
	table: (props) => /* @__PURE__ */ jsx(Table, {
		isRollable: true,
		...props
	}),
	th: ({ className, ...props }) => /* @__PURE__ */ jsx("th", {
		className: cn("border-neutral border-b bg-neutral/10 p-4", className),
		...props
	}),
	tr: ({ className, ...props }) => /* @__PURE__ */ jsx("tr", {
		className: cn("hover:/10 hover:bg-neutral/10", className),
		...props
	}),
	td: ({ className, ...props }) => /* @__PURE__ */ jsx("td", {
		className: cn("border-neutral-500/50 border-b p-4", className),
		...props
	}),
	hr: ({ className, ...props }) => /* @__PURE__ */ jsx("hr", {
		className: cn("mx-6 mt-16 text-neutral", className),
		...props
	}),
	Tabs: (props) => /* @__PURE__ */ jsx(Tab, {
		...props,
		className: "rounded-xl border border-card",
		headerClassName: "sticky rounded-xl top-36 z-10 bg-background/70 backdrop-blur overflow-x-auto"
	}),
	Tab: Tab.Item,
	Columns: ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
		className: cn("flex gap-4 max-md:flex-col", className),
		...props
	}),
	Column: ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
		className: cn("flex-1", className),
		...props
	})
} });
/**
* MarkdownRenderer Component
*
* A comprehensive markdown renderer that transforms markdown text into rich,
* interactive HTML with custom styling and Intlayer integration. Supports
* code syntax highlighting, responsive tables, internationalized links,
* and automatic frontmatter stripping.
*
* @component
*/
const MarkdownRenderer = ({ children, isDarkMode, locale, forceBlock, preserveFrontmatter, tagfilter, components: componentsProp, wrapper }) => {
	const markdownOptions = getIntlayerMarkdownOptions(isDarkMode ?? false);
	return /* @__PURE__ */ jsx(CodeProvider, { children: /* @__PURE__ */ jsx(TabProvider, { children: renderMarkdown(children, {
		components: {
			...markdownOptions.components,
			code: ({ className, children, ...rest }) => {
				const content = String(children ?? "").replace(/\n$/, "");
				if (!!!className) return /* @__PURE__ */ jsx("strong", {
					className: "rounded bg-card/60 box-decoration-clone px-1 py-0.5 font-mono text-sm",
					children: content
				});
				const language = className?.replace(/lang(?:uage)?-/, "") || "plaintext";
				return /* @__PURE__ */ jsx(Code, {
					...rest,
					language,
					fileName: rest.title,
					showHeader: true,
					isDarkMode,
					children: content
				});
			},
			a: (props) => /* @__PURE__ */ jsx(Link, {
				isExternalLink: props.href?.startsWith("http"),
				underlined: true,
				locale,
				...props,
				color: "neutral"
			}),
			...componentsProp
		},
		wrapper: wrapper ?? markdownOptions.wrapper,
		forceBlock: forceBlock ?? markdownOptions.forceBlock,
		preserveFrontmatter: preserveFrontmatter ?? markdownOptions.preserveFrontmatter,
		tagfilter: tagfilter ?? markdownOptions.tagfilter
	}) }) });
};

//#endregion
export { MarkdownRenderer, getIntlayerMarkdownOptions };
//# sourceMappingURL=MarkDownRender.mjs.map