import React from 'react';
import { Light as SyntaxHighlighter } from 'react-syntax-highlighter/dist/esm/light';
import { vs2015 } from 'react-syntax-highlighter/dist/esm/styles/hljs';
function createHeading(tag) {
    const Tag = tag;
    return function Heading({ children, ...rest }) {
        const { node, ...domProps } = rest;
        return React.createElement(Tag, { ...domProps }, children);
    };
}
/**
 * ReactMarkdown 的组件配置
 */
export const markdownComponents = {
    h1: createHeading('h1'),
    h2: createHeading('h2'),
    h3: createHeading('h3'),
    h4: createHeading('h4'),
    h5: createHeading('h5'),
    h6: createHeading('h6'),
    pre({ children }) {
        // pre 标签：直接返回 children，让 code 组件处理
        return React.createElement(React.Fragment, null, children);
    },
    code({ inline, className: codeClassName, children, ...codeProps }) {
        // 判断是否是内联代码
        // inline === true 表示内联代码
        // inline === false 或 undefined 且没有 language- 类名，也可能是内联代码
        const hasLanguageClass = codeClassName && /language-/.test(codeClassName);
        const isInlineCode = inline === true || (!hasLanguageClass && inline !== false);
        // 检查内容是否为空或只有空白
        const content = children ? String(children).trim() : '';
        const isEmpty = !content || content.length === 0;
        if (isInlineCode && !isEmpty) {
            // 内联代码：使用默认样式
            return (React.createElement("code", { className: codeClassName, ...codeProps }, children));
        }
        if (isEmpty) {
            // 空内容：直接返回，不渲染为 code 标签
            return React.createElement(React.Fragment, null, children);
        }
        // 代码块：添加容器以支持横向滚动
        const match = /language-(\w+)/.exec(codeClassName || '');
        const language = match && match[1] ? match[1] : 'text';
        const childrenStr = children ? String(children).replace(/\n$/, '') : '';
        // 生产构建下 SyntaxHighlighter 可能为 undefined（React #130），用 pre/code 兜底避免白屏
        const canUseHighlighter = typeof SyntaxHighlighter === 'function' && vs2015 != null;
        if (!canUseHighlighter) {
            return (React.createElement("div", { className: "cn-ai-agent__code-block-wrapper" },
                React.createElement("pre", { style: {
                        margin: 0,
                        padding: '12px 16px',
                        borderRadius: '8px',
                        fontSize: '13px',
                        lineHeight: 1.5,
                        overflowX: 'auto',
                        maxWidth: '100%',
                        background: '#1e1e1e',
                        color: '#d4d4d4',
                    } },
                    React.createElement("code", null, childrenStr))));
        }
        return (React.createElement("div", { className: "cn-ai-agent__code-block-wrapper" },
            React.createElement(SyntaxHighlighter, { style: vs2015, language: language, PreTag: "div", customStyle: {
                    margin: 0,
                    padding: '12px 16px',
                    borderRadius: '8px',
                    fontSize: '13px',
                    lineHeight: '1.5',
                    overflowX: 'auto',
                    maxWidth: '100%',
                } }, childrenStr)));
    },
    table({ children: tableChildren }) {
        if (!tableChildren) {
            return null;
        }
        return (React.createElement("div", { className: "cn-ai-agent__table-wrapper" },
            React.createElement("table", { className: "cn-ai-agent__table" }, tableChildren)));
    },
    a({ href, children: linkChildren }) {
        if (!href) {
            return React.createElement("span", null, linkChildren);
        }
        return (React.createElement("a", { href: href, target: "_blank", rel: "noopener noreferrer" }, linkChildren));
    },
    ul({ children: ulChildren }) {
        return React.createElement("ul", { className: "cn-ai-agent__list_ul" }, ulChildren);
    },
    ol({ children: olChildren }) {
        return React.createElement("ol", { className: "cn-ai-agent__list_ol" }, olChildren);
    },
    li({ children: liChildren }) {
        return React.createElement("li", { className: "cn-ai-agent__list-item" }, liChildren);
    },
};
export const markdownComponents2 = {
    // 自定义渲染组件
    h1: ({ children, ...restProps }) => (React.createElement("h1", { className: "markdown-body__h1", ...restProps }, children)),
    h2: ({ children, ...restProps }) => (React.createElement("h2", { className: "markdown-body__h2", ...restProps }, children)),
    h3: ({ children, ...restProps }) => (React.createElement("h3", { className: "markdown-body__h3", ...restProps }, children)),
    h4: ({ children, ...restProps }) => (React.createElement("h4", { className: "markdown-body__h4", ...restProps }, children)),
    h5: ({ children, ...restProps }) => (React.createElement("h5", { className: "markdown-body__h5", ...restProps }, children)),
    h6: ({ children, ...restProps }) => (React.createElement("h6", { className: "markdown-body__h6", ...restProps }, children)),
    p: ({ children, ...restProps }) => (React.createElement("p", { className: "markdown-body__p", ...restProps }, children)),
    ul: ({ children, ...restProps }) => (React.createElement("ul", { className: "markdown-body__ul", ...restProps }, children)),
    ol: ({ children, ...restProps }) => (React.createElement("ol", { className: "markdown-body__ol", ...restProps }, children)),
    li: ({ children, ...restProps }) => (React.createElement("li", { className: "markdown-body__li", ...restProps }, children)),
    blockquote: ({ children, ...restProps }) => (React.createElement("blockquote", { className: "markdown-body__blockquote", ...restProps }, children)),
    code: ({ inline, children, className: codeClassName, ...restProps }) => {
        if (inline) {
            return (React.createElement("code", { className: "markdown-body__code-inline", ...restProps }, children));
        }
        return (React.createElement("pre", { className: "markdown-body__pre" },
            React.createElement("code", { className: "markdown-body__code-block", ...restProps }, children)));
    },
    a: ({ children, ...restProps }) => (React.createElement("a", { className: "markdown-body__a", ...restProps }, children)),
    img: ({ ...restProps }) => React.createElement("img", { className: "markdown-body__img", ...restProps }),
    table: ({ children, ...restProps }) => (React.createElement("table", { className: "markdown-body__table", ...restProps }, children)),
    thead: ({ children, ...restProps }) => (React.createElement("thead", { className: "markdown-body__thead", ...restProps }, children)),
    tbody: ({ children, ...restProps }) => (React.createElement("tbody", { className: "markdown-body__tbody", ...restProps }, children)),
    tr: ({ children, ...restProps }) => (React.createElement("tr", { className: "markdown-body__tr", ...restProps }, children)),
    th: ({ children, ...restProps }) => (React.createElement("th", { className: "markdown-body__th", ...restProps }, children)),
    td: ({ children, ...restProps }) => (React.createElement("td", { className: "markdown-body__td", ...restProps }, children)),
    hr: (restProps) => React.createElement("hr", { className: "markdown-body__hr", ...restProps }),
};
