"use client";
import { jsx } from 'react/jsx-runtime';
import { useMemo, memo } from 'react';
import ReactMarkdown from 'react-markdown';
import remarkGfm from 'remark-gfm';
import remarkMath from 'remark-math';
import { CodeBlock } from './codeblock.mjs';
import { cn } from '../../../lib/utils.mjs';

function Markdown({ children, className }) {
  const components = useMemo(() => {
    return {
      a({
        children: children2,
        href,
        className: className2
      }) {
        return /* @__PURE__ */ jsx(
          "a",
          {
            href,
            target: "_blank",
            rel: "noopener noreferrer",
            className: cn(className2, "text-blue-500 hover:text-blue-600"),
            children: children2
          }
        );
      },
      img({
        src,
        alt,
        className: className2
      }) {
        return /* @__PURE__ */ jsx("img", { src, alt, className: cn(className2, "w-full h-auto") });
      },
      code({ className: className2, children: children2, ...props }) {
        const match = /language-(\w+)/.exec(className2 || "");
        if (match) {
          return /* @__PURE__ */ jsx(
            CodeBlock,
            {
              language: match && match[1] || "",
              value: String(children2).replace(/\n$/, ""),
              ...props
            },
            Math.random()
          );
        }
        return /* @__PURE__ */ jsx("code", { className: cn(className2, "whitespace-pre-wrap"), ...props, children: children2 });
      }
    };
  }, []);
  const remarkPlugins = useMemo(() => {
    return [remarkGfm, remarkMath];
  }, []);
  return /* @__PURE__ */ jsx(
    MemoizedReactMarkdown,
    {
      className: cn(
        "prose break-words prose-headings:text-secondary-foreground prose-blockquote:text-secondary-foreground prose-strong:text-secondary-foreground prose-p:leading-relaxed prose-pre:p-0 prose-pre:m-1 prose-p:text-base prose-p:font-normal prose-p:my-1 prose-ul:my-1 prose-ol:my-1 prose-li:py-0 prose-li:my-0 max-w-none text-secondary-foreground prose-code:prose-headings:bg-secondary",
        className
      ),
      remarkPlugins,
      components,
      children
    }
  );
}
const MemoizedReactMarkdown = memo(
  ReactMarkdown,
  (prevProps, nextProps) => prevProps.children === nextProps.children && prevProps.className === nextProps.className
);

export { Markdown };
